@ctlyst.id/internal-ui 5.6.8 → 5.7.1

package/dist/index.d.mts

@@ -261,7 +261,7 @@ interface DataTableProps<T> {
     onRowClick?: (data: T) => void;
     disabledRow?: (row: T) => boolean;
     highlightedRow?: (row: T) => boolean;
-    highlightRowColor?: BackgroundProps['bg'];
+    highlightRowColor?: BackgroundProps['bg'] | ((row: T) => BackgroundProps['bg']);
     /** paddingRowX in px */
     paddingRowX?: number;
 }

package/dist/index.d.ts

@@ -261,7 +261,7 @@ interface DataTableProps<T> {
     onRowClick?: (data: T) => void;
     disabledRow?: (row: T) => boolean;
     highlightedRow?: (row: T) => boolean;
-    highlightRowColor?: BackgroundProps['bg'];
+    highlightRowColor?: BackgroundProps['bg'] | ((row: T) => BackgroundProps['bg']);
     /** paddingRowX in px */
     paddingRowX?: number;
 }

package/dist/index.js

@@ -1739,17 +1739,17 @@ var DataTable = React6.forwardRef((props, ref) => {
                       "data-test-id": `CT_Container_TableHeader_${header.id}`,
                       userSelect: "none",
                       align: "center",
-                      gap: 2,
                       children: [
                         (0, import_react_table.flexRender)(header.column.columnDef.header, header.getContext()),
-                        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+                        header.column.getCanSort() && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                           import_react31.Box,
                           {
                             as: "span",
                             cursor: header.column.getCanSort() ? "pointer" : "default",
                             "data-test-id": `CT_Container_SortingIcon_${header.id}`,
                             onClick: header.column.getToggleSortingHandler(),
-                            children: (_b2 = header.column.getCanSort() && {
+                            ml: 2,
+                            children: (_b2 = {
                               asc: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_icons2.ChevronUpIcon, { h: 4, w: 4, color: "neutral.500" }),
                               desc: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_icons2.ChevronDownIcon, { h: 4, w: 4, color: "neutral.500" })
                             }[header.column.getIsSorted()]) != null ? _b2 : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react31.Box, { display: "flex", justifyContent: "center", alignItems: "center", boxSize: 4, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_icons2.UpDownIcon, { color: "neutral.500" }) })
@@ -1767,12 +1767,13 @@ var DataTable = React6.forwardRef((props, ref) => {
         /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react31.Tbody, { ...styles == null ? void 0 : styles.tableBody, animation: `${fadeIn} 0.15s ease-out`, children: table.getRowModel().rows.map((row, index) => {
           const isDisabledRow = disabledRow && disabledRow(row.original);
           const isHighlightedRow = Object.keys(selectedRow != null ? selectedRow : {}).filter((key) => selectedRow == null ? void 0 : selectedRow[key]).includes(row.id) || highlightedRow && highlightedRow(row.original);
+          const hgColor = typeof highlightRowColor === "function" ? highlightRowColor(row.original) : highlightRowColor;
           return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             import_react31.Tr,
             {
               "data-test-id": "-RU0hNYGRzeVM3HQ4cXHl",
               ...styles == null ? void 0 : styles.tableRow,
-              sx: { ...isHighlightedRow && getTableHighlightStyle(highlightRowColor) },
+              sx: { ...isHighlightedRow && getTableHighlightStyle(hgColor) },
               "aria-disabled": isDisabledRow,
               "data-highlight": isHighlightedRow ? "true" : "false",
               css: import_react32.css`