Bottom Navigation Bar Widget
Component Detail
User Interface
low complexity
Shared Component
mobile
0
Dependencies
3
Dependents
1
Entities
0
Integrations
Description
Persistent Material 3 NavigationBar shell widget wrapping all five tab destinations (Home, Contacts, Add, Work, Notifications) for all authenticated mobile users regardless of role. Implements WCAG 2.2 AA semantic labels, visible focus indicators, and minimum 44dp touch targets on all nav items.
bottom-nav-bar-widget
Responsibilities
- Render and manage five-tab bottom navigation (Home, Contacts, Add, Work, Notifications)
- Maintain selected tab state and delegate navigation to appropriate screen routes
- Apply semantic accessibility labels to all navigation items for screen reader support
- Display notification badge count on Notifications tab when unread notifications exist
Interfaces
build(BuildContext context)
onTabSelected(int index)
updateNotificationBadge(int count)
getSelectedIndex()
navigateToTab(int index)
Relationships
Dependents (3)
Components that depend on this component