@superlc/md-react 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,30 @@
1
+ import { FC } from 'react';
2
+ import { MarkdownProps } from './types';
3
+
4
+ /**
5
+ * React Markdown 渲染组件
6
+ *
7
+ * @example
8
+ * ```tsx
9
+ * <Markdown className="prose">
10
+ * # Hello World
11
+ *
12
+ * This is **bold** and *italic* text.
13
+ * </Markdown>
14
+ * ```
15
+ *
16
+ * @example 自定义组件
17
+ * ```tsx
18
+ * <Markdown
19
+ * components={{
20
+ * h1: ({ children }) => <h1 className="text-3xl font-bold">{children}</h1>,
21
+ * a: ({ href, children }) => <a href={href} target="_blank">{children}</a>
22
+ * }}
23
+ * >
24
+ * # Custom Heading
25
+ * [Link](https://example.com)
26
+ * </Markdown>
27
+ * ```
28
+ */
29
+ export declare const Markdown: FC<MarkdownProps>;
30
+ //# sourceMappingURL=Markdown.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../src/Markdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE7C;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAStC,CAAC"}
package/dist/index.cjs ADDED
@@ -0,0 +1 @@
1
+ "use strict";var Y=Object.create;var H=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var Q=Object.getPrototypeOf,ee=Object.prototype.hasOwnProperty;var te=(e,t,c,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of G(t))!ee.call(e,n)&&n!==c&&H(e,n,{get:()=>t[n],enumerable:!(i=Z(t,n))||i.enumerable});return e};var re=(e,t,c)=>(c=e!=null?Y(Q(e)):{},te(t||!e||!e.__esModule?H(c,"default",{value:e,enumerable:!0}):c,e));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("react"),M=require("@superlc/md-core"),U=require("hast-util-to-jsx-runtime");function $(e,t={}){const{components:c={},...i}=t;return r.useMemo(()=>{if(!e)return null;const n=M.parseToHast(e,i);return U.toJsxRuntime(n,{Fragment:a.Fragment,jsx:a.jsx,jsxs:a.jsxs,components:c})},[e,c,i])}const J=({children:e,components:t,className:c,...i})=>{const n=$(e,{components:t,...i});return a.jsx("div",{className:c,children:n})};J.displayName="Markdown";const K=r.memo(({block:e,components:t})=>{if(!e.hast)return null;try{return U.toJsxRuntime(e.hast,{jsx:a.jsx,jsxs:a.jsxs,Fragment:a.Fragment,components:t})}catch{return null}},(e,t)=>e.block.key===t.block.key&&e.block.stable&&t.block.stable);K.displayName="StableBlock";function ne(e={}){const{components:t,minUpdateInterval:c=16,immediate:i=!1,outputRate:n="medium",...k}=e,u=r.useRef(M.createStreamingParser(k)),s=r.useRef(new M.OutputRateController(n)),[y,p]=r.useState(0),[w,h]=r.useState(!1),[l,f]=r.useState(0),[S,R]=r.useState("idle"),v=r.useRef(0),m=r.useRef(null),j=r.useCallback(()=>{const g=performance.now(),A=g-v.current;i||A>=c?(v.current=g,p(B=>B+1)):m.current===null&&(m.current=window.requestAnimationFrame(()=>{m.current=null,v.current=performance.now(),p(B=>B+1)}))},[c,i]),b=r.useCallback(g=>{u.current.append(g),j()},[j]),E=r.useCallback(g=>{u.current.reset(),h(!1),f(0),R("running"),s.current.start(g,A=>{A&&u.current.append(A),f(s.current.progress),j()},()=>{u.current.finish(),h(!0),f(1),R("complete"),j()})},[j]),C=r.useCallback(()=>{s.current.pause(),R(s.current.status)},[]),T=r.useCallback(()=>{s.current.resume(),R(s.current.status)},[]),O=r.useCallback(()=>{s.current.skipToEnd(),R(s.current.status),f(1)},[]),o=r.useCallback(()=>{s.current.stop(),u.current.finish(),h(!0),R("complete"),m.current!==null&&(cancelAnimationFrame(m.current),m.current=null),p(g=>g+1)},[]),d=r.useCallback(()=>{s.current.stop(),u.current.reset(),h(!1),f(0),R("idle"),m.current!==null&&(cancelAnimationFrame(m.current),m.current=null),p(g=>g+1)},[]);r.useEffect(()=>{s.current.setRate(n)},[n]),r.useEffect(()=>()=>{s.current.stop(),m.current!==null&&cancelAnimationFrame(m.current)},[]);const x=u.current.getState(),P=u.current.getStats(),N=u.current.getContent(),z=r.useMemo(()=>x.blocks.map(g=>a.jsx(K,{block:g,components:t},g.key)),[x.blocks,t,y]);return{element:r.useMemo(()=>x.blocks.length===0?null:a.jsx(a.Fragment,{children:z}),[z,x.blocks.length]),append:b,start:E,pause:C,resume:T,skipToEnd:O,reset:d,finish:o,blocks:x.blocks,stats:P,isComplete:w,content:N,progress:l,outputStatus:S}}const se=16,ae="data:image/svg+xml,",ce=()=>a.jsxs("svg",{width:"48",height:"36",viewBox:"0 0 48 36",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[a.jsx("rect",{x:"0",y:"0",width:"48",height:"36",rx:"3",className:"md-image-skeleton-icon"}),a.jsx("circle",{cx:"12",cy:"10",r:"5",className:"md-image-skeleton-icon-detail"}),a.jsx("path",{d:"M0 36 L0 24 L16 16 L28 26 L48 12 L48 36 Z",className:"md-image-skeleton-icon-detail"})]}),q=r.memo(({src:e,alt:t,className:c,"data-width":i,"data-height":n,...k})=>{const s=(e==null?void 0:e.startsWith(ae))?void 0:e,y=i?Number(i):200,p=n?Number(n):120,[w,h]=r.useState(!0),l=r.useRef(null),f=r.useRef(null);r.useLayoutEffect(()=>{l.current&&s&&l.current.complete&&l.current.naturalWidth>0&&h(!1)},[s]);const S=r.useCallback(()=>{f.current&&clearTimeout(f.current),f.current=setTimeout(()=>{h(!1)},se)},[]);return a.jsxs("span",{className:`md-image-container ${c||""}`,style:{width:y,height:p},children:[s&&a.jsx("img",{ref:l,src:s,alt:t,onLoad:S,className:"md-image",...k}),w&&a.jsx("span",{className:"md-image-skeleton",children:a.jsx(ce,{})})]})});q.displayName="StreamingImage";let I=!1,F=null;async function W(){if(!I)return F||(F=(async()=>{await import("katex/dist/katex.min.css"),I=!0})(),F)}const ue=r.memo(({children:e})=>(r.useEffect(()=>{I||W()},[]),a.jsx(a.Fragment,{children:e})));ue.displayName="MathProvider";function ie(){return W()}const _=r.memo(({block:e,components:t})=>{if(!e.hast)return null;try{return U.toJsxRuntime(e.hast,{jsx:a.jsx,jsxs:a.jsxs,Fragment:a.Fragment,components:t})}catch{return a.jsx("div",{className:"parse-error",children:e.source})}},(e,t)=>e.block.key===t.block.key&&e.block.stable&&t.block.stable);_.displayName="StableBlock";const V=({content:e,source:t,outputRate:c="medium",isComplete:i=!1,onComplete:n,onBlockStable:k,onProgress:u,components:s,className:y,minUpdateInterval:p=16,autoStart:w=!0,...h})=>{r.useEffect(()=>{h.math&&ie()},[h.math]);const l=r.useRef(M.createStreamingParser(h)),f=r.useRef(new M.OutputRateController(c)),S=r.useRef(""),R=r.useRef(void 0),v=r.useRef([]),[,m]=r.useReducer(o=>o+1,0),j=r.useRef(0),b=r.useRef(null),E=()=>{const o=performance.now();o-j.current>=p?(j.current=o,m()):b.current===null&&(b.current=window.requestAnimationFrame(()=>{b.current=null,j.current=performance.now(),m()}))};r.useEffect(()=>{t!==void 0&&t!==R.current&&(R.current=t,w&&t&&(l.current.reset(),S.current="",f.current.start(t,o=>{o&&(l.current.append(o),S.current+=o),u==null||u(f.current.progress),E()},()=>{l.current.finish(),n==null||n(),E()})))},[t,w,n,u]),r.useEffect(()=>{if(t!==void 0)return;const o=S.current,d=e||"";if(d!==o){if(d.startsWith(o)){const x=d.slice(o.length);x&&l.current.append(x)}else l.current.reset(),d&&l.current.append(d);S.current=d,E()}},[e,t]),r.useEffect(()=>{t===void 0&&i&&(l.current.finish(),b.current!==null&&(cancelAnimationFrame(b.current),b.current=null),m(),n==null||n())},[i,n,t]),r.useEffect(()=>{f.current.setRate(c)},[c]),r.useEffect(()=>{if(k){const o=l.current.getState().blocks,d=v.current;o.forEach((x,P)=>{const N=d[P];x.stable&&(!N||!N.stable)&&k(x)}),v.current=o}}),r.useEffect(()=>()=>{f.current.stop(),b.current!==null&&cancelAnimationFrame(b.current)},[]);const C=l.current.getState(),T=t!==void 0?f.current.status==="complete":i,O=r.useMemo(()=>{const o={img:q,...s};return C.blocks.map(d=>a.jsx(_,{block:d,components:o},d.key))},[C.blocks,s]);return a.jsx("div",{className:y,"data-streaming":!T,children:O})};V.displayName="StreamingMarkdown";const X=r.memo(e=>{const{text:t,animationConfig:c}=e,{fadeDuration:i=200,easing:n="ease-in-out"}=c||{},[k,u]=r.useState([]),s=r.useRef("");r.useEffect(()=>{if(t===s.current)return;if(!(s.current&&t.indexOf(s.current)===0)){u([t]),s.current=t;return}const p=t.slice(s.current.length);p&&(u(w=>[...w,p]),s.current=t)},[t]);const y=`md-fade-in ${i}ms ${n} forwards`;return a.jsx(a.Fragment,{children:k.map((p,w)=>a.jsx("span",{className:"md-animation-text",style:{animation:y},children:p},`animation-text-${w}`))})});X.displayName="AnimationText";let L=null;try{L=require("dompurify")}catch{}function oe(){return L!==null}function le(e,t){if(!L)return e;const c={ADD_ATTR:["target","rel","data-block-key","data-pending","data-predicted"],...t};return L.default.sanitize(e,c)}function D(e){if(e.type==="root")return{...e,children:e.children.map(n=>n.type==="element"?D(n):n)};const t=["onclick","onerror","onload","onmouseover","onfocus","onblur"],c=["javascript:","vbscript:","data:text/html"],i={};if(e.properties)for(const[n,k]of Object.entries(e.properties)){const u=n.toLowerCase();if(!(t.includes(u)||u.startsWith("on"))){if((u==="href"||u==="src")&&typeof k=="string"){const s=k.toLowerCase().trim();if(c.some(y=>s.startsWith(y)))continue}i[n]=k}}return{...e,properties:i,children:e.children.map(n=>n.type==="element"?D(n):n)}}exports.AnimationText=X;exports.Markdown=J;exports.StreamingImage=q;exports.StreamingMarkdown=V;exports.isDOMPurifyAvailable=oe;exports.sanitizeHast=D;exports.sanitizeHtml=le;exports.useMarkdown=$;exports.useStreamingMarkdown=ne;
@@ -0,0 +1,13 @@
1
+ /**
2
+ * @superlc/md-react
3
+ * 基于 @superlc/md-core 的 React Markdown 渲染组件
4
+ */
5
+ export { Markdown } from './Markdown';
6
+ export { useMarkdown } from './useMarkdown';
7
+ export type { MarkdownProps, MarkdownComponents, UseMarkdownOptions } from './types';
8
+ export { useStreamingMarkdown, StreamingMarkdown, StreamingImage, AnimationText, } from './streaming';
9
+ export type { UseStreamingMarkdownOptions, UseStreamingMarkdownResult, StreamingMarkdownProps, AnimationConfig, StreamingConfig, } from './streaming';
10
+ export { sanitizeHast, sanitizeHtml, isDOMPurifyAvailable } from './utils';
11
+ export type { SanitizeConfig } from './utils';
12
+ export type { ProcessorOptions, PluginConfig, BlockInfo, ParserStats, OutputRate, OutputRatePreset, OutputRateCustom, OutputRateStatus, InlineType, InlinePredictionOptions, } from '@superlc/md-core';
13
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,aAAa,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAGrF,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,cAAc,EACd,aAAa,GACd,MAAM,aAAa,CAAC;AACrB,YAAY,EACV,2BAA2B,EAC3B,0BAA0B,EAC1B,sBAAsB,EACtB,eAAe,EACf,eAAe,GAChB,MAAM,aAAa,CAAC;AAGrB,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAC3E,YAAY,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAG9C,YAAY,EACV,gBAAgB,EAChB,YAAY,EACZ,SAAS,EACT,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,uBAAuB,GACxB,MAAM,kBAAkB,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,347 @@
1
+ import { jsxs as B, jsx as o, Fragment as E } from "react/jsx-runtime";
2
+ import Q, { useMemo as P, memo as F, useRef as d, useState as T, useCallback as N, useEffect as y, useLayoutEffect as ee } from "react";
3
+ import { parseToHast as te, createStreamingParser as V, OutputRateController as J } from "@superlc/md-core";
4
+ import { toJsxRuntime as W } from "hast-util-to-jsx-runtime";
5
+ function re(e, t = {}) {
6
+ const { components: c = {}, ...a } = t;
7
+ return P(() => {
8
+ if (!e) return null;
9
+ const r = te(e, a);
10
+ return W(r, {
11
+ Fragment: E,
12
+ jsx: o,
13
+ jsxs: B,
14
+ components: c
15
+ });
16
+ }, [e, c, a]);
17
+ }
18
+ const ne = ({
19
+ children: e,
20
+ components: t,
21
+ className: c,
22
+ ...a
23
+ }) => {
24
+ const r = re(e, { components: t, ...a });
25
+ return /* @__PURE__ */ o("div", { className: c, children: r });
26
+ };
27
+ ne.displayName = "Markdown";
28
+ const X = F(
29
+ ({ block: e, components: t }) => {
30
+ if (!e.hast) return null;
31
+ try {
32
+ return W(e.hast, {
33
+ jsx: o,
34
+ jsxs: B,
35
+ Fragment: E,
36
+ components: t
37
+ });
38
+ } catch {
39
+ return null;
40
+ }
41
+ },
42
+ (e, t) => e.block.key === t.block.key && e.block.stable && t.block.stable
43
+ );
44
+ X.displayName = "StableBlock";
45
+ function ge(e = {}) {
46
+ const {
47
+ components: t,
48
+ minUpdateInterval: c = 16,
49
+ immediate: a = !1,
50
+ outputRate: r = "medium",
51
+ ...g
52
+ } = e, s = d(V(g)), n = d(new J(r)), [x, p] = T(0), [b, k] = T(!1), [u, l] = T(0), [L, v] = T("idle"), A = d(0), m = d(null), S = N(() => {
53
+ const h = performance.now(), D = h - A.current;
54
+ a || D >= c ? (A.current = h, p((H) => H + 1)) : m.current === null && (m.current = window.requestAnimationFrame(() => {
55
+ m.current = null, A.current = performance.now(), p((H) => H + 1);
56
+ }));
57
+ }, [c, a]), R = N(
58
+ (h) => {
59
+ s.current.append(h), S();
60
+ },
61
+ [S]
62
+ ), M = N(
63
+ (h) => {
64
+ s.current.reset(), k(!1), l(0), v("running"), n.current.start(
65
+ h,
66
+ (D) => {
67
+ D && s.current.append(D), l(n.current.progress), S();
68
+ },
69
+ () => {
70
+ s.current.finish(), k(!0), l(1), v("complete"), S();
71
+ }
72
+ );
73
+ },
74
+ [S]
75
+ ), I = N(() => {
76
+ n.current.pause(), v(n.current.status);
77
+ }, []), j = N(() => {
78
+ n.current.resume(), v(n.current.status);
79
+ }, []), $ = N(() => {
80
+ n.current.skipToEnd(), v(n.current.status), l(1);
81
+ }, []), i = N(() => {
82
+ n.current.stop(), s.current.finish(), k(!0), v("complete"), m.current !== null && (cancelAnimationFrame(m.current), m.current = null), p((h) => h + 1);
83
+ }, []), f = N(() => {
84
+ n.current.stop(), s.current.reset(), k(!1), l(0), v("idle"), m.current !== null && (cancelAnimationFrame(m.current), m.current = null), p((h) => h + 1);
85
+ }, []);
86
+ y(() => {
87
+ n.current.setRate(r);
88
+ }, [r]), y(() => () => {
89
+ n.current.stop(), m.current !== null && cancelAnimationFrame(m.current);
90
+ }, []);
91
+ const w = s.current.getState(), z = s.current.getStats(), C = s.current.getContent(), _ = P(() => w.blocks.map(
92
+ (h) => o(
93
+ X,
94
+ {
95
+ block: h,
96
+ components: t
97
+ },
98
+ h.key
99
+ )
100
+ ), [w.blocks, t, x]);
101
+ return {
102
+ element: P(() => w.blocks.length === 0 ? null : o(E, { children: _ }), [_, w.blocks.length]),
103
+ append: R,
104
+ start: M,
105
+ pause: I,
106
+ resume: j,
107
+ skipToEnd: $,
108
+ reset: f,
109
+ finish: i,
110
+ blocks: w.blocks,
111
+ stats: z,
112
+ isComplete: b,
113
+ content: C,
114
+ progress: u,
115
+ outputStatus: L
116
+ };
117
+ }
118
+ const se = 16, ce = "data:image/svg+xml,", ae = () => /* @__PURE__ */ B("svg", { width: "48", height: "36", viewBox: "0 0 48 36", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
119
+ /* @__PURE__ */ o("rect", { x: "0", y: "0", width: "48", height: "36", rx: "3", className: "md-image-skeleton-icon" }),
120
+ /* @__PURE__ */ o("circle", { cx: "12", cy: "10", r: "5", className: "md-image-skeleton-icon-detail" }),
121
+ /* @__PURE__ */ o("path", { d: "M0 36 L0 24 L16 16 L28 26 L48 12 L48 36 Z", className: "md-image-skeleton-icon-detail" })
122
+ ] }), Y = F(({
123
+ src: e,
124
+ alt: t,
125
+ className: c,
126
+ "data-width": a,
127
+ "data-height": r,
128
+ ...g
129
+ }) => {
130
+ const n = (e == null ? void 0 : e.startsWith(ce)) ? void 0 : e, x = a ? Number(a) : 200, p = r ? Number(r) : 120, [b, k] = T(!0), u = d(null), l = d(null);
131
+ ee(() => {
132
+ u.current && n && u.current.complete && u.current.naturalWidth > 0 && k(!1);
133
+ }, [n]);
134
+ const L = N(() => {
135
+ l.current && clearTimeout(l.current), l.current = setTimeout(() => {
136
+ k(!1);
137
+ }, se);
138
+ }, []);
139
+ return /* @__PURE__ */ B(
140
+ "span",
141
+ {
142
+ className: `md-image-container ${c || ""}`,
143
+ style: { width: x, height: p },
144
+ children: [
145
+ n && /* @__PURE__ */ o(
146
+ "img",
147
+ {
148
+ ref: u,
149
+ src: n,
150
+ alt: t,
151
+ onLoad: L,
152
+ className: "md-image",
153
+ ...g
154
+ }
155
+ ),
156
+ b && /* @__PURE__ */ o("span", { className: "md-image-skeleton", children: /* @__PURE__ */ o(ae, {}) })
157
+ ]
158
+ }
159
+ );
160
+ });
161
+ Y.displayName = "StreamingImage";
162
+ let K = !1, O = null;
163
+ async function Z() {
164
+ if (!K)
165
+ return O || (O = (async () => {
166
+ await import("katex/dist/katex.min.css"), K = !0;
167
+ })(), O);
168
+ }
169
+ const ie = F(({ children: e }) => (y(() => {
170
+ K || Z();
171
+ }, []), /* @__PURE__ */ o(E, { children: e })));
172
+ ie.displayName = "MathProvider";
173
+ function oe() {
174
+ return Z();
175
+ }
176
+ const G = F(
177
+ ({ block: e, components: t }) => {
178
+ if (!e.hast) return null;
179
+ try {
180
+ return W(e.hast, {
181
+ jsx: o,
182
+ jsxs: B,
183
+ Fragment: E,
184
+ components: t
185
+ });
186
+ } catch {
187
+ return /* @__PURE__ */ o("div", { className: "parse-error", children: e.source });
188
+ }
189
+ },
190
+ (e, t) => e.block.key === t.block.key && e.block.stable && t.block.stable
191
+ );
192
+ G.displayName = "StableBlock";
193
+ const ue = ({
194
+ content: e,
195
+ source: t,
196
+ outputRate: c = "medium",
197
+ isComplete: a = !1,
198
+ onComplete: r,
199
+ onBlockStable: g,
200
+ onProgress: s,
201
+ components: n,
202
+ className: x,
203
+ minUpdateInterval: p = 16,
204
+ autoStart: b = !0,
205
+ ...k
206
+ }) => {
207
+ y(() => {
208
+ k.math && oe();
209
+ }, [k.math]);
210
+ const u = d(V(k)), l = d(new J(c)), L = d(""), v = d(void 0), A = d([]), [, m] = Q.useReducer((i) => i + 1, 0), S = d(0), R = d(null), M = () => {
211
+ const i = performance.now();
212
+ i - S.current >= p ? (S.current = i, m()) : R.current === null && (R.current = window.requestAnimationFrame(() => {
213
+ R.current = null, S.current = performance.now(), m();
214
+ }));
215
+ };
216
+ y(() => {
217
+ t !== void 0 && t !== v.current && (v.current = t, b && t && (u.current.reset(), L.current = "", l.current.start(
218
+ t,
219
+ (i) => {
220
+ i && (u.current.append(i), L.current += i), s == null || s(l.current.progress), M();
221
+ },
222
+ () => {
223
+ u.current.finish(), r == null || r(), M();
224
+ }
225
+ )));
226
+ }, [t, b, r, s]), y(() => {
227
+ if (t !== void 0)
228
+ return;
229
+ const i = L.current, f = e || "";
230
+ if (f !== i) {
231
+ if (f.startsWith(i)) {
232
+ const w = f.slice(i.length);
233
+ w && u.current.append(w);
234
+ } else
235
+ u.current.reset(), f && u.current.append(f);
236
+ L.current = f, M();
237
+ }
238
+ }, [e, t]), y(() => {
239
+ t === void 0 && a && (u.current.finish(), R.current !== null && (cancelAnimationFrame(R.current), R.current = null), m(), r == null || r());
240
+ }, [a, r, t]), y(() => {
241
+ l.current.setRate(c);
242
+ }, [c]), y(() => {
243
+ if (g) {
244
+ const i = u.current.getState().blocks, f = A.current;
245
+ i.forEach((w, z) => {
246
+ const C = f[z];
247
+ w.stable && (!C || !C.stable) && g(w);
248
+ }), A.current = i;
249
+ }
250
+ }), y(() => () => {
251
+ l.current.stop(), R.current !== null && cancelAnimationFrame(R.current);
252
+ }, []);
253
+ const I = u.current.getState(), j = t !== void 0 ? l.current.status === "complete" : a, $ = P(() => {
254
+ const i = {
255
+ img: Y,
256
+ ...n
257
+ };
258
+ return I.blocks.map((f) => /* @__PURE__ */ o(
259
+ G,
260
+ {
261
+ block: f,
262
+ components: i
263
+ },
264
+ f.key
265
+ ));
266
+ }, [I.blocks, n]);
267
+ return /* @__PURE__ */ o("div", { className: x, "data-streaming": !j, children: $ });
268
+ };
269
+ ue.displayName = "StreamingMarkdown";
270
+ const le = F((e) => {
271
+ const { text: t, animationConfig: c } = e, { fadeDuration: a = 200, easing: r = "ease-in-out" } = c || {}, [g, s] = T([]), n = d("");
272
+ y(() => {
273
+ if (t === n.current) return;
274
+ if (!(n.current && t.indexOf(n.current) === 0)) {
275
+ s([t]), n.current = t;
276
+ return;
277
+ }
278
+ const p = t.slice(n.current.length);
279
+ p && (s((b) => [...b, p]), n.current = t);
280
+ }, [t]);
281
+ const x = `md-fade-in ${a}ms ${r} forwards`;
282
+ return /* @__PURE__ */ o(E, { children: g.map((p, b) => /* @__PURE__ */ o(
283
+ "span",
284
+ {
285
+ className: "md-animation-text",
286
+ style: { animation: x },
287
+ children: p
288
+ },
289
+ `animation-text-${b}`
290
+ )) });
291
+ });
292
+ le.displayName = "AnimationText";
293
+ let U = null;
294
+ try {
295
+ U = require("dompurify");
296
+ } catch {
297
+ }
298
+ function ke() {
299
+ return U !== null;
300
+ }
301
+ function we(e, t) {
302
+ if (!U)
303
+ return e;
304
+ const c = {
305
+ ADD_ATTR: ["target", "rel", "data-block-key", "data-pending", "data-predicted"],
306
+ ...t
307
+ };
308
+ return U.default.sanitize(e, c);
309
+ }
310
+ function q(e) {
311
+ if (e.type === "root")
312
+ return {
313
+ ...e,
314
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
315
+ children: e.children.map((r) => r.type === "element" ? q(r) : r)
316
+ };
317
+ const t = ["onclick", "onerror", "onload", "onmouseover", "onfocus", "onblur"], c = ["javascript:", "vbscript:", "data:text/html"], a = {};
318
+ if (e.properties)
319
+ for (const [r, g] of Object.entries(e.properties)) {
320
+ const s = r.toLowerCase();
321
+ if (!(t.includes(s) || s.startsWith("on"))) {
322
+ if ((s === "href" || s === "src") && typeof g == "string") {
323
+ const n = g.toLowerCase().trim();
324
+ if (c.some((x) => n.startsWith(x)))
325
+ continue;
326
+ }
327
+ a[r] = g;
328
+ }
329
+ }
330
+ return {
331
+ ...e,
332
+ properties: a,
333
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
334
+ children: e.children.map((r) => r.type === "element" ? q(r) : r)
335
+ };
336
+ }
337
+ export {
338
+ le as AnimationText,
339
+ ne as Markdown,
340
+ Y as StreamingImage,
341
+ ue as StreamingMarkdown,
342
+ ke as isDOMPurifyAvailable,
343
+ q as sanitizeHast,
344
+ we as sanitizeHtml,
345
+ re as useMarkdown,
346
+ ge as useStreamingMarkdown
347
+ };
@@ -0,0 +1,23 @@
1
+ export interface AnimationConfig {
2
+ /**
3
+ * 淡入动画持续时间(毫秒)
4
+ * @default 200
5
+ */
6
+ fadeDuration?: number;
7
+ /**
8
+ * 动画缓动函数
9
+ * @default 'ease-in-out'
10
+ */
11
+ easing?: string;
12
+ }
13
+ export interface AnimationTextProps {
14
+ text: string;
15
+ animationConfig?: AnimationConfig;
16
+ }
17
+ /**
18
+ * 带淡入动画的文本组件
19
+ * 追踪文本变化,为新增部分添加淡入效果
20
+ */
21
+ declare const AnimationText: import('react').NamedExoticComponent<AnimationTextProps>;
22
+ export default AnimationText;
23
+ //# sourceMappingURL=AnimationText.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AnimationText.d.ts","sourceRoot":"","sources":["../../src/streaming/AnimationText.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC;AAED;;;GAGG;AACH,QAAA,MAAM,aAAa,0DAwCjB,CAAC;AAIH,eAAe,aAAa,CAAC"}
@@ -0,0 +1,21 @@
1
+ import { FC, ReactNode } from 'react';
2
+
3
+ interface MathProviderProps {
4
+ /** 子元素 */
5
+ children: ReactNode;
6
+ }
7
+ /**
8
+ * 数学公式样式提供组件
9
+ * 用于懒加载 KaTeX CSS,仅在使用时加载
10
+ */
11
+ export declare const MathProvider: FC<MathProviderProps>;
12
+ /**
13
+ * 检查 KaTeX CSS 是否已加载
14
+ */
15
+ export declare function isKatexCssLoaded(): boolean;
16
+ /**
17
+ * 预加载 KaTeX CSS
18
+ */
19
+ export declare function preloadKatexCss(): Promise<void>;
20
+ export {};
21
+ //# sourceMappingURL=MathProvider.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MathProvider.d.ts","sourceRoot":"","sources":["../../src/streaming/MathProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AA8B3C,UAAU,iBAAiB;IACzB,UAAU;IACV,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAU7C,CAAC;AAIH;;GAEG;AACH,wBAAgB,gBAAgB,IAAI,OAAO,CAE1C;AAED;;GAEG;AACH,wBAAgB,eAAe,IAAI,OAAO,CAAC,IAAI,CAAC,CAE/C"}
@@ -0,0 +1,18 @@
1
+ import { FC, ImgHTMLAttributes } from 'react';
2
+
3
+ interface StreamingImageProps extends ImgHTMLAttributes<HTMLImageElement> {
4
+ 'data-width'?: number | string;
5
+ 'data-height'?: number | string;
6
+ }
7
+ /**
8
+ * 流式图片组件
9
+ * 占位容器覆盖在图片上方,图片加载完成后直接移除
10
+ *
11
+ * 关键设计:
12
+ * 1. 使用 img.complete 同步检测浏览器缓存中的图片
13
+ * 2. 使用 useLayoutEffect 在绘制前同步检查图片状态
14
+ * 3. 始终初始显示 skeleton,避免组件重建时闪烁
15
+ */
16
+ export declare const StreamingImage: FC<StreamingImageProps>;
17
+ export {};
18
+ //# sourceMappingURL=StreamingImage.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"StreamingImage.d.ts","sourceRoot":"","sources":["../../src/streaming/StreamingImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAuBnD,UAAU,mBAAoB,SAAQ,iBAAiB,CAAC,gBAAgB,CAAC;IACvE,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACjC;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CA2EjD,CAAC"}
@@ -0,0 +1,9 @@
1
+ import { FC } from 'react';
2
+ import { StreamingMarkdownProps } from './types';
3
+
4
+ /**
5
+ * 流式 Markdown 渲染组件
6
+ * 声明式 API,支持受控模式和内置速率控制模式
7
+ */
8
+ export declare const StreamingMarkdown: FC<StreamingMarkdownProps>;
9
+ //# sourceMappingURL=StreamingMarkdown.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"StreamingMarkdown.d.ts","sourceRoot":"","sources":["../../src/streaming/StreamingMarkdown.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAgB,MAAM,OAAO,CAAC;AAQ9C,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAkCtD;;;GAGG;AACH,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAkMxD,CAAC"}
@@ -0,0 +1,17 @@
1
+ import { default as React } from 'react';
2
+ import { Element } from '@superlc/md-core';
3
+ import { Components } from 'hast-util-to-jsx-runtime';
4
+ import { AnimationConfig } from './types';
5
+ import { SanitizeConfig } from '../utils/sanitize';
6
+
7
+ /**
8
+ * 将 HAST 转换为带动画的 JSX
9
+ */
10
+ export declare function hastToJsxWithAnimation(hast: Element, options: {
11
+ components?: Components;
12
+ enableAnimation?: boolean;
13
+ animationConfig?: AnimationConfig;
14
+ enableSanitize?: boolean;
15
+ sanitizeConfig?: SanitizeConfig;
16
+ }): React.ReactElement | null;
17
+ //# sourceMappingURL=hastToJsxWithAnimation.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hastToJsxWithAnimation.d.ts","sourceRoot":"","sources":["../../src/streaming/hastToJsxWithAnimation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAgB,KAAK,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAGzE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC/C,OAAO,EAAgB,KAAK,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAsDtE;;GAEG;AACH,wBAAgB,sBAAsB,CACpC,IAAI,EAAE,OAAO,EACb,OAAO,EAAE;IACP,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC,GACA,KAAK,CAAC,YAAY,GAAG,IAAI,CA4C3B"}
@@ -0,0 +1,11 @@
1
+ /**
2
+ * 流式渲染模块
3
+ */
4
+ export { useStreamingMarkdown } from './useStreamingMarkdown';
5
+ export { StreamingMarkdown } from './StreamingMarkdown';
6
+ export { StreamingImage } from './StreamingImage';
7
+ export { MathProvider, preloadKatexCss, isKatexCssLoaded } from './MathProvider';
8
+ export { default as AnimationText } from './AnimationText';
9
+ export type { AnimationConfig as AnimationTextConfig } from './AnimationText';
10
+ export type { UseStreamingMarkdownOptions, UseStreamingMarkdownResult, StreamingMarkdownProps, AnimationConfig, StreamingConfig, } from './types';
11
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/streaming/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACjF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,YAAY,EAAE,eAAe,IAAI,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAC9E,YAAY,EACV,2BAA2B,EAC3B,0BAA0B,EAC1B,sBAAsB,EACtB,eAAe,EACf,eAAe,GAChB,MAAM,SAAS,CAAC"}
@@ -0,0 +1,121 @@
1
+ import { ReactElement } from 'react';
2
+ import { StreamingParserOptions, ParserStats, BlockInfo, OutputRate, OutputRateStatus } from '@superlc/md-core';
3
+ import { MarkdownComponents } from '../types';
4
+ import { SanitizeConfig } from '../utils/sanitize';
5
+
6
+ /**
7
+ * 文字动画配置
8
+ */
9
+ export interface AnimationConfig {
10
+ /**
11
+ * 淡入动画持续时间(毫秒)
12
+ * @default 200
13
+ */
14
+ fadeDuration?: number;
15
+ /**
16
+ * 动画缓动函数
17
+ * @default 'ease-in-out'
18
+ */
19
+ easing?: string;
20
+ }
21
+ /**
22
+ * 流式渲染配置
23
+ */
24
+ export interface StreamingConfig {
25
+ /**
26
+ * 是否启用文字淡入动画
27
+ * @default false
28
+ */
29
+ enableAnimation?: boolean;
30
+ /**
31
+ * 动画配置
32
+ */
33
+ animationConfig?: AnimationConfig;
34
+ /**
35
+ * 是否启用 HTML 安全净化
36
+ * @default false
37
+ */
38
+ enableSanitize?: boolean;
39
+ /**
40
+ * DOMPurify 配置(仅当 enableSanitize 为 true 时生效)
41
+ */
42
+ sanitizeConfig?: SanitizeConfig;
43
+ }
44
+ /**
45
+ * useStreamingMarkdown Hook 配置
46
+ */
47
+ export interface UseStreamingMarkdownOptions extends StreamingParserOptions {
48
+ /** 自定义组件映射 */
49
+ components?: MarkdownComponents;
50
+ /** 最小更新间隔 (ms),默认 16 (约 60fps) */
51
+ minUpdateInterval?: number;
52
+ /** 是否禁用批处理,每次 append 立即更新 */
53
+ immediate?: boolean;
54
+ /** 输出速率配置 */
55
+ outputRate?: OutputRate;
56
+ /** 流式渲染配置(动画等) */
57
+ streaming?: StreamingConfig;
58
+ }
59
+ /**
60
+ * useStreamingMarkdown Hook 返回值
61
+ */
62
+ export interface UseStreamingMarkdownResult {
63
+ /** 渲染后的 React 元素 */
64
+ element: ReactElement | null;
65
+ /** 追加内容(手动模式) */
66
+ append: (chunk: string) => void;
67
+ /** 开始按速率输出(速率控制模式) */
68
+ start: (source: string) => void;
69
+ /** 暂停输出 */
70
+ pause: () => void;
71
+ /** 恢复输出 */
72
+ resume: () => void;
73
+ /** 跳过到结束 */
74
+ skipToEnd: () => void;
75
+ /** 重置解析器 */
76
+ reset: () => void;
77
+ /** 标记完成 */
78
+ finish: () => void;
79
+ /** 当前块信息 */
80
+ blocks: BlockInfo[];
81
+ /** 性能统计 */
82
+ stats: ParserStats;
83
+ /** 是否已完成 */
84
+ isComplete: boolean;
85
+ /** 累积的内容 */
86
+ content: string;
87
+ /** 输出进度 (0-1) */
88
+ progress: number;
89
+ /** 输出状态 */
90
+ outputStatus: OutputRateStatus;
91
+ }
92
+ /**
93
+ * StreamingMarkdown 组件 Props
94
+ */
95
+ export interface StreamingMarkdownProps extends StreamingParserOptions {
96
+ /** 当前累积的 Markdown 内容(外部控制模式) */
97
+ content?: string;
98
+ /** 完整的 Markdown 源内容(内置速率控制模式) */
99
+ source?: string;
100
+ /** 输出速率配置,默认 'medium' */
101
+ outputRate?: OutputRate;
102
+ /** 是否已完成流式输入 */
103
+ isComplete?: boolean;
104
+ /** 完成时的回调 */
105
+ onComplete?: () => void;
106
+ /** 块稳定时的回调 */
107
+ onBlockStable?: (block: BlockInfo) => void;
108
+ /** 进度变化回调 */
109
+ onProgress?: (progress: number) => void;
110
+ /** 自定义组件映射 */
111
+ components?: MarkdownComponents;
112
+ /** 容器 className */
113
+ className?: string;
114
+ /** 最小更新间隔 (ms) */
115
+ minUpdateInterval?: number;
116
+ /** 是否自动开始输出(仅 source 模式) */
117
+ autoStart?: boolean;
118
+ /** 流式渲染配置(动画等) */
119
+ streaming?: StreamingConfig;
120
+ }
121
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/streaming/types.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,8 @@
1
+ import { UseStreamingMarkdownOptions, UseStreamingMarkdownResult } from './types';
2
+
3
+ /**
4
+ * 流式 Markdown 渲染 Hook
5
+ * 支持高性能增量解析和渲染,以及内置速率控制
6
+ */
7
+ export declare function useStreamingMarkdown(options?: UseStreamingMarkdownOptions): UseStreamingMarkdownResult;
8
+ //# sourceMappingURL=useStreamingMarkdown.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useStreamingMarkdown.d.ts","sourceRoot":"","sources":["../../src/streaming/useStreamingMarkdown.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,2BAA2B,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAC;AAgCvF;;;GAGG;AACH,wBAAgB,oBAAoB,CAClC,OAAO,GAAE,2BAAgC,GACxC,0BAA0B,CA6L5B"}
@@ -0,0 +1,29 @@
1
+ import { ComponentType } from 'react';
2
+ import { ProcessorOptions } from '@superlc/md-core';
3
+
4
+ /**
5
+ * 自定义组件映射表
6
+ * 可用于覆盖默认 HTML 元素的渲染方式
7
+ */
8
+ export type MarkdownComponents = {
9
+ [key: string]: ComponentType<Record<string, unknown>> | undefined;
10
+ };
11
+ /**
12
+ * Markdown 组件 Props
13
+ */
14
+ export interface MarkdownProps extends ProcessorOptions {
15
+ /** Markdown 源文本 */
16
+ children: string;
17
+ /** 自定义组件映射 */
18
+ components?: MarkdownComponents;
19
+ /** 容器 className */
20
+ className?: string;
21
+ }
22
+ /**
23
+ * useMarkdown Hook 配置
24
+ */
25
+ export interface UseMarkdownOptions extends ProcessorOptions {
26
+ /** 自定义组件映射 */
27
+ components?: MarkdownComponents;
28
+ }
29
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAEzD;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B,CAAC,GAAG,EAAE,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,GAAG,SAAS,CAAC;CACnE,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,gBAAgB;IACrD,mBAAmB;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc;IACd,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,mBAAmB;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAmB,SAAQ,gBAAgB;IAC1D,cAAc;IACd,UAAU,CAAC,EAAE,kBAAkB,CAAC;CACjC"}
@@ -0,0 +1,24 @@
1
+ import { ReactNode } from 'react';
2
+ import { UseMarkdownOptions } from './types';
3
+
4
+ /**
5
+ * 将 Markdown 转换为 React 元素的 Hook
6
+ *
7
+ * @param content - Markdown 源文本
8
+ * @param options - 配置选项
9
+ * @returns React 元素
10
+ *
11
+ * @example
12
+ * ```tsx
13
+ * function MyComponent() {
14
+ * const element = useMarkdown('# Hello World', {
15
+ * components: {
16
+ * h1: ({ children }) => <h1 className="text-2xl">{children}</h1>
17
+ * }
18
+ * });
19
+ * return <div>{element}</div>;
20
+ * }
21
+ * ```
22
+ */
23
+ export declare function useMarkdown(content: string, options?: UseMarkdownOptions): ReactNode;
24
+ //# sourceMappingURL=useMarkdown.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useMarkdown.d.ts","sourceRoot":"","sources":["../src/useMarkdown.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,GAAE,kBAAuB,GAAG,SAAS,CAexF"}
@@ -0,0 +1,6 @@
1
+ /**
2
+ * 工具函数
3
+ */
4
+ export { sanitizeHtml, sanitizeHast, isDOMPurifyAvailable } from './sanitize';
5
+ export type { SanitizeConfig } from './sanitize';
6
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAC9E,YAAY,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC"}
@@ -0,0 +1,24 @@
1
+ import { Element, Root } from '@superlc/md-core';
2
+
3
+ export interface SanitizeConfig {
4
+ /** DOMPurify 配置 */
5
+ ADD_TAGS?: string[];
6
+ ADD_ATTR?: string[];
7
+ FORBID_TAGS?: string[];
8
+ FORBID_ATTR?: string[];
9
+ [key: string]: unknown;
10
+ }
11
+ /**
12
+ * 判断 DOMPurify 是否可用
13
+ */
14
+ export declare function isDOMPurifyAvailable(): boolean;
15
+ /**
16
+ * 净化 HTML 字符串
17
+ */
18
+ export declare function sanitizeHtml(html: string, config?: SanitizeConfig): string;
19
+ /**
20
+ * 递归净化 HAST 树中的危险属性
21
+ * 这是一个轻量级的替代方案,不依赖 DOMPurify
22
+ */
23
+ export declare function sanitizeHast(node: Element | Root): Element | Root;
24
+ //# sourceMappingURL=sanitize.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sanitize.d.ts","sourceRoot":"","sources":["../../src/utils/sanitize.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAEtD,MAAM,WAAW,cAAc;IAC7B,mBAAmB;IACnB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAoBD;;GAEG;AACH,wBAAgB,oBAAoB,IAAI,OAAO,CAE9C;AAED;;GAEG;AACH,wBAAgB,YAAY,CAC1B,IAAI,EAAE,MAAM,EACZ,MAAM,CAAC,EAAE,cAAc,GACtB,MAAM,CAWR;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,GAAG,OAAO,GAAG,IAAI,CAqDjE"}
package/package.json ADDED
@@ -0,0 +1,52 @@
1
+ {
2
+ "name": "@superlc/md-react",
3
+ "version": "0.1.0",
4
+ "description": "基于 @superlc/md-core 的 React Markdown 渲染组件",
5
+ "type": "module",
6
+ "main": "./dist/index.cjs",
7
+ "module": "./dist/index.js",
8
+ "types": "./dist/index.d.ts",
9
+ "exports": {
10
+ ".": {
11
+ "import": "./dist/index.js",
12
+ "require": "./dist/index.cjs",
13
+ "types": "./dist/index.d.ts"
14
+ },
15
+ "./styles.css": "@superlc/md-core/styles.css"
16
+ },
17
+ "files": [
18
+ "dist"
19
+ ],
20
+ "scripts": {
21
+ "build": "vite build",
22
+ "dev": "vite build --watch",
23
+ "test": "vitest",
24
+ "test:run": "vitest run"
25
+ },
26
+ "dependencies": {
27
+ "@superlc/md-core": "workspace:*",
28
+ "hast-util-to-jsx-runtime": "^2.3.0",
29
+ "katex": "^0.16.28"
30
+ },
31
+ "optionalDependencies": {
32
+ "dompurify": "^3.0.0"
33
+ },
34
+ "peerDependencies": {
35
+ "react": ">=18.0.0",
36
+ "react-dom": ">=18.0.0"
37
+ },
38
+ "devDependencies": {
39
+ "@types/dompurify": "^3.0.0",
40
+ "@types/react": "^18.2.0",
41
+ "@types/react-dom": "^18.2.0",
42
+ "react": "^18.2.0",
43
+ "react-dom": "^18.2.0"
44
+ },
45
+ "keywords": [
46
+ "markdown",
47
+ "react",
48
+ "component",
49
+ "unified"
50
+ ],
51
+ "license": "MIT"
52
+ }