{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "sheet",
  "type": "registry:ui",
  "dependencies": [
    "@kobalte/core"
  ],
  "files": [
    {
      "path": "ui/sheet.tsx",
      "content": "import type { Component, ComponentProps, JSX, ValidComponent } from \"solid-js\"\nimport { mergeProps, splitProps } from \"solid-js\"\n\nimport * as SheetPrimitive from \"@kobalte/core/dialog\"\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst Sheet: Component<SheetPrimitive.DialogRootProps> = (props) => {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />\n}\n\nconst SheetTrigger = <T extends ValidComponent = \"button\">(\n  props: PolymorphicProps<T, SheetPrimitive.DialogTriggerProps<T>>\n) => {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\nconst SheetClose = <T extends ValidComponent = \"button\">(\n  props: PolymorphicProps<T, SheetPrimitive.DialogCloseButtonProps<T>>\n) => {\n  return <SheetPrimitive.CloseButton data-slot=\"sheet-close\" {...props} />\n}\n\nconst SheetPortal: Component<SheetPrimitive.DialogPortalProps> = (props) => {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\ntype SheetOverlayProps<T extends ValidComponent = \"div\"> = SheetPrimitive.DialogOverlayProps<T> & {\n  class?: string | undefined\n}\n\nconst SheetOverlay = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, SheetOverlayProps<T>>\n) => {\n  const [local, others] = splitProps(props as SheetOverlayProps, [\"class\"])\n  return (\n    <SheetPrimitive.Overlay\n      class={cn(\n        \"data-[closed=]:fade-out-0 data-[expanded=]:fade-in-0 fixed inset-0 z-50 bg-black/50 data-[closed=]:animate-out data-[expanded=]:animate-in\",\n        local.class\n      )}\n      data-slot=\"sheet-overlay\"\n      {...others}\n    />\n  )\n}\n\ntype SheetContentProps<T extends ValidComponent = \"div\"> = SheetPrimitive.DialogContentProps<T> & {\n  class?: string | undefined\n  children?: JSX.Element\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n  showCloseButton?: boolean\n}\n\nconst SheetContent = <T extends ValidComponent = \"div\">(\n  rawProps: PolymorphicProps<T, SheetContentProps<T>>\n) => {\n  const props = mergeProps<SheetContentProps<T>[]>(\n    { side: \"right\", showCloseButton: true },\n    rawProps\n  )\n  const [local, others] = splitProps(props as SheetContentProps, [\n    \"class\",\n    \"children\",\n    \"side\",\n    \"showCloseButton\"\n  ])\n  return (\n    <SheetPortal>\n      <SheetOverlay />\n      <SheetPrimitive.Content\n        class={cn(\n          \"fixed z-50 flex flex-col gap-4 bg-background shadow-lg transition ease-in-out data-[closed=]:animate-out data-[expanded=]:animate-in data-[closed=]:duration-300 data-[expanded=]:duration-500\",\n          local.side === \"right\" &&\n            \"data-[closed=]:slide-out-to-right data-[expanded=]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm\",\n          local.side === \"left\" &&\n            \"data-[closed=]:slide-out-to-left data-[expanded=]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm\",\n          local.side === \"top\" &&\n            \"data-[closed=]:slide-out-to-top data-[expanded=]:slide-in-from-top inset-x-0 top-0 h-auto border-b\",\n          local.side === \"bottom\" &&\n            \"data-[closed=]:slide-out-to-bottom data-[expanded=]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t\",\n          local.class\n        )}\n        data-slot=\"sheet-content\"\n        {...others}\n      >\n        {local.children}\n        {local.showCloseButton && (\n          <SheetClose class=\"absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary\">\n            <svg\n              class=\"size-4\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke-width=\"2\"\n              viewBox=\"0 0 24 24\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path d=\"M18 6l-12 12\" />\n              <path d=\"M6 6l12 12\" />\n            </svg>\n            <span class=\"sr-only\">Close</span>\n          </SheetClose>\n        )}\n      </SheetPrimitive.Content>\n    </SheetPortal>\n  )\n}\n\nconst SheetHeader: Component<ComponentProps<\"div\">> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n  return (\n    <div\n      class={cn(\"flex flex-col gap-1.5 p-4\", local.class)}\n      data-slot=\"sheet-header\"\n      {...others}\n    />\n  )\n}\n\nconst SheetFooter: Component<ComponentProps<\"div\">> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n  return (\n    <div\n      class={cn(\"mt-auto flex flex-col gap-2 p-4\", local.class)}\n      data-slot=\"sheet-footer\"\n      {...others}\n    />\n  )\n}\n\ntype SheetTitleProps<T extends ValidComponent = \"h2\"> = SheetPrimitive.DialogTitleProps<T> & {\n  class?: string | undefined\n}\n\nconst SheetTitle = <T extends ValidComponent = \"h2\">(\n  props: PolymorphicProps<T, SheetTitleProps<T>>\n) => {\n  const [local, others] = splitProps(props as SheetTitleProps, [\"class\"])\n  return (\n    <SheetPrimitive.Title class={cn(\"font-semibold text-foreground\", local.class)} {...others} />\n  )\n}\n\ntype SheetDescriptionProps<T extends ValidComponent = \"p\"> =\n  SheetPrimitive.DialogDescriptionProps<T> & { class?: string | undefined }\n\nconst SheetDescription = <T extends ValidComponent = \"p\">(\n  props: PolymorphicProps<T, SheetDescriptionProps<T>>\n) => {\n  const [local, others] = splitProps(props as SheetDescriptionProps, [\"class\"])\n  return (\n    <SheetPrimitive.Description\n      class={cn(\"text-muted-foreground text-sm\", local.class)}\n      {...others}\n    />\n  )\n}\n\nexport {\n  Sheet,\n  SheetTrigger,\n  SheetClose,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetTitle,\n  SheetDescription\n}\n",
      "type": "registry:ui"
    }
  ]
}