@wix/design-system-tokens 1.120.0 → 1.121.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 (22) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/all.css +165 -13
  3. package/all.st.css +319 -15
  4. package/component.st.css +309 -15
  5. package/foundation.st.css +2 -0
  6. package/odeditor/all.css +35 -28
  7. package/odeditor/all.st.css +76 -62
  8. package/odeditor/component.st.css +43 -39
  9. package/odeditor/foundation.st.css +2 -0
  10. package/odeditor/semantic.st.css +31 -23
  11. package/package.json +2 -2
  12. package/semantic.st.css +8 -0
  13. package/studio/all.css +164 -12
  14. package/studio/all.st.css +317 -13
  15. package/studio/component.st.css +307 -13
  16. package/studio/foundation.st.css +2 -0
  17. package/studio/semantic.st.css +8 -0
  18. package/wixel/all.css +164 -12
  19. package/wixel/all.st.css +318 -14
  20. package/wixel/component.st.css +308 -14
  21. package/wixel/foundation.st.css +2 -0
  22. package/wixel/semantic.st.css +8 -0
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ ## 1.121.0 - 2025-07-24
2
+
3
+ ### Visual Breaking Changes
4
+
5
+ - breaking(Button): tokenization for Editor3 [15091](https://github.com/wix-private/wix-design-systems/pull/15091)
6
+ - breaking(IconButton): new component level tokens implemented [15097](https://github.com/wix-private/wix-design-systems/pull/15097)
7
+
1
8
  ## 1.120.0 - 2025-07-16
2
9
 
3
10
  ### 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);
@@ -845,6 +850,8 @@
845
850
  --wds-swatches-list-gap: var(--wds-space-200);
846
851
  --wds-stepper-prefix-size-number: var(--wds-space-400);
847
852
  --wds-stepper-prefix-size-circle: var(--wds-space-500);
853
+ --wds-status-toast-vertical-padding: var(--wds-space-150);
854
+ --wds-status-toast-horizontal-padding: var(--wds-space-200);
848
855
  --wds-social-preview-content-padding-vertical: var(--wds-space-150);
849
856
  --wds-social-preview-content-padding-horizontal: var(--wds-space-200);
850
857
  --wds-social-post-preview-content-padding-vertical: var(--wds-space-200);
@@ -852,6 +859,7 @@
852
859
  --wds-slider-track-border-radius-transparent: var(--wds-border-radius-full);
853
860
  --wds-slider-track-border-border-radius: var(--wds-border-radius-full);
854
861
  --wds-slider-slider-mark-size: var(--wds-space-100);
862
+ --wds-slider-slider-knob-color-disabled: var(--wds-color-black-500);
855
863
  --wds-skeleton-border-radius-rectangle: var(--wds-border-radius-300);
856
864
  --wds-skeleton-border-radius-line: var(--wds-border-radius-full);
857
865
  --wds-skeleton-border-radius-circle: var(--wds-border-radius-full);
@@ -1238,6 +1246,9 @@
1238
1246
  --wds-button-gap-medium: var(--wds-space-100);
1239
1247
  --wds-button-gap-large: var(--wds-space-200);
1240
1248
  --wds-button-font-weight-tiny: var(--wds-font-weight-bold);
1249
+ --wds-button-font-weight-small: var(--wds-font-weight-medium);
1250
+ --wds-button-font-weight-medium: var(--wds-font-weight-medium);
1251
+ --wds-button-font-weight-large: var(--wds-font-weight-medium);
1241
1252
  --wds-button-border-radius-tiny: var(--wds-border-radius-full);
1242
1253
  --wds-button-border-radius-small: var(--wds-border-radius-full);
1243
1254
  --wds-button-border-radius-medium: var(--wds-border-radius-full);
@@ -1399,7 +1410,7 @@
1399
1410
  --wds-status-toast-text-fill: var(--wds-color-text-standard-primary-light);
1400
1411
  --wds-status-toast-info-icon-fill: var(--wds-color-text-standard-primary-light);
1401
1412
  --wds-slider-track-color: var(--wds-color-fill-standard-secondary);
1402
- --wds-slider-slider-knob-color-hover: var(--wds-color-fill-standard-primary);
1413
+ --wds-slider-slider-knob-color-hover: var(--wds-color-fill-standard-primary-hover);
1403
1414
  --wds-slider-slider-knob-color: var(--wds-color-fill-standard-primary);
1404
1415
  --wds-sidebar-item-text-neutral-disabled: var(--wds-color-text-disabled);
1405
1416
  --wds-sidebar-item-text-neutral-default: var(--wds-color-text-standard-secondary);
@@ -1506,27 +1517,117 @@
1506
1517
  --wds-input-background-fill-default: var(--wds-color-fill-standard-tertiary);
1507
1518
  --wds-info-icon-fill-hover: var(--wds-color-text-primary);
1508
1519
  --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);
1520
+ --wds-icon-button-color-text-standard-tertiary-hover: var(--wds-color-text-primary);
1521
+ --wds-icon-button-color-text-standard-tertiary-disabled: var(--wds-color-text-disabled);
1522
+ --wds-icon-button-color-text-standard-tertiary-active: var(--wds-color-text-primary);
1511
1523
  --wds-icon-button-color-text-standard-tertiary: var(--wds-color-text-primary);
1512
1524
  --wds-icon-button-color-text-standard-secondary-hover: var(--wds-color-text-standard-primary-light);
1525
+ --wds-icon-button-color-text-standard-secondary-disabled: var(--wds-color-text-disabled);
1513
1526
  --wds-icon-button-color-text-standard-secondary-active: var(--wds-color-text-standard-primary-light);
1514
1527
  --wds-icon-button-color-text-standard-secondary: var(--wds-color-text-primary);
1515
1528
  --wds-icon-button-color-text-standard-primary-hover: var(--wds-color-text-standard-primary-light);
1529
+ --wds-icon-button-color-text-standard-primary-disabled: var(--wds-color-text-disabled-light);
1516
1530
  --wds-icon-button-color-text-standard-primary-active: var(--wds-color-text-standard-primary-light);
1517
1531
  --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);
1532
+ --wds-icon-button-color-text-premium-tertiary-hover: var(--wds-color-text-premium);
1533
+ --wds-icon-button-color-text-premium-tertiary-disabled: var(--wds-color-text-disabled);
1534
+ --wds-icon-button-color-text-premium-tertiary-active: var(--wds-color-text-premium);
1535
+ --wds-icon-button-color-text-premium-tertiary: var(--wds-color-text-premium);
1536
+ --wds-icon-button-color-text-premium-secondary-hover: var(--wds-color-text-standard-primary-light);
1537
+ --wds-icon-button-color-text-premium-secondary-disabled: var(--wds-color-text-disabled);
1538
+ --wds-icon-button-color-text-premium-secondary-active: var(--wds-color-text-standard-primary-light);
1539
+ --wds-icon-button-color-text-premium-secondary: var(--wds-color-text-premium);
1540
+ --wds-icon-button-color-text-premium-primary-hover: var(--wds-color-text-standard-primary-light);
1541
+ --wds-icon-button-color-text-premium-primary-disabled: var(--wds-color-text-disabled-light);
1542
+ --wds-icon-button-color-text-premium-primary-active: var(--wds-color-text-standard-primary-light);
1543
+ --wds-icon-button-color-text-premium-primary: var(--wds-color-text-standard-primary-light);
1544
+ --wds-icon-button-color-text-light-tertiary-hover: var(--wds-color-text-primary);
1545
+ --wds-icon-button-color-text-light-tertiary-disabled: var(--wds-color-text-disabled-light);
1546
+ --wds-icon-button-color-text-light-tertiary-active: var(--wds-color-text-primary);
1547
+ --wds-icon-button-color-text-light-tertiary: var(--wds-color-text-standard-primary-light);
1548
+ --wds-icon-button-color-text-light-secondary-hover: var(--wds-color-text-primary);
1549
+ --wds-icon-button-color-text-light-secondary-disabled: var(--wds-color-text-disabled);
1550
+ --wds-icon-button-color-text-light-secondary-active: var(--wds-color-text-primary);
1551
+ --wds-icon-button-color-text-light-secondary: var(--wds-color-text-standard-primary-light);
1552
+ --wds-icon-button-color-text-light-primary-hover: var(--wds-color-text-primary);
1553
+ --wds-icon-button-color-text-light-primary-disabled: var(--wds-color-text-disabled);
1554
+ --wds-icon-button-color-text-light-primary-active: var(--wds-color-text-primary);
1555
+ --wds-icon-button-color-text-light-primary: var(--wds-color-text-primary);
1556
+ --wds-icon-button-color-text-dark-tertiary-hover: var(--wds-color-text-standard-primary);
1557
+ --wds-icon-button-color-text-dark-tertiary-disabled: var(--wds-color-text-disabled);
1558
+ --wds-icon-button-color-text-dark-tertiary-active: var(--wds-color-text-standard-primary);
1559
+ --wds-icon-button-color-text-dark-tertiary: var(--wds-color-text-standard-primary);
1560
+ --wds-icon-button-color-text-dark-secondary-hover: var(--wds-color-text-standard-primary-light);
1561
+ --wds-icon-button-color-text-dark-secondary-disabled: var(--wds-color-text-disabled);
1562
+ --wds-icon-button-color-text-dark-secondary-active: var(--wds-color-text-standard-primary-light);
1563
+ --wds-icon-button-color-text-dark-secondary: var(--wds-color-text-standard-primary);
1564
+ --wds-icon-button-color-text-dark-primary-hover: var(--wds-color-text-standard-primary-light);
1565
+ --wds-icon-button-color-text-dark-primary-disabled: var(--wds-color-text-disabled-light);
1566
+ --wds-icon-button-color-text-dark-primary-active: var(--wds-color-text-standard-primary-light);
1567
+ --wds-icon-button-color-text-dark-primary: var(--wds-color-text-standard-primary-light);
1568
+ --wds-icon-button-color-fill-standard-tertiary-hover: var(--wds-color-fill-light-secondary-hover);
1569
+ --wds-icon-button-color-fill-standard-tertiary-disabled: var(--wds-color-fill-light-secondary-disabled);
1570
+ --wds-icon-button-color-fill-standard-tertiary-active: var(--wds-color-fill-light-secondary-active);
1571
+ --wds-icon-button-color-fill-standard-tertiary: var(--wds-color-fill-light-secondary);
1521
1572
  --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);
1573
+ --wds-icon-button-color-fill-standard-secondary-disabled: var(--wds-color-fill-standard-tertiary-disabled);
1574
+ --wds-icon-button-color-fill-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
1523
1575
  --wds-icon-button-color-fill-standard-secondary: var(--wds-color-fill-standard-tertiary);
1524
1576
  --wds-icon-button-color-fill-standard-primary-hover: var(--wds-color-fill-standard-primary-hover);
1577
+ --wds-icon-button-color-fill-standard-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1525
1578
  --wds-icon-button-color-fill-standard-primary-active: var(--wds-color-fill-standard-primary-active);
1526
1579
  --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);
1580
+ --wds-icon-button-color-fill-premium-tertiary-hover: var(--wds-color-fill-premium-light-secondary-hover);
1581
+ --wds-icon-button-color-fill-premium-tertiary-disabled: var(--wds-color-fill-premium-light-secondary-disabled);
1582
+ --wds-icon-button-color-fill-premium-tertiary-active: var(--wds-color-fill-premium-light-secondary-active);
1583
+ --wds-icon-button-color-fill-premium-tertiary: var(--wds-color-fill-premium-light-secondary);
1584
+ --wds-icon-button-color-fill-premium-secondary-hover: var(--wds-color-fill-premium-primary-hover);
1585
+ --wds-icon-button-color-fill-premium-secondary-disabled: var(--wds-color-fill-premium-tertiary-disabled);
1586
+ --wds-icon-button-color-fill-premium-secondary-active: var(--wds-color-fill-premium-primary-active);
1587
+ --wds-icon-button-color-fill-premium-secondary: var(--wds-color-fill-premium-tertiary);
1588
+ --wds-icon-button-color-fill-premium-primary-hover: var(--wds-color-fill-premium-primary-hover);
1589
+ --wds-icon-button-color-fill-premium-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1590
+ --wds-icon-button-color-fill-premium-primary-active: var(--wds-color-fill-premium-primary-active);
1591
+ --wds-icon-button-color-fill-premium-primary: var(--wds-color-fill-premium-primary);
1592
+ --wds-icon-button-color-fill-light-tertiary-hover: var(--wds-color-fill-light-secondary-hover);
1593
+ --wds-icon-button-color-fill-light-tertiary-disabled: var(--wds-color-fill-light-secondary-disabled);
1594
+ --wds-icon-button-color-fill-light-tertiary-active: var(--wds-color-fill-light-secondary-active);
1595
+ --wds-icon-button-color-fill-light-tertiary: var(--wds-color-fill-light-secondary);
1596
+ --wds-icon-button-color-fill-light-secondary-hover: var(--wds-color-fill-light-secondary-hover);
1597
+ --wds-icon-button-color-fill-light-secondary-disabled: var(--wds-color-fill-light-secondary-disabled);
1598
+ --wds-icon-button-color-fill-light-secondary-active: var(--wds-color-fill-light-secondary-active);
1599
+ --wds-icon-button-color-fill-light-secondary: var(--wds-color-fill-light-secondary);
1600
+ --wds-icon-button-color-fill-light-primary-hover: var(--wds-color-fill-light-primary-hover);
1601
+ --wds-icon-button-color-fill-light-primary-disabled: var(--wds-color-fill-light-primary-disabled);
1602
+ --wds-icon-button-color-fill-light-primary-active: var(--wds-color-fill-light-primary-active);
1603
+ --wds-icon-button-color-fill-light-primary: var(--wds-color-fill-light-primary);
1604
+ --wds-icon-button-color-fill-dark-tertiary-hover: var(--wds-color-fill-dark-tertiary-hover);
1605
+ --wds-icon-button-color-fill-dark-tertiary-disabled: var(--wds-color-fill-light-secondary-disabled);
1606
+ --wds-icon-button-color-fill-dark-tertiary-active: var(--wds-color-fill-dark-tertiary-active);
1607
+ --wds-icon-button-color-fill-dark-tertiary: var(--wds-color-fill-light-secondary);
1608
+ --wds-icon-button-color-fill-dark-secondary-hover: var(--wds-color-fill-dark-primary-hover);
1609
+ --wds-icon-button-color-fill-dark-secondary-disabled: var(--wds-color-fill-light-secondary-disabled);
1610
+ --wds-icon-button-color-fill-dark-secondary-active: var(--wds-color-fill-dark-primary-active);
1611
+ --wds-icon-button-color-fill-dark-secondary: var(--wds-color-fill-light-secondary);
1612
+ --wds-icon-button-color-fill-dark-primary-hover: var(--wds-color-fill-dark-primary-hover);
1613
+ --wds-icon-button-color-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
1614
+ --wds-icon-button-color-fill-dark-primary-active: var(--wds-color-fill-dark-primary-active);
1615
+ --wds-icon-button-color-fill-dark-primary: var(--wds-color-fill-dark-primary);
1616
+ --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-border-standard-secondary-hover);
1617
+ --wds-icon-button-color-border-standard-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
1618
+ --wds-icon-button-color-border-standard-secondary-active: var(--wds-color-border-standard-secondary-active);
1529
1619
  --wds-icon-button-color-border-standard-secondary: var(--wds-color-border-standard-secondary);
1620
+ --wds-icon-button-color-border-premium-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
1621
+ --wds-icon-button-color-border-premium-secondary-active: var(--wds-color-border-premium-secondary-active);
1622
+ --wds-icon-button-color-border-premium-secondary: var(--wds-color-border-premium-secondary);
1623
+ --wds-icon-button-color-border-light-secondary-hover: var(--wds-color-border-light-hover);
1624
+ --wds-icon-button-color-border-light-secondary-disabled: var(--wds-color-border-light-disabled);
1625
+ --wds-icon-button-color-border-light-secondary-active: var(--wds-color-border-light-active);
1626
+ --wds-icon-button-color-border-light-secondary: var(--wds-color-border-light);
1627
+ --wds-icon-button-color-border-dark-secondary-hover: var(--wds-color-border-dark-primary-active);
1628
+ --wds-icon-button-color-border-dark-secondary-disabled: var(--wds-color-border-dark-secondary-disabled);
1629
+ --wds-icon-button-color-border-dark-secondary-active: var(--wds-color-border-dark-primary-active);
1630
+ --wds-icon-button-color-border-dark-secondary: var(--wds-color-border-dark-primary);
1530
1631
  --wds-form-field-label-font-size-tiny: var(--wds-font-size-body-tiny);
1531
1632
  --wds-form-field-label-font-size-small: var(--wds-font-size-body-small);
1532
1633
  --wds-form-field-label-fill: var(--wds-color-text-standard-secondary);
@@ -1579,22 +1680,72 @@
1579
1680
  --wds-card-gallery-item-overlay-fill: var(--wds-color-fill-transparent-primary);
1580
1681
  --wds-card-gallery-item-fill: var(--wds-color-fill-surface-default);
1581
1682
  --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
1683
  --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);
1684
+ --wds-button-label-fill-standard-secondary-hover: var(--wds-color-text-standard-primary-light);
1685
+ --wds-button-label-fill-standard-secondary-disabled: var(--wds-color-text-disabled);
1686
+ --wds-button-label-fill-standard-secondary-active: var(--wds-color-text-standard-primary-light);
1687
+ --wds-button-label-fill-standard-secondary: var(--wds-color-text-standard-primary-light);
1688
+ --wds-button-label-fill-standard-primary-disabled: var(--wds-color-text-disabled-light);
1689
+ --wds-button-label-fill-premium-secondary-hover: var(--wds-color-text-standard-primary-light);
1690
+ --wds-button-label-fill-premium-secondary-disabled: var(--wds-color-text-disabled);
1691
+ --wds-button-label-fill-premium-secondary-active: var(--wds-color-text-standard-primary-light);
1692
+ --wds-button-label-fill-premium-secondary: var(--wds-color-text-premium);
1693
+ --wds-button-label-fill-premium-primary-disabled: var(--wds-color-text-disabled-light);
1694
+ --wds-button-label-fill-destructive-secondary-hover: var(--wds-color-text-standard-primary-light);
1695
+ --wds-button-label-fill-destructive-secondary-disabled: var(--wds-color-text-disabled);
1696
+ --wds-button-label-fill-destructive-secondary-active: var(--wds-color-text-standard-primary-light);
1697
+ --wds-button-label-fill-destructive-secondary: var(--wds-color-text-destructive);
1698
+ --wds-button-label-fill-destructive-primary-disabled: var(--wds-color-text-disabled-light);
1699
+ --wds-button-label-fill-dark-secondary-hover: var(--wds-color-text-standard-primary-light);
1700
+ --wds-button-label-fill-dark-secondary-disabled: var(--wds-color-text-disabled);
1701
+ --wds-button-label-fill-dark-secondary-active: var(--wds-color-text-standard-primary-light);
1702
+ --wds-button-label-fill-dark-secondary: var(--wds-color-text-standard-primary);
1703
+ --wds-button-label-fill-dark-primary-disabled: var(--wds-color-text-disabled-light);
1585
1704
  --wds-button-font-size-tiny: var(--wds-font-size-body-tiny);
1586
1705
  --wds-button-font-size-small: var(--wds-font-size-body-small);
1587
1706
  --wds-button-font-size-medium: var(--wds-font-size-body-medium);
1588
1707
  --wds-button-font-size-large: var(--wds-font-size-body-medium);
1589
1708
  --wds-button-fill-standard-secondary-hover: var(--wds-color-fill-standard-primary);
1709
+ --wds-button-fill-standard-secondary-disabled: var(--wds-color-fill-standard-tertiary);
1590
1710
  --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
1711
  --wds-button-fill-standard-secondary: var(--wds-color-fill-standard-tertiary);
1592
1712
  --wds-button-fill-standard-primary-hover: var(--wds-color-fill-standard-primary-hover);
1713
+ --wds-button-fill-standard-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1593
1714
  --wds-button-fill-standard-primary-active: var(--wds-color-fill-standard-primary-active);
1594
1715
  --wds-button-fill-standard-primary: var(--wds-color-fill-standard-primary);
1716
+ --wds-button-fill-premium-secondary-hover: var(--wds-color-fill-premium-primary-hover);
1717
+ --wds-button-fill-premium-secondary-disabled: var(--wds-color-fill-premium-tertiary-disabled);
1718
+ --wds-button-fill-premium-secondary-active: var(--wds-color-fill-premium-primary-active);
1719
+ --wds-button-fill-premium-secondary: var(--wds-color-fill-premium-tertiary);
1720
+ --wds-button-fill-premium-primary-disabled: var(--wds-color-fill-premium-primary-disabled);
1595
1721
  --wds-button-fill-gradient-hover-secondary: var(--wds-color-fill-standard-primary-hover);
1596
1722
  --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);
1723
+ --wds-button-fill-destructive-secondary-hover: var(--wds-color-fill-destructive-primary-hover);
1724
+ --wds-button-fill-destructive-secondary-disabled: var(--wds-color-fill-destructive-tertiary-disabled);
1725
+ --wds-button-fill-destructive-secondary-active: var(--wds-color-fill-destructive-primary-active);
1726
+ --wds-button-fill-destructive-secondary: var(--wds-color-fill-standard-tertiary);
1727
+ --wds-button-fill-destructive-primary-disabled: var(--wds-color-fill-destructive-primary-disabled);
1728
+ --wds-button-fill-dark-secondary-hover: var(--wds-color-fill-dark-primary-hover);
1729
+ --wds-button-fill-dark-secondary-disabled: var(--wds-color-fill-dark-tertiary-disabled);
1730
+ --wds-button-fill-dark-secondary-active: var(--wds-color-fill-dark-primary);
1731
+ --wds-button-fill-dark-secondary: var(--wds-color-fill-dark-tertiary);
1732
+ --wds-button-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
1733
+ --wds-button-border-standard-secondary-hover: var(--wds-color-border-standard-primary-active);
1734
+ --wds-button-border-standard-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
1735
+ --wds-button-border-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
1736
+ --wds-button-border-standard-secondary: var(--wds-color-border-standard-secondary);
1737
+ --wds-button-border-premium-secondary-hover: var(--wds-color-border-premium-primary-active);
1738
+ --wds-button-border-premium-secondary-disabled: var(--wds-color-border-premium-secondary-disabled);
1739
+ --wds-button-border-premium-secondary-active: var(--wds-color-fill-premium-primary-active);
1740
+ --wds-button-border-premium-secondary: var(--wds-color-border-premium-secondary);
1741
+ --wds-button-border-destructive-secondary-hover: var(--wds-color-border-destructive-secondary-active);
1742
+ --wds-button-border-destructive-secondary-disabled: var(--wds-color-border-destructive-primary-disabled);
1743
+ --wds-button-border-destructive-secondary-active: var(--wds-color-fill-destructive-primary-active);
1744
+ --wds-button-border-destructive-secondary: var(--wds-color-border-destructive-secondary);
1745
+ --wds-button-border-dark-secondary-hover: var(--wds-color-border-dark-primary-active);
1746
+ --wds-button-border-dark-secondary-disabled: var(--wds-color-border-premium-secondary-disabled);
1747
+ --wds-button-border-dark-secondary-active: var(--wds-color-fill-dark-primary);
1748
+ --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
1598
1749
  --wds-announcement-modal-text-font-size: var(--wds-font-size-body-medium);
1599
1750
  --wds-add-item-title-font-size-small: var(--wds-font-size-body-small);
1600
1751
  --wds-add-item-title-font-size-medium: var(--wds-font-size-body-medium);
@@ -1648,6 +1799,7 @@
1648
1799
  --wds-button-font-line-height-small: var(--wds-font-line-height-body-small);
1649
1800
  --wds-button-font-line-height-medium: var(--wds-font-line-height-body-medium);
1650
1801
  --wds-button-font-line-height-large: var(--wds-font-line-height-body-medium);
1802
+ --wds-button-font-line-height-extra-large: var(--wds-font-line-height-body-medium);
1651
1803
  --wds-announcement-modal-text-font-line-height: var(--wds-font-line-height-body-medium);
1652
1804
  --wds-add-item-title-font-line-height-tiny: var(--wds-font-line-height-body-small);
1653
1805
  --wds-add-item-title-font-line-height-medium: var(--wds-font-line-height-body-medium);