@wix/design-system-tokens 1.3.7 → 1.3.9

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 (5) hide show
  1. package/all.st.css +60 -4
  2. package/component.st.css +60 -4
  3. package/package.json +4 -3
  4. package/studio/all.st.css +60 -4
  5. package/studio/component.st.css +60 -4
package/all.st.css CHANGED
@@ -27,7 +27,7 @@
27
27
  @property st-global(--wds-border-width-100);
28
28
  @property st-global(--wds-border-width-200);
29
29
  @property st-global(--wds-border-width-none);
30
- @property st-global(--wds-breadcrumbs-border);
30
+ @property st-global(--wds-breadcrumbs-border-radius);
31
31
  @property st-global(--wds-breadcrumbs-on-dark-fill-hover);
32
32
  @property st-global(--wds-breadcrumbs-on-grey-fill-hover);
33
33
  @property st-global(--wds-breadcrumbs-on-white-fill-hover);
@@ -458,6 +458,26 @@
458
458
  @property st-global(--wds-color-yellow-400);
459
459
  @property st-global(--wds-color-yellow-500);
460
460
  @property st-global(--wds-color-yellow-600);
461
+ @property st-global(--wds-composer-sidebar-bottom-width);
462
+ @property st-global(--wds-composer-sidebar-end-max-width);
463
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-large);
464
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-medium);
465
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-small);
466
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-large);
467
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-medium);
468
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-small);
469
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-large);
470
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-medium);
471
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-small);
472
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-large);
473
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-medium);
474
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-small);
475
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-large);
476
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-medium);
477
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-small);
478
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-large);
479
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-medium);
480
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-small);
461
481
  @property st-global(--wds-counter-badge-border-radius-medium);
462
482
  @property st-global(--wds-counter-badge-border-radius-small);
463
483
  @property st-global(--wds-counter-badge-padding-horizontal-medium);
@@ -565,11 +585,11 @@
565
585
  @property st-global(--wds-input-border-radius-default-large);
566
586
  @property st-global(--wds-input-border-radius-default-medium);
567
587
  @property st-global(--wds-input-border-radius-default-small);
588
+ @property st-global(--wds-input-border-radius-default-tiny);
568
589
  @property st-global(--wds-input-border-radius-round-large);
569
590
  @property st-global(--wds-input-border-radius-round-medium);
570
591
  @property st-global(--wds-input-border-radius-round-small);
571
592
  @property st-global(--wds-input-border-radius-round-tiny);
572
- @property st-global(--wds-input-borderdefault-tiny);
573
593
  @property st-global(--wds-input-padding-horizontal-large);
574
594
  @property st-global(--wds-input-padding-horizontal-medium);
575
595
  @property st-global(--wds-input-padding-horizontal-small);
@@ -772,6 +792,8 @@
772
792
  @property st-global(--wds-space-1600);
773
793
  @property st-global(--wds-space-1700);
774
794
  @property st-global(--wds-space-2400);
795
+ @property st-global(--wds-stepper-prefix-size-circle);
796
+ @property st-global(--wds-stepper-prefix-size-number);
775
797
  @property st-global(--wds-swatches-list-gap);
776
798
  @property st-global(--wds-swatches-list-padding-horizontal);
777
799
  @property st-global(--wds-swatches-list-padding-vertical);
@@ -782,6 +804,12 @@
782
804
  @property st-global(--wds-swatches-swatch-size-large);
783
805
  @property st-global(--wds-swatches-swatch-size-medium);
784
806
  @property st-global(--wds-swatches-swatch-size-small);
807
+ @property st-global(--wds-tabs-gap-medium);
808
+ @property st-global(--wds-tabs-gap-small);
809
+ @property st-global(--wds-tabs-padding-horizontal-medium);
810
+ @property st-global(--wds-tabs-padding-horizontal-small);
811
+ @property st-global(--wds-tabs-padding-vertical-medium);
812
+ @property st-global(--wds-tabs-padding-vertical-small);
785
813
  @property st-global(--wds-tag-border-radius-large);
786
814
  @property st-global(--wds-tag-border-radius-medium);
787
815
  @property st-global(--wds-tag-border-radius-small);
@@ -947,7 +975,7 @@
947
975
  --wds-border-width-100: 1px;
948
976
  --wds-border-width-200: 2px;
949
977
  --wds-border-width-none: 0;
950
- --wds-breadcrumbs-border: 1000px;
978
+ --wds-breadcrumbs-border-radius: 1000px;
951
979
  --wds-breadcrumbs-on-dark-fill-hover: rgba(255, 255, 255, .3);
952
980
  --wds-breadcrumbs-on-grey-fill-hover: #ffffff;
953
981
  --wds-breadcrumbs-on-white-fill-hover: #e7f0ff;
@@ -1378,6 +1406,26 @@
1378
1406
  --wds-color-yellow-400: #ffe2a5;
1379
1407
  --wds-color-yellow-500: #fff0d1;
1380
1408
  --wds-color-yellow-600: #fff6e5;
1409
+ --wds-composer-sidebar-bottom-width: 90px;
1410
+ --wds-composer-sidebar-end-max-width: 240px;
1411
+ --wds-composer-sidebar-item-bottom-padding-horizontal-large: 6px;
1412
+ --wds-composer-sidebar-item-bottom-padding-horizontal-medium: 6px;
1413
+ --wds-composer-sidebar-item-bottom-padding-horizontal-small: 6px;
1414
+ --wds-composer-sidebar-item-bottom-padding-vertical-large: 12px;
1415
+ --wds-composer-sidebar-item-bottom-padding-vertical-medium: 12px;
1416
+ --wds-composer-sidebar-item-bottom-padding-vertical-small: 6px;
1417
+ --wds-composer-sidebar-item-end-padding-horizontal-large: 15px;
1418
+ --wds-composer-sidebar-item-end-padding-horizontal-medium: 15px;
1419
+ --wds-composer-sidebar-item-end-padding-horizontal-small: 15px;
1420
+ --wds-composer-sidebar-item-end-padding-vertical-large: 9px;
1421
+ --wds-composer-sidebar-item-end-padding-vertical-medium: 9px;
1422
+ --wds-composer-sidebar-item-end-padding-vertical-small: 6px;
1423
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-large: 12px;
1424
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-medium: 12px;
1425
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-small: 12px;
1426
+ --wds-composer-sidebar-item-tooltip-padding-vertical-large: 12px;
1427
+ --wds-composer-sidebar-item-tooltip-padding-vertical-medium: 12px;
1428
+ --wds-composer-sidebar-item-tooltip-padding-vertical-small: 6px;
1381
1429
  --wds-counter-badge-border-radius-medium: 1000px;
1382
1430
  --wds-counter-badge-border-radius-small: 1000px;
1383
1431
  --wds-counter-badge-padding-horizontal-medium: 9px;
@@ -1485,11 +1533,11 @@
1485
1533
  --wds-input-border-radius-default-large: 6px;
1486
1534
  --wds-input-border-radius-default-medium: 6px;
1487
1535
  --wds-input-border-radius-default-small: 6px;
1536
+ --wds-input-border-radius-default-tiny: 6px;
1488
1537
  --wds-input-border-radius-round-large: 1000px;
1489
1538
  --wds-input-border-radius-round-medium: 1000px;
1490
1539
  --wds-input-border-radius-round-small: 1000px;
1491
1540
  --wds-input-border-radius-round-tiny: 1000px;
1492
- --wds-input-borderdefault-tiny: 6px;
1493
1541
  --wds-input-padding-horizontal-large: 9px;
1494
1542
  --wds-input-padding-horizontal-medium: 6px;
1495
1543
  --wds-input-padding-horizontal-small: 6px;
@@ -1692,6 +1740,8 @@
1692
1740
  --wds-space-1600: 96px;
1693
1741
  --wds-space-1700: 102px;
1694
1742
  --wds-space-2400: 144px;
1743
+ --wds-stepper-prefix-size-circle: 30px;
1744
+ --wds-stepper-prefix-size-number: 24px;
1695
1745
  --wds-swatches-list-gap: 12px;
1696
1746
  --wds-swatches-list-padding-horizontal: 18px;
1697
1747
  --wds-swatches-list-padding-vertical: 12px;
@@ -1702,6 +1752,12 @@
1702
1752
  --wds-swatches-swatch-size-large: 30px;
1703
1753
  --wds-swatches-swatch-size-medium: 24px;
1704
1754
  --wds-swatches-swatch-size-small: 18px;
1755
+ --wds-tabs-gap-medium: 6px;
1756
+ --wds-tabs-gap-small: 6px;
1757
+ --wds-tabs-padding-horizontal-medium: 18px;
1758
+ --wds-tabs-padding-horizontal-small: 12px;
1759
+ --wds-tabs-padding-vertical-medium: 18px;
1760
+ --wds-tabs-padding-vertical-small: 12px;
1705
1761
  --wds-tag-border-radius-large: 1000px;
1706
1762
  --wds-tag-border-radius-medium: 1000px;
1707
1763
  --wds-tag-border-radius-small: 1000px;
package/component.st.css CHANGED
@@ -16,7 +16,7 @@
16
16
  @property st-global(--wds-badge-size-medium);
17
17
  @property st-global(--wds-badge-size-small);
18
18
  @property st-global(--wds-badge-size-tiny);
19
- @property st-global(--wds-breadcrumbs-border);
19
+ @property st-global(--wds-breadcrumbs-border-radius);
20
20
  @property st-global(--wds-breadcrumbs-on-dark-fill-hover);
21
21
  @property st-global(--wds-breadcrumbs-on-grey-fill-hover);
22
22
  @property st-global(--wds-breadcrumbs-on-white-fill-hover);
@@ -83,6 +83,26 @@
83
83
  @property st-global(--wds-circular-progress-bar-size-large);
84
84
  @property st-global(--wds-circular-progress-bar-size-medium);
85
85
  @property st-global(--wds-circular-progress-bar-size-small);
86
+ @property st-global(--wds-composer-sidebar-bottom-width);
87
+ @property st-global(--wds-composer-sidebar-end-max-width);
88
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-large);
89
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-medium);
90
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-small);
91
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-large);
92
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-medium);
93
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-small);
94
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-large);
95
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-medium);
96
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-small);
97
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-large);
98
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-medium);
99
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-small);
100
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-large);
101
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-medium);
102
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-small);
103
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-large);
104
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-medium);
105
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-small);
86
106
  @property st-global(--wds-counter-badge-border-radius-medium);
87
107
  @property st-global(--wds-counter-badge-border-radius-small);
88
108
  @property st-global(--wds-counter-badge-padding-horizontal-medium);
@@ -138,11 +158,11 @@
138
158
  @property st-global(--wds-input-border-radius-default-large);
139
159
  @property st-global(--wds-input-border-radius-default-medium);
140
160
  @property st-global(--wds-input-border-radius-default-small);
161
+ @property st-global(--wds-input-border-radius-default-tiny);
141
162
  @property st-global(--wds-input-border-radius-round-large);
142
163
  @property st-global(--wds-input-border-radius-round-medium);
143
164
  @property st-global(--wds-input-border-radius-round-small);
144
165
  @property st-global(--wds-input-border-radius-round-tiny);
145
- @property st-global(--wds-input-borderdefault-tiny);
146
166
  @property st-global(--wds-input-padding-horizontal-large);
147
167
  @property st-global(--wds-input-padding-horizontal-medium);
148
168
  @property st-global(--wds-input-padding-horizontal-small);
@@ -294,6 +314,8 @@
294
314
  @property st-global(--wds-slider-track-border-radius-transparent);
295
315
  @property st-global(--wds-slider-track-size);
296
316
  @property st-global(--wds-slider-track-size-transparent);
317
+ @property st-global(--wds-stepper-prefix-size-circle);
318
+ @property st-global(--wds-stepper-prefix-size-number);
297
319
  @property st-global(--wds-swatches-list-gap);
298
320
  @property st-global(--wds-swatches-list-padding-horizontal);
299
321
  @property st-global(--wds-swatches-list-padding-vertical);
@@ -304,6 +326,12 @@
304
326
  @property st-global(--wds-swatches-swatch-size-large);
305
327
  @property st-global(--wds-swatches-swatch-size-medium);
306
328
  @property st-global(--wds-swatches-swatch-size-small);
329
+ @property st-global(--wds-tabs-gap-medium);
330
+ @property st-global(--wds-tabs-gap-small);
331
+ @property st-global(--wds-tabs-padding-horizontal-medium);
332
+ @property st-global(--wds-tabs-padding-horizontal-small);
333
+ @property st-global(--wds-tabs-padding-vertical-medium);
334
+ @property st-global(--wds-tabs-padding-vertical-small);
307
335
  @property st-global(--wds-tag-border-radius-large);
308
336
  @property st-global(--wds-tag-border-radius-medium);
309
337
  @property st-global(--wds-tag-border-radius-small);
@@ -458,7 +486,7 @@
458
486
  --wds-badge-size-medium: 24px;
459
487
  --wds-badge-size-small: 18px;
460
488
  --wds-badge-size-tiny: 18px;
461
- --wds-breadcrumbs-border: 1000px;
489
+ --wds-breadcrumbs-border-radius: 1000px;
462
490
  --wds-breadcrumbs-on-dark-fill-hover: rgba(255, 255, 255, .3);
463
491
  --wds-breadcrumbs-on-grey-fill-hover: #ffffff;
464
492
  --wds-breadcrumbs-on-white-fill-hover: #e7f0ff;
@@ -525,6 +553,26 @@
525
553
  --wds-circular-progress-bar-size-large: 102px;
526
554
  --wds-circular-progress-bar-size-medium: 54px;
527
555
  --wds-circular-progress-bar-size-small: 30px;
556
+ --wds-composer-sidebar-bottom-width: 90px;
557
+ --wds-composer-sidebar-end-max-width: 240px;
558
+ --wds-composer-sidebar-item-bottom-padding-horizontal-large: 6px;
559
+ --wds-composer-sidebar-item-bottom-padding-horizontal-medium: 6px;
560
+ --wds-composer-sidebar-item-bottom-padding-horizontal-small: 6px;
561
+ --wds-composer-sidebar-item-bottom-padding-vertical-large: 12px;
562
+ --wds-composer-sidebar-item-bottom-padding-vertical-medium: 12px;
563
+ --wds-composer-sidebar-item-bottom-padding-vertical-small: 6px;
564
+ --wds-composer-sidebar-item-end-padding-horizontal-large: 15px;
565
+ --wds-composer-sidebar-item-end-padding-horizontal-medium: 15px;
566
+ --wds-composer-sidebar-item-end-padding-horizontal-small: 15px;
567
+ --wds-composer-sidebar-item-end-padding-vertical-large: 9px;
568
+ --wds-composer-sidebar-item-end-padding-vertical-medium: 9px;
569
+ --wds-composer-sidebar-item-end-padding-vertical-small: 6px;
570
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-large: 12px;
571
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-medium: 12px;
572
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-small: 12px;
573
+ --wds-composer-sidebar-item-tooltip-padding-vertical-large: 12px;
574
+ --wds-composer-sidebar-item-tooltip-padding-vertical-medium: 12px;
575
+ --wds-composer-sidebar-item-tooltip-padding-vertical-small: 6px;
528
576
  --wds-counter-badge-border-radius-medium: 1000px;
529
577
  --wds-counter-badge-border-radius-small: 1000px;
530
578
  --wds-counter-badge-padding-horizontal-medium: 9px;
@@ -580,11 +628,11 @@
580
628
  --wds-input-border-radius-default-large: 6px;
581
629
  --wds-input-border-radius-default-medium: 6px;
582
630
  --wds-input-border-radius-default-small: 6px;
631
+ --wds-input-border-radius-default-tiny: 6px;
583
632
  --wds-input-border-radius-round-large: 1000px;
584
633
  --wds-input-border-radius-round-medium: 1000px;
585
634
  --wds-input-border-radius-round-small: 1000px;
586
635
  --wds-input-border-radius-round-tiny: 1000px;
587
- --wds-input-borderdefault-tiny: 6px;
588
636
  --wds-input-padding-horizontal-large: 9px;
589
637
  --wds-input-padding-horizontal-medium: 6px;
590
638
  --wds-input-padding-horizontal-small: 6px;
@@ -736,6 +784,8 @@
736
784
  --wds-slider-track-border-radius-transparent: 1000px;
737
785
  --wds-slider-track-size: 4px;
738
786
  --wds-slider-track-size-transparent: 8px;
787
+ --wds-stepper-prefix-size-circle: 30px;
788
+ --wds-stepper-prefix-size-number: 24px;
739
789
  --wds-swatches-list-gap: 12px;
740
790
  --wds-swatches-list-padding-horizontal: 18px;
741
791
  --wds-swatches-list-padding-vertical: 12px;
@@ -746,6 +796,12 @@
746
796
  --wds-swatches-swatch-size-large: 30px;
747
797
  --wds-swatches-swatch-size-medium: 24px;
748
798
  --wds-swatches-swatch-size-small: 18px;
799
+ --wds-tabs-gap-medium: 6px;
800
+ --wds-tabs-gap-small: 6px;
801
+ --wds-tabs-padding-horizontal-medium: 18px;
802
+ --wds-tabs-padding-horizontal-small: 12px;
803
+ --wds-tabs-padding-vertical-medium: 18px;
804
+ --wds-tabs-padding-vertical-small: 12px;
749
805
  --wds-tag-border-radius-large: 1000px;
750
806
  --wds-tag-border-radius-medium: 1000px;
751
807
  --wds-tag-border-radius-small: 1000px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/design-system-tokens",
3
- "version": "1.3.7",
3
+ "version": "1.3.9",
4
4
  "packageManager": "yarn@3.5.0",
5
5
  "author": "augustinasv@wix.com",
6
6
  "license": "MIT",
@@ -20,7 +20,8 @@
20
20
  "generate": "ts-node src/generate.ts & yarn run lint",
21
21
  "test": "jest",
22
22
  "test:watch": "jest --watch",
23
- "lint": "yarn run eslint ./src --fix"
23
+ "lint": "yarn run eslint ./src --fix",
24
+ "figma-to-dictionary": "ts-node src/scripts/figma-to-dictionary.ts"
24
25
  },
25
26
  "publishConfig": {
26
27
  "registry": "https://registry.npmjs.org/",
@@ -32,5 +33,5 @@
32
33
  "groupId": "com.wixpress"
33
34
  }
34
35
  },
35
- "falconPackageHash": "503488eb2880b4b8706ed43ea5b38c23397879da92c0e5fff62b9824"
36
+ "falconPackageHash": "bd99b60962492d7abd3ed519274a9006cdb3bec691a464216b87bf5b"
36
37
  }
package/studio/all.st.css CHANGED
@@ -27,7 +27,7 @@
27
27
  @property st-global(--wds-border-width-100);
28
28
  @property st-global(--wds-border-width-200);
29
29
  @property st-global(--wds-border-width-none);
30
- @property st-global(--wds-breadcrumbs-border);
30
+ @property st-global(--wds-breadcrumbs-border-radius);
31
31
  @property st-global(--wds-breadcrumbs-on-dark-fill-hover);
32
32
  @property st-global(--wds-breadcrumbs-on-grey-fill-hover);
33
33
  @property st-global(--wds-breadcrumbs-on-white-fill-hover);
@@ -454,6 +454,26 @@
454
454
  @property st-global(--wds-color-yellow-400);
455
455
  @property st-global(--wds-color-yellow-500);
456
456
  @property st-global(--wds-color-yellow-600);
457
+ @property st-global(--wds-composer-sidebar-bottom-width);
458
+ @property st-global(--wds-composer-sidebar-end-max-width);
459
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-large);
460
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-medium);
461
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-small);
462
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-large);
463
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-medium);
464
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-small);
465
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-large);
466
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-medium);
467
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-small);
468
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-large);
469
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-medium);
470
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-small);
471
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-large);
472
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-medium);
473
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-small);
474
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-large);
475
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-medium);
476
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-small);
457
477
  @property st-global(--wds-counter-badge-border-radius-medium);
458
478
  @property st-global(--wds-counter-badge-border-radius-small);
459
479
  @property st-global(--wds-counter-badge-padding-horizontal-medium);
@@ -561,11 +581,11 @@
561
581
  @property st-global(--wds-input-border-radius-default-large);
562
582
  @property st-global(--wds-input-border-radius-default-medium);
563
583
  @property st-global(--wds-input-border-radius-default-small);
584
+ @property st-global(--wds-input-border-radius-default-tiny);
564
585
  @property st-global(--wds-input-border-radius-round-large);
565
586
  @property st-global(--wds-input-border-radius-round-medium);
566
587
  @property st-global(--wds-input-border-radius-round-small);
567
588
  @property st-global(--wds-input-border-radius-round-tiny);
568
- @property st-global(--wds-input-borderdefault-tiny);
569
589
  @property st-global(--wds-input-padding-horizontal-large);
570
590
  @property st-global(--wds-input-padding-horizontal-medium);
571
591
  @property st-global(--wds-input-padding-horizontal-small);
@@ -745,6 +765,8 @@
745
765
  @property st-global(--wds-space-1600);
746
766
  @property st-global(--wds-space-1700);
747
767
  @property st-global(--wds-space-2400);
768
+ @property st-global(--wds-stepper-prefix-size-circle);
769
+ @property st-global(--wds-stepper-prefix-size-number);
748
770
  @property st-global(--wds-swatches-list-gap);
749
771
  @property st-global(--wds-swatches-list-padding-horizontal);
750
772
  @property st-global(--wds-swatches-list-padding-vertical);
@@ -755,6 +777,12 @@
755
777
  @property st-global(--wds-swatches-swatch-size-large);
756
778
  @property st-global(--wds-swatches-swatch-size-medium);
757
779
  @property st-global(--wds-swatches-swatch-size-small);
780
+ @property st-global(--wds-tabs-gap-medium);
781
+ @property st-global(--wds-tabs-gap-small);
782
+ @property st-global(--wds-tabs-padding-horizontal-medium);
783
+ @property st-global(--wds-tabs-padding-horizontal-small);
784
+ @property st-global(--wds-tabs-padding-vertical-medium);
785
+ @property st-global(--wds-tabs-padding-vertical-small);
758
786
  @property st-global(--wds-tag-border-radius-large);
759
787
  @property st-global(--wds-tag-border-radius-medium);
760
788
  @property st-global(--wds-tag-border-radius-small);
@@ -920,7 +948,7 @@
920
948
  --wds-border-width-100: 1px;
921
949
  --wds-border-width-200: 2px;
922
950
  --wds-border-width-none: 0;
923
- --wds-breadcrumbs-border: 1000px;
951
+ --wds-breadcrumbs-border-radius: 1000px;
924
952
  --wds-breadcrumbs-on-dark-fill-hover: rgba(255, 255, 255, .3);
925
953
  --wds-breadcrumbs-on-grey-fill-hover: #ffffff;
926
954
  --wds-breadcrumbs-on-white-fill-hover: #ebf2ff;
@@ -1347,6 +1375,26 @@
1347
1375
  --wds-color-yellow-400: #fdead2;
1348
1376
  --wds-color-yellow-500: #fef3e5;
1349
1377
  --wds-color-yellow-600: #fef6ed;
1378
+ --wds-composer-sidebar-bottom-width: 88px;
1379
+ --wds-composer-sidebar-end-max-width: 240px;
1380
+ --wds-composer-sidebar-item-bottom-padding-horizontal-large: 4px;
1381
+ --wds-composer-sidebar-item-bottom-padding-horizontal-medium: 4px;
1382
+ --wds-composer-sidebar-item-bottom-padding-horizontal-small: 4px;
1383
+ --wds-composer-sidebar-item-bottom-padding-vertical-large: 12px;
1384
+ --wds-composer-sidebar-item-bottom-padding-vertical-medium: 12px;
1385
+ --wds-composer-sidebar-item-bottom-padding-vertical-small: 8px;
1386
+ --wds-composer-sidebar-item-end-padding-horizontal-large: 12px;
1387
+ --wds-composer-sidebar-item-end-padding-horizontal-medium: 12px;
1388
+ --wds-composer-sidebar-item-end-padding-horizontal-small: 12px;
1389
+ --wds-composer-sidebar-item-end-padding-vertical-large: 8px;
1390
+ --wds-composer-sidebar-item-end-padding-vertical-medium: 8px;
1391
+ --wds-composer-sidebar-item-end-padding-vertical-small: 4px;
1392
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-large: 8px;
1393
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-medium: 8px;
1394
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-small: 8px;
1395
+ --wds-composer-sidebar-item-tooltip-padding-vertical-large: 8px;
1396
+ --wds-composer-sidebar-item-tooltip-padding-vertical-medium: 8px;
1397
+ --wds-composer-sidebar-item-tooltip-padding-vertical-small: 4px;
1350
1398
  --wds-counter-badge-border-radius-medium: 1000px;
1351
1399
  --wds-counter-badge-border-radius-small: 1000px;
1352
1400
  --wds-counter-badge-padding-horizontal-medium: 6px;
@@ -1454,11 +1502,11 @@
1454
1502
  --wds-input-border-radius-default-large: 4px;
1455
1503
  --wds-input-border-radius-default-medium: 4px;
1456
1504
  --wds-input-border-radius-default-small: 4px;
1505
+ --wds-input-border-radius-default-tiny: 4px;
1457
1506
  --wds-input-border-radius-round-large: 1000px;
1458
1507
  --wds-input-border-radius-round-medium: 1000px;
1459
1508
  --wds-input-border-radius-round-small: 1000px;
1460
1509
  --wds-input-border-radius-round-tiny: 1000px;
1461
- --wds-input-borderdefault-tiny: 4px;
1462
1510
  --wds-input-padding-horizontal-large: 8px;
1463
1511
  --wds-input-padding-horizontal-medium: 8px;
1464
1512
  --wds-input-padding-horizontal-small: 8px;
@@ -1638,6 +1686,8 @@
1638
1686
  --wds-space-1600: 64px;
1639
1687
  --wds-space-1700: 68px;
1640
1688
  --wds-space-2400: 96px;
1689
+ --wds-stepper-prefix-size-circle: 20px;
1690
+ --wds-stepper-prefix-size-number: 16px;
1641
1691
  --wds-swatches-list-gap: 12px;
1642
1692
  --wds-swatches-list-padding-horizontal: 16px;
1643
1693
  --wds-swatches-list-padding-vertical: 12px;
@@ -1648,6 +1698,12 @@
1648
1698
  --wds-swatches-swatch-size-large: 28px;
1649
1699
  --wds-swatches-swatch-size-medium: 24px;
1650
1700
  --wds-swatches-swatch-size-small: 18px;
1701
+ --wds-tabs-gap-medium: 8px;
1702
+ --wds-tabs-gap-small: 6px;
1703
+ --wds-tabs-padding-horizontal-medium: 16px;
1704
+ --wds-tabs-padding-horizontal-small: 12px;
1705
+ --wds-tabs-padding-vertical-medium: 16px;
1706
+ --wds-tabs-padding-vertical-small: 12px;
1651
1707
  --wds-tag-border-radius-large: 4px;
1652
1708
  --wds-tag-border-radius-medium: 4px;
1653
1709
  --wds-tag-border-radius-small: 4px;
package/studio/component.st.css CHANGED
@@ -16,7 +16,7 @@
16
16
  @property st-global(--wds-badge-size-medium);
17
17
  @property st-global(--wds-badge-size-small);
18
18
  @property st-global(--wds-badge-size-tiny);
19
- @property st-global(--wds-breadcrumbs-border);
19
+ @property st-global(--wds-breadcrumbs-border-radius);
20
20
  @property st-global(--wds-breadcrumbs-on-dark-fill-hover);
21
21
  @property st-global(--wds-breadcrumbs-on-grey-fill-hover);
22
22
  @property st-global(--wds-breadcrumbs-on-white-fill-hover);
@@ -83,6 +83,26 @@
83
83
  @property st-global(--wds-circular-progress-bar-size-large);
84
84
  @property st-global(--wds-circular-progress-bar-size-medium);
85
85
  @property st-global(--wds-circular-progress-bar-size-small);
86
+ @property st-global(--wds-composer-sidebar-bottom-width);
87
+ @property st-global(--wds-composer-sidebar-end-max-width);
88
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-large);
89
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-medium);
90
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-small);
91
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-large);
92
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-medium);
93
+ @property st-global(--wds-composer-sidebar-item-bottom-padding-vertical-small);
94
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-large);
95
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-medium);
96
+ @property st-global(--wds-composer-sidebar-item-end-padding-horizontal-small);
97
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-large);
98
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-medium);
99
+ @property st-global(--wds-composer-sidebar-item-end-padding-vertical-small);
100
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-large);
101
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-medium);
102
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-horizontal-small);
103
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-large);
104
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-medium);
105
+ @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-small);
86
106
  @property st-global(--wds-counter-badge-border-radius-medium);
87
107
  @property st-global(--wds-counter-badge-border-radius-small);
88
108
  @property st-global(--wds-counter-badge-padding-horizontal-medium);
@@ -138,11 +158,11 @@
138
158
  @property st-global(--wds-input-border-radius-default-large);
139
159
  @property st-global(--wds-input-border-radius-default-medium);
140
160
  @property st-global(--wds-input-border-radius-default-small);
161
+ @property st-global(--wds-input-border-radius-default-tiny);
141
162
  @property st-global(--wds-input-border-radius-round-large);
142
163
  @property st-global(--wds-input-border-radius-round-medium);
143
164
  @property st-global(--wds-input-border-radius-round-small);
144
165
  @property st-global(--wds-input-border-radius-round-tiny);
145
- @property st-global(--wds-input-borderdefault-tiny);
146
166
  @property st-global(--wds-input-padding-horizontal-large);
147
167
  @property st-global(--wds-input-padding-horizontal-medium);
148
168
  @property st-global(--wds-input-padding-horizontal-small);
@@ -294,6 +314,8 @@
294
314
  @property st-global(--wds-slider-track-border-radius);
295
315
  @property st-global(--wds-slider-track-size);
296
316
  @property st-global(--wds-slider-track-size-transparent);
317
+ @property st-global(--wds-stepper-prefix-size-circle);
318
+ @property st-global(--wds-stepper-prefix-size-number);
297
319
  @property st-global(--wds-swatches-list-gap);
298
320
  @property st-global(--wds-swatches-list-padding-horizontal);
299
321
  @property st-global(--wds-swatches-list-padding-vertical);
@@ -304,6 +326,12 @@
304
326
  @property st-global(--wds-swatches-swatch-size-large);
305
327
  @property st-global(--wds-swatches-swatch-size-medium);
306
328
  @property st-global(--wds-swatches-swatch-size-small);
329
+ @property st-global(--wds-tabs-gap-medium);
330
+ @property st-global(--wds-tabs-gap-small);
331
+ @property st-global(--wds-tabs-padding-horizontal-medium);
332
+ @property st-global(--wds-tabs-padding-horizontal-small);
333
+ @property st-global(--wds-tabs-padding-vertical-medium);
334
+ @property st-global(--wds-tabs-padding-vertical-small);
307
335
  @property st-global(--wds-tag-border-radius-large);
308
336
  @property st-global(--wds-tag-border-radius-medium);
309
337
  @property st-global(--wds-tag-border-radius-small);
@@ -458,7 +486,7 @@
458
486
  --wds-badge-size-medium: 24px;
459
487
  --wds-badge-size-small: 20px;
460
488
  --wds-badge-size-tiny: 16px;
461
- --wds-breadcrumbs-border: 1000px;
489
+ --wds-breadcrumbs-border-radius: 1000px;
462
490
  --wds-breadcrumbs-on-dark-fill-hover: rgba(255, 255, 255, .3);
463
491
  --wds-breadcrumbs-on-grey-fill-hover: #ffffff;
464
492
  --wds-breadcrumbs-on-white-fill-hover: #ebf2ff;
@@ -525,6 +553,26 @@
525
553
  --wds-circular-progress-bar-size-large: 96px;
526
554
  --wds-circular-progress-bar-size-medium: 52px;
527
555
  --wds-circular-progress-bar-size-small: 24px;
556
+ --wds-composer-sidebar-bottom-width: 88px;
557
+ --wds-composer-sidebar-end-max-width: 240px;
558
+ --wds-composer-sidebar-item-bottom-padding-horizontal-large: 4px;
559
+ --wds-composer-sidebar-item-bottom-padding-horizontal-medium: 4px;
560
+ --wds-composer-sidebar-item-bottom-padding-horizontal-small: 4px;
561
+ --wds-composer-sidebar-item-bottom-padding-vertical-large: 12px;
562
+ --wds-composer-sidebar-item-bottom-padding-vertical-medium: 12px;
563
+ --wds-composer-sidebar-item-bottom-padding-vertical-small: 8px;
564
+ --wds-composer-sidebar-item-end-padding-horizontal-large: 12px;
565
+ --wds-composer-sidebar-item-end-padding-horizontal-medium: 12px;
566
+ --wds-composer-sidebar-item-end-padding-horizontal-small: 12px;
567
+ --wds-composer-sidebar-item-end-padding-vertical-large: 8px;
568
+ --wds-composer-sidebar-item-end-padding-vertical-medium: 8px;
569
+ --wds-composer-sidebar-item-end-padding-vertical-small: 4px;
570
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-large: 8px;
571
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-medium: 8px;
572
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-small: 8px;
573
+ --wds-composer-sidebar-item-tooltip-padding-vertical-large: 8px;
574
+ --wds-composer-sidebar-item-tooltip-padding-vertical-medium: 8px;
575
+ --wds-composer-sidebar-item-tooltip-padding-vertical-small: 4px;
528
576
  --wds-counter-badge-border-radius-medium: 1000px;
529
577
  --wds-counter-badge-border-radius-small: 1000px;
530
578
  --wds-counter-badge-padding-horizontal-medium: 6px;
@@ -580,11 +628,11 @@
580
628
  --wds-input-border-radius-default-large: 4px;
581
629
  --wds-input-border-radius-default-medium: 4px;
582
630
  --wds-input-border-radius-default-small: 4px;
631
+ --wds-input-border-radius-default-tiny: 4px;
583
632
  --wds-input-border-radius-round-large: 1000px;
584
633
  --wds-input-border-radius-round-medium: 1000px;
585
634
  --wds-input-border-radius-round-small: 1000px;
586
635
  --wds-input-border-radius-round-tiny: 1000px;
587
- --wds-input-borderdefault-tiny: 4px;
588
636
  --wds-input-padding-horizontal-large: 8px;
589
637
  --wds-input-padding-horizontal-medium: 8px;
590
638
  --wds-input-padding-horizontal-small: 8px;
@@ -736,6 +784,8 @@
736
784
  --wds-slider-track-border-radius: 1000px;
737
785
  --wds-slider-track-size: 2px;
738
786
  --wds-slider-track-size-transparent: 2px;
787
+ --wds-stepper-prefix-size-circle: 20px;
788
+ --wds-stepper-prefix-size-number: 16px;
739
789
  --wds-swatches-list-gap: 12px;
740
790
  --wds-swatches-list-padding-horizontal: 16px;
741
791
  --wds-swatches-list-padding-vertical: 12px;
@@ -746,6 +796,12 @@
746
796
  --wds-swatches-swatch-size-large: 28px;
747
797
  --wds-swatches-swatch-size-medium: 24px;
748
798
  --wds-swatches-swatch-size-small: 18px;
799
+ --wds-tabs-gap-medium: 8px;
800
+ --wds-tabs-gap-small: 6px;
801
+ --wds-tabs-padding-horizontal-medium: 16px;
802
+ --wds-tabs-padding-horizontal-small: 12px;
803
+ --wds-tabs-padding-vertical-medium: 16px;
804
+ --wds-tabs-padding-vertical-small: 12px;
749
805
  --wds-tag-border-radius-large: 4px;
750
806
  --wds-tag-border-radius-medium: 4px;
751
807
  --wds-tag-border-radius-small: 4px;