@tinyvolt/pie 0.0.0-stage → 0.1.0

package/src/lib/nodes/state/Node.ts

@@ -0,0 +1,211 @@
+import type { Accessor, JSXElement } from 'solid-js';
+import type { Dtype } from '../jax';
+import {
+  renderPoint,
+  renderLine,
+  renderTriangle,
+  renderCircle,
+  renderEllipse,
+  renderArc,
+  renderBezierQuadratic,
+  renderBezierCubic,
+  renderPointGrad,
+  renderText,
+} from '../render/renderLogic';
+
+export interface Node {
+  id: string;
+  type: string;
+  hidden?: boolean;
+  /** A CSS color or 'none'. */
+  fill?: string;
+  /** A CSS color or 'none'. */
+  stroke?: string;
+  __graph_deps?: {
+    funcKeyword: string;
+    inputNodes: AnyNode[];
+    blueprintKey?: string;
+    // ID of the 'main' output node, set on a function's auxiliary nodes.
+    parentId?: string;
+  };
+}
+
+export function checkColor(keyword: string, name: string, value?: string) {
+  if (value !== undefined && value !== 'none' && !CSS.supports('color', value)) {
+    throw new Error(`${keyword}: ${name} '${value}' is not a valid color`);
+  }
+}
+
+export interface NodeDefinition<N extends Node = AnyNode> {
+  type: N['type'];
+  /** Start of generated ids: 'p' gives p0, p1, …. Default: `type` in lower case. */
+  prefix?: string;
+  /** Draws the node, in grid units. `unit` is pixels per grid unit. Without it the node is not drawn. */
+  render?(node: Accessor<N>, unit: Accessor<number>): JSXElement | null;
+}
+
+/**
+ * Drawn only when it has both `x` and `y`, the center of its box.
+ * `w`, `h`: the box size in grid units. 0 and 0: one line, no box. Above 0: fixed. -1: fits the text, at most 5.
+ */
+export interface TextNode extends Node {
+  type: 'Text';
+  value: string;
+  x?: ScalarNode;
+  y?: ScalarNode;
+  /** In pixels. */
+  fontSize?: ScalarNode;
+  w?: ScalarNode;
+  h?: ScalarNode;
+}
+const TextDefinition: NodeDefinition<TextNode> = { type: 'Text', prefix: 'text', render: renderText };
+
+export interface PointNode extends Node {
+  type: 'Point';
+  x: Dtype;
+  y: Dtype;
+}
+const PointDefinition: NodeDefinition<PointNode> = { type: 'Point', prefix: 'p', render: renderPoint };
+
+export interface ScalarNode extends Node {
+  type: 'Scalar';
+  value: Dtype;
+}
+const ScalarDefinition: NodeDefinition<ScalarNode> = { type: 'Scalar', prefix: 'num' };
+
+export interface TriangleNode extends Node {
+  type: 'Triangle';
+  vertices: PointNode[];
+}
+const TriangleDefinition: NodeDefinition<TriangleNode> = { type: 'Triangle', prefix: 'tr', render: renderTriangle };
+
+export interface LineNode extends Node {
+  type: 'Line';
+  p1: PointNode;
+  p2: PointNode;
+}
+const LineDefinition: NodeDefinition<LineNode> = { type: 'Line', prefix: 'line', render: renderLine };
+
+export interface CircleNode extends Node {
+  type: 'Circle';
+  center: PointNode;
+  radius: ScalarNode;
+}
+const CircleDefinition: NodeDefinition<CircleNode> = { type: 'Circle', prefix: 'circ', render: renderCircle };
+
+export interface EllipseNode extends Node {
+  type: 'Ellipse';
+  center: PointNode;
+  radiusX: ScalarNode;
+  radiusY: ScalarNode;
+  rotation: ScalarNode;
+}
+const EllipseDefinition: NodeDefinition<EllipseNode> = { type: 'Ellipse', prefix: 'ell', render: renderEllipse };
+
+export interface BezierQuadraticNode extends Node {
+  type: 'BezierQuadratic';
+  p1: PointNode;
+  control: PointNode;
+  p2: PointNode;
+}
+const BezierQuadraticDefinition: NodeDefinition<BezierQuadraticNode> = { type: 'BezierQuadratic', prefix: 'bq', render: renderBezierQuadratic };
+
+export interface BezierCubicNode extends Node {
+  type: 'BezierCubic';
+  p1: PointNode;
+  control1: PointNode;
+  control2: PointNode;
+  p2: PointNode;
+}
+const BezierCubicDefinition: NodeDefinition<BezierCubicNode> = { type: 'BezierCubic', prefix: 'bc', render: renderBezierCubic };
+
+export interface ArcNode extends Node {
+  type: 'Arc';
+  center: PointNode;
+  radius: ScalarNode;
+  startAngle: ScalarNode;
+  endAngle: ScalarNode;
+}
+const ArcDefinition: NodeDefinition<ArcNode> = { type: 'Arc', prefix: 'arc', render: renderArc };
+
+/** d target / d point, drawn as an arrow (dx, dy) starting at `point`. */
+export interface PointGradNode extends Node {
+  type: 'PointGrad';
+  point: PointNode;
+  target: ScalarNode;
+  dx: Dtype;
+  dy: Dtype;
+}
+const PointGradDefinition: NodeDefinition<PointGradNode> = { type: 'PointGrad', prefix: 'pointgrad', render: renderPointGrad };
+
+/** `items` in row-major order: shape [2, 3] holds row 0's three items, then row 1's. */
+export interface ArrayNode extends Node {
+  type: 'Array';
+  itemType: NodeType;
+  shape: number[];
+  items: AnyNode[];
+}
+const ArrayDefinition: NodeDefinition<ArrayNode> = { type: 'Array', prefix: 'arr' };
+
+export interface DummyNode extends Node {
+  type: 'Dummy';
+}
+/** An empty prefix gives an empty id. */
+const DummyDefinition: NodeDefinition<DummyNode> = { type: 'Dummy', prefix: '' };
+
+export interface NodeTypeMap {
+  Text: TextNode;
+  Point: PointNode;
+  Scalar: ScalarNode;
+  Triangle: TriangleNode;
+  Line: LineNode;
+  Circle: CircleNode;
+  Ellipse: EllipseNode;
+  BezierQuadratic: BezierQuadraticNode;
+  BezierCubic: BezierCubicNode;
+  Arc: ArcNode;
+  PointGrad: PointGradNode;
+  Array: ArrayNode;
+  Dummy: DummyNode;
+}
+
+export type AnyNode = NodeTypeMap[keyof NodeTypeMap];
+export type NodeType = keyof NodeTypeMap;
+
+const isNodeDefinition = (def: unknown): def is NodeDefinition =>
+  typeof def === 'object' && def !== null && typeof (def as NodeDefinition).type === 'string';
+
+// The site's own node types: each `nodes/**/*.{ts,tsx}` exports `NodeDefinition`s, like `nodes/square.tsx`.
+const customModules = import.meta.glob<Record<string, unknown>>('/nodes/**/*.{ts,tsx}', { eager: true });
+
+// File path -> its definitions. Built-ins first.
+const definitionsByFile: [string, unknown[]][] = [
+  ['src/lib/nodes/state/Node.ts', [
+    TextDefinition, PointDefinition, ScalarDefinition, TriangleDefinition, LineDefinition, CircleDefinition,
+    EllipseDefinition, BezierQuadraticDefinition, BezierCubicDefinition, ArcDefinition, PointGradDefinition,
+    ArrayDefinition, DummyDefinition,
+  ]],
+  ...Object.entries(customModules).map(([path, mod]): [string, unknown[]] => [path.slice(1), Object.values(mod)]),
+];
+
+const nodeDefinitions = new Map<string, NodeDefinition>();
+const sourceFile = new Map<string, string>();
+for (const [file, defs] of definitionsByFile) {
+  for (const def of defs.filter(isNodeDefinition)) {
+    const other = sourceFile.get(def.type);
+    if (other !== undefined) {
+      throw new Error(`Duplicate node type '${def.type}': ${file} and ${other}`);
+    }
+    nodeDefinitions.set(def.type, def);
+    sourceFile.set(def.type, file);
+  }
+}
+
+export function getNodeDefinition(type: string): NodeDefinition | undefined {
+  return nodeDefinitions.get(type);
+}
+
+/** Every node type, built-in and the site's own. */
+export function getNodeTypes(): NodeType[] {
+  return [...nodeDefinitions.keys()] as NodeType[];
+}

package/src/lib/nodes/state/NodeStore.ts

@@ -0,0 +1,110 @@
+import { Accessor, batch, createMemo, createRoot, createSignal, untrack } from 'solid-js';
+import { createStore, reconcile } from 'solid-js/store';
+import { AnyNode, ScalarNode } from './Node';
+import { NameGenerator } from './NameGenerator';
+import { num, scalar } from '../jax';
+
+/** Below this many pixels per unit, the grid hides its lines and keeps only the axes. */
+export const MIN_GRID_UNIT = 20;
+
+export type NodeSignal = {
+  signal: Accessor<AnyNode>;
+  dispose?: () => void;
+};
+
+export class NodeStore {
+  public nodes: Record<string, NodeSignal>;
+  public setNodes: (id: string, value: NodeSignal | undefined) => void;
+  public reconcileNodes: (value: Record<string, NodeSignal>) => void;
+
+  public canvasBounds: Accessor<{ width: number; height: number }>;
+  public setCanvasBounds: (bounds: { width: number; height: number }) => void;
+
+  /** Pixels per grid unit, read from the `unit` node. */
+  public unit!: Accessor<number>;
+
+  public nameGenerator: NameGenerator;
+
+  constructor() {
+    const [nodesState, setNodesState] = createStore<Record<string, NodeSignal>>({});
+    this.nodes = nodesState;
+    this.setNodes = (id, value) => { setNodesState(id, value as any); };
+    this.reconcileNodes = (value) => { setNodesState(reconcile(value)); };
+
+    const [canvasBounds, setCanvasBounds] = createSignal({ width: 500, height: 500 });
+    this.canvasBounds = canvasBounds;
+    this.setCanvasBounds = setCanvasBounds;
+
+    createRoot(() => {
+      this.unit = createMemo(() => {
+        const node = this.nodes['unit']?.signal() as ScalarNode | undefined;
+        // max(1, ...): a zero, negative or NaN unit would break the viewBox.
+        return node ? Math.max(1, num(node.value)) : 50;
+      });
+    });
+
+    // untrack: names are generated inside reactive computations, which must not rerun when the checked node changes.
+    this.nameGenerator = new NameGenerator((name) => untrack(() => this.nodes[name] !== undefined));
+
+    this.initSystemNodes();
+  }
+
+  public initSystemNodes() {
+    const unitId = 'unit';
+    createRoot((dispose) => {
+      const signal = createMemo(() => ({ id: unitId, type: 'Scalar', value: scalar(50) } as ScalarNode));
+      this.saveNode(unitId, signal, dispose);
+    });
+  }
+
+  public clearNodes() {
+    batch(() => {
+      for (const key in this.nodes) {
+        if (this.nodes[key] && typeof this.nodes[key].dispose === 'function') {
+          this.nodes[key].dispose!();
+        }
+      }
+      this.reconcileNodes({});
+      this.nameGenerator.resetCounters();
+    });
+
+    this.initSystemNodes();
+  }
+
+  public saveNode(id: string, signal: Accessor<AnyNode>, dispose?: () => void) {
+    if (this.nodes[id] && typeof this.nodes[id].dispose === 'function') {
+      this.nodes[id].dispose!();
+    }
+    this.setNodes(id, { signal, dispose });
+  }
+
+  /** Sets `props` on node `id`. Unlike `saveNode`, the node keeps following its inputs. */
+  public updateNode(id: string, props: Partial<AnyNode>) {
+    // Read out now: `setNodes` merges into the stored entry, so it would overwrite them.
+    const { signal: oldSignal, dispose: oldDispose } = this.nodes[id];
+    createRoot((dispose) => {
+      const signal = createMemo(() => ({ ...oldSignal(), ...props } as AnyNode));
+      // Not `saveNode`: that would dispose the old node, which the new one reads.
+      this.setNodes(id, { signal, dispose: () => { dispose(); oldDispose?.(); } });
+    });
+  }
+
+  public getNodeValue(id: string): AnyNode | undefined {
+    return this.nodes[id]?.signal();
+  }
+
+  public removeNode(id: string) {
+    const nodeSignal = this.nodes[id];
+    if (nodeSignal) {
+      this.setNodes(id, undefined);
+
+      if (typeof nodeSignal.dispose === 'function') {
+        queueMicrotask(() => {
+          if (nodeSignal.dispose) {
+            nodeSignal.dispose();
+          }
+        });
+      }
+    }
+  }
+}

package/src/lib/nodes/tensors/broadcast.ts

@@ -0,0 +1,101 @@
+import type { BlueprintNode, Node2NodeFunc, ParameterDefinition } from '../functions/Node2NodeFunc';
+import { AnyNode, ArrayNode, DummyNode } from '../state/Node';
+
+const DUMMY: DummyNode = { id: '', type: 'Dummy' };
+
+/** Whether an input of type `type` is looped over: an array going to a parameter that doesn't take whole arrays. */
+export function isBroadcast(type: string, param: ParameterDefinition): boolean {
+  const types = Array.isArray(param.type) ? param.type : [param.type];
+  return type === 'Array' && !types.includes('Array');
+}
+
+const formatShape = (shape: number[]) => `(${shape.join(', ')}${shape.length === 1 ? ',' : ''})`;
+
+/** numpy broadcasting: shapes are lined up from the right, and each dimension must match or be 1. */
+export function broadcastShapes(shapes: number[][]): number[] {
+  const ndim = Math.max(...shapes.map(shape => shape.length));
+  const result: number[] = [];
+  for (let d = 0; d < ndim; d++) {
+    let size = 1;
+    for (const shape of shapes) {
+      const dim = shape[d - ndim + shape.length] ?? 1;
+      if (dim === 1) continue;
+      if (size !== 1 && size !== dim) {
+        throw new Error(`shapes ${shapes.map(formatShape).join(' and ')} can't be broadcast together`);
+      }
+      size = dim;
+    }
+    result.push(size);
+  }
+  return result;
+}
+
+/** Row-major position `flat` as one index per dimension of `shape`. */
+function unravel(flat: number, shape: number[]): number[] {
+  const index: number[] = [];
+  for (let d = shape.length - 1; d >= 0; d--) {
+    index[d] = flat % shape[d];
+    flat = Math.floor(flat / shape[d]);
+  }
+  return index;
+}
+
+/** The row-major position in an array of `shape` that broadcast output index `index` reads. */
+function sourceIndex(shape: number[], index: number[]): number {
+  const offset = index.length - shape.length;
+  return shape.reduce((flat, dim, d) => flat * dim + (dim === 1 ? 0 : index[d + offset]), 0);
+}
+
+/**
+ * The inputs of each item when an input is broadcast (see `isBroadcast`), or just `inputs`
+ * when none is. Like `computeBlueprint`, an item with a Dummy input is skipped.
+ */
+export function broadcastItems(parameters: ParameterDefinition[], inputs: AnyNode[]): AnyNode[][] {
+  // An input is undefined for a left-out optional parameter.
+  const broadcasts = inputs.map((node, i) => node !== undefined && isBroadcast(node.type, parameters[i]));
+  if (!broadcasts.includes(true)) return [inputs];
+
+  const shapes = inputs.map((node, i) => broadcasts[i] ? (node as ArrayNode).shape : []);
+  const shape = broadcastShapes(shapes);
+  const size = shape.reduce((a, b) => a * b, 1);
+
+  const items: AnyNode[][] = [];
+  for (let k = 0; k < size; k++) {
+    const index = unravel(k, shape);
+    const itemInputs = inputs.map((node, i) => broadcasts[i] ? (node as ArrayNode).items[sourceIndex(shapes[i], index)] : node);
+    if (!itemInputs.some(node => node?.type === 'Dummy')) items.push(itemInputs);
+  }
+  return items;
+}
+
+/**
+ * `func.compute`, run once per item when an input is broadcast (see `isBroadcast`).
+ * Item k's nodes are saved under keys `k.main`, `k.l_0`, ..., and `main` is the array of
+ * every item's main node. An item is Dummy, and not saved, when one of its inputs is
+ * Dummy or its own main node is.
+ */
+export function computeBlueprint(func: Node2NodeFunc, inputs: AnyNode[]): Record<string, BlueprintNode> {
+  // An input is undefined for a left-out optional parameter.
+  const broadcasts = inputs.map((node, i) => node !== undefined && isBroadcast(node.type, func.parameters[i]));
+  if (!broadcasts.includes(true)) return func.compute(inputs);
+
+  const shapes = inputs.map((node, i) => broadcasts[i] ? (node as ArrayNode).shape : []);
+  const shape = broadcastShapes(shapes);
+  const size = shape.reduce((a, b) => a * b, 1);
+
+  const blueprint: Record<string, BlueprintNode> = {};
+  const items: BlueprintNode[] = [];
+  for (let k = 0; k < size; k++) {
+    const index = unravel(k, shape);
+    const itemInputs = inputs.map((node, i) => broadcasts[i] ? (node as ArrayNode).items[sourceIndex(shapes[i], index)] : node);
+    const item = itemInputs.some(node => node?.type === 'Dummy') ? { main: DUMMY } : func.compute(itemInputs);
+    if (item.main.type === 'Dummy') {
+      items.push(DUMMY);
+      continue;
+    }
+    for (const key in item) blueprint[`${k}.${key}`] = item[key];
+    items.push(item.main);
+  }
+  blueprint.main = { type: 'Array', itemType: func.outputType, shape, items };
+  return blueprint;
+}

package/src/lib/nodes/tensors/tensor.ts

@@ -0,0 +1,42 @@
+import type { Arg, ExecuteResult } from '../execute';
+import type { NodeStore } from '../state/NodeStore';
+import { NodeType } from '../state/Node';
+
+export type LeafArg = Exclude<Arg, Arg[]>;
+
+/** The items of a nested list, in row-major order. */
+export const leaves = (list: Arg[]): LeafArg[] => list.flatMap(item => Array.isArray(item) ? leaves(item) : [item]);
+
+/** A nested list's shape: [[a, b], [c, d]] has shape [2, 2]. */
+export function listShape(list: Arg[]): number[] {
+  if (list.length === 0) throw new Error('a list must not be empty');
+  const shapes = list.map(item => Array.isArray(item) ? listShape(item) : []);
+  if (shapes.some(shape => shape.join() !== shapes[0].join())) {
+    throw new Error('nested lists must all have the same length');
+  }
+  return [list.length, ...shapes[0]];
+}
+
+export async function sha256(text: string): Promise<string> {
+  const digest = await crypto.subtle.digest('SHA-256', new TextEncoder().encode(text));
+  return Array.from(new Uint8Array(digest), byte => byte.toString(16).padStart(2, '0')).join('');
+}
+
+/** The node at `position` of array `arrayId`'s items. Creates nothing. */
+export function getItem(store: NodeStore, arrayId: string, position: number): ExecuteResult {
+  const array = store.getNodeValue(arrayId);
+  if (array?.type !== 'Array') throw new Error(`'${arrayId}' is not an array`);
+  const item = array.items[position];
+  if (item.type === 'Dummy') throw new Error(`item ${position} of '${arrayId}' is Dummy`);
+  return { id: item.id, type: item.type };
+}
+
+/** The one type all items of a nested list share. `typeOf` gives an item's type. */
+export function listItemType(list: Arg[], typeOf: (item: LeafArg) => string): NodeType {
+  listShape(list);
+  const types = new Set(leaves(list).map(typeOf));
+  if (types.size > 1) {
+    throw new Error(`all items of a list must have the same type, got ${[...types].join(', ')}`);
+  }
+  return [...types][0] as NodeType;
+}

package/src/lib/python/lift.ts

@@ -0,0 +1,105 @@
+import { createSignal } from 'solid-js';
+import { NodeReconciler, PYTHON_KEYWORD_PREFIX, type BlueprintNode, type Node2NodeFunc } from '~/lib/nodes/functions/Node2NodeFunc';
+import { checkOut } from '~/lib/nodes/execute';
+import type { NodeStore } from '~/lib/nodes/state/NodeStore';
+import { checkColor, type AnyNode } from '~/lib/nodes/state/Node';
+import { num, scalar } from '~/lib/nodes/jax';
+
+/** The type passed to `pie.lift`: `pie.Scalar`, `pie.Point`, `pie.Text`, or `pie.Array[...]` of `itemType`. */
+type Kind = 'Scalar' | 'Point' | 'Text' | 'Array';
+type ItemType = 'Scalar' | 'Point';
+
+/** An input node's value as Python gets it: a Scalar's number, a Point's [x, y], a Text's string, or an Array's values in row-major order. */
+export type InputValue = number | [number, number] | string | PyResult;
+
+/** A result from Python. `values`: every number in row-major order, a Point as x, y; or a Text's string. A Scalar, Point or Text has shape []. */
+export interface PyResult {
+  shape: number[];
+  values: number[] | [string];
+}
+
+/** Sent by Python once `g(a)`, for `g = pie.lift(f, ...)`, has its first result. */
+export interface LiftSave extends PyResult {
+  id: string;
+  name: string;
+  inputIds: string[];
+  kind: Kind;
+  itemType?: ItemType;
+  hidden: boolean;
+  fill?: string;
+  stroke?: string;
+}
+
+export type Rerun = (nodeId: string, values: InputValue[], done: (result?: PyResult, error?: string) => void) => void;
+
+function inputValue(node: AnyNode | undefined, id: string): InputValue {
+  if (!node) throw new Error(`Unknown node '${id}'`);
+  if (node.type === 'Scalar') return num(node.value);
+  if (node.type === 'Point') return [num(node.x), num(node.y)];
+  if (node.type === 'Text') return node.value;
+  if (node.type === 'Array') {
+    const values = node.items.flatMap(item => inputValue(item, item.id)) as number[];
+    return { shape: node.itemType === 'Point' ? [...node.shape, 2] : node.shape, values };
+  }
+  throw new Error(`'${id}' is a ${node.type}; only Scalar, Point and Text nodes and Arrays of them can be inputs`);
+}
+
+/** First half of `g(a)`: checks the inputs, `out`, `fill` and `stroke`, and reserves the output id. Python then calls `f` with `values`. */
+export function startLift(store: NodeStore, name: string, inputIds: string[], kind: Kind, out?: string, fill?: string, stroke?: string) {
+  const values = inputIds.map(id => inputValue(store.getNodeValue(id), id));
+  checkOut(name, out, inputIds.map(id => ({ id })));
+  checkColor(name, 'fill', fill);
+  checkColor(name, 'stroke', stroke);
+  const id = out ?? store.nameGenerator.generateAutoName(store.nameGenerator.getPrefixForType(kind));
+  return { id, values };
+}
+
+/** Item k of an Array is saved under key `k`, so a rerun with a new shape keeps, adds or removes items by position. */
+function toBlueprint(kind: Kind, itemType: ItemType | undefined, result: PyResult): Record<string, BlueprintNode> {
+  if (kind === 'Text') return { main: { type: 'Text', value: result.values[0] } };
+  const { shape } = result;
+  const values = result.values as number[];
+  const item = (type: ItemType, k: number) => type === 'Point'
+    ? { type: 'Point', x: scalar(values[2 * k]), y: scalar(values[2 * k + 1]) }
+    : { type: 'Scalar', value: scalar(values[k]) };
+  if (kind !== 'Array') return { main: item(kind, 0) };
+  const blueprint: Record<string, BlueprintNode> = {};
+  const items: BlueprintNode[] = [];
+  const size = shape.reduce((a, b) => a * b, 1);
+  for (let k = 0; k < size; k++) items.push(blueprint[k] = item(itemType!, k));
+  blueprint.main = { type: 'Array', itemType, shape, items };
+  return blueprint;
+}
+
+/**
+ * Second half of `g(a)`: saves the node with Python's first result. When an input's value changes,
+ * the node keeps its value and asks `rerun` for a new one. Rerun errors go to the console.
+ */
+export function saveLift(store: NodeStore, save: LiftSave, rerun: Rerun) {
+  const { id, name, inputIds, kind, itemType, hidden, fill, stroke } = save;
+  const [blueprint, setBlueprint] = createSignal(toBlueprint(kind, itemType, save));
+  // The input values of the latest result or rerun request. Unset until the first compute, which uses the first result.
+  let requested: string | undefined;
+
+  const func: Node2NodeFunc = {
+    keyword: `${PYTHON_KEYWORD_PREFIX}${name}`,
+    outputType: kind,
+    // 'Array' too, so `computeBlueprint` passes an Array input whole instead of looping over it.
+    parameters: inputIds.map((_, i) => ({ name: `input${i}`, type: ['Scalar', 'Point', 'Text', 'Array'] })),
+    broadcastable: false,
+    compute(inputs) {
+      const values = inputs.map((node, i) => inputValue(node, inputIds[i]));
+      const key = JSON.stringify(values);
+      if (requested !== undefined && key !== requested) {
+        rerun(id, values, (result, error) => {
+          if (error !== undefined) console.error(`${name}: ${error}`);
+          // A reply for an older request is dropped.
+          else if (key === requested) setBlueprint(toBlueprint(kind, itemType, result!));
+        });
+      }
+      requested = key;
+      return blueprint();
+    },
+  };
+  new NodeReconciler().evaluate(func, inputIds, store, id, hidden, fill, stroke);
+}