@wordpress/theme 0.6.0 → 0.7.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 (17) hide show
  1. package/CHANGELOG.md +56 -30
  2. package/README.md +2 -2
  3. package/build/prebuilt/js/design-tokens.cjs +13 -10
  4. package/build/prebuilt/js/design-tokens.cjs.map +2 -2
  5. package/build/prebuilt/ts/token-types.cjs.map +1 -1
  6. package/build-module/prebuilt/js/design-tokens.mjs +13 -10
  7. package/build-module/prebuilt/js/design-tokens.mjs.map +2 -2
  8. package/build-types/prebuilt/ts/token-types.d.ts +2 -2
  9. package/build-types/prebuilt/ts/token-types.d.ts.map +1 -1
  10. package/build-types/stories/index.story.d.ts +0 -1
  11. package/build-types/stories/index.story.d.ts.map +1 -1
  12. package/package.json +5 -5
  13. package/src/prebuilt/css/design-tokens.css +60 -48
  14. package/src/prebuilt/js/design-tokens.mjs +13 -10
  15. package/src/prebuilt/ts/token-types.ts +2 -2
  16. package/src/stories/index.story.tsx +4 -5
  17. package/src/stylelint-plugins/test/fixtures/no-unknown-ds-tokens-valid.css +1 -1
package/CHANGELOG.md CHANGED
@@ -2,47 +2,73 @@
2
2
 
3
3
  ## Unreleased
4
4
 
5
- ## 0.6.0 (2026-01-29)
5
+ ## 0.7.0 (2026-02-18)
6
6
 
7
- ## 0.5.0 (2026-01-16)
7
+ ### Breaking changes
8
+
9
+ - Renamed padding tokens to remove the `surface` segment and updated the scale from `2xs`–`lg` to `xs`–`3xl` ([#75054](https://github.com/WordPress/gutenberg/pull/75054)). To preserve the same values:
10
+ - `--wpds-dimension-padding-surface-2xs`: use `--wpds-dimension-padding-xs` instead.
11
+ - `--wpds-dimension-padding-surface-xs`: use `--wpds-dimension-padding-sm` instead.
12
+ - `--wpds-dimension-padding-surface-sm`: use `--wpds-dimension-padding-lg` instead.
13
+ - `--wpds-dimension-padding-surface-md`: use `--wpds-dimension-padding-2xl` instead.
14
+ - `--wpds-dimension-padding-surface-lg`: use `--wpds-dimension-padding-3xl` instead.
15
+ - Updated gap token scale from `2xs`–`xl` to `xs`–`3xl` ([#75054](https://github.com/WordPress/gutenberg/pull/75054)). To preserve the same values:
16
+ - `--wpds-dimension-gap-2xs`: use `--wpds-dimension-gap-xs` instead.
17
+ - `--wpds-dimension-gap-xs`: use `--wpds-dimension-gap-sm` instead.
18
+ - `--wpds-dimension-gap-sm`: use `--wpds-dimension-gap-md` instead.
19
+ - `--wpds-dimension-gap-md`: use `--wpds-dimension-gap-lg` instead.
20
+ - `--wpds-dimension-gap-lg`: use `--wpds-dimension-gap-xl` instead.
21
+ - `--wpds-dimension-gap-xl`: use `--wpds-dimension-gap-3xl` instead.
22
+ - Renamed elevation tokens to use abbreviated size names for consistency with other tokens ([#75103](https://github.com/WordPress/gutenberg/pull/75103)):
23
+ - `--wpds-elevation-x-small`: use `--wpds-elevation-xs` instead.
24
+ - `--wpds-elevation-small`: use `--wpds-elevation-sm` instead.
25
+ - `--wpds-elevation-medium`: use `--wpds-elevation-md` instead.
26
+ - `--wpds-elevation-large`: use `--wpds-elevation-lg` instead.
27
+
28
+ ## 0.6.0 (2026-01-29)
8
29
 
9
30
  ### Breaking changes
10
31
 
11
32
  - Renamed border tokens to remove the `surface` segment from token names ([#74617](https://github.com/WordPress/gutenberg/pull/74617)):
12
- - `--wpds-border-radius-surface-xs`: use `--wpds-border-radius-xs` instead.
13
- - `--wpds-border-radius-surface-sm`: use `--wpds-border-radius-sm` instead.
14
- - `--wpds-border-radius-surface-md`: use `--wpds-border-radius-md` instead.
15
- - `--wpds-border-radius-surface-lg`: use `--wpds-border-radius-lg` instead.
16
- - `--wpds-border-width-surface-xs`: use `--wpds-border-width-xs` instead.
17
- - `--wpds-border-width-surface-sm`: use `--wpds-border-width-sm` instead.
18
- - `--wpds-border-width-surface-md`: use `--wpds-border-width-md` instead.
19
- - `--wpds-border-width-surface-lg`: use `--wpds-border-width-lg` instead.
20
- - `--wpds-border-width-interactive-focus`: use `--wpds-border-width-focus` instead.
33
+
34
+ - `--wpds-border-radius-surface-xs`: use `--wpds-border-radius-xs` instead.
35
+ - `--wpds-border-radius-surface-sm`: use `--wpds-border-radius-sm` instead.
36
+ - `--wpds-border-radius-surface-md`: use `--wpds-border-radius-md` instead.
37
+ - `--wpds-border-radius-surface-lg`: use `--wpds-border-radius-lg` instead.
38
+ - `--wpds-border-width-surface-xs`: use `--wpds-border-width-xs` instead.
39
+ - `--wpds-border-width-surface-sm`: use `--wpds-border-width-sm` instead.
40
+ - `--wpds-border-width-surface-md`: use `--wpds-border-width-md` instead.
41
+ - `--wpds-border-width-surface-lg`: use `--wpds-border-width-lg` instead.
42
+ - `--wpds-border-width-interactive-focus`: use `--wpds-border-width-focus` instead.
43
+
44
+ ## 0.5.0 (2026-01-16)
45
+
46
+ ### Breaking changes
21
47
 
22
48
  - Removed the following tokens ([#74470](https://github.com/WordPress/gutenberg/pull/74470)):
23
- - `--wpds-color-bg-interactive-neutral`: use `--wpds-color-bg-interactive-neutral-weak` instead.
24
- - `--wpds-color-bg-interactive-neutral-active`: use `--wpds-color-bg-interactive-neutral-weak-active` instead.
25
- - `--wpds-color-bg-interactive-neutral-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
26
- - `--wpds-color-bg-interactive-brand`: use `--wpds-color-bg-interactive-brand-weak` instead.
27
- - `--wpds-color-bg-interactive-brand-active`: use `--wpds-color-bg-interactive-brand-weak-active` instead.
28
- - `--wpds-color-bg-interactive-brand-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
29
- - `--wpds-color-bg-interactive-brand-strong-disabled`: use `--wpds-color-bg-interactive-neutral-strong-disabled` instead.
30
- - `--wpds-color-bg-interactive-brand-weak-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
31
- - `--wpds-color-bg-interactive-error-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
32
- - `--wpds-color-bg-interactive-error-strong-disabled`: use `--wpds-color-bg-interactive-neutral-strong-disabled` instead.
33
- - `--wpds-color-bg-interactive-error-weak-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
34
- - `--wpds-color-fg-interactive-brand-disabled`: use `--wpds-color-fg-interactive-neutral-disabled` instead.
35
- - `--wpds-color-fg-interactive-brand-strong-disabled`: use `--wpds-color-fg-interactive-neutral-strong-disabled` instead.
36
- - `--wpds-color-fg-interactive-error-disabled`: use `--wpds-color-fg-interactive-neutral-disabled` instead.
37
- - `--wpds-color-fg-interactive-error-strong-disabled`: use `--wpds-color-fg-interactive-neutral-strong-disabled` instead.
38
- - `--wpds-color-bg-thumb-brand-disabled`: use the newly added `--wpds-color-bg-thumb-neutral-disabled` instead.
49
+ - `--wpds-color-bg-interactive-neutral`: use `--wpds-color-bg-interactive-neutral-weak` instead.
50
+ - `--wpds-color-bg-interactive-neutral-active`: use `--wpds-color-bg-interactive-neutral-weak-active` instead.
51
+ - `--wpds-color-bg-interactive-neutral-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
52
+ - `--wpds-color-bg-interactive-brand`: use `--wpds-color-bg-interactive-brand-weak` instead.
53
+ - `--wpds-color-bg-interactive-brand-active`: use `--wpds-color-bg-interactive-brand-weak-active` instead.
54
+ - `--wpds-color-bg-interactive-brand-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
55
+ - `--wpds-color-bg-interactive-brand-strong-disabled`: use `--wpds-color-bg-interactive-neutral-strong-disabled` instead.
56
+ - `--wpds-color-bg-interactive-brand-weak-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
57
+ - `--wpds-color-bg-interactive-error-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
58
+ - `--wpds-color-bg-interactive-error-strong-disabled`: use `--wpds-color-bg-interactive-neutral-strong-disabled` instead.
59
+ - `--wpds-color-bg-interactive-error-weak-disabled`: use `--wpds-color-bg-interactive-neutral-weak-disabled` instead.
60
+ - `--wpds-color-fg-interactive-brand-disabled`: use `--wpds-color-fg-interactive-neutral-disabled` instead.
61
+ - `--wpds-color-fg-interactive-brand-strong-disabled`: use `--wpds-color-fg-interactive-neutral-strong-disabled` instead.
62
+ - `--wpds-color-fg-interactive-error-disabled`: use `--wpds-color-fg-interactive-neutral-disabled` instead.
63
+ - `--wpds-color-fg-interactive-error-strong-disabled`: use `--wpds-color-fg-interactive-neutral-strong-disabled` instead.
64
+ - `--wpds-color-bg-thumb-brand-disabled`: use the newly added `--wpds-color-bg-thumb-neutral-disabled` instead.
39
65
 
40
66
  ### Enhancements
41
67
 
42
68
  - Tweaked the values of the following tokens ([#74470](https://github.com/WordPress/gutenberg/pull/74470)):
43
- - `--wpds-color-bg-interactive-neutral-strong-disabled` from `#d2d2d2` to `#e2e2e2`.
44
- - `--wpds-color-bg-interactive-neutral-weak-disabled` from `#e2e2e2` to `#00000000`.
45
- - `--wpds-color-fg-interactive-neutral-strong-disabled` from `#6d6d6d` to `#8a8a8a`.
69
+ - `--wpds-color-bg-interactive-neutral-strong-disabled` from `#d2d2d2` to `#e2e2e2`.
70
+ - `--wpds-color-bg-interactive-neutral-weak-disabled` from `#e2e2e2` to `#00000000`.
71
+ - `--wpds-color-fg-interactive-neutral-strong-disabled` from `#6d6d6d` to `#8a8a8a`.
46
72
 
47
73
  ### New Features
48
74
 
package/README.md CHANGED
@@ -26,7 +26,7 @@ This separation allows the design system to maintain consistency while providing
26
26
 
27
27
  Design tokens are the visual design atoms of a design system. They are named entities that store visual design attributes like colors, spacing, typography, and shadows. They serve as a single source of truth that bridges design and development, ensuring consistency across platforms and making it easy to maintain and evolve the visual language of an application.
28
28
 
29
- Rather than hardcoding values like `#3858e9` or `16px` throughout your code, tokens provide semantic names like `--wpds-color-bg-interactive-brand-strong` or `--wpds-dimension-padding-surface-md` that describe the purpose and context of the value. This makes code more maintainable and allows the design system to evolve. When a token's value changes, all components using that token automatically reflect the update.
29
+ Rather than hardcoding values like `#3858e9` or `16px` throughout your code, tokens provide semantic names like `--wpds-color-bg-interactive-brand-strong` or `--wpds-dimension-padding-2xl` that describe the purpose and context of the value. This makes code more maintainable and allows the design system to evolve. When a token's value changes, all components using that token automatically reflect the update.
30
30
 
31
31
  #### Structure
32
32
 
@@ -89,7 +89,7 @@ Semantic tokens follow a consistent naming pattern:
89
89
 
90
90
  | Value | Description |
91
91
  | ----------------------------------- | -------------------- |
92
- | `2xs`, `xs`, `sm`, `md`, `lg`, `xl` | Size scale modifiers |
92
+ | `xs`, `sm`, `md`, `lg`, `xl`, `2xl`, `3xl` | Size scale modifiers |
93
93
 
94
94
  #### Color Token Modifiers
95
95
 
package/build/prebuilt/js/design-tokens.cjs CHANGED
@@ -121,21 +121,24 @@ var design_tokens_default = [
121
121
  "--wpds-color-stroke-interactive-error-strong",
122
122
  "--wpds-color-stroke-focus-brand",
123
123
  "--wpds-dimension-base",
124
- "--wpds-dimension-padding-surface-2xs",
125
- "--wpds-dimension-padding-surface-xs",
126
- "--wpds-dimension-padding-surface-sm",
127
- "--wpds-dimension-padding-surface-md",
128
- "--wpds-dimension-padding-surface-lg",
129
- "--wpds-dimension-gap-2xs",
124
+ "--wpds-dimension-padding-xs",
125
+ "--wpds-dimension-padding-sm",
126
+ "--wpds-dimension-padding-md",
127
+ "--wpds-dimension-padding-lg",
128
+ "--wpds-dimension-padding-xl",
129
+ "--wpds-dimension-padding-2xl",
130
+ "--wpds-dimension-padding-3xl",
130
131
  "--wpds-dimension-gap-xs",
131
132
  "--wpds-dimension-gap-sm",
132
133
  "--wpds-dimension-gap-md",
133
134
  "--wpds-dimension-gap-lg",
134
135
  "--wpds-dimension-gap-xl",
135
- "--wpds-elevation-x-small",
136
- "--wpds-elevation-small",
137
- "--wpds-elevation-medium",
138
- "--wpds-elevation-large",
136
+ "--wpds-dimension-gap-2xl",
137
+ "--wpds-dimension-gap-3xl",
138
+ "--wpds-elevation-xs",
139
+ "--wpds-elevation-sm",
140
+ "--wpds-elevation-md",
141
+ "--wpds-elevation-lg",
139
142
  "--wpds-font-family-heading",
140
143
  "--wpds-font-family-body",
141
144
  "--wpds-font-family-mono",
package/build/prebuilt/js/design-tokens.cjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/prebuilt/js/design-tokens.mjs"],
4
- "sourcesContent": ["/*\n * This file is generated by the @wordpress/terrazzo-plugin-known-wpds-css-variables plugin.\n * Do not edit this file directly.\n */\n\nexport default [\n\t'--wpds-border-radius-xs',\n\t'--wpds-border-radius-sm',\n\t'--wpds-border-radius-md',\n\t'--wpds-border-radius-lg',\n\t'--wpds-border-width-xs',\n\t'--wpds-border-width-sm',\n\t'--wpds-border-width-md',\n\t'--wpds-border-width-lg',\n\t'--wpds-border-width-focus',\n\t'--wpds-color-bg-surface-neutral',\n\t'--wpds-color-bg-surface-neutral-strong',\n\t'--wpds-color-bg-surface-neutral-weak',\n\t'--wpds-color-bg-surface-brand',\n\t'--wpds-color-bg-surface-success',\n\t'--wpds-color-bg-surface-success-weak',\n\t'--wpds-color-bg-surface-info',\n\t'--wpds-color-bg-surface-info-weak',\n\t'--wpds-color-bg-surface-warning',\n\t'--wpds-color-bg-surface-warning-weak',\n\t'--wpds-color-bg-surface-caution',\n\t'--wpds-color-bg-surface-caution-weak',\n\t'--wpds-color-bg-surface-error',\n\t'--wpds-color-bg-surface-error-weak',\n\t'--wpds-color-bg-interactive-neutral-strong',\n\t'--wpds-color-bg-interactive-neutral-strong-active',\n\t'--wpds-color-bg-interactive-neutral-strong-disabled',\n\t'--wpds-color-bg-interactive-neutral-weak',\n\t'--wpds-color-bg-interactive-neutral-weak-active',\n\t'--wpds-color-bg-interactive-neutral-weak-disabled',\n\t'--wpds-color-bg-interactive-brand-strong',\n\t'--wpds-color-bg-interactive-brand-strong-active',\n\t'--wpds-color-bg-interactive-brand-weak',\n\t'--wpds-color-bg-interactive-brand-weak-active',\n\t'--wpds-color-bg-interactive-error',\n\t'--wpds-color-bg-interactive-error-active',\n\t'--wpds-color-bg-interactive-error-strong',\n\t'--wpds-color-bg-interactive-error-strong-active',\n\t'--wpds-color-bg-interactive-error-weak',\n\t'--wpds-color-bg-interactive-error-weak-active',\n\t'--wpds-color-bg-track-neutral-weak',\n\t'--wpds-color-bg-track-neutral',\n\t'--wpds-color-bg-thumb-neutral-weak',\n\t'--wpds-color-bg-thumb-neutral-weak-active',\n\t'--wpds-color-bg-thumb-brand',\n\t'--wpds-color-bg-thumb-brand-active',\n\t'--wpds-color-bg-thumb-neutral-disabled',\n\t'--wpds-color-fg-content-neutral',\n\t'--wpds-color-fg-content-neutral-weak',\n\t'--wpds-color-fg-content-success',\n\t'--wpds-color-fg-content-success-weak',\n\t'--wpds-color-fg-content-info',\n\t'--wpds-color-fg-content-info-weak',\n\t'--wpds-color-fg-content-warning',\n\t'--wpds-color-fg-content-warning-weak',\n\t'--wpds-color-fg-content-caution',\n\t'--wpds-color-fg-content-caution-weak',\n\t'--wpds-color-fg-content-error',\n\t'--wpds-color-fg-content-error-weak',\n\t'--wpds-color-fg-interactive-neutral',\n\t'--wpds-color-fg-interactive-neutral-active',\n\t'--wpds-color-fg-interactive-neutral-disabled',\n\t'--wpds-color-fg-interactive-neutral-strong',\n\t'--wpds-color-fg-interactive-neutral-strong-active',\n\t'--wpds-color-fg-interactive-neutral-strong-disabled',\n\t'--wpds-color-fg-interactive-neutral-weak',\n\t'--wpds-color-fg-interactive-neutral-weak-disabled',\n\t'--wpds-color-fg-interactive-brand',\n\t'--wpds-color-fg-interactive-brand-active',\n\t'--wpds-color-fg-interactive-brand-strong',\n\t'--wpds-color-fg-interactive-brand-strong-active',\n\t'--wpds-color-fg-interactive-error',\n\t'--wpds-color-fg-interactive-error-active',\n\t'--wpds-color-fg-interactive-error-strong',\n\t'--wpds-color-fg-interactive-error-strong-active',\n\t'--wpds-color-stroke-surface-neutral',\n\t'--wpds-color-stroke-surface-neutral-weak',\n\t'--wpds-color-stroke-surface-neutral-strong',\n\t'--wpds-color-stroke-surface-brand',\n\t'--wpds-color-stroke-surface-brand-strong',\n\t'--wpds-color-stroke-surface-success',\n\t'--wpds-color-stroke-surface-success-strong',\n\t'--wpds-color-stroke-surface-info',\n\t'--wpds-color-stroke-surface-info-strong',\n\t'--wpds-color-stroke-surface-warning',\n\t'--wpds-color-stroke-surface-warning-strong',\n\t'--wpds-color-stroke-surface-error',\n\t'--wpds-color-stroke-surface-error-strong',\n\t'--wpds-color-stroke-interactive-neutral',\n\t'--wpds-color-stroke-interactive-neutral-active',\n\t'--wpds-color-stroke-interactive-neutral-disabled',\n\t'--wpds-color-stroke-interactive-neutral-strong',\n\t'--wpds-color-stroke-interactive-brand',\n\t'--wpds-color-stroke-interactive-brand-active',\n\t'--wpds-color-stroke-interactive-error',\n\t'--wpds-color-stroke-interactive-error-active',\n\t'--wpds-color-stroke-interactive-error-strong',\n\t'--wpds-color-stroke-focus-brand',\n\t'--wpds-dimension-base',\n\t'--wpds-dimension-padding-surface-2xs',\n\t'--wpds-dimension-padding-surface-xs',\n\t'--wpds-dimension-padding-surface-sm',\n\t'--wpds-dimension-padding-surface-md',\n\t'--wpds-dimension-padding-surface-lg',\n\t'--wpds-dimension-gap-2xs',\n\t'--wpds-dimension-gap-xs',\n\t'--wpds-dimension-gap-sm',\n\t'--wpds-dimension-gap-md',\n\t'--wpds-dimension-gap-lg',\n\t'--wpds-dimension-gap-xl',\n\t'--wpds-elevation-x-small',\n\t'--wpds-elevation-small',\n\t'--wpds-elevation-medium',\n\t'--wpds-elevation-large',\n\t'--wpds-font-family-heading',\n\t'--wpds-font-family-body',\n\t'--wpds-font-family-mono',\n\t'--wpds-font-size-xs',\n\t'--wpds-font-size-sm',\n\t'--wpds-font-size-md',\n\t'--wpds-font-size-lg',\n\t'--wpds-font-size-xl',\n\t'--wpds-font-size-2xl',\n\t'--wpds-font-line-height-xs',\n\t'--wpds-font-line-height-sm',\n\t'--wpds-font-line-height-md',\n\t'--wpds-font-line-height-lg',\n\t'--wpds-font-line-height-xl',\n\t'--wpds-font-line-height-2xl',\n\t'--wpds-font-weight-regular',\n\t'--wpds-font-weight-medium',\n];\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA,IAAO,wBAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;",
4
+ "sourcesContent": ["/*\n * This file is generated by the @wordpress/terrazzo-plugin-known-wpds-css-variables plugin.\n * Do not edit this file directly.\n */\n\nexport default [\n\t'--wpds-border-radius-xs',\n\t'--wpds-border-radius-sm',\n\t'--wpds-border-radius-md',\n\t'--wpds-border-radius-lg',\n\t'--wpds-border-width-xs',\n\t'--wpds-border-width-sm',\n\t'--wpds-border-width-md',\n\t'--wpds-border-width-lg',\n\t'--wpds-border-width-focus',\n\t'--wpds-color-bg-surface-neutral',\n\t'--wpds-color-bg-surface-neutral-strong',\n\t'--wpds-color-bg-surface-neutral-weak',\n\t'--wpds-color-bg-surface-brand',\n\t'--wpds-color-bg-surface-success',\n\t'--wpds-color-bg-surface-success-weak',\n\t'--wpds-color-bg-surface-info',\n\t'--wpds-color-bg-surface-info-weak',\n\t'--wpds-color-bg-surface-warning',\n\t'--wpds-color-bg-surface-warning-weak',\n\t'--wpds-color-bg-surface-caution',\n\t'--wpds-color-bg-surface-caution-weak',\n\t'--wpds-color-bg-surface-error',\n\t'--wpds-color-bg-surface-error-weak',\n\t'--wpds-color-bg-interactive-neutral-strong',\n\t'--wpds-color-bg-interactive-neutral-strong-active',\n\t'--wpds-color-bg-interactive-neutral-strong-disabled',\n\t'--wpds-color-bg-interactive-neutral-weak',\n\t'--wpds-color-bg-interactive-neutral-weak-active',\n\t'--wpds-color-bg-interactive-neutral-weak-disabled',\n\t'--wpds-color-bg-interactive-brand-strong',\n\t'--wpds-color-bg-interactive-brand-strong-active',\n\t'--wpds-color-bg-interactive-brand-weak',\n\t'--wpds-color-bg-interactive-brand-weak-active',\n\t'--wpds-color-bg-interactive-error',\n\t'--wpds-color-bg-interactive-error-active',\n\t'--wpds-color-bg-interactive-error-strong',\n\t'--wpds-color-bg-interactive-error-strong-active',\n\t'--wpds-color-bg-interactive-error-weak',\n\t'--wpds-color-bg-interactive-error-weak-active',\n\t'--wpds-color-bg-track-neutral-weak',\n\t'--wpds-color-bg-track-neutral',\n\t'--wpds-color-bg-thumb-neutral-weak',\n\t'--wpds-color-bg-thumb-neutral-weak-active',\n\t'--wpds-color-bg-thumb-brand',\n\t'--wpds-color-bg-thumb-brand-active',\n\t'--wpds-color-bg-thumb-neutral-disabled',\n\t'--wpds-color-fg-content-neutral',\n\t'--wpds-color-fg-content-neutral-weak',\n\t'--wpds-color-fg-content-success',\n\t'--wpds-color-fg-content-success-weak',\n\t'--wpds-color-fg-content-info',\n\t'--wpds-color-fg-content-info-weak',\n\t'--wpds-color-fg-content-warning',\n\t'--wpds-color-fg-content-warning-weak',\n\t'--wpds-color-fg-content-caution',\n\t'--wpds-color-fg-content-caution-weak',\n\t'--wpds-color-fg-content-error',\n\t'--wpds-color-fg-content-error-weak',\n\t'--wpds-color-fg-interactive-neutral',\n\t'--wpds-color-fg-interactive-neutral-active',\n\t'--wpds-color-fg-interactive-neutral-disabled',\n\t'--wpds-color-fg-interactive-neutral-strong',\n\t'--wpds-color-fg-interactive-neutral-strong-active',\n\t'--wpds-color-fg-interactive-neutral-strong-disabled',\n\t'--wpds-color-fg-interactive-neutral-weak',\n\t'--wpds-color-fg-interactive-neutral-weak-disabled',\n\t'--wpds-color-fg-interactive-brand',\n\t'--wpds-color-fg-interactive-brand-active',\n\t'--wpds-color-fg-interactive-brand-strong',\n\t'--wpds-color-fg-interactive-brand-strong-active',\n\t'--wpds-color-fg-interactive-error',\n\t'--wpds-color-fg-interactive-error-active',\n\t'--wpds-color-fg-interactive-error-strong',\n\t'--wpds-color-fg-interactive-error-strong-active',\n\t'--wpds-color-stroke-surface-neutral',\n\t'--wpds-color-stroke-surface-neutral-weak',\n\t'--wpds-color-stroke-surface-neutral-strong',\n\t'--wpds-color-stroke-surface-brand',\n\t'--wpds-color-stroke-surface-brand-strong',\n\t'--wpds-color-stroke-surface-success',\n\t'--wpds-color-stroke-surface-success-strong',\n\t'--wpds-color-stroke-surface-info',\n\t'--wpds-color-stroke-surface-info-strong',\n\t'--wpds-color-stroke-surface-warning',\n\t'--wpds-color-stroke-surface-warning-strong',\n\t'--wpds-color-stroke-surface-error',\n\t'--wpds-color-stroke-surface-error-strong',\n\t'--wpds-color-stroke-interactive-neutral',\n\t'--wpds-color-stroke-interactive-neutral-active',\n\t'--wpds-color-stroke-interactive-neutral-disabled',\n\t'--wpds-color-stroke-interactive-neutral-strong',\n\t'--wpds-color-stroke-interactive-brand',\n\t'--wpds-color-stroke-interactive-brand-active',\n\t'--wpds-color-stroke-interactive-error',\n\t'--wpds-color-stroke-interactive-error-active',\n\t'--wpds-color-stroke-interactive-error-strong',\n\t'--wpds-color-stroke-focus-brand',\n\t'--wpds-dimension-base',\n\t'--wpds-dimension-padding-xs',\n\t'--wpds-dimension-padding-sm',\n\t'--wpds-dimension-padding-md',\n\t'--wpds-dimension-padding-lg',\n\t'--wpds-dimension-padding-xl',\n\t'--wpds-dimension-padding-2xl',\n\t'--wpds-dimension-padding-3xl',\n\t'--wpds-dimension-gap-xs',\n\t'--wpds-dimension-gap-sm',\n\t'--wpds-dimension-gap-md',\n\t'--wpds-dimension-gap-lg',\n\t'--wpds-dimension-gap-xl',\n\t'--wpds-dimension-gap-2xl',\n\t'--wpds-dimension-gap-3xl',\n\t'--wpds-elevation-xs',\n\t'--wpds-elevation-sm',\n\t'--wpds-elevation-md',\n\t'--wpds-elevation-lg',\n\t'--wpds-font-family-heading',\n\t'--wpds-font-family-body',\n\t'--wpds-font-family-mono',\n\t'--wpds-font-size-xs',\n\t'--wpds-font-size-sm',\n\t'--wpds-font-size-md',\n\t'--wpds-font-size-lg',\n\t'--wpds-font-size-xl',\n\t'--wpds-font-size-2xl',\n\t'--wpds-font-line-height-xs',\n\t'--wpds-font-line-height-sm',\n\t'--wpds-font-line-height-md',\n\t'--wpds-font-line-height-lg',\n\t'--wpds-font-line-height-xl',\n\t'--wpds-font-line-height-2xl',\n\t'--wpds-font-weight-regular',\n\t'--wpds-font-weight-medium',\n];\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA,IAAO,wBAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;",
6
6
  "names": []
7
7
  }
package/build/prebuilt/ts/token-types.cjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/prebuilt/ts/token-types.ts"],
4
- "sourcesContent": ["/*\n * This file is generated by the @wordpress/terrazzo-plugin-typescript-types plugin.\n * Do not edit this file directly.\n */\n\n/**\n * Size scale for padding tokens.\n */\nexport type PaddingSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg';\n\n/**\n * Size scale for gap tokens.\n */\nexport type GapSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\n/**\n * Size scale for border radius tokens.\n */\nexport type BorderRadiusSize = 'xs' | 'sm' | 'md' | 'lg';\n\n/**\n * Size scale for border width tokens.\n */\nexport type BorderWidthSize = 'xs' | 'sm' | 'md' | 'lg' | 'focus';\n\n/**\n * Target elements that tokens can be applied to.\n */\nexport type Target =\n\t| 'surface'\n\t| 'interactive'\n\t| 'track'\n\t| 'thumb'\n\t| 'content'\n\t| 'focus';\n\n/**\n * Background color variants for surface elements.\n */\nexport type SurfaceBackgroundColor =\n\t| 'neutral'\n\t| 'neutral-strong'\n\t| 'neutral-weak'\n\t| 'brand'\n\t| 'success'\n\t| 'success-weak'\n\t| 'info'\n\t| 'info-weak'\n\t| 'warning'\n\t| 'warning-weak'\n\t| 'caution'\n\t| 'caution-weak'\n\t| 'error'\n\t| 'error-weak';\n\n/**\n * Background color variants for interactive elements.\n */\nexport type InteractiveBackgroundColor =\n\t| 'neutral-strong'\n\t| 'neutral-weak'\n\t| 'brand-strong'\n\t| 'brand-weak'\n\t| 'error'\n\t| 'error-strong'\n\t| 'error-weak';\n\n/**\n * Foreground color variants for content text and icons.\n */\nexport type ContentForegroundColor =\n\t| 'neutral'\n\t| 'neutral-weak'\n\t| 'success'\n\t| 'success-weak'\n\t| 'info'\n\t| 'info-weak'\n\t| 'warning'\n\t| 'warning-weak'\n\t| 'caution'\n\t| 'caution-weak'\n\t| 'error'\n\t| 'error-weak';\n\n/**\n * Foreground color variants for interactive element text and icons.\n */\nexport type InteractiveForegroundColor =\n\t| 'neutral'\n\t| 'neutral-strong'\n\t| 'neutral-weak'\n\t| 'brand'\n\t| 'brand-strong'\n\t| 'error'\n\t| 'error-strong';\n\n/**\n * Stroke color variants for surface borders.\n */\nexport type SurfaceStrokeColor =\n\t| 'neutral'\n\t| 'neutral-weak'\n\t| 'neutral-strong'\n\t| 'brand'\n\t| 'brand-strong'\n\t| 'success'\n\t| 'success-strong'\n\t| 'info'\n\t| 'info-strong'\n\t| 'warning'\n\t| 'warning-strong'\n\t| 'error'\n\t| 'error-strong';\n\n/**\n * Stroke color variants for interactive element borders.\n */\nexport type InteractiveStrokeColor =\n\t| 'neutral'\n\t| 'neutral-strong'\n\t| 'brand'\n\t| 'error'\n\t| 'error-strong';\n\n/**\n * Foreground color variants for text elements.\n */\nexport type ForegroundColor =\n\t| 'neutral'\n\t| 'neutral-weak'\n\t| 'success'\n\t| 'success-weak'\n\t| 'info'\n\t| 'info-weak'\n\t| 'warning'\n\t| 'warning-weak'\n\t| 'caution'\n\t| 'caution-weak'\n\t| 'error'\n\t| 'error-weak'\n\t| 'neutral-active'\n\t| 'neutral-disabled'\n\t| 'neutral-strong'\n\t| 'neutral-strong-active'\n\t| 'neutral-strong-disabled'\n\t| 'neutral-weak-disabled'\n\t| 'brand'\n\t| 'brand-active'\n\t| 'brand-strong'\n\t| 'brand-strong-active'\n\t| 'error-active'\n\t| 'error-strong'\n\t| 'error-strong-active';\n\n/**\n * Font family variants.\n */\nexport type FontFamily = 'heading' | 'body' | 'mono';\n\n/**\n * Font size scale.\n */\nexport type FontSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';\n\n/**\n * Font weight variants.\n */\nexport type FontWeight = 'regular' | 'medium';\n\n/**\n * Line height scale.\n */\nexport type LineHeight = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';\n"],
4
+ "sourcesContent": ["/*\n * This file is generated by the @wordpress/terrazzo-plugin-typescript-types plugin.\n * Do not edit this file directly.\n */\n\n/**\n * Size scale for padding tokens.\n */\nexport type PaddingSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';\n\n/**\n * Size scale for gap tokens.\n */\nexport type GapSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';\n\n/**\n * Size scale for border radius tokens.\n */\nexport type BorderRadiusSize = 'xs' | 'sm' | 'md' | 'lg';\n\n/**\n * Size scale for border width tokens.\n */\nexport type BorderWidthSize = 'xs' | 'sm' | 'md' | 'lg' | 'focus';\n\n/**\n * Target elements that tokens can be applied to.\n */\nexport type Target =\n\t| 'surface'\n\t| 'interactive'\n\t| 'track'\n\t| 'thumb'\n\t| 'content'\n\t| 'focus';\n\n/**\n * Background color variants for surface elements.\n */\nexport type SurfaceBackgroundColor =\n\t| 'neutral'\n\t| 'neutral-strong'\n\t| 'neutral-weak'\n\t| 'brand'\n\t| 'success'\n\t| 'success-weak'\n\t| 'info'\n\t| 'info-weak'\n\t| 'warning'\n\t| 'warning-weak'\n\t| 'caution'\n\t| 'caution-weak'\n\t| 'error'\n\t| 'error-weak';\n\n/**\n * Background color variants for interactive elements.\n */\nexport type InteractiveBackgroundColor =\n\t| 'neutral-strong'\n\t| 'neutral-weak'\n\t| 'brand-strong'\n\t| 'brand-weak'\n\t| 'error'\n\t| 'error-strong'\n\t| 'error-weak';\n\n/**\n * Foreground color variants for content text and icons.\n */\nexport type ContentForegroundColor =\n\t| 'neutral'\n\t| 'neutral-weak'\n\t| 'success'\n\t| 'success-weak'\n\t| 'info'\n\t| 'info-weak'\n\t| 'warning'\n\t| 'warning-weak'\n\t| 'caution'\n\t| 'caution-weak'\n\t| 'error'\n\t| 'error-weak';\n\n/**\n * Foreground color variants for interactive element text and icons.\n */\nexport type InteractiveForegroundColor =\n\t| 'neutral'\n\t| 'neutral-strong'\n\t| 'neutral-weak'\n\t| 'brand'\n\t| 'brand-strong'\n\t| 'error'\n\t| 'error-strong';\n\n/**\n * Stroke color variants for surface borders.\n */\nexport type SurfaceStrokeColor =\n\t| 'neutral'\n\t| 'neutral-weak'\n\t| 'neutral-strong'\n\t| 'brand'\n\t| 'brand-strong'\n\t| 'success'\n\t| 'success-strong'\n\t| 'info'\n\t| 'info-strong'\n\t| 'warning'\n\t| 'warning-strong'\n\t| 'error'\n\t| 'error-strong';\n\n/**\n * Stroke color variants for interactive element borders.\n */\nexport type InteractiveStrokeColor =\n\t| 'neutral'\n\t| 'neutral-strong'\n\t| 'brand'\n\t| 'error'\n\t| 'error-strong';\n\n/**\n * Foreground color variants for text elements.\n */\nexport type ForegroundColor =\n\t| 'neutral'\n\t| 'neutral-weak'\n\t| 'success'\n\t| 'success-weak'\n\t| 'info'\n\t| 'info-weak'\n\t| 'warning'\n\t| 'warning-weak'\n\t| 'caution'\n\t| 'caution-weak'\n\t| 'error'\n\t| 'error-weak'\n\t| 'neutral-active'\n\t| 'neutral-disabled'\n\t| 'neutral-strong'\n\t| 'neutral-strong-active'\n\t| 'neutral-strong-disabled'\n\t| 'neutral-weak-disabled'\n\t| 'brand'\n\t| 'brand-active'\n\t| 'brand-strong'\n\t| 'brand-strong-active'\n\t| 'error-active'\n\t| 'error-strong'\n\t| 'error-strong-active';\n\n/**\n * Font family variants.\n */\nexport type FontFamily = 'heading' | 'body' | 'mono';\n\n/**\n * Font size scale.\n */\nexport type FontSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';\n\n/**\n * Font weight variants.\n */\nexport type FontWeight = 'regular' | 'medium';\n\n/**\n * Line height scale.\n */\nexport type LineHeight = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;",
6
6
  "names": []
7
7
  }
package/build-module/prebuilt/js/design-tokens.mjs CHANGED
@@ -98,21 +98,24 @@ var design_tokens_default = [
98
98
  "--wpds-color-stroke-interactive-error-strong",
99
99
  "--wpds-color-stroke-focus-brand",
100
100
  "--wpds-dimension-base",
101
- "--wpds-dimension-padding-surface-2xs",
102
- "--wpds-dimension-padding-surface-xs",
103
- "--wpds-dimension-padding-surface-sm",
104
- "--wpds-dimension-padding-surface-md",
105
- "--wpds-dimension-padding-surface-lg",
106
- "--wpds-dimension-gap-2xs",
101
+ "--wpds-dimension-padding-xs",
102
+ "--wpds-dimension-padding-sm",
103
+ "--wpds-dimension-padding-md",
104
+ "--wpds-dimension-padding-lg",
105
+ "--wpds-dimension-padding-xl",
106
+ "--wpds-dimension-padding-2xl",
107
+ "--wpds-dimension-padding-3xl",
107
108
  "--wpds-dimension-gap-xs",
108
109
  "--wpds-dimension-gap-sm",
109
110
  "--wpds-dimension-gap-md",
110
111
  "--wpds-dimension-gap-lg",
111
112
  "--wpds-dimension-gap-xl",
112
- "--wpds-elevation-x-small",
113
- "--wpds-elevation-small",
114
- "--wpds-elevation-medium",
115
- "--wpds-elevation-large",
113
+ "--wpds-dimension-gap-2xl",
114
+ "--wpds-dimension-gap-3xl",
115
+ "--wpds-elevation-xs",
116
+ "--wpds-elevation-sm",
117
+ "--wpds-elevation-md",
118
+ "--wpds-elevation-lg",
116
119
  "--wpds-font-family-heading",
117
120
  "--wpds-font-family-body",
118
121
  "--wpds-font-family-mono",
package/build-module/prebuilt/js/design-tokens.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/prebuilt/js/design-tokens.mjs"],
4
- "sourcesContent": ["/*\n * This file is generated by the @wordpress/terrazzo-plugin-known-wpds-css-variables plugin.\n * Do not edit this file directly.\n */\n\nexport default [\n\t'--wpds-border-radius-xs',\n\t'--wpds-border-radius-sm',\n\t'--wpds-border-radius-md',\n\t'--wpds-border-radius-lg',\n\t'--wpds-border-width-xs',\n\t'--wpds-border-width-sm',\n\t'--wpds-border-width-md',\n\t'--wpds-border-width-lg',\n\t'--wpds-border-width-focus',\n\t'--wpds-color-bg-surface-neutral',\n\t'--wpds-color-bg-surface-neutral-strong',\n\t'--wpds-color-bg-surface-neutral-weak',\n\t'--wpds-color-bg-surface-brand',\n\t'--wpds-color-bg-surface-success',\n\t'--wpds-color-bg-surface-success-weak',\n\t'--wpds-color-bg-surface-info',\n\t'--wpds-color-bg-surface-info-weak',\n\t'--wpds-color-bg-surface-warning',\n\t'--wpds-color-bg-surface-warning-weak',\n\t'--wpds-color-bg-surface-caution',\n\t'--wpds-color-bg-surface-caution-weak',\n\t'--wpds-color-bg-surface-error',\n\t'--wpds-color-bg-surface-error-weak',\n\t'--wpds-color-bg-interactive-neutral-strong',\n\t'--wpds-color-bg-interactive-neutral-strong-active',\n\t'--wpds-color-bg-interactive-neutral-strong-disabled',\n\t'--wpds-color-bg-interactive-neutral-weak',\n\t'--wpds-color-bg-interactive-neutral-weak-active',\n\t'--wpds-color-bg-interactive-neutral-weak-disabled',\n\t'--wpds-color-bg-interactive-brand-strong',\n\t'--wpds-color-bg-interactive-brand-strong-active',\n\t'--wpds-color-bg-interactive-brand-weak',\n\t'--wpds-color-bg-interactive-brand-weak-active',\n\t'--wpds-color-bg-interactive-error',\n\t'--wpds-color-bg-interactive-error-active',\n\t'--wpds-color-bg-interactive-error-strong',\n\t'--wpds-color-bg-interactive-error-strong-active',\n\t'--wpds-color-bg-interactive-error-weak',\n\t'--wpds-color-bg-interactive-error-weak-active',\n\t'--wpds-color-bg-track-neutral-weak',\n\t'--wpds-color-bg-track-neutral',\n\t'--wpds-color-bg-thumb-neutral-weak',\n\t'--wpds-color-bg-thumb-neutral-weak-active',\n\t'--wpds-color-bg-thumb-brand',\n\t'--wpds-color-bg-thumb-brand-active',\n\t'--wpds-color-bg-thumb-neutral-disabled',\n\t'--wpds-color-fg-content-neutral',\n\t'--wpds-color-fg-content-neutral-weak',\n\t'--wpds-color-fg-content-success',\n\t'--wpds-color-fg-content-success-weak',\n\t'--wpds-color-fg-content-info',\n\t'--wpds-color-fg-content-info-weak',\n\t'--wpds-color-fg-content-warning',\n\t'--wpds-color-fg-content-warning-weak',\n\t'--wpds-color-fg-content-caution',\n\t'--wpds-color-fg-content-caution-weak',\n\t'--wpds-color-fg-content-error',\n\t'--wpds-color-fg-content-error-weak',\n\t'--wpds-color-fg-interactive-neutral',\n\t'--wpds-color-fg-interactive-neutral-active',\n\t'--wpds-color-fg-interactive-neutral-disabled',\n\t'--wpds-color-fg-interactive-neutral-strong',\n\t'--wpds-color-fg-interactive-neutral-strong-active',\n\t'--wpds-color-fg-interactive-neutral-strong-disabled',\n\t'--wpds-color-fg-interactive-neutral-weak',\n\t'--wpds-color-fg-interactive-neutral-weak-disabled',\n\t'--wpds-color-fg-interactive-brand',\n\t'--wpds-color-fg-interactive-brand-active',\n\t'--wpds-color-fg-interactive-brand-strong',\n\t'--wpds-color-fg-interactive-brand-strong-active',\n\t'--wpds-color-fg-interactive-error',\n\t'--wpds-color-fg-interactive-error-active',\n\t'--wpds-color-fg-interactive-error-strong',\n\t'--wpds-color-fg-interactive-error-strong-active',\n\t'--wpds-color-stroke-surface-neutral',\n\t'--wpds-color-stroke-surface-neutral-weak',\n\t'--wpds-color-stroke-surface-neutral-strong',\n\t'--wpds-color-stroke-surface-brand',\n\t'--wpds-color-stroke-surface-brand-strong',\n\t'--wpds-color-stroke-surface-success',\n\t'--wpds-color-stroke-surface-success-strong',\n\t'--wpds-color-stroke-surface-info',\n\t'--wpds-color-stroke-surface-info-strong',\n\t'--wpds-color-stroke-surface-warning',\n\t'--wpds-color-stroke-surface-warning-strong',\n\t'--wpds-color-stroke-surface-error',\n\t'--wpds-color-stroke-surface-error-strong',\n\t'--wpds-color-stroke-interactive-neutral',\n\t'--wpds-color-stroke-interactive-neutral-active',\n\t'--wpds-color-stroke-interactive-neutral-disabled',\n\t'--wpds-color-stroke-interactive-neutral-strong',\n\t'--wpds-color-stroke-interactive-brand',\n\t'--wpds-color-stroke-interactive-brand-active',\n\t'--wpds-color-stroke-interactive-error',\n\t'--wpds-color-stroke-interactive-error-active',\n\t'--wpds-color-stroke-interactive-error-strong',\n\t'--wpds-color-stroke-focus-brand',\n\t'--wpds-dimension-base',\n\t'--wpds-dimension-padding-surface-2xs',\n\t'--wpds-dimension-padding-surface-xs',\n\t'--wpds-dimension-padding-surface-sm',\n\t'--wpds-dimension-padding-surface-md',\n\t'--wpds-dimension-padding-surface-lg',\n\t'--wpds-dimension-gap-2xs',\n\t'--wpds-dimension-gap-xs',\n\t'--wpds-dimension-gap-sm',\n\t'--wpds-dimension-gap-md',\n\t'--wpds-dimension-gap-lg',\n\t'--wpds-dimension-gap-xl',\n\t'--wpds-elevation-x-small',\n\t'--wpds-elevation-small',\n\t'--wpds-elevation-medium',\n\t'--wpds-elevation-large',\n\t'--wpds-font-family-heading',\n\t'--wpds-font-family-body',\n\t'--wpds-font-family-mono',\n\t'--wpds-font-size-xs',\n\t'--wpds-font-size-sm',\n\t'--wpds-font-size-md',\n\t'--wpds-font-size-lg',\n\t'--wpds-font-size-xl',\n\t'--wpds-font-size-2xl',\n\t'--wpds-font-line-height-xs',\n\t'--wpds-font-line-height-sm',\n\t'--wpds-font-line-height-md',\n\t'--wpds-font-line-height-lg',\n\t'--wpds-font-line-height-xl',\n\t'--wpds-font-line-height-2xl',\n\t'--wpds-font-weight-regular',\n\t'--wpds-font-weight-medium',\n];\n"],
5
- "mappings": ";AAKA,IAAO,wBAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;",
4
+ "sourcesContent": ["/*\n * This file is generated by the @wordpress/terrazzo-plugin-known-wpds-css-variables plugin.\n * Do not edit this file directly.\n */\n\nexport default [\n\t'--wpds-border-radius-xs',\n\t'--wpds-border-radius-sm',\n\t'--wpds-border-radius-md',\n\t'--wpds-border-radius-lg',\n\t'--wpds-border-width-xs',\n\t'--wpds-border-width-sm',\n\t'--wpds-border-width-md',\n\t'--wpds-border-width-lg',\n\t'--wpds-border-width-focus',\n\t'--wpds-color-bg-surface-neutral',\n\t'--wpds-color-bg-surface-neutral-strong',\n\t'--wpds-color-bg-surface-neutral-weak',\n\t'--wpds-color-bg-surface-brand',\n\t'--wpds-color-bg-surface-success',\n\t'--wpds-color-bg-surface-success-weak',\n\t'--wpds-color-bg-surface-info',\n\t'--wpds-color-bg-surface-info-weak',\n\t'--wpds-color-bg-surface-warning',\n\t'--wpds-color-bg-surface-warning-weak',\n\t'--wpds-color-bg-surface-caution',\n\t'--wpds-color-bg-surface-caution-weak',\n\t'--wpds-color-bg-surface-error',\n\t'--wpds-color-bg-surface-error-weak',\n\t'--wpds-color-bg-interactive-neutral-strong',\n\t'--wpds-color-bg-interactive-neutral-strong-active',\n\t'--wpds-color-bg-interactive-neutral-strong-disabled',\n\t'--wpds-color-bg-interactive-neutral-weak',\n\t'--wpds-color-bg-interactive-neutral-weak-active',\n\t'--wpds-color-bg-interactive-neutral-weak-disabled',\n\t'--wpds-color-bg-interactive-brand-strong',\n\t'--wpds-color-bg-interactive-brand-strong-active',\n\t'--wpds-color-bg-interactive-brand-weak',\n\t'--wpds-color-bg-interactive-brand-weak-active',\n\t'--wpds-color-bg-interactive-error',\n\t'--wpds-color-bg-interactive-error-active',\n\t'--wpds-color-bg-interactive-error-strong',\n\t'--wpds-color-bg-interactive-error-strong-active',\n\t'--wpds-color-bg-interactive-error-weak',\n\t'--wpds-color-bg-interactive-error-weak-active',\n\t'--wpds-color-bg-track-neutral-weak',\n\t'--wpds-color-bg-track-neutral',\n\t'--wpds-color-bg-thumb-neutral-weak',\n\t'--wpds-color-bg-thumb-neutral-weak-active',\n\t'--wpds-color-bg-thumb-brand',\n\t'--wpds-color-bg-thumb-brand-active',\n\t'--wpds-color-bg-thumb-neutral-disabled',\n\t'--wpds-color-fg-content-neutral',\n\t'--wpds-color-fg-content-neutral-weak',\n\t'--wpds-color-fg-content-success',\n\t'--wpds-color-fg-content-success-weak',\n\t'--wpds-color-fg-content-info',\n\t'--wpds-color-fg-content-info-weak',\n\t'--wpds-color-fg-content-warning',\n\t'--wpds-color-fg-content-warning-weak',\n\t'--wpds-color-fg-content-caution',\n\t'--wpds-color-fg-content-caution-weak',\n\t'--wpds-color-fg-content-error',\n\t'--wpds-color-fg-content-error-weak',\n\t'--wpds-color-fg-interactive-neutral',\n\t'--wpds-color-fg-interactive-neutral-active',\n\t'--wpds-color-fg-interactive-neutral-disabled',\n\t'--wpds-color-fg-interactive-neutral-strong',\n\t'--wpds-color-fg-interactive-neutral-strong-active',\n\t'--wpds-color-fg-interactive-neutral-strong-disabled',\n\t'--wpds-color-fg-interactive-neutral-weak',\n\t'--wpds-color-fg-interactive-neutral-weak-disabled',\n\t'--wpds-color-fg-interactive-brand',\n\t'--wpds-color-fg-interactive-brand-active',\n\t'--wpds-color-fg-interactive-brand-strong',\n\t'--wpds-color-fg-interactive-brand-strong-active',\n\t'--wpds-color-fg-interactive-error',\n\t'--wpds-color-fg-interactive-error-active',\n\t'--wpds-color-fg-interactive-error-strong',\n\t'--wpds-color-fg-interactive-error-strong-active',\n\t'--wpds-color-stroke-surface-neutral',\n\t'--wpds-color-stroke-surface-neutral-weak',\n\t'--wpds-color-stroke-surface-neutral-strong',\n\t'--wpds-color-stroke-surface-brand',\n\t'--wpds-color-stroke-surface-brand-strong',\n\t'--wpds-color-stroke-surface-success',\n\t'--wpds-color-stroke-surface-success-strong',\n\t'--wpds-color-stroke-surface-info',\n\t'--wpds-color-stroke-surface-info-strong',\n\t'--wpds-color-stroke-surface-warning',\n\t'--wpds-color-stroke-surface-warning-strong',\n\t'--wpds-color-stroke-surface-error',\n\t'--wpds-color-stroke-surface-error-strong',\n\t'--wpds-color-stroke-interactive-neutral',\n\t'--wpds-color-stroke-interactive-neutral-active',\n\t'--wpds-color-stroke-interactive-neutral-disabled',\n\t'--wpds-color-stroke-interactive-neutral-strong',\n\t'--wpds-color-stroke-interactive-brand',\n\t'--wpds-color-stroke-interactive-brand-active',\n\t'--wpds-color-stroke-interactive-error',\n\t'--wpds-color-stroke-interactive-error-active',\n\t'--wpds-color-stroke-interactive-error-strong',\n\t'--wpds-color-stroke-focus-brand',\n\t'--wpds-dimension-base',\n\t'--wpds-dimension-padding-xs',\n\t'--wpds-dimension-padding-sm',\n\t'--wpds-dimension-padding-md',\n\t'--wpds-dimension-padding-lg',\n\t'--wpds-dimension-padding-xl',\n\t'--wpds-dimension-padding-2xl',\n\t'--wpds-dimension-padding-3xl',\n\t'--wpds-dimension-gap-xs',\n\t'--wpds-dimension-gap-sm',\n\t'--wpds-dimension-gap-md',\n\t'--wpds-dimension-gap-lg',\n\t'--wpds-dimension-gap-xl',\n\t'--wpds-dimension-gap-2xl',\n\t'--wpds-dimension-gap-3xl',\n\t'--wpds-elevation-xs',\n\t'--wpds-elevation-sm',\n\t'--wpds-elevation-md',\n\t'--wpds-elevation-lg',\n\t'--wpds-font-family-heading',\n\t'--wpds-font-family-body',\n\t'--wpds-font-family-mono',\n\t'--wpds-font-size-xs',\n\t'--wpds-font-size-sm',\n\t'--wpds-font-size-md',\n\t'--wpds-font-size-lg',\n\t'--wpds-font-size-xl',\n\t'--wpds-font-size-2xl',\n\t'--wpds-font-line-height-xs',\n\t'--wpds-font-line-height-sm',\n\t'--wpds-font-line-height-md',\n\t'--wpds-font-line-height-lg',\n\t'--wpds-font-line-height-xl',\n\t'--wpds-font-line-height-2xl',\n\t'--wpds-font-weight-regular',\n\t'--wpds-font-weight-medium',\n];\n"],
5
+ "mappings": ";AAKA,IAAO,wBAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;",
6
6
  "names": []
7
7
  }
package/build-types/prebuilt/ts/token-types.d.ts CHANGED
@@ -1,11 +1,11 @@
1
1
  /**
2
2
  * Size scale for padding tokens.
3
3
  */
4
- export type PaddingSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg';
4
+ export type PaddingSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
5
5
  /**
6
6
  * Size scale for gap tokens.
7
7
  */
8
- export type GapSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
8
+ export type GapSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
9
9
  /**
10
10
  * Size scale for border radius tokens.
11
11
  */
package/build-types/prebuilt/ts/token-types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"token-types.d.ts","sourceRoot":"","sources":["../../../src/prebuilt/ts/token-types.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5D;;GAEG;AACH,MAAM,MAAM,OAAO,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE/D;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzD;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,OAAO,CAAC;AAElE;;GAEG;AACH,MAAM,MAAM,MAAM,GACf,SAAS,GACT,aAAa,GACb,OAAO,GACP,OAAO,GACP,SAAS,GACT,OAAO,CAAC;AAEX;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAC/B,SAAS,GACT,gBAAgB,GAChB,cAAc,GACd,OAAO,GACP,SAAS,GACT,cAAc,GACd,MAAM,GACN,WAAW,GACX,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,OAAO,GACP,YAAY,CAAC;AAEhB;;GAEG;AACH,MAAM,MAAM,0BAA0B,GACnC,gBAAgB,GAChB,cAAc,GACd,cAAc,GACd,YAAY,GACZ,OAAO,GACP,cAAc,GACd,YAAY,CAAC;AAEhB;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAC/B,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,MAAM,GACN,WAAW,GACX,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,OAAO,GACP,YAAY,CAAC;AAEhB;;GAEG;AACH,MAAM,MAAM,0BAA0B,GACnC,SAAS,GACT,gBAAgB,GAChB,cAAc,GACd,OAAO,GACP,cAAc,GACd,OAAO,GACP,cAAc,CAAC;AAElB;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAC3B,SAAS,GACT,cAAc,GACd,gBAAgB,GAChB,OAAO,GACP,cAAc,GACd,SAAS,GACT,gBAAgB,GAChB,MAAM,GACN,aAAa,GACb,SAAS,GACT,gBAAgB,GAChB,OAAO,GACP,cAAc,CAAC;AAElB;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAC/B,SAAS,GACT,gBAAgB,GAChB,OAAO,GACP,OAAO,GACP,cAAc,CAAC;AAElB;;GAEG;AACH,MAAM,MAAM,eAAe,GACxB,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,MAAM,GACN,WAAW,GACX,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,OAAO,GACP,YAAY,GACZ,gBAAgB,GAChB,kBAAkB,GAClB,gBAAgB,GAChB,uBAAuB,GACvB,yBAAyB,GACzB,uBAAuB,GACvB,OAAO,GACP,cAAc,GACd,cAAc,GACd,qBAAqB,GACrB,cAAc,GACd,cAAc,GACd,qBAAqB,CAAC;AAEzB;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAErD;;GAEG;AACH,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AAEhE;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE9C;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC"}
1
+ {"version":3,"file":"token-types.d.ts","sourceRoot":"","sources":["../../../src/prebuilt/ts/token-types.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,CAAC;AAE3E;;GAEG;AACH,MAAM,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,CAAC;AAEvE;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzD;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,OAAO,CAAC;AAElE;;GAEG;AACH,MAAM,MAAM,MAAM,GACf,SAAS,GACT,aAAa,GACb,OAAO,GACP,OAAO,GACP,SAAS,GACT,OAAO,CAAC;AAEX;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAC/B,SAAS,GACT,gBAAgB,GAChB,cAAc,GACd,OAAO,GACP,SAAS,GACT,cAAc,GACd,MAAM,GACN,WAAW,GACX,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,OAAO,GACP,YAAY,CAAC;AAEhB;;GAEG;AACH,MAAM,MAAM,0BAA0B,GACnC,gBAAgB,GAChB,cAAc,GACd,cAAc,GACd,YAAY,GACZ,OAAO,GACP,cAAc,GACd,YAAY,CAAC;AAEhB;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAC/B,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,MAAM,GACN,WAAW,GACX,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,OAAO,GACP,YAAY,CAAC;AAEhB;;GAEG;AACH,MAAM,MAAM,0BAA0B,GACnC,SAAS,GACT,gBAAgB,GAChB,cAAc,GACd,OAAO,GACP,cAAc,GACd,OAAO,GACP,cAAc,CAAC;AAElB;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAC3B,SAAS,GACT,cAAc,GACd,gBAAgB,GAChB,OAAO,GACP,cAAc,GACd,SAAS,GACT,gBAAgB,GAChB,MAAM,GACN,aAAa,GACb,SAAS,GACT,gBAAgB,GAChB,OAAO,GACP,cAAc,CAAC;AAElB;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAC/B,SAAS,GACT,gBAAgB,GAChB,OAAO,GACP,OAAO,GACP,cAAc,CAAC;AAElB;;GAEG;AACH,MAAM,MAAM,eAAe,GACxB,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,MAAM,GACN,WAAW,GACX,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,OAAO,GACP,YAAY,GACZ,gBAAgB,GAChB,kBAAkB,GAClB,gBAAgB,GAChB,uBAAuB,GACvB,yBAAyB,GACzB,uBAAuB,GACvB,OAAO,GACP,cAAc,GACd,cAAc,GACd,qBAAqB,GACrB,cAAc,GACd,cAAc,GACd,qBAAqB,CAAC;AAEzB;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAErD;;GAEG;AACH,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AAEhE;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE9C;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC"}
package/build-types/stories/index.story.d.ts CHANGED
@@ -6,7 +6,6 @@ import type { Meta, StoryObj } from '@storybook/react-vite';
6
6
  * Internal dependencies
7
7
  */
8
8
  import { ThemeProvider } from '../theme-provider';
9
- import '../prebuilt/css/design-tokens.css';
10
9
  declare const meta: Meta<typeof ThemeProvider>;
11
10
  export default meta;
12
11
  export declare const Default: StoryObj<typeof ThemeProvider>;
package/build-types/stories/index.story.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../src/stories/index.story.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAa5D;;GAEG;AACH,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,mCAAmC,CAAC;AAE3C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,aAAa,CAgBrC,CAAC;AACF,eAAe,IAAI,CAAC;AA2GpB,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAE,OAAO,aAAa,CAInD,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,QAAQ,CAAE,OAAO,aAAa,CA+CtD,CAAC;AA6CF,eAAO,MAAM,oBAAoB,EAAE,QAAQ,CAAE,OAAO,aAAa,CA8DhE,CAAC;AA0EF,eAAO,MAAM,aAAa,EAAE,QAAQ,CAAE,OAAO,aAAa,CA6CzD,CAAC"}
1
+ {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../src/stories/index.story.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAa5D;;GAEG;AACH,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,aAAa,CAgBrC,CAAC;AACF,eAAe,IAAI,CAAC;AA2GpB,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAE,OAAO,aAAa,CAInD,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,QAAQ,CAAE,OAAO,aAAa,CA+CtD,CAAC;AA6CF,eAAO,MAAM,oBAAoB,EAAE,QAAQ,CAAE,OAAO,aAAa,CA8DhE,CAAC;AA0EF,eAAO,MAAM,aAAa,EAAE,QAAQ,CAAE,OAAO,aAAa,CA6CzD,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/theme",
3
- "version": "0.6.0",
3
+ "version": "0.7.0",
4
4
  "description": "Theme and context provider for the WordPress Design System.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -64,8 +64,8 @@
64
64
  "build-module/color-ramps/lib/register-color-spaces.mjs"
65
65
  ],
66
66
  "dependencies": {
67
- "@wordpress/element": "^6.39.0",
68
- "@wordpress/private-apis": "^1.39.0",
67
+ "@wordpress/element": "^6.40.0",
68
+ "@wordpress/private-apis": "^1.40.0",
69
69
  "colorjs.io": "^0.6.0",
70
70
  "memize": "^2.1.0"
71
71
  },
@@ -74,7 +74,7 @@
74
74
  "@terrazzo/cli": "^0.10.2",
75
75
  "@terrazzo/plugin-css": "^0.10.2",
76
76
  "@terrazzo/token-tools": "^0.10.2",
77
- "@testing-library/jest-dom": "^6.6.3",
77
+ "@testing-library/jest-dom": "^6.9.1",
78
78
  "@types/jest": "^29.5.14",
79
79
  "@types/node": "^20.17.10",
80
80
  "esbuild": "^0.27.2",
@@ -101,5 +101,5 @@
101
101
  "build": "npm run build:tokens && npm run build:default-ramps && npm run prelint:js",
102
102
  "postbuild": "prettier --write tokens/color.json tokens/modes src/prebuilt src/color-ramps/lib/default-ramps.ts docs"
103
103
  },
104
- "gitHead": "eee1cfb1472f11183e40fb77465a5f13145df7ad"
104
+ "gitHead": "376124aa10dbc2cc0c81c964ec00b99fcfee5382"
105
105
  }
package/src/prebuilt/css/design-tokens.css CHANGED
@@ -101,24 +101,27 @@
101
101
  --wpds-color-stroke-surface-warning: #d0b381; /* Decorative stroke color used to define warning-toned surface boundaries with normal emphasis. */
102
102
  --wpds-color-stroke-surface-warning-strong: #926300; /* Decorative stroke color used to define warning-toned surface boundaries with strong emphasis. */
103
103
  --wpds-dimension-base: 4px; /* Base dimension unit */
104
- --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
105
- --wpds-dimension-gap-lg: 24px; /* Large gap */
106
- --wpds-dimension-gap-md: 16px; /* Medium gap */
107
- --wpds-dimension-gap-sm: 12px; /* Small gap */
108
- --wpds-dimension-gap-xl: 40px; /* Extra large gap */
109
- --wpds-dimension-gap-xs: 8px; /* Extra small gap */
110
- --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
111
- --wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
112
- --wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
113
- --wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
114
- --wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
115
- --wpds-elevation-large: 0 5px 15px 0 #00000014, 0 15px 27px 0 #00000012,
104
+ --wpds-dimension-gap-2xl: 32px; /* 2x extra large gap */
105
+ --wpds-dimension-gap-3xl: 40px; /* 3x extra large gap */
106
+ --wpds-dimension-gap-lg: 16px; /* Large gap */
107
+ --wpds-dimension-gap-md: 12px; /* Medium gap */
108
+ --wpds-dimension-gap-sm: 8px; /* Small gap */
109
+ --wpds-dimension-gap-xl: 24px; /* Extra large gap */
110
+ --wpds-dimension-gap-xs: 4px; /* Extra small gap */
111
+ --wpds-dimension-padding-2xl: 24px; /* 2x extra large padding */
112
+ --wpds-dimension-padding-3xl: 32px; /* 3x extra large padding */
113
+ --wpds-dimension-padding-lg: 16px; /* Large padding */
114
+ --wpds-dimension-padding-md: 12px; /* Medium padding */
115
+ --wpds-dimension-padding-sm: 8px; /* Small padding */
116
+ --wpds-dimension-padding-xl: 20px; /* Extra large padding */
117
+ --wpds-dimension-padding-xs: 4px; /* Extra small padding */
118
+ --wpds-elevation-lg: 0 5px 15px 0 #00000014, 0 15px 27px 0 #00000012,
116
119
  0 30px 36px 0 #0000000a, 0 50px 43px 0 #00000005; /* For components that confirm decisions or handle necessary interruptions. Example: Modals. */
117
- --wpds-elevation-medium: 0 2px 3px 0 #0000000d, 0 4px 5px 0 #0000000a,
120
+ --wpds-elevation-md: 0 2px 3px 0 #0000000d, 0 4px 5px 0 #0000000a,
118
121
  0 12px 12px 0 #00000008, 0 16px 16px 0 #00000005; /* For components that offer additional actions. Example: Menus, Command Palette */
119
- --wpds-elevation-small: 0 1px 2px 0 #0000000d, 0 2px 3px 0 #0000000a,
122
+ --wpds-elevation-sm: 0 1px 2px 0 #0000000d, 0 2px 3px 0 #0000000a,
120
123
  0 6px 6px 0 #00000008, 0 8px 8px 0 #00000005; /* For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar. */
121
- --wpds-elevation-x-small: 0 1px 1px 0 #00000008, 0 1px 2px 0 #00000005,
124
+ --wpds-elevation-xs: 0 1px 1px 0 #00000008, 0 1px 2px 0 #00000005,
122
125
  0 3px 3px 0 #00000005, 0 4px 4px 0 #00000003; /* For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame. */
123
126
  --wpds-font-family-body: -apple-system, system-ui, 'Segoe UI', 'Roboto',
124
127
  'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif; /* Body font family */
@@ -141,47 +144,56 @@
141
144
  --wpds-font-weight-regular: 400; /* Regular font weight for body text */
142
145
  }
143
146
 
144
- [data-wpds-theme-provider-id][data-wpds-density='default'] {
145
- --wpds-dimension-base: 4px; /* Base dimension unit */
146
- --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
147
- --wpds-dimension-gap-lg: 24px; /* Large gap */
147
+ [data-wpds-theme-provider-id][data-wpds-density='compact'] {
148
+ --wpds-dimension-gap-2xl: 24px; /* 2x extra large gap */
149
+ --wpds-dimension-gap-3xl: 32px; /* 3x extra large gap */
150
+ --wpds-dimension-gap-lg: 12px; /* Large gap */
151
+ --wpds-dimension-gap-md: 8px; /* Medium gap */
152
+ --wpds-dimension-gap-sm: 4px; /* Small gap */
153
+ --wpds-dimension-gap-xl: 20px; /* Extra large gap */
154
+ --wpds-dimension-gap-xs: 4px; /* Extra small gap */
155
+ --wpds-dimension-padding-2xl: 20px; /* 2x extra large padding */
156
+ --wpds-dimension-padding-3xl: 24px; /* 3x extra large padding */
157
+ --wpds-dimension-padding-lg: 12px; /* Large padding */
158
+ --wpds-dimension-padding-md: 8px; /* Medium padding */
159
+ --wpds-dimension-padding-sm: 4px; /* Small padding */
160
+ --wpds-dimension-padding-xl: 16px; /* Extra large padding */
161
+ --wpds-dimension-padding-xs: 4px; /* Extra small padding */
162
+ }
163
+
164
+ [data-wpds-theme-provider-id][data-wpds-density='comfortable'] {
165
+ --wpds-dimension-gap-2xl: 40px; /* 2x extra large gap */
166
+ --wpds-dimension-gap-3xl: 48px; /* 3x extra large gap */
167
+ --wpds-dimension-gap-lg: 20px; /* Large gap */
148
168
  --wpds-dimension-gap-md: 16px; /* Medium gap */
149
169
  --wpds-dimension-gap-sm: 12px; /* Small gap */
150
- --wpds-dimension-gap-xl: 40px; /* Extra large gap */
170
+ --wpds-dimension-gap-xl: 32px; /* Extra large gap */
151
171
  --wpds-dimension-gap-xs: 8px; /* Extra small gap */
152
- --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
153
- --wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
154
- --wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
155
- --wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
156
- --wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
172
+ --wpds-dimension-padding-2xl: 32px; /* 2x extra large padding */
173
+ --wpds-dimension-padding-3xl: 40px; /* 3x extra large padding */
174
+ --wpds-dimension-padding-lg: 20px; /* Large padding */
175
+ --wpds-dimension-padding-md: 16px; /* Medium padding */
176
+ --wpds-dimension-padding-sm: 12px; /* Small padding */
177
+ --wpds-dimension-padding-xl: 24px; /* Extra large padding */
178
+ --wpds-dimension-padding-xs: 8px; /* Extra small padding */
157
179
  }
158
180
 
159
- [data-wpds-theme-provider-id][data-wpds-density='compact'] {
160
- --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
161
- --wpds-dimension-gap-lg: 20px; /* Large gap */
181
+ [data-wpds-theme-provider-id][data-wpds-density='default'] {
182
+ --wpds-dimension-base: 4px; /* Base dimension unit */
183
+ --wpds-dimension-gap-2xl: 32px; /* 2x extra large gap */
184
+ --wpds-dimension-gap-3xl: 40px; /* 3x extra large gap */
185
+ --wpds-dimension-gap-lg: 16px; /* Large gap */
162
186
  --wpds-dimension-gap-md: 12px; /* Medium gap */
163
187
  --wpds-dimension-gap-sm: 8px; /* Small gap */
164
- --wpds-dimension-gap-xl: 32px; /* Extra large gap */
188
+ --wpds-dimension-gap-xl: 24px; /* Extra large gap */
165
189
  --wpds-dimension-gap-xs: 4px; /* Extra small gap */
166
- --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
167
- --wpds-dimension-padding-surface-lg: 24px; /* Large spacing for surfaces */
168
- --wpds-dimension-padding-surface-md: 20px; /* Medium spacing for surfaces */
169
- --wpds-dimension-padding-surface-sm: 12px; /* Small spacing for surfaces */
170
- --wpds-dimension-padding-surface-xs: 4px; /* Extra small spacing for surfaces */
171
- }
172
-
173
- [data-wpds-theme-provider-id][data-wpds-density='comfortable'] {
174
- --wpds-dimension-gap-2xs: 8px; /* 2x extra small gap */
175
- --wpds-dimension-gap-lg: 32px; /* Large gap */
176
- --wpds-dimension-gap-md: 20px; /* Medium gap */
177
- --wpds-dimension-gap-sm: 16px; /* Small gap */
178
- --wpds-dimension-gap-xl: 48px; /* Extra large gap */
179
- --wpds-dimension-gap-xs: 12px; /* Extra small gap */
180
- --wpds-dimension-padding-surface-2xs: 8px; /* 2x extra small spacing for surfaces */
181
- --wpds-dimension-padding-surface-lg: 40px; /* Large spacing for surfaces */
182
- --wpds-dimension-padding-surface-md: 32px; /* Medium spacing for surfaces */
183
- --wpds-dimension-padding-surface-sm: 20px; /* Small spacing for surfaces */
184
- --wpds-dimension-padding-surface-xs: 12px; /* Extra small spacing for surfaces */
190
+ --wpds-dimension-padding-2xl: 24px; /* 2x extra large padding */
191
+ --wpds-dimension-padding-3xl: 32px; /* 3x extra large padding */
192
+ --wpds-dimension-padding-lg: 16px; /* Large padding */
193
+ --wpds-dimension-padding-md: 12px; /* Medium padding */
194
+ --wpds-dimension-padding-sm: 8px; /* Small padding */
195
+ --wpds-dimension-padding-xl: 20px; /* Extra large padding */
196
+ --wpds-dimension-padding-xs: 4px; /* Extra small padding */
185
197
  }
186
198
 
187
199
  @media ( -webkit-min-device-pixel-ratio: 2 ), ( min-resolution: 192dpi ) {
package/src/prebuilt/js/design-tokens.mjs CHANGED
@@ -102,21 +102,24 @@ export default [
102
102
  '--wpds-color-stroke-interactive-error-strong',
103
103
  '--wpds-color-stroke-focus-brand',
104
104
  '--wpds-dimension-base',
105
- '--wpds-dimension-padding-surface-2xs',
106
- '--wpds-dimension-padding-surface-xs',
107
- '--wpds-dimension-padding-surface-sm',
108
- '--wpds-dimension-padding-surface-md',
109
- '--wpds-dimension-padding-surface-lg',
110
- '--wpds-dimension-gap-2xs',
105
+ '--wpds-dimension-padding-xs',
106
+ '--wpds-dimension-padding-sm',
107
+ '--wpds-dimension-padding-md',
108
+ '--wpds-dimension-padding-lg',
109
+ '--wpds-dimension-padding-xl',
110
+ '--wpds-dimension-padding-2xl',
111
+ '--wpds-dimension-padding-3xl',
111
112
  '--wpds-dimension-gap-xs',
112
113
  '--wpds-dimension-gap-sm',
113
114
  '--wpds-dimension-gap-md',
114
115
  '--wpds-dimension-gap-lg',
115
116
  '--wpds-dimension-gap-xl',
116
- '--wpds-elevation-x-small',
117
- '--wpds-elevation-small',
118
- '--wpds-elevation-medium',
119
- '--wpds-elevation-large',
117
+ '--wpds-dimension-gap-2xl',
118
+ '--wpds-dimension-gap-3xl',
119
+ '--wpds-elevation-xs',
120
+ '--wpds-elevation-sm',
121
+ '--wpds-elevation-md',
122
+ '--wpds-elevation-lg',
120
123
  '--wpds-font-family-heading',
121
124
  '--wpds-font-family-body',
122
125
  '--wpds-font-family-mono',
package/src/prebuilt/ts/token-types.ts CHANGED
@@ -6,12 +6,12 @@
6
6
  /**
7
7
  * Size scale for padding tokens.
8
8
  */
9
- export type PaddingSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg';
9
+ export type PaddingSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
10
10
 
11
11
  /**
12
12
  * Size scale for gap tokens.
13
13
  */
14
- export type GapSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
14
+ export type GapSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
15
15
 
16
16
  /**
17
17
  * Size scale for border radius tokens.
package/src/stories/index.story.tsx CHANGED
@@ -18,7 +18,6 @@ import {
18
18
  * Internal dependencies
19
19
  */
20
20
  import { ThemeProvider } from '../theme-provider';
21
- import '../prebuilt/css/design-tokens.css';
22
21
 
23
22
  const meta: Meta< typeof ThemeProvider > = {
24
23
  title: 'Design System/Theme/Theme Provider',
@@ -202,7 +201,7 @@ export const WithPicker: StoryObj< typeof ThemeProvider > = {
202
201
  const NestingDebug = ( { bg = '', primary = '', density = '' } ) => (
203
202
  <div
204
203
  style={ {
205
- padding: 'var(--wpds-dimension-padding-surface-sm)',
204
+ padding: 'var(--wpds-dimension-padding-lg)',
206
205
  color: 'var(--wpds-color-fg-content-neutral)',
207
206
  backgroundColor: 'var(--wpds-color-bg-surface-neutral)',
208
207
  display: 'flex',
@@ -217,7 +216,7 @@ const NestingDebug = ( { bg = '', primary = '', density = '' } ) => (
217
216
  <span
218
217
  style={ {
219
218
  display: 'inline-block',
220
- padding: 'var(--wpds-dimension-padding-surface-xs)',
219
+ padding: 'var(--wpds-dimension-padding-sm)',
221
220
  borderRadius: '0.25rem',
222
221
  backgroundColor:
223
222
  'var(--wpds-color-bg-interactive-brand-strong)',
@@ -230,7 +229,7 @@ const NestingDebug = ( { bg = '', primary = '', density = '' } ) => (
230
229
  style={ {
231
230
  display: 'inline-block',
232
231
  marginInlineStart: '0.25rem',
233
- padding: 'var(--wpds-dimension-padding-surface-xs)',
232
+ padding: 'var(--wpds-dimension-padding-sm)',
234
233
  borderRadius: '0.25rem',
235
234
  backgroundColor:
236
235
  'var(--wpds-color-bg-interactive-neutral-weak-disabled)',
@@ -411,7 +410,7 @@ export const AcrossIframes: StoryObj< typeof ThemeProvider > = {
411
410
  <span
412
411
  style={ {
413
412
  display: 'inline-block',
414
- padding: 'var(--wpds-dimension-padding-surface-xs)',
413
+ padding: 'var(--wpds-dimension-padding-sm)',
415
414
  borderRadius: '0.25rem',
416
415
  backgroundColor:
417
416
  'var(--wpds-color-bg-interactive-brand-strong)',
package/src/stylelint-plugins/test/fixtures/no-unknown-ds-tokens-valid.css CHANGED
@@ -3,7 +3,7 @@
3
3
  background-color: var(--wpds-color-bg-surface-neutral);
4
4
  color: var(--wpds-color-fg-content-neutral);
5
5
  border-radius: var(--wpds-border-radius-sm);
6
- padding: var(--wpds-dimension-padding-surface-md);
6
+ padding: var(--wpds-dimension-padding-2xl);
7
7
  }
8
8
 
9
9
  /* Valid: Using tokens with fallbacks */