@blank-utils/llm 0.3.7 → 0.3.8

package/dist/{chunk-D66WXG2F.js → chunk-SGV7RTM4.js}

@@ -1105,14 +1105,28 @@ import { RotateCcw, ChevronDown } from "lucide-react";
 import { clsx } from "clsx";
 import { twMerge } from "tailwind-merge";
 import { Streamdown } from "streamdown";
-import { code } from "@streamdown/code";
-import { mermaid } from "@streamdown/mermaid";
-import { math } from "@streamdown/math";
+import { createCodePlugin } from "@streamdown/code";
+import { createMermaidPlugin } from "@streamdown/mermaid";
+import { createMathPlugin } from "@streamdown/math";
 import "streamdown/styles.css";
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+var codePlugin = createCodePlugin({
+  themes: ["github-light", "github-dark"]
+});
+var mermaidPlugin = createMermaidPlugin({
+  config: {
+    theme: "base",
+    themeVariables: {
+      fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace'
+    }
+  }
+});
+var mathPlugin = createMathPlugin({
+  singleDollarTextMath: false
+});
 var DEFAULT_SYSTEM_PROMPT = `You are a helpful AI assistant.
 - You can use full Markdown (bold, italic, headers, lists).
 - You can use Code Blocks with language syntax highlighting.
@@ -1138,12 +1152,7 @@ var markdownComponents = {
   table: ({ children }) => /* @__PURE__ */ jsx3("div", { className: "my-4 w-full overflow-y-auto", children: /* @__PURE__ */ jsx3("table", { className: "w-full text-sm", children }) }),
   tr: ({ children }) => /* @__PURE__ */ jsx3("tr", { className: "m-0 border-t border-zinc-200 dark:border-zinc-800 p-0 even:bg-zinc-50 dark:even:bg-zinc-900/50", children }),
   th: ({ children }) => /* @__PURE__ */ jsx3("th", { className: "border border-zinc-200 dark:border-zinc-700 bg-zinc-50 dark:bg-zinc-900 px-4 py-2 font-semibold text-zinc-900 dark:text-zinc-100 text-left [&[align=center]]:text-center [&[align=right]]:text-right", children }),
-  td: ({ children }) => /* @__PURE__ */ jsx3("td", { className: "border border-zinc-200 dark:border-zinc-700 px-4 py-2 text-left [&[align=center]]:text-center [&[align=right]]:text-right text-zinc-700 dark:text-zinc-300", children }),
-  pre: ({ children }) => /* @__PURE__ */ jsx3("pre", { className: "mt-4 mb-4 overflow-x-auto rounded-xl border border-zinc-200 dark:border-zinc-800 bg-zinc-50 dark:bg-zinc-950 p-4 text-[13px] leading-relaxed font-mono shadow-sm", children }),
-  code: ({ children, className }) => {
-    const isInline = !className;
-    return /* @__PURE__ */ jsx3("code", { className: cn("font-mono text-[13px]", isInline ? "bg-zinc-100 dark:bg-zinc-800/60 rounded-md px-1.5 py-0.5 border border-zinc-200 dark:border-zinc-700 text-zinc-800 dark:text-zinc-300" : ""), children });
-  }
+  td: ({ children }) => /* @__PURE__ */ jsx3("td", { className: "border border-zinc-200 dark:border-zinc-700 px-4 py-2 text-left [&[align=center]]:text-center [&[align=right]]:text-right text-zinc-700 dark:text-zinc-300", children })
 };
 function ModelSelector({
   currentModel,
@@ -1407,9 +1416,9 @@ function Chat({
       ] }),
       messages.map((msg, i) => /* @__PURE__ */ jsx3("div", { className: cn("flex flex-col max-w-[85%]", msg.role === "user" ? "self-end" : "self-start w-full"), children: msg.role === "user" ? /* @__PURE__ */ jsxs3("div", { className: "bg-zinc-100 dark:bg-zinc-800 text-zinc-900 dark:text-zinc-100 px-5 py-3.5 rounded-[24px] rounded-br-[8px] sm:px-6 shadow-sm border border-zinc-200 dark:border-zinc-700/50", children: [
         msg.images && msg.images.length > 0 && /* @__PURE__ */ jsx3("div", { className: "flex flex-wrap gap-2 mb-3 mt-1", children: msg.images.map((img) => /* @__PURE__ */ jsx3("img", { src: img.dataUrl, className: "w-24 h-24 object-cover rounded-xl border border-zinc-200 dark:border-zinc-700 shadow-sm", alt: "attachment" }, img.id)) }),
-        /* @__PURE__ */ jsx3("div", { className: "prose prose-sm dark:prose-invert max-w-none", children: /* @__PURE__ */ jsx3(Streamdown, { plugins: { code, mermaid, math }, components: markdownComponents, animated: true, isAnimating: false, children: msg.content }) })
-      ] }) : /* @__PURE__ */ jsx3("div", { className: "prose prose-sm dark:prose-invert max-w-none px-2 w-full min-w-0", children: /* @__PURE__ */ jsx3(Streamdown, { plugins: { code, mermaid, math }, components: markdownComponents, animated: true, isAnimating: false, children: msg.content }) }) }, i)),
-      streamingText && /* @__PURE__ */ jsx3("div", { className: "flex flex-col self-start w-full max-w-[85%]", children: /* @__PURE__ */ jsx3("div", { className: "prose prose-sm dark:prose-invert max-w-none px-2 w-full min-w-0", children: /* @__PURE__ */ jsx3(Streamdown, { plugins: { code, mermaid, math }, components: markdownComponents, animated: true, isAnimating: isGenerating, children: streamingText }) }) }),
+        /* @__PURE__ */ jsx3("div", { className: "prose prose-sm dark:prose-invert max-w-none", children: /* @__PURE__ */ jsx3(Streamdown, { plugins: { code: codePlugin, mermaid: mermaidPlugin, math: mathPlugin }, components: markdownComponents, animated: true, isAnimating: false, children: msg.content }) })
+      ] }) : /* @__PURE__ */ jsx3("div", { className: "prose prose-sm dark:prose-invert max-w-none px-2 w-full min-w-0", children: /* @__PURE__ */ jsx3(Streamdown, { plugins: { code: codePlugin, mermaid: mermaidPlugin, math: mathPlugin }, components: markdownComponents, animated: true, isAnimating: false, children: msg.content }) }) }, i)),
+      streamingText && /* @__PURE__ */ jsx3("div", { className: "flex flex-col self-start w-full max-w-[85%]", children: /* @__PURE__ */ jsx3("div", { className: "prose prose-sm dark:prose-invert max-w-none px-2 w-full min-w-0", children: /* @__PURE__ */ jsx3(Streamdown, { plugins: { code: codePlugin, mermaid: mermaidPlugin, math: mathPlugin }, components: markdownComponents, animated: true, isAnimating: isGenerating, children: streamingText }) }) }),
       /* @__PURE__ */ jsx3("div", { ref: messagesEndRef, className: "h-4" })
     ] }),
     /* @__PURE__ */ jsx3("div", { className: "p-4 bg-white/80 dark:bg-zinc-950/80 backdrop-blur-xl border-t border-zinc-100 dark:border-zinc-800/80", children: /* @__PURE__ */ jsx3(

package/dist/index.css

@@ -2217,9 +2217,6 @@ video {
 .block {
   display: block;
 }
-.inline {
-  display: inline;
-}
 .flex {
   display: flex;
 }
@@ -2396,9 +2393,6 @@ video {
 .overflow-hidden {
   overflow: hidden;
 }
-.overflow-x-auto {
-  overflow-x: auto;
-}
 .overflow-y-auto {
   overflow-y: auto;
 }
@@ -2425,9 +2419,6 @@ video {
 .rounded-lg {
   border-radius: 0.5rem;
 }
-.rounded-md {
-  border-radius: 0.375rem;
-}
 .rounded-xl {
   border-radius: 0.75rem;
 }
@@ -2645,17 +2636,6 @@ video {
 .text-center {
   text-align: center;
 }
-.font-mono {
-  font-family:
-    ui-monospace,
-    SFMono-Regular,
-    Menlo,
-    Monaco,
-    Consolas,
-    "Liberation Mono",
-    "Courier New",
-    monospace;
-}
 .text-2xl {
   font-size: 1.5rem;
   line-height: 2rem;
@@ -2667,9 +2647,6 @@ video {
 .text-\[10px\] {
   font-size: 10px;
 }
-.text-\[13px\] {
-  font-size: 13px;
-}
 .text-\[15px\] {
   font-size: 15px;
 }
@@ -3044,9 +3021,6 @@ video {
     --tw-bg-opacity: 1;
     background-color: rgb(39 39 42 / var(--tw-bg-opacity, 1));
   }
-  .dark\:bg-zinc-800\/60 {
-    background-color: rgb(39 39 42 / 0.6);
-  }
   .dark\:bg-zinc-900 {
     --tw-bg-opacity: 1;
     background-color: rgb(24 24 27 / var(--tw-bg-opacity, 1));
@@ -3060,10 +3034,6 @@ video {
   .dark\:bg-zinc-900\/90 {
     background-color: rgb(24 24 27 / 0.9);
   }
-  .dark\:bg-zinc-950 {
-    --tw-bg-opacity: 1;
-    background-color: rgb(9 9 11 / var(--tw-bg-opacity, 1));
-  }
   .dark\:bg-zinc-950\/80 {
     background-color: rgb(9 9 11 / 0.8);
   }

package/dist/index.js

@@ -26,7 +26,7 @@ import {
   useCompletion,
   useLLM,
   useStream
-} from "./chunk-D66WXG2F.js";
+} from "./chunk-SGV7RTM4.js";
 export {
   Chat,
   ChatInput,

package/dist/react/index.css

@@ -2217,9 +2217,6 @@ video {
 .block {
   display: block;
 }
-.inline {
-  display: inline;
-}
 .flex {
   display: flex;
 }
@@ -2396,9 +2393,6 @@ video {
 .overflow-hidden {
   overflow: hidden;
 }
-.overflow-x-auto {
-  overflow-x: auto;
-}
 .overflow-y-auto {
   overflow-y: auto;
 }
@@ -2425,9 +2419,6 @@ video {
 .rounded-lg {
   border-radius: 0.5rem;
 }
-.rounded-md {
-  border-radius: 0.375rem;
-}
 .rounded-xl {
   border-radius: 0.75rem;
 }
@@ -2645,17 +2636,6 @@ video {
 .text-center {
   text-align: center;
 }
-.font-mono {
-  font-family:
-    ui-monospace,
-    SFMono-Regular,
-    Menlo,
-    Monaco,
-    Consolas,
-    "Liberation Mono",
-    "Courier New",
-    monospace;
-}
 .text-2xl {
   font-size: 1.5rem;
   line-height: 2rem;
@@ -2667,9 +2647,6 @@ video {
 .text-\[10px\] {
   font-size: 10px;
 }
-.text-\[13px\] {
-  font-size: 13px;
-}
 .text-\[15px\] {
   font-size: 15px;
 }
@@ -3044,9 +3021,6 @@ video {
     --tw-bg-opacity: 1;
     background-color: rgb(39 39 42 / var(--tw-bg-opacity, 1));
   }
-  .dark\:bg-zinc-800\/60 {
-    background-color: rgb(39 39 42 / 0.6);
-  }
   .dark\:bg-zinc-900 {
     --tw-bg-opacity: 1;
     background-color: rgb(24 24 27 / var(--tw-bg-opacity, 1));
@@ -3060,10 +3034,6 @@ video {
   .dark\:bg-zinc-900\/90 {
     background-color: rgb(24 24 27 / 0.9);
   }
-  .dark\:bg-zinc-950 {
-    --tw-bg-opacity: 1;
-    background-color: rgb(9 9 11 / var(--tw-bg-opacity, 1));
-  }
   .dark\:bg-zinc-950\/80 {
     background-color: rgb(9 9 11 / 0.8);
   }

package/dist/react/index.js

@@ -9,7 +9,7 @@ import {
   useCompletion,
   useLLM,
   useStream
-} from "../chunk-D66WXG2F.js";
+} from "../chunk-SGV7RTM4.js";
 export {
   Chat,
   ChatApp,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blank-utils/llm",
-  "version": "0.3.7",
+  "version": "0.3.8",
   "description": "Run LLMs directly in your browser with WebGPU acceleration. Supports React hooks and eager background loading.",
   "type": "module",
   "main": "./dist/index.js",