@blank-utils/llm 0.5.1 → 0.5.3

package/dist/{chunk-S375B33F.js → chunk-6EZY4F42.js}

@@ -1022,6 +1022,31 @@ import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
+async function resizeImageForWebLLM(dataUrl) {
+  return new Promise((resolve, reject) => {
+    const img = new Image();
+    img.onload = () => {
+      const TARGET_W = 1344;
+      const TARGET_H = 1008;
+      const canvas = document.createElement("canvas");
+      canvas.width = TARGET_W;
+      canvas.height = TARGET_H;
+      const ctx = canvas.getContext("2d");
+      if (!ctx) return resolve(dataUrl);
+      ctx.fillStyle = "black";
+      ctx.fillRect(0, 0, TARGET_W, TARGET_H);
+      const scale = Math.min(TARGET_W / img.width, TARGET_H / img.height);
+      const w = img.width * scale;
+      const h = img.height * scale;
+      const x = (TARGET_W - w) / 2;
+      const y = (TARGET_H - h) / 2;
+      ctx.drawImage(img, x, y, w, h);
+      resolve(canvas.toDataURL("image/jpeg", 0.9));
+    };
+    img.onerror = () => resolve(dataUrl);
+    img.src = dataUrl;
+  });
+}
 function sanitizeMarkdownLanguageBlocks(markdown) {
   let cleanMarkdown = markdown;
   cleanMarkdown = cleanMarkdown.replace(/```([a-zA-Z0-9+#-]*)[_|█▋]+[ \t]*(?:\n|$)/gi, "```$1\n");
@@ -1067,7 +1092,8 @@ var DEFAULT_SYSTEM_PROMPT = `You are a helpful AI assistant.
       B -- Yes --> C[Continue]
       B -- No --> D[Error]
     \`\`\`
-- You can use LaTeX math ($$ ... $$).`;
+- You can use LaTeX math ($$ ... $$).
+- IF you are provided an uploaded image, your primary task is strictly to analyze the contents of that specific image in natural language. Do not hallucinate that the user desires a Mermaid diagram unless they specifically ask for one.`;
 var ALL_MODELS = { ...WEBLLM_MODELS };
 function isVisionModel(modelId) {
   if (!modelId) return false;
@@ -1212,21 +1238,27 @@ Additional instructions:
 ${systemPrompt}` : systemPrompt;
       apiMessages.push({ role: "system", content: finalSystemPrompt });
     }
-    currentMessages.forEach((m) => {
+    for (const m of currentMessages) {
       let content = m.content;
       if (m.role === "user" && m.images && m.images.length > 0 && isVisionModel(modelId || "")) {
+        const processedImages = await Promise.all(
+          m.images.map((img) => resizeImageForWebLLM(img.dataUrl))
+        );
         content = [
           { type: "text", text: m.content },
-          ...m.images.map((img) => ({ type: "image_url", image_url: { url: img.dataUrl } }))
+          ...processedImages.map((url) => ({ type: "image_url", image_url: { url } }))
         ];
       }
       apiMessages.push({ role: m.role, content });
-    });
+    }
     let finalUserContent = userContent;
     if (attachedImages.length > 0 && isVisionModel(modelId || "")) {
+      const processedImages = await Promise.all(
+        attachedImages.map((img) => resizeImageForWebLLM(img.dataUrl))
+      );
       finalUserContent = [
         { type: "text", text: userContent },
-        ...attachedImages.map((img) => ({ type: "image_url", image_url: { url: img.dataUrl } }))
+        ...processedImages.map((url) => ({ type: "image_url", image_url: { url } }))
       ];
     }
     apiMessages.push({ role: "user", content: finalUserContent });

package/dist/index.css

@@ -2290,6 +2290,9 @@ video {
 .table-row {
   display: table-row;
 }
+.contents {
+  display: contents;
+}
 .list-item {
   display: list-item;
 }

package/dist/index.js

@@ -22,7 +22,7 @@ import {
   useCompletion,
   useLLM,
   useStream
-} from "./chunk-S375B33F.js";
+} from "./chunk-6EZY4F42.js";
 export {
   Chat,
   ChatInput,

package/dist/react/index.css

@@ -2290,6 +2290,9 @@ video {
 .table-row {
   display: table-row;
 }
+.contents {
+  display: contents;
+}
 .list-item {
   display: list-item;
 }

package/dist/react/index.js

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

package/package.json

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