@lobehub/ui 5.3.0 → 5.5.0

package/es/Icon/Icon.d.mts

@@ -1,8 +1,8 @@
 import { IconProps } from "./type.mjs";
-import * as react21 from "react";
+import * as react33 from "react";
 
 //#region src/Icon/Icon.d.ts
-declare const Icon: react21.NamedExoticComponent<IconProps>;
+declare const Icon: react33.NamedExoticComponent<IconProps>;
 //#endregion
 export { Icon };
 //# sourceMappingURL=Icon.d.mts.map

package/es/Icon/components/IconProvider.d.mts

@@ -1,11 +1,11 @@
 import { IconProps } from "../type.mjs";
-import * as react19 from "react";
+import * as react31 from "react";
 import { ReactNode } from "react";
 
 //#region src/Icon/components/IconProvider.d.ts
 type IconContentConfig = Omit<IconProps, 'icon' | 'ref'>;
-declare const IconContext: react19.Context<IconContentConfig>;
-declare const IconProvider: react19.NamedExoticComponent<{
+declare const IconContext: react31.Context<IconContentConfig>;
+declare const IconProvider: react31.NamedExoticComponent<{
   children: ReactNode;
   config?: IconContentConfig;
 }>;

package/es/Image/PreviewGroup.d.mts

@@ -1,8 +1,8 @@
 import { PreviewGroupProps } from "./type.mjs";
-import * as react69 from "react";
+import * as react47 from "react";
 
 //#region src/Image/PreviewGroup.d.ts
-declare const PreviewGroup: react69.NamedExoticComponent<PreviewGroupProps>;
+declare const PreviewGroup: react47.NamedExoticComponent<PreviewGroupProps>;
 //#endregion
 export { PreviewGroup };
 //# sourceMappingURL=PreviewGroup.d.mts.map

package/es/ImageSelect/ImageSelect.d.mts

@@ -1,8 +1,8 @@
 import { ImageSelectProps } from "./type.mjs";
-import * as react81 from "react";
+import * as react116 from "react";
 
 //#region src/ImageSelect/ImageSelect.d.ts
-declare const ImageSelect: react81.NamedExoticComponent<ImageSelectProps>;
+declare const ImageSelect: react116.NamedExoticComponent<ImageSelectProps>;
 //#endregion
 export { ImageSelect };
 //# sourceMappingURL=ImageSelect.d.mts.map

package/es/Input/Input.d.mts

@@ -1,8 +1,8 @@
 import { InputProps } from "./type.mjs";
-import * as react121 from "react";
+import * as react155 from "react";
 
 //#region src/Input/Input.d.ts
-declare const Input: react121.NamedExoticComponent<InputProps>;
+declare const Input: react155.NamedExoticComponent<InputProps>;
 //#endregion
 export { Input };
 //# sourceMappingURL=Input.d.mts.map

package/es/Input/InputNumber.d.mts

@@ -1,8 +1,8 @@
 import { InputNumberProps } from "./type.mjs";
-import * as react123 from "react";
+import * as react156 from "react";
 
 //#region src/Input/InputNumber.d.ts
-declare const InputNumber: react123.NamedExoticComponent<InputNumberProps>;
+declare const InputNumber: react156.NamedExoticComponent<InputNumberProps>;
 //#endregion
 export { InputNumber };
 //# sourceMappingURL=InputNumber.d.mts.map

package/es/Input/InputOPT.d.mts

@@ -1,8 +1,8 @@
 import { InputOPTProps } from "./type.mjs";
-import * as react124 from "react";
+import * as react157 from "react";
 
 //#region src/Input/InputOPT.d.ts
-declare const InputOPT: react124.NamedExoticComponent<InputOPTProps>;
+declare const InputOPT: react157.NamedExoticComponent<InputOPTProps>;
 //#endregion
 export { InputOPT };
 //# sourceMappingURL=InputOPT.d.mts.map

package/es/Input/InputPassword.d.mts

@@ -1,8 +1,8 @@
 import { InputPasswordProps } from "./type.mjs";
-import * as react125 from "react";
+import * as react158 from "react";
 
 //#region src/Input/InputPassword.d.ts
-declare const InputPassword: react125.NamedExoticComponent<InputPasswordProps>;
+declare const InputPassword: react158.NamedExoticComponent<InputPasswordProps>;
 //#endregion
 export { InputPassword };
 //# sourceMappingURL=InputPassword.d.mts.map

package/es/Input/TextArea.d.mts

@@ -1,8 +1,8 @@
 import { TextAreaProps } from "./type.mjs";
-import * as react126 from "react";
+import * as react159 from "react";
 
 //#region src/Input/TextArea.d.ts
-declare const TextArea: react126.NamedExoticComponent<TextAreaProps>;
+declare const TextArea: react159.NamedExoticComponent<TextAreaProps>;
 //#endregion
 export { TextArea };
 //# sourceMappingURL=TextArea.d.mts.map

package/es/Layout/components/LayoutFooter.d.mts

@@ -1,9 +1,9 @@
 import { DivProps } from "../../types/index.mjs";
 import "../../index.mjs";
-import * as react62 from "react";
+import * as react36 from "react";
 
 //#region src/Layout/components/LayoutFooter.d.ts
-declare const LayoutFooter: react62.NamedExoticComponent<DivProps>;
+declare const LayoutFooter: react36.NamedExoticComponent<DivProps>;
 //#endregion
 export { LayoutFooter };
 //# sourceMappingURL=LayoutFooter.d.mts.map

package/es/Layout/components/LayoutHeader.d.mts

@@ -1,8 +1,8 @@
 import { LayoutHeaderProps } from "../type.mjs";
-import * as react64 from "react";
+import * as react39 from "react";
 
 //#region src/Layout/components/LayoutHeader.d.ts
-declare const LayoutHeader: react64.NamedExoticComponent<LayoutHeaderProps>;
+declare const LayoutHeader: react39.NamedExoticComponent<LayoutHeaderProps>;
 //#endregion
 export { LayoutHeader };
 //# sourceMappingURL=LayoutHeader.d.mts.map

package/es/Layout/components/LayoutMain.d.mts

@@ -1,9 +1,9 @@
 import { DivProps } from "../../types/index.mjs";
 import "../../index.mjs";
-import * as react63 from "react";
+import * as react41 from "react";
 
 //#region src/Layout/components/LayoutMain.d.ts
-declare const LayoutMain: react63.NamedExoticComponent<DivProps>;
+declare const LayoutMain: react41.NamedExoticComponent<DivProps>;
 //#endregion
 export { LayoutMain };
 //# sourceMappingURL=LayoutMain.d.mts.map

package/es/Layout/components/LayoutSidebar.d.mts

@@ -1,8 +1,8 @@
 import { LayoutSidebarProps } from "../type.mjs";
-import * as react66 from "react";
+import * as react37 from "react";
 
 //#region src/Layout/components/LayoutSidebar.d.ts
-declare const LayoutSidebar: react66.NamedExoticComponent<LayoutSidebarProps>;
+declare const LayoutSidebar: react37.NamedExoticComponent<LayoutSidebarProps>;
 //#endregion
 export { LayoutSidebar };
 //# sourceMappingURL=LayoutSidebar.d.mts.map

package/es/Layout/components/LayoutSidebarInner.d.mts

@@ -1,8 +1,8 @@
 import { LayoutSidebarInnerProps } from "../type.mjs";
-import * as react65 from "react";
+import * as react38 from "react";
 
 //#region src/Layout/components/LayoutSidebarInner.d.ts
-declare const LayoutSidebarInner: react65.NamedExoticComponent<LayoutSidebarInnerProps>;
+declare const LayoutSidebarInner: react38.NamedExoticComponent<LayoutSidebarInnerProps>;
 //#endregion
 export { LayoutSidebarInner };
 //# sourceMappingURL=LayoutSidebarInner.d.mts.map

package/es/Layout/components/LayoutToc.d.mts

@@ -1,8 +1,8 @@
 import { LayoutTocProps } from "../type.mjs";
-import * as react67 from "react";
+import * as react40 from "react";
 
 //#region src/Layout/components/LayoutToc.d.ts
-declare const LayoutToc: react67.NamedExoticComponent<LayoutTocProps>;
+declare const LayoutToc: react40.NamedExoticComponent<LayoutTocProps>;
 //#endregion
 export { LayoutToc };
 //# sourceMappingURL=LayoutToc.d.mts.map

package/es/List/ListItem/index.d.mts

@@ -1,8 +1,8 @@
 import { ListItemProps } from "../type.mjs";
-import * as react68 from "react";
+import * as react44 from "react";
 
 //#region src/List/ListItem/index.d.ts
-declare const ListItem: react68.NamedExoticComponent<ListItemProps>;
+declare const ListItem: react44.NamedExoticComponent<ListItemProps>;
 //#endregion
 export { ListItem };
 //# sourceMappingURL=index.d.mts.map

package/es/Markdown/Markdown.d.mts

@@ -1,8 +1,8 @@
 import { MarkdownProps } from "./type.mjs";
-import * as react58 from "react";
+import * as react43 from "react";
 
 //#region src/Markdown/Markdown.d.ts
-declare const Markdown: react58.NamedExoticComponent<MarkdownProps>;
+declare const Markdown: react43.NamedExoticComponent<MarkdownProps>;
 //#endregion
 export { Markdown };
 //# sourceMappingURL=Markdown.d.mts.map

package/es/Markdown/Markdown.mjs

@@ -13,7 +13,7 @@ import { cx } from "antd-style";
 
 //#region src/Markdown/Markdown.tsx
 const Markdown = memo((props) => {
-	const { ref, children = "", className, style, fullFeaturedCodeBlock, onDoubleClick, animated, enableLatex = true, enableMermaid = true, enableImageGallery, enableCustomFootnotes, enableGithubAlert, enableStream = true, componentProps, rehypePluginsAhead, allowHtml, borderRadius, fontSize = props.variant === "chat" ? 14 : void 0, headerMultiple = props.variant === "chat" ? .25 : void 0, marginMultiple = props.variant === "chat" ? 1 : void 0, variant = "default", reactMarkdownProps, lineHeight = props.variant === "chat" ? 1.6 : void 0, rehypePlugins, remarkPlugins, remarkPluginsAhead, components = {}, customRender, showFootnotes = true, citations, ...rest } = props;
+	const { ref, children = "", className, style, fullFeaturedCodeBlock, onDoubleClick, animated, enableLatex = true, enableMermaid = true, enableImageGallery, enableCustomFootnotes, enableGithubAlert, enableStream = true, componentProps, rehypePluginsAhead, allowHtml, borderRadius, fontSize = props.variant === "chat" ? 14 : void 0, headerMultiple = props.variant === "chat" ? .25 : void 0, marginMultiple = props.variant === "chat" ? 1 : void 0, variant = "default", reactMarkdownProps, lineHeight = props.variant === "chat" ? 1.6 : void 0, rehypePlugins, remarkPlugins, remarkPluginsAhead, components = {}, customRender, showFootnotes = true, streamSmoothingPreset, citations, ...rest } = props;
 	const delayedAnimated = useDelayedAnimated(animated);
 	const Render = useCallback(({ enableStream: enableStream$1, children: children$1, reactMarkdownProps: reactMarkdownProps$1 }) => {
 		const defaultDOM = /* @__PURE__ */ jsx(enableStream$1 ? StreamdownRender_default : MarkdownRender_default, {
@@ -55,6 +55,7 @@ const Markdown = memo((props) => {
 				remarkPlugins,
 				remarkPluginsAhead,
 				showFootnotes,
+				streamSmoothingPreset,
 				variant,
 				children: /* @__PURE__ */ jsx(Render, {
 					enableStream: enableStream && delayedAnimated,

package/es/Markdown/Markdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Markdown.mjs","names":["enableStream","StreamdownRender","MarkdownRender","reactMarkdownProps","children","PreviewGroup","Typography"],"sources":["../../src/Markdown/Markdown.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo, useCallback } from 'react';\n\nimport { PreviewGroup } from '@/Image';\n\nimport { MarkdownProvider } from './components/MarkdownProvider';\nimport { useDelayedAnimated } from './components/useDelayedAnimated';\nimport { variants } from './style';\nimport { MarkdownRender, StreamdownRender } from './SyntaxMarkdown';\nimport { type MarkdownProps } from './type';\nimport Typography from './Typography';\n\nconst Markdown = memo<MarkdownProps>((props) => {\n  const {\n    ref,\n    children = '',\n    className,\n    style,\n    fullFeaturedCodeBlock,\n    onDoubleClick,\n    animated,\n    enableLatex = true,\n    enableMermaid = true,\n    enableImageGallery,\n    enableCustomFootnotes,\n    enableGithubAlert,\n    enableStream = true,\n    componentProps,\n    rehypePluginsAhead,\n    allowHtml,\n    borderRadius,\n    fontSize = props.variant === 'chat' ? 14 : undefined,\n    headerMultiple = props.variant === 'chat' ? 0.25 : undefined,\n    marginMultiple = props.variant === 'chat' ? 1 : undefined,\n    variant = 'default',\n    reactMarkdownProps,\n    lineHeight = props.variant === 'chat' ? 1.6 : undefined,\n    rehypePlugins,\n    remarkPlugins,\n    remarkPluginsAhead,\n    components = {},\n    customRender,\n    showFootnotes = true,\n    citations,\n    ...rest\n  } = props;\n\n  const delayedAnimated = useDelayedAnimated(animated);\n\n  const Render = useCallback(\n    ({\n      enableStream,\n      children,\n      reactMarkdownProps,\n    }: Pick<MarkdownProps, 'children' | 'enableStream' | 'reactMarkdownProps'>) => {\n      const DefaultRender = enableStream ? StreamdownRender : MarkdownRender;\n      const defaultDOM = <DefaultRender {...reactMarkdownProps}>{children}</DefaultRender>;\n      return customRender ? customRender(defaultDOM, { text: children }) : defaultDOM;\n    },\n    [customRender],\n  );\n\n  return (\n    <PreviewGroup enable={enableImageGallery}>\n      <Typography\n        borderRadius={borderRadius}\n        className={cx(variants({ enableLatex, variant }), className)}\n        data-code-type=\"markdown\"\n        fontSize={fontSize}\n        headerMultiple={headerMultiple}\n        lineHeight={lineHeight}\n        marginMultiple={marginMultiple}\n        ref={ref}\n        style={style}\n        onDoubleClick={onDoubleClick}\n        {...rest}\n      >\n        <MarkdownProvider\n          allowHtml={allowHtml}\n          animated={delayedAnimated}\n          citations={citations}\n          componentProps={componentProps}\n          components={components}\n          enableCustomFootnotes={enableCustomFootnotes}\n          enableGithubAlert={enableGithubAlert}\n          enableLatex={enableLatex}\n          enableMermaid={enableMermaid}\n          fullFeaturedCodeBlock={fullFeaturedCodeBlock}\n          rehypePlugins={rehypePlugins}\n          rehypePluginsAhead={rehypePluginsAhead}\n          remarkPlugins={remarkPlugins}\n          remarkPluginsAhead={remarkPluginsAhead}\n          showFootnotes={showFootnotes}\n          variant={variant}\n        >\n          <Render\n            enableStream={enableStream && delayedAnimated}\n            reactMarkdownProps={reactMarkdownProps}\n          >\n            {children}\n          </Render>\n        </MarkdownProvider>\n      </Typography>\n    </PreviewGroup>\n  );\n});\n\nMarkdown.displayName = 'Markdown';\n\nexport default Markdown;\n"],"mappings":";;;;;;;;;;;;;;AAcA,MAAM,WAAW,MAAqB,UAAU;CAC9C,MAAM,EACJ,KACA,WAAW,IACX,WACA,OACA,uBACA,eACA,UACA,cAAc,MACd,gBAAgB,MAChB,oBACA,uBACA,mBACA,eAAe,MACf,gBACA,oBACA,WACA,cACA,WAAW,MAAM,YAAY,SAAS,KAAK,QAC3C,iBAAiB,MAAM,YAAY,SAAS,MAAO,QACnD,iBAAiB,MAAM,YAAY,SAAS,IAAI,QAChD,UAAU,WACV,oBACA,aAAa,MAAM,YAAY,SAAS,MAAM,QAC9C,eACA,eACA,oBACA,aAAa,EAAE,EACf,cACA,gBAAgB,MAChB,WACA,GAAG,SACD;CAEJ,MAAM,kBAAkB,mBAAmB,SAAS;CAEpD,MAAM,SAAS,aACZ,EACC,8BACA,sBACA,+CAC6E;EAE7E,MAAM,aAAa,oBADGA,iBAAeC,2BAAmBC;GACtB,GAAIC;aAAqBC;IAAyB;AACpF,SAAO,eAAe,aAAa,YAAY,EAAE,MAAMA,YAAU,CAAC,GAAG;IAEvE,CAAC,aAAa,CACf;AAED,QACE,oBAACC;EAAa,QAAQ;YACpB,oBAACC;GACe;GACd,WAAW,GAAG,SAAS;IAAE;IAAa;IAAS,CAAC,EAAE,UAAU;GAC5D,kBAAe;GACL;GACM;GACJ;GACI;GACX;GACE;GACQ;GACf,GAAI;aAEJ,oBAAC;IACY;IACX,UAAU;IACC;IACK;IACJ;IACW;IACJ;IACN;IACE;IACQ;IACR;IACK;IACL;IACK;IACL;IACN;cAET,oBAAC;KACC,cAAc,gBAAgB;KACV;KAEnB;MACM;KACQ;IACR;GACA;EAEjB;AAEF,SAAS,cAAc;AAEvB,uBAAe"}
+{"version":3,"file":"Markdown.mjs","names":["enableStream","StreamdownRender","MarkdownRender","reactMarkdownProps","children","PreviewGroup","Typography"],"sources":["../../src/Markdown/Markdown.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo, useCallback } from 'react';\n\nimport { PreviewGroup } from '@/Image';\n\nimport { MarkdownProvider } from './components/MarkdownProvider';\nimport { useDelayedAnimated } from './components/useDelayedAnimated';\nimport { variants } from './style';\nimport { MarkdownRender, StreamdownRender } from './SyntaxMarkdown';\nimport { type MarkdownProps } from './type';\nimport Typography from './Typography';\n\nconst Markdown = memo<MarkdownProps>((props) => {\n  const {\n    ref,\n    children = '',\n    className,\n    style,\n    fullFeaturedCodeBlock,\n    onDoubleClick,\n    animated,\n    enableLatex = true,\n    enableMermaid = true,\n    enableImageGallery,\n    enableCustomFootnotes,\n    enableGithubAlert,\n    enableStream = true,\n    componentProps,\n    rehypePluginsAhead,\n    allowHtml,\n    borderRadius,\n    fontSize = props.variant === 'chat' ? 14 : undefined,\n    headerMultiple = props.variant === 'chat' ? 0.25 : undefined,\n    marginMultiple = props.variant === 'chat' ? 1 : undefined,\n    variant = 'default',\n    reactMarkdownProps,\n    lineHeight = props.variant === 'chat' ? 1.6 : undefined,\n    rehypePlugins,\n    remarkPlugins,\n    remarkPluginsAhead,\n    components = {},\n    customRender,\n    showFootnotes = true,\n    streamSmoothingPreset,\n    citations,\n    ...rest\n  } = props;\n\n  const delayedAnimated = useDelayedAnimated(animated);\n\n  const Render = useCallback(\n    ({\n      enableStream,\n      children,\n      reactMarkdownProps,\n    }: Pick<MarkdownProps, 'children' | 'enableStream' | 'reactMarkdownProps'>) => {\n      const DefaultRender = enableStream ? StreamdownRender : MarkdownRender;\n      const defaultDOM = <DefaultRender {...reactMarkdownProps}>{children}</DefaultRender>;\n      return customRender ? customRender(defaultDOM, { text: children }) : defaultDOM;\n    },\n    [customRender],\n  );\n\n  return (\n    <PreviewGroup enable={enableImageGallery}>\n      <Typography\n        borderRadius={borderRadius}\n        className={cx(variants({ enableLatex, variant }), className)}\n        data-code-type=\"markdown\"\n        fontSize={fontSize}\n        headerMultiple={headerMultiple}\n        lineHeight={lineHeight}\n        marginMultiple={marginMultiple}\n        ref={ref}\n        style={style}\n        onDoubleClick={onDoubleClick}\n        {...rest}\n      >\n        <MarkdownProvider\n          allowHtml={allowHtml}\n          animated={delayedAnimated}\n          citations={citations}\n          componentProps={componentProps}\n          components={components}\n          enableCustomFootnotes={enableCustomFootnotes}\n          enableGithubAlert={enableGithubAlert}\n          enableLatex={enableLatex}\n          enableMermaid={enableMermaid}\n          fullFeaturedCodeBlock={fullFeaturedCodeBlock}\n          rehypePlugins={rehypePlugins}\n          rehypePluginsAhead={rehypePluginsAhead}\n          remarkPlugins={remarkPlugins}\n          remarkPluginsAhead={remarkPluginsAhead}\n          showFootnotes={showFootnotes}\n          streamSmoothingPreset={streamSmoothingPreset}\n          variant={variant}\n        >\n          <Render\n            enableStream={enableStream && delayedAnimated}\n            reactMarkdownProps={reactMarkdownProps}\n          >\n            {children}\n          </Render>\n        </MarkdownProvider>\n      </Typography>\n    </PreviewGroup>\n  );\n});\n\nMarkdown.displayName = 'Markdown';\n\nexport default Markdown;\n"],"mappings":";;;;;;;;;;;;;;AAcA,MAAM,WAAW,MAAqB,UAAU;CAC9C,MAAM,EACJ,KACA,WAAW,IACX,WACA,OACA,uBACA,eACA,UACA,cAAc,MACd,gBAAgB,MAChB,oBACA,uBACA,mBACA,eAAe,MACf,gBACA,oBACA,WACA,cACA,WAAW,MAAM,YAAY,SAAS,KAAK,QAC3C,iBAAiB,MAAM,YAAY,SAAS,MAAO,QACnD,iBAAiB,MAAM,YAAY,SAAS,IAAI,QAChD,UAAU,WACV,oBACA,aAAa,MAAM,YAAY,SAAS,MAAM,QAC9C,eACA,eACA,oBACA,aAAa,EAAE,EACf,cACA,gBAAgB,MAChB,uBACA,WACA,GAAG,SACD;CAEJ,MAAM,kBAAkB,mBAAmB,SAAS;CAEpD,MAAM,SAAS,aACZ,EACC,8BACA,sBACA,+CAC6E;EAE7E,MAAM,aAAa,oBADGA,iBAAeC,2BAAmBC;GACtB,GAAIC;aAAqBC;IAAyB;AACpF,SAAO,eAAe,aAAa,YAAY,EAAE,MAAMA,YAAU,CAAC,GAAG;IAEvE,CAAC,aAAa,CACf;AAED,QACE,oBAACC;EAAa,QAAQ;YACpB,oBAACC;GACe;GACd,WAAW,GAAG,SAAS;IAAE;IAAa;IAAS,CAAC,EAAE,UAAU;GAC5D,kBAAe;GACL;GACM;GACJ;GACI;GACX;GACE;GACQ;GACf,GAAI;aAEJ,oBAAC;IACY;IACX,UAAU;IACC;IACK;IACJ;IACW;IACJ;IACN;IACE;IACQ;IACR;IACK;IACL;IACK;IACL;IACQ;IACd;cAET,oBAAC;KACC,cAAc,gBAAgB;KACV;KAEnB;MACM;KACQ;IACR;GACA;EAEjB;AAEF,SAAS,cAAc;AAEvB,uBAAe"}

package/es/Markdown/SyntaxMarkdown/StreamdownRender.mjs

@@ -1,11 +1,13 @@
 'use client';
 
+import { useMarkdownContext } from "../components/MarkdownProvider.mjs";
 import { useMarkdownComponents } from "../../hooks/useMarkdown/useMarkdownComponents.mjs";
 import { useMarkdownContent } from "../../hooks/useMarkdown/useMarkdownContent.mjs";
 import { useMarkdownRehypePlugins } from "../../hooks/useMarkdown/useMarkdownRehypePlugins.mjs";
 import { useMarkdownRemarkPlugins } from "../../hooks/useMarkdown/useMarkdownRemarkPlugins.mjs";
 import { rehypeStreamAnimated } from "../plugins/rehypeStreamAnimated.mjs";
 import { styles } from "./style.mjs";
+import { useSmoothStreamContent } from "./useSmoothStreamContent.mjs";
 import { useStreamQueue } from "./useStreamQueue.mjs";
 import { createElement, memo, useEffect, useId, useMemo, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -14,7 +16,7 @@ import { marked } from "marked";
 import remend from "remend";
 
 //#region src/Markdown/SyntaxMarkdown/StreamdownRender.tsx
-const STREAM_CHAR_DELAY = 15;
+const STREAM_FADE_DURATION = 280;
 function countChars(text) {
 	return [...text].length;
 }
@@ -61,14 +63,16 @@ const StreamdownBlock = memo(({ children, ...rest }) => {
 }, (prevProps, nextProps) => prevProps.children === nextProps.children && prevProps.components === nextProps.components && isSamePlugins(prevProps.rehypePlugins, nextProps.rehypePlugins) && isSamePlugins(prevProps.remarkPlugins, nextProps.remarkPlugins));
 StreamdownBlock.displayName = "StreamdownBlock";
 const StreamdownRender = memo(({ children, ...rest }) => {
+	const { streamSmoothingPreset = "balanced" } = useMarkdownContext();
 	const escapedContent = useMarkdownContent(children || "");
 	const components = useMarkdownComponents();
 	const baseRehypePlugins = useStablePlugins(useMarkdownRehypePlugins());
 	const remarkPlugins = useStablePlugins(useMarkdownRemarkPlugins());
 	const generatedId = useId();
+	const smoothedContent = useSmoothStreamContent(typeof escapedContent === "string" ? escapedContent : "", { preset: streamSmoothingPreset });
 	const processedContent = useMemo(() => {
-		return remend(typeof escapedContent === "string" ? escapedContent : "");
-	}, [escapedContent]);
+		return remend(smoothedContent);
+	}, [smoothedContent]);
 	const blocks = useMemo(() => {
 		const tokens = marked.lexer(processedContent);
 		let offset = 0;
@@ -82,41 +86,63 @@ const StreamdownRender = memo(({ children, ...rest }) => {
 		});
 	}, [processedContent]);
 	const { getBlockState, charDelay } = useStreamQueue(blocks);
-	const staggerPlugins = useMemo(() => [...baseRehypePlugins, [rehypeStreamAnimated, {
-		baseCharCount: 0,
-		charDelay
-	}]], [baseRehypePlugins, charDelay]);
-	const revealedPlugins = useMemo(() => [...baseRehypePlugins, [rehypeStreamAnimated, { revealed: true }]], [baseRehypePlugins]);
-	const prevCharCountRef = useRef(0);
-	const prevStreamOffsetRef = useRef(-1);
-	useEffect(() => {
-		const tailIdx = blocks.length - 1;
-		if (tailIdx >= 0) {
-			const tail = blocks[tailIdx];
-			if (tail.startOffset !== prevStreamOffsetRef.current) {
-				prevStreamOffsetRef.current = tail.startOffset;
-				prevCharCountRef.current = 0;
+	const prevBlockCharCountRef = useRef(/* @__PURE__ */ new Map());
+	const blockTimelineRef = useRef(/* @__PURE__ */ new Map());
+	const lastRenderTsRef = useRef(null);
+	const renderTs = typeof performance === "undefined" ? Date.now() : performance.now();
+	const frameDt = lastRenderTsRef.current === null ? 0 : Math.max(0, Math.min(renderTs - lastRenderTsRef.current, 120));
+	const timelineForRender = useMemo(() => {
+		const next = /* @__PURE__ */ new Map();
+		const prevTimeline = blockTimelineRef.current;
+		const prevCharCounts = prevBlockCharCountRef.current;
+		for (const block of blocks) {
+			const blockCharCount = countChars(block.content);
+			const prevCharCount = prevCharCounts.get(block.startOffset) ?? 0;
+			const prevElapsed = prevTimeline.get(block.startOffset);
+			const latestCharStart = Math.max(0, (blockCharCount - 1) * charDelay);
+			if (prevElapsed === void 0 || blockCharCount < prevCharCount) {
+				next.set(block.startOffset, latestCharStart);
+				continue;
 			}
-			prevCharCountRef.current = countChars(tail.content);
-		} else {
-			prevCharCountRef.current = 0;
-			prevStreamOffsetRef.current = -1;
+			const elapsedByTime = prevElapsed + frameDt;
+			const minElapsed = Math.max(0, latestCharStart - charDelay * 2);
+			next.set(block.startOffset, Math.max(elapsedByTime, minElapsed));
 		}
-	}, [blocks]);
+		return next;
+	}, [
+		blocks,
+		charDelay,
+		frameDt
+	]);
+	useEffect(() => {
+		const nextCharCount = /* @__PURE__ */ new Map();
+		for (const block of blocks) nextCharCount.set(block.startOffset, countChars(block.content));
+		prevBlockCharCountRef.current = nextCharCount;
+		blockTimelineRef.current = timelineForRender;
+		lastRenderTsRef.current = typeof performance === "undefined" ? Date.now() : performance.now();
+	}, [blocks, timelineForRender]);
 	return /* @__PURE__ */ jsx("div", {
 		className: styles.animated,
 		children: blocks.map((block, index) => {
 			const state = getBlockState(index);
 			if (state === "queued") return null;
+			const timelineElapsedMs = timelineForRender.get(block.startOffset) ?? 0;
 			let plugins;
-			if (state === "streaming") {
-				const baseCharCount = block.startOffset === prevStreamOffsetRef.current ? prevCharCountRef.current : 0;
-				plugins = [...baseRehypePlugins, [rehypeStreamAnimated, {
-					baseCharCount,
-					charDelay: STREAM_CHAR_DELAY
-				}]];
-			} else if (state === "animating") plugins = staggerPlugins;
-			else plugins = revealedPlugins;
+			if (state === "streaming") plugins = [...baseRehypePlugins, [rehypeStreamAnimated, {
+				charDelay,
+				fadeDuration: STREAM_FADE_DURATION,
+				timelineElapsedMs
+			}]];
+			else if (state === "animating") plugins = [...baseRehypePlugins, [rehypeStreamAnimated, {
+				charDelay,
+				fadeDuration: STREAM_FADE_DURATION,
+				timelineElapsedMs
+			}]];
+			else plugins = [...baseRehypePlugins, [rehypeStreamAnimated, {
+				charDelay,
+				fadeDuration: STREAM_FADE_DURATION,
+				timelineElapsedMs
+			}]];
 			return /* @__PURE__ */ createElement(StreamdownBlock, {
 				...rest,
 				components,

package/es/Markdown/SyntaxMarkdown/StreamdownRender.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"StreamdownRender.mjs","names":["blocks: BlockInfo[]","staggerPlugins: Pluggable[]","revealedPlugins: Pluggable[]","plugins: Pluggable[]"],"sources":["../../../src/Markdown/SyntaxMarkdown/StreamdownRender.tsx"],"sourcesContent":["'use client';\n\nimport { marked } from 'marked';\nimport { memo, useEffect, useId, useMemo, useRef } from 'react';\nimport Markdown, { type Options } from 'react-markdown';\nimport remend from 'remend';\nimport type { Pluggable, PluggableList } from 'unified';\n\nimport {\n  useMarkdownComponents,\n  useMarkdownContent,\n  useMarkdownRehypePlugins,\n  useMarkdownRemarkPlugins,\n} from '@/hooks/useMarkdown';\nimport { rehypeStreamAnimated } from '@/Markdown/plugins/rehypeStreamAnimated';\n\nimport { styles } from './style';\nimport { type BlockInfo, useStreamQueue } from './useStreamQueue';\n\nconst STREAM_CHAR_DELAY = 15;\n\nfunction countChars(text: string): number {\n  return [...text].length;\n}\n\nconst isRecord = (value: unknown): value is Record<string, unknown> =>\n  typeof value === 'object' && value !== null;\n\nconst isDeepEqualValue = (a: unknown, b: unknown): boolean => {\n  if (a === b) return true;\n\n  if (Array.isArray(a) || Array.isArray(b)) {\n    if (!Array.isArray(a) || !Array.isArray(b)) return false;\n    if (a.length !== b.length) return false;\n    for (let i = 0; i < a.length; i++) {\n      if (!isDeepEqualValue(a[i], b[i])) return false;\n    }\n    return true;\n  }\n\n  if (!isRecord(a) || !isRecord(b)) return false;\n\n  const keysA = Object.keys(a);\n  const keysB = Object.keys(b);\n  if (keysA.length !== keysB.length) return false;\n\n  for (const key of keysA) {\n    if (!isDeepEqualValue(a[key], b[key])) return false;\n  }\n\n  return true;\n};\n\nconst isSamePlugin = (prevPlugin: Pluggable, nextPlugin: Pluggable): boolean => {\n  const prevTuple = Array.isArray(prevPlugin) ? prevPlugin : [prevPlugin];\n  const nextTuple = Array.isArray(nextPlugin) ? nextPlugin : [nextPlugin];\n\n  if (prevTuple.length !== nextTuple.length) return false;\n  if (prevTuple[0] !== nextTuple[0]) return false;\n\n  return isDeepEqualValue(prevTuple.slice(1), nextTuple.slice(1));\n};\n\nconst isSamePlugins = (\n  prevPlugins?: PluggableList | null,\n  nextPlugins?: PluggableList | null,\n): boolean => {\n  if (prevPlugins === nextPlugins) return true;\n  if (!prevPlugins || !nextPlugins) return !prevPlugins && !nextPlugins;\n  if (prevPlugins.length !== nextPlugins.length) return false;\n\n  for (let i = 0; i < prevPlugins.length; i++) {\n    if (!isSamePlugin(prevPlugins[i], nextPlugins[i])) return false;\n  }\n\n  return true;\n};\n\nconst useStablePlugins = (plugins: PluggableList): PluggableList => {\n  const stableRef = useRef<PluggableList>(plugins);\n\n  if (!isSamePlugins(stableRef.current, plugins)) {\n    stableRef.current = plugins;\n  }\n\n  return stableRef.current;\n};\n\nconst StreamdownBlock = memo<Options>(\n  ({ children, ...rest }) => {\n    return <Markdown {...rest}>{children}</Markdown>;\n  },\n  (prevProps, nextProps) =>\n    prevProps.children === nextProps.children &&\n    prevProps.components === nextProps.components &&\n    isSamePlugins(prevProps.rehypePlugins, nextProps.rehypePlugins) &&\n    isSamePlugins(prevProps.remarkPlugins, nextProps.remarkPlugins),\n);\n\nStreamdownBlock.displayName = 'StreamdownBlock';\n\nexport const StreamdownRender = memo<Options>(({ children, ...rest }) => {\n  const escapedContent = useMarkdownContent(children || '');\n  const components = useMarkdownComponents();\n  const baseRehypePlugins = useStablePlugins(useMarkdownRehypePlugins());\n  const remarkPlugins = useStablePlugins(useMarkdownRemarkPlugins());\n  const generatedId = useId();\n\n  const processedContent = useMemo(() => {\n    const content = typeof escapedContent === 'string' ? escapedContent : '';\n    return remend(content);\n  }, [escapedContent]);\n\n  const blocks: BlockInfo[] = useMemo(() => {\n    const tokens = marked.lexer(processedContent);\n    let offset = 0;\n    return tokens.map((token) => {\n      const block = { content: token.raw, startOffset: offset };\n      offset += token.raw.length;\n      return block;\n    });\n  }, [processedContent]);\n\n  const { getBlockState, charDelay } = useStreamQueue(blocks);\n\n  const staggerPlugins: Pluggable[] = useMemo(\n    () => [...baseRehypePlugins, [rehypeStreamAnimated, { baseCharCount: 0, charDelay }]],\n    [baseRehypePlugins, charDelay],\n  );\n\n  const revealedPlugins: Pluggable[] = useMemo(\n    () => [...baseRehypePlugins, [rehypeStreamAnimated, { revealed: true }]],\n    [baseRehypePlugins],\n  );\n\n  // prevCharCount tracks the PREVIOUS render's streaming char count.\n  // Updated in useEffect (after render) to avoid stale reads during\n  // synchronous re-renders (e.g. useLayoutEffect auto-reveal).\n  const prevCharCountRef = useRef(0);\n  const prevStreamOffsetRef = useRef(-1);\n\n  useEffect(() => {\n    const tailIdx = blocks.length - 1;\n    if (tailIdx >= 0) {\n      const tail = blocks[tailIdx];\n      if (tail.startOffset !== prevStreamOffsetRef.current) {\n        prevStreamOffsetRef.current = tail.startOffset;\n        prevCharCountRef.current = 0;\n      }\n      prevCharCountRef.current = countChars(tail.content);\n    } else {\n      prevCharCountRef.current = 0;\n      prevStreamOffsetRef.current = -1;\n    }\n  }, [blocks]);\n\n  return (\n    <div className={styles.animated}>\n      {blocks.map((block, index) => {\n        const state = getBlockState(index);\n        if (state === 'queued') return null;\n\n        let plugins: Pluggable[];\n        if (state === 'streaming') {\n          const baseCharCount =\n            block.startOffset === prevStreamOffsetRef.current ? prevCharCountRef.current : 0;\n          plugins = [\n            ...baseRehypePlugins,\n            [rehypeStreamAnimated, { baseCharCount, charDelay: STREAM_CHAR_DELAY }],\n          ];\n        } else if (state === 'animating') {\n          plugins = staggerPlugins;\n        } else {\n          plugins = revealedPlugins;\n        }\n\n        return (\n          <StreamdownBlock\n            {...rest}\n            components={components}\n            key={`${generatedId}-${block.startOffset}`}\n            rehypePlugins={plugins}\n            remarkPlugins={remarkPlugins}\n          >\n            {block.content}\n          </StreamdownBlock>\n        );\n      })}\n    </div>\n  );\n});\n\nStreamdownRender.displayName = 'StreamdownRender';\n\nexport default StreamdownRender;\n"],"mappings":"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"}
+{"version":3,"file":"StreamdownRender.mjs","names":["blocks: BlockInfo[]","plugins: Pluggable[]"],"sources":["../../../src/Markdown/SyntaxMarkdown/StreamdownRender.tsx"],"sourcesContent":["'use client';\n\nimport { marked } from 'marked';\nimport { memo, useEffect, useId, useMemo, useRef } from 'react';\nimport Markdown, { type Options } from 'react-markdown';\nimport remend from 'remend';\nimport type { Pluggable, PluggableList } from 'unified';\n\nimport {\n  useMarkdownComponents,\n  useMarkdownContent,\n  useMarkdownRehypePlugins,\n  useMarkdownRemarkPlugins,\n} from '@/hooks/useMarkdown';\nimport { useMarkdownContext } from '@/Markdown/components/MarkdownProvider';\nimport { rehypeStreamAnimated } from '@/Markdown/plugins/rehypeStreamAnimated';\n\nimport { styles } from './style';\nimport { useSmoothStreamContent } from './useSmoothStreamContent';\nimport { type BlockInfo, useStreamQueue } from './useStreamQueue';\n\nconst STREAM_FADE_DURATION = 280;\n\nfunction countChars(text: string): number {\n  return [...text].length;\n}\n\nconst isRecord = (value: unknown): value is Record<string, unknown> =>\n  typeof value === 'object' && value !== null;\n\nconst isDeepEqualValue = (a: unknown, b: unknown): boolean => {\n  if (a === b) return true;\n\n  if (Array.isArray(a) || Array.isArray(b)) {\n    if (!Array.isArray(a) || !Array.isArray(b)) return false;\n    if (a.length !== b.length) return false;\n    for (let i = 0; i < a.length; i++) {\n      if (!isDeepEqualValue(a[i], b[i])) return false;\n    }\n    return true;\n  }\n\n  if (!isRecord(a) || !isRecord(b)) return false;\n\n  const keysA = Object.keys(a);\n  const keysB = Object.keys(b);\n  if (keysA.length !== keysB.length) return false;\n\n  for (const key of keysA) {\n    if (!isDeepEqualValue(a[key], b[key])) return false;\n  }\n\n  return true;\n};\n\nconst isSamePlugin = (prevPlugin: Pluggable, nextPlugin: Pluggable): boolean => {\n  const prevTuple = Array.isArray(prevPlugin) ? prevPlugin : [prevPlugin];\n  const nextTuple = Array.isArray(nextPlugin) ? nextPlugin : [nextPlugin];\n\n  if (prevTuple.length !== nextTuple.length) return false;\n  if (prevTuple[0] !== nextTuple[0]) return false;\n\n  return isDeepEqualValue(prevTuple.slice(1), nextTuple.slice(1));\n};\n\nconst isSamePlugins = (\n  prevPlugins?: PluggableList | null,\n  nextPlugins?: PluggableList | null,\n): boolean => {\n  if (prevPlugins === nextPlugins) return true;\n  if (!prevPlugins || !nextPlugins) return !prevPlugins && !nextPlugins;\n  if (prevPlugins.length !== nextPlugins.length) return false;\n\n  for (let i = 0; i < prevPlugins.length; i++) {\n    if (!isSamePlugin(prevPlugins[i], nextPlugins[i])) return false;\n  }\n\n  return true;\n};\n\nconst useStablePlugins = (plugins: PluggableList): PluggableList => {\n  const stableRef = useRef<PluggableList>(plugins);\n\n  if (!isSamePlugins(stableRef.current, plugins)) {\n    stableRef.current = plugins;\n  }\n\n  return stableRef.current;\n};\n\nconst StreamdownBlock = memo<Options>(\n  ({ children, ...rest }) => {\n    return <Markdown {...rest}>{children}</Markdown>;\n  },\n  (prevProps, nextProps) =>\n    prevProps.children === nextProps.children &&\n    prevProps.components === nextProps.components &&\n    isSamePlugins(prevProps.rehypePlugins, nextProps.rehypePlugins) &&\n    isSamePlugins(prevProps.remarkPlugins, nextProps.remarkPlugins),\n);\n\nStreamdownBlock.displayName = 'StreamdownBlock';\n\nexport const StreamdownRender = memo<Options>(({ children, ...rest }) => {\n  const { streamSmoothingPreset = 'balanced' } = useMarkdownContext();\n  const escapedContent = useMarkdownContent(children || '');\n  const components = useMarkdownComponents();\n  const baseRehypePlugins = useStablePlugins(useMarkdownRehypePlugins());\n  const remarkPlugins = useStablePlugins(useMarkdownRemarkPlugins());\n  const generatedId = useId();\n  const smoothedContent = useSmoothStreamContent(\n    typeof escapedContent === 'string' ? escapedContent : '',\n    { preset: streamSmoothingPreset },\n  );\n\n  const processedContent = useMemo(() => {\n    return remend(smoothedContent);\n  }, [smoothedContent]);\n\n  const blocks: BlockInfo[] = useMemo(() => {\n    const tokens = marked.lexer(processedContent);\n    let offset = 0;\n    return tokens.map((token) => {\n      const block = { content: token.raw, startOffset: offset };\n      offset += token.raw.length;\n      return block;\n    });\n  }, [processedContent]);\n\n  const { getBlockState, charDelay } = useStreamQueue(blocks);\n  const prevBlockCharCountRef = useRef<Map<number, number>>(new Map());\n  const blockTimelineRef = useRef<Map<number, number>>(new Map());\n  const lastRenderTsRef = useRef<number | null>(null);\n\n  const renderTs = typeof performance === 'undefined' ? Date.now() : performance.now();\n  const frameDt =\n    lastRenderTsRef.current === null\n      ? 0\n      : Math.max(0, Math.min(renderTs - lastRenderTsRef.current, 120));\n\n  const timelineForRender = useMemo(() => {\n    const next = new Map<number, number>();\n    const prevTimeline = blockTimelineRef.current;\n    const prevCharCounts = prevBlockCharCountRef.current;\n\n    for (const block of blocks) {\n      const blockCharCount = countChars(block.content);\n      const prevCharCount = prevCharCounts.get(block.startOffset) ?? 0;\n      const prevElapsed = prevTimeline.get(block.startOffset);\n      const latestCharStart = Math.max(0, (blockCharCount - 1) * charDelay);\n\n      if (prevElapsed === undefined || blockCharCount < prevCharCount) {\n        next.set(block.startOffset, latestCharStart);\n        continue;\n      }\n\n      const elapsedByTime = prevElapsed + frameDt;\n      // Avoid huge hidden backlog when stream updates in bursts.\n      const minElapsed = Math.max(0, latestCharStart - charDelay * 2);\n      next.set(block.startOffset, Math.max(elapsedByTime, minElapsed));\n    }\n\n    return next;\n  }, [blocks, charDelay, frameDt]);\n\n  useEffect(() => {\n    const nextCharCount = new Map<number, number>();\n    for (const block of blocks) {\n      nextCharCount.set(block.startOffset, countChars(block.content));\n    }\n    prevBlockCharCountRef.current = nextCharCount;\n    blockTimelineRef.current = timelineForRender;\n    lastRenderTsRef.current = typeof performance === 'undefined' ? Date.now() : performance.now();\n  }, [blocks, timelineForRender]);\n\n  return (\n    <div className={styles.animated}>\n      {blocks.map((block, index) => {\n        const state = getBlockState(index);\n        if (state === 'queued') return null;\n        const timelineElapsedMs = timelineForRender.get(block.startOffset) ?? 0;\n\n        let plugins: Pluggable[];\n        if (state === 'streaming') {\n          plugins = [\n            ...baseRehypePlugins,\n            [\n              rehypeStreamAnimated,\n              { charDelay, fadeDuration: STREAM_FADE_DURATION, timelineElapsedMs },\n            ],\n          ];\n        } else if (state === 'animating') {\n          // Continue from previously rendered progress instead of restarting\n          // or force-switching to fully revealed.\n          plugins = [\n            ...baseRehypePlugins,\n            [\n              rehypeStreamAnimated,\n              { charDelay, fadeDuration: STREAM_FADE_DURATION, timelineElapsedMs },\n            ],\n          ];\n        } else {\n          // Keep fade continuity for just-finished chars; avoid instant class\n          // switch to stream-char-revealed that would cancel in-flight fades.\n          plugins = [\n            ...baseRehypePlugins,\n            [\n              rehypeStreamAnimated,\n              { charDelay, fadeDuration: STREAM_FADE_DURATION, timelineElapsedMs },\n            ],\n          ];\n        }\n\n        return (\n          <StreamdownBlock\n            {...rest}\n            components={components}\n            key={`${generatedId}-${block.startOffset}`}\n            rehypePlugins={plugins}\n            remarkPlugins={remarkPlugins}\n          >\n            {block.content}\n          </StreamdownBlock>\n        );\n      })}\n    </div>\n  );\n});\n\nStreamdownRender.displayName = 'StreamdownRender';\n\nexport default StreamdownRender;\n"],"mappings":"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"}

package/es/Markdown/SyntaxMarkdown/style.mjs

@@ -8,8 +8,8 @@ const styles = createStaticStyles(({ css: css$1 }) => {
         opacity: 0;
 
         animation-name: ${fadeIn};
-        animation-duration: 150ms;
-        animation-timing-function: ease-out;
+        animation-duration: 280ms;
+        animation-timing-function: cubic-bezier(0.33, 0, 0.67, 1);
         animation-fill-mode: forwards;
       }
 

package/es/Markdown/SyntaxMarkdown/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { fadeIn } from '@/styles/animations';\n\nexport const styles = createStaticStyles(({ css }) => {\n  return {\n    animated: css`\n      .stream-char {\n        opacity: 0;\n\n        animation-name: ${fadeIn};\n        animation-duration: 150ms;\n        animation-timing-function: ease-out;\n        animation-fill-mode: forwards;\n      }\n\n      .stream-char-revealed {\n        opacity: 1;\n        animation: none;\n      }\n\n      .katex-display .katex-html span {\n        mask: none !important;\n        animation: none !important;\n      }\n    `,\n  };\n});\n"],"mappings":";;;;AAIA,MAAa,SAAS,oBAAoB,EAAE,iBAAU;AACpD,QAAO,EACL,UAAU,KAAG;;;;0BAIS,OAAO;;;;;;;;;;;;;;;OAgB9B;EACD"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { fadeIn } from '@/styles/animations';\n\nexport const styles = createStaticStyles(({ css }) => {\n  return {\n    animated: css`\n      .stream-char {\n        opacity: 0;\n\n        animation-name: ${fadeIn};\n        animation-duration: 280ms;\n        animation-timing-function: cubic-bezier(0.33, 0, 0.67, 1);\n        animation-fill-mode: forwards;\n      }\n\n      .stream-char-revealed {\n        opacity: 1;\n        animation: none;\n      }\n\n      .katex-display .katex-html span {\n        mask: none !important;\n        animation: none !important;\n      }\n    `,\n  };\n});\n"],"mappings":";;;;AAIA,MAAa,SAAS,oBAAoB,EAAE,iBAAU;AACpD,QAAO,EACL,UAAU,KAAG;;;;0BAIS,OAAO;;;;;;;;;;;;;;;OAgB9B;EACD"}