User Interface
259 components in the user interface layer
User Interface components handle presentation logic, user interactions, and visual elements of the application.
A reusable card widget that displays a single organization's logo, name, and visual branding. Handles tap interactions and communicates sele...
The pre-login entry point screen that presents available organizations for the user to select before authentication. Renders a list of organ...
WCAG 2.2 AA compliant email and password form widget. Renders accessible AppTextField components for credentials, an AppButton for submissio...
The root screen for email/password authentication, composing the login form within a keyboard-aware, scrollable layout. Handles screen-level...
Accessible icon button embedded within the password field that toggles between obscured and visible password text. Meets WCAG 2.2 AA touch t...
Screen presented after organization selection that lets the user choose between BankID, Vipps, or email/password login. Renders method cards...
Handles the BankID authentication flow, rendering an embedded WebView or triggering a redirect to the BankID broker. Displays progress and e...
Presents the biometric prompt (Face ID or fingerprint) for returning users who have already completed BankID or Vipps first-time verificatio...
Inline widget shown after a successful Vipps login that informs the user that their national identity number has been retrieved and shared w...
Initiates and displays the Vipps Login OAuth flow. Handles the redirect to the Vipps app or Vipps web, monitors the deep-link callback, and ...
Full-screen overlay displayed on app resume that triggers the native biometric authentication dialog. Shows the app logo, a brief prompt mes...
Inline banner or modal shown when biometric hardware is absent or not enrolled on the device. Guides the user to device settings to enable b...
Displayed to global admin users on the mobile app, since their administration is performed via a separate admin portal. Communicates clearly...
Shared widget that allows users holding multiple roles to switch their active role within the app session. Triggers role state update and ca...
Bottom navigation bar that conditionally renders tabs and restricts navigation options based on the user's active role. Integrates with Stat...
Renders distinct home screen content based on the authenticated user's active role. Displays coordinator dashboards, peer mentor activity su...
Full-screen terminal route widget displayed when the authenticated user's role is not permitted to use the mobile application. Renders the o...
The primary modal entry point for activity logging, implemented as a bottom-sheet wizard container. Hosts all wizard steps in sequence and m...
Wizard step 1 that presents available activity types as selectable chips or list items. Pre-selects the most recently used activity type fro...
Wizard step 2 that defaults to today's date with a calendar picker available for override. The default state satisfies the overwhelming majo...
Wizard step 3 offering preset duration chips (15 min, 30 min, 1 h, 2 h) for one-tap selection, backed by a free-entry fallback for non-stand...
Wizard step 4 providing a free-text notes field that is fully optional and clearly labelled as such. Supports both keyboard input and OS-lev...
The terminal state of the wizard that displays a strong, unambiguous visual confirmation that the activity record was saved. Designed to eli...
Admin portal screen for managing the per-organisation catalogue of activity types. Displays a list of all configured activity types with the...
Create and edit form screen in the admin portal for configuring a single activity type. Captures display name, metadata flags, Bufdir catego...
Mobile screen shown during the activity registration wizard that allows a peer mentor to pick an activity type from their organisation's cat...
Renders form fields at runtime from a JSON field schema fetched from Supabase. Supports text, multiline text, checkbox group, radio, and dat...
The primary screen for composing and submitting a structured report after a home visit or one-on-one session. Renders all org-specific field...
A per-field microphone trigger widget that activates Flutter's speech_to_text package and appends the transcription result into the associat...
A dedicated UI section within the report form for entering one or more 'way forward' entries that function as task handoffs to the coordinat...
Coordinator-facing screen displaying all expense claims that exceed the auto-approval threshold and require manual review. Lists pending cla...
Blindeforbundet-specific form extension rendered conditionally when the activity type involves client transport. Captures driver honorarium ...
Primary screen for logging travel expenses attached to an activity record. Presents the expense type selector, dynamic form fields based on ...
Read-only card widget displayed on the activity detail view summarising the attached expense claim, its approval status badge, and a link to...
Custom multi-select widget that enforces mutual exclusion rules between logically incompatible expense types (e.g. kilometre allowance and b...
Reusable widget for capturing or selecting a receipt photo via the device camera or gallery using image_picker. Displays the attached image ...
Review screen presented before final submission in bulk mode, listing all selected peer mentors alongside the single activity record that wi...
Multi-select version of the peer mentor contact list specifically for bulk mode, allowing coordinators to select several peer mentors simult...
Searchable list of peer mentors drawn from the coordinator's existing contact list, allowing selection of exactly one peer mentor for single...
Adaptation of the standard activity wizard that visibly indicates the coordinator is recording on behalf of another person. Displays a persi...
Reusable inline widget that renders a subtle 'Recorded by coordinator' badge on any activity card or detail view where recorded_by_user_id d...
Entry screen allowing coordinators to choose between single-proxy mode (one peer mentor) and bulk mode (multiple peer mentors). Presents cle...
Bar or line chart rendered via fl_chart showing activity volume over time within the selected window. Provides visual context for trends acr...
Aggregated statistics screen for coordinators showing totals across all peer mentors in their local chapter(s). Supports multi-chapter coord...
Scrollable list shown on the coordinator stats screen enumerating all peer mentors in scope with their individual totals for the selected ti...
The primary statistics screen shown to peer mentors displaying their own aggregated totals for the selected time window. Shows session count...
A row of stat cards displaying the key KPIs: total sessions, total hours, and (for peer mentors) pending reimbursement amount. Uses the desi...
Segmented control or tab bar widget allowing the user to switch between current month, quarter, and year time windows. Emits a TimeWindow va...
Main screen for initiating a Bufdir export. Hosts scope selector, period picker, preview panel, and confirmation flow in a single scrollable...
Modal dialog that presents a final summary to the user and requests explicit confirmation before generating the export. Offers format select...
Lists previously generated Bufdir exports for the current scope, showing date, period, format, and download status. Allows re-downloading pa...
Date range picker pre-configured with common Bufdir reporting periods (quarterly, annual). Users can also pick a custom date range. Validate...
Displays a structured summary of the data that will be included in the export before the user confirms: number of peer mentors, total activi...
Full-screen loading overlay displayed while the Supabase Edge Function processes the export. Shows progress messaging and cancellation optio...
Dropdown or segmented control allowing the user to choose the organisational scope of the export: local chapter, region, or national level. ...
Coordinator-only screen that lists all activity records flagged as potential duplicates where the submitting peer mentor has not yet resolve...
Reusable widget that renders a structured side-by-side or stacked comparison of two activity records, highlighting differing fields. Used in...
Non-blocking modal bottom sheet that surfaces when a potential duplicate activity is detected during submission. Presents the side-by-side c...
Reusable card widget displaying a contact's key information (name, role, organization, notes snippet). Styled with design tokens and meets W...
Main screen rendering role-specific contact list views for coordinators, org admins, and peer mentors. Composes the search bar, view switche...
Accessible search input component with debounce support for filtering contacts by name and notes. Built on the shared AppTextField widget an...
Toggle control that switches the list between contact view and peer mentor view, notably required for Barnekreftforeningen. Renders as a seg...
Reusable card widget for displaying peer mentor-specific information including availability status, assigned members count, and certificatio...
Scrollable list section within the contact detail screen showing the contact's past activities, dates, and durations. Provides an at-a-glanc...
Badge or status chip displaying the current assignment state (open, pending, completed) for Blindeforbundet contacts. Uses organization-spec...
Main screen displaying the full profile of a contact or peer mentor, including affiliation, role, and activity history. Adapts layout and vi...
Form screen allowing coordinators and admins to update contact information using AppTextField and custom fields table widgets. Enforces clie...
Specialized display layer for Blindeforbundet's sensitive contact data (name, address, medical summary). Reveals decrypted content only on e...
Reusable chip/tag widget displaying a contact's membership across up to 5 local chapters simultaneously (NHF requirement). Supports both rea...
Scrollable list section displaying the contacts currently assigned to this peer mentor. Each row shows contact name, assignment date, and la...
Conditional banner displayed when a peer mentor's HLF certification has expired or is within 30 days of expiry. Presents a clear call-to-act...
Reusable widget rendering a pill-shaped badge indicating a peer mentor's certification state: active, paused, or expired. Uses design token ...
Card panel displaying aggregated activity statistics for the peer mentor: total activities, hours logged, and activity breakdown by type. Pr...
Top-level Flutter screen widget that orchestrates the peer mentor profile view. Assembles all sub-sections (profile header, status badge, as...
Displays the peer mentor's avatar, full name, organization label, and primary status badge in a prominent card at the top of the detail scre...
Primary UI control on the peer mentor profile screen that allows a mentor to toggle their status between active and paused. Displays current...
Modal dialog that prompts the peer mentor to confirm a pause action and optionally provide a reason. Communicates that the coordinator will ...
Informational banner shown on coordinator-facing peer mentor list and detail views when a mentor is paused. Prevents coordinators from unkno...
Displays all chapter memberships for a contact on their profile screen, showing up to 5 simultaneous local chapter affiliations. Renders eac...
Modal or bottom-sheet UI allowing coordinators to add or remove chapter affiliations for a contact, enforcing the maximum of 5 simultaneous ...
Dismissible warning dialog surfaced during activity submission when the system detects a potential duplicate across coordinators from differ...
A semantically labeled TextField for entering search queries, supporting screen readers (VoiceOver/JAWS) via Semantics widget and voice-to-t...
Main screen for searching contacts and notes, providing a search input field and a filtered results list. Renders ContactCard and PeerMentor...
Displays filtered search results as a scrollable list of ContactCard and PeerMentorCard widgets. The list is wrapped in a Semantics widget s...
Dedicated screen for registering a recurring group activity across multiple peer mentors simultaneously. Coordinator selects a recurring act...
Reusable multi-select contact list widget that allows coordinators to pick one or more peer mentors from their managed contacts. Supports se...
Confirmation step presented before final proxy submission, showing a full summary of the activity details and the complete list of attribute...
Primary screen allowing coordinators to register a single activity on behalf of a specific peer mentor. Displays the acting coordinator iden...
Dropdown or bottom-sheet selector that lists the coordinator's saved recurring activity templates. Populates the bulk registration form with...
Modal dialog shown to peer mentors when they are invited to share their location. Explains what data is collected, how it is used, and links...
Persistent toggle button always visible on the map screen that switches between the interactive map view and the accessible list view fallba...
Collapsible filter panel allowing coordinators to narrow visible mentor markers by availability status or specialization. Emits filter chang...
Main interactive map screen displaying peer mentor locations as clickable markers. Renders the full-screen map canvas with overlay controls ...
Overlay card displayed when a mentor marker is tapped, showing name, specializations, and availability. Includes a deep link button navigati...
Accessible list-based alternative to the map that always remains available for screen reader users and low-vision users who cannot interact ...
Custom map marker widget representing a single peer mentor on the map. Displays availability status via color coding and opens a detail popu...
Displays the automatically computed reimbursement estimate for the current selection in real time. Updates as the user selects or deselects ...
A stateful multi-select widget presenting the four fixed expense categories (kilometers driven, tolls, parking, public transit) as discrete ...
A numeric Flutter input field for entering kilometres driven. Accepts a pre-filled default from the last-used distance cache and fires a cal...
The primary Flutter form screen allowing peer mentors to log a mileage claim. Renders origin, optional destination, and distance fields with...
A stateful Flutter widget that reactively shows the calculated payout as the peer mentor enters or adjusts the distance. Calculation is perf...
A reusable Flutter widget pair providing the origin text field and the optional destination text field. The destination field is clearly lab...
Compact inline widget shown on the expense form step to indicate whether a receipt is attached, required, or optional based on the configure...
Inline bottom sheet presented within the expense wizard that offers camera capture and file-picker upload options without navigating away fr...
Displays a thumbnail of the captured or selected receipt image before form submission. Shows a remove button, file type indicator for PDFs, ...
Modal bottom sheet presented when a coordinator reviews an individual claim. Provides approve and reject actions with an optional freetext c...
Sticky bottom action bar that appears when one or more claims are selected in the review queue. Displays the count of selected items and pro...
Read-only timeline widget embedded in the claim detail screen, showing every state transition with actor, timestamp, and optional comment. D...
Compact, reusable chip widget that renders the current status of a claim (draft, submitted, approved, rejected, exported) with a distinct co...
Paginated list screen displaying all pending expense claims awaiting coordinator review. Supports multi-select for bulk approval and provide...
Screen presented to the driver to read and confirm receipt of the confidentiality declaration. Implements a lightweight e-signature flow usi...
Screen that allows a coordinator or peer mentor to attach an existing confidentiality declaration template or trigger electronic delivery to...
Compact UI widget that displays the current status of a confidentiality declaration (pending, sent, acknowledged, expired) with appropriate ...
List view showing all recorded driver assignments for a coordinator, including linked contact, fee amount, date, and declaration status. Sup...
Wrapper widget that conditionally renders driver-related UI elements based on the organization-level feature flag. Ensures driver fee fields...
Form screen for recording a driving assignment linked to a specific contact, capturing the agreed driver fee amount, and initiating the conf...
Main administrative screen where coordinators and org admins initiate accounting system exports. Displays available export configurations pe...
Modal dialog shown after an export run completes. Summarizes the number of expense claims included in the export file, lists any claims skip...
Reusable UI component for selecting a configurable start and end date for export operations. Used in both accounting export and Bufdir repor...
Panel within the accounting export screen that lists previous export runs for the organization, showing timestamp, triggered-by user, claim ...
Shows the status of an in-progress aggregation computation, providing visual feedback when Supabase RPC functions are executing. Displays wa...
Displays a real-time summary of aggregated Bufdir metrics for the current reporting period, including participant counts, activity hours, an...
Reusable date range selection widget used when predefined presets do not cover the required period. Enforces logical date ordering and surfa...
Renders the list of predefined period options (calendar year, Bufdir fiscal periods) sourced from the organization's configuration. Each pre...
Primary screen allowing coordinators and organization admins to choose a Bufdir report period. Displays predefined grant-cycle period option...
Displays the number of activity records falling within the selected period and warns the user if the period end date is in the future or if ...
Renders a single label-value pair from the Bufdir form with an inline validation state indicator. Supports three visual states: normal, warn...
Full-screen preview of the assembled Bufdir report, organized into the official form's sections and field order. Renders all aggregated figu...
Renders a single named section of the Bufdir report (e.g., 'Individrettede aktiviteter', 'Gruppetilbud') as a collapsible card containing a ...
Optional side-by-side or inline diff panel that shows each numeric field's value for the current reporting period alongside the correspondin...
Sticky banner at the top of the preview screen that summarises the number and severity of validation issues found in the current report draf...
Card widget representing a single past Bufdir report entry. Displays the reporting period, generation timestamp, generating user name, and a...
Main screen displaying a chronological list of all previously generated Bufdir reports scoped to the organization. Shows period covered, gen...
Inline summary widget displayed per report entry showing key figures extracted at generation time — total activities, total hours, and parti...
Scrollable list widget displaying peer mentors selected for a bulk registration. Each row shows the mentor's name, a duplicate-conflict badg...
Screen for coordinators to register the same recurring activity (e.g. weekly training session) for multiple peer mentors in a single operati...
Modal dialog displayed when the duplicate detection service identifies a conflicting activity record for the same peer mentor, date, and act...
Reusable activity form pre-configured for proxy entry. Shows all standard activity fields (date, type, duration, notes) and adds an attribut...
Search and select widget that lets a coordinator pick one or more peer mentors from their chapter's roster. Supports typeahead search by nam...
Main screen allowing coordinators to register an activity on behalf of a single peer mentor. Presents a peer mentor selector followed by the...
In-app warning component shown to coordinators when a peer mentor's certification is approaching expiry. Displays days remaining and provide...
Dedicated screen for coordinators to view all peer mentors under their management with their current pause and certification statuses. Suppo...
Reusable date selection widget used within the pause activation flow to capture an optional expected return date. Enforces future-only date ...
Full-screen modal allowing a peer mentor to activate or lift a pause. Collects optional expected return date and displays current pause stat...
Reusable badge/chip widget rendering the peer mentor's status enum (active, paused, expired_cert, resigned) with appropriate color coding an...
Scrollable, filterable log of all activities across the org's chapters, visible to org admins. Supports filtering by chapter, date range, ac...
Main entry screen for organisation admins showing aggregated KPI widgets across the entire org hierarchy. Displays active peer mentors, acti...
UI panel for triggering CSV and Excel exports of org-level data for Bufdir grant reporting and internal governance. Allows selecting the org...
Reusable stat card widget displaying a single KPI metric (e.g., active peer mentors, activities this month, pending reimbursements). Support...
Dedicated view within the admin portal displaying peer mentors with expiring or expired certifications across the org. Groups mentors by cha...
Tree-based navigation component for browsing deeply nested org structures (NHF: national association → region → local chapter) as well as fl...
Modal or slide-over panel for assigning or changing a user's role within the organisation (peer mentor, coordinator, org_admin). Enforces ro...
Paginated list and management UI for all users within the admin's org scope. Supports filtering by role, chapter, status (active, paused, pe...
The primary screen presenting the single-button export experience for generating Bufdir reports. Guides the user through period selection, f...
Reusable date-range picker pre-configured for common Bufdir reporting periods (quarter, half-year, full year). Validates that the selected r...
Modal dialog that presents a summary of export parameters (organisation, period, format, estimated row count) before the user confirms the e...
UI control allowing the user to choose between available export formats (Excel, CSV, PDF). Displays format descriptions and compatibility no...
Displays the audit log of past Bufdir exports for the current organisation, showing who triggered each export, the period covered, format, a...
Multi-source file picker allowing coordinators to select documents or images from the device camera roll or file system. Enforces format con...
Full-screen modal that renders image or PDF content retrieved via a signed URL. Provides a download/share action and a close button, and han...
Displays a compact grid of attachment thumbnails within the activity detail view. Renders image previews for JPEG and PNG files and a docume...
A reusable badge widget that surfaces certification expiry warnings inline within peer mentor list cards, the peer mentor detail screen, and...
Displays the full certification record for a peer mentor, including issue date, expiry date, cert type, and renewal history. Accessible from...
A coordinator dashboard widget that lists peer mentors whose certifications are expiring within the current calendar month. Each entry is ta...
A coordinator-facing screen for manually recording a peer mentor certification renewal after in-person course completion. Captures new issue...
Donut chart built with fl_chart showing breakdown of activities by type for the selected coordinator and period. Includes a legend listing e...
Main dashboard screen for coordinators showing aggregated statistics across their supervised peer mentor roster. Displays total activities, ...
Bar chart built with fl_chart showing activity count per month for the selected period. Supports tap-to-highlight and animated transitions w...
Scrollable list of peer mentor roster rows showing each mentor's individual stats (activities, hours, status) within the coordinator dashboa...
Individual statistics view for a single peer mentor showing their own contribution over time. Used both in the coordinator drill-down and as...
Horizontal filter bar allowing selection of time period (this month, last 3 months, this year, custom range) and optionally filtering by act...
Row of stat cards displaying key coordinator KPIs: total activities this month and year-to-date, hours of peer mentor support delivered, rei...
Unread count badge overlaid on the Notifications tab in the bottom navigation bar. Subscribes to a real-time unread count stream and updates...
Full-screen list of all received notifications sorted by recency, with read/unread visual differentiation and swipe-to-dismiss. Supports Voi...
Reusable card widget representing a single notification entry with title, body, timestamp, read indicator, and role-context icon. Tapping na...
Per-category opt-in toggle screen allowing users to manage notification fatigue without losing critical alerts. Categories include new assig...
In-app notification card shown to coordinators when a peer mentor has not responded to a reminder within the secondary escalation window. Su...
In-app notification card displayed in the Notifications tab when a peer mentor has not recorded contact within the configured window. Includ...
Settings screen section allowing organisation administrators to configure the reminder and escalation day thresholds per organisation. Displ...
Persistent in-app banner displayed in the Notifications tab for peer mentors with an expiring or expired certificate. The banner remains vis...
Full-screen detail view for a certificate expiry notification, available to both the peer mentor and coordinator. Coordinators see an additi...
Reusable widget that visually communicates a peer mentor's certificate status across multiple surfaces such as coordinator contact lists, me...
In-app notification card that displays pause and resume status change events to coordinators. Shows peer mentor name, effective date, option...
Inline confirmation banner shown to the peer mentor on both pause activation and deactivation transitions. Confirms the state change was rec...
Coordinator-facing settings screen that lists available scenario rule templates and allows toggling which scenarios are active for their cha...
Modal bottom sheet presented when a peer mentor taps a scenario prompt. Shows full context including the triggering activity summary, the su...
Displays an actionable scenario-based prompt in the notifications tab with contextual description and a primary CTA button. Tapping the card...
Main screen for the Notifications tab (fifth bottom nav item) presenting a chronological, filterable feed of all system notifications for th...
Displayed when the filtered or unfiltered notification feed is empty. Shows a contextual illustration and message appropriate to whether the...
Horizontal chip row allowing users to filter the notification feed by type (assignments, certificates, activities, system) and read state (a...
Individual row widget displaying a single notification with its type icon, short summary text, relative timestamp, and read/unread visual in...
Unread count badge overlaid on the Notifications bottom navigation tab icon. Listens to the notification BLoC stream and updates the badge c...
Visualises the distribution of a peer mentor's activities by type (e.g., home visits, phone calls, group sessions) using animated bar or pie...
Reusable animated card that reveals a single statistic (e.g., total hours volunteered, number of people helped) with a count-up animation an...
Displays a personal milestone achievement (e.g., first session, 100 hours, 50 people helped) as an animated badge with an icon, title, and s...
Allows the user to toggle between yearly and half-year summary views. Renders as a segmented control or tab bar with accessible labels, and ...
Bottom sheet or full-screen overlay that presents sharing options: copy to clipboard, save as image, or share via the system share sheet. Tr...
Full-screen animated presentation that walks the peer mentor through their year in review, slide by slide. Implements Flutter Hero animation...
Individual badge display card showing icon, name label, and earned/locked state. Meets WCAG 2.2 AA contrast requirements with text labels ac...
Bottom sheet modal displayed when a user taps a badge, showing full badge description, earning criteria, earned date if applicable, and prog...
Transient full-screen or banner overlay that celebrates a newly earned badge immediately after the triggering activity is saved. Provides po...
Displays a horizontal scrollable shelf of earned and locked badges on the peer mentor profile screen. Each badge shows locked/unlocked state...
Displays named recognition tiers such as 'Coordinator of the Year' and seasonal awards on the peer mentor profile. Shows current tier status...
Aggregated summary screen visible only to coordinators, listing each peer mentor's period metrics in a scrollable list. Highlights underacti...
Reusable widget that visualises the difference between the current period and the equivalent period in the prior year. Renders a numeric del...
In-app card rendered on the home screen during the relevant summary period showing key metrics: sessions held, hours contributed, and year-o...
WCAG 2.2 AA compliant in-app banner component that renders scenario-based notification messages while the user is active in the app. Support...
Settings screen allowing peer mentors to configure which scenario-based notification types they wish to receive. Supports per-scenario opt-o...
Read-only detail screen surfaced when a user taps a scenario notification from the notification centre or a push alert. Shows the scenario c...
A section within the coordinator statistics view that shows recruitment performance per peer mentor. Lists referral links issued, click-thro...
A lightweight in-app screen (or deep-link landing page) that receives the referred new member after they follow the referral link. Captures ...
A reusable card widget showing the peer mentor's recruitment summary — total invites sent, successful conversions, and pending signups. Embe...
Displays the peer mentor's unique referral QR code and shareable link in a prominent, easy-to-share format. Provides a one-tap action to ope...
Main interactive screen that guides the peer mentor through the benefit calculation flow. Presents input controls, live-updating results, an...
Reusable accessible tile widget rendering a single computed benefit metric with an icon, numeric value, unit label, and optional explanatory...
Visually rich results card consistent with the Wrapped design language that displays the calculated personal benefit (hours saved, travel co...
Form panel collecting the volunteer activity parameters used as inputs to the calculation — primarily session count and average duration. Us...
Custom semantics layer over the app's five-tab bottom navigation bar ensuring each tab exposes its label, selected state, and tab index to V...
Wraps bottom sheets and modal dialogs with correct focus trapping, initial focus placement, and focus restoration on close. Announces the sh...
Provides custom semantics for each step of the multi-step activity registration wizard, announcing the current step number and total, the st...
Provides live-region announcements for asynchronous state changes such as loading completions, form submission results, error messages, and ...
A reusable Flutter widget that wraps interactive elements with Flutter Semantics properties, providing labels, roles, hints, and state annou...
An OS-level alert dialog that fires before a screen reader vocalises a field flagged as containing sensitive personal data (e.g., name, addr...
A reusable summary screen inserted as the final step of every activity or report wizard. Lists all entered values in a readable table so the...
Provides field-level and screen-level help text inline within the UI, replacing separate help sections. Help is revealed by tapping a labell...
Flutter NavigationBar implementation that enforces labelled icons — no icon-only buttons. All tabs display both icon and text label at all t...
Renders form and server errors in plain Norwegian using a two-part structure: what went wrong and how to fix it. Never shows raw error codes...
A composable screen wrapper that enforces the cognitive accessibility rule of at most three primary choices per screen. Provides consistent ...
Displays current step position and total step count in all multi-step wizards. Enforces the maximum of 5 steps and provides clear visual fee...
Provides a Flutter TextTheme derived entirely from design tokens, ensuring all body copy uses FontWeight.w400 or heavier and that no italic ...
A Flutter widget wrapper that enforces a minimum 44×44 pt tappable area for all interactive controls. Wraps GestureDetector or InkWell with ...
A Flutter ThemeData color scheme built exclusively from contrast-verified token pairs. Exposes foreground/background pairs guaranteed to mee...
Enforces token-defined minimum spacing between adjacent interactive controls to prevent mis-taps in dense form layouts. Provides a layout wi...
A persistent five-tab bottom navigation bar built on StatefulShellRoute that preserves tab state across navigation events. Relies exclusivel...
A clearly labelled close IconButton injected into every ModalBottomSheet, AlertDialog, and full-screen overlay. Ensures users can dismiss mo...
A back control that appears on every screen that is not a root tab destination, providing an explicit tap-based way to navigate up the stack...
A scroll view wrapper that enforces vertical-only scrolling throughout the application, preventing horizontal carousels and swipe-to-navigat...
A microphone icon button rendered inline within free-text report fields to trigger dictation. Only appears on fields explicitly designated f...
A prominent in-field overlay or banner that displays the current dictation state (idle, recording, processing, error) using both visual and ...
An augmented free-text input field that displays live partial transcription results as the user dictates, allowing them to monitor accuracy ...
Dedicated UI component presented to users who hold roles in more than one partner organization. Allows clean switching between tenant contex...
Visual step indicator widget shown during the onboarding flow to communicate to the user which stage they are on (organization selection → a...
Reusable card widget that displays a single partner organization with its logo, display name, and a brief descriptor. Renders the organizati...
Full-screen onboarding view presented at first launch and whenever no organization context exists. Displays the list of partner organization...
An administrative UI screen that displays the full terminology map for the selected organization, allowing admins to inspect current label k...
A drop-in replacement for Flutter Text widgets that automatically resolves label keys through the active organization's terminology map. Acc...
An administrative screen accessible to organization admins that displays all available feature flags for the current organization and their ...
A conditional rendering wrapper widget that gates any child widget behind a single boolean feature flag check. Accepts a flag key and option...
Slack-style workspace-switching bottom sheet that appears for users (typically NHF peer mentors) who belong to multiple local chapters simul...
Top-level screen in the organization admin portal dedicated to hierarchy management. Combines the tree view with action buttons to add child...
Full-screen form for creating and editing a single organization unit node. Allows setting the node name, level type, and parent assignment v...
Flutter widget that renders the full organizational hierarchy as a collapsible, scrollable tree. Displays national associations, regions, an...
Admin UI panel embedded within a user's profile or a hierarchy node detail page that shows current unit assignments for that user and allows...
Secure form component for entering and updating API credentials (API keys, client secrets, OAuth tokens) for external integrations. Masks se...
Admin panel allowing HLF administrators to mark which application features should be suppressed to avoid overlap with HLF's Dynamics-based '...
Visual editor component allowing administrators to map internal application fields to external system fields for each integration type. Supp...
Admin portal screen listing all configured external integrations for the current organization, showing integration type, connection status, ...
Multi-step wizard in the admin portal that guides administrators through configuring a new external integration. Covers integration type sel...
UI component for configuring automated sync schedules between the application and external systems. Supports selection of frequency (daily, ...
Other Component Types
Service Layer components contain business logic, orchestrate operations, and provide core application functionality.
Data Layer components manage data persistence, storage operations, and data access patterns throughout the application.
Infrastructure components provide foundational utilities, system integrations, and supporting functionality for the application.