ds-markdown 0.0.6 → 0.0.7

package/dist/cjs/components/HighReactMarkdown/Highlighter/index.d.ts

@@ -1,4 +1,7 @@
 import React from 'react';
+import 'prismjs/components/prism-typescript';
+import 'prismjs/components/prism-jsx';
+import 'prismjs/components/prism-tsx';
 interface HighlighterProps {
     children: string;
 }

package/dist/cjs/components/HighReactMarkdown/Highlighter/index.js

@@ -1,9 +1,23 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+const prismjs_1 = __importDefault(require("prismjs"));
+const classnames_1 = __importDefault(require("classnames"));
+// 必须手动导入 TSX 相关语言定义
+require("prismjs/components/prism-typescript");
+require("prismjs/components/prism-jsx");
+require("prismjs/components/prism-tsx"); // TSX 核心语法
+console.log(prismjs_1.default.languages);
 const modulePrefix = 'Highlighter';
 const Highlighter = ({ children }) => {
-    return (0, jsx_runtime_1.jsx)("div", { className: modulePrefix });
+    const html = prismjs_1.default.highlight(children, prismjs_1.default.languages.jsx, 'jsx');
+    return ((0, jsx_runtime_1.jsx)("pre", { className: (0, classnames_1.default)({
+            [modulePrefix]: true,
+            'language-jsx': true,
+        }), children: (0, jsx_runtime_1.jsx)("code", { className: "language-jsx", dangerouslySetInnerHTML: { __html: html } }) }));
 };
 exports.default = Highlighter;
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/HighReactMarkdown/Highlighter/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/HighReactMarkdown/Highlighter/index.tsx"],"names":[],"mappings":";;;AAMA,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,WAAW,GAA+B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC/D,OAAO,gCAAK,SAAS,EAAE,YAAY,GAAQ,CAAC;AAC9C,CAAC,CAAC;AAEF,kBAAe,WAAW,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/HighReactMarkdown/Highlighter/index.tsx"],"names":[],"mappings":";;;;;;AACA,sDAA4B;AAC5B,4DAAoC;AAEpC,oBAAoB;AACpB,+CAA6C;AAC7C,wCAAsC;AACtC,wCAAsC,CAAC,WAAW;AAElD,OAAO,CAAC,GAAG,CAAC,iBAAK,CAAC,SAAS,CAAC,CAAC;AAM7B,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,WAAW,GAA+B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC/D,MAAM,IAAI,GAAG,iBAAK,CAAC,SAAS,CAAC,QAAQ,EAAE,iBAAK,CAAC,SAAS,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IACnE,OAAO,CACL,gCACE,SAAS,EAAE,IAAA,oBAAU,EAAC;YACpB,CAAC,YAAY,CAAC,EAAE,IAAI;YACpB,cAAc,EAAE,IAAI;SACrB,CAAC,YAEF,iCAAM,SAAS,EAAC,cAAc,EAAC,uBAAuB,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,GAAI,GACxE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,WAAW,CAAC"}

package/dist/cjs/components/HighReactMarkdown/index.js

@@ -7,6 +7,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const react_markdown_1 = __importDefault(require("react-markdown"));
 const react_syntax_highlighter_1 = require("react-syntax-highlighter");
+const coy_1 = __importDefault(require("react-syntax-highlighter/dist/esm/styles/prism/coy"));
 const remark_gfm_1 = __importDefault(require("remark-gfm"));
 const index_js_1 = __importDefault(require("../BlockWrap/index.js"));
 const modulePrefix = 'HighReactMarkdown';
@@ -14,7 +15,7 @@ const HighReactMarkdown = (props) => {
     return ((0, jsx_runtime_1.jsx)(react_markdown_1.default, { remarkPlugins: [remark_gfm_1.default], components: {
             code: ({ className, children, ...props }) => {
                 const match = /language-(\w+)/.exec(className || '');
-                return match ? ((0, jsx_runtime_1.jsx)(index_js_1.default, { language: match[1], children: (0, jsx_runtime_1.jsx)(react_syntax_highlighter_1.Prism, { language: match[1], children: String(children).replace(/\n$/, '') }) })) : ((0, jsx_runtime_1.jsx)("code", { className: className, ...props, children: children }));
+                return match ? ((0, jsx_runtime_1.jsx)(index_js_1.default, { language: match[1], children: (0, jsx_runtime_1.jsx)(react_syntax_highlighter_1.Prism, { useInlineStyles: false, language: match[1], style: coy_1.default, children: String(children).replace(/\n$/, '') }) })) : ((0, jsx_runtime_1.jsx)("code", { className: className, ...props, children: children }));
             },
             table: ({ children, ...props }) => {
                 return ((0, jsx_runtime_1.jsx)("div", { className: "markdown-table-wrapper", children: (0, jsx_runtime_1.jsx)("table", { className: "ds-markdown-table", children: children }) }));

package/dist/cjs/components/HighReactMarkdown/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/HighReactMarkdown/index.tsx"],"names":[],"mappings":";;;;;;AAAA,iCAAoC;AACpC,oEAAsC;AAEtC,uEAAsE;AAEtE,4DAAmC;AAEnC,qEAA8C;AAM9C,MAAM,YAAY,GAAG,mBAAmB,CAAC;AACzC,MAAM,iBAAiB,GAAqC,CAAC,KAAK,EAAE,EAAE;IACpE,OAAO,CACL,uBAAC,wBAAQ,IACP,aAAa,EAAE,CAAC,oBAAS,CAAC,EAC1B,UAAU,EAAE;YACV,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;gBAC1C,MAAM,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC;gBACrD,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,uBAAC,kBAAS,IAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,YAC3B,uBAAC,gCAAiB,IAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,YAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,GAAqB,GACtF,CACb,CAAC,CAAC,CAAC,CACF,iCAAM,SAAS,EAAE,SAAS,KAAM,KAAK,YAClC,QAAQ,GACJ,CACR,CAAC;YACJ,CAAC;YACD,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;gBAChC,OAAO,CACL,gCAAK,SAAS,EAAC,wBAAwB,YACrC,kCAAO,SAAS,EAAC,mBAAmB,YAAE,QAAQ,GAAS,GACnD,CACP,CAAC;YACJ,CAAC;SACF,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AACF,kBAAe,IAAA,YAAI,EAAC,iBAAiB,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/HighReactMarkdown/index.tsx"],"names":[],"mappings":";;;;;;AAAA,iCAAoC;AACpC,oEAAsC;AAEtC,uEAAsE;AACtE,6FAAuE;AACvE,4DAAmC;AAEnC,qEAA8C;AAM9C,MAAM,YAAY,GAAG,mBAAmB,CAAC;AACzC,MAAM,iBAAiB,GAAqC,CAAC,KAAK,EAAE,EAAE;IACpE,OAAO,CACL,uBAAC,wBAAQ,IACP,aAAa,EAAE,CAAC,oBAAS,CAAC,EAC1B,UAAU,EAAE;YACV,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;gBAC1C,MAAM,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC;gBACrD,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,uBAAC,kBAAS,IAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,YAC3B,uBAAC,gCAAiB,IAAC,eAAe,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,aAAK,YACxE,MAAM,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,GAClB,GAEV,CACb,CAAC,CAAC,CAAC,CACF,iCAAM,SAAS,EAAE,SAAS,KAAM,KAAK,YAClC,QAAQ,GACJ,CACR,CAAC;YACJ,CAAC;YACD,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;gBAChC,OAAO,CACL,gCAAK,SAAS,EAAC,wBAAwB,YACrC,kCAAO,SAAS,EAAC,mBAAmB,YAAE,QAAQ,GAAS,GACnD,CACP,CAAC;YACJ,CAAC;SACF,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AACF,kBAAe,IAAA,YAAI,EAAC,iBAAiB,CAAC,CAAC"}

package/dist/esm/components/HighReactMarkdown/Highlighter/index.d.ts

@@ -1,4 +1,7 @@
 import React from 'react';
+import 'prismjs/components/prism-typescript';
+import 'prismjs/components/prism-jsx';
+import 'prismjs/components/prism-tsx';
 interface HighlighterProps {
     children: string;
 }

package/dist/esm/components/HighReactMarkdown/Highlighter/index.js

@@ -1,7 +1,18 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import Prism from 'prismjs';
+import classNames from 'classnames';
+// 必须手动导入 TSX 相关语言定义
+import 'prismjs/components/prism-typescript';
+import 'prismjs/components/prism-jsx';
+import 'prismjs/components/prism-tsx'; // TSX 核心语法
+console.log(Prism.languages);
 const modulePrefix = 'Highlighter';
 const Highlighter = ({ children }) => {
-    return _jsx("div", { className: modulePrefix });
+    const html = Prism.highlight(children, Prism.languages.jsx, 'jsx');
+    return (_jsx("pre", { className: classNames({
+            [modulePrefix]: true,
+            'language-jsx': true,
+        }), children: _jsx("code", { className: "language-jsx", dangerouslySetInnerHTML: { __html: html } }) }));
 };
 export default Highlighter;
 //# sourceMappingURL=index.js.map

package/dist/esm/components/HighReactMarkdown/Highlighter/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/HighReactMarkdown/Highlighter/index.tsx"],"names":[],"mappings":";AAMA,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,WAAW,GAA+B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC/D,OAAO,cAAK,SAAS,EAAE,YAAY,GAAQ,CAAC;AAC9C,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/HighReactMarkdown/Highlighter/index.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,MAAM,SAAS,CAAC;AAC5B,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,oBAAoB;AACpB,OAAO,qCAAqC,CAAC;AAC7C,OAAO,8BAA8B,CAAC;AACtC,OAAO,8BAA8B,CAAC,CAAC,WAAW;AAElD,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;AAM7B,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,WAAW,GAA+B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC/D,MAAM,IAAI,GAAG,KAAK,CAAC,SAAS,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IACnE,OAAO,CACL,cACE,SAAS,EAAE,UAAU,CAAC;YACpB,CAAC,YAAY,CAAC,EAAE,IAAI;YACpB,cAAc,EAAE,IAAI;SACrB,CAAC,YAEF,eAAM,SAAS,EAAC,cAAc,EAAC,uBAAuB,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,GAAI,GACxE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/esm/components/HighReactMarkdown/index.js

@@ -2,6 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { memo } from 'react';
 import Markdown from 'react-markdown';
 import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
+import style from 'react-syntax-highlighter/dist/esm/styles/prism/coy';
 import gfmPlugin from 'remark-gfm';
 import BlockWrap from '../BlockWrap/index.js';
 const modulePrefix = 'HighReactMarkdown';
@@ -9,7 +10,7 @@ const HighReactMarkdown = (props) => {
     return (_jsx(Markdown, { remarkPlugins: [gfmPlugin], components: {
             code: ({ className, children, ...props }) => {
                 const match = /language-(\w+)/.exec(className || '');
-                return match ? (_jsx(BlockWrap, { language: match[1], children: _jsx(SyntaxHighlighter, { language: match[1], children: String(children).replace(/\n$/, '') }) })) : (_jsx("code", { className: className, ...props, children: children }));
+                return match ? (_jsx(BlockWrap, { language: match[1], children: _jsx(SyntaxHighlighter, { useInlineStyles: false, language: match[1], style: style, children: String(children).replace(/\n$/, '') }) })) : (_jsx("code", { className: className, ...props, children: children }));
             },
             table: ({ children, ...props }) => {
                 return (_jsx("div", { className: "markdown-table-wrapper", children: _jsx("table", { className: "ds-markdown-table", children: children }) }));

package/dist/esm/components/HighReactMarkdown/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/HighReactMarkdown/index.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AAEtC,OAAO,EAAE,KAAK,IAAI,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAEtE,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,SAAS,MAAM,uBAAuB,CAAC;AAM9C,MAAM,YAAY,GAAG,mBAAmB,CAAC;AACzC,MAAM,iBAAiB,GAAqC,CAAC,KAAK,EAAE,EAAE;IACpE,OAAO,CACL,KAAC,QAAQ,IACP,aAAa,EAAE,CAAC,SAAS,CAAC,EAC1B,UAAU,EAAE;YACV,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;gBAC1C,MAAM,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC;gBACrD,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,IAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,YAC3B,KAAC,iBAAiB,IAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,YAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,GAAqB,GACtF,CACb,CAAC,CAAC,CAAC,CACF,eAAM,SAAS,EAAE,SAAS,KAAM,KAAK,YAClC,QAAQ,GACJ,CACR,CAAC;YACJ,CAAC;YACD,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;gBAChC,OAAO,CACL,cAAK,SAAS,EAAC,wBAAwB,YACrC,gBAAO,SAAS,EAAC,mBAAmB,YAAE,QAAQ,GAAS,GACnD,CACP,CAAC;YACJ,CAAC;SACF,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,IAAI,CAAC,iBAAiB,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/HighReactMarkdown/index.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AAEtC,OAAO,EAAE,KAAK,IAAI,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AACtE,OAAO,KAAK,MAAM,oDAAoD,CAAC;AACvE,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,SAAS,MAAM,uBAAuB,CAAC;AAM9C,MAAM,YAAY,GAAG,mBAAmB,CAAC;AACzC,MAAM,iBAAiB,GAAqC,CAAC,KAAK,EAAE,EAAE;IACpE,OAAO,CACL,KAAC,QAAQ,IACP,aAAa,EAAE,CAAC,SAAS,CAAC,EAC1B,UAAU,EAAE;YACV,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;gBAC1C,MAAM,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC;gBACrD,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,IAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,YAC3B,KAAC,iBAAiB,IAAC,eAAe,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,YACxE,MAAM,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,GAClB,GAEV,CACb,CAAC,CAAC,CAAC,CACF,eAAM,SAAS,EAAE,SAAS,KAAM,KAAK,YAClC,QAAQ,GACJ,CACR,CAAC;YACJ,CAAC;YACD,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;gBAChC,OAAO,CACL,cAAK,SAAS,EAAC,wBAAwB,YACrC,gBAAO,SAAS,EAAC,mBAAmB,YAAE,QAAQ,GAAS,GACnD,CACP,CAAC;YACJ,CAAC;SACF,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,IAAI,CAAC,iBAAiB,CAAC,CAAC"}

package/dist/style.css

@@ -307,3 +307,552 @@ ds-markdown-math {
   min-width: 100px;
   max-width: max(30vw, 320px);
 }
+.md-code-block.md-code-block-dark code[class*='language-'],
+.md-code-block.md-code-block-dark pre[class*='language-'] {
+  color: #e3eaf2;
+  text-align: left;
+  white-space: pre;
+  word-spacing: normal;
+  word-break: normal;
+  word-wrap: normal;
+  -moz-tab-size: 4;
+  tab-size: 4;
+  -webkit-hyphens: none;
+  -ms-hyphens: none;
+  hyphens: none;
+  background: 0 0;
+  font-family: Consolas,
+    Monaco,
+    Andale Mono,
+    Ubuntu Mono,
+    monospace;
+  line-height: 1.5;
+}
+.md-code-block.md-code-block-dark pre[class*='language-']::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark pre[class*='language-'] ::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark code[class*='language-']::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark code[class*='language-'] ::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark pre[class*='language-']::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark pre[class*='language-'] ::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark code[class*='language-']::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark code[class*='language-'] ::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark pre[class*='language-']::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark pre[class*='language-']::selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark pre[class*='language-'] ::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark pre[class*='language-'] ::selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark code[class*='language-']::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark code[class*='language-']::selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark code[class*='language-'] ::-moz-selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark code[class*='language-'] ::selection {
+  background: #3c526d;
+}
+.md-code-block.md-code-block-dark pre[class*='language-'] {
+  margin: 0.5em 0;
+  padding: 1em;
+  overflow: auto;
+}
+.md-code-block.md-code-block-dark :not(pre) > code[class*='language-'],
+.md-code-block.md-code-block-dark pre[class*='language-'] {
+  background: #111b27;
+}
+.md-code-block.md-code-block-dark :not(pre) > code[class*='language-'] {
+  white-space: normal;
+  border-radius: 0.3em;
+  padding: 0.1em 0.3em;
+}
+.md-code-block.md-code-block-dark .token.comment,
+.md-code-block.md-code-block-dark .token.prolog,
+.md-code-block.md-code-block-dark .token.doctype,
+.md-code-block.md-code-block-dark .token.cdata {
+  color: #8da1b9;
+}
+.md-code-block.md-code-block-dark .token.punctuation {
+  color: #e3eaf2;
+}
+.md-code-block.md-code-block-dark .token.delimiter.important,
+.md-code-block.md-code-block-dark .token.selector .parent,
+.md-code-block.md-code-block-dark .token.tag,
+.md-code-block.md-code-block-dark .token.tag .token.punctuation {
+  color: #6cc;
+}
+.md-code-block.md-code-block-dark .token.attr-name,
+.md-code-block.md-code-block-dark .token.boolean,
+.md-code-block.md-code-block-dark .token.boolean.important,
+.md-code-block.md-code-block-dark .token.number,
+.md-code-block.md-code-block-dark .token.constant,
+.md-code-block.md-code-block-dark .token.selector .token.attribute {
+  color: #e6d37a;
+}
+.md-code-block.md-code-block-dark .token.class-name,
+.md-code-block.md-code-block-dark .token.key,
+.md-code-block.md-code-block-dark .token.parameter,
+.md-code-block.md-code-block-dark .token.property,
+.md-code-block.md-code-block-dark .token.property-access,
+.md-code-block.md-code-block-dark .token.variable {
+  color: #6cb8e6;
+}
+.md-code-block.md-code-block-dark .token.attr-value,
+.md-code-block.md-code-block-dark .token.inserted,
+.md-code-block.md-code-block-dark .token.color,
+.md-code-block.md-code-block-dark .token.selector .token.value,
+.md-code-block.md-code-block-dark .token.string,
+.md-code-block.md-code-block-dark .token.string .token.url-link {
+  color: #91d076;
+}
+.md-code-block.md-code-block-dark .token.builtin,
+.md-code-block.md-code-block-dark .token.keyword-array,
+.md-code-block.md-code-block-dark .token.package,
+.md-code-block.md-code-block-dark .token.regex {
+  color: #f4adf4;
+}
+.md-code-block.md-code-block-dark .token.function,
+.md-code-block.md-code-block-dark .token.selector .token.class,
+.md-code-block.md-code-block-dark .token.selector .token.id {
+  color: #c699e3;
+}
+.md-code-block.md-code-block-dark .token.atrule .token.rule,
+.md-code-block.md-code-block-dark .token.combinator,
+.md-code-block.md-code-block-dark .token.keyword,
+.md-code-block.md-code-block-dark .token.operator,
+.md-code-block.md-code-block-dark .token.pseudo-class,
+.md-code-block.md-code-block-dark .token.pseudo-element,
+.md-code-block.md-code-block-dark .token.selector,
+.md-code-block.md-code-block-dark .token.unit {
+  color: #e9ae7e;
+}
+.md-code-block.md-code-block-dark .token.deleted,
+.md-code-block.md-code-block-dark .token.important {
+  color: #cd6660;
+}
+.md-code-block.md-code-block-dark .token.keyword-this,
+.md-code-block.md-code-block-dark .token.this {
+  color: #6cb8e6;
+}
+.md-code-block.md-code-block-dark .token.important,
+.md-code-block.md-code-block-dark .token.keyword-this,
+.md-code-block.md-code-block-dark .token.this,
+.md-code-block.md-code-block-dark .token.bold {
+  font-weight: 700;
+}
+.md-code-block.md-code-block-dark .token.delimiter.important {
+  font-weight: inherit;
+}
+.md-code-block.md-code-block-dark .token.italic {
+  font-style: italic;
+}
+.md-code-block.md-code-block-dark .token.entity {
+  cursor: help;
+}
+.md-code-block.md-code-block-dark .language-markdown .token.title,
+.md-code-block.md-code-block-dark .language-markdown .token.title .token.punctuation {
+  color: #6cb8e6;
+  font-weight: 700;
+}
+.md-code-block.md-code-block-dark .language-markdown .token.blockquote.punctuation {
+  color: #f4adf4;
+}
+.md-code-block.md-code-block-dark .language-markdown .token.code {
+  color: #6cc;
+}
+.md-code-block.md-code-block-dark .language-markdown .token.hr.punctuation {
+  color: #6cb8e6;
+}
+.md-code-block.md-code-block-dark .language-markdown .token.url .token.content {
+  color: #91d076;
+}
+.md-code-block.md-code-block-dark .language-markdown .token.url-link {
+  color: #e6d37a;
+}
+.md-code-block.md-code-block-dark .language-markdown .token.list.punctuation {
+  color: #f4adf4;
+}
+.md-code-block.md-code-block-dark .language-markdown .token.table-header,
+.md-code-block.md-code-block-dark .language-json .token.operator {
+  color: #e3eaf2;
+}
+.md-code-block.md-code-block-dark .language-scss .token.variable {
+  color: #6cc;
+}
+.md-code-block.md-code-block-dark .token.token.tab:not(:empty):before,
+.md-code-block.md-code-block-dark .token.token.cr:before,
+.md-code-block.md-code-block-dark .token.token.lf:before,
+.md-code-block.md-code-block-dark .token.token.space:before {
+  color: #8da1b9;
+}
+.md-code-block.md-code-block-dark div.code-toolbar > .toolbar.toolbar > .toolbar-item > a,
+.md-code-block.md-code-block-dark div.code-toolbar > .toolbar.toolbar > .toolbar-item > button {
+  color: #111b27;
+  background: #6cb8e6;
+}
+.md-code-block.md-code-block-dark div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:hover,
+.md-code-block.md-code-block-dark div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:focus,
+.md-code-block.md-code-block-dark div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:hover,
+.md-code-block.md-code-block-dark div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:focus {
+  color: #111b27;
+  background: rgba(108, 184, 230, 0.855);
+  text-decoration: none;
+}
+.md-code-block.md-code-block-dark div.code-toolbar > .toolbar.toolbar > .toolbar-item > span,
+.md-code-block.md-code-block-dark div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:hover,
+.md-code-block.md-code-block-dark div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:focus {
+  color: #111b27;
+  background: #8da1b9;
+}
+.md-code-block.md-code-block-dark .line-highlight.line-highlight {
+  background: linear-gradient(90deg, rgba(60, 82, 109, 0.373) 70%, rgba(60, 82, 109, 0.333));
+}
+.md-code-block.md-code-block-dark .line-highlight.line-highlight:before,
+.md-code-block.md-code-block-dark .line-highlight.line-highlight[data-end]:after {
+  color: #111b27;
+  background-color: #8da1b9;
+  box-shadow: 0 1px #3c526d;
+}
+.md-code-block.md-code-block-dark pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows > span:hover:before {
+  background-color: rgba(141, 161, 185, 0.094);
+}
+.md-code-block.md-code-block-dark .line-numbers.line-numbers .line-numbers-rows {
+  background: rgba(11, 18, 27, 0.48);
+  border-right: 1px solid #0b121b;
+}
+.md-code-block.md-code-block-dark .line-numbers .line-numbers-rows > span:before {
+  color: rgba(141, 161, 185, 0.855);
+}
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-1,
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-5,
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-9 {
+  color: #e6d37a;
+}
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-2,
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-6,
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-10 {
+  color: #f4adf4;
+}
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-3,
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-7,
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-11 {
+  color: #6cb8e6;
+}
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-4,
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-8,
+.md-code-block.md-code-block-dark .rainbow-braces .token.token.punctuation.brace-level-12 {
+  color: #c699e3;
+}
+.md-code-block.md-code-block-dark pre.diff-highlight > code .token.token.deleted:not(.prefix),
+.md-code-block.md-code-block-dark pre > code.diff-highlight .token.token.deleted:not(.prefix) {
+  background-color: rgba(205, 102, 96, 0.12);
+}
+.md-code-block.md-code-block-dark pre.diff-highlight > code .token.token.inserted:not(.prefix),
+.md-code-block.md-code-block-dark pre > code.diff-highlight .token.token.inserted:not(.prefix) {
+  background-color: rgba(145, 208, 118, 0.12);
+}
+.md-code-block.md-code-block-dark .command-line .command-line-prompt {
+  border-right: 1px solid #0b121b;
+}
+.md-code-block.md-code-block-dark .command-line .command-line-prompt > span:before {
+  color: rgba(141, 161, 185, 0.855);
+}
+.md-code-block.md-code-block-light code[class*='language-'],
+.md-code-block.md-code-block-light pre[class*='language-'] {
+  color: #383a42;
+  text-align: left;
+  white-space: pre;
+  word-spacing: normal;
+  word-break: normal;
+  -moz-tab-size: 2;
+  tab-size: 2;
+  -webkit-hyphens: none;
+  -ms-hyphens: none;
+  hyphens: none;
+  direction: ltr;
+  background: #fafafa;
+  font-family: Fira Code,
+    Fira Mono,
+    Menlo,
+    Consolas,
+    DejaVu Sans Mono,
+    monospace;
+  line-height: 1.5;
+}
+.md-code-block.md-code-block-light code[class*='language-']::-moz-selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light code[class*='language-'] ::-moz-selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light pre[class*='language-'] ::-moz-selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light code[class*='language-']::-moz-selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light code[class*='language-'] ::-moz-selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light pre[class*='language-'] ::-moz-selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light code[class*='language-']::-moz-selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light code[class*='language-']::selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light code[class*='language-'] ::-moz-selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light code[class*='language-'] ::selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light pre[class*='language-'] ::-moz-selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light pre[class*='language-'] ::selection {
+  color: inherit;
+  background: #e5e5e6;
+}
+.md-code-block.md-code-block-light pre[class*='language-'] {
+  border-radius: 0.3em;
+  margin: 0.5em 0;
+  padding: 1em;
+  overflow: auto;
+}
+.md-code-block.md-code-block-light :not(pre) > code[class*='language-'] {
+  white-space: normal;
+  border-radius: 0.3em;
+  padding: 0.2em 0.3em;
+}
+.md-code-block.md-code-block-light .token.comment,
+.md-code-block.md-code-block-light .token.prolog,
+.md-code-block.md-code-block-light .token.cdata {
+  color: #a0a1a7;
+}
+.md-code-block.md-code-block-light .token.doctype,
+.md-code-block.md-code-block-light .token.punctuation,
+.md-code-block.md-code-block-light .token.entity {
+  color: #383a42;
+}
+.md-code-block.md-code-block-light .token.attr-name,
+.md-code-block.md-code-block-light .token.class-name,
+.md-code-block.md-code-block-light .token.boolean,
+.md-code-block.md-code-block-light .token.constant,
+.md-code-block.md-code-block-light .token.number,
+.md-code-block.md-code-block-light .token.atrule {
+  color: #b76b01;
+}
+.md-code-block.md-code-block-light .token.keyword {
+  color: #a626a4;
+}
+.md-code-block.md-code-block-light .token.property,
+.md-code-block.md-code-block-light .token.tag,
+.md-code-block.md-code-block-light .token.symbol,
+.md-code-block.md-code-block-light .token.deleted,
+.md-code-block.md-code-block-light .token.important {
+  color: #e45649;
+}
+.md-code-block.md-code-block-light .token.selector,
+.md-code-block.md-code-block-light .token.string,
+.md-code-block.md-code-block-light .token.char,
+.md-code-block.md-code-block-light .token.builtin,
+.md-code-block.md-code-block-light .token.inserted,
+.md-code-block.md-code-block-light .token.regex,
+.md-code-block.md-code-block-light .token.attr-value,
+.md-code-block.md-code-block-light .token.attr-value > .token.punctuation {
+  color: #50a14f;
+}
+.md-code-block.md-code-block-light .token.variable,
+.md-code-block.md-code-block-light .token.operator,
+.md-code-block.md-code-block-light .token.function {
+  color: #4078f2;
+}
+.md-code-block.md-code-block-light .token.url {
+  color: #0184bc;
+}
+.md-code-block.md-code-block-light .token.attr-value > .token.punctuation.attr-equals,
+.md-code-block.md-code-block-light .token.special-attr > .token.attr-value > .token.value.css {
+  color: #383a42;
+}
+.md-code-block.md-code-block-light .language-css .token.selector {
+  color: #e45649;
+}
+.md-code-block.md-code-block-light .language-css .token.property {
+  color: #383a42;
+}
+.md-code-block.md-code-block-light .language-css .token.function,
+.md-code-block.md-code-block-light .language-css .token.url > .token.function {
+  color: #0184bc;
+}
+.md-code-block.md-code-block-light .language-css .token.url > .token.string.url {
+  color: #50a14f;
+}
+.md-code-block.md-code-block-light .language-css .token.important,
+.md-code-block.md-code-block-light .language-css .token.atrule .token.rule,
+.md-code-block.md-code-block-light .language-javascript .token.operator {
+  color: #a626a4;
+}
+.md-code-block.md-code-block-light .language-javascript .token.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation {
+  color: #ca1243;
+}
+.md-code-block.md-code-block-light .language-json .token.operator {
+  color: #383a42;
+}
+.md-code-block.md-code-block-light .language-json .token.null.keyword {
+  color: #b76b01;
+}
+.md-code-block.md-code-block-light .language-markdown .token.url,
+.md-code-block.md-code-block-light .language-markdown .token.url > .token.operator,
+.md-code-block.md-code-block-light .language-markdown .token.url-reference.url > .token.string {
+  color: #383a42;
+}
+.md-code-block.md-code-block-light .language-markdown .token.url > .token.content {
+  color: #4078f2;
+}
+.md-code-block.md-code-block-light .language-markdown .token.url > .token.url,
+.md-code-block.md-code-block-light .language-markdown .token.url-reference.url {
+  color: #0184bc;
+}
+.md-code-block.md-code-block-light .language-markdown .token.blockquote.punctuation,
+.md-code-block.md-code-block-light .language-markdown .token.hr.punctuation {
+  color: #a0a1a7;
+  font-style: italic;
+}
+.md-code-block.md-code-block-light .language-markdown .token.code-snippet {
+  color: #50a14f;
+}
+.md-code-block.md-code-block-light .language-markdown .token.bold .token.content {
+  color: #b76b01;
+}
+.md-code-block.md-code-block-light .language-markdown .token.italic .token.content {
+  color: #a626a4;
+}
+.md-code-block.md-code-block-light .language-markdown .token.strike .token.content,
+.md-code-block.md-code-block-light .language-markdown .token.strike .token.punctuation,
+.md-code-block.md-code-block-light .language-markdown .token.list.punctuation,
+.md-code-block.md-code-block-light .language-markdown .token.title.important > .token.punctuation {
+  color: #e45649;
+}
+.md-code-block.md-code-block-light .token.bold {
+  font-weight: 700;
+}
+.md-code-block.md-code-block-light .token.comment,
+.md-code-block.md-code-block-light .token.italic {
+  font-style: italic;
+}
+.md-code-block.md-code-block-light .token.entity {
+  cursor: help;
+}
+.md-code-block.md-code-block-light .token.namespace {
+  opacity: 0.8;
+}
+.md-code-block.md-code-block-light .token.token.tab:not(:empty):before,
+.md-code-block.md-code-block-light .token.token.cr:before,
+.md-code-block.md-code-block-light .token.token.lf:before,
+.md-code-block.md-code-block-light .token.token.space:before {
+  color: rgba(56, 58, 66, 0.2);
+}
+.md-code-block-light {
+  --ds-md-code-block-border-color: #e5e5e5;
+  --ds-md-code-block-banner-wrap-background-color: white;
+  --ds-md-code-banner-background-color: #f5f5f5;
+  color: #494949;
+  background: #fafafa;
+}
+.md-code-block-dark {
+  --ds-md-code-block-border-color: var(--dsr-bg, transparent);
+  --ds-md-code-block-banner-wrap-background-color: #292a2d;
+  --ds-md-code-banner-background-color: #404045;
+  color: #fff;
+  background: #212327;
+}
+.md-code-block {
+  --ds-md-code-block-border-radius: 12px;
+  --ds-md-code-block-font-size: calc(var(--ds-md-zoom) * var(--ds-font-size-xsp));
+  border-radius: var(--ds-md-code-block-border-radius);
+  font-size: var(--ds-md-code-block-font-size);
+  line-height: calc(var(--ds-md-code-block-font-size) * 1.6);
+}
+.md-code-block:not(:last-child) {
+  margin-bottom: calc(var(--ds-md-zoom) * 10px);
+}
+.md-code-block-banner-wrap {
+  background-color: var(--ds-md-code-block-banner-wrap-background-color);
+  z-index: 6;
+  position: -webkit-sticky;
+  position: sticky;
+  top: 0;
+}
+.md-code-block-banner {
+  background: var(--ds-md-code-banner-background-color);
+  padding: calc(var(--ds-md-zoom) * 8px) calc(var(--ds-md-zoom) * 12px);
+  font-size: var(--ds-md-code-block-font-size);
+  line-height: var(--ds-md-code-block-font-size);
+  justify-content: space-between;
+  display: flex;
+}
+.md-code-block-banner-lite {
+  padding: 0;
+}
+.md-code-block-banner {
+  border-top-left-radius: var(--ds-md-code-block-border-radius);
+  border-top-right-radius: var(--ds-md-code-block-border-radius);
+}
+.md-code-block-footer {
+  background: var(--ds-md-code-banner-background-color);
+  padding: calc(var(--ds-md-zoom) * 8px) calc(var(--ds-md-zoom) * 12px);
+  font-size: var(--ds-md-code-block-font-size);
+  line-height: var(--ds-md-code-block-font-size);
+  border-bottom-left-radius: var(--ds-md-code-block-border-radius);
+  border-bottom-right-radius: var(--ds-md-code-block-border-radius);
+  justify-content: flex-end;
+  display: flex;
+}
+.md-code-block-action {
+  align-items: center;
+  display: flex;
+}
+.md-code-block > pre {
+  padding: calc(var(--ds-md-zoom) * 8px) calc(var(--ds-md-zoom) * 12px);
+  white-space: pre-wrap;
+  word-break: break-all;
+  margin: 0 !important;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ds-markdown",
   "private": false,
-  "version": "0.0.6",
+  "version": "0.0.7",
   "main": "./dist/cjs/index.js",
   "types": "./dist/cjs/index.d.ts",
   "module": "./dist/esm/index.js",
@@ -33,7 +33,8 @@
   ],
   "scripts": {
     "dev": "vite",
-    "build": "npm run build:cjs && npm run build:esm && npm run build:less",
+    "build:docs": "rimraf docs && vite build",
+    "build": "rimraf dist &&npm run build:cjs && npm run build:esm && npm run build:less",
     "build:cjs": "tsc --project tsconfig-cjs.json && echo '{ \"type\": \"commonjs\" }' > dist/cjs/package.json",
     "build:esm": "tsc --project tsconfig-esm.json",
     "build:less": "lessc src/style.less dist/style.css",
@@ -44,7 +45,6 @@
   },
   "dependencies": {
     "classnames": "^2.5.1",
-    "prismjs": "^1.30.0",
     "react-markdown": "^10.1.0",
     "react-syntax-highlighter": "^15.6.1",
     "remark-gfm": "^4.0.1"
@@ -82,6 +82,7 @@
     "rehype-stringify": "^10.0.1",
     "remark-parse": "^11.0.0",
     "remark-rehype": "^11.1.2",
+    "rimraf": "^6.0.1",
     "rollup": "^4.40.2",
     "rollup-plugin-postcss": "^4.0.2",
     "typescript": "~5.8.3",