lingee-ui 0.0.2 → 0.0.4
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.
- package/CHANGELOG.md +13 -0
- package/README.md +26 -30
- package/dist/button/index.css +1 -1
- package/dist/button/index.d.mts +33 -20
- package/dist/button/index.d.ts +33 -20
- package/dist/button/index.js +1 -1
- package/dist/button/index.mjs +1 -1
- package/dist/chunk-3S4GKEYZ.js +1 -0
- package/dist/chunk-ABUSNTD5.js +1 -0
- package/dist/chunk-AKPJCG6H.mjs +1 -0
- package/dist/chunk-BXRID4CE.mjs +1 -0
- package/dist/chunk-DGO7PR56.mjs +1 -0
- package/dist/chunk-JGDQOLZY.mjs +1 -0
- package/dist/chunk-KWM266DP.js +1 -0
- package/dist/chunk-P2VWBY5K.mjs +1 -0
- package/dist/chunk-PC42VJ3P.js +1 -0
- package/dist/chunk-PH576KBW.mjs +1 -0
- package/dist/chunk-PU26H3OJ.mjs +1 -0
- package/dist/chunk-QWCVZMAQ.mjs +1 -0
- package/dist/chunk-UQWEEWAS.js +1 -0
- package/dist/chunk-WS4NY6UV.js +1 -0
- package/dist/chunk-XZAE72IB.js +1 -0
- package/dist/chunk-Y3757K27.js +1 -0
- package/dist/index-B5SLxsZP.d.mts +8 -0
- package/dist/index-B5SLxsZP.d.ts +8 -0
- package/dist/index.css +1 -1
- package/dist/index.d.mts +1800 -10
- package/dist/index.d.ts +1800 -10
- package/dist/index.js +2 -1
- package/dist/index.mjs +2 -1
- package/dist/input/index.css +1 -1
- package/dist/input/index.d.mts +6 -3
- package/dist/input/index.d.ts +6 -3
- package/dist/input/index.js +1 -1
- package/dist/input/index.mjs +1 -1
- package/dist/popover/index.css +1 -0
- package/dist/popover/index.d.mts +97 -0
- package/dist/popover/index.d.ts +97 -0
- package/dist/popover/index.js +1 -0
- package/dist/popover/index.mjs +1 -0
- package/dist/switch/index.css +1 -1
- package/dist/switch/index.d.mts +2 -1
- package/dist/switch/index.d.ts +2 -1
- package/dist/switch/index.js +1 -1
- package/dist/switch/index.mjs +1 -1
- package/dist/tabs/index.css +1 -1
- package/dist/tabs/index.d.mts +5 -2
- package/dist/tabs/index.d.ts +5 -2
- package/dist/tabs/index.js +1 -1
- package/dist/tabs/index.mjs +1 -1
- package/dist/textarea/index.css +1 -1
- package/dist/textarea/index.d.mts +4 -2
- package/dist/textarea/index.d.ts +4 -2
- package/dist/textarea/index.js +1 -1
- package/dist/textarea/index.mjs +1 -1
- package/dist/toast/index.css +1 -1
- package/dist/toast/index.js +1 -1
- package/dist/toast/index.mjs +1 -1
- package/dist/tokens.css +1 -1
- package/dist/tooltip/index.css +1 -1
- package/dist/tooltip/index.d.mts +4 -2
- package/dist/tooltip/index.d.ts +4 -2
- package/dist/tooltip/index.js +1 -1
- package/dist/tooltip/index.mjs +1 -1
- package/package.json +36 -16
- package/dist/chunk-4DCMYPI5.js +0 -1
- package/dist/chunk-FPGKD7AM.mjs +0 -1
- package/dist/chunk-FSH4DMUD.js +0 -1
- package/dist/chunk-L46MOPWP.js +0 -1
- package/dist/chunk-LFN2SIDC.mjs +0 -1
- package/dist/chunk-LUX7TZYO.js +0 -1
- package/dist/chunk-LZLW6ZXA.js +0 -1
- package/dist/chunk-OBAN7QPT.mjs +0 -1
- package/dist/chunk-PN2SZLLY.js +0 -1
- package/dist/chunk-Q35KWXA2.js +0 -1
- package/dist/chunk-QPAXCNVH.mjs +0 -1
- package/dist/chunk-R6FAL3FJ.mjs +0 -1
- package/dist/chunk-Y5VSPBTD.mjs +0 -1
- package/dist/chunk-ZIBE2EZJ.mjs +0 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,12 +1,20 @@
|
|
|
1
|
-
|
|
1
|
+
import { ButtonProps } from './button/index.js';
|
|
2
|
+
export { Button, ButtonShape, ButtonVariant } from './button/index.js';
|
|
2
3
|
export { TabItem, Tabs, TabsProps, TabsSize, TabsVariant } from './tabs/index.js';
|
|
3
4
|
export { Tooltip, TooltipPlacement, TooltipProps } from './tooltip/index.js';
|
|
5
|
+
import { PopoverContentProps } from './popover/index.js';
|
|
6
|
+
export { Popover, PopoverAnchor, PopoverAnchorProps, PopoverArrow, PopoverArrowProps, PopoverClose, PopoverCloseProps, PopoverContent, PopoverPlacement, PopoverProps, PopoverTrigger, PopoverTriggerProps } from './popover/index.js';
|
|
4
7
|
export { Switch, SwitchProps, SwitchSize } from './switch/index.js';
|
|
5
8
|
export { Input, InputProps, InputShape, InputSize } from './input/index.js';
|
|
6
9
|
export { Textarea, TextareaProps } from './textarea/index.js';
|
|
7
10
|
export { ToastConfig, ToastGlobalConfig, ToastType, toast } from './toast/index.js';
|
|
8
11
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
9
|
-
import { ReactNode } from 'react';
|
|
12
|
+
import React$1, { ReactNode, HTMLAttributes, MouseEvent, CSSProperties, ComponentType, Key, ReactElement, UIEventHandler, Ref } from 'react';
|
|
13
|
+
import { L as LgSize } from './index-B5SLxsZP.js';
|
|
14
|
+
export { a as LgShape, b as LgVariant } from './index-B5SLxsZP.js';
|
|
15
|
+
import { SvgIconProps } from 'lingee-icon';
|
|
16
|
+
import { FormInstance as FormInstance$1, Rule } from 'rc-field-form/es/interface';
|
|
17
|
+
export { Rule } from 'rc-field-form/es/interface';
|
|
10
18
|
import { ClassValue } from 'clsx';
|
|
11
19
|
import 'class-variance-authority/types';
|
|
12
20
|
|
|
@@ -17,6 +25,81 @@ import 'class-variance-authority/types';
|
|
|
17
25
|
declare const zhCN: {
|
|
18
26
|
locale: string;
|
|
19
27
|
Button: {};
|
|
28
|
+
Breadcrumb: {
|
|
29
|
+
more: string;
|
|
30
|
+
back: string;
|
|
31
|
+
};
|
|
32
|
+
Select: {
|
|
33
|
+
loading: string;
|
|
34
|
+
loadError: string;
|
|
35
|
+
notFound: string;
|
|
36
|
+
clear: string;
|
|
37
|
+
};
|
|
38
|
+
Tag: {
|
|
39
|
+
close: string;
|
|
40
|
+
};
|
|
41
|
+
Upload: {
|
|
42
|
+
retry: string;
|
|
43
|
+
remove: string;
|
|
44
|
+
removeShort: string;
|
|
45
|
+
dragText: string;
|
|
46
|
+
clickUpload: string;
|
|
47
|
+
};
|
|
48
|
+
ColorPicker: {
|
|
49
|
+
placeholder: string;
|
|
50
|
+
};
|
|
51
|
+
DatePicker: {
|
|
52
|
+
placeholder: string;
|
|
53
|
+
today: string;
|
|
54
|
+
prevYear: string;
|
|
55
|
+
nextYear: string;
|
|
56
|
+
prevMonth: string;
|
|
57
|
+
nextMonth: string;
|
|
58
|
+
prevDecade: string;
|
|
59
|
+
nextDecade: string;
|
|
60
|
+
months: string[];
|
|
61
|
+
yearFormat: string;
|
|
62
|
+
monthFormat: string;
|
|
63
|
+
};
|
|
64
|
+
RangePicker: {
|
|
65
|
+
startPlaceholder: string;
|
|
66
|
+
endPlaceholder: string;
|
|
67
|
+
};
|
|
68
|
+
TimePicker: {
|
|
69
|
+
now: string;
|
|
70
|
+
confirm: string;
|
|
71
|
+
placeholder: string;
|
|
72
|
+
placeholderFull: string;
|
|
73
|
+
};
|
|
74
|
+
Table: {
|
|
75
|
+
empty: string;
|
|
76
|
+
};
|
|
77
|
+
Pagination: {
|
|
78
|
+
total: string;
|
|
79
|
+
prevPage: string;
|
|
80
|
+
nextPage: string;
|
|
81
|
+
itemsPerPage: string;
|
|
82
|
+
jumpTo: string;
|
|
83
|
+
page: string;
|
|
84
|
+
};
|
|
85
|
+
Dialog: {
|
|
86
|
+
close: string;
|
|
87
|
+
};
|
|
88
|
+
Drawer: {
|
|
89
|
+
close: string;
|
|
90
|
+
};
|
|
91
|
+
Input: {
|
|
92
|
+
clear: string;
|
|
93
|
+
};
|
|
94
|
+
Alert: {
|
|
95
|
+
close: string;
|
|
96
|
+
};
|
|
97
|
+
Toast: {
|
|
98
|
+
close: string;
|
|
99
|
+
};
|
|
100
|
+
Spin: {
|
|
101
|
+
loading: string;
|
|
102
|
+
};
|
|
20
103
|
};
|
|
21
104
|
|
|
22
105
|
/** 语言包类型,由 zh-CN 推导结构 */
|
|
@@ -34,6 +117,81 @@ interface LingeeProviderProps {
|
|
|
34
117
|
declare const enUS: {
|
|
35
118
|
locale: string;
|
|
36
119
|
Button: {};
|
|
120
|
+
Breadcrumb: {
|
|
121
|
+
more: string;
|
|
122
|
+
back: string;
|
|
123
|
+
};
|
|
124
|
+
Select: {
|
|
125
|
+
loading: string;
|
|
126
|
+
loadError: string;
|
|
127
|
+
notFound: string;
|
|
128
|
+
clear: string;
|
|
129
|
+
};
|
|
130
|
+
Tag: {
|
|
131
|
+
close: string;
|
|
132
|
+
};
|
|
133
|
+
Upload: {
|
|
134
|
+
retry: string;
|
|
135
|
+
remove: string;
|
|
136
|
+
removeShort: string;
|
|
137
|
+
dragText: string;
|
|
138
|
+
clickUpload: string;
|
|
139
|
+
};
|
|
140
|
+
ColorPicker: {
|
|
141
|
+
placeholder: string;
|
|
142
|
+
};
|
|
143
|
+
DatePicker: {
|
|
144
|
+
placeholder: string;
|
|
145
|
+
today: string;
|
|
146
|
+
prevYear: string;
|
|
147
|
+
nextYear: string;
|
|
148
|
+
prevMonth: string;
|
|
149
|
+
nextMonth: string;
|
|
150
|
+
prevDecade: string;
|
|
151
|
+
nextDecade: string;
|
|
152
|
+
months: string[];
|
|
153
|
+
yearFormat: string;
|
|
154
|
+
monthFormat: string;
|
|
155
|
+
};
|
|
156
|
+
RangePicker: {
|
|
157
|
+
startPlaceholder: string;
|
|
158
|
+
endPlaceholder: string;
|
|
159
|
+
};
|
|
160
|
+
TimePicker: {
|
|
161
|
+
now: string;
|
|
162
|
+
confirm: string;
|
|
163
|
+
placeholder: string;
|
|
164
|
+
placeholderFull: string;
|
|
165
|
+
};
|
|
166
|
+
Table: {
|
|
167
|
+
empty: string;
|
|
168
|
+
};
|
|
169
|
+
Pagination: {
|
|
170
|
+
total: string;
|
|
171
|
+
prevPage: string;
|
|
172
|
+
nextPage: string;
|
|
173
|
+
itemsPerPage: string;
|
|
174
|
+
jumpTo: string;
|
|
175
|
+
page: string;
|
|
176
|
+
};
|
|
177
|
+
Dialog: {
|
|
178
|
+
close: string;
|
|
179
|
+
};
|
|
180
|
+
Drawer: {
|
|
181
|
+
close: string;
|
|
182
|
+
};
|
|
183
|
+
Input: {
|
|
184
|
+
clear: string;
|
|
185
|
+
};
|
|
186
|
+
Alert: {
|
|
187
|
+
close: string;
|
|
188
|
+
};
|
|
189
|
+
Toast: {
|
|
190
|
+
close: string;
|
|
191
|
+
};
|
|
192
|
+
Spin: {
|
|
193
|
+
loading: string;
|
|
194
|
+
};
|
|
37
195
|
};
|
|
38
196
|
|
|
39
197
|
/**
|
|
@@ -64,6 +222,1645 @@ declare function useLocale(): Locale;
|
|
|
64
222
|
*/
|
|
65
223
|
declare function useComponentLocale<K extends keyof Omit<Locale, "locale">>(componentName: K): Locale[K];
|
|
66
224
|
|
|
225
|
+
/** 预设语义色 */
|
|
226
|
+
type TagPresetColor = "primary" | "info" | "success" | "warning" | "danger";
|
|
227
|
+
/** 标签尺寸 */
|
|
228
|
+
type TagSize = LgSize;
|
|
229
|
+
/** 标签圆角形状 */
|
|
230
|
+
type TagShape = "pill" | "rounded";
|
|
231
|
+
interface TagProps extends Omit<HTMLAttributes<HTMLSpanElement>, "color"> {
|
|
232
|
+
/** 色彩:预设语义色 或 任意 CSS 色值字符串,默认 "info" */
|
|
233
|
+
color?: TagPresetColor | (string & {});
|
|
234
|
+
/** 尺寸,默认 "md"(sm: 20px, md: 24px, lg: 32px) */
|
|
235
|
+
size?: TagSize;
|
|
236
|
+
/** 圆角形状,默认 "pill"(pill: 999px, rounded: 8px) */
|
|
237
|
+
shape?: TagShape;
|
|
238
|
+
/** 自定义背景(覆盖默认背景,支持渐变等任意 CSS background 值) */
|
|
239
|
+
background?: string;
|
|
240
|
+
/** 是否可关闭(显示关闭按钮) */
|
|
241
|
+
closable?: boolean;
|
|
242
|
+
/** 关闭回调 */
|
|
243
|
+
onClose?: (e: MouseEvent<HTMLSpanElement>) => void;
|
|
244
|
+
/** 子内容(文字、图标自由组合) */
|
|
245
|
+
children?: ReactNode;
|
|
246
|
+
}
|
|
247
|
+
|
|
248
|
+
/**
|
|
249
|
+
* Tag 标签组件
|
|
250
|
+
* 支持预设语义色、自定义色值、自定义背景(渐变)、可关闭等能力
|
|
251
|
+
*/
|
|
252
|
+
declare const Tag: React$1.ForwardRefExoticComponent<TagProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
253
|
+
|
|
254
|
+
/** 透传给 OK/Cancel 按钮的属性子集(排除 children 和事件,由 Dialog 统一管理) */
|
|
255
|
+
type DialogButtonProps = Omit<ButtonProps, "children" | "onClick" | "htmlType">;
|
|
256
|
+
interface DialogProps {
|
|
257
|
+
/** 是否打开 */
|
|
258
|
+
open: boolean;
|
|
259
|
+
/** 状态变化回调(关闭时 nextOpen=false) */
|
|
260
|
+
onOpenChange: (open: boolean) => void;
|
|
261
|
+
/** 弹窗宽度,默认 460 */
|
|
262
|
+
width?: number | string;
|
|
263
|
+
/** 弹窗高度,默认自适应内容 */
|
|
264
|
+
height?: number | string;
|
|
265
|
+
/** 标题(支持 ReactNode) */
|
|
266
|
+
title?: ReactNode;
|
|
267
|
+
/** 标题栏右侧额外内容 */
|
|
268
|
+
extra?: ReactNode;
|
|
269
|
+
/** 是否显示关闭按钮,默认 true */
|
|
270
|
+
closable?: boolean;
|
|
271
|
+
/** 底部操作区,传 ReactNode 完全自定义;传 null 隐藏 */
|
|
272
|
+
footer?: ReactNode;
|
|
273
|
+
/** 确认按钮文字(传入后自动渲染 footer,与 footer 互斥) */
|
|
274
|
+
okText?: string;
|
|
275
|
+
/** 取消按钮文字 */
|
|
276
|
+
cancelText?: string;
|
|
277
|
+
/** 确认回调(支持异步,返回 Promise 时按钮显示 loading) */
|
|
278
|
+
onOk?: () => void | Promise<void>;
|
|
279
|
+
/** 取消回调 */
|
|
280
|
+
onCancel?: () => void;
|
|
281
|
+
/** 确认按钮是否为危险样式 */
|
|
282
|
+
okDanger?: boolean;
|
|
283
|
+
/** 确认按钮额外属性(disabled、loading、size 等) */
|
|
284
|
+
okProps?: DialogButtonProps;
|
|
285
|
+
/** 取消按钮额外属性 */
|
|
286
|
+
cancelProps?: DialogButtonProps;
|
|
287
|
+
/** 是否为模态(true 时点击遮罩不关闭),默认 false */
|
|
288
|
+
modal?: boolean;
|
|
289
|
+
/** 是否显示遮罩层,默认 true */
|
|
290
|
+
mask?: boolean;
|
|
291
|
+
/** 关闭后是否销毁子节点,默认 true */
|
|
292
|
+
destroyOnHidden?: boolean;
|
|
293
|
+
/** 自定义 z-index */
|
|
294
|
+
zIndex?: number;
|
|
295
|
+
/** 内容区最大高度,默认 640px */
|
|
296
|
+
maxHeight?: number | string;
|
|
297
|
+
/** 开启后 body 高度跟随内容自适应,弹窗整体高度由 maxHeight 兜底上限,默认 false */
|
|
298
|
+
autoHeight?: boolean;
|
|
299
|
+
/** 自定义类名 */
|
|
300
|
+
className?: string;
|
|
301
|
+
/** 自定义样式 */
|
|
302
|
+
style?: CSSProperties;
|
|
303
|
+
/** 弹窗内容 */
|
|
304
|
+
children?: ReactNode;
|
|
305
|
+
}
|
|
306
|
+
/** Dialog.confirm 命令式参数 */
|
|
307
|
+
interface DialogConfirmOptions extends Omit<DialogProps, "open" | "onOpenChange" | "children"> {
|
|
308
|
+
/** 描述文案(使用默认布局时展示) */
|
|
309
|
+
description?: ReactNode;
|
|
310
|
+
/** 标题前的图标(使用默认布局时展示) */
|
|
311
|
+
icon?: ReactNode;
|
|
312
|
+
/** 自定义内容,传入后 title/description/icon 不生效 */
|
|
313
|
+
content?: ReactNode;
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
/**
|
|
317
|
+
* Dialog 对话框组件
|
|
318
|
+
* 基于 @radix-ui/react-dialog,提供焦点陷阱、Esc 关闭、aria 属性
|
|
319
|
+
*/
|
|
320
|
+
declare const Dialog$1: React$1.FC<DialogProps>;
|
|
321
|
+
|
|
322
|
+
/**
|
|
323
|
+
* 命令式确认弹窗
|
|
324
|
+
* @returns Promise<boolean> — 确认返回 true,取消返回 false
|
|
325
|
+
*/
|
|
326
|
+
declare function confirm(options: DialogConfirmOptions): Promise<boolean>;
|
|
327
|
+
/** 命令式关闭当前 confirm 弹窗(不 resolve,用于外部强制关闭兜底) */
|
|
328
|
+
declare function closeConfirm(): void;
|
|
329
|
+
|
|
330
|
+
type DialogType = typeof Dialog$1 & {
|
|
331
|
+
confirm: typeof confirm;
|
|
332
|
+
closeConfirm: typeof closeConfirm;
|
|
333
|
+
};
|
|
334
|
+
declare const Dialog: DialogType;
|
|
335
|
+
|
|
336
|
+
type SelectSize = LgSize;
|
|
337
|
+
type SelectMode = "single" | "multiple";
|
|
338
|
+
/** 选项数据结构 */
|
|
339
|
+
interface SelectOption<T = string> {
|
|
340
|
+
/** 选项值 */
|
|
341
|
+
value: T;
|
|
342
|
+
/** 显示文本(支持 ReactNode 用于下拉面板富渲染) */
|
|
343
|
+
label: ReactNode;
|
|
344
|
+
/** 纯文本标签(用于搜索输入框 placeholder 等场景;未提供时尝试从 label 取字符串) */
|
|
345
|
+
textLabel?: string;
|
|
346
|
+
/** 是否禁用 */
|
|
347
|
+
disabled?: boolean;
|
|
348
|
+
}
|
|
349
|
+
/** 分组选项 */
|
|
350
|
+
interface SelectOptionGroup<T = string> {
|
|
351
|
+
/** 分组标题 */
|
|
352
|
+
label: string;
|
|
353
|
+
/** 分组下的选项 */
|
|
354
|
+
options: SelectOption<T>[];
|
|
355
|
+
}
|
|
356
|
+
/** 下拉面板配置 — 继承 Popover 浮层定位能力 */
|
|
357
|
+
interface SelectDropdownProps extends Pick<PopoverContentProps, "side" | "align" | "sideOffset" | "alignOffset" | "className" | "collisionPadding" | "container"> {
|
|
358
|
+
/** 下拉面板宽度,默认与触发器同宽 */
|
|
359
|
+
width?: number | "auto";
|
|
360
|
+
/** 下拉面板最大高度,默认 256 */
|
|
361
|
+
maxHeight?: number;
|
|
362
|
+
/**
|
|
363
|
+
* 自定义下拉面板渲染
|
|
364
|
+
* - 参数 menu 为默认的选项列表 ReactNode
|
|
365
|
+
* - 传入时可在默认选项列表基础上包装额外内容
|
|
366
|
+
*/
|
|
367
|
+
render?: (menu: ReactNode) => ReactNode;
|
|
368
|
+
/** 无匹配时展示内容 */
|
|
369
|
+
notFoundContent?: ReactNode;
|
|
370
|
+
/** 下拉面板滚动回调(用于滚动加载) */
|
|
371
|
+
onScroll?: (e: React.UIEvent<HTMLDivElement>) => void;
|
|
372
|
+
}
|
|
373
|
+
interface SelectProps<T = string> {
|
|
374
|
+
/** 选择模式,默认 "single" */
|
|
375
|
+
mode?: SelectMode;
|
|
376
|
+
/** 受控值:单选为 T,多选为 T[] */
|
|
377
|
+
value?: T | T[];
|
|
378
|
+
/** 非受控默认值 */
|
|
379
|
+
defaultValue?: T | T[];
|
|
380
|
+
/** 值变化回调 */
|
|
381
|
+
onChange?: (value: T | T[], option: SelectOption<T> | SelectOption<T>[]) => void;
|
|
382
|
+
/** 选项列表 */
|
|
383
|
+
options?: SelectOption<T>[];
|
|
384
|
+
/** 是否支持搜索,默认 false */
|
|
385
|
+
showSearch?: boolean;
|
|
386
|
+
/**
|
|
387
|
+
* 前端过滤函数
|
|
388
|
+
* - 默认按 label 文本做 includes 匹配
|
|
389
|
+
* - 设为 false 时关闭前端过滤(配合 onSearch 远程搜索)
|
|
390
|
+
*/
|
|
391
|
+
filterOption?: false | ((inputValue: string, option: SelectOption<T>) => boolean);
|
|
392
|
+
/** 搜索关键词变化回调(用于远程搜索场景) */
|
|
393
|
+
onSearch?: (keyword: string) => void;
|
|
394
|
+
/** 加载中状态(远程搜索时展示 loading) */
|
|
395
|
+
loading?: boolean;
|
|
396
|
+
/** 加载失败状态(下拉面板展示「加载失败,请重试」缺省) */
|
|
397
|
+
loadError?: boolean;
|
|
398
|
+
/** 禁用 */
|
|
399
|
+
disabled?: boolean;
|
|
400
|
+
/** 错误态 */
|
|
401
|
+
error?: boolean;
|
|
402
|
+
/** 尺寸,默认 "md" */
|
|
403
|
+
size?: SelectSize;
|
|
404
|
+
/** 占位文本 */
|
|
405
|
+
placeholder?: string;
|
|
406
|
+
/** 是否显示清空按钮,默认 false */
|
|
407
|
+
allowClear?: boolean;
|
|
408
|
+
/** 自定义后缀图标(覆盖默认箭头) */
|
|
409
|
+
suffixIcon?: ReactNode;
|
|
410
|
+
/** 多选模式下最多展示的 Tag 数量,超出显示 +N */
|
|
411
|
+
maxTagCount?: number;
|
|
412
|
+
/** 下拉面板配置 */
|
|
413
|
+
dropdown?: SelectDropdownProps;
|
|
414
|
+
/** 下拉展开/收起回调 */
|
|
415
|
+
onDropdownVisibleChange?: (open: boolean) => void;
|
|
416
|
+
/**
|
|
417
|
+
* 自定义选中值在触发器中的渲染(Tag 文本 / 单选显示值)
|
|
418
|
+
* - 不传时默认渲染 option.label
|
|
419
|
+
* - 用于下拉面板展示丰富内容(如头像+名字+工号),但触发器只显示简短文本(如名字)
|
|
420
|
+
*/
|
|
421
|
+
labelRender?: (value: T, option: SelectOption<T> | undefined) => ReactNode;
|
|
422
|
+
className?: string;
|
|
423
|
+
style?: CSSProperties;
|
|
424
|
+
}
|
|
425
|
+
|
|
426
|
+
/**
|
|
427
|
+
* 支持泛型的 forwardRef
|
|
428
|
+
* 用法:<Select<string> options={...} />
|
|
429
|
+
*/
|
|
430
|
+
declare const Select: <T = string>(props: SelectProps<T> & {
|
|
431
|
+
ref?: React$1.Ref<HTMLDivElement>;
|
|
432
|
+
}) => React$1.ReactElement | null;
|
|
433
|
+
|
|
434
|
+
interface DropdownMenuItemData {
|
|
435
|
+
type?: "item";
|
|
436
|
+
/** 唯一标识 */
|
|
437
|
+
key: string;
|
|
438
|
+
/** 菜单项文字 */
|
|
439
|
+
label: ReactNode;
|
|
440
|
+
/** 前置图标 */
|
|
441
|
+
icon?: ReactNode;
|
|
442
|
+
/** 是否为危险操作 */
|
|
443
|
+
danger?: boolean;
|
|
444
|
+
/** 是否禁用 */
|
|
445
|
+
disabled?: boolean;
|
|
446
|
+
/** 选中回调 */
|
|
447
|
+
onSelect?: (event: Event) => void;
|
|
448
|
+
}
|
|
449
|
+
interface DropdownSeparatorData {
|
|
450
|
+
type: "separator";
|
|
451
|
+
}
|
|
452
|
+
interface DropdownLabelData {
|
|
453
|
+
type: "label";
|
|
454
|
+
label: ReactNode;
|
|
455
|
+
}
|
|
456
|
+
/** items 快捷模式的数据项类型 */
|
|
457
|
+
type DropdownItemData = DropdownMenuItemData | DropdownSeparatorData | DropdownLabelData;
|
|
458
|
+
interface DropdownProps {
|
|
459
|
+
/** 子元素(Trigger + Content),或仅 Trigger 元素(配合 items 快捷模式) */
|
|
460
|
+
children: ReactNode;
|
|
461
|
+
/** 受控开关 */
|
|
462
|
+
open?: boolean;
|
|
463
|
+
/** 非受控默认打开状态 */
|
|
464
|
+
defaultOpen?: boolean;
|
|
465
|
+
/** 开关变化回调 */
|
|
466
|
+
onOpenChange?: (open: boolean) => void;
|
|
467
|
+
/** 是否为 modal 模式(锁定背景交互),默认 true */
|
|
468
|
+
modal?: boolean;
|
|
469
|
+
/**
|
|
470
|
+
* 快捷模式:传入菜单项数组,自动渲染 DropdownContent
|
|
471
|
+
* 与 Compound Component 互斥,传 items 时 children 作为触发器
|
|
472
|
+
*/
|
|
473
|
+
items?: DropdownItemData[];
|
|
474
|
+
/** items 快捷模式下面板的定位配置 */
|
|
475
|
+
contentProps?: Omit<DropdownContentProps, "children">;
|
|
476
|
+
/** 当前选中的 item key 列表,匹配的项会显示勾选图标 */
|
|
477
|
+
selectedKeys?: string[];
|
|
478
|
+
/** 加载中状态,为 true 时显示 loadingContent 或默认 loading */
|
|
479
|
+
loading?: boolean;
|
|
480
|
+
/** 自定义加载中渲染内容 */
|
|
481
|
+
loadingContent?: ReactNode;
|
|
482
|
+
/** 自定义空态渲染内容(items 为空数组且非 loading 时显示) */
|
|
483
|
+
emptyContent?: ReactNode;
|
|
484
|
+
/**
|
|
485
|
+
* 自定义面板渲染,参数 menu 为默认渲染的菜单项列表
|
|
486
|
+
* 可在 menu 前后包裹额外内容
|
|
487
|
+
*/
|
|
488
|
+
dropdownRender?: (menu: ReactNode) => ReactNode;
|
|
489
|
+
/** 固定在面板顶部的内容(不随列表滚动) */
|
|
490
|
+
header?: ReactNode;
|
|
491
|
+
/** 固定在面板底部的内容(不随列表滚动) */
|
|
492
|
+
footer?: ReactNode;
|
|
493
|
+
}
|
|
494
|
+
interface DropdownTriggerProps {
|
|
495
|
+
/** 触发器子元素 */
|
|
496
|
+
children: ReactNode;
|
|
497
|
+
/** 合并到子元素而非额外包裹 DOM,默认 true */
|
|
498
|
+
asChild?: boolean;
|
|
499
|
+
}
|
|
500
|
+
interface DropdownContentProps extends Pick<PopoverContentProps, "side" | "align" | "sideOffset" | "alignOffset" | "className" | "collisionPadding" | "container" | "onEscapeKeyDown" | "onPointerDownOutside" | "onInteractOutside" | "onCloseAutoFocus"> {
|
|
501
|
+
/** 面板子内容 */
|
|
502
|
+
children: ReactNode;
|
|
503
|
+
/**
|
|
504
|
+
* 面板自定义样式
|
|
505
|
+
* - minWidth: 面板最小宽度(默认 128px)
|
|
506
|
+
* - maxHeight: 设置后菜单列表超出时内置 ScrollArea 滚动
|
|
507
|
+
* - width / maxWidth 等其它 CSS 属性均可使用
|
|
508
|
+
*/
|
|
509
|
+
style?: CSSProperties;
|
|
510
|
+
/** 固定在面板顶部的内容(不随列表滚动) */
|
|
511
|
+
header?: ReactNode;
|
|
512
|
+
/** 固定在面板底部的内容(不随列表滚动) */
|
|
513
|
+
footer?: ReactNode;
|
|
514
|
+
}
|
|
515
|
+
interface DropdownItemProps {
|
|
516
|
+
/** 菜单项内容 */
|
|
517
|
+
children: ReactNode;
|
|
518
|
+
/** 额外类名 */
|
|
519
|
+
className?: string;
|
|
520
|
+
/** 是否禁用 */
|
|
521
|
+
disabled?: boolean;
|
|
522
|
+
/** 危险操作(红色样式) */
|
|
523
|
+
danger?: boolean;
|
|
524
|
+
/** 前置图标 */
|
|
525
|
+
icon?: ReactNode;
|
|
526
|
+
/** 是否选中(显示勾选图标) */
|
|
527
|
+
selected?: boolean;
|
|
528
|
+
/** 选中回调,调用 event.preventDefault() 可阻止面板自动关闭 */
|
|
529
|
+
onSelect?: (event: Event) => void;
|
|
530
|
+
}
|
|
531
|
+
interface DropdownCheckboxItemProps {
|
|
532
|
+
/** 菜单项内容 */
|
|
533
|
+
children: ReactNode;
|
|
534
|
+
/** 额外类名 */
|
|
535
|
+
className?: string;
|
|
536
|
+
/** 是否选中 */
|
|
537
|
+
checked?: boolean;
|
|
538
|
+
/** 是否禁用 */
|
|
539
|
+
disabled?: boolean;
|
|
540
|
+
/** 前置图标 */
|
|
541
|
+
icon?: ReactNode;
|
|
542
|
+
/** 选中状态变化回调 */
|
|
543
|
+
onCheckedChange?: (checked: boolean) => void;
|
|
544
|
+
}
|
|
545
|
+
interface DropdownRadioGroupProps {
|
|
546
|
+
/** 子元素(DropdownRadioItem) */
|
|
547
|
+
children: ReactNode;
|
|
548
|
+
/** 当前选中值 */
|
|
549
|
+
value?: string;
|
|
550
|
+
/** 值变化回调 */
|
|
551
|
+
onValueChange?: (value: string) => void;
|
|
552
|
+
}
|
|
553
|
+
interface DropdownRadioItemProps {
|
|
554
|
+
/** 菜单项内容 */
|
|
555
|
+
children: ReactNode;
|
|
556
|
+
/** 额外类名 */
|
|
557
|
+
className?: string;
|
|
558
|
+
/** 选项值 */
|
|
559
|
+
value: string;
|
|
560
|
+
/** 是否禁用 */
|
|
561
|
+
disabled?: boolean;
|
|
562
|
+
/** 前置图标 */
|
|
563
|
+
icon?: ReactNode;
|
|
564
|
+
}
|
|
565
|
+
interface DropdownLabelProps {
|
|
566
|
+
/** 标题内容 */
|
|
567
|
+
children: ReactNode;
|
|
568
|
+
/** 额外类名 */
|
|
569
|
+
className?: string;
|
|
570
|
+
}
|
|
571
|
+
interface DropdownSeparatorProps {
|
|
572
|
+
/** 额外类名 */
|
|
573
|
+
className?: string;
|
|
574
|
+
}
|
|
575
|
+
interface DropdownGroupProps {
|
|
576
|
+
/** 分组内容 */
|
|
577
|
+
children: ReactNode;
|
|
578
|
+
}
|
|
579
|
+
interface DropdownSubProps {
|
|
580
|
+
/** 子元素(SubTrigger + SubContent) */
|
|
581
|
+
children: ReactNode;
|
|
582
|
+
/** 受控开关 */
|
|
583
|
+
open?: boolean;
|
|
584
|
+
/** 非受控默认打开状态 */
|
|
585
|
+
defaultOpen?: boolean;
|
|
586
|
+
/** 开关变化回调 */
|
|
587
|
+
onOpenChange?: (open: boolean) => void;
|
|
588
|
+
}
|
|
589
|
+
interface DropdownSubTriggerProps {
|
|
590
|
+
/** 子菜单触发项内容 */
|
|
591
|
+
children: ReactNode;
|
|
592
|
+
/** 额外类名 */
|
|
593
|
+
className?: string;
|
|
594
|
+
/** 是否禁用 */
|
|
595
|
+
disabled?: boolean;
|
|
596
|
+
/** 前置图标 */
|
|
597
|
+
icon?: ReactNode;
|
|
598
|
+
}
|
|
599
|
+
interface DropdownSubContentProps extends Pick<PopoverContentProps, "side" | "align" | "sideOffset" | "alignOffset" | "className" | "collisionPadding" | "container"> {
|
|
600
|
+
/** 子菜单面板内容 */
|
|
601
|
+
children: ReactNode;
|
|
602
|
+
}
|
|
603
|
+
|
|
604
|
+
declare function Dropdown({ children, open, defaultOpen, onOpenChange, modal, items, contentProps, selectedKeys, loading, loadingContent, emptyContent, dropdownRender, header, footer, }: DropdownProps): react_jsx_runtime.JSX.Element;
|
|
605
|
+
declare namespace Dropdown {
|
|
606
|
+
var displayName: string;
|
|
607
|
+
}
|
|
608
|
+
declare const DropdownTrigger: React$1.ForwardRefExoticComponent<DropdownTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
609
|
+
declare const DropdownContent: React$1.ForwardRefExoticComponent<DropdownContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
610
|
+
declare const DropdownItem: React$1.ForwardRefExoticComponent<DropdownItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
611
|
+
declare const DropdownCheckboxItem: React$1.ForwardRefExoticComponent<DropdownCheckboxItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
612
|
+
declare function DropdownRadioGroup({ children, value, onValueChange }: DropdownRadioGroupProps): react_jsx_runtime.JSX.Element;
|
|
613
|
+
declare namespace DropdownRadioGroup {
|
|
614
|
+
var displayName: string;
|
|
615
|
+
}
|
|
616
|
+
declare const DropdownRadioItem: React$1.ForwardRefExoticComponent<DropdownRadioItemProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
617
|
+
declare function DropdownLabel({ children, className }: DropdownLabelProps): react_jsx_runtime.JSX.Element;
|
|
618
|
+
declare namespace DropdownLabel {
|
|
619
|
+
var displayName: string;
|
|
620
|
+
}
|
|
621
|
+
declare function DropdownSeparator({ className }: DropdownSeparatorProps): react_jsx_runtime.JSX.Element;
|
|
622
|
+
declare namespace DropdownSeparator {
|
|
623
|
+
var displayName: string;
|
|
624
|
+
}
|
|
625
|
+
declare function DropdownGroup({ children }: DropdownGroupProps): react_jsx_runtime.JSX.Element;
|
|
626
|
+
declare namespace DropdownGroup {
|
|
627
|
+
var displayName: string;
|
|
628
|
+
}
|
|
629
|
+
declare function DropdownSub({ children, open, defaultOpen, onOpenChange }: DropdownSubProps): react_jsx_runtime.JSX.Element;
|
|
630
|
+
declare namespace DropdownSub {
|
|
631
|
+
var displayName: string;
|
|
632
|
+
}
|
|
633
|
+
declare const DropdownSubTrigger: React$1.ForwardRefExoticComponent<DropdownSubTriggerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
634
|
+
declare const DropdownSubContent: React$1.ForwardRefExoticComponent<DropdownSubContentProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
635
|
+
|
|
636
|
+
type DatePickerSize = LgSize;
|
|
637
|
+
interface DatePickerProps {
|
|
638
|
+
/** 受控值 */
|
|
639
|
+
value?: Date | null;
|
|
640
|
+
/** 非受控默认值 */
|
|
641
|
+
defaultValue?: Date | null;
|
|
642
|
+
/** 值变化回调 */
|
|
643
|
+
onChange?: (value: Date | null) => void;
|
|
644
|
+
/** 禁用日期判断函数 */
|
|
645
|
+
disabledDate?: (date: Date) => boolean;
|
|
646
|
+
/** 可选范围最小日期 */
|
|
647
|
+
minDate?: Date;
|
|
648
|
+
/** 可选范围最大日期 */
|
|
649
|
+
maxDate?: Date;
|
|
650
|
+
/** 日期格式化,默认 "yyyy/MM/dd" */
|
|
651
|
+
format?: string;
|
|
652
|
+
/** 一周起始日,默认 1(周一) */
|
|
653
|
+
weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
|
|
654
|
+
/** 是否显示今天按钮,默认 true */
|
|
655
|
+
showToday?: boolean;
|
|
656
|
+
/** 禁用 */
|
|
657
|
+
disabled?: boolean;
|
|
658
|
+
/** 错误态 */
|
|
659
|
+
error?: boolean;
|
|
660
|
+
/** 错误提示文案 */
|
|
661
|
+
errorMessage?: string;
|
|
662
|
+
/** 尺寸,默认 "md" */
|
|
663
|
+
size?: DatePickerSize;
|
|
664
|
+
/** 占位文本,默认 "年/月/日" */
|
|
665
|
+
placeholder?: string;
|
|
666
|
+
/** 是否显示清空按钮,默认 true */
|
|
667
|
+
allowClear?: boolean;
|
|
668
|
+
/** 浮层挂载容器 */
|
|
669
|
+
getPopupContainer?: () => HTMLElement;
|
|
670
|
+
/** 面板展开/收起回调 */
|
|
671
|
+
onOpenChange?: (open: boolean) => void;
|
|
672
|
+
className?: string;
|
|
673
|
+
style?: CSSProperties;
|
|
674
|
+
}
|
|
675
|
+
|
|
676
|
+
/**
|
|
677
|
+
* DatePicker 日期选择器
|
|
678
|
+
*
|
|
679
|
+
* 单选日期,基于 Popover 弹层 + react-day-picker 日历面板实现。
|
|
680
|
+
* 支持年/月快速切换面板、今天按钮、日期禁用。
|
|
681
|
+
*/
|
|
682
|
+
declare const DatePicker: React$1.ForwardRefExoticComponent<DatePickerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
683
|
+
|
|
684
|
+
type RangePickerSize = LgSize;
|
|
685
|
+
type DateRange = {
|
|
686
|
+
from: Date | null;
|
|
687
|
+
to: Date | null;
|
|
688
|
+
};
|
|
689
|
+
interface RangePickerProps {
|
|
690
|
+
/** 受控值 */
|
|
691
|
+
value?: DateRange | null;
|
|
692
|
+
/** 非受控默认值 */
|
|
693
|
+
defaultValue?: DateRange | null;
|
|
694
|
+
/** 值变化回调 */
|
|
695
|
+
onChange?: (value: DateRange | null) => void;
|
|
696
|
+
/** 禁用日期判断函数 */
|
|
697
|
+
disabledDate?: (date: Date) => boolean;
|
|
698
|
+
/** 可选范围最小日期 */
|
|
699
|
+
minDate?: Date;
|
|
700
|
+
/** 可选范围最大日期 */
|
|
701
|
+
maxDate?: Date;
|
|
702
|
+
/** 日期格式化,默认 "yyyy/MM/dd" */
|
|
703
|
+
format?: string;
|
|
704
|
+
/** 一周起始日,默认 1(周一) */
|
|
705
|
+
weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
|
|
706
|
+
/** 分隔符,默认 "~" */
|
|
707
|
+
separator?: string;
|
|
708
|
+
/** 禁用 */
|
|
709
|
+
disabled?: boolean;
|
|
710
|
+
/** 错误态 */
|
|
711
|
+
error?: boolean;
|
|
712
|
+
/** 错误提示文案 */
|
|
713
|
+
errorMessage?: string;
|
|
714
|
+
/** 尺寸,默认 "md" */
|
|
715
|
+
size?: RangePickerSize;
|
|
716
|
+
/** 起始占位文本,默认 "年/月/日" */
|
|
717
|
+
placeholder?: [string, string];
|
|
718
|
+
/** 是否显示清空按钮,默认 true */
|
|
719
|
+
allowClear?: boolean;
|
|
720
|
+
/** 浮层挂载容器 */
|
|
721
|
+
getPopupContainer?: () => HTMLElement;
|
|
722
|
+
/** 面板展开/收起回调 */
|
|
723
|
+
onOpenChange?: (open: boolean) => void;
|
|
724
|
+
className?: string;
|
|
725
|
+
style?: CSSProperties;
|
|
726
|
+
}
|
|
727
|
+
|
|
728
|
+
/**
|
|
729
|
+
* RangePicker 日期范围选择器
|
|
730
|
+
*
|
|
731
|
+
* 双面板并排,选择起止日期。
|
|
732
|
+
*/
|
|
733
|
+
declare const RangePicker: React$1.ForwardRefExoticComponent<RangePickerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
734
|
+
|
|
735
|
+
type TimePickerSize = LgSize;
|
|
736
|
+
interface TimeValue {
|
|
737
|
+
hour: number;
|
|
738
|
+
minute: number;
|
|
739
|
+
second?: number;
|
|
740
|
+
}
|
|
741
|
+
interface TimePickerProps {
|
|
742
|
+
/** 受控值 */
|
|
743
|
+
value?: TimeValue | null;
|
|
744
|
+
/** 非受控默认值 */
|
|
745
|
+
defaultValue?: TimeValue | null;
|
|
746
|
+
/** 值变化回调 */
|
|
747
|
+
onChange?: (value: TimeValue | null) => void;
|
|
748
|
+
/** 是否显示秒列,默认 false(HH:mm 模式) */
|
|
749
|
+
showSeconds?: boolean;
|
|
750
|
+
/** 禁用 */
|
|
751
|
+
disabled?: boolean;
|
|
752
|
+
/** 错误态 */
|
|
753
|
+
error?: boolean;
|
|
754
|
+
/** 错误提示文案 */
|
|
755
|
+
errorMessage?: string;
|
|
756
|
+
/** 尺寸,默认 "md" */
|
|
757
|
+
size?: TimePickerSize;
|
|
758
|
+
/** 占位文本 */
|
|
759
|
+
placeholder?: string;
|
|
760
|
+
/** 是否显示清空按钮,默认 true */
|
|
761
|
+
allowClear?: boolean;
|
|
762
|
+
/** 浮层挂载容器 */
|
|
763
|
+
getPopupContainer?: () => HTMLElement;
|
|
764
|
+
/** 面板展开/收起回调 */
|
|
765
|
+
onOpenChange?: (open: boolean) => void;
|
|
766
|
+
/** 样式类名 */
|
|
767
|
+
className?: string;
|
|
768
|
+
/** 行内样式 */
|
|
769
|
+
style?: CSSProperties;
|
|
770
|
+
}
|
|
771
|
+
|
|
772
|
+
/**
|
|
773
|
+
* TimePicker 时间选择器
|
|
774
|
+
*
|
|
775
|
+
* 滚动列选择时间,支持 HH:mm 和 HH:mm:ss 两种模式。
|
|
776
|
+
* 触发器复用 DatePicker 样式,面板通过 Popover 弹出。
|
|
777
|
+
*/
|
|
778
|
+
declare const TimePicker: React$1.ForwardRefExoticComponent<TimePickerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
779
|
+
|
|
780
|
+
type RadioSize = LgSize;
|
|
781
|
+
interface RadioGroupProps {
|
|
782
|
+
/** 当前选中值(受控) */
|
|
783
|
+
value?: string;
|
|
784
|
+
/** 默认选中值(非受控) */
|
|
785
|
+
defaultValue?: string;
|
|
786
|
+
/** 选中值变更回调 */
|
|
787
|
+
onChange?: (value: string) => void;
|
|
788
|
+
/** 尺寸,默认 "md" */
|
|
789
|
+
size?: RadioSize;
|
|
790
|
+
/** 禁用整组 */
|
|
791
|
+
disabled?: boolean;
|
|
792
|
+
/** Radio 排列方向,默认 "vertical" */
|
|
793
|
+
orientation?: "horizontal" | "vertical";
|
|
794
|
+
/** 额外 className */
|
|
795
|
+
className?: string;
|
|
796
|
+
/** 组名(用于原生 form) */
|
|
797
|
+
name?: string;
|
|
798
|
+
/** 子元素 */
|
|
799
|
+
children?: React.ReactNode;
|
|
800
|
+
/** style */
|
|
801
|
+
style?: React.CSSProperties;
|
|
802
|
+
}
|
|
803
|
+
interface RadioItemProps {
|
|
804
|
+
/** 选项值 */
|
|
805
|
+
value: string;
|
|
806
|
+
/** 禁用当前项 */
|
|
807
|
+
disabled?: boolean;
|
|
808
|
+
/** 额外 className */
|
|
809
|
+
className?: string;
|
|
810
|
+
/** 子元素(label 内容) */
|
|
811
|
+
children?: React.ReactNode;
|
|
812
|
+
}
|
|
813
|
+
|
|
814
|
+
/**
|
|
815
|
+
* RadioGroup 单选组
|
|
816
|
+
* 基于 radix-ui/react-radio-group,支持受控/非受控、禁用、尺寸变体
|
|
817
|
+
*/
|
|
818
|
+
declare const RadioGroup: React$1.ForwardRefExoticComponent<RadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
819
|
+
/**
|
|
820
|
+
* RadioItem 单选项
|
|
821
|
+
* 必须作为 RadioGroup 的子组件使用
|
|
822
|
+
*/
|
|
823
|
+
declare const RadioItem: React$1.ForwardRefExoticComponent<RadioItemProps & React$1.RefAttributes<HTMLButtonElement>>;
|
|
824
|
+
|
|
825
|
+
type DividerVariant = "default" | "muted" | "emphasis";
|
|
826
|
+
type DividerOrientation = "horizontal" | "vertical";
|
|
827
|
+
interface DividerProps extends HTMLAttributes<HTMLDivElement> {
|
|
828
|
+
/** 分割线颜色变体,默认 "default" */
|
|
829
|
+
variant?: DividerVariant;
|
|
830
|
+
/** 分割线方向,默认 "horizontal" */
|
|
831
|
+
orientation?: DividerOrientation;
|
|
832
|
+
/** 外间距(上下或左右),单位 px */
|
|
833
|
+
spacing?: number;
|
|
834
|
+
}
|
|
835
|
+
|
|
836
|
+
/**
|
|
837
|
+
* Divider 分割线组件
|
|
838
|
+
* 用于分隔内容区块,支持水平/垂直方向和多种颜色变体
|
|
839
|
+
*/
|
|
840
|
+
declare const Divider: React$1.ForwardRefExoticComponent<DividerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
841
|
+
|
|
842
|
+
type CheckboxSize = LgSize;
|
|
843
|
+
interface CheckboxProps {
|
|
844
|
+
/** 选中状态(受控) */
|
|
845
|
+
checked?: boolean;
|
|
846
|
+
/** 默认选中状态(非受控) */
|
|
847
|
+
defaultChecked?: boolean;
|
|
848
|
+
/** 半选(不确定)状态 */
|
|
849
|
+
indeterminate?: boolean;
|
|
850
|
+
/** 选中变更回调 */
|
|
851
|
+
onChange?: (checked: boolean) => void;
|
|
852
|
+
/** 禁用 */
|
|
853
|
+
disabled?: boolean;
|
|
854
|
+
/** 尺寸,默认 "md" */
|
|
855
|
+
size?: CheckboxSize;
|
|
856
|
+
/** 额外 className */
|
|
857
|
+
className?: string;
|
|
858
|
+
/** 自定义行内样式 */
|
|
859
|
+
style?: CSSProperties;
|
|
860
|
+
/** 子元素(label 内容) */
|
|
861
|
+
children?: React.ReactNode;
|
|
862
|
+
/** 原生 name 属性 */
|
|
863
|
+
name?: string;
|
|
864
|
+
/** 原生 value 属性 */
|
|
865
|
+
value?: string;
|
|
866
|
+
}
|
|
867
|
+
interface CheckboxGroupProps {
|
|
868
|
+
/** 当前选中值数组(受控) */
|
|
869
|
+
value?: string[];
|
|
870
|
+
/** 默认选中值数组(非受控) */
|
|
871
|
+
defaultValue?: string[];
|
|
872
|
+
/** 选中值变更回调 */
|
|
873
|
+
onChange?: (value: string[]) => void;
|
|
874
|
+
/** 禁用整组 */
|
|
875
|
+
disabled?: boolean;
|
|
876
|
+
/** 尺寸,默认 "md" */
|
|
877
|
+
size?: CheckboxSize;
|
|
878
|
+
/** 排列方向,默认 "vertical" */
|
|
879
|
+
orientation?: "horizontal" | "vertical";
|
|
880
|
+
/** 额外 className */
|
|
881
|
+
className?: string;
|
|
882
|
+
/** 自定义行内样式 */
|
|
883
|
+
style?: CSSProperties;
|
|
884
|
+
/** 子元素 */
|
|
885
|
+
children?: React.ReactNode;
|
|
886
|
+
}
|
|
887
|
+
|
|
888
|
+
/**
|
|
889
|
+
* Checkbox 复选框组件
|
|
890
|
+
* 支持受控/非受控、半选态、禁用、尺寸变体,可独立使用或配合 CheckboxGroup
|
|
891
|
+
*/
|
|
892
|
+
declare const Checkbox: React$1.ForwardRefExoticComponent<CheckboxProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
893
|
+
/**
|
|
894
|
+
* CheckboxGroup 复选框组
|
|
895
|
+
* 管理多个 Checkbox 的选中状态
|
|
896
|
+
*/
|
|
897
|
+
declare const CheckboxGroup: React$1.ForwardRefExoticComponent<CheckboxGroupProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
898
|
+
|
|
899
|
+
/**
|
|
900
|
+
* 分页视觉变体
|
|
901
|
+
* - simple: 简单模式,仅「上一页 当前页/总页数 下一页」
|
|
902
|
+
* - bordered: 有框(默认),选中页码带边框 + 阴影
|
|
903
|
+
* - borderless: 无框,选中页码用品牌色文字
|
|
904
|
+
*/
|
|
905
|
+
type PaginationVariant = "simple" | "bordered" | "borderless";
|
|
906
|
+
interface PaginationProps {
|
|
907
|
+
/** 对齐方式,默认 "end" */
|
|
908
|
+
align?: "start" | "center" | "end";
|
|
909
|
+
/** 当前页(受控) */
|
|
910
|
+
current?: number;
|
|
911
|
+
/** 默认当前页(非受控),默认 1 */
|
|
912
|
+
defaultCurrent?: number;
|
|
913
|
+
/** 每页条数(受控) */
|
|
914
|
+
pageSize?: number;
|
|
915
|
+
/** 默认每页条数(非受控),默认 20 */
|
|
916
|
+
defaultPageSize?: number;
|
|
917
|
+
/** 数据总数 */
|
|
918
|
+
total: number;
|
|
919
|
+
/** 禁用 */
|
|
920
|
+
disabled?: boolean;
|
|
921
|
+
/** 只有一页时隐藏,默认 false */
|
|
922
|
+
hideOnSinglePage?: boolean;
|
|
923
|
+
/** 每页条数选项,默认 [10, 20, 50, 100] */
|
|
924
|
+
pageSizeOptions?: number[];
|
|
925
|
+
/** 是否显示快速跳转,默认 false */
|
|
926
|
+
showQuickJumper?: boolean;
|
|
927
|
+
/** 是否显示 pageSize 切换器,默认 false */
|
|
928
|
+
showSizeChanger?: boolean;
|
|
929
|
+
/** 是否显示总数,或自定义渲染 */
|
|
930
|
+
showTotal?: boolean | ((total: number, range: [number, number]) => ReactNode);
|
|
931
|
+
/** 视觉变体,默认 "bordered" */
|
|
932
|
+
variant?: PaginationVariant;
|
|
933
|
+
/** 页码或 pageSize 变化回调 */
|
|
934
|
+
onChange?: (page: number, pageSize: number) => void;
|
|
935
|
+
/** pageSize 变化回调 */
|
|
936
|
+
onPageSizeChange?: (current: number, size: number) => void;
|
|
937
|
+
/** 额外 className */
|
|
938
|
+
className?: string;
|
|
939
|
+
/** 自定义行内样式 */
|
|
940
|
+
style?: CSSProperties;
|
|
941
|
+
}
|
|
942
|
+
|
|
943
|
+
/**
|
|
944
|
+
* Pagination 分页组件
|
|
945
|
+
* 参考 antd API 设计,通过 variant 区分三种视觉:simple(简单)、bordered(有框)、borderless(无框)
|
|
946
|
+
*/
|
|
947
|
+
declare const Pagination: React$1.ForwardRefExoticComponent<PaginationProps & React$1.RefAttributes<HTMLElement>>;
|
|
948
|
+
|
|
949
|
+
type SpinSize = LgSize;
|
|
950
|
+
interface SpinProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
|
|
951
|
+
/** 加载指示器尺寸 */
|
|
952
|
+
size?: SpinSize;
|
|
953
|
+
/** 是否旋转中,为 false 时暂停动画 */
|
|
954
|
+
spinning?: boolean;
|
|
955
|
+
/** 自定义类名 */
|
|
956
|
+
className?: string;
|
|
957
|
+
/** 自定义行内样式 */
|
|
958
|
+
style?: CSSProperties;
|
|
959
|
+
/** 包裹内容,存在时作为容器模式使用 */
|
|
960
|
+
children?: ReactNode;
|
|
961
|
+
/** 容器模式下的加载提示文本 */
|
|
962
|
+
tip?: string;
|
|
963
|
+
}
|
|
964
|
+
|
|
965
|
+
/**
|
|
966
|
+
* Spin 加载指示器组件
|
|
967
|
+
* 支持独立使用或作为容器包裹内容,加载时显示遮罩与旋转指示器
|
|
968
|
+
*/
|
|
969
|
+
declare const Spin: React$1.ForwardRefExoticComponent<SpinProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
970
|
+
|
|
971
|
+
/** 空状态尺寸(复用组件库统一尺寸 LgSize) */
|
|
972
|
+
type EmptySize = LgSize;
|
|
973
|
+
/** lingee-icon 组件类型 */
|
|
974
|
+
type EmptyIconComponent = ComponentType<SvgIconProps>;
|
|
975
|
+
interface EmptyProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
|
|
976
|
+
/**
|
|
977
|
+
* 尺寸,默认 "md"
|
|
978
|
+
* - lg: 页面级缺省,图标 56px + 文字 16px,垂直居中
|
|
979
|
+
* - md: 局部缺省,图标 24px + 文字 14px,垂直居中
|
|
980
|
+
* - sm: mini 缺省,图标 16px + 文字 12px,水平结构,无 padding
|
|
981
|
+
*/
|
|
982
|
+
size?: EmptySize;
|
|
983
|
+
/**
|
|
984
|
+
* 图标:
|
|
985
|
+
* - 传 lingee-icon 组件(如 Search)→ 自动注入 size
|
|
986
|
+
* - 传 ReactNode → 完全自定义(加载中旋转等行为随图标一起传入自行处理)
|
|
987
|
+
* - 不传 → 使用默认图标
|
|
988
|
+
*/
|
|
989
|
+
icon?: EmptyIconComponent | ReactNode;
|
|
990
|
+
/** 描述文字 */
|
|
991
|
+
description: ReactNode;
|
|
992
|
+
/** 自定义类名 */
|
|
993
|
+
className?: string;
|
|
994
|
+
/** 自定义内联样式 */
|
|
995
|
+
style?: CSSProperties;
|
|
996
|
+
}
|
|
997
|
+
|
|
998
|
+
/**
|
|
999
|
+
* Empty 空状态组件
|
|
1000
|
+
* 支持 lg / md / sm 三种尺寸,覆盖搜索无结果、加载中、加载失败等场景
|
|
1001
|
+
*
|
|
1002
|
+
* icon 支持三种传法:
|
|
1003
|
+
* 1. 传 lingee-icon 组件(如 Search)→ 自动注入 size + fill 渐变
|
|
1004
|
+
* 2. 传 ReactNode → 完全自定义渲染(加载中旋转等行为随图标一起传入自行处理)
|
|
1005
|
+
* 3. 不传 → 使用默认图标(带渐变)
|
|
1006
|
+
*/
|
|
1007
|
+
declare const Empty: React$1.ForwardRefExoticComponent<EmptyProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1008
|
+
|
|
1009
|
+
/** 主轴方向类型 */
|
|
1010
|
+
type FlexOrientation = "horizontal" | "vertical";
|
|
1011
|
+
/** gap 预设尺寸 */
|
|
1012
|
+
type FlexGapSize = "small" | "medium" | "large";
|
|
1013
|
+
interface FlexProps extends HTMLAttributes<HTMLElement> {
|
|
1014
|
+
/** flex 主轴的方向是否垂直(等价 flex-direction: column),默认 false */
|
|
1015
|
+
vertical?: boolean;
|
|
1016
|
+
/** 主轴方向类型,默认 "horizontal";与 vertical 同时存在时以 vertical 优先 */
|
|
1017
|
+
orientation?: FlexOrientation;
|
|
1018
|
+
/** 设置元素单行显示还是多行显示,默认 nowrap */
|
|
1019
|
+
wrap?: CSSProperties["flexWrap"] | boolean;
|
|
1020
|
+
/** 设置元素在主轴方向上的对齐方式 */
|
|
1021
|
+
justify?: CSSProperties["justifyContent"];
|
|
1022
|
+
/** 设置元素在交叉轴方向上的对齐方式 */
|
|
1023
|
+
align?: CSSProperties["alignItems"];
|
|
1024
|
+
/** flex CSS 简写属性 */
|
|
1025
|
+
flex?: CSSProperties["flex"];
|
|
1026
|
+
/** 设置网格之间的间隙,支持预设尺寸或自定义数值/字符串 */
|
|
1027
|
+
gap?: FlexGapSize | string | number;
|
|
1028
|
+
/** 自定义元素类型,默认 "div" */
|
|
1029
|
+
component?: React.ElementType;
|
|
1030
|
+
}
|
|
1031
|
+
|
|
1032
|
+
/**
|
|
1033
|
+
* Flex 弹性布局组件
|
|
1034
|
+
* 默认水平方向、主轴起点对齐;可通过属性调整方向、对齐、换行与间隙
|
|
1035
|
+
*/
|
|
1036
|
+
declare const Flex: React$1.ForwardRefExoticComponent<FlexProps & React$1.RefAttributes<HTMLElement>>;
|
|
1037
|
+
|
|
1038
|
+
/** Alert 类型 */
|
|
1039
|
+
type AlertType = "info" | "success" | "warning" | "error" | "default";
|
|
1040
|
+
interface AlertProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
|
|
1041
|
+
/** 提示类型,默认 "info" */
|
|
1042
|
+
type?: AlertType;
|
|
1043
|
+
/** 标题内容 */
|
|
1044
|
+
title?: ReactNode;
|
|
1045
|
+
/** 描述/正文内容(与 children 互斥,优先使用 children) */
|
|
1046
|
+
description?: ReactNode;
|
|
1047
|
+
/** 多行列表描述(传入数组时渲染带圆点的列表) */
|
|
1048
|
+
items?: ReactNode[];
|
|
1049
|
+
/** 是否显示关闭按钮,默认 true */
|
|
1050
|
+
closable?: boolean;
|
|
1051
|
+
/** 关闭回调 */
|
|
1052
|
+
onClose?: (e: MouseEvent<HTMLButtonElement>) => void;
|
|
1053
|
+
/** 前缀图标,false 隐藏图标;传入 ReactNode 自定义图标 */
|
|
1054
|
+
icon?: ReactNode | false;
|
|
1055
|
+
/** 操作区(右侧按钮/链接) */
|
|
1056
|
+
action?: ReactNode;
|
|
1057
|
+
/** 子内容(替代 description 使用) */
|
|
1058
|
+
children?: ReactNode;
|
|
1059
|
+
}
|
|
1060
|
+
|
|
1061
|
+
/**
|
|
1062
|
+
* Alert 消息提示组件
|
|
1063
|
+
* 用于页面中展示重要的提示信息,支持多种类型和布局变体
|
|
1064
|
+
*/
|
|
1065
|
+
declare const Alert: React$1.ForwardRefExoticComponent<AlertProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1066
|
+
|
|
1067
|
+
/** 骨架屏形状预设 */
|
|
1068
|
+
type SkeletonVariant = "text" | "circle" | "rect";
|
|
1069
|
+
/** 动画类型 */
|
|
1070
|
+
type SkeletonAnimation = "shimmer" | "pulse" | false;
|
|
1071
|
+
interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
|
|
1072
|
+
/** 形状预设,默认 "text"(条形) */
|
|
1073
|
+
variant?: SkeletonVariant;
|
|
1074
|
+
/** 动画类型,默认 "shimmer"(扫光);"pulse" 为呼吸闪烁;false 关闭动画 */
|
|
1075
|
+
animation?: SkeletonAnimation;
|
|
1076
|
+
/** 宽度,支持数字(px)或字符串(百分比等) */
|
|
1077
|
+
width?: number | string;
|
|
1078
|
+
/** 高度,支持数字(px)或字符串;text 默认 15px,rect 默认 40px */
|
|
1079
|
+
height?: number | string;
|
|
1080
|
+
/** 圆角,覆盖 variant 的默认圆角 */
|
|
1081
|
+
borderRadius?: number | string;
|
|
1082
|
+
/** circle/rect 的快捷尺寸(同时设置宽高) */
|
|
1083
|
+
size?: number | string;
|
|
1084
|
+
}
|
|
1085
|
+
|
|
1086
|
+
/**
|
|
1087
|
+
* Skeleton 骨架屏组件
|
|
1088
|
+
* 在数据加载完成前,通过占位图形展示简单的页面布局。
|
|
1089
|
+
* 支持条形(text)、圆形(circle)、方形(rect)三种预设形状,以及 shimmer/pulse 两种动画。
|
|
1090
|
+
*/
|
|
1091
|
+
declare const Skeleton: React$1.ForwardRefExoticComponent<SkeletonProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1092
|
+
|
|
1093
|
+
/** 面包屑尺寸:md=常规(16px/斜杠分隔),sm=小型(13px/尖括号分隔) */
|
|
1094
|
+
type BreadcrumbSize = "sm" | "md";
|
|
1095
|
+
/** 单个路径项 */
|
|
1096
|
+
interface BreadcrumbItem {
|
|
1097
|
+
/** 唯一标识(用于 React key,缺省时回退到下标) */
|
|
1098
|
+
key?: string | number;
|
|
1099
|
+
/** 文字内容 */
|
|
1100
|
+
label?: ReactNode;
|
|
1101
|
+
/** 链接地址,存在时渲染为 <a> */
|
|
1102
|
+
href?: string;
|
|
1103
|
+
/** 点击回调(非当前页时可点击;折叠进下拉时同样触发) */
|
|
1104
|
+
onClick?: (event?: MouseEvent<HTMLElement>) => void;
|
|
1105
|
+
/** 前置图标(如根节点的 House 图标);须传入 lingee-icon 组件 */
|
|
1106
|
+
icon?: ReactNode;
|
|
1107
|
+
/** 是否禁用(不可点击、置灰) */
|
|
1108
|
+
disabled?: boolean;
|
|
1109
|
+
}
|
|
1110
|
+
interface BreadcrumbProps extends Omit<HTMLAttributes<HTMLElement>, "onClick"> {
|
|
1111
|
+
/** 路径项列表 */
|
|
1112
|
+
items: BreadcrumbItem[];
|
|
1113
|
+
/** 尺寸,默认 "md"(常规)。md=16px+斜杠,sm=13px+尖括号 */
|
|
1114
|
+
size?: BreadcrumbSize;
|
|
1115
|
+
/** 自定义分隔符,默认按 size:md→"/"(SlashLg),sm→">"(ChevronRight) */
|
|
1116
|
+
separator?: ReactNode;
|
|
1117
|
+
/** 超过该数量时折叠中间项为 "…" 下拉;0 表示不折叠(默认 0) */
|
|
1118
|
+
maxItems?: number;
|
|
1119
|
+
/** 折叠时保留的头部项数,默认 1 */
|
|
1120
|
+
itemsBeforeCollapse?: number;
|
|
1121
|
+
/** 折叠时保留的尾部项数,默认 1 */
|
|
1122
|
+
itemsAfterCollapse?: number;
|
|
1123
|
+
/** 返回操作;传入后在最前面渲染返回箭头(页面级面包屑用) */
|
|
1124
|
+
onBack?: (event?: MouseEvent<HTMLElement>) => void;
|
|
1125
|
+
/** 单个链接项最大宽度(px),超出显示省略号;不传则不限制 */
|
|
1126
|
+
itemMaxWidth?: number;
|
|
1127
|
+
}
|
|
1128
|
+
|
|
1129
|
+
/**
|
|
1130
|
+
* Breadcrumb 面包屑组件
|
|
1131
|
+
* 展示当前页面在系统层级中的位置,支持常规/小型两种尺寸、
|
|
1132
|
+
* 前置返回/首页图标、中间层级折叠下拉、超长省略等
|
|
1133
|
+
*/
|
|
1134
|
+
declare const Breadcrumb: React$1.ForwardRefExoticComponent<BreadcrumbProps & React$1.RefAttributes<HTMLElement>>;
|
|
1135
|
+
|
|
1136
|
+
/**
|
|
1137
|
+
* 表格尺寸变体
|
|
1138
|
+
* - default: 单行模式,行高 52px
|
|
1139
|
+
* - large: 多行模式,行高 64px
|
|
1140
|
+
*/
|
|
1141
|
+
type TableSize = "default" | "large";
|
|
1142
|
+
/**
|
|
1143
|
+
* 列定义
|
|
1144
|
+
*/
|
|
1145
|
+
interface TableColumnType<RecordType = any> {
|
|
1146
|
+
/** 列唯一标识 */
|
|
1147
|
+
key?: Key;
|
|
1148
|
+
/** 列标题 */
|
|
1149
|
+
title?: ReactNode;
|
|
1150
|
+
/** 数据字段名 */
|
|
1151
|
+
dataIndex?: string | string[];
|
|
1152
|
+
/** 列宽 */
|
|
1153
|
+
width?: number | string;
|
|
1154
|
+
/** 最小列宽 */
|
|
1155
|
+
minWidth?: number;
|
|
1156
|
+
/** 列对齐方式 */
|
|
1157
|
+
align?: "left" | "center" | "right";
|
|
1158
|
+
/** 固定列 */
|
|
1159
|
+
fixed?: "left" | "right" | boolean;
|
|
1160
|
+
/** 自定义渲染 */
|
|
1161
|
+
render?: (value: any, record: RecordType, index: number) => ReactNode;
|
|
1162
|
+
/** 单元格省略 */
|
|
1163
|
+
ellipsis?: boolean;
|
|
1164
|
+
/** 表头帮助提示 */
|
|
1165
|
+
tooltip?: string;
|
|
1166
|
+
/** 是否可排序 */
|
|
1167
|
+
sorter?: boolean | ((a: RecordType, b: RecordType) => number);
|
|
1168
|
+
/** 排序方向 */
|
|
1169
|
+
sortOrder?: "ascend" | "descend" | null;
|
|
1170
|
+
/** 自定义表头单元格属性 */
|
|
1171
|
+
onHeaderCell?: (column: TableColumnType<RecordType>) => Record<string, any>;
|
|
1172
|
+
/** 自定义单元格属性 */
|
|
1173
|
+
onCell?: (record: RecordType, index: number) => Record<string, any>;
|
|
1174
|
+
/** 子列(表头分组) */
|
|
1175
|
+
children?: TableColumnType<RecordType>[];
|
|
1176
|
+
/** 额外 className */
|
|
1177
|
+
className?: string;
|
|
1178
|
+
}
|
|
1179
|
+
/**
|
|
1180
|
+
* 行选择配置
|
|
1181
|
+
*/
|
|
1182
|
+
interface TableRowSelection<RecordType = any> {
|
|
1183
|
+
/** 选中的行 key 列表(受控) */
|
|
1184
|
+
selectedRowKeys?: Key[];
|
|
1185
|
+
/** 选中变化回调 */
|
|
1186
|
+
onChange?: (selectedRowKeys: Key[], selectedRows: RecordType[]) => void;
|
|
1187
|
+
/** 行是否可选 */
|
|
1188
|
+
getCheckboxProps?: (record: RecordType) => {
|
|
1189
|
+
disabled?: boolean;
|
|
1190
|
+
};
|
|
1191
|
+
/** 选择类型 */
|
|
1192
|
+
type?: "checkbox" | "radio";
|
|
1193
|
+
}
|
|
1194
|
+
/**
|
|
1195
|
+
* 排序信息
|
|
1196
|
+
*/
|
|
1197
|
+
interface TableSorterState {
|
|
1198
|
+
columnKey: Key;
|
|
1199
|
+
order: "ascend" | "descend" | null;
|
|
1200
|
+
}
|
|
1201
|
+
/**
|
|
1202
|
+
* Table 组件 Props
|
|
1203
|
+
*/
|
|
1204
|
+
interface TableProps<RecordType = any> {
|
|
1205
|
+
/** 列定义 */
|
|
1206
|
+
columns?: TableColumnType<RecordType>[];
|
|
1207
|
+
/** 数据源 */
|
|
1208
|
+
dataSource?: RecordType[];
|
|
1209
|
+
/** 行 key 取值字段或函数 */
|
|
1210
|
+
rowKey?: string | ((record: RecordType, index: number) => Key);
|
|
1211
|
+
/** 尺寸变体 */
|
|
1212
|
+
size?: TableSize;
|
|
1213
|
+
/** 是否显示边框 */
|
|
1214
|
+
bordered?: boolean;
|
|
1215
|
+
/** 加载状态 */
|
|
1216
|
+
loading?: boolean;
|
|
1217
|
+
/** 横向滚动宽度 */
|
|
1218
|
+
scroll?: {
|
|
1219
|
+
x?: number | string;
|
|
1220
|
+
y?: number | string;
|
|
1221
|
+
};
|
|
1222
|
+
/** 行选择配置 */
|
|
1223
|
+
rowSelection?: TableRowSelection<RecordType>;
|
|
1224
|
+
/** 排序变化回调 */
|
|
1225
|
+
onSortChange?: (sorter: TableSorterState) => void;
|
|
1226
|
+
/** 行点击 */
|
|
1227
|
+
onRow?: (record: RecordType, index: number) => Record<string, any>;
|
|
1228
|
+
/** 空数据展示 */
|
|
1229
|
+
empty?: ReactNode;
|
|
1230
|
+
/** 表格标题 */
|
|
1231
|
+
title?: ReactNode | (() => ReactNode);
|
|
1232
|
+
/** 表格底部 */
|
|
1233
|
+
footer?: ReactNode | (() => ReactNode);
|
|
1234
|
+
/** 是否显示表头 */
|
|
1235
|
+
showHeader?: boolean;
|
|
1236
|
+
/** 额外 className */
|
|
1237
|
+
className?: string;
|
|
1238
|
+
/** 自定义行内样式 */
|
|
1239
|
+
style?: CSSProperties;
|
|
1240
|
+
/** 斑马纹 */
|
|
1241
|
+
striped?: boolean;
|
|
1242
|
+
/** 行 hover 高亮 */
|
|
1243
|
+
hoverable?: boolean;
|
|
1244
|
+
}
|
|
1245
|
+
|
|
1246
|
+
declare const Table: <RecordType = any>(props: TableProps<RecordType> & {
|
|
1247
|
+
ref?: React$1.Ref<HTMLDivElement>;
|
|
1248
|
+
}) => React$1.ReactElement | null;
|
|
1249
|
+
|
|
1250
|
+
/** 预览变换状态 */
|
|
1251
|
+
type TransformType = {
|
|
1252
|
+
x: number;
|
|
1253
|
+
y: number;
|
|
1254
|
+
rotate: number;
|
|
1255
|
+
scale: number;
|
|
1256
|
+
flipX: boolean;
|
|
1257
|
+
flipY: boolean;
|
|
1258
|
+
};
|
|
1259
|
+
/** 预览变换动作 */
|
|
1260
|
+
type TransformAction = "flipY" | "flipX" | "rotateLeft" | "rotateRight" | "zoomIn" | "zoomOut" | "close" | "prev" | "next" | "wheel" | "doubleClick" | "move" | "dragRebound" | "touchZoom" | "reset";
|
|
1261
|
+
/** 预览图信息 */
|
|
1262
|
+
interface ImgInfo {
|
|
1263
|
+
url: string;
|
|
1264
|
+
alt: string;
|
|
1265
|
+
width: string | number;
|
|
1266
|
+
height: string | number;
|
|
1267
|
+
}
|
|
1268
|
+
/** cover 配置(图片上的 hover 蒙层) */
|
|
1269
|
+
interface CoverConfig {
|
|
1270
|
+
/** 自定义蒙层内容 */
|
|
1271
|
+
coverNode?: React$1.ReactNode;
|
|
1272
|
+
/** 蒙层位置 */
|
|
1273
|
+
placement?: "top" | "bottom" | "center";
|
|
1274
|
+
}
|
|
1275
|
+
/** 预览配置 */
|
|
1276
|
+
interface PreviewType {
|
|
1277
|
+
/** 预览图片地址(默认使用 Image src) */
|
|
1278
|
+
src?: string;
|
|
1279
|
+
/** 是否打开预览(受控) */
|
|
1280
|
+
open?: boolean;
|
|
1281
|
+
/** 打开/关闭回调 */
|
|
1282
|
+
onOpenChange?: (open: boolean) => void;
|
|
1283
|
+
/** 图片上的 hover 蒙层;false 禁用,ReactNode 自定义内容,CoverConfig 对象配置 */
|
|
1284
|
+
cover?: false | React$1.ReactNode | CoverConfig;
|
|
1285
|
+
/** 自定义预览内容 */
|
|
1286
|
+
imageRender?: (originalNode: React$1.ReactElement, info: {
|
|
1287
|
+
transform: TransformType;
|
|
1288
|
+
image: ImgInfo;
|
|
1289
|
+
}) => React$1.ReactNode;
|
|
1290
|
+
/** 自定义工具栏渲染 */
|
|
1291
|
+
actionsRender?: (originalNode: React$1.ReactElement, info: {
|
|
1292
|
+
transform: TransformType;
|
|
1293
|
+
actions: Record<string, () => void>;
|
|
1294
|
+
}) => React$1.ReactNode;
|
|
1295
|
+
/** 最小缩放 */
|
|
1296
|
+
minScale?: number;
|
|
1297
|
+
/** 最大缩放 */
|
|
1298
|
+
maxScale?: number;
|
|
1299
|
+
/** 缩放步长(1 + scaleStep 为每步倍数) */
|
|
1300
|
+
scaleStep?: number;
|
|
1301
|
+
/** 是否可拖拽 */
|
|
1302
|
+
movable?: boolean;
|
|
1303
|
+
/** 预览挂载容器 */
|
|
1304
|
+
getContainer?: string | HTMLElement | (() => HTMLElement) | false;
|
|
1305
|
+
/** 预览层 z-index */
|
|
1306
|
+
zIndex?: number;
|
|
1307
|
+
/** 变换回调 */
|
|
1308
|
+
onTransform?: (info: {
|
|
1309
|
+
transform: TransformType;
|
|
1310
|
+
action: TransformAction;
|
|
1311
|
+
}) => void;
|
|
1312
|
+
/** 自定义关闭图标 */
|
|
1313
|
+
closeIcon?: React$1.ReactNode;
|
|
1314
|
+
}
|
|
1315
|
+
/** Image 组件 Props — 对齐 antd 6 Image API */
|
|
1316
|
+
interface ImageProps extends Omit<React$1.ImgHTMLAttributes<HTMLImageElement>, "placeholder" | "onClick" | "onKeyDown"> {
|
|
1317
|
+
/** 图片地址 */
|
|
1318
|
+
src?: string;
|
|
1319
|
+
/** 加载失败容错地址 */
|
|
1320
|
+
fallback?: string;
|
|
1321
|
+
/**
|
|
1322
|
+
* 加载占位:
|
|
1323
|
+
* - true:默认灰底占位
|
|
1324
|
+
* - ReactNode:自定义占位内容
|
|
1325
|
+
* - { progress: true }:圆形不确定进度(旋转动画)
|
|
1326
|
+
* - { progress: { percent: number } }:圆形确定进度
|
|
1327
|
+
*/
|
|
1328
|
+
placeholder?: boolean | React$1.ReactNode | {
|
|
1329
|
+
progress: true | {
|
|
1330
|
+
percent: number;
|
|
1331
|
+
};
|
|
1332
|
+
};
|
|
1333
|
+
/** 预览配置(false 禁用,true 启用默认,对象自定义) */
|
|
1334
|
+
preview?: boolean | PreviewType;
|
|
1335
|
+
/** 自定义根类名 */
|
|
1336
|
+
className?: string;
|
|
1337
|
+
/** 自定义根样式 */
|
|
1338
|
+
style?: React$1.CSSProperties;
|
|
1339
|
+
/** 点击回调 */
|
|
1340
|
+
onClick?: (e: React$1.MouseEvent<HTMLDivElement>) => void;
|
|
1341
|
+
/** 加载失败回调 */
|
|
1342
|
+
onError?: (e: React$1.SyntheticEvent<HTMLImageElement, Event>) => void;
|
|
1343
|
+
}
|
|
1344
|
+
/** PreviewGroup 预览配置 */
|
|
1345
|
+
interface PreviewGroupType extends Omit<PreviewType, "cover"> {
|
|
1346
|
+
/** 当前预览索引 */
|
|
1347
|
+
current?: number;
|
|
1348
|
+
/** 切换回调 */
|
|
1349
|
+
onChange?: (current: number, prevCurrent: number) => void;
|
|
1350
|
+
/** 计数自定义渲染 */
|
|
1351
|
+
countRender?: (current: number, total: number) => React$1.ReactNode;
|
|
1352
|
+
}
|
|
1353
|
+
/** Image.PreviewGroup Props */
|
|
1354
|
+
interface ImagePreviewGroupProps {
|
|
1355
|
+
/** 预览图片列表 */
|
|
1356
|
+
items?: (string | {
|
|
1357
|
+
src: string;
|
|
1358
|
+
alt?: string;
|
|
1359
|
+
})[];
|
|
1360
|
+
/** 预览配置 */
|
|
1361
|
+
preview?: boolean | PreviewGroupType;
|
|
1362
|
+
/** 子元素 */
|
|
1363
|
+
children?: React$1.ReactNode;
|
|
1364
|
+
}
|
|
1365
|
+
|
|
1366
|
+
/**
|
|
1367
|
+
* Image 图片组件 — 基于 @rc-component/image 封装
|
|
1368
|
+
*
|
|
1369
|
+
* API 对齐 antd 6 Image:
|
|
1370
|
+
* - 默认不显示图片上的 hover 蒙层(cover: false)
|
|
1371
|
+
* - 加载失败时显示默认图像占位图标(可通过 fallback 指定替代 URL)
|
|
1372
|
+
* - 支持 preview.src 设置不同的预览图
|
|
1373
|
+
* - 支持 placeholder 渐进加载(模糊图/自定义节点)
|
|
1374
|
+
*
|
|
1375
|
+
* 工具栏图标使用 lingee-icon,样式使用 lg-image 前缀。
|
|
1376
|
+
*/
|
|
1377
|
+
|
|
1378
|
+
/** 多图预览分组 */
|
|
1379
|
+
declare const PreviewGroup: React$1.FC<ImagePreviewGroupProps>;
|
|
1380
|
+
/** Image 图片组件 */
|
|
1381
|
+
declare const Image: React$1.FC<ImageProps> & {
|
|
1382
|
+
PreviewGroup: typeof PreviewGroup;
|
|
1383
|
+
};
|
|
1384
|
+
|
|
1385
|
+
type ColorPickerSize = LgSize;
|
|
1386
|
+
interface ColorPickerProps {
|
|
1387
|
+
/** 当前颜色值(受控),支持 hex 字符串如 "#ff0000" */
|
|
1388
|
+
value?: string;
|
|
1389
|
+
/** 默认颜色值(非受控) */
|
|
1390
|
+
defaultValue?: string;
|
|
1391
|
+
/** 颜色变化回调 */
|
|
1392
|
+
onChange?: (color: string) => void;
|
|
1393
|
+
/** 拖拽结束回调 */
|
|
1394
|
+
onChangeComplete?: (color: string) => void;
|
|
1395
|
+
/** 输入框尺寸,默认 "md" */
|
|
1396
|
+
size?: ColorPickerSize;
|
|
1397
|
+
/** 是否禁用 */
|
|
1398
|
+
disabled?: boolean;
|
|
1399
|
+
/** 是否隐藏透明度滑块 */
|
|
1400
|
+
disabledAlpha?: boolean;
|
|
1401
|
+
/** 占位文本 */
|
|
1402
|
+
placeholder?: string;
|
|
1403
|
+
/** 错误状态 */
|
|
1404
|
+
error?: boolean;
|
|
1405
|
+
/** 自定义类名 */
|
|
1406
|
+
className?: string;
|
|
1407
|
+
/** 自定义样式 */
|
|
1408
|
+
style?: React.CSSProperties;
|
|
1409
|
+
/** 弹出面板额外内容(如预设色板) */
|
|
1410
|
+
panelExtra?: ReactNode;
|
|
1411
|
+
/** Popover 弹出方向 */
|
|
1412
|
+
placement?: "top" | "bottom" | "left" | "right";
|
|
1413
|
+
}
|
|
1414
|
+
|
|
1415
|
+
/**
|
|
1416
|
+
* ColorPicker 颜色选择器
|
|
1417
|
+
* 触发器参考 Input 组件外观,内容展示颜色值,右侧显示色块预览
|
|
1418
|
+
* 面板使用 @rc-component/color-picker 提供完整的颜色选取交互
|
|
1419
|
+
*/
|
|
1420
|
+
declare const ColorPicker: React$1.ForwardRefExoticComponent<ColorPickerProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1421
|
+
|
|
1422
|
+
type ProgressStatus = "normal" | "success" | "error" | "active";
|
|
1423
|
+
type ProgressType = "line" | "circle";
|
|
1424
|
+
interface ProgressProps {
|
|
1425
|
+
/** 进度类型 */
|
|
1426
|
+
type?: ProgressType;
|
|
1427
|
+
/** 百分比 0-100;不传或 -1 表示不确定进度(旋转动画) */
|
|
1428
|
+
percent?: number;
|
|
1429
|
+
/** 状态 */
|
|
1430
|
+
status?: ProgressStatus;
|
|
1431
|
+
/** 尺寸:line 为高度(px),circle 为直径(px) */
|
|
1432
|
+
size?: number;
|
|
1433
|
+
/** 进度条/弧颜色 */
|
|
1434
|
+
strokeColor?: string;
|
|
1435
|
+
/** 轨道颜色 */
|
|
1436
|
+
trailColor?: string;
|
|
1437
|
+
/** 线条宽度(circle 模式下为环宽度,line 模式为条高度) */
|
|
1438
|
+
strokeWidth?: number;
|
|
1439
|
+
/** 是否显示百分比文字/状态图标 */
|
|
1440
|
+
showInfo?: boolean;
|
|
1441
|
+
/** 自定义格式化显示内容 */
|
|
1442
|
+
format?: (percent: number) => React$1.ReactNode;
|
|
1443
|
+
/** 自定义根类名 */
|
|
1444
|
+
className?: string;
|
|
1445
|
+
/** 自定义根样式 */
|
|
1446
|
+
style?: React$1.CSSProperties;
|
|
1447
|
+
}
|
|
1448
|
+
|
|
1449
|
+
/**
|
|
1450
|
+
* Progress 进度条组件
|
|
1451
|
+
*
|
|
1452
|
+
* 支持线性(line)和圆形(circle)两种模式。
|
|
1453
|
+
* percent 不传或为 -1 时为不确定进度(旋转/滑动动画)。
|
|
1454
|
+
*/
|
|
1455
|
+
|
|
1456
|
+
declare const Progress: React$1.FC<ProgressProps>;
|
|
1457
|
+
|
|
1458
|
+
type DrawerPlacement = "left" | "right" | "top" | "bottom";
|
|
1459
|
+
interface DrawerProps {
|
|
1460
|
+
/** 是否打开 */
|
|
1461
|
+
open: boolean;
|
|
1462
|
+
/** 状态变化回调(关闭时 nextOpen=false) */
|
|
1463
|
+
onOpenChange: (open: boolean) => void;
|
|
1464
|
+
/** 抽屉滑出方向,默认 right */
|
|
1465
|
+
placement?: DrawerPlacement;
|
|
1466
|
+
/** 抽屉宽度(left/right 方向时生效),默认 380 */
|
|
1467
|
+
size?: number | string;
|
|
1468
|
+
/** 标题(支持 ReactNode) */
|
|
1469
|
+
title?: ReactNode;
|
|
1470
|
+
/** 标题栏右侧额外内容 */
|
|
1471
|
+
extra?: ReactNode;
|
|
1472
|
+
/** 是否显示关闭按钮,默认 true */
|
|
1473
|
+
closable?: boolean;
|
|
1474
|
+
/** 底部操作区,传 ReactNode 完全自定义;传 null 隐藏 */
|
|
1475
|
+
footer?: ReactNode;
|
|
1476
|
+
/** 是否为模态(true 时点击遮罩不关闭),默认 false */
|
|
1477
|
+
modal?: boolean;
|
|
1478
|
+
/** 是否显示遮罩层,默认 true */
|
|
1479
|
+
mask?: boolean;
|
|
1480
|
+
/** 关闭后是否销毁子节点,默认 true */
|
|
1481
|
+
destroyOnHidden?: boolean;
|
|
1482
|
+
/** 自定义 z-index */
|
|
1483
|
+
zIndex?: number;
|
|
1484
|
+
/** 自定义类名 */
|
|
1485
|
+
className?: string;
|
|
1486
|
+
/** 自定义样式 */
|
|
1487
|
+
style?: CSSProperties;
|
|
1488
|
+
/** 抽屉内容 */
|
|
1489
|
+
children?: ReactNode;
|
|
1490
|
+
}
|
|
1491
|
+
|
|
1492
|
+
/**
|
|
1493
|
+
* Drawer 抽屉组件
|
|
1494
|
+
* 基于 @radix-ui/react-dialog,从屏幕边缘滑入的面板
|
|
1495
|
+
*/
|
|
1496
|
+
declare const Drawer: React$1.FC<DrawerProps>;
|
|
1497
|
+
|
|
1498
|
+
type SliderSize = "sm" | "md" | "lg";
|
|
1499
|
+
interface SliderProps {
|
|
1500
|
+
/** 受控值(单值传 [50],range 传 [20, 80]) */
|
|
1501
|
+
value?: number[];
|
|
1502
|
+
/** 非受控默认值 */
|
|
1503
|
+
defaultValue?: number[];
|
|
1504
|
+
/** 值变化回调 */
|
|
1505
|
+
onChange?: (value: number[]) => void;
|
|
1506
|
+
/** 拖拽结束时回调 */
|
|
1507
|
+
onValueCommit?: (value: number[]) => void;
|
|
1508
|
+
/** 最小值,默认 0 */
|
|
1509
|
+
min?: number;
|
|
1510
|
+
/** 最大值,默认 100 */
|
|
1511
|
+
max?: number;
|
|
1512
|
+
/** 步长,默认 1 */
|
|
1513
|
+
step?: number;
|
|
1514
|
+
/** 是否禁用 */
|
|
1515
|
+
disabled?: boolean;
|
|
1516
|
+
/** 方向,默认 horizontal */
|
|
1517
|
+
orientation?: "horizontal" | "vertical";
|
|
1518
|
+
/** 尺寸,默认 md */
|
|
1519
|
+
size?: SliderSize;
|
|
1520
|
+
/** 是否显示 tooltip,默认 true */
|
|
1521
|
+
tooltip?: boolean;
|
|
1522
|
+
/** 自定义 tooltip 内容格式化 */
|
|
1523
|
+
tipFormatter?: (value: number) => string;
|
|
1524
|
+
/** 自定义类名 */
|
|
1525
|
+
className?: string;
|
|
1526
|
+
/** 自定义样式 */
|
|
1527
|
+
style?: CSSProperties;
|
|
1528
|
+
}
|
|
1529
|
+
|
|
1530
|
+
/**
|
|
1531
|
+
* Slider 滑块组件
|
|
1532
|
+
* 基于 @radix-ui/react-slider,支持单值/range、tooltip、键盘操作
|
|
1533
|
+
*/
|
|
1534
|
+
declare const Slider: React$1.ForwardRefExoticComponent<SliderProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
1535
|
+
|
|
1536
|
+
type StepStatus = "wait" | "process" | "finish" | "error";
|
|
1537
|
+
type StepsSize = "default" | "small";
|
|
1538
|
+
type StepsTitlePlacement = "horizontal" | "vertical";
|
|
1539
|
+
interface StepItem {
|
|
1540
|
+
/** 标题 */
|
|
1541
|
+
title: ReactNode;
|
|
1542
|
+
/** 描述(辅助信息) */
|
|
1543
|
+
description?: ReactNode;
|
|
1544
|
+
/** 自定义图标(覆盖默认数字/状态图标) */
|
|
1545
|
+
icon?: ReactNode;
|
|
1546
|
+
/** 手动指定状态,不传则根据 current 自动推断 */
|
|
1547
|
+
status?: StepStatus;
|
|
1548
|
+
/** 禁用点击 */
|
|
1549
|
+
disabled?: boolean;
|
|
1550
|
+
}
|
|
1551
|
+
interface StepsProps {
|
|
1552
|
+
/** 步骤数据 */
|
|
1553
|
+
items: StepItem[];
|
|
1554
|
+
/** 当前步骤索引(0-based),默认 0 */
|
|
1555
|
+
current?: number;
|
|
1556
|
+
/** 当前步骤的状态,默认 process */
|
|
1557
|
+
status?: StepStatus;
|
|
1558
|
+
/** 层级变体:default 为页面级,small 为次级 */
|
|
1559
|
+
size?: StepsSize;
|
|
1560
|
+
/** 标题放置位置:vertical 标题在图标下方,horizontal 标题在图标右侧 */
|
|
1561
|
+
titlePlacement?: StepsTitlePlacement;
|
|
1562
|
+
/** 起始序号,默认 0 */
|
|
1563
|
+
initial?: number;
|
|
1564
|
+
/** 点击步骤回调,不传则不可点击 */
|
|
1565
|
+
onChange?: (current: number) => void;
|
|
1566
|
+
/** 自定义类名 */
|
|
1567
|
+
className?: string;
|
|
1568
|
+
/** 自定义样式 */
|
|
1569
|
+
style?: CSSProperties;
|
|
1570
|
+
}
|
|
1571
|
+
|
|
1572
|
+
/**
|
|
1573
|
+
* Steps 步骤条组件
|
|
1574
|
+
* 纯自研,支持页面级/次级变体,四种状态,标题纵/横排列
|
|
1575
|
+
*/
|
|
1576
|
+
declare const Steps: React$1.FC<StepsProps>;
|
|
1577
|
+
|
|
1578
|
+
type FormLayout = "horizontal" | "vertical" | "inline";
|
|
1579
|
+
type FormInstance = FormInstance$1;
|
|
1580
|
+
|
|
1581
|
+
interface FormProps {
|
|
1582
|
+
/** 表单实例(由 Form.useForm() 创建) */
|
|
1583
|
+
form?: FormInstance;
|
|
1584
|
+
/** 表单布局,默认 "vertical" */
|
|
1585
|
+
layout?: FormLayout;
|
|
1586
|
+
/** horizontal 布局时 label 宽度,默认 120 */
|
|
1587
|
+
labelWidth?: number | string;
|
|
1588
|
+
/** 表单初始值 */
|
|
1589
|
+
initialValues?: Record<string, unknown>;
|
|
1590
|
+
/** 校验通过后的提交回调 */
|
|
1591
|
+
onFinish?: (values: Record<string, unknown>) => void;
|
|
1592
|
+
/** 校验失败回调 */
|
|
1593
|
+
onFinishFailed?: (errorInfo: {
|
|
1594
|
+
values: Record<string, unknown>;
|
|
1595
|
+
errorFields: {
|
|
1596
|
+
name: (string | number)[];
|
|
1597
|
+
errors: string[];
|
|
1598
|
+
}[];
|
|
1599
|
+
}) => void;
|
|
1600
|
+
/** 字段值变化回调 */
|
|
1601
|
+
onValuesChange?: (changedValues: Record<string, unknown>, allValues: Record<string, unknown>) => void;
|
|
1602
|
+
/** 是否在 required 项显示 * 号,默认 true */
|
|
1603
|
+
requiredMark?: boolean;
|
|
1604
|
+
/** 自定义类名 */
|
|
1605
|
+
className?: string;
|
|
1606
|
+
/** 自定义样式 */
|
|
1607
|
+
style?: CSSProperties;
|
|
1608
|
+
/** 子元素 */
|
|
1609
|
+
children?: ReactNode;
|
|
1610
|
+
}
|
|
1611
|
+
interface FormItemProps {
|
|
1612
|
+
/** 字段名(支持数组路径如 ["user", "name"]) */
|
|
1613
|
+
name?: string | (string | number)[];
|
|
1614
|
+
/** 标签 */
|
|
1615
|
+
label?: ReactNode;
|
|
1616
|
+
/** 校验规则 */
|
|
1617
|
+
rules?: Rule[];
|
|
1618
|
+
/** 是否必填(语法糖,自动添加 required 规则) */
|
|
1619
|
+
required?: boolean;
|
|
1620
|
+
/** 必填提示信息(配合 required 使用) */
|
|
1621
|
+
requiredMessage?: string;
|
|
1622
|
+
/** 标签后的提示信息 */
|
|
1623
|
+
tooltip?: ReactNode;
|
|
1624
|
+
/** 绑定值的 prop 名,默认 "value" */
|
|
1625
|
+
valuePropName?: string;
|
|
1626
|
+
/** 触发 onChange 的 prop 名,默认 "onChange" */
|
|
1627
|
+
trigger?: string;
|
|
1628
|
+
/** 从事件中提取值的方法 */
|
|
1629
|
+
getValueFromEvent?: (...args: unknown[]) => unknown;
|
|
1630
|
+
/** 是否在校验错误时将 error={true} 注入子控件,默认 true */
|
|
1631
|
+
injectError?: boolean;
|
|
1632
|
+
/** 额外说明信息(显示在控件下方) */
|
|
1633
|
+
extra?: ReactNode;
|
|
1634
|
+
/** 自定义类名 */
|
|
1635
|
+
className?: string;
|
|
1636
|
+
/** 自定义样式 */
|
|
1637
|
+
style?: CSSProperties;
|
|
1638
|
+
/** 子元素(表单控件) */
|
|
1639
|
+
children?: ReactElement | ((control: Record<string, unknown>, meta: {
|
|
1640
|
+
errors: string[];
|
|
1641
|
+
}) => ReactNode);
|
|
1642
|
+
}
|
|
1643
|
+
|
|
1644
|
+
/**
|
|
1645
|
+
* Form 表单组件
|
|
1646
|
+
* 基于 rc-field-form,提供布局和校验能力
|
|
1647
|
+
*/
|
|
1648
|
+
declare const InternalForm: React$1.FC<FormProps>;
|
|
1649
|
+
/** useForm — 创建表单实例 */
|
|
1650
|
+
declare function useForm(): [FormInstance];
|
|
1651
|
+
|
|
1652
|
+
/**
|
|
1653
|
+
* Form.Item 表单项组件
|
|
1654
|
+
* 处理 label 布局、校验规则、错误信息展示
|
|
1655
|
+
*/
|
|
1656
|
+
declare const FormItem: React$1.FC<FormItemProps>;
|
|
1657
|
+
|
|
1658
|
+
type FormType = typeof InternalForm & {
|
|
1659
|
+
Item: typeof FormItem;
|
|
1660
|
+
useForm: typeof useForm;
|
|
1661
|
+
};
|
|
1662
|
+
declare const Form: FormType;
|
|
1663
|
+
|
|
1664
|
+
interface AvatarProps {
|
|
1665
|
+
/** 头像图片地址 */
|
|
1666
|
+
src?: string;
|
|
1667
|
+
/** 图片加载失败时的替代文字(如姓氏、英文缩写) */
|
|
1668
|
+
alt?: string;
|
|
1669
|
+
/** 头像尺寸(px),默认 32 */
|
|
1670
|
+
size?: number;
|
|
1671
|
+
/** 自定义圆角,默认圆形(50%) */
|
|
1672
|
+
shape?: "circle" | "square";
|
|
1673
|
+
/** 自定义图标(覆盖默认人形图标) */
|
|
1674
|
+
icon?: ReactNode;
|
|
1675
|
+
/** 自定义类名 */
|
|
1676
|
+
className?: string;
|
|
1677
|
+
/** 自定义样式 */
|
|
1678
|
+
style?: CSSProperties;
|
|
1679
|
+
/** 图片加载失败回调 */
|
|
1680
|
+
onError?: () => void;
|
|
1681
|
+
}
|
|
1682
|
+
interface AvatarGroupProps {
|
|
1683
|
+
/** 最多显示数量,超出显示 +N,默认 5 */
|
|
1684
|
+
max?: number;
|
|
1685
|
+
/** 头像尺寸(px),默认 32 */
|
|
1686
|
+
size?: number;
|
|
1687
|
+
/** 自定义类名 */
|
|
1688
|
+
className?: string;
|
|
1689
|
+
/** 自定义样式 */
|
|
1690
|
+
style?: CSSProperties;
|
|
1691
|
+
/** 子元素(Avatar 列表) */
|
|
1692
|
+
children?: ReactNode;
|
|
1693
|
+
}
|
|
1694
|
+
|
|
1695
|
+
/**
|
|
1696
|
+
* Avatar 头像组件
|
|
1697
|
+
* 支持图片、文字、图标三种展示形态
|
|
1698
|
+
*/
|
|
1699
|
+
declare const Avatar: React$1.ForwardRefExoticComponent<AvatarProps & React$1.RefAttributes<HTMLSpanElement>>;
|
|
1700
|
+
/**
|
|
1701
|
+
* Avatar.Group 头像集群
|
|
1702
|
+
* 最多显示 max 个头像,超出显示 +N
|
|
1703
|
+
*/
|
|
1704
|
+
declare const AvatarGroup: React$1.FC<AvatarGroupProps>;
|
|
1705
|
+
type AvatarType = typeof Avatar & {
|
|
1706
|
+
Group: typeof AvatarGroup;
|
|
1707
|
+
};
|
|
1708
|
+
declare const AvatarWithGroup: AvatarType;
|
|
1709
|
+
|
|
1710
|
+
/** 文件上传状态 */
|
|
1711
|
+
type UploadFileStatus = "ready" | "uploading" | "done" | "error";
|
|
1712
|
+
/** 上传文件对象 */
|
|
1713
|
+
interface UploadFile {
|
|
1714
|
+
/** 唯一标识(内部自动生成) */
|
|
1715
|
+
uid: string;
|
|
1716
|
+
/** 文件名 */
|
|
1717
|
+
name: string;
|
|
1718
|
+
/** 文件大小(bytes) */
|
|
1719
|
+
size?: number;
|
|
1720
|
+
/** MIME 类型 */
|
|
1721
|
+
type?: string;
|
|
1722
|
+
/** 当前状态 */
|
|
1723
|
+
status: UploadFileStatus;
|
|
1724
|
+
/** 上传进度 0-100 */
|
|
1725
|
+
percent?: number;
|
|
1726
|
+
/** 上传成功后的 URL */
|
|
1727
|
+
url?: string;
|
|
1728
|
+
/** 服务端响应数据 */
|
|
1729
|
+
response?: unknown;
|
|
1730
|
+
/** 错误信息 */
|
|
1731
|
+
error?: Error;
|
|
1732
|
+
/** 原始 File 对象(本地选择后可用) */
|
|
1733
|
+
originFile?: File;
|
|
1734
|
+
}
|
|
1735
|
+
/** customRequest 入参 */
|
|
1736
|
+
interface CustomRequestOptions {
|
|
1737
|
+
/** 待上传的文件 */
|
|
1738
|
+
file: File;
|
|
1739
|
+
/** 更新进度(0-100) */
|
|
1740
|
+
onProgress: (percent: number) => void;
|
|
1741
|
+
/** 上传成功 */
|
|
1742
|
+
onSuccess: (response?: unknown) => void;
|
|
1743
|
+
/** 上传失败 */
|
|
1744
|
+
onError: (error: Error) => void;
|
|
1745
|
+
}
|
|
1746
|
+
/** customRequest 返回值,提供中止能力 */
|
|
1747
|
+
interface CustomRequestReturn {
|
|
1748
|
+
abort: () => void;
|
|
1749
|
+
}
|
|
1750
|
+
/** 文件校验拒绝原因 */
|
|
1751
|
+
type RejectReason = "size" | "type" | "count";
|
|
1752
|
+
/** 文件列表项操作 */
|
|
1753
|
+
interface FileItemActions {
|
|
1754
|
+
/** 移除文件 */
|
|
1755
|
+
remove: () => void;
|
|
1756
|
+
/** 重新上传 */
|
|
1757
|
+
retry: () => void;
|
|
1758
|
+
}
|
|
1759
|
+
interface UploadProps {
|
|
1760
|
+
/** 接受的文件 MIME 类型,如 "image/*,.pdf" */
|
|
1761
|
+
accept?: string;
|
|
1762
|
+
/** 单文件大小限制(bytes) */
|
|
1763
|
+
maxSize?: number;
|
|
1764
|
+
/** 最大文件数量 */
|
|
1765
|
+
maxCount?: number;
|
|
1766
|
+
/** 是否允许多选 */
|
|
1767
|
+
multiple?: boolean;
|
|
1768
|
+
/** 是否渲染拖拽上传区域 */
|
|
1769
|
+
drag?: boolean;
|
|
1770
|
+
/** 禁用状态 */
|
|
1771
|
+
disabled?: boolean;
|
|
1772
|
+
/** 受控文件列表 */
|
|
1773
|
+
fileList?: UploadFile[];
|
|
1774
|
+
/** 非受控默认文件列表 */
|
|
1775
|
+
defaultFileList?: UploadFile[];
|
|
1776
|
+
/** 自定义上传实现(必传,组件不内置上传逻辑) */
|
|
1777
|
+
customRequest: (options: CustomRequestOptions) => CustomRequestReturn | void;
|
|
1778
|
+
/** 文件列表变更回调 */
|
|
1779
|
+
onChange?: (fileList: UploadFile[]) => void;
|
|
1780
|
+
/** 文件校验拒绝回调 */
|
|
1781
|
+
onReject?: (files: File[], reason: RejectReason) => void;
|
|
1782
|
+
/** 移除文件前的拦截,返回 false 或 reject 阻止移除 */
|
|
1783
|
+
onRemove?: (file: UploadFile) => void | boolean | Promise<boolean>;
|
|
1784
|
+
/** 触发区域自定义内容(非 drag 模式) */
|
|
1785
|
+
children?: ReactNode;
|
|
1786
|
+
/** 自定义文件列表项渲染 */
|
|
1787
|
+
renderItem?: (file: UploadFile, actions: FileItemActions) => ReactNode;
|
|
1788
|
+
/** 是否显示文件列表,默认 true */
|
|
1789
|
+
showFileList?: boolean;
|
|
1790
|
+
/** 自定义类名 */
|
|
1791
|
+
className?: string;
|
|
1792
|
+
/** 自定义样式 */
|
|
1793
|
+
style?: React.CSSProperties;
|
|
1794
|
+
}
|
|
1795
|
+
|
|
1796
|
+
/**
|
|
1797
|
+
* Upload 上传组件
|
|
1798
|
+
* 支持点击选择和拖拽上传两种模式,文件校验、进度展示、文件列表管理
|
|
1799
|
+
*/
|
|
1800
|
+
declare const Upload: React$1.ForwardRefExoticComponent<UploadProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1801
|
+
|
|
1802
|
+
interface ScrollAreaProps {
|
|
1803
|
+
/** 子内容 */
|
|
1804
|
+
children: ReactNode;
|
|
1805
|
+
/** 自定义类名(应用于 Root) */
|
|
1806
|
+
className?: string;
|
|
1807
|
+
/** 自定义样式(应用于 Root) */
|
|
1808
|
+
style?: CSSProperties;
|
|
1809
|
+
/**
|
|
1810
|
+
* 滚动条显示策略
|
|
1811
|
+
* - scroll: 滚动时显示,停止后隐藏(默认)
|
|
1812
|
+
* - hover: 鼠标悬浮时显示
|
|
1813
|
+
* - auto: 内容溢出时显示
|
|
1814
|
+
* - always: 始终显示
|
|
1815
|
+
*/
|
|
1816
|
+
type?: "scroll" | "hover" | "auto" | "always";
|
|
1817
|
+
/** 停止滚动/移出后滚动条隐藏延迟(ms),仅 type="scroll"|"hover" 时生效 */
|
|
1818
|
+
scrollHideDelay?: number;
|
|
1819
|
+
/**
|
|
1820
|
+
* 滚动条方向
|
|
1821
|
+
* - vertical: 仅垂直(默认)
|
|
1822
|
+
* - horizontal: 仅水平
|
|
1823
|
+
* - both: 双向
|
|
1824
|
+
*/
|
|
1825
|
+
scrollbars?: "vertical" | "horizontal" | "both";
|
|
1826
|
+
/** 滚动条默认尺寸(px) */
|
|
1827
|
+
scrollbarSize?: number;
|
|
1828
|
+
/** 滚动条悬浮时尺寸(px) */
|
|
1829
|
+
scrollbarHoverSize?: number;
|
|
1830
|
+
/** Viewport 滚动事件回调(用于触底加载等场景) */
|
|
1831
|
+
onScroll?: UIEventHandler<HTMLDivElement>;
|
|
1832
|
+
/** Viewport(实际滚动元素)的 ref,用于外部控制滚动位置 */
|
|
1833
|
+
viewportRef?: Ref<HTMLDivElement>;
|
|
1834
|
+
}
|
|
1835
|
+
interface ScrollBarProps {
|
|
1836
|
+
/** 滚动条方向 */
|
|
1837
|
+
orientation?: "vertical" | "horizontal";
|
|
1838
|
+
/** 自定义类名 */
|
|
1839
|
+
className?: string;
|
|
1840
|
+
}
|
|
1841
|
+
|
|
1842
|
+
/**
|
|
1843
|
+
* ScrollArea 滚动区域组件
|
|
1844
|
+
*
|
|
1845
|
+
* 增强原生滚动功能,提供自定义跨浏览器滚动条样式:
|
|
1846
|
+
* - 滚动条悬浮在内容上方,不占用布局空间
|
|
1847
|
+
* - 保留原生滚动行为,键盘/触摸不受影响
|
|
1848
|
+
* - 支持多种显示策略:scroll / hover / auto / always
|
|
1849
|
+
*
|
|
1850
|
+
* ```tsx
|
|
1851
|
+
* <ScrollArea style={{ height: 300 }}>
|
|
1852
|
+
* <LongList />
|
|
1853
|
+
* </ScrollArea>
|
|
1854
|
+
* ```
|
|
1855
|
+
*/
|
|
1856
|
+
declare const ScrollArea: React$1.ForwardRefExoticComponent<ScrollAreaProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1857
|
+
/**
|
|
1858
|
+
* ScrollBar 滚动条子组件
|
|
1859
|
+
*
|
|
1860
|
+
* 通常由 ScrollArea 内部自动渲染,也可单独使用以获得更精细的控制。
|
|
1861
|
+
*/
|
|
1862
|
+
declare const ScrollBar: React$1.ForwardRefExoticComponent<ScrollBarProps & React$1.RefAttributes<HTMLDivElement>>;
|
|
1863
|
+
|
|
67
1864
|
/**
|
|
68
1865
|
* 合并 CSS 类名,支持条件拼接
|
|
69
1866
|
* @param inputs - 任意数量的 ClassValue 参数
|
|
@@ -71,11 +1868,4 @@ declare function useComponentLocale<K extends keyof Omit<Locale, "locale">>(comp
|
|
|
71
1868
|
*/
|
|
72
1869
|
declare function cn(...inputs: ClassValue[]): string;
|
|
73
1870
|
|
|
74
|
-
|
|
75
|
-
type LgSize = "xs" | "sm" | "md" | "lg";
|
|
76
|
-
/** 组件变体类型 */
|
|
77
|
-
type LgVariant = "primary" | "secondary" | "ghost" | "outline" | "text" | "link";
|
|
78
|
-
/** 组件形状类型 */
|
|
79
|
-
type LgShape = "default" | "circle" | "round";
|
|
80
|
-
|
|
81
|
-
export { type LgShape, type LgSize, type LgVariant, LingeeProvider, type LingeeProviderProps, type Locale, cn, enUS, useComponentLocale, useLocale, zhCN };
|
|
1871
|
+
export { Alert, type AlertProps, type AlertType, AvatarWithGroup as Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, type BreadcrumbSize, ButtonProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, ColorPicker, type ColorPickerProps, type ColorPickerSize, type CoverConfig, type CustomRequestOptions, type CustomRequestReturn, DatePicker, type DatePickerProps, type DatePickerSize, type DateRange, Dialog, type DialogConfirmOptions, type DialogProps, Divider, type DividerOrientation, type DividerProps, type DividerVariant, Drawer, type DrawerPlacement, type DrawerProps, Dropdown, DropdownCheckboxItem, type DropdownCheckboxItemProps, DropdownContent, type DropdownContentProps, DropdownGroup, type DropdownGroupProps, DropdownItem, type DropdownItemData, type DropdownItemProps, DropdownLabel, type DropdownLabelData, type DropdownLabelProps, type DropdownMenuItemData, type DropdownProps, DropdownRadioGroup, type DropdownRadioGroupProps, DropdownRadioItem, type DropdownRadioItemProps, DropdownSeparator, type DropdownSeparatorData, type DropdownSeparatorProps, DropdownSub, DropdownSubContent, type DropdownSubContentProps, type DropdownSubProps, DropdownSubTrigger, type DropdownSubTriggerProps, DropdownTrigger, type DropdownTriggerProps, Empty, type EmptyIconComponent, type EmptyProps, type EmptySize, type FileItemActions, Flex, type FlexGapSize, type FlexOrientation, type FlexProps, Form, type FormInstance, type FormItemProps, type FormLayout, type FormProps, Image, type ImagePreviewGroupProps, type ImageProps, type ImgInfo, LgSize, LingeeProvider, type LingeeProviderProps, type Locale, Pagination, type PaginationProps, type PaginationVariant, PopoverContentProps, type PreviewGroupType, type PreviewType, Progress, type ProgressProps, type ProgressStatus, type ProgressType, RadioGroup, type RadioGroupProps, RadioItem, type RadioItemProps, type RadioSize, RangePicker, type RangePickerProps, type RangePickerSize, type RejectReason, ScrollArea, type ScrollAreaProps, ScrollBar, type ScrollBarProps, Select, type SelectDropdownProps, type SelectMode, type SelectOption, type SelectOptionGroup, type SelectProps, type SelectSize, Skeleton, type SkeletonAnimation, type SkeletonProps, type SkeletonVariant, Slider, type SliderProps, type SliderSize, Spin, type SpinProps, type SpinSize, type StepItem, type StepStatus, Steps, type StepsProps, type StepsSize, type StepsTitlePlacement, Table, type TableColumnType, type TableProps, type TableRowSelection, type TableSize, type TableSorterState, Tag, type TagPresetColor, type TagProps, type TagShape, type TagSize, TimePicker, type TimePickerProps, type TimePickerSize, type TimeValue, type TransformAction, type TransformType, Upload, type UploadFile, type UploadFileStatus, type UploadProps, cn, enUS, useComponentLocale, useLocale, zhCN };
|