{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "sheet-2",
  "type": "registry:component",
  "title": "Sheet 2",
  "description": "Sheet 2. A panel that slides in from the edge of the screen to display additional content, forms, or actions without navigating away.",
  "dependencies": [
    "react-icons"
  ],
  "registryDependencies": [
    "button",
    "input",
    "label",
    "sheet"
  ],
  "files": [
    {
      "path": "components/watermelon/sheet-2.tsx",
      "type": "registry:component",
      "content": "'use client';\n\nimport { Button } from '@/components/base-ui/button';\nimport { Input } from '@/components/base-ui/input';\nimport { Label } from '@/components/base-ui/label';\nimport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n} from '@/components/base-ui/sheet';\nimport {\n  FaChevronUp,\n  FaChevronRight,\n  FaChevronDown,\n  FaChevronLeft,\n  FaUserCircle,\n} from 'react-icons/fa';\n\nconst SheetContentBody = () => (\n  <>\n    <SheetHeader>\n      <SheetTitle className=\"flex items-center gap-2\">\n        <FaUserCircle />\n        Profile Setup\n      </SheetTitle>\n    </SheetHeader>\n\n    <div className=\"grid gap-5 px-4 py-6\">\n      <div className=\"grid gap-2\">\n        <Label>Display Name</Label>\n        <Input placeholder=\"Enter your name\" />\n      </div>\n\n      <div className=\"grid gap-2\">\n        <Label>Email</Label>\n        <Input placeholder=\"Enter your email\" />\n      </div>\n\n      <div className=\"grid gap-2\">\n        <Label>Bio</Label>\n        <Input placeholder=\"Short description...\" />\n      </div>\n    </div>\n\n    <SheetFooter className=\"flex gap-2\">\n      <Button className=\"w-full\">Save</Button>\n      <SheetClose asChild>\n        <Button variant=\"outline\" className=\"w-full\">\n          Close\n        </Button>\n      </SheetClose>\n    </SheetFooter>\n  </>\n);\n\nconst Sheet2 = () => {\n  return (\n    <div className=\" flex flex-wrap gap-3\">\n      <Sheet>\n        <SheetTrigger asChild>\n          <Button variant=\"outline\" size=\"icon\">\n            <FaChevronUp />\n          </Button>\n        </SheetTrigger>\n        <SheetContent side=\"top\" className=\"rounded-lg\">\n          <SheetContentBody />\n        </SheetContent>\n      </Sheet>\n\n      <Sheet>\n        <SheetTrigger asChild>\n          <Button variant=\"outline\" size=\"icon\">\n            <FaChevronRight />\n          </Button>\n        </SheetTrigger>\n        <SheetContent side=\"right\" className=\"rounded-lg\">\n          <SheetContentBody />\n        </SheetContent>\n      </Sheet>\n\n      <Sheet>\n        <SheetTrigger asChild>\n          <Button variant=\"outline\" size=\"icon\">\n            <FaChevronDown />\n          </Button>\n        </SheetTrigger>\n        <SheetContent side=\"bottom\" className=\"rounded-lg\">\n          <SheetContentBody />\n        </SheetContent>\n      </Sheet>\n\n      <Sheet>\n        <SheetTrigger asChild>\n          <Button variant=\"outline\" size=\"icon\">\n            <FaChevronLeft />\n          </Button>\n        </SheetTrigger>\n        <SheetContent side=\"left\" className=\"rounded-lg\">\n          <SheetContentBody />\n        </SheetContent>\n      </Sheet>\n    </div>\n  );\n};\n\nexport default Sheet2;\n"
    }
  ]
}