@taikai/rocket-kit 2.0.2 → 3.0.0-beta.2
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/atoms/button/index.d.ts +10 -9
- package/dist/atoms/button/stories/button.stories.d.ts +16 -9
- package/dist/atoms/button/styles.d.ts +2 -2
- package/dist/atoms/button/types.d.ts +2 -1
- package/dist/atoms/button-dropdown/index.d.ts +8 -4
- package/dist/atoms/button-dropdown/stories/button-dropdown.stories.d.ts +11 -2
- package/dist/atoms/button-link/index.d.ts +11 -10
- package/dist/atoms/button-link/stories/button-link.stories.d.ts +17 -12
- package/dist/atoms/button-link/styles.d.ts +2 -1
- package/dist/atoms/tag/index.d.ts +1 -0
- package/dist/atoms/tag/stories/tag.stories.d.ts +7 -0
- package/dist/atoms/tag/styles.d.ts +1 -0
- package/dist/atoms/tag/types.d.ts +2 -1
- package/dist/atoms/tag-number/index.d.ts +5 -2
- package/dist/atoms/tag-number/stories/tag-number.stories.d.ts +16 -0
- package/dist/atoms/tag-number/styles.d.ts +7 -1
- package/dist/ions/variables.d.ts +148 -2
- package/dist/molecules/table/index.d.ts +3 -0
- package/dist/molecules/table/stories/table.stories.d.ts +18 -0
- package/dist/molecules/table/styles.d.ts +4 -2
- package/dist/organisms/loading-state/index.d.ts +1 -4
- package/dist/organisms/loading-state/stories/loading-state.stories.d.ts +0 -3
- package/dist/organisms/loading-state/styles.d.ts +0 -1
- package/dist/rocket-kit.cjs.development.js +664 -671
- package/dist/rocket-kit.cjs.development.js.map +1 -1
- package/dist/rocket-kit.cjs.production.min.js +351 -509
- package/dist/rocket-kit.cjs.production.min.js.map +1 -1
- package/dist/rocket-kit.esm.js +666 -673
- package/dist/rocket-kit.esm.js.map +1 -1
- package/dist/utils/hooks/use-color.d.ts +4 -0
- package/package.json +4 -4
- package/dist/utils/hooks/use-mouse-move-effect.d.ts +0 -5
|
@@ -2,21 +2,22 @@ import React, { CSSProperties } from 'react';
|
|
|
2
2
|
import { ButtonColor, ButtonVariant } from './types';
|
|
3
3
|
export interface ButtonProps {
|
|
4
4
|
variant?: ButtonVariant;
|
|
5
|
-
|
|
5
|
+
rounded?: boolean;
|
|
6
6
|
color?: ButtonColor;
|
|
7
|
-
|
|
7
|
+
txtColor?: ButtonColor;
|
|
8
|
+
type?: 'submit' | 'reset' | 'button';
|
|
8
9
|
className?: string;
|
|
9
|
-
|
|
10
|
-
ariaLabel?: string;
|
|
10
|
+
style?: CSSProperties;
|
|
11
11
|
action?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
|
|
12
|
-
|
|
12
|
+
value?: string;
|
|
13
|
+
iconPosition?: 'left' | 'right';
|
|
14
|
+
icon?: string;
|
|
13
15
|
loading?: boolean;
|
|
16
|
+
ariaLabel?: string;
|
|
17
|
+
ariaHidden?: boolean;
|
|
14
18
|
dataTestId?: string;
|
|
15
19
|
eventId?: string;
|
|
16
|
-
|
|
17
|
-
iconPosition?: 'left' | 'right';
|
|
18
|
-
style?: CSSProperties;
|
|
19
|
-
type?: 'submit' | 'reset' | 'button';
|
|
20
|
+
disabled?: boolean;
|
|
20
21
|
}
|
|
21
22
|
declare const Button: (props: ButtonProps) => JSX.Element;
|
|
22
23
|
export default Button;
|
|
@@ -4,19 +4,19 @@ declare const _default: {
|
|
|
4
4
|
title: string;
|
|
5
5
|
component: (props: ButtonProps) => JSX.Element;
|
|
6
6
|
argTypes: {
|
|
7
|
-
|
|
7
|
+
variant: {
|
|
8
8
|
control: {
|
|
9
9
|
type: string;
|
|
10
10
|
options: string[];
|
|
11
11
|
};
|
|
12
12
|
};
|
|
13
|
-
|
|
13
|
+
color: {
|
|
14
14
|
control: {
|
|
15
15
|
type: string;
|
|
16
16
|
options: string[];
|
|
17
17
|
};
|
|
18
18
|
};
|
|
19
|
-
|
|
19
|
+
txtColor: {
|
|
20
20
|
control: {
|
|
21
21
|
type: string;
|
|
22
22
|
options: string[];
|
|
@@ -28,6 +28,12 @@ declare const _default: {
|
|
|
28
28
|
options: string[];
|
|
29
29
|
};
|
|
30
30
|
};
|
|
31
|
+
icon: {
|
|
32
|
+
control: {
|
|
33
|
+
type: string;
|
|
34
|
+
options: string[];
|
|
35
|
+
};
|
|
36
|
+
};
|
|
31
37
|
};
|
|
32
38
|
};
|
|
33
39
|
export default _default;
|
|
@@ -35,16 +41,17 @@ export declare const ButtonComponent: {
|
|
|
35
41
|
(args: ButtonProps): JSX.Element;
|
|
36
42
|
storyName: string;
|
|
37
43
|
args: {
|
|
38
|
-
value: string;
|
|
39
44
|
variant: string;
|
|
45
|
+
rounded: boolean;
|
|
40
46
|
color: string;
|
|
41
|
-
|
|
47
|
+
txtColor: string;
|
|
42
48
|
className: string;
|
|
43
|
-
|
|
49
|
+
value: string;
|
|
50
|
+
iconPosition: string;
|
|
51
|
+
icon: string;
|
|
52
|
+
loading: boolean;
|
|
44
53
|
ariaLabel: string;
|
|
54
|
+
ariaHidden: boolean;
|
|
45
55
|
disabled: boolean;
|
|
46
|
-
loading: boolean;
|
|
47
|
-
icon: string;
|
|
48
|
-
iconPosition: string;
|
|
49
56
|
};
|
|
50
57
|
};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { ButtonColor, ButtonVariant } from './types';
|
|
2
2
|
interface ButtonProps {
|
|
3
3
|
variant?: ButtonVariant;
|
|
4
|
-
|
|
4
|
+
rounded?: boolean;
|
|
5
5
|
color?: ButtonColor;
|
|
6
|
+
txtColor?: ButtonColor;
|
|
6
7
|
value?: String;
|
|
7
8
|
iconPosition?: 'left' | 'right';
|
|
8
9
|
}
|
|
9
|
-
export declare const pulseKeyframes: import("styled-components").Keyframes;
|
|
10
10
|
export declare const ButtonWrapper: import("styled-components").StyledComponent<"button", any, ButtonProps, never>;
|
|
11
11
|
export {};
|
|
@@ -1,2 +1,3 @@
|
|
|
1
|
+
export declare const colors: string[];
|
|
1
2
|
export declare type ButtonVariant = 'solid' | 'outline' | 'text';
|
|
2
|
-
export declare type ButtonColor =
|
|
3
|
+
export declare type ButtonColor = typeof colors[number];
|
|
@@ -3,15 +3,19 @@ import { ButtonColor, ButtonVariant } from '../button/types';
|
|
|
3
3
|
import { ActionMenu } from './types';
|
|
4
4
|
export interface ActionsMenuInterface<T> {
|
|
5
5
|
variant?: ButtonVariant;
|
|
6
|
+
rounded?: boolean;
|
|
6
7
|
color?: ButtonColor;
|
|
7
|
-
|
|
8
|
-
icon?: string;
|
|
8
|
+
txtColor?: ButtonColor;
|
|
9
9
|
className?: string;
|
|
10
10
|
style?: CSSProperties;
|
|
11
|
-
ariaLabel?: string;
|
|
12
11
|
actions: ActionMenu<T>[];
|
|
13
|
-
|
|
12
|
+
value?: string;
|
|
13
|
+
icon: string;
|
|
14
|
+
ariaLabel?: string;
|
|
15
|
+
ariaHidden?: boolean;
|
|
14
16
|
dataTestId?: string;
|
|
17
|
+
eventId?: string;
|
|
18
|
+
data?: T;
|
|
15
19
|
startsOpen?: boolean;
|
|
16
20
|
disabled?: boolean;
|
|
17
21
|
}
|
|
@@ -4,13 +4,19 @@ declare const _default: {
|
|
|
4
4
|
title: string;
|
|
5
5
|
component: <T>(props: ActionsMenuInterface<T>) => JSX.Element;
|
|
6
6
|
argTypes: {
|
|
7
|
+
variant: {
|
|
8
|
+
control: {
|
|
9
|
+
type: string;
|
|
10
|
+
options: string[];
|
|
11
|
+
};
|
|
12
|
+
};
|
|
7
13
|
color: {
|
|
8
14
|
control: {
|
|
9
15
|
type: string;
|
|
10
16
|
options: string[];
|
|
11
17
|
};
|
|
12
18
|
};
|
|
13
|
-
|
|
19
|
+
txtColor: {
|
|
14
20
|
control: {
|
|
15
21
|
type: string;
|
|
16
22
|
options: string[];
|
|
@@ -30,17 +36,20 @@ export declare const ButtonDropdownComponent: {
|
|
|
30
36
|
storyName: string;
|
|
31
37
|
args: {
|
|
32
38
|
variant: string;
|
|
39
|
+
rounded: boolean;
|
|
33
40
|
color: string;
|
|
41
|
+
txtColor: string;
|
|
42
|
+
className: string;
|
|
34
43
|
value: string;
|
|
35
44
|
icon: string;
|
|
36
45
|
ariaLabel: string;
|
|
46
|
+
ariaHidden: boolean;
|
|
37
47
|
actions: {
|
|
38
48
|
id: string;
|
|
39
49
|
value: string;
|
|
40
50
|
url: null;
|
|
41
51
|
action: () => void;
|
|
42
52
|
}[];
|
|
43
|
-
dataTestId: string;
|
|
44
53
|
startsOpen: boolean;
|
|
45
54
|
disabled: boolean;
|
|
46
55
|
};
|
|
@@ -1,22 +1,23 @@
|
|
|
1
1
|
import React, { CSSProperties } from 'react';
|
|
2
2
|
import { ButtonColor, ButtonVariant } from '../button/types';
|
|
3
3
|
export interface ButtonLinkProps {
|
|
4
|
-
url: string;
|
|
5
|
-
blank?: boolean;
|
|
6
4
|
variant?: ButtonVariant;
|
|
7
|
-
|
|
5
|
+
rounded?: boolean;
|
|
8
6
|
color?: ButtonColor;
|
|
9
|
-
|
|
7
|
+
txtColor?: ButtonColor;
|
|
10
8
|
className?: string;
|
|
11
|
-
|
|
12
|
-
ariaLabel?: string;
|
|
9
|
+
style?: CSSProperties;
|
|
13
10
|
action?: (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void;
|
|
11
|
+
url: string;
|
|
12
|
+
blank?: boolean;
|
|
13
|
+
rel?: string;
|
|
14
|
+
value?: string;
|
|
15
|
+
iconPosition?: 'left' | 'right';
|
|
16
|
+
icon?: string;
|
|
14
17
|
dataTestId?: string;
|
|
15
18
|
eventId?: string;
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
style?: CSSProperties;
|
|
19
|
-
rel?: string;
|
|
19
|
+
ariaLabel?: string;
|
|
20
|
+
ariaHidden?: boolean;
|
|
20
21
|
}
|
|
21
22
|
declare const ButtonLink: (props: ButtonLinkProps) => JSX.Element;
|
|
22
23
|
export default ButtonLink;
|
|
@@ -4,19 +4,19 @@ declare const _default: {
|
|
|
4
4
|
title: string;
|
|
5
5
|
component: (props: ButtonLinkProps) => JSX.Element;
|
|
6
6
|
argTypes: {
|
|
7
|
-
|
|
7
|
+
variant: {
|
|
8
8
|
control: {
|
|
9
9
|
type: string;
|
|
10
10
|
options: string[];
|
|
11
11
|
};
|
|
12
12
|
};
|
|
13
|
-
|
|
13
|
+
color: {
|
|
14
14
|
control: {
|
|
15
15
|
type: string;
|
|
16
16
|
options: string[];
|
|
17
17
|
};
|
|
18
18
|
};
|
|
19
|
-
|
|
19
|
+
txtColor: {
|
|
20
20
|
control: {
|
|
21
21
|
type: string;
|
|
22
22
|
options: string[];
|
|
@@ -28,6 +28,12 @@ declare const _default: {
|
|
|
28
28
|
options: string[];
|
|
29
29
|
};
|
|
30
30
|
};
|
|
31
|
+
icon: {
|
|
32
|
+
control: {
|
|
33
|
+
type: string;
|
|
34
|
+
options: string[];
|
|
35
|
+
};
|
|
36
|
+
};
|
|
31
37
|
};
|
|
32
38
|
};
|
|
33
39
|
export default _default;
|
|
@@ -35,19 +41,18 @@ export declare const ButtonLinkComponent: {
|
|
|
35
41
|
(args: ButtonLinkProps): JSX.Element;
|
|
36
42
|
storyName: string;
|
|
37
43
|
args: {
|
|
38
|
-
value: string;
|
|
39
44
|
variant: string;
|
|
45
|
+
rounded: boolean;
|
|
40
46
|
color: string;
|
|
41
|
-
|
|
47
|
+
txtColor: string;
|
|
42
48
|
className: string;
|
|
43
|
-
querySelector: string;
|
|
44
|
-
ariaLabel: string;
|
|
45
|
-
disabled: boolean;
|
|
46
|
-
loading: boolean;
|
|
47
|
-
icon: string;
|
|
48
|
-
iconPosition: string;
|
|
49
|
-
rel: string;
|
|
50
49
|
url: string;
|
|
51
50
|
blank: boolean;
|
|
51
|
+
rel: string;
|
|
52
|
+
value: string;
|
|
53
|
+
iconPosition: string;
|
|
54
|
+
icon: string;
|
|
55
|
+
ariaLabel: string;
|
|
56
|
+
ariaHidden: boolean;
|
|
52
57
|
};
|
|
53
58
|
};
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { ButtonColor, ButtonVariant } from '../button/types';
|
|
2
2
|
interface ButtonStyleProps {
|
|
3
3
|
variant?: ButtonVariant;
|
|
4
|
-
|
|
4
|
+
rounded?: boolean;
|
|
5
5
|
color?: ButtonColor;
|
|
6
|
+
txtColor?: ButtonColor;
|
|
6
7
|
value?: String;
|
|
7
8
|
iconPosition?: 'left' | 'right';
|
|
8
9
|
}
|
|
@@ -10,6 +10,12 @@ declare const _default: {
|
|
|
10
10
|
options: string[];
|
|
11
11
|
};
|
|
12
12
|
};
|
|
13
|
+
txtColor: {
|
|
14
|
+
control: {
|
|
15
|
+
type: string;
|
|
16
|
+
options: string[];
|
|
17
|
+
};
|
|
18
|
+
};
|
|
13
19
|
variant: {
|
|
14
20
|
control: {
|
|
15
21
|
type: string;
|
|
@@ -24,6 +30,7 @@ export declare const TagPrimaryComponent: {
|
|
|
24
30
|
storyName: string;
|
|
25
31
|
args: {
|
|
26
32
|
color: string;
|
|
33
|
+
txtColor: string;
|
|
27
34
|
variant: string;
|
|
28
35
|
value: string;
|
|
29
36
|
};
|
|
@@ -2,6 +2,7 @@ import { TagVariant, TagColor } from './types';
|
|
|
2
2
|
interface TagWrapperProps {
|
|
3
3
|
variant?: TagVariant;
|
|
4
4
|
color?: TagColor;
|
|
5
|
+
txtColor?: TagColor;
|
|
5
6
|
}
|
|
6
7
|
export declare const TagWrapper: import("styled-components").StyledComponent<"span", any, TagWrapperProps, never>;
|
|
7
8
|
export {};
|
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
import { CSSProperties } from 'react';
|
|
2
|
+
import { TagColor } from '../tag/types';
|
|
2
3
|
export interface TagNumberProps {
|
|
3
|
-
label: string;
|
|
4
|
-
value: number | string;
|
|
5
4
|
className?: string;
|
|
6
5
|
style?: CSSProperties;
|
|
6
|
+
color?: TagColor;
|
|
7
|
+
valueColor?: TagColor;
|
|
8
|
+
label: string;
|
|
9
|
+
value: number | string;
|
|
7
10
|
}
|
|
8
11
|
declare const TagNumber: (props: TagNumberProps) => JSX.Element;
|
|
9
12
|
export default TagNumber;
|
|
@@ -3,13 +3,29 @@ import { TagNumberProps } from '..';
|
|
|
3
3
|
declare const _default: {
|
|
4
4
|
title: string;
|
|
5
5
|
component: (props: TagNumberProps) => JSX.Element;
|
|
6
|
+
argTypes: {
|
|
7
|
+
color: {
|
|
8
|
+
control: {
|
|
9
|
+
type: string;
|
|
10
|
+
options: string[];
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
valueColor: {
|
|
14
|
+
control: {
|
|
15
|
+
type: string;
|
|
16
|
+
options: string[];
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
};
|
|
6
20
|
};
|
|
7
21
|
export default _default;
|
|
8
22
|
export declare const TagNumberComponent: {
|
|
9
23
|
(args: TagNumberProps): JSX.Element;
|
|
10
24
|
storyName: string;
|
|
11
25
|
args: {
|
|
26
|
+
color: string;
|
|
12
27
|
label: string;
|
|
13
28
|
value: number;
|
|
29
|
+
valueColor: string;
|
|
14
30
|
};
|
|
15
31
|
};
|
|
@@ -1 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
import { TagColor } from '../tag/types';
|
|
2
|
+
interface TagWrapperProps {
|
|
3
|
+
color?: TagColor;
|
|
4
|
+
valueColor?: TagColor;
|
|
5
|
+
}
|
|
6
|
+
export declare const TagWrapper: import("styled-components").StyledComponent<"div", any, TagWrapperProps, never>;
|
|
7
|
+
export {};
|
package/dist/ions/variables.d.ts
CHANGED
|
@@ -1,4 +1,136 @@
|
|
|
1
1
|
export declare const colors: {
|
|
2
|
+
black: string;
|
|
3
|
+
white: string;
|
|
4
|
+
grey50: string;
|
|
5
|
+
grey100: string;
|
|
6
|
+
grey150: string;
|
|
7
|
+
grey200: string;
|
|
8
|
+
grey300: string;
|
|
9
|
+
grey400: string;
|
|
10
|
+
grey500: string;
|
|
11
|
+
grey600: string;
|
|
12
|
+
grey700: string;
|
|
13
|
+
grey800: string;
|
|
14
|
+
grey850: string;
|
|
15
|
+
grey900: string;
|
|
16
|
+
grey950: string;
|
|
17
|
+
blue50: string;
|
|
18
|
+
blue100: string;
|
|
19
|
+
blue150: string;
|
|
20
|
+
blue200: string;
|
|
21
|
+
blue300: string;
|
|
22
|
+
blue400: string;
|
|
23
|
+
blue500: string;
|
|
24
|
+
blue600: string;
|
|
25
|
+
blue700: string;
|
|
26
|
+
blue800: string;
|
|
27
|
+
blue850: string;
|
|
28
|
+
blue900: string;
|
|
29
|
+
blue950: string;
|
|
30
|
+
purple50: string;
|
|
31
|
+
purple100: string;
|
|
32
|
+
purple150: string;
|
|
33
|
+
purple200: string;
|
|
34
|
+
purple300: string;
|
|
35
|
+
purple400: string;
|
|
36
|
+
purple500: string;
|
|
37
|
+
purple600: string;
|
|
38
|
+
purple700: string;
|
|
39
|
+
purple800: string;
|
|
40
|
+
purple850: string;
|
|
41
|
+
purple900: string;
|
|
42
|
+
purple950: string;
|
|
43
|
+
red50: string;
|
|
44
|
+
red100: string;
|
|
45
|
+
red150: string;
|
|
46
|
+
red200: string;
|
|
47
|
+
red300: string;
|
|
48
|
+
red400: string;
|
|
49
|
+
red500: string;
|
|
50
|
+
red600: string;
|
|
51
|
+
red700: string;
|
|
52
|
+
red800: string;
|
|
53
|
+
red850: string;
|
|
54
|
+
red900: string;
|
|
55
|
+
red950: string;
|
|
56
|
+
oracle50: string;
|
|
57
|
+
oracle100: string;
|
|
58
|
+
oracle150: string;
|
|
59
|
+
oracle200: string;
|
|
60
|
+
oracle300: string;
|
|
61
|
+
oracle400: string;
|
|
62
|
+
oracle500: string;
|
|
63
|
+
oracle600: string;
|
|
64
|
+
oracle700: string;
|
|
65
|
+
oracle800: string;
|
|
66
|
+
oracle850: string;
|
|
67
|
+
oracle900: string;
|
|
68
|
+
oracle950: string;
|
|
69
|
+
green50: string;
|
|
70
|
+
green100: string;
|
|
71
|
+
green150: string;
|
|
72
|
+
green200: string;
|
|
73
|
+
green300: string;
|
|
74
|
+
green400: string;
|
|
75
|
+
green500: string;
|
|
76
|
+
green600: string;
|
|
77
|
+
green700: string;
|
|
78
|
+
green800: string;
|
|
79
|
+
green850: string;
|
|
80
|
+
green900: string;
|
|
81
|
+
green950: string;
|
|
82
|
+
orange50: string;
|
|
83
|
+
orange100: string;
|
|
84
|
+
orange150: string;
|
|
85
|
+
orange200: string;
|
|
86
|
+
orange300: string;
|
|
87
|
+
orange400: string;
|
|
88
|
+
orange500: string;
|
|
89
|
+
orange600: string;
|
|
90
|
+
orange700: string;
|
|
91
|
+
orange800: string;
|
|
92
|
+
orange850: string;
|
|
93
|
+
orange900: string;
|
|
94
|
+
orange950: string;
|
|
95
|
+
yellow50: string;
|
|
96
|
+
yellow100: string;
|
|
97
|
+
yellow150: string;
|
|
98
|
+
yellow200: string;
|
|
99
|
+
yellow300: string;
|
|
100
|
+
yellow400: string;
|
|
101
|
+
yellow500: string;
|
|
102
|
+
yellow600: string;
|
|
103
|
+
yellow700: string;
|
|
104
|
+
yellow800: string;
|
|
105
|
+
yellow850: string;
|
|
106
|
+
yellow900: string;
|
|
107
|
+
yellow950: string;
|
|
108
|
+
paleBlue50: string;
|
|
109
|
+
paleBlue100: string;
|
|
110
|
+
paleBlue150: string;
|
|
111
|
+
paleBlue200: string;
|
|
112
|
+
paleBlue300: string;
|
|
113
|
+
paleBlue400: string;
|
|
114
|
+
paleBlue500: string;
|
|
115
|
+
paleBlue600: string;
|
|
116
|
+
paleBlue700: string;
|
|
117
|
+
paleBlue800: string;
|
|
118
|
+
paleBlue850: string;
|
|
119
|
+
paleBlue900: string;
|
|
120
|
+
paleBlue950: string;
|
|
121
|
+
paleOrange50: string;
|
|
122
|
+
paleOrange100: string;
|
|
123
|
+
paleOrange150: string;
|
|
124
|
+
paleOrange200: string;
|
|
125
|
+
paleOrange300: string;
|
|
126
|
+
paleOrange400: string;
|
|
127
|
+
paleOrange500: string;
|
|
128
|
+
paleOrange600: string;
|
|
129
|
+
paleOrange700: string;
|
|
130
|
+
paleOrange800: string;
|
|
131
|
+
paleOrange850: string;
|
|
132
|
+
paleOrange900: string;
|
|
133
|
+
paleOrange950: string;
|
|
2
134
|
normal: string;
|
|
3
135
|
light: string;
|
|
4
136
|
blue: string;
|
|
@@ -8,7 +140,6 @@ export declare const colors: {
|
|
|
8
140
|
red: string;
|
|
9
141
|
lightRed: string;
|
|
10
142
|
darkRed: string;
|
|
11
|
-
purple: string;
|
|
12
143
|
lightPurple: string;
|
|
13
144
|
darkPurple: string;
|
|
14
145
|
green: string;
|
|
@@ -18,8 +149,23 @@ export declare const colors: {
|
|
|
18
149
|
lightGrey: string;
|
|
19
150
|
darkGrey: string;
|
|
20
151
|
};
|
|
21
|
-
export declare const
|
|
152
|
+
export declare const colorHues: number[];
|
|
153
|
+
export declare const typography: {
|
|
154
|
+
defaultFont: string;
|
|
155
|
+
defaultSize: string;
|
|
22
156
|
regular: number;
|
|
23
157
|
medium: number;
|
|
24
158
|
bold: number;
|
|
159
|
+
letterSpacing: string;
|
|
160
|
+
};
|
|
161
|
+
export declare const button: {
|
|
162
|
+
height: string;
|
|
163
|
+
borderWidth: string;
|
|
164
|
+
borderRadius: string;
|
|
165
|
+
padding: string;
|
|
166
|
+
iconSpacing: string;
|
|
167
|
+
iconSize: string;
|
|
168
|
+
};
|
|
169
|
+
export declare const misc: {
|
|
170
|
+
transitionDuration: string;
|
|
25
171
|
};
|
|
@@ -19,6 +19,9 @@ export interface TableProps<CellDataType> {
|
|
|
19
19
|
dataTestId?: string;
|
|
20
20
|
menuDataTestId?: string;
|
|
21
21
|
actionMenuTestId?: string;
|
|
22
|
+
loading?: boolean;
|
|
23
|
+
loadingColumns?: number;
|
|
24
|
+
loadingRows?: number;
|
|
22
25
|
showEmpty?: boolean;
|
|
23
26
|
emptyValue?: string;
|
|
24
27
|
className?: string;
|
|
@@ -11,6 +11,21 @@ declare const _default: {
|
|
|
11
11
|
type: string;
|
|
12
12
|
};
|
|
13
13
|
};
|
|
14
|
+
loading: {
|
|
15
|
+
control: {
|
|
16
|
+
type: string;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
loadingColumns: {
|
|
20
|
+
control: {
|
|
21
|
+
type: string;
|
|
22
|
+
};
|
|
23
|
+
};
|
|
24
|
+
loadingRows: {
|
|
25
|
+
control: {
|
|
26
|
+
type: string;
|
|
27
|
+
};
|
|
28
|
+
};
|
|
14
29
|
};
|
|
15
30
|
};
|
|
16
31
|
export default _default;
|
|
@@ -19,6 +34,9 @@ export declare const TableComponent: {
|
|
|
19
34
|
storyName: string;
|
|
20
35
|
args: {
|
|
21
36
|
border: boolean;
|
|
37
|
+
loading: boolean;
|
|
38
|
+
loadingColumns: number;
|
|
39
|
+
loadingRows: number;
|
|
22
40
|
};
|
|
23
41
|
};
|
|
24
42
|
export declare const TableEmptyComponent: {
|
|
@@ -1,7 +1,9 @@
|
|
|
1
|
-
interface
|
|
1
|
+
interface TableProps {
|
|
2
2
|
border?: boolean;
|
|
3
|
+
loadingState?: boolean;
|
|
3
4
|
}
|
|
4
5
|
export declare const TableWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
6
|
export declare const OverflowWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
6
|
-
export declare const Table: import("styled-components").StyledComponent<"table", any,
|
|
7
|
+
export declare const Table: import("styled-components").StyledComponent<"table", any, TableProps, never>;
|
|
8
|
+
export declare const SkeletonCell: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
7
9
|
export {};
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export interface LoadingStateProps {
|
|
3
|
-
type: 'text' | 'card' | '
|
|
3
|
+
type: 'text' | 'card' | 'value';
|
|
4
4
|
lines?: number;
|
|
5
5
|
cardsNumber?: number;
|
|
6
|
-
header?: boolean;
|
|
7
|
-
columnsNumber?: number;
|
|
8
|
-
rowsNumber?: number;
|
|
9
6
|
center?: boolean;
|
|
10
7
|
}
|
|
11
8
|
declare const LoadingState: (props: LoadingStateProps) => JSX.Element;
|
|
@@ -4,6 +4,5 @@ interface LoadingStateProps {
|
|
|
4
4
|
center?: boolean;
|
|
5
5
|
}
|
|
6
6
|
export declare const Wrapper: import("styled-components").StyledComponent<"div", any, LoadingStateProps, never>;
|
|
7
|
-
export declare const Table: import("styled-components").StyledComponent<"div", any, LoadingStateProps, never>;
|
|
8
7
|
export declare const Grid: import("styled-components").StyledComponent<"div", any, LoadingStateProps, never>;
|
|
9
8
|
export {};
|