@foxford/ui 2.83.0-beta-4ae8299-20251007 → 2.84.0-beta-4d7a4d1-20251008

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (78) hide show
  1. package/components/Dropdown/Dropdown.js +1 -1
  2. package/components/Dropdown/Dropdown.js.map +1 -1
  3. package/components/Dropdown/Dropdown.mjs +1 -1
  4. package/components/Dropdown/Dropdown.mjs.map +1 -1
  5. package/components/Dropdown/sizes.js +1 -1
  6. package/components/Dropdown/sizes.js.map +1 -1
  7. package/components/Dropdown/sizes.mjs +1 -1
  8. package/components/Dropdown/sizes.mjs.map +1 -1
  9. package/components/FormInput/FormInput.js +1 -1
  10. package/components/FormInput/FormInput.js.map +1 -1
  11. package/components/FormInput/FormInput.mjs +1 -1
  12. package/components/FormInput/FormInput.mjs.map +1 -1
  13. package/components/FormInput/sizes.js +2 -0
  14. package/components/FormInput/sizes.js.map +1 -0
  15. package/components/FormInput/sizes.mjs +2 -0
  16. package/components/FormInput/sizes.mjs.map +1 -0
  17. package/components/FormInput/style.js +1 -1
  18. package/components/FormInput/style.js.map +1 -1
  19. package/components/FormInput/style.mjs +1 -1
  20. package/components/FormInput/style.mjs.map +1 -1
  21. package/components/FormInputLabel/FormInputLabel.js +1 -1
  22. package/components/FormInputLabel/FormInputLabel.js.map +1 -1
  23. package/components/FormInputLabel/FormInputLabel.mjs +1 -1
  24. package/components/FormInputLabel/FormInputLabel.mjs.map +1 -1
  25. package/components/FormInputLabel/sizes.js +2 -0
  26. package/components/FormInputLabel/sizes.js.map +1 -0
  27. package/components/FormInputLabel/sizes.mjs +2 -0
  28. package/components/FormInputLabel/sizes.mjs.map +1 -0
  29. package/components/FormInputLabel/style.js +1 -1
  30. package/components/FormInputLabel/style.js.map +1 -1
  31. package/components/FormInputLabel/style.mjs +1 -1
  32. package/components/FormInputLabel/style.mjs.map +1 -1
  33. package/components/Input/Input.js +1 -1
  34. package/components/Input/Input.js.map +1 -1
  35. package/components/Input/Input.mjs +1 -1
  36. package/components/Input/Input.mjs.map +1 -1
  37. package/components/Input/sizes.js +2 -0
  38. package/components/Input/sizes.js.map +1 -0
  39. package/components/Input/sizes.mjs +2 -0
  40. package/components/Input/sizes.mjs.map +1 -0
  41. package/components/InputLabel/InputLabel.js +2 -0
  42. package/components/InputLabel/InputLabel.js.map +1 -0
  43. package/components/InputLabel/InputLabel.mjs +2 -0
  44. package/components/InputLabel/InputLabel.mjs.map +1 -0
  45. package/components/InputLabel/sizes.js +2 -0
  46. package/components/InputLabel/sizes.js.map +1 -0
  47. package/components/InputLabel/sizes.mjs +2 -0
  48. package/components/InputLabel/sizes.mjs.map +1 -0
  49. package/components/InputLabel/style.js +2 -0
  50. package/components/InputLabel/style.js.map +1 -0
  51. package/components/InputLabel/style.mjs +2 -0
  52. package/components/InputLabel/style.mjs.map +1 -0
  53. package/components/Textarea/Textarea.js +1 -1
  54. package/components/Textarea/Textarea.js.map +1 -1
  55. package/components/Textarea/Textarea.mjs +1 -1
  56. package/components/Textarea/Textarea.mjs.map +1 -1
  57. package/components/Textarea/sizes.js +2 -0
  58. package/components/Textarea/sizes.js.map +1 -0
  59. package/components/Textarea/sizes.mjs +2 -0
  60. package/components/Textarea/sizes.mjs.map +1 -0
  61. package/components/Textarea/style.js +1 -1
  62. package/components/Textarea/style.js.map +1 -1
  63. package/components/Textarea/style.mjs +1 -1
  64. package/components/Textarea/style.mjs.map +1 -1
  65. package/dts/index.d.ts +434 -285
  66. package/package.json +2 -2
  67. package/components/FormInputLabel/constants.js +0 -2
  68. package/components/FormInputLabel/constants.js.map +0 -1
  69. package/components/FormInputLabel/constants.mjs +0 -2
  70. package/components/FormInputLabel/constants.mjs.map +0 -1
  71. package/components/Input/constants.js +0 -2
  72. package/components/Input/constants.js.map +0 -1
  73. package/components/Input/constants.mjs +0 -2
  74. package/components/Input/constants.mjs.map +0 -1
  75. package/components/Textarea/constants.js +0 -2
  76. package/components/Textarea/constants.js.map +0 -1
  77. package/components/Textarea/constants.mjs +0 -2
  78. package/components/Textarea/constants.mjs.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.mjs","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { forwardRef, useState, useRef, useEffect, useLayoutEffect, useMemo, useCallback } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useScrollMonitor } from 'hooks/useScrollMonitor'\nimport { focusFirstFocusable, focusLastFocusable } from 'shared/utils/dom'\nimport { createDebouncedCallback } from 'shared/utils/misc'\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 { useFilteredOptions, useLoadedOptions } from './hooks'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON } from './sizes'\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 * Компонент для выбора одной или нескольких опций из числа доступных.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n forwardRef<HTMLDivElement, MergedProps<DropdownProps>>((props, ref) => {\n const {\n size = 'm',\n name = 'fox-dropdown',\n labelPosition = 'dynamic',\n searchable = true,\n primary = true,\n optionsMultiToggle = true,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n loading,\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 onChangeInput,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n loadOptions,\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 [filteredOptions, getFilteredOptions] = useFilteredOptions({\n options,\n })\n\n const [loadedOptions, optionsLoading, getLoadedOptions] = useLoadedOptions({\n loadOptions,\n options,\n })\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 [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n const menuOptions: DropdownOption[] = loadOptions ? loadedOptions : filteredOptions\n const menuOptionsLoading = loadOptions ? (loading ?? optionsLoading) : loading\n\n const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = useMemo(\n () => (multiple ? groupDropdownOptions(menuOptions, dropdownSelectedOption) : [[], []]),\n [multiple, menuOptions, dropdownSelectedOption]\n )\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n\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 const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n const updateInputText = useCallback(\n (inputTextValue: string) => {\n setInputText(inputTextValue)\n\n if (onChangeInput) {\n onChangeInput(inputTextValue)\n }\n },\n [onChangeInput]\n )\n\n const updateOptions = useCallback(\n (inputTextValue: string) => {\n if (loadOptions) {\n getLoadedOptions(inputTextValue)\n } else {\n getFilteredOptions(inputTextValue)\n }\n },\n [loadOptions, getLoadedOptions, getFilteredOptions]\n )\n\n const updateOptionsDebounced = useMemo(() => {\n return createDebouncedCallback(updateOptions, 150)\n }, [updateOptions])\n\n const preventBlur = (evt: React.PointerEvent<HTMLDivElement> | React.MouseEvent<HTMLDivElement, MouseEvent>) => {\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\n useScrollMonitor({\n target: scrollMonitorTarget,\n onScrollStart: () => {\n if (closeMenuOnScroll && menuOpen) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n },\n })\n\n useLayoutEffect(() => {\n if (selectedOption === undefined) return\n\n if (!multiple && !menuOpen) {\n updateInputText(getDropdownInputText(selectedOption))\n }\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption, menuOpen, updateInputText])\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 (\n !multiple &&\n !disableAutoScrollToSelectedOption &&\n menuOpen &&\n !menuOptionsLoading &&\n inputText.length === 0 &&\n menuRef &&\n selectedOptionRef.current\n ) {\n const menuRect = menuRef.getBoundingClientRect()\n const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n setTimeout(() => {\n if (menuRef && selectedOptionRef.current) {\n menuRef.scrollTo(0, selectedOptionRef.current.offsetTop)\n }\n }, 0)\n }\n }\n }, [multiple, disableAutoScrollToSelectedOption, menuOpen, menuOptionsLoading, inputText, 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 updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n } else if (menuRef && evt.target instanceof Node && !menuRef.contains(evt.target)) {\n setMenuOpenRequest(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n preventBlur(evt)\n }}\n onMouseDown={(evt) => {\n if (rootProps.onMouseDown) rootProps.onMouseDown(evt)\n\n if (!window.PointerEvent) preventBlur(evt)\n }}\n onFocus={(evt) => {\n if (rootProps.onFocus) rootProps.onFocus(evt)\n\n setFocusWithin(true)\n\n if (inputRef.current && evt.target === inputRef.current && searchable && !multiple && !menuOpen) {\n updateInputText('')\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 updateInputText(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 ) : null}\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 const inputValue = evt.currentTarget.value\n\n updateInputText(inputValue)\n updateOptionsDebounced(inputValue)\n setMenuOpenRequest(true)\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n updateInputText(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 (!menuOpen) {\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\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((option) => (\n <input\n key={option.value}\n type='hidden'\n name={name}\n value={option.value}\n form={form}\n disabled={rootProps.disabled || option.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 onMouseDown={(evt) => {\n if (!window.PointerEvent) evt.preventDefault()\n }}\n discardButtonProps={{\n square: true,\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([])\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n ) : null}\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 (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(null)\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n }}\n />\n ) : null}\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={menuOptions.length === 0}\n loading={menuOptionsLoading}\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 updateInputText(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 updateInputText('')\n updateOptions('')\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={Boolean((multiToggleChecked || multiToggleIndeterminate) && status === 'error')}\n success={Boolean((multiToggleChecked || multiToggleIndeterminate) && status === 'success')}\n onChange={() => {\n if (!readOnly) {\n const update =\n multiToggleChecked || multiToggleIndeterminate\n ? dropdownSelectedOption.filter((option) => option.disabled)\n : menuOptions.filter((option) => !option.disabled)\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ) : null}\n {optionsMultiToggle ? <MenuDivider /> : null}\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 || option.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 : null}\n {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 ? (\n <MenuDivider />\n ) : null}\n {groupSelectedOptions\n ? menuOptionsGroups[1].map((option) => (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n disabled={rootProps.disabled || option.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 : null}\n {!groupSelectedOptions &&\n menuOptions.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 || option.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 {menuOptions.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 || option.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 {menuOptions.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={Boolean(selected && status === 'error')}\n success={Boolean(selected && status === 'success')}\n disabled={rootProps.disabled || option.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 updateInputText(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","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","loading","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","scrollMonitorTarget","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","clearable","onChangeInput","onCloseMenu","onOpenMenu","onSelectOption","options","loadOptions","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","filteredOptions","getFilteredOptions","useFilteredOptions","loadedOptions","optionsLoading","getLoadedOptions","useLoadedOptions","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","focusWithin","setFocusWithin","menuOpenRequest","setMenuOpenRequest","menuOptions","menuOptionsLoading","menuOptionsGroups","groupDropdownOptions","menuOpen","inputRequired","length","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","setMenuRef","menuListRef","selectedOptionRef","menuOpenPrevRef","updateInputText","useCallback","inputTextValue","updateOptions","updateOptionsDebounced","createDebouncedCallback","preventBlur","evt","target","current","Node","currentTarget","contains","renderInPortal","preventDefault","useScrollMonitor","onScrollStart","focus","useLayoutEffect","useEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","setTimeout","scrollTo","offsetTop","_jsx","FormInputLabel","labelId","active","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","onPointerDown","onMouseDown","window","PointerEvent","onFocus","onBlur","relatedTarget","input","_jsxs","_Fragment","children","type","tabIndex","FormInput","role","label","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","inputValue","onKeyDown","keyboardKeys","Enter","validate","key","Space","prev","Esc","Tab","ArrowDown","menuItems","idx","findIndex","item","focusTarget","HTMLElement","focusFirstFocusable","ArrowUp","focusLastFocusable","map","option","addon","Chip","black","marginLeft","cursor","text","textProps","appearance","colorHover","discardButtonProps","square","IconButton","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","filter","MenuDivider","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","selected","SIZES","displayName"],"mappings":"qsCAyBMA,MAAAA,eAAiB,WAQjBC,MAAAA,SAA2DC,gBAC/DC,YAAuD,CAACC,EAAOC,KAC7D,MAAMC,KACJA,EAAO,IAAGC,KACVA,EAAO,eAAcC,cACrBA,EAAgB,UAASC,WACzBA,GAAa,EAAIC,QACjBA,GAAU,EAAIC,mBACdA,GAAqB,EAAIC,UACzBA,EAAY,CAAE,EAAAC,UACdA,EAAY,CAAE,EAAAC,iBACdA,EAAmB,CAAE,EAAAC,sBACrBA,EAAwB,CAAE,EAAAC,QAC1BA,EAAOC,UACPA,EAASC,kCACTA,EAAiCC,kBACjCA,EAAiBC,oBACjBA,EAAmBC,SACnBA,EAAQC,eACRA,EAAcC,sBACdA,EAAqBC,KACrBA,EAAIC,UACJA,EAASC,eACTA,EAAcC,YACdA,EAAWC,UACXA,EAASC,SACTA,EAAQC,UACRA,EAASC,cACTA,EAAaC,YACbA,EAAWC,WACXA,EAAUC,eACVA,EAAcC,QACdA,EAAOC,YACPA,EAAWC,qBACXA,EAAoBC,0BACpBA,EAAyBC,oBACzBA,EAAmBC,iBACnBA,EAAgBC,QAChBA,EAAOC,YACPA,EAAWC,SACXA,EAAQC,SACRA,EAAQC,OACRA,EAAMC,QACNA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,KACNA,KACGC,GACDjD,EAEJ,MAAMkD,EAAY,CAChBhD,OACAwC,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMI,EAA2B,CAC/BC,MAAOC,WACPC,MAAOL,EAAUM,SAAW,mBAAqB,2BAGnD,MAAMC,EAAmBC,SAAQ,IAAMR,EAAUS,IAAM,GAAGvD,KAAQwD,YAAY,CAACxD,EAAM8C,EAAUS,KAC/F,MAAME,EAAeH,SAAQ,IAAME,UAAU,IAC7C,MAAME,GAAaJ,SAAQ,IAAME,UAAU,IAE3C,MAAOG,GAAiBC,IAAsBC,mBAAmB,CAC/DjC,YAGF,MAAOkC,GAAeC,GAAgBC,IAAoBC,iBAAiB,CACzEpC,cACAD,YAGF,MAAOsC,GAAwBC,IAA6BC,UAA2B,IACrFC,0BAA0BtD,SAAmBuD,EAAYvD,EAAiBC,EAAuBM,KAGnG,MAAOiD,GAAWC,IAAgBJ,UAAiB,IAAMK,qBAAqBP,GAAwB5C,KAEtG,MAAOoD,GAAaC,IAAkBP,UAAkB,GAExD,MAAOQ,GAAiBC,IAAsBT,UAAkB,GAEhE,MAAMU,GAAgCjD,EAAciC,GAAgBH,GACpE,MAAMoB,GAAqBlD,EAAepB,GAAWsD,GAAkBtD,EAEvE,MAAMuE,GAA6D1B,SACjE,IAAOhC,EAAW2D,qBAAqBH,GAAaZ,IAA0B,CAAC,GAAI,KACnF,CAAC5C,EAAUwD,GAAaZ,KAG1B,MAAMgB,GAAWN,KAAoB9B,EAAUM,SAE/C,MAAM+B,GAAgB9C,GAAY6B,GAAuBkB,SAAW,EACpE,MAAMC,GAAcC,QAAQJ,IAAYX,IAAaG,IAErD,MAAMa,GAAqBP,GAAkB,GAAGI,OAAS,GAAKJ,GAAkB,GAAGI,SAAW,EAC9F,MAAMI,GAA2BR,GAAkB,GAAGI,OAAS,GAAKJ,GAAkB,GAAGI,OAAS,EAElG,MAAMK,GAAWC,OAAyB,MAC1C,MAAOC,GAASC,IAAcxB,SAAgC,MAC9D,MAAMyB,GAAcH,OAAyB,MAC7C,MAAMI,GAAoBJ,OAAoB,MAC9C,MAAMK,GAAkBL,OAAgBR,IAExC,MAAMc,GAAkBC,aACrBC,IACC1B,GAAa0B,GAET1E,GACFA,EAAc0E,EAChB,GAEF,CAAC1E,IAGH,MAAM2E,GAAgBF,aACnBC,IACKrE,EACFmC,GAAiBkC,GAEjBtC,GAAmBsC,EACrB,GAEF,CAACrE,EAAamC,GAAkBJ,KAGlC,MAAMwC,GAAyB9C,SAAQ,IAC9B+C,wBAAwBF,GAAe,MAC7C,CAACA,KAEJ,MAAMG,YAAeC,IAEjBA,EAAIC,SAAWf,GAASgB,SACxBF,EAAIC,kBAAkBE,OACrBH,EAAII,cAAcC,SAASL,EAAIC,SAC7BlG,EAAUuG,gBAAkB3B,IAAYS,IAAWA,GAAQiB,SAASL,EAAIC,UAE3ED,EAAIO,gBACN,EAsDF,OAnDAC,iBAAiB,CACfP,OAAQ3F,EACRmG,cAAeA,KACTpG,GAAqBsE,KACvBO,GAASgB,SAASQ,QAClBpC,IAAmB,GACrB,IAIJqC,iBAAgB,KACVnG,SAAmBuD,IAElBhD,GAAa4D,IAChBc,GAAgBvB,qBAAqB1D,IAEvCoD,GAA0BE,0BAA0BtD,EAAgBO,IAAU,GAC7E,CAACA,EAAUP,EAAgBmE,GAAUc,KAExCmB,WAAU,KACJjC,KAAaa,GAAgBU,UAE7BvB,IAAYxD,GAAYA,KACvBwD,IAAYzD,GAAaA,IAE9BsE,GAAgBU,QAAUvB,GAAQ,GACjC,CAACA,GAAUzD,EAAaC,IAE3ByF,WAAU,KACR,IACG7F,IACAX,GACDuE,KACCH,IACDR,GAAUa,SAAW,GACrBO,IACAG,GAAkBW,QAClB,CACA,MAAMW,EAAWzB,GAAQ0B,wBACzB,MAAMC,EAAqBxB,GAAkBW,QAAQY,yBAEjDC,EAAmBC,IAAMH,EAASG,KAAOD,EAAmBE,OAASJ,EAASI,SAChFC,YAAW,KACL9B,IAAWG,GAAkBW,SAC/Bd,GAAQ+B,SAAS,EAAG5B,GAAkBW,QAAQkB,UAChD,GACC,EAEP,IACC,CAACrG,EAAUX,EAAmCuE,GAAUH,GAAoBR,GAAWoB,KAGxFiC,IAACC,eAAc,IACT/E,KACAC,EACJjD,IAAKA,EACLyD,GAAIF,EACJyE,QAASrE,EACTxD,cAAeA,EACf8H,OAAQ1C,GACR2C,UAAWlH,EACXX,QAASA,EACT8H,MAAO3F,IAAW,QAClB4F,QAAS5F,IAAW,UACpB2E,MAAOvC,GACPzD,KAAM,CAACA,EAAM2G,IAACO,YAAkB,CAAeC,GAAIlD,IAAd,YACrC7E,UAAW,IACN0C,KACAC,KACA3C,GAEL6B,QAAS,CACPiB,MAAOL,EAAUM,SAAWlB,EAAQmG,mBAAqBnG,EAAQoG,WACjEC,gBAAiBzF,EAAUM,SAAWlB,EAAQsG,wBAA0BtG,EAAQqG,gBAChFE,qBAAsB3F,EAAUM,SAAWlB,EAAQsG,wBAA0BtG,EAAQuG,qBACrFC,YAAa5F,EAAUM,SAAWlB,EAAQyG,oBAAsBzG,EAAQwG,aAE1EE,QAAUrC,IACJzD,EAAU8F,SAAS9F,EAAU8F,QAAQrC,GAErCzD,EAAUM,WAEdqC,GAASgB,SAASQ,QAEb/B,GAOMS,IAAWY,EAAIC,kBAAkBE,OAASf,GAAQiB,SAASL,EAAIC,UACxE3B,IAAmB,GACnBmB,GAAgBvB,qBAAqBP,GAAwB5C,MAR7DuD,IAAmB,GAEnBsB,GAAc,IACVjG,GACF8F,GAAgB,KAKpB,EAEF6C,cAAgBtC,IACVzD,EAAU+F,eAAe/F,EAAU+F,cAActC,GAErDD,YAAYC,EAAI,EAElBuC,YAAcvC,IACRzD,EAAUgG,aAAahG,EAAUgG,YAAYvC,GAE5CwC,OAAOC,cAAc1C,YAAYC,EAAI,EAE5C0C,QAAU1C,IACJzD,EAAUmG,SAASnG,EAAUmG,QAAQ1C,GAEzC5B,IAAe,GAEXc,GAASgB,SAAWF,EAAIC,SAAWf,GAASgB,SAAWvG,IAAeoB,IAAa4D,IACrFc,GAAgB,GAClB,EAEFkD,OAAS3C,IACHzD,EAAUoG,QAAQpG,EAAUoG,OAAO3C,GAGrCA,EAAII,cAAcC,SAASL,EAAI4C,gBAC9B7I,EAAUuG,gBAAkB3B,IAAYS,IAAWA,GAAQiB,SAASL,EAAI4C,iBAK3ExE,IAAe,GACfqB,GAAgBvB,qBAAqBP,GAAwB5C,IAC7DuD,IAAmB,GAAM,EAE3BuE,MACEC,KAAAC,SAAA,CAAAC,SACGpE,EAAAA,IAAkBjF,GAAekC,EAW9B,KAVFwF,IAACO,WAAiB,CAChB9F,UAAQ,EACRmH,KAAK,OACLtI,UAAU,OACV2B,KAAMA,EACN4G,UAAW,EACXR,QAASA,KACPxD,GAASgB,SAASQ,OAAO,IAI/BW,IAAC8B,UAAS,CACR5J,IAAK2F,GACLkE,KAAK,WACL,gBAAejG,GACf,gBAAewB,GACf,kBAAiBpC,EAAU8G,MAAQnG,OAAea,EAClDkF,KAAK,OACLK,aAAa,MACbC,eAAe,MACfC,YAAY,MACZC,WAAW,QACXnH,KAAMA,EACNnC,UAAWA,EACXQ,UAAWhB,EAAagB,EAAY,OACpCG,UAAWA,EACXc,YAAaA,EACbC,SAAUA,IAAalC,EACvBmC,SAAU8C,GACV/B,SAAUN,EAAUM,SACpB6G,MAAO1F,GACPrC,QAAS,CACPiB,MAAOjB,EAAQiB,MACf+G,cAAehI,EAAQgI,cACvBC,iBAAkBjI,EAAQiI,iBAC1BC,yBAA0BlI,EAAQkI,0BAEpCxB,QAAUrC,IACJrB,IAAYqB,EAAII,cAAc0D,iBAAmB9D,EAAII,cAAc2D,cACrE/D,EAAIgE,iBACN,EAEFC,SAAWjE,IACT,MAAMkE,EAAalE,EAAII,cAAcsD,MAErCjE,GAAgByE,GAChBrE,GAAuBqE,GACvB5F,IAAmB,EAAK,EAE1B6F,UAAYnE,IA4BV,GA3BIoE,aAAaC,MAAMC,SAAStE,EAAIuE,OAClC9E,GAAgBvB,qBAAqBP,GAAwB5C,IAC7DuD,IAAmB,KAGjB8F,aAAaI,MAAMF,SAAStE,EAAIuE,MAAU5F,IAAYqB,EAAII,cAAc0D,iBAAmB,IAC7F9D,EAAIO,iBAEC5B,KACHiB,GAAc,IACVjG,GACF8F,GAAgB,KAIpBnB,IAAoBmG,IAAUA,KAG5BL,aAAaM,IAAIJ,SAAStE,EAAIuE,MAChCjG,IAAmB,GAGjB8F,aAAaO,IAAIL,SAAStE,EAAIuE,MAAQ5F,KACxCqB,EAAIO,iBACJjC,IAAmB,IAGjB8F,aAAaQ,UAAUN,SAAStE,EAAIuE,MAAQ5F,IAAYW,GAAYY,QAGtE,GAFAF,EAAIO,kBAECxF,GAAYwE,GAAkBW,QAAS,CAC1C,MAAM2E,EAAY,IAAIvF,GAAYY,QAAQ8C,UAE1C,MAAM8B,EAAMD,EAAUE,WAAWC,GAASA,EAAK3E,SAASd,GAAkBW,WAE1E,MAAM+E,EAAcJ,EAAUC,EAAM,IAAMD,EAAU,GAEhDI,aAAuBC,aACzBC,oBAAoBF,EAExB,MACEE,oBAAoB7F,GAAYY,SAIpC,GAAIkE,aAAagB,QAAQd,SAAStE,EAAIuE,MAAQ5F,IAAYW,GAAYY,QAGpE,GAFAF,EAAIO,kBAECxF,GAAYwE,GAAkBW,QAAS,CAC1C,MAAM2E,EAAY,IAAIvF,GAAYY,QAAQ8C,UAE1C,MAAM8B,EAAMD,EAAUE,WAAWC,GAASA,EAAK3E,SAASd,GAAkBW,WAE1E,MAAM+E,EAAcJ,EAAUC,EAAM,IAAMD,EAAUA,EAAUhG,OAAS,GAEnEoG,aAAuBC,aACzBC,oBAAoBF,EAExB,MACEI,mBAAmB/F,GAAYY,QAEnC,IAGHvC,GAAuB2H,KAAKC,GAC3BlE,IAAA,QAAA,CAEE4B,KAAK,SACLxJ,KAAMA,EACNiK,MAAO6B,EAAO7B,MACdpH,KAAMA,EACNO,SAAUN,EAAUM,UAAY0I,EAAO1I,UALlC0I,EAAO7B,YAUpB8B,MACE1C,KAAAC,SAAA,CAAAC,SAAA,CACGjI,GAAY4C,GAAuBkB,OAAS,EAC3CwC,IAACoE,KAAI,CACHjM,KAAK,KACLgI,QAAM,EACNkE,OAAK,EACLC,WAAY,GACZ9I,SAAUN,EAAUM,SACpB+I,OAAQrJ,EAAUM,SAAW,mBAAgBkB,EAC7C8H,KAAMlI,GAAuBkB,OAC7BiH,UAAW,CACTC,WAAY,UACZvM,KAAM,MAERmC,QACEY,EAAUM,SACN,CACED,MAAO,mBACPoJ,WAAY,mBACZhE,gBAAiB,oBACjBE,qBAAsB,0BAExBnE,EAENuE,cAAgBtC,IACdA,EAAIO,gBAAgB,EAEtBgC,YAAcvC,IACPwC,OAAOC,cAAczC,EAAIO,gBAAgB,EAEhD0F,mBAAoB,CAClBC,QAAQ,EACR3L,UAAWgC,EAAUM,SACrBwF,QAAUrC,IACRA,EAAIgE,kBAECnI,IACCrB,SAAmBuD,GACrBH,GAA0B,IAGxBxC,GAAgBA,EAAe,IAEnC8D,GAASgB,SAASQ,QAClBjB,GAAgB,IAChBG,GAAc,IACdtB,IAAmB,GACrB,KAIJ,MACFvD,GAAYC,GAAa2C,GAAuBkB,OAAS,EACzDwC,IAAC8E,WAAU,CACTzL,KAAK,QACLlB,KAAK,IACL0M,QAAM,EACNP,WAAY,GACZ9I,SAAUN,EAAUM,SACpBwF,QAAUrC,IACRA,EAAIgE,kBAECnI,IACCrB,SAAmBuD,GACrBH,GAA0B,IAGxBxC,GAAgBA,EAAe,MAEnC8D,GAASgB,SAASQ,QAClBjB,GAAgB,IAChBG,GAAc,IACdtB,IAAmB,GACrB,IAGF,QAGR8H,SACE/E,IAACgF,aAAY,IACPtM,EACJuM,OAAQjH,GACRkH,KAAM5H,GACN6H,kBAAmB1J,EACnB2J,WAAYlM,EACZmM,SAAUnM,EACVoM,kBAAgB,EAChBhL,QAAS,CACPqG,gBAAiBrG,EAAQiL,oBACzBzE,YAAaxG,EAAQkL,iBAEvBC,MAAOvI,GAAYM,SAAW,EAC9B3E,QAASsE,GACT5D,eAAgBA,EAChBC,YAAaA,EACbb,iBAAkB,IACbwC,KACAC,KACAzC,GAEL+M,aAActL,EACduL,UAAWtL,EACXuL,eAAgB,IACXzK,KACAC,KACAxC,GAELkK,UAAYnE,IACNoE,aAAaO,IAAIL,SAAStE,EAAIuE,OAChCvE,EAAIO,iBACJrB,GAASgB,SAASQ,QAClBpC,IAAmB,IAGjB8F,aAAaC,MAAMC,SAAStE,EAAIuE,OAClCrF,GAASgB,SAASQ,QAClBjB,GAAgBvB,qBAAqBP,GAAwB5C,IAC7DuD,IAAmB,IAGjB8F,aAAaM,IAAIJ,SAAStE,EAAIuE,OAChCrF,GAASgB,SAASQ,QAClBpC,IAAmB,IAGjB8F,aAAa8C,UAAU5C,SAAStE,EAAIuE,OAAS1I,IAAad,IAAcA,GAAYC,KAClFR,SAAmBuD,GACrBH,GAA0B,IAGxBxC,GAAgBA,EAAeL,EAAW,GAAK,MAEnD0E,GAAgB,IAChBG,GAAc,IAChB,EACAoD,SAGA3B,IAAC8F,SADFpM,EACU,CACPxB,IAAK+F,GACLtC,GAAIG,GACJiG,KAAK,UACL,kBAAiB7G,EAAU8G,MAAQnG,OAAea,EAClD,wBAAoB,EAAAiF,SAEnBhF,GAAUa,SAAW,EACpBiE,KAAAC,SAAA,CAAAC,SACGnJ,CAAAA,EACCwH,IAAC+F,SAAQ,IACH5K,EACJqJ,KAAMrK,EACNqB,SAAUN,EAAUM,SACpBwK,aAAc,EACdC,UAAU,EACVxB,UAAW,CAAEyB,UAAW,cACxBlF,QAAUrC,IACRA,EAAIgE,iBAAiB,EAEvBwD,QACEnG,IAACoG,cAAa,CACZ/K,MAAOgL,eACPpL,KAAK,OACL7C,KAAMA,EACNkO,QAAS3I,GACT4I,cAAe3I,GACfyC,MAAO3C,SAASC,IAAsBC,KAA6BlD,IAAW,SAC9E4F,QAAS5C,SAASC,IAAsBC,KAA6BlD,IAAW,WAChFkI,SAAUA,KACR,IAAKpI,EAAU,CACb,MAAMgM,EACJ7I,IAAsBC,GAClBtB,GAAuBmK,QAAQvC,GAAWA,EAAO1I,WACjD0B,GAAYuJ,QAAQvC,IAAYA,EAAO1I,WAEzCrC,SAAmBuD,GACrBH,GAA0BiK,GAGxBzM,GAAgBA,EAAeyM,EACrC,OAKN,KACHhO,EAAqBwH,IAAC0G,YAAW,CAAE,GAAI,KACvCxM,EACGkD,GAAkB,GAAG6G,KAAKC,IACxB,MAAMyC,EAAezC,EAAOxJ,QAAUA,EACtC,MAAMkM,EAAoBD,IAAiB,QAC3C,MAAME,EAAsBF,IAAiB,UAE7C,OACEG,cAACf,SAAQ,IACH5K,EACJ+H,IAAKgB,EAAO7B,MACZlC,QAAM,EACNqE,KAAMN,EAAOM,KACbuC,OAAQH,EACRtG,QAASuG,EACTrL,SAAUN,EAAUM,UAAY0I,EAAO1I,SACvCwK,aAAc,EACdC,UAAU,EACVxB,UAAW,CAAEyB,UAAW,cACxBlF,QAAUrC,IACRA,EAAIgE,kBACJ9E,GAASgB,SAASQ,OAAO,EAE3B8G,QACEnG,IAACoG,cAAa,CACZ/K,MAAOgL,eACPpL,KAAK,OACL8G,KAAK,SACL,iBAAa,EACb3J,KAAMA,EACNiK,MAAO6B,EAAO7B,MACdiE,SAAO,EACPjG,MAAOuG,EACPtG,QAASuG,EACTjE,SAAWjE,IACT,IAAKnE,EAAU,CACb,MAAMgM,EAASlK,GAAuBmK,QACnC9C,GAASA,EAAKtB,QAAU1D,EAAII,cAAcsD,QAGzClJ,SAAmBuD,GACrBH,GAA0BiK,GAGxBzM,GAAgBA,EAAeyM,EACrC,MAIN,IAGN,KACHtM,GAAwBkD,GAAkB,GAAGI,OAAS,GAAKJ,GAAkB,GAAGI,OAAS,EACxFwC,IAAC0G,YAAW,CAAA,GACV,KACHxM,EACGkD,GAAkB,GAAG6G,KAAKC,GACxB4C,cAACf,SAAQ,IACH5K,EACJ+H,IAAKgB,EAAO7B,MACZmC,KAAMN,EAAOM,KACbhJ,SAAUN,EAAUM,UAAY0I,EAAO1I,SACvCwK,aAAc,EACdC,UAAU,EACVxB,UAAW,CAAEyB,UAAW,cACxBlF,QAAUrC,IACRA,EAAIgE,kBACJ9E,GAASgB,SAASQ,OAAO,EAE3B8G,QACEnG,IAACoG,cAAa,CACZ/K,MAAOgL,eACPpL,KAAK,OACL8G,KAAK,SACL,iBAAe,EACf3J,KAAMA,EACNiK,MAAO6B,EAAO7B,MACdiE,SAAS,EACT1D,SAAUA,KACR,IAAKpI,EAAU,CACb,MAAMgM,EAAS,IAAIlK,GAAwB4H,GAEvC/K,SAAmBuD,GACrBH,GAA0BiK,GAGxBzM,GAAgBA,EAAeyM,EACrC,SAMV,MACFtM,GACAgD,GAAY+G,KAAKC,IACf,MAAM8C,EAAW1K,GAAuBoH,WAAWC,GAASA,EAAKtB,QAAU6B,EAAO7B,WAAY,EAE9F,MAAMsE,EAAezC,EAAOxJ,QAAUA,EACtC,MAAMkM,EAAoBI,GAAYL,IAAiB,QACvD,MAAME,EAAsBG,GAAYL,IAAiB,UAEzD,OACEG,cAACf,SAAQ,IACH5K,EACJ+H,IAAKgB,EAAO7B,MACZmC,KAAMN,EAAOM,KACbuC,OAAQH,EACRtG,QAASuG,EACTrL,SAAUN,EAAUM,UAAY0I,EAAO1I,SACvC2E,OAAQ6G,EACRhB,aAAc,EACdC,UAAU,EACVxB,UAAW,CAAEyB,UAAW,cACxBlF,QAAUrC,IACRA,EAAIgE,iBAAiB,EAEvBwD,QACEnG,IAACoG,cAAa,CACZ/K,MAAOgL,eACPpL,KAAK,OACL8G,KAAK,SACL,gBAAeiF,EACf5O,KAAMA,EACNiK,MAAO6B,EAAO7B,MACdiE,QAASU,EACT3G,MAAOuG,EACPtG,QAASuG,EACTjE,SAAWjE,IACT,IAAKnE,EAAU,CACb,MAAMgM,EAASQ,EACX1K,GAAuBmK,QAAQ9C,GAASA,EAAKtB,QAAU1D,EAAII,cAAcsD,QACzE,IAAI/F,GAAwB4H,GAE5B/K,SAAmBuD,GACrBH,GAA0BiK,GAGxBzM,GAAgBA,EAAeyM,EACrC,MAIN,OAKVxG,IAAA0B,SAAA,CAAAC,SACGzE,GAAY+G,KAAKC,IAChB,MAAM8C,EAAW1K,GAAuBoH,WAAWC,GAASA,EAAKtB,QAAU6B,EAAO7B,WAAY,EAE9F,MAAMsE,EAAezC,EAAOxJ,QAAUA,EACtC,MAAMkM,EAAoBI,GAAYL,IAAiB,QACvD,MAAME,EAAsBG,GAAYL,IAAiB,UAEzD,OACEG,cAACf,SAAQ,IACH5K,EACJ+H,IAAKgB,EAAO7B,MACZmC,KAAMN,EAAOM,KACbuC,OAAQH,EACRtG,QAASuG,EACTrL,SAAUN,EAAUM,UAAY0I,EAAO1I,SACvC2E,OAAQ6G,EACRhB,aAAc,EACdC,UAAU,EACVxB,UAAW,CAAEyB,UAAW,cACxBlF,QAAUrC,IACRA,EAAIgE,iBAAiB,EAEvBwD,QACEnG,IAACoG,cAAa,CACZ/K,MAAOgL,eACPpL,KAAK,OACL8G,KAAK,SACL,gBAAeiF,EACf5O,KAAMA,EACNiK,MAAO6B,EAAO7B,MACdiE,QAASU,EACT3G,MAAOuG,EACPtG,QAASuG,EACTjE,SAAWjE,IACT,IAAKnE,EAAU,CACb,MAAMgM,EAASQ,EACX1K,GAAuBmK,QAAQ9C,GAASA,EAAKtB,QAAU1D,EAAII,cAAcsD,QACzE,IAAI/F,GAAwB4H,GAE5B/K,SAAmBuD,GACrBH,GAA0BiK,GAGxBzM,GAAgBA,EAAeyM,EACrC,MAIN,OAOH,CACPtO,IAAK+F,GACLtC,GAAIG,GACJiG,KAAK,UACL,kBAAiB7G,EAAU8G,MAAQnG,OAAea,EAAUiF,SAE3DzE,GAAY+G,KAAKC,IAChB,MAAM8C,EAAW1K,GAAuBoH,WAAWC,GAASA,EAAKtB,QAAU6B,EAAO7B,WAAY,EAE9F,OACEyE,cAACf,SAAQ,IACH5K,EACJ4G,KAAK,SACL,gBAAeiF,EACf9O,IAAK8O,EAAW9I,QAAoBxB,EACpCwG,IAAKgB,EAAO7B,MACZmC,KAAMN,EAAOM,KACbrE,OAAQ6G,EACRD,OAAQrJ,QAAQsJ,GAAYtM,IAAW,SACvC4F,QAAS5C,QAAQsJ,GAAYtM,IAAW,WACxCc,SAAUN,EAAUM,UAAY0I,EAAO1I,SACvCwK,aAAc,EACdC,UAAU,EACVxB,UAAW,CAAEyB,UAAW,cACxBlF,QAAUrC,IAGR,GAFAA,EAAIgE,mBAECnI,EAAU,CACb,MAAMgM,EAAS,IAAKtC,GAEhB/K,SAAmBuD,IACrB0B,GAAgBvB,qBAAqB2J,IACrCjK,GAA0BE,0BAA0B+J,KAGlDzM,GAAgBA,EAAeyM,GAEnC3I,GAASgB,SAASQ,QAClBpC,IAAmB,EACrB,IAEF,SAOd,IAGN,CACE5B,MAAO4L,MACPC,YA71BmB"}
1
+ {"version":3,"file":"Dropdown.mjs","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { forwardRef, useState, useRef, useEffect, useLayoutEffect, useMemo, useCallback } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useScrollMonitor } from 'hooks/useScrollMonitor'\nimport { focusFirstFocusable, focusLastFocusable } from 'shared/utils/dom'\nimport { createDebouncedCallback } from 'shared/utils/misc'\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 { useFilteredOptions, useLoadedOptions } from './hooks'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON } from './sizes'\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 * Компонент для выбора одной или нескольких опций из числа доступных.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n forwardRef<HTMLDivElement, MergedProps<DropdownProps>>((props, ref) => {\n const {\n size = 'm',\n name = 'fox-dropdown',\n labelPosition = 'dynamic',\n searchable = true,\n primary = true,\n optionsMultiToggle = true,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n loading,\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 onChangeInput,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n loadOptions,\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 label,\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 [filteredOptions, getFilteredOptions] = useFilteredOptions({\n options,\n })\n\n const [loadedOptions, optionsLoading, getLoadedOptions] = useLoadedOptions({\n loadOptions,\n options,\n })\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 [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n const menuOptions: DropdownOption[] = loadOptions ? loadedOptions : filteredOptions\n const menuOptionsLoading = loadOptions ? (loading ?? optionsLoading) : loading\n\n const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = useMemo(\n () => (multiple ? groupDropdownOptions(menuOptions, dropdownSelectedOption) : [[], []]),\n [multiple, menuOptions, dropdownSelectedOption]\n )\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n\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 const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n const updateInputText = useCallback(\n (inputTextValue: string) => {\n setInputText(inputTextValue)\n\n if (onChangeInput) {\n onChangeInput(inputTextValue)\n }\n },\n [onChangeInput]\n )\n\n const updateOptions = useCallback(\n (inputTextValue: string) => {\n if (loadOptions) {\n getLoadedOptions(inputTextValue)\n } else {\n getFilteredOptions(inputTextValue)\n }\n },\n [loadOptions, getLoadedOptions, getFilteredOptions]\n )\n\n const updateOptionsDebounced = useMemo(() => {\n return createDebouncedCallback(updateOptions, 150)\n }, [updateOptions])\n\n const preventBlur = (evt: React.PointerEvent<HTMLDivElement> | React.MouseEvent<HTMLDivElement, MouseEvent>) => {\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\n useScrollMonitor({\n target: scrollMonitorTarget,\n onScrollStart: () => {\n if (closeMenuOnScroll && menuOpen) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n },\n })\n\n useLayoutEffect(() => {\n if (selectedOption === undefined) return\n\n if (!multiple && !menuOpen) {\n updateInputText(getDropdownInputText(selectedOption))\n }\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption, menuOpen, updateInputText])\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 (\n !multiple &&\n !disableAutoScrollToSelectedOption &&\n menuOpen &&\n !menuOptionsLoading &&\n inputText.length === 0 &&\n menuRef &&\n selectedOptionRef.current\n ) {\n const menuRect = menuRef.getBoundingClientRect()\n const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n setTimeout(() => {\n if (menuRef && selectedOptionRef.current) {\n menuRef.scrollTo(0, selectedOptionRef.current.offsetTop)\n }\n }, 0)\n }\n }\n }, [multiple, disableAutoScrollToSelectedOption, menuOpen, menuOptionsLoading, inputText, menuRef])\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n id={formInputLabelId}\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 updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n } else if (menuRef && evt.target instanceof Node && !menuRef.contains(evt.target)) {\n setMenuOpenRequest(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n preventBlur(evt)\n }}\n onMouseDown={(evt) => {\n if (rootProps.onMouseDown) rootProps.onMouseDown(evt)\n\n if (!window.PointerEvent) preventBlur(evt)\n }}\n onFocus={(evt) => {\n if (rootProps.onFocus) rootProps.onFocus(evt)\n\n setFocusWithin(true)\n\n if (inputRef.current && evt.target === inputRef.current && searchable && !multiple && !menuOpen) {\n updateInputText('')\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 updateInputText(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 ) : null}\n <FormInput\n {...sizeProps}\n ref={inputRef}\n role='combobox'\n aria-controls={menuListId}\n aria-expanded={menuOpen}\n type='text'\n autoComplete='off'\n autoCapitalize='off'\n autoCorrect='off'\n spellCheck='false'\n active={inputActive}\n label={label}\n labelId={inputLabelId}\n labelPosition={labelPosition}\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 const inputValue = evt.currentTarget.value\n\n updateInputText(inputValue)\n updateOptionsDebounced(inputValue)\n setMenuOpenRequest(true)\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n updateInputText(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 (!menuOpen) {\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\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((option) => (\n <input\n key={option.value}\n type='hidden'\n name={name}\n value={option.value}\n form={form}\n disabled={rootProps.disabled || option.disabled}\n />\n ))}\n </>\n }\n addon={\n <>\n {multiple && dropdownSelectedOption.length > 0 ? (\n <Chip\n size='xs'\n active\n black\n marginLeft='var(--gap, 12px)'\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 onMouseDown={(evt) => {\n if (!window.PointerEvent) evt.preventDefault()\n }}\n discardButtonProps={{\n square: true,\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([])\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n ) : null}\n {!multiple && clearable && dropdownSelectedOption.length > 0 ? (\n <IconButton\n icon='close'\n size='l'\n square\n marginLeft='var(--gap, 12px)'\n disabled={rootProps.disabled}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(null)\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n }}\n />\n ) : null}\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={menuOptions.length === 0}\n loading={menuOptionsLoading}\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 updateInputText(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 updateInputText('')\n updateOptions('')\n }\n }}\n >\n {multiple ? (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={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={Boolean((multiToggleChecked || multiToggleIndeterminate) && status === 'error')}\n success={Boolean((multiToggleChecked || multiToggleIndeterminate) && status === 'success')}\n onChange={() => {\n if (!readOnly) {\n const update =\n multiToggleChecked || multiToggleIndeterminate\n ? dropdownSelectedOption.filter((option) => option.disabled)\n : menuOptions.filter((option) => !option.disabled)\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ) : null}\n {optionsMultiToggle ? <MenuDivider /> : null}\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 || option.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 : null}\n {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 ? (\n <MenuDivider />\n ) : null}\n {groupSelectedOptions\n ? menuOptionsGroups[1].map((option) => (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n disabled={rootProps.disabled || option.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 : null}\n {!groupSelectedOptions &&\n menuOptions.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 || option.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 {menuOptions.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 || option.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={label ? inputLabelId : undefined}\n >\n {menuOptions.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={Boolean(selected && status === 'error')}\n success={Boolean(selected && status === 'success')}\n disabled={rootProps.disabled || option.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 updateInputText(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","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","loading","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","scrollMonitorTarget","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","clearable","onChangeInput","onCloseMenu","onOpenMenu","onSelectOption","options","loadOptions","groupSelectedOptions","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","label","rootProps","sizeProps","iconBaseProps","sizes","SIZES_ICON","color","disabled","formInputLabelId","useMemo","id","nanoid","inputLabelId","menuListId","filteredOptions","getFilteredOptions","useFilteredOptions","loadedOptions","optionsLoading","getLoadedOptions","useLoadedOptions","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","focusWithin","setFocusWithin","menuOpenRequest","setMenuOpenRequest","menuOptions","menuOptionsLoading","menuOptionsGroups","groupDropdownOptions","menuOpen","inputRequired","length","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","setMenuRef","menuListRef","selectedOptionRef","menuOpenPrevRef","updateInputText","useCallback","inputTextValue","updateOptions","updateOptionsDebounced","createDebouncedCallback","preventBlur","evt","target","current","Node","currentTarget","contains","renderInPortal","preventDefault","useScrollMonitor","onScrollStart","focus","useLayoutEffect","useEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","setTimeout","scrollTo","offsetTop","_jsx","FormInputLabel","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","onPointerDown","onMouseDown","window","PointerEvent","onFocus","onBlur","relatedTarget","input","_jsxs","_Fragment","children","type","tabIndex","FormInput","role","autoComplete","autoCapitalize","autoCorrect","spellCheck","active","labelId","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","inputValue","onKeyDown","keyboardKeys","Enter","validate","key","Space","prev","Esc","Tab","ArrowDown","menuItems","idx","findIndex","item","focusTarget","HTMLElement","focusFirstFocusable","ArrowUp","focusLastFocusable","map","option","addon","Chip","black","marginLeft","cursor","text","textProps","appearance","colorHover","discardButtonProps","square","IconButton","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","filter","MenuDivider","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","selected","SIZES","displayName"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- 'use strict';var constants=require('../FormInputLabel/constants.js');var constants$1=require('../InputCheckbox/constants.js');const SIZES_CHECKBOX={l:constants$1.SIZES.m,m:constants$1.SIZES.s,s:constants$1.SIZES.xs};exports.SIZES={l:constants.SIZES.l,m:constants.SIZES.m,s:constants.SIZES.s},exports.SIZES_CHECKBOX=SIZES_CHECKBOX,exports.SIZES_ICON={l:{fontSize:24},m:{fontSize:24},s:{fontSize:20}},exports.SIZES_MENU={l:{width:560,minWidth:'auto',maxWidth:'none'},m:{width:480,minWidth:'auto',maxWidth:'none'},s:{width:280,minWidth:'auto',maxWidth:'none'},fluid:{width:'100%',minWidth:'auto',maxWidth:'none'}};
1
+ 'use strict';var sizes=require('../FormInputLabel/sizes.js');var constants=require('../InputCheckbox/constants.js');const SIZES_CHECKBOX={l:constants.SIZES.m,m:constants.SIZES.s,s:constants.SIZES.xs,xs:constants.SIZES.xs};exports.SIZES={l:sizes.SIZES.l,m:sizes.SIZES.m,s:sizes.SIZES.s,xs:sizes.SIZES.xs},exports.SIZES_CHECKBOX=SIZES_CHECKBOX,exports.SIZES_ICON={l:{fontSize:24},m:{fontSize:24},s:{fontSize:20},xs:{fontSize:18}},exports.SIZES_MENU={l:{width:560,minWidth:'auto',maxWidth:'none'},m:{width:480,minWidth:'auto',maxWidth:'none'},s:{width:280,minWidth:'auto',maxWidth:'none'},fluid:{width:'100%',minWidth:'auto',maxWidth:'none'}};
2
2
  //# sourceMappingURL=sizes.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"sizes.js","sources":["../../../../src/components/Dropdown/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_FORM_INPUT_LABEL } from 'components/FormInputLabel'\nimport { SIZES as SIZES_INPUT_CHECKBOX } from 'components/InputCheckbox'\nimport type { MenuComponentSize } from 'components/MenuComponent'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n l: SIZES_FORM_INPUT_LABEL.l,\n m: SIZES_FORM_INPUT_LABEL.m,\n s: SIZES_FORM_INPUT_LABEL.s,\n}\n\nexport const SIZES_CHECKBOX: Record<Size, CSSProperties> = {\n l: SIZES_INPUT_CHECKBOX.m,\n m: SIZES_INPUT_CHECKBOX.s,\n s: SIZES_INPUT_CHECKBOX.xs,\n}\n\nexport const SIZES_MENU: Record<MenuComponentSize, CSSProperties> = {\n l: {\n width: 560,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n m: {\n width: 480,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n s: {\n width: 280,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n fluid: {\n width: '100%',\n minWidth: 'auto',\n maxWidth: 'none',\n },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n l: { fontSize: 24 },\n m: { fontSize: 24 },\n s: { fontSize: 20 },\n}\n"],"names":["SIZES_CHECKBOX","l","SIZES_INPUT_CHECKBOX","SIZES","m","s","xs","SIZES_FORM_INPUT_LABEL","fontSize","width","minWidth","maxWidth","fluid"],"mappings":"8HAYO,MAAMA,eAA8C,CACzDC,EAAGC,YAAoBC,MAACC,EACxBA,EAAGF,YAAoBC,MAACE,EACxBA,EAAGH,YAAoBC,MAACG,kBATwB,CAChDL,EAAGM,UAAsBJ,MAACF,EAC1BG,EAAGG,UAAsBJ,MAACC,EAC1BC,EAAGE,UAAsBJ,MAACE,4DAgC2B,CACrDJ,EAAG,CAAEO,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,wBA1BmD,CAClEP,EAAG,CACDQ,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZP,EAAG,CACDK,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZN,EAAG,CACDI,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZC,MAAO,CACLH,MAAO,OACPC,SAAU,OACVC,SAAU"}
1
+ {"version":3,"file":"sizes.js","sources":["../../../../src/components/Dropdown/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_FORM_INPUT_LABEL } from 'components/FormInputLabel'\nimport { SIZES as SIZES_INPUT_CHECKBOX } from 'components/InputCheckbox'\nimport type { MenuComponentSize } from 'components/MenuComponent'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n l: SIZES_FORM_INPUT_LABEL.l,\n m: SIZES_FORM_INPUT_LABEL.m,\n s: SIZES_FORM_INPUT_LABEL.s,\n xs: SIZES_FORM_INPUT_LABEL.xs,\n}\n\nexport const SIZES_CHECKBOX: Record<Size, CSSProperties> = {\n l: SIZES_INPUT_CHECKBOX.m,\n m: SIZES_INPUT_CHECKBOX.s,\n s: SIZES_INPUT_CHECKBOX.xs,\n xs: SIZES_INPUT_CHECKBOX.xs,\n}\n\nexport const SIZES_MENU: Record<MenuComponentSize, CSSProperties> = {\n l: {\n width: 560,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n m: {\n width: 480,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n s: {\n width: 280,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n fluid: {\n width: '100%',\n minWidth: 'auto',\n maxWidth: 'none',\n },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n l: { fontSize: 24 },\n m: { fontSize: 24 },\n s: { fontSize: 20 },\n xs: { fontSize: 18 },\n}\n"],"names":["SIZES_CHECKBOX","l","SIZES_INPUT_CHECKBOX","SIZES","m","s","xs","SIZES_FORM_INPUT_LABEL","fontSize","width","minWidth","maxWidth","fluid"],"mappings":"oHAaO,MAAMA,eAA8C,CACzDC,EAAGC,UAAoBC,MAACC,EACxBA,EAAGF,UAAoBC,MAACE,EACxBA,EAAGH,UAAoBC,MAACG,GACxBA,GAAIJ,UAAoBC,MAACG,kBAXuB,CAChDL,EAAGM,MAAsBJ,MAACF,EAC1BG,EAAGG,MAAsBJ,MAACC,EAC1BC,EAAGE,MAAsBJ,MAACE,EAC1BC,GAAIC,MAAsBJ,MAACG,6DAiC0B,CACrDL,EAAG,CAAEO,SAAU,IACfJ,EAAG,CAAEI,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,GAAI,CAAEE,SAAU,wBA3BkD,CAClEP,EAAG,CACDQ,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZP,EAAG,CACDK,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZN,EAAG,CACDI,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZC,MAAO,CACLH,MAAO,OACPC,SAAU,OACVC,SAAU"}
@@ -1,2 +1,2 @@
1
- import{SIZES as SIZES$1}from'../FormInputLabel/constants.mjs';import{SIZES as SIZES$2}from'../InputCheckbox/constants.mjs';const SIZES={l:SIZES$1.l,m:SIZES$1.m,s:SIZES$1.s};const SIZES_CHECKBOX={l:SIZES$2.m,m:SIZES$2.s,s:SIZES$2.xs};const SIZES_MENU={l:{width:560,minWidth:'auto',maxWidth:'none'},m:{width:480,minWidth:'auto',maxWidth:'none'},s:{width:280,minWidth:'auto',maxWidth:'none'},fluid:{width:'100%',minWidth:'auto',maxWidth:'none'}};const SIZES_ICON={l:{fontSize:24},m:{fontSize:24},s:{fontSize:20}};export{SIZES,SIZES_CHECKBOX,SIZES_ICON,SIZES_MENU};
1
+ import{SIZES as SIZES$1}from'../FormInputLabel/sizes.mjs';import{SIZES as SIZES$2}from'../InputCheckbox/constants.mjs';const SIZES={l:SIZES$1.l,m:SIZES$1.m,s:SIZES$1.s,xs:SIZES$1.xs};const SIZES_CHECKBOX={l:SIZES$2.m,m:SIZES$2.s,s:SIZES$2.xs,xs:SIZES$2.xs};const SIZES_MENU={l:{width:560,minWidth:'auto',maxWidth:'none'},m:{width:480,minWidth:'auto',maxWidth:'none'},s:{width:280,minWidth:'auto',maxWidth:'none'},fluid:{width:'100%',minWidth:'auto',maxWidth:'none'}};const SIZES_ICON={l:{fontSize:24},m:{fontSize:24},s:{fontSize:20},xs:{fontSize:18}};export{SIZES,SIZES_CHECKBOX,SIZES_ICON,SIZES_MENU};
2
2
  //# sourceMappingURL=sizes.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"sizes.mjs","sources":["../../../../src/components/Dropdown/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_FORM_INPUT_LABEL } from 'components/FormInputLabel'\nimport { SIZES as SIZES_INPUT_CHECKBOX } from 'components/InputCheckbox'\nimport type { MenuComponentSize } from 'components/MenuComponent'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n l: SIZES_FORM_INPUT_LABEL.l,\n m: SIZES_FORM_INPUT_LABEL.m,\n s: SIZES_FORM_INPUT_LABEL.s,\n}\n\nexport const SIZES_CHECKBOX: Record<Size, CSSProperties> = {\n l: SIZES_INPUT_CHECKBOX.m,\n m: SIZES_INPUT_CHECKBOX.s,\n s: SIZES_INPUT_CHECKBOX.xs,\n}\n\nexport const SIZES_MENU: Record<MenuComponentSize, CSSProperties> = {\n l: {\n width: 560,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n m: {\n width: 480,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n s: {\n width: 280,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n fluid: {\n width: '100%',\n minWidth: 'auto',\n maxWidth: 'none',\n },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n l: { fontSize: 24 },\n m: { fontSize: 24 },\n s: { fontSize: 20 },\n}\n"],"names":["SIZES","l","SIZES_FORM_INPUT_LABEL","m","s","SIZES_CHECKBOX","SIZES_INPUT_CHECKBOX","xs","SIZES_MENU","width","minWidth","maxWidth","fluid","SIZES_ICON","fontSize"],"mappings":"2HAMO,MAAMA,MAAqC,CAChDC,EAAGC,QAAuBD,EAC1BE,EAAGD,QAAuBC,EAC1BC,EAAGF,QAAuBE,GAGrB,MAAMC,eAA8C,CACzDJ,EAAGK,QAAqBH,EACxBA,EAAGG,QAAqBF,EACxBA,EAAGE,QAAqBC,IAGnB,MAAMC,WAAuD,CAClEP,EAAG,CACDQ,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZR,EAAG,CACDM,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZP,EAAG,CACDK,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZC,MAAO,CACLH,MAAO,OACPC,SAAU,OACVC,SAAU,SAIP,MAAME,WAA0C,CACrDZ,EAAG,CAAEa,SAAU,IACfX,EAAG,CAAEW,SAAU,IACfV,EAAG,CAAEU,SAAU"}
1
+ {"version":3,"file":"sizes.mjs","sources":["../../../../src/components/Dropdown/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_FORM_INPUT_LABEL } from 'components/FormInputLabel'\nimport { SIZES as SIZES_INPUT_CHECKBOX } from 'components/InputCheckbox'\nimport type { MenuComponentSize } from 'components/MenuComponent'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n l: SIZES_FORM_INPUT_LABEL.l,\n m: SIZES_FORM_INPUT_LABEL.m,\n s: SIZES_FORM_INPUT_LABEL.s,\n xs: SIZES_FORM_INPUT_LABEL.xs,\n}\n\nexport const SIZES_CHECKBOX: Record<Size, CSSProperties> = {\n l: SIZES_INPUT_CHECKBOX.m,\n m: SIZES_INPUT_CHECKBOX.s,\n s: SIZES_INPUT_CHECKBOX.xs,\n xs: SIZES_INPUT_CHECKBOX.xs,\n}\n\nexport const SIZES_MENU: Record<MenuComponentSize, CSSProperties> = {\n l: {\n width: 560,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n m: {\n width: 480,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n s: {\n width: 280,\n minWidth: 'auto',\n maxWidth: 'none',\n },\n fluid: {\n width: '100%',\n minWidth: 'auto',\n maxWidth: 'none',\n },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n l: { fontSize: 24 },\n m: { fontSize: 24 },\n s: { fontSize: 20 },\n xs: { fontSize: 18 },\n}\n"],"names":["SIZES","l","SIZES_FORM_INPUT_LABEL","m","s","xs","SIZES_CHECKBOX","SIZES_INPUT_CHECKBOX","SIZES_MENU","width","minWidth","maxWidth","fluid","SIZES_ICON","fontSize"],"mappings":"uHAMO,MAAMA,MAAqC,CAChDC,EAAGC,QAAuBD,EAC1BE,EAAGD,QAAuBC,EAC1BC,EAAGF,QAAuBE,EAC1BC,GAAIH,QAAuBG,IAGtB,MAAMC,eAA8C,CACzDL,EAAGM,QAAqBJ,EACxBA,EAAGI,QAAqBH,EACxBA,EAAGG,QAAqBF,GACxBA,GAAIE,QAAqBF,IAGpB,MAAMG,WAAuD,CAClEP,EAAG,CACDQ,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZR,EAAG,CACDM,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZP,EAAG,CACDK,MAAO,IACPC,SAAU,OACVC,SAAU,QAEZC,MAAO,CACLH,MAAO,OACPC,SAAU,OACVC,SAAU,SAIP,MAAME,WAA0C,CACrDZ,EAAG,CAAEa,SAAU,IACfX,EAAG,CAAEW,SAAU,IACfV,EAAG,CAAEU,SAAU,IACfT,GAAI,CAAES,SAAU"}
@@ -1,2 +1,2 @@
1
- 'use strict';var React=require('react');var useMergedPalette=require('../../hooks/useMergedPalette.js');var useResizeObserver=require('../../hooks/useResizeObserver.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');exports.FormInput=React.forwardRef(((e,t)=>{const{mask:r="",...s}=e;const u=React.useRef(null);React.useImperativeHandle(t,(()=>u.current),[]);const a=useMergedPalette.useMergedPalette(s);const[n,i]=React.useState(!1);const c=React.useCallback((e=>{i(e.scrollWidth>e.clientWidth)}),[]);return useResizeObserver.useResizeObserver({target:u,onResize:c}),jsxRuntime.jsx(style.Root,{"data-input-control":!0,fading:n,children:jsxRuntime.jsx(style.Input,{...s,mask:r,palette:a,onBlur:e=>{s.onBlur&&s.onBlur(e),c(e.currentTarget)},inputRef:e=>{u.current=e}})})}));
1
+ 'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var useResizeObserver=require('../../hooks/useResizeObserver.js');var sizes=require('./sizes.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var InputLabel=require('../InputLabel/InputLabel.js');const FormInput=withMergedProps.withMergedProps(React.forwardRef(((e,s)=>{const{size:r="m",mask:i="",labelPosition:t="dynamic",sizeXXS:a,sizeXS:n,sizeS:u,sizeM:l,sizeL:o,sizeXL:c,sizes:z,active:b,label:d,labelId:p,...R}=e;const v={size:r,sizeXXS:a,sizeXS:n,sizeS:u,sizeM:l,sizeL:o,sizeXL:c,sizes:z};const m=React.useRef(null);React.useImperativeHandle(s,(()=>m.current),[]);const[I,j]=React.useState(!1);const h=React.useCallback((e=>{j(e.scrollWidth>e.clientWidth)}),[]);return useResizeObserver.useResizeObserver({target:m,onResize:h}),jsxRuntime.jsx(InputLabel.InputLabel,{...v,active:b,label:d,labelId:p,labelPosition:t,children:jsxRuntime.jsx(style.Fading,{visible:I,"data-input-fading":!0,children:jsxRuntime.jsx(style.Input,{...R,"aria-labelledby":d?p:void 0,mask:i,onBlur:e=>{R.onBlur&&R.onBlur(e),h(e.currentTarget)},inputRef:e=>{m.current=e}})})})})),{displayName:'FormInput',sizes:sizes.SIZES});exports.FormInput=FormInput;
2
2
  //# sourceMappingURL=FormInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FormInput.js","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useState, useCallback } from 'react'\nimport { useMergedPalette } from 'hooks/useMergedPalette'\nimport { useResizeObserver } from 'hooks/useResizeObserver'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = forwardRef<HTMLInputElement, FormInputProps>(\n (props, forwardedRef) => {\n const { mask = '', ...inputProps } = props\n\n const inputRef = useRef<HTMLInputElement | null>(null)\n useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardedRef, () => inputRef.current, [])\n\n const palette = useMergedPalette(inputProps)\n\n const [overflow, setOverflow] = useState<boolean>(false)\n\n const handleDetectOverflow = useCallback((e: HTMLInputElement) => {\n setOverflow(e.scrollWidth > e.clientWidth)\n }, [])\n\n useResizeObserver({\n target: inputRef,\n onResize: handleDetectOverflow,\n })\n\n return (\n <Styled.Root data-input-control fading={overflow}>\n <Styled.Input\n {...inputProps}\n mask={mask}\n palette={palette}\n onBlur={(evt) => {\n if (inputProps.onBlur) inputProps.onBlur(evt)\n\n handleDetectOverflow(evt.currentTarget)\n }}\n inputRef={(input) => {\n inputRef.current = input\n }}\n />\n </Styled.Root>\n )\n }\n)\n\nexport { FormInput }\n"],"names":["forwardRef","props","forwardedRef","mask","inputProps","inputRef","useRef","useImperativeHandle","current","palette","useMergedPalette","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useResizeObserver","target","onResize","_jsx","Styled","fading","children","jsx","onBlur","evt","currentTarget","input"],"mappings":"wQAMmEA,MAAUA,YAC3E,CAACC,EAAOC,KACN,MAAMC,KAAEA,EAAO,MAAOC,GAAeH,EAErC,MAAMI,EAAWC,aAAgC,MACjDC,MAAAA,oBAAsEL,GAAc,IAAMG,EAASG,SAAS,IAE5G,MAAMC,EAAUC,kCAAiBN,GAEjC,MAAOO,EAAUC,GAAeC,MAAQA,UAAU,GAElD,MAAMC,EAAuBC,MAAWA,aAAEC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAOH,OALAC,oCAAkB,CAChBC,OAAQf,EACRgB,SAAUP,IAIVQ,WAAAA,IAACC,MAAAA,KAAW,CAAC,sBAAkB,EAACC,OAAQb,EAASc,SAC/CH,WAAAI,IAACH,YAAY,IACPnB,EACJD,KAAMA,EACNM,QAASA,EACTkB,OAASC,IACHxB,EAAWuB,QAAQvB,EAAWuB,OAAOC,GAEzCd,EAAqBc,EAAIC,cAAc,EAEzCxB,SAAWyB,IACTzB,EAASG,QAAUsB,CAAK,KAGhB"}
1
+ {"version":3,"file":"FormInput.js","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useState, useCallback } from 'react'\nimport { InputLabel } from 'components/InputLabel'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { useResizeObserver } from 'hooks/useResizeObserver'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './sizes'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst COMPONENT_NAME = 'FormInput'\n\n/**\n *\n * Компонент для приема однострочного ввода.\n *\n * Поддерживается маска ввода и анимация текстового лейбла.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<input\\> элемента.\n */\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = withMergedProps<FormInputProps, HTMLInputElement>(\n forwardRef<HTMLInputElement, MergedProps<FormInputProps>>((props, forwardedRef) => {\n const {\n size = 'm',\n mask = '',\n labelPosition = 'dynamic',\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n sizes,\n active,\n label,\n labelId,\n ...inputProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n sizes,\n }\n\n const inputRef = useRef<HTMLInputElement | null>(null)\n useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardedRef, () => inputRef.current, [])\n\n const [overflow, setOverflow] = useState<boolean>(false)\n\n const handleDetectOverflow = useCallback((e: HTMLInputElement) => {\n setOverflow(e.scrollWidth > e.clientWidth)\n }, [])\n\n useResizeObserver({\n target: inputRef,\n onResize: handleDetectOverflow,\n })\n\n return (\n <InputLabel {...sizeProps} active={active} label={label} labelId={labelId} labelPosition={labelPosition}>\n <Styled.Fading visible={overflow} data-input-fading>\n <Styled.Input\n {...inputProps}\n aria-labelledby={label ? labelId : undefined}\n mask={mask}\n onBlur={(evt) => {\n if (inputProps.onBlur) inputProps.onBlur(evt)\n\n handleDetectOverflow(evt.currentTarget)\n }}\n inputRef={(input) => {\n inputRef.current = input\n }}\n />\n </Styled.Fading>\n </InputLabel>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { FormInput }\n"],"names":["FormInput","withMergedProps","forwardRef","props","forwardedRef","size","mask","labelPosition","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizes","active","label","labelId","inputProps","sizeProps","inputRef","useRef","useImperativeHandle","current","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useResizeObserver","target","onResize","_jsx","InputLabel","children","jsx","Styled","visible","undefined","onBlur","evt","currentTarget","input","displayName","SIZES"],"mappings":"yUAmBMA,MAAAA,UAA6DC,gBAAAA,gBACjEC,MAAAA,YAA0D,CAACC,EAAOC,KAChE,MAAMC,KACJA,EAAO,IAAGC,KACVA,EAAO,GAAEC,cACTA,EAAgB,UAASC,QACzBA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,MACNA,EAAKC,OACLA,EAAMC,MACNA,EAAKC,QACLA,KACGC,GACDf,EAEJ,MAAMgB,EAAY,CAChBd,OACAG,UACAC,SACAC,QACAC,QACAC,QACAC,SACAC,SAGF,MAAMM,EAAWC,aAAgC,MACjDC,MAAAA,oBAAsElB,GAAc,IAAMgB,EAASG,SAAS,IAE5G,MAAOC,EAAUC,GAAeC,MAAQA,UAAU,GAElD,MAAMC,EAAuBC,MAAWA,aAAEC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAOH,OALAC,oCAAkB,CAChBC,OAAQb,EACRc,SAAUP,IAIVQ,WAAAA,IAACC,WAAAA,WAAU,IAAKjB,EAAWJ,OAAQA,EAAQC,MAAOA,EAAOC,QAASA,EAASV,cAAeA,EAAc8B,SACtGF,WAAAG,IAACC,aAAa,CAACC,QAAShB,EAAU,qBAAiB,EAAAa,SACjDF,WAAAG,IAACC,YAAY,IACPrB,EACJ,kBAAiBF,EAAQC,OAAUwB,EACnCnC,KAAMA,EACNoC,OAASC,IACHzB,EAAWwB,QAAQxB,EAAWwB,OAAOC,GAEzChB,EAAqBgB,EAAIC,cAAc,EAEzCxB,SAAWyB,IACTzB,EAASG,QAAUsB,CAAK,OAInB,IAGjB,CACEC,YA3EmB,YA4EnBhC,MAAOiC,MAAAA"}
@@ -1,2 +1,2 @@
1
- import{forwardRef,useRef,useImperativeHandle,useState,useCallback}from'react';import{useMergedPalette}from'../../hooks/useMergedPalette.mjs';import{useResizeObserver}from'../../hooks/useResizeObserver.mjs';import{Root,Input}from'./style.mjs';import{jsx}from'react/jsx-runtime';const FormInput=forwardRef(((e,t)=>{const{mask:r="",...s}=e;const o=useRef(null);useImperativeHandle(t,(()=>o.current),[]);const u=useMergedPalette(s);const[n,a]=useState(!1);const l=useCallback((e=>{a(e.scrollWidth>e.clientWidth)}),[]);return useResizeObserver({target:o,onResize:l}),jsx(Root,{"data-input-control":!0,fading:n,children:jsx(Input,{...s,mask:r,palette:u,onBlur:e=>{s.onBlur&&s.onBlur(e),l(e.currentTarget)},inputRef:e=>{o.current=e}})})}));export{FormInput};
1
+ import{forwardRef,useRef,useImperativeHandle,useState,useCallback}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useResizeObserver}from'../../hooks/useResizeObserver.mjs';import{SIZES}from'./sizes.mjs';import{Fading,Input}from'./style.mjs';import{jsx}from'react/jsx-runtime';import{InputLabel}from'../InputLabel/InputLabel.mjs';const FormInput=withMergedProps(forwardRef(((e,s)=>{const{size:i="m",mask:r="",labelPosition:t="dynamic",sizeXXS:o,sizeXS:a,sizeS:l,sizeM:n,sizeL:u,sizeXL:m,sizes:p,active:z,label:c,labelId:d,...b}=e;const f={size:i,sizeXXS:o,sizeXS:a,sizeS:l,sizeM:n,sizeL:u,sizeXL:m,sizes:p};const I=useRef(null);useImperativeHandle(s,(()=>I.current),[]);const[S,j]=useState(!1);const h=useCallback((e=>{j(e.scrollWidth>e.clientWidth)}),[]);return useResizeObserver({target:I,onResize:h}),jsx(InputLabel,{...f,active:z,label:c,labelId:d,labelPosition:t,children:jsx(Fading,{visible:S,"data-input-fading":!0,children:jsx(Input,{...b,"aria-labelledby":c?d:void 0,mask:r,onBlur:e=>{b.onBlur&&b.onBlur(e),h(e.currentTarget)},inputRef:e=>{I.current=e}})})})})),{displayName:'FormInput',sizes:SIZES});export{FormInput};
2
2
  //# sourceMappingURL=FormInput.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"FormInput.mjs","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useState, useCallback } from 'react'\nimport { useMergedPalette } from 'hooks/useMergedPalette'\nimport { useResizeObserver } from 'hooks/useResizeObserver'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = forwardRef<HTMLInputElement, FormInputProps>(\n (props, forwardedRef) => {\n const { mask = '', ...inputProps } = props\n\n const inputRef = useRef<HTMLInputElement | null>(null)\n useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardedRef, () => inputRef.current, [])\n\n const palette = useMergedPalette(inputProps)\n\n const [overflow, setOverflow] = useState<boolean>(false)\n\n const handleDetectOverflow = useCallback((e: HTMLInputElement) => {\n setOverflow(e.scrollWidth > e.clientWidth)\n }, [])\n\n useResizeObserver({\n target: inputRef,\n onResize: handleDetectOverflow,\n })\n\n return (\n <Styled.Root data-input-control fading={overflow}>\n <Styled.Input\n {...inputProps}\n mask={mask}\n palette={palette}\n onBlur={(evt) => {\n if (inputProps.onBlur) inputProps.onBlur(evt)\n\n handleDetectOverflow(evt.currentTarget)\n }}\n inputRef={(input) => {\n inputRef.current = input\n }}\n />\n </Styled.Root>\n )\n }\n)\n\nexport { FormInput }\n"],"names":["FormInput","forwardRef","props","forwardedRef","mask","inputProps","inputRef","useRef","useImperativeHandle","current","palette","useMergedPalette","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useResizeObserver","target","onResize","_jsx","Styled","fading","children","onBlur","evt","currentTarget","input"],"mappings":"qRAMMA,MAAAA,UAA6DC,YACjE,CAACC,EAAOC,KACN,MAAMC,KAAEA,EAAO,MAAOC,GAAeH,EAErC,MAAMI,EAAWC,OAAgC,MACjDC,oBAAsEL,GAAc,IAAMG,EAASG,SAAS,IAE5G,MAAMC,EAAUC,iBAAiBN,GAEjC,MAAOO,EAAUC,GAAeC,UAAkB,GAElD,MAAMC,EAAuBC,aAAaC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAOH,OALAC,kBAAkB,CAChBC,OAAQf,EACRgB,SAAUP,IAIVQ,IAACC,KAAW,CAAC,sBAAkB,EAACC,OAAQb,EAASc,SAC/CH,IAACC,MAAY,IACPnB,EACJD,KAAMA,EACNM,QAASA,EACTiB,OAASC,IACHvB,EAAWsB,QAAQtB,EAAWsB,OAAOC,GAEzCb,EAAqBa,EAAIC,cAAc,EAEzCvB,SAAWwB,IACTxB,EAASG,QAAUqB,CAAK,KAGhB"}
1
+ {"version":3,"file":"FormInput.mjs","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useState, useCallback } from 'react'\nimport { InputLabel } from 'components/InputLabel'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { useResizeObserver } from 'hooks/useResizeObserver'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './sizes'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst COMPONENT_NAME = 'FormInput'\n\n/**\n *\n * Компонент для приема однострочного ввода.\n *\n * Поддерживается маска ввода и анимация текстового лейбла.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<input\\> элемента.\n */\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = withMergedProps<FormInputProps, HTMLInputElement>(\n forwardRef<HTMLInputElement, MergedProps<FormInputProps>>((props, forwardedRef) => {\n const {\n size = 'm',\n mask = '',\n labelPosition = 'dynamic',\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n sizes,\n active,\n label,\n labelId,\n ...inputProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n sizes,\n }\n\n const inputRef = useRef<HTMLInputElement | null>(null)\n useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardedRef, () => inputRef.current, [])\n\n const [overflow, setOverflow] = useState<boolean>(false)\n\n const handleDetectOverflow = useCallback((e: HTMLInputElement) => {\n setOverflow(e.scrollWidth > e.clientWidth)\n }, [])\n\n useResizeObserver({\n target: inputRef,\n onResize: handleDetectOverflow,\n })\n\n return (\n <InputLabel {...sizeProps} active={active} label={label} labelId={labelId} labelPosition={labelPosition}>\n <Styled.Fading visible={overflow} data-input-fading>\n <Styled.Input\n {...inputProps}\n aria-labelledby={label ? labelId : undefined}\n mask={mask}\n onBlur={(evt) => {\n if (inputProps.onBlur) inputProps.onBlur(evt)\n\n handleDetectOverflow(evt.currentTarget)\n }}\n inputRef={(input) => {\n inputRef.current = input\n }}\n />\n </Styled.Fading>\n </InputLabel>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { FormInput }\n"],"names":["FormInput","withMergedProps","forwardRef","props","forwardedRef","size","mask","labelPosition","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizes","active","label","labelId","inputProps","sizeProps","inputRef","useRef","useImperativeHandle","current","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useResizeObserver","target","onResize","_jsx","InputLabel","children","Styled","visible","undefined","onBlur","evt","currentTarget","input","displayName","SIZES"],"mappings":"wWAmBMA,MAAAA,UAA6DC,gBACjEC,YAA0D,CAACC,EAAOC,KAChE,MAAMC,KACJA,EAAO,IAAGC,KACVA,EAAO,GAAEC,cACTA,EAAgB,UAASC,QACzBA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,MACNA,EAAKC,OACLA,EAAMC,MACNA,EAAKC,QACLA,KACGC,GACDf,EAEJ,MAAMgB,EAAY,CAChBd,OACAG,UACAC,SACAC,QACAC,QACAC,QACAC,SACAC,SAGF,MAAMM,EAAWC,OAAgC,MACjDC,oBAAsElB,GAAc,IAAMgB,EAASG,SAAS,IAE5G,MAAOC,EAAUC,GAAeC,UAAkB,GAElD,MAAMC,EAAuBC,aAAaC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAOH,OALAC,kBAAkB,CAChBC,OAAQb,EACRc,SAAUP,IAIVQ,IAACC,WAAU,IAAKjB,EAAWJ,OAAQA,EAAQC,MAAOA,EAAOC,QAASA,EAASV,cAAeA,EAAc8B,SACtGF,IAACG,OAAa,CAACC,QAASf,EAAU,qBAAiB,EAAAa,SACjDF,IAACG,MAAY,IACPpB,EACJ,kBAAiBF,EAAQC,OAAUuB,EACnClC,KAAMA,EACNmC,OAASC,IACHxB,EAAWuB,QAAQvB,EAAWuB,OAAOC,GAEzCf,EAAqBe,EAAIC,cAAc,EAEzCvB,SAAWwB,IACTxB,EAASG,QAAUqB,CAAK,OAInB,IAGjB,CACEC,YA3EmB,YA4EnB/B,MAAOgC"}
@@ -0,0 +1,2 @@
1
+ 'use strict';exports.SIZES={l:{fontSize:18},m:{fontSize:16},s:{fontSize:14},xs:{fontSize:14}};
2
+ //# sourceMappingURL=sizes.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sizes.js","sources":["../../../../src/components/FormInput/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n l: {\n fontSize: 18,\n },\n m: {\n fontSize: 16,\n },\n s: {\n fontSize: 14,\n },\n xs: {\n fontSize: 14,\n },\n}\n"],"names":["l","fontSize","m","s","xs"],"mappings":"2BAGkD,CAChDA,EAAG,CACDC,SAAU,IAEZC,EAAG,CACDD,SAAU,IAEZE,EAAG,CACDF,SAAU,IAEZG,GAAI,CACFH,SAAU"}
@@ -0,0 +1,2 @@
1
+ const SIZES={l:{fontSize:18},m:{fontSize:16},s:{fontSize:14},xs:{fontSize:14}};export{SIZES};
2
+ //# sourceMappingURL=sizes.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sizes.mjs","sources":["../../../../src/components/FormInput/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n l: {\n fontSize: 18,\n },\n m: {\n fontSize: 16,\n },\n s: {\n fontSize: 14,\n },\n xs: {\n fontSize: 14,\n },\n}\n"],"names":["SIZES","l","fontSize","m","s","xs"],"mappings":"AAGO,MAAMA,MAAqC,CAChDC,EAAG,CACDC,SAAU,IAEZC,EAAG,CACDD,SAAU,IAEZE,EAAG,CACDF,SAAU,IAEZG,GAAI,CACFH,SAAU"}
@@ -1,2 +1,2 @@
1
- 'use strict';var styled=require('styled-components');var InputMask=require('react-input-mask');function _interopDefault(n){return n&&n.__esModule?n:{default:n}}var styled__default=_interopDefault(styled);var InputMask__default=_interopDefault(InputMask);const Root=styled__default.default.span.withConfig({shouldForwardProp:n=>!['fading'].includes(n)}).withConfig({displayName:"FormInput__Root",componentId:"ui__sc-1eiwrfu-0"})(["",""],(n=>`\n box-sizing: border-box;\n display: flex;\n position: relative;\n width: 100%;\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n right: 0;\n width: 40px;\n height: 100%;\n pointer-events: none;\n opacity: ${n.fading?1:0};\n background-image: linear-gradient(90deg, transparent, currentcolor);\n transition-property: opacity, color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n }\n\n &:hover::after,\n &:focus-within::after {\n opacity: 0;\n }\n `));const Input=styled__default.default(InputMask__default.default).withConfig({shouldForwardProp:n=>!['palette'].includes(n)}).withConfig({displayName:"FormInput__Input",componentId:"ui__sc-1eiwrfu-1"})(["box-sizing:border-box;appearance:textfield;border:none;padding:0;margin:0;background-color:transparent;font-family:inherit;font-size:inherit;line-height:inherit;width:100%;cursor:pointer;&:disabled{cursor:not-allowed;}&[type='number']::-webkit-outer-spin-button,&[type='number']::-webkit-inner-spin-button{appearance:none;margin:0;}&:focus{outline:none;}&:focus:read-write{cursor:text;}",""],(n=>{return`\n color: ${(e={color:n.theme.colors['content-onmain-primary'],placeholderColor:n.theme.colors['content-onmain-secondary'],colorDisabled:n.theme.colors['content-disabled'],placeholderColorDisabled:n.theme.colors['content-disabled'],...n.palette}).color};\n &:disabled {\n color: ${e.colorDisabled};\n }\n &::placeholder {\n color: ${e.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${e.placeholderColorDisabled};\n }\n`;var e}));exports.Input=Input,exports.Root=Root;
1
+ 'use strict';var styled=require('styled-components');var InputMask=require('react-input-mask');function _interopDefault(n){return n&&n.__esModule?n:{default:n}}var styled__default=_interopDefault(styled);var InputMask__default=_interopDefault(InputMask);const Fading=styled__default.default.div.withConfig({shouldForwardProp:n=>n!=='visible'}).withConfig({displayName:"FormInput__Fading",componentId:"ui__sc-1eiwrfu-0"})(["",""],(n=>`\n box-sizing: border-box;\n display: flex;\n align-items: stretch;\n position: relative;\n width: 100%;\n transform: translateZ(0);\n\n &::after {\n content: '';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 40px;\n pointer-events: none;\n opacity: ${n.visible?1:0};\n background-image: linear-gradient(90deg, transparent, currentcolor);\n transition-property: opacity, color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n }\n\n &:hover::after,\n &:focus-within::after {\n opacity: 0;\n }\n `));const Input=styled__default.default(InputMask__default.default).withConfig({shouldForwardProp:n=>!['palette'].includes(n)}).withConfig({displayName:"FormInput__Input",componentId:"ui__sc-1eiwrfu-1"})(["box-sizing:border-box;appearance:textfield;border:none;padding:0;margin:0;background-color:transparent;font:inherit;height:1.4em;width:100%;cursor:pointer;&:disabled{cursor:not-allowed;}&[type='number']::-webkit-outer-spin-button,&[type='number']::-webkit-inner-spin-button{appearance:none;margin:0;}&:focus{outline:none;}&:focus:read-write{cursor:text;}",""],(n=>{return`\n color: ${(e={color:n.theme.colors['content-onmain-primary'],placeholderColor:n.theme.colors['content-onmain-secondary'],colorDisabled:n.theme.colors['content-disabled'],placeholderColorDisabled:n.theme.colors['content-disabled'],...n.palette}).color};\n &:disabled {\n color: ${e.colorDisabled};\n }\n &::placeholder {\n color: ${e.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${e.placeholderColorDisabled};\n }\n`;var e}));exports.Fading=Fading,exports.Input=Input;
2
2
  //# sourceMappingURL=style.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/components/FormInput/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport InputMask from 'react-input-mask'\nimport type { StyledFormInputProps, StyledFormInputRootProps, FormInputPalette } from './types'\n\nconst template = (palette: FormInputPalette) => `\n color: ${palette.color};\n &:disabled {\n color: ${palette.colorDisabled};\n }\n &::placeholder {\n color: ${palette.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${palette.placeholderColorDisabled};\n }\n`\n\nexport const Root = styled.span.withConfig<StyledFormInputRootProps>({\n shouldForwardProp: (propKey) => !['fading'].includes(propKey),\n})`\n ${(props) => `\n box-sizing: border-box;\n display: flex;\n position: relative;\n width: 100%;\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n right: 0;\n width: 40px;\n height: 100%;\n pointer-events: none;\n opacity: ${props.fading ? 1 : 0};\n background-image: linear-gradient(90deg, transparent, currentcolor);\n transition-property: opacity, color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n }\n\n &:hover::after,\n &:focus-within::after {\n opacity: 0;\n }\n `}\n`\n\nexport const Input: React.ComponentType<StyledFormInputProps> = styled(InputMask).withConfig<StyledFormInputProps>({\n shouldForwardProp: (propKey) => !['palette'].includes(propKey),\n})`\n box-sizing: border-box;\n appearance: textfield;\n border: none;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n width: 100%;\n cursor: pointer;\n &:disabled {\n cursor: not-allowed;\n }\n &[type='number']::-webkit-outer-spin-button,\n &[type='number']::-webkit-inner-spin-button {\n appearance: none;\n margin: 0;\n }\n &:focus {\n outline: none;\n }\n\n &:focus:read-write {\n cursor: text;\n }\n\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n placeholderColor: props.theme.colors['content-onmain-secondary'],\n colorDisabled: props.theme.colors['content-disabled'],\n placeholderColorDisabled: props.theme.colors['content-disabled'],\n ...props.palette,\n })}\n`\n"],"names":["Root","styled","span","withConfig","shouldForwardProp","propKey","includes","displayName","componentId","props","fading","Input","default","InputMask","template","palette","color","theme","colors","placeholderColor","colorDisabled","placeholderColorDisabled"],"mappings":"8PAiBO,MAAMA,KAAOC,gBAAAA,QAAOC,KAAKC,WAAqC,CACnEC,kBAAoBC,IAAa,CAAC,UAAUC,SAASD,KACrDF,WAAA,CAAAI,YAAA,kBAAAC,YAAA,oBAFkBP,CAElB,CAAA,GAAA,KACGQ,GAAU,0RAcEA,EAAMC,OAAS,EAAI,uSAc7B,MAAMC,MAAmDV,gBAAMW,QAACC,4BAAWV,WAAiC,CACjHC,kBAAoBC,IAAa,CAAC,WAAWC,SAASD,KACtDF,WAAA,CAAAI,YAAA,mBAAAC,YAAA,oBAF8DP,CA8B3DQ,CAAAA,qYAAAA,KAAAA,IACDK,MA3E4C,eAA9BC,EA2EL,CACPC,MAAOP,EAAMQ,MAAMC,OAAO,0BAC1BC,iBAAkBV,EAAMQ,MAAMC,OAAO,4BACrCE,cAAeX,EAAMQ,MAAMC,OAAO,oBAClCG,yBAA0BZ,EAAMQ,MAAMC,OAAO,uBAC1CT,EAAMM,UA/EIC,sCAEND,EAAQK,uDAGRL,EAAQI,mEAGRJ,EAAQM,mCATHN,KAiFZ"}
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/FormInput/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport InputMask from 'react-input-mask'\nimport type { StyledMaskInputProps, FormInputPalette } from './types'\n\nconst template = (palette: FormInputPalette) => `\n color: ${palette.color};\n &:disabled {\n color: ${palette.colorDisabled};\n }\n &::placeholder {\n color: ${palette.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${palette.placeholderColorDisabled};\n }\n`\n\nexport const Fading = styled.div.withConfig<{ visible: boolean }>({\n shouldForwardProp: (propKey) => propKey !== 'visible',\n})`\n ${(props) => `\n box-sizing: border-box;\n display: flex;\n align-items: stretch;\n position: relative;\n width: 100%;\n transform: translateZ(0);\n\n &::after {\n content: '';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 40px;\n pointer-events: none;\n opacity: ${props.visible ? 1 : 0};\n background-image: linear-gradient(90deg, transparent, currentcolor);\n transition-property: opacity, color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n }\n\n &:hover::after,\n &:focus-within::after {\n opacity: 0;\n }\n `}\n`\n\nexport const Input: React.ComponentType<StyledMaskInputProps> = styled(InputMask).withConfig<StyledMaskInputProps>({\n shouldForwardProp: (propKey) => !['palette'].includes(propKey),\n})`\n box-sizing: border-box;\n appearance: textfield;\n border: none;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font: inherit;\n height: 1.4em;\n width: 100%;\n cursor: pointer;\n &:disabled {\n cursor: not-allowed;\n }\n &[type='number']::-webkit-outer-spin-button,\n &[type='number']::-webkit-inner-spin-button {\n appearance: none;\n margin: 0;\n }\n &:focus {\n outline: none;\n }\n\n &:focus:read-write {\n cursor: text;\n }\n\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n placeholderColor: props.theme.colors['content-onmain-secondary'],\n colorDisabled: props.theme.colors['content-disabled'],\n placeholderColorDisabled: props.theme.colors['content-disabled'],\n ...props.palette,\n })}\n`\n"],"names":["Fading","styled","div","withConfig","shouldForwardProp","propKey","displayName","componentId","props","visible","Input","default","InputMask","includes","template","palette","color","theme","colors","placeholderColor","colorDisabled","placeholderColorDisabled"],"mappings":"8PAiBO,MAAMA,OAASC,gBAAAA,QAAOC,IAAIC,WAAiC,CAChEC,kBAAoBC,GAAYA,IAAY,YAC5CF,WAAA,CAAAG,YAAA,oBAAAC,YAAA,oBAFoBN,CAEpB,CAAA,GAAA,KACGO,GAAU,8UAgBEA,EAAMC,QAAU,EAAI,uSAc9B,MAAMC,MAAmDT,gBAAMU,QAACC,4BAAWT,WAAiC,CACjHC,kBAAoBC,IAAa,CAAC,WAAWQ,SAASR,KACtDF,WAAA,CAAAG,YAAA,mBAAAC,YAAA,oBAF8DN,CA6B3DO,CAAAA,qWAAAA,KAAAA,IACDM,MA5E4C,eAA9BC,EA4EL,CACPC,MAAOR,EAAMS,MAAMC,OAAO,0BAC1BC,iBAAkBX,EAAMS,MAAMC,OAAO,4BACrCE,cAAeZ,EAAMS,MAAMC,OAAO,oBAClCG,yBAA0Bb,EAAMS,MAAMC,OAAO,uBAC1CV,EAAMO,UAhFIC,sCAEND,EAAQK,uDAGRL,EAAQI,mEAGRJ,EAAQM,mCATHN,KAkFZ"}
@@ -1,2 +1,2 @@
1
- import styled from'styled-components';import InputMask from'react-input-mask';const Root=styled.span.withConfig({shouldForwardProp:n=>!['fading'].includes(n)}).withConfig({displayName:"FormInput__Root",componentId:"ui__sc-1eiwrfu-0"})(["",""],(n=>`\n box-sizing: border-box;\n display: flex;\n position: relative;\n width: 100%;\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n right: 0;\n width: 40px;\n height: 100%;\n pointer-events: none;\n opacity: ${n.fading?1:0};\n background-image: linear-gradient(90deg, transparent, currentcolor);\n transition-property: opacity, color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n }\n\n &:hover::after,\n &:focus-within::after {\n opacity: 0;\n }\n `));const Input=styled(InputMask).withConfig({shouldForwardProp:n=>!['palette'].includes(n)}).withConfig({displayName:"FormInput__Input",componentId:"ui__sc-1eiwrfu-1"})(["box-sizing:border-box;appearance:textfield;border:none;padding:0;margin:0;background-color:transparent;font-family:inherit;font-size:inherit;line-height:inherit;width:100%;cursor:pointer;&:disabled{cursor:not-allowed;}&[type='number']::-webkit-outer-spin-button,&[type='number']::-webkit-inner-spin-button{appearance:none;margin:0;}&:focus{outline:none;}&:focus:read-write{cursor:text;}",""],(n=>{return`\n color: ${(o={color:n.theme.colors['content-onmain-primary'],placeholderColor:n.theme.colors['content-onmain-secondary'],colorDisabled:n.theme.colors['content-disabled'],placeholderColorDisabled:n.theme.colors['content-disabled'],...n.palette}).color};\n &:disabled {\n color: ${o.colorDisabled};\n }\n &::placeholder {\n color: ${o.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${o.placeholderColorDisabled};\n }\n`;var o}));export{Input,Root};
1
+ import styled from'styled-components';import InputMask from'react-input-mask';const Fading=styled.div.withConfig({shouldForwardProp:n=>n!=='visible'}).withConfig({displayName:"FormInput__Fading",componentId:"ui__sc-1eiwrfu-0"})(["",""],(n=>`\n box-sizing: border-box;\n display: flex;\n align-items: stretch;\n position: relative;\n width: 100%;\n transform: translateZ(0);\n\n &::after {\n content: '';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 40px;\n pointer-events: none;\n opacity: ${n.visible?1:0};\n background-image: linear-gradient(90deg, transparent, currentcolor);\n transition-property: opacity, color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n }\n\n &:hover::after,\n &:focus-within::after {\n opacity: 0;\n }\n `));const Input=styled(InputMask).withConfig({shouldForwardProp:n=>!['palette'].includes(n)}).withConfig({displayName:"FormInput__Input",componentId:"ui__sc-1eiwrfu-1"})(["box-sizing:border-box;appearance:textfield;border:none;padding:0;margin:0;background-color:transparent;font:inherit;height:1.4em;width:100%;cursor:pointer;&:disabled{cursor:not-allowed;}&[type='number']::-webkit-outer-spin-button,&[type='number']::-webkit-inner-spin-button{appearance:none;margin:0;}&:focus{outline:none;}&:focus:read-write{cursor:text;}",""],(n=>{return`\n color: ${(o={color:n.theme.colors['content-onmain-primary'],placeholderColor:n.theme.colors['content-onmain-secondary'],colorDisabled:n.theme.colors['content-disabled'],placeholderColorDisabled:n.theme.colors['content-disabled'],...n.palette}).color};\n &:disabled {\n color: ${o.colorDisabled};\n }\n &::placeholder {\n color: ${o.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${o.placeholderColorDisabled};\n }\n`;var o}));export{Fading,Input};
2
2
  //# sourceMappingURL=style.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.mjs","sources":["../../../../src/components/FormInput/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport InputMask from 'react-input-mask'\nimport type { StyledFormInputProps, StyledFormInputRootProps, FormInputPalette } from './types'\n\nconst template = (palette: FormInputPalette) => `\n color: ${palette.color};\n &:disabled {\n color: ${palette.colorDisabled};\n }\n &::placeholder {\n color: ${palette.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${palette.placeholderColorDisabled};\n }\n`\n\nexport const Root = styled.span.withConfig<StyledFormInputRootProps>({\n shouldForwardProp: (propKey) => !['fading'].includes(propKey),\n})`\n ${(props) => `\n box-sizing: border-box;\n display: flex;\n position: relative;\n width: 100%;\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n right: 0;\n width: 40px;\n height: 100%;\n pointer-events: none;\n opacity: ${props.fading ? 1 : 0};\n background-image: linear-gradient(90deg, transparent, currentcolor);\n transition-property: opacity, color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n }\n\n &:hover::after,\n &:focus-within::after {\n opacity: 0;\n }\n `}\n`\n\nexport const Input: React.ComponentType<StyledFormInputProps> = styled(InputMask).withConfig<StyledFormInputProps>({\n shouldForwardProp: (propKey) => !['palette'].includes(propKey),\n})`\n box-sizing: border-box;\n appearance: textfield;\n border: none;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n width: 100%;\n cursor: pointer;\n &:disabled {\n cursor: not-allowed;\n }\n &[type='number']::-webkit-outer-spin-button,\n &[type='number']::-webkit-inner-spin-button {\n appearance: none;\n margin: 0;\n }\n &:focus {\n outline: none;\n }\n\n &:focus:read-write {\n cursor: text;\n }\n\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n placeholderColor: props.theme.colors['content-onmain-secondary'],\n colorDisabled: props.theme.colors['content-disabled'],\n placeholderColorDisabled: props.theme.colors['content-disabled'],\n ...props.palette,\n })}\n`\n"],"names":["Root","styled","span","withConfig","shouldForwardProp","propKey","includes","displayName","componentId","props","fading","Input","InputMask","template","palette","color","theme","colors","placeholderColor","colorDisabled","placeholderColorDisabled"],"mappings":"8EAiBO,MAAMA,KAAOC,OAAOC,KAAKC,WAAqC,CACnEC,kBAAoBC,IAAa,CAAC,UAAUC,SAASD,KACrDF,WAAA,CAAAI,YAAA,kBAAAC,YAAA,oBAFkBP,CAElB,CAAA,GAAA,KACGQ,GAAU,0RAcEA,EAAMC,OAAS,EAAI,uSAc7B,MAAMC,MAAmDV,OAAOW,WAAWT,WAAiC,CACjHC,kBAAoBC,IAAa,CAAC,WAAWC,SAASD,KACtDF,WAAA,CAAAI,YAAA,mBAAAC,YAAA,oBAF8DP,CA8B3DQ,CAAAA,qYAAAA,KAAAA,IACDI,MA3E4C,eAA9BC,EA2EL,CACPC,MAAON,EAAMO,MAAMC,OAAO,0BAC1BC,iBAAkBT,EAAMO,MAAMC,OAAO,4BACrCE,cAAeV,EAAMO,MAAMC,OAAO,oBAClCG,yBAA0BX,EAAMO,MAAMC,OAAO,uBAC1CR,EAAMK,UA/EIC,sCAEND,EAAQK,uDAGRL,EAAQI,mEAGRJ,EAAQM,mCATHN,KAiFZ"}
1
+ {"version":3,"file":"style.mjs","sources":["../../../../src/components/FormInput/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport InputMask from 'react-input-mask'\nimport type { StyledMaskInputProps, FormInputPalette } from './types'\n\nconst template = (palette: FormInputPalette) => `\n color: ${palette.color};\n &:disabled {\n color: ${palette.colorDisabled};\n }\n &::placeholder {\n color: ${palette.placeholderColor};\n }\n &:disabled::placeholder {\n color: ${palette.placeholderColorDisabled};\n }\n`\n\nexport const Fading = styled.div.withConfig<{ visible: boolean }>({\n shouldForwardProp: (propKey) => propKey !== 'visible',\n})`\n ${(props) => `\n box-sizing: border-box;\n display: flex;\n align-items: stretch;\n position: relative;\n width: 100%;\n transform: translateZ(0);\n\n &::after {\n content: '';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 40px;\n pointer-events: none;\n opacity: ${props.visible ? 1 : 0};\n background-image: linear-gradient(90deg, transparent, currentcolor);\n transition-property: opacity, color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n }\n\n &:hover::after,\n &:focus-within::after {\n opacity: 0;\n }\n `}\n`\n\nexport const Input: React.ComponentType<StyledMaskInputProps> = styled(InputMask).withConfig<StyledMaskInputProps>({\n shouldForwardProp: (propKey) => !['palette'].includes(propKey),\n})`\n box-sizing: border-box;\n appearance: textfield;\n border: none;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font: inherit;\n height: 1.4em;\n width: 100%;\n cursor: pointer;\n &:disabled {\n cursor: not-allowed;\n }\n &[type='number']::-webkit-outer-spin-button,\n &[type='number']::-webkit-inner-spin-button {\n appearance: none;\n margin: 0;\n }\n &:focus {\n outline: none;\n }\n\n &:focus:read-write {\n cursor: text;\n }\n\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n placeholderColor: props.theme.colors['content-onmain-secondary'],\n colorDisabled: props.theme.colors['content-disabled'],\n placeholderColorDisabled: props.theme.colors['content-disabled'],\n ...props.palette,\n })}\n`\n"],"names":["Fading","styled","div","withConfig","shouldForwardProp","propKey","displayName","componentId","props","visible","Input","InputMask","includes","template","palette","color","theme","colors","placeholderColor","colorDisabled","placeholderColorDisabled"],"mappings":"8EAiBO,MAAMA,OAASC,OAAOC,IAAIC,WAAiC,CAChEC,kBAAoBC,GAAYA,IAAY,YAC5CF,WAAA,CAAAG,YAAA,oBAAAC,YAAA,oBAFoBN,CAEpB,CAAA,GAAA,KACGO,GAAU,8UAgBEA,EAAMC,QAAU,EAAI,uSAc9B,MAAMC,MAAmDT,OAAOU,WAAWR,WAAiC,CACjHC,kBAAoBC,IAAa,CAAC,WAAWO,SAASP,KACtDF,WAAA,CAAAG,YAAA,mBAAAC,YAAA,oBAF8DN,CA6B3DO,CAAAA,qWAAAA,KAAAA,IACDK,MA5E4C,eAA9BC,EA4EL,CACPC,MAAOP,EAAMQ,MAAMC,OAAO,0BAC1BC,iBAAkBV,EAAMQ,MAAMC,OAAO,4BACrCE,cAAeX,EAAMQ,MAAMC,OAAO,oBAClCG,yBAA0BZ,EAAMQ,MAAMC,OAAO,uBAC1CT,EAAMM,UAhFIC,sCAEND,EAAQK,uDAGRL,EAAQI,mEAGRJ,EAAQM,mCATHN,KAkFZ"}
@@ -1,2 +1,2 @@
1
- 'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var constants=require('./constants.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var Text=require('../Text/Text.js');const FormInputLabel=withMergedProps.withMergedProps(React.forwardRef(((e,t)=>{const{size:r="m",labelPosition:n="dynamic",inputPosition:i="center",iconProps:s={},icon:o,input:a,label:l,labelId:c,text:u,controls:d,addon:p,dropdown:m,active:x,...j}=e;const[g,h]=Array.isArray(o)?o:[o];return jsxRuntime.jsxs(style.Root,{...j,size:r,ref:t,children:[g?jsxRuntime.jsx(Icon.Icon,{preset:"brand",name:typeof g=='string'?g:void 0,icon:typeof g!='string'?g:void 0,marginRight:12,...s}):null,jsxRuntime.jsxs(style.InputContainer,{position:i,labelPosition:l?n:void 0,labelActive:x,children:[a,l?jsxRuntime.jsx(style.Label,{id:c,children:l}):null]}),u?jsxRuntime.jsx(Text.Text,{size:"inherit",color:"inherit",whiteSpace:"nowrap",marginLeft:12,marginRight:p||h||d?void 0:8,children:u}):null,p,h?jsxRuntime.jsx(Icon.Icon,{preset:"brand",name:typeof h=='string'?h:void 0,icon:typeof h!='string'?h:void 0,marginLeft:12,marginRight:d?void 0:4,...s}):null,d,m?jsxRuntime.jsx(style.Dropdown,{children:m}):null]})})),{sizes:constants.SIZES,displayName:"FormInputLabel"});exports.COMPONENT_NAME="FormInputLabel",exports.FormInputLabel=FormInputLabel;
1
+ 'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var sizes=require('./sizes.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var Text=require('../Text/Text.js');const FormInputLabel=withMergedProps.withMergedProps(React.forwardRef(((e,i)=>{const{size:r="m",iconProps:s={},sizeXXS:t,sizeXS:n,sizeS:o,sizeM:a,sizeL:c,sizeXL:l,icon:u,input:p,text:d,controls:x,addon:m,dropdown:z,...g}=e;const j={size:r,sizeXXS:t,sizeXS:n,sizeS:o,sizeM:a,sizeL:c,sizeXL:l};const[h,I]=Array.isArray(u)?u:[u];return jsxRuntime.jsxs(style.Root,{...g,...j,ref:i,children:[h?jsxRuntime.jsx(Icon.Icon,{preset:"brand",name:typeof h=='string'?h:void 0,icon:typeof h!='string'?h:void 0,marginRight:"var(--gap)",...j,...s}):null,jsxRuntime.jsx(style.Container,{...j,sizes:sizes.SIZES_CONTAINER,grow:1,children:p}),d?jsxRuntime.jsx(style.Container,{...j,sizes:sizes.SIZES_CONTAINER,marginLeft:"var(--gap)",marginRight:m||I||x?void 0:8,children:jsxRuntime.jsx(Text.Text,{size:"inherit",color:"inherit",lineHeight:"inherit",whiteSpace:"nowrap",children:d})}):null,m,I?jsxRuntime.jsx(Icon.Icon,{preset:"brand",name:typeof I=='string'?I:void 0,icon:typeof I!='string'?I:void 0,marginLeft:"var(--gap)",marginRight:x?void 0:4,...j,...s}):null,x,z?jsxRuntime.jsx(style.Dropdown,{children:z}):null]})})),{sizes:sizes.SIZES,displayName:"FormInputLabel"});exports.COMPONENT_NAME="FormInputLabel",exports.FormInputLabel=FormInputLabel;
2
2
  //# sourceMappingURL=FormInputLabel.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FormInputLabel.js","sources":["../../../../src/components/FormInputLabel/FormInputLabel.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { FormInputLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormInputLabel'\n\nconst FormInputLabel: React.ForwardRefExoticComponent<FormInputLabelProps> = withMergedProps<\n FormInputLabelProps,\n HTMLDivElement\n>(\n forwardRef<HTMLDivElement, MergedProps<FormInputLabelProps>>((props, ref) => {\n const {\n size = 'm',\n labelPosition = 'dynamic',\n inputPosition = 'center',\n iconProps = {},\n icon,\n input,\n label,\n labelId,\n text,\n controls,\n addon,\n dropdown,\n active,\n ...restProps\n } = props\n\n const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n return (\n <Styled.Root {...restProps} size={size} ref={ref}>\n {before ? (\n <Icon\n preset='brand'\n name={typeof before === 'string' ? before : undefined}\n icon={typeof before !== 'string' ? before : undefined}\n marginRight={12}\n {...iconProps}\n />\n ) : null}\n <Styled.InputContainer\n position={inputPosition}\n labelPosition={label ? labelPosition : undefined}\n labelActive={active}\n >\n {input}\n {label ? <Styled.Label id={labelId}>{label}</Styled.Label> : null}\n </Styled.InputContainer>\n {text ? (\n <Text\n size='inherit'\n color='inherit'\n whiteSpace='nowrap'\n marginLeft={12}\n marginRight={!addon && !after && !controls ? 8 : undefined}\n >\n {text}\n </Text>\n ) : null}\n {addon}\n {after ? (\n <Icon\n preset='brand'\n name={typeof after === 'string' ? after : undefined}\n icon={typeof after !== 'string' ? after : undefined}\n marginLeft={12}\n marginRight={!controls ? 4 : undefined}\n {...iconProps}\n />\n ) : null}\n {controls}\n {dropdown ? <Styled.Dropdown>{dropdown}</Styled.Dropdown> : null}\n </Styled.Root>\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { FormInputLabel, COMPONENT_NAME }\n"],"names":["FormInputLabel","withMergedProps","forwardRef","props","ref","size","labelPosition","inputPosition","iconProps","icon","input","label","labelId","text","controls","addon","dropdown","active","restProps","before","after","Array","isArray","_jsxs","Styled","children","_jsx","jsx","Icon","preset","name","undefined","marginRight","jsxs","position","labelActive","id","Text","color","whiteSpace","marginLeft","sizes","SIZES","displayName"],"mappings":"iSAWMA,MAAAA,eAAuEC,gBAAAA,gBAI3EC,MAAAA,YAA6D,CAACC,EAAOC,KACnE,MAAMC,KACJA,EAAO,IAAGC,cACVA,EAAgB,UAASC,cACzBA,EAAgB,SAAQC,UACxBA,EAAY,CAAE,EAAAC,KACdA,EAAIC,MACJA,EAAKC,MACLA,EAAKC,QACLA,EAAOC,KACPA,EAAIC,SACJA,EAAQC,MACRA,EAAKC,SACLA,EAAQC,OACRA,KACGC,GACDf,EAEJ,MAAOgB,EAAQC,GAASC,MAAMC,QAAQb,GAAQA,EAAO,CAACA,GAEtD,OACEc,WAAAA,KAACC,MAAAA,KAAW,IAAKN,EAAWb,KAAMA,EAAMD,IAAKA,EAAIqB,SAC9CN,CAAAA,EACCO,WAAAC,IAACC,UAAI,CACHC,OAAO,QACPC,YAAaX,GAAW,SAAWA,OAASY,EAC5CtB,YAAaU,GAAW,SAAWA,OAASY,EAC5CC,YAAa,MACTxB,IAEJ,KACJe,WAAAU,KAACT,qBAAqB,CACpBU,SAAU3B,EACVD,cAAeK,EAAQL,OAAgByB,EACvCI,YAAalB,EAAOQ,SAAA,CAEnBf,EACAC,EAAQe,WAAAA,IAACF,MAAAA,MAAY,CAACY,GAAIxB,EAAQa,SAAEd,IAAwB,QAE9DE,EACCa,WAAAC,IAACU,UAAI,CACHhC,KAAK,UACLiC,MAAM,UACNC,WAAW,SACXC,WAAY,GACZR,YAAcjB,GAAUK,GAAUN,OAAeiB,EAAJ,EAAcN,SAE1DZ,IAED,KACHE,EACAK,EACCM,WAAAA,IAACE,KAAAA,KAAI,CACHC,OAAO,QACPC,YAAaV,GAAU,SAAWA,OAAQW,EAC1CtB,YAAaW,GAAU,SAAWA,OAAQW,EAC1CS,WAAY,GACZR,YAAclB,OAAeiB,EAAJ,KACrBvB,IAEJ,KACHM,EACAE,EAAWU,WAAAA,IAACF,MAAAA,SAAe,CAAAC,SAAET,IAA8B,OAChD,IAGlB,CACEyB,MAAOC,UAAKA,MACZC,YA1EmB,0CAAA"}
1
+ {"version":3,"file":"FormInputLabel.js","sources":["../../../../src/components/FormInputLabel/FormInputLabel.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { SIZES, SIZES_CONTAINER } from './sizes'\nimport * as Styled from './style'\nimport type { FormInputLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormInputLabel'\n\nconst FormInputLabel: React.ForwardRefExoticComponent<FormInputLabelProps> = withMergedProps<\n FormInputLabelProps,\n HTMLDivElement\n>(\n forwardRef<HTMLDivElement, MergedProps<FormInputLabelProps>>((props, ref) => {\n const {\n size = 'm',\n iconProps = {},\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n icon,\n input,\n text,\n controls,\n addon,\n dropdown,\n ...restProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n return (\n <Styled.Root {...restProps} {...sizeProps} ref={ref}>\n {before ? (\n <Icon\n preset='brand'\n name={typeof before === 'string' ? before : undefined}\n icon={typeof before !== 'string' ? before : undefined}\n marginRight='var(--gap)'\n {...sizeProps}\n {...iconProps}\n />\n ) : null}\n <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER} grow={1}>\n {input}\n </Styled.Container>\n {text ? (\n <Styled.Container\n {...sizeProps}\n sizes={SIZES_CONTAINER}\n marginLeft='var(--gap)'\n marginRight={!addon && !after && !controls ? 8 : undefined}\n >\n <Text size='inherit' color='inherit' lineHeight='inherit' whiteSpace='nowrap'>\n {text}\n </Text>\n </Styled.Container>\n ) : null}\n {addon}\n {after ? (\n <Icon\n preset='brand'\n name={typeof after === 'string' ? after : undefined}\n icon={typeof after !== 'string' ? after : undefined}\n marginLeft='var(--gap)'\n marginRight={!controls ? 4 : undefined}\n {...sizeProps}\n {...iconProps}\n />\n ) : null}\n {controls}\n {dropdown ? <Styled.Dropdown>{dropdown}</Styled.Dropdown> : null}\n </Styled.Root>\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { FormInputLabel, COMPONENT_NAME }\n"],"names":["FormInputLabel","withMergedProps","forwardRef","props","ref","size","iconProps","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","icon","input","text","controls","addon","dropdown","restProps","sizeProps","before","after","Array","isArray","_jsxs","Styled","children","_jsx","jsx","Icon","preset","name","undefined","marginRight","sizes","SIZES_CONTAINER","grow","marginLeft","Text","color","lineHeight","whiteSpace","SIZES","displayName"],"mappings":"yRAWMA,MAAAA,eAAuEC,gBAAAA,gBAI3EC,MAAAA,YAA6D,CAACC,EAAOC,KACnE,MAAMC,KACJA,EAAO,IAAGC,UACVA,EAAY,CAAE,EAAAC,QACdA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,KACNA,EAAIC,MACJA,EAAKC,KACLA,EAAIC,SACJA,EAAQC,MACRA,EAAKC,SACLA,KACGC,GACDhB,EAEJ,MAAMiB,EAAY,CAChBf,OACAE,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAOS,EAAQC,GAASC,MAAMC,QAAQX,GAAQA,EAAO,CAACA,GAEtD,OACEY,WAAAA,KAACC,MAAAA,KAAW,IAAKP,KAAeC,EAAWhB,IAAKA,EAAIuB,SACjDN,CAAAA,EACCO,WAAAC,IAACC,UAAI,CACHC,OAAO,QACPC,YAAaX,GAAW,SAAWA,OAASY,EAC5CpB,YAAaQ,GAAW,SAAWA,OAASY,EAC5CC,YAAY,gBACRd,KACAd,IAEJ,KACJsB,WAAAC,IAACH,gBAAgB,IAAKN,EAAWe,MAAOC,MAAgBA,gBAACC,KAAM,EAAEV,SAC9Db,IAEFC,EACCa,WAAAC,IAACH,gBAAgB,IACXN,EACJe,MAAOC,MAAgBA,gBACvBE,WAAW,aACXJ,YAAcjB,GAAUK,GAAUN,OAAeiB,EAAJ,EAAcN,SAE3DC,WAAAC,IAACU,UAAI,CAAClC,KAAK,UAAUmC,MAAM,UAAUC,WAAW,UAAUC,WAAW,SAAQf,SAC1EZ,MAGH,KACHE,EACAK,EACCM,WAAAA,IAACE,KAAAA,KAAI,CACHC,OAAO,QACPC,YAAaV,GAAU,SAAWA,OAAQW,EAC1CpB,YAAaS,GAAU,SAAWA,OAAQW,EAC1CK,WAAW,aACXJ,YAAclB,OAAeiB,EAAJ,KACrBb,KACAd,IAEJ,KACHU,EACAE,EAAWU,WAAAA,IAACF,MAAAA,SAAe,CAAAC,SAAET,IAA8B,OAChD,IAGlB,CACEiB,MAAOQ,MAAKA,MACZC,YAnFmB,0CAAA"}
@@ -1,2 +1,2 @@
1
- import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES}from'./constants.mjs';import{Root,InputContainer,Label,Dropdown}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{Text}from'../Text/Text.mjs';const COMPONENT_NAME='FormInputLabel';const FormInputLabel=withMergedProps(forwardRef(((o,r)=>{const{size:i="m",labelPosition:n="dynamic",inputPosition:t="center",iconProps:e={},icon:s,input:a,label:l,labelId:m,text:p,controls:c,addon:d,dropdown:f,active:x,...g}=o;const[h,j]=Array.isArray(s)?s:[s];return jsxs(Root,{...g,size:i,ref:r,children:[h?jsx(Icon,{preset:"brand",name:typeof h=='string'?h:void 0,icon:typeof h!='string'?h:void 0,marginRight:12,...e}):null,jsxs(InputContainer,{position:t,labelPosition:l?n:void 0,labelActive:x,children:[a,l?jsx(Label,{id:m,children:l}):null]}),p?jsx(Text,{size:"inherit",color:"inherit",whiteSpace:"nowrap",marginLeft:12,marginRight:d||j||c?void 0:8,children:p}):null,d,j?jsx(Icon,{preset:"brand",name:typeof j=='string'?j:void 0,icon:typeof j!='string'?j:void 0,marginLeft:12,marginRight:c?void 0:4,...e}):null,c,f?jsx(Dropdown,{children:f}):null]})})),{sizes:SIZES,displayName:"FormInputLabel"});export{COMPONENT_NAME,FormInputLabel};
1
+ import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES,SIZES_CONTAINER}from'./sizes.mjs';import{Root,Container,Dropdown}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{Text}from'../Text/Text.mjs';const COMPONENT_NAME='FormInputLabel';const FormInputLabel=withMergedProps(forwardRef(((r,i)=>{const{size:e="m",iconProps:o={},sizeXXS:s,sizeXS:n,sizeS:t,sizeM:a,sizeL:m,sizeXL:p,icon:c,input:d,text:l,controls:g,addon:z,dropdown:f,...h}=r;const I={size:e,sizeXXS:s,sizeXS:n,sizeS:t,sizeM:a,sizeL:m,sizeXL:p};const[S,x]=Array.isArray(c)?c:[c];return jsxs(Root,{...h,...I,ref:i,children:[S?jsx(Icon,{preset:"brand",name:typeof S=='string'?S:void 0,icon:typeof S!='string'?S:void 0,marginRight:"var(--gap)",...I,...o}):null,jsx(Container,{...I,sizes:SIZES_CONTAINER,grow:1,children:d}),l?jsx(Container,{...I,sizes:SIZES_CONTAINER,marginLeft:"var(--gap)",marginRight:z||x||g?void 0:8,children:jsx(Text,{size:"inherit",color:"inherit",lineHeight:"inherit",whiteSpace:"nowrap",children:l})}):null,z,x?jsx(Icon,{preset:"brand",name:typeof x=='string'?x:void 0,icon:typeof x!='string'?x:void 0,marginLeft:"var(--gap)",marginRight:g?void 0:4,...I,...o}):null,g,f?jsx(Dropdown,{children:f}):null]})})),{sizes:SIZES,displayName:"FormInputLabel"});export{COMPONENT_NAME,FormInputLabel};
2
2
  //# sourceMappingURL=FormInputLabel.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"FormInputLabel.mjs","sources":["../../../../src/components/FormInputLabel/FormInputLabel.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { FormInputLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormInputLabel'\n\nconst FormInputLabel: React.ForwardRefExoticComponent<FormInputLabelProps> = withMergedProps<\n FormInputLabelProps,\n HTMLDivElement\n>(\n forwardRef<HTMLDivElement, MergedProps<FormInputLabelProps>>((props, ref) => {\n const {\n size = 'm',\n labelPosition = 'dynamic',\n inputPosition = 'center',\n iconProps = {},\n icon,\n input,\n label,\n labelId,\n text,\n controls,\n addon,\n dropdown,\n active,\n ...restProps\n } = props\n\n const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n return (\n <Styled.Root {...restProps} size={size} ref={ref}>\n {before ? (\n <Icon\n preset='brand'\n name={typeof before === 'string' ? before : undefined}\n icon={typeof before !== 'string' ? before : undefined}\n marginRight={12}\n {...iconProps}\n />\n ) : null}\n <Styled.InputContainer\n position={inputPosition}\n labelPosition={label ? labelPosition : undefined}\n labelActive={active}\n >\n {input}\n {label ? <Styled.Label id={labelId}>{label}</Styled.Label> : null}\n </Styled.InputContainer>\n {text ? (\n <Text\n size='inherit'\n color='inherit'\n whiteSpace='nowrap'\n marginLeft={12}\n marginRight={!addon && !after && !controls ? 8 : undefined}\n >\n {text}\n </Text>\n ) : null}\n {addon}\n {after ? (\n <Icon\n preset='brand'\n name={typeof after === 'string' ? after : undefined}\n icon={typeof after !== 'string' ? after : undefined}\n marginLeft={12}\n marginRight={!controls ? 4 : undefined}\n {...iconProps}\n />\n ) : null}\n {controls}\n {dropdown ? <Styled.Dropdown>{dropdown}</Styled.Dropdown> : null}\n </Styled.Root>\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { FormInputLabel, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","FormInputLabel","withMergedProps","forwardRef","props","ref","size","labelPosition","inputPosition","iconProps","icon","input","label","labelId","text","controls","addon","dropdown","active","restProps","before","after","Array","isArray","_jsxs","Styled","children","_jsx","Icon","preset","name","undefined","marginRight","position","labelActive","id","Text","color","whiteSpace","marginLeft","sizes","SIZES","displayName"],"mappings":"uSASMA,MAAAA,eAAiB,iBAEjBC,MAAAA,eAAuEC,gBAI3EC,YAA6D,CAACC,EAAOC,KACnE,MAAMC,KACJA,EAAO,IAAGC,cACVA,EAAgB,UAASC,cACzBA,EAAgB,SAAQC,UACxBA,EAAY,CAAE,EAAAC,KACdA,EAAIC,MACJA,EAAKC,MACLA,EAAKC,QACLA,EAAOC,KACPA,EAAIC,SACJA,EAAQC,MACRA,EAAKC,SACLA,EAAQC,OACRA,KACGC,GACDf,EAEJ,MAAOgB,EAAQC,GAASC,MAAMC,QAAQb,GAAQA,EAAO,CAACA,GAEtD,OACEc,KAACC,KAAW,IAAKN,EAAWb,KAAMA,EAAMD,IAAKA,EAAIqB,SAC9CN,CAAAA,EACCO,IAACC,KAAI,CACHC,OAAO,QACPC,YAAaV,GAAW,SAAWA,OAASW,EAC5CrB,YAAaU,GAAW,SAAWA,OAASW,EAC5CC,YAAa,MACTvB,IAEJ,KACJe,KAACC,eAAqB,CACpBQ,SAAUzB,EACVD,cAAeK,EAAQL,OAAgBwB,EACvCG,YAAahB,EAAOQ,SAAA,CAEnBf,EACAC,EAAQe,IAACF,MAAY,CAACU,GAAItB,EAAQa,SAAEd,IAAwB,QAE9DE,EACCa,IAACS,KAAI,CACH9B,KAAK,UACL+B,MAAM,UACNC,WAAW,SACXC,WAAY,GACZP,YAAchB,GAAUK,GAAUN,OAAegB,EAAJ,EAAcL,SAE1DZ,IAED,KACHE,EACAK,EACCM,IAACC,KAAI,CACHC,OAAO,QACPC,YAAaT,GAAU,SAAWA,OAAQU,EAC1CrB,YAAaW,GAAU,SAAWA,OAAQU,EAC1CQ,WAAY,GACZP,YAAcjB,OAAegB,EAAJ,KACrBtB,IAEJ,KACHM,EACAE,EAAWU,IAACF,SAAe,CAAAC,SAAET,IAA8B,OAChD,IAGlB,CACEuB,MAAOC,MACPC,YA1EmB"}
1
+ {"version":3,"file":"FormInputLabel.mjs","sources":["../../../../src/components/FormInputLabel/FormInputLabel.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { SIZES, SIZES_CONTAINER } from './sizes'\nimport * as Styled from './style'\nimport type { FormInputLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormInputLabel'\n\nconst FormInputLabel: React.ForwardRefExoticComponent<FormInputLabelProps> = withMergedProps<\n FormInputLabelProps,\n HTMLDivElement\n>(\n forwardRef<HTMLDivElement, MergedProps<FormInputLabelProps>>((props, ref) => {\n const {\n size = 'm',\n iconProps = {},\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n icon,\n input,\n text,\n controls,\n addon,\n dropdown,\n ...restProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const [before, after] = Array.isArray(icon) ? icon : [icon]\n\n return (\n <Styled.Root {...restProps} {...sizeProps} ref={ref}>\n {before ? (\n <Icon\n preset='brand'\n name={typeof before === 'string' ? before : undefined}\n icon={typeof before !== 'string' ? before : undefined}\n marginRight='var(--gap)'\n {...sizeProps}\n {...iconProps}\n />\n ) : null}\n <Styled.Container {...sizeProps} sizes={SIZES_CONTAINER} grow={1}>\n {input}\n </Styled.Container>\n {text ? (\n <Styled.Container\n {...sizeProps}\n sizes={SIZES_CONTAINER}\n marginLeft='var(--gap)'\n marginRight={!addon && !after && !controls ? 8 : undefined}\n >\n <Text size='inherit' color='inherit' lineHeight='inherit' whiteSpace='nowrap'>\n {text}\n </Text>\n </Styled.Container>\n ) : null}\n {addon}\n {after ? (\n <Icon\n preset='brand'\n name={typeof after === 'string' ? after : undefined}\n icon={typeof after !== 'string' ? after : undefined}\n marginLeft='var(--gap)'\n marginRight={!controls ? 4 : undefined}\n {...sizeProps}\n {...iconProps}\n />\n ) : null}\n {controls}\n {dropdown ? <Styled.Dropdown>{dropdown}</Styled.Dropdown> : null}\n </Styled.Root>\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { FormInputLabel, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","FormInputLabel","withMergedProps","forwardRef","props","ref","size","iconProps","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","icon","input","text","controls","addon","dropdown","restProps","sizeProps","before","after","Array","isArray","_jsxs","Styled","children","_jsx","Icon","preset","name","undefined","marginRight","sizes","SIZES_CONTAINER","grow","marginLeft","Text","color","lineHeight","whiteSpace","SIZES","displayName"],"mappings":"wSASMA,MAAAA,eAAiB,iBAEjBC,MAAAA,eAAuEC,gBAI3EC,YAA6D,CAACC,EAAOC,KACnE,MAAMC,KACJA,EAAO,IAAGC,UACVA,EAAY,CAAE,EAAAC,QACdA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,KACNA,EAAIC,MACJA,EAAKC,KACLA,EAAIC,SACJA,EAAQC,MACRA,EAAKC,SACLA,KACGC,GACDhB,EAEJ,MAAMiB,EAAY,CAChBf,OACAE,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAOS,EAAQC,GAASC,MAAMC,QAAQX,GAAQA,EAAO,CAACA,GAEtD,OACEY,KAACC,KAAW,IAAKP,KAAeC,EAAWhB,IAAKA,EAAIuB,SACjDN,CAAAA,EACCO,IAACC,KAAI,CACHC,OAAO,QACPC,YAAaV,GAAW,SAAWA,OAASW,EAC5CnB,YAAaQ,GAAW,SAAWA,OAASW,EAC5CC,YAAY,gBACRb,KACAd,IAEJ,KACJsB,IAACF,UAAgB,IAAKN,EAAWc,MAAOC,gBAAiBC,KAAM,EAAET,SAC9Db,IAEFC,EACCa,IAACF,UAAgB,IACXN,EACJc,MAAOC,gBACPE,WAAW,aACXJ,YAAchB,GAAUK,GAAUN,OAAegB,EAAJ,EAAcL,SAE3DC,IAACU,KAAI,CAACjC,KAAK,UAAUkC,MAAM,UAAUC,WAAW,UAAUC,WAAW,SAAQd,SAC1EZ,MAGH,KACHE,EACAK,EACCM,IAACC,KAAI,CACHC,OAAO,QACPC,YAAaT,GAAU,SAAWA,OAAQU,EAC1CnB,YAAaS,GAAU,SAAWA,OAAQU,EAC1CK,WAAW,aACXJ,YAAcjB,OAAegB,EAAJ,KACrBZ,KACAd,IAEJ,KACHU,EACAE,EAAWU,IAACF,SAAe,CAAAC,SAAET,IAA8B,OAChD,IAGlB,CACEgB,MAAOQ,MACPC,YAnFmB"}
@@ -0,0 +1,2 @@
1
+ 'use strict';exports.SIZES={l:{fontSize:18,paddingRight:8,paddingLeft:16,height:56,borderRadius:12,'--gap':'12px'},m:{fontSize:16,paddingRight:8,paddingLeft:16,height:48,borderRadius:10,'--gap':'12px'},s:{fontSize:14,paddingRight:6,paddingLeft:14,height:40,borderRadius:8,'--gap':'12px'},xs:{fontSize:14,paddingRight:4,paddingLeft:10,height:32,borderRadius:7,'--gap':'8px'}},exports.SIZES_CONTAINER={l:{paddingTop:14,paddingBottom:6},m:{paddingTop:11,paddingBottom:4},s:{paddingTop:9,paddingBottom:3},xs:{paddingTop:5,paddingBottom:0}};
2
+ //# sourceMappingURL=sizes.js.map