@foxford/ui 2.77.0-beta-ee6908c-20250807 → 2.77.1-beta-0c09a09-20250813
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.
- package/components/ActionBtn/ActionBtn.js.map +1 -1
- package/components/ActionBtn/ActionBtn.mjs.map +1 -1
- package/components/Amount/Amount.js.map +1 -1
- package/components/Amount/Amount.mjs.map +1 -1
- package/components/Anchor/Anchor.js.map +1 -1
- package/components/Anchor/Anchor.mjs.map +1 -1
- package/components/Arrow/Arrow.js.map +1 -1
- package/components/Arrow/Arrow.mjs.map +1 -1
- package/components/ArrowBadge/ArrowBadge.js.map +1 -1
- package/components/ArrowBadge/ArrowBadge.mjs.map +1 -1
- package/components/Avatar/Avatar.js.map +1 -1
- package/components/Avatar/Avatar.mjs.map +1 -1
- package/components/Badge/Badge.js.map +1 -1
- package/components/Badge/Badge.mjs.map +1 -1
- package/components/Button/Button.js.map +1 -1
- package/components/Button/Button.mjs.map +1 -1
- package/components/Chip/Chip.js.map +1 -1
- package/components/Chip/Chip.mjs.map +1 -1
- package/components/Container/Container.js.map +1 -1
- package/components/Container/Container.mjs.map +1 -1
- package/components/ContextMenu/ContextMenu.js.map +1 -1
- package/components/ContextMenu/ContextMenu.mjs.map +1 -1
- package/components/ContextMenu/Item.js.map +1 -1
- package/components/ContextMenu/Item.mjs.map +1 -1
- package/components/ContextMenu.Multilevel/ContextMenu.Multilevel.js.map +1 -1
- package/components/ContextMenu.Multilevel/ContextMenu.Multilevel.mjs.map +1 -1
- package/components/Dropdown/Dropdown.js.map +1 -1
- package/components/Dropdown/Dropdown.mjs.map +1 -1
- package/components/FormLabel/FormLabel.js.map +1 -1
- package/components/FormLabel/FormLabel.mjs.map +1 -1
- package/components/Icon/Icon.js.map +1 -1
- package/components/Icon/Icon.mjs.map +1 -1
- package/components/IconButton/IconButton.js.map +1 -1
- package/components/IconButton/IconButton.mjs.map +1 -1
- package/components/Indicator/Indicator.js.map +1 -1
- package/components/Indicator/Indicator.mjs.map +1 -1
- package/components/Input/Input.js.map +1 -1
- package/components/Input/Input.mjs.map +1 -1
- package/components/Input.Phone/Input.Phone.js.map +1 -1
- package/components/Input.Phone/Input.Phone.mjs.map +1 -1
- package/components/InputCheckbox/InputCheckbox.js.map +1 -1
- package/components/InputCheckbox/InputCheckbox.mjs.map +1 -1
- package/components/InputRadio/InputRadio.js.map +1 -1
- package/components/InputRadio/InputRadio.mjs.map +1 -1
- package/components/ListItem/ListItem.js.map +1 -1
- package/components/ListItem/ListItem.mjs.map +1 -1
- package/components/Menu/Menu.js.map +1 -1
- package/components/Menu/Menu.mjs.map +1 -1
- package/components/MenuComponent/MenuComponent.js.map +1 -1
- package/components/MenuComponent/MenuComponent.mjs.map +1 -1
- package/components/MenuContainer/MenuContainer.js.map +1 -1
- package/components/MenuContainer/MenuContainer.mjs.map +1 -1
- package/components/MenuDivider/MenuDivider.js.map +1 -1
- package/components/MenuDivider/MenuDivider.mjs.map +1 -1
- package/components/MenuList/MenuList.js.map +1 -1
- package/components/MenuList/MenuList.mjs.map +1 -1
- package/components/Modal/Modal.js.map +1 -1
- package/components/Modal/Modal.mjs.map +1 -1
- package/components/Notification/Notification.js.map +1 -1
- package/components/Notification/Notification.mjs.map +1 -1
- package/components/Paper/Paper.js.map +1 -1
- package/components/Paper/Paper.mjs.map +1 -1
- package/components/Progress/Progress.js.map +1 -1
- package/components/Progress/Progress.mjs.map +1 -1
- package/components/Progress.Circle/Progress.Circle.js.map +1 -1
- package/components/Progress.Circle/Progress.Circle.mjs.map +1 -1
- package/components/Progress.Segmented/Progress.Segmented.js.map +1 -1
- package/components/Progress.Segmented/Progress.Segmented.mjs.map +1 -1
- package/components/ProgressCircle/ProgressCircle.js.map +1 -1
- package/components/ProgressCircle/ProgressCircle.mjs.map +1 -1
- package/components/ProgressLine/ProgressLine.js.map +1 -1
- package/components/ProgressLine/ProgressLine.mjs.map +1 -1
- package/components/Radio/Radio.js.map +1 -1
- package/components/Radio/Radio.mjs.map +1 -1
- package/components/Section/Section.js.map +1 -1
- package/components/Section/Section.mjs.map +1 -1
- package/components/Separator/Separator.js.map +1 -1
- package/components/Separator/Separator.mjs.map +1 -1
- package/components/Skeleton/Skeleton.js.map +1 -1
- package/components/Skeleton/Skeleton.mjs.map +1 -1
- package/components/Spacer/Spacer.js.map +1 -1
- package/components/Spacer/Spacer.mjs.map +1 -1
- package/components/Spinner/Spinner.js.map +1 -1
- package/components/Spinner/Spinner.mjs.map +1 -1
- package/components/Switch/Switch.js.map +1 -1
- package/components/Switch/Switch.mjs.map +1 -1
- package/components/Tab/Tab.js.map +1 -1
- package/components/Tab/Tab.mjs.map +1 -1
- package/components/Tabs/Tabs.js.map +1 -1
- package/components/Tabs/Tabs.mjs.map +1 -1
- package/components/Tag/Tag.js.map +1 -1
- package/components/Tag/Tag.mjs.map +1 -1
- package/components/Text/Text.js.map +1 -1
- package/components/Text/Text.mjs.map +1 -1
- package/components/Text.Ellipse/Text.Ellipse.js.map +1 -1
- package/components/Text.Ellipse/Text.Ellipse.mjs.map +1 -1
- package/components/Textarea/Textarea.js.map +1 -1
- package/components/Textarea/Textarea.mjs.map +1 -1
- package/components/Tooltip/Tooltip.js.map +1 -1
- package/components/Tooltip/Tooltip.mjs.map +1 -1
- package/components/TooltipComponent/TooltipComponent.js.map +1 -1
- package/components/TooltipComponent/TooltipComponent.mjs.map +1 -1
- package/dts/index.d.ts +29 -165
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown.mjs","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { forwardRef, useState, useRef, useEffect, useLayoutEffect, useMemo, useCallback } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useScrollMonitor } from 'hooks/useScrollMonitor'\nimport { focusFirstFocusable, focusLastFocusable } from 'shared/utils/dom'\nimport { createDebouncedCallback } from 'shared/utils/misc'\nimport { keyboardKeys } from 'shared/constants'\nimport type { Nullable } from 'shared/types'\nimport { FormInput } from 'components/FormInput'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { MenuList } from 'components/MenuList'\nimport { MenuDivider } from 'components/MenuDivider'\nimport { ListItem } from 'components/ListItem'\nimport { InputCheckbox } from 'components/InputCheckbox'\nimport { Chip } from 'components/Chip'\nimport { IconButton } from 'components/IconButton'\nimport type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { useFilteredOptions, useLoadedOptions } from './hooks'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON } from './constants'\nimport { getDropdownInputText, getDropdownSelectedOption, groupDropdownOptions } from './utils'\nimport * as Styled from './style'\nimport type { DropdownProps, DropdownOption } from './types'\n\nconst COMPONENT_NAME = 'Dropdown'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dropdown/types.ts).\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n forwardRef<HTMLDivElement, MergedProps<DropdownProps>>((props, ref) => {\n const {\n size = 'm',\n name = 'fox-dropdown',\n labelPosition = 'dynamic',\n searchable = true,\n primary = true,\n optionsMultiToggle = true,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n loading,\n autoFocus,\n disableAutoScrollToSelectedOption,\n closeMenuOnScroll,\n scrollMonitorTarget,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n maxLength,\n multiple,\n clearable,\n onChangeInput,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n loadOptions,\n groupSelectedOptions,\n optionsMultiToggleCaption,\n optionsEmptyMessage,\n optionsEmptyIcon,\n palette,\n placeholder,\n readOnly,\n required,\n status,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n form,\n ...rootProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const iconBaseProps: IconProps = {\n sizes: SIZES_ICON,\n color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n }\n\n const formInputLabelId = useMemo(() => rootProps.id ?? `${name}-${nanoid()}`, [name, rootProps.id])\n const inputLabelId = useMemo(() => nanoid(), [])\n const menuListId = useMemo(() => nanoid(), [])\n\n const [filteredOptions, getFilteredOptions] = useFilteredOptions({\n options,\n })\n\n const [loadedOptions, optionsLoading, getLoadedOptions] = useLoadedOptions({\n loadOptions,\n options,\n })\n\n const [dropdownSelectedOption, setDropdownSelectedOption] = useState<DropdownOption[]>(() =>\n getDropdownSelectedOption(selectedOption !== undefined ? selectedOption : defaultSelectedOption, multiple)\n )\n\n const [inputText, setInputText] = useState<string>(() => getDropdownInputText(dropdownSelectedOption, multiple))\n\n const [focusWithin, setFocusWithin] = useState<boolean>(false)\n\n const [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n const menuOptions: DropdownOption[] = loadOptions ? loadedOptions : filteredOptions\n const menuOptionsLoading = loadOptions ? (loading ?? optionsLoading) : loading\n\n const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = useMemo(\n () => (multiple ? groupDropdownOptions(menuOptions, dropdownSelectedOption) : [[], []]),\n [multiple, menuOptions, dropdownSelectedOption]\n )\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n\n const inputRequired = required && dropdownSelectedOption.length === 0\n const inputActive = Boolean(menuOpen || inputText || focusWithin)\n\n const multiToggleChecked = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length === 0\n const multiToggleIndeterminate = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0\n\n const inputRef = useRef<HTMLInputElement>(null)\n const [menuRef, setMenuRef] = useState<Nullable<HTMLElement>>(null)\n const menuListRef = useRef<HTMLUListElement>(null)\n const selectedOptionRef = useRef<HTMLElement>(null)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n const updateInputText = useCallback(\n (inputTextValue: string) => {\n setInputText(inputTextValue)\n\n if (onChangeInput) {\n onChangeInput(inputTextValue)\n }\n },\n [onChangeInput]\n )\n\n const updateOptions = useCallback(\n (inputTextValue: string) => {\n if (loadOptions) {\n getLoadedOptions(inputTextValue)\n } else {\n getFilteredOptions(inputTextValue)\n }\n },\n [loadOptions, getLoadedOptions, getFilteredOptions]\n )\n\n const updateOptionsDebounced = useMemo(() => {\n return createDebouncedCallback(updateOptions, 150)\n }, [updateOptions])\n\n const preventBlur = (evt: React.PointerEvent<HTMLDivElement> | React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n if (\n evt.target !== inputRef.current &&\n evt.target instanceof Node &&\n (evt.currentTarget.contains(evt.target) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.target)))\n ) {\n evt.preventDefault()\n }\n }\n\n useScrollMonitor({\n target: scrollMonitorTarget,\n onScrollStart: () => {\n if (closeMenuOnScroll && menuOpen) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n },\n })\n\n useLayoutEffect(() => {\n if (selectedOption === undefined) return\n\n if (!multiple && !menuOpen) {\n updateInputText(getDropdownInputText(selectedOption))\n }\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption, menuOpen, updateInputText])\n\n useEffect(() => {\n if (menuOpen === menuOpenPrevRef.current) return\n\n if (menuOpen && onOpenMenu) onOpenMenu()\n if (!menuOpen && onCloseMenu) onCloseMenu()\n\n menuOpenPrevRef.current = menuOpen\n }, [menuOpen, onCloseMenu, onOpenMenu])\n\n useEffect(() => {\n if (\n !multiple &&\n !disableAutoScrollToSelectedOption &&\n menuOpen &&\n !menuOptionsLoading &&\n inputText.length === 0 &&\n menuRef &&\n selectedOptionRef.current\n ) {\n const menuRect = menuRef.getBoundingClientRect()\n const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n setTimeout(() => {\n if (menuRef && selectedOptionRef.current) {\n menuRef.scrollTo(0, selectedOptionRef.current.offsetTop)\n }\n }, 0)\n }\n }\n }, [multiple, disableAutoScrollToSelectedOption, menuOpen, menuOptionsLoading, inputText, menuRef])\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n id={formInputLabelId}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n primary={primary}\n error={status === 'error'}\n success={status === 'success'}\n focus={focusWithin}\n icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n iconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...iconProps,\n }}\n palette={{\n color: rootProps.disabled ? palette.labelColorDisabled : palette.labelColor,\n backgroundColor: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n backgroundColorHover: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n borderColor: rootProps.disabled ? palette.borderColorDisabled : palette.borderColor,\n }}\n onClick={(evt) => {\n if (rootProps.onClick) rootProps.onClick(evt)\n\n if (rootProps.disabled) return\n\n inputRef.current?.focus()\n\n if (!menuOpen) {\n setMenuOpenRequest(true)\n\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n } else if (menuRef && evt.target instanceof Node && !menuRef.contains(evt.target)) {\n setMenuOpenRequest(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n preventBlur(evt)\n }}\n onMouseDown={(evt) => {\n if (rootProps.onMouseDown) rootProps.onMouseDown(evt)\n\n if (!window.PointerEvent) preventBlur(evt)\n }}\n onFocus={(evt) => {\n if (rootProps.onFocus) rootProps.onFocus(evt)\n\n setFocusWithin(true)\n\n if (inputRef.current && evt.target === inputRef.current && searchable && !multiple && !menuOpen) {\n updateInputText('')\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (\n evt.currentTarget.contains(evt.relatedTarget) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.relatedTarget))\n ) {\n return\n }\n\n setFocusWithin(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }}\n input={\n <>\n {inputRequired && !searchable && !readOnly ? (\n <Styled.InputMimic\n required\n type='text'\n inputMode='none'\n form={form}\n tabIndex={-1}\n onFocus={() => {\n inputRef.current?.focus()\n }}\n />\n ) : null}\n <FormInput\n ref={inputRef}\n role='combobox'\n aria-controls={menuListId}\n aria-expanded={menuOpen}\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n type='text'\n autoComplete='off'\n autoCapitalize='off'\n autoCorrect='off'\n spellCheck='false'\n form={form}\n autoFocus={autoFocus}\n inputMode={searchable ? inputMode : 'none'}\n maxLength={maxLength}\n placeholder={placeholder}\n readOnly={readOnly || !searchable}\n required={inputRequired}\n disabled={rootProps.disabled}\n value={inputText}\n palette={{\n color: palette.color,\n colorDisabled: palette.colorDisabled,\n placeholderColor: palette.placeholderColor,\n placeholderColorDisabled: palette.placeholderColorDisabled,\n }}\n onClick={(evt) => {\n if (menuOpen && evt.currentTarget.selectionStart !== evt.currentTarget.selectionEnd) {\n evt.stopPropagation()\n }\n }}\n onChange={(evt) => {\n const inputValue = evt.currentTarget.value\n\n updateInputText(inputValue)\n updateOptionsDebounced(inputValue)\n setMenuOpenRequest(true)\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n evt.preventDefault()\n\n if (!menuOpen) {\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n }\n\n setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Tab.validate(evt.key) && menuOpen) {\n evt.preventDefault()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx + 1] ?? menuItems[0]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n\n if (keyboardKeys.ArrowUp.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx - 1] ?? menuItems[menuItems.length - 1]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusLastFocusable(menuListRef.current)\n }\n }\n }}\n />\n {dropdownSelectedOption.map((item) => (\n <input\n key={item.value}\n type='hidden'\n name={name}\n value={item.value}\n form={form}\n disabled={rootProps.disabled}\n />\n ))}\n </>\n }\n addon={\n <>\n {multiple && dropdownSelectedOption.length > 0 ? (\n <Chip\n size='xs'\n active\n black\n marginLeft={12}\n disabled={rootProps.disabled}\n cursor={rootProps.disabled ? 'not-allowed' : undefined}\n text={dropdownSelectedOption.length}\n textProps={{\n appearance: 'caption',\n size: 'xs',\n }}\n palette={\n rootProps.disabled\n ? {\n color: 'content-disabled',\n colorHover: 'content-disabled',\n backgroundColor: 'bg-disabled-small',\n backgroundColorHover: 'bg-disabled-small',\n }\n : undefined\n }\n onPointerDown={(evt) => {\n evt.preventDefault()\n }}\n onMouseDown={(evt) => {\n if (!window.PointerEvent) evt.preventDefault()\n }}\n discardButtonProps={{\n square: true,\n contrast: !rootProps.disabled,\n onClick: (evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption([])\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n ) : null}\n {!multiple && clearable && dropdownSelectedOption.length > 0 ? (\n <IconButton\n icon='close'\n size='l'\n square\n marginLeft={12}\n disabled={rootProps.disabled}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(null)\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n }}\n />\n ) : null}\n </>\n }\n dropdown={\n <DropdownMenu\n {...menuProps}\n setRef={setMenuRef}\n open={menuOpen}\n popperReferenceId={formInputLabelId}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n empty={menuOptions.length === 0}\n loading={menuOptionsLoading}\n loadingMessage={loadingMessage}\n loadingIcon={loadingIcon}\n loadingIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...loadingIconProps,\n }}\n emptyMessage={optionsEmptyMessage}\n emptyIcon={optionsEmptyIcon}\n emptyIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...optionsEmptyIconProps,\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Tab.validate(evt.key)) {\n evt.preventDefault()\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Backspace.validate(evt.key) && !readOnly && (multiple || (!multiple && clearable))) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n updateInputText('')\n updateOptions('')\n }\n }}\n >\n {multiple ? (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n aria-multiselectable\n >\n {inputText.length === 0 ? (\n <>\n {optionsMultiToggle ? (\n <ListItem\n {...sizeProps}\n text={optionsMultiToggleCaption}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n checked={multiToggleChecked}\n indeterminate={multiToggleIndeterminate}\n error={Boolean((multiToggleChecked || multiToggleIndeterminate) && status === 'error')}\n success={Boolean((multiToggleChecked || multiToggleIndeterminate) && status === 'success')}\n onChange={() => {\n if (!readOnly) {\n const update = multiToggleChecked || multiToggleIndeterminate ? [] : [...menuOptions]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ) : null}\n {optionsMultiToggle ? <MenuDivider /> : null}\n {groupSelectedOptions\n ? menuOptionsGroups[0].map((option) => {\n const optionStatus = option.status ?? status\n const optionErrorStatus = optionStatus === 'error'\n const optionSuccessStatus = optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n active\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected\n name={name}\n value={option.value}\n checked\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = dropdownSelectedOption.filter(\n (item) => item.value !== evt.currentTarget.value\n )\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })\n : null}\n {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 ? (\n <MenuDivider />\n ) : null}\n {groupSelectedOptions\n ? menuOptionsGroups[1].map((option) => (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={false}\n name={name}\n value={option.value}\n checked={false}\n onChange={() => {\n if (!readOnly) {\n const update = [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ))\n : null}\n {!groupSelectedOptions &&\n menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n ) : (\n <>\n {menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n )}\n </MenuList>\n ) : (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n >\n {menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n return (\n <ListItem\n {...sizeProps}\n role='option'\n aria-selected={selected}\n ref={selected ? selectedOptionRef : undefined}\n key={option.value}\n text={option.text}\n active={selected}\n danger={Boolean(selected && status === 'error')}\n success={Boolean(selected && status === 'success')}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n const update = { ...option }\n\n if (selectedOption === undefined) {\n updateInputText(getDropdownInputText(update))\n setDropdownSelectedOption(getDropdownSelectedOption(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n }\n />\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { Dropdown, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Dropdown","withMergedProps","forwardRef","props","ref","size","name","labelPosition","searchable","primary","optionsMultiToggle","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","loading","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","scrollMonitorTarget","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","clearable","onChangeInput","onCloseMenu","onOpenMenu","onSelectOption","options","loadOptions","groupSelectedOptions","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","sizes","SIZES_ICON","color","disabled","formInputLabelId","useMemo","id","nanoid","inputLabelId","menuListId","filteredOptions","getFilteredOptions","useFilteredOptions","loadedOptions","optionsLoading","getLoadedOptions","useLoadedOptions","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","focusWithin","setFocusWithin","menuOpenRequest","setMenuOpenRequest","menuOptions","menuOptionsLoading","menuOptionsGroups","groupDropdownOptions","menuOpen","inputRequired","length","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","setMenuRef","menuListRef","selectedOptionRef","menuOpenPrevRef","updateInputText","useCallback","inputTextValue","updateOptions","updateOptionsDebounced","createDebouncedCallback","preventBlur","evt","target","current","Node","currentTarget","contains","renderInPortal","preventDefault","useScrollMonitor","onScrollStart","focus","useLayoutEffect","useEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","setTimeout","scrollTo","offsetTop","_jsx","FormInputLabel","labelId","active","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","onPointerDown","onMouseDown","window","PointerEvent","onFocus","onBlur","relatedTarget","input","_jsxs","_Fragment","children","type","tabIndex","FormInput","role","label","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","inputValue","onKeyDown","keyboardKeys","Enter","validate","key","Space","prev","Esc","Tab","ArrowDown","menuItems","idx","findIndex","item","focusTarget","HTMLElement","focusFirstFocusable","ArrowUp","focusLastFocusable","map","addon","Chip","black","marginLeft","cursor","text","textProps","appearance","colorHover","discardButtonProps","square","IconButton","dropdown","DropdownMenu","setRef","open","popperReferenceId","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","empty","emptyMessage","emptyIcon","emptyIconProps","Backspace","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","selected","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, useCallback } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useScrollMonitor } from 'hooks/useScrollMonitor'\nimport { focusFirstFocusable, focusLastFocusable } from 'shared/utils/dom'\nimport { createDebouncedCallback } from 'shared/utils/misc'\nimport { keyboardKeys } from 'shared/constants'\nimport type { Nullable } from 'shared/types'\nimport { FormInput } from 'components/FormInput'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { MenuList } from 'components/MenuList'\nimport { MenuDivider } from 'components/MenuDivider'\nimport { ListItem } from 'components/ListItem'\nimport { InputCheckbox } from 'components/InputCheckbox'\nimport { Chip } from 'components/Chip'\nimport { IconButton } from 'components/IconButton'\nimport type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { useFilteredOptions, useLoadedOptions } from './hooks'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON } from './constants'\nimport { getDropdownInputText, getDropdownSelectedOption, groupDropdownOptions } from './utils'\nimport * as Styled from './style'\nimport type { DropdownProps, DropdownOption } from './types'\n\nconst COMPONENT_NAME = 'Dropdown'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/packages/ui/src/components/Dropdown/types.ts).\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n forwardRef<HTMLDivElement, MergedProps<DropdownProps>>((props, ref) => {\n const {\n size = 'm',\n name = 'fox-dropdown',\n labelPosition = 'dynamic',\n searchable = true,\n primary = true,\n optionsMultiToggle = true,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n loading,\n autoFocus,\n disableAutoScrollToSelectedOption,\n closeMenuOnScroll,\n scrollMonitorTarget,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n maxLength,\n multiple,\n clearable,\n onChangeInput,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n loadOptions,\n groupSelectedOptions,\n optionsMultiToggleCaption,\n optionsEmptyMessage,\n optionsEmptyIcon,\n palette,\n placeholder,\n readOnly,\n required,\n status,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n form,\n ...rootProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const iconBaseProps: IconProps = {\n sizes: SIZES_ICON,\n color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n }\n\n const formInputLabelId = useMemo(() => rootProps.id ?? `${name}-${nanoid()}`, [name, rootProps.id])\n const inputLabelId = useMemo(() => nanoid(), [])\n const menuListId = useMemo(() => nanoid(), [])\n\n const [filteredOptions, getFilteredOptions] = useFilteredOptions({\n options,\n })\n\n const [loadedOptions, optionsLoading, getLoadedOptions] = useLoadedOptions({\n loadOptions,\n options,\n })\n\n const [dropdownSelectedOption, setDropdownSelectedOption] = useState<DropdownOption[]>(() =>\n getDropdownSelectedOption(selectedOption !== undefined ? selectedOption : defaultSelectedOption, multiple)\n )\n\n const [inputText, setInputText] = useState<string>(() => getDropdownInputText(dropdownSelectedOption, multiple))\n\n const [focusWithin, setFocusWithin] = useState<boolean>(false)\n\n const [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n const menuOptions: DropdownOption[] = loadOptions ? loadedOptions : filteredOptions\n const menuOptionsLoading = loadOptions ? (loading ?? optionsLoading) : loading\n\n const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = useMemo(\n () => (multiple ? groupDropdownOptions(menuOptions, dropdownSelectedOption) : [[], []]),\n [multiple, menuOptions, dropdownSelectedOption]\n )\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n\n const inputRequired = required && dropdownSelectedOption.length === 0\n const inputActive = Boolean(menuOpen || inputText || focusWithin)\n\n const multiToggleChecked = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length === 0\n const multiToggleIndeterminate = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0\n\n const inputRef = useRef<HTMLInputElement>(null)\n const [menuRef, setMenuRef] = useState<Nullable<HTMLElement>>(null)\n const menuListRef = useRef<HTMLUListElement>(null)\n const selectedOptionRef = useRef<HTMLElement>(null)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n const updateInputText = useCallback(\n (inputTextValue: string) => {\n setInputText(inputTextValue)\n\n if (onChangeInput) {\n onChangeInput(inputTextValue)\n }\n },\n [onChangeInput]\n )\n\n const updateOptions = useCallback(\n (inputTextValue: string) => {\n if (loadOptions) {\n getLoadedOptions(inputTextValue)\n } else {\n getFilteredOptions(inputTextValue)\n }\n },\n [loadOptions, getLoadedOptions, getFilteredOptions]\n )\n\n const updateOptionsDebounced = useMemo(() => {\n return createDebouncedCallback(updateOptions, 150)\n }, [updateOptions])\n\n const preventBlur = (evt: React.PointerEvent<HTMLDivElement> | React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n if (\n evt.target !== inputRef.current &&\n evt.target instanceof Node &&\n (evt.currentTarget.contains(evt.target) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.target)))\n ) {\n evt.preventDefault()\n }\n }\n\n useScrollMonitor({\n target: scrollMonitorTarget,\n onScrollStart: () => {\n if (closeMenuOnScroll && menuOpen) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n },\n })\n\n useLayoutEffect(() => {\n if (selectedOption === undefined) return\n\n if (!multiple && !menuOpen) {\n updateInputText(getDropdownInputText(selectedOption))\n }\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption, menuOpen, updateInputText])\n\n useEffect(() => {\n if (menuOpen === menuOpenPrevRef.current) return\n\n if (menuOpen && onOpenMenu) onOpenMenu()\n if (!menuOpen && onCloseMenu) onCloseMenu()\n\n menuOpenPrevRef.current = menuOpen\n }, [menuOpen, onCloseMenu, onOpenMenu])\n\n useEffect(() => {\n if (\n !multiple &&\n !disableAutoScrollToSelectedOption &&\n menuOpen &&\n !menuOptionsLoading &&\n inputText.length === 0 &&\n menuRef &&\n selectedOptionRef.current\n ) {\n const menuRect = menuRef.getBoundingClientRect()\n const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n setTimeout(() => {\n if (menuRef && selectedOptionRef.current) {\n menuRef.scrollTo(0, selectedOptionRef.current.offsetTop)\n }\n }, 0)\n }\n }\n }, [multiple, disableAutoScrollToSelectedOption, menuOpen, menuOptionsLoading, inputText, menuRef])\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n id={formInputLabelId}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n primary={primary}\n error={status === 'error'}\n success={status === 'success'}\n focus={focusWithin}\n icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n iconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...iconProps,\n }}\n palette={{\n color: rootProps.disabled ? palette.labelColorDisabled : palette.labelColor,\n backgroundColor: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n backgroundColorHover: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n borderColor: rootProps.disabled ? palette.borderColorDisabled : palette.borderColor,\n }}\n onClick={(evt) => {\n if (rootProps.onClick) rootProps.onClick(evt)\n\n if (rootProps.disabled) return\n\n inputRef.current?.focus()\n\n if (!menuOpen) {\n setMenuOpenRequest(true)\n\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n } else if (menuRef && evt.target instanceof Node && !menuRef.contains(evt.target)) {\n setMenuOpenRequest(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n preventBlur(evt)\n }}\n onMouseDown={(evt) => {\n if (rootProps.onMouseDown) rootProps.onMouseDown(evt)\n\n if (!window.PointerEvent) preventBlur(evt)\n }}\n onFocus={(evt) => {\n if (rootProps.onFocus) rootProps.onFocus(evt)\n\n setFocusWithin(true)\n\n if (inputRef.current && evt.target === inputRef.current && searchable && !multiple && !menuOpen) {\n updateInputText('')\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (\n evt.currentTarget.contains(evt.relatedTarget) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.relatedTarget))\n ) {\n return\n }\n\n setFocusWithin(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }}\n input={\n <>\n {inputRequired && !searchable && !readOnly ? (\n <Styled.InputMimic\n required\n type='text'\n inputMode='none'\n form={form}\n tabIndex={-1}\n onFocus={() => {\n inputRef.current?.focus()\n }}\n />\n ) : null}\n <FormInput\n ref={inputRef}\n role='combobox'\n aria-controls={menuListId}\n aria-expanded={menuOpen}\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n type='text'\n autoComplete='off'\n autoCapitalize='off'\n autoCorrect='off'\n spellCheck='false'\n form={form}\n autoFocus={autoFocus}\n inputMode={searchable ? inputMode : 'none'}\n maxLength={maxLength}\n placeholder={placeholder}\n readOnly={readOnly || !searchable}\n required={inputRequired}\n disabled={rootProps.disabled}\n value={inputText}\n palette={{\n color: palette.color,\n colorDisabled: palette.colorDisabled,\n placeholderColor: palette.placeholderColor,\n placeholderColorDisabled: palette.placeholderColorDisabled,\n }}\n onClick={(evt) => {\n if (menuOpen && evt.currentTarget.selectionStart !== evt.currentTarget.selectionEnd) {\n evt.stopPropagation()\n }\n }}\n onChange={(evt) => {\n const inputValue = evt.currentTarget.value\n\n updateInputText(inputValue)\n updateOptionsDebounced(inputValue)\n setMenuOpenRequest(true)\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n evt.preventDefault()\n\n if (!menuOpen) {\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n }\n\n setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Tab.validate(evt.key) && menuOpen) {\n evt.preventDefault()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx + 1] ?? menuItems[0]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n\n if (keyboardKeys.ArrowUp.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx - 1] ?? menuItems[menuItems.length - 1]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusLastFocusable(menuListRef.current)\n }\n }\n }}\n />\n {dropdownSelectedOption.map((item) => (\n <input\n key={item.value}\n type='hidden'\n name={name}\n value={item.value}\n form={form}\n disabled={rootProps.disabled}\n />\n ))}\n </>\n }\n addon={\n <>\n {multiple && dropdownSelectedOption.length > 0 ? (\n <Chip\n size='xs'\n active\n black\n marginLeft={12}\n disabled={rootProps.disabled}\n cursor={rootProps.disabled ? 'not-allowed' : undefined}\n text={dropdownSelectedOption.length}\n textProps={{\n appearance: 'caption',\n size: 'xs',\n }}\n palette={\n rootProps.disabled\n ? {\n color: 'content-disabled',\n colorHover: 'content-disabled',\n backgroundColor: 'bg-disabled-small',\n backgroundColorHover: 'bg-disabled-small',\n }\n : undefined\n }\n onPointerDown={(evt) => {\n evt.preventDefault()\n }}\n onMouseDown={(evt) => {\n if (!window.PointerEvent) evt.preventDefault()\n }}\n discardButtonProps={{\n square: true,\n contrast: !rootProps.disabled,\n onClick: (evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption([])\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n ) : null}\n {!multiple && clearable && dropdownSelectedOption.length > 0 ? (\n <IconButton\n icon='close'\n size='l'\n square\n marginLeft={12}\n disabled={rootProps.disabled}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(null)\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n }}\n />\n ) : null}\n </>\n }\n dropdown={\n <DropdownMenu\n {...menuProps}\n setRef={setMenuRef}\n open={menuOpen}\n popperReferenceId={formInputLabelId}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n empty={menuOptions.length === 0}\n loading={menuOptionsLoading}\n loadingMessage={loadingMessage}\n loadingIcon={loadingIcon}\n loadingIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...loadingIconProps,\n }}\n emptyMessage={optionsEmptyMessage}\n emptyIcon={optionsEmptyIcon}\n emptyIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...optionsEmptyIconProps,\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Tab.validate(evt.key)) {\n evt.preventDefault()\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Backspace.validate(evt.key) && !readOnly && (multiple || (!multiple && clearable))) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n updateInputText('')\n updateOptions('')\n }\n }}\n >\n {multiple ? (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n aria-multiselectable\n >\n {inputText.length === 0 ? (\n <>\n {optionsMultiToggle ? (\n <ListItem\n {...sizeProps}\n text={optionsMultiToggleCaption}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n checked={multiToggleChecked}\n indeterminate={multiToggleIndeterminate}\n error={Boolean((multiToggleChecked || multiToggleIndeterminate) && status === 'error')}\n success={Boolean((multiToggleChecked || multiToggleIndeterminate) && status === 'success')}\n onChange={() => {\n if (!readOnly) {\n const update = multiToggleChecked || multiToggleIndeterminate ? [] : [...menuOptions]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ) : null}\n {optionsMultiToggle ? <MenuDivider /> : null}\n {groupSelectedOptions\n ? menuOptionsGroups[0].map((option) => {\n const optionStatus = option.status ?? status\n const optionErrorStatus = optionStatus === 'error'\n const optionSuccessStatus = optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n active\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected\n name={name}\n value={option.value}\n checked\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = dropdownSelectedOption.filter(\n (item) => item.value !== evt.currentTarget.value\n )\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })\n : null}\n {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 ? (\n <MenuDivider />\n ) : null}\n {groupSelectedOptions\n ? menuOptionsGroups[1].map((option) => (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={false}\n name={name}\n value={option.value}\n checked={false}\n onChange={() => {\n if (!readOnly) {\n const update = [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ))\n : null}\n {!groupSelectedOptions &&\n menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n ) : (\n <>\n {menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n )}\n </MenuList>\n ) : (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n >\n {menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n return (\n <ListItem\n {...sizeProps}\n role='option'\n aria-selected={selected}\n ref={selected ? selectedOptionRef : undefined}\n key={option.value}\n text={option.text}\n active={selected}\n danger={Boolean(selected && status === 'error')}\n success={Boolean(selected && status === 'success')}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n const update = { ...option }\n\n if (selectedOption === undefined) {\n updateInputText(getDropdownInputText(update))\n setDropdownSelectedOption(getDropdownSelectedOption(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n }\n />\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { Dropdown, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Dropdown","withMergedProps","forwardRef","props","ref","size","name","labelPosition","searchable","primary","optionsMultiToggle","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","loading","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","scrollMonitorTarget","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","clearable","onChangeInput","onCloseMenu","onOpenMenu","onSelectOption","options","loadOptions","groupSelectedOptions","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","sizes","SIZES_ICON","color","disabled","formInputLabelId","useMemo","id","nanoid","inputLabelId","menuListId","filteredOptions","getFilteredOptions","useFilteredOptions","loadedOptions","optionsLoading","getLoadedOptions","useLoadedOptions","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","focusWithin","setFocusWithin","menuOpenRequest","setMenuOpenRequest","menuOptions","menuOptionsLoading","menuOptionsGroups","groupDropdownOptions","menuOpen","inputRequired","length","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","setMenuRef","menuListRef","selectedOptionRef","menuOpenPrevRef","updateInputText","useCallback","inputTextValue","updateOptions","updateOptionsDebounced","createDebouncedCallback","preventBlur","evt","target","current","Node","currentTarget","contains","renderInPortal","preventDefault","useScrollMonitor","onScrollStart","focus","useLayoutEffect","useEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","setTimeout","scrollTo","offsetTop","_jsx","FormInputLabel","labelId","active","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","onPointerDown","onMouseDown","window","PointerEvent","onFocus","onBlur","relatedTarget","input","_jsxs","_Fragment","children","type","tabIndex","FormInput","role","label","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","inputValue","onKeyDown","keyboardKeys","Enter","validate","key","Space","prev","Esc","Tab","ArrowDown","menuItems","idx","findIndex","item","focusTarget","HTMLElement","focusFirstFocusable","ArrowUp","focusLastFocusable","map","addon","Chip","black","marginLeft","cursor","text","textProps","appearance","colorHover","discardButtonProps","square","IconButton","dropdown","DropdownMenu","setRef","open","popperReferenceId","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","empty","emptyMessage","emptyIcon","emptyIconProps","Backspace","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","selected","SIZES","displayName"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormLabel.js","sources":["../../../../src/components/FormLabel/FormLabel.tsx"],"sourcesContent":["import { forwardRef, cloneElement } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { IconButton } from 'components/IconButton'\nimport { Badge } from 'components/Badge'\nimport { Tooltip } from 'components/Tooltip'\nimport * as Styled from './style'\nimport { SIZES, SIZES_LABEL, SIZES_HINT } from './constants'\nimport type { FormLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormLabel'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<label\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/FormLabel/types.ts).\n */\nconst FormLabel: React.ForwardRefExoticComponent<FormLabelProps> = withMergedProps<FormLabelProps, HTMLLabelElement>(\n forwardRef<HTMLLabelElement, MergedProps<FormLabelProps>>(\n (\n {\n size = 'm',\n textProps = {},\n hint = {},\n badgeProps = {},\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n disabled,\n error,\n success,\n checked,\n children,\n control,\n label,\n ...props\n },\n ref\n ) => {\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const stateProps = {\n disabled,\n error,\n success,\n checked,\n }\n\n const elementProps =\n typeof control === 'object' && typeof control.props === 'object' && control.props !== null ? control.props : {}\n\n const {\n text: hintText,\n textProps: hintTextProps = {},\n buttonProps: hintButtonProps = {},\n tooltipProps: hintTooltipProps = {},\n } = hint\n\n return (\n <Styled.Root {...props} {...sizeProps} {...stateProps} ref={ref}>\n {typeof control === 'function'\n ? control({\n ...sizeProps,\n ...stateProps,\n })\n : cloneElement(control, {\n ...sizeProps,\n ...stateProps,\n ...elementProps,\n })}\n <Styled.Content>\n <Text\n as='span'\n appearance='body'\n color='inherit'\n wordBreak='break-word'\n marginBottom={hintText ? '0.2em' : undefined}\n sizes={SIZES_LABEL}\n {...sizeProps}\n {...textProps}\n >\n {label ?? children}\n </Text>\n {hintText ? (\n <Text\n as='span'\n appearance='caption'\n color={stateProps.disabled ? 'content-disabled' : 'content-onmain-secondary'}\n wordBreak='break-word'\n sizes={SIZES_HINT}\n {...sizeProps}\n {...hintTextProps}\n >\n {hintText}\n </Text>\n ) : null}\n </Styled.Content>\n {hintButtonProps.onClick && !hintTooltipProps.title && !hintTooltipProps.content ? (\n <IconButton\n size='m'\n icon='helpCircle'\n marginLeft={6}\n {...hintButtonProps}\n disabled={stateProps.disabled || hintButtonProps.disabled}\n />\n ) : null}\n {hintTooltipProps.title || hintTooltipProps.content ? (\n <Tooltip\n preset='brand'\n placement='top'\n styles={{\n wrapper: { cursor: 'inherit' },\n }}\n {...hintTooltipProps}\n >\n <IconButton\n size='m'\n icon='helpCircle'\n marginLeft={6}\n {...hintButtonProps}\n disabled={stateProps.disabled || hintButtonProps.disabled}\n />\n </Tooltip>\n ) : null}\n {badgeProps.children ? (\n <Badge size='s' cursor='inherit' marginLeft={6} resetDefaultMargin {...badgeProps} />\n ) : null}\n </Styled.Root>\n )\n }\n ),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { FormLabel, COMPONENT_NAME }\n"],"names":["FormLabel","withMergedProps","forwardRef","size","textProps","hint","badgeProps","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","disabled","error","success","checked","children","control","label","props","ref","sizeProps","stateProps","elementProps","text","hintText","hintTextProps","buttonProps","hintButtonProps","tooltipProps","hintTooltipProps","_jsxs","Styled","cloneElement","jsxs","_jsx","jsx","Text","as","appearance","color","wordBreak","marginBottom","undefined","sizes","SIZES_LABEL","SIZES_HINT","onClick","title","content","IconButton","icon","marginLeft","Tooltip","preset","placement","styles","wrapper","cursor","Badge","resetDefaultMargin","displayName","SIZES"],"mappings":"uYAuBA,MAAMA,UAA6DC,gBAAAA,gBACjEC,MAAAA,YACE,EAEIC,OAAO,IACPC,YAAY,CAAE,EACdC,OAAO,CAAE,EACTC,aAAa,CAAE,EACfC,UACAC,SACAC,QACAC,QACAC,QACAC,SACAC,WACAC,QACAC,UACAC,UACAC,WACAC,UACAC,WACGC,GAELC,KAEA,MAAMC,EAAY,CAChBnB,OACAI,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMW,EAAa,CACjBV,WACAC,QACAC,UACAC,WAGF,MAAMQ,SACGN,GAAY,iBAAmBA,EAAQE,OAAU,UAAYF,EAAQE,QAAU,KAAOF,EAAQE,MAAQ,CAAA,EAE/G,MACEK,KAAMC,EACNtB,UAAWuB,EAAgB,CAAE,EAC7BC,YAAaC,EAAkB,CAAE,EACjCC,aAAcC,EAAmB,CAAC,GAChC1B,EAEJ,OACE2B,WAAAA,KAACC,MAAAA,KAAW,IAAKb,KAAWE,KAAeC,EAAYF,IAAKA,EAAIJ,iBACtDC,GAAY,WAChBA,EAAQ,IACHI,KACAC,IAELW,MAAYA,aAAChB,EAAS,IACjBI,KACAC,KACAC,IAETQ,WAAAG,KAACF,cAAc,CAAAhB,SAAA,CACbmB,WAAAC,IAACC,UAAI,CACHC,GAAG,OACHC,WAAW,OACXC,MAAM,UACNC,UAAU,aACVC,aAAcjB,EAAW,aAAUkB,EACnCC,MAAOC,UAAYA,eACfxB,KACAlB,EAASa,SAEZE,GAASF,IAEXS,EACCU,WAAAC,IAACC,UAAI,CACHC,GAAG,OACHC,WAAW,UACXC,MAAOlB,EAAWV,SAAW,mBAAqB,2BAClD6B,UAAU,aACVG,MAAOE,UAAWA,cACdzB,KACAK,EAAaV,SAEhBS,IAED,SAELG,EAAgBmB,SAAYjB,EAAiBkB,OAAUlB,EAAiBmB,QAQrE,KAPFd,WAAAC,IAACc,sBAAU,CACThD,KAAK,IACLiD,KAAK,aACLC,WAAY,KACRxB,EACJhB,SAAUU,EAAWV,UAAYgB,EAAgBhB,WAGpDkB,EAAiBkB,OAASlB,EAAiBmB,QAC1Cd,WAAAC,IAACiB,gBAAO,CACNC,OAAO,QACPC,UAAU,MACVC,OAAQ,CACNC,QAAS,CAAEC,OAAQ,eAEjB5B,EAAgBd,SAEpBmB,WAAAC,IAACc,sBAAU,CACThD,KAAK,IACLiD,KAAK,aACLC,WAAY,KACRxB,EACJhB,SAAUU,EAAWV,UAAYgB,EAAgBhB,aAGnD,KACHP,EAAWW,SACVmB,WAAAA,IAACwB,MAAAA,MAAK,CAACzD,KAAK,IAAIwD,OAAO,UAAUN,WAAY,EAAGQ,oBAAkB,KAAKvD,IACrE,OACQ,IAIpB,CACEwD,YA1ImB,YA2InBjB,MAAOkB,UAAAA,+BA3IY"}
|
|
1
|
+
{"version":3,"file":"FormLabel.js","sources":["../../../../src/components/FormLabel/FormLabel.tsx"],"sourcesContent":["import { forwardRef, cloneElement } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { IconButton } from 'components/IconButton'\nimport { Badge } from 'components/Badge'\nimport { Tooltip } from 'components/Tooltip'\nimport * as Styled from './style'\nimport { SIZES, SIZES_LABEL, SIZES_HINT } from './constants'\nimport type { FormLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormLabel'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<label\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/packages/ui/src/components/FormLabel/types.ts).\n */\nconst FormLabel: React.ForwardRefExoticComponent<FormLabelProps> = withMergedProps<FormLabelProps, HTMLLabelElement>(\n forwardRef<HTMLLabelElement, MergedProps<FormLabelProps>>(\n (\n {\n size = 'm',\n textProps = {},\n hint = {},\n badgeProps = {},\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n disabled,\n error,\n success,\n checked,\n children,\n control,\n label,\n ...props\n },\n ref\n ) => {\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const stateProps = {\n disabled,\n error,\n success,\n checked,\n }\n\n const elementProps =\n typeof control === 'object' && typeof control.props === 'object' && control.props !== null ? control.props : {}\n\n const {\n text: hintText,\n textProps: hintTextProps = {},\n buttonProps: hintButtonProps = {},\n tooltipProps: hintTooltipProps = {},\n } = hint\n\n return (\n <Styled.Root {...props} {...sizeProps} {...stateProps} ref={ref}>\n {typeof control === 'function'\n ? control({\n ...sizeProps,\n ...stateProps,\n })\n : cloneElement(control, {\n ...sizeProps,\n ...stateProps,\n ...elementProps,\n })}\n <Styled.Content>\n <Text\n as='span'\n appearance='body'\n color='inherit'\n wordBreak='break-word'\n marginBottom={hintText ? '0.2em' : undefined}\n sizes={SIZES_LABEL}\n {...sizeProps}\n {...textProps}\n >\n {label ?? children}\n </Text>\n {hintText ? (\n <Text\n as='span'\n appearance='caption'\n color={stateProps.disabled ? 'content-disabled' : 'content-onmain-secondary'}\n wordBreak='break-word'\n sizes={SIZES_HINT}\n {...sizeProps}\n {...hintTextProps}\n >\n {hintText}\n </Text>\n ) : null}\n </Styled.Content>\n {hintButtonProps.onClick && !hintTooltipProps.title && !hintTooltipProps.content ? (\n <IconButton\n size='m'\n icon='helpCircle'\n marginLeft={6}\n {...hintButtonProps}\n disabled={stateProps.disabled || hintButtonProps.disabled}\n />\n ) : null}\n {hintTooltipProps.title || hintTooltipProps.content ? (\n <Tooltip\n preset='brand'\n placement='top'\n styles={{\n wrapper: { cursor: 'inherit' },\n }}\n {...hintTooltipProps}\n >\n <IconButton\n size='m'\n icon='helpCircle'\n marginLeft={6}\n {...hintButtonProps}\n disabled={stateProps.disabled || hintButtonProps.disabled}\n />\n </Tooltip>\n ) : null}\n {badgeProps.children ? (\n <Badge size='s' cursor='inherit' marginLeft={6} resetDefaultMargin {...badgeProps} />\n ) : null}\n </Styled.Root>\n )\n }\n ),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { FormLabel, COMPONENT_NAME }\n"],"names":["FormLabel","withMergedProps","forwardRef","size","textProps","hint","badgeProps","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","disabled","error","success","checked","children","control","label","props","ref","sizeProps","stateProps","elementProps","text","hintText","hintTextProps","buttonProps","hintButtonProps","tooltipProps","hintTooltipProps","_jsxs","Styled","cloneElement","jsxs","_jsx","jsx","Text","as","appearance","color","wordBreak","marginBottom","undefined","sizes","SIZES_LABEL","SIZES_HINT","onClick","title","content","IconButton","icon","marginLeft","Tooltip","preset","placement","styles","wrapper","cursor","Badge","resetDefaultMargin","displayName","SIZES"],"mappings":"uYAuBA,MAAMA,UAA6DC,gBAAAA,gBACjEC,MAAAA,YACE,EAEIC,OAAO,IACPC,YAAY,CAAE,EACdC,OAAO,CAAE,EACTC,aAAa,CAAE,EACfC,UACAC,SACAC,QACAC,QACAC,QACAC,SACAC,WACAC,QACAC,UACAC,UACAC,WACAC,UACAC,WACGC,GAELC,KAEA,MAAMC,EAAY,CAChBnB,OACAI,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMW,EAAa,CACjBV,WACAC,QACAC,UACAC,WAGF,MAAMQ,SACGN,GAAY,iBAAmBA,EAAQE,OAAU,UAAYF,EAAQE,QAAU,KAAOF,EAAQE,MAAQ,CAAA,EAE/G,MACEK,KAAMC,EACNtB,UAAWuB,EAAgB,CAAE,EAC7BC,YAAaC,EAAkB,CAAE,EACjCC,aAAcC,EAAmB,CAAC,GAChC1B,EAEJ,OACE2B,WAAAA,KAACC,MAAAA,KAAW,IAAKb,KAAWE,KAAeC,EAAYF,IAAKA,EAAIJ,iBACtDC,GAAY,WAChBA,EAAQ,IACHI,KACAC,IAELW,MAAYA,aAAChB,EAAS,IACjBI,KACAC,KACAC,IAETQ,WAAAG,KAACF,cAAc,CAAAhB,SAAA,CACbmB,WAAAC,IAACC,UAAI,CACHC,GAAG,OACHC,WAAW,OACXC,MAAM,UACNC,UAAU,aACVC,aAAcjB,EAAW,aAAUkB,EACnCC,MAAOC,UAAYA,eACfxB,KACAlB,EAASa,SAEZE,GAASF,IAEXS,EACCU,WAAAC,IAACC,UAAI,CACHC,GAAG,OACHC,WAAW,UACXC,MAAOlB,EAAWV,SAAW,mBAAqB,2BAClD6B,UAAU,aACVG,MAAOE,UAAWA,cACdzB,KACAK,EAAaV,SAEhBS,IAED,SAELG,EAAgBmB,SAAYjB,EAAiBkB,OAAUlB,EAAiBmB,QAQrE,KAPFd,WAAAC,IAACc,sBAAU,CACThD,KAAK,IACLiD,KAAK,aACLC,WAAY,KACRxB,EACJhB,SAAUU,EAAWV,UAAYgB,EAAgBhB,WAGpDkB,EAAiBkB,OAASlB,EAAiBmB,QAC1Cd,WAAAC,IAACiB,gBAAO,CACNC,OAAO,QACPC,UAAU,MACVC,OAAQ,CACNC,QAAS,CAAEC,OAAQ,eAEjB5B,EAAgBd,SAEpBmB,WAAAC,IAACc,sBAAU,CACThD,KAAK,IACLiD,KAAK,aACLC,WAAY,KACRxB,EACJhB,SAAUU,EAAWV,UAAYgB,EAAgBhB,aAGnD,KACHP,EAAWW,SACVmB,WAAAA,IAACwB,MAAAA,MAAK,CAACzD,KAAK,IAAIwD,OAAO,UAAUN,WAAY,EAAGQ,oBAAkB,KAAKvD,IACrE,OACQ,IAIpB,CACEwD,YA1ImB,YA2InBjB,MAAOkB,UAAAA,+BA3IY"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormLabel.mjs","sources":["../../../../src/components/FormLabel/FormLabel.tsx"],"sourcesContent":["import { forwardRef, cloneElement } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { IconButton } from 'components/IconButton'\nimport { Badge } from 'components/Badge'\nimport { Tooltip } from 'components/Tooltip'\nimport * as Styled from './style'\nimport { SIZES, SIZES_LABEL, SIZES_HINT } from './constants'\nimport type { FormLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormLabel'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<label\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/FormLabel/types.ts).\n */\nconst FormLabel: React.ForwardRefExoticComponent<FormLabelProps> = withMergedProps<FormLabelProps, HTMLLabelElement>(\n forwardRef<HTMLLabelElement, MergedProps<FormLabelProps>>(\n (\n {\n size = 'm',\n textProps = {},\n hint = {},\n badgeProps = {},\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n disabled,\n error,\n success,\n checked,\n children,\n control,\n label,\n ...props\n },\n ref\n ) => {\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const stateProps = {\n disabled,\n error,\n success,\n checked,\n }\n\n const elementProps =\n typeof control === 'object' && typeof control.props === 'object' && control.props !== null ? control.props : {}\n\n const {\n text: hintText,\n textProps: hintTextProps = {},\n buttonProps: hintButtonProps = {},\n tooltipProps: hintTooltipProps = {},\n } = hint\n\n return (\n <Styled.Root {...props} {...sizeProps} {...stateProps} ref={ref}>\n {typeof control === 'function'\n ? control({\n ...sizeProps,\n ...stateProps,\n })\n : cloneElement(control, {\n ...sizeProps,\n ...stateProps,\n ...elementProps,\n })}\n <Styled.Content>\n <Text\n as='span'\n appearance='body'\n color='inherit'\n wordBreak='break-word'\n marginBottom={hintText ? '0.2em' : undefined}\n sizes={SIZES_LABEL}\n {...sizeProps}\n {...textProps}\n >\n {label ?? children}\n </Text>\n {hintText ? (\n <Text\n as='span'\n appearance='caption'\n color={stateProps.disabled ? 'content-disabled' : 'content-onmain-secondary'}\n wordBreak='break-word'\n sizes={SIZES_HINT}\n {...sizeProps}\n {...hintTextProps}\n >\n {hintText}\n </Text>\n ) : null}\n </Styled.Content>\n {hintButtonProps.onClick && !hintTooltipProps.title && !hintTooltipProps.content ? (\n <IconButton\n size='m'\n icon='helpCircle'\n marginLeft={6}\n {...hintButtonProps}\n disabled={stateProps.disabled || hintButtonProps.disabled}\n />\n ) : null}\n {hintTooltipProps.title || hintTooltipProps.content ? (\n <Tooltip\n preset='brand'\n placement='top'\n styles={{\n wrapper: { cursor: 'inherit' },\n }}\n {...hintTooltipProps}\n >\n <IconButton\n size='m'\n icon='helpCircle'\n marginLeft={6}\n {...hintButtonProps}\n disabled={stateProps.disabled || hintButtonProps.disabled}\n />\n </Tooltip>\n ) : null}\n {badgeProps.children ? (\n <Badge size='s' cursor='inherit' marginLeft={6} resetDefaultMargin {...badgeProps} />\n ) : null}\n </Styled.Root>\n )\n }\n ),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { FormLabel, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","FormLabel","withMergedProps","forwardRef","size","textProps","hint","badgeProps","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","disabled","error","success","checked","children","control","label","props","ref","sizeProps","stateProps","elementProps","text","hintText","hintTextProps","buttonProps","hintButtonProps","tooltipProps","hintTooltipProps","_jsxs","Styled","cloneElement","_jsx","Text","as","appearance","color","wordBreak","marginBottom","undefined","sizes","SIZES_LABEL","SIZES_HINT","onClick","title","content","IconButton","icon","marginLeft","Tooltip","preset","placement","styles","wrapper","cursor","Badge","resetDefaultMargin","displayName","SIZES"],"mappings":"yZAWMA,MAAAA,eAAiB,YAYvB,MAAMC,UAA6DC,gBACjEC,YACE,EAEIC,OAAO,IACPC,YAAY,CAAE,EACdC,OAAO,CAAE,EACTC,aAAa,CAAE,EACfC,UACAC,SACAC,QACAC,QACAC,QACAC,SACAC,WACAC,QACAC,UACAC,UACAC,WACAC,UACAC,WACGC,GAELC,KAEA,MAAMC,EAAY,CAChBnB,OACAI,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMW,EAAa,CACjBV,WACAC,QACAC,UACAC,WAGF,MAAMQ,SACGN,GAAY,iBAAmBA,EAAQE,OAAU,UAAYF,EAAQE,QAAU,KAAOF,EAAQE,MAAQ,CAAA,EAE/G,MACEK,KAAMC,EACNtB,UAAWuB,EAAgB,CAAE,EAC7BC,YAAaC,EAAkB,CAAE,EACjCC,aAAcC,EAAmB,CAAC,GAChC1B,EAEJ,OACE2B,KAACC,KAAW,IAAKb,KAAWE,KAAeC,EAAYF,IAAKA,EAAIJ,iBACtDC,GAAY,WAChBA,EAAQ,IACHI,KACAC,IAELW,aAAahB,EAAS,IACjBI,KACAC,KACAC,IAETQ,KAACC,QAAc,CAAAhB,SAAA,CACbkB,IAACC,KAAI,CACHC,GAAG,OACHC,WAAW,OACXC,MAAM,UACNC,UAAU,aACVC,aAAcf,EAAW,aAAUgB,EACnCC,MAAOC,eACHtB,KACAlB,EAASa,SAEZE,GAASF,IAEXS,EACCS,IAACC,KAAI,CACHC,GAAG,OACHC,WAAW,UACXC,MAAOhB,EAAWV,SAAW,mBAAqB,2BAClD2B,UAAU,aACVG,MAAOE,cACHvB,KACAK,EAAaV,SAEhBS,IAED,SAELG,EAAgBiB,SAAYf,EAAiBgB,OAAUhB,EAAiBiB,QAQrE,KAPFb,IAACc,WAAU,CACT9C,KAAK,IACL+C,KAAK,aACLC,WAAY,KACRtB,EACJhB,SAAUU,EAAWV,UAAYgB,EAAgBhB,WAGpDkB,EAAiBgB,OAAShB,EAAiBiB,QAC1Cb,IAACiB,QAAO,CACNC,OAAO,QACPC,UAAU,MACVC,OAAQ,CACNC,QAAS,CAAEC,OAAQ,eAEjB1B,EAAgBd,SAEpBkB,IAACc,WAAU,CACT9C,KAAK,IACL+C,KAAK,aACLC,WAAY,KACRtB,EACJhB,SAAUU,EAAWV,UAAYgB,EAAgBhB,aAGnD,KACHP,EAAWW,SACVkB,IAACuB,MAAK,CAACvD,KAAK,IAAIsD,OAAO,UAAUN,WAAY,EAAGQ,oBAAkB,KAAKrD,IACrE,OACQ,IAIpB,CACEsD,YA1ImB,YA2InBjB,MAAOkB"}
|
|
1
|
+
{"version":3,"file":"FormLabel.mjs","sources":["../../../../src/components/FormLabel/FormLabel.tsx"],"sourcesContent":["import { forwardRef, cloneElement } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { IconButton } from 'components/IconButton'\nimport { Badge } from 'components/Badge'\nimport { Tooltip } from 'components/Tooltip'\nimport * as Styled from './style'\nimport { SIZES, SIZES_LABEL, SIZES_HINT } from './constants'\nimport type { FormLabelProps } from './types'\n\nconst COMPONENT_NAME = 'FormLabel'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<label\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/packages/ui/src/components/FormLabel/types.ts).\n */\nconst FormLabel: React.ForwardRefExoticComponent<FormLabelProps> = withMergedProps<FormLabelProps, HTMLLabelElement>(\n forwardRef<HTMLLabelElement, MergedProps<FormLabelProps>>(\n (\n {\n size = 'm',\n textProps = {},\n hint = {},\n badgeProps = {},\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n disabled,\n error,\n success,\n checked,\n children,\n control,\n label,\n ...props\n },\n ref\n ) => {\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const stateProps = {\n disabled,\n error,\n success,\n checked,\n }\n\n const elementProps =\n typeof control === 'object' && typeof control.props === 'object' && control.props !== null ? control.props : {}\n\n const {\n text: hintText,\n textProps: hintTextProps = {},\n buttonProps: hintButtonProps = {},\n tooltipProps: hintTooltipProps = {},\n } = hint\n\n return (\n <Styled.Root {...props} {...sizeProps} {...stateProps} ref={ref}>\n {typeof control === 'function'\n ? control({\n ...sizeProps,\n ...stateProps,\n })\n : cloneElement(control, {\n ...sizeProps,\n ...stateProps,\n ...elementProps,\n })}\n <Styled.Content>\n <Text\n as='span'\n appearance='body'\n color='inherit'\n wordBreak='break-word'\n marginBottom={hintText ? '0.2em' : undefined}\n sizes={SIZES_LABEL}\n {...sizeProps}\n {...textProps}\n >\n {label ?? children}\n </Text>\n {hintText ? (\n <Text\n as='span'\n appearance='caption'\n color={stateProps.disabled ? 'content-disabled' : 'content-onmain-secondary'}\n wordBreak='break-word'\n sizes={SIZES_HINT}\n {...sizeProps}\n {...hintTextProps}\n >\n {hintText}\n </Text>\n ) : null}\n </Styled.Content>\n {hintButtonProps.onClick && !hintTooltipProps.title && !hintTooltipProps.content ? (\n <IconButton\n size='m'\n icon='helpCircle'\n marginLeft={6}\n {...hintButtonProps}\n disabled={stateProps.disabled || hintButtonProps.disabled}\n />\n ) : null}\n {hintTooltipProps.title || hintTooltipProps.content ? (\n <Tooltip\n preset='brand'\n placement='top'\n styles={{\n wrapper: { cursor: 'inherit' },\n }}\n {...hintTooltipProps}\n >\n <IconButton\n size='m'\n icon='helpCircle'\n marginLeft={6}\n {...hintButtonProps}\n disabled={stateProps.disabled || hintButtonProps.disabled}\n />\n </Tooltip>\n ) : null}\n {badgeProps.children ? (\n <Badge size='s' cursor='inherit' marginLeft={6} resetDefaultMargin {...badgeProps} />\n ) : null}\n </Styled.Root>\n )\n }\n ),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { FormLabel, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","FormLabel","withMergedProps","forwardRef","size","textProps","hint","badgeProps","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","disabled","error","success","checked","children","control","label","props","ref","sizeProps","stateProps","elementProps","text","hintText","hintTextProps","buttonProps","hintButtonProps","tooltipProps","hintTooltipProps","_jsxs","Styled","cloneElement","_jsx","Text","as","appearance","color","wordBreak","marginBottom","undefined","sizes","SIZES_LABEL","SIZES_HINT","onClick","title","content","IconButton","icon","marginLeft","Tooltip","preset","placement","styles","wrapper","cursor","Badge","resetDefaultMargin","displayName","SIZES"],"mappings":"yZAWMA,MAAAA,eAAiB,YAYvB,MAAMC,UAA6DC,gBACjEC,YACE,EAEIC,OAAO,IACPC,YAAY,CAAE,EACdC,OAAO,CAAE,EACTC,aAAa,CAAE,EACfC,UACAC,SACAC,QACAC,QACAC,QACAC,SACAC,WACAC,QACAC,UACAC,UACAC,WACAC,UACAC,WACGC,GAELC,KAEA,MAAMC,EAAY,CAChBnB,OACAI,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMW,EAAa,CACjBV,WACAC,QACAC,UACAC,WAGF,MAAMQ,SACGN,GAAY,iBAAmBA,EAAQE,OAAU,UAAYF,EAAQE,QAAU,KAAOF,EAAQE,MAAQ,CAAA,EAE/G,MACEK,KAAMC,EACNtB,UAAWuB,EAAgB,CAAE,EAC7BC,YAAaC,EAAkB,CAAE,EACjCC,aAAcC,EAAmB,CAAC,GAChC1B,EAEJ,OACE2B,KAACC,KAAW,IAAKb,KAAWE,KAAeC,EAAYF,IAAKA,EAAIJ,iBACtDC,GAAY,WAChBA,EAAQ,IACHI,KACAC,IAELW,aAAahB,EAAS,IACjBI,KACAC,KACAC,IAETQ,KAACC,QAAc,CAAAhB,SAAA,CACbkB,IAACC,KAAI,CACHC,GAAG,OACHC,WAAW,OACXC,MAAM,UACNC,UAAU,aACVC,aAAcf,EAAW,aAAUgB,EACnCC,MAAOC,eACHtB,KACAlB,EAASa,SAEZE,GAASF,IAEXS,EACCS,IAACC,KAAI,CACHC,GAAG,OACHC,WAAW,UACXC,MAAOhB,EAAWV,SAAW,mBAAqB,2BAClD2B,UAAU,aACVG,MAAOE,cACHvB,KACAK,EAAaV,SAEhBS,IAED,SAELG,EAAgBiB,SAAYf,EAAiBgB,OAAUhB,EAAiBiB,QAQrE,KAPFb,IAACc,WAAU,CACT9C,KAAK,IACL+C,KAAK,aACLC,WAAY,KACRtB,EACJhB,SAAUU,EAAWV,UAAYgB,EAAgBhB,WAGpDkB,EAAiBgB,OAAShB,EAAiBiB,QAC1Cb,IAACiB,QAAO,CACNC,OAAO,QACPC,UAAU,MACVC,OAAQ,CACNC,QAAS,CAAEC,OAAQ,eAEjB1B,EAAgBd,SAEpBkB,IAACc,WAAU,CACT9C,KAAK,IACL+C,KAAK,aACLC,WAAY,KACRtB,EACJhB,SAAUU,EAAWV,UAAYgB,EAAgBhB,aAGnD,KACHP,EAAWW,SACVkB,IAACuB,MAAK,CAACvD,KAAK,IAAIsD,OAAO,UAAUN,WAAY,EAAGQ,oBAAkB,KAAKrD,IACrE,OACQ,IAIpB,CACEsD,YA1ImB,YA2InBjB,MAAOkB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.js","sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import { forwardRef, useEffect, useState } from 'react'\nimport { useTheme } from 'styled-components'\nimport DOMPurify from 'dompurify'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useClassname } from 'hooks/useClassname'\nimport { SIZES } from './constants'\nimport { ICONS, ICONS_DEFAULT } from './list'\nimport * as Styled from './style'\nimport type { IconProps, SvgDynamicModule } from './types'\nimport { BackgroundWorker } from './bg-worker'\n\nconst COMPONENT_NAME = 'Icon'\n\nconst cache: Record<string, string | null> = {}\nconst retryAttempts = 3\nconst worker = new BackgroundWorker<{ xhr: XMLHttpRequest; url: string }>()\n\nworker.run(({ xhr, url }) => {\n xhr.open('GET', url)\n xhr.send()\n})\n\nconst fetchImage = async (url: string): Promise<string> => {\n let retries = 0\n return new Promise((resolve, reject) => {\n const xhr = new XMLHttpRequest()\n xhr.responseType = 'text'\n xhr.open('GET', url)\n xhr.send()\n xhr.onload = function () {\n if (xhr.status >= 200 && xhr.status < 400) {\n const content = DOMPurify.sanitize(xhr.response)\n resolve(content)\n } else {\n reject(new Error(`Failed to load icon from \"${url}\".`))\n }\n }\n\n xhr.onerror = function () {\n retries++\n if (retries < retryAttempts) {\n worker.add({ url, xhr })\n }\n\n if (retries >= retryAttempts) {\n reject(new Error(`Failed to load icon from \"${url}\" after ${retryAttempts} attempts.`))\n }\n }\n })\n}\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IconProps](https://github.com/foxford/ui/blob/master/src/components/Icon/types.ts)\n */\nconst Icon: React.ForwardRefExoticComponent<IconProps> = withMergedProps<IconProps, HTMLSpanElement>(\n forwardRef<HTMLSpanElement, MergedProps<IconProps>>((props, ref) => {\n const theme = useTheme()\n const { assetHost } = theme\n const { size = 'inherit', name = 'unknown', icon, preset, ...restProps } = props\n const cacheName = `${preset}_${name}`\n const [content, setContent] = useState<string | null>(cache[cacheName] ?? null)\n\n const className = useClassname(COMPONENT_NAME, restProps.className)\n\n const iconUrl: SvgDynamicModule | null | undefined =\n name === 'unknown' ? null : (preset === 'brand' ? ICONS : ICONS_DEFAULT)[name]\n\n useEffect(() => {\n if (!iconUrl) return\n if (cache[cacheName] && cache[cacheName] !== null) {\n setContent(cache[cacheName])\n return\n }\n\n if (cache[cacheName] === null) {\n document.addEventListener(\n `IconLoaded_${cacheName}`,\n (event: Event) => {\n const detail = (event as CustomEvent<{ name: string; content: string }>).detail\n if (detail && detail.name === name && detail.content) {\n setContent(detail.content)\n }\n },\n { once: true }\n )\n return\n }\n\n ;(async () => {\n cache[cacheName] = null\n\n const module = await iconUrl()\n const url = module?.default\n\n if (!url) return\n\n let imgContent: string\n\n try {\n imgContent = await fetchImage(`${assetHost ?? ''}${url}`)\n cache[cacheName] = imgContent\n setContent(imgContent)\n document.dispatchEvent(new CustomEvent(`IconLoaded_${cacheName}`, { detail: { name, content: imgContent } }))\n } catch (error) {\n console.error(error)\n }\n })()\n }, [iconUrl, name, cacheName, assetHost])\n\n const contentProps = icon ? { children: icon } : { dangerouslySetInnerHTML: { __html: content } }\n\n return <Styled.Root {...restProps} size={size} className={className} ref={ref} {...contentProps} />\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { Icon }\n"],"names":["cache","worker","BackgroundWorker","run","xhr","url","open","send","Icon","withMergedProps","forwardRef","props","ref","theme","useTheme","assetHost","size","name","icon","preset","restProps","cacheName","content","setContent","useState","className","useClassname","iconUrl","ICONS","ICONS_DEFAULT","useEffect","module","default","imgContent","async","retries","Promise","resolve","reject","XMLHttpRequest","responseType","onload","status","DOMPurify","sanitize","response","Error","onerror","add","fetchImage","document","dispatchEvent","CustomEvent","detail","error","console","addEventListener","event","once","contentProps","children","dangerouslySetInnerHTML","__html","_jsx","Styled","displayName","sizes","SIZES"],"mappings":"2hBAcA,MAAMA,MAAuC,CAAA,EAE7C,MAAMC,OAAS,IAAIC,SAAAA,iBAEnBD,OAAOE,KAAI,EAAGC,MAAKC,UACjBD,EAAIE,KAAK,MAAOD,GAChBD,EAAIG,MAAM,IA0CNC,MAAAA,KAAmDC,gBAAAA,gBACvDC,MAAAA,YAAoD,CAACC,EAAOC,KAC1D,MAAMC,EAAQC,OAAAA,WACd,MAAMC,UAAEA,GAAcF,EACtB,MAAMG,KAAEA,EAAO,UAASC,KAAEA,EAAO,UAASC,KAAEA,EAAIC,OAAEA,KAAWC,GAAcT,EAC3E,MAAMU,EAAY,GAAGF,KAAUF,IAC/B,MAAOK,EAASC,GAAcC,MAAAA,SAAwBxB,MAAMqB,IAAc,MAE1E,MAAMI,EAAYC,aAAYA,aA1DX,OA0D4BN,EAAUK,WAEzD,MAAME,EACJV,IAAS,UAAY,MAAQE,IAAW,QAAUS,MAAKA,MAAGC,qBAAeZ,GAE3Ea,MAAAA,WAAU,KACHH,IACD3B,MAAMqB,IAAcrB,MAAMqB,KAAe,KAC3CE,EAAWvB,MAAMqB,IAIfrB,MAAMqB,KAAe,KAcxB,WACCrB,MAAMqB,GAAa,KAEnB,MAAMU,QAAeJ,IACrB,MAAMtB,EAAM0B,GAAQC,QAEpB,IAAK3B,EAAK,OAEV,IAAI4B,EAEJ,IACEA,OApFSC,WACjB,IAAIC,EAAU,EACd,OAAO,IAAIC,SAAQ,CAACC,EAASC,KAC3B,MAAMlC,EAAM,IAAImC,eAChBnC,EAAIoC,aAAe,OACnBpC,EAAIE,KAAK,MAAOD,GAChBD,EAAIG,OACJH,EAAIqC,OAAS,KACX,GAAIrC,EAAIsC,QAAU,KAAOtC,EAAIsC,OAAS,IAAK,CACzC,MAAMpB,EAAUqB,mBAASX,QAACY,SAASxC,EAAIyC,UACvCR,EAAQf,EACV,MACEgB,EAAO,IAAIQ,MAAM,6BAA6BzC,SAIlDD,EAAI2C,QAAU,KACZZ,IACIA,EA1BY,GA2BdlC,OAAO+C,IAAI,CAAE3C,MAAKD,QAGhB+B,GA9BY,GA+BdG,EAAO,IAAIQ,MAAM,6BAA6BzC,yBAEjD,GACD,EA0DyB4C,CAAW,GAAGlC,GAAa,KAAKV,KACnDL,MAAMqB,GAAaY,EACnBV,EAAWU,GACXiB,SAASC,cAAc,IAAIC,YAAY,cAAc/B,IAAa,CAAEgC,OAAQ,CAAEpC,OAAMK,QAASW,KAC9F,CAAC,MAAOqB,GACPC,QAAQD,MAAMA,EAChB,CACD,EAlBA,GAbCJ,SAASM,iBACP,cAAcnC,KACboC,IACC,MAAMJ,EAAUI,EAAyDJ,OACrEA,GAAUA,EAAOpC,OAASA,GAAQoC,EAAO/B,SAC3CC,EAAW8B,EAAO/B,QACpB,GAEF,CAAEoC,MAAM,IAuBR,GACH,CAAC/B,EAASV,EAAMI,EAAWN,IAE9B,MAAM4C,EAAezC,EAAO,CAAE0C,SAAU1C,GAAS,CAAE2C,wBAAyB,CAAEC,OAAQxC,IAEtF,OAAOyC,WAAAA,IAACC,MAAAA,KAAW,IAAK5C,EAAWJ,KAAMA,EAAMS,UAAWA,EAAWb,IAAKA,KAAS+C,GAAgB,IAErG,CACEM,YA9GmB,OA+GnBC,MAAOC,UAAAA"}
|
|
1
|
+
{"version":3,"file":"Icon.js","sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import { forwardRef, useEffect, useState } from 'react'\nimport { useTheme } from 'styled-components'\nimport DOMPurify from 'dompurify'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useClassname } from 'hooks/useClassname'\nimport { SIZES } from './constants'\nimport { ICONS, ICONS_DEFAULT } from './list'\nimport * as Styled from './style'\nimport type { IconProps, SvgDynamicModule } from './types'\nimport { BackgroundWorker } from './bg-worker'\n\nconst COMPONENT_NAME = 'Icon'\n\nconst cache: Record<string, string | null> = {}\nconst retryAttempts = 3\nconst worker = new BackgroundWorker<{ xhr: XMLHttpRequest; url: string }>()\n\nworker.run(({ xhr, url }) => {\n xhr.open('GET', url)\n xhr.send()\n})\n\nconst fetchImage = async (url: string): Promise<string> => {\n let retries = 0\n return new Promise((resolve, reject) => {\n const xhr = new XMLHttpRequest()\n xhr.responseType = 'text'\n xhr.open('GET', url)\n xhr.send()\n xhr.onload = function () {\n if (xhr.status >= 200 && xhr.status < 400) {\n const content = DOMPurify.sanitize(xhr.response)\n resolve(content)\n } else {\n reject(new Error(`Failed to load icon from \"${url}\".`))\n }\n }\n\n xhr.onerror = function () {\n retries++\n if (retries < retryAttempts) {\n worker.add({ url, xhr })\n }\n\n if (retries >= retryAttempts) {\n reject(new Error(`Failed to load icon from \"${url}\" after ${retryAttempts} attempts.`))\n }\n }\n })\n}\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IconProps](https://github.com/foxford/ui/blob/master/packages/ui/src/components/Icon/types.ts)\n */\nconst Icon: React.ForwardRefExoticComponent<IconProps> = withMergedProps<IconProps, HTMLSpanElement>(\n forwardRef<HTMLSpanElement, MergedProps<IconProps>>((props, ref) => {\n const theme = useTheme()\n const { assetHost } = theme\n const { size = 'inherit', name = 'unknown', icon, preset, ...restProps } = props\n const cacheName = `${preset}_${name}`\n const [content, setContent] = useState<string | null>(cache[cacheName] ?? null)\n\n const className = useClassname(COMPONENT_NAME, restProps.className)\n\n const iconUrl: SvgDynamicModule | null | undefined =\n name === 'unknown' ? null : (preset === 'brand' ? ICONS : ICONS_DEFAULT)[name]\n\n useEffect(() => {\n if (!iconUrl) return\n if (cache[cacheName] && cache[cacheName] !== null) {\n setContent(cache[cacheName])\n return\n }\n\n if (cache[cacheName] === null) {\n document.addEventListener(\n `IconLoaded_${cacheName}`,\n (event: Event) => {\n const detail = (event as CustomEvent<{ name: string; content: string }>).detail\n if (detail && detail.name === name && detail.content) {\n setContent(detail.content)\n }\n },\n { once: true }\n )\n return\n }\n\n ;(async () => {\n cache[cacheName] = null\n\n const module = await iconUrl()\n const url = module?.default\n\n if (!url) return\n\n let imgContent: string\n\n try {\n imgContent = await fetchImage(`${assetHost ?? ''}${url}`)\n cache[cacheName] = imgContent\n setContent(imgContent)\n document.dispatchEvent(new CustomEvent(`IconLoaded_${cacheName}`, { detail: { name, content: imgContent } }))\n } catch (error) {\n console.error(error)\n }\n })()\n }, [iconUrl, name, cacheName, assetHost])\n\n const contentProps = icon ? { children: icon } : { dangerouslySetInnerHTML: { __html: content } }\n\n return <Styled.Root {...restProps} size={size} className={className} ref={ref} {...contentProps} />\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { Icon }\n"],"names":["cache","worker","BackgroundWorker","run","xhr","url","open","send","Icon","withMergedProps","forwardRef","props","ref","theme","useTheme","assetHost","size","name","icon","preset","restProps","cacheName","content","setContent","useState","className","useClassname","iconUrl","ICONS","ICONS_DEFAULT","useEffect","module","default","imgContent","async","retries","Promise","resolve","reject","XMLHttpRequest","responseType","onload","status","DOMPurify","sanitize","response","Error","onerror","add","fetchImage","document","dispatchEvent","CustomEvent","detail","error","console","addEventListener","event","once","contentProps","children","dangerouslySetInnerHTML","__html","_jsx","Styled","displayName","sizes","SIZES"],"mappings":"2hBAcA,MAAMA,MAAuC,CAAA,EAE7C,MAAMC,OAAS,IAAIC,SAAAA,iBAEnBD,OAAOE,KAAI,EAAGC,MAAKC,UACjBD,EAAIE,KAAK,MAAOD,GAChBD,EAAIG,MAAM,IA0CNC,MAAAA,KAAmDC,gBAAAA,gBACvDC,MAAAA,YAAoD,CAACC,EAAOC,KAC1D,MAAMC,EAAQC,OAAAA,WACd,MAAMC,UAAEA,GAAcF,EACtB,MAAMG,KAAEA,EAAO,UAASC,KAAEA,EAAO,UAASC,KAAEA,EAAIC,OAAEA,KAAWC,GAAcT,EAC3E,MAAMU,EAAY,GAAGF,KAAUF,IAC/B,MAAOK,EAASC,GAAcC,MAAAA,SAAwBxB,MAAMqB,IAAc,MAE1E,MAAMI,EAAYC,aAAYA,aA1DX,OA0D4BN,EAAUK,WAEzD,MAAME,EACJV,IAAS,UAAY,MAAQE,IAAW,QAAUS,MAAKA,MAAGC,qBAAeZ,GAE3Ea,MAAAA,WAAU,KACHH,IACD3B,MAAMqB,IAAcrB,MAAMqB,KAAe,KAC3CE,EAAWvB,MAAMqB,IAIfrB,MAAMqB,KAAe,KAcxB,WACCrB,MAAMqB,GAAa,KAEnB,MAAMU,QAAeJ,IACrB,MAAMtB,EAAM0B,GAAQC,QAEpB,IAAK3B,EAAK,OAEV,IAAI4B,EAEJ,IACEA,OApFSC,WACjB,IAAIC,EAAU,EACd,OAAO,IAAIC,SAAQ,CAACC,EAASC,KAC3B,MAAMlC,EAAM,IAAImC,eAChBnC,EAAIoC,aAAe,OACnBpC,EAAIE,KAAK,MAAOD,GAChBD,EAAIG,OACJH,EAAIqC,OAAS,KACX,GAAIrC,EAAIsC,QAAU,KAAOtC,EAAIsC,OAAS,IAAK,CACzC,MAAMpB,EAAUqB,mBAASX,QAACY,SAASxC,EAAIyC,UACvCR,EAAQf,EACV,MACEgB,EAAO,IAAIQ,MAAM,6BAA6BzC,SAIlDD,EAAI2C,QAAU,KACZZ,IACIA,EA1BY,GA2BdlC,OAAO+C,IAAI,CAAE3C,MAAKD,QAGhB+B,GA9BY,GA+BdG,EAAO,IAAIQ,MAAM,6BAA6BzC,yBAEjD,GACD,EA0DyB4C,CAAW,GAAGlC,GAAa,KAAKV,KACnDL,MAAMqB,GAAaY,EACnBV,EAAWU,GACXiB,SAASC,cAAc,IAAIC,YAAY,cAAc/B,IAAa,CAAEgC,OAAQ,CAAEpC,OAAMK,QAASW,KAC9F,CAAC,MAAOqB,GACPC,QAAQD,MAAMA,EAChB,CACD,EAlBA,GAbCJ,SAASM,iBACP,cAAcnC,KACboC,IACC,MAAMJ,EAAUI,EAAyDJ,OACrEA,GAAUA,EAAOpC,OAASA,GAAQoC,EAAO/B,SAC3CC,EAAW8B,EAAO/B,QACpB,GAEF,CAAEoC,MAAM,IAuBR,GACH,CAAC/B,EAASV,EAAMI,EAAWN,IAE9B,MAAM4C,EAAezC,EAAO,CAAE0C,SAAU1C,GAAS,CAAE2C,wBAAyB,CAAEC,OAAQxC,IAEtF,OAAOyC,WAAAA,IAACC,MAAAA,KAAW,IAAK5C,EAAWJ,KAAMA,EAAMS,UAAWA,EAAWb,IAAKA,KAAS+C,GAAgB,IAErG,CACEM,YA9GmB,OA+GnBC,MAAOC,UAAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.mjs","sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import { forwardRef, useEffect, useState } from 'react'\nimport { useTheme } from 'styled-components'\nimport DOMPurify from 'dompurify'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useClassname } from 'hooks/useClassname'\nimport { SIZES } from './constants'\nimport { ICONS, ICONS_DEFAULT } from './list'\nimport * as Styled from './style'\nimport type { IconProps, SvgDynamicModule } from './types'\nimport { BackgroundWorker } from './bg-worker'\n\nconst COMPONENT_NAME = 'Icon'\n\nconst cache: Record<string, string | null> = {}\nconst retryAttempts = 3\nconst worker = new BackgroundWorker<{ xhr: XMLHttpRequest; url: string }>()\n\nworker.run(({ xhr, url }) => {\n xhr.open('GET', url)\n xhr.send()\n})\n\nconst fetchImage = async (url: string): Promise<string> => {\n let retries = 0\n return new Promise((resolve, reject) => {\n const xhr = new XMLHttpRequest()\n xhr.responseType = 'text'\n xhr.open('GET', url)\n xhr.send()\n xhr.onload = function () {\n if (xhr.status >= 200 && xhr.status < 400) {\n const content = DOMPurify.sanitize(xhr.response)\n resolve(content)\n } else {\n reject(new Error(`Failed to load icon from \"${url}\".`))\n }\n }\n\n xhr.onerror = function () {\n retries++\n if (retries < retryAttempts) {\n worker.add({ url, xhr })\n }\n\n if (retries >= retryAttempts) {\n reject(new Error(`Failed to load icon from \"${url}\" after ${retryAttempts} attempts.`))\n }\n }\n })\n}\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IconProps](https://github.com/foxford/ui/blob/master/src/components/Icon/types.ts)\n */\nconst Icon: React.ForwardRefExoticComponent<IconProps> = withMergedProps<IconProps, HTMLSpanElement>(\n forwardRef<HTMLSpanElement, MergedProps<IconProps>>((props, ref) => {\n const theme = useTheme()\n const { assetHost } = theme\n const { size = 'inherit', name = 'unknown', icon, preset, ...restProps } = props\n const cacheName = `${preset}_${name}`\n const [content, setContent] = useState<string | null>(cache[cacheName] ?? null)\n\n const className = useClassname(COMPONENT_NAME, restProps.className)\n\n const iconUrl: SvgDynamicModule | null | undefined =\n name === 'unknown' ? null : (preset === 'brand' ? ICONS : ICONS_DEFAULT)[name]\n\n useEffect(() => {\n if (!iconUrl) return\n if (cache[cacheName] && cache[cacheName] !== null) {\n setContent(cache[cacheName])\n return\n }\n\n if (cache[cacheName] === null) {\n document.addEventListener(\n `IconLoaded_${cacheName}`,\n (event: Event) => {\n const detail = (event as CustomEvent<{ name: string; content: string }>).detail\n if (detail && detail.name === name && detail.content) {\n setContent(detail.content)\n }\n },\n { once: true }\n )\n return\n }\n\n ;(async () => {\n cache[cacheName] = null\n\n const module = await iconUrl()\n const url = module?.default\n\n if (!url) return\n\n let imgContent: string\n\n try {\n imgContent = await fetchImage(`${assetHost ?? ''}${url}`)\n cache[cacheName] = imgContent\n setContent(imgContent)\n document.dispatchEvent(new CustomEvent(`IconLoaded_${cacheName}`, { detail: { name, content: imgContent } }))\n } catch (error) {\n console.error(error)\n }\n })()\n }, [iconUrl, name, cacheName, assetHost])\n\n const contentProps = icon ? { children: icon } : { dangerouslySetInnerHTML: { __html: content } }\n\n return <Styled.Root {...restProps} size={size} className={className} ref={ref} {...contentProps} />\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { Icon }\n"],"names":["cache","worker","BackgroundWorker","run","xhr","url","open","send","Icon","withMergedProps","forwardRef","props","ref","theme","useTheme","assetHost","size","name","icon","preset","restProps","cacheName","content","setContent","useState","className","useClassname","iconUrl","ICONS","ICONS_DEFAULT","useEffect","module","default","imgContent","async","retries","Promise","resolve","reject","XMLHttpRequest","responseType","onload","status","DOMPurify","sanitize","response","Error","onerror","add","fetchImage","document","dispatchEvent","CustomEvent","detail","error","console","addEventListener","event","once","contentProps","children","dangerouslySetInnerHTML","__html","_jsx","Styled","displayName","sizes","SIZES"],"mappings":"ibAcA,MAAMA,MAAuC,CAAA,EAE7C,MAAMC,OAAS,IAAIC,iBAEnBD,OAAOE,KAAI,EAAGC,MAAKC,UACjBD,EAAIE,KAAK,MAAOD,GAChBD,EAAIG,MAAM,IA0CNC,MAAAA,KAAmDC,gBACvDC,YAAoD,CAACC,EAAOC,KAC1D,MAAMC,EAAQC,WACd,MAAMC,UAAEA,GAAcF,EACtB,MAAMG,KAAEA,EAAO,UAASC,KAAEA,EAAO,UAASC,KAAEA,EAAIC,OAAEA,KAAWC,GAAcT,EAC3E,MAAMU,EAAY,GAAGF,KAAUF,IAC/B,MAAOK,EAASC,GAAcC,SAAwBxB,MAAMqB,IAAc,MAE1E,MAAMI,EAAYC,aA1DC,OA0D4BN,EAAUK,WAEzD,MAAME,EACJV,IAAS,UAAY,MAAQE,IAAW,QAAUS,MAAQC,eAAeZ,GAE3Ea,WAAU,KACHH,IACD3B,MAAMqB,IAAcrB,MAAMqB,KAAe,KAC3CE,EAAWvB,MAAMqB,IAIfrB,MAAMqB,KAAe,KAcxB,WACCrB,MAAMqB,GAAa,KAEnB,MAAMU,QAAeJ,IACrB,MAAMtB,EAAM0B,GAAQC,QAEpB,IAAK3B,EAAK,OAEV,IAAI4B,EAEJ,IACEA,OApFSC,WACjB,IAAIC,EAAU,EACd,OAAO,IAAIC,SAAQ,CAACC,EAASC,KAC3B,MAAMlC,EAAM,IAAImC,eAChBnC,EAAIoC,aAAe,OACnBpC,EAAIE,KAAK,MAAOD,GAChBD,EAAIG,OACJH,EAAIqC,OAAS,KACX,GAAIrC,EAAIsC,QAAU,KAAOtC,EAAIsC,OAAS,IAAK,CACzC,MAAMpB,EAAUqB,UAAUC,SAASxC,EAAIyC,UACvCR,EAAQf,EACV,MACEgB,EAAO,IAAIQ,MAAM,6BAA6BzC,SAIlDD,EAAI2C,QAAU,KACZZ,IACIA,EA1BY,GA2BdlC,OAAO+C,IAAI,CAAE3C,MAAKD,QAGhB+B,GA9BY,GA+BdG,EAAO,IAAIQ,MAAM,6BAA6BzC,yBAEjD,GACD,EA0DyB4C,CAAW,GAAGlC,GAAa,KAAKV,KACnDL,MAAMqB,GAAaY,EACnBV,EAAWU,GACXiB,SAASC,cAAc,IAAIC,YAAY,cAAc/B,IAAa,CAAEgC,OAAQ,CAAEpC,OAAMK,QAASW,KAC9F,CAAC,MAAOqB,GACPC,QAAQD,MAAMA,EAChB,CACD,EAlBA,GAbCJ,SAASM,iBACP,cAAcnC,KACboC,IACC,MAAMJ,EAAUI,EAAyDJ,OACrEA,GAAUA,EAAOpC,OAASA,GAAQoC,EAAO/B,SAC3CC,EAAW8B,EAAO/B,QACpB,GAEF,CAAEoC,MAAM,IAuBR,GACH,CAAC/B,EAASV,EAAMI,EAAWN,IAE9B,MAAM4C,EAAezC,EAAO,CAAE0C,SAAU1C,GAAS,CAAE2C,wBAAyB,CAAEC,OAAQxC,IAEtF,OAAOyC,IAACC,KAAW,IAAK5C,EAAWJ,KAAMA,EAAMS,UAAWA,EAAWb,IAAKA,KAAS+C,GAAgB,IAErG,CACEM,YA9GmB,OA+GnBC,MAAOC"}
|
|
1
|
+
{"version":3,"file":"Icon.mjs","sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import { forwardRef, useEffect, useState } from 'react'\nimport { useTheme } from 'styled-components'\nimport DOMPurify from 'dompurify'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { useClassname } from 'hooks/useClassname'\nimport { SIZES } from './constants'\nimport { ICONS, ICONS_DEFAULT } from './list'\nimport * as Styled from './style'\nimport type { IconProps, SvgDynamicModule } from './types'\nimport { BackgroundWorker } from './bg-worker'\n\nconst COMPONENT_NAME = 'Icon'\n\nconst cache: Record<string, string | null> = {}\nconst retryAttempts = 3\nconst worker = new BackgroundWorker<{ xhr: XMLHttpRequest; url: string }>()\n\nworker.run(({ xhr, url }) => {\n xhr.open('GET', url)\n xhr.send()\n})\n\nconst fetchImage = async (url: string): Promise<string> => {\n let retries = 0\n return new Promise((resolve, reject) => {\n const xhr = new XMLHttpRequest()\n xhr.responseType = 'text'\n xhr.open('GET', url)\n xhr.send()\n xhr.onload = function () {\n if (xhr.status >= 200 && xhr.status < 400) {\n const content = DOMPurify.sanitize(xhr.response)\n resolve(content)\n } else {\n reject(new Error(`Failed to load icon from \"${url}\".`))\n }\n }\n\n xhr.onerror = function () {\n retries++\n if (retries < retryAttempts) {\n worker.add({ url, xhr })\n }\n\n if (retries >= retryAttempts) {\n reject(new Error(`Failed to load icon from \"${url}\" after ${retryAttempts} attempts.`))\n }\n }\n })\n}\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IconProps](https://github.com/foxford/ui/blob/master/packages/ui/src/components/Icon/types.ts)\n */\nconst Icon: React.ForwardRefExoticComponent<IconProps> = withMergedProps<IconProps, HTMLSpanElement>(\n forwardRef<HTMLSpanElement, MergedProps<IconProps>>((props, ref) => {\n const theme = useTheme()\n const { assetHost } = theme\n const { size = 'inherit', name = 'unknown', icon, preset, ...restProps } = props\n const cacheName = `${preset}_${name}`\n const [content, setContent] = useState<string | null>(cache[cacheName] ?? null)\n\n const className = useClassname(COMPONENT_NAME, restProps.className)\n\n const iconUrl: SvgDynamicModule | null | undefined =\n name === 'unknown' ? null : (preset === 'brand' ? ICONS : ICONS_DEFAULT)[name]\n\n useEffect(() => {\n if (!iconUrl) return\n if (cache[cacheName] && cache[cacheName] !== null) {\n setContent(cache[cacheName])\n return\n }\n\n if (cache[cacheName] === null) {\n document.addEventListener(\n `IconLoaded_${cacheName}`,\n (event: Event) => {\n const detail = (event as CustomEvent<{ name: string; content: string }>).detail\n if (detail && detail.name === name && detail.content) {\n setContent(detail.content)\n }\n },\n { once: true }\n )\n return\n }\n\n ;(async () => {\n cache[cacheName] = null\n\n const module = await iconUrl()\n const url = module?.default\n\n if (!url) return\n\n let imgContent: string\n\n try {\n imgContent = await fetchImage(`${assetHost ?? ''}${url}`)\n cache[cacheName] = imgContent\n setContent(imgContent)\n document.dispatchEvent(new CustomEvent(`IconLoaded_${cacheName}`, { detail: { name, content: imgContent } }))\n } catch (error) {\n console.error(error)\n }\n })()\n }, [iconUrl, name, cacheName, assetHost])\n\n const contentProps = icon ? { children: icon } : { dangerouslySetInnerHTML: { __html: content } }\n\n return <Styled.Root {...restProps} size={size} className={className} ref={ref} {...contentProps} />\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { Icon }\n"],"names":["cache","worker","BackgroundWorker","run","xhr","url","open","send","Icon","withMergedProps","forwardRef","props","ref","theme","useTheme","assetHost","size","name","icon","preset","restProps","cacheName","content","setContent","useState","className","useClassname","iconUrl","ICONS","ICONS_DEFAULT","useEffect","module","default","imgContent","async","retries","Promise","resolve","reject","XMLHttpRequest","responseType","onload","status","DOMPurify","sanitize","response","Error","onerror","add","fetchImage","document","dispatchEvent","CustomEvent","detail","error","console","addEventListener","event","once","contentProps","children","dangerouslySetInnerHTML","__html","_jsx","Styled","displayName","sizes","SIZES"],"mappings":"ibAcA,MAAMA,MAAuC,CAAA,EAE7C,MAAMC,OAAS,IAAIC,iBAEnBD,OAAOE,KAAI,EAAGC,MAAKC,UACjBD,EAAIE,KAAK,MAAOD,GAChBD,EAAIG,MAAM,IA0CNC,MAAAA,KAAmDC,gBACvDC,YAAoD,CAACC,EAAOC,KAC1D,MAAMC,EAAQC,WACd,MAAMC,UAAEA,GAAcF,EACtB,MAAMG,KAAEA,EAAO,UAASC,KAAEA,EAAO,UAASC,KAAEA,EAAIC,OAAEA,KAAWC,GAAcT,EAC3E,MAAMU,EAAY,GAAGF,KAAUF,IAC/B,MAAOK,EAASC,GAAcC,SAAwBxB,MAAMqB,IAAc,MAE1E,MAAMI,EAAYC,aA1DC,OA0D4BN,EAAUK,WAEzD,MAAME,EACJV,IAAS,UAAY,MAAQE,IAAW,QAAUS,MAAQC,eAAeZ,GAE3Ea,WAAU,KACHH,IACD3B,MAAMqB,IAAcrB,MAAMqB,KAAe,KAC3CE,EAAWvB,MAAMqB,IAIfrB,MAAMqB,KAAe,KAcxB,WACCrB,MAAMqB,GAAa,KAEnB,MAAMU,QAAeJ,IACrB,MAAMtB,EAAM0B,GAAQC,QAEpB,IAAK3B,EAAK,OAEV,IAAI4B,EAEJ,IACEA,OApFSC,WACjB,IAAIC,EAAU,EACd,OAAO,IAAIC,SAAQ,CAACC,EAASC,KAC3B,MAAMlC,EAAM,IAAImC,eAChBnC,EAAIoC,aAAe,OACnBpC,EAAIE,KAAK,MAAOD,GAChBD,EAAIG,OACJH,EAAIqC,OAAS,KACX,GAAIrC,EAAIsC,QAAU,KAAOtC,EAAIsC,OAAS,IAAK,CACzC,MAAMpB,EAAUqB,UAAUC,SAASxC,EAAIyC,UACvCR,EAAQf,EACV,MACEgB,EAAO,IAAIQ,MAAM,6BAA6BzC,SAIlDD,EAAI2C,QAAU,KACZZ,IACIA,EA1BY,GA2BdlC,OAAO+C,IAAI,CAAE3C,MAAKD,QAGhB+B,GA9BY,GA+BdG,EAAO,IAAIQ,MAAM,6BAA6BzC,yBAEjD,GACD,EA0DyB4C,CAAW,GAAGlC,GAAa,KAAKV,KACnDL,MAAMqB,GAAaY,EACnBV,EAAWU,GACXiB,SAASC,cAAc,IAAIC,YAAY,cAAc/B,IAAa,CAAEgC,OAAQ,CAAEpC,OAAMK,QAASW,KAC9F,CAAC,MAAOqB,GACPC,QAAQD,MAAMA,EAChB,CACD,EAlBA,GAbCJ,SAASM,iBACP,cAAcnC,KACboC,IACC,MAAMJ,EAAUI,EAAyDJ,OACrEA,GAAUA,EAAOpC,OAASA,GAAQoC,EAAO/B,SAC3CC,EAAW8B,EAAO/B,QACpB,GAEF,CAAEoC,MAAM,IAuBR,GACH,CAAC/B,EAASV,EAAMI,EAAWN,IAE9B,MAAM4C,EAAezC,EAAO,CAAE0C,SAAU1C,GAAS,CAAE2C,wBAAyB,CAAEC,OAAQxC,IAEtF,OAAOyC,IAACC,KAAW,IAAK5C,EAAWJ,KAAMA,EAAMS,UAAWA,EAAWb,IAAKA,KAAS+C,GAAgB,IAErG,CACEM,YA9GmB,OA+GnBC,MAAOC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.js","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport * as Styled from './style'\nimport type { IconButtonProps } from './types'\n\nconst COMPONENT_NAME = 'IconButton'\n\n/**\n *\n * Component accepts all \\<button\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IconButtonProps](https://github.com/foxford/ui/blob/master/src/components/IconButton/types.ts)\n */\nconst IconButton: React.ForwardRefExoticComponent<IconButtonProps> = withMergedProps<\n IconButtonProps,\n HTMLButtonElement\n>(\n forwardRef<HTMLButtonElement, MergedProps<IconButtonProps>>((props, ref) => {\n const { size = 'm', type = 'button', iconProps = {}, icon, ...restProps } = props\n\n return (\n <Styled.Root {...restProps} size={size} type={type} ref={ref}>\n <Icon\n preset='brand'\n name={typeof icon === 'string' ? icon : undefined}\n icon={typeof icon !== 'string' ? icon : undefined}\n {...iconProps}\n />\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (props.square ? SIZES_SQUARE : SIZES),\n }\n)\n\nexport { IconButton }\n"],"names":["IconButton","withMergedProps","forwardRef","props","ref","size","type","iconProps","icon","restProps","_jsx","Styled","children","jsx","Icon","preset","name","undefined","displayName","sizes","square","SIZES_SQUARE","SIZES"],"mappings":"6PAoBMA,MAAAA,WAA+DC,gBAAAA,gBAInEC,MAAAA,YAA4D,CAACC,EAAOC,KAClE,MAAMC,KAAEA,EAAO,IAAGC,KAAEA,EAAO,SAAQC,UAAEA,EAAY,CAAE,EAAAC,KAAEA,KAASC,GAAcN,EAE5E,OACEO,WAAAA,IAACC,MAAAA,KAAW,IAAKF,EAAWJ,KAAMA,EAAMC,KAAMA,EAAMF,IAAKA,EAAIQ,SAC3DF,WAAAG,IAACC,UAAI,CACHC,OAAO,QACPC,YAAaR,GAAS,SAAWA,OAAOS,EACxCT,YAAaA,GAAS,SAAWA,OAAOS,KACpCV,KAEM,IAGlB,CACEW,YA/BmB,aAgCnBC,MAAQhB,GAAWA,EAAMiB,OAASC,UAAYA,aAAGC,UAAAA"}
|
|
1
|
+
{"version":3,"file":"IconButton.js","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport * as Styled from './style'\nimport type { IconButtonProps } from './types'\n\nconst COMPONENT_NAME = 'IconButton'\n\n/**\n *\n * Component accepts all \\<button\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IconButtonProps](https://github.com/foxford/ui/blob/master/packages/ui/src/components/IconButton/types.ts)\n */\nconst IconButton: React.ForwardRefExoticComponent<IconButtonProps> = withMergedProps<\n IconButtonProps,\n HTMLButtonElement\n>(\n forwardRef<HTMLButtonElement, MergedProps<IconButtonProps>>((props, ref) => {\n const { size = 'm', type = 'button', iconProps = {}, icon, ...restProps } = props\n\n return (\n <Styled.Root {...restProps} size={size} type={type} ref={ref}>\n <Icon\n preset='brand'\n name={typeof icon === 'string' ? icon : undefined}\n icon={typeof icon !== 'string' ? icon : undefined}\n {...iconProps}\n />\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (props.square ? SIZES_SQUARE : SIZES),\n }\n)\n\nexport { IconButton }\n"],"names":["IconButton","withMergedProps","forwardRef","props","ref","size","type","iconProps","icon","restProps","_jsx","Styled","children","jsx","Icon","preset","name","undefined","displayName","sizes","square","SIZES_SQUARE","SIZES"],"mappings":"6PAoBMA,MAAAA,WAA+DC,gBAAAA,gBAInEC,MAAAA,YAA4D,CAACC,EAAOC,KAClE,MAAMC,KAAEA,EAAO,IAAGC,KAAEA,EAAO,SAAQC,UAAEA,EAAY,CAAE,EAAAC,KAAEA,KAASC,GAAcN,EAE5E,OACEO,WAAAA,IAACC,MAAAA,KAAW,IAAKF,EAAWJ,KAAMA,EAAMC,KAAMA,EAAMF,IAAKA,EAAIQ,SAC3DF,WAAAG,IAACC,UAAI,CACHC,OAAO,QACPC,YAAaR,GAAS,SAAWA,OAAOS,EACxCT,YAAaA,GAAS,SAAWA,OAAOS,KACpCV,KAEM,IAGlB,CACEW,YA/BmB,aAgCnBC,MAAQhB,GAAWA,EAAMiB,OAASC,UAAYA,aAAGC,UAAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.mjs","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport * as Styled from './style'\nimport type { IconButtonProps } from './types'\n\nconst COMPONENT_NAME = 'IconButton'\n\n/**\n *\n * Component accepts all \\<button\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IconButtonProps](https://github.com/foxford/ui/blob/master/src/components/IconButton/types.ts)\n */\nconst IconButton: React.ForwardRefExoticComponent<IconButtonProps> = withMergedProps<\n IconButtonProps,\n HTMLButtonElement\n>(\n forwardRef<HTMLButtonElement, MergedProps<IconButtonProps>>((props, ref) => {\n const { size = 'm', type = 'button', iconProps = {}, icon, ...restProps } = props\n\n return (\n <Styled.Root {...restProps} size={size} type={type} ref={ref}>\n <Icon\n preset='brand'\n name={typeof icon === 'string' ? icon : undefined}\n icon={typeof icon !== 'string' ? icon : undefined}\n {...iconProps}\n />\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (props.square ? SIZES_SQUARE : SIZES),\n }\n)\n\nexport { IconButton }\n"],"names":["IconButton","withMergedProps","forwardRef","props","ref","size","type","iconProps","icon","restProps","_jsx","Styled","children","Icon","preset","name","undefined","displayName","sizes","square","SIZES_SQUARE","SIZES"],"mappings":"8OAoBMA,MAAAA,WAA+DC,gBAInEC,YAA4D,CAACC,EAAOC,KAClE,MAAMC,KAAEA,EAAO,IAAGC,KAAEA,EAAO,SAAQC,UAAEA,EAAY,CAAE,EAAAC,KAAEA,KAASC,GAAcN,EAE5E,OACEO,IAACC,KAAW,IAAKF,EAAWJ,KAAMA,EAAMC,KAAMA,EAAMF,IAAKA,EAAIQ,SAC3DF,IAACG,KAAI,CACHC,OAAO,QACPC,YAAaP,GAAS,SAAWA,OAAOQ,EACxCR,YAAaA,GAAS,SAAWA,OAAOQ,KACpCT,KAEM,IAGlB,CACEU,YA/BmB,aAgCnBC,MAAQf,GAAWA,EAAMgB,OAASC,aAAeC"}
|
|
1
|
+
{"version":3,"file":"IconButton.mjs","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport * as Styled from './style'\nimport type { IconButtonProps } from './types'\n\nconst COMPONENT_NAME = 'IconButton'\n\n/**\n *\n * Component accepts all \\<button\\> attributes.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IconButtonProps](https://github.com/foxford/ui/blob/master/packages/ui/src/components/IconButton/types.ts)\n */\nconst IconButton: React.ForwardRefExoticComponent<IconButtonProps> = withMergedProps<\n IconButtonProps,\n HTMLButtonElement\n>(\n forwardRef<HTMLButtonElement, MergedProps<IconButtonProps>>((props, ref) => {\n const { size = 'm', type = 'button', iconProps = {}, icon, ...restProps } = props\n\n return (\n <Styled.Root {...restProps} size={size} type={type} ref={ref}>\n <Icon\n preset='brand'\n name={typeof icon === 'string' ? icon : undefined}\n icon={typeof icon !== 'string' ? icon : undefined}\n {...iconProps}\n />\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (props.square ? SIZES_SQUARE : SIZES),\n }\n)\n\nexport { IconButton }\n"],"names":["IconButton","withMergedProps","forwardRef","props","ref","size","type","iconProps","icon","restProps","_jsx","Styled","children","Icon","preset","name","undefined","displayName","sizes","square","SIZES_SQUARE","SIZES"],"mappings":"8OAoBMA,MAAAA,WAA+DC,gBAInEC,YAA4D,CAACC,EAAOC,KAClE,MAAMC,KAAEA,EAAO,IAAGC,KAAEA,EAAO,SAAQC,UAAEA,EAAY,CAAE,EAAAC,KAAEA,KAASC,GAAcN,EAE5E,OACEO,IAACC,KAAW,IAAKF,EAAWJ,KAAMA,EAAMC,KAAMA,EAAMF,IAAKA,EAAIQ,SAC3DF,IAACG,KAAI,CACHC,OAAO,QACPC,YAAaP,GAAS,SAAWA,OAAOQ,EACxCR,YAAaA,GAAS,SAAWA,OAAOQ,KACpCT,KAEM,IAGlB,CACEU,YA/BmB,aAgCnBC,MAAQf,GAAWA,EAAMgB,OAASC,aAAeC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Indicator.js","sources":["../../../../src/components/Indicator/Indicator.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport * as Styled from './style'\nimport type { IndicatorProps } from './types'\n\nconst COMPONENT_NAME = 'Indicator'\n\nconst indicatorPropsWithContent = (props: IndicatorProps): boolean =>\n (props.children !== undefined && props.children !== null) || (props.text !== undefined && props.text !== null)\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IndicatorProps](https://github.com/foxford/ui/blob/master/src/components/Indicator/types.ts)\n */\nconst Indicator: React.ForwardRefExoticComponent<IndicatorProps> = withMergedProps<IndicatorProps, HTMLSpanElement>(\n forwardRef<HTMLSpanElement, MergedProps<IndicatorProps>>((props, ref) => {\n const { size = 'm', textProps = {}, children, text, ...restProps } = props\n\n const hasContent = indicatorPropsWithContent(props)\n\n return (\n <Styled.Root {...restProps} size={size} square={hasContent} ref={ref}>\n <Styled.Foreground>\n {hasContent ? (\n <Text\n as='span'\n appearance='body'\n size='inherit'\n color='inherit'\n whiteSpace='nowrap'\n weight={700}\n lineHeight={1}\n marginTop={1}\n marginRight='0.3em'\n marginLeft='0.3em'\n {...textProps}\n >\n {children ?? text}\n </Text>\n ) : null}\n </Styled.Foreground>\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (indicatorPropsWithContent(props) ? SIZES_SQUARE : SIZES),\n }\n)\n\nexport { Indicator }\n\nexport { SIZES, SIZES_SQUARE }\n"],"names":["indicatorPropsWithContent","props","children","undefined","text","Indicator","withMergedProps","forwardRef","ref","size","textProps","restProps","hasContent","_jsx","Styled","square","jsx","Text","as","appearance","color","whiteSpace","weight","lineHeight","marginTop","marginRight","marginLeft","displayName","sizes","SIZES_SQUARE","SIZES"],"mappings":"6PAUA,MAAMA,0BAA6BC,GAChCA,EAAMC,gBAAaC,GAAaF,EAAMC,WAAa,MAAUD,EAAMG,YAASD,GAAaF,EAAMG,OAAS,KAYrGC,MAAAA,UAA6DC,gBAAAA,gBACjEC,MAAAA,YAAyD,CAACN,EAAOO,KAC/D,MAAMC,KAAEA,EAAO,IAAGC,UAAEA,EAAY,CAAE,EAAAR,SAAEA,EAAQE,KAAEA,KAASO,GAAcV,EAErE,MAAMW,EAAaZ,0BAA0BC,GAE7C,OACEY,WAAAA,IAACC,MAAAA,KAAW,IAAKH,EAAWF,KAAMA,EAAMM,OAAQH,EAAYJ,IAAKA,EAAIN,SACnEW,WAAAG,IAACF,iBAAiB,CAAAZ,SACfU,EACCC,WAAAG,IAACC,UAAI,CACHC,GAAG,OACHC,WAAW,OACXV,KAAK,UACLW,MAAM,UACNC,WAAW,SACXC,OAAQ,IACRC,WAAY,EACZC,UAAW,EACXC,YAAY,QACZC,WAAW,WACPhB,EAASR,SAEZA,GAAYE,IAEb,QAEM,IAGlB,CACEuB,YA9CmB,YA+CnBC,MAAQ3B,GAAWD,0BAA0BC,GAAS4B,UAAYA,aAAGC,UAAAA"}
|
|
1
|
+
{"version":3,"file":"Indicator.js","sources":["../../../../src/components/Indicator/Indicator.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport * as Styled from './style'\nimport type { IndicatorProps } from './types'\n\nconst COMPONENT_NAME = 'Indicator'\n\nconst indicatorPropsWithContent = (props: IndicatorProps): boolean =>\n (props.children !== undefined && props.children !== null) || (props.text !== undefined && props.text !== null)\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IndicatorProps](https://github.com/foxford/ui/blob/master/packages/ui/src/components/Indicator/types.ts)\n */\nconst Indicator: React.ForwardRefExoticComponent<IndicatorProps> = withMergedProps<IndicatorProps, HTMLSpanElement>(\n forwardRef<HTMLSpanElement, MergedProps<IndicatorProps>>((props, ref) => {\n const { size = 'm', textProps = {}, children, text, ...restProps } = props\n\n const hasContent = indicatorPropsWithContent(props)\n\n return (\n <Styled.Root {...restProps} size={size} square={hasContent} ref={ref}>\n <Styled.Foreground>\n {hasContent ? (\n <Text\n as='span'\n appearance='body'\n size='inherit'\n color='inherit'\n whiteSpace='nowrap'\n weight={700}\n lineHeight={1}\n marginTop={1}\n marginRight='0.3em'\n marginLeft='0.3em'\n {...textProps}\n >\n {children ?? text}\n </Text>\n ) : null}\n </Styled.Foreground>\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (indicatorPropsWithContent(props) ? SIZES_SQUARE : SIZES),\n }\n)\n\nexport { Indicator }\n\nexport { SIZES, SIZES_SQUARE }\n"],"names":["indicatorPropsWithContent","props","children","undefined","text","Indicator","withMergedProps","forwardRef","ref","size","textProps","restProps","hasContent","_jsx","Styled","square","jsx","Text","as","appearance","color","whiteSpace","weight","lineHeight","marginTop","marginRight","marginLeft","displayName","sizes","SIZES_SQUARE","SIZES"],"mappings":"6PAUA,MAAMA,0BAA6BC,GAChCA,EAAMC,gBAAaC,GAAaF,EAAMC,WAAa,MAAUD,EAAMG,YAASD,GAAaF,EAAMG,OAAS,KAYrGC,MAAAA,UAA6DC,gBAAAA,gBACjEC,MAAAA,YAAyD,CAACN,EAAOO,KAC/D,MAAMC,KAAEA,EAAO,IAAGC,UAAEA,EAAY,CAAE,EAAAR,SAAEA,EAAQE,KAAEA,KAASO,GAAcV,EAErE,MAAMW,EAAaZ,0BAA0BC,GAE7C,OACEY,WAAAA,IAACC,MAAAA,KAAW,IAAKH,EAAWF,KAAMA,EAAMM,OAAQH,EAAYJ,IAAKA,EAAIN,SACnEW,WAAAG,IAACF,iBAAiB,CAAAZ,SACfU,EACCC,WAAAG,IAACC,UAAI,CACHC,GAAG,OACHC,WAAW,OACXV,KAAK,UACLW,MAAM,UACNC,WAAW,SACXC,OAAQ,IACRC,WAAY,EACZC,UAAW,EACXC,YAAY,QACZC,WAAW,WACPhB,EAASR,SAEZA,GAAYE,IAEb,QAEM,IAGlB,CACEuB,YA9CmB,YA+CnBC,MAAQ3B,GAAWD,0BAA0BC,GAAS4B,UAAYA,aAAGC,UAAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Indicator.mjs","sources":["../../../../src/components/Indicator/Indicator.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport * as Styled from './style'\nimport type { IndicatorProps } from './types'\n\nconst COMPONENT_NAME = 'Indicator'\n\nconst indicatorPropsWithContent = (props: IndicatorProps): boolean =>\n (props.children !== undefined && props.children !== null) || (props.text !== undefined && props.text !== null)\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IndicatorProps](https://github.com/foxford/ui/blob/master/src/components/Indicator/types.ts)\n */\nconst Indicator: React.ForwardRefExoticComponent<IndicatorProps> = withMergedProps<IndicatorProps, HTMLSpanElement>(\n forwardRef<HTMLSpanElement, MergedProps<IndicatorProps>>((props, ref) => {\n const { size = 'm', textProps = {}, children, text, ...restProps } = props\n\n const hasContent = indicatorPropsWithContent(props)\n\n return (\n <Styled.Root {...restProps} size={size} square={hasContent} ref={ref}>\n <Styled.Foreground>\n {hasContent ? (\n <Text\n as='span'\n appearance='body'\n size='inherit'\n color='inherit'\n whiteSpace='nowrap'\n weight={700}\n lineHeight={1}\n marginTop={1}\n marginRight='0.3em'\n marginLeft='0.3em'\n {...textProps}\n >\n {children ?? text}\n </Text>\n ) : null}\n </Styled.Foreground>\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (indicatorPropsWithContent(props) ? SIZES_SQUARE : SIZES),\n }\n)\n\nexport { Indicator }\n\nexport { SIZES, SIZES_SQUARE }\n"],"names":["indicatorPropsWithContent","props","children","undefined","text","Indicator","withMergedProps","forwardRef","ref","size","textProps","restProps","hasContent","_jsx","Styled","square","Text","as","appearance","color","whiteSpace","weight","lineHeight","marginTop","marginRight","marginLeft","displayName","sizes","SIZES_SQUARE","SIZES"],"mappings":"yPAUA,MAAMA,0BAA6BC,GAChCA,EAAMC,gBAAaC,GAAaF,EAAMC,WAAa,MAAUD,EAAMG,YAASD,GAAaF,EAAMG,OAAS,KAYrGC,MAAAA,UAA6DC,gBACjEC,YAAyD,CAACN,EAAOO,KAC/D,MAAMC,KAAEA,EAAO,IAAGC,UAAEA,EAAY,CAAE,EAAAR,SAAEA,EAAQE,KAAEA,KAASO,GAAcV,EAErE,MAAMW,EAAaZ,0BAA0BC,GAE7C,OACEY,IAACC,KAAW,IAAKH,EAAWF,KAAMA,EAAMM,OAAQH,EAAYJ,IAAKA,EAAIN,SACnEW,IAACC,WAAiB,CAAAZ,SACfU,EACCC,IAACG,KAAI,CACHC,GAAG,OACHC,WAAW,OACXT,KAAK,UACLU,MAAM,UACNC,WAAW,SACXC,OAAQ,IACRC,WAAY,EACZC,UAAW,EACXC,YAAY,QACZC,WAAW,WACPf,EAASR,SAEZA,GAAYE,IAEb,QAEM,IAGlB,CACEsB,YA9CmB,YA+CnBC,MAAQ1B,GAAWD,0BAA0BC,GAAS2B,aAAeC"}
|
|
1
|
+
{"version":3,"file":"Indicator.mjs","sources":["../../../../src/components/Indicator/Indicator.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { SIZES, SIZES_SQUARE } from './constants'\nimport * as Styled from './style'\nimport type { IndicatorProps } from './types'\n\nconst COMPONENT_NAME = 'Indicator'\n\nconst indicatorPropsWithContent = (props: IndicatorProps): boolean =>\n (props.children !== undefined && props.children !== null) || (props.text !== undefined && props.text !== null)\n\n/**\n *\n * Component accepts all \\<span\\> attributes.\n *\n * Responsive \"size\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [IndicatorProps](https://github.com/foxford/ui/blob/master/packages/ui/src/components/Indicator/types.ts)\n */\nconst Indicator: React.ForwardRefExoticComponent<IndicatorProps> = withMergedProps<IndicatorProps, HTMLSpanElement>(\n forwardRef<HTMLSpanElement, MergedProps<IndicatorProps>>((props, ref) => {\n const { size = 'm', textProps = {}, children, text, ...restProps } = props\n\n const hasContent = indicatorPropsWithContent(props)\n\n return (\n <Styled.Root {...restProps} size={size} square={hasContent} ref={ref}>\n <Styled.Foreground>\n {hasContent ? (\n <Text\n as='span'\n appearance='body'\n size='inherit'\n color='inherit'\n whiteSpace='nowrap'\n weight={700}\n lineHeight={1}\n marginTop={1}\n marginRight='0.3em'\n marginLeft='0.3em'\n {...textProps}\n >\n {children ?? text}\n </Text>\n ) : null}\n </Styled.Foreground>\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: (props) => (indicatorPropsWithContent(props) ? SIZES_SQUARE : SIZES),\n }\n)\n\nexport { Indicator }\n\nexport { SIZES, SIZES_SQUARE }\n"],"names":["indicatorPropsWithContent","props","children","undefined","text","Indicator","withMergedProps","forwardRef","ref","size","textProps","restProps","hasContent","_jsx","Styled","square","Text","as","appearance","color","whiteSpace","weight","lineHeight","marginTop","marginRight","marginLeft","displayName","sizes","SIZES_SQUARE","SIZES"],"mappings":"yPAUA,MAAMA,0BAA6BC,GAChCA,EAAMC,gBAAaC,GAAaF,EAAMC,WAAa,MAAUD,EAAMG,YAASD,GAAaF,EAAMG,OAAS,KAYrGC,MAAAA,UAA6DC,gBACjEC,YAAyD,CAACN,EAAOO,KAC/D,MAAMC,KAAEA,EAAO,IAAGC,UAAEA,EAAY,CAAE,EAAAR,SAAEA,EAAQE,KAAEA,KAASO,GAAcV,EAErE,MAAMW,EAAaZ,0BAA0BC,GAE7C,OACEY,IAACC,KAAW,IAAKH,EAAWF,KAAMA,EAAMM,OAAQH,EAAYJ,IAAKA,EAAIN,SACnEW,IAACC,WAAiB,CAAAZ,SACfU,EACCC,IAACG,KAAI,CACHC,GAAG,OACHC,WAAW,OACXT,KAAK,UACLU,MAAM,UACNC,WAAW,SACXC,OAAQ,IACRC,WAAY,EACZC,UAAW,EACXC,YAAY,QACZC,WAAW,WACPf,EAASR,SAEZA,GAAYE,IAEb,QAEM,IAGlB,CACEsB,YA9CmB,YA+CnBC,MAAQ1B,GAAWD,0BAA0BC,GAAS2B,aAAeC"}
|