@nyte-ai/plugin 0.0.0-stage → 0.0.18

package/dist/src/canvas/canvas-protocol.d.ts

@@ -0,0 +1,184 @@
+/** The shell surface a compiled module was built against. Bump on any change to `KIT`, a kit component's props, the libraries or the global; a shell renders a canvas whose runtime is at most its own. Runtime 2 added `react-dom` and the libraries; the compiler stamps a canvas with 2 only when it imports one of them, so a runtime 1 shell still renders the rest. */
+export declare const CANVAS_RUNTIME = 2;
+/** The global the shell installs before importing a module: `{ runtime, react, jsxRuntime, reactDom, kit, library }`, where `library(specifier)` loads one of `LIBRARY_EXPORTS`' modules. */
+export declare const CANVAS_GLOBAL = "__nyteCanvas";
+/** The import specifier for the kit. */
+export declare const KIT_SPECIFIER = "nyte/canvas";
+/** The entry module's file name: the tool's `source`, which its other files are imported from. */
+export declare const CANVAS_ENTRY = "main.tsx";
+/** Bytes of TSX the tool accepts, across every file of one canvas. */
+export declare const CANVAS_SOURCE_LIMIT = 65536;
+/** Bytes of compiled module a part may hold. */
+export declare const CANVAS_CODE_LIMIT = 196608;
+/** The frame's height range in CSS pixels; a taller canvas scrolls inside. */
+export declare const CANVAS_MIN_HEIGHT = 48;
+export declare const CANVAS_MAX_HEIGHT = 2000;
+/** The height hint range the tool accepts. */
+export declare const CANVAS_MIN_HEIGHT_HINT = 80;
+/** The frame height before a canvas reports its own, when the agent gave no hint. */
+export declare const CANVAS_DEFAULT_HEIGHT = 80;
+/** React 19's public surface a canvas may import, without `act`, `version` and the unstable or server-only names. */
+export declare const REACT_EXPORTS: readonly ["Activity", "Children", "Component", "Fragment", "Profiler", "PureComponent", "StrictMode", "Suspense", "ViewTransition", "addTransitionType", "cache", "cloneElement", "createContext", "createElement", "createRef", "forwardRef", "isValidElement", "lazy", "memo", "startTransition", "use", "useActionState", "useCallback", "useContext", "useDebugValue", "useDeferredValue", "useEffect", "useEffectEvent", "useId", "useImperativeHandle", "useInsertionEffect", "useLayoutEffect", "useMemo", "useOptimistic", "useReducer", "useRef", "useState", "useSyncExternalStore", "useTransition"];
+export declare const JSX_RUNTIME_EXPORTS: readonly ["Fragment", "jsx", "jsxs"];
+/** The two `react-dom` names a canvas may import; the shell owns the root, so nothing that mounts one. */
+export declare const REACT_DOM_EXPORTS: readonly ["createPortal", "flushSync"];
+/** Every name each library exports, by its import specifier. */
+export declare const LIBRARY_EXPORTS: Readonly<Record<string, readonly string[]>>;
+/** Each library's pinned version, by its import specifier. */
+export declare const LIBRARY_VERSIONS: Readonly<Record<string, string>>;
+/**
+ * A source file's place in a compiled module: its name, the module line its
+ * first line sits on, and how many lines it has.
+ */
+export type CanvasFileSpan = readonly [file: string, start: number, lines: number];
+/** Returns the comment a compiled module opens with, naming where each source file sits in it. */
+export declare function canvasFilesComment(spans: readonly CanvasFileSpan[]): string;
+/** Returns `file:line` for the first frame of a stack that runs in a compiled module, which the shell loads from a blob URL, or undefined when no frame lands in a source file (the linker's own lines, a module without the files comment). Sucrase keeps lines, not columns, so a stack's column belongs to the compiled code and is left out. */
+export declare function locateCanvasStack(code: string, stack: string): string | undefined;
+/**
+ * The hues a series, a sparkline or a meter may name; charts without one take
+ * the first eight in this order. Neighbours stay apart under protan and deutan
+ * vision (OKLab ΔE ≥ 10 on the chart-series step), the first three stay apart
+ * pairwise, and yellow, the one hue under 3:1 on white, comes late.
+ */
+export declare const TINTS: readonly ["blue", "pink", "orange", "teal", "red", "yellow", "purple", "green", "gray", "brown"];
+/**
+ * The kit, name by name, each with the one-line signature the model reads.
+ * `packages/canvas` exports exactly these names, in a test; the compiler
+ * answers any other import of `nyte/canvas` with a positioned error.
+ */
+export declare const KIT: {
+    readonly Stack: "{ direction?: \"row\" | \"column\" = \"column\", gap?: 0 | 1 | 2 | 3 | 4 | 6 = 2 (×4 px), align?: \"start\" | \"center\" | \"end\" | \"stretch\", justify?: \"start\" | \"center\" | \"end\" | \"between\", wrap?: boolean, children }: flex layout";
+    readonly Grid: "{ columns?: number | \"auto\" = \"auto\", minWidth?: number = 160 (px, with \"auto\"), gap?: 0 | 1 | 2 | 3 | 4 | 6 = 2, children }: equal columns";
+    readonly Divider: "{}: a hairline";
+    readonly Heading: "{ level?: 1 | 2 | 3 = 2, children }";
+    readonly Text: "{ size?: \"xs\" | \"sm\" | \"base\" | \"lg\", tone?: \"primary\" | \"secondary\" | \"tertiary\", weight?: \"normal\" | \"medium\" | \"semibold\", mono?: boolean, truncate?: boolean, align?: \"start\" | \"center\" | \"end\", children }";
+    readonly Code: "{ block?: boolean, children: string }: monospace, inline or a block";
+    readonly Stat: "{ label: string, value: ReactNode, detail?: ReactNode, tone?: \"neutral\" | \"success\" | \"warning\" | \"danger\" }: a labelled number";
+    readonly Badge: "{ tone?: \"neutral\" | \"info\" | \"success\" | \"warning\" | \"danger\", children }";
+    readonly Meter: "{ value: number, max?: number = 100, label?: string, tone?: \"primary\" | \"success\" | \"warning\" | \"danger\" = \"primary\" }: a thin filled bar with the value beside the label";
+    readonly Table: "{ columns: { key: string, label: ReactNode, align?: \"start\" | \"end\", width?: number | string }[], rows: Record<string, ReactNode>[], caption?: string }: rows are keyed by column key; a cell can hold a Sparkline or a Badge";
+    readonly Callout: "{ tone?: \"info\" | \"success\" | \"warning\" | \"danger\", title?: string, children }";
+    readonly Card: "{ title?: ReactNode, actions?: ReactNode, padding?: 0 | 2 | 3 | 4 = 4, children }: an elevated bordered surface";
+    readonly StackedBars: "{ label: string, series: { key: string, label: string, tint: Tint }[], buckets: { key: string, label: string, values: number[] }[], format: (value: number) => string, height?: number = 88, ticks?: number = 5 }: compact stacked bars without axes, a readout on pointer or arrow keys; the numbers live in the copy around it. Preferred beside a Stat or a heading figure";
+    readonly Sparkline: "{ values: number[], tint?: Tint, label?: string, width?: number = 72, height?: number = 20 }: a row's trend scaled to its own peak, for a Table cell beside the row's number";
+    readonly LineChart: "{ series: { id: string, data: { x: number | string, y: number }[], tint?: Tint }[], height?: number = 240, xFormat?: (x) => string, yFormat?: (y) => string, curve?: \"linear\" | \"monotone\" | \"step\", area?: boolean, legend?: boolean }: a full chart with axes and a readout";
+    readonly BarChart: "{ data: Record<string, number | string>[], keys: (string | { key: string, label?: string, tint?: Tint })[], indexBy: string, height?: number = 240, layout?: \"vertical\" | \"horizontal\", mode?: \"grouped\" | \"stacked\" = \"stacked\", valueFormat?: (value: number) => string, legend?: boolean }: a full chart with axes and a readout with the total";
+    readonly PieChart: "{ data: { id: string, value: number, label?: string, tint?: Tint }[], height?: number = 240, donut?: boolean, valueFormat?: (value: number) => string, legend?: boolean }";
+    readonly Button: "{ variant?: \"solid\" | \"outline\" | \"ghost\" | \"pill\" | \"chip\", size?: \"2xs\" | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\", tone?: \"neutral\" | \"primary\" | \"success\" | \"warning\" | \"danger\", loading?: boolean, disabled?: boolean, onClick, children }";
+    readonly Tabs: "Tabs.Root { value?, defaultValue?, onValueChange? } > Tabs.List { children: Tabs.Tab { value, children }[] } + Tabs.Panel { value, children }";
+    readonly Select: "Select { value?, defaultValue?, onValueChange? } > SelectTrigger { children: <SelectValue /> } + SelectContent { children: SelectItem[] }";
+    readonly SelectTrigger: "see Select";
+    readonly SelectValue: "see Select";
+    readonly SelectContent: "see Select";
+    readonly SelectItem: "{ value: string, children }";
+    readonly ToggleGroup: "{ value?: string[], defaultValue?: string[], onValueChange?: (value: string[]) => void, multiple?: boolean, children: Toggle[] }";
+    readonly Toggle: "{ value: string, size?: as Button, tone?: as Button, children }";
+    readonly Switch: "{ label: string, checked?, defaultChecked?, onCheckedChange?: (checked: boolean) => void, disabled? }";
+    readonly Checkbox: "{ checked?, defaultChecked?, indeterminate?, onCheckedChange?: (checked: boolean) => void, disabled? }";
+    readonly Slider: "Slider.Root { value?, defaultValue?, onValueChange?, min?, max?, step? } > Slider.Control > Slider.Track > Slider.Indicator + Slider.Thumb";
+    readonly Tooltip: "Tooltip > TooltipTrigger { render?: ReactElement, children } + TooltipContent { side?, children }";
+    readonly TooltipTrigger: "see Tooltip";
+    readonly TooltipContent: "see Tooltip";
+    readonly Collapsible: "Collapsible.Root { open?, defaultOpen?, onOpenChange? } > Collapsible.Trigger { children } + Collapsible.Panel { children }";
+    readonly Kbd: "{ keys: string[] }";
+    readonly Spinner: "{}";
+    readonly useColorScheme: "(): \"light\" | \"dark\"";
+};
+/** Every name `nyte/canvas` exports, in `KIT` order. */
+export declare const KIT_EXPORTS: readonly string[];
+/** The custom properties a client may hand the shell; anything else is dropped. */
+export declare const CANVAS_VARIABLES: readonly ["--nyte-custom-hue", "--nyte-custom-chroma-scale", "--nyte-font-family-sans", "--nyte-font-family-mono", "--nyte-font-size-base", "--nyte-font-size-code", "--nyte-letter-spacing-lg", "--nyte-font-smoothing", "--nyte-moz-font-smoothing", "--nyte-reduce-transparency"];
+export declare const CANVAS_PROTOCOL_VERSION = "2026-01-26";
+/** What a client tells the shell about where it runs. */
+export type CanvasHostContext = {
+    readonly theme: "light" | "dark";
+    readonly styles: {
+        readonly variables: Readonly<Record<string, string>>;
+    };
+    readonly displayMode: "inline";
+    readonly platform: "desktop" | "web" | "mobile";
+    readonly deviceCapabilities: {
+        readonly touch: boolean;
+        readonly hover: boolean;
+    };
+};
+/** A compiled canvas, as the part holds it and the shell receives it. */
+export type CanvasModule = {
+    readonly runtime: number;
+    readonly code: string;
+    readonly title: string;
+};
+/** Who answers `ui/initialize`: a client, or `nyte-preview`, the harness a previewer runs in place of one. */
+export type CanvasHostInfo = {
+    readonly name: "nyte-desktop" | "nyte-web" | "nyte-ios" | "nyte-preview";
+    readonly version: string;
+};
+export type JsonRpcId = string | number;
+/** A message the shell sends its client. */
+export type ShellMessage = {
+    readonly kind: "initialize";
+    readonly id: JsonRpcId;
+    readonly runtime: number;
+} | {
+    readonly kind: "initialized";
+} | {
+    readonly kind: "size";
+    readonly height: number;
+}
+/** `url` is an http(s) URL, or a reference with no scheme that the client resolves in its workspace. */
+ | {
+    readonly kind: "open-link";
+    readonly id: JsonRpcId;
+    readonly url: string;
+} | {
+    readonly kind: "error";
+    readonly phase: "load" | "render";
+    readonly message: string;
+    readonly stack: string | null;
+};
+/** A message a client sends the shell. */
+export type HostMessage = {
+    readonly kind: "initialize-result";
+    readonly id: JsonRpcId;
+    readonly hostInfo: CanvasHostInfo;
+    readonly hostContext: CanvasHostContext;
+} | {
+    readonly kind: "render";
+    readonly module: CanvasModule;
+} | {
+    readonly kind: "context-changed";
+    readonly context: Partial<CanvasHostContext>;
+} | {
+    readonly kind: "open-link-result";
+    readonly id: JsonRpcId;
+    readonly isError: boolean;
+};
+type Json = null | boolean | number | string | readonly Json[] | {
+    readonly [key: string]: Json;
+};
+/** Returns the `ui/initialize` request the shell opens with. */
+export declare function initializeRequest(id: JsonRpcId, runtime: number): Json;
+export declare function initializedNotification(): Json;
+export declare function sizeChangedNotification(height: number): Json;
+export declare function openLinkRequest(id: JsonRpcId, url: string): Json;
+/** Returns the error notification the shell sends when a module fails to load or render. */
+export declare function errorNotification(error: {
+    readonly phase: "load" | "render";
+    readonly message: string;
+    readonly stack?: string;
+}): Json;
+/** Returns the answer to the shell's `ui/initialize`. */
+export declare function initializeResult(id: JsonRpcId, hostInfo: CanvasHostInfo, hostContext: CanvasHostContext): Json;
+export declare function renderNotification(module: CanvasModule): Json;
+export declare function hostContextChangedNotification(context: Partial<CanvasHostContext>): Json;
+export declare function openLinkResult(id: JsonRpcId, isError?: boolean): Json;
+/** Returns the message a shell posted, or undefined for anything that is not one. */
+export declare function readShellMessage(data: unknown): ShellMessage | undefined;
+/** Returns the message a client posted into the shell, or undefined for anything that is not one. */
+export declare function readHostMessage(data: unknown): HostMessage | undefined;
+/** Returns the height a frame shows a canvas at, within the range. */
+export declare function clampCanvasHeight(height: number): number;
+/** Returns the variables the shell may apply: allowlisted names, values stripped of the characters that could end a declaration. */
+export declare function sanitizeCanvasVariables(variables: Readonly<Record<string, string>>): Record<string, string>;
+export {};

package/dist/src/canvas/canvas-protocol.js

@@ -0,0 +1,75 @@
+import {
+  CANVAS_RUNTIME2,
+  CANVAS_GLOBAL2,
+  KIT_SPECIFIER2,
+  CANVAS_ENTRY2,
+  CANVAS_SOURCE_LIMIT2,
+  CANVAS_CODE_LIMIT2,
+  CANVAS_MIN_HEIGHT2,
+  CANVAS_MAX_HEIGHT2,
+  CANVAS_MIN_HEIGHT_HINT2,
+  CANVAS_DEFAULT_HEIGHT2,
+  REACT_EXPORTS2,
+  JSX_RUNTIME_EXPORTS2,
+  REACT_DOM_EXPORTS2,
+  LIBRARY_EXPORTS2,
+  LIBRARY_VERSIONS2,
+  canvasFilesComment2,
+  locateCanvasStack2,
+  TINTS2,
+  KIT2,
+  KIT_EXPORTS2,
+  CANVAS_VARIABLES2,
+  CANVAS_PROTOCOL_VERSION2,
+  initializeRequest2,
+  initializedNotification2,
+  sizeChangedNotification2,
+  openLinkRequest2,
+  errorNotification2,
+  initializeResult2,
+  renderNotification2,
+  hostContextChangedNotification2,
+  openLinkResult2,
+  readShellMessage2,
+  readHostMessage2,
+  clampCanvasHeight2,
+  sanitizeCanvasVariables2
+} from "../../chunks/billing-bv5zr32b.js";
+import"../../chunks/billing-zfpm2rt0.js";
+export {
+  CANVAS_CODE_LIMIT2 as CANVAS_CODE_LIMIT,
+  CANVAS_DEFAULT_HEIGHT2 as CANVAS_DEFAULT_HEIGHT,
+  CANVAS_ENTRY2 as CANVAS_ENTRY,
+  CANVAS_GLOBAL2 as CANVAS_GLOBAL,
+  CANVAS_MAX_HEIGHT2 as CANVAS_MAX_HEIGHT,
+  CANVAS_MIN_HEIGHT2 as CANVAS_MIN_HEIGHT,
+  CANVAS_MIN_HEIGHT_HINT2 as CANVAS_MIN_HEIGHT_HINT,
+  CANVAS_PROTOCOL_VERSION2 as CANVAS_PROTOCOL_VERSION,
+  CANVAS_RUNTIME2 as CANVAS_RUNTIME,
+  CANVAS_SOURCE_LIMIT2 as CANVAS_SOURCE_LIMIT,
+  CANVAS_VARIABLES2 as CANVAS_VARIABLES,
+  JSX_RUNTIME_EXPORTS2 as JSX_RUNTIME_EXPORTS,
+  KIT2 as KIT,
+  KIT_EXPORTS2 as KIT_EXPORTS,
+  KIT_SPECIFIER2 as KIT_SPECIFIER,
+  LIBRARY_EXPORTS2 as LIBRARY_EXPORTS,
+  LIBRARY_VERSIONS2 as LIBRARY_VERSIONS,
+  REACT_DOM_EXPORTS2 as REACT_DOM_EXPORTS,
+  REACT_EXPORTS2 as REACT_EXPORTS,
+  TINTS2 as TINTS,
+  canvasFilesComment2 as canvasFilesComment,
+  clampCanvasHeight2 as clampCanvasHeight,
+  errorNotification2 as errorNotification,
+  hostContextChangedNotification2 as hostContextChangedNotification,
+  initializeRequest2 as initializeRequest,
+  initializeResult2 as initializeResult,
+  initializedNotification2 as initializedNotification,
+  locateCanvasStack2 as locateCanvasStack,
+  openLinkRequest2 as openLinkRequest,
+  openLinkResult2 as openLinkResult,
+  readHostMessage2 as readHostMessage,
+  readShellMessage2 as readShellMessage,
+  renderNotification2 as renderNotification,
+  sanitizeCanvasVariables2 as sanitizeCanvasVariables,
+  sizeChangedNotification2 as sizeChangedNotification
+};

package/dist/src/canvas/canvas.d.ts

@@ -0,0 +1,50 @@
+import type { CanvasPreviewer } from "./canvas-preview.ts";
+import type { Plugin } from "@nyte-ai/plugin/core";
+export declare const canvas: import("@nyte-ai/core").PartDefinition<{
+    code: string;
+    runtime: number;
+    title: string;
+    error: string | null;
+    height: number | null;
+}, {
+    replace: {
+        input: import("@nyte-ai/schema").Schema<{
+            code: string;
+            runtime: number;
+            title: string;
+            height: number | null;
+        }>;
+    };
+    report: {
+        input: import("@nyte-ai/schema").Schema<{
+            message: string;
+        }>;
+    };
+}>;
+/**
+ * What the model reads about the tool and the kit; the signatures come from
+ * `KIT`, so they cannot drift from what the compiler accepts.
+ *
+ * @category plugins
+ * @since 0.1.0
+ */
+export declare const CANVAS_DESCRIPTION: string;
+/**
+ * Returns the canvas plugin: the `canvas` part and `canvas_render`, which
+ * compiles in-process on any host, plus `canvas_preview` when the host
+ * passes a previewer, in which case `canvas_render` tells the model to
+ * preview first.
+ *
+ * @category plugins
+ * @since 0.1.0
+ */
+export declare function canvasPlugin(preview?: CanvasPreviewer): Plugin;
+/**
+ * The canvas plugin without a previewer, as a host that cannot render one
+ * loads it.
+ *
+ * @category plugins
+ * @since 0.1.0
+ */
+declare const _default: Plugin;
+export default _default;

package/dist/src/canvas/canvas.js

@@ -0,0 +1,221 @@
+import"../../chunks/billing-zfpm2rt0.js";
+import {
+  KIT_SPECIFIER2,
+  CANVAS_ENTRY2,
+  CANVAS_SOURCE_LIMIT2,
+  CANVAS_MAX_HEIGHT2,
+  CANVAS_MIN_HEIGHT_HINT2,
+  REACT_DOM_EXPORTS2,
+  LIBRARY_VERSIONS2,
+  TINTS2,
+  KIT2
+} from "../../chunks/billing-bv5zr32b.js";
+import {
+  compileCanvas2
+} from "../../chunks/billing-kn3d30b4.js";
+import {
+  CANVAS_PREVIEW_WIDTHS2,
+  describeCanvasPreview2
+} from "../../chunks/billing-sxc70w72.js";
+import {
+  canvas2
+} from "../../chunks/billing-mvc33pv6.js";
+
+// src/canvas/canvas.ts
+import { definePart, followedTrace, traced } from "@nyte-ai/core";
+import { asId, standard } from "@nyte-ai/schema";
+import { Type } from "typebox";
+var handlers = {
+  async replace(input, context) {
+    const outcome = await context.part.update(() => ({ ...input, error: null }));
+    if (outcome.kind !== "updated")
+      throw new Error(`The canvas could not be replaced: ${outcome.kind}.`);
+  },
+  async report(input, context) {
+    const outcome = await context.part.update((current) => ({ ...current, error: input.message }));
+    if (outcome.kind !== "updated")
+      throw new Error(`The canvas error could not be reported: ${outcome.kind}.`);
+  }
+};
+var canvas = definePart({
+  ...canvas2,
+  onAction: (action, input, context) => handlers[action](input, context)
+});
+var source = Type.String({
+  maxLength: CANVAS_SOURCE_LIMIT2,
+  description: `${CANVAS_ENTRY2}: the TSX module whose default export is the component.`
+});
+var files = Type.Optional(Type.Record(Type.String(), Type.String({ maxLength: CANVAS_SOURCE_LIMIT2 }), {
+  description: `The canvas's other modules, keyed by path from ${CANVAS_ENTRY2}'s folder (\`chart.tsx\`, \`lib/scale.ts\`), which it imports as \`./chart\` or \`./lib/scale.ts\`.`
+}));
+var parameters = standard(Type.Object({
+  title: Type.String({ minLength: 1, maxLength: 120, description: "Shown above the canvas." }),
+  source,
+  files,
+  canvas: Type.Optional(Type.String({
+    description: "The id of a canvas to replace in place; omit to add a new one."
+  })),
+  height: Type.Optional(Type.Number({
+    minimum: CANVAS_MIN_HEIGHT_HINT2,
+    maximum: CANVAS_MAX_HEIGHT2,
+    description: "Initial frame height in px until the canvas reports its own."
+  }))
+}));
+var kitReference = Object.entries(KIT2).map(([name, signature]) => `- ${name} ${signature}`).join(`
+`);
+var CANVAS_DESCRIPTION = [
+  `Render a React canvas inline in the chat. \`source\` is ${CANVAS_ENTRY2}, a TSX module whose default export is a component; split a large canvas into \`files\` it imports by relative path. Every file counts toward one ${Math.round(CANVAS_SOURCE_LIMIT2 / 1024)} KB budget.`,
+  `Imports: \`react\`, \`react-dom\` (${REACT_DOM_EXPORTS2.map((name) => `\`${name}\``).join(" and ")} only), \`${KIT_SPECIFIER2}\`, the canvas's own files, and these libraries, each loaded only by a canvas that imports it: ${Object.entries(LIBRARY_VERSIONS2).map(([name, version]) => `\`${name}\` ${version}`).join(", ")}. \`three\` is the core module without its addons, so orbit a camera yourself. Nothing else resolves (no other npm packages, no URLs, no fetch). \`eval\` and \`new Function\` are unavailable at run time.`,
+  `The canvas runs sandboxed with no network, sized to its content (up to ${CANVAS_MAX_HEIGHT2} px, then it scrolls), on the chat's background with the user's theme applied through the kit.`,
+  "Use the kit for layout, text, data and charts; never hard-code colours, fonts or backgrounds. An `<a href>` to an http(s) URL opens in the user's browser, and one to a workspace path such as `src/app.ts:42` opens that file at that line; other schemes are refused. Pass `canvas` to replace an earlier canvas in place.",
+  "",
+  'Charts: `StackedBars` and `Sparkline` are compact and axis-free, for a figure that sits beside its own number (a Stat, a Table row); use them first. `LineChart`, `BarChart` and `PieChart` are full charts with axes, gridlines and a readout, for a series that needs reading on its own: a line for change over time, bars to compare categories (`layout="horizontal"` when the labels are long), a pie only for up to five parts of one whole. All of them share one look and fit the width they get; give each series a `tint` only when a hue carries meaning (green for good, red for bad), or leave the order to the kit, which keeps neighbouring series apart for colour-blind readers.',
+  'Keep a chart to one value axis and at most eight series; fold the rest into an "Other" series, and put measures on different scales in separate charts. Pass `yFormat` or `valueFormat` to carry units (`$`, `%`, `ms`); the axis, readout and pie legend all use it. An empty series or data array draws a "No data" box, so render the chart as it is rather than guarding it.',
+  `Tint = ${TINTS2.map((tint) => `"${tint}"`).join(" | ")}.`,
+  "",
+  `\`${KIT_SPECIFIER2}\` exports:`,
+  kitReference
+].join(`
+`);
+function describeErrors(errors) {
+  return errors.map((error) => {
+    if (error.file === null)
+      return error.text;
+    return error.line === null ? `${error.file}: ${error.text}` : `${error.file}:${error.line}:${error.column ?? 0} ${error.text}`;
+  }).join(`
+`);
+}
+var encoder = new TextEncoder;
+async function compile(args, invocation) {
+  const compiled = await traced("canvas.compile", followedTrace(invocation.session.id), {
+    bytes: [args.source, ...Object.values(args.files ?? {})].reduce((sum, text) => sum + encoder.encode(text).byteLength, 0),
+    files: Object.keys(args.files ?? {}).length
+  }, () => compileCanvas2(args.source, args.files));
+  if (compiled.kind === "failed")
+    throw new Error(`The canvas did not compile:
+${describeErrors(compiled.errors)}`);
+  return compiled;
+}
+var PREVIEW_FIRST = "Before rendering, call `canvas_preview` with the same `source` and `files`: it shows you the canvas and its errors, console and height without the user seeing it. Fix what it shows, then render once.";
+function renderTool(previewing) {
+  return {
+    name: "canvas_render",
+    description: previewing ? `${PREVIEW_FIRST}
+
+${CANVAS_DESCRIPTION}` : CANVAS_DESCRIPTION,
+    parameters,
+    class: (args) => ({
+      kind: "custom",
+      label: args.canvas === undefined ? `Rendering ${args.title}` : `Updating ${args.title}`
+    }),
+    effects: "none",
+    approval: "never",
+    replay: "safe",
+    async execute(args, invocation) {
+      const compiled = await compile(args, invocation);
+      const next = {
+        runtime: compiled.runtime,
+        title: args.title,
+        code: compiled.code,
+        height: args.height ?? null
+      };
+      if (args.canvas === undefined) {
+        const part = await invocation.session.parts.create(canvas, {
+          state: { ...next, error: null },
+          placement: { kind: "transcript", role: "answer" }
+        });
+        return {
+          content: [{ kind: "text", text: `Rendered canvas ${part.id}: ${args.title}.` }],
+          parts: [part.id]
+        };
+      }
+      const outcome = await invocation.session.part(asId(args.canvas)).act("replace", next);
+      if (outcome.kind !== "ok")
+        throw new Error(`Canvas ${args.canvas} was not replaced: ${outcome.kind}.`);
+      return {
+        content: [{ kind: "text", text: `Replaced canvas ${args.canvas}: ${args.title}.` }],
+        parts: [asId(args.canvas)]
+      };
+    }
+  };
+}
+var previewParameters = standard(Type.Object({
+  source,
+  files,
+  theme: Type.Optional(Type.Union([Type.Literal("light"), Type.Literal("dark")], {
+    description: "The theme to preview in; default light."
+  }))
+}));
+var PREVIEW_TIMEOUT_MS = 45000;
+async function previewWithin(preview, request, signal) {
+  signal.throwIfAborted();
+  const deadline = new AbortController;
+  const timer = setTimeout(() => deadline.abort(), PREVIEW_TIMEOUT_MS);
+  const stop = AbortSignal.any([signal, deadline.signal]);
+  const stopped = new Promise((resolve) => stop.addEventListener("abort", () => resolve("stopped"), { once: true }));
+  try {
+    const outcome = await Promise.race([preview(request, stop), stopped]);
+    if (outcome !== "stopped")
+      return outcome;
+  } finally {
+    clearTimeout(timer);
+  }
+  signal.throwIfAborted();
+  return {
+    kind: "unavailable",
+    reason: `The preview took longer than ${PREVIEW_TIMEOUT_MS / 1000} seconds.`
+  };
+}
+function previewTool(preview) {
+  return {
+    name: "canvas_preview",
+    description: `Render a canvas off-screen in the real canvas runtime and see it before the user does: a PNG at the chat column's width (${CANVAS_PREVIEW_WIDTHS2.chat} px), its height there and at a phone's width (${CANVAS_PREVIEW_WIDTHS2.phone} px), every load or render error with its file and line, and the canvas's console output. Takes the same \`source\` and \`files\` as canvas_render and compiles them the same way; nothing is added to the chat.`,
+    parameters: previewParameters,
+    class: () => ({ kind: "custom", label: "Previewing canvas" }),
+    effects: "none",
+    approval: "never",
+    replay: "safe",
+    async execute(args, invocation) {
+      const compiled = await compile(args, invocation);
+      const outcome = await previewWithin(preview, {
+        module: { runtime: compiled.runtime, code: compiled.code, title: "Preview" },
+        theme: args.theme ?? "light"
+      }, invocation.signal);
+      if (outcome.kind === "unavailable")
+        return {
+          content: [
+            {
+              kind: "text",
+              text: `No preview here: ${outcome.reason} Render with canvas_render; an error it hits comes back in the canvas next turn.`
+            }
+          ]
+        };
+      const { png } = outcome.report;
+      const blob = await invocation.env.files.upload(async function* () {
+        yield png;
+      }());
+      return {
+        content: [
+          { kind: "text", text: describeCanvasPreview2(outcome.report) },
+          { kind: "file", blob, mime: "image/png" }
+        ]
+      };
+    }
+  };
+}
+function canvasPlugin(preview) {
+  return {
+    id: "canvas",
+    contribute: {
+      parts: [canvas],
+      tools: preview === undefined ? [renderTool(false)] : [renderTool(true), previewTool(preview)]
+    }
+  };
+}
+var canvas_default = canvasPlugin();
+export {
+  CANVAS_DESCRIPTION,
+  canvas,
+  canvasPlugin,
+  canvas_default as default
+};

package/dist/src/canvas/schema.d.ts

@@ -0,0 +1,47 @@
+import type { Infer } from "@nyte-ai/schema";
+declare const state: import("@nyte-ai/schema").Schema<{
+    code: string;
+    runtime: number;
+    title: string;
+    error: string | null;
+    height: number | null;
+}>;
+/**
+ * Returns a canvas part's state: the compiled module, the runtime it needs,
+ * its title, the agent's height hint and the last error a client reported.
+ *
+ * @category plugins
+ * @since 0.1.0
+ */
+export type CanvasState = Infer<typeof state>;
+/**
+ * A canvas part: a React module the agent wrote, compiled on the host and
+ * drawn by a client inside the sandboxed runtime shell. `replace` swaps the
+ * module in place; `report` records a load or render error a client saw,
+ * which the model reads in the fallback.
+ *
+ * @category plugins
+ * @since 0.1.0
+ */
+export declare const canvas: import("@nyte-ai/core").PartDefinition<{
+    code: string;
+    runtime: number;
+    title: string;
+    error: string | null;
+    height: number | null;
+}, {
+    replace: {
+        input: import("@nyte-ai/schema").Schema<{
+            code: string;
+            runtime: number;
+            title: string;
+            height: number | null;
+        }>;
+    };
+    report: {
+        input: import("@nyte-ai/schema").Schema<{
+            message: string;
+        }>;
+    };
+}>;
+export {};

package/dist/src/canvas/schema.js

@@ -0,0 +1,8 @@
+import {
+  canvas2
+} from "../../chunks/billing-mvc33pv6.js";
+import"../../chunks/billing-bv5zr32b.js";
+import"../../chunks/billing-zfpm2rt0.js";
+export {
+  canvas2 as canvas
+};

package/dist/src/claude-code-sdk/index.d.ts

@@ -0,0 +1,35 @@
+import type { Api, Provider } from "@nyte-ai/ai";
+import type { SettingDefinition, ToolDefinition } from "@nyte-ai/core";
+import type { StartQuery } from "./session.ts";
+export declare const ultracodeSetting: SettingDefinition<boolean>;
+export declare function claudeCodeSdk(start?: StartQuery): {
+    provider: Provider<Api>;
+    plugin: {
+        id: string;
+        contribute: {
+            tools: ToolDefinition<{
+                id: string;
+                name: string;
+                input: Record<string, unknown>;
+            }, unknown>[];
+            settings: SettingDefinition<boolean>[];
+        };
+        activate(api: {
+            readonly side: "core";
+            readonly sdk: import("@nyte-ai/core").Connection;
+            readonly contribute: import("@nyte-ai/core").Registries<"core">;
+            readonly storage: import("@nyte-ai/core").PluginStorage;
+            readonly signal: AbortSignal;
+            hook<N extends "session_activated" | "before_send" | "run_started" | "transform_transcript" | "before_compaction" | "before_request" | "before_tool" | "after_tool" | "after_request" | "run_ended">(name: N, entry: import("@nyte-ai/core").HookEntry<"core", N>): import("@nyte-ai/schema").Disposer;
+            report(issue: import("@nyte-ai/schema").ValidationIssue): void;
+            reload(): void;
+        } & {
+            readonly session: import("@nyte-ai/core").Session;
+            readonly env: import("@nyte-ai/core").ExecutionEnv;
+            wrapEnv(wrap: import("@nyte-ai/core").EnvironmentWrap): import("@nyte-ai/schema").Disposer;
+            readonly inputs: import("@nyte-ai/core").Resources;
+            request<T = string>(input: import("@nyte-ai/schema").ModelRequestInput<T>): Promise<import("@nyte-ai/schema").ModelRequestOutcome<T>>;
+            approve(call: import("@nyte-ai/core").RuntimeCall, signal: AbortSignal): Promise<import("@nyte-ai/core").RuntimeVerdict>;
+        }): void;
+    };
+};