@wix/design-system-tokens 1.229.2 → 1.231.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.
@@ -103,11 +103,15 @@
103
103
  @property st-global(--wds-badge-outline-destructive-label-color);
104
104
  @property st-global(--wds-badge-outline-neutral-border-color);
105
105
  @property st-global(--wds-badge-outline-neutral-danger-border-color);
106
+ @property st-global(--wds-badge-outline-neutral-danger-label-color);
106
107
  @property st-global(--wds-badge-outline-neutral-fill);
107
108
  @property st-global(--wds-badge-outline-neutral-label-color);
108
109
  @property st-global(--wds-badge-outline-neutral-light-border-color);
110
+ @property st-global(--wds-badge-outline-neutral-light-label-color);
109
111
  @property st-global(--wds-badge-outline-neutral-standard-border-color);
112
+ @property st-global(--wds-badge-outline-neutral-standard-label-color);
110
113
  @property st-global(--wds-badge-outline-neutral-success-border-color);
114
+ @property st-global(--wds-badge-outline-neutral-success-label-color);
111
115
  @property st-global(--wds-badge-outline-premium-border-color);
112
116
  @property st-global(--wds-badge-outline-premium-fill);
113
117
  @property st-global(--wds-badge-outline-premium-label-color);
@@ -124,6 +128,7 @@
124
128
  @property st-global(--wds-badge-outline-warning-fill);
125
129
  @property st-global(--wds-badge-outline-warning-label-color);
126
130
  @property st-global(--wds-badge-outline-warning-light-border-color);
131
+ @property st-global(--wds-badge-outline-warning-light-label-color);
127
132
  @property st-global(--wds-badge-padding-horizontal-medium);
128
133
  @property st-global(--wds-badge-padding-horizontal-small);
129
134
  @property st-global(--wds-badge-padding-horizontal-tiny);
@@ -135,7 +140,6 @@
135
140
  @property st-global(--wds-badge-size-tiny);
136
141
  @property st-global(--wds-badge-solid-neutral-danger-fill);
137
142
  @property st-global(--wds-badge-solid-neutral-danger-label-color);
138
- @property st-global(--wds-badge-solid-neutral-light-fill);
139
143
  @property st-global(--wds-badge-solid-neutral-light-label-color);
140
144
  @property st-global(--wds-badge-solid-neutral-standard-fill);
141
145
  @property st-global(--wds-badge-solid-neutral-standard-label-color);
@@ -147,9 +151,15 @@
147
151
  @property st-global(--wds-badge-solid-warning-label-color);
148
152
  @property st-global(--wds-badge-solid-warning-light-fill);
149
153
  @property st-global(--wds-badge-solid-warning-light-label-color);
154
+ @property st-global(--wds-badge-transparent-neutral-danger-label-color);
155
+ @property st-global(--wds-badge-transparent-neutral-label-color);
156
+ @property st-global(--wds-badge-transparent-neutral-light-label-color);
157
+ @property st-global(--wds-badge-transparent-neutral-standard-label-color);
158
+ @property st-global(--wds-badge-transparent-neutral-success-label-color);
150
159
  @property st-global(--wds-badge-transparent-success-label-color);
151
160
  @property st-global(--wds-badge-transparent-urgent-label-color);
152
161
  @property st-global(--wds-badge-transparent-warning-label-color);
162
+ @property st-global(--wds-badge-transparent-warning-light-label-color);
153
163
  @property st-global(--wds-breadcrumbs-border-radius);
154
164
  @property st-global(--wds-breadcrumbs-font-size-small);
155
165
  @property st-global(--wds-breadcrumbs-height-large);
@@ -501,8 +511,20 @@
501
511
  @property st-global(--wds-color-picker-padding-horizontal);
502
512
  @property st-global(--wds-color-picker-padding-vertical);
503
513
  @property st-global(--wds-color-picker-width);
514
+ @property st-global(--wds-composer-header-actions-gap);
515
+ @property st-global(--wds-composer-header-back-button-icon-size-medium);
516
+ @property st-global(--wds-composer-header-back-button-icon-size-small);
517
+ @property st-global(--wds-composer-header-border-fill);
518
+ @property st-global(--wds-composer-header-divider-margin);
519
+ @property st-global(--wds-composer-header-fill);
520
+ @property st-global(--wds-composer-header-height-medium);
521
+ @property st-global(--wds-composer-header-height-small);
522
+ @property st-global(--wds-composer-header-padding-vertical-small);
523
+ @property st-global(--wds-composer-sidebar-border-width);
504
524
  @property st-global(--wds-composer-sidebar-bottom-width);
505
525
  @property st-global(--wds-composer-sidebar-end-max-width);
526
+ @property st-global(--wds-composer-sidebar-fill);
527
+ @property st-global(--wds-composer-sidebar-item-border-radius);
506
528
  @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-large);
507
529
  @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-medium);
508
530
  @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-small);
@@ -521,9 +543,13 @@
521
543
  @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-large);
522
544
  @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-medium);
523
545
  @property st-global(--wds-composer-sidebar-item-tooltip-padding-vertical-small);
546
+ @property st-global(--wds-composer-sidebar-tooltip-container-padding-vertical);
547
+ @property st-global(--wds-composer-sidebar-tooltip-item-gap);
524
548
  @property st-global(--wds-counter-badge-border-radius-medium);
525
549
  @property st-global(--wds-counter-badge-border-radius-small);
526
550
  @property st-global(--wds-counter-badge-font-size-tiny);
551
+ @property st-global(--wds-counter-badge-outline-destructive-border-color);
552
+ @property st-global(--wds-counter-badge-outline-warning-label-color);
527
553
  @property st-global(--wds-counter-badge-padding-horizontal-medium);
528
554
  @property st-global(--wds-counter-badge-padding-horizontal-small);
529
555
  @property st-global(--wds-counter-badge-padding-horizontal-tiny);
@@ -1199,11 +1225,23 @@
1199
1225
  @property st-global(--wds-section-header-padding-vertical-small);
1200
1226
  @property st-global(--wds-section-helper-action-padding-medium);
1201
1227
  @property st-global(--wds-section-helper-action-padding-small);
1228
+ @property st-global(--wds-section-helper-border-experimental-dark);
1202
1229
  @property st-global(--wds-section-helper-border-preview);
1203
1230
  @property st-global(--wds-section-helper-border-radius);
1231
+ @property st-global(--wds-section-helper-border-standard);
1232
+ @property st-global(--wds-section-helper-border-success);
1233
+ @property st-global(--wds-section-helper-close-button-clearance-medium);
1234
+ @property st-global(--wds-section-helper-close-button-clearance-small);
1235
+ @property st-global(--wds-section-helper-close-button-inset-medium);
1236
+ @property st-global(--wds-section-helper-close-button-inset-small);
1237
+ @property st-global(--wds-section-helper-content-gap-medium);
1238
+ @property st-global(--wds-section-helper-content-gap-small);
1239
+ @property st-global(--wds-section-helper-fill-danger);
1204
1240
  @property st-global(--wds-section-helper-fill-premium);
1205
1241
  @property st-global(--wds-section-helper-fill-preview);
1206
1242
  @property st-global(--wds-section-helper-fill-standard);
1243
+ @property st-global(--wds-section-helper-fill-success);
1244
+ @property st-global(--wds-section-helper-fill-warning);
1207
1245
  @property st-global(--wds-section-helper-fullwidth-horizontal-padding-medium);
1208
1246
  @property st-global(--wds-section-helper-fullwidth-horizontal-padding-small);
1209
1247
  @property st-global(--wds-section-helper-fullwidth-vertical-padding-medium);
@@ -1580,6 +1618,27 @@
1580
1618
  @property st-global(--wds-tag-label-font-line-height-small);
1581
1619
  @property st-global(--wds-tag-label-font-size-small);
1582
1620
  @property st-global(--wds-tag-list-action-gap);
1621
+ @property st-global(--wds-tag-outlined-dark-border-color);
1622
+ @property st-global(--wds-tag-outlined-dark-fill);
1623
+ @property st-global(--wds-tag-outlined-dark-label-color);
1624
+ @property st-global(--wds-tag-outlined-error-border-color);
1625
+ @property st-global(--wds-tag-outlined-error-fill);
1626
+ @property st-global(--wds-tag-outlined-error-label-color);
1627
+ @property st-global(--wds-tag-outlined-light-border-color);
1628
+ @property st-global(--wds-tag-outlined-light-fill);
1629
+ @property st-global(--wds-tag-outlined-light-label-color);
1630
+ @property st-global(--wds-tag-outlined-neutral-border-color);
1631
+ @property st-global(--wds-tag-outlined-neutral-fill);
1632
+ @property st-global(--wds-tag-outlined-neutral-label-color);
1633
+ @property st-global(--wds-tag-outlined-standard-border-color);
1634
+ @property st-global(--wds-tag-outlined-standard-fill);
1635
+ @property st-global(--wds-tag-outlined-standard-label-color);
1636
+ @property st-global(--wds-tag-outlined-success-border-color);
1637
+ @property st-global(--wds-tag-outlined-success-fill);
1638
+ @property st-global(--wds-tag-outlined-success-label-color);
1639
+ @property st-global(--wds-tag-outlined-warning-border-color);
1640
+ @property st-global(--wds-tag-outlined-warning-fill);
1641
+ @property st-global(--wds-tag-outlined-warning-label-color);
1583
1642
  @property st-global(--wds-tag-padding-horizontal-large);
1584
1643
  @property st-global(--wds-tag-padding-horizontal-medium);
1585
1644
  @property st-global(--wds-tag-padding-horizontal-small);
@@ -1592,6 +1651,20 @@
1592
1651
  @property st-global(--wds-tag-size-medium);
1593
1652
  @property st-global(--wds-tag-size-small);
1594
1653
  @property st-global(--wds-tag-size-tiny);
1654
+ @property st-global(--wds-tag-solid-dark-fill);
1655
+ @property st-global(--wds-tag-solid-error-fill);
1656
+ @property st-global(--wds-tag-solid-light-fill);
1657
+ @property st-global(--wds-tag-solid-neutral-fill);
1658
+ @property st-global(--wds-tag-solid-standard-fill);
1659
+ @property st-global(--wds-tag-solid-success-fill);
1660
+ @property st-global(--wds-tag-solid-warning-fill);
1661
+ @property st-global(--wds-tag-transparent-dark-label-color);
1662
+ @property st-global(--wds-tag-transparent-error-label-color);
1663
+ @property st-global(--wds-tag-transparent-light-label-color);
1664
+ @property st-global(--wds-tag-transparent-neutral-label-color);
1665
+ @property st-global(--wds-tag-transparent-standard-label-color);
1666
+ @property st-global(--wds-tag-transparent-success-label-color);
1667
+ @property st-global(--wds-tag-transparent-warning-label-color);
1595
1668
  @property st-global(--wds-testimonial-list-gap);
1596
1669
  @property st-global(--wds-text-button-font-line-height-medium);
1597
1670
  @property st-global(--wds-text-button-font-line-height-small);
@@ -1987,11 +2060,15 @@
1987
2060
  --wds-badge-outline-destructive-label-color: #ee4437;
1988
2061
  --wds-badge-outline-neutral-border-color: #868aa5;
1989
2062
  --wds-badge-outline-neutral-danger-border-color: #e2e3ea;
2063
+ --wds-badge-outline-neutral-danger-label-color: #42454c;
1990
2064
  --wds-badge-outline-neutral-fill: #ffffff;
1991
2065
  --wds-badge-outline-neutral-label-color: #acafc4;
1992
2066
  --wds-badge-outline-neutral-light-border-color: #e2e3ea;
2067
+ --wds-badge-outline-neutral-light-label-color: #42454c;
1993
2068
  --wds-badge-outline-neutral-standard-border-color: #e2e3ea;
2069
+ --wds-badge-outline-neutral-standard-label-color: #42454c;
1994
2070
  --wds-badge-outline-neutral-success-border-color: #e2e3ea;
2071
+ --wds-badge-outline-neutral-success-label-color: #42454c;
1995
2072
  --wds-badge-outline-premium-border-color: #cf8cf1;
1996
2073
  --wds-badge-outline-premium-fill: #ffffff;
1997
2074
  --wds-badge-outline-premium-label-color: #9a27d5;
@@ -2008,6 +2085,7 @@
2008
2085
  --wds-badge-outline-warning-fill: #ffffff;
2009
2086
  --wds-badge-outline-warning-label-color: #f9ad4d;
2010
2087
  --wds-badge-outline-warning-light-border-color: #e2e3ea;
2088
+ --wds-badge-outline-warning-light-label-color: #42454c;
2011
2089
  --wds-badge-padding-horizontal-medium: 12px;
2012
2090
  --wds-badge-padding-horizontal-small: 8px;
2013
2091
  --wds-badge-padding-horizontal-tiny: 4px;
@@ -2019,7 +2097,6 @@
2019
2097
  --wds-badge-size-tiny: 16px;
2020
2098
  --wds-badge-solid-neutral-danger-fill: #fbd0cd;
2021
2099
  --wds-badge-solid-neutral-danger-label-color: #42454c;
2022
- --wds-badge-solid-neutral-light-fill: #f7f8f8;
2023
2100
  --wds-badge-solid-neutral-light-label-color: #42454c;
2024
2101
  --wds-badge-solid-neutral-standard-fill: #dce9ff;
2025
2102
  --wds-badge-solid-neutral-standard-label-color: #42454c;
@@ -2031,9 +2108,15 @@
2031
2108
  --wds-badge-solid-warning-label-color: #ffffff;
2032
2109
  --wds-badge-solid-warning-light-fill: #fdead2;
2033
2110
  --wds-badge-solid-warning-light-label-color: #42454c;
2111
+ --wds-badge-transparent-neutral-danger-label-color: #fbd0cd;
2112
+ --wds-badge-transparent-neutral-label-color: #acafc4;
2113
+ --wds-badge-transparent-neutral-light-label-color: #edeef2;
2114
+ --wds-badge-transparent-neutral-standard-label-color: #dce9ff;
2115
+ --wds-badge-transparent-neutral-success-label-color: #c8e8d6;
2034
2116
  --wds-badge-transparent-success-label-color: #25a55a;
2035
2117
  --wds-badge-transparent-urgent-label-color: #f96132;
2036
2118
  --wds-badge-transparent-warning-label-color: #f9ad4d;
2119
+ --wds-badge-transparent-warning-light-label-color: #fdead2;
2037
2120
  --wds-breadcrumbs-border-radius: 2px;
2038
2121
  --wds-breadcrumbs-font-size-small: 12px;
2039
2122
  --wds-breadcrumbs-height-large: 36px;
@@ -2385,8 +2468,20 @@
2385
2468
  --wds-color-picker-padding-horizontal: 16px;
2386
2469
  --wds-color-picker-padding-vertical: 12px;
2387
2470
  --wds-color-picker-width: 236px;
2471
+ --wds-composer-header-actions-gap: 8px;
2472
+ --wds-composer-header-back-button-icon-size-medium: 24px;
2473
+ --wds-composer-header-back-button-icon-size-small: 18px;
2474
+ --wds-composer-header-border-fill: #e2e3ea;
2475
+ --wds-composer-header-divider-margin: 20px;
2476
+ --wds-composer-header-fill: #ffffff;
2477
+ --wds-composer-header-height-medium: 36px;
2478
+ --wds-composer-header-height-small: 30px;
2479
+ --wds-composer-header-padding-vertical-small: 8px;
2480
+ --wds-composer-sidebar-border-width: 1px;
2388
2481
  --wds-composer-sidebar-bottom-width: 88px;
2389
2482
  --wds-composer-sidebar-end-max-width: 240px;
2483
+ --wds-composer-sidebar-fill: #ffffff;
2484
+ --wds-composer-sidebar-item-border-radius: 1000px;
2390
2485
  --wds-composer-sidebar-item-bottom-padding-horizontal-large: 4px;
2391
2486
  --wds-composer-sidebar-item-bottom-padding-horizontal-medium: 4px;
2392
2487
  --wds-composer-sidebar-item-bottom-padding-horizontal-small: 4px;
@@ -2399,15 +2494,19 @@
2399
2494
  --wds-composer-sidebar-item-end-padding-vertical-large: 8px;
2400
2495
  --wds-composer-sidebar-item-end-padding-vertical-medium: 8px;
2401
2496
  --wds-composer-sidebar-item-end-padding-vertical-small: 4px;
2402
- --wds-composer-sidebar-item-tooltip-padding-horizontal-large: 8px;
2403
- --wds-composer-sidebar-item-tooltip-padding-horizontal-medium: 8px;
2404
- --wds-composer-sidebar-item-tooltip-padding-horizontal-small: 8px;
2405
- --wds-composer-sidebar-item-tooltip-padding-vertical-large: 8px;
2406
- --wds-composer-sidebar-item-tooltip-padding-vertical-medium: 8px;
2407
- --wds-composer-sidebar-item-tooltip-padding-vertical-small: 4px;
2497
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-large: 12px;
2498
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-medium: 12px;
2499
+ --wds-composer-sidebar-item-tooltip-padding-horizontal-small: 12px;
2500
+ --wds-composer-sidebar-item-tooltip-padding-vertical-large: 12px;
2501
+ --wds-composer-sidebar-item-tooltip-padding-vertical-medium: 12px;
2502
+ --wds-composer-sidebar-item-tooltip-padding-vertical-small: 6px;
2503
+ --wds-composer-sidebar-tooltip-container-padding-vertical: 6px;
2504
+ --wds-composer-sidebar-tooltip-item-gap: 0px;
2408
2505
  --wds-counter-badge-border-radius-medium: 1000px;
2409
2506
  --wds-counter-badge-border-radius-small: 1000px;
2410
2507
  --wds-counter-badge-font-size-tiny: 10px;
2508
+ --wds-counter-badge-outline-destructive-border-color: #f69891;
2509
+ --wds-counter-badge-outline-warning-label-color: #f9ad4d;
2411
2510
  --wds-counter-badge-padding-horizontal-medium: 8px;
2412
2511
  --wds-counter-badge-padding-horizontal-small: 6px;
2413
2512
  --wds-counter-badge-padding-horizontal-tiny: 4px;
@@ -3083,11 +3182,23 @@
3083
3182
  --wds-section-header-padding-vertical-small: 8px;
3084
3183
  --wds-section-helper-action-padding-medium: 8px;
3085
3184
  --wds-section-helper-action-padding-small: 8px;
3185
+ --wds-section-helper-border-experimental-dark: #131720;
3086
3186
  --wds-section-helper-border-preview: #cfd1dc;
3087
3187
  --wds-section-helper-border-radius: 4px;
3188
+ --wds-section-helper-border-standard: #c3daff;
3189
+ --wds-section-helper-border-success: #87cea5;
3190
+ --wds-section-helper-close-button-clearance-medium: 28px;
3191
+ --wds-section-helper-close-button-clearance-small: 20px;
3192
+ --wds-section-helper-close-button-inset-medium: 4px;
3193
+ --wds-section-helper-close-button-inset-small: 0px;
3194
+ --wds-section-helper-content-gap-medium: 8px;
3195
+ --wds-section-helper-content-gap-small: 8px;
3196
+ --wds-section-helper-fill-danger: #fde3e1;
3088
3197
  --wds-section-helper-fill-premium: #f1e0f9;
3089
3198
  --wds-section-helper-fill-preview: #edeef2;
3090
3199
  --wds-section-helper-fill-standard: #dce9ff;
3200
+ --wds-section-helper-fill-success: #e1f4eb;
3201
+ --wds-section-helper-fill-warning: #fef3e5;
3091
3202
  --wds-section-helper-fullwidth-horizontal-padding-medium: 24px;
3092
3203
  --wds-section-helper-fullwidth-horizontal-padding-small: 24px;
3093
3204
  --wds-section-helper-fullwidth-vertical-padding-medium: 10px;
@@ -3464,6 +3575,27 @@
3464
3575
  --wds-tag-label-font-line-height-small: 16px;
3465
3576
  --wds-tag-label-font-size-small: 12px;
3466
3577
  --wds-tag-list-action-gap: 4px;
3578
+ --wds-tag-outlined-dark-border-color: #868aa5;
3579
+ --wds-tag-outlined-dark-fill: #ffffff;
3580
+ --wds-tag-outlined-dark-label-color: #131720;
3581
+ --wds-tag-outlined-error-border-color: #e2e3ea;
3582
+ --wds-tag-outlined-error-fill: #ffffff;
3583
+ --wds-tag-outlined-error-label-color: #42454c;
3584
+ --wds-tag-outlined-light-border-color: rgba(255, 255, 255, .5);
3585
+ --wds-tag-outlined-light-fill: rgba(255, 255, 255, 0);
3586
+ --wds-tag-outlined-light-label-color: #ffffff;
3587
+ --wds-tag-outlined-neutral-border-color: #e2e3ea;
3588
+ --wds-tag-outlined-neutral-fill: #ffffff;
3589
+ --wds-tag-outlined-neutral-label-color: #42454c;
3590
+ --wds-tag-outlined-standard-border-color: #e2e3ea;
3591
+ --wds-tag-outlined-standard-fill: #ffffff;
3592
+ --wds-tag-outlined-standard-label-color: #42454c;
3593
+ --wds-tag-outlined-success-border-color: #e2e3ea;
3594
+ --wds-tag-outlined-success-fill: #ffffff;
3595
+ --wds-tag-outlined-success-label-color: #42454c;
3596
+ --wds-tag-outlined-warning-border-color: #e2e3ea;
3597
+ --wds-tag-outlined-warning-fill: #ffffff;
3598
+ --wds-tag-outlined-warning-label-color: #42454c;
3467
3599
  --wds-tag-padding-horizontal-large: 16px;
3468
3600
  --wds-tag-padding-horizontal-medium: 12px;
3469
3601
  --wds-tag-padding-horizontal-small: 12px;
@@ -3476,6 +3608,20 @@
3476
3608
  --wds-tag-size-medium: 28px;
3477
3609
  --wds-tag-size-small: 24px;
3478
3610
  --wds-tag-size-tiny: 20px;
3611
+ --wds-tag-solid-dark-fill: #131720;
3612
+ --wds-tag-solid-error-fill: #fbd0cd;
3613
+ --wds-tag-solid-light-fill: #ffffff;
3614
+ --wds-tag-solid-neutral-fill: #f7f8f8;
3615
+ --wds-tag-solid-standard-fill: #f7f8f8;
3616
+ --wds-tag-solid-success-fill: #c8e8d6;
3617
+ --wds-tag-solid-warning-fill: #fdead2;
3618
+ --wds-tag-transparent-dark-label-color: #131720;
3619
+ --wds-tag-transparent-error-label-color: #ee4437;
3620
+ --wds-tag-transparent-light-label-color: #ffffff;
3621
+ --wds-tag-transparent-neutral-label-color: #acafc4;
3622
+ --wds-tag-transparent-standard-label-color: #42454c;
3623
+ --wds-tag-transparent-success-label-color: #25a55a;
3624
+ --wds-tag-transparent-warning-label-color: #f9ad4d;
3479
3625
  --wds-testimonial-list-gap: 24px;
3480
3626
  --wds-text-button-font-line-height-medium: 24px;
3481
3627
  --wds-text-button-font-line-height-small: 20px;