@codezee/sixtify-brahma 0.2.193 → 0.2.194

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codezee/sixtify-brahma",
-  "version": "0.2.193",
+  "version": "0.2.194",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/hardikranpariya/sixtify-brahma.git"
@@ -31,7 +31,6 @@
     "@types/luxon": "^3.4.2",
     "@types/node": "^22.10.0",
     "@types/react-date-range": "^1.4.9",
-    "@types/react-image-gallery": "^1.2.4",
     "@types/uuid": "^10.0.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-import-resolver-typescript": "^4.3.4",
@@ -62,60 +61,13 @@
     "@mui/material": "^5.15.20",
     "@mui/styled-engine-sc": "6.0.0-alpha.18",
     "@mui/x-charts": "^8.12.0",
-    "@mui/x-data-grid": "^7.6.2",
     "@mui/x-date-pickers": "^7.8.0",
-    "@tanstack/react-query": "^5.48.0",
-    "@tanstack/react-query-devtools": "^5.48.0",
     "@tanstack/react-table": "^8.21.3",
     "@tanstack/react-virtual": "^3.13.12",
-    "@tiptap/core": "^3.4.4",
-    "@tiptap/extension-blockquote": "^3.4.4",
-    "@tiptap/extension-bold": "^3.4.4",
-    "@tiptap/extension-bubble-menu": "^3.4.4",
-    "@tiptap/extension-bullet-list": "^3.4.4",
-    "@tiptap/extension-code": "^3.4.4",
-    "@tiptap/extension-code-block": "^3.4.4",
-    "@tiptap/extension-color": "^3.4.4",
-    "@tiptap/extension-document": "^3.4.4",
-    "@tiptap/extension-dropcursor": "^3.4.4",
-    "@tiptap/extension-floating-menu": "^3.4.4",
-    "@tiptap/extension-font-family": "^3.4.4",
-    "@tiptap/extension-gapcursor": "^3.4.4",
-    "@tiptap/extension-hard-break": "^3.4.4",
-    "@tiptap/extension-heading": "^3.4.4",
-    "@tiptap/extension-highlight": "^3.4.4",
-    "@tiptap/extension-history": "^3.4.4",
-    "@tiptap/extension-horizontal-rule": "^3.4.4",
-    "@tiptap/extension-image": "^3.4.4",
-    "@tiptap/extension-italic": "^3.4.4",
-    "@tiptap/extension-link": "^3.4.4",
-    "@tiptap/extension-list-item": "^3.4.4",
-    "@tiptap/extension-mention": "^3.4.4",
-    "@tiptap/extension-ordered-list": "^3.4.4",
-    "@tiptap/extension-paragraph": "^3.4.4",
-    "@tiptap/extension-placeholder": "^3.4.4",
-    "@tiptap/extension-strike": "^3.4.4",
-    "@tiptap/extension-subscript": "^3.4.4",
-    "@tiptap/extension-superscript": "^3.4.4",
-    "@tiptap/extension-table": "^3.4.4",
-    "@tiptap/extension-table-cell": "^3.4.4",
-    "@tiptap/extension-table-header": "^3.4.4",
-    "@tiptap/extension-table-row": "^3.4.4",
-    "@tiptap/extension-task-item": "^3.4.4",
-    "@tiptap/extension-task-list": "^3.4.4",
-    "@tiptap/extension-text": "^3.4.4",
-    "@tiptap/extension-text-align": "^3.4.4",
-    "@tiptap/extension-text-style": "^3.4.4",
-    "@tiptap/extension-underline": "^3.4.4",
-    "@tiptap/pm": "^3.4.4",
-    "@tiptap/react": "^3.4.4",
-    "@tiptap/starter-kit": "^3.4.4",
-    "@tiptap/suggestion": "^3.4.4",
     "@types/file-saver": "^2.0.7",
     "@types/react-syntax-highlighter": "^15.5.13",
     "ag-grid-community": "^34.3.1",
     "ag-grid-react": "^34.3.1",
-    "axios": "^1.7.2",
     "date-fns": "^4.1.0",
     "eslint-plugin-sonarjs": "1.0.4-alpha.1",
     "exceljs": "^4.4.0",
@@ -123,24 +75,18 @@
     "file64": "1.0.1",
     "gh-pages": "^6.3.0",
     "html2canvas": "^1.4.1",
-    "i18next": "^23.12.1",
     "iconoir-react": "^7.11.0",
-    "jszip": "^3.10.1",
     "lodash": "^4.17.21",
     "luxon": "^3.4.4",
-    "mui-tiptap": "^1.26.0",
     "next": "^14.2.5",
-    "next-auth": "^4.24.7",
     "react-date-range": "^2.0.1",
     "react-i18next": "^14.1.2",
-    "react-multi-carousel": "^2.8.5",
     "react-number-format": "^5.4.4",
     "react-phone-input-2": "^2.15.1",
     "react-syntax-highlighter": "^16.1.0",
     "react-toastify": "^10.0.5",
     "react-webcam": "7.2.0",
     "styled-components": "^6.1.11",
-    "tippy.js": "^6.3.7",
     "usehooks-ts": "^3.1.0",
     "uuid": "^10.0.0",
     "zod": "^3.23.8"

package/packages/shared-components/dist/AgGrid/hooks/useAgGridSelection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAgGridSelection.d.ts","sourceRoot":"","sources":["../../../src/AgGrid/hooks/useAgGridSelection.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,KAAK,sBAAsB,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,IAAI;IACtD,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IACnC,gBAAgB,EAAE,CAAC,EAAE,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,gBAAgB,EAAE,MAAM,EAAE,CAAC;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,OAAO,CAAC;QAC5C,IAAI,EAAE,CAAC,EAAE,CAAC;QACV,UAAU,EAAE,MAAM,CAAC;QACnB,eAAe,CAAC,EAAE,MAAM,CAAC;KAC1B,CAAC,CAAC;IACH,cAAc,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,EAAE,CAAC,CAAA;KAAE,KAAK,OAAO,CAAC;CACpD,CAAC;AAEF,KAAK,wBAAwB,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,IAAI;IACxD,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,YAAY,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC;IACzB,kBAAkB,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IACrD,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,aAAa,EAAE;QACb,OAAO,EAAE,OAAO,CAAC;QACjB,aAAa,EAAE,OAAO,CAAC;KACxB,CAAC;IACF,OAAO,EAAE;QACP,IAAI,EAAE,OAAO,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;QACb,UAAU,EAAE,MAAM,CAAC;QACnB,aAAa,EAAE,MAAM,IAAI,CAAC;KAC3B,GAAG,IAAI,CAAC;CACV,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,2GAQ1D,sBAAsB,CAAC,CAAC,CAAC,KAAG,wBAAwB,CAAC,CAAC,CAuUxD,CAAC"}
+{"version":3,"file":"useAgGridSelection.d.ts","sourceRoot":"","sources":["../../../src/AgGrid/hooks/useAgGridSelection.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,KAAK,sBAAsB,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,IAAI;IACtD,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IACnC,gBAAgB,EAAE,CAAC,EAAE,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,gBAAgB,EAAE,MAAM,EAAE,CAAC;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,OAAO,CAAC;QAC5C,IAAI,EAAE,CAAC,EAAE,CAAC;QACV,UAAU,EAAE,MAAM,CAAC;QACnB,eAAe,CAAC,EAAE,MAAM,CAAC;KAC1B,CAAC,CAAC;IACH,cAAc,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,EAAE,CAAC,CAAA;KAAE,KAAK,OAAO,CAAC;CACpD,CAAC;AAEF,KAAK,wBAAwB,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,IAAI;IACxD,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,YAAY,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC;IACzB,kBAAkB,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IACrD,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,aAAa,EAAE;QACb,OAAO,EAAE,OAAO,CAAC;QACjB,aAAa,EAAE,OAAO,CAAC;KACxB,CAAC;IACF,OAAO,EAAE;QACP,IAAI,EAAE,OAAO,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;QACb,UAAU,EAAE,MAAM,CAAC;QACnB,aAAa,EAAE,MAAM,IAAI,CAAC;KAC3B,GAAG,IAAI,CAAC;CACV,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,2GAQ1D,sBAAsB,CAAC,CAAC,CAAC,KAAG,wBAAwB,CAAC,CAAC,CAucxD,CAAC"}

package/packages/shared-components/dist/AgGrid/hooks/useAgGridSelection.js

@@ -8,6 +8,24 @@ const useAgGridSelection = ({ gridRef, currentPageItems, totalRecords, selectedE
     const originalSelectableCountRef = (0, react_1.useRef)(null);
     const lastQueryParamsRef = (0, react_1.useRef)(null);
     const previousTotalRecordsRef = (0, react_1.useRef)(totalRecords);
+    const previousExtraParamsRef = (0, react_1.useRef)("");
+    const currentExtraParams = (0, react_1.useMemo)(() => {
+        try {
+            return JSON.stringify(getExtraParams());
+        }
+        catch {
+            return "";
+        }
+    }, [getExtraParams]);
+    (0, react_1.useEffect)(() => {
+        const previousExtraParams = previousExtraParamsRef.current;
+        if (previousExtraParams !== "" &&
+            currentExtraParams !== previousExtraParams) {
+            setAllDataCache(null);
+            originalSelectableCountRef.current = null;
+        }
+        previousExtraParamsRef.current = currentExtraParams;
+    }, [currentExtraParams]);
     (0, react_1.useEffect)(() => {
         if ((originalSelectableCountRef.current === null && totalRecords > 0) ||
             (originalSelectableCountRef.current !== null &&
@@ -69,9 +87,12 @@ const useAgGridSelection = ({ gridRef, currentPageItems, totalRecords, selectedE
         });
     }, [currentPageItems, isRowSelectable]);
     const deselectCurrentPage = (0, react_1.useCallback)(() => {
-        const currentPageIds = new Set(currentPageItems.map(({ id }) => id));
+        const selectableItems = isRowSelectable
+            ? currentPageItems.filter((item) => isRowSelectable({ data: item }))
+            : currentPageItems;
+        const currentPageIds = new Set(selectableItems.map(({ id }) => id));
         setSelectedIds((prev) => prev.filter((id) => !currentPageIds.has(id)));
-    }, [currentPageItems]);
+    }, [currentPageItems, isRowSelectable]);
     const selectAll = (0, react_1.useCallback)(async (params) => {
         const extraParams = getExtraParams();
         const base = params ??
@@ -173,18 +194,87 @@ const useAgGridSelection = ({ gridRef, currentPageItems, totalRecords, selectedE
             onButtonClick: () => void selectAll(),
         };
     }, [selectedRecords, displayRecordsCount, clearSelection, selectAll]);
+    const isDialogOnTop = (0, react_1.useCallback)(() => {
+        const backdrop = document.querySelector('.MuiBackdrop-root:not([style*="display: none"])');
+        if (backdrop) {
+            return true;
+        }
+        const dialogs = document.querySelectorAll('[role="dialog"], .MuiDialog-root, .MuiModal-root');
+        if (dialogs.length === 0) {
+            return false;
+        }
+        for (const dialog of Array.from(dialogs)) {
+            const dialogElement = dialog;
+            const style = window.getComputedStyle(dialogElement);
+            const isVisible = style.display !== "none" &&
+                style.visibility !== "hidden" &&
+                parseFloat(style.opacity) > 0;
+            if (isVisible) {
+                return true;
+            }
+        }
+        return false;
+    }, []);
     const isInputFieldActive = (0, react_1.useCallback)(() => {
         const activeElement = document.activeElement;
         return (activeElement?.tagName === "INPUT" ||
             activeElement?.tagName === "TEXTAREA" ||
             activeElement?.contentEditable === "true");
     }, []);
-    const isHeaderCheckboxActive = (0, react_1.useCallback)(() => {
-        const activeElement = document.activeElement;
-        return (activeElement?.closest(".ag-header-cell") !== null ||
-            activeElement?.closest(".ag-selection-checkbox") !== null ||
-            activeElement?.getAttribute("role") === "columnheader");
+    const isFilterFieldActive = (0, react_1.useCallback)((target) => {
+        if (!target) {
+            return false;
+        }
+        return (target.classList.contains("ag-floating-filter") ||
+            target.classList.contains("ag-text-field-input") ||
+            target.closest(".ag-floating-filter") !== null ||
+            target.closest(".ag-text-field-input") !== null);
     }, []);
+    const isHeaderCheckboxActive = (0, react_1.useCallback)((target) => {
+        const element = target || document.activeElement;
+        return (element?.closest(".ag-header-cell") !== null ||
+            element?.closest(".ag-selection-checkbox") !== null ||
+            element?.getAttribute("role") === "columnheader");
+    }, []);
+    const handleCtrlA = (0, react_1.useCallback)((event) => {
+        if (isDialogOnTop()) {
+            return;
+        }
+        event.preventDefault();
+        selectCurrentPage();
+    }, [selectCurrentPage, isDialogOnTop]);
+    const handleAltA = (0, react_1.useCallback)((event) => {
+        if (isDialogOnTop()) {
+            return;
+        }
+        const activeElement = document.activeElement;
+        const isInputField = activeElement?.tagName === "INPUT" ||
+            activeElement?.tagName === "TEXTAREA" ||
+            activeElement?.contentEditable === "true";
+        if (isInputField) {
+            return;
+        }
+        event.preventDefault();
+        deselectCurrentPage();
+    }, [deselectCurrentPage, isFilterFieldActive, isDialogOnTop]);
+    const handleSpaceKey = (0, react_1.useCallback)((event) => {
+        const target = event.target;
+        if (isFilterFieldActive(target)) {
+            return;
+        }
+        event.preventDefault();
+        if (currentPageState.checked) {
+            deselectCurrentPage();
+        }
+        else {
+            selectCurrentPage();
+        }
+    }, [
+        currentPageState.checked,
+        deselectCurrentPage,
+        selectCurrentPage,
+        isFilterFieldActive,
+    ]);
     (0, react_1.useEffect)(() => {
         const handleKeyDown = (event) => {
             if (isInputFieldActive() || !currentPageItems.length) {
@@ -192,24 +282,17 @@ const useAgGridSelection = ({ gridRef, currentPageItems, totalRecords, selectedE
             }
             const key = event.key.toLowerCase();
             if (key === "a" && (event.ctrlKey || event.metaKey)) {
-                event.preventDefault();
-                selectCurrentPage();
+                handleCtrlA(event);
                 return;
             }
-            if (key === "a" && event.altKey) {
-                event.preventDefault();
-                deselectCurrentPage();
+            if (event.code === "KeyA" && event.altKey) {
+                handleAltA(event);
                 return;
             }
-            if ((event.code === "Space" || event.key === " ") &&
-                isHeaderCheckboxActive() &&
-                gridRef.current) {
-                event.preventDefault();
-                if (currentPageState.checked) {
-                    deselectCurrentPage();
-                }
-                else {
-                    selectCurrentPage();
+            if ((event.code === "Space" || event.key === " ") && gridRef.current) {
+                const target = event.target;
+                if (isHeaderCheckboxActive(target) && !isFilterFieldActive(target)) {
+                    handleSpaceKey(event);
                 }
             }
         };
@@ -217,11 +300,12 @@ const useAgGridSelection = ({ gridRef, currentPageItems, totalRecords, selectedE
         return () => document.removeEventListener("keydown", handleKeyDown, true);
     }, [
         currentPageItems.length,
-        selectCurrentPage,
-        deselectCurrentPage,
-        currentPageState.checked,
+        handleCtrlA,
+        handleAltA,
+        handleSpaceKey,
         isInputFieldActive,
         isHeaderCheckboxActive,
+        gridRef,
     ]);
     return {
         selectedIds,

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnArranger.d.ts

@@ -0,0 +1,20 @@
+import { type Control, type UseFieldArrayReturn, type UseFormSetValue } from "react-hook-form";
+import type { AppColumnDef } from "../../types";
+type ColumnArrangerProps<T> = {
+    lockedColumns: AppColumnDef<T>[];
+    fields: UseFieldArrayReturn<{
+        columns: AppColumnDef<T>[];
+    }, "columns">["fields"];
+    control: Control<{
+        columns: AppColumnDef<T>[];
+    }>;
+    setValue: UseFormSetValue<{
+        columns: AppColumnDef<T>[];
+    }>;
+    filterVisibleOnly?: boolean;
+    searchTerm?: string;
+    grouping?: string[];
+};
+export declare const ColumnArranger: <T>({ lockedColumns, fields, control, setValue, filterVisibleOnly, searchTerm, grouping, }: Readonly<ColumnArrangerProps<T>>) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ColumnArranger.d.ts.map

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnArranger.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnArranger.d.ts","sourceRoot":"","sources":["../../../../src/SmartGrid/Components/ColumnChooser/ColumnArranger.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,OAAO,EACZ,KAAK,mBAAmB,EACxB,KAAK,eAAe,EAErB,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAIhD,KAAK,mBAAmB,CAAC,CAAC,IAAI;IAC5B,aAAa,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IACjC,MAAM,EAAE,mBAAmB,CACzB;QAAE,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAA;KAAE,EAC9B,SAAS,CACV,CAAC,QAAQ,CAAC,CAAC;IACZ,OAAO,EAAE,OAAO,CAAC;QAAE,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAA;KAAE,CAAC,CAAC;IACjD,QAAQ,EAAE,eAAe,CAAC;QAAE,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAA;KAAE,CAAC,CAAC;IAC1D,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,CAAC,EAAG,wFAQhC,QAAQ,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC,4CAyElC,CAAC"}

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnArranger.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ColumnArranger = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_hook_form_1 = require("react-hook-form");
+const LockedColumnItem_1 = require("./LockedColumnItem");
+const ColumnItem_1 = require("./ColumnItem");
+const ColumnArranger = ({ lockedColumns, fields, control, setValue, filterVisibleOnly = false, searchTerm = "", grouping, }) => {
+    // Watch all column hide values
+    const columnsData = (0, react_hook_form_1.useWatch)({
+        control,
+        name: "columns",
+        defaultValue: [],
+    });
+    // Filter fields based on filterVisibleOnly and searchTerm
+    const filteredFields = (0, react_1.useMemo)(() => {
+        let result = fields;
+        // Apply visibility filter
+        if (filterVisibleOnly) {
+            result = result.filter((field, index) => {
+                const columnData = columnsData[index];
+                return columnData && columnData.hide;
+            });
+        }
+        // Apply search filter by label/header
+        if (searchTerm.trim()) {
+            const lowerSearchTerm = searchTerm.toLowerCase();
+            result = result.filter((field, index) => {
+                const columnData = columnsData[index];
+                const header = columnData?.header ?? field.header ?? "";
+                // Match against header/label (case-insensitive)
+                return (typeof header === "string" &&
+                    header.toLowerCase().includes(lowerSearchTerm));
+            });
+        }
+        return result;
+    }, [fields, filterVisibleOnly, searchTerm, columnsData]);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [lockedColumns.map((column) => {
+                return (0, jsx_runtime_1.jsx)(LockedColumnItem_1.LockedColumnItem, { column: column }, column.accessorKey);
+            }), (0, jsx_runtime_1.jsxs)("div", { style: { margin: 0, padding: 0 }, children: [!filteredFields.length && ((0, jsx_runtime_1.jsx)("p", { style: { textAlign: "center", fontSize: "13px", color: "gray" }, children: "No columns to show" })), filteredFields
+                        .filter((field) => !grouping?.includes(field.accessorKey ?? ""))
+                        .map((field) => {
+                        // Find the original index in the fields array
+                        const actualIndex = fields.findIndex(({ id }) => id === field.id);
+                        return ((0, jsx_runtime_1.jsx)(ColumnItem_1.ColumnItem, { field: field, control: control, index: actualIndex, setValue: setValue }, field.id));
+                    })] })] }));
+};
+exports.ColumnArranger = ColumnArranger;

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnArrangerDialog.d.ts

@@ -0,0 +1,17 @@
+import type { AppColumnDef, SmartColumnAlignmentType } from "../../types";
+import type { OnAction } from "../../../utils/types";
+type ColumnArrangerDialogProps<T> = {
+    open: boolean;
+    onClose: OnAction;
+    title?: string;
+    columns?: AppColumnDef<T>[];
+    grouping?: string[];
+    onSave: (args: Record<string, {
+        hide: boolean;
+        align: SmartColumnAlignmentType;
+        header: string;
+    }>) => void;
+};
+export declare const ColumnArrangerDialog: <T>({ open, onClose, title, columns, grouping, onSave, }: ColumnArrangerDialogProps<T>) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ColumnArrangerDialog.d.ts.map

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnArrangerDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnArrangerDialog.d.ts","sourceRoot":"","sources":["../../../../src/SmartGrid/Components/ColumnChooser/ColumnArrangerDialog.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,YAAY,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;AAC1E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAErD,KAAK,yBAAyB,CAAC,CAAC,IAAI;IAClC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,QAAQ,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,MAAM,EAAE,CACN,IAAI,EAAE,MAAM,CACV,MAAM,EACN;QACE,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,EAAE,wBAAwB,CAAC;QAChC,MAAM,EAAE,MAAM,CAAC;KAChB,CACF,KACE,IAAI,CAAC;CACX,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,CAAC,EAAG,sDAOtC,yBAAyB,CAAC,CAAC,CAAC,4CAkM9B,CAAC"}

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnArrangerDialog.js

@@ -0,0 +1,117 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ColumnArrangerDialog = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const iconoir_react_1 = require("iconoir-react");
+const fromPairs_1 = __importDefault(require("lodash/fromPairs"));
+const react_1 = require("react");
+const react_hook_form_1 = require("react-hook-form");
+const ColumnArrangerForm_1 = require("./ColumnArrangerForm");
+const useRefinedColumns_1 = require("./hooks/useRefinedColumns");
+const DebouncedInput_1 = require("../SearchFilterRow/DebouncedInput");
+const SmartButton_1 = require("../SmartButton");
+const SmartDialog_1 = require("../SmartDialog");
+const SmartSwitch_1 = require("../SmartSwitch");
+const ColumnArrangerDialog = ({ open, onClose, title = "Column Chooser", columns = [], grouping = [], onSave, }) => {
+    const theme = (0, material_1.useTheme)();
+    const reFinedColumn = (0, useRefinedColumns_1.useRefinedColumns)({ columns });
+    const { butterflyBlue, iron } = theme.palette.app.color;
+    const [searchTerm, setSearchTerm] = (0, react_1.useState)("");
+    const { control } = (0, react_hook_form_1.useForm)({
+        defaultValues: {
+            column_list: false, // OFF = show all
+        },
+    });
+    // Watch the column_list switch value
+    const columnListFilter = (0, react_hook_form_1.useWatch)({
+        control,
+        name: "column_list",
+        defaultValue: false,
+    });
+    // Clear search term when dialog closes
+    (0, react_1.useEffect)(() => {
+        if (!open) {
+            setSearchTerm("");
+        }
+    }, [open]);
+    return ((0, jsx_runtime_1.jsx)(ColumnArrangerForm_1.ColumnArrangerForm, { columns: reFinedColumn, filterVisibleOnly: columnListFilter, searchTerm: searchTerm, grouping: grouping, children: ({ columnList, reset, getValues }) => ((0, jsx_runtime_1.jsx)(SmartDialog_1.SmartDialog, { open: open, onClose: () => {
+                setSearchTerm("");
+                reset();
+                onClose();
+            }, width: 450, actions: (0, jsx_runtime_1.jsxs)("div", { style: {
+                    display: "flex",
+                    justifyContent: "space-between",
+                    padding: "10px 24px",
+                    borderTop: `1px solid ${iron[300]}`,
+                    gap: 2,
+                }, children: [(0, jsx_runtime_1.jsx)(SmartButton_1.SmartButton, { onClick: () => {
+                            reset();
+                            setSearchTerm("");
+                        }, onMouseEnter: (e) => {
+                            e.currentTarget.style.backgroundColor = "#f5f5f5";
+                        }, onMouseLeave: (e) => {
+                            e.currentTarget.style.backgroundColor = "white";
+                        }, children: "Reset" }), (0, jsx_runtime_1.jsx)(SmartButton_1.SmartButton, { onClick: () => {
+                            const values = getValues();
+                            setSearchTerm("");
+                            const result = (0, fromPairs_1.default)(values.columns.map((col) => {
+                                return [
+                                    col.accessorKey,
+                                    {
+                                        hide: col.hide,
+                                        align: col.align ?? "left",
+                                        header: col.header,
+                                    },
+                                ];
+                            }));
+                            onSave(result);
+                            onClose();
+                        }, onMouseEnter: (e) => {
+                            e.currentTarget.style.opacity = "0.9";
+                        }, onMouseLeave: (e) => {
+                            e.currentTarget.style.opacity = "1";
+                        }, style: {
+                            backgroundColor: butterflyBlue[900],
+                            color: "white",
+                        }, children: "Save" })] }), children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { style: {
+                            display: "flex",
+                            flexDirection: "row",
+                            alignItems: "center",
+                            justifyContent: "space-between",
+                            padding: "5px 24px",
+                            borderBottom: `1px solid ${iron[300]}`,
+                        }, children: [(0, jsx_runtime_1.jsx)("p", { style: {
+                                    fontWeight: 500,
+                                    fontSize: "18px",
+                                    color: iron[900],
+                                    lineHeight: "1px",
+                                }, children: title }), (0, jsx_runtime_1.jsx)(iconoir_react_1.Xmark, { width: 20, height: 20, strokeWidth: 2, onClick: () => {
+                                    setSearchTerm("");
+                                    onClose();
+                                    reset();
+                                }, style: {
+                                    border: `1px solid ${iron[700]}`,
+                                    borderRadius: "5px",
+                                    color: iron[900],
+                                } })] }), (0, jsx_runtime_1.jsx)("div", { style: {
+                            padding: "8px 24px",
+                            display: "flex",
+                            flexDirection: "column",
+                            gap: "12px",
+                        }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                display: "flex",
+                                flexDirection: "row",
+                                alignItems: "center",
+                                justifyContent: "space-between",
+                            }, children: [(0, jsx_runtime_1.jsx)(DebouncedInput_1.DebouncedInput, { value: searchTerm, onChange: (value) => setSearchTerm(value), placeholder: "Search by label...", debounce: 300, inputFontSize: "13px", inputHeight: "14px", style: { width: "80%" } }, open ? "dialog-open" : "dialog-closed"), (0, jsx_runtime_1.jsx)(SmartSwitch_1.SmartSwitch, { name: "column_list", control: control })] }) }), (0, jsx_runtime_1.jsx)("div", { style: {
+                            maxHeight: "600px",
+                            minHeight: "500px",
+                            overflowY: "auto",
+                            outline: "none",
+                        }, children: columnList })] }) })) }));
+};
+exports.ColumnArrangerDialog = ColumnArrangerDialog;

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnArrangerForm.d.ts

@@ -0,0 +1,17 @@
+import { type ReactNode } from "react";
+import type { AppColumnDef } from "../../types";
+export type ColumnArrangerFormProps<T> = {
+    columns: AppColumnDef<T>[];
+    filterVisibleOnly?: boolean;
+    searchTerm?: string;
+    grouping?: string[];
+    children: (args: {
+        columnList: ReactNode;
+        reset: (values?: AppColumnDef<T> | Record<string, unknown>) => void;
+        getValues: () => {
+            columns: AppColumnDef<T>[];
+        };
+    }) => JSX.Element;
+};
+export declare const ColumnArrangerForm: <T>({ columns, filterVisibleOnly, searchTerm, children, grouping, }: ColumnArrangerFormProps<T>) => JSX.Element;
+//# sourceMappingURL=ColumnArrangerForm.d.ts.map

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnArrangerForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnArrangerForm.d.ts","sourceRoot":"","sources":["../../../../src/SmartGrid/Components/ColumnChooser/ColumnArrangerForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAI3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAMhD,MAAM,MAAM,uBAAuB,CAAC,CAAC,IAAI;IACvC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE;QACf,UAAU,EAAE,SAAS,CAAC;QACtB,KAAK,EAAE,CAAC,MAAM,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;QACpE,SAAS,EAAE,MAAM;YAAE,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAA;SAAE,CAAC;KACjD,KAAK,GAAG,CAAC,OAAO,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,CAAC,EAAG,iEAMpC,uBAAuB,CAAC,CAAC,CAAC,gBA+D5B,CAAC"}

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnArrangerForm.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ColumnArrangerForm = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_hook_form_1 = require("react-hook-form");
+const ColumnArranger_1 = require("./ColumnArranger");
+const ColumnArrangerForm = ({ columns, filterVisibleOnly = false, searchTerm = "", children, grouping, }) => {
+    const lockedColumns = (0, react_1.useMemo)(() => columns.filter((col) => !("hide" in col)), [columns]);
+    const unlockedColumns = (0, react_1.useMemo)(() => columns
+        .filter((col) => "hide" in col)
+        .map((col) => ({
+        ...col,
+        hide: !col.hide,
+        align: col.align ?? "left",
+    })), [columns]);
+    const { control, reset, getValues, setValue } = (0, react_hook_form_1.useForm)({
+        defaultValues: {
+            columns: unlockedColumns,
+        },
+    });
+    const wrappedReset = (values) => {
+        reset({
+            columns: values
+                ? // eslint-disable-next-line sonarjs/no-nested-conditional
+                    Array.isArray(values)
+                        ? values
+                        : [values]
+                : unlockedColumns,
+        });
+    };
+    const { fields } = (0, react_hook_form_1.useFieldArray)({
+        name: "columns",
+        control,
+    });
+    // Update form values when unlockedColumns changes (e.g., when grouping changes)
+    // Use reset to fully update the form and trigger field array re-render
+    (0, react_1.useEffect)(() => {
+        reset({ columns: unlockedColumns }, { keepDefaultValues: false });
+    }, [unlockedColumns, reset]);
+    return children({
+        reset: wrappedReset,
+        getValues,
+        columnList: ((0, jsx_runtime_1.jsx)(ColumnArranger_1.ColumnArranger, { fields: fields, lockedColumns: lockedColumns, control: control, setValue: setValue, filterVisibleOnly: filterVisibleOnly, searchTerm: searchTerm, grouping: grouping })),
+    });
+};
+exports.ColumnArrangerForm = ColumnArrangerForm;

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnItem.d.ts

@@ -0,0 +1,16 @@
+import { type Control, type FieldArrayWithId, type UseFormSetValue } from "react-hook-form";
+import type { AppColumnDef } from "../../types";
+export type ColumnItemProps<T> = {
+    field: FieldArrayWithId<{
+        columns: AppColumnDef<T>[];
+    }, "columns">;
+    control: Control<{
+        columns: AppColumnDef<T>[];
+    }>;
+    index: number;
+    setValue: UseFormSetValue<{
+        columns: AppColumnDef<T>[];
+    }>;
+};
+export declare function ColumnItem<T>({ field, control, index, setValue, }: Readonly<ColumnItemProps<T>>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ColumnItem.d.ts.map

package/packages/shared-components/dist/SmartGrid/Components/ColumnChooser/ColumnItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnItem.d.ts","sourceRoot":"","sources":["../../../../src/SmartGrid/Components/ColumnChooser/ColumnItem.tsx"],"names":[],"mappings":"AASA,OAAO,EACL,KAAK,OAAO,EACZ,KAAK,gBAAgB,EACrB,KAAK,eAAe,EAErB,MAAM,iBAAiB,CAAC;AAKzB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;IAC/B,KAAK,EAAE,gBAAgB,CAAC;QAAE,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAA;KAAE,EAAE,SAAS,CAAC,CAAC;IACnE,OAAO,EAAE,OAAO,CAAC;QAAE,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAA;KAAE,CAAC,CAAC;IACjD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,eAAe,CAAC;QAAE,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAA;KAAE,CAAC,CAAC;CAC3D,CAAC;AAEF,wBAAgB,UAAU,CAAC,CAAC,EAAE,EAC5B,KAAK,EACL,OAAO,EACP,KAAK,EACL,QAAQ,GACT,EAAE,QAAQ,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,2CA4L9B"}