@astral/ui 4.44.0 → 4.46.0

package/node/components/DataGrid/types.d.ts

@@ -232,6 +232,10 @@ export type DataGridColumns<TData extends Record<string, CellValue>> = {
      * Принимает компонент DataGridColumnHintIcon - подсказка в шапке колонки
      */
     columnHint?: ReactNode;
+    /**
+     * Закрепление колонки в таблице
+     */
+    pinned?: 'left' | 'right';
 };
 export type DataGridRowOptionColumns<TData extends Record<string, CellValue>> = {
     /**

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

@@ -0,0 +1,2 @@
+export * from './usePinnedColumns';
+export * from './useClassnames';

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

@@ -0,0 +1,18 @@
+"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("./usePinnedColumns"), exports);
+__exportStar(require("./useClassnames"), exports);

package/node/components/DataGrid/useLogic/hooks/useClassnames/index.d.ts

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

package/node/components/DataGrid/useLogic/hooks/useClassnames/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("./useClassnames"), exports);

package/node/components/DataGrid/useLogic/hooks/useClassnames/useClassnames.d.ts

@@ -0,0 +1,12 @@
+type UseClassnamesParams = {
+    isDataGridDisabled?: boolean;
+    dataGridClassName?: string;
+    hasPinnedColumns?: boolean;
+    isNoData?: boolean;
+};
+export declare const useClassnames: ({ isDataGridDisabled, dataGridClassName, hasPinnedColumns, isNoData, }: UseClassnamesParams) => {
+    pinnedSectionsClassname: string;
+    dataGridClassname: string;
+    bodyClassName: string;
+};
+export {};

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

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useClassnames = void 0;
+const classNames_1 = require("../../../../utils/classNames");
+const constants_1 = require("../../../constants");
+const useClassnames = ({ isDataGridDisabled, dataGridClassName, hasPinnedColumns, isNoData, }) => {
+    const pinnedSectionsClassname = (0, classNames_1.classNames)(constants_1.dataGridClassnames.pinnedSections, {
+        [constants_1.dataGridClassnames.disabled]: isDataGridDisabled,
+    });
+    const dataGridClassname = (0, classNames_1.classNames)(constants_1.dataGridClassnames.root, dataGridClassName, {
+        [constants_1.dataGridClassnames.dataGridHasPinnedSections]: hasPinnedColumns,
+    });
+    const bodyClassName = (0, classNames_1.classNames)(constants_1.dataGridClassnames.body, {
+        [constants_1.dataGridClassnames.bodyEmpty]: isNoData,
+    });
+    return { pinnedSectionsClassname, dataGridClassname, bodyClassName };
+};
+exports.useClassnames = useClassnames;

package/node/components/DataGrid/useLogic/hooks/usePinnedColumns/index.d.ts

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

package/node/components/DataGrid/useLogic/hooks/usePinnedColumns/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("./usePinnedColumns"), exports);

package/node/components/DataGrid/useLogic/hooks/usePinnedColumns/usePinnedColumns.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import { type CellValue, type DataGridColumns, type DataGridRow } from '../../../types';
+type UsePinnedColumnsParams<TData extends Record<string, CellValue> = DataGridRow> = {
+    isLoading?: boolean;
+    columns: DataGridColumns<TData>[];
+};
+export declare const usePinnedColumns: <TData extends Record<string, unknown> = DataGridRow>({ isLoading, columns, }: UsePinnedColumnsParams<TData>) => {
+    containerRef: import("react").RefObject<HTMLDivElement | null>;
+    rowHoverProps: {
+        registerRowElement: (rowId: string, el: HTMLElement) => void;
+        unregisterRowElement: (rowId: string, el: HTMLElement) => void;
+        onRowEnter: (rowId: string) => void;
+        onRowLeave: (rowId: string, e: PointerEvent) => void;
+    };
+    sections: import("../../../PinnedSections/types").PinnedSection<TData>[];
+    hasPinnedColumns: boolean;
+};
+export {};

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

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePinnedColumns = void 0;
+const react_1 = require("react");
+const constants_1 = require("../../../constants");
+const useRowHover_1 = require("../../../hooks/useRowHover");
+const getColumnSections_1 = require("../../utils/getColumnSections");
+const syncRowsHeight_1 = require("../../utils/syncRowsHeight");
+const usePinnedColumns = ({ isLoading, columns, }) => {
+    const containerRef = (0, react_1.useRef)(null);
+    const hasPinnedColumns = (0, react_1.useMemo)(() => columns.some((column) => column.pinned), [columns]);
+    const { rowsMapRef, ...rowHoverProps } = (0, useRowHover_1.useRowHover)({ hasPinnedColumns });
+    const isScrollStateSupported = CSS.supports('container-type', 'scroll-state');
+    const checkOverflow = (0, react_1.useCallback)((element) => {
+        if (element) {
+            return element.scrollWidth > element.clientWidth;
+        }
+        return false;
+    }, []);
+    const { sections } = (0, react_1.useMemo)(() => (0, getColumnSections_1.getColumnSections)(columns), [columns]);
+    (0, react_1.useLayoutEffect)(() => {
+        if (isLoading || !hasPinnedColumns || typeof window === 'undefined') {
+            return;
+        }
+        const resizeObserver = new ResizeObserver(() => {
+            (0, syncRowsHeight_1.syncRowsHeight)(rowsMapRef.current);
+            if (isScrollStateSupported) {
+                return;
+            }
+            if (checkOverflow(containerRef.current)) {
+                containerRef.current?.classList.add(constants_1.dataGridClassnames.overflowed);
+            }
+            else {
+                containerRef.current?.classList.remove(constants_1.dataGridClassnames.overflowed);
+            }
+        });
+        if (!containerRef.current) {
+            return;
+        }
+        resizeObserver.observe(containerRef.current);
+        return () => {
+            resizeObserver.disconnect();
+        };
+    }, [hasPinnedColumns, isLoading]);
+    return { containerRef, rowHoverProps, sections, hasPinnedColumns };
+};
+exports.usePinnedColumns = usePinnedColumns;

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

@@ -1,7 +1,9 @@
 import { type ChangeEvent } from 'react';
 import type { CellValue, DataGridProps, DataGridRow } from '../types';
 type UseLogicParams<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = DataGridProps<TData, TSortField>;
-export declare const useLogic: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, variant, tree, subrows, selectedRows, isLoading, isDisabled, onSelectRow, isHideSelectAll, isHideHeaderIfNoData, }: UseLogicParams<TData, TSortField>) => {
+export declare const useLogic: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, variant, tree, subrows, selectedRows, isLoading, isDisabled, onSelectRow, isError, onRetry, errorMsg, isHideSelectAll, isHideHeaderIfNoData, sorting, className, onSort, }: UseLogicParams<TData, TSortField>) => {
+    pinnedSectionsClassname: string;
+    dataGridClassname: string;
     isDataGridDisabled: boolean | undefined;
     treeRenderConfig: {
         isInitialExpanded?: boolean | undefined;
@@ -11,20 +13,44 @@ export declare const useLogic: <TData extends Record<string, unknown> = DataGrid
     renderRows: TData[];
     isAllowHorizontalScroll: boolean;
     isHideHead: boolean;
+    hasPinnedColumns: boolean;
+    contentStateProps: {
+        isLoading: boolean | undefined;
+        isError: boolean | undefined;
+        loadingTitle: string;
+        errorState: {
+            imgAlt: string;
+            errorList: string[];
+            imgSrc: string;
+            onRetry: () => void;
+        };
+        isSmoothLoading: boolean;
+    };
+    rowHoverProps: {
+        registerRowElement: (rowId: string, el: HTMLElement) => void;
+        unregisterRowElement: (rowId: string, el: HTMLElement) => void;
+        onRowEnter: (rowId: string) => void;
+        onRowLeave: (rowId: string, e: PointerEvent) => void;
+    };
+    containerRef: import("react").RefObject<HTMLDivElement | null>;
+    gridColumns: string;
+    isNoData: boolean;
+    headColumns: import("../types").DataGridColumns<TData>[];
     headProps: {
         rowsCount: number;
         uncheckedRowsCount: number;
-        gridColumns: string;
         isSelectable: boolean;
-        columns: import("../types").DataGridColumns<TData>[];
         onSelectAllRows: (event: ChangeEvent<HTMLInputElement>) => void;
         isHideSelectAll: boolean | undefined;
+        sorting: import("../types").DataGridSort<TSortField> | undefined;
+        onSort: ((sorting: import("../types").DataGridSort<TSortField> | undefined) => void) | undefined;
     };
     bodyProps: {
-        gridColumns: string;
         isSelectable: boolean;
         onSelectRow: (row: TData) => (event: ChangeEvent<HTMLInputElement>) => void;
     };
+    bodyClassName: string;
+    sections: import("../PinnedSections/types").PinnedSection<TData>[];
     loaderProps: {
         isLoading: boolean | undefined;
         isVisibleDivider: boolean;

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/node/components/PageContent/constants.d.ts

@@ -3,5 +3,6 @@ export declare const pageContentClassnames: {
     content: string;
     contentHasHeader: string;
     animation: string;
+    withPdfViewer: string;
 };
 export declare const PAGE_CONTENT_ANIMATION = "white-flash";

package/node/components/PageContent/constants.js

@@ -7,5 +7,6 @@ exports.pageContentClassnames = {
     content: (0, createUIKitClassname_1.createUIKitClassname)('page-content__content'),
     contentHasHeader: (0, createUIKitClassname_1.createUIKitClassname)('page-content__content_has-header'),
     animation: (0, createUIKitClassname_1.createUIKitClassname)('page-content_animation'),
+    withPdfViewer: (0, createUIKitClassname_1.createUIKitClassname)('page-content_with-pdf-viewer'),
 };
 exports.PAGE_CONTENT_ANIMATION = 'white-flash';

package/node/components/PageContent/styles.js

@@ -109,4 +109,17 @@ exports.Content = styled_1.styled.div `
       padding: ${({ theme }) => theme.spacing(4, 4, 3)};
     }
   }
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    &&.${constants_2.pageContentClassnames.withPdfViewer} {
+      margin: 0;
+      padding-top: 0;
+      padding-right: 0;
+      padding-left: 0;
+
+      background-color: ${({ theme }) => theme.palette.background.body};
+      border: unset;
+      border-radius: 0;
+    }
+  }
 `;

package/node/components/PdfViewer/List/styles.js

@@ -6,4 +6,8 @@ exports.Wrapper = styled_1.styled.div `
   display: flex;
   flex-direction: column;
   gap: ${({ theme }) => theme.spacing(4)};
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    gap: 0;
+  }
 `;

package/node/components/PdfViewer/PdfDocument/styles.js

@@ -50,4 +50,9 @@ exports.StyledDocument = (0, styled_1.styled)(react_pdf_1.Document, {
       opacity: 1;
     }
   }
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    margin: 0;
+    padding: 0;
+  }
 `;

package/node/components/PdfViewer/PdfPage/styles.js

@@ -24,6 +24,16 @@ exports.Wrapper = styled_1.styled.div `
     height: ${({ $height }) => $height}px;
     padding-top: 0;
   }
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    border-top: ${({ $isViewerLite, theme }) => ($isViewerLite ? 'unset' : `1px solid ${theme.palette.grey[300]}`)};
+    border-radius: ${({ $isViewerLite }) => !$isViewerLite && 0};
+    box-shadow: ${({ $isViewerLite }) => !$isViewerLite && 'none'};
+    
+    &:last-child {
+      border-bottom: ${({ $isViewerLite, theme }) => ($isViewerLite ? 'unset' : `1px solid ${theme.palette.grey[300]}`)};
+    }
+  }
 `;
 exports.StyledTag = (0, styled_1.styled)(ControlBar_1.StyledTag) `
   top: ${({ theme }) => theme.spacing(3)};

package/node/components/PdfViewer/styles.js

@@ -22,4 +22,8 @@ exports.ScrollContainer = styled_1.styled.div `
   overflow: ${({ $isViewerLite, $enabledZoom }) => $isViewerLite || !$enabledZoom ? 'unset' : 'auto'};
 
   height: 100%;
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    scrollbar-gutter: unset;
+  }
 `;