pantoken / markdown-it

markdown-it ​

Thử nghiệm

@pantoken/markdown-it — một plugin markdown-it hiển thị mã :icon: dưới dạng SVG nội tuyến và các giá trị màu độc lập (#03893D, rgb(…), oklch(…)) dưới dạng bảng màu (swatches), sử dụng bộ biểu tượng pantoken.

Nó cổng các pipeline @pantoken/rehype và @pantoken/react-markdown sang markdown-it: một quy tắc lõi duy nhất duyệt qua các nút văn bản con của mỗi token nội tuyến, tách chúng theo các mẫu biểu tượng và màu sắc, và thay thế các khớp bằng các token html_inline. Mã biểu tượng được giải quyết qua một chuỗi — trước tiên là bộ giải rehype của plugin, sau đó là MarkdownItOptions.resolve rõ ràng, rồi đến bộ @pantoken/icons tích hợp — nên các plugin biểu tượng thương hiệu ghép nối cùng cách như ở các chỗ khác.

Đánh dấu được phát ra sử dụng cùng tên lớp với các renderer khác (pantoken-icon, pantoken-color-swatch), vì vậy khi nạp @pantoken/components sẽ có kiểu cho nó. Bao bọc HTML đã render trong một container .pantoken-prose (xem PROSE_CLASS) để nhận cả lớp prose nữa.

Ví dụ ​

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

Giao diện ​

Biến ​

Hàm ​

Tham chiếu ​

default ​

Đổi tên và xuất lại pantokenMarkdownIt