@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/studio/all.css CHANGED
@@ -464,6 +464,14 @@
464
464
  --wds-input-shadow-focus-warning: transparent;
465
465
  --wds-input-shadow-focus-standard: transparent;
466
466
  --wds-input-shadow-focus-destructive: transparent;
467
+ --wds-icon-button-color-fill-ai-tertiary-active: transparent;
468
+ --wds-icon-button-color-border-ai-secondary-hover: transparent;
469
+ --wds-icon-button-color-border-ai-secondary-active: transparent;
470
+ --wds-icon-button-color-border-ai-secondary: transparent;
471
+ --wds-icon-button-color-border-ai-primary-hover: transparent;
472
+ --wds-icon-button-color-border-ai-primary-active: transparent;
473
+ --wds-icon-button-color-border-ai-primary: transparent;
474
+ --wds-icon-button-border-ai-secondary-ring-display: block;
467
475
  --wds-horizontal-scroll-button-text: #000624;
468
476
  --wds-horizontal-scroll-button-fill-active: #CFD1DC;
469
477
  --wds-horizontal-scroll-button-fill: #FFFFFF;
@@ -530,7 +538,13 @@
530
538
  --wds-button-icon-offset-small: 12px;
531
539
  --wds-button-icon-offset-medium: 18px;
532
540
  --wds-button-icon-offset-large: 18px;
541
+ --wds-button-fill-ai-tertiary: transparent;
542
+ --wds-button-border-ai-tertiary-disabled: transparent;
543
+ --wds-button-border-ai-secondary-ring-display: block;
533
544
  --wds-button-border-ai-secondary-mask: none;
545
+ --wds-button-border-ai-secondary-hover: transparent;
546
+ --wds-button-border-ai-secondary-active: transparent;
547
+ --wds-button-border-ai-secondary: transparent;
534
548
  --wds-breadcrumbs-height-small: 24px;
535
549
  --wds-breadcrumbs-height-medium: 30px;
536
550
  --wds-breadcrumbs-height-large: 36px;
@@ -1618,12 +1632,17 @@
1618
1632
  --wds-icon-button-color-text-light-primary-disabled: var(--wds-color-text-disabled);
1619
1633
  --wds-icon-button-color-text-dark-tertiary-disabled: var(--wds-color-text-disabled);
1620
1634
  --wds-icon-button-color-text-dark-secondary-disabled: var(--wds-color-text-disabled);
1635
+ --wds-icon-button-color-text-ai-tertiary-disabled: var(--wds-color-fill-dark-primary-disabled);
1636
+ --wds-icon-button-color-text-ai-secondary-disabled: var(--wds-color-text-disabled);
1621
1637
  --wds-icon-button-color-fill-standard-primary-hover: var(--wds-color-black-750);
1622
1638
  --wds-icon-button-color-fill-standard-primary-disabled: var(--wds-color-white-transparent-0);
1623
1639
  --wds-icon-button-color-fill-standard-primary-active: var(--wds-color-blue-500);
1624
1640
  --wds-icon-button-color-fill-standard-primary: var(--wds-color-white-transparent-0);
1625
1641
  --wds-icon-button-color-fill-premium-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1626
1642
  --wds-icon-button-color-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
1643
+ --wds-icon-button-color-fill-ai-primary-disabled: var(--wds-color-fill-ai-primary-disabled);
1644
+ --wds-icon-button-color-border-ai-secondary-disabled: var(--wds-color-text-disabled);
1645
+ --wds-icon-button-border-ai-width: var(--wds-border-width-none);
1627
1646
  --wds-google-preview-surface-fill: var(--wds-color-white);
1628
1647
  --wds-form-field-label-gap-tiny: var(--wds-space-150);
1629
1648
  --wds-form-field-label-gap-small: var(--wds-space-200);
@@ -1765,6 +1784,8 @@
1765
1784
  --wds-card-gallery-item-buttons-gap: var(--wds-space-100);
1766
1785
  --wds-card-gallery-item-border-radius-100: var(--wds-border-radius-400);
1767
1786
  --wds-card-gallery-item-border-radius-0: var(--wds-border-radius-0);
1787
+ --wds-card-gallery-item-actions-clearance-top: var(--wds-space-200);
1788
+ --wds-card-gallery-item-actions-clearance-bottom: var(--wds-space-200);
1768
1789
  --wds-card-gallery-item-action-button-size: var(--wds-space-800);
1769
1790
  --wds-card-gallery-item-action-button-padding-vertical: var(--wds-space-150);
1770
1791
  --wds-card-gallery-item-action-button-padding-horizontal: var(--wds-space-400);
@@ -1820,6 +1841,8 @@
1820
1841
  --wds-button-label-fill-standard-secondary-disabled: var(--wds-color-text-disabled);
1821
1842
  --wds-button-label-fill-premium-secondary-disabled: var(--wds-color-text-disabled);
1822
1843
  --wds-button-label-fill-dark-secondary-disabled: var(--wds-color-text-disabled);
1844
+ --wds-button-label-fill-ai-tertiary-disabled: var(--wds-color-text-disabled);
1845
+ --wds-button-label-fill-ai-secondary-disabled: var(--wds-color-text-disabled);
1823
1846
  --wds-button-gap-tiny: var(--wds-space-100);
1824
1847
  --wds-button-gap-small: var(--wds-space-100);
1825
1848
  --wds-button-gap-medium: var(--wds-space-100);
@@ -1832,6 +1855,8 @@
1832
1855
  --wds-button-fill-premium-primary-disabled: var(--wds-color-fill-premium-primary-disabled);
1833
1856
  --wds-button-fill-destructive-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1834
1857
  --wds-button-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
1858
+ --wds-button-fill-ai-tertiary-disabled: var(--wds-color-fill-ai-secondary-disabled);
1859
+ --wds-button-fill-ai-primary-disabled: var(--wds-color-fill-ai-primary-disabled);
1835
1860
  --wds-button-border-radius-tiny: var(--wds-border-radius-200);
1836
1861
  --wds-button-border-radius-small: var(--wds-border-radius-200);
1837
1862
  --wds-button-border-radius-medium: var(--wds-border-radius-200);
@@ -2321,6 +2346,14 @@
2321
2346
  --wds-icon-button-color-text-dark-primary-disabled: var(--wds-color-text-disabled-light);
2322
2347
  --wds-icon-button-color-text-dark-primary-active: var(--wds-color-text-standard-primary-light);
2323
2348
  --wds-icon-button-color-text-dark-primary: var(--wds-color-text-standard-primary-light);
2349
+ --wds-icon-button-color-text-ai-tertiary-hover: var(--wds-color-text-primary);
2350
+ --wds-icon-button-color-text-ai-tertiary-active: var(--wds-color-text-primary);
2351
+ --wds-icon-button-color-text-ai-tertiary: var(--wds-color-text-primary);
2352
+ --wds-icon-button-color-text-ai-secondary-hover: var(--wds-color-text-standard-primary-light);
2353
+ --wds-icon-button-color-text-ai-secondary-active: var(--wds-color-text-standard-primary-light);
2354
+ --wds-icon-button-color-text-ai-secondary: var(--wds-color-text-primary);
2355
+ --wds-icon-button-color-text-ai-primary-disabled: var(--wds-color-text-disabled-light);
2356
+ --wds-icon-button-color-text-ai-primary: var(--wds-color-text-standard-primary-light);
2324
2357
  --wds-icon-button-color-fill-standard-tertiary-hover: var(--wds-color-fill-light-secondary-hover);
2325
2358
  --wds-icon-button-color-fill-standard-tertiary-disabled: var(--wds-color-fill-light-secondary-disabled);
2326
2359
  --wds-icon-button-color-fill-standard-tertiary-active: var(--wds-color-fill-light-secondary-active);
@@ -2363,6 +2396,16 @@
2363
2396
  --wds-icon-button-color-fill-dark-primary-hover: var(--wds-color-fill-dark-primary-hover);
2364
2397
  --wds-icon-button-color-fill-dark-primary-active: var(--wds-color-fill-dark-primary-active);
2365
2398
  --wds-icon-button-color-fill-dark-primary: var(--wds-color-fill-dark-primary);
2399
+ --wds-icon-button-color-fill-ai-tertiary-hover: var(--wds-color-fill-standard-tertiary);
2400
+ --wds-icon-button-color-fill-ai-tertiary-disabled: var(--wds-color-fill-standard-tertiary);
2401
+ --wds-icon-button-color-fill-ai-tertiary: var(--wds-color-fill-standard-tertiary);
2402
+ --wds-icon-button-color-fill-ai-secondary-hover: var(--wds-color-fill-ai-primary-hover);
2403
+ --wds-icon-button-color-fill-ai-secondary-disabled: var(--wds-color-fill-standard-tertiary-disabled);
2404
+ --wds-icon-button-color-fill-ai-secondary-active: var(--wds-color-fill-ai-primary-active);
2405
+ --wds-icon-button-color-fill-ai-secondary: var(--wds-color-fill-ai-primary);
2406
+ --wds-icon-button-color-fill-ai-primary-hover: var(--wds-color-fill-ai-primary-hover);
2407
+ --wds-icon-button-color-fill-ai-primary-active: var(--wds-color-fill-ai-primary-active);
2408
+ --wds-icon-button-color-fill-ai-primary: var(--wds-color-fill-ai-primary);
2366
2409
  --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-border-standard-secondary-hover);
2367
2410
  --wds-icon-button-color-border-standard-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
2368
2411
  --wds-icon-button-color-border-standard-secondary-active: var(--wds-color-border-standard-secondary-active);
@@ -2492,6 +2535,13 @@
2492
2535
  --wds-button-label-fill-dark-secondary-active: var(--wds-color-text-standard-primary-light);
2493
2536
  --wds-button-label-fill-dark-secondary: var(--wds-color-text-standard-primary);
2494
2537
  --wds-button-label-fill-dark-primary-disabled: var(--wds-color-text-disabled-light);
2538
+ --wds-button-label-fill-ai-tertiary-hover: var(--wds-color-text-standard-primary-light);
2539
+ --wds-button-label-fill-ai-tertiary-active: var(--wds-color-text-standard-primary-light);
2540
+ --wds-button-label-fill-ai-tertiary: var(--wds-color-fill-ai-primary);
2541
+ --wds-button-label-fill-ai-secondary-hover: var(--wds-color-text-standard-primary-light);
2542
+ --wds-button-label-fill-ai-secondary-active: var(--wds-color-text-standard-primary-light);
2543
+ --wds-button-label-fill-ai-secondary: var(--wds-color-text-primary);
2544
+ --wds-button-label-fill-ai-primary-disabled: var(--wds-color-text-disabled-light);
2495
2545
  --wds-button-label-fill-ai-primary: var(--wds-color-text-standard-primary-light);
2496
2546
  --wds-button-font-size-tiny: var(--wds-font-size-body-tiny);
2497
2547
  --wds-button-font-size-small: var(--wds-font-size-body-tiny);
@@ -2523,6 +2573,11 @@
2523
2573
  --wds-button-fill-dark-secondary-disabled: var(--wds-color-fill-dark-tertiary-disabled);
2524
2574
  --wds-button-fill-dark-secondary-active: var(--wds-color-fill-dark-primary-active);
2525
2575
  --wds-button-fill-dark-secondary: var(--wds-color-fill-dark-tertiary);
2576
+ --wds-button-fill-ai-tertiary-hover: var(--wds-color-fill-ai-secondary-hover);
2577
+ --wds-button-fill-ai-tertiary-active: var(--wds-color-fill-ai-secondary-active);
2578
+ --wds-button-fill-ai-secondary-hover: var(--wds-color-fill-ai-primary-hover);
2579
+ --wds-button-fill-ai-secondary-disabled: var(--wds-color-fill-standard-tertiary-disabled);
2580
+ --wds-button-fill-ai-secondary-active: var(--wds-color-fill-ai-primary-active);
2526
2581
  --wds-button-fill-ai-secondary: var(--wds-color-fill-standard-tertiary);
2527
2582
  --wds-button-fill-ai-primary-hover: var(--wds-color-fill-ai-primary-hover);
2528
2583
  --wds-button-fill-ai-primary-active: var(--wds-color-fill-ai-primary-active);
@@ -2543,6 +2598,7 @@
2543
2598
  --wds-button-border-dark-secondary-disabled: var(--wds-color-border-premium-secondary-disabled);
2544
2599
  --wds-button-border-dark-secondary-active: var(--wds-color-border-dark-secondary);
2545
2600
  --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
2601
+ --wds-button-border-ai-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
2546
2602
  --wds-breadcrumbs-on-grey-text-fill-active: var(--wds-color-text-standard-primary);
2547
2603
  --wds-badge-transparent-warning-label-color: var(--wds-color-text-warning);
2548
2604
  --wds-badge-transparent-urgent-label-color: var(--wds-color-text-urgent);
package/studio/all.scss CHANGED
@@ -219,6 +219,14 @@
219
219
  --wds-illustration-color-3: #B8C4FF;
220
220
  --wds-illustration-color-2: #7896FF;
221
221
  --wds-illustration-color-1: #002291;
222
+ --wds-icon-button-color-fill-ai-tertiary-active: transparent;
223
+ --wds-icon-button-color-border-ai-secondary-hover: transparent;
224
+ --wds-icon-button-color-border-ai-secondary-active: transparent;
225
+ --wds-icon-button-color-border-ai-secondary: transparent;
226
+ --wds-icon-button-color-border-ai-primary-hover: transparent;
227
+ --wds-icon-button-color-border-ai-primary-active: transparent;
228
+ --wds-icon-button-color-border-ai-primary: transparent;
229
+ --wds-icon-button-border-ai-secondary-ring-display: block;
222
230
  --wds-horizontal-scroll-button-text: #000624;
223
231
  --wds-horizontal-scroll-button-fill-active: #CFD1DC;
224
232
  --wds-horizontal-scroll-button-fill: #FFFFFF;
@@ -503,7 +511,13 @@
503
511
  --wds-button-icon-offset-small: 12px;
504
512
  --wds-button-icon-offset-medium: 18px;
505
513
  --wds-button-icon-offset-large: 18px;
514
+ --wds-button-fill-ai-tertiary: transparent;
515
+ --wds-button-border-ai-tertiary-disabled: transparent;
516
+ --wds-button-border-ai-secondary-ring-display: block;
506
517
  --wds-button-border-ai-secondary-mask: none;
518
+ --wds-button-border-ai-secondary-hover: transparent;
519
+ --wds-button-border-ai-secondary-active: transparent;
520
+ --wds-button-border-ai-secondary: transparent;
507
521
  --wds-breakpoint-x-large: 1572px;
508
522
  --wds-breakpoint-small: 490px;
509
523
  --wds-breakpoint-medium: 768px;
@@ -1308,12 +1322,17 @@
1308
1322
  --wds-icon-button-color-text-light-primary-disabled: var(--wds-color-text-disabled);
1309
1323
  --wds-icon-button-color-text-dark-tertiary-disabled: var(--wds-color-text-disabled);
1310
1324
  --wds-icon-button-color-text-dark-secondary-disabled: var(--wds-color-text-disabled);
1325
+ --wds-icon-button-color-text-ai-tertiary-disabled: var(--wds-color-fill-dark-primary-disabled);
1326
+ --wds-icon-button-color-text-ai-secondary-disabled: var(--wds-color-text-disabled);
1311
1327
  --wds-icon-button-color-fill-standard-primary-hover: var(--wds-color-black-750);
1312
1328
  --wds-icon-button-color-fill-standard-primary-disabled: var(--wds-color-white-transparent-0);
1313
1329
  --wds-icon-button-color-fill-standard-primary-active: var(--wds-color-blue-500);
1314
1330
  --wds-icon-button-color-fill-standard-primary: var(--wds-color-white-transparent-0);
1315
1331
  --wds-icon-button-color-fill-premium-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1316
1332
  --wds-icon-button-color-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
1333
+ --wds-icon-button-color-fill-ai-primary-disabled: var(--wds-color-fill-ai-primary-disabled);
1334
+ --wds-icon-button-color-border-ai-secondary-disabled: var(--wds-color-text-disabled);
1335
+ --wds-icon-button-border-ai-width: var(--wds-border-width-none);
1317
1336
  --wds-google-preview-surface-fill: var(--wds-color-white);
1318
1337
  --wds-form-field-label-gap-tiny: var(--wds-space-150);
1319
1338
  --wds-form-field-label-gap-small: var(--wds-space-200);
@@ -1762,6 +1781,8 @@
1762
1781
  --wds-card-gallery-item-buttons-gap: var(--wds-space-100);
1763
1782
  --wds-card-gallery-item-border-radius-100: var(--wds-border-radius-400);
1764
1783
  --wds-card-gallery-item-border-radius-0: var(--wds-border-radius-0);
1784
+ --wds-card-gallery-item-actions-clearance-top: var(--wds-space-200);
1785
+ --wds-card-gallery-item-actions-clearance-bottom: var(--wds-space-200);
1765
1786
  --wds-card-gallery-item-action-button-size: var(--wds-space-800);
1766
1787
  --wds-card-gallery-item-action-button-padding-vertical: var(--wds-space-150);
1767
1788
  --wds-card-gallery-item-action-button-padding-horizontal: var(--wds-space-400);
@@ -1808,6 +1829,8 @@
1808
1829
  --wds-button-label-fill-standard-secondary-disabled: var(--wds-color-text-disabled);
1809
1830
  --wds-button-label-fill-premium-secondary-disabled: var(--wds-color-text-disabled);
1810
1831
  --wds-button-label-fill-dark-secondary-disabled: var(--wds-color-text-disabled);
1832
+ --wds-button-label-fill-ai-tertiary-disabled: var(--wds-color-text-disabled);
1833
+ --wds-button-label-fill-ai-secondary-disabled: var(--wds-color-text-disabled);
1811
1834
  --wds-button-gap-tiny: var(--wds-space-100);
1812
1835
  --wds-button-gap-small: var(--wds-space-100);
1813
1836
  --wds-button-gap-medium: var(--wds-space-100);
@@ -1820,6 +1843,8 @@
1820
1843
  --wds-button-fill-premium-primary-disabled: var(--wds-color-fill-premium-primary-disabled);
1821
1844
  --wds-button-fill-destructive-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
1822
1845
  --wds-button-fill-dark-primary-disabled: var(--wds-color-fill-dark-primary-disabled);
1846
+ --wds-button-fill-ai-tertiary-disabled: var(--wds-color-fill-ai-secondary-disabled);
1847
+ --wds-button-fill-ai-primary-disabled: var(--wds-color-fill-ai-primary-disabled);
1823
1848
  --wds-button-border-radius-tiny: var(--wds-border-radius-200);
1824
1849
  --wds-button-border-radius-small: var(--wds-border-radius-200);
1825
1850
  --wds-button-border-radius-medium: var(--wds-border-radius-200);
@@ -2310,6 +2335,14 @@
2310
2335
  --wds-icon-button-color-text-dark-primary-disabled: var(--wds-color-text-disabled-light);
2311
2336
  --wds-icon-button-color-text-dark-primary-active: var(--wds-color-text-standard-primary-light);
2312
2337
  --wds-icon-button-color-text-dark-primary: var(--wds-color-text-standard-primary-light);
2338
+ --wds-icon-button-color-text-ai-tertiary-hover: var(--wds-color-text-primary);
2339
+ --wds-icon-button-color-text-ai-tertiary-active: var(--wds-color-text-primary);
2340
+ --wds-icon-button-color-text-ai-tertiary: var(--wds-color-text-primary);
2341
+ --wds-icon-button-color-text-ai-secondary-hover: var(--wds-color-text-standard-primary-light);
2342
+ --wds-icon-button-color-text-ai-secondary-active: var(--wds-color-text-standard-primary-light);
2343
+ --wds-icon-button-color-text-ai-secondary: var(--wds-color-text-primary);
2344
+ --wds-icon-button-color-text-ai-primary-disabled: var(--wds-color-text-disabled-light);
2345
+ --wds-icon-button-color-text-ai-primary: var(--wds-color-text-standard-primary-light);
2313
2346
  --wds-icon-button-color-fill-standard-tertiary-hover: var(--wds-color-fill-light-secondary-hover);
2314
2347
  --wds-icon-button-color-fill-standard-tertiary-disabled: var(--wds-color-fill-light-secondary-disabled);
2315
2348
  --wds-icon-button-color-fill-standard-tertiary-active: var(--wds-color-fill-light-secondary-active);
@@ -2352,6 +2385,16 @@
2352
2385
  --wds-icon-button-color-fill-dark-primary-hover: var(--wds-color-fill-dark-primary-hover);
2353
2386
  --wds-icon-button-color-fill-dark-primary-active: var(--wds-color-fill-dark-primary-active);
2354
2387
  --wds-icon-button-color-fill-dark-primary: var(--wds-color-fill-dark-primary);
2388
+ --wds-icon-button-color-fill-ai-tertiary-hover: var(--wds-color-fill-standard-tertiary);
2389
+ --wds-icon-button-color-fill-ai-tertiary-disabled: var(--wds-color-fill-standard-tertiary);
2390
+ --wds-icon-button-color-fill-ai-tertiary: var(--wds-color-fill-standard-tertiary);
2391
+ --wds-icon-button-color-fill-ai-secondary-hover: var(--wds-color-fill-ai-primary-hover);
2392
+ --wds-icon-button-color-fill-ai-secondary-disabled: var(--wds-color-fill-standard-tertiary-disabled);
2393
+ --wds-icon-button-color-fill-ai-secondary-active: var(--wds-color-fill-ai-primary-active);
2394
+ --wds-icon-button-color-fill-ai-secondary: var(--wds-color-fill-ai-primary);
2395
+ --wds-icon-button-color-fill-ai-primary-hover: var(--wds-color-fill-ai-primary-hover);
2396
+ --wds-icon-button-color-fill-ai-primary-active: var(--wds-color-fill-ai-primary-active);
2397
+ --wds-icon-button-color-fill-ai-primary: var(--wds-color-fill-ai-primary);
2355
2398
  --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-border-standard-secondary-hover);
2356
2399
  --wds-icon-button-color-border-standard-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
2357
2400
  --wds-icon-button-color-border-standard-secondary-active: var(--wds-color-border-standard-secondary-active);
@@ -2492,6 +2535,13 @@
2492
2535
  --wds-button-label-fill-dark-secondary-active: var(--wds-color-text-standard-primary-light);
2493
2536
  --wds-button-label-fill-dark-secondary: var(--wds-color-text-standard-primary);
2494
2537
  --wds-button-label-fill-dark-primary-disabled: var(--wds-color-text-disabled-light);
2538
+ --wds-button-label-fill-ai-tertiary-hover: var(--wds-color-text-standard-primary-light);
2539
+ --wds-button-label-fill-ai-tertiary-active: var(--wds-color-text-standard-primary-light);
2540
+ --wds-button-label-fill-ai-tertiary: var(--wds-color-fill-ai-primary);
2541
+ --wds-button-label-fill-ai-secondary-hover: var(--wds-color-text-standard-primary-light);
2542
+ --wds-button-label-fill-ai-secondary-active: var(--wds-color-text-standard-primary-light);
2543
+ --wds-button-label-fill-ai-secondary: var(--wds-color-text-primary);
2544
+ --wds-button-label-fill-ai-primary-disabled: var(--wds-color-text-disabled-light);
2495
2545
  --wds-button-label-fill-ai-primary: var(--wds-color-text-standard-primary-light);
2496
2546
  --wds-button-font-size-tiny: var(--wds-font-size-body-tiny);
2497
2547
  --wds-button-font-size-small: var(--wds-font-size-body-tiny);
@@ -2523,6 +2573,11 @@
2523
2573
  --wds-button-fill-dark-secondary-disabled: var(--wds-color-fill-dark-tertiary-disabled);
2524
2574
  --wds-button-fill-dark-secondary-active: var(--wds-color-fill-dark-primary-active);
2525
2575
  --wds-button-fill-dark-secondary: var(--wds-color-fill-dark-tertiary);
2576
+ --wds-button-fill-ai-tertiary-hover: var(--wds-color-fill-ai-secondary-hover);
2577
+ --wds-button-fill-ai-tertiary-active: var(--wds-color-fill-ai-secondary-active);
2578
+ --wds-button-fill-ai-secondary-hover: var(--wds-color-fill-ai-primary-hover);
2579
+ --wds-button-fill-ai-secondary-disabled: var(--wds-color-fill-standard-tertiary-disabled);
2580
+ --wds-button-fill-ai-secondary-active: var(--wds-color-fill-ai-primary-active);
2526
2581
  --wds-button-fill-ai-secondary: var(--wds-color-fill-standard-tertiary);
2527
2582
  --wds-button-fill-ai-primary-hover: var(--wds-color-fill-ai-primary-hover);
2528
2583
  --wds-button-fill-ai-primary-active: var(--wds-color-fill-ai-primary-active);
@@ -2543,6 +2598,7 @@
2543
2598
  --wds-button-border-dark-secondary-disabled: var(--wds-color-border-premium-secondary-disabled);
2544
2599
  --wds-button-border-dark-secondary-active: var(--wds-color-border-dark-secondary);
2545
2600
  --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
2601
+ --wds-button-border-ai-secondary-disabled: var(--wds-color-border-standard-secondary-disabled);
2546
2602
  --wds-breadcrumbs-on-grey-text-fill-active: var(--wds-color-text-standard-primary);
2547
2603
  --wds-badge-transparent-warning-label-color: var(--wds-color-text-warning);
2548
2604
  --wds-badge-transparent-urgent-label-color: var(--wds-color-text-urgent);
package/studio/all.st.css CHANGED
@@ -222,7 +222,13 @@
222
222
  @property st-global(--wds-breakpoint-medium);
223
223
  @property st-global(--wds-breakpoint-small);
224
224
  @property st-global(--wds-breakpoint-x-large);
225
+ @property st-global(--wds-button-border-ai-secondary);
226
+ @property st-global(--wds-button-border-ai-secondary-active);
227
+ @property st-global(--wds-button-border-ai-secondary-disabled);
228
+ @property st-global(--wds-button-border-ai-secondary-hover);
225
229
  @property st-global(--wds-button-border-ai-secondary-mask);
230
+ @property st-global(--wds-button-border-ai-secondary-ring-display);
231
+ @property st-global(--wds-button-border-ai-tertiary-disabled);
226
232
  @property st-global(--wds-button-border-dark-secondary);
227
233
  @property st-global(--wds-button-border-dark-secondary-active);
228
234
  @property st-global(--wds-button-border-dark-secondary-disabled);
@@ -245,8 +251,16 @@
245
251
  @property st-global(--wds-button-border-standard-secondary-hover);
246
252
  @property st-global(--wds-button-fill-ai-primary);
247
253
  @property st-global(--wds-button-fill-ai-primary-active);
254
+ @property st-global(--wds-button-fill-ai-primary-disabled);
248
255
  @property st-global(--wds-button-fill-ai-primary-hover);
249
256
  @property st-global(--wds-button-fill-ai-secondary);
257
+ @property st-global(--wds-button-fill-ai-secondary-active);
258
+ @property st-global(--wds-button-fill-ai-secondary-disabled);
259
+ @property st-global(--wds-button-fill-ai-secondary-hover);
260
+ @property st-global(--wds-button-fill-ai-tertiary);
261
+ @property st-global(--wds-button-fill-ai-tertiary-active);
262
+ @property st-global(--wds-button-fill-ai-tertiary-disabled);
263
+ @property st-global(--wds-button-fill-ai-tertiary-hover);
250
264
  @property st-global(--wds-button-fill-dark-primary-disabled);
251
265
  @property st-global(--wds-button-fill-dark-secondary);
252
266
  @property st-global(--wds-button-fill-dark-secondary-active);
@@ -297,6 +311,15 @@
297
311
  @property st-global(--wds-button-icon-offset-small);
298
312
  @property st-global(--wds-button-icon-offset-tiny);
299
313
  @property st-global(--wds-button-label-fill-ai-primary);
314
+ @property st-global(--wds-button-label-fill-ai-primary-disabled);
315
+ @property st-global(--wds-button-label-fill-ai-secondary);
316
+ @property st-global(--wds-button-label-fill-ai-secondary-active);
317
+ @property st-global(--wds-button-label-fill-ai-secondary-disabled);
318
+ @property st-global(--wds-button-label-fill-ai-secondary-hover);
319
+ @property st-global(--wds-button-label-fill-ai-tertiary);
320
+ @property st-global(--wds-button-label-fill-ai-tertiary-active);
321
+ @property st-global(--wds-button-label-fill-ai-tertiary-disabled);
322
+ @property st-global(--wds-button-label-fill-ai-tertiary-hover);
300
323
  @property st-global(--wds-button-label-fill-dark-primary-disabled);
301
324
  @property st-global(--wds-button-label-fill-dark-secondary);
302
325
  @property st-global(--wds-button-label-fill-dark-secondary-active);
@@ -381,6 +404,8 @@
381
404
  @property st-global(--wds-card-gallery-item-action-button-padding-vertical);
382
405
  @property st-global(--wds-card-gallery-item-action-button-size);
383
406
  @property st-global(--wds-card-gallery-item-actions-align);
407
+ @property st-global(--wds-card-gallery-item-actions-clearance-bottom);
408
+ @property st-global(--wds-card-gallery-item-actions-clearance-top);
384
409
  @property st-global(--wds-card-gallery-item-actions-direction);
385
410
  @property st-global(--wds-card-gallery-item-actions-secondary-position);
386
411
  @property st-global(--wds-card-gallery-item-badge-offset-block);
@@ -1216,6 +1241,15 @@
1216
1241
  @property st-global(--wds-horizontal-scroll-button-fill);
1217
1242
  @property st-global(--wds-horizontal-scroll-button-fill-active);
1218
1243
  @property st-global(--wds-horizontal-scroll-button-text);
1244
+ @property st-global(--wds-icon-button-border-ai-secondary-ring-display);
1245
+ @property st-global(--wds-icon-button-border-ai-width);
1246
+ @property st-global(--wds-icon-button-color-border-ai-primary);
1247
+ @property st-global(--wds-icon-button-color-border-ai-primary-active);
1248
+ @property st-global(--wds-icon-button-color-border-ai-primary-hover);
1249
+ @property st-global(--wds-icon-button-color-border-ai-secondary);
1250
+ @property st-global(--wds-icon-button-color-border-ai-secondary-active);
1251
+ @property st-global(--wds-icon-button-color-border-ai-secondary-disabled);
1252
+ @property st-global(--wds-icon-button-color-border-ai-secondary-hover);
1219
1253
  @property st-global(--wds-icon-button-color-border-dark-secondary);
1220
1254
  @property st-global(--wds-icon-button-color-border-dark-secondary-active);
1221
1255
  @property st-global(--wds-icon-button-color-border-dark-secondary-disabled);
@@ -1231,6 +1265,18 @@
1231
1265
  @property st-global(--wds-icon-button-color-border-standard-secondary-active);
1232
1266
  @property st-global(--wds-icon-button-color-border-standard-secondary-disabled);
1233
1267
  @property st-global(--wds-icon-button-color-border-standard-secondary-hover);
1268
+ @property st-global(--wds-icon-button-color-fill-ai-primary);
1269
+ @property st-global(--wds-icon-button-color-fill-ai-primary-active);
1270
+ @property st-global(--wds-icon-button-color-fill-ai-primary-disabled);
1271
+ @property st-global(--wds-icon-button-color-fill-ai-primary-hover);
1272
+ @property st-global(--wds-icon-button-color-fill-ai-secondary);
1273
+ @property st-global(--wds-icon-button-color-fill-ai-secondary-active);
1274
+ @property st-global(--wds-icon-button-color-fill-ai-secondary-disabled);
1275
+ @property st-global(--wds-icon-button-color-fill-ai-secondary-hover);
1276
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary);
1277
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary-active);
1278
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary-disabled);
1279
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary-hover);
1234
1280
  @property st-global(--wds-icon-button-color-fill-dark-primary);
1235
1281
  @property st-global(--wds-icon-button-color-fill-dark-primary-active);
1236
1282
  @property st-global(--wds-icon-button-color-fill-dark-primary-disabled);
@@ -1279,6 +1325,16 @@
1279
1325
  @property st-global(--wds-icon-button-color-fill-standard-tertiary-active);
1280
1326
  @property st-global(--wds-icon-button-color-fill-standard-tertiary-disabled);
1281
1327
  @property st-global(--wds-icon-button-color-fill-standard-tertiary-hover);
1328
+ @property st-global(--wds-icon-button-color-text-ai-primary);
1329
+ @property st-global(--wds-icon-button-color-text-ai-primary-disabled);
1330
+ @property st-global(--wds-icon-button-color-text-ai-secondary);
1331
+ @property st-global(--wds-icon-button-color-text-ai-secondary-active);
1332
+ @property st-global(--wds-icon-button-color-text-ai-secondary-disabled);
1333
+ @property st-global(--wds-icon-button-color-text-ai-secondary-hover);
1334
+ @property st-global(--wds-icon-button-color-text-ai-tertiary);
1335
+ @property st-global(--wds-icon-button-color-text-ai-tertiary-active);
1336
+ @property st-global(--wds-icon-button-color-text-ai-tertiary-disabled);
1337
+ @property st-global(--wds-icon-button-color-text-ai-tertiary-hover);
1282
1338
  @property st-global(--wds-icon-button-color-text-dark-primary);
1283
1339
  @property st-global(--wds-icon-button-color-text-dark-primary-active);
1284
1340
  @property st-global(--wds-icon-button-color-text-dark-primary-disabled);
@@ -2932,7 +2988,13 @@
2932
2988
  --wds-breakpoint-medium: 768px;
2933
2989
  --wds-breakpoint-small: 490px;
2934
2990
  --wds-breakpoint-x-large: 1572px;
2991
+ --wds-button-border-ai-secondary: transparent;
2992
+ --wds-button-border-ai-secondary-active: transparent;
2993
+ --wds-button-border-ai-secondary-disabled: rgba(19, 23, 32, .1);
2994
+ --wds-button-border-ai-secondary-hover: transparent;
2935
2995
  --wds-button-border-ai-secondary-mask: none;
2996
+ --wds-button-border-ai-secondary-ring-display: block;
2997
+ --wds-button-border-ai-tertiary-disabled: transparent;
2936
2998
  --wds-button-border-dark-secondary: #868aa5;
2937
2999
  --wds-button-border-dark-secondary-active: #e2e3ea;
2938
3000
  --wds-button-border-dark-secondary-disabled: rgba(19, 23, 32, .1);
@@ -2955,8 +3017,16 @@
2955
3017
  --wds-button-border-standard-secondary-hover: #e2e3ea;
2956
3018
  --wds-button-fill-ai-primary: #5a48f5;
2957
3019
  --wds-button-fill-ai-primary-active: #5a48f5;
3020
+ --wds-button-fill-ai-primary-disabled: #bebebe;
2958
3021
  --wds-button-fill-ai-primary-hover: #4d3dd0;
2959
3022
  --wds-button-fill-ai-secondary: #ffffff;
3023
+ --wds-button-fill-ai-secondary-active: #5a48f5;
3024
+ --wds-button-fill-ai-secondary-disabled: #ffffff;
3025
+ --wds-button-fill-ai-secondary-hover: #4d3dd0;
3026
+ --wds-button-fill-ai-tertiary: transparent;
3027
+ --wds-button-fill-ai-tertiary-active: #d6d1fc;
3028
+ --wds-button-fill-ai-tertiary-disabled: #e5e5e5;
3029
+ --wds-button-fill-ai-tertiary-hover: #a59bfa;
2960
3030
  --wds-button-fill-dark-primary-disabled: #bebebe;
2961
3031
  --wds-button-fill-dark-secondary: #ffffff;
2962
3032
  --wds-button-fill-dark-secondary-active: #42454c;
@@ -3007,6 +3077,15 @@
3007
3077
  --wds-button-icon-offset-small: 12px;
3008
3078
  --wds-button-icon-offset-tiny: 12px;
3009
3079
  --wds-button-label-fill-ai-primary: #ffffff;
3080
+ --wds-button-label-fill-ai-primary-disabled: rgba(255, 255, 255, .7);
3081
+ --wds-button-label-fill-ai-secondary: #116dff;
3082
+ --wds-button-label-fill-ai-secondary-active: #ffffff;
3083
+ --wds-button-label-fill-ai-secondary-disabled: #bebebe;
3084
+ --wds-button-label-fill-ai-secondary-hover: #ffffff;
3085
+ --wds-button-label-fill-ai-tertiary: #5a48f5;
3086
+ --wds-button-label-fill-ai-tertiary-active: #ffffff;
3087
+ --wds-button-label-fill-ai-tertiary-disabled: #bebebe;
3088
+ --wds-button-label-fill-ai-tertiary-hover: #ffffff;
3010
3089
  --wds-button-label-fill-dark-primary-disabled: rgba(255, 255, 255, .7);
3011
3090
  --wds-button-label-fill-dark-secondary: #131720;
3012
3091
  --wds-button-label-fill-dark-secondary-active: #ffffff;
@@ -3091,6 +3170,8 @@
3091
3170
  --wds-card-gallery-item-action-button-padding-vertical: 6px;
3092
3171
  --wds-card-gallery-item-action-button-size: 32px;
3093
3172
  --wds-card-gallery-item-actions-align: stretch;
3173
+ --wds-card-gallery-item-actions-clearance-bottom: 8px;
3174
+ --wds-card-gallery-item-actions-clearance-top: 8px;
3094
3175
  --wds-card-gallery-item-actions-direction: row;
3095
3176
  --wds-card-gallery-item-actions-secondary-position: absolute;
3096
3177
  --wds-card-gallery-item-badge-offset-block: 12px;
@@ -3926,6 +4007,15 @@
3926
4007
  --wds-horizontal-scroll-button-fill: #FFFFFF;
3927
4008
  --wds-horizontal-scroll-button-fill-active: #CFD1DC;
3928
4009
  --wds-horizontal-scroll-button-text: #000624;
4010
+ --wds-icon-button-border-ai-secondary-ring-display: block;
4011
+ --wds-icon-button-border-ai-width: 0px;
4012
+ --wds-icon-button-color-border-ai-primary: transparent;
4013
+ --wds-icon-button-color-border-ai-primary-active: transparent;
4014
+ --wds-icon-button-color-border-ai-primary-hover: transparent;
4015
+ --wds-icon-button-color-border-ai-secondary: transparent;
4016
+ --wds-icon-button-color-border-ai-secondary-active: transparent;
4017
+ --wds-icon-button-color-border-ai-secondary-disabled: #bebebe;
4018
+ --wds-icon-button-color-border-ai-secondary-hover: transparent;
3929
4019
  --wds-icon-button-color-border-dark-secondary: #868aa5;
3930
4020
  --wds-icon-button-color-border-dark-secondary-active: #2b2e36;
3931
4021
  --wds-icon-button-color-border-dark-secondary-disabled: rgba(19, 23, 32, .1);
@@ -3941,6 +4031,18 @@
3941
4031
  --wds-icon-button-color-border-standard-secondary-active: #116dff;
3942
4032
  --wds-icon-button-color-border-standard-secondary-disabled: rgba(19, 23, 32, .1);
3943
4033
  --wds-icon-button-color-border-standard-secondary-hover: #868aa5;
4034
+ --wds-icon-button-color-fill-ai-primary: #5a48f5;
4035
+ --wds-icon-button-color-fill-ai-primary-active: #5a48f5;
4036
+ --wds-icon-button-color-fill-ai-primary-disabled: #bebebe;
4037
+ --wds-icon-button-color-fill-ai-primary-hover: #4d3dd0;
4038
+ --wds-icon-button-color-fill-ai-secondary: #5a48f5;
4039
+ --wds-icon-button-color-fill-ai-secondary-active: #5a48f5;
4040
+ --wds-icon-button-color-fill-ai-secondary-disabled: #ffffff;
4041
+ --wds-icon-button-color-fill-ai-secondary-hover: #4d3dd0;
4042
+ --wds-icon-button-color-fill-ai-tertiary: #ffffff;
4043
+ --wds-icon-button-color-fill-ai-tertiary-active: transparent;
4044
+ --wds-icon-button-color-fill-ai-tertiary-disabled: #ffffff;
4045
+ --wds-icon-button-color-fill-ai-tertiary-hover: #ffffff;
3944
4046
  --wds-icon-button-color-fill-dark-primary: #131720;
3945
4047
  --wds-icon-button-color-fill-dark-primary-active: #42454c;
3946
4048
  --wds-icon-button-color-fill-dark-primary-disabled: #bebebe;
@@ -3989,6 +4091,16 @@
3989
4091
  --wds-icon-button-color-fill-standard-tertiary-active: #dce9ff;
3990
4092
  --wds-icon-button-color-fill-standard-tertiary-disabled: rgba(255, 255, 255, 0);
3991
4093
  --wds-icon-button-color-fill-standard-tertiary-hover: #ebf2ff;
4094
+ --wds-icon-button-color-text-ai-primary: #ffffff;
4095
+ --wds-icon-button-color-text-ai-primary-disabled: rgba(255, 255, 255, .7);
4096
+ --wds-icon-button-color-text-ai-secondary: #116dff;
4097
+ --wds-icon-button-color-text-ai-secondary-active: #ffffff;
4098
+ --wds-icon-button-color-text-ai-secondary-disabled: #bebebe;
4099
+ --wds-icon-button-color-text-ai-secondary-hover: #ffffff;
4100
+ --wds-icon-button-color-text-ai-tertiary: #116dff;
4101
+ --wds-icon-button-color-text-ai-tertiary-active: #116dff;
4102
+ --wds-icon-button-color-text-ai-tertiary-disabled: #bebebe;
4103
+ --wds-icon-button-color-text-ai-tertiary-hover: #116dff;
3992
4104
  --wds-icon-button-color-text-dark-primary: #ffffff;
3993
4105
  --wds-icon-button-color-text-dark-primary-active: #ffffff;
3994
4106
  --wds-icon-button-color-text-dark-primary-disabled: rgba(255, 255, 255, .7);