Commit graph

42 commits

Author SHA1 Message Date
Mario Zechner
e533aebacd Fix Lit dependency duplication and update mini-lit to 0.2.0
- Move lit from dependencies to peerDependencies in web-ui to prevent multiple Lit instances being loaded
- Update mini-lit from 0.1.8/0.1.10 to 0.2.0 in root package.json and web-ui/package.json
- Install @tailwindcss/vite in web-ui/example
- Run biome formatting fixes across codebase

This resolves HMR custom element re-registration errors caused by duplicate Lit registries.
2025-11-12 16:03:43 +01:00
Mario Zechner
84dcab219b Add image support in tool results across all providers
Tool results now use content blocks and can include both text and images.
All providers (Anthropic, Google, OpenAI Completions, OpenAI Responses)
correctly pass images from tool results to LLMs.

- Update ToolResultMessage type to use content blocks
- Add placeholder text for image-only tool results in Google/Anthropic
- OpenAI providers send tool result + follow-up user message with images
- Fix Anthropic JSON parsing for empty tool arguments
- Add comprehensive tests for image-only and text+image tool results
- Update README with tool result content blocks API
2025-11-12 10:45:56 +01:00
Mario Zechner
389c80d7a8 Improve web-ui message and tool UX
- Add collapsible thinking blocks with shimmer animation during streaming
- Update user messages to use orange gradient pill styling (matching sitegeist)
- Fix cost display to only show for completed messages, not while streaming
- Update tool renderers to use ChevronsUpDown/ChevronUp icons instead of rotating ChevronRight
- Export ThinkingBlock component from public API
2025-10-30 20:42:04 +01:00
Mario Zechner
b6b64dff86 Better proxy handling. 2025-10-28 00:21:54 +01:00
Mario Zechner
55dc0b6e08 Add timestamp to messages 2025-10-26 00:43:43 +02:00
Mario Zechner
4ecbc2fe81 Debug tool rendering. 2025-10-18 01:11:31 +02:00
Mario Zechner
2d5054e6c0 Add reload button to HTML artifact header
Adds a reload button with RefreshCw icon to HTML artifact header buttons.
Clicking the button clears logs and re-executes the HTML content, useful
for manually refreshing when developing HTML artifacts or testing changes.

Changes:
- Import Button, icon from mini-lit and RefreshCw from lucide
- Add reload button to getHeaderButtons() that clears logs and calls executeContent()
- Add "Reload HTML" i18n key in English and German translations
2025-10-18 00:13:16 +02:00
Mario Zechner
92ce5a342f Add auto-reload for HTML artifacts when dependencies change
HTML artifacts can read other artifacts via getArtifact() and attachments.
When any artifact is created, updated, rewritten, or deleted, all HTML
artifacts now automatically reload to reflect the latest data.

Changes:
- Add reloadAllHtmlArtifacts() method to ArtifactsPanel
- Call reload after all artifact mutations (create/update/rewrite/delete)
- Make HtmlArtifact.sandboxIframeRef and executeContent() public
- Update runtime providers before re-executing HTML content

This ensures HTML artifacts always display current data from their dependencies.
2025-10-18 00:10:23 +02:00
Mario Zechner
2a7ccf0fcb Updates to prompts 2025-10-17 22:44:03 +02:00
Mario Zechner
ffc9be8867 Agent package + coding agent WIP, refactored web-ui prompts 2025-10-17 11:47:01 +02:00
Mario Zechner
4079bced36 Fix TypeScript errors and export UserMessageWithAttachments
- Export UserMessageWithAttachments type from web-ui index
- Remove unused i18n import from extract-document tool
- Update models.generated.ts (model order changes from API)

This fixes type errors when sitegeist uses custom user message renderer
2025-10-12 17:09:14 +02:00
Mario Zechner
f8b98f7dac Add extract_document tool and improve artifacts tab scrolling
- Add extract_document tool for extracting text from PDF/DOCX/XLSX/PPTX from URLs
- CORS proxy support from settings for fetching documents
- Proper error messages guiding users on CORS issues and manual file attachment
- Add scroll-into-view for active artifact tabs
- Export extract_document tool from web-ui package
2025-10-12 16:24:36 +02:00
Mario Zechner
f93e72a805 Committing manually like the monkey I am 2025-10-12 02:59:46 +02:00
Mario Zechner
26b774bb04 Add standalone mode for HTML artifact downloads
When downloading HTML artifacts, the generated HTML now works standalone
without requiring the extension runtime.

Changes:
- Add PrepareHtmlOptions config object to SandboxedIframe.prepareHtmlDocument()
- Add isStandalone flag to skip runtime bridge and navigation interceptor
- When isStandalone=true:
  - window.sendRuntimeMessage is NOT defined
  - Navigation interceptor is NOT injected
  - Artifact runtime providers fall back to embedded data
- HtmlArtifact download button now uses isStandalone: true

This fixes the issue where downloaded HTML artifacts would:
- Try to call window.sendRuntimeMessage (which would fail silently)
- Try to postMessage to non-existent parent window
- Not work when opened via file:// protocol

Now downloaded artifacts work completely standalone with embedded data.
2025-10-12 00:39:26 +02:00
Mario Zechner
b129154cc8 Add ToolRenderResult interface for custom tool rendering
- Changed ToolRenderer return type from TemplateResult to ToolRenderResult
- ToolRenderResult = { content: TemplateResult, isCustom: boolean }
- isCustom: true = no card wrapper, false = wrap in card
- Updated all existing tool renderers to return new format
- Updated Messages.ts to handle custom rendering

This enables tools to render without default card chrome when needed.
2025-10-11 04:40:42 +02:00
Mario Zechner
2756f2a974 Refactor JavaScript REPL tool description with consistent pattern
Clean up and restructure JavaScript REPL description following consistent pattern:
- Purpose section
- When to Use section
- Environment section
- Common Libraries section
- Important Notes section
- Example section

Removed buildJavaScriptReplDescription() function - no longer dynamically
injecting runtime provider docs into tool description (will move to system prompt).

Changes:
- Replace JAVASCRIPT_REPL_BASE_DESCRIPTION with JAVASCRIPT_REPL_DESCRIPTION
- Remove JAVASCRIPT_REPL_CHART_EXAMPLE and JAVASCRIPT_REPL_FOOTER
- Remove buildJavaScriptReplDescription() function
- Update javascript-repl tool to use static description
- Simpler, more scannable structure with clear hierarchy
2025-10-10 11:31:11 +02:00
Mario Zechner
961112ff83 Fix abort detection to use message stopReason instead of global isStreaming
When abort happens during tool call streaming, the tool result should show as aborted.
Previously used global isStreaming state which would flip when new messages streamed in,
causing spinner to reappear incorrectly.

Changes:
- Use message.stopReason === "aborted" to detect aborted tool calls
- Create synthetic error result for aborted tool calls in ToolMessage component
- Fix Ollama provider key test to return true (can't know which model to test)
- Add newline before HTML execution logs in artifacts update
2025-10-10 01:40:59 +02:00
Mario Zechner
6bc098e57b HTML artifacts call window.complete() when page loads
- Inject <script>if (window.complete) window.complete();</script> before </html>
- HTML artifacts are long-running and don't time out
- Console logs are sent immediately, completion signals when page is ready
- Removes need for artificial timeout in HTML artifacts
2025-10-09 23:49:22 +02:00
Mario Zechner
c0ad46fa01 Fix javascript-repl to throw errors on execution failure
- Throw error instead of returning output when result.success is false
- Ensures tool call is marked as failed when code execution fails or is aborted
- Matches browser-javascript error handling pattern
2025-10-09 23:30:40 +02:00
Mario Zechner
4ac774cbbb Fix console logging and message routing
Console Logging Improvements:
- Changed ConsoleRuntimeProvider to send logs immediately instead of batching
- Track pending send promises and await them in onCompleted callback
- Ensures REPL gets all logs before execution-complete
- Enables real-time console logging for HTML artifacts

Message Routing Fixes:
- Remove "handled" concept from message routing - broadcast all messages to all providers/consumers
- Change handleMessage return type from Promise<boolean> to Promise<void>
- Add debug logging to RuntimeMessageRouter to trace message flow
- Fix duplicate error logging (window error handler now only tracks errors, doesn't log them)

Output Formatting Consistency:
- Remove [LOG], [ERROR] prefixes from console output in both tools
- Show console logs before error messages
- Use "=> value" format for return values in both javascript-repl and browser-javascript
- Remove duplicate "Error:" prefix and extra formatting

Bug Fixes:
- Fix race condition where execution-complete arrived before console logs
- Fix ConsoleRuntimeProvider blocking execution-complete from reaching consumers
- Remove duplicate console log collection from SandboxedIframe
- Fix return value capture by wrapping user code in async function
2025-10-09 23:20:14 +02:00
Mario Zechner
8747e01c31 Display return values and fix duplicate error messages in REPL
- javascript-repl now displays return values with => prefix
- Objects are JSON.stringify'd with formatting
- Removed console.error from wrapper to prevent duplicate error messages
- Error is already captured and sent via execution-error message
- Fixes missing return value display and duplicate error output
2025-10-09 20:51:25 +02:00
Mario Zechner
c2793d8017 Add runtime bridge architecture and fix HTML escaping
Major refactoring to unify runtime providers across sandbox and user script contexts:

1. Runtime Bridge & Router
   - Add RuntimeMessageBridge for unified messaging abstraction
   - Rename SandboxMessageRouter → RuntimeMessageRouter
   - Router now handles both iframe and user script messages
   - Guard for non-extension environments

2. Provider Refactoring
   - ArtifactsRuntimeProvider: Add offline mode with snapshot fallback
   - AttachmentsRuntimeProvider: Remove returnDownloadableFile (moved to dedicated provider)
   - ConsoleRuntimeProvider: Add message collection, remove lifecycle logic
   - FileDownloadRuntimeProvider: New provider for file downloads

3. HTML Escaping Fix
   - Escape </script> in JSON.stringify output to prevent premature tag closure
   - Applies when injecting provider data into <script> tags
   - JavaScript engine automatically unescapes, no runtime changes needed

4. Function Renaming
   - listFiles → listAttachments
   - readTextFile → readTextAttachment
   - readBinaryFile → readBinaryAttachment
   - returnFile → returnDownloadableFile

5. Updated Exports
   - Export new RuntimeMessageBridge and RuntimeMessageRouter
   - Export FileDownloadRuntimeProvider
   - Update all cross-references

This sets the foundation for reusing providers in browser-javascript tool.
2025-10-09 17:32:45 +02:00
Mario Zechner
d7d79bd533 Add image artifact support with proper binary downloads
- Add ImageArtifact component for displaying images (.png, .jpg, .jpeg, .gif, .webp, .bmp, .ico)
- Images stored as base64, displayed via data URLs
- Download button properly decodes base64 to Uint8Array for valid binary downloads
- Fix Lit ChildPart error: use CSS rotation instead of innerHTML manipulation in collapsible headers

Changes:
- web-ui/src/tools/artifacts/ImageArtifact.ts: New image artifact component
- web-ui/src/tools/artifacts/artifacts.ts: Add "image" file type support
- web-ui/src/tools/renderer-registry.ts: Fix collapsible chevron to use CSS rotation
- web-ui/src/index.ts: Export ImageArtifact
2025-10-09 04:34:42 +02:00
Mario Zechner
9687551324 Don't access innerHTML like that or lit kills itself. 2025-10-09 04:26:03 +02:00
Mario Zechner
4d2ca6ab2a Add artifact message persistence for session reconstruction
- Add ArtifactMessage type as core part of AppMessage union (not CustomMessages)
- ArtifactsRuntimeProvider appends artifact messages on create/update/delete
- MessageList filters out artifact messages (UI display only)
- artifacts.ts reconstructFromMessages handles artifact messages
- Export ARTIFACTS_RUNTIME_PROVIDER_DESCRIPTION from main index
- Fix artifact creation bug: pass filename as title instead of mimeType

Changes:
- web-ui/src/components/Messages.ts: Add ArtifactMessage to BaseMessage union
- web-ui/src/components/MessageList.ts: Skip artifact messages in render
- web-ui/src/components/sandbox/ArtifactsRuntimeProvider.ts: Append messages, fix title parameter
- web-ui/src/ChatPanel.ts: Pass agent.appendMessage callback
- web-ui/src/tools/artifacts/artifacts.ts: Handle artifact messages in reconstructFromMessages
- web-ui/src/index.ts: Export ARTIFACTS_RUNTIME_PROVIDER_DESCRIPTION
- web-ui/example/src/custom-messages.ts: Update message transformer to filter artifacts
2025-10-09 04:07:59 +02:00
Mario Zechner
0eaa879d46 Fix various sandbox issues. 2025-10-08 22:51:32 +02:00
Mario Zechner
91c1dc6475 Add ollama dependency and dialog backdrop blur
- Add ollama package to web-ui dependencies for ModelSelector
- Add backdrop blur to SettingsDialog (bg-black/50 backdrop-blur-sm)
- Update mini-lit to 0.1.9 for backdropClassName prop support
- Fix TypeScript errors in ModelSelector (ollama import, parameter types)
- Add backward compatibility methods to SessionsStore (saveSession, loadSession, getLatestSessionId)
2025-10-08 17:49:56 +02:00
Mario Zechner
b3cce7b400 Fix spinner showing on aborted tool calls in javascript-repl and artifacts renderers
When isStreaming is false and there's no result (aborted state), show 'complete' state instead of 'inprogress' to avoid showing the spinner.
2025-10-08 14:43:23 +02:00
Mario Zechner
46b1abff1d Add cursor-pointer to collapsible header button 2025-10-08 14:17:48 +02:00
Mario Zechner
9a57aa7e1a Prevent default and stop propagation when clicking artifact pill
This prevents the collapsible header from toggling when the pill is clicked.
2025-10-08 14:17:04 +02:00
Mario Zechner
3adc8357b1 Make openArtifact public and remove type cast in ArtifactPill 2025-10-08 14:12:52 +02:00
Mario Zechner
58b9c36268 Make renderHeader and renderCollapsibleHeader accept string | TemplateResult
- Update renderHeader and renderCollapsibleHeader in renderer-registry.ts to accept `text: string | TemplateResult`
- Remove duplicated renderCollapsibleHeaderWithPill helper in artifacts-tool-renderer.ts
- Update all artifact renderer calls to use renderHeaderWithPill() inline
- Remove all separate pill rendering below headers

This allows artifact pills to be rendered inline with header text without code duplication.
2025-10-08 14:12:02 +02:00
Mario Zechner
547be7ce37 Add clickable artifact pills to tool renderer
- Create ArtifactPill component (similar to SkillPill)
- Renders filename as clickable pill with FileCode2 icon
- Clicking pill opens artifacts panel and selects that artifact
- Update ArtifactsToolRenderer to accept artifactsPanel reference
- Pass artifactsPanel from ChatPanel to renderer on initialization
- Display artifact pill below header for all commands
- Pill only clickable when artifactsPanel reference is available
2025-10-08 14:01:25 +02:00
Mario Zechner
b3efac4591 Update artifacts-tool-renderer to use collapsible headers
- All actions except DELETE now use collapsible headers
- CREATE/UPDATE/REWRITE/GET/LOGS: code/output collapsed by default
- DELETE: keeps simple non-collapsible header
- Fix isStreaming parameter usage for proper spinner state
- Add smooth 300ms animation on expand/collapse
- Full header is clickable to toggle collapse state
2025-10-08 13:46:52 +02:00
Mario Zechner
1405c47b50 Make entire collapsible header clickable
- Changed outer div to button element
- Added w-full and text-left classes
- Now click anywhere on header (icon, text, chevron) to expand/collapse
2025-10-08 13:44:59 +02:00
Mario Zechner
f646a29d1a Add collapsible tool renderers with animated expand/collapse
- Add renderCollapsibleHeader() to renderer-registry
  - Places chevron on right, spinner on left
  - Toggles between ChevronRight (collapsed) and ChevronDown (expanded)
  - Uses max-h-0/max-h-[2000px] with transition-all for smooth animation
  - Dynamically adds/removes mt-3 to avoid margin when collapsed

- Update javascript-repl renderer to use collapsible sections
  - Code and console output hidden by default
  - Only file attachments remain visible
  - 300ms smooth animation on expand/collapse

- Export renderCollapsibleHeader from web-ui index
2025-10-08 13:38:45 +02:00
Mario Zechner
8ec9805112 Refactor artifacts renderer and add Console component
- Extract ArtifactsToolRenderer from ArtifactsPanel into standalone renderer
- Fix ChatPanel to register ArtifactsToolRenderer instead of panel
- Implement command-specific rendering logic (create/update/rewrite/get/logs/delete)
- Create reusable Console component with copy button and autoscroll toggle
- Replace custom console implementation with ExpandableSection and Console
- Fix Lit reactivity for HtmlArtifact logs using spread operator
- Add Lucide icons (FileCode2, ChevronsDown, Lock) for UI consistency
- Follow skill.ts patterns with renderHeader and state handling
- Add i18n strings for all artifact actions and console features
2025-10-08 01:54:50 +02:00
Mario Zechner
aaea0f4600 Integrate JailJS for CSP-restricted execution in browser extension
Major changes:
- Migrate browser-extension to use web-ui package (85% code reduction)
- Add JailJS content script with ES6+ transform support
- Expose DOM constructors (Event, KeyboardEvent, etc.) to JailJS
- Support top-level await by wrapping code in async IIFE
- Add returnFile() support in JailJS execution
- Refactor KeyStore into pluggable storage-adapter pattern
- Make ChatPanel configurable with sandboxUrlProvider and additionalTools
- Update jailjs to 0.1.1

Files deleted (33 duplicate files):
- All browser-extension components, dialogs, state, tools, utils
- Now using web-ui versions via @mariozechner/pi-web-ui

Files added:
- packages/browser-extension/src/content.ts (JailJS content script)
- packages/web-ui/src/state/storage-adapter.ts
- packages/web-ui/src/state/key-store.ts

Browser extension now has only 5 source files (down from 38).
2025-10-05 16:58:31 +02:00
Mario Zechner
f2eecb78d2 web-ui package 2025-10-05 13:30:08 +02:00
Mario Zechner
7159c9734e Update web-ui example to use javascript-repl instead of calculate/getCurrentTime tools 2025-10-04 21:52:30 +02:00
Mario Zechner
9d6267a915 Fix javascript-repl renderer to use console-block component 2025-10-04 21:44:23 +02:00
Mario Zechner
8212623af0 Add JavaScript REPL tool to web-ui package
- Created javascript-repl.ts tool with SandboxedIframe for code execution
- Integrated into ChatPanel replacing calculate and getCurrentTime tools
- REPL provides full browser API access with external library support
- Auto-registers renderer for tool output display
- Uses srcdoc instead of sandbox.html (no CSP restrictions in web apps)
2025-10-04 19:12:38 +02:00