tdesign-react 0.25.0 → 0.25.3-alpha.1

package/lib/select-input/index.js

@@ -0,0 +1,89 @@
+/**
+ * tdesign v0.25.3-alpha.1
+ * (c) 2022 tdesign
+ * @license MIT
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var selectInput_SelectInput = require('./SelectInput.js');
+require('../_chunks/dep-728c3d30.js');
+require('react');
+require('classnames');
+require('../_util/useConfig.js');
+require('../_chunks/dep-cb1cdc62.js');
+require('../_chunks/dep-94ac5bc2.js');
+require('../_chunks/dep-d5c34a19.js');
+require('../_chunks/dep-b81d09ba.js');
+require('../_chunks/dep-9ac45eb1.js');
+require('../_chunks/dep-0e51d993.js');
+require('../_chunks/dep-e92e2bb4.js');
+require('../_chunks/dep-09c2324b.js');
+require('../_chunks/dep-aef3883a.js');
+require('../_chunks/dep-4d02f91f.js');
+require('../_chunks/dep-f7cad145.js');
+require('../_chunks/dep-d5b1028b.js');
+require('../_chunks/dep-fe8b0b86.js');
+require('../_chunks/dep-32b793ca.js');
+require('../_chunks/dep-3a37dd17.js');
+require('../_chunks/dep-b4f37218.js');
+require('../_common/js/locale/zh_CN.js');
+require('../config-provider/defaultConfig.js');
+require('../popup/index.js');
+require('../popup/Popup.js');
+require('../_chunks/dep-402b9452.js');
+require('../_chunks/dep-20cb3e75.js');
+require('react-transition-group');
+require('react-popper');
+require('../_util/useDefault.js');
+require('../_util/noop.js');
+require('../_util/useAnimation.js');
+require('../_util/composeRefs.js');
+require('../common/Portal.js');
+require('react-dom');
+require('../_util/dom.js');
+require('raf');
+require('../_chunks/dep-a2749c28.js');
+require('../_util/easing.js');
+require('../popup/hooks/useTriggerProps.js');
+require('../_util/useClickOutside.js');
+require('../popup/utils/getTransitionParams.js');
+require('./useSingle.js');
+require('../_chunks/dep-620f8a64.js');
+require('../_chunks/dep-6e35a7fc.js');
+require('../_chunks/dep-9c3742b4.js');
+require('../_chunks/dep-cbdb9d60.js');
+require('../_chunks/dep-793b82fb.js');
+require('../_chunks/dep-bec18e34.js');
+require('../_chunks/dep-136475a2.js');
+require('../_chunks/dep-4f843491.js');
+require('../_chunks/dep-3bb6344b.js');
+require('../input/index.js');
+require('../input/Input.js');
+require('../_chunks/dep-7b67ce1a.js');
+require('tdesign-icons-react');
+require('../_util/forwardRefWithStatics.js');
+require('hoist-non-react-statics');
+require('../input/InputGroup.js');
+require('../_util/useDefaultValue.js');
+require('./useMultiple.js');
+require('../tag-input/index.js');
+require('../tag-input/TagInput.js');
+require('../_util/useDragSorter.js');
+require('../tag-input/useTagScroll.js');
+require('../tag-input/useTagList.js');
+require('../_chunks/dep-b41f5892.js');
+require('lodash');
+require('../tag/index.js');
+require('../tag/Tag.js');
+require('../tag/CheckTag.js');
+require('../tag-input/useHover.js');
+require('./useOverlayStyle.js');
+
+var SelectInput = selectInput_SelectInput["default"];
+
+exports.SelectInput = SelectInput;
+exports["default"] = SelectInput;
+//# sourceMappingURL=index.js.map

package/lib/select-input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/select-input/index.ts"],"sourcesContent":["import _SelectInput from './SelectInput';\n\nimport './style/index.js';\n\nexport type { SelectInputProps } from './SelectInput';\nexport * from './type';\n\nexport const SelectInput = _SelectInput;\nexport default SelectInput;\n"],"names":["SelectInput","_SelectInput"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGaA,WAAW,GAAGC;;;;;"}

package/lib/select-input/style/css.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/select-input/style/index.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/select-input/type.d.ts

@@ -0,0 +1,206 @@
+/**
+ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC
+ * */
+import { InputProps, InputValue } from '../input';
+import { PopupProps } from '../popup';
+import { TagInputProps, TagInputValue, TagInputChangeContext } from '../tag-input';
+import { TagProps } from '../tag';
+import { PopupVisibleChangeContext } from '../popup';
+import { TNode, TElement } from '../common';
+import { MouseEvent, KeyboardEvent, ClipboardEvent, FocusEvent, FormEvent } from 'react';
+export interface TdSelectInputProps {
+    /**
+     * 是否允许输入
+     * @default false
+     */
+    allowInput?: boolean;
+    /**
+     * 宽度随内容自适应
+     * @default false
+     */
+    autoWidth?: boolean;
+    /**
+     * 无边框模式
+     * @default false
+     */
+    borderless?: boolean;
+    /**
+     * 是否可清空
+     * @default false
+     */
+    clearable?: boolean;
+    /**
+     * 标签过多的情况下，折叠项内容，默认为 `+N`。如果需要悬浮就显示其他内容，可以使用 `collapsedItems` 自定义。`value` 表示所有标签值，`collapsedTags` 表示折叠标签值，`count` 表示总标签数量
+     */
+    collapsedItems?: TNode<{
+        value: SelectInputValue;
+        collapsedTags: SelectInputValue;
+        count: number;
+    }>;
+    /**
+     * 是否禁用
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * 透传 Input 输入框组件全部属性
+     */
+    inputProps?: InputProps;
+    /**
+     * 输入框的值
+     */
+    inputValue?: InputValue;
+    /**
+     * 输入框的值，非受控属性
+     */
+    defaultInputValue?: InputValue;
+    /**
+     * 定义字段别名，示例：`{ label: 'text', value: 'id', children: 'list' }`
+     */
+    keys?: SelectInputKeys;
+    /**
+     * 左侧文本
+     */
+    label?: TNode;
+    /**
+     * 最小折叠数量，用于标签数量过多的情况下折叠选中项，超出该数值的选中项折叠。值为 0 则表示不折叠
+     * @default 0
+     */
+    minCollapsedNum?: number;
+    /**
+     * 是否为多选模式，默认为单选
+     * @default false
+     */
+    multiple?: boolean;
+    /**
+     * 下拉框内容，可完全自定义
+     */
+    panel?: TNode;
+    /**
+     * 占位符
+     * @default ''
+     */
+    placeholder?: string;
+    /**
+     * 透传 Popup 浮层组件全部属性
+     */
+    popupProps?: PopupProps;
+    /**
+     * 是否显示下拉框，受控属性
+     */
+    popupVisible?: boolean;
+    /**
+     * 是否只读，值为真会隐藏输入框，且无法打开下拉框
+     * @default false
+     */
+    readonly?: boolean;
+    /**
+     * 输入框状态
+     */
+    status?: 'success' | 'warning' | 'error';
+    /**
+     * 后置图标前的后置内容
+     */
+    suffix?: TNode;
+    /**
+     * 组件后置图标
+     */
+    suffixIcon?: TElement;
+    /**
+     * 自定义标签的内部内容，每一个标签的当前值。注意和 `valueDisplay` 区分，`valueDisplay`  是用来定义全部标签内容，而非某一个标签
+     */
+    tag?: string | TNode<{
+        value: string | number;
+    }>;
+    /**
+     * 透传 TagInput 组件全部属性
+     */
+    tagInputProps?: TagInputProps;
+    /**
+     * 透传 Tag 标签组件全部属性
+     */
+    tagProps?: TagProps;
+    /**
+     * 输入框下方提示文本，会根据不同的 `status` 呈现不同的样式
+     */
+    tips?: TNode;
+    /**
+     * 全部标签值。值为数组表示多个标签，值为非数组表示单个数值
+     */
+    value?: SelectInputValue;
+    /**
+     * 自定义值呈现的全部内容，参数为所有标签的值
+     */
+    valueDisplay?: string | TNode<{
+        value: SelectInputValue;
+        onClose: (index: number, item?: any) => void;
+    }>;
+    /**
+     * 失去焦点时触发，`context.inputValue` 表示输入框的值；`context.tagInputValue` 表示标签输入框的值
+     */
+    onBlur?: (value: SelectInputValue, context: SelectInputFocusContext) => void;
+    /**
+     * 清空按钮点击时触发
+     */
+    onClear?: (context: {
+        e: MouseEvent<SVGElement>;
+    }) => void;
+    /**
+     * 按键按下 Enter 时触发
+     */
+    onEnter?: (value: SelectInputValue, context: {
+        e: KeyboardEvent<HTMLDivElement>;
+        inputValue: InputValue;
+    }) => void;
+    /**
+     * 聚焦时触发
+     */
+    onFocus?: (value: SelectInputValue, context: SelectInputFocusContext) => void;
+    /**
+     * 输入框值发生变化时触发，`context.trigger` 表示触发输入框值变化的来源：文本输入触发、清除按钮触发、失去焦点等
+     */
+    onInputChange?: (value: InputValue, context?: SelectInputValueChangeContext) => void;
+    /**
+     * 进入输入框时触发
+     */
+    onMouseenter?: (context: {
+        e: MouseEvent<HTMLDivElement>;
+    }) => void;
+    /**
+     * 离开输入框时触发
+     */
+    onMouseleave?: (context: {
+        e: MouseEvent<HTMLDivElement>;
+    }) => void;
+    /**
+     * 粘贴事件，`pasteValue` 表示粘贴板的内容
+     */
+    onPaste?: (context: {
+        e: ClipboardEvent<HTMLDivElement>;
+        pasteValue: string;
+    }) => void;
+    /**
+     * 下拉框显示或隐藏时触发
+     */
+    onPopupVisibleChange?: (visible: boolean, context: PopupVisibleChangeContext) => void;
+    /**
+     * 值变化时触发，参数 `context.trigger` 表示数据变化的触发来源；`context.index` 指当前变化项的下标；`context.item` 指当前变化项；`context.e` 表示事件参数
+     */
+    onTagChange?: (value: SelectInputValue, context: SelectInputChangeContext) => void;
+}
+export interface SelectInputKeys {
+    label?: string;
+    value?: string;
+    children?: string;
+}
+export declare type SelectInputValue = string | number | boolean | Date | Object | Array<any> | Array<SelectInputValue>;
+export interface SelectInputFocusContext {
+    inputValue: InputValue;
+    tagInputValue?: TagInputValue;
+    e: FocusEvent<HTMLInputElement>;
+}
+export interface SelectInputValueChangeContext {
+    e?: FormEvent<HTMLDivElement> | MouseEvent<HTMLElement | SVGElement> | FocusEvent<HTMLInputElement> | KeyboardEvent<HTMLDivElement>;
+    trigger: 'input' | 'clear' | 'blur';
+}
+export declare type SelectInputChangeContext = TagInputChangeContext;

package/lib/select-input/type.js

@@ -0,0 +1,9 @@
+/**
+ * tdesign v0.25.3-alpha.1
+ * (c) 2022 tdesign
+ * @license MIT
+ */
+
+'use strict';
+
+//# sourceMappingURL=type.js.map

package/lib/select-input/type.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"type.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/lib/select-input/useMultiple.d.ts

@@ -0,0 +1,15 @@
+import React, { MouseEvent } from 'react';
+import { TdSelectInputProps } from './type';
+import { SelectInputCommonProperties } from './interface';
+export interface RenderSelectMultipleParams {
+    commonInputProps: SelectInputCommonProperties;
+    onInnerClear: (context: {
+        e: MouseEvent<SVGElement>;
+    }) => void;
+}
+export default function useMultiple(props: TdSelectInputProps): {
+    tags: any[];
+    tPlaceholder: string;
+    tagInputRef: React.MutableRefObject<undefined>;
+    renderSelectMultiple: (p: RenderSelectMultipleParams) => JSX.Element;
+};

package/lib/select-input/useMultiple.js

@@ -0,0 +1,157 @@
+/**
+ * tdesign v0.25.3-alpha.1
+ * (c) 2022 tdesign
+ * @license MIT
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var defineProperty = require('../_chunks/dep-728c3d30.js');
+var slicedToArray = require('../_chunks/dep-402b9452.js');
+var React = require('react');
+var isFunction = require('../_chunks/dep-9ac45eb1.js');
+var tagInput_index = require('../tag-input/index.js');
+var _util_useDefault = require('../_util/useDefault.js');
+require('../_chunks/dep-20cb3e75.js');
+require('../_chunks/dep-0e51d993.js');
+require('../_chunks/dep-e92e2bb4.js');
+require('../tag-input/TagInput.js');
+require('tdesign-icons-react');
+require('classnames');
+require('../_util/useConfig.js');
+require('../_chunks/dep-cb1cdc62.js');
+require('../_chunks/dep-94ac5bc2.js');
+require('../_chunks/dep-d5c34a19.js');
+require('../_chunks/dep-b81d09ba.js');
+require('../_chunks/dep-09c2324b.js');
+require('../_chunks/dep-aef3883a.js');
+require('../_chunks/dep-4d02f91f.js');
+require('../_chunks/dep-f7cad145.js');
+require('../_chunks/dep-d5b1028b.js');
+require('../_chunks/dep-fe8b0b86.js');
+require('../_chunks/dep-32b793ca.js');
+require('../_chunks/dep-3a37dd17.js');
+require('../_chunks/dep-b4f37218.js');
+require('../_common/js/locale/zh_CN.js');
+require('../config-provider/defaultConfig.js');
+require('../_util/useDragSorter.js');
+require('../input/index.js');
+require('../input/Input.js');
+require('../_chunks/dep-7b67ce1a.js');
+require('../_util/forwardRefWithStatics.js');
+require('hoist-non-react-statics');
+require('../input/InputGroup.js');
+require('../_util/useDefaultValue.js');
+require('../_util/noop.js');
+require('../tag-input/useTagScroll.js');
+require('../tag-input/useTagList.js');
+require('../_chunks/dep-b41f5892.js');
+require('lodash');
+require('../tag/index.js');
+require('../tag/Tag.js');
+require('../tag/CheckTag.js');
+require('../tag-input/useHover.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { defineProperty._defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var DEFAULT_KEYS = {
+  label: "label",
+  key: "key",
+  children: "children"
+};
+function useMultiple(props) {
+  var value = props.value;
+  var tagInputRef = React.useRef();
+
+  var _useDefaultValue = _util_useDefault["default"](props.inputValue, props.defaultInputValue, props.onInputChange),
+      _useDefaultValue2 = slicedToArray._slicedToArray(_useDefaultValue, 2),
+      tInputValue = _useDefaultValue2[0],
+      setTInputValue = _useDefaultValue2[1];
+
+  var iKeys = _objectSpread(_objectSpread({}, DEFAULT_KEYS), props.keys);
+
+  var getTags = function getTags() {
+    if (!(value instanceof Array)) {
+      return isFunction.isObject_1(value) ? [value[iKeys.label]] : [value];
+    }
+
+    return value.map(function (item) {
+      return isFunction.isObject_1(item) ? item[iKeys.label] : item;
+    });
+  };
+
+  var tags = getTags();
+  var tPlaceholder = !tags || !tags.length ? props.placeholder : "";
+
+  var onTagInputChange = function onTagInputChange(val, context) {
+    var _props$onTagChange;
+
+    if (context.trigger === "tag-remove") {
+      var _context$e;
+
+      (_context$e = context.e) === null || _context$e === void 0 ? void 0 : _context$e.stopPropagation();
+    }
+
+    (_props$onTagChange = props.onTagChange) === null || _props$onTagChange === void 0 ? void 0 : _props$onTagChange.call(props, val, context);
+  };
+
+  var renderSelectMultiple = function renderSelectMultiple(p) {
+    return /* @__PURE__ */React__default["default"].createElement(tagInput_index.TagInput, _objectSpread(_objectSpread({
+      ref: tagInputRef
+    }, p.commonInputProps), {}, {
+      readonly: !props.allowInput,
+      autoWidth: props.borderless || props.autoWidth,
+      minCollapsedNum: props.minCollapsedNum,
+      collapsedItems: props.collapsedItems,
+      tag: props.tag,
+      valueDisplay: props.valueDisplay,
+      placeholder: tPlaceholder,
+      value: tags,
+      inputValue: tInputValue || "",
+      onChange: onTagInputChange,
+      onInputChange: function onInputChange(val, context) {
+        if ((context === null || context === void 0 ? void 0 : context.trigger) === "enter") return;
+        setTInputValue(val, {
+          trigger: context.trigger,
+          e: context.e
+        });
+      },
+      tagProps: props.tagProps,
+      onClear: p.onInnerClear,
+      onBlur: function onBlur(val, context) {
+        var _props$onBlur;
+
+        (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 ? void 0 : _props$onBlur.call(props, props.value, _objectSpread(_objectSpread({}, context), {}, {
+          tagInputValue: val
+        }));
+        setTInputValue("", _objectSpread(_objectSpread({}, context), {}, {
+          trigger: "blur"
+        }));
+      },
+      onFocus: function onFocus(val, context) {
+        var _props$onFocus;
+
+        (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 ? void 0 : _props$onFocus.call(props, props.value, _objectSpread(_objectSpread({}, context), {}, {
+          tagInputValue: val
+        }));
+      }
+    }, props.tagInputProps));
+  };
+
+  return {
+    tags: tags,
+    tPlaceholder: tPlaceholder,
+    tagInputRef: tagInputRef,
+    renderSelectMultiple: renderSelectMultiple
+  };
+}
+
+exports["default"] = useMultiple;
+//# sourceMappingURL=useMultiple.js.map

package/lib/select-input/useMultiple.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMultiple.js","sources":["../../src/select-input/useMultiple.tsx"],"sourcesContent":["import React, { useRef, MouseEvent } from 'react';\nimport isObject from 'lodash/isObject';\nimport { TdSelectInputProps, SelectInputChangeContext, SelectInputKeys } from './type';\nimport TagInput, { TagInputValue } from '../tag-input';\nimport { SelectInputCommonProperties } from './interface';\nimport useDefaultValue from '../_util/useDefault';\n\nexport interface RenderSelectMultipleParams {\n  commonInputProps: SelectInputCommonProperties;\n  onInnerClear: (context: { e: MouseEvent<SVGElement> }) => void;\n}\n\nconst DEFAULT_KEYS = {\n  label: 'label',\n  key: 'key',\n  children: 'children',\n};\n\nexport default function useMultiple(props: TdSelectInputProps) {\n  const { value } = props;\n  const tagInputRef = useRef();\n  const [tInputValue, setTInputValue] = useDefaultValue(props.inputValue, props.defaultInputValue, props.onInputChange);\n  const iKeys: SelectInputKeys = { ...DEFAULT_KEYS, ...props.keys };\n\n  const getTags = () => {\n    if (!(value instanceof Array)) {\n      return isObject(value) ? [value[iKeys.label]] : [value];\n    }\n    return value.map((item) => (isObject(item) ? item[iKeys.label] : item));\n  };\n  const tags = getTags();\n\n  const tPlaceholder = !tags || !tags.length ? props.placeholder : '';\n\n  const onTagInputChange = (val: TagInputValue, context: SelectInputChangeContext) => {\n    // 避免触发浮层的显示或隐藏\n    if (context.trigger === 'tag-remove') {\n      context.e?.stopPropagation();\n    }\n    props.onTagChange?.(val, context);\n  };\n\n  const renderSelectMultiple = (p: RenderSelectMultipleParams) => (\n    <TagInput\n      ref={tagInputRef}\n      {...p.commonInputProps}\n      readonly={!props.allowInput}\n      autoWidth={props.borderless || props.autoWidth}\n      minCollapsedNum={props.minCollapsedNum}\n      collapsedItems={props.collapsedItems}\n      tag={props.tag}\n      valueDisplay={props.valueDisplay}\n      placeholder={tPlaceholder}\n      value={tags}\n      inputValue={tInputValue || ''}\n      onChange={onTagInputChange}\n      onInputChange={(val, context) => {\n        // 筛选器统一特性：筛选器按下回车时不清空输入框\n        if (context?.trigger === 'enter') return;\n        setTInputValue(val, { trigger: context.trigger, e: context.e });\n      }}\n      tagProps={props.tagProps}\n      onClear={p.onInnerClear}\n      onBlur={(val, context) => {\n        props.onBlur?.(props.value, { ...context, tagInputValue: val });\n        // 筛选器统一特性：失去焦点时，清空输入内容\n        setTInputValue('', { ...context, trigger: 'blur' });\n      }}\n      onFocus={(val, context) => {\n        props.onFocus?.(props.value, { ...context, tagInputValue: val });\n      }}\n      {...props.tagInputProps}\n    />\n  );\n\n  return {\n    tags,\n    tPlaceholder,\n    tagInputRef,\n    renderSelectMultiple,\n  };\n}\n"],"names":["DEFAULT_KEYS","label","key","children","useMultiple","props","value","tagInputRef","useRef","useDefaultValue","inputValue","defaultInputValue","onInputChange","tInputValue","setTInputValue","iKeys","keys","getTags","Array","isObject","map","item","tags","tPlaceholder","length","placeholder","onTagInputChange","val","context","trigger","e","stopPropagation","onTagChange","renderSelectMultiple","p","React","createElement","TagInput","ref","commonInputProps","readonly","allowInput","autoWidth","borderless","minCollapsedNum","collapsedItems","tag","valueDisplay","onChange","tagProps","onClear","onInnerClear","onBlur","tagInputValue","onFocus","tagInputProps"],"mappings":"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"}

package/lib/select-input/useOverlayStyle.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { TdSelectInputProps } from './type';
+import { PopupVisibleChangeContext } from '../popup';
+export default function useOverlayStyle(props: TdSelectInputProps): {
+    tOverlayStyle: React.CSSProperties | ((triggerElement: HTMLElement, popupElement: HTMLElement) => React.CSSProperties);
+    innerPopupVisible: boolean;
+    onInnerPopupVisibleChange: (visible: boolean, context: PopupVisibleChangeContext) => void;
+};

package/lib/select-input/useOverlayStyle.js

@@ -0,0 +1,75 @@
+/**
+ * tdesign v0.25.3-alpha.1
+ * (c) 2022 tdesign
+ * @license MIT
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var defineProperty = require('../_chunks/dep-728c3d30.js');
+var _typeof = require('../_chunks/dep-e92e2bb4.js');
+var slicedToArray = require('../_chunks/dep-402b9452.js');
+var React = require('react');
+var isFunction = require('../_chunks/dep-9ac45eb1.js');
+require('../_chunks/dep-20cb3e75.js');
+require('../_chunks/dep-0e51d993.js');
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { defineProperty._defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var MAX_POPUP_WIDTH = 1e3;
+function useOverlayStyle(props) {
+  var popupProps = props.popupProps,
+      borderless = props.borderless;
+
+  var _useState = React.useState(false),
+      _useState2 = slicedToArray._slicedToArray(_useState, 2),
+      innerPopupVisible = _useState2[0],
+      setInnerPopupVisible = _useState2[1];
+
+  var macthWidthFunc = function macthWidthFunc(triggerElement, popupElement) {
+    if (!triggerElement || !popupElement) return;
+    var SCROLLBAR_WIDTH = popupElement.scrollHeight > popupElement.offsetHeight ? 8 : 0;
+    var width = popupElement.offsetWidth + SCROLLBAR_WIDTH >= triggerElement.offsetWidth ? popupElement.offsetWidth : triggerElement.offsetWidth;
+    var otherOverlayStyle = {};
+
+    if (popupProps && _typeof._typeof(popupProps.overlayStyle) === "object" && !popupProps.overlayStyle.width) {
+      otherOverlayStyle = popupProps.overlayStyle;
+    }
+
+    return _objectSpread({
+      width: "".concat(Math.min(width, MAX_POPUP_WIDTH), "px")
+    }, otherOverlayStyle);
+  };
+
+  var onInnerPopupVisibleChange = function onInnerPopupVisibleChange(visible, context) {
+    var _props$onPopupVisible;
+
+    var newVisible = context.trigger === "trigger-element-click" ? true : visible;
+    setInnerPopupVisible(newVisible);
+    (_props$onPopupVisible = props.onPopupVisibleChange) === null || _props$onPopupVisible === void 0 ? void 0 : _props$onPopupVisible.call(props, newVisible, context);
+  };
+
+  var tOverlayStyle = React.useMemo(function () {
+    var result = {};
+    var overlayStyle = (popupProps === null || popupProps === void 0 ? void 0 : popupProps.overlayStyle) || {};
+
+    if (isFunction.isFunction_1(overlayStyle) || isFunction.isObject_1(overlayStyle) && overlayStyle.width) {
+      result = overlayStyle;
+    } else if (!borderless) {
+      result = macthWidthFunc;
+    }
+
+    return result;
+  }, [borderless, popupProps === null || popupProps === void 0 ? void 0 : popupProps.overlayStyle]);
+  return {
+    tOverlayStyle: tOverlayStyle,
+    innerPopupVisible: innerPopupVisible,
+    onInnerPopupVisibleChange: onInnerPopupVisibleChange
+  };
+}
+
+exports["default"] = useOverlayStyle;
+//# sourceMappingURL=useOverlayStyle.js.map

package/lib/select-input/useOverlayStyle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOverlayStyle.js","sources":["../../src/select-input/useOverlayStyle.ts"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport isObject from 'lodash/isObject';\nimport isFunction from 'lodash/isFunction';\nimport { TdSelectInputProps } from './type';\nimport { TdPopupProps, PopupVisibleChangeContext } from '../popup';\n\n// 单位：px\nconst MAX_POPUP_WIDTH = 1000;\n\nexport default function useOverlayStyle(props: TdSelectInputProps) {\n  const { popupProps, borderless } = props;\n  const [innerPopupVisible, setInnerPopupVisible] = useState(false);\n\n  const macthWidthFunc = (triggerElement: HTMLElement, popupElement: HTMLElement) => {\n    if (!triggerElement || !popupElement) return;\n    // 避免因滚动条出现文本省略，预留宽度 8\n    const SCROLLBAR_WIDTH = popupElement.scrollHeight > popupElement.offsetHeight ? 8 : 0;\n    const width =\n      popupElement.offsetWidth + SCROLLBAR_WIDTH >= triggerElement.offsetWidth\n        ? popupElement.offsetWidth\n        : triggerElement.offsetWidth;\n    let otherOverlayStyle: React.CSSProperties = {};\n    if (popupProps && typeof popupProps.overlayStyle === 'object' && !popupProps.overlayStyle.width) {\n      otherOverlayStyle = popupProps.overlayStyle;\n    }\n    return {\n      width: `${Math.min(width, MAX_POPUP_WIDTH)}px`,\n      ...otherOverlayStyle,\n    };\n  };\n\n  const onInnerPopupVisibleChange = (visible: boolean, context: PopupVisibleChangeContext) => {\n    // 如果点击触发元素（输入框），则永久显示下拉框\n    const newVisible = context.trigger === 'trigger-element-click' ? true : visible;\n    setInnerPopupVisible(newVisible);\n    props.onPopupVisibleChange?.(newVisible, context);\n  };\n\n  const tOverlayStyle = useMemo(() => {\n    let result: TdPopupProps['overlayStyle'] = {};\n    const overlayStyle = popupProps?.overlayStyle || {};\n    if (isFunction(overlayStyle) || (isObject(overlayStyle) && overlayStyle.width)) {\n      result = overlayStyle;\n    } else if (!borderless) {\n      result = macthWidthFunc;\n    }\n    return result;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [borderless, popupProps?.overlayStyle]);\n\n  return {\n    tOverlayStyle,\n    innerPopupVisible,\n    onInnerPopupVisibleChange,\n  };\n}\n"],"names":["MAX_POPUP_WIDTH","useOverlayStyle","props","popupProps","borderless","useState","innerPopupVisible","setInnerPopupVisible","macthWidthFunc","triggerElement","popupElement","SCROLLBAR_WIDTH","scrollHeight","offsetHeight","width","offsetWidth","otherOverlayStyle","_typeof","overlayStyle","Math","min","onInnerPopupVisibleChange","visible","context","newVisible","trigger","onPopupVisibleChange","tOverlayStyle","useMemo","result","isFunction","isObject"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAGA,IAAMA,eAAe,GAAG,GAAxB;AACe,SAASC,eAAT,CAAyBC,KAAzB,EAAgC;AAC7C,MAAQC,UAAR,GAAmCD,KAAnC,CAAQC,UAAR;AAAA,MAAoBC,UAApB,GAAmCF,KAAnC,CAAoBE,UAApB;;AACA,kBAAkDC,cAAQ,CAAC,KAAD,CAA1D;AAAA;AAAA,MAAOC,iBAAP;AAAA,MAA0BC,oBAA1B;;AACA,MAAMC,cAAc,GAAG,SAAjBA,cAAiB,CAACC,cAAD,EAAiBC,YAAjB,EAAkC;AACvD,QAAI,CAACD,cAAD,IAAmB,CAACC,YAAxB,EACE;AACF,QAAMC,eAAe,GAAGD,YAAY,CAACE,YAAb,GAA4BF,YAAY,CAACG,YAAzC,GAAwD,CAAxD,GAA4D,CAApF;AACA,QAAMC,KAAK,GAAGJ,YAAY,CAACK,WAAb,GAA2BJ,eAA3B,IAA8CF,cAAc,CAACM,WAA7D,GAA2EL,YAAY,CAACK,WAAxF,GAAsGN,cAAc,CAACM,WAAnI;AACA,QAAIC,iBAAiB,GAAG,EAAxB;;AACA,QAAIb,UAAU,IAAIc,gBAAOd,UAAU,CAACe,YAAlB,MAAmC,QAAjD,IAA6D,CAACf,UAAU,CAACe,YAAX,CAAwBJ,KAA1F,EAAiG;AAC/FE,MAAAA,iBAAiB,GAAGb,UAAU,CAACe,YAA/B;AACD;;AACD;AACEJ,MAAAA,KAAK,YAAKK,IAAI,CAACC,GAAL,CAASN,KAAT,EAAgBd,eAAhB,CAAL;AADP,OAEKgB,iBAFL;AAID,GAbD;;AAcA,MAAMK,yBAAyB,GAAG,SAA5BA,yBAA4B,CAACC,OAAD,EAAUC,OAAV,EAAsB;AAAA;;AACtD,QAAMC,UAAU,GAAGD,OAAO,CAACE,OAAR,KAAoB,uBAApB,GAA8C,IAA9C,GAAqDH,OAAxE;AACAf,IAAAA,oBAAoB,CAACiB,UAAD,CAApB;AACA,6BAAAtB,KAAK,CAACwB,oBAAN,qFAAAxB,KAAK,EAAwBsB,UAAxB,EAAoCD,OAApC,CAAL;AACD,GAJD;;AAKA,MAAMI,aAAa,GAAGC,aAAO,CAAC,YAAM;AAClC,QAAIC,MAAM,GAAG,EAAb;AACA,QAAMX,YAAY,GAAG,CAAAf,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAEe,YAAZ,KAA4B,EAAjD;;AACA,QAAIY,uBAAU,CAACZ,YAAD,CAAV,IAA4Ba,qBAAQ,CAACb,YAAD,CAAR,IAA0BA,YAAY,CAACJ,KAAvE,EAA8E;AAC5Ee,MAAAA,MAAM,GAAGX,YAAT;AACD,KAFD,MAEO,IAAI,CAACd,UAAL,EAAiB;AACtByB,MAAAA,MAAM,GAAGrB,cAAT;AACD;;AACD,WAAOqB,MAAP;AACD,GAT4B,EAS1B,CAACzB,UAAD,EAAaD,UAAb,aAAaA,UAAb,uBAAaA,UAAU,CAAEe,YAAzB,CAT0B,CAA7B;AAUA,SAAO;AACLS,IAAAA,aAAa,EAAbA,aADK;AAELrB,IAAAA,iBAAiB,EAAjBA,iBAFK;AAGLe,IAAAA,yBAAyB,EAAzBA;AAHK,GAAP;AAKD;;;;"}

package/lib/select-input/useSingle.d.ts

@@ -0,0 +1,14 @@
+import React, { MouseEvent } from 'react';
+import { SelectInputCommonProperties } from './interface';
+import { TdSelectInputProps } from './type';
+export interface RenderSelectSingleInputParams {
+    tPlaceholder: string;
+}
+export default function useSingle(props: TdSelectInputProps): {
+    inputRef: React.MutableRefObject<undefined>;
+    commonInputProps: SelectInputCommonProperties;
+    onInnerClear: (context: {
+        e: MouseEvent<SVGElement>;
+    }) => void;
+    renderSelectSingle: () => JSX.Element;
+};