pixelize-design-library 2.2.198 → 2.3.1-beta.2

package/dist/Theme/Default/palette.d.ts

@@ -1,4 +1,8 @@
 declare const palette: {
+    gradient: {
+        from: string;
+        to: string;
+    };
     primary: {
         50: string;
         100: string;

package/dist/Theme/Default/palette.js

@@ -281,7 +281,10 @@ var disabled = {
     800: "#625d75",
     900: "#4b4759",
 };
+// Two-tone brand gradient (violet → pink). Each theme overrides with its own pair.
+var gradient = { from: "#8B3FC8", to: "#EC4899" };
 var palette = {
+    gradient: gradient,
     primary: primary,
     secondary: secondary,
     tertiary: tertiary,

package/dist/Theme/Emerald/palette.d.ts

@@ -1,4 +1,8 @@
 declare const palette: {
+    gradient: {
+        from: string;
+        to: string;
+    };
     primary: {
         50: string;
         100: string;

package/dist/Theme/Emerald/palette.js

@@ -30,7 +30,8 @@ var primary = {
     900: "#043b35",
     opacity: (0, buildBrandTokens_1.buildPrimaryOpacity)(PRIMARY_500),
 };
-var palette = __assign(__assign({}, palette_1.default), { primary: primary, 
+var palette = __assign(__assign({}, palette_1.default), { gradient: { from: "#0f9d8a", to: "#06b6d4" }, // teal → cyan
+    primary: primary, 
     // 🌫️ Neutral gray (slightly cool to match teal)
     gray: {
         50: "#f6f8f8",

package/dist/Theme/Meadow/palette.d.ts

@@ -1,4 +1,8 @@
 declare const palette: {
+    gradient: {
+        from: string;
+        to: string;
+    };
     primary: {
         50: string;
         100: string;

package/dist/Theme/Meadow/palette.js

@@ -30,7 +30,8 @@ var primary = {
     900: "#0a2016",
     opacity: (0, buildBrandTokens_1.buildPrimaryOpacity)(PRIMARY_500),
 };
-var palette = __assign(__assign({}, palette_1.default), { primary: primary, tertiary: __assign({}, primary), gray: {
+var palette = __assign(__assign({}, palette_1.default), { gradient: { from: "#2d6a4f", to: "#14b8a6" }, // forest green → teal
+    primary: primary, tertiary: __assign({}, primary), gray: {
         50: "#f6f9f7",
         100: "#ecf1ee",
         200: "#dce5e0",

package/dist/Theme/Radiant/palette.d.ts

@@ -1,4 +1,8 @@
 declare const palette: {
+    gradient: {
+        from: string;
+        to: string;
+    };
     primary: {
         50: string;
         100: string;

package/dist/Theme/Radiant/palette.js

@@ -30,7 +30,8 @@ var primary = {
     900: "#531a14",
     opacity: (0, buildBrandTokens_1.buildPrimaryOpacity)(PRIMARY_500),
 };
-var palette = __assign(__assign({}, palette_1.default), { primary: primary, 
+var palette = __assign(__assign({}, palette_1.default), { gradient: { from: "#cf4e3a", to: "#f59e0b" }, // terracotta red → amber
+    primary: primary, 
     // 🌫️ Neutral gray (slightly warm, not pink)
     gray: {
         50: "#f8f6f5",

package/dist/Theme/Rosewood/palette.d.ts

@@ -1,4 +1,8 @@
 declare const palette: {
+    gradient: {
+        from: string;
+        to: string;
+    };
     primary: {
         50: string;
         100: string;

package/dist/Theme/Rosewood/palette.js

@@ -30,7 +30,8 @@ var primary = {
     900: "#552634",
     opacity: (0, buildBrandTokens_1.buildPrimaryOpacity)(PRIMARY_500),
 };
-var palette = __assign(__assign({}, palette_1.default), { primary: primary, 
+var palette = __assign(__assign({}, palette_1.default), { gradient: { from: "#d16a7e", to: "#fb7185" }, // rose → coral pink
+    primary: primary, 
     // 🌫️ Neutral gray (slightly warm, avoids purple tint)
     gray: {
         50: "#f9f7f7",

package/dist/Theme/Skyline/palette.d.ts

@@ -1,4 +1,8 @@
 declare const palette: {
+    gradient: {
+        from: string;
+        to: string;
+    };
     primary: {
         50: string;
         100: string;

package/dist/Theme/Skyline/palette.js

@@ -30,7 +30,8 @@ var primary = {
     900: "#071021",
     opacity: (0, buildBrandTokens_1.buildPrimaryOpacity)(PRIMARY_500),
 };
-var palette = __assign(__assign({}, palette_1.default), { primary: primary, tertiary: __assign({}, primary), gray: {
+var palette = __assign(__assign({}, palette_1.default), { gradient: { from: "#1a3a6b", to: "#38bdf8" }, // deep navy → sky blue
+    primary: primary, tertiary: __assign({}, primary), gray: {
         50: "#f4f6fa",
         100: "#e6eaf2",
         200: "#d3dae8",

package/dist/Theme/Slate/palette.d.ts

@@ -1,4 +1,8 @@
 declare const palette: {
+    gradient: {
+        from: string;
+        to: string;
+    };
     primary: {
         50: string;
         100: string;

package/dist/Theme/Slate/palette.js

@@ -30,7 +30,8 @@ var primary = {
     900: "#111827",
     opacity: (0, buildBrandTokens_1.buildPrimaryOpacity)(PRIMARY_500),
 };
-var palette = __assign(__assign({}, palette_1.default), { primary: primary, tertiary: __assign({}, primary), gray: {
+var palette = __assign(__assign({}, palette_1.default), { gradient: { from: "#6b7280", to: "#818cf8" }, // slate gray → indigo
+    primary: primary, tertiary: __assign({}, primary), gray: {
         50: "#f9fafb",
         100: "#f3f4f6",
         200: "#e5e7eb",

package/dist/Theme/themeProps.d.ts

@@ -2,6 +2,10 @@ import "@chakra-ui/react";
 import { Theme as ChakraTheme } from "@chakra-ui/react";
 export type CustomThemeProps = {
     colors: {
+        gradient?: {
+            from: string;
+            to: string;
+        };
         primary: {
             50: string;
             100: string;

package/dist/Utils/table.d.ts

@@ -1,9 +1,30 @@
 import React from "react";
 import { DataObject, TableHeaderProps } from "../Components/Table/TableProps";
+/**
+ * Type-aware, null-safe comparison. Detects numbers and dates; otherwise falls
+ * back to a numeric-aware locale string compare. Empty/null values sort last.
+ */
+export declare function compareValues(aRaw: any, bRaw: any, direction: "asc" | "desc" | "none"): number;
 export declare function SortMultiColumnData(data: Record<string, string | number>[], sortConfig: {
     column: string | number;
     direction: string;
 }[]): Record<string, string | number>[];
+export type TablePaletteColor = {
+    solid: string;
+    soft: string;
+    text: string;
+};
+/** Deterministic, theme-aware color palette for groups + status pills. */
+export declare function buildTablePalette(theme: any): TablePaletteColor[];
+/** Pick a deterministic palette color for a value, with optional override hex. */
+export declare function pickTableColor(value: string | number, palette: TablePaletteColor[], override?: string): TablePaletteColor;
+export type TableGroup = {
+    value: string | number;
+    label: string;
+    rows: DataObject[];
+};
+/** Partition rows by a column key, preserving first-seen group order. */
+export declare function groupRows(data: DataObject[], groupBy: string | number): TableGroup[];
 export declare const calculateLeftOffset: (columns: number[], index: number) => number;
 /**
  * When a column has no `node`, raw cell values are rendered; plain objects

package/dist/Utils/table.js

@@ -43,32 +43,116 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TableCellCalculation = exports.pageSizeCalculation = exports.searchAndSortData = exports.calculateLeftOffset = void 0;
+exports.compareValues = compareValues;
 exports.SortMultiColumnData = SortMultiColumnData;
+exports.buildTablePalette = buildTablePalette;
+exports.pickTableColor = pickTableColor;
+exports.groupRows = groupRows;
 exports.normalizeTableCellValue = normalizeTableCellValue;
 exports.debounce = debounce;
 exports.useDebounce = useDebounce;
 exports.globalSearchFilter = globalSearchFilter;
 var react_1 = __importStar(require("react"));
+/**
+ * Type-aware, null-safe comparison. Detects numbers and dates; otherwise falls
+ * back to a numeric-aware locale string compare. Empty/null values sort last.
+ */
+function compareValues(aRaw, bRaw, direction) {
+    if (direction === "none")
+        return 0;
+    var dir = direction === "asc" ? 1 : -1;
+    var a = getStringValue(aRaw);
+    var b = getStringValue(bRaw);
+    var aEmpty = a === "";
+    var bEmpty = b === "";
+    if (aEmpty && bEmpty)
+        return 0;
+    if (aEmpty)
+        return 1; // nulls/empties always last
+    if (bEmpty)
+        return -1;
+    var an = Number(a);
+    var bn = Number(b);
+    if (!Number.isNaN(an) && !Number.isNaN(bn))
+        return (an - bn) * dir;
+    var ad = Date.parse(a);
+    var bd = Date.parse(b);
+    if (!Number.isNaN(ad) && !Number.isNaN(bd))
+        return (ad - bd) * dir;
+    return a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }) * dir;
+}
 function SortMultiColumnData(data, sortConfig) {
-    if (!sortConfig.length)
+    var active = sortConfig.filter(function (s) { return s.direction !== "none"; });
+    if (!active.length)
         return data;
     return __spreadArray([], data, true).sort(function (a, b) {
-        for (var _i = 0, sortConfig_1 = sortConfig; _i < sortConfig_1.length; _i++) {
-            var _a = sortConfig_1[_i], column = _a.column, direction = _a.direction;
-            if (direction === "none") {
-                continue;
-            }
-            var dirMultiplier = direction === "asc" ? 1 : -1;
-            // Compare values for the current column
-            if (a[column] < b[column])
-                return -1 * dirMultiplier;
-            if (a[column] > b[column])
-                return 1 * dirMultiplier;
-            // If values are equal, continue to the next sorting rule
+        for (var _i = 0, active_1 = active; _i < active_1.length; _i++) {
+            var _a = active_1[_i], column = _a.column, direction = _a.direction;
+            var r = compareValues(a[column], b[column], direction);
+            if (r !== 0)
+                return r;
         }
-        return 0; // Return 0 if all sort conditions are equal
+        return 0;
     });
 }
+var withAlpha = function (hex, aa) {
+    return /^#([0-9a-fA-F]{6})$/.test(hex) ? "".concat(hex).concat(aa) : hex;
+};
+/** Deterministic, theme-aware color palette for groups + status pills. */
+function buildTablePalette(theme) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
+    var c = (_a = theme === null || theme === void 0 ? void 0 : theme.colors) !== null && _a !== void 0 ? _a : {};
+    var bases = [
+        (_b = c.primary) === null || _b === void 0 ? void 0 : _b[500],
+        (_d = (_c = c.semantic) === null || _c === void 0 ? void 0 : _c.success) === null || _d === void 0 ? void 0 : _d[500],
+        (_f = (_e = c.semantic) === null || _e === void 0 ? void 0 : _e.info) === null || _f === void 0 ? void 0 : _f[500],
+        (_h = (_g = c.semantic) === null || _g === void 0 ? void 0 : _g.warning) === null || _h === void 0 ? void 0 : _h[500],
+        (_j = c.teal) === null || _j === void 0 ? void 0 : _j[500],
+        (_k = c.blue) === null || _k === void 0 ? void 0 : _k[500],
+        (_l = c.pink) === null || _l === void 0 ? void 0 : _l[500],
+        (_o = (_m = c.semantic) === null || _m === void 0 ? void 0 : _m.error) === null || _o === void 0 ? void 0 : _o[500],
+        (_p = c.orange) === null || _p === void 0 ? void 0 : _p[500],
+        (_q = c.purple) === null || _q === void 0 ? void 0 : _q[500],
+    ];
+    var list = bases.filter(Boolean);
+    var fallback = ["#8B3FC8"];
+    return (list.length ? list : fallback).map(function (solid) { return ({
+        solid: solid,
+        soft: withAlpha(solid, "22"),
+        text: solid,
+    }); });
+}
+var hashKey = function (value) {
+    var s = String(value);
+    var h = 0;
+    for (var i = 0; i < s.length; i++)
+        h = (h * 31 + s.charCodeAt(i)) >>> 0;
+    return h;
+};
+/** Pick a deterministic palette color for a value, with optional override hex. */
+function pickTableColor(value, palette, override) {
+    if (override)
+        return { solid: override, soft: withAlpha(override, "22"), text: override };
+    if (!palette.length)
+        return { solid: "#8B3FC8", soft: "#8B3FC822", text: "#8B3FC8" };
+    return palette[hashKey(value) % palette.length];
+}
+/** Partition rows by a column key, preserving first-seen group order. */
+function groupRows(data, groupBy) {
+    var order = [];
+    var map = new Map();
+    for (var _i = 0, data_1 = data; _i < data_1.length; _i++) {
+        var row = data_1[_i];
+        var raw = row[groupBy];
+        var key = raw === undefined || raw === null || raw === "" ? "—" : raw;
+        if (!map.has(key)) {
+            map.set(key, []);
+            order.push(key);
+        }
+        map.get(key).push(row);
+    }
+    return order.map(function (value) { return ({ value: value, label: String(value), rows: map.get(value) }); });
+}
 var calculateLeftOffset = function (columns, index) {
     return columns.slice(0, index).reduce(function (sum, width) { return sum + width; }, 0);
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "2.2.198",
+  "version": "2.3.1-beta.2",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -106,4 +106,4 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   }
-}
+}

package/dist/Components/Table/Components/TableBody.js

@@ -1,201 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = require("@chakra-ui/react");
-var react_2 = __importStar(require("react"));
-var table_1 = require("../../../Utils/table");
-var useCustomTheme_1 = require("../../../Theme/useCustomTheme");
-var TableLoading_1 = require("./TableLoading");
-var TableActions_1 = __importDefault(require("./TableActions"));
-var lucide_react_1 = require("lucide-react");
-var Checkbox_1 = __importDefault(require("../../Checkbox/Checkbox"));
-var EMPTY_SX = {};
-var EMPTY_HOVER = {};
-var TableRow = react_2.default.memo(function (_a) {
-    var _b, _c, _d, _e, _f, _g, _h, _j, _k;
-    var row = _a.row, rowIndex = _a.rowIndex, index = _a.index, isChecked = _a.isChecked, isExpanded = _a.isExpanded, isContent = _a.isContent, isLink = _a.isLink, isCheckbox = _a.isCheckbox, isLoading = _a.isLoading, isActionFreeze = _a.isActionFreeze, columns = _a.columns, leftOffsets = _a.leftOffsets, noBorders = _a.noBorders, freezedBgColor = _a.freezedBgColor, freezedTextColor = _a.freezedTextColor, theme = _a.theme, borderStyle = _a.borderStyle, hoverStyle = _a.hoverStyle, handleCheckbox = _a.handleCheckbox, onRowClick = _a.onRowClick, toggleRowExpansion = _a.toggleRowExpansion;
-    var checkedSx = (0, react_2.useMemo)(function () { return isChecked ? {
-        "& td": { backgroundColor: theme.colors.disabled[100] },
-    } : EMPTY_SX; }, [isChecked, theme.colors.disabled]);
-    var handleCellClick = (0, react_2.useCallback)(function (header) {
-        if (!header.node && onRowClick) {
-            onRowClick(row, { label: header.label, id: header.id });
-        }
-    }, [row, onRowClick]);
-    return (react_2.default.createElement(react_2.default.Fragment, null,
-        react_2.default.createElement(react_1.Tr, { opacity: isLoading ? 0.4 : 1, pointerEvents: isLoading ? "none" : "auto", transition: "opacity 0.2s", sx: checkedSx },
-            isContent && (react_2.default.createElement(react_1.Td, { w: "6", p: 0, fontSize: 14, backgroundColor: (_c = (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.background) === null || _c === void 0 ? void 0 : _c[50], color: freezedTextColor, position: "sticky", borderBottom: borderStyle, boxSizing: "border-box", left: 0, zIndex: 1, className: "columns sticky-columns" }, !!(row === null || row === void 0 ? void 0 : row.content) && (react_2.default.createElement(react_1.IconButton, { "aria-label": isExpanded ? "Collapse row" : "Expand row", color: (_d = theme.colors) === null || _d === void 0 ? void 0 : _d.gray[600], icon: isExpanded ? (react_2.default.createElement(lucide_react_1.ChevronDown, { fontSize: 16 })) : (react_2.default.createElement(lucide_react_1.ChevronRight, { fontSize: 16 })), _hover: { transform: "scale(1.1)" }, size: "sm", onClick: function () { return toggleRowExpansion(rowIndex); }, variant: "ghost" })))),
-            isCheckbox && (react_2.default.createElement(react_1.Td, { w: "6", fontSize: 14, fontWeight: 600, color: (_f = (_e = theme.colors) === null || _e === void 0 ? void 0 : _e.background) === null || _f === void 0 ? void 0 : _f[50], textTransform: "capitalize", backgroundColor: (_h = (_g = theme.colors) === null || _g === void 0 ? void 0 : _g.background) === null || _h === void 0 ? void 0 : _h[50], position: "sticky", borderBottom: borderStyle, boxSizing: "border-box", left: 0, zIndex: 1, className: "columns sticky-columns" },
-                react_2.default.createElement(Checkbox_1.default, { "aria-label": "Select all rows", onChange: function () { return handleCheckbox(row.id); }, isChecked: isChecked }))),
-            columns.map(function (header, headerIndex) {
-                var _a, _b, _c, _d, _e;
-                if (header.isHidden)
-                    return null;
-                var isFrozen = header.isFreeze;
-                return (react_2.default.createElement(react_1.Td, { maxWidth: 500, minWidth: 120, height: 45, key: headerIndex + 1, onClick: function () { return handleCellClick(header); }, fontSize: 14, fontWeight: 400, position: isFrozen ? "sticky" : undefined, left: isFrozen ? leftOffsets[headerIndex] : undefined, zIndex: isFrozen ? 1 : 0, backgroundColor: (_a = theme.colors.background) === null || _a === void 0 ? void 0 : _a[50], textOverflow: "ellipsis", borderBottom: noBorders
-                        ? "none"
-                        : "0.063rem solid ".concat((_b = theme.colors) === null || _b === void 0 ? void 0 : _b.gray[isFrozen || isChecked ? 300 : 200]), className: "columns ".concat(isFrozen ? "sticky-columns" : "scrollable-columns"), boxSizing: "border-box", color: (_d = (_c = theme.colors) === null || _c === void 0 ? void 0 : _c.text) === null || _d === void 0 ? void 0 : _d[500], _hover: ((_e = row.cellStyle) === null || _e === void 0 ? void 0 : _e[header.id]) || row.rowStyle
-                        ? EMPTY_HOVER
-                        : hoverStyle },
-                    react_2.default.createElement(react_1.Box, { display: "block", overflow: "hidden", whiteSpace: "normal", overflowWrap: "break-word" }, (0, table_1.normalizeTableCellValue)(header.node ? header.node(row) : row[header.id]))));
-            }),
-            isLink && (react_2.default.createElement(react_1.Td, { w: 2, p: 0, fontSize: 14, backgroundColor: (_k = (_j = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _j === void 0 ? void 0 : _j.background) === null || _k === void 0 ? void 0 : _k[50], color: freezedTextColor, position: isActionFreeze ? "sticky" : "relative", borderBottom: borderStyle, boxSizing: "border-box", right: 0, zIndex: 1, className: "columns sticky-columns".concat(isActionFreeze ? "-right" : "") }, (row.onLink || row.onEdit || row.onDelete) && (react_2.default.createElement(TableActions_1.default, { row: row }))))),
-        row.content && isExpanded && (react_2.default.createElement(react_1.Tr, null,
-            react_2.default.createElement(react_1.Td, { colSpan: columns.length +
-                    (isCheckbox ? 1 : 0) +
-                    (isContent ? 1 : 0) +
-                    (isLink ? 1 : 0), p: 2 },
-                react_2.default.createElement(react_1.Box, { p: 2, bg: theme.colors.white, borderRadius: "md" }, row === null || row === void 0 ? void 0 : row.content(row)))))));
-});
-var TableBody = function (_a) {
-    var _b, _c, _d, _e, _f, _g, _h;
-    var data = _a.data, isCheckbox = _a.isCheckbox, columns = _a.columns, startRow = _a.startRow, columnWidths = _a.columnWidths, freezedBgColor = _a.freezedBgColor, freezedTextColor = _a.freezedTextColor, noBorders = _a.noBorders, handleCheckbox = _a.handleCheckbox, selections = _a.selections, isLoading = _a.isLoading, onRowClick = _a.onRowClick, isContent = _a.isContent, isLink = _a.isLink, isActionFreeze = _a.isActionFreeze, loadingSkeletonRows = _a.loadingSkeletonRows, scrollContainerRef = _a.scrollContainerRef;
-    var theme = (0, useCustomTheme_1.useCustomTheme)();
-    var _j = (0, react_2.useState)(new Set()), expandedRows = _j[0], setExpandedRows = _j[1];
-    var selectionsSet = (0, react_2.useMemo)(function () { return new Set(selections); }, [selections]);
-    // --- Row virtualization ---------------------------------------------------
-    // Rows are a fixed 45px tall (see the `height={45}` on every <Td/> below),
-    // and the scroll viewport is capped at ~500px, so only ~11 rows are ever
-    // visible. Mounting all 50/100 page rows is what makes paging freeze. We
-    // render only the rows inside the viewport (+ overscan) and reserve the
-    // remaining height with empty spacer rows. Spacer rows (rather than CSS
-    // transforms) keep the table in normal flow so the sticky header and
-    // `position: sticky` frozen columns keep working.
-    // Disabled when expandable content rows are present, since those break the
-    // fixed-height assumption.
-    var ROW_HEIGHT = 45;
-    var OVERSCAN = 6;
-    var VIRTUALIZE_THRESHOLD = 30;
-    var shouldVirtualize = !isContent && data.length > VIRTUALIZE_THRESHOLD;
-    var _k = (0, react_2.useState)(0), scrollTop = _k[0], setScrollTop = _k[1];
-    var _l = (0, react_2.useState)(0), viewportH = _l[0], setViewportH = _l[1];
-    (0, react_2.useEffect)(function () {
-        var el = scrollContainerRef === null || scrollContainerRef === void 0 ? void 0 : scrollContainerRef.current;
-        if (!el || !shouldVirtualize)
-            return;
-        var onScroll = function () { return setScrollTop(el.scrollTop); };
-        var measure = function () { return setViewportH(el.clientHeight); };
-        measure();
-        setScrollTop(el.scrollTop);
-        el.addEventListener("scroll", onScroll, { passive: true });
-        window.addEventListener("resize", measure);
-        return function () {
-            el.removeEventListener("scroll", onScroll);
-            window.removeEventListener("resize", measure);
-        };
-    }, [scrollContainerRef, shouldVirtualize, data.length]);
-    // New page: jump back to the top so the window recomputes from row 0.
-    (0, react_2.useEffect)(function () {
-        if (!shouldVirtualize)
-            return;
-        var el = scrollContainerRef === null || scrollContainerRef === void 0 ? void 0 : scrollContainerRef.current;
-        if (el)
-            el.scrollTop = 0;
-        setScrollTop(0);
-    }, [startRow, shouldVirtualize, scrollContainerRef]);
-    var total = data.length;
-    var firstIndex = 0;
-    var lastIndex = total;
-    if (shouldVirtualize) {
-        var vh = viewportH || 500;
-        firstIndex = Math.max(0, Math.floor(scrollTop / ROW_HEIGHT) - OVERSCAN);
-        var count = Math.ceil(vh / ROW_HEIGHT) + OVERSCAN * 2;
-        lastIndex = Math.min(total, firstIndex + count);
-    }
-    var visibleRows = shouldVirtualize ? data.slice(firstIndex, lastIndex) : data;
-    var topPad = firstIndex * ROW_HEIGHT;
-    var bottomPad = (total - lastIndex) * ROW_HEIGHT;
-    var toggleRowExpansion = (0, react_2.useCallback)(function (rowIndex) {
-        setExpandedRows(function (prev) {
-            var newSet = new Set(prev);
-            if (newSet.has(rowIndex)) {
-                newSet.delete(rowIndex);
-            }
-            else {
-                newSet.add(rowIndex);
-            }
-            return newSet;
-        });
-    }, []);
-    var totalVisibleColumns = (0, react_2.useMemo)(function () {
-        return columns.filter(function (o) { return !o.isHidden; }).length +
-            (isCheckbox ? 1 : 0) +
-            (isContent ? 1 : 0) +
-            (isLink ? 1 : 0);
-    }, [columns, isCheckbox, isContent, isLink]);
-    var leftOffsets = (0, react_2.useMemo)(function () {
-        var checkboxOffset = isCheckbox ? 50 : 0;
-        return columnWidths.map(function (_, idx) {
-            return columnWidths.slice(0, idx).reduce(function (sum, w) { return sum + w; }, 0) + checkboxOffset;
-        });
-    }, [columnWidths, isCheckbox]);
-    var borderStyle = (0, react_2.useMemo)(function () { var _a; return noBorders ? "none" : "0.063rem solid ".concat((_a = theme.colors) === null || _a === void 0 ? void 0 : _a.border[500]); }, [noBorders, (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.border]);
-    var hoverStyle = (0, react_2.useMemo)(function () {
-        var _a, _b;
-        return ({
-            backgroundColor: (_b = (_a = theme.colors.secondary) === null || _a === void 0 ? void 0 : _a.opacity) === null || _b === void 0 ? void 0 : _b[4],
-        });
-    }, [(_c = theme.colors.secondary) === null || _c === void 0 ? void 0 : _c.opacity]);
-    if (isLoading && data.length === 0) {
-        return (react_2.default.createElement(TableLoading_1.TableBodyLoading, { noOfColumns: totalVisibleColumns, borderColor: theme.colors.gray[300], rowsCount: typeof loadingSkeletonRows === "number" ? loadingSkeletonRows : 4 }));
-    }
-    if (!isLoading && data.length === 0) {
-        return (react_2.default.createElement(react_1.Tr, { backgroundColor: (_d = theme.colors.background) === null || _d === void 0 ? void 0 : _d[50] },
-            react_2.default.createElement(react_1.Td, { colSpan: totalVisibleColumns, textAlign: "center", py: 4 },
-                react_2.default.createElement(react_1.Box, { textAlign: "center", fontSize: 14, color: (_f = (_e = theme.colors) === null || _e === void 0 ? void 0 : _e.text) === null || _f === void 0 ? void 0 : _f[500] },
-                    react_2.default.createElement("p", null, "No data found")))));
-    }
-    return (react_2.default.createElement(react_2.default.Fragment, null,
-        isLoading && data.length > 0 && (react_2.default.createElement(react_1.Tr, null,
-            react_2.default.createElement(react_1.Td, { colSpan: totalVisibleColumns, p: 0, border: "none", position: "relative", height: 0 },
-                react_2.default.createElement(react_1.Box, { position: "absolute", top: 4, left: "50%", transform: "translateX(-50%)", zIndex: 10 },
-                    react_2.default.createElement(react_1.Spinner, { size: "sm", color: ((_h = (_g = theme.colors) === null || _g === void 0 ? void 0 : _g.primary) === null || _h === void 0 ? void 0 : _h[500]) || "blue.500" }))))),
-        shouldVirtualize && topPad > 0 && (react_2.default.createElement("tr", { "aria-hidden": "true", style: { height: topPad } },
-            react_2.default.createElement("td", { colSpan: totalVisibleColumns, style: { padding: 0, border: "none", height: topPad } }))),
-        visibleRows.map(function (row, i) {
-            var _a;
-            var index = firstIndex + i;
-            var rowIndex = startRow + index;
-            var isExpanded = expandedRows.has(rowIndex);
-            var isChecked = selectionsSet.has(row.id);
-            return (react_2.default.createElement(TableRow, { key: (_a = row.id) !== null && _a !== void 0 ? _a : rowIndex, row: row, rowIndex: rowIndex, index: index, isChecked: isChecked, isExpanded: isExpanded, isContent: isContent, isLink: isLink, isCheckbox: isCheckbox, isLoading: isLoading, isActionFreeze: isActionFreeze, columns: columns, leftOffsets: leftOffsets, noBorders: noBorders, freezedBgColor: freezedBgColor, freezedTextColor: freezedTextColor, theme: theme, borderStyle: borderStyle, hoverStyle: hoverStyle, handleCheckbox: handleCheckbox, onRowClick: onRowClick, toggleRowExpansion: toggleRowExpansion }));
-        }),
-        shouldVirtualize && bottomPad > 0 && (react_2.default.createElement("tr", { "aria-hidden": "true", style: { height: bottomPad } },
-            react_2.default.createElement("td", { colSpan: totalVisibleColumns, style: { padding: 0, border: "none", height: bottomPad } })))));
-};
-exports.default = TableBody;

package/dist/Components/Table/TableSettings/TableFilters.d.ts

@@ -1,10 +0,0 @@
-import React from "react";
-type TableFiltersMethods = {
-    getSelectedFilters: () => string[];
-};
-declare const TableFilters: ({ filters, childFilterMethodsRef, filterSelected, }: {
-    filters?: string[];
-    childFilterMethodsRef?: React.Ref<TableFiltersMethods>;
-    filterSelected?: string[];
-}) => React.JSX.Element | null;
-export default TableFilters;

package/dist/Components/Table/TableSettings/TableFilters.js

@@ -1,69 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = require("@chakra-ui/react");
-var react_2 = __importStar(require("react"));
-var Checkbox_1 = __importDefault(require("../../Checkbox/Checkbox"));
-var TableFilters = function (_a) {
-    var filters = _a.filters, childFilterMethodsRef = _a.childFilterMethodsRef, filterSelected = _a.filterSelected;
-    var _b = (0, react_2.useState)(filterSelected !== null && filterSelected !== void 0 ? filterSelected : []), selectedFilters = _b[0], setSelectedFilters = _b[1];
-    (0, react_2.useEffect)(function () {
-        setSelectedFilters(filterSelected !== null && filterSelected !== void 0 ? filterSelected : []);
-    }, [filterSelected]);
-    (0, react_2.useImperativeHandle)(childFilterMethodsRef, function () { return ({
-        getSelectedFilters: function () { return selectedFilters; },
-    }); }, [selectedFilters]);
-    if (!(filters === null || filters === void 0 ? void 0 : filters.length))
-        return null;
-    return (react_2.default.createElement(react_1.Box, { display: "flex", flexDirection: "column", gap: "0.375rem" }, filters.map(function (value) { return (react_2.default.createElement(Checkbox_1.default, { key: value, value: value, isChecked: selectedFilters.includes(value), onChange: function (e) {
-            setSelectedFilters(function (prev) {
-                return e.target.checked
-                    ? __spreadArray(__spreadArray([], prev, true), [value], false) : prev.filter(function (f) { return f !== value; });
-            });
-        }, label: value })); })));
-};
-exports.default = TableFilters;

package/dist/Components/Table/TableSettings/TableFilters.test.d.ts

@@ -1 +0,0 @@
-import "@testing-library/jest-dom";