@astral/ui 4.104.2 → 4.106.0

package/components/useScrollManagement/useScrollManagement.js

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { pageLayoutClassnames } from '../PageLayoutContainer';
 import { useViewportType } from '../useViewportType';
 /**
@@ -23,13 +23,14 @@ export const useScrollManagement = ({ scrollRef, isEndReached, onLoadMore, virtu
         if (scrollRef?.current?.parentElement) {
             scrollRef.current.parentElement.style.position = 'relative';
         }
-    }, [scrollRef]);
-    const recalculateVerticalScroll = () => {
+    }, [scrollRef, isMobile]);
+    const recalculateVerticalScroll = useCallback(() => {
         const list = document.getElementById(virtuosoId);
-        if (scrollRef?.current && list) {
-            setHasVerticalScroll(list?.clientHeight > scrollRef.current?.clientHeight);
+        if (!scrollParent || !list) {
+            return;
         }
-    };
+        setHasVerticalScroll(list.clientHeight > scrollParent.clientHeight);
+    }, [scrollParent, virtuosoId]);
     const handleEndReach = () => {
         if (!isEndReached && onLoadMore) {
             onLoadMore();

package/node/components/ActionCellBase/ActionCellBase.js

@@ -2,12 +2,21 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ActionCellBase = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+const cva_1 = require("../utils/cva");
+const constants_1 = require("./constants");
 const MainAction_1 = require("./MainAction");
 const SecondaryAction_1 = require("./SecondaryAction");
 const styles_1 = require("./styles");
+const actionCellCva = (0, cva_1.cva)(constants_1.actionCellBaseClassnames.root, {
+    variants: {
+        hasMainActions: {
+            true: constants_1.actionCellBaseClassnames.hasMainActions,
+        },
+    },
+});
 const ActionCellBase = ({ actions, isDisabledAction, handleWrapperClick, handleActionClick, }) => {
     const { main, secondary } = actions;
-    return ((0, jsx_runtime_1.jsxs)(styles_1.Wrapper, { onClick: handleWrapperClick, children: [main.map((action) => {
+    return ((0, jsx_runtime_1.jsxs)(styles_1.Wrapper, { onClick: handleWrapperClick, className: actionCellCva({ hasMainActions: Boolean(main.length) }), children: [main.map((action) => {
                 return ((0, jsx_runtime_1.jsx)(MainAction_1.MainAction, { action: action, onActionClick: handleActionClick, isDisabled: isDisabledAction }, action.name));
             }), secondary && ((0, jsx_runtime_1.jsx)(SecondaryAction_1.SecondaryActions, { actions: secondary, onActionClick: handleActionClick, isDisabled: isDisabledAction }))] }));
 };

package/node/components/ActionCellBase/MainAction/MainAction.js

@@ -6,12 +6,18 @@ const react_1 = require("react");
 const IconDropdownButton_1 = require("../../IconDropdownButton");
 const MenuItem_1 = require("../../MenuItem");
 const Tooltip_1 = require("../../Tooltip");
+const useViewportType_1 = require("../../useViewportType");
 const MainIconButton_1 = require("./MainIconButton");
+const MobileMainButton_1 = require("./MobileMainButton");
 const MainAction = ({ action, onActionClick, isDisabled, }) => {
+    const { isMobile } = (0, useViewportType_1.useViewportType)();
     if ('actions' in action) {
         const { disabled, icon, name, disabledReason, actions } = action;
         return ((0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { title: disabledReason || name, withoutContainer: !disabled, placement: "top", children: (0, jsx_runtime_1.jsx)(IconDropdownButton_1.IconDropdownButton, { icon: icon, variant: "text", disabled: isDisabled || disabled, children: actions.map(({ name: nestedActionName, onClick: onClickNested, ...props }) => ((0, react_1.createElement)(MenuItem_1.MenuItem, { ...props, key: nestedActionName, onClick: onActionClick(onClickNested) }, nestedActionName))) }) }, name));
     }
+    if (isMobile && action.isMobilePrimary) {
+        return ((0, jsx_runtime_1.jsx)(MobileMainButton_1.MobileMainButton, { action: action, onActionClick: onActionClick, isDisabled: isDisabled }));
+    }
     return ((0, jsx_runtime_1.jsx)(MainIconButton_1.MainIconButton, { action: action, onActionClick: onActionClick, isDisabled: isDisabled }));
 };
 exports.MainAction = MainAction;

package/node/components/ActionCellBase/MainAction/MainIconButton/MainIconButton.js

@@ -3,15 +3,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.MainIconButton = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const ConfirmAction_1 = require("../../../ConfirmAction");
-const IconButton_1 = require("../../../IconButton");
 const Tooltip_1 = require("../../../Tooltip");
+const constants_1 = require("./constants");
+const styles_1 = require("./styles");
 const useLogic_1 = require("./useLogic");
 const MainIconButton = (props) => {
     const { tooltipProps } = (0, useLogic_1.useLogic)(props);
     const { action, onActionClick, isDisabled } = props;
-    const { name, icon, needConfirm, confirmText, confirmButtonProps, disabledReason, disabled, loading, isBlockingOperation, loadingNote, onClick, ...actions } = action;
-    const renderButton = (renderProps) => ((0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { withoutContainer: !disabled, placement: "top", ...tooltipProps, children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { disabled: isDisabled || disabled, loading: loading, ...actions, variant: "text", ...renderProps, children: icon }) }, name));
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: needConfirm ? ((0, jsx_runtime_1.jsx)(ConfirmAction_1.ConfirmAction, { text: confirmText, confirmButtonProps: confirmButtonProps, actionComponent: (renderProps) => renderButton(renderProps), onConfirm: onActionClick(onClick) })) : (renderButton({
+    const { name, icon, needConfirm, confirmText, confirmMobileTitle, confirmButtonProps, disabledReason, disabled, loading, isBlockingOperation, loadingNote, onClick, isMobilePrimary, mobileProps, ...actions } = action;
+    const renderButton = (renderProps) => ((0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { withoutContainer: !disabled, placement: "top", ...tooltipProps, children: (0, jsx_runtime_1.jsx)(styles_1.StyledIconButton, { disabled: isDisabled || disabled, loading: loading, ...actions, variant: "text", ...renderProps, className: constants_1.mainIconButtonClassnames.root, children: icon }) }, name));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: needConfirm ? ((0, jsx_runtime_1.jsx)(ConfirmAction_1.ConfirmAction, { text: confirmText, confirmButtonProps: confirmButtonProps, popoverProps: {
+                title: confirmMobileTitle,
+            }, actionComponent: (renderProps) => renderButton(renderProps), onConfirm: onActionClick(onClick) })) : (renderButton({
             onClick: onActionClick(onClick),
         })) }));
 };

package/node/components/ActionCellBase/MainAction/MainIconButton/constants.d.ts

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

package/node/components/ActionCellBase/MainAction/MainIconButton/constants.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mainIconButtonClassnames = void 0;
+const createUIKitClassname_1 = require("../../../utils/createUIKitClassname");
+exports.mainIconButtonClassnames = {
+    root: (0, createUIKitClassname_1.createUIKitClassname)('action-cell-base__main-icon-button'),
+};

package/node/components/ActionCellBase/MainAction/MainIconButton/styles.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export declare const StyledIconButton: 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;
+}, {}, {}>;

package/node/components/ActionCellBase/MainAction/MainIconButton/styles.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledIconButton = void 0;
+const IconButton_1 = require("../../../IconButton");
+const styled_1 = require("../../../styled");
+exports.StyledIconButton = (0, styled_1.styled)(IconButton_1.IconButton) `
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
+    order: 2;
+
+    background-color: ${({ theme }) => theme.palette.grey[100]};
+  }
+`;

package/node/components/ActionCellBase/MainAction/MobileMainButton/MobileMainButton.d.ts

@@ -0,0 +1,14 @@
+import { type IconButtonProps } from '../../../IconButton';
+import { type ActionHandler, type SingleAction } from '../../types';
+export type MobileMainButtonProps<TAction> = {
+    action: IconButtonProps & SingleAction<TAction>;
+    /**
+     *  Обработчик клика на действие
+     */
+    onActionClick: ActionHandler<TAction>;
+    /**
+     *  Если true, action не доступен
+     */
+    isDisabled?: boolean;
+};
+export declare const MobileMainButton: <TAction>({ action, isDisabled, onActionClick, }: MobileMainButtonProps<TAction>) => import("react/jsx-runtime").JSX.Element;

package/node/components/ActionCellBase/MainAction/MobileMainButton/MobileMainButton.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MobileMainButton = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ConfirmAction_1 = require("../../../ConfirmAction");
+const styles_1 = require("./styles");
+const MobileMainButton = ({ action, isDisabled, onActionClick, }) => {
+    const { mobileProps, name, icon, needConfirm, confirmText, confirmMobileTitle, confirmButtonProps, disabledReason, disabled, loading, isBlockingOperation, loadingNote, onClick, isMobilePrimary, ...actions } = action;
+    const text = mobileProps?.text ?? name;
+    const color = mobileProps?.color ?? 'primary';
+    const renderButton = (renderProps) => ((0, jsx_runtime_1.jsx)(styles_1.StyledButton, { disabled: isDisabled || disabled, loading: loading, color: color, ...actions, variant: "contained", ...renderProps, children: text }));
+    if (needConfirm) {
+        return ((0, jsx_runtime_1.jsx)(ConfirmAction_1.ConfirmAction, { text: confirmText, confirmButtonProps: confirmButtonProps, popoverProps: {
+                title: confirmMobileTitle,
+            }, actionComponent: (renderProps) => renderButton(renderProps), onConfirm: onActionClick(onClick) }));
+    }
+    return renderButton({
+        onClick: onActionClick(onClick),
+    });
+};
+exports.MobileMainButton = MobileMainButton;

package/node/components/ActionCellBase/MainAction/MobileMainButton/index.d.ts

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

package/node/components/ActionCellBase/MainAction/MobileMainButton/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("./MobileMainButton"), exports);

package/node/components/ActionCellBase/MainAction/MobileMainButton/styles.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export declare const StyledButton: 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;
+}, {}, {}>;

package/node/components/ActionCellBase/MainAction/MobileMainButton/styles.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledButton = void 0;
+const Button_1 = require("../../../Button");
+const styled_1 = require("../../../styled");
+exports.StyledButton = (0, styled_1.styled)(Button_1.Button) `
+  order: 1;
+
+  width: 100%;
+`;

package/node/components/ActionCellBase/SecondaryAction/SecondaryAction.js

@@ -4,10 +4,10 @@ exports.SecondaryActions = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const DotsVOutlineMd_1 = require("../../../icons/DotsVOutlineMd");
-const IconDropdownButton_1 = require("../../IconDropdownButton");
 const MenuItem_1 = require("../../MenuItem");
+const styles_1 = require("./styles");
 const SecondaryActions = ({ actions, onActionClick, isDisabled, }) => {
-    return ((0, jsx_runtime_1.jsx)(IconDropdownButton_1.IconDropdownButton, { "aria-label": "\u0414\u043E\u043F\u043E\u043B\u043D\u0438\u0442\u0435\u043B\u044C\u043D\u044B\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044F", icon: (0, jsx_runtime_1.jsx)(DotsVOutlineMd_1.DotsVOutlineMd, {}), variant: "text", disabled: isDisabled, children: actions.map((action) => {
+    return ((0, jsx_runtime_1.jsx)(styles_1.StyledIconDropdownButton, { "aria-label": "\u0414\u043E\u043F\u043E\u043B\u043D\u0438\u0442\u0435\u043B\u044C\u043D\u044B\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044F", title: "\u0414\u043E\u043F\u043E\u043B\u043D\u0438\u0442\u0435\u043B\u044C\u043D\u044B\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044F", icon: (0, jsx_runtime_1.jsx)(DotsVOutlineMd_1.DotsVOutlineMd, {}), variant: "text", disabled: isDisabled, children: actions.map((action) => {
             const { onClick, name } = action;
             return ((0, react_1.createElement)(MenuItem_1.MenuItem, { ...action, key: name, tooltipPlacement: "left", onClick: onActionClick(onClick) }, name));
         }) }));

package/node/components/ActionCellBase/SecondaryAction/styles.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const StyledIconDropdownButton: import("@emotion/styled/dist/declarations/src/types").StyledComponent<Omit<import("../../IconDropdownButton").IconDropdownButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;

package/node/components/ActionCellBase/SecondaryAction/styles.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledIconDropdownButton = void 0;
+const IconDropdownButton_1 = require("../../IconDropdownButton");
+const styled_1 = require("../../styled");
+exports.StyledIconDropdownButton = (0, styled_1.styled)(IconDropdownButton_1.IconDropdownButton) `
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
+    order: 3;
+
+    background-color: ${({ theme }) => theme.palette.grey[100]};
+  }
+`;

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

@@ -0,0 +1,4 @@
+export declare const actionCellBaseClassnames: {
+    root: string;
+    hasMainActions: string;
+};

package/node/components/ActionCellBase/constants.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.actionCellBaseClassnames = void 0;
+const createUIKitClassname_1 = require("../utils/createUIKitClassname");
+exports.actionCellBaseClassnames = {
+    root: (0, createUIKitClassname_1.createUIKitClassname)('action-cell-base'),
+    hasMainActions: (0, createUIKitClassname_1.createUIKitClassname)('action-cell-base_has-main-actions'),
+};

package/node/components/ActionCellBase/styles.js

@@ -2,7 +2,18 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Wrapper = void 0;
 const styled_1 = require("../styled");
+const constants_1 = require("./constants");
 exports.Wrapper = styled_1.styled.div `
   display: inline-flex;
   align-items: center;
+
+  ${({ theme }) => theme.breakpoints.down('mobile')} {
+    gap: ${({ theme }) => theme.spacing(3)};
+
+    width: auto;
+
+    &.${constants_1.actionCellBaseClassnames.hasMainActions} {
+      width: 100%;
+    }
+  }
 `;

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

@@ -1,4 +1,5 @@
 import type { MouseEventHandler, ReactNode } from 'react';
+import { type ButtonColor } from '../Button';
 import { type ConfirmActionProps } from '../ConfirmAction';
 import { type IconButtonProps } from '../IconButton';
 import { type MenuItemProps } from '../MenuItem';
@@ -33,6 +34,10 @@ export type SingleAction<TAction> = {
      * Поясняющий текст для подтверждения действия
      */
     confirmText?: ConfirmActionProps['text'];
+    /**
+     * Заголовок подтверждения действия на мобильной ширине
+     */
+    confirmMobileTitle?: string;
     /**
      * Параметры кнопки подтверждения действия
      */
@@ -49,6 +54,26 @@ export type SingleAction<TAction> = {
      * Причина блокировки строки во время загрузки
      */
     loadingNote?: string;
+    /**
+     * Если `true`, на мобильной ширине действие отображается кнопкой с текстом,
+     * а не иконкой
+     */
+    isMobilePrimary?: boolean;
+    /**
+     * Параметры кнопки действия на мобильной ширине
+     */
+    mobileProps?: {
+        /**
+         * Текст кнопки
+         * @default name
+         */
+        text?: string;
+        /**
+         * Цвет кнопки
+         * @default 'primary'
+         */
+        color?: ButtonColor;
+    };
     /**
      * Обработчик действия
      */

package/node/components/ActionGroup/MainActions/ActionNode/ActionNode.d.ts

@@ -0,0 +1,9 @@
+import { type ElementType } from 'react';
+import type { ProcessedMainAction } from '../hooks';
+export type ActionNodeProps<TMainActionComponent extends ElementType> = ProcessedMainAction<TMainActionComponent> & {
+    isRenderActionDisabled?: boolean;
+};
+/**
+ * Отображает одно основное действие: стандартный узел кита либо то, что вернул `renderAction`
+ */
+export declare const ActionNode: <TMainActionComponent extends ElementType>(props: ActionNodeProps<TMainActionComponent>) => import("react/jsx-runtime").JSX.Element;

package/node/components/ActionGroup/MainActions/ActionNode/ActionNode.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ActionNode = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const DropdownButton_1 = require("../../../DropdownButton");
+const MenuItem_1 = require("../../../MenuItem");
+const Tooltip_1 = require("../../../Tooltip");
+const styles_1 = require("../styles");
+/**
+ * Отображает одно основное действие: стандартный узел кита либо то, что вернул `renderAction`
+ */
+const ActionNode = (props) => {
+    const { tooltipProps, renderAction, isRenderActionDisabled = false } = props;
+    const { key, ...restTooltipProps } = tooltipProps;
+    const isRenderActionCalled = !isRenderActionDisabled && Boolean(renderAction);
+    // Якорь в состоянии, а не в ref: мутация ref.current не вызывает обновление, и popover на первом кадре остался бы без якоря
+    const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
+    // Лишний render при монтировании достаётся только действиям с renderAction.
+    const anchorRef = isRenderActionCalled && !props.isNested ? setAnchorEl : undefined;
+    const defaultElement = ((0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { ...restTooltipProps, ref: anchorRef, children: props.isNested ? ((0, jsx_runtime_1.jsx)(DropdownButton_1.DropdownButton, { ...props.buttonProps, children: props.nestedActions.map(({ key: nestedKey, text, ...nestedProps }) => ((0, jsx_runtime_1.jsx)(MenuItem_1.MenuItem, { ...nestedProps, children: text }, nestedKey))) })) : ((0, jsx_runtime_1.jsx)(styles_1.StyledButton, { ...props.buttonProps })) }));
+    if (isRenderActionDisabled || !props.renderAction) {
+        return defaultElement;
+    }
+    if (props.isNested) {
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: props.renderAction({ defaultElement }) });
+    }
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: props.renderAction({
+            defaultElement,
+            elementProps: props.elementProps,
+            anchorEl,
+        }) }));
+};
+exports.ActionNode = ActionNode;

package/node/components/ActionGroup/MainActions/ActionNode/index.d.ts

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

package/node/components/ActionGroup/MainActions/ActionNode/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("./ActionNode"), exports);

package/node/components/ActionGroup/MainActions/MainActions.d.ts

@@ -1,3 +1,3 @@
 import { type ElementType } from 'react';
 import type { MainActionsProps } from '../types';
-export declare const MainActions: <TMainActionComponent extends ElementType = ElementType>({ actions, isDisabled, size, }: MainActionsProps<TMainActionComponent>) => import("react/jsx-runtime").JSX.Element;
+export declare const MainActions: <TMainActionComponent extends ElementType = ElementType>({ actions, isDisabled, size, isRenderActionDisabled, }: MainActionsProps<TMainActionComponent>) => import("react/jsx-runtime").JSX.Element;

package/node/components/ActionGroup/MainActions/MainActions.js

@@ -2,21 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MainActions = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const MenuItem_1 = require("../../MenuItem");
-const Tooltip_1 = require("../../Tooltip");
+const ActionNode_1 = require("./ActionNode");
 const hooks_1 = require("./hooks");
-const styles_1 = require("./styles");
-const MainActions = ({ actions, isDisabled, size, }) => {
+const MainActions = ({ actions, isDisabled, size, isRenderActionDisabled = false, }) => {
     const processedActions = (0, hooks_1.useMainActions)({ actions, size, isDisabled });
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: processedActions.map(({ tooltipProps, isNested, buttonProps, nestedActions }) => {
-            const { key: tooltipKey, ...restTooltipProps } = tooltipProps;
-            if (isNested) {
-                return ((0, react_1.createElement)(Tooltip_1.Tooltip, { ...restTooltipProps, key: tooltipKey },
-                    (0, jsx_runtime_1.jsx)(styles_1.StyledDropdownButton, { ...buttonProps, children: nestedActions.map(({ key, text, ...nestedProps }) => ((0, jsx_runtime_1.jsx)(MenuItem_1.MenuItem, { ...nestedProps, children: text }, key))) })));
-            }
-            return ((0, react_1.createElement)(Tooltip_1.Tooltip, { ...restTooltipProps, key: tooltipKey },
-                (0, jsx_runtime_1.jsx)(styles_1.StyledButton, { ...buttonProps })));
-        }) }));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: processedActions.map((action) => ((0, jsx_runtime_1.jsx)(ActionNode_1.ActionNode, { isRenderActionDisabled: isRenderActionDisabled, ...action }, action.tooltipProps.key))) }));
 };
 exports.MainActions = MainActions;