@kopexa/theme 1.7.7 → 2.0.0

package/dist/{chunk-EXBKQDH5.mjs → chunk-3PCDCW7G.mjs}

@@ -3,7 +3,7 @@ import { tv } from "tailwind-variants";
 var dropdownMenu = tv({
   slots: {
     root: "",
-    content: "min-w-56 bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
+    content: "min-w-[8rem] bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
     item: "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
     checkboxItem: "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
     iconWrapper: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center",

package/dist/{chunk-UEMJVVVF.mjs → chunk-5DOB3IBE.mjs}

@@ -18,11 +18,24 @@ var popoverContentClasses = [
   "bg-popover text-popover-foreground z-50",
   "rounded-md border p-4 shadow-md outline-hidden"
 ];
+var inputClasses = {
+  radius: {
+    sm: "rounded-sm",
+    md: "rounded-md",
+    lg: "rounded-lg"
+  },
+  height: {
+    sm: "h-7 min-h-7",
+    md: "h-8.5 min-h-8.5",
+    lg: "h-10 min-h-10"
+  }
+};
 
 export {
   focusVisibleClasses,
   focusWithinClasses,
   dataFocusVisibleClasses,
   translateCenterClasses,
-  popoverContentClasses
+  popoverContentClasses,
+  inputClasses
 };

package/dist/{chunk-SHHD2WUZ.mjs → chunk-7VZZASRG.mjs}

@@ -1,6 +1,6 @@
 import {
   chip
-} from "./chunk-JHKTRIIA.mjs";
+} from "./chunk-RQYYDG26.mjs";
 
 // src/components/standard-chip.ts
 import { tv } from "tailwind-variants";

package/dist/chunk-BETLBSSF.mjs

@@ -0,0 +1,23 @@
+// src/components/kbd.ts
+import { tv } from "tailwind-variants";
+var kbd = tv({
+  base: "inline-flex items-center justify-center font-mono rounded-md",
+  variants: {
+    variant: {
+      default: "bg-accent border border-border text-accent-foreground",
+      outline: "text-accent-foreground border border-input"
+    },
+    size: {
+      md: "h-7 min-w-7 px-1.5 text-xs [&_svg]:size-3.5",
+      sm: "h-6 min-w-6 px-1 text-[0.75rem] leading-[0.75rem] [&_svg]:size-3",
+      xs: "h-5 min-w-5 px-1 text-[0.6875rem] leading-[0.75rem] [&_svg]:size-3"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+
+export {
+  kbd
+};

package/dist/chunk-BWB7MWRC.mjs

@@ -0,0 +1,22 @@
+// src/components/toolbar.ts
+import { tv } from "tailwind-variants";
+var toolbar = tv({
+  slots: {
+    root: "flex items-center gap-2.5 rounded-md p-1",
+    button: "shrink-0",
+    separator: "bg-border h-6 w-px shrink-0",
+    group: "flex items-center gap-1"
+  },
+  variants: {
+    color: {
+      default: "bg-popover outline-border shadow-xs outline"
+    }
+  },
+  defaultVariants: {
+    color: "default"
+  }
+});
+
+export {
+  toolbar
+};

package/dist/chunk-CPERWXKN.mjs

@@ -0,0 +1,21 @@
+// src/components/color-highlight-button.ts
+import { tv } from "tailwind-variants";
+var colorHighlightButton = tv({
+  slots: {
+    button: [
+      "relative min-w-none",
+      "hover:bg-",
+      "size-5 bg-[var(--highlight-color)]"
+    ],
+    mark: [
+      "absolute size- left-0 top-0",
+      "border border-[var(--highlight-color)]",
+      "rounded-[inherit] box-border brightness-95 mix-blend-multiply",
+      "data-[active-state=on]:brightness-140"
+    ]
+  }
+});
+
+export {
+  colorHighlightButton
+};

package/dist/chunk-DI54XTS5.mjs

@@ -0,0 +1,56 @@
+import {
+  popoverContentClasses
+} from "./chunk-5DOB3IBE.mjs";
+
+// src/components/popover.ts
+import { tv } from "tailwind-variants";
+var popover = tv({
+  slots: {
+    content: [
+      "data-[open]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[open]:fade-in-0 data-[closed]:zoom-out-95",
+      "data-[open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 ",
+      "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
+    ],
+    arrow: [
+      "data-[side=bottom]:top-[-8px] data-[side=left]:right-[-13px]",
+      "data-[side=left]:rotate-90 data-[side=right]:left-[-13px]",
+      "data-[side=right]:-rotate-90 data-[side=top]:bottom-[-8px] data-[side=top]:rotate-180"
+    ],
+    arrowTop: "fill-popover",
+    arrowBottom: "fill-border"
+  },
+  variants: {
+    variant: {
+      default: {
+        content: [...popoverContentClasses]
+      },
+      ghost: {
+        content: "w-auto !p-0 bg-transparent"
+      }
+    },
+    spacing: {
+      default: {
+        content: "p-4"
+      },
+      dense: {
+        content: "p-2"
+      }
+    },
+    width: {
+      default: {
+        content: "w-72"
+      },
+      auto: {
+        content: "w-auto"
+      }
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    spacing: "default"
+  }
+});
+
+export {
+  popover
+};

package/dist/chunk-GRPMKEI2.mjs

@@ -0,0 +1,34 @@
+// src/components/editor-basic.ts
+import { tv } from "tailwind-variants";
+var editorBasic = tv({
+  slots: {
+    wrapper: [
+      "overflow-y-auto",
+      "h-[calc(100%-var(--spacing-editor-toolbar))]"
+    ],
+    content: [
+      "w-full",
+      "[&_.tiptap.ProseMirror]:py-4",
+      "[&_.tiptap.ProseMirror]:px-6"
+    ],
+    toolbar: "flex items-center gap-0.5",
+    toolbarGroup: "flex items-center gap-0.5"
+  },
+  variants: {
+    variant: {
+      // rounded toolbar, muted background
+      default: {
+        wrapper: ["border rounded-md"],
+        toolbar: "bg-muted rounded-md p-1 mb-2",
+        content: ""
+      }
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+
+export {
+  editorBasic
+};

package/dist/{chunk-ZL6FAOXE.mjs → chunk-HHOMDBMZ.mjs}

@@ -1,6 +1,6 @@
 import {
   avatar
-} from "./chunk-JQ74U2S3.mjs";
+} from "./chunk-YH6TDPK7.mjs";
 
 // src/components/skeleton-avatar.ts
 import { tv } from "tailwind-variants";

package/dist/chunk-HWEYNK3O.mjs

@@ -0,0 +1,25 @@
+// src/components/input-group.ts
+import { tv } from "tailwind-variants";
+var inputGroup = tv({
+  base: [
+    "flex items-stretch",
+    "[&_[data-slot=input]]:grow",
+    "[&_[data-slot=input-addon]:has(+[data-slot=input])]:rounded-e-none [&_[data-slot=input-addon]:has(+[data-slot=input])]:border-e-0",
+    "[&_[data-slot=input-addon]:has(+[data-slot=datefield])]:rounded-e-none [&_[data-slot=input-addon]:has(+[data-slot=datefield])]:border-e-0",
+    "[&_[data-slot=input]+[data-slot=input-addon]]:rounded-s-none [&_[data-slot=input]+[data-slot=input-addon]]:border-s-0",
+    "[&_[data-slot=input-addon]:has(+[data-slot=button])]:rounded-e-none",
+    "[&_[data-slot=input]+[data-slot=button]]:rounded-s-none",
+    "[&_[data-slot=button]+[data-slot=input]]:rounded-s-none",
+    "[&_[data-slot=input-addon]+[data-slot=input]]:rounded-s-none",
+    "[&_[data-slot=input-addon]+[data-slot=datefield]]:[&_[data-slot=input]]:rounded-s-none",
+    "[&_[data-slot=datefield]:has(+[data-slot=input-addon])]:[&_[data-slot=input]]:rounded-e-none",
+    "[&_[data-slot=input]:has(+[data-slot=button])]:rounded-e-none",
+    "[&_[data-slot=input]:has(+[data-slot=input-addon])]:rounded-e-none",
+    "[&_[data-slot=datefield]]:grow",
+    "[&_[data-slot=datefield]+[data-slot=input-addon]]:rounded-s-none [&_[data-slot=datefield]+[data-slot=input-addon]]:border-s-0"
+  ]
+});
+
+export {
+  inputGroup
+};

package/dist/{chunk-U32YEQZ5.mjs → chunk-IHITEH7V.mjs}

@@ -1,9 +1,9 @@
-import {
-  focusVisibleClasses
-} from "./chunk-UEMJVVVF.mjs";
 import {
   colorVariants
 } from "./chunk-WSEO3MLK.mjs";
+import {
+  focusVisibleClasses
+} from "./chunk-5DOB3IBE.mjs";
 
 // src/components/button.ts
 import { tv } from "tailwind-variants";
@@ -16,6 +16,7 @@ var button = tv({
     ...focusVisibleClasses,
     // shadcn below
     "disabled:pointer-events-none disabled:opacity-50",
+    "data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
     "shrink-0 [&_svg]:shrink-0",
     "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
     "text-sm font-medium"
@@ -23,14 +24,14 @@ var button = tv({
   variants: {
     variant: {
       solid: "shadow-xs",
-      ghost: "data-[active-state=on]:bg-accent/70",
+      ghost: "data-[active-state=on]:bg-primary/10",
       outline: "border-1 bg-transparent",
       link: ""
     },
     size: {
-      sm: "px-3 min-w-16 h-8 text-xs gap-2 rounded-sm has-[>svg]:px-2.5 [&_svg]:size-3",
-      md: "px-4 min-w-20 h-10 text-sm gap-2 rounded-md has-[>svg]:px-3 [&_svg]:size-4",
-      lg: "px-6 min-w-24 h-12 text-base gap-3 rounded-lg has-[>svg]:px-4 [&_svg]:size-4"
+      sm: "px-3 min-w-16 h-7 text-xs gap-2 rounded-sm has-[>svg]:px-2.5 [&_svg]:size-3",
+      md: "px-4 min-w-20 h-8.5 text-sm gap-2 rounded-sm has-[>svg]:px-3 [&_svg]:size-4",
+      lg: "px-6 min-w-24 h-10 text-base gap-3 rounded-lg has-[>svg]:px-4 [&_svg]:size-4"
     },
     color: {
       primary: "",
@@ -47,10 +48,15 @@ var button = tv({
     isIconOnly: {
       true: "px-0 !gap-0",
       false: "[&>svg]:max-w-[theme(spacing.8)]"
+    },
+    spacing: {
+      default: "",
+      between: "justify-between",
+      start: "justify-start"
     }
   },
   defaultVariants: {
-    size: "sm",
+    size: "md",
     variant: "solid",
     color: "primary",
     fullWidth: false,
@@ -117,7 +123,7 @@ var button = tv({
     {
       variant: "ghost",
       color: "default",
-      class: colorVariants.ghost.default
+      class: [colorVariants.ghost.default, "hover:bg-accent/50"]
     },
     // outline color
     {

package/dist/chunk-IHW4FWFB.mjs

@@ -0,0 +1,71 @@
+import {
+  focusVisibleClasses,
+  inputClasses
+} from "./chunk-5DOB3IBE.mjs";
+
+// src/components/input.ts
+import { tv } from "tailwind-variants";
+var passwordInput = tv({
+  slots: {
+    button: "focus:outline-hidden",
+    icon: "pointer-events-none text-muted-foreground"
+  }
+});
+var input = tv({
+  base: [
+    "w-full inline-flex bg-background text-foreground",
+    "border-input border",
+    "shadow-xs placeholder:text-muted-foreground",
+    ...focusVisibleClasses,
+    "disabled:cursor-not-allowed disabled:opacity-60",
+    "[&[readonly]]:bg-muted/80 [&[readonly]]:cursor-not-allowed",
+    "w-full font-normal outline-hidden focus-visible:outline-hidden",
+    "data-[has-start-content=true]:ps-1.5",
+    "data-[has-end-content=true]:pe-1.5",
+    "file:cursor-pointer file:bg-transparent file:border-0",
+    "autofill:bg-transparent bg-clip-text",
+    // legacy
+    "selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground",
+    "flex",
+    // file
+    "file:text-foreground file:inline-flex file:text-sm file:font-medium",
+    "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+  ],
+  variants: {
+    size: {
+      sm: [
+        inputClasses.radius.sm,
+        inputClasses.height.sm,
+        "px-2.5  [&_svg]:size-4",
+        "text-sm file:h-6"
+      ],
+      md: [
+        inputClasses.radius.md,
+        inputClasses.height.md,
+        "px-3 [&_svg]:size-4",
+        "text-base md:text-sm file:h-8"
+      ],
+      lg: [
+        inputClasses.radius.lg,
+        inputClasses.height.md,
+        "px-4 [&_svg]:size-4",
+        "text-base file:h-10"
+      ]
+    },
+    radius: {
+      none: "rounded-none",
+      sm: "rounded-sm",
+      md: "rounded-md",
+      lg: "rounded-lg",
+      full: "rounded-full"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+
+export {
+  passwordInput,
+  input
+};

package/dist/{chunk-TJDRYBGW.mjs → chunk-JXQPOORM.mjs}

@@ -1,17 +1,22 @@
 import {
   dialog
-} from "./chunk-MWG2OZMD.mjs";
+} from "./chunk-LAJQAXSV.mjs";
 
 // src/components/drawer.ts
 import { tv } from "tailwind-variants";
 var drawer = tv({
   slots: {
-    overlay: dialog.slots.overlay,
+    overlay: [
+      dialog.slots.overlay,
+      "data-[open]:animate-in data-[closed]:animate-out",
+      "data-[closed]:fade-out-0 data-[closed]:animation-duration-[300ms] data-[open]:fade-in-0"
+    ],
     content: [
-      "bg-background fixed z-50 flex flex-col w-full gap-4 shadow-lg max-h-dvh",
+      "bg-background fixed flex flex-col w-full gap-4 shadow-lg max-h-dvh",
       "outline-hidden",
-      "data-[state=open]:animate-in data-[state=closed]:animate-out",
-      "transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500"
+      "transition ease-in-out",
+      "data-[open]:animate-in data-[closed]:animate-out",
+      "data-[closed]:duration-300 data-[open]:duration-500"
     ],
     close: dialog.slots.close,
     closeTrigger: dialog.slots.closeTrigger,
@@ -60,14 +65,15 @@ var drawer = tv({
     placement: {
       top: {
         content: [
-          "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+          "data-[closed]:slide-out-to-top data-[open]:slide-in-from-top",
+          // radix
           "inset-x-2 top-2 w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)] mx-auto h-auto border-b",
           "max-w-[calc(100svw-1rem)]"
         ]
       },
       bottom: {
         content: [
-          "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
+          "data-[closed]:slide-out-to-bottom data-[open]:slide-in-from-bottom",
           "inset-x-2 bottom-2 h-auto border-t",
           "max-w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)]"
         ]
@@ -75,13 +81,13 @@ var drawer = tv({
       left: {
         content: [
           "inset-y-2 ms-2 left-0 border-r h-[calc(100dvh_-_1rem)]",
-          "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left"
+          "data-[closed]:slide-out-to-left data-[open]:slide-in-from-left"
         ]
       },
       right: {
         content: [
           "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l",
-          "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right"
+          "data-[closed]:slide-out-to-right data-[open]:slide-in-from-right"
         ]
       }
     },

package/dist/{chunk-MWG2OZMD.mjs → chunk-LAJQAXSV.mjs}

@@ -3,19 +3,17 @@ import { tv } from "tailwind-variants";
 var dialog = tv({
   slots: {
     overlay: [
-      "fixed inset-0 z-50 bg-black/25",
-      "data-[state=open]:animate-in data-[state=closed]:animate-out",
-      "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
+      "fixed inset-0 bg-black/25 [backdrop-filter:blur(4px)]",
+      "data-[ending-style]:opacity-0 data-[starting-style]:opacity-0"
     ],
     content: [
       "flex flex-col",
-      "bg-background fixed top-[50%] left-[50%] z-50",
+      "bg-background fixed top-[50%] left-[50%]",
       "w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%]",
-      "border shadow-lg",
-      "data-[state=open]:animate-in data-[state=closed]:animate-out",
-      "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
-      "duration-200 sm:max-w-lg"
+      "border shadow-lg transition-all",
+      "data-[ending-style]:scale-90 data-[ending-style]:opacity-0",
+      "data-[starting-style]:scale-90 data-[starting-style]:opacity-0",
+      "duration-150 sm:max-w-lg"
     ],
     close: [
       "ring-offset-background focus:ring-ring",

package/dist/{chunk-VCLXE57S.mjs → chunk-LM7MKBHT.mjs}

@@ -1,7 +1,13 @@
 // src/components/separator.ts
 import { tv } from "tailwind-variants";
 var separator = tv({
-  base: "bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
+  base: [
+    "bg-border shrink-0",
+    "data-[orientation=horizontal]:h-px",
+    "data-[orientation=horizontal]:w-full",
+    "data-[orientation=vertical]:h-full",
+    "data-[orientation=vertical]:w-px"
+  ],
   variants: {
     orientation: {
       vertical: "",

package/dist/chunk-LMCM4CW2.mjs

@@ -0,0 +1,22 @@
+// src/components/label.ts
+import { tv } from "tailwind-variants";
+var label = tv({
+  base: [
+    "text-sm leading-none",
+    "text-foreground",
+    "peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
+  ],
+  variants: {
+    variant: {
+      primary: "font-medium",
+      secondary: "font-normal"
+    }
+  },
+  defaultVariants: {
+    variant: "primary"
+  }
+});
+
+export {
+  label
+};

package/dist/chunk-M3GQ563Q.mjs

@@ -0,0 +1,33 @@
+import {
+  focusVisibleClasses,
+  inputClasses
+} from "./chunk-5DOB3IBE.mjs";
+
+// src/components/textarea.ts
+import { tv } from "tailwind-variants";
+var textarea = tv({
+  base: [
+    "w-full border border-input bg-background text-foreground shadow-xs shadow-black/5 transition-[color,box-shadow]",
+    "text-foreground placeholder:text-muted-foreground/80",
+    "disabled:cursor-not-allowed disabled:opacity-50 [&[readonly]]:opacity-70 aria-invalid:border-destructive",
+    ...focusVisibleClasses,
+    "aria-invalid:border-destructive/60 aria-invalid:ring-destructive/10 dark:aria-invalid:border-destructive dark:aria-invalid:ring-destructive/20"
+  ],
+  variants: {
+    size: {
+      sm: [inputClasses.radius.sm, "px-2.5 py-2.5 text-xs"],
+      md: [
+        inputClasses.radius.md,
+        "px-3 py-3 text-[0.8125rem] leading-(--text-sm--line-height)"
+      ],
+      lg: [inputClasses.radius.lg, "px-4 py-4 text-sm"]
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+
+export {
+  textarea
+};

package/dist/chunk-NFOF75HQ.mjs

@@ -0,0 +1,106 @@
+import {
+  focusVisibleClasses,
+  inputClasses
+} from "./chunk-5DOB3IBE.mjs";
+
+// src/components/select.ts
+import { tv } from "tailwind-variants";
+var select = tv({
+  slots: {
+    trigger: [
+      "border-input border w-full shadow-xs",
+      ...focusVisibleClasses,
+      "aria-expanded:outline-2 aria-expanded:outline-ring aria-expanded:outline-offset-2",
+      "group relative flex items-center justify-between gap-2 whitespace-nowrap select-none",
+      "transition-[color,box-shadow,border-color]",
+      "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
+      "aria-invalid:border-destructive",
+      "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      "*:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex",
+      "*:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2",
+      "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='text-'])]:text-muted-foreground"
+    ],
+    triggerIcon: "opacity-60 transition-transform duration-200",
+    placeholder: "text-muted-foreground",
+    clear: [
+      "cursor-pointer absolute top-1/2 -translate-y-1/2 end-2",
+      "rounded-sm opacity-60 hover:opacity-100 transition-opacity",
+      "focus:outline-none focus:ring-0 focus:ring-offset-0",
+      "disabled:pointer-events-none data-[disabled]:pointer-events-none"
+    ],
+    content: [
+      "relative max-h-(--available-height) min-w-(--anchor-width) overflow-x-hidden overflow-y-auto",
+      "bg-popover text-popover-foreground",
+      "rounded-md border p-1 shadow-md",
+      "origin-[var(--transform-origin)]",
+      // radix styles
+      "data-[open]:animate-in data-[closed]:animate-out",
+      "data-[closed]:fade-out-0 data-[open]:fade-in-0",
+      "data-[closed]:zoom-out-95 data-[open]:zoom-in-95",
+      "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
+      "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "data-[position=item-aligned]:[&_*[data-slot=select-item]]:min-w-[var(--anchor-width)]",
+      "data-[side=bottom]:mt-2 data-[side=top]:mb-2"
+    ],
+    item: [
+      "relative flex w-full items-center cursor-default select-none",
+      "rounded-sm py-1.5 text-sm outline-hidden",
+      "data-highlighted:bg-accent data-highlighted:text-accent-foreground",
+      "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
+      "*:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+      "pe7 ps-2 data-[indicator-position=left]:ps-7 data-[indicator-position=left]:pe-2"
+    ],
+    indicatorContainer: [
+      "absolute flex h-3.5 w-3.5 items-center justify-center",
+      "data-[indicator-position=left]:start-2 data-[indicator-position=right]:end-2"
+    ],
+    indicatorIcon: ["size-4 text-primary"],
+    label: [
+      "text-muted-foreground py-1.5 text-xs font-medium",
+      "pe-7 ps-2 data-[indicator-position=left]:ps-7 data-[indicator-position=left]:pe-2"
+    ],
+    separator: ["bg-border pointer-events-none -mx-1 my-1 h-px"]
+  },
+  variants: {
+    size: {
+      sm: {
+        trigger: [
+          inputClasses.radius.sm,
+          inputClasses.height.sm,
+          // TODO
+          "px-2.5 text-xs gap-1",
+          "[&_[data-slot=select-icon]]:size-3.5 [&_[data-slot=select-icon]]:-me-0.75",
+          "[&_[data-slot=select-clear]>svg]:size-3 [&_[data-slot=select-clear]]:end-6"
+        ]
+      },
+      md: {
+        trigger: [
+          inputClasses.radius.md,
+          inputClasses.height.md,
+          // TODO
+          "px-3 text-[0.8125rem] leading-(--text-sm--line-height) gap-1 ",
+          "[&_[data-slot=select-icon]]:size-4 [&_[data-slot=select-icon]]:-me-1",
+          "[&_[data-slot=select-clear]>svg]:size-3.5 [&_[data-slot=select-clear]]:end-7"
+        ]
+      },
+      lg: {
+        trigger: [
+          inputClasses.radius.lg,
+          inputClasses.height.lg,
+          // TODO
+          "h-10 px-4 text-sm gap-1.5",
+          "	[&_[data-slot=select-icon]]:size-4 [&_[data-slot=select-icon]]:-me-1.25",
+          "	[&_[data-slot=select-clear]>svg]:size-3.5 [&_[data-slot=select-clear]]:end-8"
+        ]
+      }
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+
+export {
+  select
+};

package/dist/{chunk-JHKTRIIA.mjs → chunk-RQYYDG26.mjs}

@@ -15,7 +15,8 @@ var chip = tv({
       "justify-between",
       "box-border",
       "whitespace-nowrap",
-      "isolate"
+      "isolate",
+      "data-[active=true]:ring-2"
     ],
     content: "flex-1 text-inherit font-normal",
     indicator: "relative flex size-2 ml-1",
@@ -36,7 +37,8 @@ var chip = tv({
       faded: {
         root: "border-2"
       },
-      flat: {}
+      flat: {},
+      ghost: {}
     },
     color: {
       default: {