@idaho6/design 0.1.0 → 0.2.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.
@@ -2,247 +2,595 @@
2
2
  "openprops": {
3
3
  "border": {
4
4
  "radius": {
5
- "1": "2px",
6
- "2": "5px",
7
- "3": "1rem",
8
- "4": "2rem",
9
- "5": "4rem",
10
- "6": "8rem"
5
+ "1": {
6
+ "$value": "2px"
7
+ },
8
+ "2": {
9
+ "$value": "5px"
10
+ },
11
+ "3": {
12
+ "$value": "1rem"
13
+ },
14
+ "4": {
15
+ "$value": "2rem"
16
+ },
17
+ "5": {
18
+ "$value": "4rem"
19
+ },
20
+ "6": {
21
+ "$value": "8rem"
22
+ }
11
23
  },
12
24
  "size": {
13
- "1": "1px",
14
- "2": "2px",
15
- "3": "5px",
16
- "4": "10px",
17
- "5": "25px"
25
+ "1": {
26
+ "$value": "1px"
27
+ },
28
+ "2": {
29
+ "$value": "2px"
30
+ },
31
+ "3": {
32
+ "$value": "5px"
33
+ },
34
+ "4": {
35
+ "$value": "10px"
36
+ },
37
+ "5": {
38
+ "$value": "25px"
39
+ }
18
40
  }
19
41
  },
20
42
  "color": {
21
- "white": "#ffffff",
22
- "black": "#000000",
43
+ "white": {
44
+ "$value": "#ffffff"
45
+ },
46
+ "black": {
47
+ "$value": "#000000"
48
+ },
23
49
  "slate": {
24
- "0": "#f8f9fa",
25
- "1": "#f1f3f5",
26
- "2": "#e9ecef",
27
- "3": "#dee2e6",
28
- "4": "#ced4da",
29
- "5": "#adb5bd",
30
- "6": "#868e96",
31
- "7": "#495057",
32
- "8": "#343a40",
33
- "9": "#212529",
34
- "10": "#16191d",
35
- "11": "#0d0f12",
36
- "12": "#030507"
50
+ "0": {
51
+ "$value": "#f8f9fa"
52
+ },
53
+ "1": {
54
+ "$value": "#f1f3f5"
55
+ },
56
+ "2": {
57
+ "$value": "#e9ecef"
58
+ },
59
+ "3": {
60
+ "$value": "#dee2e6"
61
+ },
62
+ "4": {
63
+ "$value": "#ced4da"
64
+ },
65
+ "5": {
66
+ "$value": "#adb5bd"
67
+ },
68
+ "6": {
69
+ "$value": "#868e96"
70
+ },
71
+ "7": {
72
+ "$value": "#495057"
73
+ },
74
+ "8": {
75
+ "$value": "#343a40"
76
+ },
77
+ "9": {
78
+ "$value": "#212529"
79
+ },
80
+ "10": {
81
+ "$value": "#16191d"
82
+ },
83
+ "11": {
84
+ "$value": "#0d0f12"
85
+ },
86
+ "12": {
87
+ "$value": "#030507"
88
+ }
37
89
  },
38
90
  "blue": {
39
- "0": "#e7f5ff",
40
- "1": "#d0ebff",
41
- "2": "#a5d8ff",
42
- "3": "#74c0fc",
43
- "4": "#4dabf7",
44
- "5": "#339af0",
45
- "6": "#228be6",
46
- "7": "#1c7ed6",
47
- "8": "#1971c2",
48
- "9": "#1864ab",
49
- "10": "#145591",
50
- "11": "#114678",
51
- "12": "#0d375e"
91
+ "0": {
92
+ "$value": "#e7f5ff"
93
+ },
94
+ "1": {
95
+ "$value": "#d0ebff"
96
+ },
97
+ "2": {
98
+ "$value": "#a5d8ff"
99
+ },
100
+ "3": {
101
+ "$value": "#74c0fc"
102
+ },
103
+ "4": {
104
+ "$value": "#4dabf7"
105
+ },
106
+ "5": {
107
+ "$value": "#339af0"
108
+ },
109
+ "6": {
110
+ "$value": "#228be6"
111
+ },
112
+ "7": {
113
+ "$value": "#1c7ed6"
114
+ },
115
+ "8": {
116
+ "$value": "#1971c2"
117
+ },
118
+ "9": {
119
+ "$value": "#1864ab"
120
+ },
121
+ "10": {
122
+ "$value": "#145591"
123
+ },
124
+ "11": {
125
+ "$value": "#114678"
126
+ },
127
+ "12": {
128
+ "$value": "#0d375e"
129
+ }
52
130
  },
53
131
  "red": {
54
- "0": "#fff5f5",
55
- "1": "#ffe3e3",
56
- "2": "#ffc9c9",
57
- "3": "#ffa8a8",
58
- "4": "#ff8787",
59
- "5": "#ff6b6b",
60
- "6": "#fa5252",
61
- "7": "#f03e3e",
62
- "8": "#e03131",
63
- "9": "#c92a2a",
64
- "10": "#b02525",
65
- "11": "#962020",
66
- "12": "#7d1a1a"
132
+ "0": {
133
+ "$value": "#fff5f5"
134
+ },
135
+ "1": {
136
+ "$value": "#ffe3e3"
137
+ },
138
+ "2": {
139
+ "$value": "#ffc9c9"
140
+ },
141
+ "3": {
142
+ "$value": "#ffa8a8"
143
+ },
144
+ "4": {
145
+ "$value": "#ff8787"
146
+ },
147
+ "5": {
148
+ "$value": "#ff6b6b"
149
+ },
150
+ "6": {
151
+ "$value": "#fa5252"
152
+ },
153
+ "7": {
154
+ "$value": "#f03e3e"
155
+ },
156
+ "8": {
157
+ "$value": "#e03131"
158
+ },
159
+ "9": {
160
+ "$value": "#c92a2a"
161
+ },
162
+ "10": {
163
+ "$value": "#b02525"
164
+ },
165
+ "11": {
166
+ "$value": "#962020"
167
+ },
168
+ "12": {
169
+ "$value": "#7d1a1a"
170
+ }
67
171
  },
68
172
  "green": {
69
- "0": "#ebfbee",
70
- "1": "#d3f9d8",
71
- "2": "#b2f2bb",
72
- "3": "#8ce99a",
73
- "4": "#69db7c",
74
- "5": "#51cf66",
75
- "6": "#40c057",
76
- "7": "#37b24d",
77
- "8": "#2f9e44",
78
- "9": "#2b8a3e",
79
- "10": "#237032",
80
- "11": "#1b5727",
81
- "12": "#133d1b"
173
+ "0": {
174
+ "$value": "#ebfbee"
175
+ },
176
+ "1": {
177
+ "$value": "#d3f9d8"
178
+ },
179
+ "2": {
180
+ "$value": "#b2f2bb"
181
+ },
182
+ "3": {
183
+ "$value": "#8ce99a"
184
+ },
185
+ "4": {
186
+ "$value": "#69db7c"
187
+ },
188
+ "5": {
189
+ "$value": "#51cf66"
190
+ },
191
+ "6": {
192
+ "$value": "#40c057"
193
+ },
194
+ "7": {
195
+ "$value": "#37b24d"
196
+ },
197
+ "8": {
198
+ "$value": "#2f9e44"
199
+ },
200
+ "9": {
201
+ "$value": "#2b8a3e"
202
+ },
203
+ "10": {
204
+ "$value": "#237032"
205
+ },
206
+ "11": {
207
+ "$value": "#1b5727"
208
+ },
209
+ "12": {
210
+ "$value": "#133d1b"
211
+ }
82
212
  },
83
213
  "teal": {
84
- "0": "#e6fcf5",
85
- "1": "#c3fae8",
86
- "2": "#96f2d7",
87
- "3": "#63e6be",
88
- "4": "#38d9a9",
89
- "5": "#20c997",
90
- "6": "#12b886",
91
- "7": "#0ca678",
92
- "8": "#099268",
93
- "9": "#087f5b",
94
- "10": "#066649",
95
- "11": "#054d37",
96
- "12": "#033325"
214
+ "0": {
215
+ "$value": "#e6fcf5"
216
+ },
217
+ "1": {
218
+ "$value": "#c3fae8"
219
+ },
220
+ "2": {
221
+ "$value": "#96f2d7"
222
+ },
223
+ "3": {
224
+ "$value": "#63e6be"
225
+ },
226
+ "4": {
227
+ "$value": "#38d9a9"
228
+ },
229
+ "5": {
230
+ "$value": "#20c997"
231
+ },
232
+ "6": {
233
+ "$value": "#12b886"
234
+ },
235
+ "7": {
236
+ "$value": "#0ca678"
237
+ },
238
+ "8": {
239
+ "$value": "#099268"
240
+ },
241
+ "9": {
242
+ "$value": "#087f5b"
243
+ },
244
+ "10": {
245
+ "$value": "#066649"
246
+ },
247
+ "11": {
248
+ "$value": "#054d37"
249
+ },
250
+ "12": {
251
+ "$value": "#033325"
252
+ }
97
253
  },
98
254
  "amber": {
99
- "0": "#fff9db",
100
- "1": "#fff3bf",
101
- "2": "#ffec99",
102
- "3": "#ffe066",
103
- "4": "#ffd43b",
104
- "5": "#fcc419",
105
- "6": "#fab005",
106
- "7": "#f59f00",
107
- "8": "#f08c00",
108
- "9": "#e67700",
109
- "10": "#b35c00",
110
- "11": "#804200",
111
- "12": "#663500"
255
+ "0": {
256
+ "$value": "#fff9db"
257
+ },
258
+ "1": {
259
+ "$value": "#fff3bf"
260
+ },
261
+ "2": {
262
+ "$value": "#ffec99"
263
+ },
264
+ "3": {
265
+ "$value": "#ffe066"
266
+ },
267
+ "4": {
268
+ "$value": "#ffd43b"
269
+ },
270
+ "5": {
271
+ "$value": "#fcc419"
272
+ },
273
+ "6": {
274
+ "$value": "#fab005"
275
+ },
276
+ "7": {
277
+ "$value": "#f59f00"
278
+ },
279
+ "8": {
280
+ "$value": "#f08c00"
281
+ },
282
+ "9": {
283
+ "$value": "#e67700"
284
+ },
285
+ "10": {
286
+ "$value": "#b35c00"
287
+ },
288
+ "11": {
289
+ "$value": "#804200"
290
+ },
291
+ "12": {
292
+ "$value": "#663500"
293
+ }
112
294
  }
113
295
  },
114
296
  "spacing": {
115
297
  "size": {
116
- "1": ".25rem",
117
- "2": ".5rem",
118
- "3": "1rem",
119
- "4": "1.25rem",
120
- "5": "1.5rem",
121
- "6": "1.75rem",
122
- "7": "2rem",
123
- "8": "3rem",
124
- "9": "4rem",
125
- "10": "5rem",
126
- "11": "7.5rem",
127
- "12": "10rem",
128
- "13": "15rem"
298
+ "1": {
299
+ "$value": ".25rem"
300
+ },
301
+ "2": {
302
+ "$value": ".5rem"
303
+ },
304
+ "3": {
305
+ "$value": "1rem"
306
+ },
307
+ "4": {
308
+ "$value": "1.25rem"
309
+ },
310
+ "5": {
311
+ "$value": "1.5rem"
312
+ },
313
+ "6": {
314
+ "$value": "1.75rem"
315
+ },
316
+ "7": {
317
+ "$value": "2rem"
318
+ },
319
+ "8": {
320
+ "$value": "3rem"
321
+ },
322
+ "9": {
323
+ "$value": "4rem"
324
+ },
325
+ "10": {
326
+ "$value": "5rem"
327
+ },
328
+ "11": {
329
+ "$value": "7.5rem"
330
+ },
331
+ "12": {
332
+ "$value": "10rem"
333
+ },
334
+ "13": {
335
+ "$value": "15rem"
336
+ }
129
337
  }
130
338
  },
131
339
  "typography": {
132
340
  "font": {
133
341
  "family": {
134
- "neo-grotesque": "Inter, Roboto, Helvetica Neue, Arial Nova, Nimbus Sans, Arial, sans-serif",
135
- "monospace-code": "Dank Mono,Operator Mono, Inconsolata, Fira Mono, ui-monospace, SF Mono, Monaco, Droid Sans Mono, Source Code Pro, Cascadia Code, Menlo, Consolas, DejaVu Sans Mono, monospace",
136
- "mono": "var(--font-monospace-code)",
137
- "system-ui": "system-ui, sans-serif",
138
- "serif": "ui-serif, serif"
342
+ "neo-grotesque": {
343
+ "$value": "Inter, Roboto, Helvetica Neue, Arial Nova, Nimbus Sans, Arial, sans-serif"
344
+ },
345
+ "monospace-code": {
346
+ "$value": "Dank Mono,Operator Mono, Inconsolata, Fira Mono, ui-monospace, SF Mono, Monaco, Droid Sans Mono, Source Code Pro, Cascadia Code, Menlo, Consolas, DejaVu Sans Mono, monospace"
347
+ },
348
+ "mono": {
349
+ "$value": "var(--font-monospace-code)"
350
+ },
351
+ "system-ui": {
352
+ "$value": "system-ui, sans-serif"
353
+ },
354
+ "serif": {
355
+ "$value": "ui-serif, serif"
356
+ }
139
357
  },
140
358
  "size": {
141
- "0": ".75rem",
142
- "1": "1rem",
143
- "2": "1.1rem",
144
- "3": "1.25rem",
145
- "4": "1.5rem",
146
- "5": "2rem",
147
- "6": "2.5rem",
148
- "7": "3rem",
149
- "8": "3.5rem"
359
+ "0": {
360
+ "$value": ".75rem"
361
+ },
362
+ "1": {
363
+ "$value": "1rem"
364
+ },
365
+ "2": {
366
+ "$value": "1.1rem"
367
+ },
368
+ "3": {
369
+ "$value": "1.25rem"
370
+ },
371
+ "4": {
372
+ "$value": "1.5rem"
373
+ },
374
+ "5": {
375
+ "$value": "2rem"
376
+ },
377
+ "6": {
378
+ "$value": "2.5rem"
379
+ },
380
+ "7": {
381
+ "$value": "3rem"
382
+ },
383
+ "8": {
384
+ "$value": "3.5rem"
385
+ }
150
386
  },
151
387
  "weight": {
152
- "1": "100",
153
- "2": "200",
154
- "3": "300",
155
- "4": "400",
156
- "5": "500",
157
- "6": "600",
158
- "7": "700",
159
- "8": "800",
160
- "9": "900"
388
+ "1": {
389
+ "$value": "100"
390
+ },
391
+ "2": {
392
+ "$value": "200"
393
+ },
394
+ "3": {
395
+ "$value": "300"
396
+ },
397
+ "4": {
398
+ "$value": "400"
399
+ },
400
+ "5": {
401
+ "$value": "500"
402
+ },
403
+ "6": {
404
+ "$value": "600"
405
+ },
406
+ "7": {
407
+ "$value": "700"
408
+ },
409
+ "8": {
410
+ "$value": "800"
411
+ },
412
+ "9": {
413
+ "$value": "900"
414
+ }
161
415
  },
162
416
  "lineheight": {
163
- "0": "1.1",
164
- "1": "1.25",
165
- "2": "1.375",
166
- "3": "1.5",
167
- "4": "1.75",
168
- "5": "2"
417
+ "0": {
418
+ "$value": "1.1"
419
+ },
420
+ "1": {
421
+ "$value": "1.25"
422
+ },
423
+ "2": {
424
+ "$value": "1.375"
425
+ },
426
+ "3": {
427
+ "$value": "1.5"
428
+ },
429
+ "4": {
430
+ "$value": "1.75"
431
+ },
432
+ "5": {
433
+ "$value": "2"
434
+ }
169
435
  }
170
436
  }
171
437
  }
172
438
  },
173
439
  "animation": {
174
440
  "duration": {
175
- "base": "0.2s"
441
+ "base": {
442
+ "$value": "0.2s"
443
+ }
176
444
  }
177
445
  },
178
446
  "border": {
179
447
  "size": {
180
- "subtle": "1px",
181
- "base": "2px",
182
- "strong": "5px"
448
+ "subtle": {
449
+ "$value": "1px"
450
+ },
451
+ "base": {
452
+ "$value": "2px"
453
+ },
454
+ "strong": {
455
+ "$value": "5px"
456
+ }
183
457
  },
184
458
  "radius": {
185
- "sm": "2px",
186
- "md": "5px"
459
+ "sm": {
460
+ "$value": "2px"
461
+ },
462
+ "md": {
463
+ "$value": "5px"
464
+ }
187
465
  },
188
466
  "focus-ring": {
189
- "offset": "5px",
190
- "color": "#228be6"
467
+ "offset": {
468
+ "$value": "5px"
469
+ },
470
+ "color": {
471
+ "$value": "#228be6"
472
+ }
191
473
  }
192
474
  },
193
475
  "color": {
194
476
  "action": {
195
- "primary": "#228be6",
196
- "hover": "#1c7ed6",
197
- "active": "#1971c2",
198
- "focus-ring": "#228be6"
477
+ "primary": {
478
+ "$value": "#228be6"
479
+ },
480
+ "hover": {
481
+ "$value": "#1c7ed6"
482
+ },
483
+ "active": {
484
+ "$value": "#1971c2"
485
+ },
486
+ "focus-ring": {
487
+ "$value": "#228be6"
488
+ }
199
489
  },
200
490
  "text": {
201
- "primary": "#212529",
202
- "secondary": "#495057",
203
- "on-dark": "#ffffff"
491
+ "primary": {
492
+ "$value": "#212529"
493
+ },
494
+ "secondary": {
495
+ "$value": "#495057"
496
+ },
497
+ "on-dark": {
498
+ "$value": "#ffffff"
499
+ }
204
500
  },
205
501
  "surface": {
206
- "page": "#ffffff",
207
- "card": "#f1f3f5",
208
- "border": "#ced4da",
209
- "border-subtle": "#dee2e6",
210
- "border-strong": "#adb5bd"
502
+ "page": {
503
+ "$value": "#ffffff"
504
+ },
505
+ "card": {
506
+ "$value": "#f1f3f5"
507
+ },
508
+ "border": {
509
+ "$value": "#ced4da"
510
+ },
511
+ "border-subtle": {
512
+ "$value": "#dee2e6"
513
+ },
514
+ "border-strong": {
515
+ "$value": "#adb5bd"
516
+ }
211
517
  }
212
518
  },
213
519
  "opacity": {
214
- "disabled": "0.6"
520
+ "disabled": {
521
+ "$value": "0.6"
522
+ }
215
523
  },
216
524
  "spacing": {
217
- "xs": ".25rem",
218
- "sm": ".5rem",
219
- "md": "1rem",
220
- "lg": "1.25rem",
221
- "xl": "1.5rem"
525
+ "xs": {
526
+ "$value": ".25rem"
527
+ },
528
+ "sm": {
529
+ "$value": ".5rem"
530
+ },
531
+ "md": {
532
+ "$value": "1rem"
533
+ },
534
+ "lg": {
535
+ "$value": "1.25rem"
536
+ },
537
+ "xl": {
538
+ "$value": "1.5rem"
539
+ }
222
540
  },
223
541
  "typography": {
224
542
  "family": {
225
- "base": "Inter, Roboto, Helvetica Neue, Arial Nova, Nimbus Sans, Arial, sans-serif",
226
- "mono": "var(--font-monospace-code)"
543
+ "base": {
544
+ "$value": "Inter, Roboto, Helvetica Neue, Arial Nova, Nimbus Sans, Arial, sans-serif"
545
+ },
546
+ "mono": {
547
+ "$value": "var(--font-monospace-code)"
548
+ }
227
549
  },
228
550
  "scale": {
229
- "xs": ".75rem",
230
- "sm": "1rem",
231
- "base": "1.1rem",
232
- "md": "1.25rem",
233
- "lg": "1.5rem",
234
- "2xl": "3rem",
235
- "3xl": "3.5rem"
551
+ "xs": {
552
+ "$value": ".75rem"
553
+ },
554
+ "sm": {
555
+ "$value": "1rem"
556
+ },
557
+ "base": {
558
+ "$value": "1.1rem"
559
+ },
560
+ "md": {
561
+ "$value": "1.25rem"
562
+ },
563
+ "lg": {
564
+ "$value": "1.5rem"
565
+ },
566
+ "2xl": {
567
+ "$value": "3rem"
568
+ },
569
+ "3xl": {
570
+ "$value": "3.5rem"
571
+ }
236
572
  },
237
573
  "weight": {
238
- "base": "600",
239
- "bold": "700"
574
+ "base": {
575
+ "$value": "600"
576
+ },
577
+ "bold": {
578
+ "$value": "700"
579
+ }
240
580
  },
241
581
  "lineheight": {
242
- "tight": "1.25",
243
- "snug": "1.375",
244
- "base": "1.5",
245
- "relaxed": "1.75"
582
+ "tight": {
583
+ "$value": "1.25"
584
+ },
585
+ "snug": {
586
+ "$value": "1.375"
587
+ },
588
+ "base": {
589
+ "$value": "1.5"
590
+ },
591
+ "relaxed": {
592
+ "$value": "1.75"
593
+ }
246
594
  }
247
595
  }
248
596
  }