{
  "name": "drawer",
  "type": "registry:ui",
  "dependencies": [
    "@vueuse/core",
    "reka-ui"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "ui/drawer/Drawer.vue",
      "type": "registry:ui",
      "content": "<script lang=\"ts\" setup>\nimport type { DrawerRootEmits, DrawerRootProps } from \"reka-ui\"\nimport { DrawerRoot, useForwardPropsEmits } from \"reka-ui\"\n\nconst props = defineProps<DrawerRootProps>()\n\nconst emits = defineEmits<DrawerRootEmits>()\n\nconst forwarded = useForwardPropsEmits(props, emits)\n</script>\n\n<template>\n  <DrawerRoot\n    v-slot=\"slotProps\"\n    v-bind=\"forwarded\"\n  >\n    <slot v-bind=\"slotProps\" />\n  </DrawerRoot>\n</template>\n"
    },
    {
      "path": "ui/drawer/DrawerClose.vue",
      "type": "registry:ui",
      "content": "<script lang=\"ts\" setup>\nimport type { DrawerCloseProps } from \"reka-ui\"\nimport { DrawerClose } from \"reka-ui\"\n\nconst props = defineProps<DrawerCloseProps>()\n</script>\n\n<template>\n  <DrawerClose\n    data-slot=\"drawer-close\"\n    v-bind=\"props\"\n  >\n    <slot />\n  </DrawerClose>\n</template>\n"
    },
    {
      "path": "ui/drawer/DrawerContent.vue",
      "type": "registry:ui",
      "content": "<script lang=\"ts\" setup>\nimport type { DrawerContentEmits, DrawerContentProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport {\n  DrawerContent,\n  DrawerHandle,\n  DrawerPortal,\n  useForwardPropsEmits,\n} from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\nimport DrawerOverlay from \"./DrawerOverlay.vue\"\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<DrawerContentProps & { class?: HTMLAttributes[\"class\"] }>()\nconst emits = defineEmits<DrawerContentEmits>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwarded = useForwardPropsEmits(delegatedProps, emits)\n</script>\n\n<template>\n  <DrawerPortal>\n    <DrawerOverlay />\n    <DrawerContent\n      data-slot=\"drawer-content\"\n      v-bind=\"{ ...$attrs, ...forwarded }\"\n      :class=\"cn(\n        'cn-drawer-content group/drawer-content fixed z-50',\n        'will-change-transform transform-[translate3d(var(--drawer-swipe-movement-x,0px),var(--drawer-swipe-movement-y,0px),0)]',\n        'transition-transform duration-500 ease-[cubic-bezier(0.32,0.72,0,1)] data-swiping:duration-0 data-swiping:select-none',\n        'data-[state=open]:animate-in data-[state=closed]:animate-out',\n        'data-[swipe-direction=down]:data-[state=open]:slide-in-from-bottom data-[swipe-direction=down]:data-[state=closed]:slide-out-to-bottom',\n        'data-[swipe-direction=up]:data-[state=open]:slide-in-from-top data-[swipe-direction=up]:data-[state=closed]:slide-out-to-top',\n        'data-[swipe-direction=left]:data-[state=open]:slide-in-from-left data-[swipe-direction=left]:data-[state=closed]:slide-out-to-left',\n        'data-[swipe-direction=right]:data-[state=open]:slide-in-from-right data-[swipe-direction=right]:data-[state=closed]:slide-out-to-right',\n        props.class,\n      )\"\n    >\n      <DrawerHandle class=\"cn-drawer-handle mx-auto hidden shrink-0 group-data-[swipe-direction=down]/drawer-content:block\" />\n      <slot />\n    </DrawerContent>\n  </DrawerPortal>\n</template>\n"
    },
    {
      "path": "ui/drawer/DrawerDescription.vue",
      "type": "registry:ui",
      "content": "<script lang=\"ts\" setup>\nimport type { DrawerDescriptionProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { DrawerDescription } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<DrawerDescriptionProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n</script>\n\n<template>\n  <DrawerDescription\n    data-slot=\"drawer-description\"\n    v-bind=\"delegatedProps\"\n    :class=\"cn('cn-drawer-description', props.class)\"\n  >\n    <slot />\n  </DrawerDescription>\n</template>\n"
    },
    {
      "path": "ui/drawer/DrawerFooter.vue",
      "type": "registry:ui",
      "content": "<script lang=\"ts\" setup>\nimport type { HTMLAttributes } from \"vue\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<{\n  class?: HTMLAttributes[\"class\"]\n}>()\n</script>\n\n<template>\n  <div\n    data-slot=\"drawer-footer\"\n    :class=\"cn('cn-drawer-footer mt-auto flex flex-col', props.class)\"\n  >\n    <slot />\n  </div>\n</template>\n"
    },
    {
      "path": "ui/drawer/DrawerHeader.vue",
      "type": "registry:ui",
      "content": "<script lang=\"ts\" setup>\nimport type { HTMLAttributes } from \"vue\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<{\n  class?: HTMLAttributes[\"class\"]\n}>()\n</script>\n\n<template>\n  <div\n    data-slot=\"drawer-header\"\n    :class=\"cn('cn-drawer-header flex flex-col', props.class)\"\n  >\n    <slot />\n  </div>\n</template>\n"
    },
    {
      "path": "ui/drawer/DrawerOverlay.vue",
      "type": "registry:ui",
      "content": "<script lang=\"ts\" setup>\nimport type { DrawerOverlayProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { DrawerOverlay } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<DrawerOverlayProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n</script>\n\n<template>\n  <DrawerOverlay\n    data-slot=\"drawer-overlay\"\n    v-bind=\"delegatedProps\"\n    :class=\"cn('cn-drawer-overlay fixed inset-0 z-50', props.class)\"\n  />\n</template>\n"
    },
    {
      "path": "ui/drawer/DrawerTitle.vue",
      "type": "registry:ui",
      "content": "<script lang=\"ts\" setup>\nimport type { DrawerTitleProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { DrawerTitle } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<DrawerTitleProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n</script>\n\n<template>\n  <DrawerTitle\n    data-slot=\"drawer-title\"\n    v-bind=\"delegatedProps\"\n    :class=\"cn('cn-drawer-title cn-font-heading', props.class)\"\n  >\n    <slot />\n  </DrawerTitle>\n</template>\n"
    },
    {
      "path": "ui/drawer/DrawerTrigger.vue",
      "type": "registry:ui",
      "content": "<script lang=\"ts\" setup>\nimport type { DrawerTriggerProps } from \"reka-ui\"\nimport { DrawerTrigger } from \"reka-ui\"\n\nconst props = defineProps<DrawerTriggerProps>()\n</script>\n\n<template>\n  <DrawerTrigger\n    data-slot=\"drawer-trigger\"\n    v-bind=\"props\"\n  >\n    <slot />\n  </DrawerTrigger>\n</template>\n"
    },
    {
      "path": "ui/drawer/index.ts",
      "type": "registry:ui",
      "content": "export { default as Drawer } from \"./Drawer.vue\"\nexport { default as DrawerClose } from \"./DrawerClose.vue\"\nexport { default as DrawerContent } from \"./DrawerContent.vue\"\nexport { default as DrawerDescription } from \"./DrawerDescription.vue\"\nexport { default as DrawerFooter } from \"./DrawerFooter.vue\"\nexport { default as DrawerHeader } from \"./DrawerHeader.vue\"\nexport { default as DrawerOverlay } from \"./DrawerOverlay.vue\"\nexport { default as DrawerTitle } from \"./DrawerTitle.vue\"\nexport { default as DrawerTrigger } from \"./DrawerTrigger.vue\"\n"
    }
  ]
}