@hh.ru/magritte-ui-nav-bar 1.0.2 → 1.1.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 (43) hide show
  1. package/{NavBar-BM6rmKUJ.js → NavBar-D9oyKBms.js} +10 -12
  2. package/NavBar-D9oyKBms.js.map +1 -0
  3. package/index.css +94 -94
  4. package/index.js +3 -2
  5. package/index.js.map +1 -1
  6. package/index.mock.js +1 -31
  7. package/index.mock.js.map +1 -1
  8. package/internal/PaneStore.js +1 -2
  9. package/internal/PaneStore.js.map +1 -1
  10. package/internal/useAnimationRanges.d.ts +2 -1
  11. package/internal/useAnimationRanges.js +35 -22
  12. package/internal/useAnimationRanges.js.map +1 -1
  13. package/internal/useBindScrollToAnimationProgress.d.ts +1 -1
  14. package/internal/useBindScrollToAnimationProgress.js +25 -20
  15. package/internal/useBindScrollToAnimationProgress.js.map +1 -1
  16. package/internal/useInert.d.ts +2 -0
  17. package/internal/useInert.js +26 -0
  18. package/internal/useInert.js.map +1 -0
  19. package/internal/useResetFocus.d.ts +1 -1
  20. package/internal/useResetFocus.js +3 -3
  21. package/internal/useResetFocus.js.map +1 -1
  22. package/internal/utils.js +8 -1
  23. package/internal/utils.js.map +1 -1
  24. package/package.json +5 -3
  25. package/public/Actions.js +3 -3
  26. package/public/Actions.js.map +1 -1
  27. package/public/LayoutMorph.js +9 -4
  28. package/public/LayoutMorph.js.map +1 -1
  29. package/public/LayoutStage.js +2 -3
  30. package/public/LayoutStage.js.map +1 -1
  31. package/public/Morph.js +2 -2
  32. package/public/NavBar.d.ts +3 -6
  33. package/public/NavBar.js +1 -2
  34. package/public/NavBar.js.map +1 -1
  35. package/public/Pane.js +3 -3
  36. package/public/Pane.js.map +1 -1
  37. package/public/Stage.js +9 -4
  38. package/public/Stage.js.map +1 -1
  39. package/public/TitleContainer.js +2 -2
  40. package/NavBar-BM6rmKUJ.js.map +0 -1
  41. package/internal/ProgressiveBlur.d.ts +0 -7
  42. package/internal/ProgressiveBlur.js +0 -43
  43. package/internal/ProgressiveBlur.js.map +0 -1
package/{NavBar-BM6rmKUJ.js → NavBar-D9oyKBms.js} RENAMED
@@ -2,11 +2,10 @@ import './index.css';
2
2
  import { jsx, jsxs } from 'react/jsx-runtime';
3
3
  import React, { createContext, useContext, useRef, useLayoutEffect } from 'react';
4
4
  import classNames from 'classnames';
5
- import { useMotionValue, frame, motion } from 'motion/react';
5
+ import { frame, motion } from 'motion/react';
6
6
  import { Divider } from '@hh.ru/magritte-ui-divider';
7
7
  import { Layer } from '@hh.ru/magritte-ui-layer';
8
8
  import { MetricsProvider } from './internal/MetricsProvider.js';
9
- import { ProgressiveBlur } from './internal/ProgressiveBlur.js';
10
9
  import { useAnimationRanges } from './internal/useAnimationRanges.js';
11
10
  import { useBindScrollToAnimationProgress } from './internal/useBindScrollToAnimationProgress.js';
12
11
  import { useNavBarMetrics } from './internal/useNavBarMetrics.js';
@@ -14,25 +13,24 @@ import { useResetFocus } from './internal/useResetFocus.js';
14
13
  import { useScrollAdapter } from './internal/useScrollAdapter.js';
15
14
  import { useSnapScroll } from './internal/useSnapScroll.js';
16
15
  import { useSyncMotionValue } from './internal/useSyncMotionValue.js';
17
- import { useInitOnce, scheduleMicro, scheduleMacro, remap, lerp } from './internal/utils.js';
16
+ import { useInitOnce, scheduleMicro, scheduleMacro, remap } from './internal/utils.js';
18
17
 
19
- var styles = {"actions-container":"magritte-actions-container___CBgYW_1-0-2","actionsContainer":"magritte-actions-container___CBgYW_1-0-2","actions-no-children":"magritte-actions-no-children___rgJUl_1-0-2","actionsNoChildren":"magritte-actions-no-children___rgJUl_1-0-2","actions-left-slot":"magritte-actions-left-slot___DNOj0_1-0-2","actionsLeftSlot":"magritte-actions-left-slot___DNOj0_1-0-2","actions-right-slot":"magritte-actions-right-slot___aodtj_1-0-2","actionsRightSlot":"magritte-actions-right-slot___aodtj_1-0-2","navbar-transparent-end":"magritte-navbar-transparent-end___6KqLR_1-0-2","navbarTransparentEnd":"magritte-navbar-transparent-end___6KqLR_1-0-2","actions-start-stage":"magritte-actions-start-stage___MJ67a_1-0-2","actionsStartStage":"magritte-actions-start-stage___MJ67a_1-0-2","actions-side-slot-content":"magritte-actions-side-slot-content___TlHrX_1-0-2","actionsSideSlotContent":"magritte-actions-side-slot-content___TlHrX_1-0-2","actions-icon-morph":"magritte-actions-icon-morph___-nNgW_1-0-2","actionsIconMorph":"magritte-actions-icon-morph___-nNgW_1-0-2","navbar-transparent-start":"magritte-navbar-transparent-start___wysv0_1-0-2","navbarTransparentStart":"magritte-navbar-transparent-start___wysv0_1-0-2","actions-end-stage":"magritte-actions-end-stage___qHtTV_1-0-2","actionsEndStage":"magritte-actions-end-stage___qHtTV_1-0-2","navbar-not-transparent":"magritte-navbar-not-transparent___5KZNp_1-0-2","navbarNotTransparent":"magritte-navbar-not-transparent___5KZNp_1-0-2","actions-only-stage":"magritte-actions-only-stage___cg10A_1-0-2","actionsOnlyStage":"magritte-actions-only-stage___cg10A_1-0-2","actions-side-slot-content-clone":"magritte-actions-side-slot-content-clone___jDxVm_1-0-2","actionsSideSlotContentClone":"magritte-actions-side-slot-content-clone___jDxVm_1-0-2","actions-center-slot":"magritte-actions-center-slot___hLAy6_1-0-2","actionsCenterSlot":"magritte-actions-center-slot___hLAy6_1-0-2","actions-center-slot-centered":"magritte-actions-center-slot-centered___merXQ_1-0-2","actionsCenterSlotCentered":"magritte-actions-center-slot-centered___merXQ_1-0-2","title-container-wrapper":"magritte-title-container-wrapper___DQUcj_1-0-2","titleContainerWrapper":"magritte-title-container-wrapper___DQUcj_1-0-2","title-main-part":"magritte-title-main-part___npoHN_1-0-2","titleMainPart":"magritte-title-main-part___npoHN_1-0-2","centered":"magritte-centered___Y2mlP_1-0-2","title-left-slot":"magritte-title-left-slot___HTE7h_1-0-2","titleLeftSlot":"magritte-title-left-slot___HTE7h_1-0-2","title-container":"magritte-title-container___y9AIx_1-0-2","titleContainer":"magritte-title-container___y9AIx_1-0-2","subtitle-container":"magritte-subtitle-container___nVUBu_1-0-2","subtitleContainer":"magritte-subtitle-container___nVUBu_1-0-2","title-morph-item":"magritte-title-morph-item___t7Wf3_1-0-2","titleMorphItem":"magritte-title-morph-item___t7Wf3_1-0-2","title":"magritte-title___ZbLgP_1-0-2","pane-content":"magritte-pane-content___UVmC6_1-0-2","paneContent":"magritte-pane-content___UVmC6_1-0-2","pane-background":"magritte-pane-background___PDZAX_1-0-2","paneBackground":"magritte-pane-background___PDZAX_1-0-2","morph-item":"magritte-morph-item___8kF46_1-0-2","morphItem":"magritte-morph-item___8kF46_1-0-2","morph-item-top":"magritte-morph-item-top___WPEkn_1-0-2","morphItemTop":"magritte-morph-item-top___WPEkn_1-0-2","morph-item-bottom":"magritte-morph-item-bottom___zNbsF_1-0-2","morphItemBottom":"magritte-morph-item-bottom___zNbsF_1-0-2","morph-item-left":"magritte-morph-item-left___T6AMW_1-0-2","morphItemLeft":"magritte-morph-item-left___T6AMW_1-0-2","morph-item-right":"magritte-morph-item-right___EuT1E_1-0-2","morphItemRight":"magritte-morph-item-right___EuT1E_1-0-2","pane":"magritte-pane___f8eFC_1-0-2","start-state-container":"magritte-start-state-container___giBVb_1-0-2","startStateContainer":"magritte-start-state-container___giBVb_1-0-2","end-state-container":"magritte-end-state-container___uiW8Q_1-0-2","endStateContainer":"magritte-end-state-container___uiW8Q_1-0-2","content-container":"magritte-content-container___7s7vv_1-0-2","contentContainer":"magritte-content-container___7s7vv_1-0-2","next-pane":"magritte-next-pane___H2oxQ_1-0-2","nextPane":"magritte-next-pane___H2oxQ_1-0-2","nav-bar":"magritte-nav-bar___RRGe0_1-0-2","navBar":"magritte-nav-bar___RRGe0_1-0-2","nav-bar-overlay":"magritte-nav-bar-overlay___Mq5ZD_1-0-2","navBarOverlay":"magritte-nav-bar-overlay___Mq5ZD_1-0-2","nav-bar-overlay-wrapper":"magritte-nav-bar-overlay-wrapper___y1VpY_1-0-2","navBarOverlayWrapper":"magritte-nav-bar-overlay-wrapper___y1VpY_1-0-2","nav-bar-content-container":"magritte-nav-bar-content-container___H-WMO_1-0-2","navBarContentContainer":"magritte-nav-bar-content-container___H-WMO_1-0-2","nav-bar-panes-container":"magritte-nav-bar-panes-container___5ZDLa_1-0-2","navBarPanesContainer":"magritte-nav-bar-panes-container___5ZDLa_1-0-2","nav-bar-progressive-blur":"magritte-nav-bar-progressive-blur___qyeUV_1-0-2","navBarProgressiveBlur":"magritte-nav-bar-progressive-blur___qyeUV_1-0-2","nav-bar-stage":"magritte-nav-bar-stage___amDz7_1-0-2","navBarStage":"magritte-nav-bar-stage___amDz7_1-0-2","metrics-mode":"magritte-metrics-mode___h38aX_1-0-2","metricsMode":"magritte-metrics-mode___h38aX_1-0-2","layout-morph":"magritte-layout-morph___I3SPy_1-0-2","layoutMorph":"magritte-layout-morph___I3SPy_1-0-2","animation-stage-progress":"magritte-animation-stage-progress___5FthT_1-0-2","animationStageProgress":"magritte-animation-stage-progress___5FthT_1-0-2","layout-morph-start":"magritte-layout-morph-start___9-krP_1-0-2","layoutMorphStart":"magritte-layout-morph-start___9-krP_1-0-2","layout-morph-end":"magritte-layout-morph-end___LIg4d_1-0-2","layoutMorphEnd":"magritte-layout-morph-end___LIg4d_1-0-2","divider-container":"magritte-divider-container___-NdWi_1-0-2","dividerContainer":"magritte-divider-container___-NdWi_1-0-2"};
18
+ var styles = {"actions-container":"magritte-actions-container___CBgYW_1-1-0","actionsContainer":"magritte-actions-container___CBgYW_1-1-0","actions-no-children":"magritte-actions-no-children___rgJUl_1-1-0","actionsNoChildren":"magritte-actions-no-children___rgJUl_1-1-0","actions-left-slot":"magritte-actions-left-slot___DNOj0_1-1-0","actionsLeftSlot":"magritte-actions-left-slot___DNOj0_1-1-0","actions-right-slot":"magritte-actions-right-slot___aodtj_1-1-0","actionsRightSlot":"magritte-actions-right-slot___aodtj_1-1-0","navbar-transparent-end":"magritte-navbar-transparent-end___6KqLR_1-1-0","navbarTransparentEnd":"magritte-navbar-transparent-end___6KqLR_1-1-0","actions-start-stage":"magritte-actions-start-stage___MJ67a_1-1-0","actionsStartStage":"magritte-actions-start-stage___MJ67a_1-1-0","actions-side-slot-content":"magritte-actions-side-slot-content___TlHrX_1-1-0","actionsSideSlotContent":"magritte-actions-side-slot-content___TlHrX_1-1-0","actions-icon-morph":"magritte-actions-icon-morph___-nNgW_1-1-0","actionsIconMorph":"magritte-actions-icon-morph___-nNgW_1-1-0","navbar-transparent-start":"magritte-navbar-transparent-start___wysv0_1-1-0","navbarTransparentStart":"magritte-navbar-transparent-start___wysv0_1-1-0","actions-end-stage":"magritte-actions-end-stage___qHtTV_1-1-0","actionsEndStage":"magritte-actions-end-stage___qHtTV_1-1-0","navbar-not-transparent":"magritte-navbar-not-transparent___5KZNp_1-1-0","navbarNotTransparent":"magritte-navbar-not-transparent___5KZNp_1-1-0","actions-only-stage":"magritte-actions-only-stage___cg10A_1-1-0","actionsOnlyStage":"magritte-actions-only-stage___cg10A_1-1-0","actions-side-slot-content-clone":"magritte-actions-side-slot-content-clone___jDxVm_1-1-0","actionsSideSlotContentClone":"magritte-actions-side-slot-content-clone___jDxVm_1-1-0","actions-center-slot":"magritte-actions-center-slot___hLAy6_1-1-0","actionsCenterSlot":"magritte-actions-center-slot___hLAy6_1-1-0","actions-center-slot-centered":"magritte-actions-center-slot-centered___merXQ_1-1-0","actionsCenterSlotCentered":"magritte-actions-center-slot-centered___merXQ_1-1-0","title-container-wrapper":"magritte-title-container-wrapper___DQUcj_1-1-0","titleContainerWrapper":"magritte-title-container-wrapper___DQUcj_1-1-0","title-main-part":"magritte-title-main-part___npoHN_1-1-0","titleMainPart":"magritte-title-main-part___npoHN_1-1-0","centered":"magritte-centered___Y2mlP_1-1-0","title-left-slot":"magritte-title-left-slot___HTE7h_1-1-0","titleLeftSlot":"magritte-title-left-slot___HTE7h_1-1-0","title-container":"magritte-title-container___y9AIx_1-1-0","titleContainer":"magritte-title-container___y9AIx_1-1-0","subtitle-container":"magritte-subtitle-container___nVUBu_1-1-0","subtitleContainer":"magritte-subtitle-container___nVUBu_1-1-0","title-morph-item":"magritte-title-morph-item___t7Wf3_1-1-0","titleMorphItem":"magritte-title-morph-item___t7Wf3_1-1-0","title":"magritte-title___ZbLgP_1-1-0","pane-content":"magritte-pane-content___UVmC6_1-1-0","paneContent":"magritte-pane-content___UVmC6_1-1-0","pane-background":"magritte-pane-background___PDZAX_1-1-0","paneBackground":"magritte-pane-background___PDZAX_1-1-0","morph-item":"magritte-morph-item___8kF46_1-1-0","morphItem":"magritte-morph-item___8kF46_1-1-0","morph-item-top":"magritte-morph-item-top___WPEkn_1-1-0","morphItemTop":"magritte-morph-item-top___WPEkn_1-1-0","morph-item-bottom":"magritte-morph-item-bottom___zNbsF_1-1-0","morphItemBottom":"magritte-morph-item-bottom___zNbsF_1-1-0","morph-item-left":"magritte-morph-item-left___T6AMW_1-1-0","morphItemLeft":"magritte-morph-item-left___T6AMW_1-1-0","morph-item-right":"magritte-morph-item-right___EuT1E_1-1-0","morphItemRight":"magritte-morph-item-right___EuT1E_1-1-0","pane":"magritte-pane___f8eFC_1-1-0","start-state-container":"magritte-start-state-container___giBVb_1-1-0","startStateContainer":"magritte-start-state-container___giBVb_1-1-0","end-state-container":"magritte-end-state-container___uiW8Q_1-1-0","endStateContainer":"magritte-end-state-container___uiW8Q_1-1-0","content-container":"magritte-content-container___7s7vv_1-1-0","contentContainer":"magritte-content-container___7s7vv_1-1-0","next-pane":"magritte-next-pane___H2oxQ_1-1-0","nextPane":"magritte-next-pane___H2oxQ_1-1-0","nav-bar":"magritte-nav-bar___RRGe0_1-1-0","navBar":"magritte-nav-bar___RRGe0_1-1-0","nav-bar-overlay":"magritte-nav-bar-overlay___Mq5ZD_1-1-0","navBarOverlay":"magritte-nav-bar-overlay___Mq5ZD_1-1-0","nav-bar-overlay-wrapper":"magritte-nav-bar-overlay-wrapper___y1VpY_1-1-0","navBarOverlayWrapper":"magritte-nav-bar-overlay-wrapper___y1VpY_1-1-0","nav-bar-content-container":"magritte-nav-bar-content-container___H-WMO_1-1-0","navBarContentContainer":"magritte-nav-bar-content-container___H-WMO_1-1-0","nav-bar-panes-container":"magritte-nav-bar-panes-container___5ZDLa_1-1-0","navBarPanesContainer":"magritte-nav-bar-panes-container___5ZDLa_1-1-0","nav-bar-progressive-blur":"magritte-nav-bar-progressive-blur___qyeUV_1-1-0","navBarProgressiveBlur":"magritte-nav-bar-progressive-blur___qyeUV_1-1-0","nav-bar-stage":"magritte-nav-bar-stage___amDz7_1-1-0","navBarStage":"magritte-nav-bar-stage___amDz7_1-1-0","metrics-mode":"magritte-metrics-mode___h38aX_1-1-0","metricsMode":"magritte-metrics-mode___h38aX_1-1-0","layout-morph":"magritte-layout-morph___I3SPy_1-1-0","layoutMorph":"magritte-layout-morph___I3SPy_1-1-0","animation-stage-progress":"magritte-animation-stage-progress___5FthT_1-1-0","animationStageProgress":"magritte-animation-stage-progress___5FthT_1-1-0","layout-morph-start":"magritte-layout-morph-start___9-krP_1-1-0","layoutMorphStart":"magritte-layout-morph-start___9-krP_1-1-0","layout-morph-end":"magritte-layout-morph-end___LIg4d_1-1-0","layoutMorphEnd":"magritte-layout-morph-end___LIg4d_1-1-0","divider-container":"magritte-divider-container___-NdWi_1-1-0","dividerContainer":"magritte-divider-container___-NdWi_1-1-0"};
20
19
 
21
20
  const NavBarContext = createContext(null);
22
21
  const useNavBarContext = () => useContext(NavBarContext);
23
- const NavBar = ({ children, transparent = false, startTriggerPosition = 'start', endTriggerPosition, progressiveBlur = false, overlay = false, snapScroll: scrollSnapping = true, showDivider = false, animationProgress, }) => {
24
- const blurScaleY = useMotionValue(1);
22
+ const NavBar = ({ children, transparent = false, startTriggerPosition = 'start', endTriggerPosition, overlay = false, snapScroll: scrollSnapping = true, showDivider = false, animationProgress, }) => {
25
23
  const paneStoreRegistry = useInitOnce(() => new Set());
26
24
  const prevFullHeight = useRef(0);
27
25
  const rootRef = useRef(null);
28
26
  const [scrollAdapter, scrollPosition] = useScrollAdapter(rootRef);
29
27
  const [getMetrics, invalidateMetrics] = useNavBarMetrics(paneStoreRegistry, rootRef, scrollAdapter);
30
- const [getAnimationRanges, invalidateAnimationRanges] = useAnimationRanges(paneStoreRegistry);
28
+ const [getAnimationRanges, invalidateAnimationRanges] = useAnimationRanges(paneStoreRegistry, getMetrics);
31
29
  const [bindScrollToAnimation, getClosestStops, totalAnimationProgress, dividerStyle] = useBindScrollToAnimationProgress(scrollPosition, getMetrics, getAnimationRanges, scrollAdapter, startTriggerPosition, endTriggerPosition);
32
30
  const snapScroll = useSnapScroll(scrollPosition, totalAnimationProgress, scrollAdapter, getClosestStops, scrollSnapping);
33
31
  // При получении размеров важно дождаться применения MotionValue к DOM, поэтому используем frame.render
34
32
  const bindScrollToAnimationScheduled = useInitOnce(() => scheduleMicro(() => frame.render(bindScrollToAnimation)));
35
- useResetFocus(rootRef, scrollPosition);
33
+ useResetFocus(rootRef, totalAnimationProgress);
36
34
  useSyncMotionValue(totalAnimationProgress, animationProgress);
37
35
  const dividerVisibility =
38
36
  // eslint-disable-next-line no-nested-ternary
@@ -46,6 +44,7 @@ const NavBar = ({ children, transparent = false, startTriggerPosition = 'start',
46
44
  bindScrollToAnimationScheduled();
47
45
  const navBarMetrics = getMetrics();
48
46
  const fullPanesStartHeight = navBarMetrics.bottom - navBarMetrics.top;
47
+ const animationHeight = navBarMetrics.heightDelta || fullPanesStartHeight;
49
48
  let scroll = scrollAdapter.getScrollTop();
50
49
  if (prevFullHeight.current !== null && scroll !== 0) {
51
50
  const heightDelta = fullPanesStartHeight - prevFullHeight.current;
@@ -63,12 +62,11 @@ const NavBar = ({ children, transparent = false, startTriggerPosition = 'start',
63
62
  }
64
63
  const remapFn = remap(range[0] === 0 && range[1] === 0
65
64
  ? [0, 1]
66
- : [range[0] / navBarMetrics.heightDelta, range[1] / navBarMetrics.heightDelta], [0, 1]);
65
+ : [range[0] / animationHeight, range[1] / animationHeight], [0, 1]);
67
66
  const motionValue = paneStore.get('motionValue');
68
67
  motionValue.set(remapFn(totalAnimationProgress.get()));
69
68
  subscriptions.push(totalAnimationProgress.on('change', (value) => motionValue.set(remapFn(value))));
70
69
  });
71
- subscriptions.push(totalAnimationProgress.on('change', (value) => blurScaleY.set(lerp(1, 1 - navBarMetrics.heightDelta / fullPanesStartHeight, value))));
72
70
  prevFullHeight.current = fullPanesStartHeight;
73
71
  };
74
72
  // основной триггер запуска updateAnimationParams это изменения размеров, обработка которых происходит
@@ -112,8 +110,8 @@ const NavBar = ({ children, transparent = false, startTriggerPosition = 'start',
112
110
  [styles.navbarTransparentEnd]: transparent === 'end',
113
111
  [styles.navbarNotTransparent]: !transparent,
114
112
  [styles.navBarOverlay]: overlay,
115
- }), ref: rootRef, measureClassName: styles.metricsMode, children: jsx("div", { className: styles.navBarOverlayWrapper, children: jsxs("div", { className: styles.navBarContentContainer, children: [jsx(motion.div, { style: { '--magritte-ui-navbar-animation-progress': totalAnimationProgress }, className: styles.navBarPanesContainer, children: jsx(NavBarContext.Provider, { value: registerPaneStore, children: nested }) }), progressiveBlur && (jsx(ProgressiveBlur, { className: styles.navBarProgressiveBlur, detail: 4, blurAmount: 3, blurHeight: 100, style: { scaleY: blurScaleY } })), jsx(motion.div, { className: styles.dividerContainer, style: { ...dividerStyle, visibility: dividerVisibility }, children: jsx(Divider, {}) })] }) }) }) }));
113
+ }), ref: rootRef, measureClassName: styles.metricsMode, children: jsx("div", { className: styles.navBarOverlayWrapper, children: jsxs("div", { className: styles.navBarContentContainer, children: [jsx(motion.div, { style: { '--magritte-ui-navbar-animation-progress': totalAnimationProgress }, className: styles.navBarPanesContainer, children: jsx(NavBarContext.Provider, { value: registerPaneStore, children: nested }) }), jsx(motion.div, { className: styles.dividerContainer, style: { ...dividerStyle, visibility: dividerVisibility }, children: jsx(Divider, {}) })] }) }) }) }));
116
114
  };
117
115
 
118
116
  export { NavBar as N, styles as s, useNavBarContext as u };
119
- //# sourceMappingURL=NavBar-BM6rmKUJ.js.map
117
+ //# sourceMappingURL=NavBar-D9oyKBms.js.map
package/NavBar-D9oyKBms.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"NavBar-D9oyKBms.js","sources":["../src/public/NavBar.tsx"],"sourcesContent":["import React, { createContext, type RefObject, useContext, 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 { 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 { type PaneElement, type InternalPaneProps } from '@hh.ru/magritte-ui-nav-bar/public/Pane';\n\nimport styles from './nav-bar.less';\n\ntype PaneStoreContextValue = ((store: PaneStore) => VoidFunction) | null;\nconst NavBarContext = createContext<PaneStoreContextValue>(null);\n\nexport const useNavBarContext = (): PaneStoreContextValue => useContext(NavBarContext);\n\nexport interface NavBarProps {\n /**\n * В качестве потомков могут передаваться только компоненты <Pane />\n */\n children: PaneElement | PaneElement[];\n /**\n * Управляет режимом прозрачности:\n * -- Прозрачность отключена (`false`)\n * -- Прозрачный всегда (`true`)\n * -- Прозрачный в начале анимации (`start`)\n * -- Прозрачный в конце анимации (`end`)\n */\n transparent?: 'start' | 'end' | boolean;\n /**\n * Управляет позицией триггера начала анимации\n */\n startTriggerPosition?: 'start' | 'full-area' | RefObject<HTMLElement | null>;\n /**\n * Управляет позицией триггера конца анимации. Если не передан вычисляется автоматически на основе изменения\n * высоты навбара в процессе анимации и позиции триггера начала анмиации. Если передано число, то интерпретируется\n * как отступ в пикселях от позиции триггера старта анимации.\n */\n endTriggerPosition?: RefObject<HTMLElement | null> | number;\n /**\n * Включает режим когда NavBar не занимает место в лейауте и контент располагается под ним.\n */\n overlay?: boolean;\n /**\n * Управляет режимом автодоскролла. По умолчанию включен.\n */\n snapScroll?: boolean;\n /**\n * Управляет режимом отображения дивайдера:\n * - `false` дивайдер отключен\n * - `always` дивайдер отображается постоянно\n * - `with-scroll` дивайдер отображается только когда контент подскроллен под NavBar\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> = ({\n children,\n transparent = false,\n startTriggerPosition = 'start',\n endTriggerPosition,\n overlay = false,\n snapScroll: scrollSnapping = true,\n showDivider = false,\n animationProgress,\n}) => {\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 const animationHeight = navBarMetrics.heightDelta || fullPanesStartHeight;\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] / animationHeight, range[1] / 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(['startHeight', 'endHeight', 'top', 'foldable'], onChange);\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 // Вкладываем панели друг в друга через проп nextPane\n const items = React.Children.toArray(children) as PaneElement[];\n\n const nested = items.reduceRight<PaneElement | null>((acc, child) => {\n return React.cloneElement<InternalPaneProps>(child, {\n ...child.props,\n nextPane: acc,\n }) as PaneElement;\n }, null);\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.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":";;;;;;;;;;;;;;;;;;AAqBA,MAAM,aAAa,GAAG,aAAa,CAAwB,IAAI,CAAC,CAAC;AAEpD,MAAA,gBAAgB,GAAG,MAA6B,UAAU,CAAC,aAAa,EAAE;AAgDhF,MAAM,MAAM,GAAoB,CAAC,EACpC,QAAQ,EACR,WAAW,GAAG,KAAK,EACnB,oBAAoB,GAAG,OAAO,EAC9B,kBAAkB,EAClB,OAAO,GAAG,KAAK,EACf,UAAU,EAAE,cAAc,GAAG,IAAI,EACjC,WAAW,GAAG,KAAK,EACnB,iBAAiB,GACpB,KAAI;IACD,MAAM,iBAAiB,GAAG,WAAW,CAAC,MAAM,IAAI,GAAG,EAAa,CAAC,CAAC;AAClE,IAAA,MAAM,cAAc,GAAG,MAAM,CAAgB,CAAC,CAAC,CAAC;AAChD,IAAA,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE7C,MAAM,CAAC,aAAa,EAAE,cAAc,CAAC,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;AAClE,IAAA,MAAM,CAAC,UAAU,EAAE,iBAAiB,CAAC,GAAG,gBAAgB,CAAC,iBAAiB,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC;AACpG,IAAA,MAAM,CAAC,kBAAkB,EAAE,yBAAyB,CAAC,GAAG,kBAAkB,CAAC,iBAAiB,EAAE,UAAU,CAAC,CAAC;IAC1G,MAAM,CAAC,qBAAqB,EAAE,eAAe,EAAE,sBAAsB,EAAE,YAAY,CAAC,GAChF,gCAAgC,CAC5B,cAAc,EACd,UAAU,EACV,kBAAkB,EAClB,aAAa,EACb,oBAAoB,EACpB,kBAAkB,CACrB,CAAC;AACN,IAAA,MAAM,UAAU,GAAG,aAAa,CAC5B,cAAc,EACd,sBAAsB,EACtB,aAAa,EACb,eAAe,EACf,cAAc,CACjB,CAAC;;IAGF,MAAM,8BAA8B,GAAG,WAAW,CAAC,MAAM,aAAa,CAAC,MAAM,KAAK,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;AACnH,IAAA,aAAa,CAAC,OAAO,EAAE,sBAAsB,CAAC,CAAC;AAC/C,IAAA,kBAAkB,CAAC,sBAAsB,EAAE,iBAAiB,CAAC,CAAC;AAE9D,IAAA,MAAM,iBAAiB;;IAEnB,WAAW,KAAK,aAAa,GAAG,YAAY,CAAC,UAAU,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEjG,IAAA,MAAM,iBAAiB,GAAG,WAAW,CAAC,MAAK;QACvC,MAAM,aAAa,GAAmB,EAAE,CAAC;QAEzC,MAAM,qBAAqB,GAAG,MAAK;AAC/B,YAAA,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;AACzB,YAAA,iBAAiB,EAAE,CAAC;AACpB,YAAA,yBAAyB,EAAE,CAAC;AAC5B,YAAA,8BAA8B,EAAE,CAAC;AACjC,YAAA,MAAM,aAAa,GAAG,UAAU,EAAE,CAAC;YACnC,MAAM,oBAAoB,GAAG,aAAa,CAAC,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC;AACtE,YAAA,MAAM,eAAe,GAAG,aAAa,CAAC,WAAW,IAAI,oBAAoB,CAAC;AAE1E,YAAA,IAAI,MAAM,GAAG,aAAa,CAAC,YAAY,EAAE,CAAC;YAC1C,IAAI,cAAc,CAAC,OAAO,KAAK,IAAI,IAAI,MAAM,KAAK,CAAC,EAAE;AACjD,gBAAA,MAAM,WAAW,GAAG,oBAAoB,GAAG,cAAc,CAAC,OAAO,CAAC;gBAClE,MAAM,IAAI,WAAW,CAAC;gBAEtB,qBAAqB,CAAC,MAAK;oBACvB,cAAc,CAAC,IAAI,CAAC,aAAa,CAAC,YAAY,EAAE,GAAG,CAAC,CAAC,CAAC;oBACtD,cAAc,CAAC,IAAI,CAAC,aAAa,CAAC,YAAY,EAAE,CAAC,CAAC;AACtD,iBAAC,CAAC,CAAC;aACN;AAED,YAAA,MAAM,eAAe,GAAG,kBAAkB,EAAE,CAAC;AAC7C,YAAA,CAAC,GAAG,iBAAiB,CAAC,MAAM,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,SAAS,KAAI;AAClD,gBAAA,MAAM,KAAK,GAAG,eAAe,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC;gBACvD,IAAI,CAAC,KAAK,EAAE;oBACR,OAAO;iBACV;AACD,gBAAA,MAAM,OAAO,GAAG,KAAK,CACjB,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;AAC5B,sBAAE,CAAC,CAAC,EAAE,CAAC,CAAC;sBACN,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,eAAe,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,eAAe,CAAC,EAC9D,CAAC,CAAC,EAAE,CAAC,CAAC,CACT,CAAC;gBACF,MAAM,WAAW,GAAG,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;gBACjD,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,sBAAsB,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;gBACvD,aAAa,CAAC,IAAI,CAAC,sBAAsB,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,KAAK,KAAK,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AACxG,aAAC,CAAC,CAAC;AAEH,YAAA,cAAc,CAAC,OAAO,GAAG,oBAAoB,CAAC;AAClD,SAAC,CAAC;;;;AAKF,QAAA,MAAM,QAAQ,GAAG,aAAa,CAAC,qBAAqB,CAAC,CAAC;QAEtD,OAAO,CAAC,SAAoB,KAAI;AAC5B,YAAA,MAAM,WAAW,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,aAAa,EAAE,WAAW,EAAE,KAAK,EAAE,UAAU,CAAC,EAAE,QAAQ,CAAC,CAAC;AAClG,YAAA,iBAAiB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;AACjC,YAAA,OAAO,MAAK;AACR,gBAAA,iBAAiB,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;AACpC,gBAAA,WAAW,EAAE,CAAC;AAClB,aAAC,CAAC;AACN,SAAC,CAAC;AACN,KAAC,CAAC,CAAC;IAEH,eAAe,CAAC,MAAK;AACjB,QAAA,qBAAqB,EAAE,CAAC;AACxB,QAAA,UAAU,EAAE,CAAC;AACb,QAAA,IAAI,CAAC,OAAO,CAAC,OAAO,KAAK,OAAO,oBAAoB,KAAK,QAAQ,IAAI,CAAC,kBAAkB,CAAC,EAAE;YACvF,OAAO,KAAK,CAAC,CAAC;SACjB;AACD,QAAA,OAAO,aAAa,CAAC,QAAQ,CAAC,8BAA8B,CAAC,CAAC;AAClE,KAAC,EAAE;QACC,oBAAoB;QACpB,kBAAkB;QAClB,qBAAqB;QACrB,8BAA8B;QAC9B,UAAU;QACV,aAAa;AAChB,KAAA,CAAC,CAAC;;IAGH,MAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAkB,CAAC;IAEhE,MAAM,MAAM,GAAG,KAAK,CAAC,WAAW,CAAqB,CAAC,GAAG,EAAE,KAAK,KAAI;AAChE,QAAA,OAAO,KAAK,CAAC,YAAY,CAAoB,KAAK,EAAE;YAChD,GAAG,KAAK,CAAC,KAAK;AACd,YAAA,QAAQ,EAAE,GAAG;AAChB,SAAA,CAAgB,CAAC;KACrB,EAAE,IAAI,CAAC,CAAC;AAET,IAAA,QACIA,GAAC,CAAA,KAAK,IAAC,KAAK,EAAC,gBAAgB,EACzB,QAAA,EAAAA,GAAA,CAAC,eAAe,EAAA,EACZ,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE;AACjC,gBAAA,CAAC,MAAM,CAAC,sBAAsB,GAAG,WAAW,KAAK,OAAO;AACxD,gBAAA,CAAC,MAAM,CAAC,oBAAoB,GAAG,WAAW,KAAK,KAAK;AACpD,gBAAA,CAAC,MAAM,CAAC,oBAAoB,GAAG,CAAC,WAAW;AAC3C,gBAAA,CAAC,MAAM,CAAC,aAAa,GAAG,OAAO;AAClC,aAAA,CAAC,EACF,GAAG,EAAE,OAAO,EACZ,gBAAgB,EAAE,MAAM,CAAC,WAAW,EAEpC,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,oBAAoB,EAAA,QAAA,EACvCC,cAAK,SAAS,EAAE,MAAM,CAAC,sBAAsB,EACzC,QAAA,EAAA,CAAAD,GAAA,CAAC,MAAM,CAAC,GAAG,IACP,KAAK,EAAE,EAAE,yCAAyC,EAAE,sBAAsB,EAAiB,EAC3F,SAAS,EAAE,MAAM,CAAC,oBAAoB,EAAA,QAAA,EAEtCA,GAAC,CAAA,aAAa,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,iBAAiB,YAAG,MAAM,EAAA,CAA0B,GAC1E,EACbA,GAAA,CAAC,MAAM,CAAC,GAAG,IACP,SAAS,EAAE,MAAM,CAAC,gBAAgB,EAClC,KAAK,EAAE,EAAE,GAAG,YAAY,EAAE,UAAU,EAAE,iBAAiB,EAAE,YAEzDA,GAAC,CAAA,OAAO,KAAG,EACF,CAAA,CAAA,EAAA,CACX,GACJ,EACQ,CAAA,EAAA,CACd,EACV;AACN;;;;"}
package/index.css CHANGED
@@ -5,96 +5,96 @@
5
5
  .magritte-night-theme{
6
6
  --magritte-color-background-body-v23-2-3:#000000;
7
7
  }
8
- .magritte-actions-container___CBgYW_1-0-2{
8
+ .magritte-actions-container___CBgYW_1-1-0{
9
9
  display:flex;
10
10
  flex-direction:row;
11
11
  gap:12px;
12
12
  }
13
- .magritte-actions-no-children___rgJUl_1-0-2{
13
+ .magritte-actions-no-children___rgJUl_1-1-0{
14
14
  justify-content:space-between;
15
15
  }
16
- .magritte-actions-left-slot___DNOj0_1-0-2,
17
- .magritte-actions-right-slot___aodtj_1-0-2{
16
+ .magritte-actions-left-slot___DNOj0_1-1-0,
17
+ .magritte-actions-right-slot___aodtj_1-1-0{
18
18
  display:grid;
19
19
  flex:0 0 auto;
20
20
  }
21
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:first-child,
22
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:first-child,
23
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:first-child,
24
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:first-child,
25
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:first-child{
21
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:first-child,
22
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:first-child,
23
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:first-child,
24
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:first-child,
25
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:first-child{
26
26
  margin-left:-8px;
27
27
  }
28
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:last-child,
29
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:last-child,
30
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:last-child,
31
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:last-child,
32
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > .magritte-actions-icon-morph___-nNgW_1-0-2:last-child{
28
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:last-child,
29
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:last-child,
30
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:last-child,
31
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:last-child,
32
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > .magritte-actions-icon-morph___-nNgW_1-1-0:last-child{
33
33
  margin-right:-8px;
34
34
  }
35
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :last-child,
36
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :last-child,
37
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :last-child,
38
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :last-child,
39
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :last-child,
40
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2),
41
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2),
42
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2),
43
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2),
44
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2){
35
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :last-child,
36
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :last-child,
37
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :last-child,
38
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :last-child,
39
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :last-child,
40
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0),
41
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0),
42
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0),
43
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0),
44
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :last-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0){
45
45
  --magritte-ui-icon-margin-right-override:-8px;
46
46
  }
47
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :first-child,
48
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :first-child,
49
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :first-child,
50
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :first-child,
51
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :first-child,
52
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2),
53
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2),
54
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-start-stage___MJ67a_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2),
55
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-end-stage___qHtTV_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2),
56
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-0-2){
47
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :first-child,
48
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :first-child,
49
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :first-child,
50
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :first-child,
51
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :first-child,
52
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0),
53
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0),
54
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-start-stage___MJ67a_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0),
55
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-end-stage___qHtTV_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0),
56
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :first-child:not(.magritte-actions-icon-morph___-nNgW_1-1-0){
57
57
  --magritte-ui-icon-margin-left-override:-8px;
58
58
  }
59
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :first-child,
60
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :first-child{
59
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :first-child,
60
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :first-child{
61
61
  --magritte-ui-icon-margin-left-override:calc(-8px * var(--magritte-ui-navbar-animation-progress));
62
62
  }
63
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :last-child,
64
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :last-child{
63
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :last-child,
64
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :last-child{
65
65
  --magritte-ui-icon-margin-right-override:calc(-8px * var(--magritte-ui-navbar-animation-progress));
66
66
  }
67
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :first-child,
68
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :first-child{
67
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :first-child,
68
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :first-child{
69
69
  --magritte-ui-icon-margin-left-override:calc(-8px * (1 - var(--magritte-ui-navbar-animation-progress)));
70
70
  }
71
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-right-slot___aodtj_1-0-2 .magritte-actions-side-slot-content___TlHrX_1-0-2 > :last-child,
72
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-actions-only-stage___cg10A_1-0-2 .magritte-actions-left-slot___DNOj0_1-0-2 .magritte-actions-side-slot-content-clone___jDxVm_1-0-2 > :last-child{
71
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-right-slot___aodtj_1-1-0 .magritte-actions-side-slot-content___TlHrX_1-1-0 > :last-child,
72
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-actions-only-stage___cg10A_1-1-0 .magritte-actions-left-slot___DNOj0_1-1-0 .magritte-actions-side-slot-content-clone___jDxVm_1-1-0 > :last-child{
73
73
  --magritte-ui-icon-margin-right-override:calc(-8px * (1 - var(--magritte-ui-navbar-animation-progress)));
74
74
  }
75
- .magritte-actions-center-slot___hLAy6_1-0-2{
75
+ .magritte-actions-center-slot___hLAy6_1-1-0{
76
76
  display:flex;
77
77
  flex:1 1 auto;
78
78
  min-width:0;
79
79
  }
80
- .magritte-actions-center-slot___hLAy6_1-0-2.magritte-actions-center-slot-centered___merXQ_1-0-2{
80
+ .magritte-actions-center-slot___hLAy6_1-1-0.magritte-actions-center-slot-centered___merXQ_1-1-0{
81
81
  justify-content:center;
82
82
  }
83
- .magritte-actions-side-slot-content___TlHrX_1-0-2,
84
- .magritte-actions-side-slot-content-clone___jDxVm_1-0-2{
83
+ .magritte-actions-side-slot-content___TlHrX_1-1-0,
84
+ .magritte-actions-side-slot-content-clone___jDxVm_1-1-0{
85
85
  grid-area:1 / 1;
86
86
  display:flex;
87
87
  align-items:center;
88
88
  gap:4px;
89
89
  }
90
- .magritte-actions-side-slot-content-clone___jDxVm_1-0-2{
90
+ .magritte-actions-side-slot-content-clone___jDxVm_1-1-0{
91
91
  visibility:hidden;
92
92
  z-index:0;
93
93
  pointer-events:none;
94
94
  user-select:none;
95
95
  contain:style layout;
96
96
  }
97
- .magritte-title-container-wrapper___DQUcj_1-0-2{
97
+ .magritte-title-container-wrapper___DQUcj_1-1-0{
98
98
  display:flex;
99
99
  flex-direction:row;
100
100
  align-items:center;
@@ -102,44 +102,44 @@
102
102
  min-width:0;
103
103
  gap:12px;
104
104
  }
105
- .magritte-title-main-part___npoHN_1-0-2{
105
+ .magritte-title-main-part___npoHN_1-1-0{
106
106
  display:flex;
107
107
  flex-direction:column;
108
108
  flex:0 1 auto;
109
109
  min-width:0;
110
110
  }
111
- .magritte-title-main-part___npoHN_1-0-2.magritte-centered___Y2mlP_1-0-2{
111
+ .magritte-title-main-part___npoHN_1-1-0.magritte-centered___Y2mlP_1-1-0{
112
112
  align-items:center;
113
113
  }
114
- .magritte-title-left-slot___HTE7h_1-0-2{
114
+ .magritte-title-left-slot___HTE7h_1-1-0{
115
115
  display:flex;
116
116
  align-items:center;
117
117
  flex:0 0 auto;
118
118
  }
119
- .magritte-title-container___y9AIx_1-0-2{
119
+ .magritte-title-container___y9AIx_1-1-0{
120
120
  display:flex;
121
121
  flex-direction:row;
122
122
  align-items:center;
123
- gap:6px;
123
+ gap:5px;
124
124
  }
125
- .magritte-subtitle-container___nVUBu_1-0-2{
125
+ .magritte-subtitle-container___nVUBu_1-1-0{
126
126
  display:flex;
127
127
  }
128
- .magritte-title-morph-item___t7Wf3_1-0-2{
128
+ .magritte-title-morph-item___t7Wf3_1-1-0{
129
129
  display:flex;
130
130
  min-width:0;
131
131
  }
132
- .magritte-title___ZbLgP_1-0-2{
132
+ .magritte-title___ZbLgP_1-1-0{
133
133
  display:flex;
134
134
  flex:0 1 auto;
135
135
  min-width:0;
136
136
  }
137
- .magritte-pane-content___UVmC6_1-0-2{
137
+ .magritte-pane-content___UVmC6_1-1-0{
138
138
  position:relative;
139
139
  pointer-events:none;
140
140
  z-index:2;
141
141
  }
142
- .magritte-pane-background___PDZAX_1-0-2{
142
+ .magritte-pane-background___PDZAX_1-1-0{
143
143
  position:absolute;
144
144
  background-color:var(--magritte-ui-nav-bar-background-color-override, var(--magritte-color-background-body-v23-2-3));
145
145
  opacity:0;
@@ -147,43 +147,43 @@
147
147
  z-index:-1;
148
148
  transform-origin:0 0;
149
149
  }
150
- .magritte-navbar-transparent-start___wysv0_1-0-2 .magritte-pane-background___PDZAX_1-0-2{
150
+ .magritte-navbar-transparent-start___wysv0_1-1-0 .magritte-pane-background___PDZAX_1-1-0{
151
151
  opacity:calc(var(--magritte-ui-navbar-animation-progress) * 0.95);
152
152
  }
153
- .magritte-navbar-transparent-end___6KqLR_1-0-2 .magritte-pane-background___PDZAX_1-0-2{
153
+ .magritte-navbar-transparent-end___6KqLR_1-1-0 .magritte-pane-background___PDZAX_1-1-0{
154
154
  opacity:calc((1 - var(--magritte-ui-navbar-animation-progress)) * 0.95);
155
155
  }
156
- .magritte-navbar-not-transparent___5KZNp_1-0-2 .magritte-pane-background___PDZAX_1-0-2{
156
+ .magritte-navbar-not-transparent___5KZNp_1-1-0 .magritte-pane-background___PDZAX_1-1-0{
157
157
  opacity:0.95;
158
158
  }
159
- .magritte-morph-item___8kF46_1-0-2{
159
+ .magritte-morph-item___8kF46_1-1-0{
160
160
  line-height:0;
161
161
  transform-origin:var(--magritte-ui-morph-item-transform-origin-x, center) var(--magritte-ui-morph-item-transform-origin-y, center);
162
162
  }
163
- .magritte-morph-item-top___WPEkn_1-0-2{
163
+ .magritte-morph-item-top___WPEkn_1-1-0{
164
164
  --magritte-ui-morph-item-transform-origin-y:top;
165
165
  }
166
- .magritte-morph-item-bottom___zNbsF_1-0-2{
166
+ .magritte-morph-item-bottom___zNbsF_1-1-0{
167
167
  --magritte-ui-morph-item-transform-origin-y:bottom;
168
168
  }
169
- .magritte-morph-item-left___T6AMW_1-0-2{
169
+ .magritte-morph-item-left___T6AMW_1-1-0{
170
170
  --magritte-ui-morph-item-transform-origin-x:left;
171
171
  }
172
- .magritte-morph-item-right___EuT1E_1-0-2{
172
+ .magritte-morph-item-right___EuT1E_1-1-0{
173
173
  --magritte-ui-morph-item-transform-origin-x:right;
174
174
  }
175
- .magritte-pane___f8eFC_1-0-2{
175
+ .magritte-pane___f8eFC_1-1-0{
176
176
  position:relative;
177
177
  overflow:hidden;
178
178
  pointer-events:none;
179
179
  }
180
- .magritte-start-state-container___giBVb_1-0-2{
180
+ .magritte-start-state-container___giBVb_1-1-0{
181
181
  position:relative;
182
182
  z-index:1;
183
183
  box-sizing:border-box;
184
184
  pointer-events:auto;
185
185
  }
186
- .magritte-end-state-container___uiW8Q_1-0-2{
186
+ .magritte-end-state-container___uiW8Q_1-1-0{
187
187
  position:absolute;
188
188
  z-index:0;
189
189
  top:0;
@@ -192,51 +192,51 @@
192
192
  pointer-events:none;
193
193
  opacity:0;
194
194
  }
195
- .magritte-content-container___7s7vv_1-0-2{
195
+ .magritte-content-container___7s7vv_1-1-0{
196
196
  box-sizing:border-box;
197
197
  }
198
- .magritte-next-pane___H2oxQ_1-0-2{
198
+ .magritte-next-pane___H2oxQ_1-1-0{
199
199
  position:relative;
200
200
  }
201
- .magritte-nav-bar___RRGe0_1-0-2{
201
+ .magritte-nav-bar___RRGe0_1-1-0{
202
202
  top:0;
203
203
  position:sticky;
204
204
  pointer-events:none;
205
205
  overflow-anchor:none;
206
206
  z-index:10;
207
207
  }
208
- .magritte-nav-bar-overlay___Mq5ZD_1-0-2 .magritte-nav-bar-overlay-wrapper___y1VpY_1-0-2{
208
+ .magritte-nav-bar-overlay___Mq5ZD_1-1-0 .magritte-nav-bar-overlay-wrapper___y1VpY_1-1-0{
209
209
  position:absolute;
210
210
  inset:0;
211
211
  }
212
- .magritte-nav-bar-content-container___H-WMO_1-0-2{
212
+ .magritte-nav-bar-content-container___H-WMO_1-1-0{
213
213
  display:grid;
214
214
  position:relative;
215
215
  }
216
- .magritte-nav-bar-panes-container___5ZDLa_1-0-2{
216
+ .magritte-nav-bar-panes-container___5ZDLa_1-1-0{
217
217
  position:relative;
218
218
  z-index:1;
219
219
  grid-area:1 / 1;
220
220
  min-width:0;
221
221
  }
222
- .magritte-nav-bar-progressive-blur___qyeUV_1-0-2{
222
+ .magritte-nav-bar-progressive-blur___qyeUV_1-1-0{
223
223
  position:relative;
224
224
  z-index:0;
225
225
  transform-origin:0 0;
226
226
  grid-area:1 / 1;
227
227
  min-width:0;
228
228
  }
229
- .magritte-nav-bar-content-container___H-WMO_1-0-2 :not(.magritte-next-pane___H2oxQ_1-0-2) .magritte-nav-bar-stage___amDz7_1-0-2,
230
- .magritte-nav-bar-content-container___H-WMO_1-0-2 :not(.magritte-next-pane___H2oxQ_1-0-2) .nav-bar-layout-animation-stage-start,
231
- .magritte-nav-bar-content-container___H-WMO_1-0-2 :not(.magritte-next-pane___H2oxQ_1-0-2) .nav-bar-layout-animation-stage-end{
229
+ .magritte-nav-bar-content-container___H-WMO_1-1-0 :not(.magritte-next-pane___H2oxQ_1-1-0) .magritte-nav-bar-stage___amDz7_1-1-0,
230
+ .magritte-nav-bar-content-container___H-WMO_1-1-0 :not(.magritte-next-pane___H2oxQ_1-1-0) .nav-bar-layout-animation-stage-start,
231
+ .magritte-nav-bar-content-container___H-WMO_1-1-0 :not(.magritte-next-pane___H2oxQ_1-1-0) .nav-bar-layout-animation-stage-end{
232
232
  padding-top:calc(8px + var(--magritte-ui-nav-bar-padding-top-override, 0px));
233
233
  }
234
- .magritte-nav-bar-stage___amDz7_1-0-2{
234
+ .magritte-nav-bar-stage___amDz7_1-1-0{
235
235
  padding:8px var(--magritte-ui-nav-bar-stage-horizontal-padding-override, 16px);
236
236
  }
237
- .magritte-metrics-mode___h38aX_1-0-2 .magritte-morph-item___8kF46_1-0-2,
238
- .magritte-metrics-mode___h38aX_1-0-2 .magritte-pane___f8eFC_1-0-2,
239
- .magritte-metrics-mode___h38aX_1-0-2 .magritte-next-pane___H2oxQ_1-0-2{
237
+ .magritte-metrics-mode___h38aX_1-1-0 .magritte-morph-item___8kF46_1-1-0,
238
+ .magritte-metrics-mode___h38aX_1-1-0 .magritte-pane___f8eFC_1-1-0,
239
+ .magritte-metrics-mode___h38aX_1-1-0 .magritte-next-pane___H2oxQ_1-1-0{
240
240
  transform:none !important;
241
241
  }
242
242
  .nav-bar-layout-animation-stage-end,
@@ -247,41 +247,41 @@
247
247
  height:auto !important;
248
248
  transform:none !important;
249
249
  }
250
- .nav-bar-layout-animation-stage-end .magritte-layout-morph___I3SPy_1-0-2,
251
- .nav-bar-layout-animation-stage-start .magritte-layout-morph___I3SPy_1-0-2{
250
+ .nav-bar-layout-animation-stage-end .magritte-layout-morph___I3SPy_1-1-0,
251
+ .nav-bar-layout-animation-stage-start .magritte-layout-morph___I3SPy_1-1-0{
252
252
  position:static !important;
253
253
  width:auto !important;
254
254
  height:auto !important;
255
255
  transform:none !important;
256
256
  }
257
- .magritte-layout-morph___I3SPy_1-0-2{
257
+ .magritte-layout-morph___I3SPy_1-1-0{
258
258
  display:block;
259
259
  position:absolute;
260
260
  transform-origin:var(--magritte-ui-morph-item-transform-origin-x, center) var(--magritte-ui-morph-item-transform-origin-y, center);
261
261
  z-index:3;
262
262
  }
263
- .magritte-animation-stage-progress___5FthT_1-0-2 .magritte-layout-morph___I3SPy_1-0-2 > *{
263
+ .magritte-animation-stage-progress___5FthT_1-1-0 .magritte-layout-morph___I3SPy_1-1-0 > *{
264
264
  margin:0 !important;
265
265
  }
266
- .magritte-layout-morph-start___9-krP_1-0-2{
266
+ .magritte-layout-morph-start___9-krP_1-1-0{
267
267
  z-index:2;
268
268
  }
269
- .magritte-layout-morph-end___LIg4d_1-0-2{
269
+ .magritte-layout-morph-end___LIg4d_1-1-0{
270
270
  z-index:1;
271
271
  }
272
- .nav-bar-layout-animation-stage-start .magritte-layout-morph___I3SPy_1-0-2{
272
+ .nav-bar-layout-animation-stage-start .magritte-layout-morph___I3SPy_1-1-0{
273
273
  display:contents;
274
274
  }
275
- .nav-bar-layout-animation-stage-start .magritte-layout-morph-end___LIg4d_1-0-2{
275
+ .nav-bar-layout-animation-stage-start .magritte-layout-morph-end___LIg4d_1-1-0{
276
276
  display:none;
277
277
  }
278
- .nav-bar-layout-animation-stage-end .magritte-layout-morph___I3SPy_1-0-2{
278
+ .nav-bar-layout-animation-stage-end .magritte-layout-morph___I3SPy_1-1-0{
279
279
  display:contents;
280
280
  }
281
- .nav-bar-layout-animation-stage-end .magritte-layout-morph-start___9-krP_1-0-2{
281
+ .nav-bar-layout-animation-stage-end .magritte-layout-morph-start___9-krP_1-1-0{
282
282
  display:none;
283
283
  }
284
- .magritte-divider-container___-NdWi_1-0-2{
284
+ .magritte-divider-container___-NdWi_1-1-0{
285
285
  position:absolute;
286
286
  width:100%;
287
287
  bottom:0;
package/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
  export { Actions } from './public/Actions.js';
3
- export { N as NavBar } from './NavBar-BM6rmKUJ.js';
3
+ export { N as NavBar } from './NavBar-D9oyKBms.js';
4
4
  export { ExternalPane as Pane } from './public/Pane.js';
5
5
  export { ExternalStage as Stage } from './public/Stage.js';
6
6
  export { Morph } from './public/Morph.js';
@@ -17,7 +17,6 @@ import '@hh.ru/magritte-ui-divider';
17
17
  import '@hh.ru/magritte-ui-layer';
18
18
  import './internal/MetricsProvider.js';
19
19
  import './internal/utils.js';
20
- import './internal/ProgressiveBlur.js';
21
20
  import './internal/useAnimationRanges.js';
22
21
  import './internal/useBindScrollToAnimationProgress.js';
23
22
  import './internal/useNavBarMetrics.js';
@@ -30,5 +29,7 @@ import './internal/MorphStore.js';
30
29
  import './internal/KeyedSubscriptions.js';
31
30
  import './internal/PaneStore.js';
32
31
  import 'motion';
32
+ import './internal/useInert.js';
33
33
  import '@hh.ru/magritte-common-use-when-font-loaded';
34
+ import '@hh.ru/magritte-common-use-multiple-refs';
34
35
  //# sourceMappingURL=index.js.map
package/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/index.mock.js CHANGED
@@ -1,35 +1,5 @@
1
1
  import './index.css';
2
- import { jsxs, jsx } from 'react/jsx-runtime';
3
- import { forwardRef } from 'react';
4
-
5
- function enhance(mockComponent, staticProps) {
6
- // удаляем внутренний свойства реакта, чтобы не перезаписать ими mockComponent
7
- delete staticProps.type;
8
- delete staticProps.$$typeof;
9
- delete staticProps.render;
10
- for (const prop in staticProps) {
11
- mockComponent[prop] = staticProps[prop];
12
- }
13
- }
14
- const MockComponent = ({ style, ...props }) => (
15
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
16
- // @ts-ignore
17
- // eslint-disable-next-line react/jsx-no-undef
18
- jsx("magritte-component-mock", { "style-data": style, ...props }));
19
- /**
20
- * Возвращает mock React компонента
21
- */
22
- const mockComponent = (componentName, staticProps = {}, { withChildren, innerDependence, WrapperComponent } = {}) => {
23
- const mockWrapper = forwardRef(({ children, ...props }, ref) => {
24
- const mock = (
25
- // eslint-disable-next-line react/jsx-no-undef
26
- jsxs(MockComponent, { ...props, _component: componentName, children: [innerDependence ? innerDependence(props, ref) : null, withChildren ? children : null] }));
27
- return WrapperComponent ? jsx(WrapperComponent, { ...props, children: mock }) : mock;
28
- });
29
- staticProps && enhance(mockWrapper, staticProps);
30
- mockWrapper.displayName = 'magritte-ref';
31
- return mockWrapper;
32
- };
2
+ import { mockComponent } from '@hh.ru/magritte-ui-mock-component';
33
3
 
34
4
  const NavBar = mockComponent('NavBar', undefined, {
35
5
  withChildren: true,