@lobehub/ui
Version:
Lobe UI is an open-source UI component library for building AIGC web apps
1 lines • 4.71 kB
Source Map (JSON)
{"version":3,"file":"StreamRenderer.mjs","names":[],"sources":["../../../src/Highlighter/SyntaxHighlighter/StreamRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getTokenStyleObject } from '@shikijs/core';\nimport { cx } from 'antd-style';\nimport type { CSSProperties } from 'react';\nimport { memo } from 'react';\nimport type { BuiltinTheme, ThemedToken } from 'shiki';\n\nimport { useStreamHighlight } from '@/hooks/useStreamHighlight';\n\ninterface StreamRendererProps {\n children: string;\n className?: string;\n enableTransformer?: boolean;\n fallbackClassName?: string;\n language: string;\n style?: CSSProperties;\n theme?: BuiltinTheme;\n}\n\nconst normalizeStyleKeys = (style: Record<string, string | number>): CSSProperties => {\n const normalized: CSSProperties = {};\n Object.entries(style).forEach(([key, value]) => {\n const normalizedKey = key.replaceAll(/-([a-z])/g, (_, char) => char.toUpperCase());\n (normalized as Record<string, string | number>)[normalizedKey] = value;\n });\n return normalized;\n};\n\nconst getTokenInlineStyle = (token: ThemedToken): CSSProperties => {\n const rawStyle = token.htmlStyle || getTokenStyleObject(token);\n const baseStyle = normalizeStyleKeys(rawStyle);\n return { ...baseStyle, whiteSpace: 'pre' };\n};\n\nconst TokenSpan = memo(\n ({ token }: { token: ThemedToken }) => {\n return (\n <span key={token.content} style={getTokenInlineStyle(token)}>\n {token.content}\n </span>\n );\n },\n (prev, next) => prev.token === next.token,\n);\n\nconst TokenLine = memo(\n ({ line }: { line: ThemedToken[] }) => {\n if (!line.length) {\n return (\n <span className=\"line\">\n <span style={{ whiteSpace: 'pre' }}>{'\\u00A0'}</span>\n </span>\n );\n }\n\n return (\n <span className=\"line\">\n {line.map((token, tokenIndex) => (\n <TokenSpan key={`token-${tokenIndex}`} token={token} />\n ))}\n </span>\n );\n },\n (prev, next) => prev.line === next.line,\n);\n\nconst StreamRenderer = memo<StreamRendererProps>(\n ({ children, className, enableTransformer, fallbackClassName, language, style, theme }) => {\n // Safely handle empty or invalid children\n const safeChildren = children ?? '';\n\n const streaming = useStreamHighlight(safeChildren, {\n enableTransformer,\n language,\n streaming: true,\n theme,\n });\n\n const lines = streaming?.lines;\n const preStyle = streaming?.preStyle;\n\n if (!lines || lines.length === 0) {\n return (\n <div className={fallbackClassName} dir=\"ltr\" style={style}>\n <pre>\n <code>{safeChildren}</code>\n </pre>\n </div>\n );\n }\n\n return (\n <div className={className} dir=\"ltr\" style={style}>\n <pre className={cx('shiki', theme)} style={preStyle} tabIndex={0}>\n <code style={{ display: 'flex', flexDirection: 'column', whiteSpace: 'pre' }}>\n {lines.map((line, index) => (\n <TokenLine key={`line-${index}`} line={line} />\n ))}\n </code>\n </pre>\n </div>\n );\n },\n);\n\nStreamRenderer.displayName = 'StreamRenderer';\n\nexport default StreamRenderer;\n"],"mappings":";;;;;;;AAoBA,MAAM,sBAAsB,UAA0D;CACpF,MAAM,aAA4B,CAAC;CACnC,OAAO,QAAQ,KAAK,CAAC,CAAC,SAAS,CAAC,KAAK,WAAW;EAC9C,MAAM,gBAAgB,IAAI,WAAW,cAAc,GAAG,SAAS,KAAK,YAAY,CAAC;EACjF,WAAgD,iBAAiB;CACnE,CAAC;CACD,OAAO;AACT;AAEA,MAAM,uBAAuB,UAAsC;CACjE,MAAM,WAAW,MAAM,aAAa,oBAAoB,KAAK;CAE7D,OAAO;EAAE,GADS,mBAAmB,QACjB;EAAG,YAAY;CAAM;AAC3C;AAEA,MAAM,YAAY,MACf,EAAE,YAAoC;CACrC,OACE,oBAAC,QAAD;EAA0B,OAAO,oBAAoB,KAAK;YACvD,MAAM;CACH,GAFK,MAAM,OAEX;AAEV,IACC,MAAM,SAAS,KAAK,UAAU,KAAK,KACtC;AAEA,MAAM,YAAY,MACf,EAAE,WAAoC;CACrC,IAAI,CAAC,KAAK,QACR,OACE,oBAAC,QAAD;EAAM,WAAU;YACd,oBAAC,QAAD;GAAM,OAAO,EAAE,YAAY,MAAM;aAAI;EAAe,CAAA;CAChD,CAAA;CAIV,OACE,oBAAC,QAAD;EAAM,WAAU;YACb,KAAK,KAAK,OAAO,eAChB,oBAAC,WAAD,EAA8C,MAAQ,GAAtC,SAAS,YAA6B,CACvD;CACG,CAAA;AAEV,IACC,MAAM,SAAS,KAAK,SAAS,KAAK,IACrC;AAEA,MAAM,iBAAiB,MACpB,EAAE,UAAU,WAAW,mBAAmB,mBAAmB,UAAU,OAAO,YAAY;CAEzF,MAAM,eAAe,YAAY;CAEjC,MAAM,YAAY,mBAAmB,cAAc;EACjD;EACA;EACA,WAAW;EACX;CACF,CAAC;CAED,MAAM,QAAQ,WAAW;CACzB,MAAM,WAAW,WAAW;CAE5B,IAAI,CAAC,SAAS,MAAM,WAAW,GAC7B,OACE,oBAAC,OAAD;EAAK,WAAW;EAAmB,KAAI;EAAa;YAClD,oBAAC,OAAD,EAAA,UACE,oBAAC,QAAD,EAAA,UAAO,aAAmB,CAAA,EACvB,CAAA;CACF,CAAA;CAIT,OACE,oBAAC,OAAD;EAAgB;EAAW,KAAI;EAAa;YAC1C,oBAAC,OAAD;GAAK,WAAW,GAAG,SAAS,KAAK;GAAG,OAAO;GAAU,UAAU;aAC7D,oBAAC,QAAD;IAAM,OAAO;KAAE,SAAS;KAAQ,eAAe;KAAU,YAAY;IAAM;cACxE,MAAM,KAAK,MAAM,UAChB,oBAAC,WAAD,EAAuC,KAAO,GAA9B,QAAQ,OAAsB,CAC/C;GACG,CAAA;EACH,CAAA;CACF,CAAA;AAET,CACF;AAEA,eAAe,cAAc"}