@kopexa/theme 1.7.7 → 2.0.0

package/dist/components/index.js

@@ -22,6 +22,7 @@ var components_exports = {};
 __export(components_exports, {
   accordion: () => accordion,
   alertDialog: () => alertDialog,
+  autocomplete: () => autocomplete,
   avatar: () => avatar,
   avatarGroup: () => avatarGroup,
   blankstate: () => blankstate,
@@ -32,17 +33,24 @@ __export(components_exports, {
   checkbox: () => checkbox,
   chip: () => chip,
   code: () => code,
+  colorHighlightButton: () => colorHighlightButton,
   command: () => command,
   dataTable: () => dataTable,
   datagrid: () => datagrid,
   dialog: () => dialog,
   drawer: () => drawer,
   dropdownMenu: () => dropdownMenu,
+  editorBasic: () => editorBasic,
+  editorSpinner: () => editorSpinner,
   frameworkRow: () => frameworkRow,
   heading: () => heading,
   hoverCard: () => hoverCard,
   input: () => input,
+  inputGroup: () => inputGroup,
+  inputWrapper: () => inputWrapper,
   integrationCard: () => integrationCard,
+  kbd: () => kbd,
+  label: () => label,
   pageHeader: () => pageHeader,
   pageLayout: () => pageLayout,
   passwordInput: () => passwordInput,
@@ -52,19 +60,24 @@ __export(components_exports, {
   resizable: () => resizable,
   riskBadge: () => riskBadge,
   riskIndicator: () => riskIndicator,
+  scrollArea: () => scrollArea,
   sectionRow: () => sectionRow,
+  select: () => select,
   separator: () => separator,
   sidebar: () => sidebar,
   sidebarMenuAction: () => sidebarMenuAction,
   sidebarMenuButton: () => sidebarMenuButton,
   skeleton: () => skeleton,
   skeletonAvatar: () => skeletonAvatar,
+  slashDropdownMenu: () => slashDropdownMenu,
   spinner: () => spinner,
   splitPageLayout: () => splitPageLayout,
   standardChip: () => standardChip,
   tabNav: () => tabNav,
   table: () => table,
   tabs: () => tabs,
+  textarea: () => textarea,
+  toolbar: () => toolbar,
   tooltip: () => tooltip
 });
 module.exports = __toCommonJS(components_exports);
@@ -140,8 +153,17 @@ var accordion = (0, import_tailwind_variants.tv)({
 var import_tailwind_variants2 = require("tailwind-variants");
 var alertDialog = (0, import_tailwind_variants2.tv)({
   slots: {
-    overlay: "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 z-50 bg-black/50",
-    content: "bg-background 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 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",
+    overlay: [
+      "transition-all duration-150 data-[ending-style]:opacity-0 data-[starting-style]:opacity-0",
+      "fixed inset-0 bg-black/50 [backdrop-filter:blur(4px)]"
+    ],
+    content: [
+      "bg-background left-[50%] top-[50%] fixed",
+      "grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%]",
+      "transition-all duration-150",
+      "data-[ending-style]:scale-90 data-[ending-style]:opacity-0 data-[starting-style]:scale-90 data-[starting-style]:opacity-0",
+      "gap-4 rounded-lg border p-6 shadow-lg sm:max-w-lg"
+    ],
     header: "flex flex-col gap-2 text-center sm:text-left",
     footer: "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
     title: "text-lg font-semibold",
@@ -150,17 +172,14 @@ var alertDialog = (0, import_tailwind_variants2.tv)({
   }
 });
 
-// src/components/avatar.ts
-var import_tailwind_variants3 = require("tailwind-variants");
+// src/components/autocomplete.ts
+var import_tailwind_variants4 = require("tailwind-variants");
 
 // src/utils/classes.ts
 var focusVisibleClasses = [
   "focus-visible:outline-2 focus-visible:outline-ring focus-visible:outline-offset-2"
   //"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
 ];
-var focusWithinClasses = [
-  "focus-within:outline-2 focus-within:outline-ring focus-within:outline-offset-2"
-];
 var translateCenterClasses = [
   "absolute",
   "top-1/2",
@@ -172,6 +191,142 @@ 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"
+  }
+};
+
+// src/components/input.ts
+var import_tailwind_variants3 = require("tailwind-variants");
+var passwordInput = (0, import_tailwind_variants3.tv)({
+  slots: {
+    button: "focus:outline-hidden",
+    icon: "pointer-events-none text-muted-foreground"
+  }
+});
+var input = (0, import_tailwind_variants3.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"
+  }
+});
+
+// src/components/autocomplete.ts
+var autocomplete = (0, import_tailwind_variants4.tv)({
+  slots: {
+    input: input.base,
+    content: "",
+    positioner: "outline-none",
+    popup: [
+      ...popoverContentClasses,
+      "p-0 py-1 w-[var(--anchor-width)] max-h-[min(var(--available-height),23rem)] max-w-[var(--available-width)]",
+      "overflow-y-auto scroll-pt-2 scroll-pb-2 overscroll-contain bg-[canvas]",
+      "shadow-black/5",
+      "origin-[var(--transform-origin)] transition-[transform,scale,opacity] data-[ending-style]:scale-90",
+      "data-[ending-style]:opacity-0 data-[starting-style]:scale-90 data-[starting-style]:opacity-0"
+    ],
+    empty: ["px-2 py-1.5 text-sm text-muted-foreground empty:m-0 empty:p-0"],
+    list: "space-y-0.5",
+    item: [
+      "text-foreground relative flex cursor-default select-none items-center gap-2 rounded-md px-4 py-2 text-sm outline-hidden transition-colors",
+      "data-disabled:pointer-events-none data-disabled:opacity-50",
+      "[&_svg]:pointer-events-none [&_svg:not([role=img]):not([class*=text-])]:opacity-60 [&_svg:not([class*=size-])]:size-4 [&_svg]:shrink-0",
+      "data-[highlighted]:relative data-[highlighted]:z-0 data-[highlighted]:text-foreground data-[highlighted]:before:absolute",
+      "data-[highlighted]:before:inset-x-1 data-[highlighted]:before:inset-y-0 data-[highlighted]:before:z-[-1] data-[highlighted]:before:rounded-sm data-[highlighted]:before:bg-accent"
+    ],
+    clear: [
+      "absolute cursor-pointer top-1/2 -translate-y-1/2",
+      "rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100",
+      "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
+      "data-[disabled]:pointer-events-none",
+      "[&_svg]:size-3.5"
+    ],
+    control: "relative"
+  },
+  variants: {
+    size: {
+      sm: {
+        input: [
+          input.variants.size.sm,
+          "[&~[data-slot=autocomplete-clear]]:end-1.75"
+        ]
+      },
+      md: {
+        input: [
+          input.variants.size.md,
+          "[&~[data-slot=autocomplete-clear]]:end-2"
+        ]
+      },
+      lg: {
+        input: [
+          input.variants.size.lg,
+          "[&~[data-slot=autocomplete-clear]]:end-2.5"
+        ]
+      }
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+
+// src/components/avatar.ts
+var import_tailwind_variants5 = require("tailwind-variants");
 
 // src/utils/variants.ts
 var solid = {
@@ -225,7 +380,7 @@ var colorVariants = {
 };
 
 // src/components/avatar.ts
-var avatar = (0, import_tailwind_variants3.tv)({
+var avatar = (0, import_tailwind_variants5.tv)({
   slots: {
     root: [
       "flex w-min h-min",
@@ -404,8 +559,8 @@ var avatar = (0, import_tailwind_variants3.tv)({
 });
 
 // src/components/avatar-group.ts
-var import_tailwind_variants4 = require("tailwind-variants");
-var avatarGroup = (0, import_tailwind_variants4.tv)({
+var import_tailwind_variants6 = require("tailwind-variants");
+var avatarGroup = (0, import_tailwind_variants6.tv)({
   slots: {
     base: "flex items-center justify-center h-auto w-max",
     count: "hover:-translate-x-0"
@@ -418,8 +573,8 @@ var avatarGroup = (0, import_tailwind_variants4.tv)({
 });
 
 // src/components/blankstate.ts
-var import_tailwind_variants5 = require("tailwind-variants");
-var blankstate = (0, import_tailwind_variants5.tv)({
+var import_tailwind_variants7 = require("tailwind-variants");
+var blankstate = (0, import_tailwind_variants7.tv)({
   slots: {
     root: "@container/blankstate",
     container: "grid  justify-items-center",
@@ -470,8 +625,8 @@ var blankstate = (0, import_tailwind_variants5.tv)({
 });
 
 // src/components/button.ts
-var import_tailwind_variants6 = require("tailwind-variants");
-var button = (0, import_tailwind_variants6.tv)({
+var import_tailwind_variants8 = require("tailwind-variants");
+var button = (0, import_tailwind_variants8.tv)({
   base: [
     "group relative inline-flex items-center justify-center select-none",
     "box-border appearance-none",
@@ -480,6 +635,7 @@ var button = (0, import_tailwind_variants6.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"
@@ -487,14 +643,14 @@ var button = (0, import_tailwind_variants6.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: "",
@@ -511,10 +667,15 @@ var button = (0, import_tailwind_variants6.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,
@@ -581,7 +742,7 @@ var button = (0, import_tailwind_variants6.tv)({
     {
       variant: "ghost",
       color: "default",
-      class: colorVariants.ghost.default
+      class: [colorVariants.ghost.default, "hover:bg-accent/50"]
     },
     // outline color
     {
@@ -634,8 +795,8 @@ var button = (0, import_tailwind_variants6.tv)({
 });
 
 // src/components/calendar.ts
-var import_tailwind_variants7 = require("tailwind-variants");
-var calendar = (0, import_tailwind_variants7.tv)({
+var import_tailwind_variants9 = require("tailwind-variants");
+var calendar = (0, import_tailwind_variants9.tv)({
   slots: {
     base: [
       "bg-background group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent",
@@ -687,8 +848,8 @@ var calendar = (0, import_tailwind_variants7.tv)({
 });
 
 // src/components/callout.ts
-var import_tailwind_variants8 = require("tailwind-variants");
-var callout = (0, import_tailwind_variants8.tv)({
+var import_tailwind_variants10 = require("tailwind-variants");
+var callout = (0, import_tailwind_variants10.tv)({
   slots: {
     root: ["flex items-start gap-3 w-full", "border", "relative"],
     iconContainer: "flex-shrink-0 mt-0.5",
@@ -756,8 +917,8 @@ var callout = (0, import_tailwind_variants8.tv)({
 });
 
 // src/components/card.ts
-var import_tailwind_variants9 = require("tailwind-variants");
-var card = (0, import_tailwind_variants9.tv)({
+var import_tailwind_variants11 = require("tailwind-variants");
+var card = (0, import_tailwind_variants11.tv)({
   slots: {
     root: [
       "flex flex-col relative h-auto outline-hidden box-border",
@@ -949,8 +1110,8 @@ var card = (0, import_tailwind_variants9.tv)({
 });
 
 // src/components/checkbox.ts
-var import_tailwind_variants10 = require("tailwind-variants");
-var checkbox = (0, import_tailwind_variants10.tv)({
+var import_tailwind_variants12 = require("tailwind-variants");
+var checkbox = (0, import_tailwind_variants12.tv)({
   slots: {
     base: [
       "group",
@@ -991,8 +1152,8 @@ var checkbox = (0, import_tailwind_variants10.tv)({
 });
 
 // src/components/chip.ts
-var import_tailwind_variants11 = require("tailwind-variants");
-var chip = (0, import_tailwind_variants11.tv)({
+var import_tailwind_variants13 = require("tailwind-variants");
+var chip = (0, import_tailwind_variants13.tv)({
   slots: {
     root: [
       "relative",
@@ -1003,7 +1164,8 @@ var chip = (0, import_tailwind_variants11.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",
@@ -1024,7 +1186,8 @@ var chip = (0, import_tailwind_variants11.tv)({
       faded: {
         root: "border-2"
       },
-      flat: {}
+      flat: {},
+      ghost: {}
     },
     color: {
       default: {
@@ -1308,8 +1471,8 @@ var chip = (0, import_tailwind_variants11.tv)({
 });
 
 // src/components/code.ts
-var import_tailwind_variants12 = require("tailwind-variants");
-var code = (0, import_tailwind_variants12.tv)({
+var import_tailwind_variants14 = require("tailwind-variants");
+var code = (0, import_tailwind_variants14.tv)({
   base: [
     "px-2",
     "py-1",
@@ -1348,9 +1511,27 @@ var code = (0, import_tailwind_variants12.tv)({
   }
 });
 
+// src/components/color-highlight-button.ts
+var import_tailwind_variants15 = require("tailwind-variants");
+var colorHighlightButton = (0, import_tailwind_variants15.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"
+    ]
+  }
+});
+
 // src/components/command.ts
-var import_tailwind_variants13 = require("tailwind-variants");
-var command = (0, import_tailwind_variants13.tv)({
+var import_tailwind_variants16 = require("tailwind-variants");
+var command = (0, import_tailwind_variants16.tv)({
   slots: {
     root: "bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md",
     inputWrapper: "flex h-9 items-center gap-2 border-b px-3",
@@ -1369,8 +1550,8 @@ var command = (0, import_tailwind_variants13.tv)({
 });
 
 // src/components/data-grid.ts
-var import_tailwind_variants14 = require("tailwind-variants");
-var datagrid = (0, import_tailwind_variants14.tv)({
+var import_tailwind_variants17 = require("tailwind-variants");
+var datagrid = (0, import_tailwind_variants17.tv)({
   slots: {
     container: "grid w-full",
     table: "w-full align-middle caption-bottom text-left rtl:text-right text-foreground font-normal text-sm",
@@ -1506,8 +1687,8 @@ var datagrid = (0, import_tailwind_variants14.tv)({
 });
 
 // src/components/data-table.ts
-var import_tailwind_variants15 = require("tailwind-variants");
-var dataTable = (0, import_tailwind_variants15.tv)({
+var import_tailwind_variants18 = require("tailwind-variants");
+var dataTable = (0, import_tailwind_variants18.tv)({
   slots: {
     base: "relative flex min-h-0 flex-1 flex-col",
     toolbarWrapper: "flex flex-col gap-2 divide-y pb-2",
@@ -1551,23 +1732,21 @@ var dataTable = (0, import_tailwind_variants15.tv)({
 });
 
 // src/components/dialog.ts
-var import_tailwind_variants16 = require("tailwind-variants");
-var dialog = (0, import_tailwind_variants16.tv)({
+var import_tailwind_variants19 = require("tailwind-variants");
+var dialog = (0, import_tailwind_variants19.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",
@@ -1641,15 +1820,20 @@ var dialog = (0, import_tailwind_variants16.tv)({
 });
 
 // src/components/drawer.ts
-var import_tailwind_variants17 = require("tailwind-variants");
-var drawer = (0, import_tailwind_variants17.tv)({
+var import_tailwind_variants20 = require("tailwind-variants");
+var drawer = (0, import_tailwind_variants20.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,
@@ -1698,14 +1882,15 @@ var drawer = (0, import_tailwind_variants17.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)]"
         ]
@@ -1713,13 +1898,13 @@ var drawer = (0, import_tailwind_variants17.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"
         ]
       }
     },
@@ -1744,11 +1929,11 @@ var drawer = (0, import_tailwind_variants17.tv)({
 });
 
 // src/components/dropdown-menu.ts
-var import_tailwind_variants18 = require("tailwind-variants");
-var dropdownMenu = (0, import_tailwind_variants18.tv)({
+var import_tailwind_variants21 = require("tailwind-variants");
+var dropdownMenu = (0, import_tailwind_variants21.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",
@@ -1764,9 +1949,53 @@ var dropdownMenu = (0, import_tailwind_variants18.tv)({
   }
 });
 
+// src/components/editor-basic.ts
+var import_tailwind_variants22 = require("tailwind-variants");
+var editorBasic = (0, import_tailwind_variants22.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"
+  }
+});
+
+// src/components/editor-spinner.ts
+var import_tailwind_variants23 = require("tailwind-variants");
+var editorSpinner = (0, import_tailwind_variants23.tv)({
+  slots: {
+    root: "size-full grow shrink flex items-center justify-center",
+    content: ["flex", "flex-col", "items-center", "justify-center", "gap-2"],
+    svg: ["animate-spin size-5"],
+    circle: ["opacity-25 stroke-current stroke-4"],
+    path: ["opacity-75 fill-current"],
+    text: "text-center text-sm text-muted-foreground"
+  }
+});
+
 // src/components/framework-row.ts
-var import_tailwind_variants19 = require("tailwind-variants");
-var frameworkRow = (0, import_tailwind_variants19.tv)({
+var import_tailwind_variants24 = require("tailwind-variants");
+var frameworkRow = (0, import_tailwind_variants24.tv)({
   slots: {
     root: "flex w-full items-start gap-3 py-2 first:pt-0 last:pb-0 border-b border-dotted last:border-0",
     standardContainer: "shrink-0",
@@ -1779,8 +2008,8 @@ var frameworkRow = (0, import_tailwind_variants19.tv)({
 });
 
 // src/components/heading.ts
-var import_tailwind_variants20 = require("tailwind-variants");
-var heading = (0, import_tailwind_variants20.tv)({
+var import_tailwind_variants25 = require("tailwind-variants");
+var heading = (0, import_tailwind_variants25.tv)({
   variants: {
     level: {
       h1: "text-h1-core",
@@ -1797,8 +2026,8 @@ var heading = (0, import_tailwind_variants20.tv)({
 });
 
 // src/components/hover-card.ts
-var import_tailwind_variants21 = require("tailwind-variants");
-var hoverCard = (0, import_tailwind_variants21.tv)({
+var import_tailwind_variants26 = require("tailwind-variants");
+var hoverCard = (0, import_tailwind_variants26.tv)({
   slots: {
     content: [
       ...popoverContentClasses,
@@ -1812,97 +2041,76 @@ var hoverCard = (0, import_tailwind_variants21.tv)({
   }
 });
 
-// src/components/input.ts
-var import_tailwind_variants22 = require("tailwind-variants");
-var passwordInput = (0, import_tailwind_variants22.tv)({
-  slots: {
-    button: "focus:outline-hidden",
-    icon: "pointer-events-none text-muted-foreground"
-  }
+// src/components/input-group.ts
+var import_tailwind_variants27 = require("tailwind-variants");
+var inputGroup = (0, import_tailwind_variants27.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"
+  ]
 });
-var input = (0, import_tailwind_variants22.tv)({
-  base: [],
-  slots: {
-    inputWrapper: [
-      "relative w-full inline-flex flex-row items-center shadow-xs px-3 gap-3 [&_svg]:shrink-0",
-      "border-input border dark:bg-input/30 data-[hidden=true]:hidden transition-[color,box-shadow]",
-      "data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-disabled:opacity-50",
-      ...focusWithinClasses
-    ],
-    innerWrapper: "inline-flex w-full items-center h-full box-border",
-    input: [
-      "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"
-    ],
-    clearButton: [
-      "p-2 -m-2 z-10 absolute end-3 start-auto pointer-events-none",
-      "appearance-none outline-hidden select-none opacity-0 cursor-pointer",
-      "active:!opacity-70 rounded-full"
-    ]
-  },
+
+// src/components/input-wrapper.ts
+var import_tailwind_variants28 = require("tailwind-variants");
+var inputWrapper = (0, import_tailwind_variants28.tv)({
+  base: [
+    "flex items-center gap-1.5",
+    "has-[:focus-visible]:ring-ring/30",
+    "has-[:focus-visible]:border-ring",
+    "has-[:focus-visible]:outline-none",
+    "has-[:focus-visible]:ring-[3px]",
+    "[&_[data-slot=datefield]]:grow",
+    "[&_[data-slot=input]]:data-focus-within:ring-transparent",
+    "[&_[data-slot=input]]:data-focus-within:ring-0",
+    "[&_[data-slot=input]]:data-focus-within:border-0",
+    "[&_[data-slot=input]]:flex",
+    "[&_[data-slot=input]]:w-full",
+    "[&_[data-slot=input]]:outline-none",
+    "[&_[data-slot=input]]:transition-colors",
+    "[&_[data-slot=input]]:text-foreground",
+    "[&_[data-slot=input]]:placeholder:text-muted-foreground",
+    "[&_[data-slot=input]]:border-0 ",
+    "[&_[data-slot=input]]:bg-transparent",
+    "[&_[data-slot=input]]:p-0",
+    "[&_[data-slot=input]]:shadow-none",
+    "[&_[data-slot=input]]:focus-visible:ring-0",
+    "[&_[data-slot=input]]:h-auto ",
+    "[&_[data-slot=input]]:disabled:cursor-not-allowed",
+    "[&_[data-slot=input]]:disabled:opacity-50",
+    "[&_svg]:text-muted-foreground",
+    "has-[[aria-invalid=true]]:border-destructive/60 ",
+    "has-[[aria-invalid=true]]:ring-destructive/10 ",
+    "dark:has-[[aria-invalid=true]]:border-destructive",
+    "dark:has-[[aria-invalid=true]]:ring-destructive/20  "
+  ],
   variants: {
     size: {
-      sm: {
-        inputWrapper: ["h-8 min-h-8 px-2 rounded-sm [&_svg]:size-4"],
-        input: "text-sm file:h-6"
-      },
-      md: {
-        inputWrapper: "h-10 min-10 rounded-md [&_svg]:size-4",
-        input: "text-base md:text-sm file:h-8",
-        clearButton: "hover:opacity-100"
-      },
-      lg: {
-        inputWrapper: "h-12 min-h-12 rounded-lg [&_svg]:size-4",
-        input: "text-base file:h-10",
-        clearButton: "hover:opacity-100"
-      }
-    },
-    radius: {
-      none: {
-        inputWrapper: "rounded-none"
-      },
-      sm: {
-        inputWrapper: "rounded-sm"
-      },
-      md: {
-        inputWrapper: "rounded-md"
-      },
-      lg: {
-        inputWrapper: "rounded-lg"
-      },
-      full: {
-        inputWrapper: "rounded-full"
-      }
-    },
-    isClearable: {
-      true: {
-        input: "peer pe-6",
-        clearButton: [
-          "peer-data-[filled=true]:pointer-events-auto",
-          "peer-data-[filled=true]:opacity-70 peer-data-[filled=true]:block",
-          "peer-data-[filled=true]:scale-100"
-        ]
-      },
-      false: {}
+      sm: "gap-1.25 [&_svg:not([class*=size-])]:size-3.5",
+      md: "gap-1.5 [&_svg:not([class*=size-])]:size-4",
+      lg: "gap-1.5 [&_svg:not([class*=size-])]:size-4"
     }
   },
   defaultVariants: {
-    size: "sm"
+    size: "md"
   }
 });
 
 // src/components/integration-card.ts
-var import_tailwind_variants23 = require("tailwind-variants");
-var integrationCard = (0, import_tailwind_variants23.tv)({
+var import_tailwind_variants29 = require("tailwind-variants");
+var integrationCard = (0, import_tailwind_variants29.tv)({
   slots: {
     root: "",
     header: "flex items-start justify-between gap-3",
@@ -1923,9 +2131,48 @@ var integrationCard = (0, import_tailwind_variants23.tv)({
   }
 });
 
+// src/components/kbd.ts
+var import_tailwind_variants30 = require("tailwind-variants");
+var kbd = (0, import_tailwind_variants30.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"
+  }
+});
+
+// src/components/label.ts
+var import_tailwind_variants31 = require("tailwind-variants");
+var label = (0, import_tailwind_variants31.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"
+  }
+});
+
 // src/components/page-header.ts
-var import_tailwind_variants24 = require("tailwind-variants");
-var pageHeader = (0, import_tailwind_variants24.tv)({
+var import_tailwind_variants32 = require("tailwind-variants");
+var pageHeader = (0, import_tailwind_variants32.tv)({
   slots: {
     root: "page-header",
     titleArea: "page-header__title-area flex gap-2 flex-row items-center",
@@ -1960,8 +2207,8 @@ var pageHeader = (0, import_tailwind_variants24.tv)({
 });
 
 // src/components/page-layout.ts
-var import_tailwind_variants25 = require("tailwind-variants");
-var pageLayout = (0, import_tailwind_variants25.tv)({
+var import_tailwind_variants33 = require("tailwind-variants");
+var pageLayout = (0, import_tailwind_variants33.tv)({
   slots: {
     root: "",
     wrapper: "flex flex-wrap w-full",
@@ -2078,20 +2325,57 @@ var pageLayout = (0, import_tailwind_variants25.tv)({
 });
 
 // src/components/popover.ts
-var import_tailwind_variants26 = require("tailwind-variants");
-var popover = (0, import_tailwind_variants26.tv)({
+var import_tailwind_variants34 = require("tailwind-variants");
+var popover = (0, import_tailwind_variants34.tv)({
   slots: {
     content: [
-      ...popoverContentClasses,
-      "w-72",
-      "origin-(--radix-popover-content-transform-origin)"
-    ]
+      "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"
   }
 });
 
 // src/components/preview-card.ts
-var import_tailwind_variants27 = require("tailwind-variants");
-var previewCard = (0, import_tailwind_variants27.tv)({
+var import_tailwind_variants35 = require("tailwind-variants");
+var previewCard = (0, import_tailwind_variants35.tv)({
   slots: {
     root: [
       "flex w-full items-start gap-3 rounded-md bg-background p-2 transition-colors",
@@ -2132,8 +2416,8 @@ var previewCard = (0, import_tailwind_variants27.tv)({
 });
 
 // src/components/related-control-chip.ts
-var import_tailwind_variants28 = require("tailwind-variants");
-var relatedControlChip = (0, import_tailwind_variants28.tv)({
+var import_tailwind_variants36 = require("tailwind-variants");
+var relatedControlChip = (0, import_tailwind_variants36.tv)({
   slots: {
     root: [
       "text-xs border rounded-full cursor-pointer hover:text-primary px-2.5 py-0.5"
@@ -2143,8 +2427,8 @@ var relatedControlChip = (0, import_tailwind_variants28.tv)({
 });
 
 // src/components/resizable.ts
-var import_tailwind_variants29 = require("tailwind-variants");
-var resizable = (0, import_tailwind_variants29.tv)({
+var import_tailwind_variants37 = require("tailwind-variants");
+var resizable = (0, import_tailwind_variants37.tv)({
   slots: {
     root: ["flex h-full w-full data-[panel-group-direction=vertical]:flex-col"],
     panel: [],
@@ -2170,8 +2454,8 @@ var resizable = (0, import_tailwind_variants29.tv)({
 });
 
 // src/components/risk-badge.ts
-var import_tailwind_variants30 = require("tailwind-variants");
-var riskBadge = (0, import_tailwind_variants30.tv)({
+var import_tailwind_variants38 = require("tailwind-variants");
+var riskBadge = (0, import_tailwind_variants38.tv)({
   slots: {
     root: ["inline-flex flex-col items-start gap-0.5"],
     label: ["inline-flex items-center gap-0.5 text-xs"],
@@ -2210,8 +2494,8 @@ var riskBadge = (0, import_tailwind_variants30.tv)({
 });
 
 // src/components/risk-indicator.ts
-var import_tailwind_variants31 = require("tailwind-variants");
-var riskIndicator = (0, import_tailwind_variants31.tv)({
+var import_tailwind_variants39 = require("tailwind-variants");
+var riskIndicator = (0, import_tailwind_variants39.tv)({
   slots: {
     base: "flex items-end gap-0.5",
     bar: "rounded-sm",
@@ -2243,9 +2527,24 @@ var riskIndicator = (0, import_tailwind_variants31.tv)({
   }
 });
 
+// src/components/scroll-area.ts
+var import_tailwind_variants40 = require("tailwind-variants");
+var scrollArea = (0, import_tailwind_variants40.tv)({
+  slots: {
+    root: "relative",
+    viewport: "focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1",
+    scrollbar: [
+      "flex touch-none p-px transition-[colors,opacity] select-none opacity-0 data-[hovering]:opacity-100 data-[scrolling]:opacity-100 duration-150 delay-300 data-[hovering]:duration-75 data-[scrolling]:duration-75 data-[hovering]:delay-0 data-[scrolling]:delay-0",
+      "data-[orientation=vertical]:h-full data-[orientation=vertical]:w-2 data-[orientation=vertical]:border-l data-[orientation=vertical]:border-l-transparent",
+      "data-[orientation=horizontal]:h-2 data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-transparent"
+    ],
+    thumb: "bg-border relative flex-1 rounded-full"
+  }
+});
+
 // src/components/section-row.ts
-var import_tailwind_variants32 = require("tailwind-variants");
-var sectionRow = (0, import_tailwind_variants32.tv)({
+var import_tailwind_variants41 = require("tailwind-variants");
+var sectionRow = (0, import_tailwind_variants41.tv)({
   slots: {
     root: ["grid grid-cols-1 text-base/6 sm:text-sm/6", "w-full"],
     title: [
@@ -2304,10 +2603,114 @@ var sectionRow = (0, import_tailwind_variants32.tv)({
   }
 });
 
+// src/components/select.ts
+var import_tailwind_variants42 = require("tailwind-variants");
+var select = (0, import_tailwind_variants42.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"
+  }
+});
+
 // src/components/separator.ts
-var import_tailwind_variants33 = require("tailwind-variants");
-var separator = (0, import_tailwind_variants33.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",
+var import_tailwind_variants43 = require("tailwind-variants");
+var separator = (0, import_tailwind_variants43.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"
+  ],
   variants: {
     orientation: {
       vertical: "",
@@ -2318,8 +2721,8 @@ var separator = (0, import_tailwind_variants33.tv)({
 });
 
 // src/components/sidebar.ts
-var import_tailwind_variants34 = require("tailwind-variants");
-var sidebar = (0, import_tailwind_variants34.tv)({
+var import_tailwind_variants44 = require("tailwind-variants");
+var sidebar = (0, import_tailwind_variants44.tv)({
   slots: {
     provider: [
       "group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full"
@@ -2407,7 +2810,7 @@ var sidebar = (0, import_tailwind_variants34.tv)({
     isMobile: false
   }
 });
-var sidebarMenuButton = (0, import_tailwind_variants34.tv)({
+var sidebarMenuButton = (0, import_tailwind_variants44.tv)({
   base: [
     "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md",
     "p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding]",
@@ -2459,7 +2862,7 @@ var sidebarMenuButton = (0, import_tailwind_variants34.tv)({
     }
   ]
 });
-var sidebarMenuAction = (0, import_tailwind_variants34.tv)({
+var sidebarMenuAction = (0, import_tailwind_variants44.tv)({
   base: [
     "text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
     // Increases the hit area of the button on mobile.
@@ -2479,14 +2882,14 @@ var sidebarMenuAction = (0, import_tailwind_variants34.tv)({
 });
 
 // src/components/skeleton.ts
-var import_tailwind_variants35 = require("tailwind-variants");
-var skeleton = (0, import_tailwind_variants35.tv)({
+var import_tailwind_variants45 = require("tailwind-variants");
+var skeleton = (0, import_tailwind_variants45.tv)({
   base: "bg-accent animate-pulse rounded-md"
 });
 
 // src/components/skeleton-avatar.ts
-var import_tailwind_variants36 = require("tailwind-variants");
-var skeletonAvatar = (0, import_tailwind_variants36.tv)({
+var import_tailwind_variants46 = require("tailwind-variants");
+var skeletonAvatar = (0, import_tailwind_variants46.tv)({
   base: "rounded-full",
   variants: {
     size: {
@@ -2502,9 +2905,29 @@ var skeletonAvatar = (0, import_tailwind_variants36.tv)({
   }
 });
 
+// src/components/slash-dropdown-menu.ts
+var import_tailwind_variants47 = require("tailwind-variants");
+var slashDropdownMenu = (0, import_tailwind_variants47.tv)({
+  slots: {
+    card: [...popoverContentClasses, "p-0", "flex flex-col outline-none"],
+    body: ["p-1.5 flex-auto grow shrink overflow-y-auto w-full"],
+    cardItemGroup: [
+      "relative flex align-middle min-w-max",
+      "flex-col justify-center"
+    ],
+    cardGroupLabel: [
+      "text-xs font-bold text-muted-foreground capitalize",
+      "pt-3 pb-1 px-2"
+    ],
+    cardGroup: [
+      "flex relative align-middle max-w-max justify-center items-start flex-col"
+    ]
+  }
+});
+
 // src/components/spinner.ts
-var import_tailwind_variants37 = require("tailwind-variants");
-var spinner = (0, import_tailwind_variants37.tv)({
+var import_tailwind_variants48 = require("tailwind-variants");
+var spinner = (0, import_tailwind_variants48.tv)({
   slots: {
     base: "relative inline-flex flex-col gap-2 items-center justify-center",
     wrapper: "relative flex",
@@ -2621,8 +3044,8 @@ var spinner = (0, import_tailwind_variants37.tv)({
 });
 
 // src/components/split-page-layout.ts
-var import_tailwind_variants38 = require("tailwind-variants");
-var splitPageLayout = (0, import_tailwind_variants38.tv)({
+var import_tailwind_variants49 = require("tailwind-variants");
+var splitPageLayout = (0, import_tailwind_variants49.tv)({
   slots: {
     root: [
       "size-full min-h-0 grid grid-cols-[1fr_10px] md:grid-cols-3 relative"
@@ -2659,8 +3082,8 @@ var splitPageLayout = (0, import_tailwind_variants38.tv)({
 });
 
 // src/components/standard-chip.ts
-var import_tailwind_variants39 = require("tailwind-variants");
-var standardChip = (0, import_tailwind_variants39.tv)({
+var import_tailwind_variants50 = require("tailwind-variants");
+var standardChip = (0, import_tailwind_variants50.tv)({
   extend: chip,
   slots: {
     root: [
@@ -2751,8 +3174,8 @@ var standardChip = (0, import_tailwind_variants39.tv)({
 });
 
 // src/components/tab-nav.ts
-var import_tailwind_variants40 = require("tailwind-variants");
-var tabNav = (0, import_tailwind_variants40.tv)({
+var import_tailwind_variants51 = require("tailwind-variants");
+var tabNav = (0, import_tailwind_variants51.tv)({
   slots: {
     base: "",
     list: [
@@ -2842,8 +3265,8 @@ var tabNav = (0, import_tailwind_variants40.tv)({
 });
 
 // src/components/table.ts
-var import_tailwind_variants41 = require("tailwind-variants");
-var table = (0, import_tailwind_variants41.tv)({
+var import_tailwind_variants52 = require("tailwind-variants");
+var table = (0, import_tailwind_variants52.tv)({
   slots: {
     container: ["overflow-x-auto whitespace-nowrap", "-mx-(--gutter)"],
     wrapper: ["inline-block min-w-full align-middle"],
@@ -3005,8 +3428,8 @@ var table = (0, import_tailwind_variants41.tv)({
 });
 
 // src/components/tabs.ts
-var import_tailwind_variants42 = require("tailwind-variants");
-var tabs = (0, import_tailwind_variants42.tv)({
+var import_tailwind_variants53 = require("tailwind-variants");
+var tabs = (0, import_tailwind_variants53.tv)({
   slots: {
     root: "flex flex-col gap-2",
     list: [
@@ -3042,9 +3465,53 @@ var tabs = (0, import_tailwind_variants42.tv)({
   }
 });
 
+// src/components/textarea.ts
+var import_tailwind_variants54 = require("tailwind-variants");
+var textarea = (0, import_tailwind_variants54.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"
+  }
+});
+
+// src/components/toolbar.ts
+var import_tailwind_variants55 = require("tailwind-variants");
+var toolbar = (0, import_tailwind_variants55.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"
+  }
+});
+
 // src/components/tooltip.ts
-var import_tailwind_variants43 = require("tailwind-variants");
-var tooltip = (0, import_tailwind_variants43.tv)({
+var import_tailwind_variants56 = require("tailwind-variants");
+var tooltip = (0, import_tailwind_variants56.tv)({
   slots: {
     content: [
       "bg-primary-900 text-primary-foreground",
@@ -3059,6 +3526,7 @@ var tooltip = (0, import_tailwind_variants43.tv)({
 0 && (module.exports = {
   accordion,
   alertDialog,
+  autocomplete,
   avatar,
   avatarGroup,
   blankstate,
@@ -3069,17 +3537,24 @@ var tooltip = (0, import_tailwind_variants43.tv)({
   checkbox,
   chip,
   code,
+  colorHighlightButton,
   command,
   dataTable,
   datagrid,
   dialog,
   drawer,
   dropdownMenu,
+  editorBasic,
+  editorSpinner,
   frameworkRow,
   heading,
   hoverCard,
   input,
+  inputGroup,
+  inputWrapper,
   integrationCard,
+  kbd,
+  label,
   pageHeader,
   pageLayout,
   passwordInput,
@@ -3089,18 +3564,23 @@ var tooltip = (0, import_tailwind_variants43.tv)({
   resizable,
   riskBadge,
   riskIndicator,
+  scrollArea,
   sectionRow,
+  select,
   separator,
   sidebar,
   sidebarMenuAction,
   sidebarMenuButton,
   skeleton,
   skeletonAvatar,
+  slashDropdownMenu,
   spinner,
   splitPageLayout,
   standardChip,
   tabNav,
   table,
   tabs,
+  textarea,
+  toolbar,
   tooltip
 });