pixelize-design-library 3.0.1-beta.1 → 3.1.0

package/dist/Components/Table/CompactSelect.d.ts

@@ -1,15 +0,0 @@
-import React from "react";
-export type Options = {
-    id: string | number;
-    label: string;
-};
-type Props = {
-    options: Options[];
-    value?: Options;
-    placeholder?: string;
-    height?: string | number;
-    onSelect?: (option: Options) => void;
-    size?: "xs" | "sm";
-};
-declare const CompactSelect: React.FC<Props>;
-export default CompactSelect;

package/dist/Components/Table/CompactSelect.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;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var lucide_react_1 = require("lucide-react");
-var CompactSelect = function (_a) {
-    var options = _a.options, value = _a.value, _b = _a.placeholder, placeholder = _b === void 0 ? "Select" : _b, _c = _a.height, height = _c === void 0 ? "22px" : _c, onSelect = _a.onSelect, _d = _a.size, size = _d === void 0 ? "xs" : _d;
-    var _e = (0, react_1.useState)(false), isOpen = _e[0], setIsOpen = _e[1];
-    var _f = (0, react_1.useState)(""), query = _f[0], setQuery = _f[1];
-    var filtered = (0, react_1.useMemo)(function () {
-        var q = query.trim().toLowerCase();
-        if (!q)
-            return options;
-        return options.filter(function (o) { return (o.label || "").toLowerCase().includes(q); });
-    }, [query, options]);
-    return (react_1.default.createElement(react_2.Popover, { isOpen: isOpen, onClose: function () { return setIsOpen(false); }, placement: "bottom-start" },
-        react_1.default.createElement(react_2.PopoverTrigger, null,
-            react_1.default.createElement(react_2.Box, { as: "button", type: "button", w: "100%", h: typeof height === "number" ? "".concat(height, "px") : height, display: "flex", alignItems: "center", justifyContent: "space-between", gap: 2, px: 2, border: "0.063rem solid", borderColor: "gray.300", bg: "white", borderRadius: "0.25rem", onClick: function () { return setIsOpen(function (prev) { return !prev; }); } },
-                react_1.default.createElement(react_2.Text, { fontSize: size === "xs" ? "0.75rem" : "0.875rem", color: "gray.800", noOfLines: 1, textAlign: "left" }, (value === null || value === void 0 ? void 0 : value.label) || placeholder),
-                isOpen ? react_1.default.createElement(lucide_react_1.ChevronUp, { size: 12 }) : react_1.default.createElement(lucide_react_1.ChevronDown, { size: 12 }))),
-        react_1.default.createElement(react_2.Portal, null,
-            react_1.default.createElement(react_2.PopoverContent, { w: "100%", maxW: "14rem", p: 0, zIndex: 1600 },
-                react_1.default.createElement(react_2.PopoverBody, { p: 2 },
-                    react_1.default.createElement(react_2.VStack, { spacing: 2, align: "stretch" },
-                        react_1.default.createElement(react_2.Input, { size: size, placeholder: "Search", value: query, onChange: function (e) { return setQuery(e.target.value); }, sx: { fontSize: "0.75rem", height: "22px" } }),
-                        react_1.default.createElement(react_2.Box, { maxH: "12rem", overflowY: "auto", borderTop: "1px solid", borderColor: "gray.100" },
-                            filtered.map(function (opt) { return (react_1.default.createElement(react_2.Box, { key: opt.id, px: 2, py: 1, cursor: "pointer", _hover: { bg: "gray.50" }, bg: (value === null || value === void 0 ? void 0 : value.id) === opt.id ? "gray.100" : "transparent", onClick: function () {
-                                    onSelect === null || onSelect === void 0 ? void 0 : onSelect(opt);
-                                    setIsOpen(false);
-                                    setQuery("");
-                                } },
-                                react_1.default.createElement(react_2.Text, { fontSize: "0.75rem" }, opt.label))); }),
-                            filtered.length === 0 && (react_1.default.createElement(react_2.Box, { px: 2, py: 2 },
-                                react_1.default.createElement(react_2.Text, { fontSize: "0.75rem", color: "gray.500" }, "No results"))))))))));
-};
-exports.default = CompactSelect;

package/dist/Components/Table/Components/ActiveFilters.js

@@ -1,132 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var lucide_react_1 = require("lucide-react");
-var useCustomTheme_1 = require("../../../Theme/useCustomTheme");
-var Divider_1 = __importDefault(require("../../Divider/Divider"));
-var ActiveFilters = react_1.default.memo(function (_a) {
-    var _b, _c, _d, _e, _f, _g, _h, _j;
-    var columns = _a.columns, columnsSearch = _a.columnsSearch, setColumnsSearch = _a.setColumnsSearch;
-    var theme = (0, useCustomTheme_1.useCustomTheme)();
-    var columnLabelMap = (0, react_1.useMemo)(function () {
-        var map = new Map();
-        for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {
-            var col = columns_1[_i];
-            map.set(col.id, col.label);
-        }
-        return map;
-    }, [columns]);
-    var activeFilters = (0, react_1.useMemo)(function () {
-        return Object.entries(columnsSearch)
-            .filter(function (_a) {
-            var _ = _a[0], value = _a[1];
-            return value && value.trim() !== "";
-        })
-            .map(function (_a) {
-            var columnId = _a[0], value = _a[1];
-            return ({
-                columnId: columnId,
-                label: columnLabelMap.get(columnId) || columnId,
-                value: value.trim(),
-            });
-        });
-    }, [columnsSearch, columnLabelMap]);
-    if (activeFilters.length === 0) {
-        return null;
-    }
-    var handleRemoveFilter = (0, react_1.useCallback)(function (columnId) {
-        setColumnsSearch(function (prev) {
-            var newSearch = __assign({}, prev);
-            delete newSearch[columnId];
-            return newSearch;
-        });
-    }, [setColumnsSearch]);
-    var handleClearAll = (0, react_1.useCallback)(function () {
-        setColumnsSearch({});
-    }, [setColumnsSearch]);
-    return (react_1.default.createElement(react_2.Box, { px: 2, py: 1, bg: ((_c = (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.background) === null || _c === void 0 ? void 0 : _c[100]) || ((_e = (_d = theme.colors) === null || _d === void 0 ? void 0 : _d.gray) === null || _e === void 0 ? void 0 : _e[50]), overflowX: "auto", sx: {
-            '&::-webkit-scrollbar': {
-                height: '6px',
-            },
-            '&::-webkit-scrollbar-track': {
-                background: theme.colors.gray[100],
-                borderRadius: '3px',
-            },
-            '&::-webkit-scrollbar-thumb': {
-                background: theme.colors.gray[400],
-                borderRadius: '3px',
-            },
-            '&::-webkit-scrollbar-thumb:hover': {
-                background: theme.colors.gray[500],
-            },
-            scrollbarWidth: 'thin',
-            scrollbarColor: "".concat(theme.colors.gray[400], " ").concat(theme.colors.gray[100]),
-        } },
-        react_1.default.createElement(react_2.Box, { display: "flex", alignItems: "center", gap: 2, flexWrap: "nowrap", minW: "max-content" },
-            activeFilters.length > 0 && react_1.default.createElement(Divider_1.default, null),
-            activeFilters.map(function (filter) {
-                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
-                return (react_1.default.createElement(react_2.Flex, { key: filter.columnId, alignItems: "center", gap: 1, px: 2, py: 1, bg: ((_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.blue) === null || _b === void 0 ? void 0 : _b[50]) || ((_d = (_c = theme.colors) === null || _c === void 0 ? void 0 : _c.primary) === null || _d === void 0 ? void 0 : _d[50]), borderRadius: "md", border: "0.063rem solid ".concat(((_f = (_e = theme.colors) === null || _e === void 0 ? void 0 : _e.blue) === null || _f === void 0 ? void 0 : _f[200]) || ((_h = (_g = theme.colors) === null || _g === void 0 ? void 0 : _g.primary) === null || _h === void 0 ? void 0 : _h[200])), flexShrink: 0 },
-                    react_1.default.createElement(react_2.Text, { fontSize: "sm", color: (_k = (_j = theme.colors) === null || _j === void 0 ? void 0 : _j.gray) === null || _k === void 0 ? void 0 : _k[700], whiteSpace: "nowrap" },
-                        react_1.default.createElement(react_2.Text, { as: "span", fontWeight: 600 },
-                            filter.label,
-                            ":"),
-                        " ",
-                        filter.value),
-                    react_1.default.createElement(react_2.IconButton, { "aria-label": "Remove filter for ".concat(filter.label), icon: react_1.default.createElement(lucide_react_1.X, { size: 14 }), size: "xs", variant: "ghost", onClick: function () { return handleRemoveFilter(filter.columnId); }, _hover: {
-                            bg: ((_m = (_l = theme.colors) === null || _l === void 0 ? void 0 : _l.blue) === null || _m === void 0 ? void 0 : _m[100]) || ((_p = (_o = theme.colors) === null || _o === void 0 ? void 0 : _o.primary) === null || _p === void 0 ? void 0 : _p[100]),
-                        }, minW: "auto", h: "auto", p: 0.5, flexShrink: 0 })));
-            }),
-            activeFilters.length > 1 && (react_1.default.createElement(react_2.Text, { as: "p", className: "clear-all-text", "aria-label": "Clear All", fontSize: "sm", color: ((_g = (_f = theme.colors) === null || _f === void 0 ? void 0 : _f.blue) === null || _g === void 0 ? void 0 : _g[600]) || ((_j = (_h = theme.colors) === null || _h === void 0 ? void 0 : _h.primary) === null || _j === void 0 ? void 0 : _j[600]), cursor: "pointer", fontWeight: 500, onClick: handleClearAll, _hover: {
-                    textDecoration: "underline",
-                }, flexShrink: 0, whiteSpace: "nowrap" }, "Clear All")))));
-});
-exports.default = ActiveFilters;

package/dist/Components/Table/Components/HeaderActions.d.ts

@@ -1,7 +0,0 @@
-import React from "react";
-import { HeaderActionsProps } from "../TableProps";
-declare const HeaderActions: ({ actions, selections, }: {
-    actions?: HeaderActionsProps;
-    selections: (string | number)[];
-}) => React.JSX.Element;
-export default HeaderActions;

package/dist/Components/Table/Components/HeaderActions.js

@@ -1,48 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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 lucide_react_1 = require("lucide-react");
-var react_2 = __importDefault(require("react"));
-var useCustomTheme_1 = require("../../../Theme/useCustomTheme");
-var ListItem = function (_a) {
-    var _b, _c;
-    var icon = _a.icon, name = _a.name, onClick = _a.onClick, selections = _a.selections, _d = _a.isHoverEnabled, isHoverEnabled = _d === void 0 ? false : _d, hoverColor = _a.hoverColor;
-    var colors = (0, useCustomTheme_1.useCustomTheme)().colors;
-    var styledIcon = react_2.default.cloneElement(icon, {
-        color: "currentColor",
-        size: "1.25rem",
-    });
-    return (react_2.default.createElement(react_1.Box, { display: "flex", alignItems: "center", gap: "0.375rem", cursor: "pointer", onClick: function () { return onClick && onClick(selections); }, color: (_b = colors === null || colors === void 0 ? void 0 : colors.text) === null || _b === void 0 ? void 0 : _b[500], _hover: isHoverEnabled
-            ? { color: hoverColor ? hoverColor : (_c = colors === null || colors === void 0 ? void 0 : colors.primary) === null || _c === void 0 ? void 0 : _c[500] } // ✅ hover updates both
-            : {}, transition: "color 0.2s ease" // ✅ smooth animation
-     },
-        styledIcon,
-        " ",
-        name));
-};
-var HeaderActions = function (_a) {
-    var _b, _c, _d, _e, _f, _g, _h, _j, _k;
-    var actions = _a.actions, selections = _a.selections;
-    var colors = (0, useCustomTheme_1.useCustomTheme)().colors;
-    return (react_2.default.createElement(react_1.Box, { display: "flex", gap: 4, fontSize: "0.875rem", fontWeight: 400, color: (_b = colors === null || colors === void 0 ? void 0 : colors.secondary) === null || _b === void 0 ? void 0 : _b[500] },
-        ((_c = actions === null || actions === void 0 ? void 0 : actions.isDelete) === null || _c === void 0 ? void 0 : _c.enabled) && (react_2.default.createElement(ListItem, { icon: react_2.default.createElement(lucide_react_1.Trash2, { className: "w-4 h-4" }), name: "Delete", onClick: (_d = actions === null || actions === void 0 ? void 0 : actions.isDelete) === null || _d === void 0 ? void 0 : _d.onClick, selections: selections, isHoverEnabled: true, hoverColor: (_e = colors === null || colors === void 0 ? void 0 : colors.red) === null || _e === void 0 ? void 0 : _e[500] })),
-        ((_f = actions === null || actions === void 0 ? void 0 : actions.isUpdate) === null || _f === void 0 ? void 0 : _f.enabled) && (react_2.default.createElement(ListItem, { icon: react_2.default.createElement(lucide_react_1.SquarePen, { className: "w-4 h-4" }), name: "Mass Update", onClick: (_g = actions === null || actions === void 0 ? void 0 : actions.isUpdate) === null || _g === void 0 ? void 0 : _g.onClick, selections: selections, isHoverEnabled: true, hoverColor: (_h = colors === null || colors === void 0 ? void 0 : colors.primary) === null || _h === void 0 ? void 0 : _h[500] })),
-        ((_j = actions === null || actions === void 0 ? void 0 : actions.items) === null || _j === void 0 ? void 0 : _j.length)
-            ? (_k = actions === null || actions === void 0 ? void 0 : actions.items) === null || _k === void 0 ? void 0 : _k.map(function (item) { return (react_2.default.createElement(ListItem, __assign({}, item, { selections: selections }))); })
-            : null));
-};
-exports.default = HeaderActions;

package/dist/Components/Table/Components/Pagination.d.ts

@@ -1,14 +0,0 @@
-import React from "react";
-import { TableProps } from "../TableProps";
-type PaginationProps = Pick<TableProps, "isVisiblity" | "columns" | "paginationSelectOptions"> & {
-    paginationText: string;
-    handlePageSizeChange: (event: React.ChangeEvent<HTMLSelectElement>) => void;
-    rowsPerPage: number;
-    currentPage: number;
-    pages: number;
-    setCurrentPage: React.Dispatch<React.SetStateAction<number>>;
-    dataLength: number;
-    isServerPagination: boolean;
-};
-declare const Pagination: React.MemoExoticComponent<({ paginationText, handlePageSizeChange, rowsPerPage, currentPage, pages, setCurrentPage, dataLength, isServerPagination, paginationSelectOptions, }: PaginationProps) => React.JSX.Element>;
-export default Pagination;

package/dist/Components/Table/Components/Pagination.js

@@ -1,68 +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;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var table_1 = require("../../../Utils/table");
-var lucide_react_1 = require("lucide-react");
-var Pagination = react_1.default.memo(function (_a) {
-    var paginationText = _a.paginationText, handlePageSizeChange = _a.handlePageSizeChange, rowsPerPage = _a.rowsPerPage, currentPage = _a.currentPage, pages = _a.pages, setCurrentPage = _a.setCurrentPage, dataLength = _a.dataLength, isServerPagination = _a.isServerPagination, paginationSelectOptions = _a.paginationSelectOptions;
-    var computedOptions = (0, react_1.useMemo)(function () {
-        return paginationSelectOptions && paginationSelectOptions.length
-            ? paginationSelectOptions
-            : (0, table_1.pageSizeCalculation)(dataLength);
-    }, [paginationSelectOptions, dataLength]);
-    // const isLeftDisabled = currentPage === 0;
-    // const isRightDisabled = currentPage >= pages - 1;
-    var isLeftDisabled = dataLength === 0 || currentPage === 0;
-    var isRightDisabled = dataLength === 0 || currentPage >= pages - 1;
-    return (react_1.default.createElement(react_2.Flex, { justify: "flex-end", align: "center", flexWrap: "nowrap" },
-        (!isServerPagination || paginationSelectOptions) && (react_1.default.createElement(react_2.Select, { onChange: handlePageSizeChange, value: rowsPerPage, size: "xs", borderRadius: 3, width: 20, isDisabled: dataLength === 0 },
-            !paginationSelectOptions && dataLength < 100 ? react_1.default.createElement("option", { value: 0 }) : null,
-            computedOptions.map(function (size, index) { return (react_1.default.createElement("option", { key: index, value: size }, String(size))); }))),
-        dataLength > 0 && (react_1.default.createElement(react_2.Flex, { w: "100%" },
-            react_1.default.createElement(react_2.IconButton, { "aria-label": "first-page", color: isLeftDisabled ? "gray" : "black", rounded: "full", variant: isLeftDisabled ? "plain" : "ghost", onClick: function () { return setCurrentPage(0); } },
-                react_1.default.createElement(lucide_react_1.ChevronsLeft, null)),
-            react_1.default.createElement(react_2.IconButton, { "aria-label": "previous-page", color: isLeftDisabled ? "gray" : "black", rounded: "full", variant: isLeftDisabled ? "plain" : "ghost", onClick: function () { return currentPage > 0 && setCurrentPage(currentPage - 1); } },
-                react_1.default.createElement(lucide_react_1.ChevronLeft, null)),
-            react_1.default.createElement(react_2.Text, { mt: 3, fontSize: 12, whiteSpace: "nowrap" }, paginationText),
-            react_1.default.createElement(react_2.IconButton, { "aria-label": "next-page", color: isRightDisabled ? "gray" : "black", rounded: "full", variant: isRightDisabled ? "plain" : "ghost", onClick: function () {
-                    return currentPage < pages - 1 && setCurrentPage(currentPage + 1);
-                } },
-                react_1.default.createElement(lucide_react_1.ChevronRight, null)),
-            react_1.default.createElement(react_2.IconButton, { "aria-label": "last-page", color: isRightDisabled ? "gray" : "black", rounded: "full", variant: isRightDisabled ? "plain" : "ghost", onClick: function () { return setCurrentPage(pages - 1); } },
-                react_1.default.createElement(lucide_react_1.ChevronsRight, null))))));
-});
-exports.default = Pagination;

package/dist/Components/Table/Components/TableActions.d.ts

@@ -1,12 +0,0 @@
-import React, { ReactNode } from "react";
-type TableRowActions = {
-    onLink?: (row: any) => void;
-    onEdit?: (row: any) => void;
-    onDelete?: (row: any) => void;
-    actions?: () => ReactNode;
-    [key: string]: any;
-};
-declare const TableActions: ({ row }: {
-    row?: TableRowActions;
-}) => React.JSX.Element | null;
-export default TableActions;

package/dist/Components/Table/Components/TableActions.js

@@ -1,107 +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;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var lucide_react_1 = require("lucide-react");
-var useCustomTheme_1 = require("../../../Theme/useCustomTheme");
-var TableActions = function (_a) {
-    var _b, _c, _d;
-    var row = _a.row;
-    var _e = (0, react_1.useState)(false), isOpen = _e[0], setIsOpen = _e[1];
-    var ref = (0, react_1.useRef)(null);
-    var theme = (0, useCustomTheme_1.useCustomTheme)();
-    // Listen for "close-all-popovers"
-    (0, react_1.useEffect)(function () {
-        var handler = function () { return setIsOpen(false); };
-        window.addEventListener("close-all-popovers", handler);
-        return function () { return window.removeEventListener("close-all-popovers", handler); };
-    }, []);
-    // Detect outside click
-    (0, react_1.useEffect)(function () {
-        var handleClickOutside = function (event) {
-            if (ref.current && !ref.current.contains(event.target)) {
-                setIsOpen(false);
-            }
-        };
-        if (isOpen) {
-            // ✅ Use click instead of mousedown
-            document.addEventListener("click", handleClickOutside);
-        }
-        return function () {
-            document.removeEventListener("click", handleClickOutside);
-        };
-    }, [isOpen]);
-    var handleOpen = function () {
-        window.dispatchEvent(new Event("close-all-popovers")); // close others
-        setIsOpen(true);
-    };
-    var handleClose = function () { return setIsOpen(false); };
-    // ✅ if row itself is missing, render nothing
-    if (!row)
-        return null;
-    return (react_1.default.createElement(react_2.Popover, { placement: "bottom-start", isOpen: isOpen, onClose: handleClose, closeOnBlur: false },
-        react_1.default.createElement("div", { ref: ref },
-            react_1.default.createElement(react_2.PopoverTrigger, null,
-                react_1.default.createElement(react_2.IconButton, { "aria-label": "Actions", color: "black", icon: react_1.default.createElement(lucide_react_1.EllipsisVertical, { size: 17 }), size: "sm", p: 0, variant: "ghost", _hover: { transform: "scale(1.2)" }, onClick: function () { return (isOpen ? handleClose() : handleOpen()); } })),
-            react_1.default.createElement(react_2.Portal, null,
-                react_1.default.createElement(react_2.PopoverContent, { w: "auto", minW: "100px", boxShadow: "lg", p: 0, zIndex: 999 },
-                    react_1.default.createElement(react_2.PopoverBody, { p: 0, m: 0 },
-                        react_1.default.createElement(react_2.VStack, { align: "stretch", spacing: 1, p: 0, m: 0 },
-                            row.onLink && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", justifyContent: "flex-start", borderBottom: "1px solid ".concat((_b = theme.colors) === null || _b === void 0 ? void 0 : _b.border[500]), borderRadius: 0, gap: 2, onClick: function () {
-                                    var _a;
-                                    (_a = row.onLink) === null || _a === void 0 ? void 0 : _a.call(row, row);
-                                    // handleClose();
-                                } },
-                                react_1.default.createElement(lucide_react_1.ExternalLink, { size: 17 }),
-                                " View")),
-                            row.onEdit && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", justifyContent: "flex-start", gap: 2, borderBottom: "1px solid ".concat((_c = theme.colors) === null || _c === void 0 ? void 0 : _c.border[500]), borderRadius: 0, onClick: function () {
-                                    var _a;
-                                    (_a = row.onEdit) === null || _a === void 0 ? void 0 : _a.call(row, row);
-                                    // handleClose();
-                                } },
-                                react_1.default.createElement(lucide_react_1.Pencil, { size: 17 }),
-                                " Edit")),
-                            row.onDelete && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", justifyContent: "flex-start", colorScheme: "red", gap: 2, borderRadius: 0, onClick: function () {
-                                    var _a;
-                                    (_a = row.onDelete) === null || _a === void 0 ? void 0 : _a.call(row, row);
-                                    // handleClose();
-                                } },
-                                react_1.default.createElement(lucide_react_1.Trash2, { size: 17 }),
-                                " Delete")),
-                            row.actions && ((_d = row === null || row === void 0 ? void 0 : row.actions) === null || _d === void 0 ? void 0 : _d.call(row)),
-                            !row.onLink && !row.onEdit && !row.onDelete && (react_1.default.createElement(react_2.Button, { size: "sm", variant: "ghost", isDisabled: true, justifyContent: "center" }, "No actions")))))))));
-};
-exports.default = TableActions;

package/dist/Components/Table/Components/TableBody.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import { TableBodyPageProps } from "../TableProps";
-declare const TableBody: ({ data, isCheckbox, columns, startRow, columnWidths, freezedBgColor, freezedTextColor, noBorders, handleCheckbox, selections, isLoading, onRowClick, isContent, isLink, isActionFreeze, loadingSkeletonRows, }: TableBodyPageProps) => React.JSX.Element;
-export default TableBody;

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

@@ -1,144 +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;
-    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]);
-    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" }))))),
-        data.map(function (row, index) {
-            var _a;
-            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 }));
-        })));
-};
-exports.default = TableBody;