@rovula/ui 0.1.1 → 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/bundle.css +358 -73
- package/dist/cjs/bundle.js +1564 -1570
- package/dist/cjs/bundle.js.map +1 -1
- package/dist/cjs/types/components/ActionButton/ActionButton.d.ts +4 -2
- package/dist/cjs/types/components/ActionButton/ActionButton.stories.d.ts +30 -8
- package/dist/cjs/types/components/ActionButton/ActionButton.styles.d.ts +2 -1
- package/dist/cjs/types/components/Avatar/Avatar.styles.d.ts +1 -1
- package/dist/cjs/types/components/Button/Button.d.ts +4 -2
- package/dist/cjs/types/components/Button/Button.styles.d.ts +2 -1
- package/dist/cjs/types/components/Button/Buttons.stories.d.ts +71 -6
- package/dist/cjs/types/components/Checkbox/Checkbox.stories.d.ts +13 -9
- package/dist/cjs/types/components/Dropdown/Dropdown.stories.d.ts +1 -0
- package/dist/cjs/types/components/InputFilter/InputFilter.stories.d.ts +1 -0
- package/dist/cjs/types/components/MaskedTextInput/MaskedTextInput.d.ts +1 -0
- package/dist/cjs/types/components/MaskedTextInput/MaskedTextInput.stories.d.ts +2 -0
- package/dist/cjs/types/components/PasswordInput/PasswordInput.stories.d.ts +1 -0
- package/dist/cjs/types/components/RadioGroup/RadioGroup.stories.d.ts +10 -7
- package/dist/cjs/types/components/Search/Search.stories.d.ts +1 -0
- package/dist/cjs/types/components/TextInput/TextInput.d.ts +2 -0
- package/dist/cjs/types/components/TextInput/TextInput.stories.d.ts +10 -0
- package/dist/cjs/types/components/TextInput/TextInput.styles.d.ts +15 -0
- package/dist/components/ActionButton/ActionButton.js +2 -1
- package/dist/components/ActionButton/ActionButton.stories.js +40 -7
- package/dist/components/ActionButton/ActionButton.styles.js +77 -17
- package/dist/components/Button/Button.js +9 -2
- package/dist/components/Button/Button.styles.js +51 -14
- package/dist/components/Button/Buttons.stories.js +55 -0
- package/dist/components/Checkbox/Checkbox.js +6 -7
- package/dist/components/Checkbox/Checkbox.stories.js +23 -1
- package/dist/components/InputFilter/InputFilter.js +1 -1
- package/dist/components/InputFilter/InputFilter.styles.js +1 -1
- package/dist/components/PasswordInput/PasswordInput.js +2 -2
- package/dist/components/RadioGroup/RadioGroup.js +1 -1
- package/dist/components/RadioGroup/RadioGroup.stories.js +16 -1
- package/dist/components/TextArea/TextArea.styles.js +1 -1
- package/dist/components/TextInput/TextInput.js +33 -24
- package/dist/components/TextInput/TextInput.stories.js +14 -2
- package/dist/components/TextInput/TextInput.styles.js +25 -10
- package/dist/esm/bundle.css +358 -73
- package/dist/esm/bundle.js +1564 -1570
- package/dist/esm/bundle.js.map +1 -1
- package/dist/esm/types/components/ActionButton/ActionButton.d.ts +4 -2
- package/dist/esm/types/components/ActionButton/ActionButton.stories.d.ts +30 -8
- package/dist/esm/types/components/ActionButton/ActionButton.styles.d.ts +2 -1
- package/dist/esm/types/components/Avatar/Avatar.styles.d.ts +1 -1
- package/dist/esm/types/components/Button/Button.d.ts +4 -2
- package/dist/esm/types/components/Button/Button.styles.d.ts +2 -1
- package/dist/esm/types/components/Button/Buttons.stories.d.ts +71 -6
- package/dist/esm/types/components/Checkbox/Checkbox.stories.d.ts +13 -9
- package/dist/esm/types/components/Dropdown/Dropdown.stories.d.ts +1 -0
- package/dist/esm/types/components/InputFilter/InputFilter.stories.d.ts +1 -0
- package/dist/esm/types/components/MaskedTextInput/MaskedTextInput.d.ts +1 -0
- package/dist/esm/types/components/MaskedTextInput/MaskedTextInput.stories.d.ts +2 -0
- package/dist/esm/types/components/PasswordInput/PasswordInput.stories.d.ts +1 -0
- package/dist/esm/types/components/RadioGroup/RadioGroup.stories.d.ts +10 -7
- package/dist/esm/types/components/Search/Search.stories.d.ts +1 -0
- package/dist/esm/types/components/TextInput/TextInput.d.ts +2 -0
- package/dist/esm/types/components/TextInput/TextInput.stories.d.ts +10 -0
- package/dist/esm/types/components/TextInput/TextInput.styles.d.ts +15 -0
- package/dist/index.d.ts +9 -3
- package/dist/src/theme/global.css +453 -84
- package/package.json +1 -1
- package/src/components/ActionButton/ActionButton.stories.tsx +105 -149
- package/src/components/ActionButton/ActionButton.styles.ts +78 -18
- package/src/components/ActionButton/ActionButton.tsx +7 -2
- package/src/components/Button/Button.styles.ts +51 -14
- package/src/components/Button/Button.tsx +11 -2
- package/src/components/Button/Buttons.stories.tsx +235 -0
- package/src/components/Checkbox/Checkbox.stories.tsx +50 -4
- package/src/components/Checkbox/Checkbox.tsx +12 -8
- package/src/components/InputFilter/InputFilter.styles.ts +2 -2
- package/src/components/InputFilter/InputFilter.tsx +21 -24
- package/src/components/PasswordInput/PasswordInput.tsx +2 -2
- package/src/components/RadioGroup/RadioGroup.stories.tsx +43 -4
- package/src/components/RadioGroup/RadioGroup.tsx +1 -1
- package/src/components/TextArea/TextArea.styles.ts +1 -1
- package/src/components/TextInput/TextInput.stories.tsx +60 -2
- package/src/components/TextInput/TextInput.styles.ts +36 -19
- package/src/components/TextInput/TextInput.tsx +83 -55
- package/src/theme/themes/variable.css +1 -1
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
export type ActionButtonProps = {
|
|
3
3
|
title?: string;
|
|
4
|
-
size?: "xs" | "sm" | "md" | "lg";
|
|
4
|
+
size?: "xxs" | "xs" | "sm" | "md" | "lg";
|
|
5
|
+
shape?: "round" | "capsule";
|
|
5
6
|
variant?: "solid" | "outline" | "icon";
|
|
6
7
|
disabled?: boolean;
|
|
7
8
|
active?: boolean;
|
|
@@ -10,7 +11,8 @@ export type ActionButtonProps = {
|
|
|
10
11
|
} & React.ButtonHTMLAttributes<HTMLButtonElement>;
|
|
11
12
|
declare const ActionButton: React.ForwardRefExoticComponent<{
|
|
12
13
|
title?: string;
|
|
13
|
-
size?: "xs" | "sm" | "md" | "lg";
|
|
14
|
+
size?: "xxs" | "xs" | "sm" | "md" | "lg";
|
|
15
|
+
shape?: "round" | "capsule";
|
|
14
16
|
variant?: "solid" | "outline" | "icon";
|
|
15
17
|
disabled?: boolean;
|
|
16
18
|
active?: boolean;
|
|
@@ -3,7 +3,8 @@ declare const meta: {
|
|
|
3
3
|
title: string;
|
|
4
4
|
component: React.ForwardRefExoticComponent<{
|
|
5
5
|
title?: string;
|
|
6
|
-
size?: "xs" | "sm" | "md" | "lg";
|
|
6
|
+
size?: "xxs" | "xs" | "sm" | "md" | "lg";
|
|
7
|
+
shape?: "round" | "capsule";
|
|
7
8
|
variant?: "solid" | "outline" | "icon";
|
|
8
9
|
disabled?: boolean;
|
|
9
10
|
active?: boolean;
|
|
@@ -11,12 +12,21 @@ declare const meta: {
|
|
|
11
12
|
className?: string;
|
|
12
13
|
} & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
|
|
13
14
|
tags: string[];
|
|
15
|
+
argTypes: {
|
|
16
|
+
shape: {
|
|
17
|
+
control: {
|
|
18
|
+
type: "inline-radio";
|
|
19
|
+
};
|
|
20
|
+
options: string[];
|
|
21
|
+
};
|
|
22
|
+
};
|
|
14
23
|
parameters: {
|
|
15
24
|
layout: string;
|
|
16
25
|
};
|
|
17
26
|
decorators: ((Story: import("@storybook/csf").PartialStoryFn<import("@storybook/react").ReactRenderer, {
|
|
18
27
|
title?: string | undefined;
|
|
19
|
-
size?: "xs" | "sm" | "md" | "lg" | undefined;
|
|
28
|
+
size?: "xxs" | "xs" | "sm" | "md" | "lg" | undefined;
|
|
29
|
+
shape?: "round" | "capsule" | undefined;
|
|
20
30
|
variant?: "solid" | "outline" | "icon" | undefined;
|
|
21
31
|
disabled?: boolean | undefined;
|
|
22
32
|
active?: boolean | undefined;
|
|
@@ -301,12 +311,24 @@ declare const meta: {
|
|
|
301
311
|
export default meta;
|
|
302
312
|
export declare const Default: {
|
|
303
313
|
args: {
|
|
304
|
-
variant:
|
|
305
|
-
size:
|
|
314
|
+
variant: "solid";
|
|
315
|
+
size: "md";
|
|
316
|
+
shape: "round";
|
|
306
317
|
};
|
|
307
|
-
render: (args: {
|
|
318
|
+
render: (args: {
|
|
319
|
+
title?: string;
|
|
320
|
+
size?: "xxs" | "xs" | "sm" | "md" | "lg";
|
|
321
|
+
shape?: "round" | "capsule";
|
|
322
|
+
variant?: "solid" | "outline" | "icon";
|
|
323
|
+
disabled?: boolean;
|
|
324
|
+
active?: boolean;
|
|
325
|
+
children?: React.ReactNode;
|
|
326
|
+
className?: string;
|
|
327
|
+
} & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>) => import("react/jsx-runtime").JSX.Element;
|
|
328
|
+
};
|
|
329
|
+
export declare const FigmaPreview: {
|
|
330
|
+
render: () => import("react/jsx-runtime").JSX.Element;
|
|
308
331
|
};
|
|
309
|
-
export declare const
|
|
310
|
-
|
|
311
|
-
render: (args: {}) => import("react/jsx-runtime").JSX.Element;
|
|
332
|
+
export declare const FigmaPreviewCapsule: {
|
|
333
|
+
render: () => import("react/jsx-runtime").JSX.Element;
|
|
312
334
|
};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export declare const actionButtonVariants: (props?: ({
|
|
2
2
|
variant?: "solid" | "outline" | "icon" | null | undefined;
|
|
3
|
-
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
3
|
+
size?: "sm" | "md" | "lg" | "xxs" | "xs" | null | undefined;
|
|
4
|
+
shape?: "round" | "capsule" | null | undefined;
|
|
4
5
|
disabled?: boolean | null | undefined;
|
|
5
6
|
active?: boolean | null | undefined;
|
|
6
7
|
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export declare const avatarVariants: (props?: ({
|
|
2
|
-
size?: "sm" | "md" | "lg" | "
|
|
2
|
+
size?: "sm" | "md" | "lg" | "xxs" | "xs" | null | undefined;
|
|
3
3
|
rounded?: "none" | "normal" | "full" | null | undefined;
|
|
4
4
|
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
@@ -2,8 +2,9 @@ import React, { ReactElement } from "react";
|
|
|
2
2
|
export type ButtonProps = {
|
|
3
3
|
title?: string;
|
|
4
4
|
size?: "sm" | "md" | "lg";
|
|
5
|
+
shape?: "round" | "capsule";
|
|
5
6
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
6
|
-
variant?: "solid" | "outline" | "flat" | "link";
|
|
7
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
7
8
|
disabled?: boolean;
|
|
8
9
|
isLoading?: boolean;
|
|
9
10
|
fullwidth?: boolean;
|
|
@@ -14,8 +15,9 @@ export type ButtonProps = {
|
|
|
14
15
|
declare const Button: React.ForwardRefExoticComponent<{
|
|
15
16
|
title?: string;
|
|
16
17
|
size?: "sm" | "md" | "lg";
|
|
18
|
+
shape?: "round" | "capsule";
|
|
17
19
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
18
|
-
variant?: "solid" | "outline" | "flat" | "link";
|
|
20
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
19
21
|
disabled?: boolean;
|
|
20
22
|
isLoading?: boolean;
|
|
21
23
|
fullwidth?: boolean;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
export declare const buttonVariants: (props?: ({
|
|
2
2
|
color?: "primary" | "secondary" | "tertiary" | "success" | "info" | "warning" | "error" | null | undefined;
|
|
3
3
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
4
|
-
|
|
4
|
+
shape?: "round" | "capsule" | null | undefined;
|
|
5
|
+
variant?: "solid" | "outline" | "link" | "text" | "flat" | null | undefined;
|
|
5
6
|
disabled?: boolean | null | undefined;
|
|
6
7
|
fullwidth?: boolean | null | undefined;
|
|
7
8
|
icon?: "sm" | "md" | "lg" | null | undefined;
|
|
@@ -4,8 +4,9 @@ declare const meta: {
|
|
|
4
4
|
component: React.ForwardRefExoticComponent<{
|
|
5
5
|
title?: string;
|
|
6
6
|
size?: "sm" | "md" | "lg";
|
|
7
|
+
shape?: "round" | "capsule";
|
|
7
8
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
8
|
-
variant?: "solid" | "outline" | "flat" | "link";
|
|
9
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
9
10
|
disabled?: boolean;
|
|
10
11
|
isLoading?: boolean;
|
|
11
12
|
fullwidth?: boolean;
|
|
@@ -14,14 +15,23 @@ declare const meta: {
|
|
|
14
15
|
endIcon?: React.ReactElement;
|
|
15
16
|
} & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
|
|
16
17
|
tags: string[];
|
|
18
|
+
argTypes: {
|
|
19
|
+
shape: {
|
|
20
|
+
control: {
|
|
21
|
+
type: "inline-radio";
|
|
22
|
+
};
|
|
23
|
+
options: string[];
|
|
24
|
+
};
|
|
25
|
+
};
|
|
17
26
|
parameters: {
|
|
18
27
|
layout: string;
|
|
19
28
|
};
|
|
20
29
|
decorators: ((Story: import("@storybook/csf").PartialStoryFn<import("@storybook/react").ReactRenderer, {
|
|
21
30
|
title?: string | undefined;
|
|
22
31
|
size?: "sm" | "md" | "lg" | undefined;
|
|
32
|
+
shape?: "round" | "capsule" | undefined;
|
|
23
33
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error" | undefined;
|
|
24
|
-
variant?: "solid" | "outline" | "flat" | "link" | undefined;
|
|
34
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link" | undefined;
|
|
25
35
|
disabled?: boolean | undefined;
|
|
26
36
|
isLoading?: boolean | undefined;
|
|
27
37
|
fullwidth?: boolean | undefined;
|
|
@@ -310,12 +320,14 @@ export declare const Solid: {
|
|
|
310
320
|
title: string;
|
|
311
321
|
disabled: false;
|
|
312
322
|
isLoading: false;
|
|
323
|
+
shape: "round";
|
|
313
324
|
};
|
|
314
325
|
render: (args: {
|
|
315
326
|
title?: string;
|
|
316
327
|
size?: "sm" | "md" | "lg";
|
|
328
|
+
shape?: "round" | "capsule";
|
|
317
329
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
318
|
-
variant?: "solid" | "outline" | "flat" | "link";
|
|
330
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
319
331
|
disabled?: boolean;
|
|
320
332
|
isLoading?: boolean;
|
|
321
333
|
fullwidth?: boolean;
|
|
@@ -330,12 +342,14 @@ export declare const Outline: {
|
|
|
330
342
|
variant: "outline";
|
|
331
343
|
disabled: false;
|
|
332
344
|
isLoading: false;
|
|
345
|
+
shape: "round";
|
|
333
346
|
};
|
|
334
347
|
render: (args: {
|
|
335
348
|
title?: string;
|
|
336
349
|
size?: "sm" | "md" | "lg";
|
|
350
|
+
shape?: "round" | "capsule";
|
|
337
351
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
338
|
-
variant?: "solid" | "outline" | "flat" | "link";
|
|
352
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
339
353
|
disabled?: boolean;
|
|
340
354
|
isLoading?: boolean;
|
|
341
355
|
fullwidth?: boolean;
|
|
@@ -350,12 +364,36 @@ export declare const Flat: {
|
|
|
350
364
|
variant: "flat";
|
|
351
365
|
disabled: false;
|
|
352
366
|
isLoading: false;
|
|
367
|
+
shape: "round";
|
|
368
|
+
};
|
|
369
|
+
render: (args: {
|
|
370
|
+
title?: string;
|
|
371
|
+
size?: "sm" | "md" | "lg";
|
|
372
|
+
shape?: "round" | "capsule";
|
|
373
|
+
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
374
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
375
|
+
disabled?: boolean;
|
|
376
|
+
isLoading?: boolean;
|
|
377
|
+
fullwidth?: boolean;
|
|
378
|
+
children?: React.ReactNode;
|
|
379
|
+
startIcon?: React.ReactElement;
|
|
380
|
+
endIcon?: React.ReactElement;
|
|
381
|
+
} & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>) => import("react/jsx-runtime").JSX.Element;
|
|
382
|
+
};
|
|
383
|
+
export declare const Text: {
|
|
384
|
+
args: {
|
|
385
|
+
title: string;
|
|
386
|
+
variant: "text";
|
|
387
|
+
disabled: false;
|
|
388
|
+
isLoading: false;
|
|
389
|
+
shape: "round";
|
|
353
390
|
};
|
|
354
391
|
render: (args: {
|
|
355
392
|
title?: string;
|
|
356
393
|
size?: "sm" | "md" | "lg";
|
|
394
|
+
shape?: "round" | "capsule";
|
|
357
395
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
358
|
-
variant?: "solid" | "outline" | "flat" | "link";
|
|
396
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
359
397
|
disabled?: boolean;
|
|
360
398
|
isLoading?: boolean;
|
|
361
399
|
fullwidth?: boolean;
|
|
@@ -370,12 +408,14 @@ export declare const Link: {
|
|
|
370
408
|
variant: "link";
|
|
371
409
|
disabled: false;
|
|
372
410
|
isLoading: false;
|
|
411
|
+
shape: "round";
|
|
373
412
|
};
|
|
374
413
|
render: (args: {
|
|
375
414
|
title?: string;
|
|
376
415
|
size?: "sm" | "md" | "lg";
|
|
416
|
+
shape?: "round" | "capsule";
|
|
377
417
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
378
|
-
variant?: "solid" | "outline" | "flat" | "link";
|
|
418
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
379
419
|
disabled?: boolean;
|
|
380
420
|
isLoading?: boolean;
|
|
381
421
|
fullwidth?: boolean;
|
|
@@ -384,3 +424,28 @@ export declare const Link: {
|
|
|
384
424
|
endIcon?: React.ReactElement;
|
|
385
425
|
} & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>) => import("react/jsx-runtime").JSX.Element;
|
|
386
426
|
};
|
|
427
|
+
export declare const ShapePreview: {
|
|
428
|
+
args: {
|
|
429
|
+
variant: "solid";
|
|
430
|
+
color: "primary";
|
|
431
|
+
};
|
|
432
|
+
render: (args: {
|
|
433
|
+
title?: string;
|
|
434
|
+
size?: "sm" | "md" | "lg";
|
|
435
|
+
shape?: "round" | "capsule";
|
|
436
|
+
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
437
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
438
|
+
disabled?: boolean;
|
|
439
|
+
isLoading?: boolean;
|
|
440
|
+
fullwidth?: boolean;
|
|
441
|
+
children?: React.ReactNode;
|
|
442
|
+
startIcon?: React.ReactElement;
|
|
443
|
+
endIcon?: React.ReactElement;
|
|
444
|
+
} & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>) => import("react/jsx-runtime").JSX.Element;
|
|
445
|
+
};
|
|
446
|
+
export declare const FigmaPreview: {
|
|
447
|
+
render: () => import("react/jsx-runtime").JSX.Element;
|
|
448
|
+
};
|
|
449
|
+
export declare const FigmaPreviewCapsule: {
|
|
450
|
+
render: () => import("react/jsx-runtime").JSX.Element;
|
|
451
|
+
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import type { CheckedState } from "@radix-ui/react-checkbox";
|
|
2
3
|
declare const meta: {
|
|
3
4
|
title: string;
|
|
4
5
|
component: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-checkbox").CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -244,7 +245,7 @@ declare const meta: {
|
|
|
244
245
|
formNoValidate?: boolean | undefined | undefined;
|
|
245
246
|
formTarget?: string | undefined | undefined;
|
|
246
247
|
value?: string | number | readonly string[] | undefined;
|
|
247
|
-
defaultChecked?:
|
|
248
|
+
defaultChecked?: CheckedState | undefined;
|
|
248
249
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
249
250
|
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
250
251
|
accessKey?: string | undefined | undefined;
|
|
@@ -284,26 +285,29 @@ declare const meta: {
|
|
|
284
285
|
unselectable?: "on" | "off" | undefined | undefined;
|
|
285
286
|
inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
|
|
286
287
|
is?: string | undefined | undefined;
|
|
287
|
-
checked?:
|
|
288
|
+
checked?: CheckedState | undefined;
|
|
288
289
|
required?: boolean | undefined;
|
|
289
290
|
asChild?: boolean | undefined;
|
|
290
|
-
onCheckedChange?: ((checked:
|
|
291
|
+
onCheckedChange?: ((checked: CheckedState) => void) | undefined;
|
|
291
292
|
ref?: React.LegacyRef<HTMLButtonElement> | undefined;
|
|
292
293
|
}>) => import("react/jsx-runtime").JSX.Element)[];
|
|
293
294
|
};
|
|
294
295
|
export default meta;
|
|
295
296
|
export declare const Default: {
|
|
296
297
|
args: {
|
|
297
|
-
checked:
|
|
298
|
-
disabled:
|
|
298
|
+
checked: false;
|
|
299
|
+
disabled: false;
|
|
299
300
|
};
|
|
300
|
-
render: (args:
|
|
301
|
+
render: (args: Omit<import("@radix-ui/react-checkbox").CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>) => import("react/jsx-runtime").JSX.Element;
|
|
301
302
|
};
|
|
302
303
|
export declare const WithText: {
|
|
303
304
|
args: {};
|
|
304
|
-
render: (args:
|
|
305
|
+
render: (args: Omit<import("@radix-ui/react-checkbox").CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>) => import("react/jsx-runtime").JSX.Element;
|
|
305
306
|
};
|
|
306
|
-
export declare const
|
|
307
|
+
export declare const Disabled: {
|
|
307
308
|
args: {};
|
|
308
|
-
render: (args:
|
|
309
|
+
render: (args: Omit<import("@radix-ui/react-checkbox").CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>) => import("react/jsx-runtime").JSX.Element;
|
|
310
|
+
};
|
|
311
|
+
export declare const FigmaPreview: {
|
|
312
|
+
render: () => import("react/jsx-runtime").JSX.Element;
|
|
309
313
|
};
|
|
@@ -364,6 +364,7 @@ declare const meta: {
|
|
|
364
364
|
src?: string | undefined | undefined;
|
|
365
365
|
iconMode?: "flat" | "solid" | undefined;
|
|
366
366
|
keepCloseIconOnValue?: boolean | undefined;
|
|
367
|
+
keepFooterSpace?: boolean | undefined;
|
|
367
368
|
labelClassName?: string | undefined;
|
|
368
369
|
classes?: {
|
|
369
370
|
iconWrapper?: string;
|
|
@@ -351,6 +351,7 @@ declare const meta: {
|
|
|
351
351
|
src?: string | undefined | undefined;
|
|
352
352
|
iconMode?: "flat" | "solid" | undefined;
|
|
353
353
|
keepCloseIconOnValue?: boolean | undefined;
|
|
354
|
+
keepFooterSpace?: boolean | undefined;
|
|
354
355
|
labelClassName?: string | undefined;
|
|
355
356
|
classes?: {
|
|
356
357
|
iconWrapper?: string;
|
|
@@ -46,6 +46,7 @@ export declare const MaskedTextInput: React.ForwardRefExoticComponent<{
|
|
|
46
46
|
required?: boolean;
|
|
47
47
|
isFloatingLabel?: boolean;
|
|
48
48
|
keepCloseIconOnValue?: boolean;
|
|
49
|
+
keepFooterSpace?: boolean;
|
|
49
50
|
hasClearIcon?: boolean;
|
|
50
51
|
hasSearchIcon?: boolean;
|
|
51
52
|
startIcon?: React.ReactNode;
|
|
@@ -17,6 +17,7 @@ declare const meta: {
|
|
|
17
17
|
required?: boolean;
|
|
18
18
|
isFloatingLabel?: boolean;
|
|
19
19
|
keepCloseIconOnValue?: boolean;
|
|
20
|
+
keepFooterSpace?: boolean;
|
|
20
21
|
hasClearIcon?: boolean;
|
|
21
22
|
hasSearchIcon?: boolean;
|
|
22
23
|
startIcon?: React.ReactNode;
|
|
@@ -63,6 +64,7 @@ declare const meta: {
|
|
|
63
64
|
required?: boolean | undefined;
|
|
64
65
|
isFloatingLabel?: boolean | undefined;
|
|
65
66
|
keepCloseIconOnValue?: boolean | undefined;
|
|
67
|
+
keepFooterSpace?: boolean | undefined;
|
|
66
68
|
hasClearIcon?: boolean | undefined;
|
|
67
69
|
hasSearchIcon?: boolean | undefined;
|
|
68
70
|
startIcon?: React.ReactNode;
|
|
@@ -320,6 +320,7 @@ declare const meta: {
|
|
|
320
320
|
helperText?: string | undefined;
|
|
321
321
|
errorMessage?: string | undefined;
|
|
322
322
|
keepCloseIconOnValue?: boolean | undefined;
|
|
323
|
+
keepFooterSpace?: boolean | undefined;
|
|
323
324
|
labelClassName?: string | undefined;
|
|
324
325
|
classes?: {
|
|
325
326
|
iconWrapper?: string;
|
|
@@ -288,19 +288,22 @@ declare const meta: {
|
|
|
288
288
|
export default meta;
|
|
289
289
|
export declare const Default: {
|
|
290
290
|
args: {
|
|
291
|
-
disabled:
|
|
291
|
+
disabled: false;
|
|
292
292
|
};
|
|
293
|
-
render: (args:
|
|
293
|
+
render: (args: Omit<import("@radix-ui/react-radio-group").RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
|
|
294
294
|
};
|
|
295
|
-
export declare const
|
|
295
|
+
export declare const Disabled: {
|
|
296
296
|
args: {
|
|
297
|
-
disabled:
|
|
297
|
+
disabled: true;
|
|
298
298
|
};
|
|
299
|
-
render: (args:
|
|
299
|
+
render: (args: Omit<import("@radix-ui/react-radio-group").RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
|
|
300
300
|
};
|
|
301
301
|
export declare const Horizontal: {
|
|
302
302
|
args: {
|
|
303
|
-
disabled:
|
|
303
|
+
disabled: true;
|
|
304
304
|
};
|
|
305
|
-
render: (args:
|
|
305
|
+
render: (args: Omit<import("@radix-ui/react-radio-group").RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
|
|
306
|
+
};
|
|
307
|
+
export declare const FigmaPreview: {
|
|
308
|
+
render: () => import("react/jsx-runtime").JSX.Element;
|
|
306
309
|
};
|
|
@@ -345,6 +345,7 @@ declare const meta: {
|
|
|
345
345
|
src?: string | undefined | undefined;
|
|
346
346
|
iconMode?: "flat" | "solid" | undefined;
|
|
347
347
|
keepCloseIconOnValue?: boolean | undefined;
|
|
348
|
+
keepFooterSpace?: boolean | undefined;
|
|
348
349
|
labelClassName?: string | undefined;
|
|
349
350
|
classes?: {
|
|
350
351
|
iconWrapper?: string;
|
|
@@ -15,6 +15,7 @@ export type InputProps = {
|
|
|
15
15
|
required?: boolean;
|
|
16
16
|
isFloatingLabel?: boolean;
|
|
17
17
|
keepCloseIconOnValue?: boolean;
|
|
18
|
+
keepFooterSpace?: boolean;
|
|
18
19
|
hasClearIcon?: boolean;
|
|
19
20
|
hasSearchIcon?: boolean;
|
|
20
21
|
startIcon?: ReactNode;
|
|
@@ -49,6 +50,7 @@ export declare const TextInput: React.ForwardRefExoticComponent<{
|
|
|
49
50
|
required?: boolean;
|
|
50
51
|
isFloatingLabel?: boolean;
|
|
51
52
|
keepCloseIconOnValue?: boolean;
|
|
53
|
+
keepFooterSpace?: boolean;
|
|
52
54
|
hasClearIcon?: boolean;
|
|
53
55
|
hasSearchIcon?: boolean;
|
|
54
56
|
startIcon?: ReactNode;
|
|
@@ -17,6 +17,7 @@ declare const meta: {
|
|
|
17
17
|
required?: boolean;
|
|
18
18
|
isFloatingLabel?: boolean;
|
|
19
19
|
keepCloseIconOnValue?: boolean;
|
|
20
|
+
keepFooterSpace?: boolean;
|
|
20
21
|
hasClearIcon?: boolean;
|
|
21
22
|
hasSearchIcon?: boolean;
|
|
22
23
|
startIcon?: React.ReactNode;
|
|
@@ -55,6 +56,7 @@ declare const meta: {
|
|
|
55
56
|
required?: boolean | undefined;
|
|
56
57
|
isFloatingLabel?: boolean | undefined;
|
|
57
58
|
keepCloseIconOnValue?: boolean | undefined;
|
|
59
|
+
keepFooterSpace?: boolean | undefined;
|
|
58
60
|
hasClearIcon?: boolean | undefined;
|
|
59
61
|
hasSearchIcon?: boolean | undefined;
|
|
60
62
|
startIcon?: React.ReactNode;
|
|
@@ -396,3 +398,11 @@ export declare const CustomIcon: {
|
|
|
396
398
|
};
|
|
397
399
|
render: (args: {}) => import("react/jsx-runtime").JSX.Element;
|
|
398
400
|
};
|
|
401
|
+
export declare const KeepFooterSpace: {
|
|
402
|
+
args: {
|
|
403
|
+
label: string;
|
|
404
|
+
fullwidth: boolean;
|
|
405
|
+
keepFooterSpace: boolean;
|
|
406
|
+
};
|
|
407
|
+
render: () => import("react/jsx-runtime").JSX.Element;
|
|
408
|
+
};
|
|
@@ -23,6 +23,21 @@ export declare const helperTextVariant: (props?: ({
|
|
|
23
23
|
disabled?: boolean | null | undefined;
|
|
24
24
|
error?: boolean | null | undefined;
|
|
25
25
|
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
26
|
+
export declare const inlineEndIconWrapperVariant: (props?: ({
|
|
27
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
28
|
+
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
29
|
+
export declare const inlineStartIconWrapperVariant: (props?: ({
|
|
30
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
31
|
+
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
32
|
+
export declare const iconActionVariant: (props?: ({
|
|
33
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
34
|
+
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
35
|
+
export declare const segmentedIconWrapperVariant: (props?: ({
|
|
36
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
37
|
+
rounded?: "none" | "normal" | "full" | null | undefined;
|
|
38
|
+
error?: boolean | null | undefined;
|
|
39
|
+
position?: "end" | "start" | null | undefined;
|
|
40
|
+
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
26
41
|
export declare const iconWrapperVariant: (props?: ({
|
|
27
42
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
28
43
|
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
package/dist/index.d.ts
CHANGED
|
@@ -22,8 +22,9 @@ import { ClassValue } from 'clsx';
|
|
|
22
22
|
type ButtonProps = {
|
|
23
23
|
title?: string;
|
|
24
24
|
size?: "sm" | "md" | "lg";
|
|
25
|
+
shape?: "round" | "capsule";
|
|
25
26
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
26
|
-
variant?: "solid" | "outline" | "flat" | "link";
|
|
27
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
27
28
|
disabled?: boolean;
|
|
28
29
|
isLoading?: boolean;
|
|
29
30
|
fullwidth?: boolean;
|
|
@@ -34,8 +35,9 @@ type ButtonProps = {
|
|
|
34
35
|
declare const Button: React__default.ForwardRefExoticComponent<{
|
|
35
36
|
title?: string;
|
|
36
37
|
size?: "sm" | "md" | "lg";
|
|
38
|
+
shape?: "round" | "capsule";
|
|
37
39
|
color?: "primary" | "secondary" | "success" | "tertiary" | "info" | "warning" | "error";
|
|
38
|
-
variant?: "solid" | "outline" | "flat" | "link";
|
|
40
|
+
variant?: "solid" | "outline" | "flat" | "text" | "link";
|
|
39
41
|
disabled?: boolean;
|
|
40
42
|
isLoading?: boolean;
|
|
41
43
|
fullwidth?: boolean;
|
|
@@ -60,6 +62,7 @@ type InputProps = {
|
|
|
60
62
|
required?: boolean;
|
|
61
63
|
isFloatingLabel?: boolean;
|
|
62
64
|
keepCloseIconOnValue?: boolean;
|
|
65
|
+
keepFooterSpace?: boolean;
|
|
63
66
|
hasClearIcon?: boolean;
|
|
64
67
|
hasSearchIcon?: boolean;
|
|
65
68
|
startIcon?: ReactNode;
|
|
@@ -94,6 +97,7 @@ declare const TextInput: React__default.ForwardRefExoticComponent<{
|
|
|
94
97
|
required?: boolean;
|
|
95
98
|
isFloatingLabel?: boolean;
|
|
96
99
|
keepCloseIconOnValue?: boolean;
|
|
100
|
+
keepFooterSpace?: boolean;
|
|
97
101
|
hasClearIcon?: boolean;
|
|
98
102
|
hasSearchIcon?: boolean;
|
|
99
103
|
startIcon?: ReactNode;
|
|
@@ -144,6 +148,7 @@ declare const MaskedTextInput: React__default.ForwardRefExoticComponent<{
|
|
|
144
148
|
required?: boolean;
|
|
145
149
|
isFloatingLabel?: boolean;
|
|
146
150
|
keepCloseIconOnValue?: boolean;
|
|
151
|
+
keepFooterSpace?: boolean;
|
|
147
152
|
hasClearIcon?: boolean;
|
|
148
153
|
hasSearchIcon?: boolean;
|
|
149
154
|
startIcon?: React__default.ReactNode;
|
|
@@ -515,7 +520,8 @@ declare const Footer: FC<FooterProps>;
|
|
|
515
520
|
|
|
516
521
|
declare const ActionButton: React__default.ForwardRefExoticComponent<{
|
|
517
522
|
title?: string;
|
|
518
|
-
size?: "xs" | "sm" | "md" | "lg";
|
|
523
|
+
size?: "xxs" | "xs" | "sm" | "md" | "lg";
|
|
524
|
+
shape?: "round" | "capsule";
|
|
519
525
|
variant?: "solid" | "outline" | "icon";
|
|
520
526
|
disabled?: boolean;
|
|
521
527
|
active?: boolean;
|