Skip to content

refactor(bottom-navigation): align with MD3 navigation behavior - #5120

Open
DanielPotorCK wants to merge 1 commit into
callstack:mainfrom
DanielPotorCK:refactor/bottom-navigation-md3
Open

DanielPotorCK wants to merge 1 commit into
callstack:mainfrom
DanielPotorCK:refactor/bottom-navigation-md3

Conversation

@DanielPotorCK

Copy link
Copy Markdown

Summary

  • Align BottomNavigation with the MD3 Expressive navigation bar (64dp bar, 56×32 indicator, token colors, visible state layers).
  • Add itemLayout (vertical | horizontal | auto), memoized items/scenes, Reanimated transitions, and improved lazy rendering and badges.
  • Update the example app and 6.x docs/migration guide.

Related issue

Closes #4935

Screenshots / Videos

image image

Test plan

  • Example app: Bottom Navigation — toggle labels, shifting, vertical/horizontal/auto, scene animations
  • Example app: Bottom Navigation Bar with React Navigation
  • Badges: dot and numeric
  • Lazy screens mount on first visit and stay mounted
  • yarn typecheck, yarn lint, yarn test src/components/__tests__/BottomNavigation.test.tsx

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

refactor(bottom-navigation): align with MD3 navigation behavior

3 participants