🏠 Overview › 🧩 Components ›🧩 Bottom Navigation Bar

Bottom Navigation Bar

Component Detail

User Interface high complexity Shared Component mobile
1
Dependencies
2
Dependents
0
Entities
0
Integrations

Description

Persistent five-tab bottom navigation bar (Home, Contacts, Add, Work, Notifications) that anchors the mobile app shell. Tabs are mounted at runtime from the enabled module set returned by the Module Registry Service; disabled modules hide their tab without a new release.

Feature: Role-Specific Home Dashboard

bottom-navigation-bar

Responsibilities

  • Render five tabs with WCAG 2.2 AA touch targets (48x48 logical pixels) and VoiceOver semantic labels
  • Subscribe to Module Registry Service stream to show or hide tabs for enabled modules
  • Present the Add tab as a modal launcher for the Activity and Event wizard entry points
  • Maintain active tab state and drive root-level route transitions
  • Adapt visible tabs by role so coordinator-only tabs are hidden for Peer Mentors

Interfaces

build(BuildContext) → Widget
onTabSelected(int index) → void
setActiveTab(NavTab tab) → void
Stream<List<NavItem>> get visibleTabs

Relationships

Dependencies (1)

Components this component depends on

service Module Registry Service Shared

Dependents (2)

Components that depend on this component

ui Peer Mentor Home Screen ui Coordinator Home Screen