@hh.ru/magritte-ui-nav-bar 1.3.26 → 1.3.27

package/public/NavBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavBar.js","sources":["src/public/NavBar.tsx"],"sourcesContent":["import React, { Children, type ReactNode, type RefObject, useLayoutEffect, useRef, type FC } from 'react';\nimport classNames from 'classnames';\nimport { motion, type MotionStyle, MotionValue, frame } from 'motion/react';\n\nimport { Divider, type ShowDivider } from '@hh.ru/magritte-ui-divider';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\nimport { MetricsProvider } from '@hh.ru/magritte-ui-nav-bar/internal/MetricsProvider';\nimport { NavBarContext } from '@hh.ru/magritte-ui-nav-bar/internal/NavBarContext';\nimport { PaneStore } from '@hh.ru/magritte-ui-nav-bar/internal/PaneStore';\nimport { useAnimationRanges } from '@hh.ru/magritte-ui-nav-bar/internal/useAnimationRanges';\nimport { useBindScrollToAnimationProgress } from '@hh.ru/magritte-ui-nav-bar/internal/useBindScrollToAnimationProgress';\nimport { useNavBarMetrics } from '@hh.ru/magritte-ui-nav-bar/internal/useNavBarMetrics';\nimport { useResetFocus } from '@hh.ru/magritte-ui-nav-bar/internal/useResetFocus';\nimport { useScrollAdapter } from '@hh.ru/magritte-ui-nav-bar/internal/useScrollAdapter';\nimport { useSnapScroll } from '@hh.ru/magritte-ui-nav-bar/internal/useSnapScroll';\nimport { useSyncMotionValue } from '@hh.ru/magritte-ui-nav-bar/internal/useSyncMotionValue';\nimport { remap, scheduleMicro, scheduleMacro, useInitOnce } from '@hh.ru/magritte-ui-nav-bar/internal/utils';\nimport {\n    type PaneElement,\n    type InternalPaneProps,\n    ExternalPane,\n    isPaneElement,\n} from '@hh.ru/magritte-ui-nav-bar/public/Pane';\nimport { useNavBarRootDefaultProps } from '@hh.ru/magritte-ui-nav-bar/public/defaultProps';\n\nimport styles from './nav-bar.less';\n\nexport interface NavBarProps {\n    /**\n     * В качестве потомков могут передаваться компоненты <Pane /> или произвольные элементы,\n     * которые будут автоматически обёрнуты в <Pane />.\n     */\n    children: ReactNode;\n    /**\n     * Управляет режимом прозрачности:\n     * -- Прозрачность отключена (`false`)\n     * -- Прозрачный всегда (`true`)\n     * -- Прозрачный в начале анимации (`start`)\n     * -- Прозрачный в конце анимации (`end`)\n     * @default false\n     */\n    transparent?: 'start' | 'end' | boolean;\n    /**\n     * Управляет позицией триггера начала анимации\n     * @default start\n     */\n    startTriggerPosition?: 'start' | 'full-area' | RefObject<HTMLElement | null>;\n    /**\n     * Управляет позицией триггера конца анимации. Если не передан вычисляется автоматически на основе изменения\n     * высоты навбара в процессе анимации и позиции триггера начала анмиации. Если передано число, то интерпретируется\n     * как отступ в пикселях от позиции триггера старта анимации.\n     */\n    endTriggerPosition?: RefObject<HTMLElement | null> | number;\n    /**\n     * Включает режим когда NavBar не занимает место в лейауте и контент располагается под ним.\n     * @default false\n     */\n    overlay?: boolean;\n    /**\n     * Управляет режимом автодоскролла. По умолчанию включен.\n     * @default true\n     */\n    snapScroll?: boolean;\n    /**\n     * Управляет режимом отображения дивайдера:\n     * - `false` дивайдер отключен\n     * - `always` дивайдер отображается постоянно\n     * - `with-scroll` дивайдер отображается только когда контент подскроллен под NavBar\n     * @default false\n     */\n    showDivider?: ShowDivider;\n    /**\n     * Принимает MotionValue значение которого будет обновляться синхронно с анимацией всего NavBar.\n     * Прогресс анимации представляется в виде числа 0..1\n     * Предназначен для синхронизации внешних анимаций с анимациями NavBar.\n     */\n    animationProgress?: MotionValue<number>;\n}\n\nexport const NavBar: FC<NavBarProps> = (props) => {\n    const defaultProps = useNavBarRootDefaultProps();\n    const {\n        children,\n        transparent = false,\n        startTriggerPosition = 'start',\n        endTriggerPosition,\n        overlay = false,\n        snapScroll: scrollSnapping = true,\n        showDivider = false,\n        animationProgress,\n    } = { ...defaultProps, ...props };\n    const paneStoreRegistry = useInitOnce(() => new Set<PaneStore>());\n    const prevFullHeight = useRef<null | number>(0);\n    const rootRef = useRef<HTMLDivElement>(null);\n\n    const [scrollAdapter, scrollPosition] = useScrollAdapter(rootRef);\n    const [getMetrics, invalidateMetrics] = useNavBarMetrics(paneStoreRegistry, rootRef, scrollAdapter);\n    const [getAnimationRanges, invalidateAnimationRanges] = useAnimationRanges(paneStoreRegistry, getMetrics);\n    const [bindScrollToAnimation, getClosestStops, totalAnimationProgress, dividerStyle] =\n        useBindScrollToAnimationProgress(\n            scrollPosition,\n            getMetrics,\n            getAnimationRanges,\n            scrollAdapter,\n            startTriggerPosition,\n            endTriggerPosition\n        );\n    const snapScroll = useSnapScroll(\n        scrollPosition,\n        totalAnimationProgress,\n        scrollAdapter,\n        getClosestStops,\n        scrollSnapping\n    );\n\n    // При получении размеров важно дождаться применения MotionValue к DOM, поэтому используем frame.render\n    const bindScrollToAnimationScheduled = useInitOnce(() => scheduleMicro(() => frame.render(bindScrollToAnimation)));\n    useResetFocus(rootRef, totalAnimationProgress);\n    useSyncMotionValue(totalAnimationProgress, animationProgress);\n\n    const dividerVisibility =\n        // eslint-disable-next-line no-nested-ternary\n        showDivider === 'with-scroll' ? dividerStyle.visibility : showDivider ? 'visible' : 'hidden';\n\n    const registerPaneStore = useInitOnce(() => {\n        const subscriptions: VoidFunction[] = [];\n\n        const updateAnimationParams = () => {\n            subscriptions.length = 0;\n            invalidateMetrics();\n            invalidateAnimationRanges();\n            bindScrollToAnimationScheduled();\n            const navBarMetrics = getMetrics();\n            const fullPanesStartHeight = navBarMetrics.bottom - navBarMetrics.top;\n\n            let scroll = scrollAdapter.getScrollTop();\n            if (prevFullHeight.current !== null && scroll !== 0) {\n                const heightDelta = fullPanesStartHeight - prevFullHeight.current;\n                scroll += heightDelta;\n\n                requestAnimationFrame(() => {\n                    scrollPosition.jump(scrollAdapter.getScrollTop() - 1);\n                    scrollPosition.jump(scrollAdapter.getScrollTop());\n                });\n            }\n\n            const animationRanges = getAnimationRanges();\n            [...paneStoreRegistry.values()].forEach((paneStore) => {\n                const range = animationRanges.get(paneStore.get('id'));\n                if (!range) {\n                    return;\n                }\n                const remapFn = remap(\n                    range[0] === 0 && range[1] === 0\n                        ? [0, 1]\n                        : [range[0] / navBarMetrics.animationHeight, range[1] / navBarMetrics.animationHeight],\n                    [0, 1]\n                );\n                const motionValue = paneStore.get('motionValue');\n                motionValue.set(remapFn(totalAnimationProgress.get()));\n                subscriptions.push(totalAnimationProgress.on('change', (value) => motionValue.set(remapFn(value))));\n            });\n\n            prevFullHeight.current = fullPanesStartHeight;\n        };\n\n        // основной триггер запуска updateAnimationParams это изменения размеров, обработка которых происходит\n        // в очереди микрозадач, поэтому откладываем запуск функции до перехдоа к макрозадачам, чтобы сократить\n        // количество вызовов при массовых изменениях\n        const onChange = scheduleMacro(updateAnimationParams);\n\n        return (paneStore: PaneStore) => {\n            const unsubscribe = paneStore.onChange(\n                ['startHeight', 'endHeight', 'top', 'foldable', 'animated'],\n                onChange\n            );\n            paneStoreRegistry.add(paneStore);\n            return () => {\n                paneStoreRegistry.delete(paneStore);\n                unsubscribe();\n            };\n        };\n    });\n\n    useLayoutEffect(() => {\n        bindScrollToAnimation();\n        snapScroll();\n        if (!rootRef.current || (typeof startTriggerPosition === 'string' && !endTriggerPosition)) {\n            return void 0;\n        }\n        return scrollAdapter.onResize(bindScrollToAnimationScheduled);\n    }, [\n        startTriggerPosition,\n        endTriggerPosition,\n        bindScrollToAnimation,\n        bindScrollToAnimationScheduled,\n        snapScroll,\n        scrollAdapter,\n    ]);\n\n    // Оборачиваем потомков, не являющихся Pane, в Pane и вкладываем панели друг в друга через проп nextPane\n    const childrenArray = Children.toArray(children);\n    const nested = isPaneElement(childrenArray[0]) ? (\n        childrenArray.reduceRight<PaneElement | null>((acc, child) => {\n            if (!isPaneElement(child)) {\n                return acc;\n            }\n            // cloneElement сужает конструктор до InternalPaneProps, поэтому возвращаем к PaneElement\n            return React.cloneElement<InternalPaneProps>(child, {\n                ...child.props,\n                nextPane: acc,\n            }) as PaneElement;\n        }, null)\n    ) : (\n        <ExternalPane>{children}</ExternalPane>\n    );\n\n    return (\n        <Layer layer=\"navigation-bar\">\n            <MetricsProvider\n                className={classNames(styles.navBar, {\n                    [styles.navbarTransparentStart]: transparent === 'start',\n                    [styles.navbarTransparentEnd]: transparent === 'end',\n                    [styles.navbarNotTransparent]: !transparent,\n                    [styles.navbarTransparent]: transparent === true,\n                    [styles.navBarOverlay]: overlay,\n                })}\n                ref={rootRef}\n                measureClassName={styles.metricsMode}\n            >\n                <div className={styles.navBarOverlayWrapper}>\n                    <div className={styles.navBarContentContainer}>\n                        <motion.div\n                            style={{ '--magritte-ui-navbar-animation-progress': totalAnimationProgress } as MotionStyle}\n                            className={styles.navBarPanesContainer}\n                        >\n                            <NavBarContext.Provider value={registerPaneStore}>{nested}</NavBarContext.Provider>\n                        </motion.div>\n                        <motion.div\n                            className={styles.dividerContainer}\n                            style={{ ...dividerStyle, visibility: dividerVisibility }}\n                        >\n                            <Divider />\n                        </motion.div>\n                    </div>\n                </div>\n            </MetricsProvider>\n        </Layer>\n    );\n};\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"NavBar.js","sources":["src/public/NavBar.tsx"],"sourcesContent":["import React, { Children, type ReactNode, type RefObject, useLayoutEffect, useRef, type FC } from 'react';\nimport classNames from 'classnames';\nimport { motion, type MotionStyle, MotionValue, frame } from 'motion/react';\n\nimport { Divider, type ShowDivider } from '@hh.ru/magritte-ui-divider';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\nimport { MetricsProvider } from '@hh.ru/magritte-ui-nav-bar/internal/MetricsProvider';\nimport { NavBarContext } from '@hh.ru/magritte-ui-nav-bar/internal/NavBarContext';\nimport { PaneStore } from '@hh.ru/magritte-ui-nav-bar/internal/PaneStore';\nimport { useAnimationRanges } from '@hh.ru/magritte-ui-nav-bar/internal/useAnimationRanges';\nimport { useBindScrollToAnimationProgress } from '@hh.ru/magritte-ui-nav-bar/internal/useBindScrollToAnimationProgress';\nimport { useNavBarMetrics } from '@hh.ru/magritte-ui-nav-bar/internal/useNavBarMetrics';\nimport { useResetFocus } from '@hh.ru/magritte-ui-nav-bar/internal/useResetFocus';\nimport { useScrollAdapter } from '@hh.ru/magritte-ui-nav-bar/internal/useScrollAdapter';\nimport { useSnapScroll } from '@hh.ru/magritte-ui-nav-bar/internal/useSnapScroll';\nimport { useSyncMotionValue } from '@hh.ru/magritte-ui-nav-bar/internal/useSyncMotionValue';\nimport { remap, scheduleMicro, scheduleMacro, useInitOnce } from '@hh.ru/magritte-ui-nav-bar/internal/utils';\nimport {\n    type PaneElement,\n    type InternalPaneProps,\n    ExternalPane,\n    isPaneElement,\n} from '@hh.ru/magritte-ui-nav-bar/public/Pane';\nimport { type TriggerEdge, useTriggerSlot } from '@hh.ru/magritte-ui-nav-bar/public/TriggerContext';\nimport { useNavBarRootDefaultProps } from '@hh.ru/magritte-ui-nav-bar/public/defaultProps';\n\nimport styles from './nav-bar.less';\n\nexport interface NavBarProps {\n    /**\n     * В качестве потомков могут передаваться компоненты <Pane /> или произвольные элементы,\n     * которые будут автоматически обёрнуты в <Pane />.\n     */\n    children: ReactNode;\n    /**\n     * Управляет режимом прозрачности:\n     * -- Прозрачность отключена (`false`)\n     * -- Прозрачный всегда (`true`)\n     * -- Прозрачный в начале анимации (`start`)\n     * -- Прозрачный в конце анимации (`end`)\n     * @default false\n     */\n    transparent?: 'start' | 'end' | boolean;\n    /**\n     * Управляет позицией триггера начала анимации\n     * @default start\n     */\n    startTriggerPosition?: 'start' | 'full-area' | RefObject<HTMLElement | null>;\n    /**\n     * Край элемента `startTriggerPosition`, по которому измеряется позиция начала анимации.\n     * @default top\n     */\n    startTriggerEdge?: TriggerEdge;\n    /**\n     * Управляет позицией триггера конца анимации. Если не передан вычисляется автоматически на основе изменения\n     * высоты навбара в процессе анимации и позиции триггера начала анмиации. Если передано число, то интерпретируется\n     * как отступ в пикселях от позиции триггера старта анимации.\n     */\n    endTriggerPosition?: RefObject<HTMLElement | null> | number;\n    /**\n     * Край элемента `endTriggerPosition`, по которому измеряется позиция конца анимации.\n     * @default bottom\n     */\n    endTriggerEdge?: TriggerEdge;\n    /**\n     * Включает режим когда NavBar не занимает место в лейауте и контент располагается под ним.\n     * @default false\n     */\n    overlay?: boolean;\n    /**\n     * Управляет режимом автодоскролла. По умолчанию включен.\n     * @default true\n     */\n    snapScroll?: boolean;\n    /**\n     * Управляет режимом отображения дивайдера:\n     * - `false` дивайдер отключен\n     * - `always` дивайдер отображается постоянно\n     * - `with-scroll` дивайдер отображается только когда контент подскроллен под NavBar\n     * @default false\n     */\n    showDivider?: ShowDivider;\n    /**\n     * Принимает MotionValue значение которого будет обновляться синхронно с анимацией всего NavBar.\n     * Прогресс анимации представляется в виде числа 0..1\n     * Предназначен для синхронизации внешних анимаций с анимациями NavBar.\n     */\n    animationProgress?: MotionValue<number>;\n}\n\nexport const NavBar: FC<NavBarProps> = (props) => {\n    const defaultProps = useNavBarRootDefaultProps();\n    const startSlot = useTriggerSlot('startTrigger');\n    const endSlot = useTriggerSlot('endTrigger');\n    // Приоритет (от высшего к низшему): явные пропсы > NavBarDefaultPropsContext > слоты `Trigger` > дефолты.\n    const slotProps = {\n        ...(startSlot ? { startTriggerPosition: startSlot.ref, startTriggerEdge: startSlot.edge } : null),\n        ...(endSlot ? { endTriggerPosition: endSlot.ref, endTriggerEdge: endSlot.edge } : null),\n    };\n    const {\n        children,\n        transparent = false,\n        startTriggerPosition = 'start',\n        startTriggerEdge = 'top',\n        endTriggerPosition,\n        endTriggerEdge = 'bottom',\n        overlay = false,\n        snapScroll: scrollSnapping = true,\n        showDivider = false,\n        animationProgress,\n    } = { ...slotProps, ...defaultProps, ...props };\n    const paneStoreRegistry = useInitOnce(() => new Set<PaneStore>());\n    const prevFullHeight = useRef<null | number>(0);\n    const rootRef = useRef<HTMLDivElement>(null);\n\n    const [scrollAdapter, scrollPosition] = useScrollAdapter(rootRef);\n    const [getMetrics, invalidateMetrics] = useNavBarMetrics(paneStoreRegistry, rootRef, scrollAdapter);\n    const [getAnimationRanges, invalidateAnimationRanges] = useAnimationRanges(paneStoreRegistry, getMetrics);\n    const [bindScrollToAnimation, getClosestStops, totalAnimationProgress, dividerStyle] =\n        useBindScrollToAnimationProgress(\n            scrollPosition,\n            getMetrics,\n            getAnimationRanges,\n            scrollAdapter,\n            startTriggerPosition,\n            endTriggerPosition,\n            startTriggerEdge,\n            endTriggerEdge\n        );\n    const snapScroll = useSnapScroll(\n        scrollPosition,\n        totalAnimationProgress,\n        scrollAdapter,\n        getClosestStops,\n        scrollSnapping\n    );\n\n    // При получении размеров важно дождаться применения MotionValue к DOM, поэтому используем frame.render\n    const bindScrollToAnimationScheduled = useInitOnce(() => scheduleMicro(() => frame.render(bindScrollToAnimation)));\n    useResetFocus(rootRef, totalAnimationProgress);\n    useSyncMotionValue(totalAnimationProgress, animationProgress);\n\n    const dividerVisibility =\n        // eslint-disable-next-line no-nested-ternary\n        showDivider === 'with-scroll' ? dividerStyle.visibility : showDivider ? 'visible' : 'hidden';\n\n    const registerPaneStore = useInitOnce(() => {\n        const subscriptions: VoidFunction[] = [];\n\n        const updateAnimationParams = () => {\n            subscriptions.length = 0;\n            invalidateMetrics();\n            invalidateAnimationRanges();\n            bindScrollToAnimationScheduled();\n            const navBarMetrics = getMetrics();\n            const fullPanesStartHeight = navBarMetrics.bottom - navBarMetrics.top;\n\n            let scroll = scrollAdapter.getScrollTop();\n            if (prevFullHeight.current !== null && scroll !== 0) {\n                const heightDelta = fullPanesStartHeight - prevFullHeight.current;\n                scroll += heightDelta;\n\n                requestAnimationFrame(() => {\n                    scrollPosition.jump(scrollAdapter.getScrollTop() - 1);\n                    scrollPosition.jump(scrollAdapter.getScrollTop());\n                });\n            }\n\n            const animationRanges = getAnimationRanges();\n            [...paneStoreRegistry.values()].forEach((paneStore) => {\n                const range = animationRanges.get(paneStore.get('id'));\n                if (!range) {\n                    return;\n                }\n                const remapFn = remap(\n                    range[0] === 0 && range[1] === 0\n                        ? [0, 1]\n                        : [range[0] / navBarMetrics.animationHeight, range[1] / navBarMetrics.animationHeight],\n                    [0, 1]\n                );\n                const motionValue = paneStore.get('motionValue');\n                motionValue.set(remapFn(totalAnimationProgress.get()));\n                subscriptions.push(totalAnimationProgress.on('change', (value) => motionValue.set(remapFn(value))));\n            });\n\n            prevFullHeight.current = fullPanesStartHeight;\n        };\n\n        // основной триггер запуска updateAnimationParams это изменения размеров, обработка которых происходит\n        // в очереди микрозадач, поэтому откладываем запуск функции до перехдоа к макрозадачам, чтобы сократить\n        // количество вызовов при массовых изменениях\n        const onChange = scheduleMacro(updateAnimationParams);\n\n        return (paneStore: PaneStore) => {\n            const unsubscribe = paneStore.onChange(\n                ['startHeight', 'endHeight', 'top', 'foldable', 'animated'],\n                onChange\n            );\n            paneStoreRegistry.add(paneStore);\n            return () => {\n                paneStoreRegistry.delete(paneStore);\n                unsubscribe();\n            };\n        };\n    });\n\n    useLayoutEffect(() => {\n        bindScrollToAnimation();\n        snapScroll();\n        if (!rootRef.current || (typeof startTriggerPosition === 'string' && !endTriggerPosition)) {\n            return void 0;\n        }\n        return scrollAdapter.onResize(bindScrollToAnimationScheduled);\n    }, [\n        startTriggerPosition,\n        endTriggerPosition,\n        bindScrollToAnimation,\n        bindScrollToAnimationScheduled,\n        snapScroll,\n        scrollAdapter,\n    ]);\n\n    // Оборачиваем потомков, не являющихся Pane, в Pane и вкладываем панели друг в друга через проп nextPane\n    const childrenArray = Children.toArray(children);\n    const nested = isPaneElement(childrenArray[0]) ? (\n        childrenArray.reduceRight<PaneElement | null>((acc, child) => {\n            if (!isPaneElement(child)) {\n                return acc;\n            }\n            // cloneElement сужает конструктор до InternalPaneProps, поэтому возвращаем к PaneElement\n            return React.cloneElement<InternalPaneProps>(child, {\n                ...child.props,\n                nextPane: acc,\n            }) as PaneElement;\n        }, null)\n    ) : (\n        <ExternalPane>{children}</ExternalPane>\n    );\n\n    return (\n        <Layer layer=\"navigation-bar\">\n            <MetricsProvider\n                className={classNames(styles.navBar, {\n                    [styles.navbarTransparentStart]: transparent === 'start',\n                    [styles.navbarTransparentEnd]: transparent === 'end',\n                    [styles.navbarNotTransparent]: !transparent,\n                    [styles.navbarTransparent]: transparent === true,\n                    [styles.navBarOverlay]: overlay,\n                })}\n                ref={rootRef}\n                measureClassName={styles.metricsMode}\n            >\n                <div className={styles.navBarOverlayWrapper}>\n                    <div className={styles.navBarContentContainer}>\n                        <motion.div\n                            style={{ '--magritte-ui-navbar-animation-progress': totalAnimationProgress } as MotionStyle}\n                            className={styles.navBarPanesContainer}\n                        >\n                            <NavBarContext.Provider value={registerPaneStore}>{nested}</NavBarContext.Provider>\n                        </motion.div>\n                        <motion.div\n                            className={styles.dividerContainer}\n                            style={{ ...dividerStyle, visibility: dividerVisibility }}\n                        >\n                            <Divider />\n                        </motion.div>\n                    </div>\n                </div>\n            </MetricsProvider>\n        </Layer>\n    );\n};\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/public/Pane.js

@@ -10,7 +10,7 @@ import { useInitOnce, useStoreSyncedTransform, lerp } from '../internal/utils.js
 import { EnvironmentFingerprintProvider } from './EnvironmentFingerprintNode.js';
 import { LayoutStage } from './LayoutStage.js';
 import { Stage } from './Stage.js';
-import { s as styles } from '../nav-bar-CmjjkPy6.js';
+import { s as styles } from '../nav-bar-BOTcQpSW.js';
 import '../internal/KeyedSubscriptions.js';
 import 'motion';
 import '../internal/NavBarContext.js';

package/public/Stage.js

@@ -7,7 +7,7 @@ import { useMeasureAuto } from '../internal/MetricsProvider.js';
 import { usePaneStore } from '../internal/PaneStore.js';
 import { useInert } from '../internal/useInert.js';
 import { EnvironmentFingerprintNode } from './EnvironmentFingerprintNode.js';
-import { s as styles } from '../nav-bar-CmjjkPy6.js';
+import { s as styles } from '../nav-bar-BOTcQpSW.js';
 import '../internal/utils.js';
 import 'motion';
 import '../internal/KeyedSubscriptions.js';

package/public/TitleContainer.js

@@ -3,7 +3,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import classNames from 'classnames';
 import { Morph } from './Morph.js';
 import { TextDefaultPropsContext } from '@hh.ru/magritte-ui-typography';
-import { s as styles } from '../nav-bar-CmjjkPy6.js';
+import { s as styles } from '../nav-bar-BOTcQpSW.js';
 import 'react';
 import 'motion/react';
 import '../internal/MetricsProvider.js';

package/public/Trigger.d.ts

@@ -0,0 +1,29 @@
+import { type ElementType, type HTMLAttributes, type ReactNode } from 'react';
+import { type TriggerEdge } from '@hh.ru/magritte-ui-nav-bar/public/TriggerContext';
+export interface TriggerProps extends Omit<HTMLAttributes<HTMLElement>, 'children'> {
+    children?: ReactNode;
+    /**
+     * Пометить блок как позицию **начала** scroll-анимации NavBar.
+     * Значение — край, по которому измеряется позиция (`top`/`bottom`); `true` — естественный край (`top`).
+     */
+    startTrigger?: TriggerEdge | boolean;
+    /**
+     * Пометить блок как позицию **конца** scroll-анимации NavBar.
+     * Значение — край, по которому измеряется позиция (`top`/`bottom`); `true` — естественный край (`bottom`).
+     */
+    endTrigger?: TriggerEdge | boolean;
+    /**
+     * Тег/компонент элемента-обёртки. Обёртка становится flex/grid-айтемом вместо `children` —
+     * при необходимости управляйте раскладкой через `className`. Игнорируется при `asChild`.
+     * @default div
+     */
+    as?: ElementType;
+    /**
+     * Не оборачивать, а пометить **сам** дочерний элемент (клонировать его, прокинув `ref`).
+     * Дочерний элемент должен быть единственным и пробрасывать `ref` на DOM-узел.
+     * Используйте, когда обёртка ломает раскладку (например, `Modal.Media` с краевыми отступами).
+     * @default false
+     */
+    asChild?: boolean;
+}
+export declare const Trigger: import("react").ForwardRefExoticComponent<TriggerProps & import("react").RefAttributes<HTMLElement>>;

package/public/Trigger.js

@@ -0,0 +1,37 @@
+import './../index.css';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef, useRef, useMemo, isValidElement, cloneElement } from 'react';
+import { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';
+import { useRegisterTriggerSlot } from './TriggerContext.js';
+import '@hh.ru/magritte-internal-slot-registry';
+
+const resolveEdge = (value, naturalEdge) => {
+    if (value === true) {
+        return naturalEdge;
+    }
+    if (value === false || value === undefined) {
+        return undefined;
+    }
+    return value;
+};
+const Trigger = forwardRef(({ children, startTrigger, endTrigger, as: Element = 'div', asChild = false, ...rest }, ref) => {
+    const innerRef = useRef(null);
+    const startEdge = resolveEdge(startTrigger, 'top');
+    const endEdge = resolveEdge(endTrigger, 'bottom');
+    // Стабильная ссылка на значение слота: useRegisterSlot держит `value` в зависимостях эффекта
+    // и дедупит по Object.is — без мемоизации регистрация бы перетряхивалась на каждый рендер.
+    const startSlot = useMemo(() => (startEdge ? { ref: innerRef, edge: startEdge } : undefined), [startEdge]);
+    const endSlot = useMemo(() => (endEdge ? { ref: innerRef, edge: endEdge } : undefined), [endEdge]);
+    useRegisterTriggerSlot('startTrigger', startSlot);
+    useRegisterTriggerSlot('endTrigger', endSlot);
+    const child = asChild && isValidElement(children) ? children : null;
+    const setRefs = useMultipleRefs(ref, innerRef, child?.props.ref ?? null);
+    if (child) {
+        return cloneElement(child, { ref: setRefs });
+    }
+    return (jsx(Element, { ref: setRefs, ...rest, children: children }));
+});
+Trigger.displayName = 'Trigger';
+
+export { Trigger };
+//# sourceMappingURL=Trigger.js.map

package/public/Trigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Trigger.js","sources":["src/public/Trigger.tsx"],"sourcesContent":["import {\n    type ElementType,\n    type HTMLAttributes,\n    type ReactElement,\n    type ReactNode,\n    type Ref,\n    cloneElement,\n    forwardRef,\n    isValidElement,\n    useMemo,\n    useRef,\n} from 'react';\n\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { type TriggerEdge, useRegisterTriggerSlot } from '@hh.ru/magritte-ui-nav-bar/public/TriggerContext';\n\nexport interface TriggerProps extends Omit<HTMLAttributes<HTMLElement>, 'children'> {\n    children?: ReactNode;\n    /**\n     * Пометить блок как позицию **начала** scroll-анимации NavBar.\n     * Значение — край, по которому измеряется позиция (`top`/`bottom`); `true` — естественный край (`top`).\n     */\n    startTrigger?: TriggerEdge | boolean;\n    /**\n     * Пометить блок как позицию **конца** scroll-анимации NavBar.\n     * Значение — край, по которому измеряется позиция (`top`/`bottom`); `true` — естественный край (`bottom`).\n     */\n    endTrigger?: TriggerEdge | boolean;\n    /**\n     * Тег/компонент элемента-обёртки. Обёртка становится flex/grid-айтемом вместо `children` —\n     * при необходимости управляйте раскладкой через `className`. Игнорируется при `asChild`.\n     * @default div\n     */\n    as?: ElementType;\n    /**\n     * Не оборачивать, а пометить **сам** дочерний элемент (клонировать его, прокинув `ref`).\n     * Дочерний элемент должен быть единственным и пробрасывать `ref` на DOM-узел.\n     * Используйте, когда обёртка ломает раскладку (например, `Modal.Media` с краевыми отступами).\n     * @default false\n     */\n    asChild?: boolean;\n}\n\nconst resolveEdge = (value: TriggerEdge | boolean | undefined, naturalEdge: TriggerEdge): TriggerEdge | undefined => {\n    if (value === true) {\n        return naturalEdge;\n    }\n    if (value === false || value === undefined) {\n        return undefined;\n    }\n    return value;\n};\n\nexport const Trigger = forwardRef<HTMLElement, TriggerProps>(\n    ({ children, startTrigger, endTrigger, as: Element = 'div', asChild = false, ...rest }, ref) => {\n        const innerRef = useRef<HTMLElement>(null);\n\n        const startEdge = resolveEdge(startTrigger, 'top');\n        const endEdge = resolveEdge(endTrigger, 'bottom');\n\n        // Стабильная ссылка на значение слота: useRegisterSlot держит `value` в зависимостях эффекта\n        // и дедупит по Object.is — без мемоизации регистрация бы перетряхивалась на каждый рендер.\n        const startSlot = useMemo(() => (startEdge ? { ref: innerRef, edge: startEdge } : undefined), [startEdge]);\n        const endSlot = useMemo(() => (endEdge ? { ref: innerRef, edge: endEdge } : undefined), [endEdge]);\n\n        useRegisterTriggerSlot('startTrigger', startSlot);\n        useRegisterTriggerSlot('endTrigger', endSlot);\n\n        const child =\n            asChild && isValidElement(children) ? (children as ReactElement<{ ref?: Ref<HTMLElement> }>) : null;\n        const setRefs = useMultipleRefs(ref, innerRef, child?.props.ref ?? null);\n\n        if (child) {\n            return cloneElement(child, { ref: setRefs });\n        }\n\n        return (\n            <Element ref={setRefs} {...rest}>\n                {children}\n            </Element>\n        );\n    }\n);\n\nTrigger.displayName = 'Trigger';\n"],"names":["_jsx"],"mappings":";;;;;;AA2CA,MAAM,WAAW,GAAG,CAAC,KAAwC,EAAE,WAAwB,KAA6B;AAChH,IAAA,IAAI,KAAK,KAAK,IAAI,EAAE;AAChB,QAAA,OAAO,WAAW,CAAC;KACtB;IACD,IAAI,KAAK,KAAK,KAAK,IAAI,KAAK,KAAK,SAAS,EAAE;AACxC,QAAA,OAAO,SAAS,CAAC;KACpB;AACD,IAAA,OAAO,KAAK,CAAC;AACjB,CAAC,CAAC;AAEK,MAAM,OAAO,GAAG,UAAU,CAC7B,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,EAAE,OAAO,GAAG,KAAK,EAAE,OAAO,GAAG,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,KAAI;AAC3F,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAE3C,MAAM,SAAS,GAAG,WAAW,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,WAAW,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;;;AAIlD,IAAA,MAAM,SAAS,GAAG,OAAO,CAAC,OAAO,SAAS,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;AAC3G,IAAA,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,OAAO,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,SAAS,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;AAEnG,IAAA,sBAAsB,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;AAClD,IAAA,sBAAsB,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC;AAE9C,IAAA,MAAM,KAAK,GACP,OAAO,IAAI,cAAc,CAAC,QAAQ,CAAC,GAAI,QAAqD,GAAG,IAAI,CAAC;AACxG,IAAA,MAAM,OAAO,GAAG,eAAe,CAAC,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,CAAC,GAAG,IAAI,IAAI,CAAC,CAAC;IAEzE,IAAI,KAAK,EAAE;QACP,OAAO,YAAY,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC,CAAC;KAChD;AAED,IAAA,QACIA,GAAA,CAAC,OAAO,EAAA,EAAC,GAAG,EAAE,OAAO,EAAA,GAAM,IAAI,EAAA,QAAA,EAC1B,QAAQ,EAAA,CACH,EACZ;AACN,CAAC,EACH;AAEF,OAAO,CAAC,WAAW,GAAG,SAAS;;;;"}

package/public/TriggerContext.d.ts

@@ -0,0 +1,20 @@
+import { type RefObject } from 'react';
+/** Край размеченного блока, по которому NavBar измеряет позицию триггера scroll-анимации. */
+export type TriggerEdge = 'top' | 'bottom';
+/** Значение слота триггера: ссылка на размеченный блок и край, по которому брать его позицию. */
+export interface TriggerSlot {
+    ref: RefObject<HTMLElement | null>;
+    edge: TriggerEdge;
+}
+/**
+ * Карта слотов триггеров NavBar: позиции начала и конца scroll-анимации.
+ * Заполняются компонентом `Trigger`, читаются самим `NavBar` (как дефолт для
+ * `startTriggerPosition`/`endTriggerPosition` и `startTriggerEdge`/`endTriggerEdge`).
+ */
+export interface NavBarTriggerSlots {
+    startTrigger: TriggerSlot;
+    endTrigger: TriggerSlot;
+}
+export declare const TriggerProvider: import("react").FC<{
+    children?: import("react").ReactNode | undefined;
+}>, useRegisterTriggerSlot: <K extends keyof NavBarTriggerSlots>(key: K, value: NavBarTriggerSlots[K] | null | undefined) => void, useTriggerSlot: <K extends keyof NavBarTriggerSlots>(key: K) => NavBarTriggerSlots[K] | undefined;

package/public/TriggerContext.js

@@ -0,0 +1,7 @@
+import './../index.css';
+import { createSlotRegistry } from '@hh.ru/magritte-internal-slot-registry';
+
+const { SlotRegistryProvider: TriggerProvider, useRegisterSlot: useRegisterTriggerSlot, useSlotRegistryValue: useTriggerSlot, } = createSlotRegistry('NavBarTrigger');
+
+export { TriggerProvider, useRegisterTriggerSlot, useTriggerSlot };
+//# sourceMappingURL=TriggerContext.js.map

package/public/TriggerContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TriggerContext.js","sources":["src/public/TriggerContext.ts"],"sourcesContent":["import { type RefObject } from 'react';\n\nimport { createSlotRegistry } from '@hh.ru/magritte-internal-slot-registry';\n\n/** Край размеченного блока, по которому NavBar измеряет позицию триггера scroll-анимации. */\nexport type TriggerEdge = 'top' | 'bottom';\n\n/** Значение слота триггера: ссылка на размеченный блок и край, по которому брать его позицию. */\nexport interface TriggerSlot {\n    ref: RefObject<HTMLElement | null>;\n    edge: TriggerEdge;\n}\n\n/**\n * Карта слотов триггеров NavBar: позиции начала и конца scroll-анимации.\n * Заполняются компонентом `Trigger`, читаются самим `NavBar` (как дефолт для\n * `startTriggerPosition`/`endTriggerPosition` и `startTriggerEdge`/`endTriggerEdge`).\n */\nexport interface NavBarTriggerSlots {\n    startTrigger: TriggerSlot;\n    endTrigger: TriggerSlot;\n}\n\nexport const {\n    SlotRegistryProvider: TriggerProvider,\n    useRegisterSlot: useRegisterTriggerSlot,\n    useSlotRegistryValue: useTriggerSlot,\n} = createSlotRegistry<NavBarTriggerSlots>('NavBarTrigger');\n"],"names":[],"mappings":";;MAuBa,EACT,oBAAoB,EAAE,eAAe,EACrC,eAAe,EAAE,sBAAsB,EACvC,oBAAoB,EAAE,cAAc,GACvC,GAAG,kBAAkB,CAAqB,eAAe;;;;"}

package/nav-bar-CmjjkPy6.js

@@ -1,5 +0,0 @@
-import './index.css';
-var styles = {"actions-container":"magritte-actions-container___CBgYW_1-3-26","actionsContainer":"magritte-actions-container___CBgYW_1-3-26","actions-no-children":"magritte-actions-no-children___rgJUl_1-3-26","actionsNoChildren":"magritte-actions-no-children___rgJUl_1-3-26","actions-left-slot":"magritte-actions-left-slot___DNOj0_1-3-26","actionsLeftSlot":"magritte-actions-left-slot___DNOj0_1-3-26","actions-right-slot":"magritte-actions-right-slot___aodtj_1-3-26","actionsRightSlot":"magritte-actions-right-slot___aodtj_1-3-26","navbar-transparent-end":"magritte-navbar-transparent-end___6KqLR_1-3-26","navbarTransparentEnd":"magritte-navbar-transparent-end___6KqLR_1-3-26","actions-start-stage":"magritte-actions-start-stage___MJ67a_1-3-26","actionsStartStage":"magritte-actions-start-stage___MJ67a_1-3-26","actions-side-slot-content":"magritte-actions-side-slot-content___TlHrX_1-3-26","actionsSideSlotContent":"magritte-actions-side-slot-content___TlHrX_1-3-26","actions-icon-morph":"magritte-actions-icon-morph___-nNgW_1-3-26","actionsIconMorph":"magritte-actions-icon-morph___-nNgW_1-3-26","navbar-transparent-start":"magritte-navbar-transparent-start___wysv0_1-3-26","navbarTransparentStart":"magritte-navbar-transparent-start___wysv0_1-3-26","actions-end-stage":"magritte-actions-end-stage___qHtTV_1-3-26","actionsEndStage":"magritte-actions-end-stage___qHtTV_1-3-26","navbar-not-transparent":"magritte-navbar-not-transparent___5KZNp_1-3-26","navbarNotTransparent":"magritte-navbar-not-transparent___5KZNp_1-3-26","navbar-transparent":"magritte-navbar-transparent___ULEh8_1-3-26","navbarTransparent":"magritte-navbar-transparent___ULEh8_1-3-26","actions-only-stage":"magritte-actions-only-stage___cg10A_1-3-26","actionsOnlyStage":"magritte-actions-only-stage___cg10A_1-3-26","actions-side-slot-content-clone":"magritte-actions-side-slot-content-clone___jDxVm_1-3-26","actionsSideSlotContentClone":"magritte-actions-side-slot-content-clone___jDxVm_1-3-26","actions-center-slot":"magritte-actions-center-slot___hLAy6_1-3-26","actionsCenterSlot":"magritte-actions-center-slot___hLAy6_1-3-26","actions-center-slot-centered":"magritte-actions-center-slot-centered___merXQ_1-3-26","actionsCenterSlotCentered":"magritte-actions-center-slot-centered___merXQ_1-3-26","align-top":"magritte-align-top___-QSFW_1-3-26","alignTop":"magritte-align-top___-QSFW_1-3-26","align-bottom":"magritte-align-bottom___FliHI_1-3-26","alignBottom":"magritte-align-bottom___FliHI_1-3-26","title-container-wrapper":"magritte-title-container-wrapper___DQUcj_1-3-26","titleContainerWrapper":"magritte-title-container-wrapper___DQUcj_1-3-26","title-main-part":"magritte-title-main-part___npoHN_1-3-26","titleMainPart":"magritte-title-main-part___npoHN_1-3-26","title-left-slot":"magritte-title-left-slot___HTE7h_1-3-26","titleLeftSlot":"magritte-title-left-slot___HTE7h_1-3-26","title-container":"magritte-title-container___y9AIx_1-3-26","titleContainer":"magritte-title-container___y9AIx_1-3-26","subtitle-container":"magritte-subtitle-container___nVUBu_1-3-26","subtitleContainer":"magritte-subtitle-container___nVUBu_1-3-26","text-morph-item":"magritte-text-morph-item___-vXru_1-3-26","textMorphItem":"magritte-text-morph-item___-vXru_1-3-26","centered":"magritte-centered___Y2mlP_1-3-26","title-morph-item":"magritte-title-morph-item___t7Wf3_1-3-26","titleMorphItem":"magritte-title-morph-item___t7Wf3_1-3-26","title":"magritte-title___ZbLgP_1-3-26","size-large":"magritte-size-large___ISXfH_1-3-26","sizeLarge":"magritte-size-large___ISXfH_1-3-26","pane-content":"magritte-pane-content___UVmC6_1-3-26","paneContent":"magritte-pane-content___UVmC6_1-3-26","pane-background":"magritte-pane-background___PDZAX_1-3-26","paneBackground":"magritte-pane-background___PDZAX_1-3-26","morph-item":"magritte-morph-item___8kF46_1-3-26","morphItem":"magritte-morph-item___8kF46_1-3-26","morph-item-top":"magritte-morph-item-top___WPEkn_1-3-26","morphItemTop":"magritte-morph-item-top___WPEkn_1-3-26","morph-item-bottom":"magritte-morph-item-bottom___zNbsF_1-3-26","morphItemBottom":"magritte-morph-item-bottom___zNbsF_1-3-26","morph-item-left":"magritte-morph-item-left___T6AMW_1-3-26","morphItemLeft":"magritte-morph-item-left___T6AMW_1-3-26","morph-item-right":"magritte-morph-item-right___EuT1E_1-3-26","morphItemRight":"magritte-morph-item-right___EuT1E_1-3-26","pane":"magritte-pane___f8eFC_1-3-26","start-state-container":"magritte-start-state-container___giBVb_1-3-26","startStateContainer":"magritte-start-state-container___giBVb_1-3-26","end-state-container":"magritte-end-state-container___uiW8Q_1-3-26","endStateContainer":"magritte-end-state-container___uiW8Q_1-3-26","content-container":"magritte-content-container___7s7vv_1-3-26","contentContainer":"magritte-content-container___7s7vv_1-3-26","next-pane":"magritte-next-pane___H2oxQ_1-3-26","nextPane":"magritte-next-pane___H2oxQ_1-3-26","nav-bar":"magritte-nav-bar___RRGe0_1-3-26","navBar":"magritte-nav-bar___RRGe0_1-3-26","nav-bar-overlay":"magritte-nav-bar-overlay___Mq5ZD_1-3-26","navBarOverlay":"magritte-nav-bar-overlay___Mq5ZD_1-3-26","nav-bar-overlay-wrapper":"magritte-nav-bar-overlay-wrapper___y1VpY_1-3-26","navBarOverlayWrapper":"magritte-nav-bar-overlay-wrapper___y1VpY_1-3-26","nav-bar-content-container":"magritte-nav-bar-content-container___H-WMO_1-3-26","navBarContentContainer":"magritte-nav-bar-content-container___H-WMO_1-3-26","nav-bar-panes-container":"magritte-nav-bar-panes-container___5ZDLa_1-3-26","navBarPanesContainer":"magritte-nav-bar-panes-container___5ZDLa_1-3-26","nav-bar-progressive-blur":"magritte-nav-bar-progressive-blur___qyeUV_1-3-26","navBarProgressiveBlur":"magritte-nav-bar-progressive-blur___qyeUV_1-3-26","nav-bar-stage":"magritte-nav-bar-stage___amDz7_1-3-26","navBarStage":"magritte-nav-bar-stage___amDz7_1-3-26","last-pane":"magritte-last-pane___Hf2No_1-3-26","lastPane":"magritte-last-pane___Hf2No_1-3-26","metrics-mode":"magritte-metrics-mode___h38aX_1-3-26","metricsMode":"magritte-metrics-mode___h38aX_1-3-26","layout-morph":"magritte-layout-morph___I3SPy_1-3-26","layoutMorph":"magritte-layout-morph___I3SPy_1-3-26","animation-stage-progress":"magritte-animation-stage-progress___5FthT_1-3-26","animationStageProgress":"magritte-animation-stage-progress___5FthT_1-3-26","layout-morph-start":"magritte-layout-morph-start___9-krP_1-3-26","layoutMorphStart":"magritte-layout-morph-start___9-krP_1-3-26","layout-morph-end":"magritte-layout-morph-end___LIg4d_1-3-26","layoutMorphEnd":"magritte-layout-morph-end___LIg4d_1-3-26","divider-container":"magritte-divider-container___-NdWi_1-3-26","dividerContainer":"magritte-divider-container___-NdWi_1-3-26"};
-
-export { styles as s };
-//# sourceMappingURL=nav-bar-CmjjkPy6.js.map

package/nav-bar-CmjjkPy6.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"nav-bar-CmjjkPy6.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}