Documentation index

Grouped entries

In the Guide

Used on the Guide index.

Usage and interface

DocumentationIndex organizes a large catalog by section, category or letter. It powers the Guide and Reference entrances. Use complete descriptions for learning paths, and compact link lists for named API or utility lookups. Both views contain the same destinations.

Provide a stable id, title, description and groups for each section; sections are numbered in order. Groups with multiple categories receive native anchor shortcuts beside the section head; give each group its own stable id so shared URLs survive reordering. showDescriptions enables complete, wrapping summaries. The default uses compact links. related supplies a cross-link to the other catalog.

<DocumentationIndex  name="guide"  sections={[{    id: 'learn', title: 'Learn',    description: 'Start with a working example.',    groups: [{ entries: [{      id: 'intro', title: 'Introduction', category: 'Guide',      description: 'Write your first classes.',      url: 'https://rc.css.master.co/guide/introduction',    }] }],  }]}  showDescriptions  related={{ href: 'https://rc.css.master.co/reference', title: 'Reference',    description: 'Look up a utility.' }}/>

The catalog reads like a book's contents rather than a card grid: a numbered directory of sections on hairlines, closed by the cross-link; then each section as a ruled spread whose number, name and summary stay in view beside its entries from 44rem. Described entries are ruled rows with an arrow under the pointer; compact links run in columns; the A–Z view sets letters in columns like a book's index. Nothing in it is a frame, and touch rows stay 44px on phones. It establishes its own container and column layout; place it in the reading column, outside measured demos. Category and A–Z controls are native buttons with pressed states. Letter and category shortcuts are real fragment links, including direct-entry URLs. Published catalogs omit idPrefix to retain their existing anchors; set distinct prefixes only when showing several catalogs on one review page. The complete category view is included in server-rendered HTML; A–Z switching requires JavaScript. The index review shows the current catalog.