npm - @hh.ru/magritte-ui-action-bar - Versions diffs - 5.3.32 → 5.4.0 - Mend

@hh.ru/magritte-ui-action-bar 5.3.32 → 5.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/ActionBar.js +10 -4
package/ActionBar.js.map +1 -1
package/ActionBarViewportAdapter.js +1 -1
package/index.css +30 -30
package/package.json +3 -3
package/types.d.ts +2 -0
package/types.js.map +1 -1

package/ActionBar.js CHANGED Viewed

@@ -12,12 +12,12 @@ import { Divider } from '@hh.ru/magritte-ui-divider';
 import { Layer } from '@hh.ru/magritte-ui-layer';
 import '@hh.ru/magritte-internal-default-props-context';
-var styles = {"action-bar":"magritte-action-bar___Tkm7C_5-3-32","actionBar":"magritte-action-bar___Tkm7C_5-3-32","action-bar-is-fixed":"magritte-action-bar-is-fixed___Zjqtf_5-3-32","actionBarIsFixed":"magritte-action-bar-is-fixed___Zjqtf_5-3-32","action-bar-is-sticky":"magritte-action-bar-is-sticky___q272C_5-3-32","actionBarIsSticky":"magritte-action-bar-is-sticky___q272C_5-3-32","action-bar-with-default-padding":"magritte-action-bar-with-default-padding___QcKnA_5-3-32","actionBarWithDefaultPadding":"magritte-action-bar-with-default-padding___QcKnA_5-3-32","action-bar-with-progress-bar":"magritte-action-bar-with-progress-bar___mprqw_5-3-32","actionBarWithProgressBar":"magritte-action-bar-with-progress-bar___mprqw_5-3-32","actions-stack":"magritte-actions-stack___12VkP_5-3-32","actionsStack":"magritte-actions-stack___12VkP_5-3-32","right-only-actions":"magritte-right-only-actions___84fc8_5-3-32","rightOnlyActions":"magritte-right-only-actions___84fc8_5-3-32","actions-stack_horizontal":"magritte-actions-stack_horizontal___p3HgB_5-3-32","actionsStackHorizontal":"magritte-actions-stack_horizontal___p3HgB_5-3-32","actions-stack_vertical":"magritte-actions-stack_vertical___5UtzF_5-3-32","actionsStackVertical":"magritte-actions-stack_vertical___5UtzF_5-3-32","additional-content-overflow-wrapper":"magritte-additional-content-overflow-wrapper___hpCEQ_5-3-32","additionalContentOverflowWrapper":"magritte-additional-content-overflow-wrapper___hpCEQ_5-3-32","additional-content-container":"magritte-additional-content-container___N4Q-l_5-3-32","additionalContentContainer":"magritte-additional-content-container___N4Q-l_5-3-32","additional-content-vertical":"magritte-additional-content-vertical___3Ba1i_5-3-32","additionalContentVertical":"magritte-additional-content-vertical___3Ba1i_5-3-32","additional-content-wrapper":"magritte-additional-content-wrapper___dpdp5_5-3-32","additionalContentWrapper":"magritte-additional-content-wrapper___dpdp5_5-3-32","additional-content-dimensions":"magritte-additional-content-dimensions___yEIwY_5-3-32","additionalContentDimensions":"magritte-additional-content-dimensions___yEIwY_5-3-32","horizontal-actions-container":"magritte-horizontal-actions-container___dKSH8_5-3-32","horizontalActionsContainer":"magritte-horizontal-actions-container___dKSH8_5-3-32","vertical-actions-container":"magritte-vertical-actions-container___j1toG_5-3-32","verticalActionsContainer":"magritte-vertical-actions-container___j1toG_5-3-32","reverse":"magritte-reverse___mFIgd_5-3-32","progress-bar":"magritte-progress-bar___tSTjx_5-3-32","progressBar":"magritte-progress-bar___tSTjx_5-3-32"};
+var styles = {"action-bar":"magritte-action-bar___Tkm7C_5-4-0","actionBar":"magritte-action-bar___Tkm7C_5-4-0","action-bar-is-fixed":"magritte-action-bar-is-fixed___Zjqtf_5-4-0","actionBarIsFixed":"magritte-action-bar-is-fixed___Zjqtf_5-4-0","action-bar-is-sticky":"magritte-action-bar-is-sticky___q272C_5-4-0","actionBarIsSticky":"magritte-action-bar-is-sticky___q272C_5-4-0","action-bar-with-default-padding":"magritte-action-bar-with-default-padding___QcKnA_5-4-0","actionBarWithDefaultPadding":"magritte-action-bar-with-default-padding___QcKnA_5-4-0","action-bar-with-progress-bar":"magritte-action-bar-with-progress-bar___mprqw_5-4-0","actionBarWithProgressBar":"magritte-action-bar-with-progress-bar___mprqw_5-4-0","actions-stack":"magritte-actions-stack___12VkP_5-4-0","actionsStack":"magritte-actions-stack___12VkP_5-4-0","right-only-actions":"magritte-right-only-actions___84fc8_5-4-0","rightOnlyActions":"magritte-right-only-actions___84fc8_5-4-0","actions-stack_horizontal":"magritte-actions-stack_horizontal___p3HgB_5-4-0","actionsStackHorizontal":"magritte-actions-stack_horizontal___p3HgB_5-4-0","actions-stack_vertical":"magritte-actions-stack_vertical___5UtzF_5-4-0","actionsStackVertical":"magritte-actions-stack_vertical___5UtzF_5-4-0","additional-content-overflow-wrapper":"magritte-additional-content-overflow-wrapper___hpCEQ_5-4-0","additionalContentOverflowWrapper":"magritte-additional-content-overflow-wrapper___hpCEQ_5-4-0","additional-content-container":"magritte-additional-content-container___N4Q-l_5-4-0","additionalContentContainer":"magritte-additional-content-container___N4Q-l_5-4-0","additional-content-vertical":"magritte-additional-content-vertical___3Ba1i_5-4-0","additionalContentVertical":"magritte-additional-content-vertical___3Ba1i_5-4-0","additional-content-wrapper":"magritte-additional-content-wrapper___dpdp5_5-4-0","additionalContentWrapper":"magritte-additional-content-wrapper___dpdp5_5-4-0","additional-content-dimensions":"magritte-additional-content-dimensions___yEIwY_5-4-0","additionalContentDimensions":"magritte-additional-content-dimensions___yEIwY_5-4-0","horizontal-actions-container":"magritte-horizontal-actions-container___dKSH8_5-4-0","horizontalActionsContainer":"magritte-horizontal-actions-container___dKSH8_5-4-0","vertical-actions-container":"magritte-vertical-actions-container___j1toG_5-4-0","verticalActionsContainer":"magritte-vertical-actions-container___j1toG_5-4-0","reverse":"magritte-reverse___mFIgd_5-4-0","progress-bar":"magritte-progress-bar___tSTjx_5-4-0","progressBar":"magritte-progress-bar___tSTjx_5-4-0"};
 const SCROLL_HANDLER_THROTTLE_MS = 50;
 const ActionBarComponent = forwardRef((props, ref) => {
     const defaultProps = useActionBarDefaultProps();
-    const { type = 'horizontal', showDivider = 'with-scroll', showProgress = false, primaryActions, secondaryActions, additionalContent, padding, vertPadding, bottom = 0, isFixed = false, isSticky = false, onDomPositionReached, className, } = { ...defaultProps, ...props };
+    const { type = 'horizontal', showDivider = 'with-scroll', showProgress = false, primaryActions, secondaryActions, additionalContent, padding, vertPadding, bottom = 0, isFixed = false, isSticky = false, onDomPositionReached, className, scrollContainer, } = { ...defaultProps, ...props };
     const isFixedOrSticky = isFixed || isSticky;
     const { breakpoint, isMobile } = useBreakpoint();
     const [isScrollEnd, setIsScrollEnd] = useState(false);
@@ -44,7 +44,7 @@ const ActionBarComponent = forwardRef((props, ref) => {
         if (shouldShowProgress || typeof showDivider === 'boolean') {
             return void 0;
         }
-        const scrollableParent = getScrollableParent(actionBarRef.current);
+        const scrollableParent = scrollContainer ?? getScrollableParent(actionBarRef.current);
         if (!scrollableParent) {
             return void 0;
         }
@@ -69,12 +69,18 @@ const ActionBarComponent = forwardRef((props, ref) => {
         else {
             scrollableParent.addEventListener('scroll', handleScroll);
         }
+        // При явно переданном `scrollContainer` (например, модалка) события `scroll` может не быть вовсе —
+        // когда контент помещается целиком. Без начального замера `isScrollEnd` остался бы `false`, и
+        // дивайдер висел бы на нескроллируемом контенте. Считаем состояние сразу при подписке/смене контейнера.
+        if (scrollContainer) {
+            handleScroll();
+        }
         return () => {
             wasHandledScroll.current = false;
             window.removeEventListener('scroll', handleScroll);
             scrollableParent?.removeEventListener('scroll', handleScroll);
         };
-    }, [shouldShowProgress, showDivider, isSticky, bottom]);
+    }, [shouldShowProgress, showDivider, isSticky, bottom, scrollContainer]);
     useEffect(() => {
         if (!wasHandledScroll.current || !isFixedOrSticky) {
             return;

package/ActionBar.js.map CHANGED Viewed

	@@ -1 +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 { useActionBarDefaultProps } from '@hh.ru/magritte-ui-action-bar/defaultProps';\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>((props, ref) => {\n const defaultProps = useActionBarDefaultProps();\n const {\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 } = { ...defaultProps, ...props };\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(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 + bottom - 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, bottom]);\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 > 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\nActionBarComponent.displayName = 'ActionBar';\nconst ActionBar = ActionBarComponent as typeof ActionBarComponent & { isActionBar: true };\nActionBar.isActionBar = true;\n\nexport { ActionBar };\n"],"names":["_jsx","_jsxs","_Fragment","Fragment"],"mappings":";;;;;;;;;;;;;;;AAyBA,MAAM,0BAA0B,GAAG,EAAE,CAAC;AAEtC,MAAM,kBAAkB,GAAG,UAAU,CAA8B,CAAC,KAAK,EAAE,GAAG,KAAI;AAC9E,IAAA,MAAM,YAAY,GAAG,wBAAwB,EAAE,CAAC;IAChD,MAAM,EACF,IAAI,GAAG,YAAY,EACnB,WAAW,GAAG,aAAa,EAC3B,YAAY,GAAG,KAAK,EACpB,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,OAAO,EACP,WAAW,EACX,MAAM,GAAG,CAAC,EACV,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,oBAAoB,EACpB,SAAS,GACZ,GAAG,EAAE,GAAG,YAAY,EAAE,GAAG,KAAK,EAAE,CAAC;AAClC,IAAA,MAAM,eAAe,GAAG,OAAO,IAAI,QAAQ,CAAC;IAC5C,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,CAAC;IACjD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AACtD,IAAA,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,MAAM,oBAAoB,GAAG,eAAe,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC;AAChE,IAAA,MAAM,oBAAoB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AAC1D,IAAA,MAAM,2BAA2B,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AACjE,IAAA,MAAM,sBAAsB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AAC5D,IAAA,MAAM,eAAe,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AACrD,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AACvD,IAAA,MAAM,mBAAmB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AACzD,IAAA,MAAM,gBAAgB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAC;AAChD,IAAA,MAAM,uBAAuB,GAAG,MAAM,CAAmC,oBAAoB,CAAC,CAAC;AAC/F,IAAA,uBAAuB,CAAC,OAAO,GAAG,oBAAoB,CAAC;IACvD,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAC;AAC3E,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AAEvD,IAAA,MAAM,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,GAAG,2BAA2B,CAAC;QAC1E,QAAQ;QACR,WAAW;QACX,YAAY;QACZ,WAAW;AACd,KAAA,CAAC,CAAC;IAEH,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,kBAAkB,IAAI,OAAO,WAAW,KAAK,SAAS,EAAE;YACxD,OAAO,KAAK,CAAC,CAAC;SACjB;QACD,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QACnE,IAAI,CAAC,gBAAgB,EAAE;YACnB,OAAO,KAAK,CAAC,CAAC;SACjB;AACD,QAAA,IAAI,YAAY,GAAG,QAAQ,CAAC,MAAK;AAC7B,YAAA,gBAAgB,CAAC,OAAO,GAAG,IAAI,CAAC;YAChC,MAAM,WAAW,GACb,gBAAgB;AAChB,gBAAA,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC,SAAS,CAAC;AAChG,oBAAA,CAAC,CAAC;AACV,YAAA,cAAc,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC;SACjC,EAAE,0BAA0B,CAAC,CAAC;;QAG/B,IAAI,QAAQ,EAAE;AACV,YAAA,YAAY,GAAG,QAAQ,CAAC,MAAK;AACzB,gBAAA,gBAAgB,CAAC,OAAO,GAAG,IAAI,CAAC;AAChC,gBAAA,MAAM,UAAU,GAAG,YAAY,CAAC,OAAO,EAAE,qBAAqB,EAAE,CAAC,MAAM,IAAI,CAAC,CAAC;AAC7E,gBAAA,cAAc,CAAC,IAAI,CAAC,GAAG,CAAC,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC;aAC1E,EAAE,0BAA0B,CAAC,CAAC;SAClC;AAED,QAAA,IAAI,gBAAgB,KAAK,QAAQ,CAAC,eAAe,EAAE;AAC/C,YAAA,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;SACnD;aAAM;AACH,YAAA,gBAAgB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;SAC7D;AACD,QAAA,OAAO,MAAK;AACR,YAAA,gBAAgB,CAAC,OAAO,GAAG,KAAK,CAAC;AACjC,YAAA,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;AACnD,YAAA,gBAAgB,EAAE,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;AAClE,SAAC,CAAC;KACL,EAAE,CAAC,kBAAkB,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC;IAExD,SAAS,CAAC,MAAK;QACX,IAAI,CAAC,gBAAgB,CAAC,OAAO,IAAI,CAAC,eAAe,EAAE;YAC/C,OAAO;SACV;AACD,QAAA,uBAAuB,CAAC,OAAO,GAAG,WAAW,CAAC,CAAC;AACnD,KAAC,EAAE,CAAC,WAAW,EAAE,eAAe,CAAC,CAAC,CAAC;AAEnC,IAAA,MAAM,oBAAoB,GAAG,WAAW,CAAC,CAAC,MAAe,KAAI;AACzD,QAAA,eAAe,CAAC,OAAO,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,oBAAoB,EAAE,MAAM,CAAC,CAAC;QAC/E,iBAAiB,CAAC,OAAO,EAAE,SAAS,CAAC,MAAM,CAAC,uBAAuB,EAAE,MAAM,CAAC,CAAC;AAC7E,QAAA,iBAAiB,CAAC,OAAO,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,wBAAwB,EAAE,MAAM,CAAC,CAAC;AACrF,QAAA,iBAAiB,CAAC,OAAO,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,0BAA0B,EAAE,CAAC,MAAM,CAAC,CAAC;QACxF,mBAAmB,CAAC,OAAO,EAAE,SAAS,CAAC,MAAM,CAAC,uBAAuB,EAAE,MAAM,CAAC,CAAC;AAC/E,QAAA,mBAAmB,CAAC,OAAO,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,wBAAwB,EAAE,MAAM,CAAC,CAAC;AACvF,QAAA,mBAAmB,CAAC,OAAO,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,0BAA0B,EAAE,CAAC,MAAM,CAAC,CAAC;KAC7F,EAAE,EAAE,CAAC,CAAC;;IAGP,eAAe,CAAC,MAAK;QACjB,IAAI,CAAC,eAAe,CAAC,OAAO,IAAI,CAAC,sBAAsB,CAAC,OAAO,EAAE;YAC7D,OAAO;SACV;AAED,QAAA,IAAI,IAAI,KAAK,MAAM,EAAE;AACjB,YAAA,MAAM,oBAAoB,GAAG,IAAI,KAAK,UAAU,CAAC;AACjD,YAAA,iBAAiB,CAAC,OAAO,GAAG,oBAAoB,CAAC;YACjD,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;SAC3C;aAAM;YACH,oBAAoB,CAAC,KAAK,CAAC,CAAC;AAC5B,YAAA,MAAM,oBAAoB,GACtB,CAAC,CAAC,CAAC,oBAAoB,CAAC,OAAO;gBAC3B,CAAC,CAAC,2BAA2B,CAAC,OAAO;iBACpC,oBAAoB,CAAC,OAAO,CAAC,YAAY,GAAG,2BAA2B,CAAC,OAAO,CAAC,YAAY;oBACzF,oBAAoB,CAAC,OAAO,CAAC,WAAW,GAAG,2BAA2B,CAAC,OAAO,CAAC,WAAW,CAAC;gBACnG,eAAe,CAAC,OAAO,CAAC,WAAW,GAAG,sBAAsB,CAAC,OAAO,CAAC,WAAW,CAAC;AACrF,YAAA,IAAI,oBAAoB,KAAK,iBAAiB,CAAC,OAAO,EAAE;AACpD,gBAAA,iBAAiB,CAAC,OAAO,GAAG,oBAAoB,CAAC;gBACjD,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;aAC3C;iBAAM;AACH,gBAAA,oBAAoB,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC;aACnD;SACJ;AACL,KAAC,EAAE,CAAC,IAAI,EAAE,cAAc,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,UAAU,EAAE,oBAAoB,CAAC,CAAC,CAAC;AAElG,IAAA,MAAM,YAAY,GAAG,OAAO,GAAG,CAAG,EAAA,WAAW,IAAI,OAAO,MAAM,OAAO,CAAA,EAAA,CAAI,GAAG,EAAE,CAAC;AAC/E,IAAA,QACIA,GAAC,CAAA,KAAK,IAAC,KAAK,EAAC,YAAY,EACrB,QAAA,EAAAC,IAAA,CAAA,KAAA,EAAA,EACI,GAAG,EAAE,oBAAoB,EACjB,SAAA,EAAA,YAAY,EACpB,KAAK,EAAE,MAAM,GAAG,EAAE,MAAM,EAAE,CAAA,EAAG,MAAM,CAAI,EAAA,CAAA,EAAE,GAAG,EAAE,EAC9C,SAAS,EAAE,UAAU,CACjB,MAAM,CAAC,SAAS,EAChB;AACI,gBAAA,CAAC,MAAM,CAAC,gBAAgB,GAAG,OAAO;AAClC,gBAAA,CAAC,MAAM,CAAC,iBAAiB,GAAG,QAAQ;AACpC,gBAAA,CAAC,MAAM,CAAC,wBAAwB,GAAG,kBAAkB;AACxD,aAAA,EACD,SAAS,CACZ,EAAA,QAAA,EAAA,CAEA,iBAAiB,KACdD,wBAAa,SAAS,EAAA,QAAA,EAClBA,GAAC,CAAA,OAAO,IAAC,IAAI,EAAC,YAAY,EAAG,CAAA,EAAA,CAC3B,CACT,EACA,kBAAkB,KACfA,wBAAa,cAAc,EAAC,SAAS,EAAE,MAAM,CAAC,WAAW,EAAA,QAAA,EACpD,YAAY,EACX,CAAA,CACT,EACDA,GACY,CAAA,KAAA,EAAA,EAAA,SAAA,EAAA,mBAAmB,EAC3B,SAAS,EAAE,UAAU,CAAC;wBAClB,CAAC,MAAM,CAAC,2BAA2B,GAAG,eAAe,IAAI,CAAC,YAAY;AACzE,qBAAA,CAAC,EACF,KAAK,EAAE,YAAY,GAAG,EAAE,OAAO,EAAE,YAAY,EAAE,GAAG,EAAE,EAEpD,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,sBAAsB,EAAE,SAAS,EAAE,MAAM,CAAC,mBAAmB,EAAA,QAAA,EACnEA,GACI,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,YAAY,EAAE;AACvC,gCAAA,CAAC,MAAM,CAAC,sBAAsB,GAAG,CAAC,cAAc;AAChD,gCAAA,CAAC,MAAM,CAAC,oBAAoB,GAAG,cAAc;gCAC7C,CAAC,MAAM,CAAC,gBAAgB,GAAG,CAAC,gBAAgB,IAAI,CAAC,iBAAiB;AACrE,6BAAA,CAAC,EACF,GAAG,EAAE,eAAe,EACX,SAAA,EAAA,CAAA,kBAAA,EAAqB,IAAI,CAAE,CAAA,EAAA,QAAA,EAEnC,cAAc,IACXC,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACK,CAAC,CAAC,iBAAiB,KAChBF,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,0BAA0B,CAAC,YAGxDA,GACI,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CACjB,MAAM,CAAC,wBAAwB,EAC/B,MAAM,CAAC,yBAAyB,EAChC;gDACI,CAAC,MAAM,CAAC,gCAAgC,GACpC,CAAC,CAAC,cAAc,IAAI,CAAC,CAAC,gBAAgB;AAC7C,6CAAA,CACJ,EACD,GAAG,EAAE,2BAA2B,EAEhC,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,MAAM,CAAC,2BAA2B,EAC7C,GAAG,EAAE,oBAAoB,EAAA,SAAA,EACjB,oBAAoB,EAAA,QAAA,EAE3B,iBAAiB,EAAA,CAChB,EACJ,CAAA,EAAA,EApBF,oBAAoB,CAqBtB,CACT,EACA,CAAC,CAAC,cAAc;AACb,wCAAA,CAAC,MAAK;4CACF,IAAI,sBAAsB,GAAG,cAAc,CAAC;4CAC5C,IAAI,gBAAgB,GAAG,IAAI,CAAC;AAC5B,4CAAA,IAAI,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE;gDAC/B,sBAAsB,GAAG,QAAQ,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,OAAO,EAAE,CAAC;gDACpE,gBAAgB,GAAG,KAAK,CAAC;6CAC5B;iDAAM,IACH,cAAc,CAAC,cAAc,CAAC;AAC9B,gDAAA,cAAc,CAAC,IAAI,KAAKG,UAAQ,EAClC;AACE,gDAAA,sBAAsB,GAAG,QAAQ,CAAC,OAAO,CACpC,cAAc,CAAC,KAAiC,CAAC,QAAQ,CAC7D,CAAC,OAAO,EAAE,CAAC;gDACZ,gBAAgB,GAAG,KAAK,CAAC;6CAC5B;AAED,4CAAA,QACIH,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,UAAU,CACjB,MAAM,CAAC,wBAAwB,EAC/B,EAAE,CAAC,MAAM,CAAC,OAAO,GAAG,gBAAgB,EAAE,EACtC,uBAAuB,CAC1B,EAAA,SAAA,EACO,iBAAiB,EAEzB,GAAG,EAAE,iBAAiB,YAErB,sBAAsB,EAAA,EAHnB,iBAAiB,CAInB,EACR;AACN,yCAAC,GAAG,EACP,CAAC,CAAC,gBAAgB,KACfA,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,UAAU,CACjB,MAAM,CAAC,wBAAwB,EAC/B,uBAAuB,CAC1B,EACO,SAAA,EAAA,mBAAmB,EAE3B,GAAG,EAAE,mBAAmB,EAAA,QAAA,EAEvB,gBAAgB,EAHb,EAAA,mBAAmB,CAIrB,CACT,CAAA,EAAA,CACF,KAEHC,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACK,CAAC,CAAC,gBAAgB,KACfF,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,0BAA0B,CAAC,aAChD,mBAAmB,EAE3B,GAAG,EAAE,mBAAmB,YAEvB,gBAAgB,EAAA,EAHb,mBAAmB,CAIrB,CACT,EACA,CAAC,CAAC,iBAAiB,KAChBA,GACI,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,0BAA0B,CAAC,EAGxD,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,wBAAwB,EAAE;gDACnD,CAAC,MAAM,CAAC,gCAAgC,GACpC,CAAC,CAAC,cAAc,IAAI,CAAC,CAAC,gBAAgB;AAC7C,6CAAA,CAAC,EACF,GAAG,EAAE,2BAA2B,EAEhC,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EACI,GAAG,EAAE,oBAAoB,EACzB,SAAS,EAAE,MAAM,CAAC,2BAA2B,EAAA,SAAA,EACrC,oBAAoB,EAAA,QAAA,EAE3B,iBAAiB,EAAA,CAChB,EACJ,CAAA,EAAA,EAhBF,oBAAoB,CAiBtB,CACT,EACA,CAAC,CAAC,cAAc,KACbA,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,0BAA0B,CAAC,EAChD,SAAA,EAAA,iBAAiB,EAEzB,GAAG,EAAE,iBAAiB,EAErB,QAAA,EAAA,cAAc,EAHX,EAAA,iBAAiB,CAInB,CACT,CACF,EAAA,CAAA,CACN,EACC,CAAA,EAAA,CACJ,EACJ,CAAA,CAAA,EAAA,CACJ,EACF,CAAA,EACV;AACN,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,WAAW,GAAG,WAAW,CAAC;AACvC,MAAA,SAAS,GAAG,mBAAwE;AAC1F,SAAS,CAAC,WAAW,GAAG,IAAI;;;;"}
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 { useActionBarDefaultProps } from '@hh.ru/magritte-ui-action-bar/defaultProps';\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>((props, ref) => {\n const defaultProps = useActionBarDefaultProps();\n const {\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 scrollContainer,\n } = { ...defaultProps, ...props };\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 = scrollContainer ?? 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(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 + bottom - 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\n // При явно переданном `scrollContainer` (например, модалка) события `scroll` может не быть вовсе —\n // когда контент помещается целиком. Без начального замера `isScrollEnd` остался бы `false`, и\n // дивайдер висел бы на нескроллируемом контенте. Считаем состояние сразу при подписке/смене контейнера.\n if (scrollContainer) {\n handleScroll();\n }\n\n return () => {\n wasHandledScroll.current = false;\n window.removeEventListener('scroll', handleScroll);\n scrollableParent?.removeEventListener('scroll', handleScroll);\n };\n }, [shouldShowProgress, showDivider, isSticky, bottom, scrollContainer]);\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 > 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\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 CHANGED Viewed

@@ -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-32","actionBarViewportAdapter":"magritte-action-bar-viewport-adapter___yKxEe_5-3-32"};
+var styles = {"action-bar-viewport-adapter":"magritte-action-bar-viewport-adapter___yKxEe_5-4-0","actionBarViewportAdapter":"magritte-action-bar-viewport-adapter___yKxEe_5-4-0"};
 const ActionBarViewportAdapter = ({ children }) => {
     const isActionBarIntoChildren = isActionBarComponent(children);

package/index.css CHANGED Viewed

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

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@hh.ru/magritte-ui-action-bar",
-  "version": "5.3.32",
+  "version": "5.4.0",
   "main": "index.js",
   "types": "index.d.ts",
   "sideEffects": [
@@ -30,7 +30,7 @@
     "@hh.ru/magritte-ui-button": "7.2.14",
     "@hh.ru/magritte-ui-divider": "3.2.1",
     "@hh.ru/magritte-ui-grid": "3.0.8",
-    "@hh.ru/magritte-ui-layer": "3.2.5",
+    "@hh.ru/magritte-ui-layer": "3.2.6",
     "@hh.ru/magritte-ui-mock-component": "1.1.7"
   },
   "peerDependencies": {
@@ -40,5 +40,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "31b8343d575729be9878df6f3d156992168a97b0"
+  "gitHead": "c04d157907ffbb3a873f8cd98fb63c4034f93f69"
 }

package/types.d.ts CHANGED Viewed

@@ -46,6 +46,8 @@ interface BaseActionBarProps {
     onDomPositionReached?: OnDomPositionReached;
     /** css-класс для позиционирования action-bar */
     className?: string;
+    /** Позволяет передать кастомный скролл контейнер, от состояния которого будет зависеть отображение дивайдера */
+    scrollContainer?: HTMLElement | null;
 }
 type ActionBarDividerProgressProps = {
     /**

package/types.js.map CHANGED Viewed

	@@ -1 +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 /*\n Тип ActionBar\n * @default horizontal\n /\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 /\n Позиция ActionBar для isFixed/isSticky\n * @default 0\n /\n bottom?: number;\n /\n Флаг, который позволяет зафиксировать ActionBar у нижней границы окна\n * @default false\n /\n isFixed?: boolean;\n /\n Флаг, который позволяет зафиксировать ActionBar у нижней границы окна\n * При достижении своей позиции в DOM, ActionBar перестанет следовать за скроллом\n * @default false\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 Режим работы разделителя\n * @default with-scroll\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":";;~~AAoEa~~,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;;;;"}
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 /*\n Тип ActionBar\n * @default horizontal\n /\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 /\n Позиция ActionBar для isFixed/isSticky\n * @default 0\n /\n bottom?: number;\n /\n Флаг, который позволяет зафиксировать ActionBar у нижней границы окна\n * @default false\n /\n isFixed?: boolean;\n /\n Флаг, который позволяет зафиксировать ActionBar у нижней границы окна\n * При достижении своей позиции в DOM, ActionBar перестанет следовать за скроллом\n * @default false\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 scrollContainer?: HTMLElement \| null;\n}\n\ntype ActionBarDividerProgressProps =\n \| {\n /\n Режим работы разделителя\n * @default with-scroll\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":";;AAsEa,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;;;;"}