@astral/ui 4.45.0 → 4.47.0

package/node/components/DataGrid/useLogic/useLogic.js

@@ -2,35 +2,30 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLogic = void 0;
 const react_1 = require("react");
+const ConfigProvider_1 = require("../../ConfigProvider");
 const useFirstMountState_1 = require("../../useFirstMountState");
 const prop_1 = require("../../utils/prop");
 const uniqueBy_1 = require("../../utils/uniqueBy");
 const enums_1 = require("../enums");
+const getGridTemplateColumns_1 = require("../utils/getGridTemplateColumns");
+const hooks_1 = require("./hooks");
 const utils_1 = require("./utils");
-const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, selectedRows = [], isLoading, isDisabled, onSelectRow, isHideSelectAll, isHideHeaderIfNoData = false, }) => {
+const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, selectedRows = [], isLoading, isDisabled, onSelectRow, isError, onRetry, errorMsg, isHideSelectAll, isHideHeaderIfNoData = false, sorting, className, onSort, }) => {
     const isFirstRender = (0, useFirstMountState_1.useFirstMountState)();
     const isSelectable = Boolean(onSelectRow);
     const isDataGridDisabled = isLoading || isDisabled;
+    const { imagesMap } = (0, react_1.useContext)(ConfigProvider_1.ConfigContext);
     // Реф добавлен для избежания замыкания selectedRows в handleSelectRow (иначе в handleSelectRow приходят некорректные значения selectedRows).
     const selectedRowsRef = (0, react_1.useRef)(selectedRows);
     (0, react_1.useEffect)(() => {
         selectedRowsRef.current = selectedRows;
     }, [selectedRows]);
-    const treeRenderConfig = Object.is(variant, enums_1.Variant.Subrows)
-        ? { ...subrows, isInitialExpanded: true }
-        : tree;
-    const availableRows = rows.filter((row) => !(row.options?.isDisabled || row.options?.isNotSelectable));
     const prevRowsRef = (0, react_1.useRef)([]);
     (0, react_1.useEffect)(() => {
         if (!isLoading) {
             prevRowsRef.current = rows;
         }
     }, [rows, isLoading]);
-    const gridColumns = (0, utils_1.getGridTemplateColumns)(columns);
-    const isAllowHorizontalScroll = (0, utils_1.getIsAllowHorizontalScroll)(columns);
-    const uncheckedRowsCount = (0, react_1.useMemo)(() => {
-        return availableRows.filter((row) => !selectedRows.find((selectedRow) => selectedRow[keyId] === row[keyId])).length;
-    }, [availableRows, selectedRows, keyId]);
     const processedColumns = (0, react_1.useCallback)(() => {
         if (rows.length <= 1) {
             return columns.map((column) => ({ ...column, sortable: false }));
@@ -38,6 +33,26 @@ const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, selectedR
         return columns;
     }, [columns, rows]);
     const renderRows = isLoading ? prevRowsRef.current : rows;
+    const isNoData = !renderRows.length;
+    const { containerRef, rowHoverProps, sections, hasPinnedColumns } = (0, hooks_1.usePinnedColumns)({
+        isLoading,
+        columns: processedColumns(),
+    });
+    const { pinnedSectionsClassname, dataGridClassname, bodyClassName } = (0, hooks_1.useClassnames)({
+        isDataGridDisabled,
+        dataGridClassName: className,
+        hasPinnedColumns,
+        isNoData,
+    });
+    const treeRenderConfig = Object.is(variant, enums_1.Variant.Subrows)
+        ? { ...subrows, isInitialExpanded: true }
+        : tree;
+    const availableRows = rows.filter((row) => !(row.options?.isDisabled || row.options?.isNotSelectable));
+    const gridColumns = (0, getGridTemplateColumns_1.getGridTemplateColumns)(columns);
+    const isAllowHorizontalScroll = (0, utils_1.getIsAllowHorizontalScroll)(columns);
+    const uncheckedRowsCount = (0, react_1.useMemo)(() => {
+        return availableRows.filter((row) => !selectedRows.find((selectedRow) => selectedRow[keyId] === row[keyId])).length;
+    }, [availableRows, selectedRows, keyId]);
     const handleSelectAllRows = (event) => {
         if (!onSelectRow) {
             return;
@@ -58,27 +73,51 @@ const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, selectedR
         }
         onSelectRow(selectedRowsRef.current.filter((selectedRow) => selectedRow[keyId] !== row[keyId]));
     };
-    const isHideHead = isHideHeaderIfNoData && rows.length === 0;
+    const isHideHead = isHideHeaderIfNoData && isNoData;
+    const contentStateProps = (0, react_1.useMemo)(() => {
+        return {
+            isLoading: isLoading && isNoData,
+            isError: isError && isNoData,
+            loadingTitle: 'Загрузка данных',
+            errorState: {
+                imgAlt: 'Что-то пошло не так',
+                errorList: [errorMsg || ''],
+                imgSrc: imagesMap.defaultErrorImgSrc,
+                onRetry,
+            },
+            isSmoothLoading: false,
+        };
+    }, [isLoading, isError, isNoData, errorMsg, onRetry, imagesMap]);
     return {
+        pinnedSectionsClassname,
+        dataGridClassname,
         isDataGridDisabled,
         treeRenderConfig,
         renderRows,
         isAllowHorizontalScroll,
         isHideHead,
+        hasPinnedColumns,
+        contentStateProps,
+        rowHoverProps,
+        containerRef,
+        gridColumns,
+        isNoData,
+        headColumns: processedColumns(),
         headProps: {
             rowsCount: availableRows.length,
             uncheckedRowsCount,
-            gridColumns,
             isSelectable,
-            columns: processedColumns(),
             onSelectAllRows: handleSelectAllRows,
             isHideSelectAll,
+            sorting,
+            onSort,
         },
         bodyProps: {
-            gridColumns,
             isSelectable,
             onSelectRow: handleSelectRow,
         },
+        bodyClassName,
+        sections,
         loaderProps: {
             isLoading: !isFirstRender && isLoading,
             isVisibleDivider: Boolean(rows.length),

package/node/components/DataGrid/useLogic/utils/getColumnSections/getColumnSections.d.ts

@@ -0,0 +1,17 @@
+import type { PinnedSection } from '../../../PinnedSections/types';
+import type { DataGridColumns, DataGridRow } from '../../../types';
+/**
+ * Валидирует корректность комбинаций закрепления колонок.
+ * Выбрасывает ошибку, если колонки с pinned="right" не идут непрерывным блоком в конце
+ * или колонки с pinned="left" не идут непрерывным блоком в начале.
+ */
+export declare const validatePinnedColumns: (positions: ('left' | 'right' | 'center')[]) => void;
+/**
+ * Группирует колонки DataGrid по закреплённым позициям (pinned):
+ * - left (закреплены слева)
+ * - center (обычные, не закреплённые)
+ * - right (закреплены справа)
+ */
+export declare const getColumnSections: <TData extends Record<string, unknown> = DataGridRow>(columns: DataGridColumns<TData>[]) => {
+    sections: PinnedSection<TData>[];
+};

package/node/components/DataGrid/useLogic/utils/getColumnSections/getColumnSections.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getColumnSections = exports.validatePinnedColumns = void 0;
+/**
+ * Валидирует корректность комбинаций закрепления колонок.
+ * Выбрасывает ошибку, если колонки с pinned="right" не идут непрерывным блоком в конце
+ * или колонки с pinned="left" не идут непрерывным блоком в начале.
+ */
+const validatePinnedColumns = (positions) => {
+    const firstRight = positions.indexOf('right');
+    if (firstRight !== -1 &&
+        positions.slice(firstRight).some((p) => p !== 'right')) {
+        // biome-ignore lint/suspicious/noConsole: Сообщение для интеграторов
+        console.error('DataGrid: Колонки с pinned="right" должны идти непрерывным блоком в конце');
+    }
+    // left: должны быть в начале
+    const lastLeft = positions.lastIndexOf('left');
+    if (lastLeft !== -1 &&
+        positions.slice(0, lastLeft + 1).some((p) => p !== 'left')) {
+        // biome-ignore lint/suspicious/noConsole: Сообщение для интеграторов
+        console.error('DataGrid: Колонки с pinned="left" должны идти непрерывным блоком в начале');
+    }
+};
+exports.validatePinnedColumns = validatePinnedColumns;
+/**
+ * Группирует колонки DataGrid по закреплённым позициям (pinned):
+ * - left (закреплены слева)
+ * - center (обычные, не закреплённые)
+ * - right (закреплены справа)
+ */
+const getColumnSections = (columns) => {
+    const groups = columns.reduce((acc, col) => {
+        const position = col.pinned ?? 'center';
+        if (!acc[position]) {
+            acc[position] = [];
+        }
+        acc[position].push(col);
+        return acc;
+    }, {});
+    const positions = columns.map((c) => c.pinned ?? 'center');
+    (0, exports.validatePinnedColumns)(positions);
+    return {
+        sections: [
+            { position: 'left', columns: groups.left },
+            { position: 'center', columns: groups.center },
+            { position: 'right', columns: groups.right },
+        ],
+    };
+};
+exports.getColumnSections = getColumnSections;

package/node/components/DataGrid/useLogic/utils/getColumnSections/index.d.ts

@@ -0,0 +1 @@
+export * from './getColumnSections';

package/node/components/DataGrid/useLogic/utils/getColumnSections/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./getColumnSections"), exports);

package/node/components/DataGrid/useLogic/utils/index.d.ts

@@ -1,2 +1,3 @@
-export { getGridTemplateColumns } from './getGridTemplateColumns';
 export { getIsAllowHorizontalScroll } from './getIsAllowHorizontalScroll';
+export { syncRowsHeight } from './syncRowsHeight';
+export { getColumnSections } from './getColumnSections';

package/node/components/DataGrid/useLogic/utils/index.js

@@ -1,7 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getIsAllowHorizontalScroll = exports.getGridTemplateColumns = void 0;
-var getGridTemplateColumns_1 = require("./getGridTemplateColumns");
-Object.defineProperty(exports, "getGridTemplateColumns", { enumerable: true, get: function () { return getGridTemplateColumns_1.getGridTemplateColumns; } });
+exports.getColumnSections = exports.syncRowsHeight = exports.getIsAllowHorizontalScroll = void 0;
 var getIsAllowHorizontalScroll_1 = require("./getIsAllowHorizontalScroll");
 Object.defineProperty(exports, "getIsAllowHorizontalScroll", { enumerable: true, get: function () { return getIsAllowHorizontalScroll_1.getIsAllowHorizontalScroll; } });
+var syncRowsHeight_1 = require("./syncRowsHeight");
+Object.defineProperty(exports, "syncRowsHeight", { enumerable: true, get: function () { return syncRowsHeight_1.syncRowsHeight; } });
+var getColumnSections_1 = require("./getColumnSections");
+Object.defineProperty(exports, "getColumnSections", { enumerable: true, get: function () { return getColumnSections_1.getColumnSections; } });

package/node/components/DataGrid/useLogic/utils/syncRowsHeight/index.d.ts

@@ -0,0 +1 @@
+export * from './syncRowsHeight';

package/node/components/DataGrid/useLogic/utils/syncRowsHeight/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./syncRowsHeight"), exports);

package/node/components/DataGrid/useLogic/utils/syncRowsHeight/syncRowsHeight.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Синхронизирует высоту строк DataGrid на основе высоты их содержимого.
+ * Каждая строка устанавливает высоту равной максимальной высоте всех своих ячеек.
+ */
+export declare const syncRowsHeight: (rowsMap: Map<string, Set<HTMLElement>>) => void;

package/node/components/DataGrid/useLogic/utils/syncRowsHeight/syncRowsHeight.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.syncRowsHeight = void 0;
+/**
+ * Синхронизирует высоту строк DataGrid на основе высоты их содержимого.
+ * Каждая строка устанавливает высоту равной максимальной высоте всех своих ячеек.
+ */
+const syncRowsHeight = (rowsMap) => {
+    rowsMap.forEach((elements) => {
+        let maxHeight = 0;
+        elements.forEach((el) => {
+            el.style.height = '';
+        });
+        elements.forEach((el) => {
+            const height = el.offsetHeight;
+            if (height > maxHeight) {
+                maxHeight = height;
+            }
+        });
+        elements.forEach((el) => {
+            el.style.height = `${maxHeight}px`;
+        });
+    });
+};
+exports.syncRowsHeight = syncRowsHeight;

package/node/components/DataGrid/utils/index.d.ts

@@ -1 +1,2 @@
 export { alignToJustifyContent } from './alignToJustifyContent';
+export { getGridTemplateColumns } from './getGridTemplateColumns';

package/node/components/DataGrid/utils/index.js

@@ -1,5 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.alignToJustifyContent = void 0;
+exports.getGridTemplateColumns = exports.alignToJustifyContent = void 0;
 var alignToJustifyContent_1 = require("./alignToJustifyContent");
 Object.defineProperty(exports, "alignToJustifyContent", { enumerable: true, get: function () { return alignToJustifyContent_1.alignToJustifyContent; } });
+var getGridTemplateColumns_1 = require("./getGridTemplateColumns");
+Object.defineProperty(exports, "getGridTemplateColumns", { enumerable: true, get: function () { return getGridTemplateColumns_1.getGridTemplateColumns; } });

package/node/components/DataGridInfinite/useLogic/useLogic.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLogic = void 0;
 const react_1 = require("react");
 const enums_1 = require("../../DataGrid/enums");
-const utils_1 = require("../../DataGrid/useLogic/utils");
+const utils_1 = require("../../DataGrid/utils");
 const useToggle_1 = require("../../useToggle");
 const prop_1 = require("../../utils/prop");
 const uniqueBy_1 = require("../../utils/uniqueBy");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astral/ui",
-  "version": "4.45.0",
+  "version": "4.47.0",
   "browser": "./index.js",
   "main": "./node/index.js",
   "dependencies": {
@@ -12,6 +12,7 @@
     "@emotion/styled": "^11.13.5",
     "@mui/material": "5.13.0",
     "classnames": "^2.5.1",
+    "class-variance-authority": "^0.7.1",
     "colord": "^2.9.3",
     "dayjs": "^1.11.5",
     "react-imask": "6.4.2",

package/components/DataGrid/Body/useLogic/useLogic.d.ts

@@ -1,12 +0,0 @@
-import type { CellValue } from '../../types';
-import { type BodyProps } from '../Body';
-type UseLogicParams<TData extends Record<string, CellValue>> = BodyProps<TData>;
-export declare const useLogic: <TData extends Record<string, unknown>>({ isLoading, isError, rows, }: UseLogicParams<TData>) => {
-    isNoData: boolean;
-    contentStateProps: {
-        isLoading: boolean | undefined;
-        isError: boolean | undefined;
-        loadingTitle: string;
-    };
-};
-export {};

package/components/DataGrid/Body/useLogic/useLogic.js

@@ -1,11 +0,0 @@
-export const useLogic = ({ isLoading, isError, rows, }) => {
-    const isNoData = !rows.length;
-    return {
-        isNoData,
-        contentStateProps: {
-            isLoading: isLoading && isNoData,
-            isError: isError && isNoData,
-            loadingTitle: 'Загрузка данных',
-        },
-    };
-};

package/node/components/DataGrid/Body/useLogic/useLogic.d.ts

@@ -1,12 +0,0 @@
-import type { CellValue } from '../../types';
-import { type BodyProps } from '../Body';
-type UseLogicParams<TData extends Record<string, CellValue>> = BodyProps<TData>;
-export declare const useLogic: <TData extends Record<string, unknown>>({ isLoading, isError, rows, }: UseLogicParams<TData>) => {
-    isNoData: boolean;
-    contentStateProps: {
-        isLoading: boolean | undefined;
-        isError: boolean | undefined;
-        loadingTitle: string;
-    };
-};
-export {};

package/node/components/DataGrid/Body/useLogic/useLogic.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useLogic = void 0;
-const useLogic = ({ isLoading, isError, rows, }) => {
-    const isNoData = !rows.length;
-    return {
-        isNoData,
-        contentStateProps: {
-            isLoading: isLoading && isNoData,
-            isError: isError && isNoData,
-            loadingTitle: 'Загрузка данных',
-        },
-    };
-};
-exports.useLogic = useLogic;