@wix/design-system-tokens 1.232.6 → 1.234.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 (25) hide show
  1. package/CHANGELOG.md +28 -0
  2. package/all.css +54 -0
  3. package/all.scss +54 -0
  4. package/all.st.css +108 -0
  5. package/component.st.css +108 -0
  6. package/odeditor/all.css +84 -30
  7. package/odeditor/all.scss +84 -30
  8. package/odeditor/all.st.css +136 -28
  9. package/odeditor/component.st.css +119 -11
  10. package/odeditor/semantic.st.css +17 -17
  11. package/odeditor-dark/all.css +151 -95
  12. package/odeditor-dark/all.scss +151 -95
  13. package/odeditor-dark/all.st.css +204 -92
  14. package/odeditor-dark/component.st.css +187 -75
  15. package/odeditor-dark/semantic.st.css +17 -17
  16. package/package.json +2 -2
  17. package/studio/all.css +56 -0
  18. package/studio/all.scss +56 -0
  19. package/studio/all.st.css +112 -0
  20. package/studio/component.st.css +112 -0
  21. package/studio2-light/all.css +151 -95
  22. package/studio2-light/all.scss +151 -95
  23. package/studio2-light/all.st.css +204 -92
  24. package/studio2-light/component.st.css +187 -75
  25. package/studio2-light/semantic.st.css +17 -17
package/odeditor/all.scss CHANGED
@@ -182,7 +182,7 @@
182
182
  --wds-marketing-layout-badge-side: auto;
183
183
  --wds-marketing-layout-badge-position: static;
184
184
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
185
- --wds-loader-stroke-width-tiny: 2px;
185
+ --wds-loader-stroke-width-tiny: 3px;
186
186
  --wds-loader-stroke-width-small: 2px;
187
187
  --wds-loader-stroke-width-medium: 2px;
188
188
  --wds-loader-stroke-width-large: 2px;
@@ -221,6 +221,7 @@
221
221
  --wds-illustration-color-3: #B8C4FF;
222
222
  --wds-illustration-color-2: #7896FF;
223
223
  --wds-illustration-color-1: #002294;
224
+ --wds-icon-button-border-ai-secondary-ring-display: none;
224
225
  --wds-horizontal-scroll-button-text: #000624;
225
226
  --wds-horizontal-scroll-button-fill-active: #F8F6F6;
226
227
  --wds-horizontal-scroll-button-fill: #FFFFFF;
@@ -373,11 +374,6 @@
373
374
  --wds-color-fill-social-facebook-disabled: #bebebe;
374
375
  --wds-color-fill-social-facebook-active: #1877f2;
375
376
  --wds-color-fill-social-facebook: #1877f2;
376
- --wds-color-fill-ai-secondary-disabled: #e5e5e5;
377
- --wds-color-fill-ai-primary-pressed: #ffffff;
378
- --wds-color-fill-ai-primary-disabled: #bebebe;
379
- --wds-color-fill-ai-hover: #ffffff;
380
- --wds-color-fill-ai: #ffffff;
381
377
  --wds-color-fill-accent-12: #acafc4;
382
378
  --wds-color-fill-accent-11: #1b3689;
383
379
  --wds-color-fill-accent-10: #1f8845;
@@ -391,10 +387,6 @@
391
387
  --wds-color-fill-accent-2: #FFC2FE;
392
388
  --wds-color-fill-accent-1: #C4E1FF;
393
389
  --wds-color-border-stage-wip: #ffffff;
394
- --wds-color-border-ai-primary-hover: #ffffff;
395
- --wds-color-border-ai-primary-disabled: #ffffff;
396
- --wds-color-border-ai-primary-active: #ffffff;
397
- --wds-color-border-ai-primary: #ffffff;
398
390
  --wds-color-blue-600: #f5f7ff;
399
391
  --wds-color-blue-500: #eaefff;
400
392
  --wds-color-blue-400: #d5dfff;
@@ -477,6 +469,7 @@
477
469
  --wds-card-divider-opacity: 0;
478
470
  --wds-card-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
479
471
  --wds-calendar-padding-medium: 18px;
472
+ --wds-button-border-ai-secondary-ring-display: none;
480
473
  --wds-button-border-ai-secondary-mask: none;
481
474
  --wds-breakpoint-x-large: 1572px;
482
475
  --wds-breakpoint-small: 490px;
@@ -1117,10 +1110,9 @@
1117
1110
  --wds-page-header-title-minimised-font-weight: var(--wds-font-weight-heading-3);
1118
1111
  --wds-page-header-title-actions-gap: var(--wds-space-1000);
1119
1112
  --wds-page-header-subtitle-padding-start: var(--wds-space-0);
1120
- --wds-page-header-subtitle-gap: var(--wds-space-100);
1121
- --wds-page-header-subtitle-font-size: var(--wds-font-size-200);
1122
- --wds-page-header-padding-vertical-small: var(--wds-space-475);
1123
- --wds-page-header-padding-vertical: var(--wds-space-600);
1113
+ --wds-page-header-subtitle-gap: var(--wds-space-150);
1114
+ --wds-page-header-padding-vertical-small: var(--wds-space-600);
1115
+ --wds-page-header-padding-vertical: var(--wds-space-800);
1124
1116
  --wds-page-header-padding-horizontal-small: var(--wds-space-600);
1125
1117
  --wds-page-header-padding-horizontal: var(--wds-space-1200);
1126
1118
  --wds-page-header-padding-bottom-with-tail: var(--wds-space-300);
@@ -1363,6 +1355,9 @@
1363
1355
  --wds-icon-button-color-text-dark-tertiary-disabled: var(--wds-color-black-500);
1364
1356
  --wds-icon-button-color-text-dark-secondary-disabled: var(--wds-color-black-500);
1365
1357
  --wds-icon-button-color-text-dark-primary-disabled: var(--wds-color-black-500);
1358
+ --wds-icon-button-color-text-ai-tertiary-disabled: var(--wds-color-black-500);
1359
+ --wds-icon-button-color-text-ai-secondary-disabled: var(--wds-color-black-500);
1360
+ --wds-icon-button-color-text-ai-primary-disabled: var(--wds-color-black-500);
1366
1361
  --wds-icon-button-color-fill-standard-secondary-disabled: var(--wds-color-black-700);
1367
1362
  --wds-icon-button-color-fill-standard-primary-disabled: var(--wds-color-black-700);
1368
1363
  --wds-icon-button-color-fill-premium-secondary-disabled: var(--wds-color-black-700);
@@ -1373,10 +1368,14 @@
1373
1368
  --wds-icon-button-color-fill-dark-secondary-disabled: var(--wds-color-black-700);
1374
1369
  --wds-icon-button-color-fill-dark-secondary: var(--wds-color-white-transparent-0);
1375
1370
  --wds-icon-button-color-fill-dark-primary-disabled: var(--wds-color-black-700);
1371
+ --wds-icon-button-color-fill-ai-secondary-disabled: var(--wds-color-black-700);
1372
+ --wds-icon-button-color-fill-ai-primary-disabled: var(--wds-color-black-700);
1376
1373
  --wds-icon-button-color-border-standard-secondary-disabled: var(--wds-color-black-700);
1377
1374
  --wds-icon-button-color-border-premium-secondary-disabled: var(--wds-color-black-700);
1378
1375
  --wds-icon-button-color-border-light-secondary-disabled: var(--wds-color-black-700);
1379
1376
  --wds-icon-button-color-border-dark-secondary-disabled: var(--wds-color-black-700);
1377
+ --wds-icon-button-color-border-ai-secondary-disabled: var(--wds-color-black-700);
1378
+ --wds-icon-button-border-ai-width: var(--wds-border-width-100);
1380
1379
  --wds-google-preview-surface-fill: var(--wds-color-white);
1381
1380
  --wds-form-field-label-gap-tiny: var(--wds-space-150);
1382
1381
  --wds-form-field-label-gap-small: var(--wds-space-200);
@@ -1671,16 +1670,6 @@
1671
1670
  --wds-color-fill-dark-primary-disabled: var(--wds-color-black-100-transparent-30);
1672
1671
  --wds-color-fill-dark-primary-active: var(--wds-color-black-300);
1673
1672
  --wds-color-fill-dark-primary: var(--wds-color-black-100);
1674
- --wds-color-fill-ai-tertiary-hover: var(--wds-color-black-750);
1675
- --wds-color-fill-ai-tertiary-disabled: var(--wds-color-white);
1676
- --wds-color-fill-ai-tertiary-active: var(--wds-color-iris-400);
1677
- --wds-color-fill-ai-tertiary: var(--wds-color-white);
1678
- --wds-color-fill-ai-secondary-hover: var(--wds-color-iris-300);
1679
- --wds-color-fill-ai-secondary-active: var(--wds-color-iris-400);
1680
- --wds-color-fill-ai-secondary: var(--wds-color-iris-400);
1681
- --wds-color-fill-ai-primary-hover: var(--wds-color-iris-0);
1682
- --wds-color-fill-ai-primary-active: var(--wds-color-iris-100);
1683
- --wds-color-fill-ai-primary: var(--wds-color-iris-100);
1684
1673
  --wds-color-border-warning-tertiary-hover: var(--wds-color-yellow-500);
1685
1674
  --wds-color-border-warning-tertiary-disabled: var(--wds-color-black-100-transparent-10);
1686
1675
  --wds-color-border-warning-tertiary-active: var(--wds-color-yellow-400);
@@ -1914,6 +1903,9 @@
1914
1903
  --wds-button-label-fill-destructive-primary-disabled: var(--wds-color-black-500);
1915
1904
  --wds-button-label-fill-dark-secondary-disabled: var(--wds-color-black-500);
1916
1905
  --wds-button-label-fill-dark-primary-disabled: var(--wds-color-black-500);
1906
+ --wds-button-label-fill-ai-tertiary-disabled: var(--wds-color-black-500);
1907
+ --wds-button-label-fill-ai-secondary-disabled: var(--wds-color-black-500);
1908
+ --wds-button-label-fill-ai-primary-disabled: var(--wds-color-black-500);
1917
1909
  --wds-button-icon-offset-tiny: var(--wds-space-300);
1918
1910
  --wds-button-icon-offset-small: var(--wds-space-300);
1919
1911
  --wds-button-icon-offset-medium: var(--wds-space-475);
@@ -1941,6 +1933,11 @@
1941
1933
  --wds-button-fill-dark-secondary-active: var(--wds-color-black-550);
1942
1934
  --wds-button-fill-dark-secondary: var(--wds-color-white-transparent-0);
1943
1935
  --wds-button-fill-dark-primary-disabled: var(--wds-color-black-700);
1936
+ --wds-button-fill-ai-tertiary-disabled: var(--wds-color-black-700);
1937
+ --wds-button-fill-ai-tertiary: var(--wds-color-white-transparent-0);
1938
+ --wds-button-fill-ai-secondary-disabled: var(--wds-color-black-700);
1939
+ --wds-button-fill-ai-secondary: var(--wds-color-white-transparent-0);
1940
+ --wds-button-fill-ai-primary-disabled: var(--wds-color-black-700);
1944
1941
  --wds-button-border-width-secondary-hover: var(--wds-border-width-100);
1945
1942
  --wds-button-border-standard-secondary-disabled: var(--wds-color-black-700);
1946
1943
  --wds-button-border-radius-tiny: var(--wds-border-radius-300);
@@ -1953,6 +1950,8 @@
1953
1950
  --wds-button-border-dark-secondary-hover: var(--wds-color-black-550);
1954
1951
  --wds-button-border-dark-secondary-disabled: var(--wds-color-black-700);
1955
1952
  --wds-button-border-dark-secondary-active: var(--wds-color-black-550);
1953
+ --wds-button-border-ai-tertiary-disabled: var(--wds-color-black-700);
1954
+ --wds-button-border-ai-secondary-disabled: var(--wds-color-black-700);
1956
1955
  --wds-breadcrumbs-text-weight-selected: var(--wds-font-weight-medium);
1957
1956
  --wds-breadcrumbs-text-weight-default: var(--wds-font-weight-regular);
1958
1957
  --wds-breadcrumbs-padding-vertical-small: var(--wds-space-100);
@@ -2306,7 +2305,7 @@
2306
2305
  --wds-page-header-title-minimised-font-size: var(--wds-font-size-heading-3);
2307
2306
  --wds-page-header-title-font-weight: var(--wds-font-weight-heading-2);
2308
2307
  --wds-page-header-title-font-size: var(--wds-font-size-heading-2);
2309
- --wds-page-header-subtitle-line-height: var(--wds-font-line-height-200);
2308
+ --wds-page-header-subtitle-font-size: var(--wds-font-size-body-small);
2310
2309
  --wds-number-input-spacing: var(--wds-form-field-label-gap-tiny);
2311
2310
  --wds-number-input-icon-fill: var(--wds-color-text-standard-secondary);
2312
2311
  --wds-notification-content-color: var(--wds-color-text-standard-secondary);
@@ -2370,7 +2369,7 @@
2370
2369
  --wds-input-border-color-focus: var(--wds-color-border-standard-primary-active);
2371
2370
  --wds-input-background-fill-on-stage: var(--wds-color-fill-dark-secondary);
2372
2371
  --wds-info-icon-fill-hover: var(--wds-color-text-primary);
2373
- --wds-info-icon-fill: var(--wds-color-text-placeholder);
2372
+ --wds-info-icon-fill: var(--wds-color-text-standard-secondary);
2374
2373
  --wds-icon-button-color-text-standard-tertiary-hover: var(--wds-color-fill-standard-primary-active);
2375
2374
  --wds-icon-button-color-text-standard-tertiary-active: var(--wds-color-fill-standard-primary-active);
2376
2375
  --wds-icon-button-color-text-standard-tertiary: var(--wds-color-text-primary);
@@ -2408,6 +2407,13 @@
2408
2407
  --wds-icon-button-color-text-dark-primary-hover: var(--wds-color-text-standard-primary-light);
2409
2408
  --wds-icon-button-color-text-dark-primary-active: var(--wds-color-text-standard-primary-light);
2410
2409
  --wds-icon-button-color-text-dark-primary: var(--wds-color-text-standard-primary-light);
2410
+ --wds-icon-button-color-text-ai-tertiary-hover: var(--wds-color-fill-standard-primary-active);
2411
+ --wds-icon-button-color-text-ai-tertiary-active: var(--wds-color-fill-standard-primary-active);
2412
+ --wds-icon-button-color-text-ai-tertiary: var(--wds-color-text-primary);
2413
+ --wds-icon-button-color-text-ai-secondary-hover: var(--wds-color-fill-standard-primary-active);
2414
+ --wds-icon-button-color-text-ai-secondary-active: var(--wds-color-fill-standard-primary-active);
2415
+ --wds-icon-button-color-text-ai-secondary: var(--wds-color-text-primary);
2416
+ --wds-icon-button-color-text-ai-primary: var(--wds-color-text-standard-primary-light);
2411
2417
  --wds-icon-button-color-fill-standard-tertiary-hover: var(--wds-color-fill-light-secondary-hover);
2412
2418
  --wds-icon-button-color-fill-standard-tertiary-disabled: var(--wds-color-fill-light-secondary);
2413
2419
  --wds-icon-button-color-fill-standard-tertiary-active: var(--wds-color-fill-light-secondary-active);
@@ -2446,6 +2452,16 @@
2446
2452
  --wds-icon-button-color-fill-dark-primary-hover: var(--wds-color-fill-dark-primary-hover);
2447
2453
  --wds-icon-button-color-fill-dark-primary-active: var(--wds-color-fill-dark-primary-active);
2448
2454
  --wds-icon-button-color-fill-dark-primary: var(--wds-color-fill-dark-primary);
2455
+ --wds-icon-button-color-fill-ai-tertiary-hover: var(--wds-color-fill-light-secondary-hover);
2456
+ --wds-icon-button-color-fill-ai-tertiary-disabled: var(--wds-color-fill-light-secondary);
2457
+ --wds-icon-button-color-fill-ai-tertiary-active: var(--wds-color-fill-light-secondary-active);
2458
+ --wds-icon-button-color-fill-ai-tertiary: var(--wds-color-fill-light-secondary);
2459
+ --wds-icon-button-color-fill-ai-secondary-hover: var(--wds-color-fill-standard-tertiary-hover);
2460
+ --wds-icon-button-color-fill-ai-secondary-active: var(--wds-color-fill-standard-tertiary-active);
2461
+ --wds-icon-button-color-fill-ai-secondary: var(--wds-color-fill-standard-tertiary);
2462
+ --wds-icon-button-color-fill-ai-primary-hover: var(--wds-color-fill-standard-primary-hover);
2463
+ --wds-icon-button-color-fill-ai-primary-active: var(--wds-color-fill-standard-primary-active);
2464
+ --wds-icon-button-color-fill-ai-primary: var(--wds-color-fill-standard-primary);
2449
2465
  --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-border-standard-secondary-hover);
2450
2466
  --wds-icon-button-color-border-standard-secondary-active: var(--wds-color-border-standard-tertiary-active);
2451
2467
  --wds-icon-button-color-border-standard-secondary: var(--wds-color-border-standard-primary);
@@ -2457,6 +2473,12 @@
2457
2473
  --wds-icon-button-color-border-dark-secondary-hover: var(--wds-color-border-dark-secondary-hover);
2458
2474
  --wds-icon-button-color-border-dark-secondary-active: var(--wds-color-border-dark-secondary-active);
2459
2475
  --wds-icon-button-color-border-dark-secondary: var(--wds-color-border-dark-primary);
2476
+ --wds-icon-button-color-border-ai-secondary-hover: var(--wds-color-border-standard-secondary-hover);
2477
+ --wds-icon-button-color-border-ai-secondary-active: var(--wds-color-border-standard-tertiary-active);
2478
+ --wds-icon-button-color-border-ai-secondary: var(--wds-color-border-standard-primary);
2479
+ --wds-icon-button-color-border-ai-primary-hover: var(--wds-color-fill-standard-primary-hover);
2480
+ --wds-icon-button-color-border-ai-primary-active: var(--wds-color-fill-standard-primary-active);
2481
+ --wds-icon-button-color-border-ai-primary: var(--wds-color-fill-standard-primary);
2460
2482
  --wds-form-field-label-readonly: var(--wds-color-text-disabled);
2461
2483
  --wds-form-field-label-font-size-tiny: var(--wds-font-size-body-extra-tiny);
2462
2484
  --wds-form-field-label-font-size-small: var(--wds-font-size-body-tiny);
@@ -2498,6 +2520,25 @@
2498
2520
  --wds-composer-header-fill: var(--wds-color-fill-surface-sunken);
2499
2521
  --wds-color-fill-surface-overlay-blur: var(--wds-color-fill-surface-overlay);
2500
2522
  --wds-color-fill-surface-modal-backdrop: var(--wds-color-fill-transparent-primary);
2523
+ --wds-color-fill-ai-tertiary-hover: var(--wds-color-fill-standard-tertiary-hover);
2524
+ --wds-color-fill-ai-tertiary-disabled: var(--wds-color-fill-standard-tertiary-disabled);
2525
+ --wds-color-fill-ai-tertiary-active: var(--wds-color-fill-standard-tertiary-active);
2526
+ --wds-color-fill-ai-tertiary: var(--wds-color-fill-standard-tertiary);
2527
+ --wds-color-fill-ai-secondary-hover: var(--wds-color-fill-standard-primary-hover);
2528
+ --wds-color-fill-ai-secondary-disabled: var(--wds-color-fill-standard-secondary-disabled);
2529
+ --wds-color-fill-ai-secondary-active: var(--wds-color-fill-standard-primary-active);
2530
+ --wds-color-fill-ai-secondary: var(--wds-color-fill-standard-secondary);
2531
+ --wds-color-fill-ai-primary-pressed: var(--wds-color-fill-standard-primary-active);
2532
+ --wds-color-fill-ai-primary-hover: var(--wds-color-fill-standard-primary-hover);
2533
+ --wds-color-fill-ai-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
2534
+ --wds-color-fill-ai-primary-active: var(--wds-color-fill-standard-primary-active);
2535
+ --wds-color-fill-ai-primary: var(--wds-color-fill-standard-primary);
2536
+ --wds-color-fill-ai-hover: var(--wds-color-fill-standard-primary-hover);
2537
+ --wds-color-fill-ai: var(--wds-color-fill-standard-primary);
2538
+ --wds-color-border-ai-primary-hover: var(--wds-color-border-standard-primary-hover);
2539
+ --wds-color-border-ai-primary-disabled: var(--wds-color-border-standard-primary-disabled);
2540
+ --wds-color-border-ai-primary-active: var(--wds-color-border-standard-primary-active);
2541
+ --wds-color-border-ai-primary: var(--wds-color-border-standard-primary);
2501
2542
  --wds-close-button-standard-filled-text-hover: var(--wds-color-text-standard-primary);
2502
2543
  --wds-close-button-standard-filled-text-disabled: var(--wds-color-text-disabled);
2503
2544
  --wds-close-button-standard-filled-text: var(--wds-color-text-standard-primary);
@@ -2561,6 +2602,12 @@
2561
2602
  --wds-button-label-fill-dark-secondary-hover: var(--wds-color-text-standard-primary);
2562
2603
  --wds-button-label-fill-dark-secondary-active: var(--wds-color-text-standard-primary);
2563
2604
  --wds-button-label-fill-dark-secondary: var(--wds-color-text-standard-primary);
2605
+ --wds-button-label-fill-ai-tertiary-hover: var(--wds-color-fill-standard-primary-active);
2606
+ --wds-button-label-fill-ai-tertiary-active: var(--wds-color-fill-standard-primary-active);
2607
+ --wds-button-label-fill-ai-tertiary: var(--wds-color-fill-standard-primary-hover);
2608
+ --wds-button-label-fill-ai-secondary-hover: var(--wds-color-fill-standard-primary-active);
2609
+ --wds-button-label-fill-ai-secondary-active: var(--wds-color-fill-standard-primary-active);
2610
+ --wds-button-label-fill-ai-secondary: var(--wds-color-fill-standard-primary-hover);
2564
2611
  --wds-button-label-fill-ai-primary: var(--wds-color-text-standard-primary-light);
2565
2612
  --wds-button-font-size-tiny: var(--wds-font-size-body-tiny);
2566
2613
  --wds-button-font-size-small: var(--wds-font-size-body-tiny);
@@ -2580,10 +2627,13 @@
2580
2627
  --wds-button-fill-gradient-hover-primary: var(--wds-color-fill-standard-primary-hover);
2581
2628
  --wds-button-fill-destructive-secondary-hover: var(--wds-color-fill-destructive-tertiary-hover);
2582
2629
  --wds-button-fill-destructive-secondary-active: var(--wds-color-fill-destructive-tertiary-active);
2583
- --wds-button-fill-ai-secondary: var(--wds-color-fill-standard-tertiary);
2584
- --wds-button-fill-ai-primary-hover: var(--wds-color-fill-ai-primary-hover);
2585
- --wds-button-fill-ai-primary-active: var(--wds-color-fill-ai-primary-active);
2586
- --wds-button-fill-ai-primary: var(--wds-color-fill-ai-primary);
2630
+ --wds-button-fill-ai-tertiary-hover: var(--wds-color-fill-standard-tertiary-hover);
2631
+ --wds-button-fill-ai-tertiary-active: var(--wds-color-fill-standard-tertiary-active);
2632
+ --wds-button-fill-ai-secondary-hover: var(--wds-color-fill-standard-tertiary-hover);
2633
+ --wds-button-fill-ai-secondary-active: var(--wds-color-fill-standard-tertiary-active);
2634
+ --wds-button-fill-ai-primary-hover: var(--wds-color-fill-standard-primary-hover);
2635
+ --wds-button-fill-ai-primary-active: var(--wds-color-fill-standard-primary-active);
2636
+ --wds-button-fill-ai-primary: var(--wds-color-fill-standard-primary);
2587
2637
  --wds-button-border-standard-secondary-hover: var(--wds-color-border-standard-secondary-hover);
2588
2638
  --wds-button-border-standard-secondary-active: var(--wds-color-fill-standard-tertiary-active);
2589
2639
  --wds-button-border-standard-secondary: var(--wds-color-border-standard-primary);
@@ -2593,6 +2643,9 @@
2593
2643
  --wds-button-border-destructive-secondary-active: var(--wds-color-border-destructive-tertiary-active);
2594
2644
  --wds-button-border-destructive-secondary: var(--wds-color-border-destructive-primary);
2595
2645
  --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
2646
+ --wds-button-border-ai-secondary-hover: var(--wds-color-border-standard-secondary-hover);
2647
+ --wds-button-border-ai-secondary-active: var(--wds-color-fill-standard-tertiary-active);
2648
+ --wds-button-border-ai-secondary: var(--wds-color-border-standard-primary);
2596
2649
  --wds-breadcrumbs-text-line-height-small: var(--wds-font-line-height-200);
2597
2650
  --wds-breadcrumbs-on-grey-text-fill-active: var(--wds-color-text-standard-primary);
2598
2651
  --wds-badge-transparent-neutral-standard-label-color: var(--wds-color-text-primary);
@@ -2673,6 +2726,7 @@
2673
2726
  --wds-page-section-subtitle-line-height: var(--wds-font-line-height-body-tiny);
2674
2727
  --wds-page-header-title-minimised-line-height: var(--wds-font-line-height-heading-3);
2675
2728
  --wds-page-header-title-line-height: var(--wds-font-line-height-heading-2);
2729
+ --wds-page-header-subtitle-line-height: var(--wds-font-line-height-body-small);
2676
2730
  --wds-message-modal-text-font-line-height: var(--wds-font-line-height-body-small);
2677
2731
  --wds-marketing-page-content-line-height: var(--wds-font-line-height-body-small);
2678
2732
  --wds-marketing-layout-description-line-height-tiny: var(--wds-font-line-height-body-tiny);
package/odeditor/all.st.css CHANGED
@@ -226,7 +226,13 @@
226
226
  @property st-global(--wds-breakpoint-medium);
227
227
  @property st-global(--wds-breakpoint-small);
228
228
  @property st-global(--wds-breakpoint-x-large);
229
+ @property st-global(--wds-button-border-ai-secondary);
230
+ @property st-global(--wds-button-border-ai-secondary-active);
231
+ @property st-global(--wds-button-border-ai-secondary-disabled);
232
+ @property st-global(--wds-button-border-ai-secondary-hover);
229
233
  @property st-global(--wds-button-border-ai-secondary-mask);
234
+ @property st-global(--wds-button-border-ai-secondary-ring-display);
235
+ @property st-global(--wds-button-border-ai-tertiary-disabled);
230
236
  @property st-global(--wds-button-border-dark-secondary);
231
237
  @property st-global(--wds-button-border-dark-secondary-active);
232
238
  @property st-global(--wds-button-border-dark-secondary-disabled);
@@ -250,8 +256,16 @@
250
256
  @property st-global(--wds-button-border-width-secondary-hover);
251
257
  @property st-global(--wds-button-fill-ai-primary);
252
258
  @property st-global(--wds-button-fill-ai-primary-active);
259
+ @property st-global(--wds-button-fill-ai-primary-disabled);
253
260
  @property st-global(--wds-button-fill-ai-primary-hover);
254
261
  @property st-global(--wds-button-fill-ai-secondary);
262
+ @property st-global(--wds-button-fill-ai-secondary-active);
263
+ @property st-global(--wds-button-fill-ai-secondary-disabled);
264
+ @property st-global(--wds-button-fill-ai-secondary-hover);
265
+ @property st-global(--wds-button-fill-ai-tertiary);
266
+ @property st-global(--wds-button-fill-ai-tertiary-active);
267
+ @property st-global(--wds-button-fill-ai-tertiary-disabled);
268
+ @property st-global(--wds-button-fill-ai-tertiary-hover);
255
269
  @property st-global(--wds-button-fill-dark-primary-disabled);
256
270
  @property st-global(--wds-button-fill-dark-secondary);
257
271
  @property st-global(--wds-button-fill-dark-secondary-active);
@@ -303,6 +317,15 @@
303
317
  @property st-global(--wds-button-icon-offset-small);
304
318
  @property st-global(--wds-button-icon-offset-tiny);
305
319
  @property st-global(--wds-button-label-fill-ai-primary);
320
+ @property st-global(--wds-button-label-fill-ai-primary-disabled);
321
+ @property st-global(--wds-button-label-fill-ai-secondary);
322
+ @property st-global(--wds-button-label-fill-ai-secondary-active);
323
+ @property st-global(--wds-button-label-fill-ai-secondary-disabled);
324
+ @property st-global(--wds-button-label-fill-ai-secondary-hover);
325
+ @property st-global(--wds-button-label-fill-ai-tertiary);
326
+ @property st-global(--wds-button-label-fill-ai-tertiary-active);
327
+ @property st-global(--wds-button-label-fill-ai-tertiary-disabled);
328
+ @property st-global(--wds-button-label-fill-ai-tertiary-hover);
306
329
  @property st-global(--wds-button-label-fill-dark-primary-disabled);
307
330
  @property st-global(--wds-button-label-fill-dark-secondary);
308
331
  @property st-global(--wds-button-label-fill-dark-secondary-active);
@@ -1213,6 +1236,15 @@
1213
1236
  @property st-global(--wds-horizontal-scroll-button-fill);
1214
1237
  @property st-global(--wds-horizontal-scroll-button-fill-active);
1215
1238
  @property st-global(--wds-horizontal-scroll-button-text);
1239
+ @property st-global(--wds-icon-button-border-ai-secondary-ring-display);
1240
+ @property st-global(--wds-icon-button-border-ai-width);
1241
+ @property st-global(--wds-icon-button-color-border-ai-primary);
1242
+ @property st-global(--wds-icon-button-color-border-ai-primary-active);
1243
+ @property st-global(--wds-icon-button-color-border-ai-primary-hover);
1244
+ @property st-global(--wds-icon-button-color-border-ai-secondary);
1245
+ @property st-global(--wds-icon-button-color-border-ai-secondary-active);
1246
+ @property st-global(--wds-icon-button-color-border-ai-secondary-disabled);
1247
+ @property st-global(--wds-icon-button-color-border-ai-secondary-hover);
1216
1248
  @property st-global(--wds-icon-button-color-border-dark-secondary);
1217
1249
  @property st-global(--wds-icon-button-color-border-dark-secondary-active);
1218
1250
  @property st-global(--wds-icon-button-color-border-dark-secondary-disabled);
@@ -1228,6 +1260,18 @@
1228
1260
  @property st-global(--wds-icon-button-color-border-standard-secondary-active);
1229
1261
  @property st-global(--wds-icon-button-color-border-standard-secondary-disabled);
1230
1262
  @property st-global(--wds-icon-button-color-border-standard-secondary-hover);
1263
+ @property st-global(--wds-icon-button-color-fill-ai-primary);
1264
+ @property st-global(--wds-icon-button-color-fill-ai-primary-active);
1265
+ @property st-global(--wds-icon-button-color-fill-ai-primary-disabled);
1266
+ @property st-global(--wds-icon-button-color-fill-ai-primary-hover);
1267
+ @property st-global(--wds-icon-button-color-fill-ai-secondary);
1268
+ @property st-global(--wds-icon-button-color-fill-ai-secondary-active);
1269
+ @property st-global(--wds-icon-button-color-fill-ai-secondary-disabled);
1270
+ @property st-global(--wds-icon-button-color-fill-ai-secondary-hover);
1271
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary);
1272
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary-active);
1273
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary-disabled);
1274
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary-hover);
1231
1275
  @property st-global(--wds-icon-button-color-fill-dark-primary);
1232
1276
  @property st-global(--wds-icon-button-color-fill-dark-primary-active);
1233
1277
  @property st-global(--wds-icon-button-color-fill-dark-primary-disabled);
@@ -1276,6 +1320,16 @@
1276
1320
  @property st-global(--wds-icon-button-color-fill-standard-tertiary-active);
1277
1321
  @property st-global(--wds-icon-button-color-fill-standard-tertiary-disabled);
1278
1322
  @property st-global(--wds-icon-button-color-fill-standard-tertiary-hover);
1323
+ @property st-global(--wds-icon-button-color-text-ai-primary);
1324
+ @property st-global(--wds-icon-button-color-text-ai-primary-disabled);
1325
+ @property st-global(--wds-icon-button-color-text-ai-secondary);
1326
+ @property st-global(--wds-icon-button-color-text-ai-secondary-active);
1327
+ @property st-global(--wds-icon-button-color-text-ai-secondary-disabled);
1328
+ @property st-global(--wds-icon-button-color-text-ai-secondary-hover);
1329
+ @property st-global(--wds-icon-button-color-text-ai-tertiary);
1330
+ @property st-global(--wds-icon-button-color-text-ai-tertiary-active);
1331
+ @property st-global(--wds-icon-button-color-text-ai-tertiary-disabled);
1332
+ @property st-global(--wds-icon-button-color-text-ai-tertiary-hover);
1279
1333
  @property st-global(--wds-icon-button-color-text-dark-primary);
1280
1334
  @property st-global(--wds-icon-button-color-text-dark-primary-active);
1281
1335
  @property st-global(--wds-icon-button-color-text-dark-primary-disabled);
@@ -2941,7 +2995,13 @@
2941
2995
  --wds-breakpoint-medium: 768px;
2942
2996
  --wds-breakpoint-small: 490px;
2943
2997
  --wds-breakpoint-x-large: 1572px;
2998
+ --wds-button-border-ai-secondary: #7896ff;
2999
+ --wds-button-border-ai-secondary-active: #d5dfff;
3000
+ --wds-button-border-ai-secondary-disabled: #f0efef;
3001
+ --wds-button-border-ai-secondary-hover: #acbeff;
2944
3002
  --wds-button-border-ai-secondary-mask: none;
3003
+ --wds-button-border-ai-secondary-ring-display: none;
3004
+ --wds-button-border-ai-tertiary-disabled: #f0efef;
2945
3005
  --wds-button-border-dark-secondary: #767574;
2946
3006
  --wds-button-border-dark-secondary-active: #dedede;
2947
3007
  --wds-button-border-dark-secondary-disabled: #f0efef;
@@ -2963,10 +3023,18 @@
2963
3023
  --wds-button-border-standard-secondary-disabled: #f0efef;
2964
3024
  --wds-button-border-standard-secondary-hover: #acbeff;
2965
3025
  --wds-button-border-width-secondary-hover: 1px;
2966
- --wds-button-fill-ai-primary: #5a48f5;
2967
- --wds-button-fill-ai-primary-active: #5a48f5;
2968
- --wds-button-fill-ai-primary-hover: #4d3dd0;
2969
- --wds-button-fill-ai-secondary: #ffffff;
3026
+ --wds-button-fill-ai-primary: #2f5dff;
3027
+ --wds-button-fill-ai-primary-active: #0f2ccf;
3028
+ --wds-button-fill-ai-primary-disabled: #f0efef;
3029
+ --wds-button-fill-ai-primary-hover: #1c3fe5;
3030
+ --wds-button-fill-ai-secondary: rgba(255, 255, 255, 0);
3031
+ --wds-button-fill-ai-secondary-active: #d5dfff;
3032
+ --wds-button-fill-ai-secondary-disabled: #f0efef;
3033
+ --wds-button-fill-ai-secondary-hover: #eaefff;
3034
+ --wds-button-fill-ai-tertiary: rgba(255, 255, 255, 0);
3035
+ --wds-button-fill-ai-tertiary-active: #d5dfff;
3036
+ --wds-button-fill-ai-tertiary-disabled: #f0efef;
3037
+ --wds-button-fill-ai-tertiary-hover: #eaefff;
2970
3038
  --wds-button-fill-dark-primary-disabled: #f0efef;
2971
3039
  --wds-button-fill-dark-secondary: rgba(255, 255, 255, 0);
2972
3040
  --wds-button-fill-dark-secondary-active: #dedede;
@@ -3018,6 +3086,15 @@
3018
3086
  --wds-button-icon-offset-small: 12px;
3019
3087
  --wds-button-icon-offset-tiny: 12px;
3020
3088
  --wds-button-label-fill-ai-primary: #ffffff;
3089
+ --wds-button-label-fill-ai-primary-disabled: #a8a6a5;
3090
+ --wds-button-label-fill-ai-secondary: #1c3fe5;
3091
+ --wds-button-label-fill-ai-secondary-active: #0f2ccf;
3092
+ --wds-button-label-fill-ai-secondary-disabled: #a8a6a5;
3093
+ --wds-button-label-fill-ai-secondary-hover: #0f2ccf;
3094
+ --wds-button-label-fill-ai-tertiary: #1c3fe5;
3095
+ --wds-button-label-fill-ai-tertiary-active: #0f2ccf;
3096
+ --wds-button-label-fill-ai-tertiary-disabled: #a8a6a5;
3097
+ --wds-button-label-fill-ai-tertiary-hover: #0f2ccf;
3021
3098
  --wds-button-label-fill-dark-primary-disabled: #a8a6a5;
3022
3099
  --wds-button-label-fill-dark-secondary: #151414;
3023
3100
  --wds-button-label-fill-dark-secondary-active: #151414;
@@ -3311,10 +3388,10 @@
3311
3388
  --wds-color-blue-400: #d5dfff;
3312
3389
  --wds-color-blue-500: #eaefff;
3313
3390
  --wds-color-blue-600: #f5f7ff;
3314
- --wds-color-border-ai-primary: #ffffff;
3315
- --wds-color-border-ai-primary-active: #ffffff;
3316
- --wds-color-border-ai-primary-disabled: #ffffff;
3317
- --wds-color-border-ai-primary-hover: #ffffff;
3391
+ --wds-color-border-ai-primary: #7896ff;
3392
+ --wds-color-border-ai-primary-active: #2f5dff;
3393
+ --wds-color-border-ai-primary-disabled: rgba(19, 23, 32, .1);
3394
+ --wds-color-border-ai-primary-hover: #597dff;
3318
3395
  --wds-color-border-dark-primary: #767574;
3319
3396
  --wds-color-border-dark-primary-active: #383838;
3320
3397
  --wds-color-border-dark-primary-disabled: rgba(19, 23, 32, .1);
@@ -3420,21 +3497,21 @@
3420
3497
  --wds-color-fill-accent-10: #1f8845;
3421
3498
  --wds-color-fill-accent-11: #1b3689;
3422
3499
  --wds-color-fill-accent-12: #acafc4;
3423
- --wds-color-fill-ai: #ffffff;
3424
- --wds-color-fill-ai-hover: #ffffff;
3425
- --wds-color-fill-ai-primary: #5a48f5;
3426
- --wds-color-fill-ai-primary-active: #5a48f5;
3427
- --wds-color-fill-ai-primary-disabled: #bebebe;
3428
- --wds-color-fill-ai-primary-hover: #4d3dd0;
3429
- --wds-color-fill-ai-primary-pressed: #ffffff;
3430
- --wds-color-fill-ai-secondary: #d6d1fc;
3431
- --wds-color-fill-ai-secondary-active: #d6d1fc;
3432
- --wds-color-fill-ai-secondary-disabled: #e5e5e5;
3433
- --wds-color-fill-ai-secondary-hover: #a59bfa;
3500
+ --wds-color-fill-ai: #2f5dff;
3501
+ --wds-color-fill-ai-hover: #1c3fe5;
3502
+ --wds-color-fill-ai-primary: #2f5dff;
3503
+ --wds-color-fill-ai-primary-active: #0f2ccf;
3504
+ --wds-color-fill-ai-primary-disabled: rgba(19, 23, 32, .3);
3505
+ --wds-color-fill-ai-primary-hover: #1c3fe5;
3506
+ --wds-color-fill-ai-primary-pressed: #0f2ccf;
3507
+ --wds-color-fill-ai-secondary: #d5dfff;
3508
+ --wds-color-fill-ai-secondary-active: #0f2ccf;
3509
+ --wds-color-fill-ai-secondary-disabled: rgba(19, 23, 32, .1);
3510
+ --wds-color-fill-ai-secondary-hover: #1c3fe5;
3434
3511
  --wds-color-fill-ai-tertiary: #ffffff;
3435
- --wds-color-fill-ai-tertiary-active: #d6d1fc;
3512
+ --wds-color-fill-ai-tertiary-active: #d5dfff;
3436
3513
  --wds-color-fill-ai-tertiary-disabled: #ffffff;
3437
- --wds-color-fill-ai-tertiary-hover: #f8f6f6;
3514
+ --wds-color-fill-ai-tertiary-hover: #eaefff;
3438
3515
  --wds-color-fill-dark-primary: #151414;
3439
3516
  --wds-color-fill-dark-primary-active: #525150;
3440
3517
  --wds-color-fill-dark-primary-disabled: rgba(19, 23, 32, .3);
@@ -3928,6 +4005,15 @@
3928
4005
  --wds-horizontal-scroll-button-fill: #FFFFFF;
3929
4006
  --wds-horizontal-scroll-button-fill-active: #F8F6F6;
3930
4007
  --wds-horizontal-scroll-button-text: #000624;
4008
+ --wds-icon-button-border-ai-secondary-ring-display: none;
4009
+ --wds-icon-button-border-ai-width: 1px;
4010
+ --wds-icon-button-color-border-ai-primary: #2f5dff;
4011
+ --wds-icon-button-color-border-ai-primary-active: #0f2ccf;
4012
+ --wds-icon-button-color-border-ai-primary-hover: #1c3fe5;
4013
+ --wds-icon-button-color-border-ai-secondary: #7896ff;
4014
+ --wds-icon-button-color-border-ai-secondary-active: #d5dfff;
4015
+ --wds-icon-button-color-border-ai-secondary-disabled: #f0efef;
4016
+ --wds-icon-button-color-border-ai-secondary-hover: #acbeff;
3931
4017
  --wds-icon-button-color-border-dark-secondary: #767574;
3932
4018
  --wds-icon-button-color-border-dark-secondary-active: #dedede;
3933
4019
  --wds-icon-button-color-border-dark-secondary-disabled: #f0efef;
@@ -3943,6 +4029,18 @@
3943
4029
  --wds-icon-button-color-border-standard-secondary-active: #d5dfff;
3944
4030
  --wds-icon-button-color-border-standard-secondary-disabled: #f0efef;
3945
4031
  --wds-icon-button-color-border-standard-secondary-hover: #acbeff;
4032
+ --wds-icon-button-color-fill-ai-primary: #2f5dff;
4033
+ --wds-icon-button-color-fill-ai-primary-active: #0f2ccf;
4034
+ --wds-icon-button-color-fill-ai-primary-disabled: #f0efef;
4035
+ --wds-icon-button-color-fill-ai-primary-hover: #1c3fe5;
4036
+ --wds-icon-button-color-fill-ai-secondary: #ffffff;
4037
+ --wds-icon-button-color-fill-ai-secondary-active: #d5dfff;
4038
+ --wds-icon-button-color-fill-ai-secondary-disabled: #f0efef;
4039
+ --wds-icon-button-color-fill-ai-secondary-hover: #eaefff;
4040
+ --wds-icon-button-color-fill-ai-tertiary: rgba(255, 255, 255, 0);
4041
+ --wds-icon-button-color-fill-ai-tertiary-active: #d5dfff;
4042
+ --wds-icon-button-color-fill-ai-tertiary-disabled: rgba(255, 255, 255, 0);
4043
+ --wds-icon-button-color-fill-ai-tertiary-hover: #eaefff;
3946
4044
  --wds-icon-button-color-fill-dark-primary: #151414;
3947
4045
  --wds-icon-button-color-fill-dark-primary-active: #525150;
3948
4046
  --wds-icon-button-color-fill-dark-primary-disabled: #f0efef;
@@ -3991,6 +4089,16 @@
3991
4089
  --wds-icon-button-color-fill-standard-tertiary-active: #d5dfff;
3992
4090
  --wds-icon-button-color-fill-standard-tertiary-disabled: rgba(255, 255, 255, 0);
3993
4091
  --wds-icon-button-color-fill-standard-tertiary-hover: #eaefff;
4092
+ --wds-icon-button-color-text-ai-primary: #ffffff;
4093
+ --wds-icon-button-color-text-ai-primary-disabled: #a8a6a5;
4094
+ --wds-icon-button-color-text-ai-secondary: #2f5dff;
4095
+ --wds-icon-button-color-text-ai-secondary-active: #0f2ccf;
4096
+ --wds-icon-button-color-text-ai-secondary-disabled: #a8a6a5;
4097
+ --wds-icon-button-color-text-ai-secondary-hover: #0f2ccf;
4098
+ --wds-icon-button-color-text-ai-tertiary: #2f5dff;
4099
+ --wds-icon-button-color-text-ai-tertiary-active: #0f2ccf;
4100
+ --wds-icon-button-color-text-ai-tertiary-disabled: #a8a6a5;
4101
+ --wds-icon-button-color-text-ai-tertiary-hover: #0f2ccf;
3994
4102
  --wds-icon-button-color-text-dark-primary: #ffffff;
3995
4103
  --wds-icon-button-color-text-dark-primary-active: #ffffff;
3996
4104
  --wds-icon-button-color-text-dark-primary-disabled: #a8a6a5;
@@ -4053,7 +4161,7 @@
4053
4161
  --wds-illustration-color-opacity-100: #F8F6F600;
4054
4162
  --wds-image-border-radius-default: 8px;
4055
4163
  --wds-image-border-radius-none: 0px;
4056
- --wds-info-icon-fill: #525150;
4164
+ --wds-info-icon-fill: #383838;
4057
4165
  --wds-info-icon-fill-hover: #2f5dff;
4058
4166
  --wds-inner-shadow-blur-input: 3px;
4059
4167
  --wds-inner-shadow-blur-primary: 2px;
@@ -4252,7 +4360,7 @@
4252
4360
  --wds-loader-stroke-width-large: 2px;
4253
4361
  --wds-loader-stroke-width-medium: 2px;
4254
4362
  --wds-loader-stroke-width-small: 2px;
4255
- --wds-loader-stroke-width-tiny: 2px;
4363
+ --wds-loader-stroke-width-tiny: 3px;
4256
4364
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
4257
4365
  --wds-marketing-layout-actions-gap-medium: 24px;
4258
4366
  --wds-marketing-layout-actions-gap-small: 24px;
@@ -4424,11 +4532,11 @@
4424
4532
  --wds-page-header-padding-bottom-with-tail: 12px;
4425
4533
  --wds-page-header-padding-horizontal: 48px;
4426
4534
  --wds-page-header-padding-horizontal-small: 24px;
4427
- --wds-page-header-padding-vertical: 24px;
4428
- --wds-page-header-padding-vertical-small: 18px;
4429
- --wds-page-header-subtitle-font-size: 12px;
4430
- --wds-page-header-subtitle-gap: 4px;
4431
- --wds-page-header-subtitle-line-height: 16px;
4535
+ --wds-page-header-padding-vertical: 32px;
4536
+ --wds-page-header-padding-vertical-small: 24px;
4537
+ --wds-page-header-subtitle-font-size: 14px;
4538
+ --wds-page-header-subtitle-gap: 6px;
4539
+ --wds-page-header-subtitle-line-height: 18px;
4432
4540
  --wds-page-header-subtitle-padding-start: 0px;
4433
4541
  --wds-page-header-title-actions-gap: 40px;
4434
4542
  --wds-page-header-title-font-size: 24px;