tdesign-react 0.17.0-beta.0 → 0.18.1

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 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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"}

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

@@ -1,5 +1,5 @@
 /**
- * tdesign v0.17.0-beta.0
+ * tdesign v0.18.1
  * (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,14 +1,15 @@
 /**
- * tdesign v0.17.0-beta.0
+ * tdesign v0.18.1
  * (c) 2021 tdesign
  * @license MIT
  */
 
 import Select$1 from './base/Select.js';
 import './style/css.js';
-import '../_chunks/dep-a0803fb6.js';
-import '../_chunks/dep-bd3f1446.js';
-import '../_chunks/dep-7562bb74.js';
+import '../_type/components/select/index.js';
+import '../_chunks/dep-b05711f1.js';
+import '../_chunks/dep-24340815.js';
+import '../_chunks/dep-d056abc2.js';
 import 'react';
 import 'classnames';
 import 'lodash';
@@ -16,7 +17,7 @@ import 'tdesign-icons-react';
 import '../locale/LocalReceiver.js';
 import '../config-provider/index.js';
 import '../config-provider/ConfigProvider.js';
-import '../_chunks/dep-208842c6.js';
+import '../_chunks/dep-79c7181c.js';
 import '../config-provider/ConfigContext.js';
 import '../locale/zh_CN.js';
 import '../_util/useConfig.js';
@@ -27,18 +28,19 @@ import '../_util/noop.js';
 import '../_util/forwardRefWithStatics.js';
 import 'hoist-non-react-statics';
 import './util/helper.js';
-import '../_chunks/dep-0859ba52.js';
+import '../_chunks/dep-222f3011.js';
 import './base/OptionGroup.js';
 import '../common/FakeArrow.js';
 import '../input/index.js';
 import '../input/Input.js';
-import '../_chunks/dep-9e89d07e.js';
-import '../_chunks/dep-f10228f2.js';
-import '../_chunks/dep-fbff26c5.js';
-import '../_chunks/dep-124a41a4.js';
-import '../_chunks/dep-d5cf8459.js';
-import '../_chunks/dep-caea8b6e.js';
+import '../_chunks/dep-53a5fcb7.js';
+import '../_chunks/dep-9052d175.js';
+import '../_chunks/dep-2f74dba2.js';
+import '../_chunks/dep-45dee455.js';
+import '../_chunks/dep-b78554de.js';
+import '../_chunks/dep-c7c70ac0.js';
 import '../input/InputGroup.js';
+import '../_type/components/input/index.js';
 import '../popup/index.js';
 import '../popup/Popup.js';
 import 'react-popper';
@@ -47,15 +49,17 @@ 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-bf742b46.js';
-import '../_chunks/dep-3146ebd9.js';
-import '../_chunks/dep-31190e87.js';
-import '../_chunks/dep-2a177d24.js';
-import '../_chunks/dep-3e26b918.js';
+import '../_chunks/dep-cbd5adc9.js';
+import '../_chunks/dep-7e897399.js';
+import '../_chunks/dep-8bc12c0f.js';
+import '../_chunks/dep-776ae9a7.js';
+import '../_chunks/dep-66287469.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

@@ -532,13 +532,13 @@ ul.t-option-group-header,
 .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 {
@@ -547,7 +547,9 @@ ul.t-option-group-header,
   word-wrap: normal;
   overflow: hidden;
   text-overflow: ellipsis;
-  width: 100%;
+  -webkit-box-flex: 1;
+      -ms-flex: 1;
+          flex: 1;
 }
 .t-select-option .t-checkbox {
   width: 100%;

package/es/select/style/index.js

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

package/es/select/util/helper.js

@@ -1,14 +1,14 @@
 /**
- * tdesign v0.17.0-beta.0
+ * tdesign v0.18.1
  * (c) 2021 tdesign
  * @license MIT
  */
 
-import { _ as _toConsumableArray } from '../../_chunks/dep-0859ba52.js';
+import { _ as _toConsumableArray } from '../../_chunks/dep-222f3011.js';
 import { get, isPlainObject, isNumber, isString } from 'lodash';
 import OptionGroup from '../base/OptionGroup.js';
-import '../../_chunks/dep-7562bb74.js';
-import '../../_chunks/dep-a0803fb6.js';
+import '../../_chunks/dep-d056abc2.js';
+import '../../_chunks/dep-b05711f1.js';
 import 'react';
 import '../../_util/useConfig.js';
 import '../../config-provider/ConfigContext.js';

package/es/slider/Slider.js

@@ -1,35 +1,25 @@
 /**
- * tdesign v0.17.0-beta.0
+ * tdesign v0.18.1
  * (c) 2021 tdesign
  * @license MIT
  */
 
-import { _ as _defineProperty } from '../_chunks/dep-a0803fb6.js';
-import { _ as _typeof } from '../_chunks/dep-124a41a4.js';
-import { _ as _slicedToArray } from '../_chunks/dep-bd3f1446.js';
+import { _ as _defineProperty } from '../_chunks/dep-b05711f1.js';
+import { _ as _typeof } from '../_chunks/dep-6d4c74ed.js';
+import { _ as _slicedToArray } from '../_chunks/dep-24340815.js';
 import React__default, { forwardRef, useRef, useMemo } from 'react';
 import classNames from 'classnames';
 import useConfig from '../_util/useConfig.js';
 import useDefault from '../_util/useDefault.js';
 import { numberToPencent } from './utils/handleNumber.js';
-import Tooltip from '../tooltip/Tooltip.js';
 import InputNumber from '../input-number/InputNumber.js';
-import '../_chunks/dep-7562bb74.js';
+import SliderHandleButton from './SliderHandleButton.js';
+import { accAdd } from '../_util/number.js';
+import '../_chunks/dep-d056abc2.js';
 import '../config-provider/ConfigContext.js';
 import '../locale/zh_CN.js';
 import '../_util/noop.js';
-import '../_chunks/dep-208842c6.js';
-import '../_chunks/dep-f10228f2.js';
-import '../popup/index.js';
-import '../popup/Popup.js';
-import 'react-popper';
-import '../_util/composeRefs.js';
-import '../_util/usePrevious.js';
-import '../popup/Portal.js';
-import 'react-dom';
-import '../popup/useTriggerProps.js';
-import '../_util/useClickOutside.js';
-import './style/css.js';
+import '../_chunks/dep-79c7181c.js';
 import '../_util/useCommonClassName.js';
 import '../_util/useUpdateEffect.js';
 import '../input-number/StepHandler.js';
@@ -40,25 +30,42 @@ import '../_util/useRipple.js';
 import '../_util/setStyle.js';
 import '../loading/index.js';
 import '../loading/loading.js';
+import 'react-dom';
 import '../_util/dom.js';
 import 'raf';
-import '../_chunks/dep-31190e87.js';
-import '../_chunks/dep-fbff26c5.js';
-import '../_chunks/dep-2a177d24.js';
-import '../_chunks/dep-3e26b918.js';
-import '../_chunks/dep-3146ebd9.js';
+import '../_chunks/dep-8bc12c0f.js';
+import '../_chunks/dep-9052d175.js';
+import '../_chunks/dep-2f74dba2.js';
+import '../_chunks/dep-45dee455.js';
+import '../_chunks/dep-776ae9a7.js';
+import '../_chunks/dep-66287469.js';
+import '../_chunks/dep-7e897399.js';
 import '../_util/easing.js';
 import '../common/Portal.js';
+import './style/css.js';
+import '../_type/components/loading/index.js';
+import '../_type/components/button/index.js';
 import '../input-number/utils/numberUtils.js';
 import '../input/index.js';
 import '../input/Input.js';
-import '../_chunks/dep-9e89d07e.js';
-import '../_chunks/dep-d5cf8459.js';
-import '../_chunks/dep-caea8b6e.js';
+import '../_chunks/dep-53a5fcb7.js';
+import '../_chunks/dep-b78554de.js';
+import '../_chunks/dep-c7c70ac0.js';
 import '../_util/forwardRefWithStatics.js';
 import 'hoist-non-react-statics';
 import '../input/InputGroup.js';
 import '../_util/useDefaultValue.js';
+import '../_type/components/input/index.js';
+import '../tooltip/Tooltip.js';
+import '../popup/index.js';
+import '../popup/Popup.js';
+import 'react-popper';
+import '../_util/composeRefs.js';
+import '../_util/usePrevious.js';
+import '../popup/Portal.js';
+import '../popup/useTriggerProps.js';
+import '../_util/useClickOutside.js';
+import '../_type/components/popup/index.js';
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -92,7 +99,6 @@ var Slider = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _useConfig = useConfig(),
       classPrefix = _useConfig.classPrefix;
 
-  var movingNodeRef = useRef();
   var sliderRef = useRef();
 
   var _useDefault = useDefault(propsValue, defaultValue, onChange),
@@ -148,7 +154,7 @@ var Slider = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var allDots = useMemo(function () {
     var result = [];
 
-    for (var i = min; i <= max; i += step) {
+    for (var i = min; i <= max; i = accAdd(i, step)) {
       result.push({
         value: i,
         position: (i - min) / (max - min)
@@ -167,9 +173,10 @@ var Slider = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }) : dots;
 
   var handleInputChange = function handleInputChange(newValue, nodeIndex) {
-    var resultValue = Math.max(Math.min(max, newValue), min);
-    if (nodeIndex === LEFT_NODE && newValue > value[RIGHT_NODE]) resultValue = value[RIGHT_NODE];
-    if (nodeIndex === RIGHT_NODE && newValue < value[LEFT_NODE]) resultValue = value[LEFT_NODE];
+    var safeValue = Number(newValue.toFixed(32));
+    var resultValue = Math.max(Math.min(max, safeValue), min);
+    if (nodeIndex === LEFT_NODE && safeValue > value[RIGHT_NODE]) resultValue = value[RIGHT_NODE];
+    if (nodeIndex === RIGHT_NODE && safeValue < value[LEFT_NODE]) resultValue = value[LEFT_NODE];
 
     if (Array.isArray(value)) {
       var arrValue = value.slice();
@@ -231,27 +238,6 @@ var Slider = /*#__PURE__*/forwardRef(function (_ref, ref) {
     setPosition(position, nodeIndex);
   };
 
-  var onSliderDragging = function onSliderDragging(e) {
-    if (movingNodeRef.current !== null) onSliderChange(e, movingNodeRef.current);
-  };
-
-  var onSliderDraggingEnd = function onSliderDraggingEnd() {
-    movingNodeRef.current = null;
-    window.removeEventListener("mousemove", onSliderDragging);
-    window.removeEventListener("mouseup", onSliderDraggingEnd);
-    window.removeEventListener("touchmove", onSliderDragging);
-    window.removeEventListener("touchend", onSliderDraggingEnd);
-  };
-
-  var handleSliderMouseDown = function handleSliderMouseDown(e, nodeIndex) {
-    e.stopPropagation();
-    movingNodeRef.current = nodeIndex;
-    window.addEventListener("mousemove", onSliderDragging);
-    window.addEventListener("mouseup", onSliderDraggingEnd);
-    window.addEventListener("touchmove", onSliderDragging);
-    window.addEventListener("touchend", onSliderDraggingEnd);
-  };
-
   var handleClickMarks = function handleClickMarks(event, value2) {
     event.stopPropagation();
     nearbyValueChange(value2);
@@ -261,19 +247,17 @@ var Slider = /*#__PURE__*/forwardRef(function (_ref, ref) {
     var currentValue = renderVaule[nodeIndex];
     var tipLabel = typeof label === "string" ? label.replace(/\$\{value\}/g, currentValue.toString()) : label;
     if (tipLabel === true || !tipLabel) tipLabel = currentValue;
-    return /* @__PURE__ */React__default.createElement("div", {
+    return /* @__PURE__ */React__default.createElement(SliderHandleButton, {
+      toolTipProps: _objectSpread({
+        disabled: label === false,
+        content: tipLabel
+      }, tooltipProps),
+      classPrefix: classPrefix,
       style: style2,
-      className: classNames("".concat(classPrefix, "-slider__button-wrapper")),
-      onMouseDown: function onMouseDown(e) {
-        return handleSliderMouseDown(e, nodeIndex);
+      onChange: function onChange(e) {
+        return onSliderChange(e, nodeIndex);
       }
-    }, /* @__PURE__ */React__default.createElement(Tooltip, _objectSpread({
-      disabled: label === false,
-      placement: "top",
-      content: tipLabel
-    }, tooltipProps), /* @__PURE__ */React__default.createElement("div", {
-      className: classNames("".concat(classPrefix, "-slider__button"))
-    })));
+    });
   };
 
   return /* @__PURE__ */React__default.createElement("div", {

package/es/slider/Slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.js","sources":["../../src/slider/Slider.tsx"],"sourcesContent":["import React, { forwardRef, useMemo, useRef } from 'react';\nimport classNames from 'classnames';\nimport { TdSliderProps } from '../_type/components/slider';\nimport useConfig from '../_util/useConfig';\nimport useDefault from '../_util/useDefault';\nimport { numberToPencent } from './utils/handleNumber';\nimport { StyledProps, TNode } from '../_type';\nimport Tooltip from '../tooltip/Tooltip';\nimport InputNumber from '../input-number/InputNumber';\n\nexport type SliderProps = TdSliderProps & StyledProps;\n\nconst LEFT_NODE = 0;\nconst RIGHT_NODE = 1;\ntype SliderHandleNode = typeof LEFT_NODE | typeof RIGHT_NODE;\n\nconst Slider = forwardRef<HTMLDivElement, SliderProps>(\n  (\n    {\n      disabled,\n      inputNumberProps = true,\n      label,\n      layout = 'horizontal',\n      marks,\n      max = 100,\n      min = 0,\n      range,\n      step = 1,\n      tooltipProps,\n      value: propsValue,\n      defaultValue,\n      onChange,\n      className,\n      style,\n    },\n    ref,\n  ) => {\n    const { classPrefix } = useConfig();\n    const movingNodeRef = useRef<SliderHandleNode | null>();\n    const sliderRef = useRef<HTMLDivElement>();\n    const [value, setValue] = useDefault(propsValue, defaultValue, onChange);\n    const isVertical = layout === 'vertical';\n\n    const renderVaule = Array.isArray(value) ? value : [min, value];\n    const start = (renderVaule[LEFT_NODE] - min) / (max - min);\n    const width = (renderVaule[RIGHT_NODE] - renderVaule[LEFT_NODE]) / (max - min);\n    const end = start + width;\n\n    const dots: { value: number; label: TNode; position: number }[] = useMemo(() => {\n      // 当 marks 为数字数组\n      if (Array.isArray(marks)) {\n        if (marks.find((mark) => typeof mark !== 'number')) {\n          console.warn('The props \"marks\" only support number!');\n          return [];\n        }\n        return marks.map((mark) => ({\n          value: mark,\n          position: (mark - min) / max,\n          label: mark,\n        }));\n      }\n      // 当 marks 为对象\n      if (marks && typeof marks === 'object') {\n        const result = [];\n        // eslint-disable-next-line guard-for-in\n        for (const key in marks) {\n          const numberKey = Number(key);\n          if (typeof numberKey !== 'number' || !numberKey) {\n            console.warn('The props \"marks\" key only support number!');\n          } else {\n            result.push({\n              value: numberKey,\n              label: marks[numberKey],\n              position: (numberKey - min) / max,\n            });\n          }\n        }\n        return result;\n      }\n      return [];\n    }, [max, min, marks]);\n\n    const allDots = useMemo(() => {\n      // 默认\n      const result = [];\n      for (let i = min; i <= max; i += step) {\n        result.push({\n          value: i,\n          position: (i - min) / (max - min),\n        });\n      }\n      return result;\n    }, [max, min, step]);\n\n    const startDirection = isVertical ? 'bottom' : 'left';\n    const stepDirection = isVertical ? 'top' : 'left';\n    const sizeKey = isVertical ? 'height' : 'width';\n    const renderDots = isVertical ? dots.map((item) => ({ ...item, position: 1 - item.position })) : dots;\n\n    const handleInputChange = (newValue: number, nodeIndex: SliderHandleNode) => {\n      let resultValue = Math.max(Math.min(max, newValue), min);\n      // 判断是否出现左值大于右值\n      if (nodeIndex === LEFT_NODE && newValue > value[RIGHT_NODE]) resultValue = value[RIGHT_NODE];\n      // 判断是否出现右值大于左值\n      if (nodeIndex === RIGHT_NODE && newValue < value[LEFT_NODE]) resultValue = value[LEFT_NODE];\n      if (Array.isArray(value)) {\n        const arrValue = value.slice();\n        arrValue[nodeIndex] = resultValue;\n        setValue(arrValue);\n      } else {\n        setValue(resultValue);\n      }\n    };\n\n    const createInput = (nodeIndex: SliderHandleNode) => {\n      const inputProps = typeof inputNumberProps === 'object' ? inputNumberProps : {};\n      const currentValue = renderVaule[nodeIndex];\n\n      return (\n        <InputNumber\n          theme=\"normal\"\n          value={currentValue}\n          onChange={(value: number) => handleInputChange(Number(value), nodeIndex)}\n          className={classNames(`${classPrefix}-slider-input`, {\n            'is-vertical': isVertical,\n          })}\n          disabled={disabled}\n          {...inputProps}\n        />\n      );\n    };\n\n    const nearbyValueChange = (value: number) => {\n      const buttonBias =\n        Math.abs(value - renderVaule[LEFT_NODE]) > Math.abs(value - renderVaule[RIGHT_NODE]) ? RIGHT_NODE : LEFT_NODE;\n      handleInputChange(value, buttonBias);\n    };\n\n    const setPosition = (position: number, nodeIndex?: SliderHandleNode) => {\n      let index = 0;\n      let minDistance = 1;\n      for (let i = 0; i < allDots.length; i++) {\n        const diff = Math.abs(allDots[i].position - position);\n        if (minDistance > diff) {\n          index = i;\n          minDistance = diff;\n        }\n      }\n      const { value } = allDots[index];\n      if (nodeIndex === undefined && range) {\n        nearbyValueChange(value);\n      } else {\n        handleInputChange(value, nodeIndex);\n      }\n    };\n\n    const onSliderChange = (event: React.MouseEvent | MouseEvent, nodeIndex?: SliderHandleNode) => {\n      const clientKey = isVertical ? 'clientY' : 'clientX';\n      const sliderPositionInfo = sliderRef.current.getBoundingClientRect();\n      const sliderOffset = sliderPositionInfo[startDirection];\n      const position = ((event[clientKey] - sliderOffset) / sliderPositionInfo[sizeKey]) * (isVertical ? -1 : 1);\n      setPosition(position, nodeIndex);\n    };\n\n    const onSliderDragging = (e: MouseEvent) => {\n      if (movingNodeRef.current !== null) onSliderChange(e, movingNodeRef.current);\n    };\n\n    const onSliderDraggingEnd = () => {\n      movingNodeRef.current = null;\n      window.removeEventListener('mousemove', onSliderDragging);\n      window.removeEventListener('mouseup', onSliderDraggingEnd);\n      window.removeEventListener('touchmove', onSliderDragging);\n      window.removeEventListener('touchend', onSliderDraggingEnd);\n    };\n\n    const handleSliderMouseDown = (e: React.MouseEvent, nodeIndex: SliderHandleNode) => {\n      e.stopPropagation();\n      movingNodeRef.current = nodeIndex;\n      window.addEventListener('mousemove', onSliderDragging);\n      window.addEventListener('mouseup', onSliderDraggingEnd);\n      window.addEventListener('touchmove', onSliderDragging);\n      window.addEventListener('touchend', onSliderDraggingEnd);\n    };\n\n    const handleClickMarks = (event: React.MouseEvent, value: number) => {\n      event.stopPropagation();\n      nearbyValueChange(value);\n    };\n\n    const createHandleButton = (nodeIndex: SliderHandleNode, style: React.CSSProperties) => {\n      const currentValue = renderVaule[nodeIndex];\n      // 模板替换\n      let tipLabel = typeof label === 'string' ? label.replace(/\\$\\{value\\}/g, currentValue.toString()) : label;\n      if (tipLabel === true || !tipLabel) tipLabel = currentValue;\n\n      return (\n        <div\n          style={style}\n          className={classNames(`${classPrefix}-slider__button-wrapper`)}\n          onMouseDown={(e) => handleSliderMouseDown(e, nodeIndex)}\n        >\n          <Tooltip disabled={label === false} placement=\"top\" content={tipLabel} {...tooltipProps}>\n            <div className={classNames(`${classPrefix}-slider__button`)}></div>\n          </Tooltip>\n        </div>\n      );\n    };\n\n    return (\n      <div\n        style={{ ...style }}\n        className={classNames(`${classPrefix}-slider-contianer`, {\n          'is-vertical': isVertical,\n        })}\n        ref={ref}\n      >\n        <div\n          ref={sliderRef}\n          className={classNames(className, `${classPrefix}-slider`, {\n            [`${classPrefix}-is-disabled`]: disabled,\n            [`${classPrefix}-slider-vertical`]: isVertical,\n            [`${classPrefix}-slider--with-input`]: inputNumberProps,\n          })}\n          onClick={onSliderChange}\n        >\n          <div className={classNames(`${classPrefix}-slider__rail`)}>\n            <div\n              style={{ [startDirection]: numberToPencent(start), [sizeKey]: numberToPencent(width) }}\n              className={classNames(`${classPrefix}-slider__track`)}\n            ></div>\n            {range ? createHandleButton(LEFT_NODE, { [startDirection]: numberToPencent(start) }) : null}\n            {createHandleButton(RIGHT_NODE, { [startDirection]: numberToPencent(end) })}\n            <div className={classNames(`${classPrefix}-slider__step`)}>\n              {renderDots.map(({ position, value }) => (\n                <div\n                  key={value}\n                  style={{ [stepDirection]: numberToPencent(position) }}\n                  className={classNames(`${classPrefix}-slider__stop`)}\n                ></div>\n              ))}\n            </div>\n            <div className={classNames(`${classPrefix}-slider__mark`)}>\n              {renderDots.map(({ position, value, label }) => (\n                <div\n                  key={value}\n                  onClick={(event) => handleClickMarks(event, value)}\n                  style={{ [stepDirection]: numberToPencent(position) }}\n                  className={classNames(`${classPrefix}-slider__mark-text`)}\n                >\n                  {label}\n                </div>\n              ))}\n            </div>\n          </div>\n        </div>\n        {inputNumberProps ? (\n          <div className={classNames(`${classPrefix}-slider-input-container`)}>\n            {range && createInput(LEFT_NODE)}\n            {createInput(RIGHT_NODE)}\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\n\nSlider.displayName = 'Slider';\n\nexport default Slider;\n"],"names":["LEFT_NODE","RIGHT_NODE","Slider","forwardRef","ref","disabled","inputNumberProps","label","layout","marks","max","min","range","step","tooltipProps","propsValue","value","defaultValue","onChange","className","style","useConfig","classPrefix","movingNodeRef","useRef","sliderRef","useDefault","setValue","isVertical","renderVaule","Array","isArray","start","width","end","dots","useMemo","find","mark","warn","map","position","result","key","numberKey","Number","push","allDots","i","startDirection","stepDirection","sizeKey","renderDots","item","handleInputChange","newValue","nodeIndex","resultValue","Math","arrValue","slice","createInput","inputProps","currentValue","InputNumber","theme","value2","classNames","nearbyValueChange","buttonBias","abs","setPosition","index","minDistance","length","diff","onSliderChange","event","clientKey","sliderPositionInfo","current","getBoundingClientRect","sliderOffset","onSliderDragging","e","onSliderDraggingEnd","removeEventListener","handleSliderMouseDown","stopPropagation","addEventListener","handleClickMarks","createHandleButton","style2","tipLabel","replace","toString","onMouseDown","Tooltip","placement","content","onClick","numberToPencent","label2","displayName"],"mappings":"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"}
+{"version":3,"file":"Slider.js","sources":["../../src/slider/Slider.tsx"],"sourcesContent":["import React, { forwardRef, useMemo, useRef } from 'react';\nimport classNames from 'classnames';\nimport { TdSliderProps } from '../_type/components/slider';\nimport useConfig from '../_util/useConfig';\nimport useDefault from '../_util/useDefault';\nimport { numberToPencent } from './utils/handleNumber';\nimport { StyledProps, TNode } from '../_type';\nimport InputNumber from '../input-number/InputNumber';\nimport SliderHandleButton from './SliderHandleButton';\nimport { accAdd } from '../_util/number';\n\nexport type SliderProps = TdSliderProps & StyledProps;\n\nconst LEFT_NODE = 0;\nconst RIGHT_NODE = 1;\ntype SliderHandleNode = typeof LEFT_NODE | typeof RIGHT_NODE;\n\nconst Slider = forwardRef<HTMLDivElement, SliderProps>(\n  (\n    {\n      disabled,\n      inputNumberProps = true,\n      label,\n      layout = 'horizontal',\n      marks,\n      max = 100,\n      min = 0,\n      range,\n      step = 1,\n      tooltipProps,\n      value: propsValue,\n      defaultValue,\n      onChange,\n      className,\n      style,\n    },\n    ref,\n  ) => {\n    const { classPrefix } = useConfig();\n    const sliderRef = useRef<HTMLDivElement>();\n    const [value, setValue] = useDefault(propsValue, defaultValue, onChange);\n    const isVertical = layout === 'vertical';\n\n    const renderVaule = Array.isArray(value) ? value : [min, value];\n    const start = (renderVaule[LEFT_NODE] - min) / (max - min);\n    const width = (renderVaule[RIGHT_NODE] - renderVaule[LEFT_NODE]) / (max - min);\n    const end = start + width;\n\n    const dots: { value: number; label: TNode; position: number }[] = useMemo(() => {\n      // 当 marks 为数字数组\n      if (Array.isArray(marks)) {\n        if (marks.find((mark) => typeof mark !== 'number')) {\n          console.warn('The props \"marks\" only support number!');\n          return [];\n        }\n        return marks.map((mark) => ({\n          value: mark,\n          position: (mark - min) / max,\n          label: mark,\n        }));\n      }\n      // 当 marks 为对象\n      if (marks && typeof marks === 'object') {\n        const result = [];\n        // eslint-disable-next-line guard-for-in\n        for (const key in marks) {\n          const numberKey = Number(key);\n          if (typeof numberKey !== 'number' || !numberKey) {\n            console.warn('The props \"marks\" key only support number!');\n          } else {\n            result.push({\n              value: numberKey,\n              label: marks[numberKey],\n              position: (numberKey - min) / max,\n            });\n          }\n        }\n        return result;\n      }\n      return [];\n    }, [max, min, marks]);\n\n    const allDots = useMemo(() => {\n      // 默认\n      const result = [];\n      for (let i = min; i <= max; i = accAdd(i, step)) {\n        result.push({\n          value: i,\n          position: (i - min) / (max - min),\n        });\n      }\n      return result;\n    }, [max, min, step]);\n\n    const startDirection = isVertical ? 'bottom' : 'left';\n    const stepDirection = isVertical ? 'top' : 'left';\n    const sizeKey = isVertical ? 'height' : 'width';\n    const renderDots = isVertical ? dots.map((item) => ({ ...item, position: 1 - item.position })) : dots;\n\n    const handleInputChange = (newValue: number, nodeIndex: SliderHandleNode) => {\n      const safeValue = Number(newValue.toFixed(32));\n      let resultValue = Math.max(Math.min(max, safeValue), min);\n      // 判断是否出现左值大于右值\n      if (nodeIndex === LEFT_NODE && safeValue > value[RIGHT_NODE]) resultValue = value[RIGHT_NODE];\n      // 判断是否出现右值大于左值\n      if (nodeIndex === RIGHT_NODE && safeValue < value[LEFT_NODE]) resultValue = value[LEFT_NODE];\n      if (Array.isArray(value)) {\n        const arrValue = value.slice();\n        arrValue[nodeIndex] = resultValue;\n        setValue(arrValue);\n      } else {\n        setValue(resultValue);\n      }\n    };\n\n    const createInput = (nodeIndex: SliderHandleNode) => {\n      const inputProps = typeof inputNumberProps === 'object' ? inputNumberProps : {};\n      const currentValue = renderVaule[nodeIndex];\n\n      return (\n        <InputNumber\n          theme=\"normal\"\n          value={currentValue}\n          onChange={(value: number) => handleInputChange(Number(value), nodeIndex)}\n          className={classNames(`${classPrefix}-slider-input`, {\n            'is-vertical': isVertical,\n          })}\n          disabled={disabled}\n          {...inputProps}\n        />\n      );\n    };\n\n    const nearbyValueChange = (value: number) => {\n      const buttonBias =\n        Math.abs(value - renderVaule[LEFT_NODE]) > Math.abs(value - renderVaule[RIGHT_NODE]) ? RIGHT_NODE : LEFT_NODE;\n      handleInputChange(value, buttonBias);\n    };\n\n    const setPosition = (position: number, nodeIndex?: SliderHandleNode) => {\n      let index = 0;\n      let minDistance = 1;\n      for (let i = 0; i < allDots.length; i++) {\n        const diff = Math.abs(allDots[i].position - position);\n        if (minDistance > diff) {\n          index = i;\n          minDistance = diff;\n        }\n      }\n      const { value } = allDots[index];\n      if (nodeIndex === undefined && range) {\n        nearbyValueChange(value);\n      } else {\n        handleInputChange(value, nodeIndex);\n      }\n    };\n\n    const onSliderChange = (event: React.MouseEvent | MouseEvent, nodeIndex?: SliderHandleNode) => {\n      const clientKey = isVertical ? 'clientY' : 'clientX';\n      const sliderPositionInfo = sliderRef.current.getBoundingClientRect();\n      const sliderOffset = sliderPositionInfo[startDirection];\n      const position = ((event[clientKey] - sliderOffset) / sliderPositionInfo[sizeKey]) * (isVertical ? -1 : 1);\n      setPosition(position, nodeIndex);\n    };\n\n    const handleClickMarks = (event: React.MouseEvent, value: number) => {\n      event.stopPropagation();\n      nearbyValueChange(value);\n    };\n\n    const createHandleButton = (nodeIndex: SliderHandleNode, style: React.CSSProperties) => {\n      const currentValue = renderVaule[nodeIndex];\n      // 模板替换\n      let tipLabel = typeof label === 'string' ? label.replace(/\\$\\{value\\}/g, currentValue.toString()) : label;\n      if (tipLabel === true || !tipLabel) tipLabel = currentValue;\n\n      return (\n        <SliderHandleButton\n          toolTipProps={{\n            disabled: label === false,\n            content: tipLabel,\n            ...tooltipProps,\n          }}\n          classPrefix={classPrefix}\n          style={style}\n          onChange={(e) => onSliderChange(e, nodeIndex)}\n        />\n      );\n    };\n\n    return (\n      <div\n        style={{ ...style }}\n        className={classNames(`${classPrefix}-slider-contianer`, {\n          'is-vertical': isVertical,\n        })}\n        ref={ref}\n      >\n        <div\n          ref={sliderRef}\n          className={classNames(className, `${classPrefix}-slider`, {\n            [`${classPrefix}-is-disabled`]: disabled,\n            [`${classPrefix}-slider-vertical`]: isVertical,\n            [`${classPrefix}-slider--with-input`]: inputNumberProps,\n          })}\n          onClick={onSliderChange}\n        >\n          <div className={classNames(`${classPrefix}-slider__rail`)}>\n            <div\n              style={{ [startDirection]: numberToPencent(start), [sizeKey]: numberToPencent(width) }}\n              className={classNames(`${classPrefix}-slider__track`)}\n            ></div>\n            {range ? createHandleButton(LEFT_NODE, { [startDirection]: numberToPencent(start) }) : null}\n            {createHandleButton(RIGHT_NODE, { [startDirection]: numberToPencent(end) })}\n            <div className={classNames(`${classPrefix}-slider__step`)}>\n              {renderDots.map(({ position, value }) => (\n                <div\n                  key={value}\n                  style={{ [stepDirection]: numberToPencent(position) }}\n                  className={classNames(`${classPrefix}-slider__stop`)}\n                ></div>\n              ))}\n            </div>\n            <div className={classNames(`${classPrefix}-slider__mark`)}>\n              {renderDots.map(({ position, value, label }) => (\n                <div\n                  key={value}\n                  onClick={(event) => handleClickMarks(event, value)}\n                  style={{ [stepDirection]: numberToPencent(position) }}\n                  className={classNames(`${classPrefix}-slider__mark-text`)}\n                >\n                  {label}\n                </div>\n              ))}\n            </div>\n          </div>\n        </div>\n        {inputNumberProps ? (\n          <div className={classNames(`${classPrefix}-slider-input-container`)}>\n            {range && createInput(LEFT_NODE)}\n            {createInput(RIGHT_NODE)}\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\n\nSlider.displayName = 'Slider';\n\nexport default Slider;\n"],"names":["LEFT_NODE","RIGHT_NODE","Slider","forwardRef","ref","disabled","inputNumberProps","label","layout","marks","max","min","range","step","tooltipProps","propsValue","value","defaultValue","onChange","className","style","useConfig","classPrefix","sliderRef","useRef","useDefault","setValue","isVertical","renderVaule","Array","isArray","start","width","end","dots","useMemo","find","mark","warn","map","position","result","key","numberKey","Number","push","allDots","i","accAdd","startDirection","stepDirection","sizeKey","renderDots","item","handleInputChange","newValue","nodeIndex","safeValue","toFixed","resultValue","Math","arrValue","slice","createInput","inputProps","currentValue","InputNumber","theme","value2","classNames","nearbyValueChange","buttonBias","abs","setPosition","index","minDistance","length","diff","onSliderChange","event","clientKey","sliderPositionInfo","current","getBoundingClientRect","sliderOffset","handleClickMarks","stopPropagation","createHandleButton","style2","tipLabel","replace","toString","SliderHandleButton","toolTipProps","content","e","onClick","numberToPencent","label2","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,IAAMA,YAAY,CAAlB;AACA,IAAMC,aAAa,CAAnB;IAGMC,sBAASC,WACb,gBAkBEC,GAlBF,EAmBK;AAAA;;AAAA,MAjBDC,QAiBC,QAjBDA,QAiBC;AAAA,mCAhBDC,gBAgBC;AAAA,MAhBDA,gBAgBC,sCAhBkB,IAgBlB;AAAA,MAfDC,KAeC,QAfDA,KAeC;AAAA,yBAdDC,MAcC;AAAA,MAdDA,MAcC,4BAdQ,YAcR;AAAA,MAbDC,KAaC,QAbDA,KAaC;AAAA,sBAZDC,GAYC;AAAA,MAZDA,GAYC,yBAZK,GAYL;AAAA,sBAXDC,GAWC;AAAA,MAXDA,GAWC,yBAXK,CAWL;AAAA,MAVDC,KAUC,QAVDA,KAUC;AAAA,uBATDC,IASC;AAAA,MATDA,IASC,0BATM,CASN;AAAA,MARDC,YAQC,QARDA,YAQC;AAAA,MAPMC,UAON,QAPDC,KAOC;AAAA,MANDC,YAMC,QANDA,YAMC;AAAA,MALDC,QAKC,QALDA,QAKC;AAAA,MAJDC,SAIC,QAJDA,SAIC;AAAA,MAHDC,KAGC,QAHDA,KAGC;;mBACqBC;MAAhBC,yBAAAA;;MACFC,YAAYC;;oBACQC,WAAWV,YAAYE,cAAcC;;MAAxDF;MAAOU;;MACRC,aAAanB,WAAW;MAExBoB,cAAcC,MAAMC,OAAN,CAAcd,KAAd,IAAuBA,KAAvB,GAA+B,CAACL,GAAD,EAAMK,KAAN;MAC7Ce,QAAS,aAAY/B,aAAaW,GAAzB,WAAuCA,GAAvC;MACTqB,QAAS,aAAY/B,cAAc2B,YAAY5B,UAAtC,WAA2DW,GAA3D;MACTsB,MAAMF,QAAQC;MAEdE,OAA4DC,QAAQ,YAAM;QAE1EN,MAAMC,OAAN,CAAcrB,KAAd,GAAsB;UACpBA,MAAM2B,IAAN,CAAW,UAACC,IAAD;AAAA,eAAU,OAAOA,IAAP,KAAgB,QAA1B;AAAA,OAAX,GAAgD;gBAC1CC,KAAK;eACN;;;aAEF7B,MAAM8B,GAAN,CAAU,UAACF,IAAD;AAAA;AACfrB,UAAAA,OAAOqB;AACPG,UAAAA,UAAW,QAAO7B,GAAP,IAAcD;AACzBH,UAAAA,OAAO8B;SAHQ;AAAA,OAAV;;;QAOL5B,SAAS,QAAOA,KAAP,MAAiB,UAAU;UAChCgC,SAAS;;eAEJC,OAAOjC,OAAO;YACjBkC,YAAYC,OAAOF;;YACrB,OAAOC,SAAP,KAAqB,QAArB,IAAiC,CAACA,WAAW;kBACvCL,KAAK;eACR;iBACEO,KAAK;AACV7B,YAAAA,OAAO2B,SADG;AAEVpC,YAAAA,OAAOE,MAAMkC,UAFH;AAGVH,YAAAA,UAAW,aAAY7B,GAAZ,IAAmBD;AAHpB;;;;aAOT+B;;;WAEF;KACN,CAAC/B,GAAD,EAAMC,GAAN,EAAWF,KAAX;MAEGqC,UAAUX,QAAQ,YAAM;QAEtBM,SAAS;;aACNM,IAAIpC,KAAKoC,KAAKrC,KAAKqC,IAAIC,OAAOD,GAAGlC,OAAO;aACxCgC,KAAK;AACV7B,QAAAA,OAAO+B,CADG;AAEVP,QAAAA,UAAW,KAAI7B,GAAJ,WAAkBA,GAAlB;AAFD;;;WAKP8B;KACN,CAAC/B,GAAD,EAAMC,GAAN,EAAWE,IAAX;MAEGoC,iBAAiBtB,aAAa,WAAW;MACzCuB,gBAAgBvB,aAAa,QAAQ;MACrCwB,UAAUxB,aAAa,WAAW;MAClCyB,aAAazB,aAAaO,KAAKK,GAAL,CAAS,UAACc,IAAD;AAAA,2CAAgBA,IAAhB;AAAsBb,MAAAA,UAAU,IAAIa,KAAKb;AAAzC;AAAA,GAAT,IAAiEN;;MAE3FoB,oBAAoB,SAApBA,iBAAoB,CAACC,QAAD,EAAmBC,SAAnB,EAAmD;QACrEC,YAAYb,OAAOW,SAASG,OAAT,CAAiB,EAAjB;QACrBC,cAAcC,KAAKlD,GAAL,CAASkD,KAAKjD,GAAL,CAASD,GAAT,EAAc+C,SAAd,CAAT,EAAmC9C,GAAnC;QAEd6C,cAAcxD,SAAd,IAA2ByD,YAAYzC,MAAMf,2BAA2Be,MAAMf;QAE9EuD,cAAcvD,UAAd,IAA4BwD,YAAYzC,MAAMhB,0BAA0BgB,MAAMhB;;QAC9E6B,MAAMC,OAAN,CAAcd,KAAd,GAAsB;UAClB6C,WAAW7C,MAAM8C,KAAN;eACRN,aAAaG;eACbE;WACJ;eACIF;;;;MAIPI,cAAc,SAAdA,WAAc,CAACP,SAAD,EAAiC;QAC7CQ,aAAa,QAAO1D,gBAAP,MAA4B,QAA5B,GAAuCA,gBAAvC,GAA0D;QACvE2D,eAAerC,YAAY4B;uDAG9BU;AACCC,MAAAA,OAAM;AACNnD,MAAAA,OAAOiD;AACP/C,MAAAA,UAAU,kBAACkD,MAAD;AAAA,eAAmBd,kBAAkBV,OAAOwB,SAAQZ,UAApD;AAAA;AACVrC,MAAAA,WAAWkD,qBAAc/C,+BAA4B;AACnD,uBAAeK;AADoC;AAGrDtB,MAAAA,UAAAA;OACI2D;;;MAKJM,oBAAoB,SAApBA,iBAAoB,CAACF,MAAD,EAAmB;QACrCG,aACJX,KAAKY,GAAL,CAASJ,SAAQxC,YAAY5B,UAA7B,IAA2C4D,KAAKY,GAAL,CAASJ,SAAQxC,YAAY3B,WAA7B,CAA3C,GAAuFA,UAAvF,GAAoGD;sBACpFoE,QAAOG;;;MAGrBE,cAAc,SAAdA,WAAc,CAACjC,QAAD,EAAmBgB,SAAnB,EAAoD;QAClEkB,QAAQ;QACRC,cAAc;;aACT5B,IAAI,GAAGA,IAAID,QAAQ8B,QAAQ7B,KAAK;UACjC8B,OAAOjB,KAAKY,GAAL,CAAS1B,QAAQC,EAAR,CAAWP,QAAX,GAAsBA,QAA/B;;UACTmC,cAAcE,MAAM;gBACd9B;sBACM8B;;;;iBAGA/B,QAAQ4B,OAAlB1D;;QACJwC,cAAc,MAAd,IAA2B5C,OAAO;wBAClBwD;WACb;wBACaA,QAAOZ;;;;MAIvBsB,iBAAiB,SAAjBA,cAAiB,CAACC,KAAD,EAAuCvB,SAAvC,EAAwE;QACvFwB,YAAYrD,aAAa,YAAY;QACrCsD,qBAAqB1D,UAAU2D,OAAV,CAAkBC,qBAAlB;QACrBC,eAAeH,mBAAmBhC;QAClCT,WAAa,OAAMwC,aAAaI,YAAnB,IAAmCH,mBAAmB9B,QAAtD,iBAAgF,KAAK,CAArF;gBACPX,UAAUgB;;;MAGlB6B,mBAAmB,SAAnBA,gBAAmB,CAACN,KAAD,EAA0BX,MAA1B,EAA4C;UAC7DkB;sBACYlB;;;MAGdmB,qBAAqB,SAArBA,kBAAqB,CAAC/B,SAAD,EAA8BgC,MAA9B,EAA6D;QAChFvB,eAAerC,YAAY4B;QAE7BiC,WAAW,OAAOlF,KAAP,KAAiB,QAAjB,GAA4BA,MAAMmF,OAAN,CAAc,cAAd,EAA8BzB,aAAa0B,QAAb,EAA9B,CAA5B,GAAqFpF;QAChGkF,aAAa,IAAb,IAAqB,CAACA,qBAAqBxB;uDAG5C2B,oBAAD;AACEC,MAAAA;AACExF,QAAAA,UAAUE,UAAU;AACpBuF,QAAAA,SAASL;SACN3E,aAJP;AAMEQ,MAAAA,aAAAA,WANF;AAOEF,MAAAA,OAAOoE,MAPT;AAQEtE,MAAAA,UAAU,kBAAC6E,CAAD;AAAA,eAAOjB,eAAeiB,GAAGvC,UAAzB;AAAA;AARZ;;;qDAcD,OAAD;AACEpC,IAAAA,yBAAYA,MADd;AAEED,IAAAA,WAAWkD,qBAAc/C,mCAAgC;AACvD,qBAAeK;AADwC,MAF3D;AAKEvB,IAAAA,KAAAA;AALF,iDAOG,OAAD;AACEA,IAAAA,KAAKmB,SADP;AAEEJ,IAAAA,WAAWkD,WAAWlD,qBAAcG,mFAC9BA,8BAA4BjB,kDAC5BiB,kCAAgCK,oDAChCL,qCAAmChB,gCAL3C;AAOE0F,IAAAA,SAASlB;AAPX,iDASG,OAAD;AAAK3D,IAAAA,WAAWkD,qBAAc/C;AAA9B,iDACG,OAAD;AACEF,IAAAA,6CAAU6B,gBAAiBgD,gBAAgBlE,iCAASoB,SAAU8C,gBAAgBjE,gBADhF;AAEEb,IAAAA,WAAWkD,qBAAc/C;AAF3B,MAICV,QAAQ2E,mBAAmBvF,+BAAciD,gBAAiBgD,gBAAgBlE,WAAY,MACtFwD,mBAAmBtF,gCAAegD,gBAAiBgD,gBAAgBhE,oDACnE,OAAD;AAAKd,IAAAA,WAAWkD,qBAAc/C;AAA9B,KACG8B,WAAWb,GAAX,CAAe;AAAA,QAAGC,QAAH,SAAGA,QAAH;AAAA,cAAA,SAAaxB,KAAb;AAAA,uDACb,OAAD;AACE0B,MAAAA,KAAK0B,MADP;AAEEhD,MAAAA,2BAAU8B,eAAgB+C,gBAAgBzD,UAF5C;AAGErB,MAAAA,WAAWkD,qBAAc/C;AAH3B,MADc;AAAA,GAAf,gDAQF,OAAD;AAAKH,IAAAA,WAAWkD,qBAAc/C;AAA9B,KACG8B,WAAWb,GAAX,CAAe;AAAA,QAAGC,QAAH,SAAGA,QAAH;AAAA,cAAA,SAAaxB,KAAb;AAAA,cAAA,SAAoBT,KAApB;AAAA,uDACb,OAAD;AACEmC,MAAAA,KAAK0B,MADP;AAEE4B,MAAAA,SAAS,iBAACjB,KAAD;AAAA,eAAWM,iBAAiBN,OAAOX,OAAnC;AAAA,OAFX;AAGEhD,MAAAA,2BAAU8B,eAAgB+C,gBAAgBzD,UAH5C;AAIErB,MAAAA,WAAWkD,qBAAc/C;AAJ3B,OAMG4E,OAPW;AAAA,GAAf,MAaN5F,+DACE,OAAD;AAAKa,IAAAA,WAAWkD,qBAAc/C;AAA9B,KACGV,SAASmD,YAAY/D,YACrB+D,YAAY9D,eAEb;;AAMZC,OAAOiG,WAAP,GAAqB,QAArB;;;;"}

package/es/slider/SliderHandleButton.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { TdTooltipProps } from '../_type/components/tooltip';
+interface SliderHandleButtonProps {
+    onChange: (event: React.MouseEvent | MouseEvent) => void;
+    classPrefix: string;
+    style: React.CSSProperties;
+    toolTipProps: TdTooltipProps;
+}
+declare const SliderHandleButton: React.FC<SliderHandleButtonProps>;
+export default SliderHandleButton;