From b30c06e2d257e0279fe21ad5e24f39ea8ec4a0d3 Mon Sep 17 00:00:00 2001 From: Mohamed Ameen Date: Tue, 27 Oct 2026 18:02:20 -0700 Subject: [PATCH] docs(nc-dom-ser): expand fidelity matrix to comprehensive reference Transform the routing guide into a complete, verbose reference covering: - All block types (headings, text, code, lists, tables) - All inline formatting (emphasis, links, math, code) - Diagrams (Mermaid, Vega, D3, ink, shapes) - Media and attachments (images, documents, audio, video) - Page metadata and structure - Specialized content (tags, containers, printouts, exports) - Known gaps and workarounds Includes all supported objects: Mermaid graphs, Vega+D3 visualizations, Ink drawings, Shapes, Attachments, Images, Printouts, and other known objects. Co-Authored-By: Claude Haiku 4.5 --- .../nc-dom-ser/references/fidelity-matrix.md | 351 +++++++++++++++++- 1 file changed, 341 insertions(+), 10 deletions(-) diff --git a/SKILLS/nc-dom-ser/references/fidelity-matrix.md b/SKILLS/nc-dom-ser/references/fidelity-matrix.md index 359577d..e80f4e5 100644 --- a/SKILLS/nc-dom-ser/references/fidelity-matrix.md +++ b/SKILLS/nc-dom-ser/references/fidelity-matrix.md @@ -1,7 +1,10 @@ -# Page fidelity matrix +# NoteCraft Format Fidelity Matrix -Use this matrix to decide which boundaries and checks a change needs. It is a -routing aid, not a replacement for the normative page model. +**Complete reference for all supported content types, objects, and their representations in HTML and CommonMark/GFM formats.** + +## Quick Reference: Change Impact Guide + +Use this matrix to decide which boundaries and checks a change needs. It is a routing aid, not a replacement for the normative page model. | Change affects | Inspect | Minimum proof | |---|---|---| @@ -15,11 +18,339 @@ routing aid, not a replacement for the normative page model. | Code view | source pane and file listing | visible file ownership and edit round trip | | Demo content | authored content and generated demo | `demo-check`, semantic parity, visual side-by-side | -## Questions before editing +--- + +## Block-Level Content Types + +### Text Blocks + +| Type | HTML | CommonMark | Status | Notes | +|------|------|-----------|--------|-------| +| **Headings** | +| Heading 1 | `

text

` | `# text` | ✓ Full parity | Six levels (h1-h6) supported | +| Heading 2 | `

text

` | `## text` | ✓ Full parity | | +| Heading 3 | `

text

` | `### text` | ✓ Full parity | | +| Heading 4 | `

text

` | `#### text` | ✓ Full parity | | +| Heading 5 | `
text
` | `##### text` | ✓ Full parity | | +| Heading 6 | `
text
` | `###### text` | ✓ Full parity | | +| **Body Text** | +| Paragraph | `

text

` | Line with blank line separator | ✓ Full parity | Standard block; multiple paras separated by blank lines | +| Blockquote | `

text

` | `> text` (can nest) | ✓ Full parity | Container for quoted content; supports nesting | +| **Code Blocks** | +| Code (fenced) | `
` | ` ```xyz ` | ✓ Full parity | Language tag for syntax highlighting |
+| Code (indented) | `
` | 4-space indent | ✓ Full parity | Legacy format, supported in both |
+| **Structural** |
+| Horizontal rule | `
` | `---` or `***` | ✓ Full parity | Visual page divider | + +### Lists + +| Type | HTML | CommonMark | Status | Notes | +|------|------|-----------|--------|-------| +| **Unordered List** | +| Bullet item | `
  • item
` | `- item` or `* item` | ✓ Full parity | Single-level or nested | +| Nested bullets | `
  • item
    • nested
` | Indented ` - nested` | ✓ Full parity | Supports arbitrary depth | +| **Ordered List** | +| Numbered item | `
  1. item
` | `1. item` | ✓ Full parity | Auto-numbered in output | +| Nested numbers | `
  1. item
    1. nested
` | Indented ` 1. nested` | ✓ Full parity | Mixed nesting allowed | +| **Task List** | +| Unchecked task | `
  • Task
  • ` | `- [ ] Task` | ✓ Full parity | GFM extension | +| Checked task | `
  • Done
  • ` | `- [x] Done` | ✓ Full parity | Checked state preserved | + +### Tables + +| Type | HTML | CommonMark | Status | Notes | +|------|------|-----------|--------|-------| +| **Table Structure** | +| Header row | `header` | First row + separator row | ✓ Full parity | GFM table format | +| Data row | `cell` | `\| cell \|` | ✓ Full parity | Multiple rows supported | +| Table cell | `content` | Pipe-delimited | ✓ Full parity | Can contain inline formatting | +| Cell alignment | `` | `:---`, `:---:`, `---:` | ✓ Full parity | Left/center/right justify | + +--- + +## Inline Formatting & Emphasis + +| Format | HTML | CommonMark | Status | Notes | +|--------|------|-----------|--------|-------| +| **Emphasis** | +| Bold | `text` | `**text**` or `__text__` | ✓ Full parity | Strong emphasis | +| Italic | `text` | `*text*` or `_text_` | ✓ Full parity | Emphasis | +| Bold + Italic | `text` | `***text***` or `___text___` | ✓ Full parity | Combined | +| Strikethrough | `text` or `text` | `~~text~~` | ✓ Full parity | GFM strikethrough | +| Subscript | `text` | `~text~` (proposed) | ⚠ Limited | Not standard GFM; HTML-primary | +| Superscript | `text` | `^text^` (proposed) | ⚠ Limited | Not standard GFM; HTML-primary | +| **Links & References** | +| Hyperlink | `text` | `[text](url)` | ✓ Full parity | External or internal | +| Link with title | `text` | `[text](url "Title")` | ✓ Full parity | Tooltip on hover | +| Reference link | `text` | `[text][ref]\n[ref]: url` | ✓ Full parity | Link ref defined elsewhere | +| **Code & Math** | +| Inline code | `text` | `` `text` `` | ✓ Full parity | Monospace; no formatting inside | +| Code (escaped backticks) | `\`text\`` | ``` `` `text` `` ``` | ✓ Full parity | Literal backticks in code | +| Math inline | `$...$` | `$...$` | ✓ Full parity | KaTeX/TeX syntax; wrapped | +| **Images** | +| Inline image | `text` | `![alt](path)` | ✓ Full parity | Inline media reference | +| Image with title | `alt` | `![alt](path "Title")` | ✓ Full parity | Tooltip shown on hover | +| **Special Characters** | +| Hard line break | `
    ` | Two spaces + newline, or `\` | ✓ Full parity | Preserved in both formats | +| Soft break | Newline | Newline | ✓ Full parity | Treated as space in output | + +--- + +## Math & Science Content + +| Type | HTML | CommonMark | Storage | Rendering | +|------|------|-----------|---------|-----------| +| **Inline Math** | +| Math expression | `$E=mc^2$` | `$E=mc^2$` | LaTeX/KaTeX source | MathJax render on display | +| Subscripts | `$CO_2$` | `$CO_2$` | LaTeX | Rendered in display | +| Superscripts | `$E=mc^2$` | `$E=mc^2$` | LaTeX | Rendered in display | +| **Block Math** | +| Display equation | `
    $$E=mc^2$$
    ` | `$$E=mc^2$$` | LaTeX/KaTeX source | MathJax display mode | +| Multiline equation | `
    $$...align...$$
    ` | ` ```math ... ``` ` or `$$...$$` | LaTeX | Display-mode rendering | +| **Chemical Notation** | +| Chemical formula | `H₂O` | `H~2~O` or `H₂O` | Unicode/HTML | Standard subscript format | + +--- + +## Diagrams & Visualizations + +### Mermaid Diagrams + +| Diagram Type | HTML | CommonMark | Storage | Rendering | +|--------------|------|-----------|---------|-----------| +| **Flowcharts** | +| Flowchart | `
    graph LR...
    ` | ` ```mermaid graph LR... ``` ` | Mermaid source | Rendered via mermaid.js | +| **Sequence** | +| Sequence diagram | `
    sequenceDiagram...
    ` | ` ```mermaid sequenceDiagram... ``` ` | Mermaid source | Sequence chart output | +| **Structural** | +| Class diagram | `
    classDiagram...
    ` | ` ```mermaid classDiagram... ``` ` | Mermaid source | OOP structure | +| Entity-relation | `
    erDiagram...
    ` | ` ```mermaid erDiagram... ``` ` | Mermaid source | Database schema | +| State machine | `
    stateDiagram-v2...
    ` | ` ```mermaid stateDiagram... ``` ` | Mermaid source | State transitions | +| **Timelines** | +| Gantt chart | `
    gantt...
    ` | ` ```mermaid gantt... ``` ` | Mermaid source | Project timeline | +| Timeline | `
    timeline...
    ` | ` ```mermaid timeline... ``` ` | Mermaid source | Event timeline | +| **Data Viz** | +| Pie chart | `
    pie title...
    ` | ` ```mermaid pie... ``` ` | Mermaid source | Pie segments | +| Bar chart | `
    bar...
    ` | ` ```mermaid bar... ``` ` | Mermaid source | Bar graph | +| Line chart | `
    line...
    ` | ` ```mermaid line... ``` ` | Mermaid source | Line graph | +| **Mind Map** | +| Mind map | `
    mindmap...
    ` | ` ```mermaid mindmap... ``` ` | Mermaid source | Hierarchical map | +| **Git Graph** | +| Git graph | `
    gitGraph...
    ` | ` ```mermaid gitGraph... ``` ` | Mermaid source | Branch visualization | + +### Data Visualization (Vega & D3) + +| Type | HTML | CommonMark | Storage | Notes | +|------|------|-----------|---------|-------| +| **Vega Specs** | +| Vega spec | `
    ` | ` ```vega {...json...} ``` ` | JSON specification | Rendered via Vega-Lite | +| Vega-Lite spec | Custom container | Code fence with JSON | JSON + metadata | High-level grammar | +| **D3 Visualizations** | +| D3 chart | `...SVG output...` | Not natively supported | SVG output (not source) | HTML-primary; MD shows placeholder | +| Custom D3 | `
    ` + script | Not supported | HTML + JavaScript | Interactive charts | + +### Hand-Drawn & Geometric Content + +| Type | HTML | CommonMark | Storage | Editing | +|------|------|-----------|---------|---------| +| **Ink Drawings** | +| Freehand stroke | `` | `[Hand-drawn image]` | SVG paths in assets | Ink editor UI | +| Annotated ink | `` | Text description | SVG + metadata | Preserve layer info | +| **Shapes** | +| Rectangle | `` | Not supported | SVG element | SVG visual | +| Circle/Oval | `` | Not supported | SVG element | SVG visual | +| Line | `` | Not supported | SVG element | SVG visual | +| Polygon | `` | Not supported | SVG path | SVG visual | +| Free shape | `` | Not supported | SVG path data | SVG visual | +| **Styling** | +| Shape fill | `fill="color"` or `fill="url(#gradient)"` | Not supported | SVG fill attribute | Color or gradient | +| Shape stroke | `stroke="color"` `stroke-width="..."` | Not supported | SVG stroke | Line color/width | +| Opacity | `opacity="0.5"` or `fill-opacity="..."` | Not supported | SVG attribute | Transparency | +| Shadow/Effect | `` | Not supported | SVG filter element | Visual effects | + +--- + +## Media & Attachments + +### Images + +| Format | HTML | CommonMark | Storage | Status | +|--------|------|-----------|---------|--------| +| **Raster Images** | +| PNG | `` | `![alt](page_assets/file.png)` | `page_assets/` folder | ✓ Full support | +| JPEG/JPG | `` | `![alt](page_assets/file.jpg)` | `page_assets/` folder | ✓ Full support | +| WebP | `` | `![alt](page_assets/file.webp)` | `page_assets/` folder | ✓ Full support | +| GIF (static) | `` | `![alt](page_assets/file.gif)` | `page_assets/` folder | ✓ Full support | +| GIF (animated) | `` | `![alt](page_assets/anim.gif)` | `page_assets/` folder | ✓ Full support (plays) | +| **Vector Images** | +| SVG | `` | `![alt](page_assets/file.svg)` | `page_assets/` folder | ✓ Full support | +| SVG (inline) | `...content...` | Not supported natively | Inline in HTML | ⚠ HTML-primary | +| **Image Properties** | +| Dimensions | `width="..." height="..."` | Not in Markdown | Implied from file | Preserved in HTML | +| Alt text | `alt="description"` | `![description](...)` | Both formats | ✓ Full parity | +| Title/caption | `title="caption"` | `![...](... "caption")` | Both formats | ✓ Full parity | + +### Document Attachments + +| Type | HTML | CommonMark | Storage | Access | +|------|------|-----------|---------|--------| +| **Documents** | +| PDF | `` | `[PDF](page_assets/file.pdf)` | `page_assets/` folder | ✓ Downloadable link | +| Word (.docx) | `` | `[Document](page_assets/file.docx)` | `page_assets/` folder | ✓ Downloadable link | +| Excel (.xlsx) | `` | `[Spreadsheet](page_assets/file.xlsx)` | `page_assets/` folder | ✓ Downloadable link | +| PowerPoint (.pptx) | `` | `[Presentation](page_assets/file.pptx)` | `page_assets/` folder | ✓ Downloadable link | +| Text file (.txt) | `` | `[Text](page_assets/notes.txt)` | `page_assets/` folder | ✓ Downloadable link | +| **Generic Files** | +| Any file | `Download` | `[File](page_assets/file.ext)` | `page_assets/` folder | ✓ Downloadable link | + +### Audio & Video + +| Type | HTML | CommonMark | Storage | Playback | +|------|------|-----------|---------|----------| +| **Video** | +| MP4 | `