@hh.ru/magritte-ui-action-bar 5.3.4 → 5.3.6

package/ActionBar.js

@@ -10,7 +10,7 @@ import { STRETCHED_WRAPPER_CLASS } from '@hh.ru/magritte-ui-button';
 import { Divider } from '@hh.ru/magritte-ui-divider';
 import { Layer } from '@hh.ru/magritte-ui-layer';
 
-var styles = {"action-bar":"magritte-action-bar___Tkm7C_5-3-4","actionBar":"magritte-action-bar___Tkm7C_5-3-4","action-bar-is-fixed":"magritte-action-bar-is-fixed___Zjqtf_5-3-4","actionBarIsFixed":"magritte-action-bar-is-fixed___Zjqtf_5-3-4","action-bar-is-sticky":"magritte-action-bar-is-sticky___q272C_5-3-4","actionBarIsSticky":"magritte-action-bar-is-sticky___q272C_5-3-4","action-bar-with-default-padding":"magritte-action-bar-with-default-padding___QcKnA_5-3-4","actionBarWithDefaultPadding":"magritte-action-bar-with-default-padding___QcKnA_5-3-4","action-bar-with-progress-bar":"magritte-action-bar-with-progress-bar___mprqw_5-3-4","actionBarWithProgressBar":"magritte-action-bar-with-progress-bar___mprqw_5-3-4","actions-stack":"magritte-actions-stack___12VkP_5-3-4","actionsStack":"magritte-actions-stack___12VkP_5-3-4","right-only-actions":"magritte-right-only-actions___84fc8_5-3-4","rightOnlyActions":"magritte-right-only-actions___84fc8_5-3-4","actions-stack_horizontal":"magritte-actions-stack_horizontal___p3HgB_5-3-4","actionsStackHorizontal":"magritte-actions-stack_horizontal___p3HgB_5-3-4","actions-stack_vertical":"magritte-actions-stack_vertical___5UtzF_5-3-4","actionsStackVertical":"magritte-actions-stack_vertical___5UtzF_5-3-4","additional-content-overflow-wrapper":"magritte-additional-content-overflow-wrapper___hpCEQ_5-3-4","additionalContentOverflowWrapper":"magritte-additional-content-overflow-wrapper___hpCEQ_5-3-4","additional-content-container":"magritte-additional-content-container___N4Q-l_5-3-4","additionalContentContainer":"magritte-additional-content-container___N4Q-l_5-3-4","additional-content-vertical":"magritte-additional-content-vertical___3Ba1i_5-3-4","additionalContentVertical":"magritte-additional-content-vertical___3Ba1i_5-3-4","additional-content-wrapper":"magritte-additional-content-wrapper___dpdp5_5-3-4","additionalContentWrapper":"magritte-additional-content-wrapper___dpdp5_5-3-4","additional-content-dimensions":"magritte-additional-content-dimensions___yEIwY_5-3-4","additionalContentDimensions":"magritte-additional-content-dimensions___yEIwY_5-3-4","horizontal-actions-container":"magritte-horizontal-actions-container___dKSH8_5-3-4","horizontalActionsContainer":"magritte-horizontal-actions-container___dKSH8_5-3-4","vertical-actions-container":"magritte-vertical-actions-container___j1toG_5-3-4","verticalActionsContainer":"magritte-vertical-actions-container___j1toG_5-3-4","reverse":"magritte-reverse___mFIgd_5-3-4","progress-bar":"magritte-progress-bar___tSTjx_5-3-4","progressBar":"magritte-progress-bar___tSTjx_5-3-4"};
+var styles = {"action-bar":"magritte-action-bar___Tkm7C_5-3-6","actionBar":"magritte-action-bar___Tkm7C_5-3-6","action-bar-is-fixed":"magritte-action-bar-is-fixed___Zjqtf_5-3-6","actionBarIsFixed":"magritte-action-bar-is-fixed___Zjqtf_5-3-6","action-bar-is-sticky":"magritte-action-bar-is-sticky___q272C_5-3-6","actionBarIsSticky":"magritte-action-bar-is-sticky___q272C_5-3-6","action-bar-with-default-padding":"magritte-action-bar-with-default-padding___QcKnA_5-3-6","actionBarWithDefaultPadding":"magritte-action-bar-with-default-padding___QcKnA_5-3-6","action-bar-with-progress-bar":"magritte-action-bar-with-progress-bar___mprqw_5-3-6","actionBarWithProgressBar":"magritte-action-bar-with-progress-bar___mprqw_5-3-6","actions-stack":"magritte-actions-stack___12VkP_5-3-6","actionsStack":"magritte-actions-stack___12VkP_5-3-6","right-only-actions":"magritte-right-only-actions___84fc8_5-3-6","rightOnlyActions":"magritte-right-only-actions___84fc8_5-3-6","actions-stack_horizontal":"magritte-actions-stack_horizontal___p3HgB_5-3-6","actionsStackHorizontal":"magritte-actions-stack_horizontal___p3HgB_5-3-6","actions-stack_vertical":"magritte-actions-stack_vertical___5UtzF_5-3-6","actionsStackVertical":"magritte-actions-stack_vertical___5UtzF_5-3-6","additional-content-overflow-wrapper":"magritte-additional-content-overflow-wrapper___hpCEQ_5-3-6","additionalContentOverflowWrapper":"magritte-additional-content-overflow-wrapper___hpCEQ_5-3-6","additional-content-container":"magritte-additional-content-container___N4Q-l_5-3-6","additionalContentContainer":"magritte-additional-content-container___N4Q-l_5-3-6","additional-content-vertical":"magritte-additional-content-vertical___3Ba1i_5-3-6","additionalContentVertical":"magritte-additional-content-vertical___3Ba1i_5-3-6","additional-content-wrapper":"magritte-additional-content-wrapper___dpdp5_5-3-6","additionalContentWrapper":"magritte-additional-content-wrapper___dpdp5_5-3-6","additional-content-dimensions":"magritte-additional-content-dimensions___yEIwY_5-3-6","additionalContentDimensions":"magritte-additional-content-dimensions___yEIwY_5-3-6","horizontal-actions-container":"magritte-horizontal-actions-container___dKSH8_5-3-6","horizontalActionsContainer":"magritte-horizontal-actions-container___dKSH8_5-3-6","vertical-actions-container":"magritte-vertical-actions-container___j1toG_5-3-6","verticalActionsContainer":"magritte-vertical-actions-container___j1toG_5-3-6","reverse":"magritte-reverse___mFIgd_5-3-6","progress-bar":"magritte-progress-bar___tSTjx_5-3-6","progressBar":"magritte-progress-bar___tSTjx_5-3-6"};
 
 const SCROLL_HANDLER_THROTTLE_MS = 50;
 const ActionBarComponent = forwardRef(({ type = 'horizontal', showDivider = 'with-scroll', showProgress = false, primaryActions, secondaryActions, additionalContent, padding, vertPadding, bottom = 0, isFixed = false, isSticky = false, onDomPositionReached, className, }, ref) => {

package/ActionBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionBar.js","sources":["../src/ActionBar.tsx"],"sourcesContent":["import {\n    Children,\n    Fragment,\n    forwardRef,\n    isValidElement,\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useRef,\n    useState,\n} from 'react';\nimport classnames from 'classnames';\n\nimport { throttle } from '@hh.ru/magritte-common-func-utils';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { ActionBarProps, OnDomPositionReached } from '@hh.ru/magritte-ui-action-bar/types';\nimport { getScrollableParent, shouldShowDividerOrProgress } from '@hh.ru/magritte-ui-action-bar/utils';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { STRETCHED_WRAPPER_CLASS } from '@hh.ru/magritte-ui-button';\nimport { Divider } from '@hh.ru/magritte-ui-divider';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\n\nimport styles from './action-bar.less';\n\nconst SCROLL_HANDLER_THROTTLE_MS = 50;\n\nconst ActionBarComponent = forwardRef<HTMLElement, ActionBarProps>(\n    (\n        {\n            type = 'horizontal',\n            showDivider = 'with-scroll',\n            showProgress = false,\n            primaryActions,\n            secondaryActions,\n            additionalContent,\n            padding,\n            vertPadding,\n            bottom = 0,\n            isFixed = false,\n            isSticky = false,\n            onDomPositionReached,\n            className,\n        },\n        ref\n    ) => {\n        const isFixedOrSticky = isFixed || isSticky;\n        const { breakpoint, isMobile } = useBreakpoint();\n        const [isScrollEnd, setIsScrollEnd] = useState(false);\n        const actionBarRef = useRef<HTMLDivElement>(null);\n        const actionBarRefCallback = useMultipleRefs(ref, actionBarRef);\n        const additionalContentRef = useRef<HTMLDivElement>(null);\n        const additionalContentWrapperRef = useRef<HTMLDivElement>(null);\n        const actionsStackWrapperRef = useRef<HTMLDivElement>(null);\n        const actionsStackRef = useRef<HTMLDivElement>(null);\n        const primaryActionsRef = useRef<HTMLDivElement>(null);\n        const secondaryActionsRef = useRef<HTMLDivElement>(null);\n        const wasHandledScroll = useRef<boolean>(false);\n        const onDomPositionReachedRef = useRef<OnDomPositionReached | undefined>(onDomPositionReached);\n        onDomPositionReachedRef.current = onDomPositionReached;\n        const [verticalLayout, setVerticalLayout] = useState<boolean | null>(null);\n        const verticalLayoutRef = useRef<boolean | null>(null);\n\n        const { shouldShowProgress, shouldShowDivider } = shouldShowDividerOrProgress({\n            isMobile,\n            showDivider,\n            showProgress,\n            isScrollEnd,\n        });\n\n        useEffect(() => {\n            if (shouldShowProgress || typeof showDivider === 'boolean') {\n                return void 0;\n            }\n            const scrollableParent = getScrollableParent(actionBarRef.current);\n            if (!scrollableParent) {\n                return void 0;\n            }\n            let handleScroll = throttle(() => {\n                wasHandledScroll.current = true;\n                const isScrollEnd =\n                    scrollableParent &&\n                    Math.abs(\n                        scrollableParent.scrollHeight - scrollableParent.clientHeight - scrollableParent.scrollTop\n                    ) < 1;\n                setIsScrollEnd(!!isScrollEnd);\n            }, SCROLL_HANDLER_THROTTLE_MS);\n\n            // для sticky дивайдер надо скрыть, когда блок встал на свое место в dom\n            if (isSticky) {\n                handleScroll = throttle(() => {\n                    wasHandledScroll.current = true;\n                    const bottomRect = actionBarRef.current?.getBoundingClientRect().bottom || 0;\n                    setIsScrollEnd(Math.abs(bottomRect - window.innerHeight) > 1);\n                }, SCROLL_HANDLER_THROTTLE_MS);\n            }\n\n            if (scrollableParent === document.documentElement) {\n                window.addEventListener('scroll', handleScroll);\n            } else {\n                scrollableParent.addEventListener('scroll', handleScroll);\n            }\n            return () => {\n                wasHandledScroll.current = false;\n                window.removeEventListener('scroll', handleScroll);\n                scrollableParent?.removeEventListener('scroll', handleScroll);\n            };\n        }, [shouldShowProgress, showDivider, isSticky]);\n\n        useEffect(() => {\n            if (!wasHandledScroll.current || !isFixedOrSticky) {\n                return;\n            }\n            onDomPositionReachedRef.current?.(isScrollEnd);\n        }, [isScrollEnd, isFixedOrSticky]);\n\n        const toggleVerticalLayout = useCallback((enable: boolean) => {\n            actionsStackRef.current?.classList.toggle(styles.actionsStackVertical, enable);\n            primaryActionsRef.current?.classList.toggle(STRETCHED_WRAPPER_CLASS, enable);\n            primaryActionsRef.current?.classList.toggle(styles.verticalActionsContainer, enable);\n            primaryActionsRef.current?.classList.toggle(styles.horizontalActionsContainer, !enable);\n            secondaryActionsRef.current?.classList.toggle(STRETCHED_WRAPPER_CLASS, enable);\n            secondaryActionsRef.current?.classList.toggle(styles.verticalActionsContainer, enable);\n            secondaryActionsRef.current?.classList.toggle(styles.horizontalActionsContainer, !enable);\n        }, []);\n\n        // Эффект проверяющий уместилось ли все содержимое и переключающий отображение на вертикальное\n        useLayoutEffect(() => {\n            if (!actionsStackRef.current || !actionsStackWrapperRef.current) {\n                return;\n            }\n\n            if (type !== 'auto') {\n                const enableVerticalLayout = type === 'vertical';\n                verticalLayoutRef.current = enableVerticalLayout;\n                setVerticalLayout(enableVerticalLayout);\n            } else {\n                toggleVerticalLayout(false);\n                const enableVerticalLayout =\n                    (!!additionalContentRef.current &&\n                        !!additionalContentWrapperRef.current &&\n                        (additionalContentRef.current.offsetHeight > additionalContentWrapperRef.current.offsetHeight ||\n                            additionalContentRef.current.offsetWidth >\n                                additionalContentWrapperRef.current.offsetWidth)) ||\n                    actionsStackRef.current.scrollWidth > actionsStackWrapperRef.current.offsetWidth;\n                if (enableVerticalLayout !== verticalLayoutRef.current) {\n                    verticalLayoutRef.current = enableVerticalLayout;\n                    setVerticalLayout(enableVerticalLayout);\n                } else {\n                    toggleVerticalLayout(verticalLayoutRef.current);\n                }\n            }\n        }, [type, primaryActions, secondaryActions, additionalContent, breakpoint, toggleVerticalLayout]);\n\n        const paddingValue = padding ? `${vertPadding ?? padding}px ${padding}px` : '';\n        return (\n            <Layer layer=\"action-bar\">\n                <div\n                    ref={actionBarRefCallback}\n                    data-qa=\"action-bar\"\n                    style={bottom ? { bottom: `${bottom}px` } : {}}\n                    className={classnames(\n                        styles.actionBar,\n                        {\n                            [styles.actionBarIsFixed]: isFixed,\n                            [styles.actionBarIsSticky]: isSticky,\n                            [styles.actionBarWithProgressBar]: shouldShowProgress,\n                        },\n                        className\n                    )}\n                >\n                    {shouldShowDivider && (\n                        <div data-qa=\"divider\">\n                            <Divider mode=\"horizontal\" />\n                        </div>\n                    )}\n                    {shouldShowProgress && (\n                        <div data-qa=\"progress-bar\" className={styles.progressBar}>\n                            {showProgress}\n                        </div>\n                    )}\n                    <div\n                        data-qa=\"actions-container\"\n                        className={classnames({\n                            [styles.actionBarWithDefaultPadding]: isFixedOrSticky && !paddingValue,\n                        })}\n                        style={paddingValue ? { padding: paddingValue } : {}}\n                    >\n                        <div ref={actionsStackWrapperRef} className={styles.actionsStackWrapper}>\n                            <div\n                                className={classnames(styles.actionsStack, {\n                                    [styles.actionsStackHorizontal]: !verticalLayout,\n                                    [styles.actionsStackVertical]: verticalLayout,\n                                    [styles.rightOnlyActions]: !secondaryActions && !additionalContent,\n                                })}\n                                ref={actionsStackRef}\n                                data-qa={`actions-container-${type}`}\n                            >\n                                {verticalLayout ? (\n                                    <>\n                                        {!!additionalContent && (\n                                            <div\n                                                className={classnames(styles.additionalContentContainer)}\n                                                key=\"additional-content\"\n                                            >\n                                                <div\n                                                    className={classnames(\n                                                        styles.additionalContentWrapper,\n                                                        styles.additionalContentVertical,\n                                                        {\n                                                            [styles.additionalContentOverflowWrapper]:\n                                                                !!primaryActions || !!secondaryActions,\n                                                        }\n                                                    )}\n                                                    ref={additionalContentWrapperRef}\n                                                >\n                                                    <div\n                                                        className={styles.additionalContentDimensions}\n                                                        ref={additionalContentRef}\n                                                        data-qa=\"additional-content\"\n                                                    >\n                                                        {additionalContent}\n                                                    </div>\n                                                </div>\n                                            </div>\n                                        )}\n                                        {!!primaryActions &&\n                                            (() => {\n                                                let verticalPrimaryActions = primaryActions;\n                                                let reverseFlexOrder = true;\n                                                if (Array.isArray(primaryActions)) {\n                                                    verticalPrimaryActions = Children.toArray(primaryActions).reverse();\n                                                    reverseFlexOrder = false;\n                                                } else if (\n                                                    isValidElement(primaryActions) &&\n                                                    primaryActions.type === Fragment\n                                                ) {\n                                                    verticalPrimaryActions = Children.toArray(\n                                                        (primaryActions.props as React.PropsWithChildren).children\n                                                    ).reverse();\n                                                    reverseFlexOrder = false;\n                                                }\n\n                                                return (\n                                                    <div\n                                                        className={classnames(\n                                                            styles.verticalActionsContainer,\n                                                            { [styles.reverse]: reverseFlexOrder },\n                                                            STRETCHED_WRAPPER_CLASS\n                                                        )}\n                                                        data-qa=\"primary-actions\"\n                                                        key=\"primary-actions\"\n                                                        ref={primaryActionsRef}\n                                                    >\n                                                        {verticalPrimaryActions}\n                                                    </div>\n                                                );\n                                            })()}\n                                        {!!secondaryActions && (\n                                            <div\n                                                className={classnames(\n                                                    styles.verticalActionsContainer,\n                                                    STRETCHED_WRAPPER_CLASS\n                                                )}\n                                                data-qa=\"secondary-actions\"\n                                                key=\"secondary-actions\"\n                                                ref={secondaryActionsRef}\n                                            >\n                                                {secondaryActions}\n                                            </div>\n                                        )}\n                                    </>\n                                ) : (\n                                    <>\n                                        {!!secondaryActions && (\n                                            <div\n                                                className={classnames(styles.horizontalActionsContainer)}\n                                                data-qa=\"secondary-actions\"\n                                                key=\"secondary-actions\"\n                                                ref={secondaryActionsRef}\n                                            >\n                                                {secondaryActions}\n                                            </div>\n                                        )}\n                                        {!!additionalContent && (\n                                            <div\n                                                className={classnames(styles.additionalContentContainer)}\n                                                key=\"additional-content\"\n                                            >\n                                                <div\n                                                    className={classnames(styles.additionalContentWrapper, {\n                                                        [styles.additionalContentOverflowWrapper]:\n                                                            !!primaryActions || !!secondaryActions,\n                                                    })}\n                                                    ref={additionalContentWrapperRef}\n                                                >\n                                                    <div\n                                                        ref={additionalContentRef}\n                                                        className={styles.additionalContentDimensions}\n                                                        data-qa=\"additional-content\"\n                                                    >\n                                                        {additionalContent}\n                                                    </div>\n                                                </div>\n                                            </div>\n                                        )}\n                                        {!!primaryActions && (\n                                            <div\n                                                className={classnames(styles.horizontalActionsContainer)}\n                                                data-qa=\"primary-actions\"\n                                                key=\"primary-actions\"\n                                                ref={primaryActionsRef}\n                                            >\n                                                {primaryActions}\n                                            </div>\n                                        )}\n                                    </>\n                                )}\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </Layer>\n        );\n    }\n);\n\nActionBarComponent.displayName = 'ActionBar';\nconst ActionBar = ActionBarComponent as typeof ActionBarComponent & { isActionBar: true };\nActionBar.isActionBar = true;\n\nexport { ActionBar };\n"],"names":["_jsx","_jsxs","_Fragment","Fragment"],"mappings":"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"}
+{"version":3,"file":"ActionBar.js","sources":["src/ActionBar.tsx"],"sourcesContent":["import {\n    Children,\n    Fragment,\n    forwardRef,\n    isValidElement,\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useRef,\n    useState,\n} from 'react';\nimport classnames from 'classnames';\n\nimport { throttle } from '@hh.ru/magritte-common-func-utils';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { ActionBarProps, OnDomPositionReached } from '@hh.ru/magritte-ui-action-bar/types';\nimport { getScrollableParent, shouldShowDividerOrProgress } from '@hh.ru/magritte-ui-action-bar/utils';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { STRETCHED_WRAPPER_CLASS } from '@hh.ru/magritte-ui-button';\nimport { Divider } from '@hh.ru/magritte-ui-divider';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\n\nimport styles from './action-bar.less';\n\nconst SCROLL_HANDLER_THROTTLE_MS = 50;\n\nconst ActionBarComponent = forwardRef<HTMLElement, ActionBarProps>(\n    (\n        {\n            type = 'horizontal',\n            showDivider = 'with-scroll',\n            showProgress = false,\n            primaryActions,\n            secondaryActions,\n            additionalContent,\n            padding,\n            vertPadding,\n            bottom = 0,\n            isFixed = false,\n            isSticky = false,\n            onDomPositionReached,\n            className,\n        },\n        ref\n    ) => {\n        const isFixedOrSticky = isFixed || isSticky;\n        const { breakpoint, isMobile } = useBreakpoint();\n        const [isScrollEnd, setIsScrollEnd] = useState(false);\n        const actionBarRef = useRef<HTMLDivElement>(null);\n        const actionBarRefCallback = useMultipleRefs(ref, actionBarRef);\n        const additionalContentRef = useRef<HTMLDivElement>(null);\n        const additionalContentWrapperRef = useRef<HTMLDivElement>(null);\n        const actionsStackWrapperRef = useRef<HTMLDivElement>(null);\n        const actionsStackRef = useRef<HTMLDivElement>(null);\n        const primaryActionsRef = useRef<HTMLDivElement>(null);\n        const secondaryActionsRef = useRef<HTMLDivElement>(null);\n        const wasHandledScroll = useRef<boolean>(false);\n        const onDomPositionReachedRef = useRef<OnDomPositionReached | undefined>(onDomPositionReached);\n        onDomPositionReachedRef.current = onDomPositionReached;\n        const [verticalLayout, setVerticalLayout] = useState<boolean | null>(null);\n        const verticalLayoutRef = useRef<boolean | null>(null);\n\n        const { shouldShowProgress, shouldShowDivider } = shouldShowDividerOrProgress({\n            isMobile,\n            showDivider,\n            showProgress,\n            isScrollEnd,\n        });\n\n        useEffect(() => {\n            if (shouldShowProgress || typeof showDivider === 'boolean') {\n                return void 0;\n            }\n            const scrollableParent = getScrollableParent(actionBarRef.current);\n            if (!scrollableParent) {\n                return void 0;\n            }\n            let handleScroll = throttle(() => {\n                wasHandledScroll.current = true;\n                const isScrollEnd =\n                    scrollableParent &&\n                    Math.abs(\n                        scrollableParent.scrollHeight - scrollableParent.clientHeight - scrollableParent.scrollTop\n                    ) < 1;\n                setIsScrollEnd(!!isScrollEnd);\n            }, SCROLL_HANDLER_THROTTLE_MS);\n\n            // для sticky дивайдер надо скрыть, когда блок встал на свое место в dom\n            if (isSticky) {\n                handleScroll = throttle(() => {\n                    wasHandledScroll.current = true;\n                    const bottomRect = actionBarRef.current?.getBoundingClientRect().bottom || 0;\n                    setIsScrollEnd(Math.abs(bottomRect - window.innerHeight) > 1);\n                }, SCROLL_HANDLER_THROTTLE_MS);\n            }\n\n            if (scrollableParent === document.documentElement) {\n                window.addEventListener('scroll', handleScroll);\n            } else {\n                scrollableParent.addEventListener('scroll', handleScroll);\n            }\n            return () => {\n                wasHandledScroll.current = false;\n                window.removeEventListener('scroll', handleScroll);\n                scrollableParent?.removeEventListener('scroll', handleScroll);\n            };\n        }, [shouldShowProgress, showDivider, isSticky]);\n\n        useEffect(() => {\n            if (!wasHandledScroll.current || !isFixedOrSticky) {\n                return;\n            }\n            onDomPositionReachedRef.current?.(isScrollEnd);\n        }, [isScrollEnd, isFixedOrSticky]);\n\n        const toggleVerticalLayout = useCallback((enable: boolean) => {\n            actionsStackRef.current?.classList.toggle(styles.actionsStackVertical, enable);\n            primaryActionsRef.current?.classList.toggle(STRETCHED_WRAPPER_CLASS, enable);\n            primaryActionsRef.current?.classList.toggle(styles.verticalActionsContainer, enable);\n            primaryActionsRef.current?.classList.toggle(styles.horizontalActionsContainer, !enable);\n            secondaryActionsRef.current?.classList.toggle(STRETCHED_WRAPPER_CLASS, enable);\n            secondaryActionsRef.current?.classList.toggle(styles.verticalActionsContainer, enable);\n            secondaryActionsRef.current?.classList.toggle(styles.horizontalActionsContainer, !enable);\n        }, []);\n\n        // Эффект проверяющий уместилось ли все содержимое и переключающий отображение на вертикальное\n        useLayoutEffect(() => {\n            if (!actionsStackRef.current || !actionsStackWrapperRef.current) {\n                return;\n            }\n\n            if (type !== 'auto') {\n                const enableVerticalLayout = type === 'vertical';\n                verticalLayoutRef.current = enableVerticalLayout;\n                setVerticalLayout(enableVerticalLayout);\n            } else {\n                toggleVerticalLayout(false);\n                const enableVerticalLayout =\n                    (!!additionalContentRef.current &&\n                        !!additionalContentWrapperRef.current &&\n                        (additionalContentRef.current.offsetHeight > additionalContentWrapperRef.current.offsetHeight ||\n                            additionalContentRef.current.offsetWidth >\n                                additionalContentWrapperRef.current.offsetWidth)) ||\n                    actionsStackRef.current.scrollWidth > actionsStackWrapperRef.current.offsetWidth;\n                if (enableVerticalLayout !== verticalLayoutRef.current) {\n                    verticalLayoutRef.current = enableVerticalLayout;\n                    setVerticalLayout(enableVerticalLayout);\n                } else {\n                    toggleVerticalLayout(verticalLayoutRef.current);\n                }\n            }\n        }, [type, primaryActions, secondaryActions, additionalContent, breakpoint, toggleVerticalLayout]);\n\n        const paddingValue = padding ? `${vertPadding ?? padding}px ${padding}px` : '';\n        return (\n            <Layer layer=\"action-bar\">\n                <div\n                    ref={actionBarRefCallback}\n                    data-qa=\"action-bar\"\n                    style={bottom ? { bottom: `${bottom}px` } : {}}\n                    className={classnames(\n                        styles.actionBar,\n                        {\n                            [styles.actionBarIsFixed]: isFixed,\n                            [styles.actionBarIsSticky]: isSticky,\n                            [styles.actionBarWithProgressBar]: shouldShowProgress,\n                        },\n                        className\n                    )}\n                >\n                    {shouldShowDivider && (\n                        <div data-qa=\"divider\">\n                            <Divider mode=\"horizontal\" />\n                        </div>\n                    )}\n                    {shouldShowProgress && (\n                        <div data-qa=\"progress-bar\" className={styles.progressBar}>\n                            {showProgress}\n                        </div>\n                    )}\n                    <div\n                        data-qa=\"actions-container\"\n                        className={classnames({\n                            [styles.actionBarWithDefaultPadding]: isFixedOrSticky && !paddingValue,\n                        })}\n                        style={paddingValue ? { padding: paddingValue } : {}}\n                    >\n                        <div ref={actionsStackWrapperRef} className={styles.actionsStackWrapper}>\n                            <div\n                                className={classnames(styles.actionsStack, {\n                                    [styles.actionsStackHorizontal]: !verticalLayout,\n                                    [styles.actionsStackVertical]: verticalLayout,\n                                    [styles.rightOnlyActions]: !secondaryActions && !additionalContent,\n                                })}\n                                ref={actionsStackRef}\n                                data-qa={`actions-container-${type}`}\n                            >\n                                {verticalLayout ? (\n                                    <>\n                                        {!!additionalContent && (\n                                            <div\n                                                className={classnames(styles.additionalContentContainer)}\n                                                key=\"additional-content\"\n                                            >\n                                                <div\n                                                    className={classnames(\n                                                        styles.additionalContentWrapper,\n                                                        styles.additionalContentVertical,\n                                                        {\n                                                            [styles.additionalContentOverflowWrapper]:\n                                                                !!primaryActions || !!secondaryActions,\n                                                        }\n                                                    )}\n                                                    ref={additionalContentWrapperRef}\n                                                >\n                                                    <div\n                                                        className={styles.additionalContentDimensions}\n                                                        ref={additionalContentRef}\n                                                        data-qa=\"additional-content\"\n                                                    >\n                                                        {additionalContent}\n                                                    </div>\n                                                </div>\n                                            </div>\n                                        )}\n                                        {!!primaryActions &&\n                                            (() => {\n                                                let verticalPrimaryActions = primaryActions;\n                                                let reverseFlexOrder = true;\n                                                if (Array.isArray(primaryActions)) {\n                                                    verticalPrimaryActions = Children.toArray(primaryActions).reverse();\n                                                    reverseFlexOrder = false;\n                                                } else if (\n                                                    isValidElement(primaryActions) &&\n                                                    primaryActions.type === Fragment\n                                                ) {\n                                                    verticalPrimaryActions = Children.toArray(\n                                                        (primaryActions.props as React.PropsWithChildren).children\n                                                    ).reverse();\n                                                    reverseFlexOrder = false;\n                                                }\n\n                                                return (\n                                                    <div\n                                                        className={classnames(\n                                                            styles.verticalActionsContainer,\n                                                            { [styles.reverse]: reverseFlexOrder },\n                                                            STRETCHED_WRAPPER_CLASS\n                                                        )}\n                                                        data-qa=\"primary-actions\"\n                                                        key=\"primary-actions\"\n                                                        ref={primaryActionsRef}\n                                                    >\n                                                        {verticalPrimaryActions}\n                                                    </div>\n                                                );\n                                            })()}\n                                        {!!secondaryActions && (\n                                            <div\n                                                className={classnames(\n                                                    styles.verticalActionsContainer,\n                                                    STRETCHED_WRAPPER_CLASS\n                                                )}\n                                                data-qa=\"secondary-actions\"\n                                                key=\"secondary-actions\"\n                                                ref={secondaryActionsRef}\n                                            >\n                                                {secondaryActions}\n                                            </div>\n                                        )}\n                                    </>\n                                ) : (\n                                    <>\n                                        {!!secondaryActions && (\n                                            <div\n                                                className={classnames(styles.horizontalActionsContainer)}\n                                                data-qa=\"secondary-actions\"\n                                                key=\"secondary-actions\"\n                                                ref={secondaryActionsRef}\n                                            >\n                                                {secondaryActions}\n                                            </div>\n                                        )}\n                                        {!!additionalContent && (\n                                            <div\n                                                className={classnames(styles.additionalContentContainer)}\n                                                key=\"additional-content\"\n                                            >\n                                                <div\n                                                    className={classnames(styles.additionalContentWrapper, {\n                                                        [styles.additionalContentOverflowWrapper]:\n                                                            !!primaryActions || !!secondaryActions,\n                                                    })}\n                                                    ref={additionalContentWrapperRef}\n                                                >\n                                                    <div\n                                                        ref={additionalContentRef}\n                                                        className={styles.additionalContentDimensions}\n                                                        data-qa=\"additional-content\"\n                                                    >\n                                                        {additionalContent}\n                                                    </div>\n                                                </div>\n                                            </div>\n                                        )}\n                                        {!!primaryActions && (\n                                            <div\n                                                className={classnames(styles.horizontalActionsContainer)}\n                                                data-qa=\"primary-actions\"\n                                                key=\"primary-actions\"\n                                                ref={primaryActionsRef}\n                                            >\n                                                {primaryActions}\n                                            </div>\n                                        )}\n                                    </>\n                                )}\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </Layer>\n        );\n    }\n);\n\nActionBarComponent.displayName = 'ActionBar';\nconst ActionBar = ActionBarComponent as typeof ActionBarComponent & { isActionBar: true };\nActionBar.isActionBar = true;\n\nexport { ActionBar };\n"],"names":["_jsx","_jsxs","_Fragment","Fragment"],"mappings":"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"}

package/ActionBarViewportAdapter.js

@@ -5,7 +5,7 @@ import { getScrollbarWidth } from '@hh.ru/magritte-common-modal-helper';
 import { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';
 import { isActionBarComponent } from './types.js';
 
-var styles = {"action-bar-viewport-adapter":"magritte-action-bar-viewport-adapter___yKxEe_5-3-4","actionBarViewportAdapter":"magritte-action-bar-viewport-adapter___yKxEe_5-3-4"};
+var styles = {"action-bar-viewport-adapter":"magritte-action-bar-viewport-adapter___yKxEe_5-3-6","actionBarViewportAdapter":"magritte-action-bar-viewport-adapter___yKxEe_5-3-6"};
 
 const ActionBarViewportAdapter = ({ children }) => {
     const isActionBarIntoChildren = isActionBarComponent(children);

package/ActionBarViewportAdapter.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionBarViewportAdapter.js","sources":["../src/ActionBarViewportAdapter.tsx"],"sourcesContent":["import { useLayoutEffect, PropsWithChildren, cloneElement, FC, useRef, ReactElement, type Ref } from 'react';\nimport classnames from 'classnames';\n\nimport { getScrollbarWidth } from '@hh.ru/magritte-common-modal-helper';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { isActionBarComponent, ActionBarProps } from '@hh.ru/magritte-ui-action-bar/types';\n\nimport styles from './action-bar-adapter.less';\n\ntype ActionBarRefHelper = { ref?: Ref<HTMLElement> };\ntype ActionBarElementWithRef = ReactElement<ActionBarProps> & ActionBarRefHelper;\n\nconst ActionBarViewportAdapter: FC<PropsWithChildren> = ({ children }) => {\n    const isActionBarIntoChildren = isActionBarComponent(children);\n    const actionBarViewportAdapterRef = useRef<HTMLDivElement>(null);\n    const actionBarViewportAdapterRefCallback = useMultipleRefs(\n        actionBarViewportAdapterRef,\n        (children as ActionBarElementWithRef).ref\n    );\n\n    useLayoutEffect(() => {\n        if (!isActionBarIntoChildren || !actionBarViewportAdapterRef?.current) {\n            return;\n        }\n        const scrollbarWidth = getScrollbarWidth();\n        actionBarViewportAdapterRef.current.style.setProperty(\n            '--magritte-ui-action-bar-scroll-width',\n            `${scrollbarWidth}px`\n        );\n    }, [isActionBarIntoChildren, actionBarViewportAdapterRef]);\n\n    if (!isActionBarIntoChildren) {\n        return null;\n    }\n\n    const typedChildren = children as ReactElement<ActionBarProps & ActionBarRefHelper>;\n    return cloneElement(typedChildren, {\n        ref: actionBarViewportAdapterRefCallback,\n        className: classnames(styles.actionBarViewportAdapter, children.props.className),\n    });\n};\n\nexport { ActionBarViewportAdapter };\n"],"names":[],"mappings":";;;;;;;;AAYA,MAAM,wBAAwB,GAA0B,CAAC,EAAE,QAAQ,EAAE,KAAI;AACrE,IAAA,MAAM,uBAAuB,GAAG,oBAAoB,CAAC,QAAQ,CAAC,CAAC;AAC/D,IAAA,MAAM,2BAA2B,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACjE,MAAM,mCAAmC,GAAG,eAAe,CACvD,2BAA2B,EAC1B,QAAoC,CAAC,GAAG,CAC5C,CAAC;IAEF,eAAe,CAAC,MAAK;QACjB,IAAI,CAAC,uBAAuB,IAAI,CAAC,2BAA2B,EAAE,OAAO,EAAE;YACnE,OAAO;SACV;AACD,QAAA,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAC;AAC3C,QAAA,2BAA2B,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,CACjD,uCAAuC,EACvC,CAAA,EAAG,cAAc,CAAA,EAAA,CAAI,CACxB,CAAC;AACN,KAAC,EAAE,CAAC,uBAAuB,EAAE,2BAA2B,CAAC,CAAC,CAAC;IAE3D,IAAI,CAAC,uBAAuB,EAAE;AAC1B,QAAA,OAAO,IAAI,CAAC;KACf;IAED,MAAM,aAAa,GAAG,QAA6D,CAAC;IACpF,OAAO,YAAY,CAAC,aAAa,EAAE;AAC/B,QAAA,GAAG,EAAE,mCAAmC;AACxC,QAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,wBAAwB,EAAE,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC;AACnF,KAAA,CAAC,CAAC;AACP;;;;"}
+{"version":3,"file":"ActionBarViewportAdapter.js","sources":["src/ActionBarViewportAdapter.tsx"],"sourcesContent":["import { useLayoutEffect, PropsWithChildren, cloneElement, FC, useRef, ReactElement, type Ref } from 'react';\nimport classnames from 'classnames';\n\nimport { getScrollbarWidth } from '@hh.ru/magritte-common-modal-helper';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { isActionBarComponent, ActionBarProps } from '@hh.ru/magritte-ui-action-bar/types';\n\nimport styles from './action-bar-adapter.less';\n\ntype ActionBarRefHelper = { ref?: Ref<HTMLElement> };\ntype ActionBarElementWithRef = ReactElement<ActionBarProps> & ActionBarRefHelper;\n\nconst ActionBarViewportAdapter: FC<PropsWithChildren> = ({ children }) => {\n    const isActionBarIntoChildren = isActionBarComponent(children);\n    const actionBarViewportAdapterRef = useRef<HTMLDivElement>(null);\n    const actionBarViewportAdapterRefCallback = useMultipleRefs(\n        actionBarViewportAdapterRef,\n        (children as ActionBarElementWithRef).ref\n    );\n\n    useLayoutEffect(() => {\n        if (!isActionBarIntoChildren || !actionBarViewportAdapterRef?.current) {\n            return;\n        }\n        const scrollbarWidth = getScrollbarWidth();\n        actionBarViewportAdapterRef.current.style.setProperty(\n            '--magritte-ui-action-bar-scroll-width',\n            `${scrollbarWidth}px`\n        );\n    }, [isActionBarIntoChildren, actionBarViewportAdapterRef]);\n\n    if (!isActionBarIntoChildren) {\n        return null;\n    }\n\n    const typedChildren = children as ReactElement<ActionBarProps & ActionBarRefHelper>;\n    return cloneElement(typedChildren, {\n        ref: actionBarViewportAdapterRefCallback,\n        className: classnames(styles.actionBarViewportAdapter, children.props.className),\n    });\n};\n\nexport { ActionBarViewportAdapter };\n"],"names":[],"mappings":";;;;;;;;AAYA,MAAM,wBAAwB,GAA0B,CAAC,EAAE,QAAQ,EAAE,KAAI;AACrE,IAAA,MAAM,uBAAuB,GAAG,oBAAoB,CAAC,QAAQ,CAAC,CAAC;AAC/D,IAAA,MAAM,2BAA2B,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACjE,MAAM,mCAAmC,GAAG,eAAe,CACvD,2BAA2B,EAC1B,QAAoC,CAAC,GAAG,CAC5C,CAAC;IAEF,eAAe,CAAC,MAAK;QACjB,IAAI,CAAC,uBAAuB,IAAI,CAAC,2BAA2B,EAAE,OAAO,EAAE;YACnE,OAAO;SACV;AACD,QAAA,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAC;AAC3C,QAAA,2BAA2B,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,CACjD,uCAAuC,EACvC,CAAA,EAAG,cAAc,CAAA,EAAA,CAAI,CACxB,CAAC;AACN,KAAC,EAAE,CAAC,uBAAuB,EAAE,2BAA2B,CAAC,CAAC,CAAC;IAE3D,IAAI,CAAC,uBAAuB,EAAE;AAC1B,QAAA,OAAO,IAAI,CAAC;KACf;IAED,MAAM,aAAa,GAAG,QAA6D,CAAC;IACpF,OAAO,YAAY,CAAC,aAAa,EAAE;AAC/B,QAAA,GAAG,EAAE,mCAAmC;AACxC,QAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,wBAAwB,EAAE,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC;AACnF,KAAA,CAAC,CAAC;AACP;;;;"}

package/index.css

@@ -1,145 +1,145 @@
 :root{
-  --magritte-color-background-body-v24-4-0:#ffffff;
+  --magritte-color-background-body-v24-4-1:#ffffff;
 }
 
 .magritte-night-theme{
-  --magritte-color-background-body-v24-4-0:#000000;
+  --magritte-color-background-body-v24-4-1:#000000;
 }
-.magritte-action-bar___Tkm7C_5-3-4{
+.magritte-action-bar___Tkm7C_5-3-6{
   --magritte-ui-action-bar-scroll-width:0;
-  background-color:var(--magritte-ui-action-bar-background-color-override, var(--magritte-ui-container-background-color-override, var(--magritte-color-background-body-v24-4-0)));
+  background-color:var(--magritte-ui-action-bar-background-color-override, var(--magritte-ui-container-background-color-override, var(--magritte-color-background-body-v24-4-1)));
 }
-.magritte-action-bar-is-fixed___Zjqtf_5-3-4{
+.magritte-action-bar-is-fixed___Zjqtf_5-3-6{
   position:fixed;
   bottom:0;
   left:0;
   width:100%;
 }
-.magritte-action-bar-is-sticky___q272C_5-3-4{
+.magritte-action-bar-is-sticky___q272C_5-3-6{
   position:sticky;
   bottom:0;
   left:0;
   width:100%;
   margin-left:calc(-50vw + 50%);
 }
-.magritte-action-bar-with-default-padding___QcKnA_5-3-4{
+.magritte-action-bar-with-default-padding___QcKnA_5-3-6{
   padding:16px 0;
 }
-body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
+body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
   padding:16px;
 }
 @media (min-width: 600px){
-  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
+  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
     padding:16px 56px;
   }
 }
 @media (min-width: 1024px){
-  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
+  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
     margin:0 auto;
     padding:16px 0px;
-    width:888px;
+    width:984px;
   }
 }
 @media (min-width: 1280px){
-  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
-    width:1128px;
+  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
+    width:1200px;
   }
 }
 @media (min-width: 1440px){
-  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
-    width:1224px;
+  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
+    width:1272px;
   }
 }
 @media (min-width: 1920px){
-  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
+  body:not(.magritte-old-layout) .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
     width:1416px;
   }
 }
-body.magritte-old-layout .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
+body.magritte-old-layout .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
   padding:15px;
 }
 @media (min-width: 700px){
-  body.magritte-old-layout .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
+  body.magritte-old-layout .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
     margin:0 auto;
     width:610px;
   }
 }
 @media (min-width: 1020px){
-  body.magritte-old-layout .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
+  body.magritte-old-layout .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
     width:930px;
   }
 }
 @media (min-width: 1340px){
-  body.magritte-old-layout .magritte-action-bar-with-default-padding___QcKnA_5-3-4{
+  body.magritte-old-layout .magritte-action-bar-with-default-padding___QcKnA_5-3-6{
     width:1250px;
   }
 }
-.magritte-action-bar-with-progress-bar___mprqw_5-3-4{
+.magritte-action-bar-with-progress-bar___mprqw_5-3-6{
   border-radius:8px 8px 0 0;
 }
-.magritte-actions-stack___12VkP_5-3-4{
+.magritte-actions-stack___12VkP_5-3-6{
   display:flex;
   width:100%;
 }
-.magritte-actions-stack___12VkP_5-3-4.magritte-right-only-actions___84fc8_5-3-4{
+.magritte-actions-stack___12VkP_5-3-6.magritte-right-only-actions___84fc8_5-3-6{
   justify-content:flex-end;
 }
-.magritte-actions-stack_horizontal___p3HgB_5-3-4{
+.magritte-actions-stack_horizontal___p3HgB_5-3-6{
   display:flex;
   flex-direction:row;
   justify-content:space-between;
   gap:24px;
 }
-.magritte-actions-stack_vertical___5UtzF_5-3-4{
+.magritte-actions-stack_vertical___5UtzF_5-3-6{
   display:flex;
   flex-direction:column;
   gap:12px;
 }
-.magritte-actions-stack_vertical___5UtzF_5-3-4 .magritte-additional-content-overflow-wrapper___hpCEQ_5-3-4{
+.magritte-actions-stack_vertical___5UtzF_5-3-6 .magritte-additional-content-overflow-wrapper___hpCEQ_5-3-6{
   position:static;
 }
-.magritte-additional-content-container___N4Q-l_5-3-4{
+.magritte-additional-content-container___N4Q-l_5-3-6{
   display:flex;
   flex:1 1 100%;
   overflow:hidden;
   position:relative;
 }
-.magritte-additional-content-container___N4Q-l_5-3-4.magritte-additional-content-vertical___3Ba1i_5-3-4{
+.magritte-additional-content-container___N4Q-l_5-3-6.magritte-additional-content-vertical___3Ba1i_5-3-6{
   margin-bottom:2px;
 }
-.magritte-additional-content-overflow-wrapper___hpCEQ_5-3-4{
+.magritte-additional-content-overflow-wrapper___hpCEQ_5-3-6{
   position:absolute;
   inset:0;
 }
-.magritte-additional-content-wrapper___dpdp5_5-3-4{
+.magritte-additional-content-wrapper___dpdp5_5-3-6{
   width:100%;
 }
-.magritte-additional-content-dimensions___yEIwY_5-3-4{
+.magritte-additional-content-dimensions___yEIwY_5-3-6{
   display:flex;
   align-items:center;
   width:100%;
   min-height:100%;
 }
-.magritte-horizontal-actions-container___dKSH8_5-3-4{
+.magritte-horizontal-actions-container___dKSH8_5-3-6{
   display:flex;
   flex:0 0 auto;
   gap:12px;
   align-items:center;
 }
-.magritte-vertical-actions-container___j1toG_5-3-4{
+.magritte-vertical-actions-container___j1toG_5-3-6{
   display:flex;
   flex-direction:column;
   gap:12px;
   align-items:center;
 }
-.magritte-vertical-actions-container___j1toG_5-3-4.magritte-reverse___mFIgd_5-3-4{
+.magritte-vertical-actions-container___j1toG_5-3-6.magritte-reverse___mFIgd_5-3-6{
   flex-direction:column-reverse;
 }
-.magritte-progress-bar___tSTjx_5-3-4{
+.magritte-progress-bar___tSTjx_5-3-6{
   padding:4px 4px 0;
 }
 
-.magritte-action-bar-viewport-adapter___yKxEe_5-3-4{
+.magritte-action-bar-viewport-adapter___yKxEe_5-3-6{
   width:calc(100vw - var(--magritte-ui-action-bar-scroll-width));
   margin-left:calc(-50vw + 50% + var(--magritte-ui-action-bar-scroll-width) / 2);
 }

package/index.mock.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.mock.js","sources":["../src/index.mock.ts"],"sourcesContent":["import { ForwardRefExoticComponent } from 'react';\n\nimport { isActionBarComponent as checkFunction } from '@hh.ru/magritte-ui-action-bar/types';\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\n\nexport const ActionBar: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n    'ActionBar',\n    { isActionBar: true },\n    {\n        withChildren: false,\n    }\n);\n\nexport const isActionBarComponent = checkFunction;\n"],"names":["checkFunction"],"mappings":";;;;AAKO,MAAM,SAAS,GAAuD,aAAa,CACtF,WAAW,EACX,EAAE,WAAW,EAAE,IAAI,EAAE,EACrB;AACI,IAAA,YAAY,EAAE,KAAK;AACtB,CAAA,EACH;AAEK,MAAM,oBAAoB,GAAGA;;;;"}
+{"version":3,"file":"index.mock.js","sources":["src/index.mock.ts"],"sourcesContent":["import { ForwardRefExoticComponent } from 'react';\n\nimport { isActionBarComponent as checkFunction } from '@hh.ru/magritte-ui-action-bar/types';\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\n\nexport const ActionBar: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n    'ActionBar',\n    { isActionBar: true },\n    {\n        withChildren: false,\n    }\n);\n\nexport const isActionBarComponent = checkFunction;\n"],"names":["checkFunction"],"mappings":";;;;AAKO,MAAM,SAAS,GAAuD,aAAa,CACtF,WAAW,EACX,EAAE,WAAW,EAAE,IAAI,EAAE,EACrB;AACI,IAAA,YAAY,EAAE,KAAK;AACtB,CAAA,EACH;AAEK,MAAM,oBAAoB,GAAGA;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hh.ru/magritte-ui-action-bar",
-  "version": "5.3.4",
+  "version": "5.3.6",
   "main": "index.js",
   "types": "index.d.ts",
   "sideEffects": [
@@ -19,18 +19,18 @@
     "watch": "yarn root:watch $(pwd)"
   },
   "dependencies": {
-    "@hh.ru/magritte-common-func-utils": "1.3.14",
-    "@hh.ru/magritte-common-modal-helper": "1.3.0",
-    "@hh.ru/magritte-common-use-multiple-refs": "1.1.10",
-    "@hh.ru/magritte-design-tokens": "24.4.0",
-    "@hh.ru/magritte-internal-layer-name": "3.4.0",
-    "@hh.ru/magritte-types": "5.0.5",
-    "@hh.ru/magritte-ui-breakpoint": "6.0.6",
-    "@hh.ru/magritte-ui-button": "7.1.4",
-    "@hh.ru/magritte-ui-divider": "3.0.16",
-    "@hh.ru/magritte-ui-grid": "2.2.49",
-    "@hh.ru/magritte-ui-layer": "3.2.1",
-    "@hh.ru/magritte-ui-mock-component": "1.1.6"
+    "@hh.ru/magritte-common-func-utils": "1.3.15",
+    "@hh.ru/magritte-common-modal-helper": "1.3.1",
+    "@hh.ru/magritte-common-use-multiple-refs": "1.1.11",
+    "@hh.ru/magritte-design-tokens": "24.4.1",
+    "@hh.ru/magritte-internal-layer-name": "3.4.1",
+    "@hh.ru/magritte-types": "5.0.6",
+    "@hh.ru/magritte-ui-breakpoint": "6.0.8",
+    "@hh.ru/magritte-ui-button": "7.1.6",
+    "@hh.ru/magritte-ui-divider": "3.0.17",
+    "@hh.ru/magritte-ui-grid": "3.0.0",
+    "@hh.ru/magritte-ui-layer": "3.2.2",
+    "@hh.ru/magritte-ui-mock-component": "1.1.7"
   },
   "peerDependencies": {
     "classnames": ">=2.3.2",
@@ -39,5 +39,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "7cea3ac4f7f947bba409d2fbc29284343113c4ba"
+  "gitHead": "9a088ded46caac9429f3e9fadaf055300b36990e"
 }

package/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sources":["../src/types.ts"],"sourcesContent":["import { type ReactNode, type ReactElement, isValidElement } from 'react';\n\nimport { ShowDivider } from '@hh.ru/magritte-ui-divider';\n\nexport type ActionBarType = 'horizontal' | 'vertical' | 'auto';\n\nexport interface OnDomPositionReached {\n    (isScrollEnd: boolean): void;\n}\n\ninterface BaseActionBarProps {\n    /** Тип ActionBar */\n    type?: ActionBarType;\n    /**\n     * Дополнительный контент размещаемый в контейнере над кнопками для вертикального отображения, либо в контейнере\n     * между кнопками для горизонтального отображения\n     */\n    additionalContent?: ReactNode;\n    /** Primary кнопки */\n    primaryActions?: ReactNode;\n    /** Secondary кнопки */\n    secondaryActions?: ReactNode;\n    /** Вертикальные/горизонтальные отступы */\n    padding?: number;\n    /** Вертикальные отступы (оверрайд для свойства padding) */\n    vertPadding?: number;\n    /** Позиция ActionBar для isFixed/isSticky */\n    bottom?: number;\n    /** Флаг, который позволяет зафиксировать ActionBar у нижней границы окна */\n    isFixed?: boolean;\n    /**\n     * Флаг, который позволяет зафиксировать ActionBar у нижней границы окна\n     * При достижении своей позиции в DOM, ActionBar перестанет следовать за скроллом\n     * */\n    isSticky?: boolean;\n    /**\n     * Callback вызывается, когда ActionBar достигнет своей позиции в DOM или прилипает к нижней границе экрана\n     * В случае isFixed - callback вызовется, когда пользователь доскролит до конца страницы\n     * */\n    onDomPositionReached?: OnDomPositionReached;\n    /** css-класс для позиционирования action-bar */\n    className?: string;\n}\n\ntype ActionBarDividerProgressProps =\n    | {\n          /** Режим работы разделителя */\n          showDivider?: ShowDivider;\n          /** Позволяет включить `ProgressBar` */\n          showProgress?: never;\n      }\n    | { showDivider?: never; showProgress?: ReactNode };\n\nexport type ActionBarProps = BaseActionBarProps & ActionBarDividerProgressProps;\n\nexport const isActionBarComponent = (component: ReactNode): component is ReactElement<ActionBarProps> => {\n    return (\n        isValidElement(component) && typeof component.type === 'object' && 'isActionBar' in (component?.type as object)\n    );\n};\n"],"names":[],"mappings":";;AAuDa,MAAA,oBAAoB,GAAG,CAAC,SAAoB,KAA+C;AACpG,IAAA,QACI,cAAc,CAAC,SAAS,CAAC,IAAI,OAAO,SAAS,CAAC,IAAI,KAAK,QAAQ,IAAI,aAAa,IAAK,SAAS,EAAE,IAAe,EACjH;AACN;;;;"}
+{"version":3,"file":"types.js","sources":["src/types.ts"],"sourcesContent":["import { type ReactNode, type ReactElement, isValidElement } from 'react';\n\nimport { ShowDivider } from '@hh.ru/magritte-ui-divider';\n\nexport type ActionBarType = 'horizontal' | 'vertical' | 'auto';\n\nexport interface OnDomPositionReached {\n    (isScrollEnd: boolean): void;\n}\n\ninterface BaseActionBarProps {\n    /** Тип ActionBar */\n    type?: ActionBarType;\n    /**\n     * Дополнительный контент размещаемый в контейнере над кнопками для вертикального отображения, либо в контейнере\n     * между кнопками для горизонтального отображения\n     */\n    additionalContent?: ReactNode;\n    /** Primary кнопки */\n    primaryActions?: ReactNode;\n    /** Secondary кнопки */\n    secondaryActions?: ReactNode;\n    /** Вертикальные/горизонтальные отступы */\n    padding?: number;\n    /** Вертикальные отступы (оверрайд для свойства padding) */\n    vertPadding?: number;\n    /** Позиция ActionBar для isFixed/isSticky */\n    bottom?: number;\n    /** Флаг, который позволяет зафиксировать ActionBar у нижней границы окна */\n    isFixed?: boolean;\n    /**\n     * Флаг, который позволяет зафиксировать ActionBar у нижней границы окна\n     * При достижении своей позиции в DOM, ActionBar перестанет следовать за скроллом\n     * */\n    isSticky?: boolean;\n    /**\n     * Callback вызывается, когда ActionBar достигнет своей позиции в DOM или прилипает к нижней границе экрана\n     * В случае isFixed - callback вызовется, когда пользователь доскролит до конца страницы\n     * */\n    onDomPositionReached?: OnDomPositionReached;\n    /** css-класс для позиционирования action-bar */\n    className?: string;\n}\n\ntype ActionBarDividerProgressProps =\n    | {\n          /** Режим работы разделителя */\n          showDivider?: ShowDivider;\n          /** Позволяет включить `ProgressBar` */\n          showProgress?: never;\n      }\n    | { showDivider?: never; showProgress?: ReactNode };\n\nexport type ActionBarProps = BaseActionBarProps & ActionBarDividerProgressProps;\n\nexport const isActionBarComponent = (component: ReactNode): component is ReactElement<ActionBarProps> => {\n    return (\n        isValidElement(component) && typeof component.type === 'object' && 'isActionBar' in (component?.type as object)\n    );\n};\n"],"names":[],"mappings":";;AAuDa,MAAA,oBAAoB,GAAG,CAAC,SAAoB,KAA+C;AACpG,IAAA,QACI,cAAc,CAAC,SAAS,CAAC,IAAI,OAAO,SAAS,CAAC,IAAI,KAAK,QAAQ,IAAI,aAAa,IAAK,SAAS,EAAE,IAAe,EACjH;AACN;;;;"}

package/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import React, { ReactNode } from 'react';\n\nimport { ShowDivider } from '@hh.ru/magritte-ui-divider';\n\nexport const getScrollableParent = (node: HTMLElement | null): HTMLElement | null => {\n    if (node == null) {\n        return null;\n    }\n    if (node.scrollHeight > node.clientHeight) {\n        return node;\n    }\n    return getScrollableParent(node.parentElement);\n};\n\nexport const shouldShowDividerOrProgress = ({\n    isMobile,\n    showDivider,\n    showProgress,\n    isScrollEnd,\n}: {\n    isMobile: boolean;\n    showDivider: ShowDivider | undefined;\n    showProgress: ReactNode | undefined;\n    isScrollEnd: boolean;\n}): { shouldShowProgress: boolean; shouldShowDivider: boolean } => {\n    const shouldShowProgress = isMobile ? false : React.isValidElement(showProgress);\n    if (shouldShowProgress) {\n        return {\n            shouldShowProgress,\n            shouldShowDivider: false,\n        };\n    }\n    const shouldShowDivider =\n        // eslint-disable-next-line no-nested-ternary\n        typeof showDivider === 'boolean' ? showDivider : showDivider === 'always' ? true : !isScrollEnd;\n    return {\n        shouldShowProgress: false,\n        shouldShowDivider,\n    };\n};\n"],"names":[],"mappings":";;AAIa,MAAA,mBAAmB,GAAG,CAAC,IAAwB,KAAwB;AAChF,IAAA,IAAI,IAAI,IAAI,IAAI,EAAE;AACd,QAAA,OAAO,IAAI,CAAC;KACf;IACD,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,EAAE;AACvC,QAAA,OAAO,IAAI,CAAC;KACf;AACD,IAAA,OAAO,mBAAmB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;AACnD,EAAE;AAEK,MAAM,2BAA2B,GAAG,CAAC,EACxC,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,WAAW,GAMd,KAAiE;AAC9D,IAAA,MAAM,kBAAkB,GAAG,QAAQ,GAAG,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IACjF,IAAI,kBAAkB,EAAE;QACpB,OAAO;YACH,kBAAkB;AAClB,YAAA,iBAAiB,EAAE,KAAK;SAC3B,CAAC;KACL;AACD,IAAA,MAAM,iBAAiB;;IAEnB,OAAO,WAAW,KAAK,SAAS,GAAG,WAAW,GAAG,WAAW,KAAK,QAAQ,GAAG,IAAI,GAAG,CAAC,WAAW,CAAC;IACpG,OAAO;AACH,QAAA,kBAAkB,EAAE,KAAK;QACzB,iBAAiB;KACpB,CAAC;AACN;;;;"}
+{"version":3,"file":"utils.js","sources":["src/utils.ts"],"sourcesContent":["import React, { ReactNode } from 'react';\n\nimport { ShowDivider } from '@hh.ru/magritte-ui-divider';\n\nexport const getScrollableParent = (node: HTMLElement | null): HTMLElement | null => {\n    if (node == null) {\n        return null;\n    }\n    if (node.scrollHeight > node.clientHeight) {\n        return node;\n    }\n    return getScrollableParent(node.parentElement);\n};\n\nexport const shouldShowDividerOrProgress = ({\n    isMobile,\n    showDivider,\n    showProgress,\n    isScrollEnd,\n}: {\n    isMobile: boolean;\n    showDivider: ShowDivider | undefined;\n    showProgress: ReactNode | undefined;\n    isScrollEnd: boolean;\n}): { shouldShowProgress: boolean; shouldShowDivider: boolean } => {\n    const shouldShowProgress = isMobile ? false : React.isValidElement(showProgress);\n    if (shouldShowProgress) {\n        return {\n            shouldShowProgress,\n            shouldShowDivider: false,\n        };\n    }\n    const shouldShowDivider =\n        // eslint-disable-next-line no-nested-ternary\n        typeof showDivider === 'boolean' ? showDivider : showDivider === 'always' ? true : !isScrollEnd;\n    return {\n        shouldShowProgress: false,\n        shouldShowDivider,\n    };\n};\n"],"names":[],"mappings":";;AAIa,MAAA,mBAAmB,GAAG,CAAC,IAAwB,KAAwB;AAChF,IAAA,IAAI,IAAI,IAAI,IAAI,EAAE;AACd,QAAA,OAAO,IAAI,CAAC;KACf;IACD,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,EAAE;AACvC,QAAA,OAAO,IAAI,CAAC;KACf;AACD,IAAA,OAAO,mBAAmB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;AACnD,EAAE;AAEK,MAAM,2BAA2B,GAAG,CAAC,EACxC,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,WAAW,GAMd,KAAiE;AAC9D,IAAA,MAAM,kBAAkB,GAAG,QAAQ,GAAG,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IACjF,IAAI,kBAAkB,EAAE;QACpB,OAAO;YACH,kBAAkB;AAClB,YAAA,iBAAiB,EAAE,KAAK;SAC3B,CAAC;KACL;AACD,IAAA,MAAM,iBAAiB;;IAEnB,OAAO,WAAW,KAAK,SAAS,GAAG,WAAW,GAAG,WAAW,KAAK,QAAQ,GAAG,IAAI,GAAG,CAAC,WAAW,CAAC;IACpG,OAAO;AACH,QAAA,kBAAkB,EAAE,KAAK;QACzB,iBAAiB;KACpB,CAAC;AACN;;;;"}