Skip to content

pantoken / markdown-it

markdown-it

Sperimentale

@pantoken/markdown-it — un plugin per markdown-it che rende i codici :icon: come SVG inline e valori colore autonomi (#03893D, rgb(…), oklch(…)) come campioni colore, usando il set di icone pantoken.

Trasporta le pipeline @pantoken/rehype e @pantoken/react-markdown su markdown-it: una singola regola core percorre i figli di testo di ogni token inline, li suddivide sui pattern di icona e colore e sostituisce le corrispondenze con token html_inline. I codici delle icone vengono risolti tramite una catena — prima i risolutori del plugin rehype, poi un esplicito MarkdownItOptions.resolve, quindi il set integrato @pantoken/icons — quindi i plugin per le icone di brand si compongono nello stesso modo in cui lo fanno altrove.

Il markup generato usa gli stessi nomi di classe degli altri renderer (pantoken-icon, pantoken-color-swatch), dunque il caricamento di @pantoken/components ne applica lo stile. Avvolgere l'HTML renderizzato in un contenitore .pantoken-prose (vedi PROSE_CLASS) per includere anche lo strato di prose.

Esempio

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.");

Interfacce

Variabili

Funzioni

Riferimenti

default

Rinomina e riesporta pantokenMarkdownIt