<.dm_markdown_body
  id="markdown-body-single-default"
  source="# Page title
This is a paragraph with **bold**, *italic*, and `inline code`.
- List item one
- List item two
"
 />

<.dm_markdown_body
  id="markdown-body-single-github-flavored-markdown"
  source="## Project status :rocket:
| Feature | Status |
| ------- | ------ |
| Tables | :white_check_mark: |
| Task lists | :white_check_mark: |
- [x] Render on the server
- [ ] Publish the release
Visit https://github.com/duskmoon-dev for more.
"
 />

<.dm_markdown_body
  id="markdown-body-single-mermaid"
  source="## Request flow
```mermaid
flowchart LR
  Browser --> LiveView
  LiveView --> MDEx
```
"
 />

<.dm_markdown_body
  id="markdown-body-single-front-matter-and-color-chips"
  source="---
title: DmMarkdown feature showcase
tags:
  - rust
  - yew
accent: '#4C86FC'
---
# DmMarkdown rendering
## Inline color chips
| Color | Inline code |
| --- | --- |
| Brand blue | `#4C86FC` |
| White | `#fff` |
| Black | `#000` |
| Transparent red | `#FF000080` |
"
 />

<.dm_markdown_body id="markdown-body-single-hard-line-breaks" source="First line
Second line" />

<.dm_markdown_body
  id="markdown-body-single-safe-html"
  options={[render: [unsafe: true], sanitize: [id_prefix: nil, strip_comments: true, rm_allowed_classes: %{}, add_allowed_classes: %{}, allowed_classes: %{}, link_rel: "noopener noreferrer", url_relative: :passthrough, rm_url_schemes: [], add_url_schemes: [], url_schemes: ["bitcoin", "ftp", "ftps", "geo", "http", "https", "im", "irc", "ircs", "magnet", "mailto", "mms", "mx", "news", "nntp", "openpgp4fpr", "sip", "sms", "smsto", "ssh", "tel", "url", "webcal", "wtai", "xmpp"], rm_generic_attributes: [], add_generic_attributes: [], generic_attributes: ["lang", "title"], rm_generic_attribute_prefixes: [], add_generic_attribute_prefixes: [], generic_attribute_prefixes: [], rm_set_tag_attribute_value: %{}, set_tag_attribute_value: %{}, set_tag_attribute_values: %{}, rm_tag_attribute_values: %{}, add_tag_attribute_values: %{}, tag_attribute_values: %{}, rm_tag_attributes: %{}, add_tag_attributes: %{}, tag_attributes: %{"a" => ["href", "hreflang"], "bdo" => ["dir"], "blockquote" => ["cite"], "code" => ["class", "style", "translate", "tabindex"], "col" => ["align", "char", "charoff", "span"], "colgroup" => ["align", "char", "charoff", "span"], "del" => ["cite", "datetime"], "div" => ["class", "style", "data-line"], "hr" => ["align", "size", "width"], "img" => ["align", "alt", "height", "src", "width"], "ins" => ["cite", "datetime"], "ol" => ["start"], "pre" => [...], ...}, ...]]}
  source="<article><mark>Safe HTML</mark><script>alert('unsafe')</script></article>"
  plugins={[MDExGFM]}
 />

<.dm_markdown_body
  id="markdown-body-single-custom-class"
  class="max-w-3xl mx-auto"
  source="# Constrained content
The component always includes `markdown-body`."
 />