@northslopetech/altitude-ui 2.3.0 → 2.4.0

package/dist/index.js

@@ -65,6 +65,7 @@ __export(index_exports, {
   DatePicker: () => DatePicker,
   Doc: () => Doc,
   Dollar: () => Dollar,
+  Download: () => Download,
   DropdownMenu: () => DropdownMenu,
   DropdownMenuCheckboxItem: () => DropdownMenuCheckboxItem,
   DropdownMenuContent: () => DropdownMenuContent,
@@ -114,9 +115,11 @@ __export(index_exports, {
   MagnifyingGlass: () => MagnifyingGlass,
   Minus: () => Minus,
   MoreMenu: () => MoreMenu,
+  PdfViewer: () => PdfViewer,
   Phone: () => Phone,
   PieChart: () => PieChart,
   Plus: () => Plus,
+  Print: () => Print,
   QuestionCircle: () => QuestionCircle,
   Select: () => Select,
   SelectContent: () => SelectContent,
@@ -165,6 +168,7 @@ __export(index_exports, {
   getHeatmapColor: () => getHeatmapColor,
   getPerformanceColor: () => getPerformanceColor,
   getSeriesColor: () => getSeriesColor,
+  initializePdfWorker: () => initializePdfWorker,
   selectTriggerVariants: () => selectTriggerVariants,
   tabsVariants: () => tabsVariants,
   typographyVariants: () => typographyVariants,
@@ -1824,6 +1828,54 @@ var Logout = ({
     ]
   }
 );
+var Print = ({
+  className,
+  variant = "dark",
+  ...props
+}) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: cn(getVariantStyles(variant), className),
+    ...props,
+    children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      "path",
+      {
+        d: "M12.9 5.33333H3.1C1.938 5.33333 1 6.22667 1 7.33333V11.3333H3.8V14H12.2V11.3333H15V7.33333C15 6.22667 14.062 5.33333 12.9 5.33333ZM10.8 12.6667H5.2V9.33333H10.8V12.6667ZM12.9 8C12.515 8 12.2 7.7 12.2 7.33333C12.2 6.96667 12.515 6.66667 12.9 6.66667C13.285 6.66667 13.6 6.96667 13.6 7.33333C13.6 7.7 13.285 8 12.9 8ZM12.2 2H3.8V4.66667H12.2V2Z",
+        fill: "#161616"
+      }
+    )
+  }
+);
+var Download = ({
+  className,
+  variant = "dark",
+  ...props
+}) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  "svg",
+  {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: cn(getVariantStyles(variant), className),
+    ...props,
+    children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      "path",
+      {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15ZM11.1464 9.31042L8.3535 12.1033C8.15824 12.2986 7.84166 12.2986 7.6464 12.1033L4.8535 9.31042C4.53852 8.99543 4.76161 8.45686 5.20706 8.45686H6.99995V4.75C6.99995 4.19772 7.44767 3.75 7.99995 3.75C8.55224 3.75 8.99995 4.19772 8.99995 4.75V8.45686H10.7928C11.2383 8.45686 11.4614 8.99543 11.1464 9.31042Z",
+        fill: "#161616"
+      }
+    )
+  }
+);
 
 // src/components/ui/select.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
@@ -3003,10 +3055,294 @@ var Badge = React9.forwardRef(
 );
 Badge.displayName = "Badge";
 
-// src/components/ui/tabs.tsx
+// src/components/pdf-viewer/index.tsx
+var React14 = __toESM(require("react"));
+var import_TextLayer = require("react-pdf/dist/Page/TextLayer.css");
+
+// src/components/pdf-viewer/components/PdfDocument.tsx
 var React10 = __toESM(require("react"));
-var import_class_variance_authority9 = require("class-variance-authority");
+var import_react_pdf = require("react-pdf");
 var import_jsx_runtime14 = require("react/jsx-runtime");
+var PdfDocument = ({
+  file,
+  pageWidth,
+  enableTextLayer,
+  onLoadSuccess,
+  onLoadError
+}) => {
+  const [numPages, setNumPages] = React10.useState();
+  function handleDocumentLoadSuccess({ numPages: numPages2 }) {
+    setNumPages(numPages2);
+    onLoadSuccess?.(numPages2);
+  }
+  if (!file) {
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Typography, { variant: "body-md", className: "text-secondary", children: "No PDF available" }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    import_react_pdf.Document,
+    {
+      file,
+      onLoadSuccess: handleDocumentLoadSuccess,
+      onLoadError,
+      loading: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Typography, { variant: "body-md", className: "text-secondary", children: "Rendering PDF..." }) }),
+      error: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Typography, { variant: "body-md", className: "text-error", children: "Failed to render PDF" }) }),
+      className: "flex flex-col items-center p-4",
+      children: numPages && pageWidth > 0 && Array.from(new Array(numPages), (_, index) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        import_react_pdf.Page,
+        {
+          pageNumber: index + 1,
+          width: pageWidth,
+          className: "mb-4 shadow-sm",
+          renderTextLayer: enableTextLayer,
+          renderAnnotationLayer: false
+        },
+        `page_${index + 1}`
+      ))
+    }
+  );
+};
+PdfDocument.displayName = "PdfDocument";
+
+// src/components/pdf-viewer/components/PdfHeader.tsx
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var PdfHeader = ({
+  title,
+  onDownload,
+  onPrint
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center justify-between gap-4 px-4 py-3 bg-neutral-400 border-b border-subtle", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex-shrink min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      Typography,
+      {
+        variant: "label-md-bold",
+        className: "text-dark truncate",
+        title,
+        children: title || "Untitled Document"
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center gap-2 flex-shrink-0", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        "button",
+        {
+          onClick: onDownload,
+          className: "p-2 hover:bg-neutral-500 rounded transition-colors",
+          "aria-label": "Download PDF",
+          type: "button",
+          children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Download, { variant: "dark", className: "w-5 h-5" })
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        "button",
+        {
+          onClick: onPrint,
+          className: "p-2 hover:bg-neutral-500 rounded transition-colors",
+          "aria-label": "Print PDF",
+          type: "button",
+          children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Print, { variant: "dark", className: "w-5 h-5" })
+        }
+      )
+    ] })
+  ] });
+};
+PdfHeader.displayName = "PdfHeader";
+
+// src/components/pdf-viewer/hooks/useContainerWidth.ts
+var React11 = __toESM(require("react"));
+function useContainerWidth(padding = 32) {
+  const [containerWidth, setContainerWidth] = React11.useState(0);
+  const containerRef = React11.useRef(null);
+  const lastWidthRef = React11.useRef(0);
+  React11.useEffect(() => {
+    const element = containerRef.current;
+    if (!element) return;
+    const resizeObserver = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        const newWidth = entry.contentRect.width - padding;
+        if (Math.abs(newWidth - lastWidthRef.current) > 1) {
+          lastWidthRef.current = newWidth;
+          setContainerWidth(newWidth);
+        }
+      }
+    });
+    resizeObserver.observe(element);
+    const initialWidth = element.offsetWidth - padding;
+    lastWidthRef.current = initialWidth;
+    setContainerWidth(initialWidth);
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [padding]);
+  return { containerWidth, containerRef };
+}
+
+// src/components/pdf-viewer/hooks/usePdfDownload.ts
+var React12 = __toESM(require("react"));
+function usePdfDownload(file, title) {
+  const download = React12.useCallback(async () => {
+    if (!file) return;
+    try {
+      let blob;
+      let filename;
+      if (typeof file === "string") {
+        const response = await fetch(file);
+        blob = await response.blob();
+        filename = title || "document.pdf";
+      } else {
+        blob = file;
+        filename = title || file.name || "document.pdf";
+      }
+      const url = URL.createObjectURL(blob);
+      const link = document.createElement("a");
+      link.href = url;
+      link.download = filename;
+      link.style.display = "none";
+      document.body.appendChild(link);
+      link.click();
+      setTimeout(() => {
+        document.body.removeChild(link);
+        URL.revokeObjectURL(url);
+      }, 100);
+    } catch (error) {
+      console.error("Failed to download PDF:", error);
+    }
+  }, [file, title]);
+  return download;
+}
+
+// src/components/pdf-viewer/hooks/usePdfPrint.ts
+var React13 = __toESM(require("react"));
+function usePdfPrint(file) {
+  const [printBlobUrl, setPrintBlobUrl] = React13.useState(null);
+  const printFrameRef = React13.useRef(null);
+  const preparePrint = React13.useCallback(async () => {
+    if (!file) return;
+    try {
+      let blob;
+      if (typeof file === "string") {
+        const response = await fetch(file);
+        blob = await response.blob();
+      } else {
+        blob = file;
+      }
+      const url = URL.createObjectURL(blob);
+      setPrintBlobUrl(url);
+    } catch (error) {
+      console.error("Failed to prepare PDF for printing:", error);
+    }
+  }, [file]);
+  React13.useEffect(() => {
+    return () => {
+      if (printBlobUrl) {
+        URL.revokeObjectURL(printBlobUrl);
+      }
+    };
+  }, [printBlobUrl]);
+  const print = React13.useCallback(() => {
+    if (printFrameRef.current?.contentWindow) {
+      printFrameRef.current.contentWindow.print();
+    }
+  }, []);
+  return { printFrameRef, printBlobUrl, preparePrint, print };
+}
+
+// src/components/pdf-viewer/utils/pdfWorker.ts
+var import_react_pdf2 = require("react-pdf");
+function initializePdfWorker(workerUrl) {
+  import_react_pdf2.pdfjs.GlobalWorkerOptions.workerSrc = workerUrl;
+}
+
+// src/components/pdf-viewer/index.tsx
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var PdfViewer = React14.forwardRef(
+  ({
+    file,
+    title,
+    pageWidth,
+    onDownload,
+    onPrint,
+    onLoadSuccess,
+    onError,
+    enableTextLayer = false,
+    className,
+    ...props
+  }, ref) => {
+    const { containerWidth, containerRef } = useContainerWidth();
+    const { printFrameRef, printBlobUrl, preparePrint, print } = usePdfPrint(file);
+    const download = usePdfDownload(file, title);
+    const effectiveWidth = pageWidth || containerWidth;
+    const handleLoadSuccess = React14.useCallback(
+      async (numPages) => {
+        onLoadSuccess?.(numPages);
+        await preparePrint();
+      },
+      [onLoadSuccess, preparePrint]
+    );
+    const handleDownload = React14.useCallback(() => {
+      if (onDownload) {
+        onDownload();
+        return;
+      }
+      download();
+    }, [onDownload, download]);
+    const handlePrint = React14.useCallback(() => {
+      if (onPrint) {
+        onPrint();
+        return;
+      }
+      print();
+    }, [onPrint, print]);
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+      "div",
+      {
+        ref,
+        className: cn("h-full flex flex-col", className),
+        ...props,
+        children: [
+          printBlobUrl && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+            "iframe",
+            {
+              ref: printFrameRef,
+              src: printBlobUrl,
+              style: { display: "none" },
+              title: "PDF for printing"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+            PdfHeader,
+            {
+              title,
+              onDownload: handleDownload,
+              onPrint: handlePrint
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+            "div",
+            {
+              ref: containerRef,
+              className: "flex-1 overflow-y-auto overflow-x-hidden bg-neutral-300",
+              children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                PdfDocument,
+                {
+                  file,
+                  pageWidth: effectiveWidth,
+                  enableTextLayer,
+                  onLoadSuccess: handleLoadSuccess,
+                  onLoadError: onError
+                }
+              )
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+PdfViewer.displayName = "PdfViewer";
+
+// src/components/ui/tabs.tsx
+var React15 = __toESM(require("react"));
+var import_class_variance_authority9 = require("class-variance-authority");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var tabsVariants = (0, import_class_variance_authority9.cva)(
   "inline-flex items-center justify-start whitespace-nowrap transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-interactive focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 h-10",
   {
@@ -3020,17 +3356,17 @@ var tabsVariants = (0, import_class_variance_authority9.cva)(
     }
   }
 );
-var TabsContext = React10.createContext(
+var TabsContext = React15.createContext(
   void 0
 );
 function useTabsContext() {
-  const context = React10.useContext(TabsContext);
+  const context = React15.useContext(TabsContext);
   if (!context) {
     throw new Error("Tabs components must be used within a Tabs provider");
   }
   return context;
 }
-var Tabs = React10.forwardRef((props, ref) => {
+var Tabs = React15.forwardRef((props, ref) => {
   const {
     className,
     value,
@@ -3039,7 +3375,7 @@ var Tabs = React10.forwardRef((props, ref) => {
     children,
     ...restProps
   } = props;
-  const contextValue = React10.useMemo(
+  const contextValue = React15.useMemo(
     () => ({
       activeTab: value,
       setActiveTab: onValueChange,
@@ -3047,13 +3383,13 @@ var Tabs = React10.forwardRef((props, ref) => {
     }),
     [value, onValueChange, variant]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(TabsContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { ref, className: cn("w-full", className), ...restProps, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(TabsContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { ref, className: cn("w-full", className), ...restProps, children }) });
 });
 Tabs.displayName = "Tabs";
-var TabsList = React10.forwardRef(
+var TabsList = React15.forwardRef(
   (props, ref) => {
     const { className, children, ...restProps } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       "div",
       {
         ref,
@@ -3069,7 +3405,7 @@ TabsList.displayName = "TabsList";
 var getTabTypographyStyles = (isActive) => ({
   font: isActive ? "var(--typography-label-sm-bold)" : "var(--typography-label-sm-regular)"
 });
-var TabsTrigger = React10.forwardRef(
+var TabsTrigger = React15.forwardRef(
   (props, ref) => {
     const { className, value, disabled, style, children, ...restProps } = props;
     const { activeTab, setActiveTab, variant } = useTabsContext();
@@ -3077,22 +3413,22 @@ var TabsTrigger = React10.forwardRef(
       throw new Error("TabsTrigger must have a value prop");
     }
     const isActive = activeTab === value;
-    const tokenStyles = React10.useMemo(
+    const tokenStyles = React15.useMemo(
       () => ({
         ...getTabTypographyStyles(isActive),
         ...style
       }),
       [isActive, style]
     );
-    const triggerClassName = React10.useMemo(
+    const triggerClassName = React15.useMemo(
       () => cn(tabsVariants({ variant }), className),
       [variant, className]
     );
-    const handleClick = React10.useCallback(() => {
+    const handleClick = React15.useCallback(() => {
       if (disabled) return;
       setActiveTab(value);
     }, [disabled, setActiveTab, value]);
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       "button",
       {
         ref,
@@ -3106,13 +3442,13 @@ var TabsTrigger = React10.forwardRef(
         disabled,
         onClick: handleClick,
         ...restProps,
-        children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "pl-3 pr-6 py-2", children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "pl-3 pr-6 py-2", children })
       }
     );
   }
 );
 TabsTrigger.displayName = "TabsTrigger";
-var TabsContent = React10.forwardRef(
+var TabsContent = React15.forwardRef(
   (props, ref) => {
     const { className, value, children, ...restProps } = props;
     const { activeTab } = useTabsContext();
@@ -3123,7 +3459,7 @@ var TabsContent = React10.forwardRef(
     if (!isActive) {
       return null;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       "div",
       {
         ref,
@@ -3141,11 +3477,11 @@ var TabsContent = React10.forwardRef(
 TabsContent.displayName = "TabsContent";
 
 // src/components/ui/dropdown-menu.tsx
-var React11 = __toESM(require("react"));
+var React16 = __toESM(require("react"));
 var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var DropdownMenu = DropdownMenuPrimitive.Root;
-var DropdownMenuTrigger = React11.forwardRef(({ className, icon, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+var DropdownMenuTrigger = React16.forwardRef(({ className, icon, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
   DropdownMenuPrimitive.Trigger,
   {
     ref,
@@ -3155,7 +3491,7 @@ var DropdownMenuTrigger = React11.forwardRef(({ className, icon, children, ...pr
     ),
     ...props,
     children: [
-      icon || /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(MoreMenu, { className: "size-4" }),
+      icon || /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(MoreMenu, { className: "size-4" }),
       children
     ]
   }
@@ -3165,7 +3501,7 @@ var DropdownMenuGroup = DropdownMenuPrimitive.Group;
 var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive.Sub;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
-var DropdownMenuSubTrigger = React11.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+var DropdownMenuSubTrigger = React16.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
   DropdownMenuPrimitive.SubTrigger,
   {
     ref,
@@ -3178,12 +3514,12 @@ var DropdownMenuSubTrigger = React11.forwardRef(({ className, inset, children, .
     ...props,
     children: [
       children,
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ChevronRight, { className: "ml-auto" })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChevronRight, { className: "ml-auto" })
     ]
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
-var DropdownMenuSubContent = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var DropdownMenuSubContent = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
   DropdownMenuPrimitive.SubContent,
   {
     ref,
@@ -3195,7 +3531,7 @@ var DropdownMenuSubContent = React11.forwardRef(({ className, ...props }, ref) =
   }
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
-var DropdownMenuContent = React11.forwardRef(({ className, sideOffset = 4, align = "end", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var DropdownMenuContent = React16.forwardRef(({ className, sideOffset = 4, align = "end", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
   DropdownMenuPrimitive.Content,
   {
     ref,
@@ -3209,7 +3545,7 @@ var DropdownMenuContent = React11.forwardRef(({ className, sideOffset = 4, align
   }
 ) }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = React11.forwardRef(({ className, inset, style, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var DropdownMenuItem = React16.forwardRef(({ className, inset, style, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -3226,7 +3562,7 @@ var DropdownMenuItem = React11.forwardRef(({ className, inset, style, ...props }
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuCheckboxItem = React11.forwardRef(({ className, children, style, checked, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+var DropdownMenuCheckboxItem = React16.forwardRef(({ className, children, style, checked, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
   DropdownMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -3241,7 +3577,7 @@ var DropdownMenuCheckboxItem = React11.forwardRef(({ className, children, style,
     },
     ...props,
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         Checkbox,
         {
           checked: checked === true,
@@ -3249,12 +3585,12 @@ var DropdownMenuCheckboxItem = React11.forwardRef(({ className, children, style,
           "aria-hidden": "true"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "flex-1", children })
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "flex-1", children })
     ]
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React11.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+var DropdownMenuRadioItem = React16.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
   DropdownMenuPrimitive.RadioItem,
   {
     ref,
@@ -3268,13 +3604,13 @@ var DropdownMenuRadioItem = React11.forwardRef(({ className, children, style, ..
     },
     ...props,
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "h-2 w-2 rounded-full bg-current" }) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "h-2 w-2 rounded-full bg-current" }) }) }),
       children
     ]
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-var DropdownMenuLabel = React11.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var DropdownMenuLabel = React16.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -3287,7 +3623,7 @@ var DropdownMenuLabel = React11.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-var DropdownMenuSeparator = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+var DropdownMenuSeparator = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
   DropdownMenuPrimitive.Separator,
   {
     ref,
@@ -3300,7 +3636,7 @@ var DropdownMenuShortcut = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
     "span",
     {
       className: cn("ml-auto text-xs tracking-widest opacity-60", className),
@@ -3311,21 +3647,21 @@ var DropdownMenuShortcut = ({
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 
 // src/components/ui/charts/chart-legend.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function ChartLegend({
   items,
   x = 0,
   y = 550,
   className = ""
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("foreignObject", { x, y, width: "100%", height: "40", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("foreignObject", { x, y, width: "100%", height: "40", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     "div",
     {
       className: `flex justify-center items-center gap-6 ${className}`,
       style: { height: "100%" },
-      children: items.map(({ key, color, label }) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "w-3 h-3", style: { backgroundColor: color } }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Typography, { variant: "body-xs", children: label || key })
+      children: items.map(({ key, color, label }) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "w-3 h-3", style: { backgroundColor: color } }),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typography, { variant: "body-xs", children: label || key })
       ] }, key))
     }
   ) });
@@ -3443,12 +3779,12 @@ var formatLargeNumber = (value) => {
 };
 
 // src/components/ui/charts/chart-labels.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var createCustomXAxisLabel = (text, yOffset = 40) => {
   const CustomXAxisLabel = ({ viewBox }) => {
     if (!viewBox) return null;
     const { x, y, width } = viewBox;
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("foreignObject", { x, y: y + yOffset, width, height: 20, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex justify-center w-full", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("foreignObject", { x, y: y + yOffset, width, height: 20, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex justify-center w-full", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
   };
   CustomXAxisLabel.displayName = "CustomXAxisLabel";
   return CustomXAxisLabel;
@@ -3458,7 +3794,7 @@ var createCustomYAxisLabel = (text, leftMargin) => {
     if (!viewBox) return null;
     const { x, y, height } = viewBox;
     const offset = leftMargin ? leftMargin + 10 : 110;
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("foreignObject", { x: x - offset, y, width: 100, height, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex items-center justify-center h-full transform -rotate-90 whitespace-nowrap", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("foreignObject", { x: x - offset, y, width: 100, height, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex items-center justify-center h-full transform -rotate-90 whitespace-nowrap", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
   };
   CustomYAxisLabel.displayName = "CustomYAxisLabel";
   return CustomYAxisLabel;
@@ -3467,14 +3803,14 @@ var createCustomYAxisRightLabel = (text) => {
   const CustomYAxisRightLabel = ({ viewBox }) => {
     if (!viewBox) return null;
     const { x, y, width, height } = viewBox;
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("foreignObject", { x: x + width - 70, y, width: 120, height, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex items-center justify-center h-full transform rotate-90 whitespace-nowrap", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("foreignObject", { x: x + width - 70, y, width: 120, height, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex items-center justify-center h-full transform rotate-90 whitespace-nowrap", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
   };
   CustomYAxisRightLabel.displayName = "CustomYAxisRightLabel";
   return CustomYAxisRightLabel;
 };
 var customXAxisTick = (props) => {
   const { x, y, payload } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("g", { transform: `translate(${x},${y})`, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("g", { transform: `translate(${x},${y})`, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "foreignObject",
     {
       x: -20,
@@ -3482,12 +3818,12 @@ var customXAxisTick = (props) => {
       width: 40,
       height: 20,
       style: { overflow: "visible" },
-      children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         "div",
         {
           className: "flex items-start justify-center h-full",
           style: { overflow: "visible" },
-          children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
             Typography,
             {
               variant: "body-xs",
@@ -3502,7 +3838,7 @@ var customXAxisTick = (props) => {
 };
 var customXAxisTickRotated = (props) => {
   const { x, y, payload } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("g", { transform: `translate(${x},${y})`, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("g", { transform: `translate(${x},${y})`, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "text",
     {
       x: 0,
@@ -3521,25 +3857,25 @@ var customYAxisTick = (props) => {
   const { x, y, payload } = props;
   const text = String(payload.value);
   const estimatedWidth = Math.max(text.length * 8, 80);
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "foreignObject",
     {
       x: x - estimatedWidth + 5,
       y: y - 6,
       width: estimatedWidth,
       height: 15,
-      children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex justify-end w-full", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Typography, { variant: "body-xs", className: "text-secondary", children: payload.value }) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex justify-end w-full", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "body-xs", className: "text-secondary", children: payload.value }) })
     }
   );
 };
 
 // src/components/ui/charts/chart-tooltip.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function TooltipContainer({
   children,
   className = ""
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     "div",
     {
       className: `bg-light border border-subtle rounded p-2.5 text-dark ${className}`,
@@ -3553,10 +3889,10 @@ function TooltipItem({
   value,
   className = ""
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("br", {}),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(Typography, { variant: "label-sm", className, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("br", {}),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Typography, { variant: "label-sm", className, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "span",
         {
           className: "inline-block w-3 h-3 mr-1.5",
@@ -3574,9 +3910,9 @@ function GenericTooltip({
   items,
   className = ""
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(TooltipContainer, { className, children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Typography, { variant: "label-sm-bold", children: title }),
-    items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(TooltipContainer, { className, children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Typography, { variant: "label-sm-bold", children: title }),
+    items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       TooltipItem,
       {
         color: item.color,
@@ -3591,7 +3927,7 @@ function GenericTooltip({
 // src/components/ui/charts/bar-chart.tsx
 var import_react2 = require("react");
 var import_recharts = require("recharts");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var BarChart = (0, import_react2.forwardRef)(
   ({
     data,
@@ -3618,19 +3954,19 @@ var BarChart = (0, import_react2.forwardRef)(
     };
     const defaultLegendItems = showLegend && legendItems.length === 0 ? [{ key: yAxisKey, color: barColor, label: yAxisKey }] : legendItems;
     const hasData = data && data.length > 0;
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
       "div",
       {
         ref,
         className: `bg-light border border-subtle mx-6 ${className}`,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typography, { variant: "label-sm-bold", children: title }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Typography, { variant: "label-sm-bold", children: title }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             import_recharts.ResponsiveContainer,
             {
               width: "100%",
               height: CHART_CONSTANTS.STANDARD_HEIGHT,
-              children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
                 import_recharts.BarChart,
                 {
                   data,
@@ -3642,7 +3978,7 @@ var BarChart = (0, import_react2.forwardRef)(
                   onClick: handleClick,
                   layout,
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
                       import_recharts.XAxis,
                       {
                         dataKey: xAxisKey,
@@ -3656,7 +3992,7 @@ var BarChart = (0, import_react2.forwardRef)(
                         label: xAxisLabel ? createCustomXAxisLabel(xAxisLabel, 80) : void 0
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
                       import_recharts.YAxis,
                       {
                         axisLine: false,
@@ -3667,7 +4003,7 @@ var BarChart = (0, import_react2.forwardRef)(
                         type: yAxisType
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
                       import_recharts.Tooltip,
                       {
                         content: ({
@@ -3676,7 +4012,7 @@ var BarChart = (0, import_react2.forwardRef)(
                           label
                         }) => {
                           if (active && payload && payload.length) {
-                            return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                            return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
                               GenericTooltip,
                               {
                                 title: label?.toString(),
@@ -3692,7 +4028,7 @@ var BarChart = (0, import_react2.forwardRef)(
                         }
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
                       import_recharts.Bar,
                       {
                         dataKey: barDataKey || yAxisKey,
@@ -3700,12 +4036,12 @@ var BarChart = (0, import_react2.forwardRef)(
                         name: barDataKey || yAxisKey
                       }
                     ),
-                    showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ChartLegend, { items: defaultLegendItems })
+                    showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ChartLegend, { items: defaultLegendItems })
                   ]
                 }
               )
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
+          ) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
         ]
       }
     );
@@ -3716,7 +4052,7 @@ BarChart.displayName = "BarChart";
 // src/components/ui/charts/line-chart.tsx
 var import_react3 = require("react");
 var import_recharts2 = require("recharts");
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var LineChart = (0, import_react3.forwardRef)(
   ({
     data,
@@ -3745,19 +4081,19 @@ var LineChart = (0, import_react3.forwardRef)(
       )
     );
     const hasData = data && data.length > 0;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
       "div",
       {
         ref,
         className: `bg-light border border-subtle mx-6 ${className}`,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "label-sm-bold", children: title }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Typography, { variant: "label-sm-bold", children: title }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             import_recharts2.ResponsiveContainer,
             {
               width: "100%",
               height: CHART_CONSTANTS.STANDARD_HEIGHT,
-              children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
                 import_recharts2.LineChart,
                 {
                   data,
@@ -3768,7 +4104,7 @@ var LineChart = (0, import_react3.forwardRef)(
                   },
                   onClick: handleClick,
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                       import_recharts2.XAxis,
                       {
                         dataKey: xAxisKey,
@@ -3780,7 +4116,7 @@ var LineChart = (0, import_react3.forwardRef)(
                         label: xAxisLabel ? createCustomXAxisLabel(xAxisLabel) : void 0
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                       import_recharts2.YAxis,
                       {
                         axisLine: false,
@@ -3789,7 +4125,7 @@ var LineChart = (0, import_react3.forwardRef)(
                         label: yAxisLabel ? createCustomYAxisLabel(yAxisLabel, 40) : void 0
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                       import_recharts2.Tooltip,
                       {
                         content: ({
@@ -3798,7 +4134,7 @@ var LineChart = (0, import_react3.forwardRef)(
                           label
                         }) => {
                           if (active && payload && payload.length) {
-                            return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                            return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                               GenericTooltip,
                               {
                                 title: label?.toString(),
@@ -3814,7 +4150,7 @@ var LineChart = (0, import_react3.forwardRef)(
                         }
                       }
                     ),
-                    series.map((s, index) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+                    series.map((s, index) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
                       import_recharts2.Line,
                       {
                         type: "monotone",
@@ -3826,12 +4162,12 @@ var LineChart = (0, import_react3.forwardRef)(
                       },
                       s.dataKey
                     )),
-                    showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChartLegend, { items: defaultLegendItems })
+                    showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ChartLegend, { items: defaultLegendItems })
                   ]
                 }
               )
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
+          ) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
         ]
       }
     );
@@ -3842,7 +4178,7 @@ LineChart.displayName = "LineChart";
 // src/components/ui/charts/pie-chart.tsx
 var import_react4 = require("react");
 var import_recharts3 = require("recharts");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var PieChart = (0, import_react4.forwardRef)(
   ({
     data,
@@ -3870,20 +4206,20 @@ var PieChart = (0, import_react4.forwardRef)(
       )
     );
     const hasData = data && data.length > 0;
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
       "div",
       {
         ref,
         className: `bg-light border border-subtle mx-6 ${className}`,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Typography, { variant: "label-sm-bold", children: title }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Typography, { variant: "label-sm-bold", children: title }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
             import_recharts3.PieChart,
             {
               width: 600,
               height: CHART_CONSTANTS.LARGE_HEIGHT,
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                   import_recharts3.Pie,
                   {
                     data,
@@ -3895,7 +4231,7 @@ var PieChart = (0, import_react4.forwardRef)(
                     label: showLabels,
                     labelLine: false,
                     onClick: handleClick,
-                    children: data.map((entry, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                    children: data.map((entry, index) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                       import_recharts3.Cell,
                       {
                         fill: entry.color || getSeriesColor(index)
@@ -3904,7 +4240,7 @@ var PieChart = (0, import_react4.forwardRef)(
                     ))
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                   import_recharts3.Tooltip,
                   {
                     content: ({
@@ -3913,7 +4249,7 @@ var PieChart = (0, import_react4.forwardRef)(
                     }) => {
                       if (active && payload && payload.length && payload[0]) {
                         const data2 = payload[0].payload;
-                        return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                        return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                           GenericTooltip,
                           {
                             title: data2.name,
@@ -3931,10 +4267,10 @@ var PieChart = (0, import_react4.forwardRef)(
                     }
                   }
                 ),
-                showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ChartLegend, { items: defaultLegendItems, y: 400 })
+                showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChartLegend, { items: defaultLegendItems, y: 400 })
               ]
             }
-          ) }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
+          ) }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
         ]
       }
     );
@@ -3945,7 +4281,7 @@ PieChart.displayName = "PieChart";
 // src/components/ui/table.tsx
 var import_react5 = require("react");
 var import_react_table = require("@tanstack/react-table");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function Table({
   table,
   className,
@@ -3975,15 +4311,15 @@ function Table({
     },
     [table]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: cn("overflow-x-auto", className), children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("table", { className: "min-w-full divide-y divide-border", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("thead", { className: "bg-dark text-light", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("th", { className: "px-6 py-3 text-left", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: cn("overflow-x-auto", className), children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("table", { className: "min-w-full divide-y divide-border", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("thead", { className: "bg-dark text-light", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("th", { className: "px-6 py-3 text-left", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
         "div",
         {
           className: `flex items-center space-x-1 ${header.column.getCanSort() ? "cursor-pointer select-none" : ""}`,
           onClick: header.column.getToggleSortingHandler(),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
               Typography,
               {
                 variant: "label-xs",
@@ -3994,19 +4330,19 @@ function Table({
                 )
               }
             ),
-            header.column.getCanSort() && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { className: "ml-1", children: [
-              header.column.getIsSorted() === "asc" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ChevronUp, { className: "w-4 h-4 text-light" }),
-              header.column.getIsSorted() === "desc" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ChevronDown, { className: "w-4 h-4 text-light" })
+            header.column.getCanSort() && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "ml-1", children: [
+              header.column.getIsSorted() === "asc" && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChevronUp, { className: "w-4 h-4 text-light" }),
+              header.column.getIsSorted() === "desc" && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChevronDown, { className: "w-4 h-4 text-light" })
             ] })
           ]
         }
       ) }, header.id)) }, headerGroup.id)) }),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("tbody", { className: "bg-light divide-y divide-border", children: table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("tr", { children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Typography, { variant: "body-sm", children: (0, import_react_table.flexRender)(
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tbody", { className: "bg-light divide-y divide-border", children: table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("tr", { children: row.getVisibleCells().map((cell) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Typography, { variant: "body-sm", children: (0, import_react_table.flexRender)(
         cell.column.columnDef.cell,
         cell.getContext()
       ) }) }, cell.id)) }, row.id)) })
     ] }) }),
-    showPagination && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    showPagination && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
       "div",
       {
         className: cn(
@@ -4014,9 +4350,9 @@ function Table({
           paginationClassName
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Typography, { variant: "body-sm", className: "text-secondary", children: showingText }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center space-x-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Typography, { variant: "body-sm", className: "text-secondary", children: showingText }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center space-x-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
               Button,
               {
                 variant: "ghost",
@@ -4024,7 +4360,7 @@ function Table({
                 onClick: handlePreviousPage,
                 disabled: !table.getCanPreviousPage(),
                 className: "p-2",
-                children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ChevronLeft, { className: "w-4 h-4" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChevronLeft, { className: "w-4 h-4" })
               }
             ),
             Array.from(
@@ -4041,7 +4377,7 @@ function Table({
                   pageNumber = currentPage - 2 + i;
                 }
                 const isActive = pageNumber === currentPage;
-                return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
                   Button,
                   {
                     variant: isActive ? "default" : "ghost",
@@ -4054,11 +4390,11 @@ function Table({
                 );
               }
             ),
-            table.getPageCount() > 5 && currentPage < totalPages - 3 && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "px-1 text-secondary", children: "..." }),
-              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Typography, { variant: "body-sm", className: "text-secondary", children: totalPages })
+            table.getPageCount() > 5 && currentPage < totalPages - 3 && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "px-1 text-secondary", children: "..." }),
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Typography, { variant: "body-sm", className: "text-secondary", children: totalPages })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
               Button,
               {
                 variant: "ghost",
@@ -4066,12 +4402,12 @@ function Table({
                 onClick: handleNextPage,
                 disabled: !table.getCanNextPage(),
                 className: "p-2",
-                children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ChevronRight, { className: "w-4 h-4" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChevronRight, { className: "w-4 h-4" })
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-3 w-48", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center gap-3 w-48", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
               Typography,
               {
                 variant: "body-sm",
@@ -4079,14 +4415,14 @@ function Table({
                 children: "Rows per page:"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
               Select,
               {
                 value: table.getState().pagination.pageSize.toString(),
                 onValueChange: handlePageSizeChange,
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectTrigger, { className: "min-w-0 h-8", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectValue, {}) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectContent, { children: [10, 20, 50, 100].map((size) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectItem, { value: size.toString(), children: size }, size)) })
+                  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectTrigger, { className: "min-w-0 h-8", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectValue, {}) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectContent, { children: [10, 20, 50, 100].map((size) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SelectItem, { value: size.toString(), children: size }, size)) })
                 ]
               }
             )
@@ -4133,6 +4469,7 @@ function Table({
   DatePicker,
   Doc,
   Dollar,
+  Download,
   DropdownMenu,
   DropdownMenuCheckboxItem,
   DropdownMenuContent,
@@ -4182,9 +4519,11 @@ function Table({
   MagnifyingGlass,
   Minus,
   MoreMenu,
+  PdfViewer,
   Phone,
   PieChart,
   Plus,
+  Print,
   QuestionCircle,
   Select,
   SelectContent,
@@ -4233,6 +4572,7 @@ function Table({
   getHeatmapColor,
   getPerformanceColor,
   getSeriesColor,
+  initializePdfWorker,
   selectTriggerVariants,
   tabsVariants,
   typographyVariants,