tdesign-react 0.17.0 → 0.18.2

package/es/select/base/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../src/select/base/Select.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, Ref, ReactElement } from 'react';\nimport classNames from 'classnames';\nimport { isFunction, get, isString } from 'lodash';\n\nimport { LoadingIcon, CloseCircleFilledIcon } from 'tdesign-icons-react';\nimport { useLocaleReceiver } from '../../locale/LocalReceiver';\nimport useConfig from '../../_util/useConfig';\nimport composeRefs from '../../_util/composeRefs';\nimport useDefaultValue from '../../_util/useDefaultValue';\nimport forwardRefWithStatics from '../../_util/forwardRefWithStatics';\nimport { getLabel, getMultipleTags, getSelectValueArr } from '../util/helper';\nimport noop from '../../_util/noop';\n\nimport FakeArrow from '../../common/FakeArrow';\nimport Input from '../../input';\nimport Popup from '../../popup';\nimport Tag from '../../tag';\nimport Option from './Option';\nimport OptionGroup from './OptionGroup';\nimport PopupContent from './PopupContent';\n\nimport { TdSelectProps, SelectValue, Options } from '../../_type/components/select';\nimport { StyledProps } from '../../_type';\n\nconst MAX_OVERLAY_WIDTH = 500;\n\nexport interface SelectProps extends TdSelectProps, StyledProps {\n  // 子节点\n  children?: React.ReactNode;\n}\n\nconst Select = forwardRefWithStatics(\n  (props: SelectProps, ref: Ref<HTMLDivElement>) => {\n    // 国际化文本初始化\n    const [local, t] = useLocaleReceiver('select');\n    const emptyText = t(local.loadingText);\n\n    const {\n      bordered = true,\n      creatable,\n      filter,\n      loadingText = emptyText,\n      max = 0,\n      popupProps,\n      reserveKeyword,\n      value,\n      className,\n      style,\n      disabled,\n      size,\n      multiple,\n      placeholder,\n      clearable,\n      prefixIcon,\n      options,\n      filterable,\n      loading,\n      onFocus,\n      onBlur,\n      onClear = noop,\n      onCreate,\n      onRemove,\n      onSearch,\n      onChange,\n      empty,\n      valueType = 'value',\n      keys,\n      children,\n    } = useDefaultValue(props);\n\n    const { classPrefix } = useConfig();\n\n    const name = `${classPrefix}-select`; // t-select\n\n    let selectedLabel = '';\n\n    const [showPopup, setShowPopup] = useState(false);\n    const [isHover, toggleHover] = useState(false);\n    const [inputVal, setInputVal] = useState<string>(undefined);\n    const [currentOptions, setCurrentOptions] = useState([]);\n    const [width, setWidth] = useState(0);\n\n    if (value) {\n      selectedLabel = getLabel(children, value, currentOptions);\n    }\n\n    const selectRef = useRef(null);\n    const overlayRef = useRef(null);\n\n    // 计算Select的宽高\n    useEffect(() => {\n      if (showPopup && selectRef && selectRef.current) {\n        const domRect = selectRef.current.getBoundingClientRect();\n        const overlayRect = overlayRef?.current?.getContentRef?.getBoundingClientRect?.();\n\n        // 获取overlay的内容的宽度进行比较 如果比select本身宽，则优先使用overlay内容宽度，减少text被省略展示的情况\n        const width =\n          domRect.width > MAX_OVERLAY_WIDTH\n            ? domRect.width\n            : Math.min(MAX_OVERLAY_WIDTH, Math.max(domRect.width, overlayRect?.width));\n\n        setWidth(width);\n      }\n    }, [showPopup]);\n\n    // 处理设置option的逻辑\n    useEffect(() => {\n      if (keys) {\n        // 如果有定制keys 先做转换\n        const transformedOptions = options.map((option) => ({\n          ...option,\n          value: get(option, keys?.value || 'value'),\n          label: get(option, keys?.label || 'label'),\n        }));\n        setCurrentOptions(transformedOptions);\n      } else if (children && Array.isArray(children)) {\n        const optionFromChild = children.reduce(\n          (acc, item: ReactElement) =>\n            acc.concat({ value: item.props.value, label: item.props.label || item.props.children }),\n          [],\n        );\n        setCurrentOptions(optionFromChild);\n      } else {\n        setCurrentOptions(options);\n      }\n    }, [options, keys, children]);\n\n    // handle click outside\n    useEffect(() => {\n      const listener = (event: MouseEvent | TouchEvent) => {\n        if (!selectRef.current || selectRef.current.contains(event.target)) {\n          return;\n        }\n        if (showPopup) {\n          setShowPopup(false);\n        }\n        if (!showPopup) {\n          toggleHover(false);\n        }\n      };\n      document.addEventListener('click', listener);\n      return () => {\n        document.removeEventListener('click', listener);\n      };\n    }, [showPopup]);\n\n    // 移除 Tag\n    const removeTag = (\n      event: React.MouseEvent,\n      selectValue: SelectValue,\n      tagData: {\n        label?: string;\n        value?: string | number;\n      },\n    ) => {\n      event.stopPropagation();\n      const values = getSelectValueArr(value, selectValue, '', true, valueType);\n      onChange(values);\n      if (isFunction(onRemove)) {\n        onRemove({ value: tagData.value, data: tagData, e: event as React.MouseEvent<HTMLDivElement, MouseEvent> });\n      }\n    };\n\n    // 选中 Popup 某项\n    const handleChange = (value: string | number, { label }: { label: string }) => {\n      if (multiple) {\n        onChange(value);\n      } else {\n        const selectVal = valueType === 'object' ? { label, value } : value;\n        onChange(selectVal);\n      }\n      if (filterable) {\n        setInputVal(!multiple || (reserveKeyword && multiple) ? label : '');\n      }\n      if (creatable && isFunction(onCreate)) {\n        if (options.filter((option) => option.value === value).length === 0) {\n          onCreate(value);\n        }\n      }\n    };\n\n    // 处理filter逻辑\n    const handleFilter = (value: string) => {\n      let filteredOptions: Options[];\n      if (value.length === 0) {\n        setCurrentOptions(options);\n        return;\n      }\n\n      if (filter && isFunction(filter)) {\n        // 如果有自定义的filter方法 使用自定义的filter方法\n        filteredOptions = Array.isArray(options) && options.filter((option) => filter(value, option));\n      } else {\n        const filterRegExp = new RegExp(value, 'i');\n        filteredOptions = Array.isArray(options) && options.filter((option) => filterRegExp.test(option?.label)); // 不区分大小写\n      }\n\n      if (creatable) {\n        filteredOptions = filteredOptions.concat([{ label: value, value }]);\n      }\n      setCurrentOptions(filteredOptions);\n    };\n\n    // 处理输入框逻辑\n    const handleInputChange = (value: string) => {\n      setInputVal(value);\n\n      if (isFunction(onSearch)) {\n        onSearch(value);\n        return;\n      }\n\n      handleFilter(value);\n    };\n\n    const defaultLabel = (\n      <span\n        className={classNames(\n          className,\n          { [`${name}-placeholder`]: !value || (Array.isArray(value) && value.length < 1) },\n          {\n            [`${name}-selectedSingle`]: selectedLabel,\n          },\n        )}\n      >\n        {selectedLabel || placeholder || '-请选择-'}\n      </span>\n    );\n\n    const renderMultipleTags = () => {\n      if (multiple && Array.isArray(value) && value.length > 0) {\n        let tags: Options[];\n        let optionValue = [];\n        if (valueType === 'value') {\n          optionValue = currentOptions.filter((option) => value.includes(option.value));\n\n          tags = getMultipleTags(optionValue);\n        } else {\n          tags = getMultipleTags(value);\n        }\n        if (tags.length > 0)\n          return tags.map((item) => (\n            <Tag\n              closable={!disabled}\n              key={item.value}\n              onClose={({ e }) => removeTag(e, item.value, item)}\n              disabled={disabled}\n            >\n              {item.label}\n            </Tag>\n          ));\n        return !filterable ? defaultLabel : null;\n      }\n      return !filterable ? defaultLabel : null;\n    };\n\n    const renderInput = () => {\n      const isEmpty = !value || (Array.isArray(value) && value.length === 0);\n      return (\n        <Input\n          value={isString(inputVal) ? inputVal : selectedLabel}\n          placeholder={isEmpty ? placeholder || '-请选择-' : undefined}\n          className={`${name}-input`}\n          onChange={handleInputChange}\n          onFocus={(v, context) => isFunction(onFocus) && onFocus({ value, e: context?.e })}\n          onBlur={(v, context) => isFunction(onBlur) && onBlur({ value, e: context?.e })}\n        />\n      );\n    };\n\n    const onInputClick = (e: React.MouseEvent) => {\n      e.preventDefault();\n      if (!disabled) {\n        setShowPopup(!showPopup);\n      }\n    };\n\n    const onClearValue = (event: React.MouseEvent) => {\n      event.stopPropagation();\n      if (Array.isArray(value)) {\n        onChange([]);\n      } else {\n        onChange('');\n      }\n      // Icon组件目前的ref\n      onClear({ e: event as React.MouseEvent<HTMLDivElement, MouseEvent> });\n    };\n\n    // 渲染后置图标\n    const renderSuffixIcon = () => {\n      if (loading) {\n        return <LoadingIcon className={classNames(className, `${name}-right-icon`)} />;\n      }\n      if (clearable && value && isHover) {\n        return (\n          <CloseCircleFilledIcon\n            onClick={clearable ? onClearValue : undefined}\n            className={classNames(className, `${name}-right-icon`, `${name}-right-icon__clear`)}\n          />\n        );\n      }\n      return <FakeArrow overlayClassName={`${name}-right-icon`} isActive={showPopup} disabled={disabled} />;\n    };\n\n    const popupContentProps = {\n      onChange: handleChange,\n      value,\n      className,\n      size,\n      multiple,\n      showPopup,\n      setShowPopup,\n      options: currentOptions,\n      empty,\n      max,\n      loadingText,\n      loading,\n      valueType,\n    };\n\n    const renderContent = () => <PopupContent {...popupContentProps}>{children}</PopupContent>;\n\n    const selectDropdownClass = classNames(className, `${name}-dropdown`, `${classPrefix}-popup`, 'narrow-scrollbar');\n\n    const overlayStyle = {\n      width: width ? `${width}px` : 'none',\n    };\n\n    return (\n      <div\n        className={`${name}-wrap`}\n        style={{ ...style }}\n        onMouseEnter={() => toggleHover(true)}\n        onMouseLeave={() => toggleHover(false)}\n      >\n        <Popup\n          content={renderContent()}\n          placement=\"bottom-left\"\n          visible={showPopup}\n          overlayStyle={overlayStyle}\n          overlayClassName={selectDropdownClass}\n          destroyOnClose\n          className={`${name}-popup-reference`}\n          {...popupProps}\n          ref={overlayRef}\n        >\n          <div\n            className={classNames(className, name, {\n              [`${classPrefix}-is-disabled`]: disabled,\n              [`${classPrefix}-is-active`]: showPopup,\n              [`${classPrefix}-size-s`]: size === 'small',\n              [`${classPrefix}-size-l`]: size === 'large',\n              [`${classPrefix}-no-border`]: !bordered,\n              [`${classPrefix}-has-prefix`]: !!prefixIcon,\n            })}\n            ref={composeRefs(selectRef, ref)}\n            style={{ userSelect: 'none' }}\n            onClick={onInputClick}\n          >\n            {<span className={`${name}-left-icon`}>{prefixIcon}</span>}\n            {multiple && renderMultipleTags()}\n            {filterable && renderInput()}\n            {!multiple && !filterable && defaultLabel}\n            {renderSuffixIcon()}\n          </div>\n        </Popup>\n      </div>\n    );\n  },\n  {\n    displayName: 'Select',\n    Option,\n    OptionGroup,\n  },\n);\n\nexport default Select;\n"],"names":["MAX_OVERLAY_WIDTH","Select","forwardRefWithStatics","props","ref","useLocaleReceiver","local","t","emptyText","loadingText","useDefaultValue","bordered","creatable","filter","max","popupProps","reserveKeyword","value","className","style","disabled","size","multiple","placeholder","clearable","prefixIcon","options","filterable","loading","onFocus","onBlur","onClear","noop","onCreate","onRemove","onSearch","onChange","empty","valueType","keys","children","useConfig","classPrefix","name","selectedLabel","useState","showPopup","setShowPopup","isHover","toggleHover","inputVal","setInputVal","currentOptions","setCurrentOptions","width","setWidth","getLabel","selectRef","useRef","overlayRef","current","domRect","getBoundingClientRect","overlayRect","getContentRef","width2","Math","min","transformedOptions","map","option","get","label","Array","isArray","optionFromChild","reduce","acc","item","concat","listener","event","contains","target","addEventListener","removeEventListener","removeTag","selectValue","tagData","stopPropagation","values","getSelectValueArr","isFunction","data","e","handleChange","value2","selectVal","length","handleFilter","filteredOptions","filterRegExp","RegExp","test","handleInputChange","defaultLabel","classNames","renderMultipleTags","tags","optionValue","includes","getMultipleTags","Tag","closable","key","onClose","renderInput","isEmpty","Input","isString","v","context","onInputClick","preventDefault","onClearValue","renderSuffixIcon","LoadingIcon","CloseCircleFilledIcon","onClick","FakeArrow","overlayClassName","isActive","popupContentProps","renderContent","PopupContent","selectDropdownClass","overlayStyle","onMouseEnter","onMouseLeave","Popup","content","placement","visible","destroyOnClose","composeRefs","userSelect","displayName","Option","OptionGroup"],"mappings":"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"}
+{"version":3,"file":"Select.js","sources":["../../../src/select/base/Select.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, Ref, ReactElement } from 'react';\nimport { CloseCircleFilledIcon } from 'tdesign-icons-react';\nimport classNames from 'classnames';\nimport isFunction from 'lodash/isFunction';\nimport get from 'lodash/get';\nimport isString from 'lodash/isString';\n\nimport { useLocaleReceiver } from '../../locale/LocalReceiver';\nimport useConfig from '../../_util/useConfig';\nimport composeRefs from '../../_util/composeRefs';\nimport useDefaultValue from '../../_util/useDefaultValue';\nimport forwardRefWithStatics from '../../_util/forwardRefWithStatics';\nimport { getLabel, getMultipleTags, getSelectValueArr } from '../util/helper';\nimport noop from '../../_util/noop';\n\nimport FakeArrow from '../../common/FakeArrow';\nimport Loading from '../../loading';\nimport Input from '../../input';\nimport Popup from '../../popup';\nimport Tag from '../../tag';\nimport Option, { SelectOptionProps } from './Option';\nimport OptionGroup from './OptionGroup';\nimport PopupContent from './PopupContent';\n\nimport { TdSelectProps, SelectValue, TdOptionProps } from '../../_type/components/select';\nimport { StyledProps } from '../../_type';\n\nconst MAX_OVERLAY_WIDTH = 500;\n\nexport interface SelectProps extends TdSelectProps, StyledProps {\n  // 子节点\n  children?: React.ReactNode;\n}\n\ntype OptionsType = TdOptionProps[];\n\nconst Select = forwardRefWithStatics(\n  (props: SelectProps, ref: Ref<HTMLDivElement>) => {\n    // 国际化文本初始化\n    const [local, t] = useLocaleReceiver('select');\n    const emptyText = t(local.loadingText);\n\n    const {\n      bordered = true,\n      creatable,\n      filter,\n      loadingText = emptyText,\n      max = 0,\n      popupProps,\n      reserveKeyword,\n      value,\n      className,\n      style,\n      disabled,\n      size,\n      multiple,\n      placeholder,\n      clearable,\n      prefixIcon,\n      options,\n      filterable,\n      loading,\n      onFocus,\n      onBlur,\n      onClear = noop,\n      onCreate,\n      onRemove,\n      onSearch,\n      onChange,\n      empty,\n      valueType = 'value',\n      keys,\n      children,\n      collapsedItems,\n      minCollapsedNum,\n      valueDisplay,\n      onEnter,\n      onVisibleChange,\n    } = useDefaultValue(props);\n\n    const { classPrefix } = useConfig();\n\n    const name = `${classPrefix}-select`; // t-select\n\n    let selectedLabel = '';\n\n    const [showPopup, setShowPopup] = useState(false);\n    const [isHover, toggleHover] = useState(false);\n    const [inputVal, setInputVal] = useState<string>(undefined);\n    const [currentOptions, setCurrentOptions] = useState([]);\n\n    const [width, setWidth] = useState(0);\n\n    const selectRef = useRef(null);\n    const overlayRef = useRef(null);\n\n    if (value) {\n      selectedLabel = getLabel(children, value, currentOptions, keys);\n    }\n\n    // 计算Select的宽高\n    useEffect(() => {\n      if (showPopup && selectRef?.current) {\n        const domRect = selectRef.current.getBoundingClientRect();\n        const overlayRect = overlayRef?.current?.getContentRef?.getBoundingClientRect?.();\n\n        // 获取overlay的内容的宽度进行比较 如果比select本身宽，则优先使用overlay内容宽度，减少text被省略展示的情况\n        const width =\n          domRect.width > MAX_OVERLAY_WIDTH\n            ? domRect.width\n            : Math.min(MAX_OVERLAY_WIDTH, Math.max(domRect.width, overlayRect?.width));\n\n        setWidth(width);\n      }\n    }, [showPopup]);\n\n    useEffect(() => {\n      onVisibleChange?.(showPopup);\n    }, [showPopup, onVisibleChange]);\n\n    // 处理设置option的逻辑\n    useEffect(() => {\n      if (keys) {\n        // 如果有定制keys 先做转换\n        const transformedOptions = options.map((option) => ({\n          ...option,\n          value: get(option, keys?.value || 'value'),\n          label: get(option, keys?.label || 'label'),\n        }));\n        setCurrentOptions(transformedOptions);\n      } else {\n        setCurrentOptions(options);\n      }\n    }, [options, keys, children]);\n\n    // handle click outside\n    useEffect(() => {\n      const listener = (event: MouseEvent | TouchEvent) => {\n        if (!selectRef.current || selectRef.current.contains(event.target)) {\n          return;\n        }\n        if (showPopup) {\n          setShowPopup(false);\n        }\n        if (!showPopup) {\n          toggleHover(false);\n        }\n      };\n      document.addEventListener('click', listener);\n      return () => {\n        document.removeEventListener('click', listener);\n      };\n    }, [showPopup, onVisibleChange]);\n\n    // 移除 Tag\n    const removeTag = (\n      event?: React.MouseEvent,\n      selectValue?: SelectValue,\n      tagData?: {\n        label?: string;\n        value?: string | number;\n      },\n    ) => {\n      event.stopPropagation();\n      const values = getSelectValueArr(value, selectValue, true, valueType, keys);\n      onChange(values);\n      if (isFunction(onRemove)) {\n        onRemove({ value: tagData.value, data: tagData, e: event as React.MouseEvent<HTMLDivElement, MouseEvent> });\n      }\n    };\n\n    // 选中 Popup 某项\n    const handleChange: SelectOptionProps['onSelect'] = (value, { label }) => {\n      onChange(value);\n\n      if (filterable) {\n        setInputVal(!multiple || (reserveKeyword && multiple) ? label : '');\n      }\n      if (creatable && isFunction(onCreate)) {\n        if ((options as OptionsType).filter((option) => option.value === value).length === 0) {\n          onCreate(value);\n        }\n      }\n    };\n\n    // 处理filter逻辑\n    const handleFilter = (value: string) => {\n      let filteredOptions: OptionsType;\n      if (value.length === 0) {\n        setCurrentOptions(options);\n        return;\n      }\n\n      if (filter && isFunction(filter)) {\n        // 如果有自定义的filter方法 使用自定义的filter方法\n        filteredOptions = Array.isArray(options) && options.filter((option) => filter(value, option));\n      } else {\n        const filterRegExp = new RegExp(value, 'i');\n        filteredOptions = Array.isArray(options) && options.filter((option) => filterRegExp.test(option?.label)); // 不区分大小写\n      }\n\n      if (creatable) {\n        filteredOptions = filteredOptions.concat([{ label: value, value }]);\n      }\n      setCurrentOptions(filteredOptions);\n    };\n\n    // 处理输入框逻辑\n    const handleInputChange = (value: string) => {\n      setInputVal(value);\n\n      if (isFunction(onSearch)) {\n        onSearch(value);\n        return;\n      }\n\n      handleFilter(value);\n    };\n\n    const defaultLabel = (\n      <span\n        className={classNames(\n          className,\n          { [`${name}-placeholder`]: !value || (Array.isArray(value) && value.length < 1) },\n          {\n            [`${name}-selectedSingle`]: selectedLabel,\n          },\n        )}\n      >\n        {selectedLabel || placeholder || '-请选择-'}\n      </span>\n    );\n\n    const renderMultipleTags = () => {\n      if (multiple && Array.isArray(value) && value.length > 0) {\n        let tags: OptionsType;\n        let optionValue = [];\n        if (valueType === 'value') {\n          if (currentOptions) {\n            optionValue = currentOptions.filter((option) => value.includes(option?.value));\n          }\n          if (children && Array.isArray(children)) {\n            optionValue = children\n              .reduce(\n                (acc, item: ReactElement) =>\n                  acc.concat({ value: item.props.value, label: item.props.label || item.props.children }),\n                [],\n              )\n              .filter((option) => value.includes(option?.value));\n          }\n\n          tags = getMultipleTags(optionValue, keys);\n        } else {\n          tags = getMultipleTags(value, keys);\n        }\n        if (tags.length > 0)\n          return (\n            <>\n              {tags.slice(0, minCollapsedNum).map((item) => (\n                <Tag\n                  closable={!disabled}\n                  key={item.value}\n                  onClose={({ e }) => removeTag(e, item.value, item)}\n                  disabled={disabled}\n                  size={size}\n                >\n                  {item.label}\n                </Tag>\n              ))}\n              {collapsedItems}\n              {minCollapsedNum && tags.length - minCollapsedNum > 0 && !collapsedItems ? (\n                <Tag size={size}> {`+${tags.length - minCollapsedNum}`}</Tag>\n              ) : null}\n            </>\n          );\n        return !filterable ? defaultLabel : null;\n      }\n      return !filterable ? defaultLabel : null;\n    };\n\n    const renderInput = () => {\n      const isEmpty = !value || (Array.isArray(value) && value.length === 0);\n      return (\n        <Input\n          value={isString(inputVal) ? inputVal : selectedLabel}\n          placeholder={isEmpty ? placeholder || '-请选择-' : undefined}\n          className={`${name}-input`}\n          onChange={handleInputChange}\n          onFocus={(_, context) => onFocus?.({ value, e: context?.e })}\n          onBlur={(_, context) => onBlur?.({ value, e: context?.e })}\n          onEnter={(_, context) => onEnter?.({ inputValue: inputVal, value, e: context?.e })}\n        />\n      );\n    };\n\n    const onInputClick = (e: React.MouseEvent) => {\n      e.preventDefault();\n      if (!disabled) {\n        setShowPopup(!showPopup);\n      }\n    };\n\n    const onClearValue = (event: React.MouseEvent) => {\n      event.stopPropagation();\n      if (Array.isArray(value)) {\n        onChange([]);\n      } else {\n        onChange('');\n      }\n      // Icon组件目前的ref\n      onClear({ e: event as React.MouseEvent<HTMLDivElement, MouseEvent> });\n    };\n\n    // 渲染后置图标\n    const renderSuffixIcon = () => {\n      if (loading) {\n        return (\n          <Loading\n            className={classNames(className, `${name}-right-icon`, `${name}-active-icon`)}\n            loading={true}\n            size=\"small\"\n          />\n        );\n      }\n      if (clearable && value && isHover) {\n        return (\n          <CloseCircleFilledIcon\n            onClick={clearable ? onClearValue : undefined}\n            className={classNames(className, `${name}-right-icon`, `${name}-right-icon__clear`)}\n          />\n        );\n      }\n      return <FakeArrow overlayClassName={`${name}-right-icon`} isActive={showPopup} disabled={disabled} />;\n    };\n\n    const popupContentProps = {\n      onChange: handleChange,\n      value,\n      className,\n      size,\n      multiple,\n      showPopup,\n      setShowPopup,\n      options: currentOptions,\n      empty,\n      max,\n      loadingText,\n      loading,\n      valueType,\n      keys,\n    };\n\n    const renderContent = () => <PopupContent {...popupContentProps}>{children}</PopupContent>;\n\n    const renderMultipleInput = () => {\n      if (valueDisplay) {\n        return valueDisplay({ value: value as OptionsType, onClose: removeTag }) || defaultLabel;\n      }\n      return renderMultipleTags();\n    };\n    return (\n      <div\n        className={`${name}-wrap`}\n        style={{ ...style }}\n        onMouseEnter={() => toggleHover(true)}\n        onMouseLeave={() => toggleHover(false)}\n      >\n        <Popup\n          content={renderContent()}\n          placement=\"bottom-left\"\n          visible={showPopup}\n          overlayStyle={{\n            width: width ? `${width}px` : 'none',\n          }}\n          overlayClassName={classNames(className, `${name}-dropdown`, `${classPrefix}-popup`, 'narrow-scrollbar')}\n          destroyOnClose\n          className={`${name}-popup-reference`}\n          {...popupProps}\n          ref={overlayRef}\n        >\n          <div\n            className={classNames(className, name, {\n              [`${classPrefix}-is-disabled`]: disabled,\n              [`${classPrefix}-is-active`]: showPopup,\n              [`${classPrefix}-size-s`]: size === 'small',\n              [`${classPrefix}-size-l`]: size === 'large',\n              [`${classPrefix}-no-border`]: !bordered,\n              [`${classPrefix}-has-prefix`]: !!prefixIcon,\n            })}\n            ref={composeRefs(selectRef, ref)}\n            style={{ userSelect: 'none' }}\n            onClick={onInputClick}\n          >\n            {<span className={`${name}-left-icon`}>{prefixIcon}</span>}\n            {multiple ? renderMultipleInput() : null}\n            {filterable && renderInput()}\n            {!multiple && !filterable && defaultLabel}\n            {renderSuffixIcon()}\n          </div>\n        </Popup>\n      </div>\n    );\n  },\n  {\n    displayName: 'Select',\n    Option,\n    OptionGroup,\n  },\n);\n\nexport default Select;\n"],"names":["MAX_OVERLAY_WIDTH","Select","forwardRefWithStatics","props","ref","useLocaleReceiver","local","t","emptyText","loadingText","useDefaultValue","bordered","creatable","filter","max","popupProps","reserveKeyword","value","className","style","disabled","size","multiple","placeholder","clearable","prefixIcon","options","filterable","loading","onFocus","onBlur","onClear","noop","onCreate","onRemove","onSearch","onChange","empty","valueType","keys","children","collapsedItems","minCollapsedNum","valueDisplay","onEnter","onVisibleChange","useConfig","classPrefix","name","selectedLabel","useState","showPopup","setShowPopup","isHover","toggleHover","inputVal","setInputVal","currentOptions","setCurrentOptions","width","setWidth","selectRef","useRef","overlayRef","getLabel","current","domRect","getBoundingClientRect","overlayRect","getContentRef","width2","Math","min","transformedOptions","map","option","get","label","listener","event","contains","target","addEventListener","removeEventListener","removeTag","selectValue","tagData","stopPropagation","values","getSelectValueArr","isFunction","data","e","handleChange","value2","length","handleFilter","filteredOptions","Array","isArray","filterRegExp","RegExp","test","concat","handleInputChange","defaultLabel","classNames","renderMultipleTags","tags","optionValue","includes","reduce","acc","item","getMultipleTags","slice","Tag","closable","key","onClose","renderInput","isEmpty","Input","isString","_","context","inputValue","onInputClick","preventDefault","onClearValue","renderSuffixIcon","Loading","CloseCircleFilledIcon","onClick","FakeArrow","overlayClassName","isActive","popupContentProps","renderContent","PopupContent","renderMultipleInput","onMouseEnter","onMouseLeave","Popup","content","placement","visible","overlayStyle","destroyOnClose","composeRefs","userSelect","displayName","Option","OptionGroup"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,IAAMA,oBAAoB,GAA1B;IASMC,SAASC,sBACb,UAACC,KAAD,EAAqBC,GAArB,EAAkD;AAAA;;2BAE7BC,kBAAkB;;MAA9BC;MAAOC;;MACRC,YAAYD,EAAED,MAAMG;;yBAsCtBC,gBAAgBP;+CAnClBQ;MAAAA,8CAAW;MACXC,6BAAAA;MACAC,0BAAAA;+CACAJ;MAAAA,iDAAcD;8CACdM;MAAAA,wCAAM;MACNC,8BAAAA;MACAC,kCAAAA;MACAC,yBAAAA;MACAC,6BAAAA;MACAC,yBAAAA;MACAC,4BAAAA;MACAC,wBAAAA;MACAC,4BAAAA;MACAC,+BAAAA;MACAC,6BAAAA;MACAC,8BAAAA;MACAC,2BAAAA;MACAC,8BAAAA;MACAC,2BAAAA;MACAC,4BAAAA;MACAC,2BAAAA;+CACAC;MAAAA,6CAAUC;MACVC,4BAAAA;MACAC,4BAAAA;MACAC,4BAAAA;MACAC,4BAAAA;MACAC,yBAAAA;+CACAC;MAAAA,+CAAY;MACZC,wBAAAA;MACAC,4BAAAA;MACAC,kCAAAA;MACAC,mCAAAA;MACAC,gCAAAA;MACAC,4BAAAA;MACAC,mCAAAA;;mBAGsBC;MAAhBC,yBAAAA;;MAEFC,iBAAUD;MAEZE,gBAAgB;;kBAEcC,SAAS;;MAApCC;MAAWC;;mBACaF,SAAS;;MAAjCG;MAASC;;mBACgBJ,SAAiB;;MAA1CK;MAAUC;;mBAC2BN,SAAS;;MAA9CO;MAAgBC;;mBAEGR,SAAS;;MAA5BS;MAAOC;;MAERC,YAAYC,OAAO;MACnBC,aAAaD,OAAO;;MAEtB7C,OAAO;oBACO+C,SAASxB,UAAUvB,OAAOwC,gBAAgBlB;;;YAIlD,YAAM;QACVY,aAAaU,sBAAAA,wBAAAA,UAAWI,SAAS;AAAA;;UAC7BC,UAAUL,UAAUI,OAAV,CAAkBE,qBAAlB;UACVC,cAAcL,uBAAAA,wDAAAA,WAAYE,wFAAZ,oBAAqBI,iGAArB,sBAAoCF,gFAApC;UAGdG,SACJJ,QAAQP,KAAR,GAAgB3D,iBAAhB,GACIkE,QAAQP,KADZ,GAEIY,KAAKC,GAAL,CAASxE,iBAAT,EAA4BuE,KAAKzD,GAAL,CAASoD,QAAQP,KAAjB,EAAwBS,WAAxB,aAAwBA,WAAxB,uBAAwBA,YAAaT,KAArC,CAA5B;eAEGW;;KAEV,CAACnB,SAAD;YAEO,YAAM;sFACIA;KACjB,CAACA,SAAD,EAAYN,eAAZ;YAGO,YAAM;QACVN,MAAM;UAEFkC,qBAAqB/C,QAAQgD,GAAR,CAAY,UAACC,MAAD;AAAA,+CAClCA,MADkC;AAErC1D,UAAAA,OAAO2D,MAAID,QAAQ,CAAApC,aAAA,IAAAA,eAAA,YAAAA,KAAMtB,KAAN,KAAe,QAFG;AAGrC4D,UAAAA,OAAOD,MAAID,QAAQ,CAAApC,aAAA,IAAAA,eAAA,YAAAA,KAAMsC,KAAN,KAAe;AAHG;AAAA,OAAZ;wBAKTJ;WACb;wBACa/C;;KAEnB,CAACA,OAAD,EAAUa,IAAV,EAAgBC,QAAhB;YAGO,YAAM;QACRsC,WAAW,SAAXA,QAAW,CAACC,KAAD,EAAoC;UAC/C,CAAClB,UAAUI,OAAX,IAAsBJ,UAAUI,OAAV,CAAkBe,QAAlB,CAA2BD,MAAME,MAAjC,GAA0C;;;;UAGhE9B,WAAW;qBACA;;;UAEX,CAACA,WAAW;oBACF;;;;aAGP+B,iBAAiB,SAASJ;WAC5B,YAAM;eACFK,oBAAoB,SAASL;;KAEvC,CAAC3B,SAAD,EAAYN,eAAZ;;MAGGuC,YAAY,SAAZA,SAAY,CAChBL,KADgB,EAEhBM,WAFgB,EAGhBC,OAHgB,EAOb;UACGC;QACAC,SAASC,kBAAkBxE,OAAOoE,aAAa,MAAM/C,WAAWC;aAC7DiD;;QACLE,aAAWxD,WAAW;eACf;AAAEjB,QAAAA,OAAOqE,QAAQrE,KAAjB;AAAwB0E,QAAAA,MAAML,OAA9B;AAAuCM,QAAAA,GAAGb;AAA1C;;;;MAKPc,eAA8C,SAA9CA,YAA8C,CAACC,MAAD,QAAsB;AAAA,QAAZjB,KAAY,QAAZA,KAAY;aAC/DiB;;QAELnE,YAAY;kBACF,CAACL,QAAD,IAAcN,kBAAkBM,QAAhC,GAA4CuD,KAA5C,GAAoD;;;QAE9DjE,aAAa8E,aAAWzD,WAAW;UAChCP,QAAwBb,MAAxB,CAA+B,UAAC8D,MAAD;AAAA,eAAYA,OAAO1D,KAAP,KAAiB6E,MAA7B;AAAA,OAA/B,EAAmEC,MAAnE,KAA8E,GAAG;iBAC3ED;;;;;MAMTE,eAAe,SAAfA,YAAe,CAACF,MAAD,EAAmB;QAClCG;;QACAH,OAAMC,MAAN,KAAiB,GAAG;wBACJrE;;;;QAIhBb,UAAU6E,aAAW7E,SAAS;wBAEdqF,MAAMC,OAAN,CAAczE,OAAd,KAA0BA,QAAQb,MAAR,CAAe,UAAC8D,MAAD;AAAA,eAAY9D,OAAOiF,QAAOnB,OAA1B;AAAA,OAAf;WACvC;UACCyB,eAAe,IAAIC,MAAJ,CAAWP,MAAX,EAAkB,GAAlB;wBACHI,MAAMC,OAAN,CAAczE,OAAd,KAA0BA,QAAQb,MAAR,CAAe,UAAC8D,MAAD;AAAA,eAAYyB,aAAaE,IAAb,CAAkB3B,MAAlB,aAAkBA,MAAlB,uBAAkBA,OAAQE,KAA1B,CAAZ;AAAA,OAAf;;;QAG1CjE,WAAW;wBACKqF,gBAAgBM,MAAhB,CAAuB,CAAC;AAAE1B,QAAAA,OAAOiB,MAAT;AAAgB7E,QAAAA;AAAhB,OAAD,CAAvB;;;sBAEFgF;;;MAIdO,oBAAoB,SAApBA,iBAAoB,CAACV,MAAD,EAAmB;gBAC/BA;;QAERJ,aAAWvD,WAAW;eACf2D;;;;iBAIEA;;;MAGTW,2DACH,QAAD;AACEvF,IAAAA,WAAWwF,WACTxF,yCACM8B,uBAAqB,CAAC/B,KAAD,IAAWiF,MAAMC,OAAN,CAAclF,KAAd,KAAwBA,MAAM8E,MAAN,GAAe,kCAEvE/C,0BAAwBC;AALlC,KASGA,iBAAiB1B,WAAjB,IAAgC;;MAI/BoF,qBAAqB,SAArBA,kBAAqB,GAAM;QAC3BrF,YAAY4E,MAAMC,OAAN,CAAclF,KAAd,CAAZ,IAAoCA,MAAM8E,MAAN,GAAe,GAAG;UACpDa;UACAC,cAAc;;UACdvE,cAAc,SAAS;YACrBmB,gBAAgB;wBACJA,eAAe5C,MAAf,CAAsB,UAAC8D,MAAD;AAAA,mBAAY1D,MAAM6F,QAAN,CAAenC,MAAf,aAAeA,MAAf,uBAAeA,OAAQ1D,KAAvB,CAAZ;AAAA,WAAtB;;;YAEZuB,YAAY0D,MAAMC,OAAN,CAAc3D,QAAd,GAAyB;wBACzBA,SACXuE,MADW,CAEV,UAACC,GAAD,EAAMC,IAAN;AAAA,mBACED,IAAIT,MAAJ,CAAW;AAAEtF,cAAAA,OAAOgG,KAAK9G,KAAL,CAAWc,KAApB;AAA2B4D,cAAAA,OAAOoC,KAAK9G,KAAL,CAAW0E,KAAX,IAAoBoC,KAAK9G,KAAL,CAAWqC;AAAjE,aAAX,CADF;AAAA,WAFU,EAIV,EAJU,EAMX3B,MANW,CAMJ,UAAC8D,MAAD;AAAA,mBAAY1D,MAAM6F,QAAN,CAAenC,MAAf,aAAeA,MAAf,uBAAeA,OAAQ1D,KAAvB,CAAZ;AAAA,WANI;;;eASTiG,gBAAgBL,aAAatE;aAC/B;eACE2E,gBAAgBjG,OAAOsB;;;UAE5BqE,KAAKb,MAAL,GAAc,qFAGXa,KAAKO,KAAL,CAAW,CAAX,EAAczE,eAAd,EAA+BgC,GAA/B,CAAmC,UAACuC,IAAD;AAAA,2DACjCG,KAAD;AACEC,UAAAA,UAAU,CAACjG,QADb;AAEEkG,UAAAA,KAAKL,KAAKhG,KAFZ;AAGEsG,UAAAA,SAAS;AAAA,gBAAG3B,CAAH,SAAGA,CAAH;AAAA,mBAAWR,UAAUQ,GAAGqB,KAAKhG,OAAOgG,KAApC;AAAA,WAHX;AAIE7F,UAAAA,UAAAA,QAJF;AAKEC,UAAAA,MAAAA;AALF,WAOG4F,KAAKpC,MAR0B;AAAA,OAAnC,GAWApC,gBACAC,mBAAmBkE,KAAKb,MAAL,GAAcrD,eAAd,GAAgC,CAAnD,IAAwD,CAACD,cAAzD,+CACE2E,KAAD;AAAK/F,QAAAA,MAAAA;AAAL,SAAiB,gBAAMuF,KAAKb,MAAL,GAAcrD,iBADtC,GAEG;aAGH,CAACf,UAAD,GAAc8E,YAAd,GAA6B;;;WAE/B,CAAC9E,UAAD,GAAc8E,YAAd,GAA6B;;;MAGhCe,cAAc,SAAdA,WAAc,GAAM;QAClBC,UAAU,CAACxG,KAAD,IAAWiF,MAAMC,OAAN,CAAclF,KAAd,KAAwBA,MAAM8E,MAAN,KAAiB;uDAEjE2B,OAAD;AACEzG,MAAAA,OAAO0G,WAASpE,SAAT,GAAqBA,QAArB,GAAgCN,aADzC;AAEE1B,MAAAA,aAAakG,UAAUlG,eAAe,yBAAU,MAFlD;AAGEL,MAAAA,qBAAc8B,eAHhB;AAIEZ,MAAAA,UAAUoE,iBAJZ;AAKE3E,MAAAA,SAAS,iBAAC+F,CAAD,EAAIC,OAAJ;AAAA,eAAgBhG,QAAhB,aAAgBA,QAAhB,uBAAgBA,SAAU;AAAEZ,UAAAA,OAAAA,KAAF;AAAS2E,UAAAA,GAAGiC,oBAAAA,8BAAAA,QAASjC;AAArB,UAA1B;AAAA,OALX;AAME9D,MAAAA,QAAQ,gBAAC8F,CAAD,EAAIC,OAAJ;AAAA,eAAgB/F,OAAhB,aAAgBA,OAAhB,uBAAgBA,QAAS;AAAEb,UAAAA,OAAAA,KAAF;AAAS2E,UAAAA,GAAGiC,oBAAAA,8BAAAA,QAASjC;AAArB,UAAzB;AAAA,OANV;AAOEhD,MAAAA,SAAS,iBAACgF,CAAD,EAAIC,OAAJ;AAAA,eAAgBjF,QAAhB,aAAgBA,QAAhB,uBAAgBA,SAAU;AAAEkF,UAAAA,YAAYvE,QAAd;AAAwBtC,UAAAA,OAAAA,KAAxB;AAA+B2E,UAAAA,GAAGiC,oBAAAA,8BAAAA,QAASjC;AAA3C,UAA1B;AAAA;AAPX;;;MAYEmC,eAAe,SAAfA,YAAe,CAACnC,CAAD,EAAyB;MAC1CoC;;QACE,CAAC5G,UAAU;mBACA,CAAC+B;;;;MAIZ8E,eAAe,SAAfA,YAAe,CAAClD,KAAD,EAA6B;UAC1CQ;;QACFW,MAAMC,OAAN,CAAclF,KAAd,GAAsB;eACf;WACJ;eACI;;;YAGH;AAAE2E,MAAAA,GAAGb;AAAL;;;MAIJmD,mBAAmB,SAAnBA,gBAAmB,GAAM;QACzBtG,SAAS;yDAERuG,SAAD;AACEjH,QAAAA,WAAWwF,WAAWxF,qBAAc8B,gCAAsBA,sBAD5D;AAEEpB,QAAAA,SAAS,IAFX;AAGEP,QAAAA,MAAK;AAHP;;;QAOAG,aAAaP,KAAb,IAAsBoC,SAAS;yDAE9B+E,uBAAD;AACEC,QAAAA,SAAS7G,YAAYyG,eAAe,MADtC;AAEE/G,QAAAA,WAAWwF,WAAWxF,qBAAc8B,gCAAsBA;AAF5D;;;uDAMIsF,WAAD;AAAWC,MAAAA,4BAAqBvF,oBAAhC;AAAmDwF,MAAAA,UAAUrF,SAA7D;AAAwE/B,MAAAA,UAAAA;AAAxE;;;MAGHqH,oBAAoB;AACxBrG,IAAAA,UAAUyD,YADc;AAExB5E,IAAAA,OAAAA,KAFwB;AAGxBC,IAAAA,WAAAA,SAHwB;AAIxBG,IAAAA,MAAAA,IAJwB;AAKxBC,IAAAA,UAAAA,QALwB;AAMxB6B,IAAAA,WAAAA,SANwB;AAOxBC,IAAAA,cAAAA,YAPwB;AAQxB1B,IAAAA,SAAS+B,cARe;AASxBpB,IAAAA,OAAAA,KATwB;AAUxBvB,IAAAA,KAAAA,GAVwB;AAWxBL,IAAAA,aAAAA,WAXwB;AAYxBmB,IAAAA,SAAAA,OAZwB;AAaxBU,IAAAA,WAAAA,SAbwB;AAcxBC,IAAAA,MAAAA;AAdwB;;MAiBpBmG,gBAAgB,SAAhBA,aAAgB;AAAA,uDAAOC,gCAAiBF,oBAAoBjG,SAA5C;AAAA;;MAEhBoG,sBAAsB,SAAtBA,mBAAsB,GAAM;QAC5BjG,cAAc;aACTA,aAAa;AAAE1B,QAAAA,OAAAA,KAAF;AAA+BsG,QAAAA,SAASnC;AAAxC,QAAb,IAAqEqB;;;WAEvEE;;;qDAGN,OAAD;AACEzF,IAAAA,qBAAc8B,cADhB;AAEE7B,IAAAA,yBAAYA,MAFd;AAGE0H,IAAAA,cAAc;AAAA,aAAMvF,YAAY,KAAlB;AAAA,KAHhB;AAIEwF,IAAAA,cAAc;AAAA,aAAMxF,YAAY,MAAlB;AAAA;AAJhB,iDAMGyF;AACCC,IAAAA,SAASN;AACTO,IAAAA,WAAU;AACVC,IAAAA,SAAS/F;AACTgG,IAAAA,cAAc;AACZxF,MAAAA,OAAOA,kBAAWA,eAAY;AADlB;AAGd4E,IAAAA,kBAAkB7B,WAAWxF,qBAAc8B,8BAAoBD,wBAAqB;AACpFqG,IAAAA,gBAAc;AACdlI,IAAAA,qBAAc8B;KACVjC;AACJX,IAAAA,KAAK2D;kDAEJ,OAAD;AACE7C,IAAAA,WAAWwF,WAAWxF,WAAW8B,kEAC3BD,8BAA4B3B,mDAC5B2B,4BAA0BI,oDAC1BJ,yBAAuB1B,SAAS,kDAChC0B,yBAAuB1B,SAAS,kDAChC0B,4BAA0B,CAACpC,mDAC3BoC,6BAA2B,CAAC,CAACtB,2BAPrC;AASErB,IAAAA,KAAKiJ,YAAYxF,WAAWzD,IAT9B;AAUEe,IAAAA,OAAO;AAAEmI,MAAAA,YAAY;AAAd,KAVT;AAWEjB,IAAAA,SAASN;AAXX,iDAaI,QAAD;AAAM7G,IAAAA,qBAAc8B;AAApB,KAAuCvB,aACvCH,WAAWsH,wBAAwB,MACnCjH,cAAc6F,eACd,CAAClG,QAAD,IAAa,CAACK,UAAd,IAA4B8E,cAC5ByB;GAMX;AACEqB,EAAAA,aAAa,QADf;AAEEC,EAAAA,QAAAA,MAFF;AAGEC,EAAAA,aAAAA;AAHF;;;;"}

package/es/select/base/style/index.js

@@ -1,5 +1,5 @@
 /**
- * tdesign v0.17.0
+ * tdesign v0.18.2
  * (c) 2021 tdesign
  * @license MIT
  */

package/es/select/index.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import './style/index.js';
 export type { SelectProps } from './base/Select';
+export * from '../_type/components/select';
 export declare const Select: import("react").FunctionComponent<import("./base/Select").SelectProps & import("react").RefAttributes<HTMLDivElement>> & {
     displayName: string;
     Option: (props: import("./base/Option").SelectOptionProps) => JSX.Element;

package/es/select/index.js

@@ -1,22 +1,39 @@
 /**
- * tdesign v0.17.0
+ * tdesign v0.18.2
  * (c) 2021 tdesign
  * @license MIT
  */
 
 import Select$1 from './base/Select.js';
 import './style/css.js';
-import '../_chunks/dep-308ea020.js';
-import '../_chunks/dep-01d52b00.js';
-import '../_chunks/dep-65d3c0dc.js';
+import '../_type/components/select/index.js';
+import '../_chunks/dep-efe7433b.js';
+import '../_chunks/dep-2f008905.js';
+import '../_chunks/dep-6a5b1968.js';
 import 'react';
-import 'classnames';
-import 'lodash';
 import 'tdesign-icons-react';
+import 'classnames';
+import '../_chunks/dep-83646039.js';
+import '../_chunks/dep-cb80da27.js';
+import '../_chunks/dep-b6ff8559.js';
+import '../_chunks/dep-1189939f.js';
+import '../_chunks/dep-504203df.js';
+import '../_chunks/dep-74a044dc.js';
+import '../_chunks/dep-b6158110.js';
+import '../_chunks/dep-744f52b3.js';
+import '../_chunks/dep-9ad4f4b7.js';
+import '../_chunks/dep-4e491803.js';
+import '../_chunks/dep-9d2e7b62.js';
+import '../_chunks/dep-f3eac264.js';
+import '../_chunks/dep-e83a1558.js';
+import '../_chunks/dep-47afb0bc.js';
+import '../_chunks/dep-ed9505a3.js';
+import '../_chunks/dep-43869d17.js';
+import '../_chunks/dep-e507e9db.js';
 import '../locale/LocalReceiver.js';
 import '../config-provider/index.js';
 import '../config-provider/ConfigProvider.js';
-import '../_chunks/dep-34727236.js';
+import '../_chunks/dep-016d27a7.js';
 import '../config-provider/ConfigContext.js';
 import '../locale/zh_CN.js';
 import '../_util/useConfig.js';
@@ -27,35 +44,37 @@ import '../_util/noop.js';
 import '../_util/forwardRefWithStatics.js';
 import 'hoist-non-react-statics';
 import './util/helper.js';
-import '../_chunks/dep-983e6e8d.js';
+import '../_chunks/dep-2eeaa58b.js';
+import 'lodash';
 import './base/OptionGroup.js';
 import '../common/FakeArrow.js';
+import '../loading/index.js';
+import '../loading/loading.js';
+import 'react-dom';
+import '../_util/dom.js';
+import 'raf';
+import '../_util/easing.js';
+import '../common/Portal.js';
+import '../_chunks/dep-65c183dc.js';
+import '../_type/components/loading/index.js';
 import '../input/index.js';
 import '../input/Input.js';
-import '../_chunks/dep-169d1f12.js';
-import '../_chunks/dep-d77e1dab.js';
-import '../_chunks/dep-72e49bf9.js';
-import '../_chunks/dep-4f8d4a92.js';
-import '../_chunks/dep-d637b20e.js';
-import '../_chunks/dep-a80d1e95.js';
 import '../input/InputGroup.js';
+import '../_type/components/input/index.js';
 import '../popup/index.js';
 import '../popup/Popup.js';
 import 'react-popper';
 import '../_util/usePrevious.js';
 import '../popup/Portal.js';
-import 'react-dom';
 import '../popup/useTriggerProps.js';
 import '../_util/useClickOutside.js';
+import '../_type/components/popup/index.js';
 import '../tag/index.js';
 import '../tag/Tag.js';
 import '../tag/CheckTag.js';
+import '../_type/components/tag/index.js';
 import './base/Option.js';
-import '../_chunks/dep-8f70dd0b.js';
-import '../_chunks/dep-0bebd973.js';
-import '../_chunks/dep-8ce9524a.js';
-import '../_chunks/dep-50d67a9e.js';
-import '../_chunks/dep-6d4ba42b.js';
+import '../_chunks/dep-462edfd5.js';
 import '../_util/useRipple.js';
 import '../_util/setStyle.js';
 import './base/PopupContent.js';

package/es/select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/select/index.ts"],"sourcesContent":["import _Select from './base/Select';\n\nimport './style/index.js';\n\nexport type { SelectProps } from './base/Select';\n\nexport const Select = _Select;\nexport default Select;\n"],"names":["Select","_Select"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAMaA,SAASC;;;;"}
+{"version":3,"file":"index.js","sources":["../../src/select/index.ts"],"sourcesContent":["import _Select from './base/Select';\n\nimport './style/index.js';\n\nexport type { SelectProps } from './base/Select';\nexport * from '../_type/components/select';\n\nexport const Select = _Select;\nexport default Select;\n"],"names":["Select","_Select"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAOaA,SAASC;;;;"}

package/es/select/style/index.css

@@ -18,58 +18,58 @@
 }
 :root,
 :root[theme-mode="light"] {
-  --td-brand-color-1: #ECF2FE;
-  --td-brand-color-2: #D4E3FC;
-  --td-brand-color-3: #BBD3FB;
-  --td-brand-color-4: #96BBF8;
-  --td-brand-color-5: #699EF5;
-  --td-brand-color-6: #4787F0;
-  --td-brand-color-7: #266FE8;
-  --td-brand-color-8: #0052D9;
-  --td-brand-color-9: #0034B5;
-  --td-brand-color-10: #001F97;
-  --td-warning-color-1: #FEF3E6;
-  --td-warning-color-2: #F9E0C7;
-  --td-warning-color-3: #F7C797;
-  --td-warning-color-4: #F2995F;
-  --td-warning-color-5: #ED7B2F;
-  --td-warning-color-6: #D35A21;
-  --td-warning-color-7: #BA431B;
-  --td-warning-color-8: #9E3610;
-  --td-warning-color-9: #842B0B;
-  --td-warning-color-10: #5A1907;
-  --td-error-color-1: #FDECEE;
-  --td-error-color-2: #F9D7D9;
-  --td-error-color-3: #F8B9BE;
-  --td-error-color-4: #F78D94;
-  --td-error-color-5: #F36D78;
-  --td-error-color-6: #E34D59;
-  --td-error-color-7: #C9353F;
-  --td-error-color-8: #B11F26;
+  --td-brand-color-1: #ecf2fe;
+  --td-brand-color-2: #d4e3fc;
+  --td-brand-color-3: #bbd3fb;
+  --td-brand-color-4: #96bbf8;
+  --td-brand-color-5: #699ef5;
+  --td-brand-color-6: #4787f0;
+  --td-brand-color-7: #266fe8;
+  --td-brand-color-8: #0052d9;
+  --td-brand-color-9: #0034b5;
+  --td-brand-color-10: #001f97;
+  --td-warning-color-1: #fef3e6;
+  --td-warning-color-2: #f9e0c7;
+  --td-warning-color-3: #f7c797;
+  --td-warning-color-4: #f2995f;
+  --td-warning-color-5: #ed7b2f;
+  --td-warning-color-6: #d35a21;
+  --td-warning-color-7: #ba431b;
+  --td-warning-color-8: #9e3610;
+  --td-warning-color-9: #842b0b;
+  --td-warning-color-10: #5a1907;
+  --td-error-color-1: #fdecee;
+  --td-error-color-2: #f9d7d9;
+  --td-error-color-3: #f8b9be;
+  --td-error-color-4: #f78d94;
+  --td-error-color-5: #f36d78;
+  --td-error-color-6: #e34d59;
+  --td-error-color-7: #c9353f;
+  --td-error-color-8: #b11f26;
   --td-error-color-9: #951114;
   --td-error-color-10: #680506;
-  --td-success-color-1: #E8F8F2;
-  --td-success-color-2: #BCEBDC;
-  --td-success-color-3: #85DBBE;
-  --td-success-color-4: #48C79C;
-  --td-success-color-5: #00A870;
-  --td-success-color-6: #078D5C;
+  --td-success-color-1: #e8f8f2;
+  --td-success-color-2: #bcebdc;
+  --td-success-color-3: #85dbbe;
+  --td-success-color-4: #48c79c;
+  --td-success-color-5: #00a870;
+  --td-success-color-6: #078d5c;
   --td-success-color-7: #067945;
   --td-success-color-8: #056334;
-  --td-success-color-9: #044F2A;
+  --td-success-color-9: #044f2a;
   --td-success-color-10: #033017;
-  --td-gray-color-1: #F3F3F3;
-  --td-gray-color-2: #EEEEEE;
-  --td-gray-color-3: #E7E7E7;
-  --td-gray-color-4: #DCDCDC;
-  --td-gray-color-5: #C5C5C5;
-  --td-gray-color-6: #A6A6A6;
-  --td-gray-color-7: #8B8B8B;
-  --td-gray-color-8: #777777;
-  --td-gray-color-9: #5E5E5E;
-  --td-gray-color-10: #4B4B4B;
+  --td-gray-color-1: #f3f3f3;
+  --td-gray-color-2: #eee;
+  --td-gray-color-3: #e7e7e7;
+  --td-gray-color-4: #dcdcdc;
+  --td-gray-color-5: #c5c5c5;
+  --td-gray-color-6: #a6a6a6;
+  --td-gray-color-7: #8b8b8b;
+  --td-gray-color-8: #777;
+  --td-gray-color-9: #5e5e5e;
+  --td-gray-color-10: #4b4b4b;
   --td-gray-color-11: #383838;
-  --td-gray-color-12: #2C2C2C;
+  --td-gray-color-12: #2c2c2c;
   --td-gray-color-13: #242424;
   --td-gray-color-14: #181818;
   --td-font-white-1: #ffffff;
@@ -130,69 +130,69 @@
   --td-component-stroke: var(--td-gray-color-3);
   --td-border-level-2-color: var(--td-gray-color-4);
   --td-component-border: var(--td-gray-color-4);
-  --td-shadow-1: 0px 1px 10px rgba(0, 0, 0, 0.05), 0px 4px 5px rgba(0, 0, 0, .08), 0px 2px 4px -1px rgba(0, 0, 0, .12);
-  --td-shadow-2: 0px 3px 14px 2px rgba(0, 0, 0, 0.05), 0px 8px 10px 1px rgba(0, 0, 0, .06), 0px 5px 5px -3px rgba(0, 0, 0, .1);
-  --td-shadow-3: 0px 6px 30px 5px rgba(0, 0, 0, 0.05), 0px 16px 24px 2px rgba(0, 0, 0, .04), 0px 8px 10px -5px rgba(0, 0, 0, .08);
-  --td-shadow-inset-top: inset 0px 0.5px 0px #DCDCDC;
-  --td-shadow-inset-right: inset 0.5px 0px 0px #DCDCDC;
-  --td-shadow-inset-bottom: inset 0px -0.5px 0px #DCDCDC;
-  --td-shadow-inset-left: inset -0.5px 0px 0px #DCDCDC;
+  --td-shadow-1: 0 1px 10px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 8%), 0 2px 4px -1px rgba(0, 0, 0, 12%);
+  --td-shadow-2: 0 3px 14px 2px rgba(0, 0, 0, 0.05), 0 8px 10px 1px rgba(0, 0, 0, 6%), 0 5px 5px -3px rgba(0, 0, 0, 10%);
+  --td-shadow-3: 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 4%), 0 8px 10px -5px rgba(0, 0, 0, 8%);
+  --td-shadow-inset-top: inset 0 0.5px 0 #dcdcdc;
+  --td-shadow-inset-right: inset 0.5px 0 0 #dcdcdc;
+  --td-shadow-inset-bottom: inset 0 -0.5px 0 #dcdcdc;
+  --td-shadow-inset-left: inset -0.5px 0 0 #dcdcdc;
   --td-table-shadow-color: rgba(0, 0, 0, 0.08);
   --td-scrollbar-color: rgba(0, 0, 0, 0.1);
 }
 :root[theme-mode="dark"] {
-  --td-brand-color-1: #1B2F51;
+  --td-brand-color-1: #1b2f51;
   --td-brand-color-2: #173463;
   --td-brand-color-3: #143975;
-  --td-brand-color-4: #103D88;
-  --td-brand-color-5: #0D429A;
-  --td-brand-color-6: #054BBE;
-  --td-brand-color-7: #2667D4;
-  --td-brand-color-8: #4582E6;
-  --td-brand-color-9: #699EF5;
-  --td-brand-color-10: #96BBF8;
-  --td-warning-color-1: #4F2A1D;
-  --td-warning-color-2: #582F21;
-  --td-warning-color-3: #733C23;
-  --td-warning-color-4: #A75D2B;
-  --td-warning-color-5: #CF6E2D;
-  --td-warning-color-6: #DC7633;
-  --td-warning-color-7: #E8935C;
-  --td-warning-color-8: #ECBF91;
-  --td-warning-color-9: #EED7BF;
-  --td-warning-color-10: #F3E9DC;
+  --td-brand-color-4: #103d88;
+  --td-brand-color-5: #0d429a;
+  --td-brand-color-6: #054bbe;
+  --td-brand-color-7: #2667d4;
+  --td-brand-color-8: #4582e6;
+  --td-brand-color-9: #699ef5;
+  --td-brand-color-10: #96bbf8;
+  --td-warning-color-1: #4f2a1d;
+  --td-warning-color-2: #582f21;
+  --td-warning-color-3: #733c23;
+  --td-warning-color-4: #a75d2b;
+  --td-warning-color-5: #cf6e2d;
+  --td-warning-color-6: #dc7633;
+  --td-warning-color-7: #e8935c;
+  --td-warning-color-8: #ecbf91;
+  --td-warning-color-9: #eed7bf;
+  --td-warning-color-10: #f3e9dc;
   --td-error-color-1: #472324;
-  --td-error-color-2: #5E2A2D;
+  --td-error-color-2: #5e2a2d;
   --td-error-color-3: #703439;
-  --td-error-color-4: #83383E;
-  --td-error-color-5: #A03F46;
-  --td-error-color-6: #C64751;
-  --td-error-color-7: #DE6670;
-  --td-error-color-8: #EC888E;
-  --td-error-color-9: #EDB1B6;
-  --td-error-color-10: #EECED0;
-  --td-success-color-1: #193A2A;
-  --td-success-color-2: #1A4230;
-  --td-success-color-3: #17533D;
-  --td-success-color-4: #0D7A55;
+  --td-error-color-4: #83383e;
+  --td-error-color-5: #a03f46;
+  --td-error-color-6: #c64751;
+  --td-error-color-7: #de6670;
+  --td-error-color-8: #ec888e;
+  --td-error-color-9: #edb1b6;
+  --td-error-color-10: #eeced0;
+  --td-success-color-1: #193a2a;
+  --td-success-color-2: #1a4230;
+  --td-success-color-3: #17533d;
+  --td-success-color-4: #0d7a55;
   --td-success-color-5: #059465;
-  --td-success-color-6: #43AF8A;
-  --td-success-color-7: #46BF96;
-  --td-success-color-8: #80D2B6;
-  --td-success-color-9: #B4E1D3;
-  --td-success-color-10: #DEEDE8;
-  --td-gray-color-1: #F3F3F3;
-  --td-gray-color-2: #EEEEEE;
-  --td-gray-color-3: #E7E7E7;
-  --td-gray-color-4: #DCDCDC;
-  --td-gray-color-5: #C5C5C5;
-  --td-gray-color-6: #A6A6A6;
-  --td-gray-color-7: #8B8B8B;
-  --td-gray-color-8: #777777;
-  --td-gray-color-9: #5E5E5E;
-  --td-gray-color-10: #4B4B4B;
+  --td-success-color-6: #43af8a;
+  --td-success-color-7: #46bf96;
+  --td-success-color-8: #80d2b6;
+  --td-success-color-9: #b4e1d3;
+  --td-success-color-10: #deede8;
+  --td-gray-color-1: #f3f3f3;
+  --td-gray-color-2: #eee;
+  --td-gray-color-3: #e7e7e7;
+  --td-gray-color-4: #dcdcdc;
+  --td-gray-color-5: #c5c5c5;
+  --td-gray-color-6: #a6a6a6;
+  --td-gray-color-7: #8b8b8b;
+  --td-gray-color-8: #777;
+  --td-gray-color-9: #5e5e5e;
+  --td-gray-color-10: #4b4b4b;
   --td-gray-color-11: #383838;
-  --td-gray-color-12: #2C2C2C;
+  --td-gray-color-12: #2c2c2c;
   --td-gray-color-13: #242424;
   --td-gray-color-14: #181818;
   --td-font-white-1: rgba(255, 255, 255, 0.9);
@@ -253,13 +253,13 @@
   --td-component-stroke: var(--td-gray-color-11);
   --td-border-level-2-color: var(--td-gray-color-9);
   --td-component-border: var(--td-gray-color-9);
-  --td-shadow-1: 0px 4px 6px rgba(0, 0, 0, 0.06), 0px 1px 10px rgba(0, 0, 0, .08), 0px 2px 4px rgba(0, 0, 0, .12);
-  --td-shadow-2: 0px 8px 10px rgba(0, 0, 0, 0.12), 0px 3px 14px rgba(0, 0, 0, .1), 0px 5px 5px rgba(0, 0, 0, .16);
-  --td-shadow-3: 0px 16px 24px rgba(0, 0, 0, 0.14), 0px 6px 30px rgba(0, 0, 0, .12), 0px 8px 10px rgba(0, 0, 0, .2);
-  --td-shadow-inset-top: inset 0px 0.5px 0px #5E5E5E;
-  --td-shadow-inset-right: inset 0.5px 0px 0px #5E5E5E;
-  --td-shadow-inset-bottom: inset 0px -0.5px 0px #5E5E5E;
-  --td-shadow-inset-left: inset -0.5px 0px 0px #5E5E5E;
+  --td-shadow-1: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 10px rgba(0, 0, 0, 8%), 0 2px 4px rgba(0, 0, 0, 12%);
+  --td-shadow-2: 0 8px 10px rgba(0, 0, 0, 0.12), 0 3px 14px rgba(0, 0, 0, 10%), 0 5px 5px rgba(0, 0, 0, 16%);
+  --td-shadow-3: 0 16px 24px rgba(0, 0, 0, 0.14), 0 6px 30px rgba(0, 0, 0, 12%), 0 8px 10px rgba(0, 0, 0, 20%);
+  --td-shadow-inset-top: inset 0 0.5px 0 #5e5e5e;
+  --td-shadow-inset-right: inset 0.5px 0 0 #5e5e5e;
+  --td-shadow-inset-bottom: inset 0 -0.5px 0 #5e5e5e;
+  --td-shadow-inset-left: inset -0.5px 0 0 #5e5e5e;
   --td-table-shadow-color: rgba(0, 0, 0, 0.55);
   --td-scrollbar-color: rgba(255, 255, 255, 0.1);
 }
@@ -302,12 +302,12 @@
 }
 .t-select .t-select-selectedSingle {
   margin-left: 4px;
+  display: block;
+  color: var(--td-text-color-primary);
   white-space: nowrap;
   word-wrap: normal;
   overflow: hidden;
   text-overflow: ellipsis;
-  display: block;
-  color: var(--td-text-color-primary);
 }
 .t-select .t-select-right-icon {
   position: absolute;
@@ -329,9 +329,9 @@
   transition: -webkit-transform 0.2s cubic-bezier(0.38, 0, 0.24, 1);
   transition: transform 0.2s cubic-bezier(0.38, 0, 0.24, 1);
   transition: transform 0.2s cubic-bezier(0.38, 0, 0.24, 1), -webkit-transform 0.2s cubic-bezier(0.38, 0, 0.24, 1);
-  /*IE*/
-  -webkit-filter: FlipV;
-          filter: FlipV;
+  /* IE */
+  -webkit-filter: flipv;
+          filter: flipv;
 }
 .t-select .t-select-left-icon {
   position: absolute;
@@ -342,6 +342,12 @@
   color: var(--td-text-color-placeholder);
   -webkit-transition: color 0.2s cubic-bezier(0.38, 0, 0.24, 1);
   transition: color 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
 }
 .t-select .t-select-input {
   margin-left: 4px;
@@ -489,21 +495,23 @@
   line-height: 40px;
 }
 .t-option-group + .t-option-group {
-  border-top: 1px var(--td-border-level-1-color) solid;
   padding-top: 7px;
   margin-top: 7px;
 }
+.t-option-group__divider + .t-option-group__divider {
+  border-top: 1px var(--td-border-level-1-color) solid;
+}
 ul.t-option-group-header,
 .t-option-group-header {
   color: var(--td-text-color-placeholder);
   display: block;
+  height: 40px;
+  line-height: 22px;
+  padding: 9px 8px;
   white-space: nowrap;
   word-wrap: normal;
   overflow: hidden;
   text-overflow: ellipsis;
-  height: 40px;
-  line-height: 22px;
-  padding: 9px 12px;
 }
 .t-option-group-header.t-size-l {
   height: 48px;
@@ -516,38 +524,40 @@ ul.t-option-group-header,
 .t-select-option {
   display: block;
   border-radius: 3px;
-  white-space: nowrap;
-  word-wrap: normal;
-  overflow: hidden;
-  text-overflow: ellipsis;
   height: 40px;
   line-height: 22px;
   cursor: pointer;
-  padding: 9px 12px;
+  padding: 9px 8px;
   color: var(--td-text-color-primary);
-  --ripple-color: var(--td-bg-color-container-active);
   -webkit-transition: background-color 0.2s cubic-bezier(0.38, 0, 0.24, 1);
   transition: background-color 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+  white-space: nowrap;
+  word-wrap: normal;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  --ripple-color: var(--td-bg-color-container-active);
 }
 .t-select-option span {
   position: relative;
 }
-.t-select-option:hover {
+.t-select-option:not(.t-is-disabled):hover {
   background-color: var(--td-bg-color-container-hover);
 }
-.t-select-option:hover .t-checkbox__label {
+.t-select-option:not(.t-is-disabled):hover .t-checkbox__label {
   color: inherit;
 }
-.t-select-option:hover .t-checkbox__input {
+.t-select-option:not(.t-is-disabled):hover .t-checkbox__input {
   border-color: var(--td-brand-color);
 }
 .t-select-option .t-checkbox__label {
   color: var(--td-text-color-primary);
+  -webkit-box-flex: 1;
+      -ms-flex: 1;
+          flex: 1;
   white-space: nowrap;
   word-wrap: normal;
   overflow: hidden;
   text-overflow: ellipsis;
-  width: 100%;
 }
 .t-select-option .t-checkbox {
   width: 100%;

package/es/select/style/index.js

@@ -1,5 +1,5 @@
 /**
- * tdesign v0.17.0
+ * tdesign v0.18.2
  * (c) 2021 tdesign
  * @license MIT
  */

package/es/select/util/helper.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
-import { SelectValue, Options } from '../../_type/components/select';
-export declare const getLabel: (children: any, value: SelectValue<Options>, options: Options[]) => string;
-export declare const getMultipleTags: (values: SelectValue[]) => {
+import { SelectValue, TdOptionProps, SelectKeysType } from '../../_type/components/select';
+export declare const getLabel: (children: any, value: SelectValue<TdOptionProps>, options: TdOptionProps[], keys: SelectKeysType) => string;
+export declare const getMultipleTags: (values: SelectValue[], keys: SelectKeysType) => {
     label: any;
     value: any;
 }[];
-export declare const getSelectValueArr: (values: SelectValue | SelectValue[], activeValue: SelectValue, activeLabel?: React.ReactNode, selected?: boolean, valueType?: 'object' | 'value') => SelectValue<Options>[];
+export declare const getSelectValueArr: (values: SelectValue | SelectValue[], activeValue: SelectValue, selected?: boolean, valueType?: 'object' | 'value', keys?: SelectKeysType, objVal?: SelectValue) => SelectValue<import("../../_type/components/select").SelectOption>[];