In-App Documentation | Cine Power Planner

In-App Documentation

Rendered markdown documentation viewer, bundled and available offline

Overview

The Documentation feature provides an in-app markdown viewer for the user guides. It renders markdown with GFM support (tables, task lists, strikethrough), lazy-loaded syntax highlighting for code blocks, and heading anchors that make #section deep links work. Content is bundled at build time and served locally — no network required.

It shows the user guides only. The manifest generator publishes exactly one tree — docs/user/ — so the developer documentation under docs/dev/ is not bundled and is not reachable from this viewer. Read that on GitHub or in a checkout.

Requirements

Functional Requirements

IDRequirementAcceptance CriteriaPrioritySource
REQ-DOC-001The system shall render markdown with GFM support (tables, task lists, autolinks)Navigate to a doc → markdown renders; tables, code blocks and lists display; no rendering errorsMustMarkdownRenderer.jsx
REQ-DOC-002The system shall syntax-highlight code blocks for the registered languagesFenced block tagged js, bash, json, yaml, css, nginx or markdown → highlighted. The highlighter is lazy-loaded on first useMustMarkdownRenderer.jsx
REQ-DOC-003The system shall give every heading a stable id and resolve intra-page #anchor linksHeading → id assigned by rehype-slug and wrapped in a self-anchor; clicking a same-page #anchor smooth-scrolls to itMustMarkdownRenderer.jsx
REQ-DOC-004The system shall present the guides in a sidebar grouped by the curated indexOpen the viewer → sidebar lists every published guide, grouped and ordered by docs/user/README.mdMustDocumentationSidebar.jsx
REQ-DOC-005The system shall display documentation in a responsive layout with sidebar navigationDesktop → sidebar + content; mobile → collapsed sidebar; wide tables scroll inside their own container rather than the pageMustDocumentationLayout.jsx
REQ-DOC-006The system shall publish exactly the docs/user/ treePUBLIC_DIR_PREFIXES is ['user/']; a doc outside it is absent from the manifest and unreachable from the viewerMustgenerate-docs-manifest.mjs

Non-Functional Requirements

IDRequirementMetricPriority
NFR-DOC-001Documentation shall be fully available offline (bundled)AvailabilityMust

Data Requirements

  • Content source: markdown under docs/user/, collected at build time by app/scripts/generate-docs-manifest.mjs into data/docs-manifest.json
  • Frontmatter: parsed with gray-matter
  • Rendering: react-markdown with remark-gfm
  • Syntax highlighting: react-syntax-highlighter (Prism), loaded lazily with only the languages listed in REQ-DOC-002 registered
  • No external fetch: all content bundled at build time

Constraints & Limits

  • There is no documentation search. The sidebar is static navigation with no filter input. To find a phrase, use the browser's own find (Cmd/Ctrl + F is bound by the app to project/global search, so use the browser menu's Find on this page) or the global Quick Switcher for finding a guide by name.
  • There is no generated table-of-contents pane. Headings are anchored and same-page links scroll, so a TOC written into a document works — but the viewer does not build one from the heading hierarchy and does not highlight the section you are currently reading.
  • Documentation content is static (bundled at build time); no user-editable documentation
  • Available to all tiers (Free and Pro)

Offline Behavior

  • Fully offline — all content is bundled and served locally

Dependencies

  • Requires: react-markdown, remark-gfm, react-syntax-highlighter, gray-matter, rehype-slug, rehype-autolink-headings

Accessing Documentation

Open Help in the sidebar and choose Documentation, or go straight to /documentation/user/<DOC> — for example /documentation/user/FAQ. /docs redirects to the same place.

Cmd/Ctrl + / opens the Help home. ? does not — that opens the keyboard-shortcuts overlay. This page said ? opened the help panel until 2026-09-07.

The user/ segment is part of the route. /documentation/FAQ renders "Document Not Found"; the working URL is /documentation/user/FAQ. Links from the sidebar always carry it.

  • Use the sidebar to browse guides — it is grouped and ordered by docs/user/README.md
  • Click a heading to copy its anchor, or follow any #section link to scroll to it
  • Use your browser's find-on-page to search within the open guide

Last Updated: 2026-09-07 Version: 0.790.2