بنقرة واحدة
diagrammo
Inspect and render Mermaid blocks in Markdown as themed SVG output with the packaged ahm-diagrammo CLI.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
القائمة
Inspect and render Mermaid blocks in Markdown as themed SVG output with the packaged ahm-diagrammo CLI.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
| name | diagrammo |
| description | Inspect and render Mermaid blocks in Markdown as themed SVG output with the packaged ahm-diagrammo CLI. |
Use the packaged CLI. Do not reimplement parsing, renderer selection, layout, theming, or SVG generation.
npx --yes ahm-diagrammo "$INPUT" --listnpx --yes ahm-diagrammo "$INPUT" --out "$OUTPUT" --strict$OUTPUT for .svg files, confirm each is non-empty, and report the emitted files.Preserve the user's Markdown. Surface CLI diagnostics and non-zero exits rather than masking
them. --sync-markdown is the sole, explicit opt-in exception: only invoke it when the user asks
to check in an editable-source-plus-rendered-SVG Markdown file, never as a default action. Its
first generated SVG filename is stable for that managed block's lifetime — do not hand-edit its
<!-- diagrammo:sync ... --> markers; renaming a heading or a fence's title=/name= later is
safe and never renames the file. The Mermaid source itself lives fully hidden (not merely
collapsed) inside a <!-- diagrammo:source ... --> comment, with every literal --> escaped to
-->. Editing it directly is safe — write real, unescaped Mermaid (a raw --> is fine); the
next --sync-markdown run decodes, re-renders, and re-escapes it. Never hand-type the literal
--> token into a fence — the CLI rejects a fence that already contains it, since decoding
would then be ambiguous.
Author-controlled options live inside the fence as %%| key: value lines (also settable via
fence-info key=value or a diagrammo: frontmatter block). Common keys: theme, title,
subtitle, lanes, legend, alt, and laneLabels.
To make a wide swimlane narrower, set %%| laneLabels: false. It hides the right-hand lane-label
text and reclaims that gutter — nothing else moves: node placement, edge routing, edge state
colors, lane bands, and SVG height are all unchanged. There is no width-wrapping/maxWidth knob;
narrowing is achieved only by reclaiming the label gutter, never by wrapping lanes onto extra rows.
laneLabels defaults to true (labels shown); a non-boolean value warns and falls back to true.