@algorithm-shift/design-system 1.2.90 → 1.2.92

package/dist/index.mjs

@@ -27678,7 +27678,8 @@ function useLazyDropdown(config) {
     const limit = PAGE_SIZE;
     const params = { page: pageNum, limit };
     if (term) params[configRef.current.dataLabel ?? "search"] = term;
-    const res = await axios.get(configRef.current.apiUrl, {
+    const axiosClient = configRef.current.axiosInstance ?? axios;
+    const res = await axiosClient.get(configRef.current.apiUrl, {
       params,
       withCredentials: true
     });
@@ -27726,7 +27727,8 @@ function useLazyDropdown(config) {
     if (!configRef.current.apiUrl) return [];
     try {
       setLoading(true);
-      const res = await axios.get(configRef.current.apiUrl, {
+      const axiosClient = configRef.current.axiosInstance ?? axios;
+      const res = await axiosClient.get(configRef.current.apiUrl, {
         params: { [configRef.current.dataKey]: configRef.current.value },
         withCredentials: true
       });
@@ -27802,7 +27804,8 @@ function LazySelectDropdown({
   pageSize,
   dataKey = "id",
   dataLabel = "name",
-  errorMessage
+  errorMessage,
+  axiosInstance
 }) {
   const [isOpen, setIsOpen] = useState5(false);
   const [searchTerm, setSearchTerm] = useState5("");
@@ -27824,7 +27827,8 @@ function LazySelectDropdown({
     dataKey,
     dataLabel,
     initialData: options || [],
-    value
+    value,
+    axiosInstance
   });
   const selectedOption = lazyOptions.find((opt) => opt.value === value);
   useEffect14(() => {
@@ -28913,7 +28917,7 @@ var MultiSelect = ({
 var MultiSelect_default = MultiSelect;
 
 // src/components/ui/data-table.tsx
-import * as React9 from "react";
+import * as React10 from "react";
 import { faEllipsisH } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon as FontAwesomeIcon3 } from "@fortawesome/react-fontawesome";
 import {
@@ -29013,6 +29017,7 @@ function TableCell({ className, ...props }) {
 import { createColumnHelper } from "@tanstack/react-table";
 
 // src/lib/table/cellRendererFactory.tsx
+import React9 from "react";
 import Image2 from "next/image";
 
 // src/lib/dayjs-setup.ts
@@ -29093,6 +29098,22 @@ var getContrastColor = (bg) => {
   const brightness = (r * 299 + g * 587 + b * 114) / 1e3;
   return brightness > 160 ? "#000000" : "#FFFFFF";
 };
+var sanitizeValue = (val) => {
+  if (val == null) return null;
+  if (React9.isValidElement(val)) return val;
+  if (typeof val === "string" || typeof val === "number") return val;
+  if (Array.isArray(val)) return val.map((v, i) => /* @__PURE__ */ jsx52(React9.Fragment, { children: sanitizeValue(v) }, i));
+  if (typeof val === "object") {
+    if ("name" in val && typeof val.name === "string") return val.name;
+    if ("label" in val && typeof val.label === "string") return val.label;
+    try {
+      return JSON.stringify(val);
+    } catch {
+      return "[object]";
+    }
+  }
+  return String(val);
+};
 var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers = {}, format2, customFormatters = {}) => {
   const formattedValue = valueFormatter(value, format2, customFormatters);
   switch (renderer) {
@@ -29244,13 +29265,15 @@ var useDynamicColumns = (config, customRenderers = {}, customFormatters = {}) =>
   return config.columns.map((col) => {
     const accessorKey = col.accessorKey ?? col.id;
     const accessorFn = (row) => {
+      if (!row) return null;
       if (Object.prototype.hasOwnProperty.call(row, accessorKey)) {
-        return row[accessorKey];
+        return sanitizeValue(row[accessorKey]);
       }
       if (accessorKey.includes(".")) {
-        return getValueByPath(row, accessorKey);
+        const val = getValueByPath(row, accessorKey);
+        return sanitizeValue(val);
       }
-      return row[accessorKey];
+      return sanitizeValue(row[accessorKey]);
     };
     return columnHelper.accessor(accessorFn, {
       id: col.id ?? accessorKey,
@@ -29295,13 +29318,13 @@ function DataTable({
   onDeleteRow,
   rowActions
 }) {
-  const [columnFilters, setColumnFilters] = React9.useState([]);
-  const [columnVisibility, setColumnVisibility] = React9.useState({});
-  const [manualSort, setManualSort] = React9.useState(null);
-  const [searchTerm, setSearchTerm] = React9.useState("");
+  const [columnFilters, setColumnFilters] = React10.useState([]);
+  const [columnVisibility, setColumnVisibility] = React10.useState({});
+  const [manualSort, setManualSort] = React10.useState(null);
+  const [searchTerm, setSearchTerm] = React10.useState("");
   const dynamicCols = useDynamicColumns({ columns });
   const table = useReactTable({
-    data,
+    data: data ?? [],
     columns: dynamicCols,
     state: {
       columnFilters,
@@ -29514,7 +29537,7 @@ function DataTable({
         return /* @__PURE__ */ jsxs31(
           TableCell,
           {
-            className: `${meta?.cellClass ?? ""} ${isClickable ? "cursor-pointer hover:bg-gray-100" : ""} relative`,
+            className: `${meta?.cellClass ?? ""} ${isClickable ? "cursor-pointer hover:bg-gray-100 underline text-blue-500" : ""} relative`,
             style: meta?.cellStyle,
             onClick: () => {
               if (isClickable && onCellClick) {
@@ -29863,6 +29886,7 @@ import Link5 from "next/link";
 import { useRouter } from "next/navigation";
 import { Fragment as Fragment21, jsx as jsx57, jsxs as jsxs34 } from "react/jsx-runtime";
 var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuilder = false, source, parentKey, menuNameKey, menuUrlKey, loading }) => {
+  const [openIndex, setOpenIndex] = useState8(null);
   function groupMenus(menus = []) {
     const menuMap = /* @__PURE__ */ new Map();
     menus.forEach((menu) => {
@@ -29926,40 +29950,69 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
       router.push(pendingUrl);
     }
   };
+  let timeout;
   const renderDesktopTab = (tab, index) => {
     const finalClasses = [baseClasses, isActive(tab.url) ? activeClasses : hoverClasses, tab.className || ""].join(" ");
     if (Array.isArray(tab.children) && tab.children.length > 0 && tab.isDropDown) {
-      return /* @__PURE__ */ jsxs34(DropdownMenu, { children: [
-        /* @__PURE__ */ jsxs34(DropdownMenuTrigger, { className: `${finalClasses} inline-flex items-center gap-1`, children: [
-          tab.header,
-          /* @__PURE__ */ jsx57(ChevronDown, { className: "h-4 w-4 opacity-80" })
-        ] }),
-        /* @__PURE__ */ jsx57(
-          DropdownMenuContent,
-          {
-            align: "start",
-            sideOffset: 6,
-            className: "z-50 min-w-[160px] rounded-md border border-gray-200 bg-white p-1 shadow-lg",
-            children: tab.children.map((item, index2) => /* @__PURE__ */ jsx57(
-              DropdownMenuItem,
+      return /* @__PURE__ */ jsxs34(
+        DropdownMenu,
+        {
+          open: openIndex === index,
+          onOpenChange: (open) => setOpenIndex(open ? index : null),
+          children: [
+            /* @__PURE__ */ jsxs34(
+              DropdownMenuTrigger,
               {
-                asChild: true,
-                className: "cursor-pointer rounded-sm px-3 py-2 text-[12px] text-gray-800 hover:bg-gray-100 focus:bg-gray-100",
-                children: /* @__PURE__ */ jsx57(
-                  Link5,
+                className: `${finalClasses} inline-flex items-center gap-1`,
+                onMouseEnter: () => {
+                  clearTimeout(timeout);
+                  setOpenIndex(index);
+                },
+                onMouseLeave: () => {
+                  timeout = setTimeout(() => setOpenIndex(null), 150);
+                },
+                children: [
+                  tab.header,
+                  /* @__PURE__ */ jsx57(ChevronDown, { className: "h-4 w-4 opacity-80" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx57(
+              DropdownMenuContent,
+              {
+                align: "start",
+                sideOffset: 6,
+                className: "z-50 min-w-[200px] max-h-80 rounded-md border border-gray-200 bg-white p-1 shadow-lg",
+                onMouseEnter: () => {
+                  clearTimeout(timeout);
+                  setOpenIndex(index);
+                },
+                onMouseLeave: () => {
+                  timeout = setTimeout(() => setOpenIndex(null), 150);
+                },
+                children: tab.children.map((item, index2) => /* @__PURE__ */ jsx57(
+                  DropdownMenuItem,
                   {
-                    href: item.url || "#",
-                    target: item.opens_in_new_tab ? "_blank" : "_self",
-                    onClick: (e) => handleBuilderExit(e, item.url || "#"),
-                    children: item.header
-                  }
-                )
-              },
-              item.id || index2
-            ))
-          }
-        )
-      ] }, index);
+                    asChild: true,
+                    className: "cursor-pointer rounded-sm px-3 py-2 text-[12px] text-gray-800 hover:bg-gray-100 focus:bg-gray-100",
+                    children: /* @__PURE__ */ jsx57(
+                      Link5,
+                      {
+                        href: item.url || "#",
+                        target: item.opens_in_new_tab ? "_blank" : "_self",
+                        onClick: (e) => handleBuilderExit(e, item.url || "#"),
+                        children: item.header
+                      }
+                    )
+                  },
+                  item.id || index2
+                ))
+              }
+            )
+          ]
+        },
+        index
+      );
     }
     return tab.url ? /* @__PURE__ */ jsx57(
       Link5,
@@ -30017,7 +30070,7 @@ 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__ */ jsxs34(Fragment21, { children: [
-    /* @__PURE__ */ jsxs34("div", { className, style, children: [
+    /* @__PURE__ */ jsxs34("div", { className: cn("min-h-10", className), style, children: [
       forceDesktop !== void 0 ? forceDesktop && /* @__PURE__ */ jsx57("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx57("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }) : /* @__PURE__ */ jsx57("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx57("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }),
       forceMobile !== void 0 ? forceMobile && /* @__PURE__ */ jsx57("div", { children: renderMobileMenu() }) : /* @__PURE__ */ jsx57("div", { className: "flex md:hidden", children: renderMobileMenu() })
     ] }),
@@ -30036,7 +30089,7 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
 var Tabs_default = Tabs;
 
 // src/components/Navigation/Stages/Stages.tsx
-import React10, { useState as useState9 } from "react";
+import React11, { useState as useState9 } from "react";
 import { jsx as jsx58, jsxs as jsxs35 } from "react/jsx-runtime";
 var StagesComponent = ({ stages, isShowBtn, buttonText, className, style, onStageChange, currentStage, dataKey = "key", dataLabel = "header", loading }) => {
   const [activeStage, setActiveStage] = useState9(currentStage || (stages && stages.length > 0 ? stages[0].key : null));
@@ -30071,7 +30124,7 @@ var StagesComponent = ({ stages, isShowBtn, buttonText, className, style, onStag
       const currentIndex = stages.findIndex((s) => s[dataKey] === activeStage);
       const isCompleted = isAllStagesCompleted || index < currentIndex;
       const isActive = !isAllStagesCompleted && index === currentIndex;
-      return /* @__PURE__ */ jsxs35(React10.Fragment, { children: [
+      return /* @__PURE__ */ jsxs35(React11.Fragment, { children: [
         /* @__PURE__ */ jsx58(
           "button",
           {
@@ -30119,10 +30172,10 @@ import { jsx as jsx61, jsxs as jsxs37 } from "react/jsx-runtime";
 import { jsx as jsx62 } from "react/jsx-runtime";
 
 // src/components/ui/avatar.tsx
-import * as React11 from "react";
+import * as React12 from "react";
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
 import { jsx as jsx63 } from "react/jsx-runtime";
-var Avatar = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx63(
+var Avatar = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx63(
   AvatarPrimitive.Root,
   {
     ref,
@@ -30134,7 +30187,7 @@ var Avatar = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
   }
 ));
 Avatar.displayName = AvatarPrimitive.Root.displayName;
-var AvatarImage = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx63(
+var AvatarImage = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx63(
   AvatarPrimitive.Image,
   {
     ref,
@@ -30143,7 +30196,7 @@ var AvatarImage = React11.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 AvatarImage.displayName = AvatarPrimitive.Image.displayName;
-var AvatarFallback = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx63(
+var AvatarFallback = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx63(
   AvatarPrimitive.Fallback,
   {
     ref,
@@ -30303,7 +30356,7 @@ function Navbar({
 }
 
 // src/components/Chart/BarChart.tsx
-import React12 from "react";
+import React13 from "react";
 import {
   BarChart,
   Bar,
@@ -30375,10 +30428,10 @@ var ChartComponent = ({ className, style, loading, ...props }) => {
     )
   ] }) }) });
 };
-var BarChart_default = React12.memo(ChartComponent);
+var BarChart_default = React13.memo(ChartComponent);
 
 // src/components/Chart/PieChart.tsx
-import React13, { useEffect as useEffect25, useMemo as useMemo6, useState as useState11 } from "react";
+import React14, { useEffect as useEffect25, useMemo as useMemo6, useState as useState11 } from "react";
 import {
   PieChart,
   Pie,
@@ -30506,7 +30559,7 @@ var DonutChart = ({ className, style, loading, ...props }) => {
     }
   );
 };
-var PieChart_default = React13.memo(DonutChart);
+var PieChart_default = React14.memo(DonutChart);
 
 // src/components/Blocks/EmailComposer.tsx
 import { jsx as jsx67, jsxs as jsxs41 } from "react/jsx-runtime";