docs: replace examples/demo with Fumadocs site for preview deploys#40
Open
EricMChavez wants to merge 15 commits intoreact-zero-ui:mainfrom
Open
docs: replace examples/demo with Fumadocs site for preview deploys#40EricMChavez wants to merge 15 commits intoreact-zero-ui:mainfrom
EricMChavez wants to merge 15 commits intoreact-zero-ui:mainfrom
Conversation
Stage existing docs/*.md to docs-legacy/ (git-tracked rename) and scaffold a Next.js 15 + Fumadocs 15.8.5 + Tailwind v4 app into docs/. Adds docs to pnpm-workspace.yaml. Legacy files will be migrated into apps/docs/content/docs/*.mdx in a follow-up commit. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Migrate 7 public docs from docs-legacy/*.md to docs/content/docs/*.mdx
with frontmatter, updated internal links (/docs/*), and no manual TOCs
(Fumadocs auto-generates). Split installation into getting-started/
{next,vite}.mdx. Replace Fumadocs starter index.mdx with a real docs
home, delete starter test.mdx. Add meta.json for sidebar ordering with
section separators (Getting Started, Core Concepts, Advanced). Delete
legacy demo.md (duplicative) and rules.md (empty). docs-legacy still
holds CONTRIBUTING.md, internal.md, size.md, assets/ pending Phase 5.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Wire @react-zero-ui/core into the docs workspace: PostCSS plugin ahead of Tailwind, bodyAttributes spread on <body> in root layout, tsconfig path alias @zero-ui/attributes, .zero-ui/ gitignored. Replace default Fumadocs home page with a full landing: hero + install snippet + CTAs, useState-vs-useUI side-by-side, inline theme/accent demo (dog-foods Zero-UI itself — zero re-renders on click), why-it's-fast cards, and GitHub/npm/FAQ links. Update nav branding to "React Zero-UI" with Docs + GitHub links. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
New /demo/real-world page puts a React-only pane and a Zero-UI hybrid
pane side-by-side, both fetching the same mock data with a 650 ms
simulated delay. React pane uses useState for loading; Zero-UI pane
flips data-demo-search-status on <body> via useUI so the skeleton
appears via CSS, not reconciliation. Render counters in each pane
make the difference visible during the loading transition.
Cross-link from the landing page hero ("See it in action"), a Callout
at the top of usage-examples, and a new FAQ entry on when to mix
useUI with useState.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Scoped Phase 5: port the flagship tabbed Zero-UI vs React state comparison (examples/demo (test)/page.tsx) to /demo/perf on the docs site. State keys namespaced with perf-* prefix to avoid collision with other demos. Icon sprite dep replaced with lucide-react's Atom icon. Landing page Demo section now links to both /demo/perf and /demo/real-world. examples/demo left intact — deeper perf subpages (react/ssr/zero-ui) and the sprite demo are out of scope for this cut. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Phase 2 migrated 7 public docs into docs/content/docs/*.mdx with Fumadocs. Those legacy sources can now go. Remaining maintainer-facing files relocated out of docs-legacy: - CONTRIBUTING.md → repo root (with Monorepo Structure updated to mention docs/ and examples/demo/, and a Bundle Size section merged in from the old size.md) - internal.md → packages/core/ARCHITECTURE.md (colocated with the variant extractor / PostCSS pipeline it describes) - assets/ → docs/public/assets/ (usable by the docs site going forward) docs-legacy/ is now empty and removed. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Clears the "metadataBase property is not set" build warning by defining it in the root layout. Site URL resolves from NEXT_PUBLIC_SITE_URL, falls back to VERCEL_URL (auto-set on preview deploys), and ultimately defaults to https://zero-ui.dev. robots.ts points crawlers at the sitemap; sitemap.ts emits entries for the static routes (/, /demo/perf, /demo/real-world) plus every docs page pulled from Fumadocs source.getPages(). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Swap hand-styled <pre><code> blocks for Fumadocs' <DynamicCodeBlock lang="tsx" />. Same blocks that already render correctly inside MDX now get the same Shiki-based highlighting on the landing mental-model cards and the real-world demo's "code that matters" section. Cost: ~37 kB of Shiki runtime on first load for pages that use it. Acceptable for marketing/demo pages; we're not using it on docs pages where Fumadocs already highlights at build time. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
packages/core/src/index.ts exports \`cssVar\` (a unique Symbol used as a typeof marker for the flag parameter of useUI/useScopedUI). The legacy markdown docs called it \`CssVar\` throughout — a doc bug that got migrated verbatim into the new MDX pages. Correct all 14 references across api-reference, usage-examples, and faq. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replaces the old Next.js demo app at examples/demo with the Fumadocs docs site previously living at docs/. Reuses the existing Vercel project pointed at examples/demo so each PR will get a preview deploy of the docs site for free, instead of needing a separate Vercel project. The valuable parts of the old demo (perf comparison, real-world hybrid example) were already ported into the docs app in afedd8a / 16dd037, so the deletion is safe. Also drops the now-unused 'docs' entry from pnpm-workspace.yaml; the existing 'examples/*' glob covers the new location. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Two small fixes for the Next 15 + pnpm-monorepo build: 1. Set outputFileTracingRoot to the repo root in next.config.mjs. Without it, Next's file tracer can't follow pnpm's nested .pnpm/... layout and warns about external packages it can't resolve. 2. Add shiki@3.23.0 as a direct dep of the docs package. shiki is on Next's serverExternalPackages default list and Fumadocs uses it for syntax highlighting; promoting it from a transitive to a direct dep gives Next a path it can resolve from the project dir. Both warnings now silent on next build. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…parison
The home page previously had two side-by-side demo sections doing the
same job: a single Zero-UI widget ("Try it right here") and a separate
/demo/perf page with a Zero-UI vs React state comparison. The
comparison is the more compelling demo, so promote it to the home page
and drop the standalone /demo/perf route.
While there, add a brand-tinted "renders: N" badge to both panes of
the comparison and the existing hybrid-pattern demo, so the no-rerender
claim is visible without needing React DevTools. The badge uses
suppressHydrationWarning because the count differs intentionally
between the server's single render and the client's first render
(double-invoked under reactStrictMode in dev).
- Move app/(home)/demo/perf/_*.tsx to app/(home)/_components/ and
rename to PascalCase to match LandingDemo's prior convention.
- Delete LandingDemo and the /demo/perf page.
- Replace LandingDemo with Comparison on the home page; rewrite the
section copy to describe the new side-by-side; drop the now-stale
/demo/perf link card from the demo grid.
- Use violet directly (not fd-primary tokens) for the perf badges
since the perf demo has its own local light/dark theme that's
independent of the global Fumadocs theme.
- Drop /demo/perf from sitemap.ts.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Limit Austin's review surface for the initial PR to the introduction and getting-started guides. The other pages keep their original frontmatter (so the sidebar nav, descriptions, and OG metadata stay intact) but render a Fumadocs <Callout> pointing readers back to the intro / getting started and the GitHub repo until the prose is written and reviewed. Stubbed: api-reference, experimental, faq, migration-guide, usage-examples. The meta.json layout (Core Concepts / Advanced sections) is untouched so the docs structure stays visible. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Contributor
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Author
|
Heads-up on the 96 files changed count — the actual review surface is much smaller. Recommend the per-commit view over the cumulative diff. Breakdown vs
Why the 5 MDX stubs show as add+delete instead of renames: commit 1 renamed Suggested review order:
|
The Fumadocs scaffold's .gitignore (now examples/demo/.gitignore)
ignores .zero-ui/, which is fine for local dev because the artifacts
get regenerated by the Zero-UI PostCSS plugin during the next CSS
pass. But on a clean Vercel checkout there's nothing for webpack to
resolve when app/layout.tsx imports @zero-ui/attributes — the import
is resolved before the PostCSS plugin gets a chance to run, and the
build dies with "Module not found: Can't resolve '@zero-ui/attributes'".
The previous "react-zero" examples/demo solved this by committing
.zero-ui/attributes.{js,d.ts}. Restoring that pattern: drop .zero-ui
from .gitignore and check in the current generated files. The
PostCSS plugin overwrites them in place on each build, so they only
show as modified when the variant set actually changes.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…onfig import.meta.dirname requires Node 20.11+. The Vercel project for this repo predates the new examples/demo and may be pinned to an older Node version, in which case loading next.config.mjs crashes with a TypeError on import.meta.dirname before the build even starts. Switching to path.dirname(fileURLToPath(import.meta.url)) computes the same value and works on Node 14+. No behavior change otherwise. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Author
|
I was hoping to get the Vercel deployment working, but I can't see the error on my end. Happy to help further if you want to give me read-only access to your Vercel or paste the error message here. |
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
1 participant
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.
Summary
docs/intoexamples/demo/, replacing the old "react-zero" Next.js demo app, so each PR automatically gets a preview deploy of the docs site (per Austin's hint — reuses the existing Vercel project pointed atexamples/demo).outputFileTracingRoot, directshikidep).Commits
chore: move Fumadocs app from docs/ into examples/demo/— primarily renames; drops thedocsworkspace frompnpm-workspace.yaml(now covered by the existingexamples/*glob).chore(docs): silence Next monorepo build warnings.refactor(docs): consolidate home demo with Zero-UI vs React state comparison— moves the perf demo's components intoapp/(home)/_components/(preserved as renames at 89-95% similarity), deletes the standaloneLandingDemoand/demo/perfpage, adds the render badges withsuppressHydrationWarning(counts diverge intentionally between SSR and Strict-Mode dev hydration).docs: stub WIP pages outside intro and getting started—api-reference,experimental,faq,migration-guide,usage-exampleskeep their frontmatter (so nav/OG metadata stays intact) but render a Fumadocs<Callout>.Test plan
pnpm installfrom repo root resolves with 4 workspace projects (nodocsentry).pnpm --filter docs buildsucceeds with no warnings; produces ~26 routes.pnpm --filter docs dev—/renders landing + side-by-side Zero-UI vs React state comparison; click around: Zero-UI badge stays atrenders: 1, React badge climbs./demo/real-worldrenders; both panes show the brand-tinted render badge./docs,/docs/getting-started/next,/docs/getting-started/viterender the full prose;/docs/api-reference,/docs/experimental,/docs/faq,/docs/migration-guide,/docs/usage-examplesrender the WIP callout.🤖 Generated with Claude Code