@phcdevworks/spectre-tokens 2.2.0 → 2.4.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 +196 -23
- package/dist/index.cjs +68 -236
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +19 -25
- package/dist/index.d.cts +11 -1
- package/dist/index.d.ts +11 -1
- package/dist/index.js +68 -236
- package/dist/index.js.map +1 -1
- package/package.json +18 -11
- package/tokens/components.json +23 -17
- package/tokens/modes.json +20 -20
- package/tokens/primitives.json +3 -3
- package/tokens/typography.json +2 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@phcdevworks/spectre-tokens",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.4.0",
|
|
4
4
|
"description": "@phcdevworks/spectre-tokens is the design-token package of the Spectre system for downstream Spectre packages and compatible applications.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"phcdevworks",
|
|
@@ -57,15 +57,24 @@
|
|
|
57
57
|
"build": "npm run build:ts && npm run build:css",
|
|
58
58
|
"build:ts": "tsup --config tsup.config.ts",
|
|
59
59
|
"build:css": "tsx scripts/build-css.ts",
|
|
60
|
+
"check:manifest": "tsx scripts/check-contract-manifest.ts",
|
|
61
|
+
"check:docs": "tsx scripts/check-doc-contract.ts",
|
|
62
|
+
"check:dist": "node scripts/check-dist-sync.js",
|
|
60
63
|
"check:structure": "tsx scripts/assert-core-tokens.ts",
|
|
61
64
|
"check:locked": "tsx scripts/check-locked-color-contracts.ts",
|
|
62
65
|
"check:contrast": "tsx scripts/check-contrast.ts",
|
|
63
66
|
"check:regression": "tsx scripts/check-tokens-regression.ts",
|
|
67
|
+
"check:exports": "node scripts/check-public-exports.mjs",
|
|
68
|
+
"check:css": "tsx scripts/check-css-contract.ts",
|
|
69
|
+
"check:tailwind": "tsx scripts/check-tailwind-contract.ts",
|
|
70
|
+
"check:consumer": "tsx scripts/check-consumer-smoke.ts",
|
|
71
|
+
"check:classification": "tsx scripts/check-change-classification.ts",
|
|
64
72
|
"lint": "eslint .",
|
|
65
73
|
"format": "prettier --write .",
|
|
66
|
-
"check": "npm run build && npm run check:structure && npm run check:locked && npm run check:contrast && npm run check:regression && npm run lint",
|
|
74
|
+
"check": "npm run build && npm run check:manifest && npm run check:structure && npm run check:locked && npm run check:contrast && npm run check:regression && npm run check:docs && npm run check:exports && npm run check:css && npm run check:tailwind && npm run check:consumer && npm run check:classification && npm run check:dist && npm run lint",
|
|
67
75
|
"check:all": "npm run check",
|
|
68
|
-
"test": "npm run check"
|
|
76
|
+
"test": "npm run check",
|
|
77
|
+
"prepublishOnly": "npm run check"
|
|
69
78
|
},
|
|
70
79
|
"publishConfig": {
|
|
71
80
|
"access": "public"
|
|
@@ -74,19 +83,17 @@
|
|
|
74
83
|
"typescript": "^5.9 || ^6.0"
|
|
75
84
|
},
|
|
76
85
|
"devDependencies": {
|
|
77
|
-
"@types/chroma-js": "^3.1.2",
|
|
78
86
|
"@types/node": "^25.6.0",
|
|
79
|
-
"@typescript-eslint/eslint-plugin": "^8.
|
|
80
|
-
"@typescript-eslint/parser": "^8.
|
|
81
|
-
"chroma-js": "^3.2.0",
|
|
87
|
+
"@typescript-eslint/eslint-plugin": "^8.59.0",
|
|
88
|
+
"@typescript-eslint/parser": "^8.59.0",
|
|
82
89
|
"colord": "^2.9.3",
|
|
83
|
-
"eslint": "^10.2.
|
|
90
|
+
"eslint": "^10.2.1",
|
|
84
91
|
"jiti": "^2.6.1",
|
|
85
|
-
"prettier": "^3.8.
|
|
92
|
+
"prettier": "^3.8.3",
|
|
86
93
|
"ts-node": "^10.9.2",
|
|
87
94
|
"tsup": "^8.5.1",
|
|
88
95
|
"tsx": "^4.21.0",
|
|
89
|
-
"typescript": "^6.0.
|
|
90
|
-
"typescript-eslint": "^8.
|
|
96
|
+
"typescript": "^6.0.3",
|
|
97
|
+
"typescript-eslint": "^8.59.0"
|
|
91
98
|
}
|
|
92
99
|
}
|
package/tokens/components.json
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
}
|
|
9
9
|
},
|
|
10
10
|
"textMuted": {
|
|
11
|
-
"value": "{colors.neutral.
|
|
11
|
+
"value": "{colors.neutral.600}",
|
|
12
12
|
"metadata": {
|
|
13
13
|
"pair": "surface.card"
|
|
14
14
|
}
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"text": {
|
|
19
19
|
"value": "{colors.neutral.900}",
|
|
20
20
|
"metadata": {
|
|
21
|
-
"pair": "
|
|
21
|
+
"pair": "forms.default.bg"
|
|
22
22
|
}
|
|
23
23
|
},
|
|
24
24
|
"placeholder": {
|
|
@@ -158,23 +158,26 @@
|
|
|
158
158
|
"text": {
|
|
159
159
|
"value": "{colors.neutral.700}",
|
|
160
160
|
"metadata": {
|
|
161
|
-
"pair": "component.testimonial.
|
|
161
|
+
"pair": "component.testimonial.bgHover"
|
|
162
162
|
}
|
|
163
163
|
},
|
|
164
164
|
"authorName": {
|
|
165
165
|
"value": "{colors.neutral.900}",
|
|
166
166
|
"metadata": {
|
|
167
|
-
"pair": "component.testimonial.
|
|
167
|
+
"pair": "component.testimonial.bgHover"
|
|
168
168
|
}
|
|
169
169
|
},
|
|
170
170
|
"authorTitle": {
|
|
171
|
-
"value": "{colors.neutral.
|
|
171
|
+
"value": "{colors.neutral.600}",
|
|
172
172
|
"metadata": {
|
|
173
|
-
"pair": "component.testimonial.
|
|
173
|
+
"pair": "component.testimonial.bgHover"
|
|
174
174
|
}
|
|
175
175
|
},
|
|
176
176
|
"quoteMark": {
|
|
177
|
-
"value": "{colors.neutral.
|
|
177
|
+
"value": "{colors.neutral.600}",
|
|
178
|
+
"metadata": {
|
|
179
|
+
"pair": "component.testimonial.bgHover"
|
|
180
|
+
}
|
|
178
181
|
}
|
|
179
182
|
},
|
|
180
183
|
"pricingCard": {
|
|
@@ -217,13 +220,13 @@
|
|
|
217
220
|
"price": {
|
|
218
221
|
"value": "{colors.neutral.900}",
|
|
219
222
|
"metadata": {
|
|
220
|
-
"pair": "component.pricingCard.
|
|
223
|
+
"pair": "component.pricingCard.bgHover"
|
|
221
224
|
}
|
|
222
225
|
},
|
|
223
226
|
"priceDescription": {
|
|
224
|
-
"value": "{colors.neutral.
|
|
227
|
+
"value": "{colors.neutral.600}",
|
|
225
228
|
"metadata": {
|
|
226
|
-
"pair": "component.pricingCard.
|
|
229
|
+
"pair": "component.pricingCard.bgHover"
|
|
227
230
|
}
|
|
228
231
|
}
|
|
229
232
|
},
|
|
@@ -275,7 +278,7 @@
|
|
|
275
278
|
"value": "{colors.info.500} / 0.4"
|
|
276
279
|
},
|
|
277
280
|
"focusVisible": {
|
|
278
|
-
"value": "{
|
|
281
|
+
"value": "{colors.info.500} / 0.4"
|
|
279
282
|
}
|
|
280
283
|
},
|
|
281
284
|
"secondary": {
|
|
@@ -316,7 +319,7 @@
|
|
|
316
319
|
"value": "{colors.info.500} / 0.4"
|
|
317
320
|
},
|
|
318
321
|
"focusVisible": {
|
|
319
|
-
"value": "{
|
|
322
|
+
"value": "{colors.info.500} / 0.4"
|
|
320
323
|
}
|
|
321
324
|
},
|
|
322
325
|
"ghost": {
|
|
@@ -348,7 +351,7 @@
|
|
|
348
351
|
"value": "{colors.info.500} / 0.4"
|
|
349
352
|
},
|
|
350
353
|
"focusVisible": {
|
|
351
|
-
"value": "{
|
|
354
|
+
"value": "{colors.info.500} / 0.4"
|
|
352
355
|
}
|
|
353
356
|
},
|
|
354
357
|
"danger": {
|
|
@@ -482,7 +485,7 @@
|
|
|
482
485
|
"value": "{colors.accent.500} / 0.4"
|
|
483
486
|
},
|
|
484
487
|
"focusVisible": {
|
|
485
|
-
"value": "{
|
|
488
|
+
"value": "{colors.accent.500} / 0.4"
|
|
486
489
|
}
|
|
487
490
|
}
|
|
488
491
|
},
|
|
@@ -495,7 +498,10 @@
|
|
|
495
498
|
"value": "{colors.neutral.300}"
|
|
496
499
|
},
|
|
497
500
|
"text": {
|
|
498
|
-
"value": "{colors.neutral.900}"
|
|
501
|
+
"value": "{colors.neutral.900}",
|
|
502
|
+
"metadata": {
|
|
503
|
+
"pair": "forms.default.bg"
|
|
504
|
+
}
|
|
499
505
|
},
|
|
500
506
|
"placeholder": {
|
|
501
507
|
"value": "{colors.neutral.500}",
|
|
@@ -519,10 +525,10 @@
|
|
|
519
525
|
},
|
|
520
526
|
"focusVisible": {
|
|
521
527
|
"border": {
|
|
522
|
-
"value": "{
|
|
528
|
+
"value": "{colors.info.500}"
|
|
523
529
|
},
|
|
524
530
|
"ring": {
|
|
525
|
-
"value": "{
|
|
531
|
+
"value": "{colors.info.500}"
|
|
526
532
|
}
|
|
527
533
|
},
|
|
528
534
|
"valid": {
|
package/tokens/modes.json
CHANGED
|
@@ -252,25 +252,25 @@
|
|
|
252
252
|
"text": {
|
|
253
253
|
"value": "{colors.neutral.700}",
|
|
254
254
|
"metadata": {
|
|
255
|
-
"pair": "modes.default.component.testimonial.
|
|
255
|
+
"pair": "modes.default.component.testimonial.bgHover"
|
|
256
256
|
}
|
|
257
257
|
},
|
|
258
258
|
"authorName": {
|
|
259
259
|
"value": "{colors.neutral.900}",
|
|
260
260
|
"metadata": {
|
|
261
|
-
"pair": "modes.default.component.testimonial.
|
|
261
|
+
"pair": "modes.default.component.testimonial.bgHover"
|
|
262
262
|
}
|
|
263
263
|
},
|
|
264
264
|
"authorTitle": {
|
|
265
|
-
"value": "{colors.neutral.
|
|
265
|
+
"value": "{colors.neutral.600}",
|
|
266
266
|
"metadata": {
|
|
267
|
-
"pair": "modes.default.component.testimonial.
|
|
267
|
+
"pair": "modes.default.component.testimonial.bgHover"
|
|
268
268
|
}
|
|
269
269
|
},
|
|
270
270
|
"quoteMark": {
|
|
271
|
-
"value": "{colors.neutral.
|
|
271
|
+
"value": "{colors.neutral.600}",
|
|
272
272
|
"metadata": {
|
|
273
|
-
"pair": "modes.default.component.testimonial.
|
|
273
|
+
"pair": "modes.default.component.testimonial.bgHover"
|
|
274
274
|
}
|
|
275
275
|
}
|
|
276
276
|
},
|
|
@@ -314,13 +314,13 @@
|
|
|
314
314
|
"price": {
|
|
315
315
|
"value": "{colors.neutral.900}",
|
|
316
316
|
"metadata": {
|
|
317
|
-
"pair": "modes.default.component.pricingCard.
|
|
317
|
+
"pair": "modes.default.component.pricingCard.bgHover"
|
|
318
318
|
}
|
|
319
319
|
},
|
|
320
320
|
"priceDescription": {
|
|
321
|
-
"value": "{colors.neutral.
|
|
321
|
+
"value": "{colors.neutral.600}",
|
|
322
322
|
"metadata": {
|
|
323
|
-
"pair": "modes.default.component.pricingCard.
|
|
323
|
+
"pair": "modes.default.component.pricingCard.bgHover"
|
|
324
324
|
}
|
|
325
325
|
}
|
|
326
326
|
},
|
|
@@ -363,7 +363,7 @@
|
|
|
363
363
|
}
|
|
364
364
|
},
|
|
365
365
|
"overlay": {
|
|
366
|
-
"value": "{colors.
|
|
366
|
+
"value": "{colors.black} / 0.6"
|
|
367
367
|
},
|
|
368
368
|
"alternate": {
|
|
369
369
|
"value": "{colors.neutral.800}",
|
|
@@ -372,7 +372,7 @@
|
|
|
372
372
|
}
|
|
373
373
|
},
|
|
374
374
|
"hero": {
|
|
375
|
-
"value": "linear-gradient(135deg, {colors.accent.
|
|
375
|
+
"value": "linear-gradient(135deg, {colors.accent.700} 0%, {colors.accent.900} 100%)"
|
|
376
376
|
}
|
|
377
377
|
},
|
|
378
378
|
"text": {
|
|
@@ -616,25 +616,25 @@
|
|
|
616
616
|
"text": {
|
|
617
617
|
"value": "{colors.neutral.200}",
|
|
618
618
|
"metadata": {
|
|
619
|
-
"pair": "modes.dark.component.testimonial.
|
|
619
|
+
"pair": "modes.dark.component.testimonial.bgHover"
|
|
620
620
|
}
|
|
621
621
|
},
|
|
622
622
|
"authorName": {
|
|
623
623
|
"value": "{colors.neutral.100}",
|
|
624
624
|
"metadata": {
|
|
625
|
-
"pair": "modes.dark.component.testimonial.
|
|
625
|
+
"pair": "modes.dark.component.testimonial.bgHover"
|
|
626
626
|
}
|
|
627
627
|
},
|
|
628
628
|
"authorTitle": {
|
|
629
|
-
"value": "{colors.neutral.
|
|
629
|
+
"value": "{colors.neutral.300}",
|
|
630
630
|
"metadata": {
|
|
631
|
-
"pair": "modes.dark.component.testimonial.
|
|
631
|
+
"pair": "modes.dark.component.testimonial.bgHover"
|
|
632
632
|
}
|
|
633
633
|
},
|
|
634
634
|
"quoteMark": {
|
|
635
|
-
"value": "{colors.neutral.
|
|
635
|
+
"value": "{colors.neutral.300}",
|
|
636
636
|
"metadata": {
|
|
637
|
-
"pair": "modes.dark.component.testimonial.
|
|
637
|
+
"pair": "modes.dark.component.testimonial.bgHover"
|
|
638
638
|
}
|
|
639
639
|
}
|
|
640
640
|
},
|
|
@@ -678,13 +678,13 @@
|
|
|
678
678
|
"price": {
|
|
679
679
|
"value": "{colors.neutral.100}",
|
|
680
680
|
"metadata": {
|
|
681
|
-
"pair": "modes.dark.component.pricingCard.
|
|
681
|
+
"pair": "modes.dark.component.pricingCard.bgHover"
|
|
682
682
|
}
|
|
683
683
|
},
|
|
684
684
|
"priceDescription": {
|
|
685
|
-
"value": "{colors.neutral.
|
|
685
|
+
"value": "{colors.neutral.300}",
|
|
686
686
|
"metadata": {
|
|
687
|
-
"pair": "modes.dark.component.pricingCard.
|
|
687
|
+
"pair": "modes.dark.component.pricingCard.bgHover"
|
|
688
688
|
}
|
|
689
689
|
}
|
|
690
690
|
},
|
package/tokens/primitives.json
CHANGED
|
@@ -24,9 +24,9 @@
|
|
|
24
24
|
},
|
|
25
25
|
"shadows": {
|
|
26
26
|
"none": "none",
|
|
27
|
-
"sm": "0 1px 2px 0 {colors.
|
|
28
|
-
"md": "0 2px 6px -1px {colors.
|
|
29
|
-
"lg": "0 6px 16px -4px {colors.
|
|
27
|
+
"sm": "0 1px 2px 0 {colors.black} / 0.06",
|
|
28
|
+
"md": "0 2px 6px -1px {colors.black} / 0.08",
|
|
29
|
+
"lg": "0 6px 16px -4px {colors.black} / 0.12"
|
|
30
30
|
},
|
|
31
31
|
"breakpoints": {
|
|
32
32
|
"sm": "640px",
|