@multiplatform.one/theme 6.7.0 → 7.0.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 (71) hide show
  1. package/package.json +17 -17
  2. package/src/dates.spec.ts +344 -1
  3. package/src/dates.ts +50 -3
  4. package/src/devWarn.ts +29 -1
  5. package/src/figma/figmaTokens.spec.ts +3 -3
  6. package/src/figma/figmaTokens.ts +6 -3
  7. package/src/keyboardFocusRing.ts +61 -5
  8. package/src/menuRow.spec.ts +2 -2
  9. package/src/menuRow.ts +5 -4
  10. package/src/theme/Surface.spec.tsx +146 -0
  11. package/src/theme/Surface.tsx +73 -0
  12. package/src/theme/createDefaultThemeConfig.spec.ts +152 -0
  13. package/src/theme/createDefaultThemeConfig.ts +47 -3
  14. package/src/theme/createThemes.ts +27 -4
  15. package/src/theme/devtools/ThemeDevtoolsPanel.tsx +6 -2
  16. package/src/theme/focusState.ts +9 -1
  17. package/src/theme/groupGeometry.spec.ts +108 -0
  18. package/src/theme/groupGeometry.ts +119 -0
  19. package/src/theme/index.ts +3 -0
  20. package/src/theme/intent.spec.tsx +17 -0
  21. package/src/theme/knobs.ts +2 -2
  22. package/src/theme/layoutTokens.spec.ts +14 -0
  23. package/src/theme/layoutTokens.ts +29 -0
  24. package/src/theme/recipeInputs.ts +368 -0
  25. package/src/theme/recipes.ts +34 -0
  26. package/src/theme/resolveKnobs.spec.ts +91 -9
  27. package/src/theme/resolveKnobs.ts +55 -5
  28. package/src/theme/shared.tsx +11 -0
  29. package/src/theme/sizeRecipes.spec.ts +296 -0
  30. package/src/theme/sizeRecipes.ts +198 -0
  31. package/src/theme/useResolvedKnobs.ts +76 -24
  32. package/src/theme/useResolvedKnobsBehavior.spec.tsx +11 -3
  33. package/types/dates.d.ts +36 -2
  34. package/types/dates.d.ts.map +1 -1
  35. package/types/devWarn.d.ts +16 -1
  36. package/types/devWarn.d.ts.map +1 -1
  37. package/types/figma/figmaTokens.d.ts +1 -1
  38. package/types/figma/figmaTokens.d.ts.map +1 -1
  39. package/types/keyboardFocusRing.d.ts +19 -4
  40. package/types/keyboardFocusRing.d.ts.map +1 -1
  41. package/types/menuRow.d.ts +5 -4
  42. package/types/menuRow.d.ts.map +1 -1
  43. package/types/theme/Surface.d.ts +37 -0
  44. package/types/theme/Surface.d.ts.map +1 -0
  45. package/types/theme/createDefaultThemeConfig.d.ts +14 -3
  46. package/types/theme/createDefaultThemeConfig.d.ts.map +1 -1
  47. package/types/theme/createThemes.d.ts.map +1 -1
  48. package/types/theme/devtools/ThemeDevtoolsPanel.d.ts.map +1 -1
  49. package/types/theme/focusState.d.ts +8 -0
  50. package/types/theme/focusState.d.ts.map +1 -1
  51. package/types/theme/groupGeometry.d.ts +69 -0
  52. package/types/theme/groupGeometry.d.ts.map +1 -0
  53. package/types/theme/index.d.ts +3 -0
  54. package/types/theme/index.d.ts.map +1 -1
  55. package/types/theme/knobs.d.ts +2 -2
  56. package/types/theme/knobs.d.ts.map +1 -1
  57. package/types/theme/layoutTokens.d.ts +22 -0
  58. package/types/theme/layoutTokens.d.ts.map +1 -1
  59. package/types/theme/recipeInputs.d.ts +110 -0
  60. package/types/theme/recipeInputs.d.ts.map +1 -0
  61. package/types/theme/recipes.d.ts +47 -0
  62. package/types/theme/recipes.d.ts.map +1 -1
  63. package/types/theme/resolveKnobs.d.ts +7 -3
  64. package/types/theme/resolveKnobs.d.ts.map +1 -1
  65. package/types/theme/shared.d.ts +9 -0
  66. package/types/theme/shared.d.ts.map +1 -1
  67. package/types/theme/sizeRecipes.d.ts +68 -0
  68. package/types/theme/sizeRecipes.d.ts.map +1 -0
  69. package/types/theme/useResolvedKnobs.d.ts +10 -6
  70. package/types/theme/useResolvedKnobs.d.ts.map +1 -1
  71. package/src/audit/baselines/home-pokemon.json +0 -355
package/src/audit/baselines/home-pokemon.json DELETED
@@ -1,355 +0,0 @@
1
- {
2
- "url": "http://localhost:3000/pokemon",
3
- "timestamp": "2026-03-25T05:33:41.560Z",
4
- "preset": "unknown",
5
- "scheme": "light",
6
- "summary": {
7
- "totalElements": 36,
8
- "auditedElements": 13,
9
- "totalViolations": 3,
10
- "byProperty": {
11
- "borderRadius": 1,
12
- "borderWidth": 0,
13
- "gap": 2,
14
- "padding": 1,
15
- "fontWeight": 0,
16
- "fontFamily": 0,
17
- "inlineColor": 1
18
- }
19
- },
20
- "violations": [
21
- {
22
- "label": "div",
23
- "tag": "div",
24
- "id": "",
25
- "classes": [],
26
- "violations": [
27
- "inlineColor: backgroundColor=\"rgba(60, 100, 200, 0.65)\" bypasses theme tokens"
28
- ],
29
- "inlineColor": {
30
- "value": "backgroundColor: rgba(60, 100, 200, 0.65)",
31
- "knob": "off-scale (hardcoded)",
32
- "offScale": true
33
- }
34
- },
35
- {
36
- "label": "button.is_Button.is_View._outlineColor-0focus-visible-outlineColo114[role=button]",
37
- "tag": "button",
38
- "id": "",
39
- "classes": [
40
- "is_Button",
41
- "is_View",
42
- "_outlineColor-0focus-visible-outlineColo114",
43
- "_outlineStyle-0focus-visible-solid",
44
- "_outlineWidth-0focus-visible-2px"
45
- ],
46
- "violations": [
47
- "borderRadius: 100000px is off-scale (no matching token)",
48
- "rowGap: 9px is off-scale (no matching token)"
49
- ],
50
- "borderRadius": {
51
- "value": 100000,
52
- "unit": "px",
53
- "knob": "off-scale",
54
- "offScale": true
55
- },
56
- "borderWidth": {
57
- "value": 1,
58
- "unit": "px",
59
- "knob": "medium",
60
- "offScale": false
61
- },
62
- "rowGap": {
63
- "value": 9,
64
- "unit": "px",
65
- "knob": "off-scale",
66
- "offScale": true
67
- }
68
- },
69
- {
70
- "label": "button.is_Button.is_View._outlineColor-0focus-visible-outlineColo114[role=button]",
71
- "tag": "button",
72
- "id": "",
73
- "classes": [
74
- "is_Button",
75
- "is_View",
76
- "_outlineColor-0focus-visible-outlineColo114",
77
- "_outlineStyle-0focus-visible-solid",
78
- "_outlineWidth-0focus-visible-2px"
79
- ],
80
- "violations": [
81
- "rowGap: 5px is off-scale (no matching token)",
82
- "paddingRight: 7px is off-scale (no matching token)",
83
- "paddingLeft: 7px is off-scale (no matching token)"
84
- ],
85
- "borderRadius": {
86
- "value": 5,
87
- "unit": "px",
88
- "knob": "small",
89
- "offScale": false
90
- },
91
- "borderWidth": {
92
- "value": 1,
93
- "unit": "px",
94
- "knob": "medium",
95
- "offScale": false
96
- },
97
- "rowGap": {
98
- "value": 5,
99
- "unit": "px",
100
- "knob": "off-scale",
101
- "offScale": true
102
- },
103
- "paddingRight": {
104
- "value": 7,
105
- "unit": "px",
106
- "knob": "off-scale",
107
- "offScale": true
108
- },
109
- "paddingLeft": {
110
- "value": 7,
111
- "unit": "px",
112
- "knob": "off-scale",
113
- "offScale": true
114
- }
115
- }
116
- ],
117
- "elements": [
118
- {
119
- "label": "div",
120
- "tag": "div",
121
- "id": "",
122
- "classes": [],
123
- "violations": [
124
- "inlineColor: backgroundColor=\"rgba(60, 100, 200, 0.65)\" bypasses theme tokens"
125
- ],
126
- "inlineColor": {
127
- "value": "backgroundColor: rgba(60, 100, 200, 0.65)",
128
- "knob": "off-scale (hardcoded)",
129
- "offScale": true
130
- }
131
- },
132
- {
133
- "label": "span._dsp_contents.t_unmounted.font_body",
134
- "tag": "span",
135
- "id": "",
136
- "classes": ["_dsp_contents", "t_unmounted", "font_body"],
137
- "violations": [],
138
- "fontFamily": {
139
- "value": "Inter, -apple-system, system-ui, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif",
140
- "knob": "sans-serif ($body/$heading)",
141
- "offScale": false
142
- }
143
- },
144
- {
145
- "label": "nav.is_View",
146
- "tag": "nav",
147
- "id": "",
148
- "classes": ["is_View"],
149
- "violations": [],
150
- "borderWidth": {
151
- "value": 1,
152
- "unit": "px",
153
- "knob": "medium",
154
- "offScale": false
155
- }
156
- },
157
- {
158
- "label": "div.is_View",
159
- "tag": "div",
160
- "id": "",
161
- "classes": ["is_View"],
162
- "violations": [],
163
- "rowGap": {
164
- "value": 13,
165
- "unit": "px",
166
- "knob": "medium",
167
- "offScale": false
168
- }
169
- },
170
- {
171
- "label": "button.is_Button.is_View._outlineColor-0focus-visible-outlineColo114[role=button]",
172
- "tag": "button",
173
- "id": "",
174
- "classes": [
175
- "is_Button",
176
- "is_View",
177
- "_outlineColor-0focus-visible-outlineColo114",
178
- "_outlineStyle-0focus-visible-solid",
179
- "_outlineWidth-0focus-visible-2px"
180
- ],
181
- "violations": [
182
- "borderRadius: 100000px is off-scale (no matching token)",
183
- "rowGap: 9px is off-scale (no matching token)"
184
- ],
185
- "borderRadius": {
186
- "value": 100000,
187
- "unit": "px",
188
- "knob": "off-scale",
189
- "offScale": true
190
- },
191
- "borderWidth": {
192
- "value": 1,
193
- "unit": "px",
194
- "knob": "medium",
195
- "offScale": false
196
- },
197
- "rowGap": {
198
- "value": 9,
199
- "unit": "px",
200
- "knob": "off-scale",
201
- "offScale": true
202
- }
203
- },
204
- {
205
- "label": "div.is_View",
206
- "tag": "div",
207
- "id": "",
208
- "classes": ["is_View"],
209
- "violations": [],
210
- "rowGap": {
211
- "value": 13,
212
- "unit": "px",
213
- "knob": "medium",
214
- "offScale": false
215
- }
216
- },
217
- {
218
- "label": "button.is_Button.is_View._outlineColor-0focus-visible-outlineColo114[role=button]",
219
- "tag": "button",
220
- "id": "",
221
- "classes": [
222
- "is_Button",
223
- "is_View",
224
- "_outlineColor-0focus-visible-outlineColo114",
225
- "_outlineStyle-0focus-visible-solid",
226
- "_outlineWidth-0focus-visible-2px"
227
- ],
228
- "violations": [
229
- "rowGap: 5px is off-scale (no matching token)",
230
- "paddingRight: 7px is off-scale (no matching token)",
231
- "paddingLeft: 7px is off-scale (no matching token)"
232
- ],
233
- "borderRadius": {
234
- "value": 5,
235
- "unit": "px",
236
- "knob": "small",
237
- "offScale": false
238
- },
239
- "borderWidth": {
240
- "value": 1,
241
- "unit": "px",
242
- "knob": "medium",
243
- "offScale": false
244
- },
245
- "rowGap": {
246
- "value": 5,
247
- "unit": "px",
248
- "knob": "off-scale",
249
- "offScale": true
250
- },
251
- "paddingRight": {
252
- "value": 7,
253
- "unit": "px",
254
- "knob": "off-scale",
255
- "offScale": true
256
- },
257
- "paddingLeft": {
258
- "value": 7,
259
- "unit": "px",
260
- "knob": "off-scale",
261
- "offScale": true
262
- }
263
- },
264
- {
265
- "label": "div.is_View",
266
- "tag": "div",
267
- "id": "",
268
- "classes": ["is_View"],
269
- "violations": [],
270
- "rowGap": {
271
- "value": 18,
272
- "unit": "px",
273
- "knob": "large",
274
- "offScale": false
275
- }
276
- },
277
- {
278
- "label": "div.is_View",
279
- "tag": "div",
280
- "id": "",
281
- "classes": ["is_View"],
282
- "violations": [],
283
- "rowGap": {
284
- "value": 13,
285
- "unit": "px",
286
- "knob": "medium",
287
- "offScale": false
288
- }
289
- },
290
- {
291
- "label": "h1.is_H1.is_Text.font_heading[role=heading]",
292
- "tag": "h1",
293
- "id": "",
294
- "classes": ["is_H1", "is_Text", "font_heading"],
295
- "violations": [],
296
- "fontWeight": {
297
- "value": 700,
298
- "unit": "px",
299
- "knob": "bold",
300
- "offScale": false
301
- }
302
- },
303
- {
304
- "label": "button.is_Toggle.is_View._outlineColor-0focus-visible-outlineColo114",
305
- "tag": "button",
306
- "id": "",
307
- "classes": [
308
- "is_Toggle",
309
- "is_View",
310
- "_outlineColor-0focus-visible-outlineColo114",
311
- "_outlineWidth-0focus-visible-2px",
312
- "_outlineStyle-0focus-visible-solid"
313
- ],
314
- "violations": [],
315
- "borderWidth": {
316
- "value": 1,
317
- "unit": "px",
318
- "knob": "medium",
319
- "offScale": false
320
- }
321
- },
322
- {
323
- "label": "button.is_Toggle.is_View._outlineColor-0focus-visible-outlineColo114",
324
- "tag": "button",
325
- "id": "",
326
- "classes": [
327
- "is_Toggle",
328
- "is_View",
329
- "_outlineColor-0focus-visible-outlineColo114",
330
- "_outlineWidth-0focus-visible-2px",
331
- "_outlineStyle-0focus-visible-solid"
332
- ],
333
- "violations": [],
334
- "borderWidth": {
335
- "value": 1,
336
- "unit": "px",
337
- "knob": "medium",
338
- "offScale": false
339
- }
340
- },
341
- {
342
- "label": "div.is_View[data-testid=pokemon-list]",
343
- "tag": "div",
344
- "id": "",
345
- "classes": ["is_View"],
346
- "violations": [],
347
- "rowGap": {
348
- "value": 13,
349
- "unit": "px",
350
- "knob": "medium",
351
- "offScale": false
352
- }
353
- }
354
- ]
355
- }