@algorithm-shift/design-system 1.3.126 → 1.3.128

package/dist/index.mjs

@@ -1076,13 +1076,98 @@ function Icon(props) {
   return null;
 }
 
+// src/components/Basic/Audio/Audio.tsx
+import { useRef as useRef2, useState as useState6, useEffect as useEffect4 } from "react";
+import { Play, Pause } from "lucide-react";
+import { jsx as jsx19, jsxs as jsxs8 } from "react/jsx-runtime";
+var formatTime = (time) => {
+  if (isNaN(time) || !isFinite(time)) return "00:00";
+  const minutes = Math.floor(time / 60);
+  const seconds = Math.floor(time % 60);
+  return `${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`;
+};
+var AudioWrapper = (props) => {
+  const audioRef = useRef2(null);
+  const [isPlaying, setIsPlaying] = useState6(false);
+  const [currentTime, setCurrentTime] = useState6(0);
+  const [duration, setDuration] = useState6(0);
+  useEffect4(() => {
+    const audioEl = audioRef.current;
+    if (!audioEl) return;
+    const handleEnded = () => setIsPlaying(false);
+    const handlePause = () => setIsPlaying(false);
+    const handlePlay = () => setIsPlaying(true);
+    const handleTimeUpdate = () => setCurrentTime(audioEl.currentTime);
+    const handleLoadedMetadata = () => setDuration(audioEl.duration);
+    audioEl.addEventListener("ended", handleEnded);
+    audioEl.addEventListener("pause", handlePause);
+    audioEl.addEventListener("play", handlePlay);
+    audioEl.addEventListener("timeupdate", handleTimeUpdate);
+    audioEl.addEventListener("loadedmetadata", handleLoadedMetadata);
+    return () => {
+      audioEl.removeEventListener("ended", handleEnded);
+      audioEl.removeEventListener("pause", handlePause);
+      audioEl.removeEventListener("play", handlePlay);
+      audioEl.removeEventListener("timeupdate", handleTimeUpdate);
+      audioEl.removeEventListener("loadedmetadata", handleLoadedMetadata);
+    };
+  }, []);
+  const togglePlay = () => {
+    if (audioRef.current) {
+      if (isPlaying) {
+        audioRef.current.pause();
+      } else {
+        audioRef.current.play();
+      }
+    }
+  };
+  const handleSeek = (e) => {
+    const time = Number(e.target.value);
+    if (audioRef.current) {
+      audioRef.current.currentTime = time;
+      setCurrentTime(time);
+    }
+  };
+  const url = props.data || props.src || props.value;
+  return /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-3 p-3 bg-white rounded-lg border shadow-sm w-full min-w-[250px]", children: [
+    url && /* @__PURE__ */ jsx19("audio", { ref: audioRef, src: url, preload: "metadata" }),
+    /* @__PURE__ */ jsx19(
+      "button",
+      {
+        onClick: togglePlay,
+        disabled: !url,
+        className: "p-2 flex-shrink-0 flex items-center justify-center text-blue-600 bg-blue-50 rounded-full hover:bg-blue-100 disabled:opacity-50 disabled:bg-gray-50 disabled:text-gray-400 transition-colors",
+        title: isPlaying ? "Pause Audio" : "Play Audio",
+        children: isPlaying ? /* @__PURE__ */ jsx19(Pause, { size: 20, className: "fill-current" }) : /* @__PURE__ */ jsx19(Play, { size: 20, className: "fill-current transform translate-x-0.5" })
+      }
+    ),
+    /* @__PURE__ */ jsxs8("div", { className: "flex-1 flex items-center gap-3", children: [
+      /* @__PURE__ */ jsx19("span", { className: "text-xs font-medium text-gray-500 tabular-nums w-10 text-right", children: formatTime(currentTime) }),
+      /* @__PURE__ */ jsx19(
+        "input",
+        {
+          type: "range",
+          min: "0",
+          max: duration || 100,
+          value: currentTime,
+          onChange: handleSeek,
+          disabled: !url,
+          className: "flex-1 h-1.5 bg-gray-200 rounded-lg appearance-none cursor-pointer accent-blue-600 disabled:accent-gray-400"
+        }
+      ),
+      /* @__PURE__ */ jsx19("span", { className: "text-xs font-medium text-gray-500 tabular-nums w-10", children: formatTime(duration) })
+    ] })
+  ] });
+};
+var Audio_default = AudioWrapper;
+
 // src/components/Inputs/TextInput/TextInput.tsx
-import { useEffect as useEffect4 } from "react";
+import { useEffect as useEffect5 } from "react";
 
 // src/components/ui/input.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 function Input({ className, type, ...props }) {
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx20(
     "input",
     {
       type,
@@ -1099,14 +1184,14 @@ function Input({ className, type, ...props }) {
 }
 
 // src/components/Inputs/TextInput/TextInput.tsx
-import { Fragment as Fragment3, jsx as jsx20, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx21, jsxs as jsxs9 } from "react/jsx-runtime";
 var TextInput = ({ className, style, ...props }) => {
   const placeholder = props.placeholder || "Placeholder text";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
   const isReadonly = props.isReadonly ?? false;
   const isAutocomplete = props.isAutocomplete ?? false;
-  useEffect4(() => {
+  useEffect5(() => {
     if (props.value !== void 0) {
       const e = { target: { value: props.value }, type: "change" };
       handleChange?.(e);
@@ -1122,8 +1207,8 @@ var TextInput = ({ className, style, ...props }) => {
     if (value === null || value === void 0) return "";
     return value;
   };
-  return /* @__PURE__ */ jsxs8(Fragment3, { children: [
-    /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsxs9(Fragment3, { children: [
+    /* @__PURE__ */ jsx21(
       Input,
       {
         type: props.inputType || "text",
@@ -1142,21 +1227,21 @@ var TextInput = ({ className, style, ...props }) => {
         readOnly: isReadonly
       }
     ),
-    props.errorMessage && /* @__PURE__ */ jsx20("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx21("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var TextInput_default = TextInput;
 
 // src/components/Inputs/NumberInput/NumberInput.tsx
-import { useEffect as useEffect5 } from "react";
-import { Fragment as Fragment4, jsx as jsx21, jsxs as jsxs9 } from "react/jsx-runtime";
+import { useEffect as useEffect6 } from "react";
+import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs10 } from "react/jsx-runtime";
 var NumberInput = ({ className, style, ...props }) => {
   const placeholder = props.placeholder ?? "Placeholder text";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
   const isReadonly = props.isReadonly ?? false;
   const isAutocomplete = props.isAutocomplete ?? false;
-  useEffect5(() => {
+  useEffect6(() => {
     if (props.value !== void 0) {
       const e = { target: { value: props.value }, type: "change" };
       handleChange?.(e);
@@ -1172,8 +1257,8 @@ var NumberInput = ({ className, style, ...props }) => {
     if (value === null || value === void 0) return 0;
     return value;
   };
-  return /* @__PURE__ */ jsxs9(Fragment4, { children: [
-    /* @__PURE__ */ jsx21("div", { className: "flex justify-start items-center relative", children: /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsxs10(Fragment4, { children: [
+    /* @__PURE__ */ jsx22("div", { className: "flex justify-start items-center relative", children: /* @__PURE__ */ jsx22(
       Input,
       {
         type: props.inputType || "number",
@@ -1192,21 +1277,21 @@ var NumberInput = ({ className, style, ...props }) => {
         readOnly: isReadonly
       }
     ) }),
-    props.errorMessage && /* @__PURE__ */ jsx21("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx22("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var NumberInput_default = NumberInput;
 
 // src/components/Inputs/EmailInput/EmailInput.tsx
-import { useEffect as useEffect6 } from "react";
-import { Fragment as Fragment5, jsx as jsx22, jsxs as jsxs10 } from "react/jsx-runtime";
+import { useEffect as useEffect7 } from "react";
+import { Fragment as Fragment5, jsx as jsx23, jsxs as jsxs11 } from "react/jsx-runtime";
 var EmailInput = ({ className, style, ...props }) => {
   const placeholder = props.placeholder ?? "Placeholder text";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
   const isReadonly = props.isReadonly ?? false;
   const isAutocomplete = props.isAutocomplete ?? false;
-  useEffect6(() => {
+  useEffect7(() => {
     if (props.value !== void 0) {
       const e = { target: { value: props.value }, type: "change" };
       handleChange?.(e);
@@ -1222,8 +1307,8 @@ var EmailInput = ({ className, style, ...props }) => {
     if (value === null || value === void 0) return "";
     return value;
   };
-  return /* @__PURE__ */ jsxs10(Fragment5, { children: [
-    /* @__PURE__ */ jsx22("div", { className: "flex justify-start items-center relative", children: /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsxs11(Fragment5, { children: [
+    /* @__PURE__ */ jsx23("div", { className: "flex justify-start items-center relative", children: /* @__PURE__ */ jsx23(
       Input,
       {
         type: props.inputType || "email",
@@ -1242,21 +1327,21 @@ var EmailInput = ({ className, style, ...props }) => {
         readOnly: isReadonly
       }
     ) }),
-    props.errorMessage && /* @__PURE__ */ jsx22("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx23("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var EmailInput_default = EmailInput;
 
 // src/components/Inputs/PasswordInput/PasswordInput.tsx
-import { useEffect as useEffect7 } from "react";
-import { Fragment as Fragment6, jsx as jsx23, jsxs as jsxs11 } from "react/jsx-runtime";
+import { useEffect as useEffect8 } from "react";
+import { Fragment as Fragment6, jsx as jsx24, jsxs as jsxs12 } from "react/jsx-runtime";
 var PasswordInput = ({ className, style, ...props }) => {
   const placeholder = props.placeholder ?? "Placeholder text";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
   const isReadonly = props.isReadonly ?? false;
   const isAutocomplete = props.isAutocomplete ?? false;
-  useEffect7(() => {
+  useEffect8(() => {
     if (props.value !== void 0) {
       const e = { target: { value: props.value }, type: "change" };
       handleChange?.(e);
@@ -1272,8 +1357,8 @@ var PasswordInput = ({ className, style, ...props }) => {
     if (value === null || value === void 0) return "";
     return value;
   };
-  return /* @__PURE__ */ jsxs11(Fragment6, { children: [
-    /* @__PURE__ */ jsx23("div", { className: "flex justify-start items-center relative", children: /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsxs12(Fragment6, { children: [
+    /* @__PURE__ */ jsx24("div", { className: "flex justify-start items-center relative", children: /* @__PURE__ */ jsx24(
       Input,
       {
         type: props.inputType || "password",
@@ -1292,18 +1377,18 @@ var PasswordInput = ({ className, style, ...props }) => {
         readOnly: isReadonly
       }
     ) }),
-    props.errorMessage && /* @__PURE__ */ jsx23("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx24("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var PasswordInput_default = PasswordInput;
 
 // src/components/Inputs/Textarea/Textarea.tsx
-import { useEffect as useEffect8 } from "react";
+import { useEffect as useEffect9 } from "react";
 
 // src/components/ui/textarea.tsx
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx25 } from "react/jsx-runtime";
 function Textarea({ className, ...props }) {
-  return /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx25(
     "textarea",
     {
       "data-slot": "textarea",
@@ -1317,14 +1402,14 @@ function Textarea({ className, ...props }) {
 }
 
 // src/components/Inputs/Textarea/Textarea.tsx
-import { Fragment as Fragment7, jsx as jsx25, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx26, jsxs as jsxs13 } from "react/jsx-runtime";
 var Textarea2 = ({ className, style, ...props }) => {
   const placeholder = props.placeholder ?? "Placeholder text";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
   const isReadonly = props.isReadonly ?? false;
   const isAutocomplete = props.isAutocomplete ?? false;
-  useEffect8(() => {
+  useEffect9(() => {
     if (props.value !== void 0) {
       const e = { target: { value: props.value }, type: "change" };
       handleChange?.(e);
@@ -1333,8 +1418,8 @@ var Textarea2 = ({ className, style, ...props }) => {
   const handleChange = (e) => {
     props.onChange?.(e, props?.name || "");
   };
-  return /* @__PURE__ */ jsxs12(Fragment7, { children: [
-    /* @__PURE__ */ jsx25(
+  return /* @__PURE__ */ jsxs13(Fragment7, { children: [
+    /* @__PURE__ */ jsx26(
       Textarea,
       {
         id: "textarea-field",
@@ -1352,21 +1437,21 @@ var Textarea2 = ({ className, style, ...props }) => {
         readOnly: isReadonly
       }
     ),
-    props.errorMessage && /* @__PURE__ */ jsx25("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx26("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var Textarea_default = Textarea2;
 
 // src/components/Inputs/UrlInput/UrlInput.tsx
-import { useEffect as useEffect9 } from "react";
-import { Fragment as Fragment8, jsx as jsx26, jsxs as jsxs13 } from "react/jsx-runtime";
+import { useEffect as useEffect10 } from "react";
+import { Fragment as Fragment8, jsx as jsx27, jsxs as jsxs14 } from "react/jsx-runtime";
 var UrlInput = ({ className, style, ...props }) => {
   const placeholder = props.placeholder ?? "Placeholder text";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
   const isReadonly = props.isReadonly ?? false;
   const isAutocomplete = props.isAutocomplete ?? false;
-  useEffect9(() => {
+  useEffect10(() => {
     if (props.value !== void 0) {
       const e = { target: { value: props.value }, type: "change" };
       handleChange?.(e);
@@ -1382,10 +1467,10 @@ var UrlInput = ({ className, style, ...props }) => {
     if (value === null || value === void 0) return "";
     return value;
   };
-  return /* @__PURE__ */ jsxs13(Fragment8, { children: [
-    /* @__PURE__ */ jsxs13("div", { className: "flex justify-start items-center relative", children: [
-      /* @__PURE__ */ jsx26("div", { className: "bg-[#E9E9E9] absolute px-10 text-center top-1/2 h-full justify-center items-center flex w-10 -translate-y-1/2 text-[#383838] font-[500] text-[12px]", children: "https://" }),
-      /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsxs14(Fragment8, { children: [
+    /* @__PURE__ */ jsxs14("div", { className: "flex justify-start items-center relative", children: [
+      /* @__PURE__ */ jsx27("div", { className: "bg-[#E9E9E9] absolute px-10 text-center top-1/2 h-full justify-center items-center flex w-10 -translate-y-1/2 text-[#383838] font-[500] text-[12px]", children: "https://" }),
+      /* @__PURE__ */ jsx27(
         Input,
         {
           id: props.name || "url-field",
@@ -1405,23 +1490,23 @@ var UrlInput = ({ className, style, ...props }) => {
         }
       )
     ] }),
-    props.errorMessage && /* @__PURE__ */ jsx26("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx27("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var UrlInput_default = UrlInput;
 
 // src/components/Inputs/Checkbox/Checkbox.tsx
-import { useEffect as useEffect10 } from "react";
+import { useEffect as useEffect11 } from "react";
 
 // src/components/ui/checkbox.tsx
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
 import { CheckIcon as CheckIcon2 } from "lucide-react";
-import { jsx as jsx27 } from "react/jsx-runtime";
+import { jsx as jsx28 } from "react/jsx-runtime";
 function Checkbox({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsx28(
     CheckboxPrimitive.Root,
     {
       "data-slot": "checkbox",
@@ -1430,12 +1515,12 @@ function Checkbox({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx27(
+      children: /* @__PURE__ */ jsx28(
         CheckboxPrimitive.Indicator,
         {
           "data-slot": "checkbox-indicator",
           className: "flex items-center justify-center text-current transition-none",
-          children: /* @__PURE__ */ jsx27(CheckIcon2, { className: "size-3.5" })
+          children: /* @__PURE__ */ jsx28(CheckIcon2, { className: "size-3.5" })
         }
       )
     }
@@ -1444,12 +1529,12 @@ function Checkbox({
 
 // src/components/ui/label.tsx
 import * as LabelPrimitive from "@radix-ui/react-label";
-import { jsx as jsx28 } from "react/jsx-runtime";
+import { jsx as jsx29 } from "react/jsx-runtime";
 function Label2({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx29(
     LabelPrimitive.Root,
     {
       "data-slot": "label",
@@ -1463,7 +1548,7 @@ function Label2({
 }
 
 // src/components/Inputs/Checkbox/Checkbox.tsx
-import { Fragment as Fragment9, jsx as jsx29, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx30, jsxs as jsxs15 } from "react/jsx-runtime";
 var CheckboxInput = ({ className, style, ...props }) => {
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
@@ -1477,7 +1562,7 @@ var CheckboxInput = ({ className, style, ...props }) => {
     }
     return false;
   };
-  useEffect10(() => {
+  useEffect11(() => {
     if (props.value) {
       handleChange(formatValue(props.value));
     }
@@ -1485,9 +1570,9 @@ var CheckboxInput = ({ className, style, ...props }) => {
   const handleChange = (value) => {
     props.onChange?.(value, props?.name || "");
   };
-  return /* @__PURE__ */ jsxs14(Fragment9, { children: [
-    /* @__PURE__ */ jsx29("div", { className, style, children: /* @__PURE__ */ jsxs14("div", { className: "flex items-center space-x-2", children: [
-      /* @__PURE__ */ jsx29(
+  return /* @__PURE__ */ jsxs15(Fragment9, { children: [
+    /* @__PURE__ */ jsx30("div", { className, style, children: /* @__PURE__ */ jsxs15("div", { className: "flex items-center space-x-2", children: [
+      /* @__PURE__ */ jsx30(
         Checkbox,
         {
           id: props.name || "checkbox",
@@ -1496,25 +1581,25 @@ var CheckboxInput = ({ className, style, ...props }) => {
           disabled: !isEditable || isDisabled
         }
       ),
-      /* @__PURE__ */ jsx29(Label2, { htmlFor: props.name || "checkbox", children: text })
+      /* @__PURE__ */ jsx30(Label2, { htmlFor: props.name || "checkbox", children: text })
     ] }) }),
-    props.errorMessage && /* @__PURE__ */ jsx29("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx30("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var Checkbox_default = CheckboxInput;
 
 // src/components/Inputs/RadioInput/RadioInput.tsx
-import { useEffect as useEffect11 } from "react";
+import { useEffect as useEffect12 } from "react";
 
 // src/components/ui/radio-group.tsx
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
 import { CircleIcon as CircleIcon2 } from "lucide-react";
-import { jsx as jsx30 } from "react/jsx-runtime";
+import { jsx as jsx31 } from "react/jsx-runtime";
 function RadioGroup2({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx30(
+  return /* @__PURE__ */ jsx31(
     RadioGroupPrimitive.Root,
     {
       "data-slot": "radio-group",
@@ -1527,7 +1612,7 @@ function RadioGroupItem({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx30(
+  return /* @__PURE__ */ jsx31(
     RadioGroupPrimitive.Item,
     {
       "data-slot": "radio-group-item",
@@ -1536,12 +1621,12 @@ function RadioGroupItem({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx30(
+      children: /* @__PURE__ */ jsx31(
         RadioGroupPrimitive.Indicator,
         {
           "data-slot": "radio-group-indicator",
           className: "relative flex items-center justify-center",
-          children: /* @__PURE__ */ jsx30(CircleIcon2, { className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2" })
+          children: /* @__PURE__ */ jsx31(CircleIcon2, { className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2" })
         }
       )
     }
@@ -1549,7 +1634,7 @@ function RadioGroupItem({
 }
 
 // src/components/Inputs/RadioInput/RadioInput.tsx
-import { Fragment as Fragment10, jsx as jsx31, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx32, jsxs as jsxs16 } from "react/jsx-runtime";
 var RadioInput = ({
   className,
   style,
@@ -1565,7 +1650,7 @@ var RadioInput = ({
     value: item[dataKey || "value"],
     label: item[dataLabel || "label"]
   }));
-  useEffect11(() => {
+  useEffect12(() => {
     if (props.value !== void 0) {
       handleChange?.(props.value);
     }
@@ -1574,29 +1659,29 @@ var RadioInput = ({
     onChange?.(value, props?.name || "");
   };
   const resolvedDefaultValue = (typeof defaultValue === "string" ? defaultValue : void 0) ?? options[0]?.value;
-  return /* @__PURE__ */ jsxs15(Fragment10, { children: [
-    /* @__PURE__ */ jsx31("div", { className, style, children: /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs16(Fragment10, { children: [
+    /* @__PURE__ */ jsx32("div", { className, style, children: /* @__PURE__ */ jsxs16(
       RadioGroup2,
       {
         defaultValue: resolvedDefaultValue,
         onValueChange: handleChange,
         children: [
-          options.length === 0 && /* @__PURE__ */ jsx31("div", { className: "text-sm text-gray-500", children: "No options available" }),
-          options.map((item) => /* @__PURE__ */ jsxs15("div", { className: "flex items-center space-x-2", children: [
-            /* @__PURE__ */ jsx31(RadioGroupItem, { value: item.value, id: `radio-${item.value}` }),
-            /* @__PURE__ */ jsx31(Label2, { htmlFor: `radio-${item.value}`, children: item.label })
+          options.length === 0 && /* @__PURE__ */ jsx32("div", { className: "text-sm text-gray-500", children: "No options available" }),
+          options.map((item) => /* @__PURE__ */ jsxs16("div", { className: "flex items-center space-x-2", children: [
+            /* @__PURE__ */ jsx32(RadioGroupItem, { value: item.value, id: `radio-${item.value}` }),
+            /* @__PURE__ */ jsx32(Label2, { htmlFor: `radio-${item.value}`, children: item.label })
           ] }, item.value))
         ]
       }
     ) }),
-    props.errorMessage && /* @__PURE__ */ jsx31("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx32("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var RadioInput_default = RadioInput;
 
 // src/components/Inputs/MultiCheckbox/MultiCheckbox.tsx
-import { useEffect as useEffect12, useState as useState6, useRef as useRef2, useCallback } from "react";
-import { jsx as jsx32, jsxs as jsxs16 } from "react/jsx-runtime";
+import { useEffect as useEffect13, useState as useState7, useRef as useRef3, useCallback } from "react";
+import { jsx as jsx33, jsxs as jsxs17 } from "react/jsx-runtime";
 function MultiCheckbox({
   apiUrl,
   axiosInstance,
@@ -1614,11 +1699,11 @@ function MultiCheckbox({
   onUncheckItems,
   ...props
 }) {
-  const [options, setOptions] = useState6([]);
-  const [page, setPage] = useState6(1);
-  const [hasMore, setHasMore] = useState6(true);
-  const [pageLoading, setPageLoading] = useState6(false);
-  const loadMoreRef = useRef2(null);
+  const [options, setOptions] = useState7([]);
+  const [page, setPage] = useState7(1);
+  const [hasMore, setHasMore] = useState7(true);
+  const [pageLoading, setPageLoading] = useState7(false);
+  const loadMoreRef = useRef3(null);
   const normalizeInput = (val) => {
     if (!val) return [];
     if (Array.isArray(val)) return val;
@@ -1677,7 +1762,7 @@ function MultiCheckbox({
       setPageLoading(false);
     }
   }, [source, pageLoading, fetchApiPage, mapData, pageSize]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (source === "api") {
       setOptions([]);
       setPage(1);
@@ -1687,10 +1772,10 @@ function MultiCheckbox({
       setHasMore(false);
     }
   }, [source, JSON.stringify(data)]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (source === "api") loadPage();
   }, [page, source]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (source !== "api") return;
     if (!hasMore || pageLoading) return;
     const observer = new IntersectionObserver((entries) => {
@@ -1709,11 +1794,11 @@ function MultiCheckbox({
       options.filter((opt) => !updated.includes(opt.value)).map((opt) => opt.value)
     ), props.name || "");
   };
-  return /* @__PURE__ */ jsxs16("div", { className: cn("flex flex-col gap-2 max-h-64 overflow-auto", className), style, children: [
-    options.length === 0 && !pageLoading && !loading && /* @__PURE__ */ jsx32("div", { className: "text-center py-2 text-gray-500 text-sm", children: "No options available." }),
+  return /* @__PURE__ */ jsxs17("div", { className: cn("flex flex-col gap-2 max-h-64 overflow-auto", className), style, children: [
+    options.length === 0 && !pageLoading && !loading && /* @__PURE__ */ jsx33("div", { className: "text-center py-2 text-gray-500 text-sm", children: "No options available." }),
     options.map((opt, index) => {
       const hasError = !!props.errorMessage;
-      return /* @__PURE__ */ jsxs16(
+      return /* @__PURE__ */ jsxs17(
         "div",
         {
           className: cn(
@@ -1721,7 +1806,7 @@ function MultiCheckbox({
             hasError && "bg-red-50"
           ),
           children: [
-            /* @__PURE__ */ jsx32(
+            /* @__PURE__ */ jsx33(
               Checkbox,
               {
                 id: props.name ? `${props.name}-${opt.value}` : opt.value,
@@ -1733,7 +1818,7 @@ function MultiCheckbox({
                 )
               }
             ),
-            /* @__PURE__ */ jsx32(
+            /* @__PURE__ */ jsx33(
               Label2,
               {
                 id: props.name ? `${props.name}-${opt.value}` : opt.value,
@@ -1747,25 +1832,25 @@ function MultiCheckbox({
         `${index}-${opt.value}`
       );
     }),
-    source === "api" && hasMore && /* @__PURE__ */ jsx32("div", { ref: loadMoreRef, className: "h-4" }),
-    (pageLoading || loading) && /* @__PURE__ */ jsx32("div", { className: "text-center py-2 text-gray-500 text-sm", children: "Loading\u2026" }),
-    props.errorMessage && /* @__PURE__ */ jsx32("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    source === "api" && hasMore && /* @__PURE__ */ jsx33("div", { ref: loadMoreRef, className: "h-4" }),
+    (pageLoading || loading) && /* @__PURE__ */ jsx33("div", { className: "text-center py-2 text-gray-500 text-sm", children: "Loading\u2026" }),
+    props.errorMessage && /* @__PURE__ */ jsx33("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 }
 
 // src/components/Inputs/RichText/RichText.tsx
-import { useEffect as useEffect13 } from "react";
+import { useEffect as useEffect14 } from "react";
 
 // src/components/Global/TinyMceEditor.tsx
-import { useMemo as useMemo3, useRef as useRef3 } from "react";
+import { useMemo as useMemo3, useRef as useRef4 } from "react";
 import { Editor } from "@tinymce/tinymce-react";
-import { jsx as jsx33 } from "react/jsx-runtime";
+import { jsx as jsx34 } from "react/jsx-runtime";
 function MyEditor({
   value,
   onChange,
   isDefault
 }) {
-  const editorRef = useRef3(null);
+  const editorRef = useRef4(null);
   function stripOuterP(html) {
     const trimmedHtml = html.trim();
     if (!trimmedHtml) return "";
@@ -1784,7 +1869,7 @@ function MyEditor({
     }
     return toolbar;
   }, [isDefault]);
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx34(
     Editor,
     {
       apiKey: process.env.NEXT_PUBLIC_TINYMCE_API_KEY,
@@ -1828,9 +1913,9 @@ function MyEditor({
 }
 
 // src/components/Inputs/RichText/RichText.tsx
-import { jsx as jsx34, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs18 } from "react/jsx-runtime";
 function RichText({ className, style, ...props }) {
-  useEffect13(() => {
+  useEffect14(() => {
     if (props.value !== void 0) {
       handleChange?.(props.value);
     }
@@ -1838,7 +1923,7 @@ function RichText({ className, style, ...props }) {
   const handleChange = (content) => {
     props.onChange?.(content, props?.name || "");
   };
-  return /* @__PURE__ */ jsxs17(
+  return /* @__PURE__ */ jsxs18(
     "div",
     {
       className: cn(className, props.errorMessage ? "border-red-500" : ""),
@@ -1847,29 +1932,29 @@ function RichText({ className, style, ...props }) {
         borderColor: props.errorMessage ? "#f87171" : style?.borderColor
       },
       children: [
-        /* @__PURE__ */ jsx34(MyEditor, { onChange: handleChange, value: props.value || "", isDefault: true }),
-        props.errorMessage && /* @__PURE__ */ jsx34("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+        /* @__PURE__ */ jsx35(MyEditor, { onChange: handleChange, value: props.value || "", isDefault: true }),
+        props.errorMessage && /* @__PURE__ */ jsx35("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
       ]
     }
   );
 }
 
 // src/components/Inputs/Dropdown/Dropdown.tsx
-import { useEffect as useEffect16 } from "react";
+import { useEffect as useEffect17 } from "react";
 
 // src/components/ui/select.tsx
 import * as SelectPrimitive from "@radix-ui/react-select";
 import { CheckIcon as CheckIcon3, ChevronDownIcon, ChevronUpIcon } from "lucide-react";
-import { jsx as jsx35, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs19 } from "react/jsx-runtime";
 function Select({
   ...props
 }) {
-  return /* @__PURE__ */ jsx35(SelectPrimitive.Root, { "data-slot": "select", ...props });
+  return /* @__PURE__ */ jsx36(SelectPrimitive.Root, { "data-slot": "select", ...props });
 }
 function SelectValue({
   ...props
 }) {
-  return /* @__PURE__ */ jsx35(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
+  return /* @__PURE__ */ jsx36(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
 }
 function SelectTrigger({
   className,
@@ -1877,7 +1962,7 @@ function SelectTrigger({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     SelectPrimitive.Trigger,
     {
       "data-slot": "select-trigger",
@@ -1889,7 +1974,7 @@ function SelectTrigger({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx35(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx35(ChevronDownIcon, { className: "size-4 opacity-50" }) })
+        /* @__PURE__ */ jsx36(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx36(ChevronDownIcon, { className: "size-4 opacity-50" }) })
       ]
     }
   );
@@ -1900,7 +1985,7 @@ function SelectContent({
   position = "popper",
   ...props
 }) {
-  return /* @__PURE__ */ jsx35(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsx36(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs19(
     SelectPrimitive.Content,
     {
       "data-slot": "select-content",
@@ -1912,8 +1997,8 @@ function SelectContent({
       position,
       ...props,
       children: [
-        /* @__PURE__ */ jsx35(SelectScrollUpButton, {}),
-        /* @__PURE__ */ jsx35(
+        /* @__PURE__ */ jsx36(SelectScrollUpButton, {}),
+        /* @__PURE__ */ jsx36(
           SelectPrimitive.Viewport,
           {
             className: cn(
@@ -1923,7 +2008,7 @@ function SelectContent({
             children
           }
         ),
-        /* @__PURE__ */ jsx35(SelectScrollDownButton, {})
+        /* @__PURE__ */ jsx36(SelectScrollDownButton, {})
       ]
     }
   ) });
@@ -1933,7 +2018,7 @@ function SelectItem({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     SelectPrimitive.Item,
     {
       "data-slot": "select-item",
@@ -1943,8 +2028,8 @@ function SelectItem({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx35("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx35(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx35(CheckIcon3, { className: "size-4" }) }) }),
-        /* @__PURE__ */ jsx35(SelectPrimitive.ItemText, { children })
+        /* @__PURE__ */ jsx36("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx36(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx36(CheckIcon3, { className: "size-4" }) }) }),
+        /* @__PURE__ */ jsx36(SelectPrimitive.ItemText, { children })
       ]
     }
   );
@@ -1953,7 +2038,7 @@ function SelectScrollUpButton({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx36(
     SelectPrimitive.ScrollUpButton,
     {
       "data-slot": "select-scroll-up-button",
@@ -1962,7 +2047,7 @@ function SelectScrollUpButton({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx35(ChevronUpIcon, { className: "size-4" })
+      children: /* @__PURE__ */ jsx36(ChevronUpIcon, { className: "size-4" })
     }
   );
 }
@@ -1970,7 +2055,7 @@ function SelectScrollDownButton({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx36(
     SelectPrimitive.ScrollDownButton,
     {
       "data-slot": "select-scroll-down-button",
@@ -1979,29 +2064,29 @@ function SelectScrollDownButton({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx35(ChevronDownIcon, { className: "size-4" })
+      children: /* @__PURE__ */ jsx36(ChevronDownIcon, { className: "size-4" })
     }
   );
 }
 
 // src/components/Inputs/Dropdown/LazyDropdown.tsx
-import { useState as useState8, useRef as useRef5, useEffect as useEffect15, useMemo as useMemo4 } from "react";
+import { useState as useState9, useRef as useRef6, useEffect as useEffect16, useMemo as useMemo4 } from "react";
 import { XSquareIcon } from "lucide-react";
 
 // src/hooks/useLazyDropdown.ts
-import { useState as useState7, useEffect as useEffect14, useRef as useRef4, useCallback as useCallback2 } from "react";
+import { useState as useState8, useEffect as useEffect15, useRef as useRef5, useCallback as useCallback2 } from "react";
 import axios2 from "axios";
 function useLazyDropdown(config) {
-  const [options, setOptions] = useState7([]);
-  const [page, setPage] = useState7(1);
-  const [hasMore, setHasMore] = useState7(true);
-  const [loading, setLoading] = useState7(false);
-  const [searchTerm, setSearchTerm] = useState7("");
-  const debounceTimer = useRef4(null);
-  const allDataRef = useRef4([]);
-  const configRef = useRef4(config);
+  const [options, setOptions] = useState8([]);
+  const [page, setPage] = useState8(1);
+  const [hasMore, setHasMore] = useState8(true);
+  const [loading, setLoading] = useState8(false);
+  const [searchTerm, setSearchTerm] = useState8("");
+  const debounceTimer = useRef5(null);
+  const allDataRef = useRef5([]);
+  const configRef = useRef5(config);
   const PAGE_SIZE = config.pageSize || 10;
-  useEffect14(() => {
+  useEffect15(() => {
     setOptions([]);
     setPage(1);
     setHasMore(true);
@@ -2014,7 +2099,7 @@ function useLazyDropdown(config) {
       return true;
     });
   };
-  useEffect14(() => {
+  useEffect15(() => {
     configRef.current = config;
   }, [config]);
   function getValueByPath2(obj, path) {
@@ -2176,7 +2261,7 @@ function useLazyDropdown(config) {
       setLoading(false);
     }
   };
-  useEffect14(() => {
+  useEffect15(() => {
     const cfg = configRef.current;
     if (!cfg.enabled || !cfg.value || cfg.dataSource !== "api" || !cfg.apiUrl) return;
     if (cfg.isMultiSelect) {
@@ -2205,12 +2290,12 @@ function useLazyDropdown(config) {
     setSearchTerm("");
     setPage(1);
   }, []);
-  useEffect14(() => {
+  useEffect15(() => {
     if (config.initialData?.length) {
       allDataRef.current = config.initialData;
     }
   }, [config.initialData]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (config.fetchOnMount) loadPage(1, "");
     return () => {
       if (debounceTimer.current) clearTimeout(debounceTimer.current);
@@ -2257,7 +2342,7 @@ function useLazyDropdown(config) {
 }
 
 // src/components/Inputs/Dropdown/LazyDropdown.tsx
-import { Fragment as Fragment11, jsx as jsx36, jsxs as jsxs19 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx37, jsxs as jsxs20 } from "react/jsx-runtime";
 function LazySelectDropdown({
   options = [],
   value,
@@ -2278,11 +2363,12 @@ function LazySelectDropdown({
   enforceStrictQueryParams = false,
   ...props
 }) {
-  const [isOpen, setIsOpen] = useState8(false);
-  const [searchTerm, setSearchTerm] = useState8("");
-  const [highlightedIndex, setHighlightedIndex] = useState8(-1);
-  const dropdownRef = useRef5(null);
-  const observerTarget = useRef5(null);
+  const [isOpen, setIsOpen] = useState9(false);
+  const [searchTerm, setSearchTerm] = useState9("");
+  const [highlightedIndex, setHighlightedIndex] = useState9(-1);
+  const dropdownRef = useRef6(null);
+  const popupRef = useRef6(null);
+  const observerTarget = useRef6(null);
   const {
     options: lazyOptions,
     loading,
@@ -2305,25 +2391,30 @@ function LazySelectDropdown({
     enforceStrictQueryParams
   });
   const selectedOption = useMemo4(() => lazyOptions.find((opt) => opt.value === value), [lazyOptions, value]);
-  useEffect15(() => {
+  useEffect16(() => {
     if (!isOpen) {
       setHighlightedIndex(-1);
     } else if (lazyOptions.length > 0 && highlightedIndex === -1) {
       setHighlightedIndex(0);
     }
   }, [isOpen, lazyOptions.length, highlightedIndex]);
-  useEffect15(() => {
-    const handleClickOutside = (e) => {
-      if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
+  useEffect16(() => {
+    const handleOutside = (e) => {
+      const target = e.target;
+      if (dropdownRef.current && !dropdownRef.current.contains(target) && (!popupRef.current || !popupRef.current.contains(target))) {
         setIsOpen(false);
         setSearchTerm("");
         setHighlightedIndex(-1);
       }
     };
-    document.addEventListener("mousedown", handleClickOutside);
-    return () => document.removeEventListener("mousedown", handleClickOutside);
+    document.addEventListener("mousedown", handleOutside);
+    document.addEventListener("focusin", handleOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleOutside);
+      document.removeEventListener("focusin", handleOutside);
+    };
   }, []);
-  useEffect15(() => {
+  useEffect16(() => {
     if (!isOpen || !hasMore || loading) return;
     const observer = new IntersectionObserver(
       (entries) => {
@@ -2414,8 +2505,8 @@ function LazySelectDropdown({
         break;
     }
   };
-  return /* @__PURE__ */ jsxs19("div", { ref: dropdownRef, className: "relative w-full", children: [
-    /* @__PURE__ */ jsx36(
+  return /* @__PURE__ */ jsxs20("div", { ref: dropdownRef, className: "relative w-full", children: [
+    /* @__PURE__ */ jsx37(
       "input",
       {
         type: "text",
@@ -2437,20 +2528,21 @@ function LazySelectDropdown({
         autoComplete: "off"
       }
     ),
-    selectedOption && !disabled && !readOnly && /* @__PURE__ */ jsx36(
+    selectedOption && !disabled && !readOnly && /* @__PURE__ */ jsx37(
       "button",
       {
         type: "button",
         "aria-label": "Clear selection",
         onClick: handleRemoveSelection,
         className: "absolute right-2 top-1/2 -translate-y-1/2 h-5 w-5 flex items-center justify-center rounded hover:bg-gray-200 text-gray-500 focus:outline-none",
-        children: /* @__PURE__ */ jsx36(XSquareIcon, { className: "h-5 w-5 pointer-events-none" })
+        children: /* @__PURE__ */ jsx37(XSquareIcon, { className: "h-5 w-5 pointer-events-none" })
       }
     ),
-    errorMessage && /* @__PURE__ */ jsx36("p", { className: "mt-1 text-xs text-red-500", children: errorMessage }),
-    isOpen && !disabled && /* @__PURE__ */ jsx36(Portal_default, { children: /* @__PURE__ */ jsx36(
+    errorMessage && /* @__PURE__ */ jsx37("p", { className: "mt-1 text-xs text-red-500", children: errorMessage }),
+    isOpen && !disabled && /* @__PURE__ */ jsx37(Portal_default, { children: /* @__PURE__ */ jsx37(
       "div",
       {
+        ref: popupRef,
         onMouseDown: (e) => e.stopPropagation(),
         className: "absolute z-[900] w-fit mt-1 bg-white border border-gray-300 rounded-lg shadow-lg max-h-60 overflow-y-auto",
         style: {
@@ -2459,14 +2551,14 @@ function LazySelectDropdown({
           top: dropdownRef.current ? dropdownRef.current.getBoundingClientRect().bottom + window.scrollY : 0,
           left: dropdownRef.current ? dropdownRef.current.getBoundingClientRect().left + window.scrollX : 0
         },
-        children: props.loading && !loading ? /* @__PURE__ */ jsxs19("div", { className: "px-3 py-4 text-center text-gray-500 flex items-center justify-center gap-2 text-sm", children: [
-          /* @__PURE__ */ jsx36("div", { className: "animate-spin w-4 h-4 border-2 border-gray-300 border-t-blue-500 rounded-full" }),
+        children: props.loading && !loading ? /* @__PURE__ */ jsxs20("div", { className: "px-3 py-4 text-center text-gray-500 flex items-center justify-center gap-2 text-sm", children: [
+          /* @__PURE__ */ jsx37("div", { className: "animate-spin w-4 h-4 border-2 border-gray-300 border-t-blue-500 rounded-full" }),
           "Loading..."
-        ] }) : /* @__PURE__ */ jsx36(Fragment11, { children: loading && lazyOptions.length === 0 ? /* @__PURE__ */ jsxs19("div", { className: "px-3 py-4 text-center text-gray-500 flex items-center justify-center gap-2 text-sm", children: [
-          /* @__PURE__ */ jsx36("div", { className: "animate-spin w-4 h-4 border-2 border-gray-300 border-t-blue-500 rounded-full" }),
+        ] }) : /* @__PURE__ */ jsx37(Fragment11, { children: loading && lazyOptions.length === 0 ? /* @__PURE__ */ jsxs20("div", { className: "px-3 py-4 text-center text-gray-500 flex items-center justify-center gap-2 text-sm", children: [
+          /* @__PURE__ */ jsx37("div", { className: "animate-spin w-4 h-4 border-2 border-gray-300 border-t-blue-500 rounded-full" }),
           "Loading..."
-        ] }) : lazyOptions.length > 0 ? /* @__PURE__ */ jsxs19(Fragment11, { children: [
-          lazyOptions.map((option, index) => /* @__PURE__ */ jsx36(
+        ] }) : lazyOptions.length > 0 ? /* @__PURE__ */ jsxs20(Fragment11, { children: [
+          lazyOptions.map((option, index) => /* @__PURE__ */ jsx37(
             "div",
             {
               tabIndex: 0,
@@ -2485,20 +2577,20 @@ function LazySelectDropdown({
             },
             `${option.value}-${index}`
           )),
-          hasMore && /* @__PURE__ */ jsx36(
+          hasMore && /* @__PURE__ */ jsx37(
             "div",
             {
               ref: observerTarget,
               className: "px-3 py-2 text-center text-gray-400 text-sm border-t",
-              children: loading ? /* @__PURE__ */ jsxs19("div", { className: "flex items-center justify-center gap-2 text-sm", children: [
-                /* @__PURE__ */ jsx36("div", { className: "animate-spin w-3 h-3 border-2 border-gray-300 border-t-blue-500 rounded-full" }),
+              children: loading ? /* @__PURE__ */ jsxs20("div", { className: "flex items-center justify-center gap-2 text-sm", children: [
+                /* @__PURE__ */ jsx37("div", { className: "animate-spin w-3 h-3 border-2 border-gray-300 border-t-blue-500 rounded-full" }),
                 "Loading more..."
               ] }) : "Scroll for more..."
             }
           )
-        ] }) : /* @__PURE__ */ jsxs19("div", { className: "px-3 py-4 text-sm text-center text-gray-500", children: [
+        ] }) : /* @__PURE__ */ jsxs20("div", { className: "px-3 py-4 text-sm text-center text-gray-500", children: [
           searchTerm ? `No results for "${searchTerm}"` : "No options available",
-          enableAddNewOption && searchTerm && /* @__PURE__ */ jsx36(
+          enableAddNewOption && searchTerm && /* @__PURE__ */ jsx37(
             "div",
             {
               onClick: () => handleAddNewOption(searchTerm),
@@ -2514,14 +2606,14 @@ function LazySelectDropdown({
 var LazyDropdown_default = LazySelectDropdown;
 
 // src/components/Inputs/Dropdown/Dropdown.tsx
-import { Fragment as Fragment12, jsx as jsx37, jsxs as jsxs20 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx38, jsxs as jsxs21 } from "react/jsx-runtime";
 var Dropdown = ({ className, style, ...props }) => {
   const list = Array.isArray(props?.data) ? props.data : [];
   const placeholder = props.placeholder ? props.placeholder : "Select an option";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
   const isReadonly = props.isReadonly ?? false;
-  useEffect16(() => {
+  useEffect17(() => {
     if (props.value !== void 0) {
       handleChange(props.value);
     }
@@ -2536,7 +2628,7 @@ var Dropdown = ({ className, style, ...props }) => {
     label: item[dataLabel]
   }));
   if (props.lazyLoad) {
-    return /* @__PURE__ */ jsx37(
+    return /* @__PURE__ */ jsx38(
       LazyDropdown_default,
       {
         ...props,
@@ -2553,9 +2645,9 @@ var Dropdown = ({ className, style, ...props }) => {
       }
     );
   }
-  return /* @__PURE__ */ jsxs20(Fragment12, { children: [
-    /* @__PURE__ */ jsxs20(Select, { name: props.name, value: props.value || "", onValueChange: handleChange, disabled: isDisabled || !isEditable, children: [
-      /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsxs21(Fragment12, { children: [
+    /* @__PURE__ */ jsxs21(Select, { name: props.name, value: props.value || "", onValueChange: handleChange, disabled: isDisabled || !isEditable, children: [
+      /* @__PURE__ */ jsx38(
         SelectTrigger,
         {
           id: props.name || "select-field",
@@ -2565,31 +2657,31 @@ var Dropdown = ({ className, style, ...props }) => {
             borderColor: props.errorMessage ? "#f87171" : style?.borderColor
           },
           "aria-readonly": isReadonly,
-          children: /* @__PURE__ */ jsx37(SelectValue, { placeholder })
+          children: /* @__PURE__ */ jsx38(SelectValue, { placeholder })
         }
       ),
-      /* @__PURE__ */ jsxs20(SelectContent, { children: [
-        props.dataLoading && /* @__PURE__ */ jsx37(SelectItem, { value: "none", disabled: true, children: "Loading..." }),
-        !props.dataLoading && options.length === 0 && /* @__PURE__ */ jsx37(SelectItem, { value: "none", disabled: true, children: "No options" }),
-        options.map((opt) => /* @__PURE__ */ jsx37(SelectItem, { value: opt.value, children: opt.label }, opt.value))
+      /* @__PURE__ */ jsxs21(SelectContent, { children: [
+        props.dataLoading && /* @__PURE__ */ jsx38(SelectItem, { value: "none", disabled: true, children: "Loading..." }),
+        !props.dataLoading && options.length === 0 && /* @__PURE__ */ jsx38(SelectItem, { value: "none", disabled: true, children: "No options" }),
+        options.map((opt) => /* @__PURE__ */ jsx38(SelectItem, { value: opt.value, children: opt.label }, opt.value))
       ] })
     ] }),
-    props.errorMessage && /* @__PURE__ */ jsx37("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx38("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var Dropdown_default = Dropdown;
 
 // src/components/Inputs/SwitchToggle/SwitchToggle.tsx
-import { useEffect as useEffect17 } from "react";
+import { useEffect as useEffect18 } from "react";
 
 // src/components/ui/switch.tsx
 import * as SwitchPrimitive from "@radix-ui/react-switch";
-import { jsx as jsx38 } from "react/jsx-runtime";
+import { jsx as jsx39 } from "react/jsx-runtime";
 function Switch({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx39(
     SwitchPrimitive.Root,
     {
       "data-slot": "switch",
@@ -2598,7 +2690,7 @@ function Switch({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx38(
+      children: /* @__PURE__ */ jsx39(
         SwitchPrimitive.Thumb,
         {
           "data-slot": "switch-thumb",
@@ -2612,11 +2704,11 @@ function Switch({
 }
 
 // src/components/Inputs/SwitchToggle/SwitchToggle.tsx
-import { Fragment as Fragment13, jsx as jsx39, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx40, jsxs as jsxs22 } from "react/jsx-runtime";
 var SwitchToggle = ({ className, style, ...props }) => {
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
-  useEffect17(() => {
+  useEffect18(() => {
     if (props.value !== void 0) {
       handleChange?.(props.value);
     }
@@ -2624,9 +2716,9 @@ var SwitchToggle = ({ className, style, ...props }) => {
   const handleChange = (value) => {
     props.onChange?.(value, props?.name || "");
   };
-  return /* @__PURE__ */ jsxs21(Fragment13, { children: [
-    /* @__PURE__ */ jsx39("div", { className, style, children: /* @__PURE__ */ jsxs21("div", { className: "flex items-center space-x-2 mb-2", children: [
-      /* @__PURE__ */ jsx39(
+  return /* @__PURE__ */ jsxs22(Fragment13, { children: [
+    /* @__PURE__ */ jsx40("div", { className, style, children: /* @__PURE__ */ jsxs22("div", { className: "flex items-center space-x-2 mb-2", children: [
+      /* @__PURE__ */ jsx40(
         Switch,
         {
           id: props.name || "switch",
@@ -2635,18 +2727,18 @@ var SwitchToggle = ({ className, style, ...props }) => {
           disabled: isDisabled || !isEditable
         }
       ),
-      /* @__PURE__ */ jsx39(Label2, { htmlFor: props.name || "switch", children: props.text })
+      /* @__PURE__ */ jsx40(Label2, { htmlFor: props.name || "switch", children: props.text })
     ] }) }),
-    props.errorMessage && /* @__PURE__ */ jsx39("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx40("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var SwitchToggle_default = SwitchToggle;
 
 // src/components/Inputs/PhoneInput/PhoneInput.tsx
-import { useEffect as useEffect18, useRef as useRef6 } from "react";
+import { useEffect as useEffect19, useRef as useRef7 } from "react";
 import { PhoneInput as PhoneInputField } from "react-international-phone";
 import "react-international-phone/style.css";
-import { Fragment as Fragment14, jsx as jsx40, jsxs as jsxs22 } from "react/jsx-runtime";
+import { Fragment as Fragment14, jsx as jsx41, jsxs as jsxs23 } from "react/jsx-runtime";
 var ensureDialcode = (val) => {
   if (!val) return "";
   const trimmed = val.trim();
@@ -2655,11 +2747,11 @@ var ensureDialcode = (val) => {
   return `+91${local}`;
 };
 var PhoneInput = ({ className, style, ...props }) => {
-  const ref = useRef6(null);
+  const ref = useRef7(null);
   const placeholder = props.placeholder ?? "Enter phone number";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
-  useEffect18(() => {
+  useEffect19(() => {
     if (props.value !== void 0) {
       handleChange?.(ensureDialcode(props.value), ref.current?.state);
     }
@@ -2674,8 +2766,8 @@ var PhoneInput = ({ className, style, ...props }) => {
     props.onChange?.(event, props.name || "");
     props.getPhoneState?.(meta);
   };
-  return /* @__PURE__ */ jsxs22(Fragment14, { children: [
-    /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsxs23(Fragment14, { children: [
+    /* @__PURE__ */ jsx41(
       PhoneInputField,
       {
         ref,
@@ -2700,21 +2792,21 @@ var PhoneInput = ({ className, style, ...props }) => {
         disabled: isDisabled || !isEditable
       }
     ),
-    props.errorMessage && /* @__PURE__ */ jsx40("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx41("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var PhoneInput_default = PhoneInput;
 
 // src/components/Inputs/SearchInput/SearchInput.tsx
-import { useEffect as useEffect19 } from "react";
-import { Fragment as Fragment15, jsx as jsx41, jsxs as jsxs23 } from "react/jsx-runtime";
+import { useEffect as useEffect20 } from "react";
+import { Fragment as Fragment15, jsx as jsx42, jsxs as jsxs24 } from "react/jsx-runtime";
 var SearchInput = ({ className, style, ...props }) => {
   const placeholder = props.placeholder ?? "Placeholder text";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
   const isReadonly = props.isReadonly ?? false;
   const isAutocomplete = props.isAutocomplete ?? false;
-  useEffect19(() => {
+  useEffect20(() => {
     if (props.value !== void 0) {
       const e = { target: { value: props.value }, type: "change" };
       handleChange?.(e);
@@ -2730,8 +2822,8 @@ var SearchInput = ({ className, style, ...props }) => {
     if (value === null || value === void 0) return "";
     return value;
   };
-  return /* @__PURE__ */ jsxs23(Fragment15, { children: [
-    /* @__PURE__ */ jsx41("div", { className: "flex justify-start items-center relative", children: /* @__PURE__ */ jsx41(
+  return /* @__PURE__ */ jsxs24(Fragment15, { children: [
+    /* @__PURE__ */ jsx42("div", { className: "flex justify-start items-center relative", children: /* @__PURE__ */ jsx42(
       Input,
       {
         type: props.inputType || "search",
@@ -2750,17 +2842,17 @@ var SearchInput = ({ className, style, ...props }) => {
         readOnly: isReadonly
       }
     ) }),
-    props.errorMessage && /* @__PURE__ */ jsx41("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx42("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var SearchInput_default = SearchInput;
 
 // src/components/Inputs/FileInput/FileInput.tsx
-import { useEffect as useEffect20 } from "react";
-import { jsx as jsx42, jsxs as jsxs24 } from "react/jsx-runtime";
+import { useEffect as useEffect21 } from "react";
+import { jsx as jsx43, jsxs as jsxs25 } from "react/jsx-runtime";
 var FileInput = ({ className, style, ...props }) => {
   const placeholder = props.placeholder ?? "Placeholder text";
-  useEffect20(() => {
+  useEffect21(() => {
     if (props.value !== void 0) {
       const e = { target: { value: props.value }, type: "change" };
       handleChange?.(e);
@@ -2776,8 +2868,8 @@ var FileInput = ({ className, style, ...props }) => {
     if (value === null || value === void 0) return "";
     return value;
   };
-  return /* @__PURE__ */ jsxs24("div", { className: "d-flex items-center relative align-middle", children: [
-    /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsxs25("div", { className: "d-flex items-center relative align-middle", children: [
+    /* @__PURE__ */ jsx43(
       Input,
       {
         type: props.inputType || "file",
@@ -2794,25 +2886,25 @@ var FileInput = ({ className, style, ...props }) => {
         onChange: handleChange
       }
     ),
-    props.errorMessage && /* @__PURE__ */ jsx42("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx43("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var FileInput_default = FileInput;
 
 // src/components/Inputs/DatePicker/DatePicker.tsx
-import * as React8 from "react";
+import * as React9 from "react";
 import { format } from "date-fns";
 import { Calendar1Icon, XSquareIcon as XSquareIcon2 } from "lucide-react";
 
 // src/components/ui/calendar.tsx
-import * as React7 from "react";
+import * as React8 from "react";
 import {
   ChevronDownIcon as ChevronDownIcon2,
   ChevronLeftIcon,
   ChevronRightIcon as ChevronRightIcon2
 } from "lucide-react";
 import { DayPicker, getDefaultClassNames } from "react-day-picker";
-import { jsx as jsx43 } from "react/jsx-runtime";
+import { jsx as jsx44 } from "react/jsx-runtime";
 function Calendar({
   className,
   classNames,
@@ -2824,7 +2916,7 @@ function Calendar({
   ...props
 }) {
   const defaultClassNames = getDefaultClassNames();
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx44(
     DayPicker,
     {
       showOutsideDays,
@@ -2923,7 +3015,7 @@ function Calendar({
       },
       components: {
         Root: ({ className: className2, rootRef, ...props2 }) => {
-          return /* @__PURE__ */ jsx43(
+          return /* @__PURE__ */ jsx44(
             "div",
             {
               "data-slot": "calendar",
@@ -2935,10 +3027,10 @@ function Calendar({
         },
         Chevron: ({ className: className2, orientation, ...props2 }) => {
           if (orientation === "left") {
-            return /* @__PURE__ */ jsx43(ChevronLeftIcon, { className: cn("size-4", className2), ...props2 });
+            return /* @__PURE__ */ jsx44(ChevronLeftIcon, { className: cn("size-4", className2), ...props2 });
           }
           if (orientation === "right") {
-            return /* @__PURE__ */ jsx43(
+            return /* @__PURE__ */ jsx44(
               ChevronRightIcon2,
               {
                 className: cn("size-4", className2),
@@ -2946,11 +3038,11 @@ function Calendar({
               }
             );
           }
-          return /* @__PURE__ */ jsx43(ChevronDownIcon2, { className: cn("size-4", className2), ...props2 });
+          return /* @__PURE__ */ jsx44(ChevronDownIcon2, { className: cn("size-4", className2), ...props2 });
         },
         DayButton: CalendarDayButton,
         WeekNumber: ({ children, ...props2 }) => {
-          return /* @__PURE__ */ jsx43("td", { ...props2, children: /* @__PURE__ */ jsx43("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) });
+          return /* @__PURE__ */ jsx44("td", { ...props2, children: /* @__PURE__ */ jsx44("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) });
         },
         ...components
       },
@@ -2965,11 +3057,11 @@ function CalendarDayButton({
   ...props
 }) {
   const defaultClassNames = getDefaultClassNames();
-  const ref = React7.useRef(null);
-  React7.useEffect(() => {
+  const ref = React8.useRef(null);
+  React8.useEffect(() => {
     if (modifiers.focused) ref.current?.focus();
   }, [modifiers.focused]);
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx44(
     Button,
     {
       ref,
@@ -2992,16 +3084,16 @@ function CalendarDayButton({
 
 // src/components/ui/popover.tsx
 import * as PopoverPrimitive from "@radix-ui/react-popover";
-import { jsx as jsx44 } from "react/jsx-runtime";
+import { jsx as jsx45 } from "react/jsx-runtime";
 function Popover({
   ...props
 }) {
-  return /* @__PURE__ */ jsx44(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
+  return /* @__PURE__ */ jsx45(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
 }
 function PopoverTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ jsx44(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
+  return /* @__PURE__ */ jsx45(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
 }
 function PopoverContent({
   className,
@@ -3009,7 +3101,7 @@ function PopoverContent({
   sideOffset = 4,
   ...props
 }) {
-  return /* @__PURE__ */ jsx44(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx45(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx45(
     PopoverPrimitive.Content,
     {
       "data-slot": "popover-content",
@@ -3025,7 +3117,7 @@ function PopoverContent({
 }
 
 // src/components/Inputs/DatePicker/DatePicker.tsx
-import { Fragment as Fragment16, jsx as jsx45, jsxs as jsxs25 } from "react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx46, jsxs as jsxs26 } from "react/jsx-runtime";
 function resolveDate(option, customOption) {
   if (!option) return void 0;
   switch (option) {
@@ -3092,7 +3184,7 @@ function DateTimePicker({
   mode = "date",
   ...props
 }) {
-  const [open, setOpen] = React8.useState(false);
+  const [open, setOpen] = React9.useState(false);
   const placeholderMap = {
     date: "Select date",
     datetime: "Select date & time",
@@ -3111,7 +3203,7 @@ function DateTimePicker({
   const isAutocomplete = props.isAutocomplete ?? false;
   const minDate = resolveDate(minimumDate, customMinimumDate);
   const maxDate = resolveDate(maximumDate, customMaximumDate);
-  const [date, setDate] = React8.useState(() => {
+  const [date, setDate] = React9.useState(() => {
     if (props.value) {
       const d = new Date(props.value);
       if (!isNaN(d.getTime())) return d;
@@ -3120,15 +3212,15 @@ function DateTimePicker({
   });
   const initialHours = date ? date.getHours() : 0;
   const initialMinutes = date ? date.getMinutes() : 0;
-  const [hours, setHours] = React8.useState(initialHours);
-  const [minutes, setMinutes] = React8.useState(initialMinutes);
-  const [amPm, setAmPm] = React8.useState("AM");
-  const displayHours = React8.useMemo(() => {
+  const [hours, setHours] = React9.useState(initialHours);
+  const [minutes, setMinutes] = React9.useState(initialMinutes);
+  const [amPm, setAmPm] = React9.useState("AM");
+  const displayHours = React9.useMemo(() => {
     if (hours === 0) return 12;
     if (hours > 12) return hours - 12;
     return hours;
   }, [hours]);
-  React8.useEffect(() => {
+  React9.useEffect(() => {
     setAmPm(hours >= 12 ? "PM" : "AM");
   }, [hours]);
   const emitChange = (nextDate) => {
@@ -3152,7 +3244,7 @@ function DateTimePicker({
     };
     props.onChange(event, props.name || "");
   };
-  React8.useEffect(() => {
+  React9.useEffect(() => {
     if (!props.value) {
       const defaultDate = resolveDefaultDate(defaultDateValue, customDefaultDate);
       setDate(defaultDate);
@@ -3174,8 +3266,8 @@ function DateTimePicker({
       setMinutes(d.getMinutes());
     }
   }, [props.value, defaultDateValue, customDefaultDate]);
-  const [year, setYear] = React8.useState(date ? date.getFullYear() : (/* @__PURE__ */ new Date()).getFullYear());
-  React8.useEffect(() => {
+  const [year, setYear] = React9.useState(date ? date.getFullYear() : (/* @__PURE__ */ new Date()).getFullYear());
+  React9.useEffect(() => {
     if (!date) return;
     const newDate = new Date(date);
     newDate.setFullYear(year);
@@ -3259,7 +3351,7 @@ function DateTimePicker({
   for (let y = currentYear - 90; y <= currentYear; y++) {
     yearOptions.push(y);
   }
-  const displayValue = React8.useMemo(() => {
+  const displayValue = React9.useMemo(() => {
     if (!date) return "";
     try {
       if (mode === "date") return format(date, "dd-MM-yyyy");
@@ -3270,11 +3362,11 @@ function DateTimePicker({
     }
   }, [date, mode]);
   const isInputDisabled = isDisabled || !isEditable;
-  const [calendarMonthState, setCalendarMonthState] = React8.useState(() => {
+  const [calendarMonthState, setCalendarMonthState] = React9.useState(() => {
     const currentMonth = (/* @__PURE__ */ new Date()).getMonth();
     return date ? new Date(date.getFullYear(), date.getMonth()) : new Date(year, currentMonth);
   });
-  React8.useEffect(() => {
+  React9.useEffect(() => {
     setCalendarMonthState(new Date(year, calendarMonthState.getMonth()));
   }, [year]);
   const handleToday = () => {
@@ -3283,9 +3375,9 @@ function DateTimePicker({
     updateDateTime(selectedYearDate);
     setOpen(false);
   };
-  return /* @__PURE__ */ jsxs25("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ jsxs25(Popover, { open, onOpenChange: setOpen, children: [
-      /* @__PURE__ */ jsx45(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs25(
+  return /* @__PURE__ */ jsxs26("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ jsxs26(Popover, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx46(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs26(
         Button,
         {
           type: "button",
@@ -3302,9 +3394,9 @@ function DateTimePicker({
           },
           disabled: isInputDisabled,
           children: [
-            /* @__PURE__ */ jsx45(Calendar1Icon, { className: "absolute left-2 top-2" }),
-            /* @__PURE__ */ jsx45("span", { className: "ml-5", children: displayValue || placeholder }),
-            displayValue && /* @__PURE__ */ jsx45(
+            /* @__PURE__ */ jsx46(Calendar1Icon, { className: "absolute left-2 top-2" }),
+            /* @__PURE__ */ jsx46("span", { className: "ml-5", children: displayValue || placeholder }),
+            displayValue && /* @__PURE__ */ jsx46(
               XSquareIcon2,
               {
                 className: "absolute right-2 top-2 cursor-pointer",
@@ -3321,10 +3413,10 @@ function DateTimePicker({
           ]
         }
       ) }),
-      /* @__PURE__ */ jsx45(PopoverContent, { className: "w-auto text-sm p-2", align: "start", children: /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-1", children: [
-        (mode === "date" || mode === "datetime") && /* @__PURE__ */ jsxs25(Fragment16, { children: [
-          /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between gap-1", children: [
-            /* @__PURE__ */ jsx45(
+      /* @__PURE__ */ jsx46(PopoverContent, { className: "w-auto text-sm p-2", align: "start", children: /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-1", children: [
+        (mode === "date" || mode === "datetime") && /* @__PURE__ */ jsxs26(Fragment16, { children: [
+          /* @__PURE__ */ jsxs26("div", { className: "flex items-center justify-between gap-1", children: [
+            /* @__PURE__ */ jsx46(
               "label",
               {
                 className: "text-xs text-blue-600 font-bold cursor-pointer",
@@ -3333,18 +3425,18 @@ function DateTimePicker({
                 children: "Today"
               }
             ),
-            /* @__PURE__ */ jsx45(
+            /* @__PURE__ */ jsx46(
               "select",
               {
                 className: "h-8 rounded border bg-background px-2 text-xs",
                 value: year,
                 onChange: (e) => setYear(Number(e.target.value)),
                 disabled: isInputDisabled || isReadonly,
-                children: yearOptions.map((y) => /* @__PURE__ */ jsx45("option", { value: y, children: y }, y))
+                children: yearOptions.map((y) => /* @__PURE__ */ jsx46("option", { value: y, children: y }, y))
               }
             )
           ] }),
-          /* @__PURE__ */ jsx45("div", { className: "calendar-container", children: /* @__PURE__ */ jsx45(
+          /* @__PURE__ */ jsx46("div", { className: "calendar-container", children: /* @__PURE__ */ jsx46(
             Calendar,
             {
               mode: "single",
@@ -3362,20 +3454,20 @@ function DateTimePicker({
             }
           ) })
         ] }),
-        (mode === "time" || mode === "datetime") && /* @__PURE__ */ jsxs25("div", { className: "flex items-center gap-2 mt-0", children: [
-          /* @__PURE__ */ jsx45("label", { className: "text-xs text-muted-foreground", children: "Time" }),
-          /* @__PURE__ */ jsx45(
+        (mode === "time" || mode === "datetime") && /* @__PURE__ */ jsxs26("div", { className: "flex items-center gap-2 mt-0", children: [
+          /* @__PURE__ */ jsx46("label", { className: "text-xs text-muted-foreground", children: "Time" }),
+          /* @__PURE__ */ jsx46(
             "select",
             {
               className: "h-8 rounded border bg-background px-2 text-xs",
               value: displayHours,
               onChange: handleHoursChange,
               disabled: isInputDisabled || isReadonly,
-              children: Array.from({ length: 12 }, (_, i) => i + 1).map((hour) => /* @__PURE__ */ jsx45("option", { value: hour, children: hour.toString().padStart(2, "0") }, hour))
+              children: Array.from({ length: 12 }, (_, i) => i + 1).map((hour) => /* @__PURE__ */ jsx46("option", { value: hour, children: hour.toString().padStart(2, "0") }, hour))
             }
           ),
-          /* @__PURE__ */ jsx45("span", { className: "text-sm", children: ":" }),
-          /* @__PURE__ */ jsx45(
+          /* @__PURE__ */ jsx46("span", { className: "text-sm", children: ":" }),
+          /* @__PURE__ */ jsx46(
             "select",
             {
               className: "h-8 rounded border bg-background px-2 text-xs",
@@ -3384,11 +3476,11 @@ function DateTimePicker({
               disabled: isInputDisabled || isReadonly,
               children: Array.from({ length: 12 }).map((_, i) => {
                 const val = i * 5;
-                return /* @__PURE__ */ jsx45("option", { value: val, children: val.toString().padStart(2, "0") }, val);
+                return /* @__PURE__ */ jsx46("option", { value: val, children: val.toString().padStart(2, "0") }, val);
               })
             }
           ),
-          /* @__PURE__ */ jsxs25(
+          /* @__PURE__ */ jsxs26(
             "select",
             {
               className: "h-8 rounded border bg-background px-2 text-xs",
@@ -3396,15 +3488,15 @@ function DateTimePicker({
               onChange: handleAmPmChange,
               disabled: isInputDisabled || isReadonly,
               children: [
-                /* @__PURE__ */ jsx45("option", { value: "AM", children: "AM" }),
-                /* @__PURE__ */ jsx45("option", { value: "PM", children: "PM" })
+                /* @__PURE__ */ jsx46("option", { value: "AM", children: "AM" }),
+                /* @__PURE__ */ jsx46("option", { value: "PM", children: "PM" })
               ]
             }
           )
         ] })
       ] }) })
     ] }),
-    /* @__PURE__ */ jsx45(
+    /* @__PURE__ */ jsx46(
       Input,
       {
         type: "hidden",
@@ -3417,23 +3509,23 @@ function DateTimePicker({
         }
       }
     ),
-    props.errorMessage && /* @__PURE__ */ jsx45("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx46("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 }
 
 // src/components/Inputs/DateRange/DateRange.tsx
-import React9, { useEffect as useEffect23 } from "react";
+import React10, { useEffect as useEffect24 } from "react";
 import { addDays, format as format2 } from "date-fns";
-import { Fragment as Fragment17, jsx as jsx46, jsxs as jsxs26 } from "react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx47, jsxs as jsxs27 } from "react/jsx-runtime";
 var DateRange = ({ className, style, ...props }) => {
   const isDateRange = (val) => !!val && val.from instanceof Date;
-  const [date, setDate] = React9.useState(
+  const [date, setDate] = React10.useState(
     isDateRange(props.value) ? props.value : {
       from: /* @__PURE__ */ new Date(),
       to: addDays(/* @__PURE__ */ new Date(), 7)
     }
   );
-  useEffect23(() => {
+  useEffect24(() => {
     if (props.value && isDateRange(props.value)) {
       handleChange?.(props.value);
     }
@@ -3444,9 +3536,9 @@ var DateRange = ({ className, style, ...props }) => {
       props.onChange?.(value, props?.name || "");
     }
   };
-  return /* @__PURE__ */ jsxs26(Fragment17, { children: [
-    /* @__PURE__ */ jsx46("div", { className, style, children: /* @__PURE__ */ jsxs26(Popover, { children: [
-      /* @__PURE__ */ jsx46(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx46(
+  return /* @__PURE__ */ jsxs27(Fragment17, { children: [
+    /* @__PURE__ */ jsx47("div", { className, style, children: /* @__PURE__ */ jsxs27(Popover, { children: [
+      /* @__PURE__ */ jsx47(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx47(
         Button,
         {
           id: "date",
@@ -3455,15 +3547,15 @@ var DateRange = ({ className, style, ...props }) => {
             "w-full justify-start text-left font-normal text-[11px] border-[#BDBDBD]",
             !date && "text-muted-foreground"
           ),
-          children: date?.from ? date.to ? /* @__PURE__ */ jsxs26(Fragment17, { children: [
+          children: date?.from ? date.to ? /* @__PURE__ */ jsxs27(Fragment17, { children: [
             format2(date.from, "LLL dd, y"),
             " -",
             " ",
             format2(date.to, "LLL dd, y")
-          ] }) : format2(date.from, "LLL dd, y") : /* @__PURE__ */ jsx46("span", { children: "Pick a date range" })
+          ] }) : format2(date.from, "LLL dd, y") : /* @__PURE__ */ jsx47("span", { children: "Pick a date range" })
         }
       ) }),
-      /* @__PURE__ */ jsx46(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsx46(
+      /* @__PURE__ */ jsx47(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsx47(
         Calendar,
         {
           mode: "range",
@@ -3474,21 +3566,21 @@ var DateRange = ({ className, style, ...props }) => {
         }
       ) })
     ] }) }),
-    props.errorMessage && /* @__PURE__ */ jsx46("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx47("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var DateRange_default = DateRange;
 
 // src/components/Inputs/TextInputGroup/TextInputGroup.tsx
-import { useEffect as useEffect24 } from "react";
-import { Fragment as Fragment18, jsx as jsx47, jsxs as jsxs27 } from "react/jsx-runtime";
+import { useEffect as useEffect25 } from "react";
+import { Fragment as Fragment18, jsx as jsx48, jsxs as jsxs28 } from "react/jsx-runtime";
 var TextInputGroup = ({ className, style, prepend, append, ...props }) => {
   const placeholder = props.placeholder ?? "Placeholder text";
   const isEditable = props.isEditable ?? true;
   const isDisabled = props.isDisabled ?? false;
   const isReadonly = props.isReadonly ?? false;
   const isAutocomplete = props.isAutocomplete ?? false;
-  useEffect24(() => {
+  useEffect25(() => {
     if (props.value !== void 0) {
       const e = { target: { value: props.value }, type: "change" };
       handleChange?.(e);
@@ -3497,8 +3589,8 @@ var TextInputGroup = ({ className, style, prepend, append, ...props }) => {
   const handleChange = (e) => {
     props.onChange?.(e, props?.name || "");
   };
-  return /* @__PURE__ */ jsxs27(Fragment18, { children: [
-    /* @__PURE__ */ jsxs27(
+  return /* @__PURE__ */ jsxs28(Fragment18, { children: [
+    /* @__PURE__ */ jsxs28(
       "div",
       {
         className: cn(
@@ -3508,8 +3600,8 @@ var TextInputGroup = ({ className, style, prepend, append, ...props }) => {
           props.errorMessage ? "border-red-500" : ""
         ),
         children: [
-          prepend && /* @__PURE__ */ jsx47("div", { className: "px-3 flex items-center bg-gray-500 text-white h-10 rounded-l-md", children: prepend }),
-          /* @__PURE__ */ jsx47(
+          prepend && /* @__PURE__ */ jsx48("div", { className: "px-3 flex items-center bg-gray-500 text-white h-10 rounded-l-md", children: prepend }),
+          /* @__PURE__ */ jsx48(
             Input,
             {
               id: props.name || "prepend-input",
@@ -3531,19 +3623,19 @@ var TextInputGroup = ({ className, style, prepend, append, ...props }) => {
               readOnly: isReadonly
             }
           ),
-          append && /* @__PURE__ */ jsx47("div", { className: "px-3 flex items-center bg-gray-500 text-white h-10 rounded-r-md", children: append })
+          append && /* @__PURE__ */ jsx48("div", { className: "px-3 flex items-center bg-gray-500 text-white h-10 rounded-r-md", children: append })
         ]
       }
     ),
-    props.errorMessage && /* @__PURE__ */ jsx47("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
+    props.errorMessage && /* @__PURE__ */ jsx48("p", { className: "mt-1 text-xs text-red-500", children: props.errorMessage })
   ] });
 };
 var TextInputGroup_default = TextInputGroup;
 
 // src/components/Inputs/Multiselect/MultiSelect.tsx
-import { useState as useState10, useRef as useRef8, useEffect as useEffect25, useMemo as useMemo6 } from "react";
+import { useState as useState11, useRef as useRef9, useEffect as useEffect26, useMemo as useMemo6 } from "react";
 import { XIcon, XSquareIcon as XSquareIcon3 } from "lucide-react";
-import { Fragment as Fragment19, jsx as jsx48, jsxs as jsxs28 } from "react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx49, jsxs as jsxs29 } from "react/jsx-runtime";
 function LazyMultiSelectDropdown({
   value = [],
   onChange,
@@ -3561,10 +3653,10 @@ function LazyMultiSelectDropdown({
   outputFormat = "array",
   ...props
 }) {
-  const [isOpen, setIsOpen] = useState10(false);
-  const [searchTerm, setSearchTerm] = useState10("");
-  const dropdownRef = useRef8(null);
-  const observerTarget = useRef8(null);
+  const [isOpen, setIsOpen] = useState11(false);
+  const [searchTerm, setSearchTerm] = useState11("");
+  const dropdownRef = useRef9(null);
+  const observerTarget = useRef9(null);
   const ensureUnique = (arr) => {
     return Array.from(new Set(arr));
   };
@@ -3620,7 +3712,7 @@ function LazyMultiSelectDropdown({
       return { value: id, label: id };
     });
   }, [normalizedValue, lazyOptions]);
-  useEffect25(() => {
+  useEffect26(() => {
     const handleClick = (e) => {
       if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
         setIsOpen(false);
@@ -3629,7 +3721,7 @@ function LazyMultiSelectDropdown({
     document.addEventListener("mousedown", handleClick);
     return () => document.removeEventListener("mousedown", handleClick);
   }, []);
-  useEffect25(() => {
+  useEffect26(() => {
     if (!isOpen || !hasMore || loading) return;
     const obs = new IntersectionObserver(
       (entries) => {
@@ -3666,8 +3758,8 @@ function LazyMultiSelectDropdown({
       }
     }
   };
-  return /* @__PURE__ */ jsxs28("div", { ref: dropdownRef, className: "relative w-full", children: [
-    /* @__PURE__ */ jsxs28(
+  return /* @__PURE__ */ jsxs29("div", { ref: dropdownRef, className: "relative w-full", children: [
+    /* @__PURE__ */ jsxs29(
       "div",
       {
         onClick: handleFocus,
@@ -3679,13 +3771,13 @@ function LazyMultiSelectDropdown({
           "px-2 py-2 min-h-[35px]"
         ),
         children: [
-          selectedOptions.map((opt) => /* @__PURE__ */ jsxs28(
+          selectedOptions.map((opt) => /* @__PURE__ */ jsxs29(
             "span",
             {
               className: "bg-blue-100 text-blue-700 px-2 py-1 rounded-md text-xs flex items-center gap-1",
               children: [
                 opt.label,
-                !disabled && !readOnly && /* @__PURE__ */ jsx48(
+                !disabled && !readOnly && /* @__PURE__ */ jsx49(
                   "button",
                   {
                     type: "button",
@@ -3694,14 +3786,14 @@ function LazyMultiSelectDropdown({
                       removeTag(opt.value);
                     },
                     className: "hover:text-red-600",
-                    children: /* @__PURE__ */ jsx48(XIcon, { size: 12 })
+                    children: /* @__PURE__ */ jsx49(XIcon, { size: 12 })
                   }
                 )
               ]
             },
             opt.value
           )),
-          /* @__PURE__ */ jsx48(
+          /* @__PURE__ */ jsx49(
             "input",
             {
               type: "text",
@@ -3717,8 +3809,8 @@ function LazyMultiSelectDropdown({
         ]
       }
     ),
-    errorMessage && /* @__PURE__ */ jsx48("p", { className: "mt-1 text-xs text-red-500", children: errorMessage }),
-    isOpen && !disabled && /* @__PURE__ */ jsx48(Portal_default, { children: /* @__PURE__ */ jsx48(
+    errorMessage && /* @__PURE__ */ jsx49("p", { className: "mt-1 text-xs text-red-500", children: errorMessage }),
+    isOpen && !disabled && /* @__PURE__ */ jsx49(Portal_default, { children: /* @__PURE__ */ jsx49(
       "div",
       {
         onMouseDown: (e) => e.stopPropagation(),
@@ -3729,10 +3821,10 @@ function LazyMultiSelectDropdown({
           top: dropdownRef.current ? dropdownRef.current.getBoundingClientRect().bottom + window.scrollY : 0,
           left: dropdownRef.current ? dropdownRef.current.getBoundingClientRect().left + window.scrollX : 0
         },
-        children: dataLoading && lazyOptions.length === 0 ? /* @__PURE__ */ jsx48("div", { className: "px-3 py-3 text-center text-gray-500", children: "Loading..." }) : lazyOptions.length > 0 ? /* @__PURE__ */ jsxs28(Fragment19, { children: [
+        children: dataLoading && lazyOptions.length === 0 ? /* @__PURE__ */ jsx49("div", { className: "px-3 py-3 text-center text-gray-500", children: "Loading..." }) : lazyOptions.length > 0 ? /* @__PURE__ */ jsxs29(Fragment19, { children: [
           lazyOptions.map((option) => {
             const isSelected = normalizedValue.includes(option.value);
-            return /* @__PURE__ */ jsxs28(
+            return /* @__PURE__ */ jsxs29(
               "div",
               {
                 onClick: () => toggleSelect(option.value),
@@ -3742,13 +3834,13 @@ function LazyMultiSelectDropdown({
                 ),
                 children: [
                   option.label,
-                  isSelected && /* @__PURE__ */ jsx48(XSquareIcon3, { size: 16 })
+                  isSelected && /* @__PURE__ */ jsx49(XSquareIcon3, { size: 16 })
                 ]
               },
               option.value
             );
           }),
-          hasMore && /* @__PURE__ */ jsx48(
+          hasMore && /* @__PURE__ */ jsx49(
             "div",
             {
               ref: observerTarget,
@@ -3756,14 +3848,14 @@ function LazyMultiSelectDropdown({
               children: loading ? "Loading\u2026" : "Scroll for more\u2026"
             }
           )
-        ] }) : /* @__PURE__ */ jsx48("div", { className: "px-3 py-3 text-center text-gray-500", children: "No results" })
+        ] }) : /* @__PURE__ */ jsx49("div", { className: "px-3 py-3 text-center text-gray-500", children: "No results" })
       }
     ) })
   ] });
 }
 
 // src/components/ui/data-table.tsx
-import * as React11 from "react";
+import * as React12 from "react";
 import { faEllipsisH } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon as FontAwesomeIcon3 } from "@fortawesome/react-fontawesome";
 import {
@@ -3777,14 +3869,14 @@ import axios3 from "axios";
 import { ArrowDown, ArrowUp, ArrowUpDown, Search } from "lucide-react";
 
 // src/components/ui/table.tsx
-import { jsx as jsx49 } from "react/jsx-runtime";
+import { jsx as jsx50 } from "react/jsx-runtime";
 function Table({ className, ...props }) {
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "div",
     {
       "data-slot": "table-container",
       className: "relative w-full overflow-x-auto rounded-md border border-gray-200 bg-white",
-      children: /* @__PURE__ */ jsx49(
+      children: /* @__PURE__ */ jsx50(
         "table",
         {
           "data-slot": "table",
@@ -3796,7 +3888,7 @@ function Table({ className, ...props }) {
   );
 }
 function TableHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "thead",
     {
       "data-slot": "table-header",
@@ -3809,7 +3901,7 @@ function TableHeader({ className, ...props }) {
   );
 }
 function TableBody({ className, ...props }) {
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "tbody",
     {
       "data-slot": "table-body",
@@ -3822,7 +3914,7 @@ function TableBody({ className, ...props }) {
   );
 }
 function TableRow({ className, ...props }) {
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "tr",
     {
       "data-slot": "table-row",
@@ -3835,7 +3927,7 @@ function TableRow({ className, ...props }) {
   );
 }
 function TableHead({ className, ...props }) {
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "th",
     {
       "data-slot": "table-head",
@@ -3848,7 +3940,7 @@ function TableHead({ className, ...props }) {
   );
 }
 function TableCell({ className, ...props }) {
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     "td",
     {
       "data-slot": "table-cell",
@@ -3865,11 +3957,11 @@ function TableCell({ className, ...props }) {
 import { createColumnHelper } from "@tanstack/react-table";
 
 // src/lib/table/cellRendererFactory.tsx
-import React10 from "react";
+import React11 from "react";
 import * as LucideIcons2 from "lucide-react";
 import { Star as Star2 } from "lucide-react";
 import Image from "next/image";
-import { Fragment as Fragment20, jsx as jsx50, jsxs as jsxs29 } from "react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx51, jsxs as jsxs30 } from "react/jsx-runtime";
 var getContrastColor = (bg) => {
   let c = bg.trim().toUpperCase();
   if (/^#([a-fA-F0-9]{3})$/.test(c)) {
@@ -3903,9 +3995,9 @@ var getContrastColor = (bg) => {
 };
 var sanitizeValue = (val) => {
   if (val == null) return null;
-  if (React10.isValidElement(val)) return val;
+  if (React11.isValidElement(val)) return val;
   if (typeof val === "string" || typeof val === "number") return val;
-  if (Array.isArray(val)) return val.map((v, i) => /* @__PURE__ */ jsx50(React10.Fragment, { children: sanitizeValue(v) }, i));
+  if (Array.isArray(val)) return val.map((v, i) => /* @__PURE__ */ jsx51(React11.Fragment, { children: sanitizeValue(v) }, i));
   if (typeof val === "object") {
     if ("name" in val && typeof val.name === "string") return val.name;
     if ("label" in val && typeof val.label === "string") return val.label;
@@ -3923,13 +4015,13 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
   switch (renderer) {
     /* -------------------- BASIC -------------------- */
     case "text":
-      return /* @__PURE__ */ jsx50("span", { children: rowValue || formattedValue });
+      return /* @__PURE__ */ jsx51("span", { children: rowValue || formattedValue });
     case "number":
-      return /* @__PURE__ */ jsx50("span", { className: "tabular-nums text-right", children: valueFormatter(rowValue || value, "number:2") });
+      return /* @__PURE__ */ jsx51("span", { className: "tabular-nums text-right", children: valueFormatter(rowValue || value, "number:2") });
     case "date":
-      return /* @__PURE__ */ jsx50("span", { children: valueFormatter(rowValue || value, format3) });
+      return /* @__PURE__ */ jsx51("span", { children: valueFormatter(rowValue || value, format3) });
     case "link":
-      return /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx51(
         "a",
         {
           href: `${rendererProps?.prefix || ""}${rowValue || formattedValue}`,
@@ -3941,7 +4033,7 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
       );
     /* -------------------- VISUAL -------------------- */
     case "image":
-      return /* @__PURE__ */ jsx50("div", { className: "relative", children: /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx51("div", { className: "relative", children: /* @__PURE__ */ jsx51(
         Image,
         {
           src: rowValue || formattedValue || rendererProps?.fallback || "/placeholder.png",
@@ -3957,7 +4049,7 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
       ) });
     case "icon":
       if (!formattedValue) return null;
-      return /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx51(
         Icon,
         {
           iconSet: rendererProps?.iconSet,
@@ -3974,7 +4066,7 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
       const color = rendererProps?.colorMap?.[formattedValue] || rendererProps?.color || "gray";
       if (!formattedValue) return null;
       const textColor = getContrastColor(color);
-      return /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx51(
         "span",
         {
           className: `inline-block px-2 py-1 text-xs rounded-full bg-${color}-100 text-${textColor}-700 ${rendererProps?.className || ""}`,
@@ -3989,13 +4081,13 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
       const IconComponent = typeof maybeIcon === "function" ? maybeIcon : LucideIcons2.Star;
       if (!formattedValue) return null;
       const textColor = getContrastColor(color);
-      return /* @__PURE__ */ jsxs29(
+      return /* @__PURE__ */ jsxs30(
         "span",
         {
           className: `inline-flex items-center gap-1 px-2 py-1 text-xs rounded-full bg-[${color}]-100 text-[${textColor}]-700`,
           style: { backgroundColor: color, color: textColor },
           children: [
-            rendererProps?.icon && /* @__PURE__ */ jsx50(Fragment20, { children: IconComponent ? /* @__PURE__ */ jsx50(IconComponent, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx50(LucideIcons2.Box, { className: "h-4 w-4" }) }),
+            rendererProps?.icon && /* @__PURE__ */ jsx51(Fragment20, { children: IconComponent ? /* @__PURE__ */ jsx51(IconComponent, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx51(LucideIcons2.Box, { className: "h-4 w-4" }) }),
             formattedValue
           ]
         }
@@ -4003,7 +4095,7 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
     }
     /* -------------------- INTERACTIVE -------------------- */
     case "button":
-      return /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx51(
         "button",
         {
           onClick: () => rendererProps?.onClick?.(row, formattedValue),
@@ -4012,8 +4104,8 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
         }
       );
     case "switch":
-      return /* @__PURE__ */ jsxs29("label", { className: "inline-flex items-center cursor-pointer", children: [
-        /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsxs30("label", { className: "inline-flex items-center cursor-pointer", children: [
+        /* @__PURE__ */ jsx51(
           "input",
           {
             type: "checkbox",
@@ -4022,10 +4114,10 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
             className: "sr-only peer"
           }
         ),
-        /* @__PURE__ */ jsx50("div", { className: "relative w-9 h-5 bg-gray-300 peer-checked:bg-blue-600 rounded-full transition-all", children: /* @__PURE__ */ jsx50("div", { className: "absolute top-[2px] left-[2px] w-4 h-4 bg-white rounded-full peer-checked:translate-x-4 transition-all" }) })
+        /* @__PURE__ */ jsx51("div", { className: "relative w-9 h-5 bg-gray-300 peer-checked:bg-blue-600 rounded-full transition-all", children: /* @__PURE__ */ jsx51("div", { className: "absolute top-[2px] left-[2px] w-4 h-4 bg-white rounded-full peer-checked:translate-x-4 transition-all" }) })
       ] });
     case "progress":
-      return /* @__PURE__ */ jsx50("div", { className: "w-full bg-gray-100 rounded-full h-2", children: /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx51("div", { className: "w-full bg-gray-100 rounded-full h-2", children: /* @__PURE__ */ jsx51(
         "div",
         {
           className: "bg-blue-600 h-2 rounded-full transition-all",
@@ -4034,7 +4126,7 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
       ) });
     case "rating": {
       const stars = Math.round(Number(rowValue || formattedValue) || 0);
-      return /* @__PURE__ */ jsx50("div", { className: "flex items-center", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx51("div", { className: "flex items-center", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx51(
         Star2,
         {
           size: 16,
@@ -4045,7 +4137,7 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
       )) });
     }
     case "checkbox":
-      return /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx51(
         "input",
         {
           type: "checkbox",
@@ -4055,7 +4147,7 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
         }
       );
     case "html":
-      return /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx51(
         "span",
         {
           dangerouslySetInnerHTML: { __html: String(rowValue || formattedValue) }
@@ -4065,7 +4157,7 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
     case "custom": {
       const CustomRenderer = customRenderers[rendererProps?.customRendererId] || customRenderers[rendererProps?.rendererId];
       if (CustomRenderer)
-        return /* @__PURE__ */ jsx50(
+        return /* @__PURE__ */ jsx51(
           CustomRenderer,
           {
             value: formattedValue,
@@ -4073,11 +4165,11 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
             ...rendererProps
           }
         );
-      return /* @__PURE__ */ jsx50("span", { children: "Missing custom renderer" });
+      return /* @__PURE__ */ jsx51("span", { children: "Missing custom renderer" });
     }
     /* -------------------- DEFAULT -------------------- */
     default:
-      return /* @__PURE__ */ jsx50("span", { children: formattedValue || "-" });
+      return /* @__PURE__ */ jsx51("span", { children: formattedValue || "-" });
   }
 };
 
@@ -4141,7 +4233,7 @@ var useDynamicColumns = (config, customRenderers = {}, customFormatters = {}) =>
 };
 
 // src/components/ui/data-table.tsx
-import { Fragment as Fragment21, jsx as jsx51, jsxs as jsxs30 } from "react/jsx-runtime";
+import { Fragment as Fragment21, jsx as jsx52, jsxs as jsxs31 } from "react/jsx-runtime";
 function DataTable({
   columns,
   data,
@@ -4168,13 +4260,13 @@ function DataTable({
   enableTotalRecords,
   getRowCount
 }) {
-  const [columnFilters, setColumnFilters] = React11.useState([]);
-  const [columnVisibility, setColumnVisibility] = React11.useState({});
-  const hasLoadedInitialState = React11.useRef(false);
-  const isSavingRef = React11.useRef(false);
-  const isFetchingRef = React11.useRef(false);
-  const [fetchLoading, setFetchLoading] = React11.useState(false);
-  const transformApiToFrontend = React11.useCallback((apiSettings, allColumnIds) => {
+  const [columnFilters, setColumnFilters] = React12.useState([]);
+  const [columnVisibility, setColumnVisibility] = React12.useState({});
+  const hasLoadedInitialState = React12.useRef(false);
+  const isSavingRef = React12.useRef(false);
+  const isFetchingRef = React12.useRef(false);
+  const [fetchLoading, setFetchLoading] = React12.useState(false);
+  const transformApiToFrontend = React12.useCallback((apiSettings, allColumnIds) => {
     if (!apiSettings || !apiSettings.columns || !apiSettings.columns.visible) {
       return {};
     }
@@ -4185,7 +4277,7 @@ function DataTable({
     });
     return result;
   }, []);
-  const transformFrontendToApi = React11.useCallback((visibility) => {
+  const transformFrontendToApi = React12.useCallback((visibility) => {
     const visibleColumns = Object.keys(visibility).filter((colId) => visibility[colId] === true);
     return {
       columns: {
@@ -4193,7 +4285,7 @@ function DataTable({
       }
     };
   }, []);
-  const fetchColumnPreferences = React11.useCallback(async () => {
+  const fetchColumnPreferences = React12.useCallback(async () => {
     if (isFetchingRef.current) {
       return;
     }
@@ -4253,7 +4345,7 @@ function DataTable({
       isFetchingRef.current = false;
     }
   }, [tableId, transformApiToFrontend, manageColumns]);
-  const saveColumnPreferences = React11.useCallback(async (visibility) => {
+  const saveColumnPreferences = React12.useCallback(async (visibility) => {
     if (!tableId || isSavingRef.current || !manageColumns) {
       return;
     }
@@ -4279,7 +4371,7 @@ function DataTable({
       isSavingRef.current = false;
     }
   }, [tableId, transformFrontendToApi, manageColumns]);
-  React11.useEffect(() => {
+  React12.useEffect(() => {
     if (hasLoadedInitialState.current || isFetchingRef.current) {
       return;
     }
@@ -4290,10 +4382,10 @@ function DataTable({
       fetchColumnPreferences();
     }
   }, [tableId, manageColumns]);
-  const [manualSort, setManualSort] = React11.useState(null);
-  const [searchTerm, setSearchTerm] = React11.useState("");
+  const [manualSort, setManualSort] = React12.useState(null);
+  const [searchTerm, setSearchTerm] = React12.useState("");
   const tableData = Array.isArray(data) ? data : [];
-  const filteredData = React11.useMemo(() => {
+  const filteredData = React12.useMemo(() => {
     if (paginationMode === "client" && globalSearch && searchTerm.trim()) {
       const searchLower = searchTerm.toLowerCase().trim();
       return tableData.filter((row) => {
@@ -4316,7 +4408,7 @@ function DataTable({
       id: "__select__",
       renderer: "checkbox",
       size: 40,
-      header: ({ table: table2 }) => /* @__PURE__ */ jsx51(
+      header: ({ table: table2 }) => /* @__PURE__ */ jsx52(
         "input",
         {
           type: "checkbox",
@@ -4334,12 +4426,12 @@ function DataTable({
     });
   }
   const dynamicCols = useDynamicColumns({ columns: finalCols, enableRowSelection });
-  const [rowSelection, setRowSelection] = React11.useState({});
-  const [localPageSize, setLocalPageSize] = React11.useState(pageSize);
-  const [localPageIndex, setLocalPageIndex] = React11.useState(0);
-  const isUpdatingPageSizeRef = React11.useRef(false);
-  const tableRef = React11.useRef(null);
-  React11.useEffect(() => {
+  const [rowSelection, setRowSelection] = React12.useState({});
+  const [localPageSize, setLocalPageSize] = React12.useState(pageSize);
+  const [localPageIndex, setLocalPageIndex] = React12.useState(0);
+  const isUpdatingPageSizeRef = React12.useRef(false);
+  const tableRef = React12.useRef(null);
+  React12.useEffect(() => {
     if (paginationMode === "client") {
       setLocalPageSize(pageSize);
     } else if (paginationMode === "server" && meta?.limit != null) {
@@ -4415,7 +4507,7 @@ function DataTable({
       }
     }
   });
-  React11.useEffect(() => {
+  React12.useEffect(() => {
     tableRef.current = table;
     if (table && !hasLoadedInitialState.current && !isFetchingRef.current && tableId) {
       fetchColumnPreferences();
@@ -4453,7 +4545,7 @@ function DataTable({
       setLocalPageIndex(0);
     }
   };
-  const pageSizeOptions = React11.useMemo(() => {
+  const pageSizeOptions = React12.useMemo(() => {
     if (paginationMode === "client") {
       return [5, 10, 20, 50, 100];
     }
@@ -4464,10 +4556,10 @@ function DataTable({
     }
     return base;
   }, [paginationMode, meta?.limit]);
-  return /* @__PURE__ */ jsxs30("div", { className: "overflow-hidden rounded-md w-full", children: [
-    !loading && /* @__PURE__ */ jsxs30("div", { className: "flex justify-between p-2 bg-gray-50", children: [
-      /* @__PURE__ */ jsxs30("div", { className: "flex items-center gap-4 w-full", children: [
-        enableTotalRecords && /* @__PURE__ */ jsx51(
+  return /* @__PURE__ */ jsxs31("div", { className: "overflow-hidden rounded-md w-full", children: [
+    !loading && /* @__PURE__ */ jsxs31("div", { className: "flex justify-between p-2 bg-gray-50", children: [
+      /* @__PURE__ */ jsxs31("div", { className: "flex items-center gap-4 w-full", children: [
+        enableTotalRecords && /* @__PURE__ */ jsx52(
           Button,
           {
             size: "sm",
@@ -4482,9 +4574,9 @@ function DataTable({
             children: fetchLoading ? "Fetching..." : "Get Count"
           }
         ),
-        globalSearch && /* @__PURE__ */ jsxs30("div", { className: "flex items-center gap-2 w-full max-w-sm", children: [
-          /* @__PURE__ */ jsxs30("div", { className: "relative w-full", children: [
-            /* @__PURE__ */ jsx51(
+        globalSearch && /* @__PURE__ */ jsxs31("div", { className: "flex items-center gap-2 w-full max-w-sm", children: [
+          /* @__PURE__ */ jsxs31("div", { className: "relative w-full", children: [
+            /* @__PURE__ */ jsx52(
               "input",
               {
                 type: "text",
@@ -4506,9 +4598,9 @@ function DataTable({
                 className: "border border-gray-300 rounded-md text-sm px-3 py-2 pl-8 w-full focus:outline-none focus:ring-1 focus:ring-[#12715B]"
               }
             ),
-            /* @__PURE__ */ jsx51(Search, { className: "absolute left-2 top-2.5 text-gray-400", size: 16 })
+            /* @__PURE__ */ jsx52(Search, { className: "absolute left-2 top-2.5 text-gray-400", size: 16 })
           ] }),
-          paginationMode === "server" && /* @__PURE__ */ jsx51(
+          paginationMode === "server" && /* @__PURE__ */ jsx52(
             Button,
             {
               size: "sm",
@@ -4519,8 +4611,8 @@ function DataTable({
           )
         ] })
       ] }),
-      manageColumns && /* @__PURE__ */ jsxs30(Popover, { children: [
-        /* @__PURE__ */ jsx51(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx51(
+      manageColumns && /* @__PURE__ */ jsxs31(Popover, { children: [
+        /* @__PURE__ */ jsx52(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx52(
           Button,
           {
             variant: "outline",
@@ -4529,11 +4621,11 @@ function DataTable({
             children: "Manage Columns"
           }
         ) }),
-        /* @__PURE__ */ jsxs30(PopoverContent, { align: "end", className: "w-48 p-3", children: [
-          /* @__PURE__ */ jsx51("div", { className: "text-sm font-medium mb-2", children: "Show / Hide Columns" }),
-          /* @__PURE__ */ jsxs30("div", { className: "max-h-56 overflow-y-auto pr-1 space-y-2", children: [
-            /* @__PURE__ */ jsxs30("label", { className: "flex items-center gap-2 text-sm font-semibold border-b pb-2 mb-2", children: [
-              /* @__PURE__ */ jsx51(
+        /* @__PURE__ */ jsxs31(PopoverContent, { align: "end", className: "w-48 p-3", children: [
+          /* @__PURE__ */ jsx52("div", { className: "text-sm font-medium mb-2", children: "Show / Hide Columns" }),
+          /* @__PURE__ */ jsxs31("div", { className: "max-h-56 overflow-y-auto pr-1 space-y-2", children: [
+            /* @__PURE__ */ jsxs31("label", { className: "flex items-center gap-2 text-sm font-semibold border-b pb-2 mb-2", children: [
+              /* @__PURE__ */ jsx52(
                 "input",
                 {
                   type: "checkbox",
@@ -4554,8 +4646,8 @@ function DataTable({
             ] }),
             table.getAllLeafColumns().map((column) => {
               const header = column.columnDef.header;
-              return /* @__PURE__ */ jsxs30("label", { className: "flex items-center gap-2 text-sm", children: [
-                /* @__PURE__ */ jsx51(
+              return /* @__PURE__ */ jsxs31("label", { className: "flex items-center gap-2 text-sm", children: [
+                /* @__PURE__ */ jsx52(
                   "input",
                   {
                     type: "checkbox",
@@ -4570,12 +4662,12 @@ function DataTable({
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs30(Table, { className: "table-fixed", children: [
-      /* @__PURE__ */ jsx51(TableHeader, { children: table.getHeaderGroups().map((hg) => /* @__PURE__ */ jsx51(TableRow, { children: hg.headers.map((header, index) => {
+    /* @__PURE__ */ jsxs31(Table, { className: "table-fixed", children: [
+      /* @__PURE__ */ jsx52(TableHeader, { children: table.getHeaderGroups().map((hg) => /* @__PURE__ */ jsx52(TableRow, { children: hg.headers.map((header, index) => {
         const canSort = header.column.getCanSort();
         const canFilter = header.column.getCanFilter();
         const sortDir = manualSort?.key === header.column.id ? manualSort.dir : null;
-        return /* @__PURE__ */ jsx51(
+        return /* @__PURE__ */ jsx52(
           TableHead,
           {
             className: "relative select-none",
@@ -4584,8 +4676,8 @@ function DataTable({
               minWidth: header.column.columnDef.minSize,
               maxWidth: header.column.columnDef.maxSize
             },
-            children: /* @__PURE__ */ jsxs30("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ jsxs30(
+            children: /* @__PURE__ */ jsxs31("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsxs31(
                 "span",
                 {
                   className: `flex items-center gap-1 ${canSort ? "cursor-pointer" : ""}`,
@@ -4597,32 +4689,32 @@ function DataTable({
                   },
                   children: [
                     flexRender(header.column.columnDef.header, header.getContext()),
-                    canSort && /* @__PURE__ */ jsxs30(Fragment21, { children: [
-                      sortDir === "asc" && /* @__PURE__ */ jsx51(ArrowUp, { size: 14, className: "text-gray-500" }),
-                      sortDir === "desc" && /* @__PURE__ */ jsx51(ArrowDown, { size: 14, className: "text-gray-500" }),
-                      !sortDir && /* @__PURE__ */ jsx51(ArrowUpDown, { size: 14, className: "text-gray-400" })
+                    canSort && /* @__PURE__ */ jsxs31(Fragment21, { children: [
+                      sortDir === "asc" && /* @__PURE__ */ jsx52(ArrowUp, { size: 14, className: "text-gray-500" }),
+                      sortDir === "desc" && /* @__PURE__ */ jsx52(ArrowDown, { size: 14, className: "text-gray-500" }),
+                      !sortDir && /* @__PURE__ */ jsx52(ArrowUpDown, { size: 14, className: "text-gray-400" })
                     ] })
                   ]
                 }
               ),
-              canFilter && /* @__PURE__ */ jsxs30(Popover, { children: [
-                /* @__PURE__ */ jsx51(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx51(
+              canFilter && /* @__PURE__ */ jsxs31(Popover, { children: [
+                /* @__PURE__ */ jsx52(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx52(
                   "span",
                   {
                     role: "presentation",
                     className: "pl-5 cursor-pointer",
                     onClick: (e) => e.stopPropagation(),
-                    children: /* @__PURE__ */ jsx51(FontAwesomeIcon3, { icon: faEllipsisH, className: "w-5 h-5 text-gray-500" })
+                    children: /* @__PURE__ */ jsx52(FontAwesomeIcon3, { icon: faEllipsisH, className: "w-5 h-5 text-gray-500" })
                   }
                 ) }),
-                /* @__PURE__ */ jsx51(
+                /* @__PURE__ */ jsx52(
                   PopoverContent,
                   {
                     align: "center",
                     sideOffset: 14,
                     className: "w-50 p-3 z-[200] border-gray-300",
                     avoidCollisions: true,
-                    children: /* @__PURE__ */ jsxs30(
+                    children: /* @__PURE__ */ jsxs31(
                       "form",
                       {
                         onSubmit: (e) => {
@@ -4635,8 +4727,8 @@ function DataTable({
                         },
                         className: "space-y-2",
                         children: [
-                          /* @__PURE__ */ jsx51("label", { htmlFor: "filter", className: "text-xs text-gray-500 font-normal", children: "Filter by value:" }),
-                          /* @__PURE__ */ jsx51(
+                          /* @__PURE__ */ jsx52("label", { htmlFor: "filter", className: "text-xs text-gray-500 font-normal", children: "Filter by value:" }),
+                          /* @__PURE__ */ jsx52(
                             "input",
                             {
                               name: "filter",
@@ -4646,7 +4738,7 @@ function DataTable({
                               autoComplete: "off"
                             }
                           ),
-                          /* @__PURE__ */ jsx51("div", { className: "justify-end flex", children: /* @__PURE__ */ jsx51(
+                          /* @__PURE__ */ jsx52("div", { className: "justify-end flex", children: /* @__PURE__ */ jsx52(
                             Button,
                             {
                               type: "submit",
@@ -4665,9 +4757,9 @@ function DataTable({
           `header-${header.id}-${index}`
         );
       }) }, `header-group-${hg.id}`)) }),
-      /* @__PURE__ */ jsx51(TableBody, { children: loading ? /* @__PURE__ */ jsx51(Fragment21, { children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx51(TableRow, { children: table.getHeaderGroups()[0].headers.map((header, j) => {
+      /* @__PURE__ */ jsx52(TableBody, { children: loading ? /* @__PURE__ */ jsx52(Fragment21, { children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx52(TableRow, { children: table.getHeaderGroups()[0].headers.map((header, j) => {
         const column = header.column;
-        return /* @__PURE__ */ jsx51(
+        return /* @__PURE__ */ jsx52(
           TableCell,
           {
             className: "p-3",
@@ -4676,15 +4768,15 @@ function DataTable({
               minWidth: column.columnDef.minSize,
               maxWidth: column.columnDef.maxSize
             },
-            children: /* @__PURE__ */ jsx51("span", { className: "h-4 bg-gray-200 rounded w-full block animate-pulse" })
+            children: /* @__PURE__ */ jsx52("span", { className: "h-4 bg-gray-200 rounded w-full block animate-pulse" })
           },
           j
         );
-      }) }, i)) }) : table.getRowModel().rows.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx51(TableRow, { children: row.getVisibleCells().map((cell, cellIndex, arr) => {
+      }) }, i)) }) : table.getRowModel().rows.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx52(TableRow, { children: row.getVisibleCells().map((cell, cellIndex, arr) => {
         const meta2 = cell.column.columnDef.meta || {};
         const isClickable = meta2?.isClickable;
         const isLastCell = cellIndex === arr.length - 1;
-        return /* @__PURE__ */ jsxs30(
+        return /* @__PURE__ */ jsxs31(
           TableCell,
           {
             className: `break-words whitespace-normal align-top ${isClickable ? "cursor-pointer hover:bg-gray-100 underline text-blue-500" : ""} relative py-2 ${meta2?.cellClass ?? ""}`,
@@ -4701,9 +4793,9 @@ function DataTable({
             },
             children: [
               flexRender(cell.column.columnDef.cell, cell.getContext()),
-              isLastCell && rowActions && rowActions.length > 0 && /* @__PURE__ */ jsx51("div", { className: "absolute p-1 px-2 inset-y-0 right-0 flex items-center transition-opacity duration-200", children: rowActions.map((action) => {
+              isLastCell && rowActions && rowActions.length > 0 && /* @__PURE__ */ jsx52("div", { className: "absolute p-1 px-2 inset-y-0 right-0 flex items-center transition-opacity duration-200", children: rowActions.map((action) => {
                 const isDelete = action.id === "delete" || action.icon === "delete";
-                return /* @__PURE__ */ jsx51(
+                return /* @__PURE__ */ jsx52(
                   "button",
                   {
                     className: `ml-2 px-2 py-1 text-[12px] rounded cursor-pointer ${isDelete ? "bg-red-800 text-white hover:bg-neutral-600" : "bg-gray-300 hover:bg-gray-400"}`,
@@ -4725,23 +4817,23 @@ function DataTable({
           },
           `cell-${cell.id}-${cellIndex}`
         );
-      }) }, row.id)) : /* @__PURE__ */ jsx51(TableRow, { children: /* @__PURE__ */ jsx51(TableCell, { colSpan: dynamicCols.length, className: "h-24 text-center", children: /* @__PURE__ */ jsx51("span", { className: "flex items-center justify-center py-10 w-full min-w-full text-gray-600 bg-gray-100", children: "No results." }) }) }) })
+      }) }, row.id)) : /* @__PURE__ */ jsx52(TableRow, { children: /* @__PURE__ */ jsx52(TableCell, { colSpan: dynamicCols.length, className: "h-24 text-center", children: /* @__PURE__ */ jsx52("span", { className: "flex items-center justify-center py-10 w-full min-w-full text-gray-600 bg-gray-100", children: "No results." }) }) }) })
     ] }),
-    pagination && /* @__PURE__ */ jsxs30("div", { className: "flex items-center justify-between py-3 text-sm w-full", children: [
-      !loading && /* @__PURE__ */ jsx51("div", { className: "flex gap-2 items-center", children: /* @__PURE__ */ jsx51(
+    pagination && /* @__PURE__ */ jsxs31("div", { className: "flex items-center justify-between py-3 text-sm w-full", children: [
+      !loading && /* @__PURE__ */ jsx52("div", { className: "flex gap-2 items-center", children: /* @__PURE__ */ jsx52(
         "select",
         {
           value: paginationMode === "server" && meta?.limit != null ? meta.limit : localPageSize,
           onChange: handlePageSizeChange,
           className: "ml-2 border rounded py-1 text-sm cursor-pointer border-blue-600",
-          children: pageSizeOptions.map((size) => /* @__PURE__ */ jsxs30("option", { value: size, children: [
+          children: pageSizeOptions.map((size) => /* @__PURE__ */ jsxs31("option", { value: size, children: [
             size,
             " / page"
           ] }, size))
         }
       ) }),
-      /* @__PURE__ */ jsxs30("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx51(
+      /* @__PURE__ */ jsxs31("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx52(
           "button",
           {
             onClick: () => table.previousPage(),
@@ -4750,7 +4842,7 @@ function DataTable({
             children: "Prev"
           }
         ),
-        /* @__PURE__ */ jsx51(
+        /* @__PURE__ */ jsx52(
           "button",
           {
             onClick: () => table.nextPage(),
@@ -4765,7 +4857,7 @@ function DataTable({
 }
 
 // src/components/DataDisplay/Table/Table.tsx
-import { jsx as jsx52 } from "react/jsx-runtime";
+import { jsx as jsx53 } from "react/jsx-runtime";
 var Table2 = ({
   columns,
   data,
@@ -4790,7 +4882,7 @@ var Table2 = ({
   const rawColumns = Array.isArray(columns) ? columns : [];
   const rawData = Array.isArray(data) ? data : [];
   const isControlled = typeof page === "number";
-  return /* @__PURE__ */ jsx52("div", { className: `${className || ""} space-y-3`, style, children: /* @__PURE__ */ jsx52(
+  return /* @__PURE__ */ jsx53("div", { className: `${className || ""} space-y-3`, style, children: /* @__PURE__ */ jsx53(
     DataTable,
     {
       ...props,
@@ -4826,9 +4918,9 @@ import {
   ChevronRightIcon as ChevronRightIcon3,
   MoreHorizontalIcon
 } from "lucide-react";
-import { jsx as jsx53, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx54, jsxs as jsxs32 } from "react/jsx-runtime";
 function Pagination({ className, ...props }) {
-  return /* @__PURE__ */ jsx53(
+  return /* @__PURE__ */ jsx54(
     "nav",
     {
       role: "navigation",
@@ -4843,7 +4935,7 @@ function PaginationContent({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx53(
+  return /* @__PURE__ */ jsx54(
     "ul",
     {
       "data-slot": "pagination-content",
@@ -4853,7 +4945,7 @@ function PaginationContent({
   );
 }
 function PaginationItem({ ...props }) {
-  return /* @__PURE__ */ jsx53("li", { "data-slot": "pagination-item", ...props });
+  return /* @__PURE__ */ jsx54("li", { "data-slot": "pagination-item", ...props });
 }
 function PaginationLink({
   className,
@@ -4861,7 +4953,7 @@ function PaginationLink({
   size = "icon",
   ...props
 }) {
-  return /* @__PURE__ */ jsx53(
+  return /* @__PURE__ */ jsx54(
     "a",
     {
       "aria-current": isActive ? "page" : void 0,
@@ -4882,7 +4974,7 @@ function PaginationPrevious({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs31(
+  return /* @__PURE__ */ jsxs32(
     PaginationLink,
     {
       "aria-label": "Go to previous page",
@@ -4890,8 +4982,8 @@ function PaginationPrevious({
       className: cn("gap-1 px-2.5 sm:pl-2.5", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx53(ChevronLeftIcon2, {}),
-        /* @__PURE__ */ jsx53("span", { className: "hidden sm:block", children: "Previous" })
+        /* @__PURE__ */ jsx54(ChevronLeftIcon2, {}),
+        /* @__PURE__ */ jsx54("span", { className: "hidden sm:block", children: "Previous" })
       ]
     }
   );
@@ -4900,7 +4992,7 @@ function PaginationNext({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs31(
+  return /* @__PURE__ */ jsxs32(
     PaginationLink,
     {
       "aria-label": "Go to next page",
@@ -4908,8 +5000,8 @@ function PaginationNext({
       className: cn("gap-1 px-2.5 sm:pr-2.5", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx53("span", { className: "hidden sm:block", children: "Next" }),
-        /* @__PURE__ */ jsx53(ChevronRightIcon3, {})
+        /* @__PURE__ */ jsx54("span", { className: "hidden sm:block", children: "Next" }),
+        /* @__PURE__ */ jsx54(ChevronRightIcon3, {})
       ]
     }
   );
@@ -4918,7 +5010,7 @@ function PaginationEllipsis({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs31(
+  return /* @__PURE__ */ jsxs32(
     "span",
     {
       "aria-hidden": true,
@@ -4926,15 +5018,15 @@ function PaginationEllipsis({
       className: cn("flex size-9 items-center justify-center", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx53(MoreHorizontalIcon, { className: "size-4" }),
-        /* @__PURE__ */ jsx53("span", { className: "sr-only", children: "More pages" })
+        /* @__PURE__ */ jsx54(MoreHorizontalIcon, { className: "size-4" }),
+        /* @__PURE__ */ jsx54("span", { className: "sr-only", children: "More pages" })
       ]
     }
   );
 }
 
 // src/components/DataDisplay/Pagination/Pagination.tsx
-import { jsx as jsx54, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx55, jsxs as jsxs33 } from "react/jsx-runtime";
 var CustomPagination = ({
   totalPages,
   currentPage,
@@ -4980,10 +5072,10 @@ var CustomPagination = ({
     }
   };
   const pageNumbers = getPageNumbers();
-  return /* @__PURE__ */ jsxs32("div", { className: "flex flex-row gap-1 w-full items-center justify-between", children: [
-    /* @__PURE__ */ jsxs32("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx54("p", { className: "text-sm text-muted-foreground whitespace-nowrap", children: "Items per page:" }),
-      /* @__PURE__ */ jsxs32(
+  return /* @__PURE__ */ jsxs33("div", { className: "flex flex-row gap-1 w-full items-center justify-between", children: [
+    /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx55("p", { className: "text-sm text-muted-foreground whitespace-nowrap", children: "Items per page:" }),
+      /* @__PURE__ */ jsxs33(
         Select,
         {
           defaultValue: String(perPage),
@@ -4991,26 +5083,26 @@ var CustomPagination = ({
             onPageChange({ page: 1, itemsPerPage: Number(value) });
           },
           children: [
-            /* @__PURE__ */ jsx54(SelectTrigger, { className: "w-[100px]", children: /* @__PURE__ */ jsx54(SelectValue, { placeholder: "Select" }) }),
-            /* @__PURE__ */ jsxs32(SelectContent, { children: [
-              /* @__PURE__ */ jsx54(SelectItem, { value: "5", children: "5" }),
-              /* @__PURE__ */ jsx54(SelectItem, { value: "10", children: "10" }),
-              /* @__PURE__ */ jsx54(SelectItem, { value: "20", children: "20" }),
-              /* @__PURE__ */ jsx54(SelectItem, { value: "50", children: "50" })
+            /* @__PURE__ */ jsx55(SelectTrigger, { className: "w-[100px]", children: /* @__PURE__ */ jsx55(SelectValue, { placeholder: "Select" }) }),
+            /* @__PURE__ */ jsxs33(SelectContent, { children: [
+              /* @__PURE__ */ jsx55(SelectItem, { value: "5", children: "5" }),
+              /* @__PURE__ */ jsx55(SelectItem, { value: "10", children: "10" }),
+              /* @__PURE__ */ jsx55(SelectItem, { value: "20", children: "20" }),
+              /* @__PURE__ */ jsx55(SelectItem, { value: "50", children: "50" })
             ] })
           ]
         }
       )
     ] }),
-    /* @__PURE__ */ jsx54(Pagination, { className: "justify-end", children: /* @__PURE__ */ jsxs32(PaginationContent, { children: [
-      /* @__PURE__ */ jsx54(PaginationItem, { children: /* @__PURE__ */ jsx54(
+    /* @__PURE__ */ jsx55(Pagination, { className: "justify-end", children: /* @__PURE__ */ jsxs33(PaginationContent, { children: [
+      /* @__PURE__ */ jsx55(PaginationItem, { children: /* @__PURE__ */ jsx55(
         PaginationPrevious,
         {
           onClick: () => handlePageChange(currentPage - 1),
           className: currentPage === 1 ? "pointer-events-none opacity-50" : "cursor-pointer"
         }
       ) }),
-      pageNumbers.map((pageNumber, index) => /* @__PURE__ */ jsx54(PaginationItem, { children: pageNumber === "..." ? /* @__PURE__ */ jsx54(PaginationEllipsis, {}) : /* @__PURE__ */ jsx54(
+      pageNumbers.map((pageNumber, index) => /* @__PURE__ */ jsx55(PaginationItem, { children: pageNumber === "..." ? /* @__PURE__ */ jsx55(PaginationEllipsis, {}) : /* @__PURE__ */ jsx55(
         PaginationLink,
         {
           onClick: () => handlePageChange(pageNumber),
@@ -5019,7 +5111,7 @@ var CustomPagination = ({
           children: pageNumber
         }
       ) }, index)),
-      /* @__PURE__ */ jsx54(PaginationItem, { children: /* @__PURE__ */ jsx54(
+      /* @__PURE__ */ jsx55(PaginationItem, { children: /* @__PURE__ */ jsx55(
         PaginationNext,
         {
           onClick: () => handlePageChange(currentPage + 1),
@@ -5038,17 +5130,17 @@ import { LoaderCircle, Info } from "lucide-react";
 // src/components/ui/accordion.tsx
 import * as AccordionPrimitive from "@radix-ui/react-accordion";
 import { ChevronDownIcon as ChevronDownIcon3 } from "lucide-react";
-import { jsx as jsx55, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx56, jsxs as jsxs34 } from "react/jsx-runtime";
 function Accordion2({
   ...props
 }) {
-  return /* @__PURE__ */ jsx55(AccordionPrimitive.Root, { "data-slot": "accordion", ...props });
+  return /* @__PURE__ */ jsx56(AccordionPrimitive.Root, { "data-slot": "accordion", ...props });
 }
 function AccordionItem({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx55(
+  return /* @__PURE__ */ jsx56(
     AccordionPrimitive.Item,
     {
       "data-slot": "accordion-item",
@@ -5062,7 +5154,7 @@ function AccordionTrigger({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx55(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs33(
+  return /* @__PURE__ */ jsx56(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs34(
     AccordionPrimitive.Trigger,
     {
       "data-slot": "accordion-trigger",
@@ -5073,7 +5165,7 @@ function AccordionTrigger({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx55(ChevronDownIcon3, { className: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" })
+        /* @__PURE__ */ jsx56(ChevronDownIcon3, { className: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" })
       ]
     }
   ) });
@@ -5083,21 +5175,21 @@ function AccordionContent({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx55(
+  return /* @__PURE__ */ jsx56(
     AccordionPrimitive.Content,
     {
       "data-slot": "accordion-content",
       className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
       ...props,
-      children: /* @__PURE__ */ jsx55("div", { className: cn("pt-0 pb-4", className), children })
+      children: /* @__PURE__ */ jsx56("div", { className: cn("pt-0 pb-4", className), children })
     }
   );
 }
 
 // src/components/ui/card.tsx
-import { jsx as jsx56 } from "react/jsx-runtime";
+import { jsx as jsx57 } from "react/jsx-runtime";
 function Card({ className, ...props }) {
-  return /* @__PURE__ */ jsx56(
+  return /* @__PURE__ */ jsx57(
     "div",
     {
       "data-slot": "card",
@@ -5110,7 +5202,7 @@ function Card({ className, ...props }) {
   );
 }
 function CardHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx56(
+  return /* @__PURE__ */ jsx57(
     "div",
     {
       "data-slot": "card-header",
@@ -5123,7 +5215,7 @@ function CardHeader({ className, ...props }) {
   );
 }
 function CardTitle({ className, ...props }) {
-  return /* @__PURE__ */ jsx56(
+  return /* @__PURE__ */ jsx57(
     "div",
     {
       "data-slot": "card-title",
@@ -5133,7 +5225,7 @@ function CardTitle({ className, ...props }) {
   );
 }
 function CardContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx56(
+  return /* @__PURE__ */ jsx57(
     "div",
     {
       "data-slot": "card-content",
@@ -5144,7 +5236,7 @@ function CardContent({ className, ...props }) {
 }
 
 // src/components/DataDisplay/HistoryTimeline/HistoryTimeline.tsx
-import { jsx as jsx57, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs35 } from "react/jsx-runtime";
 function getValue(item, key) {
   if (!key) return void 0;
   return item[key];
@@ -5165,26 +5257,26 @@ var HistoryTimeline = ({
     return [];
   }, [props.data]);
   if (loading) {
-    return /* @__PURE__ */ jsx57(Card, { className: cn("w-full", className), children: /* @__PURE__ */ jsxs34(CardContent, { className: "flex items-center justify-center px-4 py-8", children: [
-      /* @__PURE__ */ jsx57(LoaderCircle, { className: "h-5 w-5 animate-spin text-muted-foreground" }),
-      /* @__PURE__ */ jsx57("span", { className: "ml-2 text-sm text-muted-foreground", children: "Loading history\u2026" })
+    return /* @__PURE__ */ jsx58(Card, { className: cn("w-full", className), children: /* @__PURE__ */ jsxs35(CardContent, { className: "flex items-center justify-center px-4 py-8", children: [
+      /* @__PURE__ */ jsx58(LoaderCircle, { className: "h-5 w-5 animate-spin text-muted-foreground" }),
+      /* @__PURE__ */ jsx58("span", { className: "ml-2 text-sm text-muted-foreground", children: "Loading history\u2026" })
     ] }) });
   }
   if (data.length === 0) {
-    return /* @__PURE__ */ jsx57(Card, { className: cn("w-full", className), children: /* @__PURE__ */ jsx57(CardContent, { className: "px-4 py-8 text-center text-muted-foreground", children: "No history available." }) });
+    return /* @__PURE__ */ jsx58(Card, { className: cn("w-full", className), children: /* @__PURE__ */ jsx58(CardContent, { className: "px-4 py-8 text-center text-muted-foreground", children: "No history available." }) });
   }
-  return /* @__PURE__ */ jsx57(Card, { className: cn("w-full", className), children: /* @__PURE__ */ jsx57(Accordion2, { type: "single", collapsible: true, defaultValue: "history", children: /* @__PURE__ */ jsxs34(AccordionItem, { value: "history", className: "border-0", children: [
-    /* @__PURE__ */ jsx57(CardHeader, { className: "flex flex-row items-center justify-between gap-2 border-b px-4 py-3", children: /* @__PURE__ */ jsx57(
+  return /* @__PURE__ */ jsx58(Card, { className: cn("w-full", className), children: /* @__PURE__ */ jsx58(Accordion2, { type: "single", collapsible: true, defaultValue: "history", children: /* @__PURE__ */ jsxs35(AccordionItem, { value: "history", className: "border-0", children: [
+    /* @__PURE__ */ jsx58(CardHeader, { className: "flex flex-row items-center justify-between gap-2 border-b px-4 py-3", children: /* @__PURE__ */ jsx58(
       AccordionTrigger,
       {
         className: cn(
           "flex flex-1 items-center justify-between gap-2 p-0 text-left",
           "hover:no-underline"
         ),
-        children: /* @__PURE__ */ jsx57(CardTitle, { className: "text-base font-semibold", children: title })
+        children: /* @__PURE__ */ jsx58(CardTitle, { className: "text-base font-semibold", children: title })
       }
     ) }),
-    /* @__PURE__ */ jsx57(AccordionContent, { asChild: true, children: /* @__PURE__ */ jsx57(CardContent, { className: "px-4 py-3", children: /* @__PURE__ */ jsx57("ol", { className: "relative ml-4 border-l-2 border-[#939393] space-y-4", children: data.map((item, index) => {
+    /* @__PURE__ */ jsx58(AccordionContent, { asChild: true, children: /* @__PURE__ */ jsx58(CardContent, { className: "px-4 py-3", children: /* @__PURE__ */ jsx58("ol", { className: "relative ml-4 border-l-2 border-[#939393] space-y-4", children: data.map((item, index) => {
       const id = item.id ?? index;
       const rawTitle = getValue(item, titleKey);
       const rawDescription = getValue(item, descriptionKey);
@@ -5192,8 +5284,8 @@ var HistoryTimeline = ({
       const titleText = String(rawTitle ?? "");
       const descriptionText = rawDescription != null ? String(rawDescription) : "";
       const createdAtDate = rawCreatedAt != null ? new Date(rawCreatedAt) : null;
-      return /* @__PURE__ */ jsxs34("li", { className: "relative pl-4", children: [
-        /* @__PURE__ */ jsx57("span", { className: "absolute left-[-9px] top-2 flex h-4 w-4 items-center justify-center rounded-full bg-primary text-primary-foreground", children: /* @__PURE__ */ jsx57("div", { className: "bg-[#06A59A] text-white rounded-md p-[5px]", children: /* @__PURE__ */ jsx57(
+      return /* @__PURE__ */ jsxs35("li", { className: "relative pl-4", children: [
+        /* @__PURE__ */ jsx58("span", { className: "absolute left-[-9px] top-2 flex h-4 w-4 items-center justify-center rounded-full bg-primary text-primary-foreground", children: /* @__PURE__ */ jsx58("div", { className: "bg-[#06A59A] text-white rounded-md p-[5px]", children: /* @__PURE__ */ jsx58(
           Info,
           {
             className: cn(
@@ -5201,30 +5293,30 @@ var HistoryTimeline = ({
             )
           }
         ) }) }),
-        /* @__PURE__ */ jsx57(
+        /* @__PURE__ */ jsx58(
           Accordion2,
           {
             type: "single",
             collapsible: true,
             className: "w-full",
-            children: /* @__PURE__ */ jsxs34(AccordionItem, { value: `item-${item.id}`, className: "border-0", children: [
-              /* @__PURE__ */ jsx57(
+            children: /* @__PURE__ */ jsxs35(AccordionItem, { value: `item-${item.id}`, className: "border-0", children: [
+              /* @__PURE__ */ jsx58(
                 AccordionTrigger,
                 {
                   className: cn(
                     "flex items-center justify-between gap-2 rounded-md px-2 py-1 text-left",
                     "hover:bg-muted/60 hover:no-underline"
                   ),
-                  children: /* @__PURE__ */ jsxs34("div", { className: "flex flex-col gap-1", children: [
-                    /* @__PURE__ */ jsx57("span", { className: "text-sm font-medium leading-none", children: titleText }),
-                    /* @__PURE__ */ jsx57("span", { className: "text-[11px] text-muted-foreground", children: new Intl.DateTimeFormat("default", {
+                  children: /* @__PURE__ */ jsxs35("div", { className: "flex flex-col gap-1", children: [
+                    /* @__PURE__ */ jsx58("span", { className: "text-sm font-medium leading-none", children: titleText }),
+                    /* @__PURE__ */ jsx58("span", { className: "text-[11px] text-muted-foreground", children: new Intl.DateTimeFormat("default", {
                       dateStyle: "medium",
                       timeStyle: "short"
                     }).format(createdAtDate ?? /* @__PURE__ */ new Date()) })
                   ] })
                 }
               ),
-              /* @__PURE__ */ jsx57(AccordionContent, { className: "pt-1", children: descriptionText && /* @__PURE__ */ jsx57("p", { className: "rounded-md bg-muted px-2 py-2 text-xs text-muted-foreground", children: descriptionText }) })
+              /* @__PURE__ */ jsx58(AccordionContent, { className: "pt-1", children: descriptionText && /* @__PURE__ */ jsx58("p", { className: "rounded-md bg-muted px-2 py-2 text-xs text-muted-foreground", children: descriptionText }) })
             ] })
           }
         )
@@ -5235,7 +5327,7 @@ var HistoryTimeline = ({
 var HistoryTimeline_default = HistoryTimeline;
 
 // src/components/Navigation/Tabs/Tabs.tsx
-import { useCallback as useCallback5, useMemo as useMemo9, useState as useState12 } from "react";
+import { useCallback as useCallback5, useMemo as useMemo9, useState as useState13 } from "react";
 import { ChevronDown as ChevronDown2, Menu } from "lucide-react";
 import Link3 from "next/link";
 import { usePathname, useRouter } from "next/navigation";
@@ -5243,22 +5335,22 @@ import { usePathname, useRouter } from "next/navigation";
 // src/components/ui/dialog.tsx
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import { XIcon as XIcon2 } from "lucide-react";
-import { jsx as jsx58, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx59, jsxs as jsxs36 } from "react/jsx-runtime";
 function Dialog({
   ...props
 }) {
-  return /* @__PURE__ */ jsx58(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
+  return /* @__PURE__ */ jsx59(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
 }
 function DialogPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx58(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
+  return /* @__PURE__ */ jsx59(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
 }
 function DialogOverlay({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx58(
+  return /* @__PURE__ */ jsx59(
     DialogPrimitive.Overlay,
     {
       "data-slot": "dialog-overlay",
@@ -5276,9 +5368,9 @@ function DialogContent({
   showCloseButton = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs35(DialogPortal, { "data-slot": "dialog-portal", children: [
-    /* @__PURE__ */ jsx58(DialogOverlay, {}),
-    /* @__PURE__ */ jsxs35(
+  return /* @__PURE__ */ jsxs36(DialogPortal, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ jsx59(DialogOverlay, {}),
+    /* @__PURE__ */ jsxs36(
       DialogPrimitive.Content,
       {
         "data-slot": "dialog-content",
@@ -5289,14 +5381,14 @@ function DialogContent({
         ...props,
         children: [
           children,
-          showCloseButton && /* @__PURE__ */ jsxs35(
+          showCloseButton && /* @__PURE__ */ jsxs36(
             DialogPrimitive.Close,
             {
               "data-slot": "dialog-close",
               className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
               children: [
-                /* @__PURE__ */ jsx58(XIcon2, {}),
-                /* @__PURE__ */ jsx58("span", { className: "sr-only", children: "Close" })
+                /* @__PURE__ */ jsx59(XIcon2, {}),
+                /* @__PURE__ */ jsx59("span", { className: "sr-only", children: "Close" })
               ]
             }
           )
@@ -5306,7 +5398,7 @@ function DialogContent({
   ] });
 }
 function DialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx58(
+  return /* @__PURE__ */ jsx59(
     "div",
     {
       "data-slot": "dialog-header",
@@ -5316,7 +5408,7 @@ function DialogHeader({ className, ...props }) {
   );
 }
 function DialogFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx58(
+  return /* @__PURE__ */ jsx59(
     "div",
     {
       "data-slot": "dialog-footer",
@@ -5332,7 +5424,7 @@ function DialogTitle({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx58(
+  return /* @__PURE__ */ jsx59(
     DialogPrimitive.Title,
     {
       "data-slot": "dialog-title",
@@ -5345,7 +5437,7 @@ function DialogDescription({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx58(
+  return /* @__PURE__ */ jsx59(
     DialogPrimitive.Description,
     {
       "data-slot": "dialog-description",
@@ -5422,9 +5514,9 @@ function showConfirmToast({
 }
 
 // src/components/Navigation/Tabs/Tabs.tsx
-import { Fragment as Fragment22, jsx as jsx59, jsxs as jsxs36 } from "react/jsx-runtime";
+import { Fragment as Fragment22, jsx as jsx60, jsxs as jsxs37 } from "react/jsx-runtime";
 var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuilder = false, source, parentKey, menuNameKey, menuUrlKey, loading, bgActiveColor, textActiveColor }) => {
-  const [openIndex, setOpenIndex] = useState12(null);
+  const [openIndex, setOpenIndex] = useState13(null);
   const currentPathname = usePathname();
   function groupMenus(menus = []) {
     const menuMap = /* @__PURE__ */ new Map();
@@ -5488,8 +5580,8 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
     return tab.children.some((child) => isActive(child.url));
   };
   const router = useRouter();
-  const [showExitDialog, setShowExitDialog] = useState12(false);
-  const [pendingUrl, setPendingUrl] = useState12(null);
+  const [showExitDialog, setShowExitDialog] = useState13(false);
+  const [pendingUrl, setPendingUrl] = useState13(null);
   const handleBuilderExit = useCallback5(
     (e, url) => {
       if (isBuilder) {
@@ -5521,13 +5613,13 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
       border: active && textActiveColor ? `1px solid ${textActiveColor}` : void 0
     };
     if (Array.isArray(tab.children) && tab.children.length > 0 && tab.isDropDown) {
-      return /* @__PURE__ */ jsxs36(
+      return /* @__PURE__ */ jsxs37(
         DropdownMenu,
         {
           open: openIndex === index,
           onOpenChange: (open) => setOpenIndex(open ? index : null),
           children: [
-            /* @__PURE__ */ jsxs36(
+            /* @__PURE__ */ jsxs37(
               DropdownMenuTrigger,
               {
                 className: `${finalClasses} inline-flex items-center gap-1`,
@@ -5541,11 +5633,11 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
                 style: finalStyle,
                 children: [
                   tab.header,
-                  /* @__PURE__ */ jsx59(ChevronDown2, { className: "h-4 w-4 opacity-80" })
+                  /* @__PURE__ */ jsx60(ChevronDown2, { className: "h-4 w-4 opacity-80" })
                 ]
               }
             ),
-            /* @__PURE__ */ jsx59(
+            /* @__PURE__ */ jsx60(
               DropdownMenuContent,
               {
                 align: "start",
@@ -5558,12 +5650,12 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
                 onMouseLeave: () => {
                   timeout = setTimeout(() => setOpenIndex(null), 150);
                 },
-                children: tab.children.map((item, index2) => /* @__PURE__ */ jsx59(
+                children: tab.children.map((item, index2) => /* @__PURE__ */ jsx60(
                   DropdownMenuItem,
                   {
                     asChild: true,
                     className: "cursor-pointer rounded-sm px-3 py-2 text-gray-800 hover:bg-gray-100 focus:bg-gray-100",
-                    children: /* @__PURE__ */ jsx59(
+                    children: /* @__PURE__ */ jsx60(
                       Link3,
                       {
                         href: item.url || "#",
@@ -5582,7 +5674,7 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
         index
       );
     }
-    return tab.url ? /* @__PURE__ */ jsx59(
+    return tab.url ? /* @__PURE__ */ jsx60(
       Link3,
       {
         href: tab.url,
@@ -5593,14 +5685,14 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
         children: tab.header
       },
       index
-    ) : /* @__PURE__ */ jsx59("div", { className: finalClasses, style: finalStyle, role: "button", tabIndex: 0, children: tab.header }, index);
+    ) : /* @__PURE__ */ jsx60("div", { className: finalClasses, style: finalStyle, role: "button", tabIndex: 0, children: tab.header }, index);
   };
-  const renderMobileMenu = () => /* @__PURE__ */ jsxs36(DropdownMenu, { children: [
-    /* @__PURE__ */ jsxs36(DropdownMenuTrigger, { className: "flex items-center gap-2 px-3 py-2 rounded-md bg-white/10 text-white text-sm", children: [
-      /* @__PURE__ */ jsx59(Menu, { className: "h-4 w-4" }),
+  const renderMobileMenu = () => /* @__PURE__ */ jsxs37(DropdownMenu, { children: [
+    /* @__PURE__ */ jsxs37(DropdownMenuTrigger, { className: "flex items-center gap-2 px-3 py-2 rounded-md bg-white/10 text-white text-sm", children: [
+      /* @__PURE__ */ jsx60(Menu, { className: "h-4 w-4" }),
       "Menu"
     ] }),
-    /* @__PURE__ */ jsx59(
+    /* @__PURE__ */ jsx60(
       DropdownMenuContent,
       {
         align: "start",
@@ -5609,25 +5701,25 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
         children: rawTabs.map((tab, i) => {
           const hasChildren = Array.isArray(tab.children) && tab.children.length > 0 && tab.isDropDown;
           if (hasChildren) {
-            return /* @__PURE__ */ jsxs36(DropdownMenuSub, { children: [
-              /* @__PURE__ */ jsx59(DropdownMenuSubTrigger, { className: "flex items-center justify-between cursor-pointer rounded-sm px-3 py-2 text-[13px] text-foreground hover:text-foreground", children: tab.header }),
-              /* @__PURE__ */ jsx59(DropdownMenuSubContent, { className: "bg-white border shadow-lg rounded-md p-1", children: tab.children.map((item, index) => /* @__PURE__ */ jsx59(
+            return /* @__PURE__ */ jsxs37(DropdownMenuSub, { children: [
+              /* @__PURE__ */ jsx60(DropdownMenuSubTrigger, { className: "flex items-center justify-between cursor-pointer rounded-sm px-3 py-2 text-[13px] text-foreground hover:text-foreground", children: tab.header }),
+              /* @__PURE__ */ jsx60(DropdownMenuSubContent, { className: "bg-white border shadow-lg rounded-md p-1", children: tab.children.map((item, index) => /* @__PURE__ */ jsx60(
                 DropdownMenuItem,
                 {
                   asChild: true,
                   className: "cursor-pointer rounded-sm px-3 py-2 text-gray-800 hover:bg-gray-100",
-                  children: /* @__PURE__ */ jsx59(Link3, { href: item.url || "#", onClick: (e) => handleBuilderExit(e, item.url || "#"), children: item.header })
+                  children: /* @__PURE__ */ jsx60(Link3, { href: item.url || "#", onClick: (e) => handleBuilderExit(e, item.url || "#"), children: item.header })
                 },
                 item.id || index
               )) })
             ] }, i);
           }
-          return /* @__PURE__ */ jsx59(
+          return /* @__PURE__ */ jsx60(
             DropdownMenuItem,
             {
               asChild: true,
               className: "cursor-pointer rounded-sm px-3 py-2 text-[13px] text-gray-800 hover:bg-gray-100",
-              children: /* @__PURE__ */ jsx59(Link3, { href: tab.url || "#", onClick: (e) => handleBuilderExit(e, tab.url || "#"), children: tab.header })
+              children: /* @__PURE__ */ jsx60(Link3, { href: tab.url || "#", onClick: (e) => handleBuilderExit(e, tab.url || "#"), children: tab.header })
             },
             i
           );
@@ -5637,19 +5729,19 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
   ] });
   const forceMobile = canvasMode ? canvasMode === "mobile" || canvasMode === "tablet" : void 0;
   const forceDesktop = canvasMode ? canvasMode === "desktop" : void 0;
-  return /* @__PURE__ */ jsxs36(Fragment22, { children: [
-    /* @__PURE__ */ jsxs36("div", { className: cn("min-h-10", className), style, children: [
-      forceDesktop !== void 0 ? forceDesktop && /* @__PURE__ */ jsx59("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx59("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }) : /* @__PURE__ */ jsx59("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx59("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }),
-      forceMobile !== void 0 ? forceMobile && /* @__PURE__ */ jsx59("div", { children: renderMobileMenu() }) : /* @__PURE__ */ jsx59("div", { className: "flex md:hidden", children: renderMobileMenu() })
+  return /* @__PURE__ */ jsxs37(Fragment22, { children: [
+    /* @__PURE__ */ jsxs37("div", { className: cn("min-h-10", className), style, children: [
+      forceDesktop !== void 0 ? forceDesktop && /* @__PURE__ */ jsx60("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx60("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }) : /* @__PURE__ */ jsx60("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx60("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }),
+      forceMobile !== void 0 ? forceMobile && /* @__PURE__ */ jsx60("div", { children: renderMobileMenu() }) : /* @__PURE__ */ jsx60("div", { className: "flex md:hidden", children: renderMobileMenu() })
     ] }),
-    /* @__PURE__ */ jsx59(Dialog, { open: showExitDialog, onOpenChange: setShowExitDialog, children: /* @__PURE__ */ jsxs36(DialogContent, { className: "bg-[#fff]", children: [
-      /* @__PURE__ */ jsxs36(DialogHeader, { children: [
-        /* @__PURE__ */ jsx59(DialogTitle, { children: "Exit Builder?" }),
-        /* @__PURE__ */ jsx59(DialogDescription, { children: "You are about to leave the builder. Any unsaved changes may be lost." })
+    /* @__PURE__ */ jsx60(Dialog, { open: showExitDialog, onOpenChange: setShowExitDialog, children: /* @__PURE__ */ jsxs37(DialogContent, { className: "bg-[#fff]", children: [
+      /* @__PURE__ */ jsxs37(DialogHeader, { children: [
+        /* @__PURE__ */ jsx60(DialogTitle, { children: "Exit Builder?" }),
+        /* @__PURE__ */ jsx60(DialogDescription, { children: "You are about to leave the builder. Any unsaved changes may be lost." })
       ] }),
-      /* @__PURE__ */ jsxs36(DialogFooter, { children: [
-        /* @__PURE__ */ jsx59(Button, { className: "cursor-pointer bg-[#12715b] text-[#fff]", variant: "outline", onClick: () => setShowExitDialog(false), children: "Cancel" }),
-        /* @__PURE__ */ jsx59(Button, { className: "cursor-pointer border-[#12715b] border", onClick: confirmExit, children: "Yes, Exit" })
+      /* @__PURE__ */ jsxs37(DialogFooter, { children: [
+        /* @__PURE__ */ jsx60(Button, { className: "cursor-pointer bg-[#12715b] text-[#fff]", variant: "outline", onClick: () => setShowExitDialog(false), children: "Cancel" }),
+        /* @__PURE__ */ jsx60(Button, { className: "cursor-pointer border-[#12715b] border", onClick: confirmExit, children: "Yes, Exit" })
       ] })
     ] }) })
   ] });
@@ -5657,16 +5749,16 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
 var Tabs_default = Tabs;
 
 // src/components/Navigation/Stages/Stages.tsx
-import React12, { useEffect as useEffect27, useState as useState13 } from "react";
+import React13, { useEffect as useEffect28, useState as useState14 } from "react";
 
 // src/components/ui/tooltip.tsx
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { jsx as jsx60, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx61, jsxs as jsxs38 } from "react/jsx-runtime";
 function TooltipProvider({
   delayDuration = 0,
   ...props
 }) {
-  return /* @__PURE__ */ jsx60(
+  return /* @__PURE__ */ jsx61(
     TooltipPrimitive.Provider,
     {
       "data-slot": "tooltip-provider",
@@ -5678,12 +5770,12 @@ function TooltipProvider({
 function Tooltip({
   ...props
 }) {
-  return /* @__PURE__ */ jsx60(TooltipProvider, { children: /* @__PURE__ */ jsx60(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
+  return /* @__PURE__ */ jsx61(TooltipProvider, { children: /* @__PURE__ */ jsx61(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
 }
 function TooltipTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ jsx60(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
+  return /* @__PURE__ */ jsx61(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
 }
 function TooltipContent({
   className,
@@ -5692,7 +5784,7 @@ function TooltipContent({
   hideArrow,
   ...props
 }) {
-  return /* @__PURE__ */ jsx60(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs37(
+  return /* @__PURE__ */ jsx61(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs38(
     TooltipPrimitive.Content,
     {
       "data-slot": "tooltip-content",
@@ -5704,14 +5796,14 @@ function TooltipContent({
       ...props,
       children: [
         children,
-        !hideArrow && /* @__PURE__ */ jsx60(TooltipPrimitive.Arrow, { className: "bg-primary fill-primary z-50 size-2.5 rotate-45 rounded-[2px]" })
+        !hideArrow && /* @__PURE__ */ jsx61(TooltipPrimitive.Arrow, { className: "bg-primary fill-primary z-50 size-2.5 rotate-45 rounded-[2px]" })
       ]
     }
   ) });
 }
 
 // src/components/Navigation/Stages/Stages.tsx
-import { jsx as jsx61, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs39 } from "react/jsx-runtime";
 var StagesComponent = ({
   stages,
   isShowBtn,
@@ -5728,11 +5820,11 @@ var StagesComponent = ({
   canvasMode = "desktop",
   ...props
 }) => {
-  const [activeStage, setActiveStage] = useState13("");
-  const [isCompleted, setIsCompleted] = useState13(false);
-  const [activeChildStage, setActiveChildStage] = useState13(null);
-  const [activeRootStage, setActiveRootStage] = useState13(null);
-  useEffect27(() => {
+  const [activeStage, setActiveStage] = useState14("");
+  const [isCompleted, setIsCompleted] = useState14(false);
+  const [activeChildStage, setActiveChildStage] = useState14(null);
+  const [activeRootStage, setActiveRootStage] = useState14(null);
+  useEffect28(() => {
     if (currentStage) {
       setActiveStage(currentStage);
     } else {
@@ -5794,7 +5886,7 @@ var StagesComponent = ({
     }
     return { activeRoot: null, activeChild: null };
   };
-  useEffect27(() => {
+  useEffect28(() => {
     if (!currentStage || !Array.isArray(stages)) {
       setActiveRootStage(null);
       setActiveChildStage(null);
@@ -5807,7 +5899,7 @@ var StagesComponent = ({
   const isAllStagesCompleted = isCompleted;
   const disabled = isAllStagesCompleted || loading || saving;
   const primaryColor = props.primaryColor || "#12715b";
-  return /* @__PURE__ */ jsx61("div", { className, style, children: /* @__PURE__ */ jsxs38(
+  return /* @__PURE__ */ jsx62("div", { className, style, children: /* @__PURE__ */ jsxs39(
     "div",
     {
       className: `
@@ -5817,8 +5909,8 @@ var StagesComponent = ({
         ${isMobile ? "p-3 sm:p-4" : "p-2"}
       `,
       children: [
-        /* @__PURE__ */ jsx61("div", { className: "flex items-center flex-shrink-0 order-1 lg:order-1", children: /* @__PURE__ */ jsx61("button", { className: "p-2 hover:bg-gray-100 rounded flex-shrink-0", children: /* @__PURE__ */ jsx61("svg", { className: "w-4 h-4 text-gray-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx61("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) }) }) }),
-        /* @__PURE__ */ jsx61(
+        /* @__PURE__ */ jsx62("div", { className: "flex items-center flex-shrink-0 order-1 lg:order-1", children: /* @__PURE__ */ jsx62("button", { className: "p-2 hover:bg-gray-100 rounded flex-shrink-0", children: /* @__PURE__ */ jsx62("svg", { className: "w-4 h-4 text-gray-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx62("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) }) }) }),
+        /* @__PURE__ */ jsx62(
           "div",
           {
             className: `
@@ -5826,7 +5918,7 @@ var StagesComponent = ({
           flex-wrap gap-2 sm:gap-2 lg:gap-3 w-full lg:w-auto
           ${isMobile ? "order-2 mt-2 lg:mt-0" : "order-2"}
         `,
-            children: loading ? Array(6).fill(null).map((_, index) => /* @__PURE__ */ jsx61(
+            children: loading ? Array(6).fill(null).map((_, index) => /* @__PURE__ */ jsx62(
               "button",
               {
                 className: `
@@ -5856,7 +5948,8 @@ var StagesComponent = ({
                 const isCurrentRootStage = activeRootStage?.[dataKey] === stage[dataKey];
                 const stageHasChildren = Array.isArray(stage?.children) && stage.children.length > 0;
                 const isCurrentChildStage = activeChildStage?.[dataKey] === activeStage;
-                const showOutcomeForCurrentStage = showAsActive && hasOutcome && stageHasChildren && isCurrentRootStage && isCurrentChildStage;
+                const isNotParentSelected = activeChildStage?.[dataKey] !== activeRootStage?.[dataKey];
+                const showOutcomeForCurrentStage = showAsActive && hasOutcome && stageHasChildren && isCurrentRootStage && isCurrentChildStage && isNotParentSelected;
                 let stageColor = `text-[${primaryColor}] border-2 border-[${primaryColor}]`;
                 let stageStyle = {
                   borderColor: primaryColor,
@@ -5881,8 +5974,8 @@ var StagesComponent = ({
                   }
                 }
                 const stageKey = typeof stage[dataKey] === "string" ? stage[dataKey] : JSON.stringify(stage[dataKey]);
-                return /* @__PURE__ */ jsx61(React12.Fragment, { children: /* @__PURE__ */ jsxs38(Tooltip, { delayDuration: 500, disableHoverableContent: true, children: [
-                  /* @__PURE__ */ jsx61(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx61(
+                return /* @__PURE__ */ jsx62(React13.Fragment, { children: /* @__PURE__ */ jsxs39(Tooltip, { delayDuration: 500, disableHoverableContent: true, children: [
+                  /* @__PURE__ */ jsx62(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx62(
                     "button",
                     {
                       className: `
@@ -5900,21 +5993,21 @@ var StagesComponent = ({
                       children: stageLabel
                     }
                   ) }),
-                  /* @__PURE__ */ jsx61(TooltipContent, { side: "top", sideOffset: 6, hideArrow: true, children: stageLabel }),
-                  !isMobile && index < safeStages.length - 1 && /* @__PURE__ */ jsx61("div", { className: "hidden sm:flex sm:flex-shrink-0 w-3 h-px bg-gray-300 sm:w-4" })
+                  /* @__PURE__ */ jsx62(TooltipContent, { side: "top", sideOffset: 6, hideArrow: true, children: stageLabel }),
+                  !isMobile && index < safeStages.length - 1 && /* @__PURE__ */ jsx62("div", { className: "hidden sm:flex sm:flex-shrink-0 w-3 h-px bg-gray-300 sm:w-4" })
                 ] }, stageKey) }, stageKey);
               });
             })()
           }
         ),
-        isShowBtn && /* @__PURE__ */ jsx61(
+        isShowBtn && /* @__PURE__ */ jsx62(
           "div",
           {
             className: `
             flex items-center flex-shrink-0 w-full lg:w-auto
             ${isMobile ? "order-3 mt-3 lg:mt-0" : "order-3"}
           `,
-            children: /* @__PURE__ */ jsx61(
+            children: /* @__PURE__ */ jsx62(
               "button",
               {
                 className: `
@@ -5937,33 +6030,33 @@ var StagesComponent = ({
 var Stages_default = StagesComponent;
 
 // src/components/Navigation/Spacer/Spacer.tsx
-import { jsx as jsx62 } from "react/jsx-runtime";
+import { jsx as jsx63 } from "react/jsx-runtime";
 var Spacer = ({ className, style }) => {
-  return /* @__PURE__ */ jsx62("div", { className: `${className}`, style });
+  return /* @__PURE__ */ jsx63("div", { className: `${className}`, style });
 };
 var Spacer_default = Spacer;
 
 // src/components/Navigation/Profile/Profile.tsx
-import { jsx as jsx63, jsxs as jsxs39 } from "react/jsx-runtime";
+import { jsx as jsx64, jsxs as jsxs40 } from "react/jsx-runtime";
 
 // src/components/Navigation/Notification/Notification.tsx
-import { jsx as jsx64, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx65, jsxs as jsxs41 } from "react/jsx-runtime";
 
 // src/components/Navigation/Logo/Logo.tsx
-import { jsx as jsx65 } from "react/jsx-runtime";
+import { jsx as jsx66 } from "react/jsx-runtime";
 
 // src/components/Navigation/Navbar/Navbar.tsx
-import { useCallback as useCallback6, useMemo as useMemo10, useState as useState14, useEffect as useEffect28 } from "react";
+import { useCallback as useCallback6, useMemo as useMemo10, useState as useState15, useEffect as useEffect29 } from "react";
 import { Bell, Search as Search2, Menu as Menu2 } from "lucide-react";
 import Image3 from "next/image";
 import Link4 from "next/link";
 import { useRouter as useRouter2 } from "next/navigation";
 
 // src/components/ui/avatar.tsx
-import * as React13 from "react";
+import * as React14 from "react";
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
-import { jsx as jsx66 } from "react/jsx-runtime";
-var Avatar = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx66(
+import { jsx as jsx67 } from "react/jsx-runtime";
+var Avatar = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx67(
   AvatarPrimitive.Root,
   {
     ref,
@@ -5975,7 +6068,7 @@ var Avatar = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
   }
 ));
 Avatar.displayName = AvatarPrimitive.Root.displayName;
-var AvatarImage = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx66(
+var AvatarImage = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx67(
   AvatarPrimitive.Image,
   {
     ref,
@@ -5984,7 +6077,7 @@ var AvatarImage = React13.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 AvatarImage.displayName = AvatarPrimitive.Image.displayName;
-var AvatarFallback = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx66(
+var AvatarFallback = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx67(
   AvatarPrimitive.Fallback,
   {
     ref,
@@ -5998,7 +6091,7 @@ var AvatarFallback = React13.forwardRef(({ className, ...props }, ref) => /* @__
 AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
 
 // src/components/Navigation/Navbar/Navbar.tsx
-import { Fragment as Fragment23, jsx as jsx67, jsxs as jsxs41 } from "react/jsx-runtime";
+import { Fragment as Fragment23, jsx as jsx68, jsxs as jsxs42 } from "react/jsx-runtime";
 function Navbar({
   style,
   badgeType,
@@ -6020,10 +6113,10 @@ function Navbar({
   primaryColor = "#2a55a3"
 }) {
   const router = useRouter2();
-  const [screenMode, setScreenMode] = useState14(
+  const [screenMode, setScreenMode] = useState15(
     canvasMode
   );
-  useEffect28(() => {
+  useEffect29(() => {
     const detectMode = () => {
       if (window.innerWidth < 640) setScreenMode("mobile");
       else if (window.innerWidth < 1024) setScreenMode("tablet");
@@ -6057,9 +6150,9 @@ function Navbar({
     }
     return list;
   }, [source, navList, list]);
-  const RenderSearchInput = () => /* @__PURE__ */ jsx67("div", { className: "flex-1 px-2", children: /* @__PURE__ */ jsxs41("div", { className: "relative w-full max-w-md border border-gray-300 rounded-md", children: [
-    /* @__PURE__ */ jsx67(Search2, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 dark:text-white text-gray-400" }),
-    /* @__PURE__ */ jsx67(
+  const RenderSearchInput = () => /* @__PURE__ */ jsx68("div", { className: "flex-1 px-2", children: /* @__PURE__ */ jsxs42("div", { className: "relative w-full max-w-md border border-gray-300 rounded-md", children: [
+    /* @__PURE__ */ jsx68(Search2, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 dark:text-white text-gray-400" }),
+    /* @__PURE__ */ jsx68(
       Input,
       {
         placeholder: "Search",
@@ -6075,23 +6168,23 @@ function Navbar({
       }
     )
   ] }) });
-  return /* @__PURE__ */ jsxs41(Fragment23, { children: [
-    /* @__PURE__ */ jsx67(
+  return /* @__PURE__ */ jsxs42(Fragment23, { children: [
+    /* @__PURE__ */ jsx68(
       "nav",
       {
         className: "w-full min-h-[75px] border-b border-gray-200 dark:border-gray-800 dark:bg-gray-800 bg-white shadow-sm",
         style,
-        children: /* @__PURE__ */ jsxs41("div", { className: "mx-auto flex max-w-[90%] items-center justify-between px-4 py-4", children: [
-          /* @__PURE__ */ jsx67(
+        children: /* @__PURE__ */ jsxs42("div", { className: "mx-auto flex max-w-[90%] items-center justify-between px-4 py-4", children: [
+          /* @__PURE__ */ jsx68(
             Link4,
             {
               href: "/",
               onClick: (e) => handleBuilderExit(e, "/"),
               className: "flex items-center space-x-2",
-              children: imageUrl ? /* @__PURE__ */ jsx67(Image3, { src: imageUrl, alt: altText, width: 180, height: 40 }) : /* @__PURE__ */ jsx67("span", { className: "font-semibold text-blue-700", children: "Logo" })
+              children: imageUrl ? /* @__PURE__ */ jsx68(Image3, { src: imageUrl, alt: altText, width: 180, height: 40 }) : /* @__PURE__ */ jsx68("span", { className: "font-semibold text-blue-700", children: "Logo" })
             }
           ),
-          isDesktop && /* @__PURE__ */ jsx67("div", { className: "hidden md:flex items-center space-x-6", children: formattedMenu.map((item) => /* @__PURE__ */ jsx67(
+          isDesktop && /* @__PURE__ */ jsx68("div", { className: "hidden md:flex items-center space-x-6", children: formattedMenu.map((item) => /* @__PURE__ */ jsx68(
             Link4,
             {
               href: item.url,
@@ -6101,23 +6194,23 @@ function Navbar({
             },
             item.id
           )) }),
-          /* @__PURE__ */ jsxs41("div", { className: "flex items-center space-x-3", children: [
-            (isDesktop || isTablet) && /* @__PURE__ */ jsx67(RenderSearchInput, {}),
-            /* @__PURE__ */ jsxs41("div", { className: "relative bg-gray-200 dark:bg-gray-700 rounded-md", children: [
-              /* @__PURE__ */ jsx67(Button, { variant: "ghost", size: "icon", children: /* @__PURE__ */ jsx67(Bell, { className: "h-5 w-5 text-gray-700 dark:text-gray-300" }) }),
-              badgeType === "number" && !(hideBadgeWhenZero && badgeCount === 0) && Number(badgeCount) > 0 ? /* @__PURE__ */ jsx67("span", { className: "absolute -top-1 -right-1 h-4 w-4 flex items-center justify-center bg-red-500 rounded-full text-white text-[10px]", children: badgeCount }) : !hideBadgeWhenZero && /* @__PURE__ */ jsx67("span", { className: "absolute -top-1 -right-1 h-2 w-2 bg-red-500 rounded-full" })
+          /* @__PURE__ */ jsxs42("div", { className: "flex items-center space-x-3", children: [
+            (isDesktop || isTablet) && /* @__PURE__ */ jsx68(RenderSearchInput, {}),
+            /* @__PURE__ */ jsxs42("div", { className: "relative bg-gray-200 dark:bg-gray-700 rounded-md", children: [
+              /* @__PURE__ */ jsx68(Button, { variant: "ghost", size: "icon", children: /* @__PURE__ */ jsx68(Bell, { className: "h-5 w-5 text-gray-700 dark:text-gray-300" }) }),
+              badgeType === "number" && !(hideBadgeWhenZero && badgeCount === 0) && Number(badgeCount) > 0 ? /* @__PURE__ */ jsx68("span", { className: "absolute -top-1 -right-1 h-4 w-4 flex items-center justify-center bg-red-500 rounded-full text-white text-[10px]", children: badgeCount }) : !hideBadgeWhenZero && /* @__PURE__ */ jsx68("span", { className: "absolute -top-1 -right-1 h-2 w-2 bg-red-500 rounded-full" })
             ] }),
-            /* @__PURE__ */ jsxs41(DropdownMenu, { children: [
-              /* @__PURE__ */ jsx67(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs41("div", { className: "flex items-center space-x-2 cursor-pointer", children: [
-                !isMobile && showName && /* @__PURE__ */ jsx67("h4", { className: "text-gray-900 dark:text-gray-300 text-sm", children: userName }),
-                /* @__PURE__ */ jsx67(Avatar, { className: "h-8 w-8", children: profileType === "avatar" ? /* @__PURE__ */ jsx67(AvatarImage, { src: "/images/appbuilder/toolset/profile.svg", alt: "profile" }) : /* @__PURE__ */ jsx67("div", { className: `bg-[${primaryColor}] text-white h-full w-full rounded-full flex items-center justify-center text-xs`, style: { backgroundColor: primaryColor }, children: getInitials(userName) }) }),
-                (isMobile || isTablet) && /* @__PURE__ */ jsx67(Button, { variant: "ghost", size: "icon", children: /* @__PURE__ */ jsx67(Menu2, { className: "h-6 w-6" }) })
+            /* @__PURE__ */ jsxs42(DropdownMenu, { children: [
+              /* @__PURE__ */ jsx68(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs42("div", { className: "flex items-center space-x-2 cursor-pointer", children: [
+                !isMobile && showName && /* @__PURE__ */ jsx68("h4", { className: "text-gray-900 dark:text-gray-300 text-sm", children: userName }),
+                /* @__PURE__ */ jsx68(Avatar, { className: "h-8 w-8", children: profileType === "avatar" ? /* @__PURE__ */ jsx68(AvatarImage, { src: "/images/appbuilder/toolset/profile.svg", alt: "profile" }) : /* @__PURE__ */ jsx68("div", { className: `bg-[${primaryColor}] text-white h-full w-full rounded-full flex items-center justify-center text-xs`, style: { backgroundColor: primaryColor }, children: getInitials(userName) }) }),
+                (isMobile || isTablet) && /* @__PURE__ */ jsx68(Button, { variant: "ghost", size: "icon", children: /* @__PURE__ */ jsx68(Menu2, { className: "h-6 w-6" }) })
               ] }) }),
-              /* @__PURE__ */ jsxs41(DropdownMenuContent, { align: "end", className: "bg-white dark:bg-gray-800", children: [
-                profileMenu.map((item) => /* @__PURE__ */ jsx67(DropdownMenuItem, { children: /* @__PURE__ */ jsx67(Link4, { href: item.url, onClick: (e) => handleBuilderExit(e, item.url), children: item.header }) }, item.id)),
-                (isMobile || isTablet) && /* @__PURE__ */ jsxs41(Fragment23, { children: [
-                  /* @__PURE__ */ jsx67(DropdownMenuSeparator, {}),
-                  formattedMenu.map((item) => /* @__PURE__ */ jsx67(DropdownMenuItem, { children: /* @__PURE__ */ jsx67(Link4, { href: item.url, onClick: (e) => handleBuilderExit(e, item.url), children: item.header }) }, item.id))
+              /* @__PURE__ */ jsxs42(DropdownMenuContent, { align: "end", className: "bg-white dark:bg-gray-800", children: [
+                profileMenu.map((item) => /* @__PURE__ */ jsx68(DropdownMenuItem, { children: /* @__PURE__ */ jsx68(Link4, { href: item.url, onClick: (e) => handleBuilderExit(e, item.url), children: item.header }) }, item.id)),
+                (isMobile || isTablet) && /* @__PURE__ */ jsxs42(Fragment23, { children: [
+                  /* @__PURE__ */ jsx68(DropdownMenuSeparator, {}),
+                  formattedMenu.map((item) => /* @__PURE__ */ jsx68(DropdownMenuItem, { children: /* @__PURE__ */ jsx68(Link4, { href: item.url, onClick: (e) => handleBuilderExit(e, item.url), children: item.header }) }, item.id))
                 ] })
               ] })
             ] })
@@ -6125,12 +6218,12 @@ function Navbar({
         ] })
       }
     ),
-    isMobile && /* @__PURE__ */ jsx67("div", { className: "p-3", children: /* @__PURE__ */ jsx67(RenderSearchInput, {}) })
+    isMobile && /* @__PURE__ */ jsx68("div", { className: "p-3", children: /* @__PURE__ */ jsx68(RenderSearchInput, {}) })
   ] });
 }
 
 // src/components/Chart/BarChart.tsx
-import React14, { useEffect as useEffect29, useMemo as useMemo11, useState as useState15, useCallback as useCallback7 } from "react";
+import React15, { useEffect as useEffect30, useMemo as useMemo11, useState as useState16, useCallback as useCallback7 } from "react";
 import axios4 from "axios";
 import {
   BarChart,
@@ -6143,7 +6236,7 @@ import {
   Tooltip as Tooltip2,
   ResponsiveContainer
 } from "recharts";
-import { jsx as jsx68, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx69, jsxs as jsxs43 } from "react/jsx-runtime";
 var palette = [
   "#2563eb",
   "#1d4ed8",
@@ -6203,13 +6296,13 @@ var ChartComponent = ({
   ...props
 }) => {
   const useApi = source === "api" && !!apiUrl;
-  const [rawData, setRawData] = useState15([]);
-  const [rawMeta, setRawMeta] = useState15(null);
-  const [localLoading, setLocalLoading] = useState15(false);
-  const [currentPage, setCurrentPage] = useState15(1);
+  const [rawData, setRawData] = useState16([]);
+  const [rawMeta, setRawMeta] = useState16(null);
+  const [localLoading, setLocalLoading] = useState16(false);
+  const [currentPage, setCurrentPage] = useState16(1);
   const effectiveData = useApi ? rawData : props.data || [];
   const effectiveLoading = useApi ? localLoading : externalLoading;
-  useEffect29(() => {
+  useEffect30(() => {
     if (useApi) {
       setCurrentPage(1);
     }
@@ -6251,7 +6344,7 @@ var ChartComponent = ({
       if (!cancelled) setLocalLoading(false);
     }
   }, [apiUrl, limit]);
-  useEffect29(() => {
+  useEffect30(() => {
     if (!useApi) return;
     fetchData(currentPage);
   }, [useApi, currentPage, fetchData]);
@@ -6274,7 +6367,7 @@ var ChartComponent = ({
   const renderLegends = useMemo11(() => {
     if (!showLegends || !dataKey || !dataLabel) return null;
     const isLegendRight2 = !forceMobile && legendPosition === "right";
-    return /* @__PURE__ */ jsx68(
+    return /* @__PURE__ */ jsx69(
       "div",
       {
         className: isLegendRight2 ? "flex flex-col gap-2 w-full min-w-0 justify-start overflow-y-auto max-h-[260px]" : "flex flex-wrap justify-center gap-2 mt-4 w-full max-w-4xl",
@@ -6287,7 +6380,7 @@ var ChartComponent = ({
             [dataLabel]: d[dataLabel],
             [dataKey]: value
           };
-          return /* @__PURE__ */ jsxs42(
+          return /* @__PURE__ */ jsxs43(
             "div",
             {
               role: onLegendClick ? "button" : void 0,
@@ -6296,16 +6389,16 @@ var ChartComponent = ({
               onKeyDown: onLegendClick ? (e) => e.key === "Enter" && onLegendClick(payload) : void 0,
               className: `flex items-center space-x-2 rounded-lg border border-gray-200/50 px-3 py-1.5 min-w-[180px] w-[180px] bg-white/80 backdrop-blur-sm shadow-sm hover:shadow-md transition-all ${onLegendClick ? "cursor-pointer" : ""}`,
               children: [
-                /* @__PURE__ */ jsx68(
+                /* @__PURE__ */ jsx69(
                   "span",
                   {
                     className: "inline-block w-[12px] h-[12px] rounded-full shrink-0 border-2 border-white/50",
                     style: { backgroundColor: d.fill }
                   }
                 ),
-                /* @__PURE__ */ jsxs42("div", { className: "min-w-0 flex-1", children: [
-                  /* @__PURE__ */ jsx68("span", { className: "text-gray-900 text-[11px] md:text-[13px] font-semibold block truncate leading-tight capitalize", children: d[dataLabel] }),
-                  /* @__PURE__ */ jsx68("span", { className: "text-xs text-gray-600 font-medium", children: displayValue })
+                /* @__PURE__ */ jsxs43("div", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ jsx69("span", { className: "text-gray-900 text-[11px] md:text-[13px] font-semibold block truncate leading-tight capitalize", children: d[dataLabel] }),
+                  /* @__PURE__ */ jsx69("span", { className: "text-xs text-gray-600 font-medium", children: displayValue })
                 ] })
               ]
             },
@@ -6316,27 +6409,27 @@ var ChartComponent = ({
     );
   }, [data, dataLabel, dataKey, showLegends, onLegendClick, legendPosition, forceMobile]);
   if (effectiveLoading) {
-    return /* @__PURE__ */ jsxs42(
+    return /* @__PURE__ */ jsxs43(
       "div",
       {
         className: `relative flex flex-col w-full h-[300px] md:h-[400px] bg-gradient-to-br from-gray-50 to-gray-100 rounded-xl p-6 ${className}`,
         style,
         children: [
-          /* @__PURE__ */ jsx68("div", { className: "mb-6 flex justify-center", children: /* @__PURE__ */ jsxs42("div", { className: "inline-flex items-center space-x-2 bg-white/90 px-6 py-2.5 rounded-xl backdrop-blur-sm border border-gray-200 shadow-lg", children: [
-            /* @__PURE__ */ jsx68("div", { className: "w-5 h-5 border-2 border-gray-400 border-t-blue-500 rounded-full animate-spin" }),
-            /* @__PURE__ */ jsx68("span", { className: "text-sm font-medium text-gray-700 bg-gradient-to-r from-gray-300 bg-clip-text animate-pulse", children: "Loading chart data..." })
+          /* @__PURE__ */ jsx69("div", { className: "mb-6 flex justify-center", children: /* @__PURE__ */ jsxs43("div", { className: "inline-flex items-center space-x-2 bg-white/90 px-6 py-2.5 rounded-xl backdrop-blur-sm border border-gray-200 shadow-lg", children: [
+            /* @__PURE__ */ jsx69("div", { className: "w-5 h-5 border-2 border-gray-400 border-t-blue-500 rounded-full animate-spin" }),
+            /* @__PURE__ */ jsx69("span", { className: "text-sm font-medium text-gray-700 bg-gradient-to-r from-gray-300 bg-clip-text animate-pulse", children: "Loading chart data..." })
           ] }) }),
-          /* @__PURE__ */ jsx68("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/60 to-transparent animate-shimmer rounded-xl" }),
-          /* @__PURE__ */ jsx68("div", { className: "flex-1 relative w-full h-full min-h-[240px] md:min-h-[320px] bg-white/80 rounded-lg border border-gray-200/50 shadow-sm", children: /* @__PURE__ */ jsx68("div", { className: "absolute bottom-0 left-4 right-4 flex gap-2 h-[200px] md:h-[280px] justify-center items-end", children: [...Array(20)].map((_, idx) => {
+          /* @__PURE__ */ jsx69("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/60 to-transparent animate-shimmer rounded-xl" }),
+          /* @__PURE__ */ jsx69("div", { className: "flex-1 relative w-full h-full min-h-[240px] md:min-h-[320px] bg-white/80 rounded-lg border border-gray-200/50 shadow-sm", children: /* @__PURE__ */ jsx69("div", { className: "absolute bottom-0 left-4 right-4 flex gap-2 h-[200px] md:h-[280px] justify-center items-end", children: [...Array(20)].map((_, idx) => {
             const randomHeight = `${Math.floor(Math.random() * 76) + 20}%`;
-            return /* @__PURE__ */ jsxs42(
+            return /* @__PURE__ */ jsxs43(
               "div",
               {
                 className: `relative w-10 md:w-12 flex-1 max-w-[48px] rounded-t-lg bg-gradient-to-t from-gray-100 via-gray-200 to-transparent shadow-lg border border-gray-200/50 animate-slide-up stagger-${idx} overflow-hidden`,
                 style: { height: randomHeight, animationDelay: `${idx * 0.08}s` },
                 children: [
-                  /* @__PURE__ */ jsx68("div", { className: "absolute inset-0 bg-gradient-to-r from-white/40 via-transparent to-white/40 animate-shimmer-bar" }),
-                  /* @__PURE__ */ jsx68("div", { className: "absolute bottom-1 left-1/2 w-4 h-1 rounded-full transform -translate-x-1/2 blur-sm" })
+                  /* @__PURE__ */ jsx69("div", { className: "absolute inset-0 bg-gradient-to-r from-white/40 via-transparent to-white/40 animate-shimmer-bar" }),
+                  /* @__PURE__ */ jsx69("div", { className: "absolute bottom-1 left-1/2 w-4 h-1 rounded-full transform -translate-x-1/2 blur-sm" })
                 ]
               },
               `bar-${idx}`
@@ -6347,74 +6440,74 @@ var ChartComponent = ({
     );
   }
   if (data.length === 0) {
-    return /* @__PURE__ */ jsx68(
+    return /* @__PURE__ */ jsx69(
       "div",
       {
         className: `relative flex flex-col items-center justify-center w-full h-[300px] md:h-[400px] bg-gradient-to-br from-gray-50 to-gray-100 rounded-xl p-6 ${className}`,
         style,
-        children: /* @__PURE__ */ jsx68("div", { className: "text-center", children: /* @__PURE__ */ jsx68("div", { className: "inline-flex items-center space-x-2 bg-white/80 px-6 py-3 rounded-xl backdrop-blur-sm border border-gray-200 shadow-lg", children: /* @__PURE__ */ jsx68("span", { className: "text-sm font-medium text-gray-600", children: "No data" }) }) })
+        children: /* @__PURE__ */ jsx69("div", { className: "text-center", children: /* @__PURE__ */ jsx69("div", { className: "inline-flex items-center space-x-2 bg-white/80 px-6 py-3 rounded-xl backdrop-blur-sm border border-gray-200 shadow-lg", children: /* @__PURE__ */ jsx69("span", { className: "text-sm font-medium text-gray-600", children: "No data" }) }) })
       }
     );
   }
   const isLegendRight = !forceMobile && legendPosition === "right";
-  return /* @__PURE__ */ jsxs42(
+  return /* @__PURE__ */ jsxs43(
     "div",
     {
       className: `relative flex ${isLegendRight ? "flex-row items-stretch gap-4" : "flex-col items-center"} ${className}`,
       style,
       children: [
-        /* @__PURE__ */ jsxs42(
+        /* @__PURE__ */ jsxs43(
           "div",
           {
             className: `relative flex items-center justify-center ${isLegendRight ? "flex-[2] min-w-0 max-w-[70%] h-[450px]" : "w-full md:w-[75%] h-[450px] mb-2"}`,
             children: [
-              isPaginationEnabled && rawMeta && /* @__PURE__ */ jsxs42("div", { className: "flex items-center justify-between mb-4 px-2", children: [
-                /* @__PURE__ */ jsxs42("div", { className: "flex items-center space-x-2 sm:hidden w-full justify-center", children: [
-                  /* @__PURE__ */ jsx68(
+              isPaginationEnabled && rawMeta && /* @__PURE__ */ jsxs43("div", { className: "flex items-center justify-between mb-4 px-2", children: [
+                /* @__PURE__ */ jsxs43("div", { className: "flex items-center space-x-2 sm:hidden w-full justify-center", children: [
+                  /* @__PURE__ */ jsx69(
                     "button",
                     {
                       onClick: () => handlePageChange(currentPage - 1),
                       disabled: currentPage === 1 || localLoading,
                       className: "flex-1 px-3 py-2 text-xs font-medium rounded-lg border bg-white shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition-all duration-200 flex items-center justify-center space-x-1 min-w-0",
-                      children: /* @__PURE__ */ jsx68("span", { children: "\u2190 Prev" })
+                      children: /* @__PURE__ */ jsx69("span", { children: "\u2190 Prev" })
                     }
                   ),
-                  /* @__PURE__ */ jsx68("span", { className: "px-2 py-2 text-xs font-semibold text-gray-700 min-w-[36px] text-center flex-shrink-0", children: currentPage }),
-                  /* @__PURE__ */ jsx68(
+                  /* @__PURE__ */ jsx69("span", { className: "px-2 py-2 text-xs font-semibold text-gray-700 min-w-[36px] text-center flex-shrink-0", children: currentPage }),
+                  /* @__PURE__ */ jsx69(
                     "button",
                     {
                       onClick: () => handlePageChange(currentPage + 1),
                       disabled: currentPage >= rawMeta.pages || localLoading,
                       className: "flex-1 px-3 py-2 text-xs font-medium rounded-lg border bg-white shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition-all duration-200 flex items-center justify-center space-x-1 min-w-0",
-                      children: /* @__PURE__ */ jsx68("span", { children: "Next \u2192" })
+                      children: /* @__PURE__ */ jsx69("span", { children: "Next \u2192" })
                     }
                   )
                 ] }),
-                /* @__PURE__ */ jsxs42("div", { className: "hidden sm:flex items-center space-x-2", children: [
-                  /* @__PURE__ */ jsx68(
+                /* @__PURE__ */ jsxs43("div", { className: "hidden sm:flex items-center space-x-2", children: [
+                  /* @__PURE__ */ jsx69(
                     "button",
                     {
                       onClick: () => handlePageChange(currentPage - 1),
                       disabled: currentPage === 1 || localLoading,
                       className: "px-3 py-1.5 text-sm font-medium rounded-lg border bg-white shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition-all duration-200 flex items-center space-x-1",
-                      children: /* @__PURE__ */ jsx68("span", { children: "\u2190 Prev" })
+                      children: /* @__PURE__ */ jsx69("span", { children: "\u2190 Prev" })
                     }
                   ),
-                  /* @__PURE__ */ jsx68("span", { className: "px-3 py-1 text-sm font-medium text-gray-700", children: currentPage }),
-                  /* @__PURE__ */ jsx68(
+                  /* @__PURE__ */ jsx69("span", { className: "px-3 py-1 text-sm font-medium text-gray-700", children: currentPage }),
+                  /* @__PURE__ */ jsx69(
                     "button",
                     {
                       onClick: () => handlePageChange(currentPage + 1),
                       disabled: currentPage >= rawMeta.pages || localLoading,
                       className: "px-3 py-1.5 text-sm font-medium rounded-lg border bg-white shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition-all duration-200 flex items-center space-x-1",
-                      children: /* @__PURE__ */ jsx68("span", { children: "Next \u2192" })
+                      children: /* @__PURE__ */ jsx69("span", { children: "Next \u2192" })
                     }
                   )
                 ] })
               ] }),
-              /* @__PURE__ */ jsx68(ResponsiveContainer, { width: "100%", height: "100%", children: chartType === "bar" ? /* @__PURE__ */ jsxs42(BarChart, { data, children: [
-                /* @__PURE__ */ jsx68(CartesianGrid, { strokeDasharray: "3 3" }),
-                /* @__PURE__ */ jsx68(
+              /* @__PURE__ */ jsx69(ResponsiveContainer, { width: "100%", height: "100%", children: chartType === "bar" ? /* @__PURE__ */ jsxs43(BarChart, { data, children: [
+                /* @__PURE__ */ jsx69(CartesianGrid, { strokeDasharray: "3 3" }),
+                /* @__PURE__ */ jsx69(
                   XAxis,
                   {
                     dataKey: dataLabel,
@@ -6432,7 +6525,7 @@ var ChartComponent = ({
                     className: "hidden sm:block"
                   }
                 ),
-                /* @__PURE__ */ jsx68(
+                /* @__PURE__ */ jsx69(
                   YAxis,
                   {
                     tickFormatter: (value) => `${(value / 1e3).toFixed(0)}k`,
@@ -6445,8 +6538,8 @@ var ChartComponent = ({
                     width: 60
                   }
                 ),
-                /* @__PURE__ */ jsx68(Tooltip2, { formatter: (value) => value != null ? [`${value}`, "Count"] : ["", "Count"] }),
-                /* @__PURE__ */ jsx68(
+                /* @__PURE__ */ jsx69(Tooltip2, { formatter: (value) => value != null ? [`${value}`, "Count"] : ["", "Count"] }),
+                /* @__PURE__ */ jsx69(
                   Bar,
                   {
                     dataKey,
@@ -6454,13 +6547,13 @@ var ChartComponent = ({
                     isAnimationActive: false
                   }
                 )
-              ] }) : /* @__PURE__ */ jsxs42(AreaChart, { data, children: [
-                /* @__PURE__ */ jsx68("defs", { children: /* @__PURE__ */ jsxs42("linearGradient", { id: "colorCount", x1: "0", y1: "0", x2: "0", y2: "1", children: [
-                  /* @__PURE__ */ jsx68("stop", { offset: "5%", stopColor: "#00695C", stopOpacity: 0.8 }),
-                  /* @__PURE__ */ jsx68("stop", { offset: "95%", stopColor: "#00695C", stopOpacity: 0 })
+              ] }) : /* @__PURE__ */ jsxs43(AreaChart, { data, children: [
+                /* @__PURE__ */ jsx69("defs", { children: /* @__PURE__ */ jsxs43("linearGradient", { id: "colorCount", x1: "0", y1: "0", x2: "0", y2: "1", children: [
+                  /* @__PURE__ */ jsx69("stop", { offset: "5%", stopColor: "#00695C", stopOpacity: 0.8 }),
+                  /* @__PURE__ */ jsx69("stop", { offset: "95%", stopColor: "#00695C", stopOpacity: 0 })
                 ] }) }),
-                /* @__PURE__ */ jsx68(CartesianGrid, { strokeDasharray: "3 3" }),
-                /* @__PURE__ */ jsx68(
+                /* @__PURE__ */ jsx69(CartesianGrid, { strokeDasharray: "3 3" }),
+                /* @__PURE__ */ jsx69(
                   XAxis,
                   {
                     dataKey: dataLabel,
@@ -6474,7 +6567,7 @@ var ChartComponent = ({
                     }
                   }
                 ),
-                /* @__PURE__ */ jsx68(
+                /* @__PURE__ */ jsx69(
                   YAxis,
                   {
                     tickFormatter: (value) => `${(value / 1e3).toFixed(0)}k`,
@@ -6487,8 +6580,8 @@ var ChartComponent = ({
                     width: 60
                   }
                 ),
-                /* @__PURE__ */ jsx68(Tooltip2, { formatter: (value) => value != null ? `${value}k` : "" }),
-                /* @__PURE__ */ jsx68(
+                /* @__PURE__ */ jsx69(Tooltip2, { formatter: (value) => value != null ? `${value}k` : "" }),
+                /* @__PURE__ */ jsx69(
                   Area,
                   {
                     type: "monotone",
@@ -6503,15 +6596,15 @@ var ChartComponent = ({
             ]
           }
         ),
-        showLegends && /* @__PURE__ */ jsx68("div", { className: isLegendRight ? "flex flex-col w-[30%] min-w-[180px] justify-center" : "w-full", children: renderLegends })
+        showLegends && /* @__PURE__ */ jsx69("div", { className: isLegendRight ? "flex flex-col w-[30%] min-w-[180px] justify-center" : "w-full", children: renderLegends })
       ]
     }
   );
 };
-var BarChart_default = React14.memo(ChartComponent);
+var BarChart_default = React15.memo(ChartComponent);
 
 // src/components/Chart/PieChart.tsx
-import React15, { useEffect as useEffect30, useMemo as useMemo12, useState as useState16 } from "react";
+import React16, { useEffect as useEffect31, useMemo as useMemo12, useState as useState17 } from "react";
 import axios5 from "axios";
 import {
   PieChart,
@@ -6520,7 +6613,7 @@ import {
   ResponsiveContainer as ResponsiveContainer2,
   Tooltip as Tooltip3
 } from "recharts";
-import { jsx as jsx69, jsxs as jsxs43 } from "react/jsx-runtime";
+import { jsx as jsx70, jsxs as jsxs44 } from "react/jsx-runtime";
 var getRandomColor = () => {
   const palette2 = [
     "#2563eb",
@@ -6601,11 +6694,11 @@ var DonutChart = ({
   const showLegends = props.showLegends ?? true;
   const canvasMode = props.canvasMode;
   const useApi = source === "api" && !!apiUrl;
-  const [rawData, setRawData] = useState16([]);
-  const [localLoading, setLocalLoading] = useState16(false);
+  const [rawData, setRawData] = useState17([]);
+  const [localLoading, setLocalLoading] = useState17(false);
   const effectiveData = useApi ? rawData : props.data || [];
   const effectiveLoading = useApi ? localLoading : externalLoading;
-  useEffect30(() => {
+  useEffect31(() => {
     if (!useApi) return;
     let cancelled = false;
     const fetchData = async () => {
@@ -6686,15 +6779,15 @@ var DonutChart = ({
     if (chartData.length <= 6) return { inner: 85, outer: 150 };
     return { inner: 70, outer: 130 };
   };
-  const [mounted, setMounted] = useState16(false);
-  useEffect30(() => {
+  const [mounted, setMounted] = useState17(false);
+  useEffect31(() => {
     const timeout = setTimeout(() => setMounted(true), 100);
     return () => clearTimeout(timeout);
   }, []);
   const renderLegends = useMemo12(() => {
     if (!showLegends) return null;
     const isLegendRight2 = !forceMobile && legendPosition === "right";
-    return /* @__PURE__ */ jsx69(
+    return /* @__PURE__ */ jsx70(
       "div",
       {
         className: isLegendRight2 ? "flex flex-col gap-2 w-full min-w-0 justify-start overflow-y-auto max-h-[260px]" : "flex flex-wrap justify-center gap-2 mt-4 w-full max-w-4xl",
@@ -6709,7 +6802,7 @@ var DonutChart = ({
             [dataLabel]: d[dataLabel],
             [dataKey]: actualValue
           };
-          return /* @__PURE__ */ jsxs43(
+          return /* @__PURE__ */ jsxs44(
             "div",
             {
               role: onLegendClick ? "button" : void 0,
@@ -6718,22 +6811,22 @@ var DonutChart = ({
               onKeyDown: onLegendClick ? (e) => e.key === "Enter" && onLegendClick(payload) : void 0,
               className: `flex items-center space-x-2 rounded-lg border border-gray-200/50 px-3 py-1.5 w-[48%] sm:w-[32%] md:w-auto bg-white/80 backdrop-blur-sm shadow-sm hover:shadow-md transition-all ${onLegendClick ? "cursor-pointer" : ""}`,
               children: [
-                /* @__PURE__ */ jsx69(
+                /* @__PURE__ */ jsx70(
                   "span",
                   {
                     className: "inline-block w-[12px] h-[12px] rounded-full shrink-0 border-2 border-white/50",
                     style: { backgroundColor: d.color }
                   }
                 ),
-                /* @__PURE__ */ jsxs43("div", { className: "min-w-0 flex-1", children: [
-                  /* @__PURE__ */ jsx69("span", { className: "text-gray-900 text-[11px] md:text-[13px] font-semibold block truncate leading-tight", children: d[dataLabel] }),
-                  /* @__PURE__ */ jsxs43("div", { className: "flex items-center gap-1 text-xs text-gray-600 font-medium", children: [
-                    /* @__PURE__ */ jsx69("span", { children: displayValue }),
-                    /* @__PURE__ */ jsxs43("span", { children: [
+                /* @__PURE__ */ jsxs44("div", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ jsx70("span", { className: "text-gray-900 text-[11px] md:text-[13px] font-semibold block truncate leading-tight", children: d[dataLabel] }),
+                  /* @__PURE__ */ jsxs44("div", { className: "flex items-center gap-1 text-xs text-gray-600 font-medium", children: [
+                    /* @__PURE__ */ jsx70("span", { children: displayValue }),
+                    /* @__PURE__ */ jsxs44("span", { children: [
                       (actualValue / total * 100).toFixed(1),
                       "%"
                     ] }),
-                    d.isBoosted && /* @__PURE__ */ jsx69("span", { className: "text-[9px] px-1 py-0.5 bg-blue-100 text-blue-700 rounded-full", children: "min" })
+                    d.isBoosted && /* @__PURE__ */ jsx70("span", { className: "text-[9px] px-1 py-0.5 bg-blue-100 text-blue-700 rounded-full", children: "min" })
                   ] })
                 ] })
               ]
@@ -6746,26 +6839,26 @@ var DonutChart = ({
   }, [chartData, data, dataLabel, dataKey, total, showLegends, onLegendClick, legendPosition, forceMobile]);
   if (!mounted) return null;
   if (effectiveLoading) {
-    return /* @__PURE__ */ jsxs43(
+    return /* @__PURE__ */ jsxs44(
       "div",
       {
         className: `relative flex flex-col items-center w-full h-[300px] md:h-[400px] bg-gradient-to-br from-gray-50 to-gray-100 rounded-xl p-6 ${className}`,
         style,
         children: [
-          /* @__PURE__ */ jsx69("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/60 to-transparent animate-shimmer rounded-xl" }),
-          /* @__PURE__ */ jsx69("div", { className: "mt-6 text-center", children: /* @__PURE__ */ jsxs43("div", { className: "inline-flex items-center space-x-2 bg-white/80 px-6 py-2 rounded-full backdrop-blur-sm border border-gray-200 shadow-lg", children: [
-            /* @__PURE__ */ jsx69("div", { className: "w-5 h-5 border-2 border-gray-300 border-t-blue-400 rounded-full animate-spin" }),
-            /* @__PURE__ */ jsx69("span", { className: "text-sm font-medium text-gray-600 bg-gradient-to-r from-gray-300 bg-clip-text animate-pulse", children: "Loading chart data..." })
+          /* @__PURE__ */ jsx70("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/60 to-transparent animate-shimmer rounded-xl" }),
+          /* @__PURE__ */ jsx70("div", { className: "mt-6 text-center", children: /* @__PURE__ */ jsxs44("div", { className: "inline-flex items-center space-x-2 bg-white/80 px-6 py-2 rounded-full backdrop-blur-sm border border-gray-200 shadow-lg", children: [
+            /* @__PURE__ */ jsx70("div", { className: "w-5 h-5 border-2 border-gray-300 border-t-blue-400 rounded-full animate-spin" }),
+            /* @__PURE__ */ jsx70("span", { className: "text-sm font-medium text-gray-600 bg-gradient-to-r from-gray-300 bg-clip-text animate-pulse", children: "Loading chart data..." })
           ] }) }),
-          /* @__PURE__ */ jsx69("div", { className: "flex flex-wrap justify-center gap-3 mt-8 w-full max-w-4xl", children: [...Array(18)].map((_, idx) => /* @__PURE__ */ jsxs43(
+          /* @__PURE__ */ jsx70("div", { className: "flex flex-wrap justify-center gap-3 mt-8 w-full max-w-4xl", children: [...Array(18)].map((_, idx) => /* @__PURE__ */ jsxs44(
             "div",
             {
               className: `h-10 w-[48%] sm:w-[32%] md:w-32 rounded-xl bg-gradient-to-r from-gray-200 via-gray-300/50 to-gray-200 p-3 flex items-center space-x-3 animate-slide-up stagger-${idx} shadow-sm border border-gray-200/50`,
               children: [
-                /* @__PURE__ */ jsx69("div", { className: "w-4 h-4 rounded-full bg-gradient-to-r from-blue-300 to-purple-300 animate-pulse" }),
-                /* @__PURE__ */ jsxs43("div", { className: "flex-1 space-y-1", children: [
-                  /* @__PURE__ */ jsx69("div", { className: "h-3 w-20 bg-gray-300 rounded animate-pulse" }),
-                  /* @__PURE__ */ jsx69("div", { className: "h-2.5 w-16 bg-gray-200/60 rounded animate-pulse-delayed" })
+                /* @__PURE__ */ jsx70("div", { className: "w-4 h-4 rounded-full bg-gradient-to-r from-blue-300 to-purple-300 animate-pulse" }),
+                /* @__PURE__ */ jsxs44("div", { className: "flex-1 space-y-1", children: [
+                  /* @__PURE__ */ jsx70("div", { className: "h-3 w-20 bg-gray-300 rounded animate-pulse" }),
+                  /* @__PURE__ */ jsx70("div", { className: "h-2.5 w-16 bg-gray-200/60 rounded animate-pulse-delayed" })
                 ] })
               ]
             },
@@ -6776,12 +6869,12 @@ var DonutChart = ({
     );
   }
   if (data.length === 0) {
-    return /* @__PURE__ */ jsx69(
+    return /* @__PURE__ */ jsx70(
       "div",
       {
         className: `relative flex flex-col items-center justify-center w-full h-[300px] md:h-[400px] bg-gradient-to-br from-gray-50 to-gray-100 rounded-xl p-6 ${className}`,
         style,
-        children: /* @__PURE__ */ jsx69("div", { className: "text-center", children: /* @__PURE__ */ jsx69("div", { className: "inline-flex items-center space-x-2 bg-white/80 px-6 py-3 rounded-xl backdrop-blur-sm border border-gray-200 shadow-lg", children: /* @__PURE__ */ jsx69("span", { className: "text-sm font-medium text-gray-600", children: "No data" }) }) })
+        children: /* @__PURE__ */ jsx70("div", { className: "text-center", children: /* @__PURE__ */ jsx70("div", { className: "inline-flex items-center space-x-2 bg-white/80 px-6 py-3 rounded-xl backdrop-blur-sm border border-gray-200 shadow-lg", children: /* @__PURE__ */ jsx70("span", { className: "text-sm font-medium text-gray-600", children: "No data" }) }) })
       }
     );
   }
@@ -6789,19 +6882,19 @@ var DonutChart = ({
   const innerRadius = inner;
   const outerRadius = outer;
   const isLegendRight = !forceMobile && legendPosition === "right";
-  return /* @__PURE__ */ jsxs43(
+  return /* @__PURE__ */ jsxs44(
     "div",
     {
       className: `relative flex ${isLegendRight ? "flex-row items-stretch gap-4" : "flex-col items-center"} ${className}`,
       style,
       children: [
-        /* @__PURE__ */ jsxs43(
+        /* @__PURE__ */ jsxs44(
           "div",
           {
             className: `relative flex items-center justify-center ${isLegendRight ? "flex-[2] min-w-0 max-w-[70%]" : "w-full md:w-[75%]"} h-[280px] md:h-[380px] ${isLegendRight ? "" : "mb-2"}`,
             children: [
-              /* @__PURE__ */ jsx69(ResponsiveContainer2, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs43(PieChart, { children: [
-                /* @__PURE__ */ jsx69(
+              /* @__PURE__ */ jsx70(ResponsiveContainer2, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs44(PieChart, { children: [
+                /* @__PURE__ */ jsx70(
                   Pie,
                   {
                     data: chartData,
@@ -6814,7 +6907,7 @@ var DonutChart = ({
                     isAnimationActive: true,
                     animationDuration: 800,
                     minAngle: 3,
-                    children: chartData.map((entry, index) => /* @__PURE__ */ jsx69(
+                    children: chartData.map((entry, index) => /* @__PURE__ */ jsx70(
                       Cell,
                       {
                         fill: entry.color,
@@ -6825,7 +6918,7 @@ var DonutChart = ({
                     ))
                   }
                 ),
-                /* @__PURE__ */ jsx69(
+                /* @__PURE__ */ jsx70(
                   Tooltip3,
                   {
                     formatter: (value, name, payload) => {
@@ -6848,25 +6941,25 @@ var DonutChart = ({
                   }
                 )
               ] }) }),
-              total > 0 && /* @__PURE__ */ jsx69("div", { className: `absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 text-center pointer-events-none ${forceMobile ? "text-xl px-2" : "text-3xl px-4"} font-bold bg-white/90 backdrop-blur-sm rounded-full py-1 shadow-lg`, children: /* @__PURE__ */ jsxs43("div", { className: "text-[#1f2937] leading-tight", children: [
+              total > 0 && /* @__PURE__ */ jsx70("div", { className: `absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 text-center pointer-events-none ${forceMobile ? "text-xl px-2" : "text-3xl px-4"} font-bold bg-white/90 backdrop-blur-sm rounded-full py-1 shadow-lg`, children: /* @__PURE__ */ jsxs44("div", { className: "text-[#1f2937] leading-tight", children: [
                 formattedTotal,
-                /* @__PURE__ */ jsx69("span", { className: "text-sm md:text-base font-normal text-gray-600 block md:inline-block md:ml-1", children: "total" })
+                /* @__PURE__ */ jsx70("span", { className: "text-sm md:text-base font-normal text-gray-600 block md:inline-block md:ml-1", children: "total" })
               ] }) })
             ]
           }
         ),
-        showLegends && /* @__PURE__ */ jsx69("div", { className: isLegendRight ? "flex flex-col w-[30%] min-w-[180px] justify-center" : "w-full", children: renderLegends })
+        showLegends && /* @__PURE__ */ jsx70("div", { className: isLegendRight ? "flex flex-col w-[30%] min-w-[180px] justify-center" : "w-full", children: renderLegends })
       ]
     }
   );
 };
-var PieChart_default = React15.memo(DonutChart);
+var PieChart_default = React16.memo(DonutChart);
 
 // src/components/Blocks/EmailComposer.tsx
-import { jsx as jsx70, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx71, jsxs as jsxs45 } from "react/jsx-runtime";
 function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc, setShowBcc, cc, setCc, bcc, setBcc, subject, setSubject, body, setBody }) {
-  return /* @__PURE__ */ jsx70("div", { className, style, children: /* @__PURE__ */ jsxs44("div", { className: "border rounded-md shadow bg-[#fff] p-4 mx-auto z-[50] relative", children: [
-    /* @__PURE__ */ jsx70("div", { className: "mb-3", children: /* @__PURE__ */ jsx70(
+  return /* @__PURE__ */ jsx71("div", { className, style, children: /* @__PURE__ */ jsxs45("div", { className: "border rounded-md shadow bg-[#fff] p-4 mx-auto z-[50] relative", children: [
+    /* @__PURE__ */ jsx71("div", { className: "mb-3", children: /* @__PURE__ */ jsx71(
       "input",
       {
         type: "email",
@@ -6875,8 +6968,8 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         required: true
       }
     ) }),
-    /* @__PURE__ */ jsx70("div", { className: "mb-3", children: /* @__PURE__ */ jsxs44("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx70(
+    /* @__PURE__ */ jsx71("div", { className: "mb-3", children: /* @__PURE__ */ jsxs45("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx71(
         "input",
         {
           type: "email",
@@ -6887,7 +6980,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
           required: true
         }
       ),
-      !showCc && /* @__PURE__ */ jsx70(
+      !showCc && /* @__PURE__ */ jsx71(
         "button",
         {
           onClick: () => setShowCc?.(true),
@@ -6895,7 +6988,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
           children: "Cc"
         }
       ),
-      !showBcc && /* @__PURE__ */ jsx70(
+      !showBcc && /* @__PURE__ */ jsx71(
         "button",
         {
           onClick: () => setShowBcc?.(true),
@@ -6904,7 +6997,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         }
       )
     ] }) }),
-    showCc && /* @__PURE__ */ jsx70("div", { className: "mb-3", children: /* @__PURE__ */ jsx70(
+    showCc && /* @__PURE__ */ jsx71("div", { className: "mb-3", children: /* @__PURE__ */ jsx71(
       "input",
       {
         type: "text",
@@ -6914,7 +7007,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]"
       }
     ) }),
-    showBcc && /* @__PURE__ */ jsx70("div", { className: "mb-3", children: /* @__PURE__ */ jsx70(
+    showBcc && /* @__PURE__ */ jsx71("div", { className: "mb-3", children: /* @__PURE__ */ jsx71(
       "input",
       {
         type: "text",
@@ -6924,7 +7017,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]"
       }
     ) }),
-    /* @__PURE__ */ jsx70("div", { className: "mb-3", children: /* @__PURE__ */ jsx70(
+    /* @__PURE__ */ jsx71("div", { className: "mb-3", children: /* @__PURE__ */ jsx71(
       "input",
       {
         type: "text",
@@ -6934,11 +7027,11 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]"
       }
     ) }),
-    /* @__PURE__ */ jsx70("div", { className: "mb-4", children: /* @__PURE__ */ jsx70(MyEditor, { value: body, onChange: setBody }) }),
-    /* @__PURE__ */ jsxs44("div", { className: "flex justify-end gap-2", children: [
-      /* @__PURE__ */ jsx70("button", { className: "px-4 py-2 rounded-md text-gray-600 hover:bg-gray-100", children: "Discard" }),
-      /* @__PURE__ */ jsx70("button", { className: "px-4 py-2 rounded-md border text-[#12715B] border-[#12715B]", children: "Reset" }),
-      /* @__PURE__ */ jsx70("button", { className: "px-4 py-2 rounded-md bg-[#12715B] text-white", children: "Send" })
+    /* @__PURE__ */ jsx71("div", { className: "mb-4", children: /* @__PURE__ */ jsx71(MyEditor, { value: body, onChange: setBody }) }),
+    /* @__PURE__ */ jsxs45("div", { className: "flex justify-end gap-2", children: [
+      /* @__PURE__ */ jsx71("button", { className: "px-4 py-2 rounded-md text-gray-600 hover:bg-gray-100", children: "Discard" }),
+      /* @__PURE__ */ jsx71("button", { className: "px-4 py-2 rounded-md border text-[#12715B] border-[#12715B]", children: "Reset" }),
+      /* @__PURE__ */ jsx71("button", { className: "px-4 py-2 rounded-md bg-[#12715B] text-white", children: "Send" })
     ] })
   ] }) });
 }
@@ -6946,10 +7039,10 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
 // src/components/ui/sonner.tsx
 import { useTheme } from "next-themes";
 import { Toaster as Sonner } from "sonner";
-import { jsx as jsx71 } from "react/jsx-runtime";
+import { jsx as jsx72 } from "react/jsx-runtime";
 var Toaster = ({ ...props }) => {
   const { theme = "system" } = useTheme();
-  return /* @__PURE__ */ jsx71(
+  return /* @__PURE__ */ jsx72(
     Sonner,
     {
       theme,
@@ -6966,6 +7059,7 @@ var Toaster = ({ ...props }) => {
 export {
   Accordion_default as Accordion,
   AccordionGroup_default as AccordionGroup,
+  Audio_default as Audio,
   BarChart_default as BarChart,
   Breadcrumb_default as Breadcrumb,
   Button_default as Button,