@zentauri-ui/zentauri-components 0.0.7 → 0.0.9

package/dist/ui/drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ui/drawer/drawer.tsx","../../src/lib/utils.ts","../../src/ui/drawer/animations.ts","../../src/ui/drawer/variants.ts"],"sourcesContent":["\"use client\";\n\nimport { AnimatePresence, motion, useReducedMotion } from \"framer-motion\";\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport { drawerPanelPresets } from \"./animations\";\nimport type {\n  DrawerContentProps,\n  DrawerProps,\n  DrawerSectionProps,\n  DrawerTriggerProps,\n} from \"./types\";\nimport { drawerContentVariants, drawerOverlayVariants, drawerTriggerVariants } from \"./variants\";\n\ntype DrawerCtx = {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  titleId: string;\n  descriptionId: string;\n  contentRef: React.RefObject<HTMLDivElement | null>;\n};\n\nconst DrawerContext = createContext<DrawerCtx | null>(null);\n\nfunction useDrawerContext(component: string): DrawerCtx {\n  const ctx = useContext(DrawerContext);\n  if (!ctx) {\n    throw new Error(`${component} must be used within <Drawer>`);\n  }\n  return ctx;\n}\n\nconst FOCUSABLE_SELECTOR =\n  'a[href], button:not([disabled]), textarea, input, select, [tabindex]:not([tabindex=\"-1\"])';\n\nfunction useBodyScrollLock(locked: boolean) {\n  useEffect(() => {\n    if (!locked) {\n      return;\n    }\n    const previousOverflow = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = previousOverflow;\n    };\n  }, [locked]);\n}\n\nexport function Drawer({ open, defaultOpen = false, onOpenChange, children }: DrawerProps) {\n  const isControlled = open !== undefined;\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n  const resolvedOpen = isControlled ? Boolean(open) : uncontrolledOpen;\n\n  const setOpen = useCallback(\n    (next: boolean) => {\n      if (!isControlled) {\n        setUncontrolledOpen(next);\n      }\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  const baseId = useId();\n  const titleId = `${baseId}-title`;\n  const descriptionId = `${baseId}-description`;\n  const contentRef = useRef<HTMLDivElement | null>(null);\n\n  const ctx = useMemo(\n    () => ({\n      open: resolvedOpen,\n      setOpen,\n      titleId,\n      descriptionId,\n      contentRef,\n    }),\n    [descriptionId, resolvedOpen, setOpen, titleId],\n  );\n\n  return <DrawerContext.Provider value={ctx}>{children}</DrawerContext.Provider>;\n}\n\nDrawer.displayName = \"Drawer\";\n\nexport function DrawerTrigger({ className, children, appearance, onClick, ref, ...rest }: DrawerTriggerProps) {\n  const { setOpen } = useDrawerContext(\"DrawerTrigger\");\n  return (\n    <button\n      ref={ref}\n      type=\"button\"\n      data-slot=\"drawer-trigger\"\n      className={cn(drawerTriggerVariants({ appearance }), className)}\n      onClick={(event) => {\n        onClick?.(event);\n        if (!event.defaultPrevented) {\n          setOpen(true);\n        }\n      }}\n      {...rest}\n    >\n      {children}\n    </button>\n  );\n}\n\nDrawerTrigger.displayName = \"DrawerTrigger\";\n\nexport function DrawerContent({\n  className,\n  side = \"right\",\n  size,\n  appearance,\n  animation = \"slide\",\n  children,\n  ref,\n  id,\n  style,\n}: DrawerContentProps) {\n  const { open, setOpen, titleId, descriptionId, contentRef } = useDrawerContext(\"DrawerContent\");\n  const resolvedSide = side ?? \"right\";\n  const reduceMotion = useReducedMotion();\n  const overlayMotion = drawerPanelPresets(resolvedSide)[reduceMotion ? \"fade\" : animation];\n  const panelMotion = drawerPanelPresets(resolvedSide)[reduceMotion ? \"fade\" : animation];\n\n  useBodyScrollLock(open);\n\n  useEffect(() => {\n    if (!open) {\n      return;\n    }\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        setOpen(false);\n      }\n    };\n    window.addEventListener(\"keydown\", handleKeyDown);\n    return () => window.removeEventListener(\"keydown\", handleKeyDown);\n  }, [open, setOpen]);\n\n  useEffect(() => {\n    if (!open) {\n      return;\n    }\n    const node = contentRef.current;\n    if (!node) {\n      return;\n    }\n    const focusables = Array.from(\n      node.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR),\n    ).filter((element) => element.offsetParent !== null || element === node);\n    const target = focusables[0] ?? node;\n    const previouslyFocused = document.activeElement as HTMLElement | null;\n    target.focus();\n\n    const handleFocusIn = (event: FocusEvent) => {\n      if (!node.contains(event.target as Node)) {\n        event.stopPropagation();\n        target.focus();\n      }\n    };\n    document.addEventListener(\"focusin\", handleFocusIn);\n    return () => {\n      document.removeEventListener(\"focusin\", handleFocusIn);\n      previouslyFocused?.focus?.();\n    };\n  }, [contentRef, open]);\n\n  const portalTarget = typeof document !== \"undefined\" ? document.body : null;\n  if (!portalTarget) {\n    return null;\n  }\n\n  return createPortal(\n    <AnimatePresence>\n      {open ? (\n        <div className=\"fixed inset-0 z-50\" data-slot=\"drawer-portal\">\n          <motion.button\n            type=\"button\"\n            aria-hidden\n            tabIndex={-1}\n            data-slot=\"drawer-overlay\"\n            className={drawerOverlayVariants()}\n            onClick={() => setOpen(false)}\n            initial={animation === \"none\" ? false : overlayMotion.initial}\n            animate={animation === \"none\" ? undefined : overlayMotion.animate}\n            exit={animation === \"none\" ? undefined : overlayMotion.exit}\n            transition={overlayMotion.transition}\n          />\n          <motion.div\n            ref={(node) => {\n              contentRef.current = node;\n              if (typeof ref === \"function\") {\n                ref(node);\n              } else if (ref) {\n                (ref as React.MutableRefObject<HTMLDivElement | null>).current = node;\n              }\n            }}\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-labelledby={titleId}\n            aria-describedby={descriptionId}\n            data-slot=\"drawer-content\"\n            tabIndex={-1}\n            className={cn(\n              drawerContentVariants({ side: resolvedSide, size, appearance }),\n              className,\n            )}\n            initial={animation === \"none\" ? false : panelMotion.initial}\n            animate={animation === \"none\" ? undefined : panelMotion.animate}\n            exit={animation === \"none\" ? undefined : panelMotion.exit}\n            transition={panelMotion.transition}\n            id={id}\n            style={style}\n          >\n            {children}\n          </motion.div>\n        </div>\n      ) : null}\n    </AnimatePresence>,\n    portalTarget,\n  );\n}\n\nDrawerContent.displayName = \"DrawerContent\";\n\nexport function DrawerHeader({ className, children }: DrawerSectionProps) {\n  return (\n    <header data-slot=\"drawer-header\" className={cn(\"mb-4 flex flex-col gap-2\", className)}>\n      {children}\n    </header>\n  );\n}\n\nDrawerHeader.displayName = \"DrawerHeader\";\n\nexport function DrawerBody({ className, children }: DrawerSectionProps) {\n  return (\n    <div data-slot=\"drawer-body\" className={cn(\"flex-1 text-sm text-slate-300\", className)}>\n      {children}\n    </div>\n  );\n}\n\nDrawerBody.displayName = \"DrawerBody\";\n\nexport function DrawerFooter({ className, children }: DrawerSectionProps) {\n  return (\n    <footer data-slot=\"drawer-footer\" className={cn(\"mt-6 flex justify-end gap-2\", className)}>\n      {children}\n    </footer>\n  );\n}\n\nDrawerFooter.displayName = \"DrawerFooter\";\n\nexport function DrawerTitle({ className, children }: DrawerSectionProps) {\n  const { titleId } = useDrawerContext(\"DrawerTitle\");\n  return (\n    <h2 id={titleId} data-slot=\"drawer-title\" className={cn(\"text-lg font-semibold\", className)}>\n      {children}\n    </h2>\n  );\n}\n\nDrawerTitle.displayName = \"DrawerTitle\";\n\nexport function DrawerClose({ className, children, ...rest }: DrawerSectionProps) {\n  const { setOpen } = useDrawerContext(\"DrawerClose\");\n  return (\n    <button\n      type=\"button\"\n      data-slot=\"drawer-close\"\n      className={cn(\n        \"absolute right-4 top-4 inline-flex size-9 items-center justify-center rounded-md text-slate-200 transition hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/30\",\n        className,\n      )}\n      aria-label=\"Close drawer\"\n      onClick={() => setOpen(false)}\n      {...rest}\n    >\n      {children ?? \"×\"}\n    </button>\n  );\n}\n\nDrawerClose.displayName = \"DrawerClose\";\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}","import type { HTMLMotionProps } from \"framer-motion\";\n\nexport type DrawerAnimation = \"none\" | \"fade\" | \"scale\" | \"slide\";\n\ntype DrawerPresetMotionProps = Pick<\n  HTMLMotionProps<\"div\">,\n  \"initial\" | \"animate\" | \"exit\" | \"transition\"\n>;\n\nexport type DrawerAnimationPresets = Record<DrawerAnimation, DrawerPresetMotionProps>;\n\nexport const drawerPanelPresets = (\n  side: \"left\" | \"right\" | \"top\" | \"bottom\",\n): DrawerAnimationPresets => ({\n  none: {},\n  fade: {\n    initial: { opacity: 0 },\n    animate: { opacity: 1 },\n    exit: { opacity: 0 },\n    transition: { duration: 0.2 },\n  },\n  scale: {\n    initial: { opacity: 0, scale: 0.98 },\n    animate: { opacity: 1, scale: 1 },\n    exit: { opacity: 0, scale: 0.98 },\n    transition: { type: \"spring\", stiffness: 420, damping: 32 },\n  },\n  slide: {\n    initial:\n      side === \"left\"\n        ? { x: -24, opacity: 0 }\n        : side === \"right\"\n          ? { x: 24, opacity: 0 }\n          : side === \"top\"\n            ? { y: -24, opacity: 0 }\n            : { y: 24, opacity: 0 },\n    animate: { x: 0, y: 0, opacity: 1 },\n    exit:\n      side === \"left\"\n        ? { x: -16, opacity: 0 }\n        : side === \"right\"\n          ? { x: 16, opacity: 0 }\n          : side === \"top\"\n            ? { y: -16, opacity: 0 }\n            : { y: 16, opacity: 0 },\n    transition: { type: \"spring\", stiffness: 380, damping: 30 },\n  },\n});\n","import { cva } from \"class-variance-authority\";\n\nexport const drawerOverlayVariants = cva(\"fixed inset-0 z-50 bg-slate-950/70 backdrop-blur-sm\");\n\nexport const drawerTriggerVariants = cva(\n  \"relative inline-flex shrink-0 cursor-pointer rounded-md border\",\n  {\n    variants: {\n      appearance: {\n        default: \"bg-slate-950\",\n        glass: \"border-white/15 bg-slate-950/70 backdrop-blur-xl\",\n        sky: \"border-sky-600 bg-sky-950/70 backdrop-blur-xl\",\n        rose: \"border-rose-600 bg-rose-950/70 backdrop-blur-xl\",\n        purple: \"border-purple-600 bg-purple-950/70 backdrop-blur-xl\",\n        pink: \"border-pink-600 bg-pink-950/70 backdrop-blur-xl\",\n        orange: \"border-orange-600 bg-orange-950/70 backdrop-blur-xl\",\n        yellow: \"border-yellow-600 bg-yellow-950/70 backdrop-blur-xl\",\n        teal: \"border-teal-600 bg-teal-950/70 backdrop-blur-xl\",\n        indigo: \"border-indigo-600 bg-indigo-950/70 backdrop-blur-xl\",\n        emerald: \"border-emerald-600 bg-emerald-950/70 backdrop-blur-xl\",\n        gray: \"border-gray-600 bg-gray-950/70 backdrop-blur-xl\",\n        amber: \"border-amber-600 bg-amber-950/70 backdrop-blur-xl\",\n        violet: \"border-violet-600 bg-violet-950/70 backdrop-blur-xl\",\n        \"gradient-blue\": \"border-gradient-to-r from-blue-600 to-purple-600 bg-gradient-to-r from-blue-950/70 to-purple-950/70 backdrop-blur-xl\",\n        \"gradient-green\": \"border-gradient-to-r from-green-600 to-lime-600 bg-gradient-to-r from-green-950/70 to-lime-950/70 backdrop-blur-xl\",\n        \"gradient-red\": \"border-gradient-to-r from-red-600 to-pink-600 bg-gradient-to-r from-red-950/70 to-pink-950/70 backdrop-blur-xl\",\n        \"gradient-yellow\": \"border-gradient-to-r from-yellow-600 to-orange-600 bg-gradient-to-r from-yellow-950/70 to-orange-950/70 backdrop-blur-xl\",\n        \"gradient-purple\": \"border-gradient-to-r from-purple-600 to-pink-600 bg-gradient-to-r from-purple-950/70 to-pink-950/70 backdrop-blur-xl\",\n        \"gradient-teal\": \"border-gradient-to-r from-teal-600 to-cyan-600 bg-gradient-to-r from-teal-950/70 to-cyan-950/70 backdrop-blur-xl\",\n        \"gradient-indigo\": \"border-gradient-to-r from-indigo-600 to-purple-600 bg-gradient-to-r from-indigo-950/70 to-purple-950/70 backdrop-blur-xl\",\n        \"gradient-pink\": \"border-gradient-to-r from-pink-600 to-rose-600 bg-gradient-to-r from-pink-950/70 to-rose-950/70 backdrop-blur-xl\",\n        \"gradient-orange\": \"border-gradient-to-r from-orange-600 to-red-600 bg-gradient-to-r from-orange-950/70 to-red-950/70 backdrop-blur-xl\",\n      },\n    },\n    defaultVariants: {\n      appearance: \"default\",\n    },\n  },\n);\n\nexport const drawerContentVariants = cva(\n  \"fixed z-50 flex max-h-[min(92vh,900px)] flex-col border border-white/10 bg-slate-950 p-6 text-slate-50 shadow-[0_24px_80px_rgba(15,23,42,0.55)] focus:outline-none\",\n  {\n    variants: {\n      side: {\n        left: \"left-0 top-0 h-full w-[min(100%,420px)]\",\n        right: \"right-0 top-0 h-full w-[min(100%,420px)]\",\n        top: \"left-0 top-0 w-full max-h-[min(92vh,520px)]\",\n        bottom: \"bottom-0 left-0 w-full max-h-[min(92vh,520px)]\",\n      },\n      size: {\n        sm: \"\",\n        md: \"\",\n        lg: \"\",\n        xl: \"\",\n        full: \"\",\n      },\n      appearance: {\n        default: \"bg-slate-950\",\n        glass: \"border-white/15 bg-slate-950/70 backdrop-blur-xl\",\n        sky: \"border-sky-600 bg-sky-950/70 backdrop-blur-xl\",\n        rose: \"border-rose-600 bg-rose-950/70 backdrop-blur-xl\",\n        purple: \"border-purple-600 bg-purple-950/70 backdrop-blur-xl\",\n        pink: \"border-pink-600 bg-pink-950/70 backdrop-blur-xl\",\n        orange: \"border-orange-600 bg-orange-950/70 backdrop-blur-xl\",\n        yellow: \"border-yellow-600 bg-yellow-950/70 backdrop-blur-xl\",\n        teal: \"border-teal-600 bg-teal-950/70 backdrop-blur-xl\",\n        indigo: \"border-indigo-600 bg-indigo-950/70 backdrop-blur-xl\",\n        emerald: \"border-emerald-600 bg-emerald-950/70 backdrop-blur-xl\",\n        gray: \"border-gray-600 bg-gray-950/70 backdrop-blur-xl\",\n        amber: \"border-amber-600 bg-amber-950/70 backdrop-blur-xl\",\n        violet: \"border-violet-600 bg-violet-950/70 backdrop-blur-xl\",\n        \"gradient-blue\": \"border-gradient-to-r from-blue-600 to-purple-600 bg-gradient-to-r from-blue-950/70 to-purple-950/70 backdrop-blur-xl\",\n        \"gradient-green\": \"border-gradient-to-r from-green-600 to-lime-600 bg-gradient-to-r from-green-950/70 to-lime-950/70 backdrop-blur-xl\",\n        \"gradient-red\": \"border-gradient-to-r from-red-600 to-pink-600 bg-gradient-to-r from-red-950/70 to-pink-950/70 backdrop-blur-xl\",\n        \"gradient-yellow\": \"border-gradient-to-r from-yellow-600 to-orange-600 bg-gradient-to-r from-yellow-950/70 to-orange-950/70 backdrop-blur-xl\",\n        \"gradient-purple\": \"border-gradient-to-r from-purple-600 to-pink-600 bg-gradient-to-r from-purple-950/70 to-pink-950/70 backdrop-blur-xl\",\n        \"gradient-teal\": \"border-gradient-to-r from-teal-600 to-cyan-600 bg-gradient-to-r from-teal-950/70 to-cyan-950/70 backdrop-blur-xl\",\n        \"gradient-indigo\": \"border-gradient-to-r from-indigo-600 to-purple-600 bg-gradient-to-r from-indigo-950/70 to-purple-950/70 backdrop-blur-xl\",\n        \"gradient-pink\": \"border-gradient-to-r from-pink-600 to-rose-600 bg-gradient-to-r from-pink-950/70 to-rose-950/70 backdrop-blur-xl\",\n        \"gradient-orange\": \"border-gradient-to-r from-orange-600 to-red-600 bg-gradient-to-r from-orange-950/70 to-red-950/70 backdrop-blur-xl\",\n      },\n    },\n    compoundVariants: [\n      { side: \"left\", size: \"sm\", class: \"w-[min(100%,320px)]\" },\n      { side: \"left\", size: \"md\", class: \"w-[min(100%,420px)]\" },\n      { side: \"left\", size: \"lg\", class: \"w-[min(100%,520px)]\" },\n      { side: \"left\", size: \"xl\", class: \"w-[min(100%,640px)]\" },\n      { side: \"left\", size: \"full\", class: \"w-full max-w-none\" },\n      { side: \"right\", size: \"sm\", class: \"w-[min(100%,320px)]\" },\n      { side: \"right\", size: \"md\", class: \"w-[min(100%,420px)]\" },\n      { side: \"right\", size: \"lg\", class: \"w-[min(100%,520px)]\" },\n      { side: \"right\", size: \"xl\", class: \"w-[min(100%,640px)]\" },\n      { side: \"right\", size: \"full\", class: \"w-full max-w-none\" },\n    ],\n    defaultVariants: {\n      side: \"right\",\n      size: \"md\",\n      appearance: \"default\",\n    },\n  },\n);\n"],"mappings":"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","names":[]}

package/dist/ui/dropdown.cjs

@@ -0,0 +1,302 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/ui/dropdown/index.ts
+var dropdown_exports = {};
+__export(dropdown_exports, {
+  Dropdown: () => Dropdown,
+  DropdownContent: () => DropdownContent,
+  DropdownItem: () => DropdownItem,
+  DropdownTrigger: () => DropdownTrigger,
+  contentVariants: () => contentVariants,
+  itemVariants: () => itemVariants,
+  triggerVariants: () => triggerVariants
+});
+module.exports = __toCommonJS(dropdown_exports);
+
+// src/ui/dropdown/dropdown.tsx
+var import_react = require("react");
+var import_fi = require("react-icons/fi");
+
+// src/lib/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/ui/dropdown/variants.ts
+var import_class_variance_authority = require("class-variance-authority");
+var triggerVariants = (0, import_class_variance_authority.cva)(
+  "inline-flex items-center justify-between rounded-md font-medium transition focus:outline-none cursor-pointer",
+  {
+    variants: {
+      variant: {
+        default: "bg-gray-900 text-white",
+        outline: "border border-gray-300",
+        ghost: "bg-transparent",
+        white: "bg-white text-gray-900",
+        black: "bg-black text-white",
+        sky: "border border-sky-600 text-sky-600",
+        rose: "border border-rose-600 text-rose-600",
+        purple: "border border-purple-600 text-purple-600",
+        pink: "border border-pink-600 text-pink-600",
+        orange: "border border-orange-600 text-orange-600",
+        yellow: "border border-yellow-600 text-yellow-600",
+        teal: "border border-teal-600 text-teal-600",
+        indigo: "border border-indigo-600 text-indigo-600",
+        emerald: "border border-emerald-600 text-emerald-600",
+        gray: "border border-gray-600 text-gray-600",
+        amber: "border border-amber-600 text-amber-600",
+        violet: "border border-violet-600 text-violet-600",
+        "gradient-blue": "bg-gradient-to-r from-blue-600 to-purple-600 text-gradient-to-r from-blue-600 to-purple-600",
+        "gradient-green": "bg-gradient-to-r from-green-600 to-lime-600 text-gradient-to-r from-green-600 to-lime-600",
+        "gradient-red": "bg-gradient-to-r from-red-600 to-pink-600 text-gradient-to-r from-red-600 to-pink-600",
+        "gradient-yellow": "bg-gradient-to-r from-yellow-600 to-orange-600 text-gradient-to-r from-yellow-600 to-orange-600",
+        "gradient-purple": "bg-gradient-to-r from-purple-600 to-pink-600 text-gradient-to-r from-purple-600 to-pink-600",
+        "gradient-teal": "bg-gradient-to-r from-teal-600 to-cyan-600 text-gradient-to-r from-teal-600 to-cyan-600",
+        "gradient-indigo": "bg-gradient-to-r from-indigo-600 to-purple-600 text-gradient-to-r from-indigo-600 to-purple-600",
+        "gradient-pink": "bg-gradient-to-r from-pink-600 to-rose-600 text-gradient-to-r from-pink-600 to-rose-600",
+        "gradient-orange": "bg-gradient-to-r from-orange-600 to-red-600 text-gradient-to-r from-orange-600 to-red-600"
+      },
+      size: {
+        sm: "px-2 py-1 text-sm",
+        md: "px-3 py-2 text-base",
+        lg: "px-4 py-3 text-lg"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "md"
+    }
+  }
+);
+var contentVariants = (0, import_class_variance_authority.cva)(
+  "absolute min-w-[200px] rounded-md p-2 shadow-md z-50 border",
+  {
+    variants: {
+      placement: {
+        top: "bottom-full mb-2",
+        bottom: "top-full mt-2",
+        left: "right-full mr-2",
+        right: "left-full ml-2"
+      },
+      spacing: {
+        none: "space-y-0",
+        default: "space-y-1",
+        sm: "space-y-2",
+        md: "space-y-3",
+        lg: "space-y-4",
+        xl: "space-y-5"
+      }
+    },
+    defaultVariants: {
+      placement: "bottom",
+      spacing: "default"
+    }
+  }
+);
+var itemVariants = (0, import_class_variance_authority.cva)(
+  "flex items-center justify-between px-3 py-2 text-sm cursor-pointer rounded-md transition-colors",
+  {
+    variants: {
+      variant: {
+        default: "hover:bg-gray-100 hover:text-gray-900 text-gray-100",
+        outline: "hover:bg-gray-100 hover:text-gray-900 border border-white text-gray-100",
+        ghost: "hover:bg-gray-100 hover:text-gray-900 bg-transparent text-gray-100",
+        white: "hover:bg-gray-100 hover:text-gray-900 bg-white text-gray-900",
+        black: "hover:bg-gray-100 hover:text-gray-900 bg-black text-white",
+        sky: "hover:bg-sky-100 hover:text-sky-600 bg-sky-200 text-sky-800",
+        rose: "hover:bg-rose-100 hover:text-rose-600 bg-rose-200 text-rose-800",
+        purple: "hover:bg-purple-100 hover:text-purple-600 bg-purple-200 text-purple-800",
+        pink: "hover:bg-pink-100 hover:text-pink-600 bg-pink-200 text-pink-800",
+        orange: "hover:bg-orange-100 hover:text-orange-600 bg-orange-200 text-orange-800",
+        yellow: "hover:bg-yellow-100 hover:text-yellow-600 bg-yellow-200 text-yellow-800",
+        teal: "hover:bg-teal-100 hover:text-teal-600 bg-teal-200 text-teal-800",
+        indigo: "hover:bg-indigo-100 hover:text-indigo-600 bg-indigo-200 text-indigo-800",
+        emerald: "hover:bg-emerald-100 hover:text-emerald-600 bg-emerald-200 text-emerald-800",
+        gray: "hover:bg-gray-100 hover:text-gray-900 bg-gray-200 text-gray-800",
+        amber: "hover:bg-amber-100 hover:text-amber-600 bg-amber-200 text-amber-800",
+        violet: "hover:bg-violet-100 hover:text-violet-600 bg-violet-200 text-violet-800",
+        "gradient-blue": "hover:bg-gradient-to-r from-blue-600 to-purple-600 hover:text-blue-900 bg-gradient-to-r from-blue-200 to-purple-200 text-blue-800",
+        "gradient-green": "hover:bg-gradient-to-r from-green-600 to-lime-600 hover:text-green-900 bg-gradient-to-r from-green-200 to-lime-200 text-green-800",
+        "gradient-red": "hover:bg-gradient-to-r from-red-600 to-pink-600 hover:text-red-900 bg-gradient-to-r from-red-200 to-pink-200 text-red-800",
+        "gradient-yellow": "hover:bg-gradient-to-r from-yellow-600 to-orange-600 hover:text-yellow-900 bg-gradient-to-r from-yellow-200 to-orange-200 text-yellow-800",
+        "gradient-purple": "hover:bg-gradient-to-r from-purple-600 to-pink-600 hover:text-purple-900 bg-gradient-to-r from-purple-200 to-pink-200 text-purple-800",
+        "gradient-teal": "hover:bg-gradient-to-r from-teal-600 to-cyan-600 hover:text-teal-900 bg-gradient-to-r from-teal-200 to-cyan-200 text-teal-800",
+        "gradient-indigo": "hover:bg-gradient-to-r from-indigo-600 to-purple-600 hover:text-indigo-900 bg-gradient-to-r from-indigo-200 to-purple-200 text-indigo-800",
+        "gradient-pink": "hover:bg-gradient-to-r from-pink-600 to-rose-600 hover:text-pink-900 bg-gradient-to-r from-pink-200 to-rose-200 text-pink-800",
+        "gradient-orange": "hover:bg-gradient-to-r from-orange-600 to-red-600 hover:text-orange-900 bg-gradient-to-r from-orange-200 to-red-200 text-orange-800"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+
+// src/ui/dropdown/dropdown.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var DropdownContext = (0, import_react.createContext)(null);
+var useDropdown = () => {
+  const ctx = (0, import_react.useContext)(DropdownContext);
+  if (!ctx) throw new Error("Use inside Dropdown");
+  return ctx;
+};
+var Dropdown = ({
+  children,
+  defaultOpen = false,
+  open: controlledOpen,
+  onOpenChange,
+  multiSelect = false
+}) => {
+  const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react.useState)(defaultOpen);
+  const [selectedValues, setSelectedValues] = (0, import_react.useState)([]);
+  const open = controlledOpen ?? uncontrolledOpen;
+  const setOpen = (val) => {
+    if (controlledOpen !== void 0) {
+      onOpenChange?.(val);
+    } else {
+      setUncontrolledOpen(val);
+    }
+  };
+  const toggle = () => setOpen(!open);
+  const toggleSelect = (value) => {
+    if (!multiSelect) {
+      setSelectedValues([value]);
+      setOpen(false);
+      return;
+    }
+    setSelectedValues(
+      (prev) => prev.includes(value) ? prev.filter((v) => v !== value) : [...prev, value]
+    );
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    DropdownContext.Provider,
+    {
+      value: {
+        open,
+        setOpen,
+        toggle,
+        selectedValues,
+        toggleSelect,
+        multiSelect
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative inline-block", children })
+    }
+  );
+};
+var DropdownTrigger = ({
+  children,
+  className,
+  variant,
+  size,
+  ...props
+}) => {
+  const { toggle } = useDropdown();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "button",
+    {
+      onClick: toggle,
+      className: cn(triggerVariants({ variant, size }), className),
+      ...props,
+      children
+    }
+  );
+};
+var DropdownContent = ({
+  children,
+  className,
+  placement = "bottom",
+  spacing = "default",
+  divider,
+  ...props
+}) => {
+  const { open, setOpen } = useDropdown();
+  const ref = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    const handleClickOutside = (e) => {
+      if (ref.current && !ref.current.contains(e.target)) {
+        setOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, [setOpen]);
+  if (!open) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      ref,
+      className: cn(contentVariants({ placement, spacing }), className, divider && "divide-y divide-current"),
+      ...props,
+      children
+    }
+  );
+};
+var DropdownItem = ({
+  children,
+  value,
+  className,
+  variant,
+  onSelect,
+  leftIcon,
+  rightIcon,
+  ...props
+}) => {
+  const { toggleSelect, selectedValues } = useDropdown();
+  const isSelected = selectedValues.includes(value);
+  const handleClick = () => {
+    toggleSelect(value);
+    onSelect?.();
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "div",
+    {
+      tabIndex: 0,
+      onClick: handleClick,
+      onKeyDown: (e) => {
+        if (e.key === "Enter") handleClick();
+      },
+      className: cn(itemVariants({ variant }), className),
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2", children: [
+          leftIcon,
+          children
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2", children: [
+          isSelected && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_fi.FiCheck, {}),
+          rightIcon
+        ] })
+      ]
+    }
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Dropdown,
+  DropdownContent,
+  DropdownItem,
+  DropdownTrigger,
+  contentVariants,
+  itemVariants,
+  triggerVariants
+});
+//# sourceMappingURL=dropdown.cjs.map

package/dist/ui/dropdown.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ui/dropdown/index.ts","../../src/ui/dropdown/dropdown.tsx","../../src/lib/utils.ts","../../src/ui/dropdown/variants.ts"],"sourcesContent":["export {\n  Dropdown,\n  DropdownTrigger,\n  DropdownContent,\n  DropdownItem,\n} from \"./dropdown\";\nexport type {\n  DropdownProps,\n  DropdownTriggerProps,\n  DropdownContentProps,\n  DropdownItemProps,\n} from \"./types\";\nexport { triggerVariants, contentVariants, itemVariants } from \"./variants\";","\"use client\";\n\nimport {\n  createContext,\n  useContext,\n  useState,\n  useRef,\n  useEffect,\n} from \"react\";\nimport { FiCheck } from \"react-icons/fi\";\nimport { cn } from \"../../lib/utils\";\nimport type { DropdownContextType, DropdownProps, DropdownTriggerProps, DropdownContentProps, DropdownItemProps } from \"./types\";\nimport { triggerVariants, contentVariants, itemVariants } from \"./variants\";\n\n/* =========================\n   Context\n========================= */\nconst DropdownContext = createContext<DropdownContextType | null>(null);\n\nconst useDropdown = () => {\n  const ctx = useContext(DropdownContext);\n  if (!ctx) throw new Error(\"Use inside Dropdown\");\n  return ctx;\n};\n\n/* =========================\n   Root\n========================= */\nexport const Dropdown = ({\n  children,\n  defaultOpen = false,\n  open: controlledOpen,\n  onOpenChange,\n  multiSelect = false,\n}: DropdownProps) => {\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n  const [selectedValues, setSelectedValues] = useState<string[]>([]);\n\n  const open = controlledOpen ?? uncontrolledOpen;\n\n  const setOpen = (val: boolean) => {\n    if (controlledOpen !== undefined) {\n      onOpenChange?.(val);\n    } else {\n      setUncontrolledOpen(val);\n    }\n  };\n\n  const toggle = () => setOpen(!open);\n\n  const toggleSelect = (value: string) => {\n    if (!multiSelect) {\n      setSelectedValues([value]);\n      setOpen(false);\n      return;\n    }\n\n    setSelectedValues((prev) =>\n      prev.includes(value)\n        ? prev.filter((v) => v !== value)\n        : [...prev, value]\n    );\n  };\n\n  return (\n    <DropdownContext.Provider\n      value={{\n        open,\n        setOpen,\n        toggle,\n        selectedValues,\n        toggleSelect,\n        multiSelect,\n      }}\n    >\n      <div className=\"relative inline-block\">{children}</div>\n    </DropdownContext.Provider>\n  );\n};\n\n/* =========================\n   Trigger\n========================= */\nexport const DropdownTrigger = ({\n  children,\n  className,\n  variant,\n  size,\n  ...props\n}: DropdownTriggerProps) => {\n  const { toggle } = useDropdown();\n\n  return (\n    <button\n      onClick={toggle}\n      className={cn(triggerVariants({ variant, size }), className)}\n      {...props}\n    >\n      {children}\n    </button>\n  );\n};\n\n/* =========================\n   Content\n========================= */\nexport const DropdownContent = ({\n  children,\n  className,\n  placement = \"bottom\",\n  spacing = \"default\",\n  divider,\n  ...props\n}: DropdownContentProps) => {\n  const { open, setOpen } = useDropdown();\n  const ref = useRef<HTMLDivElement>(null);\n\n  // click outside\n  useEffect(() => {\n    const handleClickOutside = (e: MouseEvent) => {\n      if (ref.current && !ref.current.contains(e.target as Node)) {\n        setOpen(false);\n      }\n    };\n\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    return () =>\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n  }, [setOpen]);\n\n  if (!open) return null;\n\n  return (\n    <div\n      ref={ref}\n      className={cn(contentVariants({ placement, spacing }), className, divider && \"divide-y divide-current\")}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n};\n\n/* =========================\n   Item\n========================= */\nexport const DropdownItem = ({\n  children,\n  value,\n  className,\n  variant,\n  onSelect,\n  leftIcon,\n  rightIcon,\n  ...props\n}: DropdownItemProps) => {\n  const { toggleSelect, selectedValues } = useDropdown();\n  const isSelected = selectedValues.includes(value);\n\n  const handleClick = () => {\n    toggleSelect(value);\n    onSelect?.();\n  };\n\n  return (\n    <div\n      tabIndex={0}\n      onClick={handleClick}\n      onKeyDown={(e) => {\n        if (e.key === \"Enter\") handleClick();\n      }}\n      className={cn(itemVariants({ variant }), className)}\n      {...props}\n    >\n      <div className=\"flex items-center gap-2\">\n        {leftIcon}\n        {children}\n      </div>\n\n      <div className=\"flex items-center gap-2\">\n        {isSelected && <FiCheck />}\n        {rightIcon}\n      </div>\n    </div>\n  );\n};","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}","import { cva } from \"class-variance-authority\";\n\nexport const triggerVariants = cva(\n  \"inline-flex items-center justify-between rounded-md font-medium transition focus:outline-none cursor-pointer\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-gray-900 text-white\",\n        outline: \"border border-gray-300\",\n        ghost: \"bg-transparent\",\n        white: \"bg-white text-gray-900\",\n        black: \"bg-black text-white\",\n        sky: \"border border-sky-600 text-sky-600\",\n        rose: \"border border-rose-600 text-rose-600\",\n        purple: \"border border-purple-600 text-purple-600\",\n        pink: \"border border-pink-600 text-pink-600\",\n        orange: \"border border-orange-600 text-orange-600\",\n        yellow: \"border border-yellow-600 text-yellow-600\",\n        teal: \"border border-teal-600 text-teal-600\",\n        indigo: \"border border-indigo-600 text-indigo-600\",\n        emerald: \"border border-emerald-600 text-emerald-600\",\n        gray: \"border border-gray-600 text-gray-600\",\n        amber: \"border border-amber-600 text-amber-600\",\n        violet: \"border border-violet-600 text-violet-600\",\n        \"gradient-blue\": \"bg-gradient-to-r from-blue-600 to-purple-600 text-gradient-to-r from-blue-600 to-purple-600\",\n        \"gradient-green\": \"bg-gradient-to-r from-green-600 to-lime-600 text-gradient-to-r from-green-600 to-lime-600\",\n        \"gradient-red\": \"bg-gradient-to-r from-red-600 to-pink-600 text-gradient-to-r from-red-600 to-pink-600\",\n        \"gradient-yellow\": \"bg-gradient-to-r from-yellow-600 to-orange-600 text-gradient-to-r from-yellow-600 to-orange-600\",\n        \"gradient-purple\": \"bg-gradient-to-r from-purple-600 to-pink-600 text-gradient-to-r from-purple-600 to-pink-600\",\n        \"gradient-teal\": \"bg-gradient-to-r from-teal-600 to-cyan-600 text-gradient-to-r from-teal-600 to-cyan-600\",\n        \"gradient-indigo\": \"bg-gradient-to-r from-indigo-600 to-purple-600 text-gradient-to-r from-indigo-600 to-purple-600\",\n        \"gradient-pink\": \"bg-gradient-to-r from-pink-600 to-rose-600 text-gradient-to-r from-pink-600 to-rose-600\",\n        \"gradient-orange\": \"bg-gradient-to-r from-orange-600 to-red-600 text-gradient-to-r from-orange-600 to-red-600\",\n      },\n      size: {\n        sm: \"px-2 py-1 text-sm\",\n        md: \"px-3 py-2 text-base\",\n        lg: \"px-4 py-3 text-lg\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"md\",\n    },\n  }\n);\n\nexport const contentVariants = cva(\n  \"absolute min-w-[200px] rounded-md p-2 shadow-md z-50 border\",\n  {\n    variants: {\n      placement: {\n        top: \"bottom-full mb-2\",\n        bottom: \"top-full mt-2\",\n        left: \"right-full mr-2\",\n        right: \"left-full ml-2\",\n      },\n      spacing:{\n        none: \"space-y-0\",\n        default: \"space-y-1\",\n        sm: \"space-y-2\",\n        md: \"space-y-3\",\n        lg: \"space-y-4\",\n        xl: \"space-y-5\",\n      }\n    },\n    defaultVariants: {\n      placement: \"bottom\",\n      spacing: \"default\",\n    },\n  }\n);\n\nexport const itemVariants = cva(\n  \"flex items-center justify-between px-3 py-2 text-sm cursor-pointer rounded-md transition-colors\",\n  {\n    variants: {\n      variant: {\n        default: \"hover:bg-gray-100 hover:text-gray-900 text-gray-100\",\n        outline: \"hover:bg-gray-100 hover:text-gray-900 border border-white text-gray-100\",\n        ghost: \"hover:bg-gray-100 hover:text-gray-900 bg-transparent text-gray-100\",\n        white: \"hover:bg-gray-100 hover:text-gray-900 bg-white text-gray-900\",\n        black: \"hover:bg-gray-100 hover:text-gray-900 bg-black text-white\",\n        sky: \"hover:bg-sky-100 hover:text-sky-600 bg-sky-200 text-sky-800\",\n        rose: \"hover:bg-rose-100 hover:text-rose-600 bg-rose-200 text-rose-800\",\n        purple: \"hover:bg-purple-100 hover:text-purple-600 bg-purple-200 text-purple-800\",\n        pink: \"hover:bg-pink-100 hover:text-pink-600 bg-pink-200 text-pink-800\",\n        orange: \"hover:bg-orange-100 hover:text-orange-600 bg-orange-200 text-orange-800\",\n        yellow: \"hover:bg-yellow-100 hover:text-yellow-600 bg-yellow-200 text-yellow-800\",\n        teal: \"hover:bg-teal-100 hover:text-teal-600 bg-teal-200 text-teal-800\",\n        indigo: \"hover:bg-indigo-100 hover:text-indigo-600 bg-indigo-200 text-indigo-800\",\n        emerald: \"hover:bg-emerald-100 hover:text-emerald-600 bg-emerald-200 text-emerald-800\",\n        gray: \"hover:bg-gray-100 hover:text-gray-900 bg-gray-200 text-gray-800\",\n        amber: \"hover:bg-amber-100 hover:text-amber-600 bg-amber-200 text-amber-800\",\n        violet: \"hover:bg-violet-100 hover:text-violet-600 bg-violet-200 text-violet-800\",\n        \"gradient-blue\": \"hover:bg-gradient-to-r from-blue-600 to-purple-600 hover:text-blue-900 bg-gradient-to-r from-blue-200 to-purple-200 text-blue-800\",\n        \"gradient-green\": \"hover:bg-gradient-to-r from-green-600 to-lime-600 hover:text-green-900 bg-gradient-to-r from-green-200 to-lime-200 text-green-800\",\n        \"gradient-red\": \"hover:bg-gradient-to-r from-red-600 to-pink-600 hover:text-red-900 bg-gradient-to-r from-red-200 to-pink-200 text-red-800\",\n        \"gradient-yellow\": \"hover:bg-gradient-to-r from-yellow-600 to-orange-600 hover:text-yellow-900 bg-gradient-to-r from-yellow-200 to-orange-200 text-yellow-800\",\n        \"gradient-purple\": \"hover:bg-gradient-to-r from-purple-600 to-pink-600 hover:text-purple-900 bg-gradient-to-r from-purple-200 to-pink-200 text-purple-800\",\n        \"gradient-teal\": \"hover:bg-gradient-to-r from-teal-600 to-cyan-600 hover:text-teal-900 bg-gradient-to-r from-teal-200 to-cyan-200 text-teal-800\",\n        \"gradient-indigo\": \"hover:bg-gradient-to-r from-indigo-600 to-purple-600 hover:text-indigo-900 bg-gradient-to-r from-indigo-200 to-purple-200 text-indigo-800\",\n        \"gradient-pink\": \"hover:bg-gradient-to-r from-pink-600 to-rose-600 hover:text-pink-900 bg-gradient-to-r from-pink-200 to-rose-200 text-pink-800\",\n        \"gradient-orange\": \"hover:bg-gradient-to-r from-orange-600 to-red-600 hover:text-orange-900 bg-gradient-to-r from-orange-200 to-red-200 text-orange-800\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n);"],"mappings":"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","names":[]}

package/dist/ui/dropdown.d.cts

@@ -0,0 +1,50 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode, HTMLAttributes, ButtonHTMLAttributes } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+type Variant = "default" | "outline" | "ghost" | "white" | "black" | "sky" | "rose" | "purple" | "pink" | "orange" | "yellow" | "teal" | "indigo" | "emerald" | "gray" | "amber" | "violet" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange";
+type DropdownProps = {
+    children: ReactNode;
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    multiSelect?: boolean;
+};
+type DropdownTriggerProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    children: ReactNode;
+    variant?: Variant;
+    size?: "sm" | "md" | "lg";
+};
+type DropdownContentProps = HTMLAttributes<HTMLDivElement> & {
+    children: ReactNode;
+    placement?: "top" | "bottom" | "left" | "right";
+    spacing?: "none" | "default" | "sm" | "md" | "lg" | "xl";
+    divider?: boolean;
+};
+type DropdownItemProps = HTMLAttributes<HTMLDivElement> & {
+    children: ReactNode;
+    value: string;
+    onSelect?: () => void;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    variant?: Variant;
+};
+
+declare const Dropdown: ({ children, defaultOpen, open: controlledOpen, onOpenChange, multiSelect, }: DropdownProps) => react_jsx_runtime.JSX.Element;
+declare const DropdownTrigger: ({ children, className, variant, size, ...props }: DropdownTriggerProps) => react_jsx_runtime.JSX.Element;
+declare const DropdownContent: ({ children, className, placement, spacing, divider, ...props }: DropdownContentProps) => react_jsx_runtime.JSX.Element | null;
+declare const DropdownItem: ({ children, value, className, variant, onSelect, leftIcon, rightIcon, ...props }: DropdownItemProps) => react_jsx_runtime.JSX.Element;
+
+declare const triggerVariants: (props?: ({
+    variant?: "default" | "outline" | "ghost" | "sky" | "rose" | "purple" | "pink" | "orange" | "yellow" | "teal" | "indigo" | "emerald" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "gray" | "violet" | "amber" | "black" | "white" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const contentVariants: (props?: ({
+    placement?: "bottom" | "left" | "right" | "top" | null | undefined;
+    spacing?: "none" | "default" | "sm" | "md" | "lg" | "xl" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const itemVariants: (props?: ({
+    variant?: "default" | "outline" | "ghost" | "sky" | "rose" | "purple" | "pink" | "orange" | "yellow" | "teal" | "indigo" | "emerald" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "gray" | "violet" | "amber" | "black" | "white" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+export { Dropdown, DropdownContent, type DropdownContentProps, DropdownItem, type DropdownItemProps, type DropdownProps, DropdownTrigger, type DropdownTriggerProps, contentVariants, itemVariants, triggerVariants };

package/dist/ui/dropdown.d.ts

@@ -0,0 +1,50 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode, HTMLAttributes, ButtonHTMLAttributes } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+type Variant = "default" | "outline" | "ghost" | "white" | "black" | "sky" | "rose" | "purple" | "pink" | "orange" | "yellow" | "teal" | "indigo" | "emerald" | "gray" | "amber" | "violet" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange";
+type DropdownProps = {
+    children: ReactNode;
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    multiSelect?: boolean;
+};
+type DropdownTriggerProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    children: ReactNode;
+    variant?: Variant;
+    size?: "sm" | "md" | "lg";
+};
+type DropdownContentProps = HTMLAttributes<HTMLDivElement> & {
+    children: ReactNode;
+    placement?: "top" | "bottom" | "left" | "right";
+    spacing?: "none" | "default" | "sm" | "md" | "lg" | "xl";
+    divider?: boolean;
+};
+type DropdownItemProps = HTMLAttributes<HTMLDivElement> & {
+    children: ReactNode;
+    value: string;
+    onSelect?: () => void;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    variant?: Variant;
+};
+
+declare const Dropdown: ({ children, defaultOpen, open: controlledOpen, onOpenChange, multiSelect, }: DropdownProps) => react_jsx_runtime.JSX.Element;
+declare const DropdownTrigger: ({ children, className, variant, size, ...props }: DropdownTriggerProps) => react_jsx_runtime.JSX.Element;
+declare const DropdownContent: ({ children, className, placement, spacing, divider, ...props }: DropdownContentProps) => react_jsx_runtime.JSX.Element | null;
+declare const DropdownItem: ({ children, value, className, variant, onSelect, leftIcon, rightIcon, ...props }: DropdownItemProps) => react_jsx_runtime.JSX.Element;
+
+declare const triggerVariants: (props?: ({
+    variant?: "default" | "outline" | "ghost" | "sky" | "rose" | "purple" | "pink" | "orange" | "yellow" | "teal" | "indigo" | "emerald" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "gray" | "violet" | "amber" | "black" | "white" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const contentVariants: (props?: ({
+    placement?: "bottom" | "left" | "right" | "top" | null | undefined;
+    spacing?: "none" | "default" | "sm" | "md" | "lg" | "xl" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const itemVariants: (props?: ({
+    variant?: "default" | "outline" | "ghost" | "sky" | "rose" | "purple" | "pink" | "orange" | "yellow" | "teal" | "indigo" | "emerald" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | "gray" | "violet" | "amber" | "black" | "white" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+export { Dropdown, DropdownContent, type DropdownContentProps, DropdownItem, type DropdownItemProps, type DropdownProps, DropdownTrigger, type DropdownTriggerProps, contentVariants, itemVariants, triggerVariants };