feat(desktop): latex support

packages/ui/package.json

@@ -25,15 +25,16 @@
     "generate:tailwind": "bun run script/tailwind.ts"
   },
   "devDependencies": {
-    "@types/bun": "catalog:",
-    "@types/luxon": "catalog:",
+    "@tailwindcss/vite": "catalog:",
     "@tsconfig/node22": "catalog:",
+    "@types/bun": "catalog:",
+    "@types/katex": "0.16.7",
+    "@types/luxon": "catalog:",
+    "tailwindcss": "catalog:",
     "typescript": "catalog:",
     "vite": "catalog:",
     "vite-plugin-icons-spritesheet": "3.0.1",
-    "vite-plugin-solid": "catalog:",
-    "tailwindcss": "catalog:",
-    "@tailwindcss/vite": "catalog:"
+    "vite-plugin-solid": "catalog:"
   },
   "dependencies": {
     "@kobalte/core": "catalog:",
@@ -46,8 +47,10 @@
     "@solidjs/meta": "catalog:",
     "@typescript/native-preview": "catalog:",
     "fuzzysort": "catalog:",
+    "katex": "0.16.27",
     "luxon": "catalog:",
     "marked": "catalog:",
+    "marked-katex-extension": "5.1.6",
     "marked-shiki": "catalog:",
     "remeda": "catalog:",
     "shiki": "catalog:",

packages/ui/src/context/marked.tsx

@@ -1,4 +1,5 @@
 import { marked } from "marked"
+import markedKatex from "marked-katex-extension"
 import markedShiki from "marked-shiki"
 import { bundledLanguages, type BundledLanguage } from "shiki"
 import { createSimpleContext } from "./helper"
@@ -378,6 +379,9 @@ export const { use: useMarked, provider: MarkedProvider } = createSimpleContext(
   name: "Marked",
   init: () => {
     return marked.use(
+      markedKatex({
+        throwOnError: false,
+      }),
       markedShiki({
         async highlight(code, lang) {
           const highlighter = await getSharedHighlighter({ themes: ["OpenCode"], langs: [] })

packages/ui/src/styles/index.css

@@ -4,6 +4,7 @@
 @import "./theme.css" layer(theme);
 
 @import "./base.css" layer(base);
+@import "katex/dist/katex.min.css" layer(base);
 
 @import "../components/accordion.css" layer(components);
 @import "../components/avatar.css" layer(components);