@gataca/design-system 0.2.16 → 0.2.17

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.
@@ -9,6 +9,7 @@ export { default as RoundedButton } from './native/Buttons/RoundedButton/index.n
9
9
  export { default as ButtonIcon } from './native/Buttons/ButtonIcon/index.native';
10
10
  export { default as BrandButton } from './native/Buttons/BrandButton/index.native';
11
11
  export { default as SegmentedButton } from './native/Buttons/SegmentedButton/index.native';
12
+ export { default as Indicator } from './native/Indicator/Indicator/index.native';
12
13
  export { default as CheckIcon } from './native/Icons/icons/check';
13
14
  export { default as InfoIcon } from './native/Icons/icons/info';
14
15
  export { default as ChevronDownIcon } from './native/Icons/icons/chevronDown';
@@ -8,6 +8,7 @@ export { default as RoundedButton } from './web/Buttons/RoundedButton/index.web'
8
8
  export { default as ButtonIcon } from './web/Buttons/ButtonIcon/index.web';
9
9
  export { default as BrandButton } from './web/Buttons/BrandButton/index.web';
10
10
  export { default as SegmentedButton } from './web/Buttons/SegmentedButton/index.web';
11
+ export { default as Indicator } from './web/Indicator/Indicator/index.web';
11
12
  export { default as CheckIcon } from './web/Icons/icons/check';
12
13
  export { default as InfoIcon } from './web/Icons/icons/info';
13
14
  export { default as ChevronDownIcon } from './web/Icons/icons/chevronDown';
@@ -5,6 +5,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
5
5
  backgroundColor: string;
6
6
  iconColor: string;
7
7
  };
8
+ hover: {
9
+ backgroundColor: string;
10
+ iconColor: string;
11
+ };
8
12
  disable: {
9
13
  backgroundColor: string;
10
14
  iconColor: string;
@@ -15,6 +19,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
15
19
  backgroundColor: string;
16
20
  iconColor: string;
17
21
  };
22
+ hover: {
23
+ backgroundColor: string;
24
+ iconColor: string;
25
+ };
18
26
  disable: {
19
27
  backgroundColor: string;
20
28
  iconColor: string;
@@ -25,6 +33,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
25
33
  backgroundColor: string;
26
34
  iconColor: string;
27
35
  };
36
+ hover: {
37
+ backgroundColor: string;
38
+ iconColor: string;
39
+ };
28
40
  disable: {
29
41
  backgroundColor: string;
30
42
  iconColor: string;
@@ -35,6 +47,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
35
47
  backgroundColor: string;
36
48
  iconColor: string;
37
49
  };
50
+ hover: {
51
+ backgroundColor: string;
52
+ iconColor: string;
53
+ };
38
54
  disable: {
39
55
  backgroundColor: string;
40
56
  iconColor: string;
@@ -45,6 +61,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
45
61
  backgroundColor: string;
46
62
  iconColor: string;
47
63
  };
64
+ hover: {
65
+ backgroundColor: string;
66
+ iconColor: string;
67
+ };
48
68
  disable: {
49
69
  backgroundColor: string;
50
70
  iconColor: string;
@@ -55,6 +75,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
55
75
  backgroundColor: string;
56
76
  iconColor: string;
57
77
  };
78
+ hover: {
79
+ backgroundColor: string;
80
+ iconColor: string;
81
+ };
58
82
  disable: {
59
83
  backgroundColor: string;
60
84
  iconColor: string;
@@ -65,6 +89,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
65
89
  backgroundColor: string;
66
90
  iconColor: string;
67
91
  };
92
+ hover: {
93
+ backgroundColor: string;
94
+ iconColor: string;
95
+ };
68
96
  disable: {
69
97
  backgroundColor: string;
70
98
  iconColor: string;
@@ -75,6 +103,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
75
103
  backgroundColor: string;
76
104
  iconColor: string;
77
105
  };
106
+ hover: {
107
+ backgroundColor: string;
108
+ iconColor: string;
109
+ };
78
110
  disable: {
79
111
  backgroundColor: string;
80
112
  iconColor: string;
@@ -85,6 +117,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
85
117
  backgroundColor: string;
86
118
  iconColor: string;
87
119
  };
120
+ hover: {
121
+ backgroundColor: string;
122
+ iconColor: string;
123
+ };
88
124
  disable: {
89
125
  backgroundColor: string;
90
126
  iconColor: string;
@@ -95,6 +131,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
95
131
  backgroundColor: string;
96
132
  iconColor: string;
97
133
  };
134
+ hover: {
135
+ backgroundColor: string;
136
+ iconColor: string;
137
+ };
98
138
  disable: {
99
139
  backgroundColor: string;
100
140
  iconColor: string;
@@ -105,6 +145,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
105
145
  backgroundColor: string;
106
146
  iconColor: string;
107
147
  };
148
+ hover: {
149
+ backgroundColor: string;
150
+ iconColor: string;
151
+ };
108
152
  disable: {
109
153
  backgroundColor: string;
110
154
  iconColor: string;
@@ -115,6 +159,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
115
159
  backgroundColor: string;
116
160
  iconColor: string;
117
161
  };
162
+ hover: {
163
+ backgroundColor: string;
164
+ iconColor: string;
165
+ };
118
166
  disable: {
119
167
  backgroundColor: string;
120
168
  iconColor: string;
@@ -125,6 +173,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
125
173
  backgroundColor: string;
126
174
  iconColor: string;
127
175
  };
176
+ hover: {
177
+ backgroundColor: string;
178
+ iconColor: string;
179
+ };
128
180
  disable: {
129
181
  backgroundColor: string;
130
182
  iconColor: string;
@@ -1,6 +1,6 @@
1
1
  import { IconSize, IconStyle } from '../../Icons/icon_types';
2
2
  export type ButtonIconColor = 'yellow' | 'red' | 'grey' | 'white' | 'purple' | 'lightPurple' | 'green' | 'blue' | 'teal' | 'lightTeal' | 'pink' | 'lightPink';
3
- export type ButtonIconState = 'enable' | 'disable';
3
+ export type ButtonIconState = 'enable' | 'hover' | 'disable';
4
4
  export type ButtonIconStyle = 'square' | 'round';
5
5
  export type Size = 'large' | 'medium' | 'small';
6
6
  export type ButtonIconForm = 'square' | 'round';
@@ -0,0 +1,2 @@
1
+ import Indicator from './indicator.native';
2
+ export default Indicator;
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { IndicatorProps } from './indicator_types.native';
3
+ declare const Indicator: (props: React.PropsWithChildren<IndicatorProps>) => import("react/jsx-runtime").JSX.Element;
4
+ export default Indicator;
@@ -0,0 +1,15 @@
1
+ declare const _default: {
2
+ indicatorContainer: {
3
+ display: "flex";
4
+ justifyContent: "center";
5
+ alignItems: "center";
6
+ gap: number;
7
+ flexShrink: number;
8
+ };
9
+ indicatorText: {
10
+ minWidth: "100%";
11
+ textAlign: "center";
12
+ alignSelf: "center";
13
+ };
14
+ };
15
+ export default _default;
@@ -0,0 +1,27 @@
1
+ import { StyleType } from '../../../../styles';
2
+ import { ColorsType } from '../../../../styles/Colors';
3
+ export type IndicatorColor = 'purple' | 'green' | 'red' | 'blue';
4
+ export type IndicatorSize = '28' | '16' | '14' | '10' | '8' | '5' | '4';
5
+ export type IndicatorType = 'quantity' | 'status';
6
+ export interface IndicatorProps {
7
+ size: IndicatorSize;
8
+ color: IndicatorColor;
9
+ type: IndicatorType;
10
+ quantity?: number;
11
+ }
12
+ export declare const IndicatorBorderWidthySize: Record<string, number>;
13
+ export declare const createBgColorMap: (Colors: ColorsType) => {
14
+ purple: string;
15
+ red: string;
16
+ green: string;
17
+ blue: string;
18
+ };
19
+ export declare const fontMap: (fontStyles: StyleType) => {
20
+ '28': import("../../../../styles").FontsStyle;
21
+ '16': import("../../../../styles").FontsStyle;
22
+ '14': import("../../../../styles").FontsStyle;
23
+ '10': import("../../../../styles").FontsStyle;
24
+ '8': import("../../../../styles").FontsStyle;
25
+ '5': import("../../../../styles").FontsStyle;
26
+ '4': import("../../../../styles").FontsStyle;
27
+ };
@@ -5,6 +5,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
5
5
  backgroundColor: string;
6
6
  iconColor: string;
7
7
  };
8
+ hover: {
9
+ backgroundColor: string;
10
+ iconColor: string;
11
+ };
8
12
  disable: {
9
13
  backgroundColor: string;
10
14
  iconColor: string;
@@ -15,6 +19,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
15
19
  backgroundColor: string;
16
20
  iconColor: string;
17
21
  };
22
+ hover: {
23
+ backgroundColor: string;
24
+ iconColor: string;
25
+ };
18
26
  disable: {
19
27
  backgroundColor: string;
20
28
  iconColor: string;
@@ -25,6 +33,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
25
33
  backgroundColor: string;
26
34
  iconColor: string;
27
35
  };
36
+ hover: {
37
+ backgroundColor: string;
38
+ iconColor: string;
39
+ };
28
40
  disable: {
29
41
  backgroundColor: string;
30
42
  iconColor: string;
@@ -35,6 +47,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
35
47
  backgroundColor: string;
36
48
  iconColor: string;
37
49
  };
50
+ hover: {
51
+ backgroundColor: string;
52
+ iconColor: string;
53
+ };
38
54
  disable: {
39
55
  backgroundColor: string;
40
56
  iconColor: string;
@@ -45,6 +61,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
45
61
  backgroundColor: string;
46
62
  iconColor: string;
47
63
  };
64
+ hover: {
65
+ backgroundColor: string;
66
+ iconColor: string;
67
+ };
48
68
  disable: {
49
69
  backgroundColor: string;
50
70
  iconColor: string;
@@ -55,6 +75,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
55
75
  backgroundColor: string;
56
76
  iconColor: string;
57
77
  };
78
+ hover: {
79
+ backgroundColor: string;
80
+ iconColor: string;
81
+ };
58
82
  disable: {
59
83
  backgroundColor: string;
60
84
  iconColor: string;
@@ -65,6 +89,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
65
89
  backgroundColor: string;
66
90
  iconColor: string;
67
91
  };
92
+ hover: {
93
+ backgroundColor: string;
94
+ iconColor: string;
95
+ };
68
96
  disable: {
69
97
  backgroundColor: string;
70
98
  iconColor: string;
@@ -75,6 +103,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
75
103
  backgroundColor: string;
76
104
  iconColor: string;
77
105
  };
106
+ hover: {
107
+ backgroundColor: string;
108
+ iconColor: string;
109
+ };
78
110
  disable: {
79
111
  backgroundColor: string;
80
112
  iconColor: string;
@@ -85,6 +117,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
85
117
  backgroundColor: string;
86
118
  iconColor: string;
87
119
  };
120
+ hover: {
121
+ backgroundColor: string;
122
+ iconColor: string;
123
+ };
88
124
  disable: {
89
125
  backgroundColor: string;
90
126
  iconColor: string;
@@ -95,6 +131,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
95
131
  backgroundColor: string;
96
132
  iconColor: string;
97
133
  };
134
+ hover: {
135
+ backgroundColor: string;
136
+ iconColor: string;
137
+ };
98
138
  disable: {
99
139
  backgroundColor: string;
100
140
  iconColor: string;
@@ -105,6 +145,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
105
145
  backgroundColor: string;
106
146
  iconColor: string;
107
147
  };
148
+ hover: {
149
+ backgroundColor: string;
150
+ iconColor: string;
151
+ };
108
152
  disable: {
109
153
  backgroundColor: string;
110
154
  iconColor: string;
@@ -115,6 +159,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
115
159
  backgroundColor: string;
116
160
  iconColor: string;
117
161
  };
162
+ hover: {
163
+ backgroundColor: string;
164
+ iconColor: string;
165
+ };
118
166
  disable: {
119
167
  backgroundColor: string;
120
168
  iconColor: string;
@@ -125,6 +173,10 @@ export declare const createColorMap: (Colors: ColorsType) => {
125
173
  backgroundColor: string;
126
174
  iconColor: string;
127
175
  };
176
+ hover: {
177
+ backgroundColor: string;
178
+ iconColor: string;
179
+ };
128
180
  disable: {
129
181
  backgroundColor: string;
130
182
  iconColor: string;
@@ -1,6 +1,6 @@
1
1
  import { IconSize, IconStyle } from '../../Icons/icon_types';
2
2
  export type ButtonIconColor = 'yellow' | 'red' | 'grey' | 'white' | 'purple' | 'lightPurple' | 'green' | 'blue' | 'teal' | 'lightTeal' | 'pink' | 'lightPink';
3
- export type ButtonIconState = 'enable' | 'disable';
3
+ export type ButtonIconState = 'enable' | 'hover' | 'disable';
4
4
  export type ButtonIconStyle = 'square' | 'round';
5
5
  export type Size = 'large' | 'medium' | 'small';
6
6
  export type ButtonIconForm = 'square' | 'round';
@@ -0,0 +1,2 @@
1
+ import Indicator from './indicator.web';
2
+ export default Indicator;
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { IndicatorProps } from './indicator_types.web';
3
+ declare const Indicator: (props: React.PropsWithChildren<IndicatorProps>) => import("react/jsx-runtime").JSX.Element;
4
+ export default Indicator;
@@ -0,0 +1,4 @@
1
+ export declare const styles: () => {
2
+ indicatorContainer: React.CSSProperties;
3
+ indicatorText: React.CSSProperties;
4
+ };
@@ -0,0 +1,27 @@
1
+ import { StyleType } from '../../../../styles';
2
+ import { ColorsType } from '../../../../styles/Colors';
3
+ export type IndicatorColor = 'purple' | 'green' | 'red' | 'blue';
4
+ export type IndicatorSize = '28' | '16' | '14' | '10' | '8' | '5' | '4';
5
+ export type IndicatorType = 'quantity' | 'status';
6
+ export interface IndicatorProps {
7
+ size: IndicatorSize;
8
+ color: IndicatorColor;
9
+ type: IndicatorType;
10
+ quantity?: number;
11
+ }
12
+ export declare const IndicatorBorderWidthySize: Record<string, number>;
13
+ export declare const createBgColorMap: (Colors: ColorsType) => {
14
+ purple: string;
15
+ red: string;
16
+ green: string;
17
+ blue: string;
18
+ };
19
+ export declare const fontMap: (fontStyles: StyleType) => {
20
+ '28': import("../../../../styles").FontsStyle;
21
+ '16': import("../../../../styles").FontsStyle;
22
+ '14': import("../../../../styles").FontsStyle;
23
+ '10': import("../../../../styles").FontsStyle;
24
+ '8': import("../../../../styles").FontsStyle;
25
+ '5': import("../../../../styles").FontsStyle;
26
+ '4': import("../../../../styles").FontsStyle;
27
+ };