@payex-ds/schema 0.0.0-stage → 0.1.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.
- package/README.md +49 -2
- package/dist/index.d.ts +496 -0
- package/dist/index.js +485 -0
- package/dist/index.js.map +1 -0
- package/package.json +22 -3
package/README.md
CHANGED
|
@@ -1,3 +1,50 @@
|
|
|
1
|
-
#
|
|
1
|
+
# @payex-ds/schema
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Format, token catalogue and validation for PayEx design system **designs** (themes). Used by `@payex-ds/core` at runtime, the Designer UI (to generate the editor) and the Designer API (to validate saves).
|
|
4
|
+
|
|
5
|
+
## Design JSON
|
|
6
|
+
|
|
7
|
+
```json
|
|
8
|
+
{
|
|
9
|
+
"schemaVersion": 1,
|
|
10
|
+
"key": "acme",
|
|
11
|
+
"name": "Acme Corp",
|
|
12
|
+
"tokens": {
|
|
13
|
+
"colorPrimary": "#e4002b",
|
|
14
|
+
"colorOnPrimary": "#ffffff",
|
|
15
|
+
"borderRadius": "8px",
|
|
16
|
+
"fontFamily": "Inter, system-ui, sans-serif"
|
|
17
|
+
},
|
|
18
|
+
"components": {
|
|
19
|
+
"button": { "borderRadius": "999px", "paddingX": "32px" },
|
|
20
|
+
"card": { "shadow": "none" }
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
- `key` – lowercase slug (`a-z`, `0-9`, `-`, 2–63 chars). Consumers load it with `ds.init(key)`.
|
|
26
|
+
- `tokens` – optional global tokens (`globalTokens` in `src/catalogue.ts`): colours, typography, shape, spacing, elevation, motion. Unset tokens use their defaults.
|
|
27
|
+
- `components` – optional per-component overrides (`componentTokens`). Each component token falls back to a global token, e.g. `button.borderRadius` → `borderRadius`.
|
|
28
|
+
|
|
29
|
+
Every token becomes a CSS custom property: `colorPrimary` → `--pds-color-primary`, `button.borderRadius` → `--pds-button-border-radius`.
|
|
30
|
+
|
|
31
|
+
Values are validated per type (`color`, `length`, `font-family`, `font-weight`, `number`, `shadow`, `duration`). Anything that could inject CSS (`;`, `{`, `}`, `<`, `url(`, `@import`, comments, …) is rejected, as are unknown tokens and components.
|
|
32
|
+
|
|
33
|
+
## API
|
|
34
|
+
|
|
35
|
+
```ts
|
|
36
|
+
import {
|
|
37
|
+
globalTokens,
|
|
38
|
+
componentTokens, // catalogue with type, label, default/fallback
|
|
39
|
+
validateDesign, // (input: unknown) => { valid: true, design } | { valid: false, errors }
|
|
40
|
+
isValidTokenValue, // (type, value) => boolean
|
|
41
|
+
createDefaultDesign,
|
|
42
|
+
mergeDesign,
|
|
43
|
+
designToCssVars,
|
|
44
|
+
designToCss,
|
|
45
|
+
defaultTokensCss,
|
|
46
|
+
globalTokenToCssVar,
|
|
47
|
+
componentTokenToCssVar,
|
|
48
|
+
designJsonSchema, // JSON Schema (draft 2020-12) for editors/tooling
|
|
49
|
+
} from '@payex-ds/schema';
|
|
50
|
+
```
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,496 @@
|
|
|
1
|
+
type TokenType = 'color' | 'length' | 'font-family' | 'font-weight' | 'number' | 'shadow' | 'duration';
|
|
2
|
+
interface GlobalTokenMeta {
|
|
3
|
+
type: TokenType;
|
|
4
|
+
default: string;
|
|
5
|
+
label: string;
|
|
6
|
+
group: 'color' | 'typography' | 'shape' | 'spacing' | 'elevation' | 'motion';
|
|
7
|
+
}
|
|
8
|
+
interface ComponentTokenMeta {
|
|
9
|
+
type: TokenType;
|
|
10
|
+
label: string;
|
|
11
|
+
/** Global token name to fall back to, or a literal CSS value. */
|
|
12
|
+
fallback: string;
|
|
13
|
+
}
|
|
14
|
+
declare const globalTokens: {
|
|
15
|
+
readonly colorPrimary: GlobalTokenMeta;
|
|
16
|
+
readonly colorOnPrimary: GlobalTokenMeta;
|
|
17
|
+
readonly colorPrimaryHover: GlobalTokenMeta;
|
|
18
|
+
readonly colorSecondary: GlobalTokenMeta;
|
|
19
|
+
readonly colorOnSecondary: GlobalTokenMeta;
|
|
20
|
+
readonly colorAccent: GlobalTokenMeta;
|
|
21
|
+
readonly colorBackground: GlobalTokenMeta;
|
|
22
|
+
readonly colorSurface: GlobalTokenMeta;
|
|
23
|
+
readonly colorSurfaceAlt: GlobalTokenMeta;
|
|
24
|
+
readonly colorText: GlobalTokenMeta;
|
|
25
|
+
readonly colorTextMuted: GlobalTokenMeta;
|
|
26
|
+
readonly colorBorder: GlobalTokenMeta;
|
|
27
|
+
readonly colorSuccess: GlobalTokenMeta;
|
|
28
|
+
readonly colorSuccessBackground: GlobalTokenMeta;
|
|
29
|
+
readonly colorWarning: GlobalTokenMeta;
|
|
30
|
+
readonly colorWarningBackground: GlobalTokenMeta;
|
|
31
|
+
readonly colorError: GlobalTokenMeta;
|
|
32
|
+
readonly colorErrorBackground: GlobalTokenMeta;
|
|
33
|
+
readonly colorInfo: GlobalTokenMeta;
|
|
34
|
+
readonly colorInfoBackground: GlobalTokenMeta;
|
|
35
|
+
readonly colorFocusRing: GlobalTokenMeta;
|
|
36
|
+
readonly colorLink: GlobalTokenMeta;
|
|
37
|
+
readonly colorLinkHover: GlobalTokenMeta;
|
|
38
|
+
readonly colorDisabled: GlobalTokenMeta;
|
|
39
|
+
readonly colorOverlay: GlobalTokenMeta;
|
|
40
|
+
readonly fontFamily: {
|
|
41
|
+
readonly type: "font-family";
|
|
42
|
+
readonly default: "system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif";
|
|
43
|
+
readonly label: "Font family";
|
|
44
|
+
readonly group: "typography";
|
|
45
|
+
};
|
|
46
|
+
readonly fontFamilyHeading: {
|
|
47
|
+
readonly type: "font-family";
|
|
48
|
+
readonly default: "system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif";
|
|
49
|
+
readonly label: "Heading font family";
|
|
50
|
+
readonly group: "typography";
|
|
51
|
+
};
|
|
52
|
+
readonly fontSizeBase: {
|
|
53
|
+
readonly type: "length";
|
|
54
|
+
readonly default: "1rem";
|
|
55
|
+
readonly label: "Base font size";
|
|
56
|
+
readonly group: "typography";
|
|
57
|
+
};
|
|
58
|
+
readonly fontSizeSm: {
|
|
59
|
+
readonly type: "length";
|
|
60
|
+
readonly default: "0.875rem";
|
|
61
|
+
readonly label: "Small font size";
|
|
62
|
+
readonly group: "typography";
|
|
63
|
+
};
|
|
64
|
+
readonly fontSizeLg: {
|
|
65
|
+
readonly type: "length";
|
|
66
|
+
readonly default: "1.25rem";
|
|
67
|
+
readonly label: "Large font size";
|
|
68
|
+
readonly group: "typography";
|
|
69
|
+
};
|
|
70
|
+
readonly fontWeightRegular: {
|
|
71
|
+
readonly type: "font-weight";
|
|
72
|
+
readonly default: "400";
|
|
73
|
+
readonly label: "Regular weight";
|
|
74
|
+
readonly group: "typography";
|
|
75
|
+
};
|
|
76
|
+
readonly fontWeightBold: {
|
|
77
|
+
readonly type: "font-weight";
|
|
78
|
+
readonly default: "700";
|
|
79
|
+
readonly label: "Bold weight";
|
|
80
|
+
readonly group: "typography";
|
|
81
|
+
};
|
|
82
|
+
readonly lineHeight: {
|
|
83
|
+
readonly type: "number";
|
|
84
|
+
readonly default: "1.5";
|
|
85
|
+
readonly label: "Line height";
|
|
86
|
+
readonly group: "typography";
|
|
87
|
+
};
|
|
88
|
+
readonly borderRadius: {
|
|
89
|
+
readonly type: "length";
|
|
90
|
+
readonly default: "4px";
|
|
91
|
+
readonly label: "Border radius";
|
|
92
|
+
readonly group: "shape";
|
|
93
|
+
};
|
|
94
|
+
readonly borderRadiusSm: {
|
|
95
|
+
readonly type: "length";
|
|
96
|
+
readonly default: "2px";
|
|
97
|
+
readonly label: "Small border radius";
|
|
98
|
+
readonly group: "shape";
|
|
99
|
+
};
|
|
100
|
+
readonly borderRadiusLg: {
|
|
101
|
+
readonly type: "length";
|
|
102
|
+
readonly default: "8px";
|
|
103
|
+
readonly label: "Large border radius";
|
|
104
|
+
readonly group: "shape";
|
|
105
|
+
};
|
|
106
|
+
readonly borderWidth: {
|
|
107
|
+
readonly type: "length";
|
|
108
|
+
readonly default: "1px";
|
|
109
|
+
readonly label: "Border width";
|
|
110
|
+
readonly group: "shape";
|
|
111
|
+
};
|
|
112
|
+
readonly focusRingWidth: {
|
|
113
|
+
readonly type: "length";
|
|
114
|
+
readonly default: "2px";
|
|
115
|
+
readonly label: "Focus ring width";
|
|
116
|
+
readonly group: "shape";
|
|
117
|
+
};
|
|
118
|
+
readonly spacingUnit: {
|
|
119
|
+
readonly type: "length";
|
|
120
|
+
readonly default: "8px";
|
|
121
|
+
readonly label: "Spacing unit";
|
|
122
|
+
readonly group: "spacing";
|
|
123
|
+
};
|
|
124
|
+
readonly spacingXs: {
|
|
125
|
+
readonly type: "length";
|
|
126
|
+
readonly default: "4px";
|
|
127
|
+
readonly label: "Spacing XS";
|
|
128
|
+
readonly group: "spacing";
|
|
129
|
+
};
|
|
130
|
+
readonly spacingSm: {
|
|
131
|
+
readonly type: "length";
|
|
132
|
+
readonly default: "8px";
|
|
133
|
+
readonly label: "Spacing S";
|
|
134
|
+
readonly group: "spacing";
|
|
135
|
+
};
|
|
136
|
+
readonly spacingMd: {
|
|
137
|
+
readonly type: "length";
|
|
138
|
+
readonly default: "16px";
|
|
139
|
+
readonly label: "Spacing M";
|
|
140
|
+
readonly group: "spacing";
|
|
141
|
+
};
|
|
142
|
+
readonly spacingLg: {
|
|
143
|
+
readonly type: "length";
|
|
144
|
+
readonly default: "24px";
|
|
145
|
+
readonly label: "Spacing L";
|
|
146
|
+
readonly group: "spacing";
|
|
147
|
+
};
|
|
148
|
+
readonly spacingXl: {
|
|
149
|
+
readonly type: "length";
|
|
150
|
+
readonly default: "40px";
|
|
151
|
+
readonly label: "Spacing XL";
|
|
152
|
+
readonly group: "spacing";
|
|
153
|
+
};
|
|
154
|
+
readonly shadowSm: {
|
|
155
|
+
readonly type: "shadow";
|
|
156
|
+
readonly default: "0 1px 2px rgba(0, 0, 0, 0.12)";
|
|
157
|
+
readonly label: "Small shadow";
|
|
158
|
+
readonly group: "elevation";
|
|
159
|
+
};
|
|
160
|
+
readonly shadowMd: {
|
|
161
|
+
readonly type: "shadow";
|
|
162
|
+
readonly default: "0 2px 8px rgba(0, 0, 0, 0.16)";
|
|
163
|
+
readonly label: "Medium shadow";
|
|
164
|
+
readonly group: "elevation";
|
|
165
|
+
};
|
|
166
|
+
readonly shadowLg: {
|
|
167
|
+
readonly type: "shadow";
|
|
168
|
+
readonly default: "0 8px 24px rgba(0, 0, 0, 0.2)";
|
|
169
|
+
readonly label: "Large shadow";
|
|
170
|
+
readonly group: "elevation";
|
|
171
|
+
};
|
|
172
|
+
readonly durationFast: {
|
|
173
|
+
readonly type: "duration";
|
|
174
|
+
readonly default: "120ms";
|
|
175
|
+
readonly label: "Fast duration";
|
|
176
|
+
readonly group: "motion";
|
|
177
|
+
};
|
|
178
|
+
readonly durationNormal: {
|
|
179
|
+
readonly type: "duration";
|
|
180
|
+
readonly default: "240ms";
|
|
181
|
+
readonly label: "Normal duration";
|
|
182
|
+
readonly group: "motion";
|
|
183
|
+
};
|
|
184
|
+
};
|
|
185
|
+
type GlobalTokenName = keyof typeof globalTokens;
|
|
186
|
+
declare const componentTokens: {
|
|
187
|
+
readonly accordion: {
|
|
188
|
+
readonly headerBackground: ComponentTokenMeta;
|
|
189
|
+
readonly headerFontWeight: ComponentTokenMeta;
|
|
190
|
+
readonly background: ComponentTokenMeta;
|
|
191
|
+
readonly color: ComponentTokenMeta;
|
|
192
|
+
readonly borderColor: ComponentTokenMeta;
|
|
193
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
194
|
+
readonly padding: ComponentTokenMeta;
|
|
195
|
+
};
|
|
196
|
+
readonly alert: {
|
|
197
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
198
|
+
readonly padding: ComponentTokenMeta;
|
|
199
|
+
readonly borderWidth: ComponentTokenMeta;
|
|
200
|
+
};
|
|
201
|
+
readonly badge: {
|
|
202
|
+
readonly background: ComponentTokenMeta;
|
|
203
|
+
readonly color: ComponentTokenMeta;
|
|
204
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
205
|
+
readonly fontSize: ComponentTokenMeta;
|
|
206
|
+
};
|
|
207
|
+
readonly breadcrumb: {
|
|
208
|
+
readonly color: ComponentTokenMeta;
|
|
209
|
+
readonly separatorColor: ComponentTokenMeta;
|
|
210
|
+
readonly currentColor: ComponentTokenMeta;
|
|
211
|
+
};
|
|
212
|
+
readonly button: {
|
|
213
|
+
readonly background: ComponentTokenMeta;
|
|
214
|
+
readonly color: ComponentTokenMeta;
|
|
215
|
+
readonly hoverBackground: ComponentTokenMeta;
|
|
216
|
+
readonly secondaryBackground: ComponentTokenMeta;
|
|
217
|
+
readonly secondaryColor: ComponentTokenMeta;
|
|
218
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
219
|
+
readonly paddingX: ComponentTokenMeta;
|
|
220
|
+
readonly paddingY: ComponentTokenMeta;
|
|
221
|
+
readonly fontWeight: ComponentTokenMeta;
|
|
222
|
+
};
|
|
223
|
+
readonly card: {
|
|
224
|
+
readonly shadow: ComponentTokenMeta;
|
|
225
|
+
readonly background: ComponentTokenMeta;
|
|
226
|
+
readonly color: ComponentTokenMeta;
|
|
227
|
+
readonly borderColor: ComponentTokenMeta;
|
|
228
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
229
|
+
readonly padding: ComponentTokenMeta;
|
|
230
|
+
};
|
|
231
|
+
readonly checkbox: {
|
|
232
|
+
borderRadius: ComponentTokenMeta;
|
|
233
|
+
borderColor: ComponentTokenMeta;
|
|
234
|
+
checkedColor: ComponentTokenMeta;
|
|
235
|
+
size: ComponentTokenMeta;
|
|
236
|
+
};
|
|
237
|
+
readonly datepicker: {
|
|
238
|
+
readonly selectedBackground: ComponentTokenMeta;
|
|
239
|
+
readonly selectedColor: ComponentTokenMeta;
|
|
240
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
241
|
+
readonly shadow: ComponentTokenMeta;
|
|
242
|
+
};
|
|
243
|
+
readonly dialog: {
|
|
244
|
+
readonly padding: ComponentTokenMeta;
|
|
245
|
+
readonly shadow: ComponentTokenMeta;
|
|
246
|
+
readonly overlay: ComponentTokenMeta;
|
|
247
|
+
readonly maxWidth: ComponentTokenMeta;
|
|
248
|
+
readonly background: ComponentTokenMeta;
|
|
249
|
+
readonly color: ComponentTokenMeta;
|
|
250
|
+
readonly borderColor: ComponentTokenMeta;
|
|
251
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
252
|
+
};
|
|
253
|
+
readonly dropdown: {
|
|
254
|
+
readonly padding: ComponentTokenMeta;
|
|
255
|
+
readonly shadow: ComponentTokenMeta;
|
|
256
|
+
readonly background: ComponentTokenMeta;
|
|
257
|
+
readonly color: ComponentTokenMeta;
|
|
258
|
+
readonly borderColor: ComponentTokenMeta;
|
|
259
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
260
|
+
};
|
|
261
|
+
readonly expandable: {
|
|
262
|
+
readonly color: ComponentTokenMeta;
|
|
263
|
+
readonly fontWeight: ComponentTokenMeta;
|
|
264
|
+
};
|
|
265
|
+
readonly input: {
|
|
266
|
+
readonly background: ComponentTokenMeta;
|
|
267
|
+
readonly color: ComponentTokenMeta;
|
|
268
|
+
readonly borderColor: ComponentTokenMeta;
|
|
269
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
270
|
+
readonly paddingX: ComponentTokenMeta;
|
|
271
|
+
readonly height: ComponentTokenMeta;
|
|
272
|
+
};
|
|
273
|
+
readonly link: {
|
|
274
|
+
readonly color: ComponentTokenMeta;
|
|
275
|
+
readonly hoverColor: ComponentTokenMeta;
|
|
276
|
+
readonly textDecoration: ComponentTokenMeta;
|
|
277
|
+
};
|
|
278
|
+
readonly list: {
|
|
279
|
+
readonly gap: ComponentTokenMeta;
|
|
280
|
+
readonly markerColor: ComponentTokenMeta;
|
|
281
|
+
};
|
|
282
|
+
readonly loader: {
|
|
283
|
+
readonly color: ComponentTokenMeta;
|
|
284
|
+
readonly trackColor: ComponentTokenMeta;
|
|
285
|
+
readonly size: ComponentTokenMeta;
|
|
286
|
+
};
|
|
287
|
+
readonly 'media-object': {
|
|
288
|
+
readonly gap: ComponentTokenMeta;
|
|
289
|
+
};
|
|
290
|
+
readonly pagination: {
|
|
291
|
+
readonly activeBackground: ComponentTokenMeta;
|
|
292
|
+
readonly activeColor: ComponentTokenMeta;
|
|
293
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
294
|
+
};
|
|
295
|
+
readonly panel: {
|
|
296
|
+
readonly background: ComponentTokenMeta;
|
|
297
|
+
readonly color: ComponentTokenMeta;
|
|
298
|
+
readonly borderColor: ComponentTokenMeta;
|
|
299
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
300
|
+
readonly padding: ComponentTokenMeta;
|
|
301
|
+
};
|
|
302
|
+
readonly 'progress-steps': {
|
|
303
|
+
readonly activeColor: ComponentTokenMeta;
|
|
304
|
+
readonly completedColor: ComponentTokenMeta;
|
|
305
|
+
readonly inactiveColor: ComponentTokenMeta;
|
|
306
|
+
};
|
|
307
|
+
readonly radio: {
|
|
308
|
+
borderRadius: ComponentTokenMeta;
|
|
309
|
+
borderColor: ComponentTokenMeta;
|
|
310
|
+
checkedColor: ComponentTokenMeta;
|
|
311
|
+
size: ComponentTokenMeta;
|
|
312
|
+
};
|
|
313
|
+
readonly rangeslider: {
|
|
314
|
+
readonly trackColor: ComponentTokenMeta;
|
|
315
|
+
readonly fillColor: ComponentTokenMeta;
|
|
316
|
+
readonly thumbSize: ComponentTokenMeta;
|
|
317
|
+
};
|
|
318
|
+
readonly sheet: {
|
|
319
|
+
readonly width: ComponentTokenMeta;
|
|
320
|
+
readonly shadow: ComponentTokenMeta;
|
|
321
|
+
readonly overlay: ComponentTokenMeta;
|
|
322
|
+
readonly background: ComponentTokenMeta;
|
|
323
|
+
readonly color: ComponentTokenMeta;
|
|
324
|
+
readonly borderColor: ComponentTokenMeta;
|
|
325
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
326
|
+
readonly padding: ComponentTokenMeta;
|
|
327
|
+
};
|
|
328
|
+
readonly select: {
|
|
329
|
+
readonly background: ComponentTokenMeta;
|
|
330
|
+
readonly borderColor: ComponentTokenMeta;
|
|
331
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
332
|
+
readonly height: ComponentTokenMeta;
|
|
333
|
+
};
|
|
334
|
+
readonly sidebar: {
|
|
335
|
+
readonly background: ComponentTokenMeta;
|
|
336
|
+
readonly color: ComponentTokenMeta;
|
|
337
|
+
readonly activeBackground: ComponentTokenMeta;
|
|
338
|
+
readonly activeColor: ComponentTokenMeta;
|
|
339
|
+
readonly width: ComponentTokenMeta;
|
|
340
|
+
};
|
|
341
|
+
readonly 'skip-link': {
|
|
342
|
+
readonly background: ComponentTokenMeta;
|
|
343
|
+
readonly color: ComponentTokenMeta;
|
|
344
|
+
};
|
|
345
|
+
readonly slab: {
|
|
346
|
+
readonly background: ComponentTokenMeta;
|
|
347
|
+
readonly padding: ComponentTokenMeta;
|
|
348
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
349
|
+
};
|
|
350
|
+
readonly status: {
|
|
351
|
+
readonly dotSize: ComponentTokenMeta;
|
|
352
|
+
readonly gap: ComponentTokenMeta;
|
|
353
|
+
};
|
|
354
|
+
readonly table: {
|
|
355
|
+
readonly headerBackground: ComponentTokenMeta;
|
|
356
|
+
readonly borderColor: ComponentTokenMeta;
|
|
357
|
+
readonly stripeBackground: ComponentTokenMeta;
|
|
358
|
+
readonly cellPadding: ComponentTokenMeta;
|
|
359
|
+
};
|
|
360
|
+
readonly tabs: {
|
|
361
|
+
readonly activeColor: ComponentTokenMeta;
|
|
362
|
+
readonly color: ComponentTokenMeta;
|
|
363
|
+
readonly indicatorHeight: ComponentTokenMeta;
|
|
364
|
+
};
|
|
365
|
+
readonly tag: {
|
|
366
|
+
readonly background: ComponentTokenMeta;
|
|
367
|
+
readonly color: ComponentTokenMeta;
|
|
368
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
369
|
+
};
|
|
370
|
+
readonly toast: {
|
|
371
|
+
readonly background: ComponentTokenMeta;
|
|
372
|
+
readonly color: ComponentTokenMeta;
|
|
373
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
374
|
+
readonly shadow: ComponentTokenMeta;
|
|
375
|
+
};
|
|
376
|
+
readonly togglebox: {
|
|
377
|
+
readonly checkedColor: ComponentTokenMeta;
|
|
378
|
+
readonly trackColor: ComponentTokenMeta;
|
|
379
|
+
readonly width: ComponentTokenMeta;
|
|
380
|
+
};
|
|
381
|
+
readonly tooltip: {
|
|
382
|
+
readonly background: ComponentTokenMeta;
|
|
383
|
+
readonly color: ComponentTokenMeta;
|
|
384
|
+
readonly borderRadius: ComponentTokenMeta;
|
|
385
|
+
};
|
|
386
|
+
readonly topbar: {
|
|
387
|
+
readonly background: ComponentTokenMeta;
|
|
388
|
+
readonly color: ComponentTokenMeta;
|
|
389
|
+
readonly height: ComponentTokenMeta;
|
|
390
|
+
readonly shadow: ComponentTokenMeta;
|
|
391
|
+
};
|
|
392
|
+
};
|
|
393
|
+
type ComponentName = keyof typeof componentTokens;
|
|
394
|
+
type ComponentTokenName<C extends ComponentName> = keyof (typeof componentTokens)[C] & string;
|
|
395
|
+
|
|
396
|
+
declare const SCHEMA_VERSION = 1;
|
|
397
|
+
type ComponentOverrides = {
|
|
398
|
+
[C in ComponentName]?: Partial<Record<ComponentTokenName<C>, string>>;
|
|
399
|
+
};
|
|
400
|
+
interface DesignJson {
|
|
401
|
+
schemaVersion: 1;
|
|
402
|
+
key: string;
|
|
403
|
+
name: string;
|
|
404
|
+
tokens: Partial<Record<GlobalTokenName, string>>;
|
|
405
|
+
components: ComponentOverrides;
|
|
406
|
+
}
|
|
407
|
+
declare const globalTokenToCssVar: (name: string) => string;
|
|
408
|
+
declare const componentTokenToCssVar: (component: string, token: string) => string;
|
|
409
|
+
declare const isGlobalTokenName: (name: string) => name is GlobalTokenName;
|
|
410
|
+
declare const isComponentName: (name: string) => name is ComponentName;
|
|
411
|
+
/** Resolves a component token fallback into a CSS value (`var(--pds-x)` or a literal). */
|
|
412
|
+
declare const fallbackToCss: (fallback: string) => string;
|
|
413
|
+
declare function createDefaultDesign(key?: string, name?: string): DesignJson;
|
|
414
|
+
declare function mergeDesign(base: DesignJson, override: Partial<DesignJson>): DesignJson;
|
|
415
|
+
/**
|
|
416
|
+
* CSS variables for a design: every global token (default or overridden) and every component token
|
|
417
|
+
* (override or its fallback). Component fallbacks are emitted too so they re-resolve against the
|
|
418
|
+
* design's globals when applied to a sub-tree (a `var()` is resolved where it is declared).
|
|
419
|
+
*/
|
|
420
|
+
declare function designToCssVars(design: DesignJson): Record<string, string>;
|
|
421
|
+
declare const designToCss: (design: DesignJson, selector?: string) => string;
|
|
422
|
+
/** Full default stylesheet: all global tokens and every component token mapped to its fallback. */
|
|
423
|
+
declare function defaultTokensCss(selector?: string): string;
|
|
424
|
+
|
|
425
|
+
interface ValidationError {
|
|
426
|
+
path: string;
|
|
427
|
+
message: string;
|
|
428
|
+
}
|
|
429
|
+
type ValidationResult = {
|
|
430
|
+
valid: true;
|
|
431
|
+
design: DesignJson;
|
|
432
|
+
} | {
|
|
433
|
+
valid: false;
|
|
434
|
+
errors: ValidationError[];
|
|
435
|
+
};
|
|
436
|
+
declare const DESIGN_KEY_PATTERN: RegExp;
|
|
437
|
+
declare function isValidTokenValue(type: TokenType, value: string): boolean;
|
|
438
|
+
declare function validateDesign(input: unknown): ValidationResult;
|
|
439
|
+
|
|
440
|
+
/** JSON Schema (draft 2020-12) for design documents, generated from the token catalogue. */
|
|
441
|
+
declare const designJsonSchema: {
|
|
442
|
+
readonly $schema: "https://json-schema.org/draft/2020-12/schema";
|
|
443
|
+
readonly $id: "https://payex-ds/design.schema.json";
|
|
444
|
+
readonly title: "PayEx design system design";
|
|
445
|
+
readonly type: "object";
|
|
446
|
+
readonly additionalProperties: false;
|
|
447
|
+
readonly required: readonly ["schemaVersion", "key", "name"];
|
|
448
|
+
readonly properties: {
|
|
449
|
+
readonly $schema: {
|
|
450
|
+
readonly type: "string";
|
|
451
|
+
};
|
|
452
|
+
readonly schemaVersion: {
|
|
453
|
+
readonly const: 1;
|
|
454
|
+
};
|
|
455
|
+
readonly key: {
|
|
456
|
+
readonly type: "string";
|
|
457
|
+
readonly pattern: string;
|
|
458
|
+
};
|
|
459
|
+
readonly name: {
|
|
460
|
+
readonly type: "string";
|
|
461
|
+
readonly minLength: 1;
|
|
462
|
+
readonly maxLength: 100;
|
|
463
|
+
};
|
|
464
|
+
readonly tokens: {
|
|
465
|
+
type: string;
|
|
466
|
+
additionalProperties: boolean;
|
|
467
|
+
properties: {
|
|
468
|
+
[k: string]: {
|
|
469
|
+
type: string;
|
|
470
|
+
maxLength: number;
|
|
471
|
+
title: string;
|
|
472
|
+
};
|
|
473
|
+
};
|
|
474
|
+
};
|
|
475
|
+
readonly components: {
|
|
476
|
+
readonly type: "object";
|
|
477
|
+
readonly additionalProperties: false;
|
|
478
|
+
readonly properties: {
|
|
479
|
+
[k: string]: {
|
|
480
|
+
type: string;
|
|
481
|
+
additionalProperties: boolean;
|
|
482
|
+
properties: {
|
|
483
|
+
[k: string]: {
|
|
484
|
+
type: string;
|
|
485
|
+
maxLength: number;
|
|
486
|
+
title: string;
|
|
487
|
+
};
|
|
488
|
+
};
|
|
489
|
+
};
|
|
490
|
+
};
|
|
491
|
+
};
|
|
492
|
+
};
|
|
493
|
+
};
|
|
494
|
+
|
|
495
|
+
export { DESIGN_KEY_PATTERN, SCHEMA_VERSION, componentTokenToCssVar, componentTokens, createDefaultDesign, defaultTokensCss, designJsonSchema, designToCss, designToCssVars, fallbackToCss, globalTokenToCssVar, globalTokens, isComponentName, isGlobalTokenName, isValidTokenValue, mergeDesign, validateDesign };
|
|
496
|
+
export type { ComponentName, ComponentOverrides, ComponentTokenMeta, ComponentTokenName, DesignJson, GlobalTokenMeta, GlobalTokenName, TokenType, ValidationError, ValidationResult };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,485 @@
|
|
|
1
|
+
// src/catalogue.ts
|
|
2
|
+
var c = (def, label) => ({
|
|
3
|
+
type: "color",
|
|
4
|
+
default: def,
|
|
5
|
+
label,
|
|
6
|
+
group: "color"
|
|
7
|
+
});
|
|
8
|
+
var globalTokens = {
|
|
9
|
+
colorPrimary: c("#2f2424", "Primary"),
|
|
10
|
+
colorOnPrimary: c("#ffffff", "Text on primary"),
|
|
11
|
+
colorPrimaryHover: c("#4a3b3b", "Primary hover"),
|
|
12
|
+
colorSecondary: c("#ffffff", "Secondary"),
|
|
13
|
+
colorOnSecondary: c("#2f2424", "Text on secondary"),
|
|
14
|
+
colorAccent: c("#fdc129", "Accent"),
|
|
15
|
+
colorBackground: c("#ffffff", "Page background"),
|
|
16
|
+
colorSurface: c("#ffffff", "Surface"),
|
|
17
|
+
colorSurfaceAlt: c("#f7f4f2", "Alternate surface"),
|
|
18
|
+
colorText: c("#2f2424", "Text"),
|
|
19
|
+
colorTextMuted: c("#6b5f5f", "Muted text"),
|
|
20
|
+
colorBorder: c("#c9c1bf", "Border"),
|
|
21
|
+
colorSuccess: c("#2b7d3a", "Success"),
|
|
22
|
+
colorSuccessBackground: c("#e6f4e8", "Success background"),
|
|
23
|
+
colorWarning: c("#8a5a00", "Warning"),
|
|
24
|
+
colorWarningBackground: c("#fff4d6", "Warning background"),
|
|
25
|
+
colorError: c("#c5131c", "Error"),
|
|
26
|
+
colorErrorBackground: c("#fdecec", "Error background"),
|
|
27
|
+
colorInfo: c("#1f5f99", "Info"),
|
|
28
|
+
colorInfoBackground: c("#e8f1fa", "Info background"),
|
|
29
|
+
colorFocusRing: c("#1f5f99", "Focus ring"),
|
|
30
|
+
colorLink: c("#1f5f99", "Link"),
|
|
31
|
+
colorLinkHover: c("#15426b", "Link hover"),
|
|
32
|
+
colorDisabled: c("#a59c9a", "Disabled"),
|
|
33
|
+
colorOverlay: c("rgba(0, 0, 0, 0.5)", "Overlay"),
|
|
34
|
+
fontFamily: {
|
|
35
|
+
type: "font-family",
|
|
36
|
+
default: "system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif",
|
|
37
|
+
label: "Font family",
|
|
38
|
+
group: "typography"
|
|
39
|
+
},
|
|
40
|
+
fontFamilyHeading: {
|
|
41
|
+
type: "font-family",
|
|
42
|
+
default: "system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif",
|
|
43
|
+
label: "Heading font family",
|
|
44
|
+
group: "typography"
|
|
45
|
+
},
|
|
46
|
+
fontSizeBase: { type: "length", default: "1rem", label: "Base font size", group: "typography" },
|
|
47
|
+
fontSizeSm: {
|
|
48
|
+
type: "length",
|
|
49
|
+
default: "0.875rem",
|
|
50
|
+
label: "Small font size",
|
|
51
|
+
group: "typography"
|
|
52
|
+
},
|
|
53
|
+
fontSizeLg: { type: "length", default: "1.25rem", label: "Large font size", group: "typography" },
|
|
54
|
+
fontWeightRegular: {
|
|
55
|
+
type: "font-weight",
|
|
56
|
+
default: "400",
|
|
57
|
+
label: "Regular weight",
|
|
58
|
+
group: "typography"
|
|
59
|
+
},
|
|
60
|
+
fontWeightBold: {
|
|
61
|
+
type: "font-weight",
|
|
62
|
+
default: "700",
|
|
63
|
+
label: "Bold weight",
|
|
64
|
+
group: "typography"
|
|
65
|
+
},
|
|
66
|
+
lineHeight: { type: "number", default: "1.5", label: "Line height", group: "typography" },
|
|
67
|
+
borderRadius: { type: "length", default: "4px", label: "Border radius", group: "shape" },
|
|
68
|
+
borderRadiusSm: { type: "length", default: "2px", label: "Small border radius", group: "shape" },
|
|
69
|
+
borderRadiusLg: { type: "length", default: "8px", label: "Large border radius", group: "shape" },
|
|
70
|
+
borderWidth: { type: "length", default: "1px", label: "Border width", group: "shape" },
|
|
71
|
+
focusRingWidth: { type: "length", default: "2px", label: "Focus ring width", group: "shape" },
|
|
72
|
+
spacingUnit: { type: "length", default: "8px", label: "Spacing unit", group: "spacing" },
|
|
73
|
+
spacingXs: { type: "length", default: "4px", label: "Spacing XS", group: "spacing" },
|
|
74
|
+
spacingSm: { type: "length", default: "8px", label: "Spacing S", group: "spacing" },
|
|
75
|
+
spacingMd: { type: "length", default: "16px", label: "Spacing M", group: "spacing" },
|
|
76
|
+
spacingLg: { type: "length", default: "24px", label: "Spacing L", group: "spacing" },
|
|
77
|
+
spacingXl: { type: "length", default: "40px", label: "Spacing XL", group: "spacing" },
|
|
78
|
+
shadowSm: {
|
|
79
|
+
type: "shadow",
|
|
80
|
+
default: "0 1px 2px rgba(0, 0, 0, 0.12)",
|
|
81
|
+
label: "Small shadow",
|
|
82
|
+
group: "elevation"
|
|
83
|
+
},
|
|
84
|
+
shadowMd: {
|
|
85
|
+
type: "shadow",
|
|
86
|
+
default: "0 2px 8px rgba(0, 0, 0, 0.16)",
|
|
87
|
+
label: "Medium shadow",
|
|
88
|
+
group: "elevation"
|
|
89
|
+
},
|
|
90
|
+
shadowLg: {
|
|
91
|
+
type: "shadow",
|
|
92
|
+
default: "0 8px 24px rgba(0, 0, 0, 0.2)",
|
|
93
|
+
label: "Large shadow",
|
|
94
|
+
group: "elevation"
|
|
95
|
+
},
|
|
96
|
+
durationFast: { type: "duration", default: "120ms", label: "Fast duration", group: "motion" },
|
|
97
|
+
durationNormal: { type: "duration", default: "240ms", label: "Normal duration", group: "motion" }
|
|
98
|
+
};
|
|
99
|
+
var t = (type, label, fallback) => ({
|
|
100
|
+
type,
|
|
101
|
+
label,
|
|
102
|
+
fallback
|
|
103
|
+
});
|
|
104
|
+
var surface = {
|
|
105
|
+
background: t("color", "Background", "colorSurface"),
|
|
106
|
+
color: t("color", "Text color", "colorText"),
|
|
107
|
+
borderColor: t("color", "Border color", "colorBorder"),
|
|
108
|
+
borderRadius: t("length", "Border radius", "borderRadius"),
|
|
109
|
+
padding: t("length", "Padding", "spacingMd")
|
|
110
|
+
};
|
|
111
|
+
var control = {
|
|
112
|
+
borderRadius: t("length", "Border radius", "borderRadius"),
|
|
113
|
+
borderColor: t("color", "Border color", "colorBorder"),
|
|
114
|
+
checkedColor: t("color", "Checked color", "colorPrimary"),
|
|
115
|
+
size: t("length", "Size", "1.25rem")
|
|
116
|
+
};
|
|
117
|
+
var componentTokens = {
|
|
118
|
+
accordion: {
|
|
119
|
+
...surface,
|
|
120
|
+
headerBackground: t("color", "Header background", "colorSurface"),
|
|
121
|
+
headerFontWeight: t("font-weight", "Header font weight", "fontWeightBold")
|
|
122
|
+
},
|
|
123
|
+
alert: {
|
|
124
|
+
borderRadius: t("length", "Border radius", "borderRadius"),
|
|
125
|
+
padding: t("length", "Padding", "spacingMd"),
|
|
126
|
+
borderWidth: t("length", "Accent border width", "4px")
|
|
127
|
+
},
|
|
128
|
+
badge: {
|
|
129
|
+
background: t("color", "Background", "colorPrimary"),
|
|
130
|
+
color: t("color", "Text color", "colorOnPrimary"),
|
|
131
|
+
borderRadius: t("length", "Border radius", "999px"),
|
|
132
|
+
fontSize: t("length", "Font size", "fontSizeSm")
|
|
133
|
+
},
|
|
134
|
+
breadcrumb: {
|
|
135
|
+
color: t("color", "Link color", "colorLink"),
|
|
136
|
+
separatorColor: t("color", "Separator color", "colorTextMuted"),
|
|
137
|
+
currentColor: t("color", "Current page color", "colorText")
|
|
138
|
+
},
|
|
139
|
+
button: {
|
|
140
|
+
background: t("color", "Primary background", "colorPrimary"),
|
|
141
|
+
color: t("color", "Primary text color", "colorOnPrimary"),
|
|
142
|
+
hoverBackground: t("color", "Primary hover background", "colorPrimaryHover"),
|
|
143
|
+
secondaryBackground: t("color", "Secondary background", "colorSecondary"),
|
|
144
|
+
secondaryColor: t("color", "Secondary text color", "colorOnSecondary"),
|
|
145
|
+
borderRadius: t("length", "Border radius", "borderRadius"),
|
|
146
|
+
paddingX: t("length", "Horizontal padding", "spacingLg"),
|
|
147
|
+
paddingY: t("length", "Vertical padding", "spacingSm"),
|
|
148
|
+
fontWeight: t("font-weight", "Font weight", "fontWeightBold")
|
|
149
|
+
},
|
|
150
|
+
card: { ...surface, shadow: t("shadow", "Shadow", "shadowSm") },
|
|
151
|
+
checkbox: control,
|
|
152
|
+
datepicker: {
|
|
153
|
+
selectedBackground: t("color", "Selected day background", "colorPrimary"),
|
|
154
|
+
selectedColor: t("color", "Selected day text", "colorOnPrimary"),
|
|
155
|
+
borderRadius: t("length", "Border radius", "borderRadius"),
|
|
156
|
+
shadow: t("shadow", "Popup shadow", "shadowMd")
|
|
157
|
+
},
|
|
158
|
+
dialog: {
|
|
159
|
+
...surface,
|
|
160
|
+
padding: t("length", "Padding", "spacingLg"),
|
|
161
|
+
shadow: t("shadow", "Shadow", "shadowLg"),
|
|
162
|
+
overlay: t("color", "Backdrop", "colorOverlay"),
|
|
163
|
+
maxWidth: t("length", "Max width", "560px")
|
|
164
|
+
},
|
|
165
|
+
dropdown: {
|
|
166
|
+
...surface,
|
|
167
|
+
padding: t("length", "Padding", "spacingXs"),
|
|
168
|
+
shadow: t("shadow", "Shadow", "shadowMd")
|
|
169
|
+
},
|
|
170
|
+
expandable: {
|
|
171
|
+
color: t("color", "Toggle color", "colorText"),
|
|
172
|
+
fontWeight: t("font-weight", "Toggle font weight", "fontWeightBold")
|
|
173
|
+
},
|
|
174
|
+
input: {
|
|
175
|
+
background: t("color", "Background", "colorSurface"),
|
|
176
|
+
color: t("color", "Text color", "colorText"),
|
|
177
|
+
borderColor: t("color", "Border color", "colorBorder"),
|
|
178
|
+
borderRadius: t("length", "Border radius", "borderRadius"),
|
|
179
|
+
paddingX: t("length", "Horizontal padding", "spacingSm"),
|
|
180
|
+
height: t("length", "Height", "2.5rem")
|
|
181
|
+
},
|
|
182
|
+
link: {
|
|
183
|
+
color: t("color", "Color", "colorLink"),
|
|
184
|
+
hoverColor: t("color", "Hover color", "colorLinkHover"),
|
|
185
|
+
textDecoration: t("number", "Underline (underline/none)", "underline")
|
|
186
|
+
},
|
|
187
|
+
list: {
|
|
188
|
+
gap: t("length", "Item spacing", "spacingXs"),
|
|
189
|
+
markerColor: t("color", "Marker color", "colorPrimary")
|
|
190
|
+
},
|
|
191
|
+
loader: {
|
|
192
|
+
color: t("color", "Color", "colorPrimary"),
|
|
193
|
+
trackColor: t("color", "Track color", "colorBorder"),
|
|
194
|
+
size: t("length", "Size", "2rem")
|
|
195
|
+
},
|
|
196
|
+
"media-object": { gap: t("length", "Gap", "spacingMd") },
|
|
197
|
+
pagination: {
|
|
198
|
+
activeBackground: t("color", "Active background", "colorPrimary"),
|
|
199
|
+
activeColor: t("color", "Active text", "colorOnPrimary"),
|
|
200
|
+
borderRadius: t("length", "Border radius", "borderRadius")
|
|
201
|
+
},
|
|
202
|
+
panel: { ...surface, background: t("color", "Background", "colorSurfaceAlt") },
|
|
203
|
+
"progress-steps": {
|
|
204
|
+
activeColor: t("color", "Active color", "colorPrimary"),
|
|
205
|
+
completedColor: t("color", "Completed color", "colorSuccess"),
|
|
206
|
+
inactiveColor: t("color", "Inactive color", "colorBorder")
|
|
207
|
+
},
|
|
208
|
+
radio: control,
|
|
209
|
+
rangeslider: {
|
|
210
|
+
trackColor: t("color", "Track color", "colorBorder"),
|
|
211
|
+
fillColor: t("color", "Fill color", "colorPrimary"),
|
|
212
|
+
thumbSize: t("length", "Thumb size", "1.25rem")
|
|
213
|
+
},
|
|
214
|
+
sheet: {
|
|
215
|
+
...surface,
|
|
216
|
+
width: t("length", "Width", "400px"),
|
|
217
|
+
shadow: t("shadow", "Shadow", "shadowLg"),
|
|
218
|
+
overlay: t("color", "Backdrop", "colorOverlay")
|
|
219
|
+
},
|
|
220
|
+
select: {
|
|
221
|
+
background: t("color", "Background", "colorSurface"),
|
|
222
|
+
borderColor: t("color", "Border color", "colorBorder"),
|
|
223
|
+
borderRadius: t("length", "Border radius", "borderRadius"),
|
|
224
|
+
height: t("length", "Height", "2.5rem")
|
|
225
|
+
},
|
|
226
|
+
sidebar: {
|
|
227
|
+
background: t("color", "Background", "colorSurfaceAlt"),
|
|
228
|
+
color: t("color", "Text color", "colorText"),
|
|
229
|
+
activeBackground: t("color", "Active item background", "colorPrimary"),
|
|
230
|
+
activeColor: t("color", "Active item text", "colorOnPrimary"),
|
|
231
|
+
width: t("length", "Width", "260px")
|
|
232
|
+
},
|
|
233
|
+
"skip-link": {
|
|
234
|
+
background: t("color", "Background", "colorPrimary"),
|
|
235
|
+
color: t("color", "Text color", "colorOnPrimary")
|
|
236
|
+
},
|
|
237
|
+
slab: {
|
|
238
|
+
background: t("color", "Background", "colorSurfaceAlt"),
|
|
239
|
+
padding: t("length", "Padding", "spacingLg"),
|
|
240
|
+
borderRadius: t("length", "Border radius", "0")
|
|
241
|
+
},
|
|
242
|
+
status: {
|
|
243
|
+
dotSize: t("length", "Dot size", "0.625rem"),
|
|
244
|
+
gap: t("length", "Gap", "spacingXs")
|
|
245
|
+
},
|
|
246
|
+
table: {
|
|
247
|
+
headerBackground: t("color", "Header background", "colorSurfaceAlt"),
|
|
248
|
+
borderColor: t("color", "Border color", "colorBorder"),
|
|
249
|
+
stripeBackground: t("color", "Stripe background", "colorSurfaceAlt"),
|
|
250
|
+
cellPadding: t("length", "Cell padding", "spacingSm")
|
|
251
|
+
},
|
|
252
|
+
tabs: {
|
|
253
|
+
activeColor: t("color", "Active color", "colorPrimary"),
|
|
254
|
+
color: t("color", "Color", "colorTextMuted"),
|
|
255
|
+
indicatorHeight: t("length", "Indicator height", "3px")
|
|
256
|
+
},
|
|
257
|
+
tag: {
|
|
258
|
+
background: t("color", "Background", "colorSurfaceAlt"),
|
|
259
|
+
color: t("color", "Text color", "colorText"),
|
|
260
|
+
borderRadius: t("length", "Border radius", "borderRadiusSm")
|
|
261
|
+
},
|
|
262
|
+
toast: {
|
|
263
|
+
background: t("color", "Background", "colorPrimary"),
|
|
264
|
+
color: t("color", "Text color", "colorOnPrimary"),
|
|
265
|
+
borderRadius: t("length", "Border radius", "borderRadius"),
|
|
266
|
+
shadow: t("shadow", "Shadow", "shadowMd")
|
|
267
|
+
},
|
|
268
|
+
togglebox: {
|
|
269
|
+
checkedColor: t("color", "On color", "colorPrimary"),
|
|
270
|
+
trackColor: t("color", "Off color", "colorDisabled"),
|
|
271
|
+
width: t("length", "Width", "2.75rem")
|
|
272
|
+
},
|
|
273
|
+
tooltip: {
|
|
274
|
+
background: t("color", "Background", "colorPrimary"),
|
|
275
|
+
color: t("color", "Text color", "colorOnPrimary"),
|
|
276
|
+
borderRadius: t("length", "Border radius", "borderRadiusSm")
|
|
277
|
+
},
|
|
278
|
+
topbar: {
|
|
279
|
+
background: t("color", "Background", "colorSurface"),
|
|
280
|
+
color: t("color", "Text color", "colorText"),
|
|
281
|
+
height: t("length", "Height", "64px"),
|
|
282
|
+
shadow: t("shadow", "Shadow", "shadowSm")
|
|
283
|
+
}
|
|
284
|
+
};
|
|
285
|
+
|
|
286
|
+
// src/design.ts
|
|
287
|
+
var SCHEMA_VERSION = 1;
|
|
288
|
+
var kebab = (s) => s.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
|
|
289
|
+
var globalTokenToCssVar = (name) => `--pds-${kebab(name)}`;
|
|
290
|
+
var componentTokenToCssVar = (component, token) => `--pds-${component}-${kebab(token)}`;
|
|
291
|
+
var isGlobalTokenName = (name) => Object.prototype.hasOwnProperty.call(globalTokens, name);
|
|
292
|
+
var isComponentName = (name) => Object.prototype.hasOwnProperty.call(componentTokens, name);
|
|
293
|
+
var fallbackToCss = (fallback) => isGlobalTokenName(fallback) ? `var(${globalTokenToCssVar(fallback)})` : fallback;
|
|
294
|
+
function createDefaultDesign(key = "default", name = "Default") {
|
|
295
|
+
return { schemaVersion: SCHEMA_VERSION, key, name, tokens: {}, components: {} };
|
|
296
|
+
}
|
|
297
|
+
function mergeDesign(base, override) {
|
|
298
|
+
const components = {};
|
|
299
|
+
for (const src of [base.components, override.components ?? {}]) {
|
|
300
|
+
for (const [comp, values] of Object.entries(src)) {
|
|
301
|
+
components[comp] = { ...components[comp], ...values };
|
|
302
|
+
}
|
|
303
|
+
}
|
|
304
|
+
return {
|
|
305
|
+
schemaVersion: SCHEMA_VERSION,
|
|
306
|
+
key: override.key ?? base.key,
|
|
307
|
+
name: override.name ?? base.name,
|
|
308
|
+
tokens: { ...base.tokens, ...override.tokens },
|
|
309
|
+
components
|
|
310
|
+
};
|
|
311
|
+
}
|
|
312
|
+
function designToCssVars(design) {
|
|
313
|
+
const vars = {};
|
|
314
|
+
for (const [name, meta] of Object.entries(globalTokens)) {
|
|
315
|
+
vars[globalTokenToCssVar(name)] = design.tokens[name] ?? meta.default;
|
|
316
|
+
}
|
|
317
|
+
const overrides = design.components;
|
|
318
|
+
for (const [comp, tokens] of Object.entries(componentTokens)) {
|
|
319
|
+
for (const [token, meta] of Object.entries(tokens)) {
|
|
320
|
+
vars[componentTokenToCssVar(comp, token)] = overrides[comp]?.[token] ?? fallbackToCss(meta.fallback);
|
|
321
|
+
}
|
|
322
|
+
}
|
|
323
|
+
return vars;
|
|
324
|
+
}
|
|
325
|
+
var block = (selector, vars) => `${selector} {
|
|
326
|
+
${Object.entries(vars).map(([k, v]) => ` ${k}: ${v};`).join("\n")}
|
|
327
|
+
}
|
|
328
|
+
`;
|
|
329
|
+
var designToCss = (design, selector = ":root") => block(selector, designToCssVars(design));
|
|
330
|
+
function defaultTokensCss(selector = ":root") {
|
|
331
|
+
const vars = {};
|
|
332
|
+
for (const [name, meta] of Object.entries(globalTokens)) {
|
|
333
|
+
vars[globalTokenToCssVar(name)] = meta.default;
|
|
334
|
+
}
|
|
335
|
+
for (const [comp, tokens] of Object.entries(componentTokens)) {
|
|
336
|
+
for (const [token, meta] of Object.entries(tokens)) {
|
|
337
|
+
vars[componentTokenToCssVar(comp, token)] = fallbackToCss(meta.fallback);
|
|
338
|
+
}
|
|
339
|
+
}
|
|
340
|
+
return block(selector, vars);
|
|
341
|
+
}
|
|
342
|
+
|
|
343
|
+
// src/validate.ts
|
|
344
|
+
var DESIGN_KEY_PATTERN = /^[a-z0-9][a-z0-9-]{1,62}$/;
|
|
345
|
+
var MAX_VALUE_LENGTH = 200;
|
|
346
|
+
var FORBIDDEN = /[;{}<>\\]|url\s*\(|expression\s*\(|@import|javascript:|\/\*/i;
|
|
347
|
+
var NUM = String.raw`-?(?:\d+\.?\d*|\.\d+)`;
|
|
348
|
+
var LENGTH = new RegExp(`^(?:0|${NUM}(?:px|rem|em|%|vh|vw|vmin|vmax|ch|ex|pt))$`);
|
|
349
|
+
var VAR = /^var\(--[a-z0-9-]+(?:\s*,\s*[^()]+)?\)$/i;
|
|
350
|
+
var CALC = /^(?:calc|min|max|clamp)\([a-z0-9.%+\-*/,\s()]+\)$/i;
|
|
351
|
+
var HEX = /^#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i;
|
|
352
|
+
var COLOR_FN = /^(?:rgba?|hsla?|hwb|lab|lch|oklab|oklch)\([0-9.%,\s/+-]+\)$/i;
|
|
353
|
+
var NAMED = /^[a-z]{3,30}$/i;
|
|
354
|
+
function isValidTokenValue(type, value) {
|
|
355
|
+
const v = value.trim();
|
|
356
|
+
if (!v || v.length > MAX_VALUE_LENGTH || FORBIDDEN.test(v)) return false;
|
|
357
|
+
if (VAR.test(v)) return true;
|
|
358
|
+
switch (type) {
|
|
359
|
+
case "color":
|
|
360
|
+
return HEX.test(v) || COLOR_FN.test(v) || NAMED.test(v);
|
|
361
|
+
case "length":
|
|
362
|
+
return LENGTH.test(v) || CALC.test(v);
|
|
363
|
+
case "number":
|
|
364
|
+
return new RegExp(`^${NUM}$`).test(v) || /^[a-z-]{1,30}$/i.test(v);
|
|
365
|
+
case "font-weight":
|
|
366
|
+
return /^(?:[1-9]00|normal|bold|lighter|bolder)$/.test(v);
|
|
367
|
+
case "duration":
|
|
368
|
+
return new RegExp(`^${NUM}(?:ms|s)$`).test(v);
|
|
369
|
+
case "font-family":
|
|
370
|
+
return /^[a-z0-9 ,'"-]+$/i.test(v);
|
|
371
|
+
case "shadow":
|
|
372
|
+
return v === "none" || /^[a-z0-9 ,.#%()/-]+$/i.test(v);
|
|
373
|
+
}
|
|
374
|
+
}
|
|
375
|
+
var isRecord = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
|
|
376
|
+
function validateDesign(input) {
|
|
377
|
+
const errors = [];
|
|
378
|
+
const err = (path, message) => errors.push({ path, message });
|
|
379
|
+
if (!isRecord(input))
|
|
380
|
+
return { valid: false, errors: [{ path: "", message: "must be an object" }] };
|
|
381
|
+
const allowed = /* @__PURE__ */ new Set(["$schema", "schemaVersion", "key", "name", "tokens", "components"]);
|
|
382
|
+
for (const k of Object.keys(input)) if (!allowed.has(k)) err(k, "unknown property");
|
|
383
|
+
if (input.schemaVersion !== SCHEMA_VERSION) err("schemaVersion", `must be ${SCHEMA_VERSION}`);
|
|
384
|
+
if (typeof input.key !== "string" || !DESIGN_KEY_PATTERN.test(input.key))
|
|
385
|
+
err("key", "must be a lowercase slug (a-z, 0-9, -), 2-63 chars");
|
|
386
|
+
if (typeof input.name !== "string" || !input.name.trim() || input.name.length > 100)
|
|
387
|
+
err("name", "must be a non-empty string (max 100 chars)");
|
|
388
|
+
const tokens = input.tokens ?? {};
|
|
389
|
+
if (!isRecord(tokens)) err("tokens", "must be an object");
|
|
390
|
+
else
|
|
391
|
+
for (const [name, value] of Object.entries(tokens)) {
|
|
392
|
+
const path = `tokens.${name}`;
|
|
393
|
+
if (!isGlobalTokenName(name)) err(path, "unknown token");
|
|
394
|
+
else if (typeof value !== "string") err(path, "must be a string");
|
|
395
|
+
else if (!isValidTokenValue(globalTokens[name].type, value))
|
|
396
|
+
err(path, `invalid ${globalTokens[name].type} value`);
|
|
397
|
+
}
|
|
398
|
+
const components = input.components ?? {};
|
|
399
|
+
if (!isRecord(components)) err("components", "must be an object");
|
|
400
|
+
else
|
|
401
|
+
for (const [comp, values] of Object.entries(components)) {
|
|
402
|
+
const cpath = `components.${comp}`;
|
|
403
|
+
if (!isComponentName(comp)) {
|
|
404
|
+
err(cpath, "unknown component");
|
|
405
|
+
continue;
|
|
406
|
+
}
|
|
407
|
+
if (!isRecord(values)) {
|
|
408
|
+
err(cpath, "must be an object");
|
|
409
|
+
continue;
|
|
410
|
+
}
|
|
411
|
+
const catalogue = componentTokens[comp];
|
|
412
|
+
for (const [token, value] of Object.entries(values)) {
|
|
413
|
+
const path = `${cpath}.${token}`;
|
|
414
|
+
const meta = Object.prototype.hasOwnProperty.call(catalogue, token) ? catalogue[token] : void 0;
|
|
415
|
+
if (!meta) err(path, "unknown token");
|
|
416
|
+
else if (typeof value !== "string") err(path, "must be a string");
|
|
417
|
+
else if (!isValidTokenValue(meta.type, value)) err(path, `invalid ${meta.type} value`);
|
|
418
|
+
}
|
|
419
|
+
}
|
|
420
|
+
if (errors.length) return { valid: false, errors };
|
|
421
|
+
return {
|
|
422
|
+
valid: true,
|
|
423
|
+
design: {
|
|
424
|
+
schemaVersion: SCHEMA_VERSION,
|
|
425
|
+
key: input.key,
|
|
426
|
+
name: input.name,
|
|
427
|
+
tokens,
|
|
428
|
+
components
|
|
429
|
+
}
|
|
430
|
+
};
|
|
431
|
+
}
|
|
432
|
+
|
|
433
|
+
// src/jsonSchema.ts
|
|
434
|
+
var stringMap = (entries) => ({
|
|
435
|
+
type: "object",
|
|
436
|
+
additionalProperties: false,
|
|
437
|
+
properties: Object.fromEntries(
|
|
438
|
+
Object.entries(entries).map(([k, m]) => [
|
|
439
|
+
k,
|
|
440
|
+
{ type: "string", maxLength: 200, title: m.label }
|
|
441
|
+
])
|
|
442
|
+
)
|
|
443
|
+
});
|
|
444
|
+
var designJsonSchema = {
|
|
445
|
+
$schema: "https://json-schema.org/draft/2020-12/schema",
|
|
446
|
+
$id: "https://payex-ds/design.schema.json",
|
|
447
|
+
title: "PayEx design system design",
|
|
448
|
+
type: "object",
|
|
449
|
+
additionalProperties: false,
|
|
450
|
+
required: ["schemaVersion", "key", "name"],
|
|
451
|
+
properties: {
|
|
452
|
+
$schema: { type: "string" },
|
|
453
|
+
schemaVersion: { const: SCHEMA_VERSION },
|
|
454
|
+
key: { type: "string", pattern: DESIGN_KEY_PATTERN.source },
|
|
455
|
+
name: { type: "string", minLength: 1, maxLength: 100 },
|
|
456
|
+
tokens: stringMap(globalTokens),
|
|
457
|
+
components: {
|
|
458
|
+
type: "object",
|
|
459
|
+
additionalProperties: false,
|
|
460
|
+
properties: Object.fromEntries(
|
|
461
|
+
Object.entries(componentTokens).map(([c2, tokens]) => [c2, stringMap(tokens)])
|
|
462
|
+
)
|
|
463
|
+
}
|
|
464
|
+
}
|
|
465
|
+
};
|
|
466
|
+
export {
|
|
467
|
+
DESIGN_KEY_PATTERN,
|
|
468
|
+
SCHEMA_VERSION,
|
|
469
|
+
componentTokenToCssVar,
|
|
470
|
+
componentTokens,
|
|
471
|
+
createDefaultDesign,
|
|
472
|
+
defaultTokensCss,
|
|
473
|
+
designJsonSchema,
|
|
474
|
+
designToCss,
|
|
475
|
+
designToCssVars,
|
|
476
|
+
fallbackToCss,
|
|
477
|
+
globalTokenToCssVar,
|
|
478
|
+
globalTokens,
|
|
479
|
+
isComponentName,
|
|
480
|
+
isGlobalTokenName,
|
|
481
|
+
isValidTokenValue,
|
|
482
|
+
mergeDesign,
|
|
483
|
+
validateDesign
|
|
484
|
+
};
|
|
485
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/catalogue.ts","../src/design.ts","../src/validate.ts","../src/jsonSchema.ts"],"sourcesContent":["export type TokenType =\n 'color' | 'length' | 'font-family' | 'font-weight' | 'number' | 'shadow' | 'duration';\n\nexport interface GlobalTokenMeta {\n type: TokenType;\n default: string;\n label: string;\n group: 'color' | 'typography' | 'shape' | 'spacing' | 'elevation' | 'motion';\n}\n\nexport interface ComponentTokenMeta {\n type: TokenType;\n label: string;\n /** Global token name to fall back to, or a literal CSS value. */\n fallback: string;\n}\n\nconst c = (def: string, label: string): GlobalTokenMeta => ({\n type: 'color',\n default: def,\n label,\n group: 'color',\n});\n\nexport const globalTokens = {\n colorPrimary: c('#2f2424', 'Primary'),\n colorOnPrimary: c('#ffffff', 'Text on primary'),\n colorPrimaryHover: c('#4a3b3b', 'Primary hover'),\n colorSecondary: c('#ffffff', 'Secondary'),\n colorOnSecondary: c('#2f2424', 'Text on secondary'),\n colorAccent: c('#fdc129', 'Accent'),\n colorBackground: c('#ffffff', 'Page background'),\n colorSurface: c('#ffffff', 'Surface'),\n colorSurfaceAlt: c('#f7f4f2', 'Alternate surface'),\n colorText: c('#2f2424', 'Text'),\n colorTextMuted: c('#6b5f5f', 'Muted text'),\n colorBorder: c('#c9c1bf', 'Border'),\n colorSuccess: c('#2b7d3a', 'Success'),\n colorSuccessBackground: c('#e6f4e8', 'Success background'),\n colorWarning: c('#8a5a00', 'Warning'),\n colorWarningBackground: c('#fff4d6', 'Warning background'),\n colorError: c('#c5131c', 'Error'),\n colorErrorBackground: c('#fdecec', 'Error background'),\n colorInfo: c('#1f5f99', 'Info'),\n colorInfoBackground: c('#e8f1fa', 'Info background'),\n colorFocusRing: c('#1f5f99', 'Focus ring'),\n colorLink: c('#1f5f99', 'Link'),\n colorLinkHover: c('#15426b', 'Link hover'),\n colorDisabled: c('#a59c9a', 'Disabled'),\n colorOverlay: c('rgba(0, 0, 0, 0.5)', 'Overlay'),\n fontFamily: {\n type: 'font-family',\n default: \"system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif\",\n label: 'Font family',\n group: 'typography',\n },\n fontFamilyHeading: {\n type: 'font-family',\n default: \"system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif\",\n label: 'Heading font family',\n group: 'typography',\n },\n fontSizeBase: { type: 'length', default: '1rem', label: 'Base font size', group: 'typography' },\n fontSizeSm: {\n type: 'length',\n default: '0.875rem',\n label: 'Small font size',\n group: 'typography',\n },\n fontSizeLg: { type: 'length', default: '1.25rem', label: 'Large font size', group: 'typography' },\n fontWeightRegular: {\n type: 'font-weight',\n default: '400',\n label: 'Regular weight',\n group: 'typography',\n },\n fontWeightBold: {\n type: 'font-weight',\n default: '700',\n label: 'Bold weight',\n group: 'typography',\n },\n lineHeight: { type: 'number', default: '1.5', label: 'Line height', group: 'typography' },\n borderRadius: { type: 'length', default: '4px', label: 'Border radius', group: 'shape' },\n borderRadiusSm: { type: 'length', default: '2px', label: 'Small border radius', group: 'shape' },\n borderRadiusLg: { type: 'length', default: '8px', label: 'Large border radius', group: 'shape' },\n borderWidth: { type: 'length', default: '1px', label: 'Border width', group: 'shape' },\n focusRingWidth: { type: 'length', default: '2px', label: 'Focus ring width', group: 'shape' },\n spacingUnit: { type: 'length', default: '8px', label: 'Spacing unit', group: 'spacing' },\n spacingXs: { type: 'length', default: '4px', label: 'Spacing XS', group: 'spacing' },\n spacingSm: { type: 'length', default: '8px', label: 'Spacing S', group: 'spacing' },\n spacingMd: { type: 'length', default: '16px', label: 'Spacing M', group: 'spacing' },\n spacingLg: { type: 'length', default: '24px', label: 'Spacing L', group: 'spacing' },\n spacingXl: { type: 'length', default: '40px', label: 'Spacing XL', group: 'spacing' },\n shadowSm: {\n type: 'shadow',\n default: '0 1px 2px rgba(0, 0, 0, 0.12)',\n label: 'Small shadow',\n group: 'elevation',\n },\n shadowMd: {\n type: 'shadow',\n default: '0 2px 8px rgba(0, 0, 0, 0.16)',\n label: 'Medium shadow',\n group: 'elevation',\n },\n shadowLg: {\n type: 'shadow',\n default: '0 8px 24px rgba(0, 0, 0, 0.2)',\n label: 'Large shadow',\n group: 'elevation',\n },\n durationFast: { type: 'duration', default: '120ms', label: 'Fast duration', group: 'motion' },\n durationNormal: { type: 'duration', default: '240ms', label: 'Normal duration', group: 'motion' },\n} as const satisfies Record<string, GlobalTokenMeta>;\n\nexport type GlobalTokenName = keyof typeof globalTokens;\n\nconst t = (type: TokenType, label: string, fallback: string): ComponentTokenMeta => ({\n type,\n label,\n fallback,\n});\n\nconst surface = {\n background: t('color', 'Background', 'colorSurface'),\n color: t('color', 'Text color', 'colorText'),\n borderColor: t('color', 'Border color', 'colorBorder'),\n borderRadius: t('length', 'Border radius', 'borderRadius'),\n padding: t('length', 'Padding', 'spacingMd'),\n};\n\nconst control = {\n borderRadius: t('length', 'Border radius', 'borderRadius'),\n borderColor: t('color', 'Border color', 'colorBorder'),\n checkedColor: t('color', 'Checked color', 'colorPrimary'),\n size: t('length', 'Size', '1.25rem'),\n};\n\nexport const componentTokens = {\n accordion: {\n ...surface,\n headerBackground: t('color', 'Header background', 'colorSurface'),\n headerFontWeight: t('font-weight', 'Header font weight', 'fontWeightBold'),\n },\n alert: {\n borderRadius: t('length', 'Border radius', 'borderRadius'),\n padding: t('length', 'Padding', 'spacingMd'),\n borderWidth: t('length', 'Accent border width', '4px'),\n },\n badge: {\n background: t('color', 'Background', 'colorPrimary'),\n color: t('color', 'Text color', 'colorOnPrimary'),\n borderRadius: t('length', 'Border radius', '999px'),\n fontSize: t('length', 'Font size', 'fontSizeSm'),\n },\n breadcrumb: {\n color: t('color', 'Link color', 'colorLink'),\n separatorColor: t('color', 'Separator color', 'colorTextMuted'),\n currentColor: t('color', 'Current page color', 'colorText'),\n },\n button: {\n background: t('color', 'Primary background', 'colorPrimary'),\n color: t('color', 'Primary text color', 'colorOnPrimary'),\n hoverBackground: t('color', 'Primary hover background', 'colorPrimaryHover'),\n secondaryBackground: t('color', 'Secondary background', 'colorSecondary'),\n secondaryColor: t('color', 'Secondary text color', 'colorOnSecondary'),\n borderRadius: t('length', 'Border radius', 'borderRadius'),\n paddingX: t('length', 'Horizontal padding', 'spacingLg'),\n paddingY: t('length', 'Vertical padding', 'spacingSm'),\n fontWeight: t('font-weight', 'Font weight', 'fontWeightBold'),\n },\n card: { ...surface, shadow: t('shadow', 'Shadow', 'shadowSm') },\n checkbox: control,\n datepicker: {\n selectedBackground: t('color', 'Selected day background', 'colorPrimary'),\n selectedColor: t('color', 'Selected day text', 'colorOnPrimary'),\n borderRadius: t('length', 'Border radius', 'borderRadius'),\n shadow: t('shadow', 'Popup shadow', 'shadowMd'),\n },\n dialog: {\n ...surface,\n padding: t('length', 'Padding', 'spacingLg'),\n shadow: t('shadow', 'Shadow', 'shadowLg'),\n overlay: t('color', 'Backdrop', 'colorOverlay'),\n maxWidth: t('length', 'Max width', '560px'),\n },\n dropdown: {\n ...surface,\n padding: t('length', 'Padding', 'spacingXs'),\n shadow: t('shadow', 'Shadow', 'shadowMd'),\n },\n expandable: {\n color: t('color', 'Toggle color', 'colorText'),\n fontWeight: t('font-weight', 'Toggle font weight', 'fontWeightBold'),\n },\n input: {\n background: t('color', 'Background', 'colorSurface'),\n color: t('color', 'Text color', 'colorText'),\n borderColor: t('color', 'Border color', 'colorBorder'),\n borderRadius: t('length', 'Border radius', 'borderRadius'),\n paddingX: t('length', 'Horizontal padding', 'spacingSm'),\n height: t('length', 'Height', '2.5rem'),\n },\n link: {\n color: t('color', 'Color', 'colorLink'),\n hoverColor: t('color', 'Hover color', 'colorLinkHover'),\n textDecoration: t('number', 'Underline (underline/none)', 'underline'),\n },\n list: {\n gap: t('length', 'Item spacing', 'spacingXs'),\n markerColor: t('color', 'Marker color', 'colorPrimary'),\n },\n loader: {\n color: t('color', 'Color', 'colorPrimary'),\n trackColor: t('color', 'Track color', 'colorBorder'),\n size: t('length', 'Size', '2rem'),\n },\n 'media-object': { gap: t('length', 'Gap', 'spacingMd') },\n pagination: {\n activeBackground: t('color', 'Active background', 'colorPrimary'),\n activeColor: t('color', 'Active text', 'colorOnPrimary'),\n borderRadius: t('length', 'Border radius', 'borderRadius'),\n },\n panel: { ...surface, background: t('color', 'Background', 'colorSurfaceAlt') },\n 'progress-steps': {\n activeColor: t('color', 'Active color', 'colorPrimary'),\n completedColor: t('color', 'Completed color', 'colorSuccess'),\n inactiveColor: t('color', 'Inactive color', 'colorBorder'),\n },\n radio: control,\n rangeslider: {\n trackColor: t('color', 'Track color', 'colorBorder'),\n fillColor: t('color', 'Fill color', 'colorPrimary'),\n thumbSize: t('length', 'Thumb size', '1.25rem'),\n },\n sheet: {\n ...surface,\n width: t('length', 'Width', '400px'),\n shadow: t('shadow', 'Shadow', 'shadowLg'),\n overlay: t('color', 'Backdrop', 'colorOverlay'),\n },\n select: {\n background: t('color', 'Background', 'colorSurface'),\n borderColor: t('color', 'Border color', 'colorBorder'),\n borderRadius: t('length', 'Border radius', 'borderRadius'),\n height: t('length', 'Height', '2.5rem'),\n },\n sidebar: {\n background: t('color', 'Background', 'colorSurfaceAlt'),\n color: t('color', 'Text color', 'colorText'),\n activeBackground: t('color', 'Active item background', 'colorPrimary'),\n activeColor: t('color', 'Active item text', 'colorOnPrimary'),\n width: t('length', 'Width', '260px'),\n },\n 'skip-link': {\n background: t('color', 'Background', 'colorPrimary'),\n color: t('color', 'Text color', 'colorOnPrimary'),\n },\n slab: {\n background: t('color', 'Background', 'colorSurfaceAlt'),\n padding: t('length', 'Padding', 'spacingLg'),\n borderRadius: t('length', 'Border radius', '0'),\n },\n status: {\n dotSize: t('length', 'Dot size', '0.625rem'),\n gap: t('length', 'Gap', 'spacingXs'),\n },\n table: {\n headerBackground: t('color', 'Header background', 'colorSurfaceAlt'),\n borderColor: t('color', 'Border color', 'colorBorder'),\n stripeBackground: t('color', 'Stripe background', 'colorSurfaceAlt'),\n cellPadding: t('length', 'Cell padding', 'spacingSm'),\n },\n tabs: {\n activeColor: t('color', 'Active color', 'colorPrimary'),\n color: t('color', 'Color', 'colorTextMuted'),\n indicatorHeight: t('length', 'Indicator height', '3px'),\n },\n tag: {\n background: t('color', 'Background', 'colorSurfaceAlt'),\n color: t('color', 'Text color', 'colorText'),\n borderRadius: t('length', 'Border radius', 'borderRadiusSm'),\n },\n toast: {\n background: t('color', 'Background', 'colorPrimary'),\n color: t('color', 'Text color', 'colorOnPrimary'),\n borderRadius: t('length', 'Border radius', 'borderRadius'),\n shadow: t('shadow', 'Shadow', 'shadowMd'),\n },\n togglebox: {\n checkedColor: t('color', 'On color', 'colorPrimary'),\n trackColor: t('color', 'Off color', 'colorDisabled'),\n width: t('length', 'Width', '2.75rem'),\n },\n tooltip: {\n background: t('color', 'Background', 'colorPrimary'),\n color: t('color', 'Text color', 'colorOnPrimary'),\n borderRadius: t('length', 'Border radius', 'borderRadiusSm'),\n },\n topbar: {\n background: t('color', 'Background', 'colorSurface'),\n color: t('color', 'Text color', 'colorText'),\n height: t('length', 'Height', '64px'),\n shadow: t('shadow', 'Shadow', 'shadowSm'),\n },\n} as const satisfies Record<string, Record<string, ComponentTokenMeta>>;\n\nexport type ComponentName = keyof typeof componentTokens;\nexport type ComponentTokenName<C extends ComponentName> = keyof (typeof componentTokens)[C] &\n string;\n","import {\n componentTokens,\n globalTokens,\n type ComponentName,\n type ComponentTokenName,\n type GlobalTokenName,\n} from './catalogue.js';\n\nexport const SCHEMA_VERSION = 1;\n\nexport type ComponentOverrides = {\n [C in ComponentName]?: Partial<Record<ComponentTokenName<C>, string>>;\n};\n\nexport interface DesignJson {\n schemaVersion: 1;\n key: string;\n name: string;\n tokens: Partial<Record<GlobalTokenName, string>>;\n components: ComponentOverrides;\n}\n\nconst kebab = (s: string): string => s.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);\n\nexport const globalTokenToCssVar = (name: string): string => `--pds-${kebab(name)}`;\n\nexport const componentTokenToCssVar = (component: string, token: string): string =>\n `--pds-${component}-${kebab(token)}`;\n\nexport const isGlobalTokenName = (name: string): name is GlobalTokenName =>\n Object.prototype.hasOwnProperty.call(globalTokens, name);\n\nexport const isComponentName = (name: string): name is ComponentName =>\n Object.prototype.hasOwnProperty.call(componentTokens, name);\n\n/** Resolves a component token fallback into a CSS value (`var(--pds-x)` or a literal). */\nexport const fallbackToCss = (fallback: string): string =>\n isGlobalTokenName(fallback) ? `var(${globalTokenToCssVar(fallback)})` : fallback;\n\nexport function createDefaultDesign(key = 'default', name = 'Default'): DesignJson {\n return { schemaVersion: SCHEMA_VERSION, key, name, tokens: {}, components: {} };\n}\n\nexport function mergeDesign(base: DesignJson, override: Partial<DesignJson>): DesignJson {\n const components: Record<string, Record<string, string>> = {};\n for (const src of [base.components, override.components ?? {}]) {\n for (const [comp, values] of Object.entries(src)) {\n components[comp] = { ...components[comp], ...(values as Record<string, string>) };\n }\n }\n return {\n schemaVersion: SCHEMA_VERSION,\n key: override.key ?? base.key,\n name: override.name ?? base.name,\n tokens: { ...base.tokens, ...override.tokens },\n components: components as ComponentOverrides,\n };\n}\n\n/**\n * CSS variables for a design: every global token (default or overridden) and every component token\n * (override or its fallback). Component fallbacks are emitted too so they re-resolve against the\n * design's globals when applied to a sub-tree (a `var()` is resolved where it is declared).\n */\nexport function designToCssVars(design: DesignJson): Record<string, string> {\n const vars: Record<string, string> = {};\n for (const [name, meta] of Object.entries(globalTokens)) {\n vars[globalTokenToCssVar(name)] =\n (design.tokens as Record<string, string | undefined>)[name] ?? meta.default;\n }\n const overrides = design.components as Record<string, Record<string, string> | undefined>;\n for (const [comp, tokens] of Object.entries(componentTokens)) {\n for (const [token, meta] of Object.entries(tokens)) {\n vars[componentTokenToCssVar(comp, token)] =\n overrides[comp]?.[token] ?? fallbackToCss(meta.fallback);\n }\n }\n return vars;\n}\n\nconst block = (selector: string, vars: Record<string, string>): string =>\n `${selector} {\\n${Object.entries(vars)\n .map(([k, v]) => ` ${k}: ${v};`)\n .join('\\n')}\\n}\\n`;\n\nexport const designToCss = (design: DesignJson, selector = ':root'): string =>\n block(selector, designToCssVars(design));\n\n/** Full default stylesheet: all global tokens and every component token mapped to its fallback. */\nexport function defaultTokensCss(selector = ':root'): string {\n const vars: Record<string, string> = {};\n for (const [name, meta] of Object.entries(globalTokens)) {\n vars[globalTokenToCssVar(name)] = meta.default;\n }\n for (const [comp, tokens] of Object.entries(componentTokens)) {\n for (const [token, meta] of Object.entries(tokens)) {\n vars[componentTokenToCssVar(comp, token)] = fallbackToCss(meta.fallback);\n }\n }\n return block(selector, vars);\n}\n","import { componentTokens, globalTokens, type TokenType } from './catalogue.js';\nimport { isComponentName, isGlobalTokenName, SCHEMA_VERSION, type DesignJson } from './design.js';\n\nexport interface ValidationError {\n path: string;\n message: string;\n}\n\nexport type ValidationResult =\n { valid: true; design: DesignJson } | { valid: false; errors: ValidationError[] };\n\nexport const DESIGN_KEY_PATTERN = /^[a-z0-9][a-z0-9-]{1,62}$/;\nconst MAX_VALUE_LENGTH = 200;\nconst FORBIDDEN = /[;{}<>\\\\]|url\\s*\\(|expression\\s*\\(|@import|javascript:|\\/\\*/i;\n\nconst NUM = String.raw`-?(?:\\d+\\.?\\d*|\\.\\d+)`;\nconst LENGTH = new RegExp(`^(?:0|${NUM}(?:px|rem|em|%|vh|vw|vmin|vmax|ch|ex|pt))$`);\nconst VAR = /^var\\(--[a-z0-9-]+(?:\\s*,\\s*[^()]+)?\\)$/i;\nconst CALC = /^(?:calc|min|max|clamp)\\([a-z0-9.%+\\-*/,\\s()]+\\)$/i;\nconst HEX = /^#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i;\nconst COLOR_FN = /^(?:rgba?|hsla?|hwb|lab|lch|oklab|oklch)\\([0-9.%,\\s/+-]+\\)$/i;\nconst NAMED = /^[a-z]{3,30}$/i;\n\nexport function isValidTokenValue(type: TokenType, value: string): boolean {\n const v = value.trim();\n if (!v || v.length > MAX_VALUE_LENGTH || FORBIDDEN.test(v)) return false;\n if (VAR.test(v)) return true;\n switch (type) {\n case 'color':\n return HEX.test(v) || COLOR_FN.test(v) || NAMED.test(v);\n case 'length':\n return LENGTH.test(v) || CALC.test(v);\n case 'number':\n return new RegExp(`^${NUM}$`).test(v) || /^[a-z-]{1,30}$/i.test(v);\n case 'font-weight':\n return /^(?:[1-9]00|normal|bold|lighter|bolder)$/.test(v);\n case 'duration':\n return new RegExp(`^${NUM}(?:ms|s)$`).test(v);\n case 'font-family':\n return /^[a-z0-9 ,'\"-]+$/i.test(v);\n case 'shadow':\n return v === 'none' || /^[a-z0-9 ,.#%()/-]+$/i.test(v);\n }\n}\n\nconst isRecord = (v: unknown): v is Record<string, unknown> =>\n typeof v === 'object' && v !== null && !Array.isArray(v);\n\nexport function validateDesign(input: unknown): ValidationResult {\n const errors: ValidationError[] = [];\n const err = (path: string, message: string) => errors.push({ path, message });\n\n if (!isRecord(input))\n return { valid: false, errors: [{ path: '', message: 'must be an object' }] };\n\n const allowed = new Set(['$schema', 'schemaVersion', 'key', 'name', 'tokens', 'components']);\n for (const k of Object.keys(input)) if (!allowed.has(k)) err(k, 'unknown property');\n\n if (input.schemaVersion !== SCHEMA_VERSION) err('schemaVersion', `must be ${SCHEMA_VERSION}`);\n if (typeof input.key !== 'string' || !DESIGN_KEY_PATTERN.test(input.key))\n err('key', 'must be a lowercase slug (a-z, 0-9, -), 2-63 chars');\n if (typeof input.name !== 'string' || !input.name.trim() || input.name.length > 100)\n err('name', 'must be a non-empty string (max 100 chars)');\n\n const tokens = input.tokens ?? {};\n if (!isRecord(tokens)) err('tokens', 'must be an object');\n else\n for (const [name, value] of Object.entries(tokens)) {\n const path = `tokens.${name}`;\n if (!isGlobalTokenName(name)) err(path, 'unknown token');\n else if (typeof value !== 'string') err(path, 'must be a string');\n else if (!isValidTokenValue(globalTokens[name].type, value))\n err(path, `invalid ${globalTokens[name].type} value`);\n }\n\n const components = input.components ?? {};\n if (!isRecord(components)) err('components', 'must be an object');\n else\n for (const [comp, values] of Object.entries(components)) {\n const cpath = `components.${comp}`;\n if (!isComponentName(comp)) {\n err(cpath, 'unknown component');\n continue;\n }\n if (!isRecord(values)) {\n err(cpath, 'must be an object');\n continue;\n }\n const catalogue = componentTokens[comp] as Record<string, { type: TokenType }>;\n for (const [token, value] of Object.entries(values)) {\n const path = `${cpath}.${token}`;\n const meta = Object.prototype.hasOwnProperty.call(catalogue, token)\n ? catalogue[token]\n : undefined;\n if (!meta) err(path, 'unknown token');\n else if (typeof value !== 'string') err(path, 'must be a string');\n else if (!isValidTokenValue(meta.type, value)) err(path, `invalid ${meta.type} value`);\n }\n }\n\n if (errors.length) return { valid: false, errors };\n return {\n valid: true,\n design: {\n schemaVersion: SCHEMA_VERSION,\n key: input.key as string,\n name: input.name as string,\n tokens: tokens as DesignJson['tokens'],\n components: components as DesignJson['components'],\n },\n };\n}\n","import { componentTokens, globalTokens } from './catalogue.js';\nimport { SCHEMA_VERSION } from './design.js';\nimport { DESIGN_KEY_PATTERN } from './validate.js';\n\nconst stringMap = (entries: Record<string, { label: string }>) => ({\n type: 'object',\n additionalProperties: false,\n properties: Object.fromEntries(\n Object.entries(entries).map(([k, m]) => [\n k,\n { type: 'string', maxLength: 200, title: m.label },\n ]),\n ),\n});\n\n/** JSON Schema (draft 2020-12) for design documents, generated from the token catalogue. */\nexport const designJsonSchema = {\n $schema: 'https://json-schema.org/draft/2020-12/schema',\n $id: 'https://payex-ds/design.schema.json',\n title: 'PayEx design system design',\n type: 'object',\n additionalProperties: false,\n required: ['schemaVersion', 'key', 'name'],\n properties: {\n $schema: { type: 'string' },\n schemaVersion: { const: SCHEMA_VERSION },\n key: { type: 'string', pattern: DESIGN_KEY_PATTERN.source },\n name: { type: 'string', minLength: 1, maxLength: 100 },\n tokens: stringMap(globalTokens),\n components: {\n type: 'object',\n additionalProperties: false,\n properties: Object.fromEntries(\n Object.entries(componentTokens).map(([c, tokens]) => [c, stringMap(tokens)]),\n ),\n },\n },\n} as const;\n"],"mappings":"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","names":["c"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,25 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@payex-ds/schema",
|
|
3
|
-
"version": "0.
|
|
4
|
-
"
|
|
5
|
-
"
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"publishConfig": {
|
|
6
|
+
"access": "public"
|
|
7
|
+
},
|
|
8
|
+
"main": "./dist/index.js",
|
|
9
|
+
"types": "./dist/index.d.ts",
|
|
10
|
+
"exports": {
|
|
11
|
+
".": {
|
|
12
|
+
"source": "./src/index.ts",
|
|
13
|
+
"types": "./dist/index.d.ts",
|
|
14
|
+
"import": "./dist/index.js"
|
|
15
|
+
}
|
|
16
|
+
},
|
|
17
|
+
"files": [
|
|
18
|
+
"dist"
|
|
19
|
+
],
|
|
20
|
+
"sideEffects": false,
|
|
21
|
+
"scripts": {
|
|
22
|
+
"build": "tsup",
|
|
23
|
+
"typecheck": "tsc --noEmit"
|
|
24
|
+
}
|
|
6
25
|
}
|