@hh.ru/magritte-ui-floating-button 3.0.2 → 3.0.3

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.
package/FloatingButton.js CHANGED
@@ -11,7 +11,7 @@ import { Layer } from '@hh.ru/magritte-ui-layer';
11
11
  import { Loader } from '@hh.ru/magritte-ui-loader';
12
12
  import { Text } from '@hh.ru/magritte-ui-typography';
13
13
 
14
- var styles = {"wrapper":"magritte-wrapper___7m9lC_3-0-2","animation-timeout":"magritte-animation-timeout___NL8n0_3-0-2","animationTimeout":"magritte-animation-timeout___NL8n0_3-0-2","button":"magritte-button___nL-Hn_3-0-2","loading":"magritte-loading___C0oPZ_3-0-2","withIconAndLabel":"magritte-withIconAndLabel___Qa-lU_3-0-2","right":"magritte-right___3n0Rz_3-0-2","content":"magritte-content___JNpTZ_3-0-2","left":"magritte-left___GnzU7_3-0-2","center":"magritte-center___MdA40_3-0-2","postfix":"magritte-postfix___r0EZ6_3-0-2","icon":"magritte-icon___VpqJt_3-0-2","textless":"magritte-textless___IbYgp_3-0-2","label":"magritte-label___EPgvj_3-0-2","withPostfix":"magritte-withPostfix___PmQAz_3-0-2","hideLabel":"magritte-hideLabel___K79XM_3-0-2","withLabelOnHover":"magritte-withLabelOnHover___1oktd_3-0-2","loader":"magritte-loader___EPezG_3-0-2","enter-animation":"magritte-enter-animation___2sPz3_3-0-2","enterAnimation":"magritte-enter-animation___2sPz3_3-0-2","enter-animation-active":"magritte-enter-animation-active___Lq9eq_3-0-2","enterAnimationActive":"magritte-enter-animation-active___Lq9eq_3-0-2","exit-animation":"magritte-exit-animation___h2-7a_3-0-2","exitAnimation":"magritte-exit-animation___h2-7a_3-0-2","exit-animation-active":"magritte-exit-animation-active___w0F1a_3-0-2","exitAnimationActive":"magritte-exit-animation-active___w0F1a_3-0-2","button_style-neutral":"magritte-button_style-neutral___bPUwu_3-0-2","buttonStyleNeutral":"magritte-button_style-neutral___bPUwu_3-0-2","stackMode":"magritte-stackMode___RdOTJ_3-0-2","button_style-inverse":"magritte-button_style-inverse___Xgf26_3-0-2","buttonStyleInverse":"magritte-button_style-inverse___Xgf26_3-0-2"};
14
+ var styles = {"wrapper":"magritte-wrapper___7m9lC_3-0-3","animation-timeout":"magritte-animation-timeout___NL8n0_3-0-3","animationTimeout":"magritte-animation-timeout___NL8n0_3-0-3","button":"magritte-button___nL-Hn_3-0-3","loading":"magritte-loading___C0oPZ_3-0-3","withIconAndLabel":"magritte-withIconAndLabel___Qa-lU_3-0-3","right":"magritte-right___3n0Rz_3-0-3","content":"magritte-content___JNpTZ_3-0-3","left":"magritte-left___GnzU7_3-0-3","center":"magritte-center___MdA40_3-0-3","postfix":"magritte-postfix___r0EZ6_3-0-3","icon":"magritte-icon___VpqJt_3-0-3","textless":"magritte-textless___IbYgp_3-0-3","label":"magritte-label___EPgvj_3-0-3","withPostfix":"magritte-withPostfix___PmQAz_3-0-3","hideLabel":"magritte-hideLabel___K79XM_3-0-3","withLabelOnHover":"magritte-withLabelOnHover___1oktd_3-0-3","loader":"magritte-loader___EPezG_3-0-3","enter-animation":"magritte-enter-animation___2sPz3_3-0-3","enterAnimation":"magritte-enter-animation___2sPz3_3-0-3","enter-animation-active":"magritte-enter-animation-active___Lq9eq_3-0-3","enterAnimationActive":"magritte-enter-animation-active___Lq9eq_3-0-3","exit-animation":"magritte-exit-animation___h2-7a_3-0-3","exitAnimation":"magritte-exit-animation___h2-7a_3-0-3","exit-animation-active":"magritte-exit-animation-active___w0F1a_3-0-3","exitAnimationActive":"magritte-exit-animation-active___w0F1a_3-0-3","button_style-neutral":"magritte-button_style-neutral___bPUwu_3-0-3","buttonStyleNeutral":"magritte-button_style-neutral___bPUwu_3-0-3","stackMode":"magritte-stackMode___RdOTJ_3-0-3","button_style-inverse":"magritte-button_style-inverse___Xgf26_3-0-3","buttonStyleInverse":"magritte-button_style-inverse___Xgf26_3-0-3"};
15
15
 
16
16
  const ALLOWED_BADGE_SIZES = ['small'];
17
17
  const FloatingButtonComponent = ({ Element = 'button', style = 'neutral', disabled, borderRadius = 'halfHeight', icon: IconComponent, postfix, loading, host, children, className, inlineStyle, visible, labelOnHover: _labelOnHover, hideLabel: _hideLabel, badge, position = 'right', 'data-qa': dataQa = 'floating-button', stackMode = false, ...restProps }, ref) => {
@@ -1 +1 @@
1
- {"version":3,"file":"FloatingButton.js","sources":["../src/FloatingButton.tsx"],"sourcesContent":["import { forwardRef, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { CSSTransition } from 'react-transition-group';\nimport classnames from 'classnames';\n\nimport { useServerEnv } from '@hh.ru/magritte-common-is-server-env';\nimport { tokenSemanticAnimationTimeSDuration } from '@hh.ru/magritte-design-tokens/types';\nimport type { PolymorphicComponentWithRef, PolymorphicForwardRefRenderFunc } from '@hh.ru/magritte-types';\nimport { BadgeSize, ComponentWithBadge } from '@hh.ru/magritte-ui-badge';\nimport type { FloatingButtonProps, FloatingButtonPropsWithStackMode } from '@hh.ru/magritte-ui-floating-button/types';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from './floating-button.less';\n\nconst ALLOWED_BADGE_SIZES: BadgeSize[] = ['small'];\n\nconst FloatingButtonComponent: PolymorphicForwardRefRenderFunc<FloatingButtonPropsWithStackMode, 'button'> = (\n {\n Element = 'button',\n style = 'neutral',\n disabled,\n borderRadius = 'halfHeight',\n icon: IconComponent,\n postfix,\n loading,\n host,\n children,\n className,\n inlineStyle,\n visible,\n labelOnHover: _labelOnHover,\n hideLabel: _hideLabel,\n badge,\n position = 'right',\n 'data-qa': dataQa = 'floating-button',\n stackMode = false,\n ...restProps\n },\n ref\n) => {\n const labelOnHover = _labelOnHover && !!IconComponent;\n const hideLabel = _hideLabel && !!IconComponent;\n const isServerEnv = useServerEnv();\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n if (isServerEnv) {\n return null;\n }\n\n const additionalAttributes: Record<string, unknown> = {\n 'data-qa': dataQa,\n };\n if (Element === 'button') {\n additionalAttributes.type = 'button';\n } else {\n additionalAttributes.role = Element !== 'a' ? 'button' : undefined;\n additionalAttributes['aria-disabled'] = disabled;\n }\n additionalAttributes.ref = ref;\n\n let button = (\n <Element\n {...additionalAttributes}\n {...restProps}\n disabled={!!disabled}\n tabIndex={disabled || loading ? -1 : 0}\n className={classnames(styles.button, styles[`button_style-${style}`], {\n [styles.loading]: !!loading,\n [styles.withLabelOnHover]: !!labelOnHover,\n [styles.hideLabel]: !!hideLabel || !children,\n [styles.withPostfix]: !!postfix,\n [styles.textless]: !postfix && (!children || !!hideLabel),\n [styles.withIconAndLabel]: !!IconComponent && !!children && !hideLabel,\n [styles.stackMode]: !!stackMode,\n })}\n style={{ borderRadius: borderRadius === 'halfHeight' ? '9999px' : `${borderRadius}px` }}\n >\n <span className={styles.content}>\n {IconComponent && (\n <span className={styles.icon}>\n <IconComponent data-qa={`${dataQa}-icon`} />\n </span>\n )}\n <span className={styles.label} data-qa={`${dataQa}-label`}>\n <Text typography={'subtitle-1-semibold'}>{children}</Text>\n </span>\n {postfix && (\n <span className={styles.postfix} data-qa={`${dataQa}-postfix`}>\n <Text typography={'subtitle-1-semibold'}>{postfix}</Text>\n </span>\n )}\n\n {loading && (\n <span className={styles.loader}>\n <Loader size={24} />\n </span>\n )}\n </span>\n </Element>\n );\n\n if (badge && !disabled) {\n button = (\n <ComponentWithBadge allowedSizes={ALLOWED_BADGE_SIZES} badge={badge} offset={stackMode ? 12 : 4} noClip>\n {button}\n </ComponentWithBadge>\n );\n }\n\n if (stackMode) {\n return button;\n }\n\n return createPortal(\n <CSSTransition\n appear\n in={!!visible && !isServerEnv}\n nodeRef={wrapperRef}\n classNames={{\n appear: styles.enterAnimation,\n appearActive: styles.enterAnimationActive,\n enter: styles.enterAnimation,\n enterActive: styles.enterAnimationActive,\n exit: styles.exitAnimation,\n exitActive: styles.exitAnimationActive,\n }}\n timeout={tokenSemanticAnimationTimeSDuration}\n unmountOnExit\n >\n <Layer layer=\"floating-button\">\n <div\n className={classnames(styles.wrapper, styles[`${position}`], className)}\n ref={wrapperRef}\n style={inlineStyle}\n data-qa={`${dataQa}-wrapper`}\n >\n {button}\n </div>\n </Layer>\n </CSSTransition>,\n host?.current || document.body\n );\n};\n\nexport const FloatingButtonWithStackMode = forwardRef(FloatingButtonComponent) as PolymorphicComponentWithRef<\n FloatingButtonPropsWithStackMode,\n 'button'\n>;\n\nexport const FloatingButton = forwardRef(FloatingButtonComponent) as PolymorphicComponentWithRef<\n FloatingButtonProps,\n 'button'\n>;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"FloatingButton.js","sources":["src/FloatingButton.tsx"],"sourcesContent":["import { forwardRef, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { CSSTransition } from 'react-transition-group';\nimport classnames from 'classnames';\n\nimport { useServerEnv } from '@hh.ru/magritte-common-is-server-env';\nimport { tokenSemanticAnimationTimeSDuration } from '@hh.ru/magritte-design-tokens/types';\nimport type { PolymorphicComponentWithRef, PolymorphicForwardRefRenderFunc } from '@hh.ru/magritte-types';\nimport { BadgeSize, ComponentWithBadge } from '@hh.ru/magritte-ui-badge';\nimport type { FloatingButtonProps, FloatingButtonPropsWithStackMode } from '@hh.ru/magritte-ui-floating-button/types';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from './floating-button.less';\n\nconst ALLOWED_BADGE_SIZES: BadgeSize[] = ['small'];\n\nconst FloatingButtonComponent: PolymorphicForwardRefRenderFunc<FloatingButtonPropsWithStackMode, 'button'> = (\n {\n Element = 'button',\n style = 'neutral',\n disabled,\n borderRadius = 'halfHeight',\n icon: IconComponent,\n postfix,\n loading,\n host,\n children,\n className,\n inlineStyle,\n visible,\n labelOnHover: _labelOnHover,\n hideLabel: _hideLabel,\n badge,\n position = 'right',\n 'data-qa': dataQa = 'floating-button',\n stackMode = false,\n ...restProps\n },\n ref\n) => {\n const labelOnHover = _labelOnHover && !!IconComponent;\n const hideLabel = _hideLabel && !!IconComponent;\n const isServerEnv = useServerEnv();\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n if (isServerEnv) {\n return null;\n }\n\n const additionalAttributes: Record<string, unknown> = {\n 'data-qa': dataQa,\n };\n if (Element === 'button') {\n additionalAttributes.type = 'button';\n } else {\n additionalAttributes.role = Element !== 'a' ? 'button' : undefined;\n additionalAttributes['aria-disabled'] = disabled;\n }\n additionalAttributes.ref = ref;\n\n let button = (\n <Element\n {...additionalAttributes}\n {...restProps}\n disabled={!!disabled}\n tabIndex={disabled || loading ? -1 : 0}\n className={classnames(styles.button, styles[`button_style-${style}`], {\n [styles.loading]: !!loading,\n [styles.withLabelOnHover]: !!labelOnHover,\n [styles.hideLabel]: !!hideLabel || !children,\n [styles.withPostfix]: !!postfix,\n [styles.textless]: !postfix && (!children || !!hideLabel),\n [styles.withIconAndLabel]: !!IconComponent && !!children && !hideLabel,\n [styles.stackMode]: !!stackMode,\n })}\n style={{ borderRadius: borderRadius === 'halfHeight' ? '9999px' : `${borderRadius}px` }}\n >\n <span className={styles.content}>\n {IconComponent && (\n <span className={styles.icon}>\n <IconComponent data-qa={`${dataQa}-icon`} />\n </span>\n )}\n <span className={styles.label} data-qa={`${dataQa}-label`}>\n <Text typography={'subtitle-1-semibold'}>{children}</Text>\n </span>\n {postfix && (\n <span className={styles.postfix} data-qa={`${dataQa}-postfix`}>\n <Text typography={'subtitle-1-semibold'}>{postfix}</Text>\n </span>\n )}\n\n {loading && (\n <span className={styles.loader}>\n <Loader size={24} />\n </span>\n )}\n </span>\n </Element>\n );\n\n if (badge && !disabled) {\n button = (\n <ComponentWithBadge allowedSizes={ALLOWED_BADGE_SIZES} badge={badge} offset={stackMode ? 12 : 4} noClip>\n {button}\n </ComponentWithBadge>\n );\n }\n\n if (stackMode) {\n return button;\n }\n\n return createPortal(\n <CSSTransition\n appear\n in={!!visible && !isServerEnv}\n nodeRef={wrapperRef}\n classNames={{\n appear: styles.enterAnimation,\n appearActive: styles.enterAnimationActive,\n enter: styles.enterAnimation,\n enterActive: styles.enterAnimationActive,\n exit: styles.exitAnimation,\n exitActive: styles.exitAnimationActive,\n }}\n timeout={tokenSemanticAnimationTimeSDuration}\n unmountOnExit\n >\n <Layer layer=\"floating-button\">\n <div\n className={classnames(styles.wrapper, styles[`${position}`], className)}\n ref={wrapperRef}\n style={inlineStyle}\n data-qa={`${dataQa}-wrapper`}\n >\n {button}\n </div>\n </Layer>\n </CSSTransition>,\n host?.current || document.body\n );\n};\n\nexport const FloatingButtonWithStackMode = forwardRef(FloatingButtonComponent) as PolymorphicComponentWithRef<\n FloatingButtonPropsWithStackMode,\n 'button'\n>;\n\nexport const FloatingButton = forwardRef(FloatingButtonComponent) as PolymorphicComponentWithRef<\n FloatingButtonProps,\n 'button'\n>;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
@@ -9,7 +9,7 @@ import { FloatingButtonStackItem } from './FloatingButtonStackItem.js';
9
9
  import { FloatingButtonStackItems } from './FloatingButtonStackItems.js';
10
10
  import { FloatingButtonStackUpButton } from './FloatingButtonStackUpButton.js';
11
11
  import { Layer } from '@hh.ru/magritte-ui-layer';
12
- import { s as styles } from './floating-button-stack-D6EJ-Tml.js';
12
+ import { s as styles } from './floating-button-stack-BbDROKE1.js';
13
13
  import 'react-transition-group';
14
14
  import '@hh.ru/magritte-design-tokens/types';
15
15
  import './FloatingButton.js';
@@ -1 +1 @@
1
- {"version":3,"file":"FloatingButtonStack.js","sources":["../src/FloatingButtonStack.tsx"],"sourcesContent":["import { forwardRef, type LegacyRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport classnames from 'classnames';\n\nimport { useServerEnv } from '@hh.ru/magritte-common-is-server-env';\nimport { FloatingButtonStackProvider } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackContext';\nimport { FloatingButtonStackItem } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackItem';\nimport { FloatingButtonStackItems } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackItems';\nimport { FloatingButtonStackUpButton } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackUpButton';\nimport type { FloatingButtonStackProps } from '@hh.ru/magritte-ui-floating-button/types';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\n\nimport styles from './floating-button-stack.less';\n\nexport interface FloatingButtonStackComponents {\n Item: typeof FloatingButtonStackItem;\n}\n\nexport const FloatingButtonStackComponent = forwardRef<HTMLDivElement, FloatingButtonStackProps>(\n (\n {\n style = 'neutral',\n host,\n children,\n className,\n inlineStyle,\n upButtonVisible,\n disabled = false,\n position = 'right',\n onUpButtonClick,\n 'data-qa': dataQa = 'floating-button-stack',\n },\n ref\n ) => {\n const isServerEnv = useServerEnv();\n\n if (isServerEnv) {\n return null;\n }\n\n return createPortal(\n <Layer layer=\"floating-button-stack\">\n <div\n ref={ref as LegacyRef<HTMLDivElement>}\n className={classnames(styles.stack, styles[`${position}`], className)}\n style={inlineStyle}\n data-qa={dataQa}\n >\n <FloatingButtonStackProvider style={style} disabled={disabled}>\n <FloatingButtonStackUpButton\n upButtonVisible={upButtonVisible}\n disabled={disabled}\n onUpButtonClick={onUpButtonClick}\n data-qa={dataQa}\n />\n <FloatingButtonStackItems>{children}</FloatingButtonStackItems>\n </FloatingButtonStackProvider>\n </div>\n </Layer>,\n host?.current || document.body\n );\n }\n);\n\nFloatingButtonStackComponent.displayName = 'FloatingButtonStack';\n\nconst FloatingButtonStack = FloatingButtonStackComponent as typeof FloatingButtonStackComponent &\n FloatingButtonStackComponents;\n\nFloatingButtonStack.Item = FloatingButtonStackItem;\n\nexport { FloatingButtonStack };\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;AAkBa,MAAA,4BAA4B,GAAG,UAAU,CAClD,CACI,EACI,KAAK,GAAG,SAAS,EACjB,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,OAAO,EAClB,eAAe,EACf,SAAS,EAAE,MAAM,GAAG,uBAAuB,GAC9C,EACD,GAAG,KACH;AACA,IAAA,MAAM,WAAW,GAAG,YAAY,EAAE,CAAC;IAEnC,IAAI,WAAW,EAAE;AACb,QAAA,OAAO,IAAI,CAAC;KACf;AAED,IAAA,OAAO,YAAY,CACfA,GAAA,CAAC,KAAK,EAAC,EAAA,KAAK,EAAC,uBAAuB,EAAA,QAAA,EAChCA,GACI,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAgC,EACrC,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA,EAAG,QAAQ,CAAE,CAAA,CAAC,EAAE,SAAS,CAAC,EACrE,KAAK,EAAE,WAAW,EAAA,SAAA,EACT,MAAM,EAEf,QAAA,EAAAC,IAAA,CAAC,2BAA2B,EAAC,EAAA,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EACzD,QAAA,EAAA,CAAAD,GAAA,CAAC,2BAA2B,EACxB,EAAA,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,eAAe,EAAA,SAAA,EACvB,MAAM,EAAA,CACjB,EACFA,GAAC,CAAA,wBAAwB,cAAE,QAAQ,EAAA,CAA4B,IACrC,EAC5B,CAAA,EAAA,CACF,EACR,IAAI,EAAE,OAAO,IAAI,QAAQ,CAAC,IAAI,CACjC,CAAC;AACN,CAAC,EACH;AAEF,4BAA4B,CAAC,WAAW,GAAG,qBAAqB,CAAC;AAE3D,MAAA,mBAAmB,GAAG,6BACM;AAElC,mBAAmB,CAAC,IAAI,GAAG,uBAAuB;;;;"}
1
+ {"version":3,"file":"FloatingButtonStack.js","sources":["src/FloatingButtonStack.tsx"],"sourcesContent":["import { forwardRef, type LegacyRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport classnames from 'classnames';\n\nimport { useServerEnv } from '@hh.ru/magritte-common-is-server-env';\nimport { FloatingButtonStackProvider } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackContext';\nimport { FloatingButtonStackItem } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackItem';\nimport { FloatingButtonStackItems } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackItems';\nimport { FloatingButtonStackUpButton } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackUpButton';\nimport type { FloatingButtonStackProps } from '@hh.ru/magritte-ui-floating-button/types';\nimport { Layer } from '@hh.ru/magritte-ui-layer';\n\nimport styles from './floating-button-stack.less';\n\nexport interface FloatingButtonStackComponents {\n Item: typeof FloatingButtonStackItem;\n}\n\nexport const FloatingButtonStackComponent = forwardRef<HTMLDivElement, FloatingButtonStackProps>(\n (\n {\n style = 'neutral',\n host,\n children,\n className,\n inlineStyle,\n upButtonVisible,\n disabled = false,\n position = 'right',\n onUpButtonClick,\n 'data-qa': dataQa = 'floating-button-stack',\n },\n ref\n ) => {\n const isServerEnv = useServerEnv();\n\n if (isServerEnv) {\n return null;\n }\n\n return createPortal(\n <Layer layer=\"floating-button-stack\">\n <div\n ref={ref as LegacyRef<HTMLDivElement>}\n className={classnames(styles.stack, styles[`${position}`], className)}\n style={inlineStyle}\n data-qa={dataQa}\n >\n <FloatingButtonStackProvider style={style} disabled={disabled}>\n <FloatingButtonStackUpButton\n upButtonVisible={upButtonVisible}\n disabled={disabled}\n onUpButtonClick={onUpButtonClick}\n data-qa={dataQa}\n />\n <FloatingButtonStackItems>{children}</FloatingButtonStackItems>\n </FloatingButtonStackProvider>\n </div>\n </Layer>,\n host?.current || document.body\n );\n }\n);\n\nFloatingButtonStackComponent.displayName = 'FloatingButtonStack';\n\nconst FloatingButtonStack = FloatingButtonStackComponent as typeof FloatingButtonStackComponent &\n FloatingButtonStackComponents;\n\nFloatingButtonStack.Item = FloatingButtonStackItem;\n\nexport { FloatingButtonStack };\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;AAkBa,MAAA,4BAA4B,GAAG,UAAU,CAClD,CACI,EACI,KAAK,GAAG,SAAS,EACjB,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,OAAO,EAClB,eAAe,EACf,SAAS,EAAE,MAAM,GAAG,uBAAuB,GAC9C,EACD,GAAG,KACH;AACA,IAAA,MAAM,WAAW,GAAG,YAAY,EAAE,CAAC;IAEnC,IAAI,WAAW,EAAE;AACb,QAAA,OAAO,IAAI,CAAC;KACf;AAED,IAAA,OAAO,YAAY,CACfA,GAAA,CAAC,KAAK,EAAC,EAAA,KAAK,EAAC,uBAAuB,EAAA,QAAA,EAChCA,GACI,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAgC,EACrC,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA,EAAG,QAAQ,CAAE,CAAA,CAAC,EAAE,SAAS,CAAC,EACrE,KAAK,EAAE,WAAW,EAAA,SAAA,EACT,MAAM,EAEf,QAAA,EAAAC,IAAA,CAAC,2BAA2B,EAAC,EAAA,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EACzD,QAAA,EAAA,CAAAD,GAAA,CAAC,2BAA2B,EACxB,EAAA,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,eAAe,EAAA,SAAA,EACvB,MAAM,EAAA,CACjB,EACFA,GAAC,CAAA,wBAAwB,cAAE,QAAQ,EAAA,CAA4B,IACrC,EAC5B,CAAA,EAAA,CACF,EACR,IAAI,EAAE,OAAO,IAAI,QAAQ,CAAC,IAAI,CACjC,CAAC;AACN,CAAC,EACH;AAEF,4BAA4B,CAAC,WAAW,GAAG,qBAAqB,CAAC;AAE3D,MAAA,mBAAmB,GAAG,6BACM;AAElC,mBAAmB,CAAC,IAAI,GAAG,uBAAuB;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"FloatingButtonStackContext.js","sources":["../src/FloatingButtonStackContext.tsx"],"sourcesContent":["import {\n createContext,\n useContext,\n useState,\n useCallback,\n useMemo,\n useEffect,\n type FC,\n type PropsWithChildren,\n} from 'react';\n\nimport type { FloatingButtonStyle } from '@hh.ru/magritte-ui-floating-button/types';\n\ntype ButtonsSet = Set<string>;\n\ninterface FloatingButtonStackContextProps {\n /** floating кнопки */\n visibleButtons: ButtonsSet;\n /** флаг включения анимаций стака */\n animationsEnabled: boolean;\n /** стиль floating стака */\n style?: FloatingButtonStyle;\n /** флаг активности кропки */\n disabled?: boolean;\n /** callback для переключения видимости */\n setVisible: (id: string, visible: boolean) => void;\n}\n\nexport const FloatingButtonStackContext = createContext<FloatingButtonStackContextProps>({\n visibleButtons: new Set(),\n animationsEnabled: false,\n setVisible: () => null,\n});\n\nexport const useFloatingButtonStack = (): FloatingButtonStackContextProps => useContext(FloatingButtonStackContext);\n\ninterface FloatingButtonStackProviderProps extends PropsWithChildren {\n style?: FloatingButtonStyle;\n disabled?: boolean;\n}\n\nexport const FloatingButtonStackProvider: FC<FloatingButtonStackProviderProps> = ({ style, disabled, children }) => {\n const [visibleButtons, setVisibleButtons] = useState<ButtonsSet>(() => new Set());\n const [animationsEnabled, setAnimationsEnabled] = useState(false);\n\n useEffect(() => {\n if (animationsEnabled) {\n return;\n }\n if (visibleButtons.size > 0) {\n setAnimationsEnabled(true);\n }\n }, [visibleButtons, animationsEnabled]);\n\n const setVisible = useCallback<FloatingButtonStackContextProps['setVisible']>((id, visible) => {\n setVisibleButtons((prev) => {\n const has = prev.has(id);\n if (has === visible) {\n return prev;\n }\n const next = new Set(prev);\n if (visible) {\n next.add(id);\n } else {\n next.delete(id);\n }\n return next;\n });\n }, []);\n\n const contextValue = useMemo(\n () => ({\n style,\n disabled,\n animationsEnabled,\n setVisible,\n visibleButtons,\n }),\n [style, disabled, animationsEnabled, setVisible, visibleButtons]\n );\n\n return <FloatingButtonStackContext.Provider value={contextValue}>{children}</FloatingButtonStackContext.Provider>;\n};\n"],"names":["_jsx"],"mappings":";;;AA4BO,MAAM,0BAA0B,GAAG,aAAa,CAAkC;IACrF,cAAc,EAAE,IAAI,GAAG,EAAE;AACzB,IAAA,iBAAiB,EAAE,KAAK;AACxB,IAAA,UAAU,EAAE,MAAM,IAAI;AACzB,CAAA,EAAE;AAEU,MAAA,sBAAsB,GAAG,MAAuC,UAAU,CAAC,0BAA0B,EAAE;AAO7G,MAAM,2BAA2B,GAAyC,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAI;AAC/G,IAAA,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAa,MAAM,IAAI,GAAG,EAAE,CAAC,CAAC;IAClF,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElE,SAAS,CAAC,MAAK;QACX,IAAI,iBAAiB,EAAE;YACnB,OAAO;SACV;AACD,QAAA,IAAI,cAAc,CAAC,IAAI,GAAG,CAAC,EAAE;YACzB,oBAAoB,CAAC,IAAI,CAAC,CAAC;SAC9B;AACL,KAAC,EAAE,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAExC,MAAM,UAAU,GAAG,WAAW,CAAgD,CAAC,EAAE,EAAE,OAAO,KAAI;AAC1F,QAAA,iBAAiB,CAAC,CAAC,IAAI,KAAI;YACvB,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;AACzB,YAAA,IAAI,GAAG,KAAK,OAAO,EAAE;AACjB,gBAAA,OAAO,IAAI,CAAC;aACf;AACD,YAAA,MAAM,IAAI,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC;YAC3B,IAAI,OAAO,EAAE;AACT,gBAAA,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;aAChB;iBAAM;AACH,gBAAA,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;aACnB;AACD,YAAA,OAAO,IAAI,CAAC;AAChB,SAAC,CAAC,CAAC;KACN,EAAE,EAAE,CAAC,CAAC;AAEP,IAAA,MAAM,YAAY,GAAG,OAAO,CACxB,OAAO;QACH,KAAK;QACL,QAAQ;QACR,iBAAiB;QACjB,UAAU;QACV,cAAc;AACjB,KAAA,CAAC,EACF,CAAC,KAAK,EAAE,QAAQ,EAAE,iBAAiB,EAAE,UAAU,EAAE,cAAc,CAAC,CACnE,CAAC;IAEF,OAAOA,GAAA,CAAC,0BAA0B,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,YAAY,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAuC,CAAC;AACtH;;;;"}
1
+ {"version":3,"file":"FloatingButtonStackContext.js","sources":["src/FloatingButtonStackContext.tsx"],"sourcesContent":["import {\n createContext,\n useContext,\n useState,\n useCallback,\n useMemo,\n useEffect,\n type FC,\n type PropsWithChildren,\n} from 'react';\n\nimport type { FloatingButtonStyle } from '@hh.ru/magritte-ui-floating-button/types';\n\ntype ButtonsSet = Set<string>;\n\ninterface FloatingButtonStackContextProps {\n /** floating кнопки */\n visibleButtons: ButtonsSet;\n /** флаг включения анимаций стака */\n animationsEnabled: boolean;\n /** стиль floating стака */\n style?: FloatingButtonStyle;\n /** флаг активности кропки */\n disabled?: boolean;\n /** callback для переключения видимости */\n setVisible: (id: string, visible: boolean) => void;\n}\n\nexport const FloatingButtonStackContext = createContext<FloatingButtonStackContextProps>({\n visibleButtons: new Set(),\n animationsEnabled: false,\n setVisible: () => null,\n});\n\nexport const useFloatingButtonStack = (): FloatingButtonStackContextProps => useContext(FloatingButtonStackContext);\n\ninterface FloatingButtonStackProviderProps extends PropsWithChildren {\n style?: FloatingButtonStyle;\n disabled?: boolean;\n}\n\nexport const FloatingButtonStackProvider: FC<FloatingButtonStackProviderProps> = ({ style, disabled, children }) => {\n const [visibleButtons, setVisibleButtons] = useState<ButtonsSet>(() => new Set());\n const [animationsEnabled, setAnimationsEnabled] = useState(false);\n\n useEffect(() => {\n if (animationsEnabled) {\n return;\n }\n if (visibleButtons.size > 0) {\n setAnimationsEnabled(true);\n }\n }, [visibleButtons, animationsEnabled]);\n\n const setVisible = useCallback<FloatingButtonStackContextProps['setVisible']>((id, visible) => {\n setVisibleButtons((prev) => {\n const has = prev.has(id);\n if (has === visible) {\n return prev;\n }\n const next = new Set(prev);\n if (visible) {\n next.add(id);\n } else {\n next.delete(id);\n }\n return next;\n });\n }, []);\n\n const contextValue = useMemo(\n () => ({\n style,\n disabled,\n animationsEnabled,\n setVisible,\n visibleButtons,\n }),\n [style, disabled, animationsEnabled, setVisible, visibleButtons]\n );\n\n return <FloatingButtonStackContext.Provider value={contextValue}>{children}</FloatingButtonStackContext.Provider>;\n};\n"],"names":["_jsx"],"mappings":";;;AA4BO,MAAM,0BAA0B,GAAG,aAAa,CAAkC;IACrF,cAAc,EAAE,IAAI,GAAG,EAAE;AACzB,IAAA,iBAAiB,EAAE,KAAK;AACxB,IAAA,UAAU,EAAE,MAAM,IAAI;AACzB,CAAA,EAAE;AAEU,MAAA,sBAAsB,GAAG,MAAuC,UAAU,CAAC,0BAA0B,EAAE;AAO7G,MAAM,2BAA2B,GAAyC,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAI;AAC/G,IAAA,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAa,MAAM,IAAI,GAAG,EAAE,CAAC,CAAC;IAClF,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElE,SAAS,CAAC,MAAK;QACX,IAAI,iBAAiB,EAAE;YACnB,OAAO;SACV;AACD,QAAA,IAAI,cAAc,CAAC,IAAI,GAAG,CAAC,EAAE;YACzB,oBAAoB,CAAC,IAAI,CAAC,CAAC;SAC9B;AACL,KAAC,EAAE,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAExC,MAAM,UAAU,GAAG,WAAW,CAAgD,CAAC,EAAE,EAAE,OAAO,KAAI;AAC1F,QAAA,iBAAiB,CAAC,CAAC,IAAI,KAAI;YACvB,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;AACzB,YAAA,IAAI,GAAG,KAAK,OAAO,EAAE;AACjB,gBAAA,OAAO,IAAI,CAAC;aACf;AACD,YAAA,MAAM,IAAI,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC;YAC3B,IAAI,OAAO,EAAE;AACT,gBAAA,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;aAChB;iBAAM;AACH,gBAAA,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;aACnB;AACD,YAAA,OAAO,IAAI,CAAC;AAChB,SAAC,CAAC,CAAC;KACN,EAAE,EAAE,CAAC,CAAC;AAEP,IAAA,MAAM,YAAY,GAAG,OAAO,CACxB,OAAO;QACH,KAAK;QACL,QAAQ;QACR,iBAAiB;QACjB,UAAU;QACV,cAAc;AACjB,KAAA,CAAC,EACF,CAAC,KAAK,EAAE,QAAQ,EAAE,iBAAiB,EAAE,UAAU,EAAE,cAAc,CAAC,CACnE,CAAC;IAEF,OAAOA,GAAA,CAAC,0BAA0B,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,YAAY,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAuC,CAAC;AACtH;;;;"}
@@ -6,7 +6,7 @@ import classnames from 'classnames';
6
6
  import { tokenSemanticAnimationTimeSDuration } from '@hh.ru/magritte-design-tokens/types';
7
7
  import { FloatingButtonWithStackMode } from './FloatingButton.js';
8
8
  import { useFloatingButtonStack } from './FloatingButtonStackContext.js';
9
- import { s as styles } from './floating-button-stack-D6EJ-Tml.js';
9
+ import { s as styles } from './floating-button-stack-BbDROKE1.js';
10
10
  import 'react-dom';
11
11
  import '@hh.ru/magritte-common-is-server-env';
12
12
  import '@hh.ru/magritte-ui-badge';
@@ -1 +1 @@
1
- {"version":3,"file":"FloatingButtonStackItem.js","sources":["../src/FloatingButtonStackItem.tsx"],"sourcesContent":["import { useEffect, useId, useRef, forwardRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport classnames from 'classnames';\n\nimport { tokenSemanticAnimationTimeSDuration } from '@hh.ru/magritte-design-tokens/types';\nimport type { PolymorphicForwardRefRenderFunc, PolymorphicComponentWithRef } from '@hh.ru/magritte-types';\nimport { FloatingButtonWithStackMode } from '@hh.ru/magritte-ui-floating-button/FloatingButton';\nimport { useFloatingButtonStack } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackContext';\nimport type { FloatingButtonStackItemProps } from '@hh.ru/magritte-ui-floating-button/types';\n\nimport styles from './floating-button-stack.less';\n\nconst FloatingButtonStackItemComponent: PolymorphicForwardRefRenderFunc<FloatingButtonStackItemProps, 'button'> = (\n { Element = 'button', visible = false, ...otherProps },\n ref\n) => {\n const uid = useId();\n const { setVisible, animationsEnabled, style, disabled } = useFloatingButtonStack();\n const nodeRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n setVisible(uid, visible);\n }, [uid, setVisible, visible]);\n\n useEffect(() => {\n return () => {\n setVisible(uid, false);\n };\n }, [uid, setVisible]);\n\n return (\n <CSSTransition\n in={visible}\n enter={animationsEnabled}\n exit={animationsEnabled}\n classNames={{\n enter: styles.enterFloatingButtonAnimation,\n enterActive: styles.enterFloatingButtonAnimationActive,\n exit: styles.exitFloatingButtonAnimation,\n exitActive: styles.exitFloatingButtonAnimationActive,\n }}\n nodeRef={nodeRef}\n timeout={tokenSemanticAnimationTimeSDuration}\n unmountOnExit\n >\n <div ref={nodeRef} className={classnames(styles.floatingButtonWrapper)}>\n <FloatingButtonWithStackMode\n Element={Element}\n ref={ref}\n {...otherProps}\n style={style}\n disabled={disabled}\n stackMode\n />\n </div>\n </CSSTransition>\n );\n};\n\nexport const FloatingButtonStackItem = forwardRef(FloatingButtonStackItemComponent) as PolymorphicComponentWithRef<\n FloatingButtonStackItemProps,\n 'button'\n>;\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;;;AAYA,MAAM,gCAAgC,GAA4E,CAC9G,EAAE,OAAO,GAAG,QAAQ,EAAE,OAAO,GAAG,KAAK,EAAE,GAAG,UAAU,EAAE,EACtD,GAAG,KACH;AACA,IAAA,MAAM,GAAG,GAAG,KAAK,EAAE,CAAC;AACpB,IAAA,MAAM,EAAE,UAAU,EAAE,iBAAiB,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,sBAAsB,EAAE,CAAC;AACpF,IAAA,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE7C,SAAS,CAAC,MAAK;AACX,QAAA,UAAU,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;KAC5B,EAAE,CAAC,GAAG,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAE/B,SAAS,CAAC,MAAK;AACX,QAAA,OAAO,MAAK;AACR,YAAA,UAAU,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;AAC3B,SAAC,CAAC;AACN,KAAC,EAAE,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC;AAEtB,IAAA,QACIA,GAAC,CAAA,aAAa,EACV,EAAA,EAAE,EAAE,OAAO,EACX,KAAK,EAAE,iBAAiB,EACxB,IAAI,EAAE,iBAAiB,EACvB,UAAU,EAAE;YACR,KAAK,EAAE,MAAM,CAAC,4BAA4B;YAC1C,WAAW,EAAE,MAAM,CAAC,kCAAkC;YACtD,IAAI,EAAE,MAAM,CAAC,2BAA2B;YACxC,UAAU,EAAE,MAAM,CAAC,iCAAiC;SACvD,EACD,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,mCAAmC,EAC5C,aAAa,EAEb,IAAA,EAAA,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,qBAAqB,CAAC,EAClE,QAAA,EAAAA,GAAA,CAAC,2BAA2B,EACxB,EAAA,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EACJ,GAAA,UAAU,EACd,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,SAAS,EACX,IAAA,EAAA,CAAA,EAAA,CACA,EACM,CAAA,EAClB;AACN,CAAC,CAAC;MAEW,uBAAuB,GAAG,UAAU,CAAC,gCAAgC;;;;"}
1
+ {"version":3,"file":"FloatingButtonStackItem.js","sources":["src/FloatingButtonStackItem.tsx"],"sourcesContent":["import { useEffect, useId, useRef, forwardRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\nimport classnames from 'classnames';\n\nimport { tokenSemanticAnimationTimeSDuration } from '@hh.ru/magritte-design-tokens/types';\nimport type { PolymorphicForwardRefRenderFunc, PolymorphicComponentWithRef } from '@hh.ru/magritte-types';\nimport { FloatingButtonWithStackMode } from '@hh.ru/magritte-ui-floating-button/FloatingButton';\nimport { useFloatingButtonStack } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackContext';\nimport type { FloatingButtonStackItemProps } from '@hh.ru/magritte-ui-floating-button/types';\n\nimport styles from './floating-button-stack.less';\n\nconst FloatingButtonStackItemComponent: PolymorphicForwardRefRenderFunc<FloatingButtonStackItemProps, 'button'> = (\n { Element = 'button', visible = false, ...otherProps },\n ref\n) => {\n const uid = useId();\n const { setVisible, animationsEnabled, style, disabled } = useFloatingButtonStack();\n const nodeRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n setVisible(uid, visible);\n }, [uid, setVisible, visible]);\n\n useEffect(() => {\n return () => {\n setVisible(uid, false);\n };\n }, [uid, setVisible]);\n\n return (\n <CSSTransition\n in={visible}\n enter={animationsEnabled}\n exit={animationsEnabled}\n classNames={{\n enter: styles.enterFloatingButtonAnimation,\n enterActive: styles.enterFloatingButtonAnimationActive,\n exit: styles.exitFloatingButtonAnimation,\n exitActive: styles.exitFloatingButtonAnimationActive,\n }}\n nodeRef={nodeRef}\n timeout={tokenSemanticAnimationTimeSDuration}\n unmountOnExit\n >\n <div ref={nodeRef} className={classnames(styles.floatingButtonWrapper)}>\n <FloatingButtonWithStackMode\n Element={Element}\n ref={ref}\n {...otherProps}\n style={style}\n disabled={disabled}\n stackMode\n />\n </div>\n </CSSTransition>\n );\n};\n\nexport const FloatingButtonStackItem = forwardRef(FloatingButtonStackItemComponent) as PolymorphicComponentWithRef<\n FloatingButtonStackItemProps,\n 'button'\n>;\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;;;AAYA,MAAM,gCAAgC,GAA4E,CAC9G,EAAE,OAAO,GAAG,QAAQ,EAAE,OAAO,GAAG,KAAK,EAAE,GAAG,UAAU,EAAE,EACtD,GAAG,KACH;AACA,IAAA,MAAM,GAAG,GAAG,KAAK,EAAE,CAAC;AACpB,IAAA,MAAM,EAAE,UAAU,EAAE,iBAAiB,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,sBAAsB,EAAE,CAAC;AACpF,IAAA,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE7C,SAAS,CAAC,MAAK;AACX,QAAA,UAAU,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;KAC5B,EAAE,CAAC,GAAG,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAE/B,SAAS,CAAC,MAAK;AACX,QAAA,OAAO,MAAK;AACR,YAAA,UAAU,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;AAC3B,SAAC,CAAC;AACN,KAAC,EAAE,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC;AAEtB,IAAA,QACIA,GAAC,CAAA,aAAa,EACV,EAAA,EAAE,EAAE,OAAO,EACX,KAAK,EAAE,iBAAiB,EACxB,IAAI,EAAE,iBAAiB,EACvB,UAAU,EAAE;YACR,KAAK,EAAE,MAAM,CAAC,4BAA4B;YAC1C,WAAW,EAAE,MAAM,CAAC,kCAAkC;YACtD,IAAI,EAAE,MAAM,CAAC,2BAA2B;YACxC,UAAU,EAAE,MAAM,CAAC,iCAAiC;SACvD,EACD,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,mCAAmC,EAC5C,aAAa,EAEb,IAAA,EAAA,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,qBAAqB,CAAC,EAClE,QAAA,EAAAA,GAAA,CAAC,2BAA2B,EACxB,EAAA,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EACJ,GAAA,UAAU,EACd,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,SAAS,EACX,IAAA,EAAA,CAAA,EAAA,CACA,EACM,CAAA,EAClB;AACN,CAAC,CAAC;MAEW,uBAAuB,GAAG,UAAU,CAAC,gCAAgC;;;;"}
@@ -2,7 +2,7 @@ import './index.css';
2
2
  import { jsx } from 'react/jsx-runtime';
3
3
  import classnames from 'classnames';
4
4
  import { useFloatingButtonStack } from './FloatingButtonStackContext.js';
5
- import { s as styles } from './floating-button-stack-D6EJ-Tml.js';
5
+ import { s as styles } from './floating-button-stack-BbDROKE1.js';
6
6
  import 'react';
7
7
 
8
8
  const FloatingButtonStackItems = ({ children }) => {
@@ -1 +1 @@
1
- {"version":3,"file":"FloatingButtonStackItems.js","sources":["../src/FloatingButtonStackItems.tsx"],"sourcesContent":["import { type FC, type PropsWithChildren } from 'react';\nimport classnames from 'classnames';\n\nimport { useFloatingButtonStack } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackContext';\n\nimport styles from './floating-button-stack.less';\n\nexport const FloatingButtonStackItems: FC<PropsWithChildren> = ({ children }) => {\n const { visibleButtons, animationsEnabled, style, disabled } = useFloatingButtonStack();\n return (\n <div\n className={classnames(styles.floatingButtons, styles[`floating-buttons_${style}`], {\n [styles.disabled]: disabled,\n [styles.visibled]: visibleButtons.size > 0,\n [styles.animated]: animationsEnabled,\n })}\n >\n {children}\n </div>\n );\n};\n"],"names":["_jsx"],"mappings":";;;;;;MAOa,wBAAwB,GAA0B,CAAC,EAAE,QAAQ,EAAE,KAAI;AAC5E,IAAA,MAAM,EAAE,cAAc,EAAE,iBAAiB,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,sBAAsB,EAAE,CAAC;AACxF,IAAA,QACIA,GACI,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAAA,iBAAA,EAAoB,KAAK,CAAA,CAAE,CAAC,EAAE;AAC/E,YAAA,CAAC,MAAM,CAAC,QAAQ,GAAG,QAAQ;YAC3B,CAAC,MAAM,CAAC,QAAQ,GAAG,cAAc,CAAC,IAAI,GAAG,CAAC;AAC1C,YAAA,CAAC,MAAM,CAAC,QAAQ,GAAG,iBAAiB;AACvC,SAAA,CAAC,EAED,QAAA,EAAA,QAAQ,EACP,CAAA,EACR;AACN;;;;"}
1
+ {"version":3,"file":"FloatingButtonStackItems.js","sources":["src/FloatingButtonStackItems.tsx"],"sourcesContent":["import { type FC, type PropsWithChildren } from 'react';\nimport classnames from 'classnames';\n\nimport { useFloatingButtonStack } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackContext';\n\nimport styles from './floating-button-stack.less';\n\nexport const FloatingButtonStackItems: FC<PropsWithChildren> = ({ children }) => {\n const { visibleButtons, animationsEnabled, style, disabled } = useFloatingButtonStack();\n return (\n <div\n className={classnames(styles.floatingButtons, styles[`floating-buttons_${style}`], {\n [styles.disabled]: disabled,\n [styles.visibled]: visibleButtons.size > 0,\n [styles.animated]: animationsEnabled,\n })}\n >\n {children}\n </div>\n );\n};\n"],"names":["_jsx"],"mappings":";;;;;;MAOa,wBAAwB,GAA0B,CAAC,EAAE,QAAQ,EAAE,KAAI;AAC5E,IAAA,MAAM,EAAE,cAAc,EAAE,iBAAiB,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,sBAAsB,EAAE,CAAC;AACxF,IAAA,QACIA,GACI,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAAA,iBAAA,EAAoB,KAAK,CAAA,CAAE,CAAC,EAAE;AAC/E,YAAA,CAAC,MAAM,CAAC,QAAQ,GAAG,QAAQ;YAC3B,CAAC,MAAM,CAAC,QAAQ,GAAG,cAAc,CAAC,IAAI,GAAG,CAAC;AAC1C,YAAA,CAAC,MAAM,CAAC,QAAQ,GAAG,iBAAiB;AACvC,SAAA,CAAC,EAED,QAAA,EAAA,QAAQ,EACP,CAAA,EACR;AACN;;;;"}
@@ -6,7 +6,7 @@ import { tokenSemanticAnimationTimeSDuration } from '@hh.ru/magritte-design-toke
6
6
  import { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';
7
7
  import { useFloatingButtonStack } from './FloatingButtonStackContext.js';
8
8
  import { ArrowUpOutlinedSize24 } from '@hh.ru/magritte-ui-icon/variants/icon';
9
- import { s as styles } from './floating-button-stack-D6EJ-Tml.js';
9
+ import { s as styles } from './floating-button-stack-BbDROKE1.js';
10
10
 
11
11
  const FloatingButtonStackUpButton = ({ upButtonVisible, disabled = false, onUpButtonClick, 'data-qa': dataQa, }) => {
12
12
  const { animationsEnabled } = useFloatingButtonStack();
@@ -1 +1 @@
1
- {"version":3,"file":"FloatingButtonStackUpButton.js","sources":["../src/FloatingButtonStackUpButton.tsx"],"sourcesContent":["import { useRef, type FC } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport { tokenSemanticAnimationTimeSDuration } from '@hh.ru/magritte-design-tokens/types';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { useFloatingButtonStack } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackContext';\nimport type { FloatingButtonStackProps } from '@hh.ru/magritte-ui-floating-button/types';\nimport { ArrowUpOutlinedSize24 } from '@hh.ru/magritte-ui-icon/variants/icon';\n\nimport styles from './floating-button-stack.less';\n\ntype FloatingButtonStackUpButtonProps = Pick<\n FloatingButtonStackProps,\n 'upButtonVisible' | 'disabled' | 'onUpButtonClick' | 'data-qa'\n>;\n\nexport const FloatingButtonStackUpButton: FC<FloatingButtonStackUpButtonProps> = ({\n upButtonVisible,\n disabled = false,\n onUpButtonClick,\n 'data-qa': dataQa,\n}) => {\n const { animationsEnabled } = useFloatingButtonStack();\n const { isMobile } = useBreakpoint();\n const upButtonRef = useRef<HTMLDivElement>(null);\n\n return (\n <CSSTransition\n in={upButtonVisible}\n enter={animationsEnabled}\n exit={animationsEnabled}\n classNames={{\n enter: styles.enterUpButtonAnimation,\n enterActive: styles.enterUpButtonAnimationActive,\n exit: styles.exitUpButtonAnimation,\n exitActive: styles.exitUpButtonAnimationActive,\n }}\n nodeRef={upButtonRef}\n timeout={tokenSemanticAnimationTimeSDuration}\n unmountOnExit\n >\n <div ref={upButtonRef} className={styles.upButton}>\n <ArrowUpOutlinedSize24\n padding={isMobile ? 16 : 24}\n onClick={onUpButtonClick}\n backgroundStyle=\"secondary\"\n borderRadius={'halfHeight'}\n disabled={disabled}\n data-qa={`${dataQa}-up-button`}\n />\n </div>\n </CSSTransition>\n );\n};\n"],"names":["_jsx"],"mappings":";;;;;;;;;AAgBa,MAAA,2BAA2B,GAAyC,CAAC,EAC9E,eAAe,EACf,QAAQ,GAAG,KAAK,EAChB,eAAe,EACf,SAAS,EAAE,MAAM,GACpB,KAAI;AACD,IAAA,MAAM,EAAE,iBAAiB,EAAE,GAAG,sBAAsB,EAAE,CAAC;AACvD,IAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,CAAC;AACrC,IAAA,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AAEjD,IAAA,QACIA,GAAC,CAAA,aAAa,EACV,EAAA,EAAE,EAAE,eAAe,EACnB,KAAK,EAAE,iBAAiB,EACxB,IAAI,EAAE,iBAAiB,EACvB,UAAU,EAAE;YACR,KAAK,EAAE,MAAM,CAAC,sBAAsB;YACpC,WAAW,EAAE,MAAM,CAAC,4BAA4B;YAChD,IAAI,EAAE,MAAM,CAAC,qBAAqB;YAClC,UAAU,EAAE,MAAM,CAAC,2BAA2B;SACjD,EACD,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,mCAAmC,EAC5C,aAAa,EAEb,IAAA,EAAA,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAA,QAAA,EAC7CA,GAAC,CAAA,qBAAqB,EAClB,EAAA,OAAO,EAAE,QAAQ,GAAG,EAAE,GAAG,EAAE,EAC3B,OAAO,EAAE,eAAe,EACxB,eAAe,EAAC,WAAW,EAC3B,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,QAAQ,EACT,SAAA,EAAA,CAAA,EAAG,MAAM,CAAA,UAAA,CAAY,EAChC,CAAA,EAAA,CACA,EACM,CAAA,EAClB;AACN;;;;"}
1
+ {"version":3,"file":"FloatingButtonStackUpButton.js","sources":["src/FloatingButtonStackUpButton.tsx"],"sourcesContent":["import { useRef, type FC } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport { tokenSemanticAnimationTimeSDuration } from '@hh.ru/magritte-design-tokens/types';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { useFloatingButtonStack } from '@hh.ru/magritte-ui-floating-button/FloatingButtonStackContext';\nimport type { FloatingButtonStackProps } from '@hh.ru/magritte-ui-floating-button/types';\nimport { ArrowUpOutlinedSize24 } from '@hh.ru/magritte-ui-icon/variants/icon';\n\nimport styles from './floating-button-stack.less';\n\ntype FloatingButtonStackUpButtonProps = Pick<\n FloatingButtonStackProps,\n 'upButtonVisible' | 'disabled' | 'onUpButtonClick' | 'data-qa'\n>;\n\nexport const FloatingButtonStackUpButton: FC<FloatingButtonStackUpButtonProps> = ({\n upButtonVisible,\n disabled = false,\n onUpButtonClick,\n 'data-qa': dataQa,\n}) => {\n const { animationsEnabled } = useFloatingButtonStack();\n const { isMobile } = useBreakpoint();\n const upButtonRef = useRef<HTMLDivElement>(null);\n\n return (\n <CSSTransition\n in={upButtonVisible}\n enter={animationsEnabled}\n exit={animationsEnabled}\n classNames={{\n enter: styles.enterUpButtonAnimation,\n enterActive: styles.enterUpButtonAnimationActive,\n exit: styles.exitUpButtonAnimation,\n exitActive: styles.exitUpButtonAnimationActive,\n }}\n nodeRef={upButtonRef}\n timeout={tokenSemanticAnimationTimeSDuration}\n unmountOnExit\n >\n <div ref={upButtonRef} className={styles.upButton}>\n <ArrowUpOutlinedSize24\n padding={isMobile ? 16 : 24}\n onClick={onUpButtonClick}\n backgroundStyle=\"secondary\"\n borderRadius={'halfHeight'}\n disabled={disabled}\n data-qa={`${dataQa}-up-button`}\n />\n </div>\n </CSSTransition>\n );\n};\n"],"names":["_jsx"],"mappings":";;;;;;;;;AAgBa,MAAA,2BAA2B,GAAyC,CAAC,EAC9E,eAAe,EACf,QAAQ,GAAG,KAAK,EAChB,eAAe,EACf,SAAS,EAAE,MAAM,GACpB,KAAI;AACD,IAAA,MAAM,EAAE,iBAAiB,EAAE,GAAG,sBAAsB,EAAE,CAAC;AACvD,IAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,CAAC;AACrC,IAAA,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AAEjD,IAAA,QACIA,GAAC,CAAA,aAAa,EACV,EAAA,EAAE,EAAE,eAAe,EACnB,KAAK,EAAE,iBAAiB,EACxB,IAAI,EAAE,iBAAiB,EACvB,UAAU,EAAE;YACR,KAAK,EAAE,MAAM,CAAC,sBAAsB;YACpC,WAAW,EAAE,MAAM,CAAC,4BAA4B;YAChD,IAAI,EAAE,MAAM,CAAC,qBAAqB;YAClC,UAAU,EAAE,MAAM,CAAC,2BAA2B;SACjD,EACD,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,mCAAmC,EAC5C,aAAa,EAEb,IAAA,EAAA,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAA,QAAA,EAC7CA,GAAC,CAAA,qBAAqB,EAClB,EAAA,OAAO,EAAE,QAAQ,GAAG,EAAE,GAAG,EAAE,EAC3B,OAAO,EAAE,eAAe,EACxB,eAAe,EAAC,WAAW,EAC3B,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,QAAQ,EACT,SAAA,EAAA,CAAA,EAAG,MAAM,CAAA,UAAA,CAAY,EAChC,CAAA,EAAA,CACA,EACM,CAAA,EAClB;AACN;;;;"}
@@ -0,0 +1,5 @@
1
+ import './index.css';
2
+ var styles = {"stack":"magritte-stack___v7QhJ_3-0-3","right":"magritte-right___v4PFa_3-0-3","left":"magritte-left___JXzpq_3-0-3","center":"magritte-center___rV3kK_3-0-3","up-button":"magritte-up-button___M-Jgi_3-0-3","upButton":"magritte-up-button___M-Jgi_3-0-3","enter-up-button-animation":"magritte-enter-up-button-animation___-n3rG_3-0-3","enterUpButtonAnimation":"magritte-enter-up-button-animation___-n3rG_3-0-3","enter-up-button-animation-active":"magritte-enter-up-button-animation-active___8pejQ_3-0-3","enterUpButtonAnimationActive":"magritte-enter-up-button-animation-active___8pejQ_3-0-3","exit-up-button-animation":"magritte-exit-up-button-animation___80DEE_3-0-3","exitUpButtonAnimation":"magritte-exit-up-button-animation___80DEE_3-0-3","exit-up-button-animation-active":"magritte-exit-up-button-animation-active___f1LjL_3-0-3","exitUpButtonAnimationActive":"magritte-exit-up-button-animation-active___f1LjL_3-0-3","floating-buttons":"magritte-floating-buttons___oi9Yx_3-0-3","floatingButtons":"magritte-floating-buttons___oi9Yx_3-0-3","animated":"magritte-animated___z--5Y_3-0-3","visibled":"magritte-visibled___hHvF6_3-0-3","floating-buttons_neutral":"magritte-floating-buttons_neutral___LCnTQ_3-0-3","floatingButtonsNeutral":"magritte-floating-buttons_neutral___LCnTQ_3-0-3","disabled":"magritte-disabled___XSSqS_3-0-3","floating-buttons_inverse":"magritte-floating-buttons_inverse___xhm17_3-0-3","floatingButtonsInverse":"magritte-floating-buttons_inverse___xhm17_3-0-3","floating-button-wrapper":"magritte-floating-button-wrapper___HlTzE_3-0-3","floatingButtonWrapper":"magritte-floating-button-wrapper___HlTzE_3-0-3","enter-floating-button-animation":"magritte-enter-floating-button-animation___nke2I_3-0-3","enterFloatingButtonAnimation":"magritte-enter-floating-button-animation___nke2I_3-0-3","enter-floating-button-animation-active":"magritte-enter-floating-button-animation-active___AayrW_3-0-3","enterFloatingButtonAnimationActive":"magritte-enter-floating-button-animation-active___AayrW_3-0-3","exit-floating-button-animation":"magritte-exit-floating-button-animation___dXSTW_3-0-3","exitFloatingButtonAnimation":"magritte-exit-floating-button-animation___dXSTW_3-0-3","exit-floating-button-animation-active":"magritte-exit-floating-button-animation-active___DhIfE_3-0-3","exitFloatingButtonAnimationActive":"magritte-exit-floating-button-animation-active___DhIfE_3-0-3"};
3
+
4
+ export { styles as s };
5
+ //# sourceMappingURL=floating-button-stack-BbDROKE1.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"floating-button-stack-BbDROKE1.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
package/index.css CHANGED
@@ -1,265 +1,265 @@
1
1
  :root{
2
- --magritte-color-component-button-background-neutral-v24-4-0:#000000;
3
- --magritte-color-component-button-background-inverse-v24-4-0:#ffffff;
4
- --magritte-color-component-button-background-state-neutral-disabled-v24-4-0:#DCE3EB;
5
- --magritte-color-component-button-background-state-neutral-hovered-v24-4-0:#343c43;
6
- --magritte-color-component-button-background-state-neutral-pressed-v24-4-0:#000000;
7
- --magritte-color-component-button-background-state-neutral-focused-v24-4-0:#000000;
8
- --magritte-color-component-button-background-state-inverse-hovered-v24-4-0:#EEF1F7;
9
- --magritte-color-component-button-background-state-inverse-pressed-v24-4-0:#ffffff;
10
- --magritte-color-component-button-background-state-inverse-focused-v24-4-0:#ffffff;
11
- --magritte-color-component-button-background-state-inverse-disabled-v24-4-0:#ffffff;
12
- --magritte-color-component-button-text-neutral-v24-4-0:#ffffff;
13
- --magritte-color-component-button-text-inverse-v24-4-0:#0d1115;
14
- --magritte-color-component-button-icon-neutral-v24-4-0:#ffffff;
15
- --magritte-color-component-button-icon-inverse-v24-4-0:#0d1115;
16
- --magritte-color-component-button-loader-icon-neutral-v24-4-0:#ffffff;
17
- --magritte-color-component-button-loader-icon-inverse-v24-4-0:#000000;
18
- --magritte-color-component-button-text-state-neutral-disabled-v24-4-0:#8293a2;
19
- --magritte-color-component-button-text-state-inverse-disabled-v24-4-0:#8da0b0;
20
- --magritte-color-component-button-icon-state-neutral-disabled-v24-4-0:#8293a2;
21
- --magritte-color-component-button-icon-state-inverse-disabled-v24-4-0:#8da0b0;
22
- --magritte-color-component-button-stroke-state-neutral-focused-accessible-v24-4-0:#0070ff7a;
23
- --magritte-color-component-button-stroke-state-inverse-focused-accessible-v24-4-0:#a4c9fe7a;
24
- --magritte-color-component-button-postfix-text-neutral-v24-4-0:#AABBCA;
25
- --magritte-color-component-button-postfix-text-inverse-v24-4-0:#0d1115;
26
- --magritte-color-component-button-postfix-text-state-neutral-disabled-v24-4-0:#AABBCA;
27
- --magritte-color-component-button-postfix-text-state-inverse-disabled-v24-4-0:#96aabb;
28
- --magritte-shadow-level-2-color-v24-4-0:#7090b03d;
29
- --magritte-shadow-level-2-x-v24-4-0:0px;
30
- --magritte-shadow-level-2-y-v24-4-0:8px;
31
- --magritte-shadow-level-2-blur-v24-4-0:16px;
32
- --magritte-shadow-level-2-spread-v24-4-0:0px;
33
- --magritte-shadow-level-1-color-v24-4-0:#7090b029;
34
- --magritte-shadow-level-1-x-v24-4-0:0px;
35
- --magritte-shadow-level-1-y-v24-4-0:4px;
36
- --magritte-shadow-level-1-blur-v24-4-0:12px;
37
- --magritte-shadow-level-1-spread-v24-4-0:0px;
2
+ --magritte-color-component-button-background-neutral-v24-4-1:#000000;
3
+ --magritte-color-component-button-background-inverse-v24-4-1:#ffffff;
4
+ --magritte-color-component-button-background-state-neutral-disabled-v24-4-1:#DCE3EB;
5
+ --magritte-color-component-button-background-state-neutral-hovered-v24-4-1:#343c43;
6
+ --magritte-color-component-button-background-state-neutral-pressed-v24-4-1:#000000;
7
+ --magritte-color-component-button-background-state-neutral-focused-v24-4-1:#000000;
8
+ --magritte-color-component-button-background-state-inverse-hovered-v24-4-1:#EEF1F7;
9
+ --magritte-color-component-button-background-state-inverse-pressed-v24-4-1:#ffffff;
10
+ --magritte-color-component-button-background-state-inverse-focused-v24-4-1:#ffffff;
11
+ --magritte-color-component-button-background-state-inverse-disabled-v24-4-1:#ffffff;
12
+ --magritte-color-component-button-text-neutral-v24-4-1:#ffffff;
13
+ --magritte-color-component-button-text-inverse-v24-4-1:#0d1115;
14
+ --magritte-color-component-button-icon-neutral-v24-4-1:#ffffff;
15
+ --magritte-color-component-button-icon-inverse-v24-4-1:#0d1115;
16
+ --magritte-color-component-button-loader-icon-neutral-v24-4-1:#ffffff;
17
+ --magritte-color-component-button-loader-icon-inverse-v24-4-1:#000000;
18
+ --magritte-color-component-button-text-state-neutral-disabled-v24-4-1:#8293a2;
19
+ --magritte-color-component-button-text-state-inverse-disabled-v24-4-1:#8da0b0;
20
+ --magritte-color-component-button-icon-state-neutral-disabled-v24-4-1:#8293a2;
21
+ --magritte-color-component-button-icon-state-inverse-disabled-v24-4-1:#8da0b0;
22
+ --magritte-color-component-button-stroke-state-neutral-focused-accessible-v24-4-1:#0070ff7a;
23
+ --magritte-color-component-button-stroke-state-inverse-focused-accessible-v24-4-1:#a4c9fe7a;
24
+ --magritte-color-component-button-postfix-text-neutral-v24-4-1:#AABBCA;
25
+ --magritte-color-component-button-postfix-text-inverse-v24-4-1:#0d1115;
26
+ --magritte-color-component-button-postfix-text-state-neutral-disabled-v24-4-1:#AABBCA;
27
+ --magritte-color-component-button-postfix-text-state-inverse-disabled-v24-4-1:#96aabb;
28
+ --magritte-shadow-level-2-color-v24-4-1:#7090b03d;
29
+ --magritte-shadow-level-2-x-v24-4-1:0px;
30
+ --magritte-shadow-level-2-y-v24-4-1:8px;
31
+ --magritte-shadow-level-2-blur-v24-4-1:16px;
32
+ --magritte-shadow-level-2-spread-v24-4-1:0px;
33
+ --magritte-shadow-level-1-color-v24-4-1:#7090b029;
34
+ --magritte-shadow-level-1-x-v24-4-1:0px;
35
+ --magritte-shadow-level-1-y-v24-4-1:4px;
36
+ --magritte-shadow-level-1-blur-v24-4-1:12px;
37
+ --magritte-shadow-level-1-spread-v24-4-1:0px;
38
38
  }
39
39
 
40
40
  :root{
41
- --magritte-semantic-animation-time-s-duration-v24-4-0:200ms;
42
- --magritte-semantic-animation-ease-base-timing-function-v24-4-0:cubic-bezier(0.4, 0.24, 0, 1);
43
- --magritte-semantic-animation-ease-in-out-100-timing-function-v24-4-0:cubic-bezier(0.25, 0.1, 0.25, 1);
44
- --magritte-semantic-animation-ease-in-out-100-duration-v24-4-0:100ms;
45
- --magritte-semantic-animation-ease-in-out-200-timing-function-v24-4-0:cubic-bezier(0.25, 0.1, 0.25, 1);
46
- --magritte-semantic-animation-ease-in-out-200-duration-v24-4-0:200ms;
41
+ --magritte-semantic-animation-time-s-duration-v24-4-1:200ms;
42
+ --magritte-semantic-animation-ease-base-timing-function-v24-4-1:cubic-bezier(0.4, 0.24, 0, 1);
43
+ --magritte-semantic-animation-ease-in-out-100-timing-function-v24-4-1:cubic-bezier(0.25, 0.1, 0.25, 1);
44
+ --magritte-semantic-animation-ease-in-out-100-duration-v24-4-1:100ms;
45
+ --magritte-semantic-animation-ease-in-out-200-timing-function-v24-4-1:cubic-bezier(0.25, 0.1, 0.25, 1);
46
+ --magritte-semantic-animation-ease-in-out-200-duration-v24-4-1:200ms;
47
47
  }
48
48
 
49
49
  .magritte-night-theme{
50
- --magritte-color-component-button-background-neutral-v24-4-0:#ffffff;
51
- --magritte-color-component-button-background-inverse-v24-4-0:#303030;
52
- --magritte-color-component-button-background-state-neutral-disabled-v24-4-0:#303030;
53
- --magritte-color-component-button-background-state-inverse-disabled-v24-4-0:#262626;
54
- --magritte-color-component-button-background-state-neutral-hovered-v24-4-0:#F1F1F1;
55
- --magritte-color-component-button-background-state-neutral-pressed-v24-4-0:#ffffff;
56
- --magritte-color-component-button-background-state-neutral-focused-v24-4-0:#ffffff;
57
- --magritte-color-component-button-background-state-inverse-hovered-v24-4-0:#3B3B3B;
58
- --magritte-color-component-button-background-state-inverse-pressed-v24-4-0:#303030;
59
- --magritte-color-component-button-background-state-inverse-focused-v24-4-0:#303030;
60
- --magritte-color-component-button-text-neutral-v24-4-0:#000000;
61
- --magritte-color-component-button-text-inverse-v24-4-0:#ffffff;
62
- --magritte-color-component-button-text-state-neutral-disabled-v24-4-0:#848484;
63
- --magritte-color-component-button-text-state-inverse-disabled-v24-4-0:#848484;
64
- --magritte-color-component-button-icon-state-neutral-disabled-v24-4-0:#848484;
65
- --magritte-color-component-button-icon-state-inverse-disabled-v24-4-0:#848484;
66
- --magritte-color-component-button-icon-neutral-v24-4-0:#000000;
67
- --magritte-color-component-button-icon-inverse-v24-4-0:#ffffff;
68
- --magritte-color-component-button-loader-icon-neutral-v24-4-0:#000000;
69
- --magritte-color-component-button-loader-icon-inverse-v24-4-0:#ffffff;
70
- --magritte-color-component-button-postfix-text-neutral-v24-4-0:#ABABAB;
71
- --magritte-color-component-button-postfix-text-inverse-v24-4-0:#ABABAB;
72
- --magritte-color-component-button-postfix-text-state-neutral-disabled-v24-4-0:#535353;
73
- --magritte-color-component-button-postfix-text-state-inverse-disabled-v24-4-0:#535353;
74
- --magritte-shadow-level-2-color-v24-4-0:#0000003d;
75
- --magritte-shadow-level-1-color-v24-4-0:#00000029;
76
- }
77
- .magritte-wrapper___7m9lC_3-0-2{
50
+ --magritte-color-component-button-background-neutral-v24-4-1:#ffffff;
51
+ --magritte-color-component-button-background-inverse-v24-4-1:#303030;
52
+ --magritte-color-component-button-background-state-neutral-disabled-v24-4-1:#303030;
53
+ --magritte-color-component-button-background-state-inverse-disabled-v24-4-1:#262626;
54
+ --magritte-color-component-button-background-state-neutral-hovered-v24-4-1:#F1F1F1;
55
+ --magritte-color-component-button-background-state-neutral-pressed-v24-4-1:#ffffff;
56
+ --magritte-color-component-button-background-state-neutral-focused-v24-4-1:#ffffff;
57
+ --magritte-color-component-button-background-state-inverse-hovered-v24-4-1:#3B3B3B;
58
+ --magritte-color-component-button-background-state-inverse-pressed-v24-4-1:#303030;
59
+ --magritte-color-component-button-background-state-inverse-focused-v24-4-1:#303030;
60
+ --magritte-color-component-button-text-neutral-v24-4-1:#000000;
61
+ --magritte-color-component-button-text-inverse-v24-4-1:#ffffff;
62
+ --magritte-color-component-button-text-state-neutral-disabled-v24-4-1:#848484;
63
+ --magritte-color-component-button-text-state-inverse-disabled-v24-4-1:#848484;
64
+ --magritte-color-component-button-icon-state-neutral-disabled-v24-4-1:#848484;
65
+ --magritte-color-component-button-icon-state-inverse-disabled-v24-4-1:#848484;
66
+ --magritte-color-component-button-icon-neutral-v24-4-1:#000000;
67
+ --magritte-color-component-button-icon-inverse-v24-4-1:#ffffff;
68
+ --magritte-color-component-button-loader-icon-neutral-v24-4-1:#000000;
69
+ --magritte-color-component-button-loader-icon-inverse-v24-4-1:#ffffff;
70
+ --magritte-color-component-button-postfix-text-neutral-v24-4-1:#ABABAB;
71
+ --magritte-color-component-button-postfix-text-inverse-v24-4-1:#ABABAB;
72
+ --magritte-color-component-button-postfix-text-state-neutral-disabled-v24-4-1:#535353;
73
+ --magritte-color-component-button-postfix-text-state-inverse-disabled-v24-4-1:#535353;
74
+ --magritte-shadow-level-2-color-v24-4-1:#0000003d;
75
+ --magritte-shadow-level-1-color-v24-4-1:#00000029;
76
+ }
77
+ .magritte-wrapper___7m9lC_3-0-3{
78
78
  display:inline-block;
79
79
  position:fixed;
80
80
  }
81
- .magritte-wrapper___7m9lC_3-0-2,
82
- .magritte-animation-timeout___NL8n0_3-0-2{
81
+ .magritte-wrapper___7m9lC_3-0-3,
82
+ .magritte-animation-timeout___NL8n0_3-0-3{
83
83
  --animation-duration:0;
84
84
  }
85
85
  @media (prefers-reduced-motion: no-preference){
86
- .magritte-wrapper___7m9lC_3-0-2,
87
- .magritte-animation-timeout___NL8n0_3-0-2{
88
- --animation-duration:var(--magritte-semantic-animation-time-s-duration-v24-4-0);
86
+ .magritte-wrapper___7m9lC_3-0-3,
87
+ .magritte-animation-timeout___NL8n0_3-0-3{
88
+ --animation-duration:var(--magritte-semantic-animation-time-s-duration-v24-4-1);
89
89
  }
90
90
  }
91
- .magritte-button___nL-Hn_3-0-2{
91
+ .magritte-button___nL-Hn_3-0-3{
92
92
  display:inline-block;
93
93
  padding:12px;
94
94
  border-radius:24px;
95
95
  transition-property:transform;
96
- transition-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v24-4-0);
97
- transition-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v24-4-0);
96
+ transition-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v24-4-1);
97
+ transition-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v24-4-1);
98
98
  }
99
- .magritte-button___nL-Hn_3-0-2:disabled,
100
- .magritte-button___nL-Hn_3-0-2[aria-disabled='true'],
101
- .magritte-button___nL-Hn_3-0-2.magritte-loading___C0oPZ_3-0-2{
99
+ .magritte-button___nL-Hn_3-0-3:disabled,
100
+ .magritte-button___nL-Hn_3-0-3[aria-disabled='true'],
101
+ .magritte-button___nL-Hn_3-0-3.magritte-loading___C0oPZ_3-0-3{
102
102
  pointer-events:none;
103
103
  cursor:not-allowed;
104
104
  }
105
- .magritte-button___nL-Hn_3-0-2:not(:disabled):active,
106
- .magritte-button___nL-Hn_3-0-2:not([aria-disabled='true']):active{
105
+ .magritte-button___nL-Hn_3-0-3:not(:disabled):active,
106
+ .magritte-button___nL-Hn_3-0-3:not([aria-disabled='true']):active{
107
107
  transform:scale(0.96);
108
- transition-duration:var(--magritte-semantic-animation-ease-in-out-100-duration-v24-4-0);
109
- transition-timing-function:var(--magritte-semantic-animation-ease-in-out-100-timing-function-v24-4-0);
108
+ transition-duration:var(--magritte-semantic-animation-ease-in-out-100-duration-v24-4-1);
109
+ transition-timing-function:var(--magritte-semantic-animation-ease-in-out-100-timing-function-v24-4-1);
110
110
  }
111
- .magritte-withIconAndLabel___Qa-lU_3-0-2{
111
+ .magritte-withIconAndLabel___Qa-lU_3-0-3{
112
112
  padding:12px 16px;
113
113
  }
114
- .magritte-right___3n0Rz_3-0-2{
114
+ .magritte-right___3n0Rz_3-0-3{
115
115
  right:16px;
116
116
  bottom:20px;
117
117
  }
118
118
  @media (min-width: 1020px){
119
- body.magritte-old-layout .magritte-right___3n0Rz_3-0-2{
119
+ body.magritte-old-layout .magritte-right___3n0Rz_3-0-3{
120
120
  right:36px;
121
121
  bottom:32px;
122
122
  }
123
123
  }
124
124
  @media (min-width: 1024px){
125
- body:not(.magritte-old-layout) .magritte-right___3n0Rz_3-0-2{
125
+ body:not(.magritte-old-layout) .magritte-right___3n0Rz_3-0-3{
126
126
  right:36px;
127
127
  bottom:32px;
128
128
  }
129
129
  }
130
- .magritte-right___3n0Rz_3-0-2 .magritte-content___JNpTZ_3-0-2{
130
+ .magritte-right___3n0Rz_3-0-3 .magritte-content___JNpTZ_3-0-3{
131
131
  justify-content:end;
132
132
  }
133
- .magritte-left___GnzU7_3-0-2{
133
+ .magritte-left___GnzU7_3-0-3{
134
134
  left:16px;
135
135
  bottom:20px;
136
136
  }
137
137
  @media (min-width: 1020px){
138
- body.magritte-old-layout .magritte-left___GnzU7_3-0-2{
138
+ body.magritte-old-layout .magritte-left___GnzU7_3-0-3{
139
139
  left:36px;
140
140
  bottom:32px;
141
141
  }
142
142
  }
143
143
  @media (min-width: 1024px){
144
- body:not(.magritte-old-layout) .magritte-left___GnzU7_3-0-2{
144
+ body:not(.magritte-old-layout) .magritte-left___GnzU7_3-0-3{
145
145
  left:36px;
146
146
  bottom:32px;
147
147
  }
148
148
  }
149
- .magritte-left___GnzU7_3-0-2 .magritte-content___JNpTZ_3-0-2{
149
+ .magritte-left___GnzU7_3-0-3 .magritte-content___JNpTZ_3-0-3{
150
150
  justify-content:start;
151
151
  }
152
- .magritte-center___MdA40_3-0-2{
152
+ .magritte-center___MdA40_3-0-3{
153
153
  left:50%;
154
154
  bottom:20px;
155
155
  transform:translateX(-50%);
156
156
  }
157
157
  @media (min-width: 1020px){
158
- body.magritte-old-layout .magritte-center___MdA40_3-0-2{
158
+ body.magritte-old-layout .magritte-center___MdA40_3-0-3{
159
159
  bottom:32px;
160
160
  }
161
161
  }
162
162
  @media (min-width: 1024px){
163
- body:not(.magritte-old-layout) .magritte-center___MdA40_3-0-2{
163
+ body:not(.magritte-old-layout) .magritte-center___MdA40_3-0-3{
164
164
  bottom:32px;
165
165
  }
166
166
  }
167
- .magritte-center___MdA40_3-0-2 .magritte-content___JNpTZ_3-0-2{
167
+ .magritte-center___MdA40_3-0-3 .magritte-content___JNpTZ_3-0-3{
168
168
  justify-content:space-between;
169
169
  }
170
- .magritte-postfix___r0EZ6_3-0-2{
170
+ .magritte-postfix___r0EZ6_3-0-3{
171
171
  padding:0 4px;
172
172
  }
173
- .magritte-icon___VpqJt_3-0-2{
173
+ .magritte-icon___VpqJt_3-0-3{
174
174
  margin-right:4px;
175
175
  }
176
- .magritte-textless___IbYgp_3-0-2 .magritte-icon___VpqJt_3-0-2{
176
+ .magritte-textless___IbYgp_3-0-3 .magritte-icon___VpqJt_3-0-3{
177
177
  margin:0;
178
178
  }
179
- .magritte-label___EPgvj_3-0-2{
179
+ .magritte-label___EPgvj_3-0-3{
180
180
  text-align:left;
181
181
  overflow:hidden;
182
182
  transition-property:padding;
183
183
  transition-duration:var(--animation-duration);
184
- transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-0);
184
+ transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-1);
185
185
  padding:0 4px;
186
186
  }
187
- .magritte-content___JNpTZ_3-0-2{
187
+ .magritte-content___JNpTZ_3-0-3{
188
188
  display:inline-grid;
189
189
  justify-content:flex-end;
190
190
  grid-template-columns:max-content 1fr;
191
191
  transition-property:grid-template-columns;
192
192
  min-height:24px;
193
193
  transition-duration:var(--animation-duration);
194
- transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-0);
194
+ transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-1);
195
195
  }
196
- .magritte-withPostfix___PmQAz_3-0-2 .magritte-content___JNpTZ_3-0-2{
196
+ .magritte-withPostfix___PmQAz_3-0-3 .magritte-content___JNpTZ_3-0-3{
197
197
  grid-template-columns:max-content 1fr max-content;
198
198
  }
199
- .magritte-hideLabel___K79XM_3-0-2 .magritte-content___JNpTZ_3-0-2{
199
+ .magritte-hideLabel___K79XM_3-0-3 .magritte-content___JNpTZ_3-0-3{
200
200
  grid-template-columns:max-content 0fr;
201
201
  }
202
- .magritte-hideLabel___K79XM_3-0-2 .magritte-label___EPgvj_3-0-2{
202
+ .magritte-hideLabel___K79XM_3-0-3 .magritte-label___EPgvj_3-0-3{
203
203
  padding:0;
204
204
  }
205
- .magritte-hideLabel___K79XM_3-0-2.magritte-withPostfix___PmQAz_3-0-2 .magritte-content___JNpTZ_3-0-2{
205
+ .magritte-hideLabel___K79XM_3-0-3.magritte-withPostfix___PmQAz_3-0-3 .magritte-content___JNpTZ_3-0-3{
206
206
  grid-template-columns:max-content 0fr max-content;
207
207
  }
208
- .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2).magritte-withIconAndLabel___Qa-lU_3-0-2{
208
+ .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3).magritte-withIconAndLabel___Qa-lU_3-0-3{
209
209
  padding:12px;
210
210
  }
211
- .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):not(.magritte-withPostfix___PmQAz_3-0-2) .magritte-icon___VpqJt_3-0-2{
211
+ .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):not(.magritte-withPostfix___PmQAz_3-0-3) .magritte-icon___VpqJt_3-0-3{
212
212
  margin:0;
213
213
  }
214
- .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2) .magritte-content___JNpTZ_3-0-2{
214
+ .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3) .magritte-content___JNpTZ_3-0-3{
215
215
  grid-template-columns:max-content 0fr;
216
216
  }
217
- .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2).magritte-withPostfix___PmQAz_3-0-2 .magritte-content___JNpTZ_3-0-2{
217
+ .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3).magritte-withPostfix___PmQAz_3-0-3 .magritte-content___JNpTZ_3-0-3{
218
218
  grid-template-columns:max-content 0fr max-content;
219
219
  }
220
- .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2) .magritte-label___EPgvj_3-0-2{
220
+ .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3) .magritte-label___EPgvj_3-0-3{
221
221
  padding:0;
222
222
  }
223
223
  @media (min-width: 1020px){
224
- body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']).magritte-withIconAndLabel___Qa-lU_3-0-2{
224
+ body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']).magritte-withIconAndLabel___Qa-lU_3-0-3{
225
225
  padding:12px 16px;
226
226
  }
227
- body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']) .magritte-icon___VpqJt_3-0-2{
227
+ body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']) .magritte-icon___VpqJt_3-0-3{
228
228
  margin-right:4px;
229
229
  }
230
- body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']) .magritte-content___JNpTZ_3-0-2{
230
+ body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']) .magritte-content___JNpTZ_3-0-3{
231
231
  grid-template-columns:max-content 1fr;
232
232
  }
233
- body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']).magritte-withPostfix___PmQAz_3-0-2 .magritte-content___JNpTZ_3-0-2{
233
+ body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']).magritte-withPostfix___PmQAz_3-0-3 .magritte-content___JNpTZ_3-0-3{
234
234
  grid-template-columns:max-content 1fr max-content;
235
235
  }
236
- body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']) .magritte-label___EPgvj_3-0-2{
236
+ body.magritte-old-layout .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']) .magritte-label___EPgvj_3-0-3{
237
237
  padding:0 4px;
238
238
  }
239
239
  }
240
240
  @media (min-width: 1024px){
241
- body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']).magritte-withIconAndLabel___Qa-lU_3-0-2{
241
+ body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']).magritte-withIconAndLabel___Qa-lU_3-0-3{
242
242
  padding:12px 16px;
243
243
  }
244
- body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']) .magritte-icon___VpqJt_3-0-2{
244
+ body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']) .magritte-icon___VpqJt_3-0-3{
245
245
  margin-right:4px;
246
246
  }
247
- body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']) .magritte-content___JNpTZ_3-0-2{
247
+ body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']) .magritte-content___JNpTZ_3-0-3{
248
248
  grid-template-columns:max-content 1fr;
249
249
  }
250
- body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']).magritte-withPostfix___PmQAz_3-0-2 .magritte-content___JNpTZ_3-0-2{
250
+ body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']).magritte-withPostfix___PmQAz_3-0-3 .magritte-content___JNpTZ_3-0-3{
251
251
  grid-template-columns:max-content 1fr max-content;
252
252
  }
253
- body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-2:not(.magritte-hideLabel___K79XM_3-0-2):hover:not(:disabled):not([aria-disabled='true']) .magritte-label___EPgvj_3-0-2{
253
+ body:not(.magritte-old-layout) .magritte-withLabelOnHover___1oktd_3-0-3:not(.magritte-hideLabel___K79XM_3-0-3):hover:not(:disabled):not([aria-disabled='true']) .magritte-label___EPgvj_3-0-3{
254
254
  padding:0 4px;
255
255
  }
256
256
  }
257
- .magritte-loading___C0oPZ_3-0-2 .magritte-postfix___r0EZ6_3-0-2,
258
- .magritte-loading___C0oPZ_3-0-2 .magritte-icon___VpqJt_3-0-2,
259
- .magritte-loading___C0oPZ_3-0-2 .magritte-label___EPgvj_3-0-2{
257
+ .magritte-loading___C0oPZ_3-0-3 .magritte-postfix___r0EZ6_3-0-3,
258
+ .magritte-loading___C0oPZ_3-0-3 .magritte-icon___VpqJt_3-0-3,
259
+ .magritte-loading___C0oPZ_3-0-3 .magritte-label___EPgvj_3-0-3{
260
260
  visibility:hidden;
261
261
  }
262
- .magritte-loader___EPezG_3-0-2{
262
+ .magritte-loader___EPezG_3-0-3{
263
263
  position:absolute;
264
264
  left:50%;
265
265
  top:50%;
@@ -267,231 +267,231 @@
267
267
  line-height:0;
268
268
  overflow:hidden;
269
269
  }
270
- .magritte-enter-animation___2sPz3_3-0-2{
270
+ .magritte-enter-animation___2sPz3_3-0-3{
271
271
  opacity:0;
272
272
  }
273
- .magritte-enter-animation-active___Lq9eq_3-0-2{
273
+ .magritte-enter-animation-active___Lq9eq_3-0-3{
274
274
  opacity:1;
275
275
  transition-property:opacity;
276
276
  transition-duration:var(--animation-duration);
277
- transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-0);
277
+ transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-1);
278
278
  }
279
- .magritte-exit-animation___h2-7a_3-0-2{
279
+ .magritte-exit-animation___h2-7a_3-0-3{
280
280
  opacity:1;
281
281
  }
282
- .magritte-exit-animation-active___w0F1a_3-0-2{
282
+ .magritte-exit-animation-active___w0F1a_3-0-3{
283
283
  opacity:0;
284
284
  transition-property:opacity;
285
285
  transition-duration:var(--animation-duration);
286
- transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-0);
286
+ transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-1);
287
287
  }
288
- .magritte-button_style-neutral___bPUwu_3-0-2{
289
- background:var(--magritte-color-component-button-background-neutral-v24-4-0);
290
- --magritte-ui-text-color-override:var(--magritte-color-component-button-text-neutral-v24-4-0);
291
- --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-neutral-v24-4-0);
292
- box-shadow:var(--magritte-shadow-level-2-x-v24-4-0) var(--magritte-shadow-level-2-y-v24-4-0) var(--magritte-shadow-level-2-blur-v24-4-0) var(--magritte-shadow-level-2-spread-v24-4-0) var(--magritte-shadow-level-2-color-v24-4-0);
293
- --magritte-ui-loader-color-override:var(--magritte-color-component-button-loader-icon-neutral-v24-4-0);
288
+ .magritte-button_style-neutral___bPUwu_3-0-3{
289
+ background:var(--magritte-color-component-button-background-neutral-v24-4-1);
290
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-text-neutral-v24-4-1);
291
+ --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-neutral-v24-4-1);
292
+ box-shadow:var(--magritte-shadow-level-2-x-v24-4-1) var(--magritte-shadow-level-2-y-v24-4-1) var(--magritte-shadow-level-2-blur-v24-4-1) var(--magritte-shadow-level-2-spread-v24-4-1) var(--magritte-shadow-level-2-color-v24-4-1);
293
+ --magritte-ui-loader-color-override:var(--magritte-color-component-button-loader-icon-neutral-v24-4-1);
294
294
  }
295
- .magritte-button_style-neutral___bPUwu_3-0-2 .magritte-postfix___r0EZ6_3-0-2{
296
- --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-neutral-v24-4-0);
295
+ .magritte-button_style-neutral___bPUwu_3-0-3 .magritte-postfix___r0EZ6_3-0-3{
296
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-neutral-v24-4-1);
297
297
  }
298
- .magritte-button_style-neutral___bPUwu_3-0-2.magritte-stackMode___RdOTJ_3-0-2{
298
+ .magritte-button_style-neutral___bPUwu_3-0-3.magritte-stackMode___RdOTJ_3-0-3{
299
299
  box-shadow:none;
300
300
  }
301
- .magritte-button_style-neutral___bPUwu_3-0-2.focus-visible{
302
- outline:4px solid var(--magritte-color-component-button-stroke-state-neutral-focused-accessible-v24-4-0);
303
- background:var(--magritte-color-component-button-background-state-neutral-focused-v24-4-0);
301
+ .magritte-button_style-neutral___bPUwu_3-0-3.focus-visible{
302
+ outline:4px solid var(--magritte-color-component-button-stroke-state-neutral-focused-accessible-v24-4-1);
303
+ background:var(--magritte-color-component-button-background-state-neutral-focused-v24-4-1);
304
304
  }
305
- .magritte-button_style-neutral___bPUwu_3-0-2:not(:disabled):active,
306
- .magritte-button_style-neutral___bPUwu_3-0-2:not([aria-disabled='true']):active{
307
- background:var(--magritte-color-component-button-background-state-neutral-pressed-v24-4-0);
305
+ .magritte-button_style-neutral___bPUwu_3-0-3:not(:disabled):active,
306
+ .magritte-button_style-neutral___bPUwu_3-0-3:not([aria-disabled='true']):active{
307
+ background:var(--magritte-color-component-button-background-state-neutral-pressed-v24-4-1);
308
308
  }
309
- .magritte-button_style-neutral___bPUwu_3-0-2:disabled,
310
- .magritte-button_style-neutral___bPUwu_3-0-2[aria-disabled='true']{
311
- background:var(--magritte-color-component-button-background-state-neutral-disabled-v24-4-0);
312
- --magritte-ui-text-color-override:var(--magritte-color-component-button-text-state-neutral-disabled-v24-4-0);
313
- --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-state-neutral-disabled-v24-4-0);
309
+ .magritte-button_style-neutral___bPUwu_3-0-3:disabled,
310
+ .magritte-button_style-neutral___bPUwu_3-0-3[aria-disabled='true']{
311
+ background:var(--magritte-color-component-button-background-state-neutral-disabled-v24-4-1);
312
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-text-state-neutral-disabled-v24-4-1);
313
+ --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-state-neutral-disabled-v24-4-1);
314
314
  }
315
- .magritte-button_style-neutral___bPUwu_3-0-2:disabled .magritte-postfix___r0EZ6_3-0-2,
316
- .magritte-button_style-neutral___bPUwu_3-0-2[aria-disabled='true'] .magritte-postfix___r0EZ6_3-0-2{
317
- --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-state-neutral-disabled-v24-4-0);
315
+ .magritte-button_style-neutral___bPUwu_3-0-3:disabled .magritte-postfix___r0EZ6_3-0-3,
316
+ .magritte-button_style-neutral___bPUwu_3-0-3[aria-disabled='true'] .magritte-postfix___r0EZ6_3-0-3{
317
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-state-neutral-disabled-v24-4-1);
318
318
  }
319
319
  @media (min-width: 1020px){
320
- body.magritte-old-layout .magritte-button_style-neutral___bPUwu_3-0-2:hover:not(:active):not(:disabled):not([aria-disabled='true']){
321
- background:var(--magritte-ui-flb-background-color-hovered-override, var(--magritte-color-component-button-background-state-neutral-hovered-v24-4-0));
320
+ body.magritte-old-layout .magritte-button_style-neutral___bPUwu_3-0-3:hover:not(:active):not(:disabled):not([aria-disabled='true']){
321
+ background:var(--magritte-ui-flb-background-color-hovered-override, var(--magritte-color-component-button-background-state-neutral-hovered-v24-4-1));
322
322
  }
323
323
  }
324
324
  @media (min-width: 1024px){
325
- body:not(.magritte-old-layout) .magritte-button_style-neutral___bPUwu_3-0-2:hover:not(:active):not(:disabled):not([aria-disabled='true']){
326
- background:var(--magritte-ui-flb-background-color-hovered-override, var(--magritte-color-component-button-background-state-neutral-hovered-v24-4-0));
325
+ body:not(.magritte-old-layout) .magritte-button_style-neutral___bPUwu_3-0-3:hover:not(:active):not(:disabled):not([aria-disabled='true']){
326
+ background:var(--magritte-ui-flb-background-color-hovered-override, var(--magritte-color-component-button-background-state-neutral-hovered-v24-4-1));
327
327
  }
328
328
  }
329
- .magritte-button_style-inverse___Xgf26_3-0-2{
330
- background:var(--magritte-color-component-button-background-inverse-v24-4-0);
331
- --magritte-ui-text-color-override:var(--magritte-color-component-button-text-inverse-v24-4-0);
332
- --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-inverse-v24-4-0);
333
- box-shadow:var(--magritte-shadow-level-1-x-v24-4-0) var(--magritte-shadow-level-1-y-v24-4-0) var(--magritte-shadow-level-1-blur-v24-4-0) var(--magritte-shadow-level-1-spread-v24-4-0) var(--magritte-shadow-level-1-color-v24-4-0);
334
- --magritte-ui-loader-color-override:var(--magritte-color-component-button-loader-icon-inverse-v24-4-0);
329
+ .magritte-button_style-inverse___Xgf26_3-0-3{
330
+ background:var(--magritte-color-component-button-background-inverse-v24-4-1);
331
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-text-inverse-v24-4-1);
332
+ --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-inverse-v24-4-1);
333
+ box-shadow:var(--magritte-shadow-level-1-x-v24-4-1) var(--magritte-shadow-level-1-y-v24-4-1) var(--magritte-shadow-level-1-blur-v24-4-1) var(--magritte-shadow-level-1-spread-v24-4-1) var(--magritte-shadow-level-1-color-v24-4-1);
334
+ --magritte-ui-loader-color-override:var(--magritte-color-component-button-loader-icon-inverse-v24-4-1);
335
335
  }
336
- .magritte-button_style-inverse___Xgf26_3-0-2 .magritte-postfix___r0EZ6_3-0-2{
337
- --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-inverse-v24-4-0);
336
+ .magritte-button_style-inverse___Xgf26_3-0-3 .magritte-postfix___r0EZ6_3-0-3{
337
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-inverse-v24-4-1);
338
338
  }
339
- .magritte-button_style-inverse___Xgf26_3-0-2.magritte-stackMode___RdOTJ_3-0-2{
339
+ .magritte-button_style-inverse___Xgf26_3-0-3.magritte-stackMode___RdOTJ_3-0-3{
340
340
  box-shadow:none;
341
341
  }
342
- .magritte-button_style-inverse___Xgf26_3-0-2.focus-visible{
343
- outline:4px solid var(--magritte-color-component-button-stroke-state-inverse-focused-accessible-v24-4-0);
344
- background:var(--magritte-color-component-button-background-state-inverse-focused-v24-4-0);
342
+ .magritte-button_style-inverse___Xgf26_3-0-3.focus-visible{
343
+ outline:4px solid var(--magritte-color-component-button-stroke-state-inverse-focused-accessible-v24-4-1);
344
+ background:var(--magritte-color-component-button-background-state-inverse-focused-v24-4-1);
345
345
  }
346
- .magritte-button_style-inverse___Xgf26_3-0-2:not(:disabled):active,
347
- .magritte-button_style-inverse___Xgf26_3-0-2:not([aria-disabled='true']):active{
348
- background:var(--magritte-color-component-button-background-state-inverse-pressed-v24-4-0);
346
+ .magritte-button_style-inverse___Xgf26_3-0-3:not(:disabled):active,
347
+ .magritte-button_style-inverse___Xgf26_3-0-3:not([aria-disabled='true']):active{
348
+ background:var(--magritte-color-component-button-background-state-inverse-pressed-v24-4-1);
349
349
  }
350
- .magritte-button_style-inverse___Xgf26_3-0-2:disabled,
351
- .magritte-button_style-inverse___Xgf26_3-0-2[aria-disabled='true']{
352
- background:var(--magritte-color-component-button-background-state-inverse-disabled-v24-4-0);
353
- --magritte-ui-text-color-override:var(--magritte-color-component-button-text-state-inverse-disabled-v24-4-0);
354
- --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-state-inverse-disabled-v24-4-0);
350
+ .magritte-button_style-inverse___Xgf26_3-0-3:disabled,
351
+ .magritte-button_style-inverse___Xgf26_3-0-3[aria-disabled='true']{
352
+ background:var(--magritte-color-component-button-background-state-inverse-disabled-v24-4-1);
353
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-text-state-inverse-disabled-v24-4-1);
354
+ --magritte-ui-icon-color-override:var(--magritte-color-component-button-icon-state-inverse-disabled-v24-4-1);
355
355
  }
356
- .magritte-button_style-inverse___Xgf26_3-0-2:disabled .magritte-postfix___r0EZ6_3-0-2,
357
- .magritte-button_style-inverse___Xgf26_3-0-2[aria-disabled='true'] .magritte-postfix___r0EZ6_3-0-2{
358
- --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-state-inverse-disabled-v24-4-0);
356
+ .magritte-button_style-inverse___Xgf26_3-0-3:disabled .magritte-postfix___r0EZ6_3-0-3,
357
+ .magritte-button_style-inverse___Xgf26_3-0-3[aria-disabled='true'] .magritte-postfix___r0EZ6_3-0-3{
358
+ --magritte-ui-text-color-override:var(--magritte-color-component-button-postfix-text-state-inverse-disabled-v24-4-1);
359
359
  }
360
360
  @media (min-width: 1020px){
361
- body.magritte-old-layout .magritte-button_style-inverse___Xgf26_3-0-2:hover:not(:active):not(:disabled):not([aria-disabled='true']){
362
- background:var(--magritte-ui-flb-background-color-hovered-override, var(--magritte-color-component-button-background-state-inverse-hovered-v24-4-0));
361
+ body.magritte-old-layout .magritte-button_style-inverse___Xgf26_3-0-3:hover:not(:active):not(:disabled):not([aria-disabled='true']){
362
+ background:var(--magritte-ui-flb-background-color-hovered-override, var(--magritte-color-component-button-background-state-inverse-hovered-v24-4-1));
363
363
  }
364
364
  }
365
365
  @media (min-width: 1024px){
366
- body:not(.magritte-old-layout) .magritte-button_style-inverse___Xgf26_3-0-2:hover:not(:active):not(:disabled):not([aria-disabled='true']){
367
- background:var(--magritte-ui-flb-background-color-hovered-override, var(--magritte-color-component-button-background-state-inverse-hovered-v24-4-0));
366
+ body:not(.magritte-old-layout) .magritte-button_style-inverse___Xgf26_3-0-3:hover:not(:active):not(:disabled):not([aria-disabled='true']){
367
+ background:var(--magritte-ui-flb-background-color-hovered-override, var(--magritte-color-component-button-background-state-inverse-hovered-v24-4-1));
368
368
  }
369
369
  }
370
370
 
371
371
  :root{
372
- --magritte-color-component-button-background-neutral-v24-4-0:#000000;
373
- --magritte-color-component-button-background-inverse-v24-4-0:#ffffff;
374
- --magritte-color-component-button-background-state-neutral-disabled-v24-4-0:#DCE3EB;
375
- --magritte-color-component-button-background-state-inverse-disabled-v24-4-0:#ffffff;
376
- --magritte-shadow-level-2-color-v24-4-0:#7090b03d;
377
- --magritte-shadow-level-2-x-v24-4-0:0px;
378
- --magritte-shadow-level-2-y-v24-4-0:8px;
379
- --magritte-shadow-level-2-blur-v24-4-0:16px;
380
- --magritte-shadow-level-2-spread-v24-4-0:0px;
381
- --magritte-shadow-level-1-color-v24-4-0:#7090b029;
382
- --magritte-shadow-level-1-x-v24-4-0:0px;
383
- --magritte-shadow-level-1-y-v24-4-0:4px;
384
- --magritte-shadow-level-1-blur-v24-4-0:12px;
385
- --magritte-shadow-level-1-spread-v24-4-0:0px;
372
+ --magritte-color-component-button-background-neutral-v24-4-1:#000000;
373
+ --magritte-color-component-button-background-inverse-v24-4-1:#ffffff;
374
+ --magritte-color-component-button-background-state-neutral-disabled-v24-4-1:#DCE3EB;
375
+ --magritte-color-component-button-background-state-inverse-disabled-v24-4-1:#ffffff;
376
+ --magritte-shadow-level-2-color-v24-4-1:#7090b03d;
377
+ --magritte-shadow-level-2-x-v24-4-1:0px;
378
+ --magritte-shadow-level-2-y-v24-4-1:8px;
379
+ --magritte-shadow-level-2-blur-v24-4-1:16px;
380
+ --magritte-shadow-level-2-spread-v24-4-1:0px;
381
+ --magritte-shadow-level-1-color-v24-4-1:#7090b029;
382
+ --magritte-shadow-level-1-x-v24-4-1:0px;
383
+ --magritte-shadow-level-1-y-v24-4-1:4px;
384
+ --magritte-shadow-level-1-blur-v24-4-1:12px;
385
+ --magritte-shadow-level-1-spread-v24-4-1:0px;
386
386
  }
387
387
 
388
388
  :root{
389
- --magritte-semantic-animation-time-s-duration-v24-4-0:200ms;
390
- --magritte-semantic-animation-ease-base-timing-function-v24-4-0:cubic-bezier(0.4, 0.24, 0, 1);
389
+ --magritte-semantic-animation-time-s-duration-v24-4-1:200ms;
390
+ --magritte-semantic-animation-ease-base-timing-function-v24-4-1:cubic-bezier(0.4, 0.24, 0, 1);
391
391
  }
392
392
 
393
393
  .magritte-night-theme{
394
- --magritte-color-component-button-background-neutral-v24-4-0:#ffffff;
395
- --magritte-color-component-button-background-inverse-v24-4-0:#303030;
396
- --magritte-color-component-button-background-state-neutral-disabled-v24-4-0:#303030;
397
- --magritte-color-component-button-background-state-inverse-disabled-v24-4-0:#262626;
398
- --magritte-shadow-level-2-color-v24-4-0:#0000003d;
399
- --magritte-shadow-level-1-color-v24-4-0:#00000029;
400
- }
401
- .magritte-stack___v7QhJ_3-0-2{
394
+ --magritte-color-component-button-background-neutral-v24-4-1:#ffffff;
395
+ --magritte-color-component-button-background-inverse-v24-4-1:#303030;
396
+ --magritte-color-component-button-background-state-neutral-disabled-v24-4-1:#303030;
397
+ --magritte-color-component-button-background-state-inverse-disabled-v24-4-1:#262626;
398
+ --magritte-shadow-level-2-color-v24-4-1:#0000003d;
399
+ --magritte-shadow-level-1-color-v24-4-1:#00000029;
400
+ }
401
+ .magritte-stack___v7QhJ_3-0-3{
402
402
  display:inline-flex;
403
403
  position:fixed;
404
404
  flex-direction:column;
405
405
  --animation-duration-floating-button-stack:0;
406
406
  }
407
407
  @media (prefers-reduced-motion: no-preference){
408
- .magritte-stack___v7QhJ_3-0-2{
409
- --animation-duration-floating-button-stack:var(--magritte-semantic-animation-time-s-duration-v24-4-0);
408
+ .magritte-stack___v7QhJ_3-0-3{
409
+ --animation-duration-floating-button-stack:var(--magritte-semantic-animation-time-s-duration-v24-4-1);
410
410
  }
411
411
  }
412
- .magritte-right___v4PFa_3-0-2{
412
+ .magritte-right___v4PFa_3-0-3{
413
413
  right:16px;
414
414
  bottom:20px;
415
415
  }
416
416
  @media (min-width: 1020px){
417
- body.magritte-old-layout .magritte-right___v4PFa_3-0-2{
417
+ body.magritte-old-layout .magritte-right___v4PFa_3-0-3{
418
418
  right:36px;
419
419
  bottom:32px;
420
420
  }
421
421
  }
422
422
  @media (min-width: 1024px){
423
- body:not(.magritte-old-layout) .magritte-right___v4PFa_3-0-2{
423
+ body:not(.magritte-old-layout) .magritte-right___v4PFa_3-0-3{
424
424
  right:36px;
425
425
  bottom:32px;
426
426
  }
427
427
  }
428
- .magritte-left___JXzpq_3-0-2{
428
+ .magritte-left___JXzpq_3-0-3{
429
429
  left:16px;
430
430
  bottom:20px;
431
431
  }
432
432
  @media (min-width: 1020px){
433
- body.magritte-old-layout .magritte-left___JXzpq_3-0-2{
433
+ body.magritte-old-layout .magritte-left___JXzpq_3-0-3{
434
434
  left:36px;
435
435
  bottom:32px;
436
436
  }
437
437
  }
438
438
  @media (min-width: 1024px){
439
- body:not(.magritte-old-layout) .magritte-left___JXzpq_3-0-2{
439
+ body:not(.magritte-old-layout) .magritte-left___JXzpq_3-0-3{
440
440
  left:36px;
441
441
  bottom:32px;
442
442
  }
443
443
  }
444
- .magritte-center___rV3kK_3-0-2{
444
+ .magritte-center___rV3kK_3-0-3{
445
445
  left:50%;
446
446
  bottom:20px;
447
447
  transform:translateX(-50%);
448
448
  }
449
449
  @media (min-width: 1020px){
450
- body.magritte-old-layout .magritte-center___rV3kK_3-0-2{
450
+ body.magritte-old-layout .magritte-center___rV3kK_3-0-3{
451
451
  bottom:32px;
452
452
  }
453
453
  }
454
454
  @media (min-width: 1024px){
455
- body:not(.magritte-old-layout) .magritte-center___rV3kK_3-0-2{
455
+ body:not(.magritte-old-layout) .magritte-center___rV3kK_3-0-3{
456
456
  bottom:32px;
457
457
  }
458
458
  }
459
- .magritte-up-button___M-Jgi_3-0-2{
459
+ .magritte-up-button___M-Jgi_3-0-3{
460
460
  --up-button-height:56px;
461
461
  }
462
462
  @media (min-width: 1020px){
463
- body.magritte-old-layout .magritte-up-button___M-Jgi_3-0-2{
463
+ body.magritte-old-layout .magritte-up-button___M-Jgi_3-0-3{
464
464
  --up-button-height:72px;
465
465
  }
466
466
  }
467
467
  @media (min-width: 1024px){
468
- body:not(.magritte-old-layout) .magritte-up-button___M-Jgi_3-0-2{
468
+ body:not(.magritte-old-layout) .magritte-up-button___M-Jgi_3-0-3{
469
469
  --up-button-height:72px;
470
470
  }
471
471
  }
472
- .magritte-enter-up-button-animation___-n3rG_3-0-2{
472
+ .magritte-enter-up-button-animation___-n3rG_3-0-3{
473
473
  opacity:0;
474
474
  height:0;
475
475
  }
476
- .magritte-enter-up-button-animation-active___8pejQ_3-0-2{
476
+ .magritte-enter-up-button-animation-active___8pejQ_3-0-3{
477
477
  transition-property:opacity, height;
478
478
  transition-duration:var(--animation-duration-floating-button-stack);
479
- transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-0);
479
+ transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-1);
480
480
  opacity:1;
481
481
  height:var(--up-button-height);
482
482
  }
483
- .magritte-exit-up-button-animation___80DEE_3-0-2{
483
+ .magritte-exit-up-button-animation___80DEE_3-0-3{
484
484
  opacity:1;
485
485
  height:var(--up-button-height);
486
486
  }
487
- .magritte-exit-up-button-animation-active___f1LjL_3-0-2{
487
+ .magritte-exit-up-button-animation-active___f1LjL_3-0-3{
488
488
  transition-property:opacity, height;
489
489
  transition-duration:var(--animation-duration-floating-button-stack);
490
- transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-0);
490
+ transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-1);
491
491
  opacity:0;
492
492
  height:0;
493
493
  }
494
- .magritte-floating-buttons___oi9Yx_3-0-2{
494
+ .magritte-floating-buttons___oi9Yx_3-0-3{
495
495
  display:flex;
496
496
  flex-direction:column;
497
497
  border-radius:40px;
@@ -500,74 +500,74 @@
500
500
  opacity:0;
501
501
  padding:0 4px;
502
502
  }
503
- .magritte-floating-buttons___oi9Yx_3-0-2.magritte-animated___z--5Y_3-0-2{
503
+ .magritte-floating-buttons___oi9Yx_3-0-3.magritte-animated___z--5Y_3-0-3{
504
504
  transition-property:opacity, margin-top, padding;
505
505
  transition-duration:var(--animation-duration-floating-button-stack);
506
- transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-0);
506
+ transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-1);
507
507
  }
508
- .magritte-floating-buttons___oi9Yx_3-0-2.magritte-visibled___hHvF6_3-0-2{
508
+ .magritte-floating-buttons___oi9Yx_3-0-3.magritte-visibled___hHvF6_3-0-3{
509
509
  margin-top:12px;
510
510
  padding:4px;
511
511
  opacity:1;
512
512
  }
513
513
  @media (min-width: 1020px){
514
- body.magritte-old-layout .magritte-floating-buttons___oi9Yx_3-0-2{
514
+ body.magritte-old-layout .magritte-floating-buttons___oi9Yx_3-0-3{
515
515
  padding:0 12px;
516
516
  }
517
- body.magritte-old-layout .magritte-floating-buttons___oi9Yx_3-0-2.magritte-visibled___hHvF6_3-0-2{
517
+ body.magritte-old-layout .magritte-floating-buttons___oi9Yx_3-0-3.magritte-visibled___hHvF6_3-0-3{
518
518
  padding:12px;
519
519
  }
520
520
  }
521
521
  @media (min-width: 1024px){
522
- body:not(.magritte-old-layout) .magritte-floating-buttons___oi9Yx_3-0-2{
522
+ body:not(.magritte-old-layout) .magritte-floating-buttons___oi9Yx_3-0-3{
523
523
  padding:0 12px;
524
524
  }
525
- body:not(.magritte-old-layout) .magritte-floating-buttons___oi9Yx_3-0-2.magritte-visibled___hHvF6_3-0-2{
525
+ body:not(.magritte-old-layout) .magritte-floating-buttons___oi9Yx_3-0-3.magritte-visibled___hHvF6_3-0-3{
526
526
  padding:12px;
527
527
  }
528
528
  }
529
- .magritte-floating-buttons_neutral___LCnTQ_3-0-2{
530
- background-color:var(--magritte-color-component-button-background-neutral-v24-4-0);
531
- box-shadow:var(--magritte-shadow-level-2-x-v24-4-0) var(--magritte-shadow-level-2-y-v24-4-0) var(--magritte-shadow-level-2-blur-v24-4-0) var(--magritte-shadow-level-2-spread-v24-4-0) var(--magritte-shadow-level-2-color-v24-4-0);
532
- --magritte-ui-flb-background-color-hovered-override:var(--magritte-color-component-button-background-neutral-v24-4-0);
533
- --magritte-ui-badge-border-color-override:var(--magritte-color-component-button-background-neutral-v24-4-0);
529
+ .magritte-floating-buttons_neutral___LCnTQ_3-0-3{
530
+ background-color:var(--magritte-color-component-button-background-neutral-v24-4-1);
531
+ box-shadow:var(--magritte-shadow-level-2-x-v24-4-1) var(--magritte-shadow-level-2-y-v24-4-1) var(--magritte-shadow-level-2-blur-v24-4-1) var(--magritte-shadow-level-2-spread-v24-4-1) var(--magritte-shadow-level-2-color-v24-4-1);
532
+ --magritte-ui-flb-background-color-hovered-override:var(--magritte-color-component-button-background-neutral-v24-4-1);
533
+ --magritte-ui-badge-border-color-override:var(--magritte-color-component-button-background-neutral-v24-4-1);
534
534
  }
535
- .magritte-floating-buttons_neutral___LCnTQ_3-0-2.magritte-disabled___XSSqS_3-0-2{
536
- background-color:var(--magritte-color-component-button-background-state-neutral-disabled-v24-4-0);
535
+ .magritte-floating-buttons_neutral___LCnTQ_3-0-3.magritte-disabled___XSSqS_3-0-3{
536
+ background-color:var(--magritte-color-component-button-background-state-neutral-disabled-v24-4-1);
537
537
  }
538
- .magritte-floating-buttons_inverse___xhm17_3-0-2{
539
- background-color:var(--magritte-color-component-button-background-inverse-v24-4-0);
540
- box-shadow:var(--magritte-shadow-level-1-x-v24-4-0) var(--magritte-shadow-level-1-y-v24-4-0) var(--magritte-shadow-level-1-blur-v24-4-0) var(--magritte-shadow-level-1-spread-v24-4-0) var(--magritte-shadow-level-1-color-v24-4-0);
541
- --magritte-ui-flb-background-color-hovered-override:var(--magritte-color-component-button-background-inverse-v24-4-0);
542
- --magritte-ui-badge-border-color-override:var(--magritte-color-component-button-background-inverse-v24-4-0);
538
+ .magritte-floating-buttons_inverse___xhm17_3-0-3{
539
+ background-color:var(--magritte-color-component-button-background-inverse-v24-4-1);
540
+ box-shadow:var(--magritte-shadow-level-1-x-v24-4-1) var(--magritte-shadow-level-1-y-v24-4-1) var(--magritte-shadow-level-1-blur-v24-4-1) var(--magritte-shadow-level-1-spread-v24-4-1) var(--magritte-shadow-level-1-color-v24-4-1);
541
+ --magritte-ui-flb-background-color-hovered-override:var(--magritte-color-component-button-background-inverse-v24-4-1);
542
+ --magritte-ui-badge-border-color-override:var(--magritte-color-component-button-background-inverse-v24-4-1);
543
543
  }
544
- .magritte-floating-buttons_inverse___xhm17_3-0-2.magritte-disabled___XSSqS_3-0-2{
545
- background-color:var(--magritte-color-component-button-background-state-inverse-disabled-v24-4-0);
544
+ .magritte-floating-buttons_inverse___xhm17_3-0-3.magritte-disabled___XSSqS_3-0-3{
545
+ background-color:var(--magritte-color-component-button-background-state-inverse-disabled-v24-4-1);
546
546
  }
547
- .magritte-floating-button-wrapper___HlTzE_3-0-2{
547
+ .magritte-floating-button-wrapper___HlTzE_3-0-3{
548
548
  overflow:hidden;
549
549
  padding:4px;
550
550
  margin:-4px;
551
551
  }
552
- .magritte-enter-floating-button-animation___nke2I_3-0-2{
552
+ .magritte-enter-floating-button-animation___nke2I_3-0-3{
553
553
  opacity:0;
554
554
  height:0;
555
555
  }
556
- .magritte-enter-floating-button-animation-active___AayrW_3-0-2{
556
+ .magritte-enter-floating-button-animation-active___AayrW_3-0-3{
557
557
  transition-property:opacity, height;
558
558
  transition-duration:var(--animation-duration-floating-button-stack);
559
- transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-0);
559
+ transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-1);
560
560
  opacity:1;
561
561
  height:48px;
562
562
  }
563
- .magritte-exit-floating-button-animation___dXSTW_3-0-2{
563
+ .magritte-exit-floating-button-animation___dXSTW_3-0-3{
564
564
  opacity:1;
565
565
  height:48px;
566
566
  }
567
- .magritte-exit-floating-button-animation-active___DhIfE_3-0-2{
567
+ .magritte-exit-floating-button-animation-active___DhIfE_3-0-3{
568
568
  transition-property:opacity, height;
569
569
  transition-duration:var(--animation-duration-floating-button-stack);
570
- transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-0);
570
+ transition-timing-function:var(--magritte-semantic-animation-ease-base-timing-function-v24-4-1);
571
571
  opacity:0;
572
572
  height:0;
573
573
  }
package/index.js CHANGED
@@ -14,7 +14,7 @@ import '@hh.ru/magritte-ui-loader';
14
14
  import '@hh.ru/magritte-ui-typography';
15
15
  import './FloatingButtonStackContext.js';
16
16
  import './FloatingButtonStackItem.js';
17
- import './floating-button-stack-D6EJ-Tml.js';
17
+ import './floating-button-stack-BbDROKE1.js';
18
18
  import './FloatingButtonStackItems.js';
19
19
  import './FloatingButtonStackUpButton.js';
20
20
  import '@hh.ru/magritte-ui-breakpoint';
package/index.mock.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.mock.js","sources":["../src/index.mock.ts"],"sourcesContent":["import { mockComponent } from '@hh.ru/magritte-ui-mock-component';\n\nexport * from '@hh.ru/magritte-ui-floating-button/types';\n\nconst staticProps = {\n Item: mockComponent('Item', undefined, {\n withChildren: true,\n }),\n};\n\nexport const FloatingButton = mockComponent('FloatingButton', staticProps, {\n withChildren: true,\n});\n\nexport const FloatingButtonStack = mockComponent('FloatingButtonStack', undefined, {\n withChildren: true,\n});\n"],"names":[],"mappings":";;AAIA,MAAM,WAAW,GAAG;AAChB,IAAA,IAAI,EAAE,aAAa,CAAC,MAAM,EAAE,SAAS,EAAE;AACnC,QAAA,YAAY,EAAE,IAAI;KACrB,CAAC;CACL,CAAC;MAEW,cAAc,GAAG,aAAa,CAAC,gBAAgB,EAAE,WAAW,EAAE;AACvE,IAAA,YAAY,EAAE,IAAI;AACrB,CAAA,EAAE;MAEU,mBAAmB,GAAG,aAAa,CAAC,qBAAqB,EAAE,SAAS,EAAE;AAC/E,IAAA,YAAY,EAAE,IAAI;AACrB,CAAA;;;;"}
1
+ {"version":3,"file":"index.mock.js","sources":["src/index.mock.ts"],"sourcesContent":["import { mockComponent } from '@hh.ru/magritte-ui-mock-component';\n\nexport * from '@hh.ru/magritte-ui-floating-button/types';\n\nconst staticProps = {\n Item: mockComponent('Item', undefined, {\n withChildren: true,\n }),\n};\n\nexport const FloatingButton = mockComponent('FloatingButton', staticProps, {\n withChildren: true,\n});\n\nexport const FloatingButtonStack = mockComponent('FloatingButtonStack', undefined, {\n withChildren: true,\n});\n"],"names":[],"mappings":";;AAIA,MAAM,WAAW,GAAG;AAChB,IAAA,IAAI,EAAE,aAAa,CAAC,MAAM,EAAE,SAAS,EAAE;AACnC,QAAA,YAAY,EAAE,IAAI;KACrB,CAAC;CACL,CAAC;MAEW,cAAc,GAAG,aAAa,CAAC,gBAAgB,EAAE,WAAW,EAAE;AACvE,IAAA,YAAY,EAAE,IAAI;AACrB,CAAA,EAAE;MAEU,mBAAmB,GAAG,aAAa,CAAC,qBAAqB,EAAE,SAAS,EAAE;AAC/E,IAAA,YAAY,EAAE,IAAI;AACrB,CAAA;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-floating-button",
3
- "version": "3.0.2",
3
+ "version": "3.0.3",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -19,16 +19,16 @@
19
19
  "watch": "yarn root:watch $(pwd)"
20
20
  },
21
21
  "dependencies": {
22
- "@hh.ru/magritte-common-is-server-env": "1.0.7",
23
- "@hh.ru/magritte-design-tokens": "24.4.0",
24
- "@hh.ru/magritte-types": "5.0.5",
25
- "@hh.ru/magritte-ui-badge": "4.0.5",
26
- "@hh.ru/magritte-ui-breakpoint": "6.0.6",
27
- "@hh.ru/magritte-ui-icon": "13.11.0",
28
- "@hh.ru/magritte-ui-layer": "3.2.1",
29
- "@hh.ru/magritte-ui-loader": "2.1.4",
30
- "@hh.ru/magritte-ui-mock-component": "1.1.6",
31
- "@hh.ru/magritte-ui-typography": "4.5.1"
22
+ "@hh.ru/magritte-common-is-server-env": "1.0.8",
23
+ "@hh.ru/magritte-design-tokens": "24.4.1",
24
+ "@hh.ru/magritte-types": "5.0.6",
25
+ "@hh.ru/magritte-ui-badge": "4.0.6",
26
+ "@hh.ru/magritte-ui-breakpoint": "6.0.7",
27
+ "@hh.ru/magritte-ui-icon": "13.11.1",
28
+ "@hh.ru/magritte-ui-layer": "3.2.2",
29
+ "@hh.ru/magritte-ui-loader": "2.1.5",
30
+ "@hh.ru/magritte-ui-mock-component": "1.1.7",
31
+ "@hh.ru/magritte-ui-typography": "4.5.2"
32
32
  },
33
33
  "peerDependencies": {
34
34
  "classnames": ">=2.3.2",
@@ -39,5 +39,5 @@
39
39
  "publishConfig": {
40
40
  "access": "public"
41
41
  },
42
- "gitHead": "7cea3ac4f7f947bba409d2fbc29284343113c4ba"
42
+ "gitHead": "ec7d56f576ca5581c2acb5010b53bbfb8da52962"
43
43
  }
@@ -1,5 +0,0 @@
1
- import './index.css';
2
- var styles = {"stack":"magritte-stack___v7QhJ_3-0-2","right":"magritte-right___v4PFa_3-0-2","left":"magritte-left___JXzpq_3-0-2","center":"magritte-center___rV3kK_3-0-2","up-button":"magritte-up-button___M-Jgi_3-0-2","upButton":"magritte-up-button___M-Jgi_3-0-2","enter-up-button-animation":"magritte-enter-up-button-animation___-n3rG_3-0-2","enterUpButtonAnimation":"magritte-enter-up-button-animation___-n3rG_3-0-2","enter-up-button-animation-active":"magritte-enter-up-button-animation-active___8pejQ_3-0-2","enterUpButtonAnimationActive":"magritte-enter-up-button-animation-active___8pejQ_3-0-2","exit-up-button-animation":"magritte-exit-up-button-animation___80DEE_3-0-2","exitUpButtonAnimation":"magritte-exit-up-button-animation___80DEE_3-0-2","exit-up-button-animation-active":"magritte-exit-up-button-animation-active___f1LjL_3-0-2","exitUpButtonAnimationActive":"magritte-exit-up-button-animation-active___f1LjL_3-0-2","floating-buttons":"magritte-floating-buttons___oi9Yx_3-0-2","floatingButtons":"magritte-floating-buttons___oi9Yx_3-0-2","animated":"magritte-animated___z--5Y_3-0-2","visibled":"magritte-visibled___hHvF6_3-0-2","floating-buttons_neutral":"magritte-floating-buttons_neutral___LCnTQ_3-0-2","floatingButtonsNeutral":"magritte-floating-buttons_neutral___LCnTQ_3-0-2","disabled":"magritte-disabled___XSSqS_3-0-2","floating-buttons_inverse":"magritte-floating-buttons_inverse___xhm17_3-0-2","floatingButtonsInverse":"magritte-floating-buttons_inverse___xhm17_3-0-2","floating-button-wrapper":"magritte-floating-button-wrapper___HlTzE_3-0-2","floatingButtonWrapper":"magritte-floating-button-wrapper___HlTzE_3-0-2","enter-floating-button-animation":"magritte-enter-floating-button-animation___nke2I_3-0-2","enterFloatingButtonAnimation":"magritte-enter-floating-button-animation___nke2I_3-0-2","enter-floating-button-animation-active":"magritte-enter-floating-button-animation-active___AayrW_3-0-2","enterFloatingButtonAnimationActive":"magritte-enter-floating-button-animation-active___AayrW_3-0-2","exit-floating-button-animation":"magritte-exit-floating-button-animation___dXSTW_3-0-2","exitFloatingButtonAnimation":"magritte-exit-floating-button-animation___dXSTW_3-0-2","exit-floating-button-animation-active":"magritte-exit-floating-button-animation-active___DhIfE_3-0-2","exitFloatingButtonAnimationActive":"magritte-exit-floating-button-animation-active___DhIfE_3-0-2"};
3
-
4
- export { styles as s };
5
- //# sourceMappingURL=floating-button-stack-D6EJ-Tml.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"floating-button-stack-D6EJ-Tml.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}