Overlays

Mobile filter sheet

The filter drawer shown below md. Renders nothing at all on desktop, where filters live inline.

Available

Needs mock props

Dual breakpoint

Examples

This component's Storybook stories, embedded. They are the maintained source for its states, so Lantern shows them rather than keeping a duplicate set.

Mobile filter sheet

Rendered live from Storybook

Open

Storybook must be running for this to load — npm run storybook from the repo root, or set NEXT_PUBLIC_STORYBOOK_URL to a deployed instance.

Reference

Transcribed from the component audit. If this disagrees with the source, the source is right.

Source: src/components/ui/mobile-filter-sheet.tsx
Portability: Needs its app dependencies replaced by props before it renders in isolation.
Responsive: Carries a load-bearing max-md: / md: pair. Sign off at both viewports — see the rule.
Notes: Takes isMobile / forceMobile in place of the useIsMobile() early return, so both branches are reachable. The md:hidden is load-bearing.