@foxford/ui 2.54.0 → 2.55.0-beta-8e3c324-20241210

package/components/Dropdown/Dropdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.mjs","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { forwardRef, useState, useRef, useEffect, useLayoutEffect, useMemo } from 'react'\nimport Fuse from 'fuse.js'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { focusFirstFocusable } from 'shared/utils/dom'\nimport { keyboardKeys } from 'shared/constants'\nimport { FormInput } from 'components/FormInput'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { MenuList } from 'components/MenuList'\nimport { MenuDivider } from 'components/MenuDivider'\nimport { ListItem } from 'components/ListItem'\nimport { InputCheckbox } from 'components/InputCheckbox'\nimport { Chip } from 'components/Chip'\nimport type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { DropdownMenuNoOptions } from './DropdownMenuNoOptions'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON, FuseSearchKeys } from './constants'\nimport { getDropdownInputText, getDropdownSelectedOption, groupDropdownOptions } from './utils'\nimport * as Styled from './style'\nimport type { DropdownProps, DropdownOption } from './types'\n\nconst COMPONENT_NAME = 'Dropdown'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dropdown/types.ts).\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      name = 'fox-dropdown',\n      labelPosition = 'dynamic',\n      searchable = true,\n      primary = true,\n      optionsMultiToggle = true,\n      loading = false,\n      iconProps = {},\n      menuProps = {},\n      loadingIconProps = {},\n      optionsEmptyIconProps = {},\n      autoFocus,\n      disableAutoScrollToSelectedOption,\n      closeMenuOnScroll,\n      contrast,\n      selectedOption,\n      defaultSelectedOption,\n      icon,\n      inputMode,\n      loadingMessage,\n      loadingIcon,\n      maxLength,\n      multiple,\n      onCloseMenu,\n      onOpenMenu,\n      onSelectOption,\n      options,\n      groupSelectedOptions,\n      optionsMultiToggleCaption,\n      optionsEmptyMessage,\n      optionsEmptyIcon,\n      palette,\n      placeholder,\n      readOnly,\n      required,\n      status,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      form,\n      ...rootProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const iconBaseProps: IconProps = {\n      sizes: SIZES_ICON,\n      color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n    }\n\n    const inputLabelId = useMemo(() => nanoid(), [])\n\n    const getRelevantOptions = useMemo(() => {\n      const fuse = new Fuse<DropdownOption>(options, {\n        threshold: 0.4,\n        ignoreLocation: true,\n        keys: [FuseSearchKeys.text, FuseSearchKeys.label, FuseSearchKeys.tags],\n      })\n\n      return (pattern: string): DropdownOption[] =>\n        pattern.length === 0 ? options : fuse.search(pattern).map((result) => result.item)\n    }, [options])\n\n    const [dropdownSelectedOption, setDropdownSelectedOption] = useState<DropdownOption[]>(() =>\n      getDropdownSelectedOption(selectedOption !== undefined ? selectedOption : defaultSelectedOption, multiple)\n    )\n\n    const [inputText, setInputText] = useState<string>(() => getDropdownInputText(dropdownSelectedOption, multiple))\n\n    const [inputFocused, setInputFocused] = useState<boolean>(false)\n\n    const [menuRelevantOptions, setMenuRelevantOptions] = useState<DropdownOption[]>(() =>\n      getRelevantOptions(inputText)\n    )\n\n    const [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n    const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = multiple\n      ? groupDropdownOptions(options, dropdownSelectedOption)\n      : [[], []]\n\n    const menuOpen = menuOpenRequest && !rootProps.disabled\n    const menuNoRelevantOptions = menuRelevantOptions.length === 0 || loading\n\n    const inputSynced = inputText === getDropdownInputText(dropdownSelectedOption)\n    const inputRequired = required && dropdownSelectedOption.length === 0\n    const inputActive = Boolean(menuOpen || inputText || inputFocused)\n\n    const multiToggleChecked = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length === 0\n    const multiToggleIndeterminate = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0\n\n    const inputRef = useRef<HTMLInputElement | null>(null)\n    const menuRef = useRef<HTMLDivElement | null>(null)\n    const menuListRef = useRef<HTMLUListElement | null>(null)\n    const selectedOptionRef = useRef<HTMLElement | null>(null)\n\n    const timeoutIdRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n    const inputTextPrevRef = useRef<string>(inputText)\n    const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n    useEffect(() => {\n      if (inputText === inputTextPrevRef.current) {\n        setMenuRelevantOptions(getRelevantOptions(inputText))\n      } else {\n        inputTextPrevRef.current = inputText\n        timeoutIdRef.current = setTimeout(() => {\n          setMenuRelevantOptions(getRelevantOptions(inputText))\n        }, 150)\n      }\n\n      return () => {\n        if (timeoutIdRef.current) {\n          clearTimeout(timeoutIdRef.current)\n        }\n      }\n    }, [getRelevantOptions, inputText])\n\n    useLayoutEffect(() => {\n      if (selectedOption === undefined) return\n\n      if (!multiple) setInputText(getDropdownInputText(selectedOption))\n      setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n    }, [multiple, selectedOption])\n\n    useEffect(() => {\n      if (menuOpen === menuOpenPrevRef.current) return\n\n      if (menuOpen && onOpenMenu) onOpenMenu()\n      if (!menuOpen && onCloseMenu) onCloseMenu()\n\n      menuOpenPrevRef.current = menuOpen\n    }, [menuOpen, onCloseMenu, onOpenMenu])\n\n    useEffect(() => {\n      if (!multiple && !disableAutoScrollToSelectedOption && menuOpen && menuRef.current && selectedOptionRef.current) {\n        const menuRect = menuRef.current.getBoundingClientRect()\n        const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n        if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n          menuRef.current.scrollTo(0, selectedOptionRef.current.offsetTop)\n        }\n      }\n    }, [multiple, disableAutoScrollToSelectedOption, menuOpen])\n\n    useEffect(() => {\n      const handleScroll = (evt: Event) => {\n        inputRef.current?.focus()\n        setMenuOpenRequest(false)\n\n        if (evt.currentTarget) {\n          evt.currentTarget.removeEventListener(evt.type, handleScroll)\n        }\n      }\n\n      if (closeMenuOnScroll && menuOpen) {\n        document.addEventListener('scroll', handleScroll)\n      }\n\n      return () => {\n        document.removeEventListener('scroll', handleScroll)\n      }\n    }, [closeMenuOnScroll, menuOpen])\n\n    return (\n      <FormInputLabel\n        {...rootProps}\n        {...sizeProps}\n        ref={ref}\n        labelId={inputLabelId}\n        labelPosition={labelPosition}\n        active={inputActive}\n        onColored={contrast}\n        primary={primary}\n        error={status === 'error'}\n        success={status === 'success'}\n        icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n        iconProps={{\n          ...sizeProps,\n          ...iconBaseProps,\n          ...iconProps,\n        }}\n        palette={{\n          color: rootProps.disabled ? palette.labelColorDisabled : palette.labelColor,\n          backgroundColor: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n          backgroundColorHover: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n          borderColor: rootProps.disabled ? palette.borderColorDisabled : palette.borderColor,\n        }}\n        onClick={(evt) => {\n          if (rootProps.onClick) rootProps.onClick(evt)\n\n          if (rootProps.disabled) return\n\n          inputRef.current?.focus()\n\n          if (!menuOpen) {\n            setMenuOpenRequest(true)\n\n            if (searchable && !multiple && inputSynced) {\n              setInputText('')\n              setMenuRelevantOptions(getRelevantOptions(''))\n            }\n          } else if (menuRef.current && evt.target instanceof Node && !menuRef.current.contains(evt.target)) {\n            setMenuOpenRequest(false)\n          }\n        }}\n        onKeyUp={(evt) => {\n          if (rootProps.onKeyUp) rootProps.onKeyUp(evt)\n\n          if (keyboardKeys.Esc.validate(evt.key)) {\n            inputRef.current?.focus()\n            setMenuOpenRequest(false)\n          }\n        }}\n        onPointerDown={(evt) => {\n          if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n          if (evt.target !== inputRef.current && evt.target instanceof Node && evt.currentTarget.contains(evt.target)) {\n            evt.preventDefault()\n          }\n        }}\n        onFocus={(evt) => {\n          if (rootProps.onFocus) rootProps.onFocus(evt)\n\n          if (inputRef.current && evt.target === inputRef.current) {\n            setInputFocused(true)\n\n            if (searchable && !multiple && inputSynced && !menuOpen) {\n              setInputText('')\n              setMenuRelevantOptions(getRelevantOptions(''))\n            }\n          }\n        }}\n        onBlur={(evt) => {\n          if (rootProps.onBlur) rootProps.onBlur(evt)\n\n          if (inputRef.current && evt.target === inputRef.current) {\n            setInputFocused(false)\n          }\n\n          if (!evt.currentTarget.contains(evt.relatedTarget)) {\n            setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n            setMenuOpenRequest(false)\n          }\n        }}\n        input={\n          <>\n            {inputRequired && !searchable && !readOnly && (\n              <Styled.InputMimic\n                required\n                type='text'\n                inputMode='none'\n                form={form}\n                tabIndex={-1}\n                onFocus={() => {\n                  inputRef.current?.focus()\n                }}\n              />\n            )}\n            <FormInput\n              ref={inputRef}\n              aria-labelledby={rootProps.label ? inputLabelId : undefined}\n              type='text'\n              autoComplete='off'\n              autoCapitalize='off'\n              autoCorrect='off'\n              spellCheck='false'\n              form={form}\n              autoFocus={autoFocus}\n              inputMode={searchable ? inputMode : 'none'}\n              maxLength={maxLength}\n              placeholder={placeholder}\n              readOnly={readOnly || !searchable}\n              required={inputRequired}\n              disabled={rootProps.disabled}\n              value={inputText}\n              palette={{\n                color: palette.color,\n                colorDisabled: palette.colorDisabled,\n                placeholderColor: palette.placeholderColor,\n                placeholderColorDisabled: palette.placeholderColorDisabled,\n              }}\n              onClick={(evt) => {\n                if (menuOpen && evt.currentTarget.selectionStart !== evt.currentTarget.selectionEnd) {\n                  evt.stopPropagation()\n                }\n              }}\n              onChange={(evt) => {\n                setInputText(evt.currentTarget.value)\n                setMenuOpenRequest(true)\n              }}\n              onKeyDown={(evt) => {\n                if (keyboardKeys.Enter.validate(evt.key)) {\n                  setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n                  setMenuOpenRequest(false)\n                }\n\n                if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n                  evt.preventDefault()\n\n                  if (searchable && !multiple && inputSynced && !menuOpen) {\n                    setInputText('')\n                    setMenuRelevantOptions(getRelevantOptions(''))\n                  }\n\n                  setMenuOpenRequest((prev) => !prev)\n                }\n\n                if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n                  evt.preventDefault()\n                  focusFirstFocusable(menuListRef.current)\n                }\n              }}\n            />\n            {dropdownSelectedOption.map((item) => (\n              <input\n                key={item.value}\n                type='hidden'\n                name={name}\n                value={item.value}\n                form={form}\n                disabled={rootProps.disabled}\n              />\n            ))}\n          </>\n        }\n        addon={\n          multiple && dropdownSelectedOption.length > 0 ? (\n            <Chip\n              size='xs'\n              active\n              black\n              marginLeft={12}\n              disabled={rootProps.disabled}\n              cursor={rootProps.disabled ? 'not-allowed' : undefined}\n              text={dropdownSelectedOption.length}\n              textProps={{\n                appearance: 'caption',\n                size: 'xs',\n              }}\n              palette={\n                rootProps.disabled\n                  ? {\n                      color: 'content-disabled',\n                      colorHover: 'content-disabled',\n                      backgroundColor: 'bg-disabled-small',\n                      backgroundColorHover: 'bg-disabled-small',\n                    }\n                  : undefined\n              }\n              onPointerDown={(evt) => {\n                evt.preventDefault()\n              }}\n              discardButtonProps={{\n                contrast: !rootProps.disabled,\n                onKeyDown: (evt) => {\n                  if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n                    evt.preventDefault()\n                    focusFirstFocusable(menuListRef.current)\n                  }\n                },\n                onClick: (evt) => {\n                  evt.stopPropagation()\n\n                  if (!readOnly) {\n                    if (selectedOption === undefined) {\n                      setDropdownSelectedOption([])\n                    }\n\n                    if (onSelectOption) onSelectOption([])\n\n                    inputRef.current?.focus()\n                    setMenuOpenRequest(true)\n                  }\n                },\n              }}\n            />\n          ) : undefined\n        }\n        dropdown={\n          menuOpen ? (\n            <DropdownMenu\n              {...menuProps}\n              ref={menuRef}\n              tabIndex={menuNoRelevantOptions ? undefined : 0}\n              secondary={!contrast}\n              elevated={contrast}\n              disableAutoFocus\n              palette={{\n                backgroundColor: palette.menuBackgroundColor,\n                borderColor: palette.menuBorderColor,\n              }}\n              onFocus={(evt) => {\n                if (!menuListRef.current) return\n\n                if (evt.target === evt.currentTarget) {\n                  if (menuListRef.current.contains(evt.relatedTarget)) {\n                    inputRef.current?.focus()\n                  } else {\n                    focusFirstFocusable(menuListRef.current)\n                  }\n                }\n              }}\n              onKeyDown={(evt) => {\n                if (keyboardKeys.Enter.validate(evt.key)) {\n                  inputRef.current?.focus()\n                  setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n                  setMenuOpenRequest(false)\n                }\n              }}\n            >\n              {menuNoRelevantOptions ? (\n                <DropdownMenuNoOptions\n                  loading={loading}\n                  loadingMessage={loadingMessage}\n                  loadingIcon={loadingIcon}\n                  loadingIconProps={{\n                    ...sizeProps,\n                    ...iconBaseProps,\n                    ...loadingIconProps,\n                  }}\n                  emptyMessage={optionsEmptyMessage}\n                  emptyIcon={optionsEmptyIcon}\n                  emptyIconProps={{\n                    ...sizeProps,\n                    ...iconBaseProps,\n                    ...optionsEmptyIconProps,\n                  }}\n                />\n              ) : multiple ? (\n                <MenuList ref={menuListRef}>\n                  {inputText.length === 0 ? (\n                    <>\n                      {optionsMultiToggle && (\n                        <ListItem\n                          {...sizeProps}\n                          text={optionsMultiToggleCaption}\n                          disabled={rootProps.disabled}\n                          borderRadius={8}\n                          ellipsis={false}\n                          textProps={{ wordBreak: 'break-word' }}\n                          onClick={(evt) => {\n                            evt.stopPropagation()\n                          }}\n                          control={\n                            <InputCheckbox\n                              sizes={SIZES_CHECKBOX}\n                              form='none'\n                              name={name}\n                              checked={multiToggleChecked}\n                              indeterminate={multiToggleIndeterminate}\n                              error={(multiToggleChecked || multiToggleIndeterminate) && status === 'error'}\n                              success={(multiToggleChecked || multiToggleIndeterminate) && status === 'success'}\n                              onChange={() => {\n                                if (!readOnly) {\n                                  const update = multiToggleChecked || multiToggleIndeterminate ? [] : [...options]\n\n                                  if (selectedOption === undefined) {\n                                    setDropdownSelectedOption(update)\n                                  }\n\n                                  if (onSelectOption) onSelectOption(update)\n                                }\n                              }}\n                            />\n                          }\n                        />\n                      )}\n                      {optionsMultiToggle && <MenuDivider />}\n                      {groupSelectedOptions &&\n                        menuOptionsGroups[0].map((option) => {\n                          const optionStatus = option.status ?? status\n                          const optionErrorStatus = optionStatus === 'error'\n                          const optionSuccessStatus = optionStatus === 'success'\n\n                          return (\n                            <ListItem\n                              {...sizeProps}\n                              key={option.value}\n                              active\n                              text={option.text}\n                              danger={optionErrorStatus}\n                              success={optionSuccessStatus}\n                              disabled={rootProps.disabled}\n                              borderRadius={8}\n                              ellipsis={false}\n                              textProps={{ wordBreak: 'break-word' }}\n                              onClick={(evt) => {\n                                evt.stopPropagation()\n                                inputRef.current?.focus()\n                              }}\n                              control={\n                                <InputCheckbox\n                                  sizes={SIZES_CHECKBOX}\n                                  form='none'\n                                  name={name}\n                                  value={option.value}\n                                  checked\n                                  error={optionErrorStatus}\n                                  success={optionSuccessStatus}\n                                  onChange={(evt) => {\n                                    if (!readOnly) {\n                                      const update = dropdownSelectedOption.filter(\n                                        (item) => item.value !== evt.currentTarget.value\n                                      )\n\n                                      if (selectedOption === undefined) {\n                                        setDropdownSelectedOption(update)\n                                      }\n\n                                      if (onSelectOption) onSelectOption(update)\n                                    }\n                                  }}\n                                />\n                              }\n                            />\n                          )\n                        })}\n                      {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 && (\n                        <MenuDivider />\n                      )}\n                      {groupSelectedOptions &&\n                        menuOptionsGroups[1].map((option) => (\n                          <ListItem\n                            {...sizeProps}\n                            key={option.value}\n                            text={option.text}\n                            disabled={rootProps.disabled}\n                            borderRadius={8}\n                            ellipsis={false}\n                            textProps={{ wordBreak: 'break-word' }}\n                            onClick={(evt) => {\n                              evt.stopPropagation()\n                              inputRef.current?.focus()\n                            }}\n                            control={\n                              <InputCheckbox\n                                sizes={SIZES_CHECKBOX}\n                                form='none'\n                                name={name}\n                                value={option.value}\n                                checked={false}\n                                onChange={() => {\n                                  if (!readOnly) {\n                                    const update = [...dropdownSelectedOption, option]\n\n                                    if (selectedOption === undefined) {\n                                      setDropdownSelectedOption(update)\n                                    }\n\n                                    if (onSelectOption) onSelectOption(update)\n                                  }\n                                }}\n                              />\n                            }\n                          />\n                        ))}\n                      {!groupSelectedOptions &&\n                        options.map((option) => {\n                          const selected =\n                            dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n                          const optionStatus = option.status ?? status\n                          const optionErrorStatus = selected && optionStatus === 'error'\n                          const optionSuccessStatus = selected && optionStatus === 'success'\n\n                          return (\n                            <ListItem\n                              {...sizeProps}\n                              key={option.value}\n                              text={option.text}\n                              danger={optionErrorStatus}\n                              success={optionSuccessStatus}\n                              disabled={rootProps.disabled}\n                              active={selected}\n                              borderRadius={8}\n                              ellipsis={false}\n                              textProps={{ wordBreak: 'break-word' }}\n                              onClick={(evt) => {\n                                evt.stopPropagation()\n                              }}\n                              control={\n                                <InputCheckbox\n                                  sizes={SIZES_CHECKBOX}\n                                  form='none'\n                                  name={name}\n                                  value={option.value}\n                                  checked={selected}\n                                  error={optionErrorStatus}\n                                  success={optionSuccessStatus}\n                                  onChange={(evt) => {\n                                    if (!readOnly) {\n                                      const update = selected\n                                        ? dropdownSelectedOption.filter(\n                                            (item) => item.value !== evt.currentTarget.value\n                                          )\n                                        : [...dropdownSelectedOption, option]\n\n                                      if (selectedOption === undefined) {\n                                        setDropdownSelectedOption(update)\n                                      }\n\n                                      if (onSelectOption) onSelectOption(update)\n                                    }\n                                  }}\n                                />\n                              }\n                            />\n                          )\n                        })}\n                    </>\n                  ) : (\n                    <>\n                      {menuRelevantOptions.map((option) => {\n                        const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n                        const optionStatus = option.status ?? status\n                        const optionErrorStatus = selected && optionStatus === 'error'\n                        const optionSuccessStatus = selected && optionStatus === 'success'\n\n                        return (\n                          <ListItem\n                            {...sizeProps}\n                            key={option.value}\n                            text={option.text}\n                            danger={optionErrorStatus}\n                            success={optionSuccessStatus}\n                            disabled={rootProps.disabled}\n                            active={selected}\n                            borderRadius={8}\n                            ellipsis={false}\n                            textProps={{ wordBreak: 'break-word' }}\n                            onClick={(evt) => {\n                              evt.stopPropagation()\n                            }}\n                            control={\n                              <InputCheckbox\n                                sizes={SIZES_CHECKBOX}\n                                form='none'\n                                name={name}\n                                value={option.value}\n                                checked={selected}\n                                error={optionErrorStatus}\n                                success={optionSuccessStatus}\n                                onChange={(evt) => {\n                                  if (!readOnly) {\n                                    const update = selected\n                                      ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n                                      : [...dropdownSelectedOption, option]\n\n                                    if (selectedOption === undefined) {\n                                      setDropdownSelectedOption(update)\n                                    }\n\n                                    if (onSelectOption) onSelectOption(update)\n                                  }\n                                }}\n                              />\n                            }\n                          />\n                        )\n                      })}\n                    </>\n                  )}\n                </MenuList>\n              ) : (\n                <MenuList ref={menuListRef}>\n                  {(searchable ? menuRelevantOptions : options).map((option, _, optionsRendered) => {\n                    const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n                    return (\n                      <ListItem\n                        {...sizeProps}\n                        ref={selected ? selectedOptionRef : undefined}\n                        key={option.value}\n                        text={option.text}\n                        active={selected}\n                        danger={selected && status === 'error'}\n                        success={selected && status === 'success'}\n                        disabled={rootProps.disabled}\n                        borderRadius={8}\n                        ellipsis={false}\n                        textProps={{ wordBreak: 'break-word' }}\n                        onClick={(evt) => {\n                          evt.stopPropagation()\n\n                          if (!readOnly) {\n                            const update = selected ? null : option\n\n                            if (selectedOption === undefined) {\n                              setInputText(getDropdownInputText(update))\n                              setDropdownSelectedOption(getDropdownSelectedOption(update))\n                            }\n\n                            if (onSelectOption) onSelectOption(update)\n\n                            if (update || optionsRendered === menuRelevantOptions) {\n                              inputRef.current?.focus()\n                            }\n\n                            setMenuOpenRequest(!update)\n                          }\n                        }}\n                      />\n                    )\n                  })}\n                </MenuList>\n              )}\n            </DropdownMenu>\n          ) : undefined\n        }\n      />\n    )\n  }),\n  {\n    sizes: SIZES,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { Dropdown, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Dropdown","withMergedProps","forwardRef","props","ref","size","name","labelPosition","searchable","primary","optionsMultiToggle","loading","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","onCloseMenu","onOpenMenu","onSelectOption","options","groupSelectedOptions","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","sizes","SIZES_ICON","color","disabled","inputLabelId","useMemo","nanoid","getRelevantOptions","fuse","Fuse","threshold","ignoreLocation","keys","FuseSearchKeys","text","label","tags","pattern","length","search","map","result","item","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","inputFocused","setInputFocused","menuRelevantOptions","setMenuRelevantOptions","menuOpenRequest","setMenuOpenRequest","menuOptionsGroups","groupDropdownOptions","menuOpen","menuNoRelevantOptions","inputSynced","inputRequired","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","menuListRef","selectedOptionRef","timeoutIdRef","inputTextPrevRef","menuOpenPrevRef","useEffect","current","setTimeout","clearTimeout","useLayoutEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","scrollTo","offsetTop","handleScroll","evt","focus","currentTarget","removeEventListener","type","document","addEventListener","_jsx","FormInputLabel","labelId","active","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","target","Node","contains","onKeyUp","keyboardKeys","Esc","validate","key","onPointerDown","preventDefault","onFocus","onBlur","relatedTarget","input","_jsxs","_Fragment","children","tabIndex","FormInput","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","onKeyDown","Enter","Space","prev","ArrowDown","focusFirstFocusable","addon","Chip","black","marginLeft","cursor","textProps","appearance","colorHover","discardButtonProps","dropdown","DropdownMenu","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","DropdownMenuNoOptions","emptyMessage","emptyIcon","emptyIconProps","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","selected","findIndex","_","optionsRendered","SIZES","displayName"],"mappings":"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"}
+{"version":3,"file":"Dropdown.mjs","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { forwardRef, useState, useRef, useEffect, useLayoutEffect, useMemo } from 'react'\nimport Fuse from 'fuse.js'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { useScrollMonitor } from 'hooks/useScrollMonitor'\nimport { focusFirstFocusable, focusLastFocusable } from 'shared/utils/dom'\nimport { keyboardKeys } from 'shared/constants'\nimport type { Nullable } from 'shared/types'\nimport { FormInput } from 'components/FormInput'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { MenuList } from 'components/MenuList'\nimport { MenuDivider } from 'components/MenuDivider'\nimport { ListItem } from 'components/ListItem'\nimport { InputCheckbox } from 'components/InputCheckbox'\nimport { Chip } from 'components/Chip'\nimport { IconButton } from 'components/IconButton'\nimport type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON, FuseSearchKeys } from './constants'\nimport { getDropdownInputText, getDropdownSelectedOption, groupDropdownOptions } from './utils'\nimport * as Styled from './style'\nimport type { DropdownProps, DropdownOption } from './types'\n\nconst COMPONENT_NAME = 'Dropdown'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dropdown/types.ts).\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n  forwardRef((props, ref) => {\n    const {\n      size = 'm',\n      name = 'fox-dropdown',\n      labelPosition = 'dynamic',\n      searchable = true,\n      primary = true,\n      optionsMultiToggle = true,\n      loading = false,\n      iconProps = {},\n      menuProps = {},\n      loadingIconProps = {},\n      optionsEmptyIconProps = {},\n      autoFocus,\n      disableAutoScrollToSelectedOption,\n      closeMenuOnScroll,\n      scrollMonitorTarget,\n      contrast,\n      selectedOption,\n      defaultSelectedOption,\n      icon,\n      inputMode,\n      loadingMessage,\n      loadingIcon,\n      maxLength,\n      multiple,\n      clearable,\n      onCloseMenu,\n      onOpenMenu,\n      onSelectOption,\n      options,\n      groupSelectedOptions,\n      optionsMultiToggleCaption,\n      optionsEmptyMessage,\n      optionsEmptyIcon,\n      palette,\n      placeholder,\n      readOnly,\n      required,\n      status,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n      form,\n      ...rootProps\n    } = props\n\n    const sizeProps = {\n      size,\n      sizeXXS,\n      sizeXS,\n      sizeS,\n      sizeM,\n      sizeL,\n      sizeXL,\n    }\n\n    const iconBaseProps: IconProps = {\n      sizes: SIZES_ICON,\n      color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n    }\n\n    const formInputLabelId = useMemo(() => rootProps.id ?? `${name}-${nanoid()}`, [name, rootProps.id])\n    const inputLabelId = useMemo(() => nanoid(), [])\n    const menuListId = useMemo(() => nanoid(), [])\n\n    const getRelevantOptions = useMemo(() => {\n      const fuse = new Fuse<DropdownOption>(options, {\n        threshold: 0.4,\n        ignoreLocation: true,\n        keys: [FuseSearchKeys.text, FuseSearchKeys.label, FuseSearchKeys.tags],\n      })\n\n      return (pattern: string): DropdownOption[] =>\n        pattern.length === 0 ? options : fuse.search(pattern).map((result) => result.item)\n    }, [options])\n\n    const [dropdownSelectedOption, setDropdownSelectedOption] = useState<DropdownOption[]>(() =>\n      getDropdownSelectedOption(selectedOption !== undefined ? selectedOption : defaultSelectedOption, multiple)\n    )\n\n    const [inputText, setInputText] = useState<string>(() => getDropdownInputText(dropdownSelectedOption, multiple))\n\n    const [focusWithin, setFocusWithin] = useState<boolean>(false)\n\n    const [menuRelevantOptions, setMenuRelevantOptions] = useState<DropdownOption[]>(() =>\n      getRelevantOptions(inputText)\n    )\n\n    const [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n    const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = multiple\n      ? groupDropdownOptions(options, dropdownSelectedOption)\n      : [[], []]\n\n    const menuOpen = menuOpenRequest && !rootProps.disabled\n\n    const inputSynced = inputText === getDropdownInputText(dropdownSelectedOption)\n    const inputRequired = required && dropdownSelectedOption.length === 0\n    const inputActive = Boolean(menuOpen || inputText || focusWithin)\n\n    const multiToggleChecked = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length === 0\n    const multiToggleIndeterminate = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0\n\n    const inputRef = useRef<HTMLInputElement>(null)\n    const [menuRef, setMenuRef] = useState<Nullable<HTMLElement>>(null)\n    const menuListRef = useRef<HTMLUListElement>(null)\n    const selectedOptionRef = useRef<HTMLElement>(null)\n\n    const timeoutIdRef = useRef<Nullable<ReturnType<typeof setTimeout>>>(null)\n\n    const inputTextPrevRef = useRef<string>(inputText)\n    const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n    useScrollMonitor({\n      target: scrollMonitorTarget,\n      onScrollStart: () => {\n        if (closeMenuOnScroll && menuOpen) {\n          inputRef.current?.focus()\n          setMenuOpenRequest(false)\n        }\n      },\n    })\n\n    useEffect(() => {\n      if (inputText === inputTextPrevRef.current) {\n        setMenuRelevantOptions(getRelevantOptions(inputText))\n      } else {\n        inputTextPrevRef.current = inputText\n        timeoutIdRef.current = setTimeout(() => {\n          setMenuRelevantOptions(getRelevantOptions(inputText))\n        }, 150)\n      }\n\n      return () => {\n        if (timeoutIdRef.current) {\n          clearTimeout(timeoutIdRef.current)\n        }\n      }\n    }, [getRelevantOptions, inputText])\n\n    useLayoutEffect(() => {\n      if (selectedOption === undefined) return\n\n      if (!multiple) setInputText(getDropdownInputText(selectedOption))\n      setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n    }, [multiple, selectedOption])\n\n    useEffect(() => {\n      if (menuOpen === menuOpenPrevRef.current) return\n\n      if (menuOpen && onOpenMenu) onOpenMenu()\n      if (!menuOpen && onCloseMenu) onCloseMenu()\n\n      menuOpenPrevRef.current = menuOpen\n    }, [menuOpen, onCloseMenu, onOpenMenu])\n\n    useEffect(() => {\n      if (!multiple && !disableAutoScrollToSelectedOption && menuOpen && menuRef && selectedOptionRef.current) {\n        const menuRect = menuRef.getBoundingClientRect()\n        const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n        if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n          menuRef.scrollTo(0, selectedOptionRef.current.offsetTop)\n        }\n      }\n    }, [multiple, disableAutoScrollToSelectedOption, menuOpen, menuRef])\n\n    return (\n      <FormInputLabel\n        {...rootProps}\n        {...sizeProps}\n        ref={ref}\n        id={formInputLabelId}\n        labelId={inputLabelId}\n        labelPosition={labelPosition}\n        active={inputActive}\n        onColored={contrast}\n        primary={primary}\n        error={status === 'error'}\n        success={status === 'success'}\n        focus={focusWithin}\n        icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n        iconProps={{\n          ...sizeProps,\n          ...iconBaseProps,\n          ...iconProps,\n        }}\n        palette={{\n          color: rootProps.disabled ? palette.labelColorDisabled : palette.labelColor,\n          backgroundColor: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n          backgroundColorHover: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n          borderColor: rootProps.disabled ? palette.borderColorDisabled : palette.borderColor,\n        }}\n        onClick={(evt) => {\n          if (rootProps.onClick) rootProps.onClick(evt)\n\n          if (rootProps.disabled) return\n\n          inputRef.current?.focus()\n\n          if (!menuOpen) {\n            setMenuOpenRequest(true)\n\n            if (searchable && !multiple && inputSynced) {\n              setInputText('')\n              setMenuRelevantOptions(getRelevantOptions(''))\n            }\n          } else if (menuRef && evt.target instanceof Node && !menuRef.contains(evt.target)) {\n            setMenuOpenRequest(false)\n          }\n        }}\n        onPointerDown={(evt) => {\n          if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n          if (\n            evt.target !== inputRef.current &&\n            evt.target instanceof Node &&\n            (evt.currentTarget.contains(evt.target) ||\n              (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.target)))\n          ) {\n            evt.preventDefault()\n          }\n        }}\n        onFocus={(evt) => {\n          if (rootProps.onFocus) rootProps.onFocus(evt)\n\n          setFocusWithin(true)\n\n          if (\n            inputRef.current &&\n            evt.target === inputRef.current &&\n            searchable &&\n            !multiple &&\n            inputSynced &&\n            !menuOpen\n          ) {\n            setInputText('')\n            setMenuRelevantOptions(getRelevantOptions(''))\n          }\n        }}\n        onBlur={(evt) => {\n          if (rootProps.onBlur) rootProps.onBlur(evt)\n\n          if (\n            evt.currentTarget.contains(evt.relatedTarget) ||\n            (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.relatedTarget))\n          ) {\n            return\n          }\n\n          setFocusWithin(false)\n          setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n          setMenuOpenRequest(false)\n        }}\n        input={\n          <>\n            {inputRequired && !searchable && !readOnly && (\n              <Styled.InputMimic\n                required\n                type='text'\n                inputMode='none'\n                form={form}\n                tabIndex={-1}\n                onFocus={() => {\n                  inputRef.current?.focus()\n                }}\n              />\n            )}\n            <FormInput\n              ref={inputRef}\n              role='combobox'\n              aria-controls={menuListId}\n              aria-expanded={menuOpen}\n              aria-labelledby={rootProps.label ? inputLabelId : undefined}\n              type='text'\n              autoComplete='off'\n              autoCapitalize='off'\n              autoCorrect='off'\n              spellCheck='false'\n              form={form}\n              autoFocus={autoFocus}\n              inputMode={searchable ? inputMode : 'none'}\n              maxLength={maxLength}\n              placeholder={placeholder}\n              readOnly={readOnly || !searchable}\n              required={inputRequired}\n              disabled={rootProps.disabled}\n              value={inputText}\n              palette={{\n                color: palette.color,\n                colorDisabled: palette.colorDisabled,\n                placeholderColor: palette.placeholderColor,\n                placeholderColorDisabled: palette.placeholderColorDisabled,\n              }}\n              onClick={(evt) => {\n                if (menuOpen && evt.currentTarget.selectionStart !== evt.currentTarget.selectionEnd) {\n                  evt.stopPropagation()\n                }\n              }}\n              onChange={(evt) => {\n                setInputText(evt.currentTarget.value)\n                setMenuOpenRequest(true)\n              }}\n              onKeyDown={(evt) => {\n                if (keyboardKeys.Enter.validate(evt.key)) {\n                  setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n                  setMenuOpenRequest(false)\n                }\n\n                if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n                  evt.preventDefault()\n\n                  if (searchable && !multiple && inputSynced && !menuOpen) {\n                    setInputText('')\n                    setMenuRelevantOptions(getRelevantOptions(''))\n                  }\n\n                  setMenuOpenRequest((prev) => !prev)\n                }\n\n                if (keyboardKeys.Esc.validate(evt.key)) {\n                  setMenuOpenRequest(false)\n                }\n\n                if (keyboardKeys.Tab.validate(evt.key) && menuOpen) {\n                  evt.preventDefault()\n                  setMenuOpenRequest(false)\n                }\n\n                if (keyboardKeys.ArrowDown.validate(evt.key) && menuOpen && menuListRef.current) {\n                  evt.preventDefault()\n\n                  if (!multiple && selectedOptionRef.current) {\n                    const menuItems = [...menuListRef.current.children]\n\n                    const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n                    const focusTarget = menuItems[idx + 1] ?? menuItems[0]\n\n                    if (focusTarget instanceof HTMLElement) {\n                      focusFirstFocusable(focusTarget)\n                    }\n                  } else {\n                    focusFirstFocusable(menuListRef.current)\n                  }\n                }\n\n                if (keyboardKeys.ArrowUp.validate(evt.key) && menuOpen && menuListRef.current) {\n                  evt.preventDefault()\n\n                  if (!multiple && selectedOptionRef.current) {\n                    const menuItems = [...menuListRef.current.children]\n\n                    const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n                    const focusTarget = menuItems[idx - 1] ?? menuItems[menuItems.length - 1]\n\n                    if (focusTarget instanceof HTMLElement) {\n                      focusFirstFocusable(focusTarget)\n                    }\n                  } else {\n                    focusLastFocusable(menuListRef.current)\n                  }\n                }\n              }}\n            />\n            {dropdownSelectedOption.map((item) => (\n              <input\n                key={item.value}\n                type='hidden'\n                name={name}\n                value={item.value}\n                form={form}\n                disabled={rootProps.disabled}\n              />\n            ))}\n          </>\n        }\n        addon={\n          <>\n            {multiple && dropdownSelectedOption.length > 0 && (\n              <Chip\n                size='xs'\n                active\n                black\n                marginLeft={12}\n                disabled={rootProps.disabled}\n                cursor={rootProps.disabled ? 'not-allowed' : undefined}\n                text={dropdownSelectedOption.length}\n                textProps={{\n                  appearance: 'caption',\n                  size: 'xs',\n                }}\n                palette={\n                  rootProps.disabled\n                    ? {\n                        color: 'content-disabled',\n                        colorHover: 'content-disabled',\n                        backgroundColor: 'bg-disabled-small',\n                        backgroundColorHover: 'bg-disabled-small',\n                      }\n                    : undefined\n                }\n                onPointerDown={(evt) => {\n                  evt.preventDefault()\n                }}\n                discardButtonProps={{\n                  contrast: !rootProps.disabled,\n                  onClick: (evt) => {\n                    evt.stopPropagation()\n\n                    if (!readOnly) {\n                      if (selectedOption === undefined) {\n                        setDropdownSelectedOption([])\n                      }\n\n                      if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n                      inputRef.current?.focus()\n                      setMenuOpenRequest(true)\n                    }\n                  },\n                }}\n              />\n            )}\n            {!multiple && clearable && dropdownSelectedOption.length > 0 && (\n              <IconButton\n                icon='close'\n                size='l'\n                square\n                marginLeft={12}\n                disabled={rootProps.disabled}\n                onClick={(evt) => {\n                  evt.stopPropagation()\n\n                  if (!readOnly) {\n                    if (inputSynced) {\n                      setInputText('')\n                      setMenuRelevantOptions(getRelevantOptions(''))\n                    }\n\n                    if (selectedOption === undefined) {\n                      setDropdownSelectedOption([])\n                    }\n\n                    if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n                    inputRef.current?.focus()\n                    setMenuOpenRequest(true)\n                  }\n                }}\n              />\n            )}\n          </>\n        }\n        dropdown={\n          <DropdownMenu\n            {...menuProps}\n            setRef={setMenuRef}\n            open={menuOpen}\n            popperReferenceId={formInputLabelId}\n            secondary={!contrast}\n            elevated={contrast}\n            disableAutoFocus\n            palette={{\n              backgroundColor: palette.menuBackgroundColor,\n              borderColor: palette.menuBorderColor,\n            }}\n            empty={menuRelevantOptions.length === 0}\n            loading={loading}\n            loadingMessage={loadingMessage}\n            loadingIcon={loadingIcon}\n            loadingIconProps={{\n              ...sizeProps,\n              ...iconBaseProps,\n              ...loadingIconProps,\n            }}\n            emptyMessage={optionsEmptyMessage}\n            emptyIcon={optionsEmptyIcon}\n            emptyIconProps={{\n              ...sizeProps,\n              ...iconBaseProps,\n              ...optionsEmptyIconProps,\n            }}\n            onKeyDown={(evt) => {\n              if (keyboardKeys.Tab.validate(evt.key)) {\n                evt.preventDefault()\n                inputRef.current?.focus()\n                setMenuOpenRequest(false)\n              }\n\n              if (keyboardKeys.Enter.validate(evt.key)) {\n                inputRef.current?.focus()\n                setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n                setMenuOpenRequest(false)\n              }\n\n              if (keyboardKeys.Esc.validate(evt.key)) {\n                inputRef.current?.focus()\n                setMenuOpenRequest(false)\n              }\n\n              if (keyboardKeys.Backspace.validate(evt.key) && !readOnly && (multiple || (!multiple && clearable))) {\n                if (selectedOption === undefined) {\n                  setDropdownSelectedOption([])\n                }\n\n                if (onSelectOption) onSelectOption(multiple ? [] : null)\n              }\n            }}\n          >\n            {multiple ? (\n              <MenuList\n                ref={menuListRef}\n                id={menuListId}\n                role='listbox'\n                aria-labelledby={rootProps.label ? inputLabelId : undefined}\n                aria-multiselectable\n              >\n                {inputText.length === 0 ? (\n                  <>\n                    {optionsMultiToggle && (\n                      <ListItem\n                        {...sizeProps}\n                        text={optionsMultiToggleCaption}\n                        disabled={rootProps.disabled}\n                        borderRadius={8}\n                        ellipsis={false}\n                        textProps={{ wordBreak: 'break-word' }}\n                        onClick={(evt) => {\n                          evt.stopPropagation()\n                        }}\n                        control={\n                          <InputCheckbox\n                            sizes={SIZES_CHECKBOX}\n                            form='none'\n                            name={name}\n                            checked={multiToggleChecked}\n                            indeterminate={multiToggleIndeterminate}\n                            error={(multiToggleChecked || multiToggleIndeterminate) && status === 'error'}\n                            success={(multiToggleChecked || multiToggleIndeterminate) && status === 'success'}\n                            onChange={() => {\n                              if (!readOnly) {\n                                const update = multiToggleChecked || multiToggleIndeterminate ? [] : [...options]\n\n                                if (selectedOption === undefined) {\n                                  setDropdownSelectedOption(update)\n                                }\n\n                                if (onSelectOption) onSelectOption(update)\n                              }\n                            }}\n                          />\n                        }\n                      />\n                    )}\n                    {optionsMultiToggle && <MenuDivider />}\n                    {groupSelectedOptions &&\n                      menuOptionsGroups[0].map((option) => {\n                        const optionStatus = option.status ?? status\n                        const optionErrorStatus = optionStatus === 'error'\n                        const optionSuccessStatus = optionStatus === 'success'\n\n                        return (\n                          <ListItem\n                            {...sizeProps}\n                            key={option.value}\n                            active\n                            text={option.text}\n                            danger={optionErrorStatus}\n                            success={optionSuccessStatus}\n                            disabled={rootProps.disabled}\n                            borderRadius={8}\n                            ellipsis={false}\n                            textProps={{ wordBreak: 'break-word' }}\n                            onClick={(evt) => {\n                              evt.stopPropagation()\n                              inputRef.current?.focus()\n                            }}\n                            control={\n                              <InputCheckbox\n                                sizes={SIZES_CHECKBOX}\n                                form='none'\n                                role='option'\n                                aria-selected\n                                name={name}\n                                value={option.value}\n                                checked\n                                error={optionErrorStatus}\n                                success={optionSuccessStatus}\n                                onChange={(evt) => {\n                                  if (!readOnly) {\n                                    const update = dropdownSelectedOption.filter(\n                                      (item) => item.value !== evt.currentTarget.value\n                                    )\n\n                                    if (selectedOption === undefined) {\n                                      setDropdownSelectedOption(update)\n                                    }\n\n                                    if (onSelectOption) onSelectOption(update)\n                                  }\n                                }}\n                              />\n                            }\n                          />\n                        )\n                      })}\n                    {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 && (\n                      <MenuDivider />\n                    )}\n                    {groupSelectedOptions &&\n                      menuOptionsGroups[1].map((option) => (\n                        <ListItem\n                          {...sizeProps}\n                          key={option.value}\n                          text={option.text}\n                          disabled={rootProps.disabled}\n                          borderRadius={8}\n                          ellipsis={false}\n                          textProps={{ wordBreak: 'break-word' }}\n                          onClick={(evt) => {\n                            evt.stopPropagation()\n                            inputRef.current?.focus()\n                          }}\n                          control={\n                            <InputCheckbox\n                              sizes={SIZES_CHECKBOX}\n                              form='none'\n                              role='option'\n                              aria-selected={false}\n                              name={name}\n                              value={option.value}\n                              checked={false}\n                              onChange={() => {\n                                if (!readOnly) {\n                                  const update = [...dropdownSelectedOption, option]\n\n                                  if (selectedOption === undefined) {\n                                    setDropdownSelectedOption(update)\n                                  }\n\n                                  if (onSelectOption) onSelectOption(update)\n                                }\n                              }}\n                            />\n                          }\n                        />\n                      ))}\n                    {!groupSelectedOptions &&\n                      options.map((option) => {\n                        const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n                        const optionStatus = option.status ?? status\n                        const optionErrorStatus = selected && optionStatus === 'error'\n                        const optionSuccessStatus = selected && optionStatus === 'success'\n\n                        return (\n                          <ListItem\n                            {...sizeProps}\n                            key={option.value}\n                            text={option.text}\n                            danger={optionErrorStatus}\n                            success={optionSuccessStatus}\n                            disabled={rootProps.disabled}\n                            active={selected}\n                            borderRadius={8}\n                            ellipsis={false}\n                            textProps={{ wordBreak: 'break-word' }}\n                            onClick={(evt) => {\n                              evt.stopPropagation()\n                            }}\n                            control={\n                              <InputCheckbox\n                                sizes={SIZES_CHECKBOX}\n                                form='none'\n                                role='option'\n                                aria-selected={selected}\n                                name={name}\n                                value={option.value}\n                                checked={selected}\n                                error={optionErrorStatus}\n                                success={optionSuccessStatus}\n                                onChange={(evt) => {\n                                  if (!readOnly) {\n                                    const update = selected\n                                      ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n                                      : [...dropdownSelectedOption, option]\n\n                                    if (selectedOption === undefined) {\n                                      setDropdownSelectedOption(update)\n                                    }\n\n                                    if (onSelectOption) onSelectOption(update)\n                                  }\n                                }}\n                              />\n                            }\n                          />\n                        )\n                      })}\n                  </>\n                ) : (\n                  <>\n                    {menuRelevantOptions.map((option) => {\n                      const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n                      const optionStatus = option.status ?? status\n                      const optionErrorStatus = selected && optionStatus === 'error'\n                      const optionSuccessStatus = selected && optionStatus === 'success'\n\n                      return (\n                        <ListItem\n                          {...sizeProps}\n                          key={option.value}\n                          text={option.text}\n                          danger={optionErrorStatus}\n                          success={optionSuccessStatus}\n                          disabled={rootProps.disabled}\n                          active={selected}\n                          borderRadius={8}\n                          ellipsis={false}\n                          textProps={{ wordBreak: 'break-word' }}\n                          onClick={(evt) => {\n                            evt.stopPropagation()\n                          }}\n                          control={\n                            <InputCheckbox\n                              sizes={SIZES_CHECKBOX}\n                              form='none'\n                              role='option'\n                              aria-selected={selected}\n                              name={name}\n                              value={option.value}\n                              checked={selected}\n                              error={optionErrorStatus}\n                              success={optionSuccessStatus}\n                              onChange={(evt) => {\n                                if (!readOnly) {\n                                  const update = selected\n                                    ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n                                    : [...dropdownSelectedOption, option]\n\n                                  if (selectedOption === undefined) {\n                                    setDropdownSelectedOption(update)\n                                  }\n\n                                  if (onSelectOption) onSelectOption(update)\n                                }\n                              }}\n                            />\n                          }\n                        />\n                      )\n                    })}\n                  </>\n                )}\n              </MenuList>\n            ) : (\n              <MenuList\n                ref={menuListRef}\n                id={menuListId}\n                role='listbox'\n                aria-labelledby={rootProps.label ? inputLabelId : undefined}\n              >\n                {(searchable ? menuRelevantOptions : options).map((option) => {\n                  const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n                  return (\n                    <ListItem\n                      {...sizeProps}\n                      role='option'\n                      aria-selected={selected}\n                      ref={selected ? selectedOptionRef : undefined}\n                      key={option.value}\n                      text={option.text}\n                      active={selected}\n                      danger={selected && status === 'error'}\n                      success={selected && status === 'success'}\n                      disabled={rootProps.disabled}\n                      borderRadius={8}\n                      ellipsis={false}\n                      textProps={{ wordBreak: 'break-word' }}\n                      onClick={(evt) => {\n                        evt.stopPropagation()\n\n                        if (!readOnly) {\n                          const update = { ...option }\n\n                          if (selectedOption === undefined) {\n                            setInputText(getDropdownInputText(update))\n                            setDropdownSelectedOption(getDropdownSelectedOption(update))\n                          }\n\n                          if (onSelectOption) onSelectOption(update)\n\n                          inputRef.current?.focus()\n                          setMenuOpenRequest(false)\n                        }\n                      }}\n                    />\n                  )\n                })}\n              </MenuList>\n            )}\n          </DropdownMenu>\n        }\n      />\n    )\n  }),\n  {\n    sizes: SIZES,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { Dropdown, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Dropdown","withMergedProps","forwardRef","props","ref","size","name","labelPosition","searchable","primary","optionsMultiToggle","loading","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","scrollMonitorTarget","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","clearable","onCloseMenu","onOpenMenu","onSelectOption","options","groupSelectedOptions","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","sizes","SIZES_ICON","color","disabled","formInputLabelId","useMemo","id","nanoid","inputLabelId","menuListId","getRelevantOptions","fuse","Fuse","threshold","ignoreLocation","keys","FuseSearchKeys","text","label","tags","pattern","length","search","map","result","item","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","focusWithin","setFocusWithin","menuRelevantOptions","setMenuRelevantOptions","menuOpenRequest","setMenuOpenRequest","menuOptionsGroups","groupDropdownOptions","menuOpen","inputSynced","inputRequired","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","setMenuRef","menuListRef","selectedOptionRef","timeoutIdRef","inputTextPrevRef","menuOpenPrevRef","useScrollMonitor","target","onScrollStart","current","focus","useEffect","setTimeout","clearTimeout","useLayoutEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","scrollTo","offsetTop","_jsx","FormInputLabel","labelId","active","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","evt","Node","contains","onPointerDown","currentTarget","renderInPortal","preventDefault","onFocus","onBlur","relatedTarget","input","_jsxs","_Fragment","children","type","tabIndex","FormInput","role","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","onKeyDown","keyboardKeys","Enter","validate","key","Space","prev","Esc","Tab","ArrowDown","menuItems","idx","findIndex","focusTarget","HTMLElement","focusFirstFocusable","ArrowUp","focusLastFocusable","addon","Chip","black","marginLeft","cursor","textProps","appearance","colorHover","discardButtonProps","IconButton","square","dropdown","DropdownMenu","setRef","open","popperReferenceId","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","empty","emptyMessage","emptyIcon","emptyIconProps","Backspace","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","selected","SIZES","displayName"],"mappings":"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"}

package/components/Dropdown/DropdownMenu.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var constants=require('./constants.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');const DropdownMenu=withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const{size:s="fluid",...t}=e;return require$$0.jsx(style.PositionedMenuComponent,{...t,size:s,ref:r})})),{sizes:constants.SIZES_MENU,displayName:'DropdownMenu'});exports.DropdownMenu=DropdownMenu;
+'use strict';var React=require('react');var Floater=require('react-floater');var withMergedProps=require('../../hocs/withMergedProps.js');var DropdownMenuNoOptions=require('./DropdownMenuNoOptions.js');var constants=require('./constants.js');var require$$0=require('react/jsx-runtime');var MenuComponent=require('../MenuComponent/MenuComponent.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var Floater__default=_interopDefault(Floater);const DropdownMenu=withMergedProps.withMergedProps((e=>{const{size:t="fluid",open:o,loading:n,loadingMessage:r,loadingIcon:s,loadingIconProps:p,emptyMessage:a,emptyIcon:l,emptyIconProps:i,empty:u,children:c,renderInPortal:d,popperReferenceId:m,expanseDirectionLeft:f,setRef:y,zIndex:M,...h}=e;const w={loading:n,loadingMessage:r,loadingIcon:s,loadingIconProps:p,emptyMessage:a,emptyIcon:l,emptyIconProps:i};const g=u||n;const[q,D]=React.useState(null);const[$,x]=React.useState({});const v=React.useRef(null);return React.useLayoutEffect((()=>{let e=null;return d?(e=document.createElement('div'),e.dataset.popperDropdownPortal='true',e.style.position='relative',document.body.appendChild(e),D(e)):D(null),()=>{e&&document.body.contains(e)&&e.childElementCount===0&&e.remove()}}),[d]),React.useLayoutEffect((()=>{x((e=>({...e,left:f?'auto':0,right:f?0:'auto'})))}),[f]),d?q?require$$0.jsx(Floater__default.default,{open:o,placement:"bottom",offset:8,hideArrow:!0,portalElement:q,target:`#${m}`,styles:{options:{zIndex:M},floater:{width:'100%',filter:'none',opacity:1,transitionDuration:'10ms'}},modifiers:{removeFloaterRoles:{name:'removeFloaterRoles',enabled:!0,phase:'beforeWrite',effect:({state:e})=>{if(e.elements.popper instanceof HTMLElement){const t=e.elements.popper.querySelector('[role="tooltip"]');t&&t.removeAttribute('role')}}},syncDimensions:{name:'syncDimensions',enabled:!0,phase:'beforeWrite',requires:['computeStyles'],fn:({state:e})=>{e.styles.popper.width=`${e.rects.reference.width}px`},effect:({state:e})=>{if(e.elements.popper instanceof HTMLElement&&e.elements.reference instanceof HTMLElement){e.elements.popper.style.display='flex',e.elements.popper.style.width=`${e.elements.reference.offsetWidth}px`;const t=e.elements.popper.querySelector('[data-popper-dropdown]');t&&(e.elements.popper.style.height=`${t.offsetHeight}px`)}}},syncPlacement:{name:'syncPlacement',enabled:!0,phase:'afterWrite',requires:['computeStyles'],fn:({state:e})=>{v.current!==null&&v.current===e.placement||x((t=>({...t,top:e.placement==='bottom'?0:'auto',bottom:e.placement==='top'?0:'auto'}))),v.current=e.placement}}},component:()=>require$$0.jsx(MenuComponent.MenuComponent,{...h,size:t,ref:y,"data-popper-dropdown":!0,style:{...$,position:'absolute'},children:g?require$$0.jsx(DropdownMenuNoOptions.DropdownMenuNoOptions,{...w}):c})}):null:o?require$$0.jsx(MenuComponent.MenuComponent,{...h,size:t,ref:y,style:{...$,position:'absolute',top:0,zIndex:M},children:g?require$$0.jsx(DropdownMenuNoOptions.DropdownMenuNoOptions,{...w}):c}):null}),{sizes:constants.SIZES_MENU,displayName:'DropdownMenu'});exports.DropdownMenu=DropdownMenu;
 //# sourceMappingURL=DropdownMenu.js.map

package/components/Dropdown/DropdownMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu.js","sources":["../../../../src/components/Dropdown/DropdownMenu.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES_MENU } from './constants'\nimport * as Styled from './style'\nimport type { DropdownMenuProps } from './types'\n\nconst COMPONENT_NAME = 'DropdownMenu'\n\nconst DropdownMenu: React.ForwardRefExoticComponent<DropdownMenuProps> = withMergedProps<\n  DropdownMenuProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const { size = 'fluid', ...restProps } = props\n\n    return <Styled.PositionedMenuComponent {...restProps} size={size} ref={ref} />\n  }),\n  {\n    sizes: SIZES_MENU,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DropdownMenu }\n"],"names":["DropdownMenu","withMergedProps","forwardRef","props","ref","size","restProps","_jsx","Styled","sizes","SIZES_MENU","displayName"],"mappings":"yNAQMA,MAAAA,aAAmEC,gBAAAA,gBAIvEC,MAAAA,YAAW,CAACC,EAAOC,KACjB,MAAMC,KAAEA,EAAO,WAAYC,GAAcH,EAEzC,OAAOI,WAAAA,IAACC,MAAAA,wBAA8B,IAAKF,EAAWD,KAAMA,EAAMD,IAAKA,GAAO,IAEhF,CACEK,MAAOC,UAAUA,WACjBC,YAbmB"}
+{"version":3,"file":"DropdownMenu.js","sources":["../../../../src/components/Dropdown/DropdownMenu.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport { useState, useRef, useLayoutEffect } from 'react'\nimport Floater from 'react-floater'\nimport type { CSSProperties } from 'react'\nimport type { PlacementOptions } from 'react-floater/lib/types'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { MenuComponent } from 'components/MenuComponent'\nimport type { Nullable } from 'shared/types'\nimport { DropdownMenuNoOptions } from './DropdownMenuNoOptions'\nimport { SIZES_MENU } from './constants'\nimport type { DropdownMenuProps } from './types'\n\nconst COMPONENT_NAME = 'DropdownMenu'\n\nconst DropdownMenu: React.ForwardRefExoticComponent<DropdownMenuProps> = withMergedProps<\n  DropdownMenuProps,\n  HTMLDivElement\n>(\n  (props) => {\n    const {\n      size = 'fluid',\n      open,\n      loading,\n      loadingMessage,\n      loadingIcon,\n      loadingIconProps,\n      emptyMessage,\n      emptyIcon,\n      emptyIconProps,\n      empty,\n      children,\n      renderInPortal,\n      popperReferenceId,\n      expanseDirectionLeft,\n      setRef,\n      zIndex,\n      ...restProps\n    } = props\n\n    const noOptionsMenuProps = {\n      loading,\n      loadingMessage,\n      loadingIcon,\n      loadingIconProps,\n      emptyMessage,\n      emptyIcon,\n      emptyIconProps,\n    }\n\n    const renderNoOptionsMenu = empty || loading\n\n    const [portal, setPortal] = useState<Nullable<HTMLElement>>(null)\n    const [offset, setOffset] = useState<Pick<CSSProperties, 'top' | 'right' | 'bottom' | 'left'>>({})\n\n    const placement = useRef<Nullable<PlacementOptions>>(null)\n\n    useLayoutEffect(() => {\n      let portalElement: Nullable<HTMLElement> = null\n\n      if (renderInPortal) {\n        portalElement = document.createElement('div')\n\n        portalElement.dataset.popperDropdownPortal = 'true'\n        portalElement.style.position = 'relative'\n\n        document.body.appendChild(portalElement)\n\n        setPortal(portalElement)\n      } else {\n        setPortal(null)\n      }\n\n      return () => {\n        if (portalElement && document.body.contains(portalElement) && portalElement.childElementCount === 0) {\n          portalElement.remove()\n        }\n      }\n    }, [renderInPortal])\n\n    useLayoutEffect(() => {\n      setOffset((prev) => ({\n        ...prev,\n        left: expanseDirectionLeft ? 'auto' : 0,\n        right: expanseDirectionLeft ? 0 : 'auto',\n      }))\n    }, [expanseDirectionLeft])\n\n    if (renderInPortal) {\n      if (!portal) {\n        return null\n      }\n\n      return (\n        <Floater\n          open={open}\n          placement='bottom'\n          offset={8}\n          hideArrow\n          portalElement={portal}\n          target={`#${popperReferenceId}`}\n          styles={{\n            options: {\n              zIndex,\n            },\n            floater: {\n              width: '100%',\n              filter: 'none',\n              opacity: 1,\n              transitionDuration: '10ms',\n            },\n          }}\n          modifiers={{\n            // @ts-ignore\n            removeFloaterRoles: {\n              name: 'removeFloaterRoles',\n              enabled: true,\n              phase: 'beforeWrite',\n              // @ts-ignore\n              effect: ({ state }) => {\n                if (state.elements.popper instanceof HTMLElement) {\n                  const floaterElement = state.elements.popper.querySelector('[role=\"tooltip\"]')\n                  if (floaterElement) {\n                    floaterElement.removeAttribute('role')\n                  }\n                }\n              },\n            },\n            syncDimensions: {\n              name: 'syncDimensions',\n              enabled: true,\n              phase: 'beforeWrite',\n              requires: ['computeStyles'],\n              // @ts-ignore\n              fn: ({ state }) => {\n                state.styles.popper.width = `${state.rects.reference.width}px`\n              },\n              // @ts-ignore\n              effect: ({ state }) => {\n                if (state.elements.popper instanceof HTMLElement && state.elements.reference instanceof HTMLElement) {\n                  state.elements.popper.style.display = 'flex'\n                  state.elements.popper.style.width = `${state.elements.reference.offsetWidth}px`\n\n                  const menuElement = state.elements.popper.querySelector('[data-popper-dropdown]')\n                  if (menuElement) {\n                    state.elements.popper.style.height = `${menuElement.offsetHeight}px`\n                  }\n                }\n              },\n            },\n            // @ts-ignore\n            syncPlacement: {\n              name: 'syncPlacement',\n              enabled: true,\n              phase: 'afterWrite',\n              requires: ['computeStyles'],\n              // @ts-ignore\n              fn: ({ state }) => {\n                if (placement.current === null || placement.current !== state.placement) {\n                  setOffset((prev) => ({\n                    ...prev,\n                    top: state.placement === 'bottom' ? 0 : 'auto',\n                    bottom: state.placement === 'top' ? 0 : 'auto',\n                  }))\n                }\n\n                placement.current = state.placement\n              },\n            },\n          }}\n          component={() => (\n            <MenuComponent\n              {...restProps}\n              size={size}\n              ref={setRef}\n              data-popper-dropdown\n              style={{\n                ...offset,\n                position: 'absolute',\n              }}\n            >\n              {renderNoOptionsMenu ? <DropdownMenuNoOptions {...noOptionsMenuProps} /> : children}\n            </MenuComponent>\n          )}\n        />\n      )\n    }\n\n    if (!open) {\n      return null\n    }\n\n    return (\n      <MenuComponent\n        {...restProps}\n        size={size}\n        ref={setRef}\n        style={{\n          ...offset,\n          position: 'absolute',\n          top: 0,\n          zIndex,\n        }}\n      >\n        {renderNoOptionsMenu ? <DropdownMenuNoOptions {...noOptionsMenuProps} /> : children}\n      </MenuComponent>\n    )\n  },\n  {\n    sizes: SIZES_MENU,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DropdownMenu }\n"],"names":["DropdownMenu","withMergedProps","props","size","open","loading","loadingMessage","loadingIcon","loadingIconProps","emptyMessage","emptyIcon","emptyIconProps","empty","children","renderInPortal","popperReferenceId","expanseDirectionLeft","setRef","zIndex","restProps","noOptionsMenuProps","renderNoOptionsMenu","portal","setPortal","useState","offset","setOffset","placement","useRef","useLayoutEffect","portalElement","document","createElement","dataset","popperDropdownPortal","style","position","body","appendChild","contains","childElementCount","remove","prev","left","right","_jsx","Floater","hideArrow","target","styles","options","floater","width","filter","opacity","transitionDuration","modifiers","removeFloaterRoles","name","enabled","phase","effect","state","elements","popper","HTMLElement","floaterElement","querySelector","removeAttribute","syncDimensions","requires","fn","rects","reference","display","offsetWidth","menuElement","height","offsetHeight","syncPlacement","current","top","bottom","component","jsx","MenuComponent","ref","DropdownMenuNoOptions","sizes","SIZES_MENU","displayName"],"mappings":"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"}

package/components/Dropdown/DropdownMenu.mjs

@@ -1,2 +1,2 @@
-import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES_MENU}from'./constants.mjs';import{PositionedMenuComponent}from'./style.mjs';import{jsx}from'react/jsx-runtime';const DropdownMenu=withMergedProps(forwardRef(((o,r)=>{const{size:e="fluid",...s}=o;return jsx(PositionedMenuComponent,{...s,size:e,ref:r})})),{sizes:SIZES_MENU,displayName:'DropdownMenu'});export{DropdownMenu};
+import{useState,useRef,useLayoutEffect}from'react';import Floater from'react-floater';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{DropdownMenuNoOptions}from'./DropdownMenuNoOptions.mjs';import{SIZES_MENU}from'./constants.mjs';import{jsx}from'react/jsx-runtime';import{MenuComponent}from'../MenuComponent/MenuComponent.mjs';const DropdownMenu=withMergedProps((e=>{const{size:t="fluid",open:o,loading:n,loadingMessage:r,loadingIcon:s,loadingIconProps:p,emptyMessage:l,emptyIcon:a,emptyIconProps:i,empty:m,children:c,renderInPortal:d,popperReferenceId:u,expanseDirectionLeft:f,setRef:y,zIndex:M,...h}=e;const g={loading:n,loadingMessage:r,loadingIcon:s,loadingIconProps:p,emptyMessage:l,emptyIcon:a,emptyIconProps:i};const w=m||n;const[x,I]=useState(null);const[b,E]=useState({});const D=useRef(null);return useLayoutEffect((()=>{let e=null;return d?(e=document.createElement('div'),e.dataset.popperDropdownPortal='true',e.style.position='relative',document.body.appendChild(e),I(e)):I(null),()=>{e&&document.body.contains(e)&&e.childElementCount===0&&e.remove()}}),[d]),useLayoutEffect((()=>{E((e=>({...e,left:f?'auto':0,right:f?0:'auto'})))}),[f]),d?x?jsx(Floater,{open:o,placement:"bottom",offset:8,hideArrow:!0,portalElement:x,target:`#${u}`,styles:{options:{zIndex:M},floater:{width:'100%',filter:'none',opacity:1,transitionDuration:'10ms'}},modifiers:{removeFloaterRoles:{name:'removeFloaterRoles',enabled:!0,phase:'beforeWrite',effect:({state:e})=>{if(e.elements.popper instanceof HTMLElement){const t=e.elements.popper.querySelector('[role="tooltip"]');t&&t.removeAttribute('role')}}},syncDimensions:{name:'syncDimensions',enabled:!0,phase:'beforeWrite',requires:['computeStyles'],fn:({state:e})=>{e.styles.popper.width=`${e.rects.reference.width}px`},effect:({state:e})=>{if(e.elements.popper instanceof HTMLElement&&e.elements.reference instanceof HTMLElement){e.elements.popper.style.display='flex',e.elements.popper.style.width=`${e.elements.reference.offsetWidth}px`;const t=e.elements.popper.querySelector('[data-popper-dropdown]');t&&(e.elements.popper.style.height=`${t.offsetHeight}px`)}}},syncPlacement:{name:'syncPlacement',enabled:!0,phase:'afterWrite',requires:['computeStyles'],fn:({state:e})=>{D.current!==null&&D.current===e.placement||E((t=>({...t,top:e.placement==='bottom'?0:'auto',bottom:e.placement==='top'?0:'auto'}))),D.current=e.placement}}},component:()=>jsx(MenuComponent,{...h,size:t,ref:y,"data-popper-dropdown":!0,style:{...b,position:'absolute'},children:w?jsx(DropdownMenuNoOptions,{...g}):c})}):null:o?jsx(MenuComponent,{...h,size:t,ref:y,style:{...b,position:'absolute',top:0,zIndex:M},children:w?jsx(DropdownMenuNoOptions,{...g}):c}):null}),{sizes:SIZES_MENU,displayName:'DropdownMenu'});export{DropdownMenu};
 //# sourceMappingURL=DropdownMenu.mjs.map

package/components/Dropdown/DropdownMenu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu.mjs","sources":["../../../../src/components/Dropdown/DropdownMenu.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES_MENU } from './constants'\nimport * as Styled from './style'\nimport type { DropdownMenuProps } from './types'\n\nconst COMPONENT_NAME = 'DropdownMenu'\n\nconst DropdownMenu: React.ForwardRefExoticComponent<DropdownMenuProps> = withMergedProps<\n  DropdownMenuProps,\n  HTMLDivElement\n>(\n  forwardRef((props, ref) => {\n    const { size = 'fluid', ...restProps } = props\n\n    return <Styled.PositionedMenuComponent {...restProps} size={size} ref={ref} />\n  }),\n  {\n    sizes: SIZES_MENU,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DropdownMenu }\n"],"names":["DropdownMenu","withMergedProps","forwardRef","props","ref","size","restProps","_jsx","Styled","sizes","SIZES_MENU","displayName"],"mappings":"sNAQMA,MAAAA,aAAmEC,gBAIvEC,YAAW,CAACC,EAAOC,KACjB,MAAMC,KAAEA,EAAO,WAAYC,GAAcH,EAEzC,OAAOI,IAACC,wBAA8B,IAAKF,EAAWD,KAAMA,EAAMD,IAAKA,GAAO,IAEhF,CACEK,MAAOC,WACPC,YAbmB"}
+{"version":3,"file":"DropdownMenu.mjs","sources":["../../../../src/components/Dropdown/DropdownMenu.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport { useState, useRef, useLayoutEffect } from 'react'\nimport Floater from 'react-floater'\nimport type { CSSProperties } from 'react'\nimport type { PlacementOptions } from 'react-floater/lib/types'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { MenuComponent } from 'components/MenuComponent'\nimport type { Nullable } from 'shared/types'\nimport { DropdownMenuNoOptions } from './DropdownMenuNoOptions'\nimport { SIZES_MENU } from './constants'\nimport type { DropdownMenuProps } from './types'\n\nconst COMPONENT_NAME = 'DropdownMenu'\n\nconst DropdownMenu: React.ForwardRefExoticComponent<DropdownMenuProps> = withMergedProps<\n  DropdownMenuProps,\n  HTMLDivElement\n>(\n  (props) => {\n    const {\n      size = 'fluid',\n      open,\n      loading,\n      loadingMessage,\n      loadingIcon,\n      loadingIconProps,\n      emptyMessage,\n      emptyIcon,\n      emptyIconProps,\n      empty,\n      children,\n      renderInPortal,\n      popperReferenceId,\n      expanseDirectionLeft,\n      setRef,\n      zIndex,\n      ...restProps\n    } = props\n\n    const noOptionsMenuProps = {\n      loading,\n      loadingMessage,\n      loadingIcon,\n      loadingIconProps,\n      emptyMessage,\n      emptyIcon,\n      emptyIconProps,\n    }\n\n    const renderNoOptionsMenu = empty || loading\n\n    const [portal, setPortal] = useState<Nullable<HTMLElement>>(null)\n    const [offset, setOffset] = useState<Pick<CSSProperties, 'top' | 'right' | 'bottom' | 'left'>>({})\n\n    const placement = useRef<Nullable<PlacementOptions>>(null)\n\n    useLayoutEffect(() => {\n      let portalElement: Nullable<HTMLElement> = null\n\n      if (renderInPortal) {\n        portalElement = document.createElement('div')\n\n        portalElement.dataset.popperDropdownPortal = 'true'\n        portalElement.style.position = 'relative'\n\n        document.body.appendChild(portalElement)\n\n        setPortal(portalElement)\n      } else {\n        setPortal(null)\n      }\n\n      return () => {\n        if (portalElement && document.body.contains(portalElement) && portalElement.childElementCount === 0) {\n          portalElement.remove()\n        }\n      }\n    }, [renderInPortal])\n\n    useLayoutEffect(() => {\n      setOffset((prev) => ({\n        ...prev,\n        left: expanseDirectionLeft ? 'auto' : 0,\n        right: expanseDirectionLeft ? 0 : 'auto',\n      }))\n    }, [expanseDirectionLeft])\n\n    if (renderInPortal) {\n      if (!portal) {\n        return null\n      }\n\n      return (\n        <Floater\n          open={open}\n          placement='bottom'\n          offset={8}\n          hideArrow\n          portalElement={portal}\n          target={`#${popperReferenceId}`}\n          styles={{\n            options: {\n              zIndex,\n            },\n            floater: {\n              width: '100%',\n              filter: 'none',\n              opacity: 1,\n              transitionDuration: '10ms',\n            },\n          }}\n          modifiers={{\n            // @ts-ignore\n            removeFloaterRoles: {\n              name: 'removeFloaterRoles',\n              enabled: true,\n              phase: 'beforeWrite',\n              // @ts-ignore\n              effect: ({ state }) => {\n                if (state.elements.popper instanceof HTMLElement) {\n                  const floaterElement = state.elements.popper.querySelector('[role=\"tooltip\"]')\n                  if (floaterElement) {\n                    floaterElement.removeAttribute('role')\n                  }\n                }\n              },\n            },\n            syncDimensions: {\n              name: 'syncDimensions',\n              enabled: true,\n              phase: 'beforeWrite',\n              requires: ['computeStyles'],\n              // @ts-ignore\n              fn: ({ state }) => {\n                state.styles.popper.width = `${state.rects.reference.width}px`\n              },\n              // @ts-ignore\n              effect: ({ state }) => {\n                if (state.elements.popper instanceof HTMLElement && state.elements.reference instanceof HTMLElement) {\n                  state.elements.popper.style.display = 'flex'\n                  state.elements.popper.style.width = `${state.elements.reference.offsetWidth}px`\n\n                  const menuElement = state.elements.popper.querySelector('[data-popper-dropdown]')\n                  if (menuElement) {\n                    state.elements.popper.style.height = `${menuElement.offsetHeight}px`\n                  }\n                }\n              },\n            },\n            // @ts-ignore\n            syncPlacement: {\n              name: 'syncPlacement',\n              enabled: true,\n              phase: 'afterWrite',\n              requires: ['computeStyles'],\n              // @ts-ignore\n              fn: ({ state }) => {\n                if (placement.current === null || placement.current !== state.placement) {\n                  setOffset((prev) => ({\n                    ...prev,\n                    top: state.placement === 'bottom' ? 0 : 'auto',\n                    bottom: state.placement === 'top' ? 0 : 'auto',\n                  }))\n                }\n\n                placement.current = state.placement\n              },\n            },\n          }}\n          component={() => (\n            <MenuComponent\n              {...restProps}\n              size={size}\n              ref={setRef}\n              data-popper-dropdown\n              style={{\n                ...offset,\n                position: 'absolute',\n              }}\n            >\n              {renderNoOptionsMenu ? <DropdownMenuNoOptions {...noOptionsMenuProps} /> : children}\n            </MenuComponent>\n          )}\n        />\n      )\n    }\n\n    if (!open) {\n      return null\n    }\n\n    return (\n      <MenuComponent\n        {...restProps}\n        size={size}\n        ref={setRef}\n        style={{\n          ...offset,\n          position: 'absolute',\n          top: 0,\n          zIndex,\n        }}\n      >\n        {renderNoOptionsMenu ? <DropdownMenuNoOptions {...noOptionsMenuProps} /> : children}\n      </MenuComponent>\n    )\n  },\n  {\n    sizes: SIZES_MENU,\n    displayName: COMPONENT_NAME,\n  }\n)\n\nexport { DropdownMenu }\n"],"names":["DropdownMenu","withMergedProps","props","size","open","loading","loadingMessage","loadingIcon","loadingIconProps","emptyMessage","emptyIcon","emptyIconProps","empty","children","renderInPortal","popperReferenceId","expanseDirectionLeft","setRef","zIndex","restProps","noOptionsMenuProps","renderNoOptionsMenu","portal","setPortal","useState","offset","setOffset","placement","useRef","useLayoutEffect","portalElement","document","createElement","dataset","popperDropdownPortal","style","position","body","appendChild","contains","childElementCount","remove","prev","left","right","_jsx","Floater","hideArrow","target","styles","options","floater","width","filter","opacity","transitionDuration","modifiers","removeFloaterRoles","name","enabled","phase","effect","state","elements","popper","HTMLElement","floaterElement","querySelector","removeAttribute","syncDimensions","requires","fn","rects","reference","display","offsetWidth","menuElement","height","offsetHeight","syncPlacement","current","top","bottom","component","MenuComponent","ref","DropdownMenuNoOptions","sizes","SIZES_MENU","displayName"],"mappings":"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"}

package/components/Dropdown/style.js

@@ -1,2 +1,2 @@
-'use strict';var styled=require('styled-components');var MenuComponent=require('../MenuComponent/MenuComponent.js');var index=require('../../external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.js');var index$1=require('../../external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.js');function _interopDefault(n){return n&&n.__esModule?n:{default:n}}var styled__default=_interopDefault(styled);const PositionedMenuComponent=styled__default.default(MenuComponent.MenuComponent).withConfig({shouldForwardProp:n=>!['expanseDirectionLeft'].includes(n)}).withConfig({displayName:"Dropdown__PositionedMenuComponent",componentId:"ui__sc-519mcg-0"})(["position:absolute;",""],(n=>`\n    top: 0;\n    left: ${n.expanseDirectionLeft?'auto':0};\n    right: ${n.expanseDirectionLeft?0:'auto'};  \n  `));const spinAnimation=styled.keyframes(["100%{transform:rotate(360deg);}"]);const IconContainer=styled__default.default.div.withConfig({displayName:"Dropdown__IconContainer",componentId:"ui__sc-519mcg-1"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:12px 0;"]);const ChevronIcon=styled__default.default(index.ChevronDown).withConfig({shouldForwardProp:n=>n!=='up'}).withConfig({displayName:"Dropdown__ChevronIcon",componentId:"ui__sc-519mcg-2"})(["",""],(n=>`\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${n.up?180:0}deg);\n  `));const LoadingIconAnimated=styled__default.default(index$1.LoaderFill).withConfig({displayName:"Dropdown__LoadingIconAnimated",componentId:"ui__sc-519mcg-3"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);const InputMimic=styled__default.default.input.withConfig({displayName:"Dropdown__InputMimic",componentId:"ui__sc-519mcg-4"})(["box-sizing:border-box;position:absolute;top:0;left:0;appearance:none;border:none;padding:0;margin:0;background-color:transparent;width:100%;height:100%;opacity:0;&:focus{outline:none;}"]);exports.ChevronIcon=ChevronIcon,exports.IconContainer=IconContainer,exports.InputMimic=InputMimic,exports.LoadingIconAnimated=LoadingIconAnimated,exports.PositionedMenuComponent=PositionedMenuComponent;
+'use strict';var styled=require('styled-components');var index=require('../../external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.js');var index$1=require('../../external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.js');function _interopDefault(n){return n&&n.__esModule?n:{default:n}}var styled__default=_interopDefault(styled);const spinAnimation=styled.keyframes(["100%{transform:rotate(360deg);}"]);const IconContainer=styled__default.default.div.withConfig({displayName:"Dropdown__IconContainer",componentId:"ui__sc-519mcg-0"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:12px 0;"]);const ChevronIcon=styled__default.default(index.ChevronDown).withConfig({shouldForwardProp:n=>n!=='up'}).withConfig({displayName:"Dropdown__ChevronIcon",componentId:"ui__sc-519mcg-1"})(["",""],(n=>`\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${n.up?180:0}deg);\n  `));const LoadingIconAnimated=styled__default.default(index$1.LoaderFill).withConfig({displayName:"Dropdown__LoadingIconAnimated",componentId:"ui__sc-519mcg-2"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);const InputMimic=styled__default.default.input.withConfig({displayName:"Dropdown__InputMimic",componentId:"ui__sc-519mcg-3"})(["box-sizing:border-box;position:absolute;top:0;left:0;appearance:none;border:none;padding:0;margin:0;background-color:transparent;width:100%;height:100%;opacity:0;&:focus{outline:none;}"]);exports.ChevronIcon=ChevronIcon,exports.IconContainer=IconContainer,exports.InputMimic=InputMimic,exports.LoadingIconAnimated=LoadingIconAnimated;
 //# sourceMappingURL=style.js.map

package/components/Dropdown/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/Dropdown/style.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components'\nimport { LoaderFill, ChevronDown } from '@foxford/icon-pack'\nimport { MenuComponent } from 'components/MenuComponent'\nimport type { DropdownMenuProps, StyledChevronIconProps } from './types'\n\nexport const PositionedMenuComponent = styled(MenuComponent).withConfig<DropdownMenuProps>({\n  shouldForwardProp: (propKey) => !['expanseDirectionLeft'].includes(propKey),\n})`\n  position: absolute;\n\n  ${(props) => `\n    top: 0;\n    left: ${props.expanseDirectionLeft ? 'auto' : 0};\n    right: ${props.expanseDirectionLeft ? 0 : 'auto'};  \n  `}\n`\n\nconst spinAnimation = keyframes`\n  100% {\n    transform: rotate(360deg);\n  }\n`\n\nexport const IconContainer = styled.div`\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 12px 0;\n`\n\nexport const ChevronIcon = styled(ChevronDown).withConfig<StyledChevronIconProps>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  ${(props) => `\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const LoadingIconAnimated = styled(LoaderFill)`\n  transform-origin: center;\n  animation: ${spinAnimation} 1600ms infinite linear;\n`\n\nexport const InputMimic = styled.input`\n  box-sizing: border-box;\n  position: absolute;\n  top: 0;\n  left: 0;\n  appearance: none;\n  border: none;\n  padding: 0;\n  margin: 0;\n  background-color: transparent;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  &:focus {\n    outline: none;\n  }\n`\n"],"names":["PositionedMenuComponent","styled","default","MenuComponent","withConfig","shouldForwardProp","propKey","includes","displayName","componentId","props","expanseDirectionLeft","spinAnimation","keyframes","IconContainer","div","ChevronIcon","ChevronDown","up","LoadingIconAnimated","LoaderFill","InputMimic","input"],"mappings":"wjBAKO,MAAMA,wBAA0BC,gBAAMC,QAACC,6BAAeC,WAA8B,CACzFC,kBAAoBC,IAAa,CAAC,wBAAwBC,SAASD,KACnEF,WAAA,CAAAI,YAAA,oCAAAC,YAAA,mBAFqCR,CAErC,CAAA,qBAAA,KAGGS,GAAU,4BAEHA,EAAMC,qBAAuB,OAAS,kBACrCD,EAAMC,qBAAuB,EAAI,kBAI9C,MAAMC,cAAgBC,OAASA,UAI9B,CAAA,0CAEYC,cAAgBb,gBAAAA,QAAOc,IAAGX,WAAA,CAAAI,YAAA,0BAAAC,YAAA,mBAAVR,CAM5B,CAAA,gGAEM,MAAMe,YAAcf,gBAAMC,QAACe,mBAAab,WAAmC,CAChFC,kBAAoBC,GAAYA,IAAY,OAC5CF,WAAA,CAAAI,YAAA,wBAAAC,YAAA,mBAFyBR,CAEzB,CAAA,GAAA,KACGS,GAAU,gIAISA,EAAMQ,GAAK,IAAM,eAIlC,MAAMC,oBAAsBlB,gBAAMC,QAACkB,oBAAWhB,WAAA,CAAAI,YAAA,gCAAAC,YAAA,mBAAlBR,CAAkB,CAAA,qCAAA,4BAEtCW,qBAGFS,WAAapB,gBAAAA,QAAOqB,MAAKlB,WAAA,CAAAI,YAAA,uBAAAC,YAAA,mBAAZR,CAgBzB,CAAA"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/Dropdown/style.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components'\nimport { LoaderFill, ChevronDown } from '@foxford/icon-pack'\nimport type { StyledChevronIconProps } from './types'\n\nconst spinAnimation = keyframes`\n  100% {\n    transform: rotate(360deg);\n  }\n`\n\nexport const IconContainer = styled.div`\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 12px 0;\n`\n\nexport const ChevronIcon = styled(ChevronDown).withConfig<StyledChevronIconProps>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  ${(props) => `\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const LoadingIconAnimated = styled(LoaderFill)`\n  transform-origin: center;\n  animation: ${spinAnimation} 1600ms infinite linear;\n`\n\nexport const InputMimic = styled.input`\n  box-sizing: border-box;\n  position: absolute;\n  top: 0;\n  left: 0;\n  appearance: none;\n  border: none;\n  padding: 0;\n  margin: 0;\n  background-color: transparent;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  &:focus {\n    outline: none;\n  }\n`\n"],"names":["spinAnimation","keyframes","IconContainer","styled","div","withConfig","displayName","componentId","ChevronIcon","default","ChevronDown","shouldForwardProp","propKey","props","up","LoadingIconAnimated","LoaderFill","InputMimic","input"],"mappings":"yfAIA,MAAMA,cAAgBC,OAASA,UAI9B,CAAA,0CAEYC,cAAgBC,gBAAAA,QAAOC,IAAGC,WAAA,CAAAC,YAAA,0BAAAC,YAAA,mBAAVJ,CAM5B,CAAA,gGAEM,MAAMK,YAAcL,gBAAMM,QAACC,mBAAaL,WAAmC,CAChFM,kBAAoBC,GAAYA,IAAY,OAC5CP,WAAA,CAAAC,YAAA,wBAAAC,YAAA,mBAFyBJ,CAEzB,CAAA,GAAA,KACGU,GAAU,gIAISA,EAAMC,GAAK,IAAM,eAIlC,MAAMC,oBAAsBZ,gBAAMM,QAACO,oBAAWX,WAAA,CAAAC,YAAA,gCAAAC,YAAA,mBAAlBJ,CAAkB,CAAA,qCAAA,4BAEtCH,qBAGFiB,WAAad,gBAAAA,QAAOe,MAAKb,WAAA,CAAAC,YAAA,uBAAAC,YAAA,mBAAZJ,CAgBzB,CAAA"}

package/components/Dropdown/style.mjs

@@ -1,2 +1,2 @@
-import styled,{keyframes}from'styled-components';import{MenuComponent}from'../MenuComponent/MenuComponent.mjs';import{ChevronDown as ChevronDown_2}from'../../external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.mjs';import{LoaderFill as LoaderFill_2}from'../../external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.mjs';const PositionedMenuComponent=styled(MenuComponent).withConfig({shouldForwardProp:n=>!['expanseDirectionLeft'].includes(n)}).withConfig({displayName:"Dropdown__PositionedMenuComponent",componentId:"ui__sc-519mcg-0"})(["position:absolute;",""],(n=>`\n    top: 0;\n    left: ${n.expanseDirectionLeft?'auto':0};\n    right: ${n.expanseDirectionLeft?0:'auto'};  \n  `));const spinAnimation=keyframes(["100%{transform:rotate(360deg);}"]);const IconContainer=styled.div.withConfig({displayName:"Dropdown__IconContainer",componentId:"ui__sc-519mcg-1"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:12px 0;"]);const ChevronIcon=styled(ChevronDown_2).withConfig({shouldForwardProp:n=>n!=='up'}).withConfig({displayName:"Dropdown__ChevronIcon",componentId:"ui__sc-519mcg-2"})(["",""],(n=>`\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${n.up?180:0}deg);\n  `));const LoadingIconAnimated=styled(LoaderFill_2).withConfig({displayName:"Dropdown__LoadingIconAnimated",componentId:"ui__sc-519mcg-3"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);const InputMimic=styled.input.withConfig({displayName:"Dropdown__InputMimic",componentId:"ui__sc-519mcg-4"})(["box-sizing:border-box;position:absolute;top:0;left:0;appearance:none;border:none;padding:0;margin:0;background-color:transparent;width:100%;height:100%;opacity:0;&:focus{outline:none;}"]);export{ChevronIcon,IconContainer,InputMimic,LoadingIconAnimated,PositionedMenuComponent};
+import styled,{keyframes}from'styled-components';import{ChevronDown as ChevronDown_2}from'../../external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.mjs';import{LoaderFill as LoaderFill_2}from'../../external/.pnpm/@foxford_icon-pack@0.10.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.mjs';const spinAnimation=keyframes(["100%{transform:rotate(360deg);}"]);const IconContainer=styled.div.withConfig({displayName:"Dropdown__IconContainer",componentId:"ui__sc-519mcg-0"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:12px 0;"]);const ChevronIcon=styled(ChevronDown_2).withConfig({shouldForwardProp:n=>n!=='up'}).withConfig({displayName:"Dropdown__ChevronIcon",componentId:"ui__sc-519mcg-1"})(["",""],(n=>`\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${n.up?180:0}deg);\n  `));const LoadingIconAnimated=styled(LoaderFill_2).withConfig({displayName:"Dropdown__LoadingIconAnimated",componentId:"ui__sc-519mcg-2"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);const InputMimic=styled.input.withConfig({displayName:"Dropdown__InputMimic",componentId:"ui__sc-519mcg-3"})(["box-sizing:border-box;position:absolute;top:0;left:0;appearance:none;border:none;padding:0;margin:0;background-color:transparent;width:100%;height:100%;opacity:0;&:focus{outline:none;}"]);export{ChevronIcon,IconContainer,InputMimic,LoadingIconAnimated};
 //# sourceMappingURL=style.mjs.map

package/components/Dropdown/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","sources":["../../../../src/components/Dropdown/style.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components'\nimport { LoaderFill, ChevronDown } from '@foxford/icon-pack'\nimport { MenuComponent } from 'components/MenuComponent'\nimport type { DropdownMenuProps, StyledChevronIconProps } from './types'\n\nexport const PositionedMenuComponent = styled(MenuComponent).withConfig<DropdownMenuProps>({\n  shouldForwardProp: (propKey) => !['expanseDirectionLeft'].includes(propKey),\n})`\n  position: absolute;\n\n  ${(props) => `\n    top: 0;\n    left: ${props.expanseDirectionLeft ? 'auto' : 0};\n    right: ${props.expanseDirectionLeft ? 0 : 'auto'};  \n  `}\n`\n\nconst spinAnimation = keyframes`\n  100% {\n    transform: rotate(360deg);\n  }\n`\n\nexport const IconContainer = styled.div`\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 12px 0;\n`\n\nexport const ChevronIcon = styled(ChevronDown).withConfig<StyledChevronIconProps>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  ${(props) => `\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const LoadingIconAnimated = styled(LoaderFill)`\n  transform-origin: center;\n  animation: ${spinAnimation} 1600ms infinite linear;\n`\n\nexport const InputMimic = styled.input`\n  box-sizing: border-box;\n  position: absolute;\n  top: 0;\n  left: 0;\n  appearance: none;\n  border: none;\n  padding: 0;\n  margin: 0;\n  background-color: transparent;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  &:focus {\n    outline: none;\n  }\n`\n"],"names":["PositionedMenuComponent","styled","MenuComponent","withConfig","shouldForwardProp","propKey","includes","displayName","componentId","props","expanseDirectionLeft","spinAnimation","keyframes","IconContainer","div","ChevronIcon","ChevronDown","up","LoadingIconAnimated","LoaderFill","InputMimic","input"],"mappings":"8eAKO,MAAMA,wBAA0BC,OAAOC,eAAeC,WAA8B,CACzFC,kBAAoBC,IAAa,CAAC,wBAAwBC,SAASD,KACnEF,WAAA,CAAAI,YAAA,oCAAAC,YAAA,mBAFqCP,CAErC,CAAA,qBAAA,KAGGQ,GAAU,4BAEHA,EAAMC,qBAAuB,OAAS,kBACrCD,EAAMC,qBAAuB,EAAI,kBAI9C,MAAMC,cAAgBC,UAIrB,CAAA,0CAEYC,cAAgBZ,OAAOa,IAAGX,WAAA,CAAAI,YAAA,0BAAAC,YAAA,mBAAVP,CAM5B,CAAA,gGAEM,MAAMc,YAAcd,OAAOe,eAAab,WAAmC,CAChFC,kBAAoBC,GAAYA,IAAY,OAC5CF,WAAA,CAAAI,YAAA,wBAAAC,YAAA,mBAFyBP,CAEzB,CAAA,GAAA,KACGQ,GAAU,gIAISA,EAAMQ,GAAK,IAAM,eAIlC,MAAMC,oBAAsBjB,OAAOkB,cAAWhB,WAAA,CAAAI,YAAA,gCAAAC,YAAA,mBAAlBP,CAAkB,CAAA,qCAAA,4BAEtCU,qBAGFS,WAAanB,OAAOoB,MAAKlB,WAAA,CAAAI,YAAA,uBAAAC,YAAA,mBAAZP,CAgBzB,CAAA"}
+{"version":3,"file":"style.mjs","sources":["../../../../src/components/Dropdown/style.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components'\nimport { LoaderFill, ChevronDown } from '@foxford/icon-pack'\nimport type { StyledChevronIconProps } from './types'\n\nconst spinAnimation = keyframes`\n  100% {\n    transform: rotate(360deg);\n  }\n`\n\nexport const IconContainer = styled.div`\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 12px 0;\n`\n\nexport const ChevronIcon = styled(ChevronDown).withConfig<StyledChevronIconProps>({\n  shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n  ${(props) => `\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${props.up ? 180 : 0}deg);\n  `}\n`\n\nexport const LoadingIconAnimated = styled(LoaderFill)`\n  transform-origin: center;\n  animation: ${spinAnimation} 1600ms infinite linear;\n`\n\nexport const InputMimic = styled.input`\n  box-sizing: border-box;\n  position: absolute;\n  top: 0;\n  left: 0;\n  appearance: none;\n  border: none;\n  padding: 0;\n  margin: 0;\n  background-color: transparent;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  &:focus {\n    outline: none;\n  }\n`\n"],"names":["spinAnimation","keyframes","IconContainer","styled","div","withConfig","displayName","componentId","ChevronIcon","ChevronDown","shouldForwardProp","propKey","props","up","LoadingIconAnimated","LoaderFill","InputMimic","input"],"mappings":"gbAIA,MAAMA,cAAgBC,UAIrB,CAAA,0CAEYC,cAAgBC,OAAOC,IAAGC,WAAA,CAAAC,YAAA,0BAAAC,YAAA,mBAAVJ,CAM5B,CAAA,gGAEM,MAAMK,YAAcL,OAAOM,eAAaJ,WAAmC,CAChFK,kBAAoBC,GAAYA,IAAY,OAC5CN,WAAA,CAAAC,YAAA,wBAAAC,YAAA,mBAFyBJ,CAEzB,CAAA,GAAA,KACGS,GAAU,gIAISA,EAAMC,GAAK,IAAM,eAIlC,MAAMC,oBAAsBX,OAAOY,cAAWV,WAAA,CAAAC,YAAA,gCAAAC,YAAA,mBAAlBJ,CAAkB,CAAA,qCAAA,4BAEtCH,qBAGFgB,WAAab,OAAOc,MAAKZ,WAAA,CAAAC,YAAA,uBAAAC,YAAA,mBAAZJ,CAgBzB,CAAA"}

package/components/FormInputLabel/style.js

@@ -1,2 +1,2 @@
-'use strict';var styled=require('styled-components');var tinycolor=require('../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.js');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardFormInputLabelProp=style.createShouldForwardProp((o=>!['primary','secondary','error','success','disabled','onColored','inline','zIndex','overflow'].includes(o)));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &:hover {\n    background-color: ${o.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${o.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${o.backgroundColor}; \n  }\n`;const COLOR_SCHEMA={contrast:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-200'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-200'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-200'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-200'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor.default(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))},secondary:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor.default(o.theme.colors['bg-onmain-secondary']).darken(4).toString(),...o.palette})))},primary:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor.default(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))}};const Dropdown=styled__default.default.div.withConfig({displayName:"FormInputLabel__Dropdown",componentId:"ui__sc-1il4atw-0"})(["box-sizing:border-box;position:absolute;top:100%;margin-top:8px;"]);const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardFormInputLabelProp}).withConfig({displayName:"FormInputLabel__Root",componentId:"ui__sc-1il4atw-1"})([""," "," "," ",""],(o=>{const e='1px';return`\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${o.inline?'inline-flex':'flex'};\n      cursor: ${o.disabled?'not-allowed':'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${e} solid transparent;\n      z-index: ${o.zIndex??'auto'};\n      overflow: ${o.overflow??'visible'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${e};\n        left: -${e};\n      }\n\n      &:focus-within {\n        box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n      }\n\n      &:hover [data-input-control]::after,\n      &:focus-within [data-input-control]::after {\n        opacity: 0;\n      }\n    `}),(o=>{let e=COLOR_SCHEMA.primary;return o.secondary&&(e=COLOR_SCHEMA.secondary),(o.contrast||o.onColored)&&(e=COLOR_SCHEMA.contrast),o.disabled?e.disabled:o.error?e.error:o.success?e.success:e.default}),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Label=styled__default.default.span.withConfig({displayName:"FormInputLabel__Label",componentId:"ui__sc-1il4atw-2"})(["box-sizing:border-box;position:absolute;left:0;top:0;transform:translateY(0.7em);width:100%;white-space:nowrap;overflow:hidden;line-height:1;text-overflow:ellipsis;pointer-events:none;transition-property:transform,width;transition-duration:","ms,0ms;transition-delay:0ms,0ms;transition-timing-function:cubic-bezier(0,0,0.48,1);"],125);const InputContainer=styled__default.default.div.withConfig({shouldForwardProp:o=>!['position','labelPosition','labelActive'].includes(o)}).withConfig({displayName:"FormInputLabel__InputContainer",componentId:"ui__sc-1il4atw-3"})([""," "," "," ",""],(o=>`\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    flex-grow: 1;\n    align-self: ${o.position};\n    cursor: inherit;\n    min-height: 2.4em;\n  `),(o=>o.labelPosition==='dynamic'&&`\n      padding-top: 0.7em;\n\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n       ${o.labelActive&&`& > ${Label} {\n              transition-delay: 0ms, 125ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(0px);\n              width: 130%;\n            }`}\n    `),(o=>o.labelPosition==='top'&&`\n      padding-top: 0.7em;\n\n      & > ${Label} {\n        transition-delay: 0ms, 125ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(0px);\n        width: 130%;\n      }\n    `),(o=>o.labelPosition==='center'&&`\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n      & > ${Label} {\n        opacity: ${o.labelActive?0:1};\n        z-index: ${o.labelActive?-1:'auto'};\n      }\n    `));exports.Dropdown=Dropdown,exports.InputContainer=InputContainer,exports.Label=Label,exports.Root=Root;
+'use strict';var styled=require('styled-components');var tinycolor=require('../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.js');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardFormInputLabelProp=style.createShouldForwardProp((o=>!['primary','secondary','error','success','focus','disabled','onColored','inline','zIndex','overflow'].includes(o)));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &:hover {\n    background-color: ${o.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${o.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${o.backgroundColor}; \n  }\n`;const COLOR_SCHEMA={contrast:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-200'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-200'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-200'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-200'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:o.focus?o.theme.colors['bg-onmain-primary']:tinycolor.default(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))},secondary:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:o.focus?o.theme.colors['bg-onmain-secondary']:tinycolor.default(o.theme.colors['bg-onmain-secondary']).darken(4).toString(),...o.palette})))},primary:{disabled:styled.css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:o.focus?o.theme.colors['bg-onmain-primary']:tinycolor.default(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))}};const Dropdown=styled__default.default.div.withConfig({displayName:"FormInputLabel__Dropdown",componentId:"ui__sc-1il4atw-0"})(["box-sizing:border-box;position:absolute;top:100%;margin-top:8px;"]);const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardFormInputLabelProp}).withConfig({displayName:"FormInputLabel__Root",componentId:"ui__sc-1il4atw-1"})([""," "," "," "," ",""],(o=>{const e='1px';return`\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${o.inline?'inline-flex':'flex'};\n      cursor: ${o.disabled?'not-allowed':'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${e} solid transparent;\n      z-index: ${o.zIndex??'auto'};\n      overflow: ${o.overflow??'visible'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${e};\n        left: -${e};\n      }\n\n      &:hover [data-input-control]::after {\n        opacity: 0;\n      }\n    `}),(o=>o.focus?`\n        box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n        & [data-input-control]::after {\n          opacity: 0;\n        }\n      `:`\n        &:focus-within {\n          box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n          outline: 2px solid transparent;\n          outline-offset: 2px;\n        }\n        &:focus-within [data-input-control]::after {\n          opacity: 0;\n        }\n      `),(o=>{let e=COLOR_SCHEMA.primary;return o.secondary&&(e=COLOR_SCHEMA.secondary),(o.contrast||o.onColored)&&(e=COLOR_SCHEMA.contrast),o.disabled?e.disabled:o.error?e.error:o.success?e.success:e.default}),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Label=styled__default.default.span.withConfig({displayName:"FormInputLabel__Label",componentId:"ui__sc-1il4atw-2"})(["box-sizing:border-box;position:absolute;left:0;top:0;transform:translateY(0.7em);width:100%;white-space:nowrap;overflow:hidden;line-height:1;text-overflow:ellipsis;pointer-events:none;transition-property:transform,width;transition-duration:","ms,0ms;transition-delay:0ms,0ms;transition-timing-function:cubic-bezier(0,0,0.48,1);"],125);const InputContainer=styled__default.default.div.withConfig({shouldForwardProp:o=>!['position','labelPosition','labelActive'].includes(o)}).withConfig({displayName:"FormInputLabel__InputContainer",componentId:"ui__sc-1il4atw-3"})([""," "," "," ",""],(o=>`\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    flex-grow: 1;\n    align-self: ${o.position};\n    cursor: inherit;\n    min-height: 2.4em;\n  `),(o=>o.labelPosition==='dynamic'&&`\n      padding-top: 0.7em;\n\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n       ${o.labelActive&&`& > ${Label} {\n              transition-delay: 0ms, 125ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(0px);\n              width: 130%;\n            }`}\n    `),(o=>o.labelPosition==='top'&&`\n      padding-top: 0.7em;\n\n      & > ${Label} {\n        transition-delay: 0ms, 125ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(0px);\n        width: 130%;\n      }\n    `),(o=>o.labelPosition==='center'&&`\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n      & > ${Label} {\n        opacity: ${o.labelActive?0:1};\n        z-index: ${o.labelActive?-1:'auto'};\n      }\n    `));exports.Dropdown=Dropdown,exports.InputContainer=InputContainer,exports.Label=Label,exports.Root=Root;
 //# sourceMappingURL=style.js.map

package/components/FormInputLabel/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sources":["../../../../src/components/FormInputLabel/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { CSSColor } from 'shared/types'\nimport type { StyledFormInputLabelProps, FormInputLabelPalette, StyledInputContainerProps } from './types'\n\nconst shouldForwardFormInputLabelProp = createShouldForwardProp(\n  (propKey) =>\n    !['primary', 'secondary', 'error', 'success', 'disabled', 'onColored', 'inline', 'zIndex', 'overflow'].includes(\n      propKey\n    )\n)\n\nconst labelTransitionMS = 125\n\nconst template = (palette: FormInputLabelPalette) => `\n  color: ${palette.color};\n  background-color: ${palette.backgroundColor};\n  border-color: ${palette.borderColor};\n  &:hover {\n    background-color: ${palette.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${palette.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${palette.backgroundColor}; \n  }\n`\n\nconst COLOR_SCHEMA = {\n  contrast: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-200'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-200'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-200'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-200'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-primary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-onmain-primary']).darken(4).toString() as CSSColor,\n          ...props.palette,\n        })}\n    `,\n  },\n  secondary: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-100'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-100'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-100'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-100'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-secondary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-onmain-secondary']).darken(4).toString() as CSSColor,\n          ...props.palette,\n        })}\n    `,\n  },\n  primary: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-100'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-100'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-100'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-100'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-primary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: tinycolor(props.theme.colors['bg-onmain-primary']).darken(4).toString() as CSSColor,\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nexport const Dropdown = styled.div`\n  box-sizing: border-box;\n  position: absolute;\n  top: 100%;\n  margin-top: 8px;\n`\n\nexport const Root = styled.div.withConfig<StyledFormInputLabelProps>({\n  shouldForwardProp: shouldForwardFormInputLabelProp,\n})`\n  ${(props) => {\n    const borderWidth = '1px'\n\n    return `\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${props.inline ? 'inline-flex' : 'flex'};\n      cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${borderWidth} solid transparent;\n      z-index: ${props.zIndex ?? 'auto'};\n      overflow: ${props.overflow ?? 'visible'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${borderWidth};\n        left: -${borderWidth};\n      }\n\n      &:focus-within {\n        box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n      }\n\n      &:hover [data-input-control]::after,\n      &:focus-within [data-input-control]::after {\n        opacity: 0;\n      }\n    `\n  }}\n  ${(props) => {\n    let schema = COLOR_SCHEMA.primary\n\n    if (props.secondary) schema = COLOR_SCHEMA.secondary\n    if (props.contrast || props.onColored) schema = COLOR_SCHEMA.contrast\n\n    if (props.disabled) return schema.disabled\n    if (props.error) return schema.error\n    if (props.success) return schema.success\n\n    return schema.default\n  }}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Label = styled.span`\n  box-sizing: border-box;\n  position: absolute;\n  left: 0;\n  top: 0;\n  transform: translateY(0.7em);\n  width: 100%;\n  white-space: nowrap;\n  overflow: hidden;\n  line-height: 1;\n  text-overflow: ellipsis;\n  pointer-events: none;\n  transition-property: transform, width;\n  transition-duration: ${labelTransitionMS}ms, 0ms;\n  transition-delay: 0ms, 0ms;\n  transition-timing-function: cubic-bezier(0, 0, 0.48, 1);\n`\n\nexport const InputContainer = styled.div.withConfig<StyledInputContainerProps>({\n  shouldForwardProp: (propKey) => !['position', 'labelPosition', 'labelActive'].includes(propKey),\n})`\n  ${(props) => `\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    flex-grow: 1;\n    align-self: ${props.position};\n    cursor: inherit;\n    min-height: 2.4em;\n  `}\n\n  ${(props) =>\n    props.labelPosition === 'dynamic' &&\n    `\n      padding-top: 0.7em;\n\n      & input, & textarea {\n        opacity: ${props.labelActive ? 1 : 0};\n      }\n\n       ${\n         props.labelActive &&\n         `& > ${Label} {\n              transition-delay: 0ms, ${labelTransitionMS}ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(0px);\n              width: 130%;\n            }`\n       }\n    `}\n\n  ${(props) =>\n    props.labelPosition === 'top' &&\n    `\n      padding-top: 0.7em;\n\n      & > ${Label} {\n        transition-delay: 0ms, ${labelTransitionMS}ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(0px);\n        width: 130%;\n      }\n    `}\n\n  ${(props) =>\n    props.labelPosition === 'center' &&\n    `\n      & input, & textarea {\n        opacity: ${props.labelActive ? 1 : 0};\n      }\n\n      & > ${Label} {\n        opacity: ${props.labelActive ? 0 : 1};\n        z-index: ${props.labelActive ? -1 : 'auto'};\n      }\n    `}\n`\n"],"names":["shouldForwardFormInputLabelProp","createShouldForwardProp","propKey","includes","template","palette","color","backgroundColor","borderColor","backgroundColorHover","COLOR_SCHEMA","contrast","disabled","css","props","theme","colors","transparent","error","success","default","tinycolor","darken","toString","secondary","primary","Dropdown","styled","div","withConfig","displayName","componentId","Root","shouldForwardProp","borderWidth","inline","zIndex","overflow","white","schema","onColored","responsiveSize","responsiveMargin","Label","span","InputContainer","position","labelPosition","labelActive"],"mappings":"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"}
+{"version":3,"file":"style.js","sources":["../../../../src/components/FormInputLabel/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { CSSColor } from 'shared/types'\nimport type { StyledFormInputLabelProps, FormInputLabelPalette, StyledInputContainerProps } from './types'\n\nconst shouldForwardFormInputLabelProp = createShouldForwardProp(\n  (propKey) =>\n    ![\n      'primary',\n      'secondary',\n      'error',\n      'success',\n      'focus',\n      'disabled',\n      'onColored',\n      'inline',\n      'zIndex',\n      'overflow',\n    ].includes(propKey)\n)\n\nconst labelTransitionMS = 125\n\nconst template = (palette: FormInputLabelPalette) => `\n  color: ${palette.color};\n  background-color: ${palette.backgroundColor};\n  border-color: ${palette.borderColor};\n  &:hover {\n    background-color: ${palette.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${palette.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${palette.backgroundColor}; \n  }\n`\n\nconst COLOR_SCHEMA = {\n  contrast: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-200'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-200'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-200'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-200'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-primary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: props.focus\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-onmain-primary']).darken(4).toString() as CSSColor),\n          ...props.palette,\n        })}\n    `,\n  },\n  secondary: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-100'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-100'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-100'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-100'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-secondary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: props.focus\n            ? props.theme.colors['bg-onmain-secondary']\n            : (tinycolor(props.theme.colors['bg-onmain-secondary']).darken(4).toString() as CSSColor),\n          ...props.palette,\n        })}\n    `,\n  },\n  primary: {\n    disabled: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-disabled'],\n          backgroundColor: props.theme.colors['bg-disabled-large'],\n          borderColor: props.theme.colors.transparent,\n          backgroundColorHover: props.theme.colors['bg-disabled-large'],\n          ...props.palette,\n        })}\n    `,\n    error: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-error-100'],\n          borderColor: props.theme.colors['alert-bg-error-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-error-100'],\n          ...props.palette,\n        })}\n    `,\n    success: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['alert-bg-success-100'],\n          borderColor: props.theme.colors['alert-bg-success-500'],\n          backgroundColorHover: props.theme.colors['alert-bg-success-100'],\n          ...props.palette,\n        })}\n    `,\n    default: css<StyledFormInputLabelProps>`\n      ${(props) =>\n        template({\n          color: props.theme.colors['content-onmain-secondary'],\n          backgroundColor: props.theme.colors['bg-onmain-primary'],\n          borderColor: props.theme.colors['border-onmain-default-large'],\n          backgroundColorHover: props.focus\n            ? props.theme.colors['bg-onmain-primary']\n            : (tinycolor(props.theme.colors['bg-onmain-primary']).darken(4).toString() as CSSColor),\n          ...props.palette,\n        })}\n    `,\n  },\n}\n\nexport const Dropdown = styled.div`\n  box-sizing: border-box;\n  position: absolute;\n  top: 100%;\n  margin-top: 8px;\n`\n\nexport const Root = styled.div.withConfig<StyledFormInputLabelProps>({\n  shouldForwardProp: shouldForwardFormInputLabelProp,\n})`\n  ${(props) => {\n    const borderWidth = '1px'\n\n    return `\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${props.inline ? 'inline-flex' : 'flex'};\n      cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${borderWidth} solid transparent;\n      z-index: ${props.zIndex ?? 'auto'};\n      overflow: ${props.overflow ?? 'visible'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${borderWidth};\n        left: -${borderWidth};\n      }\n\n      &:hover [data-input-control]::after {\n        opacity: 0;\n      }\n    `\n  }}\n\n  ${(props) =>\n    props.focus\n      ? `\n        box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n        & [data-input-control]::after {\n          opacity: 0;\n        }\n      `\n      : `\n        &:focus-within {\n          box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n          outline: 2px solid transparent;\n          outline-offset: 2px;\n        }\n        &:focus-within [data-input-control]::after {\n          opacity: 0;\n        }\n      `}\n\n  ${(props) => {\n    let schema = COLOR_SCHEMA.primary\n\n    if (props.secondary) schema = COLOR_SCHEMA.secondary\n    if (props.contrast || props.onColored) schema = COLOR_SCHEMA.contrast\n\n    if (props.disabled) return schema.disabled\n    if (props.error) return schema.error\n    if (props.success) return schema.success\n\n    return schema.default\n  }}\n\n  ${responsiveSize}\n  ${responsiveMargin}\n`\n\nexport const Label = styled.span`\n  box-sizing: border-box;\n  position: absolute;\n  left: 0;\n  top: 0;\n  transform: translateY(0.7em);\n  width: 100%;\n  white-space: nowrap;\n  overflow: hidden;\n  line-height: 1;\n  text-overflow: ellipsis;\n  pointer-events: none;\n  transition-property: transform, width;\n  transition-duration: ${labelTransitionMS}ms, 0ms;\n  transition-delay: 0ms, 0ms;\n  transition-timing-function: cubic-bezier(0, 0, 0.48, 1);\n`\n\nexport const InputContainer = styled.div.withConfig<StyledInputContainerProps>({\n  shouldForwardProp: (propKey) => !['position', 'labelPosition', 'labelActive'].includes(propKey),\n})`\n  ${(props) => `\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    flex-grow: 1;\n    align-self: ${props.position};\n    cursor: inherit;\n    min-height: 2.4em;\n  `}\n\n  ${(props) =>\n    props.labelPosition === 'dynamic' &&\n    `\n      padding-top: 0.7em;\n\n      & input, & textarea {\n        opacity: ${props.labelActive ? 1 : 0};\n      }\n\n       ${\n         props.labelActive &&\n         `& > ${Label} {\n              transition-delay: 0ms, ${labelTransitionMS}ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(0px);\n              width: 130%;\n            }`\n       }\n    `}\n\n  ${(props) =>\n    props.labelPosition === 'top' &&\n    `\n      padding-top: 0.7em;\n\n      & > ${Label} {\n        transition-delay: 0ms, ${labelTransitionMS}ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(0px);\n        width: 130%;\n      }\n    `}\n\n  ${(props) =>\n    props.labelPosition === 'center' &&\n    `\n      & input, & textarea {\n        opacity: ${props.labelActive ? 1 : 0};\n      }\n\n      & > ${Label} {\n        opacity: ${props.labelActive ? 0 : 1};\n        z-index: ${props.labelActive ? -1 : 'auto'};\n      }\n    `}\n`\n"],"names":["shouldForwardFormInputLabelProp","createShouldForwardProp","propKey","includes","template","palette","color","backgroundColor","borderColor","backgroundColorHover","COLOR_SCHEMA","contrast","disabled","css","props","theme","colors","transparent","error","success","default","focus","tinycolor","darken","toString","secondary","primary","Dropdown","styled","div","withConfig","displayName","componentId","Root","shouldForwardProp","borderWidth","inline","zIndex","overflow","white","schema","onColored","responsiveSize","responsiveMargin","Label","span","InputContainer","position","labelPosition","labelActive"],"mappings":"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"}

package/components/FormInputLabel/style.mjs

@@ -1,2 +1,2 @@
-import styled,{css}from'styled-components';import tinycolor from'../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.mjs';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';const shouldForwardFormInputLabelProp=createShouldForwardProp((o=>!['primary','secondary','error','success','disabled','onColored','inline','zIndex','overflow'].includes(o)));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &:hover {\n    background-color: ${o.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${o.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${o.backgroundColor}; \n  }\n`;const COLOR_SCHEMA={contrast:{disabled:css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-200'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-200'],...o.palette}))),success:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-200'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-200'],...o.palette}))),default:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))},secondary:{disabled:css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor(o.theme.colors['bg-onmain-secondary']).darken(4).toString(),...o.palette})))},primary:{disabled:css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:tinycolor(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))}};const Dropdown=styled.div.withConfig({displayName:"FormInputLabel__Dropdown",componentId:"ui__sc-1il4atw-0"})(["box-sizing:border-box;position:absolute;top:100%;margin-top:8px;"]);const Root=styled.div.withConfig({shouldForwardProp:shouldForwardFormInputLabelProp}).withConfig({displayName:"FormInputLabel__Root",componentId:"ui__sc-1il4atw-1"})([""," "," "," ",""],(o=>{const e='1px';return`\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${o.inline?'inline-flex':'flex'};\n      cursor: ${o.disabled?'not-allowed':'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${e} solid transparent;\n      z-index: ${o.zIndex??'auto'};\n      overflow: ${o.overflow??'visible'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${e};\n        left: -${e};\n      }\n\n      &:focus-within {\n        box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n      }\n\n      &:hover [data-input-control]::after,\n      &:focus-within [data-input-control]::after {\n        opacity: 0;\n      }\n    `}),(o=>{let e=COLOR_SCHEMA.primary;return o.secondary&&(e=COLOR_SCHEMA.secondary),(o.contrast||o.onColored)&&(e=COLOR_SCHEMA.contrast),o.disabled?e.disabled:o.error?e.error:o.success?e.success:e.default}),responsiveSize,responsiveMargin);const Label=styled.span.withConfig({displayName:"FormInputLabel__Label",componentId:"ui__sc-1il4atw-2"})(["box-sizing:border-box;position:absolute;left:0;top:0;transform:translateY(0.7em);width:100%;white-space:nowrap;overflow:hidden;line-height:1;text-overflow:ellipsis;pointer-events:none;transition-property:transform,width;transition-duration:","ms,0ms;transition-delay:0ms,0ms;transition-timing-function:cubic-bezier(0,0,0.48,1);"],125);const InputContainer=styled.div.withConfig({shouldForwardProp:o=>!['position','labelPosition','labelActive'].includes(o)}).withConfig({displayName:"FormInputLabel__InputContainer",componentId:"ui__sc-1il4atw-3"})([""," "," "," ",""],(o=>`\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    flex-grow: 1;\n    align-self: ${o.position};\n    cursor: inherit;\n    min-height: 2.4em;\n  `),(o=>o.labelPosition==='dynamic'&&`\n      padding-top: 0.7em;\n\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n       ${o.labelActive&&`& > ${Label} {\n              transition-delay: 0ms, 125ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(0px);\n              width: 130%;\n            }`}\n    `),(o=>o.labelPosition==='top'&&`\n      padding-top: 0.7em;\n\n      & > ${Label} {\n        transition-delay: 0ms, 125ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(0px);\n        width: 130%;\n      }\n    `),(o=>o.labelPosition==='center'&&`\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n      & > ${Label} {\n        opacity: ${o.labelActive?0:1};\n        z-index: ${o.labelActive?-1:'auto'};\n      }\n    `));export{Dropdown,InputContainer,Label,Root};
+import styled,{css}from'styled-components';import tinycolor from'../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.mjs';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';const shouldForwardFormInputLabelProp=createShouldForwardProp((o=>!['primary','secondary','error','success','focus','disabled','onColored','inline','zIndex','overflow'].includes(o)));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &:hover {\n    background-color: ${o.backgroundColorHover};\n  }\n  &:focus-within {\n    background-color: ${o.backgroundColor};\n  }\n  & [data-input-control]::after {\n    color: ${o.backgroundColor}; \n  }\n`;const COLOR_SCHEMA={contrast:{disabled:css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-200'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-200'],...o.palette}))),success:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-200'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-200'],...o.palette}))),default:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:o.focus?o.theme.colors['bg-onmain-primary']:tinycolor(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))},secondary:{disabled:css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:o.focus?o.theme.colors['bg-onmain-secondary']:tinycolor(o.theme.colors['bg-onmain-secondary']).darken(4).toString(),...o.palette})))},primary:{disabled:css(["",""],(o=>template({color:o.theme.colors['content-disabled'],backgroundColor:o.theme.colors['bg-disabled-large'],borderColor:o.theme.colors.transparent,backgroundColorHover:o.theme.colors['bg-disabled-large'],...o.palette}))),error:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-error-100'],borderColor:o.theme.colors['alert-bg-error-500'],backgroundColorHover:o.theme.colors['alert-bg-error-100'],...o.palette}))),success:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['alert-bg-success-100'],borderColor:o.theme.colors['alert-bg-success-500'],backgroundColorHover:o.theme.colors['alert-bg-success-100'],...o.palette}))),default:css(["",""],(o=>template({color:o.theme.colors['content-onmain-secondary'],backgroundColor:o.theme.colors['bg-onmain-primary'],borderColor:o.theme.colors['border-onmain-default-large'],backgroundColorHover:o.focus?o.theme.colors['bg-onmain-primary']:tinycolor(o.theme.colors['bg-onmain-primary']).darken(4).toString(),...o.palette})))}};const Dropdown=styled.div.withConfig({displayName:"FormInputLabel__Dropdown",componentId:"ui__sc-1il4atw-0"})(["box-sizing:border-box;position:absolute;top:100%;margin-top:8px;"]);const Root=styled.div.withConfig({shouldForwardProp:shouldForwardFormInputLabelProp}).withConfig({displayName:"FormInputLabel__Root",componentId:"ui__sc-1il4atw-1"})([""," "," "," "," ",""],(o=>{const e='1px';return`\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      display: ${o.inline?'inline-flex':'flex'};\n      cursor: ${o.disabled?'not-allowed':'pointer'};\n      align-items: center;\n      min-width: min-content;\n      border: ${e} solid transparent;\n      z-index: ${o.zIndex??'auto'};\n      overflow: ${o.overflow??'visible'};\n      transition-property: background-color;\n      transition-duration: 150ms;\n      transition-timing-function: ease-in;\n\n      & > ${Dropdown} {\n        right: -${e};\n        left: -${e};\n      }\n\n      &:hover [data-input-control]::after {\n        opacity: 0;\n      }\n    `}),(o=>o.focus?`\n        box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n        outline: 2px solid transparent;\n        outline-offset: 2px;\n        & [data-input-control]::after {\n          opacity: 0;\n        }\n      `:`\n        &:focus-within {\n          box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n          outline: 2px solid transparent;\n          outline-offset: 2px;\n        }\n        &:focus-within [data-input-control]::after {\n          opacity: 0;\n        }\n      `),(o=>{let e=COLOR_SCHEMA.primary;return o.secondary&&(e=COLOR_SCHEMA.secondary),(o.contrast||o.onColored)&&(e=COLOR_SCHEMA.contrast),o.disabled?e.disabled:o.error?e.error:o.success?e.success:e.default}),responsiveSize,responsiveMargin);const Label=styled.span.withConfig({displayName:"FormInputLabel__Label",componentId:"ui__sc-1il4atw-2"})(["box-sizing:border-box;position:absolute;left:0;top:0;transform:translateY(0.7em);width:100%;white-space:nowrap;overflow:hidden;line-height:1;text-overflow:ellipsis;pointer-events:none;transition-property:transform,width;transition-duration:","ms,0ms;transition-delay:0ms,0ms;transition-timing-function:cubic-bezier(0,0,0.48,1);"],125);const InputContainer=styled.div.withConfig({shouldForwardProp:o=>!['position','labelPosition','labelActive'].includes(o)}).withConfig({displayName:"FormInputLabel__InputContainer",componentId:"ui__sc-1il4atw-3"})([""," "," "," ",""],(o=>`\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    flex-grow: 1;\n    align-self: ${o.position};\n    cursor: inherit;\n    min-height: 2.4em;\n  `),(o=>o.labelPosition==='dynamic'&&`\n      padding-top: 0.7em;\n\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n       ${o.labelActive&&`& > ${Label} {\n              transition-delay: 0ms, 125ms;\n              transform: scale(0.7) translateX(-21.4%) translateY(0px);\n              width: 130%;\n            }`}\n    `),(o=>o.labelPosition==='top'&&`\n      padding-top: 0.7em;\n\n      & > ${Label} {\n        transition-delay: 0ms, 125ms;\n        transform: scale(0.7) translateX(-21.4%) translateY(0px);\n        width: 130%;\n      }\n    `),(o=>o.labelPosition==='center'&&`\n      & input, & textarea {\n        opacity: ${o.labelActive?1:0};\n      }\n\n      & > ${Label} {\n        opacity: ${o.labelActive?0:1};\n        z-index: ${o.labelActive?-1:'auto'};\n      }\n    `));export{Dropdown,InputContainer,Label,Root};
 //# sourceMappingURL=style.mjs.map