Fix javascript-repl renderer to use console-block component

package-lock.json

@@ -776,6 +776,10 @@
 			"resolved": "packages/tui",
 			"link": true
 		},
+		"node_modules/@mariozechner/pi-web-ui": {
+			"resolved": "packages/web-ui",
+			"link": true
+		},
 		"node_modules/@napi-rs/canvas": {
 			"version": "0.1.80",
 			"resolved": "https://registry.npmjs.org/@napi-rs/canvas/-/canvas-0.1.80.tgz",
@@ -5395,6 +5399,26 @@
 			"engines": {
 				"node": ">= 0.6"
 			}
+		},
+		"packages/web-ui": {
+			"name": "@mariozechner/pi-web-ui",
+			"version": "0.5.43",
+			"license": "MIT",
+			"dependencies": {
+				"@mariozechner/mini-lit": "^0.1.7",
+				"@mariozechner/pi-ai": "^0.5.43",
+				"docx-preview": "^0.3.7",
+				"jszip": "^3.10.1",
+				"lit": "^3.3.1",
+				"lucide": "^0.544.0",
+				"pdfjs-dist": "^5.4.149",
+				"xlsx": "^0.18.5"
+			},
+			"devDependencies": {
+				"@tailwindcss/cli": "^4.0.0-beta.14",
+				"concurrently": "^9.2.1",
+				"typescript": "^5.7.3"
+			}
 		}
 	}
 }

package.json

@@ -7,8 +7,8 @@
 	],
 	"scripts": {
 		"clean": "npm run clean --workspaces",
-		"build": "npm run build -w @mariozechner/pi-tui && npm run build -w @mariozechner/pi-ai && npm run build -w @mariozechner/pi-reader-extension && npm run build -w @mariozechner/pi-agent && npm run build -w @mariozechner/pi",
+		"build": "npm run build -w @mariozechner/pi-tui && npm run build -w @mariozechner/pi-ai && npm run build -w @mariozechner/pi-web-ui && npm run build -w @mariozechner/pi-reader-extension && npm run build -w @mariozechner/pi-agent && npm run build -w @mariozechner/pi",
-		"dev": "concurrently --names \"ai,browser-ext,tui\" --prefix-colors \"cyan,yellow,magenta\" \"npm run dev -w @mariozechner/pi-ai\" \"npm run dev -w @mariozechner/pi-reader-extension\" \"npm run dev -w @mariozechner/pi-tui\"",
+		"dev": "concurrently --names \"ai,web-ui,browser-ext,tui\" --prefix-colors \"cyan,green,yellow,magenta\" \"npm run dev -w @mariozechner/pi-ai\" \"npm run dev -w @mariozechner/pi-web-ui\" \"npm run dev -w @mariozechner/pi-reader-extension\" \"npm run dev -w @mariozechner/pi-tui\"",
 		"check": "biome check --write . && npm run check --workspaces && tsc --noEmit",
 		"test": "npm run test --workspaces --if-present",
 		"version:patch": "npm version patch -ws --no-git-tag-version && node scripts/sync-versions.js",

packages/ai/src/models.generated.ts

@@ -1949,8 +1949,8 @@ export const MODELS = {
 			reasoning: false,
 			input: ["text"],
 			cost: {
-				input: 0.39999999999999997,
+				input: 0.39,
-				output: 2,
+				output: 1.9,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
@@ -2034,8 +2034,8 @@ export const MODELS = {
 			reasoning: true,
 			input: ["text"],
 			cost: {
-				input: 0.25,
+				input: 0.3,
-				output: 1,
+				output: 1.2,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
@@ -2187,8 +2187,8 @@ export const MODELS = {
 			reasoning: false,
 			input: ["text"],
 			cost: {
-				input: 0.07,
+				input: 0.08,
-				output: 0.28,
+				output: 0.33,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
@@ -2204,13 +2204,13 @@ export const MODELS = {
 			reasoning: true,
 			input: ["text"],
 			cost: {
-				input: 0.38,
+				input: 0.35,
-				output: 1.5999999999999999,
+				output: 1.55,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
 			contextWindow: 131072,
-			maxTokens: 4096,
+			maxTokens: 131072,
 		} satisfies Model<"openai-completions">,
 		"z-ai/glm-4.5-air:free": {
 			id: "z-ai/glm-4.5-air:free",
@@ -2544,8 +2544,8 @@ export const MODELS = {
 			reasoning: false,
 			input: ["text"],
 			cost: {
-				input: 0.04,
+				input: 0.049999999999999996,
-				output: 0.14,
+				output: 0.22,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
@@ -2663,8 +2663,8 @@ export const MODELS = {
 			reasoning: true,
 			input: ["text"],
 			cost: {
-				input: 0.04,
+				input: 0.049999999999999996,
-				output: 0.14,
+				output: 0.22,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
@@ -2680,8 +2680,8 @@ export const MODELS = {
 			reasoning: true,
 			input: ["text"],
 			cost: {
-				input: 0.03,
+				input: 0.049999999999999996,
-				output: 0.13,
+				output: 0.19999999999999998,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
@@ -2850,13 +2850,13 @@ export const MODELS = {
 			reasoning: false,
 			input: ["text", "image"],
 			cost: {
-				input: 0.04,
+				input: 0.049999999999999996,
-				output: 0.15,
+				output: 0.09999999999999999,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
-			contextWindow: 131072,
+			contextWindow: 128000,
-			maxTokens: 131072,
+			maxTokens: 4096,
 		} satisfies Model<"openai-completions">,
 		"microsoft/phi-4-multimodal-instruct": {
 			id: "microsoft/phi-4-multimodal-instruct",
@@ -2969,13 +2969,13 @@ export const MODELS = {
 			reasoning: false,
 			input: ["text"],
 			cost: {
-				input: 0.04,
+				input: 0.049999999999999996,
-				output: 0.15,
+				output: 0.08,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
 			contextWindow: 32768,
-			maxTokens: 32768,
+			maxTokens: 16384,
 		} satisfies Model<"openai-completions">,
 		"deepseek/deepseek-r1-distill-llama-70b": {
 			id: "deepseek/deepseek-r1-distill-llama-70b",
@@ -3037,13 +3037,13 @@ export const MODELS = {
 			reasoning: false,
 			input: ["text"],
 			cost: {
-				input: 0.24999987999999998,
+				input: 0.3,
-				output: 0.999999888,
+				output: 0.85,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},
 			contextWindow: 163840,
-			maxTokens: 4096,
+			maxTokens: 163840,
 		} satisfies Model<"openai-completions">,
 		"meta-llama/llama-3.3-70b-instruct:free": {
 			id: "meta-llama/llama-3.3-70b-instruct:free",
@@ -3632,8 +3632,8 @@ export const MODELS = {
 			reasoning: false,
 			input: ["text"],
 			cost: {
-				input: 0.39999999999999997,
+				input: 0.54,
-				output: 0.39999999999999997,
+				output: 0.54,
 				cacheRead: 0,
 				cacheWrite: 0,
 			},

packages/web-ui/src/tools/javascript-repl.ts

@@ -286,11 +286,7 @@ export const javascriptReplRenderer: ToolRenderer<JavaScriptReplParams, JavaScri
 
 		return html`
 			<div class="flex flex-col gap-3">
-				${
+				${output ? html`<console-block .content=${output}></console-block>` : ""}
-					output
-						? html`<div class="font-mono text-xs whitespace-pre-wrap bg-muted/50 p-3 rounded-md border">${output}</div>`
-						: ""
-				}
 				${
 					attachments.length
 						? html`<div class="flex flex-wrap gap-2">

tsconfig.json

@@ -5,6 +5,7 @@
 		"paths": {
 			"@mariozechner/pi-tui": ["./packages/tui/src/index.ts"],
 			"@mariozechner/pi-ai": ["./packages/ai/src/index.ts"],
+			"@mariozechner/pi-web-ui": ["./packages/web-ui/src/index.ts"],
 			"@mariozechner/pi-agent": ["./packages/agent/src/index.ts"],
 			"@mariozechner/pi": ["./packages/pods/src/index.ts"]
 		}