Skip to content

fix(storybook): Remove inline styles, upgrade Node to 22 LTS#58

Open
LinnJS wants to merge 5 commits intomainfrom
linnjs/fix/remove-styling
Open

fix(storybook): Remove inline styles, upgrade Node to 22 LTS#58
LinnJS wants to merge 5 commits intomainfrom
linnjs/fix/remove-styling

Conversation

@LinnJS
Copy link
Owner

@LinnJS LinnJS commented Feb 25, 2026

Summary

  • Remove all inline styles and wrapper markup from 20 Storybook story files, aligning with the component-level style removal in fix(react): Remove inline styles and wrapper markup from components #57
  • Upgrade Node.js minimum from 20 to 22 LTS across CI workflows, .nvmrc, and package.json engines
  • Update stale Node version references in documentation (CONTRIBUTING.md, SCOPE.md, TESTING_STRATEGY.md)
  • Improve story UX: collapsible debug output via <details>/<summary>, semantic HTML differentiation in WithCustomElements
  • Add changeset for engines.node bump across all published packages

Changes

Inline Style Removal (20 story files)

  • Removed flex containers, max-width constraints, button styling, grid layouts, colored info boxes, section heading styles
  • Replaced color-coded <span> elements with semantic HTML (<strong>, <em>, <span>)
  • Wrapped debug JSON output in collapsible <details> elements

Node 22 LTS Upgrade (6 config files)

  • .nvmrc: 20 → 22
  • package.json engines: >=20.0.0>=22.0.0
  • All 5 CI workflows updated consistently

Documentation Updates

  • CONTRIBUTING.md: Node >= 22.0.0
  • docs/SCOPE.md: Node 22.x recommended, 20.x supported, 18.x dropped
  • docs/TESTING_STRATEGY.md: CI example updated to node-version: 22

Test plan

  • pnpm lint — 0 errors (2 pre-existing warnings)
  • pnpm typecheck — 0 errors across all 15 packages
  • pnpm build — all 12 packages build successfully
  • pnpm test — 1,280 tests pass, 0 failures
  • Chromatic visual review — baselines will need bulk approval due to style removals

… LTS

Remove all inline styles from 19 storybook story files so components
render with VA DS default styling only. Update Node.js requirement
from 20 to 22 LTS across .nvmrc, package.json engines, and all
GitHub Actions workflows.
Update stale Node 20 references to 22 in CONTRIBUTING.md, SCOPE.md, and
TESTING_STRATEGY.md. Improve Storybook story UX by wrapping debug output
in collapsible details elements and using varied semantic HTML in
WithCustomElements. Add changeset for engines.node bump.
The banner config does not work with splitting enabled — Rollup drops
the directive during chunk generation, producing warnings on every
build. Since all components use React hooks, consumers must already
be in a client component context.
@LinnJS LinnJS added type: docs Documentation update type: refactor Code refactoring (no functional changes) pkg: core @formkit-gov/core package pkg: react @formkit-gov/react package pkg: store @formkit-gov/store package pkg: wizard @formkit-gov/wizard package pkg: openapi @formkit-gov/openapi package pkg: validators @formkit-gov/validators package pkg: test-utils @formkit-gov/test-utils package ci/cd CI/CD and automation tooling Developer tooling and configuration labels Feb 25, 2026
@vercel
Copy link

vercel bot commented Feb 25, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
docs.formkit-gov.org Ready Ready Preview, Comment Feb 25, 2026 3:02pm
formkit-gov-demo-nextjs Ready Ready Preview, Comment Feb 25, 2026 3:02pm
formkit-gov.org Ready Ready Preview, Comment Feb 25, 2026 3:02pm
storybook.formkit-gov.org Ready Ready Preview, Comment Feb 25, 2026 3:02pm
vite-demo.formkit-gov.org Ready Ready Preview, Comment Feb 25, 2026 3:02pm

Request Review

Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ci/cd CI/CD and automation pkg: core @formkit-gov/core package pkg: openapi @formkit-gov/openapi package pkg: react @formkit-gov/react package pkg: store @formkit-gov/store package pkg: test-utils @formkit-gov/test-utils package pkg: validators @formkit-gov/validators package pkg: wizard @formkit-gov/wizard package tooling Developer tooling and configuration type: docs Documentation update type: refactor Code refactoring (no functional changes)

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants