@wix/design-system-tokens 1.145.0 → 1.149.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 (23) hide show
  1. package/CHANGELOG.md +34 -0
  2. package/all.css +19 -3
  3. package/all.scss +19 -3
  4. package/all.st.css +37 -5
  5. package/component.st.css +30 -4
  6. package/foundation.st.css +6 -0
  7. package/odeditor/all.css +38 -21
  8. package/odeditor/all.scss +38 -21
  9. package/odeditor/all.st.css +58 -24
  10. package/odeditor/component.st.css +47 -21
  11. package/odeditor/foundation.st.css +6 -0
  12. package/odeditor/semantic.st.css +5 -3
  13. package/package.json +2 -2
  14. package/semantic.st.css +1 -1
  15. package/studio/all.css +20 -3
  16. package/studio/all.scss +20 -3
  17. package/studio/all.st.css +38 -4
  18. package/studio/component.st.css +32 -4
  19. package/studio/foundation.st.css +6 -0
  20. package/wixel/all.css +4 -2
  21. package/wixel/all.scss +4 -2
  22. package/wixel/all.st.css +8 -4
  23. package/wixel/component.st.css +8 -4
package/odeditor/all.css CHANGED
@@ -34,16 +34,19 @@
34
34
  --wds-shadow-focus-spread: 0;
35
35
  --wds-shadow-y-tertiary-toggle-button: 0.4px;
36
36
  --wds-shadow-y-secondary-toggle-button: 1.2px;
37
+ --wds-shadow-y-600: 20px;
37
38
  --wds-shadow-y-350: 10px;
38
39
  --wds-shadow-y-300: 12px;
39
40
  --wds-shadow-y-200: 8px;
40
41
  --wds-shadow-y-150: 6px;
42
+ --wds-shadow-y-125: 5px;
41
43
  --wds-shadow-y-100: 4px;
42
44
  --wds-shadow-y-50: 2px;
43
45
  --wds-shadow-y-25: 1px;
44
46
  --wds-shadow-y-0: 0px;
45
47
  --wds-shadow-x-tertiary-toggle-button: 0.4px;
46
48
  --wds-shadow-x-secondary-toggle-button: 1.2px;
49
+ --wds-shadow-x-50: 2px;
47
50
  --wds-shadow-x-25: 1px;
48
51
  --wds-shadow-x-0: 0px;
49
52
  --wds-shadow-blur-tertiary-toggle-button: 0.6px;
@@ -390,6 +393,7 @@
390
393
  --wds-space-padding-horizontal-large: var(--wds-space-400);
391
394
  --wds-space-mobile-viewport-spacing: var(--wds-space-800);
392
395
  --wds-shadow-x-secondary-raised: var(--wds-shadow-x-25);
396
+ --wds-shadow-surface-modal: var(--wds-shadow-x-50) var(--wds-shadow-y-600) var(--wds-shadow-blur-800) var(--wds-color-black-100-transparent-10), 0 var(--wds-shadow-blur-0) var(--wds-shadow-y-0) var(--wds-color-black-100-transparent-0);
393
397
  --wds-shadow-focus-warning: 0 0 0 var(--wds-color-yellow-400);
394
398
  --wds-shadow-focus-standard: 0 0 0 3px var(--wds-color-blue-300);
395
399
  --wds-shadow-focus-inner-warning: 0 0 0 3px var(--wds-color-yellow-400) inset;
@@ -411,7 +415,7 @@
411
415
  --wds-shadow-fill-primary-raised: var(--wds-color-black-100-transparent-5);
412
416
  --wds-shadow-fill-primary-overlay-dark: var(--wds-color-black-100-transparent-15);
413
417
  --wds-shadow-fill-primary-overlay: var(--wds-color-black-100-transparent-10);
414
- --wds-shadow-fill-primary-modal: var(--wds-color-black-100-transparent-15);
418
+ --wds-shadow-fill-primary-modal: var(--wds-color-black-100-transparent-10);
415
419
  --wds-shadow-fill-input: var(--wds-color-black-300-transparent-20);
416
420
  --wds-shadow-y-secondary-toggle: var(--wds-shadow-y-0);
417
421
  --wds-shadow-y-secondary-raised: var(--wds-shadow-y-0);
@@ -423,9 +427,10 @@
423
427
  --wds-shadow-y-primary-raised: var(--wds-shadow-y-25);
424
428
  --wds-shadow-y-primary-overlay-dark: var(--wds-shadow-y-0);
425
429
  --wds-shadow-y-primary-overlay: var(--wds-shadow-y-300);
426
- --wds-shadow-y-primary-modal: var(--wds-shadow-y-300);
430
+ --wds-shadow-y-primary-modal: var(--wds-shadow-y-600);
427
431
  --wds-shadow-y-input: var(--wds-shadow-y-25);
428
432
  --wds-shadow-x-primary-toggle-button: var(--wds-shadow-x-25);
433
+ --wds-shadow-x-primary-modal: var(--wds-shadow-x-50);
429
434
  --wds-shadow-x-input: var(--wds-shadow-x-25);
430
435
  --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;
431
436
  --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;
@@ -830,10 +835,12 @@
830
835
  --wds-toggle-button-padding-medium: var(--wds-space-300);
831
836
  --wds-toggle-button-padding-large-round: var(--wds-space-600);
832
837
  --wds-toggle-button-padding-large: var(--wds-space-600);
838
+ --wds-toggle-button-label-font-weight-standard-secondary-selected: var(--wds-font-weight-semi-bold);
833
839
  --wds-toggle-button-label-font-weight-square: var(--wds-font-weight-semi-bold);
834
840
  --wds-toggle-button-label-font-weight-round: var(--wds-font-weight-semi-bold);
835
841
  --wds-toggle-button-label-font-weight-pill: var(--wds-font-weight-semi-bold);
836
842
  --wds-toggle-button-label-fill-standard-selected-disabled: var(--wds-color-black-500);
843
+ --wds-toggle-button-label-fill-standard-secondary-selected-hover: var(--wds-color-blue-50);
837
844
  --wds-toggle-button-label-fill-standard-hover: var(--wds-color-blue-50);
838
845
  --wds-toggle-button-label-fill-standard-disabled: var(--wds-color-black-500);
839
846
  --wds-toggle-button-label-fill-inverted-selected-disabled: var(--wds-color-black-500);
@@ -849,6 +856,9 @@
849
856
  --wds-toggle-button-fill-standard-selected-hover: var(--wds-color-blue-400);
850
857
  --wds-toggle-button-fill-standard-selected-disabled: var(--wds-color-black-700);
851
858
  --wds-toggle-button-fill-standard-selected: var(--wds-color-blue-500);
859
+ --wds-toggle-button-fill-standard-secondary-selected-hover: var(--wds-color-blue-400);
860
+ --wds-toggle-button-fill-standard-secondary-selected: var(--wds-color-blue-500);
861
+ --wds-toggle-button-fill-standard-secondary-hover: var(--wds-color-blue-500);
852
862
  --wds-toggle-button-fill-standard-hover: var(--wds-color-black-100-transparent-0);
853
863
  --wds-toggle-button-fill-standard-disabled: var(--wds-color-black-100-transparent-0);
854
864
  --wds-toggle-button-fill-standard: var(--wds-color-black-100-transparent-0);
@@ -922,6 +932,7 @@
922
932
  --wds-tabs-item-gap-medium: var(--wds-space-200);
923
933
  --wds-tabs-item-fill-hover: var(--wds-color-black-750);
924
934
  --wds-tabs-gap-horizontal: var(--wds-space-100);
935
+ --wds-tabs-container-padding-horizontal: var(--wds-space-400);
925
936
  --wds-tabs-border-radius: var(--wds-border-radius-300);
926
937
  --wds-table-list-item-paddings: var(--wds-space-0);
927
938
  --wds-table-list-item-indentation-level-3: var(--wds-space-700);
@@ -1177,34 +1188,40 @@
1177
1188
  --wds-list-item-select-suffix-pressed: var(--wds-color-blue-50);
1178
1189
  --wds-list-item-select-suffix-active-font-weight: var(--wds-font-weight-medium);
1179
1190
  --wds-list-item-select-padding-vertical-small-screen-small: var(--wds-space-200);
1180
- --wds-list-item-select-padding-vertical-small: var(--wds-space-200);
1191
+ --wds-list-item-select-padding-vertical-small: var(--wds-space-100);
1181
1192
  --wds-list-item-select-padding-vertical-medium-screen-small: var(--wds-space-200);
1182
- --wds-list-item-select-padding-vertical-medium: var(--wds-space-200);
1193
+ --wds-list-item-select-padding-vertical-medium: var(--wds-space-100);
1183
1194
  --wds-list-item-select-padding-right-small: var(--wds-space-400);
1184
1195
  --wds-list-item-select-padding-right-medium: var(--wds-space-400);
1185
1196
  --wds-list-item-select-padding-left-small: var(--wds-space-300);
1186
1197
  --wds-list-item-select-padding-left-medium: var(--wds-space-300);
1187
- --wds-list-item-select-padding-horizontal-small: var(--wds-space-300);
1188
- --wds-list-item-select-padding-horizontal-medium: var(--wds-space-300);
1189
- --wds-list-item-select-label-hover-font-weight-medium: var(--wds-font-weight-semi-bold);
1198
+ --wds-list-item-select-padding-horizontal-small: var(--wds-space-200);
1199
+ --wds-list-item-select-padding-horizontal-medium: var(--wds-space-200);
1190
1200
  --wds-list-item-select-label-font-weight-medium: var(--wds-font-weight-medium);
1191
1201
  --wds-list-item-select-label-font-weight-active: var(--wds-font-weight-bold);
1192
- --wds-list-item-select-gap: var(--wds-space-250);
1202
+ --wds-list-item-select-gap: var(--wds-space-50);
1193
1203
  --wds-list-item-select-border-radius: var(--wds-border-radius-400);
1194
1204
  --wds-list-item-select-affix-margin: var(--wds-space-100);
1195
1205
  --wds-list-item-select-active-fill-hover: var(--wds-color-blue-600);
1196
- --wds-list-item-section-padding-horizontal: var(--wds-space-400);
1206
+ --wds-list-item-section-title-label-fill-neutral: var(--wds-color-black-500);
1207
+ --wds-list-item-section-padding-vertical-neutral: var(--wds-space-250);
1208
+ --wds-list-item-section-padding-top: var(--wds-space-200);
1209
+ --wds-list-item-section-padding-horizontal: var(--wds-space-200);
1210
+ --wds-list-item-section-padding-bottom: var(--wds-space-300);
1211
+ --wds-list-item-section-font-weight-neutral: var(--wds-font-weight-regular);
1197
1212
  --wds-list-item-section-font-weight: var(--wds-font-weight-semi-bold);
1213
+ --wds-list-item-section-divider-padding-top: var(--wds-space-200);
1198
1214
  --wds-list-item-section-divider-padding-horizontal: var(--wds-space-0);
1215
+ --wds-list-item-section-divider-padding-bottom: var(--wds-space-0);
1199
1216
  --wds-list-item-action-title-font-weight-active: var(--wds-font-weight-bold);
1200
1217
  --wds-list-item-action-title-font-weight: var(--wds-font-weight-medium);
1201
1218
  --wds-list-item-action-padding-vertical-small-screen-small: var(--wds-space-200);
1202
1219
  --wds-list-item-action-padding-vertical-small: var(--wds-space-200);
1203
1220
  --wds-list-item-action-padding-vertical-medium-screen-small: var(--wds-space-200);
1204
1221
  --wds-list-item-action-padding-vertical-medium: var(--wds-space-200);
1205
- --wds-list-item-action-padding-horizontal-small: var(--wds-space-300);
1206
- --wds-list-item-action-padding-horizontal-medium: var(--wds-space-300);
1207
- --wds-list-item-action-gap: var(--wds-space-250);
1222
+ --wds-list-item-action-padding-horizontal-small: var(--wds-space-200);
1223
+ --wds-list-item-action-padding-horizontal-medium: var(--wds-space-200);
1224
+ --wds-list-item-action-gap: var(--wds-space-50);
1208
1225
  --wds-list-item-action-border-radius: var(--wds-border-radius-400);
1209
1226
  --wds-list-item-action-affix-margin: var(--wds-space-100);
1210
1227
  --wds-linear-progress-bar-value-gap: var(--wds-space-100);
@@ -1241,10 +1258,9 @@
1241
1258
  --wds-input-border-radius-default-small: var(--wds-border-radius-400);
1242
1259
  --wds-input-border-radius-default-medium: var(--wds-border-radius-400);
1243
1260
  --wds-input-border-radius-default-large: var(--wds-border-radius-400);
1244
- --wds-input-border-color-readonly: var(--wds-color-black-100-transparent-0);
1245
1261
  --wds-input-border-color-disabled: var(--wds-color-black-700);
1246
1262
  --wds-input-border-color: var(--wds-color-black-100-transparent-0);
1247
- --wds-input-background-fill-readonly: var(--wds-color-black-750);
1263
+ --wds-input-background-fill-readonly: var(--wds-color-white);
1248
1264
  --wds-input-background-fill-hover: var(--wds-color-black-750);
1249
1265
  --wds-input-background-fill-disabled: var(--wds-color-black-750);
1250
1266
  --wds-input-background-fill-default: var(--wds-color-black-750);
@@ -1498,7 +1514,6 @@
1498
1514
  --wds-shadow-surface-raised: var(--wds-shadow-200);
1499
1515
  --wds-shadow-surface-overlay-dark: var(--wds-shadow-300);
1500
1516
  --wds-shadow-surface-overlay: var(--wds-shadow-300);
1501
- --wds-shadow-surface-modal: var(--wds-shadow-400);
1502
1517
  --wds-shadow-inner-400-vertical: var(--wds-shadow-inner-300-top), var(--wds-shadow-inner-300-bottom);
1503
1518
  --wds-shadow-inner-400-horizontal: var(--wds-shadow-inner-300-left), var(--wds-shadow-inner-300-right);
1504
1519
  --wds-shadow-inner-300-vertical: var(--wds-shadow-inner-300-top), var(--wds-shadow-inner-300-bottom);
@@ -1581,6 +1596,7 @@
1581
1596
  --wds-toggle-button-label-font-size-square-large: var(--wds-font-size-body-tiny);
1582
1597
  --wds-toggle-button-label-font-size-round-small: var(--wds-font-size-body-tiny);
1583
1598
  --wds-toggle-button-label-fill-standard-selected: var(--wds-color-text-primary);
1599
+ --wds-toggle-button-label-fill-standard-secondary-hover: var(--wds-color-text-standard-primary);
1584
1600
  --wds-toggle-button-label-fill-standard: var(--wds-color-text-standard-primary);
1585
1601
  --wds-toggle-button-label-fill-inverted-selected-hover: var(--wds-color-text-standard-primary);
1586
1602
  --wds-toggle-button-label-fill-inverted-selected: var(--wds-color-text-standard-primary);
@@ -1613,7 +1629,7 @@
1613
1629
  --wds-table-list-item-drag-handle-color: var(--wds-color-text-standard-primary);
1614
1630
  --wds-swatches-fill-disabled: var(--wds-color-fill-dark-secondary);
1615
1631
  --wds-swatches-fill-border-selected: var(--wds-color-border-dark-primary-active);
1616
- --wds-swatches-fill-border-no-value-dash: var(--wds-color-fill-destructive-primary);
1632
+ --wds-swatches-fill-border-no-value-dash: var(--wds-color-border-destructive-primary);
1617
1633
  --wds-swatches-fill-border-no-value: var(--wds-color-border-dark-secondary);
1618
1634
  --wds-subtitle-font-size-medium: var(--wds-font-size-body-tiny);
1619
1635
  --wds-status-toast-text-font-size: var(--wds-font-size-body-small);
@@ -1704,9 +1720,10 @@
1704
1720
  --wds-list-item-select-active-fill-disabled: var(--wds-color-fill-standard-tertiary);
1705
1721
  --wds-list-item-select-active-fill-active-screen-small: var(--wds-color-fill-standard-secondary-active);
1706
1722
  --wds-list-item-select-active-fill-active: var(--wds-color-fill-standard-tertiary-active);
1707
- --wds-list-item-select-active-fill: var(--wds-color-fill-standard-tertiary);
1708
- --wds-list-item-section-title-label-fill: var(--wds-color-text-disabled);
1709
- --wds-list-item-section-font-size: var(--wds-font-size-body-tiny);
1723
+ --wds-list-item-select-active-fill: var(--wds-color-fill-dark-tertiary-active);
1724
+ --wds-list-item-section-title-label-fill: var(--wds-color-text-placeholder);
1725
+ --wds-list-item-section-font-size: var(--wds-font-size-body-small);
1726
+ --wds-list-item-section-fill-neutral: var(--wds-color-fill-standard-tertiary);
1710
1727
  --wds-list-item-section-fill: var(--wds-color-fill-standard-tertiary);
1711
1728
  --wds-list-item-action-suffix-fill-active: var(--wds-color-text-standard-primary);
1712
1729
  --wds-list-item-action-suffix-fill: var(--wds-color-text-standard-primary);
@@ -1814,7 +1831,7 @@
1814
1831
  --wds-icon-button-color-border-light-secondary: var(--wds-color-border-light);
1815
1832
  --wds-icon-button-color-border-dark-secondary-hover: var(--wds-color-border-dark-secondary-hover);
1816
1833
  --wds-icon-button-color-border-dark-secondary-active: var(--wds-color-border-dark-secondary-active);
1817
- --wds-icon-button-color-border-dark-secondary: var(--wds-color-border-dark-secondary);
1834
+ --wds-icon-button-color-border-dark-secondary: var(--wds-color-border-dark-primary);
1818
1835
  --wds-form-field-label-font-size-tiny: var(--wds-font-size-body-extra-tiny);
1819
1836
  --wds-form-field-label-font-size-small: var(--wds-font-size-body-tiny);
1820
1837
  --wds-form-field-label-fill: var(--wds-color-text-standard-secondary);
@@ -1970,7 +1987,7 @@
1970
1987
  --wds-message-modal-text-font-line-height: var(--wds-font-line-height-body-small);
1971
1988
  --wds-list-item-select-label-font-line-height-small: var(--wds-font-line-height-body-small);
1972
1989
  --wds-list-item-select-label-font-line-height-medium: var(--wds-font-line-height-body-medium);
1973
- --wds-list-item-section-font-line-height: var(--wds-font-line-height-body-tiny);
1990
+ --wds-list-item-section-font-line-height: var(--wds-font-line-height-body-small);
1974
1991
  --wds-list-item-action-subtitle-font-line-height: var(--wds-font-line-height-body-tiny);
1975
1992
  --wds-list-item-action-label-font-line-height-small: var(--wds-font-line-height-body-small);
1976
1993
  --wds-list-item-action-label-font-line-height-medium: var(--wds-font-line-height-body-medium);
package/odeditor/all.scss CHANGED
@@ -88,16 +88,19 @@
88
88
  --wds-side-panel-control-layout-divider-border-width: false;
89
89
  --wds-shadow-y-tertiary-toggle-button: 0.4px;
90
90
  --wds-shadow-y-secondary-toggle-button: 1.2px;
91
+ --wds-shadow-y-600: 20px;
91
92
  --wds-shadow-y-350: 10px;
92
93
  --wds-shadow-y-300: 12px;
93
94
  --wds-shadow-y-200: 8px;
94
95
  --wds-shadow-y-150: 6px;
96
+ --wds-shadow-y-125: 5px;
95
97
  --wds-shadow-y-100: 4px;
96
98
  --wds-shadow-y-50: 2px;
97
99
  --wds-shadow-y-25: 1px;
98
100
  --wds-shadow-y-0: 0px;
99
101
  --wds-shadow-x-tertiary-toggle-button: 0.4px;
100
102
  --wds-shadow-x-secondary-toggle-button: 1.2px;
103
+ --wds-shadow-x-50: 2px;
101
104
  --wds-shadow-x-25: 1px;
102
105
  --wds-shadow-x-0: 0px;
103
106
  --wds-shadow-spread-secondary-raised: -0.70;
@@ -413,10 +416,12 @@
413
416
  --wds-toggle-button-padding-medium: var(--wds-space-300);
414
417
  --wds-toggle-button-padding-large-round: var(--wds-space-600);
415
418
  --wds-toggle-button-padding-large: var(--wds-space-600);
419
+ --wds-toggle-button-label-font-weight-standard-secondary-selected: var(--wds-font-weight-semi-bold);
416
420
  --wds-toggle-button-label-font-weight-square: var(--wds-font-weight-semi-bold);
417
421
  --wds-toggle-button-label-font-weight-round: var(--wds-font-weight-semi-bold);
418
422
  --wds-toggle-button-label-font-weight-pill: var(--wds-font-weight-semi-bold);
419
423
  --wds-toggle-button-label-fill-standard-selected-disabled: var(--wds-color-black-500);
424
+ --wds-toggle-button-label-fill-standard-secondary-selected-hover: var(--wds-color-blue-50);
420
425
  --wds-toggle-button-label-fill-standard-hover: var(--wds-color-blue-50);
421
426
  --wds-toggle-button-label-fill-standard-disabled: var(--wds-color-black-500);
422
427
  --wds-toggle-button-label-fill-inverted-selected-disabled: var(--wds-color-black-500);
@@ -432,6 +437,9 @@
432
437
  --wds-toggle-button-fill-standard-selected-hover: var(--wds-color-blue-400);
433
438
  --wds-toggle-button-fill-standard-selected-disabled: var(--wds-color-black-700);
434
439
  --wds-toggle-button-fill-standard-selected: var(--wds-color-blue-500);
440
+ --wds-toggle-button-fill-standard-secondary-selected-hover: var(--wds-color-blue-400);
441
+ --wds-toggle-button-fill-standard-secondary-selected: var(--wds-color-blue-500);
442
+ --wds-toggle-button-fill-standard-secondary-hover: var(--wds-color-blue-500);
435
443
  --wds-toggle-button-fill-standard-hover: var(--wds-color-black-100-transparent-0);
436
444
  --wds-toggle-button-fill-standard-disabled: var(--wds-color-black-100-transparent-0);
437
445
  --wds-toggle-button-fill-standard: var(--wds-color-black-100-transparent-0);
@@ -505,6 +513,7 @@
505
513
  --wds-tabs-item-gap-medium: var(--wds-space-200);
506
514
  --wds-tabs-item-fill-hover: var(--wds-color-black-750);
507
515
  --wds-tabs-gap-horizontal: var(--wds-space-100);
516
+ --wds-tabs-container-padding-horizontal: var(--wds-space-400);
508
517
  --wds-tabs-border-radius: var(--wds-border-radius-300);
509
518
  --wds-table-toolbar-padding-horizontal: var(--wds-space-600);
510
519
  --wds-table-list-item-paddings: var(--wds-space-0);
@@ -629,11 +638,13 @@
629
638
  --wds-shadow-y-primary-raised: var(--wds-shadow-y-25);
630
639
  --wds-shadow-y-primary-overlay-dark: var(--wds-shadow-y-0);
631
640
  --wds-shadow-y-primary-overlay: var(--wds-shadow-y-300);
632
- --wds-shadow-y-primary-modal: var(--wds-shadow-y-300);
641
+ --wds-shadow-y-primary-modal: var(--wds-shadow-y-600);
633
642
  --wds-shadow-y-input: var(--wds-shadow-y-25);
634
643
  --wds-shadow-x-secondary-raised: var(--wds-shadow-x-25);
635
644
  --wds-shadow-x-primary-toggle-button: var(--wds-shadow-x-25);
645
+ --wds-shadow-x-primary-modal: var(--wds-shadow-x-50);
636
646
  --wds-shadow-x-input: var(--wds-shadow-x-25);
647
+ --wds-shadow-surface-modal: var(--wds-shadow-x-50) var(--wds-shadow-y-600) var(--wds-shadow-blur-800) var(--wds-color-black-100-transparent-10), 0 var(--wds-shadow-blur-0) var(--wds-shadow-y-0) var(--wds-color-black-100-transparent-0);
637
648
  --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;
638
649
  --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;
639
650
  --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;
@@ -667,7 +678,7 @@
667
678
  --wds-shadow-fill-primary-raised: var(--wds-color-black-100-transparent-5);
668
679
  --wds-shadow-fill-primary-overlay-dark: var(--wds-color-black-100-transparent-15);
669
680
  --wds-shadow-fill-primary-overlay: var(--wds-color-black-100-transparent-10);
670
- --wds-shadow-fill-primary-modal: var(--wds-color-black-100-transparent-15);
681
+ --wds-shadow-fill-primary-modal: var(--wds-color-black-100-transparent-10);
671
682
  --wds-shadow-fill-input: var(--wds-color-black-300-transparent-20);
672
683
  --wds-shadow-blur-secondary-toggle: var(--wds-shadow-blur-0);
673
684
  --wds-shadow-blur-secondary-raised: var(--wds-shadow-blur-25);
@@ -836,38 +847,44 @@
836
847
  --wds-list-item-select-suffix-pressed: var(--wds-color-blue-50);
837
848
  --wds-list-item-select-suffix-active-font-weight: var(--wds-font-weight-medium);
838
849
  --wds-list-item-select-padding-vertical-small-screen-small: var(--wds-space-200);
839
- --wds-list-item-select-padding-vertical-small: var(--wds-space-200);
850
+ --wds-list-item-select-padding-vertical-small: var(--wds-space-100);
840
851
  --wds-list-item-select-padding-vertical-medium-screen-small: var(--wds-space-200);
841
- --wds-list-item-select-padding-vertical-medium: var(--wds-space-200);
852
+ --wds-list-item-select-padding-vertical-medium: var(--wds-space-100);
842
853
  --wds-list-item-select-padding-right-small: var(--wds-space-400);
843
854
  --wds-list-item-select-padding-right-medium: var(--wds-space-400);
844
855
  --wds-list-item-select-padding-left-small: var(--wds-space-300);
845
856
  --wds-list-item-select-padding-left-medium: var(--wds-space-300);
846
- --wds-list-item-select-padding-horizontal-small: var(--wds-space-300);
847
- --wds-list-item-select-padding-horizontal-medium: var(--wds-space-300);
848
- --wds-list-item-select-label-hover-font-weight-medium: var(--wds-font-weight-semi-bold);
857
+ --wds-list-item-select-padding-horizontal-small: var(--wds-space-200);
858
+ --wds-list-item-select-padding-horizontal-medium: var(--wds-space-200);
849
859
  --wds-list-item-select-label-font-weight-medium: var(--wds-font-weight-medium);
850
860
  --wds-list-item-select-label-font-weight-active: var(--wds-font-weight-bold);
851
861
  --wds-list-item-select-icon-padding-vertical-small: var(--wds-space-100);
852
862
  --wds-list-item-select-icon-padding-vertical-medium: var(--wds-space-100);
853
863
  --wds-list-item-select-icon-padding-horizontal-small: var(--wds-space-300);
854
864
  --wds-list-item-select-icon-padding-horizontal-medium: var(--wds-space-300);
855
- --wds-list-item-select-gap: var(--wds-space-250);
865
+ --wds-list-item-select-gap: var(--wds-space-50);
856
866
  --wds-list-item-select-border-radius: var(--wds-border-radius-400);
857
867
  --wds-list-item-select-affix-margin: var(--wds-space-100);
858
868
  --wds-list-item-select-active-fill-hover: var(--wds-color-blue-600);
859
- --wds-list-item-section-padding-horizontal: var(--wds-space-400);
869
+ --wds-list-item-section-title-label-fill-neutral: var(--wds-color-black-500);
870
+ --wds-list-item-section-padding-vertical-neutral: var(--wds-space-250);
871
+ --wds-list-item-section-padding-top: var(--wds-space-200);
872
+ --wds-list-item-section-padding-horizontal: var(--wds-space-200);
873
+ --wds-list-item-section-padding-bottom: var(--wds-space-300);
874
+ --wds-list-item-section-font-weight-neutral: var(--wds-font-weight-regular);
860
875
  --wds-list-item-section-font-weight: var(--wds-font-weight-semi-bold);
876
+ --wds-list-item-section-divider-padding-top: var(--wds-space-200);
861
877
  --wds-list-item-section-divider-padding-horizontal: var(--wds-space-0);
878
+ --wds-list-item-section-divider-padding-bottom: var(--wds-space-0);
862
879
  --wds-list-item-action-title-font-weight-active: var(--wds-font-weight-bold);
863
880
  --wds-list-item-action-title-font-weight: var(--wds-font-weight-medium);
864
881
  --wds-list-item-action-padding-vertical-small-screen-small: var(--wds-space-200);
865
882
  --wds-list-item-action-padding-vertical-small: var(--wds-space-200);
866
883
  --wds-list-item-action-padding-vertical-medium-screen-small: var(--wds-space-200);
867
884
  --wds-list-item-action-padding-vertical-medium: var(--wds-space-200);
868
- --wds-list-item-action-padding-horizontal-small: var(--wds-space-300);
869
- --wds-list-item-action-padding-horizontal-medium: var(--wds-space-300);
870
- --wds-list-item-action-gap: var(--wds-space-250);
885
+ --wds-list-item-action-padding-horizontal-small: var(--wds-space-200);
886
+ --wds-list-item-action-padding-horizontal-medium: var(--wds-space-200);
887
+ --wds-list-item-action-gap: var(--wds-space-50);
871
888
  --wds-list-item-action-border-radius: var(--wds-border-radius-400);
872
889
  --wds-list-item-action-affix-margin: var(--wds-space-100);
873
890
  --wds-linear-progress-bar-value-gap: var(--wds-space-100);
@@ -896,10 +913,9 @@
896
913
  --wds-input-border-radius-default-small: var(--wds-border-radius-400);
897
914
  --wds-input-border-radius-default-medium: var(--wds-border-radius-400);
898
915
  --wds-input-border-radius-default-large: var(--wds-border-radius-400);
899
- --wds-input-border-color-readonly: var(--wds-color-black-100-transparent-0);
900
916
  --wds-input-border-color-disabled: var(--wds-color-black-700);
901
917
  --wds-input-border-color: var(--wds-color-black-100-transparent-0);
902
- --wds-input-background-fill-readonly: var(--wds-color-black-750);
918
+ --wds-input-background-fill-readonly: var(--wds-color-white);
903
919
  --wds-input-background-fill-hover: var(--wds-color-black-750);
904
920
  --wds-input-background-fill-disabled: var(--wds-color-black-750);
905
921
  --wds-input-background-fill-default: var(--wds-color-black-750);
@@ -1562,6 +1578,7 @@
1562
1578
  --wds-toggle-button-label-font-size-square-large: var(--wds-font-size-body-tiny);
1563
1579
  --wds-toggle-button-label-font-size-round-small: var(--wds-font-size-body-tiny);
1564
1580
  --wds-toggle-button-label-fill-standard-selected: var(--wds-color-text-primary);
1581
+ --wds-toggle-button-label-fill-standard-secondary-hover: var(--wds-color-text-standard-primary);
1565
1582
  --wds-toggle-button-label-fill-standard: var(--wds-color-text-standard-primary);
1566
1583
  --wds-toggle-button-label-fill-inverted-selected-hover: var(--wds-color-text-standard-primary);
1567
1584
  --wds-toggle-button-label-fill-inverted-selected: var(--wds-color-text-standard-primary);
@@ -1594,7 +1611,7 @@
1594
1611
  --wds-table-list-item-drag-handle-color: var(--wds-color-text-standard-primary);
1595
1612
  --wds-swatches-fill-disabled: var(--wds-color-fill-dark-secondary);
1596
1613
  --wds-swatches-fill-border-selected: var(--wds-color-border-dark-primary-active);
1597
- --wds-swatches-fill-border-no-value-dash: var(--wds-color-fill-destructive-primary);
1614
+ --wds-swatches-fill-border-no-value-dash: var(--wds-color-border-destructive-primary);
1598
1615
  --wds-swatches-fill-border-no-value: var(--wds-color-border-dark-secondary);
1599
1616
  --wds-subtitle-font-size-medium: var(--wds-font-size-body-tiny);
1600
1617
  --wds-status-toast-text-font-size: var(--wds-font-size-body-small);
@@ -1616,7 +1633,6 @@
1616
1633
  --wds-shadow-surface-raised: var(--wds-shadow-200);
1617
1634
  --wds-shadow-surface-overlay-dark: var(--wds-shadow-300);
1618
1635
  --wds-shadow-surface-overlay: var(--wds-shadow-300);
1619
- --wds-shadow-surface-modal: var(--wds-shadow-400);
1620
1636
  --wds-shadow-inner-400-vertical: var(--wds-shadow-inner-300-top), var(--wds-shadow-inner-300-bottom);
1621
1637
  --wds-shadow-inner-400-horizontal: var(--wds-shadow-inner-300-left), var(--wds-shadow-inner-300-right);
1622
1638
  --wds-shadow-inner-300-vertical: var(--wds-shadow-inner-300-top), var(--wds-shadow-inner-300-bottom);
@@ -1693,9 +1709,10 @@
1693
1709
  --wds-list-item-select-active-fill-disabled: var(--wds-color-fill-standard-tertiary);
1694
1710
  --wds-list-item-select-active-fill-active-screen-small: var(--wds-color-fill-standard-secondary-active);
1695
1711
  --wds-list-item-select-active-fill-active: var(--wds-color-fill-standard-tertiary-active);
1696
- --wds-list-item-select-active-fill: var(--wds-color-fill-standard-tertiary);
1697
- --wds-list-item-section-title-label-fill: var(--wds-color-text-disabled);
1698
- --wds-list-item-section-font-size: var(--wds-font-size-body-tiny);
1712
+ --wds-list-item-select-active-fill: var(--wds-color-fill-dark-tertiary-active);
1713
+ --wds-list-item-section-title-label-fill: var(--wds-color-text-placeholder);
1714
+ --wds-list-item-section-font-size: var(--wds-font-size-body-small);
1715
+ --wds-list-item-section-fill-neutral: var(--wds-color-fill-standard-tertiary);
1699
1716
  --wds-list-item-section-fill: var(--wds-color-fill-standard-tertiary);
1700
1717
  --wds-list-item-action-suffix-fill-active: var(--wds-color-text-standard-primary);
1701
1718
  --wds-list-item-action-suffix-fill: var(--wds-color-text-standard-primary);
@@ -1803,7 +1820,7 @@
1803
1820
  --wds-icon-button-color-border-light-secondary: var(--wds-color-border-light);
1804
1821
  --wds-icon-button-color-border-dark-secondary-hover: var(--wds-color-border-dark-secondary-hover);
1805
1822
  --wds-icon-button-color-border-dark-secondary-active: var(--wds-color-border-dark-secondary-active);
1806
- --wds-icon-button-color-border-dark-secondary: var(--wds-color-border-dark-secondary);
1823
+ --wds-icon-button-color-border-dark-secondary: var(--wds-color-border-dark-primary);
1807
1824
  --wds-form-field-label-font-size-tiny: var(--wds-font-size-body-extra-tiny);
1808
1825
  --wds-form-field-label-font-size-small: var(--wds-font-size-body-tiny);
1809
1826
  --wds-form-field-label-fill: var(--wds-color-text-standard-secondary);
@@ -1970,7 +1987,7 @@
1970
1987
  --wds-message-modal-text-font-line-height: var(--wds-font-line-height-body-small);
1971
1988
  --wds-list-item-select-label-font-line-height-small: var(--wds-font-line-height-body-small);
1972
1989
  --wds-list-item-select-label-font-line-height-medium: var(--wds-font-line-height-body-medium);
1973
- --wds-list-item-section-font-line-height: var(--wds-font-line-height-body-tiny);
1990
+ --wds-list-item-section-font-line-height: var(--wds-font-line-height-body-small);
1974
1991
  --wds-list-item-action-subtitle-font-line-height: var(--wds-font-line-height-body-tiny);
1975
1992
  --wds-list-item-action-label-font-line-height-small: var(--wds-font-line-height-body-small);
1976
1993
  --wds-list-item-action-label-font-line-height-medium: var(--wds-font-line-height-body-medium);