@vibe/core 4.5.6 → 4.6.0-alpha-1900b.0

package/dist/src/components/TextField/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","sources":["../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { type ChangeEventHandler, forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport useDebounceEvent from \"../../hooks/useDebounceEvent\";\nimport { Icon } from \"@vibe/icon\";\nimport { Loader } from \"@vibe/loader\";\nimport { Text } from \"@vibe/typography\";\nimport FieldLabel from \"../FieldLabel/FieldLabel\";\nimport { FEEDBACK_CLASSES, SIZE_MAPPER, TextFieldAriaLabel } from \"./TextFieldConstants\";\nimport { type TextFieldType, type TextFieldSize } from \"./TextField.types\";\nimport { useMergeRef, NOOP } from \"@vibe/shared\";\nimport { Clickable } from \"@vibe/clickable\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\n\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./TextField.module.scss\";\nimport { Tooltip } from \"@vibe/tooltip\";\nimport { HiddenText } from \"../HiddenText\";\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  icon?: 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   * Accessible label for the primary icon.\n   */\n  iconLabel?: string;\n  /**\n   * Accessible label for the secondary icon.\n   */\n  secondaryIconLabel?: string;\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      icon: 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      iconLabel,\n      secondaryIconLabel,\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 || iconLabel || 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 primaryIconAriaLabel = iconLabel || iconTooltipContent;\n    const secondaryIconAriaLabel = secondaryIconLabel || 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            {iconName && (\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                  aria-label={primaryIconAriaLabel}\n                >\n                  <Icon\n                    icon={iconName}\n                    className={cx(styles.icon)}\n                    type=\"font\"\n                    size={size === \"small\" ? \"16px\" : \"18px\"}\n                  />\n                </Clickable>\n              </Tooltip>\n            )}\n            {secondaryIconName && (\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                  aria-label={secondaryIconAriaLabel}\n                >\n                  <Icon\n                    icon={secondaryIconName}\n                    className={cx(styles.icon)}\n                    type=\"font\"\n                    size={size === \"small\" ? \"16px\" : \"18px\"}\n                  />\n                </Clickable>\n              </Tooltip>\n            )}\n          </div>\n          {shouldShowExtraText && (\n            <Text type=\"text2\" color=\"secondary\" className={cx(styles.subTextContainer)}>\n              {((validation && validation.text) || (isRequiredAndEmpty && requiredErrorText)) && (\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 TextField;\n"],"names":["TextField","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","icon","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","iconLabel","secondaryIconLabel","_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","primaryIconAriaLabel","secondaryIconAriaLabel","React","createElement","cx","styles","textField","_defineProperty","onlyUnderline","labelWrapper","FieldLabel","labelText","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","Icon","addKeyboardHideShowTriggersByDefault","TEXT_FIELD_SECONDARY_BUTTON","Text","color","subTextContainer","subTextContainerStatus","counter","TextFieldAriaLabel","CHAR","HiddenText"],"mappings":"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"}
+{"version":3,"file":"TextField.js","sources":["../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n  ChangeEvent,\n  type ChangeEventHandler,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from \"react\";\nimport useDebounceEvent from \"../../hooks/useDebounceEvent\";\nimport { Icon } from \"@vibe/icon\";\nimport { Loader } from \"@vibe/loader\";\nimport { Text } from \"@vibe/typography\";\nimport FieldLabel from \"../FieldLabel/FieldLabel\";\nimport { FEEDBACK_CLASSES, SIZE_MAPPER, TextFieldAriaLabel } from \"./TextFieldConstants\";\nimport { type TextFieldType, type TextFieldSize } from \"./TextField.types\";\nimport { useMergeRef, NOOP } from \"@vibe/shared\";\nimport { Clickable } from \"@vibe/clickable\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./TextField.module.scss\";\nimport { Tooltip } from \"@vibe/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   * Position of the primary icon inside the text field.\n   */\n  iconPosition?: \"left\" | \"right\";\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      iconPosition = \"right\",\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\n            className={cx(styles.inputWrapper, SIZE_MAPPER[size], validationClass, {\n              [styles.inputWrapperIconLeft]: iconPosition === \"left\" && !!iconName\n            })}\n          >\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            {iconName && (\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                    [styles.iconContainerLeft]: iconPosition === \"left\"\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            )}\n            {secondaryIconName && (\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            )}\n          </div>\n          {shouldShowExtraText && (\n            <Text type=\"text2\" color=\"secondary\" className={cx(styles.subTextContainer)}>\n              {((validation && validation.text) || (isRequiredAndEmpty && requiredErrorText)) && (\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 TextField;\n"],"names":["EMPTY_OBJECT","primary","secondary","TextField","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","_ref$iconPosition","iconPosition","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","inputWrapperIconLeft","input","inputHasIcon","readOnly","getTestId","ComponentDefaultTestId","TEXT_FIELD","ComponentVibeId","loaderContainer","loaderContainerHasIcon","loader","Loader","loaderSvg","Tooltip","content","referenceWrapperClassName","tooltipContainer","Clickable","iconContainer","iconContainerHasIcon","iconContainerActive","iconContainerClickable","iconContainerLeft","onClick","ariaLabel","Icon","iconType","iconSize","addKeyboardHideShowTriggersByDefault","TEXT_FIELD_SECONDARY_BUTTON","Text","color","subTextContainer","subTextContainerStatus","counter","TextFieldAriaLabel","CHAR","HiddenText"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var n={textField:"textField_df1a508a9d",labelWrapper:"labelWrapper_f10b032d44",subTextContainer:"subTextContainer_279bf8c0d6",counter:"counter_9399f50c18",disabled:"disabled_3bf1c00ae7",icon:"icon_09af5c33ff",inputWrapper:"inputWrapper_09af5c33ff",input:"input_b79ea82406",iconContainer:"iconContainer_c63fc3c728",iconContainerHasIcon:"iconContainerHasIcon_48ef94a0e3",readOnly:"readOnly_54f1b23b3b",inputHover:"inputHover_786a744412",inputActive:"inputActive_a8faf68881",inputHasIcon:"inputHasIcon_4e90c2ba3e",round:"round_b5c4a846c1",square:"square_614cf6b583",onlyUnderline:"onlyUnderline_161b36e860",tooltipContainer:"tooltipContainer_ef3ca990f5",wrapperSizeMedium:"wrapperSizeMedium_af88cf41fb",wrapperSizeLarge:"wrapperSizeLarge_68aa5ce103",iconContainerActive:"iconContainerActive_376b83d93b",iconContainerClickable:"iconContainerClickable_51fbf16d3e",inputErrorValidation:"inputErrorValidation_48ef94a0e3",subTextContainerStatus:"subTextContainerStatus_ba6788792e",inputSuccessValidation:"inputSuccessValidation_a6b414bc62",wrapperSizeSmall:"wrapperSizeSmall_6654dc9a82",inputWrapperSizeSmall:"inputWrapperSizeSmall_cf84c94661",loaderContainer:"loaderContainer_6b78da25da",loaderContainerHasIcon:"loaderContainerHasIcon_0b690652fc",loader:"loader_25813835d7",loaderSvg:"loaderSvg_71fb2cac31"};!function(n){const e="s_id-c26ff539ba97_4_5_5";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,a.firstChild?a.insertBefore(t,a.firstChild):a.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n.textField_df1a508a9d {\n  position: relative;\n  box-sizing: border-box;\n  font: var(--font-text2-normal);\n  width: 100%;\n}\n.textField_df1a508a9d * {\n  box-sizing: border-box;\n}\n.textField_df1a508a9d .labelWrapper_f10b032d44 {\n  width: 100%;\n}\n.textField_df1a508a9d .subTextContainer_279bf8c0d6 {\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.textField_df1a508a9d .subTextContainer_279bf8c0d6 .counter_9399f50c18 {\n  margin-inline-start: auto;\n}\n.textField_df1a508a9d.disabled_3bf1c00ae7 .icon_09af5c33ff {\n  cursor: not-allowed;\n}\n.textField_df1a508a9d.disabled_3bf1c00ae7 .inputWrapper_09af5c33ff {\n  cursor: not-allowed;\n}\n.textField_df1a508a9d.disabled_3bf1c00ae7 .inputWrapper_09af5c33ff .input_b79ea82406 {\n  user-select: none;\n  border: none;\n  pointer-events: none;\n  background-color: var(--disabled-background-color);\n  cursor: not-allowed;\n}\n.textField_df1a508a9d.disabled_3bf1c00ae7 .inputWrapper_09af5c33ff .input_b79ea82406::placeholder {\n  color: var(--disabled-text-color);\n}\n.textField_df1a508a9d.disabled_3bf1c00ae7 .inputWrapper_09af5c33ff .iconContainer_c63fc3c728.iconContainerHasIcon_48ef94a0e3:hover {\n  background-color: transparent;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff {\n  width: 100%;\n  position: relative;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406 {\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(--space-8) var(--space-4) var(--space-8) var(--space-12);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  color: var(--primary-text-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406.readOnly_54f1b23b3b {\n  background-color: var(--allgrey-background-color);\n  border: none;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406.inputHover_786a744412 {\n  border-color: var(--primary-text-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406:focus,\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406:active,\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406.inputActive_a8faf68881 {\n  border-color: var(--primary-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406::placeholder {\n  color: var(--placeholder-color);\n  font-weight: 400;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406.inputHasIcon_4e90c2ba3e {\n  padding: var(--space-8) var(--space-24) var(--space-8) var(--space-8);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406.round_b5c4a846c1 {\n  border-radius: 50px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406.square_614cf6b583 {\n  border-radius: 0;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .input_b79ea82406.onlyUnderline_161b36e860 {\n  border-inline: none;\n  border-top: none;\n  padding: var(--space-8) var(--space-24) var(--space-8) var(--space-4);\n  border-radius: 0 !important;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .tooltipContainer_ef3ca990f5 {\n  position: absolute;\n  top: 50%;\n  inset-inline-end: 0;\n  width: 32px;\n  height: 20px;\n  transform: translateY(-50%);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeMedium_af88cf41fb .tooltipContainer_ef3ca990f5 {\n  width: 40px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeLarge_68aa5ce103 .tooltipContainer_ef3ca990f5 {\n  width: 46px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .iconContainer_c63fc3c728 {\n  position: absolute;\n  top: 50%;\n  inset-inline-end: 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  -webkit-appearance: none;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .iconContainer_c63fc3c728.iconContainerActive_376b83d93b.iconContainerHasIcon_48ef94a0e3.iconContainerClickable_51fbf16d3e {\n  pointer-events: all;\n  cursor: pointer;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .iconContainer_c63fc3c728.iconContainerActive_376b83d93b.iconContainerHasIcon_48ef94a0e3:not(.iconContainerClickable_51fbf16d3e) {\n  pointer-events: none;\n  cursor: default;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .iconContainer_c63fc3c728.iconContainerActive_376b83d93b {\n  opacity: 1;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .iconContainer_c63fc3c728.iconContainerActive_376b83d93b .icon_09af5c33ff {\n  opacity: 1;\n  pointer-events: all;\n  transform: rotate(0) scale(1);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .iconContainer_c63fc3c728.iconContainerHasIcon_48ef94a0e3.iconContainerClickable_51fbf16d3e:hover {\n  background-color: var(--primary-background-hover-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .iconContainer_c63fc3c728.iconContainerHasIcon_48ef94a0e3.iconContainerClickable_51fbf16d3e:active {\n  transform: translateY(-50%) scale(0.9);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .iconContainer_c63fc3c728 .icon_09af5c33ff {\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  font-family: var(--font-family);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputErrorValidation_48ef94a0e3:hover .input_b79ea82406 {\n  border-color: var(--negative-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputErrorValidation_48ef94a0e3 .input_b79ea82406 {\n  border-color: var(--negative-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputErrorValidation_48ef94a0e3 .input_b79ea82406:focus,\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputErrorValidation_48ef94a0e3 .input_b79ea82406:active {\n  border-color: var(--negative-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputErrorValidation_48ef94a0e3 .iconContainer_c63fc3c728 .icon_09af5c33ff {\n  color: var(--negative-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputErrorValidation_48ef94a0e3 .iconContainer_c63fc3c728 .icon_09af5c33ff:hover {\n  color: var(--negative-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputErrorValidation_48ef94a0e3 + .subTextContainer_279bf8c0d6 .subTextContainerStatus_ba6788792e,\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputErrorValidation_48ef94a0e3 + .subTextContainer_279bf8c0d6 .counter_9399f50c18 {\n  color: var(--negative-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputSuccessValidation_a6b414bc62:hover .input_b79ea82406 {\n  border-color: var(--positive-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputSuccessValidation_a6b414bc62 .input_b79ea82406 {\n  border-color: var(--positive-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputSuccessValidation_a6b414bc62 .input_b79ea82406:focus,\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputSuccessValidation_a6b414bc62 .input_b79ea82406:active {\n  border-color: var(--positive-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputSuccessValidation_a6b414bc62 .iconContainer_c63fc3c728 .icon_09af5c33ff {\n  color: var(--positive-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputSuccessValidation_a6b414bc62 .iconContainer_c63fc3c728 .icon_09af5c33ff:hover {\n  color: var(--positive-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.inputSuccessValidation_a6b414bc62 + .subTextContainer_279bf8c0d6 .subTextContainerStatus_ba6788792e {\n  color: var(--positive-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeSmall_6654dc9a82 {\n  height: 32px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeSmall_6654dc9a82 .input_b79ea82406 {\n  padding-inline-start: var(--space-8);\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.textField_df1a508a9d .inputWrapper_09af5c33ff.inputWrapperSizeSmall_cf84c94661 .input_b79ea82406.inputHasIcon_4e90c2ba3e.onlyUnderline_161b36e860 {\n  padding-inline-start: var(--space-4);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeMedium_af88cf41fb {\n  height: 40px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeMedium_af88cf41fb .input_b79ea82406 {\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.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeMedium_af88cf41fb .input_b79ea82406.inputHasIcon_4e90c2ba3e {\n  padding: var(--space-8) var(--space-32) var(--space-8) var(--space-12);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeMedium_af88cf41fb .input_b79ea82406.inputHasIcon_4e90c2ba3e.onlyUnderline_161b36e860 {\n  padding-inline-start: 4px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeMedium_af88cf41fb .iconContainer_c63fc3c728 {\n  pointer-events: none;\n  height: 32px;\n  width: 32px;\n  outline: none;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeMedium_af88cf41fb .iconContainer_c63fc3c728:hover + .iconContainer_c63fc3c728 + .input_b79ea82406 {\n  border-color: var(--primary-text-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeLarge_68aa5ce103 {\n  height: 48px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeLarge_68aa5ce103 .input_b79ea82406 {\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.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeLarge_68aa5ce103 .input_b79ea82406.inputHasIcon_4e90c2ba3e {\n  padding: var(--space-8) var(--space-32) var(--space-8) var(--space-12);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeLarge_68aa5ce103 .input_b79ea82406.inputHasIcon_4e90c2ba3e.onlyUnderline_161b36e860 {\n  padding-inline-start: var(--space-4);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeLarge_68aa5ce103 .iconContainer_c63fc3c728 {\n  height: 40px;\n  width: 40px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff:hover .input_b79ea82406 {\n  border-color: var(--primary-text-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .loaderContainer_6b78da25da {\n  position: absolute;\n  top: 50%;\n  inset-inline-end: 4px;\n  width: 24px;\n  height: 24px;\n  transform: translateY(-50%);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .loaderContainer_6b78da25da.loaderContainerHasIcon_0b690652fc {\n  inset-inline-end: 32px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .loaderContainer_6b78da25da .loader_25813835d7 {\n  width: 16px;\n  height: 16px;\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff .loaderContainer_6b78da25da .loader_25813835d7 .loaderSvg_71fb2cac31 {\n  color: var(--secondary-text-color);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeMedium_af88cf41fb .iconContainer_c63fc3c728 .icon_09af5c33ff {\n  font-size: 16px;\n  font-family: var(--font-family);\n}\n.textField_df1a508a9d .inputWrapper_09af5c33ff.wrapperSizeLarge_68aa5ce103 .iconContainer_c63fc3c728 .icon_09af5c33ff {\n  font-size: 16px;\n  font-family: var(--font-family);\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};
+var e={textField:"textField_bb19b1cbba",labelWrapper:"labelWrapper_83b910b9cd",subTextContainer:"subTextContainer_8e4d1746d3",counter:"counter_821d26ec6b",disabled:"disabled_6b2e170441",icon:"icon_5bfcde4c6e",inputWrapper:"inputWrapper_5bfcde4c6e",input:"input_0145ddec61",iconContainer:"iconContainer_60489fd4b8",iconContainerHasIcon:"iconContainerHasIcon_cecae61fd8",readOnly:"readOnly_e4745959dd",inputHover:"inputHover_bc293327f7",inputActive:"inputActive_bc293327f7",inputHasIcon:"inputHasIcon_0005d12a6c",round:"round_fbdb097a66",square:"square_d70fd96ba2",onlyUnderline:"onlyUnderline_70bbd7392b",tooltipContainer:"tooltipContainer_5262cee8ab",wrapperSizeMedium:"wrapperSizeMedium_640a3a9abc",wrapperSizeLarge:"wrapperSizeLarge_b4c9385ae2",iconContainerLeft:"iconContainerLeft_2a2bac1817",inputWrapperIconLeft:"inputWrapperIconLeft_cecae61fd8",iconContainerActive:"iconContainerActive_80fa786853",iconContainerClickable:"iconContainerClickable_c75fa76003",inputErrorValidation:"inputErrorValidation_cecae61fd8",subTextContainerStatus:"subTextContainerStatus_a04be81650",inputSuccessValidation:"inputSuccessValidation_fef7b343f2",wrapperSizeSmall:"wrapperSizeSmall_d4a9982e1b",inputWrapperSizeSmall:"inputWrapperSizeSmall_6687a4cd4f",loaderContainer:"loaderContainer_9ea7d4e314",loaderContainerHasIcon:"loaderContainerHasIcon_28875a4743",loader:"loader_adee989b80",loaderSvg:"loaderSvg_fd97b7e7a8"};!function(e){const n="s_id-bb02dd435862_4_5_3";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n.textField_bb19b1cbba {\n  position: relative;\n  box-sizing: border-box;\n  font: var(--font-text2-normal);\n  width: 100%;\n}\n\n.textField_bb19b1cbba * {\n  box-sizing: border-box;\n}\n\n.textField_bb19b1cbba .labelWrapper_83b910b9cd {\n  width: 100%;\n}\n\n.textField_bb19b1cbba .subTextContainer_8e4d1746d3 {\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_bb19b1cbba .subTextContainer_8e4d1746d3 .counter_821d26ec6b {\n  margin-inline-start: auto;\n}\n\n.textField_bb19b1cbba.disabled_6b2e170441 .icon_5bfcde4c6e {\n  cursor: not-allowed;\n}\n\n.textField_bb19b1cbba.disabled_6b2e170441 .inputWrapper_5bfcde4c6e {\n  cursor: not-allowed;\n}\n\n.textField_bb19b1cbba.disabled_6b2e170441 .inputWrapper_5bfcde4c6e .input_0145ddec61 {\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_bb19b1cbba.disabled_6b2e170441 .inputWrapper_5bfcde4c6e .input_0145ddec61::placeholder {\n  color: var(--disabled-text-color);\n}\n\n.textField_bb19b1cbba.disabled_6b2e170441 .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8.iconContainerHasIcon_cecae61fd8:hover {\n  background-color: transparent;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e {\n  width: 100%;\n  position: relative;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61 {\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(--space-8) var(--space-4) var(--space-8) var(--space-12);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  color: var(--primary-text-color);\n}\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61.readOnly_e4745959dd {\n  background-color: var(--allgrey-background-color);\n  border: none;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61.inputHover_bc293327f7 {\n  border-color: var(--primary-text-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61:focus,\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61:active,\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61.inputActive_bc293327f7 {\n  border-color: var(--primary-text-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61::placeholder {\n  color: var(--placeholder-color);\n  font-weight: 400;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61.inputHasIcon_0005d12a6c {\n  padding: var(--space-8) var(--space-24) var(--space-8) var(--space-8);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61.round_fbdb097a66 {\n  border-radius: 50px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61.square_d70fd96ba2 {\n  border-radius: 0;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .input_0145ddec61.onlyUnderline_70bbd7392b {\n  border-inline: none;\n  border-top: none;\n  padding: var(--space-8) var(--space-24) var(--space-8) var(--space-4);\n  border-radius: 0 !important;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .tooltipContainer_5262cee8ab {\n  position: absolute;\n  top: 50%;\n  inset-inline-end: 0;\n  width: 32px;\n  height: 20px;\n  transform: translateY(-50%);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeMedium_640a3a9abc .tooltipContainer_5262cee8ab {\n  width: 40px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeLarge_b4c9385ae2 .tooltipContainer_5262cee8ab {\n  width: 46px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8 {\n  position: absolute;\n  top: 50%;\n  inset-inline-end: 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  -webkit-appearance: none;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8.iconContainerLeft_2a2bac1817 {\n  left: 8px;\n  right: auto;\n  opacity: 1;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8.iconContainerLeft_2a2bac1817 .icon_5bfcde4c6e {\n  opacity: 1;\n  transform: none;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputWrapperIconLeft_cecae61fd8 .input_0145ddec61 {\n  padding-left: 36px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputWrapperIconLeft_cecae61fd8 .input_0145ddec61.inputHasIcon_0005d12a6c {\n  padding-left: 36px;\n  padding-right: var(--spacing-medium);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8.iconContainerActive_80fa786853.iconContainerHasIcon_cecae61fd8.iconContainerClickable_c75fa76003 {\n  pointer-events: all;\n  cursor: pointer;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8.iconContainerActive_80fa786853.iconContainerHasIcon_cecae61fd8:not(.iconContainerClickable_c75fa76003) {\n  pointer-events: none;\n  cursor: default;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8.iconContainerActive_80fa786853 {\n  opacity: 1;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8.iconContainerActive_80fa786853 .icon_5bfcde4c6e {\n  opacity: 1;\n  pointer-events: all;\n  transform: rotate(0) scale(1);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8.iconContainerHasIcon_cecae61fd8.iconContainerClickable_c75fa76003:hover {\n  background-color: var(--primary-background-hover-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8.iconContainerHasIcon_cecae61fd8.iconContainerClickable_c75fa76003:active {\n  transform: translateY(-50%) scale(0.9);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .iconContainer_60489fd4b8 .icon_5bfcde4c6e {\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  font-family: var(--font-family);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputErrorValidation_cecae61fd8:hover .input_0145ddec61 {\n  border-color: var(--negative-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputErrorValidation_cecae61fd8 .input_0145ddec61 {\n  border-color: var(--negative-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputErrorValidation_cecae61fd8 .input_0145ddec61:focus,\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputErrorValidation_cecae61fd8 .input_0145ddec61:active {\n  border-color: var(--negative-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputErrorValidation_cecae61fd8 .iconContainer_60489fd4b8 .icon_5bfcde4c6e {\n  color: var(--negative-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputErrorValidation_cecae61fd8 .iconContainer_60489fd4b8 .icon_5bfcde4c6e:hover {\n  color: var(--negative-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputErrorValidation_cecae61fd8 + .subTextContainer_8e4d1746d3 .subTextContainerStatus_a04be81650,\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputErrorValidation_cecae61fd8 + .subTextContainer_8e4d1746d3 .counter_821d26ec6b {\n  color: var(--negative-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputSuccessValidation_fef7b343f2:hover .input_0145ddec61 {\n  border-color: var(--positive-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputSuccessValidation_fef7b343f2 .input_0145ddec61 {\n  border-color: var(--positive-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputSuccessValidation_fef7b343f2 .input_0145ddec61:focus,\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputSuccessValidation_fef7b343f2 .input_0145ddec61:active {\n  border-color: var(--positive-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputSuccessValidation_fef7b343f2 .iconContainer_60489fd4b8 .icon_5bfcde4c6e {\n  color: var(--positive-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputSuccessValidation_fef7b343f2 .iconContainer_60489fd4b8 .icon_5bfcde4c6e:hover {\n  color: var(--positive-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.inputSuccessValidation_fef7b343f2 + .subTextContainer_8e4d1746d3 .subTextContainerStatus_a04be81650 {\n  color: var(--positive-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeSmall_d4a9982e1b {\n  height: 32px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeSmall_d4a9982e1b .input_0145ddec61 {\n  padding-inline-start: var(--space-8);\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_bb19b1cbba .inputWrapper_5bfcde4c6e.inputWrapperSizeSmall_6687a4cd4f .input_0145ddec61.inputHasIcon_0005d12a6c.onlyUnderline_70bbd7392b {\n  padding-inline-start: var(--space-4);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeMedium_640a3a9abc {\n  height: 36px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeMedium_640a3a9abc .input_0145ddec61 {\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_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeMedium_640a3a9abc .input_0145ddec61.inputHasIcon_0005d12a6c {\n  padding: var(--space-8) var(--space-32) var(--space-8) var(--space-12);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeMedium_640a3a9abc .input_0145ddec61.inputHasIcon_0005d12a6c.onlyUnderline_70bbd7392b {\n  padding-inline-start: 4px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeMedium_640a3a9abc .iconContainer_60489fd4b8 {\n  pointer-events: none;\n  height: 32px;\n  width: 32px;\n  outline: none;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeMedium_640a3a9abc .iconContainer_60489fd4b8:hover + .iconContainer_60489fd4b8 + .input_0145ddec61 {\n  border-color: var(--primary-text-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeLarge_b4c9385ae2 {\n  height: 40px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeLarge_b4c9385ae2 .input_0145ddec61 {\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_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeLarge_b4c9385ae2 .input_0145ddec61.inputHasIcon_0005d12a6c {\n  padding: var(--space-8) var(--space-32) var(--space-8) var(--space-12);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeLarge_b4c9385ae2 .input_0145ddec61.inputHasIcon_0005d12a6c.onlyUnderline_70bbd7392b {\n  padding-inline-start: var(--space-4);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeLarge_b4c9385ae2 .iconContainer_60489fd4b8 {\n  height: 40px;\n  width: 40px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e:hover .input_0145ddec61 {\n  border-color: var(--primary-text-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .loaderContainer_9ea7d4e314 {\n  position: absolute;\n  top: 50%;\n  inset-inline-end: 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_bb19b1cbba .inputWrapper_5bfcde4c6e .loaderContainer_9ea7d4e314.loaderContainerHasIcon_28875a4743 {\n  inset-inline-end: 32px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .loaderContainer_9ea7d4e314 .loader_adee989b80 {\n  width: 16px;\n  height: 16px;\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e .loaderContainer_9ea7d4e314 .loader_adee989b80 .loaderSvg_fd97b7e7a8 {\n  color: var(--secondary-text-color);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeMedium_640a3a9abc .iconContainer_60489fd4b8 .icon_5bfcde4c6e {\n  font-size: 16px;\n  font-family: var(--font-family);\n}\n\n.textField_bb19b1cbba .inputWrapper_5bfcde4c6e.wrapperSizeLarge_b4c9385ae2 .iconContainer_60489fd4b8 .icon_5bfcde4c6e {\n  font-size: 16px;\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};
 //# sourceMappingURL=TextField.module.scss.js.map

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

@@ -1,2 +1,2 @@
-var e={textWithHighlightWrapper:"textWithHighlightWrapper_d4478c6f13",highlightText:"highlightText_2c21b1a542",withEllipsis:"withEllipsis_546ca60ca9"};!function(e){const t="s_id-42c1fd2afe36_4_5_5";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+t))return;const l=document.createElement("style");l.id=t,i.firstChild?i.insertBefore(l,i.firstChild):i.appendChild(l),l.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.textWithHighlightWrapper_d4478c6f13 {\n  overflow: hidden;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n}\n.textWithHighlightWrapper_d4478c6f13 em.highlightText_2c21b1a542 {\n  background-color: var(--primary-selected-color);\n  color: var(--primary-text-color);\n  border-radius: 2px;\n}\n.textWithHighlightWrapper_d4478c6f13.withEllipsis_546ca60ca9 {\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_5b5fc97a56",highlightText:"highlightText_fd703ae14e",withEllipsis:"withEllipsis_020738f340"};!function(e){const t="s_id-42c1fd2afe36_4_5_3";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)}("/* stylelint-disable */\n/* stylelint-enable */\n.textWithHighlightWrapper_5b5fc97a56 {\n  overflow: hidden;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n}\n\n.textWithHighlightWrapper_5b5fc97a56 em.highlightText_fd703ae14e {\n  background-color: var(--primary-selected-color);\n  color: var(--primary-text-color);\n  border-radius: 2px;\n}\n\n.textWithHighlightWrapper_5b5fc97a56.withEllipsis_020738f340 {\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/Tipseen/Tipseen.module.scss.js

@@ -1,2 +1,2 @@
-var e={tipseenWrapper:"tipseenWrapper_7e4df36989",tipseenWrapperWithoutCustomWidth:"tipseenWrapperWithoutCustomWidth_cd11b03527",floating:"floating_f292864dfb",tipseenHeader:"tipseenHeader_76dc79e930",tipseenTitle:"tipseenTitle_f665108086",tipseenContent:"tipseenContent_fb40b886b6",tipseenCloseButton:"tipseenCloseButton_3d54d87df0",dark:"dark_a2adfe8b95"};!function(e){const n="s_id-077bfe37a52b_4_5_5";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)}("/* stylelint-disable */\n/* stylelint-enable */\n.tipseenWrapper_7e4df36989 {\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_7e4df36989.tipseenWrapperWithoutCustomWidth_cd11b03527 {\n  --tooltip-max-width: 320px;\n}\n.tipseenWrapper_7e4df36989.floating_f292864dfb {\n  position: fixed;\n  bottom: 0;\n  inset-inline-end: 0;\n  margin-bottom: var(--space-16);\n  margin-inline-end: var(--space-16);\n}\n.tipseenWrapper_7e4df36989 .tipseenHeader_76dc79e930 {\n  display: flex;\n  justify-content: flex-start;\n}\n.tipseenWrapper_7e4df36989 .tipseenTitle_f665108086 {\n  padding: var(--space-16) var(--space-32) 0 var(--space-16);\n}\n.tipseenWrapper_7e4df36989 .tipseenContent_fb40b886b6 {\n  margin: 0;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n.tipseenWrapper_7e4df36989 .tipseenCloseButton_3d54d87df0 {\n  position: absolute;\n  top: var(--space-8);\n  inset-inline-end: var(--space-8);\n  z-index: 2;\n}\n.tipseenWrapper_7e4df36989 .tipseenCloseButton_3d54d87df0.dark_a2adfe8b95 {\n  color: var(--color-asphalt);\n}");export{e as default};
+var e={tipseenWrapper:"tipseenWrapper_90de75e3e5",tipseenWrapperWithoutCustomWidth:"tipseenWrapperWithoutCustomWidth_320e570e20",floating:"floating_a069b36517",tipseenHeader:"tipseenHeader_0df2012fa2",tipseenTitle:"tipseenTitle_44cafecd90",tipseenContent:"tipseenContent_e26f711a7b",tipseenCloseButton:"tipseenCloseButton_384b6bff29",dark:"dark_88444b6ea3"};!function(e){const n="s_id-077bfe37a52b_4_5_3";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)}("/* stylelint-disable */\n/* stylelint-enable */\n.tipseenWrapper_90de75e3e5 {\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_90de75e3e5.tipseenWrapperWithoutCustomWidth_320e570e20 {\n  --tooltip-max-width: 320px;\n}\n.tipseenWrapper_90de75e3e5.floating_a069b36517 {\n  position: fixed;\n  bottom: 0;\n  inset-inline-end: 0;\n  margin-bottom: var(--space-16);\n  margin-inline-end: var(--space-16);\n}\n.tipseenWrapper_90de75e3e5 .tipseenHeader_0df2012fa2 {\n  display: flex;\n  justify-content: flex-start;\n}\n.tipseenWrapper_90de75e3e5 .tipseenTitle_44cafecd90 {\n  padding: var(--space-16) var(--space-32) 0 var(--space-16);\n}\n.tipseenWrapper_90de75e3e5 .tipseenContent_e26f711a7b {\n  margin: 0;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n.tipseenWrapper_90de75e3e5 .tipseenCloseButton_384b6bff29 {\n  position: absolute;\n  top: var(--space-8);\n  inset-inline-end: var(--space-8);\n  z-index: 2;\n}\n.tipseenWrapper_90de75e3e5 .tipseenCloseButton_384b6bff29.dark_88444b6ea3 {\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

@@ -1,2 +1,2 @@
-var e={tipseenBasicContent:"tipseenBasicContent_ab5d88f675"};!function(e){const n="s_id-6606edb50944_4_5_5";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".tipseenBasicContent_ab5d88f675 {\n  padding: var(--space-16) 20px var(--space-24) 20px;\n  display: flex;\n  flex-direction: column;\n}\n.tipseenBasicContent_ab5d88f675:not(:first-child) {\n  padding-top: 12px;\n}");export{e as default};
+var e={tipseenBasicContent:"tipseenBasicContent_6436127e60"};!function(e){const n="s_id-6606edb50944_4_5_3";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_6436127e60 {\n  padding: var(--space-16) 20px var(--space-24) 20px;\n  display: flex;\n  flex-direction: column;\n}\n.tipseenBasicContent_6436127e60: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

@@ -1,2 +1,2 @@
-var e={buttons:"buttons_9b54cb7638",dismiss:"dismiss_5b33dfbe0c"};!function(e){const n="s_id-585bd2f4c510_4_5_5";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".buttons_9b54cb7638 {\n  margin-top: 20px;\n  display: flex;\n  justify-content: flex-end;\n}\n\n.dismiss_5b33dfbe0c {\n  margin-inline-end: var(--space-8);\n}");export{e as default};
+var e={buttons:"buttons_7b63b11f24",dismiss:"dismiss_d8c0a19764"};!function(e){const n="s_id-585bd2f4c510_4_5_3";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".buttons_7b63b11f24 {\n  margin-top: 20px;\n  display: flex;\n  justify-content: flex-end;\n}\n\n.dismiss_d8c0a19764 {\n  margin-inline-end: var(--space-8);\n}");export{e as default};
 //# sourceMappingURL=TipseenContent.module.scss.js.map

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

@@ -1,2 +1,2 @@
-var e={tipseenMedia:"tipseenMedia_f66cbb1f8f",colorInverted:"colorInverted_a79e970226"};!function(e){const n="s_id-71e151b2b729_4_5_5";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const r=document.createElement("style");r.id=n,d.firstChild?d.insertBefore(r,d.firstChild):d.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".tipseenMedia_f66cbb1f8f {\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_a79e970226 {\n  border-color: var(--inverted-color-background);\n}");export{e as default};
+var e={tipseenMedia:"tipseenMedia_4c2d502b01",colorInverted:"colorInverted_6c136a10a0"};!function(e){const d="s_id-71e151b2b729_4_5_3";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_4c2d502b01 {\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_6c136a10a0 {\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

@@ -1,2 +1,2 @@
-var e={title:"title_e61f3f270f"};!function(e){const t="s_id-c12c5d8f6c34_4_5_5";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)}(".title_e61f3f270f {\n  padding-inline-end: var(--space-16);\n  padding-bottom: var(--space-4);\n}");export{e as default};
+var e={title:"title_e21aac3763"};!function(e){const t="s_id-c12c5d8f6c34_4_5_3";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)}(".title_e21aac3763 {\n  padding-inline-end: var(--space-16);\n  padding-bottom: var(--space-4);\n}");export{e as default};
 //# sourceMappingURL=TipseenTitle.module.scss.js.map

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

@@ -1,2 +1,2 @@
-var e={tipseenWizard:"tipseenWizard_0ccf82317a",tipseenWizardWizard:"tipseenWizardWizard_f10b032d44"};!function(e){const d="s_id-98eba0c83d1f_4_5_5";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_0ccf82317a {\n  display: flex;\n  flex-direction: column;\n}\n.tipseenWizardWizard_f10b032d44 {\n  width: 100%;\n}");export{e as default};
+var e={tipseenWizard:"tipseenWizard_d2fa709807",tipseenWizardWizard:"tipseenWizardWizard_83b910b9cd"};!function(e){const d="s_id-98eba0c83d1f_4_5_3";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_d2fa709807 {\n  display: flex;\n  flex-direction: column;\n}\n.tipseenWizardWizard_83b910b9cd {\n  width: 100%;\n}");export{e as default};
 //# sourceMappingURL=TipseenWizard.module.scss.js.map

package/dist/src/components/Toast/Toast.js

@@ -1,2 +1,2 @@
-import{defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as e}from"../../../_virtual/_tslib.js";import{camelCase as o}from"es-toolkit";import{getTestId as n,ComponentDefaultTestId as i}from"../../tests/testIds.js";import r from"classnames";import s,{useRef as a,useMemo as l,useCallback as c,useEffect as m}from"react";import{CSSTransition as u}from"react-transition-group";import d from"./ToastLink/ToastLink.js";import p from"./ToastButton/ToastButton.js";import{getIcon as f}from"./ToastHelpers.js";import v from"./Toast.module.scss.js";import T from"../../hooks/usePrevious/index.js";import y from"../../../components/typography/dist/Text/Text.js";import h from"../../../components/layout/dist/Flex/Flex.js";import j from"../../../components/loader/dist/Loader/Loader.js";import g from"../../../components/icon-button/dist/IconButton/IconButton.js";import x from"../../../icons/dist/react/CloseSmall.js";import{getStyle as E}from"../../../shared/dist/utils/typesciptCssModulesHelper.js";import{NOOP as N}from"../../../shared/dist/utils/function-utils.js";var b=function(b){var k=b.open,B=void 0!==k&&k,C=b.loading,O=void 0!==C&&C,A=b.autoHideDuration,L=void 0===A?null:A,_=b.type,w=void 0===_?"normal":_,S=b.icon,H=b.hideIcon,I=void 0!==H&&H,P=b.action,z=b.actions,F=b.children,D=b.closeable,M=void 0===D||D,R=b.onClose,U=void 0===R?N:R,q=b.className,G=b.id,J=b.closeButtonAriaLabel,K=void 0===J?"Close":J,Q=b["data-testid"],V=a(null),W=a(null),X=T(null==z?void 0:z.length),Y=l((function(){return z?z.filter((function(t){return"link"===t.type})).map((function(t){var o=e(t,["type"]);return s.createElement(d,Object.assign({key:o.href,className:v.actionLink},o))})):null}),[z]),Z=l((function(){return void 0!==X&&(null==z?void 0:z.length)!==X}),[z,X]),$=l((function(){return z?z.filter((function(t){return"button"===t.type})).map((function(o,n){var i=o.content,a=e(o,["type","content"]);return s.createElement(p,Object.assign({key:"alert-button-".concat(n),className:r(v.actionButton,t({},v.withTransition,Z))},a),i)})):null}),[z,Z]),tt=l((function(){return r(v.toast,E(v,o("type-"+w)),q)}),[w,q]),et=c((function(){U&&U()}),[U]),ot=a(),nt=c((function(t){U&&null!=t&&(clearTimeout(ot.current),ot.current=setTimeout((function(){et()}),t))}),[et,U]);m((function(){return B&&L>0&&nt(L),function(){clearTimeout(ot.current)}}),[B,L,nt]);var it=!I&&f(w,S),rt=c((function(t){var e=t.style.width;t.style.width="auto";var o=getComputedStyle(t).width;t.style.width=e,t.style.width=o}),[]);return m((function(){V.current&&rt(V.current)}),[F,rt]),s.createElement(u,{in:B,nodeRef:W,classNames:{enterActive:v.enterActive,exitActive:v.exitActive},timeout:400,unmountOnExit:!0},s.createElement(y,{ref:W,id:G,"data-testid":Q||n(i.TOAST,G),type:"text2",element:"div",color:"fixedLight",className:tt,role:"alert","aria-live":"polite"},it&&s.createElement("div",{className:r(v.icon)},it),s.createElement(h,{align:"center",gap:"large",className:v.content},s.createElement(h,{gap:"medium","data-testid":n(i.TOAST_CONTENT),className:v.textContent},s.createElement("span",null,F),Y),($||P)&&($||P),O&&s.createElement(j,{size:"xs"})),M&&s.createElement(g,{className:r(v.closeButton),onClick:et,size:"small",kind:"tertiary",color:"fixed-light","aria-label":K,"data-testid":n(i.TOAST_CLOSE_BUTTON),icon:x,hideTooltip:!0})))};export{b as default};
+import{slicedToArray as t,defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as o}from"../../../_virtual/_tslib.js";import{camelCase as i}from"es-toolkit";import{getTestId as n,ComponentDefaultTestId as r}from"../../tests/testIds.js";import s from"classnames";import a,{useRef as l,useState as c,useMemo as m,useCallback as u,useEffect as d}from"react";import{createPortal as p}from"react-dom";import{CSSTransition as f}from"react-transition-group";import v from"./ToastLink/ToastLink.js";import y from"./ToastButton/ToastButton.js";import{getIcon as T}from"./ToastHelpers.js";import h from"./Toast.module.scss.js";import j from"../../hooks/usePrevious/index.js";import g from"../../../components/tooltip/dist/Tooltip/Tooltip.js";import x from"../../../components/typography/dist/Text/Text.js";import E from"../../../components/layout/dist/Flex/Flex.js";import k from"../../../components/loader/dist/Loader/Loader.js";import N from"../../../components/icon-button/dist/IconButton/IconButton.js";import b from"../../../icons/dist/react/CloseSmall.js";import{getStyle as A}from"../../../shared/dist/utils/typesciptCssModulesHelper.js";import{NOOP as B}from"../../../shared/dist/utils/function-utils.js";var C=function(C){var O=C.open,L=void 0!==O&&O,_=C.loading,w=void 0!==_&&_,S=C.autoHideDuration,H=void 0===S?null:S,I=C.type,P=void 0===I?"normal":I,z=C.icon,F=C.hideIcon,W=void 0!==F&&F,D=C.action,M=C.actions,R=C.children,U=C.closeable,q=void 0===U||U,G=C.onClose,J=void 0===G?B:G,K=C.className,Q=C.id,V=C.closeButtonAriaLabel,X=void 0===V?"Close":V,Y=C.inline,Z=void 0!==Y&&Y,$=C["data-testid"],tt=l(null),et=l(null),ot=l(null),it=c(!1),nt=t(it,2),rt=nt[0],st=nt[1],at=j(null==M?void 0:M.length),lt=m((function(){return M?M.filter((function(t){return"link"===t.type})).map((function(t){var e=o(t,["type"]);return a.createElement(v,Object.assign({key:e.href,className:h.actionLink},e))})):null}),[M]),ct=m((function(){return void 0!==at&&(null==M?void 0:M.length)!==at}),[M,at]),mt=m((function(){return M?M.filter((function(t){return"button"===t.type})).map((function(t,i){var n=t.content,r=o(t,["type","content"]);return a.createElement(y,Object.assign({key:"alert-button-".concat(i),className:s(h.actionButton,e({},h.withTransition,ct)),color:"dark"===P?"fixed-light":"primary"},r),n)})):null}),[M,ct,P]),ut=m((function(){return s(h.toast,A(h,i("type-"+P)),e({},h.inline,Z),K)}),[P,Z,K]),dt=u((function(){J&&J()}),[J]),pt=l(),ft=u((function(t){J&&null!=t&&(clearTimeout(pt.current),pt.current=setTimeout((function(){dt()}),t))}),[dt,J]);d((function(){return L&&H>0&&ft(H),function(){clearTimeout(pt.current)}}),[L,H,ft]),d((function(){var t=ot.current;t&&st(t.scrollWidth>t.clientWidth)}),[R,L]);var vt=!W&&T(P,z),yt=u((function(t){var e=t.style.width;t.style.width="auto";var o=getComputedStyle(t).width;t.style.width=e,t.style.width=o}),[]);d((function(){tt.current&&yt(tt.current)}),[R,yt]);var Tt=a.createElement(g,{content:rt&&"string"==typeof R?R:void 0,position:"top"},a.createElement(x,{ref:et,id:Q,"data-testid":$||n(r.TOAST,Q),type:"text2",element:"div",color:"dark"===P?"fixedLight":"primary",className:ut,role:"alert","aria-live":"polite"},vt&&a.createElement("div",{className:s(h.icon)},vt),a.createElement(E,{align:"center",gap:"medium",className:h.content},a.createElement(E,{gap:"medium","data-testid":n(r.TOAST_CONTENT),className:h.textContent},a.createElement("span",{ref:ot,className:h.message},R),lt),(mt||D)&&(mt||D),w&&a.createElement(k,{size:"xs"})),q&&a.createElement(N,{className:s(h.closeButton),onClick:dt,size:"xs",kind:"tertiary",color:"dark"===P?"fixed-light":"primary","aria-label":X,"data-testid":n(r.TOAST_CLOSE_BUTTON),icon:b,hideTooltip:!0})));return Z?L?Tt:null:p(a.createElement(f,{in:L,nodeRef:et,classNames:{enterActive:h.enterActive,exitActive:h.exitActive},timeout:400,unmountOnExit:!0},Tt),document.body)};export{C as default};
 //# sourceMappingURL=Toast.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Toast.js","sources":["../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { type ReactElement, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { type IconSubComponentProps } from \"@vibe/icon\";\nimport { Text } from \"@vibe/typography\";\nimport { Loader } from \"@vibe/loader\";\nimport { Flex } from \"@vibe/layout\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport ToastLink from \"./ToastLink/ToastLink\";\nimport ToastButton from \"./ToastButton/ToastButton\";\nimport { type ToastType, type ToastAction } from \"./Toast.types\";\nimport { getIcon } from \"./ToastHelpers\";\nimport { NOOP, getStyle } from \"@vibe/shared\";\n\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./Toast.module.scss\";\nimport { IconButton } from \"@vibe/icon-button\";\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 nodeRef = useRef<HTMLDivElement>(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      nodeRef={nodeRef}\n      classNames={{ enterActive: styles.enterActive, exitActive: styles.exitActive }}\n      timeout={400}\n      unmountOnExit\n    >\n      <Text\n        ref={nodeRef}\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      >\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            aria-label={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 Toast;\n"],"names":["Toast","_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","nodeRef","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","TOAST_CLOSE_BUTTON","CloseSmall","hideTooltip"],"mappings":"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"}
+{"version":3,"file":"Toast.js","sources":["../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { type ReactElement, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { type IconSubComponentProps } from \"@vibe/icon\";\nimport { Text } from \"@vibe/typography\";\nimport { Loader } from \"@vibe/loader\";\nimport { Flex } from \"@vibe/layout\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport ToastLink from \"./ToastLink/ToastLink\";\nimport ToastButton from \"./ToastButton/ToastButton\";\nimport { type ToastType, type ToastAction } from \"./Toast.types\";\nimport { getIcon } from \"./ToastHelpers\";\nimport { NOOP, getStyle } from \"@vibe/shared\";\n\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./Toast.module.scss\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport { Tooltip } from \"@vibe/tooltip\";\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   * If true, renders the toast in place (for gallery previews) instead of fixed at the top.\n   */\n  inline?: boolean;\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  inline = false,\n  \"data-testid\": dataTestId\n}: ToastProps) => {\n  const ref = useRef(null);\n  const nodeRef = useRef<HTMLDivElement>(null);\n  const messageRef = useRef<HTMLSpanElement>(null);\n  const [isMessageTruncated, setIsMessageTruncated] = useState(false);\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              color={type === \"dark\" ? \"fixed-light\" : \"primary\"}\n              {...otherProps}\n            >\n              {content}\n            </ToastButton>\n          ))\n      : null;\n  }, [actions, shouldShowButtonTransition, type]);\n\n  const classNames = useMemo(\n    () => cx(styles.toast, getStyle(styles, camelCase(\"type-\" + type)), { [styles.inline]: inline }, className),\n    [type, inline, 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  useEffect(() => {\n    const el = messageRef.current;\n    if (el) {\n      setIsMessageTruncated(el.scrollWidth > el.clientWidth);\n    }\n  }, [children, open]);\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  const tooltipContent = isMessageTruncated && typeof children === \"string\" ? children : undefined;\n\n  const toastElement = (\n    <Tooltip content={tooltipContent} position=\"top\">\n      <Text\n        ref={nodeRef}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.TOAST, id)}\n        type=\"text2\"\n        element=\"div\"\n        color={type === \"dark\" ? \"fixedLight\" : \"primary\"}\n        className={classNames}\n        role=\"alert\"\n        aria-live=\"polite\"\n      >\n        {iconElement && <div className={cx(styles.icon)}>{iconElement}</div>}\n        <Flex align=\"center\" gap=\"medium\" className={styles.content}>\n          <Flex\n            gap=\"medium\"\n            data-testid={getTestId(ComponentDefaultTestId.TOAST_CONTENT)}\n            className={styles.textContent}\n          >\n            <span ref={messageRef} className={styles.message}>\n              {children}\n            </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=\"xs\"\n            kind=\"tertiary\"\n            color={type === \"dark\" ? \"fixed-light\" : \"primary\"}\n            aria-label={closeButtonAriaLabel}\n            data-testid={getTestId(ComponentDefaultTestId.TOAST_CLOSE_BUTTON)}\n            icon={CloseSmall}\n            hideTooltip\n          />\n        )}\n      </Text>\n    </Tooltip>\n  );\n\n  // Gallery / static previews: render in place, skip enter/exit animation.\n  if (inline) {\n    return open ? toastElement : null;\n  }\n\n  // Portal to body so Toast always stacks above app chrome (search, sticky headers).\n  return createPortal(\n    <CSSTransition\n      in={open}\n      nodeRef={nodeRef}\n      classNames={{ enterActive: styles.enterActive, exitActive: styles.exitActive }}\n      timeout={400}\n      unmountOnExit\n    >\n      {toastElement}\n    </CSSTransition>,\n    document.body\n  );\n};\n\nexport default Toast;\n"],"names":["Toast","_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","_ref$inline","inline","dataTestId","ref","useRef","nodeRef","messageRef","_useState","useState","_useState2","_slicedToArray","isMessageTruncated","setIsMessageTruncated","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","color","classNames","toast","getStyle","camelCase","handleClose","useCallback","timerAutoHide","setAutoHideTimer","duration","clearTimeout","current","setTimeout","useEffect","el","scrollWidth","clientWidth","iconElement","getIcon","recalculateElementWidth","element","prevWidth","style","width","endWidth","getComputedStyle","toastElement","Tooltip","position","Text","getTestId","ComponentDefaultTestId","TOAST","role","Flex","align","gap","TOAST_CONTENT","textContent","message","Loader","size","IconButton","closeButton","onClick","kind","TOAST_CLOSE_BUTTON","CloseSmall","hideTooltip","createPortal","CSSTransition","in","enterActive","exitActive","timeout","unmountOnExit","document","body"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var n={toast:"toast_df2ce88d47",typeNormal:"typeNormal_147b0d86d4",typePositive:"typePositive_063c04ba65",typeNegative:"typeNegative_8d59b65ccb",typeWarning:"typeWarning_dc02661393",closeButton:"closeButton_92ae853360",actionButton:"actionButton_10bd13d95f",actionLink:"actionLink_6cc9d2fd0b",typeDark:"typeDark_5de9e88949",icon:"icon_572736a587",withTransition:"withTransition_70caf7c467",bounceIn:"bounceIn_4b656d458d",content:"content_49e14dc22c",textContent:"textContent_c18edd4b4c",enterActive:"enterActive_a9d33b7789",slideIn:"slideIn_f2866c5ba3",exitActive:"exitActive_d15c6cc78b",slideOut:"slideOut_0e99c585d5"};!function(n){const t="s_id-da2ee7919891_4_5_5";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_df2ce88d47 {\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(--space-16);\n  position: fixed;\n  left: 50%;\n  top: 0;\n  margin-inline: auto;\n  padding: var(--space-8);\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_df2ce88d47.typeNormal_147b0d86d4 {\n  background-color: var(--primary-color);\n}\n.toast_df2ce88d47.typePositive_063c04ba65 {\n  background-color: var(--positive-color);\n}\n.toast_df2ce88d47.typeNegative_8d59b65ccb {\n  background-color: var(--negative-color);\n}\n.toast_df2ce88d47.typeWarning_dc02661393 {\n  background-color: var(--warning-color);\n  color: var(--fixed-dark-color);\n}\n.toast_df2ce88d47.typeWarning_dc02661393 .closeButton_92ae853360 {\n  color: var(--fixed-dark-color);\n}\n.toast_df2ce88d47.typeWarning_dc02661393 .actionButton_10bd13d95f,\n.toast_df2ce88d47.typeWarning_dc02661393 .actionLink_6cc9d2fd0b {\n  color: var(--fixed-dark-color);\n  border-color: var(--fixed-dark-color);\n}\n.toast_df2ce88d47.typeDark_5de9e88949 {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.toast_df2ce88d47.typeDark_5de9e88949 .closeButton_92ae853360 {\n  color: var(--text-color-on-inverted);\n}\n.toast_df2ce88d47.typeDark_5de9e88949 .actionButton_10bd13d95f,\n.toast_df2ce88d47.typeDark_5de9e88949 .actionLink_6cc9d2fd0b {\n  color: var(--text-color-on-inverted);\n  border-color: var(--text-color-on-inverted);\n}\n.icon_572736a587 {\n  display: flex;\n  margin-inline-start: var(--space-8);\n}\n.actionButton_10bd13d95f.withTransition_70caf7c467 {\n  opacity: 0;\n  animation: bounceIn_4b656d458d 150ms cubic-bezier(0, 0, 0.4, 1);\n  animation-delay: 300ms;\n  animation-fill-mode: forwards;\n}\n.content_49e14dc22c {\n  margin: 0 var(--space-8);\n  flex: 1;\n}\n.textContent_c18edd4b4c {\n  display: inline-flex;\n  flex-grow: 1;\n}\n.enterActive_a9d33b7789 {\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n  animation-name: slideIn_f2866c5ba3;\n  animation-duration: 350ms;\n  animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.exitActive_d15c6cc78b {\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n  animation-name: slideOut_0e99c585d5;\n  animation-duration: 350ms;\n  animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.closeButton_92ae853360 {\n  margin-inline-start: var(--space-8);\n}\n@keyframes slideIn_f2866c5ba3 {\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_0e99c585d5 {\n  0% {\n    transform: translate(-50%, 0);\n  }\n  100% {\n    transform: translate(-50%, -100px);\n    opacity: 0;\n  }\n}\n@keyframes bounceIn_4b656d458d {\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_79fb6a8937",typeNormal:"typeNormal_2dabbc371a",typePositive:"typePositive_2b1dffba12",typeNegative:"typeNegative_2b1dffba12",typeWarning:"typeWarning_3cd14e1f9b",typeDark:"typeDark_7c0da38568",closeButton:"closeButton_0da25b4b66",actionButton:"actionButton_e5467b6885",actionLink:"actionLink_58e43eb139",inline:"inline_fe0d4df86c",icon:"icon_3d0594dc9c",withTransition:"withTransition_1fa570074e",bounceIn:"bounceIn_ec80bcda8a",content:"content_22fbb5f5b2",textContent:"textContent_4adbc602ee",message:"message_adc800efe1",enterActive:"enterActive_ebae704510",slideIn:"slideIn_8980101091",exitActive:"exitActive_7e7e7ed819",slideOut:"slideOut_2e8189a126"};!function(n){const e="s_id-ab40fcaec88b_4_5_3";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".toast_79fb6a8937 {\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(--space-16);\n  position: fixed;\n  left: 50%;\n  top: 0;\n  margin-inline: auto;\n  padding: var(--space-12);\n  align-items: center;\n  display: flex;\n  gap: var(--space-12);\n  min-width: 200px;\n  max-width: 700px;\n  width: auto;\n  border-radius: var(--border-radius-medium);\n  color: var(--primary-text-color);\n  background-color: var(--primary-background-color);\n  z-index: 100000;\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_79fb6a8937.typeNormal_2dabbc371a, .toast_79fb6a8937.typePositive_2b1dffba12, .toast_79fb6a8937.typeNegative_2b1dffba12, .toast_79fb6a8937.typeWarning_3cd14e1f9b {\n  background-color: var(--primary-background-color);\n  color: var(--primary-text-color);\n}\n.toast_79fb6a8937.typeDark_7c0da38568 {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.toast_79fb6a8937.typeDark_7c0da38568 .closeButton_0da25b4b66 {\n  color: var(--text-color-on-inverted);\n}\n.toast_79fb6a8937.typeDark_7c0da38568 .actionButton_e5467b6885,\n.toast_79fb6a8937.typeDark_7c0da38568 .actionLink_58e43eb139 {\n  color: var(--text-color-on-inverted);\n  border-color: var(--text-color-on-inverted);\n}\n.toast_79fb6a8937.inline_fe0d4df86c {\n  position: relative;\n  left: auto;\n  top: auto;\n  transform: none;\n  margin: 0;\n  max-width: 100%;\n  width: 100%;\n}\n\n.icon_3d0594dc9c {\n  display: inline-flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  width: var(--space-24);\n  height: var(--space-24);\n  min-width: var(--space-24);\n  min-height: var(--space-24);\n  border-radius: 50%;\n  overflow: hidden;\n  background-color: var(--allgrey-background-color);\n  color: var(--primary-text-color);\n}\n.icon_3d0594dc9c svg {\n  width: 16px;\n  height: 16px;\n  flex-shrink: 0;\n  fill: currentColor;\n}\n\n.typePositive_2b1dffba12 .icon_3d0594dc9c {\n  background-color: var(--positive-color);\n  color: var(--text-color-on-primary);\n}\n\n.typeNegative_2b1dffba12 .icon_3d0594dc9c {\n  background-color: var(--negative-color);\n  color: var(--text-color-on-primary);\n}\n\n.typeWarning_3cd14e1f9b .icon_3d0594dc9c {\n  background-color: var(--warning-color);\n  color: var(--text-color-on-primary);\n}\n\n.typeDark_7c0da38568 .icon_3d0594dc9c {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n\n.actionButton_e5467b6885 {\n  flex-shrink: 0;\n}\n\n.actionButton_e5467b6885.withTransition_1fa570074e {\n  opacity: 0;\n  animation: bounceIn_ec80bcda8a 150ms cubic-bezier(0, 0, 0.4, 1);\n  animation-delay: 300ms;\n  animation-fill-mode: forwards;\n}\n\n.actionLink_58e43eb139 {\n  flex-shrink: 0;\n}\n\n.content_22fbb5f5b2 {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n}\n\n.textContent_4adbc602ee {\n  display: flex;\n  flex: 1 1 0;\n  min-width: 0;\n  overflow: hidden;\n  align-items: center;\n}\n\n.message_adc800efe1 {\n  flex: 1 1 0;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.enterActive_ebae704510 {\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n  animation-name: slideIn_8980101091;\n  animation-duration: 350ms;\n  animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n\n.exitActive_7e7e7ed819 {\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n  animation-name: slideOut_2e8189a126;\n  animation-duration: 350ms;\n  animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n\n.closeButton_0da25b4b66 {\n  flex-shrink: 0;\n  margin: 0;\n}\n\n@keyframes slideIn_8980101091 {\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_2e8189a126 {\n  0% {\n    transform: translate(-50%, 0);\n  }\n  100% {\n    transform: translate(-50%, -100px);\n    opacity: 0;\n  }\n}\n@keyframes bounceIn_ec80bcda8a {\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/ToastButton/ToastButton.js

@@ -1,2 +1,2 @@
-import{__rest as t}from"../../../../_virtual/_tslib.js";import s from"react";import{ComponentDefaultTestId as a}from"../../../tests/constants.js";import{getTestId as e}from"../../../tests/testIds.js";import i from"../../../../components/button/dist/Button/Button.js";var o=function(o){var r=o.className,m=o.id,d=o["data-testid"],n=t(o,["className","id","data-testid"]);return s.createElement(i,Object.assign({},n,{id:m,kind:"secondary",marginLeft:!1,"data-testid":d||e(a.TOAST_BUTTON,m),className:r,size:"small",color:"fixed-light"}))};export{o as default};
+import{__rest as t}from"../../../../_virtual/_tslib.js";import s from"react";import{ComponentDefaultTestId as o}from"../../../tests/constants.js";import{getTestId as r}from"../../../tests/testIds.js";import a from"../../../../components/button/dist/Button/Button.js";var e=function(e){var i=e.className,m=e.id,d=e["data-testid"],n=e.color,c=void 0===n?"primary":n,l=t(e,["className","id","data-testid","color"]);return s.createElement(a,Object.assign({},l,{id:m,kind:"secondary",marginLeft:!1,"data-testid":d||r(o.TOAST_BUTTON,m),className:i,size:"xs",color:c}))};export{e as default};
 //# sourceMappingURL=ToastButton.js.map

package/dist/src/components/Toast/ToastButton/ToastButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastButton.js","sources":["../../../../../src/components/Toast/ToastButton/ToastButton.tsx"],"sourcesContent":["import { Button, type ButtonProps } from \"@vibe/button\";\nimport React, { type FC } from \"react\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\n\nexport type ToastButtonProps = ButtonProps;\n\nconst ToastButton: FC<ToastButtonProps> = ({\n  className,\n  id,\n  \"data-testid\": dataTestId,\n  ...buttonProps\n}: ToastButtonProps) => {\n  return (\n    <Button\n      {...buttonProps}\n      id={id}\n      kind=\"secondary\"\n      marginLeft={false}\n      data-testid={dataTestId || getTestId(ComponentDefaultTestId.TOAST_BUTTON, id)}\n      className={className}\n      size=\"small\"\n      color=\"fixed-light\"\n    />\n  );\n};\n\nexport default ToastButton;\n"],"names":["ToastButton","_a","className","id","dataTestId","buttonProps","__rest","React","createElement","Button","kind","marginLeft","getTestId","ComponentDefaultTestId","TOAST_BUTTON","size","color"],"mappings":"2QAOA,IAAMA,EAAoC,SAACC,GAAA,IACzCC,EAEyBD,EAFzBC,UACAC,EACyBF,EADzBE,GACeC,EAAUH,EAAzB,eACGI,EAJsCC,EAAAL,EAAA,CAAA,YAAA,KAAA,gBAMzC,OACEM,EAACC,cAAAC,mBACKJ,EAAW,CACfF,GAAIA,EACJO,KAAK,YACLC,YAAY,EAAK,cACJP,GAAcQ,EAAUC,EAAuBC,aAAcX,GAC1ED,UAAWA,EACXa,KAAK,QACLC,MAAM,gBAGZ"}
+{"version":3,"file":"ToastButton.js","sources":["../../../../../src/components/Toast/ToastButton/ToastButton.tsx"],"sourcesContent":["import { Button, type ButtonProps } from \"@vibe/button\";\nimport React, { type FC } from \"react\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\n\nexport type ToastButtonProps = ButtonProps;\n\nconst ToastButton: FC<ToastButtonProps> = ({\n  className,\n  id,\n  \"data-testid\": dataTestId,\n  color = \"primary\",\n  ...buttonProps\n}: ToastButtonProps) => {\n  return (\n    <Button\n      {...buttonProps}\n      id={id}\n      kind=\"secondary\"\n      marginLeft={false}\n      data-testid={dataTestId || getTestId(ComponentDefaultTestId.TOAST_BUTTON, id)}\n      className={className}\n      size=\"xs\"\n      color={color}\n    />\n  );\n};\n\nexport default ToastButton;\n"],"names":["ToastButton","_a","className","id","dataTestId","_a$color","color","buttonProps","__rest","React","createElement","Button","kind","marginLeft","getTestId","ComponentDefaultTestId","TOAST_BUTTON","size"],"mappings":"2QAOA,IAAMA,EAAoC,SAACC,GAAA,IACzCC,EAKiBD,EALjBC,UACAC,EAIiBF,EAJjBE,GACeC,EAGEH,EAHjB,eAAaI,EAGIJ,EAFjBK,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EACdE,EAAWC,EAAAP,EAL2B,0CAOzC,OACEQ,EAACC,cAAAC,mBACKJ,EAAW,CACfJ,GAAIA,EACJS,KAAK,YACLC,YAAY,EAAK,cACJT,GAAcU,EAAUC,EAAuBC,aAAcb,GAC1ED,UAAWA,EACXe,KAAK,KACLX,MAAOA,IAGb"}

package/dist/src/components/Toast/ToastHelpers.js

@@ -1,2 +1,2 @@
-import{typeof as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t from"react";import{defaultIconMap as r}from"./ToastConstants.js";import e from"../../../components/icon/dist/Icon/Icon.js";var n=function(n,s){return s&&"object"===o(s)?s:s||r[n]?t.createElement(e,{type:s?"font":"svg",icon:s||r[n],size:20,ignoreFocusStyle:!0}):null};export{n as getIcon};
+import{typeof as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import r from"react";import{defaultIconMap as t}from"./ToastConstants.js";import e from"../../../components/icon/dist/Icon/Icon.js";var n={normal:"var(--primary-text-color)",positive:"var(--text-color-on-primary)",negative:"var(--text-color-on-primary)",warning:"var(--text-color-on-primary)",dark:"var(--text-color-on-inverted)"},i=function(i,a){return a&&"object"===o(a)?a:a||t[i]?r.createElement(e,{iconType:a?"font":"svg",icon:a||t[i],iconSize:16,ignoreFocusStyle:!0,style:{color:n[i]}}):null};export{i as getIcon};
 //# sourceMappingURL=ToastHelpers.js.map

package/dist/src/components/Toast/ToastHelpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastHelpers.js","sources":["../../../../src/components/Toast/ToastHelpers.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconSubComponentProps } from \"@vibe/icon\";\nimport { defaultIconMap } from \"./ToastConstants\";\nimport { type ToastType } from \"./Toast.types\";\n\nexport const getIcon = (type: ToastType, icon: string | React.FC<IconSubComponentProps> | null) => {\n  /* icon may be node a may be a string */\n  if (icon && typeof icon === \"object\") {\n    return icon;\n  }\n  return icon || defaultIconMap[type] ? (\n    <Icon type={icon ? \"font\" : \"svg\"} icon={icon || defaultIconMap[type]} size={20} ignoreFocusStyle />\n  ) : null;\n};\n"],"names":["getIcon","type","icon","_typeof","defaultIconMap","React","Icon","size","ignoreFocusStyle"],"mappings":"4MAKO,IAAMA,EAAU,SAACC,EAAiBC,GAEvC,OAAIA,GAAwB,WAAhBC,EAAOD,GACVA,EAEFA,GAAQE,EAAeH,GAC5BI,gBAACC,EAAI,CAACL,KAAMC,EAAO,OAAS,MAAOA,KAAMA,GAAQE,EAAeH,GAAOM,KAAM,GAAIC,kBAAgB,IAC/F,IACN"}
+{"version":3,"file":"ToastHelpers.js","sources":["../../../../src/components/Toast/ToastHelpers.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconSubComponentProps } from \"@vibe/icon\";\nimport { defaultIconMap } from \"./ToastConstants\";\nimport { type ToastType } from \"./Toast.types\";\n\n/** Inline style wins over app-level `svg[class*=\"icon_\"] { color: var(--icon-color) }` rules. */\nconst ICON_COLOR_BY_TYPE: Record<ToastType, string> = {\n  normal: \"var(--primary-text-color)\",\n  positive: \"var(--text-color-on-primary)\",\n  negative: \"var(--text-color-on-primary)\",\n  warning: \"var(--text-color-on-primary)\",\n  dark: \"var(--text-color-on-inverted)\"\n};\n\nexport const getIcon = (type: ToastType, icon: string | React.FC<IconSubComponentProps> | null) => {\n  /* icon may be node a may be a string */\n  if (icon && typeof icon === \"object\") {\n    return icon;\n  }\n  return icon || defaultIconMap[type] ? (\n    <Icon\n      iconType={icon ? \"font\" : \"svg\"}\n      icon={icon || defaultIconMap[type]}\n      iconSize={16}\n      ignoreFocusStyle\n      style={{ color: ICON_COLOR_BY_TYPE[type] }}\n    />\n  ) : null;\n};\n"],"names":["ICON_COLOR_BY_TYPE","normal","positive","negative","warning","dark","getIcon","type","icon","_typeof","defaultIconMap","React","createElement","Icon","iconType","iconSize","ignoreFocusStyle","style","color"],"mappings":"4MAMA,IAAMA,EAAgD,CACpDC,OAAQ,4BACRC,SAAU,+BACVC,SAAU,+BACVC,QAAS,+BACTC,KAAM,iCAGKC,EAAU,SAACC,EAAiBC,GAEvC,OAAIA,GAAwB,WAAhBC,EAAOD,GACVA,EAEFA,GAAQE,EAAeH,GAC5BI,EAAAC,cAACC,EAAI,CACHC,SAAUN,EAAO,OAAS,MAC1BA,KAAMA,GAAQE,EAAeH,GAC7BQ,SAAU,GACVC,kBACA,EAAAC,MAAO,CAAEC,MAAOlB,EAAmBO,MAEnC,IACN"}

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

@@ -1,2 +1,2 @@
-var e={actionLink:"actionLink_63b783413e"};!function(e){const t="s_id-a224471727c9_4_5_5";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_63b783413e {\n  color: var(--text-color-on-primary);\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n}\n.actionLink_63b783413e:hover {\n  color: inherit;\n}");export{e as default};
+var e={actionLink:"actionLink_ddd44bf82d"};!function(e){const t="s_id-db91e2844cab_4_5_3";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_ddd44bf82d {\n  color: var(--link-color);\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n}");export{e as default};
 //# sourceMappingURL=ToastLink.module.scss.js.map

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

@@ -1,2 +1,2 @@
-var n={toggle:"toggle_7dab4ff6b7","focus-visible":"focus-visible_c7d189c5f3",selected:"selected_147b0d86d4",notSelected:"notSelected_9ab175bbeb",disabled:"disabled_9c15ca0c89",medium:"medium_c2f687efd9",small:"small_5eb5067f36",noSpacing:"noSpacing_8db718ca05"};!function(n){const e="s_id-5e47b8a7e8fd_4_5_5";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}('/* stylelint-disable */\n/* stylelint-enable */\n.toggle_7dab4ff6b7 {\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(--space-8);\n  position: relative;\n  height: var(--toggle-height);\n  width: var(--toggle-width);\n  cursor: pointer;\n  border-radius: 100px !important;\n}\n.toggle_7dab4ff6b7:focus-visible, .toggle_7dab4ff6b7.focus-visible_c7d189c5f3 {\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_7dab4ff6b7:focus:not(.focus-visible_c7d189c5f3) {\n  outline: none;\n}\n.toggle_7dab4ff6b7::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: inset-inline-start var(--motion-productive-medium) var(--motion-timing-transition);\n}\n.toggle_7dab4ff6b7.selected_147b0d86d4 {\n  background-color: var(--primary-color);\n}\n.toggle_7dab4ff6b7.selected_147b0d86d4::after {\n  inset-inline-start: 20px;\n}\n.toggle_7dab4ff6b7.notSelected_9ab175bbeb {\n  background-color: var(--ui-border-color);\n}\n.toggle_7dab4ff6b7.notSelected_9ab175bbeb::after {\n  inset-inline-start: 3px;\n}\n.toggle_7dab4ff6b7.disabled_9c15ca0c89 {\n  opacity: var(--disabled-component-opacity);\n  cursor: not-allowed;\n}\n.toggle_7dab4ff6b7.medium_c2f687efd9 {\n  --toggle-width: 41px;\n  --toggle-height: 24px;\n}\n.toggle_7dab4ff6b7.medium_c2f687efd9::after {\n  --circle-size: 18px;\n}\n.toggle_7dab4ff6b7.small_5eb5067f36 {\n  --toggle-width: 28px;\n  --toggle-height: 16px;\n}\n.toggle_7dab4ff6b7.small_5eb5067f36::after {\n  --circle-size: 12px;\n  top: calc(50% - 6px);\n  inset-inline-start: 14px;\n}\n.toggle_7dab4ff6b7.small_5eb5067f36.notSelected_9ab175bbeb::after {\n  inset-inline-start: 2px;\n}\n.toggle_7dab4ff6b7.noSpacing_8db718ca05 {\n  margin: 0;\n}');export{n as default};
+var e={toggle:"toggle_ed5ed95f1d","focus-visible":"focus-visible_93d0f127c5",selected:"selected_c97e99d0c3",notSelected:"notSelected_92fc752293",disabled:"disabled_3d8668c5e1",medium:"medium_55fc3f9051",small:"small_54aa86d786",noSpacing:"noSpacing_fd075fcbaa"};!function(e){const n="s_id-5e47b8a7e8fd_4_5_3";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('/* stylelint-disable */\n/* stylelint-enable */\n.toggle_ed5ed95f1d {\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(--space-8);\n  position: relative;\n  height: var(--toggle-height);\n  width: var(--toggle-width);\n  cursor: pointer;\n  border-radius: 100px !important;\n}\n.toggle_ed5ed95f1d:focus-visible, .toggle_ed5ed95f1d.focus-visible_93d0f127c5 {\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_ed5ed95f1d:focus:not(.focus-visible_93d0f127c5) {\n  outline: none;\n}\n.toggle_ed5ed95f1d::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: inset-inline-start var(--motion-productive-medium) var(--motion-timing-transition);\n}\n.toggle_ed5ed95f1d.selected_c97e99d0c3 {\n  background-color: var(--primary-color);\n}\n.toggle_ed5ed95f1d.selected_c97e99d0c3::after {\n  inset-inline-start: 20px;\n}\n.toggle_ed5ed95f1d.notSelected_92fc752293 {\n  background-color: var(--ui-border-color);\n}\n.toggle_ed5ed95f1d.notSelected_92fc752293::after {\n  inset-inline-start: 3px;\n}\n.toggle_ed5ed95f1d.disabled_3d8668c5e1 {\n  opacity: var(--disabled-component-opacity);\n  cursor: not-allowed;\n}\n.toggle_ed5ed95f1d.medium_55fc3f9051 {\n  --toggle-width: 41px;\n  --toggle-height: 24px;\n}\n.toggle_ed5ed95f1d.medium_55fc3f9051::after {\n  --circle-size: 18px;\n}\n.toggle_ed5ed95f1d.small_54aa86d786 {\n  --toggle-width: 28px;\n  --toggle-height: 16px;\n}\n.toggle_ed5ed95f1d.small_54aa86d786::after {\n  --circle-size: 12px;\n  top: calc(50% - 6px);\n  inset-inline-start: 14px;\n}\n.toggle_ed5ed95f1d.small_54aa86d786.notSelected_92fc752293::after {\n  inset-inline-start: 2px;\n}\n.toggle_ed5ed95f1d.noSpacing_fd075fcbaa {\n  margin: 0;\n}');export{e as default};
 //# sourceMappingURL=MockToggle.module.scss.js.map

package/dist/src/components/Toggle/Toggle.module.scss.js

@@ -1,2 +1,2 @@
-var e={toggleInput:"toggleInput_c119ecb6b2","focus-visible":"focus-visible_048997fc0b",toggleFocusTarget:"toggleFocusTarget_c7d189c5f3",wrapper:"wrapper_be01f24519"};!function(e){const t="s_id-679f544f6e7c_4_5_5";if("undefined"!=typeof document){const c=document.head||document.getElementsByTagName("head")[0];if(c.querySelector("#"+t))return;const l=document.createElement("style");l.id=t,c.firstChild?c.insertBefore(l,c.firstChild):c.appendChild(l),l.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable selector-class-pattern */\n.toggleInput_c119ecb6b2:focus-visible, .toggleInput_c119ecb6b2.focus-visible_048997fc0b { /* stylelint-disable-line selector-class-pattern */ }\n.toggleInput_c119ecb6b2:focus-visible ~ .toggleFocusTarget_c7d189c5f3, .toggleInput_c119ecb6b2.focus-visible_048997fc0b ~ .toggleFocusTarget_c7d189c5f3 {\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.wrapper_be01f24519 {\n  display: flex;\n  align-items: center;\n}");export{e as default};
+var e={toggleInput:"toggleInput_7949eded4b","focus-visible":"focus-visible_05bd10b368",toggleFocusTarget:"toggleFocusTarget_93d0f127c5",wrapper:"wrapper_0b63b70cea"};!function(e){const t="s_id-679f544f6e7c_4_5_3";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const l=document.createElement("style");l.id=t,n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable selector-class-pattern */\n.toggleInput_7949eded4b:focus-visible, .toggleInput_7949eded4b.focus-visible_05bd10b368 { /* stylelint-disable-line selector-class-pattern */ }\n.toggleInput_7949eded4b:focus-visible ~ .toggleFocusTarget_93d0f127c5, .toggleInput_7949eded4b.focus-visible_05bd10b368 ~ .toggleFocusTarget_93d0f127c5 {\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\n.wrapper_0b63b70cea {\n  display: flex;\n  align-items: center;\n}");export{e as default};
 //# sourceMappingURL=Toggle.module.scss.js.map

package/dist/src/components/Toggle/ToggleText.module.scss.js

@@ -1,2 +1,2 @@
-var e={text:"text_8bf61dc3e1",disabled:"disabled_a7997c7d91"};!function(e){const t="s_id-1dee71639eb3_4_5_5";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)}(".text_8bf61dc3e1 {\n  color: var(--primary-text-color);\n  font-style: normal;\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 22px;\n}\n\n.disabled_a7997c7d91 {\n  color: var(--disabled-text-color);\n}");export{e as default};
+var e={text:"text_bced8b6bab",disabled:"disabled_4869e95406"};!function(e){const t="s_id-1dee71639eb3_4_5_3";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)}(".text_bced8b6bab {\n  color: var(--primary-text-color);\n  font-style: normal;\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 22px;\n}\n\n.disabled_4869e95406 {\n  color: var(--disabled-text-color);\n}");export{e as default};
 //# sourceMappingURL=ToggleText.module.scss.js.map

package/dist/src/components/TransitionView/TransitionView.module.scss.js

@@ -1,2 +1,2 @@
-var e={slideshow:"slideshow_7ee3d2628a"};!function(e){const t="s_id-1d828e3be878_4_5_5";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)}(".slideshow_7ee3d2628a {\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n}");export{e as default};
+var e={slideshow:"slideshow_2d8fc1c021"};!function(e){const t="s_id-1d828e3be878_4_5_3";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)}(".slideshow_2d8fc1c021 {\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n}");export{e as default};
 //# sourceMappingURL=TransitionView.module.scss.js.map

package/dist/src/components/VirtualizedGrid/VirtualizedGrid.module.scss.js

@@ -1,2 +1,2 @@
-var e={virtualizedGridWrapper:"virtualizedGridWrapper_c982f997f9"};!function(e){const t="s_id-03a8eed790d8_4_5_5";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,d.firstChild?d.insertBefore(i,d.firstChild):d.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.virtualizedGridWrapper_c982f997f9 {\n  height: 100%;\n  width: 100%;\n}");export{e as default};
+var e={virtualizedGridWrapper:"virtualizedGridWrapper_2d6db05b57"};!function(e){const t="s_id-03a8eed790d8_4_5_3";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,d.firstChild?d.insertBefore(i,d.firstChild):d.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.virtualizedGridWrapper_2d6db05b57 {\n  height: 100%;\n  width: 100%;\n}");export{e as default};
 //# sourceMappingURL=VirtualizedGrid.module.scss.js.map

package/dist/src/components/VirtualizedList/VirtualizedList.module.scss.js

@@ -1,2 +1,2 @@
-var e={virtualizedListWrapper:"virtualizedListWrapper_c982f997f9"};!function(e){const t="s_id-9250e4cf6c59_4_5_5";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)}("/* stylelint-disable */\n/* stylelint-enable */\n.virtualizedListWrapper_c982f997f9 {\n  height: 100%;\n  width: 100%;\n}");export{e as default};
+var e={virtualizedListWrapper:"virtualizedListWrapper_2d6db05b57"};!function(e){const t="s_id-9250e4cf6c59_4_5_3";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,i.firstChild?i.insertBefore(d,i.firstChild):i.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.virtualizedListWrapper_2d6db05b57 {\n  height: 100%;\n  width: 100%;\n}");export{e as default};
 //# sourceMappingURL=VirtualizedList.module.scss.js.map

package/dist/src/components/next/List/List.module.scss.js

@@ -1,2 +1,2 @@
-var e={list:"list_5513862810"};!function(e){const t="s_id-39e4d9ed645a_4_5_5";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)}(".list_5513862810 {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}");export{e as default};
+var e={list:"list_c7d5547e90"};!function(e){const t="s_id-39e4d9ed645a_4_5_3";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)}(".list_c7d5547e90 {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}");export{e as default};
 //# sourceMappingURL=List.module.scss.js.map

package/dist/src/components/next/List/ListTitle/ListTitle.module.scss.js

@@ -1,2 +1,2 @@
-var e={listTitle:"listTitle_8449e0b1cf",small:"small_d89516231b",medium:"medium_8721cf81ac",large:"large_8721cf81ac",sticky:"sticky_26bbbe7d0a"};!function(e){const n="s_id-7bd0f1d1374d_4_5_5";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listTitle_8449e0b1cf {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  border-radius: var(--border-radius-small);\n}\n.small_d89516231b {\n  padding: var(--space-16) var(--space-8) var(--space-8);\n}\n.medium_8721cf81ac {\n  padding: var(--space-16) 12px var(--space-8);\n}\n.large_8721cf81ac {\n  padding: var(--space-16) 12px var(--space-8);\n}\n.sticky_26bbbe7d0a {\n  position: sticky;\n  inset-block-start: 0;\n  background-color: var(--primary-background-color);\n  z-index: 1;\n}");export{e as default};
+var e={listTitle:"listTitle_917706cb62",small:"small_9d6acf95fd",medium:"medium_6bd090ddc6",large:"large_6bd090ddc6",sticky:"sticky_b05c90afa4"};!function(e){const n="s_id-7bd0f1d1374d_4_5_3";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,d.firstChild?d.insertBefore(t,d.firstChild):d.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listTitle_917706cb62 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  border-radius: var(--border-radius-small);\n}\n\n.small_9d6acf95fd {\n  padding: var(--space-16) var(--space-8) var(--space-8);\n}\n\n.medium_6bd090ddc6 {\n  padding: var(--space-16) 12px var(--space-8);\n}\n\n.large_6bd090ddc6 {\n  padding: var(--space-16) 12px var(--space-8);\n}\n\n.sticky_b05c90afa4 {\n  position: sticky;\n  inset-block-start: 0;\n  background-color: var(--primary-background-color);\n  z-index: 1;\n}");export{e as default};
 //# sourceMappingURL=ListTitle.module.scss.js.map

package/dist/src/helpers/textManipulations.js

@@ -0,0 +1,2 @@
+import{convertToArray as t}from"../../shared/dist/utils/function-utils.js";var o=0,r=20,n="en-US";var i=Object.freeze({MIN_PRECISION:o,MAX_PRECISION:r,DEFAULT_LOCAL:n});function e(i){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},a=e.local,c=void 0===a?n:a,u=e.isCompact,l=void 0===u||u,s=e.precision,m=void 0===s?2:s;if(null!=i){var f=function(o){var r;try{r=!!Intl.NumberFormat.supportedLocalesOf(t(o),{localeMatcher:"lookup"}).length}catch(t){r=!1}return r}(c),v=function(t){return o>t?o:t>r?r:t}(m);return new Intl.NumberFormat(f?c:n,Object.assign(Object.assign({},l&&{notation:"compact"}),{maximumFractionDigits:v})).format(i)}}export{e as formatNumber,i as formatNumberConsts};
+//# sourceMappingURL=textManipulations.js.map

package/dist/src/helpers/textManipulations.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"textManipulations.js","sources":["../../../src/helpers/textManipulations.ts"],"sourcesContent":["import { convertToArray } from \"@vibe/shared\";\n\nconst MIN_PRECISION = 0;\nconst MAX_PRECISION = 20;\nconst DEFAULT_LOCAL = \"en-US\";\n\nfunction validateLocalSupported(local: string) {\n  let isLocalSupported;\n  try {\n    const options = { localeMatcher: \"lookup\" as const };\n    isLocalSupported = !!Intl.NumberFormat.supportedLocalesOf(convertToArray(local), options).length;\n  } catch (err) {\n    isLocalSupported = false;\n  }\n\n  return isLocalSupported;\n}\n\nfunction validatePrecision(precision: number) {\n  if (precision < MIN_PRECISION) return MIN_PRECISION;\n  if (precision > MAX_PRECISION) return MAX_PRECISION;\n  return precision;\n}\n\nexport const formatNumberConsts = Object.freeze({\n  MIN_PRECISION,\n  MAX_PRECISION,\n  DEFAULT_LOCAL\n});\n\nexport function formatNumber(\n  value: number,\n  {\n    local = DEFAULT_LOCAL,\n    isCompact = true,\n    precision = 2\n  }: { local?: Intl.Locale[\"language\"]; isCompact?: boolean; precision?: number } = {}\n) {\n  if (value === undefined || value === null) return;\n  const isLocalSupported = validateLocalSupported(local);\n  const normalizedPrecision = validatePrecision(precision);\n  const selectedLocal = isLocalSupported ? local : DEFAULT_LOCAL;\n  return new Intl.NumberFormat(selectedLocal, {\n    ...(isCompact && { notation: \"compact\" }),\n    maximumFractionDigits: normalizedPrecision\n  }).format(value);\n}\n"],"names":["MIN_PRECISION","MAX_PRECISION","DEFAULT_LOCAL","formatNumberConsts","Object","freeze","formatNumber","value","_ref","arguments","length","undefined","_ref$local","local","_ref$isCompact","isCompact","_ref$precision","precision","isLocalSupported","Intl","NumberFormat","supportedLocalesOf","convertToArray","localeMatcher","err","validateLocalSupported","normalizedPrecision","validatePrecision","assign","notation","maximumFractionDigits","format"],"mappings":"2EAEA,IAAMA,EAAgB,EAChBC,EAAgB,GAChBC,EAAgB,YAoBTC,EAAqBC,OAAOC,OAAO,CAC9CL,cAAAA,EACAC,cAAAA,EACAC,cAAAA,aAGcI,EACdC,GAKoF,IAAAC,EAAAC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAF,CAAE,EAAAG,EAAAJ,EAHlFK,MAAAA,OAAQX,IAAHU,EAAGV,EAAaU,EAAAE,EAAAN,EACrBO,UAAAA,OAAY,IAAHD,GAAOA,EAAAE,EAAAR,EAChBS,UAAAA,OAAY,IAAHD,EAAG,EAACA,EAGf,GAAIT,QAAJ,CACA,IAAMW,EAjCR,SAAgCL,GAC9B,IAAIK,EACJ,IAEEA,IAAqBC,KAAKC,aAAaC,mBAAmBC,EAAeT,GADzD,CAAEU,cAAe,WACyDb,MAC3F,CAAC,MAAOc,GACPN,GAAmB,CACrB,CAEA,OAAOA,CACT,CAuB2BO,CAAuBZ,GAC1Ca,EAtBR,SAA2BT,GACzB,OAAgBjB,EAAZiB,EAAkCjB,EAClCiB,EAAYhB,EAAsBA,EAC/BgB,CACT,CAkB8BU,CAAkBV,GAE9C,OAAO,IAAIE,KAAKC,aADMF,EAAmBL,EAAQX,EACPE,OAAAwB,OAAAxB,OAAAwB,OAAA,CAAA,EACpCb,GAAa,CAAEc,SAAU,YAC7B,CAAAC,sBAAuBJ,KACtBK,OAAOxB,EAPiC,CAQ7C"}