{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "demo-bottom-sheet",
  "title": "Bottom Sheet Demo",
  "description": "A settings panel reproduced with the Bottom Sheet primitive: a trigger, a hidden title, and a row list toggling a few mock settings.",
  "registryDependencies": ["@soralabs/bottom-sheet"],
  "files": [
    {
      "path": "registry/demo/primitives/radix/bottom-sheet/index.tsx",
      "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport {\n  BottomSheet,\n  BottomSheetContent,\n  BottomSheetDescription,\n  BottomSheetList,\n  BottomSheetPanel,\n  BottomSheetRow,\n  BottomSheetTitle,\n  BottomSheetTrigger,\n} from \"@/components/sora-ui/radix/bottom-sheet\";\n\ninterface SettingsState {\n  preloader: boolean;\n  showLabels: boolean;\n  sound: boolean;\n  systemTheme: boolean;\n  theme: \"dark\" | \"light\";\n}\n\nconst initialSettings: SettingsState = {\n  preloader: true,\n  showLabels: false,\n  theme: \"dark\",\n  systemTheme: true,\n  sound: false,\n};\n\nexport default function BottomSheetDemo() {\n  const [open, setOpen] = useState(false);\n  const [settings, setSettings] = useState(initialSettings);\n\n  return (\n    <BottomSheet onOpenChange={setOpen} open={open}>\n      <BottomSheetTrigger className=\"rounded-lg border border-border bg-card px-4 py-2 font-medium text-sm\">\n        Open settings\n      </BottomSheetTrigger>\n      <BottomSheetContent\n        className=\"max-w-[361px]\"\n        defaultSnap={0}\n        showHandle={false}\n        snapPoints={[\"auto\"]}\n      >\n        <BottomSheetTitle>Settings</BottomSheetTitle>\n        <BottomSheetDescription>\n          Toggle preloader, labels, theme, and sound.\n        </BottomSheetDescription>\n        <BottomSheetPanel>\n          <BottomSheetList>\n            <BottomSheetRow\n              label=\"preloader\"\n              onClick={() =>\n                setSettings((s) => ({ ...s, preloader: !s.preloader }))\n              }\n              value={String(settings.preloader)}\n            />\n            <BottomSheetRow\n              label=\"show labels\"\n              onClick={() =>\n                setSettings((s) => ({ ...s, showLabels: !s.showLabels }))\n              }\n              value={String(settings.showLabels)}\n            />\n            <BottomSheetRow\n              label=\"theme\"\n              onClick={() =>\n                setSettings((s) => ({\n                  ...s,\n                  theme: s.theme === \"dark\" ? \"light\" : \"dark\",\n                }))\n              }\n              value={settings.theme}\n            />\n            <BottomSheetRow\n              label=\"system theme\"\n              onClick={() =>\n                setSettings((s) => ({ ...s, systemTheme: !s.systemTheme }))\n              }\n              value={settings.systemTheme ? \"on\" : \"off\"}\n            />\n            <BottomSheetRow\n              label=\"sound\"\n              onClick={() => setSettings((s) => ({ ...s, sound: !s.sound }))}\n              value={settings.sound ? \"enabled\" : \"disabled\"}\n            />\n          </BottomSheetList>\n        </BottomSheetPanel>\n      </BottomSheetContent>\n    </BottomSheet>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/sora-ui/demo/radix/bottom-sheet.tsx"
    }
  ],
  "type": "registry:ui"
}