{
  "id": "markdown",
  "name": "Markdown",
  "level": "molecule",
  "status": "experimental",
  "purpose": "Model or editorial Markdown painted with atoms; app pieces through render slots.",
  "description": "**Purpose** — render the Markdown a model or an editor writes (paragraphs, headings, lists with one nested level, quotes, strong, emphasis, inline code, links) with Poesía atoms only. The source is text: HTML inside it renders literally and nothing goes through `dangerouslySetInnerHTML`.\n**When to use** — an assistant's answer (`size=\"sm\"`, `headings=\"flatten\"`, `streaming` while it arrives), an article or help body (`size=\"md\"`, `headingLevel` under the page's own heading).\n**When NOT** — UI copy you author in code (use `Text`, `Heading` directly); tables, images or embedded HTML (out of the subset on purpose).\n**Composes with** — app pieces through render slots: `renderLink` (client-side routing via `<Link asChild>`, a decorated citation), `renderMarker` (an app's `[[kind:target|label]]` chip), `renderText` (a glossary that decorates terms). `allowLink` narrows the link policy — a model should not choose where the reader goes.\n**Accessibility** — semantic elements throughout (`p`, `h2`–`h6`, `ul`/`ol`, `blockquote`, `strong`, `em`, `code`, `a`); the component says no words of its own (an external link's hint comes from the labels provider, ADR-034).\n**Related patterns** — Decision Matrix · ComponentChoice, Composition · AtomToMolecule, Information Architecture · BasicHierarchy.",
  "role": "content",
  "import": "@rrios-forge/ui/molecules/markdown",
  "exports": [
    "Markdown",
    "isExternalHref",
    "isSafeHref",
    "MARKDOWN_HEADINGS",
    "MARKDOWN_LIST_MARKERS",
    "MARKDOWN_NESTED_LIST_CLASSES",
    "MARKDOWN_SIZES",
    "markdownListVariants",
    "markdownQuoteVariants",
    "markdownVariants"
  ],
  "source": "packages/ui/src/molecules/markdown",
  "axes": [
    {
      "axis": "size",
      "part": null,
      "values": [
        "sm",
        "md"
      ],
      "default": "md",
      "meaning": "Ergonomic scale, in three families (control, text, container)."
    }
  ],
  "needs": [
    {
      "need": "Markdown a model or an editor wrote (an answer, an article body)",
      "answer": "`Markdown` (ADR-046): atoms only, never `dangerouslySetInnerHTML`; app pieces (routing, glossary, chips) through `renderLink` / `renderMarker` / `renderText`, link policy through `allowLink`"
    }
  ],
  "patterns": [
    "Patterns/Decision Matrix · ComponentChoice",
    "Patterns/Composition · AtomToMolecule",
    "Patterns/Information Architecture · BasicHierarchy",
    "Patterns/Density & Growth · ContentGrowth"
  ],
  "a11yExceptions": [],
  "decisions": [
    {
      "id": "ADR-003",
      "title": "Storybook editorial convention and pattern↔component bidirectionality"
    },
    {
      "id": "ADR-046",
      "title": "Markdown is painted with atoms, and apps fill its slots"
    }
  ],
  "stories": [
    {
      "name": "Playground",
      "id": "components-molecules-markdown--playground",
      "interaction": false,
      "snapshots": [
        "dark",
        "light"
      ],
      "skipsSnapshot": false,
      "docs": "/?path=/story/components-molecules-markdown--playground",
      "frame": "/iframe.html?id=components-molecules-markdown--playground&viewMode=story"
    },
    {
      "name": "Sizes",
      "id": "components-molecules-markdown--sizes",
      "interaction": false,
      "snapshots": [
        "dark",
        "light"
      ],
      "skipsSnapshot": false,
      "docs": "/?path=/story/components-molecules-markdown--sizes",
      "frame": "/iframe.html?id=components-molecules-markdown--sizes&viewMode=story"
    },
    {
      "name": "Headings",
      "id": "components-molecules-markdown--headings",
      "interaction": false,
      "snapshots": [
        "dark",
        "light"
      ],
      "skipsSnapshot": false,
      "docs": "/?path=/story/components-molecules-markdown--headings",
      "frame": "/iframe.html?id=components-molecules-markdown--headings&viewMode=story"
    },
    {
      "name": "States",
      "id": "components-molecules-markdown--states",
      "interaction": false,
      "snapshots": [
        "dark",
        "light"
      ],
      "skipsSnapshot": false,
      "docs": "/?path=/story/components-molecules-markdown--states",
      "frame": "/iframe.html?id=components-molecules-markdown--states&viewMode=story"
    },
    {
      "name": "In Context",
      "id": "components-molecules-markdown--in-context",
      "interaction": false,
      "snapshots": [
        "dark",
        "light"
      ],
      "skipsSnapshot": false,
      "docs": "/?path=/story/components-molecules-markdown--in-context",
      "frame": "/iframe.html?id=components-molecules-markdown--in-context&viewMode=story"
    }
  ],
  "storyFile": "tooling/storybook/stories/components/molecules/markdown.stories.tsx"
}
