@wix/design-system-tokens 1.120.0 → 1.122.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 (26) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/all.css +175 -15
  3. package/all.scss +1808 -0
  4. package/all.st.css +339 -19
  5. package/component.st.css +329 -19
  6. package/foundation.st.css +2 -0
  7. package/odeditor/all.css +57 -41
  8. package/odeditor/all.scss +1802 -0
  9. package/odeditor/all.st.css +149 -117
  10. package/odeditor/component.st.css +113 -91
  11. package/odeditor/foundation.st.css +2 -0
  12. package/odeditor/semantic.st.css +34 -26
  13. package/package.json +2 -2
  14. package/semantic.st.css +8 -0
  15. package/studio/all.css +174 -14
  16. package/studio/all.scss +1804 -0
  17. package/studio/all.st.css +337 -17
  18. package/studio/component.st.css +327 -17
  19. package/studio/foundation.st.css +2 -0
  20. package/studio/semantic.st.css +8 -0
  21. package/wixel/all.css +174 -14
  22. package/wixel/all.scss +1809 -0
  23. package/wixel/all.st.css +338 -18
  24. package/wixel/component.st.css +328 -18
  25. package/wixel/foundation.st.css +2 -0
  26. package/wixel/semantic.st.css +8 -0
package/CHANGELOG.md CHANGED
@@ -1,3 +1,21 @@
1
+ ## 1.122.0 - 2025-07-25
2
+
3
+ ### Visual Breaking Changes
4
+
5
+ - breaking(Tabs): editor3 tokenization [15117](https://github.com/wix-private/wix-design-systems/pull/15117)
6
+ - breaking(CloseButton): editor3 tokenization + fixes according to Figma [15114](https://github.com/wix-private/wix-design-systems/pull/15114)
7
+
8
+ ### Features
9
+
10
+ - feat(tokens): generate token mixin [15126](https://github.com/wix-private/wix-design-systems/pull/15126)
11
+
12
+ ## 1.121.0 - 2025-07-24
13
+
14
+ ### Visual Breaking Changes
15
+
16
+ - breaking(Button): tokenization for Editor3 [15091](https://github.com/wix-private/wix-design-systems/pull/15091)
17
+ - breaking(IconButton): new component level tokens implemented [15097](https://github.com/wix-private/wix-design-systems/pull/15097)
18
+
1
19
  ## 1.120.0 - 2025-07-16
2
20
 
3
21
  ### Features
package/all.css CHANGED
@@ -209,6 +209,7 @@
209
209
  --wds-color-black-300-transparent-70: rgba(134, 138, 165, 0.7000);
210
210
  --wds-color-black-300-transparent-60: rgba(134, 138, 165, 0.6000);
211
211
  --wds-color-black-300-transparent-50: rgba(134, 138, 165, 0.5000);
212
+ --wds-color-black-300-transparent-20: rgba(134, 138, 165, 0.2000);
212
213
  --wds-color-black-300-transparent-0: rgba(134, 138, 165, 0.0000);
213
214
  --wds-color-black-200-transparent-70: rgba(68, 72, 95, .7);
214
215
  --wds-color-black-200-transparent-60: rgba(68, 72, 95, .6);
@@ -273,7 +274,7 @@
273
274
  --wds-slider-track-size: 4px;
274
275
  --wds-slider-slider-knob-size-transparent: 16px;
275
276
  --wds-slider-slider-knob-size-hover: 18px;
276
- --wds-slider-slider-knob-size: 12px;
277
+ --wds-slider-slider-knob-size: 4px;
277
278
  --wds-slider-slider-knob-shadow: false;
278
279
  --wds-slider-slider-knob-border-width-hover: 12px;
279
280
  --wds-slider-slider-knob-border-width: 4px;
@@ -363,6 +364,7 @@
363
364
  --wds-shadow-fill-primary-overlay-dark: var(--wds-color-black-100-transparent-10);
364
365
  --wds-shadow-fill-primary-overlay: var(--wds-color-black-100-transparent-10);
365
366
  --wds-shadow-fill-primary-modal: var(--wds-color-black-100-transparent-20);
367
+ --wds-shadow-fill-input: var(--wds-color-black-100-transparent-0);
366
368
  --wds-shadow-y-secondary-toggle: var(--wds-shadow-y-25);
367
369
  --wds-shadow-y-secondary-raised: var(--wds-shadow-y-25);
368
370
  --wds-shadow-y-secondary-overlay-dark: var(--wds-shadow-y-100);
@@ -373,6 +375,8 @@
373
375
  --wds-shadow-y-primary-overlay-dark: var(--wds-shadow-y-0);
374
376
  --wds-shadow-y-primary-overlay: var(--wds-shadow-y-0);
375
377
  --wds-shadow-y-primary-modal: var(--wds-shadow-y-50);
378
+ --wds-shadow-y-input: var(--wds-shadow-y-0);
379
+ --wds-shadow-x-input: var(--wds-shadow-x-0);
376
380
  --wds-shadow-inner-400-top: 0 32px 24px -24px var(--wds-color-black-100-transparent-20) inset, 0 8px 6px -6px var(--wds-color-black-100-transparent-5) inset;
377
381
  --wds-shadow-inner-400-right: -32px 0 24px -24px var(--wds-color-black-100-transparent-20) inset, -8px 0 6px -6px var(--wds-color-black-100-transparent-5) inset;
378
382
  --wds-shadow-inner-400-left: 32px 0 24px -24px var(--wds-color-black-100-transparent-20) inset, 8px 0 6px -6px var(--wds-color-black-100-transparent-5) inset;
@@ -395,6 +399,7 @@
395
399
  --wds-shadow-blur-primary-overlay-dark: var(--wds-shadow-blur-200);
396
400
  --wds-shadow-blur-primary-overlay: var(--wds-shadow-blur-200);
397
401
  --wds-shadow-blur-primary-modal: var(--wds-shadow-blur-400);
402
+ --wds-shadow-blur-input: var(--wds-shadow-blur-0);
398
403
  --wds-shadow-400: 0 3px 24px var(--wds-color-black-100-transparent-20), 0 8px 8px var(--wds-color-black-100-transparent-10);
399
404
  --wds-shadow-300: 0 0 18px var(--wds-color-black-100-transparent-10), 0 6px 6px var(--wds-color-black-100-transparent-5);
400
405
  --wds-shadow-200: 0 0 6px var(--wds-color-black-100-transparent-10), 0 2px 4px var(--wds-color-black-100-transparent-10);
@@ -824,8 +829,14 @@
824
829
  --wds-tabs-padding-vertical-medium: var(--wds-space-300);
825
830
  --wds-tabs-padding-horizontal-small: var(--wds-space-200);
826
831
  --wds-tabs-padding-horizontal-medium: var(--wds-space-300);
827
- --wds-tabs-gap-small: var(--wds-space-100);
828
- --wds-tabs-gap-medium: var(--wds-space-100);
832
+ --wds-tabs-label-font-weight-active: var(--wds-font-weight-regular);
833
+ --wds-tabs-label-font-weight: var(--wds-font-weight-regular);
834
+ --wds-tabs-item-gap-small: var(--wds-space-100);
835
+ --wds-tabs-item-gap-medium: var(--wds-space-100);
836
+ --wds-tabs-item-fill-hover: var(--wds-color-black-100-transparent-0);
837
+ --wds-tabs-item-fill-active: var(--wds-color-black-100-transparent-0);
838
+ --wds-tabs-gap-horizontal: var(--wds-space-0);
839
+ --wds-tabs-border-radius: var(--wds-border-radius-0);
829
840
  --wds-table-list-item-paddings: var(--wds-space-0);
830
841
  --wds-table-list-item-indentation-level-3: var(--wds-space-600);
831
842
  --wds-table-list-item-indentation-level-2: var(--wds-space-200);
@@ -845,6 +856,8 @@
845
856
  --wds-swatches-list-gap: var(--wds-space-200);
846
857
  --wds-stepper-prefix-size-number: var(--wds-space-400);
847
858
  --wds-stepper-prefix-size-circle: var(--wds-space-500);
859
+ --wds-status-toast-vertical-padding: var(--wds-space-150);
860
+ --wds-status-toast-horizontal-padding: var(--wds-space-200);
848
861
  --wds-social-preview-content-padding-vertical: var(--wds-space-150);
849
862
  --wds-social-preview-content-padding-horizontal: var(--wds-space-200);
850
863
  --wds-social-post-preview-content-padding-vertical: var(--wds-space-200);
@@ -852,6 +865,7 @@
852
865
  --wds-slider-track-border-radius-transparent: var(--wds-border-radius-full);
853
866
  --wds-slider-track-border-border-radius: var(--wds-border-radius-full);
854
867
  --wds-slider-slider-mark-size: var(--wds-space-100);
868
+ --wds-slider-slider-knob-color-disabled: var(--wds-color-black-500);
855
869
  --wds-skeleton-border-radius-rectangle: var(--wds-border-radius-300);
856
870
  --wds-skeleton-border-radius-line: var(--wds-border-radius-full);
857
871
  --wds-skeleton-border-radius-circle: var(--wds-border-radius-full);
@@ -1238,6 +1252,9 @@
1238
1252
  --wds-button-gap-medium: var(--wds-space-100);
1239
1253
  --wds-button-gap-large: var(--wds-space-200);
1240
1254
  --wds-button-font-weight-tiny: var(--wds-font-weight-bold);
1255
+ --wds-button-font-weight-small: var(--wds-font-weight-medium);
1256
+ --wds-button-font-weight-medium: var(--wds-font-weight-medium);
1257
+ --wds-button-font-weight-large: var(--wds-font-weight-medium);
1241
1258
  --wds-button-border-radius-tiny: var(--wds-border-radius-full);
1242
1259
  --wds-button-border-radius-small: var(--wds-border-radius-full);
1243
1260
  --wds-button-border-radius-medium: var(--wds-border-radius-full);
@@ -1392,6 +1409,8 @@
1392
1409
  --wds-tabs-selection-fill-secondary: var(--wds-color-fill-standard-primary);
1393
1410
  --wds-tabs-selection-fill-primary: var(--wds-color-fill-standard-primary);
1394
1411
  --wds-tabs-label-font-size-small: var(--wds-font-size-body-small);
1412
+ --wds-tabs-label-fill-active: var(--wds-color-text-primary);
1413
+ --wds-tabs-label-fill: var(--wds-color-text-standard-primary);
1395
1414
  --wds-table-list-item-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
1396
1415
  --wds-table-list-item-fill-active: var(--wds-color-fill-standard-tertiary-active);
1397
1416
  --wds-table-list-item-fill: var(--wds-color-fill-standard-tertiary);
@@ -1399,7 +1418,7 @@
1399
1418
  --wds-status-toast-text-fill: var(--wds-color-text-standard-primary-light);
1400
1419
  --wds-status-toast-info-icon-fill: var(--wds-color-text-standard-primary-light);
1401
1420
  --wds-slider-track-color: var(--wds-color-fill-standard-secondary);
1402
- --wds-slider-slider-knob-color-hover: var(--wds-color-fill-standard-primary);
1421
+ --wds-slider-slider-knob-color-hover: var(--wds-color-fill-standard-primary-hover);
1403
1422
  --wds-slider-slider-knob-color: var(--wds-color-fill-standard-primary);
1404
1423
  --wds-sidebar-item-text-neutral-disabled: var(--wds-color-text-disabled);
1405
1424
  --wds-sidebar-item-text-neutral-default: var(--wds-color-text-standard-secondary);
@@ -1506,27 +1525,117 @@
1506
1525
  --wds-input-background-fill-default: var(--wds-color-fill-standard-tertiary);
1507
1526
  --wds-info-icon-fill-hover: var(--wds-color-text-primary);
1508
1527
  --wds-info-icon-fill: var(--wds-color-text-primary);
1509
- --wds-icon-button-color-text-standard-tertiary-hover: var(--wds-color-fill-standard-primary-hover);
1510
- --wds-icon-button-color-text-standard-tertiary-active: var(--wds-color-fill-standard-primary-active);
1528
+ --wds-icon-button-color-text-standard-tertiary-hover: var(--wds-color-text-primary);
1529
+ --wds-icon-button-color-text-standard-tertiary-disabled: var(--wds-color-text-disabled);
1530
+ --wds-icon-button-color-text-standard-tertiary-active: var(--wds-color-text-primary);
1511
1531
  --wds-icon-button-color-text-standard-tertiary: var(--wds-color-text-primary);
1512
1532
  --wds-icon-button-color-text-standard-secondary-hover: var(--wds-color-text-standard-primary-light);
1533
+ --wds-icon-button-color-text-standard-secondary-disabled: var(--wds-color-text-disabled);
1513
1534
  --wds-icon-button-color-text-standard-secondary-active: var(--wds-color-text-standard-primary-light);
1514
1535
  --wds-icon-button-color-text-standard-secondary: var(--wds-color-text-primary);
1515
1536
  --wds-icon-button-color-text-standard-primary-hover: var(--wds-color-text-standard-primary-light);
1537
+ --wds-icon-button-color-text-standard-primary-disabled: var(--wds-color-text-disabled-light);
1516
1538
  --wds-icon-button-color-text-standard-primary-active: var(--wds-color-text-standard-primary-light);
1517
1539
  --wds-icon-button-color-text-standard-primary: var(--wds-color-text-standard-primary-light);
1518
- --wds-icon-button-color-fill-standard-tertiary-hover: var(--wds-color-fill-standard-tertiary);
1519
- --wds-icon-button-color-fill-standard-tertiary-active: var(--wds-color-fill-standard-tertiary);
1520
- --wds-icon-button-color-fill-standard-tertiary: var(--wds-color-fill-standard-tertiary);
1540
+ --wds-icon-button-color-text-premium-tertiary-hover: var(--wds-color-text-premium);
1541
+ --wds-icon-button-color-text-premium-tertiary-disabled: var(--wds-color-text-disabled);
1542
+ --wds-icon-button-color-text-premium-tertiary-active: var(--wds-color-text-premium);
1543
+ --wds-icon-button-color-text-premium-tertiary: var(--wds-color-text-premium);
1544
+ --wds-icon-button-color-text-premium-secondary-hover: var(--wds-color-text-standard-primary-light);
1545
+ --wds-icon-button-color-text-premium-secondary-disabled: var(--wds-color-text-disabled);
1546
+ --wds-icon-button-color-text-premium-secondary-active: var(--wds-color-text-standard-primary-light);
1547
+ --wds-icon-button-color-text-premium-secondary: var(--wds-color-text-premium);
1548
+ --wds-icon-button-color-text-premium-primary-hover: var(--wds-color-text-standard-primary-light);
1549
+ --wds-icon-button-color-text-premium-primary-disabled: var(--wds-color-text-disabled-light);
1550
+ --wds-icon-button-color-text-premium-primary-active: var(--wds-color-text-standard-primary-light);
1551
+ --wds-icon-button-color-text-premium-primary: var(--wds-color-text-standard-primary-light);
1552
+ --wds-icon-button-color-text-light-tertiary-hover: var(--wds-color-text-primary);
1553
+ --wds-icon-button-color-text-light-tertiary-disabled: var(--wds-color-text-disabled-light);
1554
+ --wds-icon-button-color-text-light-tertiary-active: var(--wds-color-text-primary);
1555
+ --wds-icon-button-color-text-light-tertiary: var(--wds-color-text-standard-primary-light);
1556
+ --wds-icon-button-color-text-light-secondary-hover: var(--wds-color-text-primary);
1557
+ --wds-icon-button-color-text-light-secondary-disabled: var(--wds-color-text-disabled);
1558
+ --wds-icon-button-color-text-light-secondary-active: var(--wds-color-text-primary);
1559
+ --wds-icon-button-color-text-light-secondary: var(--wds-color-text-standard-primary-light);
1560
+ --wds-icon-button-color-text-light-primary-hover: var(--wds-color-text-primary);
1561
+ --wds-icon-button-color-text-light-primary-disabled: var(--wds-color-text-disabled);
1562
+ --wds-icon-button-color-text-light-primary-active: var(--wds-color-text-primary);
1563
+ --wds-icon-button-color-text-light-primary: var(--wds-color-text-primary);
1564
+ --wds-icon-button-color-text-dark-tertiary-hover: var(--wds-color-text-standard-primary);
1565
+ --wds-icon-button-color-text-dark-tertiary-disabled: var(--wds-color-text-disabled);
1566
+ --wds-icon-button-color-text-dark-tertiary-active: var(--wds-color-text-standard-primary);
1567
+ --wds-icon-button-color-text-dark-tertiary: var(--wds-color-text-standard-primary);
1568
+ --wds-icon-button-color-text-dark-secondary-hover: var(--wds-color-text-standard-primary-light);
1569
+ --wds-icon-button-color-text-dark-secondary-disabled: var(--wds-color-text-disabled);
1570
+ --wds-icon-button-color-text-dark-secondary-active: var(--wds-color-text-standard-primary-light);
1571
+ --wds-icon-button-color-text-dark-secondary: var(--wds-color-text-standard-primary);
1572
+ --wds-icon-button-color-text-dark-primary-hover: var(--wds-color-text-standard-primary-light);
1573
+ --wds-icon-button-color-text-dark-primary-disabled: var(--wds-color-text-disabled-light);
1574
+ --wds-icon-button-color-text-dark-primary-active: var(--wds-color-text-standard-primary-light);
1575
+ --wds-icon-button-color-text-dark-primary: var(--wds-color-text-standard-primary-light);
1576
+ --wds-icon-button-color-fill-standard-tertiary-hover: var(--wds-color-fill-light-secondary-hover);
1577
+ --wds-icon-button-color-fill-standard-tertiary-disabled: var(--wds-color-fill-light-secondary-disabled);
1578
+ --wds-icon-button-color-fill-standard-tertiary-active: var(--wds-color-fill-light-secondary-active);
1579
+ --wds-icon-button-color-fill-standard-tertiary: var(--wds-color-fill-light-secondary);
1521
1580
  --wds-icon-button-color-fill-standard-secondary-hover: var(--wds-color-fill-standard-primary-hover);
1522
- --wds-icon-button-color-fill-standard-secondary-active: var(--wds-color-fill-standard-secondary-active);
1581
+ --wds-icon-button-color-fill-standard-secondary-disabled: var(--wds-color-fill-standard-tertiary-disabled);
1582
+ --wds-icon-button-color-fill-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
1523
1583
  --wds-icon-button-color-fill-standard-secondary: var(--wds-color-fill-standard-tertiary);
1524
1584
  --wds-icon-button-color-fill-standard-primary-hover: var(--wds-color-fill-standard-primary-hover);
1585
+ --wds-icon-button-color-fill-standard-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1525
1586
  --wds-icon-button-color-fill-standard-primary-active: var(--wds-color-fill-standard-primary-active);
1526
1587
  --wds-icon-button-color-fill-standard-primary: var(--wds-color-fill-standard-primary);
1527
- --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-fill-standard-primary-hover);
1528
- --wds-icon-button-color-border-standard-secondary-active: var(--wds-color-fill-standard-secondary-active);
1588
+ --wds-icon-button-color-fill-premium-tertiary-hover: var(--wds-color-fill-premium-light-secondary-hover);
1589
+ --wds-icon-button-color-fill-premium-tertiary-disabled: var(--wds-color-fill-premium-light-secondary-disabled);
1590
+ --wds-icon-button-color-fill-premium-tertiary-active: var(--wds-color-fill-premium-light-secondary-active);
1591
+ --wds-icon-button-color-fill-premium-tertiary: var(--wds-color-fill-premium-light-secondary);
1592
+ --wds-icon-button-color-fill-premium-secondary-hover: var(--wds-color-fill-premium-primary-hover);
1593
+ --wds-icon-button-color-fill-premium-secondary-disabled: var(--wds-color-fill-premium-tertiary-disabled);
1594
+ --wds-icon-button-color-fill-premium-secondary-active: var(--wds-color-fill-premium-primary-active);
1595
+ --wds-icon-button-color-fill-premium-secondary: var(--wds-color-fill-premium-tertiary);
1596
+ --wds-icon-button-color-fill-premium-primary-hover: var(--wds-color-fill-premium-primary-hover);
1597
+ --wds-icon-button-color-fill-premium-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1598
+ --wds-icon-button-color-fill-premium-primary-active: var(--wds-color-fill-premium-primary-active);
1599
+ --wds-icon-button-color-fill-premium-primary: var(--wds-color-fill-premium-primary);
1600
+ --wds-icon-button-color-fill-light-tertiary-hover: var(--wds-color-fill-light-secondary-hover);
1601
+ --wds-icon-button-color-fill-light-tertiary-disabled: var(--wds-color-fill-light-secondary-disabled);
1602
+ --wds-icon-button-color-fill-light-tertiary-active: var(--wds-color-fill-light-secondary-active);
1603
+ --wds-icon-button-color-fill-light-tertiary: var(--wds-color-fill-light-secondary);
1604
+ --wds-icon-button-color-fill-light-secondary-hover: var(--wds-color-fill-light-secondary-hover);
1605
+ --wds-icon-button-color-fill-light-secondary-disabled: var(--wds-color-fill-light-secondary-disabled);
1606
+ --wds-icon-button-color-fill-light-secondary-active: var(--wds-color-fill-light-secondary-active);
1607
+ --wds-icon-button-color-fill-light-secondary: var(--wds-color-fill-light-secondary);
1608
+ --wds-icon-button-color-fill-light-primary-hover: var(--wds-color-fill-light-primary-hover);
1609
+ --wds-icon-button-color-fill-light-primary-disabled: var(--wds-color-fill-light-primary-disabled);
1610
+ --wds-icon-button-color-fill-light-primary-active: var(--wds-color-fill-light-primary-active);
1611
+ --wds-icon-button-color-fill-light-primary: var(--wds-color-fill-light-primary);
1612
+ --wds-icon-button-color-fill-dark-tertiary-hover: var(--wds-color-fill-dark-tertiary-hover);
1613
+ --wds-icon-button-color-fill-dark-tertiary-disabled: var(--wds-color-fill-light-secondary-disabled);
1614
+ --wds-icon-button-color-fill-dark-tertiary-active: var(--wds-color-fill-dark-tertiary-active);
1615
+ --wds-icon-button-color-fill-dark-tertiary: var(--wds-color-fill-light-secondary);
1616
+ --wds-icon-button-color-fill-dark-secondary-hover: var(--wds-color-fill-dark-primary-hover);
1617
+ --wds-icon-button-color-fill-dark-secondary-disabled: var(--wds-color-fill-light-secondary-disabled);
1618
+ --wds-icon-button-color-fill-dark-secondary-active: var(--wds-color-fill-dark-primary-active);
1619
+ --wds-icon-button-color-fill-dark-secondary: var(--wds-color-fill-light-secondary);
1620
+ --wds-icon-button-color-fill-dark-primary-hover: var(--wds-color-fill-dark-primary-hover);
1621
+ --wds-icon-button-color-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
1622
+ --wds-icon-button-color-fill-dark-primary-active: var(--wds-color-fill-dark-primary-active);
1623
+ --wds-icon-button-color-fill-dark-primary: var(--wds-color-fill-dark-primary);
1624
+ --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-border-standard-secondary-hover);
1625
+ --wds-icon-button-color-border-standard-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
1626
+ --wds-icon-button-color-border-standard-secondary-active: var(--wds-color-border-standard-secondary-active);
1529
1627
  --wds-icon-button-color-border-standard-secondary: var(--wds-color-border-standard-secondary);
1628
+ --wds-icon-button-color-border-premium-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
1629
+ --wds-icon-button-color-border-premium-secondary-active: var(--wds-color-border-premium-secondary-active);
1630
+ --wds-icon-button-color-border-premium-secondary: var(--wds-color-border-premium-secondary);
1631
+ --wds-icon-button-color-border-light-secondary-hover: var(--wds-color-border-light-hover);
1632
+ --wds-icon-button-color-border-light-secondary-disabled: var(--wds-color-border-light-disabled);
1633
+ --wds-icon-button-color-border-light-secondary-active: var(--wds-color-border-light-active);
1634
+ --wds-icon-button-color-border-light-secondary: var(--wds-color-border-light);
1635
+ --wds-icon-button-color-border-dark-secondary-hover: var(--wds-color-border-dark-primary-active);
1636
+ --wds-icon-button-color-border-dark-secondary-disabled: var(--wds-color-border-dark-secondary-disabled);
1637
+ --wds-icon-button-color-border-dark-secondary-active: var(--wds-color-border-dark-primary-active);
1638
+ --wds-icon-button-color-border-dark-secondary: var(--wds-color-border-dark-primary);
1530
1639
  --wds-form-field-label-font-size-tiny: var(--wds-font-size-body-tiny);
1531
1640
  --wds-form-field-label-font-size-small: var(--wds-font-size-body-small);
1532
1641
  --wds-form-field-label-fill: var(--wds-color-text-standard-secondary);
@@ -1579,22 +1688,72 @@
1579
1688
  --wds-card-gallery-item-overlay-fill: var(--wds-color-fill-transparent-primary);
1580
1689
  --wds-card-gallery-item-fill: var(--wds-color-fill-surface-default);
1581
1690
  --wds-button-text-hover: var(--wds-color-text-standard-primary-light);
1582
- --wds-button-label-font-size-large: var(--wds-font-size-body-medium);
1583
1691
  --wds-button-label-fill-transparent-tertiary: var(--wds-color-text-standard-primary-light);
1584
- --wds-button-label-fill-standard-secondary: var(--wds-color-text-primary);
1692
+ --wds-button-label-fill-standard-secondary-hover: var(--wds-color-text-standard-primary-light);
1693
+ --wds-button-label-fill-standard-secondary-disabled: var(--wds-color-text-disabled);
1694
+ --wds-button-label-fill-standard-secondary-active: var(--wds-color-text-standard-primary-light);
1695
+ --wds-button-label-fill-standard-secondary: var(--wds-color-text-standard-primary-light);
1696
+ --wds-button-label-fill-standard-primary-disabled: var(--wds-color-text-disabled-light);
1697
+ --wds-button-label-fill-premium-secondary-hover: var(--wds-color-text-standard-primary-light);
1698
+ --wds-button-label-fill-premium-secondary-disabled: var(--wds-color-text-disabled);
1699
+ --wds-button-label-fill-premium-secondary-active: var(--wds-color-text-standard-primary-light);
1700
+ --wds-button-label-fill-premium-secondary: var(--wds-color-text-premium);
1701
+ --wds-button-label-fill-premium-primary-disabled: var(--wds-color-text-disabled-light);
1702
+ --wds-button-label-fill-destructive-secondary-hover: var(--wds-color-text-standard-primary-light);
1703
+ --wds-button-label-fill-destructive-secondary-disabled: var(--wds-color-text-disabled);
1704
+ --wds-button-label-fill-destructive-secondary-active: var(--wds-color-text-standard-primary-light);
1705
+ --wds-button-label-fill-destructive-secondary: var(--wds-color-text-destructive);
1706
+ --wds-button-label-fill-destructive-primary-disabled: var(--wds-color-text-disabled-light);
1707
+ --wds-button-label-fill-dark-secondary-hover: var(--wds-color-text-standard-primary-light);
1708
+ --wds-button-label-fill-dark-secondary-disabled: var(--wds-color-text-disabled);
1709
+ --wds-button-label-fill-dark-secondary-active: var(--wds-color-text-standard-primary-light);
1710
+ --wds-button-label-fill-dark-secondary: var(--wds-color-text-standard-primary);
1711
+ --wds-button-label-fill-dark-primary-disabled: var(--wds-color-text-disabled-light);
1585
1712
  --wds-button-font-size-tiny: var(--wds-font-size-body-tiny);
1586
1713
  --wds-button-font-size-small: var(--wds-font-size-body-small);
1587
1714
  --wds-button-font-size-medium: var(--wds-font-size-body-medium);
1588
1715
  --wds-button-font-size-large: var(--wds-font-size-body-medium);
1589
1716
  --wds-button-fill-standard-secondary-hover: var(--wds-color-fill-standard-primary);
1717
+ --wds-button-fill-standard-secondary-disabled: var(--wds-color-fill-standard-tertiary);
1590
1718
  --wds-button-fill-standard-secondary-active: linear-gradient(0deg, var(--wds-color-fill-standard-primary-active) 0%, var(--wds-color-fill-standard-primary-active) 100%);
1591
1719
  --wds-button-fill-standard-secondary: var(--wds-color-fill-standard-tertiary);
1592
1720
  --wds-button-fill-standard-primary-hover: var(--wds-color-fill-standard-primary-hover);
1721
+ --wds-button-fill-standard-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1593
1722
  --wds-button-fill-standard-primary-active: var(--wds-color-fill-standard-primary-active);
1594
1723
  --wds-button-fill-standard-primary: var(--wds-color-fill-standard-primary);
1724
+ --wds-button-fill-premium-secondary-hover: var(--wds-color-fill-premium-primary-hover);
1725
+ --wds-button-fill-premium-secondary-disabled: var(--wds-color-fill-premium-tertiary-disabled);
1726
+ --wds-button-fill-premium-secondary-active: var(--wds-color-fill-premium-primary-active);
1727
+ --wds-button-fill-premium-secondary: var(--wds-color-fill-premium-tertiary);
1728
+ --wds-button-fill-premium-primary-disabled: var(--wds-color-fill-premium-primary-disabled);
1595
1729
  --wds-button-fill-gradient-hover-secondary: var(--wds-color-fill-standard-primary-hover);
1596
1730
  --wds-button-fill-gradient-hover-primary: var(--wds-color-fill-standard-primary-hover);
1597
- --wds-button-border-fill-standard-secondary: var(--wds-color-border-standard-secondary);
1731
+ --wds-button-fill-destructive-secondary-hover: var(--wds-color-fill-destructive-primary-hover);
1732
+ --wds-button-fill-destructive-secondary-disabled: var(--wds-color-fill-destructive-tertiary-disabled);
1733
+ --wds-button-fill-destructive-secondary-active: var(--wds-color-fill-destructive-primary-active);
1734
+ --wds-button-fill-destructive-secondary: var(--wds-color-fill-standard-tertiary);
1735
+ --wds-button-fill-destructive-primary-disabled: var(--wds-color-fill-destructive-primary-disabled);
1736
+ --wds-button-fill-dark-secondary-hover: var(--wds-color-fill-dark-primary-hover);
1737
+ --wds-button-fill-dark-secondary-disabled: var(--wds-color-fill-dark-tertiary-disabled);
1738
+ --wds-button-fill-dark-secondary-active: var(--wds-color-fill-dark-primary);
1739
+ --wds-button-fill-dark-secondary: var(--wds-color-fill-dark-tertiary);
1740
+ --wds-button-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
1741
+ --wds-button-border-standard-secondary-hover: var(--wds-color-border-standard-primary-active);
1742
+ --wds-button-border-standard-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
1743
+ --wds-button-border-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
1744
+ --wds-button-border-standard-secondary: var(--wds-color-border-standard-secondary);
1745
+ --wds-button-border-premium-secondary-hover: var(--wds-color-border-premium-primary-active);
1746
+ --wds-button-border-premium-secondary-disabled: var(--wds-color-border-premium-secondary-disabled);
1747
+ --wds-button-border-premium-secondary-active: var(--wds-color-fill-premium-primary-active);
1748
+ --wds-button-border-premium-secondary: var(--wds-color-border-premium-secondary);
1749
+ --wds-button-border-destructive-secondary-hover: var(--wds-color-border-destructive-secondary-active);
1750
+ --wds-button-border-destructive-secondary-disabled: var(--wds-color-border-destructive-primary-disabled);
1751
+ --wds-button-border-destructive-secondary-active: var(--wds-color-fill-destructive-primary-active);
1752
+ --wds-button-border-destructive-secondary: var(--wds-color-border-destructive-secondary);
1753
+ --wds-button-border-dark-secondary-hover: var(--wds-color-border-dark-primary-active);
1754
+ --wds-button-border-dark-secondary-disabled: var(--wds-color-border-premium-secondary-disabled);
1755
+ --wds-button-border-dark-secondary-active: var(--wds-color-fill-dark-primary);
1756
+ --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
1598
1757
  --wds-announcement-modal-text-font-size: var(--wds-font-size-body-medium);
1599
1758
  --wds-add-item-title-font-size-small: var(--wds-font-size-body-small);
1600
1759
  --wds-add-item-title-font-size-medium: var(--wds-font-size-body-medium);
@@ -1648,6 +1807,7 @@
1648
1807
  --wds-button-font-line-height-small: var(--wds-font-line-height-body-small);
1649
1808
  --wds-button-font-line-height-medium: var(--wds-font-line-height-body-medium);
1650
1809
  --wds-button-font-line-height-large: var(--wds-font-line-height-body-medium);
1810
+ --wds-button-font-line-height-extra-large: var(--wds-font-line-height-body-medium);
1651
1811
  --wds-announcement-modal-text-font-line-height: var(--wds-font-line-height-body-medium);
1652
1812
  --wds-add-item-title-font-line-height-tiny: var(--wds-font-line-height-body-small);
1653
1813
  --wds-add-item-title-font-line-height-medium: var(--wds-font-line-height-body-medium);