@snapcall/design-system 1.13.1 → 1.14.1

package/dist/index.mjs

@@ -51946,7 +51946,7 @@ var CommandItem = React6.forwardRef(
       __spreadProps(__spreadValues({
         ref,
         className: cn(
-          "px-2 py-1.5 text-sm flex flex-col gap-1 text-gray-1000 rounded-md cursor-pointer focus-within:bg-gray-100 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50 hover:bg-gray-50 active:bg-gray-100 data-[state=checked]:bg-gray-50",
+          "px-2 py-1.5 text-sm flex flex-col gap-1 text-gray-1000 rounded-md cursor-pointer focus-within:bg-gray-100 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50 hover:bg-gray-50 active:bg-gray-100 data-[state=checked]:bg-gray-50 data-[selected=true]:bg-gray-50",
           className
         )
       }, props), {
@@ -51967,10 +51967,141 @@ var CommandItem = React6.forwardRef(
 );
 CommandItem.displayName = CommandPrimitive.Item.displayName;
 
+// src/components/CreatableSelect/CreatableSelect.tsx
+import { useCallback, useRef, useState as useState2 } from "react";
+import { Command as CommandPrimitive2 } from "cmdk";
+import { jsx as jsx1232, jsxs as jsxs1011 } from "react/jsx-runtime";
+function CreatableSelect({
+  isLoading,
+  items,
+  multiple,
+  newLabel = "New: ",
+  nothingFoundLabel = "No matches found",
+  placeholder,
+  value,
+  valueKey,
+  onValueChanged,
+  getItemProps
+}) {
+  const inputRef = useRef(null);
+  const [open, setOpen] = useState2(false);
+  const [inputValue, setInputValue] = useState2("");
+  const handleUnselect = useCallback(
+    (selected) => {
+      onValueChanged(value.filter((s) => s !== selected));
+    },
+    [onValueChanged, value]
+  );
+  const handleKeyDown = useCallback(
+    (e) => {
+      const input = inputRef.current;
+      if (input) {
+        if (["Delete", "Backspace"].includes(e.key) && input.value === "") {
+          onValueChanged([...value.slice(0, -1)]);
+        }
+        if (e.key === "Escape") {
+          input.blur();
+        }
+      }
+    },
+    [onValueChanged, value]
+  );
+  const selectables = items.filter(
+    (it) => !value.includes(it[valueKey])
+  );
+  return /* @__PURE__ */ jsxs1011(
+    Command,
+    {
+      onKeyDown: handleKeyDown,
+      className: "overflow-visible bg-transparent",
+      children: [
+        /* @__PURE__ */ jsx1232("div", { className: "flex px-3 py-2 min-h-9 w-full rounded-md border border-gray-200 bg-transparent focus-within:outline focus-within:outline-[2px] focus-within:outline-blue-300 focus-within:outline-offset-[2px]", children: /* @__PURE__ */ jsxs1011("div", { className: "flex flex-wrap w-full gap-1", children: [
+          multiple && value.map((it) => /* @__PURE__ */ jsxs1011(Badge, { children: [
+            it,
+            /* @__PURE__ */ jsx1232(
+              "button",
+              {
+                className: "ml-1 rounded-full outline-none ring-offset-background focus:ring-2 focus:ring-ring focus:ring-offset-2",
+                onKeyDown: (e) => e.key === "Enter" && handleUnselect(it),
+                onMouseDown: (e) => {
+                  e.preventDefault();
+                  e.stopPropagation();
+                },
+                onClick: () => handleUnselect(it),
+                children: /* @__PURE__ */ jsx1232(XCloseIcon, { size: 12, className: "text-current" })
+              }
+            )
+          ] }, it)),
+          !multiple && value.map((it) => /* @__PURE__ */ jsx1232("span", { className: "text-sm", children: it }, it)),
+          /* @__PURE__ */ jsx1232(
+            CommandPrimitive2.Input,
+            {
+              ref: inputRef,
+              value: inputValue,
+              onValueChange: (v) => {
+                setInputValue(v);
+                !multiple && onValueChanged([]);
+              },
+              onBlur: () => setOpen(false),
+              onFocus: () => setOpen(true),
+              placeholder: multiple || value.length === 0 ? placeholder : "",
+              className: "flex-grow text-sm bg-transparent outline-none text-gray-1000 placeholder:text-gray-700"
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ jsx1232("div", { className: "relative", children: open && /* @__PURE__ */ jsx1232("div", { className: "absolute z-50 w-full bg-white border rounded-md shadow-md outline-none top-2 text-gray-1000 animate-in", children: isLoading ? /* @__PURE__ */ jsx1232(CommandLoading, {}) : selectables.length < 1 ? /* @__PURE__ */ jsx1232("span", { className: "flex flex-col gap-4 p-4 text-center text-gray-700", children: nothingFoundLabel }) : /* @__PURE__ */ jsxs1011(CommandList, { className: "h-full overflow-auto", children: [
+          selectables.map((it) => {
+            const itemProps = getItemProps(it);
+            return /* @__PURE__ */ jsx1232(
+              CommandItem,
+              __spreadValues({
+                onMouseDown: (e) => {
+                  e.preventDefault();
+                  e.stopPropagation();
+                },
+                onSelect: () => {
+                  setInputValue("");
+                  onValueChanged(
+                    multiple ? [...value, it[valueKey]] : [it[valueKey]]
+                  );
+                },
+                className: "cursor-pointer"
+              }, itemProps),
+              it[valueKey]
+            );
+          }),
+          inputValue && !value.includes(inputValue) && /* @__PURE__ */ jsx1232(
+            CommandItem,
+            {
+              value: inputValue,
+              onMouseDown: (e) => {
+                e.preventDefault();
+                e.stopPropagation();
+              },
+              onSelect: () => {
+                onValueChanged(
+                  multiple ? [
+                    ...value,
+                    ...inputValue.split(",").map((it) => it.trim())
+                  ] : [inputValue]
+                );
+                setInputValue("");
+              },
+              className: "cursor-pointer",
+              children: `${newLabel}${inputValue}`
+            },
+            "new-item"
+          )
+        ] }) }) })
+      ]
+    }
+  );
+}
+
 // src/components/Dialog/Dialog.tsx
-import * as React7 from "react";
+import * as React8 from "react";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { jsx as jsx1232, jsxs as jsxs1011 } from "react/jsx-runtime";
+import { jsx as jsx1233, jsxs as jsxs1012 } from "react/jsx-runtime";
 var Dialog = DialogPrimitive.Root;
 var DialogTrigger = DialogPrimitive.Trigger;
 var DialogPortal = (_a) => {
@@ -51979,12 +52110,12 @@ var DialogPortal = (_a) => {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ jsx1232(DialogPrimitive.Portal, __spreadValues({ className: cn(className) }, props));
+  return /* @__PURE__ */ jsx1233(DialogPrimitive.Portal, __spreadValues({ className: cn(className) }, props));
 };
 DialogPortal.displayName = DialogPrimitive.Portal.displayName;
-var DialogOverlay = React7.forwardRef((_a, ref) => {
+var DialogOverlay = React8.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1232(
+  return /* @__PURE__ */ jsx1233(
     DialogPrimitive.Overlay,
     __spreadValues({
       ref,
@@ -51996,11 +52127,11 @@ var DialogOverlay = React7.forwardRef((_a, ref) => {
   );
 });
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-var DialogContent = React7.forwardRef((_a, ref) => {
+var DialogContent = React8.forwardRef((_a, ref) => {
   var _b = _a, { className, children, bottomSheet = false } = _b, props = __objRest(_b, ["className", "children", "bottomSheet"]);
-  return /* @__PURE__ */ jsxs1011(DialogPortal, { children: [
-    /* @__PURE__ */ jsx1232(DialogOverlay, {}),
-    /* @__PURE__ */ jsxs1011(
+  return /* @__PURE__ */ jsxs1012(DialogPortal, { children: [
+    /* @__PURE__ */ jsx1233(DialogOverlay, {}),
+    /* @__PURE__ */ jsxs1012(
       DialogPrimitive.Content,
       __spreadProps(__spreadValues({
         ref,
@@ -52017,7 +52148,7 @@ var DialogContent = React7.forwardRef((_a, ref) => {
       }, props), {
         children: [
           children,
-          /* @__PURE__ */ jsxs1011(
+          /* @__PURE__ */ jsxs1012(
             DialogPrimitive.Close,
             {
               className: cn(
@@ -52026,8 +52157,8 @@ var DialogContent = React7.forwardRef((_a, ref) => {
                 "absolute right-6 top-6"
               ),
               children: [
-                /* @__PURE__ */ jsx1232(XCloseIcon, { className: "w-3 h-3" }),
-                /* @__PURE__ */ jsx1232("span", { className: "sr-only", children: "Close" })
+                /* @__PURE__ */ jsx1233(XCloseIcon, { className: "w-3 h-3" }),
+                /* @__PURE__ */ jsx1233("span", { className: "sr-only", children: "Close" })
               ]
             }
           )
@@ -52043,7 +52174,7 @@ var DialogHeader = (_a) => {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ jsx1232(
+  return /* @__PURE__ */ jsx1233(
     "div",
     __spreadValues({
       className: cn(
@@ -52060,7 +52191,7 @@ var DialogFooter = (_a) => {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ jsx1232(
+  return /* @__PURE__ */ jsx1233(
     "div",
     __spreadValues({
       className: cn(
@@ -52071,9 +52202,9 @@ var DialogFooter = (_a) => {
   );
 };
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React7.forwardRef((_a, ref) => {
+var DialogTitle = React8.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1232(
+  return /* @__PURE__ */ jsx1233(
     DialogPrimitive.Title,
     __spreadValues({
       ref,
@@ -52082,9 +52213,9 @@ var DialogTitle = React7.forwardRef((_a, ref) => {
   );
 });
 DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React7.forwardRef((_a, ref) => {
+var DialogDescription = React8.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1232(
+  return /* @__PURE__ */ jsx1233(
     DialogPrimitive.Description,
     __spreadValues({
       ref,
@@ -52095,9 +52226,9 @@ var DialogDescription = React7.forwardRef((_a, ref) => {
 DialogDescription.displayName = DialogPrimitive.Description.displayName;
 
 // src/components/DropdownMenu/DropdownMenu.tsx
-import React8 from "react";
+import React9 from "react";
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
-import { jsx as jsx1233, jsxs as jsxs1012 } from "react/jsx-runtime";
+import { jsx as jsx1234, jsxs as jsxs1013 } from "react/jsx-runtime";
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuItemBase = ({
   icon,
@@ -52109,7 +52240,7 @@ var DropdownMenuItemBase = ({
   description,
   hasSubNav
 }) => {
-  return /* @__PURE__ */ jsxs1012(
+  return /* @__PURE__ */ jsxs1013(
     "div",
     {
       className: cn(
@@ -52118,9 +52249,9 @@ var DropdownMenuItemBase = ({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs1012("div", { className: "flex items-center gap-2", children: [
-          checkbox && /* @__PURE__ */ jsx1233(Checkbox, { checked }),
-          icon && React8.cloneElement(icon, {
+        /* @__PURE__ */ jsxs1013("div", { className: "flex items-center gap-2", children: [
+          checkbox && /* @__PURE__ */ jsx1234(Checkbox, { checked }),
+          icon && React9.cloneElement(icon, {
             size: 16,
             className: cn(
               "flex-shrink-0",
@@ -52128,15 +52259,15 @@ var DropdownMenuItemBase = ({
               icon.props.className
             )
           }),
-          /* @__PURE__ */ jsx1233("span", { className: "flex gap-2 grow", children }),
-          hasSubNav && /* @__PURE__ */ jsx1233("div", { className: "inline-flex items-center justify-end", children: /* @__PURE__ */ jsx1233(ChevronRightIcon, { size: 16, className: "text-gray-1000" }) })
+          /* @__PURE__ */ jsx1234("span", { className: "flex gap-2 grow", children }),
+          hasSubNav && /* @__PURE__ */ jsx1234("div", { className: "inline-flex items-center justify-end", children: /* @__PURE__ */ jsx1234(ChevronRightIcon, { size: 16, className: "text-gray-1000" }) })
         ] }),
-        description && /* @__PURE__ */ jsx1233("div", { className: "text-xs text-gray-700", children: description })
+        description && /* @__PURE__ */ jsx1234("div", { className: "text-xs text-gray-700", children: description })
       ]
     }
   );
 };
-var DropdownMenuCheckboxItem = React8.forwardRef(
+var DropdownMenuCheckboxItem = React9.forwardRef(
   (_a, forwardedRef) => {
     var _b = _a, { className, children, checked, icon, description, destructive } = _b, props = __objRest(_b, ["className", "children", "checked", "icon", "description", "destructive"]);
     const extraProps = {
@@ -52146,20 +52277,20 @@ var DropdownMenuCheckboxItem = React8.forwardRef(
       checked,
       className
     };
-    return /* @__PURE__ */ jsx1233(
+    return /* @__PURE__ */ jsx1234(
       DropdownMenuPrimitive.CheckboxItem,
       __spreadProps(__spreadValues({
         checked
       }, props), {
         ref: forwardedRef,
         className: "outline-none select-none group",
-        children: /* @__PURE__ */ jsx1233(DropdownMenuItemBase, __spreadProps(__spreadValues({ checkbox: true }, extraProps), { children }))
+        children: /* @__PURE__ */ jsx1234(DropdownMenuItemBase, __spreadProps(__spreadValues({ checkbox: true }, extraProps), { children }))
       })
     );
   }
 );
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropdownMenuContent = React8.forwardRef(
+var DropdownMenuContent = React9.forwardRef(
   (_a, forwardedRef) => {
     var _b = _a, {
       children,
@@ -52174,7 +52305,7 @@ var DropdownMenuContent = React8.forwardRef(
       "sideOffset",
       "align"
     ]);
-    return /* @__PURE__ */ jsx1233(
+    return /* @__PURE__ */ jsx1234(
       DropdownMenuPrimitive.Content,
       __spreadProps(__spreadValues({
         className: cn(
@@ -52193,7 +52324,7 @@ var DropdownMenuContent = React8.forwardRef(
 );
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
 var DropdownMenuGroup = DropdownMenuPrimitive.Group;
-var DropdownMenuItem = React8.forwardRef(
+var DropdownMenuItem = React9.forwardRef(
   (_a, forwardedRef) => {
     var _b = _a, { className, children, icon, description, destructive } = _b, props = __objRest(_b, ["className", "children", "icon", "description", "destructive"]);
     const extraProps = {
@@ -52202,20 +52333,20 @@ var DropdownMenuItem = React8.forwardRef(
       icon,
       className
     };
-    return /* @__PURE__ */ jsx1233(
+    return /* @__PURE__ */ jsx1234(
       DropdownMenuPrimitive.Item,
       __spreadProps(__spreadValues({}, props), {
         ref: forwardedRef,
         className: "outline-none select-none group",
-        children: /* @__PURE__ */ jsx1233(DropdownMenuItemBase, __spreadProps(__spreadValues({}, extraProps), { children }))
+        children: /* @__PURE__ */ jsx1234(DropdownMenuItemBase, __spreadProps(__spreadValues({}, extraProps), { children }))
       })
     );
   }
 );
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuLabel = React8.forwardRef((_a, forwardedRef) => {
+var DropdownMenuLabel = React9.forwardRef((_a, forwardedRef) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1233(
+  return /* @__PURE__ */ jsx1234(
     DropdownMenuPrimitive.Label,
     __spreadProps(__spreadValues({
       className: cn(
@@ -52230,7 +52361,7 @@ var DropdownMenuLabel = React8.forwardRef((_a, forwardedRef) => {
 DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
 var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
-var DropdownMenuRadioItem = React8.forwardRef(
+var DropdownMenuRadioItem = React9.forwardRef(
   (_a, forwardedRef) => {
     var _b = _a, { className, children, icon, description, destructive } = _b, props = __objRest(_b, ["className", "children", "icon", "description", "destructive"]);
     const extraProps = {
@@ -52239,20 +52370,20 @@ var DropdownMenuRadioItem = React8.forwardRef(
       icon,
       className
     };
-    return /* @__PURE__ */ jsx1233(
+    return /* @__PURE__ */ jsx1234(
       DropdownMenuPrimitive.RadioItem,
       __spreadProps(__spreadValues({}, props), {
         ref: forwardedRef,
         className: "outline-none select-none group",
-        children: /* @__PURE__ */ jsx1233(DropdownMenuItemBase, __spreadProps(__spreadValues({}, extraProps), { children }))
+        children: /* @__PURE__ */ jsx1234(DropdownMenuItemBase, __spreadProps(__spreadValues({}, extraProps), { children }))
       })
     );
   }
 );
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-var DropdownMenuSeparator = React8.forwardRef((_a, forwardedRef) => {
+var DropdownMenuSeparator = React9.forwardRef((_a, forwardedRef) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1233(
+  return /* @__PURE__ */ jsx1234(
     DropdownMenuPrimitive.Separator,
     __spreadProps(__spreadValues({
       className: cn("my-1 border-b border-gray-200", className)
@@ -52263,9 +52394,9 @@ var DropdownMenuSeparator = React8.forwardRef((_a, forwardedRef) => {
 });
 DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
 var DropdownMenuSub = DropdownMenuPrimitive.Sub;
-var DropdownMenuSubContent = React8.forwardRef((_a, forwardedRef) => {
+var DropdownMenuSubContent = React9.forwardRef((_a, forwardedRef) => {
   var _b = _a, { children, className, sideOffset = 8 } = _b, props = __objRest(_b, ["children", "className", "sideOffset"]);
-  return /* @__PURE__ */ jsx1233(
+  return /* @__PURE__ */ jsx1234(
     DropdownMenuPrimitive.SubContent,
     __spreadProps(__spreadValues({
       className: cn(
@@ -52280,7 +52411,7 @@ var DropdownMenuSubContent = React8.forwardRef((_a, forwardedRef) => {
   );
 });
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
-var DropdownMenuSubTrigger = React8.forwardRef(
+var DropdownMenuSubTrigger = React9.forwardRef(
   (_a, forwardedRef) => {
     var _b = _a, { className, children, icon, description, destructive } = _b, props = __objRest(_b, ["className", "children", "icon", "description", "destructive"]);
     const extraProps = {
@@ -52289,12 +52420,12 @@ var DropdownMenuSubTrigger = React8.forwardRef(
       icon,
       className
     };
-    return /* @__PURE__ */ jsx1233(
+    return /* @__PURE__ */ jsx1234(
       DropdownMenuPrimitive.SubTrigger,
       __spreadProps(__spreadValues({}, props), {
         ref: forwardedRef,
         className: "outline-none select-none group",
-        children: /* @__PURE__ */ jsx1233(DropdownMenuItemBase, __spreadProps(__spreadValues({ hasSubNav: true }, extraProps), { children }))
+        children: /* @__PURE__ */ jsx1234(DropdownMenuItemBase, __spreadProps(__spreadValues({ hasSubNav: true }, extraProps), { children }))
       })
     );
   }
@@ -52303,16 +52434,16 @@ DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayNam
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
 
 // src/components/FilterButton/FilterButton.tsx
-import React9 from "react";
-import { Fragment, jsx as jsx1234, jsxs as jsxs1013 } from "react/jsx-runtime";
-var FilterButton = React9.forwardRef(
+import React10 from "react";
+import { Fragment, jsx as jsx1235, jsxs as jsxs1014 } from "react/jsx-runtime";
+var FilterButton = React10.forwardRef(
   (_a, ref) => {
     var _b = _a, { selectedCount, children, size = "sm", variant = "outline" } = _b, props = __objRest(_b, ["selectedCount", "children", "size", "variant"]);
-    return /* @__PURE__ */ jsxs1013(Button, __spreadProps(__spreadValues({ ref, variant, size }, props), { children: [
+    return /* @__PURE__ */ jsxs1014(Button, __spreadProps(__spreadValues({ ref, variant, size }, props), { children: [
       children,
-      selectedCount !== void 0 && selectedCount > 0 && /* @__PURE__ */ jsxs1013(Fragment, { children: [
-        /* @__PURE__ */ jsx1234("span", { className: "h-4 border-l border-gray-200" }),
-        /* @__PURE__ */ jsx1234(Badge, { variant: "fill", color: "blue", children: selectedCount })
+      selectedCount !== void 0 && selectedCount > 0 && /* @__PURE__ */ jsxs1014(Fragment, { children: [
+        /* @__PURE__ */ jsx1235("span", { className: "h-4 border-l border-gray-200" }),
+        /* @__PURE__ */ jsx1235(Badge, { variant: "fill", color: "blue", children: selectedCount })
       ] })
     ] }));
   }
@@ -52320,7 +52451,7 @@ var FilterButton = React9.forwardRef(
 FilterButton.displayName = "FilterButton";
 
 // src/components/Form/Form.tsx
-import * as React11 from "react";
+import * as React12 from "react";
 import { Slot as Slot2 } from "@radix-ui/react-slot";
 import {
   Controller,
@@ -52329,12 +52460,12 @@ import {
 } from "react-hook-form";
 
 // src/components/Label/Label.tsx
-import * as React10 from "react";
+import * as React11 from "react";
 import * as LabelPrimitive from "@radix-ui/react-label";
-import { jsx as jsx1235 } from "react/jsx-runtime";
-var Label2 = React10.forwardRef((_a, ref) => {
+import { jsx as jsx1236 } from "react/jsx-runtime";
+var Label2 = React11.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1235(
+  return /* @__PURE__ */ jsx1236(
     LabelPrimitive.Root,
     __spreadValues({
       ref,
@@ -52348,24 +52479,24 @@ var Label2 = React10.forwardRef((_a, ref) => {
 Label2.displayName = LabelPrimitive.Root.displayName;
 
 // src/components/Form/Form.tsx
-import { jsx as jsx1236 } from "react/jsx-runtime";
+import { jsx as jsx1237 } from "react/jsx-runtime";
 var Form = FormProvider;
-var FormFieldContext = React11.createContext(
+var FormFieldContext = React12.createContext(
   {}
 );
 var FormField = (_a) => {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ jsx1236(
+  return /* @__PURE__ */ jsx1237(
     FormFieldContext.Provider,
     {
       value: { name: props.name, isDisabled: props.disabled },
-      children: /* @__PURE__ */ jsx1236(Controller, __spreadValues({}, props))
+      children: /* @__PURE__ */ jsx1237(Controller, __spreadValues({}, props))
     }
   );
 };
 var useFormField = () => {
-  const fieldContext = React11.useContext(FormFieldContext);
-  const itemContext = React11.useContext(FormItemContext);
+  const fieldContext = React12.useContext(FormFieldContext);
+  const itemContext = React12.useContext(FormItemContext);
   const { getFieldState, formState } = useFormContext();
   const fieldState = getFieldState(fieldContext.name, formState);
   if (!fieldContext) {
@@ -52381,13 +52512,13 @@ var useFormField = () => {
     formMessageId: `${id}-form-item-message`
   }, fieldState);
 };
-var FormItemContext = React11.createContext(
+var FormItemContext = React12.createContext(
   {}
 );
-var FormItem = React11.forwardRef((_a, ref) => {
+var FormItem = React12.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  const id = React11.useId();
-  return /* @__PURE__ */ jsx1236(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx1236(
+  const id = React12.useId();
+  return /* @__PURE__ */ jsx1237(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx1237(
     "div",
     __spreadValues({
       ref,
@@ -52396,10 +52527,10 @@ var FormItem = React11.forwardRef((_a, ref) => {
   ) });
 });
 FormItem.displayName = "FormItem";
-var FormLabel = React11.forwardRef((_a, ref) => {
+var FormLabel = React12.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   const { isDisabled, formItemId } = useFormField();
-  return /* @__PURE__ */ jsx1236(
+  return /* @__PURE__ */ jsx1237(
     Label2,
     __spreadValues({
       ref,
@@ -52409,10 +52540,10 @@ var FormLabel = React11.forwardRef((_a, ref) => {
   );
 });
 FormLabel.displayName = "FormLabel";
-var FormControl = React11.forwardRef((_a, ref) => {
+var FormControl = React12.forwardRef((_a, ref) => {
   var props = __objRest(_a, []);
   const { error, isDisabled, formItemId, formDescriptionId, formMessageId } = useFormField();
-  return /* @__PURE__ */ jsx1236(
+  return /* @__PURE__ */ jsx1237(
     Slot2,
     __spreadValues({
       ref,
@@ -52425,10 +52556,10 @@ var FormControl = React11.forwardRef((_a, ref) => {
   );
 });
 FormControl.displayName = "FormControl";
-var FormDescription = React11.forwardRef((_a, ref) => {
+var FormDescription = React12.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   const { formDescriptionId, isDisabled } = useFormField();
-  return /* @__PURE__ */ jsx1236(
+  return /* @__PURE__ */ jsx1237(
     "p",
     __spreadValues({
       ref,
@@ -52442,12 +52573,12 @@ var FormDescription = React11.forwardRef((_a, ref) => {
   );
 });
 FormDescription.displayName = "FormDescription";
-var FormMessage = React11.forwardRef((_a, ref) => {
+var FormMessage = React12.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
   const { error, isDisabled, formMessageId } = useFormField();
   const body = error ? String(error == null ? void 0 : error.message) : children;
   const textColorClassName = error ? "text-red-700" : "text-gray-700";
-  return /* @__PURE__ */ jsx1236(
+  return /* @__PURE__ */ jsx1237(
     "p",
     __spreadProps(__spreadValues({
       ref,
@@ -52466,10 +52597,10 @@ var FormMessage = React11.forwardRef((_a, ref) => {
 FormMessage.displayName = "FormMessage";
 
 // src/components/Input/Input.tsx
-import * as React12 from "react";
+import * as React13 from "react";
 import { Slot as Slot3 } from "@radix-ui/react-slot";
-import { jsx as jsx1237, jsxs as jsxs1014 } from "react/jsx-runtime";
-var Input = React12.forwardRef(
+import { jsx as jsx1238, jsxs as jsxs1015 } from "react/jsx-runtime";
+var Input = React13.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       className,
@@ -52487,8 +52618,8 @@ var Input = React12.forwardRef(
       "suffixEnchancer"
     ]);
     const isDisabled = !!props["data-is-disabled"] || disabled;
-    return /* @__PURE__ */ jsxs1014("div", { className: "flex gap-2", children: [
-      /* @__PURE__ */ jsxs1014(
+    return /* @__PURE__ */ jsxs1015("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsxs1015(
         "div",
         {
           className: cn(
@@ -52500,7 +52631,7 @@ var Input = React12.forwardRef(
             className
           ),
           children: [
-            prefixEnchancer && /* @__PURE__ */ jsx1237(
+            prefixEnchancer && /* @__PURE__ */ jsx1238(
               Slot3,
               {
                 className: cn(
@@ -52510,7 +52641,7 @@ var Input = React12.forwardRef(
                 children: prefixEnchancer
               }
             ),
-            /* @__PURE__ */ jsx1237(
+            /* @__PURE__ */ jsx1238(
               "input",
               __spreadProps(__spreadValues({}, props), {
                 disabled: isDisabled,
@@ -52519,7 +52650,7 @@ var Input = React12.forwardRef(
                 ref
               })
             ),
-            suffixEnchancer && /* @__PURE__ */ jsx1237(
+            suffixEnchancer && /* @__PURE__ */ jsx1238(
               Slot3,
               {
                 className: cn(
@@ -52532,7 +52663,7 @@ var Input = React12.forwardRef(
           ]
         }
       ),
-      button && React12.cloneElement(button, {
+      button && React13.cloneElement(button, {
         size: "sm",
         disabled: isDisabled,
         className: cn("flex-shrink-0", button.props.className)
@@ -52543,7 +52674,7 @@ var Input = React12.forwardRef(
 Input.displayName = "Input";
 
 // src/components/Pagination/Pagination.tsx
-import { jsx as jsx1238, jsxs as jsxs1015 } from "react/jsx-runtime";
+import { jsx as jsx1239, jsxs as jsxs1016 } from "react/jsx-runtime";
 var PaginationPageChoice = /* @__PURE__ */ ((PaginationPageChoice2) => {
   PaginationPageChoice2["FIRST"] = "FIRST";
   PaginationPageChoice2["PREVIOUS"] = "PREVIOUS";
@@ -52559,12 +52690,12 @@ var Pagination = ({
   onPageChange,
   className
 }) => {
-  return /* @__PURE__ */ jsxs1015("div", { className: cn("flex items-center justify-between px-2", className), children: [
-    totalRowsCaption && /* @__PURE__ */ jsx1238("div", { className: "flex-1 text-sm text-gray-700", children: totalRowsCaption }),
-    /* @__PURE__ */ jsxs1015("div", { className: "flex items-center gap-4", children: [
-      currentPageCation && /* @__PURE__ */ jsx1238("div", { className: "flex items-center justify-center text-sm font-medium text-gray-1000", children: currentPageCation }),
-      /* @__PURE__ */ jsxs1015("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx1238(
+  return /* @__PURE__ */ jsxs1016("div", { className: cn("flex items-center justify-between px-2", className), children: [
+    totalRowsCaption && /* @__PURE__ */ jsx1239("div", { className: "flex-1 text-sm text-gray-700", children: totalRowsCaption }),
+    /* @__PURE__ */ jsxs1016("div", { className: "flex items-center gap-4", children: [
+      currentPageCation && /* @__PURE__ */ jsx1239("div", { className: "flex items-center justify-center text-sm font-medium text-gray-1000", children: currentPageCation }),
+      /* @__PURE__ */ jsxs1016("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx1239(
           Button,
           {
             variant: "outline",
@@ -52572,10 +52703,10 @@ var Pagination = ({
             size: "sm",
             onClick: () => onPageChange("FIRST" /* FIRST */),
             disabled: !previousPageAvailable,
-            children: /* @__PURE__ */ jsx1238(ChevronLeftDoubleIcon, { size: "16" })
+            children: /* @__PURE__ */ jsx1239(ChevronLeftDoubleIcon, { size: "16" })
           }
         ),
-        /* @__PURE__ */ jsx1238(
+        /* @__PURE__ */ jsx1239(
           Button,
           {
             variant: "outline",
@@ -52583,10 +52714,10 @@ var Pagination = ({
             size: "sm",
             onClick: () => onPageChange("PREVIOUS" /* PREVIOUS */),
             disabled: !previousPageAvailable,
-            children: /* @__PURE__ */ jsx1238(ChevronLeftIcon, { size: "16" })
+            children: /* @__PURE__ */ jsx1239(ChevronLeftIcon, { size: "16" })
           }
         ),
-        /* @__PURE__ */ jsx1238(
+        /* @__PURE__ */ jsx1239(
           Button,
           {
             variant: "outline",
@@ -52594,10 +52725,10 @@ var Pagination = ({
             size: "sm",
             onClick: () => onPageChange("NEXT" /* NEXT */),
             disabled: !nextPageAvailable,
-            children: /* @__PURE__ */ jsx1238(ChevronRightIcon, { size: "16" })
+            children: /* @__PURE__ */ jsx1239(ChevronRightIcon, { size: "16" })
           }
         ),
-        /* @__PURE__ */ jsx1238(
+        /* @__PURE__ */ jsx1239(
           Button,
           {
             variant: "outline",
@@ -52605,7 +52736,7 @@ var Pagination = ({
             size: "sm",
             onClick: () => onPageChange("LAST" /* LAST */),
             disabled: !nextPageAvailable,
-            children: /* @__PURE__ */ jsx1238(ChevronRightDoubleIcon, { size: "16" })
+            children: /* @__PURE__ */ jsx1239(ChevronRightDoubleIcon, { size: "16" })
           }
         )
       ] })
@@ -52614,14 +52745,14 @@ var Pagination = ({
 };
 
 // src/components/Popover/Popover.tsx
-import * as React13 from "react";
+import * as React14 from "react";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
-import { jsx as jsx1239 } from "react/jsx-runtime";
+import { jsx as jsx1240 } from "react/jsx-runtime";
 var Popover = PopoverPrimitive.Root;
 var PopoverTrigger = PopoverPrimitive.Trigger;
-var PopoverContent = React13.forwardRef((_a, ref) => {
+var PopoverContent = React14.forwardRef((_a, ref) => {
   var _b = _a, { className, align = "center", sideOffset = 4 } = _b, props = __objRest(_b, ["className", "align", "sideOffset"]);
-  return /* @__PURE__ */ jsx1239(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx1239(
+  return /* @__PURE__ */ jsx1240(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx1240(
     PopoverPrimitive.Content,
     __spreadValues({
       ref,
@@ -52637,16 +52768,16 @@ var PopoverContent = React13.forwardRef((_a, ref) => {
 PopoverContent.displayName = PopoverPrimitive.Content.displayName;
 
 // src/components/Select/Select.tsx
-import * as React14 from "react";
+import * as React15 from "react";
 import * as SelectPrimitive from "@radix-ui/react-select";
-import { jsx as jsx1240, jsxs as jsxs1016 } from "react/jsx-runtime";
+import { jsx as jsx1241, jsxs as jsxs1017 } from "react/jsx-runtime";
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
 var SelectValue = SelectPrimitive.Value;
-var SelectTrigger = React14.forwardRef((_a, ref) => {
+var SelectTrigger = React15.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
   const isDisabled = props["data-is-disabled"];
-  return /* @__PURE__ */ jsxs1016(
+  return /* @__PURE__ */ jsxs1017(
     SelectPrimitive.Trigger,
     __spreadProps(__spreadValues({
       ref,
@@ -52663,15 +52794,15 @@ var SelectTrigger = React14.forwardRef((_a, ref) => {
     }, props), {
       children: [
         children,
-        /* @__PURE__ */ jsx1240(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx1240(ChevronSelectorVerticalIcon, { size: "16", className: "w-4 h-4 opacity-50" }) })
+        /* @__PURE__ */ jsx1241(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx1241(ChevronSelectorVerticalIcon, { size: "16", className: "w-4 h-4 opacity-50" }) })
       ]
     })
   );
 });
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectContent = React14.forwardRef((_a, ref) => {
+var SelectContent = React15.forwardRef((_a, ref) => {
   var _b = _a, { className, children, position = "popper" } = _b, props = __objRest(_b, ["className", "children", "position"]);
-  return /* @__PURE__ */ jsx1240(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx1240(
+  return /* @__PURE__ */ jsx1241(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx1241(
     SelectPrimitive.Content,
     __spreadProps(__spreadValues({
       ref,
@@ -52682,7 +52813,7 @@ var SelectContent = React14.forwardRef((_a, ref) => {
       ),
       position
     }, props), {
-      children: /* @__PURE__ */ jsx1240(
+      children: /* @__PURE__ */ jsx1241(
         SelectPrimitive.Viewport,
         {
           className: cn(
@@ -52696,9 +52827,9 @@ var SelectContent = React14.forwardRef((_a, ref) => {
   ) });
 });
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React14.forwardRef((_a, ref) => {
+var SelectLabel = React15.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1240(
+  return /* @__PURE__ */ jsx1241(
     SelectPrimitive.Label,
     __spreadValues({
       ref,
@@ -52707,9 +52838,9 @@ var SelectLabel = React14.forwardRef((_a, ref) => {
   );
 });
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React14.forwardRef((_a, ref) => {
+var SelectItem = React15.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsx1240(
+  return /* @__PURE__ */ jsx1241(
     SelectPrimitive.Item,
     __spreadProps(__spreadValues({
       ref,
@@ -52718,14 +52849,14 @@ var SelectItem = React14.forwardRef((_a, ref) => {
         className
       )
     }, props), {
-      children: /* @__PURE__ */ jsx1240(SelectPrimitive.ItemText, { children })
+      children: /* @__PURE__ */ jsx1241(SelectPrimitive.ItemText, { children })
     })
   );
 });
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React14.forwardRef((_a, ref) => {
+var SelectSeparator = React15.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1240(
+  return /* @__PURE__ */ jsx1241(
     SelectPrimitive.Separator,
     __spreadValues({
       ref,
@@ -52736,12 +52867,12 @@ var SelectSeparator = React14.forwardRef((_a, ref) => {
 SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 // src/components/Switch/Switch.tsx
-import * as React15 from "react";
+import * as React16 from "react";
 import * as SwitchPrimitive from "@radix-ui/react-switch";
-import { jsx as jsx1241 } from "react/jsx-runtime";
-var Switch = React15.forwardRef((_a, ref) => {
+import { jsx as jsx1242 } from "react/jsx-runtime";
+var Switch = React16.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1241(
+  return /* @__PURE__ */ jsx1242(
     SwitchPrimitive.Root,
     __spreadProps(__spreadValues({
       className: cn(
@@ -52750,18 +52881,18 @@ var Switch = React15.forwardRef((_a, ref) => {
       )
     }, props), {
       ref,
-      children: /* @__PURE__ */ jsx1241(SwitchPrimitive.Thumb, { className: "inline-block w-4 h-4 bg-gray-600 rounded-full translate-x-0.5 data-[state=checked]:translate-x-5 data-[state=checked]:bg-white transition-transform ease-linear will-change-transform" })
+      children: /* @__PURE__ */ jsx1242(SwitchPrimitive.Thumb, { className: "inline-block w-4 h-4 bg-gray-600 rounded-full translate-x-0.5 data-[state=checked]:translate-x-5 data-[state=checked]:bg-white transition-transform ease-linear will-change-transform" })
     })
   );
 });
 Switch.displayName = SwitchPrimitive.Root.displayName;
 
 // src/components/Table/Table.tsx
-import * as React16 from "react";
-import { jsx as jsx1242, jsxs as jsxs1017 } from "react/jsx-runtime";
-var Table = React16.forwardRef((_a, ref) => {
+import * as React17 from "react";
+import { jsx as jsx1243, jsxs as jsxs1018 } from "react/jsx-runtime";
+var Table = React17.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1242("div", { className: "w-full overflow-auto border rounded-lg", children: /* @__PURE__ */ jsx1242(
+  return /* @__PURE__ */ jsx1243("div", { className: "w-full overflow-auto border rounded-lg", children: /* @__PURE__ */ jsx1243(
     "table",
     __spreadValues({
       ref,
@@ -52770,9 +52901,9 @@ var Table = React16.forwardRef((_a, ref) => {
   ) });
 });
 Table.displayName = "Table";
-var TableHeader = React16.forwardRef((_a, ref) => {
+var TableHeader = React17.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1242(
+  return /* @__PURE__ */ jsx1243(
     "thead",
     __spreadValues({
       ref,
@@ -52781,9 +52912,9 @@ var TableHeader = React16.forwardRef((_a, ref) => {
   );
 });
 TableHeader.displayName = "TableHeader";
-var TableBody = React16.forwardRef((_a, ref) => {
+var TableBody = React17.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1242(
+  return /* @__PURE__ */ jsx1243(
     "tbody",
     __spreadValues({
       ref,
@@ -52795,9 +52926,9 @@ var TableBody = React16.forwardRef((_a, ref) => {
   );
 });
 TableBody.displayName = "TableBody";
-var TableRow = React16.forwardRef((_a, ref) => {
+var TableRow = React17.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1242(
+  return /* @__PURE__ */ jsx1243(
     "tr",
     __spreadValues({
       ref,
@@ -52809,9 +52940,9 @@ var TableRow = React16.forwardRef((_a, ref) => {
   );
 });
 TableRow.displayName = "TableRow";
-var TableHead = React16.forwardRef((_a, ref) => {
+var TableHead = React17.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1242(
+  return /* @__PURE__ */ jsx1243(
     "th",
     __spreadValues({
       ref,
@@ -52823,9 +52954,9 @@ var TableHead = React16.forwardRef((_a, ref) => {
   );
 });
 TableHead.displayName = "TableHead";
-var TableCell = React16.forwardRef((_a, ref) => {
+var TableCell = React17.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1242(
+  return /* @__PURE__ */ jsx1243(
     "td",
     __spreadValues({
       ref,
@@ -52837,18 +52968,18 @@ var TableCell = React16.forwardRef((_a, ref) => {
   );
 });
 TableCell.displayName = "TableCell";
-var TableEmpty = React16.forwardRef((_a, ref) => {
+var TableEmpty = React17.forwardRef((_a, ref) => {
   var _b = _a, { className, title, description, children } = _b, props = __objRest(_b, ["className", "title", "description", "children"]);
-  return /* @__PURE__ */ jsxs1017(
+  return /* @__PURE__ */ jsxs1018(
     "div",
     __spreadProps(__spreadValues({
       ref,
       className: cn("flex flex-col gap-6 items-center py-12", className)
     }, props), {
       children: [
-        title && /* @__PURE__ */ jsx1242("span", { className: "text-lg font-semibold text-gray-1000", children: title }),
-        description && /* @__PURE__ */ jsx1242("span", { className: "text-sm font-normal text-gray-900", children: description }),
-        /* @__PURE__ */ jsx1242("div", { children })
+        title && /* @__PURE__ */ jsx1243("span", { className: "text-lg font-semibold text-gray-1000", children: title }),
+        description && /* @__PURE__ */ jsx1243("span", { className: "text-sm font-normal text-gray-900", children: description }),
+        /* @__PURE__ */ jsx1243("div", { children })
       ]
     })
   );
@@ -52856,13 +52987,13 @@ var TableEmpty = React16.forwardRef((_a, ref) => {
 TableEmpty.displayName = "TableEmpty";
 
 // src/components/Tabs/Tabs.tsx
-import * as React17 from "react";
+import * as React18 from "react";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
-import { jsx as jsx1243 } from "react/jsx-runtime";
+import { jsx as jsx1244 } from "react/jsx-runtime";
 var Tabs = TabsPrimitive.Root;
-var TabsList = React17.forwardRef((_a, ref) => {
+var TabsList = React18.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1243(
+  return /* @__PURE__ */ jsx1244(
     TabsPrimitive.List,
     __spreadValues({
       ref,
@@ -52874,9 +53005,9 @@ var TabsList = React17.forwardRef((_a, ref) => {
   );
 });
 TabsList.displayName = TabsPrimitive.List.displayName;
-var TabsTrigger = React17.forwardRef((_a, ref) => {
+var TabsTrigger = React18.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1243(
+  return /* @__PURE__ */ jsx1244(
     TabsPrimitive.Trigger,
     __spreadValues({
       ref,
@@ -52891,9 +53022,9 @@ var TabsTrigger = React17.forwardRef((_a, ref) => {
   );
 });
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React17.forwardRef((_a, ref) => {
+var TabsContent = React18.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1243(
+  return /* @__PURE__ */ jsx1244(
     TabsPrimitive.Content,
     __spreadValues({
       ref,
@@ -52907,13 +53038,13 @@ var TabsContent = React17.forwardRef((_a, ref) => {
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 
 // src/components/Textarea/Textarea.tsx
-import * as React18 from "react";
-import { jsx as jsx1244 } from "react/jsx-runtime";
-var Textarea = React18.forwardRef(
+import * as React19 from "react";
+import { jsx as jsx1245 } from "react/jsx-runtime";
+var Textarea = React19.forwardRef(
   (_a, ref) => {
     var _b = _a, { className, disabled } = _b, props = __objRest(_b, ["className", "disabled"]);
     const isDisabled = !!props["data-is-disabled"] || disabled;
-    return /* @__PURE__ */ jsx1244("div", { className: "flex gap-2", children: /* @__PURE__ */ jsx1244(
+    return /* @__PURE__ */ jsx1245("div", { className: "flex gap-2", children: /* @__PURE__ */ jsx1245(
       "div",
       {
         className: cn(
@@ -52924,7 +53055,7 @@ var Textarea = React18.forwardRef(
           },
           className
         ),
-        children: /* @__PURE__ */ jsx1244(
+        children: /* @__PURE__ */ jsx1245(
           "textarea",
           __spreadProps(__spreadValues({}, props), {
             disabled: isDisabled,
@@ -52939,19 +53070,19 @@ var Textarea = React18.forwardRef(
 Textarea.displayName = "Textarea";
 
 // src/components/Toaster/Toast.tsx
-import * as React19 from "react";
+import * as React20 from "react";
 import * as ToastPrimitives from "@radix-ui/react-toast";
 import { cva as cva4 } from "class-variance-authority";
-import { jsx as jsx1245 } from "react/jsx-runtime";
+import { jsx as jsx1246 } from "react/jsx-runtime";
 var ToastProvider = ToastPrimitives.Provider;
-var ToastViewport = React19.forwardRef((_a, ref) => {
+var ToastViewport = React20.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1245(
+  return /* @__PURE__ */ jsx1246(
     ToastPrimitives.Viewport,
     __spreadValues({
       ref,
       className: cn(
-        "fixed top-8 left-1/2 -translate-x-1/2 z-[100] flex max-h-screen flex-col-reverse sm:flex-col md:max-w-[420px]",
+        "fixed top-8 left-1/2 -translate-x-1/2 z-[100] flex max-h-screen flex-col-reverse sm:flex-col w-max md:max-w-[420px]",
         className
       )
     }, props)
@@ -52972,9 +53103,9 @@ var toastVariants = cva4(
     }
   }
 );
-var Toast = React19.forwardRef((_a, ref) => {
+var Toast = React20.forwardRef((_a, ref) => {
   var _b = _a, { className, variant } = _b, props = __objRest(_b, ["className", "variant"]);
-  return /* @__PURE__ */ jsx1245(
+  return /* @__PURE__ */ jsx1246(
     ToastPrimitives.Root,
     __spreadValues({
       ref,
@@ -52983,28 +53114,28 @@ var Toast = React19.forwardRef((_a, ref) => {
   );
 });
 Toast.displayName = ToastPrimitives.Root.displayName;
-var ToastAction = React19.forwardRef((_a, ref) => {
+var ToastAction = React20.forwardRef((_a, ref) => {
   var _b = _a, { className, altText } = _b, props = __objRest(_b, ["className", "altText"]);
-  return /* @__PURE__ */ jsx1245(ToastPrimitives.Action, { altText, ref, asChild: true, children: /* @__PURE__ */ jsx1245(Button, __spreadValues({ size: "xs" }, props)) });
+  return /* @__PURE__ */ jsx1246(ToastPrimitives.Action, { altText, ref, asChild: true, children: /* @__PURE__ */ jsx1246(Button, __spreadValues({ size: "xs" }, props)) });
 });
 ToastAction.displayName = ToastPrimitives.Action.displayName;
-var ToastClose = React19.forwardRef((_a, ref) => {
+var ToastClose = React20.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1245(
+  return /* @__PURE__ */ jsx1246(
     ToastPrimitives.Close,
     __spreadProps(__spreadValues({
       ref,
       className: cn("focus:outline-none focus:ring-1", className),
       "toast-close": ""
     }, props), {
-      children: /* @__PURE__ */ jsx1245(XCloseIcon, { className: "text-white", size: 16 })
+      children: /* @__PURE__ */ jsx1246(XCloseIcon, { className: "text-white", size: 16 })
     })
   );
 });
 ToastClose.displayName = ToastPrimitives.Close.displayName;
-var ToastTitle = React19.forwardRef((_a, ref) => {
+var ToastTitle = React20.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1245(
+  return /* @__PURE__ */ jsx1246(
     ToastPrimitives.Title,
     __spreadValues({
       ref,
@@ -53013,9 +53144,9 @@ var ToastTitle = React19.forwardRef((_a, ref) => {
   );
 });
 ToastTitle.displayName = ToastPrimitives.Title.displayName;
-var ToastDescription = React19.forwardRef((_a, ref) => {
+var ToastDescription = React20.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx1245(
+  return /* @__PURE__ */ jsx1246(
     ToastPrimitives.Description,
     __spreadValues({
       ref,
@@ -53026,10 +53157,10 @@ var ToastDescription = React19.forwardRef((_a, ref) => {
 ToastDescription.displayName = ToastPrimitives.Description.displayName;
 
 // src/components/Toaster/Toaster.tsx
-import React21 from "react";
+import React22 from "react";
 
 // src/components/Toaster/useToast.tsx
-import * as React20 from "react";
+import * as React21 from "react";
 var TOAST_LIMIT = 3;
 var TOAST_REMOVE_DELAY = 1e6;
 var count = 0;
@@ -53138,8 +53269,8 @@ var toast = (parentId) => (_a) => {
   };
 };
 function useToast({ toasterId = "default" } = {}) {
-  const [state, setState] = React20.useState(memoryState);
-  React20.useEffect(() => {
+  const [state, setState] = React21.useState(memoryState);
+  React21.useEffect(() => {
     listeners.push(setState);
     return () => {
       const index = listeners.indexOf(setState);
@@ -53155,7 +53286,7 @@ function useToast({ toasterId = "default" } = {}) {
 }
 
 // src/components/Toaster/Toaster.tsx
-import { jsx as jsx1246, jsxs as jsxs1018 } from "react/jsx-runtime";
+import { jsx as jsx1247, jsxs as jsxs1019 } from "react/jsx-runtime";
 var ToastContent = ({
   title,
   description,
@@ -53163,19 +53294,19 @@ var ToastContent = ({
   actions,
   hideClose
 }) => {
-  return /* @__PURE__ */ jsxs1018("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ jsxs1018("div", { className: "flex items-center gap-4", children: [
-      /* @__PURE__ */ jsxs1018("div", { className: "flex items-center flex-grow gap-2", children: [
-        icon && React21.cloneElement(icon, {
+  return /* @__PURE__ */ jsxs1019("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ jsxs1019("div", { className: "flex items-center gap-4", children: [
+      /* @__PURE__ */ jsxs1019("div", { className: "flex items-center flex-grow gap-2", children: [
+        icon && React22.cloneElement(icon, {
           size: 16,
           className: cn("shrink-0", icon.props.className)
         }),
-        title && /* @__PURE__ */ jsx1246(ToastTitle, { children: title })
+        title && /* @__PURE__ */ jsx1247(ToastTitle, { children: title })
       ] }),
       actions,
-      !hideClose && /* @__PURE__ */ jsx1246(ToastClose, {})
+      !hideClose && /* @__PURE__ */ jsx1247(ToastClose, {})
     ] }),
-    description && /* @__PURE__ */ jsx1246(ToastDescription, { children: description })
+    description && /* @__PURE__ */ jsx1247(ToastDescription, { children: description })
   ] });
 };
 function Toaster(_a) {
@@ -53187,7 +53318,7 @@ function Toaster(_a) {
     "toasterId"
   ]);
   const { toasts } = useToast({ toasterId });
-  return /* @__PURE__ */ jsxs1018(ToastProvider, __spreadProps(__spreadValues({}, props), { children: [
+  return /* @__PURE__ */ jsxs1019(ToastProvider, __spreadProps(__spreadValues({}, props), { children: [
     toasts.filter((t) => t.parentId === toasterId).map(
       (_a2) => {
         var _b2 = _a2, {
@@ -53207,7 +53338,7 @@ function Toaster(_a) {
           "icon",
           "hideClose"
         ]);
-        return /* @__PURE__ */ jsx1246(Toast, __spreadProps(__spreadValues({}, props2), { children: /* @__PURE__ */ jsx1246(
+        return /* @__PURE__ */ jsx1247(Toast, __spreadProps(__spreadValues({}, props2), { children: /* @__PURE__ */ jsx1247(
           ToastContent,
           {
             title,
@@ -53219,27 +53350,27 @@ function Toaster(_a) {
         ) }), id);
       }
     ),
-    /* @__PURE__ */ jsx1246(ToastViewport, { className })
+    /* @__PURE__ */ jsx1247(ToastViewport, { className })
   ] }));
 }
 
 // src/components/Tooltip/Tooltip.tsx
-import * as React22 from "react";
+import * as React23 from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { jsx as jsx1247 } from "react/jsx-runtime";
+import { jsx as jsx1248 } from "react/jsx-runtime";
 var TooltipProvider = (_a) => {
   var _b = _a, {
     delayDuration = 0
   } = _b, props = __objRest(_b, [
     "delayDuration"
   ]);
-  return /* @__PURE__ */ jsx1247(TooltipPrimitive.Provider, __spreadValues({ delayDuration }, props));
+  return /* @__PURE__ */ jsx1248(TooltipPrimitive.Provider, __spreadValues({ delayDuration }, props));
 };
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipContent = React22.forwardRef((_a, ref) => {
+var TooltipContent = React23.forwardRef((_a, ref) => {
   var _b = _a, { className, sideOffset = 4 } = _b, props = __objRest(_b, ["className", "sideOffset"]);
-  return /* @__PURE__ */ jsx1247(
+  return /* @__PURE__ */ jsx1248(
     TooltipPrimitive.Content,
     __spreadValues({
       ref,
@@ -53616,6 +53747,7 @@ export {
   CornerUpRightIcon,
   CpuChip1Icon,
   CpuChip2Icon,
+  CreatableSelect,
   CreditCard1Icon,
   CreditCard2Icon,
   CreditCardCheckIcon,