Skip to content

feat: Revise tab renderers#3

Merged
eddie-knight merged 3 commits into
mainfrom
docs/format-tabs-guidance
Jun 22, 2026
Merged

feat: Revise tab renderers#3
eddie-knight merged 3 commits into
mainfrom
docs/format-tabs-guidance

Conversation

@eddie-knight

Copy link
Copy Markdown
Contributor

No description provided.

FormatTabs renders `content` byte-for-byte and does no conversion,
pretty-printing, or validation — those are the consumer's job. Make that
explicit so the common misuses (a flat compact-OSCAL line, a missing raw
YAML tab, expecting the component to validate) don't read as renderer bugs.

- README: state that `content` is verbatim; show the pretty-print idiom
  (`JSON.stringify(JSON.parse(x), null, 2)`), the raw-YAML-is-free tip, and
  that validation lives upstream in go-gemara/the spec; point at the example.
- examples/astro: add a MultiFormatViewer island (Preview + raw YAML +
  pre-converted OSCAL). The wrapper composes FormatTabs inside React because a
  rendered `preview` node can't cross Astro's island boundary as a prop.
- examples/astro: commit a real OSCAL projection generated by go-gemara's
  oscalexport as a fixture, read via a `?raw` import.

No changes to the component.

Signed-off-by: Eddie Knight <knight@linux.com>
Round out the example's raw-format trio (it had YAML + OSCAL; Markdown was
missing). FormatTabs already handled it — the gap was only in the example.

- MultiFormatViewer: add a `markdown` prop and a Markdown code tab.
- index.astro: `?raw` import of the new fixture, passed in.
- Commit a real Markdown projection generated by go-gemara's
  `ControlCatalog(c).ToMarkdown` (no CLI exists, so via a one-off program).

Signed-off-by: Eddie Knight <knight@linux.com>
Wrap each entry's outbound mapping sections in a collapsed-by-default
"References to Other Documents" disclosure, across all three mapping-bearing
renderers: ControlCatalog (guidelines + threats), ThreatCatalog (capabilities
+ vectors), GuidanceCatalog (principles).

Implemented as an uncontrolled native <details>/<summary> so the renderers stay
server-component-clean — no useState, no "use client" (unlike CollapsibleGroup,
whose state is the only reason it lives in /interactive). Consumers style the
open/closed states via the native details[open] selector.

The existing data-gemara-part="mappings" sections are unchanged, just nested
inside the new data-gemara-part="references" element (with "references-summary"
on the <summary>), so existing CSS selectors keep working.

- Add per-renderer References wrapper + expose it on each compound API.
- Tests: assert the details exists, is collapsed by default, has the summary
  label, and wraps the mapping sections.
- README + CLAUDE.md: document the new data-gemara-part values.

Signed-off-by: Eddie Knight <knight@linux.com>
@eddie-knight eddie-knight merged commit 8cc9c31 into main Jun 22, 2026
1 check passed
@eddie-knight eddie-knight deleted the docs/format-tabs-guidance branch June 22, 2026 18:36
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