Skip to content

docs(rtl): fix TanStack Start root route example#10425

Open
yogeshwaran-c wants to merge 1 commit intoshadcn-ui:mainfrom
yogeshwaran-c:docs/fix-rtl-start-tanstack-root
Open

docs(rtl): fix TanStack Start root route example#10425
yogeshwaran-c wants to merge 1 commit intoshadcn-ui:mainfrom
yogeshwaran-c:docs/fix-rtl-start-tanstack-root

Conversation

@yogeshwaran-c
Copy link
Copy Markdown

What kind of change does this PR introduce?

Documentation fix.

What is the current behavior?

The Add DirectionProvider step on docs/rtl/start shows a src/routes/__root.tsx snippet that does not compile and does not match the current TanStack Start API used by the start-app / start-monorepo templates in this repo:

  • createRootRoute, HeadContent, and Scripts are referenced without being imported.
  • The route is registered with component: RootComponent, but RootComponent takes no props and then references an undefined {children} identifier inside the <DirectionProvider>.
  • The head renders <Meta />, which is not exported from @tanstack/react-router; TanStack Start exposes HeadContent for head metadata.

Users copying this snippet into a fresh TanStack Start project hit a TypeScript error (Cannot find name 'children') and a runtime import error for <Meta />.

What is the new behavior?

The snippet is updated to match templates/start-app/src/routes/__root.tsx:

  • Add the missing createRootRoute, HeadContent, Scripts imports from @tanstack/react-router.
  • Switch to shellComponent: RootDocument and rename the function to RootDocument.
  • Destructure { children }: { children: React.ReactNode } on RootDocument so <DirectionProvider> receives a defined value.
  • Replace <Meta /> with <HeadContent />.
  • Refresh the highlighted line numbers to point at the RTL-relevant lines (DirectionProvider import, <html dir="rtl">, and the <DirectionProvider direction="rtl"> wrapper).

Only apps/v4/content/docs/rtl/start.mdx is touched; no changeset is needed since the v4 docs app is listed under ignore in .changeset/config.json.

Update the `__root.tsx` snippet in the TanStack Start RTL guide to
match the current TanStack Start patterns used by the shadcn start
templates:

- Import `createRootRoute`, `HeadContent`, and `Scripts` from
  `@tanstack/react-router`.
- Use `shellComponent: RootDocument` instead of `component: RootComponent`.
- Destructure `children` on `RootDocument` so `<DirectionProvider>`
  receives a defined value.
- Replace `<Meta />` with `<HeadContent />`.
- Refresh the highlighted line numbers.
@vercel
Copy link
Copy Markdown
Contributor

vercel Bot commented Apr 17, 2026

@yogeshwaran-c is attempting to deploy a commit to the shadcn-pro Team on Vercel.

A member of the Team first needs to authorize it.

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant