react-public-components 1.1.18 → 1.2.0

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/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import React__default, { ReactNode, CSSProperties, Key, HTMLAttributes } from 'react';
2
+ import React__default, { ReactNode, CSSProperties, Key, HTMLAttributes, FC } from 'react';
3
3
 
4
4
  type CollapseBoxDirection = 'horizontal' | 'vertical';
5
5
  type CollapseBoxButtonPosition = 'left' | 'right' | 'top' | 'bottom';
@@ -186,4 +186,1519 @@ interface BorderBeamProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'>
186
186
  }
187
187
  declare const BorderBeam: (props: BorderBeamProps) => React.JSX.Element;
188
188
 
189
- export { BorderBeam, type BorderBeamColorStop, type BorderBeamProps, type Breakpoint, CollapsibleBox as CollapseBox, type CollapseBoxButtonPosition, type CollapseBoxDirection, type CollapseBoxProps, DisabledBox, type DisabledBoxProps, type Gap, Masonry, type MasonryClassNames, type MasonryItem, type MasonryProps, type MasonrySemanticDOM, type MasonryStyles, CustomSplitter as Splitter, type SplitterCollapsible, type SplitterOrientation, type SplitterPanelProps, type SplitterProps, type SplitterSize };
189
+ interface HsbColor {
190
+ h: number;
191
+ s: number;
192
+ b: number;
193
+ a: number;
194
+ }
195
+ interface RgbColor {
196
+ r: number;
197
+ g: number;
198
+ b: number;
199
+ a: number;
200
+ }
201
+ interface ColorGradientStop {
202
+ color: Color;
203
+ percent: number;
204
+ }
205
+ type ColorInput = string | Color | {
206
+ r: number;
207
+ g: number;
208
+ b: number;
209
+ a?: number;
210
+ } | {
211
+ h: number;
212
+ s: number;
213
+ b: number;
214
+ a?: number;
215
+ };
216
+ declare class Color {
217
+ h: number;
218
+ s: number;
219
+ b: number;
220
+ a: number;
221
+ constructor(colorInput?: ColorInput);
222
+ static rgbToHsb(r: number, g: number, b: number, a?: number): HsbColor;
223
+ static hsbToRgb(h: number, s: number, b: number, a?: number): RgbColor;
224
+ static parseString(str: string): HsbColor;
225
+ toRgb(): RgbColor;
226
+ toRgbString(): string;
227
+ toHsb(): HsbColor;
228
+ toHsbString(): string;
229
+ toHex(): string;
230
+ toHexString(): string;
231
+ toCssString(): string;
232
+ }
233
+ declare const generateColor: (color: ColorInput) => Color;
234
+
235
+ type ColorFormat = 'hex' | 'rgb' | 'hsb';
236
+ type ColorMode = 'single' | 'gradient';
237
+ interface ColorPresetItem {
238
+ label: ReactNode;
239
+ colors: (string | Color)[];
240
+ defaultOpen?: boolean;
241
+ key?: Key;
242
+ }
243
+ interface ColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'value' | 'defaultValue' | 'children'> {
244
+ allowClear?: boolean;
245
+ arrow?: boolean | {
246
+ pointAtCenter?: boolean;
247
+ };
248
+ children?: ReactNode | ((color: Color) => ReactNode);
249
+ defaultValue?: ColorInput;
250
+ defaultFormat?: ColorFormat;
251
+ disabled?: boolean;
252
+ disabledAlpha?: boolean;
253
+ disabledFormat?: boolean;
254
+ destroyOnHidden?: boolean;
255
+ format?: ColorFormat;
256
+ mode?: ColorMode | ColorMode[];
257
+ open?: boolean;
258
+ presets?: ColorPresetItem[];
259
+ placement?: 'top' | 'topLeft' | 'topRight' | 'bottom' | 'bottomLeft' | 'bottomRight';
260
+ panelRender?: (panel: ReactNode, extra: {
261
+ components: {
262
+ Picker: FC;
263
+ Presets: FC;
264
+ };
265
+ }) => ReactNode;
266
+ showText?: boolean | ((color: Color | ColorGradientStop[]) => ReactNode);
267
+ size?: 'large' | 'middle' | 'small';
268
+ trigger?: 'hover' | 'click';
269
+ value?: ColorInput;
270
+ onChange?: (value: Color, css: string) => void;
271
+ onChangeComplete?: (value: Color) => void;
272
+ onFormatChange?: (format: ColorFormat) => void;
273
+ onOpenChange?: (open: boolean) => void;
274
+ onClear?: () => void;
275
+ }
276
+ declare const ColorPicker: (props: ColorPickerProps) => React.JSX.Element;
277
+
278
+ interface CopyButtonProps {
279
+ /** 要复制的目标文本 */
280
+ text?: string;
281
+ /** 动态获取要复制的目标文本(支持异步) */
282
+ getText?: () => string | Promise<string>;
283
+ /** 复制按钮的展示形态:button 按钮形态、icon 纯图标、inline 行内文本 */
284
+ mode?: 'button' | 'icon' | 'inline';
285
+ /** 按钮类型(仅在 mode='button' 时有效) */
286
+ type?: 'default' | 'primary';
287
+ /** 默认图标 */
288
+ icon?: ReactNode;
289
+ /** 复制成功后的图标 */
290
+ copiedIcon?: ReactNode;
291
+ /** 复制成功后展示的文本 */
292
+ copiedText?: ReactNode;
293
+ /** 默认展示的子内容/按钮文案 */
294
+ children?: ReactNode;
295
+ /** 复制成功提示的 Tooltip 配置(传 false 禁用,传字符串/ReactNode 自定义文案,传 true 使用默认'复制成功') */
296
+ tooltip?: boolean | ReactNode;
297
+ /** 复制成功后的高亮展示持续时间(毫秒),默认 2000ms */
298
+ duration?: number;
299
+ /** 是否禁用 */
300
+ disabled?: boolean;
301
+ /** 成功复制回调 */
302
+ onCopy?: (text: string) => void;
303
+ /** 复制失败回调 */
304
+ onError?: (error: unknown) => void;
305
+ /** 自定义类名 */
306
+ className?: string;
307
+ /** 自定义样式 */
308
+ style?: CSSProperties;
309
+ }
310
+ declare const CopyButton: React__default.FC<CopyButtonProps>;
311
+
312
+ interface TextEllipsisExpandConfig {
313
+ /** 展开按钮文案,默认为 '展开' */
314
+ collapsedText?: ReactNode;
315
+ /** 收起按钮文案,默认为 '收起' */
316
+ expandedText?: ReactNode;
317
+ /** 默认是否展开 */
318
+ defaultExpanded?: boolean;
319
+ /** 展开状态改变回调 */
320
+ onExpandChange?: (expanded: boolean) => void;
321
+ }
322
+ interface TextEllipsisProps {
323
+ /** 显示的文本或节点 */
324
+ children: ReactNode;
325
+ /** 最大显示行数,超过则截断,默认为 1 */
326
+ lines?: number;
327
+ /** 是否支持展开/收起,可传 boolean 或配置对象 */
328
+ expandable?: boolean | TextEllipsisExpandConfig;
329
+ /** Tooltip 浮层展示配置:'auto' 仅在溢出截断时展示、true 始终在 hover 时展示、false 禁用 */
330
+ tooltip?: 'auto' | boolean | ReactNode;
331
+ /** 是否显示复制按钮 */
332
+ copyable?: boolean;
333
+ /** 前缀节点 */
334
+ prefix?: ReactNode;
335
+ /** 后缀节点 */
336
+ suffix?: ReactNode;
337
+ /** 自定义类名 */
338
+ className?: string;
339
+ /** 自定义样式 */
340
+ style?: CSSProperties;
341
+ }
342
+ declare const TextEllipsis: React__default.FC<TextEllipsisProps>;
343
+
344
+ interface SelectOption {
345
+ label: ReactNode;
346
+ value: string | number;
347
+ disabled?: boolean;
348
+ [key: string]: unknown;
349
+ }
350
+ type SelectValue = string | number | SelectOption | (string | number | SelectOption)[] | undefined;
351
+ interface DebounceSelectProps {
352
+ /** 异步拉取选项列表的函数 */
353
+ fetchOptions: (search: string) => Promise<SelectOption[]>;
354
+ /** 防抖等待时间(毫秒),默认为 300ms */
355
+ debounceTimeout?: number;
356
+ /** 选择模式:'single' 单选,'multiple' 多选(Tag标签形式) */
357
+ mode?: 'single' | 'multiple';
358
+ /** 当前选中值 */
359
+ value?: SelectValue;
360
+ /** 默认选中值 */
361
+ defaultValue?: SelectValue;
362
+ /** 选中值变化回调 */
363
+ onChange?: (value: any, option?: SelectOption | SelectOption[]) => void;
364
+ /** 输入框占位符 */
365
+ placeholder?: string;
366
+ /** 是否支持清空 */
367
+ allowClear?: boolean;
368
+ /** 是否禁用 */
369
+ disabled?: boolean;
370
+ /** 空数据时的展示内容 */
371
+ notFoundContent?: ReactNode;
372
+ /** 默认选项列表(搜索前展示) */
373
+ defaultOptions?: SelectOption[];
374
+ /** 自定义类名 */
375
+ className?: string;
376
+ /** 自定义样式 */
377
+ style?: CSSProperties;
378
+ }
379
+ declare const DebounceSelect: React__default.FC<DebounceSelectProps>;
380
+
381
+ interface CountUpProps {
382
+ /** 起始数值,默认为 0 */
383
+ start?: number;
384
+ /** 目标数值 */
385
+ end: number;
386
+ /** 动画持续时间(秒),默认为 2 */
387
+ duration?: number;
388
+ /** 保留小数位数,默认为 0 */
389
+ decimals?: number;
390
+ /** 小数点符号,默认为 '.' */
391
+ decimal?: string;
392
+ /** 千分位分隔符,默认为 ',',若不显示可传空字符串 */
393
+ separator?: string;
394
+ /** 前缀字符或节点(如 '¥'、'$') */
395
+ prefix?: ReactNode;
396
+ /** 后缀字符或节点(如 '%'、'件') */
397
+ suffix?: ReactNode;
398
+ /** 是否启用缓动过渡,默认为 true */
399
+ useEasing?: boolean;
400
+ /** 是否自动开始动画,默认为 true */
401
+ autoStart?: boolean;
402
+ /** 动画完成回调 */
403
+ onEnd?: () => void;
404
+ /** 自定义类名 */
405
+ className?: string;
406
+ /** 自定义样式 */
407
+ style?: CSSProperties;
408
+ }
409
+ interface CountUpRef {
410
+ /** 开始/重新播放动画 */
411
+ start: () => void;
412
+ /** 重置回起始值 */
413
+ reset: () => void;
414
+ /** 更新目标值并平滑过渡 */
415
+ update: (newEnd: number) => void;
416
+ }
417
+ declare const CountUp: React__default.ForwardRefExoticComponent<CountUpProps & React__default.RefAttributes<CountUpRef>>;
418
+
419
+ interface ContextMenuItem {
420
+ /** 菜单项唯一标识 */
421
+ key: string;
422
+ /** 菜单项展示文本或节点 */
423
+ label?: ReactNode;
424
+ /** 菜单项前置图标 */
425
+ icon?: ReactNode;
426
+ /** 是否为分割线 */
427
+ type?: 'divider';
428
+ /** 是否禁用 */
429
+ disabled?: boolean;
430
+ /** 是否为警示/危险操作(红色显示) */
431
+ danger?: boolean;
432
+ /** 快捷键提示(如 '⌘ C' / 'Ctrl+C') */
433
+ shortcut?: string;
434
+ /** 二级子菜单项列表 */
435
+ children?: ContextMenuItem[];
436
+ /** 点击菜单项回调 */
437
+ onClick?: (item: ContextMenuItem, e: React__default.MouseEvent) => void;
438
+ }
439
+ interface ContextMenuProps {
440
+ /** 菜单项列表配置 */
441
+ items: ContextMenuItem[];
442
+ /** 被右键激活的目标子组件/容器 */
443
+ children: ReactNode;
444
+ /** 是否禁用右键上下文菜单 */
445
+ disabled?: boolean;
446
+ /** 菜单显隐状态改变回调 */
447
+ onOpenChange?: (open: boolean) => void;
448
+ /** 自定义菜单类名 */
449
+ menuClassName?: string;
450
+ /** 自定义菜单样式 */
451
+ menuStyle?: CSSProperties;
452
+ /** 自定义外层包裹类名 */
453
+ className?: string;
454
+ /** 自定义外层包裹样式 */
455
+ style?: CSSProperties;
456
+ }
457
+ declare const ContextMenu: React__default.FC<ContextMenuProps>;
458
+
459
+ interface FullscreenRef {
460
+ /** 进入全屏 */
461
+ enter: () => Promise<void>;
462
+ /** 退出全屏 */
463
+ exit: () => Promise<void>;
464
+ /** 切换全屏状态 */
465
+ toggle: () => Promise<void>;
466
+ /** 当前是否处于全屏状态 */
467
+ isFullscreen: boolean;
468
+ /** 当前目标容器 DOM 元素 */
469
+ getElement: () => HTMLElement | null;
470
+ }
471
+ type FullscreenMode = 'browser' | 'web';
472
+ type FullscreenButtonPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
473
+ interface FullscreenRenderProps {
474
+ isFullscreen: boolean;
475
+ enter: () => Promise<void>;
476
+ exit: () => Promise<void>;
477
+ toggle: () => Promise<void>;
478
+ }
479
+ interface FullscreenProps {
480
+ /** 子元素或 Render Props 函数 */
481
+ children?: ReactNode | ((props: FullscreenRenderProps) => ReactNode);
482
+ /** 全屏模式:'browser' 原生浏览器全屏,'web' 网页内最大化置顶 */
483
+ mode?: FullscreenMode;
484
+ /** 自定义目标全屏元素(不传时默认为当前包裹的容器元素,传 document.documentElement 时为整页全屏) */
485
+ target?: HTMLElement | (() => HTMLElement | null) | null;
486
+ /** 受控全屏状态 */
487
+ fullscreen?: boolean;
488
+ /** 默认全屏状态 */
489
+ defaultFullscreen?: boolean;
490
+ /** 全屏状态变化回调 */
491
+ onChange?: (isFullscreen: boolean) => void;
492
+ /** 是否在容器角落展示快速全屏切换悬浮按钮,默认 false */
493
+ showButton?: boolean;
494
+ /** 悬浮按钮对齐位置,默认 'top-right' */
495
+ buttonPosition?: FullscreenButtonPosition;
496
+ /** 悬浮按钮的自定义 Tooltip 提示或图标 */
497
+ enterIcon?: ReactNode;
498
+ exitIcon?: ReactNode;
499
+ /** 自定义类名 */
500
+ className?: string;
501
+ /** 自定义样式 */
502
+ style?: CSSProperties;
503
+ }
504
+ declare const Fullscreen: React__default.ForwardRefExoticComponent<FullscreenProps & React__default.RefAttributes<FullscreenRef>>;
505
+
506
+ type CropShape = 'rect' | 'round';
507
+ interface CropResult {
508
+ dataURL: string;
509
+ blob: Blob | null;
510
+ width: number;
511
+ height: number;
512
+ }
513
+ interface ImageCropperRef {
514
+ /** 获取当前裁剪结果(DataURL 与 Blob) */
515
+ getCroppedResult: (type?: string, quality?: number) => Promise<CropResult>;
516
+ /** 顺时针旋转 90 度 */
517
+ rotate: (degree?: number) => void;
518
+ /** 缩放图片 */
519
+ zoom: (delta: number) => void;
520
+ /** 重置所有变换参数 */
521
+ reset: () => void;
522
+ }
523
+ interface ImageCropperProps {
524
+ /** 图片源地址或 Base64 字符串 */
525
+ src: string;
526
+ /** 裁剪框宽高比(如 1 代表 1:1 正方形,16/9 代表宽屏,0 代表自由矩形),默认为 1 */
527
+ aspectRatio?: number;
528
+ /** 裁剪框形状:'rect' 矩形,'round' 圆形(适合头像),默认为 'rect' */
529
+ shape?: CropShape;
530
+ /** 是否以 Modal 模态弹窗形式展示,默认为 false */
531
+ modal?: boolean;
532
+ /** Modal 模式下的标题,默认为 '图片裁剪' */
533
+ title?: ReactNode;
534
+ /** Modal 模式下的显隐受控状态 */
535
+ open?: boolean;
536
+ /** 确认裁剪回调 */
537
+ onOk?: (result: CropResult) => void;
538
+ /** 取消/关闭回调 */
539
+ onCancel?: () => void;
540
+ /** 容器高度(内联模式有效),默认为 360 */
541
+ height?: number;
542
+ /** 自定义类名 */
543
+ className?: string;
544
+ /** 自定义样式 */
545
+ style?: CSSProperties;
546
+ }
547
+ declare const ImageCropper: React__default.ForwardRefExoticComponent<ImageCropperProps & React__default.RefAttributes<ImageCropperRef>>;
548
+
549
+ interface ScrollTrackerProps {
550
+ /** 进度条吸附位置:'top' 顶部,'bottom' 底部,默认为 'top' */
551
+ position?: 'top' | 'bottom';
552
+ /** 进度条高度(像素),默认为 3 */
553
+ height?: number;
554
+ /** 进度条颜色或渐变色配置(如 '#1677ff' 或 ['#1677ff', '#52c41a']) */
555
+ color?: string | string[];
556
+ /** 是否显示右上角/角落的百分比数字浮签,默认为 false */
557
+ showPercentage?: boolean;
558
+ /** 监听滚动的目标元素或 ref(不传时监听整个 window 视口) */
559
+ target?: HTMLElement | (() => HTMLElement | null) | null;
560
+ /** 进度改变回调 (0 ~ 100) */
561
+ onChange?: (percent: number) => void;
562
+ /** 自定义类名 */
563
+ className?: string;
564
+ /** 自定义样式 */
565
+ style?: CSSProperties;
566
+ }
567
+ declare const ScrollTracker: React__default.FC<ScrollTrackerProps>;
568
+ interface StickyHeaderProps {
569
+ /** 子内容 */
570
+ children: ReactNode | ((isSticky: boolean) => ReactNode);
571
+ /** 吸顶距离顶部偏移量(像素),默认为 0 */
572
+ offsetTop?: number;
573
+ /** 吸顶状态改变回调 */
574
+ onStickyChange?: (isSticky: boolean) => void;
575
+ /** 监听滚动的目标容器(默认为 window) */
576
+ target?: HTMLElement | (() => HTMLElement | null) | null;
577
+ /** 自定义类名 */
578
+ className?: string;
579
+ /** 自定义样式 */
580
+ style?: CSSProperties;
581
+ }
582
+ declare const StickyHeader: React__default.FC<StickyHeaderProps>;
583
+
584
+ type FileType = 'image' | 'video' | 'audio' | 'pdf' | 'text' | 'unknown';
585
+ interface FileItem {
586
+ /** 文件访问 URL 或 Base64 */
587
+ url: string;
588
+ /** 文件名称 */
589
+ name?: string;
590
+ /** 文件类型(如不传则根据文件名后缀或 URL 自动推断) */
591
+ fileType?: FileType;
592
+ /** 文件大小描述(如 '2.4 MB') */
593
+ size?: string;
594
+ /** 纯文本内容(针对直接传入 text 字符串预览) */
595
+ textContent?: string;
596
+ }
597
+ interface FilePreviewerProps {
598
+ /** 是否打开预览弹窗 */
599
+ open: boolean;
600
+ /** 当前预览的文件对象或 URL 字符串 */
601
+ file?: FileItem | string | null;
602
+ /** 关闭弹窗回调 */
603
+ onCancel?: () => void;
604
+ /** 自定义下载行为(不传时使用默认浏览器下载) */
605
+ onDownload?: (file: FileItem) => void;
606
+ /** 自定义标题栏右侧额外操作按钮 */
607
+ extraActions?: ReactNode;
608
+ /** 自定义类名 */
609
+ className?: string;
610
+ /** 自定义样式 */
611
+ style?: CSSProperties;
612
+ }
613
+ declare function inferFileType(urlOrName: string): FileType;
614
+ declare const FilePreviewer: React__default.FC<FilePreviewerProps> & {
615
+ preview: (options: FileItem) => {
616
+ close: () => void;
617
+ };
618
+ };
619
+
620
+ interface FloatingActionItem {
621
+ key: string;
622
+ label: ReactNode;
623
+ icon?: ReactNode;
624
+ type?: 'default' | 'primary' | 'danger';
625
+ disabled?: boolean;
626
+ onClick?: (e: React__default.MouseEvent) => void;
627
+ }
628
+ interface FloatingActionBarProps {
629
+ /** 是否显示悬浮操作栏(如传 selectedCount 时,默认 selectedCount > 0 自动显示) */
630
+ open?: boolean;
631
+ /** 当前选中的项目数 */
632
+ selectedCount?: number;
633
+ /** 总项目数(可选,如传则展示 '已选 X / 共 Y 项') */
634
+ totalCount?: number;
635
+ /** 清空/取消全部选择的回调 */
636
+ onClear?: () => void;
637
+ /** 取消选择按钮文案,默认为 '取消选择' */
638
+ clearText?: ReactNode;
639
+ /** 批量操作按钮列表 */
640
+ actions?: FloatingActionItem[];
641
+ /** 自定义操作区内容插槽 */
642
+ children?: ReactNode;
643
+ /** 距离屏幕底部的偏移量(像素),默认为 28 */
644
+ offsetBottom?: number;
645
+ /** 是否支持右上角关闭按钮 */
646
+ closable?: boolean;
647
+ /** 关闭回调 */
648
+ onClose?: () => void;
649
+ /** 自定义类名 */
650
+ className?: string;
651
+ /** 自定义样式 */
652
+ style?: CSSProperties;
653
+ }
654
+ declare const FloatingActionBar: React__default.FC<FloatingActionBarProps>;
655
+
656
+ interface TagInputProps {
657
+ /** 标签列表(受控) */
658
+ value?: string[];
659
+ /** 默认标签列表 */
660
+ defaultValue?: string[];
661
+ /** 标签列表改变回调 */
662
+ onChange?: (tags: string[]) => void;
663
+ /** 最大允许输入的标签数量 */
664
+ maxCount?: number;
665
+ /** 单个标签的最大字符长度 */
666
+ maxLength?: number;
667
+ /** 是否允许重复标签,默认为 false */
668
+ allowDuplicates?: boolean;
669
+ /** 触发添加标签的按键/分隔符,默认为 ['Enter', ',', ','] */
670
+ separators?: string[];
671
+ /** 标签自定义校验函数(返回 true 通过,返回 false 或 string 报错) */
672
+ validate?: (tag: string) => boolean | string;
673
+ /** 占位提示文案 */
674
+ placeholder?: string;
675
+ /** 是否禁用 */
676
+ disabled?: boolean;
677
+ /** 自定义渲染单个 Tag */
678
+ renderTag?: (tag: string, index: number, onClose: () => void) => ReactNode;
679
+ /** 自定义类名 */
680
+ className?: string;
681
+ /** 自定义样式 */
682
+ style?: CSSProperties;
683
+ }
684
+ declare const TagInput: React__default.FC<TagInputProps>;
685
+
686
+ type PasswordStrengthLevel = 0 | 1 | 2 | 3 | 4;
687
+ interface PasswordRule {
688
+ key: string;
689
+ label: ReactNode;
690
+ validator: (password: string) => boolean;
691
+ }
692
+ interface PasswordStrengthProps {
693
+ /** 当前输入的密码文本 */
694
+ password?: string;
695
+ /** 是否显示密码强度文字(弱/中/强/极强),默认为 true */
696
+ showText?: boolean;
697
+ /** 是否显示密码规则校验清单,默认为 false */
698
+ showRules?: boolean;
699
+ /** 自定义规则列表 */
700
+ rules?: PasswordRule[];
701
+ /** 强度等级改变回调 */
702
+ onLevelChange?: (level: PasswordStrengthLevel) => void;
703
+ /** 自定义类名 */
704
+ className?: string;
705
+ /** 自定义样式 */
706
+ style?: CSSProperties;
707
+ }
708
+ declare function evaluatePasswordStrength(pwd?: string, rules?: PasswordRule[]): {
709
+ level: PasswordStrengthLevel;
710
+ score: number;
711
+ passedKeys: string[];
712
+ };
713
+ declare const PasswordStrength: React__default.FC<PasswordStrengthProps>;
714
+
715
+ interface JsonEditorProps {
716
+ /** JSON 数据内容(可传 JSON 字符串或 Object 对象) */
717
+ value?: string | object;
718
+ /** 默认 JSON 数据内容 */
719
+ defaultValue?: string | object;
720
+ /** 内容变化回调 */
721
+ onChange?: (rawJson: string, parsedObject?: any) => void;
722
+ /** 是否只读模式,默认为 false */
723
+ readOnly?: boolean;
724
+ /** 缩进空格数,默认为 2 */
725
+ indent?: number;
726
+ /** 编辑器高度,默认为 280 */
727
+ height?: number | string;
728
+ /** 是否展示行号,默认为 true */
729
+ showLineNumbers?: boolean;
730
+ /** 是否展示顶部工具栏,默认为 true */
731
+ showToolbar?: boolean;
732
+ /** 自定义类名 */
733
+ className?: string;
734
+ /** 自定义样式 */
735
+ style?: CSSProperties;
736
+ }
737
+ declare const JsonEditor: React__default.FC<JsonEditorProps>;
738
+
739
+ interface InfiniteScrollListProps {
740
+ /** 列表项子内容 */
741
+ children: ReactNode;
742
+ /** 是否还有更多数据可供加载 */
743
+ hasMore: boolean;
744
+ /** 当前是否正在加载下一页 */
745
+ loading: boolean;
746
+ /** 触底加载下一页回调 */
747
+ onLoadMore: () => void | Promise<void>;
748
+ /** 触发加载的触底距离阈值(像素),默认为 40 */
749
+ threshold?: number;
750
+ /** 没有更多数据时的底部提示内容,默认为 '已经到底啦 ~' */
751
+ endMessage?: ReactNode;
752
+ /** 加载中指示器组件,默认为 Spin 图标与 '正在加载更多...' */
753
+ loadingIndicator?: ReactNode;
754
+ /** 容器固定高度(传值时为局部滚动容器,不传时监听 window 全局滚动) */
755
+ height?: number | string;
756
+ /** 滚动容器 ref 或自定义对象 */
757
+ scrollableTarget?: HTMLElement | (() => HTMLElement | null) | null;
758
+ /** 自定义类名 */
759
+ className?: string;
760
+ /** 自定义样式 */
761
+ style?: CSSProperties;
762
+ }
763
+ declare const InfiniteScrollList: React__default.FC<InfiniteScrollListProps>;
764
+
765
+ type MarqueeDirection = 'left' | 'right' | 'up' | 'down';
766
+ interface MarqueeProps {
767
+ /** 滚动子内容 */
768
+ children: ReactNode;
769
+ /** 滚动方向:'left' | 'right' | 'up' | 'down',默认为 'left' */
770
+ direction?: MarqueeDirection;
771
+ /** 滚动速度(像素/秒),默认为 50 */
772
+ speed?: number;
773
+ /** 鼠标悬浮时是否暂停动画,默认为 true */
774
+ pauseOnHover?: boolean;
775
+ /** 是否开启两侧边缘羽化渐变遮罩,默认为 false */
776
+ gradient?: boolean;
777
+ /** 边缘渐变遮罩的颜色(通常与背景色一致),默认为 '#ffffff' */
778
+ gradientColor?: string;
779
+ /** 子项间距(像素),默认为 24 */
780
+ gap?: number;
781
+ /** 是否持续保持播放 */
782
+ play?: boolean;
783
+ /** 自定义类名 */
784
+ className?: string;
785
+ /** 自定义样式 */
786
+ style?: CSSProperties;
787
+ }
788
+ declare const Marquee: React__default.FC<MarqueeProps>;
789
+
790
+ interface SpotlightCardProps {
791
+ /** 卡片子内容 */
792
+ children: ReactNode;
793
+ /** 聚光灯光晕颜色,默认为 'rgba(22, 119, 255, 0.15)' */
794
+ spotlightColor?: string;
795
+ /** 聚光灯光晕半径(像素),默认为 320 */
796
+ spotlightSize?: number;
797
+ /** 是否开启暗色主题(高对比科技感),默认为 false */
798
+ dark?: boolean;
799
+ /** 自定义类名 */
800
+ className?: string;
801
+ /** 自定义样式 */
802
+ style?: CSSProperties;
803
+ }
804
+ declare const SpotlightCard: React__default.FC<SpotlightCardProps>;
805
+
806
+ type SensitiveType = 'phone' | 'idcard' | 'email' | 'bankcard' | 'custom';
807
+ interface SensitiveMaskProps {
808
+ /** 原始敏感文本 */
809
+ text: string;
810
+ /** 脱敏类型:'phone' | 'idcard' | 'email' | 'bankcard' | 'custom',默认为 'phone' */
811
+ type?: SensitiveType;
812
+ /** 默认是否脱敏遮蔽,默认为 true */
813
+ defaultMasked?: boolean;
814
+ /** 遮罩字符,默认为 '*' */
815
+ maskSymbol?: string;
816
+ /** 自定义保留头部明文字符数(仅 type='custom' 有效) */
817
+ unmaskedStart?: number;
818
+ /** 自定义保留尾部明文字符数(仅 type='custom' 有效) */
819
+ unmaskedEnd?: number;
820
+ /** 是否支持切换明文/密文查看,默认为 true */
821
+ toggleable?: boolean;
822
+ /** 是否支持一键复制,默认为 false */
823
+ copyable?: boolean;
824
+ /** 切换明文时的拦截回调(返回 false 可阻止切换,支持异步鉴权) */
825
+ onToggle?: (nextMasked: boolean) => boolean | Promise<boolean>;
826
+ /** 自定义类名 */
827
+ className?: string;
828
+ /** 自定义样式 */
829
+ style?: CSSProperties;
830
+ }
831
+ declare function maskSensitiveText(raw: string, type?: SensitiveType, maskSymbol?: string, startCount?: number, endCount?: number): string;
832
+ declare const SensitiveMask: React__default.FC<SensitiveMaskProps>;
833
+
834
+ type DiffViewMode = 'split' | 'unified';
835
+ interface DiffViewerProps {
836
+ /** 修改前的旧文本 */
837
+ oldValue: string;
838
+ /** 修改后的新文本 */
839
+ newValue: string;
840
+ /** 视图模式:'split' 左右分栏,'unified' 单列行内,默认为 'split' */
841
+ viewMode?: DiffViewMode;
842
+ /** 是否允许用户自由切换视图模式,默认为 true */
843
+ allowModeChange?: boolean;
844
+ /** 文件标题或说明 */
845
+ title?: ReactNode;
846
+ /** 自定义类名 */
847
+ className?: string;
848
+ /** 自定义样式 */
849
+ style?: CSSProperties;
850
+ }
851
+ declare const DiffViewer: React__default.FC<DiffViewerProps>;
852
+
853
+ type CronPeriodType = 'minute' | 'hour' | 'day' | 'week' | 'month' | 'custom';
854
+ interface CronPickerProps {
855
+ /** 当前 Cron 表达式(受控) */
856
+ value?: string;
857
+ /** 默认 Cron 表达式,默认为 '0 0 12 * * ?' */
858
+ defaultValue?: string;
859
+ /** 表达式改变回调 */
860
+ onChange?: (cron: string, humanReadable: string) => void;
861
+ /** 自定义类名 */
862
+ className?: string;
863
+ /** 自定义样式 */
864
+ style?: CSSProperties;
865
+ }
866
+ declare const CronPicker: React__default.FC<CronPickerProps>;
867
+
868
+ type TourPlacement = 'top' | 'bottom' | 'left' | 'right';
869
+ interface TourStep {
870
+ /** 目标 DOM 节点选择器、DOM 对象或获取函数 */
871
+ target: string | HTMLElement | (() => HTMLElement | null) | null;
872
+ /** 引导步骤标题 */
873
+ title: ReactNode;
874
+ /** 引导步骤详细说明 */
875
+ description: ReactNode;
876
+ /** 气泡对齐方向,默认为 'bottom' */
877
+ placement?: TourPlacement;
878
+ }
879
+ interface GuidedTourProps {
880
+ /** 引导步骤列表 */
881
+ steps: TourStep[];
882
+ /** 是否开启引导 */
883
+ open: boolean;
884
+ /** 当前步数(受控,可选) */
885
+ current?: number;
886
+ /** 步数改变回调 */
887
+ onChange?: (current: number) => void;
888
+ /** 关闭/跳过引导回调 */
889
+ onClose?: () => void;
890
+ /** 全部引导完成回调 */
891
+ onFinish?: () => void;
892
+ /** LocalStorage 存储已完成状态的 Key(若提供则完成或跳过后自动持久化记录) */
893
+ storageKey?: string;
894
+ /** 自定义类名 */
895
+ className?: string;
896
+ /** 自定义样式 */
897
+ style?: CSSProperties;
898
+ }
899
+ declare const GuidedTour: React__default.FC<GuidedTourProps>;
900
+
901
+ type RangeValue = [number | undefined, number | undefined];
902
+ interface RangeShortcut {
903
+ label: string;
904
+ value: RangeValue;
905
+ }
906
+ interface NumericRangeInputProps {
907
+ /** 当前区间值 [min, max](受控) */
908
+ value?: RangeValue;
909
+ /** 默认区间值 */
910
+ defaultValue?: RangeValue;
911
+ /** 区间改变回调 */
912
+ onChange?: (range: RangeValue) => void;
913
+ /** 允许输入的最小值 */
914
+ min?: number;
915
+ /** 允许输入的最大值 */
916
+ max?: number;
917
+ /** 步长,默认为 1 */
918
+ step?: number;
919
+ /** 精度小数位数 */
920
+ precision?: number;
921
+ /** 前缀标签(如 '¥') */
922
+ prefix?: ReactNode;
923
+ /** 后缀标签(如 '元') */
924
+ suffix?: ReactNode;
925
+ /** 连接分隔符,默认为 '~' */
926
+ separator?: ReactNode;
927
+ /** 快捷区间选项列表 */
928
+ shortcuts?: RangeShortcut[];
929
+ /** 是否禁用 */
930
+ disabled?: boolean;
931
+ /** 自定义类名 */
932
+ className?: string;
933
+ /** 自定义样式 */
934
+ style?: CSSProperties;
935
+ }
936
+ declare const NumericRangeInput: React__default.FC<NumericRangeInputProps>;
937
+
938
+ interface MetricCardProps {
939
+ /** 卡片标题 */
940
+ title: ReactNode;
941
+ /** 指标数值(若是数字则自动平滑滚动) */
942
+ value: number | string;
943
+ /** 数值前缀(如 '¥') */
944
+ prefix?: ReactNode;
945
+ /** 数值后缀(如 '元' / '%') */
946
+ suffix?: ReactNode;
947
+ /** 趋势方向:'up' 上升(绿色),'down' 下降(红色) */
948
+ trend?: 'up' | 'down';
949
+ /** 趋势数值说明(如 '+18.5%' 或 '-3.2%') */
950
+ trendValue?: ReactNode;
951
+ /** 趋势比较文本说明(如 '较上月') */
952
+ trendLabel?: ReactNode;
953
+ /** 迷你折线图数据数组(如 [12, 18, 15, 26, 32, 40]) */
954
+ chartData?: number[];
955
+ /** 折线图颜色,默认为 '#1677ff' */
956
+ chartColor?: string;
957
+ /** 底部说明节点 */
958
+ footer?: ReactNode;
959
+ /** 右上角额外操作节点 */
960
+ extra?: ReactNode;
961
+ /** 自定义类名 */
962
+ className?: string;
963
+ /** 自定义样式 */
964
+ style?: CSSProperties;
965
+ }
966
+ declare const MetricCard: React__default.FC<MetricCardProps>;
967
+
968
+ interface AudioPlayerProps {
969
+ /** 音频资源地址 */
970
+ src: string;
971
+ /** 音频标题或文件名 */
972
+ title?: ReactNode;
973
+ /** 默认倍速,默认为 1 */
974
+ defaultPlaybackRate?: number;
975
+ /** 是否显示下载按钮,默认为 true */
976
+ showDownload?: boolean;
977
+ /** 自定义类名 */
978
+ className?: string;
979
+ /** 自定义样式 */
980
+ style?: CSSProperties;
981
+ }
982
+ declare const AudioPlayer: React__default.FC<AudioPlayerProps>;
983
+
984
+ type QrCodeStatus = 'active' | 'expired' | 'loading';
985
+ interface QrCodeCardProps {
986
+ /** 二维码内容或跳转 URL */
987
+ value: string;
988
+ /** 二维码尺寸(像素),默认为 160 */
989
+ size?: number;
990
+ /** 中心嵌入的 Logo 图标地址 */
991
+ icon?: string;
992
+ /** 二维码状态:'active' 正常,'expired' 已过期,'loading' 生成中,默认为 'active' */
993
+ status?: QrCodeStatus;
994
+ /** 卡片标题说明 */
995
+ title?: ReactNode;
996
+ /** 卡片副标题或扫码提示 */
997
+ description?: ReactNode;
998
+ /** 是否显示一键下载二维码按钮,默认为 false */
999
+ downloadable?: boolean;
1000
+ /** 点击过期遮罩刷新时的回调 */
1001
+ onRefresh?: () => void;
1002
+ /** 自定义类名 */
1003
+ className?: string;
1004
+ /** 自定义样式 */
1005
+ style?: CSSProperties;
1006
+ }
1007
+ declare const QrCodeCard: React__default.FC<QrCodeCardProps>;
1008
+
1009
+ interface ActivityItem {
1010
+ /** 唯一标识 */
1011
+ id: string | number;
1012
+ /** 操作人昵称 */
1013
+ operator: string;
1014
+ /** 操作人头像链接或文字 */
1015
+ avatar?: string;
1016
+ /** 操作人角色(如 '管理员' / '运维工程师') */
1017
+ role?: string;
1018
+ /** 动作类型描述(如 '发布了版本' / '修改了配置') */
1019
+ action: ReactNode;
1020
+ /** 操作目标(如 'v2.1.0' / 'RDS-MySQL-Master') */
1021
+ target?: ReactNode;
1022
+ /** 发生时间戳或文本(如 '3分钟前' / '2026-08-15 14:20') */
1023
+ time: string;
1024
+ /** 变动详情内容(支持折叠展开) */
1025
+ detail?: ReactNode;
1026
+ /** 是否默认展开详情,默认为 false */
1027
+ defaultExpanded?: boolean;
1028
+ }
1029
+ interface ActivityLogProps {
1030
+ /** 日志动态列表 */
1031
+ items: ActivityItem[];
1032
+ /** 自定义类名 */
1033
+ className?: string;
1034
+ /** 自定义样式 */
1035
+ style?: CSSProperties;
1036
+ }
1037
+ declare const ActivityLog: React__default.FC<ActivityLogProps>;
1038
+
1039
+ interface DragSortListProps<T> {
1040
+ /** 数据列表 */
1041
+ items: T[];
1042
+ /** 拖拽排序完成后的新列表回调 */
1043
+ onReorder: (newItems: T[]) => void;
1044
+ /** 提取唯一 Key */
1045
+ keyExtractor: (item: T, index: number) => string | number;
1046
+ /** 自定义渲染单个列表项内容 */
1047
+ renderItem: (item: T, index: number, isDragging: boolean) => ReactNode;
1048
+ /** 自定义类名 */
1049
+ className?: string;
1050
+ /** 自定义样式 */
1051
+ style?: CSSProperties;
1052
+ }
1053
+ declare function DragSortList<T>({ items, onReorder, keyExtractor, renderItem, className, style, }: DragSortListProps<T>): React__default.JSX.Element;
1054
+
1055
+ interface TiltCardProps {
1056
+ /** 卡片子内容 */
1057
+ children: ReactNode;
1058
+ /** 最大倾斜旋转角度(度),默认为 15 */
1059
+ maxAngle?: number;
1060
+ /** 鼠标悬停时的缩放比例,默认为 1.02 */
1061
+ scale?: number;
1062
+ /** 是否开启表面跟随高光(Glare),默认为 true */
1063
+ glare?: boolean;
1064
+ /** 透视景深(像素),默认为 1000 */
1065
+ perspective?: number;
1066
+ /** 自定义类名 */
1067
+ className?: string;
1068
+ /** 自定义样式 */
1069
+ style?: CSSProperties;
1070
+ }
1071
+ declare const TiltCard: React__default.FC<TiltCardProps>;
1072
+
1073
+ interface VirtualListProps<T> {
1074
+ /** 数据源数组 */
1075
+ items: T[];
1076
+ /** 单个列表项固定高度(像素),默认为 48 */
1077
+ itemHeight?: number;
1078
+ /** 滚动容器可视高度(像素),默认为 360 */
1079
+ height?: number;
1080
+ /** 自定义渲染单个列表项 */
1081
+ renderItem: (item: T, index: number) => ReactNode;
1082
+ /** 提取唯一 Key */
1083
+ keyExtractor?: (item: T, index: number) => string | number;
1084
+ /** 上下视口外额外渲染的缓冲项数量,默认为 5 */
1085
+ buffer?: number;
1086
+ /** 自定义类名 */
1087
+ className?: string;
1088
+ /** 自定义样式 */
1089
+ style?: CSSProperties;
1090
+ }
1091
+ declare function VirtualList<T>({ items, itemHeight, height, renderItem, keyExtractor, buffer, className, style, }: VirtualListProps<T>): React__default.JSX.Element;
1092
+
1093
+ interface WatermarkProps {
1094
+ /** 水印文本内容或多行文本数组 */
1095
+ content: string | string[];
1096
+ /** 子元素内容 */
1097
+ children?: ReactNode;
1098
+ /** 水印旋转角度,默认为 -22 */
1099
+ rotate?: number;
1100
+ /** 字体大小(像素),默认为 14 */
1101
+ fontSize?: number;
1102
+ /** 水印颜色,默认为 'rgba(0, 0, 0, 0.12)' */
1103
+ color?: string;
1104
+ /** 单个水印单元宽度,默认为 240 */
1105
+ width?: number;
1106
+ /** 单个水印单元高度,默认为 160 */
1107
+ height?: number;
1108
+ /** 水印层级 zIndex,默认为 9999 */
1109
+ zIndex?: number;
1110
+ /** 是否开启 MutationObserver 与心跳巡检防审查元素篡改,默认为 true */
1111
+ antiTamper?: boolean;
1112
+ /** 自定义类名 */
1113
+ className?: string;
1114
+ /** 自定义样式 */
1115
+ style?: CSSProperties;
1116
+ }
1117
+ declare const Watermark: React__default.FC<WatermarkProps>;
1118
+
1119
+ interface VideoPlayerProps {
1120
+ /** 视频播放地址 */
1121
+ src: string;
1122
+ /** 视频封面图 */
1123
+ poster?: string;
1124
+ /** 是否自动播放,默认为 false */
1125
+ autoPlay?: boolean;
1126
+ /** 是否循环播放,默认为 false */
1127
+ loop?: boolean;
1128
+ /** 是否默认静音,默认为 false */
1129
+ muted?: boolean;
1130
+ /** 宽度,默认为 640 */
1131
+ width?: number | string;
1132
+ /** 高度,默认为 360 */
1133
+ height?: number | string;
1134
+ /** 自定义类名 */
1135
+ className?: string;
1136
+ /** 自定义样式 */
1137
+ style?: CSSProperties;
1138
+ }
1139
+ declare const VideoPlayer: React__default.FC<VideoPlayerProps>;
1140
+
1141
+ interface PdfViewerProps {
1142
+ /** PDF 文件 URL 地址 */
1143
+ src: string;
1144
+ /** 文档标题 */
1145
+ title?: ReactNode;
1146
+ /** 宽度,默认为 '100%' */
1147
+ width?: number | string;
1148
+ /** 高度,默认为 500 */
1149
+ height?: number | string;
1150
+ /** 是否显示下载按钮,默认为 true */
1151
+ showDownload?: boolean;
1152
+ /** 自定义类名 */
1153
+ className?: string;
1154
+ /** 自定义样式 */
1155
+ style?: CSSProperties;
1156
+ }
1157
+ declare const PdfViewer: React__default.FC<PdfViewerProps>;
1158
+
1159
+ type RibbonPlacement = 'start' | 'end';
1160
+ interface BadgeRibbonProps {
1161
+ /** 缎带文字内容 */
1162
+ text: ReactNode;
1163
+ /** 缎带背景颜色,默认为 '#ff4d4f' */
1164
+ color?: string;
1165
+ /** 挂载位置:'start' 左上角,'end' 右上角,默认为 'end' */
1166
+ placement?: RibbonPlacement;
1167
+ /** 被包裹的卡片子元素 */
1168
+ children: ReactNode;
1169
+ /** 自定义类名 */
1170
+ className?: string;
1171
+ /** 自定义样式 */
1172
+ style?: CSSProperties;
1173
+ }
1174
+ declare const BadgeRibbon: React__default.FC<BadgeRibbonProps>;
1175
+
1176
+ type SkeletonType = 'text' | 'card' | 'list' | 'avatar';
1177
+ interface ShimmerSkeletonProps {
1178
+ /** 骨架类型:'text' 文本,'card' 卡片,'list' 列表,'avatar' 头像,默认为 'card' */
1179
+ type?: SkeletonType;
1180
+ /** 文本骨架行数,默认为 3 */
1181
+ rows?: number;
1182
+ /** 是否处于加载中状态,为 false 时渲染 children,默认为 true */
1183
+ loading?: boolean;
1184
+ /** 加载完成后的子元素内容 */
1185
+ children?: ReactNode;
1186
+ /** 自定义类名 */
1187
+ className?: string;
1188
+ /** 自定义样式 */
1189
+ style?: CSSProperties;
1190
+ }
1191
+ declare const ShimmerSkeleton: React__default.FC<ShimmerSkeletonProps>;
1192
+
1193
+ type FlipTrigger = 'hover' | 'click';
1194
+ type FlipDirection = 'horizontal' | 'vertical';
1195
+ interface FlipCardProps {
1196
+ /** 卡片正面内容 */
1197
+ front: ReactNode;
1198
+ /** 卡片背面内容 */
1199
+ back: ReactNode;
1200
+ /** 触发翻转方式:'hover' 悬停,'click' 点击,默认为 'hover' */
1201
+ trigger?: FlipTrigger;
1202
+ /** 翻转方向:'horizontal' 水平,'vertical' 垂直,默认为 'horizontal' */
1203
+ direction?: FlipDirection;
1204
+ /** 当前是否翻转到背面(受控) */
1205
+ flipped?: boolean;
1206
+ /** 翻转状态改变回调 */
1207
+ onFlip?: (isFlipped: boolean) => void;
1208
+ /** 宽度,默认为 300 */
1209
+ width?: number | string;
1210
+ /** 高度,默认为 200 */
1211
+ height?: number | string;
1212
+ /** 自定义类名 */
1213
+ className?: string;
1214
+ /** 自定义样式 */
1215
+ style?: CSSProperties;
1216
+ }
1217
+ declare const FlipCard: React__default.FC<FlipCardProps>;
1218
+
1219
+ interface KanbanColumn<T> {
1220
+ id: string;
1221
+ title: string;
1222
+ color?: string;
1223
+ items: T[];
1224
+ }
1225
+ interface KanbanBoardProps<T> {
1226
+ /** 泳道列数据 */
1227
+ columns: KanbanColumn<T>[];
1228
+ /** 提取卡片唯一 Key */
1229
+ keyExtractor: (item: T) => string;
1230
+ /** 自定义渲染单个卡片 */
1231
+ renderCard: (item: T, columnId: string) => ReactNode;
1232
+ /** 卡片拖拽移动完成回调 */
1233
+ onCardMove?: (cardId: string, sourceColId: string, targetColId: string, newIndex: number) => void;
1234
+ /** 自定义类名 */
1235
+ className?: string;
1236
+ /** 自定义样式 */
1237
+ style?: CSSProperties;
1238
+ }
1239
+ declare function KanbanBoard<T>({ columns, keyExtractor, renderCard, onCardMove, className, style, }: KanbanBoardProps<T>): React__default.JSX.Element;
1240
+
1241
+ interface TreeFilterNode {
1242
+ label: string;
1243
+ value: string | number;
1244
+ children?: TreeFilterNode[];
1245
+ }
1246
+ interface TreeFilterPanelProps {
1247
+ /** 树形分类选项列表 */
1248
+ options: TreeFilterNode[];
1249
+ /** 当前选中的值数组(受控) */
1250
+ value?: (string | number)[];
1251
+ /** 默认选中的值数组 */
1252
+ defaultValue?: (string | number)[];
1253
+ /** 选中值变化回调 */
1254
+ onChange?: (values: (string | number)[]) => void;
1255
+ /** 是否支持多选,默认为 true */
1256
+ multiple?: boolean;
1257
+ /** 标题前缀,默认为 ['一级分类', '二级分类', '三级标签'] */
1258
+ levelLabels?: string[];
1259
+ /** 自定义类名 */
1260
+ className?: string;
1261
+ /** 自定义样式 */
1262
+ style?: CSSProperties;
1263
+ }
1264
+ declare const TreeFilterPanel: React__default.FC<TreeFilterPanelProps>;
1265
+
1266
+ type EnvType = 'dev' | 'test' | 'uat' | 'staging' | 'prod';
1267
+ type EnvPlacement = 'top-right' | 'top-left' | 'bottom-right';
1268
+ interface EnvBuildInfo {
1269
+ apiHost?: string;
1270
+ branch?: string;
1271
+ commit?: string;
1272
+ buildTime?: string;
1273
+ version?: string;
1274
+ }
1275
+ interface EnvSwitchItem {
1276
+ label: string;
1277
+ url: string;
1278
+ env: EnvType;
1279
+ }
1280
+ interface EnvBadgeProps {
1281
+ /** 当前运行环境:'dev' | 'test' | 'uat' | 'staging' | 'prod' */
1282
+ env: EnvType;
1283
+ /** 显示文本(不传则默认大写环境名) */
1284
+ label?: ReactNode;
1285
+ /** 悬浮挂载位置,默认为 'top-right' */
1286
+ placement?: EnvPlacement;
1287
+ /** 当前构建与部署版本信息 */
1288
+ info?: EnvBuildInfo;
1289
+ /** 快捷切换至其他环境列表 */
1290
+ switchList?: EnvSwitchItem[];
1291
+ /** 是否默认常驻,默认为 true */
1292
+ visible?: boolean;
1293
+ /** 自定义类名 */
1294
+ className?: string;
1295
+ /** 自定义样式 */
1296
+ style?: CSSProperties;
1297
+ }
1298
+ declare const EnvBadge: React__default.FC<EnvBadgeProps>;
1299
+
1300
+ type TimelineStatus = 'finish' | 'process' | 'error' | 'wait';
1301
+ interface TimelineOperator {
1302
+ name: string;
1303
+ avatar?: ReactNode;
1304
+ }
1305
+ interface StatusTimelineItem {
1306
+ title: ReactNode;
1307
+ description?: ReactNode;
1308
+ time?: string;
1309
+ duration?: string;
1310
+ status?: TimelineStatus;
1311
+ operator?: TimelineOperator;
1312
+ }
1313
+ interface StatusTimelineProps {
1314
+ /** 时间轴节点列表 */
1315
+ items: StatusTimelineItem[];
1316
+ /** 自定义类名 */
1317
+ className?: string;
1318
+ /** 自定义样式 */
1319
+ style?: CSSProperties;
1320
+ }
1321
+ declare const StatusTimeline: React__default.FC<StatusTimelineProps>;
1322
+
1323
+ interface GradientTextProps {
1324
+ /** 文字内容 */
1325
+ children: ReactNode;
1326
+ /** 渐变色定义,默认为 'linear-gradient(90deg, #1677ff 0%, #722ed1 50%, #eb2f96 100%)' */
1327
+ gradient?: string;
1328
+ /** 是否开启流光滚动动画,默认为 true */
1329
+ animate?: boolean;
1330
+ /** 流光动画周期时间(秒),默认为 4 */
1331
+ speed?: number;
1332
+ /** 自定义类名 */
1333
+ className?: string;
1334
+ /** 自定义样式 */
1335
+ style?: CSSProperties;
1336
+ }
1337
+ declare const GradientText: React__default.FC<GradientTextProps>;
1338
+
1339
+ interface KeyValItem {
1340
+ key: string;
1341
+ value: string;
1342
+ enabled?: boolean;
1343
+ isSecret?: boolean;
1344
+ }
1345
+ interface KeyValEditorProps {
1346
+ /** 键值对数组(受控) */
1347
+ value?: KeyValItem[];
1348
+ /** 默认键值对数组 */
1349
+ defaultValue?: KeyValItem[];
1350
+ /** 变化回调 */
1351
+ onChange?: (items: KeyValItem[]) => void;
1352
+ /** Key 输入框占位文案,默认为 'Key 键名' */
1353
+ keyPlaceholder?: string;
1354
+ /** Value 输入框占位文案,默认为 'Value 键值' */
1355
+ valPlaceholder?: string;
1356
+ /** 是否允许配置 Secret 密码掩码,默认为 true */
1357
+ allowSecret?: boolean;
1358
+ /** 自定义类名 */
1359
+ className?: string;
1360
+ /** 自定义样式 */
1361
+ style?: CSSProperties;
1362
+ }
1363
+ declare const KeyValEditor: React__default.FC<KeyValEditorProps>;
1364
+
1365
+ interface ShortcutItem {
1366
+ key: string;
1367
+ label: string;
1368
+ calc: () => [string, string];
1369
+ }
1370
+ interface QuickDateRangeProps {
1371
+ /** 当前选中项的 key(受控) */
1372
+ activeKey?: string;
1373
+ /** 默认选中的 key,默认为 '7days' */
1374
+ defaultKey?: string;
1375
+ /** 切换回调 */
1376
+ onChange?: (dateRange: [string, string], key: string) => void;
1377
+ /** 自定义类名 */
1378
+ className?: string;
1379
+ /** 自定义样式 */
1380
+ style?: CSSProperties;
1381
+ }
1382
+ declare const QuickDateRange: React__default.FC<QuickDateRangeProps>;
1383
+
1384
+ interface DiffColumn {
1385
+ key: string;
1386
+ title: string;
1387
+ /** 是否为数值对比列,默认为 false */
1388
+ isNumeric?: boolean;
1389
+ }
1390
+ interface DiffTableProps {
1391
+ /** 列定义 */
1392
+ columns: DiffColumn[];
1393
+ /** 基准期数据(如上月/上期) */
1394
+ baseData: Record<string, any>[];
1395
+ /** 当前期数据(如本月/当期) */
1396
+ currentData: Record<string, any>[];
1397
+ /** 唯一行主键,默认为 'id' */
1398
+ rowKey?: string;
1399
+ /** 自定义类名 */
1400
+ className?: string;
1401
+ /** 自定义样式 */
1402
+ style?: CSSProperties;
1403
+ }
1404
+ declare const DiffTable: React__default.FC<DiffTableProps>;
1405
+
1406
+ interface PhotoItem {
1407
+ src: string;
1408
+ alt?: string;
1409
+ title?: string;
1410
+ }
1411
+ interface PhotoViewerProps {
1412
+ /** 相册图片列表 */
1413
+ images: PhotoItem[];
1414
+ /** 默认展示图片下标,默认为 0 */
1415
+ defaultIndex?: number;
1416
+ /** 图片高度,默认为 380 */
1417
+ height?: number | string;
1418
+ /** 图片切换回调 */
1419
+ onChange?: (index: number) => void;
1420
+ /** 自定义类名 */
1421
+ className?: string;
1422
+ /** 自定义样式 */
1423
+ style?: CSSProperties;
1424
+ }
1425
+ declare const PhotoViewer: React__default.FC<PhotoViewerProps>;
1426
+
1427
+ interface TrendIndicatorProps {
1428
+ /** 变动数值(如 14.2 代表 +14.2%,-5.8 代表 -5.8%) */
1429
+ value: number;
1430
+ /** 数值后缀,默认为 '%' */
1431
+ suffix?: string;
1432
+ /** 数值前缀 */
1433
+ prefix?: string;
1434
+ /** 保留小数位数,默认为 1 */
1435
+ precision?: number;
1436
+ /** 展示模式:'filled' 填充色块 | 'outlined' 线框 | 'text' 纯文字,默认为 'filled' */
1437
+ type?: 'filled' | 'outlined' | 'text';
1438
+ /** 是否反转红绿色彩规则(如成本/延时降低为绿色),默认为 false */
1439
+ reverse?: boolean;
1440
+ /** 自定义类名 */
1441
+ className?: string;
1442
+ /** 自定义样式 */
1443
+ style?: CSSProperties;
1444
+ }
1445
+ declare const TrendIndicator: React__default.FC<TrendIndicatorProps>;
1446
+
1447
+ interface CountdownButtonProps {
1448
+ /** 初始按钮文案,默认为 '获取验证码' */
1449
+ text?: ReactNode;
1450
+ /** 倒计时时长(秒),默认为 60 */
1451
+ seconds?: number;
1452
+ /** 倒计时中文案生成函数,默认为 (sec) => `${sec}s 后重试` */
1453
+ countdownText?: (secondsLeft: number) => ReactNode;
1454
+ /** 重置后的再次获取文案,默认使用 text */
1455
+ resetText?: ReactNode;
1456
+ /** 点击触发异步前置检查,返回 true 启动倒计时,返回 false 阻止,若抛错也自动恢复 */
1457
+ onBeforeStart?: () => Promise<boolean> | boolean;
1458
+ /** 倒计时结束回调 */
1459
+ onEnd?: () => void;
1460
+ /** 是否外部强行禁用 */
1461
+ disabled?: boolean;
1462
+ /** 自定义类名 */
1463
+ className?: string;
1464
+ /** 自定义样式 */
1465
+ style?: CSSProperties;
1466
+ }
1467
+ declare const CountdownButton: React__default.FC<CountdownButtonProps>;
1468
+
1469
+ interface ProgressSegment {
1470
+ label: string;
1471
+ value: number;
1472
+ color: string;
1473
+ suffix?: string;
1474
+ }
1475
+ interface SegmentedProgressProps {
1476
+ /** 分段数据列表 */
1477
+ segments: ProgressSegment[];
1478
+ /** 总量基准(不传则自动对各分段 value 求和) */
1479
+ total?: number;
1480
+ /** 进度条高度(像素),默认为 10 */
1481
+ height?: number;
1482
+ /** 是否显示底部图例 Legend,默认为 true */
1483
+ showLegend?: boolean;
1484
+ /** 自定义类名 */
1485
+ className?: string;
1486
+ /** 自定义样式 */
1487
+ style?: CSSProperties;
1488
+ }
1489
+ declare const SegmentedProgress: React__default.FC<SegmentedProgressProps>;
1490
+
1491
+ interface HoverCardProps {
1492
+ /** 触发宿主元素 */
1493
+ children: ReactNode;
1494
+ /** 悬浮弹出的卡片内容 */
1495
+ content: ReactNode;
1496
+ /** 鼠标移入展开延迟(毫秒),默认为 200 */
1497
+ openDelay?: number;
1498
+ /** 鼠标移出关闭延迟(毫秒),默认为 200 */
1499
+ closeDelay?: number;
1500
+ /** 自定义类名 */
1501
+ className?: string;
1502
+ /** 自定义样式 */
1503
+ style?: CSSProperties;
1504
+ }
1505
+ declare const HoverCard: React__default.FC<HoverCardProps>;
1506
+
1507
+ interface TreeTransferNode {
1508
+ key: string;
1509
+ title: string;
1510
+ children?: TreeTransferNode[];
1511
+ }
1512
+ interface TreeTransferProps {
1513
+ /** 树形数据源 */
1514
+ treeData: TreeTransferNode[];
1515
+ /** 右侧已选择 keys 列表(受控) */
1516
+ targetKeys?: string[];
1517
+ /** 默认已选择 keys 列表 */
1518
+ defaultTargetKeys?: string[];
1519
+ /** 改变回调 */
1520
+ onChange?: (targetKeys: string[]) => void;
1521
+ /** 左侧面板标题,默认为 '待选项目录' */
1522
+ sourceTitle?: string;
1523
+ /** 右侧面板标题,默认为 '已选项目' */
1524
+ targetTitle?: string;
1525
+ /** 自定义类名 */
1526
+ className?: string;
1527
+ /** 自定义样式 */
1528
+ style?: CSSProperties;
1529
+ }
1530
+ declare const TreeTransfer: React__default.FC<TreeTransferProps>;
1531
+
1532
+ interface NumberStepperProps {
1533
+ /** 当前数值(受控) */
1534
+ value?: number;
1535
+ /** 默认数值 */
1536
+ defaultValue?: number;
1537
+ /** 最小值,默认为 0 */
1538
+ min?: number;
1539
+ /** 最大值,默认为 100 */
1540
+ max?: number;
1541
+ /** 步长,默认为 1 */
1542
+ step?: number;
1543
+ /** 改变回调 */
1544
+ onChange?: (val: number) => void;
1545
+ /** 是否禁用 */
1546
+ disabled?: boolean;
1547
+ /** 自定义类名 */
1548
+ className?: string;
1549
+ /** 自定义样式 */
1550
+ style?: CSSProperties;
1551
+ }
1552
+ declare const NumberStepper: React__default.FC<NumberStepperProps>;
1553
+
1554
+ interface JsonTreeProps {
1555
+ /** JSON 数据源 */
1556
+ data: any;
1557
+ /** 默认展开层级深度,默认为 2 */
1558
+ defaultExpandedLevel?: number;
1559
+ /** 自定义类名 */
1560
+ className?: string;
1561
+ /** 自定义样式 */
1562
+ style?: CSSProperties;
1563
+ }
1564
+ declare const JsonTree: React__default.FC<JsonTreeProps>;
1565
+
1566
+ interface CodeSnippetProps {
1567
+ /** 代码文本内容 */
1568
+ code: string;
1569
+ /** 编程语言标识,默认为 'bash' */
1570
+ language?: string;
1571
+ /** 自定义类名 */
1572
+ className?: string;
1573
+ /** 自定义样式 */
1574
+ style?: CSSProperties;
1575
+ }
1576
+ declare const CodeSnippet: React__default.FC<CodeSnippetProps>;
1577
+
1578
+ interface MiniSparklineProps {
1579
+ /** 数值序列 */
1580
+ data: number[];
1581
+ /** 折线与填充主题色,默认为 '#1677ff' */
1582
+ color?: string;
1583
+ /** 是否展示面积渐变填充,默认为 true */
1584
+ fill?: boolean;
1585
+ /** 宽度(像素),默认为 80 */
1586
+ width?: number;
1587
+ /** 高度(像素),默认为 28 */
1588
+ height?: number;
1589
+ /** 自定义类名 */
1590
+ className?: string;
1591
+ /** 自定义样式 */
1592
+ style?: CSSProperties;
1593
+ }
1594
+ declare const MiniSparkline: React__default.FC<MiniSparklineProps>;
1595
+
1596
+ interface FileDropZoneProps {
1597
+ /** 文件选择/拖拽/粘贴回调 */
1598
+ onDropFiles: (files: File[]) => void;
1599
+ /** 允许的文件类型,例如 'image/*' 或 '.pdf,.png' */
1600
+ accept?: string;
1601
+ /** 是否支持多选,默认为 true */
1602
+ multiple?: boolean;
1603
+ /** 提示标题,默认为 '点击或将文件拖拽至此处上传' */
1604
+ title?: ReactNode;
1605
+ /** 提示副标题,默认为 '支持拖拽文件或直接按 Ctrl+V 粘贴截图' */
1606
+ hint?: ReactNode;
1607
+ /** 自定义类名 */
1608
+ className?: string;
1609
+ /** 自定义样式 */
1610
+ style?: CSSProperties;
1611
+ }
1612
+ declare const FileDropZone: React__default.FC<FileDropZoneProps>;
1613
+
1614
+ interface CascadeLevel {
1615
+ id: string;
1616
+ title: string;
1617
+ content: ReactNode;
1618
+ }
1619
+ interface CascadeDrawerProps {
1620
+ /** 是否打开抽屉 */
1621
+ open: boolean;
1622
+ /** 关闭抽屉回调 */
1623
+ onClose: () => void;
1624
+ /** 初始根层级 */
1625
+ rootLevel: CascadeLevel;
1626
+ /** 抽屉宽度,默认为 440 */
1627
+ width?: number | string;
1628
+ /** 自定义类名 */
1629
+ className?: string;
1630
+ /** 自定义样式 */
1631
+ style?: CSSProperties;
1632
+ }
1633
+ declare const CascadeDrawer: React__default.FC<CascadeDrawerProps>;
1634
+
1635
+ interface DualRangeSliderProps {
1636
+ /** 最小值,默认为 0 */
1637
+ min?: number;
1638
+ /** 最大值,默认为 100 */
1639
+ max?: number;
1640
+ /** 步长,默认为 1 */
1641
+ step?: number;
1642
+ /** 当前区间值 [minVal, maxVal](受控) */
1643
+ value?: [number, number];
1644
+ /** 默认区间值 */
1645
+ defaultValue?: [number, number];
1646
+ /** 改变回调 */
1647
+ onChange?: (val: [number, number]) => void;
1648
+ /** 自定义类名 */
1649
+ className?: string;
1650
+ /** 自定义样式 */
1651
+ style?: CSSProperties;
1652
+ }
1653
+ declare const DualRangeSlider: React__default.FC<DualRangeSliderProps>;
1654
+
1655
+ interface FilterChipItem {
1656
+ id: string;
1657
+ label: string;
1658
+ value: string;
1659
+ }
1660
+ interface FilterChipsProps {
1661
+ /** 筛选胶囊列表 */
1662
+ chips: FilterChipItem[];
1663
+ /** 单项删除回调 */
1664
+ onRemove?: (id: string) => void;
1665
+ /** 全部清空回调 */
1666
+ onClearAll?: () => void;
1667
+ /** 清空按钮文案,默认为 '清空筛选' */
1668
+ clearText?: string;
1669
+ /** 自定义类名 */
1670
+ className?: string;
1671
+ /** 自定义样式 */
1672
+ style?: CSSProperties;
1673
+ }
1674
+ declare const FilterChips: React__default.FC<FilterChipsProps>;
1675
+
1676
+ interface AnnouncementBarProps {
1677
+ /** 横幅广播内容 */
1678
+ children: ReactNode;
1679
+ /** 是否支持点击关闭,默认为 true */
1680
+ closable?: boolean;
1681
+ /** 自定义渐变或背景样式 */
1682
+ background?: string;
1683
+ /** 关闭回调 */
1684
+ onClose?: () => void;
1685
+ /** 自定义类名 */
1686
+ className?: string;
1687
+ /** 自定义样式 */
1688
+ style?: CSSProperties;
1689
+ }
1690
+ declare const AnnouncementBar: React__default.FC<AnnouncementBarProps>;
1691
+
1692
+ interface JsonDiffViewerProps {
1693
+ /** 变更前原始 JSON 对象 */
1694
+ before: Record<string, any>;
1695
+ /** 变更后最新 JSON 对象 */
1696
+ after: Record<string, any>;
1697
+ /** 自定义类名 */
1698
+ className?: string;
1699
+ /** 自定义样式 */
1700
+ style?: CSSProperties;
1701
+ }
1702
+ declare const JsonDiffViewer: React__default.FC<JsonDiffViewerProps>;
1703
+
1704
+ export { type ActivityItem, ActivityLog, type ActivityLogProps, AnnouncementBar, type AnnouncementBarProps, AudioPlayer, type AudioPlayerProps, BadgeRibbon, type BadgeRibbonProps, BorderBeam, type BorderBeamColorStop, type BorderBeamProps, type Breakpoint, CascadeDrawer, type CascadeDrawerProps, type CascadeLevel, CodeSnippet, type CodeSnippetProps, CollapsibleBox as CollapseBox, type CollapseBoxButtonPosition, type CollapseBoxDirection, type CollapseBoxProps, Color, type ColorFormat, type ColorMode, ColorPicker, type ColorPickerProps, type ColorPresetItem, ContextMenu, type ContextMenuItem, type ContextMenuProps, CopyButton, type CopyButtonProps, CountUp, type CountUpProps, type CountUpRef, CountdownButton, type CountdownButtonProps, type CronPeriodType, CronPicker, type CronPickerProps, type CropResult, type CropShape, DebounceSelect, type DebounceSelectProps, type DiffColumn, DiffTable, type DiffTableProps, type DiffViewMode, DiffViewer, type DiffViewerProps, DisabledBox, type DisabledBoxProps, DragSortList, type DragSortListProps, DualRangeSlider, type DualRangeSliderProps, EnvBadge, type EnvBadgeProps, type EnvBuildInfo, type EnvPlacement, type EnvSwitchItem, type EnvType, FileDropZone, type FileDropZoneProps, type FileItem, FilePreviewer, type FilePreviewerProps, type FileType, type FilterChipItem, FilterChips, type FilterChipsProps, FlipCard, type FlipCardProps, type FlipDirection, type FlipTrigger, FloatingActionBar, type FloatingActionBarProps, type FloatingActionItem, Fullscreen, type FullscreenButtonPosition, type FullscreenMode, type FullscreenProps, type FullscreenRef, type FullscreenRenderProps, type Gap, GradientText, type GradientTextProps, GuidedTour, type GuidedTourProps, HoverCard, type HoverCardProps, type HsbColor, ImageCropper, type ImageCropperProps, type ImageCropperRef, InfiniteScrollList, type InfiniteScrollListProps, JsonDiffViewer, type JsonDiffViewerProps, JsonEditor, type JsonEditorProps, JsonTree, type JsonTreeProps, KanbanBoard, type KanbanBoardProps, type KanbanColumn, KeyValEditor, type KeyValEditorProps, type KeyValItem, Marquee, type MarqueeDirection, type MarqueeProps, Masonry, type MasonryClassNames, type MasonryItem, type MasonryProps, type MasonrySemanticDOM, type MasonryStyles, MetricCard, type MetricCardProps, MiniSparkline, type MiniSparklineProps, NumberStepper, type NumberStepperProps, NumericRangeInput, type NumericRangeInputProps, type PasswordRule, PasswordStrength, type PasswordStrengthLevel, type PasswordStrengthProps, PdfViewer, type PdfViewerProps, type PhotoItem, PhotoViewer, type PhotoViewerProps, type ProgressSegment, QrCodeCard, type QrCodeCardProps, type QrCodeStatus, QuickDateRange, type QuickDateRangeProps, type RangeShortcut, type RangeValue, type RgbColor, type RibbonPlacement, ScrollTracker, type ScrollTrackerProps, SegmentedProgress, type SegmentedProgressProps, type SelectOption, type SelectValue, SensitiveMask, type SensitiveMaskProps, type SensitiveType, ShimmerSkeleton, type ShimmerSkeletonProps, type ShortcutItem, type SkeletonType, CustomSplitter as Splitter, type SplitterCollapsible, type SplitterOrientation, type SplitterPanelProps, type SplitterProps, type SplitterSize, SpotlightCard, type SpotlightCardProps, StatusTimeline, type StatusTimelineItem, type StatusTimelineProps, StickyHeader, type StickyHeaderProps, TagInput, type TagInputProps, TextEllipsis, type TextEllipsisExpandConfig, type TextEllipsisProps, TiltCard, type TiltCardProps, type TimelineOperator, type TimelineStatus, type TourPlacement, type TourStep, type TreeFilterNode, TreeFilterPanel, type TreeFilterPanelProps, TreeTransfer, type TreeTransferNode, type TreeTransferProps, TrendIndicator, type TrendIndicatorProps, VideoPlayer, type VideoPlayerProps, VirtualList, type VirtualListProps, Watermark, type WatermarkProps, evaluatePasswordStrength, generateColor, inferFileType, maskSensitiveText };