@uxf/data-grid 11.112.0 → 11.113.0

package/data-grid.js

@@ -32,7 +32,7 @@ function DataGrid(props) {
                 react_1.default.createElement(toolbar_customs_1.DataGridToolbarCustoms, { buttons: props.customActions })),
             react_1.default.createElement(linear_progress_1.DataGridLinearProgress, { isLoading: props.isLoading }),
             react_1.default.createElement(filter_list_1.DataGridFilterList, { actions: props.actions, filterHandlers: (_c = props.filterHandlers) !== null && _c !== void 0 ? _c : filter_handler_1.defaultFilterHandlers, schema: props.schema, state: props.state }),
-            react_1.default.createElement(table_v2_1.DataGridTableV2, { NoRowsFallback: props.NoRowsFallback, actionCell: props.actionCell, actions: props.actions, bodyCells: (_d = props.bodyCells) !== null && _d !== void 0 ? _d : body_cell_1.BodyCells, data: (_f = (_e = props.data) === null || _e === void 0 ? void 0 : _e.result) !== null && _f !== void 0 ? _f : empty_array_1.EMPTY_ARRAY, error: props.error, hasStickyHeader: props.hasStickyHeader, headerRowHeight: props.headerRowHeight, isLoading: props.isLoading, isRowSelectDisabled: props.isRowSelectDisabled, isRowsSelectable: props.isRowsSelectable, keyExtractor: props.keyExtractor, reload: props.reload, rowAccent: props.rowAccent, rowClassName: props.rowClassName, rowHeight: props.rowHeight, schema: props.schema, state: props.state }),
+            react_1.default.createElement(table_v2_1.DataGridTableV2, { NoRowsFallback: props.NoRowsFallback, actionCell: props.actionCell, actions: props.actions, bodyCells: (_d = props.bodyCells) !== null && _d !== void 0 ? _d : body_cell_1.BodyCells, data: (_f = (_e = props.data) === null || _e === void 0 ? void 0 : _e.result) !== null && _f !== void 0 ? _f : empty_array_1.EMPTY_ARRAY, error: props.error, hasStickyHeader: props.hasStickyHeader, isLoading: props.isLoading, isRowSelectDisabled: props.isRowSelectDisabled, isRowsSelectable: props.isRowsSelectable, keyExtractor: props.keyExtractor, reload: props.reload, rowAccent: props.rowAccent, rowClassName: props.rowClassName, rowHeight: props.rowHeight, schema: props.schema, state: props.state }),
             react_1.default.createElement(footer_1.DataGridFooter, null,
                 react_1.default.createElement(rows_per_page_select_1.DataGridRowsPerPageSelect, { actions: props.actions, state: props.state }),
                 react_1.default.createElement(row_counts_1.DataGridRowCounts, { count: (_h = (_g = props.data) === null || _g === void 0 ? void 0 : _g.count) !== null && _h !== void 0 ? _h : 0, state: props.state, totalCount: (_k = (_j = props.data) === null || _j === void 0 ? void 0 : _j.totalCount) !== null && _k !== void 0 ? _k : 0 }),

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@uxf/data-grid",
-    "version": "11.112.0",
+    "version": "11.113.0",
     "description": "UXF DataGrid",
     "homepage": "https://gitlab.com/uxf-npm/data-grid#readme",
     "main": "index.js",
@@ -45,7 +45,7 @@
         "@uxf/core-react": "11.111.2",
         "@uxf/localize": "11.111.2",
         "@uxf/styles": "11.111.2",
-        "@uxf/ui": "11.112.0",
+        "@uxf/ui": "11.113.0",
         "dayjs": "^1.11.19",
         "react": ">=18.2.0",
         "react-dom": ">=18.2.0"
@@ -60,7 +60,7 @@
         "@uxf/core-react": "11.111.2",
         "@uxf/localize": "11.111.2",
         "@uxf/styles": "11.111.2",
-        "@uxf/ui": "11.112.0",
+        "@uxf/ui": "11.113.0",
         "dayjs": "^1.11.19",
         "react": "18.3.1",
         "react-dom": "18.3.1"

package/table-v2/hooks/use-resizable-columns.d.ts

@@ -2,7 +2,7 @@ import { Nullish } from "@uxf/core/types";
 import { BaseGridType, Column } from "../../types";
 import { DataGridControl } from "../../use-data-grid-control";
 import { DataGridTableProps } from "../types";
-export declare function useResizableColumns<GridType extends BaseGridType>(columns: Column[], actionCell: DataGridTableProps<GridType>["actionCell"], actions: DataGridControl["actions"], selectRowsCellWidth: number | Nullish): {
+export declare function useResizableColumns<GridType extends BaseGridType>(columns: Column[], actionCell: DataGridTableProps<GridType>["actionCell"], actions: DataGridControl["actions"], selectRowsCellWidth: number | Nullish, hasStickyHeader: boolean): {
     tableRef: import("react").RefObject<HTMLDivElement>;
     headerRef: import("react").RefObject<HTMLDivElement>;
     bodyRef: import("react").RefObject<HTMLDivElement>;

package/table-v2/hooks/use-resizable-columns.js

@@ -7,7 +7,7 @@ const react_1 = require("react");
 const get_grid_template_columns_1 = require("../utils/get-grid-template-columns");
 const COLUMN_ABSOLUTE_MIN_WIDTH = 50;
 const COLUMN_PADDING = 24;
-function useResizableColumns(columns, actionCell, actions, selectRowsCellWidth) {
+function useResizableColumns(columns, actionCell, actions, selectRowsCellWidth, hasStickyHeader) {
     const [activeIndex, setActiveIndex] = (0, react_1.useState)(null);
     const tableRef = (0, react_1.useRef)(null);
     const headerRef = (0, react_1.useRef)(null);
@@ -23,7 +23,7 @@ function useResizableColumns(columns, actionCell, actions, selectRowsCellWidth)
                 const columnMinWidth = (_b = (_a = column.config) === null || _a === void 0 ? void 0 : _a.minWidth) !== null && _b !== void 0 ? _b : COLUMN_ABSOLUTE_MIN_WIDTH;
                 if (i === activeIndex) {
                     const tableScrollLeft = (_d = (_c = headerRef.current) === null || _c === void 0 ? void 0 : _c.scrollLeft) !== null && _d !== void 0 ? _d : 0;
-                    const columnOffsetLeft = ((_e = columnRef === null || columnRef === void 0 ? void 0 : columnRef.offsetLeft) !== null && _e !== void 0 ? _e : 0) + ((_g = (_f = tableRef.current) === null || _f === void 0 ? void 0 : _f.offsetLeft) !== null && _g !== void 0 ? _g : 0);
+                    const columnOffsetLeft = ((_e = columnRef === null || columnRef === void 0 ? void 0 : columnRef.offsetLeft) !== null && _e !== void 0 ? _e : 0) + (hasStickyHeader ? ((_g = (_f = tableRef.current) === null || _f === void 0 ? void 0 : _f.offsetLeft) !== null && _g !== void 0 ? _g : 0) : 0);
                     const clickPositionX = e.clientX + tableScrollLeft;
                     const width = clickPositionX - columnOffsetLeft;
                     return width >= columnMinWidth ? width : columnMinWidth;
@@ -71,7 +71,7 @@ function useResizableColumns(columns, actionCell, actions, selectRowsCellWidth)
             window.removeEventListener("mousemove", onMouseMove);
             window.removeEventListener("mouseup", onMouseUp);
         };
-    }, [columns, actions, actionCellWidth, activeIndex, selectRowsCellWidth]);
+    }, [columns, actions, actionCellWidth, activeIndex, selectRowsCellWidth, hasStickyHeader]);
     const onAutoSize = (index) => {
         var _a, _b;
         const table = tableRef.current;

package/table-v2/table-v2.js

@@ -35,8 +35,8 @@ function DataGridTableV2(props) {
             props.state.userConfig.columnsOrder.indexOf(b.name)
         : 0);
     const selectedRowColumnWidth = props.isRowsSelectable ? SELECT_ROWS_CELL_WIDTH : null;
-    const { tableRef, headerRef, bodyRef, columnRefs, onResizeStart, onAutoSize } = (0, use_resizable_columns_1.useResizableColumns)(visibleColumns, props.actionCell, props.actions, selectedRowColumnWidth);
-    const gridTemplateRows = (0, get_grid_template_rows_1.getGridTemplateRows)(props.data, (_b = props.headerRowHeight) !== null && _b !== void 0 ? _b : 36, (_c = props.rowHeight) !== null && _c !== void 0 ? _c : 44);
+    const { tableRef, headerRef, bodyRef, columnRefs, onResizeStart, onAutoSize } = (0, use_resizable_columns_1.useResizableColumns)(visibleColumns, props.actionCell, props.actions, selectedRowColumnWidth, (_b = props.hasStickyHeader) !== null && _b !== void 0 ? _b : false);
+    const gridTemplateRows = (0, get_grid_template_rows_1.getGridTemplateRows)(props.data, (_c = props.rowHeight) !== null && _c !== void 0 ? _c : 44);
     const gridTemplateBasicColumns = visibleColumns
         .map((column) => {
         var _a;

package/table-v2/types.d.ts

@@ -9,7 +9,6 @@ export interface DataGridTableProps<GridType extends BaseGridType> extends DataG
     error?: unknown | Nullish;
     reload: () => Promise<any>;
     rowHeight?: number | ((row: InferDataGridRow<Schema<GridType>>) => number) | "auto";
-    headerRowHeight?: number;
     rowAccent?: (row: InferDataGridRow<Schema<GridType>>) => RowAccent;
     rowClassName?: (row: InferDataGridRow<Schema<GridType>>) => string | Nullish;
     keyExtractor?: KeyExtractor;

package/table-v2/utils/get-grid-template-rows.d.ts

@@ -1,3 +1,3 @@
 import { BaseGridType } from "../../types";
 import { DataGridTableProps } from "../types";
-export declare function getGridTemplateRows<GridType extends BaseGridType>(rows: any[], headerRowHeight: number, rowHeight: DataGridTableProps<GridType>["rowHeight"]): string | undefined;
+export declare function getGridTemplateRows<GridType extends BaseGridType>(rows: any[], rowHeight: DataGridTableProps<GridType>["rowHeight"]): string | undefined;

package/table-v2/utils/get-grid-template-rows.js

@@ -3,12 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getGridTemplateRows = getGridTemplateRows;
 const is_nil_1 = require("@uxf/core/utils/is-nil");
 const rem_1 = require("@uxf/styles/units/rem");
-function getGridTemplateRows(rows, headerRowHeight, rowHeight) {
+function getGridTemplateRows(rows, rowHeight) {
     if (rowHeight === "auto" || (0, is_nil_1.isNil)(rowHeight)) {
         return undefined;
     }
     if (typeof rowHeight === "number") {
-        return `${(0, rem_1.rem)(headerRowHeight)} repeat(${rows.length}, ${(0, rem_1.rem)(rowHeight)})`;
+        return `repeat(${rows.length}, ${(0, rem_1.rem)(rowHeight)})`;
     }
-    return `${headerRowHeight} ${rows.map(rowHeight).join(" ")}`;
+    return `${rows.map(rowHeight).join(" ")}`;
 }

package/types/data-grid-props.d.ts

@@ -30,7 +30,6 @@ export type DataGridBaseProps<GridType extends BaseGridType> = {
     getCsvDownloadUrl?: CsvDownloadGetUrl;
     gridName?: string;
     hasStickyHeader?: boolean;
-    headerRowHeight?: number;
     isDebug?: boolean;
     isHiddenColumnsSortable?: boolean;
     isRowSelectDisabled?: (row: InferDataGridRow<Schema<GridType>>) => boolean;