chore(design-system): update all four packages to latest and re-sync artifacts - #4
Merged
Merged
Conversation
…artifacts Bring the design system packages up to the latest published versions and regenerate everything the tooling owns. @elirobinson/react 1.3.0 -> 2.0.1 (major) @elirobinson/tokens 0.3.0 -> 0.5.0 @elirobinson/ai-patterns 0.5.0 -> 0.9.2 @elirobinson/eslint-config 0.2.0 -> 0.3.0 node_modules had drifted ahead of the committed manifests, so `ds-resync` reported only a single patch behind. The lockfile is the real baseline, and against it this is a four-package update including a major. The react 2.0.0 breaks are both no-ops here: `./styles/*` narrowing does not apply (the app imports the top-level `@elirobinson/react/styles.css`), and nothing reads the manifest's removed `importPath` alias. Font tokens move to the `--ds-font-*-override` hooks added in tokens 0.5.0. Overriding `--font-sans` directly still worked, but only because globals.css is imported after the unlayered tokens.css; the hooks are declared nowhere in that stylesheet, so they resolve from any cascade layer. A matched hook drops the shipped fallbacks, so the stacks are spelled out. Verified in a browser: `--font-sans` resolves to "Geist","Geist Fallback",ui-sans-serif,system-ui and body computes to Geist rather than falling through to the system face. `ds-resync artifacts --write` adds three generated skill trees under .claude/skills/ plus the ds-artifacts.json hash manifest. They are generated output, so they are excluded from ESLint and Prettier — the UI-kit JSX in them is prototype reference material that trips the design system's own rules, and a fix in place would be overwritten by the next sync. Verified: type-check, lint, format:check, unit tests, production build, and all 16 Playwright tests including the design system contracts in light and dark across four browser projects.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Updates all four
@elirobinson/*packages to their latest published versions and regenerates everything the design system tooling owns.@elirobinson/react@elirobinson/tokens@elirobinson/ai-patterns@elirobinson/eslint-configds-resyncunder-reported the gapnode_moduleshad drifted ahead of the committed manifests —react@2.0.1was installed whilepackage.jsonand the lockfile pinned^1.3.0. Sinceds-resyncreadsnode_modules, it reported onlyai-patternsa single patch behind. Measured against the lockfile (the state CI and a fresh clone actually get) this is a four-package update including a major.package.json, the lockfile, andnode_modulesnow agree.The react 2.0.0 breaks don't reach this repo
Both were checked rather than assumed:
./styles/*narrowed to./styles/*.css— the app imports the top-level@elirobinson/react/styles.css, which is a different export and unaffected. Nothing imports through thestyles/*subpath.importPathdropped from the manifest — nothing here reads the manifest.Font tokens move to the supported hook
tokens 0.5.0 adds
--ds-font-*-override. The previous approach (redefining--font-sansdirectly) still worked, but only becauseglobals.cssis imported after the unlayeredtokens.css— a load-order dependency that fails silently if it ever changes.tokens.cssdeclares the override hooks nowhere, so they resolve from any cascade layer.A matched hook replaces the whole fallback list, so the system stacks are spelled out rather than dropped.
Verified in a browser rather than assumed — this is precisely the silent failure the upstream changelog describes (page renders in the system font, nothing errors):
Generated skill trees
ds-resync artifacts --writeadds three trees under.claude/skills/(design-system-reference/,ds-resync/,miltinson-design/) plus theds-artifacts.jsonhash manifest that drives drift detection..gitignorealready keeps.claude/skillsshared, so these are committed like the existing agent instructions.They are generated output and are excluded from ESLint and Prettier. The UI-kit JSX ships as prototype reference material and trips the design system's own rules (hardcoded shadow, undefined imports in excerpt files) — 59 lint errors, all confined to those five vendored files. Fixing them in place would be overwritten by the next sync, so the trees are ignored instead.
.prettierignorealready set this precedent for theds init --agentsoutput.AGENTS.mdgains theds-resync artifacts --writestep, which the documented upgrade flow was missing.Verification
All green:
type-check,lint,format:check, unit tests, production build, and all 16 Playwright tests — including the design system contracts (touch targets, visible focus, WCAG AA contrast) in light and dark across chromium, firefox, webkit, and mobile-chrome.Note for the reviewer
The font-token migration is behavior-neutral and separable — drop that hunk in
src/app/globals.cssif you'd rather keep the upgrade purely mechanical.