@wix/design-system-tokens 1.219.0 → 1.219.2

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 +32 -4
  2. package/all.css +24 -2
  3. package/all.scss +24 -2
  4. package/all.st.css +46 -2
  5. package/component.st.css +46 -2
  6. package/odeditor/all.css +29 -7
  7. package/odeditor/all.scss +29 -7
  8. package/odeditor/all.st.css +51 -7
  9. package/odeditor/component.st.css +51 -7
  10. package/odeditor-dark/all.css +40 -18
  11. package/odeditor-dark/all.scss +40 -18
  12. package/odeditor-dark/all.st.css +63 -19
  13. package/odeditor-dark/component.st.css +61 -17
  14. package/odeditor-dark/semantic.st.css +2 -2
  15. package/package.json +2 -2
  16. package/studio/all.css +24 -2
  17. package/studio/all.scss +24 -2
  18. package/studio/all.st.css +46 -2
  19. package/studio/component.st.css +46 -2
  20. package/wixel/all.css +24 -2
  21. package/wixel/all.scss +24 -2
  22. package/wixel/all.st.css +46 -2
  23. package/wixel/component.st.css +46 -2
package/CHANGELOG.md CHANGED
@@ -1,3 +1,33 @@
1
+ ## 1.219.2
2
+
3
+ ### Patch Changes
4
+
5
+ - [#16681](https://github.com/wix-private/wix-design-systems/pull/16681) [`5841dba`](https://github.com/wix-private/wix-design-systems/commit/5841dbad80db315cb0d54c8f06731ed22418b2b8) - Add Page.Header and EditableTitle tokens consumed by the Page.Header QA fixes: `--wds-page-header-breadcrumbs-color`, `--wds-page-header-breadcrumbs-font-size`, `--wds-page-header-breadcrumbs-selected-font-weight`, `--wds-page-header-divider-color`, `--wds-page-header-subtitle-gap`, `--wds-page-header-subtitle-padding-start` and `--wds-editable-title-marker-gap`. Harmony (odeditor) and Studio 2.0 (odeditor-dark) carry the new values (transparent divider, 12px breadcrumbs in black-300 with a medium-weight (`500`) selected crumb, 4px subtitle gap and start padding, 4px marker gap); every other theme defines them at its currently rendered values, so nothing changes outside the two Harmony themes.
6
+
7
+ - [#16684](https://github.com/wix-private/wix-design-systems/pull/16684) [`c0fa3ec`](https://github.com/wix-private/wix-design-systems/commit/c0fa3ec739ec9f399bdc2f15b5ce5e3f1ad682db) - Studio 2.0 (odeditor-dark) rest-state background fills are now fully transparent for SectionHeader (`--wds-section-header-fill-standard/-neutral/-light`, from `#212122`), VerticalTabsItem (`--wds-vertical-tabs-item-fill-standard/-light/-neutral` and their `-premium` variants, from `#212122`/`#2D2D2E`), and the new `--wds-selectable-accordion-fill` and `--wds-button-fill-ai-secondary` tokens (transparent in Studio 2.0 (odeditor-dark), unchanged rendering in all other themes).
8
+
9
+ - [#16620](https://github.com/wix-private/wix-design-systems/pull/16620) [`8d17164`](https://github.com/wix-private/wix-design-systems/commit/8d17164423b63d0d42dad66d48855c006b413f25) - ListItemSelect tokens: add `--wds-list-item-select-subtitle-font-weight-medium` (`400` in all themes, previously the subtitle used the label weight) and `--wds-list-item-select-suffix-font-line-height-small` (`18px` in Harmony (odeditor), elsewhere equal to the previously used label line-height). `--wds-list-item-select-min-height-medium` changed from `52px` to `auto` in Harmony (odeditor) and Studio 2.0 (odeditor-dark). `--wds-list-item-select-padding-horizontal-medium`/`-small` changed from `12px` to `8px` in Harmony (odeditor). `--wds-list-item-select-padding-right-medium`/`-small` changed from `--wds-space-400` to `--wds-space-300` in all themes (`16px` to `12px`; `24px` to `18px` in the default theme) and are now what the component uses for its end padding.
10
+
11
+ ## 1.219.1
12
+
13
+ ### Patch Changes
14
+
15
+ - [#16680](https://github.com/wix-private/wix-design-systems/pull/16680) [`1bcc73b`](https://github.com/wix-private/wix-design-systems/commit/1bcc73b176aae2a200e81d61865f2bd906f36608) - Add `--wds-accordion-padding-horizontal-large` (16px) and `--wds-accordion-padding-horizontal-medium` (12px) component tokens in Studio 2.0 (odeditor-dark); the semantic `--wds-space-padding-horizontal-*` scale is unaffected.
16
+
17
+ - [#16680](https://github.com/wix-private/wix-design-systems/pull/16680) [`1bcc73b`](https://github.com/wix-private/wix-design-systems/commit/1bcc73b176aae2a200e81d61865f2bd906f36608) - Add `--wds-badge-solid-neutral-success-label-color`, `--wds-badge-solid-neutral-danger-label-color` and `--wds-badge-solid-warning-light-label-color`: `--wds-color-text-standard-primary` in light themes, `--wds-color-text-standard-secondary` (white) in Studio 2.0 (odeditor-dark).
18
+
19
+ - [#16680](https://github.com/wix-private/wix-design-systems/pull/16680) [`1bcc73b`](https://github.com/wix-private/wix-design-systems/commit/1bcc73b176aae2a200e81d61865f2bd906f36608) - Fix `--wds-illustration-color-6` in Studio 2.0 (odeditor-dark): it now resolves to `#002294` (blue) instead of `#EAEFFF`, matching the Figma illustrations library. Affects illustrations such as BookingsStrip and ImagePositionLeft whose detail shapes rendered too light in dark theme.
20
+
21
+ - [#16661](https://github.com/wix-private/wix-design-systems/pull/16661) [`286e414`](https://github.com/wix-private/wix-design-systems/commit/286e414c0fbcad2de68fb9187831368ed78bb798) - Surface overlay blur: `--wds-color-fill-surface-overlay-blur` in Studio 2.0 (odeditor-dark) changed from `rgba(33, 33, 34, 0.96)` to `rgba(33, 33, 34, 0.98)` — affects popovers and side panels.
22
+
23
+ - [#16660](https://github.com/wix-private/wix-design-systems/pull/16660) [`8539804`](https://github.com/wix-private/wix-design-systems/commit/853980426902e9a19758b2a9ddc6c6197cdaff5f) - Popover: `--wds-popover-border-fill` in Studio 2.0 (odeditor-dark) now resolves to `--wds-color-black-750` (`#2D2D2E`) instead of `--wds-color-black-700` (`#3A3A3B`).
24
+
25
+ - [#16611](https://github.com/wix-private/wix-design-systems/pull/16611) [`9990b46`](https://github.com/wix-private/wix-design-systems/commit/9990b463c8654f35201d80404f8e720fe04b55ac) - Modal help-button token changes in Harmony (odeditor) and Studio 2.0 (odeditor-dark): added `--wds-message-modal-help-button-icon-size` (`var(--wds-space-475)` in those themes, `var(--wds-space-400)` in the default theme, `var(--wds-space-600)` in Studio (studio) and Wixel (wixel)); `--wds-message-modal-help-button-size` changed from `var(--wds-space-700)` to `var(--wds-space-600)`; `--wds-announcement-modal-help-button-fill` changed from `var(--wds-color-fill-dark-secondary)` to `transparent`; added `--wds-message-modal-text-font-weight` (`var(--wds-font-weight-regular)` in those themes, `var(--wds-font-weight-medium)` everywhere else, matching their current rendering). No other tokens affected.
26
+
27
+ - [#16690](https://github.com/wix-private/wix-design-systems/pull/16690) [`dfbd2bb`](https://github.com/wix-private/wix-design-systems/commit/dfbd2bbc17fa0f0ef971b4934f0d04bc26739dc8) - Add `--wds-page-header-breadcrumbs-offset-small/medium/large` tokens, the negative inline-start offset Page.Header applies to a breadcrumb trail so the first crumb's text lines up with the page title. Values mirror each theme's own `--wds-breadcrumbs-padding-horizontal-*`: default `-6px`/`-9px`/`-15px`, Studio `-4px`/`-8px`/`-16px`, and `0` for Harmony (odeditor), Studio 2.0 (odeditor-dark) and Wixel, which keep their current rendering. No other tokens affected.
28
+
29
+ - [#16680](https://github.com/wix-private/wix-design-systems/pull/16680) [`1bcc73b`](https://github.com/wix-private/wix-design-systems/commit/1bcc73b176aae2a200e81d61865f2bd906f36608) - Add `--wds-top-banner-content-color` token: light content on themes with the purple banner fill, dark content on Harmony (odeditor)'s light fill.
30
+
1
31
  ## 1.219.0 - 2026-07-28
2
32
 
3
33
  ### Visual Breaking Changes
@@ -354,7 +384,7 @@
354
384
 
355
385
  ### Visual Breaking Changes
356
386
 
357
- - breaking(AddItem): add token [15282](https://github.com/wix-private/wix-design-systems/pull/15282)
387
+ - breaking(AddItem): add token [15282](https://github.com/wix-private/wix-design-systems/pull/15282)
358
388
  - breaking(TableListItem): update border color & radius [15278](https://github.com/wix-private/wix-design-systems/pull/15278)
359
389
  - breaking(SegmentedToggle): e3 container border radius [15280](https://github.com/wix-private/wix-design-systems/pull/15280)
360
390
  - breaking(NestableListItem): add tokens [15255](https://github.com/wix-private/wix-design-systems/pull/15255)
@@ -456,7 +486,7 @@
456
486
 
457
487
  ### Features
458
488
 
459
- - feat(Tooltip): tokenization [15155](https://github.com/wix-private/wix-design-systems/pull/15155)
489
+ - feat(Tooltip): tokenization [15155](https://github.com/wix-private/wix-design-systems/pull/15155)
460
490
 
461
491
  ## 1.124.0 - 2025-08-04
462
492
 
@@ -740,5 +770,3 @@
740
770
  ### Bug Fixes
741
771
 
742
772
  - fix(InputArea): fix vertical padding tokens adjusted to sum up to correct height [13204](https://github.com/wix-private/wix-design-systems/pull/13204)
743
-
744
-
package/all.css CHANGED
@@ -323,6 +323,9 @@
323
323
  --wds-radio-size: 16px;
324
324
  --wds-radio-dot-size: 10px;
325
325
  --wds-page-header-title-minimised-line-height: 30px;
326
+ --wds-page-header-breadcrumbs-offset-small: -6px;
327
+ --wds-page-header-breadcrumbs-offset-medium: -9px;
328
+ --wds-page-header-breadcrumbs-offset-large: -15px;
326
329
  --wds-page-header-back-button-gap: 8px;
327
330
  --wds-message-modal-close-button-fill: transparent;
328
331
  --wds-marketing-layout-title-font-size-tiny: 20px;
@@ -363,6 +366,7 @@
363
366
  --wds-google-preview-favicon-border-fill: #E6E6E6;
364
367
  --wds-google-preview-favicon-background-fill: #F1F3F4;
365
368
  --wds-editable-title-marker-line-style: dashed;
369
+ --wds-editable-title-marker-gap: 6px;
366
370
  --wds-custom-modal-close-button-fill: transparent;
367
371
  --wds-counter-badge-padding-horizontal-tiny: 4px;
368
372
  --wds-counter-badge-padding-horizontal-medium: 8px;
@@ -381,6 +385,7 @@
381
385
  --wds-button-icon-offset-small: 12px;
382
386
  --wds-button-icon-offset-medium: 12px;
383
387
  --wds-button-icon-offset-large: 12px;
388
+ --wds-button-border-ai-secondary-mask: none;
384
389
  --wds-breadcrumbs-height-small: 24px;
385
390
  --wds-breadcrumbs-height-medium: 30px;
386
391
  --wds-breadcrumbs-height-large: 36px;
@@ -1215,10 +1220,13 @@
1215
1220
  --wds-page-header-title-minimised-letter-spacing: var(--wds-font-letter-spacing-0);
1216
1221
  --wds-page-header-title-minimised-font-weight: var(--wds-font-weight-medium);
1217
1222
  --wds-page-header-title-actions-gap: var(--wds-space-0);
1223
+ --wds-page-header-subtitle-padding-start: var(--wds-space-0);
1224
+ --wds-page-header-subtitle-gap: var(--wds-space-0);
1218
1225
  --wds-page-header-padding-vertical-small: var(--wds-space-300);
1219
1226
  --wds-page-header-padding-vertical: var(--wds-space-400);
1220
1227
  --wds-page-header-padding-horizontal-small: var(--wds-space-400);
1221
1228
  --wds-page-header-padding-horizontal: var(--wds-space-800);
1229
+ --wds-page-header-breadcrumbs-selected-font-weight: var(--wds-font-weight-medium);
1222
1230
  --wds-notification-padding-vertical: var(--wds-space-150);
1223
1231
  --wds-notification-padding-horizontal: var(--wds-space-200);
1224
1232
  --wds-notification-fill-warning: var(--wds-color-yellow-100);
@@ -1234,12 +1242,14 @@
1234
1242
  --wds-message-modal-top-controls-paddings: var(--wds-space-100);
1235
1243
  --wds-message-modal-top-controls-gap: var(--wds-space-50);
1236
1244
  --wds-message-modal-title-font-family: var(--wds-font-family-default);
1245
+ --wds-message-modal-text-font-weight: var(--wds-font-weight-medium);
1237
1246
  --wds-message-modal-padding-vertical: var(--wds-space-400);
1238
1247
  --wds-message-modal-padding-horizontal: var(--wds-space-400);
1239
1248
  --wds-message-modal-illustration-margin-top: var(--wds-space-300);
1240
1249
  --wds-message-modal-illustration-margin-start: var(--wds-space-400);
1241
1250
  --wds-message-modal-illustration-content-gap: var(--wds-space-400);
1242
1251
  --wds-message-modal-help-button-size: var(--wds-space-500);
1252
+ --wds-message-modal-help-button-icon-size: var(--wds-space-400);
1243
1253
  --wds-message-modal-content-gap: var(--wds-space-200);
1244
1254
  --wds-message-modal-close-button-size: var(--wds-space-500);
1245
1255
  --wds-message-modal-close-button-icon-size: var(--wds-space-200);
@@ -1281,13 +1291,14 @@
1281
1291
  --wds-list-item-select-icon-padding-horizontal-small: var(--wds-space-200);
1282
1292
  --wds-list-item-select-icon-padding-horizontal-medium: var(--wds-space-200);
1283
1293
  --wds-list-item-select-suffix-active-font-weight: var(--wds-font-weight-regular);
1294
+ --wds-list-item-select-subtitle-font-weight-medium: var(--wds-font-weight-regular);
1284
1295
  --wds-list-item-select-prefix-subtitle-margin: var(--wds-space-100);
1285
1296
  --wds-list-item-select-padding-vertical-small-screen-small: var(--wds-space-200);
1286
1297
  --wds-list-item-select-padding-vertical-small: var(--wds-space-100);
1287
1298
  --wds-list-item-select-padding-vertical-medium-screen-small: var(--wds-space-200);
1288
1299
  --wds-list-item-select-padding-vertical-medium: var(--wds-space-100);
1289
- --wds-list-item-select-padding-right-small: var(--wds-space-400);
1290
- --wds-list-item-select-padding-right-medium: var(--wds-space-400);
1300
+ --wds-list-item-select-padding-right-small: var(--wds-space-300);
1301
+ --wds-list-item-select-padding-right-medium: var(--wds-space-300);
1291
1302
  --wds-list-item-select-padding-left-small: var(--wds-space-300);
1292
1303
  --wds-list-item-select-padding-left-medium: var(--wds-space-300);
1293
1304
  --wds-list-item-select-padding-horizontal-small: var(--wds-space-300);
@@ -1634,6 +1645,7 @@
1634
1645
  --wds-vertical-tabs-icon-fill-disabled: var(--wds-color-text-disabled);
1635
1646
  --wds-vertical-tabs-icon-fill-active: var(--wds-color-text-standard-primary);
1636
1647
  --wds-vertical-tabs-icon-fill: var(--wds-color-text-primary);
1648
+ --wds-top-banner-content-color: var(--wds-color-text-standard-primary-light);
1637
1649
  --wds-tooltip-text-fill: var(--wds-color-text-standard-primary-light);
1638
1650
  --wds-tooltip-label-font-size-medium: var(--wds-font-size-body-small);
1639
1651
  --wds-tooltip-border-radius: var(--wds-border-radius-surface-overlay);
@@ -1778,6 +1790,7 @@
1778
1790
  --wds-selector-button-border-color-hover: var(--wds-color-border-standard-secondary-hover);
1779
1791
  --wds-selector-button-border-color-disabled: var(--wds-color-border-standard-secondary-disabled);
1780
1792
  --wds-selector-button-border-color: var(--wds-color-border-standard-secondary);
1793
+ --wds-selectable-accordion-fill: var(--wds-color-fill-standard-tertiary);
1781
1794
  --wds-segmented-toggle-value-fill-selected-disabled: var(--wds-color-text-disabled);
1782
1795
  --wds-segmented-toggle-value-fill-selected: var(--wds-color-text-standard-primary);
1783
1796
  --wds-segmented-toggle-value-fill-hover: var(--wds-color-text-standard-primary);
@@ -1835,6 +1848,9 @@
1835
1848
  --wds-page-header-title-font-weight: var(--wds-font-weight-heading-1);
1836
1849
  --wds-page-header-title-font-size: var(--wds-font-size-heading-1);
1837
1850
  --wds-page-header-subtitle-font-size: var(--wds-font-size-body-medium);
1851
+ --wds-page-header-divider-color: var(--wds-color-border-dark-secondary);
1852
+ --wds-page-header-breadcrumbs-font-size: var(--wds-font-size-body-small);
1853
+ --wds-page-header-breadcrumbs-color: var(--wds-color-text-standard-primary);
1838
1854
  --wds-number-input-icon-fill: var(--wds-color-text-primary);
1839
1855
  --wds-nestable-list-fill: var(--wds-color-fill-surface-default);
1840
1856
  --wds-multiselect-icon-fill: var(--wds-color-text-primary);
@@ -2170,6 +2186,7 @@
2170
2186
  --wds-button-fill-dark-secondary-active: var(--wds-color-fill-dark-primary);
2171
2187
  --wds-button-fill-dark-secondary: var(--wds-color-fill-dark-tertiary);
2172
2188
  --wds-button-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
2189
+ --wds-button-fill-ai-secondary: var(--wds-color-fill-standard-tertiary);
2173
2190
  --wds-button-border-standard-secondary-hover: var(--wds-color-border-standard-primary-active);
2174
2191
  --wds-button-border-standard-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
2175
2192
  --wds-button-border-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
@@ -2187,6 +2204,9 @@
2187
2204
  --wds-button-border-dark-secondary-active: var(--wds-color-fill-dark-primary);
2188
2205
  --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
2189
2206
  --wds-breadcrumbs-on-grey-text-fill-active: var(--wds-color-text-standard-primary);
2207
+ --wds-badge-solid-warning-light-label-color: var(--wds-color-text-standard-secondary);
2208
+ --wds-badge-solid-neutral-success-label-color: var(--wds-color-text-standard-secondary);
2209
+ --wds-badge-solid-neutral-danger-label-color: var(--wds-color-text-standard-secondary);
2190
2210
  --wds-badge-outline-warning-label-color: var(--wds-color-text-warning);
2191
2211
  --wds-badge-outline-warning-fill: var(--wds-color-fill-warning-tertiary);
2192
2212
  --wds-badge-outline-warning-border-color: var(--wds-color-border-warning-primary);
@@ -2233,6 +2253,7 @@
2233
2253
  --wds-accordion-title-font-size-medium: var(--wds-font-size-body-medium);
2234
2254
  --wds-accordion-title-fill-hover: var(--wds-color-text-standard-primary);
2235
2255
  --wds-accordion-title-fill: var(--wds-color-text-standard-primary);
2256
+ --wds-accordion-padding-horizontal-medium: var(--wds-space-padding-horizontal-medium);
2236
2257
  --wds-accordion-padding-horizontal-large: var(--wds-space-padding-horizontal-large);
2237
2258
  --wds-accordion-inner-content-shadow-last: var(--wds-shadow-inner-300-top);
2238
2259
  --wds-accordion-inner-content-padding-bottom: var(--wds-space-padding-vertical-small);
@@ -2272,6 +2293,7 @@
2272
2293
  --wds-marketing-layout-description-line-height-tiny: var(--wds-font-line-height-body-small);
2273
2294
  --wds-marketing-layout-description-line-height-small: var(--wds-font-line-height-body-small);
2274
2295
  --wds-marketing-layout-description-line-height-medium: var(--wds-font-line-height-body-medium);
2296
+ --wds-list-item-select-suffix-font-line-height-small: var(--wds-font-line-height-body-small);
2275
2297
  --wds-list-item-select-subtitle-font-line-height-medium: var(--wds-font-line-height-body-small);
2276
2298
  --wds-list-item-select-label-font-line-height-small: var(--wds-font-line-height-body-small);
2277
2299
  --wds-list-item-select-label-font-line-height-medium: var(--wds-font-line-height-body-medium);
package/all.scss CHANGED
@@ -106,6 +106,9 @@
106
106
  --wds-radio-size: 16px;
107
107
  --wds-radio-dot-size: 10px;
108
108
  --wds-page-header-title-minimised-line-height: 30px;
109
+ --wds-page-header-breadcrumbs-offset-small: -6px;
110
+ --wds-page-header-breadcrumbs-offset-medium: -9px;
111
+ --wds-page-header-breadcrumbs-offset-large: -15px;
109
112
  --wds-page-header-back-button-gap: 8px;
110
113
  --wds-message-modal-close-button-fill: transparent;
111
114
  --wds-marketing-layout-title-font-size-tiny: 20px;
@@ -163,6 +166,7 @@
163
166
  --wds-font-family-display: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
164
167
  --wds-font-family-default: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
165
168
  --wds-editable-title-marker-line-style: dashed;
169
+ --wds-editable-title-marker-gap: 6px;
166
170
  --wds-custom-modal-close-button-fill: transparent;
167
171
  --wds-counter-badge-padding-horizontal-tiny: 4px;
168
172
  --wds-counter-badge-padding-horizontal-medium: 8px;
@@ -354,6 +358,7 @@
354
358
  --wds-button-icon-offset-small: 12px;
355
359
  --wds-button-icon-offset-medium: 12px;
356
360
  --wds-button-icon-offset-large: 12px;
361
+ --wds-button-border-ai-secondary-mask: none;
357
362
  --wds-breakpoint-x-large: 1572px;
358
363
  --wds-breakpoint-small: 490px;
359
364
  --wds-breakpoint-medium: 768px;
@@ -862,10 +867,13 @@
862
867
  --wds-page-header-title-minimised-letter-spacing: var(--wds-font-letter-spacing-0);
863
868
  --wds-page-header-title-minimised-font-weight: var(--wds-font-weight-medium);
864
869
  --wds-page-header-title-actions-gap: var(--wds-space-0);
870
+ --wds-page-header-subtitle-padding-start: var(--wds-space-0);
871
+ --wds-page-header-subtitle-gap: var(--wds-space-0);
865
872
  --wds-page-header-padding-vertical-small: var(--wds-space-300);
866
873
  --wds-page-header-padding-vertical: var(--wds-space-400);
867
874
  --wds-page-header-padding-horizontal-small: var(--wds-space-400);
868
875
  --wds-page-header-padding-horizontal: var(--wds-space-800);
876
+ --wds-page-header-breadcrumbs-selected-font-weight: var(--wds-font-weight-medium);
869
877
  --wds-notification-padding-vertical: var(--wds-space-150);
870
878
  --wds-notification-padding-horizontal: var(--wds-space-200);
871
879
  --wds-notification-fill-warning: var(--wds-color-yellow-100);
@@ -881,12 +889,14 @@
881
889
  --wds-message-modal-top-controls-paddings: var(--wds-space-100);
882
890
  --wds-message-modal-top-controls-gap: var(--wds-space-50);
883
891
  --wds-message-modal-title-font-family: var(--wds-font-family-default);
892
+ --wds-message-modal-text-font-weight: var(--wds-font-weight-medium);
884
893
  --wds-message-modal-padding-vertical: var(--wds-space-400);
885
894
  --wds-message-modal-padding-horizontal: var(--wds-space-400);
886
895
  --wds-message-modal-illustration-margin-top: var(--wds-space-300);
887
896
  --wds-message-modal-illustration-margin-start: var(--wds-space-400);
888
897
  --wds-message-modal-illustration-content-gap: var(--wds-space-400);
889
898
  --wds-message-modal-help-button-size: var(--wds-space-500);
899
+ --wds-message-modal-help-button-icon-size: var(--wds-space-400);
890
900
  --wds-message-modal-content-gap: var(--wds-space-200);
891
901
  --wds-message-modal-close-button-size: var(--wds-space-500);
892
902
  --wds-message-modal-close-button-icon-size: var(--wds-space-200);
@@ -924,13 +934,14 @@
924
934
  --wds-marketing-layout-actions-gap-small: var(--wds-space-300);
925
935
  --wds-marketing-layout-actions-gap-medium: var(--wds-space-400);
926
936
  --wds-list-item-select-suffix-active-font-weight: var(--wds-font-weight-regular);
937
+ --wds-list-item-select-subtitle-font-weight-medium: var(--wds-font-weight-regular);
927
938
  --wds-list-item-select-prefix-subtitle-margin: var(--wds-space-100);
928
939
  --wds-list-item-select-padding-vertical-small-screen-small: var(--wds-space-200);
929
940
  --wds-list-item-select-padding-vertical-small: var(--wds-space-100);
930
941
  --wds-list-item-select-padding-vertical-medium-screen-small: var(--wds-space-200);
931
942
  --wds-list-item-select-padding-vertical-medium: var(--wds-space-100);
932
- --wds-list-item-select-padding-right-small: var(--wds-space-400);
933
- --wds-list-item-select-padding-right-medium: var(--wds-space-400);
943
+ --wds-list-item-select-padding-right-small: var(--wds-space-300);
944
+ --wds-list-item-select-padding-right-medium: var(--wds-space-300);
934
945
  --wds-list-item-select-padding-left-small: var(--wds-space-300);
935
946
  --wds-list-item-select-padding-left-medium: var(--wds-space-300);
936
947
  --wds-list-item-select-padding-horizontal-small: var(--wds-space-300);
@@ -1616,6 +1627,7 @@
1616
1627
  --wds-vertical-tabs-icon-fill-disabled: var(--wds-color-text-disabled);
1617
1628
  --wds-vertical-tabs-icon-fill-active: var(--wds-color-text-standard-primary);
1618
1629
  --wds-vertical-tabs-icon-fill: var(--wds-color-text-primary);
1630
+ --wds-top-banner-content-color: var(--wds-color-text-standard-primary-light);
1619
1631
  --wds-tooltip-text-fill: var(--wds-color-text-standard-primary-light);
1620
1632
  --wds-tooltip-label-font-size-medium: var(--wds-font-size-body-small);
1621
1633
  --wds-tooltip-border-radius: var(--wds-border-radius-surface-overlay);
@@ -1767,6 +1779,7 @@
1767
1779
  --wds-selector-button-border-color-hover: var(--wds-color-border-standard-secondary-hover);
1768
1780
  --wds-selector-button-border-color-disabled: var(--wds-color-border-standard-secondary-disabled);
1769
1781
  --wds-selector-button-border-color: var(--wds-color-border-standard-secondary);
1782
+ --wds-selectable-accordion-fill: var(--wds-color-fill-standard-tertiary);
1770
1783
  --wds-segmented-toggle-value-fill-selected-disabled: var(--wds-color-text-disabled);
1771
1784
  --wds-segmented-toggle-value-fill-selected: var(--wds-color-text-standard-primary);
1772
1785
  --wds-segmented-toggle-value-fill-hover: var(--wds-color-text-standard-primary);
@@ -1824,6 +1837,9 @@
1824
1837
  --wds-page-header-title-font-weight: var(--wds-font-weight-heading-1);
1825
1838
  --wds-page-header-title-font-size: var(--wds-font-size-heading-1);
1826
1839
  --wds-page-header-subtitle-font-size: var(--wds-font-size-body-medium);
1840
+ --wds-page-header-divider-color: var(--wds-color-border-dark-secondary);
1841
+ --wds-page-header-breadcrumbs-font-size: var(--wds-font-size-body-small);
1842
+ --wds-page-header-breadcrumbs-color: var(--wds-color-text-standard-primary);
1827
1843
  --wds-number-input-icon-fill: var(--wds-color-text-primary);
1828
1844
  --wds-nestable-list-fill: var(--wds-color-fill-surface-default);
1829
1845
  --wds-multiselect-icon-fill: var(--wds-color-text-primary);
@@ -2170,6 +2186,7 @@
2170
2186
  --wds-button-fill-dark-secondary-active: var(--wds-color-fill-dark-primary);
2171
2187
  --wds-button-fill-dark-secondary: var(--wds-color-fill-dark-tertiary);
2172
2188
  --wds-button-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
2189
+ --wds-button-fill-ai-secondary: var(--wds-color-fill-standard-tertiary);
2173
2190
  --wds-button-border-standard-secondary-hover: var(--wds-color-border-standard-primary-active);
2174
2191
  --wds-button-border-standard-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
2175
2192
  --wds-button-border-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
@@ -2187,6 +2204,9 @@
2187
2204
  --wds-button-border-dark-secondary-active: var(--wds-color-fill-dark-primary);
2188
2205
  --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
2189
2206
  --wds-breadcrumbs-on-grey-text-fill-active: var(--wds-color-text-standard-primary);
2207
+ --wds-badge-solid-warning-light-label-color: var(--wds-color-text-standard-secondary);
2208
+ --wds-badge-solid-neutral-success-label-color: var(--wds-color-text-standard-secondary);
2209
+ --wds-badge-solid-neutral-danger-label-color: var(--wds-color-text-standard-secondary);
2190
2210
  --wds-badge-outline-warning-label-color: var(--wds-color-text-warning);
2191
2211
  --wds-badge-outline-warning-fill: var(--wds-color-fill-warning-tertiary);
2192
2212
  --wds-badge-outline-warning-border-color: var(--wds-color-border-warning-primary);
@@ -2233,6 +2253,7 @@
2233
2253
  --wds-accordion-title-font-size-medium: var(--wds-font-size-body-medium);
2234
2254
  --wds-accordion-title-fill-hover: var(--wds-color-text-standard-primary);
2235
2255
  --wds-accordion-title-fill: var(--wds-color-text-standard-primary);
2256
+ --wds-accordion-padding-horizontal-medium: var(--wds-space-padding-horizontal-medium);
2236
2257
  --wds-accordion-padding-horizontal-large: var(--wds-space-padding-horizontal-large);
2237
2258
  --wds-accordion-inner-content-shadow-last: var(--wds-shadow-inner-300-top);
2238
2259
  --wds-accordion-inner-content-padding-bottom: var(--wds-space-padding-vertical-small);
@@ -2272,6 +2293,7 @@
2272
2293
  --wds-marketing-layout-description-line-height-tiny: var(--wds-font-line-height-body-small);
2273
2294
  --wds-marketing-layout-description-line-height-small: var(--wds-font-line-height-body-small);
2274
2295
  --wds-marketing-layout-description-line-height-medium: var(--wds-font-line-height-body-medium);
2296
+ --wds-list-item-select-suffix-font-line-height-small: var(--wds-font-line-height-body-small);
2275
2297
  --wds-list-item-select-subtitle-font-line-height-medium: var(--wds-font-line-height-body-small);
2276
2298
  --wds-list-item-select-label-font-line-height-small: var(--wds-font-line-height-body-small);
2277
2299
  --wds-list-item-select-label-font-line-height-medium: var(--wds-font-line-height-body-medium);
package/all.st.css CHANGED
@@ -12,6 +12,7 @@
12
12
  @property st-global(--wds-accordion-inner-content-shadow);
13
13
  @property st-global(--wds-accordion-inner-content-shadow-last);
14
14
  @property st-global(--wds-accordion-padding-horizontal-large);
15
+ @property st-global(--wds-accordion-padding-horizontal-medium);
15
16
  @property st-global(--wds-accordion-title-fill);
16
17
  @property st-global(--wds-accordion-title-fill-hover);
17
18
  @property st-global(--wds-accordion-title-font-line-height-medium);
@@ -121,6 +122,9 @@
121
122
  @property st-global(--wds-badge-size-medium);
122
123
  @property st-global(--wds-badge-size-small);
123
124
  @property st-global(--wds-badge-size-tiny);
125
+ @property st-global(--wds-badge-solid-neutral-danger-label-color);
126
+ @property st-global(--wds-badge-solid-neutral-success-label-color);
127
+ @property st-global(--wds-badge-solid-warning-light-label-color);
124
128
  @property st-global(--wds-border-radius-0);
125
129
  @property st-global(--wds-border-radius-100);
126
130
  @property st-global(--wds-border-radius-200);
@@ -166,6 +170,7 @@
166
170
  @property st-global(--wds-breakpoint-medium);
167
171
  @property st-global(--wds-breakpoint-small);
168
172
  @property st-global(--wds-breakpoint-x-large);
173
+ @property st-global(--wds-button-border-ai-secondary-mask);
169
174
  @property st-global(--wds-button-border-dark-secondary);
170
175
  @property st-global(--wds-button-border-dark-secondary-active);
171
176
  @property st-global(--wds-button-border-dark-secondary-disabled);
@@ -189,6 +194,7 @@
189
194
  @property st-global(--wds-button-fill-ai-primary);
190
195
  @property st-global(--wds-button-fill-ai-primary-active);
191
196
  @property st-global(--wds-button-fill-ai-primary-hover);
197
+ @property st-global(--wds-button-fill-ai-secondary);
192
198
  @property st-global(--wds-button-fill-dark-primary-disabled);
193
199
  @property st-global(--wds-button-fill-dark-secondary);
194
200
  @property st-global(--wds-button-fill-dark-secondary-active);
@@ -943,6 +949,7 @@
943
949
  @property st-global(--wds-dropdown-list-paddings);
944
950
  @property st-global(--wds-editable-title-marker-fill);
945
951
  @property st-global(--wds-editable-title-marker-fill-active);
952
+ @property st-global(--wds-editable-title-marker-gap);
946
953
  @property st-global(--wds-editable-title-marker-line-style);
947
954
  @property st-global(--wds-editable-title-placeholder-fill);
948
955
  @property st-global(--wds-empty-state-border-radius);
@@ -1361,8 +1368,10 @@
1361
1368
  @property st-global(--wds-list-item-select-subtitle-disabled);
1362
1369
  @property st-global(--wds-list-item-select-subtitle-font-line-height-medium);
1363
1370
  @property st-global(--wds-list-item-select-subtitle-font-size-medium);
1371
+ @property st-global(--wds-list-item-select-subtitle-font-weight-medium);
1364
1372
  @property st-global(--wds-list-item-select-suffix);
1365
1373
  @property st-global(--wds-list-item-select-suffix-active-font-weight);
1374
+ @property st-global(--wds-list-item-select-suffix-font-line-height-small);
1366
1375
  @property st-global(--wds-list-item-select-suffix-pressed);
1367
1376
  @property st-global(--wds-list-item-select-title);
1368
1377
  @property st-global(--wds-list-item-select-title-disabled);
@@ -1436,6 +1445,7 @@
1436
1445
  @property st-global(--wds-message-modal-close-button-icon-size);
1437
1446
  @property st-global(--wds-message-modal-close-button-size);
1438
1447
  @property st-global(--wds-message-modal-content-gap);
1448
+ @property st-global(--wds-message-modal-help-button-icon-size);
1439
1449
  @property st-global(--wds-message-modal-help-button-size);
1440
1450
  @property st-global(--wds-message-modal-illustration-content-gap);
1441
1451
  @property st-global(--wds-message-modal-illustration-margin-start);
@@ -1444,6 +1454,7 @@
1444
1454
  @property st-global(--wds-message-modal-padding-vertical);
1445
1455
  @property st-global(--wds-message-modal-text-font-line-height);
1446
1456
  @property st-global(--wds-message-modal-text-font-size);
1457
+ @property st-global(--wds-message-modal-text-font-weight);
1447
1458
  @property st-global(--wds-message-modal-title-font-family);
1448
1459
  @property st-global(--wds-message-modal-title-font-line-height);
1449
1460
  @property st-global(--wds-message-modal-title-font-size);
@@ -1465,12 +1476,21 @@
1465
1476
  @property st-global(--wds-notification-padding-vertical);
1466
1477
  @property st-global(--wds-number-input-icon-fill);
1467
1478
  @property st-global(--wds-page-header-back-button-gap);
1479
+ @property st-global(--wds-page-header-breadcrumbs-color);
1480
+ @property st-global(--wds-page-header-breadcrumbs-font-size);
1481
+ @property st-global(--wds-page-header-breadcrumbs-offset-large);
1482
+ @property st-global(--wds-page-header-breadcrumbs-offset-medium);
1483
+ @property st-global(--wds-page-header-breadcrumbs-offset-small);
1484
+ @property st-global(--wds-page-header-breadcrumbs-selected-font-weight);
1485
+ @property st-global(--wds-page-header-divider-color);
1468
1486
  @property st-global(--wds-page-header-padding-horizontal);
1469
1487
  @property st-global(--wds-page-header-padding-horizontal-small);
1470
1488
  @property st-global(--wds-page-header-padding-vertical);
1471
1489
  @property st-global(--wds-page-header-padding-vertical-small);
1472
1490
  @property st-global(--wds-page-header-subtitle-font-size);
1491
+ @property st-global(--wds-page-header-subtitle-gap);
1473
1492
  @property st-global(--wds-page-header-subtitle-line-height);
1493
+ @property st-global(--wds-page-header-subtitle-padding-start);
1474
1494
  @property st-global(--wds-page-header-title-actions-gap);
1475
1495
  @property st-global(--wds-page-header-title-font-size);
1476
1496
  @property st-global(--wds-page-header-title-font-weight);
@@ -1624,6 +1644,7 @@
1624
1644
  @property st-global(--wds-select-area-fill-hover);
1625
1645
  @property st-global(--wds-select-area-padding-horizontal);
1626
1646
  @property st-global(--wds-select-area-padding-vertical);
1647
+ @property st-global(--wds-selectable-accordion-fill);
1627
1648
  @property st-global(--wds-selector-button-border-color);
1628
1649
  @property st-global(--wds-selector-button-border-color-disabled);
1629
1650
  @property st-global(--wds-selector-button-border-color-hover);
@@ -2221,6 +2242,7 @@
2221
2242
  @property st-global(--wds-tooltip-text-fill);
2222
2243
  @property st-global(--wds-top-banner-border-color);
2223
2244
  @property st-global(--wds-top-banner-border-radius);
2245
+ @property st-global(--wds-top-banner-content-color);
2224
2246
  @property st-global(--wds-top-banner-content-gap);
2225
2247
  @property st-global(--wds-top-banner-dismiss-gap);
2226
2248
  @property st-global(--wds-top-banner-fill);
@@ -2325,6 +2347,7 @@
2325
2347
  --wds-accordion-inner-content-shadow: 0 22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset, 0 -22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset;
2326
2348
  --wds-accordion-inner-content-shadow-last: 0 22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset;
2327
2349
  --wds-accordion-padding-horizontal-large: 24px;
2350
+ --wds-accordion-padding-horizontal-medium: 18px;
2328
2351
  --wds-accordion-title-fill: #000624;
2329
2352
  --wds-accordion-title-fill-hover: #000624;
2330
2353
  --wds-accordion-title-font-line-height-medium: 24px;
@@ -2434,6 +2457,9 @@
2434
2457
  --wds-badge-size-medium: 24px;
2435
2458
  --wds-badge-size-small: 18px;
2436
2459
  --wds-badge-size-tiny: 18px;
2460
+ --wds-badge-solid-neutral-danger-label-color: #44485f;
2461
+ --wds-badge-solid-neutral-success-label-color: #44485f;
2462
+ --wds-badge-solid-warning-light-label-color: #44485f;
2437
2463
  --wds-border-radius-0: 0px;
2438
2464
  --wds-border-radius-100: 2px;
2439
2465
  --wds-border-radius-200: 4px;
@@ -2479,6 +2505,7 @@
2479
2505
  --wds-breakpoint-medium: 768px;
2480
2506
  --wds-breakpoint-small: 490px;
2481
2507
  --wds-breakpoint-x-large: 1572px;
2508
+ --wds-button-border-ai-secondary-mask: none;
2482
2509
  --wds-button-border-dark-secondary: #868aa5;
2483
2510
  --wds-button-border-dark-secondary-active: #000624;
2484
2511
  --wds-button-border-dark-secondary-disabled: rgba(0, 6, 36, .1);
@@ -2502,6 +2529,7 @@
2502
2529
  --wds-button-fill-ai-primary: linear-gradient(60deg, #0021FF 0%, #116DFF 65%, #5FF2AE 96%);
2503
2530
  --wds-button-fill-ai-primary-active: linear-gradient(60deg, #0021FF 0%, #116DFF 65%, #5FF2AE 96%);
2504
2531
  --wds-button-fill-ai-primary-hover: linear-gradient(81deg, #0021FF -177.08%, #116DFF 31.96%, #5FF2AE 99.97%);
2532
+ --wds-button-fill-ai-secondary: #ffffff;
2505
2533
  --wds-button-fill-dark-primary-disabled: rgba(0, 6, 36, .3);
2506
2534
  --wds-button-fill-dark-secondary: #ffffff;
2507
2535
  --wds-button-fill-dark-secondary-active: #000624;
@@ -3256,6 +3284,7 @@
3256
3284
  --wds-dropdown-list-paddings: 0px;
3257
3285
  --wds-editable-title-marker-fill: #868aa5;
3258
3286
  --wds-editable-title-marker-fill-active: #116dff;
3287
+ --wds-editable-title-marker-gap: 6px;
3259
3288
  --wds-editable-title-marker-line-style: dashed;
3260
3289
  --wds-editable-title-placeholder-fill: #cfd1dc;
3261
3290
  --wds-empty-state-border-radius: 8px;
@@ -3663,8 +3692,8 @@
3663
3692
  --wds-list-item-select-padding-horizontal-small: 18px;
3664
3693
  --wds-list-item-select-padding-left-medium: 18px;
3665
3694
  --wds-list-item-select-padding-left-small: 18px;
3666
- --wds-list-item-select-padding-right-medium: 24px;
3667
- --wds-list-item-select-padding-right-small: 24px;
3695
+ --wds-list-item-select-padding-right-medium: 18px;
3696
+ --wds-list-item-select-padding-right-small: 18px;
3668
3697
  --wds-list-item-select-padding-vertical-medium: 6px;
3669
3698
  --wds-list-item-select-padding-vertical-medium-screen-small: 12px;
3670
3699
  --wds-list-item-select-padding-vertical-small: 6px;
@@ -3674,8 +3703,10 @@
3674
3703
  --wds-list-item-select-subtitle-disabled: rgba(0, 6, 36, .3);
3675
3704
  --wds-list-item-select-subtitle-font-line-height-medium: 18px;
3676
3705
  --wds-list-item-select-subtitle-font-size-medium: 14px;
3706
+ --wds-list-item-select-subtitle-font-weight-medium: 400;
3677
3707
  --wds-list-item-select-suffix: #868aa5;
3678
3708
  --wds-list-item-select-suffix-active-font-weight: 400;
3709
+ --wds-list-item-select-suffix-font-line-height-small: 18px;
3679
3710
  --wds-list-item-select-suffix-pressed: #868aa5;
3680
3711
  --wds-list-item-select-title: #000624;
3681
3712
  --wds-list-item-select-title-disabled: rgba(0, 6, 36, .3);
@@ -3749,6 +3780,7 @@
3749
3780
  --wds-message-modal-close-button-icon-size: 12px;
3750
3781
  --wds-message-modal-close-button-size: 30px;
3751
3782
  --wds-message-modal-content-gap: 12px;
3783
+ --wds-message-modal-help-button-icon-size: 24px;
3752
3784
  --wds-message-modal-help-button-size: 30px;
3753
3785
  --wds-message-modal-illustration-content-gap: 24px;
3754
3786
  --wds-message-modal-illustration-margin-start: 24px;
@@ -3757,6 +3789,7 @@
3757
3789
  --wds-message-modal-padding-vertical: 24px;
3758
3790
  --wds-message-modal-text-font-line-height: 24px;
3759
3791
  --wds-message-modal-text-font-size: 16px;
3792
+ --wds-message-modal-text-font-weight: 500;
3760
3793
  --wds-message-modal-title-font-family: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
3761
3794
  --wds-message-modal-title-font-line-height: 28px;
3762
3795
  --wds-message-modal-title-font-size: 21px;
@@ -3778,12 +3811,21 @@
3778
3811
  --wds-notification-padding-vertical: 9px;
3779
3812
  --wds-number-input-icon-fill: #116dff;
3780
3813
  --wds-page-header-back-button-gap: 8px;
3814
+ --wds-page-header-breadcrumbs-color: #000624;
3815
+ --wds-page-header-breadcrumbs-font-size: 14px;
3816
+ --wds-page-header-breadcrumbs-offset-large: -15px;
3817
+ --wds-page-header-breadcrumbs-offset-medium: -9px;
3818
+ --wds-page-header-breadcrumbs-offset-small: -6px;
3819
+ --wds-page-header-breadcrumbs-selected-font-weight: 500;
3820
+ --wds-page-header-divider-color: #dfe5eb;
3781
3821
  --wds-page-header-padding-horizontal: 48px;
3782
3822
  --wds-page-header-padding-horizontal-small: 24px;
3783
3823
  --wds-page-header-padding-vertical: 24px;
3784
3824
  --wds-page-header-padding-vertical-small: 18px;
3785
3825
  --wds-page-header-subtitle-font-size: 16px;
3826
+ --wds-page-header-subtitle-gap: 0px;
3786
3827
  --wds-page-header-subtitle-line-height: 24px;
3828
+ --wds-page-header-subtitle-padding-start: 0px;
3787
3829
  --wds-page-header-title-actions-gap: 0px;
3788
3830
  --wds-page-header-title-font-size: 28px;
3789
3831
  --wds-page-header-title-font-weight: 700;
@@ -3937,6 +3979,7 @@
3937
3979
  --wds-select-area-fill-hover: #e7f0ff;
3938
3980
  --wds-select-area-padding-horizontal: 18px;
3939
3981
  --wds-select-area-padding-vertical: 12px;
3982
+ --wds-selectable-accordion-fill: #ffffff;
3940
3983
  --wds-selector-button-border-color: #d6e6fe;
3941
3984
  --wds-selector-button-border-color-disabled: rgba(0, 6, 36, .1);
3942
3985
  --wds-selector-button-border-color-hover: #a8caff;
@@ -4534,6 +4577,7 @@
4534
4577
  --wds-tooltip-text-fill: #ffffff;
4535
4578
  --wds-top-banner-border-color: rgba(255, 255, 255, 0);
4536
4579
  --wds-top-banner-border-radius: 0px;
4580
+ --wds-top-banner-content-color: #ffffff;
4537
4581
  --wds-top-banner-content-gap: 12px;
4538
4582
  --wds-top-banner-dismiss-gap: 12px;
4539
4583
  --wds-top-banner-fill: #c161f0;