@wordpress/theme 0.3.1-next.8b30e05b0.0 → 0.4.1-next.738bb1424.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 (125) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/README.md +114 -40
  3. package/build/color-ramps/{index.js → index.cjs} +8 -8
  4. package/build/color-ramps/lib/{color-utils.js → color-utils.cjs} +2 -2
  5. package/build/color-ramps/lib/{constants.js → constants.cjs} +2 -2
  6. package/build/color-ramps/lib/{default-ramps.js → default-ramps.cjs} +66 -66
  7. package/build/color-ramps/lib/{default-ramps.js.map → default-ramps.cjs.map} +1 -1
  8. package/build/color-ramps/lib/{find-color-with-constraints.js → find-color-with-constraints.cjs} +6 -6
  9. package/build/color-ramps/lib/find-color-with-constraints.cjs.map +7 -0
  10. package/build/color-ramps/lib/{index.js → index.cjs} +6 -6
  11. package/build/color-ramps/lib/index.cjs.map +7 -0
  12. package/build/color-ramps/lib/{ramp-configs.js → ramp-configs.cjs} +1 -1
  13. package/build/color-ramps/lib/{register-color-spaces.js → register-color-spaces.cjs} +1 -1
  14. package/build/color-ramps/lib/{taper-chroma.js → taper-chroma.cjs} +20 -46
  15. package/build/color-ramps/lib/taper-chroma.cjs.map +7 -0
  16. package/build/color-ramps/lib/{types.js → types.cjs} +1 -1
  17. package/build/color-ramps/lib/{utils.js → utils.cjs} +4 -4
  18. package/build/{context.js → context.cjs} +1 -1
  19. package/build/{index.js → index.cjs} +2 -2
  20. package/build/index.cjs.map +7 -0
  21. package/build/{lock-unlock.js → lock-unlock.cjs} +1 -1
  22. package/build/prebuilt/js/{design-tokens.js → design-tokens.cjs} +33 -7
  23. package/build/prebuilt/js/design-tokens.cjs.map +7 -0
  24. package/build/prebuilt/ts/{color-tokens.js → color-tokens.cjs} +36 -14
  25. package/build/prebuilt/ts/color-tokens.cjs.map +7 -0
  26. package/build/{token-id.js → prebuilt/ts/token-types.cjs} +4 -16
  27. package/build/prebuilt/ts/token-types.cjs.map +7 -0
  28. package/build/{private-apis.js → private-apis.cjs} +4 -4
  29. package/build/{theme-provider.js → theme-provider.cjs} +3 -3
  30. package/build/{types.js → types.cjs} +1 -1
  31. package/build/{use-theme-provider-styles.js → use-theme-provider-styles.cjs} +6 -6
  32. package/build-module/color-ramps/index.js +7 -7
  33. package/build-module/color-ramps/lib/color-utils.js +1 -1
  34. package/build-module/color-ramps/lib/constants.js +1 -1
  35. package/build-module/color-ramps/lib/default-ramps.js +65 -65
  36. package/build-module/color-ramps/lib/default-ramps.js.map +1 -1
  37. package/build-module/color-ramps/lib/find-color-with-constraints.js +5 -5
  38. package/build-module/color-ramps/lib/find-color-with-constraints.js.map +2 -2
  39. package/build-module/color-ramps/lib/index.js +5 -5
  40. package/build-module/color-ramps/lib/index.js.map +2 -2
  41. package/build-module/color-ramps/lib/taper-chroma.js +20 -47
  42. package/build-module/color-ramps/lib/taper-chroma.js.map +2 -2
  43. package/build-module/color-ramps/lib/utils.js +3 -3
  44. package/build-module/index.js +1 -1
  45. package/build-module/index.js.map +2 -2
  46. package/build-module/prebuilt/js/design-tokens.js +32 -6
  47. package/build-module/prebuilt/js/design-tokens.js.map +2 -2
  48. package/build-module/prebuilt/ts/color-tokens.js +35 -13
  49. package/build-module/prebuilt/ts/color-tokens.js.map +2 -2
  50. package/build-module/prebuilt/ts/token-types.js +1 -0
  51. package/build-module/private-apis.js +3 -3
  52. package/build-module/theme-provider.js +2 -2
  53. package/build-module/use-theme-provider-styles.js +4 -4
  54. package/build-types/color-ramps/lib/find-color-with-constraints.d.ts +3 -4
  55. package/build-types/color-ramps/lib/find-color-with-constraints.d.ts.map +1 -1
  56. package/build-types/color-ramps/lib/taper-chroma.d.ts +4 -4
  57. package/build-types/color-ramps/lib/taper-chroma.d.ts.map +1 -1
  58. package/build-types/index.d.ts +2 -0
  59. package/build-types/index.d.ts.map +1 -1
  60. package/build-types/prebuilt/ts/color-tokens.d.ts.map +1 -1
  61. package/build-types/prebuilt/ts/token-types.d.ts +49 -0
  62. package/build-types/prebuilt/ts/token-types.d.ts.map +1 -0
  63. package/package.json +15 -7
  64. package/src/color-ramps/lib/default-ramps.ts +65 -65
  65. package/src/color-ramps/lib/find-color-with-constraints.ts +11 -7
  66. package/src/color-ramps/lib/index.ts +4 -4
  67. package/src/color-ramps/lib/taper-chroma.ts +32 -63
  68. package/src/index.ts +2 -1
  69. package/src/prebuilt/css/design-tokens.css +72 -28
  70. package/src/prebuilt/js/design-tokens.js +32 -6
  71. package/src/prebuilt/ts/color-tokens.ts +31 -9
  72. package/src/prebuilt/ts/token-types.ts +125 -0
  73. package/bin/generate-default-ramps/index.ts +0 -49
  74. package/bin/generate-primitive-tokens/index.ts +0 -120
  75. package/bin/terrazzo-plugin-ds-tokens-docs/index.ts +0 -84
  76. package/bin/terrazzo-plugin-figma-ds-token-manager/index.ts +0 -217
  77. package/bin/terrazzo-plugin-figma-ds-token-manager/lib.ts +0 -1
  78. package/bin/terrazzo-plugin-inline-alias-values/index.ts +0 -113
  79. package/bin/terrazzo-plugin-known-wpds-css-variables/index.ts +0 -52
  80. package/build/color-ramps/lib/find-color-with-constraints.js.map +0 -7
  81. package/build/color-ramps/lib/index.js.map +0 -7
  82. package/build/color-ramps/lib/taper-chroma.js.map +0 -7
  83. package/build/index.js.map +0 -7
  84. package/build/prebuilt/js/design-tokens.js.map +0 -7
  85. package/build/prebuilt/json/figma.json +0 -715
  86. package/build/prebuilt/ts/color-tokens.js.map +0 -7
  87. package/build/token-id.js.map +0 -7
  88. package/build/types/css-modules.d.js +0 -1
  89. package/build/types/css-modules.d.js.map +0 -7
  90. package/build-module/prebuilt/json/figma.json +0 -715
  91. package/build-module/token-id.js +0 -6
  92. package/build-module/token-id.js.map +0 -7
  93. package/build-module/types/css-modules.d.js +0 -1
  94. package/build-types/token-id.d.ts +0 -9
  95. package/build-types/token-id.d.ts.map +0 -1
  96. package/docs/ds-tokens.md +0 -150
  97. package/src/prebuilt/json/figma.json +0 -715
  98. package/src/test/token-id.test.ts +0 -12
  99. package/src/token-id.ts +0 -9
  100. package/src/types/css-modules.d.ts +0 -4
  101. package/terrazzo.config.ts +0 -126
  102. package/tokens/border.json +0 -34
  103. package/tokens/color.json +0 -1029
  104. package/tokens/dimension.json +0 -109
  105. package/tokens/elevation.json +0 -201
  106. package/tokens/typography.json +0 -93
  107. package/tsconfig.bin.json +0 -13
  108. package/tsconfig.bin.tsbuildinfo +0 -1
  109. package/tsconfig.json +0 -11
  110. package/tsconfig.src.json +0 -9
  111. package/tsconfig.src.tsbuildinfo +0 -1
  112. /package/build/color-ramps/{index.js.map → index.cjs.map} +0 -0
  113. /package/build/color-ramps/lib/{color-utils.js.map → color-utils.cjs.map} +0 -0
  114. /package/build/color-ramps/lib/{constants.js.map → constants.cjs.map} +0 -0
  115. /package/build/color-ramps/lib/{ramp-configs.js.map → ramp-configs.cjs.map} +0 -0
  116. /package/build/color-ramps/lib/{register-color-spaces.js.map → register-color-spaces.cjs.map} +0 -0
  117. /package/build/color-ramps/lib/{types.js.map → types.cjs.map} +0 -0
  118. /package/build/color-ramps/lib/{utils.js.map → utils.cjs.map} +0 -0
  119. /package/build/{context.js.map → context.cjs.map} +0 -0
  120. /package/build/{lock-unlock.js.map → lock-unlock.cjs.map} +0 -0
  121. /package/build/{private-apis.js.map → private-apis.cjs.map} +0 -0
  122. /package/build/{theme-provider.js.map → theme-provider.cjs.map} +0 -0
  123. /package/build/{types.js.map → types.cjs.map} +0 -0
  124. /package/build/{use-theme-provider-styles.js.map → use-theme-provider-styles.cjs.map} +0 -0
  125. /package/build-module/{types/css-modules.d.js.map → prebuilt/ts/token-types.js.map} +0 -0
@@ -1,109 +0,0 @@
1
- {
2
- "dimension": {
3
- "$type": "dimension",
4
- "primitive": {
5
- "space": {
6
- "0": {
7
- "$value": { "value": 0, "unit": "px" },
8
- "$description": "Empty space"
9
- },
10
- "10": {
11
- "$value": { "value": 4, "unit": "px" },
12
- "$description": "1x base spacing"
13
- },
14
- "20": {
15
- "$value": { "value": 8, "unit": "px" },
16
- "$description": "2x base spacing"
17
- },
18
- "30": {
19
- "$value": { "value": 12, "unit": "px" },
20
- "$description": "3x base spacing"
21
- },
22
- "40": {
23
- "$value": { "value": 16, "unit": "px" },
24
- "$description": "4x base spacing"
25
- },
26
- "50": {
27
- "$value": { "value": 20, "unit": "px" },
28
- "$description": "5x base spacing"
29
- },
30
- "60": {
31
- "$value": { "value": 24, "unit": "px" },
32
- "$description": "6x base spacing"
33
- },
34
- "70": {
35
- "$value": { "value": 32, "unit": "px" },
36
- "$description": "8x base spacing"
37
- },
38
- "80": {
39
- "$value": { "value": 40, "unit": "px" },
40
- "$description": "10x base spacing"
41
- },
42
- "90": {
43
- "$value": { "value": 48, "unit": "px" },
44
- "$description": "12x base spacing"
45
- }
46
- }
47
- },
48
- "semantic": {
49
- "base": {
50
- "$value": "{dimension.primitive.space.10}",
51
- "$description": "Base dimension unit"
52
- },
53
- "padding": {
54
- "surface": {
55
- "2xs": {
56
- "$value": "{dimension.primitive.space.10}",
57
- "$description": "2x extra small spacing for surfaces",
58
- "$extensions": {
59
- "mode": {
60
- "compact": "{dimension.primitive.space.10}",
61
- "comfortable": "{dimension.primitive.space.20}"
62
- }
63
- }
64
- },
65
- "xs": {
66
- "$value": "{dimension.primitive.space.20}",
67
- "$description": "Extra small spacing for surfaces",
68
- "$extensions": {
69
- "mode": {
70
- "compact": "{dimension.primitive.space.10}",
71
- "comfortable": "{dimension.primitive.space.30}"
72
- }
73
- }
74
- },
75
- "sm": {
76
- "$value": "{dimension.primitive.space.40}",
77
- "$description": "Small spacing for surfaces",
78
- "$extensions": {
79
- "mode": {
80
- "compact": "{dimension.primitive.space.30}",
81
- "comfortable": "{dimension.primitive.space.50}"
82
- }
83
- }
84
- },
85
- "md": {
86
- "$value": "{dimension.primitive.space.60}",
87
- "$description": "Medium spacing for surfaces",
88
- "$extensions": {
89
- "mode": {
90
- "compact": "{dimension.primitive.space.50}",
91
- "comfortable": "{dimension.primitive.space.70}"
92
- }
93
- }
94
- },
95
- "lg": {
96
- "$value": "{dimension.primitive.space.70}",
97
- "$description": "Large spacing for surfaces",
98
- "$extensions": {
99
- "mode": {
100
- "compact": "{dimension.primitive.space.60}",
101
- "comfortable": "{dimension.primitive.space.80}"
102
- }
103
- }
104
- }
105
- }
106
- }
107
- }
108
- }
109
- }
@@ -1,201 +0,0 @@
1
- {
2
- "elevation": {
3
- "$type": "shadow",
4
- "x-small": {
5
- "$value": [
6
- {
7
- "color": {
8
- "colorSpace": "srgb",
9
- "components": [ 0, 0, 0 ],
10
- "alpha": 0.03
11
- },
12
- "offsetX": { "value": 0, "unit": "px" },
13
- "offsetY": { "value": 1, "unit": "px" },
14
- "blur": { "value": 1, "unit": "px" },
15
- "spread": { "value": 0, "unit": "px" }
16
- },
17
- {
18
- "color": {
19
- "colorSpace": "srgb",
20
- "components": [ 0, 0, 0 ],
21
- "alpha": 0.02
22
- },
23
- "offsetX": { "value": 0, "unit": "px" },
24
- "offsetY": { "value": 1, "unit": "px" },
25
- "blur": { "value": 2, "unit": "px" },
26
- "spread": { "value": 0, "unit": "px" }
27
- },
28
- {
29
- "color": {
30
- "colorSpace": "srgb",
31
- "components": [ 0, 0, 0 ],
32
- "alpha": 0.02
33
- },
34
- "offsetX": { "value": 0, "unit": "px" },
35
- "offsetY": { "value": 3, "unit": "px" },
36
- "blur": { "value": 3, "unit": "px" },
37
- "spread": { "value": 0, "unit": "px" }
38
- },
39
- {
40
- "color": {
41
- "colorSpace": "srgb",
42
- "components": [ 0, 0, 0 ],
43
- "alpha": 0.01
44
- },
45
- "offsetX": { "value": 0, "unit": "px" },
46
- "offsetY": { "value": 4, "unit": "px" },
47
- "blur": { "value": 4, "unit": "px" },
48
- "spread": { "value": 0, "unit": "px" }
49
- }
50
- ],
51
- "$description": "For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame."
52
- },
53
- "small": {
54
- "$value": [
55
- {
56
- "color": {
57
- "colorSpace": "srgb",
58
- "components": [ 0, 0, 0 ],
59
- "alpha": 0.05
60
- },
61
- "offsetX": { "value": 0, "unit": "px" },
62
- "offsetY": { "value": 1, "unit": "px" },
63
- "blur": { "value": 2, "unit": "px" },
64
- "spread": { "value": 0, "unit": "px" }
65
- },
66
- {
67
- "color": {
68
- "colorSpace": "srgb",
69
- "components": [ 0, 0, 0 ],
70
- "alpha": 0.04
71
- },
72
- "offsetX": { "value": 0, "unit": "px" },
73
- "offsetY": { "value": 2, "unit": "px" },
74
- "blur": { "value": 3, "unit": "px" },
75
- "spread": { "value": 0, "unit": "px" }
76
- },
77
- {
78
- "color": {
79
- "colorSpace": "srgb",
80
- "components": [ 0, 0, 0 ],
81
- "alpha": 0.03
82
- },
83
- "offsetX": { "value": 0, "unit": "px" },
84
- "offsetY": { "value": 6, "unit": "px" },
85
- "blur": { "value": 6, "unit": "px" },
86
- "spread": { "value": 0, "unit": "px" }
87
- },
88
- {
89
- "color": {
90
- "colorSpace": "srgb",
91
- "components": [ 0, 0, 0 ],
92
- "alpha": 0.02
93
- },
94
- "offsetX": { "value": 0, "unit": "px" },
95
- "offsetY": { "value": 8, "unit": "px" },
96
- "blur": { "value": 8, "unit": "px" },
97
- "spread": { "value": 0, "unit": "px" }
98
- }
99
- ],
100
- "$description": "For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar."
101
- },
102
- "medium": {
103
- "$value": [
104
- {
105
- "color": {
106
- "colorSpace": "srgb",
107
- "components": [ 0, 0, 0 ],
108
- "alpha": 0.05
109
- },
110
- "offsetX": { "value": 0, "unit": "px" },
111
- "offsetY": { "value": 2, "unit": "px" },
112
- "blur": { "value": 3, "unit": "px" },
113
- "spread": { "value": 0, "unit": "px" }
114
- },
115
- {
116
- "color": {
117
- "colorSpace": "srgb",
118
- "components": [ 0, 0, 0 ],
119
- "alpha": 0.04
120
- },
121
- "offsetX": { "value": 0, "unit": "px" },
122
- "offsetY": { "value": 4, "unit": "px" },
123
- "blur": { "value": 5, "unit": "px" },
124
- "spread": { "value": 0, "unit": "px" }
125
- },
126
- {
127
- "color": {
128
- "colorSpace": "srgb",
129
- "components": [ 0, 0, 0 ],
130
- "alpha": 0.03
131
- },
132
- "offsetX": { "value": 0, "unit": "px" },
133
- "offsetY": { "value": 12, "unit": "px" },
134
- "blur": { "value": 12, "unit": "px" },
135
- "spread": { "value": 0, "unit": "px" }
136
- },
137
- {
138
- "color": {
139
- "colorSpace": "srgb",
140
- "components": [ 0, 0, 0 ],
141
- "alpha": 0.02
142
- },
143
- "offsetX": { "value": 0, "unit": "px" },
144
- "offsetY": { "value": 16, "unit": "px" },
145
- "blur": { "value": 16, "unit": "px" },
146
- "spread": { "value": 0, "unit": "px" }
147
- }
148
- ],
149
- "$description": "For components that offer additional actions. Example: Menus, Command Palette"
150
- },
151
- "large": {
152
- "$value": [
153
- {
154
- "color": {
155
- "colorSpace": "srgb",
156
- "components": [ 0, 0, 0 ],
157
- "alpha": 0.08
158
- },
159
- "offsetX": { "value": 0, "unit": "px" },
160
- "offsetY": { "value": 5, "unit": "px" },
161
- "blur": { "value": 15, "unit": "px" },
162
- "spread": { "value": 0, "unit": "px" }
163
- },
164
- {
165
- "color": {
166
- "colorSpace": "srgb",
167
- "components": [ 0, 0, 0 ],
168
- "alpha": 0.07
169
- },
170
- "offsetX": { "value": 0, "unit": "px" },
171
- "offsetY": { "value": 15, "unit": "px" },
172
- "blur": { "value": 27, "unit": "px" },
173
- "spread": { "value": 0, "unit": "px" }
174
- },
175
- {
176
- "color": {
177
- "colorSpace": "srgb",
178
- "components": [ 0, 0, 0 ],
179
- "alpha": 0.04
180
- },
181
- "offsetX": { "value": 0, "unit": "px" },
182
- "offsetY": { "value": 30, "unit": "px" },
183
- "blur": { "value": 36, "unit": "px" },
184
- "spread": { "value": 0, "unit": "px" }
185
- },
186
- {
187
- "color": {
188
- "colorSpace": "srgb",
189
- "components": [ 0, 0, 0 ],
190
- "alpha": 0.02
191
- },
192
- "offsetX": { "value": 0, "unit": "px" },
193
- "offsetY": { "value": 50, "unit": "px" },
194
- "blur": { "value": 43, "unit": "px" },
195
- "spread": { "value": 0, "unit": "px" }
196
- }
197
- ],
198
- "$description": "For components that confirm decisions or handle necessary interruptions. Example: Modals."
199
- }
200
- }
201
- }
@@ -1,93 +0,0 @@
1
- {
2
- "font": {
3
- "family": {
4
- "$type": "fontFamily",
5
- "heading": {
6
- "$value": [
7
- "-apple-system",
8
- "system-ui",
9
- "Segoe UI",
10
- "Roboto",
11
- "Oxygen-Sans",
12
- "Ubuntu",
13
- "Cantarell",
14
- "Helvetica Neue",
15
- "sans-serif"
16
- ],
17
- "$description": "Headings font family"
18
- },
19
- "body": {
20
- "$value": [
21
- "-apple-system",
22
- "system-ui",
23
- "Segoe UI",
24
- "Roboto",
25
- "Oxygen-Sans",
26
- "Ubuntu",
27
- "Cantarell",
28
- "Helvetica Neue",
29
- "sans-serif"
30
- ],
31
- "$description": "Body font family"
32
- },
33
- "mono": {
34
- "$value": [ "Menlo", "Consolas", "monaco", "monospace" ],
35
- "$description": "Monospace font family"
36
- }
37
- },
38
- "size": {
39
- "$type": "dimension",
40
- "x-small": {
41
- "$value": { "value": 11, "unit": "px" },
42
- "$description": "Extra small font size"
43
- },
44
- "small": {
45
- "$value": { "value": 12, "unit": "px" },
46
- "$description": "Small font size"
47
- },
48
- "medium": {
49
- "$value": { "value": 13, "unit": "px" },
50
- "$description": "Medium font size"
51
- },
52
- "large": {
53
- "$value": { "value": 15, "unit": "px" },
54
- "$description": "Large font size"
55
- },
56
- "x-large": {
57
- "$value": { "value": 20, "unit": "px" },
58
- "$description": "Extra large font size"
59
- },
60
- "2x-large": {
61
- "$value": { "value": 32, "unit": "px" },
62
- "$description": "2X large font size"
63
- }
64
- },
65
- "lineHeight": {
66
- "$type": "dimension",
67
- "x-small": {
68
- "$value": { "value": 16, "unit": "px" },
69
- "$description": "Extra small line height"
70
- },
71
- "small": {
72
- "$value": { "value": 20, "unit": "px" },
73
- "$description": "Small line height"
74
- },
75
- "medium": {
76
- "$value": { "value": 24, "unit": "px" },
77
- "$description": "Medium line height"
78
- },
79
- "large": {
80
- "$value": { "value": 28, "unit": "px" },
81
- "$description": "Large line height"
82
- },
83
- "x-large": {
84
- "$value": { "value": 32, "unit": "px" },
85
- "$description": "Extra large line height"
86
- },
87
- "2x-large": {
88
- "$value": { "value": 40, "unit": "px" },
89
- "$description": "2X large line height"
90
- }
91
- }
92
- }
93
- }
package/tsconfig.bin.json DELETED
@@ -1,13 +0,0 @@
1
- {
2
- "$schema": "https://json.schemastore.org/tsconfig.json",
3
- "extends": "./tsconfig.src.json",
4
- "compilerOptions": {
5
- "composite": true,
6
- "rootDir": "bin",
7
- "noEmit": true,
8
- "allowImportingTsExtensions": true
9
- },
10
- "include": [ "bin" ],
11
- "exclude": [],
12
- "references": [ { "path": "./tsconfig.src.json" } ]
13
- }