pixelize-design-library 2.3.1-beta.1 → 2.3.1-beta.3

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

@@ -1,47 +0,0 @@
-import { ColumnSortingProps, DataObject, TableHeaderProps } from "../TableProps";
-type UseTableProps = {
-    tableBorderColor?: string;
-    data: DataObject[];
-    isPagination: boolean;
-    selections?: (string | number)[];
-    columns: TableHeaderProps[];
-    onSelection?: (selected: (string | number)[]) => void;
-    tablePreferences?: Record<string, any>;
-    savePreferences?: (data: Record<string, any>) => void;
-    noOfRowsPerPage?: number;
-    isServerPagination: boolean;
-    totalRecords: number;
-    onNoOfRowsPerPageChange?: (noOfRows: number) => void;
-    defaultVisibleColumns?: number;
-};
-declare const useTable: ({ tableBorderColor, data, isPagination, selections, onSelection, tablePreferences, savePreferences, noOfRowsPerPage, isServerPagination, totalRecords, columns, onNoOfRowsPerPageChange, defaultVisibleColumns, }: UseTableProps) => {
-    tableData: DataObject[];
-    tableContainerStyles: {
-        borderRadius: string;
-        borderWidth: string;
-        borderColor: string;
-        boxShadow: string;
-        maxHeight: string;
-        overflowY: string;
-    };
-    isContent: boolean;
-    isLink: boolean;
-    headerRefs: import("react").MutableRefObject<(HTMLTableCellElement | null)[]>;
-    columnWidths: number[];
-    handleSort: (field: string | number, sort: "asc" | "desc" | "none") => void;
-    handleCheckbox: (id: string | number) => void;
-    filteredData: DataObject[];
-    startRow: number;
-    endRow: number;
-    selection: (string | number)[];
-    columnsSort: ColumnSortingProps[];
-    handlePageSizeChange: (event: React.ChangeEvent<HTMLSelectElement>) => void;
-    pages: number;
-    currentPage: number;
-    rowsPerPage: number;
-    setCurrentPage: import("react").Dispatch<import("react").SetStateAction<number>>;
-    columnsList: TableHeaderProps[];
-    handleColumnPreferences: (columns: any) => void;
-    isSelecting: boolean;
-};
-export default useTable;

package/dist/Components/Table/Components/useTable.js

@@ -1,219 +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 __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));
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = require("react");
-var useCustomTheme_1 = require("../../../Theme/useCustomTheme");
-var table_1 = require("../../../Utils/table");
-var defaultPageSize = 20;
-var mergeColumnWithPreference = function (pref, originalCol) {
-    if (!pref || typeof pref !== "object") {
-        return __assign({}, originalCol);
-    }
-    var next = __assign({}, originalCol);
-    if (typeof pref.isHidden === "boolean") {
-        next.isHidden = pref.isHidden;
-    }
-    if (typeof pref.label === "string" || typeof pref.label === "number") {
-        next.label = pref.label;
-    }
-    return next;
-};
-var useTable = function (_a) {
-    var _b, _c;
-    var tableBorderColor = _a.tableBorderColor, data = _a.data, isPagination = _a.isPagination, selections = _a.selections, onSelection = _a.onSelection, tablePreferences = _a.tablePreferences, savePreferences = _a.savePreferences, noOfRowsPerPage = _a.noOfRowsPerPage, isServerPagination = _a.isServerPagination, totalRecords = _a.totalRecords, columns = _a.columns, onNoOfRowsPerPageChange = _a.onNoOfRowsPerPageChange, defaultVisibleColumns = _a.defaultVisibleColumns;
-    var theme = (0, useCustomTheme_1.useCustomTheme)();
-    var headerRefs = (0, react_1.useRef)([]);
-    var _d = (0, react_1.useState)([]), columnWidths = _d[0], setColumnWidths = _d[1];
-    var _e = (0, react_1.useState)(selections !== null && selections !== void 0 ? selections : []), selection = _e[0], setSelection = _e[1];
-    var _f = (0, react_1.useState)([]), columnsSort = _f[0], setColumnsSort = _f[1];
-    var _g = (0, react_1.useState)(0), currentPage = _g[0], setCurrentPage = _g[1];
-    var _h = (0, react_1.useState)(noOfRowsPerPage !== null && noOfRowsPerPage !== void 0 ? noOfRowsPerPage : defaultPageSize), rowsPerPage = _h[0], setRowsPerPage = _h[1];
-    var prevRowsPerPageProp = (0, react_1.useRef)(noOfRowsPerPage);
-    if (noOfRowsPerPage !== prevRowsPerPageProp.current) {
-        prevRowsPerPageProp.current = noOfRowsPerPage;
-        if (noOfRowsPerPage !== undefined && noOfRowsPerPage !== rowsPerPage) {
-            setRowsPerPage(noOfRowsPerPage);
-        }
-    }
-    var tableData = data;
-    var _j = (0, react_1.useState)(function () {
-        return columns.map(function (col, i) {
-            var _a;
-            return (__assign(__assign({}, col), { isHidden: defaultVisibleColumns ? i >= defaultVisibleColumns : ((_a = col.isHidden) !== null && _a !== void 0 ? _a : false) }));
-        });
-    }), columnsList = _j[0], setColumnsList = _j[1];
-    (0, react_1.useEffect)(function () {
-        var _a;
-        var columnPreference = (_a = tablePreferences === null || tablePreferences === void 0 ? void 0 : tablePreferences.columns) !== null && _a !== void 0 ? _a : [];
-        if (Array.isArray(columnPreference) && columnPreference.length > 0) {
-            var mergedColumns = columnPreference.map(function (originalCol) {
-                var prefCol = columns.find(function (c) { return c.id === originalCol.id; });
-                return prefCol
-                    ? mergeColumnWithPreference(originalCol, prefCol)
-                    : __assign({}, originalCol);
-            });
-            setColumnsList(mergedColumns);
-        }
-        else {
-            setColumnsList(columns.map(function (col, i) {
-                var _a;
-                return (__assign(__assign({}, col), { isHidden: defaultVisibleColumns ? i >= defaultVisibleColumns : ((_a = col.isHidden) !== null && _a !== void 0 ? _a : false) }));
-            }));
-        }
-    }, [tablePreferences, columns, defaultVisibleColumns]);
-    var tableContainerStyles = (0, react_1.useMemo)(function () {
-        var _a;
-        return ({
-            borderRadius: "10px 0 0 10px",
-            borderWidth: "0px 0px 0px 5px",
-            borderColor: tableBorderColor !== null && tableBorderColor !== void 0 ? tableBorderColor : (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.gray[500],
-            boxShadow: theme.shadows.lg,
-            maxHeight: "50vh",
-            overflowY: "auto",
-        });
-    }, [tableBorderColor, theme]);
-    var prevIsContent = (0, react_1.useRef)(false);
-    var prevIsLink = (0, react_1.useRef)(false);
-    var isContent = (0, react_1.useMemo)(function () {
-        var result = tableData.some(function (o) { return o.content; });
-        prevIsContent.current = result;
-        return result;
-    }, [tableData.length === 0 ? 0 : (_b = tableData[0]) === null || _b === void 0 ? void 0 : _b.id, tableData.length]); // eslint-disable-line react-hooks/exhaustive-deps
-    var isLink = (0, react_1.useMemo)(function () {
-        var result = tableData.some(function (o) { return o.onLink || o.onDelete || o.onEdit; });
-        prevIsLink.current = result;
-        return result;
-    }, [tableData.length === 0 ? 0 : (_c = tableData[0]) === null || _c === void 0 ? void 0 : _c.id, tableData.length]); // eslint-disable-line react-hooks/exhaustive-deps
-    (0, react_1.useEffect)(function () {
-        var widths = headerRefs.current.map(function (ref) { return (ref === null || ref === void 0 ? void 0 : ref.offsetWidth) || 0; });
-        setColumnWidths(widths);
-    }, []);
-    var pages = (0, react_1.useMemo)(function () {
-        if (isServerPagination) {
-            return Math.ceil(totalRecords / (rowsPerPage || 1));
-        }
-        return isPagination ? Math.ceil(tableData.length / rowsPerPage) : 0;
-    }, [
-        isPagination,
-        rowsPerPage,
-        tableData.length,
-        totalRecords,
-        isServerPagination,
-    ]);
-    var startRow = (0, react_1.useMemo)(function () { return (!isPagination ? 0 : currentPage * rowsPerPage); }, [currentPage, isPagination, rowsPerPage]);
-    var endRow = (0, react_1.useMemo)(function () { return (!isPagination ? tableData.length : startRow + rowsPerPage); }, [isPagination, rowsPerPage, startRow, tableData.length]);
-    var filteredData = (0, react_1.useMemo)(function () {
-        if (isServerPagination) {
-            return tableData;
-        }
-        var sortedData = (0, table_1.SortMultiColumnData)(tableData, columnsSort);
-        return sortedData.slice(startRow, endRow);
-    }, [columnsSort, startRow, endRow, tableData, isServerPagination]);
-    var handlePageSizeChange = function (event) {
-        var value = Number(event.target.value);
-        setRowsPerPage(value !== 0 ? value : defaultPageSize);
-        if (onNoOfRowsPerPageChange) {
-            onNoOfRowsPerPageChange(value !== 0 ? value : defaultPageSize);
-        }
-        setCurrentPage(0);
-    };
-    var handleSort = (0, react_1.useCallback)(function (field, sort) {
-        if (!sort)
-            return;
-        setColumnsSort(function (prev) {
-            var newSortState = __spreadArray([], prev, true);
-            var existingIndex = newSortState.findIndex(function (s) { return s.column === field; });
-            if (existingIndex === -1) {
-                newSortState.push({
-                    column: field,
-                    direction: "asc",
-                });
-            }
-            else {
-                newSortState[existingIndex] = __assign(__assign({}, newSortState[existingIndex]), { direction: sort });
-            }
-            return newSortState;
-        });
-    }, []);
-    (0, react_1.useEffect)(function () {
-        setSelection(selections !== null && selections !== void 0 ? selections : []);
-    }, [selections]);
-    var _k = (0, react_1.useState)(false), isSelecting = _k[0], setIsSelecting = _k[1];
-    var selectionRef = (0, react_1.useRef)(selection);
-    selectionRef.current = selection;
-    var onSelectionRef = (0, react_1.useRef)(onSelection);
-    onSelectionRef.current = onSelection;
-    var handleCheckbox = (0, react_1.useCallback)(function (id) {
-        var _a;
-        var current = selectionRef.current;
-        if (id === 0) {
-            setIsSelecting(true);
-            setTimeout(function () {
-                var _a;
-                var selectedItems = current.length === tableData.length ? [] : tableData.map(function (item) { return item.id; });
-                setSelection(selectedItems);
-                (_a = onSelectionRef.current) === null || _a === void 0 ? void 0 : _a.call(onSelectionRef, selectedItems);
-                setIsSelecting(false);
-            }, 0);
-        }
-        else {
-            var selectedItems = void 0;
-            if (current.includes(id)) {
-                selectedItems = current.filter(function (item) { return item !== id; });
-            }
-            else {
-                selectedItems = __spreadArray(__spreadArray([], current, true), [id], false);
-            }
-            setSelection(selectedItems);
-            (_a = onSelectionRef.current) === null || _a === void 0 ? void 0 : _a.call(onSelectionRef, selectedItems);
-        }
-    }, [tableData]);
-    var handleColumnPreferences = function (columns) {
-        setColumnsList(columns);
-        savePreferences &&
-            savePreferences(__assign(__assign({}, tablePreferences), { columns: columns }));
-    };
-    return {
-        tableData: tableData,
-        tableContainerStyles: tableContainerStyles,
-        isContent: isContent,
-        isLink: isLink,
-        headerRefs: headerRefs,
-        columnWidths: columnWidths,
-        handleSort: handleSort,
-        handleCheckbox: handleCheckbox,
-        filteredData: filteredData,
-        startRow: startRow,
-        endRow: endRow,
-        selection: selection,
-        columnsSort: columnsSort,
-        handlePageSizeChange: handlePageSizeChange,
-        pages: pages,
-        currentPage: currentPage,
-        rowsPerPage: rowsPerPage,
-        setCurrentPage: setCurrentPage,
-        columnsList: columnsList,
-        handleColumnPreferences: handleColumnPreferences,
-        isSelecting: isSelecting,
-    };
-};
-exports.default = useTable;

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

@@ -1,36 +0,0 @@
-import React from "react";
-export type FilterItem = {
-    id: string;
-    label: string;
-    type?: "text" | "select" | "user" | "date";
-    option?: {
-        id: string;
-        label: string;
-    }[];
-};
-export type FilterSection = {
-    id: string;
-    label: string;
-    items?: FilterItem[];
-    initiallyExpanded?: boolean;
-    radio?: boolean;
-};
-export type SelectedFilterItem = {
-    id: string;
-    condition?: string;
-    value?: any;
-    type?: "text" | "select" | "user" | "date";
-};
-export type LeftFilterPaneProps = {
-    title?: string;
-    height?: number | string;
-    sections: FilterSection[];
-    selected?: Record<string, any>;
-    onApply?: (selected: any) => void;
-    onClear?: () => void;
-    theme: any;
-    isApplyLoading?: boolean;
-    filterMode?: "sidebar" | "modal";
-};
-declare const LeftFilterPane: ({ title, height, sections, selected: selectedProp, onApply, onClear, theme, isApplyLoading, filterMode, }: LeftFilterPaneProps) => React.JSX.Element;
-export default LeftFilterPane;

package/dist/Components/Table/LeftFilterPane.js

@@ -1,273 +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 __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 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var lucide_react_1 = require("lucide-react");
-var framer_motion_1 = require("framer-motion");
-var react_3 = require("@chakra-ui/react");
-var Checkbox_1 = __importDefault(require("../Checkbox/Checkbox"));
-var RadioButton_1 = require("../RadioButton/RadioButton");
-var TextOperationControls_1 = require("./TextOperationControls");
-var SelectOperationControls_1 = require("./SelectOperationControls");
-var CompactSelect_1 = __importDefault(require("./CompactSelect"));
-var DatePicker_1 = __importDefault(require("../DatePicker/DatePicker"));
-// ─── Helpers ──────────────────────────────────────────────────────────────────
-var LABEL_MAX_LENGTH = 18;
-function formatHeaderLabel(label) {
-    var text = (label || "").trim();
-    if (text.length <= LABEL_MAX_LENGTH)
-        return text;
-    var parts = text.split(/\s+/);
-    if (parts.length < 2)
-        return text;
-    var removable = new Set(["filters", "fields", "modules", "status", "action"]);
-    if (removable.has(parts[parts.length - 1].toLowerCase())) {
-        parts = parts.slice(0, -1);
-    }
-    while (parts.join(" ").length > LABEL_MAX_LENGTH && parts.length > 2) {
-        parts = parts.slice(0, -1);
-    }
-    return "".concat(parts.join(" "), "..");
-}
-var SectionLabel = function (_a) {
-    var label = _a.label, _b = _a.flex, flex = _b === void 0 ? false : _b, theme = _a.theme;
-    var needsTooltip = label.length > LABEL_MAX_LENGTH;
-    var content = (react_1.default.createElement(react_2.Box, { as: "span", flex: flex ? "1" : undefined, textAlign: "left", fontWeight: "medium", fontSize: "sm", sx: { whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" } }, formatHeaderLabel(label)));
-    if (!needsTooltip)
-        return content;
-    return (react_1.default.createElement(react_2.Tooltip, { label: label, hasArrow: true, placement: "top", bg: theme.colors.gray[600], color: theme.colors.white, fontSize: "0.75rem" }, content));
-};
-var ActiveItemControls = function (_a) {
-    var activeItem = _a.activeItem, sec = _a.sec, setTextOperator = _a.setTextOperator, setTextValue = _a.setTextValue;
-    if (!activeItem)
-        return null;
-    if (activeItem.type === "date") {
-        return (react_1.default.createElement(DatePicker_1.default, { size: "sm", selectedDate: activeItem.value, onChange: function (val) { return setTextValue(sec.id, activeItem.id, val); } }));
-    }
-    if (activeItem.type === "text") {
-        return (react_1.default.createElement(TextOperationControls_1.TextOperationControls, { operator: activeItem.condition || "contains", value: activeItem.value || "", onOperatorChange: function (op) { return setTextOperator(sec.id, activeItem.id, op); }, onValueChange: function (val) { return setTextValue(sec.id, activeItem.id, val); } }));
-    }
-    if (activeItem.type === "select" || activeItem.type === "user") {
-        var def = (sec.items || []).find(function (i) { return i.id === activeItem.id; });
-        var opts = (def === null || def === void 0 ? void 0 : def.selectOption) || (def === null || def === void 0 ? void 0 : def.option) || [];
-        return (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(SelectOperationControls_1.SelectOperationControls, { operator: activeItem.condition || "is", onOperatorChange: function (op) { return setTextOperator(sec.id, activeItem.id, op); }, size: "xs", ml: "1.25rem", mt: 2 }),
-            react_1.default.createElement(react_2.Box, { mt: 2, ml: "1.25rem" },
-                react_1.default.createElement(CompactSelect_1.default, { placeholder: def === null || def === void 0 ? void 0 : def.label, size: "xs", height: "22px", options: opts, value: activeItem.value, onSelect: function (option) { return setTextValue(sec.id, activeItem.id, option); } }))));
-    }
-    return null;
-};
-var SectionContent = function (_a) {
-    var _b;
-    var sec = _a.sec, selected = _a.selected, toggleItem = _a.toggleItem, setTextOperator = _a.setTextOperator, setTextValue = _a.setTextValue, setSelected = _a.setSelected;
-    if (sec.radio) {
-        var activeItem = (_b = selected[sec.id]) === null || _b === void 0 ? void 0 : _b[0];
-        return (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(RadioButton_1.RadioButtonGroup, { value: (activeItem === null || activeItem === void 0 ? void 0 : activeItem.id) || "", onChange: function (val) {
-                    var item = (sec.items || []).find(function (i) { return i.id === val; });
-                    setSelected(function (prev) {
-                        var _a;
-                        return (__assign(__assign({}, prev), (_a = {}, _a[sec.id] = val
-                            ? [{ id: val, type: item === null || item === void 0 ? void 0 : item.type, condition: (item === null || item === void 0 ? void 0 : item.type) === "text" ? "contains" : "is", value: "" }]
-                            : [], _a)));
-                    });
-                }, options: (sec.items || []).map(function (it) { return ({ label: it.label, id: it.id }); }), size: "sm", spacing: "0.35rem", direction: "column", align: "start", labelFontSize: "0.75rem", labelClampLines: 1, showLabelTooltip: function (item) { return item.label.length > LABEL_MAX_LENGTH; } }),
-            activeItem && (react_1.default.createElement(ActiveItemControls, { activeItem: activeItem, sec: sec, setTextOperator: setTextOperator, setTextValue: setTextValue }))));
-    }
-    return (react_1.default.createElement(react_2.VStack, { spacing: 2, align: "stretch" }, (sec.items || []).map(function (it) {
-        var sectionItems = selected[sec.id] || [];
-        var activeItem = sectionItems.find(function (i) { return i.id === it.id; });
-        var checked = !!activeItem;
-        return (react_1.default.createElement(react_1.default.Fragment, { key: it.id },
-            react_1.default.createElement(Checkbox_1.default, { label: it.label, labelFontSize: "0.75rem", showLabelTooltip: it.label.length > LABEL_MAX_LENGTH, labelTooltip: it.label, labelClampLines: 1, isChecked: checked, onChange: function (e) { return toggleItem(sec.id, it.id, e.target.checked, it.type); }, size: "sm", iconSize: "0.5rem", spacing: "0.5rem", sx: {
-                    gap: "0.5rem",
-                    hiteSpace: "normal",
-                    wordBreak: "break-word",
-                    overflow: "hidden",
-                    textOverflow: "ellipsis",
-                    ".chakra-checkbox__control": { width: "12px", height: "12px", mt: "2px" },
-                    ".chakra-checkbox__label": { lineHeight: "1rem", whiteSpace: "normal", wordBreak: "break-word" },
-                } }),
-            checked && it.type === "date" && (react_1.default.createElement(react_2.Box, { ml: "1.25rem" },
-                react_1.default.createElement(DatePicker_1.default, { size: "sm", selectedDate: activeItem.value, onChange: function (val) { return setTextValue(sec.id, it.id, val); } }))),
-            checked && it.type === "text" && (react_1.default.createElement(TextOperationControls_1.TextOperationControls, { operator: activeItem.condition || "contains", value: activeItem.value || "", onOperatorChange: function (op) { return setTextOperator(sec.id, it.id, op); }, onValueChange: function (val) { return setTextValue(sec.id, it.id, val); } })),
-            checked && (it.type === "select" || it.type === "user") && (react_1.default.createElement(react_2.Box, null,
-                react_1.default.createElement(SelectOperationControls_1.SelectOperationControls, { operator: activeItem.condition || "is", onOperatorChange: function (op) { return setTextOperator(sec.id, it.id, op); }, size: "xs", ml: "1.25rem" }),
-                react_1.default.createElement(react_2.Box, { mt: 2, ml: "1.25rem" },
-                    react_1.default.createElement(CompactSelect_1.default, { placeholder: it.label, size: "xs", height: "30px", options: it.selectOption || it.option || [], value: activeItem.value, onSelect: function (option) { return setTextValue(sec.id, it.id, option); } }))))));
-    })));
-};
-// ─── Main Component ───────────────────────────────────────────────────────────
-var LeftFilterPane = function (_a) {
-    var _b, _c, _d, _e;
-    var _f = _a.title, title = _f === void 0 ? "Filter" : _f, _g = _a.height, height = _g === void 0 ? 300 : _g, sections = _a.sections, selectedProp = _a.selected, onApply = _a.onApply, onClear = _a.onClear, theme = _a.theme, _h = _a.isApplyLoading, isApplyLoading = _h === void 0 ? false : _h, _j = _a.filterMode, filterMode = _j === void 0 ? "sidebar" : _j;
-    var _k = (0, react_1.useState)(!!(selectedProp === null || selectedProp === void 0 ? void 0 : selectedProp.search)), isSearching = _k[0], setIsSearching = _k[1];
-    var _l = (0, react_1.useState)({}), localSelected = _l[0], setLocalSelected = _l[1];
-    var searchRef = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(function () {
-        setLocalSelected(selectedProp || {});
-        if (selectedProp === null || selectedProp === void 0 ? void 0 : selectedProp.search)
-            setIsSearching(true);
-    }, [selectedProp]);
-    var search = localSelected.search || "";
-    var setSelected = function (updater) {
-        setLocalSelected(function (prev) { return (typeof updater === "function" ? updater(prev) : updater); });
-    };
-    var setSearch = function (val) {
-        setSelected(function (prev) { return (__assign(__assign({}, prev), { search: val })); });
-    };
-    var updateItem = function (sectionId, itemId, updates) {
-        setSelected(function (prev) {
-            var _a;
-            var items = prev[sectionId] || [];
-            var idx = items.findIndex(function (i) { return i.id === itemId; });
-            if (idx === -1)
-                return prev;
-            var updated = __spreadArray([], items, true);
-            updated[idx] = __assign(__assign({}, updated[idx]), updates);
-            return __assign(__assign({}, prev), (_a = {}, _a[sectionId] = updated, _a));
-        });
-    };
-    var setTextOperator = function (sectionId, itemId, operator) {
-        return updateItem(sectionId, itemId, { condition: operator });
-    };
-    var setTextValue = function (sectionId, itemId, value) {
-        return updateItem(sectionId, itemId, { value: value });
-    };
-    var toggleItem = function (sectionId, itemId, checked, type) {
-        setSelected(function (prev) {
-            var _a, _b;
-            var items = prev[sectionId] || [];
-            if (checked) {
-                if (items.some(function (i) { return i.id === itemId; }))
-                    return prev;
-                var condition = type === "select" || type === "user" ? "is" : "contains";
-                return __assign(__assign({}, prev), (_a = {}, _a[sectionId] = __spreadArray(__spreadArray([], items, true), [{ id: itemId, type: type, condition: condition, value: "" }], false), _a));
-            }
-            return __assign(__assign({}, prev), (_b = {}, _b[sectionId] = items.filter(function (i) { return i.id !== itemId; }), _b));
-        });
-    };
-    (0, react_3.useOutsideClick)({
-        ref: searchRef,
-        handler: function () {
-            if (isSearching && !search.trim())
-                setIsSearching(false);
-        },
-    });
-    var filteredSections = (0, react_1.useMemo)(function () {
-        if (!search.trim())
-            return sections;
-        var q = search.toLowerCase();
-        return sections
-            .map(function (sec) { return (__assign(__assign({}, sec), { items: (sec.items || []).filter(function (i) { return i.label.toLowerCase().includes(q); }) })); })
-            .filter(function (sec) { return (sec.items || []).length > 0; });
-    }, [search, sections]);
-    var hasActiveFilters = (0, react_1.useMemo)(function () {
-        return Object.entries(localSelected).some(function (_a) {
-            var key = _a[0], value = _a[1];
-            if (key === "search")
-                return !!(value && typeof value === "string" && value.trim());
-            return Array.isArray(value) && value.length > 0;
-        });
-    }, [localSelected]);
-    var handleApply = function () { return onApply === null || onApply === void 0 ? void 0 : onApply(localSelected); };
-    var handleClear = function () {
-        var cleared = { search: "" };
-        setLocalSelected(cleared);
-        onClear === null || onClear === void 0 ? void 0 : onClear();
-        if (filterMode === "sidebar")
-            onApply === null || onApply === void 0 ? void 0 : onApply(cleared);
-    };
-    var sectionContentProps = { selected: localSelected, toggleItem: toggleItem, setTextOperator: setTextOperator, setTextValue: setTextValue, setSelected: setSelected };
-    var renderSections = function () {
-        if (filteredSections.length === 0) {
-            return (react_1.default.createElement(react_2.Box, { p: 4, textAlign: "center" },
-                react_1.default.createElement(react_2.Text, { fontSize: "xs", color: "gray.500" }, "No filters found")));
-        }
-        if (filteredSections.length > 1) {
-            return (react_1.default.createElement(react_2.Accordion, { allowMultiple: true, defaultIndex: filteredSections.map(function (s, i) { return (s.initiallyExpanded ? i : -1); }).filter(function (i) { return i >= 0; }) }, filteredSections.map(function (sec) { return (react_1.default.createElement(react_2.AccordionItem, { key: sec.id, border: "none" },
-                react_1.default.createElement("h2", null,
-                    react_1.default.createElement(react_2.AccordionButton, { px: 3, py: 2, _expanded: { bg: "gray.50" } },
-                        react_1.default.createElement(SectionLabel, { label: sec.label, flex: true, theme: theme }),
-                        react_1.default.createElement(react_2.AccordionIcon, null))),
-                react_1.default.createElement(react_2.AccordionPanel, { px: 3, pt: 2, pb: 1 },
-                    react_1.default.createElement(SectionContent, __assign({ sec: sec }, sectionContentProps))))); })));
-        }
-        return filteredSections.map(function (sec) { return (react_1.default.createElement(react_2.Box, { key: sec.id },
-            react_1.default.createElement(react_2.Box, { px: 3, py: 2, borderBottom: "1px solid", borderColor: "gray.200" },
-                react_1.default.createElement(SectionLabel, { label: sec.label, theme: theme })),
-            react_1.default.createElement(react_2.Box, { px: 3, pt: 2, pb: 1 },
-                react_1.default.createElement(SectionContent, __assign({ sec: sec }, sectionContentProps))))); });
-    };
-    return (react_1.default.createElement(react_2.Box, { width: filterMode === "modal" ? "100%" : "180px", height: filterMode === "modal" ? "100%" : height, minHeight: "32rem", bg: "white", borderRight: "1px solid", borderColor: "gray.200", borderRadius: "md", overflow: "hidden", display: "flex", flexDirection: "column", marginBottom: filterMode === "modal" && hasActiveFilters ? '3.5rem' : 0 },
-        react_1.default.createElement(react_2.Box, { p: 3, borderBottom: "1px solid", borderColor: "gray.200" }, !isSearching ? (react_1.default.createElement(react_2.Flex, { align: "center", justify: "space-between" },
-            react_1.default.createElement(react_2.Text, { fontWeight: "semibold", fontSize: "sm" }, title),
-            react_1.default.createElement(react_2.Icon, { as: lucide_react_1.Search, transform: "scaleX(-1)", cursor: "pointer", boxSize: 4, color: (_c = (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.text) === null || _c === void 0 ? void 0 : _c[500], onClick: function () { return setIsSearching(true); }, mr: filterMode === "modal" ? 8 : 2, mt: filterMode === "modal" ? -1 : 0 }))) : (react_1.default.createElement(framer_motion_1.motion.div, { ref: searchRef, initial: { opacity: 0, x: 40 }, animate: { opacity: 1, x: 0 }, transition: { type: "tween", duration: 0.2 } },
-            react_1.default.createElement(react_2.InputGroup, { size: "sm" },
-                react_1.default.createElement(react_2.InputLeftElement, { pointerEvents: "none" },
-                    react_1.default.createElement(lucide_react_1.Search, { size: 16, color: (_e = (_d = theme.colors) === null || _d === void 0 ? void 0 : _d.text) === null || _e === void 0 ? void 0 : _e[500] })),
-                react_1.default.createElement(react_2.Input, { placeholder: "Search", value: search, onChange: function (e) { return setSearch(e.target.value); }, autoFocus: true }),
-                search.length > 0 && (react_1.default.createElement(react_2.InputRightElement, null,
-                    react_1.default.createElement(react_2.IconButton, { "aria-label": "Clear", size: "xs", variant: "ghost", icon: react_1.default.createElement(lucide_react_1.X, { size: 14 }), onClick: function () { setSearch(""); setIsSearching(false); } }))))))),
-        react_1.default.createElement(react_2.Box, { flex: "1", overflowY: "auto" }, renderSections()),
-        hasActiveFilters && (react_1.default.createElement(react_2.HStack, { px: 2, py: 1, borderTop: "1px solid", borderColor: "gray.200", spacing: 2, position: filterMode === "modal" ? "absolute" : "relative", bottom: 0, left: 0, right: 0, bg: "white" },
-            react_1.default.createElement(react_2.Button, { flex: 1, variant: "outline", size: "sm", onClick: handleClear, fontSize: "xs", colorScheme: "red" }, "Clear All"),
-            react_1.default.createElement(react_2.Button, { flex: 1, colorScheme: "primary", color: "white", size: "sm", onClick: handleApply, fontSize: "xs", isLoading: isApplyLoading }, "Apply")))));
-};
-exports.default = LeftFilterPane;

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

@@ -1,8 +0,0 @@
-import React from "react";
-export declare function SelectOperationControls({ operator, onOperatorChange, size, ml, mt, }: {
-    operator: string;
-    onOperatorChange: (op: string) => void;
-    size?: "xs" | "sm";
-    ml?: string | number;
-    mt?: string | number;
-}): React.JSX.Element;

package/dist/Components/Table/SelectOperationControls.js

@@ -1,15 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SelectOperationControls = SelectOperationControls;
-var react_1 = __importDefault(require("react"));
-var react_2 = require("@chakra-ui/react");
-function SelectOperationControls(_a) {
-    var operator = _a.operator, onOperatorChange = _a.onOperatorChange, _b = _a.size, size = _b === void 0 ? "xs" : _b, _c = _a.ml, ml = _c === void 0 ? "1.25rem" : _c, _d = _a.mt, mt = _d === void 0 ? 2 : _d;
-    return (react_1.default.createElement(react_2.VStack, { spacing: 2, align: "stretch", mt: mt, ml: ml },
-        react_1.default.createElement(react_2.Select, { size: size, value: operator, onChange: function (e) { return onOperatorChange(e.target.value); }, sx: { fontSize: "0.75rem", height: "24px" }, width: "90px" },
-            react_1.default.createElement("option", { value: "is" }, "is"),
-            react_1.default.createElement("option", { value: "is not" }, "is not"))));
-}

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

@@ -1,12 +0,0 @@
-import React from "react";
-import { TableProps } from "../TableProps";
-type ManageColumnsMethods = {
-    getManageColumnsData: () => TableProps["columns"];
-};
-declare const ManageColumns: ({ columns, items, setItems, childInputMethodsRef, }: {
-    columns: TableProps["columns"];
-    items: TableProps["columns"];
-    setItems: React.Dispatch<React.SetStateAction<TableProps["columns"]>>;
-    childInputMethodsRef: React.Ref<ManageColumnsMethods>;
-}) => React.JSX.Element;
-export default ManageColumns;