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/TextField/TextField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextField.js","sources":["../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n ChangeEvent,\n ChangeEventHandler,\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport useDebounceEvent from \"../../hooks/useDebounceEvent\";\nimport Icon from \"../Icon/Icon\";\nimport Loader from \"../Loader/Loader\";\nimport Text from \"../Text/Text\";\nimport FieldLabel from \"../FieldLabel/FieldLabel\";\nimport {\n FEEDBACK_CLASSES,\n SIZE_MAPPER,\n TextFieldAriaLabel,\n TextFieldFeedbackState as TextFieldFeedbackStateEnum,\n TextFieldTextType as TextFieldTextTypeEnum\n} from \"./TextFieldConstants\";\nimport { TextFieldType, TextFieldSize } from \"./TextField.types\";\nimport { BASE_SIZES } from \"../../constants/sizes\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Clickable from \"../../components/Clickable/Clickable\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { VibeComponentProps, VibeComponent, withStaticProps } from \"../../types\";\nimport styles from \"./TextField.module.scss\";\nimport { Tooltip } from \"../Tooltip\";\nimport { HiddenText } from \"../HiddenText\";\n\nconst EMPTY_OBJECT = { primary: \"\", secondary: \"\" };\n\nexport interface TextFieldProps extends VibeComponentProps {\n /*\n The placeholder text displayed when the input is empty.\n /\n placeholder?: string;\n /\n Configures the browser's autocomplete behavior.\n /\n autoComplete?: string;\n /\n The current value of the text field.\n /\n value?: string;\n /\n Callback fired when the text field value changes.\n /\n onChange?: (\n value: string,\n event: React.ChangeEvent<HTMLInputElement> \| Pick<React.ChangeEvent<HTMLInputElement>, \"target\">\n ) => void;\n /\n Callback fired when the text field loses focus.\n /\n onBlur?: (event: React.FocusEvent) => void;\n /\n Callback fired when the text field gains focus.\n /\n onFocus?: (event: React.FocusEvent) => void;\n /\n Callback fired when a key is pressed inside the text field.\n /\n onKeyDown?: (event: React.KeyboardEvent) => void;\n /\n Callback fired when the mouse wheel is used inside the text field.\n /\n onWheel?: (event: React.WheelEvent) => void;\n /\n The debounce rate for input value changes.\n /\n debounceRate?: number;\n /\n If true, the input is automatically focused on mount.\n /\n autoFocus?: boolean;\n /\n If true, disables the text field.\n /\n disabled?: boolean;\n /\n If true, makes the text field read-only.\n /\n readonly?: boolean;\n /\n A function to set a reference to the input element.\n /\n setRef?: (node: HTMLElement) => void;\n /\n The primary icon displayed inside the text field.\n /\n iconName?: string \| React.FunctionComponent \| null;\n /\n The secondary icon displayed inside the text field.\n /\n secondaryIconName?: string \| React.FunctionComponent \| null;\n /\n The label displayed above the text field.\n /\n title?: string;\n /\n The size of the text field.\n /\n size?: TextFieldSize;\n /\n Validation state for the text field.\n /\n validation?: { status?: \"error\" \| \"success\"; text?: string \| React.ReactNode };\n /\n Class name applied to the text field wrapper.\n /\n wrapperClassName?: string;\n /\n Callback fired when the icon inside the text field is clicked.\n /\n onIconClick?: (icon: string \| React.FunctionComponent \| null) => void;\n /\n If true, clears the input when the icon is clicked.\n /\n clearOnIconClick?: boolean;\n /\n The icon displayed inside the label.\n /\n labelIconName?: string \| React.FunctionComponent \| null;\n /\n If true, displays the character count.\n /\n showCharCount?: boolean;\n /\n The ARIA label for the input field.\n /\n inputAriaLabel?: string;\n /\n The ID of the container where search results are displayed.\n /\n searchResultsContainerId?: string;\n /\n The ID of the currently active search result.\n /\n activeDescendant?: string;\n /\n Icon labels for accessibility.\n /\n iconsNames?: {\n primary: string;\n secondary: string;\n };\n /\n The type of the text field.\n /\n type?: TextFieldType;\n /\n The maximum number of characters allowed.\n /\n maxLength?: number;\n /\n If true, allows the user to exceed the character limit set by `maxLength`.\n /\n allowExceedingMaxLength?: boolean;\n /\n If true, trims whitespace from the input value.\n /\n trim?: boolean;\n /\n The ARIA role of the text field.\n /\n role?: string;\n /\n If true, marks the input as required.\n /\n required?: boolean;\n /\n The error message displayed when a required field is left empty.\n /\n requiredErrorText?: string;\n /\n If true, displays a loading indicator inside the text field.\n /\n loading?: boolean;\n /\n Test ID for the secondary icon.\n /\n secondaryDataTestId?: string;\n /\n The tab order of the input field.\n /\n tabIndex?: number;\n /\n The name attribute for the input field.\n /\n name?: string;\n /\n If true, renders only an underline style for the text field.\n /\n underline?: boolean;\n /\n If true, the component is controlled by an external state.\n /\n controlled?: boolean;\n /\n Tooltip content for the primary icon.\n /\n iconTooltipContent?: string;\n /\n Tooltip content for the secondary icon.\n /\n secondaryTooltipContent?: string;\n /\n The text direction of the input.\n /\n dir?: \"ltr\" \| \"rtl\" \| \"auto\";\n}\n\nconst TextField: VibeComponent<TextFieldProps, unknown> & {\n sizes?: typeof BASE_SIZES;\n types?: typeof TextFieldTextTypeEnum;\n feedbacks?: typeof TextFieldFeedbackStateEnum;\n} = forwardRef(\n (\n {\n className = \"\",\n placeholder = \"\",\n autoComplete = \"off\",\n value,\n onChange = NOOP,\n onBlur = NOOP,\n onFocus = NOOP,\n onKeyDown = NOOP,\n onWheel = NOOP,\n debounceRate = 0,\n autoFocus = false,\n disabled = false,\n readonly = false,\n setRef = NOOP,\n iconName,\n secondaryIconName,\n id = \"input\",\n title = \"\",\n size = \"small\",\n validation = null,\n wrapperClassName = \"\",\n onIconClick = NOOP,\n clearOnIconClick = false,\n labelIconName,\n showCharCount = false,\n inputAriaLabel,\n searchResultsContainerId = \"\",\n activeDescendant = \"\",\n iconsNames = EMPTY_OBJECT,\n type = \"text\",\n maxLength = null,\n allowExceedingMaxLength = false,\n trim = false,\n role = \"\",\n required = false,\n requiredErrorText = \"\",\n loading = false,\n \"data-testid\": dataTestId,\n secondaryDataTestId,\n tabIndex,\n underline = false,\n name,\n controlled = false,\n iconTooltipContent,\n secondaryTooltipContent,\n dir\n }: TextFieldProps,\n ref\n ) => {\n const [isRequiredAndEmpty, setIsRequiredAndEmpty] = useState(false);\n\n const inputRef = useRef(null);\n const mergedRef = useMergeRef(ref, inputRef, setRef);\n\n const onBlurCallback = useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (required && !e.target.value) {\n setIsRequiredAndEmpty(true);\n }\n onBlur(e);\n },\n [onBlur, required]\n );\n\n const onChangeCallback = useCallback(\n (value: string, e?: React.ChangeEvent<HTMLInputElement>) => {\n if (isRequiredAndEmpty && value) {\n setIsRequiredAndEmpty(false);\n }\n const event = e \|\| { target: inputRef.current };\n onChange(value, event);\n },\n [onChange, isRequiredAndEmpty]\n );\n\n const {\n inputValue: uncontrolledInput,\n onEventChanged,\n clearValue\n } = useDebounceEvent({\n delay: debounceRate,\n onChange: onChangeCallback,\n initialStateValue: value,\n trim\n });\n\n const inputValue = useMemo(() => {\n return controlled ? value : uncontrolledInput;\n }, [controlled, value, uncontrolledInput]);\n\n const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n event => {\n controlled ? onChangeCallback(event.target.value, event) : onEventChanged(event);\n },\n [controlled, onChangeCallback, onEventChanged]\n );\n\n const currentStateIconName = useMemo(() => {\n if (secondaryIconName) {\n return inputValue ? secondaryIconName : iconName;\n }\n return iconName;\n }, [iconName, secondaryIconName, inputValue]);\n\n const onIconClickCallback = useCallback(() => {\n if (disabled) {\n return;\n }\n\n if (clearOnIconClick) {\n if (inputRef.current) {\n inputRef.current.focus();\n }\n // Do it cause otherwise the value is not cleared in target object\n inputRef.current.value = \"\";\n controlled ? onChangeCallback(\"\") : clearValue();\n }\n onIconClick(currentStateIconName);\n }, [disabled, clearOnIconClick, onIconClick, currentStateIconName, controlled, onChangeCallback, clearValue]);\n\n const validationClass = useMemo(() => {\n if (typeof maxLength === \"number\" && inputValue && inputValue.length > maxLength) {\n return FEEDBACK_CLASSES.error;\n }\n\n if ((!validation \|\| !validation.status) && !isRequiredAndEmpty) {\n return \"\";\n }\n const status = isRequiredAndEmpty ? \"error\" : validation.status;\n return FEEDBACK_CLASSES[status];\n }, [maxLength, validation, isRequiredAndEmpty, inputValue]);\n\n const hasIcon = iconName \|\| secondaryIconName;\n const shouldShowExtraText = showCharCount \|\| (validation && validation.text) \|\| isRequiredAndEmpty;\n const isSecondary = secondaryIconName === currentStateIconName;\n const isPrimary = iconName === currentStateIconName;\n const shouldFocusOnPrimaryIcon =\n (onIconClick !== NOOP \|\| iconsNames.primary \|\| iconTooltipContent) && inputValue && iconName.length && isPrimary;\n const shouldFocusOnSecondaryIcon = (secondaryIconName \|\| secondaryTooltipContent) && isSecondary && !!inputValue;\n const allowExceedingMaxLengthTextId = allowExceedingMaxLength ? `${id}-allow-exceeding-max-length-text` : undefined;\n\n useEffect(() => {\n if (!inputRef?.current \|\| !autoFocus) {\n return;\n }\n\n const animationFrame = requestAnimationFrame(() => inputRef.current.focus());\n return () => cancelAnimationFrame(animationFrame);\n }, [inputRef, autoFocus]);\n\n const isIconContainerClickable = onIconClick !== NOOP \|\| clearOnIconClick;\n\n const primaryIconLabel = iconsNames.primary \|\| iconTooltipContent;\n const secondaryIconLabel = iconsNames.secondary \|\| secondaryTooltipContent;\n\n return (\n <div\n className={cx(styles.textField, wrapperClassName, {\n [styles.disabled]: disabled,\n [styles.onlyUnderline]: underline\n })}\n role={role}\n aria-busy={loading}\n >\n <div className={cx(styles.labelWrapper)}>\n <FieldLabel labelText={title} icon={labelIconName} labelFor={id} required={required} />\n <div className={cx(styles.inputWrapper, SIZE_MAPPER[size], validationClass)}>\n {/Programatical input (tabIndex={-1}) is working fine with aria-activedescendant attribute despite the rule/}\n {/eslint-disable-next-line jsx-a11y/aria-activedescendant-has-tabindex*/}\n <input\n className={cx(className, styles.input, {\n [styles.inputHasIcon]: !!hasIcon,\n [styles.readOnly]: readonly\n })}\n placeholder={placeholder}\n autoComplete={autoComplete}\n value={inputValue}\n onChange={handleChange}\n disabled={disabled}\n readOnly={readonly}\n ref={mergedRef}\n type={type}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TEXT_FIELD, id)}\n data-vibe={ComponentVibeId.TEXT_FIELD}\n name={name}\n onBlur={onBlurCallback}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n onWheel={onWheel}\n maxLength={typeof maxLength === \"number\" && !allowExceedingMaxLength ? maxLength : undefined}\n role={searchResultsContainerId && \"combobox\"} // For voice reader\n aria-label={inputAriaLabel \|\| placeholder}\n aria-invalid={(validation && validation.status === \"error\") \|\| isRequiredAndEmpty}\n aria-owns={searchResultsContainerId}\n aria-activedescendant={activeDescendant}\n aria-required={required}\n aria-describedby={allowExceedingMaxLengthTextId}\n required={required}\n tabIndex={tabIndex}\n dir={dir}\n />\n {loading && (\n <div\n className={cx(styles.loaderContainer, {\n [styles.loaderContainerHasIcon]: hasIcon\n })}\n >\n <div className={cx(styles.loader)}>\n <Loader className={cx(styles.loaderSvg)} />\n </div>\n </div>\n )}\n <Tooltip\n content={isPrimary ? iconTooltipContent : undefined}\n referenceWrapperClassName={styles.tooltipContainer}\n >\n <Clickable\n className={cx(styles.iconContainer, {\n [styles.iconContainerHasIcon]: hasIcon,\n [styles.iconContainerActive]: isPrimary,\n [styles.iconContainerClickable]: isIconContainerClickable\n })}\n onClick={onIconClickCallback}\n tabIndex={shouldFocusOnPrimaryIcon ? \"0\" : \"-1\"}\n ariaLabel={primaryIconLabel}\n >\n <Icon\n icon={iconName}\n className={cx(styles.icon)}\n iconType=\"font\"\n iconSize={size === \"small\" ? \"16px\" : \"18px\"}\n />\n </Clickable>\n </Tooltip>\n <Tooltip\n content={isSecondary ? secondaryTooltipContent : undefined}\n addKeyboardHideShowTriggersByDefault\n referenceWrapperClassName={styles.tooltipContainer}\n >\n <Clickable\n className={cx(styles.iconContainer, {\n [styles.iconContainerHasIcon]: hasIcon,\n [styles.iconContainerActive]: isSecondary,\n [styles.iconContainerClickable]: isIconContainerClickable\n })}\n onClick={onIconClickCallback}\n tabIndex={shouldFocusOnSecondaryIcon ? \"0\" : \"-1\"}\n data-testid={secondaryDataTestId \|\| getTestId(ComponentDefaultTestId.TEXT_FIELD_SECONDARY_BUTTON, id)}\n ariaLabel={secondaryIconLabel}\n >\n <Icon\n icon={secondaryIconName}\n className={cx(styles.icon)}\n iconType=\"font\"\n iconSize={size === \"small\" ? \"16px\" : \"18px\"}\n />\n </Clickable>\n </Tooltip>\n </div>\n {shouldShowExtraText && (\n <Text type=\"text2\" color=\"secondary\" className={cx(styles.subTextContainer)}>\n {validation && validation.text && (\n <span className={cx(styles.subTextContainerStatus)}>\n {isRequiredAndEmpty ? requiredErrorText : validation.text}\n </span>\n )}\n {showCharCount && (\n <span className={cx(styles.counter)} aria-label={TextFieldAriaLabel.CHAR}>\n {(inputValue && inputValue.length) \|\| 0}\n {typeof maxLength === \"number\" && `/${maxLength}`}\n <HiddenText id={allowExceedingMaxLengthTextId} text={`Maximum of ${maxLength} characters`} />\n </span>\n )}\n </Text>\n )}\n </div>\n </div>\n );\n }\n);\n\nexport default withStaticProps(TextField, {\n sizes: BASE_SIZES,\n feedbacks: TextFieldFeedbackStateEnum,\n types: TextFieldTextTypeEnum\n});\n"],"names":["EMPTY_OBJECT","primary","secondary","withStaticProps","forwardRef","_ref","ref","_ref$className","className","_ref$placeholder","placeholder","_ref$autoComplete","autoComplete","value","_ref$onChange","onChange","NOOP","_ref$onBlur","onBlur","_ref$onFocus","onFocus","_ref$onKeyDown","onKeyDown","_ref$onWheel","onWheel","_ref$debounceRate","debounceRate","_ref$autoFocus","autoFocus","_ref$disabled","disabled","_ref$readonly","readonly","_ref$setRef","setRef","iconName","secondaryIconName","_ref$id","id","_ref$title","title","_ref$size","size","_ref$validation","validation","_ref$wrapperClassName","wrapperClassName","_ref$onIconClick","onIconClick","_ref$clearOnIconClick","clearOnIconClick","labelIconName","_ref$showCharCount","showCharCount","inputAriaLabel","_ref$searchResultsCon","searchResultsContainerId","_ref$activeDescendant","activeDescendant","_ref$iconsNames","iconsNames","_ref$type","type","_ref$maxLength","maxLength","_ref$allowExceedingMa","allowExceedingMaxLength","_ref$trim","trim","_ref$role","role","_ref$required","required","_ref$requiredErrorTex","requiredErrorText","_ref$loading","loading","dataTestId","secondaryDataTestId","tabIndex","_ref$underline","underline","name","_ref$controlled","controlled","iconTooltipContent","secondaryTooltipContent","dir","_useState","useState","_useState2","_slicedToArray","isRequiredAndEmpty","setIsRequiredAndEmpty","inputRef","useRef","mergedRef","useMergeRef","onBlurCallback","useCallback","e","target","onChangeCallback","current","_useDebounceEvent","useDebounceEvent","delay","initialStateValue","uncontrolledInput","inputValue","onEventChanged","clearValue","useMemo","handleChange","event","currentStateIconName","onIconClickCallback","focus","validationClass","length","FEEDBACK_CLASSES","error","status","hasIcon","shouldShowExtraText","text","isSecondary","isPrimary","shouldFocusOnPrimaryIcon","shouldFocusOnSecondaryIcon","allowExceedingMaxLengthTextId","concat","undefined","useEffect","animationFrame","requestAnimationFrame","cancelAnimationFrame","isIconContainerClickable","primaryIconLabel","secondaryIconLabel","React","createElement","cx","styles","textField","_defineProperty","onlyUnderline","labelWrapper","FieldLabel","labelText","icon","labelFor","inputWrapper","SIZE_MAPPER","input","inputHasIcon","readOnly","getTestId","ComponentDefaultTestId","TEXT_FIELD","ComponentVibeId","loaderContainer","loaderContainerHasIcon","loader","Loader","loaderSvg","Tooltip","content","referenceWrapperClassName","tooltipContainer","Clickable","iconContainer","iconContainerHasIcon","iconContainerActive","iconContainerClickable","onClick","ariaLabel","Icon","iconType","iconSize","addKeyboardHideShowTriggersByDefault","TEXT_FIELD_SECONDARY_BUTTON","Text","color","subTextContainer","subTextContainerStatus","counter","TextFieldAriaLabel","CHAR","HiddenText","sizes","BASE_SIZES","feedbacks","TextFieldFeedbackStateEnum","types","TextFieldTextTypeEnum"],"mappings":"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"}
1	+ {"version":3,"file":"TextField.js","sources":["../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n ChangeEvent,\n ChangeEventHandler,\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport useDebounceEvent from \"../../hooks/useDebounceEvent\";\nimport Icon from \"../Icon/Icon\";\nimport Loader from \"../Loader/Loader\";\nimport Text from \"../Text/Text\";\nimport FieldLabel from \"../FieldLabel/FieldLabel\";\nimport {\n FEEDBACK_CLASSES,\n SIZE_MAPPER,\n TextFieldAriaLabel,\n TextFieldFeedbackState as TextFieldFeedbackStateEnum,\n TextFieldTextType as TextFieldTextTypeEnum\n} from \"./TextFieldConstants\";\nimport { TextFieldType, TextFieldSize } from \"./TextField.types\";\nimport { BASE_SIZES } from \"../../constants/sizes\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Clickable from \"../../components/Clickable/Clickable\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./TextField.module.scss\";\nimport { Tooltip } from \"../Tooltip\";\nimport { HiddenText } from \"../HiddenText\";\n\nconst EMPTY_OBJECT = { primary: \"\", secondary: \"\" };\n\nexport interface TextFieldProps extends VibeComponentProps {\n /*\n The placeholder text displayed when the input is empty.\n /\n placeholder?: string;\n /\n Configures the browser's autocomplete behavior.\n /\n autoComplete?: string;\n /\n The current value of the text field.\n /\n value?: string;\n /\n Callback fired when the text field value changes.\n /\n onChange?: (\n value: string,\n event: React.ChangeEvent<HTMLInputElement> \| Pick<React.ChangeEvent<HTMLInputElement>, \"target\">\n ) => void;\n /\n Callback fired when the text field loses focus.\n /\n onBlur?: (event: React.FocusEvent) => void;\n /\n Callback fired when the text field gains focus.\n /\n onFocus?: (event: React.FocusEvent) => void;\n /\n Callback fired when a key is pressed inside the text field.\n /\n onKeyDown?: (event: React.KeyboardEvent) => void;\n /\n Callback fired when the mouse wheel is used inside the text field.\n /\n onWheel?: (event: React.WheelEvent) => void;\n /\n The debounce rate for input value changes.\n /\n debounceRate?: number;\n /\n If true, the input is automatically focused on mount.\n /\n autoFocus?: boolean;\n /\n If true, disables the text field.\n /\n disabled?: boolean;\n /\n If true, makes the text field read-only.\n /\n readonly?: boolean;\n /\n A function to set a reference to the input element.\n /\n setRef?: (node: HTMLElement) => void;\n /\n The primary icon displayed inside the text field.\n /\n iconName?: string \| React.FunctionComponent \| null;\n /\n The secondary icon displayed inside the text field.\n /\n secondaryIconName?: string \| React.FunctionComponent \| null;\n /\n The label displayed above the text field.\n /\n title?: string;\n /\n The size of the text field.\n /\n size?: TextFieldSize;\n /\n Validation state for the text field.\n /\n validation?: { status?: \"error\" \| \"success\"; text?: string \| React.ReactNode };\n /\n Class name applied to the text field wrapper.\n /\n wrapperClassName?: string;\n /\n Callback fired when the icon inside the text field is clicked.\n /\n onIconClick?: (icon: string \| React.FunctionComponent \| null) => void;\n /\n If true, clears the input when the icon is clicked.\n /\n clearOnIconClick?: boolean;\n /\n The icon displayed inside the label.\n /\n labelIconName?: string \| React.FunctionComponent \| null;\n /\n If true, displays the character count.\n /\n showCharCount?: boolean;\n /\n The ARIA label for the input field.\n /\n inputAriaLabel?: string;\n /\n The ID of the container where search results are displayed.\n /\n searchResultsContainerId?: string;\n /\n The ID of the currently active search result.\n /\n activeDescendant?: string;\n /\n Icon labels for accessibility.\n /\n iconsNames?: {\n primary: string;\n secondary: string;\n };\n /\n The type of the text field.\n /\n type?: TextFieldType;\n /\n The maximum number of characters allowed.\n /\n maxLength?: number;\n /\n If true, allows the user to exceed the character limit set by `maxLength`.\n /\n allowExceedingMaxLength?: boolean;\n /\n If true, trims whitespace from the input value.\n /\n trim?: boolean;\n /\n The ARIA role of the text field.\n /\n role?: string;\n /\n If true, marks the input as required.\n /\n required?: boolean;\n /\n The error message displayed when a required field is left empty.\n /\n requiredErrorText?: string;\n /\n If true, displays a loading indicator inside the text field.\n /\n loading?: boolean;\n /\n Test ID for the secondary icon.\n /\n secondaryDataTestId?: string;\n /\n The tab order of the input field.\n /\n tabIndex?: number;\n /\n The name attribute for the input field.\n /\n name?: string;\n /\n If true, renders only an underline style for the text field.\n /\n underline?: boolean;\n /\n If true, the component is controlled by an external state.\n /\n controlled?: boolean;\n /\n Tooltip content for the primary icon.\n /\n iconTooltipContent?: string;\n /\n Tooltip content for the secondary icon.\n /\n secondaryTooltipContent?: string;\n /\n The text direction of the input.\n /\n dir?: \"ltr\" \| \"rtl\" \| \"auto\";\n}\n\nconst TextField = forwardRef(\n (\n {\n className = \"\",\n placeholder = \"\",\n autoComplete = \"off\",\n value,\n onChange = NOOP,\n onBlur = NOOP,\n onFocus = NOOP,\n onKeyDown = NOOP,\n onWheel = NOOP,\n debounceRate = 0,\n autoFocus = false,\n disabled = false,\n readonly = false,\n setRef = NOOP,\n iconName,\n secondaryIconName,\n id = \"input\",\n title = \"\",\n size = \"small\",\n validation = null,\n wrapperClassName = \"\",\n onIconClick = NOOP,\n clearOnIconClick = false,\n labelIconName,\n showCharCount = false,\n inputAriaLabel,\n searchResultsContainerId = \"\",\n activeDescendant = \"\",\n iconsNames = EMPTY_OBJECT,\n type = \"text\",\n maxLength = null,\n allowExceedingMaxLength = false,\n trim = false,\n role = \"\",\n required = false,\n requiredErrorText = \"\",\n loading = false,\n \"data-testid\": dataTestId,\n secondaryDataTestId,\n tabIndex,\n underline = false,\n name,\n controlled = false,\n iconTooltipContent,\n secondaryTooltipContent,\n dir\n }: TextFieldProps,\n ref: React.ForwardedRef<unknown>\n ) => {\n const [isRequiredAndEmpty, setIsRequiredAndEmpty] = useState(false);\n\n const inputRef = useRef(null);\n const mergedRef = useMergeRef(ref, inputRef, setRef);\n\n const onBlurCallback = useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (required && !e.target.value) {\n setIsRequiredAndEmpty(true);\n }\n onBlur(e);\n },\n [onBlur, required]\n );\n\n const onChangeCallback = useCallback(\n (value: string, e?: React.ChangeEvent<HTMLInputElement>) => {\n if (isRequiredAndEmpty && value) {\n setIsRequiredAndEmpty(false);\n }\n const event = e \|\| { target: inputRef.current };\n onChange(value, event);\n },\n [onChange, isRequiredAndEmpty]\n );\n\n const {\n inputValue: uncontrolledInput,\n onEventChanged,\n clearValue\n } = useDebounceEvent({\n delay: debounceRate,\n onChange: onChangeCallback,\n initialStateValue: value,\n trim\n });\n\n const inputValue = useMemo(() => {\n return controlled ? value : uncontrolledInput;\n }, [controlled, value, uncontrolledInput]);\n\n const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n event => {\n controlled ? onChangeCallback(event.target.value, event) : onEventChanged(event);\n },\n [controlled, onChangeCallback, onEventChanged]\n );\n\n const currentStateIconName = useMemo(() => {\n if (secondaryIconName) {\n return inputValue ? secondaryIconName : iconName;\n }\n return iconName;\n }, [iconName, secondaryIconName, inputValue]);\n\n const onIconClickCallback = useCallback(() => {\n if (disabled) {\n return;\n }\n\n if (clearOnIconClick) {\n if (inputRef.current) {\n inputRef.current.focus();\n }\n // Do it cause otherwise the value is not cleared in target object\n inputRef.current.value = \"\";\n controlled ? onChangeCallback(\"\") : clearValue();\n }\n onIconClick(currentStateIconName);\n }, [disabled, clearOnIconClick, onIconClick, currentStateIconName, controlled, onChangeCallback, clearValue]);\n\n const validationClass = useMemo(() => {\n if (typeof maxLength === \"number\" && inputValue && inputValue.length > maxLength) {\n return FEEDBACK_CLASSES.error;\n }\n\n if ((!validation \|\| !validation.status) && !isRequiredAndEmpty) {\n return \"\";\n }\n const status = isRequiredAndEmpty ? \"error\" : validation.status;\n return FEEDBACK_CLASSES[status];\n }, [maxLength, validation, isRequiredAndEmpty, inputValue]);\n\n const hasIcon = iconName \|\| secondaryIconName;\n const shouldShowExtraText =\n showCharCount \|\| (validation && validation.text) \|\| (isRequiredAndEmpty && requiredErrorText);\n const isSecondary = secondaryIconName === currentStateIconName;\n const isPrimary = iconName === currentStateIconName;\n const shouldFocusOnPrimaryIcon =\n (onIconClick !== NOOP \|\| iconsNames.primary \|\| iconTooltipContent) && inputValue && iconName.length && isPrimary;\n const shouldFocusOnSecondaryIcon = (secondaryIconName \|\| secondaryTooltipContent) && isSecondary && !!inputValue;\n const allowExceedingMaxLengthTextId = allowExceedingMaxLength ? `${id}-allow-exceeding-max-length-text` : undefined;\n\n useEffect(() => {\n if (!inputRef?.current \|\| !autoFocus) {\n return;\n }\n\n const animationFrame = requestAnimationFrame(() => inputRef.current.focus());\n return () => cancelAnimationFrame(animationFrame);\n }, [inputRef, autoFocus]);\n\n const isIconContainerClickable = onIconClick !== NOOP \|\| clearOnIconClick;\n\n const primaryIconLabel = iconsNames.primary \|\| iconTooltipContent;\n const secondaryIconLabel = iconsNames.secondary \|\| secondaryTooltipContent;\n\n return (\n <div\n className={cx(styles.textField, wrapperClassName, {\n [styles.disabled]: disabled,\n [styles.onlyUnderline]: underline\n })}\n role={role}\n aria-busy={loading}\n >\n <div className={cx(styles.labelWrapper)}>\n <FieldLabel labelText={title} icon={labelIconName} labelFor={id} required={required} />\n <div className={cx(styles.inputWrapper, SIZE_MAPPER[size], validationClass)}>\n {/Programatical input (tabIndex={-1}) is working fine with aria-activedescendant attribute despite the rule/}\n {/eslint-disable-next-line jsx-a11y/aria-activedescendant-has-tabindex*/}\n <input\n className={cx(className, styles.input, {\n [styles.inputHasIcon]: !!hasIcon,\n [styles.readOnly]: readonly\n })}\n placeholder={placeholder}\n autoComplete={autoComplete}\n value={inputValue}\n onChange={handleChange}\n disabled={disabled}\n readOnly={readonly}\n ref={mergedRef}\n type={type}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TEXT_FIELD, id)}\n data-vibe={ComponentVibeId.TEXT_FIELD}\n name={name}\n onBlur={onBlurCallback}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n onWheel={onWheel}\n maxLength={typeof maxLength === \"number\" && !allowExceedingMaxLength ? maxLength : undefined}\n role={searchResultsContainerId && \"combobox\"} // For voice reader\n aria-label={inputAriaLabel \|\| placeholder}\n aria-invalid={(validation && validation.status === \"error\") \|\| isRequiredAndEmpty}\n aria-owns={searchResultsContainerId}\n aria-activedescendant={activeDescendant}\n aria-required={required}\n aria-describedby={allowExceedingMaxLengthTextId}\n required={required}\n tabIndex={tabIndex}\n dir={dir}\n />\n {loading && (\n <div\n className={cx(styles.loaderContainer, {\n [styles.loaderContainerHasIcon]: hasIcon\n })}\n >\n <div className={cx(styles.loader)}>\n <Loader className={cx(styles.loaderSvg)} />\n </div>\n </div>\n )}\n <Tooltip\n content={isPrimary ? iconTooltipContent : undefined}\n referenceWrapperClassName={styles.tooltipContainer}\n >\n <Clickable\n className={cx(styles.iconContainer, {\n [styles.iconContainerHasIcon]: hasIcon,\n [styles.iconContainerActive]: isPrimary,\n [styles.iconContainerClickable]: isIconContainerClickable\n })}\n onClick={onIconClickCallback}\n tabIndex={shouldFocusOnPrimaryIcon ? \"0\" : \"-1\"}\n ariaLabel={primaryIconLabel}\n >\n <Icon\n icon={iconName}\n className={cx(styles.icon)}\n iconType=\"font\"\n iconSize={size === \"small\" ? \"16px\" : \"18px\"}\n />\n </Clickable>\n </Tooltip>\n <Tooltip\n content={isSecondary ? secondaryTooltipContent : undefined}\n addKeyboardHideShowTriggersByDefault\n referenceWrapperClassName={styles.tooltipContainer}\n >\n <Clickable\n className={cx(styles.iconContainer, {\n [styles.iconContainerHasIcon]: hasIcon,\n [styles.iconContainerActive]: isSecondary,\n [styles.iconContainerClickable]: isIconContainerClickable\n })}\n onClick={onIconClickCallback}\n tabIndex={shouldFocusOnSecondaryIcon ? \"0\" : \"-1\"}\n data-testid={secondaryDataTestId \|\| getTestId(ComponentDefaultTestId.TEXT_FIELD_SECONDARY_BUTTON, id)}\n ariaLabel={secondaryIconLabel}\n >\n <Icon\n icon={secondaryIconName}\n className={cx(styles.icon)}\n iconType=\"font\"\n iconSize={size === \"small\" ? \"16px\" : \"18px\"}\n />\n </Clickable>\n </Tooltip>\n </div>\n {shouldShowExtraText && (\n <Text type=\"text2\" color=\"secondary\" className={cx(styles.subTextContainer)}>\n {validation && validation.text && (\n <span className={cx(styles.subTextContainerStatus)}>\n {isRequiredAndEmpty ? requiredErrorText : validation.text}\n </span>\n )}\n {showCharCount && (\n <span className={cx(styles.counter)} aria-label={TextFieldAriaLabel.CHAR}>\n {(inputValue && inputValue.length) \|\| 0}\n {typeof maxLength === \"number\" && `/${maxLength}`}\n <HiddenText id={allowExceedingMaxLengthTextId} text={`Maximum of ${maxLength} characters`} />\n </span>\n )}\n </Text>\n )}\n </div>\n </div>\n );\n }\n);\n\ninterface TextFieldStaticProps {\n sizes: typeof BASE_SIZES;\n types: typeof TextFieldTextTypeEnum;\n feedbacks: typeof TextFieldFeedbackStateEnum;\n}\n\nexport default withStaticProps<TextFieldProps, TextFieldStaticProps>(TextField, {\n sizes: BASE_SIZES,\n feedbacks: TextFieldFeedbackStateEnum,\n types: TextFieldTextTypeEnum\n});\n"],"names":["EMPTY_OBJECT","primary","secondary","withStaticProps","forwardRef","_ref","ref","_ref$className","className","_ref$placeholder","placeholder","_ref$autoComplete","autoComplete","value","_ref$onChange","onChange","NOOP","_ref$onBlur","onBlur","_ref$onFocus","onFocus","_ref$onKeyDown","onKeyDown","_ref$onWheel","onWheel","_ref$debounceRate","debounceRate","_ref$autoFocus","autoFocus","_ref$disabled","disabled","_ref$readonly","readonly","_ref$setRef","setRef","iconName","secondaryIconName","_ref$id","id","_ref$title","title","_ref$size","size","_ref$validation","validation","_ref$wrapperClassName","wrapperClassName","_ref$onIconClick","onIconClick","_ref$clearOnIconClick","clearOnIconClick","labelIconName","_ref$showCharCount","showCharCount","inputAriaLabel","_ref$searchResultsCon","searchResultsContainerId","_ref$activeDescendant","activeDescendant","_ref$iconsNames","iconsNames","_ref$type","type","_ref$maxLength","maxLength","_ref$allowExceedingMa","allowExceedingMaxLength","_ref$trim","trim","_ref$role","role","_ref$required","required","_ref$requiredErrorTex","requiredErrorText","_ref$loading","loading","dataTestId","secondaryDataTestId","tabIndex","_ref$underline","underline","name","_ref$controlled","controlled","iconTooltipContent","secondaryTooltipContent","dir","_useState","useState","_useState2","_slicedToArray","isRequiredAndEmpty","setIsRequiredAndEmpty","inputRef","useRef","mergedRef","useMergeRef","onBlurCallback","useCallback","e","target","onChangeCallback","current","_useDebounceEvent","useDebounceEvent","delay","initialStateValue","uncontrolledInput","inputValue","onEventChanged","clearValue","useMemo","handleChange","event","currentStateIconName","onIconClickCallback","focus","validationClass","length","FEEDBACK_CLASSES","error","status","hasIcon","shouldShowExtraText","text","isSecondary","isPrimary","shouldFocusOnPrimaryIcon","shouldFocusOnSecondaryIcon","allowExceedingMaxLengthTextId","concat","undefined","useEffect","animationFrame","requestAnimationFrame","cancelAnimationFrame","isIconContainerClickable","primaryIconLabel","secondaryIconLabel","React","createElement","cx","styles","textField","_defineProperty","onlyUnderline","labelWrapper","FieldLabel","labelText","icon","labelFor","inputWrapper","SIZE_MAPPER","input","inputHasIcon","readOnly","getTestId","ComponentDefaultTestId","TEXT_FIELD","ComponentVibeId","loaderContainer","loaderContainerHasIcon","loader","Loader","loaderSvg","Tooltip","content","referenceWrapperClassName","tooltipContainer","Clickable","iconContainer","iconContainerHasIcon","iconContainerActive","iconContainerClickable","onClick","ariaLabel","Icon","iconType","iconSize","addKeyboardHideShowTriggersByDefault","TEXT_FIELD_SECONDARY_BUTTON","Text","color","subTextContainer","subTextContainerStatus","counter","TextFieldAriaLabel","CHAR","HiddenText","sizes","BASE_SIZES","feedbacks","TextFieldFeedbackStateEnum","types","TextFieldTextTypeEnum"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var e={textField:"textField_6cac873083",labelWrapper:"labelWrapper_e013e1f128",subTextContainer:"subTextContainer_51ba2248df",counter:"counter_21d9bd8e16",disabled:"disabled_99c46f2778",icon:"icon_9ea6e2691b",inputWrapper:"inputWrapper_9ea6e2691b",input:"input_8e5da1c3b2",iconContainer:"iconContainer_e0ead92b85",iconContainerHasIcon:"iconContainerHasIcon_854470537d",readOnly:"readOnly_889a7528b6",inputHover:"inputHover_2e289e0d4a",inputActive:"inputActive_a505c61567",inputHasIcon:"inputHasIcon_5545a595f4",round:"round_1ccd80bb6e",square:"square_39ac5c2ee0",onlyUnderline:"onlyUnderline_27c6b3c035",tooltipContainer:"tooltipContainer_255d31acd6",wrapperSizeMedium:"wrapperSizeMedium_0b55fcb530",wrapperSizeLarge:"wrapperSizeLarge_9b2b8f46e2",iconContainerActive:"iconContainerActive_b36137dafe",iconContainerClickable:"iconContainerClickable_e48ebb7926",inputErrorValidation:"inputErrorValidation_854470537d",subTextContainerStatus:"subTextContainerStatus_9394bca21e",inputSuccessValidation:"inputSuccessValidation_1e85dccbca",wrapperSizeSmall:"wrapperSizeSmall_da81b24ce5",inputWrapperSizeSmall:"inputWrapperSizeSmall_11fc9c1d5c",loaderContainer:"loaderContainer_dcebafdb04",loaderContainerHasIcon:"loaderContainerHasIcon_52f4c2d4db",loader:"loader_e6a1ca7886",loaderSvg:"loaderSvg_7a3fdcebf3"};!function(e){const n="s_id-6ee97e87df70_3_41_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,a.firstChild?a.insertBefore(t,a.firstChild):a.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".textField_6cac873083 {\n  position: relative;\n  box-sizing: border-box;\n  font: var(--font-text2-normal);\n  width: 100%;\n}\n\n.textField_6cac873083 * {\n  box-sizing: border-box;\n}\n\n.textField_6cac873083 .labelWrapper_e013e1f128 {\n  width: 100%;\n}\n\n.textField_6cac873083 .subTextContainer_51ba2248df {\n  display: flex;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  padding-block: 1px;\n}\n\n.textField_6cac873083 .subTextContainer_51ba2248df .counter_21d9bd8e16 {\n  margin-left: auto;\n}\n\n.textField_6cac873083.disabled_99c46f2778 .icon_9ea6e2691b {\n  cursor: not-allowed;\n}\n\n.textField_6cac873083.disabled_99c46f2778 .inputWrapper_9ea6e2691b {\n  cursor: not-allowed;\n}\n\n.textField_6cac873083.disabled_99c46f2778 .inputWrapper_9ea6e2691b .input_8e5da1c3b2 {\n  user-select: none;\n  border: none;\n  pointer-events: none;\n  background-color: var(--disabled-background-color);\n  cursor: not-allowed;\n}\n\n.textField_6cac873083.disabled_99c46f2778 .inputWrapper_9ea6e2691b .input_8e5da1c3b2::placeholder {\n  color: var(--disabled-text-color);\n}\n\n.textField_6cac873083.disabled_99c46f2778 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85.iconContainerHasIcon_854470537d:hover {\n  background-color: transparent;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b {\n  width: 100%;\n  position: relative;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2 {\n  width: 100%;\n  height: 100%;\n  outline: 0;\n  background-color: var(--secondary-background-color);\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  border-radius: var(--border-radius-small);\n  transition: border-color var(--motion-productive-medium) ease-in;\n  padding: var(--spacing-small) var(--spacing-medium);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  color: var(--primary-text-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2.readOnly_889a7528b6 {\n  background-color: var(--allgrey-background-color);\n  border: none;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2.inputHover_2e289e0d4a {\n  border-color: var(--primary-text-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2:focus,\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2:active,\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2.inputActive_a505c61567 {\n  border-color: var(--primary-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2::placeholder {\n  color: var(--secondary-text-color);\n  font-weight: 400;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2.inputHasIcon_5545a595f4 {\n  padding: var(--spacing-small) var(--spacing-large) var(--spacing-small) var(--spacing-medium);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2.round_1ccd80bb6e {\n  border-radius: 50px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2.square_39ac5c2ee0 {\n  border-radius: 0;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .input_8e5da1c3b2.onlyUnderline_27c6b3c035 {\n  border-left: none;\n  border-right: none;\n  border-top: none;\n  padding: var(--spacing-small) var(--spacing-large) var(--spacing-small) var(--spacing-xs);\n  border-radius: 0 !important;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .tooltipContainer_255d31acd6 {\n  position: absolute;\n  top: 50%;\n  right: 0;\n  width: 32px;\n  height: 20px;\n  transform: translateY(-50%);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeMedium_0b55fcb530 .tooltipContainer_255d31acd6 {\n  width: 40px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeLarge_9b2b8f46e2 .tooltipContainer_255d31acd6 {\n  width: 46px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85 {\n  position: absolute;\n  top: 50%;\n  right: 4px;\n  width: 24px;\n  height: 24px;\n  transform: translateY(-50%);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: var(--border-radius-small);\n  opacity: 0;\n  pointer-events: none;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85 {\n  -webkit-appearance: none;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85.iconContainerActive_b36137dafe.iconContainerHasIcon_854470537d.iconContainerClickable_e48ebb7926 {\n  pointer-events: all;\n  cursor: pointer;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85.iconContainerActive_b36137dafe.iconContainerHasIcon_854470537d:not(.iconContainerClickable_e48ebb7926) {\n  pointer-events: none;\n  cursor: default;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85.iconContainerActive_b36137dafe {\n  opacity: 1;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85.iconContainerActive_b36137dafe .icon_9ea6e2691b {\n  opacity: 1;\n  pointer-events: all;\n  transform: rotate(0) scale(1);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85.iconContainerHasIcon_854470537d.iconContainerClickable_e48ebb7926:hover {\n  background-color: var(--primary-background-hover-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85.iconContainerHasIcon_854470537d.iconContainerClickable_e48ebb7926:active {\n  transform: translateY(-50%) scale(0.9);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85 .icon_9ea6e2691b {\n  transform: rotate(90deg) scale(0.8);\n  color: var(--icon-color);\n  will-change: transform;\n  pointer-events: none;\n  transition: color var(--motion-productive-short) var(--motion-timing-enter), transform var(--motion-productive-short) var(--motion-timing-enter);\n  font-size: 14px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputErrorValidation_854470537d:hover .input_8e5da1c3b2 {\n  border-color: var(--negative-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputErrorValidation_854470537d .input_8e5da1c3b2 {\n  border-color: var(--negative-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputErrorValidation_854470537d .input_8e5da1c3b2:focus,\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputErrorValidation_854470537d .input_8e5da1c3b2:active {\n  border-color: var(--negative-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputErrorValidation_854470537d .iconContainer_e0ead92b85 .icon_9ea6e2691b {\n  color: var(--negative-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputErrorValidation_854470537d .iconContainer_e0ead92b85 .icon_9ea6e2691b:hover {\n  color: var(--negative-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputErrorValidation_854470537d + .subTextContainer_51ba2248df .subTextContainerStatus_9394bca21e,\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputErrorValidation_854470537d + .subTextContainer_51ba2248df .counter_21d9bd8e16 {\n  color: var(--negative-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputSuccessValidation_1e85dccbca:hover .input_8e5da1c3b2 {\n  border-color: var(--positive-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputSuccessValidation_1e85dccbca .input_8e5da1c3b2 {\n  border-color: var(--positive-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputSuccessValidation_1e85dccbca .input_8e5da1c3b2:focus,\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputSuccessValidation_1e85dccbca .input_8e5da1c3b2:active {\n  border-color: var(--positive-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputSuccessValidation_1e85dccbca .iconContainer_e0ead92b85 .icon_9ea6e2691b {\n  color: var(--positive-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputSuccessValidation_1e85dccbca .iconContainer_e0ead92b85 .icon_9ea6e2691b:hover {\n  color: var(--positive-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputSuccessValidation_1e85dccbca + .subTextContainer_51ba2248df .subTextContainerStatus_9394bca21e {\n  color: var(--positive-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeSmall_da81b24ce5 {\n  height: 32px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeSmall_da81b24ce5 .input_8e5da1c3b2 {\n  font: var(--font-text2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.inputWrapperSizeSmall_11fc9c1d5c .input_8e5da1c3b2.inputHasIcon_5545a595f4.onlyUnderline_27c6b3c035 {\n  padding-left: var(--spacing-xs);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeMedium_0b55fcb530 {\n  height: 40px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeMedium_0b55fcb530 .input_8e5da1c3b2 {\n  font: var(--font-text1-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeMedium_0b55fcb530 .input_8e5da1c3b2.inputHasIcon_5545a595f4 {\n  padding: var(--spacing-small) var(--spacing-xl) var(--spacing-small) var(--spacing-medium);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeMedium_0b55fcb530 .input_8e5da1c3b2.inputHasIcon_5545a595f4.onlyUnderline_27c6b3c035 {\n  padding-left: 4px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeMedium_0b55fcb530 .iconContainer_e0ead92b85 {\n  pointer-events: none;\n  height: 32px;\n  width: 32px;\n  outline: none;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeMedium_0b55fcb530 .iconContainer_e0ead92b85 .icon_9ea6e2691b {\n  font-size: 16px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeMedium_0b55fcb530 .iconContainer_e0ead92b85:hover + .iconContainer_e0ead92b85 + .input_8e5da1c3b2 {\n  border-color: var(--primary-text-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeLarge_9b2b8f46e2 {\n  height: 48px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeLarge_9b2b8f46e2 .input_8e5da1c3b2 {\n  font: var(--font-text1-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeLarge_9b2b8f46e2 .input_8e5da1c3b2.inputHasIcon_5545a595f4 {\n  padding: var(--spacing-small) var(--spacing-xl) var(--spacing-small) var(--spacing-medium);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeLarge_9b2b8f46e2 .input_8e5da1c3b2.inputHasIcon_5545a595f4.onlyUnderline_27c6b3c035 {\n  padding-left: var(--spacing-xs);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeLarge_9b2b8f46e2 .iconContainer_e0ead92b85 {\n  height: 40px;\n  width: 40px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeLarge_9b2b8f46e2 .iconContainer_e0ead92b85 .icon_9ea6e2691b {\n  font-size: 16px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b:hover .input_8e5da1c3b2 {\n  border-color: var(--primary-text-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .loaderContainer_dcebafdb04 {\n  position: absolute;\n  top: 50%;\n  right: 4px;\n  width: 24px;\n  height: 24px;\n  transform: translateY(-50%);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .loaderContainer_dcebafdb04.loaderContainerHasIcon_52f4c2d4db {\n  right: 32px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .loaderContainer_dcebafdb04 .loader_e6a1ca7886 {\n  width: 16px;\n  height: 16px;\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .loaderContainer_dcebafdb04 .loader_e6a1ca7886 .loaderSvg_7a3fdcebf3 {\n  color: var(--secondary-text-color);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b .iconContainer_e0ead92b85 .icon_9ea6e2691b {\n  font-family: var(--font-family);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeMedium_0b55fcb530 .iconContainer_e0ead92b85 .icon_9ea6e2691b {\n  font-family: var(--font-family);\n}\n\n.textField_6cac873083 .inputWrapper_9ea6e2691b.wrapperSizeLarge_9b2b8f46e2 .iconContainer_e0ead92b85 .icon_9ea6e2691b {\n  font-family: var(--font-family);\n}\n\n.dark-app-theme input[type=date]::-webkit-calendar-picker-indicator, .black-app-theme input[type=date]::-webkit-calendar-picker-indicator, .hacker_theme-app-theme input[type=date]::-webkit-calendar-picker-indicator,\n.dark-app-theme input[type=datetime-local]::-webkit-calendar-picker-indicator,\n.black-app-theme input[type=datetime-local]::-webkit-calendar-picker-indicator,\n.hacker_theme-app-theme input[type=datetime-local]::-webkit-calendar-picker-indicator {\n  filter: invert(1);\n}");export{e as default};
+var n={textField:"textField_f51f7ed675",labelWrapper:"labelWrapper_c00444aa28",subTextContainer:"subTextContainer_231a067cae",counter:"counter_83daaa6f51",disabled:"disabled_3aa0224515",icon:"icon_36212de2f4",inputWrapper:"inputWrapper_36212de2f4",input:"input_a17f9d57b6",iconContainer:"iconContainer_c527fd6b2b",iconContainerHasIcon:"iconContainerHasIcon_7030468dbf",readOnly:"readOnly_1b8ec2d550",inputHover:"inputHover_6bdf5c370e",inputActive:"inputActive_f0cd3771ee",inputHasIcon:"inputHasIcon_9c4fa48114",round:"round_6a4223284e",square:"square_694c0103d7",onlyUnderline:"onlyUnderline_db9f0d44ea",tooltipContainer:"tooltipContainer_f71f705d86",wrapperSizeMedium:"wrapperSizeMedium_4ea5035771",wrapperSizeLarge:"wrapperSizeLarge_6afe028068",iconContainerActive:"iconContainerActive_4ce5c027ee",iconContainerClickable:"iconContainerClickable_3f35f902c1",inputErrorValidation:"inputErrorValidation_7030468dbf",subTextContainerStatus:"subTextContainerStatus_4956f7820a",inputSuccessValidation:"inputSuccessValidation_3a500c9a70",wrapperSizeSmall:"wrapperSizeSmall_27f221f484",inputWrapperSizeSmall:"inputWrapperSizeSmall_83370c8080",loaderContainer:"loaderContainer_62e95989ac",loaderContainerHasIcon:"loaderContainerHasIcon_0dfbb7d20f",loader:"loader_3595344ef1",loaderSvg:"loaderSvg_3f88afbf0b"};!function(n){const e="s_id-6ee97e87df70_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)}(".textField_f51f7ed675 {\n  position: relative;\n  box-sizing: border-box;\n  font: var(--font-text2-normal);\n  width: 100%;\n}\n\n.textField_f51f7ed675 * {\n  box-sizing: border-box;\n}\n\n.textField_f51f7ed675 .labelWrapper_c00444aa28 {\n  width: 100%;\n}\n\n.textField_f51f7ed675 .subTextContainer_231a067cae {\n  display: flex;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  padding-block: 1px;\n}\n\n.textField_f51f7ed675 .subTextContainer_231a067cae .counter_83daaa6f51 {\n  margin-left: auto;\n}\n\n.textField_f51f7ed675.disabled_3aa0224515 .icon_36212de2f4 {\n  cursor: not-allowed;\n}\n\n.textField_f51f7ed675.disabled_3aa0224515 .inputWrapper_36212de2f4 {\n  cursor: not-allowed;\n}\n\n.textField_f51f7ed675.disabled_3aa0224515 .inputWrapper_36212de2f4 .input_a17f9d57b6 {\n  user-select: none;\n  border: none;\n  pointer-events: none;\n  background-color: var(--disabled-background-color);\n  cursor: not-allowed;\n}\n\n.textField_f51f7ed675.disabled_3aa0224515 .inputWrapper_36212de2f4 .input_a17f9d57b6::placeholder {\n  color: var(--disabled-text-color);\n}\n\n.textField_f51f7ed675.disabled_3aa0224515 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b.iconContainerHasIcon_7030468dbf:hover {\n  background-color: transparent;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 {\n  width: 100%;\n  position: relative;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6 {\n  width: 100%;\n  height: 100%;\n  outline: 0;\n  background-color: var(--secondary-background-color);\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  border-radius: var(--border-radius-small);\n  transition: border-color var(--motion-productive-medium) ease-in;\n  padding: var(--spacing-small) var(--spacing-medium);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  color: var(--primary-text-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6.readOnly_1b8ec2d550 {\n  background-color: var(--allgrey-background-color);\n  border: none;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6.inputHover_6bdf5c370e {\n  border-color: var(--primary-text-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6:focus,\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6:active,\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6.inputActive_f0cd3771ee {\n  border-color: var(--primary-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6::placeholder {\n  color: var(--secondary-text-color);\n  font-weight: 400;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6.inputHasIcon_9c4fa48114 {\n  padding: var(--spacing-small) var(--spacing-large) var(--spacing-small) var(--spacing-medium);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6.round_6a4223284e {\n  border-radius: 50px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6.square_694c0103d7 {\n  border-radius: 0;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .input_a17f9d57b6.onlyUnderline_db9f0d44ea {\n  border-left: none;\n  border-right: none;\n  border-top: none;\n  padding: var(--spacing-small) var(--spacing-large) var(--spacing-small) var(--spacing-xs);\n  border-radius: 0 !important;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .tooltipContainer_f71f705d86 {\n  position: absolute;\n  top: 50%;\n  right: 0;\n  width: 32px;\n  height: 20px;\n  transform: translateY(-50%);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeMedium_4ea5035771 .tooltipContainer_f71f705d86 {\n  width: 40px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeLarge_6afe028068 .tooltipContainer_f71f705d86 {\n  width: 46px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b {\n  position: absolute;\n  top: 50%;\n  right: 4px;\n  width: 24px;\n  height: 24px;\n  transform: translateY(-50%);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: var(--border-radius-small);\n  opacity: 0;\n  pointer-events: none;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b {\n  -webkit-appearance: none;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b.iconContainerActive_4ce5c027ee.iconContainerHasIcon_7030468dbf.iconContainerClickable_3f35f902c1 {\n  pointer-events: all;\n  cursor: pointer;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b.iconContainerActive_4ce5c027ee.iconContainerHasIcon_7030468dbf:not(.iconContainerClickable_3f35f902c1) {\n  pointer-events: none;\n  cursor: default;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b.iconContainerActive_4ce5c027ee {\n  opacity: 1;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b.iconContainerActive_4ce5c027ee .icon_36212de2f4 {\n  opacity: 1;\n  pointer-events: all;\n  transform: rotate(0) scale(1);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b.iconContainerHasIcon_7030468dbf.iconContainerClickable_3f35f902c1:hover {\n  background-color: var(--primary-background-hover-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b.iconContainerHasIcon_7030468dbf.iconContainerClickable_3f35f902c1:active {\n  transform: translateY(-50%) scale(0.9);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b .icon_36212de2f4 {\n  transform: rotate(90deg) scale(0.8);\n  color: var(--icon-color);\n  will-change: transform;\n  pointer-events: none;\n  transition: color var(--motion-productive-short) var(--motion-timing-enter), transform var(--motion-productive-short) var(--motion-timing-enter);\n  font-size: 14px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputErrorValidation_7030468dbf:hover .input_a17f9d57b6 {\n  border-color: var(--negative-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputErrorValidation_7030468dbf .input_a17f9d57b6 {\n  border-color: var(--negative-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputErrorValidation_7030468dbf .input_a17f9d57b6:focus,\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputErrorValidation_7030468dbf .input_a17f9d57b6:active {\n  border-color: var(--negative-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputErrorValidation_7030468dbf .iconContainer_c527fd6b2b .icon_36212de2f4 {\n  color: var(--negative-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputErrorValidation_7030468dbf .iconContainer_c527fd6b2b .icon_36212de2f4:hover {\n  color: var(--negative-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputErrorValidation_7030468dbf + .subTextContainer_231a067cae .subTextContainerStatus_4956f7820a,\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputErrorValidation_7030468dbf + .subTextContainer_231a067cae .counter_83daaa6f51 {\n  color: var(--negative-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputSuccessValidation_3a500c9a70:hover .input_a17f9d57b6 {\n  border-color: var(--positive-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputSuccessValidation_3a500c9a70 .input_a17f9d57b6 {\n  border-color: var(--positive-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputSuccessValidation_3a500c9a70 .input_a17f9d57b6:focus,\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputSuccessValidation_3a500c9a70 .input_a17f9d57b6:active {\n  border-color: var(--positive-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputSuccessValidation_3a500c9a70 .iconContainer_c527fd6b2b .icon_36212de2f4 {\n  color: var(--positive-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputSuccessValidation_3a500c9a70 .iconContainer_c527fd6b2b .icon_36212de2f4:hover {\n  color: var(--positive-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputSuccessValidation_3a500c9a70 + .subTextContainer_231a067cae .subTextContainerStatus_4956f7820a {\n  color: var(--positive-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeSmall_27f221f484 {\n  height: 32px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeSmall_27f221f484 .input_a17f9d57b6 {\n  font: var(--font-text2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.inputWrapperSizeSmall_83370c8080 .input_a17f9d57b6.inputHasIcon_9c4fa48114.onlyUnderline_db9f0d44ea {\n  padding-left: var(--spacing-xs);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeMedium_4ea5035771 {\n  height: 40px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeMedium_4ea5035771 .input_a17f9d57b6 {\n  font: var(--font-text1-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeMedium_4ea5035771 .input_a17f9d57b6.inputHasIcon_9c4fa48114 {\n  padding: var(--spacing-small) var(--spacing-xl) var(--spacing-small) var(--spacing-medium);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeMedium_4ea5035771 .input_a17f9d57b6.inputHasIcon_9c4fa48114.onlyUnderline_db9f0d44ea {\n  padding-left: 4px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeMedium_4ea5035771 .iconContainer_c527fd6b2b {\n  pointer-events: none;\n  height: 32px;\n  width: 32px;\n  outline: none;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeMedium_4ea5035771 .iconContainer_c527fd6b2b .icon_36212de2f4 {\n  font-size: 16px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeMedium_4ea5035771 .iconContainer_c527fd6b2b:hover + .iconContainer_c527fd6b2b + .input_a17f9d57b6 {\n  border-color: var(--primary-text-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeLarge_6afe028068 {\n  height: 48px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeLarge_6afe028068 .input_a17f9d57b6 {\n  font: var(--font-text1-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeLarge_6afe028068 .input_a17f9d57b6.inputHasIcon_9c4fa48114 {\n  padding: var(--spacing-small) var(--spacing-xl) var(--spacing-small) var(--spacing-medium);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeLarge_6afe028068 .input_a17f9d57b6.inputHasIcon_9c4fa48114.onlyUnderline_db9f0d44ea {\n  padding-left: var(--spacing-xs);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeLarge_6afe028068 .iconContainer_c527fd6b2b {\n  height: 40px;\n  width: 40px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeLarge_6afe028068 .iconContainer_c527fd6b2b .icon_36212de2f4 {\n  font-size: 16px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4:hover .input_a17f9d57b6 {\n  border-color: var(--primary-text-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .loaderContainer_62e95989ac {\n  position: absolute;\n  top: 50%;\n  right: 4px;\n  width: 24px;\n  height: 24px;\n  transform: translateY(-50%);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .loaderContainer_62e95989ac.loaderContainerHasIcon_0dfbb7d20f {\n  right: 32px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .loaderContainer_62e95989ac .loader_3595344ef1 {\n  width: 16px;\n  height: 16px;\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .loaderContainer_62e95989ac .loader_3595344ef1 .loaderSvg_3f88afbf0b {\n  color: var(--secondary-text-color);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4 .iconContainer_c527fd6b2b .icon_36212de2f4 {\n  font-family: var(--font-family);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeMedium_4ea5035771 .iconContainer_c527fd6b2b .icon_36212de2f4 {\n  font-family: var(--font-family);\n}\n\n.textField_f51f7ed675 .inputWrapper_36212de2f4.wrapperSizeLarge_6afe028068 .iconContainer_c527fd6b2b .icon_36212de2f4 {\n  font-family: var(--font-family);\n}\n\n.dark-app-theme input[type=date]::-webkit-calendar-picker-indicator, .black-app-theme input[type=date]::-webkit-calendar-picker-indicator, .hacker_theme-app-theme input[type=date]::-webkit-calendar-picker-indicator,\n.dark-app-theme input[type=datetime-local]::-webkit-calendar-picker-indicator,\n.black-app-theme input[type=datetime-local]::-webkit-calendar-picker-indicator,\n.hacker_theme-app-theme input[type=datetime-local]::-webkit-calendar-picker-indicator {\n  filter: invert(1);\n}");export{n as default};
 //# sourceMappingURL=TextField.module.scss.js.map

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

@@ -1,2 +1,2 @@
-var e={textWithHighlightWrapper:"textWithHighlightWrapper_2fd9291ac1",highlightText:"highlightText_e9a6d05fd2",withEllipsis:"withEllipsis_d480fd4407"};!function(e){const t="s_id-42c1fd2afe36_3_41_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".textWithHighlightWrapper_2fd9291ac1 {\n  overflow: hidden;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n}\n\n.textWithHighlightWrapper_2fd9291ac1 em.highlightText_e9a6d05fd2 {\n  background-color: var(--primary-selected-color);\n  color: var(--primary-text-color);\n  border-radius: 2px;\n}\n\n.textWithHighlightWrapper_2fd9291ac1.withEllipsis_d480fd4407 {\n  overflow: hidden;\n  display: -webkit-box;\n  -webkit-line-clamp: var(--heading-clamp-lines);\n  -webkit-box-orient: vertical;\n  white-space: initial;\n  word-break: break-word;\n}");export{e as default};
+var e={textWithHighlightWrapper:"textWithHighlightWrapper_7b3e9c7c62",highlightText:"highlightText_23a9f5d041",withEllipsis:"withEllipsis_46ae6d9717"};!function(e){const t="s_id-42c1fd2afe36_3_42_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".textWithHighlightWrapper_7b3e9c7c62 {\n  overflow: hidden;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n}\n\n.textWithHighlightWrapper_7b3e9c7c62 em.highlightText_23a9f5d041 {\n  background-color: var(--primary-selected-color);\n  color: var(--primary-text-color);\n  border-radius: 2px;\n}\n\n.textWithHighlightWrapper_7b3e9c7c62.withEllipsis_46ae6d9717 {\n  overflow: hidden;\n  display: -webkit-box;\n  -webkit-line-clamp: var(--heading-clamp-lines);\n  -webkit-box-orient: vertical;\n  white-space: initial;\n  word-break: break-word;\n}");export{e as default};
 //# sourceMappingURL=TextWithHighlight.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ThemeProvider.js","sources":["../../../../src/components/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { ~~FC,~~ ReactElement, useEffect, useMemo, useState } from \"react\";\nimport { SystemTheme as SystemThemeEnum, Theme, ThemeColor as ThemeColorEnum } from \"./ThemeProviderConstants\";\nimport { SystemTheme } from \"./ThemeProvider.types\";\nimport {\n addSystemThemeClassNameToBody,\n generateRandomAlphaString,\n generateThemeCssOverride,\n isAnySystemThemeClassNameOnBody,\n removeSystemThemeClassNameFromBody,\n shouldGenerateTheme\n} from \"./ThemeProviderUtils\";\nimport useIsomorphicLayoutEffect from \"../../hooks/ssr/useIsomorphicLayoutEffect\";\nimport { withStaticProps } from \"../../types\";\n\nexport interface ThemeProviderProps {\n /*\n The theme configuration to apply. It consists of a `name` (a unique CSS class name added to the children)\n * and an object of color overrides for each system theme.\n /\n themeConfig?: Theme;\n /\n The children to be rendered with the applied theme.\n /\n children: ReactElement;\n /\n A string added to the theme name selector to make it more specific, in case `themeConfig.name`\n * collides with another class name.\n /\n themeClassSpecifier?: string;\n /\n The system theme to apply to the `body` element on mount,\n * if there is no system theme class name on the body already.\n /\n systemTheme?: SystemTheme;\n /\n Class name applied to the wrapping `div`.\n */\n className?: string;\n}\n\nconst ThemeProvider: ~~FC<ThemeProviderProps>~~ & {\n ~~systemThemes?: typeof SystemThemeEnum;\~~n ~~colors?: typeof ThemeColorEnum;\~~n~~} = ({ themeConfig, children,~~ themeClassSpecifier: customThemeClassSpecifier, systemTheme, className }) => {\n const [stylesLoaded, setStylesLoaded] = useState(false);\n const themeClassSpecifier = useMemo(\n () => customThemeClassSpecifier \|\| generateRandomAlphaString(),\n [customThemeClassSpecifier]\n );\n\n // Add the systemTheme class name to the body on mount\n useIsomorphicLayoutEffect(() => {\n if (!systemTheme) {\n return;\n }\n\n if (isAnySystemThemeClassNameOnBody()) {\n // If there is already a systemTheme class name on the body, we don't want to override it\n return;\n }\n\n addSystemThemeClassNameToBody(systemTheme);\n\n return () => {\n // Cleanup the systemTheme class name from the body on ThemeProvider unmount\n removeSystemThemeClassNameFromBody(systemTheme);\n };\n }, [systemTheme]);\n\n useEffect(() => {\n if (!shouldGenerateTheme(themeConfig)) {\n return;\n }\n if (document.getElementById(themeConfig.name)) {\n setStylesLoaded(true);\n return;\n }\n\n const styleElement = document.createElement(\"style\");\n styleElement.type = \"text/css\";\n styleElement.id = themeConfig.name;\n const themeCssOverride = generateThemeCssOverride(themeConfig, themeClassSpecifier);\n\n try {\n styleElement.appendChild(document.createTextNode(themeCssOverride));\n document.head.appendChild(styleElement);\n setStylesLoaded(true);\n } catch (error) {\n console.error(\"vibe ThemeProvider: error inserting theme-generated css - \", error);\n }\n\n return () => {\n document.head.removeChild(styleElement);\n };\n }, [themeClassSpecifier, themeConfig]);\n\n if (!stylesLoaded && shouldGenerateTheme(themeConfig)) {\n // Waiting for styles to load before children render\n return null;\n }\n\n // Pass the theme name as a class to the div wrapping children - to scope the effect of the theme\n return <div className={cx(themeConfig?.name, themeClassSpecifier, className)}>{children}</div>;\n};\n\nexport default withStaticProps(ThemeProvider, {\n systemThemes: SystemThemeEnum,\n colors: ThemeColorEnum\n});\n"],"names":["withStaticProps","_ref","themeConfig","children","customThemeClassSpecifier","themeClassSpecifier","systemTheme","className","_useState","useState","_useState2","_slicedToArray","stylesLoaded","setStylesLoaded","useMemo","generateRandomAlphaString","useIsomorphicLayoutEffect","isAnySystemThemeClassNameOnBody","addSystemThemeClassNameToBody","removeSystemThemeClassNameFromBody","useEffect","shouldGenerateTheme","document","getElementById","name","styleElement","createElement","type","id","themeCssOverride","generateThemeCssOverride","appendChild","createTextNode","head","error","console","removeChild","React","cx","systemThemes","SystemThemeEnum","colors","ThemeColorEnum"],"mappings":"koBAyCA,~~IAiEeA~~,EAAAA,~~GA9DX~~,~~SAHeC~~,~~GAGuF~~,~~IAAnGC~~,EAAWD,EAAXC,~~YAAaC~~,EAAQF,EAARE,~~SAA+BC~~,EAAyBH,EAA9CI,~~oBAAgDC~~,EAAWL,EAAXK,~~YAAaC~~,EAASN,EAATM,~~UACzFC~~,EAAwCC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAAhDI,EAAYF,EAAA,GAAEG,EAAeH,EAAA,GAC9BL,EAAsBS,GAC1B,WAAA,OAAMV,GAA6BW,MACnC,CAACX,IAiDH,OA7CAY,GAA0B,WACxB,GAAKV,IAIDW,IAOJ,OAFAC,EAA8BZ,GAEvB,WAELa,EAAmCb,GAEvC,GAAG,CAACA,IAEJc,GAAU,WACR,GAAKC,EAAoBnB,GAAzB,CAGA,IAAIoB,SAASC,eAAerB,EAAYsB,MAAxC,CAKA,IAAMC,EAAeH,SAASI,cAAc,SAC5CD,EAAaE,KAAO,WACpBF,EAAaG,GAAK1B,EAAYsB,KAC9B,IAAMK,EAAmBC,EAAyB5B,EAAaG,GAE/D,IACEoB,EAAaM,YAAYT,SAASU,eAAeH,IACjDP,SAASW,KAAKF,YAAYN,GAC1BZ,GAAgB,EACjB,CAAC,MAAOqB,GACPC,QAAQD,MAAM,6DAA8DA,EAC7E,CAED,OAAO,WACLZ,SAASW,KAAKG,YAAYX,GAhB3B,CAFCZ,GAAgB,EAFjB,CAsBH,GAAG,CAACR,EAAqBH,KAEpBU,GAAgBS,EAAoBnB,GAEhC,KAIFmC,EAAAX,cAAA,MAAA,CAAKnB,UAAW+B,EAAGpC,aAAA,EAAAA,EAAasB,KAAMnB,EAAqBE,IAAaJ,EACjF,~~GAE8C~~,~~CAC5CoC~~,aAAcC,EACdC,OAAQC"}
1	+ {"version":3,"file":"ThemeProvider.js","sources":["../../../../src/components/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { ReactElement, useEffect, useMemo, useState } from \"react\";\nimport { SystemTheme as SystemThemeEnum, Theme, ThemeColor as ThemeColorEnum } from \"./ThemeProviderConstants\";\nimport { SystemTheme } from \"./ThemeProvider.types\";\nimport {\n addSystemThemeClassNameToBody,\n generateRandomAlphaString,\n generateThemeCssOverride,\n isAnySystemThemeClassNameOnBody,\n removeSystemThemeClassNameFromBody,\n shouldGenerateTheme\n} from \"./ThemeProviderUtils\";\nimport useIsomorphicLayoutEffect from \"../../hooks/ssr/useIsomorphicLayoutEffect\";\nimport { withStaticProps } from \"../../types\";\n\nexport interface ThemeProviderProps {\n /*\n The theme configuration to apply. It consists of a `name` (a unique CSS class name added to the children)\n * and an object of color overrides for each system theme.\n /\n themeConfig?: Theme;\n /\n The children to be rendered with the applied theme.\n /\n children: ReactElement;\n /\n A string added to the theme name selector to make it more specific, in case `themeConfig.name`\n * collides with another class name.\n /\n themeClassSpecifier?: string;\n /\n The system theme to apply to the `body` element on mount,\n * if there is no system theme class name on the body already.\n /\n systemTheme?: SystemTheme;\n /\n Class name applied to the wrapping `div`.\n */\n className?: string;\n}\n\nconst ThemeProvider = ({\n themeConfig,\n children,\n themeClassSpecifier: customThemeClassSpecifier,\n systemTheme,\n className\n}: ThemeProviderProps) => {\n const [stylesLoaded, setStylesLoaded] = useState(false);\n const themeClassSpecifier = useMemo(\n () => customThemeClassSpecifier \|\| generateRandomAlphaString(),\n [customThemeClassSpecifier]\n );\n\n // Add the systemTheme class name to the body on mount\n useIsomorphicLayoutEffect(() => {\n if (!systemTheme) {\n return;\n }\n\n if (isAnySystemThemeClassNameOnBody()) {\n // If there is already a systemTheme class name on the body, we don't want to override it\n return;\n }\n\n addSystemThemeClassNameToBody(systemTheme);\n\n return () => {\n // Cleanup the systemTheme class name from the body on ThemeProvider unmount\n removeSystemThemeClassNameFromBody(systemTheme);\n };\n }, [systemTheme]);\n\n useEffect(() => {\n if (!shouldGenerateTheme(themeConfig)) {\n return;\n }\n if (document.getElementById(themeConfig.name)) {\n setStylesLoaded(true);\n return;\n }\n\n const styleElement = document.createElement(\"style\");\n styleElement.type = \"text/css\";\n styleElement.id = themeConfig.name;\n const themeCssOverride = generateThemeCssOverride(themeConfig, themeClassSpecifier);\n\n try {\n styleElement.appendChild(document.createTextNode(themeCssOverride));\n document.head.appendChild(styleElement);\n setStylesLoaded(true);\n } catch (error) {\n console.error(\"vibe ThemeProvider: error inserting theme-generated css - \", error);\n }\n\n return () => {\n document.head.removeChild(styleElement);\n };\n }, [themeClassSpecifier, themeConfig]);\n\n if (!stylesLoaded && shouldGenerateTheme(themeConfig)) {\n // Waiting for styles to load before children render\n return null;\n }\n\n // Pass the theme name as a class to the div wrapping children - to scope the effect of the theme\n return <div className={cx(themeConfig?.name, themeClassSpecifier, className)}>{children}</div>;\n};\n\ninterface ThemeProviderStaticProps {\n systemThemes: typeof SystemThemeEnum;\n colors: typeof ThemeColorEnum;\n}\n\nexport default withStaticProps<ThemeProviderProps, ThemeProviderStaticProps>(ThemeProvider, {\n systemThemes: SystemThemeEnum,\n colors: ThemeColorEnum\n});\n"],"names":["withStaticProps","_ref","themeConfig","children","customThemeClassSpecifier","themeClassSpecifier","systemTheme","className","_useState","useState","_useState2","_slicedToArray","stylesLoaded","setStylesLoaded","useMemo","generateRandomAlphaString","useIsomorphicLayoutEffect","isAnySystemThemeClassNameOnBody","addSystemThemeClassNameToBody","removeSystemThemeClassNameFromBody","useEffect","shouldGenerateTheme","document","getElementById","name","styleElement","createElement","type","id","themeCssOverride","generateThemeCssOverride","appendChild","createTextNode","head","error","console","removeChild","React","cx","systemThemes","SystemThemeEnum","colors","ThemeColorEnum"],"mappings":"koBAyCA,IAyEeA,EAAAA,GAzEO,SAAHC,GAMM,IALvBC,EAAWD,EAAXC,YACAC,EAAQF,EAARE,SACqBC,EAAyBH,EAA9CI,oBACAC,EAAWL,EAAXK,YACAC,EAASN,EAATM,UAEAC,EAAwCC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAAhDI,EAAYF,EAAA,GAAEG,EAAeH,EAAA,GAC9BL,EAAsBS,GAC1B,WAAA,OAAMV,GAA6BW,MACnC,CAACX,IAiDH,OA7CAY,GAA0B,WACxB,GAAKV,IAIDW,IAOJ,OAFAC,EAA8BZ,GAEvB,WAELa,EAAmCb,GAEvC,GAAG,CAACA,IAEJc,GAAU,WACR,GAAKC,EAAoBnB,GAAzB,CAGA,IAAIoB,SAASC,eAAerB,EAAYsB,MAAxC,CAKA,IAAMC,EAAeH,SAASI,cAAc,SAC5CD,EAAaE,KAAO,WACpBF,EAAaG,GAAK1B,EAAYsB,KAC9B,IAAMK,EAAmBC,EAAyB5B,EAAaG,GAE/D,IACEoB,EAAaM,YAAYT,SAASU,eAAeH,IACjDP,SAASW,KAAKF,YAAYN,GAC1BZ,GAAgB,EACjB,CAAC,MAAOqB,GACPC,QAAQD,MAAM,6DAA8DA,EAC7E,CAED,OAAO,WACLZ,SAASW,KAAKG,YAAYX,GAhB3B,CAFCZ,GAAgB,EAFjB,CAsBH,GAAG,CAACR,EAAqBH,KAEpBU,GAAgBS,EAAoBnB,GAEhC,KAIFmC,EAAAX,cAAA,MAAA,CAAKnB,UAAW+B,EAAGpC,aAAA,EAAAA,EAAasB,KAAMnB,EAAqBE,IAAaJ,EACjF,GAO4F,CAC1FoC,aAAcC,EACdC,OAAQC"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Tipseen.js","sources":["../../../../src/components/Tipseen/Tipseen.tsx"],"sourcesContent":["import { forwardRef, Fragment, ReactElement, useEffect, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { AnimationType as AnimationTypeEnum, HideShowEvent as HideShowEventEnum } from \"../Dialog/DialogConstants\";\nimport { DialogAnimationType, DialogTriggerEvent } from \"../Dialog/Dialog.types\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Tooltip from \"../../components/Tooltip/Tooltip\";\nimport IconButton from \"../../components/IconButton/IconButton\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport TipseenTitle from \"./TipseenTitle\";\nimport {\n TIPSEEN_CLOSE_BUTTON_ARIA_LABEL,\n TipseenCloseButtonTheme as TipseenCloseButtonThemeEnum,\n TipseenColor as TipseenColorEnum\n} from \"./TipseenConstants\";\nimport { TipseenCloseButtonTheme, TipseenColor } from \"./Tipseen.types\";\nimport { ElementContent, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { Modifier } from \"react-popper\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport Text from \"../Text/Text\";\nimport styles from \"./Tipseen.module.scss\";\nimport { ButtonColor } from \"../Button/ButtonConstants\";\nimport React from \"react\";\nimport { TooltipPositions } from \"../Tooltip/Tooltip.types\";\nimport { TooltipPositions as TooltipPositionsEnum } from \"../Tooltip/TooltipConstants\";\n\nexport interface TipseenProps extends VibeComponentProps {\n /*\n Class name applied to the Tipseen title.\n /\n titleClassName?: string;\n /\n The position of the Tipseen relative to the target element.\n /\n position?: TooltipPositions;\n /\n The animation type used for showing/hiding the Tipseen.\n /\n animationType?: DialogAnimationType;\n /\n The delay in milliseconds before hiding the Tipseen.\n /\n hideDelay?: number;\n /\n The delay in milliseconds before showing the Tipseen.\n /\n showDelay?: number;\n /\n The title text of the Tipseen.\n /\n title?: string;\n /\n If true, hides the close button.\n /\n hideCloseButton?: boolean;\n /\n The child element that triggers the Tipseen.\n /\n children?: ReactElement;\n /\n The CSS selector of the container where the Tipseen should be rendered.\n /\n containerSelector?: string;\n /\n Events that trigger hiding the Tipseen.\n /\n hideTrigger?: DialogTriggerEvent \| Array<DialogTriggerEvent>;\n /\n Events that trigger showing the Tipseen.\n /\n showTrigger?: DialogTriggerEvent \| Array<DialogTriggerEvent>;\n /\n The width of the Tipseen.\n /\n width?: number;\n /\n Offset values for positioning adjustments.\n /\n moveBy?: MoveBy;\n /\n If true, hides the Tipseen when the reference element is hidden.\n /\n hideWhenReferenceHidden?: boolean;\n /\n Class name applied to the reference wrapper element.\n /\n referenceWrapperClassName?: string;\n /\n If false, hides the arrow of the Tipseen.\n /\n tip?: boolean;\n /\n Class name applied to the Tipseen arrow.\n /\n tooltipArrowClassName?: string;\n /\n Custom Popper.js modifiers.\n * https://popper.js.org/docs/v2/modifiers/\n /\n modifiers?: Array<Modifier<unknown>>;\n /\n The aria-label for the close button.\n /\n closeAriaLabel?: string;\n /\n Callback fired when the Tipseen is closed.\n /\n onClose?: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n /\n The content displayed inside the Tipseen.\n /\n content: ElementContent;\n /\n The theme of the Tipseen close button.\n /\n closeButtonTheme?: TipseenCloseButtonTheme;\n /\n If true, renders the Tipseen as a floating element without a reference.\n /\n floating?: boolean;\n /\n The color theme of the Tipseen.\n */\n color?: TipseenColor;\n}\n\nexport const TipseenContext = React.createContext<TipseenColor>(\"primary\");\n\nconst Tipseen: VibeComponent<TipseenProps> & {\n closeButtonThemes?: typeof TipseenCloseButtonThemeEnum;\n animationTypes?: typeof AnimationTypeEnum;\n hideShowTriggers?: typeof HideShowEventEnum;\n colors?: typeof TipseenColorEnum;\n positions?: typeof TooltipPositionsEnum;\n} = forwardRef(\n (\n {\n className,\n id,\n position = \"bottom\",\n animationType = \"expand\",\n hideDelay = 0,\n showDelay = 100,\n title,\n titleClassName,\n hideCloseButton,\n closeButtonTheme = \"light\",\n onClose,\n closeAriaLabel,\n children = null,\n content,\n containerSelector,\n hideTrigger = [],\n showTrigger = [],\n width,\n moveBy,\n hideWhenReferenceHidden = false,\n referenceWrapperClassName,\n tip = true,\n tooltipArrowClassName,\n modifiers = [],\n floating = false,\n color: colorProp,\n \"data-testid\": dataTestId\n }: TipseenProps,\n ref\n ) => {\n const color = colorProp ?? \"inverted\";\n\n const defaultDelayOpen =\n Array.isArray(showTrigger) && Array.isArray(hideTrigger) && showTrigger.length === 0 && showDelay > 0;\n\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n const [delayedOpen, setDelayOpen] = useState(!defaultDelayOpen);\n const overrideCloseAriaLabel = closeAriaLabel \|\| TIPSEEN_CLOSE_BUTTON_ARIA_LABEL;\n\n useEffect(() => {\n let timeout: NodeJS.Timeout;\n if (showDelay) {\n timeout = setTimeout(() => {\n setDelayOpen(true);\n }, showDelay);\n }\n return () => {\n clearTimeout(timeout);\n };\n }, [showDelay, setDelayOpen]);\n\n const textColor = useMemo(() => {\n return color === \"inverted\" ? \"onInverted\" : \"onPrimary\";\n }, [color]);\n const closeButtonColor = useMemo(() => {\n if (closeButtonTheme === \"light\") {\n return color === \"inverted\" ? ButtonColor.ON_INVERTED_BACKGROUND : ButtonColor.ON_PRIMARY_COLOR;\n } else {\n return closeButtonTheme;\n }\n }, [color, closeButtonTheme]);\n\n const TipseenWrapper = ref \|\| id ? \"div\" : Fragment;\n const tooltipContent = (\n <div>\n <div className={cx(styles.tipseenHeader)}>\n {hideCloseButton ? null : (\n <IconButton\n hideTooltip\n className={cx(styles.tipseenCloseButton, {\n [styles.dark]: closeButtonTheme === \"dark\" \|\| closeButtonTheme === \"fixed-dark\"\n })}\n onClick={onClose}\n size=\"xs\"\n kind=\"tertiary\"\n // @ts-ignore\n color={closeButtonColor}\n ariaLabel={overrideCloseAriaLabel}\n icon={CloseSmall}\n />\n )}\n <TipseenTitle text={title} className={cx(styles.tipseenTitle, titleClassName)} />\n </div>\n <Text color={textColor} type=\"text2\" element=\"p\" className={cx(styles.tipseenContent)}>\n <TipseenContext.Provider value={color}>{content}</TipseenContext.Provider>\n </Text>\n </div>\n );\n\n return (\n <TipseenWrapper ref={mergedRef} id={id} data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TIPSEEN, id)}>\n <Tooltip\n className={cx(styles.tipseenWrapper, className, {\n [styles.tipseenWrapperWithoutCustomWidth]: !width,\n [styles.floating]: floating\n })}\n maxWidth={width}\n arrowClassName={tooltipArrowClassName}\n style={width ? { width } : undefined}\n shouldShowOnMount={!defaultDelayOpen}\n position={position}\n animationType={animationType}\n hideDelay={hideDelay}\n showDelay={0}\n hideTrigger={hideTrigger}\n showTrigger={showTrigger}\n showOnDialogEnter={false}\n content={tooltipContent}\n theme={color === \"inverted\" ? \"dark\" : \"primary\"}\n containerSelector={containerSelector}\n disableDialogSlide={false}\n moveBy={moveBy}\n hideWhenReferenceHidden={hideWhenReferenceHidden}\n referenceWrapperClassName={referenceWrapperClassName}\n tip={tip && !floating}\n modifiers={modifiers}\n open={defaultDelayOpen ? delayedOpen : undefined}\n forceRenderWithoutChildren={floating}\n >\n {children}\n </Tooltip>\n </TipseenWrapper>\n );\n }\n);\n\nexport default withStaticProps(Tipseen, {\n closeButtonThemes: TipseenCloseButtonThemeEnum,\n animationTypes: AnimationTypeEnum,\n hideShowTriggers: HideShowEventEnum,\n colors: TipseenColorEnum,\n positions: TooltipPositionsEnum\n});\n"],"names":["TipseenContext","React","createContext","withStaticProps","forwardRef","_ref","ref","className","id","_ref$position","position","_ref$animationType","animationType","_ref$hideDelay","hideDelay","_ref$showDelay","showDelay","title","titleClassName","hideCloseButton","_ref$closeButtonTheme","closeButtonTheme","onClose","closeAriaLabel","_ref$children","children","content","containerSelector","_ref$hideTrigger","hideTrigger","_ref$showTrigger","showTrigger","width","moveBy","_ref$hideWhenReferenc","hideWhenReferenceHidden","referenceWrapperClassName","_ref$tip","tip","tooltipArrowClassName","_ref$modifiers","modifiers","_ref$floating","floating","colorProp","color","dataTestId","defaultDelayOpen","Array","isArray","length","componentRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","delayedOpen","setDelayOpen","overrideCloseAriaLabel","TIPSEEN_CLOSE_BUTTON_ARIA_LABEL","useEffect","timeout","setTimeout","clearTimeout","textColor","useMemo","closeButtonColor","ButtonColor","ON_INVERTED_BACKGROUND","ON_PRIMARY_COLOR","TipseenWrapper","Fragment","tooltipContent","createElement","cx","styles","tipseenHeader","IconButton","hideTooltip","tipseenCloseButton","_defineProperty","dark","onClick","size","kind","ariaLabel","icon","CloseSmall","TipseenTitle","text","tipseenTitle","Text","type","element","tipseenContent","Provider","value","getTestId","ComponentDefaultTestId","TIPSEEN","Tooltip","tipseenWrapper","tipseenWrapperWithoutCustomWidth","maxWidth","arrowClassName","style","undefined","shouldShowOnMount","showOnDialogEnter","theme","disableDialogSlide","open","forceRenderWithoutChildren","closeButtonThemes","TipseenCloseButtonThemeEnum","animationTypes","AnimationTypeEnum","hideShowTriggers","HideShowEventEnum","colors","TipseenColorEnum","positions","TooltipPositionsEnum"],"mappings":"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"}
1	+ {"version":3,"file":"Tipseen.js","sources":["../../../../src/components/Tipseen/Tipseen.tsx"],"sourcesContent":["import { forwardRef, Fragment, ReactElement, useEffect, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { AnimationType as AnimationTypeEnum, HideShowEvent as HideShowEventEnum } from \"../Dialog/DialogConstants\";\nimport { DialogAnimationType, DialogTriggerEvent } from \"../Dialog/Dialog.types\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Tooltip from \"../../components/Tooltip/Tooltip\";\nimport IconButton from \"../../components/IconButton/IconButton\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport TipseenTitle from \"./TipseenTitle\";\nimport {\n TIPSEEN_CLOSE_BUTTON_ARIA_LABEL,\n TipseenCloseButtonTheme as TipseenCloseButtonThemeEnum,\n TipseenColor as TipseenColorEnum\n} from \"./TipseenConstants\";\nimport { TipseenCloseButtonTheme, TipseenColor } from \"./Tipseen.types\";\nimport { ElementContent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { Modifier } from \"react-popper\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport Text from \"../Text/Text\";\nimport styles from \"./Tipseen.module.scss\";\nimport { ButtonColor } from \"../Button/ButtonConstants\";\nimport React from \"react\";\nimport { TooltipPositions } from \"../Tooltip/Tooltip.types\";\nimport { TooltipPositions as TooltipPositionsEnum } from \"../Tooltip/TooltipConstants\";\n\nexport interface TipseenProps extends VibeComponentProps {\n /*\n Class name applied to the Tipseen title.\n /\n titleClassName?: string;\n /\n The position of the Tipseen relative to the target element.\n /\n position?: TooltipPositions;\n /\n The animation type used for showing/hiding the Tipseen.\n /\n animationType?: DialogAnimationType;\n /\n The delay in milliseconds before hiding the Tipseen.\n /\n hideDelay?: number;\n /\n The delay in milliseconds before showing the Tipseen.\n /\n showDelay?: number;\n /\n The title text of the Tipseen.\n /\n title?: string;\n /\n If true, hides the close button.\n /\n hideCloseButton?: boolean;\n /\n The child element that triggers the Tipseen.\n /\n children?: ReactElement;\n /\n The CSS selector of the container where the Tipseen should be rendered.\n /\n containerSelector?: string;\n /\n Events that trigger hiding the Tipseen.\n /\n hideTrigger?: DialogTriggerEvent \| Array<DialogTriggerEvent>;\n /\n Events that trigger showing the Tipseen.\n /\n showTrigger?: DialogTriggerEvent \| Array<DialogTriggerEvent>;\n /\n The width of the Tipseen.\n /\n width?: number;\n /\n Offset values for positioning adjustments.\n /\n moveBy?: MoveBy;\n /\n If true, hides the Tipseen when the reference element is hidden.\n /\n hideWhenReferenceHidden?: boolean;\n /\n Class name applied to the reference wrapper element.\n /\n referenceWrapperClassName?: string;\n /\n If false, hides the arrow of the Tipseen.\n /\n tip?: boolean;\n /\n Class name applied to the Tipseen arrow.\n /\n tooltipArrowClassName?: string;\n /\n Custom Popper.js modifiers.\n * https://popper.js.org/docs/v2/modifiers/\n /\n modifiers?: Array<Modifier<unknown>>;\n /\n The aria-label for the close button.\n /\n closeAriaLabel?: string;\n /\n Callback fired when the Tipseen is closed.\n /\n onClose?: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n /\n The content displayed inside the Tipseen.\n /\n content: ElementContent;\n /\n The theme of the Tipseen close button.\n /\n closeButtonTheme?: TipseenCloseButtonTheme;\n /\n If true, renders the Tipseen as a floating element without a reference.\n /\n floating?: boolean;\n /\n The color theme of the Tipseen.\n */\n color?: TipseenColor;\n}\n\nexport const TipseenContext = React.createContext<TipseenColor>(\"primary\");\n\nconst Tipseen = forwardRef(\n (\n {\n className,\n id,\n position = \"bottom\",\n animationType = \"expand\",\n hideDelay = 0,\n showDelay = 100,\n title,\n titleClassName,\n hideCloseButton,\n closeButtonTheme = \"light\",\n onClose,\n closeAriaLabel,\n children = null,\n content,\n containerSelector,\n hideTrigger = [],\n showTrigger = [],\n width,\n moveBy,\n hideWhenReferenceHidden = false,\n referenceWrapperClassName,\n tip = true,\n tooltipArrowClassName,\n modifiers = [],\n floating = false,\n color: colorProp,\n \"data-testid\": dataTestId\n }: TipseenProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const color = colorProp ?? \"inverted\";\n\n const defaultDelayOpen =\n Array.isArray(showTrigger) && Array.isArray(hideTrigger) && showTrigger.length === 0 && showDelay > 0;\n\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n const [delayedOpen, setDelayOpen] = useState(!defaultDelayOpen);\n const overrideCloseAriaLabel = closeAriaLabel \|\| TIPSEEN_CLOSE_BUTTON_ARIA_LABEL;\n\n useEffect(() => {\n let timeout: NodeJS.Timeout;\n if (showDelay) {\n timeout = setTimeout(() => {\n setDelayOpen(true);\n }, showDelay);\n }\n return () => {\n clearTimeout(timeout);\n };\n }, [showDelay, setDelayOpen]);\n\n const textColor = useMemo(() => {\n return color === \"inverted\" ? \"onInverted\" : \"onPrimary\";\n }, [color]);\n const closeButtonColor = useMemo(() => {\n if (closeButtonTheme === \"light\") {\n return color === \"inverted\" ? ButtonColor.ON_INVERTED_BACKGROUND : ButtonColor.ON_PRIMARY_COLOR;\n } else {\n return closeButtonTheme;\n }\n }, [color, closeButtonTheme]);\n\n const TipseenWrapper = ref \|\| id ? \"div\" : Fragment;\n const tooltipContent = (\n <div>\n <div className={cx(styles.tipseenHeader)}>\n {hideCloseButton ? null : (\n <IconButton\n hideTooltip\n className={cx(styles.tipseenCloseButton, {\n [styles.dark]: closeButtonTheme === \"dark\" \|\| closeButtonTheme === \"fixed-dark\"\n })}\n onClick={onClose}\n size=\"xs\"\n kind=\"tertiary\"\n // @ts-ignore\n color={closeButtonColor}\n ariaLabel={overrideCloseAriaLabel}\n icon={CloseSmall}\n />\n )}\n <TipseenTitle text={title} className={cx(styles.tipseenTitle, titleClassName)} />\n </div>\n <Text color={textColor} type=\"text2\" element=\"p\" className={cx(styles.tipseenContent)}>\n <TipseenContext.Provider value={color}>{content}</TipseenContext.Provider>\n </Text>\n </div>\n );\n\n return (\n <TipseenWrapper ref={mergedRef} id={id} data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TIPSEEN, id)}>\n <Tooltip\n className={cx(styles.tipseenWrapper, className, {\n [styles.tipseenWrapperWithoutCustomWidth]: !width,\n [styles.floating]: floating\n })}\n maxWidth={width}\n arrowClassName={tooltipArrowClassName}\n style={width ? { width } : undefined}\n shouldShowOnMount={!defaultDelayOpen}\n position={position}\n animationType={animationType}\n hideDelay={hideDelay}\n showDelay={0}\n hideTrigger={hideTrigger}\n showTrigger={showTrigger}\n showOnDialogEnter={false}\n content={tooltipContent}\n theme={color === \"inverted\" ? \"dark\" : \"primary\"}\n containerSelector={containerSelector}\n disableDialogSlide={false}\n moveBy={moveBy}\n hideWhenReferenceHidden={hideWhenReferenceHidden}\n referenceWrapperClassName={referenceWrapperClassName}\n tip={tip && !floating}\n modifiers={modifiers}\n open={defaultDelayOpen ? delayedOpen : undefined}\n forceRenderWithoutChildren={floating}\n >\n {children}\n </Tooltip>\n </TipseenWrapper>\n );\n }\n);\n\ninterface TipseenStaticProps {\n closeButtonThemes: typeof TipseenCloseButtonThemeEnum;\n animationTypes: typeof AnimationTypeEnum;\n hideShowTriggers: typeof HideShowEventEnum;\n colors: typeof TipseenColorEnum;\n positions: typeof TooltipPositionsEnum;\n}\n\nexport default withStaticProps<TipseenProps, TipseenStaticProps>(Tipseen, {\n closeButtonThemes: TipseenCloseButtonThemeEnum,\n animationTypes: AnimationTypeEnum,\n hideShowTriggers: HideShowEventEnum,\n colors: TipseenColorEnum,\n positions: TooltipPositionsEnum\n});\n"],"names":["TipseenContext","React","createContext","withStaticProps","forwardRef","_ref","ref","className","id","_ref$position","position","_ref$animationType","animationType","_ref$hideDelay","hideDelay","_ref$showDelay","showDelay","title","titleClassName","hideCloseButton","_ref$closeButtonTheme","closeButtonTheme","onClose","closeAriaLabel","_ref$children","children","content","containerSelector","_ref$hideTrigger","hideTrigger","_ref$showTrigger","showTrigger","width","moveBy","_ref$hideWhenReferenc","hideWhenReferenceHidden","referenceWrapperClassName","_ref$tip","tip","tooltipArrowClassName","_ref$modifiers","modifiers","_ref$floating","floating","colorProp","color","dataTestId","defaultDelayOpen","Array","isArray","length","componentRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","delayedOpen","setDelayOpen","overrideCloseAriaLabel","TIPSEEN_CLOSE_BUTTON_ARIA_LABEL","useEffect","timeout","setTimeout","clearTimeout","textColor","useMemo","closeButtonColor","ButtonColor","ON_INVERTED_BACKGROUND","ON_PRIMARY_COLOR","TipseenWrapper","Fragment","tooltipContent","createElement","cx","styles","tipseenHeader","IconButton","hideTooltip","tipseenCloseButton","_defineProperty","dark","onClick","size","kind","ariaLabel","icon","CloseSmall","TipseenTitle","text","tipseenTitle","Text","type","element","tipseenContent","Provider","value","getTestId","ComponentDefaultTestId","TIPSEEN","Tooltip","tipseenWrapper","tipseenWrapperWithoutCustomWidth","maxWidth","arrowClassName","style","undefined","shouldShowOnMount","showOnDialogEnter","theme","disableDialogSlide","open","forceRenderWithoutChildren","closeButtonThemes","TipseenCloseButtonThemeEnum","animationTypes","AnimationTypeEnum","hideShowTriggers","HideShowEventEnum","colors","TipseenColorEnum","positions","TooltipPositionsEnum"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var e={tipseenWrapper:"tipseenWrapper_c69dbb113b",tipseenWrapperWithoutCustomWidth:"tipseenWrapperWithoutCustomWidth_b974e4ed1e",floating:"floating_ca0a287d62",tipseenHeader:"tipseenHeader_76678e8a9e",tipseenTitle:"tipseenTitle_ab42107cf2",tipseenContent:"tipseenContent_e1cff3f1cd",tipseenCloseButton:"tipseenCloseButton_821c6f2007",dark:"dark_9f646fa0b9"};!function(e){const t="s_id-33da00d2ba25_3_41_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".tipseenWrapper_c69dbb113b {\n  min-width: 100px;\n  min-height: 40px;\n  --tooltip-padding: 0;\n  --tooltip-border-radius: var(--border-radius-medium);\n  --tooltip-max-width: initial;\n}\n.tipseenWrapper_c69dbb113b.tipseenWrapperWithoutCustomWidth_b974e4ed1e {\n  --tooltip-max-width: 320px;\n}\n.tipseenWrapper_c69dbb113b.floating_ca0a287d62 {\n  position: fixed;\n  bottom: 0;\n  right: 0;\n  margin-bottom: var(--spacing-medium);\n  margin-right: var(--spacing-medium);\n}\n.tipseenWrapper_c69dbb113b .tipseenHeader_76678e8a9e {\n  display: flex;\n  justify-content: flex-start;\n}\n.tipseenWrapper_c69dbb113b .tipseenTitle_ab42107cf2 {\n  padding: var(--spacing-medium) var(--spacing-xl) 0 var(--spacing-medium);\n}\n.tipseenWrapper_c69dbb113b .tipseenContent_e1cff3f1cd {\n  margin: 0;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n.tipseenWrapper_c69dbb113b .tipseenCloseButton_821c6f2007 {\n  position: absolute;\n  top: var(--spacing-small);\n  right: var(--spacing-small);\n  z-index: 2;\n}\n.tipseenWrapper_c69dbb113b .tipseenCloseButton_821c6f2007.dark_9f646fa0b9 {\n  color: var(--color-asphalt);\n}");export{e as default};
+var e={tipseenWrapper:"tipseenWrapper_75bc3dbfca",tipseenWrapperWithoutCustomWidth:"tipseenWrapperWithoutCustomWidth_6a186755b1",floating:"floating_42213fb8b8",tipseenHeader:"tipseenHeader_ae10db9663",tipseenTitle:"tipseenTitle_a053784b48",tipseenContent:"tipseenContent_798a12ca30",tipseenCloseButton:"tipseenCloseButton_60a3a0cc89",dark:"dark_a260853d74"};!function(e){const t="s_id-33da00d2ba25_3_42_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".tipseenWrapper_75bc3dbfca {\n  min-width: 100px;\n  min-height: 40px;\n  --tooltip-padding: 0;\n  --tooltip-border-radius: var(--border-radius-medium);\n  --tooltip-max-width: initial;\n}\n.tipseenWrapper_75bc3dbfca.tipseenWrapperWithoutCustomWidth_6a186755b1 {\n  --tooltip-max-width: 320px;\n}\n.tipseenWrapper_75bc3dbfca.floating_42213fb8b8 {\n  position: fixed;\n  bottom: 0;\n  right: 0;\n  margin-bottom: var(--spacing-medium);\n  margin-right: var(--spacing-medium);\n}\n.tipseenWrapper_75bc3dbfca .tipseenHeader_ae10db9663 {\n  display: flex;\n  justify-content: flex-start;\n}\n.tipseenWrapper_75bc3dbfca .tipseenTitle_a053784b48 {\n  padding: var(--spacing-medium) var(--spacing-xl) 0 var(--spacing-medium);\n}\n.tipseenWrapper_75bc3dbfca .tipseenContent_798a12ca30 {\n  margin: 0;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n.tipseenWrapper_75bc3dbfca .tipseenCloseButton_60a3a0cc89 {\n  position: absolute;\n  top: var(--spacing-small);\n  right: var(--spacing-small);\n  z-index: 2;\n}\n.tipseenWrapper_75bc3dbfca .tipseenCloseButton_60a3a0cc89.dark_a260853d74 {\n  color: var(--color-asphalt);\n}");export{e as default};
 //# sourceMappingURL=Tipseen.module.scss.js.map

package/dist/src/components/Tipseen/TipseenBasicContent.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={tipseenBasicContent:"tipseenBasicContent_e72f57b1da"};!function(e){const n="s_id-e688002d63b5_3_41_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)}(".tipseenBasicContent_e72f57b1da {\n  padding: var(--spacing-medium) 20px var(--spacing-large) 20px;\n  display: flex;\n  flex-direction: column;\n}\n.tipseenBasicContent_e72f57b1da:not(:first-child) {\n  padding-top: 12px;\n}");export{e as default};
+var e={tipseenBasicContent:"tipseenBasicContent_3689b83db8"};!function(e){const n="s_id-e688002d63b5_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)}(".tipseenBasicContent_3689b83db8 {\n  padding: var(--spacing-medium) 20px var(--spacing-large) 20px;\n  display: flex;\n  flex-direction: column;\n}\n.tipseenBasicContent_3689b83db8:not(:first-child) {\n  padding-top: 12px;\n}");export{e as default};
 //# sourceMappingURL=TipseenBasicContent.module.scss.js.map

package/dist/src/components/Tipseen/TipseenContent.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={buttons:"buttons_e416c395f1",dismiss:"dismiss_9e0dbbb96d"};!function(e){const t="s_id-91df242cd10d_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)}(".buttons_e416c395f1 {\n  margin-top: 20px;\n  display: flex;\n  justify-content: flex-end;\n}\n\n.dismiss_9e0dbbb96d {\n  margin-right: var(--spacing-small);\n}");export{e as default};
+var e={buttons:"buttons_46308c4fc7",dismiss:"dismiss_c5a576cba2"};!function(e){const t="s_id-91df242cd10d_3_42_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const s=document.createElement("style");s.id=t,n.firstChild?n.insertBefore(s,n.firstChild):n.appendChild(s),s.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".buttons_46308c4fc7 {\n  margin-top: 20px;\n  display: flex;\n  justify-content: flex-end;\n}\n\n.dismiss_c5a576cba2 {\n  margin-right: var(--spacing-small);\n}");export{e as default};
 //# sourceMappingURL=TipseenContent.module.scss.js.map

package/dist/src/components/Tipseen/TipseenImage.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={tipseenImage:"tipseenImage_075631d062"};!function(e){const t="s_id-5a749fe7aaee_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)}(".tipseenImage_075631d062 {\n  object-fit: cover;\n  width: 100%;\n}");export{e as default};
+var e={tipseenImage:"tipseenImage_a004455094"};!function(e){const t="s_id-5a749fe7aaee_3_42_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)}(".tipseenImage_a004455094 {\n  object-fit: cover;\n  width: 100%;\n}");export{e as default};
 //# sourceMappingURL=TipseenImage.module.scss.js.map

package/dist/src/components/Tipseen/TipseenMedia/TipseenMedia.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TipseenMedia.js","sources":["../../../../../src/components/Tipseen/TipseenMedia/TipseenMedia.tsx"],"sourcesContent":["import React, { forwardRef, PropsWithChildren, ReactNode, useContext, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport ~~VibeComponentProps~~ ~~from \"../../../types/~~VibeComponentProps~~\";\nimport~~ ~~VibeComponent~~ from \"../../../types~~/VibeComponent~~\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport styles from \"./TipseenMedia.module.scss\";\nimport { TipseenContext } from \"../Tipseen\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { camelCase } from \"lodash-es\";\n\nexport interface TipseenMediaProps extends PropsWithChildren<VibeComponentProps> {\n /*\n The media content displayed inside the Tipseen.\n */\n children: ReactNode;\n}\n\nconst TipseenMedia: ~~VibeComponent<TipseenMediaProps, HTMLElement>~~ = forwardRef(\n ({ className, id, \"data-testid\": dataTestId, children }: TipseenMediaProps, ref) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n const color = useContext(TipseenContext);\n\n const classNames = useMemo(() => {\n return cx(styles.tipseenMedia, getStyle(styles, camelCase(\"color-\" + color)), className);\n }, [color, className]);\n\n return (\n <div\n ref={mergedRef}\n className={classNames}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TIPSEEN_MEDIA, id)}\n >\n {children}\n </div>\n );\n }\n);\n\nexport default TipseenMedia;\n"],"names":["TipseenMedia","forwardRef","_ref","ref","className","id","dataTestId","children","componentRef","useRef","mergedRef","useMergeRef","color","useContext","TipseenContext","classNames","useMemo","cx","styles","tipseenMedia","getStyle","camelCase","React","createElement","getTestId","ComponentDefaultTestId","TIPSEEN_MEDIA"],"mappings":"~~4dAmBMA~~,IAAAA,~~EAA8DC~~,~~GAClE~~,SAAAC,EAA4EC,~~GAAO~~,~~IAAhFC~~,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAmBC,EAAUJ,EAAzB,eAA2BK,EAAQL,EAARK,SACrCC,EAAeC,EAAO,MACtBC,EAAYC,EAAYR,EAAKK,GAC7BI,EAAQC,EAAWC,GAEnBC,EAAaC,GAAQ,WACzB,OAAOC,EAAGC,EAAOC,aAAcC,EAASF,EAAQG,EAAU,SAAWT,IAASR,EAChF,GAAG,CAACQ,EAAOR,IAEX,OACEkB,EAAAC,cAAA,MAAA,CACEpB,IAAKO,EACLN,UAAWW,EACXV,GAAIA,EAAE,cACOC,GAAckB,EAAUC,EAAuBC,cAAerB,IAE1EE,EAGP"}
1	+ {"version":3,"file":"TipseenMedia.js","sources":["../../../../../src/components/Tipseen/TipseenMedia/TipseenMedia.tsx"],"sourcesContent":["import React, { forwardRef, PropsWithChildren, ReactNode, useContext, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport { VibeComponentProps } from \"../../../types\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport styles from \"./TipseenMedia.module.scss\";\nimport { TipseenContext } from \"../Tipseen\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { camelCase } from \"lodash-es\";\n\nexport interface TipseenMediaProps extends PropsWithChildren<VibeComponentProps> {\n /*\n The media content displayed inside the Tipseen.\n */\n children: ReactNode;\n}\n\nconst TipseenMedia = forwardRef(\n ({ className, id, \"data-testid\": dataTestId, children }: TipseenMediaProps, ref: React.ForwardedRef<HTMLElement>) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n const color = useContext(TipseenContext);\n\n const classNames = useMemo(() => {\n return cx(styles.tipseenMedia, getStyle(styles, camelCase(\"color-\" + color)), className);\n }, [color, className]);\n\n return (\n <div\n ref={mergedRef}\n className={classNames}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TIPSEEN_MEDIA, id)}\n >\n {children}\n </div>\n );\n }\n);\n\nexport default TipseenMedia;\n"],"names":["TipseenMedia","forwardRef","_ref","ref","className","id","dataTestId","children","componentRef","useRef","mergedRef","useMergeRef","color","useContext","TipseenContext","classNames","useMemo","cx","styles","tipseenMedia","getStyle","camelCase","React","createElement","getTestId","ComponentDefaultTestId","TIPSEEN_MEDIA"],"mappings":"4dAkBMA,IAAAA,EAAeC,GACnB,SAAAC,EAA4EC,GAAwC,IAAjHC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAmBC,EAAUJ,EAAzB,eAA2BK,EAAQL,EAARK,SACrCC,EAAeC,EAAO,MACtBC,EAAYC,EAAYR,EAAKK,GAC7BI,EAAQC,EAAWC,GAEnBC,EAAaC,GAAQ,WACzB,OAAOC,EAAGC,EAAOC,aAAcC,EAASF,EAAQG,EAAU,SAAWT,IAASR,EAChF,GAAG,CAACQ,EAAOR,IAEX,OACEkB,EAAAC,cAAA,MAAA,CACEpB,IAAKO,EACLN,UAAWW,EACXV,GAAIA,EAAE,cACOC,GAAckB,EAAUC,EAAuBC,cAAerB,IAE1EE,EAGP"}

package/dist/src/components/Tipseen/TipseenMedia/TipseenMedia.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={tipseenMedia:"tipseenMedia_9bf93394d9",colorInverted:"colorInverted_cd1cf91e2f"};!function(e){const d="s_id-71e151b2b729_3_41_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+d))return;const r=document.createElement("style");r.id=d,n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[d]=e)}(".tipseenMedia_9bf93394d9 {\n  width: 100%;\n  overflow: hidden;\n  display: flex;\n  border: 2px solid var(--primary-color);\n  border-radius: var(--border-radius-medium);\n  position: relative;\n  z-index: 1;\n}\n\n.colorInverted_cd1cf91e2f {\n  border-color: var(--inverted-color-background);\n}");export{e as default};
+var e={tipseenMedia:"tipseenMedia_db0645d2a1",colorInverted:"colorInverted_84ba73b239"};!function(e){const d="s_id-71e151b2b729_3_42_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+d))return;const r=document.createElement("style");r.id=d,n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[d]=e)}(".tipseenMedia_db0645d2a1 {\n  width: 100%;\n  overflow: hidden;\n  display: flex;\n  border: 2px solid var(--primary-color);\n  border-radius: var(--border-radius-medium);\n  position: relative;\n  z-index: 1;\n}\n\n.colorInverted_84ba73b239 {\n  border-color: var(--inverted-color-background);\n}");export{e as default};
 //# sourceMappingURL=TipseenMedia.module.scss.js.map

package/dist/src/components/Tipseen/TipseenTitle.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={title:"title_4c71bd4fe4"};!function(e){const t="s_id-52c2fd8cbf53_3_41_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".title_4c71bd4fe4 {\n  padding-right: var(--spacing-medium);\n  padding-bottom: var(--spacing-xs);\n}");export{e as default};
+var e={title:"title_8af8de7627"};!function(e){const t="s_id-52c2fd8cbf53_3_42_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".title_8af8de7627 {\n  padding-right: var(--spacing-medium);\n  padding-bottom: var(--spacing-xs);\n}");export{e as default};
 //# sourceMappingURL=TipseenTitle.module.scss.js.map

package/dist/src/components/Tipseen/TipseenWizard.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={tipseenWizard:"tipseenWizard_c2c0958ebd",tipseenWizardWizard:"tipseenWizardWizard_e013e1f128"};!function(e){const d="s_id-98eba0c83d1f_3_41_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+d))return;const t=document.createElement("style");t.id=d,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[d]=e)}(".tipseenWizard_c2c0958ebd {\n  display: flex;\n  flex-direction: column;\n}\n.tipseenWizardWizard_e013e1f128 {\n  width: 100%;\n}");export{e as default};
+var e={tipseenWizard:"tipseenWizard_bdd3a3f876",tipseenWizardWizard:"tipseenWizardWizard_c00444aa28"};!function(e){const d="s_id-98eba0c83d1f_3_42_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+d))return;const t=document.createElement("style");t.id=d,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[d]=e)}(".tipseenWizard_bdd3a3f876 {\n  display: flex;\n  flex-direction: column;\n}\n.tipseenWizardWizard_c00444aa28 {\n  width: 100%;\n}");export{e as default};
 //# sourceMappingURL=TipseenWizard.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Toast.js","sources":["../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { FC, ReactElement, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { IconSubComponentProps } from \"../Icon/Icon\";\nimport Text from \"../Text/Text\";\nimport Loader from \"../Loader/Loader\";\nimport Flex from \"../Flex/Flex\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport ToastLink from \"./ToastLink/ToastLink\";\nimport ToastButton from \"./ToastButton/ToastButton\";\nimport { ToastActionType as ToastActionTypeEnum, ToastType as ToastTypeEnum } from \"./ToastConstants\";\nimport { ToastType, ToastAction } from \"./Toast.types\";\nimport { getIcon } from \"./ToastHelpers\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./Toast.module.scss\";\nimport IconButton from \"../IconButton/IconButton\";\nimport usePrevious from \"../../hooks/usePrevious\";\n\nexport interface ToastProps extends VibeComponentProps {\n /*\n The actions available in the toast.\n /\n actions?: ToastAction[];\n /\n If true, the toast is open (visible).\n /\n open?: boolean;\n /\n If true, displays a loading indicator inside the toast.\n /\n loading?: boolean;\n /\n The type of toast.\n /\n type?: ToastType;\n /\n The icon displayed in the toast.\n /\n icon?: string \| React.FC<IconSubComponentProps> \| null;\n /\n If true, hides the toast icon.\n /\n hideIcon?: boolean;\n /\n The action element displayed in the toast.\n /\n action?: JSX.Element;\n /\n If false, hides the close button.\n /\n closeable?: boolean;\n /\n Callback fired when the toast is closed.\n /\n onClose?: () => void;\n /\n The number of milliseconds before the toast automatically closes.\n * (0 or null disables auto-close behavior).\n /\n autoHideDuration?: number;\n /\n The content displayed inside the toast.\n /\n children?: ReactElement \| ReactElement[] \| string;\n /\n The aria-label for the close button.\n /\n closeButtonAriaLabel?: string;\n}\n\nconst Toast: FC<ToastProps> & { types?: typeof ToastTypeEnum; actionTypes?: typeof ToastActionTypeEnum } = ({\n open = false,\n loading = false,\n autoHideDuration = null,\n type = \"normal\",\n icon,\n hideIcon = false,\n action: deprecatedAction,\n actions,\n children,\n closeable = true,\n onClose = NOOP,\n className,\n id,\n closeButtonAriaLabel = \"Close\",\n \"data-testid\": dataTestId\n}: ToastProps) => {\n const ref = useRef(null);\n const prevActions = usePrevious(actions?.length);\n const toastLinks = useMemo(() => {\n return actions\n ? actions\n .filter(action => action.type === \"link\")\n .map(({ type: _type, ...otherProps }) => (\n <ToastLink key={otherProps.href} className={styles.actionLink} {...otherProps} />\n ))\n : null;\n }, [actions]);\n\n const shouldShowButtonTransition = useMemo(() => {\n return prevActions !== undefined && actions?.length !== prevActions;\n }, [actions, prevActions]);\n\n const toastButtons: JSX.Element[] \| null = useMemo(() => {\n return actions\n ? actions\n .filter(action => action.type === \"button\")\n .map(({ type: _type, content, ...otherProps }, index) => (\n <ToastButton\n key={`alert-button-${index}`}\n className={cx(styles.actionButton, { [styles.withTransition]: shouldShowButtonTransition })}\n {...otherProps}\n >\n {content}\n </ToastButton>\n ))\n : null;\n }, [actions, shouldShowButtonTransition]);\n\n const classNames = useMemo(\n () => cx(styles.toast, getStyle(styles, camelCase(\"type-\" + type)), className),\n [type, className]\n );\n\n const handleClose = useCallback(() => {\n if (onClose) {\n onClose();\n }\n }, [onClose]);\n\n / Timer */\n const timerAutoHide = useRef<NodeJS.Timeout>();\n const setAutoHideTimer = useCallback(\n (duration: number) => {\n if (!onClose \|\| duration == null) {\n return;\n }\n\n clearTimeout(timerAutoHide.current);\n timerAutoHide.current = setTimeout(() => {\n handleClose();\n }, duration);\n },\n [handleClose, onClose]\n );\n\n useEffect(() => {\n if (open && autoHideDuration > 0) {\n setAutoHideTimer(autoHideDuration);\n }\n\n return () => {\n clearTimeout(timerAutoHide.current);\n };\n }, [open, autoHideDuration, setAutoHideTimer]);\n\n const iconElement = !hideIcon && getIcon(type, icon);\n\n // https://n12v.com/css-transition-to-from-auto/\n const recalculateElementWidth = useCallback((element: HTMLElement) => {\n const prevWidth = element.style.width;\n element.style.width = \"auto\";\n const endWidth = getComputedStyle(element).width;\n element.style.width = prevWidth;\n element.offsetWidth; // force repaint\n element.style.width = endWidth;\n }, []);\n\n useEffect(() => {\n if (ref.current) {\n recalculateElementWidth(ref.current);\n }\n }, [children, recalculateElementWidth]);\n\n return (\n <CSSTransition\n in={open}\n classNames={{ enterActive: styles.enterActive, exitActive: styles.exitActive }}\n timeout={400}\n unmountOnExit\n >\n <Text\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TOAST, id)}\n type=\"text2\"\n element=\"div\"\n color=\"fixedLight\"\n className={classNames}\n role=\"alert\"\n aria-live=\"polite\"\n ref={ref}\n >\n {iconElement && <div className={cx(styles.icon)}>{iconElement}</div>}\n <Flex align=\"center\" gap=\"large\" className={styles.content}>\n <Flex\n gap=\"medium\"\n data-testid={getTestId(ComponentDefaultTestId.TOAST_CONTENT)}\n className={styles.textContent}\n >\n <span>{children}</span>\n {toastLinks}\n </Flex>\n {(toastButtons \|\| deprecatedAction) && (toastButtons \|\| deprecatedAction)}\n {loading && <Loader size=\"xs\" />}\n </Flex>\n {closeable && (\n <IconButton\n className={cx(styles.closeButton)}\n onClick={handleClose}\n size=\"small\"\n kind=\"tertiary\"\n color=\"fixed-light\"\n ariaLabel={closeButtonAriaLabel}\n data-testid={getTestId(ComponentDefaultTestId.TOAST_CLOSE_BUTTON)}\n icon={CloseSmall}\n hideTooltip\n />\n )}\n </Text>\n </CSSTransition>\n );\n};\n\nexport default withStaticProps(Toast, {\n types: ToastTypeEnum,\n actionTypes: ToastActionTypeEnum\n});\n"],"names":["withStaticProps","_ref","_ref$open","open","_ref$loading","loading","_ref$autoHideDuration","autoHideDuration","_ref$type","type","icon","_ref$hideIcon","hideIcon","deprecatedAction","action","actions","children","_ref$closeable","closeable","_ref$onClose","onClose","NOOP","className","id","_ref$closeButtonAriaL","closeButtonAriaLabel","dataTestId","ref","useRef","prevActions","usePrevious","length","toastLinks","useMemo","filter","map","_a","otherProps","__rest","React","createElement","ToastLink","key","href","styles","actionLink","shouldShowButtonTransition","undefined","toastButtons","index","content","ToastButton","Object","assign","concat","cx","actionButton","_defineProperty","withTransition","classNames","toast","getStyle","camelCase","handleClose","useCallback","timerAutoHide","setAutoHideTimer","duration","clearTimeout","current","setTimeout","useEffect","iconElement","getIcon","recalculateElementWidth","element","prevWidth","style","width","endWidth","getComputedStyle","CSSTransition","in","enterActive","exitActive","timeout","unmountOnExit","Text","getTestId","ComponentDefaultTestId","TOAST","color","role","Flex","align","gap","TOAST_CONTENT","textContent","Loader","size","IconButton","closeButton","onClick","kind","ariaLabel","TOAST_CLOSE_BUTTON","CloseSmall","hideTooltip","types","ToastTypeEnum","actionTypes","ToastActionTypeEnum"],"mappings":"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"}
1	+ {"version":3,"file":"Toast.js","sources":["../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { ReactElement, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { IconSubComponentProps } from \"../Icon/Icon\";\nimport Text from \"../Text/Text\";\nimport Loader from \"../Loader/Loader\";\nimport Flex from \"../Flex/Flex\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport ToastLink from \"./ToastLink/ToastLink\";\nimport ToastButton from \"./ToastButton/ToastButton\";\nimport { ToastActionType as ToastActionTypeEnum, ToastType as ToastTypeEnum } from \"./ToastConstants\";\nimport { ToastType, ToastAction } from \"./Toast.types\";\nimport { getIcon } from \"./ToastHelpers\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./Toast.module.scss\";\nimport IconButton from \"../IconButton/IconButton\";\nimport usePrevious from \"../../hooks/usePrevious\";\n\nexport interface ToastProps extends VibeComponentProps {\n /*\n The actions available in the toast.\n /\n actions?: ToastAction[];\n /\n If true, the toast is open (visible).\n /\n open?: boolean;\n /\n If true, displays a loading indicator inside the toast.\n /\n loading?: boolean;\n /\n The type of toast.\n /\n type?: ToastType;\n /\n The icon displayed in the toast.\n /\n icon?: string \| React.FC<IconSubComponentProps> \| null;\n /\n If true, hides the toast icon.\n /\n hideIcon?: boolean;\n /\n The action element displayed in the toast.\n /\n action?: JSX.Element;\n /\n If false, hides the close button.\n /\n closeable?: boolean;\n /\n Callback fired when the toast is closed.\n /\n onClose?: () => void;\n /\n The number of milliseconds before the toast automatically closes.\n * (0 or null disables auto-close behavior).\n /\n autoHideDuration?: number;\n /\n The content displayed inside the toast.\n /\n children?: ReactElement \| ReactElement[] \| string;\n /\n The aria-label for the close button.\n /\n closeButtonAriaLabel?: string;\n}\n\nconst Toast = ({\n open = false,\n loading = false,\n autoHideDuration = null,\n type = \"normal\",\n icon,\n hideIcon = false,\n action: deprecatedAction,\n actions,\n children,\n closeable = true,\n onClose = NOOP,\n className,\n id,\n closeButtonAriaLabel = \"Close\",\n \"data-testid\": dataTestId\n}: ToastProps) => {\n const ref = useRef(null);\n const prevActions = usePrevious(actions?.length);\n const toastLinks = useMemo(() => {\n return actions\n ? actions\n .filter(action => action.type === \"link\")\n .map(({ type: _type, ...otherProps }) => (\n <ToastLink key={otherProps.href} className={styles.actionLink} {...otherProps} />\n ))\n : null;\n }, [actions]);\n\n const shouldShowButtonTransition = useMemo(() => {\n return prevActions !== undefined && actions?.length !== prevActions;\n }, [actions, prevActions]);\n\n const toastButtons: JSX.Element[] \| null = useMemo(() => {\n return actions\n ? actions\n .filter(action => action.type === \"button\")\n .map(({ type: _type, content, ...otherProps }, index) => (\n <ToastButton\n key={`alert-button-${index}`}\n className={cx(styles.actionButton, { [styles.withTransition]: shouldShowButtonTransition })}\n {...otherProps}\n >\n {content}\n </ToastButton>\n ))\n : null;\n }, [actions, shouldShowButtonTransition]);\n\n const classNames = useMemo(\n () => cx(styles.toast, getStyle(styles, camelCase(\"type-\" + type)), className),\n [type, className]\n );\n\n const handleClose = useCallback(() => {\n if (onClose) {\n onClose();\n }\n }, [onClose]);\n\n / Timer */\n const timerAutoHide = useRef<NodeJS.Timeout>();\n const setAutoHideTimer = useCallback(\n (duration: number) => {\n if (!onClose \|\| duration == null) {\n return;\n }\n\n clearTimeout(timerAutoHide.current);\n timerAutoHide.current = setTimeout(() => {\n handleClose();\n }, duration);\n },\n [handleClose, onClose]\n );\n\n useEffect(() => {\n if (open && autoHideDuration > 0) {\n setAutoHideTimer(autoHideDuration);\n }\n\n return () => {\n clearTimeout(timerAutoHide.current);\n };\n }, [open, autoHideDuration, setAutoHideTimer]);\n\n const iconElement = !hideIcon && getIcon(type, icon);\n\n // https://n12v.com/css-transition-to-from-auto/\n const recalculateElementWidth = useCallback((element: HTMLElement) => {\n const prevWidth = element.style.width;\n element.style.width = \"auto\";\n const endWidth = getComputedStyle(element).width;\n element.style.width = prevWidth;\n element.offsetWidth; // force repaint\n element.style.width = endWidth;\n }, []);\n\n useEffect(() => {\n if (ref.current) {\n recalculateElementWidth(ref.current);\n }\n }, [children, recalculateElementWidth]);\n\n return (\n <CSSTransition\n in={open}\n classNames={{ enterActive: styles.enterActive, exitActive: styles.exitActive }}\n timeout={400}\n unmountOnExit\n >\n <Text\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TOAST, id)}\n type=\"text2\"\n element=\"div\"\n color=\"fixedLight\"\n className={classNames}\n role=\"alert\"\n aria-live=\"polite\"\n ref={ref}\n >\n {iconElement && <div className={cx(styles.icon)}>{iconElement}</div>}\n <Flex align=\"center\" gap=\"large\" className={styles.content}>\n <Flex\n gap=\"medium\"\n data-testid={getTestId(ComponentDefaultTestId.TOAST_CONTENT)}\n className={styles.textContent}\n >\n <span>{children}</span>\n {toastLinks}\n </Flex>\n {(toastButtons \|\| deprecatedAction) && (toastButtons \|\| deprecatedAction)}\n {loading && <Loader size=\"xs\" />}\n </Flex>\n {closeable && (\n <IconButton\n className={cx(styles.closeButton)}\n onClick={handleClose}\n size=\"small\"\n kind=\"tertiary\"\n color=\"fixed-light\"\n ariaLabel={closeButtonAriaLabel}\n data-testid={getTestId(ComponentDefaultTestId.TOAST_CLOSE_BUTTON)}\n icon={CloseSmall}\n hideTooltip\n />\n )}\n </Text>\n </CSSTransition>\n );\n};\n\ninterface ToastStaticProps {\n types: typeof ToastTypeEnum;\n actionTypes: typeof ToastActionTypeEnum;\n}\n\nexport default withStaticProps<ToastProps, ToastStaticProps>(Toast, {\n types: ToastTypeEnum,\n actionTypes: ToastActionTypeEnum\n});\n"],"names":["withStaticProps","_ref","_ref$open","open","_ref$loading","loading","_ref$autoHideDuration","autoHideDuration","_ref$type","type","icon","_ref$hideIcon","hideIcon","deprecatedAction","action","actions","children","_ref$closeable","closeable","_ref$onClose","onClose","NOOP","className","id","_ref$closeButtonAriaL","closeButtonAriaLabel","dataTestId","ref","useRef","prevActions","usePrevious","length","toastLinks","useMemo","filter","map","_a","otherProps","__rest","React","createElement","ToastLink","key","href","styles","actionLink","shouldShowButtonTransition","undefined","toastButtons","index","content","ToastButton","Object","assign","concat","cx","actionButton","_defineProperty","withTransition","classNames","toast","getStyle","camelCase","handleClose","useCallback","timerAutoHide","setAutoHideTimer","duration","clearTimeout","current","setTimeout","useEffect","iconElement","getIcon","recalculateElementWidth","element","prevWidth","style","width","endWidth","getComputedStyle","CSSTransition","in","enterActive","exitActive","timeout","unmountOnExit","Text","getTestId","ComponentDefaultTestId","TOAST","color","role","Flex","align","gap","TOAST_CONTENT","textContent","Loader","size","IconButton","closeButton","onClick","kind","ariaLabel","TOAST_CLOSE_BUTTON","CloseSmall","hideTooltip","types","ToastTypeEnum","actionTypes","ToastActionTypeEnum"],"mappings":"2lCA0EA,IA8JeA,EAAAA,GA9JD,SAAHC,GAgBM,IAAAC,EAAAD,EAffE,KAAAA,OAAO,IAAHD,GAAQA,EAAAE,EAAAH,EACZI,QAAAA,OAAU,IAAHD,GAAQA,EAAAE,EAAAL,EACfM,iBAAAA,OAAmB,IAAHD,EAAG,KAAIA,EAAAE,EAAAP,EACvBQ,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAAIT,EAAJS,KAAIC,EAAAV,EACJW,SAAAA,OAAW,IAAHD,GAAQA,EACRE,EAAgBZ,EAAxBa,OACAC,EAAOd,EAAPc,QACAC,EAAQf,EAARe,SAAQC,EAAAhB,EACRiB,UAAAA,OAAY,IAAHD,GAAOA,EAAAE,EAAAlB,EAChBmB,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EACdG,EAASrB,EAATqB,UACAC,EAAEtB,EAAFsB,GAAEC,EAAAvB,EACFwB,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EACfE,EAAUzB,EAAzB,eAEM0B,EAAMC,EAAO,MACbC,EAAcC,EAAYf,aAAO,EAAPA,EAASgB,QACnCC,EAAaC,GAAQ,WACzB,OAAOlB,EACHA,EACGmB,QAAO,SAAApB,GAAM,MAAoB,SAAhBA,EAAOL,IAAe,IACvC0B,KAAI,SAACC,GAAkBC,IAAAA,EAAUC,EAAAF,EAA5B,UAAmC,OACvCG,EAACC,cAAAC,iBAAUC,IAAKL,EAAWM,KAAMrB,UAAWsB,EAAOC,YAAgBR,GACpE,IACH,IACN,GAAG,CAACtB,IAEE+B,EAA6Bb,GAAQ,WACzC,YAAuBc,IAAhBlB,IAA6Bd,aAAO,EAAPA,EAASgB,UAAWF,CAC1D,GAAG,CAACd,EAASc,IAEPmB,EAAqCf,GAAQ,WACjD,OAAOlB,EACHA,EACGmB,QAAO,SAAApB,GAAM,MAAoB,WAAhBA,EAAOL,IAAiB,IACzC0B,KAAI,SAACC,EAAyCa,OAA1BC,IAAAA,QAAYb,EAA3BC,EAAAF,EAAA,CAAA,OAAA,YAAmD,OACvDG,EAAAC,cAACW,EAAWC,OAAAC,OAAA,CACVX,IAAGY,gBAAAA,OAAkBL,GACrB3B,UAAWiC,EAAGX,EAAOY,aAAYC,EAAA,CAAA,EAAKb,EAAOc,eAAiBZ,KAC1DT,GAEHa,EAEJ,IACH,IACN,GAAG,CAACnC,EAAS+B,IAEPa,EAAa1B,GACjB,WAAA,OAAMsB,EAAGX,EAAOgB,MAAOC,EAASjB,EAAQkB,EAAU,QAAUrD,IAAQa,EAAU,GAC9E,CAACb,EAAMa,IAGHyC,GAAcC,GAAY,WAC1B5C,GACFA,GAEJ,GAAG,CAACA,IAGE6C,GAAgBrC,IAChBsC,GAAmBF,GACvB,SAACG,GACM/C,GAAuB,MAAZ+C,IAIhBC,aAAaH,GAAcI,SAC3BJ,GAAcI,QAAUC,YAAW,WACjCP,IACD,GAAEI,GACL,GACA,CAACJ,GAAa3C,IAGhBmD,GAAU,WAKR,OAJIpE,GAAQI,EAAmB,GAC7B2D,GAAiB3D,GAGZ,WACL6D,aAAaH,GAAcI,SAE9B,GAAE,CAAClE,EAAMI,EAAkB2D,KAE5B,IAAMM,IAAe5D,GAAY6D,EAAQhE,EAAMC,GAGzCgE,GAA0BV,GAAY,SAACW,GAC3C,IAAMC,EAAYD,EAAQE,MAAMC,MAChCH,EAAQE,MAAMC,MAAQ,OACtB,IAAMC,EAAWC,iBAAiBL,GAASG,MAC3CH,EAAQE,MAAMC,MAAQF,EAEtBD,EAAQE,MAAMC,MAAQC,CACvB,GAAE,IAQH,OANAR,GAAU,WACJ5C,EAAI0C,SACNK,GAAwB/C,EAAI0C,QAEhC,GAAG,CAACrD,EAAU0D,KAGZnC,EAAAC,cAACyC,EAAa,CACZC,GAAI/E,EACJwD,WAAY,CAAEwB,YAAavC,EAAOuC,YAAaC,WAAYxC,EAAOwC,YAClEC,QAAS,IACTC,eAAa,GAEb/C,EAAAC,cAAC+C,EACC,CAAAhE,GAAIA,EAAE,cACOG,GAAc8D,EAAUC,EAAuBC,MAAOnE,GACnEd,KAAK,QACLkE,QAAQ,MACRgB,MAAM,aACNrE,UAAWqC,EACXiC,KAAK,QAAO,YACF,SACVjE,IAAKA,GAEJ6C,IAAejC,EAAAC,cAAA,MAAA,CAAKlB,UAAWiC,EAAGX,EAAOlC,OAAQ8D,IAClDjC,EAAAC,cAACqD,EAAI,CAACC,MAAM,SAASC,IAAI,QAAQzE,UAAWsB,EAAOM,SACjDX,EAAAC,cAACqD,EACC,CAAAE,IAAI,uBACSP,EAAUC,EAAuBO,eAC9C1E,UAAWsB,EAAOqD,aAElB1D,EAAAC,cAAA,OAAA,KAAOxB,GACNgB,IAEDgB,GAAgBnC,KAAsBmC,GAAgBnC,GACvDR,GAAWkC,gBAAC2D,EAAM,CAACC,KAAK,QAE1BjF,GACCqB,EAACC,cAAA4D,GACC9E,UAAWiC,EAAGX,EAAOyD,aACrBC,QAASvC,GACToC,KAAK,QACLI,KAAK,WACLZ,MAAM,cACNa,UAAW/E,EACE,cAAA+D,EAAUC,EAAuBgB,oBAC9C/F,KAAMgG,EACNC,kBAMZ,GAOoE,CAClEC,MAAOC,EACPC,YAAaC"}

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

@@ -1,2 +1,2 @@
-var n={toast:"toast_c5d4338e2b",typeNormal:"typeNormal_112696f326",typePositive:"typePositive_8e68154188",typeNegative:"typeNegative_8fd8b9cb27",typeWarning:"typeWarning_0f21e1cffd",closeButton:"closeButton_2546178b46",actionButton:"actionButton_70ce5cd24a",actionLink:"actionLink_6c80ba2aef",typeDark:"typeDark_e3198b09f2",icon:"icon_b574b24b13",withTransition:"withTransition_5105b58e3b",bounceIn:"bounceIn_8f4a8f1649",content:"content_1a63658212",textContent:"textContent_aa8488e806",enterActive:"enterActive_5cf0d0fc74",slideIn:"slideIn_54e7d31da8",exitActive:"exitActive_7f7b24f39d",slideOut:"slideOut_2a1e485551"};!function(n){const t="s_id-72c9912c1efa_3_41_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}(".toast_c5d4338e2b {\n  box-shadow: var(--box-shadow-medium);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  margin: var(--spacing-medium);\n  position: fixed;\n  left: 50%;\n  top: 0;\n  margin-right: auto;\n  margin-left: auto;\n  padding: var(--spacing-small);\n  align-items: center;\n  display: flex;\n  min-width: 200px;\n  width: auto;\n  border-radius: var(--border-radius-small);\n  color: var(--fixed-light-color);\n  transform: translateX(-50%);\n  transition: background-color 80ms cubic-bezier(0.6, 0, 0.4, 1), width 200ms cubic-bezier(0, 0, 0.4, 1);\n}\n.toast_c5d4338e2b.typeNormal_112696f326 {\n  background-color: var(--primary-color);\n}\n.toast_c5d4338e2b.typePositive_8e68154188 {\n  background-color: var(--positive-color);\n}\n.toast_c5d4338e2b.typeNegative_8fd8b9cb27 {\n  background-color: var(--negative-color);\n}\n.toast_c5d4338e2b.typeWarning_0f21e1cffd {\n  background-color: var(--warning-color);\n  color: var(--fixed-dark-color);\n}\n.toast_c5d4338e2b.typeWarning_0f21e1cffd .closeButton_2546178b46 {\n  color: var(--fixed-dark-color);\n}\n.toast_c5d4338e2b.typeWarning_0f21e1cffd .actionButton_70ce5cd24a,\n.toast_c5d4338e2b.typeWarning_0f21e1cffd .actionLink_6c80ba2aef {\n  color: var(--fixed-dark-color);\n  border-color: var(--fixed-dark-color);\n}\n.toast_c5d4338e2b.typeDark_e3198b09f2 {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.toast_c5d4338e2b.typeDark_e3198b09f2 .closeButton_2546178b46 {\n  color: var(--text-color-on-inverted);\n}\n.toast_c5d4338e2b.typeDark_e3198b09f2 .actionButton_70ce5cd24a,\n.toast_c5d4338e2b.typeDark_e3198b09f2 .actionLink_6c80ba2aef {\n  color: var(--text-color-on-inverted);\n  border-color: var(--text-color-on-inverted);\n}\n.icon_b574b24b13 {\n  display: flex;\n  margin-left: var(--spacing-small);\n}\n.actionButton_70ce5cd24a.withTransition_5105b58e3b {\n  opacity: 0;\n  animation: bounceIn_8f4a8f1649 150ms cubic-bezier(0, 0, 0.4, 1);\n  animation-delay: 300ms;\n  animation-fill-mode: forwards;\n}\n.content_1a63658212 {\n  margin: 0 var(--spacing-small);\n  flex: 1;\n}\n.textContent_aa8488e806 {\n  display: inline-flex;\n  flex-grow: 1;\n}\n.enterActive_5cf0d0fc74 {\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n  animation-name: slideIn_54e7d31da8;\n  animation-duration: 350ms;\n  animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.exitActive_7f7b24f39d {\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n  animation-name: slideOut_2a1e485551;\n  animation-duration: 350ms;\n  animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.closeButton_2546178b46 {\n  margin-left: var(--spacing-small);\n}\n@keyframes slideIn_54e7d31da8 {\n  0% {\n    transform: translate(-50%, -100px);\n  }\n  40% {\n    transform: translate(-50%, 16px);\n  }\n  100% {\n    transform: translate(-50%, 0px);\n  }\n}\n@keyframes slideOut_2a1e485551 {\n  0% {\n    transform: translate(-50%, 0);\n  }\n  100% {\n    transform: translate(-50%, -100px);\n    opacity: 0;\n  }\n}\n@keyframes bounceIn_8f4a8f1649 {\n  0% {\n    transform: scale(0.8);\n    opacity: 0;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 1;\n    transform: scale(1);\n  }\n}");export{n as default};
+var n={toast:"toast_c4b59f1f1e",typeNormal:"typeNormal_63afce1810",typePositive:"typePositive_0a17fcaec7",typeNegative:"typeNegative_12be58a175",typeWarning:"typeWarning_e90ed6d5ad",closeButton:"closeButton_3f0fa6855e",actionButton:"actionButton_c7feab9a41",actionLink:"actionLink_e4f88b8a67",typeDark:"typeDark_fa25097195",icon:"icon_26eb27209e",withTransition:"withTransition_0f80b6b8c9",bounceIn:"bounceIn_b1dde64b26",content:"content_54ee17fd3d",textContent:"textContent_cdcaa0116b",enterActive:"enterActive_47c7d49005",slideIn:"slideIn_b6f31f6390",exitActive:"exitActive_bcb42bb349",slideOut:"slideOut_277ed67824"};!function(n){const t="s_id-72c9912c1efa_3_42_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,e.firstChild?e.insertBefore(a,e.firstChild):e.appendChild(a),a.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}(".toast_c4b59f1f1e {\n  box-shadow: var(--box-shadow-medium);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  margin: var(--spacing-medium);\n  position: fixed;\n  left: 50%;\n  top: 0;\n  margin-right: auto;\n  margin-left: auto;\n  padding: var(--spacing-small);\n  align-items: center;\n  display: flex;\n  min-width: 200px;\n  width: auto;\n  border-radius: var(--border-radius-small);\n  color: var(--fixed-light-color);\n  transform: translateX(-50%);\n  transition: background-color 80ms cubic-bezier(0.6, 0, 0.4, 1), width 200ms cubic-bezier(0, 0, 0.4, 1);\n}\n.toast_c4b59f1f1e.typeNormal_63afce1810 {\n  background-color: var(--primary-color);\n}\n.toast_c4b59f1f1e.typePositive_0a17fcaec7 {\n  background-color: var(--positive-color);\n}\n.toast_c4b59f1f1e.typeNegative_12be58a175 {\n  background-color: var(--negative-color);\n}\n.toast_c4b59f1f1e.typeWarning_e90ed6d5ad {\n  background-color: var(--warning-color);\n  color: var(--fixed-dark-color);\n}\n.toast_c4b59f1f1e.typeWarning_e90ed6d5ad .closeButton_3f0fa6855e {\n  color: var(--fixed-dark-color);\n}\n.toast_c4b59f1f1e.typeWarning_e90ed6d5ad .actionButton_c7feab9a41,\n.toast_c4b59f1f1e.typeWarning_e90ed6d5ad .actionLink_e4f88b8a67 {\n  color: var(--fixed-dark-color);\n  border-color: var(--fixed-dark-color);\n}\n.toast_c4b59f1f1e.typeDark_fa25097195 {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.toast_c4b59f1f1e.typeDark_fa25097195 .closeButton_3f0fa6855e {\n  color: var(--text-color-on-inverted);\n}\n.toast_c4b59f1f1e.typeDark_fa25097195 .actionButton_c7feab9a41,\n.toast_c4b59f1f1e.typeDark_fa25097195 .actionLink_e4f88b8a67 {\n  color: var(--text-color-on-inverted);\n  border-color: var(--text-color-on-inverted);\n}\n.icon_26eb27209e {\n  display: flex;\n  margin-left: var(--spacing-small);\n}\n.actionButton_c7feab9a41.withTransition_0f80b6b8c9 {\n  opacity: 0;\n  animation: bounceIn_b1dde64b26 150ms cubic-bezier(0, 0, 0.4, 1);\n  animation-delay: 300ms;\n  animation-fill-mode: forwards;\n}\n.content_54ee17fd3d {\n  margin: 0 var(--spacing-small);\n  flex: 1;\n}\n.textContent_cdcaa0116b {\n  display: inline-flex;\n  flex-grow: 1;\n}\n.enterActive_47c7d49005 {\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n  animation-name: slideIn_b6f31f6390;\n  animation-duration: 350ms;\n  animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.exitActive_bcb42bb349 {\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n  animation-name: slideOut_277ed67824;\n  animation-duration: 350ms;\n  animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.closeButton_3f0fa6855e {\n  margin-left: var(--spacing-small);\n}\n@keyframes slideIn_b6f31f6390 {\n  0% {\n    transform: translate(-50%, -100px);\n  }\n  40% {\n    transform: translate(-50%, 16px);\n  }\n  100% {\n    transform: translate(-50%, 0px);\n  }\n}\n@keyframes slideOut_277ed67824 {\n  0% {\n    transform: translate(-50%, 0);\n  }\n  100% {\n    transform: translate(-50%, -100px);\n    opacity: 0;\n  }\n}\n@keyframes bounceIn_b1dde64b26 {\n  0% {\n    transform: scale(0.8);\n    opacity: 0;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 1;\n    transform: scale(1);\n  }\n}");export{n as default};
 //# sourceMappingURL=Toast.module.scss.js.map

package/dist/src/components/Toast/ToastLink/ToastLink.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={actionLink:"actionLink_a6f10dbb41"};!function(e){const t="s_id-a224471727c9_3_41_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".actionLink_a6f10dbb41 {\n  color: var(--text-color-on-primary);\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n}\n.actionLink_a6f10dbb41:hover {\n  color: inherit;\n}");export{e as default};
+var e={actionLink:"actionLink_77ffd15575"};!function(e){const t="s_id-a224471727c9_3_42_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".actionLink_77ffd15575 {\n  color: var(--text-color-on-primary);\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n}\n.actionLink_77ffd15575:hover {\n  color: inherit;\n}");export{e as default};
 //# sourceMappingURL=ToastLink.module.scss.js.map

package/dist/src/components/Toggle/MockToggle.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={toggle:"toggle_e1177841bb","focus-visible":"focus-visible_988e67fb06",selected:"selected_112696f326",notSelected:"notSelected_8cdee143da",disabled:"disabled_c76923a4a7",medium:"medium_2e54fade8d",small:"small_195bb1ffab"};!function(e){const n="s_id-49e22e19a989_3_41_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,o.firstChild?o.insertBefore(t,o.firstChild):o.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('.toggle_e1177841bb {\n  border: none;\n  margin: 0;\n  padding: 0;\n  width: auto;\n  overflow: visible;\n  background: transparent;\n  /* inherit font & color from ancestor */\n  color: inherit;\n  font: inherit;\n  /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */\n  line-height: normal;\n  /* Corrects font smoothing for webkit */\n  -webkit-font-smoothing: inherit;\n  -moz-osx-font-smoothing: inherit;\n  /* Corrects inability to style clickable `input` types in iOS */\n  appearance: none;\n  transition: background-color var(--motion-productive-medium) var(--motion-timing-transition);\n  margin: 0 var(--spacing-small);\n  position: relative;\n  height: var(--toggle-height);\n  width: var(--toggle-width);\n  cursor: pointer;\n  border-radius: 100px !important;\n}\n.toggle_e1177841bb:focus-visible, .toggle_e1177841bb.focus-visible_988e67fb06 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.toggle_e1177841bb:focus:not(.focus-visible_988e67fb06) {\n  outline: none;\n}\n.toggle_e1177841bb::after {\n  background-color: var(--primary-background-color);\n  content: " ";\n  position: absolute;\n  width: var(--circle-size);\n  height: var(--circle-size);\n  border-radius: 50%;\n  top: calc(50% - 9px);\n  transition: left var(--motion-productive-medium) var(--motion-timing-transition);\n}\n.toggle_e1177841bb.selected_112696f326 {\n  background-color: var(--primary-color);\n}\n.toggle_e1177841bb.selected_112696f326::after {\n  left: 20px;\n}\n.toggle_e1177841bb.notSelected_8cdee143da {\n  background-color: var(--ui-border-color);\n}\n.toggle_e1177841bb.notSelected_8cdee143da::after {\n  left: 3px;\n}\n.toggle_e1177841bb.disabled_c76923a4a7 {\n  opacity: var(--disabled-component-opacity);\n  cursor: not-allowed;\n}\n.toggle_e1177841bb.medium_2e54fade8d {\n  --toggle-width: 41px;\n  --toggle-height: 24px;\n}\n.toggle_e1177841bb.medium_2e54fade8d::after {\n  --circle-size: 18px;\n}\n.toggle_e1177841bb.small_195bb1ffab {\n  --toggle-width: 28px;\n  --toggle-height: 16px;\n}\n.toggle_e1177841bb.small_195bb1ffab::after {\n  --circle-size: 12px;\n  top: calc(50% - 6px);\n  left: 14px;\n}\n.toggle_e1177841bb.small_195bb1ffab.notSelected_8cdee143da::after {\n  left: 2px;\n}');export{e as default};
+var e={toggle:"toggle_c3b20a3d1f","focus-visible":"focus-visible_c98abb5352",selected:"selected_63afce1810",notSelected:"notSelected_3170c73889",disabled:"disabled_2529d98940",medium:"medium_8d69f46386",small:"small_d2e5696283"};!function(e){const n="s_id-49e22e19a989_3_42_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,o.firstChild?o.insertBefore(t,o.firstChild):o.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('.toggle_c3b20a3d1f {\n  border: none;\n  margin: 0;\n  padding: 0;\n  width: auto;\n  overflow: visible;\n  background: transparent;\n  /* inherit font & color from ancestor */\n  color: inherit;\n  font: inherit;\n  /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */\n  line-height: normal;\n  /* Corrects font smoothing for webkit */\n  -webkit-font-smoothing: inherit;\n  -moz-osx-font-smoothing: inherit;\n  /* Corrects inability to style clickable `input` types in iOS */\n  appearance: none;\n  transition: background-color var(--motion-productive-medium) var(--motion-timing-transition);\n  margin: 0 var(--spacing-small);\n  position: relative;\n  height: var(--toggle-height);\n  width: var(--toggle-width);\n  cursor: pointer;\n  border-radius: 100px !important;\n}\n.toggle_c3b20a3d1f:focus-visible, .toggle_c3b20a3d1f.focus-visible_c98abb5352 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.toggle_c3b20a3d1f:focus:not(.focus-visible_c98abb5352) {\n  outline: none;\n}\n.toggle_c3b20a3d1f::after {\n  background-color: var(--primary-background-color);\n  content: " ";\n  position: absolute;\n  width: var(--circle-size);\n  height: var(--circle-size);\n  border-radius: 50%;\n  top: calc(50% - 9px);\n  transition: left var(--motion-productive-medium) var(--motion-timing-transition);\n}\n.toggle_c3b20a3d1f.selected_63afce1810 {\n  background-color: var(--primary-color);\n}\n.toggle_c3b20a3d1f.selected_63afce1810::after {\n  left: 20px;\n}\n.toggle_c3b20a3d1f.notSelected_3170c73889 {\n  background-color: var(--ui-border-color);\n}\n.toggle_c3b20a3d1f.notSelected_3170c73889::after {\n  left: 3px;\n}\n.toggle_c3b20a3d1f.disabled_2529d98940 {\n  opacity: var(--disabled-component-opacity);\n  cursor: not-allowed;\n}\n.toggle_c3b20a3d1f.medium_8d69f46386 {\n  --toggle-width: 41px;\n  --toggle-height: 24px;\n}\n.toggle_c3b20a3d1f.medium_8d69f46386::after {\n  --circle-size: 18px;\n}\n.toggle_c3b20a3d1f.small_d2e5696283 {\n  --toggle-width: 28px;\n  --toggle-height: 16px;\n}\n.toggle_c3b20a3d1f.small_d2e5696283::after {\n  --circle-size: 12px;\n  top: calc(50% - 6px);\n  left: 14px;\n}\n.toggle_c3b20a3d1f.small_d2e5696283.notSelected_3170c73889::after {\n  left: 2px;\n}');export{e as default};
 //# sourceMappingURL=MockToggle.module.scss.js.map

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

@@ -1,2 +1,2 @@
-import e,{forwardRef as a}from"react";import t from"classnames";import{noop as s}from"lodash-es";import{Switch as r}from"../Switch/Switch.js";import{MockToggle as o}from"./MockToggle.js";import i from"./Toggle.module.scss.js";import{getTestId as d,ComponentDefaultTestId as l}from"../../tests/testIds.js";import{ComponentVibeId as m}from"../../tests/constants.js";var n=a((function(a,n){var c=a.id,f=a.className,p=a.toggleSelectedClassName,v=a.isDefaultSelected,u=void 0===v||v,g=a.isSelected,C=a.onChange,b=void 0===C?s:C,O=a.value,T=a.name,h=a.disabled,L=a.ariaLabel,N=a.ariaControls,j=a.areLabelsHidden,x=void 0!==j&&j,S=a.onOverrideText,w=void 0===S?"On":S,E=a.offOverrideText,G=void 0===E?"Off":E,k=a.size,z=void 0===k?"medium":k,H=a["data-testid"],I=t(i.wrapper),D=t(i.toggleInput);return e.createElement(r,{defaultChecked:u,checked:g,id:c,wrapperClassName:I,onChange:b,value:O,name:T,disabled:h,ariaLabel:L,ariaControls:N,inputClassName:D,ref:n,"data-testid":H||d(l.TOGGLE),"data-vibe":m.TOGGLE},e.createElement(o,{areLabelsHidden:x,offOverrideText:G,onOverrideText:w,disabled:h,className:f,selectedClassName:p,size:z}))}));export{n as default};
+import e,{forwardRef as a}from"react";import t from"classnames";import{noop as s}from"lodash-es";import r from"../Switch/Switch.js";import{MockToggle as o}from"./MockToggle.js";import i from"./Toggle.module.scss.js";import{getTestId as d,ComponentDefaultTestId as l}from"../../tests/testIds.js";import{ComponentVibeId as m}from"../../tests/constants.js";var n=a((function(a,n){var c=a.id,f=a.className,p=a.toggleSelectedClassName,v=a.isDefaultSelected,u=void 0===v||v,g=a.isSelected,C=a.onChange,b=void 0===C?s:C,O=a.value,T=a.name,h=a.disabled,L=a.ariaLabel,N=a.ariaControls,j=a.areLabelsHidden,x=void 0!==j&&j,S=a.onOverrideText,w=void 0===S?"On":S,E=a.offOverrideText,G=void 0===E?"Off":E,k=a.size,z=void 0===k?"medium":k,H=a["data-testid"],I=t(i.wrapper),D=t(i.toggleInput);return e.createElement(r,{defaultChecked:u,checked:g,id:c,wrapperClassName:I,onChange:b,value:O,name:T,disabled:h,ariaLabel:L,ariaControls:N,inputClassName:D,ref:n,"data-testid":H||d(l.TOGGLE),"data-vibe":m.TOGGLE},e.createElement(o,{areLabelsHidden:x,offOverrideText:G,onOverrideText:w,disabled:h,className:f,selectedClassName:p,size:z}))}));export{n as default};
 //# sourceMappingURL=Toggle.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Toggle.js","sources":["../../../../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import React, { ChangeEvent, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { noop as NOOP } from \"lodash-es\";\nimport { Switch } from \"../Switch/Switch\";\nimport { MockToggle } from \"./MockToggle\";\nimport { ~~VibeComponent,~~ VibeComponentProps } from \"../../types\";\nimport styles from \"./Toggle.module.scss\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { ToggleSize } from \"./Toggle.types\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ToggleProps extends VibeComponentProps {\n /*\n Class name applied when the toggle is selected.\n /\n toggleSelectedClassName?: string;\n /\n If true, the toggle is selected by default.\n /\n isDefaultSelected?: boolean;\n /\n Controls the selected state of the toggle.\n /\n isSelected?: boolean;\n /\n Callback fired when the toggle state changes.\n /\n onChange?: (value: boolean, event: ChangeEvent<HTMLInputElement>) => void;\n /\n The value associated with the toggle.\n /\n value?: string;\n /\n The name attribute of the toggle input.\n /\n name?: string;\n /\n If true, disables the toggle.\n /\n disabled?: boolean;\n /\n If true, hides the on/off labels.\n /\n areLabelsHidden?: boolean;\n /\n The text displayed when the toggle is in the \"on\" position.\n /\n onOverrideText?: string;\n /\n The text displayed when the toggle is in the \"off\" position.\n /\n offOverrideText?: string;\n /\n The ARIA label for accessibility.\n /\n ariaLabel?: string;\n /\n The ID of the element controlled by the toggle.\n /\n ariaControls?: string;\n /\n The size of the toggle.\n */\n size?: ToggleSize;\n}\n\nconst Toggle: ~~VibeComponent<ToggleProps, HTMLInputElement>~~ = forwardRef(\n (\n {\n id,\n className,\n toggleSelectedClassName,\n isDefaultSelected = true,\n isSelected,\n onChange = NOOP,\n value,\n name,\n disabled,\n ariaLabel,\n ariaControls,\n areLabelsHidden = false,\n onOverrideText = \"On\",\n offOverrideText = \"Off\",\n size = \"medium\",\n \"data-testid\": dataTestId\n }: ToggleProps,\n ref\n ) => {\n const wrapperClassName = cx(styles.wrapper);\n const inputClassName = cx(styles.toggleInput);\n\n return (\n <Switch\n defaultChecked={isDefaultSelected}\n checked={isSelected}\n id={id}\n wrapperClassName={wrapperClassName}\n onChange={onChange}\n value={value}\n name={name}\n disabled={disabled}\n ariaLabel={ariaLabel}\n ariaControls={ariaControls}\n inputClassName={inputClassName}\n ref={ref}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TOGGLE)}\n data-vibe={ComponentVibeId.TOGGLE}\n >\n <MockToggle\n areLabelsHidden={areLabelsHidden}\n offOverrideText={offOverrideText}\n onOverrideText={onOverrideText}\n disabled={disabled}\n className={className}\n selectedClassName={toggleSelectedClassName}\n size={size}\n />\n </Switch>\n );\n }\n);\n\nexport default Toggle;\n"],"names":["Toggle","forwardRef","_ref","ref","id","className","toggleSelectedClassName","_ref$isDefaultSelecte","isDefaultSelected","isSelected","_ref$onChange","onChange","NOOP","value","name","disabled","ariaLabel","ariaControls","_ref$areLabelsHidden","areLabelsHidden","_ref$onOverrideText","onOverrideText","_ref$offOverrideText","offOverrideText","_ref$size","size","dataTestId","wrapperClassName","cx","styles","wrapper","inputClassName","toggleInput","React","createElement","Switch","defaultChecked","checked","getTestId","ComponentDefaultTestId","TOGGLE","ComponentVibeId","MockToggle","selectedClassName"],"mappings":"~~4WAkEMA~~,IAAAA,~~EAAuDC~~,~~GAC3D~~,SAAAC,EAmBEC,GACE,IAlBAC,EAAEF,EAAFE,GACAC,EAASH,EAATG,UACAC,EAAuBJ,EAAvBI,wBAAuBC,EAAAL,EACvBM,kBAAAA,OAAoB,IAAHD,GAAOA,EACxBE,EAAUP,EAAVO,WAAUC,EAAAR,EACVS,SAAAA,OAAWC,IAAHF,EAAGE,EAAIF,EACfG,EAAKX,EAALW,MACAC,EAAIZ,EAAJY,KACAC,EAAQb,EAARa,SACAC,EAASd,EAATc,UACAC,EAAYf,EAAZe,aAAYC,EAAAhB,EACZiB,gBAAAA,OAAkB,IAAHD,GAAQA,EAAAE,EAAAlB,EACvBmB,eAAAA,OAAiB,IAAHD,EAAG,KAAIA,EAAAE,EAAApB,EACrBqB,gBAAAA,OAAkB,IAAHD,EAAG,MAAKA,EAAAE,EAAAtB,EACvBuB,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACAE,EAAUxB,EAAzB,eAIIyB,EAAmBC,EAAGC,EAAOC,SAC7BC,EAAiBH,EAAGC,EAAOG,aAEjC,OACEC,EAAAC,cAACC,EAAM,CACLC,eAAgB5B,EAChB6B,QAAS5B,EACTL,GAAIA,EACJuB,iBAAkBA,EAClBhB,SAAUA,EACVE,MAAOA,EACPC,KAAMA,EACNC,SAAUA,EACVC,UAAWA,EACXC,aAAcA,EACdc,eAAgBA,EAChB5B,IAAKA,EAAG,cACKuB,GAAcY,EAAUC,EAAuBC,QACjD,YAAAC,EAAgBD,QAE3BP,EAAAC,cAACQ,EAAU,CACTvB,gBAAiBA,EACjBI,gBAAiBA,EACjBF,eAAgBA,EAChBN,SAAUA,EACVV,UAAWA,EACXsC,kBAAmBrC,EACnBmB,KAAMA,IAId"}
1	+ {"version":3,"file":"Toggle.js","sources":["../../../../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import React, { ChangeEvent, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { noop as NOOP } from \"lodash-es\";\nimport Switch from \"../Switch/Switch\";\nimport { MockToggle } from \"./MockToggle\";\nimport { VibeComponentProps } from \"../../types\";\nimport styles from \"./Toggle.module.scss\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { ToggleSize } from \"./Toggle.types\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ToggleProps extends VibeComponentProps {\n /*\n Class name applied when the toggle is selected.\n /\n toggleSelectedClassName?: string;\n /\n If true, the toggle is selected by default.\n /\n isDefaultSelected?: boolean;\n /\n Controls the selected state of the toggle.\n /\n isSelected?: boolean;\n /\n Callback fired when the toggle state changes.\n /\n onChange?: (value: boolean, event: ChangeEvent<HTMLInputElement>) => void;\n /\n The value associated with the toggle.\n /\n value?: string;\n /\n The name attribute of the toggle input.\n /\n name?: string;\n /\n If true, disables the toggle.\n /\n disabled?: boolean;\n /\n If true, hides the on/off labels.\n /\n areLabelsHidden?: boolean;\n /\n The text displayed when the toggle is in the \"on\" position.\n /\n onOverrideText?: string;\n /\n The text displayed when the toggle is in the \"off\" position.\n /\n offOverrideText?: string;\n /\n The ARIA label for accessibility.\n /\n ariaLabel?: string;\n /\n The ID of the element controlled by the toggle.\n /\n ariaControls?: string;\n /\n The size of the toggle.\n */\n size?: ToggleSize;\n}\n\nconst Toggle = forwardRef(\n (\n {\n id,\n className,\n toggleSelectedClassName,\n isDefaultSelected = true,\n isSelected,\n onChange = NOOP,\n value,\n name,\n disabled,\n ariaLabel,\n ariaControls,\n areLabelsHidden = false,\n onOverrideText = \"On\",\n offOverrideText = \"Off\",\n size = \"medium\",\n \"data-testid\": dataTestId\n }: ToggleProps,\n ref: React.ForwardedRef<HTMLInputElement>\n ) => {\n const wrapperClassName = cx(styles.wrapper);\n const inputClassName = cx(styles.toggleInput);\n\n return (\n <Switch\n defaultChecked={isDefaultSelected}\n checked={isSelected}\n id={id}\n wrapperClassName={wrapperClassName}\n onChange={onChange}\n value={value}\n name={name}\n disabled={disabled}\n ariaLabel={ariaLabel}\n ariaControls={ariaControls}\n inputClassName={inputClassName}\n ref={ref}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TOGGLE)}\n data-vibe={ComponentVibeId.TOGGLE}\n >\n <MockToggle\n areLabelsHidden={areLabelsHidden}\n offOverrideText={offOverrideText}\n onOverrideText={onOverrideText}\n disabled={disabled}\n className={className}\n selectedClassName={toggleSelectedClassName}\n size={size}\n />\n </Switch>\n );\n }\n);\n\nexport default Toggle;\n"],"names":["Toggle","forwardRef","_ref","ref","id","className","toggleSelectedClassName","_ref$isDefaultSelecte","isDefaultSelected","isSelected","_ref$onChange","onChange","NOOP","value","name","disabled","ariaLabel","ariaControls","_ref$areLabelsHidden","areLabelsHidden","_ref$onOverrideText","onOverrideText","_ref$offOverrideText","offOverrideText","_ref$size","size","dataTestId","wrapperClassName","cx","styles","wrapper","inputClassName","toggleInput","React","createElement","Switch","defaultChecked","checked","getTestId","ComponentDefaultTestId","TOGGLE","ComponentVibeId","MockToggle","selectedClassName"],"mappings":"kWAkEMA,IAAAA,EAASC,GACb,SAAAC,EAmBEC,GACE,IAlBAC,EAAEF,EAAFE,GACAC,EAASH,EAATG,UACAC,EAAuBJ,EAAvBI,wBAAuBC,EAAAL,EACvBM,kBAAAA,OAAoB,IAAHD,GAAOA,EACxBE,EAAUP,EAAVO,WAAUC,EAAAR,EACVS,SAAAA,OAAWC,IAAHF,EAAGE,EAAIF,EACfG,EAAKX,EAALW,MACAC,EAAIZ,EAAJY,KACAC,EAAQb,EAARa,SACAC,EAASd,EAATc,UACAC,EAAYf,EAAZe,aAAYC,EAAAhB,EACZiB,gBAAAA,OAAkB,IAAHD,GAAQA,EAAAE,EAAAlB,EACvBmB,eAAAA,OAAiB,IAAHD,EAAG,KAAIA,EAAAE,EAAApB,EACrBqB,gBAAAA,OAAkB,IAAHD,EAAG,MAAKA,EAAAE,EAAAtB,EACvBuB,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACAE,EAAUxB,EAAzB,eAIIyB,EAAmBC,EAAGC,EAAOC,SAC7BC,EAAiBH,EAAGC,EAAOG,aAEjC,OACEC,EAAAC,cAACC,EAAM,CACLC,eAAgB5B,EAChB6B,QAAS5B,EACTL,GAAIA,EACJuB,iBAAkBA,EAClBhB,SAAUA,EACVE,MAAOA,EACPC,KAAMA,EACNC,SAAUA,EACVC,UAAWA,EACXC,aAAcA,EACdc,eAAgBA,EAChB5B,IAAKA,EAAG,cACKuB,GAAcY,EAAUC,EAAuBC,QACjD,YAAAC,EAAgBD,QAE3BP,EAAAC,cAACQ,EAAU,CACTvB,gBAAiBA,EACjBI,gBAAiBA,EACjBF,eAAgBA,EAChBN,SAAUA,EACVV,UAAWA,EACXsC,kBAAmBrC,EACnBmB,KAAMA,IAId"}