npm - @foxford/ui - Versions diffs - 2.47.0 → 2.48.0 - Mend

@foxford/ui 2.47.0 → 2.48.0

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

Files changed (96) hide show

package/components/Dropdown/Dropdown.js.map CHANGED Viewed

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

package/components/Dropdown/Dropdown.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{forwardRef,useMemo,useState,useRef,useEffect,useLayoutEffect,createElement}from'react';import Fuse from'../../external/.pnpm/fuse.js@7.0.0/node_modules/fuse.js/dist/fuse.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{focusFirstFocusable}from'../../shared/utils/dom.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{DropdownMenu}from'./DropdownMenu.mjs';import{DropdownMenuNoOptions}from'./DropdownMenuNoOptions.mjs';import{SIZES,FuseSearchKeys,SIZES_CHECKBOX}from'./constants.mjs';import{getDropdownInputText,getDropdownInputValue,getDropdownInputMultipleValue,groupDropdownOptions}from'./utils.mjs';import{ChevronIcon,Input}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{FormInputLabel}from'../FormInputLabel/FormInputLabel.mjs';import{Chip}from'../Chip/Chip.mjs';import{MenuList}from'../MenuList/MenuList.mjs';import{ListItem}from'../ListItem/ListItem.mjs';import{InputCheckbox}from'../InputCheckbox/InputCheckbox.mjs';import{MenuDivider}from'../MenuDivider/MenuDivider.mjs';const COMPONENT_NAME='Dropdown';const Dropdown=withMergedProps(forwardRef(((e,o)=>{const{size:t="m",name:r="fox-dropdown",labelPosition:n="dynamic",optionsMultiToggle:s=!0,loading:a=!1,iconProps:l={},menuProps:i={},autoFocus:c,closeMenuOnScroll:d,contrast:u,selectedOption:p,defaultSelectedOption:m,icon:b,inputMode:g,label:f,loadingMessage:v,loadingIcon:C,loadingIconProps:h,maxLength:k,multiple:x,onCloseMenu:w,onOpenMenu:y,onSelectOption:D,options:I,optionsMultiToggleCaption:M,optionsEmptyMessage:j,optionsEmptyIcon:E,optionsEmptyIconProps:S,palette:P,placeholder:L,readOnly:F,required:T,status:z,sizeXXS:K,sizeXS:O,sizeS:B,sizeM:R,sizeL:X,sizeXL:H,form:N,..._}=e;const V={size:t,sizeXXS:K,sizeXS:O,sizeS:B,sizeM:R,sizeL:X,sizeXL:H};const Z={size:24,color:_.disabled?'content-disabled':'content-onmain-tertiary'};const A=useMemo((()=>{const e=new Fuse(I,{threshold:.4,ignoreLocation:!0,keys:[FuseSearchKeys.text,FuseSearchKeys.tags]});return o=>o.length===0?I:e.search(o).map((e=>e.item))}),[I]);const[U,q]=useState((()=>x?'':getDropdownInputText(p!==void 0?p:m)));const[G,J]=useState((()=>getDropdownInputValue(p!==void 0?p:m)));const[Q,W]=useState((()=>getDropdownInputMultipleValue(p!==void 0?p:m)));const[Y,$]=useState((()=>A(U)));const[ee,oe]=useState(!1);const te=x?groupDropdownOptions(I,Q):[[],[]];const re=ee&&!_.disabled;const ne=Y.length===0||a;const se=Boolean(re||U);const ae=x?Q.length===0:G.length===0;const le=te[0].length>0&&te[1].length===0;const ie=te[0].length>0&&te[1].length>0;const ce=useRef(null);const de=useRef(null);const ue=useRef(null);const pe=useRef(null);const me=useRef(U);const be=useRef(re);useEffect((()=>(U===me.current?$(A(U)):(me.current=U,pe.current=setTimeout((()=>{$(A(U))}),150)),()=>{pe.current&&clearTimeout(pe.current)})),[A,U]),useLayoutEffect((()=>{p!==void 0&&(x?W(getDropdownInputMultipleValue(p)):(q(getDropdownInputText(p)),J(getDropdownInputValue(p))))}),[x,p]),useEffect((()=>{re!==be.current&&(re&&y&&y(),!re&&w&&w(),be.current=re)}),[re,w,y]),useEffect((()=>{const handleScroll=e=>{ce.current?.focus(),oe(!1),e.currentTarget&&e.currentTarget.removeEventListener(e.type,handleScroll)};return d&&re&&document.addEventListener('scroll',handleScroll),()=>{document.removeEventListener('scroll',handleScroll)}}),[d,re]);const syncInputTextWithSelectedOption=()=>{let e='';if(!x){const o=I.find((e=>e.value===G));e=o?o.text:''}q(e)};return jsx(FormInputLabel,{..._,...V,ref:o,label:f,labelPosition:n,active:se,onColored:u,error:z==='error',success:z==='success',icon:[b,jsx(ChevronIcon,{up:re},'chevron')],iconProps:{...Z,...l},palette:{color:_.disabled?P.labelColorDisabled:P.labelColor,colorHover:_.disabled?P.labelColorDisabled:P.labelColorHover,backgroundColor:_.disabled?P.backgroundColorDisabled:P.backgroundColor,backgroundColorHover:_.disabled?P.backgroundColorDisabled:P.backgroundColorHover,borderColor:_.disabled?P.borderColorDisabled:P.borderColor,borderColorHover:_.disabled?P.borderColorDisabled:P.borderColor},onClick:e=>{_.onClick&&_.onClick(e),_.disabled||(ce.current?.focus(),re?de.current&&e.target instanceof Node&&!de.current.contains(e.target)&&oe(!1):oe(!0))},onKeyUp:e=>{_.onKeyUp&&_.onKeyUp(e),keyboardKeys.Esc.validate(e.key)&&(ce.current?.focus(),oe(!1))},onPointerDown:e=>{_.onPointerDown&&_.onPointerDown(e),e.target!==ce.current&&e.target instanceof Node&&e.currentTarget.contains(e.target)&&e.preventDefault()},onBlur:e=>{_.onBlur&&_.onBlur(e),e.currentTarget.contains(e.relatedTarget)||(syncInputTextWithSelectedOption(),oe(!1))},input:jsxs(Fragment,{children:[jsx(Input,{ref:ce,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",autoFocus:c,inputMode:g,maxLength:k,placeholder:L,readOnly:F,required:T&&ae,disabled:_.disabled,label:f,labelPosition:n,active:se,value:U,palette:{color:P.color,colorDisabled:P.colorDisabled,placeholderColor:P.placeholderColor,placeholderColorDisabled:P.placeholderColorDisabled},onClick:e=>{re&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{q(e.currentTarget.value),oe(!0)},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(syncInputTextWithSelectedOption(),oe(!1)),!keyboardKeys.Space.validate(e.key)||re&&e.currentTarget.selectionStart!==0||(e.preventDefault(),oe((e=>!e))),keyboardKeys.ArrowDown.validate(e.key)&&ue.current&&(e.preventDefault(),focusFirstFocusable(ue.current))}}),x?Q.map((e=>jsx("input",{type:"hidden",name:r,value:e,form:N,disabled:_.disabled},e))):G.length>0&&jsx("input",{type:"hidden",name:r,value:G,form:N,disabled:_.disabled})]}),addon:x&&Q.length>0?jsx(Chip,{size:"xs",active:!0,black:!0,disabled:_.disabled,cursor:_.disabled?'not-allowed':void 0,text:Q.length,textProps:{appearance:'caption',size:'xs'},palette:_.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{contrast:!_.disabled,onKeyDown:e=>{keyboardKeys.ArrowDown.validate(e.key)&&ue.current&&(e.preventDefault(),focusFirstFocusable(ue.current))},onClick:e=>{e.stopPropagation(),F||(p===void 0&&W([]),D&&D([]),ce.current?.focus(),oe(!0))}}}):void 0,dropdown:re?jsx(DropdownMenu,{...i,ref:de,tabIndex:ne?void 0:0,secondary:!u,elevated:u,disableAutoFocus:!0,palette:{backgroundColor:P.menuBackgroundColor,borderColor:P.menuBorderColor},onFocus:e=>{ue.current&&e.target===e.currentTarget&&(ue.current.contains(e.relatedTarget)?ce.current?.focus():focusFirstFocusable(ue.current))},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(ce.current?.focus(),syncInputTextWithSelectedOption(),oe(!1))},children:ne?jsx(DropdownMenuNoOptions,{loading:a,loadingMessage:v,loadingIcon:C,loadingIconProps:{...Z,...h},emptyMessage:j,emptyIcon:E,emptyIconProps:{...Z,...S}}):jsx(MenuList,x?{ref:ue,children:U.length>0?jsx(Fragment,{children:Y.map((e=>{const o=Q.includes(e.value);const t=e.status??z;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{...V,key:e.value,text:e.text,danger:n,success:s,disabled:_.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:o,error:n,success:s,onChange:e=>{if(!F){const t=o?Q.filter((o=>o!==e.currentTarget.value)):[...Q,e.currentTarget.value];p===void 0&&W(t),D&&D(I.filter((e=>t.includes(e.value))))}}})})}))}):jsxs(Fragment,{children:[s&&jsx(ListItem,{...V,text:M,disabled:_.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{F&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,checked:le,indeterminate:ie,error:(le||ie)&&z==='error',success:(le||ie)&&z==='success',onChange:()=>{if(!F){const e=le||ie?[]:I.map((e=>e.value));p===void 0&&W(e),D&&D(e.length===0?[]:I)}}})}),s&&jsx(MenuDivider,{}),te[0].map((e=>{const o=e.status??z;const t=o==='error';const n=o==='success';return createElement(ListItem,{...V,key:e.value,active:!0,text:e.text,danger:t,success:n,disabled:_.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{F&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!0,error:t,success:n,onChange:e=>{if(!F){const o=Q.filter((o=>o!==e.currentTarget.value));p===void 0&&W(o),D&&D(I.filter((e=>o.includes(e.value))))}}})})})),te[0].length>0&&te[1].length>0&&jsx(MenuDivider,{}),te[1].map((e=>createElement(ListItem,{...V,key:e.value,text:e.text,disabled:_.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{F&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!1,onChange:e=>{if(!F){const o=[...Q,e.currentTarget.value];p===void 0&&W(o),D&&D(I.filter((e=>o.includes(e.value))))}}})})))]})}:{ref:ue,children:Y.map((e=>{const o=G===e.value;return createElement(ListItem,{...V,key:e.value,text:e.text,active:o,danger:o&&z==='error',success:o&&z==='success',disabled:_.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:t=>{if(t.stopPropagation(),!F){const t=o?null:e;p===void 0&&(q(getDropdownInputText(t)),J(getDropdownInputValue(t))),D&&D(t),ce.current?.focus(),oe(!t)}}})}))})}):void 0})})),{sizes:SIZES,displayName:"Dropdown"});export{COMPONENT_NAME,Dropdown};
+import{forwardRef,useMemo,useState,useRef,useEffect,useLayoutEffect,createElement}from'react';import Fuse from'../../external/.pnpm/fuse.js@7.0.0/node_modules/fuse.js/dist/fuse.mjs';import{nanoid}from'../../external/.pnpm/nanoid@5.0.7/node_modules/nanoid/index.browser.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{focusFirstFocusable}from'../../shared/utils/dom.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{DropdownMenu}from'./DropdownMenu.mjs';import{DropdownMenuNoOptions}from'./DropdownMenuNoOptions.mjs';import{SIZES,FuseSearchKeys,SIZES_CHECKBOX}from'./constants.mjs';import{getDropdownInputText,getDropdownInputValue,getDropdownInputMultipleValue,groupDropdownOptions}from'./utils.mjs';import{ChevronIcon}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{FormInputLabel}from'../FormInputLabel/FormInputLabel.mjs';import{FormInput}from'../FormInput/FormInput.mjs';import{Chip}from'../Chip/Chip.mjs';import{MenuList}from'../MenuList/MenuList.mjs';import{ListItem}from'../ListItem/ListItem.mjs';import{InputCheckbox}from'../InputCheckbox/InputCheckbox.mjs';import{MenuDivider}from'../MenuDivider/MenuDivider.mjs';const COMPONENT_NAME='Dropdown';const Dropdown=withMergedProps(forwardRef(((e,o)=>{const{size:t="m",name:r="fox-dropdown",labelPosition:n="dynamic",optionsMultiToggle:s=!0,loading:a=!1,iconProps:l={},menuProps:i={},autoFocus:c,closeMenuOnScroll:d,contrast:u,selectedOption:p,defaultSelectedOption:m,icon:g,inputMode:b,loadingMessage:f,loadingIcon:v,loadingIconProps:C,maxLength:h,multiple:x,onCloseMenu:k,onOpenMenu:w,onSelectOption:y,options:I,optionsMultiToggleCaption:D,optionsEmptyMessage:j,optionsEmptyIcon:M,optionsEmptyIconProps:E,palette:S,placeholder:P,readOnly:F,required:L,status:T,sizeXXS:z,sizeXS:K,sizeS:O,sizeM:B,sizeL:R,sizeXL:X,form:N,...H}=e;const _={size:t,sizeXXS:z,sizeXS:K,sizeS:O,sizeM:B,sizeL:R,sizeXL:X};const V={size:24,color:H.disabled?'content-disabled':'content-onmain-tertiary'};const Z=useMemo((()=>nanoid()),[]);const A=useMemo((()=>{const e=new Fuse(I,{threshold:.4,ignoreLocation:!0,keys:[FuseSearchKeys.text,FuseSearchKeys.tags]});return o=>o.length===0?I:e.search(o).map((e=>e.item))}),[I]);const[U,q]=useState((()=>x?'':getDropdownInputText(p!==void 0?p:m)));const[G,J]=useState((()=>getDropdownInputValue(p!==void 0?p:m)));const[Q,W]=useState((()=>getDropdownInputMultipleValue(p!==void 0?p:m)));const[Y,$]=useState((()=>A(U)));const[ee,oe]=useState(!1);const te=x?groupDropdownOptions(I,Q):[[],[]];const re=ee&&!H.disabled;const ne=Y.length===0||a;const se=Boolean(re||U);const ae=x?Q.length===0:G.length===0;const le=te[0].length>0&&te[1].length===0;const ie=te[0].length>0&&te[1].length>0;const ce=useRef(null);const de=useRef(null);const ue=useRef(null);const pe=useRef(null);const me=useRef(U);const ge=useRef(re);useEffect((()=>(U===me.current?$(A(U)):(me.current=U,pe.current=setTimeout((()=>{$(A(U))}),150)),()=>{pe.current&&clearTimeout(pe.current)})),[A,U]),useLayoutEffect((()=>{p!==void 0&&(x?W(getDropdownInputMultipleValue(p)):(q(getDropdownInputText(p)),J(getDropdownInputValue(p))))}),[x,p]),useEffect((()=>{re!==ge.current&&(re&&w&&w(),!re&&k&&k(),ge.current=re)}),[re,k,w]),useEffect((()=>{const handleScroll=e=>{ce.current?.focus(),oe(!1),e.currentTarget&&e.currentTarget.removeEventListener(e.type,handleScroll)};return d&&re&&document.addEventListener('scroll',handleScroll),()=>{document.removeEventListener('scroll',handleScroll)}}),[d,re]);const syncInputTextWithSelectedOption=()=>{let e='';if(!x){const o=I.find((e=>e.value===G));e=o?o.text:''}q(e)};return jsx(FormInputLabel,{...H,..._,ref:o,labelId:Z,labelPosition:n,active:se,onColored:u,error:T==='error',success:T==='success',icon:[g,jsx(ChevronIcon,{up:re},'chevron')],iconProps:{...V,...l},palette:{color:H.disabled?S.labelColorDisabled:S.labelColor,backgroundColor:H.disabled?S.backgroundColorDisabled:S.backgroundColor,backgroundColorHover:H.disabled?S.backgroundColorDisabled:S.backgroundColorHover,borderColor:H.disabled?S.borderColorDisabled:S.borderColor},onClick:e=>{H.onClick&&H.onClick(e),H.disabled||(ce.current?.focus(),re?de.current&&e.target instanceof Node&&!de.current.contains(e.target)&&oe(!1):oe(!0))},onKeyUp:e=>{H.onKeyUp&&H.onKeyUp(e),keyboardKeys.Esc.validate(e.key)&&(ce.current?.focus(),oe(!1))},onPointerDown:e=>{H.onPointerDown&&H.onPointerDown(e),e.target!==ce.current&&e.target instanceof Node&&e.currentTarget.contains(e.target)&&e.preventDefault()},onBlur:e=>{H.onBlur&&H.onBlur(e),e.currentTarget.contains(e.relatedTarget)||(syncInputTextWithSelectedOption(),oe(!1))},input:jsxs(Fragment,{children:[jsx(FormInput,{ref:ce,"aria-labelledby":H.label?Z:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",autoFocus:c,inputMode:b,maxLength:h,placeholder:P,readOnly:F,required:L&&ae,disabled:H.disabled,value:U,palette:{color:S.color,colorDisabled:S.colorDisabled,placeholderColor:S.placeholderColor,placeholderColorDisabled:S.placeholderColorDisabled},onClick:e=>{re&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{q(e.currentTarget.value),oe(!0)},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(syncInputTextWithSelectedOption(),oe(!1)),!keyboardKeys.Space.validate(e.key)||re&&e.currentTarget.selectionStart!==0||(e.preventDefault(),oe((e=>!e))),keyboardKeys.ArrowDown.validate(e.key)&&ue.current&&(e.preventDefault(),focusFirstFocusable(ue.current))}}),x?Q.map((e=>jsx("input",{type:"hidden",name:r,value:e,form:N,disabled:H.disabled},e))):G.length>0&&jsx("input",{type:"hidden",name:r,value:G,form:N,disabled:H.disabled})]}),addon:x&&Q.length>0?jsx(Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:H.disabled,cursor:H.disabled?'not-allowed':void 0,text:Q.length,textProps:{appearance:'caption',size:'xs'},palette:H.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{contrast:!H.disabled,onKeyDown:e=>{keyboardKeys.ArrowDown.validate(e.key)&&ue.current&&(e.preventDefault(),focusFirstFocusable(ue.current))},onClick:e=>{e.stopPropagation(),F||(p===void 0&&W([]),y&&y([]),ce.current?.focus(),oe(!0))}}}):void 0,dropdown:re?jsx(DropdownMenu,{...i,ref:de,tabIndex:ne?void 0:0,secondary:!u,elevated:u,disableAutoFocus:!0,palette:{backgroundColor:S.menuBackgroundColor,borderColor:S.menuBorderColor},onFocus:e=>{ue.current&&e.target===e.currentTarget&&(ue.current.contains(e.relatedTarget)?ce.current?.focus():focusFirstFocusable(ue.current))},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(ce.current?.focus(),syncInputTextWithSelectedOption(),oe(!1))},children:ne?jsx(DropdownMenuNoOptions,{loading:a,loadingMessage:f,loadingIcon:v,loadingIconProps:{...V,...C},emptyMessage:j,emptyIcon:M,emptyIconProps:{...V,...E}}):jsx(MenuList,x?{ref:ue,children:U.length>0?jsx(Fragment,{children:Y.map((e=>{const o=Q.includes(e.value);const t=e.status??T;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{..._,key:e.value,text:e.text,danger:n,success:s,disabled:H.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:o,error:n,success:s,onChange:e=>{if(!F){const t=o?Q.filter((o=>o!==e.currentTarget.value)):[...Q,e.currentTarget.value];p===void 0&&W(t),y&&y(I.filter((e=>t.includes(e.value))))}}})})}))}):jsxs(Fragment,{children:[s&&jsx(ListItem,{..._,text:D,disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{F&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,checked:le,indeterminate:ie,error:(le||ie)&&T==='error',success:(le||ie)&&T==='success',onChange:()=>{if(!F){const e=le||ie?[]:I.map((e=>e.value));p===void 0&&W(e),y&&y(e.length===0?[]:I)}}})}),s&&jsx(MenuDivider,{}),te[0].map((e=>{const o=e.status??T;const t=o==='error';const n=o==='success';return createElement(ListItem,{..._,key:e.value,active:!0,text:e.text,danger:t,success:n,disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{F&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!0,error:t,success:n,onChange:e=>{if(!F){const o=Q.filter((o=>o!==e.currentTarget.value));p===void 0&&W(o),y&&y(I.filter((e=>o.includes(e.value))))}}})})})),te[0].length>0&&te[1].length>0&&jsx(MenuDivider,{}),te[1].map((e=>createElement(ListItem,{..._,key:e.value,text:e.text,disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{F&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!1,onChange:e=>{if(!F){const o=[...Q,e.currentTarget.value];p===void 0&&W(o),y&&y(I.filter((e=>o.includes(e.value))))}}})})))]})}:{ref:ue,children:Y.map((e=>{const o=G===e.value;return createElement(ListItem,{..._,key:e.value,text:e.text,active:o,danger:o&&T==='error',success:o&&T==='success',disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:t=>{if(t.stopPropagation(),!F){const t=o?null:e;p===void 0&&(q(getDropdownInputText(t)),J(getDropdownInputValue(t))),y&&y(t),ce.current?.focus(),oe(!t)}}})}))})}):void 0})})),{sizes:SIZES,displayName:"Dropdown"});export{COMPONENT_NAME,Dropdown};
 //# sourceMappingURL=Dropdown.mjs.map

package/components/Dropdown/Dropdown.mjs.map CHANGED Viewed

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

package/components/Dropdown/style.js CHANGED Viewed

@@ -1,2 +1,2 @@
-'use strict';var styled=require('styled-components');var MenuComponent=require('../MenuComponent/MenuComponent.js');var index=require('../../external/.pnpm/@foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.js');var index$1=require('../../external/.pnpm/@foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.js');function _interopDefault(n){return n&&n.__esModule?n:{default:n}}var styled__default=_interopDefault(styled);const Input=styled__default.default.input.withConfig({shouldForwardProp:n=>!['palette','preset','label','labelPosition','active'].includes(n)}).withConfig({displayName:"Dropdown__Input",componentId:"ui__sc-519mcg-0"})([""," ",""],(n=>{let o='1';let e='0px';return n.label&&n.labelPosition==='dynamic'&&(o=""+(n.active?1:0),e='0.8em'),n.label&&n.labelPosition==='top'&&(e='0.8em'),n.label&&n.labelPosition==='center'&&(o=""+(n.active?1:0)),`\n      box-sizing: border-box;\n      appearance: textfield;\n      border: none;\n      padding: 0;\n      margin: 0;\n      font-size: inherit;\n      line-height: inherit;\n      background-color: transparent;\n      width: 100%;\n      align-self: stretch;\n      opacity: ${o};\n      padding-top: ${e};\n      cursor: ${n.disabled?'not-allowed':'pointer'};\n\n      &:focus {\n        cursor: text;\n        outline: none;\n      }\n    `}),(n=>{return`\n  color: ${(o={color:n.palette.color??n.theme.colors['content-onmain-primary'],placeholderColor:n.palette.placeholderColor??n.theme.colors['content-onmain-secondary'],colorDisabled:n.palette.colorDisabled??n.theme.colors['content-disabled'],placeholderColorDisabled:n.palette.placeholderColorDisabled??n.theme.colors['content-disabled']}).color};\n  &::placeholder {\n    color: ${o.placeholderColor};\n  }\n  &:disabled {\n    color: ${o.colorDisabled};\n  }\n  &:disabled::placeholder {\n    color: ${o.placeholderColorDisabled};\n  }\n`;var o}));const PositionedMenuComponent=styled__default.default(MenuComponent.MenuComponent).withConfig({shouldForwardProp:n=>!['expanseDirectionLeft'].includes(n)}).withConfig({displayName:"Dropdown__PositionedMenuComponent",componentId:"ui__sc-519mcg-1"})(["position:absolute;",""],(n=>`\n    top: 0;\n    left: ${n.expanseDirectionLeft?'auto':0};\n    right: ${n.expanseDirectionLeft?0:'auto'};  \n  `));const spinAnimation=styled.keyframes(["100%{transform:rotate(360deg);}"]);const IconContainer=styled__default.default.div.withConfig({displayName:"Dropdown__IconContainer",componentId:"ui__sc-519mcg-2"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:12px 0;"]);const ChevronIcon=styled__default.default(index.ChevronDown).withConfig({shouldForwardProp:n=>n!=='up'}).withConfig({displayName:"Dropdown__ChevronIcon",componentId:"ui__sc-519mcg-3"})(["",""],(n=>`\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${n.up?180:0}deg);\n  `));const LoadingIconAnimated=styled__default.default(index$1.LoaderFill).withConfig({displayName:"Dropdown__LoadingIconAnimated",componentId:"ui__sc-519mcg-4"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);exports.ChevronIcon=ChevronIcon,exports.IconContainer=IconContainer,exports.Input=Input,exports.LoadingIconAnimated=LoadingIconAnimated,exports.PositionedMenuComponent=PositionedMenuComponent;
+'use strict';var styled=require('styled-components');var MenuComponent=require('../MenuComponent/MenuComponent.js');var index=require('../../external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.js');var index$1=require('../../external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.js');function _interopDefault(n){return n&&n.__esModule?n:{default:n}}var styled__default=_interopDefault(styled);const PositionedMenuComponent=styled__default.default(MenuComponent.MenuComponent).withConfig({shouldForwardProp:n=>!['expanseDirectionLeft'].includes(n)}).withConfig({displayName:"Dropdown__PositionedMenuComponent",componentId:"ui__sc-519mcg-0"})(["position:absolute;",""],(n=>`\n    top: 0;\n    left: ${n.expanseDirectionLeft?'auto':0};\n    right: ${n.expanseDirectionLeft?0:'auto'};  \n  `));const spinAnimation=styled.keyframes(["100%{transform:rotate(360deg);}"]);const IconContainer=styled__default.default.div.withConfig({displayName:"Dropdown__IconContainer",componentId:"ui__sc-519mcg-1"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:12px 0;"]);const ChevronIcon=styled__default.default(index.ChevronDown).withConfig({shouldForwardProp:n=>n!=='up'}).withConfig({displayName:"Dropdown__ChevronIcon",componentId:"ui__sc-519mcg-2"})(["",""],(n=>`\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${n.up?180:0}deg);\n  `));const LoadingIconAnimated=styled__default.default(index$1.LoaderFill).withConfig({displayName:"Dropdown__LoadingIconAnimated",componentId:"ui__sc-519mcg-3"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);exports.ChevronIcon=ChevronIcon,exports.IconContainer=IconContainer,exports.LoadingIconAnimated=LoadingIconAnimated,exports.PositionedMenuComponent=PositionedMenuComponent;
 //# sourceMappingURL=style.js.map

package/components/Dropdown/style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"style.js","sources":["../../../../src/components/Dropdown/style.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components'\nimport { LoaderFill, ChevronDown } from '@foxford/icon-pack'\nimport { MenuComponent } from 'components/MenuComponent'\nimport type { ~~DropdownInputPalette,~~ DropdownMenuProps, ~~StyledDropdownInputProps,~~ StyledChevronIconProps } from './types'\n\nconst template = (palette: DropdownInputPalette) => `\n color: ${palette.color};\n &::placeholder {\n color: ${palette.placeholderColor};\n }\n &:disabled {\n color: ${palette.colorDisabled};\n }\n &:disabled::placeholder {\n color: ${palette.placeholderColorDisabled};\n }\n`\n\nexport const Input = styled.input.withConfig<StyledDropdownInputProps>({\n shouldForwardProp: (propKey) => !['palette', 'preset', 'label', 'labelPosition', 'active'].includes(propKey),\n})`\n ${(props) => {\n let opacity = '1'\n let paddingTop = '0px'\n\n if (props.label && props.labelPosition === 'dynamic') {\n opacity = `${props.active ? 1 : 0}`\n paddingTop = '0.8em'\n }\n\n if (props.label && props.labelPosition === 'top') {\n paddingTop = '0.8em'\n }\n\n if (props.label && props.labelPosition === 'center') {\n opacity = `${props.active ? 1 : 0}`\n }\n\n return `\n box-sizing: border-box;\n appearance: textfield;\n border: none;\n padding: 0;\n margin: 0;\n font-size: inherit;\n line-height: inherit;\n background-color: transparent;\n width: 100%;\n align-self: stretch;\n opacity: ${opacity};\n padding-top: ${paddingTop};\n cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n\n &:focus {\n cursor: text;\n outline: none;\n }\n `\n }}\n ${(props) =>\n template({\n color: props.palette.color ?? props.theme.colors['content-onmain-primary'],\n placeholderColor: props.palette.placeholderColor ?? props.theme.colors['content-onmain-secondary'],\n colorDisabled: props.palette.colorDisabled ?? props.theme.colors['content-disabled'],\n placeholderColorDisabled: props.palette.placeholderColorDisabled ?? props.theme.colors['content-disabled'],\n })}\n`\n\nexport const PositionedMenuComponent = styled(MenuComponent).withConfig<DropdownMenuProps>({\n shouldForwardProp: (propKey) => !['expanseDirectionLeft'].includes(propKey),\n})`\n position: absolute;\n\n ${(props) => `\n top: 0;\n left: ${props.expanseDirectionLeft ? 'auto' : 0};\n right: ${props.expanseDirectionLeft ? 0 : 'auto'}; \n `}\n`\n\nconst spinAnimation = keyframes`\n 100% {\n transform: rotate(360deg);\n }\n`\n\nexport const IconContainer = styled.div`\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 12px 0;\n`\n\nexport const ChevronIcon = styled(ChevronDown).withConfig<StyledChevronIconProps>({\n shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n ${(props) => `\n transition-property: transform;\n transition-duration: 250ms;\n transform-origin: center;\n transform: rotate(${props.up ? 180 : 0}deg);\n `}\n`\n\nexport const LoadingIconAnimated = styled(LoaderFill)`\n transform-origin: center;\n animation: ${spinAnimation} 1600ms infinite linear;\n`\n"],"names":["~~Input~~","styled","~~input~~","withConfig","shouldForwardProp","propKey","includes","displayName","componentId","props","opacity","paddingTop","label","labelPosition","active","disabled","template","palette","color","theme","colors","placeholderColor","colorDisabled","placeholderColorDisabled","PositionedMenuComponent","default","MenuComponent","expanseDirectionLeft","spinAnimation","keyframes","IconContainer","div","ChevronIcon","ChevronDown","up","LoadingIconAnimated","LoaderFill"],"mappings":"~~sjBAkBO~~,MAAMA,~~MAAQC~~,~~gBAAAA~~,QAAOC,MAAMC,WAAqC,CACrEC,kBAAoBC,IAAa,CAAC,UAAW,SAAU,QAAS,gBAAiB,UAAUC,SAASD,KACpGF,WAAA,CAAAI,YAAA,kBAAAC,YAAA,mBAFmBP,CAEnB,CAAA,GAAA,IAAA,KACGQ,IACD,IAAIC,EAAU,IACd,IAAIC,EAAa,MAejB,OAbIF,EAAMG,OAASH,EAAMI,gBAAkB,YACzCH,EAAU,IAAGD,EAAMK,OAAS,EAAI,GAChCH,EAAa,SAGXF,EAAMG,OAASH,EAAMI,gBAAkB,QACzCF,EAAa,SAGXF,EAAMG,OAASH,EAAMI,gBAAkB,WACzCH,EAAU,IAAGD,EAAMK,OAAS,EAAI,IAG3B,yRAWMJ,0BACIC,qBACLF,EAAMM,SAAW,cAAgB,6FAM5C,IAEAN,IACDO,MAvDgD,eAAlCC,EAuDL,CACPC,MAAOT,EAAMQ,QAAQC,OAAST,EAAMU,MAAMC,OAAO,0BACjDC,iBAAkBZ,EAAMQ,QAAQI,kBAAoBZ,EAAMU,MAAMC,OAAO,4BACvEE,cAAeb,EAAMQ,QAAQK,eAAiBb,EAAMU,MAAMC,OAAO,oBACjEG,yBAA0Bd,EAAMQ,QAAQM,0BAA4Bd,EAAMU,MAAMC,OAAO,sBA1D1EF,0CAEND,EAAQI,sDAGRJ,EAAQK,gEAGRL,EAAQM,mCATHN,KA4DZ,IAGC,MAAMO,wBAA0BvB,gBAAMwB,QAACC,~~6BAAevB~~,WAA8B,CACzFC,kBAAoBC,IAAa,CAAC,wBAAwBC,SAASD,KACnEF,WAAA,CAAAI,YAAA,oCAAAC,YAAA,~~mBAFqCP~~,CAErC,CAAA,qBAAA,~~KAGGQ~~,GAAU,4BAEHA,~~EAAMkB~~,qBAAuB,OAAS,~~kBACrClB~~,~~EAAMkB~~,qBAAuB,EAAI,kBAI9C,MAAMC,cAAgBC,OAASA,UAI9B,CAAA,0CAEYC,~~cAAgB7B~~,gBAAAA,~~QAAO8B~~,~~IAAG5B~~,WAAA,CAAAI,YAAA,0BAAAC,YAAA,~~mBAAVP~~,CAM5B,CAAA,gGAEM,~~MAAM+B~~,~~YAAc/B~~,~~gBAAMwB~~,~~QAACQ~~,~~mBAAa9B~~,WAAmC,CAChFC,kBAAoBC,GAAYA,IAAY,OAC5CF,WAAA,CAAAI,YAAA,wBAAAC,YAAA,~~mBAFyBP~~,CAEzB,CAAA,GAAA,~~KACGQ~~,GAAU,gIAISA,~~EAAMyB~~,GAAK,IAAM,eAIlC,MAAMC,~~oBAAsBlC~~,~~gBAAMwB~~,~~QAACW~~,~~oBAAWjC~~,WAAA,CAAAI,YAAA,gCAAAC,YAAA,~~mBAAlBP~~,CAAkB,CAAA,qCAAA,~~4BAEtC2B~~"}
1	+ {"version":3,"file":"style.js","sources":["../../../../src/components/Dropdown/style.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components'\nimport { LoaderFill, ChevronDown } from '@foxford/icon-pack'\nimport { MenuComponent } from 'components/MenuComponent'\nimport type { DropdownMenuProps, StyledChevronIconProps } from './types'\n\nexport const PositionedMenuComponent = styled(MenuComponent).withConfig<DropdownMenuProps>({\n shouldForwardProp: (propKey) => !['expanseDirectionLeft'].includes(propKey),\n})`\n position: absolute;\n\n ${(props) => `\n top: 0;\n left: ${props.expanseDirectionLeft ? 'auto' : 0};\n right: ${props.expanseDirectionLeft ? 0 : 'auto'}; \n `}\n`\n\nconst spinAnimation = keyframes`\n 100% {\n transform: rotate(360deg);\n }\n`\n\nexport const IconContainer = styled.div`\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 12px 0;\n`\n\nexport const ChevronIcon = styled(ChevronDown).withConfig<StyledChevronIconProps>({\n shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n ${(props) => `\n transition-property: transform;\n transition-duration: 250ms;\n transform-origin: center;\n transform: rotate(${props.up ? 180 : 0}deg);\n `}\n`\n\nexport const LoadingIconAnimated = styled(LoaderFill)`\n transform-origin: center;\n animation: ${spinAnimation} 1600ms infinite linear;\n`\n"],"names":["PositionedMenuComponent","styled","default","MenuComponent","withConfig","shouldForwardProp","propKey","includes","displayName","componentId","props","expanseDirectionLeft","spinAnimation","keyframes","IconContainer","div","ChevronIcon","ChevronDown","up","LoadingIconAnimated","LoaderFill"],"mappings":"sjBAKO,MAAMA,wBAA0BC,gBAAMC,QAACC,6BAAeC,WAA8B,CACzFC,kBAAoBC,IAAa,CAAC,wBAAwBC,SAASD,KACnEF,WAAA,CAAAI,YAAA,oCAAAC,YAAA,mBAFqCR,CAErC,CAAA,qBAAA,KAGGS,GAAU,4BAEHA,EAAMC,qBAAuB,OAAS,kBACrCD,EAAMC,qBAAuB,EAAI,kBAI9C,MAAMC,cAAgBC,OAASA,UAI9B,CAAA,0CAEYC,cAAgBb,gBAAAA,QAAOc,IAAGX,WAAA,CAAAI,YAAA,0BAAAC,YAAA,mBAAVR,CAM5B,CAAA,gGAEM,MAAMe,YAAcf,gBAAMC,QAACe,mBAAab,WAAmC,CAChFC,kBAAoBC,GAAYA,IAAY,OAC5CF,WAAA,CAAAI,YAAA,wBAAAC,YAAA,mBAFyBR,CAEzB,CAAA,GAAA,KACGS,GAAU,gIAISA,EAAMQ,GAAK,IAAM,eAIlC,MAAMC,oBAAsBlB,gBAAMC,QAACkB,oBAAWhB,WAAA,CAAAI,YAAA,gCAAAC,YAAA,mBAAlBR,CAAkB,CAAA,qCAAA,4BAEtCW"}

package/components/Dropdown/style.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import styled,{keyframes}from'styled-components';import{MenuComponent}from'../MenuComponent/MenuComponent.mjs';import{ChevronDown as ChevronDown_2}from'../../external/.pnpm/@foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.mjs';import{LoaderFill as LoaderFill_2}from'../../external/.pnpm/@foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.mjs';const Input=styled.input.withConfig({shouldForwardProp:o=>!['palette','preset','label','labelPosition','active'].includes(o)}).withConfig({displayName:"Dropdown__Input",componentId:"ui__sc-519mcg-0"})([""," ",""],(o=>{let n='1';let e='0px';return o.label&&o.labelPosition==='dynamic'&&(n=""+(o.active?1:0),e='0.8em'),o.label&&o.labelPosition==='top'&&(e='0.8em'),o.label&&o.labelPosition==='center'&&(n=""+(o.active?1:0)),`\n      box-sizing: border-box;\n      appearance: textfield;\n      border: none;\n      padding: 0;\n      margin: 0;\n      font-size: inherit;\n      line-height: inherit;\n      background-color: transparent;\n      width: 100%;\n      align-self: stretch;\n      opacity: ${n};\n      padding-top: ${e};\n      cursor: ${o.disabled?'not-allowed':'pointer'};\n\n      &:focus {\n        cursor: text;\n        outline: none;\n      }\n    `}),(o=>{return`\n  color: ${(n={color:o.palette.color??o.theme.colors['content-onmain-primary'],placeholderColor:o.palette.placeholderColor??o.theme.colors['content-onmain-secondary'],colorDisabled:o.palette.colorDisabled??o.theme.colors['content-disabled'],placeholderColorDisabled:o.palette.placeholderColorDisabled??o.theme.colors['content-disabled']}).color};\n  &::placeholder {\n    color: ${n.placeholderColor};\n  }\n  &:disabled {\n    color: ${n.colorDisabled};\n  }\n  &:disabled::placeholder {\n    color: ${n.placeholderColorDisabled};\n  }\n`;var n}));const PositionedMenuComponent=styled(MenuComponent).withConfig({shouldForwardProp:o=>!['expanseDirectionLeft'].includes(o)}).withConfig({displayName:"Dropdown__PositionedMenuComponent",componentId:"ui__sc-519mcg-1"})(["position:absolute;",""],(o=>`\n    top: 0;\n    left: ${o.expanseDirectionLeft?'auto':0};\n    right: ${o.expanseDirectionLeft?0:'auto'};  \n  `));const spinAnimation=keyframes(["100%{transform:rotate(360deg);}"]);const IconContainer=styled.div.withConfig({displayName:"Dropdown__IconContainer",componentId:"ui__sc-519mcg-2"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:12px 0;"]);const ChevronIcon=styled(ChevronDown_2).withConfig({shouldForwardProp:o=>o!=='up'}).withConfig({displayName:"Dropdown__ChevronIcon",componentId:"ui__sc-519mcg-3"})(["",""],(o=>`\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${o.up?180:0}deg);\n  `));const LoadingIconAnimated=styled(LoaderFill_2).withConfig({displayName:"Dropdown__LoadingIconAnimated",componentId:"ui__sc-519mcg-4"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);export{ChevronIcon,IconContainer,Input,LoadingIconAnimated,PositionedMenuComponent};
+import styled,{keyframes}from'styled-components';import{MenuComponent}from'../MenuComponent/MenuComponent.mjs';import{ChevronDown as ChevronDown_2}from'../../external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.mjs';import{LoaderFill as LoaderFill_2}from'../../external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.mjs';const PositionedMenuComponent=styled(MenuComponent).withConfig({shouldForwardProp:n=>!['expanseDirectionLeft'].includes(n)}).withConfig({displayName:"Dropdown__PositionedMenuComponent",componentId:"ui__sc-519mcg-0"})(["position:absolute;",""],(n=>`\n    top: 0;\n    left: ${n.expanseDirectionLeft?'auto':0};\n    right: ${n.expanseDirectionLeft?0:'auto'};  \n  `));const spinAnimation=keyframes(["100%{transform:rotate(360deg);}"]);const IconContainer=styled.div.withConfig({displayName:"Dropdown__IconContainer",componentId:"ui__sc-519mcg-1"})(["box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:12px 0;"]);const ChevronIcon=styled(ChevronDown_2).withConfig({shouldForwardProp:n=>n!=='up'}).withConfig({displayName:"Dropdown__ChevronIcon",componentId:"ui__sc-519mcg-2"})(["",""],(n=>`\n    transition-property: transform;\n    transition-duration: 250ms;\n    transform-origin: center;\n    transform: rotate(${n.up?180:0}deg);\n  `));const LoadingIconAnimated=styled(LoaderFill_2).withConfig({displayName:"Dropdown__LoadingIconAnimated",componentId:"ui__sc-519mcg-3"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);export{ChevronIcon,IconContainer,LoadingIconAnimated,PositionedMenuComponent};
 //# sourceMappingURL=style.mjs.map

package/components/Dropdown/style.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"style.mjs","sources":["../../../../src/components/Dropdown/style.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components'\nimport { LoaderFill, ChevronDown } from '@foxford/icon-pack'\nimport { MenuComponent } from 'components/MenuComponent'\nimport type { ~~DropdownInputPalette,~~ DropdownMenuProps, ~~StyledDropdownInputProps,~~ StyledChevronIconProps } from './types'\n\nconst template = (palette: DropdownInputPalette) => `\n color: ${palette.color};\n &::placeholder {\n color: ${palette.placeholderColor};\n }\n &:disabled {\n color: ${palette.colorDisabled};\n }\n &:disabled::placeholder {\n color: ${palette.placeholderColorDisabled};\n }\n`\n\nexport const Input = styled.input.withConfig<StyledDropdownInputProps>({\n shouldForwardProp: (propKey) => !['palette', 'preset', 'label', 'labelPosition', 'active'].includes(propKey),\n})`\n ${(props) => {\n let opacity = '1'\n let paddingTop = '0px'\n\n if (props.label && props.labelPosition === 'dynamic') {\n opacity = `${props.active ? 1 : 0}`\n paddingTop = '0.8em'\n }\n\n if (props.label && props.labelPosition === 'top') {\n paddingTop = '0.8em'\n }\n\n if (props.label && props.labelPosition === 'center') {\n opacity = `${props.active ? 1 : 0}`\n }\n\n return `\n box-sizing: border-box;\n appearance: textfield;\n border: none;\n padding: 0;\n margin: 0;\n font-size: inherit;\n line-height: inherit;\n background-color: transparent;\n width: 100%;\n align-self: stretch;\n opacity: ${opacity};\n padding-top: ${paddingTop};\n cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n\n &:focus {\n cursor: text;\n outline: none;\n }\n `\n }}\n ${(props) =>\n template({\n color: props.palette.color ?? props.theme.colors['content-onmain-primary'],\n placeholderColor: props.palette.placeholderColor ?? props.theme.colors['content-onmain-secondary'],\n colorDisabled: props.palette.colorDisabled ?? props.theme.colors['content-disabled'],\n placeholderColorDisabled: props.palette.placeholderColorDisabled ?? props.theme.colors['content-disabled'],\n })}\n`\n\nexport const PositionedMenuComponent = styled(MenuComponent).withConfig<DropdownMenuProps>({\n shouldForwardProp: (propKey) => !['expanseDirectionLeft'].includes(propKey),\n})`\n position: absolute;\n\n ${(props) => `\n top: 0;\n left: ${props.expanseDirectionLeft ? 'auto' : 0};\n right: ${props.expanseDirectionLeft ? 0 : 'auto'}; \n `}\n`\n\nconst spinAnimation = keyframes`\n 100% {\n transform: rotate(360deg);\n }\n`\n\nexport const IconContainer = styled.div`\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 12px 0;\n`\n\nexport const ChevronIcon = styled(ChevronDown).withConfig<StyledChevronIconProps>({\n shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n ${(props) => `\n transition-property: transform;\n transition-duration: 250ms;\n transform-origin: center;\n transform: rotate(${props.up ? 180 : 0}deg);\n `}\n`\n\nexport const LoadingIconAnimated = styled(LoaderFill)`\n transform-origin: center;\n animation: ${spinAnimation} 1600ms infinite linear;\n`\n"],"names":["~~Input~~","styled","~~input~~","withConfig","shouldForwardProp","propKey","includes","displayName","componentId","props","opacity","paddingTop","label","labelPosition","active","disabled","template","palette","color","theme","colors","placeholderColor","colorDisabled","placeholderColorDisabled","PositionedMenuComponent","MenuComponent","expanseDirectionLeft","spinAnimation","keyframes","IconContainer","div","ChevronIcon","ChevronDown","up","LoadingIconAnimated","LoaderFill"],"mappings":"~~4eAkBO~~,MAAMA,~~MAAQC~~,OAAOC,~~MAAMC~~,WAAqC,CACrEC,kBAAoBC,IAAa,CAAC,UAAW,SAAU,QAAS,gBAAiB,UAAUC,SAASD,KACpGF,WAAA,CAAAI,YAAA,kBAAAC,YAAA,mBAFmBP,CAEnB,CAAA,GAAA,IAAA,KACGQ,IACD,IAAIC,EAAU,IACd,IAAIC,EAAa,MAejB,OAbIF,EAAMG,OAASH,EAAMI,gBAAkB,YACzCH,EAAU,IAAGD,EAAMK,OAAS,EAAI,GAChCH,EAAa,SAGXF,EAAMG,OAASH,EAAMI,gBAAkB,QACzCF,EAAa,SAGXF,EAAMG,OAASH,EAAMI,gBAAkB,WACzCH,EAAU,IAAGD,EAAMK,OAAS,EAAI,IAG3B,yRAWMJ,0BACIC,qBACLF,EAAMM,SAAW,cAAgB,6FAM5C,IAEAN,IACDO,MAvDgD,eAAlCC,EAuDL,CACPC,MAAOT,EAAMQ,QAAQC,OAAST,EAAMU,MAAMC,OAAO,0BACjDC,iBAAkBZ,EAAMQ,QAAQI,kBAAoBZ,EAAMU,MAAMC,OAAO,4BACvEE,cAAeb,EAAMQ,QAAQK,eAAiBb,EAAMU,MAAMC,OAAO,oBACjEG,yBAA0Bd,EAAMQ,QAAQM,0BAA4Bd,EAAMU,MAAMC,OAAO,sBA1D1EF,0CAEND,EAAQI,sDAGRJ,EAAQK,gEAGRL,EAAQM,mCATHN,KA4DZ,IAGC,MAAMO,wBAA0BvB,OAAOwB,eAAetB,WAA8B,CACzFC,kBAAoBC,IAAa,CAAC,wBAAwBC,SAASD,KACnEF,WAAA,CAAAI,YAAA,oCAAAC,YAAA,mBAFqCP,CAErC,CAAA,qBAAA,KAGGQ,GAAU,4BAEHA,~~EAAMiB~~,qBAAuB,OAAS,~~kBACrCjB~~,~~EAAMiB~~,qBAAuB,EAAI,kBAI9C,MAAMC,cAAgBC,UAIrB,CAAA,0CAEYC,~~cAAgB5B~~,~~OAAO6B~~,~~IAAG3B~~,WAAA,CAAAI,YAAA,0BAAAC,YAAA,mBAAVP,CAM5B,CAAA,gGAEM,~~MAAM8B~~,~~YAAc9B~~,~~OAAO+B~~,~~eAAa7B~~,WAAmC,CAChFC,kBAAoBC,GAAYA,IAAY,OAC5CF,WAAA,CAAAI,YAAA,wBAAAC,YAAA,mBAFyBP,CAEzB,CAAA,GAAA,KACGQ,GAAU,gIAISA,~~EAAMwB~~,GAAK,IAAM,eAIlC,MAAMC,~~oBAAsBjC~~,~~OAAOkC~~,~~cAAWhC~~,WAAA,CAAAI,YAAA,gCAAAC,YAAA,mBAAlBP,CAAkB,CAAA,qCAAA,~~4BAEtC0B~~"}
1	+ {"version":3,"file":"style.mjs","sources":["../../../../src/components/Dropdown/style.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components'\nimport { LoaderFill, ChevronDown } from '@foxford/icon-pack'\nimport { MenuComponent } from 'components/MenuComponent'\nimport type { DropdownMenuProps, StyledChevronIconProps } from './types'\n\nexport const PositionedMenuComponent = styled(MenuComponent).withConfig<DropdownMenuProps>({\n shouldForwardProp: (propKey) => !['expanseDirectionLeft'].includes(propKey),\n})`\n position: absolute;\n\n ${(props) => `\n top: 0;\n left: ${props.expanseDirectionLeft ? 'auto' : 0};\n right: ${props.expanseDirectionLeft ? 0 : 'auto'}; \n `}\n`\n\nconst spinAnimation = keyframes`\n 100% {\n transform: rotate(360deg);\n }\n`\n\nexport const IconContainer = styled.div`\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 12px 0;\n`\n\nexport const ChevronIcon = styled(ChevronDown).withConfig<StyledChevronIconProps>({\n shouldForwardProp: (propKey) => propKey !== 'up',\n})`\n ${(props) => `\n transition-property: transform;\n transition-duration: 250ms;\n transform-origin: center;\n transform: rotate(${props.up ? 180 : 0}deg);\n `}\n`\n\nexport const LoadingIconAnimated = styled(LoaderFill)`\n transform-origin: center;\n animation: ${spinAnimation} 1600ms infinite linear;\n`\n"],"names":["PositionedMenuComponent","styled","MenuComponent","withConfig","shouldForwardProp","propKey","includes","displayName","componentId","props","expanseDirectionLeft","spinAnimation","keyframes","IconContainer","div","ChevronIcon","ChevronDown","up","LoadingIconAnimated","LoaderFill"],"mappings":"4eAKO,MAAMA,wBAA0BC,OAAOC,eAAeC,WAA8B,CACzFC,kBAAoBC,IAAa,CAAC,wBAAwBC,SAASD,KACnEF,WAAA,CAAAI,YAAA,oCAAAC,YAAA,mBAFqCP,CAErC,CAAA,qBAAA,KAGGQ,GAAU,4BAEHA,EAAMC,qBAAuB,OAAS,kBACrCD,EAAMC,qBAAuB,EAAI,kBAI9C,MAAMC,cAAgBC,UAIrB,CAAA,0CAEYC,cAAgBZ,OAAOa,IAAGX,WAAA,CAAAI,YAAA,0BAAAC,YAAA,mBAAVP,CAM5B,CAAA,gGAEM,MAAMc,YAAcd,OAAOe,eAAab,WAAmC,CAChFC,kBAAoBC,GAAYA,IAAY,OAC5CF,WAAA,CAAAI,YAAA,wBAAAC,YAAA,mBAFyBP,CAEzB,CAAA,GAAA,KACGQ,GAAU,gIAISA,EAAMQ,GAAK,IAAM,eAIlC,MAAMC,oBAAsBjB,OAAOkB,cAAWhB,WAAA,CAAAI,YAAA,gCAAAC,YAAA,mBAAlBP,CAAkB,CAAA,qCAAA,4BAEtCU"}

package/components/FormInput/FormInput.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ 'use strict';var React=require('react');var ResizeObserver=require('../../external/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.js');var useMergedPalette=require('../../hooks/useMergedPalette.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver.default((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));exports.FormInput=React.forwardRef(((e,r)=>{const{mask:t="",...s}=e;const a=React.useRef(null);React.useImperativeHandle(r,(()=>a.current),[]);const n=useMergedPalette.useMergedPalette(s);const[l,u]=React.useState(!1);const o=React.useCallback((e=>{u(e.scrollWidth>e.clientWidth)}),[]);return React.useLayoutEffect((()=>(a.current&&(a.current[resizeHandlerSymbol]=o,resizeObserver.observe(a.current)),()=>{a.current&&resizeObserver.unobserve(a.current)})),[o]),require$$0.jsx(style.Root,{"data-input-control":!0,fading:l,children:require$$0.jsx(style.Input,{...s,mask:t,palette:n,onBlur:e=>{s.onBlur&&s.onBlur(e),o(e.currentTarget)},inputRef:e=>{a.current=e}})})}));
2	+ //# sourceMappingURL=FormInput.js.map

package/components/FormInput/FormInput.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FormInput.js","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useLayoutEffect, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { useMergedPalette } from 'hooks/useMergedPalette'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n entry.target[resizeHandlerSymbol](entry.target)\n }\n })\n})\n\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = forwardRef((props, forwardRef) => {\n const { mask = '', ...inputProps } = props\n\n const inputRef = useRef<HTMLInputElement | null>(null)\n useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardRef, () => 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 useLayoutEffect(() => {\n if (inputRef.current) {\n inputRef.current[resizeHandlerSymbol] = handleDetectOverflow\n resizeObserver.observe(inputRef.current)\n }\n return () => {\n if (inputRef.current) {\n resizeObserver.unobserve(inputRef.current)\n }\n }\n }, [handleDetectOverflow])\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\nexport { FormInput }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","default","entries","forEach","entry","target","forwardRef","props","mask","inputProps","inputRef","useRef","useImperativeHandle","current","palette","useMergedPalette","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useLayoutEffect","observe","unobserve","_jsx","Styled","fading","children","jsx","onBlur","evt","currentTarget","input"],"mappings":"mUAMA,MAAMA,oBAAsBC,OAAO,kBAEnC,MAAMC,eAAiB,IAAIC,eAAcC,SAAEC,IACzCA,EAAQC,SAASC,WACJA,EAAMC,OAAOR,sBAAyB,YAC/CO,EAAMC,OAAOR,qBAAqBO,EAAMC,OAC1C,GACA,sBAG+DC,MAAUA,YAAC,CAACC,EAAOD,KACpF,MAAME,KAAEA,EAAO,MAAOC,GAAeF,EAErC,MAAMG,EAAWC,aAAgC,MACjDC,MAAAA,oBAAsEN,GAAY,IAAMI,EAASG,SAAS,IAE1G,MAAMC,EAAUC,kCAAiBN,GAEjC,MAAOO,EAAUC,GAAeC,MAAQA,UAAU,GAElD,MAAMC,EAAuBC,MAAWA,aAAEC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAcH,OAZAC,MAAAA,iBAAgB,KACVd,EAASG,UACXH,EAASG,QAAQhB,qBAAuBsB,EACxCpB,eAAe0B,QAAQf,EAASG,UAE3B,KACDH,EAASG,SACXd,eAAe2B,UAAUhB,EAASG,QACpC,IAED,CAACM,IAGFQ,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"}

package/components/FormInput/FormInput.mjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{forwardRef,useRef,useImperativeHandle,useState,useCallback,useLayoutEffect}from'react';import ResizeObserver from'../../external/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.mjs';import{useMergedPalette}from'../../hooks/useMergedPalette.mjs';import{Root,Input}from'./style.mjs';import{jsx}from'react/jsx-runtime';const resizeHandlerSymbol=Symbol('resize-handler');const resizeObserver=new ResizeObserver((e=>{e.forEach((e=>{typeof e.target[resizeHandlerSymbol]=='function'&&e.target[resizeHandlerSymbol](e.target)}))}));const FormInput=forwardRef(((e,r)=>{const{mask:t="",...s}=e;const o=useRef(null);useImperativeHandle(r,(()=>o.current),[]);const n=useMergedPalette(s);const[l,u]=useState(!1);const a=useCallback((e=>{u(e.scrollWidth>e.clientWidth)}),[]);return useLayoutEffect((()=>(o.current&&(o.current[resizeHandlerSymbol]=a,resizeObserver.observe(o.current)),()=>{o.current&&resizeObserver.unobserve(o.current)})),[a]),jsx(Root,{"data-input-control":!0,fading:l,children:jsx(Input,{...s,mask:t,palette:n,onBlur:e=>{s.onBlur&&s.onBlur(e),a(e.currentTarget)},inputRef:e=>{o.current=e}})})}));export{FormInput};
2	+ //# sourceMappingURL=FormInput.mjs.map

package/components/FormInput/FormInput.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FormInput.mjs","sources":["../../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useLayoutEffect, useState, useCallback } from 'react'\nimport ResizeObserver from 'resize-observer-polyfill'\nimport { useMergedPalette } from 'hooks/useMergedPalette'\nimport * as Styled from './style'\nimport type { FormInputProps } from './types'\n\nconst resizeHandlerSymbol = Symbol('resize-handler')\n\nconst resizeObserver = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n if (typeof entry.target[resizeHandlerSymbol] === 'function') {\n entry.target[resizeHandlerSymbol](entry.target)\n }\n })\n})\n\nconst FormInput: React.ForwardRefExoticComponent<FormInputProps> = forwardRef((props, forwardRef) => {\n const { mask = '', ...inputProps } = props\n\n const inputRef = useRef<HTMLInputElement | null>(null)\n useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardRef, () => 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 useLayoutEffect(() => {\n if (inputRef.current) {\n inputRef.current[resizeHandlerSymbol] = handleDetectOverflow\n resizeObserver.observe(inputRef.current)\n }\n return () => {\n if (inputRef.current) {\n resizeObserver.unobserve(inputRef.current)\n }\n }\n }, [handleDetectOverflow])\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\nexport { FormInput }\n"],"names":["resizeHandlerSymbol","Symbol","resizeObserver","ResizeObserver","entries","forEach","entry","target","FormInput","forwardRef","props","mask","inputProps","inputRef","useRef","useImperativeHandle","current","palette","useMergedPalette","overflow","setOverflow","useState","handleDetectOverflow","useCallback","e","scrollWidth","clientWidth","useLayoutEffect","observe","unobserve","_jsx","Styled","fading","children","onBlur","evt","currentTarget","input"],"mappings":"kXAMA,MAAMA,oBAAsBC,OAAO,kBAEnC,MAAMC,eAAiB,IAAIC,gBAAgBC,IACzCA,EAAQC,SAASC,WACJA,EAAMC,OAAOP,sBAAyB,YAC/CM,EAAMC,OAAOP,qBAAqBM,EAAMC,OAC1C,GACA,IAGEC,MAAAA,UAA6DC,YAAW,CAACC,EAAOD,KACpF,MAAME,KAAEA,EAAO,MAAOC,GAAeF,EAErC,MAAMG,EAAWC,OAAgC,MACjDC,oBAAsEN,GAAY,IAAMI,EAASG,SAAS,IAE1G,MAAMC,EAAUC,iBAAiBN,GAEjC,MAAOO,EAAUC,GAAeC,UAAkB,GAElD,MAAMC,EAAuBC,aAAaC,IACxCJ,EAAYI,EAAEC,YAAcD,EAAEE,YAAY,GACzC,IAcH,OAZAC,iBAAgB,KACVd,EAASG,UACXH,EAASG,QAAQhB,qBAAuBsB,EACxCpB,eAAe0B,QAAQf,EAASG,UAE3B,KACDH,EAASG,SACXd,eAAe2B,UAAUhB,EAASG,QACpC,IAED,CAACM,IAGFQ,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"}