@phcdevworks/spectre-ui 1.9.0 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/README.md +32 -0
  3. package/dist/base.css +2 -2
  4. package/dist/components.css +4 -4
  5. package/dist/index.css +4 -4
  6. package/dist/utilities.css +2 -2
  7. package/package.json +14 -11
package/CHANGELOG.md CHANGED
@@ -6,6 +6,29 @@ reflects package releases published to npm.
6
6
 
7
7
  ## [Unreleased]
8
8
 
9
+ ## [2.0.0] - 2026-06-17
10
+
11
+ Release Title: Token 3 Alignment
12
+
13
+ Contract change type: breaking
14
+
15
+ ### Changed
16
+
17
+ - **Token Alignment**: Updated `@phcdevworks/spectre-tokens` dependency to
18
+ `^3.0.0` and refreshed lockfile metadata against the latest published token
19
+ package. This is a major release because the upstream token package moved to
20
+ a breaking `3.0.0` contract.
21
+ - **Avatar Surface Role**: Updated Avatar background role mappings from the
22
+ removed upstream `--sp-surface-alternate` token to
23
+ `--sp-surface-subtle`, preserving the existing Avatar class and recipe
24
+ contract while matching the v3 token surface.
25
+ - **Release Readiness**: Updated package manager and development dependency
26
+ metadata, including the `esbuild` override and allowed script entry required
27
+ by the refreshed build stack.
28
+ - **Roadmap Accuracy**: Corrected the token-gap notes in `TODO.md` after
29
+ verifying the published `@phcdevworks/spectre-tokens@3.0.0` package: link,
30
+ interactive surface state, and divider tokens remain blocked.
31
+
9
32
  ## [1.9.0] - 2026-06-10
10
33
 
11
34
  Release Title: Component Recipe Expansion
package/README.md CHANGED
@@ -1,5 +1,37 @@
1
1
  # @phcdevworks/spectre-ui
2
2
 
3
+ ## Repository Snapshot
4
+
5
+ | Field | Value |
6
+ |-------|-------|
7
+ | Project team | `project-design` |
8
+ | Repository role | Spectre L2 CSS, Tailwind, and recipe contract |
9
+ | Package/artifact | `@phcdevworks/spectre-ui` |
10
+ | Current version/status | 2.0.0 |
11
+
12
+ ## Standard Workflow
13
+
14
+ 1. Read [AGENTS.md](AGENTS.md), then the agent-specific guide for the task.
15
+ 2. Check [TODO.md](TODO.md) and [ROADMAP.md](ROADMAP.md) for current scope.
16
+ 3. Make the smallest repo-local change that satisfies the task.
17
+ 4. Run `npm run check` when validation is required or practical.
18
+ 5. Update docs and [CHANGELOG.md](CHANGELOG.md) only when behavior, public
19
+ contracts, or release-relevant metadata changed.
20
+
21
+ ## Documentation Map
22
+
23
+ | Guide | Path |
24
+ |-------|------|
25
+ | Agent rules | [AGENTS.md](AGENTS.md) |
26
+ | Claude Code | [CLAUDE.md](CLAUDE.md) |
27
+ | Codex | [CODEX.md](CODEX.md) |
28
+ | Copilot | [COPILOT.md](COPILOT.md) |
29
+ | Jules | [JULES.md](JULES.md) |
30
+ | Roadmap | [ROADMAP.md](ROADMAP.md) |
31
+ | Todo | [TODO.md](TODO.md) |
32
+ | Changelog | [CHANGELOG.md](CHANGELOG.md) |
33
+ | Security | [SECURITY.md](SECURITY.md) |
34
+
3
35
  [![npm version](https://img.shields.io/npm/v/@phcdevworks/spectre-ui)](https://www.npmjs.com/package/@phcdevworks/spectre-ui)
4
36
  [![CI](https://github.com/phcdevworks/spectre-ui/actions/workflows/ci.yml/badge.svg?branch=main)](https://github.com/phcdevworks/spectre-ui/actions/workflows/ci.yml)
5
37
  [![License](https://img.shields.io/npm/l/@phcdevworks/spectre-ui)](LICENSE)
package/dist/base.css CHANGED
@@ -3,7 +3,7 @@
3
3
  --sp-surface-card: #ffffff;
4
4
  --sp-surface-input: #ffffff;
5
5
  --sp-surface-overlay: rgba(0, 0, 0, 0.6);
6
- --sp-surface-alternate: #eef1f6;
6
+ --sp-surface-subtle: #eef1f6;
7
7
  --sp-surface-hero: linear-gradient(135deg, #5b6ee1 0%, #6f3fd7 100%);
8
8
  --sp-text-on-page-default: #141b24;
9
9
  --sp-text-on-page-muted: #4b576a;
@@ -422,7 +422,7 @@
422
422
  --sp-surface-card: #222b38;
423
423
  --sp-surface-input: #374253;
424
424
  --sp-surface-overlay: rgba(0, 0, 0, 0.6);
425
- --sp-surface-alternate: #222b38;
425
+ --sp-surface-subtle: #222b38;
426
426
  --sp-surface-hero: linear-gradient(135deg, #5d28b8 0%, #401f75 100%);
427
427
  --sp-text-on-page-default: #f7f8fb;
428
428
  --sp-text-on-page-muted: #b7c1d4;
package/dist/components.css CHANGED
@@ -3,7 +3,7 @@
3
3
  --sp-surface-card: #ffffff;
4
4
  --sp-surface-input: #ffffff;
5
5
  --sp-surface-overlay: rgba(0, 0, 0, 0.6);
6
- --sp-surface-alternate: #eef1f6;
6
+ --sp-surface-subtle: #eef1f6;
7
7
  --sp-surface-hero: linear-gradient(135deg, #5b6ee1 0%, #6f3fd7 100%);
8
8
  --sp-text-on-page-default: #141b24;
9
9
  --sp-text-on-page-muted: #4b576a;
@@ -422,7 +422,7 @@
422
422
  --sp-surface-card: #222b38;
423
423
  --sp-surface-input: #374253;
424
424
  --sp-surface-overlay: rgba(0, 0, 0, 0.6);
425
- --sp-surface-alternate: #222b38;
425
+ --sp-surface-subtle: #222b38;
426
426
  --sp-surface-hero: linear-gradient(135deg, #5d28b8 0%, #401f75 100%);
427
427
  --sp-text-on-page-default: #f7f8fb;
428
428
  --sp-text-on-page-muted: #b7c1d4;
@@ -736,7 +736,7 @@
736
736
  --sp-component-avatar-size-md: var(--sp-space-48);
737
737
  --sp-component-avatar-size-lg: var(--sp-space-64);
738
738
  --sp-component-avatar-size-xl: var(--sp-space-80);
739
- --sp-component-avatar-bg: var(--sp-surface-alternate);
739
+ --sp-component-avatar-bg: var(--sp-surface-subtle);
740
740
  --sp-component-avatar-text: var(--sp-text-on-surface-default);
741
741
  --sp-component-avatar-radius-circle: var(--sp-radius-pill);
742
742
  --sp-component-avatar-radius-square: var(--sp-radius-lg);
@@ -2421,7 +2421,7 @@
2421
2421
  }
2422
2422
 
2423
2423
  .sp-avatar--placeholder {
2424
- background-color: var(--sp-surface-alternate);
2424
+ background-color: var(--sp-surface-subtle);
2425
2425
  color: var(--sp-text-on-surface-meta);
2426
2426
  }
2427
2427
 
package/dist/index.css CHANGED
@@ -7,7 +7,7 @@
7
7
  --sp-surface-card: #ffffff;
8
8
  --sp-surface-input: #ffffff;
9
9
  --sp-surface-overlay: rgba(0, 0, 0, 0.6);
10
- --sp-surface-alternate: #eef1f6;
10
+ --sp-surface-subtle: #eef1f6;
11
11
  --sp-surface-hero: linear-gradient(135deg, #5b6ee1 0%, #6f3fd7 100%);
12
12
  --sp-text-on-page-default: #141b24;
13
13
  --sp-text-on-page-muted: #4b576a;
@@ -426,7 +426,7 @@
426
426
  --sp-surface-card: #222b38;
427
427
  --sp-surface-input: #374253;
428
428
  --sp-surface-overlay: rgba(0, 0, 0, 0.6);
429
- --sp-surface-alternate: #222b38;
429
+ --sp-surface-subtle: #222b38;
430
430
  --sp-surface-hero: linear-gradient(135deg, #5d28b8 0%, #401f75 100%);
431
431
  --sp-text-on-page-default: #f7f8fb;
432
432
  --sp-text-on-page-muted: #b7c1d4;
@@ -806,7 +806,7 @@
806
806
  --sp-component-avatar-size-md: var(--sp-space-48);
807
807
  --sp-component-avatar-size-lg: var(--sp-space-64);
808
808
  --sp-component-avatar-size-xl: var(--sp-space-80);
809
- --sp-component-avatar-bg: var(--sp-surface-alternate);
809
+ --sp-component-avatar-bg: var(--sp-surface-subtle);
810
810
  --sp-component-avatar-text: var(--sp-text-on-surface-default);
811
811
  --sp-component-avatar-radius-circle: var(--sp-radius-pill);
812
812
  --sp-component-avatar-radius-square: var(--sp-radius-lg);
@@ -2491,7 +2491,7 @@
2491
2491
  }
2492
2492
 
2493
2493
  .sp-avatar--placeholder {
2494
- background-color: var(--sp-surface-alternate);
2494
+ background-color: var(--sp-surface-subtle);
2495
2495
  color: var(--sp-text-on-surface-meta);
2496
2496
  }
2497
2497
 
package/dist/utilities.css CHANGED
@@ -3,7 +3,7 @@
3
3
  --sp-surface-card: #ffffff;
4
4
  --sp-surface-input: #ffffff;
5
5
  --sp-surface-overlay: rgba(0, 0, 0, 0.6);
6
- --sp-surface-alternate: #eef1f6;
6
+ --sp-surface-subtle: #eef1f6;
7
7
  --sp-surface-hero: linear-gradient(135deg, #5b6ee1 0%, #6f3fd7 100%);
8
8
  --sp-text-on-page-default: #141b24;
9
9
  --sp-text-on-page-muted: #4b576a;
@@ -422,7 +422,7 @@
422
422
  --sp-surface-card: #222b38;
423
423
  --sp-surface-input: #374253;
424
424
  --sp-surface-overlay: rgba(0, 0, 0, 0.6);
425
- --sp-surface-alternate: #222b38;
425
+ --sp-surface-subtle: #222b38;
426
426
  --sp-surface-hero: linear-gradient(135deg, #5d28b8 0%, #401f75 100%);
427
427
  --sp-text-on-page-default: #f7f8fb;
428
428
  --sp-text-on-page-muted: #b7c1d4;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@phcdevworks/spectre-ui",
3
- "version": "1.9.0",
3
+ "version": "2.0.0",
4
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",
@@ -38,7 +38,7 @@
38
38
  "npm": ">=10.0.0"
39
39
  },
40
40
  "type": "module",
41
- "packageManager": "npm@11.16.0",
41
+ "packageManager": "npm@11.17.0",
42
42
  "main": "./dist/index.cjs",
43
43
  "module": "./dist/index.js",
44
44
  "types": "./dist/index.d.ts",
@@ -101,31 +101,34 @@
101
101
  "typescript": "^5.9 || ^6.0"
102
102
  },
103
103
  "dependencies": {
104
- "@phcdevworks/spectre-tokens": "^2.9.0"
104
+ "@phcdevworks/spectre-tokens": "^3.0.0"
105
105
  },
106
106
  "devDependencies": {
107
107
  "@phcdevworks/spectre-manifest": "^1.0.0",
108
- "@types/node": "^25.9.2",
109
- "@typescript-eslint/eslint-plugin": "^8.61.0",
110
- "@typescript-eslint/parser": "^8.61.0",
108
+ "@types/node": "^25.9.3",
109
+ "@typescript-eslint/eslint-plugin": "^8.61.1",
110
+ "@typescript-eslint/parser": "^8.61.1",
111
111
  "autoprefixer": "^10.5.0",
112
- "eslint": "^10.4.1",
112
+ "eslint": "^10.5.0",
113
113
  "jiti": "^2.7.0",
114
114
  "postcss": "^8.5.15",
115
115
  "postcss-cli": "^11.0.1",
116
116
  "postcss-import": "^16.1.1",
117
117
  "prettier": "^3.8.4",
118
- "tailwindcss": "^4.3.0",
118
+ "tailwindcss": "^4.3.1",
119
119
  "tsup": "^8.5.1",
120
120
  "typescript": "^6.0.3",
121
- "typescript-eslint": "^8.61.0",
121
+ "typescript-eslint": "^8.61.1",
122
122
  "vite": "^8.0.16",
123
- "vitest": "^4.1.8"
123
+ "vitest": "^4.1.9"
124
124
  },
125
125
  "cSpell.words": [
126
126
  "phcdevworks"
127
127
  ],
128
+ "overrides": {
129
+ "esbuild": "^0.28.1"
130
+ },
128
131
  "allowScripts": {
129
- "esbuild@0.27.7": true
132
+ "esbuild@0.28.1": true
130
133
  }
131
134
  }