@openchamber/sdk 2.1.0 → 2.1.1

package/dist/protocol.d.ts

@@ -128,6 +128,14 @@ export declare const hostMessageSchema: z.ZodUnion<readonly [z.ZodObject<{
                 font: z.ZodString;
                 mono: z.ZodString;
                 radius: z.ZodString;
+                syntaxKeyword: z.ZodOptional<z.ZodString>;
+                syntaxString: z.ZodOptional<z.ZodString>;
+                syntaxNumber: z.ZodOptional<z.ZodString>;
+                syntaxFunction: z.ZodOptional<z.ZodString>;
+                syntaxType: z.ZodOptional<z.ZodString>;
+                syntaxComment: z.ZodOptional<z.ZodString>;
+                syntaxVariable: z.ZodOptional<z.ZodString>;
+                syntaxOperator: z.ZodOptional<z.ZodString>;
             }, z.core.$strip>;
         }, z.core.$strip>;
         locale: z.ZodString;
@@ -146,6 +154,7 @@ export declare const hostMessageSchema: z.ZodUnion<readonly [z.ZodObject<{
             background: "background";
             status: "status";
             file: "file";
+            popover: "popover";
         }>;
         connection: z.ZodObject<{
             connected: z.ZodBoolean;
@@ -197,6 +206,15 @@ export declare const hostMessageSchema: z.ZodUnion<readonly [z.ZodObject<{
             }, z.core.$strip>>;
             data: z.ZodOptional<z.ZodJSONSchema>;
         }, z.core.$strip>]>>;
+        popover: z.ZodOptional<z.ZodObject<{
+            id: z.ZodString;
+            data: z.ZodCustom<import("./contract.ts").JsonValue, import("./contract.ts").JsonValue>;
+        }, z.core.$strict>>;
+        features: z.ZodOptional<z.ZodObject<{
+            deviceStorage: z.ZodOptional<z.ZodLiteral<true>>;
+            statusControls: z.ZodOptional<z.ZodLiteral<true>>;
+            popovers: z.ZodOptional<z.ZodLiteral<true>>;
+        }, z.core.$strip>>;
     }, z.core.$strip>;
     channel: z.ZodLiteral<"openchamber.sdk">;
     v: z.ZodLiteral<1>;
@@ -300,6 +318,29 @@ export declare const hostMessageSchema: z.ZodUnion<readonly [z.ZodObject<{
     }, z.core.$strip>;
     channel: z.ZodLiteral<"openchamber.sdk">;
     v: z.ZodLiteral<1>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"status-control-event">;
+    payload: z.ZodObject<{
+        id: z.ZodString;
+        value: z.ZodOptional<z.ZodString>;
+    }, z.core.$strict>;
+    channel: z.ZodLiteral<"openchamber.sdk">;
+    v: z.ZodLiteral<1>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"popover-closed">;
+    payload: z.ZodObject<{
+        id: z.ZodString;
+        reason: z.ZodEnum<{
+            escape: "escape";
+            outside: "outside";
+            anchor: "anchor";
+            owner: "owner";
+            closed: "closed";
+            replaced: "replaced";
+        }>;
+    }, z.core.$strict>;
+    channel: z.ZodLiteral<"openchamber.sdk">;
+    v: z.ZodLiteral<1>;
 }, z.core.$strip>, z.ZodObject<{
     type: z.ZodLiteral<"resolve">;
     id: z.ZodString;
@@ -880,18 +921,102 @@ export declare const guestMessageSchema: z.ZodDiscriminatedUnion<[z.ZodObject<{
     payload: z.ZodDiscriminatedUnion<[z.ZodObject<{
         op: z.ZodLiteral<"get">;
         key: z.ZodString;
+        scope: z.ZodOptional<z.ZodEnum<{
+            instance: "instance";
+            device: "device";
+        }>>;
     }, z.core.$strict>, z.ZodObject<{
         op: z.ZodLiteral<"delete">;
         key: z.ZodString;
+        scope: z.ZodOptional<z.ZodEnum<{
+            instance: "instance";
+            device: "device";
+        }>>;
     }, z.core.$strict>, z.ZodObject<{
         op: z.ZodLiteral<"set">;
         key: z.ZodString;
         value: z.ZodJSONSchema;
+        scope: z.ZodOptional<z.ZodEnum<{
+            instance: "instance";
+            device: "device";
+        }>>;
     }, z.core.$strict>, z.ZodObject<{
         op: z.ZodLiteral<"keys">;
+        scope: z.ZodOptional<z.ZodEnum<{
+            instance: "instance";
+            device: "device";
+        }>>;
     }, z.core.$strict>], "op">;
     channel: z.ZodLiteral<"openchamber.sdk">;
     v: z.ZodLiteral<1>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"status-controls">;
+    id: z.ZodString;
+    payload: z.ZodObject<{
+        controls: z.ZodArray<z.ZodDiscriminatedUnion<[z.ZodObject<{
+            kind: z.ZodLiteral<"button">;
+            id: z.ZodString;
+            label: z.ZodString;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strict>, z.ZodObject<{
+            kind: z.ZodLiteral<"select">;
+            id: z.ZodString;
+            label: z.ZodString;
+            value: z.ZodString;
+            options: z.ZodArray<z.ZodObject<{
+                value: z.ZodString;
+                label: z.ZodString;
+            }, z.core.$strict>>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strict>], "kind">>;
+    }, z.core.$strict>;
+    channel: z.ZodLiteral<"openchamber.sdk">;
+    v: z.ZodLiteral<1>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"popover-open">;
+    id: z.ZodString;
+    payload: z.ZodObject<{
+        id: z.ZodString;
+        anchor: z.ZodObject<{
+            x: z.ZodNumber;
+            y: z.ZodNumber;
+            width: z.ZodNumber;
+            height: z.ZodNumber;
+        }, z.core.$strict>;
+        width: z.ZodNumber;
+        height: z.ZodNumber;
+        side: z.ZodOptional<z.ZodEnum<{
+            left: "left";
+            right: "right";
+            top: "top";
+            bottom: "bottom";
+        }>>;
+        focus: z.ZodOptional<z.ZodBoolean>;
+        data: z.ZodCustom<import("./contract.ts").JsonValue, import("./contract.ts").JsonValue>;
+    }, z.core.$strict>;
+    channel: z.ZodLiteral<"openchamber.sdk">;
+    v: z.ZodLiteral<1>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"popover-close">;
+    id: z.ZodString;
+    payload: z.ZodObject<{
+        id: z.ZodString;
+        reason: z.ZodOptional<z.ZodEnum<{
+            escape: "escape";
+            closed: "closed";
+        }>>;
+    }, z.core.$strict>;
+    channel: z.ZodLiteral<"openchamber.sdk">;
+    v: z.ZodLiteral<1>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"popover-anchor">;
+    id: z.ZodString;
+    payload: z.ZodObject<{
+        id: z.ZodString;
+        active: z.ZodBoolean;
+    }, z.core.$strict>;
+    channel: z.ZodLiteral<"openchamber.sdk">;
+    v: z.ZodLiteral<1>;
 }, z.core.$strip>, z.ZodObject<{
     type: z.ZodLiteral<"open-session">;
     id: z.ZodString;

package/dist/protocol.js

@@ -1,5 +1,7 @@
 import { z } from 'zod';
 import { guestSessionWorktreeSchema, guestStorageRequestSchema, guestStorageResultSchema, guestWorkspaceQuerySchema, guestWorkspaceSnapshotSchema } from "./workspace-schemas.js";
+import { guestStatusControlEventSchema, guestStatusControlsSchema } from "./status-control-schemas.js";
+import { guestPopoverClosedEventSchema, guestPopoverDataSchema, guestPopoverRequestSchema } from "./popover-schemas.js";
 import { OPENCHAMBER_SDK_API_VERSION, OPENCHAMBER_SDK_CHANNEL } from "./api-version.js";
 import { SERVICE_STATUS_VALUES, ATTACH_PROVIDER_ID, GUEST_ACCOUNT_MAX, GUEST_ATTACH_AUTHOR_MAX, GUEST_BADGE_MAX, GUEST_FRAME_HEIGHT_MAX, GUEST_COMMIT_SHA, GUEST_ITEM_MESSAGE_TEXT_MAX, GUEST_ITEM_SESSION_MAX, GUEST_RESOLVE_ERROR_MAX, GUEST_ATTACH_BRANCH_MAX, GUEST_ATTACH_DATA_MAX, GUEST_ATTACH_ID_MAX, GUEST_ATTACH_TEXT_MAX, GUEST_ATTACH_TITLE_MAX, GUEST_ATTACH_URL_MAX, GUEST_CLIPBOARD_TEXT_MAX, GUEST_COMPOSE_TEXT_MAX, GUEST_FILE_CONTENT_MAX, GUEST_FILE_ENTRY_KINDS, GUEST_FILE_LIST_MAX, GUEST_GENERATE_OUTPUT_TOKENS_MAX, GUEST_GENERATE_PROMPT_MAX, GUEST_GENERATE_SYSTEM_MAX, GUEST_GENERATE_TEXT_MAX, GUEST_FILE_PATH_MAX, GUEST_FILE_STAT_KINDS, GUEST_REQUEST_BODY_MAX, GUEST_REQUEST_PATH_MAX, GUEST_REQUEST_RESPONSE_MAX, GUEST_SESSION_AGENT_MAX, GUEST_SESSION_MODEL_MAX, GUEST_SETTING_VALUE_MAX, GUEST_TOAST_MAX, SESSION_LIFECYCLE_PHASES, SETTING_KEY, START_SESSION_SENT, isGuestFilePath, isGuestRequestPath, resolveHostRequestErrorCode, } from "./contract.js";
 import { GUEST_FILE_EDITOR_CONTENT_MAX, GUEST_FILE_EDITOR_VERSION_MAX } from "./file-editor.js";
@@ -39,6 +41,14 @@ const themeTokensSchema = z.object({
     font: z.string().min(1),
     mono: z.string().min(1),
     radius: z.string().min(1),
+    syntaxKeyword: z.string().min(1).optional(),
+    syntaxString: z.string().min(1).optional(),
+    syntaxNumber: z.string().min(1).optional(),
+    syntaxFunction: z.string().min(1).optional(),
+    syntaxType: z.string().min(1).optional(),
+    syntaxComment: z.string().min(1).optional(),
+    syntaxVariable: z.string().min(1).optional(),
+    syntaxOperator: z.string().min(1).optional(),
 });
 const sessionSnapshotSchema = z.object({
     id: z.string().min(1),
@@ -151,10 +161,16 @@ const readyPayloadSchema = z.object({
     locale: z.string().min(1),
     directory: z.string().nullable(),
     session: sessionSnapshotSchema,
-    surface: z.enum(['panel', 'dialog', 'page', 'background', 'status', 'file']),
+    surface: z.enum(['panel', 'dialog', 'page', 'background', 'status', 'file', 'popover']),
     connection: guestConnectionSchema,
     settings: guestSettingsSchema,
     item: guestItemSchema,
+    popover: z.object({ id: z.string().min(1).max(80), data: guestPopoverDataSchema }).strict().optional(),
+    features: z.object({
+        deviceStorage: z.literal(true).optional(),
+        statusControls: z.literal(true).optional(),
+        popovers: z.literal(true).optional(),
+    }).optional(),
 });
 const hostResultSchema = z.object({
     ...envelope,
@@ -248,6 +264,12 @@ export const hostMessageSchema = z.union([
             item: guestItemSchema,
         }),
     }),
+    z.object({
+        ...envelope,
+        type: z.literal('status-control-event'),
+        payload: guestStatusControlEventSchema,
+    }),
+    z.object({ ...envelope, type: z.literal('popover-closed'), payload: guestPopoverClosedEventSchema }),
     z.object({
         ...envelope,
         type: z.literal('resolve'),
@@ -311,6 +333,15 @@ export const guestMessageSchema = z.discriminatedUnion('type', [
     z.object({ ...envelope, type: z.literal('workspace-subscribe'), id: z.string().min(1), payload: z.object({ subscriptionId: z.string().min(1).max(128), query: guestWorkspaceQuerySchema }) }),
     z.object({ ...envelope, type: z.literal('workspace-unsubscribe'), id: z.string().min(1), payload: z.object({ subscriptionId: z.string().min(1).max(128) }) }),
     z.object({ ...envelope, type: z.literal('storage'), id: z.string().min(1), payload: guestStorageRequestSchema }),
+    z.object({
+        ...envelope,
+        type: z.literal('status-controls'),
+        id: z.string().min(1),
+        payload: z.object({ controls: guestStatusControlsSchema }).strict(),
+    }),
+    z.object({ ...envelope, type: z.literal('popover-open'), id: z.string().min(1), payload: guestPopoverRequestSchema }),
+    z.object({ ...envelope, type: z.literal('popover-close'), id: z.string().min(1), payload: z.object({ id: z.string().min(1).max(80), reason: z.enum(['closed', 'escape']).optional() }).strict() }),
+    z.object({ ...envelope, type: z.literal('popover-anchor'), id: z.string().min(1), payload: z.object({ id: z.string().min(1).max(80), active: z.boolean() }).strict() }),
     z.object({ ...envelope, type: z.literal('open-session'), id: z.string().min(1), payload: z.object({ sessionId: z.string().min(1).max(1024) }) }),
     z.object({
         ...envelope,

package/dist/schemas.d.ts

@@ -1,6 +1,8 @@
 export { openChamberManifestSchema, PACKAGE_VERSION_PATTERN, packageManifestSchema, parseManifest, parseManifestJson, } from './parse.ts';
 export type { ManifestDocument } from './parse.ts';
 export { guestStorageRequestSchema, guestStorageResultSchema, guestWorkspaceSnapshotSchema } from './workspace-schemas.ts';
+export { guestStatusControlsSchema, guestStatusControlEventSchema } from './status-control-schemas.ts';
+export { guestPopoverClosedEventSchema, guestPopoverRequestSchema } from './popover-schemas.ts';
 export { guestMessageSchema, hostMessageSchema, parseGuestMessage, parseHostMessage, } from './protocol.ts';
 export { browserControlActionSchema, browserProviderResultSchema } from './service-provider-schemas.ts';
 export { surfaceClipboardAnswerSchema, surfaceControllerSchema, surfaceHostMessageSchema, surfaceInputEventSchema, surfaceResizeAnswerSchema, surfaceViewerMessageSchema, } from './service-surface-schemas.ts';

package/dist/schemas.js

@@ -3,6 +3,8 @@
 // `@openchamber/sdk`, which carries no schema library.
 export { openChamberManifestSchema, PACKAGE_VERSION_PATTERN, packageManifestSchema, parseManifest, parseManifestJson, } from "./parse.js";
 export { guestStorageRequestSchema, guestStorageResultSchema, guestWorkspaceSnapshotSchema } from "./workspace-schemas.js";
+export { guestStatusControlsSchema, guestStatusControlEventSchema } from "./status-control-schemas.js";
+export { guestPopoverClosedEventSchema, guestPopoverRequestSchema } from "./popover-schemas.js";
 export { guestMessageSchema, hostMessageSchema, parseGuestMessage, parseHostMessage, } from "./protocol.js";
 export { browserControlActionSchema, browserProviderResultSchema } from "./service-provider-schemas.js";
 export { surfaceClipboardAnswerSchema, surfaceControllerSchema, surfaceHostMessageSchema, surfaceInputEventSchema, surfaceResizeAnswerSchema, surfaceViewerMessageSchema, } from "./service-surface-schemas.js";

package/dist/status-control-schemas.d.ts

@@ -0,0 +1,21 @@
+import { z } from 'zod';
+export declare const guestStatusControlsSchema: z.ZodArray<z.ZodDiscriminatedUnion<[z.ZodObject<{
+    kind: z.ZodLiteral<"button">;
+    id: z.ZodString;
+    label: z.ZodString;
+    disabled: z.ZodOptional<z.ZodBoolean>;
+}, z.core.$strict>, z.ZodObject<{
+    kind: z.ZodLiteral<"select">;
+    id: z.ZodString;
+    label: z.ZodString;
+    value: z.ZodString;
+    options: z.ZodArray<z.ZodObject<{
+        value: z.ZodString;
+        label: z.ZodString;
+    }, z.core.$strict>>;
+    disabled: z.ZodOptional<z.ZodBoolean>;
+}, z.core.$strict>], "kind">>;
+export declare const guestStatusControlEventSchema: z.ZodObject<{
+    id: z.ZodString;
+    value: z.ZodOptional<z.ZodString>;
+}, z.core.$strict>;

package/dist/status-control-schemas.js

@@ -0,0 +1,29 @@
+import { z } from 'zod';
+import { GUEST_STATUS_CONTROL_ID, GUEST_STATUS_CONTROL_LABEL_MAX, GUEST_STATUS_CONTROL_OPTIONS_MAX, GUEST_STATUS_CONTROL_VALUE_MAX, GUEST_STATUS_CONTROLS_MAX, } from "./status-controls.js";
+const idSchema = z.string().regex(GUEST_STATUS_CONTROL_ID);
+const labelSchema = z.string().min(1).max(GUEST_STATUS_CONTROL_LABEL_MAX);
+const optionSchema = z.object({
+    value: z.string().min(1).max(GUEST_STATUS_CONTROL_VALUE_MAX),
+    label: labelSchema,
+}).strict();
+const buttonSchema = z.object({
+    kind: z.literal('button'),
+    id: idSchema,
+    label: labelSchema,
+    disabled: z.boolean().optional(),
+}).strict();
+const selectSchema = z.object({
+    kind: z.literal('select'),
+    id: idSchema,
+    label: labelSchema,
+    value: z.string().min(1).max(GUEST_STATUS_CONTROL_VALUE_MAX),
+    options: z.array(optionSchema).min(1).max(GUEST_STATUS_CONTROL_OPTIONS_MAX),
+    disabled: z.boolean().optional(),
+}).strict().refine((control) => new Set(control.options.map((option) => option.value)).size === control.options.length, { message: 'status control option values must be unique', path: ['options'] }).refine((control) => control.options.some((option) => option.value === control.value), { message: 'status control value must be one of its options', path: ['value'] });
+export const guestStatusControlsSchema = z.array(z.discriminatedUnion('kind', [buttonSchema, selectSchema]))
+    .max(GUEST_STATUS_CONTROLS_MAX)
+    .refine((controls) => new Set(controls.map((control) => control.id)).size === controls.length, { message: 'status control ids must be unique' });
+export const guestStatusControlEventSchema = z.object({
+    id: idSchema,
+    value: z.string().min(1).max(GUEST_STATUS_CONTROL_VALUE_MAX).optional(),
+}).strict();

package/dist/status-controls.d.ts

@@ -0,0 +1,31 @@
+export declare const GUEST_STATUS_CONTROLS_MAX = 4;
+export declare const GUEST_STATUS_CONTROL_ID: RegExp;
+export declare const GUEST_STATUS_CONTROL_LABEL_MAX = 60;
+export declare const GUEST_STATUS_CONTROL_OPTIONS_MAX = 16;
+export declare const GUEST_STATUS_CONTROL_VALUE_MAX = 80;
+export type GuestStatusControlOption = {
+    value: string;
+    label: string;
+};
+export type GuestStatusControl = {
+    kind: 'button';
+    id: string;
+    label: string;
+    disabled?: boolean;
+} | {
+    kind: 'select';
+    id: string;
+    label: string;
+    value: string;
+    options: GuestStatusControlOption[];
+    disabled?: boolean;
+};
+export type GuestStatusControlEvent = {
+    id: string;
+    value?: string;
+};
+/**
+ * Guest-side fast-fail guard for `setStatusControls`. The host zod schema is
+ * still authoritative because JavaScript callers can bypass this SDK method.
+ */
+export declare const isGuestStatusControls: (controls: GuestStatusControl[]) => boolean;

package/dist/status-controls.js

@@ -0,0 +1,48 @@
+export const GUEST_STATUS_CONTROLS_MAX = 4;
+export const GUEST_STATUS_CONTROL_ID = /^[a-z][a-z0-9-]{0,39}$/;
+export const GUEST_STATUS_CONTROL_LABEL_MAX = 60;
+export const GUEST_STATUS_CONTROL_OPTIONS_MAX = 16;
+export const GUEST_STATUS_CONTROL_VALUE_MAX = 80;
+const isControlObject = (value) => (Object(value) === value && !Array.isArray(value));
+const hasOnlyKeys = (value, keys) => Object.keys(value).every((key) => keys.includes(key));
+const isLabel = (value) => (String(value) === value && value.length >= 1 && value.length <= GUEST_STATUS_CONTROL_LABEL_MAX);
+const isValue = (value) => (String(value) === value && value.length >= 1 && value.length <= GUEST_STATUS_CONTROL_VALUE_MAX);
+/**
+ * Guest-side fast-fail guard for `setStatusControls`. The host zod schema is
+ * still authoritative because JavaScript callers can bypass this SDK method.
+ */
+export const isGuestStatusControls = (controls) => {
+    // The public type is precise, but this boundary also receives untyped JavaScript callers.
+    if (!Array.isArray(controls) || controls.length > GUEST_STATUS_CONTROLS_MAX)
+        return false;
+    const ids = new Set();
+    for (const control of controls) {
+        if (!isControlObject(control) || !GUEST_STATUS_CONTROL_ID.test(control.id) || !isLabel(control.label))
+            return false;
+        if (control.disabled !== undefined && control.disabled !== true && control.disabled !== false)
+            return false;
+        if (ids.has(control.id))
+            return false;
+        ids.add(control.id);
+        if (control.kind === 'button') {
+            if (!hasOnlyKeys(control, ['kind', 'id', 'label', 'disabled']))
+                return false;
+            continue;
+        }
+        if (control.kind !== 'select' || !hasOnlyKeys(control, ['kind', 'id', 'label', 'value', 'options', 'disabled']))
+            return false;
+        if (!isValue(control.value) || !Array.isArray(control.options)
+            || control.options.length < 1 || control.options.length > GUEST_STATUS_CONTROL_OPTIONS_MAX)
+            return false;
+        const values = new Set();
+        for (const option of control.options) {
+            if (!isControlObject(option) || !hasOnlyKeys(option, ['value', 'label'])
+                || !isValue(option.value) || !isLabel(option.label) || values.has(option.value))
+                return false;
+            values.add(option.value);
+        }
+        if (!values.has(control.value))
+            return false;
+    }
+    return true;
+};

package/dist/ui/index.d.ts

@@ -33,3 +33,5 @@ export { mountMenu } from './menu.ts';
 export type { MenuHandle, MenuItem, MenuProps } from './menu.ts';
 export { mountText, splitTextMedia } from './text.ts';
 export type { TextHandle, TextPart, TextProps } from './text.ts';
+export { mountPopoverAnchor } from './popover-anchor.ts';
+export type { PopoverAnchorHandle, PopoverAnchorOptions } from './popover-anchor.ts';

package/dist/ui/index.js

@@ -15,3 +15,4 @@ export { mountSeparator } from "./separator.js";
 export { mountProgress } from "./progress.js";
 export { mountMenu } from "./menu.js";
 export { mountText, splitTextMedia } from "./text.js";
+export { mountPopoverAnchor } from "./popover-anchor.js";

package/dist/ui/popover-anchor.d.ts

@@ -0,0 +1,16 @@
+import type { HostClient } from '../host.ts';
+import type { GuestPopoverSide } from '../popover.ts';
+import type { JsonValue } from '../contract.ts';
+export type PopoverAnchorOptions = {
+    host: Pick<HostClient, 'openPopover' | 'closePopover' | 'setPopoverAnchorActive' | 'onPopoverClosed'>;
+    getData: () => JsonValue;
+    width: number;
+    height: number;
+    side?: GuestPopoverSide;
+    label?: string;
+};
+export type PopoverAnchorHandle = {
+    dispose: () => void;
+};
+/** Adds a bounded host popover preview to an extension-owned element. */
+export declare const mountPopoverAnchor: (element: HTMLElement, options: PopoverAnchorOptions) => PopoverAnchorHandle;

package/dist/ui/popover-anchor.js

@@ -0,0 +1,198 @@
+let nextPopoverAnchorId = 0;
+const isKeyboardEvent = (event) => 'key' in event;
+/** Adds a bounded host popover preview to an extension-owned element. */
+export const mountPopoverAnchor = (element, options) => {
+    const document = element.ownerDocument;
+    const window = document.defaultView;
+    let timer = null;
+    let activeId = null;
+    let disposed = false;
+    let ignoreNextFocus = false;
+    let pointerActive = false;
+    let focusActive = false;
+    let observer = null;
+    const previousExpanded = element.getAttribute('aria-expanded');
+    const previousPopup = element.getAttribute('aria-haspopup');
+    const previousLabel = element.getAttribute('aria-label');
+    const ownsExpanded = previousExpanded === null;
+    const clearTimer = () => {
+        if (timer !== null)
+            clearTimeout(timer);
+        timer = null;
+    };
+    const removeActiveListeners = () => {
+        document.removeEventListener('scroll', closeForAnchor, true);
+        document.removeEventListener('pointerdown', closeForOutside, true);
+        window?.removeEventListener('resize', closeForAnchor);
+        observer?.disconnect();
+        observer = null;
+    };
+    const close = (reason = 'closed', restoreFocus = false) => {
+        const id = activeId;
+        clearTimer();
+        activeId = null;
+        removeActiveListeners();
+        element.removeAttribute('data-oc-popover-open');
+        if (ownsExpanded)
+            element.setAttribute('aria-expanded', 'false');
+        if (id)
+            void options.host.closePopover(id, reason).catch(() => undefined);
+        if (restoreFocus) {
+            ignoreNextFocus = true;
+            element.focus();
+            queueMicrotask(() => { ignoreNextFocus = false; });
+        }
+    };
+    const closeForAnchor = () => close();
+    const closeForOutside = (event) => {
+        const target = event.target;
+        // SAFETY: DOM pointer events target a Node; this avoids cross-realm constructors.
+        if (target !== element && !element.contains(target))
+            close();
+    };
+    const watchActive = () => {
+        document.addEventListener('scroll', closeForAnchor, true);
+        document.addEventListener('pointerdown', closeForOutside, true);
+        window?.addEventListener('resize', closeForAnchor);
+        observer = new MutationObserver(() => { if (!document.contains(element))
+            close(); });
+        observer.observe(document, { childList: true, subtree: true });
+    };
+    const reportAnchorActivity = () => {
+        if (activeId)
+            void options.host.setPopoverAnchorActive(activeId, pointerActive || focusActive).catch(() => undefined);
+    };
+    const open = (focus) => {
+        clearTimer();
+        if (disposed || activeId || !element.isConnected)
+            return;
+        const rect = element.getBoundingClientRect();
+        if (rect.width <= 0 || rect.height <= 0)
+            return;
+        const id = `oc-popover-${++nextPopoverAnchorId}`;
+        let data;
+        try {
+            data = options.getData();
+        }
+        catch {
+            return;
+        }
+        activeId = id;
+        element.setAttribute('data-oc-popover-open', 'true');
+        if (ownsExpanded)
+            element.setAttribute('aria-expanded', 'true');
+        watchActive();
+        void options.host.openPopover({
+            id,
+            anchor: { x: rect.x, y: rect.y, width: rect.width, height: rect.height },
+            width: options.width,
+            height: options.height,
+            side: options.side,
+            focus,
+            data,
+        }).catch(() => {
+            if (activeId === id)
+                close();
+        });
+    };
+    const scheduleOpen = () => {
+        if (!activeId && !disposed && timer === null)
+            timer = setTimeout(() => open(false), 250);
+    };
+    const onPointerEnter = (event) => {
+        if ('pointerType' in event && event.pointerType && event.pointerType !== 'mouse')
+            return;
+        pointerActive = true;
+        if (activeId)
+            reportAnchorActivity();
+        else if (!ignoreNextFocus)
+            scheduleOpen();
+    };
+    const onPointerLeave = (event) => {
+        if ('pointerType' in event && event.pointerType && event.pointerType !== 'mouse')
+            return;
+        pointerActive = false;
+        clearTimer();
+        reportAnchorActivity();
+    };
+    const onFocus = () => {
+        focusActive = true;
+        if (activeId)
+            reportAnchorActivity();
+        else if (!ignoreNextFocus && element.matches(':focus-visible'))
+            open(false);
+    };
+    const onFocusOut = () => {
+        focusActive = false;
+        reportAnchorActivity();
+    };
+    const onKeyDown = (event) => {
+        if (!isKeyboardEvent(event))
+            return;
+        if (event.key === 'ArrowRight') {
+            event.preventDefault();
+            if (activeId)
+                close();
+            open(true);
+        }
+        else if (event.key === 'Escape' && activeId) {
+            event.preventDefault();
+            close('escape', true);
+        }
+    };
+    const unsubscribe = options.host.onPopoverClosed((event) => {
+        if (event.id !== activeId)
+            return;
+        activeId = null;
+        clearTimer();
+        removeActiveListeners();
+        element.removeAttribute('data-oc-popover-open');
+        if (ownsExpanded)
+            element.setAttribute('aria-expanded', 'false');
+        if (event.reason === 'escape') {
+            ignoreNextFocus = true;
+            element.focus();
+            queueMicrotask(() => { ignoreNextFocus = false; });
+        }
+    });
+    element.setAttribute('aria-haspopup', 'dialog');
+    if (ownsExpanded)
+        element.setAttribute('aria-expanded', 'false');
+    if (options.label)
+        element.setAttribute('aria-label', options.label);
+    element.addEventListener('pointerenter', onPointerEnter);
+    // Crossing opaque iframe documents can omit an enter transition. A real
+    // pointer move over this element still establishes a new hover intent.
+    element.addEventListener('pointermove', onPointerEnter);
+    element.addEventListener('pointerleave', onPointerLeave);
+    element.addEventListener('focus', onFocus);
+    element.addEventListener('focusout', onFocusOut);
+    element.addEventListener('keydown', onKeyDown);
+    return { dispose: () => {
+            if (disposed)
+                return;
+            disposed = true;
+            clearTimer();
+            close();
+            unsubscribe();
+            element.removeAttribute('data-oc-popover-open');
+            if (previousExpanded === null)
+                element.removeAttribute('aria-expanded');
+            if (previousPopup === null)
+                element.removeAttribute('aria-haspopup');
+            else
+                element.setAttribute('aria-haspopup', previousPopup);
+            if (options.label) {
+                if (previousLabel === null)
+                    element.removeAttribute('aria-label');
+                else
+                    element.setAttribute('aria-label', previousLabel);
+            }
+            element.removeEventListener('pointerenter', onPointerEnter);
+            element.removeEventListener('pointermove', onPointerEnter);
+            element.removeEventListener('pointerleave', onPointerLeave);
+            element.removeEventListener('focus', onFocus);
+            element.removeEventListener('focusout', onFocusOut);
+            element.removeEventListener('keydown', onKeyDown);
+        } };
+};

package/dist/ui/theme.js

@@ -54,6 +54,16 @@ const TOKEN_VARS = [
     ['--font-mono', 'mono'],
     ['--radius', 'radius'],
 ];
+const SYNTAX_TOKEN_VARS = [
+    ['--oc-syntax-keyword', '--syntax-keyword', 'syntaxKeyword'],
+    ['--oc-syntax-string', '--syntax-string', 'syntaxString'],
+    ['--oc-syntax-number', '--syntax-number', 'syntaxNumber'],
+    ['--oc-syntax-function', '--syntax-function', 'syntaxFunction'],
+    ['--oc-syntax-type', '--syntax-type', 'syntaxType'],
+    ['--oc-syntax-comment', '--syntax-comment', 'syntaxComment'],
+    ['--oc-syntax-variable', '--syntax-variable', 'syntaxVariable'],
+    ['--oc-syntax-operator', '--syntax-operator', 'syntaxOperator'],
+];
 /**
  * Paint the host theme onto the iframe root. Guest chrome reads these
  * variables, and the root itself gets the host font and text colour so plain
@@ -65,6 +75,11 @@ export const applyHostTheme = (theme, root) => {
     for (const [name, key] of TOKEN_VARS) {
         root.style.setProperty(name, theme.tokens[key]);
     }
+    for (const [alias, hostName, key] of SYNTAX_TOKEN_VARS) {
+        const value = theme.tokens[key] ?? '';
+        root.style.setProperty(alias, value);
+        root.style.setProperty(hostName, value);
+    }
     root.style.setProperty('font-family', theme.tokens.font);
     root.style.setProperty('font-size', '0.875rem');
     root.style.setProperty('line-height', '1.45');