warqadui 0.0.47 → 0.0.48

package/dist/index.js

@@ -72,6 +72,7 @@ __export(index_exports, {
   generatePdf: () => generatePdf,
   storage: () => storage,
   useA4StatementView: () => useA4DataView_default,
+  useAntdImageUpload: () => useAntdImageUpload_default,
   useApi: () => useApis_default,
   useModal: () => useModal,
   useSearchApiContext: () => useSearchApiContext,
@@ -1142,17 +1143,12 @@ var useModal = (initialState = false) => {
   };
 };
 
-// src/hooks/uploads/useAntdImageUpload.tsx
-var import_react8 = require("react");
-var import_antd = require("antd");
-var import_jsx_runtime17 = require("react/jsx-runtime");
-
 // src/components/Fields/Input.tsx
-var import_react9 = require("react");
+var import_react8 = require("react");
 var import_lucide_react6 = require("lucide-react");
 var import_react_hook_form = require("react-hook-form");
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var Input = (0, import_react9.forwardRef)(
+var import_jsx_runtime17 = require("react/jsx-runtime");
+var Input = (0, import_react8.forwardRef)(
   ({
     label,
     icon,
@@ -1167,11 +1163,11 @@ var Input = (0, import_react9.forwardRef)(
     variant = "default",
     ...props
   }, ref) => {
-    const [isFocused, setIsFocused] = (0, import_react9.useState)(false);
-    const [showPassword, setShowPassword] = (0, import_react9.useState)(false);
+    const [isFocused, setIsFocused] = (0, import_react8.useState)(false);
+    const [showPassword, setShowPassword] = (0, import_react8.useState)(false);
     const { theme } = useWarqadConfig();
     const primaryColor = theme?.primaryColor;
-    (0, import_react9.useEffect)(() => {
+    (0, import_react8.useEffect)(() => {
       if (form && name && props.value !== void 0 && props.value !== null && props.value !== "") {
         const currentFormValue = form.getValues(name);
         if (currentFormValue === void 0 || currentFormValue === "" || currentFormValue === 0) {
@@ -1187,17 +1183,17 @@ var Input = (0, import_react9.forwardRef)(
       const errorObj = name.split(".").reduce((acc, current) => acc?.[current], errors);
       message = errorObj?.message;
     }
-    (0, import_react9.useEffect)(() => {
+    (0, import_react8.useEffect)(() => {
       if (form && name) {
         form.clearErrors("root");
       }
     }, [form?.watch(name)]);
-    const renderInput = (inputProps, localType = type || "text") => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+    const renderInput = (inputProps, localType = type || "text") => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
       "div",
       {
         className: `${label ? "space-y-2" : ""} group relative ${containerClassName} `,
         children: [
-          label && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+          label && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
             "label",
             {
               htmlFor: props.id,
@@ -1205,12 +1201,12 @@ var Input = (0, import_react9.forwardRef)(
               style: { color: isFocused ? primaryColor : void 0 },
               children: [
                 label,
-                props.required && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
+                props.required && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
               ]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "relative", children: [
-            icon && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "absolute inset-y-0 left-0 pl-2.5 flex items-center pointer-events-none", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "relative", children: [
+            icon && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "absolute inset-y-0 left-0 pl-2.5 flex items-center pointer-events-none", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
               "div",
               {
                 className: `transition-colors duration-200`,
@@ -1218,7 +1214,7 @@ var Input = (0, import_react9.forwardRef)(
                 children: icon
               }
             ) }),
-            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
               "input",
               {
                 ref,
@@ -1240,23 +1236,23 @@ var Input = (0, import_react9.forwardRef)(
                 type: localType === "password" ? showPassword ? "text" : "password" : localType
               }
             ),
-            type === "password" && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            type === "password" && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
               "button",
               {
                 type: "button",
                 onClick: () => setShowPassword(!showPassword),
                 className: "absolute inset-y-0 right-0 pr-2.5 flex items-center text-gray-400 hover:text-gray-600 dark:hover:text-gray-200 transition-colors focus:outline-none cursor-pointer",
                 tabIndex: -1,
-                children: showPassword ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react6.EyeOff, { className: "h-5 w-5" }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react6.Eye, { className: "h-5 w-5" })
+                children: showPassword ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react6.EyeOff, { className: "h-5 w-5" }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react6.Eye, { className: "h-5 w-5" })
               }
             )
           ] }),
-          message && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
+          message && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
         ]
       }
     );
     if (form && name && type === "number") {
-      return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         import_react_hook_form.Controller,
         {
           control: form.control,
@@ -1345,12 +1341,12 @@ var Input = (0, import_react9.forwardRef)(
 );
 
 // src/components/Fields/PhoneInput.tsx
-var import_react10 = require("react");
+var import_react9 = require("react");
 var import_react_phone_number_input = __toESM(require("react-phone-number-input"));
 var import_style = require("react-phone-number-input/style.css");
 var import_react_hook_form2 = require("react-hook-form");
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var PhoneInput = (0, import_react10.forwardRef)(
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var PhoneInput = (0, import_react9.forwardRef)(
   ({
     label,
     icon,
@@ -1363,7 +1359,7 @@ var PhoneInput = (0, import_react10.forwardRef)(
     className = "",
     ...props
   }, ref) => {
-    const [isFocused, setIsFocused] = (0, import_react10.useState)(false);
+    const [isFocused, setIsFocused] = (0, import_react9.useState)(false);
     const { theme } = useWarqadConfig();
     const primaryColor = theme?.primaryColor;
     let message = error;
@@ -1378,8 +1374,8 @@ var PhoneInput = (0, import_react10.forwardRef)(
       }
       message = currentError?.message || message;
     }
-    const renderInput = (onChangeHandler, currentValue) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: `space-y-2 group relative ${containerClassName}`, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+    const renderInput = (onChangeHandler, currentValue) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: `space-y-2 group relative ${containerClassName}`, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
         "label",
         {
           className: `block text-xs font-medium transition-colors duration-200`,
@@ -1388,12 +1384,12 @@ var PhoneInput = (0, import_react10.forwardRef)(
           },
           children: [
             label,
-            props.required && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
+            props.required && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "relative", children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "absolute inset-y-0 left-0 pl-2.5 flex items-center pointer-events-none z-10", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "relative", children: [
+        icon && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "absolute inset-y-0 left-0 pl-2.5 flex items-center pointer-events-none z-10", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
           "div",
           {
             className: `transition-colors duration-200`,
@@ -1401,7 +1397,7 @@ var PhoneInput = (0, import_react10.forwardRef)(
             children: icon
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
           import_react_phone_number_input.default,
           {
             ref,
@@ -1421,10 +1417,10 @@ var PhoneInput = (0, import_react10.forwardRef)(
           }
         )
       ] }),
-      message && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
+      message && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
     ] });
     if (form && name) {
-      return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         import_react_hook_form2.Controller,
         {
           name,
@@ -1443,21 +1439,21 @@ var PhoneInput = (0, import_react10.forwardRef)(
 PhoneInput.displayName = "PhoneInput";
 
 // src/components/Fields/select.tsx
-var import_react11 = __toESM(require("react"));
+var import_react10 = __toESM(require("react"));
 var import_react_dom = require("react-dom");
 var import_lucide_react7 = require("lucide-react");
 var import_react_hook_form3 = require("react-hook-form");
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var SelectContext = (0, import_react11.createContext)(void 0);
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var SelectContext = (0, import_react10.createContext)(void 0);
 var useSelectContext = () => {
-  const context = (0, import_react11.useContext)(SelectContext);
+  const context = (0, import_react10.useContext)(SelectContext);
   if (!context)
     throw new Error("Select components must be used within a SelectProvider");
   return context;
 };
-var Select = (0, import_react11.forwardRef)((props, ref) => {
+var Select = (0, import_react10.forwardRef)((props, ref) => {
   const { form, name, onChange, value, children, options = [] } = props;
-  (0, import_react11.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (form && name && value !== void 0 && value !== null && value !== "") {
       const currentFormValue = form.getValues(name);
       if (currentFormValue === void 0 || currentFormValue === "" || currentFormValue === 0) {
@@ -1466,7 +1462,7 @@ var Select = (0, import_react11.forwardRef)((props, ref) => {
     }
   }, [value, name, form]);
   if (form && name) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       import_react_hook_form3.Controller,
       {
         name,
@@ -1478,7 +1474,7 @@ var Select = (0, import_react11.forwardRef)((props, ref) => {
             ref: fieldRef,
             onBlur
           }
-        }) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        }) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
           SelectRoot,
           {
             ...props,
@@ -1495,7 +1491,7 @@ var Select = (0, import_react11.forwardRef)((props, ref) => {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     SelectRoot,
     {
       ...props,
@@ -1528,15 +1524,15 @@ var SelectRoot = ({
   className = "",
   ...props
 }) => {
-  const [isOpen, setIsOpen] = (0, import_react11.useState)(false);
-  const [isFocused, setIsFocused] = (0, import_react11.useState)(false);
-  const [activeIndex, setActiveIndex] = (0, import_react11.useState)(-1);
-  const [registeredOptions, setRegisteredOptions] = (0, import_react11.useState)([]);
+  const [isOpen, setIsOpen] = (0, import_react10.useState)(false);
+  const [isFocused, setIsFocused] = (0, import_react10.useState)(false);
+  const [activeIndex, setActiveIndex] = (0, import_react10.useState)(-1);
+  const [registeredOptions, setRegisteredOptions] = (0, import_react10.useState)([]);
   const { theme } = useWarqadConfig();
   const primaryColor = theme?.primaryColor;
-  const containerRef = (0, import_react11.useRef)(null);
-  const dropdownAnchorRef = (0, import_react11.useRef)(null);
-  const dropdownContentRef = (0, import_react11.useRef)(null);
+  const containerRef = (0, import_react10.useRef)(null);
+  const dropdownAnchorRef = (0, import_react10.useRef)(null);
+  const dropdownContentRef = (0, import_react10.useRef)(null);
   const registerOption = (opt) => {
     setRegisteredOptions((prev) => {
       const index = prev.findIndex((p) => p.value === opt.value);
@@ -1558,7 +1554,7 @@ var SelectRoot = ({
       form.clearErrors(name);
     }
   };
-  (0, import_react11.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     const handleClickOutside = (event) => {
       const target = event.target;
       if (containerRef.current && !containerRef.current.contains(target) && !(dropdownContentRef.current && dropdownContentRef.current.contains(target))) {
@@ -1601,26 +1597,26 @@ var SelectRoot = ({
     fieldInternalProps,
     disabled
   };
-  const hasChildren = import_react11.default.Children.count(children) > 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectContext.Provider, { value: valueCtx, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+  const hasChildren = import_react10.default.Children.count(children) > 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(SelectContext.Provider, { value: valueCtx, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "div",
     {
       ref: containerRef,
       className: `${label ? "space-y-2" : ""} group relative ${containerClassName}`,
       children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
           "label",
           {
             className: `block text-xs font-medium transition-colors duration-200`,
             style: { color: isFocused || isOpen ? primaryColor : void 0 },
             children: [
               label,
-              required && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
+              required && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
             ]
           }
         ),
-        hasChildren ? children : /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        hasChildren ? children : /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             SelectTrigger,
             {
               id,
@@ -1631,7 +1627,7 @@ var SelectRoot = ({
               ...props
             }
           ),
-          allOptions && allOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectContent, { children: allOptions.map((opt, index) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          allOptions && allOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(SelectContent, { children: allOptions.map((opt, index) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             SelectItem,
             {
               value: opt.value,
@@ -1641,12 +1637,12 @@ var SelectRoot = ({
             String(opt.value) || index
           )) })
         ] }),
-        message && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
+        message && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
       ]
     }
   ) });
 };
-var SelectTrigger = (0, import_react11.forwardRef)(
+var SelectTrigger = (0, import_react10.forwardRef)(
   ({
     className = "",
     variant = "default",
@@ -1670,10 +1666,10 @@ var SelectTrigger = (0, import_react11.forwardRef)(
       fieldInternalProps,
       disabled
     } = useSelectContext();
-    const lastFocusTime = (0, import_react11.useRef)(0);
+    const lastFocusTime = (0, import_react10.useRef)(0);
     const displayOption = options.find((o) => o.value === selectedValue);
     const displayValue = displayOption ? displayOption.label : selectedValue != null && selectedValue !== "" ? String(selectedValue) : placeholder;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "relative", ref: dropdownAnchorRef, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "relative", ref: dropdownAnchorRef, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       "div",
       {
         id,
@@ -1722,8 +1718,8 @@ var SelectTrigger = (0, import_react11.forwardRef)(
           }
         },
         ...props,
-        children: children ? children : /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
-          icon && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        children: children ? children : /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+          icon && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             "div",
             {
               className: `pl-2.5 pr-2 flex items-center transition-colors duration-200`,
@@ -1733,14 +1729,14 @@ var SelectTrigger = (0, import_react11.forwardRef)(
               children: icon
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             "div",
             {
               className: `flex-1 truncate text-sm ${icon ? "" : "pl-2.5"} ${!selectedValue && selectedValue !== 0 && selectedValue !== false ? "text-gray-400 dark:text-zinc-500" : ""}`,
               children: displayValue
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "pr-2.5 flex items-center gap-1 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "pr-2.5 flex items-center gap-1 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             import_lucide_react7.ChevronDown,
             {
               className: `h-4 w-4 text-gray-400 transition-transform ${isOpen ? "rotate-180" : ""}`
@@ -1752,10 +1748,10 @@ var SelectTrigger = (0, import_react11.forwardRef)(
   }
 );
 SelectTrigger.displayName = "SelectTrigger";
-var SelectContent = (0, import_react11.forwardRef)(
+var SelectContent = (0, import_react10.forwardRef)(
   ({ children, className = "", style, ...props }, ref) => {
     const { isOpen, setIsOpen, dropdownAnchorRef, dropdownContentRef } = useSelectContext();
-    const [dropdownStyle, setDropdownStyle] = (0, import_react11.useState)({});
+    const [dropdownStyle, setDropdownStyle] = (0, import_react10.useState)({});
     const updateDropdownPosition = () => {
       if (dropdownAnchorRef.current) {
         const rect = dropdownAnchorRef.current.getBoundingClientRect();
@@ -1773,7 +1769,7 @@ var SelectContent = (0, import_react11.forwardRef)(
         setDropdownStyle(newStyle);
       }
     };
-    (0, import_react11.useEffect)(() => {
+    (0, import_react10.useEffect)(() => {
       if (isOpen) {
         updateDropdownPosition();
         window.addEventListener("scroll", updateDropdownPosition, true);
@@ -1786,7 +1782,7 @@ var SelectContent = (0, import_react11.forwardRef)(
     }, [isOpen]);
     if (!isOpen || typeof document === "undefined") return null;
     return (0, import_react_dom.createPortal)(
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         "div",
         {
           ref: dropdownContentRef,
@@ -1794,7 +1790,7 @@ var SelectContent = (0, import_react11.forwardRef)(
           style: { ...dropdownStyle, ...style },
           onMouseDown: (e) => e.stopPropagation(),
           ...props,
-          children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex flex-col gap-0.5", children: import_react11.default.Children.count(children) === 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "p-3 text-center text-sm text-gray-500", children: "No options available" }) : children })
+          children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex flex-col gap-0.5", children: import_react10.default.Children.count(children) === 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "p-3 text-center text-sm text-gray-500", children: "No options available" }) : children })
         }
       ),
       document.body
@@ -1802,7 +1798,7 @@ var SelectContent = (0, import_react11.forwardRef)(
   }
 );
 SelectContent.displayName = "SelectContent";
-var SelectItem = (0, import_react11.forwardRef)(
+var SelectItem = (0, import_react10.forwardRef)(
   ({ value, label, disabled, children, className = "", ...props }, ref) => {
     const {
       selectedValue,
@@ -1814,7 +1810,7 @@ var SelectItem = (0, import_react11.forwardRef)(
     } = useSelectContext();
     const isSelected = selectedValue === value;
     const displayLabel = label || children || value;
-    (0, import_react11.useEffect)(() => {
+    (0, import_react10.useEffect)(() => {
       if (value !== void 0) {
         registerOption({ value, label: String(displayLabel), disabled });
       }
@@ -1825,7 +1821,7 @@ var SelectItem = (0, import_react11.forwardRef)(
       setIsOpen(false);
       fieldInternalProps?.onBlur?.();
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
       "button",
       {
         ref,
@@ -1841,8 +1837,8 @@ var SelectItem = (0, import_react11.forwardRef)(
         },
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "whitespace-nowrap truncate flex-1", children: children || label }),
-          isSelected && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "whitespace-nowrap truncate flex-1", children: children || label }),
+          isSelected && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             import_lucide_react7.Check,
             {
               className: "h-4 w-4 shrink-0 ml-2",
@@ -1857,10 +1853,10 @@ var SelectItem = (0, import_react11.forwardRef)(
 SelectItem.displayName = "SelectItem";
 
 // src/components/Fields/textArea.tsx
-var import_react12 = require("react");
+var import_react11 = require("react");
 var import_react_hook_form4 = require("react-hook-form");
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var Textarea = (0, import_react12.forwardRef)(
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var Textarea = (0, import_react11.forwardRef)(
   ({
     label,
     error,
@@ -1872,7 +1868,7 @@ var Textarea = (0, import_react12.forwardRef)(
     className = "",
     ...props
   }, ref) => {
-    const [isFocused, setIsFocused] = (0, import_react12.useState)(false);
+    const [isFocused, setIsFocused] = (0, import_react11.useState)(false);
     const { theme } = useWarqadConfig();
     const primaryColor = theme?.primaryColor;
     let message = error;
@@ -1883,8 +1879,8 @@ var Textarea = (0, import_react12.forwardRef)(
       const errorObj = name.split(".").reduce((acc, current) => acc?.[current], errors);
       message = errorObj?.message;
     }
-    const renderInput = (inputProps, ref2) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: `space-y-2 group w-full! relative ${containerClassName}`, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+    const renderInput = (inputProps, ref2) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: `space-y-2 group w-full! relative ${containerClassName}`, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
         "label",
         {
           htmlFor: props.id,
@@ -1892,11 +1888,11 @@ var Textarea = (0, import_react12.forwardRef)(
           style: { color: isFocused ? primaryColor : void 0 },
           children: [
             label,
-            props.required && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
+            props.required && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         "textarea",
         {
           ref: ref2,
@@ -1917,9 +1913,9 @@ var Textarea = (0, import_react12.forwardRef)(
           ...inputProps
         }
       ) }),
-      message && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
+      message && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
     ] });
-    (0, import_react12.useEffect)(() => {
+    (0, import_react11.useEffect)(() => {
       if (form && name && props.value !== void 0 && props.value !== null && props.value !== "") {
         const currentFormValue = form.getValues(name);
         if (currentFormValue === void 0 || currentFormValue === "" || currentFormValue === 0) {
@@ -1928,7 +1924,7 @@ var Textarea = (0, import_react12.forwardRef)(
       }
     }, [props.value, name, form]);
     if (form && name) {
-      return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         import_react_hook_form4.Controller,
         {
           control: form.control,
@@ -1964,26 +1960,26 @@ var Textarea = (0, import_react12.forwardRef)(
 );
 
 // src/components/Fields/searchApi.tsx
-var import_react14 = require("react");
+var import_react13 = require("react");
 var import_react_dom2 = require("react-dom");
 var import_lucide_react8 = require("lucide-react");
 
 // src/hooks/Fetches/useApis.tsx
-var import_react13 = require("react");
+var import_react12 = require("react");
 var import_axios = __toESM(require("axios"));
 var useApi = () => {
   const { api: configApi } = useWarqadConfig();
-  const api = (0, import_react13.useMemo)(() => {
+  const api = (0, import_react12.useMemo)(() => {
     const baseURL = configApi || "/api";
     return import_axios.default.create({
       baseURL,
       withCredentials: true
     });
   }, [configApi]);
-  const [data, setData] = (0, import_react13.useState)();
-  const [isLoading, setIsLoading] = (0, import_react13.useState)(false);
-  const [pdfLoading, setPdfLoading] = (0, import_react13.useState)(false);
-  const [error, setError] = (0, import_react13.useState)(null);
+  const [data, setData] = (0, import_react12.useState)();
+  const [isLoading, setIsLoading] = (0, import_react12.useState)(false);
+  const [pdfLoading, setPdfLoading] = (0, import_react12.useState)(false);
+  const [error, setError] = (0, import_react12.useState)(null);
   const get = async ({ url, v = 1, params, delay }) => {
     setIsLoading(true);
     try {
@@ -2135,22 +2131,22 @@ var useApis_default = useApi;
 
 // src/components/Fields/searchApi.tsx
 var import_react_hook_form5 = require("react-hook-form");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var SearchApiContext = (0, import_react14.createContext)(
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var SearchApiContext = (0, import_react13.createContext)(
   void 0
 );
 var useSearchApiContext = () => {
-  const context = (0, import_react14.useContext)(SearchApiContext);
+  const context = (0, import_react13.useContext)(SearchApiContext);
   if (!context)
     throw new Error(
       "SearchApi components must be used within a SearchApiProvider"
     );
   return context;
 };
-var SearchApi = (0, import_react14.forwardRef)(
+var SearchApi = (0, import_react13.forwardRef)(
   (props, _) => {
     const { form, name, onChange, onSelect, onClear, value, children, ...restProps } = props;
-    (0, import_react14.useEffect)(() => {
+    (0, import_react13.useEffect)(() => {
       if (form && name && value !== void 0 && value !== null && value !== "") {
         const currentFormValue = form.getValues(name);
         if (currentFormValue === void 0 || currentFormValue === "" || currentFormValue === 0) {
@@ -2159,12 +2155,12 @@ var SearchApi = (0, import_react14.forwardRef)(
       }
     }, [value, name, form]);
     if (form && name) {
-      return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         import_react_hook_form5.Controller,
         {
           name,
           control: form.control,
-          render: ({ field }) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          render: ({ field }) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
             SearchApiRoot,
             {
               ...restProps,
@@ -2184,7 +2180,7 @@ var SearchApi = (0, import_react14.forwardRef)(
         }
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       SearchApiRoot,
       {
         ...restProps,
@@ -2227,20 +2223,20 @@ var SearchApiRoot = ({
   className = "",
   ...props
 }) => {
-  const [searchTerm, setSearchTerm] = (0, import_react14.useState)("");
+  const [searchTerm, setSearchTerm] = (0, import_react13.useState)("");
   const { theme } = useWarqadConfig();
   const primaryColor = theme?.primaryColor;
-  const [options, setOptions] = (0, import_react14.useState)([]);
-  const [isOpen, setIsOpen] = (0, import_react14.useState)(false);
-  const [isFocused, setIsFocused] = (0, import_react14.useState)(false);
-  const [activeIndex, setActiveIndex] = (0, import_react14.useState)(-1);
-  const [selectedObject, setSelectedObject] = (0, import_react14.useState)(void 0);
-  const [hasAttemptedHydration, setHasAttemptedHydration] = (0, import_react14.useState)(false);
-  const containerRef = (0, import_react14.useRef)(null);
-  const dropdownAnchorRef = (0, import_react14.useRef)(null);
-  const dropdownContentRef = (0, import_react14.useRef)(null);
-  const inputRef = (0, import_react14.useRef)(null);
-  const prevApiRef = (0, import_react14.useRef)(api);
+  const [options, setOptions] = (0, import_react13.useState)([]);
+  const [isOpen, setIsOpen] = (0, import_react13.useState)(false);
+  const [isFocused, setIsFocused] = (0, import_react13.useState)(false);
+  const [activeIndex, setActiveIndex] = (0, import_react13.useState)(-1);
+  const [selectedObject, setSelectedObject] = (0, import_react13.useState)(void 0);
+  const [hasAttemptedHydration, setHasAttemptedHydration] = (0, import_react13.useState)(false);
+  const containerRef = (0, import_react13.useRef)(null);
+  const dropdownAnchorRef = (0, import_react13.useRef)(null);
+  const dropdownContentRef = (0, import_react13.useRef)(null);
+  const inputRef = (0, import_react13.useRef)(null);
+  const prevApiRef = (0, import_react13.useRef)(api);
   const { get, isLoading, error: errorMessage } = useApis_default();
   const fetchOptions = async (query) => {
     try {
@@ -2272,7 +2268,7 @@ var SearchApiRoot = ({
       setOptions([]);
     }
   };
-  (0, import_react14.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     const timer = setTimeout(() => {
       if (isOpen) {
         fetchOptions(searchTerm);
@@ -2280,12 +2276,12 @@ var SearchApiRoot = ({
     }, 300);
     return () => clearTimeout(timer);
   }, [searchTerm, api, isOpen]);
-  (0, import_react14.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (isOpen && options.length === 0) {
       fetchOptions("");
     }
   }, [isOpen]);
-  (0, import_react14.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (currentValue !== void 0 && currentValue !== null && currentValue !== "" && !selectedObject) {
       setHasAttemptedHydration(false);
       fetchOptions(currentValue).finally(() => {
@@ -2302,7 +2298,7 @@ var SearchApiRoot = ({
     }
     return option[valueKey];
   };
-  (0, import_react14.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (currentValue !== void 0 && currentValue !== null && currentValue !== "" && !selectedObject && options.length > 0) {
       const found = options.find((o) => getOptionValue(o) === currentValue);
       if (found) {
@@ -2316,7 +2312,7 @@ var SearchApiRoot = ({
       }
     }
   }, [currentValue, options, obj]);
-  (0, import_react14.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (prevApiRef.current !== api) {
       prevApiRef.current = api;
       setSearchTerm("");
@@ -2341,7 +2337,7 @@ var SearchApiRoot = ({
       fetchOptions("");
     }
   }, [api, name, obj]);
-  (0, import_react14.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     const handleClickOutside = (event) => {
       const target = event.target;
       if (containerRef.current && !containerRef.current.contains(target) && !(dropdownContentRef.current && dropdownContentRef.current.contains(target))) {
@@ -2452,26 +2448,26 @@ var SearchApiRoot = ({
     onClear
   };
   const hasChildren = !!children;
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SearchApiContext.Provider, { value: valueCtx, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SearchApiContext.Provider, { value: valueCtx, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
     "div",
     {
       ref: containerRef,
       className: `${label ? "space-y-2" : ""} group relative ${containerClassName}`,
       children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
           "label",
           {
             className: `block text-xs font-medium transition-colors duration-200`,
             style: { color: isFocused || isOpen ? primaryColor : void 0 },
             children: [
               label,
-              required && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
+              required && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
             ]
           }
         ),
-        hasChildren ? children : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SearchApiTrigger, { className, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SearchApiInput, { ...props }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SearchApiContent, { children: filteredOptions.map((opt, index) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        hasChildren ? children : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SearchApiTrigger, { className, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SearchApiInput, { ...props }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SearchApiContent, { children: filteredOptions.map((opt, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
             SearchApiItem,
             {
               option: opt,
@@ -2484,7 +2480,7 @@ var SearchApiRoot = ({
     }
   ) });
 };
-var SearchApiTrigger = (0, import_react14.forwardRef)(
+var SearchApiTrigger = (0, import_react13.forwardRef)(
   ({ className = "", children, ...props }, ref) => {
     const {
       isOpen,
@@ -2501,7 +2497,7 @@ var SearchApiTrigger = (0, import_react14.forwardRef)(
       inputRef,
       searchTerm
     } = useSearchApiContext();
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "relative", ref: dropdownAnchorRef, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "relative", ref: dropdownAnchorRef, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
       "div",
       {
         className: `flex items-center w-full px-0 text-gray-900 dark:text-white transition-all duration-200 cursor-text py-1 ${variant === "ghost" ? "bg-transparent border-transparent shadow-none px-0 h-full" : isFocused || isOpen ? "ring-2 bg-white dark:bg-zinc-900 border rounded-xl h-9" : "border-gray-200 dark:border-zinc-800 border rounded-xl bg-white dark:bg-zinc-900/50 h-9"} ${className}`,
@@ -2518,25 +2514,25 @@ var SearchApiTrigger = (0, import_react14.forwardRef)(
         },
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
             "div",
             {
               className: `${variant === "ghost" ? "pl-0" : "pl-2.5"} text-gray-400`,
-              children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react8.Search, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react8.Search, { className: "h-4 w-4" })
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex-1 relative ms-2", children }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "pr-2.5 w-16! flex items-center gap-1 shrink-0 min-w-10 justify-end", children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react8.Loader2, { className: "h-4 w-4 animate-spin text-blue-500 shrink-0" }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-1", children: [
-            selectedValue && !disabled && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex-1 relative ms-2", children }),
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "pr-2.5 w-16! flex items-center gap-1 shrink-0 min-w-10 justify-end", children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react8.Loader2, { className: "h-4 w-4 animate-spin text-blue-500 shrink-0" }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-1", children: [
+            selectedValue && !disabled && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
               "button",
               {
                 onClick: clearSelection,
                 type: "button",
                 className: "p-0.5 hover:bg-gray-200 dark:hover:bg-zinc-700 rounded-full text-gray-400 hover:text-gray-600 dark:hover:text-gray-300",
-                children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react8.X, { className: "h-3 w-3" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react8.X, { className: "h-3 w-3" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
               import_lucide_react8.ChevronDown,
               {
                 className: `h-4 w-4 text-gray-400 transition-transform ${isOpen ? "rotate-180" : ""}`
@@ -2549,7 +2545,7 @@ var SearchApiTrigger = (0, import_react14.forwardRef)(
   }
 );
 SearchApiTrigger.displayName = "SearchApiTrigger";
-var SearchApiInput = (0, import_react14.forwardRef)(
+var SearchApiInput = (0, import_react13.forwardRef)(
   ({ className = "", ...props }, ref) => {
     const {
       isOpen,
@@ -2616,9 +2612,9 @@ var SearchApiInput = (0, import_react14.forwardRef)(
           break;
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-      !isOpen && (selectedValue !== void 0 && selectedValue !== null && selectedValue !== "") && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "absolute inset-0 flex items-center ms-1 truncate select-none", children: getDisplayValue() }),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+      !isOpen && (selectedValue !== void 0 && selectedValue !== null && selectedValue !== "") && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute inset-0 flex items-center ms-1 truncate select-none", children: getDisplayValue() }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "input",
         {
           ref: setInternalInputRef,
@@ -2661,7 +2657,7 @@ var SearchApiInput = (0, import_react14.forwardRef)(
   }
 );
 SearchApiInput.displayName = "SearchApiInput";
-var SearchApiContent = (0, import_react14.forwardRef)(
+var SearchApiContent = (0, import_react13.forwardRef)(
   ({ children, className = "", style, ...props }, ref) => {
     const {
       isOpen,
@@ -2673,7 +2669,7 @@ var SearchApiContent = (0, import_react14.forwardRef)(
       options,
       error
     } = useSearchApiContext();
-    const [dropdownStyle, setDropdownStyle] = (0, import_react14.useState)({});
+    const [dropdownStyle, setDropdownStyle] = (0, import_react13.useState)({});
     const updateDropdownPosition = () => {
       if (dropdownAnchorRef.current) {
         const rect = dropdownAnchorRef.current.getBoundingClientRect();
@@ -2691,7 +2687,7 @@ var SearchApiContent = (0, import_react14.forwardRef)(
         setDropdownStyle(newStyle);
       }
     };
-    (0, import_react14.useEffect)(() => {
+    (0, import_react13.useEffect)(() => {
       if (isOpen) {
         updateDropdownPosition();
         window.addEventListener("scroll", updateDropdownPosition, true);
@@ -2704,7 +2700,7 @@ var SearchApiContent = (0, import_react14.forwardRef)(
     }, [isOpen]);
     if (!isOpen || typeof document === "undefined") return null;
     return (0, import_react_dom2.createPortal)(
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
         "div",
         {
           ref: dropdownContentRef,
@@ -2713,11 +2709,11 @@ var SearchApiContent = (0, import_react14.forwardRef)(
           onMouseDown: (e) => e.stopPropagation(),
           ...props,
           children: [
-            error && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "px-3 py-2 text-sm text-red-600 dark:text-red-400 border-b border-gray-100 dark:border-zinc-800", children: error }),
-            isLoading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "p-4 text-center text-sm text-gray-500", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react8.Loader2, { className: "h-5 w-5 animate-spin mx-auto mb-2" }),
+            error && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "px-3 py-2 text-sm text-red-600 dark:text-red-400 border-b border-gray-100 dark:border-zinc-800", children: error }),
+            isLoading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "p-4 text-center text-sm text-gray-500", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react8.Loader2, { className: "h-5 w-5 animate-spin mx-auto mb-2" }),
               "Loading options..."
-            ] }) : children ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "py-1", children }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "p-4 text-center text-sm text-gray-500", children: searchTerm ? `No results for "${searchTerm}"` : "No options available" })
+            ] }) : children ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "py-1", children }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "p-4 text-center text-sm text-gray-500", children: searchTerm ? `No results for "${searchTerm}"` : "No options available" })
           ]
         }
       ),
@@ -2726,7 +2722,7 @@ var SearchApiContent = (0, import_react14.forwardRef)(
   }
 );
 SearchApiContent.displayName = "SearchApiContent";
-var SearchApiItem = (0, import_react14.forwardRef)(
+var SearchApiItem = (0, import_react13.forwardRef)(
   ({ option, index, className = "", ...props }, ref) => {
     const {
       selectedValue,
@@ -2746,7 +2742,7 @@ var SearchApiItem = (0, import_react14.forwardRef)(
     const optValue = getOptionValue(option);
     const isSelected = selectedValue === optValue;
     const isHighlighted = index === activeIndex;
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
       "button",
       {
         ref,
@@ -2765,8 +2761,8 @@ var SearchApiItem = (0, import_react14.forwardRef)(
         onMouseEnter: () => setActiveIndex(index),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "truncate", children: option[labelKey] }),
-          isSelected && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react8.Check, { className: "h-4 w-4", style: { color: primaryColor } })
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "truncate", children: option[labelKey] }),
+          isSelected && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react8.Check, { className: "h-4 w-4", style: { color: primaryColor } })
         ]
       },
       optValue || index
@@ -2776,15 +2772,15 @@ var SearchApiItem = (0, import_react14.forwardRef)(
 SearchApiItem.displayName = "SearchApiItem";
 
 // src/components/Fields/date.tsx
-var import_react15 = require("react");
-var import_antd2 = require("antd");
+var import_react14 = require("react");
+var import_antd = require("antd");
 var import_react_hook_form6 = require("react-hook-form");
 var import_dayjs = __toESM(require("dayjs"));
 var import_customParseFormat = __toESM(require("dayjs/plugin/customParseFormat"));
 var import_lucide_react9 = require("lucide-react");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 import_dayjs.default.extend(import_customParseFormat.default);
-var DateInput = (0, import_react15.forwardRef)(
+var DateInput = (0, import_react14.forwardRef)(
   ({
     label,
     error,
@@ -2801,7 +2797,7 @@ var DateInput = (0, import_react15.forwardRef)(
   }, ref) => {
     const { theme } = useWarqadConfig();
     const primaryColor = theme?.primaryColor;
-    const [isFocused, setIsFocused] = (0, import_react15.useState)(false);
+    const [isFocused, setIsFocused] = (0, import_react14.useState)(false);
     let message = error;
     if (form && name) {
       const {
@@ -2819,8 +2815,8 @@ var DateInput = (0, import_react15.forwardRef)(
       ${className}`;
     const renderDatePicker = (val, changeHandler, blurHandler, refProps) => {
       const dateValue = val && typeof val === "string" ? (0, import_dayjs.default)(val, "DD/MM/YYYY", true) : import_dayjs.default.isDayjs(val) ? val : null;
-      return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-        import_antd2.DatePicker,
+      return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        import_antd.DatePicker,
         {
           ref: refProps,
           format: "DD/MM/YYYY",
@@ -2846,7 +2842,7 @@ var DateInput = (0, import_react15.forwardRef)(
             boxShadow: isFocused && !message ? `${primaryColor}33 0px 0px 0px 2px` : void 0
           },
           classNames: { popup: { root: "z-50" } },
-          suffixIcon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          suffixIcon: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             import_lucide_react9.Calendar,
             {
               className: "h-5 w-5 text-gray-400",
@@ -2858,8 +2854,8 @@ var DateInput = (0, import_react15.forwardRef)(
         }
       );
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: `space-y-2 group relative ${containerClassName}`, children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: `space-y-2 group relative ${containerClassName}`, children: [
+      label && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
         "label",
         {
           className: "block text-xs font-medium transition-colors duration-200",
@@ -2868,11 +2864,11 @@ var DateInput = (0, import_react15.forwardRef)(
           },
           children: [
             label,
-            props.required && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
+            props.required && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-red-500 ml-1", children: "*" })
           ]
         }
       ),
-      form && name ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      form && name ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
         import_react_hook_form6.Controller,
         {
           control: form.control,
@@ -2885,7 +2881,7 @@ var DateInput = (0, import_react15.forwardRef)(
           )
         }
       ) : renderDatePicker(value, onChange, onBlur, ref),
-      message && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
+      message && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "text-sm text-red-600 dark:text-red-400", children: message })
     ] });
   }
 );
@@ -2909,10 +2905,10 @@ var Fields = {
 var Fields_default = Fields;
 
 // src/components/tables/DataTable.tsx
-var import_react16 = __toESM(require("react"));
+var import_react15 = __toESM(require("react"));
 var import_react_table = require("@tanstack/react-table");
 var import_lucide_react10 = require("lucide-react");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function DataTable({
   columns: userColumns,
   data,
@@ -2934,9 +2930,9 @@ function DataTable({
 }) {
   const { theme } = useWarqadConfig();
   const primaryColor = theme?.primaryColor;
-  const [sorting, setSorting] = (0, import_react16.useState)([]);
-  const [columnFilters, setColumnFilters] = (0, import_react16.useState)([]);
-  const [columnVisibility, setColumnVisibility] = (0, import_react16.useState)(
+  const [sorting, setSorting] = (0, import_react15.useState)([]);
+  const [columnFilters, setColumnFilters] = (0, import_react15.useState)([]);
+  const [columnVisibility, setColumnVisibility] = (0, import_react15.useState)(
     () => {
       const initialVisibility = {};
       userColumns.forEach((col) => {
@@ -2950,18 +2946,18 @@ function DataTable({
       return initialVisibility;
     }
   );
-  const [rowSelection, setRowSelection] = (0, import_react16.useState)({});
-  const [globalFilter, setGlobalFilter] = (0, import_react16.useState)("");
-  const [pagination, setPagination] = (0, import_react16.useState)({
+  const [rowSelection, setRowSelection] = (0, import_react15.useState)({});
+  const [globalFilter, setGlobalFilter] = (0, import_react15.useState)("");
+  const [pagination, setPagination] = (0, import_react15.useState)({
     pageIndex: 0,
     pageSize: pageRows || 10
   });
-  (0, import_react16.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     if (pageRows) {
       setPagination((prev) => ({ ...prev, pageSize: pageRows }));
     }
   }, [pageRows]);
-  const [expanded, setExpanded] = (0, import_react16.useState)(() => {
+  const [expanded, setExpanded] = (0, import_react15.useState)(() => {
     const initialState = {};
     if (defaultExpanded && renderSubComponent && data) {
       data.forEach((row, idx) => {
@@ -2972,7 +2968,7 @@ function DataTable({
     }
     return initialState;
   });
-  const columns = (0, import_react16.useMemo)(() => {
+  const columns = (0, import_react15.useMemo)(() => {
     let mappedColumns = userColumns.map((col) => ({
       ...col,
       accessorKey: col.key || col.accessorKey,
@@ -2988,7 +2984,7 @@ function DataTable({
       {
         id: "_index",
         header: "#",
-        cell: ({ row }) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-gray-500 font-medium ml-1", children: row.index + 1 }),
+        cell: ({ row }) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-gray-500 font-medium ml-1", children: row.index + 1 }),
         enableSorting: false
       },
       ...mappedColumns
@@ -3022,7 +3018,7 @@ function DataTable({
     },
     manualPagination: false
   });
-  (0, import_react16.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     if (onChange) {
       onChange({
         pagination: {
@@ -3047,29 +3043,29 @@ function DataTable({
     table.getState().pagination.pageIndex,
     table.getState().pagination.pageSize
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: `space-y-4 w-full ${className}`, children: [
-    filterables && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex-1 max-w-sm", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: `space-y-4 w-full ${className}`, children: [
+    filterables && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex-1 max-w-sm", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
         Fields_default.Input,
         {
           placeholder: searchPlaceholder,
           value: globalFilter,
           onChange: (e) => setGlobalFilter(e.target.value),
-          icon: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react10.Search, { size: 16 }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react10.Search, { size: 16 }),
           className: "h-9!"
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "relative group", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("button", { className: "flex items-center gap-2 px-3 h-9 rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-900 text-sm font-medium text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-zinc-800 transition-colors", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "relative group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("button", { className: "flex items-center gap-2 px-3 h-9 rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-900 text-sm font-medium text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-zinc-800 transition-colors", children: [
           "Columns",
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react10.ChevronDown, { size: 14, className: "text-gray-400" })
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react10.ChevronDown, { size: 14, className: "text-gray-400" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "absolute right-0 top-full mt-2 w-48 py-1 bg-white dark:bg-zinc-900 border border-gray-200 dark:border-zinc-800 rounded-lg shadow-xl opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all z-50", children: table.getAllColumns().filter((column) => column.getCanHide()).map((column) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "absolute right-0 top-full mt-2 w-48 py-1 bg-white dark:bg-zinc-900 border border-gray-200 dark:border-zinc-800 rounded-lg shadow-xl opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all z-50", children: table.getAllColumns().filter((column) => column.getCanHide()).map((column) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
           "label",
           {
             className: "flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-zinc-800 cursor-pointer capitalize",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                 "input",
                 {
                   type: "checkbox",
@@ -3086,13 +3082,13 @@ function DataTable({
         )) })
       ] }) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 overflow-hidden relative", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 overflow-hidden relative", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
       "table",
       {
         className: "w-full text-left border-collapse",
         style: { accentColor: primaryColor },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("thead", { className: "bg-gray-50/50 dark:bg-zinc-900/50 border-b border-gray-200 dark:border-zinc-800", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("thead", { className: "bg-gray-50/50 dark:bg-zinc-900/50 border-b border-gray-200 dark:border-zinc-800", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             "th",
             {
               className: `${rowPadding} text-sm font-semibold text-gray-900 dark:text-zinc-100 text-left ${verticalLines ? "border-x border-gray-200 dark:border-zinc-800" : ""} ${header.id === "_index" || header.id === "select" || header.id === "_select" ? "w-px whitespace-nowrap" : ""}`,
@@ -3103,22 +3099,22 @@ function DataTable({
             },
             header.id
           )) }, headerGroup.id)) }),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tbody", { className: "", children: isLoading ? Array.from({ length: pageRows || 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("tbody", { className: "", children: isLoading ? Array.from({ length: pageRows || 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             "tr",
             {
               className: "border-b border-gray-100 dark:border-zinc-800/50",
-              children: columns.map((_2, j) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+              children: columns.map((_2, j) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                 "td",
                 {
                   className: `${rowPadding} ${verticalLines ? "border-x border-gray-200 dark:border-zinc-800/50" : ""}`,
-                  children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "h-4 bg-gray-100 dark:bg-zinc-800 rounded animate-pulse w-full" })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "h-4 bg-gray-100 dark:bg-zinc-800 rounded animate-pulse w-full" })
                 },
                 `skeleton-cell-${j}`
               ))
             },
             `skeleton-${i}`
-          )) : table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react16.default.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          )) : table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react15.default.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
               "tr",
               {
                 className: `border-b border-gray-200 dark:border-zinc-800 hover:bg-gray-50/50 dark:hover:bg-zinc-900/50 transition-colors last:border-b-0 ${renderSubComponent && hasSubComponent(row.original) ? "cursor-pointer" : ""}`,
@@ -3133,7 +3129,7 @@ function DataTable({
                     }
                   }
                 },
-                children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+                children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                   "td",
                   {
                     className: `${rowPadding} text-sm text-gray-700 dark:text-gray-200 ${verticalLines ? "border-x border-gray-200 dark:border-zinc-800" : ""} ${cell.column.id === "_index" || cell.column.id === "select" || cell.column.id === "_select" ? "w-px whitespace-nowrap" : ""}`,
@@ -3146,14 +3142,14 @@ function DataTable({
                 ))
               }
             ),
-            renderSubComponent && row.getIsExpanded() && hasSubComponent(row.original) && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tr", { className: "border-b border-gray-200 dark:border-zinc-800 bg-gray-50/20 dark:bg-zinc-900/20", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("td", { colSpan: columns.length, className: "px-2 py-0", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "relative pl-6 pb-2 pr-2 pt-2 h-full", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "absolute left-2 top-0 bottom-2 w-6 border-l-2 border-b-2 rounded-bl-xl border-(--theme-primary) dark:border-(--theme-primary) pointer-events-none" }),
+            renderSubComponent && row.getIsExpanded() && hasSubComponent(row.original) && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("tr", { className: "border-b border-gray-200 dark:border-zinc-800 bg-gray-50/20 dark:bg-zinc-900/20", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("td", { colSpan: columns.length, className: "px-2 py-0", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "relative pl-6 pb-2 pr-2 pt-2 h-full", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "absolute left-2 top-0 bottom-2 w-6 border-l-2 border-b-2 rounded-bl-xl border-(--theme-primary) dark:border-(--theme-primary) pointer-events-none" }),
               renderSubComponent({
                 row: row.original,
                 index: row.index
               })
             ] }) }) })
-          ] }, row.id)) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          ] }, row.id)) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             "td",
             {
               colSpan: columns.length,
@@ -3165,7 +3161,7 @@ function DataTable({
             (group) => group.headers.some(
               (header) => header.column.columnDef.footer
             )
-          ) && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tfoot", { className: "bg-gray-50/50 dark:bg-zinc-900/50 border-t border-gray-200 dark:border-zinc-800", children: table.getFooterGroups().map((footerGroup) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tr", { children: footerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          ) && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("tfoot", { className: "bg-gray-50/50 dark:bg-zinc-900/50 border-t border-gray-200 dark:border-zinc-800", children: table.getFooterGroups().map((footerGroup) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("tr", { children: footerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             "td",
             {
               className: `${rowPadding} text-sm font-semibold text-gray-900 dark:text-zinc-100 text-left ${verticalLines ? "border-x border-gray-200 dark:border-zinc-800" : ""} ${header.id === "_index" || header.id === "select" || header.id === "_select" ? "w-px whitespace-nowrap" : ""}`,
@@ -3179,24 +3175,24 @@ function DataTable({
         ]
       }
     ) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center justify-between px-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex-1 text-xs text-gray-500", children: selectable && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-between px-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex-1 text-xs text-gray-500", children: selectable && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
         table.getFilteredSelectedRowModel().rows.length,
         " of",
         " ",
         table.getFilteredRowModel().rows.length,
         " row(s) selected."
       ] }) }),
-      pageRows && table.getPageCount() > 1 && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "text-sm text-gray-700 dark:text-gray-300 mr-2 select-none", children: [
+      pageRows && table.getPageCount() > 1 && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "text-sm text-gray-700 dark:text-gray-300 mr-2 select-none", children: [
           "Page",
           " ",
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "font-semibold", children: table.getState().pagination.pageIndex + 1 }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "font-semibold", children: table.getState().pagination.pageIndex + 1 }),
           " ",
           "of ",
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "font-semibold", children: table.getPageCount() })
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "font-semibold", children: table.getPageCount() })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           "button",
           {
             onClick: () => table.previousPage(),
@@ -3205,7 +3201,7 @@ function DataTable({
             children: "Previous"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           "button",
           {
             onClick: () => table.nextPage(),
@@ -3220,17 +3216,17 @@ function DataTable({
 }
 
 // src/components/tables/PostTable.tsx
-var import_react17 = __toESM(require("react"));
+var import_react16 = __toESM(require("react"));
 var import_react_table2 = require("@tanstack/react-table");
 var import_lucide_react11 = require("lucide-react");
-var import_jsx_runtime25 = require("react/jsx-runtime");
-var TableCell = import_react17.default.memo(
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var TableCell = import_react16.default.memo(
   ({
     cell,
     rowPadding,
     verticalLines
   }) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "td",
       {
         className: cn(
@@ -3254,7 +3250,7 @@ var TableCell = import_react17.default.memo(
     return prev.cell.getValue() === next.cell.getValue() && prev.cell.row.original === next.cell.row.original && prev.cell.row.getIsExpanded() === next.cell.row.getIsExpanded() && prev.cell.row.getIsSelected() === next.cell.row.getIsSelected() && prev.rowPadding === next.rowPadding && prev.verticalLines === next.verticalLines;
   }
 );
-var TableRow = import_react17.default.memo(
+var TableRow = import_react16.default.memo(
   ({
     row,
     rowPadding,
@@ -3265,8 +3261,8 @@ var TableRow = import_react17.default.memo(
   }) => {
     const isExpanded = row.getIsExpanded();
     const subComponentVisible = renderSubComponent && isExpanded && hasSubComponent(row.original);
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react17.default.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react16.default.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
         "tr",
         {
           className: `border-b border-gray-200 dark:border-zinc-800 hover:bg-gray-50/50 dark:hover:bg-zinc-900/50 transition-colors last:border-b-0 ${renderSubComponent && hasSubComponent(row.original) ? "cursor-pointer" : ""}`,
@@ -3279,7 +3275,7 @@ var TableRow = import_react17.default.memo(
               }
             }
           },
-          children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             TableCell,
             {
               cell,
@@ -3290,8 +3286,8 @@ var TableRow = import_react17.default.memo(
           ))
         }
       ),
-      subComponentVisible && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tr", { className: "border-b border-gray-200 dark:border-zinc-800 bg-gray-50/20 dark:bg-zinc-900/20", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("td", { colSpan: columnsCount, className: "px-2 py-0", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "relative pl-6 pb-2 pr-2 pt-2 h-full", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "absolute left-2 top-0 bottom-2 w-6 border-l-2 border-b-2 rounded-bl-xl border-(--theme-primary) dark:border-(--theme-primary) pointer-events-none" }),
+      subComponentVisible && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tr", { className: "border-b border-gray-200 dark:border-zinc-800 bg-gray-50/20 dark:bg-zinc-900/20", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("td", { colSpan: columnsCount, className: "px-2 py-0", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "relative pl-6 pb-2 pr-2 pt-2 h-full", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "absolute left-2 top-0 bottom-2 w-6 border-l-2 border-b-2 rounded-bl-xl border-(--theme-primary) dark:border-(--theme-primary) pointer-events-none" }),
         renderSubComponent({
           row: row.original,
           index: row.index
@@ -3324,10 +3320,10 @@ function PostTable({
 }) {
   const { theme } = useWarqadConfig();
   const primaryColor = theme?.primaryColor;
-  const [sorting, setSorting] = (0, import_react17.useState)([]);
-  const [columnFilters, setColumnFilters] = (0, import_react17.useState)([]);
-  const [columnVisibility, setColumnVisibility] = (0, import_react17.useState)({});
-  const [expanded, setExpanded] = (0, import_react17.useState)(() => {
+  const [sorting, setSorting] = (0, import_react16.useState)([]);
+  const [columnFilters, setColumnFilters] = (0, import_react16.useState)([]);
+  const [columnVisibility, setColumnVisibility] = (0, import_react16.useState)({});
+  const [expanded, setExpanded] = (0, import_react16.useState)(() => {
     const initialState = {};
     if (defaultExpanded && renderSubComponent && controlledData) {
       controlledData.forEach((row, idx) => {
@@ -3338,10 +3334,10 @@ function PostTable({
     }
     return initialState;
   });
-  const [internalData, setInternalData] = (0, import_react17.useState)(controlledData || []);
+  const [internalData, setInternalData] = (0, import_react16.useState)(controlledData || []);
   const isControlled = controlledData !== void 0;
   const data = isControlled ? controlledData : internalData;
-  const entryRowRef = (0, import_react17.useRef)(null);
+  const entryRowRef = (0, import_react16.useRef)(null);
   const focusAndScrollEntryRow = () => {
     setTimeout(() => {
       if (entryRowRef.current) {
@@ -3358,14 +3354,14 @@ function PostTable({
       }
     }, 50);
   };
-  (0, import_react17.useEffect)(() => {
+  (0, import_react16.useEffect)(() => {
     focusAndScrollEntryRow();
   }, []);
-  const [entryData, setEntryData] = (0, import_react17.useState)({});
-  const [editingIndex, setEditingIndex] = (0, import_react17.useState)(null);
-  const [isSavingAsync, setIsSavingAsync] = (0, import_react17.useState)(false);
-  const [fieldErrors, setFieldErrors] = (0, import_react17.useState)({});
-  const latestStateRef = (0, import_react17.useRef)({
+  const [entryData, setEntryData] = (0, import_react16.useState)({});
+  const [editingIndex, setEditingIndex] = (0, import_react16.useState)(null);
+  const [isSavingAsync, setIsSavingAsync] = (0, import_react16.useState)(false);
+  const [fieldErrors, setFieldErrors] = (0, import_react16.useState)({});
+  const latestStateRef = (0, import_react16.useRef)({
     data,
     entryData,
     editingIndex,
@@ -3377,7 +3373,7 @@ function PostTable({
     onEdit,
     onDelete
   });
-  (0, import_react17.useEffect)(() => {
+  (0, import_react16.useEffect)(() => {
     latestStateRef.current = {
       data,
       entryData,
@@ -3391,7 +3387,7 @@ function PostTable({
       onDelete
     };
   });
-  const handleSaveField = (0, import_react17.useCallback)(async () => {
+  const handleSaveField = (0, import_react16.useCallback)(async () => {
     const { data: data2, entryData: entryData2, editingIndex: editingIndex2, onChange: onChange2 } = latestStateRef.current;
     if (Object.keys(entryData2).length === 0) return;
     const actionType = editingIndex2 !== null ? "edit" : "add";
@@ -3457,20 +3453,20 @@ function PostTable({
       setTimeout(() => focusAndScrollEntryRow(), 0);
     }
   }, []);
-  const handleCancelEdit = (0, import_react17.useCallback)(() => {
+  const handleCancelEdit = (0, import_react16.useCallback)(() => {
     const { onCancel: onCancel2 } = latestStateRef.current;
     setEditingIndex(null);
     setEntryData({});
     setFieldErrors({});
     if (onCancel2) onCancel2();
   }, []);
-  const handleEdit = (0, import_react17.useCallback)((index2, rowOriginal) => {
+  const handleEdit = (0, import_react16.useCallback)((index2, rowOriginal) => {
     const { onEdit: onEdit2 } = latestStateRef.current;
     setEditingIndex(index2);
     setEntryData({ ...rowOriginal });
     if (onEdit2) onEdit2(rowOriginal);
   }, []);
-  const handleDelete = (0, import_react17.useCallback)(
+  const handleDelete = (0, import_react16.useCallback)(
     async (index2) => {
       const { data: data2, editingIndex: editingIndex2, onChange: onChange2, onDelete: onDelete2 } = latestStateRef.current;
       const rowToDelete = data2[index2];
@@ -3525,31 +3521,31 @@ function PostTable({
     },
     [handleCancelEdit]
   );
-  const actionColumn = (0, import_react17.useMemo)(
+  const actionColumn = (0, import_react16.useMemo)(
     () => ({
       id: "actions",
       header: "Actions",
       cell: ({ row, table: table2 }) => {
         const { handleEdit: handleEdit2, handleDelete: handleDelete2, submitLoading: submitLoading2, isSavingAsync: isSavingAsync2 } = table2.options.meta;
-        return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             "button",
             {
               onClick: () => handleEdit2(row.index, row.original),
               disabled: submitLoading2 || isSavingAsync2,
               className: "p-1 px-2 rounded-md hover:bg-gray-100 dark:hover:bg-zinc-800 text-gray-500 hover:text-(--theme-primary) dark:hover:text-(--theme-primary) transition-colors disabled:opacity-50",
               title: "Edit",
-              children: submitLoading2 || isSavingAsync2 ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react11.Loader2, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react11.Edit2, { size: 16 })
+              children: submitLoading2 || isSavingAsync2 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react11.Loader2, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react11.Edit2, { size: 16 })
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             "button",
             {
               onClick: () => handleDelete2(row.index),
               disabled: submitLoading2 || isSavingAsync2,
               className: "p-1 px-2 rounded-md hover:bg-gray-100 dark:hover:bg-zinc-800 text-gray-500 hover:text-red-600 dark:hover:text-red-400 transition-colors disabled:opacity-50",
               title: "Delete",
-              children: submitLoading2 || isSavingAsync2 ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react11.Loader2, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react11.Trash2, { size: 16 })
+              children: submitLoading2 || isSavingAsync2 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react11.Loader2, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react11.Trash2, { size: 16 })
             }
           )
         ] });
@@ -3557,7 +3553,7 @@ function PostTable({
     }),
     []
   );
-  const columns = (0, import_react17.useMemo)(() => {
+  const columns = (0, import_react16.useMemo)(() => {
     const mappedUserColumns = userColumns.map((col) => ({
       ...col,
       accessorKey: col.key || col.accessorKey,
@@ -3571,9 +3567,9 @@ function PostTable({
         size: 40,
         minSize: 40,
         maxSize: 40,
-        cell: ({ row }) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-gray-500 font-medium ml-1", children: row.index + 1 }),
-          renderSubComponent && hasSubComponent(row.original) && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        cell: ({ row }) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-gray-500 font-medium ml-1", children: row.index + 1 }),
+          renderSubComponent && hasSubComponent(row.original) && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             import_lucide_react11.ChevronDown,
             {
               size: 16,
@@ -3583,7 +3579,7 @@ function PostTable({
         ] }),
         enableSorting: false,
         meta: {
-          field: () => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-gray-400 font-medium px-2 block select-none", children: "#" })
+          field: () => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-gray-400 font-medium px-2 block select-none", children: "#" })
         }
       });
     }
@@ -3613,13 +3609,13 @@ function PostTable({
       isSavingAsync
     }
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     "div",
     {
       className: `space-y-4 w-full ${className}`,
       style: { "--theme-primary": primaryColor || "#3b82f6" },
-      children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 relative", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("table", { className: "w-full text-left border-collapse", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("thead", { className: "bg-gray-50/50 dark:bg-zinc-900/50 border-b border-gray-200 dark:border-zinc-800", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 relative", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("table", { className: "w-full text-left border-collapse", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("thead", { className: "bg-gray-50/50 dark:bg-zinc-900/50 border-b border-gray-200 dark:border-zinc-800", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           "th",
           {
             className: cn(
@@ -3641,12 +3637,12 @@ function PostTable({
           },
           header.id
         )) }, headerGroup.id)) }),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("tbody", { className: "", children: [
-          isLoading ? Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("tbody", { className: "", children: [
+          isLoading ? Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             "tr",
             {
               className: "border-b border-gray-100 dark:border-zinc-800/50",
-              children: columns.map((col, j) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+              children: columns.map((col, j) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                 "td",
                 {
                   className: cn(
@@ -3659,13 +3655,13 @@ function PostTable({
                     minWidth: col.meta?.width ?? col.minSize,
                     maxWidth: col.meta?.width ?? col.maxSize
                   },
-                  children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "h-4 bg-gray-100 dark:bg-zinc-800 rounded animate-pulse w-full" })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "h-4 bg-gray-100 dark:bg-zinc-800 rounded animate-pulse w-full" })
                 },
                 `skeleton-cell-${j}`
               ))
             },
             `skeleton-${i}`
-          )) : table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          )) : table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             TableRow,
             {
               row,
@@ -3676,7 +3672,7 @@ function PostTable({
               columnsCount: columns.length
             },
             row.id
-          )) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          )) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             "td",
             {
               colSpan: columns.length,
@@ -3684,7 +3680,7 @@ function PostTable({
               children: "No results found."
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             "tr",
             {
               ref: entryRowRef,
@@ -3699,7 +3695,7 @@ function PostTable({
                 return visibleColumns.map((column) => {
                   const currentId = column.id || column.columnDef.accessorKey;
                   if (column.id === "actions") {
-                    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                       "td",
                       {
                         className: cn(
@@ -3707,38 +3703,38 @@ function PostTable({
                           "py-1! text-sm align-middle transition-colors duration-200",
                           verticalLines ? "border-x border-gray-200 dark:border-zinc-800" : ""
                         ),
-                        children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex items-center gap-2", children: editingIndex !== null ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                        children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex items-center gap-2", children: editingIndex !== null ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                             "button",
                             {
                               onClick: handleSaveField,
                               disabled: isSavingAsync || submitLoading,
                               className: "flex-1 h-8 flex items-center justify-center rounded-lg bg-green-500/10 text-green-600 dark:bg-emerald-500/20 dark:text-emerald-400 hover:bg-green-500 hover:text-white dark:hover:bg-emerald-500 transition-colors shadow-sm active:scale-95 disabled:opacity-50 disabled:cursor-not-allowed",
                               title: "Update",
-                              children: isSavingAsync || submitLoading ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                              children: isSavingAsync || submitLoading ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                                 import_lucide_react11.Loader2,
                                 {
                                   size: 16,
                                   className: "animate-spin"
                                 }
-                              ) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react11.Check, { size: 16, strokeWidth: 2.5 })
+                              ) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react11.Check, { size: 16, strokeWidth: 2.5 })
                             }
                           ),
-                          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                             "button",
                             {
                               onClick: handleCancelEdit,
                               disabled: isSavingAsync || submitLoading,
                               className: "flex-1 h-8 flex items-center justify-center rounded-lg bg-red-500/10 text-red-600 dark:bg-red-500/20 dark:text-red-400 hover:bg-red-500 hover:text-white dark:hover:bg-red-500 transition-colors shadow-sm active:scale-95 disabled:opacity-50 disabled:cursor-not-allowed",
                               title: "Cancel",
-                              children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react11.X, { size: 16, strokeWidth: 2.5 })
+                              children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react11.X, { size: 16, strokeWidth: 2.5 })
                             }
                           )
-                        ] }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: renderAddButton ? renderAddButton(
+                        ] }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, { children: renderAddButton ? renderAddButton(
                           entryData,
                           handleSaveField,
                           isSavingAsync
-                        ) : /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+                        ) : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
                           "button",
                           {
                             onClick: handleSaveField,
@@ -3749,14 +3745,14 @@ function PostTable({
                             },
                             title: "Add Row",
                             children: [
-                              isSavingAsync || submitLoading ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                              isSavingAsync || submitLoading ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                                 import_lucide_react11.Loader2,
                                 {
                                   size: 14,
                                   className: "animate-spin"
                                 }
-                              ) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react11.Plus, { size: 14, strokeWidth: 2.5 }),
-                              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { children: isSavingAsync || submitLoading ? "Adding..." : "Add" })
+                              ) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react11.Plus, { size: 14, strokeWidth: 2.5 }),
+                              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: isSavingAsync || submitLoading ? "Adding..." : "Add" })
                             ]
                           }
                         ) }) })
@@ -3782,7 +3778,7 @@ function PostTable({
                       });
                     }
                   };
-                  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                     "td",
                     {
                       "data-column-id": column.id,
@@ -3808,7 +3804,7 @@ function PostTable({
                         minWidth: column.columnDef.meta?.width ?? column.columnDef.minSize,
                         maxWidth: column.columnDef.meta?.width ?? column.columnDef.maxSize
                       },
-                      children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+                      children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
                         "div",
                         {
                           className: cn(
@@ -3839,7 +3835,7 @@ function PostTable({
                               onChange: onChangeValue,
                               rowData: entryData,
                               setRowData: setEntryData
-                            }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                            }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                               Fields_default.Input,
                               {
                                 id: `pti-${accessor}`,
@@ -3851,7 +3847,7 @@ function PostTable({
                                 placeholder: `${typeof column.columnDef.header === "string" ? column.columnDef.header : column.id}`
                               }
                             ),
-                            typeof error === "string" && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "absolute left-1/2 -translate-x-1/2 bottom-full mb-2 z-9999 pointer-events-none opacity-0 group-hover:opacity-100 focus-within:opacity-100 group-focus-within:opacity-100 transition-opacity whitespace-nowrap bg-red-500 text-white text-xs px-2.5 py-1.5 rounded shadow-lg before:content-[''] before:absolute before:top-full before:left-1/2 before:-translate-x-1/2 before:border-4 before:border-transparent before:border-t-red-500", children: error })
+                            typeof error === "string" && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "absolute left-1/2 -translate-x-1/2 bottom-full mb-2 z-9999 pointer-events-none opacity-0 group-hover:opacity-100 focus-within:opacity-100 group-focus-within:opacity-100 transition-opacity whitespace-nowrap bg-red-500 text-white text-xs px-2.5 py-1.5 rounded shadow-lg before:content-[''] before:absolute before:top-full before:left-1/2 before:-translate-x-1/2 before:border-4 before:border-transparent before:border-t-red-500", children: error })
                           ]
                         }
                       )
@@ -3867,7 +3863,7 @@ function PostTable({
           (group) => group.headers.some(
             (header) => header.column.columnDef.footer
           )
-        ) && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tfoot", { className: "bg-gray-50/50 dark:bg-zinc-900/50 border-t border-gray-200 dark:border-zinc-800", children: table.getFooterGroups().map((footerGroup) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tr", { children: footerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        ) && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tfoot", { className: "bg-gray-50/50 dark:bg-zinc-900/50 border-t border-gray-200 dark:border-zinc-800", children: table.getFooterGroups().map((footerGroup) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("tr", { children: footerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           "td",
           {
             className: cn(
@@ -3895,9 +3891,9 @@ function PostTable({
 }
 
 // src/components/tables/SimpleTable.tsx
-var import_react18 = require("react");
+var import_react17 = require("react");
 var import_react_table3 = require("@tanstack/react-table");
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function SimpleTable({
   columns: userColumns,
   data,
@@ -3913,7 +3909,7 @@ function SimpleTable({
   emptyState,
   skeletonCount = 5
 }) {
-  const columns = (0, import_react18.useMemo)(() => {
+  const columns = (0, import_react17.useMemo)(() => {
     const cols = userColumns.filter((col) => !col.hide).map((col) => ({
       ...col,
       accessorKey: col.key || col.accessorKey,
@@ -3929,7 +3925,7 @@ function SimpleTable({
         id: "index",
         width: 75,
         className: "whitespace-nowrap px-2 text-center",
-        cell: (info) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "tabular-nums", children: info.row.index + 1 + startIndex })
+        cell: (info) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "tabular-nums", children: info.row.index + 1 + startIndex })
       });
     }
     return cols;
@@ -3939,24 +3935,24 @@ function SimpleTable({
     columns,
     getCoreRowModel: (0, import_react_table3.getCoreRowModel)()
   });
-  const hasFooters = (0, import_react18.useMemo)(() => {
+  const hasFooters = (0, import_react17.useMemo)(() => {
     return table.getFooterGroups().some(
       (group) => group.headers.some(
         (header) => !header.isPlaceholder && header.column.columnDef.footer
       )
     );
   }, [table]);
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: `w-full overflow-hidden ${className}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: `w-full overflow-hidden ${className}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
       "table",
       {
         className: `w-full max-w-full text-left border-collapse table-fixed ${verticalLines ? "border border-black dark:border-white" : ""}`,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("thead", { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("thead", { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
             "tr",
             {
               className: `border-b ${verticalLines ? "border-black dark:border-white" : "border-gray-200 dark:border-zinc-800"}`,
-              children: headerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+              children: headerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                 "th",
                 {
                   className: `${rowPadding} font-semibold text-gray-900 dark:text-zinc-100 text-sm align-top ${verticalLines ? "border-x border-black dark:border-white" : ""} ${header.column.columnDef.className || "wrap-break-word"}`,
@@ -3975,15 +3971,15 @@ function SimpleTable({
             },
             headerGroup.id
           )) }),
-          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("tbody", { className: "text-black dark:text-white font-semibold font-sans tabular-nums", children: isLoading && data.length === 0 ? Array.from({ length: skeletonCount }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tbody", { className: "text-black dark:text-white font-semibold font-sans tabular-nums", children: isLoading && data.length === 0 ? Array.from({ length: skeletonCount }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
             "tr",
             {
               className: `border-b ${verticalLines ? "border-black dark:border-white" : "border-gray-100 dark:border-zinc-800/60 last:border-0"}`,
-              children: columns.map((col, colIdx) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+              children: columns.map((col, colIdx) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                 "td",
                 {
                   className: `text-sm ${rowPadding} align-top ${verticalLines ? "border-x border-black dark:border-white" : ""}`,
-                  children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                     "div",
                     {
                       className: `h-4 bg-gray-200 dark:bg-zinc-800/50 rounded-sm animate-pulse ${colIdx % 2 === 0 ? "w-3/4" : "w-1/2"} ${colIdx === 0 ? "w-4" : ""}`
@@ -3994,18 +3990,18 @@ function SimpleTable({
               ))
             },
             `skeleton-row-${i}`
-          )) : data.length === 0 && !isLoading ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          )) : data.length === 0 && !isLoading ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
             "td",
             {
               colSpan: columns.length,
               className: "text-center text-gray-500 font-medium",
-              children: emptyState || /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "py-8", children: "No transactions found." })
+              children: emptyState || /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "py-8", children: "No transactions found." })
             }
-          ) }) : table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          ) }) : table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
             "tr",
             {
               className: `border-b ${verticalLines ? "border-black dark:border-white" : "border-gray-100 dark:border-zinc-800/60 last:border-0"} hover:bg-gray-50/50 dark:hover:bg-zinc-900/30 transition-colors`,
-              children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+              children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                 "td",
                 {
                   className: `text-sm ${rowPadding} align-top ${verticalLines ? "border-x border-black dark:border-white" : ""} ${cell.column.columnDef.className || "wrap-break-word"}`,
@@ -4016,11 +4012,11 @@ function SimpleTable({
             },
             row.id
           )) }),
-          hasFooters && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("tfoot", { className: "text-black dark:text-white font-bold font-sans tabular-nums", children: table.getFooterGroups().map((footerGroup) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          hasFooters && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tfoot", { className: "text-black dark:text-white font-bold font-sans tabular-nums", children: table.getFooterGroups().map((footerGroup) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
             "tr",
             {
               className: `${verticalLines ? "border-t border-black dark:border-white" : "bg-gray-50/30 dark:bg-zinc-900/10"}`,
-              children: footerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+              children: footerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                 "td",
                 {
                   className: `text-sm ${rowPadding} ${verticalLines ? "border-x border-black dark:border-white" : ""} ${header.column.columnDef.className || "wrap-break-word"}`,
@@ -4037,14 +4033,14 @@ function SimpleTable({
         ]
       }
     ),
-    componentFooter && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "mt-2 pt-3 border-t border-gray-200 dark:border-zinc-800", children: componentFooter() })
+    componentFooter && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "mt-2 pt-3 border-t border-gray-200 dark:border-zinc-800", children: componentFooter() })
   ] });
 }
 
 // src/components/Badge.tsx
-var import_react19 = __toESM(require("react"));
-var import_jsx_runtime27 = require("react/jsx-runtime");
-var Badge = import_react19.default.forwardRef(
+var import_react18 = __toESM(require("react"));
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var Badge = import_react18.default.forwardRef(
   ({
     children,
     className,
@@ -4065,7 +4061,7 @@ var Badge = import_react19.default.forwardRef(
       md: "px-2.5 py-1 text-xs leading-tight font-semibold",
       lg: "px-3 py-1.5 text-sm leading-tight font-semibold"
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
       "span",
       {
         ref,
@@ -4079,13 +4075,13 @@ var Badge = import_react19.default.forwardRef(
 Badge.displayName = "Badge";
 
 // src/components/Branding.tsx
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var Branding = ({
   text,
   disabled = false,
   className
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     "p",
     {
       className: cn(
@@ -4099,10 +4095,10 @@ var Branding = ({
 };
 
 // src/hooks/Fetches/useA4DataView.tsx
-var import_react20 = require("react");
+var import_react19 = require("react");
 var import_react_to_print = require("react-to-print");
 var import_lucide_react12 = require("lucide-react");
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 var useA4StatementView = ({
   url,
   v = 1,
@@ -4111,7 +4107,7 @@ var useA4StatementView = ({
   startPage = 1
 } = {}) => {
   const { data: apiData, isLoading, get, error: apiError } = useApis_default();
-  const contentRef = (0, import_react20.useRef)(null);
+  const contentRef = (0, import_react19.useRef)(null);
   const reactToPrintFn = (0, import_react_to_print.useReactToPrint)({
     contentRef
   });
@@ -4121,7 +4117,7 @@ var useA4StatementView = ({
       await get({ url, v, params, delay });
     }
   };
-  (0, import_react20.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     getData();
   }, [url, v, JSON.stringify(params), delay]);
   const A4DataViewComponent = ({
@@ -4152,12 +4148,12 @@ var useA4StatementView = ({
   }) => {
     const { store } = useWarqadConfig();
     const isActuallyLoading = externalLoading ?? isLoading;
-    const measureContainerRef = (0, import_react20.useRef)(null);
-    const [pages, setPages] = (0, import_react20.useState)([]);
-    const [isMeasuring, setIsMeasuring] = (0, import_react20.useState)(true);
-    const [globalFilter, setGlobalFilter] = (0, import_react20.useState)("");
-    const [currentPageIndex, setCurrentPageIndex] = (0, import_react20.useState)(0);
-    const [pageSearch, setPageSearch] = (0, import_react20.useState)("");
+    const measureContainerRef = (0, import_react19.useRef)(null);
+    const [pages, setPages] = (0, import_react19.useState)([]);
+    const [isMeasuring, setIsMeasuring] = (0, import_react19.useState)(true);
+    const [globalFilter, setGlobalFilter] = (0, import_react19.useState)("");
+    const [currentPageIndex, setCurrentPageIndex] = (0, import_react19.useState)(0);
+    const [pageSearch, setPageSearch] = (0, import_react19.useState)("");
     const displayColumnsForSearch = columns.filter((col) => !col.hide);
     const filteredDisplayData = data.filter((row) => {
       if (!globalFilter) return true;
@@ -4173,20 +4169,20 @@ var useA4StatementView = ({
     const columnsWithFooters = columns.filter(
       (col) => col.renderFooter && !col.hide
     );
-    const DisplayFinalTotalEl = columnsWithFooters.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+    const DisplayFinalTotalEl = columnsWithFooters.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
       "div",
       {
         id: "a4-final-total",
         className: "mt-6 flex flex-wrap justify-end items-center pt-4 border-t border-black dark:border-zinc-700 print:border-black gap-4",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "text-black dark:text-white print:text-black font-bold uppercase tracking-widest text-xs mr-auto", children: "Grand Totals" }),
-          columnsWithFooters.map((col, idx) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-black dark:text-white print:text-black font-bold uppercase tracking-widest text-xs mr-auto", children: "Grand Totals" }),
+          columnsWithFooters.map((col, idx) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
             "div",
             {
               className: "flex items-center gap-3 px-4 py-2 rounded-md border border-black dark:border-zinc-700 print:border-black",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-black dark:text-white print:text-black font-bold uppercase tracking-widest text-xs", children: typeof col.header === "string" ? col.header : typeof col.key === "string" ? col.key : "Total" }),
-                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "text-base font-bold font-sans tabular-nums text-black dark:text-white print:text-black", children: col.renderFooter(filteredDisplayData) })
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-black dark:text-white print:text-black font-bold uppercase tracking-widest text-xs", children: typeof col.header === "string" ? col.header : typeof col.key === "string" ? col.key : "Total" }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-base font-bold font-sans tabular-nums text-black dark:text-white print:text-black", children: col.renderFooter(filteredDisplayData) })
               ]
             },
             col.key || idx
@@ -4202,7 +4198,7 @@ var useA4StatementView = ({
         renderFooter: c.renderFooter ? c.renderFooter.toString() : ""
       }))
     });
-    (0, import_react20.useEffect)(() => {
+    (0, import_react19.useEffect)(() => {
       if (filteredDisplayData && filteredDisplayData.length > 0) {
         setIsMeasuring(true);
         setPages((prev) => prev.length === 0 ? [[]] : prev);
@@ -4217,7 +4213,7 @@ var useA4StatementView = ({
         setCurrentPageIndex(0);
       }
     }, [depsString]);
-    (0, import_react20.useEffect)(() => {
+    (0, import_react19.useEffect)(() => {
       if (!isMeasuring || filteredDisplayData.length === 0) return;
       const timer = setTimeout(() => {
         if (!measureContainerRef.current) return;
@@ -4273,28 +4269,28 @@ var useA4StatementView = ({
       }, 150);
       return () => clearTimeout(timer);
     }, [isMeasuring, depsString]);
-    const HeaderEl = /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+    const HeaderEl = /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
       "div",
       {
         className: "flex justify-between items-start mb-5 px-8 pt-8",
         id: "a4-header-section",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex flex-col gap-4", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex items-center gap-4", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("section", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h1", { className: "text-4xl font-bold text-blue-600 dark:text-blue-500 print:text-blue-600 tracking-tight uppercase", children: title }),
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-gray-500 dark:text-gray-400 print:text-gray-500 mt-1 uppercase text-xs font-semibold tracking-wider", children: subtitle })
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex flex-col gap-4", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex items-center gap-4", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("section", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h1", { className: "text-4xl font-bold text-blue-600 dark:text-blue-500 print:text-blue-600 tracking-tight uppercase", children: title }),
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("p", { className: "text-gray-500 dark:text-gray-400 print:text-gray-500 mt-1 uppercase text-xs font-semibold tracking-wider", children: subtitle })
           ] }) }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "text-right", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h2", { className: "text-lg font-bold text-gray-800 dark:text-gray-100 print:text-gray-800", children: store?.name }),
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "text-sm text-gray-500 dark:text-gray-400 print:text-gray-500 leading-relaxed text-right flex flex-col items-end", children: [
-              store?.address && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "whitespace-pre-line", children: store.address }),
-              store?.phone && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { children: store.phone }),
-              store?.email && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { children: store.email })
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-right", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h2", { className: "text-lg font-bold text-gray-800 dark:text-gray-100 print:text-gray-800", children: store?.name }),
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-sm text-gray-500 dark:text-gray-400 print:text-gray-500 leading-relaxed text-right flex flex-col items-end", children: [
+              store?.address && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "whitespace-pre-line", children: store.address }),
+              store?.phone && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: store.phone }),
+              store?.email && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: store.email })
             ] })
           ] })
         ]
       }
     );
-    const DisplayInfoGridEl = Array.isArray(info) && info.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { id: "a4-info-grid", className: "px-8", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    const DisplayInfoGridEl = Array.isArray(info) && info.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { id: "a4-info-grid", className: "px-8", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       InfoGrid,
       {
         className: "mb-4",
@@ -4302,29 +4298,29 @@ var useA4StatementView = ({
         isLoading: isActuallyLoading
       }
     ) }) : null;
-    const statusOverlay = isActuallyLoading || error || !data || data.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex flex-col relative w-full items-center justify-center py-12 min-h-[400px]", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex flex-col items-center justify-center p-8 bg-gray-50/50 dark:bg-zinc-900/30 rounded-2xl border border-dashed border-gray-300 dark:border-zinc-700 w-full max-w-lg text-center shadow-sm", children: [
-      isActuallyLoading ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(ClassicSpin, {}) }) : error ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "w-14 h-14 bg-red-100 dark:bg-red-500/10 rounded-full flex items-center justify-center mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react12.AlertCircle, { className: "w-7 h-7 text-red-600 dark:text-red-500" }) }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "w-14 h-14 bg-gray-200 dark:bg-zinc-800 rounded-full flex items-center justify-center mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react12.FileX, { className: "w-7 h-7 text-gray-500 dark:text-gray-400" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h3", { className: "text-lg font-bold text-gray-900 dark:text-white mb-2", children: isActuallyLoading ? "Loading data..." : error ? "Failed to Load Statement" : "No Records Found" }),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-sm text-gray-500 dark:text-gray-400 max-w-xs mb-6 leading-relaxed", children: isActuallyLoading ? "Please wait while we prepare your statement." : error ? typeof error === "string" ? error : "An unexpected error occurred while fetching the statement data." : "There are no transactions or records available in this requested statement." }),
-      url && !isActuallyLoading && /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+    const statusOverlay = isActuallyLoading || error || !data || data.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex flex-col relative w-full items-center justify-center py-12 min-h-[400px]", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-col items-center justify-center p-8 bg-gray-50/50 dark:bg-zinc-900/30 rounded-2xl border border-dashed border-gray-300 dark:border-zinc-700 w-full max-w-lg text-center shadow-sm", children: [
+      isActuallyLoading ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ClassicSpin, {}) }) : error ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "w-14 h-14 bg-red-100 dark:bg-red-500/10 rounded-full flex items-center justify-center mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react12.AlertCircle, { className: "w-7 h-7 text-red-600 dark:text-red-500" }) }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "w-14 h-14 bg-gray-200 dark:bg-zinc-800 rounded-full flex items-center justify-center mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react12.FileX, { className: "w-7 h-7 text-gray-500 dark:text-gray-400" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h3", { className: "text-lg font-bold text-gray-900 dark:text-white mb-2", children: isActuallyLoading ? "Loading data..." : error ? "Failed to Load Statement" : "No Records Found" }),
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("p", { className: "text-sm text-gray-500 dark:text-gray-400 max-w-xs mb-6 leading-relaxed", children: isActuallyLoading ? "Please wait while we prepare your statement." : error ? typeof error === "string" ? error : "An unexpected error occurred while fetching the statement data." : "There are no transactions or records available in this requested statement." }),
+      url && !isActuallyLoading && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
         "button",
         {
           onClick: () => getData(),
           className: "flex items-center gap-2 px-5 py-2 bg-black dark:bg-white text-white dark:text-black font-semibold rounded-lg shadow-md hover:bg-gray-800 dark:hover:bg-gray-100 transition-all active:scale-95 text-sm",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react12.RefreshCw, { size: 14 }),
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react12.RefreshCw, { size: 14 }),
             "Try Again"
           ]
         }
       )
     ] }) }) : null;
-    return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex flex-col relative w-full items-center", children: [
-      isMeasuring && filteredDisplayData.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "absolute top-0 opacity-0 pointer-events-none -left-full", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-col relative w-full items-center", children: [
+      isMeasuring && filteredDisplayData.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "absolute top-0 opacity-0 pointer-events-none -left-full", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         "div",
         {
           style: { width: "210mm", boxSizing: "border-box" },
           className: "bg-white",
-          children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
             "div",
             {
               ref: measureContainerRef,
@@ -4332,9 +4328,9 @@ var useA4StatementView = ({
               children: [
                 HeaderEl,
                 DisplayInfoGridEl,
-                /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "grow w-full px-8 pb-8", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "mb-4 border-b border-gray-200 dark:border-zinc-800 print:border-gray-200 pb-2 flex items-center gap-2 justify-between px-2 mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h3", { className: "text-sm font-bold text-gray-800 dark:text-gray-100 print:text-gray-800 uppercase tracking-wide shrink-0", children: tableTitle }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "grow w-full px-8 pb-8", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "mb-4 border-b border-gray-200 dark:border-zinc-800 print:border-gray-200 pb-2 flex items-center gap-2 justify-between px-2 mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h3", { className: "text-sm font-bold text-gray-800 dark:text-gray-100 print:text-gray-800 uppercase tracking-wide shrink-0", children: tableTitle }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                     SimpleTable,
                     {
                       columns,
@@ -4352,52 +4348,52 @@ var useA4StatementView = ({
           )
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "py-2 px-0 md:px-4 w-full", ref: contentRef, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex flex-col gap-8 print:block print:gap-0 w-full items-center", children: pages.map((pageData, pageIndex) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "py-2 px-0 md:px-4 w-full", ref: contentRef, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex flex-col gap-8 print:block print:gap-0 w-full items-center", children: pages.map((pageData, pageIndex) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         "div",
         {
           className: pageIndex === currentPageIndex ? "w-full" : "hidden print:block w-full",
-          children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
             PageA4,
             {
               className: "w-full",
               pageNumber: pageIndex + 1,
               totalPages: pages.length,
               isLastPage: pageIndex === pages.length - 1,
-              children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex flex-col h-full grow w-full", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("header", { className: "flex justify-between gap-2 items-center px-8 pt-4 print:hidden", children: [
+              children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-col h-full grow w-full", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("header", { className: "flex justify-between gap-2 items-center px-8 pt-4 print:hidden", children: [
                   headers,
-                  printable && pageIndex === currentPageIndex && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "flex items-center justify-end  ", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex items-center gap-2", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+                  printable && pageIndex === currentPageIndex && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex items-center justify-end  ", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
                       "button",
                       {
                         onClick: async () => await getData(),
                         disabled: isLoading,
                         className: "flex items-center gap-2 px-3 py-1.5 text-gray-600 dark:text-gray-300 hover:text-black dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-800 rounded-lg transition-all disabled:opacity-50",
                         children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+                          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                             import_lucide_react12.RefreshCw,
                             {
                               size: 16,
                               className: isLoading ? "animate-spin" : ""
                             }
                           ),
-                          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-xs font-semibold", children: "Reload" })
+                          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-xs font-semibold", children: "Reload" })
                         ]
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+                    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
                       "button",
                       {
                         onClick: () => reactToPrintFn(),
                         className: "flex items-center gap-2 px-4 py-1.5 bg-black dark:bg-zinc-800 text-white rounded-md text-xs font-bold shadow-sm hover:bg-zinc-800 dark:hover:bg-zinc-700 transition-all active:scale-95",
                         children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react12.Printer, { size: 16 }),
+                          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react12.Printer, { size: 16 }),
                           "Print"
                         ]
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex items-center gap-1.5 ml-2 pl-2 border-l border-gray-200 dark:border-zinc-700", children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-1.5 ml-2 pl-2 border-l border-gray-200 dark:border-zinc-700", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                         "button",
                         {
                           onClick: (e) => {
@@ -4408,11 +4404,11 @@ var useA4StatementView = ({
                           },
                           disabled: currentPageIndex === 0,
                           className: "p-1 rounded hover:bg-gray-100 dark:hover:bg-zinc-800 disabled:opacity-30 transition-colors text-gray-600 dark:text-gray-400",
-                          children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react12.ChevronLeft, { size: 18 })
+                          children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react12.ChevronLeft, { size: 18 })
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex items-center gap-1 text-[11px] font-bold tabular-nums", children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-1 text-[11px] font-bold tabular-nums", children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
                           Select,
                           {
                             value: currentPageIndex + 1,
@@ -4425,9 +4421,9 @@ var useA4StatementView = ({
                             variant: "ghost",
                             containerClassName: "inline-block",
                             children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SelectTrigger, { className: "h-7 px-2 min-w-[40px] border border-gray-200 dark:border-zinc-700 rounded flex items-center justify-center bg-white dark:bg-zinc-900 hover:bg-gray-100 dark:hover:bg-zinc-800 transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-gray-900 dark:text-white", children: currentPageIndex + 1 }) }),
-                              /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(SelectContent, { className: "min-w-[100px] max-h-64 overflow-y-auto p-0", children: [
-                                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "p-2 border-b border-gray-100 dark:border-zinc-800 sticky top-0 bg-white dark:bg-zinc-950 z-10", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+                              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(SelectTrigger, { className: "h-7 px-2 min-w-[40px] border border-gray-200 dark:border-zinc-700 rounded flex items-center justify-center bg-white dark:bg-zinc-900 hover:bg-gray-100 dark:hover:bg-zinc-800 transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-gray-900 dark:text-white", children: currentPageIndex + 1 }) }),
+                              /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(SelectContent, { className: "min-w-[100px] max-h-64 overflow-y-auto p-0", children: [
+                                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "p-2 border-b border-gray-100 dark:border-zinc-800 sticky top-0 bg-white dark:bg-zinc-950 z-10", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                                   "input",
                                   {
                                     type: "text",
@@ -4439,17 +4435,17 @@ var useA4StatementView = ({
                                     autoFocus: true
                                   }
                                 ) }),
-                                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "p-1", children: pages.map((_, i) => i + 1).filter(
+                                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "p-1", children: pages.map((_, i) => i + 1).filter(
                                   (p) => String(p).includes(pageSearch)
-                                ).map((p) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SelectItem, { value: p, children: p }, p)) })
+                                ).map((p) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(SelectItem, { value: p, children: p }, p)) })
                               ] })
                             ]
                           }
                         ),
-                        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-gray-400 mx-0.5", children: "/" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-gray-600 dark:text-gray-400", children: pages.length })
+                        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-gray-400 mx-0.5", children: "/" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-gray-600 dark:text-gray-400", children: pages.length })
                       ] }),
-                      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+                      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                         "button",
                         {
                           onClick: (e) => {
@@ -4460,7 +4456,7 @@ var useA4StatementView = ({
                           },
                           disabled: currentPageIndex === pages.length - 1,
                           className: "p-1 rounded hover:bg-gray-100 dark:hover:bg-zinc-800 disabled:opacity-30 transition-colors text-gray-600 dark:text-gray-400",
-                          children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react12.ChevronRight, { size: 18 })
+                          children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react12.ChevronRight, { size: 18 })
                         }
                       )
                     ] })
@@ -4468,10 +4464,10 @@ var useA4StatementView = ({
                 ] }),
                 pageIndex === 0 && HeaderEl,
                 pageIndex === 0 && DisplayInfoGridEl,
-                /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "grow w-full px-8 pb-8", children: [
-                  pageIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "mb-4 border-b border-gray-200 dark:border-zinc-700 print:border-gray-200 pb-2 flex items-center gap-2 justify-between px-2 mt-2 print:hidden", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h3", { className: "text-sm font-bold text-gray-800 dark:text-gray-100 print:text-gray-800 uppercase tracking-wide shrink-0", children: tableTitle }),
-                    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "grow w-full px-8 pb-8", children: [
+                  pageIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "mb-4 border-b border-gray-200 dark:border-zinc-700 print:border-gray-200 pb-2 flex items-center gap-2 justify-between px-2 mt-2 print:hidden", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h3", { className: "text-sm font-bold text-gray-800 dark:text-gray-100 print:text-gray-800 uppercase tracking-wide shrink-0", children: tableTitle }),
+                    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                       "input",
                       {
                         type: "text",
@@ -4482,9 +4478,9 @@ var useA4StatementView = ({
                       }
                     )
                   ] }),
-                  pageIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "hidden print:flex mb-4 border-b border-gray-200 print:border-gray-200 pb-2 items-center gap-2 justify-between px-2 mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h3", { className: "text-sm font-bold text-gray-800 print:text-gray-800 uppercase tracking-wide shrink-0", children: tableTitle }) }),
-                  pageIndex > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "h-7 print:h-0" }),
-                  statusOverlay ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "px-8 pb-8", children: statusOverlay }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+                  pageIndex === 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "hidden print:flex mb-4 border-b border-gray-200 print:border-gray-200 pb-2 items-center gap-2 justify-between px-2 mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h3", { className: "text-sm font-bold text-gray-800 print:text-gray-800 uppercase tracking-wide shrink-0", children: tableTitle }) }),
+                  pageIndex > 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "h-7 print:h-0" }),
+                  statusOverlay ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "px-8 pb-8", children: statusOverlay }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                     SimpleTable,
                     {
                       columns,
@@ -4520,10 +4516,10 @@ var useA4StatementView = ({
 var useA4DataView_default = useA4StatementView;
 
 // src/hooks/Fetches/useTransaction.tsx
-var import_react21 = require("react");
+var import_react20 = require("react");
 var import_lucide_react13 = require("lucide-react");
 var import_moment = __toESM(require("moment"));
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var useTransaction = ({
   url,
   v = 1,
@@ -4531,7 +4527,7 @@ var useTransaction = ({
   params = {},
   dateFilter = true
 }) => {
-  const [date, setDate] = (0, import_react21.useState)(
+  const [date, setDate] = (0, import_react20.useState)(
     (0, import_moment.default)().format("DD/MM/YYYY")
   );
   const dateObj = {};
@@ -4549,7 +4545,7 @@ var useTransaction = ({
       delay
     });
   };
-  (0, import_react21.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     getData();
   }, [url, v, JSON.stringify(params), delay, date]);
   const TransactionViewComponent = ({
@@ -4576,21 +4572,21 @@ var useTransaction = ({
     createTitle = "Add New",
     ...rest
   }) => {
-    const emptyState = !isLoading && (error || !data || data.length === 0) ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    const emptyState = !isLoading && (error || !data || data.length === 0) ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
       "div",
       {
         className: `flex flex-col relative w-full items-center justify-center py-12 min-h-[300px] ${className}`,
-        children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex flex-col items-center justify-center p-8 bg-gray-50/50 dark:bg-zinc-900/30 rounded-2xl border border-dashed border-gray-300 dark:border-zinc-700 w-full max-w-lg text-center shadow-sm", children: [
-          error ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "w-14 h-14 bg-red-100 dark:bg-red-500/10 rounded-full flex items-center justify-center mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react13.AlertCircle, { className: "w-7 h-7 text-red-600 dark:text-red-500" }) }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "w-14 h-14 bg-gray-200 dark:bg-zinc-800 rounded-full flex items-center justify-center mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react13.FileX, { className: "w-7 h-7 text-gray-500 dark:text-gray-400" }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("h3", { className: "text-lg font-bold text-gray-900 dark:text-white mb-2", children: error ? "Failed to Load Data" : "No Records Found" }),
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("p", { className: "text-sm text-gray-500 dark:text-gray-400 max-w-xs mb-6 leading-relaxed", children: error ? typeof error === "string" ? error : "An unexpected error occurred while fetching the data." : "There are no transactions or records available to display here." }),
-          url && /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex flex-col items-center justify-center p-8 bg-gray-50/50 dark:bg-zinc-900/30 rounded-2xl border border-dashed border-gray-300 dark:border-zinc-700 w-full max-w-lg text-center shadow-sm", children: [
+          error ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "w-14 h-14 bg-red-100 dark:bg-red-500/10 rounded-full flex items-center justify-center mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react13.AlertCircle, { className: "w-7 h-7 text-red-600 dark:text-red-500" }) }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "w-14 h-14 bg-gray-200 dark:bg-zinc-800 rounded-full flex items-center justify-center mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react13.FileX, { className: "w-7 h-7 text-gray-500 dark:text-gray-400" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h3", { className: "text-lg font-bold text-gray-900 dark:text-white mb-2", children: error ? "Failed to Load Data" : "No Records Found" }),
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-sm text-gray-500 dark:text-gray-400 max-w-xs mb-6 leading-relaxed", children: error ? typeof error === "string" ? error : "An unexpected error occurred while fetching the data." : "There are no transactions or records available to display here." }),
+          url && /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
             "button",
             {
               onClick: () => getData(),
               className: "flex items-center gap-2 px-5 py-2 bg-black dark:bg-white text-white dark:text-black font-semibold rounded-lg shadow-md hover:bg-gray-800 dark:hover:bg-gray-100 transition-all active:scale-95 text-sm",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react13.RefreshCw, { size: 14 }),
+                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react13.RefreshCw, { size: 14 }),
                 "Try Again"
               ]
             }
@@ -4598,14 +4594,14 @@ var useTransaction = ({
         ] })
       }
     ) : void 0;
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(Card, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Card.Header, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("header", { className: "flex items-center justify-between gap-4 py-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Card.Title, { children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Card.Description, { children: description })
+    return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Card, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Card.Header, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("header", { className: "flex items-center justify-between gap-4 py-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "space-y-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Card.Title, { children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Card.Description, { children: description })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("section", { className: "flex gap-2 items-center", children: [
-          dateFilter && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("section", { className: "flex gap-2 items-center", children: [
+          dateFilter && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
             Fields_default.DateInput,
             {
               value: date,
@@ -4615,20 +4611,20 @@ var useTransaction = ({
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
             Button,
             {
               size: "sm",
               className: "rounded-md!",
               onClick: onCreate,
               variant: "primary",
-              icon: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react13.Plus, {}),
+              icon: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react13.Plus, {}),
               children: createTitle
             }
           )
         ] })
       ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Card.Content, { className: "space-y-6", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: `w-full ${className}`, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Card.Content, { className: "space-y-6", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: `w-full ${className}`, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
         DataTable,
         {
           columns,
@@ -4843,6 +4839,1429 @@ var storage = {
     return keys;
   }
 };
+
+// src/hooks/uploads/useAntdImageUpload.tsx
+var import_react23 = require("react");
+
+// ../../node_modules/@ant-design/icons/es/components/Context.js
+var import_react21 = require("react");
+var IconContext = /* @__PURE__ */ (0, import_react21.createContext)({});
+var Context_default = IconContext;
+
+// ../../node_modules/@ant-design/icons/es/components/AntdIcon.js
+var React14 = __toESM(require("react"));
+var import_clsx2 = require("clsx");
+
+// ../../node_modules/@ant-design/fast-color/es/presetColors.js
+var presetColors_default = {
+  aliceblue: "9ehhb",
+  antiquewhite: "9sgk7",
+  aqua: "1ekf",
+  aquamarine: "4zsno",
+  azure: "9eiv3",
+  beige: "9lhp8",
+  bisque: "9zg04",
+  black: "0",
+  blanchedalmond: "9zhe5",
+  blue: "73",
+  blueviolet: "5e31e",
+  brown: "6g016",
+  burlywood: "8ouiv",
+  cadetblue: "3qba8",
+  chartreuse: "4zshs",
+  chocolate: "87k0u",
+  coral: "9yvyo",
+  cornflowerblue: "3xael",
+  cornsilk: "9zjz0",
+  crimson: "8l4xo",
+  cyan: "1ekf",
+  darkblue: "3v",
+  darkcyan: "rkb",
+  darkgoldenrod: "776yz",
+  darkgray: "6mbhl",
+  darkgreen: "jr4",
+  darkgrey: "6mbhl",
+  darkkhaki: "7ehkb",
+  darkmagenta: "5f91n",
+  darkolivegreen: "3bzfz",
+  darkorange: "9yygw",
+  darkorchid: "5z6x8",
+  darkred: "5f8xs",
+  darksalmon: "9441m",
+  darkseagreen: "5lwgf",
+  darkslateblue: "2th1n",
+  darkslategray: "1ugcv",
+  darkslategrey: "1ugcv",
+  darkturquoise: "14up",
+  darkviolet: "5rw7n",
+  deeppink: "9yavn",
+  deepskyblue: "11xb",
+  dimgray: "442g9",
+  dimgrey: "442g9",
+  dodgerblue: "16xof",
+  firebrick: "6y7tu",
+  floralwhite: "9zkds",
+  forestgreen: "1cisi",
+  fuchsia: "9y70f",
+  gainsboro: "8m8kc",
+  ghostwhite: "9pq0v",
+  goldenrod: "8j4f4",
+  gold: "9zda8",
+  gray: "50i2o",
+  green: "pa8",
+  greenyellow: "6senj",
+  grey: "50i2o",
+  honeydew: "9eiuo",
+  hotpink: "9yrp0",
+  indianred: "80gnw",
+  indigo: "2xcoy",
+  ivory: "9zldc",
+  khaki: "9edu4",
+  lavenderblush: "9ziet",
+  lavender: "90c8q",
+  lawngreen: "4vk74",
+  lemonchiffon: "9zkct",
+  lightblue: "6s73a",
+  lightcoral: "9dtog",
+  lightcyan: "8s1rz",
+  lightgoldenrodyellow: "9sjiq",
+  lightgray: "89jo3",
+  lightgreen: "5nkwg",
+  lightgrey: "89jo3",
+  lightpink: "9z6wx",
+  lightsalmon: "9z2ii",
+  lightseagreen: "19xgq",
+  lightskyblue: "5arju",
+  lightslategray: "4nwk9",
+  lightslategrey: "4nwk9",
+  lightsteelblue: "6wau6",
+  lightyellow: "9zlcw",
+  lime: "1edc",
+  limegreen: "1zcxe",
+  linen: "9shk6",
+  magenta: "9y70f",
+  maroon: "4zsow",
+  mediumaquamarine: "40eju",
+  mediumblue: "5p",
+  mediumorchid: "79qkz",
+  mediumpurple: "5r3rv",
+  mediumseagreen: "2d9ip",
+  mediumslateblue: "4tcku",
+  mediumspringgreen: "1di2",
+  mediumturquoise: "2uabw",
+  mediumvioletred: "7rn9h",
+  midnightblue: "z980",
+  mintcream: "9ljp6",
+  mistyrose: "9zg0x",
+  moccasin: "9zfzp",
+  navajowhite: "9zest",
+  navy: "3k",
+  oldlace: "9wq92",
+  olive: "50hz4",
+  olivedrab: "472ub",
+  orange: "9z3eo",
+  orangered: "9ykg0",
+  orchid: "8iu3a",
+  palegoldenrod: "9bl4a",
+  palegreen: "5yw0o",
+  paleturquoise: "6v4ku",
+  palevioletred: "8k8lv",
+  papayawhip: "9zi6t",
+  peachpuff: "9ze0p",
+  peru: "80oqn",
+  pink: "9z8wb",
+  plum: "8nba5",
+  powderblue: "6wgdi",
+  purple: "4zssg",
+  rebeccapurple: "3zk49",
+  red: "9y6tc",
+  rosybrown: "7cv4f",
+  royalblue: "2jvtt",
+  saddlebrown: "5fmkz",
+  salmon: "9rvci",
+  sandybrown: "9jn1c",
+  seagreen: "1tdnb",
+  seashell: "9zje6",
+  sienna: "6973h",
+  silver: "7ir40",
+  skyblue: "5arjf",
+  slateblue: "45e4t",
+  slategray: "4e100",
+  slategrey: "4e100",
+  snow: "9zke2",
+  springgreen: "1egv",
+  steelblue: "2r1kk",
+  tan: "87yx8",
+  teal: "pds",
+  thistle: "8ggk8",
+  tomato: "9yqfb",
+  turquoise: "2j4r4",
+  violet: "9b10u",
+  wheat: "9ld4j",
+  white: "9zldr",
+  whitesmoke: "9lhpx",
+  yellow: "9zl6o",
+  yellowgreen: "61fzm"
+};
+
+// ../../node_modules/@ant-design/fast-color/es/FastColor.js
+var round = Math.round;
+function splitColorStr(str, parseNum) {
+  const match = str.replace(/^[^(]*\((.*)/, "$1").replace(/\).*/, "").match(/\d*\.?\d+%?/g) || [];
+  const numList = match.map((item) => parseFloat(item));
+  for (let i = 0; i < 3; i += 1) {
+    numList[i] = parseNum(numList[i] || 0, match[i] || "", i);
+  }
+  if (match[3]) {
+    numList[3] = match[3].includes("%") ? numList[3] / 100 : numList[3];
+  } else {
+    numList[3] = 1;
+  }
+  return numList;
+}
+var parseHSVorHSL = (num, _, index) => index === 0 ? num : num / 100;
+function limitRange(value, max) {
+  const mergedMax = max || 255;
+  if (value > mergedMax) {
+    return mergedMax;
+  }
+  if (value < 0) {
+    return 0;
+  }
+  return value;
+}
+var FastColor = class _FastColor {
+  /**
+   * All FastColor objects are valid. So isValid is always true. This property is kept to be compatible with TinyColor.
+   */
+  isValid = true;
+  /**
+   * Red, R in RGB
+   */
+  r = 0;
+  /**
+   * Green, G in RGB
+   */
+  g = 0;
+  /**
+   * Blue, B in RGB
+   */
+  b = 0;
+  /**
+   * Alpha/Opacity, A in RGBA/HSLA
+   */
+  a = 1;
+  // HSV privates
+  _h;
+  _hsl_s;
+  _hsv_s;
+  _l;
+  _v;
+  // intermediate variables to calculate HSL/HSV
+  _max;
+  _min;
+  _brightness;
+  constructor(input) {
+    function matchFormat(str) {
+      return str[0] in input && str[1] in input && str[2] in input;
+    }
+    if (!input) {
+    } else if (typeof input === "string") {
+      let matchPrefix2 = function(prefix) {
+        return trimStr.startsWith(prefix);
+      };
+      var matchPrefix = matchPrefix2;
+      const trimStr = input.trim();
+      if (/^#?[A-F\d]{3,8}$/i.test(trimStr)) {
+        this.fromHexString(trimStr);
+      } else if (matchPrefix2("rgb")) {
+        this.fromRgbString(trimStr);
+      } else if (matchPrefix2("hsl")) {
+        this.fromHslString(trimStr);
+      } else if (matchPrefix2("hsv") || matchPrefix2("hsb")) {
+        this.fromHsvString(trimStr);
+      } else {
+        const presetColor = presetColors_default[trimStr.toLowerCase()];
+        if (presetColor) {
+          this.fromHexString(
+            // Convert 36 hex to 16 hex
+            parseInt(presetColor, 36).toString(16).padStart(6, "0")
+          );
+        }
+      }
+    } else if (input instanceof _FastColor) {
+      this.r = input.r;
+      this.g = input.g;
+      this.b = input.b;
+      this.a = input.a;
+      this._h = input._h;
+      this._hsl_s = input._hsl_s;
+      this._hsv_s = input._hsv_s;
+      this._l = input._l;
+      this._v = input._v;
+    } else if (matchFormat("rgb")) {
+      this.r = limitRange(input.r);
+      this.g = limitRange(input.g);
+      this.b = limitRange(input.b);
+      this.a = typeof input.a === "number" ? limitRange(input.a, 1) : 1;
+    } else if (matchFormat("hsl")) {
+      this.fromHsl(input);
+    } else if (matchFormat("hsv")) {
+      this.fromHsv(input);
+    } else {
+      throw new Error("@ant-design/fast-color: unsupported input " + JSON.stringify(input));
+    }
+  }
+  // ======================= Setter =======================
+  setR(value) {
+    return this._sc("r", value);
+  }
+  setG(value) {
+    return this._sc("g", value);
+  }
+  setB(value) {
+    return this._sc("b", value);
+  }
+  setA(value) {
+    return this._sc("a", value, 1);
+  }
+  setHue(value) {
+    const hsv = this.toHsv();
+    hsv.h = value;
+    return this._c(hsv);
+  }
+  // ======================= Getter =======================
+  /**
+   * Returns the perceived luminance of a color, from 0-1.
+   * @see http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
+   */
+  getLuminance() {
+    function adjustGamma(raw) {
+      const val = raw / 255;
+      return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4);
+    }
+    const R = adjustGamma(this.r);
+    const G = adjustGamma(this.g);
+    const B = adjustGamma(this.b);
+    return 0.2126 * R + 0.7152 * G + 0.0722 * B;
+  }
+  getHue() {
+    if (typeof this._h === "undefined") {
+      const delta = this.getMax() - this.getMin();
+      if (delta === 0) {
+        this._h = 0;
+      } else {
+        this._h = round(60 * (this.r === this.getMax() ? (this.g - this.b) / delta + (this.g < this.b ? 6 : 0) : this.g === this.getMax() ? (this.b - this.r) / delta + 2 : (this.r - this.g) / delta + 4));
+      }
+    }
+    return this._h;
+  }
+  /**
+   * @deprecated should use getHSVSaturation or getHSLSaturation instead
+   */
+  getSaturation() {
+    return this.getHSVSaturation();
+  }
+  getHSVSaturation() {
+    if (typeof this._hsv_s === "undefined") {
+      const delta = this.getMax() - this.getMin();
+      if (delta === 0) {
+        this._hsv_s = 0;
+      } else {
+        this._hsv_s = delta / this.getMax();
+      }
+    }
+    return this._hsv_s;
+  }
+  getHSLSaturation() {
+    if (typeof this._hsl_s === "undefined") {
+      const delta = this.getMax() - this.getMin();
+      if (delta === 0) {
+        this._hsl_s = 0;
+      } else {
+        const l = this.getLightness();
+        this._hsl_s = delta / 255 / (1 - Math.abs(2 * l - 1));
+      }
+    }
+    return this._hsl_s;
+  }
+  getLightness() {
+    if (typeof this._l === "undefined") {
+      this._l = (this.getMax() + this.getMin()) / 510;
+    }
+    return this._l;
+  }
+  getValue() {
+    if (typeof this._v === "undefined") {
+      this._v = this.getMax() / 255;
+    }
+    return this._v;
+  }
+  /**
+   * Returns the perceived brightness of the color, from 0-255.
+   * Note: this is not the b of HSB
+   * @see http://www.w3.org/TR/AERT#color-contrast
+   */
+  getBrightness() {
+    if (typeof this._brightness === "undefined") {
+      this._brightness = (this.r * 299 + this.g * 587 + this.b * 114) / 1e3;
+    }
+    return this._brightness;
+  }
+  // ======================== Func ========================
+  darken(amount = 10) {
+    const h = this.getHue();
+    const s = this.getSaturation();
+    let l = this.getLightness() - amount / 100;
+    if (l < 0) {
+      l = 0;
+    }
+    return this._c({
+      h,
+      s,
+      l,
+      a: this.a
+    });
+  }
+  lighten(amount = 10) {
+    const h = this.getHue();
+    const s = this.getSaturation();
+    let l = this.getLightness() + amount / 100;
+    if (l > 1) {
+      l = 1;
+    }
+    return this._c({
+      h,
+      s,
+      l,
+      a: this.a
+    });
+  }
+  /**
+   * Mix the current color a given amount with another color, from 0 to 100.
+   * 0 means no mixing (return current color).
+   */
+  mix(input, amount = 50) {
+    const color = this._c(input);
+    const p = amount / 100;
+    const calc = (key) => (color[key] - this[key]) * p + this[key];
+    const rgba = {
+      r: round(calc("r")),
+      g: round(calc("g")),
+      b: round(calc("b")),
+      a: round(calc("a") * 100) / 100
+    };
+    return this._c(rgba);
+  }
+  /**
+   * Mix the color with pure white, from 0 to 100.
+   * Providing 0 will do nothing, providing 100 will always return white.
+   */
+  tint(amount = 10) {
+    return this.mix({
+      r: 255,
+      g: 255,
+      b: 255,
+      a: 1
+    }, amount);
+  }
+  /**
+   * Mix the color with pure black, from 0 to 100.
+   * Providing 0 will do nothing, providing 100 will always return black.
+   */
+  shade(amount = 10) {
+    return this.mix({
+      r: 0,
+      g: 0,
+      b: 0,
+      a: 1
+    }, amount);
+  }
+  onBackground(background) {
+    const bg = this._c(background);
+    const alpha = this.a + bg.a * (1 - this.a);
+    const calc = (key) => {
+      return round((this[key] * this.a + bg[key] * bg.a * (1 - this.a)) / alpha);
+    };
+    return this._c({
+      r: calc("r"),
+      g: calc("g"),
+      b: calc("b"),
+      a: alpha
+    });
+  }
+  // ======================= Status =======================
+  isDark() {
+    return this.getBrightness() < 128;
+  }
+  isLight() {
+    return this.getBrightness() >= 128;
+  }
+  // ======================== MISC ========================
+  equals(other) {
+    return this.r === other.r && this.g === other.g && this.b === other.b && this.a === other.a;
+  }
+  clone() {
+    return this._c(this);
+  }
+  // ======================= Format =======================
+  toHexString() {
+    let hex = "#";
+    const rHex = (this.r || 0).toString(16);
+    hex += rHex.length === 2 ? rHex : "0" + rHex;
+    const gHex = (this.g || 0).toString(16);
+    hex += gHex.length === 2 ? gHex : "0" + gHex;
+    const bHex = (this.b || 0).toString(16);
+    hex += bHex.length === 2 ? bHex : "0" + bHex;
+    if (typeof this.a === "number" && this.a >= 0 && this.a < 1) {
+      const aHex = round(this.a * 255).toString(16);
+      hex += aHex.length === 2 ? aHex : "0" + aHex;
+    }
+    return hex;
+  }
+  /** CSS support color pattern */
+  toHsl() {
+    return {
+      h: this.getHue(),
+      s: this.getHSLSaturation(),
+      l: this.getLightness(),
+      a: this.a
+    };
+  }
+  /** CSS support color pattern */
+  toHslString() {
+    const h = this.getHue();
+    const s = round(this.getHSLSaturation() * 100);
+    const l = round(this.getLightness() * 100);
+    return this.a !== 1 ? `hsla(${h},${s}%,${l}%,${this.a})` : `hsl(${h},${s}%,${l}%)`;
+  }
+  /** Same as toHsb */
+  toHsv() {
+    return {
+      h: this.getHue(),
+      s: this.getHSVSaturation(),
+      v: this.getValue(),
+      a: this.a
+    };
+  }
+  toRgb() {
+    return {
+      r: this.r,
+      g: this.g,
+      b: this.b,
+      a: this.a
+    };
+  }
+  toRgbString() {
+    return this.a !== 1 ? `rgba(${this.r},${this.g},${this.b},${this.a})` : `rgb(${this.r},${this.g},${this.b})`;
+  }
+  toString() {
+    return this.toRgbString();
+  }
+  // ====================== Privates ======================
+  /** Return a new FastColor object with one channel changed */
+  _sc(rgb, value, max) {
+    const clone = this.clone();
+    clone[rgb] = limitRange(value, max);
+    return clone;
+  }
+  _c(input) {
+    return new this.constructor(input);
+  }
+  getMax() {
+    if (typeof this._max === "undefined") {
+      this._max = Math.max(this.r, this.g, this.b);
+    }
+    return this._max;
+  }
+  getMin() {
+    if (typeof this._min === "undefined") {
+      this._min = Math.min(this.r, this.g, this.b);
+    }
+    return this._min;
+  }
+  fromHexString(trimStr) {
+    const withoutPrefix = trimStr.replace("#", "");
+    function connectNum(index1, index2) {
+      return parseInt(withoutPrefix[index1] + withoutPrefix[index2 || index1], 16);
+    }
+    if (withoutPrefix.length < 6) {
+      this.r = connectNum(0);
+      this.g = connectNum(1);
+      this.b = connectNum(2);
+      this.a = withoutPrefix[3] ? connectNum(3) / 255 : 1;
+    } else {
+      this.r = connectNum(0, 1);
+      this.g = connectNum(2, 3);
+      this.b = connectNum(4, 5);
+      this.a = withoutPrefix[6] ? connectNum(6, 7) / 255 : 1;
+    }
+  }
+  fromHsl({
+    h: _h,
+    s,
+    l,
+    a
+  }) {
+    const h = (_h % 360 + 360) % 360;
+    this._h = h;
+    this._hsl_s = s;
+    this._l = l;
+    this.a = typeof a === "number" ? a : 1;
+    if (s <= 0) {
+      const rgb = round(l * 255);
+      this.r = rgb;
+      this.g = rgb;
+      this.b = rgb;
+      return;
+    }
+    let r = 0, g = 0, b = 0;
+    const huePrime = h / 60;
+    const chroma = (1 - Math.abs(2 * l - 1)) * s;
+    const secondComponent = chroma * (1 - Math.abs(huePrime % 2 - 1));
+    if (huePrime >= 0 && huePrime < 1) {
+      r = chroma;
+      g = secondComponent;
+    } else if (huePrime >= 1 && huePrime < 2) {
+      r = secondComponent;
+      g = chroma;
+    } else if (huePrime >= 2 && huePrime < 3) {
+      g = chroma;
+      b = secondComponent;
+    } else if (huePrime >= 3 && huePrime < 4) {
+      g = secondComponent;
+      b = chroma;
+    } else if (huePrime >= 4 && huePrime < 5) {
+      r = secondComponent;
+      b = chroma;
+    } else if (huePrime >= 5 && huePrime < 6) {
+      r = chroma;
+      b = secondComponent;
+    }
+    const lightnessModification = l - chroma / 2;
+    this.r = round((r + lightnessModification) * 255);
+    this.g = round((g + lightnessModification) * 255);
+    this.b = round((b + lightnessModification) * 255);
+  }
+  fromHsv({
+    h: _h,
+    s,
+    v,
+    a
+  }) {
+    const h = (_h % 360 + 360) % 360;
+    this._h = h;
+    this._hsv_s = s;
+    this._v = v;
+    this.a = typeof a === "number" ? a : 1;
+    const vv = round(v * 255);
+    this.r = vv;
+    this.g = vv;
+    this.b = vv;
+    if (s <= 0) {
+      return;
+    }
+    const hh = h / 60;
+    const i = Math.floor(hh);
+    const ff = hh - i;
+    const p = round(v * (1 - s) * 255);
+    const q = round(v * (1 - s * ff) * 255);
+    const t = round(v * (1 - s * (1 - ff)) * 255);
+    switch (i) {
+      case 0:
+        this.g = t;
+        this.b = p;
+        break;
+      case 1:
+        this.r = q;
+        this.b = p;
+        break;
+      case 2:
+        this.r = p;
+        this.b = t;
+        break;
+      case 3:
+        this.r = p;
+        this.g = q;
+        break;
+      case 4:
+        this.r = t;
+        this.g = p;
+        break;
+      case 5:
+      default:
+        this.g = p;
+        this.b = q;
+        break;
+    }
+  }
+  fromHsvString(trimStr) {
+    const cells = splitColorStr(trimStr, parseHSVorHSL);
+    this.fromHsv({
+      h: cells[0],
+      s: cells[1],
+      v: cells[2],
+      a: cells[3]
+    });
+  }
+  fromHslString(trimStr) {
+    const cells = splitColorStr(trimStr, parseHSVorHSL);
+    this.fromHsl({
+      h: cells[0],
+      s: cells[1],
+      l: cells[2],
+      a: cells[3]
+    });
+  }
+  fromRgbString(trimStr) {
+    const cells = splitColorStr(trimStr, (num, txt) => (
+      // Convert percentage to number. e.g. 50% -> 128
+      txt.includes("%") ? round(num / 100 * 255) : num
+    ));
+    this.r = cells[0];
+    this.g = cells[1];
+    this.b = cells[2];
+    this.a = cells[3];
+  }
+};
+
+// ../../node_modules/@ant-design/colors/es/generate.js
+var hueStep = 2;
+var saturationStep = 0.16;
+var saturationStep2 = 0.05;
+var brightnessStep1 = 0.05;
+var brightnessStep2 = 0.15;
+var lightColorCount = 5;
+var darkColorCount = 4;
+var darkColorMap = [{
+  index: 7,
+  amount: 15
+}, {
+  index: 6,
+  amount: 25
+}, {
+  index: 5,
+  amount: 30
+}, {
+  index: 5,
+  amount: 45
+}, {
+  index: 5,
+  amount: 65
+}, {
+  index: 5,
+  amount: 85
+}, {
+  index: 4,
+  amount: 90
+}, {
+  index: 3,
+  amount: 95
+}, {
+  index: 2,
+  amount: 97
+}, {
+  index: 1,
+  amount: 98
+}];
+function getHue(hsv, i, light) {
+  let hue;
+  if (Math.round(hsv.h) >= 60 && Math.round(hsv.h) <= 240) {
+    hue = light ? Math.round(hsv.h) - hueStep * i : Math.round(hsv.h) + hueStep * i;
+  } else {
+    hue = light ? Math.round(hsv.h) + hueStep * i : Math.round(hsv.h) - hueStep * i;
+  }
+  if (hue < 0) {
+    hue += 360;
+  } else if (hue >= 360) {
+    hue -= 360;
+  }
+  return hue;
+}
+function getSaturation(hsv, i, light) {
+  if (hsv.h === 0 && hsv.s === 0) {
+    return hsv.s;
+  }
+  let saturation;
+  if (light) {
+    saturation = hsv.s - saturationStep * i;
+  } else if (i === darkColorCount) {
+    saturation = hsv.s + saturationStep;
+  } else {
+    saturation = hsv.s + saturationStep2 * i;
+  }
+  if (saturation > 1) {
+    saturation = 1;
+  }
+  if (light && i === lightColorCount && saturation > 0.1) {
+    saturation = 0.1;
+  }
+  if (saturation < 0.06) {
+    saturation = 0.06;
+  }
+  return Math.round(saturation * 100) / 100;
+}
+function getValue(hsv, i, light) {
+  let value;
+  if (light) {
+    value = hsv.v + brightnessStep1 * i;
+  } else {
+    value = hsv.v - brightnessStep2 * i;
+  }
+  value = Math.max(0, Math.min(1, value));
+  return Math.round(value * 100) / 100;
+}
+function generate(color, opts = {}) {
+  const patterns = [];
+  const pColor = new FastColor(color);
+  const hsv = pColor.toHsv();
+  for (let i = lightColorCount; i > 0; i -= 1) {
+    const c = new FastColor({
+      h: getHue(hsv, i, true),
+      s: getSaturation(hsv, i, true),
+      v: getValue(hsv, i, true)
+    });
+    patterns.push(c);
+  }
+  patterns.push(pColor);
+  for (let i = 1; i <= darkColorCount; i += 1) {
+    const c = new FastColor({
+      h: getHue(hsv, i),
+      s: getSaturation(hsv, i),
+      v: getValue(hsv, i)
+    });
+    patterns.push(c);
+  }
+  if (opts.theme === "dark") {
+    return darkColorMap.map(({
+      index,
+      amount
+    }) => new FastColor(opts.backgroundColor || "#141414").mix(patterns[index], amount).toHexString());
+  }
+  return patterns.map((c) => c.toHexString());
+}
+
+// ../../node_modules/@ant-design/colors/es/presets.js
+var red = ["#fff1f0", "#ffccc7", "#ffa39e", "#ff7875", "#ff4d4f", "#f5222d", "#cf1322", "#a8071a", "#820014", "#5c0011"];
+red.primary = red[5];
+var volcano = ["#fff2e8", "#ffd8bf", "#ffbb96", "#ff9c6e", "#ff7a45", "#fa541c", "#d4380d", "#ad2102", "#871400", "#610b00"];
+volcano.primary = volcano[5];
+var orange = ["#fff7e6", "#ffe7ba", "#ffd591", "#ffc069", "#ffa940", "#fa8c16", "#d46b08", "#ad4e00", "#873800", "#612500"];
+orange.primary = orange[5];
+var gold = ["#fffbe6", "#fff1b8", "#ffe58f", "#ffd666", "#ffc53d", "#faad14", "#d48806", "#ad6800", "#874d00", "#613400"];
+gold.primary = gold[5];
+var yellow = ["#feffe6", "#ffffb8", "#fffb8f", "#fff566", "#ffec3d", "#fadb14", "#d4b106", "#ad8b00", "#876800", "#614700"];
+yellow.primary = yellow[5];
+var lime = ["#fcffe6", "#f4ffb8", "#eaff8f", "#d3f261", "#bae637", "#a0d911", "#7cb305", "#5b8c00", "#3f6600", "#254000"];
+lime.primary = lime[5];
+var green = ["#f6ffed", "#d9f7be", "#b7eb8f", "#95de64", "#73d13d", "#52c41a", "#389e0d", "#237804", "#135200", "#092b00"];
+green.primary = green[5];
+var cyan = ["#e6fffb", "#b5f5ec", "#87e8de", "#5cdbd3", "#36cfc9", "#13c2c2", "#08979c", "#006d75", "#00474f", "#002329"];
+cyan.primary = cyan[5];
+var blue = ["#e6f4ff", "#bae0ff", "#91caff", "#69b1ff", "#4096ff", "#1677ff", "#0958d9", "#003eb3", "#002c8c", "#001d66"];
+blue.primary = blue[5];
+var geekblue = ["#f0f5ff", "#d6e4ff", "#adc6ff", "#85a5ff", "#597ef7", "#2f54eb", "#1d39c4", "#10239e", "#061178", "#030852"];
+geekblue.primary = geekblue[5];
+var purple = ["#f9f0ff", "#efdbff", "#d3adf7", "#b37feb", "#9254de", "#722ed1", "#531dab", "#391085", "#22075e", "#120338"];
+purple.primary = purple[5];
+var magenta = ["#fff0f6", "#ffd6e7", "#ffadd2", "#ff85c0", "#f759ab", "#eb2f96", "#c41d7f", "#9e1068", "#780650", "#520339"];
+magenta.primary = magenta[5];
+var grey = ["#a6a6a6", "#999999", "#8c8c8c", "#808080", "#737373", "#666666", "#404040", "#1a1a1a", "#000000", "#000000"];
+grey.primary = grey[5];
+var redDark = ["#2a1215", "#431418", "#58181c", "#791a1f", "#a61d24", "#d32029", "#e84749", "#f37370", "#f89f9a", "#fac8c3"];
+redDark.primary = redDark[5];
+var volcanoDark = ["#2b1611", "#441d12", "#592716", "#7c3118", "#aa3e19", "#d84a1b", "#e87040", "#f3956a", "#f8b692", "#fad4bc"];
+volcanoDark.primary = volcanoDark[5];
+var orangeDark = ["#2b1d11", "#442a11", "#593815", "#7c4a15", "#aa6215", "#d87a16", "#e89a3c", "#f3b765", "#f8cf8d", "#fae3b7"];
+orangeDark.primary = orangeDark[5];
+var goldDark = ["#2b2111", "#443111", "#594214", "#7c5914", "#aa7714", "#d89614", "#e8b339", "#f3cc62", "#f8df8b", "#faedb5"];
+goldDark.primary = goldDark[5];
+var yellowDark = ["#2b2611", "#443b11", "#595014", "#7c6e14", "#aa9514", "#d8bd14", "#e8d639", "#f3ea62", "#f8f48b", "#fafab5"];
+yellowDark.primary = yellowDark[5];
+var limeDark = ["#1f2611", "#2e3c10", "#3e4f13", "#536d13", "#6f9412", "#8bbb11", "#a9d134", "#c9e75d", "#e4f88b", "#f0fab5"];
+limeDark.primary = limeDark[5];
+var greenDark = ["#162312", "#1d3712", "#274916", "#306317", "#3c8618", "#49aa19", "#6abe39", "#8fd460", "#b2e58b", "#d5f2bb"];
+greenDark.primary = greenDark[5];
+var cyanDark = ["#112123", "#113536", "#144848", "#146262", "#138585", "#13a8a8", "#33bcb7", "#58d1c9", "#84e2d8", "#b2f1e8"];
+cyanDark.primary = cyanDark[5];
+var blueDark = ["#111a2c", "#112545", "#15325b", "#15417e", "#1554ad", "#1668dc", "#3c89e8", "#65a9f3", "#8dc5f8", "#b7dcfa"];
+blueDark.primary = blueDark[5];
+var geekblueDark = ["#131629", "#161d40", "#1c2755", "#203175", "#263ea0", "#2b4acb", "#5273e0", "#7f9ef3", "#a8c1f8", "#d2e0fa"];
+geekblueDark.primary = geekblueDark[5];
+var purpleDark = ["#1a1325", "#24163a", "#301c4d", "#3e2069", "#51258f", "#642ab5", "#854eca", "#ab7ae0", "#cda8f0", "#ebd7fa"];
+purpleDark.primary = purpleDark[5];
+var magentaDark = ["#291321", "#40162f", "#551c3b", "#75204f", "#a02669", "#cb2b83", "#e0529c", "#f37fb7", "#f8a8cc", "#fad2e3"];
+magentaDark.primary = magentaDark[5];
+var greyDark = ["#151515", "#1f1f1f", "#2d2d2d", "#393939", "#494949", "#5a5a5a", "#6a6a6a", "#7b7b7b", "#888888", "#969696"];
+greyDark.primary = greyDark[5];
+
+// ../../node_modules/@ant-design/icons/es/components/IconBase.js
+var React13 = __toESM(require("react"));
+
+// ../../node_modules/@rc-component/util/es/Dom/canUseDom.js
+function canUseDom() {
+  return !!(typeof window !== "undefined" && window.document && window.document.createElement);
+}
+
+// ../../node_modules/@rc-component/util/es/Dom/contains.js
+function contains(root, n) {
+  if (!root) {
+    return false;
+  }
+  if (root.contains) {
+    return root.contains(n);
+  }
+  let node = n;
+  while (node) {
+    if (node === root) {
+      return true;
+    }
+    node = node.parentNode;
+  }
+  return false;
+}
+
+// ../../node_modules/@rc-component/util/es/Dom/dynamicCSS.js
+var APPEND_ORDER = "data-rc-order";
+var APPEND_PRIORITY = "data-rc-priority";
+var MARK_KEY = `rc-util-key`;
+var containerCache = /* @__PURE__ */ new Map();
+function getMark({
+  mark
+} = {}) {
+  if (mark) {
+    return mark.startsWith("data-") ? mark : `data-${mark}`;
+  }
+  return MARK_KEY;
+}
+function getContainer(option) {
+  if (option.attachTo) {
+    return option.attachTo;
+  }
+  const head = document.querySelector("head");
+  return head || document.body;
+}
+function getOrder(prepend) {
+  if (prepend === "queue") {
+    return "prependQueue";
+  }
+  return prepend ? "prepend" : "append";
+}
+function findStyles(container) {
+  return Array.from((containerCache.get(container) || container).children).filter((node) => node.tagName === "STYLE");
+}
+function injectCSS(css, option = {}) {
+  if (!canUseDom()) {
+    return null;
+  }
+  const {
+    csp,
+    prepend,
+    priority = 0
+  } = option;
+  const mergedOrder = getOrder(prepend);
+  const isPrependQueue = mergedOrder === "prependQueue";
+  const styleNode = document.createElement("style");
+  styleNode.setAttribute(APPEND_ORDER, mergedOrder);
+  if (isPrependQueue && priority) {
+    styleNode.setAttribute(APPEND_PRIORITY, `${priority}`);
+  }
+  if (csp?.nonce) {
+    styleNode.nonce = csp?.nonce;
+  }
+  styleNode.innerHTML = css;
+  const container = getContainer(option);
+  const {
+    firstChild
+  } = container;
+  if (prepend) {
+    if (isPrependQueue) {
+      const existStyle = (option.styles || findStyles(container)).filter((node) => {
+        if (!["prepend", "prependQueue"].includes(node.getAttribute(APPEND_ORDER))) {
+          return false;
+        }
+        const nodePriority = Number(node.getAttribute(APPEND_PRIORITY) || 0);
+        return priority >= nodePriority;
+      });
+      if (existStyle.length) {
+        container.insertBefore(styleNode, existStyle[existStyle.length - 1].nextSibling);
+        return styleNode;
+      }
+    }
+    container.insertBefore(styleNode, firstChild);
+  } else {
+    container.appendChild(styleNode);
+  }
+  return styleNode;
+}
+function findExistNode(key, option = {}) {
+  let {
+    styles
+  } = option;
+  styles ||= findStyles(getContainer(option));
+  return styles.find((node) => node.getAttribute(getMark(option)) === key);
+}
+function syncRealContainer(container, option) {
+  const cachedRealContainer = containerCache.get(container);
+  if (!cachedRealContainer || !contains(document, cachedRealContainer)) {
+    const placeholderStyle = injectCSS("", option);
+    const {
+      parentNode
+    } = placeholderStyle;
+    containerCache.set(container, parentNode);
+    container.removeChild(placeholderStyle);
+  }
+}
+function updateCSS(css, key, originOption = {}) {
+  const container = getContainer(originOption);
+  const styles = findStyles(container);
+  const option = {
+    ...originOption,
+    styles
+  };
+  syncRealContainer(container, option);
+  const existNode = findExistNode(key, option);
+  if (existNode) {
+    if (option.csp?.nonce && existNode.nonce !== option.csp?.nonce) {
+      existNode.nonce = option.csp?.nonce;
+    }
+    if (existNode.innerHTML !== css) {
+      existNode.innerHTML = css;
+    }
+    return existNode;
+  }
+  const newNode = injectCSS(css, option);
+  newNode.setAttribute(getMark(option), key);
+  return newNode;
+}
+
+// ../../node_modules/@rc-component/util/es/Dom/shadow.js
+function getRoot(ele) {
+  return ele?.getRootNode?.();
+}
+function inShadow(ele) {
+  return getRoot(ele) instanceof ShadowRoot;
+}
+function getShadowRoot(ele) {
+  return inShadow(ele) ? getRoot(ele) : null;
+}
+
+// ../../node_modules/@rc-component/util/es/warning.js
+var warned = {};
+var preWarningFns = [];
+var preMessage = (fn) => {
+  preWarningFns.push(fn);
+};
+function warning(valid, message) {
+  if (process.env.NODE_ENV !== "production" && !valid && console !== void 0) {
+    const finalMessage = preWarningFns.reduce((msg, preMessageFn) => preMessageFn(msg ?? "", "warning"), message);
+    if (finalMessage) {
+      console.error(`Warning: ${finalMessage}`);
+    }
+  }
+}
+function note(valid, message) {
+  if (process.env.NODE_ENV !== "production" && !valid && console !== void 0) {
+    const finalMessage = preWarningFns.reduce((msg, preMessageFn) => preMessageFn(msg ?? "", "note"), message);
+    if (finalMessage) {
+      console.warn(`Note: ${finalMessage}`);
+    }
+  }
+}
+function resetWarned() {
+  warned = {};
+}
+function call(method, valid, message) {
+  if (!valid && !warned[message]) {
+    method(false, message);
+    warned[message] = true;
+  }
+}
+function warningOnce(valid, message) {
+  call(warning, valid, message);
+}
+function noteOnce(valid, message) {
+  call(note, valid, message);
+}
+warningOnce.preMessage = preMessage;
+warningOnce.resetWarned = resetWarned;
+warningOnce.noteOnce = noteOnce;
+
+// ../../node_modules/@ant-design/icons/es/utils.js
+var import_react22 = __toESM(require("react"));
+function camelCase(input) {
+  return input.replace(/-(.)/g, (match, g) => g.toUpperCase());
+}
+function warning2(valid, message) {
+  warningOnce(valid, `[@ant-design/icons] ${message}`);
+}
+function isIconDefinition(target) {
+  return typeof target === "object" && typeof target.name === "string" && typeof target.theme === "string" && (typeof target.icon === "object" || typeof target.icon === "function");
+}
+function normalizeAttrs(attrs = {}) {
+  return Object.keys(attrs).reduce((acc, key) => {
+    const val = attrs[key];
+    switch (key) {
+      case "class":
+        acc.className = val;
+        delete acc.class;
+        break;
+      default:
+        delete acc[key];
+        acc[camelCase(key)] = val;
+    }
+    return acc;
+  }, {});
+}
+function generate2(node, key, rootProps) {
+  if (!rootProps) {
+    return /* @__PURE__ */ import_react22.default.createElement(node.tag, {
+      key,
+      ...normalizeAttrs(node.attrs)
+    }, (node.children || []).map((child, index) => generate2(child, `${key}-${node.tag}-${index}`)));
+  }
+  return /* @__PURE__ */ import_react22.default.createElement(node.tag, {
+    key,
+    ...normalizeAttrs(node.attrs),
+    ...rootProps
+  }, (node.children || []).map((child, index) => generate2(child, `${key}-${node.tag}-${index}`)));
+}
+function getSecondaryColor(primaryColor) {
+  return generate(primaryColor)[0];
+}
+function normalizeTwoToneColors(twoToneColor) {
+  if (!twoToneColor) {
+    return [];
+  }
+  return Array.isArray(twoToneColor) ? twoToneColor : [twoToneColor];
+}
+var iconStyles = `
+.anticon {
+  display: inline-flex;
+  align-items: center;
+  color: inherit;
+  font-style: normal;
+  line-height: 0;
+  text-align: center;
+  text-transform: none;
+  vertical-align: -0.125em;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.anticon > * {
+  line-height: 1;
+}
+
+.anticon svg {
+  display: inline-block;
+  vertical-align: inherit;
+}
+
+.anticon::before {
+  display: none;
+}
+
+.anticon .anticon-icon {
+  display: block;
+}
+
+.anticon[tabindex] {
+  cursor: pointer;
+}
+
+.anticon-spin::before,
+.anticon-spin {
+  display: inline-block;
+  -webkit-animation: loadingCircle 1s infinite linear;
+  animation: loadingCircle 1s infinite linear;
+}
+
+@-webkit-keyframes loadingCircle {
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes loadingCircle {
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+`;
+var useInsertStyles = (eleRef) => {
+  const {
+    csp,
+    prefixCls,
+    layer
+  } = (0, import_react22.useContext)(Context_default);
+  let mergedStyleStr = iconStyles;
+  if (prefixCls) {
+    mergedStyleStr = mergedStyleStr.replace(/anticon/g, prefixCls);
+  }
+  if (layer) {
+    mergedStyleStr = `@layer ${layer} {
+${mergedStyleStr}
+}`;
+  }
+  (0, import_react22.useEffect)(() => {
+    const ele = eleRef.current;
+    const shadowRoot = getShadowRoot(ele);
+    updateCSS(mergedStyleStr, "@ant-design-icons", {
+      prepend: !layer,
+      csp,
+      attachTo: shadowRoot
+    });
+  }, []);
+};
+
+// ../../node_modules/@ant-design/icons/es/components/IconBase.js
+var twoToneColorPalette = {
+  primaryColor: "#333",
+  secondaryColor: "#E6E6E6",
+  calculated: false
+};
+function setTwoToneColors({
+  primaryColor,
+  secondaryColor
+}) {
+  twoToneColorPalette.primaryColor = primaryColor;
+  twoToneColorPalette.secondaryColor = secondaryColor || getSecondaryColor(primaryColor);
+  twoToneColorPalette.calculated = !!secondaryColor;
+}
+function getTwoToneColors() {
+  return {
+    ...twoToneColorPalette
+  };
+}
+var IconBase = (props) => {
+  const {
+    icon,
+    className,
+    onClick,
+    style,
+    primaryColor,
+    secondaryColor,
+    ...restProps
+  } = props;
+  const svgRef = React13.useRef(null);
+  let colors = twoToneColorPalette;
+  if (primaryColor) {
+    colors = {
+      primaryColor,
+      secondaryColor: secondaryColor || getSecondaryColor(primaryColor)
+    };
+  }
+  useInsertStyles(svgRef);
+  warning2(isIconDefinition(icon), `icon should be icon definiton, but got ${icon}`);
+  if (!isIconDefinition(icon)) {
+    return null;
+  }
+  let target = icon;
+  if (target && typeof target.icon === "function") {
+    target = {
+      ...target,
+      icon: target.icon(colors.primaryColor, colors.secondaryColor)
+    };
+  }
+  return generate2(target.icon, `svg-${target.name}`, {
+    className,
+    onClick,
+    style,
+    "data-icon": target.name,
+    width: "1em",
+    height: "1em",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    ...restProps,
+    ref: svgRef
+  });
+};
+IconBase.displayName = "IconReact";
+IconBase.getTwoToneColors = getTwoToneColors;
+IconBase.setTwoToneColors = setTwoToneColors;
+var IconBase_default = IconBase;
+
+// ../../node_modules/@ant-design/icons/es/components/twoTonePrimaryColor.js
+function setTwoToneColor(twoToneColor) {
+  const [primaryColor, secondaryColor] = normalizeTwoToneColors(twoToneColor);
+  return IconBase_default.setTwoToneColors({
+    primaryColor,
+    secondaryColor
+  });
+}
+function getTwoToneColor() {
+  const colors = IconBase_default.getTwoToneColors();
+  if (!colors.calculated) {
+    return colors.primaryColor;
+  }
+  return [colors.primaryColor, colors.secondaryColor];
+}
+
+// ../../node_modules/@ant-design/icons/es/components/AntdIcon.js
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+setTwoToneColor(blue.primary);
+var Icon = /* @__PURE__ */ React14.forwardRef((props, ref) => {
+  const {
+    // affect outter <i>...</i>
+    className,
+    // affect inner <svg>...</svg>
+    icon,
+    spin,
+    rotate,
+    tabIndex,
+    onClick,
+    // other
+    twoToneColor,
+    ...restProps
+  } = props;
+  const {
+    prefixCls = "anticon",
+    rootClassName
+  } = React14.useContext(Context_default);
+  const classString = (0, import_clsx2.clsx)(rootClassName, prefixCls, {
+    [`${prefixCls}-${icon.name}`]: !!icon.name,
+    [`${prefixCls}-spin`]: !!spin || icon.name === "loading"
+  }, className);
+  let iconTabIndex = tabIndex;
+  if (iconTabIndex === void 0 && onClick) {
+    iconTabIndex = -1;
+  }
+  const svgStyle = rotate ? {
+    msTransform: `rotate(${rotate}deg)`,
+    transform: `rotate(${rotate}deg)`
+  } : void 0;
+  const [primaryColor, secondaryColor] = normalizeTwoToneColors(twoToneColor);
+  return /* @__PURE__ */ React14.createElement("span", _extends({
+    role: "img",
+    "aria-label": icon.name
+  }, restProps, {
+    ref,
+    tabIndex: iconTabIndex,
+    onClick,
+    className: classString
+  }), /* @__PURE__ */ React14.createElement(IconBase_default, {
+    icon,
+    primaryColor,
+    secondaryColor,
+    style: svgStyle
+  }));
+});
+Icon.getTwoToneColor = getTwoToneColor;
+Icon.setTwoToneColor = setTwoToneColor;
+if (process.env.NODE_ENV !== "production") {
+  Icon.displayName = "AntdIcon";
+}
+var AntdIcon_default = Icon;
+
+// ../../node_modules/@ant-design/icons/es/icons/PlusOutlined.js
+var React15 = __toESM(require("react"));
+
+// ../../node_modules/@ant-design/icons-svg/es/asn/PlusOutlined.js
+var PlusOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M482 152h60q8 0 8 8v704q0 8-8 8h-60q-8 0-8-8V160q0-8 8-8z" } }, { "tag": "path", "attrs": { "d": "M192 474h672q8 0 8 8v60q0 8-8 8H160q-8 0-8-8v-60q0-8 8-8z" } }] }, "name": "plus", "theme": "outlined" };
+var PlusOutlined_default = PlusOutlined;
+
+// ../../node_modules/@ant-design/icons/es/icons/PlusOutlined.js
+function _extends2() {
+  _extends2 = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends2.apply(this, arguments);
+}
+var PlusOutlined2 = (props, ref) => /* @__PURE__ */ React15.createElement(AntdIcon_default, _extends2({}, props, {
+  ref,
+  icon: PlusOutlined_default
+}));
+var RefIcon = /* @__PURE__ */ React15.forwardRef(PlusOutlined2);
+if (process.env.NODE_ENV !== "production") {
+  RefIcon.displayName = "PlusOutlined";
+}
+var PlusOutlined_default2 = RefIcon;
+
+// src/hooks/uploads/useAntdImageUpload.tsx
+var import_antd2 = require("antd");
+var import_jsx_runtime30 = require("react/jsx-runtime");
+var getBase64 = (file) => new Promise((resolve, reject) => {
+  const reader = new FileReader();
+  reader.readAsDataURL(file);
+  reader.onload = () => resolve(reader.result);
+  reader.onerror = (error) => reject(error);
+});
+var useAntdImageUpload = ({ length = 1 }) => {
+  const [fileList, setFileList] = (0, import_react23.useState)([]);
+  const [previewOpen, setPreviewOpen] = (0, import_react23.useState)(false);
+  const [previewImage, setPreviewImage] = (0, import_react23.useState)("");
+  const handlePreview = async (file) => {
+    if (!file.url && !file.preview) {
+      file.preview = await getBase64(file.originFileObj);
+    }
+    setPreviewImage(file.url || file.preview);
+    setPreviewOpen(true);
+  };
+  const handleChange = ({ fileList: newFileList }) => {
+    setFileList(
+      newFileList.map((f) => ({
+        ...f,
+        status: "done"
+        // mark done immediately
+      }))
+    );
+  };
+  const ImageBox = () => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      import_antd2.Upload,
+      {
+        listType: "picture-card",
+        fileList,
+        onPreview: handlePreview,
+        onChange: handleChange,
+        beforeUpload: () => false,
+        children: fileList.length >= length ? null : /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("button", { style: { border: 0, background: "none" }, type: "button", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(PlusOutlined_default2, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { style: { marginTop: 8 }, children: "Upload" })
+        ] })
+      }
+    ),
+    previewImage && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      import_antd2.Image,
+      {
+        style: { display: "none" },
+        preview: {
+          visible: previewOpen,
+          onVisibleChange: (visible) => setPreviewOpen(visible),
+          afterOpenChange: (visible) => !visible && setPreviewImage("")
+        },
+        src: previewImage
+      }
+    )
+  ] });
+  return { ImageBox, fileList, setFileList };
+};
+var useAntdImageUpload_default = useAntdImageUpload;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Badge,
@@ -4887,6 +6306,7 @@ var storage = {
   generatePdf,
   storage,
   useA4StatementView,
+  useAntdImageUpload,
   useApi,
   useModal,
   useSearchApiContext,