Elgato_dark/void
1
0
Fork 0
mirror of https://github.com/voideditor/void synced 2026-05-23 01:18:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix katex?

Browse source
This commit is contained in:
Andrew Pareles 2025-04-21 16:37:31 -07:00
parent c179912368
commit 3de9faed5c
2 changed files with 47 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

95
src/vs/workbench/contrib/void/browser/react/src/markdown/ChatMarkdownRender.tsx
View file

@ -5,9 +5,6 @@
import React, { JSX, useMemo, useState } from 'react'
import { marked, MarkedToken, Token } from 'marked'
import katex from 'katex'
import 'katex/dist/katex.min.css'
import dompurify from '../../../../../../../base/browser/dompurify/dompurify.js'
import { convertToVscodeLang, detectLanguage } from '../../../../common/helpers/languageHelpers.js'
import { BlockCodeApplyWrapper } from './ApplyBlockHoverButtons.js'
@ -36,59 +33,59 @@ function isValidUri(s: string): boolean {
// renders contiguous string of latex eg $e^{i\pi}$
const LatexRender = ({ latex }: { latex: string }) => {
return <span className="katex-error text-red-500">{latex}</span>
// try {
// let formula = latex;
// let displayMode = false;
try {
let formula = latex;
let displayMode = false;
// // Extract the formula from delimiters
// if (latex.startsWith('$') && latex.endsWith('$')) {
// // Check if it's display math $$...$$
// if (latex.startsWith('$$') && latex.endsWith('$$')) {
// formula = latex.slice(2, -2);
// displayMode = true;
// } else {
// formula = latex.slice(1, -1);
// }
// } else if (latex.startsWith('\\(') && latex.endsWith('\\)')) {
// formula = latex.slice(2, -2);
// } else if (latex.startsWith('\\[') && latex.endsWith('\\]')) {
// formula = latex.slice(2, -2);
// displayMode = true;
// }
// Extract the formula from delimiters
if (latex.startsWith('$') && latex.endsWith('$')) {
// Check if it's display math $$...$$
if (latex.startsWith('$$') && latex.endsWith('$$')) {
formula = latex.slice(2, -2);
displayMode = true;
} else {
formula = latex.slice(1, -1);
}
} else if (latex.startsWith('\\(') && latex.endsWith('\\)')) {
formula = latex.slice(2, -2);
} else if (latex.startsWith('\\[') && latex.endsWith('\\]')) {
formula = latex.slice(2, -2);
displayMode = true;
}
// // Render LaTeX
// const html = katex.renderToString(formula, {
// displayMode: displayMode,
// throwOnError: false,
// output: 'html'
// });
// Render LaTeX
const html = katex.renderToString(formula, {
displayMode: displayMode,
throwOnError: false,
output: 'html'
});
// // Sanitize the HTML output with DOMPurify
// const sanitizedHtml = dompurify.sanitize(html, {
// RETURN_TRUSTED_TYPE: true,
// USE_PROFILES: { html: true, svg: true, mathMl: true }
// });
// Sanitize the HTML output with DOMPurify
const sanitizedHtml = dompurify.sanitize(html, {
RETURN_TRUSTED_TYPE: true,
USE_PROFILES: { html: true, svg: true, mathMl: true }
});
// // Add proper styling based on mode
// const className = displayMode
// ? 'katex-block my-2 text-center'
// : 'katex-inline';
// Add proper styling based on mode
const className = displayMode
? 'katex-block my-2 text-center'
: 'katex-inline';
// // Use the ref approach to avoid dangerouslySetInnerHTML
// const mathRef = React.useRef<HTMLSpanElement>(null);
// Use the ref approach to avoid dangerouslySetInnerHTML
const mathRef = React.useRef<HTMLSpanElement>(null);
// React.useEffect(() => {
// if (mathRef.current) {
// mathRef.current.innerHTML = sanitizedHtml as unknown as string;
// }
// }, [sanitizedHtml]);
React.useEffect(() => {
if (mathRef.current) {
mathRef.current.innerHTML = sanitizedHtml as unknown as string;
}
}, [sanitizedHtml]);
return <span ref={mathRef} className={className}></span>;
} catch (error) {
console.error('KaTeX rendering error:', error);
return <span className="katex-error text-red-500">{latex}</span>;
}
// return <span ref={mathRef} className={className}></span>;
// } catch (error) {
// console.error('KaTeX rendering error:', error);
// return <span className="katex-error text-red-500">{latex}</span>;
// }
}
const Codespan = ({ text, className, onClick }: { text: string, className?: string, onClick?: () => void }) => {

2
src/vs/workbench/contrib/void/browser/react/src/util/inputs.tsx
View file

@ -467,7 +467,7 @@ export const VoidInputBox2 = forwardRef<HTMLTextAreaElement, InputBox2Props>(fun
rows={1}
placeholder={placeholder}
/>
<div>{`idx ${optionIdx}`}</div>
{/* <div>{`idx ${optionIdx}`}</div> */}
{isMenuOpen && (
<div
ref={refs.setFloating}