picocode-core 0.9.163 → 0.9.165

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "picocode-core",
-  "version": "0.9.163",
+  "version": "0.9.165",
   "description": "The agent runtime behind pico: sessions, tools, subagents, MCP, memory, and model access",
   "type": "module",
   "license": "MIT",

package/src/agent.js

@@ -2,7 +2,7 @@ import { readFile } from 'node:fs/promises'
 import { execFile } from 'node:child_process'
 import { promisify } from 'node:util'
 import { compose, scope, model, noToolsCalled, Inherit, getText } from '@prsm/ai'
-import { commitLabel, fileLabel, mediaTypeFor, selectionLabel } from './attachments.js'
+import { commitLabel, elementLabel, fileLabel, mediaTypeFor, selectionLabel } from './attachments.js'
 
 const exec = promisify(execFile)
 // a whole patch rides along only while it is small; a bigger commit
@@ -37,6 +37,7 @@ async function hydratePart(part) {
   if (part.type === 'file') return { type: 'text', text: fileLabel(part.path) }
   if (part.type === 'selection') return { type: 'text', text: selectionLabel(part) }
   if (part.type === 'commit') return hydrateCommit(part)
+  if (part.type === 'element') return { type: 'text', text: elementLabel(part) }
   if (part.type !== 'image' || part.source?.kind !== 'path') return part
   const mediaType = part.source.mediaType || mediaTypeFor(part.source.path)
   if (!mediaType) return { type: 'text', text: `[image unavailable: ${part.source.path}]` }

package/src/attachments.js

@@ -73,6 +73,13 @@ export function splitTextByImagePaths(text, exists = existsSync) {
 export const fileLabel = (path) => `[file: ${path}]`
 export const selectionLabel = (part) => `[selection: ${part.path}:${part.fromLine}-${part.toLine}]\n${part.text}\n[/selection]`
 export const commitLabel = (part) => `[commit: ${part.hash.slice(0, 7)} ${JSON.stringify(part.subject ?? '')}]`
+// a page element the user picked in a browser: where it is, what it is,
+// and its markup, so the model can find it in the source
+export function elementLabel(part) {
+  const styles = part.styles && Object.keys(part.styles).length ? `\ncomputed style: ${Object.entries(part.styles).map(([k, v]) => `${k}: ${v}`).join('; ')}` : ''
+  const rules = part.rules?.length ? `\nmatched css rules:\n${part.rules.join('\n')}` : ''
+  return `[element: <${part.tag}> ${part.selector} on ${part.url}${part.component ? ` in component ${part.component}` : ''}]\n${part.html}${styles}${rules}\n[/element]`
+}
 
 // [Image #n] and [File #n] placeholders in the composed text stand for
 // attachments; they become image, file, or selection parts of the user message
@@ -89,6 +96,8 @@ export function buildUserContent(text, attachments) {
       ? { type: 'selection', path: attachment.path, text: attachment.text, fromLine: attachment.fromLine, toLine: attachment.toLine, ...(Number.isInteger(attachment.fromColumn) ? { fromColumn: attachment.fromColumn } : {}), ...(Number.isInteger(attachment.toColumn) ? { toColumn: attachment.toColumn } : {}) }
       : attachment.kind === 'commit'
         ? { type: 'commit', hash: attachment.hash, subject: attachment.subject, root: attachment.root }
+      : attachment.kind === 'element'
+        ? { type: 'element', url: attachment.url, selector: attachment.selector, tag: attachment.tag, text: attachment.text, html: attachment.html, rect: attachment.rect, component: attachment.component ?? null, styles: attachment.styles ?? null, rules: attachment.rules ?? [] }
       : attachment.kind === 'file'
         ? { type: 'file', path: attachment.path }
         : { type: 'image', source: { kind: 'path', path: attachment.path, mediaType: attachment.mediaType } })
@@ -131,6 +140,10 @@ export function inputTextFromContent(content, { attachments, nextId }) {
       const placeholder = `[File #${nextId()}]`
       attachments.set(placeholder, { path: part.path, kind: 'file' })
       out += placeholder
+    } else if (part.type === 'element' && part.selector) {
+      const placeholder = `[File #${nextId()}]`
+      attachments.set(placeholder, { url: part.url, selector: part.selector, tag: part.tag, text: part.text, html: part.html, rect: part.rect, component: part.component ?? null, styles: part.styles ?? null, rules: part.rules ?? [], kind: 'element' })
+      out += placeholder
     } else if (part.type === 'commit' && part.hash) {
       const placeholder = `[File #${nextId()}]`
       attachments.set(placeholder, { hash: part.hash, subject: part.subject, root: part.root, kind: 'commit' })

package/src/controller.js

@@ -899,6 +899,14 @@ export function createController({ boot }) {
     return placeholder
   }
 
+  // an element picked in a browser page; the message carries its markup
+  function attachElement({ url, selector, tag, text = '', html = '', rect = null, component = null, styles = null, rules = [] }) {
+    if (!selector || !tag) return null
+    const placeholder = `[File #${++state.imageCount}]`
+    state.attachments.set(placeholder, { url: String(url ?? ''), selector: String(selector), tag: String(tag), text: String(text).slice(0, 400), html: String(html).slice(0, 4000), rect, component: component ? String(component) : null, styles: styles && typeof styles === 'object' ? styles : null, rules: Array.isArray(rules) ? rules.slice(0, 20).map(String) : [], kind: 'element' })
+    return placeholder
+  }
+
   // a project-relative pick: images attach as images, anything else as a
   // file reference
   function attachProjectFile(file) {
@@ -1398,6 +1406,7 @@ export function createController({ boot }) {
     attachFile,
     attachSelection,
     attachCommit,
+    attachElement,
     viewImage: deliverImage,
     attachProjectFile,
     detachImage,

package/src/derive.js

@@ -101,7 +101,7 @@ function foldMessage(state, event) {
   if (message.role === 'user') {
     const text = Array.isArray(message.content)
       ? message.content
-          .map((p) => (p.type === 'text' ? p.text : p.type === 'file' ? `[file: ${p.path}]` : p.type === 'selection' ? `[selection: ${p.path}:${p.fromLine}-${p.toLine}]` : p.type === 'commit' ? `[commit: ${String(p.hash).slice(0, 7)}]` : `[image: ${String(p.source?.path || '').split('/').pop() || 'attached'}]`))
+          .map((p) => (p.type === 'text' ? p.text : p.type === 'file' ? `[file: ${p.path}]` : p.type === 'selection' ? `[selection: ${p.path}:${p.fromLine}-${p.toLine}]` : p.type === 'commit' ? `[commit: ${String(p.hash).slice(0, 7)}]` : p.type === 'element' ? `[element: ${p.selector}]` : `[image: ${String(p.source?.path || '').split('/').pop() || 'attached'}]`))
           .join('')
       : String(message.content)
     state.transcript.push({ ...base, kind: 'user', text, content: message.content, ...(event.data.origin ? { origin: event.data.origin } : {}) })