Skip to content

feat(docsite): on-this-page outline and linkable section headings#3101

Merged
ernestt merged 2 commits into
mainfrom
docsite-doc-outline
Jun 25, 2026
Merged

feat(docsite): on-this-page outline and linkable section headings#3101
ernestt merged 2 commits into
mainfrom
docsite-doc-outline

Conversation

@ernestt

@ernestt ernestt commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Summary

Adds a table of contents to documentation pages and makes section headings linkable.

  • On this page outline (TOC) across guide, foundations, token, and package/README pages — a sticky Outline aside on desktop and a sticky "jump to section" Selector on mobile, with scroll-margin offsets that clear the app header (and, on mobile, the sticky selector).
  • Linkable section headings via a new AnchorHeading: stable ids plus a hover "copy link" affordance so any section can be deep-linked.
  • Library (CLI/core) README pages now get heading ids + a TOC, render section headings at the same display-3 scale as the hand-authored docs, and the CLI README's "Finding things" heading is promoted to a top-level section (it was an orphan ### before the first ##).
  • Reworked Outline scroll-spy (core) to be scroll-position based — no indicator jitter, first item active at the top, last at the bottom — and the click indicator is deferred until the smooth scroll settles so it moves once instead of chasing the scroll.

Issues

Closes #3077
Closes #3081

Test plan

  • pnpm -F @astryxdesign/docsite typecheck
  • pnpm exec vitest run packages/core/src/Outline/Outline.test.tsx
  • Verified locally on the docsite: outline + scroll-spy on guide/foundation/CLI pages; section-heading copy links; mobile sticky selector with correct scroll offset; CLI section heading sizes and TOC hierarchy.

Notes

The core Outline scroll-spy/click changes could be split into a separate PR from the docsite integration if preferred — happy to do that.

Made with Cursor

Adds a table of contents to documentation pages and makes section
headings linkable, addressing the two doc-navigation requests.

- Doc pages (guide, foundations, tokens, and package READMEs) render an
  "On this page" outline: a sticky aside on desktop and a sticky jump
  selector on mobile, with anchor offsets that clear the app header and
  the mobile selector.
- Section headings get stable ids and a hover "copy link" affordance via
  a new AnchorHeading. Package/README headings also get ids + a TOC and
  now render at the same display-3 scale as the hand-authored docs.
- Reworks Outline scroll-spy to track scroll position (stable, no
  indicator jitter; first item active at the top, last at the bottom) and
  delays the indicator on click until the smooth scroll settles.
- Promotes the CLI README "Finding things" heading to a top-level section
  so it is no longer rendered as an orphan subsection.

Co-authored-by: Cursor <cursoragent@cursor.com>
@vercel

vercel Bot commented Jun 25, 2026

Copy link
Copy Markdown

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

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
astryx Ignored Ignored Jun 25, 2026 12:32am

Request Review

@meta-cla meta-cla Bot added the CLA Signed This label is managed by the Meta Open Source bot. label Jun 25, 2026
@github-actions

github-actions Bot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

PR Analysis Report

📚 Storybook Preview

View Storybook for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

🧪 Sandbox Preview

View Sandbox for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

No new or modified components detected.

Bundle Size Summary

Package Size (ESM) Size (CJS) Gzipped
@astryxdesign/core N/A 4.6KB 0B

Accessibility Audit

Status: No accessibility violations detected.


Generated by PR Enrichment workflow | Storybook | Sandbox | View full report

github-actions Bot added a commit that referenced this pull request Jun 25, 2026
@github-actions

github-actions Bot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

🚀 Vercel Preview Deployment

Status ✅ Deployed
Preview Open Preview
Commit 26780d3
Inspect Vercel Dashboard
Workflow View Logs

No authentication required — anyone with the link can view the preview.

Co-authored-by: Cursor <cursoragent@cursor.com>

# Conflicts:
#	apps/docsite/src/components/docs/DocPageLayout.tsx
github-actions Bot added a commit that referenced this pull request Jun 25, 2026
@ernestt ernestt merged commit 6e02d47 into main Jun 25, 2026
18 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Meta Open Source bot.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add section header link copy to docsite Request: TOC for doc pages

2 participants