npm - @vibe/core - Versions diffs - 3.42.0 → 3.43.0 - Mend

@vibe/core 3.42.0 → 3.43.0

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

Files changed (735) hide show

package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import e from"classnames";import t,{useRef as n,useEffect as i,useCallback as r,useMemo as l}from"react";import s from"../../../Icon/Icon.js";import c from"../../../Tooltip/Tooltip.js";import a from"../../../../hooks/useIsOverflowing/useIsOverflowing.js";import{keyCodes as m}from"../../../../constants/keyCodes.js";import{getOptionId as p}from"../../helpers.js";import{withStaticProps as u}from"../../../../types/withStaticProps.js";import"../../../../utils/colors-vars-map.js";import{ComboboxOptionIconType as f}from"../ComboboxConstants.js";import{getTestId as d,ComponentDefaultTestId as v}from"../../../../tests/testIds.js";import b from"./ComboboxOption.module.scss.js";var y=u((function(u){var f=u.index,y=u.option,O=u.className,I=u.isActive,h=u.visualFocus,g=u.scrollRef,j=u.scrollOffset,T=void 0===j?100:j,C=u.onOptionClick,E=u.onOptionLeave,k=u.onOptionHover,N=u.optionLineHeight,S=u.shouldScrollWhenActive,w=void 0===S||S,x=u.optionRenderer,L=void 0===x?null:x,P=y.id,A=y.leftIcon,B=y.leftIconType,F=y.rightIcon,H=y.rightIconType,M=y.label,R=y.iconSize,_=void 0===R?18:R,z=y.disabled,D=y.selected,K=y.ariaLabel,V=y.belongToCategory,W=void 0!==V&&V,X=y.tooltipContent,q=n(null),G=n(),J=a({ref:G});i((function(){var o,e=q.current;h&&e&&w&&((null==g?void 0:g.current)&&e?g.current.scrollTop=e.offsetTop-T:null===(o=null==e?void 0:e.scrollIntoView)||void 0===o||o.call(e,{behaviour:"smooth"}))}),[q,h,w,g,T,W]);var Q=function(o,n,i){return"renderer"===n?o(e(b.optionIcon,i)):t.createElement(s,{className:e(b.optionIcon,i),iconType:"font",icon:o,iconSize:_,ignoreFocusStyle:!0})},U=r((function(o){z||C(o,f,y,!0)}),[f,y,C,z]),Y=r((function(o){z||E(o,f,y,!0)}),[f,y,E,z]),Z=r((function(o){z||k(o,f,y,!0)}),[f,y,k,z]),$=r((function(o){o.key!==m.ENTER&&o.key!==m.SPACE||C(o,f,y,!1)}),[C,f,y]);X||(X=J?M:null);var oo=l((function(){return L&&L(y)}),[L,y]),eo=t.createElement(t.Fragment,null,A&&Q(A,B,b.left),t.createElement("div",{ref:G,className:e(b.optionLabel)},M),F&&Q(F,H,""));return t.createElement(c,{content:X},t.createElement("div",{ref:q,key:P||M,"aria-level":W?2:1,"aria-selected":I,"aria-label":K||M,id:p(P,f),"data-testid":d(v.COMBOBOX_OPTION,f),onMouseEnter:Z,onClick:U,onKeyDown:$,onMouseLeave:Y,className:e(b.comboboxOption,O,o(o(o(o({},b.disabled,z),b.selected,D),b.active,I),b.activeOutline,h)),style:{height:N}},oo||eo))}),{iconTypes:f});export{y as default};
+import{defineProperty as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import e from"classnames";import t,{useRef as n,useEffect as i,useCallback as r,useMemo as l}from"react";import s from"../../../Icon/Icon.js";import c from"../../../Tooltip/Tooltip.js";import a from"../../../../hooks/useIsOverflowing/useIsOverflowing.js";import{keyCodes as m}from"../../../../constants/keyCodes.js";import"../../../../constants/sizes.js";import{getOptionId as p}from"../../helpers.js";import{withStaticProps as u}from"../../../../types/withStaticProps.js";import"../../../../utils/colors-vars-map.js";import{ComboboxOptionIconType as f}from"../ComboboxConstants.js";import{getTestId as d,ComponentDefaultTestId as v}from"../../../../tests/testIds.js";import b from"./ComboboxOption.module.scss.js";var y=u((function(u){var f=u.index,y=u.option,O=u.className,I=u.isActive,h=u.visualFocus,j=u.scrollRef,g=u.scrollOffset,T=void 0===g?100:g,C=u.onOptionClick,E=u.onOptionLeave,k=u.onOptionHover,N=u.optionLineHeight,S=u.shouldScrollWhenActive,w=void 0===S||S,x=u.optionRenderer,L=void 0===x?null:x,P=y.id,z=y.leftIcon,A=y.leftIconType,B=y.rightIcon,F=y.rightIconType,H=y.label,M=y.iconSize,R=void 0===M?18:M,_=y.disabled,D=y.selected,K=y.ariaLabel,V=y.belongToCategory,W=void 0!==V&&V,X=y.tooltipContent,q=n(null),G=n(),J=a({ref:G});i((function(){var o,e=q.current;h&&e&&w&&((null==j?void 0:j.current)&&e?j.current.scrollTop=e.offsetTop-T:null===(o=null==e?void 0:e.scrollIntoView)||void 0===o||o.call(e,{behaviour:"smooth"}))}),[q,h,w,j,T,W]);var Q=function(o,n,i){return"renderer"===n?o(e(b.optionIcon,i)):t.createElement(s,{className:e(b.optionIcon,i),iconType:"font",icon:o,iconSize:R,ignoreFocusStyle:!0})},U=r((function(o){_||C(o,f,y,!0)}),[f,y,C,_]),Y=r((function(o){_||E(o,f,y,!0)}),[f,y,E,_]),Z=r((function(o){_||k(o,f,y,!0)}),[f,y,k,_]),$=r((function(o){o.key!==m.ENTER&&o.key!==m.SPACE||C(o,f,y,!1)}),[C,f,y]);X||(X=J?H:null);var oo=l((function(){return L&&L(y)}),[L,y]),eo=t.createElement(t.Fragment,null,z&&Q(z,A,b.left),t.createElement("div",{ref:G,className:e(b.optionLabel)},H),B&&Q(B,F,""));return t.createElement(c,{content:X},t.createElement("div",{ref:q,key:P||H,"aria-level":W?2:1,"aria-selected":I,"aria-label":K||H,id:p(P,f),"data-testid":d(v.COMBOBOX_OPTION,f),onMouseEnter:Z,onClick:U,onKeyDown:$,onMouseLeave:Y,className:e(b.comboboxOption,O,o(o(o(o({},b.disabled,_),b.selected,D),b.active,I),b.activeOutline,h)),style:{height:N}},oo||eo))}),{iconTypes:f});export{y as default};
 //# sourceMappingURL=ComboboxOption.js.map

package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboboxOption.js","sources":["../../../../../../src/components/Combobox/components/ComboboxOption/ComboboxOption.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { RefObject, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport Icon from \"../../../Icon/Icon\";\nimport Tooltip from \"../../../Tooltip/Tooltip\";\nimport useIsOverflowing from \"../../../../hooks/useIsOverflowing/useIsOverflowing\";\nimport { keyCodes } from \"../../../../constants~~/keyCodes~~\";\nimport { getOptionId } from \"../../helpers\";\nimport { SubIcon, withStaticProps } from \"../../../../types\";\nimport {\n ComboboxOptionIconType as ComboboxOptionIconTypeEnum,\n IComboboxOption,\n IComboboxOptionEvents\n} from \"../ComboboxConstants\";\nimport { ComboboxOptionIconType } from \"../../Combobox.types\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport styles from \"./ComboboxOption.module.scss\";\n\nexport interface ComboboxOptionProps extends IComboboxOptionEvents {\n /*\n The index of the option in the list.\n /\n index?: number;\n /\n The option data containing label, icons, and other properties.\n /\n option?: IComboboxOption;\n /\n Class name applied to the option element.\n /\n className?: string;\n /\n If true, the option is currently active.\n /\n isActive?: boolean;\n /\n If true, the option has visual focus.\n /\n visualFocus?: boolean;\n /\n A reference to the scroll container.\n /\n scrollRef?: RefObject<HTMLElement>;\n /\n The amount of offset when scrolling to the active item.\n /\n scrollOffset?: number;\n /\n The height of each option.\n /\n optionLineHeight?: number;\n /\n If true, scrolls to the active option when it is selected.\n /\n shouldScrollWhenActive?: boolean;\n /\n Custom renderer for the option content.\n */\n optionRenderer?: (option: IComboboxOption) => JSX.Element;\n}\n\nconst ComboboxOption: ~~React.FC<ComboboxOptionProps> & { iconTypes?: typeof ComboboxOptionIconTypeEnum }~~ = ({\n index,\n option,\n className,\n isActive,\n visualFocus,\n scrollRef,\n scrollOffset = 100,\n onOptionClick,\n onOptionLeave,\n onOptionHover,\n optionLineHeight,\n shouldScrollWhenActive = true,\n optionRenderer = null\n}) => {\n const {\n id,\n leftIcon,\n leftIconType,\n rightIcon,\n rightIconType,\n label,\n iconSize = 18,\n disabled,\n selected,\n ariaLabel,\n belongToCategory = false\n } = option;\n let { tooltipContent } = option;\n\n const ref = useRef(null);\n const labelRef = useRef();\n\n const isOptionOverflowing = useIsOverflowing({ ref: labelRef });\n\n useEffect(() => {\n const element = ref.current;\n if (visualFocus && element && shouldScrollWhenActive) {\n if (scrollRef?.current && element) {\n // not supported with virtualized atm, need their scrollRef (element with overflow-y auto that has the scroll)\n scrollRef.current.scrollTop = element.offsetTop - scrollOffset;\n } else {\n element?.scrollIntoView?.({ behaviour: \"smooth\" });\n }\n }\n }, [ref, visualFocus, shouldScrollWhenActive, scrollRef, scrollOffset, belongToCategory]);\n\n const renderIcon = (\n icon: SubIcon \| ((className: string) => JSX.Element),\n iconType: ComboboxOptionIconType,\n className: string\n ) => {\n if (iconType === \"renderer\") {\n return (icon as (className: string) => JSX.Element)(cx(styles.optionIcon, className));\n }\n\n return (\n <Icon\n className={cx(styles.optionIcon, className)}\n iconType=\"font\"\n icon={icon as SubIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n );\n };\n\n const onClick = useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n onOptionClick(event, index, option, true);\n },\n [index, option, onOptionClick, disabled]\n );\n\n const onMouseLeave = useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n onOptionLeave(event, index, option, true);\n },\n [index, option, onOptionLeave, disabled]\n );\n\n const onMouseEnter = useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n onOptionHover(event, index, option, true);\n },\n [index, option, onOptionHover, disabled]\n );\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === keyCodes.ENTER \|\| event.key === keyCodes.SPACE) {\n onOptionClick(event, index, option, false);\n }\n },\n [onOptionClick, index, option]\n );\n if (!tooltipContent) {\n tooltipContent = isOptionOverflowing ? label : null;\n }\n\n const optionRendererValue = useMemo(() => optionRenderer && optionRenderer(option), [optionRenderer, option]);\n\n const optionValue = (\n <>\n {leftIcon && renderIcon(leftIcon, leftIconType, styles.left)}\n <div ref={labelRef} className={cx(styles.optionLabel)}>\n {label}\n </div>\n {rightIcon && renderIcon(rightIcon, rightIconType, \"\")}\n </>\n );\n\n return (\n <Tooltip content={tooltipContent}>\n <div\n ref={ref}\n key={id \|\| label}\n aria-level={belongToCategory ? 2 : 1}\n aria-selected={isActive}\n aria-label={ariaLabel \|\| label}\n id={getOptionId(id, index)}\n data-testid={getTestId(ComponentDefaultTestId.COMBOBOX_OPTION, index)}\n onMouseEnter={onMouseEnter}\n onClick={onClick}\n onKeyDown={onKeyDown}\n onMouseLeave={onMouseLeave}\n className={cx(styles.comboboxOption, className, {\n [styles.disabled]: disabled,\n [styles.selected]: selected,\n [styles.active]: isActive,\n [styles.activeOutline]: visualFocus\n })}\n style={{ height: optionLineHeight }}\n >\n {optionRendererValue \|\| optionValue}\n </div>\n </Tooltip>\n );\n};\n\nexport default withStaticProps(ComboboxOption, { iconTypes: ComboboxOptionIconTypeEnum });\n"],"names":["withStaticProps","_ref","index","option","className","isActive","visualFocus","scrollRef","_ref$scrollOffset","scrollOffset","onOptionClick","onOptionLeave","onOptionHover","optionLineHeight","_ref$shouldScrollWhen","shouldScrollWhenActive","_ref$optionRenderer","optionRenderer","id","leftIcon","leftIconType","rightIcon","rightIconType","label","_option$iconSize","iconSize","disabled","selected","ariaLabel","_option$belongToCateg","belongToCategory","tooltipContent","ref","useRef","labelRef","isOptionOverflowing","useIsOverflowing","useEffect","element","current","scrollTop","offsetTop","_a","scrollIntoView","call","behaviour","renderIcon","icon","iconType","cx","styles","optionIcon","React","createElement","Icon","ignoreFocusStyle","onClick","useCallback","event","onMouseLeave","onMouseEnter","onKeyDown","key","keyCodes","ENTER","SPACE","optionRendererValue","useMemo","optionValue","Fragment","left","optionLabel","Tooltip","content","getOptionId","getTestId","ComponentDefaultTestId","COMBOBOX_OPTION","comboboxOption","_defineProperty","active","activeOutline","style","height","iconTypes","ComboboxOptionIconTypeEnum"],"mappings":"~~0vBA4DA~~,~~IA+IeA~~,EAAAA,~~GA/I2F~~,~~SAAtFC~~,~~GAcf~~,~~IAbHC~~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~~GAE~~+C,~~CAAEgB~~,UAAWC"}
1	+ {"version":3,"file":"ComboboxOption.js","sources":["../../../../../../src/components/Combobox/components/ComboboxOption/ComboboxOption.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { RefObject, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport Icon from \"../../../Icon/Icon\";\nimport Tooltip from \"../../../Tooltip/Tooltip\";\nimport useIsOverflowing from \"../../../../hooks/useIsOverflowing/useIsOverflowing\";\nimport { keyCodes } from \"../../../../constants\";\nimport { getOptionId } from \"../../helpers\";\nimport { SubIcon, withStaticProps } from \"../../../../types\";\nimport {\n ComboboxOptionIconType as ComboboxOptionIconTypeEnum,\n IComboboxOption,\n IComboboxOptionEvents\n} from \"../ComboboxConstants\";\nimport { ComboboxOptionIconType } from \"../../Combobox.types\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport styles from \"./ComboboxOption.module.scss\";\n\nexport interface ComboboxOptionProps extends IComboboxOptionEvents {\n /*\n The index of the option in the list.\n /\n index?: number;\n /\n The option data containing label, icons, and other properties.\n /\n option?: IComboboxOption;\n /\n Class name applied to the option element.\n /\n className?: string;\n /\n If true, the option is currently active.\n /\n isActive?: boolean;\n /\n If true, the option has visual focus.\n /\n visualFocus?: boolean;\n /\n A reference to the scroll container.\n /\n scrollRef?: RefObject<HTMLElement>;\n /\n The amount of offset when scrolling to the active item.\n /\n scrollOffset?: number;\n /\n The height of each option.\n /\n optionLineHeight?: number;\n /\n If true, scrolls to the active option when it is selected.\n /\n shouldScrollWhenActive?: boolean;\n /\n Custom renderer for the option content.\n */\n optionRenderer?: (option: IComboboxOption) => JSX.Element;\n}\n\nconst ComboboxOption = ({\n index,\n option,\n className,\n isActive,\n visualFocus,\n scrollRef,\n scrollOffset = 100,\n onOptionClick,\n onOptionLeave,\n onOptionHover,\n optionLineHeight,\n shouldScrollWhenActive = true,\n optionRenderer = null\n}: ComboboxOptionProps) => {\n const {\n id,\n leftIcon,\n leftIconType,\n rightIcon,\n rightIconType,\n label,\n iconSize = 18,\n disabled,\n selected,\n ariaLabel,\n belongToCategory = false\n } = option;\n let { tooltipContent } = option;\n\n const ref = useRef(null);\n const labelRef = useRef();\n\n const isOptionOverflowing = useIsOverflowing({ ref: labelRef });\n\n useEffect(() => {\n const element = ref.current;\n if (visualFocus && element && shouldScrollWhenActive) {\n if (scrollRef?.current && element) {\n // not supported with virtualized atm, need their scrollRef (element with overflow-y auto that has the scroll)\n scrollRef.current.scrollTop = element.offsetTop - scrollOffset;\n } else {\n element?.scrollIntoView?.({ behaviour: \"smooth\" });\n }\n }\n }, [ref, visualFocus, shouldScrollWhenActive, scrollRef, scrollOffset, belongToCategory]);\n\n const renderIcon = (\n icon: SubIcon \| ((className: string) => JSX.Element),\n iconType: ComboboxOptionIconType,\n className: string\n ) => {\n if (iconType === \"renderer\") {\n return (icon as (className: string) => JSX.Element)(cx(styles.optionIcon, className));\n }\n\n return (\n <Icon\n className={cx(styles.optionIcon, className)}\n iconType=\"font\"\n icon={icon as SubIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n );\n };\n\n const onClick = useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n onOptionClick(event, index, option, true);\n },\n [index, option, onOptionClick, disabled]\n );\n\n const onMouseLeave = useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n onOptionLeave(event, index, option, true);\n },\n [index, option, onOptionLeave, disabled]\n );\n\n const onMouseEnter = useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n onOptionHover(event, index, option, true);\n },\n [index, option, onOptionHover, disabled]\n );\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === keyCodes.ENTER \|\| event.key === keyCodes.SPACE) {\n onOptionClick(event, index, option, false);\n }\n },\n [onOptionClick, index, option]\n );\n if (!tooltipContent) {\n tooltipContent = isOptionOverflowing ? label : null;\n }\n\n const optionRendererValue = useMemo(() => optionRenderer && optionRenderer(option), [optionRenderer, option]);\n\n const optionValue = (\n <>\n {leftIcon && renderIcon(leftIcon, leftIconType, styles.left)}\n <div ref={labelRef} className={cx(styles.optionLabel)}>\n {label}\n </div>\n {rightIcon && renderIcon(rightIcon, rightIconType, \"\")}\n </>\n );\n\n return (\n <Tooltip content={tooltipContent}>\n <div\n ref={ref}\n key={id \|\| label}\n aria-level={belongToCategory ? 2 : 1}\n aria-selected={isActive}\n aria-label={ariaLabel \|\| label}\n id={getOptionId(id, index)}\n data-testid={getTestId(ComponentDefaultTestId.COMBOBOX_OPTION, index)}\n onMouseEnter={onMouseEnter}\n onClick={onClick}\n onKeyDown={onKeyDown}\n onMouseLeave={onMouseLeave}\n className={cx(styles.comboboxOption, className, {\n [styles.disabled]: disabled,\n [styles.selected]: selected,\n [styles.active]: isActive,\n [styles.activeOutline]: visualFocus\n })}\n style={{ height: optionLineHeight }}\n >\n {optionRendererValue \|\| optionValue}\n </div>\n </Tooltip>\n );\n};\n\ninterface ComboboxOptionStaticProps {\n iconTypes: typeof ComboboxOptionIconTypeEnum;\n}\n\nexport default withStaticProps<ComboboxOptionProps, ComboboxOptionStaticProps>(ComboboxOption, {\n iconTypes: ComboboxOptionIconTypeEnum\n});\n"],"names":["withStaticProps","_ref","index","option","className","isActive","visualFocus","scrollRef","_ref$scrollOffset","scrollOffset","onOptionClick","onOptionLeave","onOptionHover","optionLineHeight","_ref$shouldScrollWhen","shouldScrollWhenActive","_ref$optionRenderer","optionRenderer","id","leftIcon","leftIconType","rightIcon","rightIconType","label","_option$iconSize","iconSize","disabled","selected","ariaLabel","_option$belongToCateg","belongToCategory","tooltipContent","ref","useRef","labelRef","isOptionOverflowing","useIsOverflowing","useEffect","element","current","scrollTop","offsetTop","_a","scrollIntoView","call","behaviour","renderIcon","icon","iconType","cx","styles","optionIcon","React","createElement","Icon","ignoreFocusStyle","onClick","useCallback","event","onMouseLeave","onMouseEnter","onKeyDown","key","keyCodes","ENTER","SPACE","optionRendererValue","useMemo","optionValue","Fragment","left","optionLabel","Tooltip","content","getOptionId","getTestId","ComponentDefaultTestId","COMBOBOX_OPTION","comboboxOption","_defineProperty","active","activeOutline","style","height","iconTypes","ComboboxOptionIconTypeEnum"],"mappings":"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"}

package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var o={comboboxOption:"comboboxOption_e3afb63611",disabled:"disabled_917cb7bd0f",selected:"selected_910d561039",active:"active_1b09c73f02",activeOutline:"activeOutline_054cd616ce",optionLabel:"optionLabel_24beba88e3",optionIcon:"optionIcon_d428786481",left:"left_37f08eaf8c"};!function(o){const e="s_id-cc5db5fd586e_3_41_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=o)}(".comboboxOption_e3afb63611 {\n  padding: 8px;\n  width: 100%;\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n  cursor: pointer;\n  user-select: none;\n}\n\n.comboboxOption_e3afb63611.disabled_917cb7bd0f {\n  cursor: not-allowed;\n  border-color: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n}\n\n.comboboxOption_e3afb63611.disabled_917cb7bd0f:hover {\n  background-color: transparent;\n}\n\n.comboboxOption_e3afb63611.selected_910d561039 {\n  background-color: var(--primary-selected-color);\n}\n\n.comboboxOption_e3afb63611:hover:not(.disabled_917cb7bd0f):not(.selected_910d561039),\n.comboboxOption_e3afb63611.active_1b09c73f02 {\n  color: var(--primary-text-color);\n  background-color: var(--primary-background-hover-color);\n  position: relative;\n}\n\n.comboboxOption_e3afb63611.activeOutline_054cd616ce {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n  background-color: var(--secondary-background-color);\n}\n\n.comboboxOption_e3afb63611 .optionLabel_24beba88e3 {\n  flex: 1 1 auto;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comboboxOption_e3afb63611 .optionIcon_d428786481 {\n  flex: 0 0 auto;\n}\n\n.comboboxOption_e3afb63611 .optionIcon_d428786481.left_37f08eaf8c {\n  margin-right: 4px;\n}");export{o as default};
+var o={comboboxOption:"comboboxOption_a8442a8d98",disabled:"disabled_373f15f801",selected:"selected_9512d7a5cc",active:"active_2050488942",activeOutline:"activeOutline_0b84ae64db",optionLabel:"optionLabel_b2f5e64d95",optionIcon:"optionIcon_9dbbfc4ce4",left:"left_f417fcb468"};!function(o){const n="s_id-cc5db5fd586e_3_42_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,e.firstChild?e.insertBefore(a,e.firstChild):e.appendChild(a),a.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=o)}(".comboboxOption_a8442a8d98 {\n  padding: 8px;\n  width: 100%;\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n  cursor: pointer;\n  user-select: none;\n}\n\n.comboboxOption_a8442a8d98.disabled_373f15f801 {\n  cursor: not-allowed;\n  border-color: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n}\n\n.comboboxOption_a8442a8d98.disabled_373f15f801:hover {\n  background-color: transparent;\n}\n\n.comboboxOption_a8442a8d98.selected_9512d7a5cc {\n  background-color: var(--primary-selected-color);\n}\n\n.comboboxOption_a8442a8d98:hover:not(.disabled_373f15f801):not(.selected_9512d7a5cc),\n.comboboxOption_a8442a8d98.active_2050488942 {\n  color: var(--primary-text-color);\n  background-color: var(--primary-background-hover-color);\n  position: relative;\n}\n\n.comboboxOption_a8442a8d98.activeOutline_0b84ae64db {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n  background-color: var(--secondary-background-color);\n}\n\n.comboboxOption_a8442a8d98 .optionLabel_b2f5e64d95 {\n  flex: 1 1 auto;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comboboxOption_a8442a8d98 .optionIcon_9dbbfc4ce4 {\n  flex: 0 0 auto;\n}\n\n.comboboxOption_a8442a8d98 .optionIcon_9dbbfc4ce4.left_f417fcb468 {\n  margin-right: 4px;\n}");export{o as default};
 //# sourceMappingURL=ComboboxOption.module.scss.js.map

package/dist/src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={stickyCategoryHeader:"stickyCategoryHeader_854d1c2efb"};!function(e){const t="s_id-f549b49034f1_3_41_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".stickyCategoryHeader_854d1c2efb {\n  position: absolute;\n  z-index: 10;\n  width: calc(100% - 12px);\n  background-color: var(--primary-background-color);\n  padding-block: 10px var(--spacing-xs);\n  display: flex;\n  align-items: center;\n}");export{e as default};
+var e={stickyCategoryHeader:"stickyCategoryHeader_fe7ac3ebaa"};!function(e){const t="s_id-f549b49034f1_3_42_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,a.firstChild?a.insertBefore(n,a.firstChild):a.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".stickyCategoryHeader_fe7ac3ebaa {\n  position: absolute;\n  z-index: 10;\n  width: calc(100% - 12px);\n  background-color: var(--primary-background-color);\n  padding-block: 10px var(--spacing-xs);\n  display: flex;\n  align-items: center;\n}");export{e as default};
 //# sourceMappingURL=StickyCategoryHeader.module.scss.js.map

package/dist/src/components/Counter/Counter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Counter.js","sources":["../../../../src/components/Counter/Counter.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport ~~VibeComponentProps from \"../../types/VibeComponentProps\";\nimport~~ useEventListener from \"../../hooks/useEventListener\";\nimport useAfterFirstRender from \"../../hooks/useAfterFirstRender\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport {\n CounterColor as CounterColorEnum,\n CounterSize as CounterSizeEnum,\n CounterType as CounterTypeEnum\n} from \"./CounterConstants\";\nimport { CounterColor, CounterSize, CounterType } from \"./Counter.types\";\nimport { withStaticProps } from \"../../types\";\nimport styles from \"./Counter.module.scss\";\n\nexport interface CounterProps extends VibeComponentProps {\n /*\n The ID of the element describing the counter.\n /\n ariaLabeledBy?: string;\n /\n Class name applied to the counter element.\n /\n counterClassName?: string;\n /\n The numeric value displayed in the counter.\n /\n count?: number;\n /\n The label of the counter for accessibility.\n /\n ariaLabel?: string;\n /\n The size of the counter.\n /\n size?: CounterSize;\n /\n The visual style of the counter.\n /\n kind?: CounterType;\n /\n The color of the counter.\n /\n color?: CounterColor;\n /\n The maximum number of digits displayed before truncation.\n /\n maxDigits?: number;\n /\n Text prepended to the counter value.\n /\n prefix?: string;\n /\n Callback fired when the counter is clicked.\n /\n onMouseDown?: (event: React.MouseEvent<HTMLSpanElement>) => void;\n /\n If true, disables counter animations.\n /\n noAnimation?: boolean;\n}\n\nconst Counter: ~~React.FC<CounterProps> & {\n sizes?: typeof CounterSizeEnum;\n colors?: typeof CounterColorEnum;\n kinds?: typeof CounterTypeEnum;\n}~~ = ({\n className,\n counterClassName,\n count = 0,\n size = \"large\",\n kind = \"fill\",\n color = \"primary\",\n maxDigits = 3,\n ariaLabeledBy = \"\",\n ariaLabel = \"\",\n id = \"\",\n prefix = \"\",\n onMouseDown = NOOP,\n noAnimation = false,\n \"data-testid\": dataTestId\n}: CounterProps) => {\n const [countChangeAnimationState, setCountChangeAnimationState] = useState(false);\n\n const ref = useRef<HTMLDivElement>(null);\n\n const setCountChangedAnimationActive = useCallback(() => {\n setCountChangeAnimationState(true);\n }, [setCountChangeAnimationState]);\n\n const setCountChangedAnimationNotActive = useCallback(() => {\n setCountChangeAnimationState(false);\n }, [setCountChangeAnimationState]);\n\n useEventListener({\n eventName: \"animationend\",\n callback: setCountChangedAnimationNotActive,\n ref\n });\n\n const isAfterFirstRender = useAfterFirstRender();\n\n useEffect(() => {\n if (isAfterFirstRender.current) {\n setCountChangedAnimationActive();\n }\n }, [count, isAfterFirstRender, setCountChangedAnimationActive]);\n\n useEffect(() => {\n if (maxDigits <= 0) {\n console.error(\"Max digits must be a positive number\");\n }\n }, [maxDigits]);\n\n const classNames = useMemo(() => {\n return cx(\n styles.counter,\n getStyle(styles, camelCase(\"size-\" + size)),\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.withAnimation]: countChangeAnimationState\n },\n counterClassName\n );\n }, [size, kind, color, countChangeAnimationState, counterClassName]);\n\n const counterId = \"counter\" + (id ? `-${id}` : \"\");\n const countText = count?.toString().length > maxDigits ? `${10 * maxDigits - 1}+` : String(count);\n const counter = (\n <span id={counterId} data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.COUNTER, id)}>\n {prefix + countText}\n </span>\n );\n\n return (\n <span\n className={className}\n aria-label={`${ariaLabel} ${countText}`}\n aria-labelledby={ariaLabeledBy}\n onMouseDown={onMouseDown}\n >\n <div className={classNames} aria-label={countText} ref={ref}>\n {noAnimation ? (\n counter\n ) : (\n <SwitchTransition mode=\"out-in\">\n <CSSTransition\n key={countText}\n classNames={{\n enter: styles.fadeEnter,\n enterActive: styles.fadeEnterActive,\n exit: styles.fadeExit,\n exitActive: styles.fadeExitActive\n }}\n // @ts-expect-error @definitelyTyped typings expecting a single parameter for some reason when the function passed here is called with two parameters\n // See https://github.com/reactjs/react-transition-group/blob/c89f807067b32eea6f68fd6c622190d88ced82e2/src/Transition.js#L522-L534\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n >\n <span id={counterId} data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.COUNTER, id)}>\n {prefix + countText}\n </span>\n </CSSTransition>\n </SwitchTransition>\n )}\n </div>\n </span>\n );\n};\n\nexport default withStaticProps(Counter, {\n sizes: CounterSizeEnum,\n colors: CounterColorEnum,\n kinds: CounterTypeEnum\n});\n"],"names":["withStaticProps","_ref","className","counterClassName","_ref$count","count","_ref$size","size","_ref$kind","kind","_ref$color","color","_ref$maxDigits","maxDigits","_ref$ariaLabeledBy","ariaLabeledBy","_ref$ariaLabel","ariaLabel","_ref$id","id","_ref$prefix","prefix","_ref$onMouseDown","onMouseDown","NOOP","_ref$noAnimation","noAnimation","dataTestId","_useState","useState","_useState2","_slicedToArray","countChangeAnimationState","setCountChangeAnimationState","ref","useRef","setCountChangedAnimationActive","useCallback","setCountChangedAnimationNotActive","useEventListener","eventName","callback","isAfterFirstRender","useAfterFirstRender","useEffect","current","console","error","classNames","useMemo","cx","styles","counter","getStyle","camelCase","_defineProperty","withAnimation","counterId","concat","countText","length","Math","pow","String","React","createElement","getTestId","ComponentDefaultTestId","COUNTER","SwitchTransition","mode","CSSTransition","key","enter","fadeEnter","enterActive","fadeEnterActive","exit","fadeExit","exitActive","fadeExitActive","addEndListener","node","done","addEventListener","sizes","CounterSizeEnum","colors","CounterColorEnum","kinds","CounterTypeEnum"],"mappings":"~~22BAkEA~~,~~IA8GeA~~,EAAAA,~~GA1GX~~,~~SAJSC~~,~~GAmBM~~,IAdjBC,EAASD,EAATC,UACAC,EAAgBF,EAAhBE,iBAAgBC,EAAAH,EAChBI,MAAAA,OAAQ,IAAHD,EAAG,EAACA,EAAAE,EAAAL,EACTM,KAAAA,OAAO,IAAHD,EAAG,QAAOA,EAAAE,EAAAP,EACdQ,KAAAA,OAAO,IAAHD,EAAG,OAAMA,EAAAE,EAAAT,EACbU,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,EAAAX,EACjBY,UAAAA,OAAY,IAAHD,EAAG,EAACA,EAAAE,EAAAb,EACbc,cAAAA,OAAgB,IAAHD,EAAG,GAAEA,EAAAE,EAAAf,EAClBgB,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAjB,EACdkB,GAAAA,OAAK,IAAHD,EAAG,GAAEA,EAAAE,EAAAnB,EACPoB,OAAAA,OAAS,IAAHD,EAAG,GAAEA,EAAAE,EAAArB,EACXsB,YAAAA,OAAcC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAxB,EAClByB,YAAAA,OAAc,IAAHD,GAAQA,EACJE,EAAU1B,EAAzB,eAEA2B,EAAkEC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAA1EI,EAAyBF,EAAA,GAAEG,EAA4BH,EAAA,GAExDI,EAAMC,EAAuB,MAE7BC,EAAiCC,GAAY,WACjDJ,GAA6B,EAC/B,GAAG,CAACA,IAEEK,EAAoCD,GAAY,WACpDJ,GAA6B,EAC/B,GAAG,CAACA,IAEJM,EAAiB,CACfC,UAAW,eACXC,SAAUH,EACVJ,IAAAA,IAGF,IAAMQ,EAAqBC,IAE3BC,GAAU,WACJF,EAAmBG,SACrBT,GAEH,GAAE,CAAC/B,EAAOqC,EAAoBN,IAE/BQ,GAAU,WACJ/B,EAAa,GACfiC,QAAQC,MAAM,uCAElB,GAAG,CAAClC,IAEJ,IAAMmC,EAAaC,GAAQ,WACzB,OAAOC,EACLC,EAAOC,QACPC,EAASF,EAAQG,EAAU,QAAU/C,IACrC8C,EAASF,EAAQG,EAAU,QAAU7C,IACrC4C,EAASF,EAAQG,EAAU,SAAW3C,IAAO4C,EAAA,CAAA,EAE1CJ,EAAOK,cAAgBxB,GAE1B7B,EAEJ,GAAG,CAACI,EAAME,EAAME,EAAOqB,EAA2B7B,IAE5CsD,GAAY,WAAatC,EAAEuC,IAAAA,OAAOvC,GAAO,IACzCwC,IAAYtD,aAAK,GAALA,MAAkBuD,QAAS/C,EAAS,GAAA6C,OAAMG,KAAAC,IAAA,GAAMjD,GAAY,OAAcR,EAAP0D,GAC/EX,GACJY,EAAMC,cAAA,OAAA,CAAA9C,GAAIsC,GAAS,cAAe9B,GAAcuC,EAAUC,EAAuBC,QAASjD,IACvFE,EAASsC,IAId,OACEK,EACEC,cAAA,OAAA,CAAA/D,UAAWA,yBACIe,OAASyC,OAAIC,IACX,kBAAA5C,EACjBQ,YAAaA,GAEbyC,EAAKC,cAAA,MAAA,CAAA/D,UAAW8C,EAAwB,aAAAW,GAAWzB,IAAKA,GACrDR,EACC0B,GAEAY,EAAAC,cAACI,EAAgB,CAACC,KAAK,UACrBN,EAAAC,cAACM,EACC,CAAAC,IAAKb,GACLX,WAAY,CACVyB,MAAOtB,EAAOuB,UACdC,YAAaxB,EAAOyB,gBACpBC,KAAM1B,EAAO2B,SACbC,WAAY5B,EAAO6B,gBAIrBC,eAAgB,SAACC,EAAmBC,GAClCD,EAAKE,iBAAiB,gBAAiBD,GAAM,EAC/C,GAEAnB,EAAMC,cAAA,OAAA,CAAA9C,GAAIsC,GAAwB,cAAA9B,GAAcuC,EAAUC,EAAuBC,QAASjD,IACvFE,EAASsC,OAQ1B,~~GAEwC~~,~~CACtC0B~~,MAAOC,EACPC,OAAQC,EACRC,MAAOC"}
1	+ {"version":3,"file":"Counter.js","sources":["../../../../src/components/Counter/Counter.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport useEventListener from \"../../hooks/useEventListener\";\nimport useAfterFirstRender from \"../../hooks/useAfterFirstRender\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport {\n CounterColor as CounterColorEnum,\n CounterSize as CounterSizeEnum,\n CounterType as CounterTypeEnum\n} from \"./CounterConstants\";\nimport { CounterColor, CounterSize, CounterType } from \"./Counter.types\";\nimport { VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./Counter.module.scss\";\n\nexport interface CounterProps extends VibeComponentProps {\n /*\n The ID of the element describing the counter.\n /\n ariaLabeledBy?: string;\n /\n Class name applied to the counter element.\n /\n counterClassName?: string;\n /\n The numeric value displayed in the counter.\n /\n count?: number;\n /\n The label of the counter for accessibility.\n /\n ariaLabel?: string;\n /\n The size of the counter.\n /\n size?: CounterSize;\n /\n The visual style of the counter.\n /\n kind?: CounterType;\n /\n The color of the counter.\n /\n color?: CounterColor;\n /\n The maximum number of digits displayed before truncation.\n /\n maxDigits?: number;\n /\n Text prepended to the counter value.\n /\n prefix?: string;\n /\n Callback fired when the counter is clicked.\n /\n onMouseDown?: (event: React.MouseEvent<HTMLSpanElement>) => void;\n /\n If true, disables counter animations.\n /\n noAnimation?: boolean;\n}\n\nconst Counter = ({\n className,\n counterClassName,\n count = 0,\n size = \"large\",\n kind = \"fill\",\n color = \"primary\",\n maxDigits = 3,\n ariaLabeledBy = \"\",\n ariaLabel = \"\",\n id = \"\",\n prefix = \"\",\n onMouseDown = NOOP,\n noAnimation = false,\n \"data-testid\": dataTestId\n}: CounterProps) => {\n const [countChangeAnimationState, setCountChangeAnimationState] = useState(false);\n\n const ref = useRef<HTMLDivElement>(null);\n\n const setCountChangedAnimationActive = useCallback(() => {\n setCountChangeAnimationState(true);\n }, [setCountChangeAnimationState]);\n\n const setCountChangedAnimationNotActive = useCallback(() => {\n setCountChangeAnimationState(false);\n }, [setCountChangeAnimationState]);\n\n useEventListener({\n eventName: \"animationend\",\n callback: setCountChangedAnimationNotActive,\n ref\n });\n\n const isAfterFirstRender = useAfterFirstRender();\n\n useEffect(() => {\n if (isAfterFirstRender.current) {\n setCountChangedAnimationActive();\n }\n }, [count, isAfterFirstRender, setCountChangedAnimationActive]);\n\n useEffect(() => {\n if (maxDigits <= 0) {\n console.error(\"Max digits must be a positive number\");\n }\n }, [maxDigits]);\n\n const classNames = useMemo(() => {\n return cx(\n styles.counter,\n getStyle(styles, camelCase(\"size-\" + size)),\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.withAnimation]: countChangeAnimationState\n },\n counterClassName\n );\n }, [size, kind, color, countChangeAnimationState, counterClassName]);\n\n const counterId = \"counter\" + (id ? `-${id}` : \"\");\n const countText = count?.toString().length > maxDigits ? `${10 * maxDigits - 1}+` : String(count);\n const counter = (\n <span id={counterId} data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.COUNTER, id)}>\n {prefix + countText}\n </span>\n );\n\n return (\n <span\n className={className}\n aria-label={`${ariaLabel} ${countText}`}\n aria-labelledby={ariaLabeledBy}\n onMouseDown={onMouseDown}\n >\n <div className={classNames} aria-label={countText} ref={ref}>\n {noAnimation ? (\n counter\n ) : (\n <SwitchTransition mode=\"out-in\">\n <CSSTransition\n key={countText}\n classNames={{\n enter: styles.fadeEnter,\n enterActive: styles.fadeEnterActive,\n exit: styles.fadeExit,\n exitActive: styles.fadeExitActive\n }}\n // @ts-expect-error @definitelyTyped typings expecting a single parameter for some reason when the function passed here is called with two parameters\n // See https://github.com/reactjs/react-transition-group/blob/c89f807067b32eea6f68fd6c622190d88ced82e2/src/Transition.js#L522-L534\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n >\n <span id={counterId} data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.COUNTER, id)}>\n {prefix + countText}\n </span>\n </CSSTransition>\n </SwitchTransition>\n )}\n </div>\n </span>\n );\n};\n\ninterface CounterStaticProps {\n sizes: typeof CounterSizeEnum;\n colors: typeof CounterColorEnum;\n kinds: typeof CounterTypeEnum;\n}\n\nexport default withStaticProps<CounterProps, CounterStaticProps>(Counter, {\n sizes: CounterSizeEnum,\n colors: CounterColorEnum,\n kinds: CounterTypeEnum\n});\n"],"names":["withStaticProps","_ref","className","counterClassName","_ref$count","count","_ref$size","size","_ref$kind","kind","_ref$color","color","_ref$maxDigits","maxDigits","_ref$ariaLabeledBy","ariaLabeledBy","_ref$ariaLabel","ariaLabel","_ref$id","id","_ref$prefix","prefix","_ref$onMouseDown","onMouseDown","NOOP","_ref$noAnimation","noAnimation","dataTestId","_useState","useState","_useState2","_slicedToArray","countChangeAnimationState","setCountChangeAnimationState","ref","useRef","setCountChangedAnimationActive","useCallback","setCountChangedAnimationNotActive","useEventListener","eventName","callback","isAfterFirstRender","useAfterFirstRender","useEffect","current","console","error","classNames","useMemo","cx","styles","counter","getStyle","camelCase","_defineProperty","withAnimation","counterId","concat","countText","length","Math","pow","String","React","createElement","getTestId","ComponentDefaultTestId","COUNTER","SwitchTransition","mode","CSSTransition","key","enter","fadeEnter","enterActive","fadeEnterActive","exit","fadeExit","exitActive","fadeExitActive","addEndListener","node","done","addEventListener","sizes","CounterSizeEnum","colors","CounterColorEnum","kinds","CounterTypeEnum"],"mappings":"22BAiEA,IAgHeA,EAAAA,GAhHC,SAAHC,GAeM,IAdjBC,EAASD,EAATC,UACAC,EAAgBF,EAAhBE,iBAAgBC,EAAAH,EAChBI,MAAAA,OAAQ,IAAHD,EAAG,EAACA,EAAAE,EAAAL,EACTM,KAAAA,OAAO,IAAHD,EAAG,QAAOA,EAAAE,EAAAP,EACdQ,KAAAA,OAAO,IAAHD,EAAG,OAAMA,EAAAE,EAAAT,EACbU,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,EAAAX,EACjBY,UAAAA,OAAY,IAAHD,EAAG,EAACA,EAAAE,EAAAb,EACbc,cAAAA,OAAgB,IAAHD,EAAG,GAAEA,EAAAE,EAAAf,EAClBgB,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAjB,EACdkB,GAAAA,OAAK,IAAHD,EAAG,GAAEA,EAAAE,EAAAnB,EACPoB,OAAAA,OAAS,IAAHD,EAAG,GAAEA,EAAAE,EAAArB,EACXsB,YAAAA,OAAcC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAxB,EAClByB,YAAAA,OAAc,IAAHD,GAAQA,EACJE,EAAU1B,EAAzB,eAEA2B,EAAkEC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAA1EI,EAAyBF,EAAA,GAAEG,EAA4BH,EAAA,GAExDI,EAAMC,EAAuB,MAE7BC,EAAiCC,GAAY,WACjDJ,GAA6B,EAC/B,GAAG,CAACA,IAEEK,EAAoCD,GAAY,WACpDJ,GAA6B,EAC/B,GAAG,CAACA,IAEJM,EAAiB,CACfC,UAAW,eACXC,SAAUH,EACVJ,IAAAA,IAGF,IAAMQ,EAAqBC,IAE3BC,GAAU,WACJF,EAAmBG,SACrBT,GAEH,GAAE,CAAC/B,EAAOqC,EAAoBN,IAE/BQ,GAAU,WACJ/B,EAAa,GACfiC,QAAQC,MAAM,uCAElB,GAAG,CAAClC,IAEJ,IAAMmC,EAAaC,GAAQ,WACzB,OAAOC,EACLC,EAAOC,QACPC,EAASF,EAAQG,EAAU,QAAU/C,IACrC8C,EAASF,EAAQG,EAAU,QAAU7C,IACrC4C,EAASF,EAAQG,EAAU,SAAW3C,IAAO4C,EAAA,CAAA,EAE1CJ,EAAOK,cAAgBxB,GAE1B7B,EAEJ,GAAG,CAACI,EAAME,EAAME,EAAOqB,EAA2B7B,IAE5CsD,GAAY,WAAatC,EAAEuC,IAAAA,OAAOvC,GAAO,IACzCwC,IAAYtD,aAAK,GAALA,MAAkBuD,QAAS/C,EAAS,GAAA6C,OAAMG,KAAAC,IAAA,GAAMjD,GAAY,OAAcR,EAAP0D,GAC/EX,GACJY,EAAMC,cAAA,OAAA,CAAA9C,GAAIsC,GAAS,cAAe9B,GAAcuC,EAAUC,EAAuBC,QAASjD,IACvFE,EAASsC,IAId,OACEK,EACEC,cAAA,OAAA,CAAA/D,UAAWA,yBACIe,OAASyC,OAAIC,IACX,kBAAA5C,EACjBQ,YAAaA,GAEbyC,EAAKC,cAAA,MAAA,CAAA/D,UAAW8C,EAAwB,aAAAW,GAAWzB,IAAKA,GACrDR,EACC0B,GAEAY,EAAAC,cAACI,EAAgB,CAACC,KAAK,UACrBN,EAAAC,cAACM,EACC,CAAAC,IAAKb,GACLX,WAAY,CACVyB,MAAOtB,EAAOuB,UACdC,YAAaxB,EAAOyB,gBACpBC,KAAM1B,EAAO2B,SACbC,WAAY5B,EAAO6B,gBAIrBC,eAAgB,SAACC,EAAmBC,GAClCD,EAAKE,iBAAiB,gBAAiBD,GAAM,EAC/C,GAEAnB,EAAMC,cAAA,OAAA,CAAA9C,GAAIsC,GAAwB,cAAA9B,GAAcuC,EAAUC,EAAuBC,QAASjD,IACvFE,EAASsC,OAQ1B,GAQ0E,CACxE0B,MAAOC,EACPC,OAAQC,EACRC,MAAOC"}

package/dist/src/components/Counter/Counter.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={counter:"counter_cfa9d7f880",withAnimation:"withAnimation_9626e4abf4",counterPopElastic:"counterPopElastic_56a0801bb4",sizeXs:"sizeXs_bf0e09133b",sizeSmall:"sizeSmall_599fefdefb",sizeLarge:"sizeLarge_c967d280aa",kindFill:"kindFill_d173626315",colorPrimary:"colorPrimary_229471cd0f",colorDark:"colorDark_3440f1a032",colorNegative:"colorNegative_63ba671f4e",colorLight:"colorLight_d0436beda4",kindLine:"kindLine_2c95421704",fadeEnter:"fadeEnter_92652ee631",fadeEnterActive:"fadeEnterActive_803a7884fa",fadeExit:"fadeExit_2932da440f",fadeExitActive:"fadeExitActive_1ef191d044","counter-pop-elastic":"counter-pop-elastic_95712e244e"};!function(n){const o="s_id-51f4f5079107_3_41_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+o))return;const t=document.createElement("style");t.id=o,e.firstChild?e.insertBefore(t,e.firstChild):e.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}(".counter_cfa9d7f880 {\n  display: inline-flex;\n  justify-content: center;\n  border-radius: 30px;\n  overflow: hidden;\n  transform-origin: center;\n}\n@keyframes counter-pop-elastic_95712e244e {\n  0% {\n    transform: scale(1);\n  }\n  33% {\n    transform: scale(1.2);\n  }\n  66% {\n    transform: scale(0.9);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n.withAnimation_9626e4abf4 {\n  animation: counterPopElastic_56a0801bb4 var(--motion-expressive-short);\n}\n.sizeXs_bf0e09133b {\n  font: var(--font-text3-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  min-width: 18px;\n  line-height: 18px;\n  padding: 0 var(--spacing-small);\n}\n.sizeSmall_599fefdefb {\n  font: var(--font-text2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  min-width: 18px;\n  line-height: 18px;\n  padding: 0 var(--spacing-small);\n}\n.sizeLarge_c967d280aa {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  min-width: 24px;\n  padding: 2px var(--spacing-small);\n}\n.kindFill_d173626315.colorPrimary_229471cd0f {\n  color: var(--fixed-light-color);\n  background-color: var(--primary-color);\n}\n.kindFill_d173626315.colorDark_3440f1a032 {\n  color: var(--text-color-on-inverted);\n  background-color: var(--inverted-color-background);\n}\n.kindFill_d173626315.colorNegative_63ba671f4e {\n  color: var(--fixed-light-color);\n  background-color: var(--negative-color);\n}\n.kindFill_d173626315.colorLight_d0436beda4 {\n  color: var(--primary-text-color);\n  background-color: var(--ui-background-color);\n}\n.kindLine_2c95421704 {\n  box-shadow: 0 0 0 1px currentColor inset;\n}\n.kindLine_2c95421704.colorPrimary_229471cd0f {\n  color: var(--primary-color);\n}\n.kindLine_2c95421704.colorDark_3440f1a032 {\n  color: var(--inverted-color-background);\n}\n.kindLine_2c95421704.colorNegative_63ba671f4e {\n  color: var(--negative-color);\n}\n.kindLine_2c95421704.colorLight_d0436beda4 {\n  color: var(--primary-text-color);\n  box-shadow: 0 0 0 1px var(--ui-background-color) inset !important;\n}\n/* New number enters */\n.fadeEnter_92652ee631 {\n  opacity: 0;\n  transform: translateY(15px);\n}\n.fadeEnterActive_803a7884fa {\n  position: relative;\n  opacity: 1;\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n  transform: translateY(0);\n}\n/* Old number exits */\n.fadeExit_2932da440f {\n  position: relative;\n  opacity: 1;\n  transform: translateY(0);\n}\n.fadeExitActive_1ef191d044 {\n  position: relative;\n  opacity: 0;\n  transform: translateY(-15px);\n  transition: transform var(--motion-productive-long) var(--motion-timing-exit), opacity var(--motion-productive-short);\n}");export{n as default};
+var n={counter:"counter_6849d51e79",withAnimation:"withAnimation_6a3493acc3",counterPopElastic:"counterPopElastic_00236834b0",sizeXs:"sizeXs_5d6764bbd8",sizeSmall:"sizeSmall_3d4bae8546",sizeLarge:"sizeLarge_839d0c74a2",kindFill:"kindFill_6507bda468",colorPrimary:"colorPrimary_6965626ceb",colorDark:"colorDark_fba91d5720",colorNegative:"colorNegative_809156e295",colorLight:"colorLight_6f19dc5a2d",kindLine:"kindLine_64f525b867",fadeEnter:"fadeEnter_5b52fff540",fadeEnterActive:"fadeEnterActive_e5a132489d",fadeExit:"fadeExit_ce5c4cc50f",fadeExitActive:"fadeExitActive_21990aaaee","counter-pop-elastic":"counter-pop-elastic_481c255385"};!function(n){const o="s_id-51f4f5079107_3_42_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+o))return;const e=document.createElement("style");e.id=o,t.firstChild?t.insertBefore(e,t.firstChild):t.appendChild(e),e.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}(".counter_6849d51e79 {\n  display: inline-flex;\n  justify-content: center;\n  border-radius: 30px;\n  overflow: hidden;\n  transform-origin: center;\n}\n@keyframes counter-pop-elastic_481c255385 {\n  0% {\n    transform: scale(1);\n  }\n  33% {\n    transform: scale(1.2);\n  }\n  66% {\n    transform: scale(0.9);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n.withAnimation_6a3493acc3 {\n  animation: counterPopElastic_00236834b0 var(--motion-expressive-short);\n}\n.sizeXs_5d6764bbd8 {\n  font: var(--font-text3-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  min-width: 18px;\n  line-height: 18px;\n  padding: 0 var(--spacing-small);\n}\n.sizeSmall_3d4bae8546 {\n  font: var(--font-text2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  min-width: 18px;\n  line-height: 18px;\n  padding: 0 var(--spacing-small);\n}\n.sizeLarge_839d0c74a2 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  min-width: 24px;\n  padding: 2px var(--spacing-small);\n}\n.kindFill_6507bda468.colorPrimary_6965626ceb {\n  color: var(--fixed-light-color);\n  background-color: var(--primary-color);\n}\n.kindFill_6507bda468.colorDark_fba91d5720 {\n  color: var(--text-color-on-inverted);\n  background-color: var(--inverted-color-background);\n}\n.kindFill_6507bda468.colorNegative_809156e295 {\n  color: var(--fixed-light-color);\n  background-color: var(--negative-color);\n}\n.kindFill_6507bda468.colorLight_6f19dc5a2d {\n  color: var(--primary-text-color);\n  background-color: var(--ui-background-color);\n}\n.kindLine_64f525b867 {\n  box-shadow: 0 0 0 1px currentColor inset;\n}\n.kindLine_64f525b867.colorPrimary_6965626ceb {\n  color: var(--primary-color);\n}\n.kindLine_64f525b867.colorDark_fba91d5720 {\n  color: var(--inverted-color-background);\n}\n.kindLine_64f525b867.colorNegative_809156e295 {\n  color: var(--negative-color);\n}\n.kindLine_64f525b867.colorLight_6f19dc5a2d {\n  color: var(--primary-text-color);\n  box-shadow: 0 0 0 1px var(--ui-background-color) inset !important;\n}\n/* New number enters */\n.fadeEnter_5b52fff540 {\n  opacity: 0;\n  transform: translateY(15px);\n}\n.fadeEnterActive_e5a132489d {\n  position: relative;\n  opacity: 1;\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n  transform: translateY(0);\n}\n/* Old number exits */\n.fadeExit_ce5c4cc50f {\n  position: relative;\n  opacity: 1;\n  transform: translateY(0);\n}\n.fadeExitActive_21990aaaee {\n  position: relative;\n  opacity: 0;\n  transform: translateY(-15px);\n  transition: transform var(--motion-productive-long) var(--motion-timing-exit), opacity var(--motion-productive-short);\n}");export{n as default};
 //# sourceMappingURL=Counter.module.scss.js.map

package/dist/src/components/DatePicker/DateNavigationItem/DateNavigationItem.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={navigationItemContainer:"navigationItemContainer_a290607d61"};!function(e){const n="s_id-84193b4fa4fe_3_41_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".navigationItemContainer_a290607d61 {\n  line-height: 36px;\n  font-size: 28px;\n  color: var(--icon-color);\n  border: none;\n  padding: 0;\n  margin: 0;\n  background: none;\n  cursor: pointer;\n}");export{e as default};
+var e={navigationItemContainer:"navigationItemContainer_a62b5d4779"};!function(e){const n="s_id-84193b4fa4fe_3_42_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".navigationItemContainer_a62b5d4779 {\n  line-height: 36px;\n  font-size: 28px;\n  color: var(--icon-color);\n  border: none;\n  padding: 0;\n  margin: 0;\n  background: none;\n  cursor: pointer;\n}");export{e as default};
 //# sourceMappingURL=DateNavigationItem.module.scss.js.map

package/dist/src/components/DatePicker/DatePicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePicker.js","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useState } from \"react\";\nimport cx from \"classnames\";\nimport moment from \"moment\";\nimport \"react-dates/initialize.js\";\nimport { DayOfWeekShape, DayPickerRangeController, DayPickerSingleDateController } from \"react-dates\";\nimport DatePickerHeaderComponent from \"./DatePickerHeader/DatePickerHeader\";\nimport DateNavigationItem from \"./DateNavigationItem/DateNavigationItem\";\nimport YearPicker from \"./YearPicker/YearPicker\";\nimport { DAY_SIZE, WEEK_FIRST_DAY } from \"./constants\";\nimport { Direction, FocusInput, Moment, RangeDate } from \"./types\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport styles from \"./DatePicker.module.scss\";\n// Make sure to update when upgrading react-dates\nimport \"./external_datepicker.scss\";\n\nexport interface DatePickerProps extends VibeComponentProps {\n /*\n The first day of the week to display.\n /\n firstDayOfWeek?: DayOfWeekShape;\n /\n The currently selected date.\n /\n date?: Moment;\n /\n The end date for range selection mode.\n /\n endDate?: Moment;\n /\n Callback fired when a date is selected.\n /\n onPickDate?: (date: Moment \| RangeDate) => void;\n /\n If true, hides the navigation buttons.\n /\n hideNavigationKeys?: boolean;\n /\n If true, allows selecting days outside the current month.\n /\n enableOutsideDays?: boolean;\n /\n If true, displays a column with week numbers.\n /\n showWeekNumber?: boolean;\n /\n The size of a single day cell.\n /\n daySize?: number;\n /\n Function to determine if a specific day should be disabled.\n /\n shouldBlockDay?: (date: Moment) => boolean;\n /\n If true, enables date range selection mode.\n /\n range?: boolean;\n /\n The number of months displayed in the calendar.\n /\n numberOfMonths?: number;\n /\n Function to determine if a specific year should be disabled.\n /\n shouldBlockYear?: (year: number) => boolean;\n /\n Function to determine if a specific date range should be disabled.\n */\n shouldBlockRange?: (date: Moment) => boolean;\n}\n\nconst DatePicker: VibeComponent<DatePickerProps, HTMLElement> = forwardRef<HTMLDivElement, DatePickerProps>(\n (\n {\n id,\n className,\n firstDayOfWeek = WEEK_FIRST_DAY,\n daySize = DAY_SIZE,\n range = false,\n shouldBlockDay,\n shouldBlockYear,\n numberOfMonths = 1,\n hideNavigationKeys = false,\n date,\n endDate,\n onPickDate,\n enableOutsideDays = false,\n showWeekNumber = false,\n shouldBlockRange,\n \"data-testid\": dataTestId\n }: DatePickerProps,\n ref\n ) => {\n const [focusedInput, setFocusedInput] = useState(FocusInput.startDate);\n const [isMonthYearSelection, setIsMonthYearSelection] = useState(false); //show Month/Year selection dropdown\n const [overrideDateForView, setOverrideDateForView] = useState<Moment \| null>(null);\n const [yearFunc, setYearFunc] = useState(null);\n\n const renderMonth = useCallback(\n ({\n month,\n onYearSelect\n }: {\n month: moment.Moment;\n onYearSelect: (currentMonth: moment.Moment, newMonthVal: string) => void;\n }) => {\n if (!yearFunc && onYearSelect) {\n setYearFunc(() => onYearSelect);\n }\n return (\n <DatePickerHeaderComponent\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.DATEPICKER_HEADER, id)}\n currentDate={month \|\| moment()}\n isMonthYearSelection={isMonthYearSelection}\n onToggleMonthYearPicker={() => setIsMonthYearSelection(val => !val)}\n hideNavigationKeys={hideNavigationKeys}\n />\n );\n },\n [isMonthYearSelection, dataTestId, id, hideNavigationKeys, yearFunc]\n );\n\n const renderDay = useCallback(\n (day: Moment) => {\n const weekNumber = firstDayOfWeek === 0 ? day.clone().add(1, \"d\").isoWeek() : day.isoWeek();\n return (\n <>\n <span className={styles.calendarDayWeekNumber}>{weekNumber}</span> {day.format(\"D\")}\n </>\n );\n },\n [firstDayOfWeek]\n );\n\n const changeCurrentDateFromMonthYearView = useCallback(\n (newDate: Moment \| null) => {\n const oldDate = overrideDateForView \|\| date;\n setOverrideDateForView(newDate);\n setIsMonthYearSelection(false);\n yearFunc(oldDate, moment(newDate).year());\n },\n [overrideDateForView, date, yearFunc]\n );\n\n const renderMonthYearSelection = useCallback(() => {\n return (\n <YearPicker\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.DATEPICKER_YEAR_SELECTION, id)}\n selectedDate={date}\n isYearBlocked={shouldBlockYear}\n changeCurrentDate={changeCurrentDateFromMonthYearView}\n />\n );\n }, [dataTestId, id, overrideDateForView, date, shouldBlockYear, changeCurrentDateFromMonthYearView]);\n\n const onDateRangeChange = useCallback(\n (date: RangeDate) => {\n if (!onPickDate) return;\n if (focusedInput === FocusInput.startDate) {\n onPickDate({ ...date, endDate: null });\n } else {\n onPickDate(date);\n }\n },\n [focusedInput, onPickDate]\n );\n\n const onFocusChange = useCallback((focusedInput: FocusInput) => {\n setFocusedInput(focusedInput \|\| FocusInput.startDate);\n }, []);\n\n const shouldShowNav = !hideNavigationKeys && !isMonthYearSelection;\n return (\n <div\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.DATEPICKER, id)}\n ref={ref}\n id={id}\n className={cx(styles.datepickerContainer, className, {\n [styles.withWeekNumber]: showWeekNumber,\n [styles.rangePickerMode]: range,\n [styles.monthYearSelection]: isMonthYearSelection\n })}\n >\n {range ? (\n <DayPickerRangeController\n renderDayContents={showWeekNumber ? renderDay : undefined}\n firstDayOfWeek={firstDayOfWeek}\n hideKeyboardShortcutsPanel\n startDate={date}\n endDate={endDate}\n onDatesChange={onDateRangeChange}\n focusedInput={focusedInput}\n minimumNights={0}\n onFocusChange={onFocusChange}\n navPrev={shouldShowNav ? <DateNavigationItem kind={Direction.prev} /> : <div />}\n navNext={shouldShowNav ? <DateNavigationItem kind={Direction.next} /> : <div />}\n daySize={daySize}\n isOutsideRange={shouldBlockRange}\n isDayBlocked={shouldBlockDay}\n renderMonthElement={renderMonth}\n enableOutsideDays={enableOutsideDays \|\| showWeekNumber}\n numberOfMonths={numberOfMonths}\n initialVisibleMonth={() => overrideDateForView \|\| date \|\| moment()}\n />\n ) : (\n <DayPickerSingleDateController\n renderDayContents={showWeekNumber ? renderDay : undefined}\n firstDayOfWeek={firstDayOfWeek}\n hideKeyboardShortcutsPanel\n onFocusChange={NOOP}\n numberOfMonths={numberOfMonths}\n date={date}\n onDateChange={(date: Moment) => onPickDate(date)}\n navPrev={shouldShowNav ? <DateNavigationItem kind={Direction.prev} /> : <div />}\n navNext={shouldShowNav ? <DateNavigationItem kind={Direction.next} /> : <div />}\n focused={true}\n renderMonthElement={renderMonth}\n enableOutsideDays={enableOutsideDays \|\| showWeekNumber}\n daySize={daySize}\n isDayBlocked={shouldBlockDay}\n initialVisibleMonth={() => overrideDateForView \|\| date \|\| moment()}\n />\n )}\n {isMonthYearSelection && renderMonthYearSelection()}\n </div>\n );\n }\n);\n\nexport default DatePicker;\n"],"names":["DatePicker","forwardRef","_ref","ref","id","className","_ref$firstDayOfWeek","firstDayOfWeek","WEEK_FIRST_DAY","_ref$daySize","daySize","DAY_SIZE","_ref$range","range","shouldBlockDay","shouldBlockYear","_ref$numberOfMonths","numberOfMonths","_ref$hideNavigationKe","hideNavigationKeys","date","endDate","onPickDate","_ref$enableOutsideDay","enableOutsideDays","_ref$showWeekNumber","showWeekNumber","shouldBlockRange","dataTestId","_useState","useState","FocusInput","startDate","_useState2","_slicedToArray","focusedInput","setFocusedInput","_useState3","_useState4","isMonthYearSelection","setIsMonthYearSelection","_useState5","_useState6","overrideDateForView","setOverrideDateForView","_useState7","_useState8","yearFunc","setYearFunc","renderMonth","useCallback","_ref2","month","onYearSelect","React","DatePickerHeaderComponent","getTestId","ComponentDefaultTestId","DATEPICKER_HEADER","currentDate","moment","onToggleMonthYearPicker","val","renderDay","day","weekNumber","clone","add","isoWeek","createElement","Fragment","styles","calendarDayWeekNumber","format","changeCurrentDateFromMonthYearView","newDate","oldDate","year","renderMonthYearSelection","YearPicker","DATEPICKER_YEAR_SELECTION","selectedDate","isYearBlocked","changeCurrentDate","onDateRangeChange","onFocusChange","shouldShowNav","DATEPICKER","cx","datepickerContainer","_defineProperty","withWeekNumber","rangePickerMode","monthYearSelection","DayPickerRangeController","renderDayContents","undefined","hideKeyboardShortcutsPanel","onDatesChange","minimumNights","navPrev","DateNavigationItem","kind","Direction","prev","navNext","next","isOutsideRange","isDayBlocked","renderMonthElement","initialVisibleMonth","DayPickerSingleDateController","NOOP","onDateChange","focused"],"mappings":"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"}
1	+ {"version":3,"file":"DatePicker.js","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useState } from \"react\";\nimport cx from \"classnames\";\nimport moment from \"moment\";\nimport \"react-dates/initialize.js\";\nimport { DayOfWeekShape, DayPickerRangeController, DayPickerSingleDateController } from \"react-dates\";\nimport DatePickerHeaderComponent from \"./DatePickerHeader/DatePickerHeader\";\nimport DateNavigationItem from \"./DateNavigationItem/DateNavigationItem\";\nimport YearPicker from \"./YearPicker/YearPicker\";\nimport { DAY_SIZE, WEEK_FIRST_DAY } from \"./constants\";\nimport { Direction, FocusInput, Moment, RangeDate } from \"./types\";\nimport { VibeComponentProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport styles from \"./DatePicker.module.scss\";\n// Make sure to update when upgrading react-dates\nimport \"./external_datepicker.scss\";\n\nexport interface DatePickerProps extends VibeComponentProps {\n /*\n The first day of the week to display.\n /\n firstDayOfWeek?: DayOfWeekShape;\n /\n The currently selected date.\n /\n date?: Moment;\n /\n The end date for range selection mode.\n /\n endDate?: Moment;\n /\n Callback fired when a date is selected.\n /\n onPickDate?: (date: Moment \| RangeDate) => void;\n /\n If true, hides the navigation buttons.\n /\n hideNavigationKeys?: boolean;\n /\n If true, allows selecting days outside the current month.\n /\n enableOutsideDays?: boolean;\n /\n If true, displays a column with week numbers.\n /\n showWeekNumber?: boolean;\n /\n The size of a single day cell.\n /\n daySize?: number;\n /\n Function to determine if a specific day should be disabled.\n /\n shouldBlockDay?: (date: Moment) => boolean;\n /\n If true, enables date range selection mode.\n /\n range?: boolean;\n /\n The number of months displayed in the calendar.\n /\n numberOfMonths?: number;\n /\n Function to determine if a specific year should be disabled.\n /\n shouldBlockYear?: (year: number) => boolean;\n /\n Function to determine if a specific date range should be disabled.\n */\n shouldBlockRange?: (date: Moment) => boolean;\n}\n\nconst DatePicker = forwardRef(\n (\n {\n id,\n className,\n firstDayOfWeek = WEEK_FIRST_DAY,\n daySize = DAY_SIZE,\n range = false,\n shouldBlockDay,\n shouldBlockYear,\n numberOfMonths = 1,\n hideNavigationKeys = false,\n date,\n endDate,\n onPickDate,\n enableOutsideDays = false,\n showWeekNumber = false,\n shouldBlockRange,\n \"data-testid\": dataTestId\n }: DatePickerProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const [focusedInput, setFocusedInput] = useState(FocusInput.startDate);\n const [isMonthYearSelection, setIsMonthYearSelection] = useState(false); //show Month/Year selection dropdown\n const [overrideDateForView, setOverrideDateForView] = useState<Moment \| null>(null);\n const [yearFunc, setYearFunc] = useState(null);\n\n const renderMonth = useCallback(\n ({\n month,\n onYearSelect\n }: {\n month: moment.Moment;\n onYearSelect: (currentMonth: moment.Moment, newMonthVal: string) => void;\n }) => {\n if (!yearFunc && onYearSelect) {\n setYearFunc(() => onYearSelect);\n }\n return (\n <DatePickerHeaderComponent\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.DATEPICKER_HEADER, id)}\n currentDate={month \|\| moment()}\n isMonthYearSelection={isMonthYearSelection}\n onToggleMonthYearPicker={() => setIsMonthYearSelection(val => !val)}\n hideNavigationKeys={hideNavigationKeys}\n />\n );\n },\n [isMonthYearSelection, dataTestId, id, hideNavigationKeys, yearFunc]\n );\n\n const renderDay = useCallback(\n (day: Moment) => {\n const weekNumber = firstDayOfWeek === 0 ? day.clone().add(1, \"d\").isoWeek() : day.isoWeek();\n return (\n <>\n <span className={styles.calendarDayWeekNumber}>{weekNumber}</span> {day.format(\"D\")}\n </>\n );\n },\n [firstDayOfWeek]\n );\n\n const changeCurrentDateFromMonthYearView = useCallback(\n (newDate: Moment \| null) => {\n const oldDate = overrideDateForView \|\| date;\n setOverrideDateForView(newDate);\n setIsMonthYearSelection(false);\n yearFunc(oldDate, moment(newDate).year());\n },\n [overrideDateForView, date, yearFunc]\n );\n\n const renderMonthYearSelection = useCallback(() => {\n return (\n <YearPicker\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.DATEPICKER_YEAR_SELECTION, id)}\n selectedDate={date}\n isYearBlocked={shouldBlockYear}\n changeCurrentDate={changeCurrentDateFromMonthYearView}\n />\n );\n }, [dataTestId, id, overrideDateForView, date, shouldBlockYear, changeCurrentDateFromMonthYearView]);\n\n const onDateRangeChange = useCallback(\n (date: RangeDate) => {\n if (!onPickDate) return;\n if (focusedInput === FocusInput.startDate) {\n onPickDate({ ...date, endDate: null });\n } else {\n onPickDate(date);\n }\n },\n [focusedInput, onPickDate]\n );\n\n const onFocusChange = useCallback((focusedInput: FocusInput) => {\n setFocusedInput(focusedInput \|\| FocusInput.startDate);\n }, []);\n\n const shouldShowNav = !hideNavigationKeys && !isMonthYearSelection;\n return (\n <div\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.DATEPICKER, id)}\n ref={ref}\n id={id}\n className={cx(styles.datepickerContainer, className, {\n [styles.withWeekNumber]: showWeekNumber,\n [styles.rangePickerMode]: range,\n [styles.monthYearSelection]: isMonthYearSelection\n })}\n >\n {range ? (\n <DayPickerRangeController\n renderDayContents={showWeekNumber ? renderDay : undefined}\n firstDayOfWeek={firstDayOfWeek}\n hideKeyboardShortcutsPanel\n startDate={date}\n endDate={endDate}\n onDatesChange={onDateRangeChange}\n focusedInput={focusedInput}\n minimumNights={0}\n onFocusChange={onFocusChange}\n navPrev={shouldShowNav ? <DateNavigationItem kind={Direction.prev} /> : <div />}\n navNext={shouldShowNav ? <DateNavigationItem kind={Direction.next} /> : <div />}\n daySize={daySize}\n isOutsideRange={shouldBlockRange}\n isDayBlocked={shouldBlockDay}\n renderMonthElement={renderMonth}\n enableOutsideDays={enableOutsideDays \|\| showWeekNumber}\n numberOfMonths={numberOfMonths}\n initialVisibleMonth={() => overrideDateForView \|\| date \|\| moment()}\n />\n ) : (\n <DayPickerSingleDateController\n renderDayContents={showWeekNumber ? renderDay : undefined}\n firstDayOfWeek={firstDayOfWeek}\n hideKeyboardShortcutsPanel\n onFocusChange={NOOP}\n numberOfMonths={numberOfMonths}\n date={date}\n onDateChange={(date: Moment) => onPickDate(date)}\n navPrev={shouldShowNav ? <DateNavigationItem kind={Direction.prev} /> : <div />}\n navNext={shouldShowNav ? <DateNavigationItem kind={Direction.next} /> : <div />}\n focused={true}\n renderMonthElement={renderMonth}\n enableOutsideDays={enableOutsideDays \|\| showWeekNumber}\n daySize={daySize}\n isDayBlocked={shouldBlockDay}\n initialVisibleMonth={() => overrideDateForView \|\| date \|\| moment()}\n />\n )}\n {isMonthYearSelection && renderMonthYearSelection()}\n </div>\n );\n }\n);\n\nexport default DatePicker;\n"],"names":["DatePicker","forwardRef","_ref","ref","id","className","_ref$firstDayOfWeek","firstDayOfWeek","WEEK_FIRST_DAY","_ref$daySize","daySize","DAY_SIZE","_ref$range","range","shouldBlockDay","shouldBlockYear","_ref$numberOfMonths","numberOfMonths","_ref$hideNavigationKe","hideNavigationKeys","date","endDate","onPickDate","_ref$enableOutsideDay","enableOutsideDays","_ref$showWeekNumber","showWeekNumber","shouldBlockRange","dataTestId","_useState","useState","FocusInput","startDate","_useState2","_slicedToArray","focusedInput","setFocusedInput","_useState3","_useState4","isMonthYearSelection","setIsMonthYearSelection","_useState5","_useState6","overrideDateForView","setOverrideDateForView","_useState7","_useState8","yearFunc","setYearFunc","renderMonth","useCallback","_ref2","month","onYearSelect","React","DatePickerHeaderComponent","getTestId","ComponentDefaultTestId","DATEPICKER_HEADER","currentDate","moment","onToggleMonthYearPicker","val","renderDay","day","weekNumber","clone","add","isoWeek","createElement","Fragment","styles","calendarDayWeekNumber","format","changeCurrentDateFromMonthYearView","newDate","oldDate","year","renderMonthYearSelection","YearPicker","DATEPICKER_YEAR_SELECTION","selectedDate","isYearBlocked","changeCurrentDate","onDateRangeChange","onFocusChange","shouldShowNav","DATEPICKER","cx","datepickerContainer","_defineProperty","withWeekNumber","rangePickerMode","monthYearSelection","DayPickerRangeController","renderDayContents","undefined","hideKeyboardShortcutsPanel","onDatesChange","minimumNights","navPrev","DateNavigationItem","kind","Direction","prev","navNext","next","isOutsideRange","isDayBlocked","renderMonthElement","initialVisibleMonth","DayPickerSingleDateController","NOOP","onDateChange","focused"],"mappings":"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"}

package/dist/src/components/DatePicker/DatePicker.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={datepickerContainer:"datepickerContainer_dc22b22255",monthYearSelection:"monthYearSelection_7f982eb512",rangePickerMode:"rangePickerMode_ffcb9cdc4f",withWeekNumber:"withWeekNumber_d4c96f7bac",calendarDayWeekNumber:"calendarDayWeekNumber_c95660effc"};!function(e){const n="s_id-08c822721057_3_41_0";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,r.firstChild?r.insertBefore(a,r.firstChild):r.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('.datepickerContainer_dc22b22255 {\n  position: relative;\n  min-height: 302px;\n}\n.datepickerContainer_dc22b22255 table tbody {\n  border-spacing: 0;\n  border-collapse: collapse;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font-size: 100%;\n  box-shadow: none;\n}\n.datepickerContainer_dc22b22255 td {\n  border: none;\n}\n.datepickerContainer_dc22b22255.monthYearSelection_7f982eb512 table tbody {\n  opacity: 0;\n}\n.datepickerContainer_dc22b22255.monthYearSelection_7f982eb512 .DayPicker_transitionContainer__horizontal {\n  transition: none;\n}\n.datepickerContainer_dc22b22255 .CalendarMonthGrid {\n  background-color: var(--secondary-background-color);\n}\n.datepickerContainer_dc22b22255 .CalendarMonth {\n  background-color: var(--secondary-background-color);\n}\n.datepickerContainer_dc22b22255 .DayPicker__horizontal {\n  background-color: var(--secondary-background-color);\n}\n.datepickerContainer_dc22b22255 .DayPicker {\n  box-shadow: none;\n  border: none;\n  border-radius: 0;\n}\n.datepickerContainer_dc22b22255 .CalendarDay__default {\n  border: none;\n  font-size: 16px;\n  font-weight: 300;\n  color: var(--primary-text-on-secondary-color);\n  background-color: var(--secondary-background-color);\n  border-top: 1px solid var(--secondary-background-color);\n  border-bottom: 1px solid var(--secondary-background-color);\n  z-index: 1;\n  position: relative;\n}\n.datepickerContainer_dc22b22255 .CalendarDay__default:hover {\n  background: none;\n  border: none;\n  border-top: 1px solid var(--secondary-background-color);\n  border-bottom: 1px solid var(--secondary-background-color);\n}\n.datepickerContainer_dc22b22255 .CalendarDay__default:hover::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  border: none;\n  background-color: var(--primary-background-hover-color);\n}\n.datepickerContainer_dc22b22255 .CalendarDay__default.CalendarDay__selected {\n  color: var(--text-color-on-primary);\n}\n.datepickerContainer_dc22b22255 .CalendarDay__default.CalendarDay__selected::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  border: none;\n  background: var(--primary-color);\n}\n.datepickerContainer_dc22b22255 .CalendarDay__default.CalendarDay__selected::before:hover {\n  color: var(--text-color-on-primary);\n  background: var(--primary-color);\n}\n.datepickerContainer_dc22b22255 .CalendarMonth_caption {\n  color: var(--primary-text-on-secondary-color);\n}\n.datepickerContainer_dc22b22255 .CalendarDay__today::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  border: 1px solid var(--primary-color);\n}\n.datepickerContainer_dc22b22255 .CalendarDay__today:hover::before {\n  border: 1px solid var(--primary-color);\n}\n.datepickerContainer_dc22b22255 .CalendarDay__blocked_calendar, .datepickerContainer_dc22b22255 .CalendarDay__blocked_calendar:active, .datepickerContainer_dc22b22255 .CalendarDay__blocked_calendar:hover {\n  background-color: var(--secondary-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.2;\n  pointer-events: none;\n}\n.datepickerContainer_dc22b22255 .DayPicker_weekHeader_li small {\n  font-size: 12px;\n  color: var(--secondary-text-on-secondary-color);\n  font-weight: 300;\n  cursor: default;\n}\n.datepickerContainer_dc22b22255 .DayPickerNavigation_rightButton__horizontal {\n  right: 22px;\n}\n.datepickerContainer_dc22b22255 .DayPickerNavigation .DayPickerNavigation_button:nth-child(1) {\n  left: 12px;\n}\n.datepickerContainer_dc22b22255 .DayPickerNavigation .DayPickerNavigation_button:nth-child(2) {\n  right: 12px;\n}\n.datepickerContainer_dc22b22255 .DayPickerNavigation_button__horizontal {\n  position: absolute;\n  top: 15px;\n  line-height: 0.78;\n  border-radius: 3px;\n  padding: 6px 9px;\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected.CalendarDay__selected_start {\n  border-radius: 0;\n  background: linear-gradient(90deg, var(--secondary-background-color) 50%, var(--primary-selected-color) 50%);\n  z-index: 1;\n  position: relative;\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected.CalendarDay__selected_start:hover {\n  background: linear-gradient(90deg, var(--secondary-background-color) 50%, var(--primary-selected-color) 50%);\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected.CalendarDay__selected_start::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  background-color: var(--primary-color);\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected.CalendarDay__selected_end {\n  border-radius: 0;\n  background: linear-gradient(90deg, var(--primary-selected-color) 50%, var(--secondary-background-color) 50%);\n  z-index: 1;\n  position: relative;\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected.CalendarDay__selected_end:hover {\n  background: linear-gradient(90deg, var(--primary-selected-color) 50%, var(--secondary-background-color) 50%);\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected.CalendarDay__selected_end::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  background-color: var(--primary-color);\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__hovered_span, .datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__hovered_span:hover {\n  border-radius: 0;\n  color: var(--primary-text-color);\n  background: var(--primary-selected-color);\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__hovered_span:hover::before, .datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__hovered_span:hover:hover::before {\n  border-radius: 0;\n  background: var(--primary-selected-color);\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected_span {\n  background: var(--primary-selected-color);\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected_span:hover {\n  color: var(--primary-text-color);\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected_span.CalendarDay__today::before {\n  border-radius: 0;\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f .CalendarDay__selected_span:hover::before {\n  border-radius: 0;\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f.range-single-date-selected .CalendarDay__hovered_span {\n  background: var(--primary-background-hover-color);\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f.range-single-date-selected .CalendarDay__hovered_span.CalendarDay__today::before {\n  border-radius: 0;\n}\n.datepickerContainer_dc22b22255.rangePickerMode_ffcb9cdc4f.range-single-date-selected .CalendarDay__hovered_span:hover::before {\n  background: var(--primary-background-hover-color);\n}\n.datepickerContainer_dc22b22255.withWeekNumber_d4c96f7bac {\n  padding: 0 4px 0 8px;\n}\n.datepickerContainer_dc22b22255.withWeekNumber_d4c96f7bac .CalendarDay .calendarDayWeekNumber_c95660effc {\n  color: rgba(177, 177, 184, 0.7490196078);\n  pointer-events: none;\n  visibility: visible;\n  display: none;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  top: -1px;\n  font-size: 14px;\n  width: 40px;\n  height: 37px;\n  left: 0px;\n  transform: translateX(-100%);\n}\n.datepickerContainer_dc22b22255.withWeekNumber_d4c96f7bac .CalendarMonthGrid_month__horizontal:not(.CalendarMonthGrid_month__hidden) tr > td.CalendarDay .calendarDayWeekNumber_c95660effc {\n  display: flex;\n}\n.datepickerContainer_dc22b22255.withWeekNumber_d4c96f7bac .CalendarMonthGrid_month__horizontal:not(.CalendarMonthGrid_month__hidden) tr > td.CalendarDay ~ td.CalendarDay .calendarDayWeekNumber_c95660effc {\n  display: none;\n}\n.datepickerContainer_dc22b22255.withWeekNumber_d4c96f7bac .DayPicker_weekHeader:before {\n  content: "Wk";\n  position: absolute;\n  font-size: 12px;\n  width: 40px;\n  top: 3px;\n  left: -28px;\n  height: 24px;\n}\n.datepickerContainer_dc22b22255.withWeekNumber_d4c96f7bac .DayPicker__horizontal {\n  margin: 4px;\n}\n.datepickerContainer_dc22b22255.withWeekNumber_d4c96f7bac .CalendarMonthGrid_month__horizontal:not(.CalendarMonthGrid_month__hidden) {\n  margin-left: 17px;\n}\n.datepickerContainer_dc22b22255.withWeekNumber_d4c96f7bac .DayPicker_weekHeader {\n  padding: 0 !important;\n  left: 30px !important;\n}\n.datepickerContainer_dc22b22255.withWeekNumber_d4c96f7bac .CalendarMonth_caption {\n  margin-right: 20px;\n}');export{e as default};
+var e={datepickerContainer:"datepickerContainer_23861302a3",monthYearSelection:"monthYearSelection_549e1edc31",rangePickerMode:"rangePickerMode_df7e979987",withWeekNumber:"withWeekNumber_dab51acbb9",calendarDayWeekNumber:"calendarDayWeekNumber_f8b1b6ea02"};!function(e){const n="s_id-08c822721057_3_42_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+n))return;const r=document.createElement("style");r.id=n,a.firstChild?a.insertBefore(r,a.firstChild):a.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('.datepickerContainer_23861302a3 {\n  position: relative;\n  min-height: 302px;\n}\n.datepickerContainer_23861302a3 table tbody {\n  border-spacing: 0;\n  border-collapse: collapse;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font-size: 100%;\n  box-shadow: none;\n}\n.datepickerContainer_23861302a3 td {\n  border: none;\n}\n.datepickerContainer_23861302a3.monthYearSelection_549e1edc31 table tbody {\n  opacity: 0;\n}\n.datepickerContainer_23861302a3.monthYearSelection_549e1edc31 .DayPicker_transitionContainer__horizontal {\n  transition: none;\n}\n.datepickerContainer_23861302a3 .CalendarMonthGrid {\n  background-color: var(--secondary-background-color);\n}\n.datepickerContainer_23861302a3 .CalendarMonth {\n  background-color: var(--secondary-background-color);\n}\n.datepickerContainer_23861302a3 .DayPicker__horizontal {\n  background-color: var(--secondary-background-color);\n}\n.datepickerContainer_23861302a3 .DayPicker {\n  box-shadow: none;\n  border: none;\n  border-radius: 0;\n}\n.datepickerContainer_23861302a3 .CalendarDay__default {\n  border: none;\n  font-size: 16px;\n  font-weight: 300;\n  color: var(--primary-text-on-secondary-color);\n  background-color: var(--secondary-background-color);\n  border-top: 1px solid var(--secondary-background-color);\n  border-bottom: 1px solid var(--secondary-background-color);\n  z-index: 1;\n  position: relative;\n}\n.datepickerContainer_23861302a3 .CalendarDay__default:hover {\n  background: none;\n  border: none;\n  border-top: 1px solid var(--secondary-background-color);\n  border-bottom: 1px solid var(--secondary-background-color);\n}\n.datepickerContainer_23861302a3 .CalendarDay__default:hover::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  border: none;\n  background-color: var(--primary-background-hover-color);\n}\n.datepickerContainer_23861302a3 .CalendarDay__default.CalendarDay__selected {\n  color: var(--text-color-on-primary);\n}\n.datepickerContainer_23861302a3 .CalendarDay__default.CalendarDay__selected::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  border: none;\n  background: var(--primary-color);\n}\n.datepickerContainer_23861302a3 .CalendarDay__default.CalendarDay__selected::before:hover {\n  color: var(--text-color-on-primary);\n  background: var(--primary-color);\n}\n.datepickerContainer_23861302a3 .CalendarMonth_caption {\n  color: var(--primary-text-on-secondary-color);\n}\n.datepickerContainer_23861302a3 .CalendarDay__today::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  border: 1px solid var(--primary-color);\n}\n.datepickerContainer_23861302a3 .CalendarDay__today:hover::before {\n  border: 1px solid var(--primary-color);\n}\n.datepickerContainer_23861302a3 .CalendarDay__blocked_calendar, .datepickerContainer_23861302a3 .CalendarDay__blocked_calendar:active, .datepickerContainer_23861302a3 .CalendarDay__blocked_calendar:hover {\n  background-color: var(--secondary-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.2;\n  pointer-events: none;\n}\n.datepickerContainer_23861302a3 .DayPicker_weekHeader_li small {\n  font-size: 12px;\n  color: var(--secondary-text-on-secondary-color);\n  font-weight: 300;\n  cursor: default;\n}\n.datepickerContainer_23861302a3 .DayPickerNavigation_rightButton__horizontal {\n  right: 22px;\n}\n.datepickerContainer_23861302a3 .DayPickerNavigation .DayPickerNavigation_button:nth-child(1) {\n  left: 12px;\n}\n.datepickerContainer_23861302a3 .DayPickerNavigation .DayPickerNavigation_button:nth-child(2) {\n  right: 12px;\n}\n.datepickerContainer_23861302a3 .DayPickerNavigation_button__horizontal {\n  position: absolute;\n  top: 15px;\n  line-height: 0.78;\n  border-radius: 3px;\n  padding: 6px 9px;\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected.CalendarDay__selected_start {\n  border-radius: 0;\n  background: linear-gradient(90deg, var(--secondary-background-color) 50%, var(--primary-selected-color) 50%);\n  z-index: 1;\n  position: relative;\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected.CalendarDay__selected_start:hover {\n  background: linear-gradient(90deg, var(--secondary-background-color) 50%, var(--primary-selected-color) 50%);\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected.CalendarDay__selected_start::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  background-color: var(--primary-color);\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected.CalendarDay__selected_end {\n  border-radius: 0;\n  background: linear-gradient(90deg, var(--primary-selected-color) 50%, var(--secondary-background-color) 50%);\n  z-index: 1;\n  position: relative;\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected.CalendarDay__selected_end:hover {\n  background: linear-gradient(90deg, var(--primary-selected-color) 50%, var(--secondary-background-color) 50%);\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected.CalendarDay__selected_end::before {\n  display: block;\n  position: absolute;\n  left: 0;\n  top: 0;\n  box-sizing: border-box;\n  content: "";\n  width: 100%;\n  height: 100%;\n  z-index: -1;\n  border-radius: 50%;\n  background-color: var(--primary-color);\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__hovered_span, .datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__hovered_span:hover {\n  border-radius: 0;\n  color: var(--primary-text-color);\n  background: var(--primary-selected-color);\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__hovered_span:hover::before, .datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__hovered_span:hover:hover::before {\n  border-radius: 0;\n  background: var(--primary-selected-color);\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected_span {\n  background: var(--primary-selected-color);\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected_span:hover {\n  color: var(--primary-text-color);\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected_span.CalendarDay__today::before {\n  border-radius: 0;\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987 .CalendarDay__selected_span:hover::before {\n  border-radius: 0;\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987.range-single-date-selected .CalendarDay__hovered_span {\n  background: var(--primary-background-hover-color);\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987.range-single-date-selected .CalendarDay__hovered_span.CalendarDay__today::before {\n  border-radius: 0;\n}\n.datepickerContainer_23861302a3.rangePickerMode_df7e979987.range-single-date-selected .CalendarDay__hovered_span:hover::before {\n  background: var(--primary-background-hover-color);\n}\n.datepickerContainer_23861302a3.withWeekNumber_dab51acbb9 {\n  padding: 0 4px 0 8px;\n}\n.datepickerContainer_23861302a3.withWeekNumber_dab51acbb9 .CalendarDay .calendarDayWeekNumber_f8b1b6ea02 {\n  color: rgba(177, 177, 184, 0.7490196078);\n  pointer-events: none;\n  visibility: visible;\n  display: none;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  top: -1px;\n  font-size: 14px;\n  width: 40px;\n  height: 37px;\n  left: 0px;\n  transform: translateX(-100%);\n}\n.datepickerContainer_23861302a3.withWeekNumber_dab51acbb9 .CalendarMonthGrid_month__horizontal:not(.CalendarMonthGrid_month__hidden) tr > td.CalendarDay .calendarDayWeekNumber_f8b1b6ea02 {\n  display: flex;\n}\n.datepickerContainer_23861302a3.withWeekNumber_dab51acbb9 .CalendarMonthGrid_month__horizontal:not(.CalendarMonthGrid_month__hidden) tr > td.CalendarDay ~ td.CalendarDay .calendarDayWeekNumber_f8b1b6ea02 {\n  display: none;\n}\n.datepickerContainer_23861302a3.withWeekNumber_dab51acbb9 .DayPicker_weekHeader:before {\n  content: "Wk";\n  position: absolute;\n  font-size: 12px;\n  width: 40px;\n  top: 3px;\n  left: -28px;\n  height: 24px;\n}\n.datepickerContainer_23861302a3.withWeekNumber_dab51acbb9 .DayPicker__horizontal {\n  margin: 4px;\n}\n.datepickerContainer_23861302a3.withWeekNumber_dab51acbb9 .CalendarMonthGrid_month__horizontal:not(.CalendarMonthGrid_month__hidden) {\n  margin-left: 17px;\n}\n.datepickerContainer_23861302a3.withWeekNumber_dab51acbb9 .DayPicker_weekHeader {\n  padding: 0 !important;\n  left: 30px !important;\n}\n.datepickerContainer_23861302a3.withWeekNumber_dab51acbb9 .CalendarMonth_caption {\n  margin-right: 20px;\n}');export{e as default};
 //# sourceMappingURL=DatePicker.module.scss.js.map

package/dist/src/components/DatePicker/DatePickerHeader/DatePickerHeader.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={datePickerHeader:"datePickerHeader_37e562c1f4",button:"button_656a7ec602",buttonContent:"buttonContent_f7de6229c5"};!function(e){const n="s_id-89778422f1e0_3_41_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".datePickerHeader_37e562c1f4 {\n  display: flex;\n  text-align: center;\n  justify-content: center;\n  align-items: center;\n}\n.datePickerHeader_37e562c1f4 .button_656a7ec602 {\n  border: none;\n  padding: 0;\n  margin: 0;\n  background: none;\n  margin-left: 4px;\n  cursor: pointer;\n}\n.datePickerHeader_37e562c1f4 .button_656a7ec602 .buttonContent_f7de6229c5 {\n  border-radius: 50%;\n  width: 24px;\n  height: 24px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 14px;\n  transition: all 0.1s ease;\n  color: var(--primary-text-on-secondary-color, true);\n}\n.datePickerHeader_37e562c1f4 .button_656a7ec602 .buttonContent_f7de6229c5:hover {\n  background-color: var(--primary-background-hover-on-secondary-color);\n  text-decoration: none;\n}");export{e as default};
+var e={datePickerHeader:"datePickerHeader_6e51e15a6d",button:"button_a3b2689506",buttonContent:"buttonContent_21f94737c2"};!function(e){const n="s_id-89778422f1e0_3_42_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".datePickerHeader_6e51e15a6d {\n  display: flex;\n  text-align: center;\n  justify-content: center;\n  align-items: center;\n}\n.datePickerHeader_6e51e15a6d .button_a3b2689506 {\n  border: none;\n  padding: 0;\n  margin: 0;\n  background: none;\n  margin-left: 4px;\n  cursor: pointer;\n}\n.datePickerHeader_6e51e15a6d .button_a3b2689506 .buttonContent_21f94737c2 {\n  border-radius: 50%;\n  width: 24px;\n  height: 24px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 14px;\n  transition: all 0.1s ease;\n  color: var(--primary-text-on-secondary-color, true);\n}\n.datePickerHeader_6e51e15a6d .button_a3b2689506 .buttonContent_21f94737c2:hover {\n  background-color: var(--primary-background-hover-on-secondary-color);\n  text-decoration: none;\n}");export{e as default};
 //# sourceMappingURL=DatePickerHeader.module.scss.js.map

package/dist/src/components/DatePicker/YearPicker/YearPicker.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={monthYearPicker:"monthYearPicker_adfc062d7b",navigationWrapper:"navigationWrapper_79873cbee4",navigationLeft:"navigationLeft_644607daa0",navigationRight:"navigationRight_28801c3f13",pickerOptions:"pickerOptions_e6c65b393b",pickerOption:"pickerOption_31369e91a1"};!function(e){const n="s_id-38af31aef936_3_41_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".monthYearPicker_adfc062d7b {\n  position: absolute;\n  top: 0px;\n  left: 0;\n  right: 0;\n  height: 100%;\n  z-index: 10;\n  pointer-events: none;\n}\n.monthYearPicker_adfc062d7b .slide-down-appear {\n  opacity: 0;\n}\n.monthYearPicker_adfc062d7b .slide-down-appear-active {\n  transition: opacity 0.4s ease;\n  opacity: 1;\n}\n.monthYearPicker_adfc062d7b .navigationWrapper_79873cbee4 {\n  position: absolute;\n  top: 21px;\n  pointer-events: all;\n  cursor: pointer;\n}\n.monthYearPicker_adfc062d7b .navigationWrapper_79873cbee4.navigationLeft_644607daa0 {\n  left: 21px;\n}\n.monthYearPicker_adfc062d7b .navigationWrapper_79873cbee4.navigationRight_28801c3f13 {\n  right: 21px;\n}\n.monthYearPicker_adfc062d7b .pickerOptions_e6c65b393b {\n  text-align: center;\n  background-color: #fff;\n  background-color: var(--secondary-background-color);\n  position: absolute;\n  top: 55px;\n  pointer-events: all;\n}\n.monthYearPicker_adfc062d7b .pickerOptions_e6c65b393b .pickerOption_31369e91a1 {\n  min-width: 66px;\n}\n.monthYearPicker_adfc062d7b .CalendarYear--blocked {\n  color: var(--disabled-text-color);\n  cursor: default;\n}");export{e as default};
+var e={monthYearPicker:"monthYearPicker_bdc3de7b63",navigationWrapper:"navigationWrapper_8e176b97be",navigationLeft:"navigationLeft_5ce5cd2182",navigationRight:"navigationRight_fff016dab9",pickerOptions:"pickerOptions_8038b7f883",pickerOption:"pickerOption_8912735c3a"};!function(e){const n="s_id-38af31aef936_3_42_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".monthYearPicker_bdc3de7b63 {\n  position: absolute;\n  top: 0px;\n  left: 0;\n  right: 0;\n  height: 100%;\n  z-index: 10;\n  pointer-events: none;\n}\n.monthYearPicker_bdc3de7b63 .slide-down-appear {\n  opacity: 0;\n}\n.monthYearPicker_bdc3de7b63 .slide-down-appear-active {\n  transition: opacity 0.4s ease;\n  opacity: 1;\n}\n.monthYearPicker_bdc3de7b63 .navigationWrapper_8e176b97be {\n  position: absolute;\n  top: 21px;\n  pointer-events: all;\n  cursor: pointer;\n}\n.monthYearPicker_bdc3de7b63 .navigationWrapper_8e176b97be.navigationLeft_5ce5cd2182 {\n  left: 21px;\n}\n.monthYearPicker_bdc3de7b63 .navigationWrapper_8e176b97be.navigationRight_fff016dab9 {\n  right: 21px;\n}\n.monthYearPicker_bdc3de7b63 .pickerOptions_8038b7f883 {\n  text-align: center;\n  background-color: #fff;\n  background-color: var(--secondary-background-color);\n  position: absolute;\n  top: 55px;\n  pointer-events: all;\n}\n.monthYearPicker_bdc3de7b63 .pickerOptions_8038b7f883 .pickerOption_8912735c3a {\n  min-width: 66px;\n}\n.monthYearPicker_bdc3de7b63 .CalendarYear--blocked {\n  color: var(--disabled-text-color);\n  cursor: default;\n}");export{e as default};
 //# sourceMappingURL=YearPicker.module.scss.js.map

package/dist/src/components/DatePicker/external_datepicker.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n='/*  stylelint-disable scss/no-global-function-names */\n.PresetDateRangePicker_panel {\n  padding: 0 22px 11px;\n}\n.PresetDateRangePicker_button {\n  position: relative;\n  height: 100%;\n  text-align: center;\n  background: 0 0;\n  border: 2px solid #00a699;\n  color: #00a699;\n  padding: 4px 12px;\n  margin-right: 8px;\n  font: inherit;\n  font-weight: 700;\n  line-height: normal;\n  overflow: visible;\n  box-sizing: border-box;\n  cursor: pointer;\n}\n.PresetDateRangePicker_button:active {\n  outline: 0;\n}\n.PresetDateRangePicker_button__selected {\n  color: #fff;\n  background: #00a699;\n}\n.SingleDatePickerInput {\n  display: inline-block;\n  background-color: #fff;\n}\n.SingleDatePickerInput__withBorder {\n  border-radius: 2px;\n  border: 1px solid #dbdbdb;\n}\n.SingleDatePickerInput__rtl {\n  direction: rtl;\n}\n.SingleDatePickerInput__disabled {\n  background-color: #f2f2f2;\n}\n.SingleDatePickerInput__block {\n  display: block;\n}\n.SingleDatePickerInput__showClearDate {\n  padding-right: 30px;\n}\n.SingleDatePickerInput_clearDate {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  padding: 10px;\n  margin: 0 10px 0 5px;\n  position: absolute;\n  right: 0;\n  top: 50%;\n  transform: translateY(-50%);\n}\n.SingleDatePickerInput_clearDate__default:focus,\n.SingleDatePickerInput_clearDate__default:hover {\n  background: #dbdbdb;\n  border-radius: 50%;\n}\n.SingleDatePickerInput_clearDate__small {\n  padding: 6px;\n}\n.SingleDatePickerInput_clearDate__hide {\n  visibility: hidden;\n}\n.SingleDatePickerInput_clearDate_svg {\n  fill: #82888a;\n  height: 12px;\n  width: 15px;\n  vertical-align: middle;\n}\n.SingleDatePickerInput_clearDate_svg__small {\n  height: 9px;\n}\n.SingleDatePickerInput_calendarIcon {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  display: inline-block;\n  vertical-align: middle;\n  padding: 10px;\n  margin: 0 5px 0 10px;\n}\n.SingleDatePickerInput_calendarIcon_svg {\n  fill: #82888a;\n  height: 15px;\n  width: 14px;\n  vertical-align: middle;\n}\n.SingleDatePicker {\n  position: relative;\n  display: inline-block;\n}\n.SingleDatePicker__block {\n  display: block;\n}\n.SingleDatePicker_picker {\n  z-index: 1;\n  background-color: #fff;\n  position: absolute;\n}\n.SingleDatePicker_picker__rtl {\n  direction: rtl;\n}\n.SingleDatePicker_picker__directionLeft {\n  left: 0;\n}\n.SingleDatePicker_picker__directionRight {\n  right: 0;\n}\n.SingleDatePicker_picker__portal {\n  background-color: rgba(0, 0, 0, 0.3);\n  position: fixed;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n.SingleDatePicker_picker__fullScreenPortal {\n  background-color: #fff;\n}\n.SingleDatePicker_closeButton {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  position: absolute;\n  top: 0;\n  right: 0;\n  padding: 15px;\n  z-index: 2;\n}\n.SingleDatePicker_closeButton:focus,\n.SingleDatePicker_closeButton:hover {\n  color: #b0b3b4;\n  text-decoration: none;\n}\n.SingleDatePicker_closeButton_svg {\n  height: 15px;\n  width: 15px;\n  fill: #cacccd;\n}\n.DayPickerKeyboardShortcuts_buttonReset {\n  background: 0 0;\n  border: 0;\n  border-radius: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  padding: 0;\n  cursor: pointer;\n  font-size: 14px;\n}\n.DayPickerKeyboardShortcuts_buttonReset:active {\n  outline: 0;\n}\n.DayPickerKeyboardShortcuts_show {\n  width: 33px;\n  height: 26px;\n  position: absolute;\n  z-index: 2;\n}\n.DayPickerKeyboardShortcuts_show::before {\n  content: "";\n  display: block;\n  position: absolute;\n}\n.DayPickerKeyboardShortcuts_show__bottomRight {\n  bottom: 0;\n  right: 0;\n}\n.DayPickerKeyboardShortcuts_show__bottomRight::before {\n  border-top: 26px solid transparent;\n  border-right: 33px solid #00a699;\n  bottom: 0;\n  right: 0;\n}\n.DayPickerKeyboardShortcuts_show__bottomRight:hover::before {\n  border-right: 33px solid #008489;\n}\n.DayPickerKeyboardShortcuts_show__topRight {\n  top: 0;\n  right: 0;\n}\n.DayPickerKeyboardShortcuts_show__topRight::before {\n  border-bottom: 26px solid transparent;\n  border-right: 33px solid #00a699;\n  top: 0;\n  right: 0;\n}\n.DayPickerKeyboardShortcuts_show__topRight:hover::before {\n  border-right: 33px solid #008489;\n}\n.DayPickerKeyboardShortcuts_show__topLeft {\n  top: 0;\n  left: 0;\n}\n.DayPickerKeyboardShortcuts_show__topLeft::before {\n  border-bottom: 26px solid transparent;\n  border-left: 33px solid #00a699;\n  top: 0;\n  left: 0;\n}\n.DayPickerKeyboardShortcuts_show__topLeft:hover::before {\n  border-left: 33px solid #008489;\n}\n.DayPickerKeyboardShortcuts_showSpan {\n  color: #fff;\n  position: absolute;\n}\n.DayPickerKeyboardShortcuts_showSpan__bottomRight {\n  bottom: 0;\n  right: 5px;\n}\n.DayPickerKeyboardShortcuts_showSpan__topRight {\n  top: 1px;\n  right: 5px;\n}\n.DayPickerKeyboardShortcuts_showSpan__topLeft {\n  top: 1px;\n  left: 5px;\n}\n.DayPickerKeyboardShortcuts_panel {\n  overflow: auto;\n  background: #fff;\n  border: 1px solid #dbdbdb;\n  border-radius: 2px;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  left: 0;\n  z-index: 2;\n  padding: 22px;\n  margin: 33px;\n  text-align: left;\n}\n.DayPickerKeyboardShortcuts_title {\n  font-size: 16px;\n  font-weight: 700;\n  margin: 0;\n}\n.DayPickerKeyboardShortcuts_list {\n  list-style: none;\n  padding: 0;\n  font-size: 14px;\n}\n.DayPickerKeyboardShortcuts_close {\n  position: absolute;\n  right: 22px;\n  top: 22px;\n  z-index: 2;\n}\n.DayPickerKeyboardShortcuts_close:active {\n  outline: 0;\n}\n.DayPickerKeyboardShortcuts_closeSvg {\n  height: 15px;\n  width: 15px;\n  fill: #cacccd;\n}\n.DayPickerKeyboardShortcuts_closeSvg:focus,\n.DayPickerKeyboardShortcuts_closeSvg:hover {\n  fill: #82888a;\n}\n.CalendarDay {\n  box-sizing: border-box;\n  cursor: pointer;\n  font-size: 14px;\n  text-align: center;\n}\n.CalendarDay:active {\n  outline: 0;\n}\n.CalendarDay__defaultCursor {\n  cursor: default;\n}\n.CalendarDay__default {\n  border: 1px solid #e4e7e7;\n  color: #484848;\n  background: #fff;\n}\n.CalendarDay__default:hover {\n  background: #e4e7e7;\n  border: 1px solid #e4e7e7;\n  color: inherit;\n}\n.CalendarDay__hovered_offset {\n  background: #f4f5f5;\n  border: 1px double #e4e7e7;\n  color: inherit;\n}\n.CalendarDay__outside {\n  border: 0;\n  background: #fff;\n  color: #484848;\n}\n.CalendarDay__outside:hover {\n  border: 0;\n}\n.CalendarDay__blocked_minimum_nights {\n  background: #fff;\n  border: 1px solid #eceeee;\n  color: #cacccd;\n}\n.CalendarDay__blocked_minimum_nights:active,\n.CalendarDay__blocked_minimum_nights:hover {\n  background: #fff;\n  color: #cacccd;\n}\n.CalendarDay__highlighted_calendar {\n  background: #ffe8bc;\n  color: #484848;\n}\n.CalendarDay__highlighted_calendar:active,\n.CalendarDay__highlighted_calendar:hover {\n  background: #ffce71;\n  color: #484848;\n}\n.CalendarDay__selected_span {\n  background: #66e2da;\n  border: 1px double #33dacd;\n  color: #fff;\n}\n.CalendarDay__selected_span:active,\n.CalendarDay__selected_span:hover {\n  background: #33dacd;\n  border: 1px double #33dacd;\n  color: #fff;\n}\n.CalendarDay__selected,\n.CalendarDay__selected:active,\n.CalendarDay__selected:hover {\n  background: #00a699;\n  border: 1px double #00a699;\n  color: #fff;\n}\n.CalendarDay__hovered_span,\n.CalendarDay__hovered_span:hover {\n  background: #b2f1ec;\n  border: 1px double #80e8e0;\n  color: #007a87;\n}\n.CalendarDay__hovered_span:active {\n  background: #80e8e0;\n  border: 1px double #80e8e0;\n  color: #007a87;\n}\n.CalendarDay__blocked_calendar,\n.CalendarDay__blocked_calendar:active,\n.CalendarDay__blocked_calendar:hover {\n  background: #cacccd;\n  border: 1px solid #cacccd;\n  color: #82888a;\n}\n.CalendarDay__blocked_out_of_range,\n.CalendarDay__blocked_out_of_range:active,\n.CalendarDay__blocked_out_of_range:hover {\n  background: #fff;\n  border: 1px solid #e4e7e7;\n  color: #cacccd;\n}\n.CalendarDay__hovered_start_first_possible_end {\n  background: #eceeee;\n  border: 1px double #eceeee;\n}\n.CalendarDay__hovered_start_blocked_min_nights {\n  background: #eceeee;\n  border: 1px double #e4e7e7;\n}\n.CalendarMonth {\n  background: #fff;\n  text-align: center;\n  vertical-align: top;\n  user-select: none;\n}\n.CalendarMonth_table {\n  border-collapse: collapse;\n  border-spacing: 0;\n}\n.CalendarMonth_verticalSpacing {\n  border-collapse: separate;\n}\n.CalendarMonth_caption {\n  color: #484848;\n  font-size: 18px;\n  text-align: center;\n  padding-top: 22px;\n  padding-bottom: 37px;\n  caption-side: initial;\n}\n.CalendarMonth_caption__verticalScrollable {\n  padding-top: 12px;\n  padding-bottom: 7px;\n}\n.CalendarMonthGrid {\n  background: #fff;\n  text-align: left;\n  z-index: 0;\n}\n.CalendarMonthGrid__animating {\n  z-index: 1;\n}\n.CalendarMonthGrid__horizontal {\n  position: absolute;\n  left: 9px;\n}\n.CalendarMonthGrid__vertical,\n.CalendarMonthGrid__vertical_scrollable {\n  margin: 0 auto;\n}\n.CalendarMonthGrid_month__horizontal {\n  display: inline-block;\n  vertical-align: top;\n  min-height: 100%;\n}\n.CalendarMonthGrid_month__hideForAnimation {\n  position: absolute;\n  z-index: -1;\n  opacity: 0;\n  pointer-events: none;\n}\n.CalendarMonthGrid_month__hidden {\n  visibility: hidden;\n}\n.DayPickerNavigation {\n  position: relative;\n  z-index: 2;\n}\n.DayPickerNavigation__horizontal {\n  height: 0;\n}\n.DayPickerNavigation__verticalScrollable_prevNav {\n  z-index: 1;\n}\n.DayPickerNavigation__verticalDefault {\n  position: absolute;\n  width: 100%;\n  height: 52px;\n  bottom: 0;\n  left: 0;\n}\n.DayPickerNavigation__verticalScrollableDefault {\n  position: relative;\n}\n.DayPickerNavigation__bottom {\n  height: auto;\n}\n.DayPickerNavigation__bottomDefault {\n  -webkit-box-pack: justify;\n  -ms-flex-pack: justify;\n  display: flex;\n  justify-content: space-between;\n}\n.DayPickerNavigation_button {\n  cursor: pointer;\n  user-select: none;\n  border: 0;\n  padding: 0;\n  margin: 0;\n}\n.DayPickerNavigation_button__default {\n  border: 1px solid #e4e7e7;\n  background-color: #fff;\n  color: #757575;\n}\n.DayPickerNavigation_button__default:focus,\n.DayPickerNavigation_button__default:hover {\n  border: 1px solid #c4c4c4;\n}\n.DayPickerNavigation_button__default:active {\n  background: #f2f2f2;\n}\n.DayPickerNavigation_button__disabled {\n  cursor: default;\n  border: 1px solid #f2f2f2;\n}\n.DayPickerNavigation_button__disabled:focus,\n.DayPickerNavigation_button__disabled:hover {\n  border: 1px solid #f2f2f2;\n}\n.DayPickerNavigation_button__disabled:active {\n  background: 0 0;\n}\n.DayPickerNavigation_button__horizontalDefault {\n  position: absolute;\n  top: 18px;\n  line-height: 0.78;\n  border-radius: 3px;\n  padding: 6px 9px;\n}\n.DayPickerNavigation_bottomButton__horizontalDefault {\n  position: static;\n  margin: -10px 22px 30px;\n}\n.DayPickerNavigation_leftButton__horizontalDefault {\n  left: 22px;\n}\n.DayPickerNavigation_rightButton__horizontalDefault {\n  right: 22px;\n}\n.DayPickerNavigation_button__verticalDefault {\n  padding: 5px;\n  background: #fff;\n  box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1);\n  position: relative;\n  display: inline-block;\n  text-align: center;\n  height: 100%;\n  width: 50%;\n}\n.DayPickerNavigation_nextButton__verticalDefault {\n  border-left: 0;\n}\n.DayPickerNavigation_nextButton__verticalScrollableDefault,\n.DayPickerNavigation_prevButton__verticalScrollableDefault {\n  width: 100%;\n}\n.DayPickerNavigation_svg__horizontal {\n  height: 19px;\n  width: 19px;\n  fill: #82888a;\n  display: block;\n}\n.DayPickerNavigation_svg__vertical {\n  height: 42px;\n  width: 42px;\n  fill: #484848;\n}\n.DayPickerNavigation_svg__disabled {\n  fill: #f2f2f2;\n}\n.DayPicker {\n  background: #fff;\n  position: relative;\n  text-align: left;\n}\n.DayPicker__horizontal {\n  background: #fff;\n}\n.DayPicker__verticalScrollable {\n  height: 100%;\n}\n.DayPicker__hidden {\n  visibility: hidden;\n}\n.DayPicker__withBorder {\n  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.07);\n  border-radius: 3px;\n}\n.DayPicker_portal__horizontal {\n  box-shadow: none;\n  position: absolute;\n  left: 50%;\n  top: 50%;\n}\n.DayPicker_portal__vertical {\n  position: initial;\n}\n.DayPicker_focusRegion {\n  outline: 0;\n}\n.DayPicker_calendarInfo__horizontal,\n.DayPicker_wrapper__horizontal {\n  display: inline-block;\n  vertical-align: top;\n}\n.DayPicker_weekHeaders {\n  position: relative;\n}\n.DayPicker_weekHeaders__horizontal {\n  margin-left: 9px;\n}\n.DayPicker_weekHeader {\n  color: #757575;\n  position: absolute;\n  top: 62px;\n  z-index: 2;\n  text-align: left;\n}\n.DayPicker_weekHeader__vertical {\n  left: 50%;\n}\n.DayPicker_weekHeader__verticalScrollable {\n  top: 0;\n  display: table-row;\n  border-bottom: 1px solid #dbdbdb;\n  background: #fff;\n  margin-left: 0;\n  left: 0;\n  width: 100%;\n  text-align: center;\n}\n.DayPicker_weekHeader_ul {\n  list-style: none;\n  margin: 1px 0;\n  padding-left: 0;\n  padding-right: 0;\n  font-size: 14px;\n}\n.DayPicker_weekHeader_li {\n  display: inline-block;\n  text-align: center;\n}\n.DayPicker_transitionContainer {\n  position: relative;\n  overflow: hidden;\n  border-radius: 3px;\n}\n.DayPicker_transitionContainer__horizontal {\n  transition: height 0.2s ease-in-out;\n}\n.DayPicker_transitionContainer__vertical {\n  width: 100%;\n}\n.DayPicker_transitionContainer__verticalScrollable {\n  padding-top: 20px;\n  height: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  left: 0;\n  overflow-y: scroll;\n}\n.DateInput {\n  margin: 0;\n  padding: 0;\n  background: #fff;\n  position: relative;\n  display: inline-block;\n  width: 130px;\n  vertical-align: middle;\n}\n.DateInput__small {\n  width: 97px;\n}\n.DateInput__block {\n  width: 100%;\n}\n.DateInput__disabled {\n  background: #f2f2f2;\n  color: #dbdbdb;\n}\n.DateInput_input {\n  font-weight: 200;\n  font-size: 19px;\n  line-height: 24px;\n  color: #484848;\n  background-color: #fff;\n  width: 100%;\n  padding: 11px 11px 9px;\n  border: 0;\n  border-top: 0;\n  border-right: 0;\n  border-bottom: 2px solid transparent;\n  border-left: 0;\n  border-radius: 0;\n}\n.DateInput_input__small {\n  font-size: 15px;\n  line-height: 18px;\n  letter-spacing: 0.2px;\n  padding: 7px 7px 5px;\n}\n.DateInput_input__regular {\n  font-weight: auto;\n}\n.DateInput_input__readOnly {\n  user-select: none;\n}\n.DateInput_input__focused {\n  outline: 0;\n  background: #fff;\n  border: 0;\n  border-top: 0;\n  border-right: 0;\n  border-bottom: 2px solid #008489;\n  border-left: 0;\n}\n.DateInput_input__disabled {\n  background: #f2f2f2;\n  font-style: italic;\n}\n.DateInput_screenReaderMessage {\n  border: 0;\n  clip: rect(0, 0, 0, 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  width: 1px;\n}\n.DateInput_fang {\n  position: absolute;\n  width: 20px;\n  height: 10px;\n  left: 22px;\n  z-index: 2;\n}\n.DateInput_fangShape {\n  fill: #fff;\n}\n.DateInput_fangStroke {\n  stroke: #dbdbdb;\n  fill: transparent;\n}\n.DateRangePickerInput {\n  background-color: #fff;\n  display: inline-block;\n}\n.DateRangePickerInput__disabled {\n  background: #f2f2f2;\n}\n.DateRangePickerInput__withBorder {\n  border-radius: 2px;\n  border: 1px solid #dbdbdb;\n}\n.DateRangePickerInput__rtl {\n  direction: rtl;\n}\n.DateRangePickerInput__block {\n  display: block;\n}\n.DateRangePickerInput__showClearDates {\n  padding-right: 30px;\n}\n.DateRangePickerInput_arrow {\n  display: inline-block;\n  vertical-align: middle;\n  color: #484848;\n}\n.DateRangePickerInput_arrow_svg {\n  vertical-align: middle;\n  fill: #484848;\n  height: 24px;\n  width: 24px;\n}\n.DateRangePickerInput_clearDates {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  padding: 10px;\n  margin: 0 10px 0 5px;\n  position: absolute;\n  right: 0;\n  top: 50%;\n  transform: translateY(-50%);\n}\n.DateRangePickerInput_clearDates__small {\n  padding: 6px;\n}\n.DateRangePickerInput_clearDates_default:focus,\n.DateRangePickerInput_clearDates_default:hover {\n  background: #dbdbdb;\n  border-radius: 50%;\n}\n.DateRangePickerInput_clearDates__hide {\n  visibility: hidden;\n}\n.DateRangePickerInput_clearDates_svg {\n  fill: #82888a;\n  height: 12px;\n  width: 15px;\n  vertical-align: middle;\n}\n.DateRangePickerInput_clearDates_svg__small {\n  height: 9px;\n}\n.DateRangePickerInput_calendarIcon {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  display: inline-block;\n  vertical-align: middle;\n  padding: 10px;\n  margin: 0 5px 0 10px;\n}\n.DateRangePickerInput_calendarIcon_svg {\n  fill: #82888a;\n  height: 15px;\n  width: 14px;\n  vertical-align: middle;\n}\n.DateRangePicker {\n  position: relative;\n  display: inline-block;\n}\n.DateRangePicker__block {\n  display: block;\n}\n.DateRangePicker_picker {\n  z-index: 1;\n  background-color: #fff;\n  position: absolute;\n}\n.DateRangePicker_picker__rtl {\n  direction: rtl;\n}\n.DateRangePicker_picker__directionLeft {\n  left: 0;\n}\n.DateRangePicker_picker__directionRight {\n  right: 0;\n}\n.DateRangePicker_picker__portal {\n  background-color: rgba(0, 0, 0, 0.3);\n  position: fixed;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n.DateRangePicker_picker__fullScreenPortal {\n  background-color: #fff;\n}\n.DateRangePicker_closeButton {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  position: absolute;\n  top: 0;\n  right: 0;\n  padding: 15px;\n  z-index: 2;\n}\n.DateRangePicker_closeButton:focus,\n.DateRangePicker_closeButton:hover {\n  color: #b0b3b4;\n  text-decoration: none;\n}\n.DateRangePicker_closeButton_svg {\n  height: 15px;\n  width: 15px;\n  fill: #cacccd;\n}';!function(n){const e="s_id-13718576d5f3_3_41_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const i=document.createElement("style");i.id=e,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(n);export{n as default};
+var n='/*  stylelint-disable scss/no-global-function-names */\n.PresetDateRangePicker_panel {\n  padding: 0 22px 11px;\n}\n.PresetDateRangePicker_button {\n  position: relative;\n  height: 100%;\n  text-align: center;\n  background: 0 0;\n  border: 2px solid #00a699;\n  color: #00a699;\n  padding: 4px 12px;\n  margin-right: 8px;\n  font: inherit;\n  font-weight: 700;\n  line-height: normal;\n  overflow: visible;\n  box-sizing: border-box;\n  cursor: pointer;\n}\n.PresetDateRangePicker_button:active {\n  outline: 0;\n}\n.PresetDateRangePicker_button__selected {\n  color: #fff;\n  background: #00a699;\n}\n.SingleDatePickerInput {\n  display: inline-block;\n  background-color: #fff;\n}\n.SingleDatePickerInput__withBorder {\n  border-radius: 2px;\n  border: 1px solid #dbdbdb;\n}\n.SingleDatePickerInput__rtl {\n  direction: rtl;\n}\n.SingleDatePickerInput__disabled {\n  background-color: #f2f2f2;\n}\n.SingleDatePickerInput__block {\n  display: block;\n}\n.SingleDatePickerInput__showClearDate {\n  padding-right: 30px;\n}\n.SingleDatePickerInput_clearDate {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  padding: 10px;\n  margin: 0 10px 0 5px;\n  position: absolute;\n  right: 0;\n  top: 50%;\n  transform: translateY(-50%);\n}\n.SingleDatePickerInput_clearDate__default:focus,\n.SingleDatePickerInput_clearDate__default:hover {\n  background: #dbdbdb;\n  border-radius: 50%;\n}\n.SingleDatePickerInput_clearDate__small {\n  padding: 6px;\n}\n.SingleDatePickerInput_clearDate__hide {\n  visibility: hidden;\n}\n.SingleDatePickerInput_clearDate_svg {\n  fill: #82888a;\n  height: 12px;\n  width: 15px;\n  vertical-align: middle;\n}\n.SingleDatePickerInput_clearDate_svg__small {\n  height: 9px;\n}\n.SingleDatePickerInput_calendarIcon {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  display: inline-block;\n  vertical-align: middle;\n  padding: 10px;\n  margin: 0 5px 0 10px;\n}\n.SingleDatePickerInput_calendarIcon_svg {\n  fill: #82888a;\n  height: 15px;\n  width: 14px;\n  vertical-align: middle;\n}\n.SingleDatePicker {\n  position: relative;\n  display: inline-block;\n}\n.SingleDatePicker__block {\n  display: block;\n}\n.SingleDatePicker_picker {\n  z-index: 1;\n  background-color: #fff;\n  position: absolute;\n}\n.SingleDatePicker_picker__rtl {\n  direction: rtl;\n}\n.SingleDatePicker_picker__directionLeft {\n  left: 0;\n}\n.SingleDatePicker_picker__directionRight {\n  right: 0;\n}\n.SingleDatePicker_picker__portal {\n  background-color: rgba(0, 0, 0, 0.3);\n  position: fixed;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n.SingleDatePicker_picker__fullScreenPortal {\n  background-color: #fff;\n}\n.SingleDatePicker_closeButton {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  position: absolute;\n  top: 0;\n  right: 0;\n  padding: 15px;\n  z-index: 2;\n}\n.SingleDatePicker_closeButton:focus,\n.SingleDatePicker_closeButton:hover {\n  color: #b0b3b4;\n  text-decoration: none;\n}\n.SingleDatePicker_closeButton_svg {\n  height: 15px;\n  width: 15px;\n  fill: #cacccd;\n}\n.DayPickerKeyboardShortcuts_buttonReset {\n  background: 0 0;\n  border: 0;\n  border-radius: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  padding: 0;\n  cursor: pointer;\n  font-size: 14px;\n}\n.DayPickerKeyboardShortcuts_buttonReset:active {\n  outline: 0;\n}\n.DayPickerKeyboardShortcuts_show {\n  width: 33px;\n  height: 26px;\n  position: absolute;\n  z-index: 2;\n}\n.DayPickerKeyboardShortcuts_show::before {\n  content: "";\n  display: block;\n  position: absolute;\n}\n.DayPickerKeyboardShortcuts_show__bottomRight {\n  bottom: 0;\n  right: 0;\n}\n.DayPickerKeyboardShortcuts_show__bottomRight::before {\n  border-top: 26px solid transparent;\n  border-right: 33px solid #00a699;\n  bottom: 0;\n  right: 0;\n}\n.DayPickerKeyboardShortcuts_show__bottomRight:hover::before {\n  border-right: 33px solid #008489;\n}\n.DayPickerKeyboardShortcuts_show__topRight {\n  top: 0;\n  right: 0;\n}\n.DayPickerKeyboardShortcuts_show__topRight::before {\n  border-bottom: 26px solid transparent;\n  border-right: 33px solid #00a699;\n  top: 0;\n  right: 0;\n}\n.DayPickerKeyboardShortcuts_show__topRight:hover::before {\n  border-right: 33px solid #008489;\n}\n.DayPickerKeyboardShortcuts_show__topLeft {\n  top: 0;\n  left: 0;\n}\n.DayPickerKeyboardShortcuts_show__topLeft::before {\n  border-bottom: 26px solid transparent;\n  border-left: 33px solid #00a699;\n  top: 0;\n  left: 0;\n}\n.DayPickerKeyboardShortcuts_show__topLeft:hover::before {\n  border-left: 33px solid #008489;\n}\n.DayPickerKeyboardShortcuts_showSpan {\n  color: #fff;\n  position: absolute;\n}\n.DayPickerKeyboardShortcuts_showSpan__bottomRight {\n  bottom: 0;\n  right: 5px;\n}\n.DayPickerKeyboardShortcuts_showSpan__topRight {\n  top: 1px;\n  right: 5px;\n}\n.DayPickerKeyboardShortcuts_showSpan__topLeft {\n  top: 1px;\n  left: 5px;\n}\n.DayPickerKeyboardShortcuts_panel {\n  overflow: auto;\n  background: #fff;\n  border: 1px solid #dbdbdb;\n  border-radius: 2px;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  left: 0;\n  z-index: 2;\n  padding: 22px;\n  margin: 33px;\n  text-align: left;\n}\n.DayPickerKeyboardShortcuts_title {\n  font-size: 16px;\n  font-weight: 700;\n  margin: 0;\n}\n.DayPickerKeyboardShortcuts_list {\n  list-style: none;\n  padding: 0;\n  font-size: 14px;\n}\n.DayPickerKeyboardShortcuts_close {\n  position: absolute;\n  right: 22px;\n  top: 22px;\n  z-index: 2;\n}\n.DayPickerKeyboardShortcuts_close:active {\n  outline: 0;\n}\n.DayPickerKeyboardShortcuts_closeSvg {\n  height: 15px;\n  width: 15px;\n  fill: #cacccd;\n}\n.DayPickerKeyboardShortcuts_closeSvg:focus,\n.DayPickerKeyboardShortcuts_closeSvg:hover {\n  fill: #82888a;\n}\n.CalendarDay {\n  box-sizing: border-box;\n  cursor: pointer;\n  font-size: 14px;\n  text-align: center;\n}\n.CalendarDay:active {\n  outline: 0;\n}\n.CalendarDay__defaultCursor {\n  cursor: default;\n}\n.CalendarDay__default {\n  border: 1px solid #e4e7e7;\n  color: #484848;\n  background: #fff;\n}\n.CalendarDay__default:hover {\n  background: #e4e7e7;\n  border: 1px solid #e4e7e7;\n  color: inherit;\n}\n.CalendarDay__hovered_offset {\n  background: #f4f5f5;\n  border: 1px double #e4e7e7;\n  color: inherit;\n}\n.CalendarDay__outside {\n  border: 0;\n  background: #fff;\n  color: #484848;\n}\n.CalendarDay__outside:hover {\n  border: 0;\n}\n.CalendarDay__blocked_minimum_nights {\n  background: #fff;\n  border: 1px solid #eceeee;\n  color: #cacccd;\n}\n.CalendarDay__blocked_minimum_nights:active,\n.CalendarDay__blocked_minimum_nights:hover {\n  background: #fff;\n  color: #cacccd;\n}\n.CalendarDay__highlighted_calendar {\n  background: #ffe8bc;\n  color: #484848;\n}\n.CalendarDay__highlighted_calendar:active,\n.CalendarDay__highlighted_calendar:hover {\n  background: #ffce71;\n  color: #484848;\n}\n.CalendarDay__selected_span {\n  background: #66e2da;\n  border: 1px double #33dacd;\n  color: #fff;\n}\n.CalendarDay__selected_span:active,\n.CalendarDay__selected_span:hover {\n  background: #33dacd;\n  border: 1px double #33dacd;\n  color: #fff;\n}\n.CalendarDay__selected,\n.CalendarDay__selected:active,\n.CalendarDay__selected:hover {\n  background: #00a699;\n  border: 1px double #00a699;\n  color: #fff;\n}\n.CalendarDay__hovered_span,\n.CalendarDay__hovered_span:hover {\n  background: #b2f1ec;\n  border: 1px double #80e8e0;\n  color: #007a87;\n}\n.CalendarDay__hovered_span:active {\n  background: #80e8e0;\n  border: 1px double #80e8e0;\n  color: #007a87;\n}\n.CalendarDay__blocked_calendar,\n.CalendarDay__blocked_calendar:active,\n.CalendarDay__blocked_calendar:hover {\n  background: #cacccd;\n  border: 1px solid #cacccd;\n  color: #82888a;\n}\n.CalendarDay__blocked_out_of_range,\n.CalendarDay__blocked_out_of_range:active,\n.CalendarDay__blocked_out_of_range:hover {\n  background: #fff;\n  border: 1px solid #e4e7e7;\n  color: #cacccd;\n}\n.CalendarDay__hovered_start_first_possible_end {\n  background: #eceeee;\n  border: 1px double #eceeee;\n}\n.CalendarDay__hovered_start_blocked_min_nights {\n  background: #eceeee;\n  border: 1px double #e4e7e7;\n}\n.CalendarMonth {\n  background: #fff;\n  text-align: center;\n  vertical-align: top;\n  user-select: none;\n}\n.CalendarMonth_table {\n  border-collapse: collapse;\n  border-spacing: 0;\n}\n.CalendarMonth_verticalSpacing {\n  border-collapse: separate;\n}\n.CalendarMonth_caption {\n  color: #484848;\n  font-size: 18px;\n  text-align: center;\n  padding-top: 22px;\n  padding-bottom: 37px;\n  caption-side: initial;\n}\n.CalendarMonth_caption__verticalScrollable {\n  padding-top: 12px;\n  padding-bottom: 7px;\n}\n.CalendarMonthGrid {\n  background: #fff;\n  text-align: left;\n  z-index: 0;\n}\n.CalendarMonthGrid__animating {\n  z-index: 1;\n}\n.CalendarMonthGrid__horizontal {\n  position: absolute;\n  left: 9px;\n}\n.CalendarMonthGrid__vertical,\n.CalendarMonthGrid__vertical_scrollable {\n  margin: 0 auto;\n}\n.CalendarMonthGrid_month__horizontal {\n  display: inline-block;\n  vertical-align: top;\n  min-height: 100%;\n}\n.CalendarMonthGrid_month__hideForAnimation {\n  position: absolute;\n  z-index: -1;\n  opacity: 0;\n  pointer-events: none;\n}\n.CalendarMonthGrid_month__hidden {\n  visibility: hidden;\n}\n.DayPickerNavigation {\n  position: relative;\n  z-index: 2;\n}\n.DayPickerNavigation__horizontal {\n  height: 0;\n}\n.DayPickerNavigation__verticalScrollable_prevNav {\n  z-index: 1;\n}\n.DayPickerNavigation__verticalDefault {\n  position: absolute;\n  width: 100%;\n  height: 52px;\n  bottom: 0;\n  left: 0;\n}\n.DayPickerNavigation__verticalScrollableDefault {\n  position: relative;\n}\n.DayPickerNavigation__bottom {\n  height: auto;\n}\n.DayPickerNavigation__bottomDefault {\n  -webkit-box-pack: justify;\n  -ms-flex-pack: justify;\n  display: flex;\n  justify-content: space-between;\n}\n.DayPickerNavigation_button {\n  cursor: pointer;\n  user-select: none;\n  border: 0;\n  padding: 0;\n  margin: 0;\n}\n.DayPickerNavigation_button__default {\n  border: 1px solid #e4e7e7;\n  background-color: #fff;\n  color: #757575;\n}\n.DayPickerNavigation_button__default:focus,\n.DayPickerNavigation_button__default:hover {\n  border: 1px solid #c4c4c4;\n}\n.DayPickerNavigation_button__default:active {\n  background: #f2f2f2;\n}\n.DayPickerNavigation_button__disabled {\n  cursor: default;\n  border: 1px solid #f2f2f2;\n}\n.DayPickerNavigation_button__disabled:focus,\n.DayPickerNavigation_button__disabled:hover {\n  border: 1px solid #f2f2f2;\n}\n.DayPickerNavigation_button__disabled:active {\n  background: 0 0;\n}\n.DayPickerNavigation_button__horizontalDefault {\n  position: absolute;\n  top: 18px;\n  line-height: 0.78;\n  border-radius: 3px;\n  padding: 6px 9px;\n}\n.DayPickerNavigation_bottomButton__horizontalDefault {\n  position: static;\n  margin: -10px 22px 30px;\n}\n.DayPickerNavigation_leftButton__horizontalDefault {\n  left: 22px;\n}\n.DayPickerNavigation_rightButton__horizontalDefault {\n  right: 22px;\n}\n.DayPickerNavigation_button__verticalDefault {\n  padding: 5px;\n  background: #fff;\n  box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1);\n  position: relative;\n  display: inline-block;\n  text-align: center;\n  height: 100%;\n  width: 50%;\n}\n.DayPickerNavigation_nextButton__verticalDefault {\n  border-left: 0;\n}\n.DayPickerNavigation_nextButton__verticalScrollableDefault,\n.DayPickerNavigation_prevButton__verticalScrollableDefault {\n  width: 100%;\n}\n.DayPickerNavigation_svg__horizontal {\n  height: 19px;\n  width: 19px;\n  fill: #82888a;\n  display: block;\n}\n.DayPickerNavigation_svg__vertical {\n  height: 42px;\n  width: 42px;\n  fill: #484848;\n}\n.DayPickerNavigation_svg__disabled {\n  fill: #f2f2f2;\n}\n.DayPicker {\n  background: #fff;\n  position: relative;\n  text-align: left;\n}\n.DayPicker__horizontal {\n  background: #fff;\n}\n.DayPicker__verticalScrollable {\n  height: 100%;\n}\n.DayPicker__hidden {\n  visibility: hidden;\n}\n.DayPicker__withBorder {\n  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.07);\n  border-radius: 3px;\n}\n.DayPicker_portal__horizontal {\n  box-shadow: none;\n  position: absolute;\n  left: 50%;\n  top: 50%;\n}\n.DayPicker_portal__vertical {\n  position: initial;\n}\n.DayPicker_focusRegion {\n  outline: 0;\n}\n.DayPicker_calendarInfo__horizontal,\n.DayPicker_wrapper__horizontal {\n  display: inline-block;\n  vertical-align: top;\n}\n.DayPicker_weekHeaders {\n  position: relative;\n}\n.DayPicker_weekHeaders__horizontal {\n  margin-left: 9px;\n}\n.DayPicker_weekHeader {\n  color: #757575;\n  position: absolute;\n  top: 62px;\n  z-index: 2;\n  text-align: left;\n}\n.DayPicker_weekHeader__vertical {\n  left: 50%;\n}\n.DayPicker_weekHeader__verticalScrollable {\n  top: 0;\n  display: table-row;\n  border-bottom: 1px solid #dbdbdb;\n  background: #fff;\n  margin-left: 0;\n  left: 0;\n  width: 100%;\n  text-align: center;\n}\n.DayPicker_weekHeader_ul {\n  list-style: none;\n  margin: 1px 0;\n  padding-left: 0;\n  padding-right: 0;\n  font-size: 14px;\n}\n.DayPicker_weekHeader_li {\n  display: inline-block;\n  text-align: center;\n}\n.DayPicker_transitionContainer {\n  position: relative;\n  overflow: hidden;\n  border-radius: 3px;\n}\n.DayPicker_transitionContainer__horizontal {\n  transition: height 0.2s ease-in-out;\n}\n.DayPicker_transitionContainer__vertical {\n  width: 100%;\n}\n.DayPicker_transitionContainer__verticalScrollable {\n  padding-top: 20px;\n  height: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  left: 0;\n  overflow-y: scroll;\n}\n.DateInput {\n  margin: 0;\n  padding: 0;\n  background: #fff;\n  position: relative;\n  display: inline-block;\n  width: 130px;\n  vertical-align: middle;\n}\n.DateInput__small {\n  width: 97px;\n}\n.DateInput__block {\n  width: 100%;\n}\n.DateInput__disabled {\n  background: #f2f2f2;\n  color: #dbdbdb;\n}\n.DateInput_input {\n  font-weight: 200;\n  font-size: 19px;\n  line-height: 24px;\n  color: #484848;\n  background-color: #fff;\n  width: 100%;\n  padding: 11px 11px 9px;\n  border: 0;\n  border-top: 0;\n  border-right: 0;\n  border-bottom: 2px solid transparent;\n  border-left: 0;\n  border-radius: 0;\n}\n.DateInput_input__small {\n  font-size: 15px;\n  line-height: 18px;\n  letter-spacing: 0.2px;\n  padding: 7px 7px 5px;\n}\n.DateInput_input__regular {\n  font-weight: auto;\n}\n.DateInput_input__readOnly {\n  user-select: none;\n}\n.DateInput_input__focused {\n  outline: 0;\n  background: #fff;\n  border: 0;\n  border-top: 0;\n  border-right: 0;\n  border-bottom: 2px solid #008489;\n  border-left: 0;\n}\n.DateInput_input__disabled {\n  background: #f2f2f2;\n  font-style: italic;\n}\n.DateInput_screenReaderMessage {\n  border: 0;\n  clip: rect(0, 0, 0, 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  width: 1px;\n}\n.DateInput_fang {\n  position: absolute;\n  width: 20px;\n  height: 10px;\n  left: 22px;\n  z-index: 2;\n}\n.DateInput_fangShape {\n  fill: #fff;\n}\n.DateInput_fangStroke {\n  stroke: #dbdbdb;\n  fill: transparent;\n}\n.DateRangePickerInput {\n  background-color: #fff;\n  display: inline-block;\n}\n.DateRangePickerInput__disabled {\n  background: #f2f2f2;\n}\n.DateRangePickerInput__withBorder {\n  border-radius: 2px;\n  border: 1px solid #dbdbdb;\n}\n.DateRangePickerInput__rtl {\n  direction: rtl;\n}\n.DateRangePickerInput__block {\n  display: block;\n}\n.DateRangePickerInput__showClearDates {\n  padding-right: 30px;\n}\n.DateRangePickerInput_arrow {\n  display: inline-block;\n  vertical-align: middle;\n  color: #484848;\n}\n.DateRangePickerInput_arrow_svg {\n  vertical-align: middle;\n  fill: #484848;\n  height: 24px;\n  width: 24px;\n}\n.DateRangePickerInput_clearDates {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  padding: 10px;\n  margin: 0 10px 0 5px;\n  position: absolute;\n  right: 0;\n  top: 50%;\n  transform: translateY(-50%);\n}\n.DateRangePickerInput_clearDates__small {\n  padding: 6px;\n}\n.DateRangePickerInput_clearDates_default:focus,\n.DateRangePickerInput_clearDates_default:hover {\n  background: #dbdbdb;\n  border-radius: 50%;\n}\n.DateRangePickerInput_clearDates__hide {\n  visibility: hidden;\n}\n.DateRangePickerInput_clearDates_svg {\n  fill: #82888a;\n  height: 12px;\n  width: 15px;\n  vertical-align: middle;\n}\n.DateRangePickerInput_clearDates_svg__small {\n  height: 9px;\n}\n.DateRangePickerInput_calendarIcon {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  display: inline-block;\n  vertical-align: middle;\n  padding: 10px;\n  margin: 0 5px 0 10px;\n}\n.DateRangePickerInput_calendarIcon_svg {\n  fill: #82888a;\n  height: 15px;\n  width: 14px;\n  vertical-align: middle;\n}\n.DateRangePicker {\n  position: relative;\n  display: inline-block;\n}\n.DateRangePicker__block {\n  display: block;\n}\n.DateRangePicker_picker {\n  z-index: 1;\n  background-color: #fff;\n  position: absolute;\n}\n.DateRangePicker_picker__rtl {\n  direction: rtl;\n}\n.DateRangePicker_picker__directionLeft {\n  left: 0;\n}\n.DateRangePicker_picker__directionRight {\n  right: 0;\n}\n.DateRangePicker_picker__portal {\n  background-color: rgba(0, 0, 0, 0.3);\n  position: fixed;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n.DateRangePicker_picker__fullScreenPortal {\n  background-color: #fff;\n}\n.DateRangePicker_closeButton {\n  background: 0 0;\n  border: 0;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  cursor: pointer;\n  position: absolute;\n  top: 0;\n  right: 0;\n  padding: 15px;\n  z-index: 2;\n}\n.DateRangePicker_closeButton:focus,\n.DateRangePicker_closeButton:hover {\n  color: #b0b3b4;\n  text-decoration: none;\n}\n.DateRangePicker_closeButton_svg {\n  height: 15px;\n  width: 15px;\n  fill: #cacccd;\n}';!function(n){const e="s_id-13718576d5f3_3_42_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const i=document.createElement("style");i.id=e,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(n);export{n as default};
 //# sourceMappingURL=external_datepicker.scss.js.map

package/dist/src/components/Dialog/Dialog.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{inherits as e,createClass as n,toConsumableArray as o,classCallCheck as t,callSuper as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import s from"classnames";import r,{PureComponent as a}from"react";import{createPortal as l}from"react-dom";import{Manager as u,Reference as d,Popper as h}from"react-popper";import{isFunction as c}from"lodash-es";import{NOOP as p,convertToArray as m,chainFunctions as g}from"../../utils/function-utils.js";import{DialogContent as f}from"./DialogContent/DialogContent.js";import{isInsideClass as v}from"../../utils/dom-utils.js";import{Refable as D}from"../Refable/Refable.js";import{HideShowEvent as y,DialogPosition as w,AnimationType as E}from"./DialogConstants.js";import k from"./Dialog.module.scss.js";import{getTestId as C,ComponentDefaultTestId as T}from"../../tests/testIds.js";import S from"../LayerProvider/LayerContext.js";import{isClient as b}from"../../utils/ssr-utils.js";import{createObserveContentResizeModifier as O}from"./modifiers/observeContentResizeModifier.js";var M=function(p){function g(e){var n;return t(this,g),(n=i(this,g,[e])).state={shouldUseDerivedStateFromProps:e.useDerivedStateFromProps,isOpen:e.shouldShowOnMount},n.onMouseEnter=n.onMouseEnter.bind(n),n.onMouseLeave=n.onMouseLeave.bind(n),n.onMouseDown=n.onMouseDown.bind(n),n.onClick=n.onClick.bind(n),n.onFocus=n.onFocus.bind(n),n.onBlur=n.onBlur.bind(n),n.isShown=n.isShown.bind(n),n.onEsc=n.onEsc.bind(n),n.onClickOutside=n.onClickOutside.bind(n),n.onDialogEnter=n.onDialogEnter.bind(n),n.onDialogLeave=n.onDialogLeave.bind(n),n.getContainer=n.getContainer.bind(n),n.onContentClick=n.onContentClick.bind(n),n.onKeyDown=n.onKeyDown.bind(n),n.closeDialogOnEscape=n.closeDialogOnEscape.bind(n),n.onContextMenu=n.onContextMenu.bind(n),n.hideTimeout=null,n.showTimeout=null,n}return e(g,a),n(g,[{key:"closeDialogOnEscape",value:function(e){if(this.state.isOpen)switch(e.key){case"Escape":this.hideDialogIfNeeded(e,y.ESCAPE_KEY);break;case"Tab":this.handleEvent(y.TAB_KEY,e.target,e);break;case"Enter":this.handleEvent(y.ENTER,e.target,e)}}},{key:"componentDidMount",value:function(){var e=this.props,n=e.shouldCallbackOnMount,o=e.onDialogDidShow,t=this.state.isOpen;b()&&document.addEventListener("keyup",this.closeDialogOnEscape),n&&t&&o&&o()}},{key:"componentWillUnmount",value:function(){b()&&document.removeEventListener("keyup",this.closeDialogOnEscape)}},{key:"getContainer",value:function(){var e=document.querySelector(this.props.containerSelector);if(!(e&&e instanceof Element)){var n=this.context.layerRef;return(null==n?void 0:n.current)?n.current:document.body}return e}},{key:"showDialog",value:function(e,n){var o=this,t=this.props,i=t.instantShowAndHide,s=t.getDynamicShowDelay,r=t.showDelay,a=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).preventAnimation;if(s){var l=s();r=l.showDelay||0,a=a||l.preventAnimation}i?(this.onShowDialog(e,n),this.setState({isOpen:!0,preventAnimation:a}),this.showTimeout=null):this.showTimeout=setTimeout((function(){o.onShowDialog(e,n),o.showTimeout=null,o.setState({isOpen:!0,preventAnimation:a})}),r)}},{key:"onShowDialog",value:function(e,n){this.isShown()||(0,this.props.onDialogDidShow)(e,n)}},{key:"showDialogIfNeeded",value:function(e,n){var o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};this.props.disable||(this.hideTimeout&&(clearTimeout(this.hideTimeout),this.hideTimeout=null),this.showTimeout||this.showDialog(e,n,o))}},{key:"hideDialog",value:function(e,n){var o=this,t=this.props,i=t.hideDelay;t.instantShowAndHide?(this.onHideDialog(e,n),this.setState({isOpen:!1}),this.hideTimeout=null):this.hideTimeout=setTimeout((function(){o.onHideDialog(e,n),o.setState({isOpen:!1}),o.hideTimeout=null}),i)}},{key:"onHideDialog",value:function(e,n){var o=this.props.onDialogDidHide;o&&o(e,n)}},{key:"hideDialogIfNeeded",value:function(e,n){this.showTimeout&&(clearTimeout(this.showTimeout),this.showTimeout=null),this.hideTimeout||this.hideDialog(e,n)}},{key:"handleEvent",value:function(e,n,o){var t=this.props,i=t.showTriggerIgnoreClass,s=t.hideTriggerIgnoreClass;return!this.isShowTrigger(e)||this.isShown()||v(n,i)?this.isHideTrigger(e)&&!v(n,s)?this.hideDialogIfNeeded(o,e):void 0:this.showDialogIfNeeded(o,e)}},{key:"isShown",value:function(){return this.state.isOpen||this.props.open}},{key:"isShowTrigger",value:function(e){var n=this.props,o=n.addKeyboardHideShowTriggersByDefault,t=m(n.showTrigger);return!(!o||"focus"!==e||-1>=t.indexOf("mouseenter"))||t.indexOf(e)>-1}},{key:"isHideTrigger",value:function(e){var n=this.props,o=n.addKeyboardHideShowTriggersByDefault,t=m(n.hideTrigger);return!(!o||"blur"!==e||-1>=t.indexOf("mouseleave"))||t.indexOf(e)>-1}},{key:"onMouseEnter",value:function(e){this.handleEvent("mouseenter",e.target,e)}},{key:"onMouseLeave",value:function(e){this.handleEvent("mouseleave",e.target,e)}},{key:"onClick",value:function(e){e.button||this.handleEvent("click",e.target,e)}},{key:"onKeyDown",value:function(e){"Enter"===e.key&&this.handleEvent("enter",e.target,e),"Tab"===e.key&&this.handleEvent("tab",e.target,e)}},{key:"onMouseDown",value:function(e){e.button||this.handleEvent("mousedown",e.target,e)}},{key:"onFocus",value:function(e){this.handleEvent("focus",e.target,e)}},{key:"onBlur",value:function(e){this.handleEvent("blur",e.relatedTarget,e)}},{key:"onEsc",value:function(e){this.handleEvent("esckey",e.target,e)}},{key:"onContextMenu",value:function(e){var n=this.isShown();(this.isShowTrigger("contextmenu")&&!n||this.isHideTrigger("contextmenu")&&n)&&e.preventDefault(),this.handleEvent("contextmenu",e.target,e)}},{key:"onClickOutside",value:function(e){var n=this.props.onClickOutside;this.handleEvent("clickoutside",e.target,e),n(e)}},{key:"onDialogEnter",value:function(e){this.props.showOnDialogEnter&&this.showDialogIfNeeded(e,"DialogEnter")}},{key:"onDialogLeave",value:function(e){this.props.showOnDialogEnter&&this.hideDialogIfNeeded(e,"DialogLeave")}},{key:"onContentClick",value:function(e){var n=this.props.onContentClick;this.handleEvent("onContentClick",e.target,e),n(e)}},{key:"render",value:function(){var e=this,n=this.props,t=n.wrapperClassName,i=n.content,a=n.startingEdge,p=n.children,m=n.preventAnimationOnMount,g=n.animationType,v=n.position,y=n.showDelay,w=n.moveBy,E=n.modifiers,S=n.tooltip,M=n.tooltipClassName,H=n.referenceWrapperClassName,L=n.zIndex,A=n.hideWhenReferenceHidden,N=n.disableContainerScroll,I=n.containerSelector,R=n.observeContentResize,j=this.state.preventAnimation,B=n["data-testid"]||C(T.DIALOG,n.id),P=m||j?void 0:g,F=c(i)?i():i;return F?r.createElement(u,null,r.createElement(d,null,(function(n){var o=n.ref;return r.createElement(D,{className:s(H),ref:o,onBlur:x("onBlur",e,e.props),onKeyDown:x("onKeyDown",e,e.props),onClick:x("onClick",e,e.props),onFocus:x("onFocus",e,e.props),onMouseDown:x("onMouseDown",e,e.props),onMouseEnter:x("onMouseEnter",e,e.props),onMouseLeave:x("onMouseLeave",e,e.props),onContextMenu:x("onContextMenu",e,e.props)},p)})),b()&&l(r.createElement(h,{placement:v,modifiers:[{name:"offset",options:{offset:[w.secondary,w.main]}},{name:"zIndex",enabled:!0,phase:"write",fn:function(e){var n=e.state;return L&&(n.styles.popper.zIndex=L+""),n}},{name:"rotator",enabled:!0,phase:"write",fn:function(e){var n=e.state;return n.styles.arrow?(n.styles.arrow.transform="".concat(n.styles.arrow.transform," rotate(45deg)"),n):n}},O(R)].concat(o(E))},(function(n){var o=n.placement,i=n.style,l=n.ref,u=n.arrowProps,d=n.isReferenceHidden;if(!e.isShown()&&o)return null;if(A&&d){var h=new CustomEvent("onReferenceHidden");e.hideDialog(h,"onReferenceHidden")}return r.createElement(f,{"data-testid":B,isReferenceHidden:A&&d,onMouseEnter:e.onDialogEnter,onMouseLeave:e.onDialogLeave,onClickOutside:e.onClickOutside,onContextMenu:e.onContextMenu,onEsc:e.onEsc,animationType:P,position:o,wrapperClassName:t,startingEdge:a,isOpen:e.isShown(),showDelay:y,styleObject:i,ref:l,onClick:e.onContentClick,hasTooltip:!!S,containerSelector:I,disableContainerScroll:N},F,S&&r.createElement("div",{style:u.style,ref:u.ref,className:s(k.arrow,M),"data-placement":o}))})),this.getContainer())):p}}],[{key:"getDerivedStateFromProps",value:function(e,n){return n.shouldUseDerivedStateFromProps?{isOpen:e.isOpen}:null}}])}();function x(e,n,o){return g([o[e],n[e]],!0)}M.hideShowTriggers=y,M.positions=w,M.animationTypes=E,M.defaultProps={position:"top",modifiers:[],moveBy:{main:0,secondary:0},showDelay:100,hideDelay:100,showTrigger:M.hideShowTriggers.MOUSE_ENTER,hideTrigger:M.hideShowTriggers.MOUSE_LEAVE,showOnDialogEnter:!1,shouldShowOnMount:!1,disable:!1,open:!1,animationType:M.animationTypes.EXPAND,preventAnimationOnMount:!1,tooltip:!1,onDialogDidShow:p,onDialogDidHide:p,onClickOutside:p,onContentClick:p,useDerivedStateFromProps:!1,hideWhenReferenceHidden:!1,shouldCallbackOnMount:!1,instantShowAndHide:!1,addKeyboardHideShowTriggersByDefault:!1,observeContentResize:!1},M.contextType=S;export{M as default};
+import{inherits as e,createClass as n,toConsumableArray as o,classCallCheck as t,callSuper as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import s from"classnames";import r,{PureComponent as a}from"react";import{createPortal as l}from"react-dom";import{Manager as u,Reference as d,Popper as h}from"react-popper";import{isFunction as c}from"lodash-es";import{NOOP as p,convertToArray as m,chainFunctions as g}from"../../utils/function-utils.js";import f from"./DialogContent/DialogContent.js";import{isInsideClass as v}from"../../utils/dom-utils.js";import{Refable as D}from"../Refable/Refable.js";import{HideShowEvent as y,DialogPosition as w,AnimationType as E}from"./DialogConstants.js";import k from"./Dialog.module.scss.js";import{getTestId as C,ComponentDefaultTestId as T}from"../../tests/testIds.js";import S from"../LayerProvider/LayerContext.js";import{isClient as b}from"../../utils/ssr-utils.js";import{createObserveContentResizeModifier as O}from"./modifiers/observeContentResizeModifier.js";var M=function(p){function g(e){var n;return t(this,g),(n=i(this,g,[e])).state={shouldUseDerivedStateFromProps:e.useDerivedStateFromProps,isOpen:e.shouldShowOnMount},n.onMouseEnter=n.onMouseEnter.bind(n),n.onMouseLeave=n.onMouseLeave.bind(n),n.onMouseDown=n.onMouseDown.bind(n),n.onClick=n.onClick.bind(n),n.onFocus=n.onFocus.bind(n),n.onBlur=n.onBlur.bind(n),n.isShown=n.isShown.bind(n),n.onEsc=n.onEsc.bind(n),n.onClickOutside=n.onClickOutside.bind(n),n.onDialogEnter=n.onDialogEnter.bind(n),n.onDialogLeave=n.onDialogLeave.bind(n),n.getContainer=n.getContainer.bind(n),n.onContentClick=n.onContentClick.bind(n),n.onKeyDown=n.onKeyDown.bind(n),n.closeDialogOnEscape=n.closeDialogOnEscape.bind(n),n.onContextMenu=n.onContextMenu.bind(n),n.hideTimeout=null,n.showTimeout=null,n}return e(g,a),n(g,[{key:"closeDialogOnEscape",value:function(e){if(this.state.isOpen)switch(e.key){case"Escape":this.hideDialogIfNeeded(e,y.ESCAPE_KEY);break;case"Tab":this.handleEvent(y.TAB_KEY,e.target,e);break;case"Enter":this.handleEvent(y.ENTER,e.target,e)}}},{key:"componentDidMount",value:function(){var e=this.props,n=e.shouldCallbackOnMount,o=e.onDialogDidShow,t=this.state.isOpen;b()&&document.addEventListener("keyup",this.closeDialogOnEscape),n&&t&&o&&o()}},{key:"componentWillUnmount",value:function(){b()&&document.removeEventListener("keyup",this.closeDialogOnEscape)}},{key:"getContainer",value:function(){var e=document.querySelector(this.props.containerSelector);if(!(e&&e instanceof Element)){var n=this.context.layerRef;return(null==n?void 0:n.current)?n.current:document.body}return e}},{key:"showDialog",value:function(e,n){var o=this,t=this.props,i=t.instantShowAndHide,s=t.getDynamicShowDelay,r=t.showDelay,a=(arguments.length>2&&void 0!==arguments[2]?arguments[2]:{}).preventAnimation;if(s){var l=s();r=l.showDelay||0,a=a||l.preventAnimation}i?(this.onShowDialog(e,n),this.setState({isOpen:!0,preventAnimation:a}),this.showTimeout=null):this.showTimeout=setTimeout((function(){o.onShowDialog(e,n),o.showTimeout=null,o.setState({isOpen:!0,preventAnimation:a})}),r)}},{key:"onShowDialog",value:function(e,n){this.isShown()||(0,this.props.onDialogDidShow)(e,n)}},{key:"showDialogIfNeeded",value:function(e,n){var o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};this.props.disable||(this.hideTimeout&&(clearTimeout(this.hideTimeout),this.hideTimeout=null),this.showTimeout||this.showDialog(e,n,o))}},{key:"hideDialog",value:function(e,n){var o=this,t=this.props,i=t.hideDelay;t.instantShowAndHide?(this.onHideDialog(e,n),this.setState({isOpen:!1}),this.hideTimeout=null):this.hideTimeout=setTimeout((function(){o.onHideDialog(e,n),o.setState({isOpen:!1}),o.hideTimeout=null}),i)}},{key:"onHideDialog",value:function(e,n){var o=this.props.onDialogDidHide;o&&o(e,n)}},{key:"hideDialogIfNeeded",value:function(e,n){this.showTimeout&&(clearTimeout(this.showTimeout),this.showTimeout=null),this.hideTimeout||this.hideDialog(e,n)}},{key:"handleEvent",value:function(e,n,o){var t=this.props,i=t.showTriggerIgnoreClass,s=t.hideTriggerIgnoreClass;return!this.isShowTrigger(e)||this.isShown()||v(n,i)?this.isHideTrigger(e)&&!v(n,s)?this.hideDialogIfNeeded(o,e):void 0:this.showDialogIfNeeded(o,e)}},{key:"isShown",value:function(){return this.state.isOpen||this.props.open}},{key:"isShowTrigger",value:function(e){var n=this.props,o=n.addKeyboardHideShowTriggersByDefault,t=m(n.showTrigger);return!(!o||"focus"!==e||-1>=t.indexOf("mouseenter"))||t.indexOf(e)>-1}},{key:"isHideTrigger",value:function(e){var n=this.props,o=n.addKeyboardHideShowTriggersByDefault,t=m(n.hideTrigger);return!(!o||"blur"!==e||-1>=t.indexOf("mouseleave"))||t.indexOf(e)>-1}},{key:"onMouseEnter",value:function(e){this.handleEvent("mouseenter",e.target,e)}},{key:"onMouseLeave",value:function(e){this.handleEvent("mouseleave",e.target,e)}},{key:"onClick",value:function(e){e.button||this.handleEvent("click",e.target,e)}},{key:"onKeyDown",value:function(e){"Enter"===e.key&&this.handleEvent("enter",e.target,e),"Tab"===e.key&&this.handleEvent("tab",e.target,e)}},{key:"onMouseDown",value:function(e){e.button||this.handleEvent("mousedown",e.target,e)}},{key:"onFocus",value:function(e){this.handleEvent("focus",e.target,e)}},{key:"onBlur",value:function(e){this.handleEvent("blur",e.relatedTarget,e)}},{key:"onEsc",value:function(e){this.handleEvent("esckey",e.target,e)}},{key:"onContextMenu",value:function(e){var n=this.isShown();(this.isShowTrigger("contextmenu")&&!n||this.isHideTrigger("contextmenu")&&n)&&e.preventDefault(),this.handleEvent("contextmenu",e.target,e)}},{key:"onClickOutside",value:function(e){var n=this.props.onClickOutside;this.handleEvent("clickoutside",e.target,e),n(e)}},{key:"onDialogEnter",value:function(e){this.props.showOnDialogEnter&&this.showDialogIfNeeded(e,"DialogEnter")}},{key:"onDialogLeave",value:function(e){this.props.showOnDialogEnter&&this.hideDialogIfNeeded(e,"DialogLeave")}},{key:"onContentClick",value:function(e){var n=this.props.onContentClick;this.handleEvent("onContentClick",e.target,e),n(e)}},{key:"render",value:function(){var e=this,n=this.props,t=n.wrapperClassName,i=n.content,a=n.startingEdge,p=n.children,m=n.preventAnimationOnMount,g=n.animationType,v=n.position,y=n.showDelay,w=n.moveBy,E=n.modifiers,S=n.tooltip,M=n.tooltipClassName,H=n.referenceWrapperClassName,L=n.zIndex,A=n.hideWhenReferenceHidden,N=n.disableContainerScroll,I=n.containerSelector,R=n.observeContentResize,j=this.state.preventAnimation,B=n["data-testid"]||C(T.DIALOG,n.id),P=m||j?void 0:g,F=c(i)?i():i;return F?r.createElement(u,null,r.createElement(d,null,(function(n){var o=n.ref;return r.createElement(D,{className:s(H),ref:o,onBlur:x("onBlur",e,e.props),onKeyDown:x("onKeyDown",e,e.props),onClick:x("onClick",e,e.props),onFocus:x("onFocus",e,e.props),onMouseDown:x("onMouseDown",e,e.props),onMouseEnter:x("onMouseEnter",e,e.props),onMouseLeave:x("onMouseLeave",e,e.props),onContextMenu:x("onContextMenu",e,e.props)},p)})),b()&&l(r.createElement(h,{placement:v,modifiers:[{name:"offset",options:{offset:[w.secondary,w.main]}},{name:"zIndex",enabled:!0,phase:"write",fn:function(e){var n=e.state;return L&&(n.styles.popper.zIndex=L+""),n}},{name:"rotator",enabled:!0,phase:"write",fn:function(e){var n=e.state;return n.styles.arrow?(n.styles.arrow.transform="".concat(n.styles.arrow.transform," rotate(45deg)"),n):n}},O(R)].concat(o(E))},(function(n){var o=n.placement,i=n.style,l=n.ref,u=n.arrowProps,d=n.isReferenceHidden;if(!e.isShown()&&o)return null;if(A&&d){var h=new CustomEvent("onReferenceHidden");e.hideDialog(h,"onReferenceHidden")}return r.createElement(f,{"data-testid":B,isReferenceHidden:A&&d,onMouseEnter:e.onDialogEnter,onMouseLeave:e.onDialogLeave,onClickOutside:e.onClickOutside,onContextMenu:e.onContextMenu,onEsc:e.onEsc,animationType:P,position:o,wrapperClassName:t,startingEdge:a,isOpen:e.isShown(),showDelay:y,styleObject:i,ref:l,onClick:e.onContentClick,hasTooltip:!!S,containerSelector:I,disableContainerScroll:N},F,S&&r.createElement("div",{style:u.style,ref:u.ref,className:s(k.arrow,M),"data-placement":o}))})),this.getContainer())):p}}],[{key:"getDerivedStateFromProps",value:function(e,n){return n.shouldUseDerivedStateFromProps?{isOpen:e.isOpen}:null}}])}();function x(e,n,o){return g([o[e],n[e]],!0)}M.hideShowTriggers=y,M.positions=w,M.animationTypes=E,M.defaultProps={position:"top",modifiers:[],moveBy:{main:0,secondary:0},showDelay:100,hideDelay:100,showTrigger:M.hideShowTriggers.MOUSE_ENTER,hideTrigger:M.hideShowTriggers.MOUSE_LEAVE,showOnDialogEnter:!1,shouldShowOnMount:!1,disable:!1,open:!1,animationType:M.animationTypes.EXPAND,preventAnimationOnMount:!1,tooltip:!1,onDialogDidShow:p,onDialogDidHide:p,onClickOutside:p,onContentClick:p,useDerivedStateFromProps:!1,hideWhenReferenceHidden:!1,shouldCallbackOnMount:!1,instantShowAndHide:!1,addKeyboardHideShowTriggersByDefault:!1,observeContentResize:!1},M.contextType=S;export{M as default};
 //# sourceMappingURL=Dialog.js.map