@wix/design-system-tokens 1.220.2 → 1.221.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (22) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/all.css +1 -0
  3. package/all.scss +1 -0
  4. package/all.st.css +4 -0
  5. package/foundation.st.css +2 -0
  6. package/odeditor/all.css +1 -0
  7. package/odeditor/all.scss +1 -0
  8. package/odeditor/all.st.css +4 -0
  9. package/odeditor/foundation.st.css +2 -0
  10. package/odeditor-dark/all.css +1 -0
  11. package/odeditor-dark/all.scss +1 -0
  12. package/odeditor-dark/all.st.css +4 -0
  13. package/odeditor-dark/foundation.st.css +2 -0
  14. package/package.json +2 -2
  15. package/studio/all.css +1 -0
  16. package/studio/all.scss +1 -0
  17. package/studio/all.st.css +4 -0
  18. package/studio/foundation.st.css +2 -0
  19. package/wixel/all.css +1 -0
  20. package/wixel/all.scss +1 -0
  21. package/wixel/all.st.css +4 -0
  22. package/wixel/foundation.st.css +2 -0
package/CHANGELOG.md CHANGED
@@ -1,3 +1,11 @@
1
+ ## 1.221.1
2
+
3
+ ## 1.221.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#16749](https://github.com/wix-private/wix-design-systems/pull/16749) [`6c581a4`](https://github.com/wix-private/wix-design-systems/commit/6c581a4dbdcfa28f8f84bbb5570a754a894ebbda) - Add `--wds-internal-animations-enabled`, an internal flag declaring whether the loaded theme uses expressive motion (`true` in Harmony (odeditor), `false` elsewhere). Not part of the public theming contract.
8
+
1
9
  ## 1.220.2
2
10
 
3
11
  ### Patch Changes
package/all.css CHANGED
@@ -358,6 +358,7 @@
358
358
  --wds-loader-stroke-width-large: 4px;
359
359
  --wds-list-item-select-min-height-medium: auto;
360
360
  --wds-list-item-action-subtitle-offset: 0px;
361
+ --wds-internal-animations-enabled: false;
361
362
  --wds-internal-thumbnail-illustration-size-tiny: 38px;
362
363
  --wds-internal-thumbnail-illustration-size-small: 51px;
363
364
  --wds-internal-thumbnail-illustration-size-medium: 72px;
package/all.scss CHANGED
@@ -153,6 +153,7 @@
153
153
  --wds-internal-image-height-medium: 84px;
154
154
  --wds-internal-image-height-large: 120px;
155
155
  --wds-internal-color-picker-width: 240px;
156
+ --wds-internal-animations-enabled: false;
156
157
  --wds-input-width-tiny: 48px;
157
158
  --wds-input-width-small: 54px;
158
159
  --wds-input-width-medium: 72px;
package/all.st.css CHANGED
@@ -1244,6 +1244,7 @@
1244
1244
  @property st-global(--wds-input-width-medium);
1245
1245
  @property st-global(--wds-input-width-small);
1246
1246
  @property st-global(--wds-input-width-tiny);
1247
+ @property st-global(--wds-internal-animations-enabled);
1247
1248
  @property st-global(--wds-internal-color-picker-padding-horizontal);
1248
1249
  @property st-global(--wds-internal-color-picker-padding-vertical);
1249
1250
  @property st-global(--wds-internal-color-picker-width);
@@ -2080,6 +2081,7 @@
2080
2081
  @property st-global(--wds-tabs-item-gap-small-medium);
2081
2082
  @property st-global(--wds-tabs-label-fill);
2082
2083
  @property st-global(--wds-tabs-label-fill-active);
2084
+ @property st-global(--wds-tabs-label-fill-disabled);
2083
2085
  @property st-global(--wds-tabs-label-font-size-medium);
2084
2086
  @property st-global(--wds-tabs-label-font-size-small);
2085
2087
  @property st-global(--wds-tabs-label-font-size-small-medium);
@@ -3640,6 +3642,7 @@
3640
3642
  --wds-input-width-medium: 72px;
3641
3643
  --wds-input-width-small: 54px;
3642
3644
  --wds-input-width-tiny: 48px;
3645
+ --wds-internal-animations-enabled: false;
3643
3646
  --wds-internal-color-picker-padding-horizontal: 18px;
3644
3647
  --wds-internal-color-picker-padding-vertical: 12px;
3645
3648
  --wds-internal-color-picker-width: 240px;
@@ -4476,6 +4479,7 @@
4476
4479
  --wds-tabs-item-gap-small-medium: 6px;
4477
4480
  --wds-tabs-label-fill: #000624;
4478
4481
  --wds-tabs-label-fill-active: #116dff;
4482
+ --wds-tabs-label-fill-disabled: rgba(0, 6, 36, .3);
4479
4483
  --wds-tabs-label-font-size-medium: 16px;
4480
4484
  --wds-tabs-label-font-size-small: 14px;
4481
4485
  --wds-tabs-label-font-size-small-medium: 14px;
package/foundation.st.css CHANGED
@@ -160,6 +160,7 @@
160
160
  @property st-global(--wds-font-weight-medium);
161
161
  @property st-global(--wds-font-weight-regular);
162
162
  @property st-global(--wds-font-weight-semi-bold);
163
+ @property st-global(--wds-internal-animations-enabled);
163
164
  @property st-global(--wds-shadow-100);
164
165
  @property st-global(--wds-shadow-200);
165
166
  @property st-global(--wds-shadow-300);
@@ -400,6 +401,7 @@
400
401
  --wds-font-weight-medium: 500;
401
402
  --wds-font-weight-regular: 400;
402
403
  --wds-font-weight-semi-bold: 600;
404
+ --wds-internal-animations-enabled: false;
403
405
  --wds-shadow-100: 0 0 3px rgba(0, 6, 36, .1), 0 2px 1px rgba(0, 6, 36, .5);
404
406
  --wds-shadow-200: 0 0 6px rgba(0, 6, 36, .1), 0 2px 4px rgba(0, 6, 36, .1);
405
407
  --wds-shadow-300: 0 0 18px rgba(0, 6, 36, .1), 0 6px 6px rgba(0, 6, 36, .05);
package/odeditor/all.css CHANGED
@@ -396,6 +396,7 @@
396
396
  --wds-loader-stroke-width-large: 2px;
397
397
  --wds-list-item-select-min-height-medium: auto;
398
398
  --wds-list-item-action-subtitle-offset: -2px;
399
+ --wds-internal-animations-enabled: true;
399
400
  --wds-internal-thumbnail-illustration-size-tiny: 38px;
400
401
  --wds-internal-thumbnail-illustration-size-small: 51px;
401
402
  --wds-internal-thumbnail-illustration-size-medium: 72px;
package/odeditor/all.scss CHANGED
@@ -167,6 +167,7 @@
167
167
  --wds-internal-image-height-small: 60px;
168
168
  --wds-internal-image-height-medium: 84px;
169
169
  --wds-internal-image-height-large: 120px;
170
+ --wds-internal-animations-enabled: true;
170
171
  --wds-input-shadow-focus-warning: transparent;
171
172
  --wds-input-shadow-focus-standard: transparent;
172
173
  --wds-input-shadow-focus-destructive: transparent;
package/odeditor/all.st.css CHANGED
@@ -1225,6 +1225,7 @@
1225
1225
  @property st-global(--wds-input-value-font-size-tiny);
1226
1226
  @property st-global(--wds-internal-angle-input-knob-offset);
1227
1227
  @property st-global(--wds-internal-angle-input-knob-offset-bottom);
1228
+ @property st-global(--wds-internal-animations-enabled);
1228
1229
  @property st-global(--wds-internal-button-border-width);
1229
1230
  @property st-global(--wds-internal-image-height-large);
1230
1231
  @property st-global(--wds-internal-image-height-medium);
@@ -2059,6 +2060,7 @@
2059
2060
  @property st-global(--wds-tabs-item-gap-small-medium);
2060
2061
  @property st-global(--wds-tabs-label-fill);
2061
2062
  @property st-global(--wds-tabs-label-fill-active);
2063
+ @property st-global(--wds-tabs-label-fill-disabled);
2062
2064
  @property st-global(--wds-tabs-label-font-size-medium);
2063
2065
  @property st-global(--wds-tabs-label-font-size-small);
2064
2066
  @property st-global(--wds-tabs-label-font-size-small-medium);
@@ -3593,6 +3595,7 @@
3593
3595
  --wds-input-value-font-size-tiny: 12px;
3594
3596
  --wds-internal-angle-input-knob-offset: 2px;
3595
3597
  --wds-internal-angle-input-knob-offset-bottom: 4px;
3598
+ --wds-internal-animations-enabled: true;
3596
3599
  --wds-internal-button-border-width: 1px;
3597
3600
  --wds-internal-image-height-large: 120px;
3598
3601
  --wds-internal-image-height-medium: 84px;
@@ -4427,6 +4430,7 @@
4427
4430
  --wds-tabs-item-gap-small-medium: 6px;
4428
4431
  --wds-tabs-label-fill: #525150;
4429
4432
  --wds-tabs-label-fill-active: #151414;
4433
+ --wds-tabs-label-fill-disabled: #a8a6a5;
4430
4434
  --wds-tabs-label-font-size-medium: 14px;
4431
4435
  --wds-tabs-label-font-size-small: 14px;
4432
4436
  --wds-tabs-label-font-size-small-medium: 14px;
package/odeditor/foundation.st.css CHANGED
@@ -161,6 +161,7 @@
161
161
  @property st-global(--wds-font-weight-medium);
162
162
  @property st-global(--wds-font-weight-regular);
163
163
  @property st-global(--wds-font-weight-semi-bold);
164
+ @property st-global(--wds-internal-animations-enabled);
164
165
  @property st-global(--wds-shadow-100);
165
166
  @property st-global(--wds-shadow-200);
166
167
  @property st-global(--wds-shadow-300);
@@ -404,6 +405,7 @@
404
405
  --wds-font-weight-medium: 500;
405
406
  --wds-font-weight-regular: 400;
406
407
  --wds-font-weight-semi-bold: 600;
408
+ --wds-internal-animations-enabled: true;
407
409
  --wds-shadow-100: 0 2px 1px rgba(19, 23, 32, .5), 0 0 3px rgba(19, 23, 32, .1);
408
410
  --wds-shadow-200: 0 2px 4px rgba(19, 23, 32, .05), 0 0 6px rgba(19, 23, 32, .1);
409
411
  --wds-shadow-300: 0 12px 30px 0 rgba(19, 23, 32, .1), 0 0px 0px 0 rgba(19, 23, 32, 0);
package/odeditor-dark/all.css CHANGED
@@ -409,6 +409,7 @@
409
409
  --wds-loader-stroke-width-large: 2px;
410
410
  --wds-list-item-select-min-height-medium: auto;
411
411
  --wds-list-item-action-subtitle-offset: 0px;
412
+ --wds-internal-animations-enabled: false;
412
413
  --wds-internal-thumbnail-illustration-size-tiny: 38px;
413
414
  --wds-internal-thumbnail-illustration-size-small: 51px;
414
415
  --wds-internal-thumbnail-illustration-size-medium: 72px;
package/odeditor-dark/all.scss CHANGED
@@ -179,6 +179,7 @@
179
179
  --wds-internal-image-height-small: 60px;
180
180
  --wds-internal-image-height-medium: 84px;
181
181
  --wds-internal-image-height-large: 120px;
182
+ --wds-internal-animations-enabled: false;
182
183
  --wds-input-shadow-focus-warning: transparent;
183
184
  --wds-input-shadow-focus-standard: transparent;
184
185
  --wds-input-shadow-focus-destructive: transparent;
package/odeditor-dark/all.st.css CHANGED
@@ -1229,6 +1229,7 @@
1229
1229
  @property st-global(--wds-input-value-font-size-tiny);
1230
1230
  @property st-global(--wds-internal-angle-input-knob-offset);
1231
1231
  @property st-global(--wds-internal-angle-input-knob-offset-bottom);
1232
+ @property st-global(--wds-internal-animations-enabled);
1232
1233
  @property st-global(--wds-internal-button-border-width);
1233
1234
  @property st-global(--wds-internal-image-height-large);
1234
1235
  @property st-global(--wds-internal-image-height-medium);
@@ -2061,6 +2062,7 @@
2061
2062
  @property st-global(--wds-tabs-item-gap-small-medium);
2062
2063
  @property st-global(--wds-tabs-label-fill);
2063
2064
  @property st-global(--wds-tabs-label-fill-active);
2065
+ @property st-global(--wds-tabs-label-fill-disabled);
2064
2066
  @property st-global(--wds-tabs-label-font-size-medium);
2065
2067
  @property st-global(--wds-tabs-label-font-size-small);
2066
2068
  @property st-global(--wds-tabs-label-font-size-small-medium);
@@ -3599,6 +3601,7 @@
3599
3601
  --wds-input-value-font-size-tiny: 12px;
3600
3602
  --wds-internal-angle-input-knob-offset: 2px;
3601
3603
  --wds-internal-angle-input-knob-offset-bottom: 4px;
3604
+ --wds-internal-animations-enabled: false;
3602
3605
  --wds-internal-button-border-width: 1px;
3603
3606
  --wds-internal-image-height-large: 120px;
3604
3607
  --wds-internal-image-height-medium: 84px;
@@ -4431,6 +4434,7 @@
4431
4434
  --wds-tabs-item-gap-small-medium: 6px;
4432
4435
  --wds-tabs-label-fill: #A8A6A5;
4433
4436
  --wds-tabs-label-fill-active: #FFFFFF;
4437
+ --wds-tabs-label-fill-disabled: #878685;
4434
4438
  --wds-tabs-label-font-size-medium: 14px;
4435
4439
  --wds-tabs-label-font-size-small: 12px;
4436
4440
  --wds-tabs-label-font-size-small-medium: 14px;
package/odeditor-dark/foundation.st.css CHANGED
@@ -162,6 +162,7 @@
162
162
  @property st-global(--wds-font-weight-medium);
163
163
  @property st-global(--wds-font-weight-regular);
164
164
  @property st-global(--wds-font-weight-semi-bold);
165
+ @property st-global(--wds-internal-animations-enabled);
165
166
  @property st-global(--wds-shadow-100);
166
167
  @property st-global(--wds-shadow-200);
167
168
  @property st-global(--wds-shadow-300);
@@ -406,6 +407,7 @@
406
407
  --wds-font-weight-medium: 500;
407
408
  --wds-font-weight-regular: 400;
408
409
  --wds-font-weight-semi-bold: 600;
410
+ --wds-internal-animations-enabled: false;
409
411
  --wds-shadow-100: 0 2px 1px rgba(0, 0, 0, .5), 0 0 3px rgba(0, 0, 0, .1);
410
412
  --wds-shadow-200: 0 2px 4px rgba(0, 0, 0, .05), 0 0 6px rgba(0, 0, 0, .1);
411
413
  --wds-shadow-300: 0 12px 30px 0 rgba(0, 0, 0, .3), 0 0px 0px 0 rgba(0, 0, 0, .3);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/design-system-tokens",
3
- "version": "1.220.2",
3
+ "version": "1.221.1",
4
4
  "scripts": {
5
5
  "build": "cp -r tokens/* .",
6
6
  "figma-to-dictionary": "ts-node src/scripts/figma-to-dictionary.ts",
@@ -36,5 +36,5 @@
36
36
  "author": "augustinasv@wix.com",
37
37
  "description": "Design system tokens",
38
38
  "packageManager": "yarn@3.5.0",
39
- "falconPackageHash": "4bc15daed212b4e2c95b13300481c6458453bed81444f26e7679c30b"
39
+ "falconPackageHash": "702d420d48b761775d8ec9025c2464f23dc3909dd43c98c71804c5dd"
40
40
  }
package/studio/all.css CHANGED
@@ -399,6 +399,7 @@
399
399
  --wds-loader-stroke-width-large: 4px;
400
400
  --wds-list-item-select-min-height-medium: auto;
401
401
  --wds-list-item-action-subtitle-offset: 0px;
402
+ --wds-internal-animations-enabled: false;
402
403
  --wds-internal-thumbnail-illustration-size-tiny: 38px;
403
404
  --wds-internal-thumbnail-illustration-size-small: 51px;
404
405
  --wds-internal-thumbnail-illustration-size-medium: 72px;
package/studio/all.scss CHANGED
@@ -154,6 +154,7 @@
154
154
  --wds-internal-image-height-medium: 84px;
155
155
  --wds-internal-image-height-large: 120px;
156
156
  --wds-internal-color-picker-width: 236px;
157
+ --wds-internal-animations-enabled: false;
157
158
  --wds-input-width-tiny: 48px;
158
159
  --wds-input-width-small: 56px;
159
160
  --wds-input-width-medium: 72px;
package/studio/all.st.css CHANGED
@@ -1246,6 +1246,7 @@
1246
1246
  @property st-global(--wds-input-width-medium);
1247
1247
  @property st-global(--wds-input-width-small);
1248
1248
  @property st-global(--wds-input-width-tiny);
1249
+ @property st-global(--wds-internal-animations-enabled);
1249
1250
  @property st-global(--wds-internal-color-picker-padding-horizontal);
1250
1251
  @property st-global(--wds-internal-color-picker-padding-vertical);
1251
1252
  @property st-global(--wds-internal-color-picker-width);
@@ -2068,6 +2069,7 @@
2068
2069
  @property st-global(--wds-tabs-item-gap-small-medium);
2069
2070
  @property st-global(--wds-tabs-label-fill);
2070
2071
  @property st-global(--wds-tabs-label-fill-active);
2072
+ @property st-global(--wds-tabs-label-fill-disabled);
2071
2073
  @property st-global(--wds-tabs-label-font-size-small);
2072
2074
  @property st-global(--wds-tabs-label-font-size-small-medium);
2073
2075
  @property st-global(--wds-tabs-label-font-weight);
@@ -3629,6 +3631,7 @@
3629
3631
  --wds-input-width-medium: 72px;
3630
3632
  --wds-input-width-small: 56px;
3631
3633
  --wds-input-width-tiny: 48px;
3634
+ --wds-internal-animations-enabled: false;
3632
3635
  --wds-internal-color-picker-padding-horizontal: 16px;
3633
3636
  --wds-internal-color-picker-padding-vertical: 12px;
3634
3637
  --wds-internal-color-picker-width: 236px;
@@ -4451,6 +4454,7 @@
4451
4454
  --wds-tabs-item-gap-small-medium: 6px;
4452
4455
  --wds-tabs-label-fill: #131720;
4453
4456
  --wds-tabs-label-fill-active: #116dff;
4457
+ --wds-tabs-label-fill-disabled: #bebebe;
4454
4458
  --wds-tabs-label-font-size-small: 14px;
4455
4459
  --wds-tabs-label-font-size-small-medium: 14px;
4456
4460
  --wds-tabs-label-font-weight: 400;
package/studio/foundation.st.css CHANGED
@@ -160,6 +160,7 @@
160
160
  @property st-global(--wds-font-weight-medium);
161
161
  @property st-global(--wds-font-weight-regular);
162
162
  @property st-global(--wds-font-weight-semi-bold);
163
+ @property st-global(--wds-internal-animations-enabled);
163
164
  @property st-global(--wds-shadow-100);
164
165
  @property st-global(--wds-shadow-200);
165
166
  @property st-global(--wds-shadow-300);
@@ -400,6 +401,7 @@
400
401
  --wds-font-weight-medium: 500;
401
402
  --wds-font-weight-regular: 400;
402
403
  --wds-font-weight-semi-bold: 600;
404
+ --wds-internal-animations-enabled: false;
403
405
  --wds-shadow-100: 0 2px 7px rgba(19, 23, 32, .2);
404
406
  --wds-shadow-200: 0 0 12px rgba(19, 23, 32, .2);
405
407
  --wds-shadow-300: 0 12px 20px rgba(19, 23, 32, .1);
package/wixel/all.css CHANGED
@@ -382,6 +382,7 @@
382
382
  --wds-loader-stroke-width-large: 4px;
383
383
  --wds-list-item-select-min-height-medium: auto;
384
384
  --wds-list-item-action-subtitle-offset: 0px;
385
+ --wds-internal-animations-enabled: false;
385
386
  --wds-internal-thumbnail-illustration-size-tiny: 38px;
386
387
  --wds-internal-thumbnail-illustration-size-small: 51px;
387
388
  --wds-internal-thumbnail-illustration-size-medium: 72px;
package/wixel/all.scss CHANGED
@@ -150,6 +150,7 @@
150
150
  --wds-internal-image-height-medium: 84px;
151
151
  --wds-internal-image-height-large: 120px;
152
152
  --wds-internal-color-picker-width: 236px;
153
+ --wds-internal-animations-enabled: false;
153
154
  --wds-input-width-tiny: 48px;
154
155
  --wds-input-width-small: 56px;
155
156
  --wds-input-width-medium: 72px;
package/wixel/all.st.css CHANGED
@@ -1215,6 +1215,7 @@
1215
1215
  @property st-global(--wds-input-width-medium);
1216
1216
  @property st-global(--wds-input-width-small);
1217
1217
  @property st-global(--wds-input-width-tiny);
1218
+ @property st-global(--wds-internal-animations-enabled);
1218
1219
  @property st-global(--wds-internal-color-picker-padding-horizontal);
1219
1220
  @property st-global(--wds-internal-color-picker-padding-vertical);
1220
1221
  @property st-global(--wds-internal-color-picker-width);
@@ -2010,6 +2011,7 @@
2010
2011
  @property st-global(--wds-tabs-item-gap-small-medium);
2011
2012
  @property st-global(--wds-tabs-label-fill);
2012
2013
  @property st-global(--wds-tabs-label-fill-active);
2014
+ @property st-global(--wds-tabs-label-fill-disabled);
2013
2015
  @property st-global(--wds-tabs-label-font-size-small);
2014
2016
  @property st-global(--wds-tabs-label-font-size-small-medium);
2015
2017
  @property st-global(--wds-tabs-label-font-weight);
@@ -3534,6 +3536,7 @@
3534
3536
  --wds-input-width-medium: 72px;
3535
3537
  --wds-input-width-small: 56px;
3536
3538
  --wds-input-width-tiny: 48px;
3539
+ --wds-internal-animations-enabled: false;
3537
3540
  --wds-internal-color-picker-padding-horizontal: 16px;
3538
3541
  --wds-internal-color-picker-padding-vertical: 12px;
3539
3542
  --wds-internal-color-picker-width: 236px;
@@ -4329,6 +4332,7 @@
4329
4332
  --wds-tabs-item-gap-small-medium: 6px;
4330
4333
  --wds-tabs-label-fill: #000624;
4331
4334
  --wds-tabs-label-fill-active: #4a57ff;
4335
+ --wds-tabs-label-fill-disabled: rgba(38, 37, 36, 0.3000);
4332
4336
  --wds-tabs-label-font-size-small: 12px;
4333
4337
  --wds-tabs-label-font-size-small-medium: 12px;
4334
4338
  --wds-tabs-label-font-weight: 400;
package/wixel/foundation.st.css CHANGED
@@ -158,6 +158,7 @@
158
158
  @property st-global(--wds-font-weight-medium);
159
159
  @property st-global(--wds-font-weight-regular);
160
160
  @property st-global(--wds-font-weight-semi-bold);
161
+ @property st-global(--wds-internal-animations-enabled);
161
162
  @property st-global(--wds-shadow-100);
162
163
  @property st-global(--wds-shadow-200);
163
164
  @property st-global(--wds-shadow-300);
@@ -393,6 +394,7 @@
393
394
  --wds-font-weight-medium: 500;
394
395
  --wds-font-weight-regular: 400;
395
396
  --wds-font-weight-semi-bold: 600;
397
+ --wds-internal-animations-enabled: false;
396
398
  --wds-shadow-100: 0px;
397
399
  --wds-shadow-200: 0px;
398
400
  --wds-shadow-300: 0 2px 18px rgba(38, 37, 36, 0.1000), 0 6px 6px rgba(38, 37, 36, 0.0000);