@astral/ui 4.44.0 → 4.46.0

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

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

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

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

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

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

package/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/components/DataGrid/useLogic/hooks/useClassnames/useClassnames.js

@@ -0,0 +1,14 @@
+import { classNames } from '../../../../utils/classNames';
+import { dataGridClassnames } from '../../../constants';
+export const useClassnames = ({ isDataGridDisabled, dataGridClassName, hasPinnedColumns, isNoData, }) => {
+    const pinnedSectionsClassname = classNames(dataGridClassnames.pinnedSections, {
+        [dataGridClassnames.disabled]: isDataGridDisabled,
+    });
+    const dataGridClassname = classNames(dataGridClassnames.root, dataGridClassName, {
+        [dataGridClassnames.dataGridHasPinnedSections]: hasPinnedColumns,
+    });
+    const bodyClassName = classNames(dataGridClassnames.body, {
+        [dataGridClassnames.bodyEmpty]: isNoData,
+    });
+    return { pinnedSectionsClassname, dataGridClassname, bodyClassName };
+};

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

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

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

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

package/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/components/DataGrid/useLogic/hooks/usePinnedColumns/usePinnedColumns.js

@@ -0,0 +1,43 @@
+import { useCallback, useLayoutEffect, useMemo, useRef } from 'react';
+import { dataGridClassnames } from '../../../constants';
+import { useRowHover } from '../../../hooks/useRowHover';
+import { getColumnSections } from '../../utils/getColumnSections';
+import { syncRowsHeight } from '../../utils/syncRowsHeight';
+export const usePinnedColumns = ({ isLoading, columns, }) => {
+    const containerRef = useRef(null);
+    const hasPinnedColumns = useMemo(() => columns.some((column) => column.pinned), [columns]);
+    const { rowsMapRef, ...rowHoverProps } = useRowHover({ hasPinnedColumns });
+    const isScrollStateSupported = CSS.supports('container-type', 'scroll-state');
+    const checkOverflow = useCallback((element) => {
+        if (element) {
+            return element.scrollWidth > element.clientWidth;
+        }
+        return false;
+    }, []);
+    const { sections } = useMemo(() => getColumnSections(columns), [columns]);
+    useLayoutEffect(() => {
+        if (isLoading || !hasPinnedColumns || typeof window === 'undefined') {
+            return;
+        }
+        const resizeObserver = new ResizeObserver(() => {
+            syncRowsHeight(rowsMapRef.current);
+            if (isScrollStateSupported) {
+                return;
+            }
+            if (checkOverflow(containerRef.current)) {
+                containerRef.current?.classList.add(dataGridClassnames.overflowed);
+            }
+            else {
+                containerRef.current?.classList.remove(dataGridClassnames.overflowed);
+            }
+        });
+        if (!containerRef.current) {
+            return;
+        }
+        resizeObserver.observe(containerRef.current);
+        return () => {
+            resizeObserver.disconnect();
+        };
+    }, [hasPinnedColumns, isLoading]);
+    return { containerRef, rowHoverProps, sections, hasPinnedColumns };
+};

package/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/components/DataGrid/useLogic/useLogic.js

@@ -1,33 +1,28 @@
-import { useCallback, useEffect, useMemo, useRef, } from 'react';
+import { useCallback, useContext, useEffect, useMemo, useRef, } from 'react';
+import { ConfigContext } from '../../ConfigProvider';
 import { useFirstMountState } from '../../useFirstMountState';
 import { prop } from '../../utils/prop';
 import { uniqueBy } from '../../utils/uniqueBy';
 import { Variant } from '../enums';
-import { getGridTemplateColumns, getIsAllowHorizontalScroll } from './utils';
-export const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, selectedRows = [], isLoading, isDisabled, onSelectRow, isHideSelectAll, isHideHeaderIfNoData = false, }) => {
+import { getGridTemplateColumns } from '../utils/getGridTemplateColumns';
+import { useClassnames, usePinnedColumns } from './hooks';
+import { getIsAllowHorizontalScroll } from './utils';
+export const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, selectedRows = [], isLoading, isDisabled, onSelectRow, isError, onRetry, errorMsg, isHideSelectAll, isHideHeaderIfNoData = false, sorting, className, onSort, }) => {
     const isFirstRender = useFirstMountState();
     const isSelectable = Boolean(onSelectRow);
     const isDataGridDisabled = isLoading || isDisabled;
+    const { imagesMap } = useContext(ConfigContext);
     // Реф добавлен для избежания замыкания selectedRows в handleSelectRow (иначе в handleSelectRow приходят некорректные значения selectedRows).
     const selectedRowsRef = useRef(selectedRows);
     useEffect(() => {
         selectedRowsRef.current = selectedRows;
     }, [selectedRows]);
-    const treeRenderConfig = Object.is(variant, Variant.Subrows)
-        ? { ...subrows, isInitialExpanded: true }
-        : tree;
-    const availableRows = rows.filter((row) => !(row.options?.isDisabled || row.options?.isNotSelectable));
     const prevRowsRef = useRef([]);
     useEffect(() => {
         if (!isLoading) {
             prevRowsRef.current = rows;
         }
     }, [rows, isLoading]);
-    const gridColumns = getGridTemplateColumns(columns);
-    const isAllowHorizontalScroll = getIsAllowHorizontalScroll(columns);
-    const uncheckedRowsCount = useMemo(() => {
-        return availableRows.filter((row) => !selectedRows.find((selectedRow) => selectedRow[keyId] === row[keyId])).length;
-    }, [availableRows, selectedRows, keyId]);
     const processedColumns = useCallback(() => {
         if (rows.length <= 1) {
             return columns.map((column) => ({ ...column, sortable: false }));
@@ -35,6 +30,26 @@ export const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, se
         return columns;
     }, [columns, rows]);
     const renderRows = isLoading ? prevRowsRef.current : rows;
+    const isNoData = !renderRows.length;
+    const { containerRef, rowHoverProps, sections, hasPinnedColumns } = usePinnedColumns({
+        isLoading,
+        columns: processedColumns(),
+    });
+    const { pinnedSectionsClassname, dataGridClassname, bodyClassName } = useClassnames({
+        isDataGridDisabled,
+        dataGridClassName: className,
+        hasPinnedColumns,
+        isNoData,
+    });
+    const treeRenderConfig = Object.is(variant, Variant.Subrows)
+        ? { ...subrows, isInitialExpanded: true }
+        : tree;
+    const availableRows = rows.filter((row) => !(row.options?.isDisabled || row.options?.isNotSelectable));
+    const gridColumns = getGridTemplateColumns(columns);
+    const isAllowHorizontalScroll = getIsAllowHorizontalScroll(columns);
+    const uncheckedRowsCount = useMemo(() => {
+        return availableRows.filter((row) => !selectedRows.find((selectedRow) => selectedRow[keyId] === row[keyId])).length;
+    }, [availableRows, selectedRows, keyId]);
     const handleSelectAllRows = (event) => {
         if (!onSelectRow) {
             return;
@@ -55,27 +70,51 @@ export const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, se
         }
         onSelectRow(selectedRowsRef.current.filter((selectedRow) => selectedRow[keyId] !== row[keyId]));
     };
-    const isHideHead = isHideHeaderIfNoData && rows.length === 0;
+    const isHideHead = isHideHeaderIfNoData && isNoData;
+    const contentStateProps = 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/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/components/DataGrid/useLogic/utils/getColumnSections/getColumnSections.js

@@ -0,0 +1,45 @@
+/**
+ * Валидирует корректность комбинаций закрепления колонок.
+ * Выбрасывает ошибку, если колонки с pinned="right" не идут непрерывным блоком в конце
+ * или колонки с pinned="left" не идут непрерывным блоком в начале.
+ */
+export 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" должны идти непрерывным блоком в начале');
+    }
+};
+/**
+ * Группирует колонки DataGrid по закреплённым позициям (pinned):
+ * - left (закреплены слева)
+ * - center (обычные, не закреплённые)
+ * - right (закреплены справа)
+ */
+export 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');
+    validatePinnedColumns(positions);
+    return {
+        sections: [
+            { position: 'left', columns: groups.left },
+            { position: 'center', columns: groups.center },
+            { position: 'right', columns: groups.right },
+        ],
+    };
+};

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

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

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

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

package/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/components/DataGrid/useLogic/utils/index.js

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

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

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

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

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

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

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

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

@@ -0,0 +1,21 @@
+/**
+ * Синхронизирует высоту строк DataGrid на основе высоты их содержимого.
+ * Каждая строка устанавливает высоту равной максимальной высоте всех своих ячеек.
+ */
+export 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`;
+        });
+    });
+};

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

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

package/components/DataGrid/utils/index.js

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

package/components/DataGridInfinite/useLogic/useLogic.js

@@ -1,6 +1,6 @@
 import { useCallback, useMemo, useRef, useState, } from 'react';
 import { Variant } from '../../DataGrid/enums';
-import { getGridTemplateColumns } from '../../DataGrid/useLogic/utils';
+import { getGridTemplateColumns } from '../../DataGrid/utils';
 import { useToggle } from '../../useToggle';
 import { prop } from '../../utils/prop';
 import { uniqueBy } from '../../utils/uniqueBy';

package/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/components/PageContent/constants.js

@@ -4,5 +4,6 @@ export const pageContentClassnames = {
     content: createUIKitClassname('page-content__content'),
     contentHasHeader: createUIKitClassname('page-content__content_has-header'),
     animation: createUIKitClassname('page-content_animation'),
+    withPdfViewer: createUIKitClassname('page-content_with-pdf-viewer'),
 };
 export const PAGE_CONTENT_ANIMATION = 'white-flash';

package/components/PageContent/styles.js

@@ -106,4 +106,17 @@ export const Content = styled.div `
       padding: ${({ theme }) => theme.spacing(4, 4, 3)};
     }
   }
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    &&.${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/components/PdfViewer/List/styles.js

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

package/components/PdfViewer/PdfDocument/styles.js

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

package/components/PdfViewer/PdfPage/styles.js

@@ -21,6 +21,16 @@ export const Wrapper = 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]}`)};
+    }
+  }
 `;
 export const StyledTag = styled(Tag) `
   top: ${({ theme }) => theme.spacing(3)};

package/components/PdfViewer/styles.js

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

package/components/PdfViewer/useLogic/useLogic.js

@@ -1,13 +1,27 @@
 import { useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { ConfigContext } from '../../ConfigProvider';
+import { pageContentClassnames } from '../../PageContent/constants';
+import { useViewportType } from '../../useViewportType';
 import { useZoom } from '../hooks/useZoom';
 import { getPageHeightList } from '../utils';
 export const useLogic = ({ file, scrollRef, paginationRef, isFullHeight, isCentered, renderPageRange, isHidePersonalData, isViewerLite, enabledZoom = true, options, ...props }) => {
     const [containerWidth, setContainerWidth] = useState(1);
+    const { isMobile } = useViewportType();
     const scrollContainerRef = useRef(null);
+    useEffect(() => {
+        const el = scrollRef?.current;
+        if (!el) {
+            return;
+        }
+        const isPageContentScroll = el.classList.contains(pageContentClassnames.content);
+        if (!isPageContentScroll) {
+            return;
+        }
+        el.classList.add(pageContentClassnames.withPdfViewer);
+    }, [scrollRef]);
     const { zoomOut, scale, zoomIn, shouldAnimateZoom } = useZoom({
         scrollContainerRef,
-        enabledZoom,
+        enabledZoom: enabledZoom && !isMobile,
     });
     const [isError, setIsError] = useState(false);
     const [errorData, setErrorData] = useState();

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

@@ -1,99 +1,2 @@
-import { type ChangeEvent, type ReactNode } from 'react';
-import type { Variant } from '../enums';
-import type { CellValue, DataGridColumns, DataGridRowOptions } from '../types';
-export type BodyProps<TData extends Record<string, CellValue>> = {
-    /**
-     * Конфигурация колонок для таблицы
-     */
-    columns: DataGridColumns<TData>[];
-    /**
-     * Поле, которое будет использоваться в качестве ключа
-     */
-    keyId: keyof TData;
-    /**
-     * Конфигурация ширины колонок
-     */
-    gridColumns: string;
-    /**
-     * Если true, показывается анимация загрузки
-     */
-    isLoading?: boolean;
-    /**
-     * Флаг состояния ошибки
-     */
-    isError?: boolean;
-    /**
-     * Текст ошибки
-     */
-    errorMsg?: string;
-    /**
-     * Идентификатор активного элемента массива rows. Выделяет активную строку в таблице
-     */
-    activeRowId?: string;
-    /**
-     * Если true, то дерево будет раскрыто по умолчанию
-     * @default 'false'
-     */
-    isInitialExpanded: boolean;
-    /**
-     * Уровень раскрытия дерева по умолчанию, при isInitialExpanded=true
-     */
-    expandedLevel: number;
-    /**
-     * Количество отображаемых по умолчанию дочерних элементов
-     */
-    initialVisibleChildrenCount: number;
-    /**
-     * Номер колонки, в которой будет расположена кнопка "Показать все"
-     * Работает только для `variant="subrows"`
-     */
-    moreButtonColumnPosition: number;
-    /**
-     * Если false, кнопка разворачивания элементов не показывается
-     * Работает только для `variant="subrows"`
-     */
-    isVisibleCollapseButton: boolean;
-    /**
-     * Если true, то будет отображаться чекбокс для выбора элемента
-     */
-    isSelectable?: boolean;
-    /**
-     * Массив выбранных строк
-     */
-    selectedRows?: TData[];
-    /**
-     * Массив данных для отображения
-     */
-    rows: Array<TData & {
-        options?: DataGridRowOptions<TData>;
-    }>;
-    /**
-     * Вариант отображения вложенных элементов
-     */
-    variant: `${Variant}`;
-    /**
-     * Используется для отображения переданного кол-ва строк при отсутствии данных
-     */
-    minDisplayRows: number;
-    /**
-     * Заглушка для пустых ячеек (если отсутствует field и filter и renderCell)
-     */
-    emptyCellValue?: ReactNode;
-    /**
-     *  Используется для отображения placeholder при отсутствии данных в таблице
-     */
-    noDataPlaceholder?: ReactNode;
-    /**
-     * Обработчик выбора строки
-     */
-    onSelectRow: (row: TData) => (event: ChangeEvent<HTMLInputElement>) => void;
-    /**
-     * Функция обработки нажатия на кнопку "Повторить запрос"
-     */
-    onRetry: () => void;
-    /**
-     * Обработчик клика строки таблицы
-     */
-    onRowClick?: (row: TData) => void;
-};
+import type { BodyProps } from './types';
 export declare const Body: <TData extends Record<string, unknown>>(props: BodyProps<TData>) => import("react/jsx-runtime").JSX.Element;