shadcn-zod-formkit 3.3.0 → 3.5.4

package/dist/index.cjs

@@ -6,30 +6,32 @@ var lucideReact = require('lucide-react');
 var reactIcons = require('@radix-ui/react-icons');
 var classVarianceAuthority = require('class-variance-authority');
 var tailwindMerge = require('tailwind-merge');
+var reactSlot = require('@radix-ui/react-slot');
+var zustand = require('zustand');
 var reactHookForm = require('react-hook-form');
 var AccordionPrimitive = require('@radix-ui/react-accordion');
-var reactSlot = require('@radix-ui/react-slot');
+var radixUi = require('radix-ui');
+var SeparatorPrimitive = require('@radix-ui/react-separator');
 var reactDayPicker = require('react-day-picker');
 var CheckboxPrimitive = require('@radix-ui/react-checkbox');
 var reactColorPalette = require('react-color-palette');
 var PopoverPrimitive = require('@radix-ui/react-popover');
 require('react-color-palette/css');
+var cmdk = require('cmdk');
 var DialogPrimitive = require('@radix-ui/react-dialog');
 var LabelPrimitive = require('@radix-ui/react-label');
-var SeparatorPrimitive = require('@radix-ui/react-separator');
 var inputOtp = require('input-otp');
 var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
 var ResizablePrimitive = require('react-resizable-panels');
 var ScrollAreaPrimitive = require('@radix-ui/react-scroll-area');
 var SelectPrimitive = require('@radix-ui/react-select');
+var SliderPrimitive = require('@radix-ui/react-slider');
 var nextThemes = require('next-themes');
 var sonner = require('sonner');
 var SwitchPrimitive = require('@radix-ui/react-switch');
+var TabsPrimitive = require('@radix-ui/react-tabs');
 var TooltipPrimitive = require('@radix-ui/react-tooltip');
-var cmdk = require('cmdk');
 var dateFns = require('date-fns');
-var TabsPrimitive = require('@radix-ui/react-tabs');
-var SliderPrimitive = require('@radix-ui/react-slider');
 var core = require('@dnd-kit/core');
 var sortable = require('@dnd-kit/sortable');
 var utilities = require('@dnd-kit/utilities');
@@ -58,19 +60,19 @@ function _interopNamespace(e) {
 
 var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
 var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
+var SeparatorPrimitive__namespace = /*#__PURE__*/_interopNamespace(SeparatorPrimitive);
 var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
 var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
 var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
 var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
-var SeparatorPrimitive__namespace = /*#__PURE__*/_interopNamespace(SeparatorPrimitive);
 var RadioGroupPrimitive__namespace = /*#__PURE__*/_interopNamespace(RadioGroupPrimitive);
 var ResizablePrimitive__namespace = /*#__PURE__*/_interopNamespace(ResizablePrimitive);
 var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPrimitive);
 var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
+var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
 var SwitchPrimitive__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitive);
-var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
 var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
-var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
+var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
 var z2__default = /*#__PURE__*/_interopDefault(z2);
 
 var __create = Object.create;
@@ -8752,12 +8754,12 @@ var require_leaflet_src = __commonJS({
           toBack(layer._container);
         }
       };
-      var create = Browser.vml ? vmlCreate : svgCreate;
+      var create2 = Browser.vml ? vmlCreate : svgCreate;
       var SVG = Renderer.extend({
         _initContainer: function() {
-          this._container = create("svg");
+          this._container = create2("svg");
           this._container.setAttribute("pointer-events", "none");
-          this._rootGroup = create("g");
+          this._rootGroup = create2("g");
           this._container.appendChild(this._rootGroup);
         },
         _destroyContainer: function() {
@@ -8784,7 +8786,7 @@ var require_leaflet_src = __commonJS({
         },
         // methods below are called by vector layers implementations
         _initPath: function(layer) {
-          var path = layer._path = create("path");
+          var path = layer._path = create2("path");
           if (layer.options.className) {
             addClass(path, layer.options.className);
           }
@@ -8919,7 +8921,7 @@ var require_leaflet_src = __commonJS({
       function rectangle(latLngBounds, options) {
         return new Rectangle(latLngBounds, options);
       }
-      SVG.create = create;
+      SVG.create = create2;
       SVG.pointsToPath = pointsToPath;
       GeoJSON.geometryToLayer = geometryToLayer;
       GeoJSON.coordsToLatLng = coordsToLatLng;
@@ -9227,7 +9229,7 @@ var require_leaflet_src = __commonJS({
         // Amount of pixels to pan when pressing an arrow key.
         keyboardPanDelta: 80
       });
-      var Keyboard = Handler.extend({
+      var Keyboard2 = Handler.extend({
         keyCodes: {
           left: [37],
           right: [39],
@@ -9345,7 +9347,7 @@ var require_leaflet_src = __commonJS({
           stop(e);
         }
       });
-      Map2.addInitHook("addHandler", "keyboard", Keyboard);
+      Map2.addInitHook("addHandler", "keyboard", Keyboard2);
       Map2.mergeOptions({
         // @section Mouse wheel options
         // @option scrollWheelZoom: Boolean|String = true
@@ -9563,7 +9565,7 @@ var require_leaflet_src = __commonJS({
       Map2.BoxZoom = BoxZoom;
       Map2.DoubleClickZoom = DoubleClickZoom;
       Map2.Drag = Drag;
-      Map2.Keyboard = Keyboard;
+      Map2.Keyboard = Keyboard2;
       Map2.ScrollWheelZoom = ScrollWheelZoom;
       Map2.TapHold = TapHold;
       Map2.TouchZoom = TouchZoom;
@@ -9866,6 +9868,486 @@ var CustomAlert = ({
     }
   );
 };
+var buttonVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button({
+  className,
+  variant = "default",
+  size = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? reactSlot.Slot : "button";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      "data-slot": "button",
+      "data-variant": variant,
+      "data-size": size,
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }
+  );
+}
+function normalizeBorder(border, defaultWidth = 4) {
+  if (!border) return null;
+  if (typeof border === "string") {
+    return { width: defaultWidth, color: border };
+  }
+  return { width: border.width ?? defaultWidth, color: border.color };
+}
+function generateBorderShadows(borders) {
+  if (!borders) return "none";
+  const shadows = [];
+  const allBorder = normalizeBorder(borders.all);
+  const left = normalizeBorder(borders.left) ?? allBorder;
+  const right = normalizeBorder(borders.right) ?? allBorder;
+  const top = normalizeBorder(borders.top) ?? allBorder;
+  const bottom = normalizeBorder(borders.bottom) ?? allBorder;
+  if (left?.color) {
+    shadows.push(`inset ${left.width}px 0 0 0 ${left.color}`);
+  }
+  if (right?.color) {
+    shadows.push(`inset -${right.width}px 0 0 0 ${right.color}`);
+  }
+  if (top?.color) {
+    shadows.push(`inset 0 ${top.width}px 0 0 ${top.color}`);
+  }
+  if (bottom?.color) {
+    shadows.push(`inset 0 -${bottom.width}px 0 0 ${bottom.color}`);
+  }
+  return shadows.length > 0 ? shadows.join(", ") : "none";
+}
+var Key = ({
+  label,
+  onClick,
+  onDoubleClick,
+  style,
+  disabled = false,
+  className,
+  shortcut,
+  children,
+  withLabel = true,
+  isActive = false,
+  fontSize = "text-sm",
+  icons,
+  borders,
+  // iconSize = 72,
+  iconClassName = "w-8 h-8"
+}) => {
+  let content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    withLabel && label,
+    shortcut && ` (${shortcut})`
+  ] });
+  if (children) content = /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
+  const borderShadow = generateBorderShadows(borders);
+  const hasBorders = borders && borderShadow !== "none";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Button,
+    {
+      disabled,
+      onDoubleClick,
+      onClick: (e) => onClick?.(label ?? e.currentTarget.textContent ?? ""),
+      style: {
+        ...style,
+        ...hasBorders && { boxShadow: borderShadow }
+      },
+      className: cn(
+        // Base
+        "shadow-md shadow-black/20",
+        "flex flex-1 items-center justify-center rounded-lg h-full w-full",
+        "font-mono font-bold transition-all duration-100",
+        "active:scale-95",
+        fontSize,
+        // Estados base (soft UI)
+        "border border-(--color-border)",
+        "bg-(--color-secondary-soft) text-(--color-foreground)",
+        // Hover
+        "hover:bg-(--color-accent-soft)",
+        // Active click (presionado)
+        "active:bg-(--color-primary) active:text-(--color-primary-foreground)",
+        // Estado activo (seleccionado)
+        isActive && "bg-(--color-primary) text-(--color-primary-foreground) border-(--color-primary)",
+        // Backspace especial
+        // label === '⌫' &&
+        //   'bg-(--color-destructive) text-white hover:opacity-90',
+        // Overflow hidden para que los bordes respeten el border-radius
+        "overflow-hidden",
+        className
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col justify-center items-center", children: [
+        icons && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-row justify-center text-3xl", children: icons.map((IconComponent, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          IconComponent,
+          {
+            className: iconClassName
+          },
+          index
+        )) }),
+        content
+      ] })
+    }
+  );
+};
+var applyCase = (label, upper) => {
+  if (!label || label.length !== 1 || !/[a-z]/.test(label)) return label;
+  return upper ? label.toUpperCase() : label;
+};
+var letter = (l, isUpper, handleKey) => ({
+  label: applyCase(l, isUpper),
+  onClick: handleKey,
+  className: "flex-1"
+});
+
+// src/components/custom/keyboard/keyboard-base.tsx
+var BaseKeyboard = class {
+  constructor() {
+  }
+};
+var KeyboardBuilder = ({
+  keys,
+  withCard = false,
+  className,
+  keyFontSize: keyFontSize3
+}) => {
+  const keyMap = React3.useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    keys?.forEach((row) => {
+      row.forEach((k) => {
+        if (k.shortcut) {
+          map.set(k.shortcut.toLowerCase(), k);
+        }
+      });
+    });
+    return map;
+  }, [keys]);
+  const triggerKey = React3.useCallback((pressedKey) => {
+    const key = keyMap.get(pressedKey.toLowerCase());
+    if (key && !key.disabled) {
+      key.onClick?.(pressedKey);
+      const keyboardEvent = new KeyboardEvent("keydown", {
+        key: pressedKey,
+        bubbles: true
+      });
+      window.dispatchEvent(keyboardEvent);
+    }
+  }, [keyMap]);
+  React3.useEffect(() => {
+    const handleKeyDown = (event) => {
+      const active = document.activeElement;
+      if (active instanceof HTMLInputElement || active instanceof HTMLTextAreaElement || active && active.getAttribute("contenteditable") === "true") {
+        console.log("\u{1F680} ~ Ignorando tecla porque el foco est\xE1 en un input:", event.key);
+        return;
+      }
+      triggerKey(event.key);
+      event.preventDefault();
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [triggerKey]);
+  const content = /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        `flex-1 grid grid-rows-${keys?.length} h-full`,
+        className
+      ),
+      children: keys?.map((row, ri) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-row gap-2 p-1 h-full", children: row.map((key, indx) => {
+        const handleClick = () => {
+          triggerKey(key.label ?? "");
+          key.onClick?.(key.label ?? "");
+          if (!key.shortcut) return;
+          triggerKey(key.shortcut);
+        };
+        return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          key.label == "" && !key.icons?.length && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${key.className}` }, indx),
+          (key.label != "" || key.icons?.length) && /* @__PURE__ */ jsxRuntime.jsx(
+            Key,
+            {
+              borders: {
+                left: key.disabled ? "grey" : "",
+                bottom: key.disabled ? "grey" : ""
+              },
+              label: key.label,
+              onClick: handleClick,
+              shortcut: key.shortcut,
+              icons: key.icons,
+              className: `${key.className} ${key.disabled ? "bg-muted-foreground h-full" : "h-full"}`,
+              iconClassName: key.iconClassName,
+              iconSize: key.iconSize,
+              fontSize: keyFontSize3,
+              isActive: key.isActive,
+              disabled: key.disabled,
+              children: key.children
+            },
+            indx
+          )
+        ] });
+      }) }, ri))
+    }
+  );
+  if (!withCard) return content;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full h-full m-0.5 p-1", className), children: content });
+};
+
+// src/components/custom/keyboard/keyboard-types.ts
+var KeyboardTypes = /* @__PURE__ */ ((KeyboardTypes2) => {
+  KeyboardTypes2["QWERTY"] = "qwerty";
+  KeyboardTypes2["NUMBER"] = "number";
+  KeyboardTypes2["QWERTY_NOT_CHARS"] = "qwerty_not_chars";
+  return KeyboardTypes2;
+})(KeyboardTypes || {});
+
+// src/components/custom/keyboard/providers/keyboard.store.ts
+var useKeyboardStore = zustand.create((set, get) => ({
+  activeInput: null,
+  inputs: {},
+  type: "qwerty" /* QWERTY */,
+  currentInputField: null,
+  setCurrentInputField(inputField) {
+    set({ currentInputField: inputField });
+    console.log("Current Input Field set to:", inputField);
+  },
+  isOpen: false,
+  setIsOpen() {
+    set({ isOpen: !get().isOpen });
+  },
+  registerInput: (id, initialValue = "") => set((state) => ({
+    inputs: {
+      ...state.inputs,
+      [id]: initialValue
+    }
+  })),
+  unregisterInput: (id) => set((state) => {
+    const newInputs = { ...state.inputs };
+    delete newInputs[id];
+    return { inputs: newInputs };
+  }),
+  focusInput: (id) => set({ activeInput: id }),
+  write: (char) => set((state) => {
+    let currentInputField = state.currentInputField;
+    if (currentInputField && currentInputField.field) {
+      currentInputField.field.value += char;
+      set({ currentInputField });
+      console.log("Updated currentInputField value:", state.currentInputField?.field?.value);
+    }
+    if (!state.activeInput) return state;
+    const current = state.inputs[state.activeInput] || "";
+    return {
+      inputs: {
+        ...state.inputs,
+        [state.activeInput]: current + char
+      }
+    };
+  }),
+  backspace: () => set((state) => {
+    if (!state.activeInput) return state;
+    const current = state.inputs[state.activeInput] || "";
+    return {
+      inputs: {
+        ...state.inputs,
+        [state.activeInput]: current.slice(0, -1)
+      }
+    };
+  }),
+  clear: () => set((state) => {
+    if (!state.activeInput) return state;
+    return {
+      inputs: {
+        ...state.inputs,
+        [state.activeInput]: ""
+      }
+    };
+  }),
+  setValue: (id, value) => set((state) => ({
+    inputs: {
+      ...state.inputs,
+      [id]: value
+    }
+  }))
+}));
+var QwertyKeyboard = class extends BaseKeyboard {
+  render() {
+    return /* @__PURE__ */ jsxRuntime.jsx(KeyboardQwerty, {});
+  }
+};
+var KeyboardQwerty = ({ onKeyPress, onEnter, keyFontSize: keyFontSize3 = "text-2xl", onDelete }) => {
+  const [shiftMode, setShiftMode] = React3.useState("off");
+  const [mode, setMode] = React3.useState("letters");
+  const lastShiftPress = React3.useRef(0);
+  const { currentInputField, write } = useKeyboardStore();
+  const isUpper = shiftMode !== "off";
+  const handleShift = () => {
+    const now = Date.now();
+    if (now - lastShiftPress.current < 300) {
+      setShiftMode((prev) => prev === "caps" ? "off" : "caps");
+    } else {
+      setShiftMode((prev) => prev === "once" ? "off" : "once");
+    }
+    lastShiftPress.current = now;
+  };
+  const handleKey = (key) => {
+    console.log("Key pressed:", key);
+    const output = isUpper ? key.toUpperCase() : key;
+    onKeyPress?.(output);
+    write(output);
+    if (shiftMode === "once") {
+      setShiftMode("off");
+    }
+  };
+  const handleCaps = () => {
+    setShiftMode((prev) => prev === "caps" ? "off" : "caps");
+  };
+  const shiftLabel = shiftMode === "caps" ? lucideReact.ArrowBigUpDash : lucideReact.ArrowBigUp;
+  const shiftActive = shiftMode !== "off";
+  if (mode === "symbols") {
+    const keys = [
+      ["!", "@", "#", "$", "%", "^", "&", "*", "(", ")"],
+      ["~", "`", "|", "\\", "/", "{", "}", "[", "]"],
+      ["+", "=", "<", ">", "?", "'", '"', ":", ";"]
+    ].map(
+      (row) => row.map((k) => ({
+        label: k,
+        onClick: () => handleKey(k)
+      }))
+    );
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      KeyboardBuilder,
+      {
+        className: "w-full h-full",
+        keyFontSize: keyFontSize3,
+        keys: [
+          ...keys,
+          [
+            { label: "ABC", onClick: () => setMode("letters"), className: "flex-[2]" },
+            { label: " ", onClick: () => handleKey(" "), className: "flex-[4]" },
+            { label: "Enter", onClick: onEnter, className: "flex-[2] bg-green-200 " }
+          ]
+        ]
+      }
+    ) });
+  }
+  const fila1 = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"].map((l) => letter(l, isUpper, handleKey));
+  const fila2 = ["q", "w", "e", "r", "t", "y", "u", "i", "o", "p"].map((l) => letter(l, isUpper, handleKey));
+  const fila3 = ["a", "s", "d", "f", "g", "h", "j", "k", "l"].map((l) => letter(l, isUpper, handleKey));
+  const fila4 = ["z", "x", "c", "v", "b", "n", "m"].map((l) => letter(l, isUpper, handleKey));
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full h-full flex flex-col", children: [
+    currentInputField && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-3 h-full flex-1 flex flex-row text-2xl font-bold justify-center text-center items-center gap-2 rounded-xl border-2 transition-all  outline-none border-amber-400 bg-amber-50 ", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+      " ",
+      currentInputField.field?.value,
+      " "
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      KeyboardBuilder,
+      {
+        className: "w-full h-full flex-3",
+        keyFontSize: keyFontSize3,
+        keys: [
+          [
+            { label: "esc", onClick: () => {
+            }, className: "bg-red-200" },
+            ...fila1
+          ],
+          [
+            { label: "tab", onClick: () => {
+            } },
+            ...fila2
+            // { icons:[Delete], onClick: backspace, className: 'text-xs' },
+          ],
+          [
+            { label: "caps", onClick: handleCaps },
+            ...fila3
+          ],
+          [
+            {
+              label: "",
+              icons: [shiftLabel],
+              onClick: handleShift,
+              className: "flex-1",
+              isActive: shiftActive
+            },
+            ...fila4,
+            { label: ".", onClick: () => handleKey(".") },
+            { label: "-", onClick: () => handleKey("-") },
+            { label: "_", onClick: () => handleKey("_") }
+          ],
+          [
+            { label: "?123", onClick: () => setMode("symbols"), className: "flex-[2]" },
+            { label: " ", onClick: () => handleKey(" "), className: "flex-[4]" },
+            { label: "Enter", onClick: onEnter, className: "flex-[2] bg-green-200" }
+          ]
+        ]
+      }
+    )
+  ] });
+};
+
+// src/components/custom/form/inputs/base/definitions.ts
+var flattenFields = (fields, onAnyFieldChange) => {
+  const result = [];
+  for (const field of fields) {
+    if (Array.isArray(field)) {
+      result.push(...flattenFields(field));
+    } else if (field.fields) {
+      result.push(...flattenFields(field.fields));
+    } else {
+      if (onAnyFieldChange) field.onAnyFieldChange = (data) => onAnyFieldChange(data);
+      result.push(field);
+    }
+  }
+  return result;
+};
+var TextInputType = /* @__PURE__ */ ((TextInputType2) => {
+  TextInputType2["DEFAULT"] = "default";
+  TextInputType2["NUMBER"] = "number";
+  TextInputType2["EMAIL"] = "email";
+  TextInputType2["PHONE"] = "phone";
+  TextInputType2["PASSWORD"] = "password";
+  return TextInputType2;
+})(TextInputType || {});
+var keyboardMap = {
+  ["qwerty" /* QWERTY */]: QwertyKeyboard,
+  ["qwerty_not_chars" /* QWERTY_NOT_CHARS */]: QwertyKeyboard,
+  ["number" /* NUMBER */]: QwertyKeyboard
+};
+var KeyboardFactory = class {
+  static create(typeKeyboard, input) {
+    const inputKbType = input?.keyboardType;
+    let keyboardType = typeKeyboard ?? "qwerty" /* QWERTY */;
+    if (inputKbType) {
+      if (inputKbType == "number" /* NUMBER */) keyboardType = "number" /* NUMBER */;
+    }
+    const keyboardClass = keyboardMap[keyboardType] ?? QwertyKeyboard;
+    const instance = new keyboardClass();
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: instance.render() });
+  }
+};
 
 // src/components/custom/form/input-errors.ts
 var validationMessages = {
@@ -9936,30 +10418,6 @@ var isValidField = (input, form, defaultValue) => {
   return !fieldState.error && value !== void 0 && value !== "";
 };
 
-// src/components/custom/form/inputs/base/definitions.ts
-var flattenFields = (fields, onAnyFieldChange) => {
-  const result = [];
-  for (const field of fields) {
-    if (Array.isArray(field)) {
-      result.push(...flattenFields(field));
-    } else if (field.fields) {
-      result.push(...flattenFields(field.fields));
-    } else {
-      if (onAnyFieldChange) field.onAnyFieldChange = (data) => onAnyFieldChange(data);
-      result.push(field);
-    }
-  }
-  return result;
-};
-var TextInputType = /* @__PURE__ */ ((TextInputType2) => {
-  TextInputType2["DEFAULT"] = "default";
-  TextInputType2["NUMBER"] = "number";
-  TextInputType2["EMAIL"] = "email";
-  TextInputType2["PHONE"] = "phone";
-  TextInputType2["PASSWORD"] = "password";
-  return TextInputType2;
-})(TextInputType || {});
-
 // src/components/custom/form/inputs/base/input-types.ts
 var InputTypes = /* @__PURE__ */ ((InputTypes2) => {
   InputTypes2["HIDDEN"] = "hidden";
@@ -10106,80 +10564,278 @@ function AccordionContent({
     }
   );
 }
-var badgeVariants = classVarianceAuthority.cva(
-  "inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
-  {
-    variants: {
-      variant: {
-        default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
-        secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
-        destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
-      }
-    },
-    defaultVariants: {
-      variant: "default"
-    }
-  }
-);
-function Badge({
+function AlertDialog({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(radixUi.AlertDialog.Root, { "data-slot": "alert-dialog", ...props });
+}
+function AlertDialogTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(radixUi.AlertDialog.Trigger, { "data-slot": "alert-dialog-trigger", ...props });
+}
+function AlertDialogPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(radixUi.AlertDialog.Portal, { "data-slot": "alert-dialog-portal", ...props });
+}
+function AlertDialogOverlay({
   className,
-  variant,
-  asChild = false,
   ...props
 }) {
-  const Comp = asChild ? reactSlot.Slot : "span";
   return /* @__PURE__ */ jsxRuntime.jsx(
-    Comp,
+    radixUi.AlertDialog.Overlay,
     {
-      "data-slot": "badge",
-      className: cn(badgeVariants({ variant }), className),
-      ...props
-    }
+      "data-slot": "alert-dialog-overlay",
+      className: cn(
+        "fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0",
+        className
+      ),
+      ...props
+    }
   );
 }
-var buttonVariants = classVarianceAuthority.cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+function AlertDialogContent({
+  className,
+  size = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(AlertDialogPortal, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(AlertDialogOverlay, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      radixUi.AlertDialog.Content,
+      {
+        "data-slot": "alert-dialog-content",
+        "data-size": size,
+        className: cn(
+          "group/alert-dialog-content fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 data-[size=sm]:max-w-xs data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[size=default]:sm:max-w-lg",
+          className
+        ),
+        ...props
+      }
+    )
+  ] });
+}
+function AlertDialogHeader({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-header",
+      className: cn(
+        "grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogFooter({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-footer",
+      className: cn(
+        "flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.AlertDialog.Title,
+    {
+      "data-slot": "alert-dialog-title",
+      className: cn(
+        "text-lg font-semibold sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.AlertDialog.Description,
+    {
+      "data-slot": "alert-dialog-description",
+      className: cn("text-sm text-muted-foreground", className),
+      ...props
+    }
+  );
+}
+function AlertDialogMedia({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "alert-dialog-media",
+      className: cn(
+        "mb-2 inline-flex size-16 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDialogAction({
+  className,
+  variant = "default",
+  size = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Button, { variant, size, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.AlertDialog.Action,
+    {
+      "data-slot": "alert-dialog-action",
+      className: cn(className),
+      ...props
+    }
+  ) });
+}
+function AlertDialogCancel({
+  className,
+  variant = "outline",
+  size = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Button, { variant, size, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.AlertDialog.Cancel,
+    {
+      "data-slot": "alert-dialog-cancel",
+      className: cn(className),
+      ...props
+    }
+  ) });
+}
+var badgeVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/90",
-        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-        link: "text-primary underline-offset-4 hover:underline"
-      },
-      size: {
-        default: "h-9 px-4 py-2 has-[>svg]:px-3",
-        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
-        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
-        icon: "size-9",
-        "icon-sm": "size-8",
-        "icon-lg": "size-10"
+        default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
       }
     },
     defaultVariants: {
-      variant: "default",
-      size: "default"
+      variant: "default"
     }
   }
 );
-function Button({
+function Badge({
   className,
-  variant = "default",
-  size = "default",
+  variant,
   asChild = false,
   ...props
 }) {
-  const Comp = asChild ? reactSlot.Slot : "button";
+  const Comp = asChild ? reactSlot.Slot : "span";
   return /* @__PURE__ */ jsxRuntime.jsx(
     Comp,
     {
-      "data-slot": "button",
-      "data-variant": variant,
-      "data-size": size,
-      className: cn(buttonVariants({ variant, size, className })),
+      "data-slot": "badge",
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+function Separator({
+  className,
+  orientation: orientation2 = "horizontal",
+  decorative = true,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    SeparatorPrimitive__namespace.Root,
+    {
+      "data-slot": "separator",
+      decorative,
+      orientation: orientation2,
+      className: cn(
+        "bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var buttonGroupVariants = classVarianceAuthority.cva(
+  "flex w-fit items-stretch [&>*]:focus-visible:z-10 [&>*]:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2",
+  {
+    variants: {
+      orientation: {
+        horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
+        vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
+      }
+    },
+    defaultVariants: {
+      orientation: "horizontal"
+    }
+  }
+);
+function ButtonGroup({
+  className,
+  orientation: orientation2,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      role: "group",
+      "data-slot": "button-group",
+      "data-orientation": orientation2,
+      className: cn(buttonGroupVariants({ orientation: orientation2 }), className),
+      ...props
+    }
+  );
+}
+function ButtonGroupText({
+  className,
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? reactSlot.Slot : "div";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      className: cn(
+        "bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ButtonGroupSeparator({
+  className,
+  orientation: orientation2 = "vertical",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Separator,
+    {
+      "data-slot": "button-group-separator",
+      orientation: orientation2,
+      className: cn(
+        "bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto",
+        className
+      ),
       ...props
     }
   );
@@ -10657,48 +11313,182 @@ function DialogDescription({
     }
   );
 }
-function Label({
+function Command({
   className,
   ...props
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    LabelPrimitive__namespace.Root,
+    cmdk.Command,
     {
-      "data-slot": "label",
+      "data-slot": "command",
       className: cn(
-        "flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
+        "bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md",
         className
       ),
       ...props
     }
   );
 }
-function Separator({
+function CommandDialog({
+  title = "Command Palette",
+  description = "Search for a command to run...",
+  children,
   className,
-  orientation: orientation2 = "horizontal",
-  decorative = true,
+  showCloseButton = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    SeparatorPrimitive__namespace.Root,
-    {
-      "data-slot": "separator",
-      decorative,
-      orientation: orientation2,
-      className: cn(
-        "bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function FieldSet({ className, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "fieldset",
-    {
-      "data-slot": "field-set",
-      className: cn(
+  return /* @__PURE__ */ jsxRuntime.jsxs(Dialog, { ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(DialogHeader, { className: "sr-only", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { children: title }),
+      /* @__PURE__ */ jsxRuntime.jsx(DialogDescription, { children: description })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      DialogContent,
+      {
+        className: cn("overflow-hidden p-0", className),
+        showCloseButton,
+        children: /* @__PURE__ */ jsxRuntime.jsx(Command, { className: "[&_[cmdk-group-heading]]:text-muted-foreground **:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
+      }
+    )
+  ] });
+}
+function CommandInput({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-slot": "command-input-wrapper",
+      className: "flex h-9 items-center gap-2 border-b px-3",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SearchIcon, { className: "size-4 shrink-0 opacity-50" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          cmdk.Command.Input,
+          {
+            "data-slot": "command-input",
+            className: cn(
+              "placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50",
+              className
+            ),
+            ...props
+          }
+        )
+      ]
+    }
+  );
+}
+function CommandList({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    cmdk.Command.List,
+    {
+      "data-slot": "command-list",
+      className: cn(
+        "max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CommandEmpty({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    cmdk.Command.Empty,
+    {
+      "data-slot": "command-empty",
+      className: "py-6 text-center text-sm",
+      ...props
+    }
+  );
+}
+function CommandGroup({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    cmdk.Command.Group,
+    {
+      "data-slot": "command-group",
+      className: cn(
+        "text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CommandSeparator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    cmdk.Command.Separator,
+    {
+      "data-slot": "command-separator",
+      className: cn("bg-border -mx-1 h-px", className),
+      ...props
+    }
+  );
+}
+function CommandItem({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    cmdk.Command.Item,
+    {
+      "data-slot": "command-item",
+      className: cn(
+        "data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CommandShortcut({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      "data-slot": "command-shortcut",
+      className: cn(
+        "text-muted-foreground ml-auto text-xs tracking-widest",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function Label({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    LabelPrimitive__namespace.Root,
+    {
+      "data-slot": "label",
+      className: cn(
+        "flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function FieldSet({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "fieldset",
+    {
+      "data-slot": "field-set",
+      className: cn(
         "flex flex-col gap-6",
         "has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3",
         className
@@ -11510,81 +12300,353 @@ function SelectScrollDownButton({
     }
   );
 }
-var Toaster = ({ ...props }) => {
-  const { theme = "system" } = nextThemes.useTheme();
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    sonner.Toaster,
-    {
-      theme,
-      className: "toaster group",
-      style: {
-        "--normal-bg": "var(--popover)",
-        "--normal-text": "var(--popover-foreground)",
-        "--normal-border": "var(--border)"
-      },
-      ...props
-    }
-  );
-};
-function Switch({
+function Sheet({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(radixUi.Dialog.Root, { "data-slot": "sheet", ...props });
+}
+function SheetPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(radixUi.Dialog.Portal, { "data-slot": "sheet-portal", ...props });
+}
+function SheetOverlay({
   className,
   ...props
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    SwitchPrimitive__namespace.Root,
+    radixUi.Dialog.Overlay,
     {
-      "data-slot": "switch",
+      "data-slot": "sheet-overlay",
       className: cn(
-        "peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
+        "fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0",
         className
       ),
-      ...props,
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        SwitchPrimitive__namespace.Thumb,
-        {
-          "data-slot": "switch-thumb",
-          className: cn(
-            "bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
-          )
-        }
-      )
+      ...props
     }
   );
 }
-function TooltipProvider({
-  delayDuration = 0,
+function SheetContent({
+  className,
+  children,
+  side = "right",
+  showCloseButton = true,
   ...props
 }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(SheetPortal, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(SheetOverlay, {}),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      radixUi.Dialog.Content,
+      {
+        "data-slot": "sheet-content",
+        className: cn(
+          "fixed z-50 flex flex-col gap-4 bg-background shadow-lg transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500",
+          side === "right" && "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
+          side === "left" && "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
+          side === "top" && "inset-x-0 top-0 h-auto border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+          side === "bottom" && "inset-x-0 bottom-0 h-auto border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          showCloseButton && /* @__PURE__ */ jsxRuntime.jsxs(radixUi.Dialog.Close, { className: "absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, { className: "size-4" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function SheetHeader({ className, ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    TooltipPrimitive__namespace.Provider,
+    "div",
     {
-      "data-slot": "tooltip-provider",
-      delayDuration,
+      "data-slot": "sheet-header",
+      className: cn("flex flex-col gap-1.5 p-4", className),
       ...props
     }
   );
 }
-function Tooltip({
+function SheetFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "sheet-footer",
+      className: cn("mt-auto flex flex-col gap-2 p-4", className),
+      ...props
+    }
+  );
+}
+function SheetTitle({
+  className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Root, { "data-slot": "tooltip", ...props }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.Dialog.Title,
+    {
+      "data-slot": "sheet-title",
+      className: cn("font-semibold text-foreground", className),
+      ...props
+    }
+  );
 }
-function TooltipTrigger({
+function SheetDescription({
+  className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { "data-slot": "tooltip-trigger", ...props });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.Dialog.Description,
+    {
+      "data-slot": "sheet-description",
+      className: cn("text-sm text-muted-foreground", className),
+      ...props
+    }
+  );
 }
-function TooltipContent({
+function Slider({
   className,
-  sideOffset = 0,
-  children,
+  defaultValue,
+  value,
+  min = 0,
+  max = 100,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-    TooltipPrimitive__namespace.Content,
+  const _values = React3__namespace.useMemo(
+    () => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
+    [value, defaultValue, min, max]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    SliderPrimitive__namespace.Root,
     {
-      "data-slot": "tooltip-content",
-      sideOffset,
+      "data-slot": "slider",
+      defaultValue,
+      value,
+      min,
+      max,
+      className: cn(
+        "relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          SliderPrimitive__namespace.Track,
+          {
+            "data-slot": "slider-track",
+            className: cn(
+              "bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              SliderPrimitive__namespace.Range,
+              {
+                "data-slot": "slider-range",
+                className: cn(
+                  "bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
+                )
+              }
+            )
+          }
+        ),
+        Array.from({ length: _values.length }, (_, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          SliderPrimitive__namespace.Thumb,
+          {
+            "data-slot": "slider-thumb",
+            className: "border-primary ring-ring/50 block size-4 shrink-0 rounded-full border bg-white shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
+          },
+          index
+        ))
+      ]
+    }
+  );
+}
+var Toaster = ({ ...props }) => {
+  const { theme = "system" } = nextThemes.useTheme();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    sonner.Toaster,
+    {
+      theme,
+      className: "toaster group",
+      style: {
+        "--normal-bg": "var(--popover)",
+        "--normal-text": "var(--popover-foreground)",
+        "--normal-border": "var(--border)"
+      },
+      ...props
+    }
+  );
+};
+function Stepper({ steps, currentStep, clickable = false, onStepClick }) {
+  const handleStepClick = (stepNumber) => {
+    if (clickable && onStepClick) {
+      onStepClick(stepNumber);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-row gap-4 items-center justify-around", children: steps.map((step, index) => {
+    const stepNumber = index + 1;
+    const isCompleted = stepNumber < currentStep;
+    const isCurrent = stepNumber === currentStep;
+    const isUpcoming = stepNumber > currentStep;
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 items-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            onClick: () => handleStepClick(stepNumber),
+            className: cn(
+              "flex size-10 items-center shadow-lg  justify-center rounded-full border-2 transition-all duration-300",
+              isCompleted && "border-primary bg-primary text-primary-foreground",
+              isCurrent && "border-primary bg-background text-primary scale-110",
+              isUpcoming && "border-muted-foreground/60 bg-background border-b text-muted-foreground",
+              clickable && "cursor-pointer hover:scale-125 hover:shadow-xl",
+              !clickable && "cursor-default"
+            ),
+            children: isCompleted ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "size-5" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold", children: stepNumber })
+          }
+        ),
+        step.title && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 text-center", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              className: cn(
+                "text-sm font-medium transition-colors",
+                (isCompleted || isCurrent) && "text-foreground",
+                isUpcoming && "text-muted-foreground"
+              ),
+              children: step.title
+            }
+          ),
+          step.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-xs text-muted-foreground max-w-[120px]", children: step.description })
+        ] })
+      ] }),
+      index < steps.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-2 flex-1 mb-8", children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn(
+            "h-0.5 w-full transition-all duration-300",
+            stepNumber < currentStep ? "bg-primary" : "bg-muted-foreground/30"
+          )
+        }
+      ) })
+    ] }, index);
+  }) }) });
+}
+function Switch({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    SwitchPrimitive__namespace.Root,
+    {
+      "data-slot": "switch",
+      className: cn(
+        "peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        SwitchPrimitive__namespace.Thumb,
+        {
+          "data-slot": "switch-thumb",
+          className: cn(
+            "bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
+          )
+        }
+      )
+    }
+  );
+}
+function Tabs({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Root,
+    {
+      "data-slot": "tabs",
+      className: cn("flex flex-col gap-2", className),
+      ...props
+    }
+  );
+}
+function TabsList({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.List,
+    {
+      "data-slot": "tabs-list",
+      className: cn(
+        "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TabsTrigger({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Trigger,
+    {
+      "data-slot": "tabs-trigger",
+      className: cn(
+        "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TabsContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Content,
+    {
+      "data-slot": "tabs-content",
+      className: cn("flex-1 outline-none", className),
+      ...props
+    }
+  );
+}
+function TooltipProvider({
+  delayDuration = 0,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TooltipPrimitive__namespace.Provider,
+    {
+      "data-slot": "tooltip-provider",
+      delayDuration,
+      ...props
+    }
+  );
+}
+function Tooltip({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Root, { "data-slot": "tooltip", ...props }) });
+}
+function TooltipTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { "data-slot": "tooltip-trigger", ...props });
+}
+function TooltipContent({
+  className,
+  sideOffset = 0,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+    TooltipPrimitive__namespace.Content,
+    {
+      "data-slot": "tooltip-content",
+      sideOffset,
       className: cn(
         "bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
         className
@@ -11741,71 +12803,6 @@ var AccordionGroupedSwitches = ({ form, input, groups = [], onChange, isSubmitti
     input.name
   );
 };
-var buttonGroupVariants = classVarianceAuthority.cva(
-  "flex w-fit items-stretch [&>*]:focus-visible:z-10 [&>*]:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2",
-  {
-    variants: {
-      orientation: {
-        horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
-        vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
-      }
-    },
-    defaultVariants: {
-      orientation: "horizontal"
-    }
-  }
-);
-function ButtonGroup({
-  className,
-  orientation: orientation2,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      role: "group",
-      "data-slot": "button-group",
-      "data-orientation": orientation2,
-      className: cn(buttonGroupVariants({ orientation: orientation2 }), className),
-      ...props
-    }
-  );
-}
-function ButtonGroupText({
-  className,
-  asChild = false,
-  ...props
-}) {
-  const Comp = asChild ? reactSlot.Slot : "div";
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    Comp,
-    {
-      className: cn(
-        "bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function ButtonGroupSeparator({
-  className,
-  orientation: orientation2 = "vertical",
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    Separator,
-    {
-      "data-slot": "button-group-separator",
-      orientation: orientation2,
-      className: cn(
-        "bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto",
-        className
-      ),
-      ...props
-    }
-  );
-}
 var ButtonGroupInput = class extends BaseInput {
   render() {
     const { input, form, isSubmitting } = this;
@@ -12046,168 +13043,14 @@ var ColorComp = React3__namespace.default.forwardRef(
             children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 w-4 border border-border rounded-sm", style: { backgroundColor: color.hex, width: 20, height: 20 } }),
               /* @__PURE__ */ jsxRuntime.jsx("span", { children: color.hex })
-            ] })
-          }
-        ) }),
-        /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-auto p-3", align: "start", children: /* @__PURE__ */ jsxRuntime.jsx(reactColorPalette.ColorPicker, { color, onChange: handlePickerChange, hideInput }) })
-      ] })
-    ] });
-  }
-);
-function Command({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    cmdk.Command,
-    {
-      "data-slot": "command",
-      className: cn(
-        "bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function CommandDialog({
-  title = "Command Palette",
-  description = "Search for a command to run...",
-  children,
-  className,
-  showCloseButton = true,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(Dialog, { ...props, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(DialogHeader, { className: "sr-only", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { children: title }),
-      /* @__PURE__ */ jsxRuntime.jsx(DialogDescription, { children: description })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      DialogContent,
-      {
-        className: cn("overflow-hidden p-0", className),
-        showCloseButton,
-        children: /* @__PURE__ */ jsxRuntime.jsx(Command, { className: "[&_[cmdk-group-heading]]:text-muted-foreground **:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
-      }
-    )
-  ] });
-}
-function CommandInput({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      "data-slot": "command-input-wrapper",
-      className: "flex h-9 items-center gap-2 border-b px-3",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SearchIcon, { className: "size-4 shrink-0 opacity-50" }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          cmdk.Command.Input,
-          {
-            "data-slot": "command-input",
-            className: cn(
-              "placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50",
-              className
-            ),
-            ...props
-          }
-        )
-      ]
-    }
-  );
-}
-function CommandList({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    cmdk.Command.List,
-    {
-      "data-slot": "command-list",
-      className: cn(
-        "max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function CommandEmpty({
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    cmdk.Command.Empty,
-    {
-      "data-slot": "command-empty",
-      className: "py-6 text-center text-sm",
-      ...props
-    }
-  );
-}
-function CommandGroup({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    cmdk.Command.Group,
-    {
-      "data-slot": "command-group",
-      className: cn(
-        "text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function CommandSeparator({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    cmdk.Command.Separator,
-    {
-      "data-slot": "command-separator",
-      className: cn("bg-border -mx-1 h-px", className),
-      ...props
-    }
-  );
-}
-function CommandItem({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    cmdk.Command.Item,
-    {
-      "data-slot": "command-item",
-      className: cn(
-        "data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function CommandShortcut({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "span",
-    {
-      "data-slot": "command-shortcut",
-      className: cn(
-        "text-muted-foreground ml-auto text-xs tracking-widest",
-        className
-      ),
-      ...props
-    }
-  );
-}
+            ] })
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-auto p-3", align: "start", children: /* @__PURE__ */ jsxRuntime.jsx(reactColorPalette.ColorPicker, { color, onChange: handlePickerChange, hideInput }) })
+      ] })
+    ] });
+  }
+);
 var ComboboxInput = class extends BaseInput {
   render() {
     const { input, form, isSubmitting } = this;
@@ -12789,6 +13632,7 @@ var CustomInputGroup = ({
   isValid,
   autoCapitalize = "none"
 }) => {
+  const withKeyboard = input.withKeyboard;
   const groupConfig = input.inputGroupConfig;
   const infoTooltip = input?.infoTooltip;
   const autoValidate = groupConfig?.autoValidIcons ?? input.zodType ? true : false;
@@ -12803,6 +13647,8 @@ var CustomInputGroup = ({
   const isPasswordField = input.keyboardType === "password" /* PASSWORD */;
   const isNumberField = input.keyboardType === "number" /* NUMBER */;
   const showInputGroupAddons = iconsRight.length > 0 || textRight || autoValidate || infoTooltip || isPasswordField;
+  const setIsOpen = useKeyboardStore((state) => state.setIsOpen);
+  const setCurrentInputField = useKeyboardStore((state) => state.setCurrentInputField);
   const applyMask = (value2, mask) => {
     if (!mask) return value2;
     if (typeof mask === "string") {
@@ -12872,6 +13718,7 @@ var CustomInputGroup = ({
         placeholder: input.placeHolder,
         disabled: input.disabled || isSubmitting,
         onBlur: field?.onBlur,
+        onFocus: () => setCurrentInputField({ input, field }),
         name: field?.name,
         ref: field?.ref,
         type: isPasswordField && !showPassword ? "password" : isNumberField ? "number" : "text",
@@ -12917,6 +13764,18 @@ var CustomInputGroup = ({
           children: showPassword ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.EyeOff, { size: 20 }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Eye, { size: 20 })
         }
       ),
+      withKeyboard && /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          className: "text-2xl",
+          onClick: () => {
+            setIsOpen();
+            setCurrentInputField({ input, field });
+          },
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Keyboard, {})
+        }
+      ),
       autoValidate && /* @__PURE__ */ jsxRuntime.jsx("div", { children: isSubmitting ? iconLoadingState : isValid ? iconValidState : iconInvalidState })
     ] })
   ] });
@@ -13342,64 +14201,6 @@ var FieldRepeater = ({ form, input, isSubmitting }) => {
     }
   );
 };
-function Tabs({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    TabsPrimitive__namespace.Root,
-    {
-      "data-slot": "tabs",
-      className: cn("flex flex-col gap-2", className),
-      ...props
-    }
-  );
-}
-function TabsList({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    TabsPrimitive__namespace.List,
-    {
-      "data-slot": "tabs-list",
-      className: cn(
-        "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function TabsTrigger({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    TabsPrimitive__namespace.Trigger,
-    {
-      "data-slot": "tabs-trigger",
-      className: cn(
-        "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function TabsContent({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    TabsPrimitive__namespace.Content,
-    {
-      "data-slot": "tabs-content",
-      className: cn("flex-1 outline-none", className),
-      ...props
-    }
-  );
-}
 var RepeaterTabsInput = class extends BaseInput {
   render() {
     const { input, form, isSubmitting } = this;
@@ -13686,62 +14487,6 @@ var FieldSimpleCheckList = ({ input, value, onChange, isSubmitting }) => {
   ] });
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: formField });
 };
-function Slider({
-  className,
-  defaultValue,
-  value,
-  min = 0,
-  max = 100,
-  ...props
-}) {
-  const _values = React3__namespace.useMemo(
-    () => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
-    [value, defaultValue, min, max]
-  );
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    SliderPrimitive__namespace.Root,
-    {
-      "data-slot": "slider",
-      defaultValue,
-      value,
-      min,
-      max,
-      className: cn(
-        "relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          SliderPrimitive__namespace.Track,
-          {
-            "data-slot": "slider-track",
-            className: cn(
-              "bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
-            ),
-            children: /* @__PURE__ */ jsxRuntime.jsx(
-              SliderPrimitive__namespace.Range,
-              {
-                "data-slot": "slider-range",
-                className: cn(
-                  "bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
-                )
-              }
-            )
-          }
-        ),
-        Array.from({ length: _values.length }, (_, index) => /* @__PURE__ */ jsxRuntime.jsx(
-          SliderPrimitive__namespace.Thumb,
-          {
-            "data-slot": "slider-thumb",
-            className: "border-primary ring-ring/50 block size-4 shrink-0 rounded-full border bg-white shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
-          },
-          index
-        ))
-      ]
-    }
-  );
-}
 var SliderInput = class extends BaseInput {
   render() {
     const { input, form, isSubmitting } = this;
@@ -15926,6 +16671,167 @@ var FormFieldsGrid = ({
     );
   }) });
 };
+var CustomSheet = ({ title = "", children, childrenHeader, isOpen, className, side = "bottom" }) => {
+  const setIsOpen = useKeyboardStore((state) => state.setIsOpen);
+  const storeIsOpen = useKeyboardStore((state) => state.isOpen);
+  const controlledIsOpen = typeof isOpen === "boolean" ? isOpen : storeIsOpen;
+  return /* @__PURE__ */ jsxRuntime.jsx(Sheet, { open: controlledIsOpen, onOpenChange: setIsOpen, children: /* @__PURE__ */ jsxRuntime.jsxs(SheetContent, { side, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(SheetHeader, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(SheetTitle, { children: title }),
+      /* @__PURE__ */ jsxRuntime.jsxs(SheetDescription, { children: [
+        childrenHeader,
+        children
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(SheetFooter, {})
+  ] }) });
+};
+var DynamicDialog = ({
+  trigger,
+  title = "Are you absolutely sure?",
+  description = "This action cannot be undone.",
+  cancelText = "Cancel",
+  actionText = "Confirmar",
+  className = "bg-red-600 text-white font-bold",
+  variant = "info",
+  onAction,
+  children,
+  listBtnConfig = [],
+  btnGroupDirection = "flex-end",
+  submitBtnClass = "h-16",
+  iconSize = "w-16 h-16",
+  btnHeightClass = "h-16",
+  showActionBtn = true
+}) => {
+  const getVariantStyles = () => {
+    switch (variant) {
+      case "info":
+        return {
+          container: "!bg-blue-100 !text-blue-800 dark:!bg-blue-900 dark:!text-blue-200",
+          border: "!border-blue-500/30 dark:!border-blue-300/30",
+          media: "bg-blue-500/10 dark:bg-blue-300/10",
+          action: "text-blue-200 bg-blue-500 dark:bg-blue-300",
+          icon: "text-blue-500 dark:text-blue-300",
+          iconNode: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageCircleWarning, { className: iconSize })
+        };
+      case "warning":
+        return {
+          container: "!bg-yellow-100 !text-yellow-800 dark:!bg-yellow-900 dark:!text-yellow-200",
+          border: "!border-yellow-500/30 dark:!border-yellow-300/30",
+          media: "bg-yellow-500/10 dark:bg-yellow-300/10",
+          action: "text-yellow-200 bg-yellow-500 dark:bg-yellow-300",
+          icon: "text-yellow-500 dark:text-yellow-300",
+          iconNode: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.TriangleAlert, { className: iconSize })
+        };
+      case "error":
+      case "delete":
+        return {
+          container: "!bg-red-100 !text-red-800 dark:!bg-red-900 dark:!text-red-200",
+          border: "!border-red-500/30 dark:!border-red-300/30",
+          media: "bg-red-500/10 dark:bg-red-300/10",
+          action: "text-red-200 bg-red-500 dark:bg-red-300",
+          icon: "text-red-500 dark:text-red-300",
+          iconNode: variant === "delete" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2Icon, { className: iconSize }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.OctagonX, { className: iconSize })
+        };
+      case "success":
+        return {
+          container: "!bg-green-100 !text-green-800 dark:!bg-green-900 dark:!text-green-200",
+          border: "!border-green-500/30 dark:!border-green-300/30",
+          media: "bg-green-500/10 dark:bg-green-300/10",
+          action: "text-green-200 bg-green-500 dark:bg-green-300",
+          icon: "text-green-500 dark:text-green-300",
+          iconNode: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleCheck, { className: iconSize })
+        };
+      case "confirm":
+        return {
+          container: "!bg-purple-100 !text-purple-800 dark:!bg-purple-900 dark:!text-purple-200",
+          border: "!border-purple-500/30 dark:!border-purple-300/30",
+          media: "bg-purple-500/10 dark:bg-purple-300/10",
+          action: "text-purple-200 bg-purple-500 dark:bg-purple-300",
+          icon: "text-purple-500 dark:text-purple-300",
+          iconNode: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleQuestionMark, { className: iconSize })
+        };
+    }
+  };
+  const styles = getVariantStyles();
+  console.log("onAction", onAction);
+  return /* @__PURE__ */ jsxRuntime.jsxs(AlertDialog, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(AlertDialogTrigger, { asChild: true, children: trigger || /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "outline", children: "Show Dialog" }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      AlertDialogContent,
+      {
+        className: cn(
+          "w-50 h-fit font-mono border-x-8",
+          styles.container,
+          styles.border
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(AlertDialogHeader, { className: "justify-center w-full text-center", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center w-full", children: /* @__PURE__ */ jsxRuntime.jsx(
+              AlertDialogMedia,
+              {
+                className: cn(
+                  styles.media,
+                  "rounded-full flex items-center justify-center",
+                  iconSize
+                  // 🔥 ahora controla también el contenedor
+                ),
+                children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.icon, children: styles.iconNode })
+              }
+            ) }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center w-full", children: /* @__PURE__ */ jsxRuntime.jsx(AlertDialogTitle, { className: "text-2xl", children: title }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(AlertDialogDescription, { className: "text-xl text-center", children: description })
+          ] }),
+          children,
+          /* @__PURE__ */ jsxRuntime.jsx(AlertDialogFooter, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+            ButtonGroup,
+            {
+              className: "flex w-full",
+              style: {
+                justifyContent: btnGroupDirection,
+                alignItems: "center"
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(AlertDialogCancel, { className: cn("flex-1", btnHeightClass), children: cancelText }),
+                listBtnConfig.map((btn, key) => /* @__PURE__ */ jsxRuntime.jsx(
+                  Button,
+                  {
+                    type: btn.btnType,
+                    size: "lg",
+                    className: cn(btnHeightClass, submitBtnClass),
+                    variant: btn.variant,
+                    onClick: btn.onClick,
+                    disabled: btn.disabled,
+                    children: btn.label
+                  },
+                  key
+                )),
+                onAction && showActionBtn && /* @__PURE__ */ jsxRuntime.jsx(
+                  AlertDialogAction,
+                  {
+                    onClick: (e) => {
+                      e.preventDefault();
+                      if (onAction) {
+                        onAction();
+                      }
+                    },
+                    className: cn(
+                      "flex-1",
+                      btnHeightClass,
+                      className,
+                      styles.action
+                    ),
+                    children: actionText
+                  }
+                )
+              ]
+            }
+          ) })
+        ]
+      }
+    )
+  ] });
+};
 var DynamicForm = ({
   formTitle,
   formSubTitle,
@@ -15954,9 +16860,13 @@ var DynamicForm = ({
   isWrapInWizard = false,
   totalSteps = 0,
   currentStep = 1,
-  submitBtnIcon = lucideReact.Save
+  submitBtnIcon = lucideReact.Save,
+  dialogTitle = "\xBFEst\xE1s seguro?",
+  dialogDescription = "Esta acci\xF3n no se puede deshacer. \xBFDeseas continuar?",
+  withConfirmDialog = false
 }) => {
   const [isPending, startTransition] = React3.useTransition();
+  const currentInputField = useKeyboardStore((state) => state.currentInputField);
   const schema = React3.useMemo(() => {
     const allFields = flattenFields(fields, onAnyFieldChange);
     return getDynamicSchema(allFields, extraValidations);
@@ -15985,7 +16895,38 @@ var DynamicForm = ({
     const resp = { data, form };
     onClick(resp);
   };
+  const withConfirm = /* @__PURE__ */ jsxRuntime.jsx(
+    DynamicDialog,
+    {
+      trigger: /* @__PURE__ */ jsxRuntime.jsxs(
+        Button,
+        {
+          variant: "secondary",
+          size: "lg",
+          type: "button",
+          disabled: isPending,
+          className: "flex items-center gap-3 w-full h-16 px-4 py-3 text-sm  hover:bg-zinc-700 transition-colors disabled:opacity-40 disabled:cursor-not-allowed",
+          children: [
+            submitBtnLabel,
+            (totalSteps == 0 || totalSteps == currentStep) && submitBtnIcon && React3__namespace.default.createElement(submitBtnIcon, { className: "h-5 w-5 mr-2" })
+          ]
+        }
+      ),
+      title: dialogTitle,
+      description: dialogDescription,
+      cancelText: "Cancelar",
+      actionText: submitBtnLabel ?? "Procesar",
+      variant: "warning",
+      onAction: onClick ? handleClick : void 0
+    }
+  );
   const formBody = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      CustomSheet,
+      {
+        children: /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: KeyboardFactory.create(currentInputField?.input.keyboard ?? "qwerty" /* QWERTY */) })
+      }
+    ),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full grid grid-cols-1", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         FormFieldsGrid,
@@ -16016,7 +16957,7 @@ var DynamicForm = ({
         },
         key
       )),
-      !readOnly && withSubmitBtn && /* @__PURE__ */ jsxRuntime.jsx(
+      !readOnly && withSubmitBtn && (withConfirmDialog ? withConfirm : /* @__PURE__ */ jsxRuntime.jsx(
         Button,
         {
           type: onClick ? "button" : "submit",
@@ -16032,7 +16973,7 @@ var DynamicForm = ({
             (totalSteps == 0 || totalSteps == currentStep) && submitBtnIcon && React3__namespace.default.createElement(submitBtnIcon, { className: "h-5 w-5 mr-2" })
           ] })
         }
-      )
+      ))
     ] })
   ] });
   const formContent = /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
@@ -16088,61 +17029,6 @@ var FormWrapper = ({ form, handleSubmit, children, readOnly, debug, isWrapInWiza
     }
   ) });
 };
-function Stepper({ steps, currentStep, clickable = false, onStepClick }) {
-  const handleStepClick = (stepNumber) => {
-    if (clickable && onStepClick) {
-      onStepClick(stepNumber);
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-row gap-4 items-center justify-around", children: steps.map((step, index) => {
-    const stepNumber = index + 1;
-    const isCompleted = stepNumber < currentStep;
-    const isCurrent = stepNumber === currentStep;
-    const isUpcoming = stepNumber > currentStep;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 items-center", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            onClick: () => handleStepClick(stepNumber),
-            className: cn(
-              "flex size-10 items-center shadow-lg  justify-center rounded-full border-2 transition-all duration-300",
-              isCompleted && "border-primary bg-primary text-primary-foreground",
-              isCurrent && "border-primary bg-background text-primary scale-110",
-              isUpcoming && "border-muted-foreground/60 bg-background border-b text-muted-foreground",
-              clickable && "cursor-pointer hover:scale-125 hover:shadow-xl",
-              !clickable && "cursor-default"
-            ),
-            children: isCompleted ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "size-5" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold", children: stepNumber })
-          }
-        ),
-        step.title && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 text-center", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "p",
-            {
-              className: cn(
-                "text-sm font-medium transition-colors",
-                (isCompleted || isCurrent) && "text-foreground",
-                isUpcoming && "text-muted-foreground"
-              ),
-              children: step.title
-            }
-          ),
-          step.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-xs text-muted-foreground max-w-[120px]", children: step.description })
-        ] })
-      ] }),
-      index < steps.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-2 flex-1 mb-8", children: /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          className: cn(
-            "h-0.5 w-full transition-all duration-300",
-            stepNumber < currentStep ? "bg-primary" : "bg-muted-foreground/30"
-          )
-        }
-      ) })
-    ] }, index);
-  }) }) });
-}
 var WizardForm = ({
   fields,
   record,
@@ -16591,6 +17477,7 @@ exports.AlertDescription = AlertDescription;
 exports.AlertTitle = AlertTitle;
 exports.Badge = Badge;
 exports.BaseInput = BaseInput;
+exports.BaseKeyboard = BaseKeyboard;
 exports.Button = Button;
 exports.ButtonGroup = ButtonGroup;
 exports.ButtonGroupInput = ButtonGroupInput;
@@ -16623,6 +17510,7 @@ exports.CommandShortcut = CommandShortcut;
 exports.CurrencyInput = CurrencyInput;
 exports.CustomAlert = CustomAlert;
 exports.CustomInputGroup = CustomInputGroup;
+exports.CustomSheet = CustomSheet;
 exports.DateInput = DateInput;
 exports.DateTimeInput = DateTimeInput;
 exports.Dialog = Dialog;
@@ -16686,7 +17574,12 @@ exports.InputOTPGroup = InputOTPGroup;
 exports.InputOTPSeparator = InputOTPSeparator;
 exports.InputOTPSlot = InputOTPSlot;
 exports.InputTypes = InputTypes;
+exports.Key = Key;
 exports.KeyValueListInput = KeyValueListInput;
+exports.KeyboardBuilder = KeyboardBuilder;
+exports.KeyboardFactory = KeyboardFactory;
+exports.KeyboardQwerty = KeyboardQwerty;
+exports.KeyboardTypes = KeyboardTypes;
 exports.Label = Label;
 exports.MultiSelectInput = MultiSelectInput;
 exports.NumberInput = NumberInput;
@@ -16695,6 +17588,7 @@ exports.Popover = Popover;
 exports.PopoverAnchor = PopoverAnchor;
 exports.PopoverContent = PopoverContent;
 exports.PopoverTrigger = PopoverTrigger;
+exports.QwertyKeyboard = QwertyKeyboard;
 exports.RadioGroup = RadioGroup;
 exports.RadioGroupInput = RadioGroupInput;
 exports.RadioGroupItem = RadioGroupItem;
@@ -16741,6 +17635,7 @@ exports.TooltipContent = TooltipContent;
 exports.TooltipProvider = TooltipProvider;
 exports.TooltipTrigger = TooltipTrigger;
 exports.WizardForm = WizardForm;
+exports.applyCase = applyCase;
 exports.badgeVariants = badgeVariants;
 exports.buttonGroupVariants = buttonGroupVariants;
 exports.buttonVariants = buttonVariants;
@@ -16756,10 +17651,12 @@ exports.getFieldLabel = getFieldLabel;
 exports.handleOnChage = handleOnChage;
 exports.inputFieldComp = inputFieldComp;
 exports.isValidField = isValidField;
+exports.letter = letter;
 exports.mockFields = mockFields;
 exports.useDynamicForm = useDynamicForm;
 exports.useFormField = useFormField;
 exports.useFormPersist = useFormPersist;
+exports.useKeyboardStore = useKeyboardStore;
 exports.validationMessages = validationMessages;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map