@ctlyst.id/internal-ui 3.1.6 → 3.1.7

package/dist/index.mjs

@@ -945,6 +945,12 @@ import { flexRender, getCoreRowModel, getSortedRowModel, useReactTable } from "@
 import * as React5 from "react";
 import { useRef } from "react";
 import { jsx as jsx24, jsxs as jsxs8 } from "react/jsx-runtime";
+var isCellDisabled = (row, cellId) => {
+  if (row.disabled) {
+    return row.disabled[cellId];
+  }
+  return false;
+};
 var getCommonPinningStyles = (column) => {
   const isPinned = column.getIsPinned();
   const isLastLeftPinnedColumn = isPinned === "left" && column.getIsLastColumn("left");
@@ -1076,148 +1082,145 @@ var useDataTable = ({
     generateColumn
   };
 };
-var DataTable = React5.forwardRef(
-  (props, ref) => {
-    const { isLoading, styles, headerSticky, onRowClick, container } = props;
-    const { table, toggleAllRowsSelected, generateColumn } = useDataTable(props);
-    React5.useImperativeHandle(ref, () => ({
-      toggleAllRowsSelected
-    }));
-    return /* @__PURE__ */ jsx24(Box11, { overflowX: "auto", position: "relative", maxW: "100%", w: "full", ...container, children: isLoading ? /* @__PURE__ */ jsxs8(Table, { ...styles == null ? void 0 : styles.table, "data-loading": "true", children: [
-      /* @__PURE__ */ jsx24(Thead, { ...(styles == null ? void 0 : styles.tableHead, headerSticky ? { position: "sticky", top: 0, bg: "white", zIndex: 1 } : {}), children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx24(Tr, { mx: "2", ...styles == null ? void 0 : styles.tableRow, children: headerGroup.headers.map((header, index) => /* @__PURE__ */ jsx24(
-        Th,
-        {
-          colSpan: header.colSpan,
-          width: `${header.getSize() + (index === 0 || index === headerGroup.headers.length - 1 ? 16 : 0)}px`,
-          ...styles == null ? void 0 : styles.tableColumnHeader,
-          children: /* @__PURE__ */ jsx24(
-            Flex2,
+var DataTable = React5.forwardRef((props, ref) => {
+  const { isLoading, styles, headerSticky, onRowClick, container } = props;
+  const { table, toggleAllRowsSelected, generateColumn } = useDataTable(props);
+  React5.useImperativeHandle(ref, () => ({
+    toggleAllRowsSelected
+  }));
+  return /* @__PURE__ */ jsx24(Box11, { overflowX: "auto", position: "relative", maxW: "100%", w: "full", ...container, children: isLoading ? /* @__PURE__ */ jsxs8(Table, { ...styles == null ? void 0 : styles.table, "data-loading": "true", children: [
+    /* @__PURE__ */ jsx24(Thead, { ...(styles == null ? void 0 : styles.tableHead, headerSticky ? { position: "sticky", top: 0, bg: "white", zIndex: 1 } : {}), children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx24(Tr, { mx: "2", ...styles == null ? void 0 : styles.tableRow, children: headerGroup.headers.map((header, index) => /* @__PURE__ */ jsx24(
+      Th,
+      {
+        colSpan: header.colSpan,
+        width: `${header.getSize() + (index === 0 || index === headerGroup.headers.length - 1 ? 16 : 0)}px`,
+        ...styles == null ? void 0 : styles.tableColumnHeader,
+        children: /* @__PURE__ */ jsx24(
+          Flex2,
+          {
+            "data-test-id": "CT_component_data-table_loader",
+            textTransform: "capitalize",
+            align: "center",
+            gap: 2,
+            children: flexRender(header.column.columnDef.header, header.getContext())
+          }
+        )
+      },
+      header.id
+    )) }, headerGroup.id)) }),
+    /* @__PURE__ */ jsx24(Tbody, { children: [...Array(5)].map((num) => /* @__PURE__ */ jsx24(Tr, { mx: "2", children: [...Array(generateColumn().length)].map((i) => /* @__PURE__ */ jsx24(Td, { width: 210, children: /* @__PURE__ */ jsx24(Skeleton2, { startColor: "neutral.100", endColor: "neutral.200", h: "20px", w: "70%" }, i) }, i)) }, num)) })
+  ] }) : /* @__PURE__ */ jsxs8(Table, { ...styles == null ? void 0 : styles.table, children: [
+    /* @__PURE__ */ jsx24(
+      Thead,
+      {
+        maxH: "50px",
+        ...(styles == null ? void 0 : styles.tableHead, headerSticky ? { position: "sticky", top: 0, bg: "white", zIndex: 1 } : {}),
+        children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx24(Tr, { bg: useColorModeValue("initial", "ebony-clay.700"), ...styles == null ? void 0 : styles.tableRow, children: headerGroup.headers.map((header, index) => {
+          var _a;
+          return /* @__PURE__ */ jsx24(
+            Th,
             {
-              "data-test-id": "CT_component_data-table_loader",
-              textTransform: "capitalize",
-              align: "center",
-              gap: 2,
-              children: flexRender(header.column.columnDef.header, header.getContext())
-            }
-          )
-        },
-        header.id
-      )) }, headerGroup.id)) }),
-      /* @__PURE__ */ jsx24(Tbody, { children: [...Array(5)].map((num) => /* @__PURE__ */ jsx24(Tr, { mx: "2", children: [...Array(generateColumn().length)].map((i) => /* @__PURE__ */ jsx24(Td, { width: 210, children: /* @__PURE__ */ jsx24(Skeleton2, { startColor: "neutral.100", endColor: "neutral.200", h: "20px", w: "70%" }, i) }, i)) }, num)) })
-    ] }) : /* @__PURE__ */ jsxs8(Table, { ...styles == null ? void 0 : styles.table, children: [
-      /* @__PURE__ */ jsx24(
-        Thead,
+              colSpan: header.colSpan,
+              sx: getCommonPinningStyles(header.column),
+              width: `${header.getSize() + (index === 0 || index === headerGroup.headers.length - 1 ? 16 : 0)}px`,
+              ...styles == null ? void 0 : styles.tableColumnHeader,
+              children: /* @__PURE__ */ jsxs8(
+                Flex2,
+                {
+                  backgroundColor: "white",
+                  height: "100%",
+                  "data-test-id": `CT_Container_TableHeader_${header.id}`,
+                  textTransform: "capitalize",
+                  userSelect: "none",
+                  align: "center",
+                  gap: 2,
+                  children: [
+                    /* @__PURE__ */ jsx24(Text4, { children: flexRender(header.column.columnDef.header, header.getContext()) }),
+                    /* @__PURE__ */ jsx24(
+                      Box11,
+                      {
+                        as: "span",
+                        cursor: header.column.getCanSort() ? "pointer" : "default",
+                        "data-test-id": `CT_Container_SortingIcon_${header.id}`,
+                        onClick: header.column.getToggleSortingHandler(),
+                        children: (_a = header.column.getCanSort() && {
+                          asc: /* @__PURE__ */ jsx24(ChevronUpIcon, { h: 4, w: 4, color: "neutral.500" }),
+                          desc: /* @__PURE__ */ jsx24(ChevronDownIcon, { h: 4, w: 4, color: "neutral.500" })
+                        }[header.column.getIsSorted()]) != null ? _a : /* @__PURE__ */ jsx24(Box11, { display: "flex", justifyContent: "center", alignItems: "center", boxSize: 4, children: /* @__PURE__ */ jsx24(UpDownIcon, { color: "neutral.500" }) })
+                      }
+                    )
+                  ]
+                }
+              )
+            },
+            header.id
+          );
+        }) }, headerGroup.id))
+      }
+    ),
+    /* @__PURE__ */ jsx24(Tbody, { ...styles == null ? void 0 : styles.tableBody, children: table.getRowModel().rows.map((row) => {
+      const trRef = useRef();
+      return /* @__PURE__ */ jsx24(
+        Tr,
         {
-          maxH: "50px",
-          ...(styles == null ? void 0 : styles.tableHead, headerSticky ? { position: "sticky", top: 0, bg: "white", zIndex: 1 } : {}),
-          children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx24(Tr, { bg: useColorModeValue("initial", "ebony-clay.700"), ...styles == null ? void 0 : styles.tableRow, children: headerGroup.headers.map((header, index) => {
+          "data-test-id": "-RU0hNYGRzeVM3HQ4cXHl",
+          tabindex: "0",
+          ref: trRef,
+          ...styles == null ? void 0 : styles.tableRow,
+          css: css`
+                    &:last-child {
+                      td {
+                        border-bottom: none;
+                      }
+                    }
+                  `,
+          onMouseDown: () => {
             var _a;
+            (_a = trRef.current) == null ? void 0 : _a.setAttribute("data-active", "true");
+          },
+          onMouseUp: () => {
+            var _a;
+            (_a = trRef.current) == null ? void 0 : _a.removeAttribute("data-active");
+          },
+          onClick: () => {
+            if (onRowClick) {
+              onRowClick(row.original);
+            }
+          },
+          children: row.getVisibleCells().map((cell) => {
+            const isDisabled = isCellDisabled(row.original, cell.column.id);
             return /* @__PURE__ */ jsx24(
-              Th,
+              Td,
               {
-                colSpan: header.colSpan,
-                sx: getCommonPinningStyles(header.column),
-                width: `${header.getSize() + (index === 0 || index === headerGroup.headers.length - 1 ? 16 : 0)}px`,
-                ...styles == null ? void 0 : styles.tableColumnHeader,
-                children: /* @__PURE__ */ jsxs8(
+                "data-test-id": `CT_Component_TableCell_${cell.id}`,
+                fontSize: "text.sm",
+                sx: getCommonPinningStyles(cell.column),
+                ...styles == null ? void 0 : styles.tableCell,
+                children: /* @__PURE__ */ jsx24(Flex2, { height: "100%", align: "center", opacity: isDisabled ? 0.5 : 1, children: /* @__PURE__ */ jsx24(
                   Flex2,
                   {
-                    backgroundColor: "white",
-                    height: "100%",
-                    "data-test-id": `CT_Container_TableHeader_${header.id}`,
-                    textTransform: "capitalize",
-                    userSelect: "none",
-                    align: "center",
-                    gap: 2,
-                    children: [
-                      /* @__PURE__ */ jsx24(Text4, { children: flexRender(header.column.columnDef.header, header.getContext()) }),
-                      /* @__PURE__ */ jsx24(
-                        Box11,
-                        {
-                          as: "span",
-                          cursor: header.column.getCanSort() ? "pointer" : "default",
-                          "data-test-id": `CT_Container_SortingIcon_${header.id}`,
-                          onClick: header.column.getToggleSortingHandler(),
-                          children: (_a = header.column.getCanSort() && {
-                            asc: /* @__PURE__ */ jsx24(ChevronUpIcon, { h: 4, w: 4, color: "neutral.500" }),
-                            desc: /* @__PURE__ */ jsx24(ChevronDownIcon, { h: 4, w: 4, color: "neutral.500" })
-                          }[header.column.getIsSorted()]) != null ? _a : /* @__PURE__ */ jsx24(Box11, { display: "flex", justifyContent: "center", alignItems: "center", boxSize: 4, children: /* @__PURE__ */ jsx24(UpDownIcon, { color: "neutral.500" }) })
-                        }
-                      )
-                    ]
+                    tabIndex: 0,
+                    display: "inline-flex",
+                    cursor: "auto",
+                    "data-test-id": `CT_Component_TableCell_Content-${cell.id}`,
+                    onMouseUp: (e) => e.stopPropagation(),
+                    onMouseDown: (e) => e.stopPropagation(),
+                    onClick: (e) => {
+                      e.stopPropagation();
+                    },
+                    children: flexRender(cell.column.columnDef.cell, cell.getContext())
                   }
-                )
+                ) })
               },
-              header.id
+              cell.id
             );
-          }) }, headerGroup.id))
-        }
-      ),
-      /* @__PURE__ */ jsx24(Tbody, { ...styles == null ? void 0 : styles.tableBody, children: table.getRowModel().rows.map((row) => {
-        const trRef = useRef();
-        return /* @__PURE__ */ jsx24(
-          Tr,
-          {
-            "data-test-id": "-RU0hNYGRzeVM3HQ4cXHl",
-            tabindex: "0",
-            ref: trRef,
-            ...styles == null ? void 0 : styles.tableRow,
-            css: css`
-                      &:last-child {
-                        td {
-                          border-bottom: none;
-                        }
-                      }
-                    `,
-            onMouseDown: () => {
-              var _a;
-              (_a = trRef.current) == null ? void 0 : _a.setAttribute("data-active", "true");
-            },
-            onMouseUp: () => {
-              var _a;
-              (_a = trRef.current) == null ? void 0 : _a.removeAttribute("data-active");
-            },
-            onClick: () => {
-              if (onRowClick) {
-                onRowClick(row.original);
-              }
-            },
-            children: row.getVisibleCells().map((cell) => {
-              var _a, _b;
-              const isDisabled = (_b = (_a = cell.row.original) == null ? void 0 : _a.disabled) == null ? void 0 : _b[cell.column.id];
-              return /* @__PURE__ */ jsx24(
-                Td,
-                {
-                  "data-test-id": `CT_Component_TableCell_${cell.id}`,
-                  fontSize: "text.sm",
-                  sx: getCommonPinningStyles(cell.column),
-                  ...styles == null ? void 0 : styles.tableCell,
-                  children: /* @__PURE__ */ jsx24(Flex2, { height: "100%", align: "center", opacity: isDisabled ? 0.5 : 1, children: /* @__PURE__ */ jsx24(
-                    Flex2,
-                    {
-                      tabIndex: 0,
-                      display: "inline-flex",
-                      cursor: "auto",
-                      "data-test-id": `CT_Component_TableCell_Content-${cell.id}`,
-                      onMouseUp: (e) => e.stopPropagation(),
-                      onMouseDown: (e) => e.stopPropagation(),
-                      onClick: (e) => {
-                        e.stopPropagation();
-                      },
-                      children: flexRender(cell.column.columnDef.cell, cell.getContext())
-                    }
-                  ) })
-                },
-                cell.id
-              );
-            })
-          },
-          row.id
-        );
-      }) })
-    ] }) });
-  }
-);
+          })
+        },
+        row.id
+      );
+    }) })
+  ] }) });
+});
 var data_table_default = DataTable;
 
 // src/components/datepicker/components/datepicker.tsx
@@ -7095,7 +7098,10 @@ export {
   forwardRef12 as forwardRef,
   getSelectAllCheckboxState,
   getTheme,
+  isCellDisabled,
+  selectStyles,
   theme4 as theme,
+  themeSelect,
   useAccordion,
   useAccordionContext,
   useAccordionItem,