@etus/ui 0.4.0-beta.2 → 0.4.0-beta.3

package/dist/chunk-PLLJNHWU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/Drawer/Drawer.variants.ts","../src/components/navigation/Drawer/Drawer.tsx"],"names":["DrawerPrimitive"],"mappings":"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","file":"chunk-PLLJNHWU.js","sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\"\n\n/**\n * DrawerOverlay variant styles\n * Semi-transparent backdrop behind the drawer\n */\nexport const drawerOverlayVariants = cva([\n  \"fixed inset-0 z-50 bg-[color:var(--drawer-overlay-bg)]\",\n  \"data-[state=open]:animate-in data-[state=closed]:animate-out\",\n  \"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n])\n\n/**\n * DrawerContent variant styles\n * Main content container with directional positioning\n */\nexport const drawerContentVariants = cva(\n  [\n    \"group/drawer-content bg-[color:var(--drawer-content-bg)] fixed z-50 flex h-auto flex-col\",\n  ],\n  {\n    variants: {\n      /**\n       * Visual styling applied based on direction\n       * Note: Direction is controlled by vaul via data-vaul-drawer-direction attribute\n       */\n      direction: {\n        top: [\n          \"inset-x-0 top-0 mb-24 max-h-[80vh] rounded-b-[var(--drawer-content-radius)] border-b border-[color:var(--drawer-content-border)]\",\n        ],\n        bottom: [\n          \"inset-x-0 bottom-0 mt-24 max-h-[80vh] rounded-t-[var(--drawer-content-radius)] border-t border-[color:var(--drawer-content-border)]\",\n        ],\n        left: [\n          \"inset-y-0 left-0 w-3/4 border-r border-[color:var(--drawer-content-border)] sm:max-w-sm\",\n        ],\n        right: [\n          \"inset-y-0 right-0 w-3/4 border-l border-[color:var(--drawer-content-border)] sm:max-w-sm\",\n        ],\n      },\n    },\n    defaultVariants: {\n      direction: \"bottom\",\n    },\n  }\n)\n\n/**\n * DrawerContent base styles (direction handled by data attributes)\n * Use this when direction is controlled by vaul\n */\nexport const drawerContentBaseVariants = cva([\n  \"group/drawer-content bg-[color:var(--drawer-content-bg)] fixed z-50 flex h-auto flex-col\",\n  // Top direction styles\n  \"data-[vaul-drawer-direction=top]:inset-x-0\",\n  \"data-[vaul-drawer-direction=top]:top-0\",\n  \"data-[vaul-drawer-direction=top]:mb-24\",\n  \"data-[vaul-drawer-direction=top]:max-h-[80vh]\",\n  \"data-[vaul-drawer-direction=top]:rounded-b-[var(--drawer-content-radius)]\",\n  \"data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=top]:border-[color:var(--drawer-content-border)]\",\n  // Bottom direction styles\n  \"data-[vaul-drawer-direction=bottom]:inset-x-0\",\n  \"data-[vaul-drawer-direction=bottom]:bottom-0\",\n  \"data-[vaul-drawer-direction=bottom]:mt-24\",\n  \"data-[vaul-drawer-direction=bottom]:max-h-[80vh]\",\n  \"data-[vaul-drawer-direction=bottom]:rounded-t-[var(--drawer-content-radius)]\",\n  \"data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=bottom]:border-[color:var(--drawer-content-border)]\",\n  // Right direction styles\n  \"data-[vaul-drawer-direction=right]:inset-y-0\",\n  \"data-[vaul-drawer-direction=right]:right-0\",\n  \"data-[vaul-drawer-direction=right]:w-3/4\",\n  \"data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:border-[color:var(--drawer-content-border)]\",\n  \"data-[vaul-drawer-direction=right]:sm:max-w-sm\",\n  // Left direction styles\n  \"data-[vaul-drawer-direction=left]:inset-y-0\",\n  \"data-[vaul-drawer-direction=left]:left-0\",\n  \"data-[vaul-drawer-direction=left]:w-3/4\",\n  \"data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:border-[color:var(--drawer-content-border)]\",\n  \"data-[vaul-drawer-direction=left]:sm:max-w-sm\",\n])\n\n/**\n * Drawer handle (drag indicator) variant styles\n */\nexport const drawerHandleVariants = cva([\n  \"bg-[color:var(--drawer-handle-bg)] mx-auto mt-[var(--drawer-handle-margin-top)] h-[var(--drawer-handle-height)] w-[var(--drawer-handle-width)] shrink-0 rounded-full\",\n  \"hidden group-data-[vaul-drawer-direction=bottom]/drawer-content:block\",\n])\n\n/**\n * DrawerHeader variant styles\n */\nexport const drawerHeaderVariants = cva([\n  \"flex flex-col gap-[var(--drawer-header-gap)] p-[var(--drawer-header-padding)]\",\n  \"md:gap-1.5 md:text-left\",\n  \"group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center\",\n  \"group-data-[vaul-drawer-direction=top]/drawer-content:text-center\",\n])\n\n/**\n * DrawerFooter variant styles\n */\nexport const drawerFooterVariants = cva([\n  \"mt-auto flex flex-col gap-[var(--drawer-footer-gap)] p-[var(--drawer-footer-padding)]\",\n])\n\n/**\n * DrawerTitle variant styles\n */\nexport const drawerTitleVariants = cva([\n  \"text-foreground font-semibold\",\n])\n\n/**\n * DrawerDescription variant styles\n */\nexport const drawerDescriptionVariants = cva([\n  \"text-muted-foreground text-sm\",\n])\n\nexport type DrawerContentVariantProps = VariantProps<typeof drawerContentVariants>\n","\"use client\"\n\nimport type {\n  DrawerCloseProps,\n  DrawerContentProps,\n  DrawerDescriptionProps,\n  DrawerFooterProps,\n  DrawerHeaderProps,\n  DrawerOverlayProps,\n  DrawerPortalProps,\n  DrawerProps,\n  DrawerTitleProps,\n  DrawerTriggerProps,\n} from \"./Drawer.types\"\n\nimport { Drawer as DrawerPrimitive } from \"vaul\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  drawerContentBaseVariants,\n  drawerDescriptionVariants,\n  drawerFooterVariants,\n  drawerHandleVariants,\n  drawerHeaderVariants,\n  drawerOverlayVariants,\n  drawerTitleVariants,\n} from \"./Drawer.variants\"\n\n/**\n * Drawer - A drawer/slide-out panel component.\n *\n * Built on top of vaul for touch-friendly drawer behavior.\n * Supports all four directions: top, bottom, left, right.\n *\n * @example\n * <Drawer>\n *   <DrawerTrigger>Open Drawer</DrawerTrigger>\n *   <DrawerContent>\n *     <DrawerHeader>\n *       <DrawerTitle>Title</DrawerTitle>\n *       <DrawerDescription>Description</DrawerDescription>\n *     </DrawerHeader>\n *     <div className=\"p-4\">Content</div>\n *   </DrawerContent>\n * </Drawer>\n */\nfunction Drawer({ ...props }: DrawerProps) {\n  return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />\n}\n\n/**\n * DrawerTrigger - Button that opens the drawer.\n */\nfunction DrawerTrigger({ ...props }: DrawerTriggerProps) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />\n}\n\n/**\n * DrawerPortal - Renders drawer content in a portal.\n */\nfunction DrawerPortal({ ...props }: DrawerPortalProps) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\n/**\n * DrawerClose - Button that closes the drawer.\n */\nfunction DrawerClose({ ...props }: DrawerCloseProps) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />\n}\n\n/**\n * DrawerOverlay - Semi-transparent backdrop behind the drawer.\n */\nfunction DrawerOverlay({ className, ...props }: DrawerOverlayProps) {\n  return (\n    <DrawerPrimitive.Overlay\n      className={cn(drawerOverlayVariants(), className)}\n      data-slot=\"drawer-overlay\"\n      {...props}\n    />\n  )\n}\n\n/**\n * DrawerContent - Main content container for the drawer.\n *\n * Automatically includes overlay and handles positioning based on direction.\n * Includes a drag handle for bottom drawers.\n */\nfunction DrawerContent({\n  className,\n  children,\n  ...props\n}: DrawerContentProps) {\n  return (\n    <DrawerPortal data-slot=\"drawer-portal\">\n      <DrawerOverlay />\n      <DrawerPrimitive.Content\n        className={cn(drawerContentBaseVariants(), className)}\n        data-slot=\"drawer-content\"\n        {...props}\n      >\n        <div className={cn(drawerHandleVariants())} />\n        {children}\n      </DrawerPrimitive.Content>\n    </DrawerPortal>\n  )\n}\n\n/**\n * DrawerHeader - Container for drawer title and description.\n *\n * Centered text for top/bottom drawers, left-aligned for side drawers on desktop.\n */\nfunction DrawerHeader({ className, ...props }: DrawerHeaderProps) {\n  return (\n    <div\n      className={cn(drawerHeaderVariants(), className)}\n      data-slot=\"drawer-header\"\n      {...props}\n    />\n  )\n}\n\n/**\n * DrawerFooter - Footer container for drawer actions.\n *\n * Positioned at the bottom with auto margin-top.\n */\nfunction DrawerFooter({ className, ...props }: DrawerFooterProps) {\n  return (\n    <div\n      className={cn(drawerFooterVariants(), className)}\n      data-slot=\"drawer-footer\"\n      {...props}\n    />\n  )\n}\n\n/**\n * DrawerTitle - Title text for the drawer.\n */\nfunction DrawerTitle({ className, ...props }: DrawerTitleProps) {\n  return (\n    <DrawerPrimitive.Title\n      className={cn(drawerTitleVariants(), className)}\n      data-slot=\"drawer-title\"\n      {...props}\n    />\n  )\n}\n\n/**\n * DrawerDescription - Description text for the drawer.\n */\nfunction DrawerDescription({ className, ...props }: DrawerDescriptionProps) {\n  return (\n    <DrawerPrimitive.Description\n      className={cn(drawerDescriptionVariants(), className)}\n      data-slot=\"drawer-description\"\n      {...props}\n    />\n  )\n}\n\nexport {\n  Drawer,\n  DrawerClose,\n  DrawerContent,\n  DrawerDescription,\n  DrawerFooter,\n  DrawerHeader,\n  DrawerOverlay,\n  DrawerPortal,\n  DrawerTitle,\n  DrawerTrigger,\n}\n"]}