@withlayers/tokens 0.8.1 → 0.9.1

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/index.css +147 -1
  2. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -316,6 +316,33 @@
316
316
  --l--theme--button--color--content--destructive--on-default--disabled: var(--l--color--red--20);
317
317
  --l--theme--button--color--content--destructive--on-default--focus: var(--l--color--red--10);
318
318
  --l--theme--button--color--content--destructive--on-default--hover: var(--l--color--red--10);
319
+ --l--theme--checkbox-control--border--style: var(--l--border--style--solid);
320
+ --l--theme--checkbox-control--color--background--on-default--checked: var(--l--color--neutral--90);
321
+ --l--theme--checkbox-control--color--background--on-default--disabled: var(--l--color--neutral--20);
322
+ --l--theme--checkbox-control--color--background--on-default--disabled-checked: var(--l--color--neutral--20);
323
+ --l--theme--checkbox-control--color--background--on-default--focus-checked: var(--l--color--neutral--90);
324
+ --l--theme--checkbox-control--color--background--on-default--hover: var(--l--color--neutral--10);
325
+ --l--theme--checkbox-control--color--background--on-default--hover-checked: var(--l--color--neutral--80);
326
+ --l--theme--checkbox-control--color--background--on-default--invalid: var(--l--color--red--20);
327
+ --l--theme--checkbox-control--color--background--on-default--invalid-checked: var(--l--color--red--70);
328
+ --l--theme--checkbox-control--color--border--on-default--checked: var(--l--color--neutral--90);
329
+ --l--theme--checkbox-control--color--border--on-default--disabled: var(--l--color--neutral--30);
330
+ --l--theme--checkbox-control--color--border--on-default--disabled-checked: var(--l--color--neutral--30);
331
+ --l--theme--checkbox-control--color--border--on-default--focus-checked: var(--l--color--neutral--90);
332
+ --l--theme--checkbox-control--color--border--on-default--hover-checked: var(--l--color--neutral--90);
333
+ --l--theme--checkbox-control--color--border--on-default--invalid: var(--l--color--red--70);
334
+ --l--theme--checkbox-control--color--border--on-default--invalid-checked: var(--l--color--red--70);
335
+ --l--theme--checkbox-control--color--content--on-default--rest: var(--l--color--light-alpha--0);
336
+ --l--theme--checkbox-control--color--content--on-default--checked: var(--l--color--neutral--10);
337
+ --l--theme--checkbox-control--color--content--on-default--disabled: var(--l--color--light-alpha--0);
338
+ --l--theme--checkbox-control--color--content--on-default--disabled-checked: var(--l--color--neutral--40);
339
+ --l--theme--checkbox-control--color--content--on-default--focus: var(--l--color--light-alpha--0);
340
+ --l--theme--checkbox-control--color--content--on-default--focus-checked: var(--l--color--neutral--10);
341
+ --l--theme--checkbox-control--color--content--on-default--hover: var(--l--color--light-alpha--0);
342
+ --l--theme--checkbox-control--color--content--on-default--hover-checked: var(--l--color--neutral--10);
343
+ --l--theme--checkbox-control--color--content--on-default--invalid: var(--l--color--light-alpha--0);
344
+ --l--theme--checkbox-control--color--content--on-default--invalid-checked: var(--l--color--neutral--0);
345
+ --l--theme--checkbox-control--size: clamp(1.3125rem, 0.27778vw + 1.2500rem, var(--l--units--24));
319
346
  --l--theme--dialog--border--style: var(--l--border--style--none);
320
347
  --l--theme--dialog--measure: var(--l--theme--measure--md);
321
348
  --l--theme--focus-ring--color--outline--on-default: var(--l--color--neutral--100);
@@ -332,8 +359,65 @@
332
359
  --l--theme--link--color--content--secondary--on-default--focus: var(--l--color--neutral--90);
333
360
  --l--theme--link--color--content--secondary--on-default--active: var(--l--color--neutral--90);
334
361
  --l--theme--link--color--content--secondary--on-default--visited: var(--l--color--neutral--90);
362
+ --l--theme--radio-button-control--border--style: var(--l--border--style--solid);
363
+ --l--theme--radio-button-control--color--background--on-default--checked: var(--l--color--neutral--90);
364
+ --l--theme--radio-button-control--color--background--on-default--disabled: var(--l--color--neutral--20);
365
+ --l--theme--radio-button-control--color--background--on-default--disabled-checked: var(--l--color--neutral--20);
366
+ --l--theme--radio-button-control--color--background--on-default--focus-checked: var(--l--color--neutral--90);
367
+ --l--theme--radio-button-control--color--background--on-default--hover: var(--l--color--neutral--10);
368
+ --l--theme--radio-button-control--color--background--on-default--hover-checked: var(--l--color--neutral--80);
369
+ --l--theme--radio-button-control--color--border--on-default--checked: var(--l--color--neutral--90);
370
+ --l--theme--radio-button-control--color--border--on-default--disabled: var(--l--color--neutral--30);
371
+ --l--theme--radio-button-control--color--border--on-default--disabled-checked: var(--l--color--neutral--30);
372
+ --l--theme--radio-button-control--color--border--on-default--focus-checked: var(--l--color--neutral--90);
373
+ --l--theme--radio-button-control--color--border--on-default--hover-checked: var(--l--color--neutral--90);
374
+ --l--theme--radio-button-control--color--content--on-default--rest: var(--l--color--light-alpha--0);
375
+ --l--theme--radio-button-control--color--content--on-default--checked: var(--l--color--neutral--10);
376
+ --l--theme--radio-button-control--color--content--on-default--disabled: var(--l--color--light-alpha--0);
377
+ --l--theme--radio-button-control--color--content--on-default--disabled-checked: var(--l--color--neutral--40);
378
+ --l--theme--radio-button-control--color--content--on-default--focus: var(--l--color--light-alpha--0);
379
+ --l--theme--radio-button-control--color--content--on-default--focus-checked: var(--l--color--neutral--10);
380
+ --l--theme--radio-button-control--color--content--on-default--hover: var(--l--color--light-alpha--0);
381
+ --l--theme--radio-button-control--color--content--on-default--hover-checked: var(--l--color--neutral--10);
382
+ --l--theme--radio-button-control--size: clamp(1.3125rem, 0.27778vw + 1.2500rem, var(--l--units--24));
335
383
  --l--theme--selection--color--background--on-default: var(--l--color--neutral--90);
336
384
  --l--theme--selection--color--content--on-default: var(--l--color--neutral--10);
385
+ --l--theme--text-control--border--style: var(--l--border--style--solid);
386
+ --l--theme--text-control--typography--font-family--xs: var(--l--typography--font-family--sans-serif);
387
+ --l--theme--text-control--typography--font-family--sm: var(--l--typography--font-family--sans-serif);
388
+ --l--theme--text-control--typography--font-family--md: var(--l--typography--font-family--sans-serif);
389
+ --l--theme--text-control--typography--font-family--lg: var(--l--typography--font-family--sans-serif);
390
+ --l--theme--text-control--typography--font-size--xs: clamp(var(--l--typography--font-size--12), 0.18519vw + 0.70833rem, var(--l--typography--font-size--14));
391
+ --l--theme--text-control--typography--font-size--sm: clamp(var(--l--typography--font-size--12), 0.18519vw + 0.70833rem, var(--l--typography--font-size--14));
392
+ --l--theme--text-control--typography--font-size--md: clamp(var(--l--typography--font-size--14), 0.18519vw + 0.83333rem, var(--l--typography--font-size--16));
393
+ --l--theme--text-control--typography--font-size--lg: clamp(var(--l--typography--font-size--16), 0.18519vw + 0.95833rem, var(--l--typography--font-size--18));
394
+ --l--theme--text-control--typography--font-style--xs: var(--l--typography--font-style--normal);
395
+ --l--theme--text-control--typography--font-style--sm: var(--l--typography--font-style--normal);
396
+ --l--theme--text-control--typography--font-style--md: var(--l--typography--font-style--normal);
397
+ --l--theme--text-control--typography--font-style--lg: var(--l--typography--font-style--normal);
398
+ --l--theme--text-control--typography--font-variant-caps--xs: var(--l--typography--font-variant-caps--normal);
399
+ --l--theme--text-control--typography--font-variant-caps--sm: var(--l--typography--font-variant-caps--normal);
400
+ --l--theme--text-control--typography--font-variant-caps--md: var(--l--typography--font-variant-caps--normal);
401
+ --l--theme--text-control--typography--font-variant-caps--lg: var(--l--typography--font-variant-caps--normal);
402
+ --l--theme--text-control--typography--font-weight--xs: var(--l--typography--font-weight--medium);
403
+ --l--theme--text-control--typography--font-weight--sm: var(--l--typography--font-weight--medium);
404
+ --l--theme--text-control--typography--font-weight--md: var(--l--typography--font-weight--medium);
405
+ --l--theme--text-control--typography--font-weight--lg: var(--l--typography--font-weight--medium);
406
+ --l--theme--text-control--typography--letter-spacing--xs: var(--l--typography--letter-spacing--normal);
407
+ --l--theme--text-control--typography--letter-spacing--sm: var(--l--typography--letter-spacing--normal);
408
+ --l--theme--text-control--typography--letter-spacing--md: var(--l--typography--letter-spacing--normal);
409
+ --l--theme--text-control--typography--letter-spacing--lg: var(--l--typography--letter-spacing--normal);
410
+ --l--theme--text-control--typography--line-height--xs: var(--l--typography--line-height--1250);
411
+ --l--theme--text-control--typography--line-height--sm: var(--l--typography--line-height--1250);
412
+ --l--theme--text-control--typography--line-height--md: var(--l--typography--line-height--1375);
413
+ --l--theme--text-control--typography--line-height--lg: var(--l--typography--line-height--1500);
414
+ --l--theme--text-control--typography--text-transform--xs: var(--l--typography--text-transform--none);
415
+ --l--theme--text-control--typography--text-transform--sm: var(--l--typography--text-transform--none);
416
+ --l--theme--text-control--typography--text-transform--md: var(--l--typography--text-transform--none);
417
+ --l--theme--text-control--typography--text-transform--lg: var(--l--typography--text-transform--none);
418
+ --l--theme--text-control--color--background--on-default--disabled: var(--l--color--neutral--10);
419
+ --l--theme--text-control--color--content--on-default--disabled: var(--l--color--neutral--40);
420
+ --l--theme--text-control--color--placeholder--on-default--disabled: var(--l--color--neutral--40);
337
421
  --l--theme--border--radius--none: var(--l--border--radius--0);
338
422
  --l--theme--border--radius--sm: var(--l--border--radius--2);
339
423
  --l--theme--border--radius--md: var(--l--border--radius--4);
@@ -348,10 +432,11 @@
348
432
  --l--theme--border--width--xl: var(--l--border--width--8);
349
433
  --l--theme--border--width--xxl: var(--l--border--width--16);
350
434
  --l--theme--color--background--default: var(--l--color--neutral--0);
351
- --l--theme--color--border--primary--on-default: var(--l--color--neutral--30);
435
+ --l--theme--color--border--primary--on-default: var(--l--color--neutral--60);
352
436
  --l--theme--color--border--secondary--on-default: var(--l--color--neutral--10);
353
437
  --l--theme--color--content--primary--on-default: var(--l--color--neutral--90);
354
438
  --l--theme--color--content--secondary--on-default: var(--l--color--neutral--60);
439
+ --l--theme--color--content--disabled--on-default: var(--l--color--neutral--40);
355
440
  --l--theme--color--overlay--on-default: var(--l--color--dark-alpha--50);
356
441
  --l--theme--color--code--background--on-default: var(--l--color--neutral--10);
357
442
  --l--theme--color--code--content--on-default: var(--l--color--neutral--90);
@@ -461,6 +546,14 @@
461
546
  --l--theme--typography--heading--text-transform--l4: var(--l--typography--text-transform--none);
462
547
  --l--theme--typography--heading--text-transform--l5: var(--l--typography--text-transform--none);
463
548
  --l--theme--typography--heading--text-transform--l6: var(--l--typography--text-transform--none);
549
+ --l--theme--typography--label--font-family: var(--l--typography--font-family--sans-serif);
550
+ --l--theme--typography--label--font-size: clamp(var(--l--typography--font-size--14), 0.18519vw + 0.83333rem, var(--l--typography--font-size--16));
551
+ --l--theme--typography--label--font-style: var(--l--typography--font-style--normal);
552
+ --l--theme--typography--label--font-variant-caps: var(--l--typography--font-variant-caps--normal);
553
+ --l--theme--typography--label--font-weight: var(--l--typography--font-weight--medium);
554
+ --l--theme--typography--label--letter-spacing: var(--l--typography--letter-spacing--normal);
555
+ --l--theme--typography--label--line-height: var(--l--typography--line-height--1500);
556
+ --l--theme--typography--label--text-transform: var(--l--typography--text-transform--none);
464
557
  --l--theme--typography--overline--font-family: var(--l--typography--font-family--sans-serif);
465
558
  --l--theme--typography--overline--font-size: clamp(var(--l--typography--font-size--12), 0.18519vw + 0.70833rem, var(--l--typography--font-size--14));
466
559
  --l--theme--typography--overline--font-style: var(--l--typography--font-style--normal);
@@ -477,6 +570,18 @@
477
570
  --l--theme--typography--subhead--letter-spacing: var(--l--typography--letter-spacing--normal);
478
571
  --l--theme--typography--subhead--line-height: var(--l--typography--line-height--1500);
479
572
  --l--theme--typography--subhead--text-transform: var(--l--typography--text-transform--none);
573
+ --l--theme--size--10: clamp(var(--l--units--1), 0.092593vw + 0.041667rem, var(--l--units--2));
574
+ --l--theme--size--20: clamp(var(--l--units--2), 0.18519vw + 0.083333rem, var(--l--units--4));
575
+ --l--theme--size--30: clamp(var(--l--units--4), 0.37037vw + 0.16667rem, var(--l--units--8));
576
+ --l--theme--size--40: clamp(var(--l--units--8), 0.37037vw + 0.41667rem, var(--l--units--12));
577
+ --l--theme--size--50: clamp(var(--l--units--12), 0.37037vw + 0.66667rem, var(--l--units--16));
578
+ --l--theme--size--60: clamp(var(--l--units--16), 0.74074vw + 0.83333rem, var(--l--units--24));
579
+ --l--theme--size--70: clamp(var(--l--units--24), 0.74074vw + 1.3333rem, var(--l--units--32));
580
+ --l--theme--size--80: clamp(var(--l--units--32), 1.4815vw + 1.6667rem, var(--l--units--48));
581
+ --l--theme--size--90: clamp(var(--l--units--48), 1.4815vw + 2.6667rem, var(--l--units--64));
582
+ --l--theme--size--100: clamp(var(--l--units--64), 2.9630vw + 3.3333rem, var(--l--units--96));
583
+ --l--theme--size--110: clamp(var(--l--units--96), 2.9630vw + 5.3333rem, var(--l--units--128));
584
+ --l--theme--size--120: clamp(var(--l--units--128), 5.9259vw + 6.6667rem, var(--l--units--192));
480
585
  --l--theme--space--10: clamp(var(--l--units--1), 0.092593vw + 0.041667rem, var(--l--units--2));
481
586
  --l--theme--space--20: clamp(var(--l--units--2), 0.18519vw + 0.083333rem, var(--l--units--4));
482
587
  --l--theme--space--30: clamp(var(--l--units--4), 0.37037vw + 0.16667rem, var(--l--units--8));
@@ -505,6 +610,13 @@
505
610
  --l--theme--button--space--inner--inline--sm: var(--l--theme--space--50);
506
611
  --l--theme--button--space--inner--inline--md: var(--l--theme--space--60);
507
612
  --l--theme--button--space--inner--inline--lg: var(--l--theme--space--70);
613
+ --l--theme--checkbox-control--border--width: var(--l--theme--border--width--sm);
614
+ --l--theme--checkbox-control--border--radius: var(--l--theme--border--radius--md);
615
+ --l--theme--checkbox-control--color--background--on-default--rest: var(--l--theme--color--background--default);
616
+ --l--theme--checkbox-control--color--background--on-default--focus: var(--l--theme--color--background--default);
617
+ --l--theme--checkbox-control--color--border--on-default--rest: var(--l--theme--color--border--primary--on-default);
618
+ --l--theme--checkbox-control--color--border--on-default--focus: var(--l--theme--color--border--primary--on-default);
619
+ --l--theme--checkbox-control--color--border--on-default--hover: var(--l--theme--color--border--primary--on-default);
508
620
  --l--theme--dialog--border--radius: var(--l--theme--border--radius--md);
509
621
  --l--theme--dialog--border--width: var(--l--theme--border--width--sm);
510
622
  --l--theme--dialog--color--background: var(--l--theme--color--background--default);
@@ -512,6 +624,40 @@
512
624
  --l--theme--dialog--color--content: var(--l--theme--color--content--primary--on-default);
513
625
  --l--theme--dialog--color--overlay: var(--l--theme--color--overlay--on-default);
514
626
  --l--theme--media--border--radius: var(--l--theme--border--radius--md);
627
+ --l--theme--radio-button-control--border--width: var(--l--theme--border--width--sm);
628
+ --l--theme--radio-button-control--border--radius: var(--l--theme--border--radius--full);
629
+ --l--theme--radio-button-control--color--background--on-default--rest: var(--l--theme--color--background--default);
630
+ --l--theme--radio-button-control--color--background--on-default--focus: var(--l--theme--color--background--default);
631
+ --l--theme--radio-button-control--color--border--on-default--rest: var(--l--theme--color--border--primary--on-default);
632
+ --l--theme--radio-button-control--color--border--on-default--focus: var(--l--theme--color--border--primary--on-default);
633
+ --l--theme--radio-button-control--color--border--on-default--hover: var(--l--theme--color--border--primary--on-default);
634
+ --l--theme--text-control--border--width--xs: var(--l--theme--border--width--sm);
635
+ --l--theme--text-control--border--width--sm: var(--l--theme--border--width--sm);
636
+ --l--theme--text-control--border--width--md: var(--l--theme--border--width--sm);
637
+ --l--theme--text-control--border--width--lg: var(--l--theme--border--width--sm);
638
+ --l--theme--text-control--border--radius--xs: var(--l--theme--border--radius--md);
639
+ --l--theme--text-control--border--radius--sm: var(--l--theme--border--radius--md);
640
+ --l--theme--text-control--border--radius--md: var(--l--theme--border--radius--md);
641
+ --l--theme--text-control--border--radius--lg: var(--l--theme--border--radius--md);
642
+ --l--theme--text-control--space--inner--block--xs: var(--l--theme--space--20);
643
+ --l--theme--text-control--space--inner--block--sm: var(--l--theme--space--30);
644
+ --l--theme--text-control--space--inner--block--md: var(--l--theme--space--40);
645
+ --l--theme--text-control--space--inner--block--lg: var(--l--theme--space--50);
646
+ --l--theme--text-control--space--inner--inline--xs: var(--l--theme--space--30);
647
+ --l--theme--text-control--space--inner--inline--sm: var(--l--theme--space--40);
648
+ --l--theme--text-control--space--inner--inline--md: var(--l--theme--space--50);
649
+ --l--theme--text-control--space--inner--inline--lg: var(--l--theme--space--60);
650
+ --l--theme--text-control--color--background--on-default--rest: var(--l--theme--color--background--default);
651
+ --l--theme--text-control--color--background--on-default--focus: var(--l--theme--color--background--default);
652
+ --l--theme--text-control--color--background--on-default--hover: var(--l--theme--color--background--default);
653
+ --l--theme--text-control--color--border--on-default--rest: var(--l--theme--color--border--primary--on-default);
654
+ --l--theme--text-control--color--border--on-default--disabled: var(--l--theme--color--border--primary--on-default);
655
+ --l--theme--text-control--color--border--on-default--focus: var(--l--theme--color--border--primary--on-default);
656
+ --l--theme--text-control--color--border--on-default--hover: var(--l--theme--color--border--primary--on-default);
657
+ --l--theme--text-control--color--content--on-default--rest: var(--l--theme--color--content--primary--on-default);
658
+ --l--theme--text-control--color--content--on-default--focus: var(--l--theme--color--content--primary--on-default);
659
+ --l--theme--text-control--color--content--on-default--hover: var(--l--theme--color--content--primary--on-default);
660
+ --l--theme--text-control--color--placeholder--on-default--rest: var(--l--theme--color--content--secondary--on-default);
515
661
  --l--theme--space--gutter: var(--l--theme--space--70);
516
662
  --l--theme--dialog--space--inner--inline: var(--l--theme--space--gutter);
517
663
  --l--theme--dialog--space--inner--block: var(--l--theme--space--gutter);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@withlayers/tokens",
3
- "version": "0.8.1",
3
+ "version": "0.9.1",
4
4
  "description": "Design tokens layer",
5
5
  "license": "MIT",
6
6
  "author": "Dmitry Mayorov",