Markdown — Loidolt Theme

import { Markdown } from '@loidolt/theme-docs';

Example

The beam removes a thin line of material — the kerf. For parts that fit together, draw slots kerf / 2 narrower on each side.

Note

Kerf varies with material and focus. Cut a test comb first.

Raw HTML in the markdown is shown as text, and links and images keep only safe URLs (javascript: and friends are dropped). Turn on allowHtml only for markdown you wrote, or with a sanitize hook.
The first render is synchronous, so the whole document is in the server’s HTML. With Shiki registered (setHighlighterLoader), code is highlighted on the syntax tokens, so it follows light and dark with no second pass.
Admonitions (:::note, > [!TIP]), footnotes, definition lists and task lists all render with their accessible names; every code block is keyboard-reachable and has a copy button.
Mermaid fences become named pictures when Mermaid is registered, with the source kept in a disclosure beneath, and are redrawn in the theme’s colours when it changes.

Generated from the component source, so it cannot drift from the implementation.

Markdown props
Prop	Type	Default	Notes
`class`	`string`	`—`
`copiedLabel`	`string`	`'Copied'`	What a copy button says, and what is announced, once its code is copied.
`diagramLabel`	`string`	`'Diagram'`	Names a drawn Mermaid diagram.
`diagramSourceLabel`	`string`	`'Diagram source'`	Labels the disclosure holding a diagram's source.
`onRender`	`(result: RenderedMarkdown) => void`	`—`	Called with each render — the synchronous one, then the highlighted one if it differs.
`options`	`MarkdownOptions`	`{}`	Rendering options: HTML policy, heading links, labels… See `MarkdownOptions`.
`ref` bindable	`HTMLElement \| null`	`null`
`result`	`RenderedMarkdown`	`—`	Or a result from `renderMarkdown` — e.g. rendered and highlighted in a server `load`.
`source`	`string`	`''`	Markdown to render. The first render is synchronous, so it is in the server's HTML.

Plus the attributes of HTMLAttributes<HTMLElement>, forwarded to the root element.