Registry Index

Search the catalog

Type to search items across every indexed registry, or pick a page.

ComponentReactregistry:ui1 dependency

BottomNav

bottom-nav

Pill-shaped frosted bottom navigation, hand-composed from BottomNavItem and BottomNavAction.

@whiskeyjackRegistry JSON
Live, loading

Starting the live preview…

Runs in a sandboxed frame on a separate origin, in its registry's own theme. Mounted with no props — an item that paints an empty box is given its name as text, and some items need input to show anything.

Notes from the author

BottomNav is the hand-composed bar: lay out the items and action yourself when you know they always fit. For a data-driven bar that collapses overflowing items into a hamburger, use MobileBottomNav instead.
@whiskeyjack

More from @whiskeyjack

All 16 items
Textarea
textarea
Component
ColorInput
color-input
Component
DisclosureToggle
disclosure-toggle
Component
EmptyState
empty-state
Component
Input
input
Component
ProgressBar
progress-bar
Component
SearchField
search-field
Component
Toast
toast
Component