@zenbu-labs/pixel 0.0.0 → 0.0.13

package/dist/react/surface.js

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SurfaceCapture = exports.Surface = void 0;
+exports.surfaceId = surfaceId;
+class Surface {
+    id;
+    engine;
+    closed = false;
+    constructor(engine, id) {
+        this.engine = engine;
+        this.id = id;
+    }
+    present(frame) {
+        if (this.closed) {
+            if ("shm" in frame)
+                frame.released?.();
+            return;
+        }
+        if ("ioSurface" in frame) {
+            const submit = this.engine.updateSurfaceTexture;
+            if (!submit)
+                throw new Error("IOSurface frames are not supported on this platform");
+            submit.call(this.engine, this.id, frame.ioSurface, frame.damage);
+        }
+        else if ("shm" in frame) {
+            const submit = this.engine.updateSurfaceShm;
+            if (!submit)
+                throw new Error("shared memory frames are not supported on this platform");
+            submit.call(this.engine, this.id, frame.shm, frame.damage, frame.released);
+        }
+        else {
+            this.engine.updateSurface(this.id, frame.bgra, frame.width, frame.height, frame.damage);
+        }
+    }
+    clear() {
+        if (this.closed)
+            return;
+        this.engine.removeSurface(this.id);
+    }
+    startCapture(dir) {
+        return new SurfaceCapture(this.engine, this.engine.startSurfaceCapture(this.id, dir));
+    }
+    close() {
+        if (this.closed)
+            return;
+        this.closed = true;
+        this.engine.removeSurface(this.id);
+    }
+}
+exports.Surface = Surface;
+class SurfaceCapture {
+    engine;
+    id;
+    constructor(engine, id) {
+        this.engine = engine;
+        this.id = id;
+    }
+    stop() {
+        return JSON.parse(this.engine.stopSurfaceCapture(this.id));
+    }
+    index() {
+        return JSON.parse(this.engine.captureIndex(this.id));
+    }
+    frame(index) {
+        return this.engine.captureFrame(this.id, index);
+    }
+    release() {
+        this.engine.releaseCapture(this.id);
+    }
+}
+exports.SurfaceCapture = SurfaceCapture;
+function surfaceId(surface) {
+    return surface.id;
+}

package/dist/registry.d.ts

@@ -0,0 +1,53 @@
+import type { EngineKeyEvent, LayoutSnapshot, PastedImage, PixelRoot, TerminalColors } from "./react";
+import type { Store } from "./react/devtools/store";
+import type { PageHost } from "./web/host";
+import type { TerminalTheme } from "./web/session";
+export interface ViewEntry {
+    host: PageHost | null;
+    handle: object | null;
+    devtoolsEnabled: boolean;
+    externalDevtools: boolean;
+    externalDevtoolsAction: ((action: "close" | "dock-bottom" | "dock-right") => void) | null;
+    toggleDevtools(): void;
+    handleKey(event: EngineKeyEvent): boolean;
+    paste?(text: string): void;
+    setActive?(focused: boolean): void;
+}
+export interface RegistryHooks {
+    quit(entry: ViewEntry | null): void;
+}
+export declare class ViewRegistry {
+    readonly root: PixelRoot;
+    readonly displayScale: number;
+    private readonly noSuper;
+    private readonly hooks;
+    readonly views: Set<ViewEntry>;
+    focused: ViewEntry | null;
+    readonly resizeListeners: Set<() => void>;
+    readonly layout: Store<LayoutSnapshot>;
+    readonly colors: Store<TerminalColors>;
+    private sentCursor;
+    constructor(root: PixelRoot, displayScale: number, noSuper: boolean, hooks: RegistryHooks);
+    register(entry: ViewEntry): void;
+    unregister(entry: ViewEntry): void;
+    hosts(): Iterable<PageHost>;
+    focus(entry: ViewEntry, target?: "page" | "devtools" | "popup"): void;
+    blur(entry: ViewEntry): void;
+    private setActive;
+    quit(entry: ViewEntry | null): void;
+    setPointerShape(shape: string): void;
+    queryLayout(): void;
+    background(): string;
+    theme(): TerminalTheme | null;
+    handleKey(event: EngineKeyEvent): void;
+    handlePaste(text: string): void;
+    handlePasteImage(image: PastedImage): void;
+    handleTerminalFocus(focused: boolean): void;
+    private clipboardKeys;
+    private cmdHeld;
+    private clipboardHeld;
+    private isDevtoolsKey;
+}
+export declare const RootContext: import("react").Context<ViewRegistry | null>;
+export declare function useRegistryColors(registry: ViewRegistry): TerminalColors;
+export declare const handleEntries: WeakMap<object, ViewEntry>;

package/dist/registry.js

@@ -0,0 +1,193 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.handleEntries = exports.RootContext = exports.ViewRegistry = void 0;
+exports.useRegistryColors = useRegistryColors;
+const react_1 = require("react");
+const store_1 = require("./react/devtools/store");
+class ViewRegistry {
+    root;
+    displayScale;
+    noSuper;
+    hooks;
+    views = new Set();
+    focused = null;
+    resizeListeners = new Set();
+    layout = (0, store_1.createStore)({
+        rects: new Map(),
+        stats: { frameMs: 0, fps: 0 },
+        width: 0,
+        height: 0,
+        at: 0,
+    });
+    colors;
+    sentCursor = null;
+    constructor(root, displayScale, noSuper, hooks) {
+        this.root = root;
+        this.displayScale = displayScale;
+        this.noSuper = noSuper;
+        this.hooks = hooks;
+        this.colors = (0, store_1.createStore)(root.info.colors);
+    }
+    register(entry) {
+        this.views.add(entry);
+    }
+    unregister(entry) {
+        this.views.delete(entry);
+        if (this.focused === entry)
+            this.focused = null;
+    }
+    *hosts() {
+        for (const view of this.views)
+            if (view.host)
+                yield view.host;
+    }
+    focus(entry, target = "page") {
+        if (this.focused !== entry) {
+            this.setActive(this.focused, false);
+            this.focused = entry;
+            if (!entry.host)
+                entry.setActive?.(true);
+        }
+        const host = entry.host;
+        if (!host)
+            return;
+        if (target === "devtools")
+            host.focusDevtools();
+        else if (target === "page")
+            host.focusContent();
+    }
+    blur(entry) {
+        if (this.focused !== entry)
+            return;
+        this.setActive(entry, false);
+        this.focused = null;
+    }
+    setActive(entry, active) {
+        if (!entry)
+            return;
+        if (entry.host)
+            entry.host.setActive(active);
+        else
+            entry.setActive?.(active);
+    }
+    quit(entry) {
+        this.hooks.quit(entry);
+    }
+    setPointerShape(shape) {
+        if (shape === this.sentCursor)
+            return;
+        this.sentCursor = shape;
+        this.root.setPointerShape(shape);
+    }
+    queryLayout() {
+        this.root.queryLayout();
+    }
+    background() {
+        const bg = this.root.info.colors.background ?? [30, 32, 38, 255];
+        return `#${bg.slice(0, 3).map((c) => c.toString(16).padStart(2, "0")).join("")}`;
+    }
+    theme() {
+        const colors = this.root.info.colors;
+        if (!colors.background || !colors.foreground)
+            return null;
+        const rgb = (channelled) => channelled ? [channelled[0], channelled[1], channelled[2]] : null;
+        return {
+            background: rgb(colors.background),
+            foreground: rgb(colors.foreground),
+            ansi: Array.from({ length: 16 }, (_, at) => rgb(colors.palette[at] ?? null)),
+        };
+    }
+    handleKey(event) {
+        const view = this.focused;
+        if (!view)
+            return;
+        if (view.handleKey(event))
+            return;
+        const host = view.host;
+        if (!host)
+            return;
+        if (host.popup) {
+            if (event.kind !== "release" && event.key === "escape") {
+                host.popup.close();
+                return;
+            }
+            this.clipboardKeys(event, host.popup.input);
+            host.popup.input.key(event);
+            return;
+        }
+        if (event.kind !== "release" && view.devtoolsEnabled && this.isDevtoolsKey(event)) {
+            view.toggleDevtools();
+            return;
+        }
+        if (host.devtoolsFocused && host.devtools) {
+            this.clipboardKeys(event, host.devtools.input);
+            host.devtools.input.key(event);
+            return;
+        }
+        this.clipboardKeys(event, host);
+        host.key(event);
+    }
+    handlePaste(text) {
+        const host = this.focused?.host;
+        if (!host) {
+            this.focused?.paste?.(text);
+            return;
+        }
+        if (host.popup)
+            host.popup.input.paste(text);
+        else if (host.devtoolsFocused && host.devtools)
+            host.devtools.input.paste(text);
+        else
+            host.paste(text);
+    }
+    handlePasteImage(image) {
+        const host = this.focused?.host;
+        if (!host)
+            return;
+        if (host.popup)
+            host.popup.input.pasteImage(image);
+        else if (host.devtoolsFocused && host.devtools)
+            host.devtools.input.pasteImage(image);
+        else
+            host.pasteImage(image);
+    }
+    handleTerminalFocus(focused) {
+        this.setActive(this.focused, focused);
+    }
+    clipboardKeys(event, target) {
+        if (event.kind !== "press")
+            return;
+        if (this.clipboardHeld(event) && event.key === "v")
+            this.root.requestClipboardImage();
+        if (this.clipboardHeld(event) && (event.key === "c" || event.key === "x")) {
+            void target.selectionText().then((text) => {
+                if (text)
+                    this.root.setClipboard(text);
+            });
+        }
+    }
+    cmdHeld(event) {
+        return event.mods.super || (this.noSuper && event.mods.alt);
+    }
+    clipboardHeld(event) {
+        if (this.cmdHeld(event))
+            return true;
+        return (process.platform === "linux" && event.mods.ctrl && !event.mods.shift && !event.mods.alt);
+    }
+    isDevtoolsKey(event) {
+        const { key, mods } = event;
+        if (key === "f12" && !mods.super && !mods.ctrl && !mods.alt && !mods.shift)
+            return true;
+        if (key === "i" && mods.ctrl && mods.shift && !mods.alt && !mods.super)
+            return true;
+        if (process.platform === "darwin" && key === "i" && this.cmdHeld(event) && mods.alt)
+            return true;
+        return false;
+    }
+}
+exports.ViewRegistry = ViewRegistry;
+exports.RootContext = (0, react_1.createContext)(null);
+function useRegistryColors(registry) {
+    return (0, react_1.useSyncExternalStore)(registry.colors.subscribe, registry.colors.get, registry.colors.get);
+}
+exports.handleEntries = new WeakMap();

package/dist/root.d.ts

@@ -0,0 +1,19 @@
+import type { ReactNode } from "react";
+import type { EngineKeyEvent, PixelRoot, RootOptions as EngineRootOptions } from "./react";
+import type { WebViewHandle, WebViewProps } from "./webview";
+export interface RootOptions extends Omit<EngineRootOptions, "keyEventTypes" | "onKey" | "onEngineExit" | "onLayout" | "host" | "onHostClosed" | "onHandoff"> {
+    name?: string;
+    onKey?: (event: EngineKeyEvent) => boolean | void;
+    onQuit?: (view: WebViewHandle | null) => void;
+    onExit?: (code: number) => void;
+}
+export type LoadOptions = Omit<WebViewProps, "src" | "style" | "hidden" | "autoFocus">;
+export interface Root extends Omit<PixelRoot, "render" | "flushSync" | "stop" | "retarget"> {
+    readonly displayScale: number;
+    readonly hosted: boolean;
+    render(element: ReactNode): void;
+    loadURL(url: string, options?: LoadOptions): WebViewHandle;
+    loadFile(file: string, options?: LoadOptions): WebViewHandle;
+    stop(code?: number): void;
+}
+export declare function createRoot(options?: RootOptions): Root;

package/dist/root.js

@@ -0,0 +1,342 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createRoot = createRoot;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const node_child_process_1 = require("node:child_process");
+const node_crypto_1 = require("node:crypto");
+const node_fs_1 = __importDefault(require("node:fs"));
+const node_path_1 = __importDefault(require("node:path"));
+const node_url_1 = require("node:url");
+const react_1 = require("react");
+const electron_1 = require("electron");
+const debug_1 = require("./debug");
+const shell_1 = require("./host/shell");
+const server_1 = require("./host/server");
+const strip_1 = require("./host/strip");
+const instances_1 = require("./instances");
+const react_2 = require("./react");
+const registry_1 = require("./registry");
+const webview_1 = require("./webview");
+const scale_1 = require("./scale");
+const terminal_1 = require("./terminal");
+const offscreen_1 = require("./web/offscreen");
+const session_1 = require("./web/session");
+function ownTty() {
+    try {
+        const out = (0, node_child_process_1.execFileSync)("tty", { stdio: ["inherit", "pipe", "ignore"], encoding: "utf8" }).trim();
+        return out.startsWith("/dev/") ? out : undefined;
+    }
+    catch {
+        return undefined;
+    }
+}
+const liveRoots = new Set();
+let signalsInstalled = false;
+function installSignals() {
+    if (signalsInstalled)
+        return;
+    signalsInstalled = true;
+    const stopAll = (code) => () => {
+        for (const root of [...liveRoots])
+            root.stop(code);
+    };
+    process.on("SIGTERM", stopAll(143));
+    process.on("SIGHUP", stopAll(129));
+}
+const REJOIN_WAIT_MS = 5000;
+function waitForSocket(socket) {
+    return new Promise((resolve, reject) => {
+        const deadline = Date.now() + REJOIN_WAIT_MS;
+        const check = () => {
+            if (node_fs_1.default.existsSync(socket))
+                return resolve();
+            if (Date.now() > deadline)
+                return reject(new Error(`no owner appeared at ${socket}`));
+            setTimeout(check, 25);
+        };
+        check();
+    });
+}
+function createRoot(options = {}) {
+    if (!electron_1.app.isReady()) {
+        throw new Error("[placeholder copy: createRoot() needs electron to be ready. Run your entry with `pixel .`, which waits for app.whenReady() before loading it.]");
+    }
+    const env = options.sessionEnv ?? process.env;
+    const terminal = (0, terminal_1.detect)(env);
+    const tty = options.tty ?? env.PIXEL_TTY ?? ownTty();
+    const embed = env.PIXEL_EMBED ?? null;
+    let owner = tty && !embed ? (0, instances_1.findOwner)(tty) : null;
+    const name = options.name ?? electron_1.app.getName();
+    const cellZoom = new scale_1.CellZoomFollower();
+    const shell = new shell_1.Shell(() => name);
+    let registry = null;
+    let embedder = null;
+    let server = null;
+    let record = null;
+    let handoff = null;
+    let stopping = false;
+    const shutdown = (code, then = () => finish(code)) => {
+        if (stopping)
+            return;
+        stopping = true;
+        (0, debug_1.debug)("shutdown", { code, hosted: owner != null });
+        liveRoots.delete(root);
+        if (embedder)
+            (0, session_1.uninstallEmbedderApi)(embedder);
+        if (registry) {
+            for (const host of [...registry.hosts()]) {
+                try {
+                    host.stop();
+                }
+                catch { }
+            }
+        }
+        (0, session_1.flushSessions)();
+        try {
+            // wait whats going on here 
+            engineRoot.setPointerShape("text");
+        }
+        catch { }
+        try {
+            engineRoot.stop();
+        }
+        catch { }
+        record?.withdraw();
+        server?.stop();
+        then();
+    };
+    const finish = (code) => {
+        if (tty)
+            (0, instances_1.clearHandoff)(tty, env);
+        if (options.onExit)
+            options.onExit(code);
+        else
+            electron_1.app.exit(code);
+    };
+    const finishAfterSuccessor = (code) => {
+        if (!tty)
+            return finish(code);
+        const deadline = Date.now() + 15000;
+        const check = () => {
+            if ((0, instances_1.findOwner)(tty, env) || Date.now() > deadline)
+                return finish(code);
+            setTimeout(check, 25);
+        };
+        check();
+    };
+    const socketPath = tty ? node_path_1.default.join((0, instances_1.instancesDir)(env), `${(0, instances_1.instanceKey)(tty)}.sock`) : null;
+    const engineRoot = (0, react_2.createRoot)({
+        ...options,
+        tty: owner || embed ? undefined : tty,
+        host: owner
+            ? {
+                socket: owner.socket,
+                pane: env.PIXEL_PANE ?? (0, node_crypto_1.randomBytes)(8).toString("hex"),
+                name,
+            }
+            : embed && tty
+                ? { socket: embed, pane: (0, node_crypto_1.randomBytes)(8).toString("hex"), name, tty }
+                : undefined,
+        wrapper: options.wrapper ?? (owner || embed ? undefined : terminal?.wrapper),
+        keyEventTypes: true,
+        devtools: options.devtools ?? process.env.NODE_ENV !== "production",
+        onKey: (event) => {
+            if (shell.handleKey(event))
+                return;
+            if (!shell.guestActive() && options.onKey?.(event) === true)
+                return;
+            registry?.handleKey(event);
+        },
+        onPaste: (text) => {
+            if (!shell.guestActive())
+                options.onPaste?.(text);
+            registry?.handlePaste(text);
+        },
+        onPasteImage: (image) => {
+            if (!shell.guestActive())
+                options.onPasteImage?.(image);
+            registry?.handlePasteImage(image);
+        },
+        onFocus: (focused) => {
+            options.onFocus?.(focused);
+            registry?.handleTerminalFocus(focused);
+        },
+        onResize: (size) => {
+            const ratio = cellZoom.ratio(engineRoot.info);
+            if (registry) {
+                if (ratio != null) {
+                    for (const host of registry.hosts()) {
+                        host.scaleZoom(ratio);
+                        host.popup?.scaleZoom(ratio);
+                    }
+                }
+                for (const listener of registry.resizeListeners)
+                    listener();
+            }
+            options.onResize?.(size);
+        },
+        onColors: (colors) => {
+            (0, debug_1.debug)("colors", { background: colors.background });
+            if (registry) {
+                registry.colors.set(colors);
+                const background = registry.background();
+                for (const host of registry.hosts())
+                    void host.setBackground(background);
+                if (embedder)
+                    (0, session_1.broadcastTheme)(embedder, registry.theme());
+            }
+            options.onColors?.(colors);
+        },
+        onLayout: (snapshot) => registry?.layout.set(snapshot),
+        onHandoff: (next) => {
+            handoff = next;
+        },
+        onHostClosed: () => void ownerLeft(),
+        onEngineExit: (error) => {
+            if (error)
+                process.stderr.write(`pixel engine: ${error}\n`);
+            shutdown(error ? 1 : 0);
+        },
+    });
+    (0, offscreen_1.initOffscreenMode)(engineRoot.sharedTextures);
+    cellZoom.ratio(engineRoot.info);
+    const quit = (entry) => {
+        if (options.onQuit)
+            options.onQuit(entry?.handle ?? null);
+        else
+            shutdown(0);
+    };
+    registry = new registry_1.ViewRegistry(engineRoot, (0, scale_1.hostDisplayScale)(terminal, env), !engineRoot.info.kittyKeyboard, { quit: (entry) => quit(entry) });
+    const views = registry;
+    embedder = {
+        hosts: () => views.hosts(),
+        theme: () => views.theme(),
+        quit: (host) => quit([...views.views].find((view) => view.host === host) ?? null),
+    };
+    (0, session_1.installEmbedderApi)(embedder);
+    const becomeOwner = () => {
+        if (!tty || !socketPath)
+            return;
+        owner = null;
+        server = new server_1.OwnerServer(socketPath, () => ({
+            width: engineRoot.info.cellWidth,
+            height: engineRoot.info.cellHeight,
+        }));
+        server.onJoin = (guest) => {
+            const focused = views.focused;
+            shell.rememberFocus(() => {
+                if (focused && views.views.has(focused))
+                    views.focus(focused);
+            });
+            guest.onClose = () => shell.remove(guest);
+            shell.add(guest);
+        };
+        record = new instances_1.InstanceRecord({
+            tty,
+            pid: process.pid,
+            socket: socketPath,
+            protocol: instances_1.PROTOCOL,
+            name,
+            title: currentTitle,
+            cwd: options.cwd ?? process.cwd(),
+            startedAt: Date.now(),
+        }, env);
+    };
+    const ownerLeft = async () => {
+        if (stopping)
+            return;
+        const next = embed ? null : handoff;
+        handoff = null;
+        try {
+            if (next?.tty && socketPath) {
+                (0, debug_1.debug)("adopting tty", { tty: next.tty });
+                await engineRoot.retarget({ tty: next.tty, wrapper: terminal?.wrapper });
+                becomeOwner();
+                engineRoot.nudgeResize();
+                return;
+            }
+            if (next?.socket) {
+                (0, debug_1.debug)("rejoining", { socket: next.socket });
+                await waitForSocket(next.socket);
+                await engineRoot.retarget({
+                    host: { socket: next.socket, pane: (0, node_crypto_1.randomBytes)(8).toString("hex"), name },
+                });
+                return;
+            }
+            shutdown(0);
+        }
+        catch (error) {
+            process.stderr.write(`pixel: ${error instanceof Error ? error.message : String(error)}\n`);
+            shutdown(1);
+        }
+    };
+    shell.onCloseOwner = () => {
+        const successor = shell.successor();
+        if (!successor || !tty || !socketPath) {
+            quit(null);
+            return;
+        }
+        (0, instances_1.markHandoff)(tty, env);
+        successor.send({ type: "adopt", tty });
+        for (const other of shell.others(successor))
+            other.send({ type: "rejoin", socket: socketPath });
+        shutdown(0, () => finishAfterSuccessor(0));
+    };
+    let currentTitle = null;
+    if (owner) {
+        (0, debug_1.debug)("joined owner", { tty, owner: owner.name, pid: owner.pid });
+    }
+    else {
+        becomeOwner();
+    }
+    if (tty && !embed) {
+        process.on("SIGWINCH", () => {
+            if (!stopping && !owner)
+                engineRoot.nudgeResize();
+        });
+    }
+    installSignals();
+    const pageRef = (0, react_1.createRef)();
+    const loadURL = (url, options = {}) => {
+        if (pageRef.current) {
+            pageRef.current.loadURL(url);
+            return pageRef.current;
+        }
+        engineRoot.flushSync(() => {
+            root.render((0, jsx_runtime_1.jsx)(webview_1.WebView, { ref: pageRef, src: url, style: { width: "100%", height: "100%" }, ...options }));
+        });
+        if (!pageRef.current)
+            throw new Error("[placeholder copy: the page did not mount]");
+        return pageRef.current;
+    };
+    const root = {
+        ...engineRoot,
+        displayScale: views.displayScale,
+        get hosted() {
+            return owner != null || embed != null;
+        },
+        get info() {
+            return engineRoot.info;
+        },
+        render(element) {
+            (0, debug_1.debug)("render", { width: engineRoot.info.width, height: engineRoot.info.height });
+            engineRoot.render((0, jsx_runtime_1.jsx)(registry_1.RootContext.Provider, { value: views, children: (0, jsx_runtime_1.jsx)(strip_1.PaneShell, { shell: shell, children: element }) }));
+        },
+        loadURL,
+        loadFile: (file, options) => loadURL((0, node_url_1.pathToFileURL)(node_path_1.default.resolve(file)).href, options),
+        setTitle(text) {
+            currentTitle = text || null;
+            engineRoot.setTitle(text);
+            record?.setTitle(currentTitle);
+            shell.changed();
+        },
+        stop(code = 0) {
+            shutdown(code);
+        },
+    };
+    liveRoots.add(root);
+    return root;
+}

package/dist/sandbox.d.ts

@@ -0,0 +1,4 @@
+export declare function sandboxRefusal(): string | null;
+export declare function deniedRefusal(): string | null;
+export declare function linuxSandboxError(electronBinary: string): string | null;
+export declare function apparmorSetup(electronBinary: string): number;