📱 MobileBottomSheet Demo

Test mobile bottom sheet modal s URL sync a accessibility features.

⚙️ Konfigurace

Vypne animace pro uživatele s prefers-reduced-motion nastavením

URL Hash:
(žádný)
Otevřít sheet
📖 Props API

isOpen: boolean

Řídí viditelnost sheetu

onClose: () => void

Callback při zavření sheetu (X tlačítko, Escape)

title?: string

Volitelný nadpis sheetu s close tlačítkem

children: React.ReactNode

Obsah sheetu

className?: string

Dodatečné CSS třídy pro obsah

✨ Features

URL State Sync

Automatická synchronizace s URL hash (#settings)

Reduced Motion Support

Respektuje prefers-reduced-motion nastavení

Safe Area Padding

env(safe-area-inset-bottom) pro notched devices

Auto Focus

Automaticky fokusuje první interaktivní prvek

WCAG AA Accessibility

Full screen reader a keyboard support

✅ Checklist testů