@lobehub/ui
Version:
Lobe UI is an open-source UI component library for building AIGC web apps
1 lines • 6.47 kB
Source Map (JSON)
{"version":3,"file":"index.mjs","names":["list: any","mdxComponents","Image","CodeBlock","Video","error: any","Alert","Typography","PreviewGroup"],"sources":["../../../src/mdx/Mdx/index.tsx"],"sourcesContent":["'use client';\n\nimport { evaluate } from '@mdx-js/mdx';\nimport { cx } from 'antd-style';\nimport { ReactNode, memo, useEffect, useMemo, useState } from 'react';\nimport jsxDevRuntime from 'react/jsx-dev-runtime';\nimport jsxRuntime from 'react/jsx-runtime';\nimport { rehypeGithubAlerts } from 'rehype-github-alerts';\nimport rehypeKatex from 'rehype-katex';\nimport remarkGfm from 'remark-gfm';\nimport remarkMath from 'remark-math';\nimport type { Pluggable } from 'unified';\n\nimport Alert from '@/Alert';\nimport { PreviewGroup } from '@/Image';\nimport { Typography, type TypographyProps } from '@/Markdown';\nimport { styles } from '@/Markdown/style';\nimport { useMarkdownContent } from '@/hooks/useMarkdown';\n\nimport mdxComponents from '../mdxComponents';\nimport CodeBlock from '../mdxComponents/CodeBlock';\nimport Image from '../mdxComponents/Image';\nimport Video from '../mdxComponents/Video';\n\nconst runtime = process.env.NODE_ENV === 'production' ? jsxRuntime : jsxDevRuntime;\n\nexport interface MdxProps extends Omit<TypographyProps, 'children'> {\n children: string;\n components?: any[];\n enableImageGallery?: boolean;\n enableLatex?: boolean;\n enableMermaid?: boolean;\n fallback?: ReactNode;\n fullFeaturedCodeBlock?: boolean;\n onDoubleClick?: () => void;\n rehypePlugins?: Pluggable[];\n remarkPlugins?: Pluggable[];\n variant?: 'normal' | 'chat';\n}\n\nconst Mdx = memo<MdxProps>(\n ({\n children,\n className,\n style,\n fullFeaturedCodeBlock = true,\n enableImageGallery,\n enableLatex = true,\n enableMermaid = true,\n rehypePlugins,\n remarkPlugins,\n components = {},\n fallback = null,\n fontSize,\n headerMultiple,\n lineHeight,\n marginMultiple,\n variant,\n ...rest\n }) => {\n const escapedContent = useMarkdownContent(children);\n\n const isChatMode = variant === 'chat';\n\n const [MDXContent, setMDXContent] = useState<any>(() => () => null);\n\n const innerRehypePlugins = Array.isArray(rehypePlugins) ? rehypePlugins : [rehypePlugins];\n const memoRehypePlugins = useMemo(\n () =>\n [rehypeGithubAlerts, enableLatex && rehypeKatex, ...innerRehypePlugins].filter(\n Boolean,\n ) as any,\n [enableLatex, ...innerRehypePlugins],\n );\n\n const innerRemarkPlugins = Array.isArray(remarkPlugins) ? remarkPlugins : [remarkPlugins];\n const memoRemarkPlugins = useMemo(\n () => [remarkGfm, enableLatex && remarkMath, ...innerRemarkPlugins].filter(Boolean) as any,\n [enableLatex, ...innerRemarkPlugins],\n );\n\n const memoComponents = useMemo(() => {\n const list: any = {};\n Object.entries({\n ...mdxComponents,\n img: Image,\n pre: (props: any) => (\n <CodeBlock\n {...props}\n enableMermaid={enableMermaid}\n fullFeatured={fullFeaturedCodeBlock}\n />\n ),\n video: Video,\n ...components,\n }).forEach(([key, Render]: any) => {\n list[key] = (props: any) => <Render {...props} />;\n });\n return list;\n }, [components, enableMermaid, fullFeaturedCodeBlock]);\n\n useEffect(() => {\n if (!escapedContent) return;\n (async () => {\n try {\n const { default: Content } = await evaluate(escapedContent, {\n ...runtime,\n development: process.env.NODE_ENV !== 'production',\n rehypePlugins: memoRehypePlugins,\n remarkPlugins: memoRemarkPlugins,\n });\n setMDXContent(() => Content);\n } catch (error: any) {\n // @ts-ignore\n setMDXContent(() => () => (\n <Alert\n description={String(error?.message as string)}\n style={{\n width: '100%',\n }}\n title={'Error compiling MDX'}\n type=\"error\"\n />\n ));\n console.error('Error compiling MDX:', error);\n }\n })();\n }, [escapedContent, memoRehypePlugins, memoRemarkPlugins]);\n\n if (!escapedContent || !MDXContent) return fallback;\n\n return (\n <Typography\n className={cx(enableLatex && styles.latex, isChatMode && styles.chat, className)}\n data-code-type=\"mdx\"\n fontSize={fontSize}\n headerMultiple={headerMultiple}\n lineHeight={lineHeight}\n marginMultiple={marginMultiple}\n style={style}\n {...rest}\n >\n <PreviewGroup enable={enableImageGallery}>\n <MDXContent components={memoComponents} />\n </PreviewGroup>\n </Typography>\n );\n },\n);\n\nMdx.displayName = 'Mdx';\n\nexport default Mdx;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAM,UAAU,QAAQ,IAAI,aAAa,eAAe,aAAa;AAgBrE,MAAM,MAAM,MACT,EACC,UACA,WACA,OACA,wBAAwB,MACxB,oBACA,cAAc,MACd,gBAAgB,MAChB,eACA,eACA,aAAa,EAAE,EACf,WAAW,MACX,UACA,gBACA,YACA,gBACA,SACA,GAAG,WACC;CACJ,MAAM,iBAAiB,mBAAmB,SAAS;CAEnD,MAAM,aAAa,YAAY;CAE/B,MAAM,CAAC,YAAY,iBAAiB,qBAA0B,KAAK;CAEnE,MAAM,qBAAqB,MAAM,QAAQ,cAAc,GAAG,gBAAgB,CAAC,cAAc;CACzF,MAAM,oBAAoB,cAEtB;EAAC;EAAoB,eAAe;EAAa,GAAG;EAAmB,CAAC,OACtE,QACD,EACH,CAAC,aAAa,GAAG,mBAAmB,CACrC;CAED,MAAM,qBAAqB,MAAM,QAAQ,cAAc,GAAG,gBAAgB,CAAC,cAAc;CACzF,MAAM,oBAAoB,cAClB;EAAC;EAAW,eAAe;EAAY,GAAG;EAAmB,CAAC,OAAO,QAAQ,EACnF,CAAC,aAAa,GAAG,mBAAmB,CACrC;CAED,MAAM,iBAAiB,cAAc;EACnC,MAAMA,OAAY,EAAE;AACpB,SAAO,QAAQ;GACb,GAAGC;GACH,KAAKC;GACL,MAAM,UACJ,oBAACC;IACC,GAAI;IACW;IACf,cAAc;KACd;GAEJ,OAAOC;GACP,GAAG;GACJ,CAAC,CAAC,SAAS,CAAC,KAAK,YAAiB;AACjC,QAAK,QAAQ,UAAe,oBAAC,UAAO,GAAI,QAAS;IACjD;AACF,SAAO;IACN;EAAC;EAAY;EAAe;EAAsB,CAAC;AAEtD,iBAAgB;AACd,MAAI,CAAC,eAAgB;AACrB,GAAC,YAAY;AACX,OAAI;IACF,MAAM,EAAE,SAAS,YAAY,MAAM,SAAS,gBAAgB;KAC1D,GAAG;KACH,aAAa,QAAQ,IAAI,aAAa;KACtC,eAAe;KACf,eAAe;KAChB,CAAC;AACF,wBAAoB,QAAQ;YACrBC,OAAY;AAEnB,8BACE,oBAACC;KACC,aAAa,OAAO,OAAO,QAAkB;KAC7C,OAAO,EACL,OAAO,QACR;KACD,OAAO;KACP,MAAK;MACL,CACF;AACF,YAAQ,MAAM,wBAAwB,MAAM;;MAE5C;IACH;EAAC;EAAgB;EAAmB;EAAkB,CAAC;AAE1D,KAAI,CAAC,kBAAkB,CAAC,WAAY,QAAO;AAE3C,QACE,oBAACC;EACC,WAAW,GAAG,eAAe,OAAO,OAAO,cAAc,OAAO,MAAM,UAAU;EAChF,kBAAe;EACL;EACM;EACJ;EACI;EACT;EACP,GAAI;YAEJ,oBAACC;GAAa,QAAQ;aACpB,oBAAC,cAAW,YAAY,iBAAkB;IAC7B;GACJ;EAGlB;AAED,IAAI,cAAc;AAElB,kBAAe"}