@clickhouse/click-ui 0.0.0 → 0.0.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.
Files changed (236) hide show
  1. package/.eslintrc.cjs +1 -0
  2. package/.prettierrc +14 -0
  3. package/.storybook/main.ts +1 -0
  4. package/.storybook/manager.ts +11 -0
  5. package/.storybook/preview-head.html +2 -4
  6. package/.storybook/preview.tsx +13 -4
  7. package/.storybook/theme.ts +16 -0
  8. package/build-tokens.js +6 -6
  9. package/package.json +25 -5
  10. package/public/favicon.ico +0 -0
  11. package/public/logo.svg +17 -0
  12. package/src/App.tsx +102 -39
  13. package/src/components/Accordion/Accordion.stories.tsx +4 -54
  14. package/src/components/Accordion/Accordion.tsx +1 -0
  15. package/src/components/Alert/Alert.stories.tsx +14 -0
  16. package/src/components/Alert/Alert.test.tsx +27 -0
  17. package/src/components/Alert/Alert.tsx +130 -0
  18. package/src/components/Avatar/Avatar.stories.tsx +13 -0
  19. package/src/components/Avatar/Avatar.tsx +64 -0
  20. package/src/components/Badge/Badge.stories.ts +19 -3
  21. package/src/components/Badge/Badge.test.tsx +6 -1
  22. package/src/components/Badge/Badge.tsx +67 -13
  23. package/src/components/BigStat/BigStat.stories.ts +10 -5
  24. package/src/components/BigStat/BigStat.tsx +36 -24
  25. package/src/components/Button/Button.stories.ts +12 -68
  26. package/src/components/Button/Button.test.tsx +2 -2
  27. package/src/components/Button/Button.tsx +59 -41
  28. package/src/components/ButtonGroup/ButtonGroup.stories.ts +3 -3
  29. package/src/components/Card/Card.stories.ts +3 -3
  30. package/src/components/Checkbox/Checkbox.stories.tsx +35 -0
  31. package/src/components/Checkbox/Checkbox.test.tsx +41 -0
  32. package/src/components/Checkbox/Checkbox.tsx +89 -0
  33. package/src/components/ContextMenu/ContextMenu.stories.tsx +73 -0
  34. package/src/components/ContextMenu/ContextMenu.test.tsx +152 -0
  35. package/src/components/ContextMenu/ContextMenu.tsx +155 -0
  36. package/src/components/Dropdown/Dropdown.stories.tsx +64 -0
  37. package/src/components/Dropdown/Dropdown.test.tsx +141 -0
  38. package/src/components/Dropdown/Dropdown.tsx +149 -0
  39. package/src/components/FormField/Label.stories.tsx +39 -0
  40. package/src/components/FormField/Label.tsx +47 -0
  41. package/src/components/FormField/Select.stories.tsx +48 -0
  42. package/src/components/FormField/Select.test.tsx +216 -0
  43. package/src/components/FormField/Select.tsx +574 -0
  44. package/src/components/FormField/SelectContext.tsx +101 -0
  45. package/src/components/FormField/commonElement.tsx +42 -0
  46. package/src/components/GenericMenu.tsx +114 -0
  47. package/src/components/HoverCard/HoverCard.stories.tsx +64 -0
  48. package/src/components/HoverCard/HoverCard.test.tsx +85 -0
  49. package/src/components/HoverCard/HoverCard.tsx +65 -0
  50. package/src/components/Icon/Icon.stories.ts +4 -35
  51. package/src/components/Icon/Icon.tsx +166 -18
  52. package/src/components/Icon/types.ts +78 -1
  53. package/src/components/IconButton/IconButton.stories.ts +25 -7
  54. package/src/components/IconButton/IconButton.test.tsx +32 -0
  55. package/src/components/IconButton/IconButton.tsx +60 -71
  56. package/src/components/Panel/Panel.stories.tsx +25 -0
  57. package/src/components/Panel/Panel.tsx +33 -0
  58. package/src/components/Popover/Popover.stories.tsx +67 -0
  59. package/src/components/Popover/Popover.test.tsx +46 -0
  60. package/src/components/Popover/Popover.tsx +115 -0
  61. package/src/components/RadioGroup/RadioGroup.stories.tsx +43 -0
  62. package/src/components/RadioGroup/RadioGroup.test.tsx +59 -0
  63. package/src/components/RadioGroup/RadioGroup.tsx +149 -0
  64. package/src/components/Separator/Separator.stories.tsx +24 -0
  65. package/src/components/Separator/Separator.tsx +29 -0
  66. package/src/components/SidebarNavigationItem/SidebarNavigationItem.stories.tsx +2 -2
  67. package/src/components/Spacer/Spacer.stories.tsx +20 -0
  68. package/src/components/Spacer/Spacer.tsx +15 -0
  69. package/src/components/Switch/Switch.stories.ts +3 -3
  70. package/src/components/Switch/Switch.tsx +3 -2
  71. package/src/components/Table/Table.stories.tsx +29 -0
  72. package/src/components/Table/Table.tsx +109 -0
  73. package/src/components/Tabs/Tabs.stories.tsx +2 -37
  74. package/src/components/Tooltip/Tooltip.stories.tsx +68 -0
  75. package/src/components/Tooltip/Tooltip.test.tsx +44 -0
  76. package/src/components/Tooltip/Tooltip.tsx +67 -0
  77. package/src/components/Typography/Text/Text.stories.tsx +22 -0
  78. package/src/components/Typography/Text/Text.test.tsx +16 -0
  79. package/src/components/Typography/Text/Text.tsx +30 -0
  80. package/src/components/Typography/Title/Title.stories.tsx +31 -0
  81. package/src/components/Typography/Title/Title.test.tsx +16 -0
  82. package/src/components/Typography/Title/Title.tsx +36 -0
  83. package/src/components/icons/Activity.tsx +30 -0
  84. package/src/components/icons/ArrowDown.tsx +22 -0
  85. package/src/components/icons/ArrowRight.tsx +22 -0
  86. package/src/components/icons/ArrowTriangle.tsx +36 -0
  87. package/src/components/icons/ArrowUp.tsx +22 -0
  88. package/src/components/icons/Backups.tsx +29 -0
  89. package/src/components/icons/Blog.tsx +38 -0
  90. package/src/components/icons/Book.tsx +30 -0
  91. package/src/components/icons/Brackets.tsx +22 -0
  92. package/src/components/icons/Briefcase.tsx +30 -0
  93. package/src/components/icons/Building.tsx +30 -0
  94. package/src/components/icons/BurgerMenu.tsx +22 -0
  95. package/src/components/icons/Cards.tsx +30 -0
  96. package/src/components/icons/CellTower.tsx +21 -0
  97. package/src/components/icons/CheckIcon.tsx +21 -0
  98. package/src/components/icons/CheckInCircle.tsx +39 -0
  99. package/src/components/icons/ChevronDown.tsx +19 -5
  100. package/src/components/icons/ChevronLeft.tsx +22 -0
  101. package/src/components/icons/ChevronRight.tsx +3 -3
  102. package/src/components/icons/ChevronUp.tsx +22 -0
  103. package/src/components/icons/Clock.tsx +37 -0
  104. package/src/components/icons/Cloud.tsx +23 -0
  105. package/src/components/icons/Code.tsx +22 -0
  106. package/src/components/icons/CodeInSquare.tsx +30 -0
  107. package/src/components/icons/Connect.tsx +22 -0
  108. package/src/components/icons/ConnectAlt.tsx +30 -0
  109. package/src/components/icons/Console.tsx +30 -0
  110. package/src/components/icons/Copy.tsx +33 -0
  111. package/src/components/icons/CrossIcon.tsx +29 -0
  112. package/src/components/icons/Data.tsx +36 -0
  113. package/src/components/icons/DatabaseIcon.tsx +27 -29
  114. package/src/components/icons/Disk.tsx +30 -0
  115. package/src/components/icons/Display.tsx +30 -0
  116. package/src/components/icons/Document.tsx +30 -0
  117. package/src/components/icons/DotsHorizontal.tsx +36 -0
  118. package/src/components/icons/DotsVertical.tsx +33 -0
  119. package/src/components/icons/Email.tsx +33 -0
  120. package/src/components/icons/Empty.tsx +14 -0
  121. package/src/components/icons/FilterIcon.tsx +29 -16
  122. package/src/components/icons/Fire.tsx +23 -0
  123. package/src/components/icons/Folder.tsx +20 -0
  124. package/src/components/icons/Gift.tsx +21 -0
  125. package/src/components/icons/HistoryIcon.tsx +13 -13
  126. package/src/components/icons/Home.tsx +29 -0
  127. package/src/components/icons/Http.tsx +22 -0
  128. package/src/components/icons/Icons.mdx +31 -28
  129. package/src/components/icons/InfoInCircleIcon.tsx +37 -0
  130. package/src/components/icons/InformationIcon.tsx +34 -0
  131. package/src/components/icons/InsertRowIcon.tsx +30 -32
  132. package/src/components/icons/Integrations.tsx +29 -0
  133. package/src/components/icons/LightBulb.tsx +40 -0
  134. package/src/components/icons/Lightening.tsx +30 -0
  135. package/src/components/icons/Loading.tsx +57 -0
  136. package/src/components/icons/Metrics.tsx +38 -0
  137. package/src/components/icons/MetricsAlt.tsx +30 -0
  138. package/src/components/icons/Payment.tsx +23 -0
  139. package/src/components/icons/Payments/Amex.tsx +44 -0
  140. package/src/components/icons/Payments/MasterCard.tsx +48 -0
  141. package/src/components/icons/Payments/Paypal.tsx +41 -0
  142. package/src/components/icons/Payments/Visa.tsx +36 -0
  143. package/src/components/icons/Payments/index.tsx +30 -0
  144. package/src/components/icons/Pencil.tsx +30 -0
  145. package/src/components/icons/PieChart.tsx +30 -0
  146. package/src/components/icons/Play.tsx +30 -0
  147. package/src/components/icons/Plus.tsx +22 -0
  148. package/src/components/icons/Popout.tsx +22 -0
  149. package/src/components/icons/PopoverArrow.tsx +22 -0
  150. package/src/components/icons/Question.tsx +30 -0
  151. package/src/components/icons/Refresh.tsx +29 -0
  152. package/src/components/icons/Search.tsx +22 -0
  153. package/src/components/icons/Secure.tsx +30 -0
  154. package/src/components/icons/Services.tsx +23 -0
  155. package/src/components/icons/Settings.tsx +22 -0
  156. package/src/components/icons/Share.tsx +29 -0
  157. package/src/components/icons/SlideIn.tsx +28 -0
  158. package/src/components/icons/SlideOut.tsx +28 -0
  159. package/src/components/icons/SortAltIcon.tsx +18 -20
  160. package/src/components/icons/SortIcon.tsx +24 -0
  161. package/src/components/icons/Sparkle.tsx +23 -0
  162. package/src/components/icons/Speaker.tsx +30 -0
  163. package/src/components/icons/Speed.tsx +29 -0
  164. package/src/components/icons/Star.tsx +23 -0
  165. package/src/components/icons/Support.tsx +37 -0
  166. package/src/components/icons/Table.tsx +30 -0
  167. package/src/components/icons/Taxi.tsx +120 -0
  168. package/src/components/icons/Trash.tsx +22 -0
  169. package/src/components/icons/Upload.tsx +29 -0
  170. package/src/components/icons/Url.tsx +22 -0
  171. package/src/components/icons/UsersIcon.tsx +27 -27
  172. package/src/components/icons/WarningIcon.tsx +30 -0
  173. package/src/components/index.ts +31 -10
  174. package/src/index.ts +2 -2
  175. package/src/styles/types.ts +715 -295
  176. package/src/styles/variables.classic.json +171 -0
  177. package/src/styles/variables.dark.json +447 -129
  178. package/src/styles/variables.json +830 -410
  179. package/src/styles/variables.light.json +339 -179
  180. package/tokens/themes/$themes.json +3657 -1
  181. package/tokens/themes/classic.json +492 -0
  182. package/tokens/themes/component.json +1126 -441
  183. package/tokens/themes/dark.json +1871 -758
  184. package/tokens/themes/light.json +852 -266
  185. package/tokens/themes/primitives.json +294 -210
  186. package/vite.config.ts +6 -4
  187. package/app/.babelrc +0 -27
  188. package/app/.eslintrc.json +0 -6
  189. package/app/.storybook/main.ts +0 -17
  190. package/app/.storybook/preview.tsx +0 -26
  191. package/app/README.md +0 -38
  192. package/app/next.config.js +0 -6
  193. package/app/package-lock.json +0 -28711
  194. package/app/package.json +0 -44
  195. package/app/public/favicon.ico +0 -0
  196. package/app/public/next.svg +0 -1
  197. package/app/public/vercel.svg +0 -1
  198. package/app/src/assets/RightArrow/right-arrow.tsx +0 -17
  199. package/app/src/assets/S3Logo/s3-logo.tsx +0 -31
  200. package/app/src/assets/amazon_s3.svg +0 -9
  201. package/app/src/assets/arrow.svg +0 -3
  202. package/app/src/globals.d.ts +0 -4
  203. package/app/src/pages/_app.tsx +0 -8
  204. package/app/src/pages/_document.tsx +0 -17
  205. package/app/src/pages/api/hello.ts +0 -13
  206. package/app/src/pages/index.tsx +0 -141
  207. package/app/src/pages/label.tsx +0 -27
  208. package/app/src/stories/assets/code-brackets.svg +0 -1
  209. package/app/src/stories/assets/colors.svg +0 -1
  210. package/app/src/stories/assets/comments.svg +0 -1
  211. package/app/src/stories/assets/direction.svg +0 -1
  212. package/app/src/stories/assets/flow.svg +0 -1
  213. package/app/src/stories/assets/plugin.svg +0 -1
  214. package/app/src/stories/assets/repo.svg +0 -1
  215. package/app/src/stories/assets/stackalt.svg +0 -1
  216. package/app/src/styles/Home.module.css +0 -235
  217. package/app/src/styles/globals.css +0 -111
  218. package/app/src/styles/types.ts +0 -1031
  219. package/app/src/styles/variables.classic.css +0 -16
  220. package/app/src/styles/variables.classic.json +0 -31
  221. package/app/src/styles/variables.css +0 -763
  222. package/app/src/styles/variables.dark.css +0 -135
  223. package/app/src/styles/variables.dark.json +0 -339
  224. package/app/src/styles/variables.json +0 -1029
  225. package/app/src/styles/variables.light.css +0 -203
  226. package/app/src/styles/variables.light.json +0 -478
  227. package/app/tokens/themes/$metadata.json +0 -9
  228. package/app/tokens/themes/$themes.json +0 -1
  229. package/app/tokens/themes/classic.json +0 -58
  230. package/app/tokens/themes/component.json +0 -868
  231. package/app/tokens/themes/dark.json +0 -937
  232. package/app/tokens/themes/light.json +0 -1380
  233. package/app/tokens/themes/primitives.json +0 -859
  234. package/app/tsconfig.json +0 -23
  235. package/src/components/FormField/FormField.stories.ts +0 -14
  236. package/src/components/FormField/FormField.tsx +0 -22
package/app/tokens/themes/primitives.json DELETED
@@ -1,859 +0,0 @@
1
- {
2
- "palette": {
3
- "brand": {
4
- "50": {
5
- "value": "#ffffe8",
6
- "type": "color"
7
- },
8
- "100": {
9
- "value": "#feffba",
10
- "type": "color"
11
- },
12
- "200": {
13
- "value": "#fdffa3",
14
- "type": "color"
15
- },
16
- "300": {
17
- "value": "#fcff74",
18
- "type": "color"
19
- },
20
- "400": {
21
- "value": "#eef400",
22
- "type": "color"
23
- },
24
- "500": {
25
- "value": "#9fa300",
26
- "type": "color"
27
- },
28
- "600": {
29
- "value": "#4f5100",
30
- "type": "color"
31
- },
32
- "700": {
33
- "value": "#27291B",
34
- "type": "color"
35
- },
36
- "800": {
37
- "value": "#161600",
38
- "type": "color"
39
- },
40
- "base": {
41
- "value": "#fbff46",
42
- "type": "color"
43
- }
44
- },
45
- "neutral": {
46
- "0": {
47
- "value": "#ffffff",
48
- "type": "color"
49
- },
50
- "100": {
51
- "value": "#f9f9f9",
52
- "type": "color"
53
- },
54
- "200": {
55
- "value": "#dfdfdf",
56
- "type": "color"
57
- },
58
- "300": {
59
- "value": "#c0c0c0",
60
- "type": "color"
61
- },
62
- "400": {
63
- "value": "#a0a0a0",
64
- "type": "color"
65
- },
66
- "500": {
67
- "value": "#808080",
68
- "type": "color"
69
- },
70
- "600": {
71
- "value": "#606060",
72
- "type": "color"
73
- },
74
- "700": {
75
- "value": "#414141",
76
- "type": "color"
77
- },
78
- "725": {
79
- "value": "#282828",
80
- "type": "color"
81
- },
82
- "750": {
83
- "value": "#1F1F1C",
84
- "type": "color"
85
- },
86
- "800": {
87
- "value": "#1d1d1d",
88
- "type": "color"
89
- },
90
- "900": {
91
- "value": "#151515",
92
- "type": "color"
93
- },
94
- "base": {
95
- "value": "#212121",
96
- "type": "color"
97
- }
98
- },
99
- "slate": {
100
- "50": {
101
- "value": "#f6f7fa",
102
- "type": "color"
103
- },
104
- "100": {
105
- "value": "#e6e7e9",
106
- "type": "color"
107
- },
108
- "200": {
109
- "value": "#cccfd3",
110
- "type": "color"
111
- },
112
- "300": {
113
- "value": "#b3b6bd",
114
- "type": "color"
115
- },
116
- "400": {
117
- "value": "#9a9ea7",
118
- "type": "color"
119
- },
120
- "500": {
121
- "value": "#808691",
122
- "type": "color"
123
- },
124
- "600": {
125
- "value": "#696e79",
126
- "type": "color"
127
- },
128
- "700": {
129
- "value": "#53575f",
130
- "type": "color"
131
- },
132
- "800": {
133
- "value": "#302e32",
134
- "type": "color"
135
- },
136
- "900": {
137
- "value": "#161517",
138
- "type": "color"
139
- },
140
- "base": {
141
- "value": "#373439",
142
- "type": "color"
143
- }
144
- },
145
- "indigo": {
146
- "50": {
147
- "value": "#f4f1fc",
148
- "type": "color"
149
- },
150
- "100": {
151
- "value": "#e4e2e9",
152
- "type": "color"
153
- },
154
- "200": {
155
- "value": "#c8c5d3",
156
- "type": "color"
157
- },
158
- "300": {
159
- "value": "#ada8bd",
160
- "type": "color"
161
- },
162
- "400": {
163
- "value": "#918ba7",
164
- "type": "color"
165
- },
166
- "500": {
167
- "value": "#766e91",
168
- "type": "color"
169
- },
170
- "600": {
171
- "value": "#5e5874",
172
- "type": "color"
173
- },
174
- "700": {
175
- "value": "#474257",
176
- "type": "color"
177
- },
178
- "800": {
179
- "value": "#23212c",
180
- "type": "color"
181
- },
182
- "900": {
183
- "value": "#18161d",
184
- "type": "color"
185
- },
186
- "base": {
187
- "value": "#2f2c3a",
188
- "type": "color"
189
- }
190
- },
191
- "info": {
192
- "50": {
193
- "value": "#dae6fc",
194
- "type": "color"
195
- },
196
- "100": {
197
- "value": "#b5cdf9",
198
- "type": "color"
199
- },
200
- "200": {
201
- "value": "#91b3f6",
202
- "type": "color"
203
- },
204
- "300": {
205
- "value": "#6c9af3",
206
- "type": "color"
207
- },
208
- "400": {
209
- "value": "#135be6",
210
- "type": "color"
211
- },
212
- "500": {
213
- "value": "#0e44ad",
214
- "type": "color"
215
- },
216
- "600": {
217
- "value": "#092e73",
218
- "type": "color"
219
- },
220
- "700": {
221
- "value": "#061d48",
222
- "type": "color"
223
- },
224
- "800": {
225
- "value": "#05173a",
226
- "type": "color"
227
- },
228
- "900": {
229
- "value": "#041330",
230
- "type": "color"
231
- },
232
- "base": {
233
- "value": "#4781f0",
234
- "type": "color"
235
- }
236
- },
237
- "success": {
238
- "50": {
239
- "value": "#e0f8e7",
240
- "type": "color"
241
- },
242
- "100": {
243
- "value": "#c0f2ce",
244
- "type": "color"
245
- },
246
- "200": {
247
- "value": "#a1ebb6",
248
- "type": "color"
249
- },
250
- "300": {
251
- "value": "#81e59d",
252
- "type": "color"
253
- },
254
- "400": {
255
- "value": "#41d76b",
256
- "type": "color"
257
- },
258
- "500": {
259
- "value": "#2ac656",
260
- "type": "color"
261
- },
262
- "600": {
263
- "value": "#1c8439",
264
- "type": "color"
265
- },
266
- "700": {
267
- "value": "#15632b",
268
- "type": "color"
269
- },
270
- "800": {
271
- "value": "#0e421d",
272
- "type": "color"
273
- },
274
- "900": {
275
- "value": "#07210e",
276
- "type": "color"
277
- },
278
- "base": {
279
- "value": "#62de85",
280
- "type": "color"
281
- }
282
- },
283
- "warning": {
284
- "50": {
285
- "value": "#ffedd8",
286
- "type": "color"
287
- },
288
- "100": {
289
- "value": "#ffdbb1",
290
- "type": "color"
291
- },
292
- "200": {
293
- "value": "#ffca8b",
294
- "type": "color"
295
- },
296
- "300": {
297
- "value": "#ffb864",
298
- "type": "color"
299
- },
300
- "400": {
301
- "value": "#ff9416",
302
- "type": "color"
303
- },
304
- "500": {
305
- "value": "#ed8000",
306
- "type": "color"
307
- },
308
- "600": {
309
- "value": "#c66b00",
310
- "type": "color"
311
- },
312
- "700": {
313
- "value": "#9e5600",
314
- "type": "color"
315
- },
316
- "800": {
317
- "value": "#4f2b00",
318
- "type": "color"
319
- },
320
- "900": {
321
- "value": "#271500",
322
- "type": "color"
323
- },
324
- "base": {
325
- "value": "#ffa63d",
326
- "type": "color"
327
- }
328
- },
329
- "danger": {
330
- "50": {
331
- "value": "#ffdddd",
332
- "type": "color"
333
- },
334
- "100": {
335
- "value": "#ffbaba",
336
- "type": "color"
337
- },
338
- "200": {
339
- "value": "#ff9898",
340
- "type": "color"
341
- },
342
- "300": {
343
- "value": "#ff7575",
344
- "type": "color"
345
- },
346
- "400": {
347
- "value": "#ff2323",
348
- "type": "color"
349
- },
350
- "500": {
351
- "value": "#f10000",
352
- "type": "color"
353
- },
354
- "600": {
355
- "value": "#c10000",
356
- "type": "color"
357
- },
358
- "700": {
359
- "value": "#910000",
360
- "type": "color"
361
- },
362
- "800": {
363
- "value": "#610000",
364
- "type": "color"
365
- },
366
- "900": {
367
- "value": "#300000",
368
- "type": "color"
369
- },
370
- "base": {
371
- "value": "#FF5353",
372
- "type": "color"
373
- }
374
- },
375
- "gradients": {
376
- "base": {
377
- "value": "linear-gradient(229.65deg, #292924 15.78%, #0F0F0F 88.39%)",
378
- "type": "color"
379
- },
380
- "transparent": {
381
- "value": "rgba(0,0,0,0)",
382
- "type": "color",
383
- "description": "Transparent background"
384
- }
385
- },
386
- "utility": {
387
- "transparent": {
388
- "value": "rgba(0,0,0,0)",
389
- "type": "color"
390
- }
391
- }
392
- },
393
- "sizes": {
394
- "0": {
395
- "value": "0",
396
- "type": "sizing"
397
- },
398
- "1": {
399
- "value": "1px",
400
- "type": "sizing"
401
- },
402
- "2": {
403
- "value": "0.25rem",
404
- "type": "sizing"
405
- },
406
- "3": {
407
- "value": "0.5rem",
408
- "type": "sizing"
409
- },
410
- "4": {
411
- "value": "0.75rem",
412
- "type": "sizing"
413
- },
414
- "5": {
415
- "value": "1rem",
416
- "type": "sizing"
417
- },
418
- "6": {
419
- "value": "1.25rem",
420
- "type": "sizing"
421
- },
422
- "7": {
423
- "value": "1.5rem",
424
- "type": "sizing"
425
- },
426
- "8": {
427
- "value": "1.75rem",
428
- "type": "sizing"
429
- },
430
- "9": {
431
- "value": "2rem",
432
- "type": "sizing"
433
- },
434
- "10": {
435
- "value": "2.5rem",
436
- "type": "sizing"
437
- },
438
- "11": {
439
- "value": "4rem",
440
- "type": "sizing"
441
- }
442
- },
443
- "typography": {
444
- "font": {
445
- "families": {
446
- "regular": {
447
- "value": "\"Inter\",\"SF Pro Display\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen,Ubuntu, Cantarell,\"Open Sans\",\"Helvetica Neue\",sans-serif;",
448
- "type": "fontFamilies"
449
- },
450
- "mono": {
451
- "value": "\"Inconsolata\", \"SFMono Regular\", monospace",
452
- "type": "fontFamilies"
453
- },
454
- "display": {
455
- "value": "'Basier Square', \"Inter\",\"SF Pro Display\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen,Ubuntu, Cantarell,\"Open Sans\",\"Helvetica Neue\",sans-serif;",
456
- "type": "fontFamilies"
457
- }
458
- },
459
- "weights": {
460
- "1": {
461
- "value": "400",
462
- "type": "fontWeights"
463
- },
464
- "2": {
465
- "value": "500",
466
- "type": "fontWeights"
467
- },
468
- "3": {
469
- "value": "600",
470
- "type": "fontWeights"
471
- },
472
- "4": {
473
- "value": "700",
474
- "type": "fontWeights"
475
- }
476
- },
477
- "sizes": {
478
- "1": {
479
- "value": "{sizes.4}",
480
- "type": "fontSizes"
481
- },
482
- "2": {
483
- "value": "0.875rem",
484
- "type": "fontSizes"
485
- },
486
- "3": {
487
- "value": "{sizes.5}",
488
- "type": "fontSizes"
489
- },
490
- "4": {
491
- "value": "{sizes.6}",
492
- "type": "fontSizes"
493
- },
494
- "6": {
495
- "value": "{sizes.9}",
496
- "type": "fontSizes"
497
- }
498
- },
499
- "line-height": {
500
- "1": {
501
- "value": "150%",
502
- "type": "lineHeights"
503
- },
504
- "2": {
505
- "value": "160%",
506
- "type": "lineHeights"
507
- },
508
- "3": {
509
- "value": "170%",
510
- "type": "lineHeights"
511
- },
512
- "4": {
513
- "value": "130%",
514
- "type": "lineHeights"
515
- }
516
- }
517
- },
518
- "styles": {
519
- "titles": {
520
- "xs": {
521
- "value": {
522
- "fontFamily": "{typography.font.families.regular}",
523
- "fontWeight": "{typography.font.weights.4}",
524
- "fontSize": "{typography.font.sizes.1}",
525
- "lineHeight": "{typography.font.line-height.1}"
526
- },
527
- "type": "typography"
528
- },
529
- "sm": {
530
- "value": {
531
- "fontFamily": "{typography.font.families.regular}",
532
- "fontWeight": "{typography.font.weights.4}",
533
- "lineHeight": "{typography.font.line-height.1}",
534
- "fontSize": "{typography.font.sizes.2}"
535
- },
536
- "type": "typography"
537
- },
538
- "md": {
539
- "value": {
540
- "fontFamily": "{typography.font.families.regular}",
541
- "fontWeight": "{typography.font.weights.3}",
542
- "lineHeight": "{typography.font.line-height.1}",
543
- "fontSize": "{typography.font.sizes.3}"
544
- },
545
- "type": "typography"
546
- },
547
- "lg": {
548
- "value": {
549
- "fontFamily": "{typography.font.families.regular}",
550
- "fontWeight": "{typography.font.weights.4}",
551
- "lineHeight": "{typography.font.line-height.1}",
552
- "fontSize": "{typography.font.sizes.3}"
553
- },
554
- "type": "typography"
555
- },
556
- "xl": {
557
- "value": {
558
- "fontFamily": "{typography.font.families.regular}",
559
- "fontWeight": "{typography.font.weights.4}",
560
- "lineHeight": "{typography.font.line-height.1}",
561
- "fontSize": "{typography.font.sizes.4}"
562
- },
563
- "type": "typography"
564
- },
565
- "2xl": {
566
- "value": {
567
- "fontFamily": "{typography.font.families.regular}",
568
- "fontWeight": "{typography.font.weights.3}",
569
- "lineHeight": "{typography.font.line-height.1}",
570
- "fontSize": "{typography.font.sizes.6}"
571
- },
572
- "type": "typography"
573
- }
574
- },
575
- "text": {
576
- "sm": {
577
- "value": {
578
- "fontFamily": "{typography.font.families.regular}",
579
- "fontWeight": "{typography.font.weights.1}",
580
- "lineHeight": "{typography.font.line-height.1}",
581
- "fontSize": "{typography.font.sizes.1}"
582
- },
583
- "type": "typography"
584
- },
585
- "md": {
586
- "value": {
587
- "fontFamily": "{typography.font.families.regular}",
588
- "fontWeight": "{typography.font.weights.1}",
589
- "lineHeight": "{typography.font.line-height.1}",
590
- "fontSize": "{typography.font.sizes.2}"
591
- },
592
- "type": "typography"
593
- },
594
- "lg": {
595
- "value": {
596
- "fontFamily": "{typography.font.families.regular}",
597
- "fontWeight": "{typography.font.weights.1}",
598
- "lineHeight": "{typography.font.line-height.1}",
599
- "fontSize": "{typography.font.sizes.3}"
600
- },
601
- "type": "typography"
602
- }
603
- },
604
- "text-sbold": {
605
- "sm": {
606
- "value": {
607
- "fontFamily": "{typography.font.families.regular}",
608
- "fontWeight": "{typography.font.weights.2}",
609
- "lineHeight": "{typography.font.line-height.1}",
610
- "fontSize": "{typography.font.sizes.1}"
611
- },
612
- "type": "typography"
613
- },
614
- "md": {
615
- "value": {
616
- "fontFamily": "{typography.font.families.regular}",
617
- "fontWeight": "{typography.font.weights.2}",
618
- "lineHeight": "{typography.font.line-height.1}",
619
- "fontSize": "{typography.font.sizes.2}"
620
- },
621
- "type": "typography"
622
- },
623
- "lg": {
624
- "value": {
625
- "fontFamily": "{typography.font.families.regular}",
626
- "fontWeight": "{typography.font.weights.2}",
627
- "lineHeight": "{typography.font.line-height.1}",
628
- "fontSize": "{typography.font.sizes.3}"
629
- },
630
- "type": "typography"
631
- }
632
- },
633
- "text-bold": {
634
- "sm": {
635
- "value": {
636
- "fontFamily": "{typography.font.families.regular}",
637
- "fontWeight": "{typography.font.weights.3}",
638
- "lineHeight": "{typography.font.line-height.1}",
639
- "fontSize": "{typography.font.sizes.1}"
640
- },
641
- "type": "typography"
642
- },
643
- "md": {
644
- "value": {
645
- "fontFamily": "{typography.font.families.regular}",
646
- "fontWeight": "{typography.font.weights.3}",
647
- "lineHeight": "{typography.font.line-height.1}",
648
- "fontSize": "{typography.font.sizes.2}"
649
- },
650
- "type": "typography"
651
- },
652
- "lg": {
653
- "value": {
654
- "fontFamily": "{typography.font.families.regular}",
655
- "fontWeight": "{typography.font.weights.3}",
656
- "lineHeight": "{typography.font.line-height.1}",
657
- "fontSize": "{typography.font.sizes.3}"
658
- },
659
- "type": "typography"
660
- }
661
- },
662
- "text-mono": {
663
- "sm": {
664
- "value": {
665
- "fontFamily": "{typography.font.families.mono}",
666
- "fontWeight": "{typography.font.weights.2}",
667
- "lineHeight": "{typography.font.line-height.2}",
668
- "fontSize": "{typography.font.sizes.1}"
669
- },
670
- "type": "typography"
671
- },
672
- "md": {
673
- "value": {
674
- "fontFamily": "{typography.font.families.mono}",
675
- "fontWeight": "{typography.font.weights.2}",
676
- "lineHeight": "{typography.font.line-height.3}",
677
- "fontSize": "{typography.font.sizes.2}"
678
- },
679
- "type": "typography"
680
- },
681
- "lg": {
682
- "value": {
683
- "fontFamily": "{typography.font.families.mono}",
684
- "fontWeight": "{typography.font.weights.2}",
685
- "lineHeight": "{typography.font.line-height.2}",
686
- "fontSize": "{typography.font.sizes.3}"
687
- },
688
- "type": "typography"
689
- }
690
- },
691
- "titles-brand": {
692
- "xs": {
693
- "value": {
694
- "fontFamily": "{typography.font.families.display}",
695
- "fontWeight": "{typography.font.weights.3}",
696
- "lineHeight": "{typography.font.line-height.1}",
697
- "fontSize": "20px"
698
- },
699
- "type": "typography"
700
- },
701
- "sm": {
702
- "value": {
703
- "fontFamily": "{typography.font.families.display}",
704
- "fontWeight": "{typography.font.weights.3}",
705
- "lineHeight": "{typography.font.line-height.1}",
706
- "fontSize": "24px"
707
- },
708
- "type": "typography"
709
- },
710
- "md": {
711
- "value": {
712
- "fontFamily": "{typography.font.families.display}",
713
- "fontWeight": "{typography.font.weights.3}",
714
- "lineHeight": "{typography.font.line-height.4}",
715
- "fontSize": "36px"
716
- },
717
- "type": "typography"
718
- },
719
- "lg": {
720
- "value": {
721
- "fontFamily": "{typography.font.families.display}",
722
- "fontWeight": "{typography.font.weights.3}",
723
- "lineHeight": "{typography.font.line-height.4}",
724
- "fontSize": "56px"
725
- },
726
- "type": "typography"
727
- },
728
- "xl": {
729
- "value": {
730
- "fontFamily": "{typography.font.families.display}",
731
- "fontWeight": "{typography.font.weights.4}",
732
- "lineHeight": "{typography.font.line-height.4}",
733
- "fontSize": "64px"
734
- },
735
- "type": "typography"
736
- }
737
- },
738
- "field": {
739
- "md": {
740
- "value": {
741
- "fontFamily": "{typography.font.families.regular}",
742
- "fontWeight": "{typography.font.weights.1}",
743
- "lineHeight": "{typography.font.line-height.2}",
744
- "fontSize": "{typography.font.sizes.2}"
745
- },
746
- "type": "typography"
747
- }
748
- }
749
- }
750
- },
751
- "border": {
752
- "radii": {
753
- "0": {
754
- "value": "{sizes.0}",
755
- "type": "borderRadius"
756
- },
757
- "1": {
758
- "value": "{sizes.2}",
759
- "type": "borderRadius"
760
- },
761
- "2": {
762
- "value": "{sizes.3}",
763
- "type": "borderRadius"
764
- },
765
- "full": {
766
- "value": "9999px",
767
- "type": "borderRadius"
768
- }
769
- },
770
- "width": {
771
- "1": {
772
- "value": "{sizes.1}",
773
- "type": "borderWidth"
774
- },
775
- "2": {
776
- "value": "{sizes.1} + {sizes.1}",
777
- "type": "borderWidth"
778
- }
779
- }
780
- },
781
- "spaces": {
782
- "0": {
783
- "value": "{sizes.0}",
784
- "type": "spacing"
785
- },
786
- "1": {
787
- "value": "{sizes.2}",
788
- "type": "spacing"
789
- },
790
- "2": {
791
- "value": "{sizes.3}",
792
- "type": "spacing"
793
- },
794
- "3": {
795
- "value": "{sizes.4}",
796
- "type": "spacing"
797
- },
798
- "4": {
799
- "value": "{sizes.5}",
800
- "type": "spacing"
801
- },
802
- "5": {
803
- "value": "{sizes.7}",
804
- "type": "spacing"
805
- },
806
- "6": {
807
- "value": "{sizes.9}",
808
- "type": "spacing"
809
- },
810
- "7": {
811
- "value": "{sizes.10}",
812
- "type": "spacing"
813
- }
814
- },
815
- "shadow": {
816
- "1": {
817
- "value": [
818
- {
819
- "x": "0",
820
- "y": "1",
821
- "blur": "2",
822
- "spread": "0",
823
- "color": "rgba(16, 24, 40, 0.06)",
824
- "type": "dropShadow"
825
- },
826
- {
827
- "x": "0",
828
- "y": "1",
829
- "blur": "3",
830
- "spread": "0",
831
- "color": "rgba(16, 24, 40, 0.1)",
832
- "type": "dropShadow"
833
- }
834
- ],
835
- "type": "boxShadow"
836
- },
837
- "2": {
838
- "value": [
839
- {
840
- "x": "0",
841
- "y": "4",
842
- "blur": "4",
843
- "spread": "0",
844
- "color": "rgba(88, 92, 98, 0.06)",
845
- "type": "dropShadow"
846
- },
847
- {
848
- "x": "5",
849
- "y": "0",
850
- "blur": "10",
851
- "spread": "0",
852
- "color": "rgba(104, 105, 111, 0.1)",
853
- "type": "innerShadow"
854
- }
855
- ],
856
- "type": "boxShadow"
857
- }
858
- }
859
- }