Multi-Chapter Affiliation Chip Widget
Component Detail
Description
Reusable chip/tag widget displaying a contact's membership across up to 5 local chapters simultaneously (NHF requirement). Supports both read-only display and interactive multi-select mode for the edit screen.
multi-chapter-affiliation-chip
Summaries
The Multi-Chapter Affiliation Chip Widget directly addresses a core operational requirement for NHF: the ability to represent and manage a contact's simultaneous membership across up to five local chapters within a single, intuitive interface element. Without this capability, coordinators would need to manage chapter affiliations through separate workflows, increasing the risk of affiliation data becoming inconsistent or incomplete. By providing a reusable, standardized chip component that works in both display and edit contexts, the product ensures that chapter relationships are always visible and always accurate across every screen where they appear. This consistency builds trust in the data and reduces the coordination overhead that comes from ambiguous or missing affiliation records — directly supporting NHF's multi-chapter operational model.
This is a shared, medium-complexity UI widget that is consumed by both the Contact Detail Screen and the Edit Contact Screen, making it a dependency that must be delivered before either of those screens reaches its integration milestone. Because it is shared, any interface changes after initial delivery will require coordinated updates across both consuming screens — freeze the interface contract early and communicate it to the team. The multi-select interaction mode has specific behavioral requirements: no duplicate selections, a maximum of five chapters, and event emission on every selection change. These rules should be captured as unit test cases.
The read-only display mode is simpler and can be delivered first, unblocking the detail screen while the interactive mode for the edit screen is finalized. Accessibility testing for chip focus order and selection announcement is required before release.
The Multi-Chapter Affiliation Chip Widget is a reusable Flutter widget in the mobile execution context with no external service dependencies, making it straightforward to develop and test in isolation. It maintains its own internal selection state (List
The chapter data model is the only schema dependency. Key implementation concerns: enforce the five-chapter maximum at the widget level with a guard in onChapterSelected; prevent duplicate entries by checking existing selection before appending. Since this widget is shared, its public interface and behavior contract must be documented clearly. Consider using a ValueNotifier or StreamController internally to decouple state from the render cycle.
Responsibilities
- Display chapter affiliations as labeled chips in read mode
- Provide multi-select interaction for chapter assignment in edit mode
- Prevent duplicate chapter selection
- Emit selection change events to parent form
Interfaces
build(BuildContext context)
onChapterSelected(Chapter chapter)
onChapterRemoved(Chapter chapter)
getSelectedChapters() -> List<Chapter>
setChapters(List<Chapter> chapters)
Relationships
Dependents (2)
Components that depend on this component