@os-design/core 1.0.196 → 1.0.197

package/dist/esm/Select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["css","styled","Close","CloseCircle","Down","Loading","Up","m","useIsMinWidth","ellipsisStyles","resetButtonStyles","transitionStyles","clr","ThemeOverrider","useTheme","omitEmotionProps","useBrowserLayoutEffect","useEvent","useFontSize","useForwardedRef","useForwardedState","useResizeObserver","useSize","React","forwardRef","useCallback","useEffect","useMemo","useRef","useState","FixedSizeList","Button","InputContainer","InputSearch","useRWLoadNext","Menu","MenuItem","Tag","defaultLocale","selectContainerPaddingStyles","p","paddingVertical","theme","baseHeight","selectToggleListItemHeight","selectContainerOpenedStyles","opened","unbordered","inputFocusColorBorder","inputFocusColorShadow","selectContainerUnborderedStyles","selectContainerUnborderedHoverStyles","disabled","buttonGhostColorBgHover","SelectContainer","SelectMenu","min","xs","width","NotFound","div","menuItemHeight","inputPaddingHorizontal","selectNotFoundColorText","InputSearchContainer","menuPaddingVertical","ToggleContainer","toggleContentNotHasLeftStyles","hasLeft","toggleContentNotHasRightStyles","hasRight","ToggleContent","Placeholder","span","inputColorPlaceholder","titleUnborderedTitleStyles","colorPrimary","titleDisabledStyles","inputDisabledColorText","Title","colorText","ToggleListItem","ToggleList","selectToggleListItemGap","DeleteButton","button","selectToggleDeleteButtonColorIcon","selectToggleDeleteButtonColorIconHover","toggleIconUnborderedStyles","ToggleIconContainer","selectColorIcon","ClearIcon","Addon","ToggleLeftAddon","inputAddonPaddingHorizontal","hasPadding","ToggleRightAddon","Select","options","left","leftHasPadding","right","rightHasPadding","placeholder","searchVisible","searchProps","notFoundText","loading","autoFocus","autoOpen","clearVisible","threshold","visibleCount","overscanCount","multiple","maxSelectedItems","locale","value","defaultValue","onChange","onLoadNext","onClose","onBlur","size","placement","rest","ref","containerRef","mergedContainerRef","setWidth","inputSearchContainerRef","setOpened","forwardedValue","setForwardedValue","current","focus","onCloseRef","resizeHandler","window","requestAnimationFrame","nextWidth","getBoundingClientRect","undefined","setAttribute","listBoxId","Math","random","toString","slice","blurHandler","e","onDelete","v","filter","item","toggleContent","length","items","map","option","find","title","stopPropagation","deleteLabel","toggleShowClearButton","toggleOnClear","toggleRightValue","key","clearLabel","toggleRightHasPaddingValue","onSelect","includes","windowSize","isMinXs","fontSize","document","body","scaleFactor","s","sizes","Number","replace","paddingBottom","paddingEm","modalBodyPaddingVertical","paddingTop","searchInputHeight","itemSize","height","maxHeight","modalHeaderHeight","curHeight","count","scrollHandler","itemCount","InnerElement","style","innerElementRest","parseFloat","listItemFn","index","optionTitle","optionValue","onClick","optionOnClick","restOption","top","preventDefault","t","buttonPaddingHorizontal","small","scrollOffset","displayName"],"sources":["../../../src/Select/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Close, CloseCircle, Down, Loading, Up } from '@os-design/icons';\nimport { m, useIsMinWidth } from '@os-design/media';\nimport {\n  ellipsisStyles,\n  resetButtonStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr, ThemeOverrider, useTheme } from '@os-design/theming';\nimport {\n  omitEmotionProps,\n  useBrowserLayoutEffect,\n  useEvent,\n  useFontSize,\n  useForwardedRef,\n  useForwardedState,\n  useResizeObserver,\n  useSize,\n} from '@os-design/utils';\nimport React, {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { FixedSizeList } from 'react-window';\nimport Button from '../Button';\nimport { InputContainer } from '../Input';\nimport InputSearch, { InputSearchProps } from '../InputSearch';\nimport useRWLoadNext from '../List/utils/useRWLoadNext';\nimport Menu from '../Menu';\nimport MenuItem, { MenuItemProps } from '../MenuItem';\nimport { PopoverProps } from '../Popover';\nimport Tag from '../Tag';\nimport defaultLocale, { SelectLocale } from './utils/defaultLocale';\n\nexport interface Option extends MenuItemProps {\n  title?: string;\n}\n\ntype JsxDivProps = Omit<\n  JSX.IntrinsicElements['div'],\n  'value' | 'defaultValue' | 'onChange' | 'ref'\n>;\ninterface BaseSelectProps<T>\n  extends JsxDivProps,\n    WithSize,\n    Pick<PopoverProps, 'placement'> {\n  /**\n   * Options of the select.\n   * @default undefined\n   */\n  options?: Option[];\n  /**\n   * The component located on the left side.\n   * @default undefined\n   */\n  left?: React.ReactNode;\n  /**\n   * Adds padding to the left component.\n   * It can be useful when passing an icon or text in the left component.\n   * @default false\n   */\n  leftHasPadding?: boolean;\n  /**\n   * The component located on the right side.\n   * @default undefined\n   */\n  right?: React.ReactNode;\n  /**\n   * Adds padding to the right component.\n   * It can be useful when passing an icon or text in the right component.\n   * @default false\n   */\n  rightHasPadding?: boolean;\n  /**\n   * The placeholder of the select.\n   * @default undefined\n   */\n  placeholder?: string;\n  /**\n   * Whether the search input visible.\n   * @default false\n   */\n  searchVisible?: boolean;\n  /**\n   * Props of the search input.\n   * @default undefined\n   */\n  searchProps?: InputSearchProps;\n  /**\n   * Text displayed when there are no list items.\n   * @default Not found\n   */\n  notFoundText?: string;\n  /**\n   * Whether the border is hidden.\n   * @default false\n   */\n  unbordered?: boolean;\n  /**\n   * Shows the loading status.\n   * @default false\n   */\n  loading?: boolean;\n  /**\n   * Whether the select is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Whether the component have a focus.\n   * @default false\n   */\n  autoFocus?: boolean;\n  /**\n   * Whether the component opens the popup list.\n   * @default false\n   */\n  autoOpen?: boolean;\n  /**\n   * Whether the select has the clear button.\n   * @default false\n   */\n  clearVisible?: boolean;\n  /**\n   * A threshold N means that the onLoadNext function calls when a user scrolls all items except N.\n   * @default 10\n   */\n  threshold?: number;\n  /**\n   * Defines how many items inside of the visible \"window\" to render.\n   * @default 6\n   */\n  visibleCount?: number;\n  /**\n   * Defines how many items outside of the visible \"window\" to render at all times.\n   * @default 10\n   */\n  overscanCount?: number;\n  /**\n   * The max number of options that the user can select. Zero means unlimited.\n   * Works only when multiple is true.\n   * @default 0\n   */\n  maxSelectedItems?: number;\n  /**\n   * The locale.\n   * @default undefined\n   */\n  locale?: SelectLocale;\n  /**\n   * Selected options.\n   * @default undefined\n   */\n  value?: T;\n  /**\n   * The default value.\n   * @default undefined\n   */\n  defaultValue?: T;\n  /**\n   * The change event handler.\n   * @default undefined\n   */\n  onChange?: (value: T) => void;\n  /**\n   * The callback to load more items.\n   * @default undefined\n   */\n  onLoadNext?: () => void;\n  /**\n   * The event handler that is called whenever a popup closes.\n   * @default undefined\n   */\n  onClose?: () => void;\n}\nexport interface SelectNotMultipleProps extends BaseSelectProps<string | null> {\n  /**\n   * Is it possible to select multiple values.\n   * @default false\n   */\n  multiple?: false;\n}\nexport interface SelectMultipleProps extends BaseSelectProps<string[]> {\n  /**\n   * Is it possible to select multiple values.\n   * @default false\n   */\n  multiple: true;\n}\nexport type SelectProps = SelectNotMultipleProps | SelectMultipleProps;\n\nconst selectContainerPaddingStyles = (p) => {\n  const paddingVertical =\n    (p.theme.baseHeight - p.theme.selectToggleListItemHeight) / 2;\n\n  return css`\n    padding: calc(${paddingVertical}em - 1px) 0;\n  `;\n};\n\nconst selectContainerOpenedStyles = (p) =>\n  p.opened &&\n  !p.unbordered &&\n  css`\n    border-color: ${clr(p.theme.inputFocusColorBorder)};\n    box-shadow: 0 0 0 0.15em ${clr(p.theme.inputFocusColorShadow)};\n  `;\n\nconst selectContainerUnborderedStyles = (p) =>\n  p.unbordered &&\n  css`\n    border: 0;\n    box-shadow: none !important;\n    ${transitionStyles('background-color')(p)};\n  `;\n\nconst selectContainerUnborderedHoverStyles = (p) =>\n  p.unbordered &&\n  !p.disabled &&\n  css`\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        background-color: ${clr(p.theme.buttonGhostColorBgHover)};\n      }\n    }\n  `;\n\ninterface SelectContainerProps {\n  opened: boolean;\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const SelectContainer = styled(\n  InputContainer,\n  omitEmotionProps('opened', 'unbordered', 'disabled')\n)<SelectContainerProps>`\n  cursor: ${(p) => (!p.disabled ? 'pointer' : 'not-allowed')};\n  user-select: none;\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  height: unset;\n  min-height: ${(p) => p.theme.baseHeight}em;\n\n  ${selectContainerPaddingStyles};\n  ${selectContainerOpenedStyles};\n  ${selectContainerUnborderedStyles};\n  ${selectContainerUnborderedHoverStyles};\n`;\n\ninterface SelectMenuProps {\n  width: number;\n}\nconst SelectMenu = styled(Menu, omitEmotionProps('width'))<SelectMenuProps>`\n  padding-top: 0;\n  padding-bottom: 0;\n  max-height: unset;\n\n  ${m.min.xs} {\n    width: ${(p) => p.width}px;\n  }\n`;\n\nconst NotFound = styled.div`\n  height: ${(p) => p.theme.menuItemHeight}em;\n  display: flex;\n  align-items: center;\n\n  padding: 0 ${(p) => p.theme.inputPaddingHorizontal}em;\n  color: ${(p) => clr(p.theme.selectNotFoundColorText)};\n`;\n\nconst InputSearchContainer = styled.div`\n  padding: ${(p) => p.theme.menuPaddingVertical}em\n    ${(p) => p.theme.inputPaddingHorizontal}em 0;\n`;\n\nexport const ToggleContainer = styled.div`\n  flex: 1;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n`;\n\nconst toggleContentNotHasLeftStyles = (p) =>\n  !p.hasLeft &&\n  css`\n    padding-left: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\nconst toggleContentNotHasRightStyles = (p) =>\n  !p.hasRight &&\n  !p.unbordered &&\n  css`\n    padding-right: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\ninterface ToggleContentProps {\n  hasLeft?: boolean;\n  hasRight?: boolean;\n  unbordered?: boolean;\n}\nexport const ToggleContent = styled(\n  'div',\n  omitEmotionProps('hasLeft', 'hasRight', 'unbordered')\n)<ToggleContentProps>`\n  flex: 1;\n  ${toggleContentNotHasLeftStyles};\n  ${toggleContentNotHasRightStyles};\n  ${ellipsisStyles};\n`;\n\nexport const Placeholder = styled.span`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  ${ellipsisStyles};\n`;\n\nconst titleUnborderedTitleStyles = (p) =>\n  p.unbordered &&\n  css`\n    font-weight: 500;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\nconst titleDisabledStyles = (p) =>\n  p.disabled &&\n  css`\n    color: ${clr(p.theme.inputDisabledColorText)};\n  `;\n\ntype TitleProps = Pick<SelectProps, 'disabled' | 'unbordered'>;\nexport const Title = styled(\n  'span',\n  omitEmotionProps('disabled', 'unbordered')\n)<TitleProps>`\n  color: ${(p) => clr(p.theme.colorText)};\n  ${titleUnborderedTitleStyles};\n  ${titleDisabledStyles};\n  ${ellipsisStyles};\n`;\n\ntype ToggleListItemProps = Pick<SelectProps, 'disabled'>;\nconst ToggleListItem = styled(\n  Tag,\n  omitEmotionProps('disabled')\n)<ToggleListItemProps>`\n  // Reset tag styles\n  padding-top: 0;\n  padding-bottom: 0;\n\n  height: ${(p) => p.theme.selectToggleListItemHeight}em;\n  ${titleDisabledStyles};\n`;\n\nconst ToggleList = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  overflow: hidden; // For ellipsis styles\n\n  margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n    ${(p) => -p.theme.selectToggleListItemGap}em 0;\n\n  & > div {\n    margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n      ${(p) => p.theme.selectToggleListItemGap}em 0;\n  }\n`;\n\nconst DeleteButton = styled.button`\n  ${resetButtonStyles};\n  cursor: pointer;\n  display: inherit;\n  font-size: 1em;\n  margin-left: 0.2em;\n\n  background-color: transparent;\n  color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIcon)};\n\n  @media (hover: hover) {\n    &:hover,\n    &:focus {\n      color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIconHover)};\n    }\n  }\n\n  ${transitionStyles('color')};\n`;\n\nconst toggleIconUnborderedStyles = (p) =>\n  p.unbordered &&\n  css`\n    padding-top: 0.2em;\n    font-size: 0.8em;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\ninterface ToggleIconContainerProps {\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const ToggleIconContainer = styled(\n  'span',\n  omitEmotionProps('unbordered', 'disabled')\n)<ToggleIconContainerProps>`\n  color: ${(p) => clr(p.theme.selectColorIcon)};\n  line-height: 1;\n  ${toggleIconUnborderedStyles};\n`;\n\nexport const ClearIcon = styled(CloseCircle)`\n  transform: scale(1.2) !important;\n`;\n\ninterface AddonProps {\n  hasPadding: boolean;\n}\nconst Addon = styled('span', omitEmotionProps('hasPadding'))<AddonProps>`\n  display: flex;\n  align-items: center;\n  user-select: none;\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n\n  svg {\n    transform: scale(1.2);\n  }\n`;\n\nexport const ToggleLeftAddon = styled(Addon)`\n  padding-right: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-left: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nexport const ToggleRightAddon = styled(Addon)`\n  padding-left: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-right: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\n/**\n * The component that allows to pick a value from predefined options.\n */\nconst Select = forwardRef<HTMLDivElement, SelectProps>(\n  (\n    {\n      options = [],\n      left,\n      leftHasPadding = false,\n      right,\n      rightHasPadding = false,\n      placeholder,\n      searchVisible = false,\n      searchProps = {},\n      notFoundText = 'Not found',\n      unbordered = false,\n      loading = false,\n      disabled = false,\n      autoFocus = false,\n      autoOpen = false,\n      clearVisible = false,\n      threshold = 10,\n      visibleCount = 6,\n      overscanCount = 10,\n      multiple = false,\n      maxSelectedItems = 0,\n      locale = defaultLocale,\n      value,\n      defaultValue,\n      onChange,\n      onLoadNext = () => {},\n      onClose = () => {},\n      onBlur = () => {},\n      size,\n      placement,\n      ...rest\n    },\n    ref\n  ) => {\n    const [containerRef, mergedContainerRef] = useForwardedRef(ref);\n    const [width, setWidth] = useState(0);\n    const inputSearchContainerRef = useRef<HTMLDivElement>(null);\n    const [opened, setOpened] = useState(autoOpen);\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const [forwardedValue, setForwardedValue] = useForwardedState<any>({\n      value,\n      defaultValue,\n      onChange,\n    });\n\n    useEffect(() => {\n      if (autoFocus) containerRef.current?.focus();\n    }, [autoFocus, containerRef]);\n\n    const onCloseRef = useRef(onClose);\n    useEffect(() => {\n      onCloseRef.current = onClose;\n    }, [onClose]);\n\n    useEffect(() => {\n      if (!opened) onCloseRef.current();\n    }, [opened]);\n\n    /**\n     * Detect the width of the container when the select was opened and update\n     * it when either the container size or the window size has been changed.\n     */\n    const resizeHandler = useCallback(() => {\n      window.requestAnimationFrame(() => {\n        if (!opened || !containerRef.current) return;\n        const nextWidth = containerRef.current.getBoundingClientRect().width;\n        if (width === nextWidth) return;\n        setWidth(nextWidth);\n      });\n    }, [opened, containerRef, width]);\n    useBrowserLayoutEffect(() => resizeHandler(), [resizeHandler]);\n    useResizeObserver(containerRef, resizeHandler);\n    useEvent(\n      (typeof window !== 'undefined' ? window : undefined) as EventTarget,\n      'resize',\n      resizeHandler\n    );\n\n    // Replace the aria-haspopup attribute from menu to listbox\n    useBrowserLayoutEffect(() => {\n      if (!containerRef.current) return;\n      containerRef.current.setAttribute('aria-haspopup', 'listbox');\n    }, []);\n\n    const listBoxId = useMemo(\n      () => `listbox-${Math.random().toString(36).slice(2, 11)}`,\n      []\n    );\n\n    const blurHandler = useCallback(\n      (e) => {\n        if (!opened) onBlur(e);\n      },\n      [onBlur, opened]\n    );\n\n    const onDelete = useCallback(\n      (v: string) => {\n        if (!multiple) return;\n        setForwardedValue((forwardedValue || []).filter((item) => item !== v));\n      },\n      [forwardedValue, multiple, setForwardedValue]\n    );\n\n    const toggleContent = useMemo(() => {\n      if (multiple) {\n        if (!forwardedValue || forwardedValue.length === 0) {\n          return <Placeholder>{placeholder}</Placeholder>;\n        }\n        const items = forwardedValue.map((v) => {\n          const option = (options || []).find((item) => item.value === v);\n          return { title: option ? option.title || '' : '', value: v };\n        });\n        return (\n          <ToggleList>\n            {items.map(({ title, value: v }) => (\n              <ToggleListItem\n                key={v}\n                disabled={disabled}\n                right={\n                  !disabled ? (\n                    <DeleteButton\n                      onClick={(e) => {\n                        onDelete(v);\n                        e.stopPropagation();\n                      }}\n                      onKeyDown={(e) => e.stopPropagation()}\n                      aria-label={`${locale.deleteLabel} ${title}`}\n                      aria-hidden\n                    >\n                      <Close />\n                    </DeleteButton>\n                  ) : undefined\n                }\n                aria-hidden\n              >\n                {title}\n              </ToggleListItem>\n            ))}\n          </ToggleList>\n        );\n      }\n      if (!forwardedValue) {\n        return <Placeholder>{placeholder}</Placeholder>;\n      }\n      const option = (options || []).find(\n        (item) => item.value === forwardedValue\n      );\n      return (\n        <Title disabled={disabled} unbordered={unbordered}>\n          {option ? option.title : ''}\n        </Title>\n      );\n    }, [\n      disabled,\n      forwardedValue,\n      locale.deleteLabel,\n      multiple,\n      onDelete,\n      options,\n      placeholder,\n      unbordered,\n    ]);\n\n    const toggleShowClearButton = useMemo(() => {\n      if (!clearVisible) return false;\n      if (multiple) return forwardedValue && forwardedValue.length > 0;\n      return !!forwardedValue;\n    }, [clearVisible, forwardedValue, multiple]);\n\n    const toggleOnClear = useCallback(() => {\n      setForwardedValue(multiple ? [] : null);\n      if (!containerRef.current) return;\n      containerRef.current.focus();\n    }, [containerRef, multiple, setForwardedValue]);\n\n    const toggleRightValue = useMemo(() => {\n      if (loading) return <Loading />;\n      if (toggleShowClearButton) {\n        return (\n          <Button\n            type='ghost'\n            wide='never'\n            size='small'\n            disabled={disabled}\n            onClick={(e) => {\n              toggleOnClear();\n              e.stopPropagation();\n            }}\n            onKeyDown={(e) => {\n              if (e.key === 'Enter') toggleOnClear();\n              e.stopPropagation();\n            }}\n            aria-label={locale.clearLabel}\n          >\n            <ClearIcon />\n          </Button>\n        );\n      }\n      return (\n        right || (\n          <ToggleIconContainer unbordered={unbordered} disabled={disabled}>\n            {opened ? <Up /> : <Down />}\n          </ToggleIconContainer>\n        )\n      );\n    }, [\n      disabled,\n      loading,\n      locale.clearLabel,\n      opened,\n      right,\n      toggleOnClear,\n      toggleShowClearButton,\n      unbordered,\n    ]);\n\n    const toggleRightHasPaddingValue = useMemo(() => {\n      if (loading) return true;\n      if (toggleShowClearButton) return false;\n      return right ? rightHasPadding : true;\n    }, [loading, right, rightHasPadding, toggleShowClearButton]);\n\n    const onSelect = useCallback(\n      (v: string) => {\n        if (multiple) {\n          // Delete the value because it was already selected\n          if ((forwardedValue || []).includes(v)) {\n            setForwardedValue(\n              (forwardedValue || []).filter((item) => item !== v)\n            );\n            return;\n          }\n\n          // Add a new value if the number of selected items is less than max\n          if (\n            maxSelectedItems === 0 ||\n            (forwardedValue || []).length < maxSelectedItems\n          ) {\n            setForwardedValue([...(forwardedValue || []), v]);\n            return;\n          }\n          return;\n        }\n        setForwardedValue(v);\n      },\n      [forwardedValue, maxSelectedItems, multiple, setForwardedValue]\n    );\n\n    const windowSize = useSize();\n    const isMinXs = useIsMinWidth('xs');\n    const fontSize = useFontSize(document.body);\n    const { theme } = useTheme();\n\n    const scaleFactor = useMemo(() => {\n      const s = size || 'medium';\n      return ['small', 'medium', 'large'].includes(s)\n        ? theme.sizes[s]\n        : Number(s.replace(/^([0-9]+(\\.[0-9]+)?).*/, '$1')) || 1; // Extract the number\n    }, [size, theme.sizes]);\n\n    const paddingBottom = useMemo(() => {\n      const paddingEm = isMinXs\n        ? theme.menuPaddingVertical\n        : theme.modalBodyPaddingVertical[0];\n      return paddingEm * fontSize * scaleFactor;\n    }, [\n      isMinXs,\n      theme.menuPaddingVertical,\n      theme.modalBodyPaddingVertical,\n      fontSize,\n      scaleFactor,\n    ]);\n\n    const paddingTop = useMemo(\n      () => (searchVisible ? 5 * scaleFactor : paddingBottom),\n      [searchVisible, scaleFactor, paddingBottom]\n    );\n\n    const searchInputHeight = useMemo(\n      () =>\n        searchVisible\n          ? (theme.baseHeight + theme.menuPaddingVertical) *\n            fontSize *\n            scaleFactor\n          : 0,\n      [\n        searchVisible,\n        theme.baseHeight,\n        theme.menuPaddingVertical,\n        fontSize,\n        scaleFactor,\n      ]\n    );\n\n    const itemSize = useMemo(\n      () => theme.menuItemHeight * fontSize * scaleFactor,\n      [theme.menuItemHeight, fontSize, scaleFactor]\n    );\n\n    const height = useMemo(() => {\n      // Modal\n      if (!isMinXs) {\n        const maxHeight =\n          windowSize.height -\n          theme.modalHeaderHeight * fontSize * scaleFactor -\n          searchInputHeight;\n        const curHeight =\n          options.length * itemSize + paddingTop + paddingBottom;\n        return curHeight < maxHeight ? curHeight : maxHeight;\n      }\n      // Popover\n      const count =\n        options.length < visibleCount ? options.length : visibleCount;\n      return count * itemSize + paddingTop + paddingBottom;\n    }, [\n      isMinXs,\n      options.length,\n      visibleCount,\n      itemSize,\n      windowSize.height,\n      theme.modalHeaderHeight,\n      fontSize,\n      scaleFactor,\n      searchInputHeight,\n      paddingTop,\n      paddingBottom,\n    ]);\n\n    const scrollHandler = useRWLoadNext({\n      itemCount: options.length,\n      threshold,\n      itemSize,\n      paddingTop,\n      height,\n      onLoadNext,\n    });\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const InnerElement = useCallback(\n      ({ style, ...innerElementRest }) => (\n        <div\n          style={{\n            ...style,\n            height: `${\n              parseFloat(style.height) + paddingTop + paddingBottom\n            }px`,\n          }}\n          role='listbox'\n          id={listBoxId}\n          {...innerElementRest}\n        />\n      ),\n      [listBoxId, paddingBottom, paddingTop]\n    );\n\n    const listItemFn = useCallback(\n      ({ index, style }) => {\n        const {\n          title: optionTitle,\n          value: optionValue,\n          onClick: optionOnClick,\n          ...restOption\n        } = options[index];\n        return (\n          <MenuItem\n            style={{\n              ...style,\n              top: `${\n                parseFloat(style.top ? style.top.toString() : '0') + paddingTop\n              }px`,\n            }}\n            selected={\n              (multiple &&\n                (forwardedValue || []).includes(optionValue || '')) ||\n              (!multiple && forwardedValue === optionValue)\n            }\n            onClick={(e) => {\n              if (!optionValue) return;\n              onSelect(optionValue);\n\n              // Focus the input.\n              // Otherwise, if multiple is false and the user presses enter to select an item,\n              // the input will lose focus.\n              if (containerRef.current && !multiple) {\n                containerRef.current.focus();\n              }\n\n              if (optionOnClick) optionOnClick(e);\n            }}\n            role='option'\n            aria-selected={\n              (multiple &&\n                (forwardedValue || []).includes(optionValue || '')) ||\n              (!multiple && forwardedValue === optionValue)\n            }\n            {...restOption}\n          >\n            {optionTitle}\n          </MenuItem>\n        );\n      },\n      [containerRef, forwardedValue, multiple, onSelect, options, paddingTop]\n    );\n\n    return (\n      <>\n        <SelectContainer\n          opened={opened}\n          unbordered={unbordered}\n          disabled={disabled}\n          size={size}\n          tabIndex={!disabled ? 0 : -1}\n          onClick={() => {\n            if (disabled) return;\n            setOpened(!opened);\n          }}\n          onKeyDown={(e) => {\n            if (disabled) return;\n            if (['Enter', ' '].includes(e.key)) {\n              setOpened(!opened);\n              e.preventDefault();\n            }\n          }}\n          onMouseDown={(e) => e.preventDefault()}\n          onBlur={blurHandler}\n          role='combobox'\n          aria-disabled={disabled}\n          aria-busy={loading}\n          aria-haspopup='listbox'\n          aria-owns={listBoxId}\n          {...rest}\n          ref={mergedContainerRef}\n        >\n          <ToggleContainer>\n            {left && (\n              <ThemeOverrider\n                overrides={(t) => ({\n                  buttonPaddingHorizontal: 0.8,\n                  baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n                })}\n              >\n                <ToggleLeftAddon hasPadding={leftHasPadding}>\n                  {left}\n                </ToggleLeftAddon>\n              </ThemeOverrider>\n            )}\n\n            <ToggleContent\n              hasLeft={!!left}\n              hasRight={!!right}\n              unbordered={unbordered}\n            >\n              {toggleContent}\n            </ToggleContent>\n\n            {toggleRightValue && (\n              <ThemeOverrider\n                overrides={(t) => ({\n                  buttonPaddingHorizontal: 0.8,\n                  baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n                })}\n              >\n                <ToggleRightAddon hasPadding={toggleRightHasPaddingValue}>\n                  {toggleRightValue}\n                </ToggleRightAddon>\n              </ThemeOverrider>\n            )}\n          </ToggleContainer>\n        </SelectContainer>\n\n        <SelectMenu\n          trigger={containerRef}\n          visible={opened}\n          onClose={() => setOpened(false)}\n          size={size}\n          width={width}\n          closeOnSelect={!multiple}\n          modalTitle={placeholder}\n          placement={placement}\n        >\n          {searchVisible && (\n            <InputSearchContainer ref={inputSearchContainerRef}>\n              <InputSearch {...searchProps} />\n            </InputSearchContainer>\n          )}\n\n          {options.length > 0 ? (\n            <FixedSizeList\n              width='100%'\n              height={height}\n              itemSize={itemSize}\n              itemCount={options.length}\n              overscanCount={overscanCount}\n              onScroll={({ scrollOffset }) => scrollHandler(scrollOffset)}\n              innerElementType={InnerElement}\n            >\n              {listItemFn}\n            </FixedSizeList>\n          ) : (\n            <NotFound>{notFoundText}</NotFound>\n          )}\n        </SelectMenu>\n      </>\n    );\n  }\n);\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["css","styled","Close","CloseCircle","Down","Loading","Up","m","useIsMinWidth","ellipsisStyles","resetButtonStyles","transitionStyles","ThemeOverrider","clr","useTheme","omitEmotionProps","useBrowserLayoutEffect","useEvent","useFontSize","useForwardedRef","useForwardedState","useResizeObserver","useSize","React","forwardRef","useCallback","useEffect","useMemo","useRef","useState","FixedSizeList","Button","InputContainer","InputSearch","useRWLoadNext","Menu","MenuItem","Tag","defaultLocale","selectContainerPaddingStyles","p","paddingVertical","theme","baseHeight","selectToggleListItemHeight","selectContainerOpenedStyles","opened","unbordered","inputFocusColorBorder","inputFocusColorShadow","selectContainerUnborderedStyles","selectContainerUnborderedHoverStyles","disabled","buttonGhostColorBgHover","SelectContainer","SelectMenu","min","xs","width","NotFound","div","menuItemHeight","inputPaddingHorizontal","selectNotFoundColorText","InputSearchContainer","menuPaddingVertical","ToggleContainer","toggleContentNotHasLeftStyles","hasLeft","toggleContentNotHasRightStyles","hasRight","ToggleContent","Placeholder","span","inputColorPlaceholder","titleUnborderedTitleStyles","colorPrimary","titleDisabledStyles","inputDisabledColorText","Title","colorText","ToggleListItem","ToggleList","selectToggleListItemGap","DeleteButton","button","selectToggleDeleteButtonColorIcon","selectToggleDeleteButtonColorIconHover","toggleIconUnborderedStyles","ToggleIconContainer","selectColorIcon","ClearIcon","Addon","ToggleLeftAddon","inputAddonPaddingHorizontal","hasPadding","ToggleRightAddon","Select","options","left","leftHasPadding","right","rightHasPadding","placeholder","searchVisible","searchProps","notFoundText","loading","autoFocus","autoOpen","clearVisible","threshold","visibleCount","overscanCount","multiple","maxSelectedItems","locale","value","defaultValue","onChange","onLoadNext","onClose","onBlur","size","placement","rest","ref","containerRef","mergedContainerRef","setWidth","inputSearchContainerRef","setOpened","forwardedValue","setForwardedValue","current","focus","onCloseRef","resizeHandler","window","requestAnimationFrame","nextWidth","getBoundingClientRect","undefined","setAttribute","listBoxId","Math","random","toString","slice","blurHandler","e","onDelete","v","filter","item","toggleContent","length","createElement","items","map","option","find","title","key","onClick","stopPropagation","onKeyDown","deleteLabel","toggleShowClearButton","toggleOnClear","toggleRightValue","type","wide","clearLabel","toggleRightHasPaddingValue","onSelect","includes","windowSize","isMinXs","fontSize","document","body","scaleFactor","s","sizes","Number","replace","paddingBottom","paddingEm","modalBodyPaddingVertical","paddingTop","searchInputHeight","itemSize","height","maxHeight","modalHeaderHeight","curHeight","count","scrollHandler","itemCount","InnerElement","style","innerElementRest","_extends","parseFloat","role","id","listItemFn","index","optionTitle","optionValue","optionOnClick","restOption","top","selected","Fragment","tabIndex","preventDefault","onMouseDown","overrides","t","buttonPaddingHorizontal","small","trigger","visible","closeOnSelect","modalTitle","onScroll","scrollOffset","innerElementType","displayName"],"sources":["../../../src/Select/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Close, CloseCircle, Down, Loading, Up } from '@os-design/icons';\nimport { m, useIsMinWidth } from '@os-design/media';\nimport {\n  WithSize,\n  ellipsisStyles,\n  resetButtonStyles,\n  transitionStyles,\n} from '@os-design/styles';\nimport { ThemeOverrider, clr, useTheme } from '@os-design/theming';\n\nimport {\n  omitEmotionProps,\n  useBrowserLayoutEffect,\n  useEvent,\n  useFontSize,\n  useForwardedRef,\n  useForwardedState,\n  useResizeObserver,\n  useSize,\n} from '@os-design/utils';\nimport React, {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { FixedSizeList } from 'react-window';\nimport Button from '../Button';\nimport { InputContainer } from '../Input';\nimport InputSearch, { InputSearchProps } from '../InputSearch';\nimport useRWLoadNext from '../List/utils/useRWLoadNext';\nimport Menu from '../Menu';\nimport MenuItem, { MenuItemProps } from '../MenuItem';\nimport { PopoverProps } from '../Popover';\nimport Tag from '../Tag';\nimport defaultLocale, { SelectLocale } from './utils/defaultLocale';\n\nexport interface Option extends MenuItemProps {\n  title?: string;\n}\n\ntype JsxDivProps = Omit<\n  JSX.IntrinsicElements['div'],\n  'value' | 'defaultValue' | 'onChange' | 'ref'\n>;\ninterface BaseSelectProps<T>\n  extends JsxDivProps,\n    WithSize,\n    Pick<PopoverProps, 'placement'> {\n  /**\n   * Options of the select.\n   * @default undefined\n   */\n  options?: Option[];\n  /**\n   * The component located on the left side.\n   * @default undefined\n   */\n  left?: React.ReactNode;\n  /**\n   * Adds padding to the left component.\n   * It can be useful when passing an icon or text in the left component.\n   * @default false\n   */\n  leftHasPadding?: boolean;\n  /**\n   * The component located on the right side.\n   * @default undefined\n   */\n  right?: React.ReactNode;\n  /**\n   * Adds padding to the right component.\n   * It can be useful when passing an icon or text in the right component.\n   * @default false\n   */\n  rightHasPadding?: boolean;\n  /**\n   * The placeholder of the select.\n   * @default undefined\n   */\n  placeholder?: string;\n  /**\n   * Whether the search input visible.\n   * @default false\n   */\n  searchVisible?: boolean;\n  /**\n   * Props of the search input.\n   * @default undefined\n   */\n  searchProps?: InputSearchProps;\n  /**\n   * Text displayed when there are no list items.\n   * @default Not found\n   */\n  notFoundText?: string;\n  /**\n   * Whether the border is hidden.\n   * @default false\n   */\n  unbordered?: boolean;\n  /**\n   * Shows the loading status.\n   * @default false\n   */\n  loading?: boolean;\n  /**\n   * Whether the select is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Whether the component have a focus.\n   * @default false\n   */\n  autoFocus?: boolean;\n  /**\n   * Whether the component opens the popup list.\n   * @default false\n   */\n  autoOpen?: boolean;\n  /**\n   * Whether the select has the clear button.\n   * @default false\n   */\n  clearVisible?: boolean;\n  /**\n   * A threshold N means that the onLoadNext function calls when a user scrolls all items except N.\n   * @default 10\n   */\n  threshold?: number;\n  /**\n   * Defines how many items inside of the visible \"window\" to render.\n   * @default 6\n   */\n  visibleCount?: number;\n  /**\n   * Defines how many items outside of the visible \"window\" to render at all times.\n   * @default 10\n   */\n  overscanCount?: number;\n  /**\n   * The max number of options that the user can select. Zero means unlimited.\n   * Works only when multiple is true.\n   * @default 0\n   */\n  maxSelectedItems?: number;\n  /**\n   * The locale.\n   * @default undefined\n   */\n  locale?: SelectLocale;\n  /**\n   * Selected options.\n   * @default undefined\n   */\n  value?: T;\n  /**\n   * The default value.\n   * @default undefined\n   */\n  defaultValue?: T;\n  /**\n   * The change event handler.\n   * @default undefined\n   */\n  onChange?: (value: T) => void;\n  /**\n   * The callback to load more items.\n   * @default undefined\n   */\n  onLoadNext?: () => void;\n  /**\n   * The event handler that is called whenever a popup closes.\n   * @default undefined\n   */\n  onClose?: () => void;\n}\nexport interface SelectNotMultipleProps extends BaseSelectProps<string | null> {\n  /**\n   * Is it possible to select multiple values.\n   * @default false\n   */\n  multiple?: false;\n}\nexport interface SelectMultipleProps extends BaseSelectProps<string[]> {\n  /**\n   * Is it possible to select multiple values.\n   * @default false\n   */\n  multiple: true;\n}\nexport type SelectProps = SelectNotMultipleProps | SelectMultipleProps;\n\nconst selectContainerPaddingStyles = (p) => {\n  const paddingVertical =\n    (p.theme.baseHeight - p.theme.selectToggleListItemHeight) / 2;\n\n  return css`\n    padding: calc(${paddingVertical}em - 1px) 0;\n  `;\n};\n\nconst selectContainerOpenedStyles = (p) =>\n  p.opened &&\n  !p.unbordered &&\n  css`\n    border-color: ${clr(p.theme.inputFocusColorBorder)};\n    box-shadow: 0 0 0 0.15em ${clr(p.theme.inputFocusColorShadow)};\n  `;\n\nconst selectContainerUnborderedStyles = (p) =>\n  p.unbordered &&\n  css`\n    border: 0;\n    box-shadow: none !important;\n    ${transitionStyles('background-color')(p)};\n  `;\n\nconst selectContainerUnborderedHoverStyles = (p) =>\n  p.unbordered &&\n  !p.disabled &&\n  css`\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        background-color: ${clr(p.theme.buttonGhostColorBgHover)};\n      }\n    }\n  `;\n\ninterface SelectContainerProps {\n  opened: boolean;\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const SelectContainer = styled(\n  InputContainer,\n  omitEmotionProps('opened', 'unbordered', 'disabled')\n)<SelectContainerProps>`\n  cursor: ${(p) => (!p.disabled ? 'pointer' : 'not-allowed')};\n  user-select: none;\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  height: unset;\n  min-height: ${(p) => p.theme.baseHeight}em;\n\n  ${selectContainerPaddingStyles};\n  ${selectContainerOpenedStyles};\n  ${selectContainerUnborderedStyles};\n  ${selectContainerUnborderedHoverStyles};\n`;\n\ninterface SelectMenuProps {\n  width: number;\n}\nconst SelectMenu = styled(Menu, omitEmotionProps('width'))<SelectMenuProps>`\n  padding-top: 0;\n  padding-bottom: 0;\n  max-height: unset;\n\n  ${m.min.xs} {\n    width: ${(p) => p.width}px;\n  }\n`;\n\nconst NotFound = styled.div`\n  height: ${(p) => p.theme.menuItemHeight}em;\n  display: flex;\n  align-items: center;\n\n  padding: 0 ${(p) => p.theme.inputPaddingHorizontal}em;\n  color: ${(p) => clr(p.theme.selectNotFoundColorText)};\n`;\n\nconst InputSearchContainer = styled.div`\n  padding: ${(p) => p.theme.menuPaddingVertical}em\n    ${(p) => p.theme.inputPaddingHorizontal}em 0;\n`;\n\nexport const ToggleContainer = styled.div`\n  flex: 1;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n`;\n\nconst toggleContentNotHasLeftStyles = (p) =>\n  !p.hasLeft &&\n  css`\n    padding-left: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\nconst toggleContentNotHasRightStyles = (p) =>\n  !p.hasRight &&\n  !p.unbordered &&\n  css`\n    padding-right: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\ninterface ToggleContentProps {\n  hasLeft?: boolean;\n  hasRight?: boolean;\n  unbordered?: boolean;\n}\nexport const ToggleContent = styled(\n  'div',\n  omitEmotionProps('hasLeft', 'hasRight', 'unbordered')\n)<ToggleContentProps>`\n  flex: 1;\n  ${toggleContentNotHasLeftStyles};\n  ${toggleContentNotHasRightStyles};\n  ${ellipsisStyles};\n`;\n\nexport const Placeholder = styled.span`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  ${ellipsisStyles};\n`;\n\nconst titleUnborderedTitleStyles = (p) =>\n  p.unbordered &&\n  css`\n    font-weight: 500;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\nconst titleDisabledStyles = (p) =>\n  p.disabled &&\n  css`\n    color: ${clr(p.theme.inputDisabledColorText)};\n  `;\n\ntype TitleProps = Pick<SelectProps, 'disabled' | 'unbordered'>;\nexport const Title = styled(\n  'span',\n  omitEmotionProps('disabled', 'unbordered')\n)<TitleProps>`\n  color: ${(p) => clr(p.theme.colorText)};\n  ${titleUnborderedTitleStyles};\n  ${titleDisabledStyles};\n  ${ellipsisStyles};\n`;\n\ntype ToggleListItemProps = Pick<SelectProps, 'disabled'>;\nconst ToggleListItem = styled(\n  Tag,\n  omitEmotionProps('disabled')\n)<ToggleListItemProps>`\n  // Reset tag styles\n  padding-top: 0;\n  padding-bottom: 0;\n\n  height: ${(p) => p.theme.selectToggleListItemHeight}em;\n  ${titleDisabledStyles};\n`;\n\nconst ToggleList = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  overflow: hidden; // For ellipsis styles\n\n  margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n    ${(p) => -p.theme.selectToggleListItemGap}em 0;\n\n  & > div {\n    margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n      ${(p) => p.theme.selectToggleListItemGap}em 0;\n  }\n`;\n\nconst DeleteButton = styled.button`\n  ${resetButtonStyles};\n  cursor: pointer;\n  display: inherit;\n  font-size: 1em;\n  margin-left: 0.2em;\n\n  background-color: transparent;\n  color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIcon)};\n\n  @media (hover: hover) {\n    &:hover,\n    &:focus {\n      color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIconHover)};\n    }\n  }\n\n  ${transitionStyles('color')};\n`;\n\nconst toggleIconUnborderedStyles = (p) =>\n  p.unbordered &&\n  css`\n    padding-top: 0.2em;\n    font-size: 0.8em;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\ninterface ToggleIconContainerProps {\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const ToggleIconContainer = styled(\n  'span',\n  omitEmotionProps('unbordered', 'disabled')\n)<ToggleIconContainerProps>`\n  color: ${(p) => clr(p.theme.selectColorIcon)};\n  line-height: 1;\n  ${toggleIconUnborderedStyles};\n`;\n\nexport const ClearIcon = styled(CloseCircle)`\n  transform: scale(1.2) !important;\n`;\n\ninterface AddonProps {\n  hasPadding: boolean;\n}\nconst Addon = styled('span', omitEmotionProps('hasPadding'))<AddonProps>`\n  display: flex;\n  align-items: center;\n  user-select: none;\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n\n  svg {\n    transform: scale(1.2);\n  }\n`;\n\nexport const ToggleLeftAddon = styled(Addon)`\n  padding-right: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-left: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nexport const ToggleRightAddon = styled(Addon)`\n  padding-left: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-right: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\n/**\n * The component that allows to pick a value from predefined options.\n */\nconst Select = forwardRef<HTMLDivElement, SelectProps>(\n  (\n    {\n      options = [],\n      left,\n      leftHasPadding = false,\n      right,\n      rightHasPadding = false,\n      placeholder,\n      searchVisible = false,\n      searchProps = {},\n      notFoundText = 'Not found',\n      unbordered = false,\n      loading = false,\n      disabled = false,\n      autoFocus = false,\n      autoOpen = false,\n      clearVisible = false,\n      threshold = 10,\n      visibleCount = 6,\n      overscanCount = 10,\n      multiple = false,\n      maxSelectedItems = 0,\n      locale = defaultLocale,\n      value,\n      defaultValue,\n      onChange,\n      onLoadNext = () => {},\n      onClose = () => {},\n      onBlur = () => {},\n      size,\n      placement,\n      ...rest\n    },\n    ref\n  ) => {\n    const [containerRef, mergedContainerRef] = useForwardedRef(ref);\n    const [width, setWidth] = useState(0);\n    const inputSearchContainerRef = useRef<HTMLDivElement>(null);\n    const [opened, setOpened] = useState(autoOpen);\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const [forwardedValue, setForwardedValue] = useForwardedState<any>({\n      value,\n      defaultValue,\n      onChange,\n    });\n\n    useEffect(() => {\n      if (autoFocus) containerRef.current?.focus();\n    }, [autoFocus, containerRef]);\n\n    const onCloseRef = useRef(onClose);\n    useEffect(() => {\n      onCloseRef.current = onClose;\n    }, [onClose]);\n\n    useEffect(() => {\n      if (!opened) onCloseRef.current();\n    }, [opened]);\n\n    /**\n     * Detect the width of the container when the select was opened and update\n     * it when either the container size or the window size has been changed.\n     */\n    const resizeHandler = useCallback(() => {\n      window.requestAnimationFrame(() => {\n        if (!opened || !containerRef.current) return;\n        const nextWidth = containerRef.current.getBoundingClientRect().width;\n        if (width === nextWidth) return;\n        setWidth(nextWidth);\n      });\n    }, [opened, containerRef, width]);\n    useBrowserLayoutEffect(() => resizeHandler(), [resizeHandler]);\n    useResizeObserver(containerRef, resizeHandler);\n    useEvent(\n      (typeof window !== 'undefined' ? window : undefined) as EventTarget,\n      'resize',\n      resizeHandler\n    );\n\n    // Replace the aria-haspopup attribute from menu to listbox\n    useBrowserLayoutEffect(() => {\n      if (!containerRef.current) return;\n      containerRef.current.setAttribute('aria-haspopup', 'listbox');\n    }, []);\n\n    const listBoxId = useMemo(\n      () => `listbox-${Math.random().toString(36).slice(2, 11)}`,\n      []\n    );\n\n    const blurHandler = useCallback(\n      (e) => {\n        if (!opened) onBlur(e);\n      },\n      [onBlur, opened]\n    );\n\n    const onDelete = useCallback(\n      (v: string) => {\n        if (!multiple) return;\n        setForwardedValue((forwardedValue || []).filter((item) => item !== v));\n      },\n      [forwardedValue, multiple, setForwardedValue]\n    );\n\n    const toggleContent = useMemo(() => {\n      if (multiple) {\n        if (!forwardedValue || forwardedValue.length === 0) {\n          return <Placeholder>{placeholder}</Placeholder>;\n        }\n        const items = forwardedValue.map((v) => {\n          const option = (options || []).find((item) => item.value === v);\n          return { title: option ? option.title || '' : '', value: v };\n        });\n        return (\n          <ToggleList>\n            {items.map(({ title, value: v }) => (\n              <ToggleListItem\n                key={v}\n                disabled={disabled}\n                right={\n                  !disabled ? (\n                    <DeleteButton\n                      onClick={(e) => {\n                        onDelete(v);\n                        e.stopPropagation();\n                      }}\n                      onKeyDown={(e) => e.stopPropagation()}\n                      aria-label={`${locale.deleteLabel} ${title}`}\n                      aria-hidden\n                    >\n                      <Close />\n                    </DeleteButton>\n                  ) : undefined\n                }\n                aria-hidden\n              >\n                {title}\n              </ToggleListItem>\n            ))}\n          </ToggleList>\n        );\n      }\n      if (!forwardedValue) {\n        return <Placeholder>{placeholder}</Placeholder>;\n      }\n      const option = (options || []).find(\n        (item) => item.value === forwardedValue\n      );\n      return (\n        <Title disabled={disabled} unbordered={unbordered}>\n          {option ? option.title : ''}\n        </Title>\n      );\n    }, [\n      disabled,\n      forwardedValue,\n      locale.deleteLabel,\n      multiple,\n      onDelete,\n      options,\n      placeholder,\n      unbordered,\n    ]);\n\n    const toggleShowClearButton = useMemo(() => {\n      if (!clearVisible) return false;\n      if (multiple) return forwardedValue && forwardedValue.length > 0;\n      return !!forwardedValue;\n    }, [clearVisible, forwardedValue, multiple]);\n\n    const toggleOnClear = useCallback(() => {\n      setForwardedValue(multiple ? [] : null);\n      if (!containerRef.current) return;\n      containerRef.current.focus();\n    }, [containerRef, multiple, setForwardedValue]);\n\n    const toggleRightValue = useMemo(() => {\n      if (loading) return <Loading />;\n      if (toggleShowClearButton) {\n        return (\n          <Button\n            type='ghost'\n            wide='never'\n            size='small'\n            disabled={disabled}\n            onClick={(e) => {\n              toggleOnClear();\n              e.stopPropagation();\n            }}\n            onKeyDown={(e) => {\n              if (e.key === 'Enter') toggleOnClear();\n              e.stopPropagation();\n            }}\n            aria-label={locale.clearLabel}\n          >\n            <ClearIcon />\n          </Button>\n        );\n      }\n      return (\n        right || (\n          <ToggleIconContainer unbordered={unbordered} disabled={disabled}>\n            {opened ? <Up /> : <Down />}\n          </ToggleIconContainer>\n        )\n      );\n    }, [\n      disabled,\n      loading,\n      locale.clearLabel,\n      opened,\n      right,\n      toggleOnClear,\n      toggleShowClearButton,\n      unbordered,\n    ]);\n\n    const toggleRightHasPaddingValue = useMemo(() => {\n      if (loading) return true;\n      if (toggleShowClearButton) return false;\n      return right ? rightHasPadding : true;\n    }, [loading, right, rightHasPadding, toggleShowClearButton]);\n\n    const onSelect = useCallback(\n      (v: string) => {\n        if (multiple) {\n          // Delete the value because it was already selected\n          if ((forwardedValue || []).includes(v)) {\n            setForwardedValue(\n              (forwardedValue || []).filter((item) => item !== v)\n            );\n            return;\n          }\n\n          // Add a new value if the number of selected items is less than max\n          if (\n            maxSelectedItems === 0 ||\n            (forwardedValue || []).length < maxSelectedItems\n          ) {\n            setForwardedValue([...(forwardedValue || []), v]);\n            return;\n          }\n          return;\n        }\n        setForwardedValue(v);\n      },\n      [forwardedValue, maxSelectedItems, multiple, setForwardedValue]\n    );\n\n    const windowSize = useSize();\n    const isMinXs = useIsMinWidth('xs');\n    const fontSize = useFontSize(document.body);\n    const { theme } = useTheme();\n\n    const scaleFactor = useMemo(() => {\n      const s = size || 'medium';\n      return ['small', 'medium', 'large'].includes(s)\n        ? theme.sizes[s]\n        : Number(s.replace(/^([0-9]+(\\.[0-9]+)?).*/, '$1')) || 1; // Extract the number\n    }, [size, theme.sizes]);\n\n    const paddingBottom = useMemo(() => {\n      const paddingEm = isMinXs\n        ? theme.menuPaddingVertical\n        : theme.modalBodyPaddingVertical[0];\n      return paddingEm * fontSize * scaleFactor;\n    }, [\n      isMinXs,\n      theme.menuPaddingVertical,\n      theme.modalBodyPaddingVertical,\n      fontSize,\n      scaleFactor,\n    ]);\n\n    const paddingTop = useMemo(\n      () => (searchVisible ? 5 * scaleFactor : paddingBottom),\n      [searchVisible, scaleFactor, paddingBottom]\n    );\n\n    const searchInputHeight = useMemo(\n      () =>\n        searchVisible\n          ? (theme.baseHeight + theme.menuPaddingVertical) *\n            fontSize *\n            scaleFactor\n          : 0,\n      [\n        searchVisible,\n        theme.baseHeight,\n        theme.menuPaddingVertical,\n        fontSize,\n        scaleFactor,\n      ]\n    );\n\n    const itemSize = useMemo(\n      () => theme.menuItemHeight * fontSize * scaleFactor,\n      [theme.menuItemHeight, fontSize, scaleFactor]\n    );\n\n    const height = useMemo(() => {\n      // Modal\n      if (!isMinXs) {\n        const maxHeight =\n          windowSize.height -\n          theme.modalHeaderHeight * fontSize * scaleFactor -\n          searchInputHeight;\n        const curHeight =\n          options.length * itemSize + paddingTop + paddingBottom;\n        return curHeight < maxHeight ? curHeight : maxHeight;\n      }\n      // Popover\n      const count =\n        options.length < visibleCount ? options.length : visibleCount;\n      return count * itemSize + paddingTop + paddingBottom;\n    }, [\n      isMinXs,\n      options.length,\n      visibleCount,\n      itemSize,\n      windowSize.height,\n      theme.modalHeaderHeight,\n      fontSize,\n      scaleFactor,\n      searchInputHeight,\n      paddingTop,\n      paddingBottom,\n    ]);\n\n    const scrollHandler = useRWLoadNext({\n      itemCount: options.length,\n      threshold,\n      itemSize,\n      paddingTop,\n      height,\n      onLoadNext,\n    });\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const InnerElement = useCallback(\n      ({ style, ...innerElementRest }) => (\n        <div\n          style={{\n            ...style,\n            height: `${\n              parseFloat(style.height) + paddingTop + paddingBottom\n            }px`,\n          }}\n          role='listbox'\n          id={listBoxId}\n          {...innerElementRest}\n        />\n      ),\n      [listBoxId, paddingBottom, paddingTop]\n    );\n\n    const listItemFn = useCallback(\n      ({ index, style }) => {\n        const {\n          title: optionTitle,\n          value: optionValue,\n          onClick: optionOnClick,\n          ...restOption\n        } = options[index];\n        return (\n          <MenuItem\n            style={{\n              ...style,\n              top: `${\n                parseFloat(style.top ? style.top.toString() : '0') + paddingTop\n              }px`,\n            }}\n            selected={\n              (multiple &&\n                (forwardedValue || []).includes(optionValue || '')) ||\n              (!multiple && forwardedValue === optionValue)\n            }\n            onClick={(e) => {\n              if (!optionValue) return;\n              onSelect(optionValue);\n\n              // Focus the input.\n              // Otherwise, if multiple is false and the user presses enter to select an item,\n              // the input will lose focus.\n              if (containerRef.current && !multiple) {\n                containerRef.current.focus();\n              }\n\n              if (optionOnClick) optionOnClick(e);\n            }}\n            role='option'\n            aria-selected={\n              (multiple &&\n                (forwardedValue || []).includes(optionValue || '')) ||\n              (!multiple && forwardedValue === optionValue)\n            }\n            {...restOption}\n          >\n            {optionTitle}\n          </MenuItem>\n        );\n      },\n      [containerRef, forwardedValue, multiple, onSelect, options, paddingTop]\n    );\n\n    return (\n      <>\n        <SelectContainer\n          opened={opened}\n          unbordered={unbordered}\n          disabled={disabled}\n          size={size}\n          tabIndex={!disabled ? 0 : -1}\n          onClick={() => {\n            if (disabled) return;\n            setOpened(!opened);\n          }}\n          onKeyDown={(e) => {\n            if (disabled) return;\n            if (['Enter', ' '].includes(e.key)) {\n              setOpened(!opened);\n              e.preventDefault();\n            }\n          }}\n          onMouseDown={(e) => e.preventDefault()}\n          onBlur={blurHandler}\n          role='combobox'\n          aria-disabled={disabled}\n          aria-busy={loading}\n          aria-haspopup='listbox'\n          aria-owns={listBoxId}\n          {...rest}\n          ref={mergedContainerRef}\n        >\n          <ToggleContainer>\n            {left && (\n              <ThemeOverrider\n                overrides={(t) => ({\n                  buttonPaddingHorizontal: 0.8,\n                  baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n                })}\n              >\n                <ToggleLeftAddon hasPadding={leftHasPadding}>\n                  {left}\n                </ToggleLeftAddon>\n              </ThemeOverrider>\n            )}\n\n            <ToggleContent\n              hasLeft={!!left}\n              hasRight={!!right}\n              unbordered={unbordered}\n            >\n              {toggleContent}\n            </ToggleContent>\n\n            {toggleRightValue && (\n              <ThemeOverrider\n                overrides={(t) => ({\n                  buttonPaddingHorizontal: 0.8,\n                  baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n                })}\n              >\n                <ToggleRightAddon hasPadding={toggleRightHasPaddingValue}>\n                  {toggleRightValue}\n                </ToggleRightAddon>\n              </ThemeOverrider>\n            )}\n          </ToggleContainer>\n        </SelectContainer>\n\n        <SelectMenu\n          trigger={containerRef}\n          visible={opened}\n          onClose={() => setOpened(false)}\n          size={size}\n          width={width}\n          closeOnSelect={!multiple}\n          modalTitle={placeholder}\n          placement={placement}\n        >\n          {searchVisible && (\n            <InputSearchContainer ref={inputSearchContainerRef}>\n              <InputSearch {...searchProps} />\n            </InputSearchContainer>\n          )}\n\n          {options.length > 0 ? (\n            <FixedSizeList\n              width='100%'\n              height={height}\n              itemSize={itemSize}\n              itemCount={options.length}\n              overscanCount={overscanCount}\n              onScroll={({ scrollOffset }) => scrollHandler(scrollOffset)}\n              innerElementType={InnerElement}\n            >\n              {listItemFn}\n            </FixedSizeList>\n          ) : (\n            <NotFound>{notFoundText}</NotFound>\n          )}\n        </SelectMenu>\n      </>\n    );\n  }\n);\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"],"mappings":"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"}

package/dist/esm/Skeleton/index.js

@@ -1,9 +1,9 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import styled from '@emotion/styled';
 import { keyframes } from '@emotion/react';
-import React, { forwardRef } from 'react';
-import { omitEmotionProps } from '@os-design/utils';
+import styled from '@emotion/styled';
 import { clr } from '@os-design/theming';
+import { omitEmotionProps } from '@os-design/utils';
+import React, { forwardRef } from 'react';
 const SkeletonAnimation = keyframes`
   from { background-position: 100% 50%; }
   to { background-position: 0 50%; }

package/dist/esm/Skeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["styled","keyframes","React","forwardRef","omitEmotionProps","clr","SkeletonAnimation","StyledSkeleton","p","width","theme","skeletonColorBgFrom","skeletonColorBgTo","borderRadius","Skeleton","rest","ref","displayName"],"sources":["../../../src/Skeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { keyframes } from '@emotion/react';\nimport React, { forwardRef } from 'react';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr } from '@os-design/theming';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface SkeletonProps extends JsxDivProps {\n  /**\n   * The width of the skeleton.\n   * @default 100%\n   */\n  width?: string;\n}\n\nconst SkeletonAnimation = keyframes`\n  from { background-position: 100% 50%; }\n  to { background-position: 0 50%; }\n`;\n\ntype StyledSkeletonProps = Required<Pick<SkeletonProps, 'width'>>;\nconst StyledSkeleton = styled(\n  'div',\n  omitEmotionProps('width', 'size')\n)<StyledSkeletonProps>`\n  width: ${(p) => p.width};\n  height: 1em;\n\n  background: linear-gradient(\n    90deg,\n    ${(p) => clr(p.theme.skeletonColorBgFrom)} 25%,\n    ${(p) => clr(p.theme.skeletonColorBgTo)} 37%,\n    ${(p) => clr(p.theme.skeletonColorBgFrom)} 63%\n  );\n  background-size: 400% 100%;\n\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  animation: ${SkeletonAnimation} 1.4s ease infinite;\n`;\n\n/**\n * Provides a basic placeholder while a user waits for the content to load.\n */\nconst Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(\n  ({ width = '100%', ...rest }, ref) => (\n    <StyledSkeleton width={width} aria-busy {...rest} ref={ref} />\n  )\n);\n\nSkeleton.displayName = 'Skeleton';\n\nexport default Skeleton;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,SAAS,QAAQ,gBAAgB;AAC1C,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,SAASC,GAAG,QAAQ,oBAAoB;AAWxC,MAAMC,iBAAiB,GAAGL,SAAU;AACpC;AACA;AACA,CAAC;AAGD,MAAMM,cAAc,GAAGP,MAAM,CAC3B,KAAK,EACLI,gBAAgB,CAAC,OAAO,EAAE,MAAM,CAAC,CACZ;AACvB,WAAYI,CAAC,IAAKA,CAAC,CAACC,KAAM;AAC1B;AACA;AACA;AACA;AACA,MAAOD,CAAC,IAAKH,GAAG,CAACG,CAAC,CAACE,KAAK,CAACC,mBAAmB,CAAE;AAC9C,MAAOH,CAAC,IAAKH,GAAG,CAACG,CAAC,CAACE,KAAK,CAACE,iBAAiB,CAAE;AAC5C,MAAOJ,CAAC,IAAKH,GAAG,CAACG,CAAC,CAACE,KAAK,CAACC,mBAAmB,CAAE;AAC9C;AACA;AACA;AACA,mBAAoBH,CAAC,IAAKA,CAAC,CAACE,KAAK,CAACG,YAAa;AAC/C,eAAeP,iBAAkB;AACjC,CAAC;;AAED;AACA;AACA;AACA,MAAMQ,QAAQ,gBAAGX,UAAU,CACzB,CAAC;EAAEM,KAAK,GAAG,MAAM;EAAE,GAAGM;AAAK,CAAC,EAAEC,GAAG,kBAC/B,oBAAC,cAAc;EAAC,KAAK,EAAEP,KAAM;EAAC;AAAS,GAAKM,IAAI;EAAE,GAAG,EAAEC;AAAI,GAC5D,CACF;AAEDF,QAAQ,CAACG,WAAW,GAAG,UAAU;AAEjC,eAAeH,QAAQ"}
+{"version":3,"file":"index.js","names":["keyframes","styled","clr","omitEmotionProps","React","forwardRef","SkeletonAnimation","StyledSkeleton","p","width","theme","skeletonColorBgFrom","skeletonColorBgTo","borderRadius","Skeleton","rest","ref","createElement","_extends","displayName"],"sources":["../../../src/Skeleton/index.tsx"],"sourcesContent":["import { keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface SkeletonProps extends JsxDivProps {\n  /**\n   * The width of the skeleton.\n   * @default 100%\n   */\n  width?: string;\n}\n\nconst SkeletonAnimation = keyframes`\n  from { background-position: 100% 50%; }\n  to { background-position: 0 50%; }\n`;\n\ntype StyledSkeletonProps = Required<Pick<SkeletonProps, 'width'>>;\nconst StyledSkeleton = styled(\n  'div',\n  omitEmotionProps('width', 'size')\n)<StyledSkeletonProps>`\n  width: ${(p) => p.width};\n  height: 1em;\n\n  background: linear-gradient(\n    90deg,\n    ${(p) => clr(p.theme.skeletonColorBgFrom)} 25%,\n    ${(p) => clr(p.theme.skeletonColorBgTo)} 37%,\n    ${(p) => clr(p.theme.skeletonColorBgFrom)} 63%\n  );\n  background-size: 400% 100%;\n\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  animation: ${SkeletonAnimation} 1.4s ease infinite;\n`;\n\n/**\n * Provides a basic placeholder while a user waits for the content to load.\n */\nconst Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(\n  ({ width = '100%', ...rest }, ref) => (\n    <StyledSkeleton width={width} aria-busy {...rest} ref={ref} />\n  )\n);\n\nSkeleton.displayName = 'Skeleton';\n\nexport default Skeleton;\n"],"mappings":";AAAA,SAASA,SAAS,QAAQ,gBAAgB;AAC1C,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AAWzC,MAAMC,iBAAiB,GAAGN,SAAU;AACpC;AACA;AACA,CAAC;AAGD,MAAMO,cAAc,GAAGN,MAAM,CAC3B,KAAK,EACLE,gBAAgB,CAAC,OAAO,EAAE,MAAM,CAClC,CAAuB;AACvB,WAAYK,CAAC,IAAKA,CAAC,CAACC,KAAM;AAC1B;AACA;AACA;AACA;AACA,MAAOD,CAAC,IAAKN,GAAG,CAACM,CAAC,CAACE,KAAK,CAACC,mBAAmB,CAAE;AAC9C,MAAOH,CAAC,IAAKN,GAAG,CAACM,CAAC,CAACE,KAAK,CAACE,iBAAiB,CAAE;AAC5C,MAAOJ,CAAC,IAAKN,GAAG,CAACM,CAAC,CAACE,KAAK,CAACC,mBAAmB,CAAE;AAC9C;AACA;AACA;AACA,mBAAoBH,CAAC,IAAKA,CAAC,CAACE,KAAK,CAACG,YAAa;AAC/C,eAAeP,iBAAkB;AACjC,CAAC;;AAED;AACA;AACA;AACA,MAAMQ,QAAQ,gBAAGT,UAAU,CACzB,CAAC;EAAEI,KAAK,GAAG,MAAM;EAAE,GAAGM;AAAK,CAAC,EAAEC,GAAG,kBAC/BZ,KAAA,CAAAa,aAAA,CAACV,cAAc,EAAAW,QAAA;EAACT,KAAK,EAAEA,KAAM;EAAC;AAAS,GAAKM,IAAI;EAAEC,GAAG,EAAEA;AAAI,EAAE,CAEjE,CAAC;AAEDF,QAAQ,CAACK,WAAW,GAAG,UAAU;AAEjC,eAAeL,QAAQ"}

package/dist/esm/Switch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["css","styled","resetButtonStyles","sizeStyles","transitionStyles","clr","omitEmotionProps","useForwardedState","React","forwardRef","useCallback","FRACTION_DIGITS","uncheckedStyles","p","checked","theme","switchUncheckedColorBg","switchHeight","switchCircleSize","toFixed","checkedStyles","switchCheckedColorBg","switchWidth","hoverUncheckedStyles","switchUncheckedColorBgHover","hoverCheckedStyles","switchCheckedColorBgHover","hoverStyles","disabled","disabledUncheckedStyles","switchDisabledUncheckedColorBg","disabledCheckedStyles","switchDisabledCheckedColorBg","disabledStyles","StyledSwitch","switchColorCircleBg","Switch","value","defaultValue","onChange","size","onMouseDown","onKeyDown","rest","ref","forwardedValue","setForwardedValue","clickHandler","mouseDownHandler","e","preventDefault","keyDownHandler","key","displayName"],"sources":["../../../src/Switch/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n  resetButtonStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps, useForwardedState } from '@os-design/utils';\nimport React, { forwardRef, useCallback } from 'react';\n\ntype JsxButtonProps = Omit<\n  JSX.IntrinsicElements['button'],\n  'value' | 'defaultValue' | 'onChange' | 'onClick' | 'ref'\n>;\nexport interface SwitchProps extends JsxButtonProps, WithSize {\n  /**\n   * Whether the switch is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Whether the switch is checked.\n   * @default false\n   */\n  value?: boolean;\n  /**\n   * The default value.\n   * @default undefined\n   */\n  defaultValue?: boolean;\n  /**\n   * The change event handler.\n   * @default undefined\n   */\n  onChange?: (value: boolean) => void;\n}\n\nconst FRACTION_DIGITS = 4;\n\nconst uncheckedStyles = (p) =>\n  !p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchUncheckedColorBg)};\n    &::after {\n      left: ${+((p.theme.switchHeight - p.theme.switchCircleSize) / 2).toFixed(\n        FRACTION_DIGITS\n      )}em;\n    }\n  `;\n\nconst checkedStyles = (p) =>\n  p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchCheckedColorBg)};\n    &::after {\n      left: ${+(\n        p.theme.switchWidth -\n        p.theme.switchCircleSize -\n        (p.theme.switchHeight - p.theme.switchCircleSize) / 2\n      ).toFixed(FRACTION_DIGITS)}em;\n    }\n  `;\n\nconst hoverUncheckedStyles = (p) =>\n  !p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchUncheckedColorBgHover)};\n  `;\n\nconst hoverCheckedStyles = (p) =>\n  p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchCheckedColorBgHover)};\n  `;\n\nconst hoverStyles = (p) =>\n  !p.disabled &&\n  css`\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        ${hoverUncheckedStyles(p)};\n        ${hoverCheckedStyles(p)};\n      }\n    }\n  `;\n\nconst disabledUncheckedStyles = (p) =>\n  !p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchDisabledUncheckedColorBg)};\n  `;\n\nconst disabledCheckedStyles = (p) =>\n  p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchDisabledCheckedColorBg)};\n  `;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    cursor: not-allowed;\n    ${disabledUncheckedStyles(p)};\n    ${disabledCheckedStyles(p)};\n  `;\n\ninterface StyledSwitchProps extends Pick<SwitchProps, 'disabled' | 'size'> {\n  checked: SwitchProps['value'];\n}\nconst StyledSwitch = styled(\n  'button',\n  omitEmotionProps('size', 'checked')\n)<StyledSwitchProps>`\n  ${resetButtonStyles};\n  position: relative;\n  cursor: pointer;\n  user-select: none;\n  display: block;\n\n  width: ${(p) => p.theme.switchWidth}em;\n  height: ${(p) => p.theme.switchHeight}em;\n  border-radius: ${(p) => p.theme.switchHeight / 2}em;\n\n  &::after {\n    position: absolute;\n    top: ${(p) =>\n      +((p.theme.switchHeight - p.theme.switchCircleSize) / 2).toFixed(\n        FRACTION_DIGITS\n      )}em;\n\n    width: ${(p) => p.theme.switchCircleSize}em;\n    height: ${(p) => p.theme.switchCircleSize}em;\n    border-radius: 50%;\n\n    background-color: ${(p) => clr(p.theme.switchColorCircleBg)};\n    content: ' ';\n\n    ${transitionStyles('left')};\n  }\n\n  ${uncheckedStyles};\n  ${checkedStyles};\n  ${hoverStyles};\n  ${disabledStyles};\n\n  ${sizeStyles};\n  ${transitionStyles('background-color')};\n`;\n\n/**\n * The switch that can be enabled or disabled.\n */\nconst Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n  (\n    {\n      disabled = false,\n      value,\n      defaultValue,\n      onChange = () => {},\n      size,\n      onMouseDown = () => {},\n      onKeyDown = () => {},\n      ...rest\n    },\n    ref\n  ) => {\n    const [forwardedValue, setForwardedValue] = useForwardedState({\n      value,\n      defaultValue,\n      onChange,\n    });\n\n    const clickHandler = useCallback(() => {\n      if (disabled) return;\n      setForwardedValue(!forwardedValue);\n    }, [disabled, forwardedValue, setForwardedValue]);\n\n    const mouseDownHandler = useCallback(\n      (e) => {\n        onMouseDown(e);\n        e.preventDefault();\n      },\n      [onMouseDown]\n    );\n\n    const keyDownHandler = useCallback(\n      (e) => {\n        if (e.key === ' ') setForwardedValue(!forwardedValue);\n        onKeyDown(e);\n        e.preventDefault();\n      },\n      [forwardedValue, onKeyDown, setForwardedValue]\n    );\n\n    return (\n      <StyledSwitch\n        disabled={disabled}\n        checked={forwardedValue}\n        size={size}\n        onClick={clickHandler}\n        onMouseDown={mouseDownHandler}\n        onKeyDown={keyDownHandler}\n        role='switch'\n        aria-checked={forwardedValue}\n        {...rest}\n        ref={ref}\n      />\n    );\n  }\n);\n\nSwitch.displayName = 'Switch';\n\nexport default Switch;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["css","styled","resetButtonStyles","sizeStyles","transitionStyles","clr","omitEmotionProps","useForwardedState","React","forwardRef","useCallback","FRACTION_DIGITS","uncheckedStyles","p","checked","theme","switchUncheckedColorBg","switchHeight","switchCircleSize","toFixed","checkedStyles","switchCheckedColorBg","switchWidth","hoverUncheckedStyles","switchUncheckedColorBgHover","hoverCheckedStyles","switchCheckedColorBgHover","hoverStyles","disabled","disabledUncheckedStyles","switchDisabledUncheckedColorBg","disabledCheckedStyles","switchDisabledCheckedColorBg","disabledStyles","StyledSwitch","switchColorCircleBg","Switch","value","defaultValue","onChange","size","onMouseDown","onKeyDown","rest","ref","forwardedValue","setForwardedValue","clickHandler","mouseDownHandler","e","preventDefault","keyDownHandler","key","createElement","_extends","onClick","role","displayName"],"sources":["../../../src/Switch/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n  resetButtonStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps, useForwardedState } from '@os-design/utils';\nimport React, { forwardRef, useCallback } from 'react';\n\ntype JsxButtonProps = Omit<\n  JSX.IntrinsicElements['button'],\n  'value' | 'defaultValue' | 'onChange' | 'onClick' | 'ref'\n>;\nexport interface SwitchProps extends JsxButtonProps, WithSize {\n  /**\n   * Whether the switch is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Whether the switch is checked.\n   * @default false\n   */\n  value?: boolean;\n  /**\n   * The default value.\n   * @default undefined\n   */\n  defaultValue?: boolean;\n  /**\n   * The change event handler.\n   * @default undefined\n   */\n  onChange?: (value: boolean) => void;\n}\n\nconst FRACTION_DIGITS = 4;\n\nconst uncheckedStyles = (p) =>\n  !p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchUncheckedColorBg)};\n    &::after {\n      left: ${+((p.theme.switchHeight - p.theme.switchCircleSize) / 2).toFixed(\n        FRACTION_DIGITS\n      )}em;\n    }\n  `;\n\nconst checkedStyles = (p) =>\n  p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchCheckedColorBg)};\n    &::after {\n      left: ${+(\n        p.theme.switchWidth -\n        p.theme.switchCircleSize -\n        (p.theme.switchHeight - p.theme.switchCircleSize) / 2\n      ).toFixed(FRACTION_DIGITS)}em;\n    }\n  `;\n\nconst hoverUncheckedStyles = (p) =>\n  !p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchUncheckedColorBgHover)};\n  `;\n\nconst hoverCheckedStyles = (p) =>\n  p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchCheckedColorBgHover)};\n  `;\n\nconst hoverStyles = (p) =>\n  !p.disabled &&\n  css`\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        ${hoverUncheckedStyles(p)};\n        ${hoverCheckedStyles(p)};\n      }\n    }\n  `;\n\nconst disabledUncheckedStyles = (p) =>\n  !p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchDisabledUncheckedColorBg)};\n  `;\n\nconst disabledCheckedStyles = (p) =>\n  p.checked &&\n  css`\n    background-color: ${clr(p.theme.switchDisabledCheckedColorBg)};\n  `;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    cursor: not-allowed;\n    ${disabledUncheckedStyles(p)};\n    ${disabledCheckedStyles(p)};\n  `;\n\ninterface StyledSwitchProps extends Pick<SwitchProps, 'disabled' | 'size'> {\n  checked: SwitchProps['value'];\n}\nconst StyledSwitch = styled(\n  'button',\n  omitEmotionProps('size', 'checked')\n)<StyledSwitchProps>`\n  ${resetButtonStyles};\n  position: relative;\n  cursor: pointer;\n  user-select: none;\n  display: block;\n\n  width: ${(p) => p.theme.switchWidth}em;\n  height: ${(p) => p.theme.switchHeight}em;\n  border-radius: ${(p) => p.theme.switchHeight / 2}em;\n\n  &::after {\n    position: absolute;\n    top: ${(p) =>\n      +((p.theme.switchHeight - p.theme.switchCircleSize) / 2).toFixed(\n        FRACTION_DIGITS\n      )}em;\n\n    width: ${(p) => p.theme.switchCircleSize}em;\n    height: ${(p) => p.theme.switchCircleSize}em;\n    border-radius: 50%;\n\n    background-color: ${(p) => clr(p.theme.switchColorCircleBg)};\n    content: ' ';\n\n    ${transitionStyles('left')};\n  }\n\n  ${uncheckedStyles};\n  ${checkedStyles};\n  ${hoverStyles};\n  ${disabledStyles};\n\n  ${sizeStyles};\n  ${transitionStyles('background-color')};\n`;\n\n/**\n * The switch that can be enabled or disabled.\n */\nconst Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n  (\n    {\n      disabled = false,\n      value,\n      defaultValue,\n      onChange = () => {},\n      size,\n      onMouseDown = () => {},\n      onKeyDown = () => {},\n      ...rest\n    },\n    ref\n  ) => {\n    const [forwardedValue, setForwardedValue] = useForwardedState({\n      value,\n      defaultValue,\n      onChange,\n    });\n\n    const clickHandler = useCallback(() => {\n      if (disabled) return;\n      setForwardedValue(!forwardedValue);\n    }, [disabled, forwardedValue, setForwardedValue]);\n\n    const mouseDownHandler = useCallback(\n      (e) => {\n        onMouseDown(e);\n        e.preventDefault();\n      },\n      [onMouseDown]\n    );\n\n    const keyDownHandler = useCallback(\n      (e) => {\n        if (e.key === ' ') setForwardedValue(!forwardedValue);\n        onKeyDown(e);\n        e.preventDefault();\n      },\n      [forwardedValue, onKeyDown, setForwardedValue]\n    );\n\n    return (\n      <StyledSwitch\n        disabled={disabled}\n        checked={forwardedValue}\n        size={size}\n        onClick={clickHandler}\n        onMouseDown={mouseDownHandler}\n        onKeyDown={keyDownHandler}\n        role='switch'\n        aria-checked={forwardedValue}\n        {...rest}\n        ref={ref}\n      />\n    );\n  }\n);\n\nSwitch.displayName = 'Switch';\n\nexport default Switch;\n"],"mappings":"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"}

package/dist/esm/SwitchSkeleton/index.js

@@ -1,8 +1,8 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import styled from '@emotion/styled';
-import React, { forwardRef } from 'react';
 import { sizeStyles } from '@os-design/styles';
 import { omitEmotionProps } from '@os-design/utils';
+import React, { forwardRef } from 'react';
 import Skeleton from '../Skeleton';
 const StyledSwitchSkeleton = styled(Skeleton, omitEmotionProps('size'))`
   width: ${p => p.theme.switchWidth}em;

package/dist/esm/SwitchSkeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["styled","React","forwardRef","sizeStyles","omitEmotionProps","Skeleton","StyledSwitchSkeleton","p","theme","switchWidth","switchHeight","SwitchSkeleton","props","ref","displayName"],"sources":["../../../src/SwitchSkeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport React, { forwardRef } from 'react';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport Skeleton, { SkeletonProps } from '../Skeleton';\n\nexport type SwitchSkeletonProps = Omit<SkeletonProps, 'width'> & WithSize;\n\nconst StyledSwitchSkeleton = styled(\n  Skeleton,\n  omitEmotionProps('size')\n)<WithSize>`\n  width: ${(p) => p.theme.switchWidth}em;\n  height: ${(p) => p.theme.switchHeight}em;\n  border-radius: ${(p) => p.theme.switchHeight / 2}em;\n  ${sizeStyles};\n`;\n\n/**\n * Provides a switch placeholder while a user waits for the content to load.\n */\nconst SwitchSkeleton = forwardRef<HTMLDivElement, SwitchSkeletonProps>(\n  (props, ref) => <StyledSwitchSkeleton width='100%' {...props} ref={ref} />\n);\n\nSwitchSkeleton.displayName = 'SwitchSkeleton';\n\nexport default SwitchSkeleton;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,UAAU,QAAkB,mBAAmB;AACxD,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,QAAQ,MAAyB,aAAa;AAIrD,MAAMC,oBAAoB,GAAGN,MAAM,CACjCK,QAAQ,EACRD,gBAAgB,CAAC,MAAM,CAAC,CACd;AACZ,WAAYG,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACC,WAAY;AACtC,YAAaF,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACE,YAAa;AACxC,mBAAoBH,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACE,YAAY,GAAG,CAAE;AACnD,IAAIP,UAAW;AACf,CAAC;;AAED;AACA;AACA;AACA,MAAMQ,cAAc,gBAAGT,UAAU,CAC/B,CAACU,KAAK,EAAEC,GAAG,kBAAK,oBAAC,oBAAoB;EAAC,KAAK,EAAC;AAAM,GAAKD,KAAK;EAAE,GAAG,EAAEC;AAAI,GAAG,CAC3E;AAEDF,cAAc,CAACG,WAAW,GAAG,gBAAgB;AAE7C,eAAeH,cAAc"}
+{"version":3,"file":"index.js","names":["styled","sizeStyles","omitEmotionProps","React","forwardRef","Skeleton","StyledSwitchSkeleton","p","theme","switchWidth","switchHeight","SwitchSkeleton","props","ref","createElement","_extends","width","displayName"],"sources":["../../../src/SwitchSkeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\n\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\nimport Skeleton, { SkeletonProps } from '../Skeleton';\n\nexport type SwitchSkeletonProps = Omit<SkeletonProps, 'width'> & WithSize;\n\nconst StyledSwitchSkeleton = styled(\n  Skeleton,\n  omitEmotionProps('size')\n)<WithSize>`\n  width: ${(p) => p.theme.switchWidth}em;\n  height: ${(p) => p.theme.switchHeight}em;\n  border-radius: ${(p) => p.theme.switchHeight / 2}em;\n  ${sizeStyles};\n`;\n\n/**\n * Provides a switch placeholder while a user waits for the content to load.\n */\nconst SwitchSkeleton = forwardRef<HTMLDivElement, SwitchSkeletonProps>(\n  (props, ref) => <StyledSwitchSkeleton width='100%' {...props} ref={ref} />\n);\n\nSwitchSkeleton.displayName = 'SwitchSkeleton';\n\nexport default SwitchSkeleton;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AAEpC,SAASC,UAAU,QAAkB,mBAAmB;AACxD,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AAEzC,OAAOC,QAAQ,MAAyB,aAAa;AAIrD,MAAMC,oBAAoB,GAAGN,MAAM,CACjCK,QAAQ,EACRH,gBAAgB,CAAC,MAAM,CACzB,CAAY;AACZ,WAAYK,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACC,WAAY;AACtC,YAAaF,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACE,YAAa;AACxC,mBAAoBH,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACE,YAAY,GAAG,CAAE;AACnD,IAAIT,UAAW;AACf,CAAC;;AAED;AACA;AACA;AACA,MAAMU,cAAc,gBAAGP,UAAU,CAC/B,CAACQ,KAAK,EAAEC,GAAG,kBAAKV,KAAA,CAAAW,aAAA,CAACR,oBAAoB,EAAAS,QAAA;EAACC,KAAK,EAAC;AAAM,GAAKJ,KAAK;EAAEC,GAAG,EAAEA;AAAI,EAAE,CAC3E,CAAC;AAEDF,cAAc,CAACM,WAAW,GAAG,gBAAgB;AAE7C,eAAeN,cAAc"}

package/dist/esm/Tag/index.js

@@ -1,9 +1,9 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import React, { forwardRef } from 'react';
 import styled from '@emotion/styled';
 import { ellipsisStyles, sizeStyles, transitionStyles } from '@os-design/styles';
-import { omitEmotionProps } from '@os-design/utils';
 import { clr } from '@os-design/theming';
+import { omitEmotionProps } from '@os-design/utils';
+import React, { forwardRef } from 'react';
 export const TagContainer = styled('div', omitEmotionProps('size'))`
   display: inline-flex;
   align-items: center;

package/dist/esm/Tag/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","forwardRef","styled","ellipsisStyles","sizeStyles","transitionStyles","omitEmotionProps","clr","TagContainer","p","theme","tagColorBg","tagColorText","borderRadius","tagPaddingVertical","tagPaddingHorizontal","Content","div","LeftAddon","tagAddonPaddingHorizontal","RightAddon","Tag","left","right","children","rest","ref","displayName"],"sources":["../../../src/Tag/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport styled from '@emotion/styled';\nimport {\n  ellipsisStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr } from '@os-design/theming';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\n\nexport interface BaseTagProps extends WithSize {\n  /**\n   * The component located on the left side.\n   * @default undefined\n   */\n  left?: React.ReactNode;\n  /**\n   * The component located on the right side.\n   * @default undefined\n   */\n  right?: React.ReactNode;\n}\n\nexport type TagProps = JsxDivProps & BaseTagProps;\n\nexport const TagContainer = styled('div', omitEmotionProps('size'))<WithSize>`\n  display: inline-flex;\n  align-items: center;\n  overflow: hidden;\n\n  background-color: ${(p) => clr(p.theme.tagColorBg)};\n  color: ${(p) => clr(p.theme.tagColorText)};\n\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  padding: ${(p) => p.theme.tagPaddingVertical}em\n    ${(p) => p.theme.tagPaddingHorizontal}em;\n\n  ${sizeStyles};\n  ${transitionStyles('background-color')};\n`;\n\nconst Content = styled.div`\n  ${ellipsisStyles};\n`;\n\nexport const LeftAddon = styled.div`\n  display: inherit;\n  padding-right: ${(p) => p.theme.tagAddonPaddingHorizontal}em;\n`;\n\nexport const RightAddon = styled.div`\n  display: inherit;\n  padding-left: ${(p) => p.theme.tagAddonPaddingHorizontal}em;\n`;\n\n/**\n * The component to display a label, tag, or category.\n */\nconst Tag = forwardRef<HTMLDivElement, TagProps>(\n  ({ left, right, children, ...rest }, ref) => (\n    <TagContainer {...rest} ref={ref}>\n      {left && <LeftAddon>{left}</LeftAddon>}\n      <Content>{children}</Content>\n      {right && <RightAddon>{right}</RightAddon>}\n    </TagContainer>\n  )\n);\n\nTag.displayName = 'Tag';\n\nexport default Tag;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SACEC,cAAc,EACdC,UAAU,EACVC,gBAAgB,QAEX,mBAAmB;AAC1B,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,SAASC,GAAG,QAAQ,oBAAoB;AAmBxC,OAAO,MAAMC,YAAY,GAAGN,MAAM,CAAC,KAAK,EAAEI,gBAAgB,CAAC,MAAM,CAAC,CAAY;AAC9E;AACA;AACA;AACA;AACA,sBAAuBG,CAAC,IAAKF,GAAG,CAACE,CAAC,CAACC,KAAK,CAACC,UAAU,CAAE;AACrD,WAAYF,CAAC,IAAKF,GAAG,CAACE,CAAC,CAACC,KAAK,CAACE,YAAY,CAAE;AAC5C;AACA,mBAAoBH,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACG,YAAa;AAC/C,aAAcJ,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACI,kBAAmB;AAC/C,MAAOL,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACK,oBAAqB;AAC1C;AACA,IAAIX,UAAW;AACf,IAAIC,gBAAgB,CAAC,kBAAkB,CAAE;AACzC,CAAC;AAED,MAAMW,OAAO,GAAGd,MAAM,CAACe,GAAI;AAC3B,IAAId,cAAe;AACnB,CAAC;AAED,OAAO,MAAMe,SAAS,GAAGhB,MAAM,CAACe,GAAI;AACpC;AACA,mBAAoBR,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACS,yBAA0B;AAC5D,CAAC;AAED,OAAO,MAAMC,UAAU,GAAGlB,MAAM,CAACe,GAAI;AACrC;AACA,kBAAmBR,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACS,yBAA0B;AAC3D,CAAC;;AAED;AACA;AACA;AACA,MAAME,GAAG,gBAAGpB,UAAU,CACpB,CAAC;EAAEqB,IAAI;EAAEC,KAAK;EAAEC,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBACtC,oBAAC,YAAY,eAAKD,IAAI;EAAE,GAAG,EAAEC;AAAI,IAC9BJ,IAAI,iBAAI,oBAAC,SAAS,QAAEA,IAAI,CAAa,eACtC,oBAAC,OAAO,QAAEE,QAAQ,CAAW,EAC5BD,KAAK,iBAAI,oBAAC,UAAU,QAAEA,KAAK,CAAc,CAE7C,CACF;AAEDF,GAAG,CAACM,WAAW,GAAG,KAAK;AAEvB,eAAeN,GAAG"}
+{"version":3,"file":"index.js","names":["styled","ellipsisStyles","sizeStyles","transitionStyles","clr","omitEmotionProps","React","forwardRef","TagContainer","p","theme","tagColorBg","tagColorText","borderRadius","tagPaddingVertical","tagPaddingHorizontal","Content","div","LeftAddon","tagAddonPaddingHorizontal","RightAddon","Tag","left","right","children","rest","ref","createElement","_extends","displayName"],"sources":["../../../src/Tag/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport {\n  ellipsisStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr } from '@os-design/theming';\n\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\n\nexport interface BaseTagProps extends WithSize {\n  /**\n   * The component located on the left side.\n   * @default undefined\n   */\n  left?: React.ReactNode;\n  /**\n   * The component located on the right side.\n   * @default undefined\n   */\n  right?: React.ReactNode;\n}\n\nexport type TagProps = JsxDivProps & BaseTagProps;\n\nexport const TagContainer = styled('div', omitEmotionProps('size'))<WithSize>`\n  display: inline-flex;\n  align-items: center;\n  overflow: hidden;\n\n  background-color: ${(p) => clr(p.theme.tagColorBg)};\n  color: ${(p) => clr(p.theme.tagColorText)};\n\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  padding: ${(p) => p.theme.tagPaddingVertical}em\n    ${(p) => p.theme.tagPaddingHorizontal}em;\n\n  ${sizeStyles};\n  ${transitionStyles('background-color')};\n`;\n\nconst Content = styled.div`\n  ${ellipsisStyles};\n`;\n\nexport const LeftAddon = styled.div`\n  display: inherit;\n  padding-right: ${(p) => p.theme.tagAddonPaddingHorizontal}em;\n`;\n\nexport const RightAddon = styled.div`\n  display: inherit;\n  padding-left: ${(p) => p.theme.tagAddonPaddingHorizontal}em;\n`;\n\n/**\n * The component to display a label, tag, or category.\n */\nconst Tag = forwardRef<HTMLDivElement, TagProps>(\n  ({ left, right, children, ...rest }, ref) => (\n    <TagContainer {...rest} ref={ref}>\n      {left && <LeftAddon>{left}</LeftAddon>}\n      <Content>{children}</Content>\n      {right && <RightAddon>{right}</RightAddon>}\n    </TagContainer>\n  )\n);\n\nTag.displayName = 'Tag';\n\nexport default Tag;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SACEC,cAAc,EACdC,UAAU,EACVC,gBAAgB,QAEX,mBAAmB;AAC1B,SAASC,GAAG,QAAQ,oBAAoB;AAExC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AAmBzC,OAAO,MAAMC,YAAY,GAAGR,MAAM,CAAC,KAAK,EAAEK,gBAAgB,CAAC,MAAM,CAAC,CAAY;AAC9E;AACA;AACA;AACA;AACA,sBAAuBI,CAAC,IAAKL,GAAG,CAACK,CAAC,CAACC,KAAK,CAACC,UAAU,CAAE;AACrD,WAAYF,CAAC,IAAKL,GAAG,CAACK,CAAC,CAACC,KAAK,CAACE,YAAY,CAAE;AAC5C;AACA,mBAAoBH,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACG,YAAa;AAC/C,aAAcJ,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACI,kBAAmB;AAC/C,MAAOL,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACK,oBAAqB;AAC1C;AACA,IAAIb,UAAW;AACf,IAAIC,gBAAgB,CAAC,kBAAkB,CAAE;AACzC,CAAC;AAED,MAAMa,OAAO,GAAGhB,MAAM,CAACiB,GAAI;AAC3B,IAAIhB,cAAe;AACnB,CAAC;AAED,OAAO,MAAMiB,SAAS,GAAGlB,MAAM,CAACiB,GAAI;AACpC;AACA,mBAAoBR,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACS,yBAA0B;AAC5D,CAAC;AAED,OAAO,MAAMC,UAAU,GAAGpB,MAAM,CAACiB,GAAI;AACrC;AACA,kBAAmBR,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACS,yBAA0B;AAC3D,CAAC;;AAED;AACA;AACA;AACA,MAAME,GAAG,gBAAGd,UAAU,CACpB,CAAC;EAAEe,IAAI;EAAEC,KAAK;EAAEC,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBACtCpB,KAAA,CAAAqB,aAAA,CAACnB,YAAY,EAAAoB,QAAA,KAAKH,IAAI;EAAEC,GAAG,EAAEA;AAAI,IAC9BJ,IAAI,iBAAIhB,KAAA,CAAAqB,aAAA,CAACT,SAAS,QAAEI,IAAgB,CAAC,eACtChB,KAAA,CAAAqB,aAAA,CAACX,OAAO,QAAEQ,QAAkB,CAAC,EAC5BD,KAAK,iBAAIjB,KAAA,CAAAqB,aAAA,CAACP,UAAU,QAAEG,KAAkB,CAC7B,CAElB,CAAC;AAEDF,GAAG,CAACQ,WAAW,GAAG,KAAK;AAEvB,eAAeR,GAAG"}

package/dist/esm/TagLink/index.js

@@ -1,9 +1,9 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import React, { forwardRef } from 'react';
 import styled from '@emotion/styled';
 import { clr } from '@os-design/theming';
 import { omitEmotionProps } from '@os-design/utils';
-import { TagContainer, LeftAddon, RightAddon } from '../Tag';
+import React, { forwardRef } from 'react';
+import { LeftAddon, RightAddon, TagContainer } from '../Tag';
 const StyledTagLink = styled(TagContainer.withComponent('a'), omitEmotionProps('as'))`
   cursor: pointer;
   text-decoration: none;

package/dist/esm/TagLink/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","forwardRef","styled","clr","omitEmotionProps","TagContainer","LeftAddon","RightAddon","StyledTagLink","withComponent","p","theme","tagColorBgHover","TagLink","left","right","as","onMouseDown","children","rest","ref","e","preventDefault","displayName"],"sources":["../../../src/TagLink/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport styled from '@emotion/styled';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { BaseTagProps, TagContainer, LeftAddon, RightAddon } from '../Tag';\nimport { LinkProps, ReactRouterLinkProps } from '../Link';\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'ref'>;\nexport type TagLinkProps = JsxAProps &\n  ReactRouterLinkProps &\n  Pick<LinkProps, 'as'> &\n  BaseTagProps;\n\nconst StyledTagLink = styled(\n  TagContainer.withComponent('a'),\n  omitEmotionProps('as')\n)`\n  cursor: pointer;\n  text-decoration: none;\n\n  @media (hover: hover) {\n    &:hover,\n    &:focus {\n      background-color: ${(p) => clr(p.theme.tagColorBgHover)};\n    }\n  }\n`;\n\n/**\n * The tag component with a link.\n */\nconst TagLink = forwardRef<HTMLAnchorElement, TagLinkProps>(\n  ({ left, right, as, onMouseDown = () => {}, children, ...rest }, ref) => (\n    <StyledTagLink\n      as={as}\n      onMouseDown={(e) => {\n        onMouseDown(e);\n        e.preventDefault();\n      }}\n      {...rest}\n      ref={ref}\n    >\n      {left && <LeftAddon>{left}</LeftAddon>}\n      {children}\n      {right && <RightAddon>{right}</RightAddon>}\n    </StyledTagLink>\n  )\n);\n\nTagLink.displayName = 'TagLink';\n\nexport default TagLink;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,SAAuBC,YAAY,EAAEC,SAAS,EAAEC,UAAU,QAAQ,QAAQ;AAS1E,MAAMC,aAAa,GAAGN,MAAM,CAC1BG,YAAY,CAACI,aAAa,CAAC,GAAG,CAAC,EAC/BL,gBAAgB,CAAC,IAAI,CAAC,CACtB;AACF;AACA;AACA;AACA;AACA;AACA;AACA,0BAA2BM,CAAC,IAAKP,GAAG,CAACO,CAAC,CAACC,KAAK,CAACC,eAAe,CAAE;AAC9D;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA,MAAMC,OAAO,gBAAGZ,UAAU,CACxB,CAAC;EAAEa,IAAI;EAAEC,KAAK;EAAEC,EAAE;EAAEC,WAAW,GAAG,MAAM,CAAC,CAAC;EAAEC,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBAClE,oBAAC,aAAa;EACZ,EAAE,EAAEJ,EAAG;EACP,WAAW,EAAGK,CAAC,IAAK;IAClBJ,WAAW,CAACI,CAAC,CAAC;IACdA,CAAC,CAACC,cAAc,EAAE;EACpB;AAAE,GACEH,IAAI;EACR,GAAG,EAAEC;AAAI,IAERN,IAAI,iBAAI,oBAAC,SAAS,QAAEA,IAAI,CAAa,EACrCI,QAAQ,EACRH,KAAK,iBAAI,oBAAC,UAAU,QAAEA,KAAK,CAAc,CAE7C,CACF;AAEDF,OAAO,CAACU,WAAW,GAAG,SAAS;AAE/B,eAAeV,OAAO"}
+{"version":3,"file":"index.js","names":["styled","clr","omitEmotionProps","React","forwardRef","LeftAddon","RightAddon","TagContainer","StyledTagLink","withComponent","p","theme","tagColorBgHover","TagLink","left","right","as","onMouseDown","children","rest","ref","createElement","_extends","e","preventDefault","displayName"],"sources":["../../../src/TagLink/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\nimport { LinkProps, ReactRouterLinkProps } from '../Link';\nimport { BaseTagProps, LeftAddon, RightAddon, TagContainer } from '../Tag';\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'ref'>;\nexport type TagLinkProps = JsxAProps &\n  ReactRouterLinkProps &\n  Pick<LinkProps, 'as'> &\n  BaseTagProps;\n\nconst StyledTagLink = styled(\n  TagContainer.withComponent('a'),\n  omitEmotionProps('as')\n)`\n  cursor: pointer;\n  text-decoration: none;\n\n  @media (hover: hover) {\n    &:hover,\n    &:focus {\n      background-color: ${(p) => clr(p.theme.tagColorBgHover)};\n    }\n  }\n`;\n\n/**\n * The tag component with a link.\n */\nconst TagLink = forwardRef<HTMLAnchorElement, TagLinkProps>(\n  ({ left, right, as, onMouseDown = () => {}, children, ...rest }, ref) => (\n    <StyledTagLink\n      as={as}\n      onMouseDown={(e) => {\n        onMouseDown(e);\n        e.preventDefault();\n      }}\n      {...rest}\n      ref={ref}\n    >\n      {left && <LeftAddon>{left}</LeftAddon>}\n      {children}\n      {right && <RightAddon>{right}</RightAddon>}\n    </StyledTagLink>\n  )\n);\n\nTagLink.displayName = 'TagLink';\n\nexport default TagLink;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AAGzC,SAAuBC,SAAS,EAAEC,UAAU,EAAEC,YAAY,QAAQ,QAAQ;AAQ1E,MAAMC,aAAa,GAAGR,MAAM,CAC1BO,YAAY,CAACE,aAAa,CAAC,GAAG,CAAC,EAC/BP,gBAAgB,CAAC,IAAI,CACvB,CAAE;AACF;AACA;AACA;AACA;AACA;AACA;AACA,0BAA2BQ,CAAC,IAAKT,GAAG,CAACS,CAAC,CAACC,KAAK,CAACC,eAAe,CAAE;AAC9D;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA,MAAMC,OAAO,gBAAGT,UAAU,CACxB,CAAC;EAAEU,IAAI;EAAEC,KAAK;EAAEC,EAAE;EAAEC,WAAW,GAAGA,CAAA,KAAM,CAAC,CAAC;EAAEC,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBAClEjB,KAAA,CAAAkB,aAAA,CAACb,aAAa,EAAAc,QAAA;EACZN,EAAE,EAAEA,EAAG;EACPC,WAAW,EAAGM,CAAC,IAAK;IAClBN,WAAW,CAACM,CAAC,CAAC;IACdA,CAAC,CAACC,cAAc,CAAC,CAAC;EACpB;AAAE,GACEL,IAAI;EACRC,GAAG,EAAEA;AAAI,IAERN,IAAI,iBAAIX,KAAA,CAAAkB,aAAA,CAAChB,SAAS,QAAES,IAAgB,CAAC,EACrCI,QAAQ,EACRH,KAAK,iBAAIZ,KAAA,CAAAkB,aAAA,CAACf,UAAU,QAAES,KAAkB,CAC5B,CAEnB,CAAC;AAEDF,OAAO,CAACY,WAAW,GAAG,SAAS;AAE/B,eAAeZ,OAAO"}

package/dist/esm/TagList/index.js

@@ -1,10 +1,10 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import React, { forwardRef, useState } from 'react';
-import styled from '@emotion/styled';
 import { css } from '@emotion/react';
+import styled from '@emotion/styled';
 import { Down, Up } from '@os-design/icons';
 import { sizeStyles } from '@os-design/styles';
 import { omitEmotionProps } from '@os-design/utils';
+import React, { forwardRef, useState } from 'react';
 import Button from '../Button';
 const collapsibleStyles = p => p.collapsible && !p.opened && css`
     // The height of the tag

package/dist/esm/TagList/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","forwardRef","useState","styled","css","Down","Up","sizeStyles","omitEmotionProps","Button","collapsibleStyles","p","collapsible","opened","theme","lineHeight","tagPaddingVertical","Container","Content","div","tagListGap","Control","OpenButton","TagList","size","children","rest","ref","setOpened","displayName"],"sources":["../../../src/TagList/index.tsx"],"sourcesContent":["import React, { forwardRef, useState } from 'react';\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\nimport { Down, Up } from '@os-design/icons';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport Button from '../Button';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface TagListProps extends JsxDivProps, WithSize {\n  /**\n   * Whether the tag list is collapsible.\n   * @default false\n   */\n  collapsible?: boolean;\n}\n\nconst collapsibleStyles = (p) =>\n  p.collapsible &&\n  !p.opened &&\n  css`\n    // The height of the tag\n    height: ${p.theme.lineHeight + p.theme.tagPaddingVertical * 2}em;\n  `;\n\ninterface ContainerProps extends Pick<TagListProps, 'collapsible' | 'size'> {\n  opened: boolean;\n}\nconst Container = styled(\n  'div',\n  omitEmotionProps('opened', 'collapsible', 'size')\n)<ContainerProps>`\n  display: flex;\n  overflow: hidden;\n  ${collapsibleStyles};\n  ${sizeStyles};\n`;\n\nconst Content = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  flex-grow: 1;\n\n  margin: ${(p) => -p.theme.tagListGap}em 0 0 ${(p) => -p.theme.tagListGap}em;\n  & > * {\n    margin: ${(p) => p.theme.tagListGap}em 0 0 ${(p) => p.theme.tagListGap}em;\n  }\n`;\n\nconst Control = styled.div`\n  margin-left: 0.2em;\n`;\n\nconst OpenButton = styled(Button)`\n  // The height of the tag\n  height: ${(p) => p.theme.lineHeight + p.theme.tagPaddingVertical * 2}em;\n  padding: 0 0.5em;\n`;\n\n/**\n * The component to display a list of tags.\n */\nconst TagList = forwardRef<HTMLDivElement, TagListProps>(\n  ({ collapsible = false, size, children, ...rest }, ref) => {\n    const [opened, setOpened] = useState(false);\n\n    return (\n      <Container\n        opened={opened}\n        collapsible={collapsible}\n        size={size}\n        {...rest}\n        ref={ref}\n      >\n        <Content>{children}</Content>\n\n        {collapsible && (\n          <Control>\n            <OpenButton\n              type='ghost'\n              wide='never'\n              onClick={() => setOpened(!opened)}\n            >\n              {opened ? <Up /> : <Down />}\n            </OpenButton>\n          </Control>\n        )}\n      </Container>\n    );\n  }\n);\n\nTagList.displayName = 'TagList';\n\nexport default TagList;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,QAAQ,QAAQ,OAAO;AACnD,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,GAAG,QAAQ,gBAAgB;AACpC,SAASC,IAAI,EAAEC,EAAE,QAAQ,kBAAkB;AAC3C,SAASC,UAAU,QAAkB,mBAAmB;AACxD,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,MAAM,MAAM,WAAW;AAW9B,MAAMC,iBAAiB,GAAIC,CAAC,IAC1BA,CAAC,CAACC,WAAW,IACb,CAACD,CAAC,CAACE,MAAM,IACTT,GAAI;AACN;AACA,cAAcO,CAAC,CAACG,KAAK,CAACC,UAAU,GAAGJ,CAAC,CAACG,KAAK,CAACE,kBAAkB,GAAG,CAAE;AAClE,GAAG;AAKH,MAAMC,SAAS,GAAGd,MAAM,CACtB,KAAK,EACLK,gBAAgB,CAAC,QAAQ,EAAE,aAAa,EAAE,MAAM,CAAC,CACjC;AAClB;AACA;AACA,IAAIE,iBAAkB;AACtB,IAAIH,UAAW;AACf,CAAC;AAED,MAAMW,OAAO,GAAGf,MAAM,CAACgB,GAAI;AAC3B;AACA;AACA;AACA;AACA,YAAaR,CAAC,IAAK,CAACA,CAAC,CAACG,KAAK,CAACM,UAAW,UAAUT,CAAC,IAAK,CAACA,CAAC,CAACG,KAAK,CAACM,UAAW;AAC3E;AACA,cAAeT,CAAC,IAAKA,CAAC,CAACG,KAAK,CAACM,UAAW,UAAUT,CAAC,IAAKA,CAAC,CAACG,KAAK,CAACM,UAAW;AAC3E;AACA,CAAC;AAED,MAAMC,OAAO,GAAGlB,MAAM,CAACgB,GAAI;AAC3B;AACA,CAAC;AAED,MAAMG,UAAU,GAAGnB,MAAM,CAACM,MAAM,CAAE;AAClC;AACA,YAAaE,CAAC,IAAKA,CAAC,CAACG,KAAK,CAACC,UAAU,GAAGJ,CAAC,CAACG,KAAK,CAACE,kBAAkB,GAAG,CAAE;AACvE;AACA,CAAC;;AAED;AACA;AACA;AACA,MAAMO,OAAO,gBAAGtB,UAAU,CACxB,CAAC;EAAEW,WAAW,GAAG,KAAK;EAAEY,IAAI;EAAEC,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,KAAK;EACzD,MAAM,CAACd,MAAM,EAAEe,SAAS,CAAC,GAAG1B,QAAQ,CAAC,KAAK,CAAC;EAE3C,oBACE,oBAAC,SAAS;IACR,MAAM,EAAEW,MAAO;IACf,WAAW,EAAED,WAAY;IACzB,IAAI,EAAEY;EAAK,GACPE,IAAI;IACR,GAAG,EAAEC;EAAI,iBAET,oBAAC,OAAO,QAAEF,QAAQ,CAAW,EAE5Bb,WAAW,iBACV,oBAAC,OAAO,qBACN,oBAAC,UAAU;IACT,IAAI,EAAC,OAAO;IACZ,IAAI,EAAC,OAAO;IACZ,OAAO,EAAE,MAAMgB,SAAS,CAAC,CAACf,MAAM;EAAE,GAEjCA,MAAM,gBAAG,oBAAC,EAAE,OAAG,gBAAG,oBAAC,IAAI,OAAG,CAChB,CAEhB,CACS;AAEhB,CAAC,CACF;AAEDU,OAAO,CAACM,WAAW,GAAG,SAAS;AAE/B,eAAeN,OAAO"}
+{"version":3,"file":"index.js","names":["css","styled","Down","Up","sizeStyles","omitEmotionProps","React","forwardRef","useState","Button","collapsibleStyles","p","collapsible","opened","theme","lineHeight","tagPaddingVertical","Container","Content","div","tagListGap","Control","OpenButton","TagList","size","children","rest","ref","setOpened","createElement","_extends","type","wide","onClick","displayName"],"sources":["../../../src/TagList/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Down, Up } from '@os-design/icons';\nimport { WithSize, sizeStyles } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef, useState } from 'react';\nimport Button from '../Button';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface TagListProps extends JsxDivProps, WithSize {\n  /**\n   * Whether the tag list is collapsible.\n   * @default false\n   */\n  collapsible?: boolean;\n}\n\nconst collapsibleStyles = (p) =>\n  p.collapsible &&\n  !p.opened &&\n  css`\n    // The height of the tag\n    height: ${p.theme.lineHeight + p.theme.tagPaddingVertical * 2}em;\n  `;\n\ninterface ContainerProps extends Pick<TagListProps, 'collapsible' | 'size'> {\n  opened: boolean;\n}\nconst Container = styled(\n  'div',\n  omitEmotionProps('opened', 'collapsible', 'size')\n)<ContainerProps>`\n  display: flex;\n  overflow: hidden;\n  ${collapsibleStyles};\n  ${sizeStyles};\n`;\n\nconst Content = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  flex-grow: 1;\n\n  margin: ${(p) => -p.theme.tagListGap}em 0 0 ${(p) => -p.theme.tagListGap}em;\n  & > * {\n    margin: ${(p) => p.theme.tagListGap}em 0 0 ${(p) => p.theme.tagListGap}em;\n  }\n`;\n\nconst Control = styled.div`\n  margin-left: 0.2em;\n`;\n\nconst OpenButton = styled(Button)`\n  // The height of the tag\n  height: ${(p) => p.theme.lineHeight + p.theme.tagPaddingVertical * 2}em;\n  padding: 0 0.5em;\n`;\n\n/**\n * The component to display a list of tags.\n */\nconst TagList = forwardRef<HTMLDivElement, TagListProps>(\n  ({ collapsible = false, size, children, ...rest }, ref) => {\n    const [opened, setOpened] = useState(false);\n\n    return (\n      <Container\n        opened={opened}\n        collapsible={collapsible}\n        size={size}\n        {...rest}\n        ref={ref}\n      >\n        <Content>{children}</Content>\n\n        {collapsible && (\n          <Control>\n            <OpenButton\n              type='ghost'\n              wide='never'\n              onClick={() => setOpened(!opened)}\n            >\n              {opened ? <Up /> : <Down />}\n            </OpenButton>\n          </Control>\n        )}\n      </Container>\n    );\n  }\n);\n\nTagList.displayName = 'TagList';\n\nexport default TagList;\n"],"mappings":";AAAA,SAASA,GAAG,QAAQ,gBAAgB;AACpC,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,IAAI,EAAEC,EAAE,QAAQ,kBAAkB;AAC3C,SAAmBC,UAAU,QAAQ,mBAAmB;AACxD,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,EAAEC,QAAQ,QAAQ,OAAO;AACnD,OAAOC,MAAM,MAAM,WAAW;AAW9B,MAAMC,iBAAiB,GAAIC,CAAC,IAC1BA,CAAC,CAACC,WAAW,IACb,CAACD,CAAC,CAACE,MAAM,IACTb,GAAI;AACN;AACA,cAAcW,CAAC,CAACG,KAAK,CAACC,UAAU,GAAGJ,CAAC,CAACG,KAAK,CAACE,kBAAkB,GAAG,CAAE;AAClE,GAAG;AAKH,MAAMC,SAAS,GAAGhB,MAAM,CACtB,KAAK,EACLI,gBAAgB,CAAC,QAAQ,EAAE,aAAa,EAAE,MAAM,CAClD,CAAkB;AAClB;AACA;AACA,IAAIK,iBAAkB;AACtB,IAAIN,UAAW;AACf,CAAC;AAED,MAAMc,OAAO,GAAGjB,MAAM,CAACkB,GAAI;AAC3B;AACA;AACA;AACA;AACA,YAAaR,CAAC,IAAK,CAACA,CAAC,CAACG,KAAK,CAACM,UAAW,UAAUT,CAAC,IAAK,CAACA,CAAC,CAACG,KAAK,CAACM,UAAW;AAC3E;AACA,cAAeT,CAAC,IAAKA,CAAC,CAACG,KAAK,CAACM,UAAW,UAAUT,CAAC,IAAKA,CAAC,CAACG,KAAK,CAACM,UAAW;AAC3E;AACA,CAAC;AAED,MAAMC,OAAO,GAAGpB,MAAM,CAACkB,GAAI;AAC3B;AACA,CAAC;AAED,MAAMG,UAAU,GAAGrB,MAAM,CAACQ,MAAM,CAAE;AAClC;AACA,YAAaE,CAAC,IAAKA,CAAC,CAACG,KAAK,CAACC,UAAU,GAAGJ,CAAC,CAACG,KAAK,CAACE,kBAAkB,GAAG,CAAE;AACvE;AACA,CAAC;;AAED;AACA;AACA;AACA,MAAMO,OAAO,gBAAGhB,UAAU,CACxB,CAAC;EAAEK,WAAW,GAAG,KAAK;EAAEY,IAAI;EAAEC,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,KAAK;EACzD,MAAM,CAACd,MAAM,EAAEe,SAAS,CAAC,GAAGpB,QAAQ,CAAC,KAAK,CAAC;EAE3C,oBACEF,KAAA,CAAAuB,aAAA,CAACZ,SAAS,EAAAa,QAAA;IACRjB,MAAM,EAAEA,MAAO;IACfD,WAAW,EAAEA,WAAY;IACzBY,IAAI,EAAEA;EAAK,GACPE,IAAI;IACRC,GAAG,EAAEA;EAAI,iBAETrB,KAAA,CAAAuB,aAAA,CAACX,OAAO,QAAEO,QAAkB,CAAC,EAE5Bb,WAAW,iBACVN,KAAA,CAAAuB,aAAA,CAACR,OAAO,qBACNf,KAAA,CAAAuB,aAAA,CAACP,UAAU;IACTS,IAAI,EAAC,OAAO;IACZC,IAAI,EAAC,OAAO;IACZC,OAAO,EAAEA,CAAA,KAAML,SAAS,CAAC,CAACf,MAAM;EAAE,GAEjCA,MAAM,gBAAGP,KAAA,CAAAuB,aAAA,CAAC1B,EAAE,MAAE,CAAC,gBAAGG,KAAA,CAAAuB,aAAA,CAAC3B,IAAI,MAAE,CAChB,CACL,CAEF,CAAC;AAEhB,CACF,CAAC;AAEDqB,OAAO,CAACW,WAAW,GAAG,SAAS;AAE/B,eAAeX,OAAO"}

package/dist/esm/TagListSkeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","forwardRef","TagList","TagSkeleton","tagIndex","TagListSkeleton","width","tagsCount","rest","ref","Array","fill","map","displayName"],"sources":["../../../src/TagListSkeleton/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport TagList, { TagListProps } from '../TagList';\nimport TagSkeleton from '../TagSkeleton';\n\nexport interface TagListSkeletonProps extends TagListProps {\n  /**\n   * The width of the tag skeleton.\n   * @default undefined\n   */\n  width?: string;\n  /**\n   * The number of tag skeletons.\n   * @default 3\n   */\n  tagsCount?: number;\n}\n\nlet tagIndex = 0;\n\n/**\n * Provides a tag list placeholder while a user waits for the content to load.\n */\nconst TagListSkeleton = forwardRef<HTMLDivElement, TagListSkeletonProps>(\n  ({ width, tagsCount = 3, ...rest }, ref) => (\n    <TagList {...rest} ref={ref}>\n      {Array(tagsCount)\n        .fill({})\n        .map(() => {\n          tagIndex += 1;\n          return <TagSkeleton key={tagIndex} width={width} />;\n        })}\n    </TagList>\n  )\n);\n\nTagListSkeleton.displayName = 'TagListSkeleton';\n\nexport default TagListSkeleton;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,OAAO,MAAwB,YAAY;AAClD,OAAOC,WAAW,MAAM,gBAAgB;AAexC,IAAIC,QAAQ,GAAG,CAAC;;AAEhB;AACA;AACA;AACA,MAAMC,eAAe,gBAAGJ,UAAU,CAChC,CAAC;EAAEK,KAAK;EAAEC,SAAS,GAAG,CAAC;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBACrC,oBAAC,OAAO,eAAKD,IAAI;EAAE,GAAG,EAAEC;AAAI,IACzBC,KAAK,CAACH,SAAS,CAAC,CACdI,IAAI,CAAC,CAAC,CAAC,CAAC,CACRC,GAAG,CAAC,MAAM;EACTR,QAAQ,IAAI,CAAC;EACb,oBAAO,oBAAC,WAAW;IAAC,GAAG,EAAEA,QAAS;IAAC,KAAK,EAAEE;EAAM,EAAG;AACrD,CAAC,CAAC,CAEP,CACF;AAEDD,eAAe,CAACQ,WAAW,GAAG,iBAAiB;AAE/C,eAAeR,eAAe"}
+{"version":3,"file":"index.js","names":["React","forwardRef","TagList","TagSkeleton","tagIndex","TagListSkeleton","width","tagsCount","rest","ref","createElement","_extends","Array","fill","map","key","displayName"],"sources":["../../../src/TagListSkeleton/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport TagList, { TagListProps } from '../TagList';\nimport TagSkeleton from '../TagSkeleton';\n\nexport interface TagListSkeletonProps extends TagListProps {\n  /**\n   * The width of the tag skeleton.\n   * @default undefined\n   */\n  width?: string;\n  /**\n   * The number of tag skeletons.\n   * @default 3\n   */\n  tagsCount?: number;\n}\n\nlet tagIndex = 0;\n\n/**\n * Provides a tag list placeholder while a user waits for the content to load.\n */\nconst TagListSkeleton = forwardRef<HTMLDivElement, TagListSkeletonProps>(\n  ({ width, tagsCount = 3, ...rest }, ref) => (\n    <TagList {...rest} ref={ref}>\n      {Array(tagsCount)\n        .fill({})\n        .map(() => {\n          tagIndex += 1;\n          return <TagSkeleton key={tagIndex} width={width} />;\n        })}\n    </TagList>\n  )\n);\n\nTagListSkeleton.displayName = 'TagListSkeleton';\n\nexport default TagListSkeleton;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,OAAO,MAAwB,YAAY;AAClD,OAAOC,WAAW,MAAM,gBAAgB;AAexC,IAAIC,QAAQ,GAAG,CAAC;;AAEhB;AACA;AACA;AACA,MAAMC,eAAe,gBAAGJ,UAAU,CAChC,CAAC;EAAEK,KAAK;EAAEC,SAAS,GAAG,CAAC;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBACrCT,KAAA,CAAAU,aAAA,CAACR,OAAO,EAAAS,QAAA,KAAKH,IAAI;EAAEC,GAAG,EAAEA;AAAI,IACzBG,KAAK,CAACL,SAAS,CAAC,CACdM,IAAI,CAAC,CAAC,CAAC,CAAC,CACRC,GAAG,CAAC,MAAM;EACTV,QAAQ,IAAI,CAAC;EACb,oBAAOJ,KAAA,CAAAU,aAAA,CAACP,WAAW;IAACY,GAAG,EAAEX,QAAS;IAACE,KAAK,EAAEA;EAAM,CAAE,CAAC;AACrD,CAAC,CACI,CAEb,CAAC;AAEDD,eAAe,CAACW,WAAW,GAAG,iBAAiB;AAE/C,eAAeX,eAAe"}

package/dist/esm/TagSkeleton/index.js

@@ -1,8 +1,8 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import styled from '@emotion/styled';
-import React, { forwardRef } from 'react';
 import { sizeStyles } from '@os-design/styles';
 import { omitEmotionProps } from '@os-design/utils';
+import React, { forwardRef } from 'react';
 import Skeleton from '../Skeleton';
 const StyledTagSkeleton = styled(Skeleton, omitEmotionProps('width', 'size'))`
   width: ${p => p.width};

package/dist/esm/TagSkeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["styled","React","forwardRef","sizeStyles","omitEmotionProps","Skeleton","StyledTagSkeleton","p","width","theme","lineHeight","tagPaddingVertical","TagSkeleton","rest","ref","displayName"],"sources":["../../../src/TagSkeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport React, { forwardRef } from 'react';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport Skeleton, { SkeletonProps } from '../Skeleton';\n\nexport interface TagSkeletonProps\n  extends Omit<SkeletonProps, 'width'>,\n    WithSize {\n  /**\n   * The width of the skeleton.\n   * @default 6em\n   */\n  width?: string;\n}\n\ntype StyledTagSkeletonProps = Pick<TagSkeletonProps, 'width' | 'size'>;\nconst StyledTagSkeleton = styled(\n  Skeleton,\n  omitEmotionProps('width', 'size')\n)<StyledTagSkeletonProps>`\n  width: ${(p) => p.width};\n  height: ${(p) => p.theme.lineHeight + p.theme.tagPaddingVertical * 2}em;\n  ${sizeStyles};\n`;\n\n/**\n * Provides a tag placeholder while a user waits for the content to load.\n */\nconst TagSkeleton = forwardRef<HTMLDivElement, TagSkeletonProps>(\n  ({ width = '6em', ...rest }, ref) => (\n    <StyledTagSkeleton width={width} {...rest} ref={ref} />\n  )\n);\n\nTagSkeleton.displayName = 'TagSkeleton';\n\nexport default TagSkeleton;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,UAAU,QAAkB,mBAAmB;AACxD,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,QAAQ,MAAyB,aAAa;AAarD,MAAMC,iBAAiB,GAAGN,MAAM,CAC9BK,QAAQ,EACRD,gBAAgB,CAAC,OAAO,EAAE,MAAM,CAAC,CACT;AAC1B,WAAYG,CAAC,IAAKA,CAAC,CAACC,KAAM;AAC1B,YAAaD,CAAC,IAAKA,CAAC,CAACE,KAAK,CAACC,UAAU,GAAGH,CAAC,CAACE,KAAK,CAACE,kBAAkB,GAAG,CAAE;AACvE,IAAIR,UAAW;AACf,CAAC;;AAED;AACA;AACA;AACA,MAAMS,WAAW,gBAAGV,UAAU,CAC5B,CAAC;EAAEM,KAAK,GAAG,KAAK;EAAE,GAAGK;AAAK,CAAC,EAAEC,GAAG,kBAC9B,oBAAC,iBAAiB;EAAC,KAAK,EAAEN;AAAM,GAAKK,IAAI;EAAE,GAAG,EAAEC;AAAI,GACrD,CACF;AAEDF,WAAW,CAACG,WAAW,GAAG,aAAa;AAEvC,eAAeH,WAAW"}
+{"version":3,"file":"index.js","names":["styled","sizeStyles","omitEmotionProps","React","forwardRef","Skeleton","StyledTagSkeleton","p","width","theme","lineHeight","tagPaddingVertical","TagSkeleton","rest","ref","createElement","_extends","displayName"],"sources":["../../../src/TagSkeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\n\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\nimport Skeleton, { SkeletonProps } from '../Skeleton';\n\nexport interface TagSkeletonProps\n  extends Omit<SkeletonProps, 'width'>,\n    WithSize {\n  /**\n   * The width of the skeleton.\n   * @default 6em\n   */\n  width?: string;\n}\n\ntype StyledTagSkeletonProps = Pick<TagSkeletonProps, 'width' | 'size'>;\nconst StyledTagSkeleton = styled(\n  Skeleton,\n  omitEmotionProps('width', 'size')\n)<StyledTagSkeletonProps>`\n  width: ${(p) => p.width};\n  height: ${(p) => p.theme.lineHeight + p.theme.tagPaddingVertical * 2}em;\n  ${sizeStyles};\n`;\n\n/**\n * Provides a tag placeholder while a user waits for the content to load.\n */\nconst TagSkeleton = forwardRef<HTMLDivElement, TagSkeletonProps>(\n  ({ width = '6em', ...rest }, ref) => (\n    <StyledTagSkeleton width={width} {...rest} ref={ref} />\n  )\n);\n\nTagSkeleton.displayName = 'TagSkeleton';\n\nexport default TagSkeleton;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AAEpC,SAASC,UAAU,QAAkB,mBAAmB;AACxD,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AAEzC,OAAOC,QAAQ,MAAyB,aAAa;AAarD,MAAMC,iBAAiB,GAAGN,MAAM,CAC9BK,QAAQ,EACRH,gBAAgB,CAAC,OAAO,EAAE,MAAM,CAClC,CAA0B;AAC1B,WAAYK,CAAC,IAAKA,CAAC,CAACC,KAAM;AAC1B,YAAaD,CAAC,IAAKA,CAAC,CAACE,KAAK,CAACC,UAAU,GAAGH,CAAC,CAACE,KAAK,CAACE,kBAAkB,GAAG,CAAE;AACvE,IAAIV,UAAW;AACf,CAAC;;AAED;AACA;AACA;AACA,MAAMW,WAAW,gBAAGR,UAAU,CAC5B,CAAC;EAAEI,KAAK,GAAG,KAAK;EAAE,GAAGK;AAAK,CAAC,EAAEC,GAAG,kBAC9BX,KAAA,CAAAY,aAAA,CAACT,iBAAiB,EAAAU,QAAA;EAACR,KAAK,EAAEA;AAAM,GAAKK,IAAI;EAAEC,GAAG,EAAEA;AAAI,EAAE,CAE1D,CAAC;AAEDF,WAAW,CAACK,WAAW,GAAG,aAAa;AAEvC,eAAeL,WAAW"}

package/dist/esm/TextArea/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["css","styled","Loading","clr","ThemeOverrider","omitEmotionProps","useForwardedRef","React","forwardRef","useCallback","useMemo","InputContainer","StyledInput","getFocusableElements","TextAreaContainer","p","theme","textAreaHeight","TextAreaField","withComponent","textAreaPaddingVertical","lineHeight","Addon","inputColorPlaceholder","LeftAddon","inputAddonPaddingHorizontal","hasPadding","inputPaddingHorizontal","RightAddon","TextArea","left","leftHasPadding","right","rightHasPadding","disabled","loading","containerRef","containerProps","size","value","onChange","rest","ref","innerContainerRef","mergedContainerRef","rightValue","rightHasPaddingValue","onFocus","e","target","current","focusableElements","focus","onKeyDown","document","inputFocusableElements","firstInputElementIsFocused","activeElement","key","shiftKey","inputContainerIndex","findIndex","el","elementBeforeInputContainer","buttonPaddingHorizontal","displayName"],"sources":["../../../src/TextArea/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Loading } from '@os-design/icons';\nimport { WithSize } from '@os-design/styles';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { omitEmotionProps, useForwardedRef } from '@os-design/utils';\nimport React, {\n  ChangeEvent,\n  FocusEventHandler,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEventHandler,\n  useCallback,\n  useMemo,\n} from 'react';\nimport { InputContainer, StyledInput } from '../Input';\nimport getFocusableElements from '../Input/utils/getFocusableElements';\n\ntype JsxTextAreaProps = Omit<\n  JSX.IntrinsicElements['textarea'],\n  'value' | 'onChange' | 'ref'\n>;\nexport interface TextAreaProps extends JsxTextAreaProps, WithSize {\n  /**\n   * The component located on the left side.\n   * @default undefined\n   */\n  left?: React.ReactNode;\n  /**\n   * Adds padding to the left component.\n   * It can be useful when passing an icon or text in the left component.\n   * @default false\n   */\n  leftHasPadding?: boolean;\n  /**\n   * The component located on the right side.\n   * @default undefined\n   */\n  right?: React.ReactNode;\n  /**\n   * Adds padding to the right component.\n   * It can be useful when passing an icon or text in the right component.\n   * @default false\n   */\n  rightHasPadding?: boolean;\n  /**\n   * Whether the textarea is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Shows the loading status.\n   * @default false\n   */\n  loading?: boolean;\n  /**\n   * The ref of the textarea container.\n   * @default undefined\n   */\n  containerRef?: ForwardedRef<HTMLDivElement>;\n  /**\n   * The props of the textarea container.\n   * @default undefined\n   */\n  containerProps?: JSX.IntrinsicElements['div'];\n  /**\n   * The textarea value.\n   * @default undefined\n   */\n  value?: string;\n  /**\n   * The change event handler.\n   * @default undefined\n   */\n  onChange?: (value: string, e: ChangeEvent<HTMLTextAreaElement>) => void;\n}\n\nconst TextAreaContainer = styled(InputContainer)`\n  height: ${(p) => p.theme.textAreaHeight}em;\n`;\n\nconst TextAreaField = styled(StyledInput.withComponent('textarea'))`\n  padding-top: ${(p) => p.theme.textAreaPaddingVertical}em;\n  padding-bottom: ${(p) => p.theme.textAreaPaddingVertical}em;\n  line-height: ${(p) => p.theme.lineHeight};\n  resize: none;\n`;\n\ninterface AddonProps {\n  hasPadding: boolean;\n}\nconst Addon = styled('span', omitEmotionProps('hasPadding'))<AddonProps>`\n  display: flex;\n  align-items: center;\n  user-select: none;\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n\n  svg {\n    transform: scale(1.2);\n  }\n`;\n\nconst LeftAddon = styled(Addon)`\n  padding-right: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-left: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nconst RightAddon = styled(Addon)`\n  padding-left: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-right: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\n/**\n * The multiline input component.\n */\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  (\n    {\n      left,\n      leftHasPadding = false,\n      right,\n      rightHasPadding = false,\n      disabled = false,\n      loading = false,\n      containerRef,\n      containerProps = {},\n      size,\n      value,\n      onChange = () => {},\n      ...rest\n    },\n    ref\n  ) => {\n    const [innerContainerRef, mergedContainerRef] =\n      useForwardedRef(containerRef);\n\n    const rightValue = useMemo(\n      () => (loading ? <Loading /> : right),\n      [loading, right]\n    );\n\n    const rightHasPaddingValue = useMemo(\n      () => (loading ? true : rightHasPadding),\n      [loading, rightHasPadding]\n    );\n\n    const onFocus = useCallback<FocusEventHandler>(\n      (e) => {\n        // Focus the next element if the container element was focused.\n        // The next element will be the input or button in the addon.\n        if (disabled || e.target !== innerContainerRef.current) return;\n        const focusableElements = getFocusableElements(\n          innerContainerRef.current\n        );\n        focusableElements[0].focus();\n      },\n      [disabled, innerContainerRef]\n    );\n\n    const onKeyDown = useCallback<KeyboardEventHandler>(\n      (e) => {\n        // Focus the previous element if the first element in the input\n        // container is focused and the Shift + Tab combination is pressed.\n        const focusableElements = getFocusableElements(document);\n        const inputFocusableElements = innerContainerRef.current\n          ? getFocusableElements(innerContainerRef.current)\n          : [];\n        const firstInputElementIsFocused =\n          inputFocusableElements[0] === document.activeElement;\n        if (firstInputElementIsFocused && e.key === 'Tab' && e.shiftKey) {\n          const inputContainerIndex = focusableElements.findIndex(\n            (el) => el === innerContainerRef.current\n          );\n          if (inputContainerIndex === 0) return;\n          const elementBeforeInputContainer =\n            focusableElements[inputContainerIndex - 1];\n          elementBeforeInputContainer.focus();\n        }\n      },\n      [innerContainerRef]\n    );\n\n    return (\n      <TextAreaContainer\n        disabled={disabled}\n        size={size}\n        tabIndex={!disabled ? 0 : -1}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n        ref={mergedContainerRef}\n        {...containerProps}\n      >\n        {left && (\n          <ThemeOverrider overrides={{ buttonPaddingHorizontal: 0.8 }}>\n            <LeftAddon hasPadding={leftHasPadding}>{left}</LeftAddon>\n          </ThemeOverrider>\n        )}\n\n        <TextAreaField\n          disabled={disabled}\n          hasLeft={!!left}\n          hasRight={!!right}\n          value={value || ''}\n          onChange={(e) => onChange(e.target.value, e)}\n          {...rest}\n          ref={ref}\n        />\n\n        {rightValue && (\n          <ThemeOverrider overrides={{ buttonPaddingHorizontal: 0.8 }}>\n            <RightAddon hasPadding={rightHasPaddingValue}>\n              {rightValue}\n            </RightAddon>\n          </ThemeOverrider>\n        )}\n      </TextAreaContainer>\n    );\n  }\n);\n\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["css","styled","Loading","clr","ThemeOverrider","omitEmotionProps","useForwardedRef","React","forwardRef","useCallback","useMemo","InputContainer","StyledInput","getFocusableElements","TextAreaContainer","p","theme","textAreaHeight","TextAreaField","withComponent","textAreaPaddingVertical","lineHeight","Addon","inputColorPlaceholder","LeftAddon","inputAddonPaddingHorizontal","hasPadding","inputPaddingHorizontal","RightAddon","TextArea","left","leftHasPadding","right","rightHasPadding","disabled","loading","containerRef","containerProps","size","value","onChange","rest","ref","innerContainerRef","mergedContainerRef","rightValue","createElement","rightHasPaddingValue","onFocus","e","target","current","focusableElements","focus","onKeyDown","document","inputFocusableElements","firstInputElementIsFocused","activeElement","key","shiftKey","inputContainerIndex","findIndex","el","elementBeforeInputContainer","_extends","tabIndex","overrides","buttonPaddingHorizontal","hasLeft","hasRight","displayName"],"sources":["../../../src/TextArea/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Loading } from '@os-design/icons';\nimport { WithSize } from '@os-design/styles';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { omitEmotionProps, useForwardedRef } from '@os-design/utils';\nimport React, {\n  ChangeEvent,\n  FocusEventHandler,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEventHandler,\n  useCallback,\n  useMemo,\n} from 'react';\nimport { InputContainer, StyledInput } from '../Input';\nimport getFocusableElements from '../Input/utils/getFocusableElements';\n\ntype JsxTextAreaProps = Omit<\n  JSX.IntrinsicElements['textarea'],\n  'value' | 'onChange' | 'ref'\n>;\nexport interface TextAreaProps extends JsxTextAreaProps, WithSize {\n  /**\n   * The component located on the left side.\n   * @default undefined\n   */\n  left?: React.ReactNode;\n  /**\n   * Adds padding to the left component.\n   * It can be useful when passing an icon or text in the left component.\n   * @default false\n   */\n  leftHasPadding?: boolean;\n  /**\n   * The component located on the right side.\n   * @default undefined\n   */\n  right?: React.ReactNode;\n  /**\n   * Adds padding to the right component.\n   * It can be useful when passing an icon or text in the right component.\n   * @default false\n   */\n  rightHasPadding?: boolean;\n  /**\n   * Whether the textarea is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Shows the loading status.\n   * @default false\n   */\n  loading?: boolean;\n  /**\n   * The ref of the textarea container.\n   * @default undefined\n   */\n  containerRef?: ForwardedRef<HTMLDivElement>;\n  /**\n   * The props of the textarea container.\n   * @default undefined\n   */\n  containerProps?: JSX.IntrinsicElements['div'];\n  /**\n   * The textarea value.\n   * @default undefined\n   */\n  value?: string;\n  /**\n   * The change event handler.\n   * @default undefined\n   */\n  onChange?: (value: string, e: ChangeEvent<HTMLTextAreaElement>) => void;\n}\n\nconst TextAreaContainer = styled(InputContainer)`\n  height: ${(p) => p.theme.textAreaHeight}em;\n`;\n\nconst TextAreaField = styled(StyledInput.withComponent('textarea'))`\n  padding-top: ${(p) => p.theme.textAreaPaddingVertical}em;\n  padding-bottom: ${(p) => p.theme.textAreaPaddingVertical}em;\n  line-height: ${(p) => p.theme.lineHeight};\n  resize: none;\n`;\n\ninterface AddonProps {\n  hasPadding: boolean;\n}\nconst Addon = styled('span', omitEmotionProps('hasPadding'))<AddonProps>`\n  display: flex;\n  align-items: center;\n  user-select: none;\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n\n  svg {\n    transform: scale(1.2);\n  }\n`;\n\nconst LeftAddon = styled(Addon)`\n  padding-right: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-left: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nconst RightAddon = styled(Addon)`\n  padding-left: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-right: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\n/**\n * The multiline input component.\n */\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  (\n    {\n      left,\n      leftHasPadding = false,\n      right,\n      rightHasPadding = false,\n      disabled = false,\n      loading = false,\n      containerRef,\n      containerProps = {},\n      size,\n      value,\n      onChange = () => {},\n      ...rest\n    },\n    ref\n  ) => {\n    const [innerContainerRef, mergedContainerRef] =\n      useForwardedRef(containerRef);\n\n    const rightValue = useMemo(\n      () => (loading ? <Loading /> : right),\n      [loading, right]\n    );\n\n    const rightHasPaddingValue = useMemo(\n      () => (loading ? true : rightHasPadding),\n      [loading, rightHasPadding]\n    );\n\n    const onFocus = useCallback<FocusEventHandler>(\n      (e) => {\n        // Focus the next element if the container element was focused.\n        // The next element will be the input or button in the addon.\n        if (disabled || e.target !== innerContainerRef.current) return;\n        const focusableElements = getFocusableElements(\n          innerContainerRef.current\n        );\n        focusableElements[0].focus();\n      },\n      [disabled, innerContainerRef]\n    );\n\n    const onKeyDown = useCallback<KeyboardEventHandler>(\n      (e) => {\n        // Focus the previous element if the first element in the input\n        // container is focused and the Shift + Tab combination is pressed.\n        const focusableElements = getFocusableElements(document);\n        const inputFocusableElements = innerContainerRef.current\n          ? getFocusableElements(innerContainerRef.current)\n          : [];\n        const firstInputElementIsFocused =\n          inputFocusableElements[0] === document.activeElement;\n        if (firstInputElementIsFocused && e.key === 'Tab' && e.shiftKey) {\n          const inputContainerIndex = focusableElements.findIndex(\n            (el) => el === innerContainerRef.current\n          );\n          if (inputContainerIndex === 0) return;\n          const elementBeforeInputContainer =\n            focusableElements[inputContainerIndex - 1];\n          elementBeforeInputContainer.focus();\n        }\n      },\n      [innerContainerRef]\n    );\n\n    return (\n      <TextAreaContainer\n        disabled={disabled}\n        size={size}\n        tabIndex={!disabled ? 0 : -1}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n        ref={mergedContainerRef}\n        {...containerProps}\n      >\n        {left && (\n          <ThemeOverrider overrides={{ buttonPaddingHorizontal: 0.8 }}>\n            <LeftAddon hasPadding={leftHasPadding}>{left}</LeftAddon>\n          </ThemeOverrider>\n        )}\n\n        <TextAreaField\n          disabled={disabled}\n          hasLeft={!!left}\n          hasRight={!!right}\n          value={value || ''}\n          onChange={(e) => onChange(e.target.value, e)}\n          {...rest}\n          ref={ref}\n        />\n\n        {rightValue && (\n          <ThemeOverrider overrides={{ buttonPaddingHorizontal: 0.8 }}>\n            <RightAddon hasPadding={rightHasPaddingValue}>\n              {rightValue}\n            </RightAddon>\n          </ThemeOverrider>\n        )}\n      </TextAreaContainer>\n    );\n  }\n);\n\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"mappings":"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"}