@xl0/pi-lovely-web 0.1.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 xl0
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,87 @@
+# pi-lovely-web
+
+Lovely Pi extension for accessing the web.
+
+## Supply chain
+
+This extension uses plain REST API - not the provider-specific packages.
+We add zero dependencies, minimizing the supply chain attack surface.
+
+## Install
+
+```bash
+pi install npm:@xl0/pi-lovely-web
+```
+
+## Tools
+
+- `web_search` - Compact search results (list of results + markdown of the first result)
+The plain-text tool output looks likes this:
+
+> `web_search "pi coding agent harness earendil" (web, limit 5, fetch first)`
+
+```
+1. GitHub - earendil-works/pi: AI agent toolkit
+    https://github.com/earendil-works/pi
+    Markdown:
+[markdown of the first hit if `fetch_first` is not false]
+
+ 2. packages/coding-agent/README.md at main · earendil-works/pi
+    https://github.com/earendil-works/pi/blob/main/packages/coding-agent/README.md
+    The page describes the pi project from earendil-works, a minimal, extensible terminal coding harness designed to adapt to your workflow. Key points:
+ - Pi is an AI agent toolkit for coding: CLI, unified LLM API, TUI/Web UI libraries, Slack bot, and vLLM pods.
+ - Core idea: extendable with TypeScript E…
+
+ 3. Pi Coding Agent
+    https://pi.dev/
+    Pi Coding Agent is a minimal, highly customizable terminal coding harness. It adapts to your workflow with extensible packages (extensions, skills, prompts, and themes) that you can bundle
+ and share via npm or git. Key ideas:
+ - Four modes: interactive TUI, print/JSON, RPC, and SDK (usable for embedd…
+```
+
+- `web_fetch` - The single web page in markdown format
+- `web_image` - The single image, returned as media content. Respects the Pi image resizing settings:
+
+![web_image](assets/web_image.png)
+
+
+## Configuration
+
+Run `/lovely-web` in Pi to configure providers interactively:
+
+![alt text](assets/settings.png)
+
+The settings are stored in `~/.pi/agent/xl0-pi-lovely-web.json` (global) or `.pi/xl0-pi-lovely-web.json` (project):
+
+```json
+{
+  "webSearch": { "provider": "firecrawl", "enabled": true },
+  "webFetch":  { "provider": "firecrawl", "enabled": true },
+  "webImage":  { "enabled": true },
+  "webApiKeys": {
+    "firecrawl": "fc-...",
+    "exa": "...",
+    "tavily": "...",
+    "brave": "..."
+  }
+}
+```
+
+API keys can also be set via environment variables: `FIRECRAWL_API_KEY`, `EXA_API_KEY`, `TAVILY_API_KEY`, `BRAVE_API_KEY`.
+
+Search and fetch can use different providers. If only `webSearch.provider` is set,
+`web_fetch` falls back to it when that provider supports fetch. Set `enabled:false`
+on `webSearch`, `webFetch`, or `webImage` to remove that tool from Pi's active tool list.
+
+`waitFor` is provider-specific: Firecrawl supports it as an extra pre-capture delay; Exa and Tavily ignore it and `web_fetch` returns a warning if supplied.
+
+`web_image` fetches a direct image URL without provider config/API keys and returns a short text note plus image content to vision-capable models, matching Pi's `read` image behavior. Supported MIME types: PNG, JPEG, WebP, GIF. Defaults to a 5 MB download cap and resizes through Pi's inline image helper before returning content.
+
+## Providers
+
+| Provider      | Search | Fetch | Auth |
+|---------------|--------|-------|------|
+| Firecrawl     | ✓      | ✓     | `Authorization: Bearer` |
+| Exa           | ✓      | ✓     | `x-api-key` |
+| Tavily        | ✓      | ✓     | `Authorization: Bearer` |
+| Brave Search  | ✓      | -     | `X-Subscription-Token` |

package/extensions/lovely-web/command.ts

@@ -0,0 +1,177 @@
+import { homedir } from "node:os"
+import { join, resolve } from "node:path"
+import { type ExtensionAPI, ExtensionInputComponent, getSelectListTheme, getSettingsListTheme } from "@earendil-works/pi-coding-agent"
+import { Container, SelectList, type SettingItem, SettingsList, Text } from "@earendil-works/pi-tui"
+import {
+	applyToolConfig,
+	DISABLED_LABEL,
+	getImageMaxSize,
+	isFetchEnabled,
+	isImageEnabled,
+	isImageResizeEnabled,
+	isSearchEnabled,
+	loadConfig,
+	maskApiKey,
+	providerIdFromLabel,
+	providerLabel,
+	providerNames,
+	providers,
+	readConfigFile,
+	writeConfigFile
+} from "./config.js"
+
+function providerSubmenu(title: string, labels: string[], currentValue: string, done: (selectedValue?: string) => void) {
+	const container = new Container()
+	container.addChild(new Text(title, 1, 1))
+	const list = new SelectList(
+		labels.map(label => ({ value: label, label })),
+		Math.min(labels.length, 10),
+		getSelectListTheme()
+	)
+	list.setSelectedIndex(Math.max(0, labels.indexOf(currentValue)))
+	list.onSelect = item => done(item.value)
+	list.onCancel = () => done(undefined)
+	container.addChild(list)
+	return {
+		render: (width: number) => container.render(width),
+		invalidate: () => container.invalidate(),
+		handleInput: (data: string) => list.handleInput(data)
+	}
+}
+
+export function registerLovelyWebCommand(pi: ExtensionAPI) {
+	pi.registerCommand("lovely-web", {
+		description: "Configure Lovely Web search, fetch, and image tools",
+		async handler(_args, ctx) {
+			if (!ctx.hasUI) {
+				ctx.ui.notify("The /lovely-web command is only available in interactive mode.", "warning")
+				return
+			}
+
+			const scope = await ctx.ui.select("Config scope:", ["Global (~/.pi/agent/)", "Project (.pi/)"])
+			if (scope === undefined) return
+
+			const configPath = scope.startsWith("Global")
+				? join(homedir(), ".pi", "agent", "xl0-pi-lovely-web.json")
+				: resolve(ctx.cwd, ".pi", "xl0-pi-lovely-web.json")
+
+			const config = readConfigFile(configPath)
+			const save = () => {
+				writeConfigFile(configPath, config)
+				applyToolConfig(pi, loadConfig(ctx.cwd))
+			}
+
+			await ctx.ui.custom((_tui, theme, _keybindings, done) => {
+				const searchLabels = [DISABLED_LABEL, ...providerNames.map(id => providers[id]?.label ?? id)]
+				const fetchLabels = [DISABLED_LABEL, ...providerNames.filter(id => providers[id]?.fetch).map(id => providers[id]?.label ?? id)]
+				const items: SettingItem[] = [
+					{
+						id: "search",
+						label: "web_search",
+						currentValue: isSearchEnabled(config) ? providerLabel(config.webSearch?.provider) : DISABLED_LABEL,
+						description: "Search provider, or disabled to remove web_search from active tools.",
+						submenu: (currentValue, done) => providerSubmenu("Select search provider", searchLabels, currentValue, done)
+					},
+					{
+						id: "fetch",
+						label: "web_fetch",
+						currentValue: isFetchEnabled(config) ? providerLabel(config.webFetch?.provider) : DISABLED_LABEL,
+						description: "Fetch provider, or disabled to remove web_fetch from active tools.",
+						submenu: (currentValue, done) => providerSubmenu("Select fetch provider", fetchLabels, currentValue, done)
+					},
+					{
+						id: "image",
+						label: "web_image",
+						currentValue: isImageEnabled(config) ? "enabled" : "disabled",
+						description: "Enable or disable direct image URL fetching.",
+						values: ["enabled", "disabled"]
+					},
+					{
+						id: "image-resize",
+						label: "Resize images",
+						currentValue: isImageResizeEnabled(config) ? "enabled" : "disabled",
+						description: "Resize fetched images to fit within the max size limit.",
+						values: ["enabled", "disabled"]
+					},
+					{
+						id: "image-max-size",
+						label: "Max image size",
+						currentValue: String(getImageMaxSize(config)),
+						description: "Maximum longest side in pixels for resized images.",
+						submenu: (_currentValue: string, done: (selectedValue?: string) => void) =>
+							new ExtensionInputComponent(
+								"Max image size (px):",
+								"Enter size",
+								value => {
+									const n = Number(value)
+									if (!Number.isFinite(n) || n < 1) {
+										done(undefined)
+										return
+									}
+									config.webImage ??= {}
+									config.webImage.maxSize = n
+									save()
+									done(String(n))
+								},
+								() => done(undefined),
+								{ tui: _tui }
+							)
+					},
+					...providerNames.map(id => ({
+						id: `key:${id}`,
+						label: `${providers[id]?.label ?? id} API key`,
+						currentValue: maskApiKey(config.webApiKeys?.[id]),
+						description: `Set API key for ${providers[id]?.label ?? id}.`,
+						submenu: (_currentValue: string, done: (selectedValue?: string) => void) =>
+							new ExtensionInputComponent(
+								`API key for ${providers[id]?.label ?? id}${config.webApiKeys?.[id] ? ` (current: ${maskApiKey(config.webApiKeys[id])})` : ""}:`,
+								"Enter API key",
+								value => {
+									config.webApiKeys ??= {}
+									config.webApiKeys[id] = value
+									save()
+									done(maskApiKey(value))
+								},
+								() => done(undefined),
+								{ tui: _tui }
+							)
+					}))
+				]
+				const container = new Container()
+				container.addChild(new Text(theme.fg("accent", theme.bold("Lovely Web")), 1, 1))
+				const list = new SettingsList(
+					items,
+					Math.min(items.length, 12),
+					getSettingsListTheme(),
+					(id, newValue) => {
+						if (id === "search") {
+							if (newValue === DISABLED_LABEL) config.webSearch = { ...config.webSearch, enabled: false }
+							else {
+								const providerId = providerIdFromLabel(newValue)
+								if (providerId) config.webSearch = { provider: providerId, enabled: true }
+							}
+						} else if (id === "fetch") {
+							if (newValue === DISABLED_LABEL) config.webFetch = { ...config.webFetch, enabled: false }
+							else {
+								const providerId = providerIdFromLabel(newValue)
+								if (providerId) config.webFetch = { provider: providerId, enabled: true }
+							}
+						} else if (id === "image") {
+							config.webImage = { ...config.webImage, enabled: newValue === "enabled" }
+						} else if (id === "image-resize") {
+							config.webImage = { ...config.webImage, resize: newValue === "enabled" }
+						}
+						save()
+					},
+					() => done(undefined)
+				)
+				container.addChild(list)
+				return {
+					render: (width: number) => container.render(width),
+					invalidate: () => container.invalidate(),
+					handleInput: (data: string) => list.handleInput(data)
+				}
+			})
+		}
+	})
+}

package/extensions/lovely-web/config.ts

@@ -0,0 +1,134 @@
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from "node:fs"
+import { homedir } from "node:os"
+import { join, resolve } from "node:path"
+import type { ExtensionAPI } from "@earendil-works/pi-coding-agent"
+import { braveProvider } from "./providers/brave.js"
+import { exaProvider } from "./providers/exa.js"
+import { firecrawlProvider } from "./providers/firecrawl.js"
+import { tavilyProvider } from "./providers/tavily.js"
+import type { Provider, WebToolsConfig } from "./providers/types.js"
+
+export const DEFAULT_TIMEOUT_MS = 30_000
+export const DISABLED_LABEL = "Disabled"
+
+export const providers: Record<string, Provider> = {
+	firecrawl: firecrawlProvider,
+	exa: exaProvider,
+	tavily: tavilyProvider,
+	brave: braveProvider
+}
+
+export const providerNames = Object.keys(providers)
+
+export function isSearchEnabled(config: WebToolsConfig): boolean {
+	return config.webSearch?.enabled !== false
+}
+
+export function isFetchEnabled(config: WebToolsConfig): boolean {
+	return config.webFetch?.enabled !== false
+}
+
+export function isImageEnabled(config: WebToolsConfig): boolean {
+	return config.webImage?.enabled !== false
+}
+
+export function isImageResizeEnabled(config: WebToolsConfig): boolean {
+	return config.webImage?.resize !== false
+}
+
+export function getImageMaxSize(config: WebToolsConfig): number {
+	return config.webImage?.maxSize ?? 2000
+}
+
+function resolveProviderId(type: "search" | "fetch", config: WebToolsConfig): string {
+	if (type === "search" && !isSearchEnabled(config)) throw new Error("web_search is disabled. Enable it via /lovely-web.")
+	if (type === "fetch" && !isFetchEnabled(config)) throw new Error("web_fetch is disabled. Enable it via /lovely-web.")
+
+	const direct = type === "search" ? config.webSearch?.provider : config.webFetch?.provider
+	const fallback = type === "fetch" && isSearchEnabled(config) ? config.webSearch?.provider : undefined
+	const id = direct || fallback
+	if (!id) {
+		const hint = type === "search" ? "webSearch.provider" : "webFetch.provider"
+		throw new Error(`No ${type} provider configured. Set ${hint} via /lovely-web.`)
+	}
+	if (!providers[id]) throw new Error(`Unknown provider "${id}". Available: ${Object.keys(providers).join(", ")}.`)
+	return id
+}
+
+export function getProvider(type: "fetch", config: WebToolsConfig): Provider & { fetch: NonNullable<Provider["fetch"]> }
+export function getProvider(type: "search", config: WebToolsConfig): Provider
+export function getProvider(type: "search" | "fetch", config: WebToolsConfig): Provider {
+	const id = resolveProviderId(type, config)
+	const provider = providers[id]
+	if (!provider) throw new Error(`Provider "${id}" not found.`)
+	if (type === "fetch" && !provider.fetch) {
+		throw new Error(
+			`${provider.label} does not support fetching pages. Configure a fetch-capable provider (e.g. firecrawl, exa, tavily) via /lovely-web.`
+		)
+	}
+	return provider as Provider & { fetch: NonNullable<Provider["fetch"]> }
+}
+
+export function resolveApiKey(provider: Provider, config: WebToolsConfig): string {
+	const key = config.webApiKeys?.[provider.id]
+	if (key) return key
+	const envKey = process.env[provider.envApiKey]
+	if (envKey) return envKey
+	throw new Error(`No API key for ${provider.label}. Set it via /lovely-web or set the ${provider.envApiKey} environment variable.`)
+}
+
+export function loadConfig(cwd: string): WebToolsConfig {
+	const global = readConfigFile(join(homedir(), ".pi", "agent", "xl0-pi-lovely-web.json"))
+	const project = readConfigFile(resolve(cwd, ".pi", "xl0-pi-lovely-web.json"))
+	return {
+		...global,
+		...project,
+		webSearch: { ...global.webSearch, ...project.webSearch },
+		webFetch: { ...global.webFetch, ...project.webFetch },
+		webImage: { ...global.webImage, ...project.webImage },
+		webApiKeys: { ...global.webApiKeys, ...project.webApiKeys }
+	}
+}
+
+export function readConfigFile(path: string): WebToolsConfig {
+	try {
+		if (!existsSync(path)) return {}
+		const raw = readFileSync(path, "utf-8")
+		return JSON.parse(raw) as WebToolsConfig
+	} catch {
+		return {}
+	}
+}
+
+export function writeConfigFile(path: string, config: WebToolsConfig): void {
+	mkdirSync(resolve(path, ".."), { recursive: true })
+	writeFileSync(path, `${JSON.stringify(config, null, 2)}\n`, "utf-8")
+}
+
+export function applyToolConfig(pi: ExtensionAPI, config: WebToolsConfig): void {
+	const active = new Set(pi.getActiveTools())
+	if (isSearchEnabled(config)) active.add("web_search")
+	else active.delete("web_search")
+	if (isFetchEnabled(config)) active.add("web_fetch")
+	else active.delete("web_fetch")
+	if (isImageEnabled(config)) active.add("web_image")
+	else active.delete("web_image")
+	pi.setActiveTools([...active])
+}
+
+export function providerLabel(id: string | undefined): string {
+	return id ? (providers[id]?.label ?? id) : "(not set)"
+}
+
+export function providerIdFromLabel(label: string): string | undefined {
+	return providerNames.find(id => providers[id]?.label === label)
+}
+
+export function maskApiKey(key: string | undefined): string {
+	if (!key) return "(not set)"
+	const maskLength = Math.max(5, key.length - 8)
+	const visible = Math.max(0, key.length - maskLength)
+	const startLength = Math.min(4, Math.ceil(visible / 2))
+	const endLength = Math.min(4, visible - startLength)
+	return `${key.slice(0, startLength)}${"*".repeat(maskLength)}${endLength > 0 ? key.slice(-endLength) : ""}`
+}

package/extensions/lovely-web/format.ts

@@ -0,0 +1,38 @@
+import type { SearchResult } from "./providers/types.js"
+
+export function stringify(value: unknown) {
+	return JSON.stringify(value, null, 2)
+}
+
+export function asErrorMessage(error: unknown) {
+	return error instanceof Error ? error.message : String(error)
+}
+
+const MAX_DESCRIPTION_LENGTH = 300
+
+function truncate(text: string, maxLen: number): string {
+	if (text.length <= maxLen) return text
+	return `${text.slice(0, maxLen)}…`
+}
+
+export function formatSearchOutput(results: SearchResult[]) {
+	if (results.length === 0) return "No results."
+
+	return results
+		.map((result, index) => {
+			const title = result.title || "Untitled"
+			const url = result.url
+			const description = result.description
+			const markdown = result.markdown?.trim()
+			const lines = [`${index + 1}. ${title}`]
+
+			if (url) lines.push(`   ${url}`)
+			if (description && !(index === 0 && markdown)) {
+				lines.push(`   ${truncate(description, MAX_DESCRIPTION_LENGTH)}`)
+			}
+			if (index === 0 && markdown) lines.push("", "   Markdown:", markdown)
+
+			return lines.join("\n")
+		})
+		.join("\n\n")
+}

package/extensions/lovely-web/image.ts

@@ -0,0 +1,167 @@
+import { formatDimensionNote, type ResizedImage, resizeImage } from "@earendil-works/pi-coding-agent"
+import { getImageDimensions } from "@earendil-works/pi-tui"
+import { DEFAULT_TIMEOUT_MS } from "./config.js"
+import type { ToolResult } from "./tool-impl.js"
+
+export const DEFAULT_MAX_IMAGE_BYTES = 5_000_000
+export const MAX_IMAGE_BYTES = 20_000_000
+const SUPPORTED_IMAGE_MIME_TYPES = new Set(["image/png", "image/jpeg", "image/webp", "image/gif"])
+
+async function fetchImageContent(
+	url: string,
+	opts: { timeout: number; maxBytes: number },
+	signal?: AbortSignal
+): Promise<{ data: string; mimeType: string; bytes: number; contentLength?: number }> {
+	const controller = new AbortController()
+	const timer = setTimeout(() => controller.abort(), opts.timeout)
+	const abort = () => controller.abort()
+	if (signal?.aborted) controller.abort()
+	else signal?.addEventListener("abort", abort, { once: true })
+
+	try {
+		const res = await fetch(url, { signal: controller.signal })
+		if (!res.ok) {
+			const text = await res.text()
+			throw new Error(`Image request failed (${res.status}): ${text}`)
+		}
+
+		const mimeType = res.headers.get("content-type")?.split(";")[0]?.trim().toLowerCase()
+		if (!mimeType || !SUPPORTED_IMAGE_MIME_TYPES.has(mimeType)) {
+			throw new Error(`Unsupported image content-type: ${mimeType || "missing"}`)
+		}
+
+		const contentLength = res.headers.get("content-length")
+		const parsedContentLength = contentLength ? Number(contentLength) : undefined
+		if (parsedContentLength !== undefined && parsedContentLength > opts.maxBytes) {
+			throw new Error(`Image too large: ${parsedContentLength} bytes exceeds ${opts.maxBytes}`)
+		}
+		if (!res.body) throw new Error("Image response had no body")
+
+		let bytes = 0
+		const chunks: Uint8Array[] = []
+		const reader = res.body.getReader()
+		while (true) {
+			const { done, value } = await reader.read()
+			if (done) break
+			bytes += value.byteLength
+			if (bytes > opts.maxBytes) {
+				await reader.cancel()
+				throw new Error(`Image too large: exceeded ${opts.maxBytes} bytes`)
+			}
+			chunks.push(value)
+		}
+
+		return {
+			data: Buffer.concat(chunks).toString("base64"),
+			mimeType,
+			bytes,
+			...(parsedContentLength !== undefined ? { contentLength: parsedContentLength } : {})
+		}
+	} finally {
+		clearTimeout(timer)
+		signal?.removeEventListener("abort", abort)
+	}
+}
+
+export async function imageImpl(
+	params: {
+		url: string
+		timeout?: number | undefined
+		maxBytes?: number | undefined
+		resize?: boolean | undefined
+		maxSize?: number | undefined
+	},
+	signal?: AbortSignal,
+	onUpdate?: (result: ToolResult) => void
+): Promise<ToolResult> {
+	const maxBytes = params.maxBytes ?? DEFAULT_MAX_IMAGE_BYTES
+	if (maxBytes > MAX_IMAGE_BYTES) throw new Error(`maxBytes cannot exceed ${MAX_IMAGE_BYTES}`)
+
+	const image = await fetchImageContent(params.url, { timeout: params.timeout ?? DEFAULT_TIMEOUT_MS, maxBytes }, signal)
+	if (signal?.aborted) throw new Error("Image fetch cancelled")
+
+	const originalDimensions = getImageDimensions(image.data, image.mimeType) ?? undefined
+
+	if (params.resize === false) {
+		// Re-encode to sanitize, but don't downscale.
+		const validated = (await resizeImage(
+			{ type: "image", data: image.data, mimeType: image.mimeType },
+			{ maxWidth: Infinity, maxHeight: Infinity }
+		)) as ResizedImage | null
+		if (!validated) {
+			const note = `Fetched image [${image.mimeType}]\n[Image omitted: could not be decoded]`
+			const result: ToolResult = {
+				content: [{ type: "text" as const, text: note }],
+				details: {
+					url: params.url,
+					mimeType: image.mimeType,
+					bytes: image.bytes,
+					contentLength: image.contentLength
+				}
+			}
+			onUpdate?.(result)
+			return result
+		}
+		const dimensions = { widthPx: validated.width, heightPx: validated.height }
+		const note = `Fetched image [${validated.mimeType}]`
+		const result: ToolResult = {
+			content: [
+				{ type: "text" as const, text: note },
+				{ type: "image" as const, data: validated.data, mimeType: validated.mimeType }
+			],
+			details: {
+				url: params.url,
+				mimeType: validated.mimeType,
+				bytes: image.bytes,
+				contentLength: image.contentLength,
+				dimensions,
+				originalDimensions,
+				wasResized: validated.wasResized
+			}
+		}
+		onUpdate?.(result)
+		return result
+	}
+
+	const resized = (await resizeImage(
+		{ type: "image", data: image.data, mimeType: image.mimeType },
+		{ maxWidth: params.maxSize ?? 2000, maxHeight: params.maxSize ?? 2000 }
+	)) as ResizedImage | null
+
+	if (!resized) {
+		const note = `Fetched image [${image.mimeType}]\n[Image omitted: could not be decoded or resized below the inline image size limit.]`
+		const result: ToolResult = {
+			content: [{ type: "text" as const, text: note }],
+			details: {
+				url: params.url,
+				mimeType: image.mimeType,
+				bytes: image.bytes,
+				contentLength: image.contentLength,
+				dimensions: originalDimensions
+			}
+		}
+		onUpdate?.(result)
+		return result
+	}
+
+	const dimensionNote = formatDimensionNote(resized)
+	const note = `Fetched image [${resized.mimeType}]${dimensionNote ? `\n${dimensionNote}` : ""}`
+	const dimensions = { widthPx: resized.width, heightPx: resized.height }
+	const result: ToolResult = {
+		content: [
+			{ type: "text" as const, text: note },
+			{ type: "image" as const, data: resized.data, mimeType: resized.mimeType }
+		],
+		details: {
+			url: params.url,
+			mimeType: resized.mimeType,
+			bytes: image.bytes,
+			contentLength: image.contentLength,
+			dimensions,
+			originalDimensions,
+			wasResized: resized.wasResized
+		}
+	}
+	onUpdate?.(result)
+	return result
+}

package/extensions/lovely-web/index.ts

@@ -0,0 +1,12 @@
+import type { ExtensionAPI } from "@earendil-works/pi-coding-agent"
+import { registerLovelyWebCommand } from "./command.js"
+import { applyToolConfig, loadConfig } from "./config.js"
+import { registerLovelyWebTools } from "./tools.js"
+
+export default function (pi: ExtensionAPI) {
+	pi.on("session_start", async (_event, ctx) => {
+		applyToolConfig(pi, loadConfig(ctx.cwd))
+	})
+	registerLovelyWebTools(pi)
+	registerLovelyWebCommand(pi)
+}