@dorsk/yubisashi 0.1.0 → 0.2.0

package/README.md

@@ -1,66 +1,98 @@
 # yubisashi 指差し
 
-Point at your running app, say what's wrong, and the coding agent working on it gets the
-element's source `file:line`, the components that rendered it, and your comment. It answers,
-edits, and hot-reload shows you the result. The agent's conversation streams in a panel next to
-the app.
+Point at elements of your running app from a review panel and hand the coding agent the exact
+source `file:line`, the component chain, the selector and your comment.
 
-![pick mode](docs/pick.png)
+The review panel lives in [cctui](https://github.com/DorskFR/cctui) as the opt-in **yubisashi**
+plugin. This package is the app side: a framework-free picker that runs inside the framed app,
+and a Vite plugin that injects it in dev.
 
-## How it works
+## Use
+
+```sh
+npm install --save-dev @dorsk/yubisashi
+```
+
+```ts
+// vite.config.ts
+import { yubisashi } from '@dorsk/yubisashi/vite';
 
-`yubi up` puts a small proxy in front of your dev server. Everything passes through to the app,
-including HMR websockets. Frame-blocking headers are stripped, so the app can be shown inside
-the review shell at `/__yubi/`:
+export default defineConfig({
+	plugins: [sveltekit(), yubisashi()],
+});
+```
 
-- **Comment**: press `C` or the ⌖ button, then click an element. Shift-click adds more
-  elements; `Esc` cancels. A glass layer takes the clicks, so the app doesn't react, and
-  disabled controls can be picked too.
-- **Source location** comes from Svelte 5's dev-mode `__svelte_meta`, which gives exact
-  `file:line:col` plus the component chain. For other frameworks you still get the selector,
-  text and HTML.
-- **Conversation tab**: follows the agent's Claude Code transcript live
-  (`~/.claude/projects/*/<session>.jsonl`).
-- **Comments tab**: one thread per comment, with status and a pin on the element.
+```sh
+YUBI_PARENT_ORIGIN=https://cctui.example.com npm run dev
+```
 
-Your comments reach the agent through `yubi wait`. The agent runs it as a background command,
-it blocks until you send something, then exits with your messages. Claude Code wakes the agent
-when a background command exits, so it needs no MCP server, no special launch flags, and no
-polling. The same works in any Claude Code session, including cctui ones.
+Then in cctui: **Settings → Plugins → yubisashi**, open the **Review** pane and point it at the
+dev server. Press `C` or the ⌖ button, click an element (shift-click adds more, `Esc` backs
+out) and write the comment.
 
-![comments](docs/comments.png)
+The plugin only runs under `vite dev` (`apply: 'serve'`) and does nothing at all unless
+`YUBI_PARENT_ORIGIN` (comma-separated origins) or the `parentOrigin` option is set. When active,
+it:
 
-## Use
+- injects `<script type="module" src="/@id/__x00__virtual:yubisashi">` into every HTML
+  response, which calls `createPicker({ parentOrigin })` only when the page is inside an iframe;
+- drops `X-Frame-Options` and rewrites CSP `frame-ancestors` to the configured origins so the
+  panel may frame the app.
 
-```sh
-# from the app directory, as a background command in the agent's session
-yubi up --target http://localhost:5173 -- npm run dev
-yubi url            # the link to open (carries the access token)
-yubi wait           # background: exits with the user's next messages
-yubi reply 3 "…"    # answer in thread #3
-yubi resolve 3 "…"  # close it with what changed
-yubi dismiss 3 "…"  # close it without acting
-yubi list [--all]
+An `https` parent cannot frame a plain `http` page unless it is on `localhost`, so run the dev
+server over https (`server.https`) when it lives anywhere else.
+
+Source locations come from Svelte 5's dev-mode `__svelte_meta`. Other frameworks still get
+selector, text, attributes and HTML.
+
+## Picker on its own
+
+```ts
+import { createPicker } from '@dorsk/yubisashi/picker';
+
+if (window.parent !== window)
+	createPicker({ parentOrigin: ['https://cctui.example.com', 'http://localhost:5555'] });
 ```
 
-`skill/SKILL.md` teaches an agent this loop. Link it into `~/.claude/skills/yubisashi` so every
-session knows it.
+The picker talks to the parent window through `postMessage` only. It accepts messages solely
+from `window.parent` at an allowed origin; with several origins it pins itself to the one that
+frames the document (`ancestorOrigins` / `referrer`), otherwise to the first allowed origin
+that sends a valid message.
 
-State lives in `.yubisashi/` in the app directory. It's added to `.git/info/exclude`
-automatically and holds the comments, the token and the server address.
+## Protocol
 
-## Security
+Every message, both ways, carries `yubi: 1`; anything without it is ignored.
 
-The API lets anyone who can reach it inject prompts into your agent's session. It binds to
-127.0.0.1 by default, and every API call needs the random token in `.yubisashi/token`, which
-also stops other sites in your browser from posting to it. Think twice before `--host 0.0.0.0`.
+Parent → app:
 
-## Develop
+| type         | fields                     |
+| ------------ | -------------------------- |
+| `pick:start` |                            |
+| `pick:stop`  |                            |
+| `pick:clear` | `id?: number` (pin the selection to comment #id) |
+| `pins:set`   | `pins: { id, selector }[]` |
 
-Node ≥ 22.18 runs the TypeScript sources directly; there is no build step.
+App → parent:
+
+| type            | fields                                          |
+| --------------- | ----------------------------------------------- |
+| `route`         | `route: string`                                 |
+| `pick:state`    | `picking: boolean`                              |
+| `pick:hover`    | `target: Target \| null`                        |
+| `pick:selected` | `targets: Target[]`, `route`, `viewport`        |
+| `pick:cancel`   |                                                 |
+| `pin:open`      | `id: number`                                    |
+
+`Target`: `tag`, `selector`, `text`, `html`, `attrs`, `rect`, `source?: { file, line, column }`,
+`stack: Frame[]` (the components that rendered it). Types and the `isParentMessage` /
+`isChildMessage` guards are exported from `@dorsk/yubisashi/picker`.
+
+## Develop
 
 ```sh
 npm install
-npm test        # unit, proxy/API integration, and a Playwright end-to-end run
-npm run check   # tsc + biome
+npx playwright install chromium
+npm run lint    # biome
+npm run check   # tsc
+npm test        # builds dist, then Playwright tests for the picker and the Vite plugin (plain Vite + SvelteKit)
 ```

package/dist/picker/index.d.ts

@@ -0,0 +1,2 @@
+export { describe, label, selectorOf } from './inspect.ts';
+export { type ChildMessage, createPicker, type Frame, isChildMessage, isParentMessage, type ParentMessage, type PickerHandle, type PickerOptions, type Pin, type Target, type Unmarked, type Viewport, YUBI, } from './picker.ts';

package/dist/picker/index.js

@@ -0,0 +1,3 @@
+export { describe, label, selectorOf } from "./inspect.js";
+export { createPicker, isChildMessage, isParentMessage, YUBI, } from "./picker.js";
+//# sourceMappingURL=index.js.map

package/dist/picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC3D,OAAO,EAEN,YAAY,EAEZ,cAAc,EACd,eAAe,EAQf,IAAI,GACJ,MAAM,aAAa,CAAC"}

package/dist/picker/inspect.d.ts

@@ -0,0 +1,5 @@
+import type { Target } from './protocol.ts';
+export declare const shortFile: (file?: string) => string;
+export declare function selectorOf(el: Element): string;
+export declare function describe(el: Element): Target;
+export declare const label: (info: Target) => string;

package/dist/picker/inspect.js

@@ -0,0 +1,87 @@
+export const shortFile = (file) => (file ? (file.split('/').at(-1) ?? '') : '');
+function svelteMeta(el) {
+    for (let node = el; node; node = node.parentElement) {
+        const meta = node.__svelte_meta;
+        if (meta)
+            return meta;
+    }
+    return null;
+}
+function stackOf(meta) {
+    const frames = [];
+    for (let p = meta?.parent; p && frames.length < 12; p = p.parent) {
+        if (p.type !== 'component' || p.file?.includes('.svelte-kit/generated'))
+            continue;
+        frames.push({
+            type: p.type,
+            name: p.componentTag ? `<${p.componentTag}>` : undefined,
+            file: p.file,
+            line: p.line,
+            column: p.column,
+        });
+    }
+    return frames;
+}
+const SCOPED_CLASS = /^(svelte|s)-[\w-]{5,}$/;
+const HOOK_ATTRS = ['data-testid', 'data-verb', 'data-test'];
+const KEPT_ATTRS = ['role', 'aria-label', 'href', 'name', 'type', 'title', 'alt'];
+export function selectorOf(el) {
+    const doc = el.ownerDocument;
+    const parts = [];
+    for (let node = el; node && node.nodeType === 1 && node !== doc.documentElement; node = node.parentElement) {
+        for (const attr of HOOK_ATTRS) {
+            const value = node.getAttribute(attr);
+            if (value) {
+                parts.unshift(`[${attr}="${CSS.escape(value)}"]`);
+                return parts.join(' > ');
+            }
+        }
+        if (node.id && !/\d{3,}/.test(node.id)) {
+            parts.unshift(`#${CSS.escape(node.id)}`);
+            return parts.join(' > ');
+        }
+        let part = node.localName;
+        const classes = [...node.classList].filter((c) => !SCOPED_CLASS.test(c)).slice(0, 2);
+        if (classes.length)
+            part += classes.map((c) => `.${CSS.escape(c)}`).join('');
+        const siblings = node.parentElement
+            ? [...node.parentElement.children].filter((s) => s.localName === node.localName)
+            : [];
+        if (siblings.length > 1)
+            part += `:nth-of-type(${siblings.indexOf(node) + 1})`;
+        parts.unshift(part);
+        if (parts.length >= 6)
+            break;
+    }
+    return parts.join(' > ');
+}
+export function describe(el) {
+    const meta = svelteMeta(el);
+    const attrs = {};
+    for (const a of el.attributes) {
+        if (a.name.startsWith('data-') || KEPT_ATTRS.includes(a.name))
+            attrs[a.name] = a.value.slice(0, 200);
+    }
+    const r = el.getBoundingClientRect();
+    const html = el.outerHTML.replace(/\s+/g, ' ');
+    const text = el.innerText ?? el.textContent ?? '';
+    return {
+        tag: el.localName,
+        selector: selectorOf(el),
+        text: text.replace(/\s+/g, ' ').trim().slice(0, 100),
+        html: html.length > 500 ? `${html.slice(0, 500)}…` : html,
+        attrs,
+        rect: {
+            x: Math.round(r.x),
+            y: Math.round(r.y),
+            width: Math.round(r.width),
+            height: Math.round(r.height),
+        },
+        source: meta
+            ? { file: meta.loc.file, line: meta.loc.line, column: meta.loc.column ?? 0 }
+            : undefined,
+        stack: stackOf(meta),
+    };
+}
+export const label = (info) => `<${info.tag}> ${info.source ? `${shortFile(info.source.file)}:${info.source.line}` : info.selector}`;
+//# sourceMappingURL=inspect.js.map

package/dist/picker/inspect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inspect.js","sourceRoot":"","sources":["../../src/picker/inspect.ts"],"names":[],"mappings":"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"}

package/dist/picker/picker.d.ts

@@ -0,0 +1,29 @@
+import { type ChildMessage, type Frame, type ParentMessage, type Pin, type Target, type Unmarked, type Viewport } from './protocol.ts';
+export { isChildMessage, isParentMessage, YUBI } from './protocol.ts';
+export type { ChildMessage, Frame, ParentMessage, Pin, Target, Unmarked, Viewport };
+export type PickerOptions = {
+    /**
+     * Origin(s) allowed to host the review panel; messages from anywhere else are ignored.
+     * With several, the one framing the document (ancestorOrigins / referrer) is used; when that
+     * is unknown, messages go to every allowed origin until one has sent a valid message.
+     */
+    parentOrigin: string | string[];
+    parent?: Window;
+    doc?: Document;
+    /** Milliseconds between route checks. */
+    routeEveryMs?: number;
+};
+export type PickerHandle = {
+    start(): void;
+    stop(): void;
+    clear(id?: number): void;
+    setPins(pins: Pin[]): void;
+    readonly picking: boolean;
+    readonly selection: readonly Target[];
+    destroy(): void;
+};
+/**
+ * Runs inside the app document: covers it with a glass pane while picking, draws hover/selection
+ * boxes and comment pins, and talks to the review panel through `postMessage` only.
+ */
+export declare function createPicker(options: PickerOptions): PickerHandle;

package/dist/picker/picker.js

@@ -0,0 +1,265 @@
+import { describe, label } from "./inspect.js";
+import { isParentMessage, YUBI, } from "./protocol.js";
+export { isChildMessage, isParentMessage, YUBI } from "./protocol.js";
+const TYPING = 'input, textarea, [contenteditable=""], [contenteditable="true"]';
+const ACCENT = '#f0883e';
+const INK = '#111';
+const MONO = 'ui-monospace, "JetBrains Mono", "SF Mono", monospace';
+const SANS = 'ui-sans-serif, system-ui, sans-serif';
+const routeOf = (win) => win.location.pathname + win.location.search + win.location.hash;
+function framingOrigin(doc) {
+    const ancestors = doc.location.ancestorOrigins;
+    if (ancestors?.length)
+        return ancestors[0];
+    try {
+        return doc.referrer ? new URL(doc.referrer).origin : undefined;
+    }
+    catch {
+        return undefined;
+    }
+}
+/**
+ * Runs inside the app document: covers it with a glass pane while picking, draws hover/selection
+ * boxes and comment pins, and talks to the review panel through `postMessage` only.
+ */
+export function createPicker(options) {
+    const doc = options.doc ?? document;
+    const win = doc.defaultView;
+    const parent = options.parent ?? win.parent;
+    const allowed = [options.parentOrigin].flat().map((o) => new URL(o).origin);
+    let origin = allowed.find((o) => o === framingOrigin(doc));
+    const root = doc.createElement('div');
+    root.setAttribute('data-yubi', 'root');
+    root.style.cssText = 'position:fixed;inset:0;z-index:2147483646;pointer-events:none;';
+    const overlay = doc.createElement('div');
+    overlay.setAttribute('data-yubi', 'overlay');
+    overlay.style.cssText = 'position:absolute;inset:0;overflow:hidden;pointer-events:none;';
+    const glass = doc.createElement('div');
+    glass.setAttribute('data-yubi', 'glass');
+    glass.style.cssText =
+        'position:absolute;inset:0;cursor:crosshair;pointer-events:auto;display:none;';
+    root.append(overlay, glass);
+    doc.documentElement.append(root);
+    let picking = false;
+    let hover = null;
+    let selection = [];
+    let pins = [];
+    const refs = new Map();
+    let route = routeOf(win);
+    let raf = 0;
+    const send = (message) => {
+        const data = { ...message, yubi: YUBI };
+        for (const o of origin ? [origin] : allowed)
+            parent.postMessage(data, o);
+    };
+    const viewport = () => ({ width: win.innerWidth, height: win.innerHeight });
+    const elementAt = (x, y) => doc.elementsFromPoint(x, y).find((el) => !root.contains(el)) ?? null;
+    function setPicking(on) {
+        if (picking === on)
+            return;
+        picking = on;
+        glass.style.display = on ? 'block' : 'none';
+        if (!on)
+            setHover(null);
+        send({ type: 'pick:state', picking });
+    }
+    function setHover(el) {
+        if ((hover?.el ?? null) === el)
+            return;
+        hover = el ? { el, info: describe(el) } : null;
+        send({ type: 'pick:hover', target: hover?.info ?? null });
+    }
+    function setSelection(next) {
+        selection = next;
+        send({
+            type: 'pick:selected',
+            targets: selection.map((s) => s.info),
+            route: routeOf(win),
+            viewport: viewport(),
+        });
+    }
+    function pick(el, additive) {
+        const i = selection.findIndex((s) => s.el === el);
+        if (additive) {
+            setSelection(i >= 0 ? selection.filter((_, j) => j !== i) : [...selection, { el, info: describe(el) }]);
+        }
+        else {
+            setSelection([{ el, info: describe(el) }]);
+            setPicking(false);
+        }
+    }
+    function back() {
+        if (picking)
+            setPicking(false);
+        else if (selection.length)
+            setSelection([]);
+        else
+            send({ type: 'pick:cancel' });
+    }
+    function onKey(e) {
+        if (e.key === 'Escape')
+            return back();
+        const typing = e.target?.closest?.(TYPING);
+        if (!typing && (e.key === 'c' || e.key === 'C') && !e.metaKey && !e.ctrlKey && !e.altKey) {
+            e.preventDefault();
+            setPicking(!picking);
+        }
+    }
+    function onWheel(e) {
+        for (let node = elementAt(e.clientX, e.clientY); node; node = node.parentElement) {
+            const style = win.getComputedStyle(node);
+            if (/(auto|scroll)/.test(style.overflowY + style.overflowX)) {
+                const before = node.scrollTop + node.scrollLeft;
+                node.scrollBy(e.deltaX, e.deltaY);
+                if (node.scrollTop + node.scrollLeft !== before)
+                    return;
+            }
+        }
+        win.scrollBy(e.deltaX, e.deltaY);
+    }
+    function onMessage(e) {
+        if (e.source !== parent || !isParentMessage(e.data))
+            return;
+        if (origin ? e.origin !== origin : !allowed.includes(e.origin))
+            return;
+        origin = e.origin;
+        const msg = e.data;
+        if (msg.type === 'pick:start')
+            setPicking(true);
+        else if (msg.type === 'pick:stop')
+            setPicking(false);
+        else if (msg.type === 'pick:clear')
+            clear(msg.id);
+        else
+            setPins(msg.pins);
+    }
+    function clear(id) {
+        if (id !== undefined && selection.length)
+            refs.set(id, selection.map((s) => s.el));
+        if (selection.length)
+            setSelection([]);
+    }
+    function setPins(next) {
+        pins = next;
+    }
+    function locatePin(pin) {
+        const kept = refs.get(pin.id)?.find((el) => el.isConnected);
+        if (kept)
+            return kept;
+        try {
+            return doc.querySelector(pin.selector) ?? undefined;
+        }
+        catch {
+            return undefined;
+        }
+    }
+    const nodes = new Map();
+    function place(el, x, y, width, height) {
+        el.style.left = `${x}px`;
+        el.style.top = `${y}px`;
+        if (width !== undefined)
+            el.style.width = `${width}px`;
+        if (height !== undefined)
+            el.style.height = `${height}px`;
+    }
+    function box(key, rect, kind, text) {
+        let el = nodes.get(key);
+        if (!el) {
+            el = doc.createElement('div');
+            el.setAttribute('data-yubi', kind);
+            el.style.cssText = `position:absolute;border:2px ${kind === 'hover' ? 'dashed' : 'solid'} ${ACCENT};border-radius:3px;background:rgb(240 136 62 / ${kind === 'hover' ? 0.05 : 0.08});box-sizing:border-box;`;
+            const tag = doc.createElement('span');
+            tag.setAttribute('data-yubi', 'label');
+            tag.style.cssText = `position:absolute;top:-20px;left:-2px;padding:1px 6px;border-radius:3px 3px 3px 0;background:${ACCENT};color:${INK};font:11px/18px ${MONO};white-space:nowrap;`;
+            el.append(tag);
+            nodes.set(key, el);
+        }
+        place(el, rect.x, rect.y, rect.width, rect.height);
+        const tag = el.firstChild;
+        if (tag.textContent !== text)
+            tag.textContent = text;
+        return el;
+    }
+    function pinNode(pin, rect) {
+        const key = `pin:${pin.id}`;
+        let el = nodes.get(key);
+        if (!el) {
+            el = doc.createElement('button');
+            el.type = 'button';
+            el.setAttribute('data-yubi', 'pin');
+            el.setAttribute('data-id', String(pin.id));
+            el.textContent = String(pin.id);
+            el.title = `Open comment #${pin.id}`;
+            el.style.cssText = `position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;padding:0;border:0;border-radius:11px 11px 11px 2px;background:${ACCENT};color:${INK};font:600 11px/22px ${SANS};text-align:center;pointer-events:auto;cursor:pointer;box-shadow:0 1px 4px rgb(0 0 0 / 0.4);`;
+            el.onclick = () => send({ type: 'pin:open', id: pin.id });
+            nodes.set(key, el);
+        }
+        place(el, rect.x + rect.width, rect.y);
+        return el;
+    }
+    function draw() {
+        const layers = [];
+        if (picking && hover?.el.isConnected && !selection.some((s) => s.el === hover?.el)) {
+            layers.push(box('hover', hover.el.getBoundingClientRect(), 'hover', label(hover.info)));
+        }
+        selection.forEach((s, i) => {
+            if (s.el.isConnected)
+                layers.push(box(`sel:${i}`, s.el.getBoundingClientRect(), 'selected', label(s.info)));
+        });
+        for (const pin of pins) {
+            const el = locatePin(pin);
+            if (el)
+                layers.push(pinNode(pin, el.getBoundingClientRect()));
+        }
+        for (const [key, el] of nodes)
+            if (!layers.includes(el))
+                nodes.delete(key);
+        if (layers.length !== overlay.childNodes.length ||
+            layers.some((el, i) => overlay.childNodes[i] !== el))
+            overlay.replaceChildren(...layers);
+        raf = win.requestAnimationFrame(draw);
+    }
+    const onMove = (e) => setHover(elementAt(e.clientX, e.clientY));
+    const onLeave = () => setHover(null);
+    const onClick = (e) => {
+        const el = elementAt(e.clientX, e.clientY);
+        if (el)
+            pick(el, e.shiftKey || e.metaKey || e.ctrlKey);
+    };
+    const syncRoute = () => {
+        const next = routeOf(win);
+        if (next === route)
+            return;
+        route = next;
+        send({ type: 'route', route });
+    };
+    glass.addEventListener('mousemove', onMove);
+    glass.addEventListener('mouseleave', onLeave);
+    glass.addEventListener('click', onClick);
+    glass.addEventListener('wheel', onWheel, { passive: true });
+    win.addEventListener('keydown', onKey, true);
+    win.addEventListener('message', onMessage);
+    const routeTimer = win.setInterval(syncRoute, options.routeEveryMs ?? 400);
+    raf = win.requestAnimationFrame(draw);
+    send({ type: 'route', route });
+    return {
+        start: () => setPicking(true),
+        stop: () => setPicking(false),
+        clear,
+        setPins,
+        get picking() {
+            return picking;
+        },
+        get selection() {
+            return selection.map((s) => s.info);
+        },
+        destroy() {
+            win.cancelAnimationFrame(raf);
+            win.clearInterval(routeTimer);
+            win.removeEventListener('keydown', onKey, true);
+            win.removeEventListener('message', onMessage);
+            root.remove();
+        },
+    };
+}
+//# sourceMappingURL=picker.js.map

package/dist/picker/picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"picker.js","sourceRoot":"","sources":["../../src/picker/picker.ts"],"names":[],"mappings":"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"}

package/dist/picker/protocol.d.ts

@@ -0,0 +1,79 @@
+/** Every message in both directions carries this marker; anything without it is ignored. */
+export declare const YUBI: 1;
+export type Frame = {
+    type: string;
+    file?: string;
+    line?: number;
+    column?: number;
+    name?: string;
+};
+export type Target = {
+    tag: string;
+    selector: string;
+    text: string;
+    html: string;
+    attrs: Record<string, string>;
+    rect: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+    source?: {
+        file: string;
+        line: number;
+        column: number;
+    };
+    stack: Frame[];
+};
+export type Pin = {
+    id: number;
+    selector: string;
+};
+export type Viewport = {
+    width: number;
+    height: number;
+};
+type Marked<T> = T & {
+    yubi: typeof YUBI;
+};
+/** A message before the marker is stamped on. */
+export type Unmarked<T> = T extends unknown ? Omit<T, 'yubi'> : never;
+/** Parent window → app document. */
+export type ParentMessage = Marked<{
+    type: 'pick:start';
+} | {
+    type: 'pick:stop';
+}
+/** Drops the selection; `id` records it as the targets of comment #id so its pin sticks to the picked elements. */
+ | {
+    type: 'pick:clear';
+    id?: number;
+} | {
+    type: 'pins:set';
+    pins: Pin[];
+}>;
+/** App document → parent window. */
+export type ChildMessage = Marked<{
+    type: 'pick:state';
+    picking: boolean;
+} | {
+    type: 'pick:hover';
+    target: Target | null;
+} | {
+    type: 'pick:selected';
+    targets: Target[];
+    route: string;
+    viewport: Viewport;
+} | {
+    type: 'pick:cancel';
+} | {
+    type: 'pin:open';
+    id: number;
+} | {
+    type: 'route';
+    route: string;
+}>;
+export declare const isParentMessage: (data: unknown) => data is ParentMessage;
+export declare const isChildMessage: (data: unknown) => data is ChildMessage;
+export {};