opus-toolkit-components 1.7.0 → 1.7.1
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/lib/index.d.ts +466 -463
- package/lib/opus-components.main.js +1 -1
- package/lib/opus-components.main.js.map +1 -1
- package/package.json +2 -1
package/lib/index.d.ts
CHANGED
|
@@ -1,463 +1,466 @@
|
|
|
1
|
-
declare module "opus-toolkit-components" {
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
|
|
4
|
-
// Accordion
|
|
5
|
-
export interface AccordionProps {
|
|
6
|
-
title: string | React.ReactNode;
|
|
7
|
-
handleToggle?: (index: number) => void;
|
|
8
|
-
activeIndex?: number;
|
|
9
|
-
index: number;
|
|
10
|
-
isPreview?: boolean;
|
|
11
|
-
isLocked?: boolean;
|
|
12
|
-
onExitPreview?: () => void;
|
|
13
|
-
content: React.ReactNode;
|
|
14
|
-
preview?: React.ReactNode;
|
|
15
|
-
isPill?: boolean;
|
|
16
|
-
pillText?: string;
|
|
17
|
-
pillStatus?: "success" | "warning" | "error" | "info" | string;
|
|
18
|
-
pillIcon?: React.ReactNode;
|
|
19
|
-
disabled?: boolean;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
export const Accordion: React.ComponentType<AccordionProps>;
|
|
23
|
-
|
|
24
|
-
// BarLayout
|
|
25
|
-
export interface BarLayoutProps {
|
|
26
|
-
left?: React.ReactNode;
|
|
27
|
-
center?: React.ReactNode;
|
|
28
|
-
right?: React.ReactNode;
|
|
29
|
-
className?: string;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
export const BarLayout: React.ComponentType<BarLayoutProps>;
|
|
33
|
-
|
|
34
|
-
// Button
|
|
35
|
-
export type ButtonRank =
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
export type ButtonState = "default" | "disabled";
|
|
43
|
-
|
|
44
|
-
export type ButtonSize = "sm" | "md" | "lg" | "xl" | string;
|
|
45
|
-
|
|
46
|
-
export type IconComponent = (
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
export type
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
| "
|
|
213
|
-
| "
|
|
214
|
-
| "
|
|
215
|
-
| "
|
|
216
|
-
| "
|
|
217
|
-
| "
|
|
218
|
-
| "
|
|
219
|
-
| "
|
|
220
|
-
|
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
export
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
export type
|
|
292
|
-
|
|
293
|
-
export
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
}
|
|
1
|
+
declare module "opus-toolkit-components" {
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
|
|
4
|
+
// Accordion
|
|
5
|
+
export interface AccordionProps {
|
|
6
|
+
title: string | React.ReactNode;
|
|
7
|
+
handleToggle?: (index: number) => void;
|
|
8
|
+
activeIndex?: number;
|
|
9
|
+
index: number;
|
|
10
|
+
isPreview?: boolean;
|
|
11
|
+
isLocked?: boolean;
|
|
12
|
+
onExitPreview?: () => void;
|
|
13
|
+
content: React.ReactNode;
|
|
14
|
+
preview?: React.ReactNode;
|
|
15
|
+
isPill?: boolean;
|
|
16
|
+
pillText?: string;
|
|
17
|
+
pillStatus?: "success" | "warning" | "error" | "info" | string;
|
|
18
|
+
pillIcon?: React.ReactNode;
|
|
19
|
+
disabled?: boolean;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export const Accordion: React.ComponentType<AccordionProps>;
|
|
23
|
+
|
|
24
|
+
// BarLayout
|
|
25
|
+
export interface BarLayoutProps {
|
|
26
|
+
left?: React.ReactNode;
|
|
27
|
+
center?: React.ReactNode;
|
|
28
|
+
right?: React.ReactNode;
|
|
29
|
+
className?: string;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
export const BarLayout: React.ComponentType<BarLayoutProps>;
|
|
33
|
+
|
|
34
|
+
// Button
|
|
35
|
+
export type ButtonRank =
|
|
36
|
+
| "primary"
|
|
37
|
+
| "secondary"
|
|
38
|
+
| "tertiary"
|
|
39
|
+
| "outline"
|
|
40
|
+
| "destructive";
|
|
41
|
+
|
|
42
|
+
export type ButtonState = "default" | "disabled";
|
|
43
|
+
|
|
44
|
+
export type ButtonSize = "sm" | "md" | "lg" | "xl" | string;
|
|
45
|
+
|
|
46
|
+
export type IconComponent = (
|
|
47
|
+
props: React.SVGProps<SVGSVGElement>,
|
|
48
|
+
) => JSX.Element;
|
|
49
|
+
|
|
50
|
+
export interface ButtonProps
|
|
51
|
+
extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
52
|
+
type?: "button" | "submit" | "reset";
|
|
53
|
+
rank?: ButtonRank;
|
|
54
|
+
state?: ButtonState;
|
|
55
|
+
text?: string;
|
|
56
|
+
size?: ButtonSize;
|
|
57
|
+
name?: string;
|
|
58
|
+
dataCy?: string;
|
|
59
|
+
tabIndex?: number;
|
|
60
|
+
isFullWidth?: boolean;
|
|
61
|
+
icon?: IconComponent;
|
|
62
|
+
iconPosition?: "left" | "right";
|
|
63
|
+
isIconAnimated?: boolean;
|
|
64
|
+
isSaving?: boolean;
|
|
65
|
+
savingText?: string;
|
|
66
|
+
className?: string;
|
|
67
|
+
title?: string;
|
|
68
|
+
onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
export const Button: React.ComponentType<ButtonProps>;
|
|
72
|
+
|
|
73
|
+
// Card
|
|
74
|
+
export type CardIntent =
|
|
75
|
+
| "default"
|
|
76
|
+
| "info"
|
|
77
|
+
| "warning"
|
|
78
|
+
| "success"
|
|
79
|
+
| "error"
|
|
80
|
+
| "brand"
|
|
81
|
+
| "brandSecondary";
|
|
82
|
+
|
|
83
|
+
export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
84
|
+
intent?: CardIntent;
|
|
85
|
+
className?: string;
|
|
86
|
+
children?: React.ReactNode;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
export const Card: React.ComponentType<CardProps>;
|
|
90
|
+
|
|
91
|
+
// CookieBanner
|
|
92
|
+
export interface CookieBannerProps {
|
|
93
|
+
logo?: string;
|
|
94
|
+
policyTxt?: string;
|
|
95
|
+
linkTxt?: string;
|
|
96
|
+
isVisible?: boolean;
|
|
97
|
+
onAccept?: () => void;
|
|
98
|
+
onLearnMore?: () => void;
|
|
99
|
+
intent?: string;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
export const CookieBanner: React.ComponentType<CookieBannerProps>;
|
|
103
|
+
|
|
104
|
+
// Footer
|
|
105
|
+
export interface FooterProps {
|
|
106
|
+
left?: React.ReactNode;
|
|
107
|
+
center?: React.ReactNode;
|
|
108
|
+
right?: React.ReactNode;
|
|
109
|
+
className?: string;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
export const Footer: React.ComponentType<FooterProps>;
|
|
113
|
+
|
|
114
|
+
// Checkbox
|
|
115
|
+
|
|
116
|
+
export interface CheckboxChangeEvent {
|
|
117
|
+
target: {
|
|
118
|
+
name: string;
|
|
119
|
+
value: boolean;
|
|
120
|
+
};
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
export interface CheckboxProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
124
|
+
label: string;
|
|
125
|
+
name: string;
|
|
126
|
+
onChange?: (event: CheckboxChangeEvent) => void;
|
|
127
|
+
value?: boolean;
|
|
128
|
+
isValid?: boolean;
|
|
129
|
+
errorMessage?: string;
|
|
130
|
+
disabled?: boolean;
|
|
131
|
+
title?: string;
|
|
132
|
+
dataCy?: string;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
export const Checkbox: React.ComponentType<CheckboxProps>;
|
|
136
|
+
|
|
137
|
+
// Datepicker
|
|
138
|
+
export interface DatePickerChangeEvent {
|
|
139
|
+
target: {
|
|
140
|
+
name: string;
|
|
141
|
+
value: string;
|
|
142
|
+
};
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
export interface DatePickerProps
|
|
146
|
+
extends React.HTMLAttributes<HTMLDivElement> {
|
|
147
|
+
initialDate?: string;
|
|
148
|
+
label?: string;
|
|
149
|
+
isValid?: boolean;
|
|
150
|
+
errorMessage?: string;
|
|
151
|
+
name?: string;
|
|
152
|
+
onChange?: (event: DatePickerChangeEvent) => void;
|
|
153
|
+
value?: string;
|
|
154
|
+
className?: string;
|
|
155
|
+
title?: string;
|
|
156
|
+
required?: boolean;
|
|
157
|
+
dataCy?: string;
|
|
158
|
+
disabled?: boolean;
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
export const DatePicker: React.ComponentType<DatePickerProps>;
|
|
162
|
+
|
|
163
|
+
// Dropdown
|
|
164
|
+
export interface DropdownItem {
|
|
165
|
+
label: string;
|
|
166
|
+
value: string | number;
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
export interface DropdownChangeEvent {
|
|
170
|
+
target: {
|
|
171
|
+
name: string;
|
|
172
|
+
value: string | number;
|
|
173
|
+
};
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
export type IconComponent = (
|
|
177
|
+
props: React.SVGProps<SVGSVGElement>,
|
|
178
|
+
) => JSX.Element;
|
|
179
|
+
|
|
180
|
+
export interface DropdownProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
181
|
+
items?: DropdownItem[];
|
|
182
|
+
label?: string;
|
|
183
|
+
isValid?: boolean;
|
|
184
|
+
required?: boolean;
|
|
185
|
+
placeholder?: string;
|
|
186
|
+
name?: string;
|
|
187
|
+
className?: string;
|
|
188
|
+
title?: string;
|
|
189
|
+
tabIndex?: string | number;
|
|
190
|
+
onChange?: (event: DropdownChangeEvent) => void;
|
|
191
|
+
value?: string | number;
|
|
192
|
+
Icon?: IconComponent;
|
|
193
|
+
errorMessage?: string;
|
|
194
|
+
disabled?: boolean;
|
|
195
|
+
dataCy?: string;
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
export const Dropdown: React.ComponentType<DropdownProps>;
|
|
199
|
+
|
|
200
|
+
// Input
|
|
201
|
+
export type IconComponent = (
|
|
202
|
+
props: React.SVGProps<SVGSVGElement>,
|
|
203
|
+
) => JSX.Element;
|
|
204
|
+
|
|
205
|
+
export type CustomComponent = (props: any) => JSX.Element;
|
|
206
|
+
|
|
207
|
+
export interface InputProps
|
|
208
|
+
extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
209
|
+
label: string;
|
|
210
|
+
placeholder?: string;
|
|
211
|
+
type?:
|
|
212
|
+
| "text"
|
|
213
|
+
| "email"
|
|
214
|
+
| "password"
|
|
215
|
+
| "number"
|
|
216
|
+
| "search"
|
|
217
|
+
| "tel"
|
|
218
|
+
| "url"
|
|
219
|
+
| "date"
|
|
220
|
+
| "datetime-local"
|
|
221
|
+
| "month"
|
|
222
|
+
| "time"
|
|
223
|
+
| "week"
|
|
224
|
+
| string;
|
|
225
|
+
tabIndex?: string | number;
|
|
226
|
+
title?: string;
|
|
227
|
+
name?: string;
|
|
228
|
+
isValid?: boolean;
|
|
229
|
+
errorMessage?: string;
|
|
230
|
+
onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
231
|
+
className?: string;
|
|
232
|
+
value?: string | number;
|
|
233
|
+
Icon?: IconComponent;
|
|
234
|
+
iconPosition?: "left" | "right";
|
|
235
|
+
isAnimated?: boolean;
|
|
236
|
+
required?: boolean;
|
|
237
|
+
disabled?: boolean;
|
|
238
|
+
shouldRenderCustomComponent?: boolean;
|
|
239
|
+
customComponent?: CustomComponent;
|
|
240
|
+
customComponentProps?: Record<string, any>;
|
|
241
|
+
dataCy?: string;
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
export const Input: React.ForwardRefExoticComponent<
|
|
245
|
+
InputProps & React.RefAttributes<HTMLInputElement>
|
|
246
|
+
>;
|
|
247
|
+
|
|
248
|
+
// Radios
|
|
249
|
+
export interface RadioOption {
|
|
250
|
+
value: string | number;
|
|
251
|
+
label: string;
|
|
252
|
+
}
|
|
253
|
+
|
|
254
|
+
export interface RadioChangeEvent {
|
|
255
|
+
target: {
|
|
256
|
+
name: string;
|
|
257
|
+
value: string | number;
|
|
258
|
+
};
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
export interface RadioButtonProps
|
|
262
|
+
extends React.HTMLAttributes<HTMLDivElement> {
|
|
263
|
+
label: string;
|
|
264
|
+
options?: RadioOption[];
|
|
265
|
+
name: string;
|
|
266
|
+
value?: string | number;
|
|
267
|
+
onChange?: (event: RadioChangeEvent) => void;
|
|
268
|
+
className?: string;
|
|
269
|
+
tabIndex?: string | number;
|
|
270
|
+
title?: string;
|
|
271
|
+
isValid?: boolean;
|
|
272
|
+
errorMessage?: string;
|
|
273
|
+
required?: boolean;
|
|
274
|
+
dataCy?: string;
|
|
275
|
+
disabled?: boolean;
|
|
276
|
+
}
|
|
277
|
+
|
|
278
|
+
export const RadioButton: React.FC<RadioButtonProps>;
|
|
279
|
+
|
|
280
|
+
// Header
|
|
281
|
+
export interface HeaderProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
282
|
+
title: string;
|
|
283
|
+
center?: React.ReactNode;
|
|
284
|
+
right?: React.ReactNode;
|
|
285
|
+
className?: string;
|
|
286
|
+
}
|
|
287
|
+
|
|
288
|
+
export const Header: React.FC<HeaderProps>;
|
|
289
|
+
|
|
290
|
+
// Icon
|
|
291
|
+
export type HeroIconName = keyof typeof HeroIcons;
|
|
292
|
+
export type C247IconName = keyof typeof C247Icons;
|
|
293
|
+
export type IconName = HeroIconName | C247IconName;
|
|
294
|
+
|
|
295
|
+
export type IconLibrary = "hero" | "c247";
|
|
296
|
+
|
|
297
|
+
export interface IconProps extends React.SVGProps<SVGSVGElement> {
|
|
298
|
+
name: IconName;
|
|
299
|
+
library?: IconLibrary;
|
|
300
|
+
size?: number;
|
|
301
|
+
className?: string;
|
|
302
|
+
color?: string;
|
|
303
|
+
}
|
|
304
|
+
|
|
305
|
+
export const Icon: React.FC<IconProps>;
|
|
306
|
+
|
|
307
|
+
// Loader
|
|
308
|
+
export interface LoaderProps {
|
|
309
|
+
isLoading: boolean;
|
|
310
|
+
loaderText?: string;
|
|
311
|
+
customLoader?: React.ReactNode;
|
|
312
|
+
className?: string;
|
|
313
|
+
}
|
|
314
|
+
|
|
315
|
+
export const Loader: React.FC<LoaderProps>;
|
|
316
|
+
|
|
317
|
+
// Modal
|
|
318
|
+
export interface ModalProps {
|
|
319
|
+
isOpen: boolean;
|
|
320
|
+
onClose?: () => void;
|
|
321
|
+
isLoading?: boolean;
|
|
322
|
+
loaderText?: string;
|
|
323
|
+
header?: React.ReactNode;
|
|
324
|
+
hideHeader?: boolean;
|
|
325
|
+
body?: React.ReactNode;
|
|
326
|
+
footer?: React.ReactNode;
|
|
327
|
+
hideFooter?: boolean;
|
|
328
|
+
className?: string;
|
|
329
|
+
footerClassName?: string;
|
|
330
|
+
headerClassName?: string;
|
|
331
|
+
}
|
|
332
|
+
|
|
333
|
+
export const Modal: React.FC<ModalProps>;
|
|
334
|
+
|
|
335
|
+
// Navbar
|
|
336
|
+
export interface NavbarProps {
|
|
337
|
+
children?: React.ReactNode;
|
|
338
|
+
logo?: string;
|
|
339
|
+
className?: string;
|
|
340
|
+
maxWidth?: string;
|
|
341
|
+
}
|
|
342
|
+
|
|
343
|
+
export const Navbar: React.FC<NavbarProps>;
|
|
344
|
+
|
|
345
|
+
// PageTemplate
|
|
346
|
+
export interface PageTemplateProps {
|
|
347
|
+
headerTitle?: string;
|
|
348
|
+
headerCenter?: React.ReactNode;
|
|
349
|
+
headerRight?: React.ReactNode;
|
|
350
|
+
|
|
351
|
+
footerLeft?: React.ReactNode;
|
|
352
|
+
footerCenter?: React.ReactNode;
|
|
353
|
+
footerRight?: React.ReactNode;
|
|
354
|
+
|
|
355
|
+
children: React.ReactNode;
|
|
356
|
+
className?: string;
|
|
357
|
+
}
|
|
358
|
+
|
|
359
|
+
export const PageTemplate: React.FC<PageTemplateProps>;
|
|
360
|
+
|
|
361
|
+
// Pills
|
|
362
|
+
export interface PillProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
363
|
+
text?: string;
|
|
364
|
+
status?: "primary" | "danger" | "warning" | "success" | "info" | "notice";
|
|
365
|
+
className?: string;
|
|
366
|
+
icon?: (props: React.SVGProps<SVGSVGElement>) => JSX.Element;
|
|
367
|
+
}
|
|
368
|
+
|
|
369
|
+
export const Pill: React.FC<PillProps>;
|
|
370
|
+
|
|
371
|
+
// ProfileCard
|
|
372
|
+
export interface ProfileCardUser {
|
|
373
|
+
name: string;
|
|
374
|
+
role: string;
|
|
375
|
+
}
|
|
376
|
+
|
|
377
|
+
export interface ProfileCardProps
|
|
378
|
+
extends React.HTMLAttributes<HTMLDivElement> {
|
|
379
|
+
user: ProfileCardUser;
|
|
380
|
+
href?: string;
|
|
381
|
+
}
|
|
382
|
+
|
|
383
|
+
export const ProfileCard: React.FC<ProfileCardProps>;
|
|
384
|
+
|
|
385
|
+
// Sidebar
|
|
386
|
+
export interface SidebarMenuItem {
|
|
387
|
+
key: string | number;
|
|
388
|
+
name: string;
|
|
389
|
+
icon?: string;
|
|
390
|
+
href?: string;
|
|
391
|
+
}
|
|
392
|
+
|
|
393
|
+
export interface SidebarMenuGroup {
|
|
394
|
+
key: string | number;
|
|
395
|
+
name: string;
|
|
396
|
+
children: SidebarMenuItem[];
|
|
397
|
+
}
|
|
398
|
+
|
|
399
|
+
export type SidebarMenu = SidebarMenuItem | SidebarMenuGroup;
|
|
400
|
+
|
|
401
|
+
export interface SidebarUser {
|
|
402
|
+
id: string | number;
|
|
403
|
+
name: string;
|
|
404
|
+
role: string;
|
|
405
|
+
avatar?: string;
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
export interface SidebarProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
409
|
+
menus: SidebarMenu[];
|
|
410
|
+
user: SidebarUser;
|
|
411
|
+
activeItem?: string | number | null;
|
|
412
|
+
onItemClick?: (key: string | number) => void;
|
|
413
|
+
logo?: string;
|
|
414
|
+
searchValue?: string;
|
|
415
|
+
onSearchChange?: (value: string) => void;
|
|
416
|
+
}
|
|
417
|
+
|
|
418
|
+
export const Sidebar: React.FC<SidebarProps>;
|
|
419
|
+
|
|
420
|
+
// Table
|
|
421
|
+
export interface TableColumn {
|
|
422
|
+
key: string;
|
|
423
|
+
header: string;
|
|
424
|
+
render?: (row: any) => React.ReactNode;
|
|
425
|
+
}
|
|
426
|
+
|
|
427
|
+
export interface TableProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
428
|
+
data?: TableColumn[];
|
|
429
|
+
rows?: any[];
|
|
430
|
+
className?: string;
|
|
431
|
+
rowClassName?: string;
|
|
432
|
+
cellClassName?: string;
|
|
433
|
+
headRowClassName?: string;
|
|
434
|
+
headCellClassName?: string;
|
|
435
|
+
rowKeyExtractor?: (row: any, index: number) => string | number;
|
|
436
|
+
}
|
|
437
|
+
|
|
438
|
+
export const Table: React.FC<TableProps>;
|
|
439
|
+
|
|
440
|
+
// Text
|
|
441
|
+
export type TextVariant =
|
|
442
|
+
| "h1"
|
|
443
|
+
| "h2"
|
|
444
|
+
| "h3"
|
|
445
|
+
| "h4"
|
|
446
|
+
| "h5"
|
|
447
|
+
| "h6"
|
|
448
|
+
| "body"
|
|
449
|
+
| "small"
|
|
450
|
+
| "caption"
|
|
451
|
+
| "label";
|
|
452
|
+
|
|
453
|
+
export type TextAs = keyof JSX.IntrinsicElements | React.ComponentType<any>;
|
|
454
|
+
|
|
455
|
+
export interface TextProps extends React.HTMLAttributes<HTMLElement> {
|
|
456
|
+
variant?: TextVariant;
|
|
457
|
+
as?: TextAs;
|
|
458
|
+
className?: string;
|
|
459
|
+
color?: string;
|
|
460
|
+
children?: React.ReactNode;
|
|
461
|
+
name?: string;
|
|
462
|
+
dataCy?: string;
|
|
463
|
+
}
|
|
464
|
+
|
|
465
|
+
export const Text: React.FC<TextProps>;
|
|
466
|
+
}
|