diff --git a/packages/ui/app/src/mdx/plugins/rehypeFernCode.ts b/packages/ui/app/src/mdx/plugins/rehypeFernCode.ts index fd83469b6e..fb04b4a1ee 100644 --- a/packages/ui/app/src/mdx/plugins/rehypeFernCode.ts +++ b/packages/ui/app/src/mdx/plugins/rehypeFernCode.ts @@ -195,12 +195,21 @@ function maybeParseInt(str: string | null | undefined): number | undefined { } export function parseBlockMetaString(element: Element, defaultFallback: string): FernCodeMeta { - let meta: string = unknownToString(element.data?.meta ?? element.properties?.metastring ?? ""); + const originalMeta: string = unknownToString(element.data?.meta ?? element.properties?.metastring ?? "").trim(); + let meta = originalMeta; - const titleMatch = meta.match(/title="([^"]*)"/); - const title = titleMatch?.[1]; + const titleMatch = meta.match(/title="((?:[^"\\]|\\.)*)"/); + let title = titleMatch?.[1]; meta = meta.replace(titleMatch?.[0] ?? "", ""); + const fileName = meta.match(/fileName="((?:[^"\\]|\\.)*)"/); + title = title ?? fileName?.[1]; + meta = meta.replace(fileName?.[0] ?? "", ""); + + const filename = meta.match(/filename="((?:[^"\\]|\\.)*)"/); + title = title ?? filename?.[1]; + meta = meta.replace(filename?.[0] ?? "", ""); + // i.e. maxLines=20 (default is 20) const maxLinesMatch = meta.match(/maxLines=(\d+)/); let maxLines: number | undefined = maybeParseInt(maxLinesMatch?.[1]) ?? 20; @@ -217,6 +226,10 @@ export function parseBlockMetaString(element: Element, defaultFallback: string): meta = meta.replace(focused[0], ""); } + if (originalMeta === meta && meta.length > 0) { + title = meta; + } + let lang = defaultFallback; if ( element.properties && diff --git a/packages/ui/app/src/syntax-highlighting/FernSyntaxHighlighter.tsx b/packages/ui/app/src/syntax-highlighting/FernSyntaxHighlighter.tsx index 88bea791c0..5b51f8d2ad 100644 --- a/packages/ui/app/src/syntax-highlighting/FernSyntaxHighlighter.tsx +++ b/packages/ui/app/src/syntax-highlighting/FernSyntaxHighlighter.tsx @@ -53,7 +53,7 @@ export const FernSyntaxHighlighter = forwardRef