@phcdevworks/spectre-ui 1.5.0 → 1.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +500 -0
- package/README.md +328 -35
- package/dist/base.css +23 -26
- package/dist/components.css +683 -79
- package/dist/index.cjs +275 -44
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +683 -79
- package/dist/index.d.cts +125 -2
- package/dist/index.d.ts +125 -2
- package/dist/index.js +268 -45
- package/dist/index.js.map +1 -1
- package/dist/utilities.css +23 -26
- package/package.json +34 -29
package/dist/utilities.css
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
--sp-surface-page: #f7f8fb;
|
|
3
3
|
--sp-surface-card: #ffffff;
|
|
4
4
|
--sp-surface-input: #ffffff;
|
|
5
|
-
--sp-surface-overlay: rgba(
|
|
5
|
+
--sp-surface-overlay: rgba(0, 0, 0, 0.6);
|
|
6
6
|
--sp-surface-alternate: #eef1f6;
|
|
7
7
|
--sp-surface-hero: linear-gradient(135deg, #5b6ee1 0%, #6f3fd7 100%);
|
|
8
8
|
--sp-text-on-page-default: #141b24;
|
|
@@ -144,10 +144,14 @@
|
|
|
144
144
|
--sp-layout-container-max-width: 72rem;
|
|
145
145
|
--sp-border-width-base: 1px;
|
|
146
146
|
--sp-border-width-thick: 2px;
|
|
147
|
+
--sp-border-style-none: none;
|
|
148
|
+
--sp-border-style-solid: solid;
|
|
147
149
|
--sp-radius-none: 0;
|
|
148
150
|
--sp-radius-sm: 2px;
|
|
149
151
|
--sp-radius-md: 4px;
|
|
150
152
|
--sp-radius-lg: 8px;
|
|
153
|
+
--sp-radius-xl: 12px;
|
|
154
|
+
--sp-radius-2xl: 16px;
|
|
151
155
|
--sp-radius-pill: 999px;
|
|
152
156
|
--sp-font-family-sans: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
|
|
153
157
|
--sp-font-family-serif: 'Times New Roman', Times, serif;
|
|
@@ -183,34 +187,21 @@
|
|
|
183
187
|
--sp-font-6xl-line-height: 5rem;
|
|
184
188
|
--sp-font-6xl-weight: 900;
|
|
185
189
|
--sp-font-xs-letter-spacing: 0.02em;
|
|
186
|
-
--sp-
|
|
187
|
-
--sp-
|
|
188
|
-
--sp-
|
|
189
|
-
--sp-
|
|
190
|
-
--sp-
|
|
191
|
-
--sp-
|
|
192
|
-
--sp-
|
|
193
|
-
--sp-
|
|
194
|
-
--sp-
|
|
195
|
-
--sp-badge-neutral-text: #374253;
|
|
196
|
-
--sp-badge-info-bg: #e0f2fe;
|
|
197
|
-
--sp-badge-info-text: #075985;
|
|
198
|
-
--sp-badge-success-bg: #dcfce7;
|
|
199
|
-
--sp-badge-success-text: #166534;
|
|
200
|
-
--sp-badge-warning-bg: #fff1c2;
|
|
201
|
-
--sp-badge-warning-text: #8f5200;
|
|
202
|
-
--sp-badge-danger-bg: #fee2e2;
|
|
203
|
-
--sp-badge-danger-text: #991b1b;
|
|
204
|
-
--sp-icon-box-bg: #ffffff;
|
|
205
|
-
--sp-icon-box-border: #d9dfeb;
|
|
206
|
-
--sp-icon-box-icon-default: #0369a1;
|
|
207
|
-
--sp-icon-box-icon-success: #16a34a;
|
|
208
|
-
--sp-icon-box-icon-warning: #d48806;
|
|
209
|
-
--sp-icon-box-icon-danger: #dc2626;
|
|
190
|
+
--sp-font-sm-letter-spacing: 0em;
|
|
191
|
+
--sp-font-md-letter-spacing: 0em;
|
|
192
|
+
--sp-font-lg-letter-spacing: 0em;
|
|
193
|
+
--sp-font-xl-letter-spacing: 0em;
|
|
194
|
+
--sp-font-2xl-letter-spacing: 0em;
|
|
195
|
+
--sp-font-3xl-letter-spacing: 0em;
|
|
196
|
+
--sp-font-4xl-letter-spacing: 0em;
|
|
197
|
+
--sp-font-5xl-letter-spacing: 0em;
|
|
198
|
+
--sp-font-6xl-letter-spacing: 0em;
|
|
210
199
|
--sp-shadow-none: none;
|
|
211
200
|
--sp-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
|
|
212
201
|
--sp-shadow-md: 0 2px 6px -1px rgba(0, 0, 0, 0.08);
|
|
213
202
|
--sp-shadow-lg: 0 6px 16px -4px rgba(0, 0, 0, 0.12);
|
|
203
|
+
--sp-shadow-xl: 0 12px 24px -6px rgba(0, 0, 0, 0.15);
|
|
204
|
+
--sp-shadow-2xl: 0 20px 48px -12px rgba(0, 0, 0, 0.20);
|
|
214
205
|
--sp-breakpoint-sm: 640px;
|
|
215
206
|
--sp-breakpoint-md: 768px;
|
|
216
207
|
--sp-breakpoint-lg: 1024px;
|
|
@@ -224,20 +215,26 @@
|
|
|
224
215
|
--sp-z-index-modal: 1400;
|
|
225
216
|
--sp-z-index-popover: 1500;
|
|
226
217
|
--sp-z-index-tooltip: 1600;
|
|
218
|
+
--sp-z-index-toast: 1700;
|
|
227
219
|
--sp-duration-instant: 75ms;
|
|
228
220
|
--sp-duration-fast: 150ms;
|
|
229
221
|
--sp-duration-base: 200ms;
|
|
222
|
+
--sp-duration-relaxed: 250ms;
|
|
230
223
|
--sp-duration-moderate: 300ms;
|
|
231
224
|
--sp-duration-slow: 500ms;
|
|
232
225
|
--sp-duration-slower: 700ms;
|
|
226
|
+
--sp-duration-long: 1000ms;
|
|
227
|
+
--sp-duration-slowest: 1200ms;
|
|
233
228
|
--sp-easing-linear: linear;
|
|
234
229
|
--sp-easing-in: cubic-bezier(0.4, 0, 1, 1);
|
|
235
230
|
--sp-easing-out: cubic-bezier(0, 0, 0.2, 1);
|
|
236
231
|
--sp-easing-inout: cubic-bezier(0.4, 0, 0.2, 1);
|
|
237
232
|
--sp-easing-spring: cubic-bezier(0.4, 0, 0.2, 1);
|
|
233
|
+
--sp-easing-overshoot: cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
238
234
|
--sp-opacity-disabled: 0.38;
|
|
239
235
|
--sp-opacity-hover: 0.92;
|
|
240
236
|
--sp-opacity-active: 0.84;
|
|
237
|
+
--sp-opacity-loading: 0.6;
|
|
241
238
|
--sp-opacity-focus: 1;
|
|
242
239
|
--sp-opacity-overlay: 0.5;
|
|
243
240
|
--sp-opacity-tooltip: 0.95;
|
|
@@ -369,7 +366,7 @@
|
|
|
369
366
|
--sp-button-text-default: #eef1f6;
|
|
370
367
|
--sp-button-text-on-primary: #ffffff;
|
|
371
368
|
--sp-badge-neutral-bg: #374253;
|
|
372
|
-
--sp-badge-neutral-text: #
|
|
369
|
+
--sp-badge-neutral-text: #f7f8fb;
|
|
373
370
|
--sp-badge-info-bg: #0c4a6e;
|
|
374
371
|
--sp-badge-info-text: #e0f2fe;
|
|
375
372
|
--sp-badge-success-bg: #166534;
|
package/package.json
CHANGED
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@phcdevworks/spectre-ui",
|
|
3
|
-
"version": "1.
|
|
4
|
-
"description": "@phcdevworks/spectre-ui is the
|
|
3
|
+
"version": "1.7.0",
|
|
4
|
+
"description": "@phcdevworks/spectre-ui is the Layer 2 styling contract between @phcdevworks/spectre-tokens and downstream adapters or apps.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"phcdevworks",
|
|
7
7
|
"spectre",
|
|
8
8
|
"spectre-ui",
|
|
9
9
|
"design-system",
|
|
10
10
|
"design-tokens",
|
|
11
|
-
"
|
|
12
|
-
"
|
|
13
|
-
"ui-components",
|
|
14
|
-
"tailwindcss",
|
|
11
|
+
"class-recipes",
|
|
12
|
+
"css-bundles",
|
|
15
13
|
"css-utilities",
|
|
16
14
|
"css-framework",
|
|
15
|
+
"tailwindcss",
|
|
16
|
+
"tailwind-preset",
|
|
17
17
|
"tokens",
|
|
18
18
|
"utilities"
|
|
19
19
|
],
|
|
@@ -34,10 +34,11 @@
|
|
|
34
34
|
},
|
|
35
35
|
"homepage": "https://github.com/phcdevworks/spectre-ui#readme",
|
|
36
36
|
"engines": {
|
|
37
|
-
"node": "^22.
|
|
37
|
+
"node": "^22.13.0 || >=24.0.0",
|
|
38
|
+
"npm": ">=10.0.0"
|
|
38
39
|
},
|
|
39
40
|
"type": "module",
|
|
40
|
-
"packageManager": "npm@11.
|
|
41
|
+
"packageManager": "npm@11.16.0",
|
|
41
42
|
"main": "./dist/index.cjs",
|
|
42
43
|
"module": "./dist/index.js",
|
|
43
44
|
"types": "./dist/index.d.ts",
|
|
@@ -60,6 +61,7 @@
|
|
|
60
61
|
"files": [
|
|
61
62
|
"dist",
|
|
62
63
|
"README.md",
|
|
64
|
+
"CHANGELOG.md",
|
|
63
65
|
"LICENSE"
|
|
64
66
|
],
|
|
65
67
|
"sideEffects": [
|
|
@@ -70,22 +72,25 @@
|
|
|
70
72
|
],
|
|
71
73
|
"scripts": {
|
|
72
74
|
"build": "tsup --config tsup.config.ts && npm run build:css",
|
|
73
|
-
"build:css": "node ./scripts/build-css.
|
|
74
|
-
"
|
|
75
|
+
"build:css": "node --experimental-strip-types ./scripts/build-css.ts",
|
|
76
|
+
"check": "npm run ci:verify",
|
|
77
|
+
"ci:verify": "npm run validate:runtime && npm run lint && npm run validate:changelog && npm run validate:exports && npm run validate:readme && npm run validate:tokens && npm run build && npm run validate:tailwind && npm run validate:css-contract && npm test",
|
|
75
78
|
"dev": "tsup --config tsup.config.ts --watch",
|
|
76
79
|
"clean": "rm -rf dist",
|
|
80
|
+
"release:propose": "node --experimental-strip-types ./scripts/propose-version.ts",
|
|
77
81
|
"lint": "eslint .",
|
|
78
82
|
"pretest": "npm run build",
|
|
79
83
|
"format": "prettier --write .",
|
|
80
84
|
"test": "vitest run",
|
|
81
|
-
"validate:css-contract": "node ./scripts/validate-css-contract.
|
|
82
|
-
"validate:exports": "node ./scripts/validate-exports.
|
|
83
|
-
"validate:exports:update": "node ./scripts/validate-exports.
|
|
84
|
-
"validate:runtime": "node ./scripts/validate-runtime.
|
|
85
|
-
"validate:tailwind": "node ./scripts/validate-tailwind-contract.
|
|
86
|
-
"validate:tailwind:update": "node ./scripts/validate-tailwind-contract.
|
|
87
|
-
"validate:readme": "node ./scripts/validate-readme-contract.
|
|
88
|
-
"validate:
|
|
85
|
+
"validate:css-contract": "node --experimental-strip-types ./scripts/validate-css-contract.ts",
|
|
86
|
+
"validate:exports": "node --experimental-strip-types ./scripts/validate-exports.ts",
|
|
87
|
+
"validate:exports:update": "node --experimental-strip-types ./scripts/validate-exports.ts --update",
|
|
88
|
+
"validate:runtime": "node --experimental-strip-types ./scripts/validate-runtime.ts",
|
|
89
|
+
"validate:tailwind": "node --experimental-strip-types ./scripts/validate-tailwind-contract.ts",
|
|
90
|
+
"validate:tailwind:update": "node --experimental-strip-types ./scripts/validate-tailwind-contract.ts --update",
|
|
91
|
+
"validate:readme": "node --experimental-strip-types ./scripts/validate-readme-contract.ts",
|
|
92
|
+
"validate:changelog": "node --experimental-strip-types ./scripts/validate-changelog.ts",
|
|
93
|
+
"validate:tokens": "node --experimental-strip-types ./scripts/validate-tokens.ts"
|
|
89
94
|
},
|
|
90
95
|
"publishConfig": {
|
|
91
96
|
"access": "public"
|
|
@@ -95,25 +100,25 @@
|
|
|
95
100
|
"typescript": "^5.9 || ^6.0"
|
|
96
101
|
},
|
|
97
102
|
"dependencies": {
|
|
98
|
-
"@phcdevworks/spectre-tokens": "^2.
|
|
103
|
+
"@phcdevworks/spectre-tokens": "^2.7.0"
|
|
99
104
|
},
|
|
100
105
|
"devDependencies": {
|
|
101
|
-
"@types/node": "^25.
|
|
102
|
-
"@typescript-eslint/eslint-plugin": "^8.
|
|
103
|
-
"@typescript-eslint/parser": "^8.
|
|
106
|
+
"@types/node": "^25.9.1",
|
|
107
|
+
"@typescript-eslint/eslint-plugin": "^8.60.1",
|
|
108
|
+
"@typescript-eslint/parser": "^8.60.1",
|
|
104
109
|
"autoprefixer": "^10.5.0",
|
|
105
|
-
"eslint": "^10.
|
|
106
|
-
"jiti": "^2.
|
|
107
|
-
"postcss": "^8.5.
|
|
110
|
+
"eslint": "^10.4.1",
|
|
111
|
+
"jiti": "^2.7.0",
|
|
112
|
+
"postcss": "^8.5.15",
|
|
108
113
|
"postcss-cli": "^11.0.1",
|
|
109
114
|
"postcss-import": "^16.1.1",
|
|
110
115
|
"prettier": "^3.8.3",
|
|
111
|
-
"tailwindcss": "^4.
|
|
116
|
+
"tailwindcss": "^4.3.0",
|
|
112
117
|
"tsup": "^8.5.1",
|
|
113
118
|
"typescript": "^6.0.3",
|
|
114
|
-
"typescript-eslint": "^8.
|
|
115
|
-
"vite": "^8.0.
|
|
116
|
-
"vitest": "^4.1.
|
|
119
|
+
"typescript-eslint": "^8.60.1",
|
|
120
|
+
"vite": "^8.0.16",
|
|
121
|
+
"vitest": "^4.1.8"
|
|
117
122
|
},
|
|
118
123
|
"cSpell.words": [
|
|
119
124
|
"phcdevworks"
|