@hanzo/ui 8.27.14 → 8.27.16

package/dist/agents/Workspace.cjs

@@ -0,0 +1,103 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEVICES = exports.CHAT = exports.VIEWS = exports.CONTROL = void 0;
+exports.Workspace = Workspace;
+exports.Views = Views;
+exports.ProjectChip = ProjectChip;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Workspace — the builder's frame: one bar, the chat beside the work, the work,
+ * and a dock under it.
+ *
+ * Ported from build-v2 `components/editor/{index,header}.tsx` (MIT, derived from
+ * OSW Studio and DeepSite — see NOTICE). v2's editor owned its project, its
+ * pages, its preview frames and its fetches in one 875-line component; this is
+ * the SHAPE of that screen with every one of those handed back to the host.
+ * The bar is three slots, the chat column is a slot, the view is `children`,
+ * and the dock is a slot. Nothing here knows what a project is.
+ *
+ *   ┌ start ──────────────┬──────── middle ─────────┬──────── end ┐
+ *   │ chat (collapsible)  │ children — the chosen view            │
+ *   │                     │                                        │
+ *   │                     ├────────────────────────────────────────┤
+ *   │                     │ dock                                   │
+ *   └─────────────────────┴────────────────────────────────────────┘
+ *
+ * THE CHAT COLUMN COLLAPSES ON AN EXPLICIT TOGGLE. `collapsed` is controlled
+ * and the host persists it — the sidebar canon for every Hanzo surface: a
+ * column you ask to hide, never one that slides away when the pointer leaves.
+ *
+ * ONE PANE AT A TIME ON A PHONE. Below `md` there is room for the chat or the
+ * work, not both side by side, so `pane` chooses which shows. The host's view
+ * tabs carry a Chat entry that is only drawn there (`VIEWS` + `CHAT`), so the
+ * same control that switches views switches panes and there is no second
+ * switcher to find. Nothing in the frame is wider than the viewport at 390px:
+ * the middle of the bar yields and scrolls, and the ends never shrink.
+ */
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const react_1 = require("react");
+const button_1 = require("../backends/gui/button.cjs");
+const slot_1 = require("../backends/gui/slot.cjs");
+/** The bar's one control height. Every square in the bar measures this. */
+exports.CONTROL = 32;
+/** The chat column's width on a wide screen, px — v2's measured 360. */
+const WIDTH = 360;
+function Workspace({ start, middle, end, chat, children, dock, collapsed = false, pane = 'view', width = WIDTH, ...rest }) {
+    const chatShown = pane === 'chat';
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('workspace'), flex: 1, minW: 0, minH: 0, width: "100%", bg: "$background", overflow: "hidden", ...rest, children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('workspace-bar'), render: "header", items: "center", gap: "$2", px: "$3", minH: 52, shrink: 0, minW: 0, $md: { px: '$4', gap: '$3' }, children: [(0, jsx_runtime_1.jsx)(gui_1.XStack, { items: "center", gap: "$1.5", minW: 0, shrink: 1, children: start }), (0, jsx_runtime_1.jsx)(gui_1.XStack, { flex: 1, minW: 0, items: "center", justify: "center", gap: "$2", overflow: "hidden", children: (0, jsx_runtime_1.jsx)(gui_1.XStack, { items: "center", gap: "$2", minW: 0, maxW: "100%", overflow: "scroll", children: middle }) }), (0, jsx_runtime_1.jsx)(gui_1.XStack, { items: "center", gap: "$2", shrink: 0, children: end })] }), (0, jsx_runtime_1.jsxs)(gui_1.XStack, { flex: 1, minH: 0, minW: 0, gap: 0, $md: { gap: '$3', pr: '$3', pb: '$3' }, children: [(0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('workspace-chat'), render: "section", "aria-label": "Chat", display: chatShown ? 'flex' : 'none', width: "100%", minH: 0, minW: 0, $md: { display: collapsed ? 'none' : 'flex', width, shrink: 0 }, children: chat }), (0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('workspace-main'), render: "main", display: chatShown ? 'none' : 'flex', flex: 1, minW: 0, minH: 0, $md: { display: 'flex' }, children: [(0, jsx_runtime_1.jsx)(gui_1.YStack, { flex: 1, minH: 0, minW: 0, children: children }), dock] })] })] }));
+}
+/** The builder's four views, as v2's pane list named and drew them. */
+exports.VIEWS = [
+    { id: 'preview', label: 'Preview', icon: lucide_icons_2_1.Globe },
+    { id: 'files', label: 'Files', icon: lucide_icons_2_1.FileText },
+    { id: 'code', label: 'Code', icon: lucide_icons_2_1.Code2 },
+    { id: 'layers', label: 'Layers', icon: lucide_icons_2_1.Layers },
+];
+/** The phone's extra view: the chat itself, one pane at a time. */
+exports.CHAT = { id: 'chat', label: 'Chat', icon: lucide_icons_2_1.MessageSquare, narrow: true };
+/** The preview's two widths. */
+exports.DEVICES = [
+    { id: 'desktop', label: 'Desktop', icon: lucide_icons_2_1.Monitor },
+    { id: 'mobile', label: 'Mobile', icon: lucide_icons_2_1.Smartphone },
+];
+/**
+ * A segmented control, as a WAI-ARIA tablist: one tab stop, arrows move the
+ * choice, Home/End jump. The chosen segment is the raised one and, by default,
+ * the only one wearing its label — v2's bar, where the place you are is the
+ * loud thing and every other place is a glyph.
+ */
+function Views({ views, value, onChange, label, labels = 'active', ...rest }) {
+    const refs = (0, react_1.useRef)([]);
+    const move = (e, index) => {
+        const last = views.length - 1;
+        const to = e.key === 'ArrowRight' ? (index === last ? 0 : index + 1)
+            : e.key === 'ArrowLeft' ? (index === 0 ? last : index - 1)
+                : e.key === 'Home' ? 0
+                    : e.key === 'End' ? last
+                        : -1;
+        if (to < 0)
+            return;
+        e.preventDefault();
+        onChange(views[to].id);
+        refs.current[to]?.focus();
+    };
+    return ((0, jsx_runtime_1.jsx)(gui_1.XStack, { ...(0, slot_1.slot)('views'), role: "tablist", "aria-label": label, items: "center", gap: 2, p: 2, rounded: "$3", bg: "$hover", shrink: 0, ...rest, children: views.map((view, index) => {
+            const on = view.id === value;
+            const Icon = view.icon;
+            const words = labels === 'all' || (labels === 'active' && on) || !Icon;
+            return ((0, jsx_runtime_1.jsxs)(button_1.Button, { ref: (el) => {
+                    refs.current[index] = el;
+                }, type: "button", variant: "ghost", size: words ? 'sm' : 'icon-sm', role: "tab", "aria-selected": on, "aria-label": view.label, title: view.label, tabIndex: on ? 0 : -1, onClick: () => onChange(view.id), onKeyDown: (e) => move(e, index), minHeight: exports.CONTROL - 4, minWidth: exports.CONTROL + 8, px: words ? '$2.5' : 0, bg: on ? '$raised' : 'transparent', color: on ? '$ink' : '$soft', hoverStyle: { bg: on ? '$raised' : '$hover' }, ...(view.narrow ? { $md: { display: 'none' } } : null), ...{ 'data-view': view.id }, children: [Icon ? (0, jsx_runtime_1.jsx)(Icon, { size: 15 }) : null, words ? ((0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", color: on ? '$ink' : '$soft', children: view.label })) : null] }, view.id));
+        }) }));
+}
+/**
+ * The project switcher's trigger: a square, the name, and the up-down chevron
+ * that says "there are others". A real button with a ref, so it can be the
+ * trigger of whatever menu or popover the host lists projects in.
+ */
+function ProjectChip({ name, mark, onPress, ref, ...rest }) {
+    const initial = name.trim().charAt(0).toUpperCase() || '·';
+    return ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { ref: ref, ...(0, slot_1.slot)('project-chip'), render: "button", ...{ type: 'button', 'aria-haspopup': 'menu' }, "aria-label": `Project: ${name}`, onPress: onPress, items: "center", gap: "$2", height: exports.CONTROL + 4, minW: 0, shrink: 1, pl: "$1.5", pr: "$2", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", cursor: "pointer", hoverStyle: { bg: '$hover' }, focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$rim' }, ...rest, children: [mark ?? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { width: 22, height: 22, rounded: "$2", bg: "$raised", items: "center", justify: "center", shrink: 0, "aria-hidden": true, children: (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", fontWeight: "600", color: "$ink", children: initial }) })), (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$3", fontWeight: "600", color: "$ink", numberOfLines: 1, minW: 0, shrink: 1, children: name }), (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronsUpDown, { size: 14, opacity: 0.6 })] }));
+}

package/dist/agents/Workspace.d.ts

@@ -0,0 +1,104 @@
+/**
+ * Workspace — the builder's frame: one bar, the chat beside the work, the work,
+ * and a dock under it.
+ *
+ * Ported from build-v2 `components/editor/{index,header}.tsx` (MIT, derived from
+ * OSW Studio and DeepSite — see NOTICE). v2's editor owned its project, its
+ * pages, its preview frames and its fetches in one 875-line component; this is
+ * the SHAPE of that screen with every one of those handed back to the host.
+ * The bar is three slots, the chat column is a slot, the view is `children`,
+ * and the dock is a slot. Nothing here knows what a project is.
+ *
+ *   ┌ start ──────────────┬──────── middle ─────────┬──────── end ┐
+ *   │ chat (collapsible)  │ children — the chosen view            │
+ *   │                     │                                        │
+ *   │                     ├────────────────────────────────────────┤
+ *   │                     │ dock                                   │
+ *   └─────────────────────┴────────────────────────────────────────┘
+ *
+ * THE CHAT COLUMN COLLAPSES ON AN EXPLICIT TOGGLE. `collapsed` is controlled
+ * and the host persists it — the sidebar canon for every Hanzo surface: a
+ * column you ask to hide, never one that slides away when the pointer leaves.
+ *
+ * ONE PANE AT A TIME ON A PHONE. Below `md` there is room for the chat or the
+ * work, not both side by side, so `pane` chooses which shows. The host's view
+ * tabs carry a Chat entry that is only drawn there (`VIEWS` + `CHAT`), so the
+ * same control that switches views switches panes and there is no second
+ * switcher to find. Nothing in the frame is wider than the viewport at 390px:
+ * the middle of the bar yields and scrolls, and the ends never shrink.
+ */
+import { XStack, YStack } from '@hanzo/gui';
+import { type ComponentProps, type ComponentType, type ReactNode, type Ref } from 'react';
+type Col = Omit<ComponentProps<typeof YStack>, 'children'>;
+/** The bar's one control height. Every square in the bar measures this. */
+export declare const CONTROL = 32;
+export interface WorkspaceProps extends Col {
+    /** The bar's left cluster: the mark, the project, history, the chat toggle. */
+    start?: ReactNode;
+    /** The bar's middle: view tabs, device, reload, page, open. Yields first. */
+    middle?: ReactNode;
+    /** The bar's right cluster: Share, Publish. Never shrinks. */
+    end?: ReactNode;
+    /** The chat column — thread, suggestions, composer. */
+    chat?: ReactNode;
+    /** The chosen view: preview, files, code, layers. */
+    children?: ReactNode;
+    /** Under the view: the console. */
+    dock?: ReactNode;
+    /** The chat column is hidden on a wide screen. Controlled; the host persists it. */
+    collapsed?: boolean;
+    /** Below `md`, which pane shows. */
+    pane?: 'chat' | 'view';
+    /** The chat column's width on a wide screen, px. */
+    width?: number;
+}
+export declare function Workspace({ start, middle, end, chat, children, dock, collapsed, pane, width, ...rest }: WorkspaceProps): import("react").JSX.Element;
+/** One entry of a segmented control. */
+export interface View {
+    id: string;
+    label: string;
+    icon?: ComponentType<{
+        size?: number;
+    }>;
+    /** Drawn only below `md` — the phone's Chat entry. */
+    narrow?: boolean;
+}
+/** The builder's four views, as v2's pane list named and drew them. */
+export declare const VIEWS: readonly View[];
+/** The phone's extra view: the chat itself, one pane at a time. */
+export declare const CHAT: View;
+/** The preview's two widths. */
+export declare const DEVICES: readonly View[];
+export interface ViewsProps extends Omit<ComponentProps<typeof XStack>, 'children' | 'onChange'> {
+    views: readonly View[];
+    value: string;
+    onChange: (id: string) => void;
+    /** The group's accessible name: "Editor view", "Device". */
+    label: string;
+    /** Which segments carry their words: only the chosen one (v2), all, or none. */
+    labels?: 'active' | 'all' | 'none';
+}
+/**
+ * A segmented control, as a WAI-ARIA tablist: one tab stop, arrows move the
+ * choice, Home/End jump. The chosen segment is the raised one and, by default,
+ * the only one wearing its label — v2's bar, where the place you are is the
+ * loud thing and every other place is a glyph.
+ */
+export declare function Views({ views, value, onChange, label, labels, ...rest }: ViewsProps): import("react").JSX.Element;
+export interface ProjectChipProps extends Omit<ComponentProps<typeof XStack>, 'children'> {
+    /** The project's name. */
+    name: string;
+    /** The square before the name; the name's initial when absent. */
+    mark?: ReactNode;
+    onPress?: () => void;
+    /** The button, for a menu or popover to anchor to. A plain prop (React 19). */
+    ref?: Ref<HTMLElement>;
+}
+/**
+ * The project switcher's trigger: a square, the name, and the up-down chevron
+ * that says "there are others". A real button with a ref, so it can be the
+ * trigger of whatever menu or popover the host lists projects in.
+ */
+export declare function ProjectChip({ name, mark, onPress, ref, ...rest }: ProjectChipProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=Workspace.d.ts.map

package/dist/agents/Workspace.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Workspace.d.ts","sourceRoot":"","sources":["../../src/agents/Workspace.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,OAAO,EAAe,MAAM,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAWxD,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,aAAa,EAElB,KAAK,SAAS,EACd,KAAK,GAAG,EAET,MAAM,OAAO,CAAA;AAKd,KAAK,GAAG,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,UAAU,CAAC,CAAA;AAE1D,2EAA2E;AAC3E,eAAO,MAAM,OAAO,KAAK,CAAA;AAKzB,MAAM,WAAW,cAAe,SAAQ,GAAG;IACzC,+EAA+E;IAC/E,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,6EAA6E;IAC7E,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,8DAA8D;IAC9D,GAAG,CAAC,EAAE,SAAS,CAAA;IACf,uDAAuD;IACvD,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,mCAAmC;IACnC,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,oFAAoF;IACpF,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,oCAAoC;IACpC,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,MAAM,EACN,GAAG,EACH,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,SAAiB,EACjB,IAAa,EACb,KAAa,EACb,GAAG,IAAI,EACR,EAAE,cAAc,+BA6EhB;AAED,wCAAwC;AACxC,MAAM,WAAW,IAAI;IACnB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,aAAa,CAAC;QAAE,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACvC,sDAAsD;IACtD,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,uEAAuE;AACvE,eAAO,MAAM,KAAK,EAAE,SAAS,IAAI,EAKhC,CAAA;AAED,mEAAmE;AACnE,eAAO,MAAM,IAAI,EAAE,IAAuE,CAAA;AAE1F,gCAAgC;AAChC,eAAO,MAAM,OAAO,EAAE,SAAS,IAAI,EAGlC,CAAA;AAED,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC;IAC9F,KAAK,EAAE,SAAS,IAAI,EAAE,CAAA;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9B,4DAA4D;IAC5D,KAAK,EAAE,MAAM,CAAA;IACb,gFAAgF;IAChF,MAAM,CAAC,EAAE,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAA;CACnC;AAED;;;;;GAKG;AACH,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAiB,EAAE,GAAG,IAAI,EAAE,EAAE,UAAU,+BAoE9F;AAED,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,UAAU,CAAC;IACvF,0BAA0B;IAC1B,IAAI,EAAE,MAAM,CAAA;IACZ,kEAAkE;IAClE,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,+EAA+E;IAC/E,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAA;CACvB;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,EAAE,gBAAgB,+BAgDlF"}

package/dist/agents/Workspace.js

@@ -0,0 +1,98 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Workspace — the builder's frame: one bar, the chat beside the work, the work,
+ * and a dock under it.
+ *
+ * Ported from build-v2 `components/editor/{index,header}.tsx` (MIT, derived from
+ * OSW Studio and DeepSite — see NOTICE). v2's editor owned its project, its
+ * pages, its preview frames and its fetches in one 875-line component; this is
+ * the SHAPE of that screen with every one of those handed back to the host.
+ * The bar is three slots, the chat column is a slot, the view is `children`,
+ * and the dock is a slot. Nothing here knows what a project is.
+ *
+ *   ┌ start ──────────────┬──────── middle ─────────┬──────── end ┐
+ *   │ chat (collapsible)  │ children — the chosen view            │
+ *   │                     │                                        │
+ *   │                     ├────────────────────────────────────────┤
+ *   │                     │ dock                                   │
+ *   └─────────────────────┴────────────────────────────────────────┘
+ *
+ * THE CHAT COLUMN COLLAPSES ON AN EXPLICIT TOGGLE. `collapsed` is controlled
+ * and the host persists it — the sidebar canon for every Hanzo surface: a
+ * column you ask to hide, never one that slides away when the pointer leaves.
+ *
+ * ONE PANE AT A TIME ON A PHONE. Below `md` there is room for the chat or the
+ * work, not both side by side, so `pane` chooses which shows. The host's view
+ * tabs carry a Chat entry that is only drawn there (`VIEWS` + `CHAT`), so the
+ * same control that switches views switches panes and there is no second
+ * switcher to find. Nothing in the frame is wider than the viewport at 390px:
+ * the middle of the bar yields and scrolls, and the ends never shrink.
+ */
+import { SizableText, XStack, YStack } from '@hanzo/gui';
+import { ChevronsUpDown, Code2, FileText, Globe, Layers, MessageSquare, Monitor, Smartphone, } from '@hanzogui/lucide-icons-2';
+import { useRef, } from 'react';
+import { Button } from '../backends/gui/button.js';
+import { slot } from '../backends/gui/slot.js';
+/** The bar's one control height. Every square in the bar measures this. */
+export const CONTROL = 32;
+/** The chat column's width on a wide screen, px — v2's measured 360. */
+const WIDTH = 360;
+export function Workspace({ start, middle, end, chat, children, dock, collapsed = false, pane = 'view', width = WIDTH, ...rest }) {
+    const chatShown = pane === 'chat';
+    return (_jsxs(YStack, { ...slot('workspace'), flex: 1, minW: 0, minH: 0, width: "100%", bg: "$background", overflow: "hidden", ...rest, children: [_jsxs(XStack, { ...slot('workspace-bar'), render: "header", items: "center", gap: "$2", px: "$3", minH: 52, shrink: 0, minW: 0, $md: { px: '$4', gap: '$3' }, children: [_jsx(XStack, { items: "center", gap: "$1.5", minW: 0, shrink: 1, children: start }), _jsx(XStack, { flex: 1, minW: 0, items: "center", justify: "center", gap: "$2", overflow: "hidden", children: _jsx(XStack, { items: "center", gap: "$2", minW: 0, maxW: "100%", overflow: "scroll", children: middle }) }), _jsx(XStack, { items: "center", gap: "$2", shrink: 0, children: end })] }), _jsxs(XStack, { flex: 1, minH: 0, minW: 0, gap: 0, $md: { gap: '$3', pr: '$3', pb: '$3' }, children: [_jsx(YStack, { ...slot('workspace-chat'), render: "section", "aria-label": "Chat", display: chatShown ? 'flex' : 'none', width: "100%", minH: 0, minW: 0, $md: { display: collapsed ? 'none' : 'flex', width, shrink: 0 }, children: chat }), _jsxs(YStack, { ...slot('workspace-main'), render: "main", display: chatShown ? 'none' : 'flex', flex: 1, minW: 0, minH: 0, $md: { display: 'flex' }, children: [_jsx(YStack, { flex: 1, minH: 0, minW: 0, children: children }), dock] })] })] }));
+}
+/** The builder's four views, as v2's pane list named and drew them. */
+export const VIEWS = [
+    { id: 'preview', label: 'Preview', icon: Globe },
+    { id: 'files', label: 'Files', icon: FileText },
+    { id: 'code', label: 'Code', icon: Code2 },
+    { id: 'layers', label: 'Layers', icon: Layers },
+];
+/** The phone's extra view: the chat itself, one pane at a time. */
+export const CHAT = { id: 'chat', label: 'Chat', icon: MessageSquare, narrow: true };
+/** The preview's two widths. */
+export const DEVICES = [
+    { id: 'desktop', label: 'Desktop', icon: Monitor },
+    { id: 'mobile', label: 'Mobile', icon: Smartphone },
+];
+/**
+ * A segmented control, as a WAI-ARIA tablist: one tab stop, arrows move the
+ * choice, Home/End jump. The chosen segment is the raised one and, by default,
+ * the only one wearing its label — v2's bar, where the place you are is the
+ * loud thing and every other place is a glyph.
+ */
+export function Views({ views, value, onChange, label, labels = 'active', ...rest }) {
+    const refs = useRef([]);
+    const move = (e, index) => {
+        const last = views.length - 1;
+        const to = e.key === 'ArrowRight' ? (index === last ? 0 : index + 1)
+            : e.key === 'ArrowLeft' ? (index === 0 ? last : index - 1)
+                : e.key === 'Home' ? 0
+                    : e.key === 'End' ? last
+                        : -1;
+        if (to < 0)
+            return;
+        e.preventDefault();
+        onChange(views[to].id);
+        refs.current[to]?.focus();
+    };
+    return (_jsx(XStack, { ...slot('views'), role: "tablist", "aria-label": label, items: "center", gap: 2, p: 2, rounded: "$3", bg: "$hover", shrink: 0, ...rest, children: views.map((view, index) => {
+            const on = view.id === value;
+            const Icon = view.icon;
+            const words = labels === 'all' || (labels === 'active' && on) || !Icon;
+            return (_jsxs(Button, { ref: (el) => {
+                    refs.current[index] = el;
+                }, type: "button", variant: "ghost", size: words ? 'sm' : 'icon-sm', role: "tab", "aria-selected": on, "aria-label": view.label, title: view.label, tabIndex: on ? 0 : -1, onClick: () => onChange(view.id), onKeyDown: (e) => move(e, index), minHeight: CONTROL - 4, minWidth: CONTROL + 8, px: words ? '$2.5' : 0, bg: on ? '$raised' : 'transparent', color: on ? '$ink' : '$soft', hoverStyle: { bg: on ? '$raised' : '$hover' }, ...(view.narrow ? { $md: { display: 'none' } } : null), ...{ 'data-view': view.id }, children: [Icon ? _jsx(Icon, { size: 15 }) : null, words ? (_jsx(SizableText, { size: "$2", color: on ? '$ink' : '$soft', children: view.label })) : null] }, view.id));
+        }) }));
+}
+/**
+ * The project switcher's trigger: a square, the name, and the up-down chevron
+ * that says "there are others". A real button with a ref, so it can be the
+ * trigger of whatever menu or popover the host lists projects in.
+ */
+export function ProjectChip({ name, mark, onPress, ref, ...rest }) {
+    const initial = name.trim().charAt(0).toUpperCase() || '·';
+    return (_jsxs(XStack, { ref: ref, ...slot('project-chip'), render: "button", ...{ type: 'button', 'aria-haspopup': 'menu' }, "aria-label": `Project: ${name}`, onPress: onPress, items: "center", gap: "$2", height: CONTROL + 4, minW: 0, shrink: 1, pl: "$1.5", pr: "$2", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", cursor: "pointer", hoverStyle: { bg: '$hover' }, focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$rim' }, ...rest, children: [mark ?? (_jsx(YStack, { width: 22, height: 22, rounded: "$2", bg: "$raised", items: "center", justify: "center", shrink: 0, "aria-hidden": true, children: _jsx(SizableText, { size: "$1", fontWeight: "600", color: "$ink", children: initial }) })), _jsx(SizableText, { size: "$3", fontWeight: "600", color: "$ink", numberOfLines: 1, minW: 0, shrink: 1, children: name }), _jsx(ChevronsUpDown, { size: 14, opacity: 0.6 })] }));
+}
+//# sourceMappingURL=Workspace.js.map

package/dist/agents/Workspace.js.map

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

package/dist/agents/bridge.cjs

@@ -0,0 +1,201 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.web = web;
+exports.accept = accept;
+exports.script = script;
+/**
+ * bridge — the message protocol between a builder and the page it previews.
+ *
+ * Ported from build-v2 `components/editor/preview/bridge.ts` (MIT, derived from
+ * OSW Studio and DeepSite — see NOTICE). v2 wrote the preview document itself
+ * (`srcdoc`) and injected this script into it. A repository's deployed site is
+ * a page on ITS OWN origin that this package does not write, so nothing is
+ * injected: the bridge is OPT-IN. A page that wants element picking and
+ * console forwarding includes the script `script(parent)` returns — pinned to
+ * the builder's origin — and the frame speaks to it only across that pair of
+ * origins.
+ *
+ * The protocol, both directions, every message a plain object with `type`:
+ *
+ *   page → builder   preview:ready                    the bridge is listening
+ *                    preview:hover   {selector, rect, tag} | {selector: null}
+ *                    preview:select  {info}           an element was picked
+ *                    preview:navigate {path}          an in-site link was followed
+ *                    preview:console {level, text}    the page's console, as text
+ *   builder → page   preview:editable {active}        picking on/off
+ *                    preview:highlight {selector}     outline one element
+ *
+ * What v2 also sent — live style and text edits — is not here. A change made
+ * inside the frame is gone on the next load; the builder's edits are runs that
+ * commit, and a control that edits something it cannot keep is a lie.
+ *
+ * Both sides check ORIGIN, never `'*'`: the page posts only to the builder's
+ * origin and reads only messages whose source is its parent and whose origin
+ * is that origin; the builder reads only messages whose source is the frame's
+ * window and whose origin is the frame's. `accept` is that check, in one place.
+ */
+const log_1 = require("./log.cjs");
+const TYPES = new Set(['preview:ready', 'preview:hover', 'preview:select', 'preview:navigate', 'preview:console']);
+const str = (v) => typeof v === 'string';
+const num = (v) => typeof v === 'number' && Number.isFinite(v);
+/** A control character or a line break: nothing a selector, a tag or a path carries. */
+const CONTROL = /[\u0000-\u001f\u007f\u2028\u2029]/;
+/**
+ * A selector in the one shape `script` writes — `body`, a plain `#id`, or a
+ * `body > tag:nth-of-type(n) > …` path — and nothing else. A page is free to
+ * post anything, and a free-text "selector" is the person's next ask written
+ * by the page; this shape carries no words.
+ */
+const SELECTOR = /^(?:body|#[A-Za-z][A-Za-z0-9_-]{0,63}|body(?: > [a-z][a-z0-9-]{0,31}(?::nth-of-type\([1-9][0-9]{0,3}\))?){1,24})$/;
+const selector = (v) => str(v) && v.length <= 256 && SELECTOR.test(v);
+/** An element's tag name, as the DOM spells one. */
+const tag = (v) => str(v) && /^[a-z][a-z0-9-]{0,31}$/i.test(v);
+/** A path on the framed page's own origin: one leading slash, never two, no backslash, no whitespace, short. */
+const path = (v) => str(v) && v.length <= 128 && /^\/(?![\/\\])[^\s\\]*$/.test(v) && !CONTROL.test(v);
+/**
+ * The address a frame may load: an absolute http(s) URL, resolved against
+ * `base`. Anything else — `javascript:`, `data:`, `blob:`, a malformed string —
+ * is `null`, so a frame never runs an address a string could smuggle in.
+ */
+function web(url, base) {
+    if (!url)
+        return null;
+    try {
+        const u = base ? new URL(url, base) : new URL(url);
+        return u.protocol === 'https:' || u.protocol === 'http:' ? u : null;
+    }
+    catch {
+        return null;
+    }
+}
+/**
+ * A message from the frame, or `null`. It must come FROM the frame's window,
+ * FROM the frame's origin, and be one of the five shapes above with every
+ * field the type it claims. A message that fails any of that is dropped
+ * without a word — anything can post to a window.
+ */
+function accept(event, frame, origin) {
+    if (!frame || event.source !== frame.contentWindow || event.origin !== origin)
+        return null;
+    const m = event.data;
+    if (!m || typeof m !== 'object' || !str(m.type) || !TYPES.has(m.type))
+        return null;
+    switch (m.type) {
+        case 'preview:ready':
+            return { type: 'preview:ready' };
+        case 'preview:hover': {
+            if (m.selector === null)
+                return { type: 'preview:hover', selector: null };
+            const r = m.rect;
+            if (!selector(m.selector) || !r || !num(r.top) || !num(r.left) || !num(r.width) || !num(r.height))
+                return null;
+            return {
+                type: 'preview:hover',
+                selector: m.selector,
+                rect: { top: r.top, left: r.left, width: r.width, height: r.height },
+                tag: tag(m.tag) ? m.tag : undefined,
+            };
+        }
+        case 'preview:select': {
+            const i = m.info;
+            if (!i || !selector(i.selector) || !tag(i.tag) || !str(i.html))
+                return null;
+            return {
+                type: 'preview:select',
+                info: {
+                    selector: i.selector,
+                    tag: i.tag,
+                    id: str(i.id) && i.id.length <= 128 && !CONTROL.test(i.id) ? i.id : undefined,
+                    text: str(i.text) ? i.text.slice(0, 200) : undefined,
+                    html: i.html.slice(0, 8000),
+                },
+            };
+        }
+        case 'preview:navigate':
+            return path(m.path) ? { type: 'preview:navigate', path: m.path } : null;
+        case 'preview:console': {
+            return str(m.text) ? { type: 'preview:console', level: (0, log_1.level)(m.level), text: m.text.slice(0, 4000) } : null;
+        }
+    }
+    return null;
+}
+/**
+ * The script a previewed page includes to take part, pinned to the builder at
+ * `parent` (an origin: `https://platform.hanzo.ai`). It posts only there, and
+ * obeys only its parent window speaking from there.
+ *
+ * Serve it from the page itself (a `<script>` the site ships), never from the
+ * builder: the page decides whether it can be picked apart, not the frame
+ * around it.
+ */
+function script(parent) {
+    const origin = new URL(parent).origin;
+    return `(function () {
+  if (window.__hanzoBridge || window.parent === window) return;
+  window.__hanzoBridge = true;
+  var PARENT = ${JSON.stringify(origin)};
+  var editable = false, hovered = null, marked = null;
+  function send(m) { try { window.parent.postMessage(m, PARENT); } catch (e) {} }
+  function sel(el) {
+    if (!el || el === document.body || el === document.documentElement) return 'body';
+    if (el.id && /^[A-Za-z][A-Za-z0-9_-]{0,63}$/.test(el.id) && document.querySelectorAll('#' + el.id).length === 1) return '#' + el.id;
+    var parts = [], node = el;
+    while (node && node !== document.body && node.nodeType === 1) {
+      var p = node.parentNode; if (!p) break;
+      var same = [], i;
+      for (i = 0; i < p.children.length; i++) if (p.children[i].tagName === node.tagName) same.push(p.children[i]);
+      var tag = node.tagName.toLowerCase();
+      parts.unshift(same.length > 1 ? tag + ':nth-of-type(' + (same.indexOf(node) + 1) + ')' : tag);
+      node = p;
+    }
+    return 'body' + (parts.length ? ' > ' + parts.join(' > ') : '');
+  }
+  function find(s) { if (!s) return null; try { return document.querySelector(s); } catch (e) { return null; } }
+  function outline(el, on) { if (el) el.style.outline = on ? '2px solid rgba(120,160,255,.9)' : ''; }
+  ['log', 'info', 'warn', 'error', 'debug'].forEach(function (level) {
+    var original = console[level]; if (typeof original !== 'function') return;
+    console[level] = function () {
+      var args = Array.prototype.slice.call(arguments), out = [];
+      for (var i = 0; i < args.length; i++) {
+        var a = args[i];
+        if (typeof a === 'string') out.push(a);
+        else if (a instanceof Error) out.push(a.stack || a.name + ': ' + a.message);
+        else { try { out.push(JSON.stringify(a)); } catch (e) { out.push(String(a)); } }
+      }
+      send({ type: 'preview:console', level: level, text: out.join(' ') });
+      original.apply(console, args);
+    };
+  });
+  window.addEventListener('error', function (e) { send({ type: 'preview:console', level: 'error', text: String(e.message || 'Script error') }); });
+  document.addEventListener('mouseover', function (e) {
+    if (!editable) return;
+    var t = e.target; if (!t || t === document.body || t === hovered) return;
+    outline(hovered, false); hovered = t; outline(t, true);
+    var r = t.getBoundingClientRect();
+    send({ type: 'preview:hover', selector: sel(t), tag: t.tagName.toLowerCase(), rect: { top: r.top, left: r.left, width: r.width, height: r.height } });
+  }, true);
+  document.addEventListener('mouseout', function () {
+    if (!editable) return; outline(hovered, false); hovered = null; send({ type: 'preview:hover', selector: null });
+  }, true);
+  document.addEventListener('click', function (e) {
+    if (editable) {
+      var t = e.target; if (!t || t === document.body) return;
+      e.preventDefault(); e.stopPropagation();
+      send({ type: 'preview:select', info: { selector: sel(t), tag: t.tagName.toLowerCase(), id: t.id || undefined, text: (t.textContent || '').slice(0, 200), html: (t.outerHTML || '').slice(0, 8000) } });
+      return;
+    }
+    var a = e.target && e.target.closest ? e.target.closest('a[href]') : null;
+    if (!a) return;
+    var href = a.getAttribute('href') || '';
+    if (!href || href.charAt(0) === '#' || /^[a-z][a-z0-9+.-]*:/i.test(href) || href.indexOf('//') === 0) return;
+    send({ type: 'preview:navigate', path: href });
+  }, true);
+  window.addEventListener('message', function (e) {
+    if (e.source !== window.parent || e.origin !== PARENT) return;
+    var m = e.data; if (!m || typeof m !== 'object') return;
+    if (m.type === 'preview:editable') { editable = !!m.active; if (!editable) { outline(hovered, false); hovered = null; } }
+    else if (m.type === 'preview:highlight') { outline(marked, false); marked = find(m.selector); outline(marked, true); }
+  });
+  send({ type: 'preview:ready' });
+})();`;
+}

package/dist/agents/bridge.d.ts

@@ -0,0 +1,102 @@
+/**
+ * bridge — the message protocol between a builder and the page it previews.
+ *
+ * Ported from build-v2 `components/editor/preview/bridge.ts` (MIT, derived from
+ * OSW Studio and DeepSite — see NOTICE). v2 wrote the preview document itself
+ * (`srcdoc`) and injected this script into it. A repository's deployed site is
+ * a page on ITS OWN origin that this package does not write, so nothing is
+ * injected: the bridge is OPT-IN. A page that wants element picking and
+ * console forwarding includes the script `script(parent)` returns — pinned to
+ * the builder's origin — and the frame speaks to it only across that pair of
+ * origins.
+ *
+ * The protocol, both directions, every message a plain object with `type`:
+ *
+ *   page → builder   preview:ready                    the bridge is listening
+ *                    preview:hover   {selector, rect, tag} | {selector: null}
+ *                    preview:select  {info}           an element was picked
+ *                    preview:navigate {path}          an in-site link was followed
+ *                    preview:console {level, text}    the page's console, as text
+ *   builder → page   preview:editable {active}        picking on/off
+ *                    preview:highlight {selector}     outline one element
+ *
+ * What v2 also sent — live style and text edits — is not here. A change made
+ * inside the frame is gone on the next load; the builder's edits are runs that
+ * commit, and a control that edits something it cannot keep is a lie.
+ *
+ * Both sides check ORIGIN, never `'*'`: the page posts only to the builder's
+ * origin and reads only messages whose source is its parent and whose origin
+ * is that origin; the builder reads only messages whose source is the frame's
+ * window and whose origin is the frame's. `accept` is that check, in one place.
+ */
+import { type Level } from './log.js';
+export interface Rect {
+    top: number;
+    left: number;
+    width: number;
+    height: number;
+}
+/** What a picked element says about itself. Every field is text. */
+export interface Picked {
+    selector: string;
+    tag: string;
+    id?: string;
+    text?: string;
+    /** The element's outer HTML, capped. Shown as text, never rendered. */
+    html: string;
+}
+export type FrameEvent = {
+    type: 'preview:ready';
+} | {
+    type: 'preview:hover';
+    selector: string | null;
+    rect?: Rect;
+    tag?: string;
+} | {
+    type: 'preview:select';
+    info: Picked;
+} | {
+    type: 'preview:navigate';
+    path: string;
+} | {
+    type: 'preview:console';
+    level: Level;
+    text: string;
+};
+export type FrameCommand = {
+    type: 'preview:editable';
+    active: boolean;
+} | {
+    type: 'preview:highlight';
+    selector: string | null;
+};
+/**
+ * The address a frame may load: an absolute http(s) URL, resolved against
+ * `base`. Anything else — `javascript:`, `data:`, `blob:`, a malformed string —
+ * is `null`, so a frame never runs an address a string could smuggle in.
+ */
+export declare function web(url: string | null | undefined, base?: string): URL | null;
+/**
+ * A message from the frame, or `null`. It must come FROM the frame's window,
+ * FROM the frame's origin, and be one of the five shapes above with every
+ * field the type it claims. A message that fails any of that is dropped
+ * without a word — anything can post to a window.
+ */
+export declare function accept(event: {
+    source: unknown;
+    origin: string;
+    data: unknown;
+}, frame: {
+    contentWindow: unknown;
+} | null, origin: string): FrameEvent | null;
+/**
+ * The script a previewed page includes to take part, pinned to the builder at
+ * `parent` (an origin: `https://platform.hanzo.ai`). It posts only there, and
+ * obeys only its parent window speaking from there.
+ *
+ * Serve it from the page itself (a `<script>` the site ships), never from the
+ * builder: the page decides whether it can be picked apart, not the frame
+ * around it.
+ */
+export declare function script(parent: string): string;
+//# sourceMappingURL=bridge.d.ts.map

package/dist/agents/bridge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bridge.d.ts","sourceRoot":"","sources":["../../src/agents/bridge.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,OAAO,EAAS,KAAK,KAAK,EAAE,MAAM,OAAO,CAAA;AAEzC,MAAM,WAAW,IAAI;IACnB,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;CACf;AAED,oEAAoE;AACpE,MAAM,WAAW,MAAM;IACrB,QAAQ,EAAE,MAAM,CAAA;IAChB,GAAG,EAAE,MAAM,CAAA;IACX,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,uEAAuE;IACvE,IAAI,EAAE,MAAM,CAAA;CACb;AAED,MAAM,MAAM,UAAU,GAClB;IAAE,IAAI,EAAE,eAAe,CAAA;CAAE,GACzB;IAAE,IAAI,EAAE,eAAe,CAAC;IAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,IAAI,CAAC,EAAE,IAAI,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAA;CAAE,GAC7E;IAAE,IAAI,EAAE,gBAAgB,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GACxC;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GAC1C;IAAE,IAAI,EAAE,iBAAiB,CAAC;IAAC,KAAK,EAAE,KAAK,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAA;AAE3D,MAAM,MAAM,YAAY,GACpB;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,MAAM,EAAE,OAAO,CAAA;CAAE,GAC7C;IAAE,IAAI,EAAE,mBAAmB,CAAC;IAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,CAAA;AAyB1D;;;;GAIG;AACH,wBAAgB,GAAG,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,EAAE,IAAI,CAAC,EAAE,MAAM,GAAG,GAAG,GAAG,IAAI,CAQ7E;AAED;;;;;GAKG;AACH,wBAAgB,MAAM,CACpB,KAAK,EAAE;IAAE,MAAM,EAAE,OAAO,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,OAAO,CAAA;CAAE,EACzD,KAAK,EAAE;IAAE,aAAa,EAAE,OAAO,CAAA;CAAE,GAAG,IAAI,EACxC,MAAM,EAAE,MAAM,GACb,UAAU,GAAG,IAAI,CAuCnB;AAED;;;;;;;;GAQG;AACH,wBAAgB,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAsE7C"}