114
Total User Interface
52
Low Complexity
55
Medium Complexity
7
High Complexity
2
Shared

User Interface components handle presentation logic, user interactions, and visual elements of the application.

Login Screen

The primary authentication entry point rendered as a Flutter form widget with email and password fields, error display, and a forgot-passwor...

medium Email & Password Login
Password Reset Screen

Flutter screen that accepts a user email address and triggers the reset-link email flow. Handles both the request step and the new-password ...

low Email & Password Login
Biometric Auth Widget

Presents the native biometric prompt (Face ID, Touch ID, or Android fingerprint/face) using Flutter's local_auth package on app resume or se...

low Biometric Login (Face ID/Fingerprint)
Passkey Enrollment Screen

Flutter screen that initiates and completes passkey registration for an existing authenticated user. Guides the user through device biometri...

medium Passkeys (WebAuthn)
Passkey Login Prompt

Flutter widget shown on the login screen that offers passkey-based sign-in as an alternative to email/password. Triggers the FIDO2 assertion...

medium Passkeys (WebAuthn)
No Access Screen

Full-screen informational view rendered when a Global Admin authenticates on the Mobile App. Displays a redirect message and a deep-link but...

low Role-Based Access Control
Context Switch Transition Overlay

A brief full-screen loading overlay shown while the app invalidates all organization-scoped Riverpod providers and re-fetches the module reg...

low Profile Switching
Role Switch Widget

A bottom-sheet picker that lists all role-organization pairs available to the current user, sourced from user_organization_roles. Renders on...

medium Profile Switching
Quick Log Screen

Single-screen Flutter UI that lets a peer mentor record a completed interaction in two taps. Pre-fills today's date and a 30-minute duration...

low Simple Activity Logging
Activity Wizard UI

Flutter multi-screen wizard flow that guides the peer mentor through sequential steps: contact selection, date, time, duration, and narrativ...

medium Activity Registration Wizard
Speech Input Widget

A microphone button widget that appears inside text fields (activity summary, notes) when the organization config flag for speech input is e...

medium Speech-to-Text Input
Attachment Picker Widget

Entry-point widget for selecting files to attach to an activity. Wraps the file_picker and image_picker Flutter plugins to expose gallery se...

medium Document Attachments
Attachment Thumbnail Strip

Read-only display component shown in the activity detail card that renders server-generated thumbnails for all attachments linked to an acti...

low Document Attachments
Structured Report Form

Flutter screen rendered after a home-visit activity wizard completes, presenting a series of typed input widgets - radio groups for health s...

medium Formalized Home-Visit Report
Peer Mentor Picker Widget

A reusable widget that presents a searchable, scrollable list of peer mentors managed by the current coordinator. It enforces org-boundary f...

low Coordinator Proxy Reporting
Proxy Registration Screen

The main screen for coordinators to register an activity on behalf of a peer mentor. It branches from the standard activity wizard by insert...

medium Coordinator Proxy Reporting
Bulk Registration UI

The primary screen for bulk activity registration, combining a shared activity metadata form (type, date, duration, summary) with a searchab...

medium Bulk Registration
Event Wizard UI

Multi-step Flutter wizard for creating events, covering title, date, time, duration, location, and summary in sequential steps. Reuses share...

medium Event Creation
Event List Screen

Paginated Flutter screen displaying upcoming and past events scoped to the user's organisation. Renders role-aware content - peer mentors se...

low Event Listing
Event Sign-up Flow

Single-tap sign-up and cancellation widget rendered on the event detail screen. Displays current participant count and the user's own regist...

medium Event Sign-up
Expense Confirmation Screen

Read-only summary screen shown after an expense is submitted, confirming the recorded details and displaying the approval status (auto-appro...

low Travel Expense Registration
Expense Registration Screen

Primary mobile screen for logging travel expenses including kilometre allowances, toll fees, parking, and public transport. Uses fixed selec...

medium Travel Expense Registration
Receipt Camera Widget

Flutter widget giving peer mentors access to device camera and photo library for capturing physical receipts. Displays a preview thumbnail a...

medium Receipt Photo Upload
Expense Type Selector

A validated picker widget that renders the organisation-configured catalogue of expense types (km allowance, toll, parking, public transport...

medium Expense Types & Requirements
Declaration Sign-off Screen

Flutter screen presenting a scrollable confidentiality declaration text, a mandatory confirmation checkbox that activates only after the use...

low Confidentiality Declarations
Contact List Screen

Role-specific paginated list screen displaying contacts scoped to the authenticated user's role. Peer mentors see only their assigned contac...

medium Contact List & Search
Caregiver Link Widget

Collapsible Flutter widget rendered inside the contact detail screen, listing linked relatives with their role tags and providing add, edit,...

medium Caregiver & Next-of-Kin
Notes List Screen

Flutter screen displaying a paginated, filterable list of notes scoped by contact or aggregated across all of a user's notes. Provides a deb...

low Notes List
Note Editor Screen

Full-screen Flutter composing interface for creating and updating notes linked to a specific contact. Supports free-text entry with basic fo...

medium Note Editor
Statistics Dashboard Screen

Flutter screen displaying a peer mentor's personal activity statistics including counts by type, total hours, and monthly trend charts. Rend...

medium Personal Activity Statistics
Team Report Screen

Flutter screen displaying per-mentor activity rows, aggregate totals, and a time-period filter picker scoped to the coordinator's local asso...

medium Coordinator Team Reports
Assignment Detail Screen

Decrypts and renders the full assignment payload - name, address, and medical summary - after the peer mentor taps an inbox entry. Navigatin...

high Encrypted Assignment Dispatch
Assignment Inbox Screen

Displays the peer mentor's list of received assignments with real-time delivery and read status indicators. Each assignment card shows maske...

medium Encrypted Assignment Dispatch
Threshold Progress Widget

Inline widget rendered on the Assignment Inbox Screen showing the peer mentor's current completed-assignment count and the distance to the n...

low Assignment Threshold Tracking
Consent Flow Screen

Full-screen consent presentation that intercepts navigation to sensitive assignment content when a required consent is absent. Renders the c...

high Progressive Digital Consent
Relative Registration Screen

Flutter screen for creating and editing relative contact records linked to a primary contact. Presents a simplified mandatory field set (nam...

medium Relative Contact Registration
Case Link Flow Screen

Modal or sheet UI for linking and unlinking a relative to a contact/case, accessible from both the Relative detail screen and Contact detail...

medium Relative Case Linking
Pause Toggle Screen

Flutter screen presenting a pause toggle control on the peer mentor's profile, guarded by a confirmation dialog before committing the status...

low Pause Function
Resume Flow

Flutter screen that guides a paused peer mentor through reactivation: a brief confirmation step verifying availability preferences, with inl...

low Resume Function
Expiry Status Banner

Flutter widget rendered on the peer mentor home screen when a certification is within the warning window or has lapsed. Shows remaining days...

low Certification Expiry Auto-Pause
Map View Screen

Full-screen interactive map displaying active peer mentor locations as clustered pins within the coordinator's organization scope. Provides ...

high Peer Mentor Map
Mentor Map Marker Widget

Reusable map pin widget representing a single peer mentor location with availability color coding and tap-to-profile navigation. Emits seman...

medium Peer Mentor Map
Workshop Creation Wizard

Multi-step BLoC-managed form covering title, description, date range, and location fields required to create a new workshop record. Follows ...

medium Career Workshops
Workshop Dashboard Screen

Displays upcoming and past karriereverksted sessions scoped to the current user's organization via a Riverpod StreamProvider. Renders sessio...

medium Career Workshops
Workshop Detail Screen

Shows full details for a single workshop session including title, date range, location, and coordinator. Surfaces embedded workshop notes, t...

medium Career Workshops
Workshop Note Editor

Full-screen note editor scoped to a specific workshop session, supporting free-text multi-line input with a visible save-state indicator acc...

low Workshop Notes
Add Participant Bottom Sheet

A modal bottom sheet that allows coordinators to search existing contacts and peer mentors within their organization and add them to the wor...

low Workshop Participant Lists
Participant List Screen

Displays the full roster of attendees for a specific career workshop session, showing each participant's name, role, and attendance status i...

low Workshop Participant Lists
Workshop Todo Widget

Compact checklist component rendered inside the workshop detail screen, listing all to-do items scoped to a specific workshop. Supports inli...

low Workshop To-Do Lists
Scenario Configuration UI

Admin portal page for creating, editing, and activating notification scenario templates per organization. Provides a form-driven interface f...

medium Notification Scenarios
Notification Settings Screen

Flutter screen accessible from the hamburger menu that presents grouped toggle switches for each notification category and channel preferenc...

low Notification Settings
Invite Share Screen

Full-screen mobile UI for generating, displaying, and sharing a personalized invite link and QR code. Presents the QR code, shareable link t...

medium Invite Link & QR Sharing
QR Code Display Widget

Reusable Flutter widget that renders a QR code image from an invite URL string using the qr_flutter package. Caches the rendered QR bitmap l...

low Invite Link & QR Sharing
Course Catalog Screen

Displays a scrollable, org-filtered list of available courses fetched from the REST API and cached locally via Drift for offline browsing. S...

medium Course Registration
Course Detail Screen

Shows full metadata for a selected course - description, schedule, requirements, and certification linkage - alongside a primary enroll or w...

low Course Registration
Certificate Display Screen

Read-only Flutter screen presenting the peer mentor's digital certificate including name, organization, certification type, issue date, expi...

low Digital Peer Mentor Certificate
Annual Summary Screen

Paginated card deck screen rendering each yearly metric (activities, hours, contacts, milestones) as an animated card following Spotify Wrap...

medium Annual Summary (Wrapped)
Badge Display Widget

Flutter widget rendering the peer mentor's badge grid on profile and summary screens. Displays each badge in a uniform card with locked/unlo...

low Achievement Badges
Advantage Calculator Screen

Interactive Flutter screen presenting a form where peer mentors enter activity parameters (activity type, hours contributed, number of conta...

low Advantage Calculator
Talking Cards Browser

A scrollable Flutter widget that presents conversation-starter cards organised by theme tags. Supports offline browsing via Drift and meets ...

low Talking Cards Toolbox
Accessible Widget Library

Shared Flutter widget set including AppButton, AppTextField, and focus-indicator wrappers that enforce WCAG 2.2 AA requirements across every...

high shared WCAG 2.2 AA Compliance
Sensitive Field Warning Widget

A Flutter SensitiveFieldWrapper widget that intercepts screen reader focus on sensitive content and presents an accessible modal warning bef...

low Sensitive Field Readout Warning
Home Screen (Coordinator)

The primary landing screen for coordinator and org admin users (org admins surface as coordinators on mobile), showing team summary widgets,...

medium Role-Specific Home Dashboard
Home Screen (Peer Mentor)

The primary landing screen for peer mentor users, showing quick-access activity logging, recent contacts, and enabled module widgets assembl...

medium Role-Specific Home Dashboard
Home Widget Slot Host

A slot-based container widget that areas register their home widgets against at startup. Queries the module registry at mount time, filters ...

medium Role-Specific Home Dashboard
Settings Screen

Centralized settings screen accessible from the hamburger menu, presenting grouped preference controls for notifications, accessibility, and...

low App Settings & Preferences
Resource Links Screen

Displays an organization-configured list of external URLs with descriptive labels, grouped by category. Each entry opens in the device brows...

low External Resource Links
Contact Support Screen

Static Flutter screen listing support contact options for the Meander platform and the user's organization. Renders email and phone entries ...

low Contact Us
Privacy Policy Screen

A read-only scrollable Flutter screen that renders the platform's privacy policy using a Markdown/rich-text widget. Accessible without authe...

low Privacy Policy
Accessibility Statement Screen

A static Flutter screen displaying the platform's formal WCAG 2.2 AA compliance statement, structured into sections for conformance level, s...

low Accessibility Statement
FAQ Screen

Flutter screen presenting a searchable, role-filtered accordion list of frequently asked questions using ExpansionTile widgets. Organized by...

low FAQ
KPI Card Widget

Reusable card component rendering a single KPI metric with its label, current value, trend arrow, and optional sparkline. Accepts a typed KP...

low Dashboard KPIs
KPI Dashboard Page

Server-rendered Next.js page displaying organization-scoped KPI cards for activity counts, user engagement, expense totals, and assignment c...

medium Dashboard KPIs
Activity Feed Widget

Scrollable chronological feed widget displaying recent activity registrations, expense submissions, and system events for organization admin...

medium shared Activity Feed
Feed Entry Card

Unified card component that renders a single polymorphic feed entry with type-specific icons (activity, expense, system event), timestamps, ...

low Activity Feed
User Edit Dialog

Modal dialog for updating an existing user's profile fields (name, email) within the admin's organization. Loads current values on open and ...

low User CRUD
User Invite Dialog

Modal dialog allowing an org admin to enter a new user's email address and assign an initial role before sending a tokenized invitation emai...

low User CRUD
User Management Page

Server-side-rendered Next.js page presenting a filterable data table of all users within the admin's organization. Each row shows inline sta...

medium User CRUD
Role Assignment UI

Admin Web Portal page/dialog that lists users in the organization with their current role and provides controls to assign, change, or revoke...

medium Role Assignment
Bulk Action Controls

Layered onto the existing user management table, this component adds a sticky checkbox column for row selection and an action toolbar that a...

medium Bulk Actions
Activity Oversight Page

Server-side-rendered Next.js page in the Admin Web Portal presenting a paginated, filterable list of submitted peer mentor activities. Suppo...

medium Activity Review & Approval
Activity Review Detail Panel

Expandable inline panel or modal drawer that displays the full details of a selected activity submission, including contact, date, duration,...

low Activity Review & Approval
Flag & Comment UI

An inline panel or modal on the activity detail page in the Admin Web Portal that allows org admins and coordinators to flag an activity wit...

medium Activity Flagging
Duplicate Activity Panel

A dedicated Duplicates tab within the Activity Oversight admin interface that renders ranked pairs of suspected duplicate activities with si...

medium Duplicate Activity Detection
Expense Detail Panel

Slide-over or modal panel showing the complete context of a single expense claim - submitter profile, activity link, expense type, distance,...

medium Expense Approval Queue
Expense Queue Page

Server-rendered Next.js page listing all pending expense claims for the admin's organization, scoped to status=pending_review. Displays subm...

medium Expense Approval Queue
Auto-Approval Config UI

Admin Web Portal page for creating, editing, enabling, and disabling per-organization auto-approval rules. Displays numeric threshold inputs...

medium Auto-Approval Rules
Reports Page

Server-side rendered Next.js page in the Admin Web Portal that displays aggregated activity data for the authenticated organization's peer m...

medium Team Reports
Bufdir Report Builder

Next.js server-rendered page restricted to Org Admin role that presents a period selector, preview table of aggregated figures, and a genera...

medium Bufdir Report Generation
Bufdir Report Preview Panel

Embedded panel within the report builder that displays a structured breakdown of aggregated activity counts, durations, and contact categori...

medium Bufdir Report Generation
Export Confirmation Modal

A confirmation modal displayed before triggering the Bufdir report download. Shows the report period, key aggregate totals, and an explicit ...

low Bufdir Export
Report Builder UI

Next.js client-side page that lets Org Admins and Coordinators select dimensions, filters (date range, activity type, contact category, peer...

high Custom Reports
Organization Settings Page

Server-side-rendered Next.js page under /admin/settings that provides Org Admins with a centralized control panel for tenant configuration. ...

medium Organization Settings
Terminology Config UI

Admin Web Portal page (Next.js) that renders a configuration table of all overrideable term keys, showing each org's current override alongs...

low Custom Terminology
Feature Toggle Management UI

Admin page in the Next.js portal under Organization Management that lists all functional areas as toggleable modules per tenant. Renders a d...

high Feature Toggles
Org Hierarchy UI

Next.js admin page rendering an interactive tree view of organizational nodes (national associations, regions, local chapters). Allows admin...

high Multi-Organization Hierarchy
Member Associations Page

Next.js admin page providing a dual-view interface for managing organizational memberships: a user-centric view listing all org memberships ...

medium Member Associations
Capability Boundary Matrix

A declarative UI panel listing functional capabilities that may exist in both Meander and the external portal, allowing admins to mark which...

medium External Portal Integration
External Portal Config

Next.js admin page under Organization Management allowing admins to declare the external portal URL, OAuth client credentials, scope mapping...

medium External Portal Integration
Security Dashboard Page

Next.js server-rendered admin portal page providing organization administrators with a centralized view of security events. Displays authent...

medium Security Dashboard
Audit Log Page

Server-side rendered admin page displaying the organization-scoped audit trail with cursor-based pagination. Provides filter controls for ac...

medium Audit Log
Session Management UI

Admin page displaying active sessions scoped to the administrator's tenant, showing user identity, device info, and last-activity timestamps...

medium Session Management
Landing Page

The primary public-facing page of the Meander sales website, presenting the platform value proposition, module-toggle model, and WCAG 2.2 AA...

low Product Landing Page
Sales Site Footer

Static footer for the sales website containing links to legal documents (Privacy Policy, Terms of Service, DPA, Cookie Policy), contact info...

low Product Landing Page
Sales Site Navigation Header

Top navigation bar for the sales website providing links to key sections - Features, Calculator, Demo Booking, and Legal pages. Fully static...

low Product Landing Page
Features Overview Page

A static, public-facing page on the Sales Website that presents Meander's full capability set organized by functional area (the canonical ar...

low Feature Overview
Cost Comparison Widget

Side-by-side comparison table or card pair showing manual reporting costs versus Meander subscription cost and net saving. Accepts organizat...

low Cost Comparison
Demo Booking Form

A static HTML/React form on the Sales Website that collects contact and organizational details from prospective buyers requesting a product ...

low Booking Form
Form Validation Feedback Widget

Inline validation feedback component that displays field-level error messages and a global submission error banner when the form handler ret...

low Booking Form
Booking Confirmation Page

Static confirmation page rendered after a successful demo booking form submission. Displays a success heading, next-steps message, expected ...

low Booking Confirmation
Privacy Policy Page

Static page rendering the full GDPR privacy policy for the Meander Sales Website. Built as a statically generated page (Next.js or Astro) au...

low Privacy Policy
Terms of Service Page

Static page on the Sales Website presenting the platform's contractual terms governing organization use. Displays versioned content with a v...

low Terms of Service
DPA Page

Static page rendering the full GDPR Article 28 Data Processing Agreement on the Sales Website. Displays effective date, version number, and ...

low Data Processing Agreement
Cookie Policy Page

Static page on the Sales Website that discloses all cookies and tracking technologies deployed on the site, categorized by type (strictly ne...

low Cookie Policy