@2urgseui/core 0.1.3 → 0.1.4

package/dist/index.js

@@ -561,10 +561,10 @@ function AsyncSelectInner(props) {
         "aria-expanded": open,
         disabled,
         className: cn(
-          "flex h-11 w-full appearance-none items-center justify-between gap-2 px-4 text-base md:text-sm",
+          "flex min-h-11 w-full appearance-none items-center justify-between gap-2 px-4 py-2 text-base md:text-sm",
           inputSurfaceField,
           inputSurfaceFieldDisabled,
-          "[&>span]:line-clamp-1 [&>span]:text-inherit [&_svg]:text-slate-500 dark:[&_svg]:text-slate-400",
+          "[&>span]:min-w-0 [&>span]:flex-1 [&>span]:text-left [&>span]:whitespace-normal [&>span]:break-words [&>span]:text-inherit [&_svg]:text-slate-500 dark:[&_svg]:text-slate-400",
           error && inputSurfaceFieldInvalid,
           className
         ),
@@ -572,7 +572,10 @@ function AsyncSelectInner(props) {
           /* @__PURE__ */ jsx6(
             "span",
             {
-              className: cn("truncate", !triggerLabel && "text-slate-500 dark:text-slate-400"),
+              className: cn(
+                "min-w-0 flex-1 text-left whitespace-normal break-words",
+                !triggerLabel && "text-slate-500 dark:text-slate-400"
+              ),
               children: triggerLabel ?? placeholder
             }
           ),
@@ -633,14 +636,14 @@ function AsyncSelectInner(props) {
                   "aria-selected": isSelected,
                   onClick: () => handleSelect(item),
                   className: cn(
-                    "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none",
+                    "relative flex w-full cursor-default select-none items-start rounded-sm py-1.5 pl-8 pr-2 text-sm text-left outline-none",
                     "hover:bg-accent hover:text-accent-foreground",
                     "focus-visible:bg-accent focus-visible:text-accent-foreground",
                     isSelected && "bg-accent/50"
                   ),
                   children: [
                     /* @__PURE__ */ jsx6("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: isSelected && /* @__PURE__ */ jsx6(Check, { className: "h-4 w-4" }) }),
-                    /* @__PURE__ */ jsx6("span", { className: "truncate", children: resolveLabel(item, labelKey) })
+                    /* @__PURE__ */ jsx6("span", { className: "min-w-0 flex-1 whitespace-normal break-words", children: resolveLabel(item, labelKey) })
                   ]
                 },
                 itemValue
@@ -1915,7 +1918,7 @@ var FileDropzone = React20.forwardRef(
 FileDropzone.displayName = "FileDropzone";
 
 // source/components/primitive/FormField/form-field.tsx
-import * as React29 from "react";
+import * as React30 from "react";
 import {
   Controller
 } from "react-hook-form";
@@ -2172,30 +2175,195 @@ var RichTextEditor = ({
   );
 };
 
-// source/components/primitive/Select/select.tsx
+// source/components/primitive/SearchableSelect/searchable-select.tsx
 import * as React25 from "react";
-import * as SelectPrimitive from "@radix-ui/react-select";
-import { Check as Check4, ChevronDown as ChevronDown3, ChevronUp } from "lucide-react";
+import { Check as Check4, ChevronDown as ChevronDown3, Search as Search2 } from "lucide-react";
 import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
+function reactNodeToLabelString2(node) {
+  if (node == null || typeof node === "boolean") return "";
+  if (typeof node === "string" || typeof node === "number") return String(node);
+  if (Array.isArray(node)) return node.map(reactNodeToLabelString2).join("");
+  return "";
+}
+function defaultFilterItem(item, search) {
+  const q = search.trim().toLowerCase();
+  if (!q) return true;
+  return reactNodeToLabelString2(item.label).toLowerCase().includes(q);
+}
+function SearchableSelectInner({
+  items,
+  value,
+  onValueChange,
+  placeholder = "Select\u2026",
+  searchPlaceholder = "Search\u2026",
+  clearable = false,
+  disabled = false,
+  error = false,
+  name,
+  id,
+  className,
+  filterItem = defaultFilterItem,
+  onBlur,
+  "aria-describedby": ariaDescribedBy,
+  "aria-invalid": ariaInvalid,
+  innerRef
+}) {
+  const [open, setOpen] = React25.useState(false);
+  const [search, setSearch] = React25.useState("");
+  const searchInputRef = React25.useRef(null);
+  const filteredItems = items.filter((item) => filterItem(item, search));
+  const selectedItem = items.find((item) => item.value === value);
+  React25.useEffect(() => {
+    if (open) {
+      setTimeout(() => searchInputRef.current?.focus(), 0);
+    } else {
+      setSearch("");
+    }
+  }, [open]);
+  const handleSelect = (item) => {
+    if (item.disabled) return;
+    if (clearable && item.value === value) {
+      onValueChange?.("");
+    } else {
+      onValueChange?.(item.value);
+    }
+    setOpen(false);
+  };
+  const handleClear = (e) => {
+    e.stopPropagation();
+    onValueChange?.("");
+  };
+  return /* @__PURE__ */ jsxs18(Popover, { open, onOpenChange: setOpen, children: [
+    name && /* @__PURE__ */ jsx28("input", { type: "hidden", name, value: value ?? "" }),
+    /* @__PURE__ */ jsx28(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs18(
+      "button",
+      {
+        ref: innerRef,
+        id,
+        type: "button",
+        role: "combobox",
+        "aria-expanded": open,
+        "aria-describedby": ariaDescribedBy,
+        "aria-invalid": ariaInvalid,
+        disabled,
+        onBlur,
+        className: cn(
+          "flex min-h-11 w-full appearance-none items-center justify-between gap-2 px-4 py-2 text-base md:text-sm",
+          inputSurfaceField,
+          inputSurfaceFieldDisabled,
+          error && inputSurfaceFieldInvalid,
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx28(
+            "span",
+            {
+              className: cn(
+                "min-w-0 flex-1 text-left whitespace-normal break-words",
+                !selectedItem && "text-slate-500 dark:text-slate-400"
+              ),
+              children: selectedItem?.label ?? placeholder
+            }
+          ),
+          /* @__PURE__ */ jsxs18("span", { className: "flex shrink-0 items-center gap-1", children: [
+            clearable && value && !disabled && /* @__PURE__ */ jsx28(
+              "span",
+              {
+                role: "button",
+                tabIndex: -1,
+                "aria-label": "Clear selection",
+                onClick: handleClear,
+                onKeyDown: (e) => {
+                  if (e.key === "Enter" || e.key === " ") {
+                    handleClear(e);
+                  }
+                },
+                className: "rounded-sm p-0.5 text-muted-foreground hover:text-foreground",
+                children: "\xD7"
+              }
+            ),
+            /* @__PURE__ */ jsx28(ChevronDown3, { "aria-hidden": true, className: "h-4 w-4 shrink-0 text-slate-500 dark:text-slate-400" })
+          ] })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs18(
+      PopoverContent,
+      {
+        align: "start",
+        className: "w-[--radix-popover-trigger-width] min-w-[var(--radix-popover-trigger-width)] max-w-[var(--radix-popover-content-available-width)] p-0",
+        onOpenAutoFocus: (e) => e.preventDefault(),
+        children: [
+          /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2 border-b px-3 py-2", children: [
+            /* @__PURE__ */ jsx28(Search2, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+            /* @__PURE__ */ jsx28(
+              "input",
+              {
+                ref: searchInputRef,
+                value: search,
+                onChange: (e) => setSearch(e.target.value),
+                placeholder: searchPlaceholder,
+                className: "h-8 w-full bg-transparent text-sm outline-none placeholder:text-muted-foreground"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx28("div", { className: "max-h-60 overflow-y-auto p-1", children: filteredItems.length === 0 ? /* @__PURE__ */ jsx28("div", { className: "px-3 py-6 text-center text-sm text-muted-foreground", children: "No results found." }) : filteredItems.map((item) => {
+            const isSelected = item.value === value;
+            return /* @__PURE__ */ jsxs18(
+              "button",
+              {
+                type: "button",
+                role: "option",
+                "aria-selected": isSelected,
+                disabled: item.disabled,
+                onClick: () => handleSelect(item),
+                className: cn(
+                  "relative flex w-full cursor-default select-none items-start rounded-sm py-1.5 pl-8 pr-2 text-sm text-left outline-none",
+                  "hover:bg-accent hover:text-accent-foreground",
+                  "focus-visible:bg-accent focus-visible:text-accent-foreground",
+                  "disabled:pointer-events-none disabled:opacity-50",
+                  isSelected && "bg-accent/50"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx28("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: isSelected && /* @__PURE__ */ jsx28(Check4, { className: "h-4 w-4" }) }),
+                  /* @__PURE__ */ jsx28("span", { className: "min-w-0 flex-1 whitespace-normal break-words", children: item.label })
+                ]
+              },
+              item.value
+            );
+          }) })
+        ]
+      }
+    )
+  ] });
+}
+var SearchableSelect = React25.forwardRef((props, ref) => /* @__PURE__ */ jsx28(SearchableSelectInner, { ...props, innerRef: ref }));
+SearchableSelect.displayName = "SearchableSelect";
+
+// source/components/primitive/Select/select.tsx
+import * as React26 from "react";
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { Check as Check5, ChevronDown as ChevronDown4, ChevronUp } from "lucide-react";
+import { jsx as jsx29, jsxs as jsxs19 } from "react/jsx-runtime";
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
 var SelectValue = SelectPrimitive.Value;
-var SelectTrigger = React25.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs18(
+var SelectTrigger = React26.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs19(
   SelectPrimitive.Trigger,
   {
     ref,
     className: cn(
-      "flex h-11 w-full appearance-none items-center justify-between gap-2 px-4 text-base md:text-sm",
+      "flex min-h-11 w-full appearance-none items-center justify-between gap-2 px-4 py-2 text-base md:text-sm",
       inputSurfaceField,
       inputSurfaceFieldDisabled,
-      "[&>span]:line-clamp-1 [&>span]:text-inherit [&_svg]:text-slate-500 dark:[&_svg]:text-slate-400",
+      "[&>span]:min-w-0 [&>span]:flex-1 [&>span]:text-left [&>span]:whitespace-normal [&>span]:break-words [&>span]:text-inherit [&_svg]:text-slate-500 dark:[&_svg]:text-slate-400",
       className
     ),
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx28(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx28(
-        ChevronDown3,
+      /* @__PURE__ */ jsx29(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx29(
+        ChevronDown4,
         {
           "aria-hidden": "true",
           className: "h-4 w-4 shrink-0"
@@ -2205,7 +2373,7 @@ var SelectTrigger = React25.forwardRef(({ className, children, ...props }, ref)
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
+var SelectScrollUpButton = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -2214,11 +2382,11 @@ var SelectScrollUpButton = React25.forwardRef(({ className, ...props }, ref) =>
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx28(ChevronUp, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ jsx29(ChevronUp, { className: "h-4 w-4" })
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
+var SelectScrollDownButton = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -2227,39 +2395,39 @@ var SelectScrollDownButton = React25.forwardRef(({ className, ...props }, ref) =
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx28(ChevronDown3, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ jsx29(ChevronDown4, { className: "h-4 w-4" })
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React25.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx28(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs18(
+var SelectContent = React26.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx29(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs19(
   SelectPrimitive.Content,
   {
     ref,
     className: cn(
-      "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover text-popover-foreground shadow-md 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 origin-[--radix-select-content-transform-origin]",
-      position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+      "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto rounded-md border bg-popover text-popover-foreground shadow-md 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 origin-[--radix-select-content-transform-origin]",
+      position === "popper" && "min-w-[var(--radix-select-trigger-width)] max-w-[var(--radix-select-content-available-width)] data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
       className
     ),
     position,
     ...props,
     children: [
-      /* @__PURE__ */ jsx28(SelectScrollUpButton, {}),
-      /* @__PURE__ */ jsx28(
+      /* @__PURE__ */ jsx29(SelectScrollUpButton, {}),
+      /* @__PURE__ */ jsx29(
         SelectPrimitive.Viewport,
         {
           className: cn(
             "p-1",
-            position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+            position === "popper" && "w-full min-w-[var(--radix-select-trigger-width)]"
           ),
           children
         }
       ),
-      /* @__PURE__ */ jsx28(SelectScrollDownButton, {})
+      /* @__PURE__ */ jsx29(SelectScrollDownButton, {})
     ]
   }
 ) }));
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
+var SelectLabel = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
   SelectPrimitive.Label,
   {
     ref,
@@ -2268,31 +2436,31 @@ var SelectLabel = React25.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React25.forwardRef(({ value, className, children, ...props }, ref) => {
+var SelectItem = React26.forwardRef(({ value, className, children, ...props }, ref) => {
   if (value === "") {
     throw new Error(
       'SelectItem: `value` must not be an empty string \u2014 Radix uses "" to reset the Select and show the placeholder. Omit that option and use `<SelectValue placeholder="\u2026">`, or assign a sentinel value such as `"none"`.'
     );
   }
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     SelectPrimitive.Item,
     {
       ref,
       value,
       className: cn(
-        "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        "relative flex w-full cursor-default select-none items-start rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
         className
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx28("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx28(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx28(Check4, { className: "h-4 w-4" }) }) }),
-        /* @__PURE__ */ jsx28(SelectPrimitive.ItemText, { children })
+        /* @__PURE__ */ jsx29("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx29(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx29(Check5, { className: "h-4 w-4" }) }) }),
+        /* @__PURE__ */ jsx29(SelectPrimitive.ItemText, { className: "whitespace-normal break-words", children })
       ]
     }
   );
 });
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
+var SelectSeparator = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
   SelectPrimitive.Separator,
   {
     ref,
@@ -2303,10 +2471,10 @@ var SelectSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @_
 SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 // source/components/primitive/Switch/switch.tsx
-import * as React26 from "react";
+import * as React27 from "react";
 import * as SwitchPrimitives from "@radix-ui/react-switch";
 import { cva as cva9 } from "class-variance-authority";
-import { jsx as jsx29, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs20 } from "react/jsx-runtime";
 var switchRootVariants = cva9(
   [
     "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
@@ -2340,14 +2508,14 @@ var switchThumbVariants = cva9(
     }
   }
 );
-var Switch = React26.forwardRef(
+var Switch = React27.forwardRef(
   ({ className, label, description, error, size, id: idProp, ...props }, ref) => {
-    const generatedId = React26.useId();
+    const generatedId = React27.useId();
     const id = idProp ?? generatedId;
     const descriptionId = description ? `${id}-description` : void 0;
     const errorId = error ? `${id}-error` : void 0;
-    return /* @__PURE__ */ jsxs19("div", { className: "flex items-start gap-3", children: [
-      /* @__PURE__ */ jsx29(
+    return /* @__PURE__ */ jsxs20("div", { className: "flex items-start gap-3", children: [
+      /* @__PURE__ */ jsx30(
         SwitchPrimitives.Root,
         {
           ref,
@@ -2360,7 +2528,7 @@ var Switch = React26.forwardRef(
             className
           ),
           ...props,
-          children: /* @__PURE__ */ jsx29(
+          children: /* @__PURE__ */ jsx30(
             SwitchPrimitives.Thumb,
             {
               className: cn(switchThumbVariants({ size }))
@@ -2368,8 +2536,8 @@ var Switch = React26.forwardRef(
           )
         }
       ),
-      (label || description || error) && /* @__PURE__ */ jsxs19("div", { className: "flex flex-col leading-tight", children: [
-        label && /* @__PURE__ */ jsx29(
+      (label || description || error) && /* @__PURE__ */ jsxs20("div", { className: "flex flex-col leading-tight", children: [
+        label && /* @__PURE__ */ jsx30(
           "label",
           {
             htmlFor: id,
@@ -2377,7 +2545,7 @@ var Switch = React26.forwardRef(
             children: label
           }
         ),
-        description && /* @__PURE__ */ jsx29(
+        description && /* @__PURE__ */ jsx30(
           "p",
           {
             id: descriptionId,
@@ -2385,7 +2553,7 @@ var Switch = React26.forwardRef(
             children: description
           }
         ),
-        error && /* @__PURE__ */ jsx29(
+        error && /* @__PURE__ */ jsx30(
           "p",
           {
             id: errorId,
@@ -2400,9 +2568,9 @@ var Switch = React26.forwardRef(
 Switch.displayName = "Switch";
 
 // source/components/primitive/Text/text.tsx
-import * as React27 from "react";
+import * as React28 from "react";
 import { cva as cva10 } from "class-variance-authority";
-import { jsx as jsx30 } from "react/jsx-runtime";
+import { jsx as jsx31 } from "react/jsx-runtime";
 var textVariants = cva10("text-foreground", {
   variants: {
     element: {
@@ -2451,7 +2619,7 @@ var textVariants = cva10("text-foreground", {
     tone: "default"
   }
 });
-var Text = React27.forwardRef(
+var Text = React28.forwardRef(
   ({
     element = "p",
     size,
@@ -2464,7 +2632,7 @@ var Text = React27.forwardRef(
   }, ref) => {
     const Comp = element;
     const variantElement = element === "div" ? "p" : element;
-    return /* @__PURE__ */ jsx30(
+    return /* @__PURE__ */ jsx31(
       Comp,
       {
         ref,
@@ -2487,8 +2655,8 @@ var Text = React27.forwardRef(
 Text.displayName = "Text";
 
 // source/components/primitive/TextArea/textarea.tsx
-import * as React28 from "react";
-import { jsx as jsx31 } from "react/jsx-runtime";
+import * as React29 from "react";
+import { jsx as jsx32 } from "react/jsx-runtime";
 var resizeClasses = {
   none: "resize-none",
   vertical: "resize-y",
@@ -2496,9 +2664,9 @@ var resizeClasses = {
   both: "resize"
 };
 var layout = "block min-h-[120px] w-full min-w-0 px-4 py-2 text-sm md:text-base";
-var Textarea = React28.forwardRef(
+var Textarea = React29.forwardRef(
   ({ className, error, resize = "vertical", ...props }, ref) => {
-    return /* @__PURE__ */ jsx31(
+    return /* @__PURE__ */ jsx32(
       "textarea",
       {
         ref,
@@ -2520,7 +2688,7 @@ var Textarea = React28.forwardRef(
 Textarea.displayName = "Textarea";
 
 // source/components/primitive/FormField/form-field.tsx
-import { jsx as jsx32, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx33, jsxs as jsxs21 } from "react/jsx-runtime";
 function stripThousands(s) {
   return s.replace(/,/g, "");
 }
@@ -2664,7 +2832,7 @@ function FormField({
   className,
   renderInput
 }) {
-  const generatedId = React29.useId();
+  const generatedId = React30.useId();
   const inputId = `field-${generatedId}`;
   const descriptionId = description ? `${inputId}-description` : void 0;
   const externalError = error ? String(error) : void 0;
@@ -2707,7 +2875,7 @@ function FormField({
     );
   }
   if (control) {
-    return /* @__PURE__ */ jsx32(
+    return /* @__PURE__ */ jsx33(
       Controller,
       {
         name,
@@ -2734,7 +2902,7 @@ function FormField({
             onChange: field.onChange,
             onBlur: field.onBlur,
             ref: field.ref
-          }) : /* @__PURE__ */ jsx32(
+          }) : /* @__PURE__ */ jsx33(
             FormFieldVariantControl,
             {
               variant,
@@ -2759,7 +2927,7 @@ function FormField({
               maskInput: renderInput ? void 0 : maskInput
             }
           );
-          const labelBlock = isCheckboxInline || !hasFieldLabel2 ? null : /* @__PURE__ */ jsx32(
+          const labelBlock = isCheckboxInline || !hasFieldLabel2 ? null : /* @__PURE__ */ jsx33(
             Label2,
             {
               id: variant === "radio" || variant === "richtext" ? legendId : void 0,
@@ -2769,8 +2937,8 @@ function FormField({
               children: label
             }
           );
-          const checkboxInline = isCheckboxInline ? hasFieldLabel2 ? /* @__PURE__ */ jsxs20("div", { className: "flex w-full min-w-0 items-start gap-2", children: [
-            /* @__PURE__ */ jsx32(
+          const checkboxInline = isCheckboxInline ? hasFieldLabel2 ? /* @__PURE__ */ jsxs21("div", { className: "flex w-full min-w-0 items-start gap-2", children: [
+            /* @__PURE__ */ jsx33(
               Checkbox,
               {
                 ...checkboxProps,
@@ -2785,7 +2953,7 @@ function FormField({
                 "aria-invalid": hasError || void 0
               }
             ),
-            /* @__PURE__ */ jsx32(
+            /* @__PURE__ */ jsx33(
               Label2,
               {
                 htmlFor: inputId,
@@ -2795,7 +2963,7 @@ function FormField({
                 children: label
               }
             )
-          ] }) : /* @__PURE__ */ jsx32(
+          ] }) : /* @__PURE__ */ jsx33(
             Checkbox,
             {
               ...checkboxProps,
@@ -2810,7 +2978,7 @@ function FormField({
               "aria-invalid": hasError || void 0
             }
           ) : null;
-          return /* @__PURE__ */ jsxs20(
+          return /* @__PURE__ */ jsxs21(
             "div",
             {
               className: cn(
@@ -2818,12 +2986,12 @@ function FormField({
                 className
               ),
               children: [
-                isCheckboxInline ? checkboxInline : /* @__PURE__ */ jsxs20("div", { className: "flex w-full min-w-0 flex-col gap-1.5", children: [
+                isCheckboxInline ? checkboxInline : /* @__PURE__ */ jsxs21("div", { className: "flex w-full min-w-0 flex-col gap-1.5", children: [
                   labelBlock,
                   controlNode
                 ] }),
-                description && /* @__PURE__ */ jsx32(Text, { id: descriptionId, size: "sm", tone: "muted", children: description }),
-                message && /* @__PURE__ */ jsx32(Text, { id: errorId, size: "sm", tone: "destructive", children: message })
+                description && /* @__PURE__ */ jsx33(Text, { id: descriptionId, size: "sm", tone: "muted", children: description }),
+                message && /* @__PURE__ */ jsx33(Text, { id: errorId, size: "sm", tone: "destructive", children: message })
               ]
             }
           );
@@ -2848,7 +3016,7 @@ function FormField({
     "aria-describedby": describedBy,
     error: Boolean(externalError),
     ...registered
-  }) : variant === "textarea" ? /* @__PURE__ */ jsx32(
+  }) : variant === "textarea" ? /* @__PURE__ */ jsx33(
     Textarea,
     {
       id: inputId,
@@ -2857,7 +3025,7 @@ function FormField({
       ...textareaProps,
       ...registered
     }
-  ) : /* @__PURE__ */ jsx32(
+  ) : /* @__PURE__ */ jsx33(
     Input,
     {
       id: inputId,
@@ -2867,13 +3035,13 @@ function FormField({
       ...registered
     }
   );
-  return /* @__PURE__ */ jsxs20("div", { className: cn("mt-4 flex w-full min-w-0 flex-col gap-2", className), children: [
-    hasFieldLabel ? /* @__PURE__ */ jsxs20("div", { className: "flex w-full min-w-0 flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx32(Label2, { htmlFor: inputId, required, size: "sm", children: label }),
+  return /* @__PURE__ */ jsxs21("div", { className: cn("mt-4 flex w-full min-w-0 flex-col gap-2", className), children: [
+    hasFieldLabel ? /* @__PURE__ */ jsxs21("div", { className: "flex w-full min-w-0 flex-col gap-1.5", children: [
+      /* @__PURE__ */ jsx33(Label2, { htmlFor: inputId, required, size: "sm", children: label }),
       registeredControl
-    ] }) : /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: registeredControl }),
-    description && /* @__PURE__ */ jsx32(Text, { id: descriptionId, size: "sm", tone: "muted", children: description }),
-    externalError && /* @__PURE__ */ jsx32(Text, { id: `${inputId}-error`, size: "sm", tone: "destructive", children: externalError })
+    ] }) : /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: registeredControl }),
+    description && /* @__PURE__ */ jsx33(Text, { id: descriptionId, size: "sm", tone: "muted", children: description }),
+    externalError && /* @__PURE__ */ jsx33(Text, { id: `${inputId}-error`, size: "sm", tone: "destructive", children: externalError })
   ] });
 }
 function formValueToAsyncSelectOption(v) {
@@ -2911,7 +3079,7 @@ function FormFieldVariantControl({
 }) {
   switch (variant) {
     case "textarea":
-      return /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx32(
+      return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx33(
         Textarea,
         {
           ...textareaProps,
@@ -2929,7 +3097,7 @@ function FormFieldVariantControl({
     case "checkbox":
       return null;
     case "switch":
-      return /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx32(
+      return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx33(
         Switch,
         {
           ...switchProps,
@@ -2953,6 +3121,10 @@ function FormFieldVariantControl({
         items,
         triggerClassName,
         contentClassName,
+        searchable,
+        searchPlaceholder,
+        clearable,
+        filterItem,
         ...selectRootRest
       } = selectProps;
       const emptyValueItems = items.filter((item) => item.value === "");
@@ -2962,7 +3134,33 @@ function FormFieldVariantControl({
         );
       }
       const value = field.value == null || field.value === "" ? void 0 : String(field.value);
-      return /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsxs20(
+      if (searchable) {
+        return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx33(
+          SearchableSelect,
+          {
+            items,
+            value,
+            onValueChange: field.onChange,
+            onBlur: field.onBlur,
+            placeholder,
+            searchPlaceholder,
+            clearable,
+            filterItem,
+            disabled: field.disabled,
+            error: hasError,
+            name: field.name,
+            id: inputId,
+            ref: field.ref,
+            className: cn(
+              hasError && inputSurfaceFieldInvalid,
+              triggerClassName
+            ),
+            "aria-describedby": describedBy,
+            "aria-invalid": hasError || void 0
+          }
+        ) });
+      }
+      return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsxs21(
         Select,
         {
           ...selectRootRest,
@@ -2971,7 +3169,7 @@ function FormFieldVariantControl({
           disabled: field.disabled,
           name: field.name,
           children: [
-            /* @__PURE__ */ jsx32(
+            /* @__PURE__ */ jsx33(
               SelectTrigger,
               {
                 id: inputId,
@@ -2983,10 +3181,10 @@ function FormFieldVariantControl({
                   triggerClassName
                 ),
                 onBlur: field.onBlur,
-                children: /* @__PURE__ */ jsx32(SelectValue, { placeholder })
+                children: /* @__PURE__ */ jsx33(SelectValue, { placeholder })
               }
             ),
-            /* @__PURE__ */ jsx32(SelectContent, { className: contentClassName, children: items.map((item) => /* @__PURE__ */ jsx32(
+            /* @__PURE__ */ jsx33(SelectContent, { className: contentClassName, children: items.map((item) => /* @__PURE__ */ jsx33(
               SelectItem,
               {
                 value: item.value,
@@ -3009,7 +3207,7 @@ function FormFieldVariantControl({
       if (!asyncSelectProps?.labelKey) {
         throw new Error('FormField variant "async-select" requires asyncSelectProps.labelKey.');
       }
-      return /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx32(
+      return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx33(
         AsyncSelect,
         {
           ...asyncSelectProps,
@@ -3033,7 +3231,7 @@ function FormFieldVariantControl({
         className: radioClassName,
         ...radioGroupRest
       } = radioProps;
-      return /* @__PURE__ */ jsx32(
+      return /* @__PURE__ */ jsx33(
         RadioGroup2,
         {
           ...radioGroupRest,
@@ -3048,8 +3246,8 @@ function FormFieldVariantControl({
           "aria-describedby": describedBy,
           "aria-invalid": hasError || void 0,
           ref: field.ref,
-          children: options.map((opt) => /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx32(
+          children: options.map((opt) => /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx33(
               RadioGroupItem,
               {
                 value: opt.value,
@@ -3057,7 +3255,7 @@ function FormFieldVariantControl({
                 disabled: opt.disabled
               }
             ),
-            /* @__PURE__ */ jsx32(
+            /* @__PURE__ */ jsx33(
               Label2,
               {
                 htmlFor: opt.id ?? `${inputId}-${opt.value}`,
@@ -3076,7 +3274,7 @@ function FormFieldVariantControl({
       }
       const { maxLength, groups, containerClassName, ...otpRest } = otpProps;
       const slotGroups = groups?.length ? groups : defaultOtpGroups(maxLength);
-      return /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx32(
+      return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx33(
         InputOTP,
         {
           ...otpRest,
@@ -3095,15 +3293,15 @@ function FormFieldVariantControl({
             hasError && inputOtpContainerInvalid,
             containerClassName
           ),
-          children: slotGroups.map((indices, gi) => /* @__PURE__ */ jsxs20(React29.Fragment, { children: [
-            gi > 0 ? /* @__PURE__ */ jsx32(InputOTPSeparator, {}) : null,
-            /* @__PURE__ */ jsx32(InputOTPGroup, { children: indices.map((index) => /* @__PURE__ */ jsx32(InputOTPSlot, { index }, index)) })
+          children: slotGroups.map((indices, gi) => /* @__PURE__ */ jsxs21(React30.Fragment, { children: [
+            gi > 0 ? /* @__PURE__ */ jsx33(InputOTPSeparator, {}) : null,
+            /* @__PURE__ */ jsx33(InputOTPGroup, { children: indices.map((index) => /* @__PURE__ */ jsx33(InputOTPSlot, { index }, index)) })
           ] }, gi))
         }
       ) });
     }
     case "richtext":
-      return /* @__PURE__ */ jsx32(
+      return /* @__PURE__ */ jsx33(
         "div",
         {
           className: "w-full min-w-0",
@@ -3113,7 +3311,7 @@ function FormFieldVariantControl({
           "aria-describedby": describedBy,
           "aria-invalid": hasError || void 0,
           onBlur: field.onBlur,
-          children: /* @__PURE__ */ jsx32(
+          children: /* @__PURE__ */ jsx33(
             RichTextEditor,
             {
               value: field.value ?? "",
@@ -3125,7 +3323,7 @@ function FormFieldVariantControl({
         }
       );
     case "dropzone":
-      return /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx32(
+      return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx33(
         FileDropzone,
         {
           ...dropzoneProps,
@@ -3159,7 +3357,7 @@ function FormFieldVariantControl({
         const pattern = maskInput.pattern;
         const rawStored = field.value == null || field.value === "" ? "" : String(field.value);
         const displayValue = formFieldMaskFormatDisplay(pattern, rawStored);
-        return /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx32(
+        return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx33(
           Input,
           {
             ...restInputProps,
@@ -3196,7 +3394,7 @@ function FormFieldVariantControl({
           useGrouping
         );
         const defaultInputMode = allowDecimal ? "decimal" : "numeric";
-        return /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx32(
+        return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx33(
           Input,
           {
             ...restInputProps,
@@ -3220,7 +3418,7 @@ function FormFieldVariantControl({
           }
         ) });
       }
-      return /* @__PURE__ */ jsx32("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx32(
+      return /* @__PURE__ */ jsx33("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx33(
         Input,
         {
           ...restInputProps,
@@ -3245,9 +3443,9 @@ function FormFieldVariantControl({
 }
 
 // source/components/primitive/Heading/heading.tsx
-import * as React30 from "react";
+import * as React31 from "react";
 import { cva as cva11 } from "class-variance-authority";
-import { jsx as jsx33 } from "react/jsx-runtime";
+import { jsx as jsx34 } from "react/jsx-runtime";
 var headingVariants = cva11(
   "text-foreground tracking-tight",
   {
@@ -3313,7 +3511,7 @@ var headingVariants = cva11(
     }
   }
 );
-var Heading = React30.forwardRef(
+var Heading = React31.forwardRef(
   ({
     level = 1,
     size,
@@ -3326,7 +3524,7 @@ var Heading = React30.forwardRef(
     ...props
   }, ref) => {
     const Tag = `h${level}`;
-    return /* @__PURE__ */ jsx33(
+    return /* @__PURE__ */ jsx34(
       Tag,
       {
         ref,
@@ -3342,10 +3540,10 @@ var Heading = React30.forwardRef(
 Heading.displayName = "Heading";
 
 // source/components/primitive/InputGroup/input-group.tsx
-import * as React31 from "react";
-import { jsx as jsx34 } from "react/jsx-runtime";
-var InputGroup = React31.forwardRef(
-  ({ className, error, children, ...props }, ref) => /* @__PURE__ */ jsx34(
+import * as React32 from "react";
+import { jsx as jsx35 } from "react/jsx-runtime";
+var InputGroup = React32.forwardRef(
+  ({ className, error, children, ...props }, ref) => /* @__PURE__ */ jsx35(
     "div",
     {
       ref,
@@ -3363,7 +3561,7 @@ var InputGroup = React31.forwardRef(
   )
 );
 InputGroup.displayName = "InputGroup";
-var InputGroupIcon = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
+var InputGroupIcon = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
   "span",
   {
     ref,
@@ -3376,8 +3574,8 @@ var InputGroupIcon = React31.forwardRef(({ className, ...props }, ref) => /* @__
   }
 ));
 InputGroupIcon.displayName = "InputGroupIcon";
-var InputGroupInput = React31.forwardRef(
-  ({ className, type, ...props }, ref) => /* @__PURE__ */ jsx34(
+var InputGroupInput = React32.forwardRef(
+  ({ className, type, ...props }, ref) => /* @__PURE__ */ jsx35(
     "input",
     {
       ref,
@@ -3396,10 +3594,10 @@ InputGroupInput.displayName = "InputGroupInput";
 var inputGroupSelectTriggerTextAlignClass = "pl-12";
 
 // source/components/primitive/Pagination/pagination.tsx
-import * as React32 from "react";
+import * as React33 from "react";
 import { ChevronLeft, ChevronRight as ChevronRight2, MoreHorizontal } from "lucide-react";
-import { jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
-var Pagination = ({ className, ...props }) => /* @__PURE__ */ jsx35(
+import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
+var Pagination = ({ className, ...props }) => /* @__PURE__ */ jsx36(
   "nav",
   {
     role: "navigation",
@@ -3409,7 +3607,7 @@ var Pagination = ({ className, ...props }) => /* @__PURE__ */ jsx35(
   }
 );
 Pagination.displayName = "Pagination";
-var PaginationContent = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
+var PaginationContent = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
   "ul",
   {
     ref,
@@ -3418,14 +3616,14 @@ var PaginationContent = React32.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 PaginationContent.displayName = "PaginationContent";
-var PaginationItem = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35("li", { ref, className: cn("", className), ...props }));
+var PaginationItem = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36("li", { ref, className: cn("", className), ...props }));
 PaginationItem.displayName = "PaginationItem";
 var PaginationLink = ({
   className,
   isActive,
   size = "icon",
   ...props
-}) => /* @__PURE__ */ jsx35(
+}) => /* @__PURE__ */ jsx36(
   "a",
   {
     "aria-current": isActive ? "page" : void 0,
@@ -3443,7 +3641,7 @@ PaginationLink.displayName = "PaginationLink";
 var PaginationPrevious = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsxs21(
+}) => /* @__PURE__ */ jsxs22(
   PaginationLink,
   {
     "aria-label": "Go to previous page",
@@ -3451,8 +3649,8 @@ var PaginationPrevious = ({
     size: "default",
     ...props,
     children: [
-      /* @__PURE__ */ jsx35(ChevronLeft, { className: "h-4 w-4" }),
-      /* @__PURE__ */ jsx35("span", { children: "Previous" })
+      /* @__PURE__ */ jsx36(ChevronLeft, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsx36("span", { children: "Previous" })
     ]
   }
 );
@@ -3460,7 +3658,7 @@ PaginationPrevious.displayName = "PaginationPrevious";
 var PaginationNext = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsxs21(
+}) => /* @__PURE__ */ jsxs22(
   PaginationLink,
   {
     "aria-label": "Go to next page",
@@ -3468,8 +3666,8 @@ var PaginationNext = ({
     size: "default",
     ...props,
     children: [
-      /* @__PURE__ */ jsx35("span", { children: "Next" }),
-      /* @__PURE__ */ jsx35(ChevronRight2, { className: "h-4 w-4" })
+      /* @__PURE__ */ jsx36("span", { children: "Next" }),
+      /* @__PURE__ */ jsx36(ChevronRight2, { className: "h-4 w-4" })
     ]
   }
 );
@@ -3477,31 +3675,31 @@ PaginationNext.displayName = "PaginationNext";
 var PaginationEllipsis = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsxs21(
+}) => /* @__PURE__ */ jsxs22(
   "span",
   {
     "aria-hidden": true,
     className: cn("flex h-9 w-9 items-center justify-center", className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx35(MoreHorizontal, { className: "h-4 w-4" }),
-      /* @__PURE__ */ jsx35("span", { className: "sr-only", children: "More pages" })
+      /* @__PURE__ */ jsx36(MoreHorizontal, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsx36("span", { className: "sr-only", children: "More pages" })
     ]
   }
 );
 PaginationEllipsis.displayName = "PaginationEllipsis";
 
 // source/components/primitive/Progress/progress.tsx
-import * as React33 from "react";
+import * as React34 from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs23 } from "react/jsx-runtime";
 var variantStyles = {
   default: "bg-primary",
   success: "bg-green-500",
   warning: "bg-yellow-500",
   error: "bg-red-500"
 };
-var Progress = React33.forwardRef(
+var Progress = React34.forwardRef(
   ({
     className,
     value = 0,
@@ -3515,15 +3713,15 @@ var Progress = React33.forwardRef(
     const safeMax = max > 0 ? max : 100;
     const safeValue = Math.min(Math.max(value, 0), safeMax);
     const percentage = Math.min(safeValue / safeMax * 100, 100);
-    return /* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-1", children: [
-      (label || showValue) && /* @__PURE__ */ jsxs22("div", { className: "flex items-center justify-between", children: [
-        label && /* @__PURE__ */ jsx36("span", { className: "text-sm font-medium", children: label }),
-        showValue && !indeterminate && /* @__PURE__ */ jsxs22("span", { className: "text-xs text-muted-foreground", children: [
+    return /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-1", children: [
+      (label || showValue) && /* @__PURE__ */ jsxs23("div", { className: "flex items-center justify-between", children: [
+        label && /* @__PURE__ */ jsx37("span", { className: "text-sm font-medium", children: label }),
+        showValue && !indeterminate && /* @__PURE__ */ jsxs23("span", { className: "text-xs text-muted-foreground", children: [
           Math.round(percentage),
           "%"
         ] })
       ] }),
-      /* @__PURE__ */ jsx36(
+      /* @__PURE__ */ jsx37(
         ProgressPrimitive.Root,
         {
           ref,
@@ -3536,7 +3734,7 @@ var Progress = React33.forwardRef(
           "aria-valuemax": safeMax,
           "aria-valuenow": indeterminate ? void 0 : safeValue,
           ...props,
-          children: /* @__PURE__ */ jsx36(
+          children: /* @__PURE__ */ jsx37(
             ProgressPrimitive.Indicator,
             {
               className: cn(
@@ -3557,9 +3755,9 @@ var Progress = React33.forwardRef(
 Progress.displayName = "Progress";
 
 // source/components/primitive/RichHtml/rich-html.tsx
-import * as React34 from "react";
+import * as React35 from "react";
 import DOMPurify from "dompurify";
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { jsx as jsx38 } from "react/jsx-runtime";
 var defaultSanitizeConfig = {
   USE_PROFILES: { html: true }
 };
@@ -3582,7 +3780,7 @@ var richHtmlChrome = cn(
   "[&_code]:rounded [&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:text-[0.9em]",
   "[&_pre]:my-4 [&_pre]:overflow-x-auto [&_pre]:rounded-md [&_pre]:bg-muted [&_pre]:p-3 [&_pre]:font-mono [&_pre]:text-sm"
 );
-var RichHtml = React34.forwardRef(
+var RichHtml = React35.forwardRef(
   ({
     html,
     sanitize = true,
@@ -3591,7 +3789,7 @@ var RichHtml = React34.forwardRef(
     suppressHydrationWarning,
     ...props
   }, ref) => {
-    const markup = React34.useMemo(() => {
+    const markup = React35.useMemo(() => {
       if (html === void 0 || html === null || html === "") {
         return "";
       }
@@ -3611,7 +3809,7 @@ var RichHtml = React34.forwardRef(
     if (html === void 0 || html === null || html === "") {
       return null;
     }
-    return /* @__PURE__ */ jsx37(
+    return /* @__PURE__ */ jsx38(
       "div",
       {
         ref,
@@ -3626,24 +3824,24 @@ var RichHtml = React34.forwardRef(
 RichHtml.displayName = "RichHtml";
 
 // source/components/primitive/ScrollArea/scroll-area.tsx
-import * as React35 from "react";
+import * as React36 from "react";
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { jsx as jsx38, jsxs as jsxs23 } from "react/jsx-runtime";
-var ScrollArea = React35.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs23(
+import { jsx as jsx39, jsxs as jsxs24 } from "react/jsx-runtime";
+var ScrollArea = React36.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs24(
   ScrollAreaPrimitive.Root,
   {
     ref,
     className: cn("relative overflow-hidden", className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx38(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
-      /* @__PURE__ */ jsx38(ScrollBar, {}),
-      /* @__PURE__ */ jsx38(ScrollAreaPrimitive.Corner, {})
+      /* @__PURE__ */ jsx39(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
+      /* @__PURE__ */ jsx39(ScrollBar, {}),
+      /* @__PURE__ */ jsx39(ScrollAreaPrimitive.Corner, {})
     ]
   }
 ));
 ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollBar = React35.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx38(
+var ScrollBar = React36.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx39(
   ScrollAreaPrimitive.ScrollAreaScrollbar,
   {
     ref,
@@ -3655,16 +3853,16 @@ var ScrollBar = React35.forwardRef(({ className, orientation = "vertical", ...pr
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx38(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
+    children: /* @__PURE__ */ jsx39(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
   }
 ));
 ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 
 // source/components/primitive/Separator/separator.tsx
-import * as React36 from "react";
+import * as React37 from "react";
 import * as SeparatorPrimitive from "@radix-ui/react-separator";
 import { cva as cva12 } from "class-variance-authority";
-import { jsx as jsx39, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs25 } from "react/jsx-runtime";
 var separatorVariants = cva12("shrink-0", {
   variants: {
     orientation: {
@@ -3682,7 +3880,7 @@ var separatorVariants = cva12("shrink-0", {
     line: "solid"
   }
 });
-var Separator3 = React36.forwardRef(
+var Separator3 = React37.forwardRef(
   ({
     className,
     orientation = "horizontal",
@@ -3694,13 +3892,13 @@ var Separator3 = React36.forwardRef(
   }, ref) => {
     const line = lineProp ?? variant ?? "solid";
     if (label && orientation === "horizontal") {
-      return /* @__PURE__ */ jsxs24(
+      return /* @__PURE__ */ jsxs25(
         "div",
         {
           role: "separator",
           className: "flex items-center gap-3",
           children: [
-            /* @__PURE__ */ jsx39(
+            /* @__PURE__ */ jsx40(
               "div",
               {
                 className: cn(
@@ -3709,8 +3907,8 @@ var Separator3 = React36.forwardRef(
                 )
               }
             ),
-            /* @__PURE__ */ jsx39("span", { className: "text-xs text-muted-foreground whitespace-nowrap", children: label }),
-            /* @__PURE__ */ jsx39(
+            /* @__PURE__ */ jsx40("span", { className: "text-xs text-muted-foreground whitespace-nowrap", children: label }),
+            /* @__PURE__ */ jsx40(
               "div",
               {
                 className: cn(
@@ -3723,7 +3921,7 @@ var Separator3 = React36.forwardRef(
         }
       );
     }
-    return /* @__PURE__ */ jsx39(
+    return /* @__PURE__ */ jsx40(
       SeparatorPrimitive.Root,
       {
         ref,
@@ -3741,16 +3939,16 @@ var Separator3 = React36.forwardRef(
 Separator3.displayName = "Separator";
 
 // source/components/primitive/Sheet/sheet.tsx
-import * as React37 from "react";
+import * as React38 from "react";
 import * as SheetPrimitive from "@radix-ui/react-dialog";
 import { cva as cva13 } from "class-variance-authority";
 import { X as X2 } from "lucide-react";
-import { jsx as jsx40, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs26 } from "react/jsx-runtime";
 var Sheet = SheetPrimitive.Root;
 var SheetTrigger = SheetPrimitive.Trigger;
 var SheetClose = SheetPrimitive.Close;
 var SheetPortal = SheetPrimitive.Portal;
-var SheetOverlay = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var SheetOverlay = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
   SheetPrimitive.Overlay,
   {
     className: cn(
@@ -3778,9 +3976,9 @@ var sheetVariants = cva13(
     }
   }
 );
-var SheetContent = React37.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs25(SheetPortal, { children: [
-  /* @__PURE__ */ jsx40(SheetOverlay, {}),
-  /* @__PURE__ */ jsxs25(
+var SheetContent = React38.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs26(SheetPortal, { children: [
+  /* @__PURE__ */ jsx41(SheetOverlay, {}),
+  /* @__PURE__ */ jsxs26(
     SheetPrimitive.Content,
     {
       ref,
@@ -3788,9 +3986,9 @@ var SheetContent = React37.forwardRef(({ side = "right", className, children, ..
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsxs25(SheetPrimitive.Close, { className: "absolute right-4 top-4 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-[state=open]:bg-secondary", children: [
-          /* @__PURE__ */ jsx40(X2, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsx40("span", { className: "sr-only", children: "Close" })
+        /* @__PURE__ */ jsxs26(SheetPrimitive.Close, { className: "absolute right-4 top-4 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-[state=open]:bg-secondary", children: [
+          /* @__PURE__ */ jsx41(X2, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx41("span", { className: "sr-only", children: "Close" })
         ] })
       ]
     }
@@ -3800,7 +3998,7 @@ SheetContent.displayName = SheetPrimitive.Content.displayName;
 var SheetHeader = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx40(
+}) => /* @__PURE__ */ jsx41(
   "div",
   {
     className: cn(
@@ -3814,7 +4012,7 @@ SheetHeader.displayName = "SheetHeader";
 var SheetFooter = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx40(
+}) => /* @__PURE__ */ jsx41(
   "div",
   {
     className: cn(
@@ -3825,7 +4023,7 @@ var SheetFooter = ({
   }
 );
 SheetFooter.displayName = "SheetFooter";
-var SheetTitle = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var SheetTitle = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
   SheetPrimitive.Title,
   {
     ref,
@@ -3834,7 +4032,7 @@ var SheetTitle = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 SheetTitle.displayName = SheetPrimitive.Title.displayName;
-var SheetDescription = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var SheetDescription = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
   SheetPrimitive.Description,
   {
     ref,
@@ -3845,19 +4043,19 @@ var SheetDescription = React37.forwardRef(({ className, ...props }, ref) => /* @
 SheetDescription.displayName = SheetPrimitive.Description.displayName;
 
 // source/components/primitive/Sidebar/sidebar.tsx
-import * as React41 from "react";
+import * as React42 from "react";
 import { Slot as Slot3 } from "@radix-ui/react-slot";
 import { cva as cva15 } from "class-variance-authority";
 import { PanelLeft } from "lucide-react";
 
 // source/hooks/use-mobile.ts
-import * as React38 from "react";
+import * as React39 from "react";
 var MOBILE_MAX = 768;
 function useIsMobile(breakpoint = MOBILE_MAX) {
-  const [isMobile, setIsMobile] = React38.useState(
+  const [isMobile, setIsMobile] = React39.useState(
     () => typeof window !== "undefined" ? window.innerWidth < breakpoint : false
   );
-  React38.useEffect(() => {
+  React39.useEffect(() => {
     const mq = window.matchMedia(`(max-width: ${breakpoint - 1}px)`);
     const onChange = () => setIsMobile(mq.matches);
     onChange();
@@ -3868,9 +4066,9 @@ function useIsMobile(breakpoint = MOBILE_MAX) {
 }
 
 // source/components/primitive/Skeleton/skeleton.tsx
-import * as React39 from "react";
+import * as React40 from "react";
 import { cva as cva14 } from "class-variance-authority";
-import { jsx as jsx41 } from "react/jsx-runtime";
+import { jsx as jsx42 } from "react/jsx-runtime";
 var skeletonVariants = cva14(
   "animate-pulse bg-muted",
   {
@@ -3887,9 +4085,9 @@ var skeletonVariants = cva14(
     }
   }
 );
-var Skeleton = React39.forwardRef(
+var Skeleton = React40.forwardRef(
   ({ className, rounded, ...props }, ref) => {
-    return /* @__PURE__ */ jsx41(
+    return /* @__PURE__ */ jsx42(
       "div",
       {
         ref,
@@ -3904,18 +4102,18 @@ var Skeleton = React39.forwardRef(
 Skeleton.displayName = "Skeleton";
 
 // source/components/primitive/ToolTip/tooltip.tsx
-import * as React40 from "react";
+import * as React41 from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { jsx as jsx42, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs27 } from "react/jsx-runtime";
 var TooltipProvider = TooltipPrimitive.Provider;
 var Tooltip = ({ ...props }) => {
-  return /* @__PURE__ */ jsx42(TooltipPrimitive.Root, { ...props });
+  return /* @__PURE__ */ jsx43(TooltipPrimitive.Root, { ...props });
 };
 Tooltip.displayName = "Tooltip";
 var TooltipTrigger = TooltipPrimitive.Trigger;
 TooltipTrigger.displayName = "TooltipTrigger";
-var TooltipContent = React40.forwardRef(({ className, sideOffset = 4, arrow = false, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx42(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs26(
+var TooltipContent = React41.forwardRef(({ className, sideOffset = 4, arrow = false, children, ...props }, ref) => {
+  return /* @__PURE__ */ jsx43(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs27(
     TooltipPrimitive.Content,
     {
       ref,
@@ -3933,7 +4131,7 @@ var TooltipContent = React40.forwardRef(({ className, sideOffset = 4, arrow = fa
       ...props,
       children: [
         children,
-        arrow && /* @__PURE__ */ jsx42(TooltipPrimitive.Arrow, { className: "fill-popover" })
+        arrow && /* @__PURE__ */ jsx43(TooltipPrimitive.Arrow, { className: "fill-popover" })
       ]
     }
   ) });
@@ -3941,22 +4139,22 @@ var TooltipContent = React40.forwardRef(({ className, sideOffset = 4, arrow = fa
 TooltipContent.displayName = "TooltipContent";
 
 // source/components/primitive/Sidebar/sidebar.tsx
-import { jsx as jsx43, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs28 } from "react/jsx-runtime";
 var SIDEBAR_COOKIE_NAME = "sidebar:state";
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 var SIDEBAR_WIDTH = "16rem";
 var SIDEBAR_WIDTH_MOBILE = "18rem";
 var SIDEBAR_WIDTH_ICON = "4rem";
 var SIDEBAR_KEYBOARD_SHORTCUT = "b";
-var SidebarContext = React41.createContext(null);
+var SidebarContext = React42.createContext(null);
 function useSidebar() {
-  const context = React41.useContext(SidebarContext);
+  const context = React42.useContext(SidebarContext);
   if (!context) {
     throw new Error("useSidebar must be used within a SidebarProvider.");
   }
   return context;
 }
-var SidebarProvider = React41.forwardRef(
+var SidebarProvider = React42.forwardRef(
   ({
     defaultOpen = true,
     open: openProp,
@@ -3967,15 +4165,15 @@ var SidebarProvider = React41.forwardRef(
     ...props
   }, ref) => {
     const isMobile = useIsMobile();
-    const [openMobile, setOpenMobile] = React41.useState(false);
-    const [_open, _setOpen] = React41.useState(() => {
+    const [openMobile, setOpenMobile] = React42.useState(false);
+    const [_open, _setOpen] = React42.useState(() => {
       if (typeof window === "undefined") return defaultOpen;
       const cookie = document.cookie.split("; ").find((row) => row.startsWith(`${SIDEBAR_COOKIE_NAME}=`));
       if (!cookie) return defaultOpen;
       return cookie.split("=")[1] === "true";
     });
     const open = openProp ?? _open;
-    const setOpen = React41.useCallback(
+    const setOpen = React42.useCallback(
       (value) => {
         const openState = typeof value === "function" ? value(open) : value;
         if (setOpenProp) {
@@ -3987,21 +4185,21 @@ var SidebarProvider = React41.forwardRef(
       },
       [setOpenProp, open]
     );
-    const toggleSidebar = React41.useCallback(() => {
+    const toggleSidebar = React42.useCallback(() => {
       if (isMobile) {
         setOpenMobile((v) => !v);
       } else {
         setOpen((v) => !v);
       }
     }, [isMobile, setOpen, setOpenMobile]);
-    React41.useEffect(() => {
+    React42.useEffect(() => {
       const cookie = document.cookie.split("; ").find((row) => row.startsWith(`${SIDEBAR_COOKIE_NAME}=`));
       if (cookie) {
         const value = cookie.split("=")[1];
         _setOpen(value === "true");
       }
     }, []);
-    React41.useEffect(() => {
+    React42.useEffect(() => {
       const handleKeyDown = (event) => {
         if (event.key === "Escape") {
           setOpenMobile(false);
@@ -4015,7 +4213,7 @@ var SidebarProvider = React41.forwardRef(
       return () => window.removeEventListener("keydown", handleKeyDown);
     }, [toggleSidebar]);
     const state = open ? "expanded" : "collapsed";
-    const contextValue = React41.useMemo(
+    const contextValue = React42.useMemo(
       () => ({
         state,
         open,
@@ -4027,7 +4225,7 @@ var SidebarProvider = React41.forwardRef(
       }),
       [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
     );
-    return /* @__PURE__ */ jsx43(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx43(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx43(
+    return /* @__PURE__ */ jsx44(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx44(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx44(
       "div",
       {
         style: {
@@ -4047,7 +4245,7 @@ var SidebarProvider = React41.forwardRef(
   }
 );
 SidebarProvider.displayName = "SidebarProvider";
-var Sidebar = React41.forwardRef(
+var Sidebar = React42.forwardRef(
   ({
     side = "left",
     variant = "sidebar",
@@ -4058,7 +4256,7 @@ var Sidebar = React41.forwardRef(
   }, ref) => {
     const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
     if (collapsible === "none") {
-      return /* @__PURE__ */ jsx43(
+      return /* @__PURE__ */ jsx44(
         "div",
         {
           className: cn(
@@ -4074,7 +4272,7 @@ var Sidebar = React41.forwardRef(
       );
     }
     if (isMobile) {
-      return /* @__PURE__ */ jsx43(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsx43(
+      return /* @__PURE__ */ jsx44(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsx44(
         SheetContent,
         {
           "data-sidebar": "sidebar",
@@ -4084,11 +4282,11 @@ var Sidebar = React41.forwardRef(
             "--sidebar-width": SIDEBAR_WIDTH_MOBILE
           },
           side,
-          children: /* @__PURE__ */ jsx43("div", { className: "flex h-full w-full flex-col", children })
+          children: /* @__PURE__ */ jsx44("div", { className: "flex h-full w-full flex-col", children })
         }
       ) });
     }
-    return /* @__PURE__ */ jsxs27(
+    return /* @__PURE__ */ jsxs28(
       "div",
       {
         ref,
@@ -4098,7 +4296,7 @@ var Sidebar = React41.forwardRef(
         "data-variant": variant,
         "data-side": side,
         children: [
-          /* @__PURE__ */ jsx43(
+          /* @__PURE__ */ jsx44(
             "div",
             {
               className: cn(
@@ -4109,7 +4307,7 @@ var Sidebar = React41.forwardRef(
               )
             }
           ),
-          /* @__PURE__ */ jsx43(
+          /* @__PURE__ */ jsx44(
             "div",
             {
               className: cn(
@@ -4120,7 +4318,7 @@ var Sidebar = React41.forwardRef(
                 className
               ),
               ...props,
-              children: /* @__PURE__ */ jsx43(
+              children: /* @__PURE__ */ jsx44(
                 "div",
                 {
                   "data-sidebar": "sidebar",
@@ -4144,9 +4342,9 @@ var Sidebar = React41.forwardRef(
   }
 );
 Sidebar.displayName = "Sidebar";
-var SidebarTrigger = React41.forwardRef(({ className, onClick, ...props }, ref) => {
+var SidebarTrigger = React42.forwardRef(({ className, onClick, ...props }, ref) => {
   const { toggleSidebar } = useSidebar();
-  return /* @__PURE__ */ jsxs27(
+  return /* @__PURE__ */ jsxs28(
     Button,
     {
       ref,
@@ -4160,16 +4358,16 @@ var SidebarTrigger = React41.forwardRef(({ className, onClick, ...props }, ref)
       },
       ...props,
       children: [
-        /* @__PURE__ */ jsx43(PanelLeft, {}),
-        /* @__PURE__ */ jsx43("span", { className: "sr-only", children: "Toggle Sidebar" })
+        /* @__PURE__ */ jsx44(PanelLeft, {}),
+        /* @__PURE__ */ jsx44("span", { className: "sr-only", children: "Toggle Sidebar" })
       ]
     }
   );
 });
 SidebarTrigger.displayName = "SidebarTrigger";
-var SidebarRail = React41.forwardRef(({ className, ...props }, ref) => {
+var SidebarRail = React42.forwardRef(({ className, ...props }, ref) => {
   const { toggleSidebar } = useSidebar();
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx44(
     "button",
     {
       ref,
@@ -4192,8 +4390,8 @@ var SidebarRail = React41.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarRail.displayName = "SidebarRail";
-var SidebarInset = React41.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx43(
+var SidebarInset = React42.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx44(
     "main",
     {
       ref,
@@ -4207,8 +4405,8 @@ var SidebarInset = React41.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarInset.displayName = "SidebarInset";
-var SidebarInput = React41.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx43(
+var SidebarInput = React42.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx44(
     Input,
     {
       ref,
@@ -4222,8 +4420,8 @@ var SidebarInput = React41.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarInput.displayName = "SidebarInput";
-var SidebarHeader = React41.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx43(
+var SidebarHeader = React42.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx44(
     "div",
     {
       ref,
@@ -4234,8 +4432,8 @@ var SidebarHeader = React41.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarHeader.displayName = "SidebarHeader";
-var SidebarFooter = React41.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx43(
+var SidebarFooter = React42.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx44(
     "div",
     {
       ref,
@@ -4246,8 +4444,8 @@ var SidebarFooter = React41.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarFooter.displayName = "SidebarFooter";
-var SidebarSeparator = React41.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx43(
+var SidebarSeparator = React42.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx44(
     Separator3,
     {
       ref,
@@ -4258,8 +4456,8 @@ var SidebarSeparator = React41.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarSeparator.displayName = "SidebarSeparator";
-var SidebarContent = React41.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx43(
+var SidebarContent = React42.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx44(
     "div",
     {
       ref,
@@ -4273,8 +4471,8 @@ var SidebarContent = React41.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarContent.displayName = "SidebarContent";
-var SidebarGroup = React41.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx43(
+var SidebarGroup = React42.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx44(
     "div",
     {
       ref,
@@ -4285,10 +4483,10 @@ var SidebarGroup = React41.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarGroup.displayName = "SidebarGroup";
-var SidebarGroupLabel = React41.forwardRef(({ className, asChild = false, showLabel = true, ...props }, ref) => {
+var SidebarGroupLabel = React42.forwardRef(({ className, asChild = false, showLabel = true, ...props }, ref) => {
   if (!showLabel) return null;
   const Comp = asChild ? Slot3 : "div";
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx44(
     Comp,
     {
       ref,
@@ -4303,9 +4501,9 @@ var SidebarGroupLabel = React41.forwardRef(({ className, asChild = false, showLa
   );
 });
 SidebarGroupLabel.displayName = "SidebarGroupLabel";
-var SidebarGroupAction = React41.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarGroupAction = React42.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? Slot3 : "button";
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx44(
     Comp,
     {
       ref,
@@ -4322,7 +4520,7 @@ var SidebarGroupAction = React41.forwardRef(({ className, asChild = false, ...pr
   );
 });
 SidebarGroupAction.displayName = "SidebarGroupAction";
-var SidebarGroupContent = React41.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx43(
+var SidebarGroupContent = React42.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx44(
   "div",
   {
     ref,
@@ -4332,7 +4530,7 @@ var SidebarGroupContent = React41.forwardRef(({ className, ...props }, ref) => /
   }
 ));
 SidebarGroupContent.displayName = "SidebarGroupContent";
-var SidebarMenu = React41.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx43(
+var SidebarMenu = React42.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx44(
   "ul",
   {
     ref,
@@ -4342,7 +4540,7 @@ var SidebarMenu = React41.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SidebarMenu.displayName = "SidebarMenu";
-var SidebarMenuItem = React41.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx43(
+var SidebarMenuItem = React42.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx44(
   "li",
   {
     ref,
@@ -4372,7 +4570,7 @@ var sidebarMenuButtonVariants = cva15(
     }
   }
 );
-var SidebarMenuButton = React41.forwardRef(
+var SidebarMenuButton = React42.forwardRef(
   ({
     asChild = false,
     isActive = false,
@@ -4384,7 +4582,7 @@ var SidebarMenuButton = React41.forwardRef(
   }, ref) => {
     const Comp = asChild ? Slot3 : "button";
     const { isMobile, state } = useSidebar();
-    const button = /* @__PURE__ */ jsx43(
+    const button = /* @__PURE__ */ jsx44(
       Comp,
       {
         ref,
@@ -4403,9 +4601,9 @@ var SidebarMenuButton = React41.forwardRef(
         children: tooltip
       };
     }
-    return /* @__PURE__ */ jsxs27(Tooltip, { children: [
-      /* @__PURE__ */ jsx43(TooltipTrigger, { asChild: true, children: button }),
-      /* @__PURE__ */ jsx43(
+    return /* @__PURE__ */ jsxs28(Tooltip, { children: [
+      /* @__PURE__ */ jsx44(TooltipTrigger, { asChild: true, children: button }),
+      /* @__PURE__ */ jsx44(
         TooltipContent,
         {
           side: "right",
@@ -4418,9 +4616,9 @@ var SidebarMenuButton = React41.forwardRef(
   }
 );
 SidebarMenuButton.displayName = "SidebarMenuButton";
-var SidebarMenuAction = React41.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
+var SidebarMenuAction = React42.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
   const Comp = asChild ? Slot3 : "button";
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx44(
     Comp,
     {
       ref,
@@ -4441,7 +4639,7 @@ var SidebarMenuAction = React41.forwardRef(({ className, asChild = false, showOn
   );
 });
 SidebarMenuAction.displayName = "SidebarMenuAction";
-var SidebarMenuBadge = React41.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx43(
+var SidebarMenuBadge = React42.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx44(
   "div",
   {
     ref,
@@ -4459,11 +4657,11 @@ var SidebarMenuBadge = React41.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 SidebarMenuBadge.displayName = "SidebarMenuBadge";
-var SidebarMenuSkeleton = React41.forwardRef(({ className, showIcon = false, ...props }, ref) => {
-  const width = React41.useMemo(() => {
+var SidebarMenuSkeleton = React42.forwardRef(({ className, showIcon = false, ...props }, ref) => {
+  const width = React42.useMemo(() => {
     return `${Math.floor(Math.random() * 40) + 50}%`;
   }, []);
-  return /* @__PURE__ */ jsxs27(
+  return /* @__PURE__ */ jsxs28(
     "div",
     {
       ref,
@@ -4471,14 +4669,14 @@ var SidebarMenuSkeleton = React41.forwardRef(({ className, showIcon = false, ...
       className: cn("rounded-md h-8 flex gap-2 px-2 items-center", className),
       ...props,
       children: [
-        showIcon && /* @__PURE__ */ jsx43(
+        showIcon && /* @__PURE__ */ jsx44(
           Skeleton,
           {
             className: "size-4 rounded-md",
             "data-sidebar": "menu-skeleton-icon"
           }
         ),
-        /* @__PURE__ */ jsx43(
+        /* @__PURE__ */ jsx44(
           Skeleton,
           {
             className: "h-4 flex-1 max-w-[--skeleton-width]",
@@ -4493,7 +4691,7 @@ var SidebarMenuSkeleton = React41.forwardRef(({ className, showIcon = false, ...
   );
 });
 SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
-var SidebarMenuSub = React41.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx43(
+var SidebarMenuSub = React42.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx44(
   "ul",
   {
     ref,
@@ -4507,11 +4705,11 @@ var SidebarMenuSub = React41.forwardRef(({ className, ...props }, ref) => /* @__
   }
 ));
 SidebarMenuSub.displayName = "SidebarMenuSub";
-var SidebarMenuSubItem = React41.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx43("li", { ref, ...props }));
+var SidebarMenuSubItem = React42.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx44("li", { ref, ...props }));
 SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
-var SidebarMenuSubButton = React41.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
+var SidebarMenuSubButton = React42.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
   const Comp = asChild ? Slot3 : "a";
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx44(
     Comp,
     {
       ref,
@@ -4533,10 +4731,10 @@ var SidebarMenuSubButton = React41.forwardRef(({ asChild = false, size = "md", i
 SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
 
 // source/components/primitive/Slider/slider.tsx
-import * as React42 from "react";
+import * as React43 from "react";
 import * as SliderPrimitive from "@radix-ui/react-slider";
-import { jsx as jsx44, jsxs as jsxs28 } from "react/jsx-runtime";
-var Slider = React42.forwardRef(
+import { jsx as jsx45, jsxs as jsxs29 } from "react/jsx-runtime";
+var Slider = React43.forwardRef(
   ({
     className,
     label,
@@ -4547,16 +4745,16 @@ var Slider = React42.forwardRef(
     value,
     ...props
   }, ref) => {
-    const [internalValue, setInternalValue] = React42.useState(
+    const [internalValue, setInternalValue] = React43.useState(
       value || defaultValue || [0]
     );
     const currentValue = value ?? internalValue;
-    return /* @__PURE__ */ jsxs28("div", { className: "flex w-full flex-col gap-2", children: [
-      (label || showValue) && /* @__PURE__ */ jsxs28("div", { className: "flex items-center justify-between", children: [
-        label && /* @__PURE__ */ jsx44("label", { className: "text-sm font-medium", children: label }),
-        showValue && /* @__PURE__ */ jsx44("span", { className: "text-sm text-muted-foreground", children: currentValue?.[0] })
+    return /* @__PURE__ */ jsxs29("div", { className: "flex w-full flex-col gap-2", children: [
+      (label || showValue) && /* @__PURE__ */ jsxs29("div", { className: "flex items-center justify-between", children: [
+        label && /* @__PURE__ */ jsx45("label", { className: "text-sm font-medium", children: label }),
+        showValue && /* @__PURE__ */ jsx45("span", { className: "text-sm text-muted-foreground", children: currentValue?.[0] })
       ] }),
-      /* @__PURE__ */ jsxs28(
+      /* @__PURE__ */ jsxs29(
         SliderPrimitive.Root,
         {
           ref,
@@ -4572,8 +4770,8 @@ var Slider = React42.forwardRef(
           ),
           ...props,
           children: [
-            /* @__PURE__ */ jsx44(SliderPrimitive.Track, { className: "relative h-2 w-full grow overflow-hidden rounded-full bg-secondary", children: /* @__PURE__ */ jsx44(SliderPrimitive.Range, { className: "absolute h-full bg-primary" }) }),
-            /* @__PURE__ */ jsx44(
+            /* @__PURE__ */ jsx45(SliderPrimitive.Track, { className: "relative h-2 w-full grow overflow-hidden rounded-full bg-secondary", children: /* @__PURE__ */ jsx45(SliderPrimitive.Range, { className: "absolute h-full bg-primary" }) }),
+            /* @__PURE__ */ jsx45(
               SliderPrimitive.Thumb,
               {
                 className: cn(
@@ -4587,9 +4785,9 @@ var Slider = React42.forwardRef(
           ]
         }
       ),
-      (minLabel || maxLabel) && /* @__PURE__ */ jsxs28("div", { className: "flex justify-between text-xs text-muted-foreground", children: [
-        /* @__PURE__ */ jsx44("span", { children: minLabel }),
-        /* @__PURE__ */ jsx44("span", { children: maxLabel })
+      (minLabel || maxLabel) && /* @__PURE__ */ jsxs29("div", { className: "flex justify-between text-xs text-muted-foreground", children: [
+        /* @__PURE__ */ jsx45("span", { children: minLabel }),
+        /* @__PURE__ */ jsx45("span", { children: maxLabel })
       ] })
     ] });
   }
@@ -4597,9 +4795,9 @@ var Slider = React42.forwardRef(
 Slider.displayName = "Slider";
 
 // source/components/primitive/Table/table.tsx
-import * as React43 from "react";
-import { jsx as jsx45 } from "react/jsx-runtime";
-var Table = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx45(
+import * as React44 from "react";
+import { jsx as jsx46 } from "react/jsx-runtime";
+var Table = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx46(
   "table",
   {
     ref,
@@ -4608,9 +4806,9 @@ var Table = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
   }
 ) }));
 Table.displayName = "Table";
-var TableHeader = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
+var TableHeader = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
 TableHeader.displayName = "TableHeader";
-var TableBody = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+var TableBody = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46(
   "tbody",
   {
     ref,
@@ -4619,7 +4817,7 @@ var TableBody = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableBody.displayName = "TableBody";
-var TableFooter = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+var TableFooter = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46(
   "tfoot",
   {
     ref,
@@ -4631,7 +4829,7 @@ var TableFooter = React43.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TableFooter.displayName = "TableFooter";
-var TableRow = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+var TableRow = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46(
   "tr",
   {
     ref,
@@ -4643,7 +4841,7 @@ var TableRow = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TableRow.displayName = "TableRow";
-var TableHead = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+var TableHead = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46(
   "th",
   {
     ref,
@@ -4655,7 +4853,7 @@ var TableHead = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableHead.displayName = "TableHead";
-var TableCell = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+var TableCell = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46(
   "td",
   {
     ref,
@@ -4664,7 +4862,7 @@ var TableCell = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableCell.displayName = "TableCell";
-var TableCaption = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+var TableCaption = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46(
   "caption",
   {
     ref,
@@ -4675,11 +4873,11 @@ var TableCaption = React43.forwardRef(({ className, ...props }, ref) => /* @__PU
 TableCaption.displayName = "TableCaption";
 
 // source/components/primitive/Tabs/tabs.tsx
-import * as React44 from "react";
+import * as React45 from "react";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
-import { jsx as jsx46 } from "react/jsx-runtime";
+import { jsx as jsx47 } from "react/jsx-runtime";
 var Tabs = TabsPrimitive.Root;
-var TabsList = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46(
+var TabsList = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
   TabsPrimitive.List,
   {
     ref,
@@ -4691,7 +4889,7 @@ var TabsList = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TabsList.displayName = TabsPrimitive.List.displayName;
-var TabsTrigger = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46(
+var TabsTrigger = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
   TabsPrimitive.Trigger,
   {
     ref,
@@ -4703,7 +4901,7 @@ var TabsTrigger = React44.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React44.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx46(
+var TabsContent = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
   TabsPrimitive.Content,
   {
     ref,
@@ -4717,12 +4915,12 @@ var TabsContent = React44.forwardRef(({ className, ...props }, ref) => /* @__PUR
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 
 // source/components/primitive/Toast/toast.tsx
-import * as React45 from "react";
+import * as React46 from "react";
 import * as ToastPrimitive from "@radix-ui/react-toast";
 import { cva as cva16 } from "class-variance-authority";
-import { jsx as jsx47 } from "react/jsx-runtime";
+import { jsx as jsx48 } from "react/jsx-runtime";
 var ToastProvider = ToastPrimitive.Provider;
-var ToastViewport = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
+var ToastViewport = React46.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx48(
   ToastPrimitive.Viewport,
   {
     ref,
@@ -4781,7 +4979,7 @@ var toastVariants = cva16(
     }
   }
 );
-var Toast = React45.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx47(
+var Toast = React46.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx48(
   ToastPrimitive.Root,
   {
     ref,
@@ -4790,7 +4988,7 @@ var Toast = React45.forwardRef(({ className, variant, ...props }, ref) => /* @__
   }
 ));
 Toast.displayName = ToastPrimitive.Root.displayName;
-var ToastAction = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
+var ToastAction = React46.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx48(
   ToastPrimitive.Action,
   {
     ref,
@@ -4805,7 +5003,7 @@ var ToastAction = React45.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 ToastAction.displayName = ToastPrimitive.Action.displayName;
-var ToastClose = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
+var ToastClose = React46.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx48(
   ToastPrimitive.Close,
   {
     ref,
@@ -4819,7 +5017,7 @@ var ToastClose = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 ToastClose.displayName = ToastPrimitive.Close.displayName;
-var ToastTitle = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
+var ToastTitle = React46.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx48(
   ToastPrimitive.Title,
   {
     ref,
@@ -4828,7 +5026,7 @@ var ToastTitle = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 ToastTitle.displayName = ToastPrimitive.Title.displayName;
-var ToastDescription = React45.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
+var ToastDescription = React46.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx48(
   ToastPrimitive.Description,
   {
     ref,
@@ -4881,11 +5079,11 @@ function getToastSnapshot() {
 }
 
 // source/components/primitive/Toast/toaster.tsx
-import * as React46 from "react";
-import { jsx as jsx48, jsxs as jsxs29 } from "react/jsx-runtime";
+import * as React47 from "react";
+import { jsx as jsx49, jsxs as jsxs30 } from "react/jsx-runtime";
 function useToast() {
-  const [toasts, setToasts] = React46.useState(() => getToastSnapshot());
-  React46.useEffect(() => subscribeToasts((s) => setToasts([...s])), []);
+  const [toasts, setToasts] = React47.useState(() => getToastSnapshot());
+  React47.useEffect(() => subscribeToasts((s) => setToasts([...s])), []);
   return {
     toasts,
     toast,
@@ -4900,7 +5098,7 @@ function Toaster({
   ...providerProps
 }) {
   const { toasts } = useToast();
-  return /* @__PURE__ */ jsxs29(
+  return /* @__PURE__ */ jsxs30(
     ToastProvider,
     {
       duration,
@@ -4918,7 +5116,7 @@ function Toaster({
             action
           }) => {
             const v = variant ?? "default";
-            return /* @__PURE__ */ jsxs29(
+            return /* @__PURE__ */ jsxs30(
               Toast,
               {
                 variant,
@@ -4927,11 +5125,11 @@ function Toaster({
                   if (!open) dismissToast(id);
                 },
                 children: [
-                  /* @__PURE__ */ jsxs29("div", { className: "grid flex-1 gap-1 pl-1", children: [
-                    title ? /* @__PURE__ */ jsx48(ToastTitle, { children: title }) : null,
-                    description ? /* @__PURE__ */ jsx48(ToastDescription, { children: description }) : null
+                  /* @__PURE__ */ jsxs30("div", { className: "grid flex-1 gap-1 pl-1", children: [
+                    title ? /* @__PURE__ */ jsx49(ToastTitle, { children: title }) : null,
+                    description ? /* @__PURE__ */ jsx49(ToastDescription, { children: description }) : null
                   ] }),
-                  action ? /* @__PURE__ */ jsx48(
+                  action ? /* @__PURE__ */ jsx49(
                     ToastAction,
                     {
                       altText: action.altText,
@@ -4942,7 +5140,7 @@ function Toaster({
                       children: action.label
                     }
                   ) : null,
-                  /* @__PURE__ */ jsx48(ToastClose, { "aria-label": "Dismiss notification", children: /* @__PURE__ */ jsx48(
+                  /* @__PURE__ */ jsx49(ToastClose, { "aria-label": "Dismiss notification", children: /* @__PURE__ */ jsx49(
                     "span",
                     {
                       "aria-hidden": true,
@@ -4956,7 +5154,7 @@ function Toaster({
             );
           }
         ),
-        /* @__PURE__ */ jsx48(ToastViewport, { className: cn(viewportClassName) })
+        /* @__PURE__ */ jsx49(ToastViewport, { className: cn(viewportClassName) })
       ]
     }
   );
@@ -5076,6 +5274,7 @@ export {
   RichTextEditor,
   ScrollArea,
   ScrollBar,
+  SearchableSelect,
   Select,
   SelectContent,
   SelectGroup,