@algorithm-shift/design-system 1.2.977 → 1.2.979

package/dist/index.mjs

@@ -30425,29 +30425,230 @@ var CustomPagination = ({
 };
 var Pagination_default = CustomPagination;
 
+// src/components/DataDisplay/HistoryTimeline/HistoryTimeline.tsx
+import { useMemo as useMemo7 } from "react";
+
+// src/components/ui/accordion.tsx
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+import { jsx as jsx55, jsxs as jsxs32 } from "react/jsx-runtime";
+function Accordion2({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx55(AccordionPrimitive.Root, { "data-slot": "accordion", ...props });
+}
+function AccordionItem({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx55(
+    AccordionPrimitive.Item,
+    {
+      "data-slot": "accordion-item",
+      className: cn("border-b last:border-b-0", className),
+      ...props
+    }
+  );
+}
+function AccordionTrigger({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx55(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs32(
+    AccordionPrimitive.Trigger,
+    {
+      "data-slot": "accordion-trigger",
+      className: cn(
+        "focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx55(ChevronDown, { className: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" })
+      ]
+    }
+  ) });
+}
+function AccordionContent({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx55(
+    AccordionPrimitive.Content,
+    {
+      "data-slot": "accordion-content",
+      className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
+      ...props,
+      children: /* @__PURE__ */ jsx55("div", { className: cn("pt-0 pb-4", className), children })
+    }
+  );
+}
+
+// src/components/ui/card.tsx
+import { jsx as jsx56 } from "react/jsx-runtime";
+function Card({ className, ...props }) {
+  return /* @__PURE__ */ jsx56(
+    "div",
+    {
+      "data-slot": "card",
+      className: cn(
+        "bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx56(
+    "div",
+    {
+      "data-slot": "card-header",
+      className: cn(
+        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx56(
+    "div",
+    {
+      "data-slot": "card-title",
+      className: cn("leading-none font-semibold", className),
+      ...props
+    }
+  );
+}
+function CardContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx56(
+    "div",
+    {
+      "data-slot": "card-content",
+      className: cn("px-6", className),
+      ...props
+    }
+  );
+}
+
+// src/components/DataDisplay/HistoryTimeline/HistoryTimeline.tsx
+import { jsx as jsx57, jsxs as jsxs33 } from "react/jsx-runtime";
+function getValue(item, key) {
+  if (!key) return void 0;
+  return item[key];
+}
+var HistoryTimeline = ({
+  title = "Timeline",
+  className,
+  loading = false,
+  titleKey,
+  descriptionKey,
+  createdAtKey,
+  ...props
+}) => {
+  const data = useMemo7(() => {
+    if (Array.isArray(props.data)) {
+      return props.data;
+    }
+    return [];
+  }, [props.data]);
+  if (loading) {
+    return /* @__PURE__ */ jsx57(Card, { className: cn("w-full", className), children: /* @__PURE__ */ jsxs33(CardContent, { className: "flex items-center justify-center px-4 py-8", children: [
+      /* @__PURE__ */ jsx57(LoaderCircle, { className: "h-5 w-5 animate-spin text-muted-foreground" }),
+      /* @__PURE__ */ jsx57("span", { className: "ml-2 text-sm text-muted-foreground", children: "Loading history\u2026" })
+    ] }) });
+  }
+  if (data.length === 0) {
+    return /* @__PURE__ */ jsx57(Card, { className: cn("w-full", className), children: /* @__PURE__ */ jsx57(CardContent, { className: "px-4 py-8 text-center text-muted-foreground", children: "No history available." }) });
+  }
+  return /* @__PURE__ */ jsx57(Card, { className: cn("w-full", className), children: /* @__PURE__ */ jsx57(Accordion2, { type: "single", collapsible: true, defaultValue: "history", children: /* @__PURE__ */ jsxs33(AccordionItem, { value: "history", className: "border-0", children: [
+    /* @__PURE__ */ jsx57(CardHeader, { className: "flex flex-row items-center justify-between gap-2 border-b px-4 py-3", children: /* @__PURE__ */ jsx57(
+      AccordionTrigger,
+      {
+        className: cn(
+          "flex flex-1 items-center justify-between gap-2 p-0 text-left",
+          "hover:no-underline"
+        ),
+        children: /* @__PURE__ */ jsx57(CardTitle, { className: "text-base font-semibold", children: title })
+      }
+    ) }),
+    /* @__PURE__ */ jsx57(AccordionContent, { asChild: true, children: /* @__PURE__ */ jsx57(CardContent, { className: "px-4 py-3", children: /* @__PURE__ */ jsx57("ol", { className: "relative ml-4 border-l-2 border-[#939393] space-y-4", children: data.map((item, index) => {
+      const id = item.id ?? index;
+      const rawTitle = getValue(item, titleKey);
+      const rawDescription = getValue(item, descriptionKey);
+      const rawCreatedAt = getValue(item, createdAtKey);
+      const titleText = String(rawTitle ?? "");
+      const descriptionText = rawDescription != null ? String(rawDescription) : "";
+      const createdAtDate = rawCreatedAt != null ? new Date(rawCreatedAt) : null;
+      return /* @__PURE__ */ jsxs33("li", { className: "relative pl-4", children: [
+        /* @__PURE__ */ jsx57("span", { className: "absolute left-[-9px] top-2 flex h-4 w-4 items-center justify-center rounded-full bg-primary text-primary-foreground", children: /* @__PURE__ */ jsx57("div", { className: "bg-[#06A59A] text-white rounded-md p-[5px]", children: /* @__PURE__ */ jsx57(
+          Info,
+          {
+            className: cn(
+              "h-5 w-5 text-white"
+            )
+          }
+        ) }) }),
+        /* @__PURE__ */ jsx57(
+          Accordion2,
+          {
+            type: "single",
+            collapsible: true,
+            className: "w-full",
+            children: /* @__PURE__ */ jsxs33(AccordionItem, { value: `item-${item.id}`, className: "border-0", children: [
+              /* @__PURE__ */ jsx57(
+                AccordionTrigger,
+                {
+                  className: cn(
+                    "flex items-center justify-between gap-2 rounded-md px-2 py-1 text-left",
+                    "hover:bg-muted/60 hover:no-underline"
+                  ),
+                  children: /* @__PURE__ */ jsxs33("div", { className: "flex flex-col gap-1", children: [
+                    /* @__PURE__ */ jsx57("span", { className: "text-sm font-medium leading-none", children: titleText }),
+                    /* @__PURE__ */ jsx57("span", { className: "text-[11px] text-muted-foreground", children: new Intl.DateTimeFormat("default", {
+                      dateStyle: "medium",
+                      timeStyle: "short"
+                    }).format(createdAtDate ?? /* @__PURE__ */ new Date()) })
+                  ] })
+                }
+              ),
+              /* @__PURE__ */ jsx57(AccordionContent, { className: "pt-1", children: descriptionText && /* @__PURE__ */ jsx57("p", { className: "rounded-md bg-muted px-2 py-2 text-xs text-muted-foreground", children: descriptionText }) })
+            ] })
+          }
+        )
+      ] }, id);
+    }) }) }) })
+  ] }) }) });
+};
+var HistoryTimeline_default = HistoryTimeline;
+
 // src/components/Navigation/Tabs/Tabs.tsx
-import { useCallback as useCallback3, useMemo as useMemo7, useState as useState9 } from "react";
+import { useCallback as useCallback3, useMemo as useMemo8, useState as useState9 } from "react";
 import Link5 from "next/link";
 import { usePathname, useRouter } from "next/navigation";
 
 // src/components/ui/dialog.tsx
 import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { jsx as jsx55, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs34 } from "react/jsx-runtime";
 function Dialog({
   ...props
 }) {
-  return /* @__PURE__ */ jsx55(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
+  return /* @__PURE__ */ jsx58(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
 }
 function DialogPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx55(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
+  return /* @__PURE__ */ jsx58(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
 }
 function DialogOverlay({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx55(
+  return /* @__PURE__ */ jsx58(
     DialogPrimitive.Overlay,
     {
       "data-slot": "dialog-overlay",
@@ -30465,9 +30666,9 @@ function DialogContent({
   showCloseButton = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs32(DialogPortal, { "data-slot": "dialog-portal", children: [
-    /* @__PURE__ */ jsx55(DialogOverlay, {}),
-    /* @__PURE__ */ jsxs32(
+  return /* @__PURE__ */ jsxs34(DialogPortal, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ jsx58(DialogOverlay, {}),
+    /* @__PURE__ */ jsxs34(
       DialogPrimitive.Content,
       {
         "data-slot": "dialog-content",
@@ -30478,14 +30679,14 @@ function DialogContent({
         ...props,
         children: [
           children,
-          showCloseButton && /* @__PURE__ */ jsxs32(
+          showCloseButton && /* @__PURE__ */ jsxs34(
             DialogPrimitive.Close,
             {
               "data-slot": "dialog-close",
               className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
               children: [
-                /* @__PURE__ */ jsx55(X, {}),
-                /* @__PURE__ */ jsx55("span", { className: "sr-only", children: "Close" })
+                /* @__PURE__ */ jsx58(X, {}),
+                /* @__PURE__ */ jsx58("span", { className: "sr-only", children: "Close" })
               ]
             }
           )
@@ -30495,7 +30696,7 @@ function DialogContent({
   ] });
 }
 function DialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx55(
+  return /* @__PURE__ */ jsx58(
     "div",
     {
       "data-slot": "dialog-header",
@@ -30505,7 +30706,7 @@ function DialogHeader({ className, ...props }) {
   );
 }
 function DialogFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx55(
+  return /* @__PURE__ */ jsx58(
     "div",
     {
       "data-slot": "dialog-footer",
@@ -30521,7 +30722,7 @@ function DialogTitle({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx55(
+  return /* @__PURE__ */ jsx58(
     DialogPrimitive.Title,
     {
       "data-slot": "dialog-title",
@@ -30534,7 +30735,7 @@ function DialogDescription({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx55(
+  return /* @__PURE__ */ jsx58(
     DialogPrimitive.Description,
     {
       "data-slot": "dialog-description",
@@ -30582,7 +30783,7 @@ function showSonnerToast({
 }
 
 // src/components/Navigation/Tabs/Tabs.tsx
-import { Fragment as Fragment22, jsx as jsx56, jsxs as jsxs33 } from "react/jsx-runtime";
+import { Fragment as Fragment22, jsx as jsx59, jsxs as jsxs35 } from "react/jsx-runtime";
 var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuilder = false, source, parentKey, menuNameKey, menuUrlKey, loading, bgActiveColor, textActiveColor }) => {
   const [openIndex, setOpenIndex] = useState9(null);
   const currentPathname = usePathname();
@@ -30618,7 +30819,7 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
     });
     return sortMenus(rootMenus);
   }
-  const rawTabs = useMemo7(() => {
+  const rawTabs = useMemo8(() => {
     if (!Array.isArray(tabs)) return [];
     if (source === "manual") return Array.isArray(tabs) ? tabs : [];
     return groupMenus(tabs);
@@ -30681,13 +30882,13 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
       border: active && textActiveColor ? `1px solid ${textActiveColor}` : void 0
     };
     if (Array.isArray(tab.children) && tab.children.length > 0 && tab.isDropDown) {
-      return /* @__PURE__ */ jsxs33(
+      return /* @__PURE__ */ jsxs35(
         DropdownMenu,
         {
           open: openIndex === index,
           onOpenChange: (open) => setOpenIndex(open ? index : null),
           children: [
-            /* @__PURE__ */ jsxs33(
+            /* @__PURE__ */ jsxs35(
               DropdownMenuTrigger,
               {
                 className: `${finalClasses} inline-flex items-center gap-1`,
@@ -30701,11 +30902,11 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
                 style: finalStyle,
                 children: [
                   tab.header,
-                  /* @__PURE__ */ jsx56(ChevronDown, { className: "h-4 w-4 opacity-80" })
+                  /* @__PURE__ */ jsx59(ChevronDown, { className: "h-4 w-4 opacity-80" })
                 ]
               }
             ),
-            /* @__PURE__ */ jsx56(
+            /* @__PURE__ */ jsx59(
               DropdownMenuContent,
               {
                 align: "start",
@@ -30718,12 +30919,12 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
                 onMouseLeave: () => {
                   timeout = setTimeout(() => setOpenIndex(null), 150);
                 },
-                children: tab.children.map((item, index2) => /* @__PURE__ */ jsx56(
+                children: tab.children.map((item, index2) => /* @__PURE__ */ jsx59(
                   DropdownMenuItem,
                   {
                     asChild: true,
                     className: "cursor-pointer rounded-sm px-3 py-2 text-gray-800 hover:bg-gray-100 focus:bg-gray-100",
-                    children: /* @__PURE__ */ jsx56(
+                    children: /* @__PURE__ */ jsx59(
                       Link5,
                       {
                         href: item.url || "#",
@@ -30742,7 +30943,7 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
         index
       );
     }
-    return tab.url ? /* @__PURE__ */ jsx56(
+    return tab.url ? /* @__PURE__ */ jsx59(
       Link5,
       {
         href: tab.url,
@@ -30753,14 +30954,14 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
         children: tab.header
       },
       index
-    ) : /* @__PURE__ */ jsx56("div", { className: finalClasses, style: finalStyle, role: "button", tabIndex: 0, children: tab.header }, index);
+    ) : /* @__PURE__ */ jsx59("div", { className: finalClasses, style: finalStyle, role: "button", tabIndex: 0, children: tab.header }, index);
   };
-  const renderMobileMenu = () => /* @__PURE__ */ jsxs33(DropdownMenu, { children: [
-    /* @__PURE__ */ jsxs33(DropdownMenuTrigger, { className: "flex items-center gap-2 px-3 py-2 rounded-md bg-white/10 text-white text-sm", children: [
-      /* @__PURE__ */ jsx56(Menu, { className: "h-4 w-4" }),
+  const renderMobileMenu = () => /* @__PURE__ */ jsxs35(DropdownMenu, { children: [
+    /* @__PURE__ */ jsxs35(DropdownMenuTrigger, { className: "flex items-center gap-2 px-3 py-2 rounded-md bg-white/10 text-white text-sm", children: [
+      /* @__PURE__ */ jsx59(Menu, { className: "h-4 w-4" }),
       "Menu"
     ] }),
-    /* @__PURE__ */ jsx56(
+    /* @__PURE__ */ jsx59(
       DropdownMenuContent,
       {
         align: "start",
@@ -30769,25 +30970,25 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
         children: rawTabs.map((tab, i) => {
           const hasChildren = Array.isArray(tab.children) && tab.children.length > 0 && tab.isDropDown;
           if (hasChildren) {
-            return /* @__PURE__ */ jsxs33(DropdownMenuSub, { children: [
-              /* @__PURE__ */ jsx56(DropdownMenuSubTrigger, { className: "flex items-center justify-between cursor-pointer rounded-sm px-3 py-2 text-[13px] text-foreground hover:text-foreground", children: tab.header }),
-              /* @__PURE__ */ jsx56(DropdownMenuSubContent, { className: "bg-white border shadow-lg rounded-md p-1", children: tab.children.map((item, index) => /* @__PURE__ */ jsx56(
+            return /* @__PURE__ */ jsxs35(DropdownMenuSub, { children: [
+              /* @__PURE__ */ jsx59(DropdownMenuSubTrigger, { className: "flex items-center justify-between cursor-pointer rounded-sm px-3 py-2 text-[13px] text-foreground hover:text-foreground", children: tab.header }),
+              /* @__PURE__ */ jsx59(DropdownMenuSubContent, { className: "bg-white border shadow-lg rounded-md p-1", children: tab.children.map((item, index) => /* @__PURE__ */ jsx59(
                 DropdownMenuItem,
                 {
                   asChild: true,
                   className: "cursor-pointer rounded-sm px-3 py-2 text-gray-800 hover:bg-gray-100",
-                  children: /* @__PURE__ */ jsx56(Link5, { href: item.url || "#", onClick: (e) => handleBuilderExit(e, item.url || "#"), children: item.header })
+                  children: /* @__PURE__ */ jsx59(Link5, { href: item.url || "#", onClick: (e) => handleBuilderExit(e, item.url || "#"), children: item.header })
                 },
                 item.id || index
               )) })
             ] }, i);
           }
-          return /* @__PURE__ */ jsx56(
+          return /* @__PURE__ */ jsx59(
             DropdownMenuItem,
             {
               asChild: true,
               className: "cursor-pointer rounded-sm px-3 py-2 text-[13px] text-gray-800 hover:bg-gray-100",
-              children: /* @__PURE__ */ jsx56(Link5, { href: tab.url || "#", onClick: (e) => handleBuilderExit(e, tab.url || "#"), children: tab.header })
+              children: /* @__PURE__ */ jsx59(Link5, { href: tab.url || "#", onClick: (e) => handleBuilderExit(e, tab.url || "#"), children: tab.header })
             },
             i
           );
@@ -30797,19 +30998,19 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
   ] });
   const forceMobile = canvasMode ? canvasMode === "mobile" || canvasMode === "tablet" : void 0;
   const forceDesktop = canvasMode ? canvasMode === "desktop" : void 0;
-  return /* @__PURE__ */ jsxs33(Fragment22, { children: [
-    /* @__PURE__ */ jsxs33("div", { className: cn("min-h-10", className), style, children: [
-      forceDesktop !== void 0 ? forceDesktop && /* @__PURE__ */ jsx56("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx56("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }) : /* @__PURE__ */ jsx56("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx56("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }),
-      forceMobile !== void 0 ? forceMobile && /* @__PURE__ */ jsx56("div", { children: renderMobileMenu() }) : /* @__PURE__ */ jsx56("div", { className: "flex md:hidden", children: renderMobileMenu() })
+  return /* @__PURE__ */ jsxs35(Fragment22, { children: [
+    /* @__PURE__ */ jsxs35("div", { className: cn("min-h-10", className), style, children: [
+      forceDesktop !== void 0 ? forceDesktop && /* @__PURE__ */ jsx59("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx59("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }) : /* @__PURE__ */ jsx59("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx59("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }),
+      forceMobile !== void 0 ? forceMobile && /* @__PURE__ */ jsx59("div", { children: renderMobileMenu() }) : /* @__PURE__ */ jsx59("div", { className: "flex md:hidden", children: renderMobileMenu() })
     ] }),
-    /* @__PURE__ */ jsx56(Dialog, { open: showExitDialog, onOpenChange: setShowExitDialog, children: /* @__PURE__ */ jsxs33(DialogContent, { className: "bg-[#fff]", children: [
-      /* @__PURE__ */ jsxs33(DialogHeader, { children: [
-        /* @__PURE__ */ jsx56(DialogTitle, { children: "Exit Builder?" }),
-        /* @__PURE__ */ jsx56(DialogDescription, { children: "You are about to leave the builder. Any unsaved changes may be lost." })
+    /* @__PURE__ */ jsx59(Dialog, { open: showExitDialog, onOpenChange: setShowExitDialog, children: /* @__PURE__ */ jsxs35(DialogContent, { className: "bg-[#fff]", children: [
+      /* @__PURE__ */ jsxs35(DialogHeader, { children: [
+        /* @__PURE__ */ jsx59(DialogTitle, { children: "Exit Builder?" }),
+        /* @__PURE__ */ jsx59(DialogDescription, { children: "You are about to leave the builder. Any unsaved changes may be lost." })
       ] }),
-      /* @__PURE__ */ jsxs33(DialogFooter, { children: [
-        /* @__PURE__ */ jsx56(Button, { className: "cursor-pointer bg-[#12715b] text-[#fff]", variant: "outline", onClick: () => setShowExitDialog(false), children: "Cancel" }),
-        /* @__PURE__ */ jsx56(Button, { className: "cursor-pointer border-[#12715b] border", onClick: confirmExit, children: "Yes, Exit" })
+      /* @__PURE__ */ jsxs35(DialogFooter, { children: [
+        /* @__PURE__ */ jsx59(Button, { className: "cursor-pointer bg-[#12715b] text-[#fff]", variant: "outline", onClick: () => setShowExitDialog(false), children: "Cancel" }),
+        /* @__PURE__ */ jsx59(Button, { className: "cursor-pointer border-[#12715b] border", onClick: confirmExit, children: "Yes, Exit" })
       ] })
     ] }) })
   ] });
@@ -30818,7 +31019,7 @@ var Tabs_default = Tabs;
 
 // src/components/Navigation/Stages/Stages.tsx
 import React10, { useState as useState10 } from "react";
-import { jsx as jsx57, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs36 } from "react/jsx-runtime";
 var StagesComponent = ({
   stages,
   isShowBtn,
@@ -30866,7 +31067,7 @@ var StagesComponent = ({
   };
   const isAllStagesCompleted = isCompleted || currentStage === lastStage;
   const disabled = isAllStagesCompleted || loading || saving;
-  return /* @__PURE__ */ jsx57("div", { className, style, children: /* @__PURE__ */ jsxs34(
+  return /* @__PURE__ */ jsx60("div", { className, style, children: /* @__PURE__ */ jsxs36(
     "div",
     {
       className: `
@@ -30876,8 +31077,8 @@ var StagesComponent = ({
         ${isMobile ? "p-3 sm:p-4" : "p-2"}
       `,
       children: [
-        /* @__PURE__ */ jsx57("div", { className: "flex items-center flex-shrink-0 order-1 lg:order-1", children: /* @__PURE__ */ jsx57("button", { className: "p-2 hover:bg-gray-100 rounded flex-shrink-0", children: /* @__PURE__ */ jsx57("svg", { className: "w-4 h-4 text-gray-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx57("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) }) }) }),
-        /* @__PURE__ */ jsx57(
+        /* @__PURE__ */ jsx60("div", { className: "flex items-center flex-shrink-0 order-1 lg:order-1", children: /* @__PURE__ */ jsx60("button", { className: "p-2 hover:bg-gray-100 rounded flex-shrink-0", children: /* @__PURE__ */ jsx60("svg", { className: "w-4 h-4 text-gray-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx60("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) }) }) }),
+        /* @__PURE__ */ jsx60(
           "div",
           {
             className: `
@@ -30885,7 +31086,7 @@ var StagesComponent = ({
           flex-wrap gap-2 sm:gap-2 lg:gap-3 w-full lg:w-auto
           ${isMobile ? "order-2 mt-2 lg:mt-0" : "order-2"}
         `,
-            children: loading ? Array(6).fill(null).map((_, index) => /* @__PURE__ */ jsx57(
+            children: loading ? Array(6).fill(null).map((_, index) => /* @__PURE__ */ jsx60(
               "button",
               {
                 className: `
@@ -30903,8 +31104,8 @@ var StagesComponent = ({
               const currentIndex = stages.findIndex((s) => s[dataKey] === activeStage);
               const isCompletedStage = isAllStagesCompleted || index <= currentIndex;
               const isActive = !isAllStagesCompleted && index === currentIndex;
-              return /* @__PURE__ */ jsxs34(React10.Fragment, { children: [
-                /* @__PURE__ */ jsx57(
+              return /* @__PURE__ */ jsxs36(React10.Fragment, { children: [
+                /* @__PURE__ */ jsx60(
                   "button",
                   {
                     className: `
@@ -30921,19 +31122,19 @@ var StagesComponent = ({
                     children: stage[dataLabel]
                   }
                 ),
-                !isMobile && index < stages.length - 1 && /* @__PURE__ */ jsx57("div", { className: "hidden sm:flex sm:flex-shrink-0 w-3 h-px bg-gray-300 sm:w-4" })
+                !isMobile && index < stages.length - 1 && /* @__PURE__ */ jsx60("div", { className: "hidden sm:flex sm:flex-shrink-0 w-3 h-px bg-gray-300 sm:w-4" })
               ] }, stage.id);
             })
           }
         ),
-        isShowBtn && /* @__PURE__ */ jsx57(
+        isShowBtn && /* @__PURE__ */ jsx60(
           "div",
           {
             className: `
             flex items-center flex-shrink-0 w-full lg:w-auto
             ${isMobile ? "order-3 mt-3 lg:mt-0" : "order-3"}
           `,
-            children: /* @__PURE__ */ jsx57(
+            children: /* @__PURE__ */ jsx60(
               "button",
               {
                 className: `
@@ -30955,26 +31156,26 @@ var StagesComponent = ({
 var Stages_default = StagesComponent;
 
 // src/components/Navigation/Spacer/Spacer.tsx
-import { jsx as jsx58 } from "react/jsx-runtime";
+import { jsx as jsx61 } from "react/jsx-runtime";
 var Spacer = ({ className, style }) => {
-  return /* @__PURE__ */ jsx58("div", { className: `${className}`, style });
+  return /* @__PURE__ */ jsx61("div", { className: `${className}`, style });
 };
 var Spacer_default = Spacer;
 
 // src/components/Navigation/Profile/Profile.tsx
-import { jsx as jsx59, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs37 } from "react/jsx-runtime";
 
 // src/components/Navigation/Notification/Notification.tsx
-import { jsx as jsx60, jsxs as jsxs36 } from "react/jsx-runtime";
+import { jsx as jsx63, jsxs as jsxs38 } from "react/jsx-runtime";
 
 // src/components/Navigation/Logo/Logo.tsx
-import { jsx as jsx61 } from "react/jsx-runtime";
+import { jsx as jsx64 } from "react/jsx-runtime";
 
 // src/components/ui/avatar.tsx
 import * as React11 from "react";
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
-import { jsx as jsx62 } from "react/jsx-runtime";
-var Avatar = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62(
+import { jsx as jsx65 } from "react/jsx-runtime";
+var Avatar = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx65(
   AvatarPrimitive.Root,
   {
     ref,
@@ -30986,7 +31187,7 @@ var Avatar = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
   }
 ));
 Avatar.displayName = AvatarPrimitive.Root.displayName;
-var AvatarImage = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62(
+var AvatarImage = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx65(
   AvatarPrimitive.Image,
   {
     ref,
@@ -30995,7 +31196,7 @@ var AvatarImage = React11.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 AvatarImage.displayName = AvatarPrimitive.Image.displayName;
-var AvatarFallback = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62(
+var AvatarFallback = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx65(
   AvatarPrimitive.Fallback,
   {
     ref,
@@ -31013,8 +31214,8 @@ import Link6 from "next/link";
 import Image4 from "next/image";
 import { useRouter as useRouter2 } from "next/navigation";
 import { DropdownMenuSeparator } from "@radix-ui/react-dropdown-menu";
-import { useCallback as useCallback4, useMemo as useMemo8, useState as useState11 } from "react";
-import { Fragment as Fragment23, jsx as jsx63, jsxs as jsxs37 } from "react/jsx-runtime";
+import { useCallback as useCallback4, useMemo as useMemo9, useState as useState11 } from "react";
+import { Fragment as Fragment23, jsx as jsx66, jsxs as jsxs39 } from "react/jsx-runtime";
 function Navbar({
   style,
   badgeType,
@@ -31052,29 +31253,29 @@ function Navbar({
       router.push(pendingUrl);
     }
   };
-  const formatedMenu = useMemo8(() => {
+  const formatedMenu = useMemo9(() => {
     if (source === "state" && navList && navList.length) {
       return navList.map((i) => ({ ...i, header: i.name || "Menu" }));
     }
     return list || [];
   }, [source, navList]);
-  return /* @__PURE__ */ jsxs37(Fragment23, { children: [
-    /* @__PURE__ */ jsx63(
+  return /* @__PURE__ */ jsxs39(Fragment23, { children: [
+    /* @__PURE__ */ jsx66(
       "nav",
       {
         className: "w-full border-b border-b-white dark:border-b-gray-800 dark:bg-gray-800 bg-white shadow-sm",
         style,
-        children: /* @__PURE__ */ jsxs37("div", { className: "mx-auto flex max-w-[90%] items-center justify-between px-4 py-4", children: [
-          /* @__PURE__ */ jsx63(
+        children: /* @__PURE__ */ jsxs39("div", { className: "mx-auto flex max-w-[90%] items-center justify-between px-4 py-4", children: [
+          /* @__PURE__ */ jsx66(
             Link6,
             {
               href: "/",
               onClick: (e) => handleBuilderExit(e, "/"),
               className: "flex items-center space-x-2",
-              children: imageUrl ? /* @__PURE__ */ jsx63(Image4, { src: imageUrl, alt: altText, width: 200, height: 200 }) : /* @__PURE__ */ jsx63("span", { className: "font-semibold text-blue-700", children: "Logo" })
+              children: imageUrl ? /* @__PURE__ */ jsx66(Image4, { src: imageUrl, alt: altText, width: 200, height: 200 }) : /* @__PURE__ */ jsx66("span", { className: "font-semibold text-blue-700", children: "Logo" })
             }
           ),
-          !isMobileView && /* @__PURE__ */ jsx63("div", { className: "flex items-center space-x-6 sm:hidden md:flex", children: formatedMenu.map((item) => /* @__PURE__ */ jsx63(
+          !isMobileView && /* @__PURE__ */ jsx66("div", { className: "flex items-center space-x-6 sm:hidden md:flex", children: formatedMenu.map((item) => /* @__PURE__ */ jsx66(
             Link6,
             {
               href: item.url || "#",
@@ -31084,39 +31285,39 @@ function Navbar({
             },
             item.id
           )) }),
-          /* @__PURE__ */ jsxs37("div", { className: "flex items-center space-x-3", children: [
-            !isMobileView ? /* @__PURE__ */ jsx63("div", { className: "flex-1 px-6", children: /* @__PURE__ */ jsxs37("div", { className: "relative w-full max-w-md border border-gray-300 rounded-md", children: [
-              /* @__PURE__ */ jsx63(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 dark:text-white text-gray-400" }),
-              /* @__PURE__ */ jsx63(Input, { placeholder: "Search", className: "pl-9 text-gray-400" })
-            ] }) }) : /* @__PURE__ */ jsx63(Button, { variant: "ghost", size: "icon", className: "border border-gray-400", children: /* @__PURE__ */ jsx63(Search, { className: "h-5 w-5 text-gray-400" }) }),
-            /* @__PURE__ */ jsxs37("div", { className: "relative bg-[#E9E9E9] dark:bg-gray-700 rounded-md", children: [
-              /* @__PURE__ */ jsx63(Button, { variant: "ghost", size: "icon", children: /* @__PURE__ */ jsx63(Bell, { className: "h-5 w-5 text-[#1C1B1F] dark:text-gray-400" }) }),
-              badgeType === "number" && !(hideBadgeWhenZero && badgeCount === 0) && Number(badgeCount) > 0 ? /* @__PURE__ */ jsx63("span", { className: "absolute -top-1 -right-1 flex h-4 w-4 items-center justify-center rounded-full bg-red-500 text-[10px] text-white leading-8", children: badgeCount }) : /* @__PURE__ */ jsx63("span", { className: "absolute -top-1 -right-1 flex h-2 w-2 items-center justify-center rounded-full bg-red-500" })
+          /* @__PURE__ */ jsxs39("div", { className: "flex items-center space-x-3", children: [
+            !isMobileView ? /* @__PURE__ */ jsx66("div", { className: "flex-1 px-6", children: /* @__PURE__ */ jsxs39("div", { className: "relative w-full max-w-md border border-gray-300 rounded-md", children: [
+              /* @__PURE__ */ jsx66(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 dark:text-white text-gray-400" }),
+              /* @__PURE__ */ jsx66(Input, { placeholder: "Search", className: "pl-9 text-gray-400" })
+            ] }) }) : /* @__PURE__ */ jsx66(Button, { variant: "ghost", size: "icon", className: "border border-gray-400", children: /* @__PURE__ */ jsx66(Search, { className: "h-5 w-5 text-gray-400" }) }),
+            /* @__PURE__ */ jsxs39("div", { className: "relative bg-[#E9E9E9] dark:bg-gray-700 rounded-md", children: [
+              /* @__PURE__ */ jsx66(Button, { variant: "ghost", size: "icon", children: /* @__PURE__ */ jsx66(Bell, { className: "h-5 w-5 text-[#1C1B1F] dark:text-gray-400" }) }),
+              badgeType === "number" && !(hideBadgeWhenZero && badgeCount === 0) && Number(badgeCount) > 0 ? /* @__PURE__ */ jsx66("span", { className: "absolute -top-1 -right-1 flex h-4 w-4 items-center justify-center rounded-full bg-red-500 text-[10px] text-white leading-8", children: badgeCount }) : /* @__PURE__ */ jsx66("span", { className: "absolute -top-1 -right-1 flex h-2 w-2 items-center justify-center rounded-full bg-red-500" })
             ] }),
-            /* @__PURE__ */ jsxs37(DropdownMenu, { children: [
-              /* @__PURE__ */ jsx63(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs37("div", { className: "flex items-center space-x-2", children: [
-                !isMobileView && showName && /* @__PURE__ */ jsx63("h4", { className: "text-[#000000] dark:text-gray-300 text-[13px] font-[500] mb-0", children: userName }),
-                !isMobileView ? /* @__PURE__ */ jsxs37(Fragment23, { children: [
-                  /* @__PURE__ */ jsx63(Avatar, { className: "cursor-pointer h-8 w-8 text-gray-900", children: profileType === "avatar" ? /* @__PURE__ */ jsx63(
+            /* @__PURE__ */ jsxs39(DropdownMenu, { children: [
+              /* @__PURE__ */ jsx66(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs39("div", { className: "flex items-center space-x-2", children: [
+                !isMobileView && showName && /* @__PURE__ */ jsx66("h4", { className: "text-[#000000] dark:text-gray-300 text-[13px] font-[500] mb-0", children: userName }),
+                !isMobileView ? /* @__PURE__ */ jsxs39(Fragment23, { children: [
+                  /* @__PURE__ */ jsx66(Avatar, { className: "cursor-pointer h-8 w-8 text-gray-900", children: profileType === "avatar" ? /* @__PURE__ */ jsx66(
                     AvatarImage,
                     {
                       src: "/images/appbuilder/toolset/profile.svg",
                       alt: "Profile"
                     }
-                  ) : /* @__PURE__ */ jsx63("div", { className: "w-8 h-8 bg-[#12715b] rounded-full text-[#fff] text-center text-[11px] flex items-center justify-center", children: userName && getInitials(userName) }) }),
-                  /* @__PURE__ */ jsx63(
+                  ) : /* @__PURE__ */ jsx66("div", { className: "w-8 h-8 bg-[#12715b] rounded-full text-[#fff] text-center text-[11px] flex items-center justify-center", children: userName && getInitials(userName) }) }),
+                  /* @__PURE__ */ jsx66(
                     Button,
                     {
                       variant: "ghost",
                       size: "icon",
                       className: "text-gray-900 md:hidden dark:invert",
-                      children: /* @__PURE__ */ jsx63(Menu, { className: "h-6 w-6" })
+                      children: /* @__PURE__ */ jsx66(Menu, { className: "h-6 w-6" })
                     }
                   )
-                ] }) : /* @__PURE__ */ jsx63(Button, { variant: "ghost", size: "icon", className: "text-gray-900 dark:invert", children: /* @__PURE__ */ jsx63(Menu, { className: "h-6 w-6" }) })
+                ] }) : /* @__PURE__ */ jsx66(Button, { variant: "ghost", size: "icon", className: "text-gray-900 dark:invert", children: /* @__PURE__ */ jsx66(Menu, { className: "h-6 w-6" }) })
               ] }) }),
-              /* @__PURE__ */ jsxs37(DropdownMenuContent, { align: "end", className: "bg-white dark:bg-gray-800", children: [
-                profileMenu && profileMenu.length > 0 && /* @__PURE__ */ jsx63(Fragment23, { children: profileMenu.map((item) => /* @__PURE__ */ jsx63(DropdownMenuItem, { className: "text-black dark:invert", children: /* @__PURE__ */ jsx63(
+              /* @__PURE__ */ jsxs39(DropdownMenuContent, { align: "end", className: "bg-white dark:bg-gray-800", children: [
+                profileMenu && profileMenu.length > 0 && /* @__PURE__ */ jsx66(Fragment23, { children: profileMenu.map((item) => /* @__PURE__ */ jsx66(DropdownMenuItem, { className: "text-black dark:invert", children: /* @__PURE__ */ jsx66(
                   Link6,
                   {
                     href: item.url || "#",
@@ -31124,9 +31325,9 @@ function Navbar({
                     children: item.header
                   }
                 ) }, item.id)) }),
-                /* @__PURE__ */ jsxs37("div", { className: "md:hidden", children: [
-                  /* @__PURE__ */ jsx63(DropdownMenuSeparator, {}),
-                  formatedMenu && formatedMenu.length > 0 && /* @__PURE__ */ jsx63(Fragment23, { children: formatedMenu.map((item) => /* @__PURE__ */ jsx63(DropdownMenuItem, { className: "text-black dark:invert", children: /* @__PURE__ */ jsx63(
+                /* @__PURE__ */ jsxs39("div", { className: "md:hidden", children: [
+                  /* @__PURE__ */ jsx66(DropdownMenuSeparator, {}),
+                  formatedMenu && formatedMenu.length > 0 && /* @__PURE__ */ jsx66(Fragment23, { children: formatedMenu.map((item) => /* @__PURE__ */ jsx66(DropdownMenuItem, { className: "text-black dark:invert", children: /* @__PURE__ */ jsx66(
                     Link6,
                     {
                       href: item.url || "#",
@@ -31141,21 +31342,21 @@ function Navbar({
         ] })
       }
     ),
-    /* @__PURE__ */ jsx63(Dialog, { open: showExitDialog, onOpenChange: setShowExitDialog, children: /* @__PURE__ */ jsxs37(DialogContent, { className: "bg-[#fff]", children: [
-      /* @__PURE__ */ jsxs37(DialogHeader, { children: [
-        /* @__PURE__ */ jsx63(DialogTitle, { children: "Exit Builder?" }),
-        /* @__PURE__ */ jsx63(DialogDescription, { children: "You are about to leave the builder. Any unsaved changes may be lost." })
+    /* @__PURE__ */ jsx66(Dialog, { open: showExitDialog, onOpenChange: setShowExitDialog, children: /* @__PURE__ */ jsxs39(DialogContent, { className: "bg-[#fff]", children: [
+      /* @__PURE__ */ jsxs39(DialogHeader, { children: [
+        /* @__PURE__ */ jsx66(DialogTitle, { children: "Exit Builder?" }),
+        /* @__PURE__ */ jsx66(DialogDescription, { children: "You are about to leave the builder. Any unsaved changes may be lost." })
       ] }),
-      /* @__PURE__ */ jsxs37(DialogFooter, { children: [
-        /* @__PURE__ */ jsx63(Button, { className: "cursor-pointer bg-[#12715b] text-[#fff]", variant: "outline", onClick: () => setShowExitDialog(false), children: "Cancel" }),
-        /* @__PURE__ */ jsx63(Button, { className: "cursor-pointer border-[#12715b] border", onClick: confirmExit, children: "Yes, Exit" })
+      /* @__PURE__ */ jsxs39(DialogFooter, { children: [
+        /* @__PURE__ */ jsx66(Button, { className: "cursor-pointer bg-[#12715b] text-[#fff]", variant: "outline", onClick: () => setShowExitDialog(false), children: "Cancel" }),
+        /* @__PURE__ */ jsx66(Button, { className: "cursor-pointer border-[#12715b] border", onClick: confirmExit, children: "Yes, Exit" })
       ] })
     ] }) })
   ] });
 }
 
 // src/components/Chart/BarChart.tsx
-import React12, { useEffect as useEffect25, useMemo as useMemo9, useState as useState12, useCallback as useCallback5 } from "react";
+import React12, { useEffect as useEffect25, useMemo as useMemo10, useState as useState12, useCallback as useCallback5 } from "react";
 import axios2 from "axios";
 import {
   BarChart,
@@ -31169,7 +31370,7 @@ import {
   ResponsiveContainer,
   Legend
 } from "recharts";
-import { jsx as jsx64, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx67, jsxs as jsxs40 } from "react/jsx-runtime";
 var getRandomColor = () => {
   const palette = [
     "#2563eb",
@@ -31247,7 +31448,8 @@ var ChartComponent = ({
         page: page.toString(),
         limit: limit.toString()
       });
-      const res = await axios2.get(`${apiUrl}?${params.toString()}`, {
+      const axiosClient = props.axiosInstance ?? axios2;
+      const res = await axiosClient.get(`${apiUrl}?${params.toString()}`, {
         withCredentials: true
       });
       if (!cancelled) {
@@ -31282,7 +31484,7 @@ var ChartComponent = ({
     if (rawMeta && (newPage < 1 || newPage > rawMeta.pages)) return;
     setCurrentPage(newPage);
   };
-  const data = useMemo9(() => {
+  const data = useMemo10(() => {
     if (!Array.isArray(effectiveData) || effectiveData.length === 0 || !dataKey || !dataLabel) {
       return [];
     }
@@ -31295,27 +31497,27 @@ var ChartComponent = ({
   const chartType = props.chartType || "bar";
   const legendsPosition = ["middle", "bottom"].includes(props.legendsPosition) ? props.legendsPosition : "top";
   if (effectiveLoading || data.length === 0) {
-    return /* @__PURE__ */ jsxs38(
+    return /* @__PURE__ */ jsxs40(
       "div",
       {
         className: `relative flex flex-col w-full h-[300px] md:h-[400px] bg-gradient-to-br from-gray-50 to-gray-100 rounded-xl p-6 ${className}`,
         style,
         children: [
-          /* @__PURE__ */ jsx64("div", { className: "mb-6 flex justify-center", children: /* @__PURE__ */ jsxs38("div", { className: "inline-flex items-center space-x-2 bg-white/90 px-6 py-2.5 rounded-xl backdrop-blur-sm border border-gray-200 shadow-lg", children: [
-            /* @__PURE__ */ jsx64("div", { className: "w-5 h-5 border-2 border-gray-400 border-t-blue-500 rounded-full animate-spin" }),
-            /* @__PURE__ */ jsx64("span", { className: "text-sm font-medium text-gray-700 bg-gradient-to-r from-gray-300 bg-clip-text animate-pulse", children: "Loading chart data..." })
+          /* @__PURE__ */ jsx67("div", { className: "mb-6 flex justify-center", children: /* @__PURE__ */ jsxs40("div", { className: "inline-flex items-center space-x-2 bg-white/90 px-6 py-2.5 rounded-xl backdrop-blur-sm border border-gray-200 shadow-lg", children: [
+            /* @__PURE__ */ jsx67("div", { className: "w-5 h-5 border-2 border-gray-400 border-t-blue-500 rounded-full animate-spin" }),
+            /* @__PURE__ */ jsx67("span", { className: "text-sm font-medium text-gray-700 bg-gradient-to-r from-gray-300 bg-clip-text animate-pulse", children: "Loading chart data..." })
           ] }) }),
-          /* @__PURE__ */ jsx64("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/60 to-transparent animate-shimmer rounded-xl" }),
-          /* @__PURE__ */ jsx64("div", { className: "flex-1 relative w-full h-full min-h-[240px] md:min-h-[320px] bg-white/80 rounded-lg border border-gray-200/50 shadow-sm", children: /* @__PURE__ */ jsx64("div", { className: "absolute bottom-0 left-4 right-4 flex gap-2 h-[200px] md:h-[280px] justify-center items-end", children: [...Array(20)].map((_, idx) => {
+          /* @__PURE__ */ jsx67("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/60 to-transparent animate-shimmer rounded-xl" }),
+          /* @__PURE__ */ jsx67("div", { className: "flex-1 relative w-full h-full min-h-[240px] md:min-h-[320px] bg-white/80 rounded-lg border border-gray-200/50 shadow-sm", children: /* @__PURE__ */ jsx67("div", { className: "absolute bottom-0 left-4 right-4 flex gap-2 h-[200px] md:h-[280px] justify-center items-end", children: [...Array(20)].map((_, idx) => {
             const randomHeight = `${Math.floor(Math.random() * 76) + 20}%`;
-            return /* @__PURE__ */ jsxs38(
+            return /* @__PURE__ */ jsxs40(
               "div",
               {
                 className: `relative w-10 md:w-12 flex-1 max-w-[48px] rounded-t-lg bg-gradient-to-t from-gray-100 via-gray-200 to-transparent shadow-lg border border-gray-200/50 animate-slide-up stagger-${idx} overflow-hidden`,
                 style: { height: randomHeight, animationDelay: `${idx * 0.08}s` },
                 children: [
-                  /* @__PURE__ */ jsx64("div", { className: "absolute inset-0 bg-gradient-to-r from-white/40 via-transparent to-white/40 animate-shimmer-bar" }),
-                  /* @__PURE__ */ jsx64("div", { className: "absolute bottom-1 left-1/2 w-4 h-1 rounded-full transform -translate-x-1/2 blur-sm" })
+                  /* @__PURE__ */ jsx67("div", { className: "absolute inset-0 bg-gradient-to-r from-white/40 via-transparent to-white/40 animate-shimmer-bar" }),
+                  /* @__PURE__ */ jsx67("div", { className: "absolute bottom-1 left-1/2 w-4 h-1 rounded-full transform -translate-x-1/2 blur-sm" })
                 ]
               },
               `bar-${idx}`
@@ -31325,9 +31527,9 @@ var ChartComponent = ({
       }
     );
   }
-  return /* @__PURE__ */ jsxs38("div", { className: `${className} h-[450px]`, style, children: [
-    isPaginationEnabled && rawMeta && /* @__PURE__ */ jsxs38("div", { className: "flex items-center justify-between mb-4 px-2", children: [
-      /* @__PURE__ */ jsxs38("div", { className: "text-sm text-gray-600 hidden sm:block", children: [
+  return /* @__PURE__ */ jsxs40("div", { className: `${className} h-[450px]`, style, children: [
+    isPaginationEnabled && rawMeta && /* @__PURE__ */ jsxs40("div", { className: "flex items-center justify-between mb-4 px-2", children: [
+      /* @__PURE__ */ jsxs40("div", { className: "text-sm text-gray-600 hidden sm:block", children: [
         "Page ",
         rawMeta.page,
         " of ",
@@ -31336,52 +31538,52 @@ var ChartComponent = ({
         rawMeta.total.toLocaleString(),
         " total records)"
       ] }),
-      /* @__PURE__ */ jsxs38("div", { className: "flex items-center space-x-2 sm:hidden w-full justify-center", children: [
-        /* @__PURE__ */ jsx64(
+      /* @__PURE__ */ jsxs40("div", { className: "flex items-center space-x-2 sm:hidden w-full justify-center", children: [
+        /* @__PURE__ */ jsx67(
           "button",
           {
             onClick: () => handlePageChange(currentPage - 1),
             disabled: currentPage === 1 || localLoading,
             className: "flex-1 px-3 py-2 text-xs font-medium rounded-lg border bg-white shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition-all duration-200 flex items-center justify-center space-x-1 min-w-0",
-            children: /* @__PURE__ */ jsx64("span", { children: "\u2190 Prev" })
+            children: /* @__PURE__ */ jsx67("span", { children: "\u2190 Prev" })
           }
         ),
-        /* @__PURE__ */ jsx64("span", { className: "px-2 py-2 text-xs font-semibold text-gray-700 min-w-[36px] text-center flex-shrink-0", children: currentPage }),
-        /* @__PURE__ */ jsx64(
+        /* @__PURE__ */ jsx67("span", { className: "px-2 py-2 text-xs font-semibold text-gray-700 min-w-[36px] text-center flex-shrink-0", children: currentPage }),
+        /* @__PURE__ */ jsx67(
           "button",
           {
             onClick: () => handlePageChange(currentPage + 1),
             disabled: currentPage >= rawMeta.pages || localLoading,
             className: "flex-1 px-3 py-2 text-xs font-medium rounded-lg border bg-white shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition-all duration-200 flex items-center justify-center space-x-1 min-w-0",
-            children: /* @__PURE__ */ jsx64("span", { children: "Next \u2192" })
+            children: /* @__PURE__ */ jsx67("span", { children: "Next \u2192" })
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs38("div", { className: "flex items-center space-x-2 hidden sm:flex", children: [
-        /* @__PURE__ */ jsx64(
+      /* @__PURE__ */ jsxs40("div", { className: "flex items-center space-x-2 hidden sm:flex", children: [
+        /* @__PURE__ */ jsx67(
           "button",
           {
             onClick: () => handlePageChange(currentPage - 1),
             disabled: currentPage === 1 || localLoading,
             className: "px-3 py-1.5 text-sm font-medium rounded-lg border bg-white shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition-all duration-200 flex items-center space-x-1",
-            children: /* @__PURE__ */ jsx64("span", { children: "\u2190 Prev" })
+            children: /* @__PURE__ */ jsx67("span", { children: "\u2190 Prev" })
           }
         ),
-        /* @__PURE__ */ jsx64("span", { className: "px-3 py-1 text-sm font-medium text-gray-700", children: currentPage }),
-        /* @__PURE__ */ jsx64(
+        /* @__PURE__ */ jsx67("span", { className: "px-3 py-1 text-sm font-medium text-gray-700", children: currentPage }),
+        /* @__PURE__ */ jsx67(
           "button",
           {
             onClick: () => handlePageChange(currentPage + 1),
             disabled: currentPage >= rawMeta.pages || localLoading,
             className: "px-3 py-1.5 text-sm font-medium rounded-lg border bg-white shadow-sm hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition-all duration-200 flex items-center space-x-1",
-            children: /* @__PURE__ */ jsx64("span", { children: "Next \u2192" })
+            children: /* @__PURE__ */ jsx67("span", { children: "Next \u2192" })
           }
         )
       ] })
     ] }),
-    /* @__PURE__ */ jsx64(ResponsiveContainer, { width: "100%", height: "100%", children: chartType === "bar" ? /* @__PURE__ */ jsxs38(BarChart, { data, children: [
-      /* @__PURE__ */ jsx64(CartesianGrid, { strokeDasharray: "3 3" }),
-      /* @__PURE__ */ jsx64(
+    /* @__PURE__ */ jsx67(ResponsiveContainer, { width: "100%", height: "100%", children: chartType === "bar" ? /* @__PURE__ */ jsxs40(BarChart, { data, children: [
+      /* @__PURE__ */ jsx67(CartesianGrid, { strokeDasharray: "3 3" }),
+      /* @__PURE__ */ jsx67(
         XAxis,
         {
           dataKey: dataLabel,
@@ -31399,7 +31601,7 @@ var ChartComponent = ({
           className: "hidden sm:block"
         }
       ),
-      /* @__PURE__ */ jsx64(
+      /* @__PURE__ */ jsx67(
         YAxis,
         {
           tickFormatter: (value) => `${(value / 1e3).toFixed(0)}k`,
@@ -31412,9 +31614,9 @@ var ChartComponent = ({
           width: 60
         }
       ),
-      /* @__PURE__ */ jsx64(Tooltip, { formatter: (value) => [`${value}`, "Count"] }),
-      /* @__PURE__ */ jsx64(Legend, { verticalAlign: legendsPosition, align: "center" }),
-      /* @__PURE__ */ jsx64(
+      /* @__PURE__ */ jsx67(Tooltip, { formatter: (value) => [`${value}`, "Count"] }),
+      /* @__PURE__ */ jsx67(Legend, { verticalAlign: legendsPosition, align: "center" }),
+      /* @__PURE__ */ jsx67(
         Bar,
         {
           dataKey,
@@ -31422,13 +31624,13 @@ var ChartComponent = ({
           isAnimationActive: false
         }
       )
-    ] }) : /* @__PURE__ */ jsxs38(AreaChart, { data, children: [
-      /* @__PURE__ */ jsx64("defs", { children: /* @__PURE__ */ jsxs38("linearGradient", { id: "colorCount", x1: "0", y1: "0", x2: "0", y2: "1", children: [
-        /* @__PURE__ */ jsx64("stop", { offset: "5%", stopColor: "#00695C", stopOpacity: 0.8 }),
-        /* @__PURE__ */ jsx64("stop", { offset: "95%", stopColor: "#00695C", stopOpacity: 0 })
+    ] }) : /* @__PURE__ */ jsxs40(AreaChart, { data, children: [
+      /* @__PURE__ */ jsx67("defs", { children: /* @__PURE__ */ jsxs40("linearGradient", { id: "colorCount", x1: "0", y1: "0", x2: "0", y2: "1", children: [
+        /* @__PURE__ */ jsx67("stop", { offset: "5%", stopColor: "#00695C", stopOpacity: 0.8 }),
+        /* @__PURE__ */ jsx67("stop", { offset: "95%", stopColor: "#00695C", stopOpacity: 0 })
       ] }) }),
-      /* @__PURE__ */ jsx64(CartesianGrid, { strokeDasharray: "3 3" }),
-      /* @__PURE__ */ jsx64(
+      /* @__PURE__ */ jsx67(CartesianGrid, { strokeDasharray: "3 3" }),
+      /* @__PURE__ */ jsx67(
         XAxis,
         {
           dataKey: dataLabel,
@@ -31442,7 +31644,7 @@ var ChartComponent = ({
           }
         }
       ),
-      /* @__PURE__ */ jsx64(
+      /* @__PURE__ */ jsx67(
         YAxis,
         {
           tickFormatter: (value) => `${(value / 1e3).toFixed(0)}k`,
@@ -31455,8 +31657,8 @@ var ChartComponent = ({
           width: 60
         }
       ),
-      /* @__PURE__ */ jsx64(Tooltip, { formatter: (value) => `${value}k` }),
-      /* @__PURE__ */ jsx64(
+      /* @__PURE__ */ jsx67(Tooltip, { formatter: (value) => `${value}k` }),
+      /* @__PURE__ */ jsx67(
         Area,
         {
           type: "monotone",
@@ -31473,7 +31675,7 @@ var ChartComponent = ({
 var BarChart_default = React12.memo(ChartComponent);
 
 // src/components/Chart/PieChart.tsx
-import React13, { useEffect as useEffect26, useMemo as useMemo10, useState as useState13 } from "react";
+import React13, { useEffect as useEffect26, useMemo as useMemo11, useState as useState13 } from "react";
 import axios3 from "axios";
 import {
   PieChart,
@@ -31482,7 +31684,7 @@ import {
   ResponsiveContainer as ResponsiveContainer2,
   Tooltip as Tooltip2
 } from "recharts";
-import { jsx as jsx65, jsxs as jsxs39 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs41 } from "react/jsx-runtime";
 var getRandomColor2 = () => {
   const palette = [
     "#2563eb",
@@ -31569,7 +31771,8 @@ var DonutChart = ({
     const fetchData = async () => {
       try {
         setLocalLoading(true);
-        const res = await axios3.get(apiUrl, {
+        const axiosClient = props.axiosInstance ?? axios3;
+        const res = await axiosClient.get(apiUrl, {
           withCredentials: true
         });
         if (!cancelled) {
@@ -31598,7 +31801,7 @@ var DonutChart = ({
       cancelled = true;
     };
   }, [apiUrl]);
-  const data = useMemo10(() => {
+  const data = useMemo11(() => {
     if (!Array.isArray(effectiveData) || effectiveData.length === 0) return [];
     return effectiveData.map((item) => ({
       ...item,
@@ -31607,11 +31810,11 @@ var DonutChart = ({
       [dataLabel]: item[dataLabel] ?? "Unknown"
     }));
   }, [effectiveData, dataKey, dataLabel]);
-  const total = useMemo10(
+  const total = useMemo11(
     () => data.reduce((sum, d) => sum + (d[dataKey] ?? 0), 0),
     [data, dataKey]
   );
-  const formattedTotal = useMemo10(() => {
+  const formattedTotal = useMemo11(() => {
     if (total >= 1e6) {
       return `${(total / 1e6).toFixed(1)}M`;
     }
@@ -31620,7 +31823,7 @@ var DonutChart = ({
     }
     return total.toString();
   }, [total]);
-  const chartData = useMemo10(() => {
+  const chartData = useMemo11(() => {
     if (total === 0) return data;
     const sortedData = [...data].sort((a, b) => (b[dataKey] ?? 0) - (a[dataKey] ?? 0));
     const minAngle = 360 / Math.max(12, sortedData.length);
@@ -31648,34 +31851,34 @@ var DonutChart = ({
     const timeout = setTimeout(() => setMounted(true), 100);
     return () => clearTimeout(timeout);
   }, []);
-  const renderLegends = useMemo10(() => {
+  const renderLegends = useMemo11(() => {
     if (!showLegends) return null;
-    return /* @__PURE__ */ jsx65("div", { className: "flex flex-wrap justify-center gap-2 mt-4 w-full max-w-4xl", children: chartData.map((d, index) => {
+    return /* @__PURE__ */ jsx68("div", { className: "flex flex-wrap justify-center gap-2 mt-4 w-full max-w-4xl", children: chartData.map((d, index) => {
       const actualValue = data.find(
         (item) => item[dataLabel] === d[dataLabel]
       )?.[dataKey] ?? d[dataKey];
       const displayValue = actualValue >= 1e3 ? `${(actualValue / 1e3).toFixed(0)}k` : actualValue.toLocaleString();
-      return /* @__PURE__ */ jsxs39(
+      return /* @__PURE__ */ jsxs41(
         "div",
         {
           className: "flex items-center space-x-2 rounded-lg border border-gray-200/50 px-3 py-1.5 w-[48%] sm:w-[32%] md:w-auto bg-white/80 backdrop-blur-sm shadow-sm hover:shadow-md transition-all",
           children: [
-            /* @__PURE__ */ jsx65(
+            /* @__PURE__ */ jsx68(
               "span",
               {
                 className: "inline-block w-[12px] h-[12px] rounded-full shrink-0 border-2 border-white/50",
                 style: { backgroundColor: d.color }
               }
             ),
-            /* @__PURE__ */ jsxs39("div", { className: "min-w-0 flex-1", children: [
-              /* @__PURE__ */ jsx65("span", { className: "text-gray-900 text-[11px] md:text-[13px] font-semibold block truncate leading-tight", children: d[dataLabel] }),
-              /* @__PURE__ */ jsxs39("div", { className: "flex items-center gap-1 text-xs text-gray-600 font-medium", children: [
-                /* @__PURE__ */ jsx65("span", { children: displayValue }),
-                /* @__PURE__ */ jsxs39("span", { children: [
+            /* @__PURE__ */ jsxs41("div", { className: "min-w-0 flex-1", children: [
+              /* @__PURE__ */ jsx68("span", { className: "text-gray-900 text-[11px] md:text-[13px] font-semibold block truncate leading-tight", children: d[dataLabel] }),
+              /* @__PURE__ */ jsxs41("div", { className: "flex items-center gap-1 text-xs text-gray-600 font-medium", children: [
+                /* @__PURE__ */ jsx68("span", { children: displayValue }),
+                /* @__PURE__ */ jsxs41("span", { children: [
                   (actualValue / total * 100).toFixed(1),
                   "%"
                 ] }),
-                d.isBoosted && /* @__PURE__ */ jsx65("span", { className: "text-[9px] px-1 py-0.5 bg-blue-100 text-blue-700 rounded-full", children: "min" })
+                d.isBoosted && /* @__PURE__ */ jsx68("span", { className: "text-[9px] px-1 py-0.5 bg-blue-100 text-blue-700 rounded-full", children: "min" })
               ] })
             ] })
           ]
@@ -31686,26 +31889,26 @@ var DonutChart = ({
   }, [chartData, data, dataLabel, dataKey, total, showLegends]);
   if (!mounted) return null;
   if (effectiveLoading || data.length === 0) {
-    return /* @__PURE__ */ jsxs39(
+    return /* @__PURE__ */ jsxs41(
       "div",
       {
         className: `relative flex flex-col items-center w-full h-[300px] md:h-[400px] bg-gradient-to-br from-gray-50 to-gray-100 rounded-xl p-6 ${className}`,
         style,
         children: [
-          /* @__PURE__ */ jsx65("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/60 to-transparent animate-shimmer rounded-xl" }),
-          /* @__PURE__ */ jsx65("div", { className: "mt-6 text-center", children: /* @__PURE__ */ jsxs39("div", { className: "inline-flex items-center space-x-2 bg-white/80 px-6 py-2 rounded-full backdrop-blur-sm border border-gray-200 shadow-lg", children: [
-            /* @__PURE__ */ jsx65("div", { className: "w-5 h-5 border-2 border-gray-300 border-t-blue-400 rounded-full animate-spin" }),
-            /* @__PURE__ */ jsx65("span", { className: "text-sm font-medium text-gray-600 bg-gradient-to-r from-gray-300 bg-clip-text animate-pulse", children: "Loading chart data..." })
+          /* @__PURE__ */ jsx68("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/60 to-transparent animate-shimmer rounded-xl" }),
+          /* @__PURE__ */ jsx68("div", { className: "mt-6 text-center", children: /* @__PURE__ */ jsxs41("div", { className: "inline-flex items-center space-x-2 bg-white/80 px-6 py-2 rounded-full backdrop-blur-sm border border-gray-200 shadow-lg", children: [
+            /* @__PURE__ */ jsx68("div", { className: "w-5 h-5 border-2 border-gray-300 border-t-blue-400 rounded-full animate-spin" }),
+            /* @__PURE__ */ jsx68("span", { className: "text-sm font-medium text-gray-600 bg-gradient-to-r from-gray-300 bg-clip-text animate-pulse", children: "Loading chart data..." })
           ] }) }),
-          /* @__PURE__ */ jsx65("div", { className: "flex flex-wrap justify-center gap-3 mt-8 w-full max-w-4xl", children: [...Array(18)].map((_, idx) => /* @__PURE__ */ jsxs39(
+          /* @__PURE__ */ jsx68("div", { className: "flex flex-wrap justify-center gap-3 mt-8 w-full max-w-4xl", children: [...Array(18)].map((_, idx) => /* @__PURE__ */ jsxs41(
             "div",
             {
               className: `h-10 w-[48%] sm:w-[32%] md:w-32 rounded-xl bg-gradient-to-r from-gray-200 via-gray-300/50 to-gray-200 p-3 flex items-center space-x-3 animate-slide-up stagger-${idx} shadow-sm border border-gray-200/50`,
               children: [
-                /* @__PURE__ */ jsx65("div", { className: "w-4 h-4 rounded-full bg-gradient-to-r from-blue-300 to-purple-300 animate-pulse" }),
-                /* @__PURE__ */ jsxs39("div", { className: "flex-1 space-y-1", children: [
-                  /* @__PURE__ */ jsx65("div", { className: "h-3 w-20 bg-gray-300 rounded animate-pulse" }),
-                  /* @__PURE__ */ jsx65("div", { className: "h-2.5 w-16 bg-gray-200/60 rounded animate-pulse-delayed" })
+                /* @__PURE__ */ jsx68("div", { className: "w-4 h-4 rounded-full bg-gradient-to-r from-blue-300 to-purple-300 animate-pulse" }),
+                /* @__PURE__ */ jsxs41("div", { className: "flex-1 space-y-1", children: [
+                  /* @__PURE__ */ jsx68("div", { className: "h-3 w-20 bg-gray-300 rounded animate-pulse" }),
+                  /* @__PURE__ */ jsx68("div", { className: "h-2.5 w-16 bg-gray-200/60 rounded animate-pulse-delayed" })
                 ] })
               ]
             },
@@ -31718,10 +31921,10 @@ var DonutChart = ({
   const { inner, outer } = getDynamicRadius();
   const innerRadius = inner;
   const outerRadius = outer;
-  return /* @__PURE__ */ jsxs39("div", { className: `relative flex flex-col items-center ${className}`, style, children: [
-    /* @__PURE__ */ jsxs39("div", { className: "relative w-full md:w-[75%] h-[280px] md:h-[380px] flex items-center justify-center mb-2", children: [
-      /* @__PURE__ */ jsx65(ResponsiveContainer2, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs39(PieChart, { children: [
-        /* @__PURE__ */ jsx65(
+  return /* @__PURE__ */ jsxs41("div", { className: `relative flex flex-col items-center ${className}`, style, children: [
+    /* @__PURE__ */ jsxs41("div", { className: "relative w-full md:w-[75%] h-[280px] md:h-[380px] flex items-center justify-center mb-2", children: [
+      /* @__PURE__ */ jsx68(ResponsiveContainer2, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs41(PieChart, { children: [
+        /* @__PURE__ */ jsx68(
           Pie,
           {
             data: chartData,
@@ -31734,7 +31937,7 @@ var DonutChart = ({
             isAnimationActive: true,
             animationDuration: 800,
             minAngle: 3,
-            children: chartData.map((entry, index) => /* @__PURE__ */ jsx65(
+            children: chartData.map((entry, index) => /* @__PURE__ */ jsx68(
               Cell,
               {
                 fill: entry.color,
@@ -31745,7 +31948,7 @@ var DonutChart = ({
             ))
           }
         ),
-        /* @__PURE__ */ jsx65(
+        /* @__PURE__ */ jsx68(
           Tooltip2,
           {
             formatter: (value, name, payload) => {
@@ -31768,9 +31971,9 @@ var DonutChart = ({
           }
         )
       ] }) }),
-      total > 0 && /* @__PURE__ */ jsx65("div", { className: `absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 text-center pointer-events-none ${forceMobile ? "text-xl px-2" : "text-3xl px-4"} font-bold bg-white/90 backdrop-blur-sm rounded-full py-1 shadow-lg`, children: /* @__PURE__ */ jsxs39("div", { className: "text-[#1f2937] leading-tight", children: [
+      total > 0 && /* @__PURE__ */ jsx68("div", { className: `absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 text-center pointer-events-none ${forceMobile ? "text-xl px-2" : "text-3xl px-4"} font-bold bg-white/90 backdrop-blur-sm rounded-full py-1 shadow-lg`, children: /* @__PURE__ */ jsxs41("div", { className: "text-[#1f2937] leading-tight", children: [
         formattedTotal,
-        /* @__PURE__ */ jsx65("span", { className: "text-sm md:text-base font-normal text-gray-600 block md:inline-block md:ml-1", children: "total" })
+        /* @__PURE__ */ jsx68("span", { className: "text-sm md:text-base font-normal text-gray-600 block md:inline-block md:ml-1", children: "total" })
       ] }) })
     ] }),
     renderLegends
@@ -31779,10 +31982,10 @@ var DonutChart = ({
 var PieChart_default = React13.memo(DonutChart);
 
 // src/components/Blocks/EmailComposer.tsx
-import { jsx as jsx66, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx69, jsxs as jsxs42 } from "react/jsx-runtime";
 function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc, setShowBcc, cc, setCc, bcc, setBcc, subject, setSubject, body, setBody }) {
-  return /* @__PURE__ */ jsx66("div", { className, style, children: /* @__PURE__ */ jsxs40("div", { className: "border rounded-md shadow bg-[#fff] p-4 mx-auto z-[50] relative", children: [
-    /* @__PURE__ */ jsx66("div", { className: "mb-3", children: /* @__PURE__ */ jsx66(
+  return /* @__PURE__ */ jsx69("div", { className, style, children: /* @__PURE__ */ jsxs42("div", { className: "border rounded-md shadow bg-[#fff] p-4 mx-auto z-[50] relative", children: [
+    /* @__PURE__ */ jsx69("div", { className: "mb-3", children: /* @__PURE__ */ jsx69(
       "input",
       {
         type: "email",
@@ -31791,8 +31994,8 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         required: true
       }
     ) }),
-    /* @__PURE__ */ jsx66("div", { className: "mb-3", children: /* @__PURE__ */ jsxs40("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx66(
+    /* @__PURE__ */ jsx69("div", { className: "mb-3", children: /* @__PURE__ */ jsxs42("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx69(
         "input",
         {
           type: "email",
@@ -31803,7 +32006,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
           required: true
         }
       ),
-      !showCc && /* @__PURE__ */ jsx66(
+      !showCc && /* @__PURE__ */ jsx69(
         "button",
         {
           onClick: () => setShowCc?.(true),
@@ -31811,7 +32014,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
           children: "Cc"
         }
       ),
-      !showBcc && /* @__PURE__ */ jsx66(
+      !showBcc && /* @__PURE__ */ jsx69(
         "button",
         {
           onClick: () => setShowBcc?.(true),
@@ -31820,7 +32023,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         }
       )
     ] }) }),
-    showCc && /* @__PURE__ */ jsx66("div", { className: "mb-3", children: /* @__PURE__ */ jsx66(
+    showCc && /* @__PURE__ */ jsx69("div", { className: "mb-3", children: /* @__PURE__ */ jsx69(
       "input",
       {
         type: "text",
@@ -31830,7 +32033,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]"
       }
     ) }),
-    showBcc && /* @__PURE__ */ jsx66("div", { className: "mb-3", children: /* @__PURE__ */ jsx66(
+    showBcc && /* @__PURE__ */ jsx69("div", { className: "mb-3", children: /* @__PURE__ */ jsx69(
       "input",
       {
         type: "text",
@@ -31840,7 +32043,7 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]"
       }
     ) }),
-    /* @__PURE__ */ jsx66("div", { className: "mb-3", children: /* @__PURE__ */ jsx66(
+    /* @__PURE__ */ jsx69("div", { className: "mb-3", children: /* @__PURE__ */ jsx69(
       "input",
       {
         type: "text",
@@ -31850,11 +32053,11 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
         className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]"
       }
     ) }),
-    /* @__PURE__ */ jsx66("div", { className: "mb-4", children: /* @__PURE__ */ jsx66(MyEditor, { value: body, onChange: setBody }) }),
-    /* @__PURE__ */ jsxs40("div", { className: "flex justify-end gap-2", children: [
-      /* @__PURE__ */ jsx66("button", { className: "px-4 py-2 rounded-md text-gray-600 hover:bg-gray-100", children: "Discard" }),
-      /* @__PURE__ */ jsx66("button", { className: "px-4 py-2 rounded-md border text-[#12715B] border-[#12715B]", children: "Reset" }),
-      /* @__PURE__ */ jsx66("button", { className: "px-4 py-2 rounded-md bg-[#12715B] text-white", children: "Send" })
+    /* @__PURE__ */ jsx69("div", { className: "mb-4", children: /* @__PURE__ */ jsx69(MyEditor, { value: body, onChange: setBody }) }),
+    /* @__PURE__ */ jsxs42("div", { className: "flex justify-end gap-2", children: [
+      /* @__PURE__ */ jsx69("button", { className: "px-4 py-2 rounded-md text-gray-600 hover:bg-gray-100", children: "Discard" }),
+      /* @__PURE__ */ jsx69("button", { className: "px-4 py-2 rounded-md border text-[#12715B] border-[#12715B]", children: "Reset" }),
+      /* @__PURE__ */ jsx69("button", { className: "px-4 py-2 rounded-md bg-[#12715B] text-white", children: "Send" })
     ] })
   ] }) });
 }
@@ -31862,10 +32065,10 @@ function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc
 // src/components/ui/sonner.tsx
 import { useTheme } from "next-themes";
 import { Toaster as Sonner } from "sonner";
-import { jsx as jsx67 } from "react/jsx-runtime";
+import { jsx as jsx70 } from "react/jsx-runtime";
 var Toaster = ({ ...props }) => {
   const { theme = "system" } = useTheme();
-  return /* @__PURE__ */ jsx67(
+  return /* @__PURE__ */ jsx70(
     Sonner,
     {
       theme,
@@ -31896,6 +32099,7 @@ export {
   FileInput_default as FileInput,
   Flex_default as FlexLayout,
   Grid_default as GridLayout,
+  HistoryTimeline_default as HistoryTimeline,
   Icon_default as Icon,
   Image_default as Image,
   Modal,