@astral/ui 4.113.3 → 4.115.0

package/components/ActionGroup/ActionGroup.js

@@ -5,7 +5,7 @@ import { SecondaryActions } from './SecondaryActions';
 import { SecondaryVisibleActions } from './SecondaryVisibleActions';
 import { Wrapper } from './styles';
 export const ActionGroup = (props) => {
-    const { main, secondary, secondaryVisible, className, size = 'medium', } = props;
+    const { main, secondary, secondaryVisible, secondaryPopoverProps, className, size = 'medium', } = props;
     const { disabledAction } = useActionsState({ main, secondary });
-    return (_jsxs(Wrapper, { className: className, children: [secondary && (_jsx(SecondaryActions, { isDisabled: disabledAction, actions: secondary, size: size })), secondaryVisible && (_jsx(SecondaryVisibleActions, { actions: secondaryVisible, size: size })), main && (_jsx(MainActions, { isDisabled: disabledAction, actions: main, size: size }))] }));
+    return (_jsxs(Wrapper, { className: className, children: [secondary && (_jsx(SecondaryActions, { isDisabled: disabledAction, actions: secondary, size: size, popoverProps: secondaryPopoverProps })), secondaryVisible && (_jsx(SecondaryVisibleActions, { actions: secondaryVisible, size: size })), main && (_jsx(MainActions, { isDisabled: disabledAction, actions: main, size: size }))] }));
 };

package/components/ActionGroup/SecondaryActions/SecondaryActions.d.ts

@@ -1,3 +1,3 @@
 import { type ElementType } from 'react';
 import type { SecondaryActionProps } from '../types';
-export declare const SecondaryActions: <TSecondaryActionComponent extends ElementType = ElementType>({ actions, isDisabled, className, size, }: SecondaryActionProps<TSecondaryActionComponent>) => import("react/jsx-runtime").JSX.Element | null;
+export declare const SecondaryActions: <TSecondaryActionComponent extends ElementType = ElementType>({ actions, isDisabled, className, size, popoverProps, }: SecondaryActionProps<TSecondaryActionComponent>) => import("react/jsx-runtime").JSX.Element | null;

package/components/ActionGroup/SecondaryActions/SecondaryActions.js

@@ -5,10 +5,10 @@ import { IconDropdownButton } from '../../IconDropdownButton';
 import { ListItemButton } from '../../ListItemButton';
 import { ListItemText } from '../../ListItemText';
 const TOOLTIP_PLACEMENT = 'right';
-export const SecondaryActions = ({ actions, isDisabled, className, size, }) => {
+export const SecondaryActions = ({ actions, isDisabled, className, size, popoverProps, }) => {
     if (!actions.length) {
         return null;
     }
-    return (_jsx(IconDropdownButton, { disabled: isDisabled, icon: _jsx(DotsOutlineMd, {}), variant: "outlined", color: "grey", size: size, className: className, children: actions.map(({ text, ...secondaryProps }) => (_createElement(ListItemButton, { tooltipPlacement: TOOLTIP_PLACEMENT, ...secondaryProps, key: text },
+    return (_jsx(IconDropdownButton, { disabled: isDisabled, icon: _jsx(DotsOutlineMd, {}), variant: "outlined", color: "grey", size: size, className: className, popoverProps: popoverProps, children: actions.map(({ text, ...secondaryProps }) => (_createElement(ListItemButton, { tooltipPlacement: TOOLTIP_PLACEMENT, ...secondaryProps, key: text },
             _jsx(ListItemText, { primary: text })))) }));
 };

package/components/ActionGroup/types.d.ts

@@ -1,6 +1,7 @@
 import type { ComponentProps, ElementType, ReactElement, ReactNode } from 'react';
 import type { ButtonProps, ButtonSize } from '../Button';
 import type { DropdownButtonProps } from '../DropdownButton';
+import type { IconDropdownButtonProps } from '../IconDropdownButton';
 import type { ListItemButtonProps } from '../ListItemButton';
 import type { MenuItemProps } from '../MenuItem';
 import type { TooltipProps } from '../Tooltip';
@@ -143,6 +144,10 @@ export type SecondaryActionProps<TSecondaryActionComponent extends ElementType>
      */
     className?: string;
     size?: ButtonSize;
+    /**
+     * Пропсы Popover меню второстепенных действий
+     */
+    popoverProps?: IconDropdownButtonProps['popoverProps'];
 };
 /** Модель второстепенного видимого экшена */
 export type SecondaryVisibleAction = Omit<ButtonProps, 'children'> & {
@@ -177,6 +182,10 @@ export type ActionGroupProps<TMainActionComponent extends ElementType = ElementT
      * Второстепенные действия, спрятанные за троеточием
      */
     secondary?: SecondaryAction<TSecondaryActionComponent>[];
+    /**
+     * Пропсы Popover меню второстепенных действий
+     */
+    secondaryPopoverProps?: IconDropdownButtonProps['popoverProps'];
     /**
      * Видимые второстепенные действия
      */

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

@@ -1,2 +1,2 @@
 import type { BodyProps } from './types';
-export declare const Body: <TData extends Record<string, unknown>>({ rows, selectedRows, minDisplayRows, keyId, noDataPlaceholder, className, renderRow, columns, isSelectable, onSelectRow, onRowEnter, onRowLeave, registerRowElement, unregisterRowElement, ...rowProps }: BodyProps<TData>) => import("react/jsx-runtime").JSX.Element;
+export declare const Body: <TData extends Record<string, unknown>>({ rows, selectedIds, rowsDisabled, getRowDisabled, minDisplayRows, keyId, noDataPlaceholder, className, renderRow, columns, isSelectable, onSelectRow, onRowEnter, onRowLeave, registerRowElement, unregisterRowElement, ...rowProps }: BodyProps<TData>) => import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/Body/Body.js

@@ -15,13 +15,17 @@ const bodyCva = cva(bodyClassnames.root, {
         },
     },
 });
-export const Body = ({ rows, selectedRows = [], minDisplayRows, keyId, noDataPlaceholder, className, renderRow, columns, isSelectable, onSelectRow, onRowEnter, onRowLeave, registerRowElement, unregisterRowElement, ...rowProps }) => {
+export const Body = ({ rows, selectedIds, rowsDisabled, getRowDisabled, minDisplayRows, keyId, noDataPlaceholder, className, renderRow, columns, isSelectable, onSelectRow, onRowEnter, onRowLeave, registerRowElement, unregisterRowElement, ...rowProps }) => {
     const { disableMinHeight, bodyCssVars } = useLogic({ minDisplayRows });
     const renderedRows = rows.map((row, index) => {
         const rowId = row[keyId];
-        const isSelected = Boolean(selectedRows?.find((selectedRow) => selectedRow[keyId] === rowId));
+        const isSelected = selectedIds.has(rowId);
+        const rowDisabled = rowsDisabled.get(rowId);
         const { children, options } = row;
-        return (_jsx(RowContextProvider, { row: row, onSelectRow: onSelectRow, onRowEnter: onRowEnter, onRowLeave: onRowLeave, registerRowElement: registerRowElement, unregisterRowElement: unregisterRowElement, isSelectable: isSelectable, isSelected: isSelected, children: renderRow ? (_jsx(CustomRowWrapper, { index: index, renderRow: renderRow, row: row })) : (_jsx(Row, { row: row, options: options, keyId: keyId, level: INITIAL_LEVEL, nestedChildren: children, isSelected: isSelected, columns: columns, isSelectable: isSelectable, onSelectRow: onSelectRow, onRowEnter: onRowEnter, onRowLeave: onRowLeave, registerRowElement: registerRowElement, unregisterRowElement: unregisterRowElement, ...rowProps }, rowId)) }, rowId));
+        const hasNestedChildren = Array.isArray(children) && children.length > 0;
+        return (_jsx(RowContextProvider, { row: row, onSelectRow: onSelectRow, onRowEnter: onRowEnter, onRowLeave: onRowLeave, registerRowElement: registerRowElement, unregisterRowElement: unregisterRowElement, isSelectable: isSelectable, isSelected: isSelected, disabledMode: rowDisabled?.mode, disabledReason: rowDisabled?.reason, children: renderRow ? (_jsx(CustomRowWrapper, { index: index, renderRow: renderRow, row: row })) : (_jsx(Row, { row: row, options: options, keyId: keyId, level: INITIAL_LEVEL, nestedChildren: children, isSelected: isSelected, 
+                // Функция нужна только для расчёта блокировки вложенных строк, остальным не передаём, чтобы не сбрасывать memo
+                getRowDisabled: hasNestedChildren ? getRowDisabled : undefined, columns: columns, isSelectable: isSelectable, onSelectRow: onSelectRow, onRowEnter: onRowEnter, onRowLeave: onRowLeave, registerRowElement: registerRowElement, unregisterRowElement: unregisterRowElement, ...rowProps }, rowId)) }, rowId));
     });
     return (_jsx(Wrapper, { className: cn(className, bodyCva({ disableMinHeight })), style: bodyCssVars, children: rows.length ? renderedRows : noDataPlaceholder }));
 };

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

@@ -1,6 +1,6 @@
 import { type ChangeEvent, type ReactNode } from 'react';
 import { type Variant } from '../enums';
-import { type CellValue, type DataGridColumns, type DataGridRowOptions } from '../types';
+import { type CellValue, type DataGridColumns, type DataGridProps, type DataGridRowDisabled, type DataGridRowOptions } from '../types';
 export type BodyProps<TData extends Record<string, CellValue>> = {
     /**
      * Конфигурация колонок для таблицы
@@ -46,9 +46,17 @@ export type BodyProps<TData extends Record<string, CellValue>> = {
      */
     isSelectable?: boolean;
     /**
-     * Массив выбранных строк
+     * Идентификаторы выбранных строк
      */
-    selectedRows?: TData[];
+    selectedIds: Set<unknown>;
+    /**
+     * Блокировки строк по идентификатору
+     */
+    rowsDisabled: Map<unknown, DataGridRowDisabled | undefined>;
+    /**
+     * Функция блокировки для вложенных строк
+     */
+    getRowDisabled?: DataGridProps<TData>['getRowDisabled'];
     /**
      * Массив данных для отображения
      */

package/components/DataGrid/DataGrid.js

@@ -15,7 +15,7 @@ import { Loader } from './Loader';
 import { MobileSkeleton } from './MobileSkeleton';
 import { NoData } from './NoData';
 import { PinnedSections } from './PinnedSections';
-import { Container, DataGridWrapper, DisabledDataGridWrapper } from './styles';
+import { Container, DataGridWrapper, DisabledDataGridWrapper, MassActionsAnchor, } from './styles';
 import { useLogic } from './useLogic';
 const pinnedSectionsCva = cva(dataGridClassnames.pinnedSections, {
     variants: {
@@ -26,6 +26,12 @@ const pinnedSectionsCva = cva(dataGridClassnames.pinnedSections, {
 });
 const dataGridCva = cva(dataGridClassnames.root, {
     variants: {
+        hasMassActions: {
+            true: dataGridClassnames.hasMassActions,
+        },
+        isMassActionsOpen: {
+            true: dataGridClassnames.massActionsOpen,
+        },
         hasPinnedColumns: {
             true: dataGridClassnames.hasPinnedSections,
         },
@@ -56,9 +62,9 @@ const bodyCva = cva(dataGridClassnames.body, {
     },
 });
 export const DataGrid = (props) => {
-    const { dataGridClassName, isDataGridDisabled, treeRenderConfig, headColumns, headProps, bodyProps, gridColumns, loaderProps, renderRows, isAllowHorizontalScroll, isHideHead, hasPinnedColumns, contentStateProps, rowHoverProps, containerRef, sections, isNoData, isMobile, mobileSkeletonProps, isLoading, containerCssVars, hasGroupedColumns, gridViewMode, mobileDisplayVariant, isSelfContained, } = useLogic(props);
+    const { dataGridClassName, isDataGridDisabled, treeRenderConfig, headColumns, headProps, bodyProps, gridColumns, loaderProps, renderRows, isAllowHorizontalScroll, isHideHead, hasPinnedColumns, contentStateProps, rowHoverProps, containerRef, sections, isNoData, isMobile, mobileSkeletonProps, isLoading, containerCssVars, hasGroupedColumns, gridViewMode, mobileDisplayVariant, isSelfContained, isMassActionsOpen, hasMassActions, } = useLogic(props);
     const { emptySymbol } = useContext(ConfigContext);
-    const { columns, selectedRows = [], minDisplayRows = MIN_DISPLAY_ROWS_BY_DEFAULT, variant = Variant.Tree, footer, noDataPlaceholder, subrows, keyId, activeRowId, emptyCellValue = emptySymbol, onRowClick, noDataOptions, headPreAddon, isTabularNums, renderRow, renderLink, } = props;
+    const { columns, selectedRows = [], onSelectRow, minDisplayRows = MIN_DISPLAY_ROWS_BY_DEFAULT, variant = Variant.Tree, footer, massActions, noDataPlaceholder, subrows, keyId, activeRowId, emptyCellValue = emptySymbol, onRowClick, noDataOptions, headPreAddon, isTabularNums, renderRow, renderLink, } = props;
     const { moreButtonColumnPosition = 1, isVisibleCollapseButton = true } = subrows || {};
     const { isInitialExpanded = false, expandedLevel = EXPANDED_LEVEL_BY_DEFAULT, initialVisibleChildrenCount = INITIAL_OPENED_NESTED_CHILDREN_COUNT_BY_DEFAULT, } = treeRenderConfig || {};
     const Wrapper = isDataGridDisabled
@@ -73,7 +79,6 @@ export const DataGrid = (props) => {
     const commonBodyProps = {
         ...bodyProps,
         keyId,
-        selectedRows,
         minDisplayRows,
         rows: renderRows,
         variant,
@@ -98,12 +103,14 @@ export const DataGrid = (props) => {
                     isDisabled: isDataGridDisabled,
                 }), isDisabled: isDataGridDisabled, headProps: headProps, gridColumns: gridColumns, bodyProps: commonBodyProps, isNoData: isNoData }) }));
     };
-    return (_jsx(DataGridContextProvider, { isLoading: isLoading, isTabularNums: isTabularNums, gridColumns: gridColumns, emptyCellValue: emptyCellValue, activeRowId: activeRowId, keyId: keyId, columns: columns, onRowClick: onRowClick, mobileDisplayVariant: mobileDisplayVariant, renderLink: renderLink, children: _jsxs(Container, { ref: containerRef, style: containerCssVars, className: cn(dataGridClassName, dataGridCva({
+    return (_jsx(DataGridContextProvider, { isLoading: isLoading, isTabularNums: isTabularNums, gridColumns: gridColumns, emptyCellValue: emptyCellValue, activeRowId: activeRowId, keyId: keyId, columns: columns, onRowClick: onRowClick, mobileDisplayVariant: mobileDisplayVariant, renderLink: renderLink, selectedRows: selectedRows, onSelectRow: onSelectRow, isMassActionsOpen: isMassActionsOpen, children: _jsxs(Container, { ref: containerRef, style: containerCssVars, className: cn(dataGridClassName, dataGridCva({
                 isAllowHorizontalScroll,
                 hasPinnedColumns,
                 gridViewMode,
                 hasGroupedColumns,
                 mobileDisplayVariant,
                 isSelfContained,
-            })), children: [renderTableContent(), _jsx(Loader, { ...loaderProps }), footer && footer] }) }));
+                hasMassActions,
+                isMassActionsOpen,
+            })), children: [renderTableContent(), _jsx(Loader, { ...loaderProps }), massActions && _jsx(MassActionsAnchor, { children: massActions }), footer && footer] }) }));
 };

package/components/DataGrid/DataGridContext/DataGridProvider/DataGridProvider.d.ts

@@ -1,7 +1,8 @@
 import { type ReactNode } from 'react';
+import { type DataGridSelectionContextProps } from '../../DataGridSelectionContext';
 import { type DataGridContextProps } from '../DataGridContext';
-type DataGridContextProviderProps = Pick<DataGridContextProps, 'isLoading' | 'isTabularNums' | 'gridColumns' | 'emptyCellValue' | 'activeRowId' | 'keyId' | 'columns' | 'onRowClick' | 'mobileDisplayVariant' | 'renderLink'> & {
+type DataGridContextProviderProps = Pick<DataGridContextProps, 'isLoading' | 'isTabularNums' | 'gridColumns' | 'emptyCellValue' | 'activeRowId' | 'keyId' | 'columns' | 'onRowClick' | 'mobileDisplayVariant' | 'renderLink'> & Partial<DataGridSelectionContextProps> & {
     children: ReactNode;
 };
-export declare const DataGridContextProvider: ({ isLoading, isTabularNums, gridColumns, emptyCellValue, activeRowId, children, keyId, columns, onRowClick, mobileDisplayVariant, renderLink, }: DataGridContextProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DataGridContextProvider: ({ isLoading, isTabularNums, gridColumns, emptyCellValue, activeRowId, children, keyId, columns, onRowClick, mobileDisplayVariant, renderLink, selectedRows, onSelectRow, isMassActionsOpen, }: DataGridContextProviderProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/components/DataGrid/DataGridContext/DataGridProvider/DataGridProvider.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo } from 'react';
+import { DataGridSelectionProvider, } from '../../DataGridSelectionContext';
 import { DataGridStorageProvider } from '../../DataGridStorageContext';
 import { DataGridContext } from '../DataGridContext';
-export const DataGridContextProvider = ({ isLoading, isTabularNums, gridColumns, emptyCellValue, activeRowId, children, keyId, columns, onRowClick, mobileDisplayVariant, renderLink, }) => {
+export const DataGridContextProvider = ({ isLoading, isTabularNums, gridColumns, emptyCellValue, activeRowId, children, keyId, columns, onRowClick, mobileDisplayVariant, renderLink, selectedRows, onSelectRow, isMassActionsOpen, }) => {
     const contextValue = useMemo(() => ({
         isLoading,
         isTabularNums,
@@ -26,5 +27,5 @@ export const DataGridContextProvider = ({ isLoading, isTabularNums, gridColumns,
         mobileDisplayVariant,
         renderLink,
     ]);
-    return (_jsx(DataGridContext.Provider, { value: contextValue, children: _jsx(DataGridStorageProvider, { children: children }) }));
+    return (_jsx(DataGridContext.Provider, { value: contextValue, children: _jsx(DataGridSelectionProvider, { selectedRows: selectedRows, onSelectRow: onSelectRow, isMassActionsOpen: isMassActionsOpen, children: _jsx(DataGridStorageProvider, { children: children }) }) }));
 };

package/components/DataGrid/DataGridSelectionContext/DataGridSelectionContext.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+import { type ContextOnChangeSelectedRows, type ContextSelectedRows } from '../types';
+export type DataGridSelectionContextProps = {
+    /**
+     * Выбранные строки таблицы
+     */
+    selectedRows: ContextSelectedRows;
+    /**
+     * Обработчик изменения выбора, переданный в таблицу.
+     */
+    onSelectRow?: ContextOnChangeSelectedRows;
+    /**
+     * Флаг отображения панели массовых действий
+     */
+    isMassActionsOpen: boolean;
+};
+/**
+ * Контекст выбранных строк таблицы для панели массовых действий.
+ *
+ * Вынесен из `DataGridContext`, чтобы изменение выбора не вызывало ре-рендер всех строк и ячеек:
+ * контекст читает только панель массовых действий.
+ *
+ * Провайдер подключается внутри `DataGridContextProvider`.
+ */
+export declare const DataGridSelectionContext: import("react").Context<DataGridSelectionContextProps>;

package/components/DataGrid/DataGridSelectionContext/DataGridSelectionContext.js

@@ -0,0 +1,13 @@
+import { createContext } from 'react';
+/**
+ * Контекст выбранных строк таблицы для панели массовых действий.
+ *
+ * Вынесен из `DataGridContext`, чтобы изменение выбора не вызывало ре-рендер всех строк и ячеек:
+ * контекст читает только панель массовых действий.
+ *
+ * Провайдер подключается внутри `DataGridContextProvider`.
+ */
+export const DataGridSelectionContext = createContext({
+    selectedRows: [],
+    isMassActionsOpen: false,
+});

package/components/DataGrid/DataGridSelectionContext/DataGridSelectionProvider/DataGridSelectionProvider.d.ts

@@ -0,0 +1,7 @@
+import { type ReactNode } from 'react';
+import { type DataGridSelectionContextProps } from '../DataGridSelectionContext';
+type DataGridSelectionProviderProps = Partial<DataGridSelectionContextProps> & {
+    children: ReactNode;
+};
+export declare const DataGridSelectionProvider: ({ selectedRows, onSelectRow, isMassActionsOpen, children, }: DataGridSelectionProviderProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/components/DataGrid/DataGridSelectionContext/DataGridSelectionProvider/DataGridSelectionProvider.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { DataGridSelectionContext, } from '../DataGridSelectionContext';
+const EMPTY_SELECTED_ROWS = [];
+export const DataGridSelectionProvider = ({ selectedRows = EMPTY_SELECTED_ROWS, onSelectRow, isMassActionsOpen = false, children, }) => {
+    const contextValue = useMemo(() => ({ selectedRows, onSelectRow, isMassActionsOpen }), [selectedRows, onSelectRow, isMassActionsOpen]);
+    return (_jsx(DataGridSelectionContext.Provider, { value: contextValue, children: children }));
+};

package/components/DataGrid/DataGridSelectionContext/DataGridSelectionProvider/index.d.ts

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

package/components/DataGrid/DataGridSelectionContext/DataGridSelectionProvider/index.js

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

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

@@ -0,0 +1,2 @@
+export * from './DataGridSelectionContext';
+export * from './DataGridSelectionProvider';

package/components/DataGrid/DataGridSelectionContext/index.js

@@ -0,0 +1,2 @@
+export * from './DataGridSelectionContext';
+export * from './DataGridSelectionProvider';

package/components/DataGrid/PinnedSections/PinnedSections.js

@@ -4,8 +4,8 @@ import { Section } from './Section';
 import { PinnedColumnsContainer } from './styles';
 import { useLogic } from './useLogic';
 export const PinnedSections = ({ gridColumns, className, isDisabled, headProps, bodyProps, sections, isNoData, }) => {
-    const { pinnedContainerStyles, sectionOffsets } = useLogic({ sections });
+    const { pinnedContainerStyles, sectionOffsets, totalColumnsCount } = useLogic({ sections });
     return (_jsx(PinnedColumnsContainer, { "$gridColumns": gridColumns, className: className, ...getInertProps(isDisabled), style: pinnedContainerStyles, children: sections.map(({ columns, position }) => {
-            return (_jsx(Section, { columns: columns, position: position, sectionOffset: sectionOffsets[position], bodyProps: bodyProps, headProps: headProps, isNoData: isNoData }, position));
+            return (_jsx(Section, { columns: columns, position: position, sectionOffset: sectionOffsets[position], bodyProps: { ...bodyProps, totalColumnsCount }, headProps: headProps, isNoData: isNoData }, position));
         }) }));
 };

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

@@ -5,5 +5,6 @@ type UseLogicParams<TData extends Record<string, CellValue> = DataGridRow> = Pic
 export declare const useLogic: <TData extends Record<string, unknown> = DataGridRow>({ sections, }: UseLogicParams<TData>) => {
     pinnedContainerStyles: CSSProperties;
     sectionOffsets: Record<string, number>;
+    totalColumnsCount: number;
 };
 export {};

package/components/DataGrid/PinnedSections/useLogic/useLogic.js

@@ -11,14 +11,15 @@ export const useLogic = ({ sections, }) => {
             ? getFlattenColumns(rightColumns).length
             : 0,
     };
-    const sectionOffsets = useMemo(() => {
+    // Строка в секции видит только свои колонки, поэтому для поиска последней ячейки таблицы ей передаётся общее число колонок всех секций
+    const { sectionOffsets, totalColumnsCount } = useMemo(() => {
         const offsets = {};
         let currentOffset = 0;
         sections.forEach((section) => {
             offsets[section.position] = currentOffset;
             currentOffset += getFlattenColumns(section.columns).length;
         });
-        return offsets;
+        return { sectionOffsets: offsets, totalColumnsCount: currentOffset };
     }, [sections]);
-    return { pinnedContainerStyles, sectionOffsets };
+    return { pinnedContainerStyles, sectionOffsets, totalColumnsCount };
 };

package/components/DataGrid/Row/Row.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment, memo, useCallback } from 'react';
 import { BottomDrawer } from '../../BottomDrawer';
-import { Checkbox } from '../../Checkbox';
 import { Tooltip } from '../../Tooltip';
 import { cn } from '../../utils/cn';
 import { cva } from '../../utils/cva';
 import { getInertProps } from '../../utils/getInertProps';
 import { dataGridCellClassnames } from '../Cell';
+import { RowCheckbox } from '../RowCheckbox';
 import { isGroupColumns } from '../utils';
 import { DISABLE_ROW_ATTR, dataGridGroupedColumnLabelClassnames, dataGridRowCellClassnames, dataGridRowClassnames, dataGridRowContentClassnames, } from './constants';
 import { NestedChildren } from './NestedChildren';
@@ -57,17 +57,17 @@ const singleCellCva = cva(dataGridRowCellClassnames.single, {
  * который позволяет полностью контролировать рендер каждой строки.
  */
 const RowInner = (props) => {
-    const { isOpen, isShowConnector, childrenColumns, rowId, handleToggle, checkboxProps, rowProps, isHovered, tooltipProps, nestedChildrenProps, disabled, isRenderCollapseButton, rowRef, rowStyles, drawerProps, disabledReasonText, isActive, isSelectable, mobileDisplayVariant, rootRowElement, rootRowRef, } = useLogic(props);
-    const { className, row, options, variant, gridColumns, isInitialExpanded, expandedLevel, level, nestedChildren, initialVisibleChildrenCount, moreButtonColumnPosition, isVisibleCollapseButton, columns, emptyCellValue, activeRowId, keyId, onSelectRow, onRowClick, sectionOffset, totalColumnsCount, registerRowElement, unregisterRowElement, onRowEnter, onRowLeave, style, 
+    const { isOpen, isShowConnector, childrenColumns, rowId, handleToggle, checkboxProps, rowProps, isHovered, tooltipProps, nestedChildrenProps, isDisabled, isDisabledLastCell, isRenderCollapseButton, rowRef, rowStyles, drawerProps, disabledReason, isActive, isSelectable, mobileDisplayVariant, rootRowElement, rootRowRef, } = useLogic(props);
+    const { className, row, options, variant, gridColumns, isInitialExpanded, expandedLevel, level, nestedChildren, initialVisibleChildrenCount, moreButtonColumnPosition, isVisibleCollapseButton, columns, emptyCellValue, activeRowId, keyId, onSelectRow, onRowClick, sectionOffset, totalColumnsCount, registerRowElement, unregisterRowElement, onRowEnter, onRowLeave, style, getRowDisabled, isNested, 
     // В этот rest-оператор попадают специфичные пропсы (атрибуты) virtuoso
     // Необходимы для DataGridInfinite
     ...selfProps } = props;
-    const { isDisabledLastCell = true, isNotSelectable, href, target, } = options || {};
+    const { isNotSelectable, href, target } = options || {};
     const renderStartAdornment = () => {
         if (!isRenderCollapseButton && (!isSelectable || isNotSelectable)) {
             return null;
         }
-        return (_jsxs(_Fragment, { children: [isRenderCollapseButton && (_jsx(CollapseCell, { children: _jsx(CollapseButton, { variant: "text", onClick: handleToggle, children: _jsx(ChevronIcon, { "$isActive": isOpen }) }) })), isSelectable && !isNotSelectable && (_jsx(CheckboxCell, { ...getInertProps(disabled), onClick: (event) => event.stopPropagation(), className: dataGridRowClassnames.checkbox, children: _jsx(Checkbox, { ...checkboxProps }) }))] }));
+        return (_jsxs(_Fragment, { children: [isRenderCollapseButton && (_jsx(CollapseCell, { children: _jsx(CollapseButton, { variant: "text", onClick: handleToggle, children: _jsx(ChevronIcon, { "$isActive": isOpen }) }) })), isSelectable && !isNotSelectable && (_jsx(CheckboxCell, { ...getInertProps(isDisabled), onClick: (event) => event.stopPropagation(), className: dataGridRowClassnames.checkbox, children: _jsx(RowCheckbox, { ...checkboxProps }) }))] }));
     };
     const renderCells = useCallback(() => {
         const lastCellGlobalIndex = (totalColumnsCount ?? columns.length) - 1;
@@ -77,7 +77,7 @@ const RowInner = (props) => {
         return columns?.map((cell, index) => {
             const cellId = `${rowId}-${index}`;
             const globalIndex = (sectionOffset ?? 0) + index;
-            const isDisabledCell = checkIsDisabled(disabled, availableCellsByIndex, globalIndex);
+            const isDisabledCell = checkIsDisabled(isDisabled, availableCellsByIndex, globalIndex);
             const isFirstCell = globalIndex === 0;
             if (isGroupColumns(cell)) {
                 const { label, children, hideTitleOnMobile, isHideOnMobile } = cell;
@@ -95,13 +95,16 @@ const RowInner = (props) => {
         row,
         isOpen,
         columns,
-        disabled,
+        isDisabled,
+        isDisabledLastCell,
         checkboxProps.checked,
+        checkboxProps.disabled,
+        checkboxProps.disabledReason,
         totalColumnsCount,
         sectionOffset,
         rootRowElement,
     ]);
-    const renderRow = useCallback(({ key, ...nestedRowProps }) => (_jsx(RowInner, { keyId: keyId, ...nestedRowProps, variant: variant, isSelectable: isSelectable, gridColumns: gridColumns, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, initialVisibleChildrenCount: initialVisibleChildrenCount, moreButtonColumnPosition: moreButtonColumnPosition, isVisibleCollapseButton: isVisibleCollapseButton, activeRowId: activeRowId, columns: childrenColumns, onSelectRow: onSelectRow, onRowClick: onRowClick, totalColumnsCount: totalColumnsCount, registerRowElement: registerRowElement, unregisterRowElement: unregisterRowElement, onRowEnter: onRowEnter, onRowLeave: onRowLeave, sectionOffset: sectionOffset }, key)), [
+    const renderRow = useCallback(({ key, ...nestedRowProps }) => (_jsx(RowInner, { keyId: keyId, ...nestedRowProps, variant: variant, isSelectable: isSelectable, gridColumns: gridColumns, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, initialVisibleChildrenCount: initialVisibleChildrenCount, moreButtonColumnPosition: moreButtonColumnPosition, isVisibleCollapseButton: isVisibleCollapseButton, activeRowId: activeRowId, columns: childrenColumns, onSelectRow: onSelectRow, onRowClick: onRowClick, totalColumnsCount: totalColumnsCount, registerRowElement: registerRowElement, unregisterRowElement: unregisterRowElement, onRowEnter: onRowEnter, onRowLeave: onRowLeave, sectionOffset: sectionOffset, getRowDisabled: getRowDisabled, isNested: true }, key)), [
         keyId,
         variant,
         isSelectable,
@@ -120,11 +123,12 @@ const RowInner = (props) => {
         unregisterRowElement,
         onRowEnter,
         onRowLeave,
+        getRowDisabled,
     ]);
     return (_jsxs(Wrapper, { className: cn(className, rootCva({
             isShowConnector,
             mobileDisplayVariant,
             hasNestedChildren: Boolean(nestedChildren?.length),
-        })), style: rowStyles, ...selfProps, ref: rootRowRef, children: [_jsx(Tooltip, { followCursor: true, arrow: false, ...tooltipProps, children: _jsx(ContentWrapper, { "data-row-id": rowId, ref: rowRef, onPointerEnter: () => onRowEnter?.(rowId), onPointerLeave: (event) => onRowLeave?.(rowId, event.nativeEvent), className: rowContentCva({ isHovered, isActive }), "$gridColumns": gridColumns, [DISABLE_ROW_ATTR]: disabled, ...rowProps, children: renderCells() }) }), _jsx(NestedChildren, { ...nestedChildrenProps, data: nestedChildren, keyId: keyId, level: level, variant: variant, gridColumns: gridColumns, initialVisibleChildrenCount: initialVisibleChildrenCount, moreButtonColumnPosition: moreButtonColumnPosition, renderRow: renderRow }), _jsx(BottomDrawer, { ...drawerProps, children: _jsx(BottomDrawerContent, { children: disabledReasonText }) })] }, `row-${rowId}`));
+        })), style: rowStyles, ...selfProps, ref: rootRowRef, children: [_jsx(Tooltip, { followCursor: true, arrow: false, ...tooltipProps, children: _jsx(ContentWrapper, { "data-row-id": rowId, ref: rowRef, onPointerEnter: () => onRowEnter?.(rowId), onPointerLeave: (event) => onRowLeave?.(rowId, event.nativeEvent), className: rowContentCva({ isHovered, isActive }), "$gridColumns": gridColumns, [DISABLE_ROW_ATTR]: isDisabled, ...rowProps, children: renderCells() }) }), _jsx(NestedChildren, { ...nestedChildrenProps, data: nestedChildren, keyId: keyId, level: level, variant: variant, gridColumns: gridColumns, initialVisibleChildrenCount: initialVisibleChildrenCount, moreButtonColumnPosition: moreButtonColumnPosition, renderRow: renderRow }), _jsx(BottomDrawer, { ...drawerProps, children: _jsx(BottomDrawerContent, { children: disabledReason }) })] }, `row-${rowId}`));
 };
 export const Row = memo(RowInner);

package/components/DataGrid/Row/RowContext/RowContext.d.ts

@@ -1,10 +1,17 @@
 import { type ChangeEvent } from 'react';
+import { type DataGridRowDisabled } from '../../types';
 export type RowContextProps = {
-    isDisabled: boolean;
+    /**
+     * Если true, в строке выполняется блокирующее действие DataGridActionCell
+     */
+    hasBlockingAction: boolean;
+    /**
+     * Причина блокировки от блокирующего действия
+     */
+    blockingActionReason?: string;
+    addBlockingAction: (reason?: string) => void;
+    removeBlockingAction: () => void;
     isSelectable?: boolean;
-    disabledReason?: string;
-    addDisabledRow: (disabledReason?: string) => void;
-    removeDisabledRow: () => void;
     row: Record<string, unknown>;
     onSelectRow: (row: Record<string, unknown>) => (event: ChangeEvent<HTMLInputElement>) => void;
     onRowEnter?: (rowId: string) => void;
@@ -13,5 +20,9 @@ export type RowContextProps = {
     unregisterRowElement?: (rowId: string, el: HTMLElement) => void;
     itemProps?: object;
     isSelected?: boolean;
+    /**
+     * Итоговая блокировка строки, рассчитанная resolveRowDisabled
+     */
+    rowDisabled?: DataGridRowDisabled;
 };
 export declare const RowContext: import("react").Context<RowContextProps>;

package/components/DataGrid/Row/RowContext/RowContext.js

@@ -1,9 +1,9 @@
 import { createContext } from 'react';
 export const RowContext = createContext({
-    isDisabled: false,
+    hasBlockingAction: false,
     isSelectable: false,
-    addDisabledRow: () => undefined,
-    removeDisabledRow: () => undefined,
+    addBlockingAction: () => undefined,
+    removeBlockingAction: () => undefined,
     row: {},
     onSelectRow: () => () => undefined,
     onRowEnter: () => undefined,

package/components/DataGrid/Row/RowContext/RowProvider/RowProvider.d.ts

@@ -1,7 +1,16 @@
 import { type ReactNode } from 'react';
+import { type DataGridRowDisabled } from '../../../types';
 import { type RowContextProps } from '../RowContext';
 type RowContextProviderProps = Pick<RowContextProps, 'row' | 'itemProps' | 'onSelectRow' | 'onRowEnter' | 'onRowLeave' | 'registerRowElement' | 'unregisterRowElement' | 'isSelectable' | 'isSelected'> & {
+    /**
+     * Режим блокировки строки
+     */
+    disabledMode?: DataGridRowDisabled['mode'];
+    /**
+     * Причина блокировки строки
+     */
+    disabledReason?: string;
     children: ReactNode;
 };
-export declare const RowContextProvider: ({ row, itemProps, onSelectRow, onRowEnter, onRowLeave, registerRowElement, unregisterRowElement, children, isSelectable, isSelected, }: RowContextProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RowContextProvider: ({ row, itemProps, onSelectRow, onRowEnter, onRowLeave, registerRowElement, unregisterRowElement, children, isSelectable, isSelected, disabledMode, disabledReason, }: RowContextProviderProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/components/DataGrid/Row/RowContext/RowProvider/RowProvider.js

@@ -1,23 +1,27 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback, useMemo, useState } from 'react';
 import { RowContext } from '../RowContext';
-export const RowContextProvider = ({ row, itemProps, onSelectRow, onRowEnter, onRowLeave, registerRowElement, unregisterRowElement, children, isSelectable, isSelected, }) => {
-    const [isDisabled, setDisabled] = useState(false);
-    const [disabledReason, setDisabledReason] = useState();
-    const addDisabledRow = useCallback((reason) => {
-        setDisabled(true);
-        setDisabledReason(reason);
+export const RowContextProvider = ({ row, itemProps, onSelectRow, onRowEnter, onRowLeave, registerRowElement, unregisterRowElement, children, isSelectable, isSelected, disabledMode, disabledReason, }) => {
+    const [hasBlockingAction, setHasBlockingAction] = useState(false);
+    const [blockingActionReason, setBlockingActionReason] = useState();
+    const addBlockingAction = useCallback((reason) => {
+        setHasBlockingAction(true);
+        setBlockingActionReason(reason);
     }, []);
-    const removeDisabledRow = useCallback(() => {
-        setDisabled(false);
-        setDisabledReason(undefined);
+    const removeBlockingAction = useCallback(() => {
+        setHasBlockingAction(false);
+        setBlockingActionReason(undefined);
     }, []);
+    // Блокировка приходит примитивами, чтобы новый объект с тем же содержимым не обновлял контекст
+    const rowDisabled = useMemo(() => disabledMode
+        ? { mode: disabledMode, reason: disabledReason ?? '' }
+        : undefined, [disabledMode, disabledReason]);
     const contextValue = useMemo(() => ({
-        isDisabled,
+        hasBlockingAction,
+        blockingActionReason,
+        addBlockingAction,
+        removeBlockingAction,
         isSelectable,
-        disabledReason,
-        addDisabledRow,
-        removeDisabledRow,
         row,
         itemProps,
         onSelectRow,
@@ -26,12 +30,13 @@ export const RowContextProvider = ({ row, itemProps, onSelectRow, onRowEnter, on
         registerRowElement,
         unregisterRowElement,
         isSelected,
+        rowDisabled,
     }), [
-        isDisabled,
+        hasBlockingAction,
+        blockingActionReason,
+        addBlockingAction,
+        removeBlockingAction,
         isSelectable,
-        disabledReason,
-        addDisabledRow,
-        removeDisabledRow,
         row,
         itemProps,
         onSelectRow,
@@ -40,6 +45,7 @@ export const RowContextProvider = ({ row, itemProps, onSelectRow, onRowEnter, on
         registerRowElement,
         unregisterRowElement,
         isSelected,
+        rowDisabled,
     ]);
     return (_jsx(RowContext.Provider, { value: contextValue, children: children }));
 };

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

@@ -1,6 +1,6 @@
 import { type ChangeEvent, type CSSProperties, type ReactNode } from 'react';
 import { type Variant } from '../enums';
-import { type CellValue, type DataGridColumns, type DataGridRowOptions } from '../types';
+import { type CellValue, type DataGridColumns, type DataGridProps, type DataGridRowOptions } from '../types';
 export type RowProps<TData extends Record<string, CellValue>> = {
     /**
      * Название класса, применяется к корневому компоненту
@@ -71,9 +71,13 @@ export type RowProps<TData extends Record<string, CellValue>> = {
      */
     isSelected?: boolean;
     /**
-     * Массив выбранных строк
+     * Если true, строка вложенная и сама вычисляет блокировку
      */
-    selectedRows?: TData[];
+    isNested?: boolean;
+    /**
+     * Функция блокировки для вложенных строк. Передаётся только строкам с дочерними элементами
+     */
+    getRowDisabled?: DataGridProps<TData>['getRowDisabled'];
     /**
      * Заглушка для пустых ячеек (если отсутствует field и filter и renderCell)
      * @default '-'

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

@@ -2,8 +2,8 @@ import { type MouseEvent, type SyntheticEvent } from 'react';
 import type { CellValue } from '../../types';
 import type { RowProps } from '../types';
 type UseLogicParams<TData extends Record<string, CellValue>> = RowProps<TData>;
-export declare const useLogic: <TData extends Record<string, unknown>>({ keyId, columns, row, nestedChildren, level, variant, options, isInitialExpanded, expandedLevel, isSelectable, isSelected, onSelectRow, onRowClick, isVisibleCollapseButton, registerRowElement, unregisterRowElement, style, activeRowId, }: UseLogicParams<TData>) => {
-    disabledReasonText: string | undefined;
+export declare const useLogic: <TData extends Record<string, unknown>>({ keyId, columns, row, nestedChildren, level, variant, options, isInitialExpanded, expandedLevel, isSelectable, isSelected, getRowDisabled, isNested, onSelectRow, onRowClick, isVisibleCollapseButton, registerRowElement, unregisterRowElement, style, activeRowId, }: UseLogicParams<TData>) => {
+    disabledReason: string | undefined;
     rowStyles: {
         accentColor?: import("csstype").Property.AccentColor | undefined;
         alignContent?: import("csstype").Property.AlignContent | undefined;
@@ -869,7 +869,8 @@ export declare const useLogic: <TData extends Record<string, unknown>>({ keyId,
     childrenColumns: any[];
     rowId: string;
     rowRef: (element: HTMLElement | null) => void;
-    disabled: boolean | undefined;
+    isDisabled: boolean;
+    isDisabledLastCell: boolean;
     isSelectable: boolean | undefined;
     isRenderCollapseButton: boolean;
     handleToggle: (event: MouseEvent<HTMLButtonElement>) => void;
@@ -895,7 +896,8 @@ export declare const useLogic: <TData extends Record<string, unknown>>({ keyId,
     };
     checkboxProps: {
         checked: boolean | undefined;
-        disabled: boolean | undefined;
+        disabled: boolean;
+        disabledReason: string | undefined;
         onChange: (event: import("react").ChangeEvent<HTMLInputElement, Element>) => void;
     };
     nestedChildrenProps: {