@lobehub/ui
Version:
Lobe UI is an open-source UI component library for building AIGC web apps
1 lines • 6.06 kB
Source Map (JSON)
{"version":3,"file":"useMarkdownComponents.mjs","names":["Link","Image","Video","Section","Hotkey"],"sources":["../../../src/hooks/useMarkdown/useMarkdownComponents.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useMemo } from 'react';\nimport type { Components } from 'react-markdown';\n\nimport Hotkey from '@/Hotkey';\nimport { CodeBlock } from '@/Markdown/components/CodeBlock';\nimport { useMarkdownContext } from '@/Markdown/components/MarkdownProvider';\nimport Image from '@/mdx/mdxComponents/Image';\nimport Link from '@/mdx/mdxComponents/Link';\nimport Section from '@/mdx/mdxComponents/Section';\nimport Video from '@/mdx/mdxComponents/Video';\n\nexport const useMarkdownComponents = (): Components => {\n const {\n components,\n animated,\n citations,\n componentProps,\n enableMermaid,\n fullFeaturedCodeBlock,\n showFootnotes,\n } = useMarkdownContext();\n\n const memoA = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ({ node, ...props }: any) => <Link citations={citations} {...props} {...componentProps?.a} />,\n [citations, componentProps?.a],\n );\n\n const memoImg = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ({ node, ...props }: any) => <Image {...props} {...componentProps?.img} />,\n [componentProps?.img],\n );\n\n const memoVideo = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ({ node, ...props }: any) => <Video {...props} {...componentProps?.video} />,\n [componentProps?.video],\n );\n\n const memoSection = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ({ node, ...props }: any) => <Section showFootnotes={showFootnotes} {...props} />,\n [showFootnotes],\n );\n\n const memoKbd = useCallback(\n ({ children }: any) => <Hotkey keys={children} style={{ display: 'inline-flex' }} />,\n [],\n );\n\n const memoBr = useCallback(() => <br />, []);\n\n const memeP = useCallback(({ style, children, className }: any) => {\n const skipWrapperTags = ['img', 'video'];\n if (typeof children === 'object' && skipWrapperTags.includes(children?.props?.node?.tagName)) {\n return children;\n }\n return (\n <p className={className} style={style}>\n {children}\n </p>\n );\n }, []);\n\n // Stable references for theme objects to prevent unnecessary re-renders\n const highlightTheme = useMemo(\n () => componentProps?.highlight?.theme,\n [JSON.stringify(componentProps?.highlight?.theme)],\n );\n\n const mermaidTheme = useMemo(\n () => componentProps?.mermaid?.theme,\n [JSON.stringify(componentProps?.mermaid?.theme)],\n );\n\n // Create stable component props reference\n const stableComponentProps = useMemo(() => {\n if (!componentProps) return;\n\n return {\n highlight: componentProps.highlight\n ? { ...componentProps.highlight, theme: highlightTheme }\n : undefined,\n mermaid: componentProps.mermaid\n ? { ...componentProps.mermaid, theme: mermaidTheme }\n : undefined,\n };\n }, [highlightTheme, mermaidTheme]);\n\n const memoPre = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ({ node, ...props }: any) => (\n <CodeBlock\n animated={animated}\n enableMermaid={enableMermaid}\n fullFeatured={fullFeaturedCodeBlock}\n {...stableComponentProps}\n {...componentProps?.pre}\n {...props}\n />\n ),\n [animated, enableMermaid, fullFeaturedCodeBlock, stableComponentProps, componentProps?.pre],\n );\n\n const memoColorPreview = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ({ node, ...props }: any) => <code {...props} />,\n [],\n );\n\n const memoComponents = useMemo(\n () => ({\n a: memoA,\n br: memoBr,\n colorPreview: memoColorPreview,\n img: memoImg,\n kbd: memoKbd,\n p: memeP,\n pre: memoPre,\n section: memoSection,\n video: memoVideo,\n }),\n [memoA, memoBr, memoImg, memoVideo, memoPre, memoSection, memeP, memoColorPreview, memoKbd],\n );\n\n return useMemo(\n () => ({\n ...memoComponents,\n ...components,\n }),\n [memoComponents, components],\n );\n};\n"],"mappings":";;;;;;;;;;;;;AAaA,MAAa,8BAA0C;CACrD,MAAM,EACJ,YACA,UACA,WACA,gBACA,eACA,uBACA,kBACE,oBAAoB;CAExB,MAAM,QAAQ,aAEX,EAAE,MAAM,GAAG,YAAiB,oBAACA;EAAgB;EAAW,GAAI;EAAO,GAAI,gBAAgB;GAAK,EAC7F,CAAC,WAAW,gBAAgB,EAAE,CAC/B;CAED,MAAM,UAAU,aAEb,EAAE,MAAM,GAAG,YAAiB,oBAACC;EAAM,GAAI;EAAO,GAAI,gBAAgB;GAAO,EAC1E,CAAC,gBAAgB,IAAI,CACtB;CAED,MAAM,YAAY,aAEf,EAAE,MAAM,GAAG,YAAiB,oBAACC;EAAM,GAAI;EAAO,GAAI,gBAAgB;GAAS,EAC5E,CAAC,gBAAgB,MAAM,CACxB;CAED,MAAM,cAAc,aAEjB,EAAE,MAAM,GAAG,YAAiB,oBAACC;EAAuB;EAAe,GAAI;GAAS,EACjF,CAAC,cAAc,CAChB;CAED,MAAM,UAAU,aACb,EAAE,eAAoB,oBAACC;EAAO,MAAM;EAAU,OAAO,EAAE,SAAS,eAAe;GAAI,EACpF,EAAE,CACH;CAED,MAAM,SAAS,kBAAkB,oBAAC,SAAK,EAAE,EAAE,CAAC;CAE5C,MAAM,QAAQ,aAAa,EAAE,OAAO,UAAU,gBAAqB;AAEjE,MAAI,OAAO,aAAa,YADA,CAAC,OAAO,QAAQ,CACY,SAAS,UAAU,OAAO,MAAM,QAAQ,CAC1F,QAAO;AAET,SACE,oBAAC;GAAa;GAAkB;GAC7B;IACC;IAEL,EAAE,CAAC;CAGN,MAAM,iBAAiB,cACf,gBAAgB,WAAW,OACjC,CAAC,KAAK,UAAU,gBAAgB,WAAW,MAAM,CAAC,CACnD;CAED,MAAM,eAAe,cACb,gBAAgB,SAAS,OAC/B,CAAC,KAAK,UAAU,gBAAgB,SAAS,MAAM,CAAC,CACjD;CAGD,MAAM,uBAAuB,cAAc;AACzC,MAAI,CAAC,eAAgB;AAErB,SAAO;GACL,WAAW,eAAe,YACtB;IAAE,GAAG,eAAe;IAAW,OAAO;IAAgB,GACtD;GACJ,SAAS,eAAe,UACpB;IAAE,GAAG,eAAe;IAAS,OAAO;IAAc,GAClD;GACL;IACA,CAAC,gBAAgB,aAAa,CAAC;CAElC,MAAM,UAAU,aAEb,EAAE,MAAM,GAAG,YACV,oBAAC;EACW;EACK;EACf,cAAc;EACd,GAAI;EACJ,GAAI,gBAAgB;EACpB,GAAI;GACJ,EAEJ;EAAC;EAAU;EAAe;EAAuB;EAAsB,gBAAgB;EAAI,CAC5F;CAED,MAAM,mBAAmB,aAEtB,EAAE,MAAM,GAAG,YAAiB,oBAAC,UAAK,GAAI,QAAS,EAChD,EAAE,CACH;CAED,MAAM,iBAAiB,eACd;EACL,GAAG;EACH,IAAI;EACJ,cAAc;EACd,KAAK;EACL,KAAK;EACL,GAAG;EACH,KAAK;EACL,SAAS;EACT,OAAO;EACR,GACD;EAAC;EAAO;EAAQ;EAAS;EAAW;EAAS;EAAa;EAAO;EAAkB;EAAQ,CAC5F;AAED,QAAO,eACE;EACL,GAAG;EACH,GAAG;EACJ,GACD,CAAC,gBAAgB,WAAW,CAC7B"}