@codezee/sixtify-brahma 0.2.188 → 0.2.190

package/packages/shared-components/dist/SmartGrid/Components/TableRowComponent.js

@@ -8,7 +8,7 @@ const Button_1 = require("../../Button");
 const CellSelectionContext_1 = require("../context/CellSelectionContext");
 const useGetPinStyle_1 = require("../hooks/useGetPinStyle");
 const CellRenderer_1 = require("./CellRenderer");
-const TableRowComponent = ({ columnWidths, exportActions, exportData, index, isSummaryRow = false, row, rowHeight, summaryData, virtualRow, }) => {
+const TableRowComponent = ({ columnWidths, exportActions, exportData, grouping = [], index, isSummaryRow = false, row, rowHeight, summaryData, virtualRow, }) => {
     const theme = (0, material_1.useTheme)();
     const { butterflyBlue, iron, mirage, slate } = theme.palette.app.color;
     const cellSelectionContext = (0, CellSelectionContext_1.useCellSelectionContext)();
@@ -65,7 +65,7 @@ const TableRowComponent = ({ columnWidths, exportActions, exportData, index, isS
         }
     }, [activePopupRowId]);
     const isPopupOpen = activePopupRowId === row.id;
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("tr", { className: "sg-tbody-tr-row", ref: trRef, style: {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("tr", { ref: trRef, style: {
                     backgroundColor: getRowBackgroundColor(),
                     borderTop: `1px solid ${iron[700]}`,
                     display: "flex",
@@ -82,62 +82,80 @@ const TableRowComponent = ({ columnWidths, exportActions, exportData, index, isS
                     if (!isSummaryRow) {
                         setIsRowHovered(false);
                     }
-                }, onContextMenu: handleContextMenu, children: row.getVisibleCells().map((cell, cellIndex, allCells) => {
-                    const width = columnWidths[cellIndex] ?? cell.column.getSize();
-                    const pinStyle = getPinStyle(cell, cellIndex, allCells);
-                    const isSelected = isCellSelected(row.id, cell.column.id);
-                    const handleMouseDown = (event) => {
-                        if (cellSelectionEnabled && !isSummaryRow) {
-                            const isShiftClick = event.shiftKey;
-                            startCellSelection(row.id, cell.column.id, isShiftClick);
-                        }
-                    };
-                    const handleMouseEnter = () => {
-                        if (cellSelectionEnabled && !isSummaryRow) {
-                            updateCellSelection(row.id, cell.column.id);
-                        }
-                    };
-                    // Apply copy flash animation when cell is selected and flash is active
-                    const cellBackgroundColor = isSelected && !isCopyFlashing ? butterflyBlue[600] : undefined;
-                    const cellAnimation = isSelected && isCopyFlashing
-                        ? "copyFlash 0.5s ease-in-out"
-                        : undefined;
-                    // Check if this cell is pinned
-                    const isPinned = cell.column.getIsPinned();
-                    const finalBackgroundColor = isPinned
-                        ? // eslint-disable-next-line sonarjs/no-nested-conditional
-                            isSelected && !isCopyFlashing
-                                ? butterflyBlue[600]
-                                : getRowBackgroundColor()
-                        : cellBackgroundColor;
-                    return ((0, jsx_runtime_1.jsx)("td", { onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, style: {
-                            animation: cellAnimation,
-                            backgroundColor: finalBackgroundColor,
-                            boxSizing: "border-box",
-                            cursor: cellSelectionEnabled ? "cell" : "default",
-                            lineHeight: "21px",
-                            maxWidth: width,
-                            minWidth: width,
-                            overflow: "hidden",
-                            padding: "0px 8px",
-                            position: "relative",
-                            textOverflow: "ellipsis",
-                            textWrap: "nowrap",
-                            userSelect: cellSelectionEnabled ? "none" : "auto",
-                            width,
-                            ...pinStyle,
-                        }, children: (0, jsx_runtime_1.jsx)("div", { style: {
-                                alignItems: "center",
-                                color: iron[400],
-                                display: "flex",
-                                fontFamily: "Poppins",
-                                fontSize: "13px",
-                                fontWeight: isSummaryRow ? "500" : 400,
-                                height: rowHeight,
+                }, onContextMenu: handleContextMenu, children: (() => {
+                    const visibleCells = row.getVisibleCells();
+                    // Filter out grouping columns (except the group column) when grouping is enabled
+                    const cellsToRender = grouping.length > 0
+                        ? visibleCells.filter((cell) => {
+                            // Keep the group column
+                            if (cell.column.id === "grouped_by") {
+                                return true;
+                            }
+                            // Filter out grouping columns - check both if cell is grouped AND if column ID is in grouping array
+                            const columnId = cell.column.id;
+                            const accessorKey = cell.column.columnDef?.accessorKey;
+                            const isGroupingColumn = grouping.includes(columnId) ||
+                                (accessorKey && grouping.includes(accessorKey));
+                            return !isGroupingColumn && !cell.getIsGrouped();
+                        })
+                        : visibleCells;
+                    return cellsToRender.map((cell, cellIndex, allCells) => {
+                        const width = columnWidths[cellIndex] ?? cell.column.getSize();
+                        const pinStyle = getPinStyle(cell, cellIndex, allCells);
+                        const isSelected = isCellSelected(row.id, cell.column.id);
+                        const handleMouseDown = (event) => {
+                            if (cellSelectionEnabled && !isSummaryRow) {
+                                const isShiftClick = event.shiftKey;
+                                startCellSelection(row.id, cell.column.id, isShiftClick);
+                            }
+                        };
+                        const handleMouseEnter = () => {
+                            if (cellSelectionEnabled && !isSummaryRow) {
+                                updateCellSelection(row.id, cell.column.id);
+                            }
+                        };
+                        // Apply copy flash animation when cell is selected and flash is active
+                        const cellBackgroundColor = isSelected && !isCopyFlashing ? butterflyBlue[600] : undefined;
+                        const cellAnimation = isSelected && isCopyFlashing
+                            ? "copyFlash 0.5s ease-in-out"
+                            : undefined;
+                        // Check if this cell is pinned
+                        const isPinned = cell.column.getIsPinned();
+                        const finalBackgroundColor = isPinned
+                            ? // eslint-disable-next-line sonarjs/no-nested-conditional
+                                isSelected && !isCopyFlashing
+                                    ? butterflyBlue[600]
+                                    : getRowBackgroundColor()
+                            : cellBackgroundColor;
+                        return ((0, jsx_runtime_1.jsx)("td", { onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, style: {
+                                animation: cellAnimation,
+                                backgroundColor: finalBackgroundColor,
+                                boxSizing: "border-box",
+                                cursor: cellSelectionEnabled ? "cell" : "default",
+                                lineHeight: "21px",
+                                maxWidth: width,
+                                minWidth: width,
                                 overflow: "hidden",
+                                padding: "0px 8px",
+                                position: "relative",
                                 textOverflow: "ellipsis",
-                            }, children: (0, jsx_runtime_1.jsx)(CellRenderer_1.CellRenderer, { cell: cell, row: row, isSummaryRow: isSummaryRow, summaryData: summaryData }) }) }, cell.id));
-                }) }, `table-row-${index}${isSummaryRow ? "-summary" : ""}`), isPopupOpen && exportData && ((0, jsx_runtime_1.jsx)("div", { ref: popupRef, style: {
+                                textWrap: "nowrap",
+                                userSelect: cellSelectionEnabled ? "none" : "auto",
+                                width,
+                                ...pinStyle,
+                            }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                                    alignItems: "center",
+                                    color: iron[400],
+                                    display: "flex",
+                                    fontFamily: "Poppins",
+                                    fontSize: "14px",
+                                    fontWeight: isSummaryRow ? "500" : 400,
+                                    height: rowHeight,
+                                    overflow: "hidden",
+                                    textOverflow: "ellipsis",
+                                }, children: (0, jsx_runtime_1.jsx)(CellRenderer_1.CellRenderer, { cell: cell, row: row, isSummaryRow: isSummaryRow, summaryData: summaryData, isGroupColumn: cell.column.id === "grouped_by" }) }) }, cell.id));
+                    });
+                })() }, `table-row-${index}${isSummaryRow ? "-summary" : ""}`), isPopupOpen && exportData && ((0, jsx_runtime_1.jsx)("div", { ref: popupRef, style: {
                     backgroundColor: iron[600],
                     borderRadius: "6px",
                     boxShadow: `0 0 20px ${mirage[50]}`,
@@ -153,7 +171,7 @@ const TableRowComponent = ({ columnWidths, exportActions, exportData, index, isS
                 }, children: exportActions?.map((item) => {
                     return ((0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: item.onClick, variant: "text", style: {
                             borderBottom: `1px solid ${iron[700]}`,
-                            fontSize: "13px",
+                            fontSize: "14px",
                             padding: 0,
                         }, disableRipple: true, children: item.label }, item.label));
                 }) }))] }));

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

@@ -1 +1 @@
-{"version":3,"file":"SmartGrid.d.ts","sourceRoot":"","sources":["../../src/SmartGrid/SmartGrid.tsx"],"names":[],"mappings":"AAKA,OAAO,KAQN,MAAM,OAAO,CAAC;AAiBf,OAAO,KAAK,EAEV,cAAc,EAGf,MAAM,SAAS,CAAC;AA6BjB,KAAK,aAAa,GAAG,KAAK,CAAC,yBAAyB,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,GAC3E,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC,CAAC;AAErE,eAAO,MAAM,SAAS,EA4YjB,aAAa,CAAC"}
+{"version":3,"file":"SmartGrid.d.ts","sourceRoot":"","sources":["../../src/SmartGrid/SmartGrid.tsx"],"names":[],"mappings":"AAKA,OAAO,KAQN,MAAM,OAAO,CAAC;AAiBf,OAAO,KAAK,EAEV,cAAc,EAGf,MAAM,SAAS,CAAC;AAkCjB,KAAK,aAAa,GAAG,KAAK,CAAC,yBAAyB,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,GAC3E,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC,CAAC;AAErE,eAAO,MAAM,SAAS,EA8gBjB,aAAa,CAAC"}

package/packages/shared-components/dist/SmartGrid/SmartGrid.js

@@ -22,6 +22,11 @@ const useGetDragMethods_1 = require("./hooks/useGetDragMethods");
 const useGetRowSelection_1 = require("./hooks/useGetRowSelection");
 const useTableState_1 = require("./hooks/useTableState");
 const summaryCalculations_1 = require("./utils/summaryCalculations");
+const useGetGroupedColumn_1 = require("./hooks/useGetGroupedColumn");
+const GroupedPanel_1 = require("./Components/Grouped/GroupedPanel");
+const DraggableHeaderCell_1 = require("./Components/HeaderCells/DraggableHeaderCell");
+const GroupAreaOverlay_1 = require("./Components/Grouped/GroupAreaOverlay");
+const sortable_1 = require("@dnd-kit/sortable");
 const calculateGroupSummary = (groupRow, globalSummary, dynamicSummaryConfig) => {
     const { subRows } = groupRow;
     if (dynamicSummaryConfig && subRows) {
@@ -34,6 +39,8 @@ exports.SmartGrid = (0, react_1.forwardRef)(({ defaultGrouping = [], dynamicRowS
     const theme = (0, material_1.useTheme)();
     const { butterflyBlue } = theme.palette.app.color;
     const [resetAllFilters, setResetAllFilters] = (0, react_1.useState)(false);
+    const [activeDragId, setActiveDragId] = (0, react_1.useState)(null);
+    const [activeDragOver, setActiveDragOver] = (0, react_1.useState)(null);
     const containerRef = (0, react_1.useRef)(null);
     const headerRef = (0, react_1.useRef)(null);
     const { columns: propsColumns, data, dynamicSummaryConfig, summary, } = props;
@@ -50,11 +57,12 @@ exports.SmartGrid = (0, react_1.forwardRef)(({ defaultGrouping = [], dynamicRowS
         loading,
         totalCount,
     });
-    const { getHeaderGroups, getRowModel, getSelectedRowModel } = table;
+    const { getHeaderGroups, getRowModel, getSelectedRowModel, getState } = table;
     const rows = getRowModel().rows;
+    const currentGrouping = getState().grouping;
     const notifyParentRef = (0, react_1.useRef)(null);
-    // Drag and drop Methoda
-    const { handleDragEnd, isHeaderReorderable, sensors } = (0, useGetDragMethods_1.useGetDragMethods)({
+    // Drag and drop Methods
+    const { handleDragEnd: handleColumnReorder, isHeaderReorderable, sensors, } = (0, useGetDragMethods_1.useGetDragMethods)({
         swipeableColumns,
         table,
     });
@@ -144,6 +152,35 @@ exports.SmartGrid = (0, react_1.forwardRef)(({ defaultGrouping = [], dynamicRowS
         }, 100);
     };
     const headerGroups = getHeaderGroups();
+    // Helper function to filter headers - hide grouping columns when grouping is enabled
+    const filterHeaders = (headers, grouping) => {
+        if (grouping.length === 0) {
+            return headers;
+        }
+        return headers.filter((header) => {
+            // Keep the group column
+            if (header.column.id === "grouped_by") {
+                return true;
+            }
+            // Filter out grouping columns
+            const columnId = header.column.id;
+            const accessorKey = header.column.columnDef?.accessorKey;
+            const isGroupingColumn = grouping.includes(columnId) ||
+                (accessorKey && grouping.includes(accessorKey));
+            return !isGroupingColumn;
+        });
+    };
+    const { handleDragEnd, handleDragStart, handleRemoveGroup, allDraggableIds, customCollisionDetection, hasGroupableColumns, } = (0, useGetGroupedColumn_1.useGetGroupedColumn)({
+        table,
+        swipeableColumns,
+        setActiveDragId,
+        currentGrouping,
+        handleColumnReorder,
+        filterHeaders,
+        isHeaderReorderable,
+        propsColumns,
+        defaultGrouping,
+    });
     return ((0, jsx_runtime_1.jsxs)(CellSelectionContext_1.CellSelectionProvider, { value: {
             ...cellSelection,
             enabled: enableCellSelection,
@@ -159,50 +196,69 @@ exports.SmartGrid = (0, react_1.forwardRef)(({ defaultGrouping = [], dynamicRowS
                 background-color: ${butterflyBlue[700]};
               }
             }
-          ` }), (0, jsx_runtime_1.jsxs)("div", { style: {
-                    display: "flex",
-                    flexDirection: "column",
-                    height: height || "calc(100vh - 100px)",
-                    position: "relative",
-                }, onMouseUp: endCellSelection, children: [(0, jsx_runtime_1.jsx)("div", { ref: containerRef, style: {
-                            border: `1px solid ${theme.palette.divider}`,
-                            flexGrow: 1,
-                            height: "100%",
-                            overflow: "auto",
-                            position: "relative",
-                        }, children: (0, jsx_runtime_1.jsxs)("table", { style: {
-                                borderCollapse: "separate",
-                                borderSpacing: 0,
-                                fontFamily: "arial, sans-serif",
-                                minHeight: "100%",
-                                tableLayout: "fixed",
-                                width: "100%",
-                            }, children: [(0, jsx_runtime_1.jsx)("thead", { ref: headerRef, style: {
-                                        position: "sticky",
-                                        top: 0,
-                                        zIndex: 10,
-                                    }, children: swipeableColumns ? ((0, jsx_runtime_1.jsx)(core_1.DndContext, { sensors: sensors, collisionDetection: core_1.closestCenter, onDragEnd: handleDragEnd, children: headerGroups.map((headerGroup) => {
-                                            return ((0, jsx_runtime_1.jsx)(DraggableHeaderGroupRows_1.DraggableHeaderGroupRows, { defaultGrouping: defaultGrouping, enableSecondRowFilter: enableSecondRowFilter, headerGroup: headerGroup, isHeaderReorderable: isHeaderReorderable, loading: loading, resetAllFilters: resetAllFilters, swipeableColumns: swipeableColumns }, headerGroup.id));
-                                        }) })) : (headerGroups.map((headerGroup) => {
-                                        const leftPinnedHeaders = headerGroup.headers.filter((h) => h.column.getIsPinned() === "left");
-                                        const centerHeaders = headerGroup.headers.filter((h) => !h.column.getIsPinned());
-                                        const rightPinnedHeaders = headerGroup.headers.filter((h) => h.column.getIsPinned() === "right");
-                                        const headerRow = ((0, jsx_runtime_1.jsxs)("tr", { children: [leftPinnedHeaders.map((header) => ((0, jsx_runtime_1.jsx)(HeaderCell_1.HeaderCell, { defaultGrouping: defaultGrouping, header: header, loading: loading, resetAllFilters: resetAllFilters }, header.id))), centerHeaders.map((header) => {
-                                                    return ((0, jsx_runtime_1.jsx)(HeaderCell_1.HeaderCell, { defaultGrouping: defaultGrouping, header: header, loading: loading, resetAllFilters: resetAllFilters }, header.id));
-                                                }), rightPinnedHeaders.map((header) => ((0, jsx_runtime_1.jsx)(HeaderCell_1.HeaderCell, { defaultGrouping: defaultGrouping, header: header, loading: loading, resetAllFilters: resetAllFilters }, header.id)))] }, `${headerGroup.id}-row`));
-                                        return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [headerRow, enableSecondRowFilter && !loading && ((0, jsx_runtime_1.jsx)("tr", { children: headerGroup.headers.map((header) => ((0, jsx_runtime_1.jsx)(SearchFilterRow_1.SearchFilterRow, { header: header, resetAllFilters: resetAllFilters }, header.id))) }))] }, headerGroup.id));
-                                    })) }), (0, jsx_runtime_1.jsx)("tbody", { style: {
-                                        filter: loading ? "blur(2px)" : "none",
-                                        height: `${rowVirtualizer.getTotalSize()}px`,
+          ` }), (0, jsx_runtime_1.jsxs)(core_1.DndContext, { sensors: sensors, collisionDetection: customCollisionDetection, onDragStart: handleDragStart, onDragEnd: handleDragEnd, onDragOver: (event) => {
+                    setActiveDragOver(event.over ? String(event.over.id) : null);
+                }, onDragCancel: () => {
+                    setActiveDragOver(null);
+                    setActiveDragId(null);
+                }, children: [(0, jsx_runtime_1.jsx)(sortable_1.SortableContext, { items: allDraggableIds, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                display: "flex",
+                                flexDirection: "column",
+                                height: height || "calc(100vh - 100px)",
+                                position: "relative",
+                            }, onMouseUp: endCellSelection, children: [hasGroupableColumns && ((0, jsx_runtime_1.jsx)(GroupedPanel_1.GroupedPanel, { groupedColumns: currentGrouping, onRemoveGroup: handleRemoveGroup, table: table, defaultGrouping: defaultGrouping })), (0, jsx_runtime_1.jsx)("div", { ref: containerRef, style: {
+                                        border: `1px solid ${theme.palette.divider}`,
+                                        flexGrow: 1,
+                                        height: "100%",
+                                        overflow: "auto",
                                         position: "relative",
-                                        transition: "filter 0.2s ease-in-out",
-                                    }, children: rowVirtualizer.getVirtualItems().map((virtualRow) => {
-                                        const enhancedRow = enhancedRows[virtualRow.index];
-                                        if (!enhancedRow) {
-                                            return null;
-                                        }
-                                        const { groupId, isSummary, row, summaryData } = enhancedRow;
-                                        return ((0, jsx_runtime_1.jsx)(TableRowComponent_1.TableRowComponent, { columnWidths: columnWidths, row: row, index: virtualRow.index, virtualRow: virtualRow, rowHeight: rowHeight, isSummaryRow: isSummary, summaryData: summaryData, exportData: exportData, exportActions: exportActions }, `table-row-${virtualRow.index}-${isSummary ? "summary" : "normal"}-${groupId}`));
-                                    }) }), !loading && summary && ((0, jsx_runtime_1.jsx)(TableFooterComponent_1.TableFooterComponent, { table: table, summary: summary }))] }) }), rowSelection && getSelectedRowModel().rows.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { style: { fontSize: "13px" }, children: ["Selected Rows: ", getSelectedRowModel().rows.length] })), (0, jsx_runtime_1.jsx)(FilterStatusPanel_1.FilterStatusPanel, { table: table, clearAllFilters: clearAllFilters }), loading && (0, jsx_runtime_1.jsx)(CircularLoader_1.CircularLoader, {}), !rows.length && !loading && (0, jsx_runtime_1.jsx)(DataNotFound_1.DataNotFound, { message: emptyMessage })] })] }));
+                                    }, children: (0, jsx_runtime_1.jsxs)("table", { style: {
+                                            borderCollapse: "separate",
+                                            borderSpacing: 0,
+                                            fontFamily: "arial, sans-serif",
+                                            minHeight: "100%",
+                                            tableLayout: "fixed",
+                                            width: "100%",
+                                        }, children: [(0, jsx_runtime_1.jsx)("thead", { ref: headerRef, style: {
+                                                    position: "sticky",
+                                                    top: 0,
+                                                    zIndex: 10,
+                                                }, children: swipeableColumns ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: headerGroups.map((headerGroup) => {
+                                                        const filteredHeaderGroup = {
+                                                            ...headerGroup,
+                                                            headers: filterHeaders(headerGroup.headers, currentGrouping),
+                                                        };
+                                                        return ((0, jsx_runtime_1.jsx)(DraggableHeaderGroupRows_1.DraggableHeaderGroupRows, { defaultGrouping: defaultGrouping, enableSecondRowFilter: enableSecondRowFilter, headerGroup: filteredHeaderGroup, isHeaderReorderable: isHeaderReorderable, loading: loading, resetAllFilters: resetAllFilters, swipeableColumns: swipeableColumns }, headerGroup.id));
+                                                    }) })) : (headerGroups.map((headerGroup) => {
+                                                    const allHeaders = filterHeaders(headerGroup.headers, currentGrouping);
+                                                    const leftPinnedHeaders = allHeaders.filter((h) => h.column.getIsPinned() === "left");
+                                                    const centerHeaders = allHeaders.filter((h) => !h.column.getIsPinned());
+                                                    const rightPinnedHeaders = allHeaders.filter((h) => h.column.getIsPinned() === "right");
+                                                    // Helper to check if header can be grouped and should be draggable
+                                                    // Only columns with enableGrouping: true should be draggable to group area
+                                                    const isGroupable = (header) => {
+                                                        const columnDef = header.column
+                                                            .columnDef;
+                                                        return columnDef.enableGrouping === true;
+                                                    };
+                                                    const headerRow = ((0, jsx_runtime_1.jsxs)("tr", { children: [leftPinnedHeaders.map((header) => ((0, jsx_runtime_1.jsx)(HeaderCell_1.HeaderCell, { defaultGrouping: defaultGrouping, header: header, loading: loading, resetAllFilters: resetAllFilters }, header.id))), centerHeaders.map((header) => {
+                                                                // Make groupable headers draggable so they can be dragged to grouping panel
+                                                                const canGroup = isGroupable(header);
+                                                                return canGroup ? ((0, jsx_runtime_1.jsx)(DraggableHeaderCell_1.DraggableHeaderCell, { defaultGrouping: defaultGrouping, header: header, loading: loading, resetAllFilters: resetAllFilters }, header.id)) : ((0, jsx_runtime_1.jsx)(HeaderCell_1.HeaderCell, { defaultGrouping: defaultGrouping, header: header, loading: loading, resetAllFilters: resetAllFilters }, header.id));
+                                                            }), rightPinnedHeaders.map((header) => ((0, jsx_runtime_1.jsx)(HeaderCell_1.HeaderCell, { defaultGrouping: defaultGrouping, header: header, loading: loading, resetAllFilters: resetAllFilters }, header.id)))] }, `${headerGroup.id}-row`));
+                                                    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [headerRow, enableSecondRowFilter && !loading && ((0, jsx_runtime_1.jsx)("tr", { children: allHeaders.map((header) => ((0, jsx_runtime_1.jsx)(SearchFilterRow_1.SearchFilterRow, { header: header, resetAllFilters: resetAllFilters }, header.id))) }))] }, headerGroup.id));
+                                                })) }), (0, jsx_runtime_1.jsx)("tbody", { style: {
+                                                    filter: loading ? "blur(2px)" : "none",
+                                                    height: `${rowVirtualizer.getTotalSize()}px`,
+                                                    position: "relative",
+                                                    transition: "filter 0.2s ease-in-out",
+                                                }, children: rowVirtualizer.getVirtualItems().map((virtualRow) => {
+                                                    const enhancedRow = enhancedRows[virtualRow.index];
+                                                    if (!enhancedRow) {
+                                                        return null;
+                                                    }
+                                                    const { groupId, isSummary, row, summaryData } = enhancedRow;
+                                                    return ((0, jsx_runtime_1.jsx)(TableRowComponent_1.TableRowComponent, { columnWidths: columnWidths, row: row, index: virtualRow.index, virtualRow: virtualRow, rowHeight: rowHeight, isSummaryRow: isSummary, summaryData: summaryData, exportData: exportData, exportActions: exportActions, grouping: currentGrouping }, `table-row-${virtualRow.index}-${isSummary ? "summary" : "normal"}-${groupId}`));
+                                                }) }), !loading && summary && ((0, jsx_runtime_1.jsx)(TableFooterComponent_1.TableFooterComponent, { table: table, summary: summary }))] }) }), rowSelection && getSelectedRowModel().rows.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { style: { fontSize: "14px" }, children: ["Selected Rows: ", getSelectedRowModel().rows.length] })), (0, jsx_runtime_1.jsx)(FilterStatusPanel_1.FilterStatusPanel, { table: table, clearAllFilters: clearAllFilters }), loading && (0, jsx_runtime_1.jsx)(CircularLoader_1.CircularLoader, {}), !rows.length && !loading && ((0, jsx_runtime_1.jsx)(DataNotFound_1.DataNotFound, { message: emptyMessage }))] }) }), (0, jsx_runtime_1.jsx)(GroupAreaOverlay_1.GroupAreaOverlay, { activeDragId: activeDragId, activeDragOver: activeDragOver, table: table, defaultGrouping: defaultGrouping })] })] }));
 });
 exports.SmartGrid.displayName = "SmartGrid";

package/packages/shared-components/dist/SmartGrid/hooks/useGetColumnWidth.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGetColumnWidth.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetColumnWidth.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAGnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,KAAK,sBAAsB,CAAC,CAAC,IAAI;IAC/B,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3B,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,uBAAuB,CAAC,CAAC;IACpD,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,CAAC,EAAE,gCAIlC,sBAAsB,CAAC,CAAC,CAAC;;CA4E3B,CAAC"}
+{"version":3,"file":"useGetColumnWidth.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetColumnWidth.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAEnD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,KAAK,sBAAsB,CAAC,CAAC,IAAI;IAC/B,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3B,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,uBAAuB,CAAC,CAAC;IACpD,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,CAAC,EAAE,gCAIlC,sBAAsB,CAAC,CAAC,CAAC;;CA4E3B,CAAC"}

package/packages/shared-components/dist/SmartGrid/hooks/useGetFacetedFilter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGetFacetedFilter.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetFacetedFilter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAItD,OAAO,KAAK,EAAE,YAAY,EAAkB,MAAM,UAAU,CAAC;AAE7D,KAAK,wBAAwB,CAAC,CAAC,IAAI;IACjC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,CAAC,EAAE,cAEpC,wBAAwB,CAAC,CAAC,CAAC;;;;;CAiK7B,CAAC"}
+{"version":3,"file":"useGetFacetedFilter.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetFacetedFilter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAGtD,OAAO,KAAK,EAAE,YAAY,EAAkB,MAAM,UAAU,CAAC;AAE7D,KAAK,wBAAwB,CAAC,CAAC,IAAI;IACjC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,CAAC,EAAE,cAEpC,wBAAwB,CAAC,CAAC,CAAC;;;;;CAiK7B,CAAC"}

package/packages/shared-components/dist/SmartGrid/hooks/useGetGroupedColumn.d.ts

@@ -1,11 +1,23 @@
-import type { Header } from "@tanstack/react-table";
+import type { CollisionDetection, DragStartEvent, DragEndEvent } from "@dnd-kit/core";
+import type { ColumnDef, Header, Table } from "@tanstack/react-table";
 type UseGetGroupedColumnProps<T> = {
-    header: Header<T, unknown>;
+    table: Table<T>;
+    swipeableColumns: boolean;
+    setActiveDragId: (id: string | null) => void;
+    currentGrouping: string[];
+    handleColumnReorder: (event: DragEndEvent) => void;
+    filterHeaders: (headers: Header<T, unknown>[], grouping: string[]) => Header<T, unknown>[];
+    isHeaderReorderable: (header: Header<T, unknown>, swipeableColumns: boolean) => boolean;
+    propsColumns: ColumnDef<T>[];
+    defaultGrouping: Array<keyof T>;
 };
-export declare const useGetGroupedColumn: <T>({ header, }: UseGetGroupedColumnProps<T>) => {
-    groupedIndex: number;
-    isGroupable: boolean;
-    isGrouped: boolean;
+export declare const useGetGroupedColumn: <T>({ table, swipeableColumns, setActiveDragId, currentGrouping, handleColumnReorder, filterHeaders, isHeaderReorderable, propsColumns, defaultGrouping, }: UseGetGroupedColumnProps<T>) => {
+    handleDragEnd: (event: DragEndEvent) => void;
+    handleDragStart: (event: DragStartEvent) => void;
+    handleRemoveGroup: (columnId: string) => void;
+    allDraggableIds: string[];
+    hasGroupableColumns: boolean;
+    customCollisionDetection: CollisionDetection;
 };
 export {};
 //# sourceMappingURL=useGetGroupedColumn.d.ts.map

package/packages/shared-components/dist/SmartGrid/hooks/useGetGroupedColumn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGetGroupedColumn.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetGroupedColumn.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAEpD,KAAK,wBAAwB,CAAC,CAAC,IAAI;IACjC,MAAM,EAAE,MAAM,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,CAAC,EAAE,aAEpC,wBAAwB,CAAC,CAAC,CAAC;;;;CAU7B,CAAC"}
+{"version":3,"file":"useGetGroupedColumn.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetGroupedColumn.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,kBAAkB,EAClB,cAAc,EACd,YAAY,EACb,MAAM,eAAe,CAAC;AAGvB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAItE,KAAK,wBAAwB,CAAC,CAAC,IAAI;IACjC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;IAChB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7C,eAAe,EAAE,MAAM,EAAE,CAAC;IAC1B,mBAAmB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IACnD,aAAa,EAAE,CACb,OAAO,EAAE,MAAM,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,EAC7B,QAAQ,EAAE,MAAM,EAAE,KACf,MAAM,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,CAAC;IAC1B,mBAAmB,EAAE,CACnB,MAAM,EAAE,MAAM,CAAC,CAAC,EAAE,OAAO,CAAC,EAC1B,gBAAgB,EAAE,OAAO,KACtB,OAAO,CAAC;IACb,YAAY,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC;IAC7B,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,CAAC,EAAE,wJAUpC,wBAAwB,CAAC,CAAC,CAAC;2BA6ElB,YAAY;6BANsB,cAAc;kCAhE7C,MAAM;;;;CA2OpB,CAAC"}

package/packages/shared-components/dist/SmartGrid/hooks/useGetGroupedColumn.js

@@ -1,11 +1,165 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useGetGroupedColumn = void 0;
-const useGetGroupedColumn = ({ header, }) => {
-    const { getCanGroup, getGroupedIndex, getIsGrouped } = header.column;
-    const isGroupable = getCanGroup();
-    const isGrouped = getIsGrouped();
-    const groupedIndex = getGroupedIndex();
-    return { groupedIndex, isGroupable, isGrouped };
+const core_1 = require("@dnd-kit/core");
+const sortable_1 = require("@dnd-kit/sortable");
+const react_1 = require("react");
+const useGetGroupedColumn = ({ table, swipeableColumns, setActiveDragId, currentGrouping, handleColumnReorder, filterHeaders, isHeaderReorderable, propsColumns, defaultGrouping, }) => {
+    const { getColumn, getHeaderGroups, setGrouping } = table;
+    const headerGroups = getHeaderGroups();
+    // Handler to remove column from grouping
+    const handleRemoveGroup = (0, react_1.useCallback)((columnId) => {
+        const currentGroupingArray = currentGrouping;
+        const newGrouping = currentGroupingArray.filter((id) => id !== columnId);
+        setGrouping(newGrouping);
+    }, [currentGrouping, table]);
+    // Helper: Reorder chips within grouping panel
+    const handleChipReorder = (0, react_1.useCallback)((activeId, overId, groupingArray) => {
+        const oldIndex = groupingArray.indexOf(activeId);
+        const newIndex = groupingArray.indexOf(overId);
+        const newGrouping = (0, sortable_1.arrayMove)(groupingArray, oldIndex, newIndex);
+        setGrouping(newGrouping);
+    }, [table]);
+    // Helper: Add column to grouping
+    const handleAddToGrouping = (0, react_1.useCallback)((activeId, groupingArray) => {
+        const column = getColumn(activeId);
+        if (!column) {
+            return false;
+        }
+        const columnDef = column.columnDef;
+        // If defaultGrouping exists and enableGrouping is true, prohibit adding to grouping
+        if (defaultGrouping.length > 0 && columnDef.enableGrouping === true) {
+            return false;
+        }
+        if (columnDef.enableGrouping !== true) {
+            return false;
+        }
+        const accessorKey = columnDef.accessorKey;
+        const isAlreadyGrouped = groupingArray.includes(activeId) ||
+            (accessorKey && groupingArray.includes(accessorKey));
+        if (isAlreadyGrouped) {
+            return false;
+        }
+        const groupingId = accessorKey ?? activeId;
+        setGrouping([...groupingArray, groupingId]);
+        return true;
+    }, [table, defaultGrouping]);
+    // Handle drag start
+    const handleDragStart = (0, react_1.useCallback)((event) => {
+        setActiveDragId(String(event.active.id));
+    }, []);
+    // Main drag end handler
+    const handleDragEnd = (0, react_1.useCallback)((event) => {
+        setActiveDragId(null);
+        const { active, over } = event;
+        if (!over) {
+            return;
+        }
+        const activeId = String(active.id);
+        const overId = String(over.id);
+        const groupingArray = currentGrouping;
+        const isActiveGrouped = groupingArray.includes(activeId);
+        // Case 1: Reordering chips within grouping panel
+        if (isActiveGrouped && groupingArray.includes(overId)) {
+            handleChipReorder(activeId, overId, groupingArray);
+            return;
+        }
+        // Case 2: Dragging grouped chip over panel (no-op)
+        if (isActiveGrouped && overId === "grouping-panel") {
+            return;
+        }
+        // Case 3: Dragging header to grouping panel
+        if (overId === "grouping-panel") {
+            handleAddToGrouping(activeId, groupingArray);
+            return;
+        }
+        // Case 4: Column reordering (when swipeableColumns is enabled)
+        if (swipeableColumns) {
+            handleColumnReorder(event);
+        }
+    }, [
+        currentGrouping,
+        swipeableColumns,
+        handleColumnReorder,
+        handleChipReorder,
+        handleAddToGrouping,
+    ]);
+    // Get ALL draggable column IDs for unified SortableContext
+    // This includes: groupable headers, reorderable headers, and grouped chips
+    const allDraggableIds = (0, react_1.useMemo)(() => {
+        const ids = new Set();
+        // Add all visible center headers that are either groupable or reorderable
+        headerGroups.forEach((headerGroup) => {
+            const filteredHeaders = filterHeaders(headerGroup.headers, currentGrouping);
+            filteredHeaders.forEach((header) => {
+                // Skip pinned columns and group column
+                if (header.column.getIsPinned() || header.column.id === "grouped_by") {
+                    return;
+                }
+                const columnDef = header.column.columnDef;
+                const isGroupable = columnDef.enableGrouping === true;
+                const isReorderable = swipeableColumns && isHeaderReorderable(header, true);
+                if (isGroupable || isReorderable) {
+                    ids.add(header.column.id);
+                }
+            });
+        });
+        // Add already grouped columns (for reordering chips in the panel)
+        currentGrouping.forEach((groupId) => {
+            ids.add(groupId);
+        });
+        return Array.from(ids);
+    }, [
+        headerGroups,
+        currentGrouping,
+        filterHeaders,
+        swipeableColumns,
+        isHeaderReorderable,
+    ]);
+    const customCollisionDetection = (0, react_1.useCallback)((args) => {
+        const { active } = args;
+        const activeId = String(active.id);
+        const groupingArray = currentGrouping;
+        const isDraggingChip = groupingArray.includes(activeId);
+        // Get all collisions using rectIntersection
+        const rectCollisions = (0, core_1.rectIntersection)(args);
+        // If dragging a chip (reordering within panel)
+        if (isDraggingChip) {
+            // Find collisions with other chips (not the panel itself)
+            const chipCollisions = rectCollisions.filter((collision) => groupingArray.includes(String(collision.id)) &&
+                String(collision.id) !== activeId);
+            // If hovering over another chip, prioritize chip-to-chip collision
+            if (chipCollisions.length > 0) {
+                return chipCollisions;
+            }
+            // Otherwise return panel collision if over panel
+            const panelCollision = rectCollisions.find((collision) => collision.id === "grouping-panel");
+            return panelCollision ? [panelCollision] : rectCollisions;
+        }
+        // If dragging a header (adding to grouping)
+        // Check if pointer is within the grouping panel
+        const pointerCollisions = (0, core_1.pointerWithin)(args);
+        const groupingPanelCollision = pointerCollisions.find((collision) => collision.id === "grouping-panel");
+        // If pointer is over the grouping panel, prioritize it
+        if (groupingPanelCollision) {
+            return [groupingPanelCollision];
+        }
+        // Otherwise use rectIntersection for column swapping
+        return rectCollisions;
+    }, [currentGrouping]);
+    const hasGroupableColumns = (0, react_1.useMemo)(() => {
+        return propsColumns.some((column) => {
+            const columnDef = column;
+            return columnDef.enableGrouping === true || !!defaultGrouping.length;
+        });
+    }, [propsColumns, defaultGrouping]);
+    return {
+        handleDragEnd,
+        handleDragStart,
+        handleRemoveGroup,
+        allDraggableIds,
+        hasGroupableColumns,
+        customCollisionDetection,
+    };
 };
 exports.useGetGroupedColumn = useGetGroupedColumn;

package/packages/shared-components/dist/SmartGrid/hooks/useGetPinningColumns.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGetPinningColumns.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetPinningColumns.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAGhE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,KAAK,yBAAyB,CAAC,CAAC,IAAI;IAClC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,CAAC,EAAE,cAErC,yBAAyB,CAAC,CAAC,CAAC;;;CA0B9B,CAAC"}
+{"version":3,"file":"useGetPinningColumns.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetPinningColumns.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEhE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,KAAK,yBAAyB,CAAC,CAAC,IAAI;IAClC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,CAAC,EAAE,cAErC,yBAAyB,CAAC,CAAC,CAAC;;;CA0B9B,CAAC"}

package/packages/shared-components/dist/SmartGrid/hooks/useGetRowSelection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGetRowSelection.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetRowSelection.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,KAAK,uBAAuB,CAAC,CAAC,IAAI;IAChC,aAAa,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IACjC,mBAAmB,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,KAAK,OAAO,CAAC;IAC9C,YAAY,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,CAAC,EAAG,uDAIpC,uBAAuB,CAAC,CAAC,CAAC;;CAkI5B,CAAC"}
+{"version":3,"file":"useGetRowSelection.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetRowSelection.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,KAAK,uBAAuB,CAAC,CAAC,IAAI;IAChC,aAAa,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IACjC,mBAAmB,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,KAAK,OAAO,CAAC;IAC9C,YAAY,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,CAAC,EAAG,uDAIpC,uBAAuB,CAAC,CAAC,CAAC;;CAkI5B,CAAC"}

package/packages/shared-components/dist/SmartGrid/hooks/useGetSortedColumn.d.ts

@@ -5,7 +5,7 @@ type UseGetSortedColumnProps<T> = {
 export declare const useGetSortedColumn: <T>({ header, }: UseGetSortedColumnProps<T>) => {
     isSortable: boolean;
     mutipleSortCounts: number;
-    sortableIcon: import("react/jsx-runtime").JSX.Element;
+    sortableIcon: import("react/jsx-runtime").JSX.Element | null;
 };
 export {};
 //# sourceMappingURL=useGetSortedColumn.d.ts.map

package/packages/shared-components/dist/SmartGrid/hooks/useGetSortedColumn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGetSortedColumn.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetSortedColumn.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AASpD,KAAK,uBAAuB,CAAC,CAAC,IAAI;IAChC,MAAM,EAAE,MAAM,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,CAAC,EAAG,aAEpC,uBAAuB,CAAC,CAAC,CAAC;;;;CAgB5B,CAAC"}
+{"version":3,"file":"useGetSortedColumn.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/hooks/useGetSortedColumn.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAQpD,KAAK,uBAAuB,CAAC,CAAC,IAAI;IAChC,MAAM,EAAE,MAAM,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,CAAC,EAAG,aAEpC,uBAAuB,CAAC,CAAC,CAAC;;;;CAgB5B,CAAC"}