@mdigital_ui/ui 0.1.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/README.md +296 -0
- package/dist/accordion/index.js +5 -0
- package/dist/accordion/index.js.map +1 -0
- package/dist/badge/index.js +5 -0
- package/dist/badge/index.js.map +1 -0
- package/dist/button/index.js +6 -0
- package/dist/button/index.js.map +1 -0
- package/dist/card/index.js +4 -0
- package/dist/card/index.js.map +1 -0
- package/dist/carousel/index.js +3 -0
- package/dist/carousel/index.js.map +1 -0
- package/dist/cascader/index.js +4 -0
- package/dist/cascader/index.js.map +1 -0
- package/dist/chart/index.js +4 -0
- package/dist/chart/index.js.map +1 -0
- package/dist/checkbox/index.js +5 -0
- package/dist/checkbox/index.js.map +1 -0
- package/dist/checkbox-group/index.js +4 -0
- package/dist/checkbox-group/index.js.map +1 -0
- package/dist/chunk-2JGAYDZR.js +181 -0
- package/dist/chunk-2JGAYDZR.js.map +1 -0
- package/dist/chunk-3PFA3YG6.js +228 -0
- package/dist/chunk-3PFA3YG6.js.map +1 -0
- package/dist/chunk-4OMLQCUV.js +96 -0
- package/dist/chunk-4OMLQCUV.js.map +1 -0
- package/dist/chunk-4P5EMRFI.js +298 -0
- package/dist/chunk-4P5EMRFI.js.map +1 -0
- package/dist/chunk-5UEWVFF6.js +212 -0
- package/dist/chunk-5UEWVFF6.js.map +1 -0
- package/dist/chunk-5VCGW53O.js +332 -0
- package/dist/chunk-5VCGW53O.js.map +1 -0
- package/dist/chunk-75XESYGN.js +49 -0
- package/dist/chunk-75XESYGN.js.map +1 -0
- package/dist/chunk-7AEGBABZ.js +1102 -0
- package/dist/chunk-7AEGBABZ.js.map +1 -0
- package/dist/chunk-AOITJRSV.js +134 -0
- package/dist/chunk-AOITJRSV.js.map +1 -0
- package/dist/chunk-AWPKZYHT.js +152 -0
- package/dist/chunk-AWPKZYHT.js.map +1 -0
- package/dist/chunk-BNILRB4T.js +37 -0
- package/dist/chunk-BNILRB4T.js.map +1 -0
- package/dist/chunk-BP434VYV.js +448 -0
- package/dist/chunk-BP434VYV.js.map +1 -0
- package/dist/chunk-C7SXY3ZV.js +65 -0
- package/dist/chunk-C7SXY3ZV.js.map +1 -0
- package/dist/chunk-CLLQDCDR.js +560 -0
- package/dist/chunk-CLLQDCDR.js.map +1 -0
- package/dist/chunk-CWHFK7ZC.js +128 -0
- package/dist/chunk-CWHFK7ZC.js.map +1 -0
- package/dist/chunk-D3JWPGCA.js +123 -0
- package/dist/chunk-D3JWPGCA.js.map +1 -0
- package/dist/chunk-DOKTHDG3.js +55 -0
- package/dist/chunk-DOKTHDG3.js.map +1 -0
- package/dist/chunk-DPOSWW22.js +126 -0
- package/dist/chunk-DPOSWW22.js.map +1 -0
- package/dist/chunk-E2CYDDYC.js +39 -0
- package/dist/chunk-E2CYDDYC.js.map +1 -0
- package/dist/chunk-EYTOKUBM.js +401 -0
- package/dist/chunk-EYTOKUBM.js.map +1 -0
- package/dist/chunk-FGWSUPVW.js +356 -0
- package/dist/chunk-FGWSUPVW.js.map +1 -0
- package/dist/chunk-FPOXTCYV.js +166 -0
- package/dist/chunk-FPOXTCYV.js.map +1 -0
- package/dist/chunk-FTJOSVTY.js +104 -0
- package/dist/chunk-FTJOSVTY.js.map +1 -0
- package/dist/chunk-FYHQDFKE.js +164 -0
- package/dist/chunk-FYHQDFKE.js.map +1 -0
- package/dist/chunk-H2HIBD5Y.js +158 -0
- package/dist/chunk-H2HIBD5Y.js.map +1 -0
- package/dist/chunk-J3G5WWGR.js +53 -0
- package/dist/chunk-J3G5WWGR.js.map +1 -0
- package/dist/chunk-JZCHZ4B3.js +487 -0
- package/dist/chunk-JZCHZ4B3.js.map +1 -0
- package/dist/chunk-KBCBVH7B.js +51 -0
- package/dist/chunk-KBCBVH7B.js.map +1 -0
- package/dist/chunk-KNQ7UQ2W.js +143 -0
- package/dist/chunk-KNQ7UQ2W.js.map +1 -0
- package/dist/chunk-KTBPIEP2.js +102 -0
- package/dist/chunk-KTBPIEP2.js.map +1 -0
- package/dist/chunk-L3SP7GHC.js +1023 -0
- package/dist/chunk-L3SP7GHC.js.map +1 -0
- package/dist/chunk-LBJG2UWT.js +100 -0
- package/dist/chunk-LBJG2UWT.js.map +1 -0
- package/dist/chunk-MLDX3Z67.js +470 -0
- package/dist/chunk-MLDX3Z67.js.map +1 -0
- package/dist/chunk-NNSS366W.js +331 -0
- package/dist/chunk-NNSS366W.js.map +1 -0
- package/dist/chunk-OQANRZPV.js +197 -0
- package/dist/chunk-OQANRZPV.js.map +1 -0
- package/dist/chunk-OW5A5IIF.js +175 -0
- package/dist/chunk-OW5A5IIF.js.map +1 -0
- package/dist/chunk-R225A5II.js +187 -0
- package/dist/chunk-R225A5II.js.map +1 -0
- package/dist/chunk-ROR4E6IE.js +119 -0
- package/dist/chunk-ROR4E6IE.js.map +1 -0
- package/dist/chunk-RPAQAZTI.js +54 -0
- package/dist/chunk-RPAQAZTI.js.map +1 -0
- package/dist/chunk-RQBXZKTH.js +452 -0
- package/dist/chunk-RQBXZKTH.js.map +1 -0
- package/dist/chunk-S5XJXU52.js +178 -0
- package/dist/chunk-S5XJXU52.js.map +1 -0
- package/dist/chunk-SAVE5ACL.js +324 -0
- package/dist/chunk-SAVE5ACL.js.map +1 -0
- package/dist/chunk-SERJ3TZE.js +640 -0
- package/dist/chunk-SERJ3TZE.js.map +1 -0
- package/dist/chunk-SK5ECBBK.js +175 -0
- package/dist/chunk-SK5ECBBK.js.map +1 -0
- package/dist/chunk-SOV4PE3P.js +218 -0
- package/dist/chunk-SOV4PE3P.js.map +1 -0
- package/dist/chunk-W7BQYIXF.js +687 -0
- package/dist/chunk-W7BQYIXF.js.map +1 -0
- package/dist/chunk-XMAH5PDW.js +59 -0
- package/dist/chunk-XMAH5PDW.js.map +1 -0
- package/dist/chunk-XOBGEMQY.js +94 -0
- package/dist/chunk-XOBGEMQY.js.map +1 -0
- package/dist/chunk-YNNAOXU5.js +57 -0
- package/dist/chunk-YNNAOXU5.js.map +1 -0
- package/dist/chunk-YZVSDRJD.js +253 -0
- package/dist/chunk-YZVSDRJD.js.map +1 -0
- package/dist/collapse/index.js +4 -0
- package/dist/collapse/index.js.map +1 -0
- package/dist/command/index.js +5 -0
- package/dist/command/index.js.map +1 -0
- package/dist/date-picker/index.js +5 -0
- package/dist/date-picker/index.js.map +1 -0
- package/dist/descriptions/index.js +4 -0
- package/dist/descriptions/index.js.map +1 -0
- package/dist/drawer/index.js +4 -0
- package/dist/drawer/index.js.map +1 -0
- package/dist/dropdown/index.js +5 -0
- package/dist/dropdown/index.js.map +1 -0
- package/dist/empty/index.js +4 -0
- package/dist/empty/index.js.map +1 -0
- package/dist/fetching-overlay/index.js +5 -0
- package/dist/fetching-overlay/index.js.map +1 -0
- package/dist/image/index.js +4 -0
- package/dist/image/index.js.map +1 -0
- package/dist/index.d.ts +2672 -0
- package/dist/index.js +976 -0
- package/dist/index.js.map +1 -0
- package/dist/input/index.js +5 -0
- package/dist/input/index.js.map +1 -0
- package/dist/input-group/index.js +4 -0
- package/dist/input-group/index.js.map +1 -0
- package/dist/input-otp/index.js +4 -0
- package/dist/input-otp/index.js.map +1 -0
- package/dist/input-password/index.js +6 -0
- package/dist/input-password/index.js.map +1 -0
- package/dist/kbd/index.js +4 -0
- package/dist/kbd/index.js.map +1 -0
- package/dist/modal/index.js +4 -0
- package/dist/modal/index.js.map +1 -0
- package/dist/multi-select/index.js +5 -0
- package/dist/multi-select/index.js.map +1 -0
- package/dist/notification/index.js +4 -0
- package/dist/notification/index.js.map +1 -0
- package/dist/pagination/index.js +4 -0
- package/dist/pagination/index.js.map +1 -0
- package/dist/popover/index.js +4 -0
- package/dist/popover/index.js.map +1 -0
- package/dist/progress/index.js +4 -0
- package/dist/progress/index.js.map +1 -0
- package/dist/radio/index.js +4 -0
- package/dist/radio/index.js.map +1 -0
- package/dist/radio-group/index.js +4 -0
- package/dist/radio-group/index.js.map +1 -0
- package/dist/rating/index.js +4 -0
- package/dist/rating/index.js.map +1 -0
- package/dist/ribbon/index.js +4 -0
- package/dist/ribbon/index.js.map +1 -0
- package/dist/select/index.js +6 -0
- package/dist/select/index.js.map +1 -0
- package/dist/skeleton/index.js +4 -0
- package/dist/skeleton/index.js.map +1 -0
- package/dist/slider/index.js +4 -0
- package/dist/slider/index.js.map +1 -0
- package/dist/spinner/index.js +4 -0
- package/dist/spinner/index.js.map +1 -0
- package/dist/stepper/index.js +4 -0
- package/dist/stepper/index.js.map +1 -0
- package/dist/styles/base.css +161 -0
- package/dist/styles/global.css +633 -0
- package/dist/styles/themes/dark.css +84 -0
- package/dist/styles/themes/light.css +84 -0
- package/dist/switch/index.js +4 -0
- package/dist/switch/index.js.map +1 -0
- package/dist/table/index.js +12 -0
- package/dist/table/index.js.map +1 -0
- package/dist/tabs/index.js +5 -0
- package/dist/tabs/index.js.map +1 -0
- package/dist/textarea/index.js +4 -0
- package/dist/textarea/index.js.map +1 -0
- package/dist/toggle/index.js +4 -0
- package/dist/toggle/index.js.map +1 -0
- package/dist/toggle-group/index.js +4 -0
- package/dist/toggle-group/index.js.map +1 -0
- package/dist/tooltip/index.js +4 -0
- package/dist/tooltip/index.js.map +1 -0
- package/dist/transfer/index.js +6 -0
- package/dist/transfer/index.js.map +1 -0
- package/dist/tree/index.js +4 -0
- package/dist/tree/index.js.map +1 -0
- package/dist/tree-select/index.js +6 -0
- package/dist/tree-select/index.js.map +1 -0
- package/package.json +107 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,2672 @@
|
|
|
1
|
+
import { ClassValue } from 'clsx';
|
|
2
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
3
|
+
import { VariantProps } from 'class-variance-authority';
|
|
4
|
+
import * as React$1 from 'react';
|
|
5
|
+
import React__default, { ReactNode, FC } from 'react';
|
|
6
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
7
|
+
import { SwiperProps } from 'swiper/react';
|
|
8
|
+
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
9
|
+
import { ColumnDef, Row } from '@tanstack/react-table';
|
|
10
|
+
import { Command as Command$1 } from 'cmdk';
|
|
11
|
+
import * as vaul from 'vaul';
|
|
12
|
+
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
* Merge class names with Tailwind CSS conflict resolution
|
|
16
|
+
* Combines clsx for conditional classes with tailwind-merge for deduplication
|
|
17
|
+
*/
|
|
18
|
+
declare function cn(...inputs: ClassValue[]): string;
|
|
19
|
+
/**
|
|
20
|
+
* Shared icon sizes for consistent sizing across components
|
|
21
|
+
* Used in Button, Input, Checkbox, Select, MultiSelect, DatePicker, TimePicker, etc.
|
|
22
|
+
*/
|
|
23
|
+
declare const iconSizes: {
|
|
24
|
+
readonly xs: "h-3 w-3";
|
|
25
|
+
readonly sm: "h-3.5 w-3.5";
|
|
26
|
+
readonly md: "h-4 w-4";
|
|
27
|
+
readonly lg: "h-5 w-5";
|
|
28
|
+
readonly xl: "h-6 w-6";
|
|
29
|
+
};
|
|
30
|
+
/**
|
|
31
|
+
* Validation status types for form components
|
|
32
|
+
*/
|
|
33
|
+
type ValidationStatus = 'default' | 'error' | 'warning' | 'info' | 'success';
|
|
34
|
+
/**
|
|
35
|
+
* Status message props interface
|
|
36
|
+
*/
|
|
37
|
+
interface StatusMessages {
|
|
38
|
+
error?: string | boolean;
|
|
39
|
+
warning?: string | boolean;
|
|
40
|
+
info?: string | boolean;
|
|
41
|
+
success?: string | boolean;
|
|
42
|
+
helperText?: string;
|
|
43
|
+
}
|
|
44
|
+
/**
|
|
45
|
+
* Resolves validation status and message from status props
|
|
46
|
+
* Used in Input, Textarea, Select, MultiSelect, DatePicker, TimePicker, etc.
|
|
47
|
+
*
|
|
48
|
+
* @param messages - Object containing possible status messages
|
|
49
|
+
* @returns Object with resolved status and message
|
|
50
|
+
*
|
|
51
|
+
* @example
|
|
52
|
+
* const { status, message } = getValidationStatus({ error: "Invalid email", helperText: "Enter your email" });
|
|
53
|
+
* // Returns: { status: "error", message: "Invalid email" }
|
|
54
|
+
*/
|
|
55
|
+
declare function getValidationStatus(messages: StatusMessages): {
|
|
56
|
+
status: ValidationStatus;
|
|
57
|
+
message?: string | boolean;
|
|
58
|
+
};
|
|
59
|
+
|
|
60
|
+
/**
|
|
61
|
+
* Shared TypeScript type definitions for the UI library
|
|
62
|
+
*/
|
|
63
|
+
type ComponentSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
64
|
+
type ButtonColor$1 = 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
65
|
+
type ComponentColor = 'default' | 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
66
|
+
type ComponentVariant = 'solid' | 'outline' | 'ghost';
|
|
67
|
+
type ComponentVariantExtended = 'solid' | 'outline' | 'dashed' | 'link' | 'ghost';
|
|
68
|
+
type ComponentVariantInput = 'outline' | 'filled' | 'underline';
|
|
69
|
+
interface BaseOption {
|
|
70
|
+
label: string;
|
|
71
|
+
value: string | number;
|
|
72
|
+
disabled?: boolean;
|
|
73
|
+
}
|
|
74
|
+
interface ValidationMessages {
|
|
75
|
+
error?: string;
|
|
76
|
+
warning?: string;
|
|
77
|
+
info?: string;
|
|
78
|
+
success?: string;
|
|
79
|
+
helperText?: string;
|
|
80
|
+
}
|
|
81
|
+
interface LoadingProps {
|
|
82
|
+
loading?: boolean;
|
|
83
|
+
loadingText?: string;
|
|
84
|
+
}
|
|
85
|
+
interface DisableableProps {
|
|
86
|
+
disabled?: boolean;
|
|
87
|
+
}
|
|
88
|
+
interface RequiredProps {
|
|
89
|
+
required?: boolean;
|
|
90
|
+
}
|
|
91
|
+
interface FullWidthProps {
|
|
92
|
+
fullWidth?: boolean;
|
|
93
|
+
}
|
|
94
|
+
interface IconProps {
|
|
95
|
+
leftIcon?: React.ReactNode;
|
|
96
|
+
rightIcon?: React.ReactNode;
|
|
97
|
+
}
|
|
98
|
+
type MessagePosition = 'top' | 'bottom';
|
|
99
|
+
|
|
100
|
+
/**
|
|
101
|
+
* Color palette for component variants
|
|
102
|
+
* Maps to Tailwind CSS v4 theme variables (--color-primary, --color-secondary, etc.)
|
|
103
|
+
*/
|
|
104
|
+
declare const componentColors: readonly ["default", "primary", "secondary", "accent", "success", "error", "warning", "info"];
|
|
105
|
+
declare const buttonColors: readonly ["primary", "secondary", "accent", "success", "error", "warning", "info"];
|
|
106
|
+
/**
|
|
107
|
+
* Generates compound variants for default style
|
|
108
|
+
* Used by: Badge, Toast, and other components
|
|
109
|
+
*
|
|
110
|
+
* @param colors - Array of color names to generate variants for
|
|
111
|
+
* @returns Array of compound variant objects for cva
|
|
112
|
+
*/
|
|
113
|
+
declare function createDefaultColorVariants(colors: readonly string[]): {
|
|
114
|
+
variant: "default";
|
|
115
|
+
color: ComponentColor | ButtonColor$1;
|
|
116
|
+
class: string;
|
|
117
|
+
}[];
|
|
118
|
+
/**
|
|
119
|
+
* Generates compound variants for solid color style
|
|
120
|
+
* Used by: Button, Badge, Accordion, Toast
|
|
121
|
+
*
|
|
122
|
+
* @param colors - Array of color names to generate variants for
|
|
123
|
+
* @returns Array of compound variant objects for cva
|
|
124
|
+
*/
|
|
125
|
+
declare function createSolidColorVariants(colors: readonly string[]): {
|
|
126
|
+
variant: "solid";
|
|
127
|
+
color: ComponentColor | ButtonColor$1;
|
|
128
|
+
class: string;
|
|
129
|
+
}[];
|
|
130
|
+
/**
|
|
131
|
+
* Generates compound variants for outline color style
|
|
132
|
+
* Used by: Button, Badge, Accordion
|
|
133
|
+
*
|
|
134
|
+
* @param colors - Array of color names to generate variants for
|
|
135
|
+
* @returns Array of compound variant objects for cva
|
|
136
|
+
*/
|
|
137
|
+
declare function createOutlineColorVariants(colors: readonly string[]): {
|
|
138
|
+
variant: "outline";
|
|
139
|
+
color: ComponentColor | ButtonColor$1;
|
|
140
|
+
class: string;
|
|
141
|
+
}[];
|
|
142
|
+
/**
|
|
143
|
+
* Generates compound variants for soft/subtle color style
|
|
144
|
+
* Used by: Badge, Accordion, Toast
|
|
145
|
+
*
|
|
146
|
+
* @param colors - Array of color names to generate variants for
|
|
147
|
+
* @returns Array of compound variant objects for cva
|
|
148
|
+
*/
|
|
149
|
+
declare function createSoftColorVariants(colors: readonly string[]): {
|
|
150
|
+
variant: "soft";
|
|
151
|
+
color: ComponentColor | ButtonColor$1;
|
|
152
|
+
class: string;
|
|
153
|
+
}[];
|
|
154
|
+
/**
|
|
155
|
+
* Generates compound variants for dashed border color style
|
|
156
|
+
* Used by: Button
|
|
157
|
+
*
|
|
158
|
+
* @param colors - Array of color names to generate variants for
|
|
159
|
+
* @returns Array of compound variant objects for cva
|
|
160
|
+
*/
|
|
161
|
+
declare function createDashedColorVariants(colors: readonly string[]): {
|
|
162
|
+
variant: "dashed";
|
|
163
|
+
color: ComponentColor | ButtonColor$1;
|
|
164
|
+
class: string;
|
|
165
|
+
}[];
|
|
166
|
+
/**
|
|
167
|
+
* Generates compound variants for link/text-only color style
|
|
168
|
+
* Used by: Button, Breadcrumbs
|
|
169
|
+
*
|
|
170
|
+
* @param colors - Array of color names to generate variants for
|
|
171
|
+
* @returns Array of compound variant objects for cva
|
|
172
|
+
*/
|
|
173
|
+
declare function createLinkColorVariants(colors: readonly string[]): {
|
|
174
|
+
variant: "link";
|
|
175
|
+
color: ComponentColor | ButtonColor$1;
|
|
176
|
+
class: string;
|
|
177
|
+
}[];
|
|
178
|
+
/**
|
|
179
|
+
* Generates compound variants for ghost (borderless) color style
|
|
180
|
+
* Used by: Button, Table
|
|
181
|
+
*
|
|
182
|
+
* @param colors - Array of color names to generate variants for
|
|
183
|
+
* @returns Array of compound variant objects for cva
|
|
184
|
+
*/
|
|
185
|
+
declare function createGhostColorVariants(colors: readonly string[]): {
|
|
186
|
+
variant: "ghost";
|
|
187
|
+
color: ComponentColor | ButtonColor$1;
|
|
188
|
+
class: string;
|
|
189
|
+
}[];
|
|
190
|
+
/**
|
|
191
|
+
* Complete color variant generator for components with multiple style variants
|
|
192
|
+
* Combines all color variant generators into a single array
|
|
193
|
+
*
|
|
194
|
+
* @example
|
|
195
|
+
* const buttonVariants = cva("base-classes", {
|
|
196
|
+
* variants: {
|
|
197
|
+
* variant: { solid: "", outline: "", ghost: "" },
|
|
198
|
+
* color: { primary: "", secondary: "", ... }
|
|
199
|
+
* },
|
|
200
|
+
* compoundVariants: createAllColorVariants(buttonColors, ['solid', 'outline', 'ghost'])
|
|
201
|
+
* })
|
|
202
|
+
*/
|
|
203
|
+
declare function createAllColorVariants(colors: readonly string[], variants: Array<'default' | 'solid' | 'outline' | 'soft' | 'dashed' | 'link' | 'ghost'>): any;
|
|
204
|
+
/**
|
|
205
|
+
* Icon color variants mapped to component colors
|
|
206
|
+
* Used by: Checkbox, Radio, and other components with colored icons
|
|
207
|
+
*
|
|
208
|
+
* Maps to Tailwind utilities: text-primary, text-secondary, etc.
|
|
209
|
+
* Generated from theme variables: --color-primary, --color-secondary, etc.
|
|
210
|
+
*/
|
|
211
|
+
declare const iconColorClasses: {
|
|
212
|
+
readonly primary: "text-primary";
|
|
213
|
+
readonly secondary: "text-secondary";
|
|
214
|
+
readonly accent: "text-accent";
|
|
215
|
+
readonly success: "text-success";
|
|
216
|
+
readonly error: "text-error";
|
|
217
|
+
readonly warning: "text-warning";
|
|
218
|
+
readonly info: "text-info";
|
|
219
|
+
};
|
|
220
|
+
/**
|
|
221
|
+
* Helper to get icon color class for a given color
|
|
222
|
+
*/
|
|
223
|
+
declare function getIconColorClass(color: ButtonColor$1): string;
|
|
224
|
+
/**
|
|
225
|
+
* Text-only color variants (no background)
|
|
226
|
+
* Used by: Breadcrumbs, Text components, Labels
|
|
227
|
+
*/
|
|
228
|
+
declare const textColorVariants: (props?: ({
|
|
229
|
+
color?: "default" | "error" | "warning" | "info" | "success" | "primary" | "secondary" | "accent" | null | undefined;
|
|
230
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
231
|
+
type TextColorVariants = VariantProps<typeof textColorVariants>;
|
|
232
|
+
/**
|
|
233
|
+
* Standard component size scale (4 sizes)
|
|
234
|
+
* Used by: Button, Input, Select, Textarea, most form components
|
|
235
|
+
*/
|
|
236
|
+
declare const componentSizeVariants: {
|
|
237
|
+
readonly sm: "sm";
|
|
238
|
+
readonly md: "md";
|
|
239
|
+
readonly lg: "lg";
|
|
240
|
+
readonly xl: "xl";
|
|
241
|
+
};
|
|
242
|
+
/**
|
|
243
|
+
* Extended component size scale (5 sizes)
|
|
244
|
+
* Used by: Components that need extra small sizing
|
|
245
|
+
*/
|
|
246
|
+
declare const extendedComponentSizeVariants: {
|
|
247
|
+
readonly xs: "xs";
|
|
248
|
+
readonly sm: "sm";
|
|
249
|
+
readonly md: "md";
|
|
250
|
+
readonly lg: "lg";
|
|
251
|
+
readonly xl: "xl";
|
|
252
|
+
};
|
|
253
|
+
/**
|
|
254
|
+
* Common spacing values for consistent gaps, padding, and margins
|
|
255
|
+
* Maps to Tailwind spacing scale
|
|
256
|
+
*
|
|
257
|
+
* Note: These are standard Tailwind values. For component-specific spacing,
|
|
258
|
+
* use CSS custom properties defined in index.css (e.g., --button-padding-x-sm)
|
|
259
|
+
*/
|
|
260
|
+
declare const commonSpacing: {
|
|
261
|
+
readonly '0.5': "0.125rem";
|
|
262
|
+
readonly '1': "0.25rem";
|
|
263
|
+
readonly '1.5': "0.375rem";
|
|
264
|
+
readonly '2': "0.5rem";
|
|
265
|
+
readonly '2.5': "0.625rem";
|
|
266
|
+
readonly '3': "0.75rem";
|
|
267
|
+
readonly '4': "1rem";
|
|
268
|
+
readonly '5': "1.25rem";
|
|
269
|
+
readonly '6': "1.5rem";
|
|
270
|
+
readonly '8': "2rem";
|
|
271
|
+
};
|
|
272
|
+
/**
|
|
273
|
+
* Accordion color style generator
|
|
274
|
+
* Generates variant, color, and hover state combinations
|
|
275
|
+
*
|
|
276
|
+
* @param color - Component color
|
|
277
|
+
* @param variant - Style variant (default, solid, soft)
|
|
278
|
+
* @returns Combined class string
|
|
279
|
+
*/
|
|
280
|
+
declare function getAccordionColorClass(color: ComponentColor, variant: 'default' | 'solid' | 'soft'): string;
|
|
281
|
+
/**
|
|
282
|
+
* Checkbox/Radio indeterminate/checked state color generator
|
|
283
|
+
* Generates background color for checked state with proper contrast
|
|
284
|
+
*
|
|
285
|
+
* @param color - Component color
|
|
286
|
+
* @returns Background class string
|
|
287
|
+
*/
|
|
288
|
+
declare function getCheckboxColorClass(color: ButtonColor$1): string;
|
|
289
|
+
|
|
290
|
+
type AccordionVariant = 'default' | 'solid' | 'soft';
|
|
291
|
+
type AccordionSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
292
|
+
interface AccordionItem {
|
|
293
|
+
/**
|
|
294
|
+
* Unique key for the accordion item
|
|
295
|
+
*/
|
|
296
|
+
key: string;
|
|
297
|
+
/**
|
|
298
|
+
* Title/header content
|
|
299
|
+
*/
|
|
300
|
+
title: React.ReactNode;
|
|
301
|
+
/**
|
|
302
|
+
* Panel content
|
|
303
|
+
*/
|
|
304
|
+
content: React.ReactNode;
|
|
305
|
+
/**
|
|
306
|
+
* Whether the item is disabled
|
|
307
|
+
*/
|
|
308
|
+
disabled?: boolean;
|
|
309
|
+
/**
|
|
310
|
+
* Custom icon for the item
|
|
311
|
+
*/
|
|
312
|
+
icon?: React.ReactNode;
|
|
313
|
+
}
|
|
314
|
+
interface AccordionProps {
|
|
315
|
+
/**
|
|
316
|
+
* Accordion items to display
|
|
317
|
+
*/
|
|
318
|
+
items: AccordionItem[];
|
|
319
|
+
/**
|
|
320
|
+
* Theme color
|
|
321
|
+
*/
|
|
322
|
+
color?: ComponentColor;
|
|
323
|
+
/**
|
|
324
|
+
* Size variant (accordion only supports xs, sm, md, lg)
|
|
325
|
+
*/
|
|
326
|
+
size?: AccordionSize;
|
|
327
|
+
/**
|
|
328
|
+
* Visual style variant
|
|
329
|
+
*/
|
|
330
|
+
variant?: AccordionVariant;
|
|
331
|
+
/**
|
|
332
|
+
* Default active keys (uncontrolled)
|
|
333
|
+
*/
|
|
334
|
+
defaultActiveKey?: string | string[];
|
|
335
|
+
/**
|
|
336
|
+
* Active keys (controlled)
|
|
337
|
+
*/
|
|
338
|
+
activeKey?: string | string[];
|
|
339
|
+
/**
|
|
340
|
+
* Callback when active keys change
|
|
341
|
+
*/
|
|
342
|
+
onChange?: (activeKey: string | string[]) => void;
|
|
343
|
+
/**
|
|
344
|
+
* Allow multiple panels to be open simultaneously
|
|
345
|
+
*/
|
|
346
|
+
multiple?: boolean;
|
|
347
|
+
/**
|
|
348
|
+
* Additional CSS class
|
|
349
|
+
*/
|
|
350
|
+
className?: string;
|
|
351
|
+
}
|
|
352
|
+
|
|
353
|
+
declare const Accordion: React__default.NamedExoticComponent<AccordionProps>;
|
|
354
|
+
|
|
355
|
+
type BadgeVariant = 'default' | 'solid' | 'outline' | 'soft';
|
|
356
|
+
type BadgeColor = ComponentColor;
|
|
357
|
+
type BadgeSize = Exclude<ComponentSize, 'xl'>;
|
|
358
|
+
interface BadgeProps {
|
|
359
|
+
children?: React.ReactNode;
|
|
360
|
+
variant?: BadgeVariant;
|
|
361
|
+
color?: BadgeColor;
|
|
362
|
+
size?: BadgeSize;
|
|
363
|
+
dot?: boolean;
|
|
364
|
+
count?: number;
|
|
365
|
+
showZero?: boolean;
|
|
366
|
+
className?: string;
|
|
367
|
+
}
|
|
368
|
+
|
|
369
|
+
declare const Badge: React__default.NamedExoticComponent<BadgeProps>;
|
|
370
|
+
|
|
371
|
+
type BreadcrumbsColor = 'default' | 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
372
|
+
type BreadcrumbsSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
373
|
+
interface BreadcrumbItemData {
|
|
374
|
+
/**
|
|
375
|
+
* Label to display for the breadcrumb item
|
|
376
|
+
*/
|
|
377
|
+
label: string;
|
|
378
|
+
/**
|
|
379
|
+
* URL for the breadcrumb link
|
|
380
|
+
*/
|
|
381
|
+
href?: string;
|
|
382
|
+
/**
|
|
383
|
+
* Click handler (used instead of href for custom navigation)
|
|
384
|
+
*/
|
|
385
|
+
onClick?: () => void;
|
|
386
|
+
/**
|
|
387
|
+
* Icon to display before the label
|
|
388
|
+
*/
|
|
389
|
+
leftIcon?: ReactNode;
|
|
390
|
+
/**
|
|
391
|
+
* Icon to display after the label
|
|
392
|
+
*/
|
|
393
|
+
rightIcon?: ReactNode;
|
|
394
|
+
/**
|
|
395
|
+
* Whether this item should be shown as an ellipsis dropdown
|
|
396
|
+
*/
|
|
397
|
+
ellipsis?: boolean;
|
|
398
|
+
/**
|
|
399
|
+
* Orientation of ellipsis icon
|
|
400
|
+
*/
|
|
401
|
+
ellipsisOrientation?: 'horizontal' | 'vertical';
|
|
402
|
+
/**
|
|
403
|
+
* Items to show in the ellipsis dropdown
|
|
404
|
+
*/
|
|
405
|
+
ellipsisItems?: Array<{
|
|
406
|
+
label: string;
|
|
407
|
+
href?: string;
|
|
408
|
+
onClick?: () => void;
|
|
409
|
+
}>;
|
|
410
|
+
}
|
|
411
|
+
interface BreadcrumbProps {
|
|
412
|
+
/**
|
|
413
|
+
* Breadcrumb items to render
|
|
414
|
+
*/
|
|
415
|
+
items?: BreadcrumbItemData[];
|
|
416
|
+
/**
|
|
417
|
+
* Manual children (alternative to items prop)
|
|
418
|
+
*/
|
|
419
|
+
children?: ReactNode;
|
|
420
|
+
/**
|
|
421
|
+
* Theme color
|
|
422
|
+
*/
|
|
423
|
+
color?: BreadcrumbsColor;
|
|
424
|
+
/**
|
|
425
|
+
* Size variant
|
|
426
|
+
*/
|
|
427
|
+
size?: BreadcrumbsSize;
|
|
428
|
+
/**
|
|
429
|
+
* Custom separator element
|
|
430
|
+
*/
|
|
431
|
+
separator?: ReactNode;
|
|
432
|
+
/**
|
|
433
|
+
* Additional CSS class
|
|
434
|
+
*/
|
|
435
|
+
className?: string;
|
|
436
|
+
}
|
|
437
|
+
|
|
438
|
+
declare const Breadcrumb: React__default.NamedExoticComponent<BreadcrumbProps>;
|
|
439
|
+
|
|
440
|
+
type ButtonVariant = ComponentVariantExtended;
|
|
441
|
+
type ButtonColor = ButtonColor$1;
|
|
442
|
+
type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
443
|
+
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
444
|
+
variant?: ButtonVariant;
|
|
445
|
+
color?: ButtonColor;
|
|
446
|
+
size?: ButtonSize;
|
|
447
|
+
loading?: boolean;
|
|
448
|
+
loadingText?: string;
|
|
449
|
+
leftIcon?: React.ReactNode;
|
|
450
|
+
rightIcon?: React.ReactNode;
|
|
451
|
+
fullWidth?: boolean;
|
|
452
|
+
ref?: React.Ref<HTMLButtonElement>;
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
declare const Button: React__default.NamedExoticComponent<ButtonProps>;
|
|
456
|
+
|
|
457
|
+
interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
458
|
+
/**
|
|
459
|
+
* Children elements (typically Button components)
|
|
460
|
+
*/
|
|
461
|
+
children: React.ReactNode;
|
|
462
|
+
/**
|
|
463
|
+
* Display buttons vertically instead of horizontally
|
|
464
|
+
*/
|
|
465
|
+
vertical?: boolean;
|
|
466
|
+
/**
|
|
467
|
+
* Add spacing between buttons
|
|
468
|
+
*/
|
|
469
|
+
spacing?: boolean;
|
|
470
|
+
/**
|
|
471
|
+
* Make buttons take full width
|
|
472
|
+
*/
|
|
473
|
+
fullWidth?: boolean;
|
|
474
|
+
/**
|
|
475
|
+
* Additional CSS class
|
|
476
|
+
*/
|
|
477
|
+
className?: string;
|
|
478
|
+
/**
|
|
479
|
+
* Reference to the div element
|
|
480
|
+
*/
|
|
481
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
482
|
+
}
|
|
483
|
+
|
|
484
|
+
declare const ButtonGroup: React__default.NamedExoticComponent<ButtonGroupProps>;
|
|
485
|
+
|
|
486
|
+
declare const cardVariants: (props?: ({
|
|
487
|
+
variant?: "default" | "ghost" | "destructive" | null | undefined;
|
|
488
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
489
|
+
interface CardProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants> {
|
|
490
|
+
ref?: React$1.Ref<HTMLDivElement>;
|
|
491
|
+
}
|
|
492
|
+
declare const Card: React$1.NamedExoticComponent<CardProps>;
|
|
493
|
+
|
|
494
|
+
interface CarouselProps extends SwiperProps {
|
|
495
|
+
withArrows?: boolean;
|
|
496
|
+
withPagination?: boolean;
|
|
497
|
+
children: React.ReactNode;
|
|
498
|
+
}
|
|
499
|
+
declare function Carousel({ withArrows, withPagination, children, loop, className, modules, ...props }: CarouselProps): react_jsx_runtime.JSX.Element;
|
|
500
|
+
|
|
501
|
+
type CascaderSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
502
|
+
type CascaderVariant = 'default' | 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
503
|
+
interface CascaderOption {
|
|
504
|
+
/**
|
|
505
|
+
* Display label for the option
|
|
506
|
+
*/
|
|
507
|
+
label: string;
|
|
508
|
+
/**
|
|
509
|
+
* Unique value for the option
|
|
510
|
+
*/
|
|
511
|
+
value: string;
|
|
512
|
+
/**
|
|
513
|
+
* Child options for nested cascading
|
|
514
|
+
*/
|
|
515
|
+
children?: CascaderOption[];
|
|
516
|
+
/**
|
|
517
|
+
* Whether the option is disabled
|
|
518
|
+
*/
|
|
519
|
+
disabled?: boolean;
|
|
520
|
+
}
|
|
521
|
+
interface CascaderProps {
|
|
522
|
+
/**
|
|
523
|
+
* Cascader options with nested structure
|
|
524
|
+
*/
|
|
525
|
+
options: CascaderOption[];
|
|
526
|
+
/**
|
|
527
|
+
* Current value (controlled) - single path or array of paths for multiple
|
|
528
|
+
*/
|
|
529
|
+
value?: string[] | string[][];
|
|
530
|
+
/**
|
|
531
|
+
* Default initial value (uncontrolled)
|
|
532
|
+
*/
|
|
533
|
+
defaultValue?: string[] | string[][];
|
|
534
|
+
/**
|
|
535
|
+
* Callback when value changes
|
|
536
|
+
*/
|
|
537
|
+
onChange?: (value: string[] | string[][], selectedOptions: CascaderOption[] | CascaderOption[][]) => void;
|
|
538
|
+
/**
|
|
539
|
+
* Placeholder text
|
|
540
|
+
*/
|
|
541
|
+
placeholder?: string;
|
|
542
|
+
/**
|
|
543
|
+
* Label text
|
|
544
|
+
*/
|
|
545
|
+
label?: string;
|
|
546
|
+
/**
|
|
547
|
+
* Helper text
|
|
548
|
+
*/
|
|
549
|
+
helperText?: string;
|
|
550
|
+
/**
|
|
551
|
+
* Position of validation/helper messages
|
|
552
|
+
*/
|
|
553
|
+
messagePosition?: MessagePosition;
|
|
554
|
+
/**
|
|
555
|
+
* Theme color
|
|
556
|
+
*/
|
|
557
|
+
color?: ComponentColor;
|
|
558
|
+
/**
|
|
559
|
+
* Visual variant
|
|
560
|
+
*/
|
|
561
|
+
variant?: CascaderVariant;
|
|
562
|
+
/**
|
|
563
|
+
* Size variant (cascader only supports xs, sm, md, lg)
|
|
564
|
+
*/
|
|
565
|
+
size?: CascaderSize;
|
|
566
|
+
/**
|
|
567
|
+
* Dropdown position relative to trigger
|
|
568
|
+
*/
|
|
569
|
+
position?: 'left' | 'right';
|
|
570
|
+
/**
|
|
571
|
+
* Whether cascader is disabled
|
|
572
|
+
*/
|
|
573
|
+
disabled?: boolean;
|
|
574
|
+
/**
|
|
575
|
+
* Whether cascader is in loading state
|
|
576
|
+
*/
|
|
577
|
+
loading?: boolean;
|
|
578
|
+
/**
|
|
579
|
+
* Error message
|
|
580
|
+
*/
|
|
581
|
+
error?: string;
|
|
582
|
+
/**
|
|
583
|
+
* Warning message
|
|
584
|
+
*/
|
|
585
|
+
warning?: string;
|
|
586
|
+
/**
|
|
587
|
+
* Info message
|
|
588
|
+
*/
|
|
589
|
+
info?: string;
|
|
590
|
+
/**
|
|
591
|
+
* Success message
|
|
592
|
+
*/
|
|
593
|
+
success?: string;
|
|
594
|
+
/**
|
|
595
|
+
* Whether cascader should take full width
|
|
596
|
+
*/
|
|
597
|
+
fullWidth?: boolean;
|
|
598
|
+
/**
|
|
599
|
+
* Whether to expand on hover instead of click
|
|
600
|
+
*/
|
|
601
|
+
hover?: boolean;
|
|
602
|
+
/**
|
|
603
|
+
* Enable multiple selection mode
|
|
604
|
+
*/
|
|
605
|
+
multiple?: boolean;
|
|
606
|
+
/**
|
|
607
|
+
* Maximum number of chips visible in multiple mode
|
|
608
|
+
*/
|
|
609
|
+
maxChipsVisible?: number;
|
|
610
|
+
/**
|
|
611
|
+
* Custom render function for display value
|
|
612
|
+
*/
|
|
613
|
+
displayRender?: (labels: string[] | string[][]) => React.ReactNode;
|
|
614
|
+
/**
|
|
615
|
+
* Additional CSS class
|
|
616
|
+
*/
|
|
617
|
+
className?: string;
|
|
618
|
+
/**
|
|
619
|
+
* Whether the field is required
|
|
620
|
+
*/
|
|
621
|
+
required?: boolean;
|
|
622
|
+
}
|
|
623
|
+
|
|
624
|
+
declare const Cascader: React__default.NamedExoticComponent<CascaderProps>;
|
|
625
|
+
|
|
626
|
+
type CheckboxColor = 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
627
|
+
type CheckboxSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
628
|
+
interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
|
|
629
|
+
color?: CheckboxColor;
|
|
630
|
+
size?: CheckboxSize;
|
|
631
|
+
label?: React.ReactNode;
|
|
632
|
+
helperText?: string;
|
|
633
|
+
error?: string | boolean;
|
|
634
|
+
indeterminate?: boolean;
|
|
635
|
+
ref?: React.Ref<HTMLInputElement>;
|
|
636
|
+
labelClassName?: string;
|
|
637
|
+
}
|
|
638
|
+
|
|
639
|
+
declare const Checkbox: React__default.NamedExoticComponent<CheckboxProps>;
|
|
640
|
+
|
|
641
|
+
interface CheckboxGroupProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
642
|
+
/**
|
|
643
|
+
* Children elements (typically Checkbox components)
|
|
644
|
+
*/
|
|
645
|
+
children: React.ReactNode;
|
|
646
|
+
/**
|
|
647
|
+
* Label text for the checkbox group
|
|
648
|
+
*/
|
|
649
|
+
label?: string;
|
|
650
|
+
/**
|
|
651
|
+
* Helper text or instructions
|
|
652
|
+
*/
|
|
653
|
+
helperText?: string;
|
|
654
|
+
/**
|
|
655
|
+
* Error message
|
|
656
|
+
*/
|
|
657
|
+
error?: string;
|
|
658
|
+
/**
|
|
659
|
+
* Layout orientation
|
|
660
|
+
*/
|
|
661
|
+
orientation?: 'vertical' | 'horizontal';
|
|
662
|
+
/**
|
|
663
|
+
* Additional CSS class
|
|
664
|
+
*/
|
|
665
|
+
className?: string;
|
|
666
|
+
/**
|
|
667
|
+
* Reference to the div element
|
|
668
|
+
*/
|
|
669
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
670
|
+
}
|
|
671
|
+
|
|
672
|
+
declare const CheckboxGroup: React__default.NamedExoticComponent<CheckboxGroupProps>;
|
|
673
|
+
|
|
674
|
+
type ClipboardVariant = 'default' | 'solid' | 'soft';
|
|
675
|
+
type ClipboardSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
676
|
+
interface ClipboardProps {
|
|
677
|
+
/**
|
|
678
|
+
* Text value to copy to clipboard
|
|
679
|
+
*/
|
|
680
|
+
value: string;
|
|
681
|
+
/**
|
|
682
|
+
* Theme color
|
|
683
|
+
*/
|
|
684
|
+
color?: ComponentColor;
|
|
685
|
+
/**
|
|
686
|
+
* Size variant (clipboard only supports xs, sm, md, lg)
|
|
687
|
+
*/
|
|
688
|
+
size?: ClipboardSize;
|
|
689
|
+
/**
|
|
690
|
+
* Visual style variant
|
|
691
|
+
*/
|
|
692
|
+
variant?: ClipboardVariant;
|
|
693
|
+
/**
|
|
694
|
+
* Whether to show the value text
|
|
695
|
+
*/
|
|
696
|
+
showValue?: boolean;
|
|
697
|
+
/**
|
|
698
|
+
* Duration to show success icon (in milliseconds)
|
|
699
|
+
*/
|
|
700
|
+
successDuration?: number;
|
|
701
|
+
/**
|
|
702
|
+
* Callback when text is copied
|
|
703
|
+
*/
|
|
704
|
+
onCopy?: () => void;
|
|
705
|
+
/**
|
|
706
|
+
* Additional CSS class
|
|
707
|
+
*/
|
|
708
|
+
className?: string;
|
|
709
|
+
}
|
|
710
|
+
|
|
711
|
+
declare const Clipboard: React__default.NamedExoticComponent<ClipboardProps>;
|
|
712
|
+
|
|
713
|
+
type CollapseVariant = 'default' | 'solid' | 'soft';
|
|
714
|
+
type CollapseSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
715
|
+
interface CollapseProps {
|
|
716
|
+
/**
|
|
717
|
+
* Title displayed in the header
|
|
718
|
+
*/
|
|
719
|
+
title: React.ReactNode;
|
|
720
|
+
/**
|
|
721
|
+
* Content to display when expanded
|
|
722
|
+
*/
|
|
723
|
+
children: React.ReactNode;
|
|
724
|
+
/**
|
|
725
|
+
* Theme color
|
|
726
|
+
*/
|
|
727
|
+
color?: ComponentColor;
|
|
728
|
+
/**
|
|
729
|
+
* Size variant (collapse only supports xs, sm, md, lg)
|
|
730
|
+
*/
|
|
731
|
+
size?: CollapseSize;
|
|
732
|
+
/**
|
|
733
|
+
* Visual style variant
|
|
734
|
+
*/
|
|
735
|
+
variant?: CollapseVariant;
|
|
736
|
+
/**
|
|
737
|
+
* Default open state (uncontrolled)
|
|
738
|
+
*/
|
|
739
|
+
defaultOpen?: boolean;
|
|
740
|
+
/**
|
|
741
|
+
* Controlled open state
|
|
742
|
+
*/
|
|
743
|
+
open?: boolean;
|
|
744
|
+
/**
|
|
745
|
+
* Callback when open state changes
|
|
746
|
+
*/
|
|
747
|
+
onChange?: (open: boolean) => void;
|
|
748
|
+
/**
|
|
749
|
+
* Whether collapse is disabled
|
|
750
|
+
*/
|
|
751
|
+
disabled?: boolean;
|
|
752
|
+
/**
|
|
753
|
+
* Additional CSS class
|
|
754
|
+
*/
|
|
755
|
+
className?: string;
|
|
756
|
+
}
|
|
757
|
+
|
|
758
|
+
declare const Collapse: React__default.NamedExoticComponent<CollapseProps>;
|
|
759
|
+
|
|
760
|
+
interface DescriptionsItem {
|
|
761
|
+
key: string;
|
|
762
|
+
label: React.ReactNode;
|
|
763
|
+
children: React.ReactNode;
|
|
764
|
+
span?: number;
|
|
765
|
+
}
|
|
766
|
+
interface DescriptionsProps {
|
|
767
|
+
items: DescriptionsItem[];
|
|
768
|
+
column?: number;
|
|
769
|
+
color?: ComponentColor;
|
|
770
|
+
size?: 'xs' | 'sm' | 'md' | 'lg';
|
|
771
|
+
layout?: 'horizontal' | 'vertical';
|
|
772
|
+
bordered?: boolean;
|
|
773
|
+
rounded?: boolean;
|
|
774
|
+
className?: string;
|
|
775
|
+
}
|
|
776
|
+
|
|
777
|
+
declare const Descriptions: React__default.NamedExoticComponent<DescriptionsProps>;
|
|
778
|
+
|
|
779
|
+
type DropdownSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
780
|
+
interface DropdownItem {
|
|
781
|
+
/**
|
|
782
|
+
* Display label for the item
|
|
783
|
+
*/
|
|
784
|
+
label: React.ReactNode;
|
|
785
|
+
/**
|
|
786
|
+
* Unique value for the item
|
|
787
|
+
*/
|
|
788
|
+
value?: string | number;
|
|
789
|
+
/**
|
|
790
|
+
* Optional icon to display before label
|
|
791
|
+
*/
|
|
792
|
+
icon?: React.ReactNode;
|
|
793
|
+
/**
|
|
794
|
+
* Whether the item is disabled
|
|
795
|
+
*/
|
|
796
|
+
disabled?: boolean;
|
|
797
|
+
/**
|
|
798
|
+
* Click handler for the item
|
|
799
|
+
*/
|
|
800
|
+
onClick?: () => void;
|
|
801
|
+
}
|
|
802
|
+
interface DropdownRenderProps {
|
|
803
|
+
/**
|
|
804
|
+
* Function to close the dropdown
|
|
805
|
+
*/
|
|
806
|
+
close: () => void;
|
|
807
|
+
}
|
|
808
|
+
interface DropdownProps {
|
|
809
|
+
/**
|
|
810
|
+
* Trigger element that opens the dropdown
|
|
811
|
+
*/
|
|
812
|
+
children: React.ReactNode;
|
|
813
|
+
/**
|
|
814
|
+
* Array of dropdown items
|
|
815
|
+
*/
|
|
816
|
+
items?: DropdownItem[];
|
|
817
|
+
/**
|
|
818
|
+
* Custom render function for dropdown content
|
|
819
|
+
*/
|
|
820
|
+
render?: (props: DropdownRenderProps) => React.ReactNode;
|
|
821
|
+
/**
|
|
822
|
+
* Theme color
|
|
823
|
+
*/
|
|
824
|
+
color?: ComponentColor;
|
|
825
|
+
/**
|
|
826
|
+
* Size variant (dropdown only supports xs, sm, md, lg)
|
|
827
|
+
*/
|
|
828
|
+
size?: DropdownSize;
|
|
829
|
+
/**
|
|
830
|
+
* Dropdown position relative to trigger
|
|
831
|
+
*/
|
|
832
|
+
position?: 'left' | 'right';
|
|
833
|
+
/**
|
|
834
|
+
* Maximum height of dropdown content
|
|
835
|
+
*/
|
|
836
|
+
maxHeight?: number;
|
|
837
|
+
/**
|
|
838
|
+
* Whether dropdown is disabled
|
|
839
|
+
*/
|
|
840
|
+
disabled?: boolean;
|
|
841
|
+
/**
|
|
842
|
+
* Whether dropdown should take full width
|
|
843
|
+
*/
|
|
844
|
+
fullWidth?: boolean;
|
|
845
|
+
/**
|
|
846
|
+
* Whether to open on hover instead of click
|
|
847
|
+
*/
|
|
848
|
+
hover?: boolean;
|
|
849
|
+
/**
|
|
850
|
+
* Additional CSS class
|
|
851
|
+
*/
|
|
852
|
+
className?: string;
|
|
853
|
+
/**
|
|
854
|
+
* Callback when an item is clicked
|
|
855
|
+
*/
|
|
856
|
+
onItemClick?: (value: string | number) => void;
|
|
857
|
+
}
|
|
858
|
+
|
|
859
|
+
declare const Dropdown: React__default.NamedExoticComponent<DropdownProps>;
|
|
860
|
+
|
|
861
|
+
type EmptySize = 'xs' | 'sm' | 'md' | 'lg';
|
|
862
|
+
interface EmptyProps {
|
|
863
|
+
/**
|
|
864
|
+
* Custom icon to display
|
|
865
|
+
*/
|
|
866
|
+
icon?: React.ReactNode;
|
|
867
|
+
/**
|
|
868
|
+
* Image URL to display instead of icon
|
|
869
|
+
*/
|
|
870
|
+
image?: string;
|
|
871
|
+
/**
|
|
872
|
+
* Alt text for image
|
|
873
|
+
*/
|
|
874
|
+
imageAlt?: string;
|
|
875
|
+
/**
|
|
876
|
+
* Title text
|
|
877
|
+
*/
|
|
878
|
+
title?: string;
|
|
879
|
+
/**
|
|
880
|
+
* Description text
|
|
881
|
+
*/
|
|
882
|
+
description?: string;
|
|
883
|
+
/**
|
|
884
|
+
* Children elements (typically action buttons)
|
|
885
|
+
*/
|
|
886
|
+
children?: React.ReactNode;
|
|
887
|
+
/**
|
|
888
|
+
* Size variant
|
|
889
|
+
*/
|
|
890
|
+
size?: EmptySize;
|
|
891
|
+
/**
|
|
892
|
+
* Additional CSS class
|
|
893
|
+
*/
|
|
894
|
+
className?: string;
|
|
895
|
+
}
|
|
896
|
+
|
|
897
|
+
declare const Empty: React__default.NamedExoticComponent<EmptyProps>;
|
|
898
|
+
|
|
899
|
+
type SpinnerSize = Exclude<ComponentSize, 'xl'>;
|
|
900
|
+
type SpinnerColor = ComponentColor;
|
|
901
|
+
interface SpinnerProps {
|
|
902
|
+
size?: SpinnerSize;
|
|
903
|
+
color?: SpinnerColor;
|
|
904
|
+
label?: string;
|
|
905
|
+
className?: string;
|
|
906
|
+
}
|
|
907
|
+
|
|
908
|
+
interface FetchingOverlayProps extends SpinnerProps {
|
|
909
|
+
isFetching: boolean;
|
|
910
|
+
fullscreen?: boolean;
|
|
911
|
+
backdropOpacity?: number;
|
|
912
|
+
}
|
|
913
|
+
declare const FetchingOverlay: FC<FetchingOverlayProps>;
|
|
914
|
+
|
|
915
|
+
type GridGap = 'xs' | 'sm' | 'md' | 'lg';
|
|
916
|
+
type GridColumns = 1 | 2 | 3 | 4 | 5 | 6;
|
|
917
|
+
interface GridProps {
|
|
918
|
+
/**
|
|
919
|
+
* Children elements
|
|
920
|
+
*/
|
|
921
|
+
children: React.ReactNode;
|
|
922
|
+
/**
|
|
923
|
+
* Number of columns (responsive breakpoints applied automatically)
|
|
924
|
+
*/
|
|
925
|
+
columns?: GridColumns;
|
|
926
|
+
/**
|
|
927
|
+
* Gap size between grid items
|
|
928
|
+
*/
|
|
929
|
+
gap?: GridGap;
|
|
930
|
+
/**
|
|
931
|
+
* Additional CSS class
|
|
932
|
+
*/
|
|
933
|
+
className?: string;
|
|
934
|
+
}
|
|
935
|
+
|
|
936
|
+
declare const Grid: React__default.NamedExoticComponent<GridProps>;
|
|
937
|
+
|
|
938
|
+
interface ImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
|
|
939
|
+
/**
|
|
940
|
+
* Image source URL
|
|
941
|
+
*/
|
|
942
|
+
src: string;
|
|
943
|
+
/**
|
|
944
|
+
* Alt text for the image
|
|
945
|
+
*/
|
|
946
|
+
alt: string;
|
|
947
|
+
/**
|
|
948
|
+
* Whether to show blur placeholder while loading
|
|
949
|
+
*/
|
|
950
|
+
withBlur?: boolean;
|
|
951
|
+
/**
|
|
952
|
+
* Fetch priority hint
|
|
953
|
+
*/
|
|
954
|
+
fetchPriority?: 'auto' | 'high' | 'low';
|
|
955
|
+
/**
|
|
956
|
+
* Additional CSS class
|
|
957
|
+
*/
|
|
958
|
+
className?: string;
|
|
959
|
+
/**
|
|
960
|
+
* Image width
|
|
961
|
+
*/
|
|
962
|
+
width?: number;
|
|
963
|
+
/**
|
|
964
|
+
* Image height
|
|
965
|
+
*/
|
|
966
|
+
height?: number;
|
|
967
|
+
}
|
|
968
|
+
|
|
969
|
+
declare function Image({ src, withBlur, className, fetchPriority, ...props }: ImageProps): react_jsx_runtime.JSX.Element;
|
|
970
|
+
|
|
971
|
+
type InputVariant = 'outline' | 'filled';
|
|
972
|
+
type InputSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
973
|
+
interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>, ValidationMessages, Partial<IconProps>, Partial<LoadingProps>, Partial<FullWidthProps> {
|
|
974
|
+
variant?: InputVariant;
|
|
975
|
+
size?: InputSize;
|
|
976
|
+
label?: string;
|
|
977
|
+
floatingLabel?: boolean;
|
|
978
|
+
messagePosition?: MessagePosition;
|
|
979
|
+
clearable?: boolean;
|
|
980
|
+
onClear?: () => void;
|
|
981
|
+
maxLength?: number;
|
|
982
|
+
showCount?: boolean;
|
|
983
|
+
ref?: React.Ref<HTMLInputElement>;
|
|
984
|
+
wrapperClassName?: string;
|
|
985
|
+
}
|
|
986
|
+
|
|
987
|
+
declare const Input: React__default.NamedExoticComponent<InputProps>;
|
|
988
|
+
|
|
989
|
+
interface InputGroupProps {
|
|
990
|
+
/**
|
|
991
|
+
* Children elements (typically InputGroupInput and InputGroupAddon)
|
|
992
|
+
*/
|
|
993
|
+
children: React.ReactNode;
|
|
994
|
+
/**
|
|
995
|
+
* Additional CSS class
|
|
996
|
+
*/
|
|
997
|
+
className?: string;
|
|
998
|
+
}
|
|
999
|
+
|
|
1000
|
+
declare const InputGroup: React$1.NamedExoticComponent<InputGroupProps>;
|
|
1001
|
+
|
|
1002
|
+
type InputOTPSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1003
|
+
interface InputOTPProps {
|
|
1004
|
+
/**
|
|
1005
|
+
* Number of OTP input fields
|
|
1006
|
+
*/
|
|
1007
|
+
length?: number;
|
|
1008
|
+
/**
|
|
1009
|
+
* Size variant
|
|
1010
|
+
*/
|
|
1011
|
+
size?: InputOTPSize;
|
|
1012
|
+
/**
|
|
1013
|
+
* Current value (controlled)
|
|
1014
|
+
*/
|
|
1015
|
+
value?: string;
|
|
1016
|
+
/**
|
|
1017
|
+
* Callback when value changes
|
|
1018
|
+
*/
|
|
1019
|
+
onChange?: (value: string) => void;
|
|
1020
|
+
/**
|
|
1021
|
+
* Callback when all fields are filled
|
|
1022
|
+
*/
|
|
1023
|
+
onComplete?: (value: string) => void;
|
|
1024
|
+
/**
|
|
1025
|
+
* Error message
|
|
1026
|
+
*/
|
|
1027
|
+
error?: string | boolean;
|
|
1028
|
+
/**
|
|
1029
|
+
* Warning message
|
|
1030
|
+
*/
|
|
1031
|
+
warning?: string | boolean;
|
|
1032
|
+
/**
|
|
1033
|
+
* Info message
|
|
1034
|
+
*/
|
|
1035
|
+
info?: string | boolean;
|
|
1036
|
+
/**
|
|
1037
|
+
* Success message
|
|
1038
|
+
*/
|
|
1039
|
+
success?: string | boolean;
|
|
1040
|
+
/**
|
|
1041
|
+
* Helper text
|
|
1042
|
+
*/
|
|
1043
|
+
helperText?: string;
|
|
1044
|
+
/**
|
|
1045
|
+
* Whether inputs are disabled
|
|
1046
|
+
*/
|
|
1047
|
+
disabled?: boolean;
|
|
1048
|
+
/**
|
|
1049
|
+
* Whether to auto-focus first input
|
|
1050
|
+
*/
|
|
1051
|
+
autoFocus?: boolean;
|
|
1052
|
+
/**
|
|
1053
|
+
* Input type (affects keyboard on mobile)
|
|
1054
|
+
*/
|
|
1055
|
+
type?: 'text' | 'number';
|
|
1056
|
+
/**
|
|
1057
|
+
* Regular expression pattern for validation
|
|
1058
|
+
*/
|
|
1059
|
+
pattern?: string;
|
|
1060
|
+
/**
|
|
1061
|
+
* Label text
|
|
1062
|
+
*/
|
|
1063
|
+
label?: string;
|
|
1064
|
+
/**
|
|
1065
|
+
* Position of validation/helper messages
|
|
1066
|
+
*/
|
|
1067
|
+
messagePosition?: MessagePosition;
|
|
1068
|
+
/**
|
|
1069
|
+
* Additional CSS class
|
|
1070
|
+
*/
|
|
1071
|
+
className?: string;
|
|
1072
|
+
/**
|
|
1073
|
+
* Reference to the container div element
|
|
1074
|
+
*/
|
|
1075
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
1076
|
+
}
|
|
1077
|
+
|
|
1078
|
+
declare const InputOTP: React__default.NamedExoticComponent<InputOTPProps>;
|
|
1079
|
+
|
|
1080
|
+
type KbdVariant = 'solid' | 'outline' | 'soft';
|
|
1081
|
+
type KbdSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1082
|
+
interface KbdProps extends React.HTMLAttributes<HTMLElement> {
|
|
1083
|
+
/**
|
|
1084
|
+
* Children elements (typically keyboard key text)
|
|
1085
|
+
*/
|
|
1086
|
+
children: React.ReactNode;
|
|
1087
|
+
/**
|
|
1088
|
+
* Visual style variant
|
|
1089
|
+
*/
|
|
1090
|
+
variant?: KbdVariant;
|
|
1091
|
+
/**
|
|
1092
|
+
* Theme color
|
|
1093
|
+
*/
|
|
1094
|
+
color?: ComponentColor;
|
|
1095
|
+
/**
|
|
1096
|
+
* Size variant
|
|
1097
|
+
*/
|
|
1098
|
+
size?: KbdSize;
|
|
1099
|
+
/**
|
|
1100
|
+
* Additional CSS class
|
|
1101
|
+
*/
|
|
1102
|
+
className?: string;
|
|
1103
|
+
}
|
|
1104
|
+
|
|
1105
|
+
declare const Kbd: React__default.NamedExoticComponent<KbdProps>;
|
|
1106
|
+
|
|
1107
|
+
type ModalSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1108
|
+
type ModalColor = 'default' | 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
1109
|
+
interface ComposedModalProps {
|
|
1110
|
+
/**
|
|
1111
|
+
* Controlled open state
|
|
1112
|
+
*/
|
|
1113
|
+
open?: boolean;
|
|
1114
|
+
/**
|
|
1115
|
+
* Callback when open state changes
|
|
1116
|
+
*/
|
|
1117
|
+
onOpenChange?: (open: boolean) => void;
|
|
1118
|
+
/**
|
|
1119
|
+
* Modal title
|
|
1120
|
+
*/
|
|
1121
|
+
title?: React.ReactNode;
|
|
1122
|
+
/**
|
|
1123
|
+
* Modal description
|
|
1124
|
+
*/
|
|
1125
|
+
description?: React.ReactNode;
|
|
1126
|
+
/**
|
|
1127
|
+
* Modal content
|
|
1128
|
+
*/
|
|
1129
|
+
children: React.ReactNode;
|
|
1130
|
+
/**
|
|
1131
|
+
* Footer content
|
|
1132
|
+
*/
|
|
1133
|
+
footer?: React.ReactNode;
|
|
1134
|
+
/**
|
|
1135
|
+
* Size variant
|
|
1136
|
+
*/
|
|
1137
|
+
size?: ModalSize;
|
|
1138
|
+
/**
|
|
1139
|
+
* Theme color (adds colored left border)
|
|
1140
|
+
*/
|
|
1141
|
+
color?: ModalColor;
|
|
1142
|
+
/**
|
|
1143
|
+
* Center align content
|
|
1144
|
+
*/
|
|
1145
|
+
centered?: boolean;
|
|
1146
|
+
/**
|
|
1147
|
+
* Whether to show close button
|
|
1148
|
+
*/
|
|
1149
|
+
showCloseButton?: boolean;
|
|
1150
|
+
/**
|
|
1151
|
+
* Whether to hide header
|
|
1152
|
+
*/
|
|
1153
|
+
hideHeader?: boolean;
|
|
1154
|
+
/**
|
|
1155
|
+
* Whether to hide footer
|
|
1156
|
+
*/
|
|
1157
|
+
hideFooter?: boolean;
|
|
1158
|
+
/**
|
|
1159
|
+
* Additional CSS class for header
|
|
1160
|
+
*/
|
|
1161
|
+
className?: string;
|
|
1162
|
+
/**
|
|
1163
|
+
* Additional CSS class for content
|
|
1164
|
+
*/
|
|
1165
|
+
contentClassName?: string;
|
|
1166
|
+
}
|
|
1167
|
+
|
|
1168
|
+
declare function Modal({ ...props }: React$1.ComponentProps<typeof DialogPrimitive.Root>): react_jsx_runtime.JSX.Element;
|
|
1169
|
+
declare function ComposedModal({ open, onOpenChange, title, description, children, footer, size, color, centered, showCloseButton, hideHeader, hideFooter, className, contentClassName, }: ComposedModalProps): react_jsx_runtime.JSX.Element;
|
|
1170
|
+
|
|
1171
|
+
type MultiSelectSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1172
|
+
interface MultiSelectOption {
|
|
1173
|
+
value: string;
|
|
1174
|
+
label: string;
|
|
1175
|
+
disabled?: boolean;
|
|
1176
|
+
group?: string;
|
|
1177
|
+
}
|
|
1178
|
+
interface MultiSelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'size' | 'onChange'> {
|
|
1179
|
+
size?: MultiSelectSize;
|
|
1180
|
+
label?: string;
|
|
1181
|
+
helperText?: string;
|
|
1182
|
+
error?: string | boolean;
|
|
1183
|
+
warning?: string | boolean;
|
|
1184
|
+
info?: string | boolean;
|
|
1185
|
+
success?: string | boolean;
|
|
1186
|
+
options?: MultiSelectOption[];
|
|
1187
|
+
placeholder?: string;
|
|
1188
|
+
loading?: boolean;
|
|
1189
|
+
fullWidth?: boolean;
|
|
1190
|
+
maxChipsVisible?: number;
|
|
1191
|
+
value?: string[];
|
|
1192
|
+
defaultValue?: string[];
|
|
1193
|
+
onChange?: (value: string[]) => void;
|
|
1194
|
+
disabled?: boolean;
|
|
1195
|
+
required?: boolean;
|
|
1196
|
+
clearable?: boolean;
|
|
1197
|
+
virtualizeThreshold?: number;
|
|
1198
|
+
maxDropdownHeight?: number;
|
|
1199
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
1200
|
+
}
|
|
1201
|
+
|
|
1202
|
+
declare const MultiSelect: React__default.NamedExoticComponent<MultiSelectProps>;
|
|
1203
|
+
|
|
1204
|
+
type NotificationVariant = 'default' | 'solid' | 'outlined' | 'soft';
|
|
1205
|
+
type NotificationSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1206
|
+
interface NotificationAction {
|
|
1207
|
+
/**
|
|
1208
|
+
* Action button label
|
|
1209
|
+
*/
|
|
1210
|
+
label: string;
|
|
1211
|
+
/**
|
|
1212
|
+
* Click handler for action button
|
|
1213
|
+
*/
|
|
1214
|
+
onClick: () => void;
|
|
1215
|
+
}
|
|
1216
|
+
interface NotificationProps {
|
|
1217
|
+
/**
|
|
1218
|
+
* Notification title
|
|
1219
|
+
*/
|
|
1220
|
+
title?: string;
|
|
1221
|
+
/**
|
|
1222
|
+
* Notification description
|
|
1223
|
+
*/
|
|
1224
|
+
description?: string;
|
|
1225
|
+
/**
|
|
1226
|
+
* Visual style variant
|
|
1227
|
+
*/
|
|
1228
|
+
variant?: NotificationVariant;
|
|
1229
|
+
/**
|
|
1230
|
+
* Theme color
|
|
1231
|
+
*/
|
|
1232
|
+
color?: ComponentColor;
|
|
1233
|
+
/**
|
|
1234
|
+
* Size variant
|
|
1235
|
+
*/
|
|
1236
|
+
size?: NotificationSize;
|
|
1237
|
+
/**
|
|
1238
|
+
* Whether notification can be closed
|
|
1239
|
+
*/
|
|
1240
|
+
closable?: boolean;
|
|
1241
|
+
/**
|
|
1242
|
+
* Callback when notification is closed
|
|
1243
|
+
*/
|
|
1244
|
+
onClose?: () => void;
|
|
1245
|
+
/**
|
|
1246
|
+
* Action button configuration
|
|
1247
|
+
*/
|
|
1248
|
+
action?: NotificationAction;
|
|
1249
|
+
/**
|
|
1250
|
+
* Additional CSS class
|
|
1251
|
+
*/
|
|
1252
|
+
className?: string;
|
|
1253
|
+
/**
|
|
1254
|
+
* Children elements (additional content)
|
|
1255
|
+
*/
|
|
1256
|
+
children?: React.ReactNode;
|
|
1257
|
+
}
|
|
1258
|
+
|
|
1259
|
+
declare const Notification: React__default.NamedExoticComponent<NotificationProps>;
|
|
1260
|
+
|
|
1261
|
+
type PaginationColor = 'default' | 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
1262
|
+
type PaginationSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1263
|
+
type PaginationVariant = 'default' | 'solid' | 'soft';
|
|
1264
|
+
interface PaginationProps {
|
|
1265
|
+
/**
|
|
1266
|
+
* Total number of items
|
|
1267
|
+
*/
|
|
1268
|
+
total: number;
|
|
1269
|
+
/**
|
|
1270
|
+
* Current page number (controlled)
|
|
1271
|
+
*/
|
|
1272
|
+
current?: number;
|
|
1273
|
+
/**
|
|
1274
|
+
* Default initial page number (uncontrolled)
|
|
1275
|
+
*/
|
|
1276
|
+
defaultCurrent?: number;
|
|
1277
|
+
/**
|
|
1278
|
+
* Number of items per page (controlled)
|
|
1279
|
+
*/
|
|
1280
|
+
pageSize?: number;
|
|
1281
|
+
/**
|
|
1282
|
+
* Default number of items per page (uncontrolled)
|
|
1283
|
+
*/
|
|
1284
|
+
defaultPageSize?: number;
|
|
1285
|
+
/**
|
|
1286
|
+
* Callback when page changes
|
|
1287
|
+
*/
|
|
1288
|
+
onChange?: (page: number, pageSize: number) => void;
|
|
1289
|
+
/**
|
|
1290
|
+
* Callback when page size changes
|
|
1291
|
+
*/
|
|
1292
|
+
onShowSizeChange?: (current: number, size: number) => void;
|
|
1293
|
+
/**
|
|
1294
|
+
* Theme color
|
|
1295
|
+
*/
|
|
1296
|
+
color?: PaginationColor;
|
|
1297
|
+
/**
|
|
1298
|
+
* Size variant
|
|
1299
|
+
*/
|
|
1300
|
+
size?: PaginationSize;
|
|
1301
|
+
/**
|
|
1302
|
+
* Visual style variant
|
|
1303
|
+
*/
|
|
1304
|
+
variant?: PaginationVariant;
|
|
1305
|
+
/**
|
|
1306
|
+
* Whether to show page size selector
|
|
1307
|
+
*/
|
|
1308
|
+
showSizeChanger?: boolean;
|
|
1309
|
+
/**
|
|
1310
|
+
* Available page size options
|
|
1311
|
+
*/
|
|
1312
|
+
pageSizeOptions?: number[];
|
|
1313
|
+
/**
|
|
1314
|
+
* Whether to show quick jumper input
|
|
1315
|
+
*/
|
|
1316
|
+
showQuickJumper?: boolean;
|
|
1317
|
+
/**
|
|
1318
|
+
* Whether to show first and last page buttons
|
|
1319
|
+
*/
|
|
1320
|
+
showFirstLastButtons?: boolean;
|
|
1321
|
+
/**
|
|
1322
|
+
* Custom function to display total items
|
|
1323
|
+
*/
|
|
1324
|
+
showTotal?: (total: number, range: [number, number]) => React.ReactNode;
|
|
1325
|
+
/**
|
|
1326
|
+
* Disable all interactions
|
|
1327
|
+
*/
|
|
1328
|
+
disabled?: boolean;
|
|
1329
|
+
/**
|
|
1330
|
+
* Additional CSS class
|
|
1331
|
+
*/
|
|
1332
|
+
className?: string;
|
|
1333
|
+
}
|
|
1334
|
+
|
|
1335
|
+
declare const Pagination: React__default.NamedExoticComponent<PaginationProps>;
|
|
1336
|
+
|
|
1337
|
+
type ProgressType = 'line' | 'circle' | 'step';
|
|
1338
|
+
type ProgressVariant = 'default' | 'solid' | 'soft';
|
|
1339
|
+
type ProgressOrientation = 'horizontal' | 'vertical';
|
|
1340
|
+
type ProgressSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1341
|
+
interface ProgressProps {
|
|
1342
|
+
/**
|
|
1343
|
+
* Progress value (0-100)
|
|
1344
|
+
*/
|
|
1345
|
+
value: number;
|
|
1346
|
+
/**
|
|
1347
|
+
* Theme color
|
|
1348
|
+
*/
|
|
1349
|
+
color?: ComponentColor;
|
|
1350
|
+
/**
|
|
1351
|
+
* Size variant
|
|
1352
|
+
*/
|
|
1353
|
+
size?: ProgressSize;
|
|
1354
|
+
/**
|
|
1355
|
+
* Visual style variant
|
|
1356
|
+
*/
|
|
1357
|
+
variant?: ProgressVariant;
|
|
1358
|
+
/**
|
|
1359
|
+
* Progress bar type
|
|
1360
|
+
*/
|
|
1361
|
+
type?: ProgressType;
|
|
1362
|
+
/**
|
|
1363
|
+
* Orientation (for line type)
|
|
1364
|
+
*/
|
|
1365
|
+
orientation?: ProgressOrientation;
|
|
1366
|
+
/**
|
|
1367
|
+
* Whether to show progress percentage
|
|
1368
|
+
*/
|
|
1369
|
+
showProgress?: boolean;
|
|
1370
|
+
/**
|
|
1371
|
+
* Label text
|
|
1372
|
+
*/
|
|
1373
|
+
label?: string;
|
|
1374
|
+
/**
|
|
1375
|
+
* Whether to show striped pattern
|
|
1376
|
+
*/
|
|
1377
|
+
striped?: boolean;
|
|
1378
|
+
/**
|
|
1379
|
+
* Whether to animate striped pattern
|
|
1380
|
+
*/
|
|
1381
|
+
animated?: boolean;
|
|
1382
|
+
/**
|
|
1383
|
+
* Additional CSS class
|
|
1384
|
+
*/
|
|
1385
|
+
className?: string;
|
|
1386
|
+
/**
|
|
1387
|
+
* Total number of steps (for step type)
|
|
1388
|
+
*/
|
|
1389
|
+
totalSteps?: number;
|
|
1390
|
+
/**
|
|
1391
|
+
* Footer content or boolean to show default footer
|
|
1392
|
+
*/
|
|
1393
|
+
footer?: React.ReactNode | boolean;
|
|
1394
|
+
}
|
|
1395
|
+
|
|
1396
|
+
declare const Progress: React__default.NamedExoticComponent<ProgressProps>;
|
|
1397
|
+
|
|
1398
|
+
type RadioColor = 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
1399
|
+
type RadioSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1400
|
+
interface RadioProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
|
|
1401
|
+
color?: RadioColor;
|
|
1402
|
+
size?: RadioSize;
|
|
1403
|
+
label?: React.ReactNode;
|
|
1404
|
+
helperText?: string;
|
|
1405
|
+
error?: string | boolean;
|
|
1406
|
+
ref?: React.Ref<HTMLInputElement>;
|
|
1407
|
+
}
|
|
1408
|
+
|
|
1409
|
+
declare const Radio: React__default.NamedExoticComponent<RadioProps>;
|
|
1410
|
+
|
|
1411
|
+
interface RadioGroupProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
1412
|
+
/**
|
|
1413
|
+
* Children elements (typically Radio components)
|
|
1414
|
+
*/
|
|
1415
|
+
children: React.ReactNode;
|
|
1416
|
+
/**
|
|
1417
|
+
* Label text for the radio group
|
|
1418
|
+
*/
|
|
1419
|
+
label?: string;
|
|
1420
|
+
/**
|
|
1421
|
+
* Helper text or instructions
|
|
1422
|
+
*/
|
|
1423
|
+
helperText?: string;
|
|
1424
|
+
/**
|
|
1425
|
+
* Error message
|
|
1426
|
+
*/
|
|
1427
|
+
error?: string;
|
|
1428
|
+
/**
|
|
1429
|
+
* Layout orientation
|
|
1430
|
+
*/
|
|
1431
|
+
orientation?: 'vertical' | 'horizontal';
|
|
1432
|
+
/**
|
|
1433
|
+
* Additional CSS class
|
|
1434
|
+
*/
|
|
1435
|
+
className?: string;
|
|
1436
|
+
/**
|
|
1437
|
+
* Reference to the div element
|
|
1438
|
+
*/
|
|
1439
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
1440
|
+
}
|
|
1441
|
+
|
|
1442
|
+
declare const RadioGroup: React__default.NamedExoticComponent<RadioGroupProps>;
|
|
1443
|
+
|
|
1444
|
+
type RatingVariant = 'default' | 'solid' | 'soft';
|
|
1445
|
+
type RatingSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1446
|
+
interface RatingProps {
|
|
1447
|
+
/**
|
|
1448
|
+
* Current rating value (controlled)
|
|
1449
|
+
*/
|
|
1450
|
+
value?: number;
|
|
1451
|
+
/**
|
|
1452
|
+
* Default initial rating value (uncontrolled)
|
|
1453
|
+
*/
|
|
1454
|
+
defaultValue?: number;
|
|
1455
|
+
/**
|
|
1456
|
+
* Total number of stars
|
|
1457
|
+
*/
|
|
1458
|
+
count?: number;
|
|
1459
|
+
/**
|
|
1460
|
+
* Allow half star ratings
|
|
1461
|
+
*/
|
|
1462
|
+
allowHalf?: boolean;
|
|
1463
|
+
/**
|
|
1464
|
+
* Theme color
|
|
1465
|
+
*/
|
|
1466
|
+
color?: ComponentColor;
|
|
1467
|
+
/**
|
|
1468
|
+
* Size variant
|
|
1469
|
+
*/
|
|
1470
|
+
size?: RatingSize;
|
|
1471
|
+
/**
|
|
1472
|
+
* Visual style variant
|
|
1473
|
+
*/
|
|
1474
|
+
variant?: RatingVariant;
|
|
1475
|
+
/**
|
|
1476
|
+
* Callback when rating changes
|
|
1477
|
+
*/
|
|
1478
|
+
onChange?: (value: number) => void;
|
|
1479
|
+
/**
|
|
1480
|
+
* Whether rating is disabled
|
|
1481
|
+
*/
|
|
1482
|
+
disabled?: boolean;
|
|
1483
|
+
/**
|
|
1484
|
+
* Whether rating is read-only
|
|
1485
|
+
*/
|
|
1486
|
+
readOnly?: boolean;
|
|
1487
|
+
/**
|
|
1488
|
+
* Additional CSS class
|
|
1489
|
+
*/
|
|
1490
|
+
className?: string;
|
|
1491
|
+
}
|
|
1492
|
+
|
|
1493
|
+
declare const Rating: React__default.NamedExoticComponent<RatingProps>;
|
|
1494
|
+
|
|
1495
|
+
type RibbonPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
|
|
1496
|
+
type RibbonSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1497
|
+
interface RibbonProps {
|
|
1498
|
+
/**
|
|
1499
|
+
* Children elements (ribbon content)
|
|
1500
|
+
*/
|
|
1501
|
+
children: React.ReactNode;
|
|
1502
|
+
/**
|
|
1503
|
+
* Theme color
|
|
1504
|
+
*/
|
|
1505
|
+
color?: ComponentColor;
|
|
1506
|
+
/**
|
|
1507
|
+
* Size variant
|
|
1508
|
+
*/
|
|
1509
|
+
size?: RibbonSize;
|
|
1510
|
+
/**
|
|
1511
|
+
* Position of the ribbon
|
|
1512
|
+
*/
|
|
1513
|
+
position?: RibbonPosition;
|
|
1514
|
+
/**
|
|
1515
|
+
* Additional CSS class
|
|
1516
|
+
*/
|
|
1517
|
+
className?: string;
|
|
1518
|
+
}
|
|
1519
|
+
|
|
1520
|
+
declare const Ribbon: React__default.NamedExoticComponent<RibbonProps>;
|
|
1521
|
+
|
|
1522
|
+
type SelectSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1523
|
+
interface SelectOption extends BaseOption {
|
|
1524
|
+
group?: string;
|
|
1525
|
+
}
|
|
1526
|
+
interface SelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'size' | 'onChange'>, ValidationMessages, Partial<FullWidthProps>, Partial<RequiredProps>, Partial<DisableableProps>, Partial<LoadingProps> {
|
|
1527
|
+
size?: SelectSize;
|
|
1528
|
+
label?: string;
|
|
1529
|
+
options?: SelectOption[];
|
|
1530
|
+
placeholder?: string;
|
|
1531
|
+
value?: string | number;
|
|
1532
|
+
defaultValue?: string | number;
|
|
1533
|
+
onChange?: (value: string | number) => void;
|
|
1534
|
+
clearable?: boolean;
|
|
1535
|
+
virtualizeThreshold?: number;
|
|
1536
|
+
maxDropdownHeight?: number;
|
|
1537
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
1538
|
+
}
|
|
1539
|
+
|
|
1540
|
+
declare const Select: React__default.NamedExoticComponent<SelectProps>;
|
|
1541
|
+
|
|
1542
|
+
type SkeletonSize = Exclude<ComponentSize, 'xl'>;
|
|
1543
|
+
type SkeletonColor = ComponentColor;
|
|
1544
|
+
interface SkeletonProps {
|
|
1545
|
+
size?: SkeletonSize;
|
|
1546
|
+
color?: SkeletonColor;
|
|
1547
|
+
circle?: boolean;
|
|
1548
|
+
className?: string;
|
|
1549
|
+
}
|
|
1550
|
+
|
|
1551
|
+
declare const Skeleton: React__default.NamedExoticComponent<SkeletonProps>;
|
|
1552
|
+
|
|
1553
|
+
type SliderVariant = 'default' | 'solid' | 'soft';
|
|
1554
|
+
type SliderSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1555
|
+
interface SliderProps {
|
|
1556
|
+
/**
|
|
1557
|
+
* Current value (controlled) - single number or array for range
|
|
1558
|
+
*/
|
|
1559
|
+
value?: number | number[];
|
|
1560
|
+
/**
|
|
1561
|
+
* Default initial value (uncontrolled)
|
|
1562
|
+
*/
|
|
1563
|
+
defaultValue?: number | number[];
|
|
1564
|
+
/**
|
|
1565
|
+
* Minimum value
|
|
1566
|
+
*/
|
|
1567
|
+
min?: number;
|
|
1568
|
+
/**
|
|
1569
|
+
* Maximum value
|
|
1570
|
+
*/
|
|
1571
|
+
max?: number;
|
|
1572
|
+
/**
|
|
1573
|
+
* Step increment
|
|
1574
|
+
*/
|
|
1575
|
+
step?: number;
|
|
1576
|
+
/**
|
|
1577
|
+
* Theme color
|
|
1578
|
+
*/
|
|
1579
|
+
color?: ComponentColor;
|
|
1580
|
+
/**
|
|
1581
|
+
* Size variant
|
|
1582
|
+
*/
|
|
1583
|
+
size?: SliderSize;
|
|
1584
|
+
/**
|
|
1585
|
+
* Visual style variant
|
|
1586
|
+
*/
|
|
1587
|
+
variant?: SliderVariant;
|
|
1588
|
+
/**
|
|
1589
|
+
* Callback when value changes
|
|
1590
|
+
*/
|
|
1591
|
+
onChange?: (value: number | number[]) => void;
|
|
1592
|
+
/**
|
|
1593
|
+
* Whether slider is disabled
|
|
1594
|
+
*/
|
|
1595
|
+
disabled?: boolean;
|
|
1596
|
+
/**
|
|
1597
|
+
* Additional CSS class
|
|
1598
|
+
*/
|
|
1599
|
+
className?: string;
|
|
1600
|
+
/**
|
|
1601
|
+
* Footer content or boolean to show default footer
|
|
1602
|
+
*/
|
|
1603
|
+
footer?: React.ReactNode | boolean;
|
|
1604
|
+
/**
|
|
1605
|
+
* Enable range mode with two handles
|
|
1606
|
+
*/
|
|
1607
|
+
range?: boolean;
|
|
1608
|
+
}
|
|
1609
|
+
|
|
1610
|
+
declare const Slider: React__default.NamedExoticComponent<SliderProps>;
|
|
1611
|
+
|
|
1612
|
+
declare const Spinner: React__default.NamedExoticComponent<SpinnerProps>;
|
|
1613
|
+
|
|
1614
|
+
type StepperColor = 'default' | 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
1615
|
+
type StepperSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1616
|
+
type StepperVariant = 'default' | 'solid' | 'soft';
|
|
1617
|
+
type StepperOrientation = 'horizontal' | 'vertical';
|
|
1618
|
+
type StepperType = 'numbered' | 'dots';
|
|
1619
|
+
type StepStatus = 'wait' | 'process' | 'finish' | 'error';
|
|
1620
|
+
interface StepItem {
|
|
1621
|
+
/**
|
|
1622
|
+
* Label to display for the step
|
|
1623
|
+
*/
|
|
1624
|
+
label: string;
|
|
1625
|
+
/**
|
|
1626
|
+
* Optional description text
|
|
1627
|
+
*/
|
|
1628
|
+
description?: string;
|
|
1629
|
+
/**
|
|
1630
|
+
* Custom icon to display instead of number
|
|
1631
|
+
*/
|
|
1632
|
+
icon?: ReactNode;
|
|
1633
|
+
/**
|
|
1634
|
+
* Custom status for this specific step
|
|
1635
|
+
*/
|
|
1636
|
+
status?: StepStatus;
|
|
1637
|
+
/**
|
|
1638
|
+
* Whether this step is disabled
|
|
1639
|
+
*/
|
|
1640
|
+
disabled?: boolean;
|
|
1641
|
+
}
|
|
1642
|
+
interface StepperProps {
|
|
1643
|
+
/**
|
|
1644
|
+
* Array of step configurations
|
|
1645
|
+
*/
|
|
1646
|
+
steps: StepItem[];
|
|
1647
|
+
/**
|
|
1648
|
+
* Current active step index (0-based)
|
|
1649
|
+
*/
|
|
1650
|
+
currentStep: number;
|
|
1651
|
+
/**
|
|
1652
|
+
* Theme color
|
|
1653
|
+
*/
|
|
1654
|
+
color?: StepperColor;
|
|
1655
|
+
/**
|
|
1656
|
+
* Size variant
|
|
1657
|
+
*/
|
|
1658
|
+
size?: StepperSize;
|
|
1659
|
+
/**
|
|
1660
|
+
* Visual style variant
|
|
1661
|
+
*/
|
|
1662
|
+
variant?: StepperVariant;
|
|
1663
|
+
/**
|
|
1664
|
+
* Layout orientation
|
|
1665
|
+
*/
|
|
1666
|
+
orientation?: StepperOrientation;
|
|
1667
|
+
/**
|
|
1668
|
+
* Stepper type - numbered circles or dots
|
|
1669
|
+
*/
|
|
1670
|
+
type?: StepperType;
|
|
1671
|
+
/**
|
|
1672
|
+
* Overall status (applies to current step if step doesn't have custom status)
|
|
1673
|
+
*/
|
|
1674
|
+
status?: StepStatus;
|
|
1675
|
+
/**
|
|
1676
|
+
* Click handler for step navigation
|
|
1677
|
+
*/
|
|
1678
|
+
onStepClick?: (index: number) => void;
|
|
1679
|
+
/**
|
|
1680
|
+
* Additional CSS class
|
|
1681
|
+
*/
|
|
1682
|
+
className?: string;
|
|
1683
|
+
}
|
|
1684
|
+
|
|
1685
|
+
declare const Stepper: React__default.NamedExoticComponent<StepperProps>;
|
|
1686
|
+
|
|
1687
|
+
type SwitchColor = 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
1688
|
+
type SwitchSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1689
|
+
interface SwitchProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'ref'> {
|
|
1690
|
+
/**
|
|
1691
|
+
* Theme color
|
|
1692
|
+
*/
|
|
1693
|
+
color?: SwitchColor;
|
|
1694
|
+
/**
|
|
1695
|
+
* Size variant
|
|
1696
|
+
*/
|
|
1697
|
+
size?: SwitchSize;
|
|
1698
|
+
/**
|
|
1699
|
+
* Label text
|
|
1700
|
+
*/
|
|
1701
|
+
label?: string;
|
|
1702
|
+
/**
|
|
1703
|
+
* Helper text or instructions
|
|
1704
|
+
*/
|
|
1705
|
+
helperText?: string;
|
|
1706
|
+
/**
|
|
1707
|
+
* Error message
|
|
1708
|
+
*/
|
|
1709
|
+
error?: string;
|
|
1710
|
+
/**
|
|
1711
|
+
* Whether switch is in loading state
|
|
1712
|
+
*/
|
|
1713
|
+
loading?: boolean;
|
|
1714
|
+
/**
|
|
1715
|
+
* Additional CSS class
|
|
1716
|
+
*/
|
|
1717
|
+
className?: string;
|
|
1718
|
+
/**
|
|
1719
|
+
* Reference to the input element
|
|
1720
|
+
*/
|
|
1721
|
+
ref?: React.Ref<HTMLInputElement>;
|
|
1722
|
+
}
|
|
1723
|
+
|
|
1724
|
+
declare const Switch: React__default.NamedExoticComponent<SwitchProps>;
|
|
1725
|
+
|
|
1726
|
+
type TableVariant = 'outline' | 'line' | 'ghost';
|
|
1727
|
+
type TableSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1728
|
+
type TableColor = ComponentColor;
|
|
1729
|
+
interface ColumnGroup {
|
|
1730
|
+
id: string;
|
|
1731
|
+
header: string;
|
|
1732
|
+
columns: string[];
|
|
1733
|
+
}
|
|
1734
|
+
type PaginationPosition = 'topleft' | 'topcenter' | 'topright' | 'bottomleft' | 'bottomcenter' | 'bottomright';
|
|
1735
|
+
/**
|
|
1736
|
+
* Event fired when a cell is edited
|
|
1737
|
+
*/
|
|
1738
|
+
interface CellEditEvent<TData = unknown, TValue = unknown> {
|
|
1739
|
+
rowIndex: number;
|
|
1740
|
+
columnId: string;
|
|
1741
|
+
value: TValue;
|
|
1742
|
+
row: TData;
|
|
1743
|
+
}
|
|
1744
|
+
interface TableProps<TData> {
|
|
1745
|
+
data: TData[];
|
|
1746
|
+
columns: ColumnDef<TData, any>[];
|
|
1747
|
+
columnGroups?: ColumnGroup[];
|
|
1748
|
+
variant?: TableVariant;
|
|
1749
|
+
size?: TableSize;
|
|
1750
|
+
color?: TableColor;
|
|
1751
|
+
striped?: boolean;
|
|
1752
|
+
hoverable?: boolean;
|
|
1753
|
+
bordered?: boolean;
|
|
1754
|
+
enableSorting?: boolean;
|
|
1755
|
+
enableFiltering?: boolean;
|
|
1756
|
+
enablePagination?: boolean;
|
|
1757
|
+
enableRowSelection?: boolean;
|
|
1758
|
+
enableMultiRowSelection?: boolean;
|
|
1759
|
+
enableRowPinning?: boolean;
|
|
1760
|
+
enableExpandable?: boolean;
|
|
1761
|
+
enableGrouping?: boolean;
|
|
1762
|
+
enableVirtualization?: boolean;
|
|
1763
|
+
enableClickToSelect?: boolean;
|
|
1764
|
+
enableColumnPinning?: boolean;
|
|
1765
|
+
enableActions?: boolean;
|
|
1766
|
+
paginationPosition?: PaginationPosition;
|
|
1767
|
+
expandedContent?: (row: Row<TData>) => React.ReactNode;
|
|
1768
|
+
footer?: React.ReactNode;
|
|
1769
|
+
emptyState?: React.ReactNode;
|
|
1770
|
+
loading?: boolean;
|
|
1771
|
+
loadingRows?: number;
|
|
1772
|
+
pageSize?: number;
|
|
1773
|
+
pageSizeOptions?: number[];
|
|
1774
|
+
onRowClick?: (row: TData) => void;
|
|
1775
|
+
onSelectionChange?: (selectedRows: TData[]) => void;
|
|
1776
|
+
onCellEdit?: (event: CellEditEvent<TData>) => void;
|
|
1777
|
+
pinnedRowIds?: string[];
|
|
1778
|
+
onPinnedRowsChange?: (pinnedRowIds: string[]) => void;
|
|
1779
|
+
className?: string;
|
|
1780
|
+
}
|
|
1781
|
+
|
|
1782
|
+
declare function Table<TData>({ data, columns, columnGroups, variant, size: initialSize, color, striped, hoverable, bordered, enableSorting, enableFiltering, enablePagination, enableRowSelection, enableMultiRowSelection, enableRowPinning, enableExpandable, enableGrouping, enableVirtualization, enableClickToSelect, enableColumnPinning, enableActions, paginationPosition, expandedContent, footer, emptyState, loading, loadingRows, pageSize, pageSizeOptions, onRowClick, onSelectionChange, onCellEdit, pinnedRowIds, onPinnedRowsChange, className, }: TableProps<TData>): react_jsx_runtime.JSX.Element;
|
|
1783
|
+
declare namespace Table {
|
|
1784
|
+
var displayName: string;
|
|
1785
|
+
}
|
|
1786
|
+
|
|
1787
|
+
type TabsColor = 'default' | 'primary' | 'secondary' | 'accent' | 'success' | 'error' | 'warning' | 'info';
|
|
1788
|
+
type TabsVariant = 'default' | 'solid' | 'soft' | 'pill';
|
|
1789
|
+
type TabsSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1790
|
+
interface TabItem {
|
|
1791
|
+
/**
|
|
1792
|
+
* Unique key for the tab
|
|
1793
|
+
*/
|
|
1794
|
+
key: string;
|
|
1795
|
+
/**
|
|
1796
|
+
* Display label for the tab
|
|
1797
|
+
*/
|
|
1798
|
+
label: string;
|
|
1799
|
+
/**
|
|
1800
|
+
* Content to display when tab is active
|
|
1801
|
+
*/
|
|
1802
|
+
content?: React.ReactNode;
|
|
1803
|
+
/**
|
|
1804
|
+
* Optional icon to display before label
|
|
1805
|
+
*/
|
|
1806
|
+
icon?: React.ReactNode;
|
|
1807
|
+
/**
|
|
1808
|
+
* Whether tab is disabled
|
|
1809
|
+
*/
|
|
1810
|
+
disabled?: boolean;
|
|
1811
|
+
}
|
|
1812
|
+
interface TabsProps {
|
|
1813
|
+
/**
|
|
1814
|
+
* Array of tab items
|
|
1815
|
+
*/
|
|
1816
|
+
items: TabItem[];
|
|
1817
|
+
/**
|
|
1818
|
+
* Default active tab key (uncontrolled)
|
|
1819
|
+
*/
|
|
1820
|
+
defaultActiveKey?: string;
|
|
1821
|
+
/**
|
|
1822
|
+
* Active tab key (controlled)
|
|
1823
|
+
*/
|
|
1824
|
+
activeKey?: string;
|
|
1825
|
+
/**
|
|
1826
|
+
* Theme color
|
|
1827
|
+
*/
|
|
1828
|
+
color?: TabsColor;
|
|
1829
|
+
/**
|
|
1830
|
+
* Size variant
|
|
1831
|
+
*/
|
|
1832
|
+
size?: TabsSize;
|
|
1833
|
+
/**
|
|
1834
|
+
* Visual style variant
|
|
1835
|
+
*/
|
|
1836
|
+
variant?: TabsVariant;
|
|
1837
|
+
/**
|
|
1838
|
+
* Callback when active tab changes
|
|
1839
|
+
*/
|
|
1840
|
+
onChange?: (key: string) => void;
|
|
1841
|
+
/**
|
|
1842
|
+
* Additional CSS class
|
|
1843
|
+
*/
|
|
1844
|
+
className?: string;
|
|
1845
|
+
}
|
|
1846
|
+
|
|
1847
|
+
declare const Tabs: React__default.NamedExoticComponent<TabsProps>;
|
|
1848
|
+
|
|
1849
|
+
type TextareaVariant = 'outline' | 'filled';
|
|
1850
|
+
type TextareaSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1851
|
+
type TextareaResize = 'none' | 'vertical' | 'horizontal' | 'both';
|
|
1852
|
+
interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size' | 'ref'> {
|
|
1853
|
+
/**
|
|
1854
|
+
* Visual style variant
|
|
1855
|
+
*/
|
|
1856
|
+
variant?: TextareaVariant;
|
|
1857
|
+
/**
|
|
1858
|
+
* Size variant
|
|
1859
|
+
*/
|
|
1860
|
+
size?: TextareaSize;
|
|
1861
|
+
/**
|
|
1862
|
+
* Label text
|
|
1863
|
+
*/
|
|
1864
|
+
label?: string;
|
|
1865
|
+
/**
|
|
1866
|
+
* Helper text
|
|
1867
|
+
*/
|
|
1868
|
+
helperText?: string;
|
|
1869
|
+
/**
|
|
1870
|
+
* Position of validation/helper messages
|
|
1871
|
+
*/
|
|
1872
|
+
messagePosition?: MessagePosition;
|
|
1873
|
+
/**
|
|
1874
|
+
* Error message
|
|
1875
|
+
*/
|
|
1876
|
+
error?: string;
|
|
1877
|
+
/**
|
|
1878
|
+
* Warning message
|
|
1879
|
+
*/
|
|
1880
|
+
warning?: string;
|
|
1881
|
+
/**
|
|
1882
|
+
* Info message
|
|
1883
|
+
*/
|
|
1884
|
+
info?: string;
|
|
1885
|
+
/**
|
|
1886
|
+
* Success message
|
|
1887
|
+
*/
|
|
1888
|
+
success?: string;
|
|
1889
|
+
/**
|
|
1890
|
+
* Resize behavior
|
|
1891
|
+
*/
|
|
1892
|
+
resize?: TextareaResize;
|
|
1893
|
+
/**
|
|
1894
|
+
* Whether to show character count
|
|
1895
|
+
*/
|
|
1896
|
+
showCount?: boolean;
|
|
1897
|
+
/**
|
|
1898
|
+
* Maximum character length
|
|
1899
|
+
*/
|
|
1900
|
+
maxLength?: number;
|
|
1901
|
+
/**
|
|
1902
|
+
* Auto-resize height based on content
|
|
1903
|
+
*/
|
|
1904
|
+
autoResize?: boolean;
|
|
1905
|
+
/**
|
|
1906
|
+
* Whether textarea should take full width
|
|
1907
|
+
*/
|
|
1908
|
+
fullWidth?: boolean;
|
|
1909
|
+
/**
|
|
1910
|
+
* Additional CSS class
|
|
1911
|
+
*/
|
|
1912
|
+
className?: string;
|
|
1913
|
+
/**
|
|
1914
|
+
* Reference to the textarea element
|
|
1915
|
+
*/
|
|
1916
|
+
ref?: React.Ref<HTMLTextAreaElement>;
|
|
1917
|
+
}
|
|
1918
|
+
|
|
1919
|
+
declare const Textarea: React__default.NamedExoticComponent<TextareaProps>;
|
|
1920
|
+
|
|
1921
|
+
type ToggleVariant = 'default' | 'solid' | 'soft';
|
|
1922
|
+
type ToggleSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1923
|
+
interface SingleToggleProps {
|
|
1924
|
+
/**
|
|
1925
|
+
* Pressed state (controlled)
|
|
1926
|
+
*/
|
|
1927
|
+
pressed?: boolean;
|
|
1928
|
+
/**
|
|
1929
|
+
* Default initial pressed state (uncontrolled)
|
|
1930
|
+
*/
|
|
1931
|
+
defaultPressed?: boolean;
|
|
1932
|
+
/**
|
|
1933
|
+
* Theme color
|
|
1934
|
+
*/
|
|
1935
|
+
color?: ComponentColor;
|
|
1936
|
+
/**
|
|
1937
|
+
* Size variant (toggle only supports xs, sm, md, lg)
|
|
1938
|
+
*/
|
|
1939
|
+
size?: ToggleSize;
|
|
1940
|
+
/**
|
|
1941
|
+
* Visual style variant
|
|
1942
|
+
*/
|
|
1943
|
+
variant?: ToggleVariant;
|
|
1944
|
+
/**
|
|
1945
|
+
* Callback when pressed state changes
|
|
1946
|
+
*/
|
|
1947
|
+
onChange?: (pressed: boolean) => void;
|
|
1948
|
+
/**
|
|
1949
|
+
* Whether toggle is disabled
|
|
1950
|
+
*/
|
|
1951
|
+
disabled?: boolean;
|
|
1952
|
+
/**
|
|
1953
|
+
* Optional icon to display
|
|
1954
|
+
*/
|
|
1955
|
+
icon?: React.ReactNode;
|
|
1956
|
+
/**
|
|
1957
|
+
* Children elements (label text)
|
|
1958
|
+
*/
|
|
1959
|
+
children?: React.ReactNode;
|
|
1960
|
+
/**
|
|
1961
|
+
* Additional CSS class
|
|
1962
|
+
*/
|
|
1963
|
+
className?: string;
|
|
1964
|
+
}
|
|
1965
|
+
|
|
1966
|
+
declare const Toggle: React__default.NamedExoticComponent<SingleToggleProps>;
|
|
1967
|
+
|
|
1968
|
+
type ToggleGroupVariant = 'default' | 'solid' | 'soft';
|
|
1969
|
+
type ToggleGroupSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
1970
|
+
interface ToggleGroupOption {
|
|
1971
|
+
/**
|
|
1972
|
+
* Display label for the option
|
|
1973
|
+
*/
|
|
1974
|
+
label: string;
|
|
1975
|
+
/**
|
|
1976
|
+
* Unique value for the option
|
|
1977
|
+
*/
|
|
1978
|
+
value: string;
|
|
1979
|
+
/**
|
|
1980
|
+
* Optional icon to display
|
|
1981
|
+
*/
|
|
1982
|
+
icon?: React.ReactNode;
|
|
1983
|
+
/**
|
|
1984
|
+
* Whether option is disabled
|
|
1985
|
+
*/
|
|
1986
|
+
disabled?: boolean;
|
|
1987
|
+
}
|
|
1988
|
+
interface ToggleGroupProps {
|
|
1989
|
+
/**
|
|
1990
|
+
* Array of toggle options
|
|
1991
|
+
*/
|
|
1992
|
+
options: ToggleGroupOption[];
|
|
1993
|
+
/**
|
|
1994
|
+
* Current value (controlled) - single value or array for multiple
|
|
1995
|
+
*/
|
|
1996
|
+
value?: string | string[];
|
|
1997
|
+
/**
|
|
1998
|
+
* Default initial value (uncontrolled)
|
|
1999
|
+
*/
|
|
2000
|
+
defaultValue?: string | string[];
|
|
2001
|
+
/**
|
|
2002
|
+
* Enable multiple selection
|
|
2003
|
+
*/
|
|
2004
|
+
multiple?: boolean;
|
|
2005
|
+
/**
|
|
2006
|
+
* Theme color
|
|
2007
|
+
*/
|
|
2008
|
+
color?: ComponentColor;
|
|
2009
|
+
/**
|
|
2010
|
+
* Size variant (toggle-group only supports xs, sm, md, lg)
|
|
2011
|
+
*/
|
|
2012
|
+
size?: ToggleGroupSize;
|
|
2013
|
+
/**
|
|
2014
|
+
* Visual style variant
|
|
2015
|
+
*/
|
|
2016
|
+
variant?: ToggleGroupVariant;
|
|
2017
|
+
/**
|
|
2018
|
+
* Callback when value changes
|
|
2019
|
+
*/
|
|
2020
|
+
onChange?: (value: string | string[]) => void;
|
|
2021
|
+
/**
|
|
2022
|
+
* Make toggle group take full width
|
|
2023
|
+
*/
|
|
2024
|
+
fullWidth?: boolean;
|
|
2025
|
+
/**
|
|
2026
|
+
* Whether toggle group is disabled
|
|
2027
|
+
*/
|
|
2028
|
+
disabled?: boolean;
|
|
2029
|
+
/**
|
|
2030
|
+
* Additional CSS class
|
|
2031
|
+
*/
|
|
2032
|
+
className?: string;
|
|
2033
|
+
/**
|
|
2034
|
+
* Center align content
|
|
2035
|
+
*/
|
|
2036
|
+
centered?: boolean;
|
|
2037
|
+
}
|
|
2038
|
+
|
|
2039
|
+
declare const ToggleGroup: React__default.NamedExoticComponent<ToggleGroupProps>;
|
|
2040
|
+
|
|
2041
|
+
type TooltipVariant = 'solid' | 'soft';
|
|
2042
|
+
type TooltipColor = ComponentColor;
|
|
2043
|
+
type TooltipSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
2044
|
+
interface TooltipProps {
|
|
2045
|
+
/**
|
|
2046
|
+
* Tooltip content
|
|
2047
|
+
*/
|
|
2048
|
+
content: React.ReactNode;
|
|
2049
|
+
/**
|
|
2050
|
+
* Children element (trigger)
|
|
2051
|
+
*/
|
|
2052
|
+
children: React.ReactElement;
|
|
2053
|
+
/**
|
|
2054
|
+
* Theme color
|
|
2055
|
+
*/
|
|
2056
|
+
color?: TooltipColor;
|
|
2057
|
+
/**
|
|
2058
|
+
* Size variant
|
|
2059
|
+
*/
|
|
2060
|
+
size?: TooltipSize;
|
|
2061
|
+
/**
|
|
2062
|
+
* Visual style variant
|
|
2063
|
+
*/
|
|
2064
|
+
variant?: TooltipVariant;
|
|
2065
|
+
/**
|
|
2066
|
+
* Side to display tooltip
|
|
2067
|
+
*/
|
|
2068
|
+
side?: 'top' | 'right' | 'bottom' | 'left';
|
|
2069
|
+
/**
|
|
2070
|
+
* Alignment of tooltip
|
|
2071
|
+
*/
|
|
2072
|
+
align?: 'start' | 'center' | 'end';
|
|
2073
|
+
/**
|
|
2074
|
+
* Delay before tooltip appears (milliseconds)
|
|
2075
|
+
*/
|
|
2076
|
+
delayDuration?: number;
|
|
2077
|
+
/**
|
|
2078
|
+
* Whether tooltip is disabled
|
|
2079
|
+
*/
|
|
2080
|
+
disabled?: boolean;
|
|
2081
|
+
/**
|
|
2082
|
+
* Additional CSS class
|
|
2083
|
+
*/
|
|
2084
|
+
className?: string;
|
|
2085
|
+
}
|
|
2086
|
+
|
|
2087
|
+
declare const Tooltip: React__default.NamedExoticComponent<TooltipProps>;
|
|
2088
|
+
|
|
2089
|
+
type TreeSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
2090
|
+
interface TreeNode {
|
|
2091
|
+
/**
|
|
2092
|
+
* Unique key for the node
|
|
2093
|
+
*/
|
|
2094
|
+
key: string;
|
|
2095
|
+
/**
|
|
2096
|
+
* Display label for the node
|
|
2097
|
+
*/
|
|
2098
|
+
label: string;
|
|
2099
|
+
/**
|
|
2100
|
+
* Optional icon to display
|
|
2101
|
+
*/
|
|
2102
|
+
icon?: React.ReactNode;
|
|
2103
|
+
/**
|
|
2104
|
+
* Child nodes
|
|
2105
|
+
*/
|
|
2106
|
+
children?: TreeNode[];
|
|
2107
|
+
/**
|
|
2108
|
+
* Whether node is disabled
|
|
2109
|
+
*/
|
|
2110
|
+
disabled?: boolean;
|
|
2111
|
+
/**
|
|
2112
|
+
* Force node to be treated as leaf (no expand icon)
|
|
2113
|
+
*/
|
|
2114
|
+
isLeaf?: boolean;
|
|
2115
|
+
}
|
|
2116
|
+
interface TreeProps {
|
|
2117
|
+
/**
|
|
2118
|
+
* Tree data
|
|
2119
|
+
*/
|
|
2120
|
+
data: TreeNode[];
|
|
2121
|
+
/**
|
|
2122
|
+
* Default expanded node keys (uncontrolled)
|
|
2123
|
+
*/
|
|
2124
|
+
defaultExpandedKeys?: string[];
|
|
2125
|
+
/**
|
|
2126
|
+
* Expanded node keys (controlled)
|
|
2127
|
+
*/
|
|
2128
|
+
expandedKeys?: string[];
|
|
2129
|
+
/**
|
|
2130
|
+
* Callback when expanded keys change
|
|
2131
|
+
*/
|
|
2132
|
+
onExpand?: (expandedKeys: string[]) => void;
|
|
2133
|
+
/**
|
|
2134
|
+
* Enable checkboxes
|
|
2135
|
+
*/
|
|
2136
|
+
checkable?: boolean;
|
|
2137
|
+
/**
|
|
2138
|
+
* Checked node keys (controlled)
|
|
2139
|
+
*/
|
|
2140
|
+
checkedKeys?: string[];
|
|
2141
|
+
/**
|
|
2142
|
+
* Default checked node keys (uncontrolled)
|
|
2143
|
+
*/
|
|
2144
|
+
defaultCheckedKeys?: string[];
|
|
2145
|
+
/**
|
|
2146
|
+
* Callback when checked keys change
|
|
2147
|
+
*/
|
|
2148
|
+
onCheck?: (checkedKeys: string[], info: {
|
|
2149
|
+
checked: boolean;
|
|
2150
|
+
node: TreeNode;
|
|
2151
|
+
checkedNodes: TreeNode[];
|
|
2152
|
+
}) => void;
|
|
2153
|
+
/**
|
|
2154
|
+
* Enable selection
|
|
2155
|
+
*/
|
|
2156
|
+
selectable?: boolean;
|
|
2157
|
+
/**
|
|
2158
|
+
* Selected node keys (controlled)
|
|
2159
|
+
*/
|
|
2160
|
+
selectedKeys?: string[];
|
|
2161
|
+
/**
|
|
2162
|
+
* Default selected node keys (uncontrolled)
|
|
2163
|
+
*/
|
|
2164
|
+
defaultSelectedKeys?: string[];
|
|
2165
|
+
/**
|
|
2166
|
+
* Callback when selected keys change
|
|
2167
|
+
*/
|
|
2168
|
+
onSelect?: (selectedKeys: string[], info: {
|
|
2169
|
+
selected: boolean;
|
|
2170
|
+
node: TreeNode;
|
|
2171
|
+
}) => void;
|
|
2172
|
+
/**
|
|
2173
|
+
* Whether tree is disabled
|
|
2174
|
+
*/
|
|
2175
|
+
disabled?: boolean;
|
|
2176
|
+
/**
|
|
2177
|
+
* Size variant (tree only supports xs, sm, md, lg)
|
|
2178
|
+
*/
|
|
2179
|
+
size?: TreeSize;
|
|
2180
|
+
/**
|
|
2181
|
+
* Whether to show connecting lines
|
|
2182
|
+
*/
|
|
2183
|
+
showLine?: boolean;
|
|
2184
|
+
/**
|
|
2185
|
+
* Whether to show node icons
|
|
2186
|
+
*/
|
|
2187
|
+
showIcon?: boolean;
|
|
2188
|
+
/**
|
|
2189
|
+
* Expand all nodes by default
|
|
2190
|
+
*/
|
|
2191
|
+
defaultExpandAll?: boolean;
|
|
2192
|
+
/**
|
|
2193
|
+
* Additional CSS class
|
|
2194
|
+
*/
|
|
2195
|
+
className?: string;
|
|
2196
|
+
}
|
|
2197
|
+
|
|
2198
|
+
declare const Tree: React__default.NamedExoticComponent<TreeProps>;
|
|
2199
|
+
|
|
2200
|
+
type TreeSelectSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
2201
|
+
interface TreeSelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {
|
|
2202
|
+
/**
|
|
2203
|
+
* Size variant (tree-select only supports xs, sm, md, lg)
|
|
2204
|
+
*/
|
|
2205
|
+
size?: TreeSelectSize;
|
|
2206
|
+
/**
|
|
2207
|
+
* Label text
|
|
2208
|
+
*/
|
|
2209
|
+
label?: string;
|
|
2210
|
+
/**
|
|
2211
|
+
* Helper text
|
|
2212
|
+
*/
|
|
2213
|
+
helperText?: string;
|
|
2214
|
+
/**
|
|
2215
|
+
* Error message
|
|
2216
|
+
*/
|
|
2217
|
+
error?: string;
|
|
2218
|
+
/**
|
|
2219
|
+
* Warning message
|
|
2220
|
+
*/
|
|
2221
|
+
warning?: string;
|
|
2222
|
+
/**
|
|
2223
|
+
* Info message
|
|
2224
|
+
*/
|
|
2225
|
+
info?: string;
|
|
2226
|
+
/**
|
|
2227
|
+
* Success message
|
|
2228
|
+
*/
|
|
2229
|
+
success?: string;
|
|
2230
|
+
/**
|
|
2231
|
+
* Tree data
|
|
2232
|
+
*/
|
|
2233
|
+
data?: TreeNode[];
|
|
2234
|
+
/**
|
|
2235
|
+
* Placeholder text
|
|
2236
|
+
*/
|
|
2237
|
+
placeholder?: string;
|
|
2238
|
+
/**
|
|
2239
|
+
* Whether tree select is in loading state
|
|
2240
|
+
*/
|
|
2241
|
+
loading?: boolean;
|
|
2242
|
+
/**
|
|
2243
|
+
* Whether tree select should take full width
|
|
2244
|
+
*/
|
|
2245
|
+
fullWidth?: boolean;
|
|
2246
|
+
/**
|
|
2247
|
+
* Current value (controlled) - single key or array for multiple
|
|
2248
|
+
*/
|
|
2249
|
+
value?: string | string[];
|
|
2250
|
+
/**
|
|
2251
|
+
* Default initial value (uncontrolled)
|
|
2252
|
+
*/
|
|
2253
|
+
defaultValue?: string | string[];
|
|
2254
|
+
/**
|
|
2255
|
+
* Callback when value changes
|
|
2256
|
+
*/
|
|
2257
|
+
onChange?: (value: string | string[], selectedNodes: TreeNode[]) => void;
|
|
2258
|
+
/**
|
|
2259
|
+
* Whether tree select is disabled
|
|
2260
|
+
*/
|
|
2261
|
+
disabled?: boolean;
|
|
2262
|
+
/**
|
|
2263
|
+
* Whether field is required
|
|
2264
|
+
*/
|
|
2265
|
+
required?: boolean;
|
|
2266
|
+
/**
|
|
2267
|
+
* Enable multiple selection
|
|
2268
|
+
*/
|
|
2269
|
+
multiple?: boolean;
|
|
2270
|
+
/**
|
|
2271
|
+
* Enable checkboxes for selection
|
|
2272
|
+
*/
|
|
2273
|
+
checkable?: boolean;
|
|
2274
|
+
/**
|
|
2275
|
+
* Enable search functionality
|
|
2276
|
+
*/
|
|
2277
|
+
searchable?: boolean;
|
|
2278
|
+
/**
|
|
2279
|
+
* Maximum number of chips visible in multiple mode
|
|
2280
|
+
*/
|
|
2281
|
+
maxChipsVisible?: number;
|
|
2282
|
+
/**
|
|
2283
|
+
* Maximum height of dropdown
|
|
2284
|
+
*/
|
|
2285
|
+
maxDropdownHeight?: number;
|
|
2286
|
+
/**
|
|
2287
|
+
* Expand all nodes by default
|
|
2288
|
+
*/
|
|
2289
|
+
defaultExpandAll?: boolean;
|
|
2290
|
+
/**
|
|
2291
|
+
* Default expanded node keys
|
|
2292
|
+
*/
|
|
2293
|
+
defaultExpandedKeys?: string[];
|
|
2294
|
+
/**
|
|
2295
|
+
* Whether to show connecting lines
|
|
2296
|
+
*/
|
|
2297
|
+
showLine?: boolean;
|
|
2298
|
+
/**
|
|
2299
|
+
* Whether to show node icons
|
|
2300
|
+
*/
|
|
2301
|
+
showIcon?: boolean;
|
|
2302
|
+
/**
|
|
2303
|
+
* Additional CSS class
|
|
2304
|
+
*/
|
|
2305
|
+
className?: string;
|
|
2306
|
+
/**
|
|
2307
|
+
* Reference to the div element
|
|
2308
|
+
*/
|
|
2309
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
2310
|
+
}
|
|
2311
|
+
|
|
2312
|
+
declare const TreeSelect: React__default.NamedExoticComponent<TreeSelectProps>;
|
|
2313
|
+
|
|
2314
|
+
type UploadVariant = 'button' | 'dropzone' | 'dragger' | 'picture' | 'avatar';
|
|
2315
|
+
type UploadSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
2316
|
+
type UploadColor = ButtonColor$1;
|
|
2317
|
+
interface UploadFile {
|
|
2318
|
+
uid: string;
|
|
2319
|
+
name: string;
|
|
2320
|
+
size: number;
|
|
2321
|
+
type: string;
|
|
2322
|
+
status?: 'uploading' | 'done' | 'error' | 'removed';
|
|
2323
|
+
percent?: number;
|
|
2324
|
+
url?: string;
|
|
2325
|
+
thumbUrl?: string;
|
|
2326
|
+
response?: any;
|
|
2327
|
+
error?: any;
|
|
2328
|
+
}
|
|
2329
|
+
interface UploadProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'onChange' | 'onError'> {
|
|
2330
|
+
variant?: UploadVariant;
|
|
2331
|
+
size?: UploadSize;
|
|
2332
|
+
color?: UploadColor;
|
|
2333
|
+
label?: string;
|
|
2334
|
+
helperText?: string;
|
|
2335
|
+
error?: string;
|
|
2336
|
+
warning?: string;
|
|
2337
|
+
info?: string;
|
|
2338
|
+
success?: string;
|
|
2339
|
+
accept?: string;
|
|
2340
|
+
multiple?: boolean;
|
|
2341
|
+
maxSize?: number;
|
|
2342
|
+
maxCount?: number;
|
|
2343
|
+
fileList?: UploadFile[];
|
|
2344
|
+
defaultFileList?: UploadFile[];
|
|
2345
|
+
showUploadList?: boolean;
|
|
2346
|
+
listType?: 'text' | 'picture' | 'picture-card';
|
|
2347
|
+
disabled?: boolean;
|
|
2348
|
+
buttonText?: string;
|
|
2349
|
+
dragText?: string;
|
|
2350
|
+
dragHint?: string;
|
|
2351
|
+
onChange?: (fileList: UploadFile[]) => void;
|
|
2352
|
+
onRemove?: (file: UploadFile) => void;
|
|
2353
|
+
beforeUpload?: (file: File) => boolean | Promise<boolean>;
|
|
2354
|
+
customRequest?: (options: {
|
|
2355
|
+
file: File;
|
|
2356
|
+
onProgress: (percent: number) => void;
|
|
2357
|
+
onSuccess: (response: any) => void;
|
|
2358
|
+
onError: (error: any) => void;
|
|
2359
|
+
}) => void;
|
|
2360
|
+
onError?: (error: string, file: File) => void;
|
|
2361
|
+
className?: string;
|
|
2362
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
2363
|
+
}
|
|
2364
|
+
|
|
2365
|
+
declare const Upload: React__default.NamedExoticComponent<UploadProps>;
|
|
2366
|
+
|
|
2367
|
+
type ChartSize = 'sm' | 'md' | 'lg' | 'xl';
|
|
2368
|
+
interface ChartDataPoint {
|
|
2369
|
+
[key: string]: string | number;
|
|
2370
|
+
}
|
|
2371
|
+
interface ChartSeries {
|
|
2372
|
+
dataKey: string;
|
|
2373
|
+
name?: string;
|
|
2374
|
+
color?: string;
|
|
2375
|
+
type?: 'line' | 'bar' | 'area';
|
|
2376
|
+
}
|
|
2377
|
+
interface BaseChartProps {
|
|
2378
|
+
data: ChartDataPoint[];
|
|
2379
|
+
size?: ChartSize;
|
|
2380
|
+
className?: string;
|
|
2381
|
+
loading?: boolean;
|
|
2382
|
+
}
|
|
2383
|
+
interface CartesianChartProps extends BaseChartProps {
|
|
2384
|
+
xAxisKey: string;
|
|
2385
|
+
series: ChartSeries[];
|
|
2386
|
+
showGrid?: boolean;
|
|
2387
|
+
showLegend?: boolean;
|
|
2388
|
+
showTooltip?: boolean;
|
|
2389
|
+
xAxisLabel?: string;
|
|
2390
|
+
yAxisLabel?: string;
|
|
2391
|
+
}
|
|
2392
|
+
interface PieChartProps extends BaseChartProps {
|
|
2393
|
+
dataKey: string;
|
|
2394
|
+
nameKey: string;
|
|
2395
|
+
showLegend?: boolean;
|
|
2396
|
+
showTooltip?: boolean;
|
|
2397
|
+
innerRadius?: number;
|
|
2398
|
+
}
|
|
2399
|
+
interface LineChartProps extends CartesianChartProps {
|
|
2400
|
+
type?: 'line';
|
|
2401
|
+
}
|
|
2402
|
+
interface BarChartProps extends CartesianChartProps {
|
|
2403
|
+
type?: 'bar';
|
|
2404
|
+
}
|
|
2405
|
+
interface AreaChartProps extends CartesianChartProps {
|
|
2406
|
+
type?: 'area';
|
|
2407
|
+
}
|
|
2408
|
+
interface ComposedChartProps extends CartesianChartProps {
|
|
2409
|
+
type?: 'composed';
|
|
2410
|
+
}
|
|
2411
|
+
|
|
2412
|
+
declare const LineChart: React__default.NamedExoticComponent<LineChartProps>;
|
|
2413
|
+
declare const BarChart: React__default.NamedExoticComponent<BarChartProps>;
|
|
2414
|
+
declare const AreaChart: React__default.NamedExoticComponent<AreaChartProps>;
|
|
2415
|
+
declare const ComposedChart: React__default.NamedExoticComponent<ComposedChartProps>;
|
|
2416
|
+
declare const PieChart: React__default.NamedExoticComponent<PieChartProps>;
|
|
2417
|
+
|
|
2418
|
+
/**
|
|
2419
|
+
* Command component types
|
|
2420
|
+
* Note: Most command components use React.ComponentProps with the underlying
|
|
2421
|
+
* cmdk primitives and add a size prop
|
|
2422
|
+
*/
|
|
2423
|
+
type CommandSize = 'sm' | 'md' | 'lg';
|
|
2424
|
+
|
|
2425
|
+
declare function Command({ className, size, ...props }: React$1.ComponentProps<typeof Command$1> & {
|
|
2426
|
+
size?: 'sm' | 'md' | 'lg';
|
|
2427
|
+
}): react_jsx_runtime.JSX.Element;
|
|
2428
|
+
declare function CommandModal({ title, description, children, className, showCloseButton, size, ...props }: React$1.ComponentProps<typeof Modal> & {
|
|
2429
|
+
title?: string;
|
|
2430
|
+
description?: string;
|
|
2431
|
+
className?: string;
|
|
2432
|
+
showCloseButton?: boolean;
|
|
2433
|
+
size?: 'sm' | 'md' | 'lg';
|
|
2434
|
+
}): react_jsx_runtime.JSX.Element;
|
|
2435
|
+
declare function CommandInput({ className, size, ...props }: Omit<React$1.ComponentProps<typeof Command$1.Input>, 'size'> & {
|
|
2436
|
+
size?: CommandSize;
|
|
2437
|
+
}): react_jsx_runtime.JSX.Element;
|
|
2438
|
+
declare function CommandList({ className, size, ...props }: React$1.ComponentProps<typeof Command$1.List> & {
|
|
2439
|
+
size?: 'sm' | 'md' | 'lg';
|
|
2440
|
+
}): react_jsx_runtime.JSX.Element;
|
|
2441
|
+
declare function CommandEmpty({ size, ...props }: React$1.ComponentProps<typeof Command$1.Empty> & {
|
|
2442
|
+
size?: 'sm' | 'md' | 'lg';
|
|
2443
|
+
}): react_jsx_runtime.JSX.Element;
|
|
2444
|
+
declare function CommandGroup({ className, size, ...props }: React$1.ComponentProps<typeof Command$1.Group> & {
|
|
2445
|
+
size?: 'sm' | 'md' | 'lg';
|
|
2446
|
+
}): react_jsx_runtime.JSX.Element;
|
|
2447
|
+
declare function CommandSeparator({ className, size, ...props }: React$1.ComponentProps<typeof Command$1.Separator> & {
|
|
2448
|
+
size?: 'sm' | 'md' | 'lg';
|
|
2449
|
+
}): react_jsx_runtime.JSX.Element;
|
|
2450
|
+
declare function CommandItem({ className, size, ...props }: React$1.ComponentProps<typeof Command$1.Item> & {
|
|
2451
|
+
size?: 'sm' | 'md' | 'lg';
|
|
2452
|
+
}): react_jsx_runtime.JSX.Element;
|
|
2453
|
+
declare function CommandShortcut({ className, size, ...props }: React$1.ComponentProps<'span'> & {
|
|
2454
|
+
size?: 'sm' | 'md' | 'lg';
|
|
2455
|
+
}): react_jsx_runtime.JSX.Element;
|
|
2456
|
+
|
|
2457
|
+
type DatePickerVariant = 'outline' | 'filled';
|
|
2458
|
+
type DatePickerSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
2459
|
+
interface BaseDatePickerProps {
|
|
2460
|
+
variant?: DatePickerVariant;
|
|
2461
|
+
size?: DatePickerSize;
|
|
2462
|
+
label?: string;
|
|
2463
|
+
error?: string;
|
|
2464
|
+
warning?: string;
|
|
2465
|
+
info?: string;
|
|
2466
|
+
success?: string;
|
|
2467
|
+
helperText?: string;
|
|
2468
|
+
messagePosition?: 'top' | 'bottom';
|
|
2469
|
+
placeholder?: string;
|
|
2470
|
+
disabled?: boolean;
|
|
2471
|
+
required?: boolean;
|
|
2472
|
+
clearable?: boolean;
|
|
2473
|
+
fullWidth?: boolean;
|
|
2474
|
+
className?: string;
|
|
2475
|
+
minDate?: Date;
|
|
2476
|
+
maxDate?: Date;
|
|
2477
|
+
dateFormat?: string;
|
|
2478
|
+
showYearDropdown?: boolean;
|
|
2479
|
+
showMonthDropdown?: boolean;
|
|
2480
|
+
}
|
|
2481
|
+
interface DatePickerProps extends BaseDatePickerProps {
|
|
2482
|
+
value?: Date | null;
|
|
2483
|
+
defaultValue?: Date | null;
|
|
2484
|
+
onChange?: (date: Date | null) => void;
|
|
2485
|
+
}
|
|
2486
|
+
interface RangePickerProps extends BaseDatePickerProps {
|
|
2487
|
+
startDate?: Date | null;
|
|
2488
|
+
endDate?: Date | null;
|
|
2489
|
+
defaultStartDate?: Date | null;
|
|
2490
|
+
defaultEndDate?: Date | null;
|
|
2491
|
+
onChange?: (dates: [Date | null, Date | null]) => void;
|
|
2492
|
+
}
|
|
2493
|
+
interface TimePickerProps extends BaseDatePickerProps {
|
|
2494
|
+
value?: Date | null;
|
|
2495
|
+
defaultValue?: Date | null;
|
|
2496
|
+
onChange?: (date: Date | null) => void;
|
|
2497
|
+
timeIntervals?: number;
|
|
2498
|
+
timeFormat?: string;
|
|
2499
|
+
showTimeSelectOnly?: boolean;
|
|
2500
|
+
}
|
|
2501
|
+
|
|
2502
|
+
declare const RangePickerComponent: React__default.NamedExoticComponent<RangePickerProps>;
|
|
2503
|
+
declare const TimePickerComponent: React__default.NamedExoticComponent<TimePickerProps>;
|
|
2504
|
+
|
|
2505
|
+
declare const DatePicker: React__default.NamedExoticComponent<DatePickerProps> & {
|
|
2506
|
+
RangePicker: React__default.NamedExoticComponent<RangePickerProps>;
|
|
2507
|
+
TimePicker: React__default.NamedExoticComponent<TimePickerProps>;
|
|
2508
|
+
};
|
|
2509
|
+
|
|
2510
|
+
type DrawerDirection = 'bottom' | 'top' | 'left' | 'right';
|
|
2511
|
+
interface DrawerProps {
|
|
2512
|
+
/**
|
|
2513
|
+
* Controlled open state
|
|
2514
|
+
*/
|
|
2515
|
+
open?: boolean;
|
|
2516
|
+
/**
|
|
2517
|
+
* Callback when open state changes
|
|
2518
|
+
*/
|
|
2519
|
+
onOpenChange?: (open: boolean) => void;
|
|
2520
|
+
/**
|
|
2521
|
+
* Direction from which drawer slides in
|
|
2522
|
+
*/
|
|
2523
|
+
direction?: DrawerDirection;
|
|
2524
|
+
/**
|
|
2525
|
+
* Whether drawer should be modal (blocking interaction with content behind)
|
|
2526
|
+
*/
|
|
2527
|
+
modal?: boolean;
|
|
2528
|
+
/**
|
|
2529
|
+
* Children elements
|
|
2530
|
+
*/
|
|
2531
|
+
children: React.ReactNode;
|
|
2532
|
+
}
|
|
2533
|
+
interface DrawerTriggerProps {
|
|
2534
|
+
/**
|
|
2535
|
+
* Children elements
|
|
2536
|
+
*/
|
|
2537
|
+
children: React.ReactNode;
|
|
2538
|
+
/**
|
|
2539
|
+
* Whether to render children as child component
|
|
2540
|
+
*/
|
|
2541
|
+
asChild?: boolean;
|
|
2542
|
+
}
|
|
2543
|
+
interface DrawerContentProps {
|
|
2544
|
+
/**
|
|
2545
|
+
* Children elements
|
|
2546
|
+
*/
|
|
2547
|
+
children: React.ReactNode;
|
|
2548
|
+
/**
|
|
2549
|
+
* Additional CSS class
|
|
2550
|
+
*/
|
|
2551
|
+
className?: string;
|
|
2552
|
+
}
|
|
2553
|
+
interface DrawerHeaderProps {
|
|
2554
|
+
/**
|
|
2555
|
+
* Children elements
|
|
2556
|
+
*/
|
|
2557
|
+
children: React.ReactNode;
|
|
2558
|
+
/**
|
|
2559
|
+
* Additional CSS class
|
|
2560
|
+
*/
|
|
2561
|
+
className?: string;
|
|
2562
|
+
}
|
|
2563
|
+
interface DrawerFooterProps {
|
|
2564
|
+
/**
|
|
2565
|
+
* Children elements
|
|
2566
|
+
*/
|
|
2567
|
+
children: React.ReactNode;
|
|
2568
|
+
/**
|
|
2569
|
+
* Additional CSS class
|
|
2570
|
+
*/
|
|
2571
|
+
className?: string;
|
|
2572
|
+
}
|
|
2573
|
+
interface DrawerTitleProps {
|
|
2574
|
+
/**
|
|
2575
|
+
* Children elements
|
|
2576
|
+
*/
|
|
2577
|
+
children: React.ReactNode;
|
|
2578
|
+
/**
|
|
2579
|
+
* Additional CSS class
|
|
2580
|
+
*/
|
|
2581
|
+
className?: string;
|
|
2582
|
+
}
|
|
2583
|
+
interface DrawerDescriptionProps {
|
|
2584
|
+
/**
|
|
2585
|
+
* Children elements
|
|
2586
|
+
*/
|
|
2587
|
+
children: React.ReactNode;
|
|
2588
|
+
/**
|
|
2589
|
+
* Additional CSS class
|
|
2590
|
+
*/
|
|
2591
|
+
className?: string;
|
|
2592
|
+
}
|
|
2593
|
+
interface DrawerCloseProps {
|
|
2594
|
+
/**
|
|
2595
|
+
* Children elements
|
|
2596
|
+
*/
|
|
2597
|
+
children: React.ReactNode;
|
|
2598
|
+
/**
|
|
2599
|
+
* Whether to render children as child component
|
|
2600
|
+
*/
|
|
2601
|
+
asChild?: boolean;
|
|
2602
|
+
}
|
|
2603
|
+
|
|
2604
|
+
declare const Drawer: React__default.NamedExoticComponent<DrawerProps>;
|
|
2605
|
+
declare const DrawerTrigger: React__default.NamedExoticComponent<DrawerTriggerProps>;
|
|
2606
|
+
declare const DrawerPortal: typeof vaul.Portal;
|
|
2607
|
+
interface DrawerOverlayProps extends React__default.HTMLAttributes<HTMLDivElement> {
|
|
2608
|
+
ref?: React__default.Ref<HTMLDivElement>;
|
|
2609
|
+
}
|
|
2610
|
+
declare const DrawerOverlay: React__default.NamedExoticComponent<DrawerOverlayProps>;
|
|
2611
|
+
declare const DrawerContent: React__default.NamedExoticComponent<DrawerContentProps & {
|
|
2612
|
+
direction?: "bottom" | "top" | "left" | "right";
|
|
2613
|
+
size?: "xs" | "sm" | "md" | "lg";
|
|
2614
|
+
}>;
|
|
2615
|
+
declare const DrawerHeader: React__default.NamedExoticComponent<DrawerHeaderProps>;
|
|
2616
|
+
declare const DrawerFooter: React__default.NamedExoticComponent<DrawerFooterProps>;
|
|
2617
|
+
declare const DrawerTitle: React__default.NamedExoticComponent<DrawerTitleProps>;
|
|
2618
|
+
declare const DrawerDescription: React__default.NamedExoticComponent<DrawerDescriptionProps>;
|
|
2619
|
+
declare const DrawerClose: React__default.NamedExoticComponent<DrawerCloseProps>;
|
|
2620
|
+
|
|
2621
|
+
declare function Popover({ ...props }: React$1.ComponentProps<typeof PopoverPrimitive.Root>): react_jsx_runtime.JSX.Element;
|
|
2622
|
+
declare function PopoverTrigger({ ...props }: React$1.ComponentProps<typeof PopoverPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
|
|
2623
|
+
declare const popoverContentVariants: (props?: ({
|
|
2624
|
+
size?: "xs" | "sm" | "md" | "lg" | null | undefined;
|
|
2625
|
+
variant?: "default" | "solid" | "soft" | null | undefined;
|
|
2626
|
+
color?: "default" | "error" | "warning" | "info" | "success" | "primary" | "secondary" | "accent" | null | undefined;
|
|
2627
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
2628
|
+
interface PopoverContentProps extends Omit<React$1.ComponentProps<typeof PopoverPrimitive.Content>, 'color'>, VariantProps<typeof popoverContentVariants> {
|
|
2629
|
+
}
|
|
2630
|
+
declare function PopoverContent({ className, align, sideOffset, size, variant, color, ...props }: PopoverContentProps): react_jsx_runtime.JSX.Element;
|
|
2631
|
+
declare function PopoverAnchor({ ...props }: React$1.ComponentProps<typeof PopoverPrimitive.Anchor>): react_jsx_runtime.JSX.Element;
|
|
2632
|
+
|
|
2633
|
+
interface TransferItem {
|
|
2634
|
+
key: string;
|
|
2635
|
+
label: string;
|
|
2636
|
+
description?: string;
|
|
2637
|
+
disabled?: boolean;
|
|
2638
|
+
}
|
|
2639
|
+
interface TransferProps {
|
|
2640
|
+
dataSource: TransferItem[];
|
|
2641
|
+
targetKeys?: string[];
|
|
2642
|
+
defaultTargetKeys?: string[];
|
|
2643
|
+
selectedKeys?: string[];
|
|
2644
|
+
defaultSelectedKeys?: string[];
|
|
2645
|
+
titles?: [string, string];
|
|
2646
|
+
size?: ComponentSize;
|
|
2647
|
+
showSearch?: boolean;
|
|
2648
|
+
searchPlaceholder?: string;
|
|
2649
|
+
listHeight?: number;
|
|
2650
|
+
showSelectAll?: boolean;
|
|
2651
|
+
oneWay?: boolean;
|
|
2652
|
+
disabled?: boolean;
|
|
2653
|
+
render?: (item: TransferItem) => React.ReactNode;
|
|
2654
|
+
footer?: (props: {
|
|
2655
|
+
direction: 'left' | 'right';
|
|
2656
|
+
}) => React.ReactNode;
|
|
2657
|
+
onChange?: (targetKeys: string[], direction: 'left' | 'right', moveKeys: string[]) => void;
|
|
2658
|
+
onSelectChange?: (sourceSelectedKeys: string[], targetSelectedKeys: string[]) => void;
|
|
2659
|
+
onSearch?: (direction: 'left' | 'right', value: string) => void;
|
|
2660
|
+
label?: string;
|
|
2661
|
+
helperText?: string;
|
|
2662
|
+
error?: string;
|
|
2663
|
+
warning?: string;
|
|
2664
|
+
info?: string;
|
|
2665
|
+
success?: string;
|
|
2666
|
+
className?: string;
|
|
2667
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
2668
|
+
}
|
|
2669
|
+
|
|
2670
|
+
declare const Transfer: React__default.NamedExoticComponent<TransferProps>;
|
|
2671
|
+
|
|
2672
|
+
export { Accordion, AreaChart, Badge, BarChart, type BaseOption, Breadcrumb as Breadcrumbs, Button, type ButtonColor$1 as ButtonColor, ButtonGroup, Card, Carousel, Cascader, Checkbox, CheckboxGroup, Clipboard, Collapse, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandModal, CommandSeparator, CommandShortcut, type ComponentColor, type ComponentSize, type ComponentVariant, type ComponentVariantExtended, type ComponentVariantInput, ComposedChart, DatePicker, Descriptions, type DisableableProps, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, Dropdown, Empty, FetchingOverlay, type FullWidthProps, Grid, type IconProps, Image, Input, InputGroup, InputOTP, Input as InputPassword, Kbd, LineChart, type LoadingProps, type MessagePosition, ComposedModal as Modal, MultiSelect, Notification, Pagination, PieChart, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, Radio, RadioGroup, RangePickerComponent as RangePicker, Rating, type RequiredProps, Ribbon, Select, Skeleton, Slider, Spinner, Stepper, Switch, Table, Tabs, type TextColorVariants, Textarea, TimePickerComponent as TimePicker, Toggle, ToggleGroup, Tooltip, Transfer, Tree, TreeSelect, Upload, type ValidationMessages, buttonColors, cn, commonSpacing, componentColors, componentSizeVariants, createAllColorVariants, createDashedColorVariants, createDefaultColorVariants, createGhostColorVariants, createLinkColorVariants, createOutlineColorVariants, createSoftColorVariants, createSolidColorVariants, extendedComponentSizeVariants, getAccordionColorClass, getCheckboxColorClass, getIconColorClass, getValidationStatus, iconColorClasses, iconSizes, textColorVariants };
|