Default Layouts

@pagesmith/docs ships with built-in layouts:

• DocHome — Landing page with hero section, feature cards, and install command
• DocPage — Content page with sidebar, prose area, and TOC aside
• DocListing — Auto-generated listing pages for grouped sections
• DocNotFound — 404 error page

Overriding Layouts

Override any layout by adding a JSX file and mapping it in the config (this example’s real paths):

1{2  theme: {3    layouts: {4      home: "./theme/layouts/DocHome.tsx",5      page: "./theme/layouts/DocPage.tsx",6    },7  },8}

Layout components receive props such as rendered content, frontmatter, headings, slug, site, plus docs-only navigation props (sidebarSections, breadcrumbs, prev/next, editUrl, …). They render HTML with @pagesmith/docs/jsx-runtime (h, Fragment) and should import the shared shell pieces from @pagesmith/docs/theme, @pagesmith/docs/components, or @pagesmith/docs/layouts so head tags, theme script bootstrapping, and assets stay consistent with the package.

This repository’s theme/layouts/DocHome.tsx and DocPage.tsx mirror the default docs structure on purpose: same landmark classes, data-pagefind-body on the indexed regions, and shared header/footer/sidebar helpers from theme/layouts/shared.tsx. Start from those files when customizing rather than inventing new DOM shapes.