@astral/ui 4.114.0 → 4.115.1

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

@@ -4,13 +4,13 @@ exports.useLogic = void 0;
 const react_1 = require("react");
 const constants_1 = require("../../DataGrid/constants");
 const enums_1 = require("../../DataGrid/enums");
-const hooks_1 = require("../../DataGrid/useLogic/hooks");
+const hooks_1 = require("../../DataGrid/hooks");
+const hooks_2 = require("../../DataGrid/useLogic/hooks");
 const utils_1 = require("../../DataGrid/utils");
 const useViewportType_1 = require("../../useViewportType");
-const prop_1 = require("../../utils/prop");
 const uniqueBy_1 = require("../../utils/uniqueBy");
 const constants_2 = require("../constants");
-const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows = [], maxHeight, isLoading, isError, isDisabled, isEndReached, endOfScrollMsg, onRetry, onEndReached, onStartReached, isStartReached, onSelectRow, isHideSelectAll, initialVisibleItemIndex, isHideHeaderIfNoData = false, gridViewMode: gridViewModeProp = 'standard', massActions, mobileDisplayVariant = variant === 'subrows' ? 'cards' : 'list', virtuosoRef, }) => {
+const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows = [], maxHeight, isLoading, isError, isDisabled, getRowDisabled, isEndReached, endOfScrollMsg, onRetry, onEndReached, onStartReached, isStartReached, onSelectRow, isHideSelectAll, initialVisibleItemIndex, isHideHeaderIfNoData = false, gridViewMode: gridViewModeProp = 'standard', massActions, mobileDisplayVariant = variant === 'subrows' ? 'cards' : 'list', virtuosoRef, }) => {
     const virtuoso = (0, react_1.useRef)(null);
     const handleVirtuosoRef = (0, react_1.useCallback)((node) => {
         virtuoso.current = node;
@@ -69,7 +69,16 @@ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows =
         }
         return config;
     }, [variant, subrows, tree, isMobile]);
-    const availableRows = rows.filter((row) => !(row.options?.isDisabled || row.options?.isNotSelectable));
+    // Блокировки строк: getRowDisabled вызывается один раз на строку
+    const { rowsDisabled, idsWithoutReason } = (0, react_1.useMemo)(() => (0, utils_1.resolveRowsDisabled)(rows, keyId, getRowDisabled), [rows, keyId, getRowDisabled]);
+    (0, hooks_1.useWarnRowsWithoutDisabledReason)(idsWithoutReason);
+    const selectedIds = (0, react_1.useMemo)(() => new Set(selectedRows.map((row) => row[keyId])), [selectedRows, keyId]);
+    const itemContext = (0, react_1.useMemo)(() => ({
+        selectedIds,
+        rowsDisabled,
+        getRowDisabled: getRowDisabled,
+    }), [selectedIds, rowsDisabled, getRowDisabled]);
+    const availableRows = (0, react_1.useMemo)(() => rows.filter((row) => !row.options?.isNotSelectable && !rowsDisabled.get(row[keyId])), [rows, rowsDisabled, keyId]);
     const flattenColumns = (0, react_1.useMemo)(() => (0, utils_1.getFlattenColumns)(columns), [columns]);
     const hasGroupedColumns = columns.some(utils_1.isGroupColumns);
     const gridViewMode = hasGroupedColumns ? 'full' : gridViewModeProp;
@@ -84,9 +93,7 @@ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows =
             onStartReached();
         }
     }, [isStartReached, onStartReached]);
-    const uncheckedRowsCount = (0, react_1.useMemo)(() => {
-        return availableRows.filter((row) => !selectedRows.find((selectedRow) => selectedRow[keyId] === row[keyId])).length;
-    }, [availableRows, selectedRows, keyId]);
+    const uncheckedRowsCount = (0, react_1.useMemo)(() => availableRows.filter((row) => !selectedIds.has(row[keyId])).length, [availableRows, selectedIds, keyId]);
     const handleRangeChanged = (0, react_1.useCallback)((range) => {
         if (scrollToTopButtonRef.current) {
             scrollToTopButtonRef.current.classList.toggle(constants_2.dataGridInfiniteClassnames.visibleScrollToTopButton, range.startIndex > baseIndex.current + 2);
@@ -97,11 +104,11 @@ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows =
             return;
         }
         if (event.target.checked) {
-            const mergedSelectedRows = (0, uniqueBy_1.uniqueBy)([...selectedRows, ...availableRows], (0, prop_1.prop)(keyId));
+            const mergedSelectedRows = (0, uniqueBy_1.uniqueBy)([...selectedRowsRef.current, ...availableRows], (row) => row[keyId]);
             return onSelectRow(mergedSelectedRows);
         }
-        const filteredRows = selectedRows.filter((selectedRow) => !rows.find((row) => row[keyId] === selectedRow[keyId]));
-        onSelectRow(filteredRows);
+        const rowsIds = new Set(rows.map((row) => row[keyId]));
+        onSelectRow(selectedRowsRef.current.filter((selectedRow) => !rowsIds.has(selectedRow[keyId])));
     };
     const handleSelectRow = (0, react_1.useCallback)((row) => (event) => {
         if (!onSelectRow) {
@@ -118,12 +125,16 @@ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows =
     const recalculateVerticalScroll = (listHeight) => {
         const container = document.getElementById(constants_2.VIRTUOSO_CONTAINER_ID);
         if (container) {
-            const massActionsSpacerHeight = container.querySelector(`.${constants_2.dataGridInfiniteClassnames.massActionsSpacer}`)?.clientHeight ?? 0;
-            setHasVerticalScroll(listHeight - massActionsSpacerHeight > container.clientHeight);
+            // listHeight включает header и footer
+            const getHeight = (className) => container.querySelector(`.${className}`)?.clientHeight ?? 0;
+            const rowsHeight = listHeight -
+                getHeight(constants_2.dataGridInfiniteClassnames.header) -
+                getHeight(constants_2.dataGridInfiniteClassnames.footer);
+            setHasVerticalScroll(rowsHeight > container.clientHeight);
         }
     };
     const isHideHead = isHideHeaderIfNoData && rows.length === 0;
-    const { mobileSkeletonProps } = (0, hooks_1.useDataGridMobileLogic)({
+    const { mobileSkeletonProps } = (0, hooks_2.useDataGridMobileLogic)({
         columns: flattenColumns,
         mobileDisplayVariant,
     });
@@ -155,8 +166,9 @@ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows =
         onRetry,
         hasMassActions,
     ]);
+    const virtuosoContext = (0, react_1.useMemo)(() => ({ ...itemContext, ...footerContext }), [itemContext, footerContext]);
     return {
-        footerContext,
+        virtuosoContext,
         hasMassActions,
         isMassActionsOpen,
         containerCssVars,

package/node/components/PageContent/styles.js

@@ -63,10 +63,16 @@ exports.Content = styled_1.styled.div `
 
   ${constants_1.HOVER_MEDIA} {
     scrollbar-gutter: stable;
+
+    padding-right: ${({ theme }) => `calc(${theme.spacing(6)} - ${constants_1.SCROLLBAR_SIZE})`};
   }
 
   &.${constants_3.pageContentClassnames.contentHasHeader}, &.${constants_3.pageContentClassnames.hasAside} {
     padding: ${({ theme }) => theme.spacing(4, 6, 4)};
+
+    ${constants_1.HOVER_MEDIA} {
+      padding-right: ${({ theme }) => `calc(${theme.spacing(6)} - ${constants_1.SCROLLBAR_SIZE})`};
+    }
   }
 
   ${({ theme }) => theme.breakpoints.down('laptop')} {
@@ -74,8 +80,16 @@ exports.Content = styled_1.styled.div `
     padding-bottom: ${({ theme }) => theme.spacing(3)};
     padding-left: ${({ theme }) => theme.spacing(4)};
 
+    ${constants_1.HOVER_MEDIA} {
+      padding-right: ${({ theme }) => `calc(${theme.spacing(4)} - ${constants_1.SCROLLBAR_SIZE})`};
+    }
+
     &.${constants_3.pageContentClassnames.contentHasHeader}, &.${constants_3.pageContentClassnames.hasAside} {
       padding: ${({ theme }) => theme.spacing(4, 4, 3)};
+
+      ${constants_1.HOVER_MEDIA} {
+        padding-right: ${({ theme }) => `calc(${theme.spacing(4)} - ${constants_1.SCROLLBAR_SIZE})`};
+      }
     }
   }
 
@@ -91,6 +105,16 @@ exports.Content = styled_1.styled.div `
     border: 1px solid ${({ theme }) => theme.palette.components.border.default};
     border-radius: ${({ theme }) => theme.shape.medium};
 
+    ${constants_1.HOVER_MEDIA} {
+      padding-right: ${({ theme }) => theme.spacing(4)};
+    }
+    
+    &.${constants_3.pageContentClassnames.contentHasHeader}, &.${constants_3.pageContentClassnames.hasAside} {
+      ${constants_1.HOVER_MEDIA} {
+        padding-right: ${({ theme }) => theme.spacing(4)};
+      }
+    }
+
     &.${constants_3.pageContentClassnames.contentHasHeader} {
       border-top-left-radius: 0;
       border-top-right-radius: 0;

package/node/components/index.d.ts

@@ -131,7 +131,7 @@ export * from './MenuItem';
 export * from './MenuList';
 export { MinimalisticPagination, type MinimalisticPaginationProps, } from './MinimalisticPagination';
 export * from './NavMenu';
-export { type DataGridColumns, type DataGridRenderLink, type DataGridRenderLinkParams, type DataGridRow, type DataGridRowOptions, type DataGridSort, DataGrid, type DataGridProps, } from './DataGrid';
+export { type DataGridColumns, type DataGridRenderLink, type DataGridRenderLinkParams, type DataGridRow, type DataGridRowDisabled, type DataGridRowOptions, type DataGridSort, DataGrid, type DataGridProps, } from './DataGrid';
 export { DataGridInfinite, type DataGridInfiniteProps, } from './DataGridInfinite';
 export { DataGridColumnHintIcon, type DataGridColumnHintIconProps, } from './DataGridColumnHintIcon';
 export { type DateItemProps, type DateRangePickerProps, type DateRangePickerValue, DateRangePicker, } from './DateRangePicker';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astral/ui",
-  "version": "4.114.0",
+  "version": "4.115.1",
   "browser": "./index.js",
   "main": "./node/index.js",
   "dependencies": {