@withlayers/components.button 0.6.0 → 0.7.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 (2) hide show
  1. package/dist/tokens.json +280 -4
  2. package/package.json +3 -3
package/dist/tokens.json CHANGED
@@ -118,6 +118,29 @@
118
118
  "$level": "state",
119
119
  "value": "{color.neutral.80}"
120
120
  }
121
+ },
122
+ "on-knockout": {
123
+ "$level": "mode",
124
+ "rest": {
125
+ "$level": "state",
126
+ "value": "{color.neutral.0}"
127
+ },
128
+ "active": {
129
+ "$level": "state",
130
+ "value": "{color.neutral.10}"
131
+ },
132
+ "disabled": {
133
+ "$level": "state",
134
+ "value": "{color.neutral.10}"
135
+ },
136
+ "focus": {
137
+ "$level": "state",
138
+ "value": "{color.neutral.0}"
139
+ },
140
+ "hover": {
141
+ "$level": "state",
142
+ "value": "{color.neutral.10}"
143
+ }
121
144
  }
122
145
  },
123
146
  "secondary": {
@@ -126,15 +149,15 @@
126
149
  "$level": "mode",
127
150
  "rest": {
128
151
  "$level": "state",
129
- "value": "{color.dark-alpha.0}"
152
+ "value": "{color.neutral.alpha.dark.0}"
130
153
  },
131
154
  "active": {
132
155
  "$level": "state",
133
- "value": "{color.dark-alpha.10}"
156
+ "value": "{color.neutral.alpha.dark.10}"
134
157
  },
135
158
  "disabled": {
136
159
  "$level": "state",
137
- "value": "{color.dark-alpha.0}"
160
+ "value": "{color.neutral.alpha.dark.0}"
138
161
  },
139
162
  "focus": {
140
163
  "$level": "state",
@@ -142,7 +165,30 @@
142
165
  },
143
166
  "hover": {
144
167
  "$level": "state",
145
- "value": "{color.dark-alpha.10}"
168
+ "value": "{color.neutral.alpha.dark.10}"
169
+ }
170
+ },
171
+ "on-knockout": {
172
+ "$level": "mode",
173
+ "rest": {
174
+ "$level": "state",
175
+ "value": "{color.neutral.alpha.light.0}"
176
+ },
177
+ "active": {
178
+ "$level": "state",
179
+ "value": "{color.neutral.alpha.light.10}"
180
+ },
181
+ "disabled": {
182
+ "$level": "state",
183
+ "value": "{color.neutral.alpha.light.0}"
184
+ },
185
+ "focus": {
186
+ "$level": "state",
187
+ "value": "{color.neutral.90}"
188
+ },
189
+ "hover": {
190
+ "$level": "state",
191
+ "value": "{color.neutral.alpha.light.10}"
146
192
  }
147
193
  }
148
194
  },
@@ -170,6 +216,29 @@
170
216
  "$level": "state",
171
217
  "value": "{color.neutral.20}"
172
218
  }
219
+ },
220
+ "on-knockout": {
221
+ "$level": "mode",
222
+ "rest": {
223
+ "$level": "state",
224
+ "value": "{color.neutral.80}"
225
+ },
226
+ "active": {
227
+ "$level": "state",
228
+ "value": "{color.neutral.70}"
229
+ },
230
+ "disabled": {
231
+ "$level": "state",
232
+ "value": "{color.neutral.80}"
233
+ },
234
+ "focus": {
235
+ "$level": "state",
236
+ "value": "{color.neutral.70}"
237
+ },
238
+ "hover": {
239
+ "$level": "state",
240
+ "value": "{color.neutral.70}"
241
+ }
173
242
  }
174
243
  },
175
244
  "destructive": {
@@ -196,6 +265,29 @@
196
265
  "$level": "state",
197
266
  "value": "{color.red.60}"
198
267
  }
268
+ },
269
+ "on-knockout": {
270
+ "$level": "mode",
271
+ "rest": {
272
+ "$level": "state",
273
+ "value": "{color.red.30}"
274
+ },
275
+ "active": {
276
+ "$level": "state",
277
+ "value": "{color.red.40}"
278
+ },
279
+ "disabled": {
280
+ "$level": "state",
281
+ "value": "{color.red.50}"
282
+ },
283
+ "focus": {
284
+ "$level": "state",
285
+ "value": "{color.red.30}"
286
+ },
287
+ "hover": {
288
+ "$level": "state",
289
+ "value": "{color.red.40}"
290
+ }
199
291
  }
200
292
  }
201
293
  },
@@ -225,6 +317,29 @@
225
317
  "$level": "state",
226
318
  "value": "{color.neutral.80}"
227
319
  }
320
+ },
321
+ "on-knockout": {
322
+ "$level": "mode",
323
+ "rest": {
324
+ "$level": "state",
325
+ "value": "{color.neutral.0}"
326
+ },
327
+ "active": {
328
+ "$level": "state",
329
+ "value": "{color.neutral.10}"
330
+ },
331
+ "disabled": {
332
+ "$level": "state",
333
+ "value": "{color.neutral.10}"
334
+ },
335
+ "focus": {
336
+ "$level": "state",
337
+ "value": "{color.neutral.0}"
338
+ },
339
+ "hover": {
340
+ "$level": "state",
341
+ "value": "{color.neutral.10}"
342
+ }
228
343
  }
229
344
  },
230
345
  "secondary": {
@@ -251,6 +366,29 @@
251
366
  "$level": "state",
252
367
  "value": "{color.neutral.90}"
253
368
  }
369
+ },
370
+ "on-knockout": {
371
+ "$level": "mode",
372
+ "rest": {
373
+ "$level": "state",
374
+ "value": "{color.neutral.0}"
375
+ },
376
+ "active": {
377
+ "$level": "state",
378
+ "value": "{color.neutral.0}"
379
+ },
380
+ "disabled": {
381
+ "$level": "state",
382
+ "value": "{color.neutral.50}"
383
+ },
384
+ "focus": {
385
+ "$level": "state",
386
+ "value": "{color.neutral.0}"
387
+ },
388
+ "hover": {
389
+ "$level": "state",
390
+ "value": "{color.neutral.0}"
391
+ }
254
392
  }
255
393
  },
256
394
  "tertiary": {
@@ -277,6 +415,29 @@
277
415
  "$level": "state",
278
416
  "value": "{color.neutral.20}"
279
417
  }
418
+ },
419
+ "on-knockout": {
420
+ "$level": "mode",
421
+ "rest": {
422
+ "$level": "state",
423
+ "value": "{color.neutral.80}"
424
+ },
425
+ "active": {
426
+ "$level": "state",
427
+ "value": "{color.neutral.70}"
428
+ },
429
+ "disabled": {
430
+ "$level": "state",
431
+ "value": "{color.neutral.80}"
432
+ },
433
+ "focus": {
434
+ "$level": "state",
435
+ "value": "{color.neutral.70}"
436
+ },
437
+ "hover": {
438
+ "$level": "state",
439
+ "value": "{color.neutral.70}"
440
+ }
280
441
  }
281
442
  },
282
443
  "destructive": {
@@ -303,6 +464,29 @@
303
464
  "$level": "state",
304
465
  "value": "{color.red.60}"
305
466
  }
467
+ },
468
+ "on-knockout": {
469
+ "$level": "mode",
470
+ "rest": {
471
+ "$level": "state",
472
+ "value": "{color.red.30}"
473
+ },
474
+ "active": {
475
+ "$level": "state",
476
+ "value": "{color.red.40}"
477
+ },
478
+ "disabled": {
479
+ "$level": "state",
480
+ "value": "{color.red.50}"
481
+ },
482
+ "focus": {
483
+ "$level": "state",
484
+ "value": "{color.red.30}"
485
+ },
486
+ "hover": {
487
+ "$level": "state",
488
+ "value": "{color.red.40}"
489
+ }
306
490
  }
307
491
  }
308
492
  },
@@ -332,6 +516,29 @@
332
516
  "$level": "state",
333
517
  "value": "{color.neutral.10}"
334
518
  }
519
+ },
520
+ "on-knockout": {
521
+ "$level": "mode",
522
+ "rest": {
523
+ "$level": "state",
524
+ "value": "{color.neutral.90}"
525
+ },
526
+ "active": {
527
+ "$level": "state",
528
+ "value": "{color.neutral.90}"
529
+ },
530
+ "disabled": {
531
+ "$level": "state",
532
+ "value": "{color.neutral.50}"
533
+ },
534
+ "focus": {
535
+ "$level": "state",
536
+ "value": "{color.neutral.90}"
537
+ },
538
+ "hover": {
539
+ "$level": "state",
540
+ "value": "{color.neutral.90}"
541
+ }
335
542
  }
336
543
  },
337
544
  "secondary": {
@@ -358,6 +565,29 @@
358
565
  "$level": "state",
359
566
  "value": "{color.neutral.90}"
360
567
  }
568
+ },
569
+ "on-knockout": {
570
+ "$level": "mode",
571
+ "rest": {
572
+ "$level": "state",
573
+ "value": "{color.neutral.0}"
574
+ },
575
+ "active": {
576
+ "$level": "state",
577
+ "value": "{color.neutral.0}"
578
+ },
579
+ "disabled": {
580
+ "$level": "state",
581
+ "value": "{color.neutral.50}"
582
+ },
583
+ "focus": {
584
+ "$level": "state",
585
+ "value": "{color.neutral.0}"
586
+ },
587
+ "hover": {
588
+ "$level": "state",
589
+ "value": "{color.neutral.0}"
590
+ }
361
591
  }
362
592
  },
363
593
  "tertiary": {
@@ -384,6 +614,29 @@
384
614
  "$level": "state",
385
615
  "value": "{color.neutral.90}"
386
616
  }
617
+ },
618
+ "on-knockout": {
619
+ "$level": "mode",
620
+ "rest": {
621
+ "$level": "state",
622
+ "value": "{color.neutral.0}"
623
+ },
624
+ "active": {
625
+ "$level": "state",
626
+ "value": "{color.neutral.0}"
627
+ },
628
+ "disabled": {
629
+ "$level": "state",
630
+ "value": "{color.neutral.50}"
631
+ },
632
+ "focus": {
633
+ "$level": "state",
634
+ "value": "{color.neutral.0}"
635
+ },
636
+ "hover": {
637
+ "$level": "state",
638
+ "value": "{color.neutral.0}"
639
+ }
387
640
  }
388
641
  },
389
642
  "destructive": {
@@ -410,6 +663,29 @@
410
663
  "$level": "state",
411
664
  "value": "{color.red.10}"
412
665
  }
666
+ },
667
+ "on-knockout": {
668
+ "$level": "mode",
669
+ "rest": {
670
+ "$level": "state",
671
+ "value": "{color.red.90}"
672
+ },
673
+ "active": {
674
+ "$level": "state",
675
+ "value": "{color.red.90}"
676
+ },
677
+ "disabled": {
678
+ "$level": "state",
679
+ "value": "{color.red.70}"
680
+ },
681
+ "focus": {
682
+ "$level": "state",
683
+ "value": "{color.red.90}"
684
+ },
685
+ "hover": {
686
+ "$level": "state",
687
+ "value": "{color.red.90}"
688
+ }
413
689
  }
414
690
  }
415
691
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@withlayers/components.button",
3
- "version": "0.6.0",
3
+ "version": "0.7.0",
4
4
  "description": "Button component",
5
5
  "license": "MIT",
6
6
  "author": "Dmitry Mayorov",
@@ -21,8 +21,8 @@
21
21
  "lint:css:fix": "stylelint \"src/**/*.css\" --fix"
22
22
  },
23
23
  "dependencies": {
24
- "@withlayers/mixins": "0.13.2",
25
- "@withlayers/tokens": "0.20.0"
24
+ "@withlayers/mixins": "0.14.0",
25
+ "@withlayers/tokens": "0.21.0"
26
26
  },
27
27
  "devDependencies": {
28
28
  "clsx": "^2.1.1",