Skip to content

feat(storybook): add a storybook workshop app - #31

Merged
jonatankruszewski merged 1 commit into
mainfrom
feat/storybook
Aug 2, 2026
Merged

feat(storybook): add a storybook workshop app#31
jonatankruszewski merged 1 commit into
mainfrom
feat/storybook

Conversation

@jonatankruszewski

@jonatankruszewski jonatankruszewski commented Aug 2, 2026

Copy link
Copy Markdown
Contributor

Summary

Adds a Storybook 10 workshop as a new private workspace, apps/storybook (@rxova/storybook), covering every input in the suite:

  • @storybook/react-vite on Vite 8, wired the same way as the playground: vite.config.ts aliases each @rxova/* package to packages/*/src/index.ts, so the workshop runs and builds with no prior library build and hot-reloads library source. One regex rule covers any input added later.
  • 25 stories + autodocs for OTP, Rating and Currency: an args-driven Playground per component (controls wired two-way via useArgs, actions via fn() spies), plus stories for compound composition, render-prop cells, masking, custom icons, fractional read-only display, Intl locale showcase, the headless useCurrencyInput hook, and native-form round-trips.
  • Prop tables from source: react-docgen-typescript reads the annotated *Props interfaces, so every prop's TSDoc, type and default lands in the docs tables; DOM props inherited by CurrencyInput are filtered out.
  • a11y addon on every story, and a global Direction (LTR/RTL) toolbar mirroring the playground's page-level toggle.
  • Consumer-side styling only (preview.css using the packages' documented CSS tokens) — the components stay headless; no package gains a stylesheet or dependency.
  • Wiring: root storybook / storybook:build scripts, generic turbo build/dev tasks reused (storybook build -o dist fits the existing dist/** output convention), eslint react-hooks coverage extended to apps/storybook, tsconfig paths mirroring the alias rule.

Testing

  • pnpm verify passes locally — everything except the Vitest browser projects and e2e, which need Playwright browser binaries this container doesn't have; typecheck, build and size are green across all 10 workspaces, and lint / format:check / check:docs pass. No library behaviour changed, so no new tests.
  • Built Storybook smoke-tested headlessly: all 29 index entries present, 7 representative stories render with zero console/page errors.

Docs

  • Not needed for the packages — no prop changed
  • Added apps/storybook/README.md (wiring + how to add stories for a new input) and an Introduction.mdx docs page

Checklist

  • A changeset is included, or the PR carries skip-changeset — neither is needed: the diff touches no published package, which the changeset gate already treats as exempt
  • No new runtime dependency — all new dependencies live in the private workshop app
  • No stylesheet added; new visual knobs are CSS custom properties — preview.css is consumer-side styling inside the workshop, using the packages' existing tokens
  • Accessibility unaffected, or verified with the axe specs — no component change; every story additionally runs the a11y addon

Breaking change

  • None

@jonatankruszewski jonatankruszewski added the skip-changeset Changes do not require a package release label Aug 2, 2026 — with Claude
@jonatankruszewski
jonatankruszewski merged commit b0eef54 into main Aug 2, 2026
27 of 38 checks passed
@jonatankruszewski
jonatankruszewski deleted the feat/storybook branch August 2, 2026 18:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

skip-changeset Changes do not require a package release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant