Skip to content

pantoken / markdown-it

markdown-it

Experimental

@pantoken/markdown-it — um plugin do markdown-it que renderiza códigos :icon: como SVGs inline e valores de cor independentes (#03893D, rgb(…), oklch(…)) como amostras, usando o conjunto de ícones pantoken.

Ele porta os pipelines @pantoken/rehype e @pantoken/react-markdown para o markdown-it: uma única regra principal percorre os filhos de texto de cada token inline, separa-os pelos padrões de ícone e cor, e substitui as correspondências por tokens html_inline. Códigos de ícone são resolvidos por uma cadeia — primeiro resolvers do plugin rehype, depois um MarkdownItOptions.resolve explícito, e por fim o conjunto interno @pantoken/icons — assim plugins de ícones de marca se compõem do mesmo modo que em outros lugares.

O markup gerado usa os mesmos nomes de classe que os outros renderizadores (pantoken-icon, pantoken-color-swatch), portanto carregar @pantoken/components o estiliza. Envolva o HTML renderizado em um container .pantoken-prose (veja PROSE_CLASS) para também aplicar a camada de prosa.

Exemplo

ts
import MarkdownIt from "markdown-it";
import { pantokenMarkdownIt } from "@pantoken/markdown-it";

const md = new MarkdownIt().use(pantokenMarkdownIt);
md.render("Save :check: to lock in #03893D.");

Interfaces

Variáveis

Funções

Referências

default

Renomeia e reexporta pantokenMarkdownIt