@conveyorhq/arrow-ds 2.0.0-beta.7 → 2.0.0-beta.9

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.
Files changed (181) hide show
  1. package/package.json +15 -14
  2. package/public/components/Accordion/Accordion.js +8 -10
  3. package/public/components/Avatar/Avatar.js +20 -19
  4. package/public/components/Button/Button.js +2 -2
  5. package/public/components/ConveyorLogo/ConveyorLogo.js +6 -6
  6. package/public/components/Drawer/Drawer.js +7 -7
  7. package/public/components/Frame/Frame.d.ts +1 -1
  8. package/public/components/Icon/Icon.d.ts +1 -0
  9. package/public/components/Icon/Icon.js +3 -1
  10. package/public/components/MenuRenderer/MenuRenderer.js +4 -7
  11. package/public/components/Modal/Modal.js +1 -1
  12. package/public/components/OptionButton/OptionButton.js +18 -13
  13. package/public/components/Select/Select.js +4 -4
  14. package/public/components/Select/SelectPopover.js +6 -6
  15. package/public/components/Select/index.d.ts +2 -0
  16. package/public/components/Select/index.js +3 -0
  17. package/public/components/Select/theme.js +22 -22
  18. package/public/components/Svg/Svg.d.ts +3 -3
  19. package/public/components/Svg/Svg.js +1 -2
  20. package/public/components/Tooltip/Tooltip.js +11 -19
  21. package/public/components/VisuallyHidden/VisuallyHidden.d.ts +2 -1
  22. package/public/components/VisuallyHidden/VisuallyHidden.js +3 -5
  23. package/public/css/styles.css +139 -59
  24. package/public/css/styles.min.css +1 -1
  25. package/public/css/styles.min.css.map +1 -1
  26. package/public/hooks/index.d.ts +3 -0
  27. package/public/hooks/index.js +7 -1
  28. package/public/hooks/useMatchMedia.d.ts +1 -0
  29. package/public/hooks/useMatchMedia.js +27 -0
  30. package/public/hooks/usePrefersReducedMotion.d.ts +1 -0
  31. package/public/hooks/usePrefersReducedMotion.js +9 -0
  32. package/public/hooks/useScreenOrientation.d.ts +1 -0
  33. package/public/hooks/useScreenOrientation.js +24 -0
  34. package/public/{style-dictionary → src/style-dictionary}/dist/tokens.css +1 -0
  35. package/public/src/style-dictionary/dist/tokens.d.ts +428 -0
  36. package/public/src/style-dictionary/dist/tokens.js +428 -0
  37. package/public/src/style-dictionary/dist/tokens.module.js +428 -0
  38. package/public/src/style-dictionary/tailwind.config.js +87 -0
  39. package/public/storybook-components/EnumTable.js +2 -1
  40. package/public/storybook-components/Story.d.ts +2 -1
  41. package/public/storybook-components/Story.js +4 -1
  42. package/public/style-dictionary/dist/tokens.d.ts +428 -422
  43. package/public/style-dictionary/dist/tokens.js +415 -416
  44. package/public/style-dictionary/dist/tokens.module.d.ts +431 -0
  45. package/public/style-dictionary/dist/tokens.module.js +412 -415
  46. package/public/style-dictionary/src/border-radius.d.ts +31 -0
  47. package/public/style-dictionary/src/border-radius.js +10 -9
  48. package/public/style-dictionary/src/border-width.d.ts +21 -0
  49. package/public/style-dictionary/src/border-width.js +9 -8
  50. package/public/style-dictionary/src/color.d.ts +249 -0
  51. package/public/style-dictionary/src/color.js +97 -95
  52. package/public/style-dictionary/src/font-size.d.ts +45 -0
  53. package/public/style-dictionary/src/font-size.js +14 -13
  54. package/public/style-dictionary/src/font-weight.d.ts +13 -0
  55. package/public/style-dictionary/src/font-weight.js +6 -5
  56. package/public/style-dictionary/src/height.d.ts +215 -0
  57. package/public/style-dictionary/src/height.js +10 -10
  58. package/public/style-dictionary/src/leading.d.ts +17 -0
  59. package/public/style-dictionary/src/leading.js +7 -6
  60. package/public/style-dictionary/src/screen-width.d.ts +17 -0
  61. package/public/style-dictionary/src/screen-width.js +7 -6
  62. package/public/style-dictionary/src/shadow.d.ts +63 -0
  63. package/public/style-dictionary/src/shadow.js +19 -18
  64. package/public/style-dictionary/src/spacing.d.ts +197 -0
  65. package/public/style-dictionary/src/spacing.js +68 -67
  66. package/public/style-dictionary/src/tracking.d.ts +13 -0
  67. package/public/style-dictionary/src/tracking.js +6 -5
  68. package/public/style-dictionary/src/type.d.ts +13 -0
  69. package/public/style-dictionary/src/type.js +32 -31
  70. package/public/style-dictionary/src/width.d.ts +287 -0
  71. package/public/style-dictionary/src/width.js +29 -29
  72. package/public/style-dictionary/src/z-index.d.ts +53 -0
  73. package/public/style-dictionary/src/z-index.js +20 -19
  74. package/public/style-dictionary/tailwind.config.d.ts +392 -0
  75. package/public/style-dictionary/tailwind.config.js +51 -72
  76. package/src/components/Accordion/Accordion.tsx +39 -27
  77. package/src/components/Avatar/Avatar.tsx +20 -19
  78. package/src/components/Button/Button.tsx +3 -3
  79. package/src/components/Button/index.css +12 -1
  80. package/src/components/Card/Card.story.mdx +45 -37
  81. package/src/components/ConveyorLogo/ConveyorLogo.tsx +6 -6
  82. package/src/components/Drawer/Drawer.tsx +1 -1
  83. package/src/components/Frame/Frame.story.mdx +140 -5
  84. package/src/components/Frame/Frame.tsx +1 -1
  85. package/src/components/Frame/index.css +8 -13
  86. package/src/components/Icon/Icon.tsx +3 -0
  87. package/src/components/MenuRenderer/MenuRenderer.tsx +7 -9
  88. package/src/components/Modal/Modal.tsx +1 -1
  89. package/src/components/Modal/index.css +8 -3
  90. package/src/components/OptionButton/OptionButton.story.mdx +91 -36
  91. package/src/components/OptionButton/OptionButton.tsx +19 -18
  92. package/src/components/OptionButton/index.css +13 -0
  93. package/src/components/Overlay/Overlay.story.mdx +26 -0
  94. package/src/components/Select/Select.tsx +4 -4
  95. package/src/components/Select/SelectPopover.tsx +6 -6
  96. package/src/components/Select/index.ts +14 -0
  97. package/src/components/Select/theme.ts +22 -22
  98. package/src/components/Svg/Svg.story.mdx +36 -0
  99. package/src/components/Svg/Svg.tsx +6 -4
  100. package/src/components/Text/Text.story.mdx +34 -0
  101. package/src/components/Tooltip/Tooltip.story.mdx +21 -0
  102. package/src/components/Tooltip/Tooltip.tsx +23 -27
  103. package/src/components/Tooltip/index.css +31 -0
  104. package/src/components/VisuallyHidden/VisuallyHidden.story.mdx +54 -0
  105. package/src/components/VisuallyHidden/VisuallyHidden.tsx +10 -5
  106. package/src/components/VisuallyHidden/index.css +3 -0
  107. package/src/css/components.css +2 -0
  108. package/src/docs/Colors.story.mdx +13 -13
  109. package/src/docs/Spacing.story.mdx +4 -20
  110. package/src/docs/Tokens.story.mdx +230 -0
  111. package/src/docs/Typography.story.mdx +17 -94
  112. package/src/docs/hooks/useDisclosureHook.story.mdx +58 -0
  113. package/src/docs/hooks/useKeyPressHook.story.mdx +54 -0
  114. package/src/docs/hooks/useMatchMediaHook.story.mdx +42 -0
  115. package/src/docs/hooks/useOutsideClickHook.story.mdx +56 -0
  116. package/src/docs/hooks/usePrefersReducedMotion.story.mdx +61 -0
  117. package/src/docs/hooks/useScreenOrientationHook.story.mdx +56 -0
  118. package/src/docs/hooks/useStepHook.story.mdx +102 -0
  119. package/src/hooks/index.ts +3 -0
  120. package/src/hooks/useMatchMedia.ts +40 -0
  121. package/src/hooks/usePrefersReducedMotion.ts +9 -0
  122. package/src/hooks/useScreenOrientation.ts +27 -0
  123. package/src/storybook-components/EnumTable.tsx +3 -2
  124. package/src/storybook-components/Story.tsx +13 -1
  125. package/src/style-dictionary/dist/tokens.css +378 -0
  126. package/src/style-dictionary/dist/tokens.d.ts +428 -0
  127. package/src/style-dictionary/dist/tokens.js +428 -0
  128. package/src/style-dictionary/dist/tokens.module.js +428 -0
  129. package/src/style-dictionary/src/border-radius.js +11 -0
  130. package/src/style-dictionary/src/border-width.js +10 -0
  131. package/src/style-dictionary/src/color.js +98 -0
  132. package/src/style-dictionary/src/font-size.js +15 -0
  133. package/src/style-dictionary/src/font-weight.js +7 -0
  134. package/src/style-dictionary/src/height.js +13 -0
  135. package/src/style-dictionary/src/leading.js +8 -0
  136. package/src/style-dictionary/src/screen-width.js +8 -0
  137. package/src/style-dictionary/src/shadow.js +19 -0
  138. package/src/style-dictionary/src/spacing.js +69 -0
  139. package/src/style-dictionary/src/tracking.js +7 -0
  140. package/src/style-dictionary/src/type.js +34 -0
  141. package/src/style-dictionary/src/width.js +32 -0
  142. package/src/style-dictionary/src/z-index.js +21 -0
  143. package/src/style-dictionary/tailwind.config.js +87 -0
  144. package/src/tokens/borders.ts +6 -0
  145. package/src/tokens/box-shadow.ts +3 -0
  146. package/src/tokens/colors.ts +6 -0
  147. package/src/tokens/font-family.ts +3 -0
  148. package/src/tokens/font-size.ts +3 -0
  149. package/src/tokens/font-weight.ts +3 -0
  150. package/src/tokens/height.ts +3 -0
  151. package/src/tokens/index.ts +3 -2
  152. package/src/tokens/letter-spacing.ts +3 -0
  153. package/src/tokens/line-height.ts +3 -0
  154. package/src/tokens/margin.ts +3 -0
  155. package/src/tokens/padding.ts +3 -0
  156. package/src/tokens/screens.ts +3 -0
  157. package/src/tokens/sizing-scale.ts +6 -0
  158. package/src/tokens/width.ts +9 -0
  159. package/src/tokens/will-change.ts +3 -0
  160. package/src/tokens/z-index.ts +3 -0
  161. package/src/types/index.ts +3 -0
  162. package/public/components/Overlay/Overlay.story.d.ts +0 -1
  163. package/public/components/Overlay/Overlay.story.js +0 -12
  164. package/public/components/Svg/Svg.story.d.ts +0 -1
  165. package/public/components/Svg/Svg.story.js +0 -14
  166. package/public/components/Text/Text.story.d.ts +0 -1
  167. package/public/components/Text/Text.story.js +0 -31
  168. package/public/components/VisuallyHidden/VisuallyHidden.story.d.ts +0 -1
  169. package/public/components/VisuallyHidden/VisuallyHidden.story.js +0 -36
  170. package/public/components/useStep/ExampleSetupWizard.d.ts +0 -4
  171. package/public/components/useStep/ExampleSetupWizard.js +0 -33
  172. package/src/components/Overlay/Overlay.md +0 -14
  173. package/src/components/Overlay/Overlay.story.tsx +0 -12
  174. package/src/components/Svg/Svg.md +0 -14
  175. package/src/components/Svg/Svg.story.tsx +0 -15
  176. package/src/components/Text/Text.md +0 -14
  177. package/src/components/Text/Text.story.tsx +0 -12
  178. package/src/components/VisuallyHidden/VisuallyHidden.md +0 -23
  179. package/src/components/VisuallyHidden/VisuallyHidden.story.tsx +0 -19
  180. package/src/components/useStep/ExampleSetupWizard.tsx +0 -63
  181. package/src/components/useStep/useStep.story.mdx +0 -76
@@ -0,0 +1,31 @@
1
+ export namespace borderRadius {
2
+ export namespace none {
3
+ const value: string;
4
+ }
5
+ export namespace px {
6
+ const value_1: string;
7
+ export { value_1 as value };
8
+ }
9
+ export namespace sm {
10
+ const value_2: string;
11
+ export { value_2 as value };
12
+ }
13
+ export namespace md {
14
+ const value_3: string;
15
+ export { value_3 as value };
16
+ }
17
+ namespace _default {
18
+ const value_4: string;
19
+ export { value_4 as value };
20
+ export const tailwindId: string;
21
+ }
22
+ export { _default as default };
23
+ export namespace lg {
24
+ const value_5: string;
25
+ export { value_5 as value };
26
+ }
27
+ export namespace full {
28
+ const value_6: string;
29
+ export { value_6 as value };
30
+ }
31
+ }
@@ -1,11 +1,12 @@
1
+ "use strict";
1
2
  module.exports = {
2
- borderRadius: {
3
- none: { value: "0" },
4
- px: { value: "1px" },
5
- sm: { value: "2px" },
6
- md: { value: "3px" },
7
- default: { value: "4px", tailwindId: "DEFAULT" },
8
- lg: { value: "8px" },
9
- full: { value: "9999px" },
10
- },
3
+ borderRadius: {
4
+ none: { value: "0" },
5
+ px: { value: "1px" },
6
+ sm: { value: "2px" },
7
+ md: { value: "3px" },
8
+ default: { value: "4px", tailwindId: "DEFAULT" },
9
+ lg: { value: "8px" },
10
+ full: { value: "9999px" },
11
+ },
11
12
  };
@@ -0,0 +1,21 @@
1
+ export const borderWidth: {
2
+ 0: {
3
+ value: string;
4
+ };
5
+ 1: {
6
+ value: string;
7
+ };
8
+ 2: {
9
+ value: string;
10
+ };
11
+ 4: {
12
+ value: string;
13
+ };
14
+ 8: {
15
+ value: string;
16
+ };
17
+ default: {
18
+ value: string;
19
+ tailwindId: string;
20
+ };
21
+ };
@@ -1,10 +1,11 @@
1
+ "use strict";
1
2
  module.exports = {
2
- borderWidth: {
3
- 0: { value: "0" },
4
- 1: { value: "1px" },
5
- 2: { value: "2px" },
6
- 4: { value: "4px" },
7
- 8: { value: "8px" },
8
- default: { value: "1px", tailwindId: "DEFAULT" },
9
- }
3
+ borderWidth: {
4
+ 0: { value: "0" },
5
+ 1: { value: "1px" },
6
+ 2: { value: "2px" },
7
+ 4: { value: "4px" },
8
+ 8: { value: "8px" },
9
+ default: { value: "1px", tailwindId: "DEFAULT" },
10
+ }
10
11
  };
@@ -0,0 +1,249 @@
1
+ export namespace color {
2
+ const lighten: {
3
+ "100": {
4
+ value: string;
5
+ };
6
+ "200": {
7
+ value: string;
8
+ };
9
+ "300": {
10
+ value: string;
11
+ };
12
+ };
13
+ const gray: {
14
+ "100": {
15
+ value: string;
16
+ };
17
+ "200": {
18
+ value: string;
19
+ };
20
+ "300": {
21
+ value: string;
22
+ };
23
+ "400": {
24
+ value: string;
25
+ };
26
+ "500": {
27
+ value: string;
28
+ };
29
+ "600": {
30
+ value: string;
31
+ };
32
+ "700": {
33
+ value: string;
34
+ };
35
+ "800": {
36
+ value: string;
37
+ };
38
+ "900": {
39
+ value: string;
40
+ };
41
+ };
42
+ const brandGreen: {
43
+ "200": {
44
+ value: string;
45
+ };
46
+ "300": {
47
+ value: string;
48
+ };
49
+ "400": {
50
+ value: string;
51
+ };
52
+ "500": {
53
+ value: string;
54
+ };
55
+ "600": {
56
+ value: string;
57
+ };
58
+ };
59
+ const blue: {
60
+ "0": {
61
+ value: string;
62
+ };
63
+ "100": {
64
+ value: string;
65
+ };
66
+ "200": {
67
+ value: string;
68
+ };
69
+ "300": {
70
+ value: string;
71
+ };
72
+ "400": {
73
+ value: string;
74
+ };
75
+ "500": {
76
+ value: string;
77
+ };
78
+ "600": {
79
+ value: string;
80
+ };
81
+ };
82
+ const green: {
83
+ "100": {
84
+ value: string;
85
+ };
86
+ "200": {
87
+ value: string;
88
+ };
89
+ "300": {
90
+ value: string;
91
+ };
92
+ "400": {
93
+ value: string;
94
+ };
95
+ "500": {
96
+ value: string;
97
+ };
98
+ "600": {
99
+ value: string;
100
+ };
101
+ };
102
+ const gold: {
103
+ "100": {
104
+ value: string;
105
+ };
106
+ "200": {
107
+ value: string;
108
+ };
109
+ "300": {
110
+ value: string;
111
+ };
112
+ "400": {
113
+ value: string;
114
+ };
115
+ "500": {
116
+ value: string;
117
+ };
118
+ "600": {
119
+ value: string;
120
+ };
121
+ };
122
+ const red: {
123
+ "100": {
124
+ value: string;
125
+ };
126
+ "200": {
127
+ value: string;
128
+ };
129
+ "300": {
130
+ value: string;
131
+ };
132
+ "400": {
133
+ value: string;
134
+ };
135
+ "500": {
136
+ value: string;
137
+ };
138
+ "600": {
139
+ value: string;
140
+ };
141
+ };
142
+ const orange: {
143
+ "200": {
144
+ value: string;
145
+ };
146
+ "300": {
147
+ value: string;
148
+ };
149
+ "400": {
150
+ value: string;
151
+ };
152
+ "500": {
153
+ value: string;
154
+ };
155
+ "600": {
156
+ value: string;
157
+ };
158
+ };
159
+ const pink: {
160
+ "200": {
161
+ value: string;
162
+ };
163
+ "300": {
164
+ value: string;
165
+ };
166
+ "400": {
167
+ value: string;
168
+ };
169
+ "500": {
170
+ value: string;
171
+ };
172
+ "600": {
173
+ value: string;
174
+ };
175
+ };
176
+ const cyan: {
177
+ "200": {
178
+ value: string;
179
+ };
180
+ "300": {
181
+ value: string;
182
+ };
183
+ "400": {
184
+ value: string;
185
+ };
186
+ "500": {
187
+ value: string;
188
+ };
189
+ "600": {
190
+ value: string;
191
+ };
192
+ };
193
+ const purple: {
194
+ "200": {
195
+ value: string;
196
+ };
197
+ "300": {
198
+ value: string;
199
+ };
200
+ "400": {
201
+ value: string;
202
+ };
203
+ "500": {
204
+ value: string;
205
+ };
206
+ "600": {
207
+ value: string;
208
+ };
209
+ };
210
+ namespace white {
211
+ const value: string;
212
+ }
213
+ namespace black {
214
+ const value_1: string;
215
+ export { value_1 as value };
216
+ }
217
+ namespace brandBlack {
218
+ const value_2: string;
219
+ export { value_2 as value };
220
+ }
221
+ namespace screen {
222
+ const value_3: string;
223
+ export { value_3 as value };
224
+ }
225
+ namespace success {
226
+ const value_4: string;
227
+ export { value_4 as value };
228
+ }
229
+ namespace failure {
230
+ const value_5: string;
231
+ export { value_5 as value };
232
+ }
233
+ namespace caution {
234
+ const value_6: string;
235
+ export { value_6 as value };
236
+ }
237
+ namespace border {
238
+ const value_7: string;
239
+ export { value_7 as value };
240
+ }
241
+ namespace placeholder {
242
+ const value_8: string;
243
+ export { value_8 as value };
244
+ }
245
+ namespace link {
246
+ const value_9: string;
247
+ export { value_9 as value };
248
+ }
249
+ }
@@ -1,97 +1,99 @@
1
+ "use strict";
1
2
  module.exports = {
2
- color: {
3
- lighten: {
4
- "100": { value: "rgba(255, 255, 255, 0.04)" },
5
- "200": { value: "rgba(255, 255, 255, 0.08)" },
6
- "300": { value: "rgba(255, 255, 255, 0.12)" },
3
+ color: {
4
+ lighten: {
5
+ "100": { value: "rgba(255, 255, 255, 0.04)" },
6
+ "200": { value: "rgba(255, 255, 255, 0.08)" },
7
+ "300": { value: "rgba(255, 255, 255, 0.12)" },
8
+ },
9
+ gray: {
10
+ "100": { value: "#f9fbfc" },
11
+ "200": { value: "#f4f7f9" },
12
+ "300": { value: "#edf3f7" },
13
+ "400": { value: "#dee7ee" },
14
+ "500": { value: "#b9c8d2" },
15
+ "600": { value: "#86a3b5" },
16
+ "700": { value: "#47687d" },
17
+ "800": { value: "#204156" },
18
+ "900": { value: "#001b28" },
19
+ },
20
+ brandGreen: {
21
+ "200": { value: "#7de5ca" },
22
+ "300": { value: "#5cd8b7" },
23
+ "400": { value: "#33c69f" },
24
+ "500": { value: "#20b08a" },
25
+ "600": { value: "#12926f" },
26
+ },
27
+ blue: {
28
+ "0": { value: "#e6f3ff" },
29
+ "100": { value: "#c2e2ff" },
30
+ "200": { value: "#76baf9" },
31
+ "300": { value: "#3e9ef5" },
32
+ "400": { value: "#0d7de4" },
33
+ "500": { value: "#0668ca" },
34
+ "600": { value: "#0052b1" },
35
+ },
36
+ green: {
37
+ "100": { value: "#e8f5ee" },
38
+ "200": { value: "#a1ddae" },
39
+ "300": { value: "#7bc88c" },
40
+ "400": { value: "#54af68" },
41
+ "500": { value: "#3c9f52" },
42
+ "600": { value: "#29853d" },
43
+ },
44
+ gold: {
45
+ "100": { value: "#fff4de" },
46
+ "200": { value: "#ffd883" },
47
+ "300": { value: "#ffcc5a" },
48
+ "400": { value: "#fdb515" },
49
+ "500": { value: "#f0a600" },
50
+ "600": { value: "#dc9801" },
51
+ },
52
+ red: {
53
+ "100": { value: "#fdeeee" },
54
+ "200": { value: "#ffa7a1" },
55
+ "300": { value: "#fa7d76" },
56
+ "400": { value: "#f25d54" },
57
+ "500": { value: "#e4473e" },
58
+ "600": { value: "#d93329" },
59
+ },
60
+ orange: {
61
+ "200": { value: "#ffc3a1" },
62
+ "300": { value: "#ffaa7a" },
63
+ "400": { value: "#f38f56" },
64
+ "500": { value: "#ed7b3b" },
65
+ "600": { value: "#e36823" },
66
+ },
67
+ pink: {
68
+ "200": { value: "#daccd7" },
69
+ "300": { value: "#d3b8cd" },
70
+ "400": { value: "#cca8c4" },
71
+ "500": { value: "#c297b9" },
72
+ "600": { value: "#b881ac" },
73
+ },
74
+ cyan: {
75
+ "200": { value: "#a1d8f1" },
76
+ "300": { value: "#7dc3e4" },
77
+ "400": { value: "#61accf" },
78
+ "500": { value: "#3e9ecb" },
79
+ "600": { value: "#2488b6" },
80
+ },
81
+ purple: {
82
+ "200": { value: "#c8b3e8" },
83
+ "300": { value: "#a68ad2" },
84
+ "400": { value: "#8969bd" },
85
+ "500": { value: "#7757ad" },
86
+ "600": { value: "#604194" },
87
+ },
88
+ white: { value: "#fff" },
89
+ black: { value: "#000b11" },
90
+ brandBlack: { value: "#132333" },
91
+ screen: { value: "rgba(0, 0, 0, 0.25)" },
92
+ success: { value: "{color.green.400}" },
93
+ failure: { value: "{color.red.400}" },
94
+ caution: { value: "{color.gold.400}" },
95
+ border: { value: "{color.gray.400}" },
96
+ placeholder: { value: "{color.gray.600}" },
97
+ link: { value: "{color.blue.400}" },
7
98
  },
8
- gray: {
9
- "100": { value: "#f9fbfc" },
10
- "200": { value: "#f4f7f9" },
11
- "300": { value: "#edf3f7" },
12
- "400": { value: "#dee7ee" },
13
- "500": { value: "#b9c8d2" },
14
- "600": { value: "#86a3b5" },
15
- "700": { value: "#47687d" },
16
- "800": { value: "#204156" },
17
- "900": { value: "#001b28" },
18
- },
19
- brandGreen: {
20
- "200": { value: "#7de5ca" },
21
- "300": { value: "#5cd8b7" },
22
- "400": { value: "#33c69f" },
23
- "500": { value: "#20b08a" },
24
- "600": { value: "#12926f" },
25
- },
26
- blue: {
27
- "0": { value: "#e6f3ff" },
28
- "100": { value: "#c2e2ff" },
29
- "200": { value: "#76baf9" },
30
- "300": { value: "#3e9ef5" },
31
- "400": { value: "#0d7de4" },
32
- "500": { value: "#0668ca" },
33
- "600": { value: "#0052b1" },
34
- },
35
- green: {
36
- "100": { value: "#e8f5ee" },
37
- "200": { value: "#a1ddae" },
38
- "300": { value: "#7bc88c" },
39
- "400": { value: "#54af68" },
40
- "500": { value: "#3c9f52" },
41
- "600": { value: "#29853d" },
42
- },
43
- gold: {
44
- "100": { value: "#fff4de" },
45
- "200": { value: "#ffd883" },
46
- "300": { value: "#ffcc5a" },
47
- "400": { value: "#fdb515" },
48
- "500": { value: "#f0a600" },
49
- "600": { value: "#dc9801" },
50
- },
51
- red: {
52
- "100": { value: "#fdeeee" },
53
- "200": { value: "#ffa7a1" },
54
- "300": { value: "#fa7d76" },
55
- "400": { value: "#f25d54" },
56
- "500": { value: "#e4473e" },
57
- "600": { value: "#d93329" },
58
- },
59
- orange: {
60
- "200": { value: "#ffc3a1" },
61
- "300": { value: "#ffaa7a" },
62
- "400": { value: "#f38f56" },
63
- "500": { value: "#ed7b3b" },
64
- "600": { value: "#e36823" },
65
- },
66
- pink: {
67
- "200": { value: "#daccd7" },
68
- "300": { value: "#d3b8cd" },
69
- "400": { value: "#cca8c4" },
70
- "500": { value: "#c297b9" },
71
- "600": { value: "#b881ac" },
72
- },
73
- cyan: {
74
- "200": { value: "#a1d8f1" },
75
- "300": { value: "#7dc3e4" },
76
- "400": { value: "#61accf" },
77
- "500": { value: "#3e9ecb" },
78
- "600": { value: "#2488b6" },
79
- },
80
- purple: {
81
- "200": { value: "#c8b3e8" },
82
- "300": { value: "#a68ad2" },
83
- "400": { value: "#8969bd" },
84
- "500": { value: "#7757ad" },
85
- "600": { value: "#604194" },
86
- },
87
- white: { value: "#fff" },
88
- black: { value: "#000b11" },
89
- screen: { value: "rgba(0, 0, 0, 0.25)" },
90
- success: { value: "{color.green.400}" },
91
- failure: { value: "{color.red.400}" },
92
- caution: { value: "{color.gold.400}" },
93
- border: { value: "{color.gray.400}" },
94
- placeholder: { value: "{color.gray.600}" },
95
- link: { value: "{color.blue.400}" },
96
- },
97
- }
99
+ };
@@ -0,0 +1,45 @@
1
+ export namespace fontSize {
2
+ namespace h1 {
3
+ const value: string;
4
+ }
5
+ namespace h2 {
6
+ const value_1: string;
7
+ export { value_1 as value };
8
+ }
9
+ namespace h3 {
10
+ const value_2: string;
11
+ export { value_2 as value };
12
+ }
13
+ namespace h4 {
14
+ const value_3: string;
15
+ export { value_3 as value };
16
+ }
17
+ namespace h5 {
18
+ const value_4: string;
19
+ export { value_4 as value };
20
+ }
21
+ namespace h6 {
22
+ const value_5: string;
23
+ export { value_5 as value };
24
+ }
25
+ namespace bodySm {
26
+ const value_6: string;
27
+ export { value_6 as value };
28
+ }
29
+ namespace body {
30
+ const value_7: string;
31
+ export { value_7 as value };
32
+ }
33
+ namespace bodyLg {
34
+ const value_8: string;
35
+ export { value_8 as value };
36
+ }
37
+ namespace icon {
38
+ const value_9: string;
39
+ export { value_9 as value };
40
+ }
41
+ namespace iconSm {
42
+ const value_10: string;
43
+ export { value_10 as value };
44
+ }
45
+ }
@@ -1,15 +1,16 @@
1
+ "use strict";
1
2
  module.exports = {
2
- fontSize: {
3
- h1: { value: "26px" },
4
- h2: { value: "20px" },
5
- h3: { value: "16px" },
6
- h4: { value: "14px" },
7
- h5: { value: "12px" },
8
- h6: { value: "11px" },
9
- bodySm: { value: "12px" },
10
- body: { value: "14px" },
11
- bodyLg: { value: "16px" },
12
- icon: { value: "13px" },
13
- iconSm: { value: "11px" },
14
- },
3
+ fontSize: {
4
+ h1: { value: "26px" },
5
+ h2: { value: "20px" },
6
+ h3: { value: "16px" },
7
+ h4: { value: "14px" },
8
+ h5: { value: "12px" },
9
+ h6: { value: "11px" },
10
+ bodySm: { value: "12px" },
11
+ body: { value: "14px" },
12
+ bodyLg: { value: "16px" },
13
+ icon: { value: "13px" },
14
+ iconSm: { value: "11px" },
15
+ },
15
16
  };
@@ -0,0 +1,13 @@
1
+ export namespace fontWeight {
2
+ namespace regular {
3
+ const value: number;
4
+ }
5
+ namespace medium {
6
+ const value_1: number;
7
+ export { value_1 as value };
8
+ }
9
+ namespace bold {
10
+ const value_2: number;
11
+ export { value_2 as value };
12
+ }
13
+ }
@@ -1,7 +1,8 @@
1
+ "use strict";
1
2
  module.exports = {
2
- fontWeight: {
3
- regular: { value: 400 },
4
- medium: { value: 500 },
5
- bold: { value: 600 },
6
- },
3
+ fontWeight: {
4
+ regular: { value: 400 },
5
+ medium: { value: 500 },
6
+ bold: { value: 600 },
7
+ },
7
8
  };