@medway-ui/core 0.4.10 → 1.0.0

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 (9) hide show
  1. package/dist/assets/css/tokens.css +607 -120
  2. package/dist/assets/js/tokens.ts +393 -60
  3. package/dist/index.d.mts +30 -20
  4. package/dist/index.d.ts +30 -20
  5. package/dist/index.js +2 -2
  6. package/dist/index.js.map +1 -1
  7. package/dist/index.mjs +2 -2
  8. package/dist/index.mjs.map +1 -1
  9. package/package.json +1 -1
package/dist/assets/js/tokens.ts CHANGED
@@ -1,8 +1,5 @@
1
1
  export const content = [
2
- "./pages/**/*.{ts,tsx,md,mdx}",
3
- "./components/**/*.{ts,tsx,md,mdx}",
4
- "./app/**/*.{ts,tsx,md,mdx}",
5
- "./src/**/*.{ts,tsx,md,mdx}",
2
+ "./src/**/*.{js,ts,jsx,tsx,md,mdx}",
6
3
  "./node_modules/@medway-ui/core/**/*.{js,ts,jsx,tsx}",
7
4
  ];
8
5
 
@@ -12,6 +9,41 @@ export const colors = {
12
9
  ring: "var(--color-ring)",
13
10
  input: "var(--color-input)",
14
11
  border: "var(--color-border)",
12
+ surface: {
13
+ elevated: "var(--color-surface-elevated)",
14
+ card: "var(--color-surface-card)",
15
+ navigation: "var(--color-surface-navigation)",
16
+ section: "var(--color-surface-section)",
17
+ page: "var(--color-surface-page)",
18
+ },
19
+ dropShadow: {
20
+ layerA: "var(--color-drop-shadow-layer-a)",
21
+ layerB: "var(--color-drop-shadow-layer-b)",
22
+ },
23
+ white: {
24
+ DEFAULT: "var(--color-white)",
25
+ "80": "var(--color-white-80)",
26
+ "48": "var(--color-white-48)",
27
+ "24": "var(--color-white-24)",
28
+ "16": "var(--color-white-16)",
29
+ "12": "var(--color-white-12)",
30
+ "8": "var(--color-white-8)",
31
+ "6": "var(--color-white-6)",
32
+ "4": "var(--color-white-4)",
33
+ "0": "var(--color-white-0)",
34
+ },
35
+ black: {
36
+ DEFAULT: "var(--color-black)",
37
+ "80": "var(--color-black-80)",
38
+ "48": "var(--color-black-48)",
39
+ "24": "var(--color-black-24)",
40
+ "16": "var(--color-black-16)",
41
+ "12": "var(--color-black-12)",
42
+ "8": "var(--color-black-8)",
43
+ "6": "var(--color-black-6)",
44
+ "4": "var(--color-black-4)",
45
+ "0": "var(--color-black-0)",
46
+ },
15
47
  gray: {
16
48
  950: "var(--color-gray-950)",
17
49
  900: "var(--color-gray-900)",
@@ -20,57 +52,329 @@ export const colors = {
20
52
  700: "var(--color-gray-700)",
21
53
  600: "var(--color-gray-600)",
22
54
  500: "var(--color-gray-500)",
55
+ 450: "var(--color-gray-450)",
23
56
  400: "var(--color-gray-400)",
24
57
  300: "var(--color-gray-300)",
25
58
  200: "var(--color-gray-200)",
26
59
  150: "var(--color-gray-150)",
27
60
  100: "var(--color-gray-100)",
61
+ 70: "var(--color-gray-70)",
28
62
  50: "var(--color-gray-50)",
63
+ 30: "var(--color-gray-30)",
64
+ 10: "var(--color-gray-10)",
65
+ "0": "var(--color-gray-0)",
66
+ foreground: "var(--color-gray-foreground)",
67
+ "foreground-emphasis": "var(--color-gray-foreground-emphasis)",
68
+ "foreground-muted": "var(--color-gray-foreground-muted)",
69
+ "foreground-onfill": "var(--color-gray-foreground-onfill)",
70
+ stroke: "var(--color-gray-stroke)",
71
+ "stroke-emphasis": "var(--color-gray-stroke-emphasis)",
72
+ "stroke-muted": "var(--color-gray-stroke-muted)",
73
+ "background-fill": "var(--color-gray-background-fill)",
74
+ "background-fill-emphasis": "var(--color-gray-background-fill-emphasis)",
75
+ "background-fill-muted": "var(--color-gray-background-fill-muted)",
76
+ "background-soft": "var(--color-gray-background-soft)",
77
+ "background-soft-emphasis": "var(--color-gray-background-soft-emphasis)",
78
+ "background-soft-muted": "var(--color-gray-background-soft-muted)",
29
79
  },
30
80
  green: {
31
81
  DEFAULT: "var(--color-green)",
32
82
  "darken-1": "var(--color-green-darken-1)",
33
83
  "darken-2": "var(--color-green-darken-2)",
84
+ "darken-3": "var(--color-green-darken-3)",
85
+ "darken-4": "var(--color-green-darken-4)",
86
+ "darken-5": "var(--color-green-darken-5)",
87
+ "darken-6": "var(--color-green-darken-6)",
88
+ "lighten-1": "var(--color-green-lighten-1)",
89
+ "lighten-2": "var(--color-green-lighten-2)",
90
+ "lighten-3": "var(--color-green-lighten-3)",
91
+ "lighten-4": "var(--color-green-lighten-4)",
92
+ "lighten-5": "var(--color-green-lighten-5)",
93
+ "lighten-6": "var(--color-green-lighten-6)",
34
94
  "80": "var(--color-green-80)",
95
+ "64": "var(--color-green-64)",
35
96
  "48": "var(--color-green-48)",
36
97
  "24": "var(--color-green-24)",
37
98
  "16": "var(--color-green-16)",
99
+ "12": "var(--color-green-12)",
38
100
  "8": "var(--color-green-8)",
101
+ "6": "var(--color-green-6)",
39
102
  "4": "var(--color-green-4)",
103
+ "0": "var(--color-green-0)",
104
+ foreground: "var(--color-green-foreground)",
105
+ "foreground-emphasis": "var(--color-green-foreground-emphasis)",
106
+ "foreground-onfill": "var(--color-green-foreground-onfill)",
107
+ stroke: "var(--color-green-stroke)",
108
+ "stroke-emphasis": "var(--color-green-stroke-emphasis)",
109
+ "background-fill": "var(--color-green-background-fill)",
110
+ "background-fill-emphasis": "var(--color-green-background-fill-emphasis)",
111
+ "background-soft": "var(--color-green-background-soft)",
112
+ "background-soft-emphasis": "var(--color-green-background-soft-emphasis)",
113
+ "background-soft-muted": "var(--color-green-background-soft-muted)",
40
114
  },
41
115
  red: {
42
116
  DEFAULT: "var(--color-red)",
43
117
  "darken-1": "var(--color-red-darken-1)",
44
118
  "darken-2": "var(--color-red-darken-2)",
45
119
  "darken-3": "var(--color-red-darken-3)",
120
+ "darken-4": "var(--color-red-darken-4)",
121
+ "darken-5": "var(--color-red-darken-5)",
122
+ "darken-6": "var(--color-red-darken-6)",
123
+ "darken-7": "var(--color-red-darken-7)",
124
+ "lighten-1": "var(--color-red-lighten-1)",
125
+ "lighten-2": "var(--color-red-lighten-2)",
126
+ "lighten-3": "var(--color-red-lighten-3)",
127
+ "lighten-4": "var(--color-red-lighten-4)",
128
+ "lighten-5": "var(--color-red-lighten-5)",
129
+ "lighten-6": "var(--color-red-lighten-6)",
46
130
  "80": "var(--color-red-80)",
131
+ "64": "var(--color-red-64)",
47
132
  "48": "var(--color-red-48)",
48
133
  "24": "var(--color-red-24)",
49
134
  "16": "var(--color-red-16)",
135
+ "12": "var(--color-red-12)",
50
136
  "8": "var(--color-red-8)",
137
+ "6": "var(--color-red-6)",
51
138
  "4": "var(--color-red-4)",
139
+ "0": "var(--color-red-0)",
140
+ foreground: "var(--color-red-foreground)",
141
+ "foreground-emphasis": "var(--color-red-foreground-emphasis)",
142
+ "foreground-onfill": "var(--color-red-foreground-onfill)",
143
+ stroke: "var(--color-red-stroke)",
144
+ "stroke-emphasis": "var(--color-red-stroke-emphasis)",
145
+ "background-fill": "var(--color-red-background-fill)",
146
+ "background-fill-emphasis": "var(--color-red-background-fill-emphasis)",
147
+ "background-soft": "var(--color-red-background-soft)",
148
+ "background-soft-emphasis": "var(--color-red-background-soft-emphasis)",
149
+ "background-soft-muted": "var(--color-red-background-soft-muted)",
52
150
  },
53
151
  yellow: {
54
152
  DEFAULT: "var(--color-yellow)",
55
153
  "darken-1": "var(--color-yellow-darken-1)",
56
154
  "darken-2": "var(--color-yellow-darken-2)",
155
+ "darken-3": "var(--color-yellow-darken-3)",
156
+ "darken-4": "var(--color-yellow-darken-4)",
157
+ "darken-5": "var(--color-yellow-darken-5)",
158
+ "darken-6": "var(--color-yellow-darken-6)",
159
+ "lighten-1": "var(--color-yellow-lighten-1)",
160
+ "lighten-2": "var(--color-yellow-lighten-2)",
161
+ "lighten-3": "var(--color-yellow-lighten-3)",
162
+ "lighten-4": "var(--color-yellow-lighten-4)",
163
+ "lighten-5": "var(--color-yellow-lighten-5)",
164
+ "lighten-6": "var(--color-yellow-lighten-6)",
57
165
  "80": "var(--color-yellow-80)",
166
+ "64": "var(--color-yellow-64)",
58
167
  "48": "var(--color-yellow-48)",
59
168
  "24": "var(--color-yellow-24)",
169
+ "12": "var(--color-yellow-12)",
60
170
  "16": "var(--color-yellow-16)",
61
171
  "8": "var(--color-yellow-8)",
172
+ "6": "var(--color-yellow-6)",
62
173
  "4": "var(--color-yellow-4)",
174
+ "0": "var(--color-yellow-0)",
175
+ foreground: "var(--color-yellow-foreground)",
176
+ "foreground-emphasis": "var(--color-yellow-foreground-emphasis)",
177
+ "foreground-onfill": "var(--color-yellow-foreground-onfill)",
178
+ stroke: "var(--color-yellow-stroke)",
179
+ "stroke-emphasis": "var(--color-yellow-stroke-emphasis)",
180
+ "background-fill": "var(--color-yellow-background-fill)",
181
+ "background-fill-emphasis": "var(--color-yellow-background-fill-emphasis)",
182
+ "background-soft": "var(--color-yellow-background-soft)",
183
+ "background-soft-emphasis": "var(--color-yellow-background-soft-emphasis)",
184
+ "background-soft-muted": "var(--color-yellow-background-soft-muted)",
185
+ },
186
+ cm: {
187
+ DEFAULT: "var(--color-cm)",
188
+ "darken-1": "var(--color-cm-darken-1)",
189
+ "darken-2": "var(--color-cm-darken-2)",
190
+ "darken-3": "var(--color-cm-darken-3)",
191
+ "darken-4": "var(--color-cm-darken-4)",
192
+ "darken-5": "var(--color-cm-darken-5)",
193
+ "darken-6": "var(--color-cm-darken-6)",
194
+ "lighten-1": "var(--color-cm-lighten-1)",
195
+ "lighten-2": "var(--color-cm-lighten-2)",
196
+ "lighten-3": "var(--color-cm-lighten-3)",
197
+ "lighten-4": "var(--color-cm-lighten-4)",
198
+ "lighten-5": "var(--color-cm-lighten-5)",
199
+ "lighten-6": "var(--color-cm-lighten-6)",
200
+ "80": "var(--color-cm-80)",
201
+ "64": "var(--color-cm-64)",
202
+ "48": "var(--color-cm-48)",
203
+ "24": "var(--color-cm-24)",
204
+ "16": "var(--color-cm-16)",
205
+ "12": "var(--color-cm-12)",
206
+ "8": "var(--color-cm-8)",
207
+ "6": "var(--color-cm-6)",
208
+ "4": "var(--color-cm-4)",
209
+ "0": "var(--color-cm-0)",
210
+ foreground: "var(--color-cm-foreground)",
211
+ "foreground-emphasis": "var(--color-cm-foreground-emphasis)",
212
+ "foreground-onfill": "var(--color-cm-foreground-onfill)",
213
+ "background-fill": "var(--color-cm-background-fill)",
214
+ "background-fill-emphasis": "var(--color-cm-background-fill-emphasis)",
215
+ "background-soft": "var(--color-cm-background-soft)",
216
+ "background-soft-emphasis": "var(--color-cm-background-soft-emphasis)",
217
+ },
218
+ go: {
219
+ DEFAULT: "var(--color-go)",
220
+ "darken-1": "var(--color-go-darken-1)",
221
+ "darken-2": "var(--color-go-darken-2)",
222
+ "darken-3": "var(--color-go-darken-3)",
223
+ "darken-4": "var(--color-go-darken-4)",
224
+ "darken-5": "var(--color-go-darken-5)",
225
+ "darken-6": "var(--color-go-darken-6)",
226
+ "lighten-1": "var(--color-go-lighten-1)",
227
+ "lighten-2": "var(--color-go-lighten-2)",
228
+ "lighten-3": "var(--color-go-lighten-3)",
229
+ "lighten-4": "var(--color-go-lighten-4)",
230
+ "lighten-5": "var(--color-go-lighten-5)",
231
+ "lighten-6": "var(--color-go-lighten-6)",
232
+ "80": "var(--color-go-80)",
233
+ "64": "var(--color-go-64)",
234
+ "48": "var(--color-go-48)",
235
+ "24": "var(--color-go-24)",
236
+ "16": "var(--color-go-16)",
237
+ "12": "var(--color-go-12)",
238
+ "8": "var(--color-go-8)",
239
+ "6": "var(--color-go-6)",
240
+ "4": "var(--color-go-4)",
241
+ "0": "var(--color-go-0)",
242
+ foreground: "var(--color-go-foreground)",
243
+ "foreground-emphasis": "var(--color-go-foreground-emphasis)",
244
+ "foreground-onfill": "var(--color-go-foreground-onfill)",
245
+ "background-fill": "var(--color-go-background-fill)",
246
+ "background-fill-emphasis": "var(--color-go-background-fill-emphasis)",
247
+ "background-soft": "var(--color-go-background-soft)",
248
+ "background-soft-emphasis": "var(--color-go-background-soft-emphasis)",
249
+ },
250
+ cir: {
251
+ DEFAULT: "var(--color-cir)",
252
+ "darken-1": "var(--color-cir-darken-1)",
253
+ "darken-2": "var(--color-cir-darken-2)",
254
+ "darken-3": "var(--color-cir-darken-3)",
255
+ "darken-4": "var(--color-cir-darken-4)",
256
+ "darken-5": "var(--color-cir-darken-5)",
257
+ "darken-6": "var(--color-cir-darken-6)",
258
+ "lighten-1": "var(--color-cir-lighten-1)",
259
+ "lighten-2": "var(--color-cir-lighten-2)",
260
+ "lighten-3": "var(--color-cir-lighten-3)",
261
+ "lighten-4": "var(--color-cir-lighten-4)",
262
+ "lighten-5": "var(--color-cir-lighten-5)",
263
+ "lighten-6": "var(--color-cir-lighten-6)",
264
+ "80": "var(--color-cir-80)",
265
+ "64": "var(--color-cir-64)",
266
+ "48": "var(--color-cir-48)",
267
+ "24": "var(--color-cir-24)",
268
+ "16": "var(--color-cir-16)",
269
+ "12": "var(--color-cir-12)",
270
+ "8": "var(--color-cir-8)",
271
+ "6": "var(--color-cir-6)",
272
+ "4": "var(--color-cir-4)",
273
+ "0": "var(--color-cir-0)",
274
+ foreground: "var(--color-cir-foreground)",
275
+ "foreground-emphasis": "var(--color-cir-foreground-emphasis)",
276
+ "foreground-onfill": "var(--color-cir-foreground-onfill)",
277
+ "background-fill": "var(--color-cir-background-fill)",
278
+ "background-fill-emphasis": "var(--color-cir-background-fill-emphasis)",
279
+ "background-soft": "var(--color-cir-background-soft)",
280
+ "background-soft-emphasis": "var(--color-cir-background-soft-emphasis)",
281
+ },
282
+ ped: {
283
+ DEFAULT: "var(--color-ped)",
284
+ "darken-1": "var(--color-ped-darken-1)",
285
+ "darken-2": "var(--color-ped-darken-2)",
286
+ "darken-3": "var(--color-ped-darken-3)",
287
+ "darken-4": "var(--color-ped-darken-4)",
288
+ "darken-5": "var(--color-ped-darken-5)",
289
+ "darken-6": "var(--color-ped-darken-6)",
290
+ "darken-7": "var(--color-ped-darken-7)",
291
+ "lighten-1": "var(--color-ped-lighten-1)",
292
+ "lighten-2": "var(--color-ped-lighten-2)",
293
+ "lighten-3": "var(--color-ped-lighten-3)",
294
+ "lighten-4": "var(--color-ped-lighten-4)",
295
+ "lighten-5": "var(--color-ped-lighten-5)",
296
+ "lighten-6": "var(--color-ped-lighten-6)",
297
+ "80": "var(--color-ped-80)",
298
+ "64": "var(--color-ped-64)",
299
+ "48": "var(--color-ped-48)",
300
+ "24": "var(--color-ped-24)",
301
+ "16": "var(--color-ped-16)",
302
+ "12": "var(--color-ped-12)",
303
+ "8": "var(--color-ped-8)",
304
+ "6": "var(--color-ped-6)",
305
+ "4": "var(--color-ped-4)",
306
+ "0": "var(--color-ped-0)",
307
+ foreground: "var(--color-ped-foreground)",
308
+ "foreground-emphasis": "var(--color-ped-foreground-emphasis)",
309
+ "foreground-onfill": "var(--color-ped-foreground-onfill)",
310
+ "background-fill": "var(--color-ped-background-fill)",
311
+ "background-fill-emphasis": "var(--color-ped-background-fill-emphasis)",
312
+ "background-soft": "var(--color-ped-background-soft)",
313
+ "background-soft-emphasis": "var(--color-ped-background-soft-emphasis)",
314
+ },
315
+ prev: {
316
+ DEFAULT: "var(--color-prev)",
317
+ "darken-1": "var(--color-prev-darken-1)",
318
+ "darken-2": "var(--color-prev-darken-2)",
319
+ "darken-3": "var(--color-prev-darken-3)",
320
+ "darken-4": "var(--color-prev-darken-4)",
321
+ "darken-5": "var(--color-prev-darken-5)",
322
+ "darken-6": "var(--color-prev-darken-6)",
323
+ "lighten-1": "var(--color-prev-lighten-1)",
324
+ "lighten-2": "var(--color-prev-lighten-2)",
325
+ "lighten-3": "var(--color-prev-lighten-3)",
326
+ "lighten-4": "var(--color-prev-lighten-4)",
327
+ "lighten-5": "var(--color-prev-lighten-5)",
328
+ "lighten-6": "var(--color-prev-lighten-6)",
329
+ "80": "var(--color-prev-80)",
330
+ "64": "var(--color-prev-64)",
331
+ "48": "var(--color-prev-48)",
332
+ "24": "var(--color-prev-24)",
333
+ "16": "var(--color-prev-16)",
334
+ "12": "var(--color-prev-12)",
335
+ "8": "var(--color-prev-8)",
336
+ "6": "var(--color-prev-6)",
337
+ "4": "var(--color-prev-4)",
338
+ "0": "var(--color-prev-0)",
339
+ foreground: "var(--color-prev-foreground)",
340
+ "foreground-emphasis": "var(--color-prev-foreground-emphasis)",
341
+ "foreground-onfill": "var(--color-prev-foreground-onfill)",
342
+ "background-fill": "var(--color-prev-background-fill)",
343
+ "background-fill-emphasis": "var(--color-prev-background-fill-emphasis)",
344
+ "background-soft": "var(--color-prev-background-soft)",
345
+ "background-soft-emphasis": "var(--color-prev-background-soft-emphasis)",
63
346
  },
64
347
  primary: {
65
348
  DEFAULT: "var(--color-primary)",
66
349
  "darken-1": "var(--color-primary-darken-1)",
67
350
  "darken-2": "var(--color-primary-darken-2)",
351
+ "lighten-1": "var(--color-primary-lighten-1)",
352
+ "lighten-2": "var(--color-primary-lighten-2)",
353
+ "lighten-3": "var(--color-primary-lighten-3)",
354
+ "lighten-4": "var(--color-primary-lighten-4)",
355
+ "lighten-5": "var(--color-primary-lighten-5)",
356
+ "lighten-6": "var(--color-primary-lighten-6)",
68
357
  "80": "var(--color-primary-80)",
358
+ "64": "var(--color-primary-64)",
69
359
  "48": "var(--color-primary-48)",
70
360
  "24": "var(--color-primary-24)",
71
361
  "16": "var(--color-primary-16)",
362
+ "12": "var(--color-primary-12)",
72
363
  "8": "var(--color-primary-8)",
364
+ "6": "var(--color-primary-6)",
73
365
  "4": "var(--color-primary-4)",
366
+ "0": "var(--color-primary-0)",
367
+ foreground: "var(--color-primary-foreground)",
368
+ "foreground-emphasis": "var(--color-primary-foreground-emphasis)",
369
+ "foreground-muted": "var(--color-primary-foreground-muted)",
370
+ "foreground-onfill": "var(--color-primary-foreground-onfill)",
371
+ stroke: "var(--color-primary-stroke)",
372
+ "stroke-emphasis": "var(--color-primary-stroke-emphasis)",
373
+ "background-fill": "var(--color-primary-background-fill)",
374
+ "background-fill-emphasis": "var(--color-primary-background-fill-emphasis)",
375
+ "background-soft": "var(--color-primary-background-soft)",
376
+ "background-soft-emphasis": "var(--color-primary-background-soft-emphasis)",
377
+ "background-soft-muted": "var(--color-primary-background-soft-muted)",
74
378
  },
75
379
  secondary: {
76
380
  DEFAULT: "var(--color-secondary)",
@@ -78,36 +382,37 @@ export const colors = {
78
382
  "darken-2": "var(--color-secondary-darken-2)",
79
383
  "darken-3": "var(--color-secondary-darken-3)",
80
384
  "darken-4": "var(--color-secondary-darken-4)",
385
+ "darken-5": "var(--color-secondary-darken-5)",
386
+ "darken-6": "var(--color-secondary-darken-6)",
387
+ "lighten-1": "var(--color-secondary-lighten-1)",
388
+ "lighten-2": "var(--color-secondary-lighten-2)",
389
+ "lighten-3": "var(--color-secondary-lighten-3)",
390
+ "lighten-4": "var(--color-secondary-lighten-4)",
391
+ "lighten-5": "var(--color-secondary-lighten-5)",
392
+ "lighten-6": "var(--color-secondary-lighten-6)",
81
393
  "80": "var(--color-secondary-80)",
394
+ "64": "var(--color-secondary-64)",
82
395
  "48": "var(--color-secondary-48)",
83
396
  "24": "var(--color-secondary-24)",
84
397
  "16": "var(--color-secondary-16)",
398
+ "12": "var(--color-secondary-12)",
85
399
  "8": "var(--color-secondary-8)",
400
+ "6": "var(--color-secondary-6)",
86
401
  "4": "var(--color-secondary-4)",
87
- },
88
- other: {
89
- primary: {
90
- DEFAULT: "var(--color-other-primary)",
91
- "darken-1": "var(--color-other-primary-darken-1)",
92
- "darken-2": "var(--color-other-primary-darken-2)",
93
- "80": "var(--color-other-primary-80)",
94
- "48": "var(--color-other-primary-48)",
95
- "24": "var(--color-other-primary-24)",
96
- "16": "var(--color-other-primary-16)",
97
- "8": "var(--color-other-primary-8)",
98
- "4": "var(--color-other-primary-4)",
99
- },
100
- secondary: {
101
- DEFAULT: "var(--color-other-secondary)",
102
- "darken-1": "var(--color-other-secondary-darken-1)",
103
- "darken-2": "var(--color-other-secondary-darken-2)",
104
- "80": "var(--color-other-secondary-80)",
105
- "48": "var(--color-other-secondary-48)",
106
- "24": "var(--color-other-secondary-24)",
107
- "16": "var(--color-other-secondary-16)",
108
- "8": "var(--color-other-secondary-8)",
109
- "4": "var(--color-other-secondary-4)",
110
- },
402
+ "0": "var(--color-secondary-0)",
403
+ foreground: "var(--color-secondary-foreground)",
404
+ "foreground-emphasis": "var(--color-secondary-foreground-emphasis)",
405
+ "foreground-muted": "var(--color-secondary-foreground-muted)",
406
+ "foreground-onfill": "var(--color-secondary-foreground-onfill)",
407
+ stroke: "var(--color-secondary-stroke)",
408
+ "stroke-emphasis": "var(--color-secondary-stroke-emphasis)",
409
+ "background-fill": "var(--color-secondary-background-fill)",
410
+ "background-fill-emphasis":
411
+ "var(--color-secondary-background-fill-emphasis)",
412
+ "background-soft": "var(--color-secondary-background-soft)",
413
+ "background-soft-emphasis":
414
+ "var(--color-secondary-background-soft-emphasis)",
415
+ "background-soft-muted": "var(--color-secondary-background-soft-muted)",
111
416
  },
112
417
  };
113
418
 
@@ -122,14 +427,15 @@ export const fontSize = {
122
427
  base: "var(--text-base)",
123
428
  lg: "var(--text-lg)",
124
429
  xl: "var(--text-xl)",
125
- "2xl": "var(--text-2xl)",
126
- "3xl": "var(--text-3xl)",
127
- "4xl": "var(--text-4xl)",
128
- "5xl": "var(--text-5xl)",
129
- "6xl": "var(--text-6xl)",
130
- "7xl": "var(--text-7xl)",
131
- "8xl": "var(--text-8xl)",
132
- "9xl": "var(--text-9xl)",
430
+ "title-xs": "var(--text-title-xs)",
431
+ "title-sm": "var(--text-title-sm)",
432
+ "title-md": "var(--text-title-md)",
433
+ "title-lg": "var(--text-title-lg)",
434
+ "title-xl": "var(--text-title-xl)",
435
+ "title-xxl": "var(--text-title-xxl)",
436
+ "display-sm": "var(--text-display-sm)",
437
+ "display-md": "var(--text-display-md)",
438
+ "display-lg": "var(--text-display-lg)",
133
439
  };
134
440
 
135
441
  export const lineHeight = {
@@ -138,14 +444,54 @@ export const lineHeight = {
138
444
  sm: "var(--leading-sm)",
139
445
  md: "var(--leading-md)",
140
446
  lg: "var(--leading-lg)",
141
- "2xl": "var(--leading-2xl)",
142
- "3xl": "var(--leading-3xl)",
143
- "4xl": "var(--leading-4xl)",
144
- "5xl": "var(--leading-5xl)",
145
- "6xl": "var(--leading-6xl)",
146
- "7xl": "var(--leading-7xl)",
147
- "8xl": "var(--leading-8xl)",
148
- "9xl": "var(--leading-9xl)",
447
+ "title-xs": "var(--leading-title-xs)",
448
+ "title-sm": "var(--leading-title-sm)",
449
+ "title-md": "var(--leading-title-md)",
450
+ "title-lg": "var(--leading-title-lg)",
451
+ "title-xl": "var(--leading-title-xl)",
452
+ "title-xxl": "var(--leading-title-xxl)",
453
+ "display-sm": "var(--leading-display-sm)",
454
+ "display-md": "var(--leading-display-md)",
455
+ "display-lg": "var(--leading-display-lg)",
456
+ };
457
+
458
+ export const fontWeight = {
459
+ regular: "var(--font-weight-regular)",
460
+ medium: "var(--font-weight-medium)",
461
+ semibold: "var(--font-weight-semibold)",
462
+ bold: "var(--font-weight-bold)",
463
+ extrabold: "var(--font-weight-extrabold)",
464
+ };
465
+
466
+ export const screens = {
467
+ tv: "1920px",
468
+ desktop: "1024px",
469
+ tablet: "600px",
470
+ mobile: "320px",
471
+ sm: "320px",
472
+ md: "600px",
473
+ lg: "1024px",
474
+ xl: "1920px",
475
+ };
476
+
477
+ export const breakpoints = {
478
+ tv: "var(--breakpoint-tv)",
479
+ desktop: "var(--breakpoint-desktop)",
480
+ tablet: "var(--breakpoint-tablet)",
481
+ mobile: "var(--breakpoint-mobile)",
482
+ };
483
+
484
+ export const container = {
485
+ tv: "var(--container-tv)",
486
+ desktop: "var(--container-desktop)",
487
+ tablet: "var(--container-tablet)",
488
+ mobile: "var(--container-mobile)",
489
+ };
490
+
491
+ export const sidebar = {
492
+ width: "var(--sidebar-width)",
493
+ "width-mobile": "var(--sidebar-width-mobile)",
494
+ "width-icon": "var(--sidebar-width-icon)",
149
495
  };
150
496
 
151
497
  export const borderRadius = {
@@ -157,10 +503,9 @@ export const borderRadius = {
157
503
  circular: "var(--radius-circular)",
158
504
  };
159
505
 
160
- export const container = {
161
- desktop: "var(--container-desktop)",
162
- tablet: "var(--container-tablet)",
163
- mobile: "var(--container-mobile)",
506
+ export const boxShadow = {
507
+ "level-1":
508
+ "0 0 2px 0 var(--color-drop-shadow-layer-a), 0 2px 4px 0 var(--color-drop-shadow-layer-b)",
164
509
  };
165
510
 
166
511
  export const keyframes = {
@@ -186,15 +531,3 @@ export const animation = {
186
531
  "accordion-down": "accordion-down 0.2s ease-out",
187
532
  "accordion-up": "accordion-up 0.2s ease-out",
188
533
  };
189
-
190
- export const screens = {
191
- tv: "1920px",
192
- desktop: "1024px",
193
- tablet: "600px",
194
- mobile: "320px",
195
- sm: "320px",
196
- md: "600px",
197
- lg: "1024px",
198
- xl: "1280px",
199
- "2xl": "1920px",
200
- };
package/dist/index.d.mts CHANGED
@@ -33,7 +33,7 @@ interface ButtonProps extends React.ComponentProps<"button">, VariantProps<typeo
33
33
  alert?: string;
34
34
  }
35
35
  declare const buttonVariants: (props?: ({
36
- variant?: "primary" | "primary-soft" | "primary-ghost" | "secondary" | "secondary-soft" | "secondary-ghost" | "error" | "error-soft" | "error-ghost" | "outline" | "gradient" | null | undefined;
36
+ variant?: "regular" | "regular-soft" | "regular-basic" | "emphasis" | "emphasis-soft" | "emphasis-basic" | "error" | "error-soft" | "error-basic" | "warning" | "warning-soft" | "warning-basic" | "success" | "success-soft" | "success-basic" | "outlined" | "gradient" | "medbrain" | null | undefined;
37
37
  size?: "sm" | "md" | "lg" | "xl" | null | undefined;
38
38
  } & class_variance_authority_types.ClassProp) | undefined) => string;
39
39
  declare function Button({ className, containerClassName, variant, size, asChild, iconRight, iconLeft, badge, loading, alert, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
@@ -141,7 +141,7 @@ declare function SidebarMenuItem({ className, isActive, children, ...props }: Re
141
141
  isActive?: boolean;
142
142
  }): react_jsx_runtime.JSX.Element;
143
143
  declare const sidebarMenuButtonVariants: (props?: ({
144
- variant?: "section" | "outline" | "default" | null | undefined;
144
+ variant?: "section" | "default" | "outline" | null | undefined;
145
145
  size?: "sm" | "md" | "lg" | null | undefined;
146
146
  } & class_variance_authority_types.ClassProp) | undefined) => string;
147
147
  declare function SidebarMenuButton({ asChild, isActive, variant, size, tooltip, className, ...props }: React.ComponentProps<"button"> & {
@@ -222,24 +222,34 @@ declare function SwitcherItem({ children, value, onClick, icon }: SwitcherItemPr
222
222
  declare function SwitcherFooter({ children, onClick, icon }: SwitcherFooterProps): react_jsx_runtime.JSX.Element;
223
223
  declare function SwitcherSeparator(): react_jsx_runtime.JSX.Element;
224
224
 
225
- declare const AlertDialog: React.FC<AlertDialogPrimitive.AlertDialogProps>;
226
- declare const AlertDialogTrigger: React.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
227
- declare const AlertDialogPortal: React.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
228
- declare const AlertDialogOverlay: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
229
- declare const AlertDialogContent: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
230
- declare const AlertDialogHeader: {
231
- ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
232
- displayName: string;
233
- };
234
- declare const AlertDialogFooter: {
235
- ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
236
- displayName: string;
237
- };
238
- declare const AlertDialogTitle: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
239
- declare const AlertDialogDescription: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
240
- declare const AlertDialogAction: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
241
- declare const AlertDialogCancel: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
225
+ interface AlertProps extends React.ComponentProps<"div"> {
226
+ variant?: "regular" | "emphasis" | "success" | "warning" | "error";
227
+ onClose?: () => void;
228
+ }
229
+ declare function Alert({ className, variant, onClose, children, ...props }: AlertProps): react_jsx_runtime.JSX.Element;
230
+ declare function AlertTitle({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
231
+ declare function AlertDescription({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
232
+ declare function AlertActions({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
233
+ declare const alertButtonVariants: (props?: ({
234
+ variant?: "regular" | "basic" | null | undefined;
235
+ alertVariant?: "regular" | "emphasis" | "error" | "warning" | "success" | null | undefined;
236
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
237
+ interface AlertButtonProps extends React.ComponentProps<"button">, VariantProps<typeof alertButtonVariants> {
238
+ }
239
+ declare function AlertButton({ className, variant, ...props }: AlertButtonProps): react_jsx_runtime.JSX.Element;
240
+
241
+ declare function AlertDialog({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Root>): react_jsx_runtime.JSX.Element;
242
+ declare function AlertDialogTrigger({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
243
+ declare function AlertDialogPortal({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Portal>): react_jsx_runtime.JSX.Element;
244
+ declare function AlertDialogOverlay({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>): react_jsx_runtime.JSX.Element;
245
+ declare function AlertDialogContent({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content>): react_jsx_runtime.JSX.Element;
246
+ declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
247
+ declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
248
+ declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Title>): react_jsx_runtime.JSX.Element;
249
+ declare function AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Description>): react_jsx_runtime.JSX.Element;
250
+ declare function AlertDialogAction({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Action>): react_jsx_runtime.JSX.Element;
251
+ declare function AlertDialogCancel({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>): react_jsx_runtime.JSX.Element;
242
252
 
243
253
  declare function useIsMobile(): boolean;
244
254
 
245
- export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Avatar, AvatarFallback, AvatarImage, Button, Collapsible, CollapsibleContent, CollapsibleTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Input, Loading, Logo, LogoShort, Separator, Sheet, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuItemCollapse, SidebarMenuItemTitle, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Switcher, SwitcherContent, SwitcherFooter, SwitcherGroup, SwitcherItem, SwitcherSeparator, SwitcherTrigger, Tooltip, buttonVariants, useIsMobile, useSidebar };
255
+ export { Alert, AlertActions, AlertButton, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, Avatar, AvatarFallback, AvatarImage, Button, Collapsible, CollapsibleContent, CollapsibleTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Input, Loading, Logo, LogoShort, Separator, Sheet, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuItemCollapse, SidebarMenuItemTitle, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Switcher, SwitcherContent, SwitcherFooter, SwitcherGroup, SwitcherItem, SwitcherSeparator, SwitcherTrigger, Tooltip, buttonVariants, useIsMobile, useSidebar };