@lobehub/ui 4.3.2 → 4.3.3

package/es/List/ListItem/style.mjs

@@ -1,7 +1,8 @@
-import { createStyles } from "antd-style";
+import { staticStylish } from "../../styles/theme/customStylishStatic.mjs";
+import { createStaticStyles, cx } from "antd-style";
 
 //#region src/List/ListItem/style.ts
-const useStyles = createStyles(({ cx: cx$1, css: css$1, token, stylish }) => {
+const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => {
 	return {
 		actions: css$1`
       position: absolute;
@@ -9,7 +10,7 @@ const useStyles = createStyles(({ cx: cx$1, css: css$1, token, stylish }) => {
       inset-inline-end: 16px;
       transform: translateY(-50%);
     `,
-		active: stylish.active,
+		active: staticStylish.active,
 		content: css$1`
       position: relative;
       overflow: hidden;
@@ -18,7 +19,7 @@ const useStyles = createStyles(({ cx: cx$1, css: css$1, token, stylish }) => {
     `,
 		date: css$1`
       font-size: 12px;
-      color: ${token.colorTextPlaceholder};
+      color: ${cssVar$1.colorTextPlaceholder};
     `,
 		desc: css$1`
       width: 100%;
@@ -26,18 +27,18 @@ const useStyles = createStyles(({ cx: cx$1, css: css$1, token, stylish }) => {
 
       font-size: 12px;
       line-height: 1.2;
-      color: ${token.colorTextDescription};
+      color: ${cssVar$1.colorTextDescription};
     `,
 		pin: css$1`
       position: absolute;
       inset-block-start: 6px;
       inset-inline-end: 6px;
     `,
-		root: cx$1(stylish.variantBorderless, css$1`
+		root: cx(staticStylish.variantBorderless, css$1`
         cursor: pointer;
         position: relative;
-        border-radius: ${token.borderRadius}px;
-        color: ${token.colorTextTertiary};
+        border-radius: ${cssVar$1.borderRadius};
+        color: ${cssVar$1.colorTextTertiary};
       `),
 		title: css$1`
       width: 100%;
@@ -46,7 +47,7 @@ const useStyles = createStyles(({ cx: cx$1, css: css$1, token, stylish }) => {
       font-size: 14px;
       font-weight: 500;
       line-height: 1.2;
-      color: ${token.colorText};
+      color: ${cssVar$1.colorText};
     `,
 		triangle: css$1`
       width: 10px;
@@ -54,12 +55,12 @@ const useStyles = createStyles(({ cx: cx$1, css: css$1, token, stylish }) => {
       border-radius: 2px;
 
       opacity: 0.5;
-      background: ${token.colorPrimaryBorder};
+      background: ${cssVar$1.colorPrimaryBorder};
       clip-path: polygon(0% 0%, 100% 0%, 100% 100%);
     `
 	};
 });
 
 //#endregion
-export { useStyles };
+export { styles };
 //# sourceMappingURL=style.mjs.map

package/es/List/ListItem/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["cx"],"sources":["../../../src/List/ListItem/style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\n\nexport const useStyles = createStyles(({ cx, css, token, stylish }) => {\n  return {\n    actions: css`\n      position: absolute;\n      inset-block-start: 50%;\n      inset-inline-end: 16px;\n      transform: translateY(-50%);\n    `,\n    active: stylish.active,\n    content: css`\n      position: relative;\n      overflow: hidden;\n      flex: 1;\n      align-self: center;\n    `,\n    date: css`\n      font-size: 12px;\n      color: ${token.colorTextPlaceholder};\n    `,\n    desc: css`\n      width: 100%;\n      margin: 0;\n\n      font-size: 12px;\n      line-height: 1.2;\n      color: ${token.colorTextDescription};\n    `,\n\n    pin: css`\n      position: absolute;\n      inset-block-start: 6px;\n      inset-inline-end: 6px;\n    `,\n    root: cx(\n      stylish.variantBorderless,\n      css`\n        cursor: pointer;\n        position: relative;\n        border-radius: ${token.borderRadius}px;\n        color: ${token.colorTextTertiary};\n      `,\n    ),\n\n    title: css`\n      width: 100%;\n      margin: 0;\n\n      font-size: 14px;\n      font-weight: 500;\n      line-height: 1.2;\n      color: ${token.colorText};\n    `,\n    triangle: css`\n      width: 10px;\n      height: 10px;\n      border-radius: 2px;\n\n      opacity: 0.5;\n      background: ${token.colorPrimaryBorder};\n      clip-path: polygon(0% 0%, 100% 0%, 100% 100%);\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAa,YAAY,cAAc,EAAE,UAAI,YAAK,OAAO,cAAc;AACrE,QAAO;EACL,SAAS,KAAG;;;;;;EAMZ,QAAQ,QAAQ;EAChB,SAAS,KAAG;;;;;;EAMZ,MAAM,KAAG;;eAEE,MAAM,qBAAqB;;EAEtC,MAAM,KAAG;;;;;;eAME,MAAM,qBAAqB;;EAGtC,KAAK,KAAG;;;;;EAKR,MAAMA,KACJ,QAAQ,mBACR,KAAG;;;yBAGgB,MAAM,aAAa;iBAC3B,MAAM,kBAAkB;QAEpC;EAED,OAAO,KAAG;;;;;;;eAOC,MAAM,UAAU;;EAE3B,UAAU,KAAG;;;;;;oBAMG,MAAM,mBAAmB;;;EAG1C;EACD"}
+{"version":3,"file":"style.mjs","names":["lobeStaticStylish","cssVar"],"sources":["../../../src/List/ListItem/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    actions: css`\n      position: absolute;\n      inset-block-start: 50%;\n      inset-inline-end: 16px;\n      transform: translateY(-50%);\n    `,\n    active: lobeStaticStylish.active,\n    content: css`\n      position: relative;\n      overflow: hidden;\n      flex: 1;\n      align-self: center;\n    `,\n    date: css`\n      font-size: 12px;\n      color: ${cssVar.colorTextPlaceholder};\n    `,\n    desc: css`\n      width: 100%;\n      margin: 0;\n\n      font-size: 12px;\n      line-height: 1.2;\n      color: ${cssVar.colorTextDescription};\n    `,\n\n    pin: css`\n      position: absolute;\n      inset-block-start: 6px;\n      inset-inline-end: 6px;\n    `,\n    root: cx(\n      lobeStaticStylish.variantBorderless,\n      css`\n        cursor: pointer;\n        position: relative;\n        border-radius: ${cssVar.borderRadius};\n        color: ${cssVar.colorTextTertiary};\n      `,\n    ),\n\n    title: css`\n      width: 100%;\n      margin: 0;\n\n      font-size: 14px;\n      font-weight: 500;\n      line-height: 1.2;\n      color: ${cssVar.colorText};\n    `,\n    triangle: css`\n      width: 10px;\n      height: 10px;\n      border-radius: 2px;\n\n      opacity: 0.5;\n      background: ${cssVar.colorPrimaryBorder};\n      clip-path: polygon(0% 0%, 100% 0%, 100% 100%);\n    `,\n  };\n});\n"],"mappings":";;;;AAIA,MAAa,SAAS,oBAAoB,EAAE,YAAK,uBAAa;AAC5D,QAAO;EACL,SAAS,KAAG;;;;;;EAMZ,QAAQA,cAAkB;EAC1B,SAAS,KAAG;;;;;;EAMZ,MAAM,KAAG;;eAEEC,SAAO,qBAAqB;;EAEvC,MAAM,KAAG;;;;;;eAMEA,SAAO,qBAAqB;;EAGvC,KAAK,KAAG;;;;;EAKR,MAAM,GACJD,cAAkB,mBAClB,KAAG;;;yBAGgBC,SAAO,aAAa;iBAC5BA,SAAO,kBAAkB;QAErC;EAED,OAAO,KAAG;;;;;;;eAOCA,SAAO,UAAU;;EAE5B,UAAU,KAAG;;;;;;oBAMGA,SAAO,mBAAmB;;;EAG3C;EACD"}

package/es/Markdown/Markdown.d.mts

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

package/es/Markdown/Markdown.mjs

@@ -6,37 +6,15 @@ import MarkdownRender_default from "./SyntaxMarkdown/MarkdownRender.mjs";
 import StreamdownRender_default from "./SyntaxMarkdown/StreamdownRender.mjs";
 import Typography_default from "./Typography.mjs";
 import { useDelayedAnimated } from "./components/useDelayedAnimated.mjs";
-import { useStyles } from "./style.mjs";
-import { memo, useCallback, useMemo } from "react";
+import { variants } from "./style.mjs";
+import { memo, useCallback } from "react";
 import { jsx } from "react/jsx-runtime";
-import { cva } from "class-variance-authority";
+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 { cx, styles } = useStyles();
 	const delayedAnimated = useDelayedAnimated(animated);
-	const variants = useMemo(() => cva(styles.root, {
-		defaultVariants: {
-			enableGfm: true,
-			enableLatex: true,
-			variant: "default"
-		},
-		variants: {
-			variant: {
-				default: null,
-				chat: styles.chat
-			},
-			enableLatex: {
-				true: styles.latex,
-				false: null
-			},
-			enableGfm: {
-				true: styles.gfm,
-				false: null
-			}
-		}
-	}), [styles]);
 	const Render = useCallback(({ enableStream: enableStream$1, children: children$1, reactMarkdownProps: reactMarkdownProps$1 }) => {
 		const defaultDOM = /* @__PURE__ */ jsx(enableStream$1 ? StreamdownRender_default : MarkdownRender_default, {
 			...reactMarkdownProps$1,

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 { cva } from 'class-variance-authority';\nimport { memo, useCallback, useMemo } from 'react';\n\nimport { PreviewGroup } from '@/Image';\n\nimport { MarkdownRender, StreamdownRender } from './SyntaxMarkdown';\nimport Typography from './Typography';\nimport { MarkdownProvider } from './components/MarkdownProvider';\nimport { useDelayedAnimated } from './components/useDelayedAnimated';\nimport { useStyles } from './style';\nimport type { MarkdownProps } from './type';\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 { cx, styles } = useStyles();\n\n  const delayedAnimated = useDelayedAnimated(animated);\n\n  // Style variant handling\n  const variants = useMemo(\n    () =>\n      cva(styles.root, {\n        defaultVariants: {\n          enableGfm: true,\n          enableLatex: true,\n          variant: 'default',\n        },\n        /* eslint-disable sort-keys-fix/sort-keys-fix */\n        variants: {\n          variant: {\n            default: null,\n            chat: styles.chat,\n          },\n          enableLatex: {\n            true: styles.latex,\n            false: null,\n          },\n          enableGfm: {\n            true: styles.gfm,\n            false: null,\n          },\n        },\n        /* eslint-enable sort-keys-fix/sort-keys-fix */\n      }),\n    [styles],\n  );\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        onDoubleClick={onDoubleClick}\n        ref={ref}\n        style={style}\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,EAAE,IAAI,WAAW,WAAW;CAElC,MAAM,kBAAkB,mBAAmB,SAAS;CAGpD,MAAM,WAAW,cAEb,IAAI,OAAO,MAAM;EACf,iBAAiB;GACf,WAAW;GACX,aAAa;GACb,SAAS;GACV;EAED,UAAU;GACR,SAAS;IACP,SAAS;IACT,MAAM,OAAO;IACd;GACD,aAAa;IACX,MAAM,OAAO;IACb,OAAO;IACR;GACD,WAAW;IACT,MAAM,OAAO;IACb,OAAO;IACR;GACF;EAEF,CAAC,EACJ,CAAC,OAAO,CACT;CAED,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;GACD;GACV;GACE;GACP,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 { MarkdownRender, StreamdownRender } from './SyntaxMarkdown';\nimport Typography from './Typography';\nimport { MarkdownProvider } from './components/MarkdownProvider';\nimport { useDelayedAnimated } from './components/useDelayedAnimated';\nimport { variants } from './style';\nimport type { MarkdownProps } from './type';\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        onDoubleClick={onDoubleClick}\n        ref={ref}\n        style={style}\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;GACD;GACV;GACE;GACP,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"}

package/es/Markdown/SyntaxMarkdown/StreamdownRender.mjs

@@ -4,7 +4,7 @@ import { useMarkdownComponents } from "../../hooks/useMarkdown/useMarkdownCompon
 import { useMarkdownContent } from "../../hooks/useMarkdown/useMarkdownContent.mjs";
 import { useMarkdownRehypePlugins } from "../../hooks/useMarkdown/useMarkdownRehypePlugins.mjs";
 import { useMarkdownRemarkPlugins } from "../../hooks/useMarkdown/useMarkdownRemarkPlugins.mjs";
-import { useStyles } from "./style.mjs";
+import { styles } from "./style.mjs";
 import { createElement, memo, useId, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 import Markdown from "react-markdown";
@@ -22,7 +22,6 @@ const StreamdownBlock = memo(({ children, ...rest }) => {
 }, (prevProps, nextProps) => prevProps.children === nextProps.children);
 StreamdownBlock.displayName = "StreamdownBlock";
 const StreamdownRender = memo(({ children, ...rest }) => {
-	const { styles } = useStyles();
 	const escapedContent = useMarkdownContent(children || "");
 	const components = useMarkdownComponents();
 	const rehypePluginsList = useMarkdownRehypePlugins();

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

@@ -1 +1 @@
-{"version":3,"file":"StreamdownRender.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/StreamdownRender.tsx"],"sourcesContent":["'use client';\n\nimport { marked } from 'marked';\nimport { memo, useId, useMemo } from 'react';\nimport Markdown, { Options } from 'react-markdown';\n\nimport {\n  useMarkdownComponents,\n  useMarkdownContent,\n  useMarkdownRehypePlugins,\n  useMarkdownRemarkPlugins,\n} from '@/hooks/useMarkdown';\n\nimport { useStyles } from './style';\n\nconst parseMarkdownIntoBlocks = (markdown: string): string[] => {\n  const tokens = marked.lexer(markdown);\n  return tokens.map((token) => token.raw);\n};\n\nconst StreamdownBlock = memo<Options>(\n  ({ children, ...rest }) => {\n    return <Markdown {...rest}>{children}</Markdown>;\n  },\n  (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n\nStreamdownBlock.displayName = 'StreamdownBlock';\n\nexport const StreamdownRender = memo<Options>(\n  ({ children, ...rest }) => {\n    const { styles } = useStyles();\n    const escapedContent = useMarkdownContent(children || '');\n    const components = useMarkdownComponents();\n    const rehypePluginsList = useMarkdownRehypePlugins();\n    const remarkPluginsList = useMarkdownRemarkPlugins();\n    const generatedId = useId();\n    const blocks = useMemo(\n      () => parseMarkdownIntoBlocks(typeof escapedContent === 'string' ? escapedContent : ''),\n      [escapedContent],\n    );\n\n    return (\n      <div className={styles.animated}>\n        {blocks.map((block, index) => (\n          <StreamdownBlock\n            {...rest}\n            components={components}\n            key={`${generatedId}-block_${index}`}\n            rehypePlugins={rehypePluginsList}\n            remarkPlugins={remarkPluginsList}\n          >\n            {block}\n          </StreamdownBlock>\n        ))}\n      </div>\n    );\n  },\n  (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\nStreamdownRender.displayName = 'StreamdownRender';\n\nexport default StreamdownRender;\n"],"mappings":";;;;;;;;;;;;;AAeA,MAAM,2BAA2B,aAA+B;AAE9D,QADe,OAAO,MAAM,SAAS,CACvB,KAAK,UAAU,MAAM,IAAI;;AAGzC,MAAM,kBAAkB,MACrB,EAAE,UAAU,GAAG,WAAW;AACzB,QAAO,oBAAC;EAAS,GAAI;EAAO;GAAoB;IAEjD,WAAW,cAAc,UAAU,aAAa,UAAU,SAC5D;AAED,gBAAgB,cAAc;AAE9B,MAAa,mBAAmB,MAC7B,EAAE,UAAU,GAAG,WAAW;CACzB,MAAM,EAAE,WAAW,WAAW;CAC9B,MAAM,iBAAiB,mBAAmB,YAAY,GAAG;CACzD,MAAM,aAAa,uBAAuB;CAC1C,MAAM,oBAAoB,0BAA0B;CACpD,MAAM,oBAAoB,0BAA0B;CACpD,MAAM,cAAc,OAAO;CAC3B,MAAM,SAAS,cACP,wBAAwB,OAAO,mBAAmB,WAAW,iBAAiB,GAAG,EACvF,CAAC,eAAe,CACjB;AAED,QACE,oBAAC;EAAI,WAAW,OAAO;YACpB,OAAO,KAAK,OAAO,UAClB,8BAAC;GACC,GAAI;GACQ;GACZ,KAAK,GAAG,YAAY,SAAS;GAC7B,eAAe;GACf,eAAe;KAEd,MACe,CAClB;GACE;IAGT,WAAW,cAAc,UAAU,aAAa,UAAU,SAC5D;AACD,iBAAiB,cAAc;AAE/B,+BAAe"}
+{"version":3,"file":"StreamdownRender.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/StreamdownRender.tsx"],"sourcesContent":["'use client';\n\nimport { marked } from 'marked';\nimport { memo, useId, useMemo } from 'react';\nimport Markdown, { Options } from 'react-markdown';\n\nimport {\n  useMarkdownComponents,\n  useMarkdownContent,\n  useMarkdownRehypePlugins,\n  useMarkdownRemarkPlugins,\n} from '@/hooks/useMarkdown';\n\nimport { styles } from './style';\n\nconst parseMarkdownIntoBlocks = (markdown: string): string[] => {\n  const tokens = marked.lexer(markdown);\n  return tokens.map((token) => token.raw);\n};\n\nconst StreamdownBlock = memo<Options>(\n  ({ children, ...rest }) => {\n    return <Markdown {...rest}>{children}</Markdown>;\n  },\n  (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n\nStreamdownBlock.displayName = 'StreamdownBlock';\n\nexport const StreamdownRender = memo<Options>(\n  ({ children, ...rest }) => {\n    const escapedContent = useMarkdownContent(children || '');\n    const components = useMarkdownComponents();\n    const rehypePluginsList = useMarkdownRehypePlugins();\n    const remarkPluginsList = useMarkdownRemarkPlugins();\n    const generatedId = useId();\n    const blocks = useMemo(\n      () => parseMarkdownIntoBlocks(typeof escapedContent === 'string' ? escapedContent : ''),\n      [escapedContent],\n    );\n\n    return (\n      <div className={styles.animated}>\n        {blocks.map((block, index) => (\n          <StreamdownBlock\n            {...rest}\n            components={components}\n            key={`${generatedId}-block_${index}`}\n            rehypePlugins={rehypePluginsList}\n            remarkPlugins={remarkPluginsList}\n          >\n            {block}\n          </StreamdownBlock>\n        ))}\n      </div>\n    );\n  },\n  (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\nStreamdownRender.displayName = 'StreamdownRender';\n\nexport default StreamdownRender;\n"],"mappings":";;;;;;;;;;;;;AAeA,MAAM,2BAA2B,aAA+B;AAE9D,QADe,OAAO,MAAM,SAAS,CACvB,KAAK,UAAU,MAAM,IAAI;;AAGzC,MAAM,kBAAkB,MACrB,EAAE,UAAU,GAAG,WAAW;AACzB,QAAO,oBAAC;EAAS,GAAI;EAAO;GAAoB;IAEjD,WAAW,cAAc,UAAU,aAAa,UAAU,SAC5D;AAED,gBAAgB,cAAc;AAE9B,MAAa,mBAAmB,MAC7B,EAAE,UAAU,GAAG,WAAW;CACzB,MAAM,iBAAiB,mBAAmB,YAAY,GAAG;CACzD,MAAM,aAAa,uBAAuB;CAC1C,MAAM,oBAAoB,0BAA0B;CACpD,MAAM,oBAAoB,0BAA0B;CACpD,MAAM,cAAc,OAAO;CAC3B,MAAM,SAAS,cACP,wBAAwB,OAAO,mBAAmB,WAAW,iBAAiB,GAAG,EACvF,CAAC,eAAe,CACjB;AAED,QACE,oBAAC;EAAI,WAAW,OAAO;YACpB,OAAO,KAAK,OAAO,UAClB,8BAAC;GACC,GAAI;GACQ;GACZ,KAAK,GAAG,YAAY,SAAS;GAC7B,eAAe;GACf,eAAe;KAEd,MACe,CAClB;GACE;IAGT,WAAW,cAAc,UAAU,aAAa,UAAU,SAC5D;AACD,iBAAiB,cAAc;AAE/B,+BAAe"}

package/es/Markdown/SyntaxMarkdown/style.mjs

@@ -1,4 +1,4 @@
-import { createStyles, keyframes } from "antd-style";
+import { createStaticStyles, keyframes } from "antd-style";
 
 //#region src/Markdown/SyntaxMarkdown/style.ts
 const fadeIn = keyframes`
@@ -9,7 +9,7 @@ const fadeIn = keyframes`
       opacity: 1;
     }
   `;
-const useStyles = createStyles(({ css: css$1 }) => {
+const styles = createStaticStyles(({ css: css$1 }) => {
 	return { animated: css$1`
       .animate-fade-in,
       .katex-html span,
@@ -22,5 +22,5 @@ const useStyles = createStyles(({ css: css$1 }) => {
 });
 
 //#endregion
-export { useStyles };
+export { styles };
 //# sourceMappingURL=style.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/style.ts"],"sourcesContent":["import { createStyles, keyframes } from 'antd-style';\n\nconst fadeIn = keyframes`\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  `;\n\nexport const useStyles = createStyles(({ css }) => {\n  return {\n    animated: css`\n      .animate-fade-in,\n      .katex-html span,\n      span.line > span,\n      code:not(:has(span.line)) {\n        opacity: 1;\n        animation: ${fadeIn} 1s ease-in-out;\n      }\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAM,SAAS,SAAS;;;;;;;;AASxB,MAAa,YAAY,cAAc,EAAE,iBAAU;AACjD,QAAO,EACL,UAAU,KAAG;;;;;;qBAMI,OAAO;;OAGzB;EACD"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/style.ts"],"sourcesContent":["import { createStaticStyles, keyframes } from 'antd-style';\n\nconst fadeIn = keyframes`\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  `;\n\nexport const styles = createStaticStyles(({ css }) => {\n  return {\n    animated: css`\n      .animate-fade-in,\n      .katex-html span,\n      span.line > span,\n      code:not(:has(span.line)) {\n        opacity: 1;\n        animation: ${fadeIn} 1s ease-in-out;\n      }\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAM,SAAS,SAAS;;;;;;;;AASxB,MAAa,SAAS,oBAAoB,EAAE,iBAAU;AACpD,QAAO,EACL,UAAU,KAAG;;;;;;qBAMI,OAAO;;OAGzB;EACD"}

package/es/Markdown/Typography.d.mts

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

package/es/Markdown/Typography.mjs

@@ -1,12 +1,12 @@
 'use client';
 
-import { useStyles } from "./markdown.style.mjs";
+import { styles } from "./markdown.style.mjs";
 import { memo } from "react";
 import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
 
 //#region src/Markdown/Typography.tsx
 const Typography = memo(({ ref, children, className, fontSize = 16, headerMultiple = 1, marginMultiple = 2, lineHeight = 1.8, borderRadius = 8, style, ...rest }) => {
-	const { cx, styles } = useStyles();
 	return /* @__PURE__ */ jsx("article", {
 		className: cx(styles.root, className),
 		ref,

package/es/Markdown/Typography.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Typography.mjs","names":[],"sources":["../../src/Markdown/Typography.tsx"],"sourcesContent":["'use client';\n\nimport { memo } from 'react';\n\nimport { useStyles } from './markdown.style';\nimport type { TypographyProps } from './type';\n\nconst Typography = memo<TypographyProps>(\n  ({\n    ref,\n    children,\n    className,\n    fontSize = 16,\n    headerMultiple = 1,\n    marginMultiple = 2,\n    lineHeight = 1.8,\n    borderRadius = 8,\n    style,\n    ...rest\n  }) => {\n    const { cx, styles } = useStyles();\n\n    return (\n      <article\n        className={cx(styles.root, className)}\n        ref={ref}\n        style={{\n          // @ts-ignore\n          '--lobe-markdown-border-radius': borderRadius,\n          '--lobe-markdown-font-size': `${fontSize}px`,\n          '--lobe-markdown-header-multiple': headerMultiple,\n          '--lobe-markdown-line-height': lineHeight,\n          '--lobe-markdown-margin-multiple': marginMultiple,\n          ...style,\n        }}\n        {...rest}\n      >\n        {children}\n      </article>\n    );\n  },\n);\n\nTypography.displayName = 'Typography';\n\nexport default Typography;\n"],"mappings":";;;;;;;AAOA,MAAM,aAAa,MAChB,EACC,KACA,UACA,WACA,WAAW,IACX,iBAAiB,GACjB,iBAAiB,GACjB,aAAa,KACb,eAAe,GACf,OACA,GAAG,WACC;CACJ,MAAM,EAAE,IAAI,WAAW,WAAW;AAElC,QACE,oBAAC;EACC,WAAW,GAAG,OAAO,MAAM,UAAU;EAChC;EACL,OAAO;GAEL,iCAAiC;GACjC,6BAA6B,GAAG,SAAS;GACzC,mCAAmC;GACnC,+BAA+B;GAC/B,mCAAmC;GACnC,GAAG;GACJ;EACD,GAAI;EAEH;GACO;EAGf;AAED,WAAW,cAAc;AAEzB,yBAAe"}
+{"version":3,"file":"Typography.mjs","names":[],"sources":["../../src/Markdown/Typography.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo } from 'react';\n\nimport { styles } from './markdown.style';\nimport type { TypographyProps } from './type';\n\nconst Typography = memo<TypographyProps>(\n  ({\n    ref,\n    children,\n    className,\n    fontSize = 16,\n    headerMultiple = 1,\n    marginMultiple = 2,\n    lineHeight = 1.8,\n    borderRadius = 8,\n    style,\n    ...rest\n  }) => {\n    return (\n      <article\n        className={cx(styles.root, className)}\n        ref={ref}\n        style={{\n          // @ts-ignore\n          '--lobe-markdown-border-radius': borderRadius,\n          '--lobe-markdown-font-size': `${fontSize}px`,\n          '--lobe-markdown-header-multiple': headerMultiple,\n          '--lobe-markdown-line-height': lineHeight,\n          '--lobe-markdown-margin-multiple': marginMultiple,\n          ...style,\n        }}\n        {...rest}\n      >\n        {children}\n      </article>\n    );\n  },\n);\n\nTypography.displayName = 'Typography';\n\nexport default Typography;\n"],"mappings":";;;;;;;;AAQA,MAAM,aAAa,MAChB,EACC,KACA,UACA,WACA,WAAW,IACX,iBAAiB,GACjB,iBAAiB,GACjB,aAAa,KACb,eAAe,GACf,OACA,GAAG,WACC;AACJ,QACE,oBAAC;EACC,WAAW,GAAG,OAAO,MAAM,UAAU;EAChC;EACL,OAAO;GAEL,iCAAiC;GACjC,6BAA6B,GAAG,SAAS;GACzC,mCAAmC;GACnC,+BAA+B;GAC/B,mCAAmC;GACnC,GAAG;GACJ;EACD,GAAI;EAEH;GACO;EAGf;AAED,WAAW,cAAc;AAEzB,yBAAe"}

package/es/Markdown/components/CodeBlock.mjs

@@ -24,6 +24,7 @@ const CodeBlock = memo(({ fullFeatured, enableMermaid, highlight, mermaid, child
 	const code = useCode(children);
 	if (!code) return;
 	if (enableMermaid && code.lang === "mermaid") return /* @__PURE__ */ jsx(PreMermaid, {
+		animated,
 		fullFeatured,
 		...mermaid,
 		...rest,

package/es/Markdown/components/CodeBlock.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.mjs","names":["Pre"],"sources":["../../../src/Markdown/components/CodeBlock.tsx"],"sourcesContent":["import { memo } from 'react';\n\nimport { type HighlighterProps } from '@/Highlighter';\nimport { FALLBACK_LANG } from '@/Highlighter/const';\nimport { type MermaidProps } from '@/Mermaid';\nimport Pre, { PreMermaid, PreSingleLine } from '@/mdx/mdxComponents/Pre';\n\nconst countLines = (str: string): number => {\n  const regex = /\\n/g;\n  const matches = str.match(regex);\n  return matches ? matches.length : 1;\n};\n\nexport const useCode = (raw: any) => {\n  if (!raw) return;\n\n  const { children, className } = raw.props;\n\n  if (!children) return;\n\n  const content = Array.isArray(children) ? (children[0] as string) : children;\n\n  const lang = className?.replace('language-', '') || FALLBACK_LANG;\n\n  const isSingleLine = countLines(content) <= 1 && content.length <= 32;\n\n  return {\n    content,\n    isSingleLine,\n    lang,\n  };\n};\n\ninterface CodeBlockProps {\n  animated?: boolean;\n  children: any;\n  enableMermaid?: boolean;\n  fullFeatured?: boolean;\n  highlight?: HighlighterProps;\n  mermaid?: MermaidProps;\n}\n\nexport const CodeBlock = memo<CodeBlockProps>(\n  ({ fullFeatured, enableMermaid, highlight, mermaid, children, animated, ...rest }) => {\n    const code = useCode(children);\n\n    if (!code) return;\n\n    if (enableMermaid && code.lang === 'mermaid')\n      return (\n        <PreMermaid fullFeatured={fullFeatured} {...mermaid} {...rest}>\n          {code.content}\n        </PreMermaid>\n      );\n\n    if (!highlight && code.isSingleLine)\n      return <PreSingleLine language={code.lang}>{code.content}</PreSingleLine>;\n\n    return (\n      <Pre\n        animated={animated}\n        fullFeatured={fullFeatured}\n        language={code.lang}\n        {...highlight}\n        {...rest}\n      >\n        {code.content}\n      </Pre>\n    );\n  },\n  (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n"],"mappings":";;;;;;AAOA,MAAM,cAAc,QAAwB;CAE1C,MAAM,UAAU,IAAI,MADN,MACkB;AAChC,QAAO,UAAU,QAAQ,SAAS;;AAGpC,MAAa,WAAW,QAAa;AACnC,KAAI,CAAC,IAAK;CAEV,MAAM,EAAE,UAAU,cAAc,IAAI;AAEpC,KAAI,CAAC,SAAU;CAEf,MAAM,UAAU,MAAM,QAAQ,SAAS,GAAI,SAAS,KAAgB;CAEpE,MAAM,OAAO,WAAW,QAAQ,aAAa,GAAG,IAAI;AAIpD,QAAO;EACL;EACA,cAJmB,WAAW,QAAQ,IAAI,KAAK,QAAQ,UAAU;EAKjE;EACD;;AAYH,MAAa,YAAY,MACtB,EAAE,cAAc,eAAe,WAAW,SAAS,UAAU,UAAU,GAAG,WAAW;CACpF,MAAM,OAAO,QAAQ,SAAS;AAE9B,KAAI,CAAC,KAAM;AAEX,KAAI,iBAAiB,KAAK,SAAS,UACjC,QACE,oBAAC;EAAyB;EAAc,GAAI;EAAS,GAAI;YACtD,KAAK;GACK;AAGjB,KAAI,CAAC,aAAa,KAAK,aACrB,QAAO,oBAAC;EAAc,UAAU,KAAK;YAAO,KAAK;GAAwB;AAE3E,QACE,oBAACA;EACW;EACI;EACd,UAAU,KAAK;EACf,GAAI;EACJ,GAAI;YAEH,KAAK;GACF;IAGT,WAAW,cAAc,UAAU,aAAa,UAAU,SAC5D"}
+{"version":3,"file":"CodeBlock.mjs","names":["Pre"],"sources":["../../../src/Markdown/components/CodeBlock.tsx"],"sourcesContent":["import { memo } from 'react';\n\nimport { type HighlighterProps } from '@/Highlighter';\nimport { FALLBACK_LANG } from '@/Highlighter/const';\nimport { type MermaidProps } from '@/Mermaid';\nimport Pre, { PreMermaid, PreSingleLine } from '@/mdx/mdxComponents/Pre';\n\nconst countLines = (str: string): number => {\n  const regex = /\\n/g;\n  const matches = str.match(regex);\n  return matches ? matches.length : 1;\n};\n\nexport const useCode = (raw: any) => {\n  if (!raw) return;\n\n  const { children, className } = raw.props;\n\n  if (!children) return;\n\n  const content = Array.isArray(children) ? (children[0] as string) : children;\n\n  const lang = className?.replace('language-', '') || FALLBACK_LANG;\n\n  const isSingleLine = countLines(content) <= 1 && content.length <= 32;\n\n  return {\n    content,\n    isSingleLine,\n    lang,\n  };\n};\n\ninterface CodeBlockProps {\n  animated?: boolean;\n  children: any;\n  enableMermaid?: boolean;\n  fullFeatured?: boolean;\n  highlight?: HighlighterProps;\n  mermaid?: MermaidProps;\n}\n\nexport const CodeBlock = memo<CodeBlockProps>(\n  ({ fullFeatured, enableMermaid, highlight, mermaid, children, animated, ...rest }) => {\n    const code = useCode(children);\n\n    if (!code) return;\n\n    if (enableMermaid && code.lang === 'mermaid')\n      return (\n        <PreMermaid animated={animated} fullFeatured={fullFeatured} {...mermaid} {...rest}>\n          {code.content}\n        </PreMermaid>\n      );\n\n    if (!highlight && code.isSingleLine)\n      return <PreSingleLine language={code.lang}>{code.content}</PreSingleLine>;\n\n    return (\n      <Pre\n        animated={animated}\n        fullFeatured={fullFeatured}\n        language={code.lang}\n        {...highlight}\n        {...rest}\n      >\n        {code.content}\n      </Pre>\n    );\n  },\n  (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n"],"mappings":";;;;;;AAOA,MAAM,cAAc,QAAwB;CAE1C,MAAM,UAAU,IAAI,MADN,MACkB;AAChC,QAAO,UAAU,QAAQ,SAAS;;AAGpC,MAAa,WAAW,QAAa;AACnC,KAAI,CAAC,IAAK;CAEV,MAAM,EAAE,UAAU,cAAc,IAAI;AAEpC,KAAI,CAAC,SAAU;CAEf,MAAM,UAAU,MAAM,QAAQ,SAAS,GAAI,SAAS,KAAgB;CAEpE,MAAM,OAAO,WAAW,QAAQ,aAAa,GAAG,IAAI;AAIpD,QAAO;EACL;EACA,cAJmB,WAAW,QAAQ,IAAI,KAAK,QAAQ,UAAU;EAKjE;EACD;;AAYH,MAAa,YAAY,MACtB,EAAE,cAAc,eAAe,WAAW,SAAS,UAAU,UAAU,GAAG,WAAW;CACpF,MAAM,OAAO,QAAQ,SAAS;AAE9B,KAAI,CAAC,KAAM;AAEX,KAAI,iBAAiB,KAAK,SAAS,UACjC,QACE,oBAAC;EAAqB;EAAwB;EAAc,GAAI;EAAS,GAAI;YAC1E,KAAK;GACK;AAGjB,KAAI,CAAC,aAAa,KAAK,aACrB,QAAO,oBAAC;EAAc,UAAU,KAAK;YAAO,KAAK;GAAwB;AAE3E,QACE,oBAACA;EACW;EACI;EACd,UAAU,KAAK;EACf,GAAI;EACJ,GAAI;YAEH,KAAK;GACF;IAGT,WAAW,cAAc,UAAU,aAAa,UAAU,SAC5D"}

package/es/Markdown/components/SearchResultCards/SearchResultCard.mjs

@@ -5,13 +5,12 @@ import FlexBasic_default from "../../../Flex/FlexBasic.mjs";
 import Block_default from "../../../Block/Block.mjs";
 import Text_default from "../../../Text/Text.mjs";
 import Img_default from "../../../Img/index.mjs";
-import { useStyles } from "./style.mjs";
+import { styles } from "./style.mjs";
 import { memo, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/Markdown/components/SearchResultCards/SearchResultCard.tsx
 const SearchResultCard = memo(({ ref, url, title, alt, ...rest }) => {
-	const { styles } = useStyles();
 	const [displayTitle, domain, host] = useMemo(() => {
 		try {
 			const urlObj = new URL(url);

package/es/Markdown/components/SearchResultCards/SearchResultCard.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SearchResultCard.mjs","names":["domain","displayTitle","A","Block","Text","Flexbox","Img"],"sources":["../../../../src/Markdown/components/SearchResultCards/SearchResultCard.tsx"],"sourcesContent":["'use client';\n\nimport { Ref, memo, useMemo } from 'react';\n\nimport A from '@/A';\nimport Block from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport Img from '@/Img';\nimport Text from '@/Text';\nimport { AProps } from '@/types';\n\nimport { useStyles } from './style';\n\nexport interface SearchResultCardProps extends AProps {\n  alt?: string;\n  ref?: Ref<HTMLAnchorElement>;\n  title?: string;\n  url: string;\n}\n\nconst SearchResultCard = memo<SearchResultCardProps>(({ ref, url, title, alt, ...rest }) => {\n  const { styles } = useStyles();\n\n  const [displayTitle, domain, host] = useMemo(() => {\n    try {\n      const urlObj = new URL(url);\n      const domain = urlObj.hostname.replace('www.', '');\n      const hostForUrl = urlObj.host;\n\n      let displayTitle = title;\n      if (title === url) {\n        displayTitle = hostForUrl + urlObj.pathname;\n      }\n\n      return [displayTitle, domain, hostForUrl];\n    } catch {\n      return [title, url, url];\n    }\n  }, [url, title]);\n\n  return (\n    <A href={url} ref={ref} rel=\"noreferrer\" target={'_blank'} {...rest}>\n      <Block\n        className={styles.container}\n        clickable\n        gap={2}\n        justify={'space-between'}\n        key={url}\n        paddingBlock={6}\n        paddingInline={8}\n        variant={'outlined'}\n      >\n        <Text ellipsis={{ rows: 2 }}>{displayTitle}</Text>\n        <Flexbox align={'center'} gap={4} horizontal>\n          <Img\n            alt={alt || title || url}\n            height={14}\n            src={`https://icons.duckduckgo.com/ip3/${host}.ico`}\n            width={14}\n          />\n          <Text className={styles.url} ellipsis type={'secondary'}>\n            {domain}\n          </Text>\n        </Flexbox>\n      </Block>\n    </A>\n  );\n});\n\nSearchResultCard.displayName = 'SearchResultCard';\n\nexport default SearchResultCard;\n"],"mappings":";;;;;;;;;;;;AAoBA,MAAM,mBAAmB,MAA6B,EAAE,KAAK,KAAK,OAAO,KAAK,GAAG,WAAW;CAC1F,MAAM,EAAE,WAAW,WAAW;CAE9B,MAAM,CAAC,cAAc,QAAQ,QAAQ,cAAc;AACjD,MAAI;GACF,MAAM,SAAS,IAAI,IAAI,IAAI;GAC3B,MAAMA,WAAS,OAAO,SAAS,QAAQ,QAAQ,GAAG;GAClD,MAAM,aAAa,OAAO;GAE1B,IAAIC,iBAAe;AACnB,OAAI,UAAU,IACZ,kBAAe,aAAa,OAAO;AAGrC,UAAO;IAACA;IAAcD;IAAQ;IAAW;UACnC;AACN,UAAO;IAAC;IAAO;IAAK;IAAI;;IAEzB,CAAC,KAAK,MAAM,CAAC;AAEhB,QACE,oBAACE;EAAE,MAAM;EAAU;EAAK,KAAI;EAAa,QAAQ;EAAU,GAAI;YAC7D,qBAACC;GACC,WAAW,OAAO;GAClB;GACA,KAAK;GACL,SAAS;GAET,cAAc;GACd,eAAe;GACf,SAAS;cAET,oBAACC;IAAK,UAAU,EAAE,MAAM,GAAG;cAAG;KAAoB,EAClD,qBAACC;IAAQ,OAAO;IAAU,KAAK;IAAG;eAChC,oBAACC;KACC,KAAK,OAAO,SAAS;KACrB,QAAQ;KACR,KAAK,oCAAoC,KAAK;KAC9C,OAAO;MACP,EACF,oBAACF;KAAK,WAAW,OAAO;KAAK;KAAS,MAAM;eACzC;MACI;KACC;KAhBL,IAiBC;GACN;EAEN;AAEF,iBAAiB,cAAc;AAE/B,+BAAe"}
+{"version":3,"file":"SearchResultCard.mjs","names":["domain","displayTitle","A","Block","Text","Flexbox","Img"],"sources":["../../../../src/Markdown/components/SearchResultCards/SearchResultCard.tsx"],"sourcesContent":["'use client';\n\nimport { Ref, memo, useMemo } from 'react';\n\nimport A from '@/A';\nimport Block from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport Img from '@/Img';\nimport Text from '@/Text';\nimport { AProps } from '@/types';\n\nimport { styles } from './style';\n\nexport interface SearchResultCardProps extends AProps {\n  alt?: string;\n  ref?: Ref<HTMLAnchorElement>;\n  title?: string;\n  url: string;\n}\n\nconst SearchResultCard = memo<SearchResultCardProps>(({ ref, url, title, alt, ...rest }) => {\n  const [displayTitle, domain, host] = useMemo(() => {\n    try {\n      const urlObj = new URL(url);\n      const domain = urlObj.hostname.replace('www.', '');\n      const hostForUrl = urlObj.host;\n\n      let displayTitle = title;\n      if (title === url) {\n        displayTitle = hostForUrl + urlObj.pathname;\n      }\n\n      return [displayTitle, domain, hostForUrl];\n    } catch {\n      return [title, url, url];\n    }\n  }, [url, title]);\n\n  return (\n    <A href={url} ref={ref} rel=\"noreferrer\" target={'_blank'} {...rest}>\n      <Block\n        className={styles.container}\n        clickable\n        gap={2}\n        justify={'space-between'}\n        key={url}\n        paddingBlock={6}\n        paddingInline={8}\n        variant={'outlined'}\n      >\n        <Text ellipsis={{ rows: 2 }}>{displayTitle}</Text>\n        <Flexbox align={'center'} gap={4} horizontal>\n          <Img\n            alt={alt || title || url}\n            height={14}\n            src={`https://icons.duckduckgo.com/ip3/${host}.ico`}\n            width={14}\n          />\n          <Text className={styles.url} ellipsis type={'secondary'}>\n            {domain}\n          </Text>\n        </Flexbox>\n      </Block>\n    </A>\n  );\n});\n\nSearchResultCard.displayName = 'SearchResultCard';\n\nexport default SearchResultCard;\n"],"mappings":";;;;;;;;;;;;AAoBA,MAAM,mBAAmB,MAA6B,EAAE,KAAK,KAAK,OAAO,KAAK,GAAG,WAAW;CAC1F,MAAM,CAAC,cAAc,QAAQ,QAAQ,cAAc;AACjD,MAAI;GACF,MAAM,SAAS,IAAI,IAAI,IAAI;GAC3B,MAAMA,WAAS,OAAO,SAAS,QAAQ,QAAQ,GAAG;GAClD,MAAM,aAAa,OAAO;GAE1B,IAAIC,iBAAe;AACnB,OAAI,UAAU,IACZ,kBAAe,aAAa,OAAO;AAGrC,UAAO;IAACA;IAAcD;IAAQ;IAAW;UACnC;AACN,UAAO;IAAC;IAAO;IAAK;IAAI;;IAEzB,CAAC,KAAK,MAAM,CAAC;AAEhB,QACE,oBAACE;EAAE,MAAM;EAAU;EAAK,KAAI;EAAa,QAAQ;EAAU,GAAI;YAC7D,qBAACC;GACC,WAAW,OAAO;GAClB;GACA,KAAK;GACL,SAAS;GAET,cAAc;GACd,eAAe;GACf,SAAS;cAET,oBAACC;IAAK,UAAU,EAAE,MAAM,GAAG;cAAG;KAAoB,EAClD,qBAACC;IAAQ,OAAO;IAAU,KAAK;IAAG;eAChC,oBAACC;KACC,KAAK,OAAO,SAAS;KACrB,QAAQ;KACR,KAAK,oCAAoC,KAAK;KAC9C,OAAO;MACP,EACF,oBAACF;KAAK,WAAW,OAAO;KAAK;KAAS,MAAM;eACzC;MACI;KACC;KAhBL,IAiBC;GACN;EAEN;AAEF,iBAAiB,cAAc;AAE/B,+BAAe"}

package/es/Markdown/components/SearchResultCards/index.d.mts

@@ -1,6 +1,6 @@
 import { FlexboxProps } from "../../../Flex/type.mjs";
 import "../../../Flex/index.mjs";
-import * as react67 from "react";
+import * as react58 from "react";
 import { Ref } from "react";
 
 //#region src/Markdown/components/SearchResultCards/index.d.ts
@@ -14,7 +14,7 @@ interface SearchResultCardsProps extends FlexboxProps {
   dataSource: string[] | SearchResultItem[];
   ref?: Ref<HTMLDivElement>;
 }
-declare const SearchResultCards: react67.NamedExoticComponent<SearchResultCardsProps>;
+declare const SearchResultCards: react58.NamedExoticComponent<SearchResultCardsProps>;
 //#endregion
 export { SearchResultCards, SearchResultCardsProps };
 //# sourceMappingURL=index.d.mts.map

package/es/Markdown/components/SearchResultCards/style.mjs

@@ -1,7 +1,7 @@
-import { createStyles } from "antd-style";
+import { createStaticStyles } from "antd-style";
 
 //#region src/Markdown/components/SearchResultCards/style.ts
-const useStyles = createStyles(({ css: css$1 }) => ({
+const styles = createStaticStyles(({ css: css$1 }) => ({
 	container: css$1`
     min-width: 160px;
     max-width: 160px;
@@ -21,5 +21,5 @@ const useStyles = createStyles(({ css: css$1 }) => ({
 }));
 
 //#endregion
-export { useStyles };
+export { styles };
 //# sourceMappingURL=style.mjs.map

package/es/Markdown/components/SearchResultCards/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../../src/Markdown/components/SearchResultCards/style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\n\nexport const useStyles = createStyles(({ css }) => ({\n  container: css`\n    min-width: 160px;\n    max-width: 160px;\n    height: 100%;\n\n    font-size: 12px;\n    color: initial;\n  `,\n  url: css`\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 1;\n\n    text-overflow: ellipsis;\n  `,\n}));\n"],"mappings":";;;AAEA,MAAa,YAAY,cAAc,EAAE,kBAAW;CAClD,WAAW,KAAG;;;;;;;;CAQd,KAAK,KAAG;;;;;;;;CAQT,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../../src/Markdown/components/SearchResultCards/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css }) => ({\n  container: css`\n    min-width: 160px;\n    max-width: 160px;\n    height: 100%;\n\n    font-size: 12px;\n    color: initial;\n  `,\n  url: css`\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 1;\n\n    text-overflow: ellipsis;\n  `,\n}));\n"],"mappings":";;;AAEA,MAAa,SAAS,oBAAoB,EAAE,kBAAW;CACrD,WAAW,KAAG;;;;;;;;CAQd,KAAK,KAAG;;;;;;;;CAQT,EAAE"}

package/es/Markdown/markdown.style.mjs

@@ -1,15 +1,15 @@
-import { createStyles } from "antd-style";
+import { createStaticStyles } from "antd-style";
 
 //#region src/Markdown/markdown.style.ts
 const IGNORE_CLASSNAME = ".ignore-markdown-style";
-const useStyles = createStyles(({ token, css: css$1 }) => {
+const styles = createStaticStyles(({ cssVar: cssVar$1, css: css$1 }) => {
 	const __root = css$1`
     --lobe-markdown-font-size: 16px;
     --lobe-markdown-header-multiple: 1;
     --lobe-markdown-margin-multiple: 2;
     --lobe-markdown-line-height: 1.8;
-    --lobe-markdown-border-radius: ${token.borderRadiusLG};
-    --lobe-markdown-border-color: ${token.colorFillQuaternary};
+    --lobe-markdown-border-radius: ${cssVar$1.borderRadiusLG};
+    --lobe-markdown-border-color: ${cssVar$1.colorFillQuaternary};
 
     position: relative;
 
@@ -23,10 +23,10 @@ const useStyles = createStyles(({ token, css: css$1 }) => {
   `;
 	const a = css$1`
     a {
-      color: ${token.colorInfoText};
+      color: ${cssVar$1.colorInfoText};
 
       &:hover {
-        color: ${token.colorInfoHover};
+        color: ${cssVar$1.colorInfoHover};
       }
     }
   `;
@@ -36,9 +36,9 @@ const useStyles = createStyles(({ token, css: css$1 }) => {
       margin-inline: 0;
       padding-block: 0;
       padding-inline: 1em;
-      border-inline-start: solid 4px ${token.colorBorder};
+      border-inline-start: solid 4px ${cssVar$1.colorBorder};
 
-      color: ${token.colorTextSecondary};
+      color: ${cssVar$1.colorTextSecondary};
     }
   `;
 	const code = css$1`
@@ -52,19 +52,19 @@ const useStyles = createStyles(({ token, css: css$1 }) => {
         border: 1px solid var(--lobe-markdown-border-color);
         border-radius: 0.25em;
 
-        font-family: ${token.fontFamilyCode};
+        font-family: ${cssVar$1.fontFamilyCode};
         font-size: 0.875em;
         line-height: 1;
         word-break: break-word;
         white-space: break-spaces;
 
-        background: ${token.colorFillSecondary};
+        background: ${cssVar$1.colorFillSecondary};
       }
     }
   `;
 	const del = css$1`
     del {
-      color: ${token.colorTextDescription};
+      color: ${cssVar$1.colorTextDescription};
       text-decoration: line-through;
     }
   `;
@@ -75,7 +75,7 @@ const useStyles = createStyles(({ token, css: css$1 }) => {
       padding-inline: 1em;
       border-radius: calc(var(--lobe-markdown-border-radius) * 1px);
 
-      background: ${token.colorFillTertiary};
+      background: ${cssVar$1.colorFillTertiary};
       box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);
 
       summary {
@@ -95,19 +95,19 @@ const useStyles = createStyles(({ token, css: css$1 }) => {
 
           width: 0.4em;
           height: 0.4em;
-          border-block-end: 1.5px solid ${token.colorTextSecondary};
-          border-inline-end: 1.5px solid ${token.colorTextSecondary};
+          border-block-end: 1.5px solid ${cssVar$1.colorTextSecondary};
+          border-inline-end: 1.5px solid ${cssVar$1.colorTextSecondary};
 
-          font-family: ${token.fontFamily};
+          font-family: ${cssVar$1.fontFamily};
 
-          transition: transform 200ms ${token.motionEaseOut};
+          transition: transform 200ms ${cssVar$1.motionEaseOut};
         }
       }
 
       &[open] {
         summary {
           padding-block-end: 0.75em;
-          border-block-end: 1px dashed ${token.colorBorder};
+          border-block-end: 1px dashed ${cssVar$1.colorBorder};
 
           &::before {
             transform: rotateZ(45deg);
@@ -162,7 +162,7 @@ const useStyles = createStyles(({ token, css: css$1 }) => {
     hr {
       width: 100%;
       margin-block: calc(var(--lobe-markdown-margin-multiple) * 1.5em);
-      border-color: ${token.colorBorder};
+      border-color: ${cssVar$1.colorBorder};
       border-style: dashed;
       border-width: 1px;
       border-block-start: none;
@@ -296,19 +296,19 @@ const useStyles = createStyles(({ token, css: css$1 }) => {
       word-break: auto-phrase;
       overflow-wrap: break-word;
 
-      background: ${token.colorFillQuaternary};
-      box-shadow: 0 0 0 1px ${token.colorBorderSecondary};
+      background: ${cssVar$1.colorFillQuaternary};
+      box-shadow: 0 0 0 1px ${cssVar$1.colorBorderSecondary};
 
       code {
         word-break: break-word;
       }
 
       thead {
-        background: ${token.colorFillQuaternary};
+        background: ${cssVar$1.colorFillQuaternary};
       }
 
       tr {
-        box-shadow: 0 1px 0 ${token.colorBorderSecondary};
+        box-shadow: 0 1px 0 ${cssVar$1.colorBorderSecondary};
       }
 
       th,
@@ -395,5 +395,5 @@ const useStyles = createStyles(({ token, css: css$1 }) => {
 });
 
 //#endregion
-export { useStyles };
+export { styles };
 //# sourceMappingURL=markdown.style.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"markdown.style.mjs","names":[],"sources":["../../src/Markdown/markdown.style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\n\nconst IGNORE_CLASSNAME = '.ignore-markdown-style';\n\nexport const useStyles = createStyles(({ token, css }) => {\n  const __root = css`\n    --lobe-markdown-font-size: 16px;\n    --lobe-markdown-header-multiple: 1;\n    --lobe-markdown-margin-multiple: 2;\n    --lobe-markdown-line-height: 1.8;\n    --lobe-markdown-border-radius: ${token.borderRadiusLG};\n    --lobe-markdown-border-color: ${token.colorFillQuaternary};\n\n    position: relative;\n\n    width: 100%;\n    max-width: 100%;\n    padding-inline: 1px;\n\n    font-size: var(--lobe-markdown-font-size);\n    line-height: var(--lobe-markdown-line-height);\n    word-break: break-word;\n  `;\n  const a = css`\n    a {\n      color: ${token.colorInfoText};\n\n      &:hover {\n        color: ${token.colorInfoHover};\n      }\n    }\n  `;\n\n  const blockquote = css`\n    blockquote {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      margin-inline: 0;\n      padding-block: 0;\n      padding-inline: 1em;\n      border-inline-start: solid 4px ${token.colorBorder};\n\n      color: ${token.colorTextSecondary};\n    }\n  `;\n\n  const code = css`\n    code {\n      &:not(:has(span)) {\n        display: inline;\n\n        margin-inline: 0.25em;\n        padding-block: 0.2em;\n        padding-inline: 0.4em;\n        border: 1px solid var(--lobe-markdown-border-color);\n        border-radius: 0.25em;\n\n        font-family: ${token.fontFamilyCode};\n        font-size: 0.875em;\n        line-height: 1;\n        word-break: break-word;\n        white-space: break-spaces;\n\n        background: ${token.colorFillSecondary};\n      }\n    }\n  `;\n\n  const del = css`\n    del {\n      color: ${token.colorTextDescription};\n      text-decoration: line-through;\n    }\n  `;\n\n  const details = css`\n    details {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      padding-block: 0.75em;\n      padding-inline: 1em;\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n\n      background: ${token.colorFillTertiary};\n      box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n\n      summary {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        list-style: none;\n\n        &::before {\n          content: '';\n\n          position: absolute;\n          inset-inline-end: 1.25em;\n          transform: rotateZ(-45deg);\n\n          display: block;\n\n          width: 0.4em;\n          height: 0.4em;\n          border-block-end: 1.5px solid ${token.colorTextSecondary};\n          border-inline-end: 1.5px solid ${token.colorTextSecondary};\n\n          font-family: ${token.fontFamily};\n\n          transition: transform 200ms ${token.motionEaseOut};\n        }\n      }\n\n      &[open] {\n        summary {\n          padding-block-end: 0.75em;\n          border-block-end: 1px dashed ${token.colorBorder};\n\n          &::before {\n            transform: rotateZ(45deg);\n          }\n        }\n      }\n    }\n  `;\n  const header = css`\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n      margin-block: max(\n        calc(var(--lobe-markdown-header-multiple) * var(--lobe-markdown-margin-multiple) * 0.4em),\n        var(--lobe-markdown-font-size)\n      );\n      font-weight: bold;\n      line-height: 1.25;\n    }\n\n    h1 {\n      font-size: calc(\n        var(--lobe-markdown-font-size) * (1 + 1.5 * var(--lobe-markdown-header-multiple))\n      );\n    }\n\n    h2 {\n      font-size: calc(var(--lobe-markdown-font-size) * (1 + var(--lobe-markdown-header-multiple)));\n    }\n\n    h3 {\n      font-size: calc(\n        var(--lobe-markdown-font-size) * (1 + 0.5 * var(--lobe-markdown-header-multiple))\n      );\n    }\n\n    h4 {\n      font-size: calc(\n        var(--lobe-markdown-font-size) * (1 + 0.25 * var(--lobe-markdown-header-multiple))\n      );\n    }\n\n    h5,\n    h6 {\n      font-size: calc(var(--lobe-markdown-font-size) * 1);\n    }\n  `;\n  const hr = css`\n    hr {\n      width: 100%;\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1.5em);\n      border-color: ${token.colorBorder};\n      border-style: dashed;\n      border-width: 1px;\n      border-block-start: none;\n      border-inline-start: none;\n      border-inline-end: none;\n    }\n  `;\n  const img = css`\n    img {\n      max-width: 100%;\n    }\n\n    > img,\n    > p > img {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n      box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n    }\n  `;\n\n  const list = css`\n    li {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.33em);\n\n      p:first-child {\n        display: inline;\n      }\n    }\n\n    ul,\n    ol {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      margin-inline-start: 1em;\n      padding-inline-start: 0;\n      list-style-position: outside;\n\n      > ul,\n      > ol {\n        margin-block: 0;\n      }\n\n      > li {\n        margin-inline-start: 1em;\n      }\n    }\n\n    ol {\n      list-style: auto;\n    }\n\n    ul {\n      list-style-type: none;\n\n      > li {\n        &::before {\n          content: '-';\n\n          position: absolute;\n\n          display: inline-block;\n\n          margin-inline: -1em 0.5em;\n\n          opacity: 0.5;\n        }\n      }\n    }\n\n    .task-list-item {\n      &::before {\n        display: none !important;\n      }\n\n      input[type='checkbox'] {\n        margin-block: 0 0.25em;\n        margin-inline: -1.6em 0.2em;\n        vertical-align: middle;\n      }\n\n      input[type='checkbox']:dir(rtl) {\n        margin: 0 -1.6em 0.25em 0.2em;\n      }\n    }\n  `;\n  const p = css`\n    p {\n      margin-block: 4px;\n      line-height: var(--lobe-markdown-line-height);\n      letter-spacing: 0.02em;\n\n      &:not(:first-child) {\n        margin-block-start: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      }\n\n      &:not(:last-child) {\n        margin-block-end: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      }\n    }\n  `;\n  const pre = css`\n    pre {\n      font-size: calc(var(--lobe-markdown-font-size) * 0.85);\n    }\n  `;\n  const strong = css`\n    strong {\n      font-weight: 600;\n    }\n  `;\n  const svg = css`\n    svg {\n      line-height: 1;\n    }\n  `;\n  const table = css`\n    table {\n      unicode-bidi: isolate;\n      overflow: auto hidden;\n      display: block;\n      border-spacing: 0;\n      border-collapse: collapse;\n\n      box-sizing: border-box;\n      width: max-content;\n      max-width: 100%;\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n\n      text-align: start;\n      text-indent: initial;\n      text-wrap: pretty;\n      word-break: auto-phrase;\n      overflow-wrap: break-word;\n\n      background: ${token.colorFillQuaternary};\n      box-shadow: 0 0 0 1px ${token.colorBorderSecondary};\n\n      code {\n        word-break: break-word;\n      }\n\n      thead {\n        background: ${token.colorFillQuaternary};\n      }\n\n      tr {\n        box-shadow: 0 1px 0 ${token.colorBorderSecondary};\n      }\n\n      th,\n      td {\n        min-width: 120px;\n        padding-block: 0.75em;\n        padding-inline: 1em;\n        text-align: start;\n      }\n    }\n  `;\n  const video = css`\n    > video,\n    > p > video {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n      box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n    }\n\n    video {\n      max-width: 100%;\n    }\n  `;\n\n  const footnote = css`\n    .footnotes {\n      margin-block-start: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      font-size: smaller;\n      color: #8b949e;\n\n      #footnote-label {\n        display: none;\n      }\n\n      > ol {\n        margin: 0 !important;\n      }\n    }\n  `;\n\n  const sup = css`\n    sup {\n      position: relative;\n      inset-block-start: -0.25em;\n\n      font-size: 0.75em;\n      line-height: var(--lobe-markdown-line-height);\n      vertical-align: baseline;\n    }\n  `;\n\n  const sub = css`\n    sub {\n      position: relative;\n      inset-block-end: -0.25em;\n\n      font-size: 0.75em;\n      line-height: var(--lobe-markdown-line-height);\n      vertical-align: baseline;\n    }\n  `;\n\n  return {\n    root: css`\n      :not(:has(${IGNORE_CLASSNAME})),\n      .markdown {\n        ${[\n          __root,\n          a,\n          blockquote,\n          code,\n          del,\n          details,\n          header,\n          hr,\n          img,\n          list,\n          p,\n          pre,\n          strong,\n          svg,\n          table,\n          video,\n          footnote,\n          sub,\n          sup,\n        ]}\n      }\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAM,mBAAmB;AAEzB,MAAa,YAAY,cAAc,EAAE,OAAO,iBAAU;CACxD,MAAM,SAAS,KAAG;;;;;qCAKiB,MAAM,eAAe;oCACtB,MAAM,oBAAoB;;;;;;;;;;;;CAY5D,MAAM,IAAI,KAAG;;eAEA,MAAM,cAAc;;;iBAGlB,MAAM,eAAe;;;;CAKpC,MAAM,aAAa,KAAG;;;;;;uCAMe,MAAM,YAAY;;eAE1C,MAAM,mBAAmB;;;CAItC,MAAM,OAAO,KAAG;;;;;;;;;;;uBAWK,MAAM,eAAe;;;;;;sBAMtB,MAAM,mBAAmB;;;;CAK7C,MAAM,MAAM,KAAG;;eAEF,MAAM,qBAAqB;;;;CAKxC,MAAM,UAAU,KAAG;;;;;;;oBAOD,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;0CAoBF,MAAM,mBAAmB;2CACxB,MAAM,mBAAmB;;yBAE3C,MAAM,WAAW;;wCAEF,MAAM,cAAc;;;;;;;yCAOnB,MAAM,YAAY;;;;;;;;;CASzD,MAAM,SAAS,KAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0ClB,MAAM,KAAK,KAAG;;;;sBAIM,MAAM,YAAY;;;;;;;;CAQtC,MAAM,MAAM,KAAG;;;;;;;;;;;;CAaf,MAAM,OAAO,KAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgEhB,MAAM,IAAI,KAAG;;;;;;;;;;;;;;;CAeb,MAAM,MAAM,KAAG;;;;;CAKf,MAAM,SAAS,KAAG;;;;;CAKlB,MAAM,MAAM,KAAG;;;;;CAKf,MAAM,QAAQ,KAAG;;;;;;;;;;;;;;;;;;;;oBAoBC,MAAM,oBAAoB;8BAChB,MAAM,qBAAqB;;;;;;;sBAOnC,MAAM,oBAAoB;;;;8BAIlB,MAAM,qBAAqB;;;;;;;;;;;;CAYvD,MAAM,QAAQ,KAAG;;;;;;;;;;;;CAajB,MAAM,WAAW,KAAG;;;;;;;;;;;;;;;CAgBpB,MAAM,MAAM,KAAG;;;;;;;;;;AAsBf,QAAO,EACL,MAAM,KAAG;kBACK,iBAAiB;;UAEzB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAhCI,KAAG;;;;;;;;;;EAkCP;EACD,CAAC;;OAGP;EACD"}
+{"version":3,"file":"markdown.style.mjs","names":["cssVar"],"sources":["../../src/Markdown/markdown.style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nconst IGNORE_CLASSNAME = '.ignore-markdown-style';\n\nexport const styles = createStaticStyles(({ cssVar, css }) => {\n  const __root = css`\n    --lobe-markdown-font-size: 16px;\n    --lobe-markdown-header-multiple: 1;\n    --lobe-markdown-margin-multiple: 2;\n    --lobe-markdown-line-height: 1.8;\n    --lobe-markdown-border-radius: ${cssVar.borderRadiusLG};\n    --lobe-markdown-border-color: ${cssVar.colorFillQuaternary};\n\n    position: relative;\n\n    width: 100%;\n    max-width: 100%;\n    padding-inline: 1px;\n\n    font-size: var(--lobe-markdown-font-size);\n    line-height: var(--lobe-markdown-line-height);\n    word-break: break-word;\n  `;\n  const a = css`\n    a {\n      color: ${cssVar.colorInfoText};\n\n      &:hover {\n        color: ${cssVar.colorInfoHover};\n      }\n    }\n  `;\n\n  const blockquote = css`\n    blockquote {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      margin-inline: 0;\n      padding-block: 0;\n      padding-inline: 1em;\n      border-inline-start: solid 4px ${cssVar.colorBorder};\n\n      color: ${cssVar.colorTextSecondary};\n    }\n  `;\n\n  const code = css`\n    code {\n      &:not(:has(span)) {\n        display: inline;\n\n        margin-inline: 0.25em;\n        padding-block: 0.2em;\n        padding-inline: 0.4em;\n        border: 1px solid var(--lobe-markdown-border-color);\n        border-radius: 0.25em;\n\n        font-family: ${cssVar.fontFamilyCode};\n        font-size: 0.875em;\n        line-height: 1;\n        word-break: break-word;\n        white-space: break-spaces;\n\n        background: ${cssVar.colorFillSecondary};\n      }\n    }\n  `;\n\n  const del = css`\n    del {\n      color: ${cssVar.colorTextDescription};\n      text-decoration: line-through;\n    }\n  `;\n\n  const details = css`\n    details {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      padding-block: 0.75em;\n      padding-inline: 1em;\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n\n      background: ${cssVar.colorFillTertiary};\n      box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n\n      summary {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        list-style: none;\n\n        &::before {\n          content: '';\n\n          position: absolute;\n          inset-inline-end: 1.25em;\n          transform: rotateZ(-45deg);\n\n          display: block;\n\n          width: 0.4em;\n          height: 0.4em;\n          border-block-end: 1.5px solid ${cssVar.colorTextSecondary};\n          border-inline-end: 1.5px solid ${cssVar.colorTextSecondary};\n\n          font-family: ${cssVar.fontFamily};\n\n          transition: transform 200ms ${cssVar.motionEaseOut};\n        }\n      }\n\n      &[open] {\n        summary {\n          padding-block-end: 0.75em;\n          border-block-end: 1px dashed ${cssVar.colorBorder};\n\n          &::before {\n            transform: rotateZ(45deg);\n          }\n        }\n      }\n    }\n  `;\n  const header = css`\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n      margin-block: max(\n        calc(var(--lobe-markdown-header-multiple) * var(--lobe-markdown-margin-multiple) * 0.4em),\n        var(--lobe-markdown-font-size)\n      );\n      font-weight: bold;\n      line-height: 1.25;\n    }\n\n    h1 {\n      font-size: calc(\n        var(--lobe-markdown-font-size) * (1 + 1.5 * var(--lobe-markdown-header-multiple))\n      );\n    }\n\n    h2 {\n      font-size: calc(var(--lobe-markdown-font-size) * (1 + var(--lobe-markdown-header-multiple)));\n    }\n\n    h3 {\n      font-size: calc(\n        var(--lobe-markdown-font-size) * (1 + 0.5 * var(--lobe-markdown-header-multiple))\n      );\n    }\n\n    h4 {\n      font-size: calc(\n        var(--lobe-markdown-font-size) * (1 + 0.25 * var(--lobe-markdown-header-multiple))\n      );\n    }\n\n    h5,\n    h6 {\n      font-size: calc(var(--lobe-markdown-font-size) * 1);\n    }\n  `;\n  const hr = css`\n    hr {\n      width: 100%;\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1.5em);\n      border-color: ${cssVar.colorBorder};\n      border-style: dashed;\n      border-width: 1px;\n      border-block-start: none;\n      border-inline-start: none;\n      border-inline-end: none;\n    }\n  `;\n  const img = css`\n    img {\n      max-width: 100%;\n    }\n\n    > img,\n    > p > img {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n      box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n    }\n  `;\n\n  const list = css`\n    li {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.33em);\n\n      p:first-child {\n        display: inline;\n      }\n    }\n\n    ul,\n    ol {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      margin-inline-start: 1em;\n      padding-inline-start: 0;\n      list-style-position: outside;\n\n      > ul,\n      > ol {\n        margin-block: 0;\n      }\n\n      > li {\n        margin-inline-start: 1em;\n      }\n    }\n\n    ol {\n      list-style: auto;\n    }\n\n    ul {\n      list-style-type: none;\n\n      > li {\n        &::before {\n          content: '-';\n\n          position: absolute;\n\n          display: inline-block;\n\n          margin-inline: -1em 0.5em;\n\n          opacity: 0.5;\n        }\n      }\n    }\n\n    .task-list-item {\n      &::before {\n        display: none !important;\n      }\n\n      input[type='checkbox'] {\n        margin-block: 0 0.25em;\n        margin-inline: -1.6em 0.2em;\n        vertical-align: middle;\n      }\n\n      input[type='checkbox']:dir(rtl) {\n        margin: 0 -1.6em 0.25em 0.2em;\n      }\n    }\n  `;\n  const p = css`\n    p {\n      margin-block: 4px;\n      line-height: var(--lobe-markdown-line-height);\n      letter-spacing: 0.02em;\n\n      &:not(:first-child) {\n        margin-block-start: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      }\n\n      &:not(:last-child) {\n        margin-block-end: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      }\n    }\n  `;\n  const pre = css`\n    pre {\n      font-size: calc(var(--lobe-markdown-font-size) * 0.85);\n    }\n  `;\n  const strong = css`\n    strong {\n      font-weight: 600;\n    }\n  `;\n  const svg = css`\n    svg {\n      line-height: 1;\n    }\n  `;\n  const table = css`\n    table {\n      unicode-bidi: isolate;\n      overflow: auto hidden;\n      display: block;\n      border-spacing: 0;\n      border-collapse: collapse;\n\n      box-sizing: border-box;\n      width: max-content;\n      max-width: 100%;\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n\n      text-align: start;\n      text-indent: initial;\n      text-wrap: pretty;\n      word-break: auto-phrase;\n      overflow-wrap: break-word;\n\n      background: ${cssVar.colorFillQuaternary};\n      box-shadow: 0 0 0 1px ${cssVar.colorBorderSecondary};\n\n      code {\n        word-break: break-word;\n      }\n\n      thead {\n        background: ${cssVar.colorFillQuaternary};\n      }\n\n      tr {\n        box-shadow: 0 1px 0 ${cssVar.colorBorderSecondary};\n      }\n\n      th,\n      td {\n        min-width: 120px;\n        padding-block: 0.75em;\n        padding-inline: 1em;\n        text-align: start;\n      }\n    }\n  `;\n  const video = css`\n    > video,\n    > p > video {\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n      box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n    }\n\n    video {\n      max-width: 100%;\n    }\n  `;\n\n  const footnote = css`\n    .footnotes {\n      margin-block-start: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      font-size: smaller;\n      color: #8b949e;\n\n      #footnote-label {\n        display: none;\n      }\n\n      > ol {\n        margin: 0 !important;\n      }\n    }\n  `;\n\n  const sup = css`\n    sup {\n      position: relative;\n      inset-block-start: -0.25em;\n\n      font-size: 0.75em;\n      line-height: var(--lobe-markdown-line-height);\n      vertical-align: baseline;\n    }\n  `;\n\n  const sub = css`\n    sub {\n      position: relative;\n      inset-block-end: -0.25em;\n\n      font-size: 0.75em;\n      line-height: var(--lobe-markdown-line-height);\n      vertical-align: baseline;\n    }\n  `;\n\n  return {\n    root: css`\n      :not(:has(${IGNORE_CLASSNAME})),\n      .markdown {\n        ${[\n          __root,\n          a,\n          blockquote,\n          code,\n          del,\n          details,\n          header,\n          hr,\n          img,\n          list,\n          p,\n          pre,\n          strong,\n          svg,\n          table,\n          video,\n          footnote,\n          sub,\n          sup,\n        ]}\n      }\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAM,mBAAmB;AAEzB,MAAa,SAAS,oBAAoB,EAAE,kBAAQ,iBAAU;CAC5D,MAAM,SAAS,KAAG;;;;;qCAKiBA,SAAO,eAAe;oCACvBA,SAAO,oBAAoB;;;;;;;;;;;;CAY7D,MAAM,IAAI,KAAG;;eAEAA,SAAO,cAAc;;;iBAGnBA,SAAO,eAAe;;;;CAKrC,MAAM,aAAa,KAAG;;;;;;uCAMeA,SAAO,YAAY;;eAE3CA,SAAO,mBAAmB;;;CAIvC,MAAM,OAAO,KAAG;;;;;;;;;;;uBAWKA,SAAO,eAAe;;;;;;sBAMvBA,SAAO,mBAAmB;;;;CAK9C,MAAM,MAAM,KAAG;;eAEFA,SAAO,qBAAqB;;;;CAKzC,MAAM,UAAU,KAAG;;;;;;;oBAODA,SAAO,kBAAkB;;;;;;;;;;;;;;;;;;;;0CAoBHA,SAAO,mBAAmB;2CACzBA,SAAO,mBAAmB;;yBAE5CA,SAAO,WAAW;;wCAEHA,SAAO,cAAc;;;;;;;yCAOpBA,SAAO,YAAY;;;;;;;;;CAS1D,MAAM,SAAS,KAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0ClB,MAAM,KAAK,KAAG;;;;sBAIMA,SAAO,YAAY;;;;;;;;CAQvC,MAAM,MAAM,KAAG;;;;;;;;;;;;CAaf,MAAM,OAAO,KAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgEhB,MAAM,IAAI,KAAG;;;;;;;;;;;;;;;CAeb,MAAM,MAAM,KAAG;;;;;CAKf,MAAM,SAAS,KAAG;;;;;CAKlB,MAAM,MAAM,KAAG;;;;;CAKf,MAAM,QAAQ,KAAG;;;;;;;;;;;;;;;;;;;;oBAoBCA,SAAO,oBAAoB;8BACjBA,SAAO,qBAAqB;;;;;;;sBAOpCA,SAAO,oBAAoB;;;;8BAInBA,SAAO,qBAAqB;;;;;;;;;;;;CAYxD,MAAM,QAAQ,KAAG;;;;;;;;;;;;CAajB,MAAM,WAAW,KAAG;;;;;;;;;;;;;;;CAgBpB,MAAM,MAAM,KAAG;;;;;;;;;;AAsBf,QAAO,EACL,MAAM,KAAG;kBACK,iBAAiB;;UAEzB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAhCI,KAAG;;;;;;;;;;EAkCP;EACD,CAAC;;OAGP;EACD"}