@tendaui/components 1.0.0 → 1.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (270) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +176 -176
  3. package/alert/Alert.tsx +3 -2
  4. package/button/_example/base.tsx +10 -0
  5. package/button/_example/icon.tsx +20 -0
  6. package/color-picker/ColorPickPanel.tsx +9 -0
  7. package/color-picker/ColorPicker.tsx +67 -0
  8. package/color-picker/components/panel/alpha.tsx +32 -0
  9. package/color-picker/components/panel/format/index.tsx +47 -0
  10. package/color-picker/components/panel/format/inputs.tsx +119 -0
  11. package/color-picker/components/panel/header.tsx +37 -0
  12. package/color-picker/components/panel/hue.tsx +20 -0
  13. package/color-picker/components/panel/index.tsx +191 -0
  14. package/color-picker/components/panel/saturation.tsx +81 -0
  15. package/color-picker/components/panel/slider.tsx +76 -0
  16. package/color-picker/components/panel/swatches.tsx +84 -0
  17. package/color-picker/components/trigger.tsx +49 -0
  18. package/color-picker/defaultProps.ts +7 -0
  19. package/color-picker/helpers.ts +53 -0
  20. package/color-picker/hooks/useClassNames.ts +9 -0
  21. package/color-picker/hooks/useStyles.ts +39 -0
  22. package/color-picker/index.ts +12 -0
  23. package/color-picker/style/css.js +1 -0
  24. package/color-picker/style/index.js +1 -0
  25. package/color-picker/type.ts +143 -0
  26. package/color-picker/utils/color-picker/cmyk.ts +89 -0
  27. package/color-picker/utils/color-picker/color.ts +467 -0
  28. package/color-picker/utils/color-picker/constants.ts +187 -0
  29. package/color-picker/utils/color-picker/draggable.ts +100 -0
  30. package/color-picker/utils/color-picker/format.ts +95 -0
  31. package/color-picker/utils/color-picker/gradient.ts +243 -0
  32. package/color-picker/utils/color-picker/index.ts +7 -0
  33. package/color-picker/utils/color-picker/types.ts +33 -0
  34. package/common/observe.ts +33 -0
  35. package/common.ts +20 -0
  36. package/config-provider/ConfigContext.tsx +4 -1
  37. package/config-provider/index.ts +1 -1
  38. package/dialog/DialogCard.tsx +4 -6
  39. package/dialog/hooks/useDialogPosition.ts +1 -2
  40. package/dialog/plugin.tsx +3 -2
  41. package/drawer/Drawer.tsx +264 -0
  42. package/drawer/defaultProps.ts +19 -0
  43. package/drawer/hooks/useDrag.ts +98 -0
  44. package/drawer/hooks/useLockStyle.ts +36 -0
  45. package/drawer/index.ts +5 -0
  46. package/drawer/style/css.js +1 -0
  47. package/drawer/style/index.js +1 -0
  48. package/drawer/type.ts +193 -0
  49. package/drawer/utils/index.ts +76 -0
  50. package/fireworks/Fireworks.tsx +138 -0
  51. package/fireworks/index.ts +10 -0
  52. package/fireworks/style/css.js +0 -0
  53. package/fireworks/style/index.js +0 -0
  54. package/fireworks/type.ts +72 -0
  55. package/form/FormItem.tsx +5 -5
  56. package/form/easing.ts +10 -0
  57. package/form/scroll.ts +124 -0
  58. package/form/type.ts +519 -519
  59. package/global-config/default-config.ts +95 -0
  60. package/global-config/locale/ar_KW.ts +270 -0
  61. package/global-config/locale/en_US.ts +280 -0
  62. package/global-config/locale/it_IT.ts +287 -0
  63. package/global-config/locale/ja_JP.ts +279 -0
  64. package/global-config/locale/ko_KR.ts +279 -0
  65. package/global-config/locale/ru_RU.ts +288 -0
  66. package/global-config/locale/zh_CN.ts +279 -0
  67. package/global-config/locale/zh_TW.ts +279 -0
  68. package/global-config/mobile/default-config.ts +6 -0
  69. package/global-config/mobile/locale/ar_KW.ts +113 -0
  70. package/global-config/mobile/locale/en_US.ts +114 -0
  71. package/global-config/mobile/locale/it_IT.ts +114 -0
  72. package/global-config/mobile/locale/ja_JP.ts +101 -0
  73. package/global-config/mobile/locale/ko_KR.ts +101 -0
  74. package/global-config/mobile/locale/ru_RU.ts +113 -0
  75. package/global-config/mobile/locale/zh_CN.ts +101 -0
  76. package/global-config/mobile/locale/zh_TW.ts +101 -0
  77. package/global-config/t.ts +111 -0
  78. package/hooks/useControlled.ts +3 -3
  79. package/hooks/useDeepEffect.ts +32 -0
  80. package/hooks/useGlobalIcon.ts +10 -3
  81. package/hooks/useLastest.ts +2 -6
  82. package/hooks/useResizeObserve.ts +36 -0
  83. package/index.ts +10 -7
  84. package/input/Input.tsx +4 -1
  85. package/input/defaultProps.ts +0 -2
  86. package/input/type.ts +1 -6
  87. package/input-number/InputNumber.tsx +124 -0
  88. package/input-number/defaultProps.ts +17 -0
  89. package/input-number/index.ts +9 -0
  90. package/input-number/style/css.js +1 -0
  91. package/input-number/style/index.js +1 -0
  92. package/input-number/type.ts +147 -0
  93. package/input-number/useInputNumber.tsx +270 -0
  94. package/ip-input/IPInput.tsx +516 -0
  95. package/ip-input/defaultProps.ts +11 -0
  96. package/ip-input/index.ts +3 -0
  97. package/ip-input/style/css.js +1 -0
  98. package/ip-input/style/index.js +1 -0
  99. package/ip-input/type.ts +115 -0
  100. package/ip-input/utils.ts +112 -0
  101. package/layout/Aside.tsx +38 -0
  102. package/layout/Layout.tsx +104 -0
  103. package/layout/defaultProps.ts +9 -0
  104. package/layout/index.ts +9 -0
  105. package/layout/style/css.js +1 -0
  106. package/layout/style/index.js +1 -0
  107. package/layout/type.ts +43 -0
  108. package/list/List.tsx +144 -0
  109. package/list/ListItem.tsx +36 -0
  110. package/list/ListItemMeta.tsx +40 -0
  111. package/list/defaultProps.ts +11 -0
  112. package/list/hooks/useListVirtualScroll.ts +82 -0
  113. package/list/index.ts +11 -0
  114. package/list/style/css.js +1 -0
  115. package/list/style/index.js +1 -0
  116. package/list/type.ts +93 -0
  117. package/locale/LocalReceiver.ts +55 -0
  118. package/locale/ar_KW.ts +7 -0
  119. package/locale/en_US.ts +7 -0
  120. package/locale/it_IT.ts +6 -0
  121. package/locale/ja_JP.ts +6 -0
  122. package/locale/ko_KR.ts +6 -0
  123. package/locale/ru_RU.ts +6 -0
  124. package/locale/zh_CN.ts +5 -0
  125. package/locale/zh_TW.ts +7 -0
  126. package/notification/NotifyContainer.tsx +2 -2
  127. package/notification/NotifyContext.tsx +1 -0
  128. package/package.json +6 -3
  129. package/popup/Popup.tsx +34 -10
  130. package/radio/Radio.tsx +24 -0
  131. package/radio/RadioGroup.tsx +159 -0
  132. package/radio/defaultProps.ts +18 -0
  133. package/radio/index.ts +12 -0
  134. package/radio/style/css.js +0 -0
  135. package/radio/style/index.js +1 -0
  136. package/radio/type.ts +115 -0
  137. package/radio/useKeyboard.ts +36 -0
  138. package/select/hooks/useOptions.ts +10 -7
  139. package/select/hooks/usePanelVirtualScroll.ts +1 -1
  140. package/select/type.ts +382 -382
  141. package/select-input/type.ts +280 -280
  142. package/slider/Slider.tsx +270 -0
  143. package/slider/SliderHandleButton.tsx +50 -0
  144. package/slider/defaultProps.ts +15 -0
  145. package/slider/index.ts +9 -0
  146. package/slider/style/css.js +1 -0
  147. package/slider/style/index.js +1 -0
  148. package/slider/type.ts +77 -0
  149. package/style/all.js +26 -0
  150. package/styles/_global.scss +39 -39
  151. package/styles/_vars.scss +358 -386
  152. package/styles/components/alert/_index.scss +175 -175
  153. package/styles/components/alert/_vars.scss +39 -39
  154. package/styles/components/badge/_index.scss +70 -70
  155. package/styles/components/badge/_vars.scss +25 -25
  156. package/styles/components/button/_index.scss +499 -511
  157. package/styles/components/button/_mixins.scss +39 -39
  158. package/styles/components/button/_vars.scss +120 -122
  159. package/styles/components/checkbox/_index.scss +158 -158
  160. package/styles/components/checkbox/_var.scss +60 -60
  161. package/styles/components/color-picker/_index.scss +586 -0
  162. package/styles/components/color-picker/_mixins.scss +0 -0
  163. package/styles/components/color-picker/_vars.scss +84 -0
  164. package/styles/components/dialog/_animate.scss +135 -135
  165. package/styles/components/dialog/_index.scss +311 -311
  166. package/styles/components/dialog/_vars.scss +59 -59
  167. package/styles/components/drawer/_index.scss +205 -0
  168. package/styles/components/drawer/_mixins.scss +1 -0
  169. package/styles/components/drawer/_var.scss +53 -0
  170. package/styles/components/fireworks/_index.scss +86 -0
  171. package/styles/components/fireworks/_vars.scss +4 -0
  172. package/styles/components/form/_index.scss +174 -174
  173. package/styles/components/form/_mixins.scss +76 -76
  174. package/styles/components/form/_vars.scss +100 -100
  175. package/styles/components/input/_index.scss +349 -349
  176. package/styles/components/input/_mixins.scss +116 -116
  177. package/styles/components/input/_vars.scss +134 -134
  178. package/styles/components/input-number/_index.scss +353 -0
  179. package/styles/components/input-number/_mixins.scss +0 -0
  180. package/styles/components/input-number/_vars.scss +65 -0
  181. package/styles/components/ip-input/_index.scss +280 -0
  182. package/styles/components/layout/_index.scss +47 -0
  183. package/styles/components/layout/_mixin.scss +0 -0
  184. package/styles/components/layout/_vars.scss +18 -0
  185. package/styles/components/layout/doc.scss +74 -0
  186. package/styles/components/list/_index.scss +172 -0
  187. package/styles/components/list/_mixins.scss +0 -0
  188. package/styles/components/list/_vars.scss +41 -0
  189. package/styles/components/loading/_index.scss +112 -112
  190. package/styles/components/loading/_vars.scss +39 -39
  191. package/styles/components/notification/_index.scss +160 -160
  192. package/styles/components/notification/_mixins.scss +12 -12
  193. package/styles/components/notification/_vars.scss +59 -59
  194. package/styles/components/popup/_index.scss +82 -82
  195. package/styles/components/popup/_mixin.scss +149 -149
  196. package/styles/components/popup/_var.scss +31 -31
  197. package/styles/components/radio/_index.scss +376 -0
  198. package/styles/components/radio/_mixins.scss +0 -0
  199. package/styles/components/radio/_var.scss +92 -0
  200. package/styles/components/select/_index.scss +290 -290
  201. package/styles/components/select/_var.scss +65 -65
  202. package/styles/components/select-input/_index.scss +5 -5
  203. package/styles/components/select-input/_var.scss +3 -3
  204. package/styles/components/slider/_index.scss +241 -0
  205. package/styles/components/slider/_mixins.scss +0 -0
  206. package/styles/components/slider/_vars.scss +50 -0
  207. package/styles/components/switch/_index.scss +279 -279
  208. package/styles/components/switch/_vars.scss +61 -61
  209. package/styles/components/table/_index.scss +193 -0
  210. package/styles/components/table/_var.scss +52 -0
  211. package/styles/components/tabs/_index.scss +165 -0
  212. package/styles/components/tabs/_mixins.scss +11 -0
  213. package/styles/components/tabs/_vars.scss +71 -0
  214. package/styles/components/tag/_index.scss +316 -316
  215. package/styles/components/tag/_var.scss +85 -85
  216. package/styles/components/tag-input/_index.scss +163 -163
  217. package/styles/components/tag-input/_vars.scss +16 -16
  218. package/styles/globals.css +250 -250
  219. package/styles/mixins/_focus.scss +7 -7
  220. package/styles/mixins/_layout.scss +32 -32
  221. package/styles/mixins/_reset.scss +10 -10
  222. package/styles/mixins/_scrollbar.scss +31 -31
  223. package/styles/mixins/_text.scss +48 -48
  224. package/styles/rillple.css +16 -16
  225. package/styles/scrollbar.css +41 -41
  226. package/styles/themes/_dark.scss +191 -191
  227. package/styles/themes/_font.scss +69 -79
  228. package/styles/themes/_index.scss +5 -5
  229. package/styles/themes/_light.scss +190 -190
  230. package/styles/themes/_radius.scss +9 -9
  231. package/styles/themes/_size.scss +68 -68
  232. package/styles/themes.css +66 -66
  233. package/styles/utilities/_animation.scss +57 -57
  234. package/styles/utilities/_tips.scss +9 -9
  235. package/tab/TabBar.tsx +85 -0
  236. package/tab/TabNav.tsx +103 -0
  237. package/tab/TabNavItem.tsx +80 -0
  238. package/tab/TabPanel.tsx +42 -0
  239. package/tab/Tabs.tsx +71 -0
  240. package/tab/defaultProps.ts +19 -0
  241. package/tab/index.ts +7 -0
  242. package/tab/style/index.js +1 -0
  243. package/tab/type.ts +125 -0
  244. package/tab/useTabClass.ts +20 -0
  245. package/table/Cell.tsx +109 -0
  246. package/table/TBody.tsx +77 -0
  247. package/table/THead.tsx +63 -0
  248. package/table/TR.tsx +78 -0
  249. package/table/Table.tsx +73 -0
  250. package/table/defaultProps.ts +14 -0
  251. package/table/hooks/index.ts +4 -0
  252. package/table/hooks/useTableClassName.ts +63 -0
  253. package/table/hooks/useTableStyle.ts +93 -0
  254. package/table/index.ts +7 -0
  255. package/table/style/css.js +1 -0
  256. package/table/style/index.js +1 -0
  257. package/table/type.ts +192 -0
  258. package/tag/Tag.tsx +1 -1
  259. package/tag-input/hooks/useTagList.tsx +1 -1
  260. package/utils/dom.ts +4 -0
  261. package/utils/forwardRefWithStatics.ts +1 -4
  262. package/utils/input-number/large-number.ts +423 -0
  263. package/utils/input-number/number.ts +257 -0
  264. package/utils/isFragment.ts +6 -6
  265. package/utils/log/index.ts +3 -0
  266. package/utils/log/log.ts +30 -0
  267. package/utils/log/types.ts +12 -0
  268. package/utils/number.ts +21 -0
  269. package/utils/scroll.ts +26 -0
  270. package/utils/style.ts +2 -4
@@ -1,280 +1,280 @@
1
- /* eslint-disable */
2
-
3
- /**
4
- * 该文件为脚本自动生成文件,请勿随意修改。如需修改请联系 PMC
5
- * */
6
-
7
- import { InputProps } from '../input';
8
- import { PopupProps } from '../popup';
9
- import {
10
- TagInputProps,
11
- TagInputValue,
12
- TagInputChangeContext,
13
- } from '../tag-input';
14
- import { TagProps } from '../tag';
15
- import { PopupVisibleChangeContext } from '../popup';
16
- import { TNode, TElement, SizeEnum } from '../common';
17
- import {
18
- MouseEvent,
19
- KeyboardEvent,
20
- ClipboardEvent,
21
- FocusEvent,
22
- FormEvent,
23
- CompositionEvent,
24
- } from 'react';
25
-
26
- export interface TdSelectInputProps {
27
- /**
28
- * 是否允许输入
29
- * @default false
30
- */
31
- allowInput?: boolean;
32
- /**
33
- * 宽度随内容自适应
34
- * @default false
35
- */
36
- autoWidth?: boolean;
37
- /**
38
- * 自动聚焦
39
- * @default false
40
- */
41
- autofocus?: boolean;
42
- /**
43
- * 无边框模式
44
- * @default false
45
- */
46
- borderless?: boolean;
47
- /**
48
- * 是否可清空
49
- * @default false
50
- */
51
- clearable?: boolean;
52
- /**
53
- * 标签过多的情况下,折叠项内容,默认为 `+N`。如果需要悬浮就显示其他内容,可以使用 `collapsedItems` 自定义。`value` 表示所有标签值,`collapsedSelectedItems` 表示折叠标签值,`count` 表示折叠的数量,`onClose` 表示移除标签的事件回调
54
- */
55
- collapsedItems?: TNode<{
56
- value: SelectInputValue;
57
- collapsedSelectedItems: SelectInputValue;
58
- count: number;
59
- onClose: (context: { index: number; e?: MouseEvent }) => void;
60
- }>;
61
- /**
62
- * 是否禁用
63
- */
64
- disabled?: boolean;
65
- /**
66
- * 透传 Input 输入框组件全部属性
67
- */
68
- inputProps?: InputProps;
69
- /**
70
- * 输入框的值
71
- */
72
- inputValue?: string;
73
- /**
74
- * 输入框的值,非受控属性
75
- */
76
- defaultInputValue?: string;
77
- /**
78
- * 定义字段别名,示例:`{ label: 'text', value: 'id', children: 'list' }`
79
- */
80
- keys?: SelectInputKeys;
81
- /**
82
- * 左侧文本
83
- */
84
- label?: TNode;
85
- /**
86
- * 是否处于加载状态
87
- * @default false
88
- */
89
- loading?: boolean;
90
- /**
91
- * 最小折叠数量,用于标签数量过多的情况下折叠选中项,超出该数值的选中项折叠。值为 0 则表示不折叠
92
- * @default 0
93
- */
94
- minCollapsedNum?: number;
95
- /**
96
- * 是否为多选模式,默认为单选
97
- * @default false
98
- */
99
- multiple?: boolean;
100
- /**
101
- * 下拉框内容,可完全自定义
102
- */
103
- panel?: TNode;
104
- /**
105
- * 占位符
106
- * @default ''
107
- */
108
- placeholder?: string;
109
- /**
110
- * 透传 Popup 浮层组件全部属性
111
- */
112
- popupProps?: PopupProps;
113
- /**
114
- * 是否显示下拉框
115
- */
116
- popupVisible?: boolean;
117
- /**
118
- * 是否显示下拉框,非受控属性
119
- */
120
- defaultPopupVisible?: boolean;
121
- /**
122
- * 组件前置图标
123
- */
124
- prefixIcon?: TElement;
125
- /**
126
- * 只读状态,值为真会隐藏输入框,且无法打开下拉框
127
- * @default false
128
- */
129
- readonly?: boolean;
130
- /**
131
- * 多选且可搜索时,是否在选中一个选项后保留当前的搜索关键词
132
- * @default false
133
- */
134
- reserveKeyword?: boolean;
135
- /**
136
- * 组件尺寸
137
- * @default medium
138
- */
139
- size?: SizeEnum;
140
- /**
141
- * 输入框状态
142
- * @default default
143
- */
144
- status?: 'default' | 'success' | 'warning' | 'error';
145
- /**
146
- * 后置图标前的后置内容
147
- */
148
- suffix?: TNode;
149
- /**
150
- * 组件后置图标
151
- */
152
- suffixIcon?: TElement;
153
- /**
154
- * 多选场景下,自定义选中标签的内部内容。注意和 `valueDisplay` 区分,`valueDisplay` 是用来定义全部标签内容,而非某一个标签
155
- */
156
- tag?: string | TNode<{ value: string | number }>;
157
- /**
158
- * 透传 TagInput 组件全部属性
159
- */
160
- tagInputProps?: TagInputProps;
161
- /**
162
- * 透传 Tag 标签组件全部属性
163
- */
164
- tagProps?: TagProps;
165
- /**
166
- * 输入框下方提示文本,会根据不同的 `status` 呈现不同的样式
167
- */
168
- tips?: TNode;
169
- /**
170
- * 全部标签值。值为数组表示多个标签,值为非数组表示单个数值
171
- */
172
- value?: SelectInputValue;
173
- /**
174
- * 自定义值呈现的全部内容,参数为所有标签的值
175
- */
176
- valueDisplay?:
177
- | string
178
- | TNode<{
179
- value: TagInputValue;
180
- onClose: (index: number, item?: any) => void;
181
- }>;
182
- /**
183
- * 失去焦点时触发,`context.inputValue` 表示输入框的值;`context.tagInputValue` 表示标签输入框的值
184
- */
185
- onBlur?: (value: SelectInputValue, context: SelectInputBlurContext) => void;
186
- /**
187
- * 清空按钮点击时触发
188
- */
189
- onClear?: (context: { e: MouseEvent<SVGSVGElement> }) => void;
190
- /**
191
- * 按键按下 Enter 时触发
192
- */
193
- onEnter?: (
194
- value: SelectInputValue,
195
- context: {
196
- e: KeyboardEvent<HTMLDivElement>;
197
- inputValue: string;
198
- tagInputValue?: TagInputValue;
199
- },
200
- ) => void;
201
- /**
202
- * 聚焦时触发
203
- */
204
- onFocus?: (value: SelectInputValue, context: SelectInputFocusContext) => void;
205
- /**
206
- * 输入框值发生变化时触发,`context.trigger` 表示触发输入框值变化的来源:文本输入触发、清除按钮触发等
207
- */
208
- onInputChange?: (
209
- value: string,
210
- context?: SelectInputValueChangeContext,
211
- ) => void;
212
- /**
213
- * 进入输入框时触发
214
- */
215
- onMouseenter?: (context: { e: MouseEvent<HTMLDivElement> }) => void;
216
- /**
217
- * 离开输入框时触发
218
- */
219
- onMouseleave?: (context: { e: MouseEvent<HTMLDivElement> }) => void;
220
- /**
221
- * 粘贴事件,`pasteValue` 表示粘贴板的内容
222
- */
223
- onPaste?: (context: {
224
- e: ClipboardEvent<HTMLDivElement>;
225
- pasteValue: string;
226
- }) => void;
227
- /**
228
- * 下拉框显示或隐藏时触发
229
- */
230
- onPopupVisibleChange?: (
231
- visible: boolean,
232
- context: PopupVisibleChangeContext,
233
- ) => void;
234
- /**
235
- * 值变化时触发,参数 `context.trigger` 表示数据变化的触发来源;`context.index` 指当前变化项的下标;`context.item` 指当前变化项;`context.e` 表示事件参数
236
- */
237
- onTagChange?: (
238
- value: TagInputValue,
239
- context: SelectInputChangeContext,
240
- ) => void;
241
- }
242
-
243
- export interface SelectInputKeys {
244
- label?: string;
245
- value?: string;
246
- children?: string;
247
- }
248
-
249
- export type SelectInputValue =
250
- | string
251
- | number
252
- | boolean
253
- | Date
254
- | Object
255
- | Array<any>
256
- | Array<SelectInputValue>;
257
-
258
- export type SelectInputBlurContext = PopupVisibleChangeContext & {
259
- inputValue: string;
260
- tagInputValue?: TagInputValue;
261
- };
262
-
263
- export interface SelectInputFocusContext {
264
- inputValue: string;
265
- tagInputValue?: TagInputValue;
266
- e: FocusEvent<HTMLInputElement>;
267
- }
268
-
269
- export interface SelectInputValueChangeContext {
270
- e?:
271
- | Event
272
- | FormEvent<HTMLInputElement>
273
- | MouseEvent<HTMLElement | SVGElement>
274
- | FocusEvent<HTMLInputElement>
275
- | KeyboardEvent<HTMLInputElement>
276
- | CompositionEvent<HTMLDivElement>;
277
- trigger: 'input' | 'clear' | 'blur' | 'focus' | 'initial' | 'change';
278
- }
279
-
280
- export type SelectInputChangeContext = TagInputChangeContext;
1
+ /* eslint-disable */
2
+
3
+ /**
4
+ * 该文件为脚本自动生成文件,请勿随意修改。如需修改请联系 PMC
5
+ * */
6
+
7
+ import { InputProps } from '../input';
8
+ import { PopupProps } from '../popup';
9
+ import {
10
+ TagInputProps,
11
+ TagInputValue,
12
+ TagInputChangeContext,
13
+ } from '../tag-input';
14
+ import { TagProps } from '../tag';
15
+ import { PopupVisibleChangeContext } from '../popup';
16
+ import { TNode, TElement, SizeEnum } from '../common';
17
+ import {
18
+ MouseEvent,
19
+ KeyboardEvent,
20
+ ClipboardEvent,
21
+ FocusEvent,
22
+ FormEvent,
23
+ CompositionEvent,
24
+ } from 'react';
25
+
26
+ export interface TdSelectInputProps {
27
+ /**
28
+ * 是否允许输入
29
+ * @default false
30
+ */
31
+ allowInput?: boolean;
32
+ /**
33
+ * 宽度随内容自适应
34
+ * @default false
35
+ */
36
+ autoWidth?: boolean;
37
+ /**
38
+ * 自动聚焦
39
+ * @default false
40
+ */
41
+ autofocus?: boolean;
42
+ /**
43
+ * 无边框模式
44
+ * @default false
45
+ */
46
+ borderless?: boolean;
47
+ /**
48
+ * 是否可清空
49
+ * @default false
50
+ */
51
+ clearable?: boolean;
52
+ /**
53
+ * 标签过多的情况下,折叠项内容,默认为 `+N`。如果需要悬浮就显示其他内容,可以使用 `collapsedItems` 自定义。`value` 表示所有标签值,`collapsedSelectedItems` 表示折叠标签值,`count` 表示折叠的数量,`onClose` 表示移除标签的事件回调
54
+ */
55
+ collapsedItems?: TNode<{
56
+ value: SelectInputValue;
57
+ collapsedSelectedItems: SelectInputValue;
58
+ count: number;
59
+ onClose: (context: { index: number; e?: MouseEvent }) => void;
60
+ }>;
61
+ /**
62
+ * 是否禁用
63
+ */
64
+ disabled?: boolean;
65
+ /**
66
+ * 透传 Input 输入框组件全部属性
67
+ */
68
+ inputProps?: InputProps;
69
+ /**
70
+ * 输入框的值
71
+ */
72
+ inputValue?: string;
73
+ /**
74
+ * 输入框的值,非受控属性
75
+ */
76
+ defaultInputValue?: string;
77
+ /**
78
+ * 定义字段别名,示例:`{ label: 'text', value: 'id', children: 'list' }`
79
+ */
80
+ keys?: SelectInputKeys;
81
+ /**
82
+ * 左侧文本
83
+ */
84
+ label?: TNode;
85
+ /**
86
+ * 是否处于加载状态
87
+ * @default false
88
+ */
89
+ loading?: boolean;
90
+ /**
91
+ * 最小折叠数量,用于标签数量过多的情况下折叠选中项,超出该数值的选中项折叠。值为 0 则表示不折叠
92
+ * @default 0
93
+ */
94
+ minCollapsedNum?: number;
95
+ /**
96
+ * 是否为多选模式,默认为单选
97
+ * @default false
98
+ */
99
+ multiple?: boolean;
100
+ /**
101
+ * 下拉框内容,可完全自定义
102
+ */
103
+ panel?: TNode;
104
+ /**
105
+ * 占位符
106
+ * @default ''
107
+ */
108
+ placeholder?: string;
109
+ /**
110
+ * 透传 Popup 浮层组件全部属性
111
+ */
112
+ popupProps?: PopupProps;
113
+ /**
114
+ * 是否显示下拉框
115
+ */
116
+ popupVisible?: boolean;
117
+ /**
118
+ * 是否显示下拉框,非受控属性
119
+ */
120
+ defaultPopupVisible?: boolean;
121
+ /**
122
+ * 组件前置图标
123
+ */
124
+ prefixIcon?: TElement;
125
+ /**
126
+ * 只读状态,值为真会隐藏输入框,且无法打开下拉框
127
+ * @default false
128
+ */
129
+ readonly?: boolean;
130
+ /**
131
+ * 多选且可搜索时,是否在选中一个选项后保留当前的搜索关键词
132
+ * @default false
133
+ */
134
+ reserveKeyword?: boolean;
135
+ /**
136
+ * 组件尺寸
137
+ * @default medium
138
+ */
139
+ size?: SizeEnum;
140
+ /**
141
+ * 输入框状态
142
+ * @default default
143
+ */
144
+ status?: 'default' | 'success' | 'warning' | 'error';
145
+ /**
146
+ * 后置图标前的后置内容
147
+ */
148
+ suffix?: TNode;
149
+ /**
150
+ * 组件后置图标
151
+ */
152
+ suffixIcon?: TElement;
153
+ /**
154
+ * 多选场景下,自定义选中标签的内部内容。注意和 `valueDisplay` 区分,`valueDisplay` 是用来定义全部标签内容,而非某一个标签
155
+ */
156
+ tag?: string | TNode<{ value: string | number }>;
157
+ /**
158
+ * 透传 TagInput 组件全部属性
159
+ */
160
+ tagInputProps?: TagInputProps;
161
+ /**
162
+ * 透传 Tag 标签组件全部属性
163
+ */
164
+ tagProps?: TagProps;
165
+ /**
166
+ * 输入框下方提示文本,会根据不同的 `status` 呈现不同的样式
167
+ */
168
+ tips?: TNode;
169
+ /**
170
+ * 全部标签值。值为数组表示多个标签,值为非数组表示单个数值
171
+ */
172
+ value?: SelectInputValue;
173
+ /**
174
+ * 自定义值呈现的全部内容,参数为所有标签的值
175
+ */
176
+ valueDisplay?:
177
+ | string
178
+ | TNode<{
179
+ value: TagInputValue;
180
+ onClose: (index: number, item?: any) => void;
181
+ }>;
182
+ /**
183
+ * 失去焦点时触发,`context.inputValue` 表示输入框的值;`context.tagInputValue` 表示标签输入框的值
184
+ */
185
+ onBlur?: (value: SelectInputValue, context: SelectInputBlurContext) => void;
186
+ /**
187
+ * 清空按钮点击时触发
188
+ */
189
+ onClear?: (context: { e: MouseEvent<SVGSVGElement> }) => void;
190
+ /**
191
+ * 按键按下 Enter 时触发
192
+ */
193
+ onEnter?: (
194
+ value: SelectInputValue,
195
+ context: {
196
+ e: KeyboardEvent<HTMLDivElement>;
197
+ inputValue: string;
198
+ tagInputValue?: TagInputValue;
199
+ },
200
+ ) => void;
201
+ /**
202
+ * 聚焦时触发
203
+ */
204
+ onFocus?: (value: SelectInputValue, context: SelectInputFocusContext) => void;
205
+ /**
206
+ * 输入框值发生变化时触发,`context.trigger` 表示触发输入框值变化的来源:文本输入触发、清除按钮触发等
207
+ */
208
+ onInputChange?: (
209
+ value: string,
210
+ context?: SelectInputValueChangeContext,
211
+ ) => void;
212
+ /**
213
+ * 进入输入框时触发
214
+ */
215
+ onMouseenter?: (context: { e: MouseEvent<HTMLDivElement> }) => void;
216
+ /**
217
+ * 离开输入框时触发
218
+ */
219
+ onMouseleave?: (context: { e: MouseEvent<HTMLDivElement> }) => void;
220
+ /**
221
+ * 粘贴事件,`pasteValue` 表示粘贴板的内容
222
+ */
223
+ onPaste?: (context: {
224
+ e: ClipboardEvent<HTMLDivElement>;
225
+ pasteValue: string;
226
+ }) => void;
227
+ /**
228
+ * 下拉框显示或隐藏时触发
229
+ */
230
+ onPopupVisibleChange?: (
231
+ visible: boolean,
232
+ context: PopupVisibleChangeContext,
233
+ ) => void;
234
+ /**
235
+ * 值变化时触发,参数 `context.trigger` 表示数据变化的触发来源;`context.index` 指当前变化项的下标;`context.item` 指当前变化项;`context.e` 表示事件参数
236
+ */
237
+ onTagChange?: (
238
+ value: TagInputValue,
239
+ context: SelectInputChangeContext,
240
+ ) => void;
241
+ }
242
+
243
+ export interface SelectInputKeys {
244
+ label?: string;
245
+ value?: string;
246
+ children?: string;
247
+ }
248
+
249
+ export type SelectInputValue =
250
+ | string
251
+ | number
252
+ | boolean
253
+ | Date
254
+ | Object
255
+ | Array<any>
256
+ | Array<SelectInputValue>;
257
+
258
+ export type SelectInputBlurContext = PopupVisibleChangeContext & {
259
+ inputValue: string;
260
+ tagInputValue?: TagInputValue;
261
+ };
262
+
263
+ export interface SelectInputFocusContext {
264
+ inputValue: string;
265
+ tagInputValue?: TagInputValue;
266
+ e: FocusEvent<HTMLInputElement>;
267
+ }
268
+
269
+ export interface SelectInputValueChangeContext {
270
+ e?:
271
+ | Event
272
+ | FormEvent<HTMLInputElement>
273
+ | MouseEvent<HTMLElement | SVGElement>
274
+ | FocusEvent<HTMLInputElement>
275
+ | KeyboardEvent<HTMLInputElement>
276
+ | CompositionEvent<HTMLDivElement>;
277
+ trigger: 'input' | 'clear' | 'blur' | 'focus' | 'initial' | 'change';
278
+ }
279
+
280
+ export type SelectInputChangeContext = TagInputChangeContext;