@astral/ui 4.74.0 → 4.76.0

package/node/components/DataGridCollapsibleRow/DataGridCollapsibleRow.d.ts

@@ -0,0 +1,2 @@
+import type { DataGridCollapsibleRowProps } from './types';
+export declare const DataGridCollapsibleRow: ({ children, initialOpen, onOpen, onClose, }: DataGridCollapsibleRowProps) => import("react/jsx-runtime").JSX.Element;

package/node/components/DataGridCollapsibleRow/DataGridCollapsibleRow.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridCollapsibleRow = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const Button_1 = require("../Button");
+const Collapse_1 = require("../Collapse");
+const cva_1 = require("../utils/cva");
+const constants_1 = require("./constants");
+const styles_1 = require("./styles");
+const useLogic_1 = require("./useLogic");
+const chevronIconCva = (0, cva_1.cva)(constants_1.collapsibleRowClassnames.chevronIcon, {
+    variants: {
+        isActive: {
+            true: constants_1.collapsibleRowClassnames.chevronIconActive,
+        },
+    },
+});
+const DataGridCollapsibleRow = ({ children, initialOpen, onOpen, onClose, }) => {
+    const { handleToggle, isOpen, rowBaseProps, itemProps, handleRowClick } = (0, useLogic_1.useLogic)({
+        initialOpen,
+        onOpen,
+        onClose,
+    });
+    const renderStartAdornment = (0, react_1.useCallback)((isFirstCell) => {
+        if (!isFirstCell) {
+            return null;
+        }
+        return ((0, jsx_runtime_1.jsx)(styles_1.CollapseCell, { children: (0, jsx_runtime_1.jsx)(styles_1.CollapseButton, { variant: "text", onClick: handleToggle, title: isOpen ? 'Свернуть' : 'Развернуть', children: (0, jsx_runtime_1.jsx)(styles_1.ChevronIcon, { className: chevronIconCva({ isActive: isOpen }) }) }) }));
+    }, [isOpen, handleToggle]);
+    return ((0, jsx_runtime_1.jsx)(styles_1.StyledRowBase, { ...rowBaseProps, renderStartAdornment: renderStartAdornment, onRowClick: handleRowClick, customContent: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(styles_1.MobileExpandButtonWrapper, { children: (0, jsx_runtime_1.jsxs)(Button_1.Button, { variant: "link", onClick: handleToggle, className: constants_1.collapsibleRowClassnames.collapseButton, children: [(0, jsx_runtime_1.jsx)(styles_1.ChevronIcon, { className: chevronIconCva({ isActive: isOpen }) }), isOpen ? 'Свернуть' : 'Развернуть'] }) }), (0, jsx_runtime_1.jsx)(Collapse_1.Collapse, { in: isOpen, unmountOnExit: true, children: (0, jsx_runtime_1.jsx)(styles_1.CollapseContainer, { className: constants_1.collapsibleRowClassnames.collapseContainer, children: (0, jsx_runtime_1.jsx)(styles_1.CollapseContent, { children: (0, jsx_runtime_1.jsx)(styles_1.ChildrenWrapper, { className: constants_1.collapsibleRowClassnames.collapsibleContent, children: children }) }) }) })] }), ...itemProps }));
+};
+exports.DataGridCollapsibleRow = DataGridCollapsibleRow;

package/node/components/DataGridCollapsibleRow/constants.d.ts

@@ -0,0 +1,11 @@
+export declare const STORAGE_KEY_PREFIX = "collapsible-row";
+export declare const collapsibleRowClassnames: {
+    root: string;
+    cellsWrapper: string;
+    active: string;
+    collapseContainer: string;
+    chevronIcon: string;
+    chevronIconActive: string;
+    collapseButton: string;
+    collapsibleContent: string;
+};

package/node/components/DataGridCollapsibleRow/constants.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.collapsibleRowClassnames = exports.STORAGE_KEY_PREFIX = void 0;
+const createUIKitClassname_1 = require("../utils/createUIKitClassname");
+exports.STORAGE_KEY_PREFIX = 'collapsible-row';
+exports.collapsibleRowClassnames = {
+    root: (0, createUIKitClassname_1.createUIKitClassname)('data-grid__collapsible-row'),
+    cellsWrapper: (0, createUIKitClassname_1.createUIKitClassname)('data-grid__collapsible-row_cells-wrapper'),
+    active: (0, createUIKitClassname_1.createUIKitClassname)('data-grid__collapsible-row_active'),
+    collapseContainer: (0, createUIKitClassname_1.createUIKitClassname)('data-grid__collapsible-row_collapse-container'),
+    chevronIcon: (0, createUIKitClassname_1.createUIKitClassname)('data-grid__collapsible-row_chevron-icon'),
+    chevronIconActive: (0, createUIKitClassname_1.createUIKitClassname)('data-grid__collapsible-row__chevron-icon_active'),
+    collapseButton: (0, createUIKitClassname_1.createUIKitClassname)('data-grid__collapsible-row__collapse-button'),
+    collapsibleContent: (0, createUIKitClassname_1.createUIKitClassname)('data-grid__collapsible-row__collapsible-content'),
+};

package/node/components/DataGridCollapsibleRow/index.d.ts

@@ -0,0 +1,2 @@
+export { DataGridCollapsibleRow } from './DataGridCollapsibleRow';
+export type { DataGridCollapsibleRowProps } from './types';

package/node/components/DataGridCollapsibleRow/index.js

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

package/node/components/DataGridCollapsibleRow/public.d.ts

@@ -0,0 +1,2 @@
+export { DataGridCollapsibleRow } from './DataGridCollapsibleRow';
+export type { DataGridCollapsibleRowProps } from './types';

package/node/components/DataGridCollapsibleRow/public.js

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

package/node/components/DataGridCollapsibleRow/styles.d.ts

@@ -0,0 +1,42 @@
+/// <reference types="react" />
+export declare const CollapseContainer: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CollapseContent: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ChildrenWrapper: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const MobileExpandButtonWrapper: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CollapseButton: import("@emotion/styled/dist/declarations/src/types").StyledComponent<Omit<import("..").WithoutEmotionSpecific<import("@mui/material").ButtonProps>, "color" | "component" | "size" | "variant" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple"> & {
+    variant?: "light" | "link" | "text" | "contained" | "outlined" | undefined;
+    loading?: boolean | undefined;
+    color?: "primary" | "success" | "warning" | "error" | "grey" | undefined;
+    component?: import("react").ElementType | undefined;
+    selected?: boolean | undefined;
+    size?: "large" | "medium" | undefined;
+} & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, ""> & import("react").RefAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const CollapseCell: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ChevronIcon: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
+    children?: import("react").ReactNode;
+    color?: string | undefined;
+    titleAccess?: string | undefined;
+    size?: "sm" | "md" | undefined;
+} & import("react").SVGProps<SVGSVGElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const StyledRowBase: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("../DataGrid/RowBase").RowBaseProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;

package/node/components/DataGridCollapsibleRow/styles.js

@@ -0,0 +1,102 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledRowBase = exports.ChevronIcon = exports.CollapseCell = exports.CollapseButton = exports.MobileExpandButtonWrapper = exports.ChildrenWrapper = exports.CollapseContent = exports.CollapseContainer = void 0;
+const ChevronROutlineMd_1 = require("../../icons/ChevronROutlineMd");
+const Button_1 = require("../Button");
+const constants_1 = require("../DataGrid/constants");
+const RowBase_1 = require("../DataGrid/RowBase");
+const IconButton_1 = require("../IconButton");
+const styled_1 = require("../styled");
+const constants_2 = require("./constants");
+exports.CollapseContainer = styled_1.styled.div `
+  width: 100%;
+  margin-bottom: ${({ theme }) => theme.spacing(4)};
+`;
+exports.CollapseContent = styled_1.styled.div `
+  padding: ${({ theme }) => theme.spacing(2)};
+
+  background-color: ${({ theme }) => theme.palette.grey[100]};
+  border-radius: ${({ theme }) => theme.shape.large};
+`;
+exports.ChildrenWrapper = styled_1.styled.div `
+  padding: ${({ theme }) => theme.spacing(0, 3)};
+
+  background-color: ${({ theme }) => theme.palette.background.paper};
+  border-radius: ${({ theme }) => theme.shape.medium};
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    padding: ${({ theme }) => theme.spacing(2)};
+  }
+`;
+exports.MobileExpandButtonWrapper = styled_1.styled.div `
+  display: none;
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: flex;
+
+    & .${Button_1.buttonClassnames.root} {
+      justify-content: flex-start;
+
+      width: 100%;
+    }
+  }
+`;
+exports.CollapseButton = (0, styled_1.styled)(IconButton_1.IconButton) `
+  width: 24px;
+  height: 24px;
+
+  color: inherit;
+
+  &:hover {
+    background-color: ${({ theme }) => theme.palette.grey[300]};
+  }
+`;
+exports.CollapseCell = styled_1.styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  width: ${constants_1.ROOT_ACTION_CELL_WIDTH}px;
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: none;
+  }
+`;
+exports.ChevronIcon = (0, styled_1.styled)(ChevronROutlineMd_1.ChevronROutlineMd) `
+  transform: rotateZ(0deg);
+
+  transition: ${({ theme }) => theme.transitions.create('transform', {
+    easing: theme.transitions.easing.sharp,
+    duration: theme.transitions.duration.short,
+})};
+
+  &.${constants_2.collapsibleRowClassnames.chevronIconActive} {
+    transform: rotateZ(90deg);
+  }
+`;
+exports.StyledRowBase = (0, styled_1.styled)(RowBase_1.RowBase) `
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    &.${RowBase_1.dataGridRowBaseClassnames.mobileVariantCards} {
+      padding: 0;
+
+      background-color: ${({ theme }) => theme.palette.grey[100]};
+      border-bottom: 1px solid ${({ theme }) => theme.palette.grey[300]};
+
+      & .${RowBase_1.dataGridRowBaseClassnames.contentWrapper} {
+        padding: ${({ theme }) => theme.spacing(5, 4, 4)};
+
+        background-color: ${({ theme }) => theme.palette.background.default};
+        border-radius: ${({ theme }) => theme.shape.medium};
+        outline: 1px solid ${({ theme }) => theme.palette.grey[300]};
+      }
+
+      & .${constants_2.collapsibleRowClassnames.collapseButton} {
+        padding-left: ${({ theme }) => theme.spacing(4)};
+      }
+
+      & .${constants_2.collapsibleRowClassnames.collapsibleContent} {
+        background-color: transparent;
+      }
+    }
+  }
+`;

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

@@ -0,0 +1,19 @@
+import { type ReactNode } from 'react';
+export type DataGridCollapsibleRowProps = {
+    /**
+     * Контент, который будет отображаться при развернутом состоянии
+     */
+    children: ReactNode;
+    /**
+     * Функция, которая будет вызываться при развернутом состоянии
+     */
+    onOpen?: () => void;
+    /**
+     * Функция, которая будет вызываться при свернутом состоянии
+     */
+    onClose?: () => void;
+    /**
+     * Флаг начального раскрытия строки при монтировании
+     */
+    initialOpen?: boolean;
+};

package/node/components/DataGridCollapsibleRow/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/node/components/DataGridCollapsibleRow/useLogic/index.d.ts

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

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

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

@@ -0,0 +1,29 @@
+import { type SyntheticEvent } from 'react';
+import type { DataGridCollapsibleRowProps } from '../types';
+type UseLogicParams = Pick<DataGridCollapsibleRowProps, 'initialOpen' | 'onOpen' | 'onClose'>;
+export declare const useLogic: ({ initialOpen, onOpen, onClose }: UseLogicParams) => {
+    handleToggle: (event?: SyntheticEvent) => void;
+    handleRowClick: (clickedRow: Record<string, unknown>) => void;
+    isOpen: boolean | undefined;
+    itemProps: object | undefined;
+    rowBaseProps: {
+        isSelected: boolean | undefined;
+        row: Record<string, unknown>;
+        keyId: unknown;
+        columns: import("../..").DataGridColumns<Record<string, unknown>>[];
+        rowId: string;
+        isDisabled: boolean;
+        disabledReason: string | undefined;
+        onSelectRow: (row: Record<string, unknown>) => (event: import("react").ChangeEvent<HTMLInputElement, Element>) => void;
+        onRowEnter: ((rowId: string) => void) | undefined;
+        onRowLeave: ((rowId: string, event: PointerEvent) => void) | undefined;
+        registerRowElement: ((rowId: string, el: HTMLElement) => void) | undefined;
+        unregisterRowElement: ((rowId: string, el: HTMLElement) => void) | undefined;
+        isSelectable: boolean | undefined;
+        emptyCellValue: import("react").ReactNode;
+        gridColumns: string;
+        activeRowId: string | undefined;
+        mobileDisplayVariant: "list" | "cards" | undefined;
+    };
+};
+export {};

package/node/components/DataGridCollapsibleRow/useLogic/useLogic.js

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLogic = void 0;
+const react_1 = require("react");
+const DataGridContext_1 = require("../../DataGrid/DataGridContext");
+const DataGridStorageContext_1 = require("../../DataGrid/DataGridStorageContext");
+const RowContext_1 = require("../../DataGrid/Row/RowContext");
+const constants_1 = require("../constants");
+const useLogic = ({ initialOpen, onOpen, onClose }) => {
+    const { keyId, columns, gridColumns, activeRowId, emptyCellValue, onRowClick, mobileDisplayVariant, } = (0, react_1.useContext)(DataGridContext_1.DataGridContext);
+    const { row, onSelectRow, isDisabled, disabledReason, onRowEnter, onRowLeave, registerRowElement, unregisterRowElement, isSelectable, itemProps, isSelected, } = (0, react_1.useContext)(RowContext_1.RowContext);
+    const rowId = row[keyId];
+    /**
+     * Используется локальное хранилище DataGridStorageContext. Для сохранения состояния раскрытия строки на время жизни DataGrid.
+     */
+    const { getItem, setItem } = (0, react_1.useContext)(DataGridStorageContext_1.DataGridStorageContext);
+    const storageKey = `${constants_1.STORAGE_KEY_PREFIX}:${rowId}`;
+    const storedValue = getItem(storageKey);
+    const [isOpen, setIsOpen] = (0, react_1.useState)(storedValue !== undefined ? storedValue : initialOpen);
+    const handleToggle = (0, react_1.useCallback)((event) => {
+        event?.stopPropagation();
+        if (isOpen) {
+            setIsOpen(false);
+            setItem(storageKey, false);
+            onClose?.();
+        }
+        else {
+            setIsOpen(true);
+            setItem(storageKey, true);
+            onOpen?.();
+        }
+    }, [isOpen, onOpen, onClose, storageKey, setItem]);
+    const handleRowClick = (0, react_1.useCallback)((clickedRow) => {
+        if (onRowClick) {
+            onRowClick(clickedRow);
+            return;
+        }
+        handleToggle();
+    }, [onRowClick, handleToggle]);
+    return {
+        handleToggle,
+        handleRowClick,
+        isOpen,
+        itemProps,
+        rowBaseProps: {
+            isSelected,
+            row,
+            keyId,
+            columns,
+            rowId,
+            isDisabled,
+            disabledReason,
+            onSelectRow,
+            onRowEnter,
+            onRowLeave,
+            registerRowElement,
+            unregisterRowElement,
+            isSelectable,
+            emptyCellValue,
+            gridColumns,
+            activeRowId,
+            mobileDisplayVariant,
+        },
+    };
+};
+exports.useLogic = useLogic;

package/node/components/DataGridInfinite/DataGridInfinite.js

@@ -6,63 +6,73 @@ const react_1 = require("react");
 const react_virtuoso_1 = require("react-virtuoso");
 const ConfigProvider_1 = require("../ConfigProvider");
 const ContentState_1 = require("../ContentState");
+const constants_1 = require("../constants");
 const DataGrid_1 = require("../DataGrid");
-const constants_1 = require("../DataGrid/constants");
+const constants_2 = require("../DataGrid/constants");
 const DataGridContext_1 = require("../DataGrid/DataGridContext");
 const enums_1 = require("../DataGrid/enums");
 const Head_1 = require("../DataGrid/Head");
-const Row_1 = require("../DataGrid/Row");
-const styles_1 = require("../DataGrid/styles");
 const Loader_1 = require("../Loader");
 const classNames_1 = require("../utils/classNames");
 const cva_1 = require("../utils/cva");
 const getInertProps_1 = require("../utils/getInertProps");
-const constants_2 = require("./constants");
+const constants_3 = require("./constants");
+const DataGridInfiniteContext_1 = require("./DataGridInfiniteContext");
 const EndData_1 = require("./EndData");
 const ErrorMessage_1 = require("./ErrorMessage");
 const List_1 = require("./List");
 const NoData_1 = require("./NoData");
-const styles_2 = require("./styles");
+const Row_1 = require("./Row");
+const styles_1 = require("./styles");
 const useLogic_1 = require("./useLogic");
-const INITIAL_LEVEL = 0;
-const dataGridInfiniteCva = (0, cva_1.cva)(constants_1.dataGridClassnames.root, {
+const dataGridInfiniteCva = (0, cva_1.cva)(constants_2.dataGridClassnames.root, {
     variants: {
         hasGroupedColumns: {
-            true: constants_1.dataGridClassnames.hasGroupedColumns,
+            true: constants_2.dataGridClassnames.hasGroupedColumns,
         },
         gridViewMode: {
-            full: constants_1.dataGridClassnames.gridViewFull,
-            standard: constants_1.dataGridClassnames.gridViewStandard,
+            full: constants_2.dataGridClassnames.gridViewFull,
+            standard: constants_2.dataGridClassnames.gridViewStandard,
+        },
+        mobileDisplayVariant: {
+            cards: constants_2.dataGridClassnames.mobileVariantCards,
+            list: constants_2.dataGridClassnames.mobileVariantList,
+        },
+        isSelfContained: {
+            true: constants_1.selfContainedClassname,
         },
     },
 });
 const DataGridInfinite = (props) => {
     const { imagesMap, emptySymbol } = (0, react_1.useContext)(ConfigProvider_1.ConfigContext);
-    const { isNoData, isDataGridDisabled, treeRenderConfig, virtuosoProps, headProps, rowProps, scrollToTopButtonProps, isEndReached, isHideHead, containerCssVars, isMobile, mobileSkeletonProps, flattenColumns, hasGroupedColumns, gridViewMode, } = (0, useLogic_1.useLogic)(props);
-    const { columns, rows = [], selectedRows = [], sorting, isLoading, isDisabled, keyId, emptyCellValue = emptySymbol, variant = enums_1.Variant.Tree, subrows, className, isError, endOfScrollMsg, errorMsg, noDataPlaceholder, onRowClick, onSort, onRetry, headPreAddon, activeRowId, } = props;
+    const { isNoData, isDataGridDisabled, treeRenderConfig, virtuosoProps, headProps, rowProps, scrollToTopButtonProps, isEndReached, isHideHead, containerCssVars, isMobile, mobileSkeletonProps, hasGroupedColumns, gridViewMode, gridColumns, handleSelectRow, mobileDisplayVariant, isSelfContained, } = (0, useLogic_1.useLogic)(props);
+    const { columns, rows = [], selectedRows = [], sorting, isLoading, isDisabled, keyId, emptyCellValue = emptySymbol, variant = enums_1.Variant.Tree, subrows, className, isError, endOfScrollMsg, errorMsg, noDataPlaceholder, onRowClick, onSort, onRetry, headPreAddon, activeRowId, isTabularNums, renderRow, } = props;
     const { moreButtonColumnPosition = 1, isVisibleCollapseButton = true } = subrows || {};
-    const { isInitialExpanded = false, expandedLevel = constants_1.EXPANDED_LEVEL_BY_DEFAULT, initialVisibleChildrenCount = constants_1.INITIAL_OPENED_NESTED_CHILDREN_COUNT_BY_DEFAULT, } = treeRenderConfig || {};
-    const TableContainer = isDisabled ? styles_2.DisabledDataGridWrapper : styles_2.DataGridWrapper;
-    return ((0, jsx_runtime_1.jsx)(DataGridContext_1.DataGridContextProvider, { children: (0, jsx_runtime_1.jsxs)(styles_1.Container, { style: containerCssVars, className: (0, classNames_1.classNames)(dataGridInfiniteCva({ hasGroupedColumns, gridViewMode }), className), children: [headPreAddon, (0, jsx_runtime_1.jsxs)(TableContainer, { ...(0, getInertProps_1.getInertProps)(isDataGridDisabled), children: [!isHideHead && ((0, jsx_runtime_1.jsx)(Head_1.Head, { ...headProps, onSort: onSort, sorting: sorting, columns: columns })), (0, jsx_runtime_1.jsx)(ContentState_1.ContentState, { isLoading: isLoading && !isNoData, loadingTitle: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0434\u0430\u043D\u043D\u044B\u0445", isError: isError && !isNoData, loadingContent: isMobile && (0, jsx_runtime_1.jsx)(DataGrid_1.MobileSkeleton, { ...mobileSkeletonProps }), errorState: {
-                                imgAlt: 'Что-то пошло не так',
-                                errorList: [errorMsg || ''],
-                                imgSrc: imagesMap.defaultErrorImgSrc,
-                                onRetry,
-                            }, children: (0, jsx_runtime_1.jsx)(react_virtuoso_1.Virtuoso, { ...virtuosoProps, style: { height: '100%' }, overscan: constants_2.OVERSCAN_COUNT, data: rows, components: {
-                                    // biome-ignore lint/suspicious/noTsIgnore: Требует HTMLDivElement, а для элемента списка используем HTMLUListElement (https://github.com/petyosi/react-virtuoso/issues/864)
-                                    // @ts-ignore
-                                    List: List_1.List,
-                                    Item: ({ children, item, ...itemProps }) => {
-                                        const { children: nestedChildren, options, ...row } = item;
-                                        return ((0, jsx_runtime_1.jsx)(Row_1.RowContextProvider, { children: (0, jsx_runtime_1.jsx)(Row_1.Row, { ...rowProps, ...itemProps, row: row, columns: flattenColumns, selectedRows: selectedRows, options: options, keyId: keyId, variant: variant, level: INITIAL_LEVEL, nestedChildren: nestedChildren, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, initialVisibleChildrenCount: initialVisibleChildrenCount, activeRowId: activeRowId, moreButtonColumnPosition: moreButtonColumnPosition, isVisibleCollapseButton: isVisibleCollapseButton, emptyCellValue: emptyCellValue, onRowClick: onRowClick }) }));
-                                    },
-                                    EmptyPlaceholder: () => (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: noDataPlaceholder || (0, jsx_runtime_1.jsx)(NoData_1.NoData, {}) }),
-                                    Footer: () => {
-                                        if (!isLoading && !isError && !isEndReached) {
-                                            return null;
-                                        }
-                                        return ((0, jsx_runtime_1.jsxs)(styles_2.FooterRow, { children: [isLoading && (0, jsx_runtime_1.jsx)(Loader_1.Loader, {}), isError && (0, jsx_runtime_1.jsx)(ErrorMessage_1.ErrorMessage, { onRetry: onRetry }), isEndReached && ((0, jsx_runtime_1.jsx)(EndData_1.EndData, { endOfScrollMsg: endOfScrollMsg }))] }));
-                                    },
-                                } }) }), (0, jsx_runtime_1.jsx)(styles_2.StyledScrollToTopButton, { ...scrollToTopButtonProps, className: constants_2.dataGridInfiniteClassnames.scrollToTopButton }), isDisabled && (0, jsx_runtime_1.jsx)(styles_2.Backdrop, {})] })] }) }));
+    const { isInitialExpanded = false, expandedLevel = constants_2.EXPANDED_LEVEL_BY_DEFAULT, initialVisibleChildrenCount = constants_2.INITIAL_OPENED_NESTED_CHILDREN_COUNT_BY_DEFAULT, } = treeRenderConfig || {};
+    const { isSelectable } = rowProps;
+    const TableContainer = isDisabled ? styles_1.DisabledDataGridWrapper : styles_1.DataGridWrapper;
+    return ((0, jsx_runtime_1.jsx)(DataGridInfiniteContext_1.DataGridInfiniteContextProvider, { renderRow: renderRow, onSelectRow: handleSelectRow, variant: variant, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, initialVisibleChildrenCount: initialVisibleChildrenCount, isSelectable: isSelectable, selectedRows: selectedRows, moreButtonColumnPosition: moreButtonColumnPosition, isVisibleCollapseButton: isVisibleCollapseButton, children: (0, jsx_runtime_1.jsx)(DataGridContext_1.DataGridContextProvider, { gridColumns: gridColumns, emptyCellValue: emptyCellValue, activeRowId: activeRowId, columns: columns, keyId: keyId, isTabularNums: isTabularNums, onRowClick: onRowClick, mobileDisplayVariant: mobileDisplayVariant, children: (0, jsx_runtime_1.jsxs)(styles_1.StyledContainer, { style: containerCssVars, className: (0, classNames_1.classNames)(dataGridInfiniteCva({
+                    hasGroupedColumns,
+                    gridViewMode,
+                    mobileDisplayVariant,
+                    isSelfContained,
+                }), className), children: [headPreAddon, (0, jsx_runtime_1.jsxs)(TableContainer, { ...(0, getInertProps_1.getInertProps)(isDataGridDisabled), children: [!isHideHead && ((0, jsx_runtime_1.jsx)(Head_1.Head, { ...headProps, onSort: onSort, sorting: sorting, columns: columns })), (0, jsx_runtime_1.jsx)(ContentState_1.ContentState, { isLoading: isLoading && !isNoData, loadingTitle: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0434\u0430\u043D\u043D\u044B\u0445", isError: isError && !isNoData, loadingContent: isMobile && (0, jsx_runtime_1.jsx)(DataGrid_1.MobileSkeleton, { ...mobileSkeletonProps }), errorState: {
+                                    imgAlt: 'Что-то пошло не так',
+                                    errorList: [errorMsg || ''],
+                                    imgSrc: imagesMap.defaultErrorImgSrc,
+                                    onRetry,
+                                }, children: (0, jsx_runtime_1.jsx)(react_virtuoso_1.Virtuoso, { ...virtuosoProps, style: { height: '100%' }, overscan: constants_3.OVERSCAN_COUNT, data: rows, components: {
+                                        // biome-ignore lint/suspicious/noTsIgnore: Требует HTMLDivElement, а для элемента списка используем HTMLUListElement (https://github.com/petyosi/react-virtuoso/issues/864)
+                                        // @ts-ignore
+                                        List: List_1.List,
+                                        Item: Row_1.Row,
+                                        EmptyPlaceholder: () => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: noDataPlaceholder || (0, jsx_runtime_1.jsx)(NoData_1.NoData, {}) })),
+                                        Footer: () => {
+                                            if (!isLoading && !isError && !isEndReached) {
+                                                return null;
+                                            }
+                                            return ((0, jsx_runtime_1.jsxs)(styles_1.FooterRow, { children: [isLoading && (0, jsx_runtime_1.jsx)(Loader_1.Loader, {}), isError && (0, jsx_runtime_1.jsx)(ErrorMessage_1.ErrorMessage, { onRetry: onRetry }), isEndReached && ((0, jsx_runtime_1.jsx)(EndData_1.EndData, { endOfScrollMsg: endOfScrollMsg }))] }));
+                                        },
+                                    } }) }), (0, jsx_runtime_1.jsx)(styles_1.StyledScrollToTopButton, { ...scrollToTopButtonProps, className: constants_3.dataGridInfiniteClassnames.scrollToTopButton }), isDisabled && (0, jsx_runtime_1.jsx)(styles_1.Backdrop, {})] })] }) }) }));
 };
 exports.DataGridInfinite = DataGridInfinite;

package/node/components/DataGridInfinite/DataGridInfiniteContext/DataGridInfiniteContext.d.ts

@@ -0,0 +1,23 @@
+import { type ChangeEvent, type ReactNode } from 'react';
+export type DataGridInfiniteContextProps = {
+    renderRow: (row: Record<string, unknown>, index: number) => ReactNode;
+    onSelectRow: (row: Record<string, unknown>) => (event: ChangeEvent<HTMLInputElement>) => void;
+    variant: 'tree' | 'subrows';
+    isInitialExpanded?: boolean;
+    expandedLevel?: number;
+    initialVisibleChildrenCount?: number;
+    moreButtonColumnPosition?: number;
+    isVisibleCollapseButton?: boolean;
+    isSelectable?: boolean;
+    selectedRows?: Record<string, unknown>[];
+};
+/**
+ * Контекст общих параметров для компонента `Item` внутри `DataGridInfinite`.
+ *
+ * `Item` передаётся в `Virtuoso` напрямую, без inline-обёртки: замыкание на
+ * каждом ре-рендере `DataGridInfinite` давало бы новую ссылку на компонент и
+ * лишние перерисовки виртуализированного списка.
+ *
+ * Поскольку `Virtuoso` сам управляет параметрами `Item`, общие настройки передаются через контекст.
+ */
+export declare const DataGridInfiniteContext: import("react").Context<DataGridInfiniteContextProps>;

package/node/components/DataGridInfinite/DataGridInfiniteContext/DataGridInfiniteContext.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridInfiniteContext = void 0;
+const react_1 = require("react");
+/**
+ * Контекст общих параметров для компонента `Item` внутри `DataGridInfinite`.
+ *
+ * `Item` передаётся в `Virtuoso` напрямую, без inline-обёртки: замыкание на
+ * каждом ре-рендере `DataGridInfinite` давало бы новую ссылку на компонент и
+ * лишние перерисовки виртуализированного списка.
+ *
+ * Поскольку `Virtuoso` сам управляет параметрами `Item`, общие настройки передаются через контекст.
+ */
+exports.DataGridInfiniteContext = (0, react_1.createContext)({
+    renderRow: () => null,
+    onSelectRow: () => () => { },
+    variant: 'tree',
+    isInitialExpanded: false,
+    expandedLevel: 0,
+    initialVisibleChildrenCount: 0,
+    moreButtonColumnPosition: 0,
+    isVisibleCollapseButton: true,
+    selectedRows: [],
+});

package/node/components/DataGridInfinite/DataGridInfiniteContext/DataGridInfiniteContextProvider/DataGridInfiniteContextProvider.d.ts

@@ -0,0 +1,7 @@
+import { type ReactNode } from 'react';
+import { type DataGridInfiniteContextProps } from '../DataGridInfiniteContext';
+type DataGridInfiniteContextProviderProps = DataGridInfiniteContextProps & {
+    children: ReactNode;
+};
+export declare const DataGridInfiniteContextProvider: ({ children, ...props }: DataGridInfiniteContextProviderProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/node/components/DataGridInfinite/DataGridInfiniteContext/DataGridInfiniteContextProvider/DataGridInfiniteContextProvider.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridInfiniteContextProvider = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const DataGridInfiniteContext_1 = require("../DataGridInfiniteContext");
+const DataGridInfiniteContextProvider = ({ children, ...props }) => {
+    return ((0, jsx_runtime_1.jsx)(DataGridInfiniteContext_1.DataGridInfiniteContext.Provider, { value: props, children: children }));
+};
+exports.DataGridInfiniteContextProvider = DataGridInfiniteContextProvider;

package/node/components/DataGridInfinite/DataGridInfiniteContext/DataGridInfiniteContextProvider/index.d.ts

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

package/node/components/DataGridInfinite/DataGridInfiniteContext/DataGridInfiniteContextProvider/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("./DataGridInfiniteContextProvider"), exports);

package/node/components/DataGridInfinite/DataGridInfiniteContext/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DataGridInfiniteContext';
+export * from './DataGridInfiniteContextProvider';

package/node/components/DataGridInfinite/DataGridInfiniteContext/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("./DataGridInfiniteContext"), exports);
+__exportStar(require("./DataGridInfiniteContextProvider"), exports);

package/node/components/DataGridInfinite/List/List.js

@@ -4,5 +4,6 @@ exports.List = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const constants_1 = require("../constants");
+const constants_2 = require("./constants");
 const styles_1 = require("./styles");
-exports.List = (0, react_1.forwardRef)(({ children, ...listProps }, ref) => ((0, jsx_runtime_1.jsx)(styles_1.Wrapper, { id: constants_1.VIRTUOSO_LIST_ID, ref: ref, ...listProps, children: children })));
+exports.List = (0, react_1.forwardRef)(({ children, ...listProps }, ref) => ((0, jsx_runtime_1.jsx)(styles_1.Wrapper, { id: constants_1.VIRTUOSO_LIST_ID, ref: ref, ...listProps, className: constants_2.dataGridInfiniteListClassnames.root, children: children })));

package/node/components/DataGridInfinite/List/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const dataGridInfiniteListClassnames: {
+    root: string;
+};