// Show native macOS UI from scripts and agents — dialogs, forms, visualizations, floating widgets, cursor companions. Use when you need to display HTML to the user, collect input, show a chart, render markdown, or create any visual interaction without a browser.
| name | glimpse |
| description | Show native macOS UI from scripts and agents — dialogs, forms, visualizations, floating widgets, cursor companions. Use when you need to display HTML to the user, collect input, show a chart, render markdown, or create any visual interaction without a browser. |
Glimpse opens a native macOS window with a WKWebView in under 50ms. You write HTML, the user sees it instantly. Bidirectional communication via window.glimpse.send() (webview -> Node) and .send(js) (Node -> webview).
When to use Glimpse:
Import: Always use the absolute path to glimpse.mjs within the installed package:
import { open, prompt } from '/Users/joemccann/dev/apps/util/glimpse-ui/src/glimpse.mjs';
const answer = await prompt(html, {
width: 400, height: 300,
title: 'My Dialog',
frameless: true,
transparent: true,
});
// answer = data from window.glimpse.send(), or null if user closed window
const win = open(html, options);
win.on('ready', (info) => {}); // HTML loaded
win.on('message', data => {}); // user interaction
win.on('closed', () => {}); // window gone
win.send('document.title = "Hi"'); // eval JS in webview
win.setHTML('<h1>New content</h1>'); // replace HTML
win.close(); // close window
{
width, height, // pixels (default: 800x600)
title, // window title (default: "Glimpse")
frameless: true, // no title bar, draggable by background
floating: true, // always on top
transparent: true, // transparent window background
clickThrough: true, // mouse passes through window
followCursor: true, // window follows mouse cursor
followMode: 'spring', // 'snap' (instant, default) or 'spring' (elastic)
cursorAnchor: 'top-right',
cursorOffset: {x, y},
openLinks: true, // open clicked links in default browser
autoClose: true, // close after first message
x, y, // exact screen position
timeout, // for prompt() only — ms before rejecting
}
window.glimpse.send(data) // send data to Node (any JSON-serializable value)
window.glimpse.close() // close the window from JS
prompt() with yes/no buttons, Enter/Escape keyboard handlingopen() + push updates via .send() as work progressescursor: pointer on clickable elementsautofocus on the primary input fieldbackground: transparent !important on <body>prompt() returns null when the user closes without sending — always handle thisSend branded macOS notifications with custom app icon using terminal-notifier. Use when implementing native Notification Center integration with custom branding.
Best practices and example-driven guidance for building SwiftUI views and components. Use when creating or refactoring SwiftUI UI, designing tab architecture with TabView, composing screens, or needing component-specific patterns and examples.
Use this skill when planning, auditing, or refining the assistant UX in the native macOS client, especially setup, settings, chat trust surfaces, prompt wrappers, and command transparency.
Use this skill when planning, auditing, or implementing Metal-backed macOS desktop surfaces, especially hybrid SwiftUI/AppKit plus MetalKit apps, shader packaging, MTKView integration, and Metal toolchain setup.