@alchemy.run/sigil 0.0.0-alpha.1 → 0.0.0-alpha.10

package/src/patch-console.ts

@@ -0,0 +1,106 @@
+// Derived from `patch-console` (MIT, Vadim Demedes).
+// Note: use the explicit `node:console` Console class — the global `console`
+// is replaced by a proxy without `.Console` under some test runners.
+import { Console } from "node:console";
+import { PassThrough } from "node:stream";
+
+const consoleMethods = [
+  "assert",
+  "count",
+  "countReset",
+  "debug",
+  "dir",
+  "dirxml",
+  "error",
+  "group",
+  "groupCollapsed",
+  "groupEnd",
+  "info",
+  "log",
+  "table",
+  "time",
+  "timeEnd",
+  "timeLog",
+  "trace",
+  "warn",
+] as const;
+
+type ConsoleMethod = (typeof consoleMethods)[number];
+
+export type Callback = (stream: "stdout" | "stderr", data: string) => void;
+export type Restore = () => void;
+
+export const patchConsole = (callback: Callback): Restore => {
+  const stdout = new PassThrough();
+  const stderr = new PassThrough();
+
+  stdout.write = (data: string | Uint8Array): boolean => {
+    callback("stdout", String(data));
+    return true;
+  };
+
+  stderr.write = (data: string | Uint8Array): boolean => {
+    callback("stderr", String(data));
+    return true;
+  };
+
+  const internalConsole = new Console(stdout, stderr);
+  const originalMethods = new Map<ConsoleMethod, unknown>();
+
+  for (const method of consoleMethods) {
+    originalMethods.set(method, console[method]);
+    (console as Record<ConsoleMethod, unknown>)[method] = internalConsole[method];
+  }
+
+  return () => {
+    for (const method of consoleMethods) {
+      (console as Record<ConsoleMethod, unknown>)[method] = originalMethods.get(method);
+    }
+
+    originalMethods.clear();
+  };
+};
+
+// Intercept direct `write` calls on a stream. The write is swallowed and the
+// decoded chunk is handed to `onData`; write callbacks still fire so callers
+// awaiting flushes don't hang.
+export const patchStreamWrite = (
+  stream: NodeJS.WritableStream,
+  onData: (data: string) => void,
+): Restore => {
+  // Keep the unbound reference: restore below must reassign the exact
+  // original function object, not a bound copy.
+  // oxlint-disable-next-line typescript/unbound-method
+  const originalWrite = stream.write;
+
+  const patchedWrite = (
+    chunk: unknown,
+    encodingOrCallback?: unknown,
+    callback?: unknown,
+  ): boolean => {
+    const data =
+      typeof chunk === "string"
+        ? chunk
+        : chunk instanceof Uint8Array
+          ? Buffer.from(chunk).toString()
+          : String(chunk);
+
+    onData(data);
+
+    const done =
+      typeof encodingOrCallback === "function"
+        ? encodingOrCallback
+        : typeof callback === "function"
+          ? callback
+          : undefined;
+    done?.();
+
+    return true;
+  };
+
+  stream.write = patchedWrite;
+
+  return () => {
+    stream.write = originalWrite;
+  };
+};

package/src/quick-lru.ts

@@ -0,0 +1,85 @@
+// Derived from `quick-lru` (MIT, Sindre Sorhus), reduced to the surface Ink
+// uses. Implements the same two-generation LRU algorithm: when the hot map
+// fills up, it becomes the cold generation and reads promote entries back.
+export class QuickLru<KeyType, ValueType> {
+  #size = 0;
+  #cache = new Map<KeyType, ValueType>();
+  #oldCache = new Map<KeyType, ValueType>();
+  readonly #maxSize: number;
+
+  constructor({ maxSize }: { maxSize: number }) {
+    if (!(maxSize && maxSize > 0)) {
+      throw new TypeError("`maxSize` must be a number greater than 0");
+    }
+
+    this.#maxSize = maxSize;
+  }
+
+  get size(): number {
+    let oldCacheSize = 0;
+
+    for (const key of this.#oldCache.keys()) {
+      if (!this.#cache.has(key)) {
+        oldCacheSize++;
+      }
+    }
+
+    return Math.min(this.#size + oldCacheSize, this.#maxSize);
+  }
+
+  get(key: KeyType): ValueType | undefined {
+    if (this.#cache.has(key)) {
+      return this.#cache.get(key);
+    }
+
+    if (this.#oldCache.has(key)) {
+      const value = this.#oldCache.get(key)!;
+      this.#oldCache.delete(key);
+      this.#set(key, value);
+      return value;
+    }
+
+    return;
+  }
+
+  set(key: KeyType, value: ValueType): this {
+    if (this.#cache.has(key)) {
+      this.#cache.set(key, value);
+    } else {
+      this.#set(key, value);
+    }
+
+    return this;
+  }
+
+  has(key: KeyType): boolean {
+    return this.#cache.has(key) || this.#oldCache.has(key);
+  }
+
+  delete(key: KeyType): boolean {
+    const deleted = this.#cache.delete(key);
+
+    if (deleted) {
+      this.#size--;
+    }
+
+    return this.#oldCache.delete(key) || deleted;
+  }
+
+  clear(): void {
+    this.#cache.clear();
+    this.#oldCache.clear();
+    this.#size = 0;
+  }
+
+  #set(key: KeyType, value: ValueType): void {
+    this.#cache.set(key, value);
+    this.#size++;
+
+    if (this.#size >= this.#maxSize) {
+      this.#size = 0;
+      this.#oldCache = this.#cache;
+      this.#cache = new Map();
+    }
+  }
+}

package/src/reconciler.ts

@@ -0,0 +1,425 @@
+import { createContext } from "react";
+import createReconciler, { type ReactContext } from "react-reconciler";
+import { DefaultEventPriority, NoEventPriority } from "react-reconciler/constants.js";
+import * as Scheduler from "scheduler";
+
+import {
+  createTextNode,
+  appendChildNode,
+  insertBeforeNode,
+  removeChildNode,
+  detachYogaSubtree,
+  emitLayoutListeners,
+  setStyle,
+  setTextNodeValue,
+  createNode,
+  setAttribute,
+  type DOMNodeAttribute,
+  type TextNode,
+  type ElementNames,
+  type DOMElement,
+} from "#/dom.ts";
+import { isSigilDev } from "#/env.ts";
+import type { SemanticTextStyle } from "#/semantic-text-style.ts";
+import { styles as applyStyles, type Styles } from "#/styles.ts";
+import { type AnsiTransformer } from "#/transform-adapter.ts";
+import { Yoga } from "#/yoga/index.ts";
+
+import pkg from "../package.json" with { type: "json" };
+
+// We need to conditionally perform devtools connection to avoid
+// accidentally breaking other third-party code.
+// See https://github.com/vadimdemedes/ink/issues/384
+// See https://github.com/vadimdemedes/ink/issues/648
+if (isSigilDev) {
+  // Intentionally no warning when the package is missing.
+  // SIGIL_DEV may be set for other reasons; devtools is opt-in via installing the package.
+  await import("#/devtools.ts").catch(() => {});
+}
+
+type AnyObject = Record<string, unknown>;
+
+const diff = (before: AnyObject, after: AnyObject): AnyObject | undefined => {
+  if (before === after) {
+    return;
+  }
+
+  if (!before) {
+    return after;
+  }
+
+  const changed: AnyObject = {};
+  let isChanged = false;
+
+  for (const key of Object.keys(before)) {
+    const isDeleted = after ? !Object.hasOwn(after, key) : true;
+
+    if (isDeleted) {
+      changed[key] = undefined;
+      isChanged = true;
+    }
+  }
+
+  if (after) {
+    for (const key of Object.keys(after)) {
+      if (after[key] !== before[key]) {
+        changed[key] = after[key];
+        isChanged = true;
+      }
+    }
+  }
+
+  return isChanged ? changed : undefined;
+};
+
+const findRootNode = (node: DOMElement): DOMElement | undefined => {
+  let current: DOMElement | undefined = node;
+
+  while (current) {
+    if (current.nodeName === "ink-root") {
+      return current;
+    }
+
+    current = current.parentNode;
+  }
+
+  return;
+};
+
+/**
+ * Clear the root's cached `staticNode` when the node it points at is being
+ * removed as part of a larger subtree.
+ *
+ * The previous identity check (`staticNode === removeNode`) only caught direct
+ * removal of the `<Static>` element. When an *ancestor* of `<Static>` is
+ * removed, the stale `staticNode` reference survives and the next render would
+ * replay stale static output (and, before `detachYogaSubtree`, trap on detached
+ * WASM memory — see QwenLM/qwen-code#6820).
+ *
+ * The owning root is derived from the host parent passed to the removal hook,
+ * not a module-level global, so instances with separate stdout streams don't
+ * clobber each other's pointers.
+ */
+const clearStaticNodeIfContained = (
+  rootNode: DOMElement | undefined,
+  removeNode: DOMElement | TextNode,
+): void => {
+  if (!rootNode?.staticNode) {
+    return;
+  }
+
+  // Walk up from staticNode to see if removeNode is an ancestor.
+  let current: DOMElement | undefined = rootNode.staticNode;
+
+  while (current) {
+    if (current === removeNode) {
+      // Only clear staticNode, not previousStaticNode. The inequality
+      // (undefined !== previousStaticNode) triggers onStaticChange in
+      // resetAfterCommit, which resets fullStaticOutput.
+      rootNode.staticNode = undefined;
+      return;
+    }
+
+    current = current.parentNode;
+  }
+};
+
+type Props = Record<string, unknown>;
+
+type HostContext = {
+  isInsideText: boolean;
+};
+
+let currentUpdatePriority = NoEventPriority;
+
+export const reconciler = createReconciler<
+  ElementNames,
+  Props,
+  DOMElement,
+  DOMElement,
+  TextNode,
+  DOMElement,
+  unknown,
+  unknown,
+  unknown,
+  HostContext,
+  unknown,
+  unknown,
+  unknown,
+  unknown
+>({
+  getRootHostContext: () => ({
+    isInsideText: false,
+  }),
+  prepareForCommit: () => null,
+  preparePortalMount: () => null,
+  clearContainer: () => false,
+  resetAfterCommit(rootNode) {
+    if (typeof rootNode.onComputeLayout === "function") {
+      rootNode.onComputeLayout();
+    }
+
+    emitLayoutListeners(rootNode);
+
+    /*
+		Fire `onStaticChange` BEFORE `onImmediateRender` so ink resets accumulated static output before the new instance emits. Without this, items from a replaced/removed <Static> stay in `fullStaticOutput` and get replayed on rewrites.
+		*/
+    if (rootNode.staticNode !== rootNode.previousStaticNode) {
+      rootNode.previousStaticNode = rootNode.staticNode;
+      if (typeof rootNode.onStaticChange === "function") {
+        rootNode.onStaticChange();
+      }
+    }
+
+    // Since renders are throttled at the instance level and <Static> component children
+    // are rendered only once and then get deleted, we need an escape hatch to
+    // trigger an immediate render to ensure <Static> children are written to output before they get erased
+    if (rootNode.isStaticDirty) {
+      rootNode.isStaticDirty = false;
+      if (typeof rootNode.onImmediateRender === "function") {
+        rootNode.onImmediateRender();
+      }
+
+      return;
+    }
+
+    if (typeof rootNode.onRender === "function") {
+      rootNode.onRender();
+    }
+  },
+  getChildHostContext(parentHostContext, type) {
+    const previousIsInsideText = parentHostContext.isInsideText;
+    const isInsideText = type === "ink-text" || type === "ink-virtual-text";
+
+    if (previousIsInsideText === isInsideText) {
+      return parentHostContext;
+    }
+
+    return { isInsideText };
+  },
+  shouldSetTextContent: () => false,
+  createInstance(originalType, newProps, rootNode, hostContext) {
+    if (hostContext.isInsideText && originalType === "ink-box") {
+      throw new Error(`<Box> can't be nested inside <Text> component`);
+    }
+
+    const type =
+      originalType === "ink-text" && hostContext.isInsideText ? "ink-virtual-text" : originalType;
+
+    const node = createNode(type);
+
+    for (const [key, value] of Object.entries(newProps)) {
+      if (key === "children") {
+        continue;
+      }
+
+      if (key === "style") {
+        // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+        setStyle(node, value as Styles);
+
+        if (node.yogaNode) {
+          // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+          applyStyles(node.yogaNode, value as Styles);
+        }
+
+        continue;
+      }
+
+      if (key === "internal_transform") {
+        // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+        node.internal_transform = value as AnsiTransformer;
+        continue;
+      }
+
+      if (key === "internal_ansi") {
+        node.internal_ansi = value === true;
+        continue;
+      }
+
+      if (key === "internal_textStyle") {
+        node.internal_textStyle = value as SemanticTextStyle;
+        continue;
+      }
+
+      if (key === "internal_static") {
+        node.internal_static = true;
+        rootNode.isStaticDirty = true;
+
+        // Save reference to <Static> node to skip traversal of entire
+        // node tree to find it
+        rootNode.staticNode = node;
+        continue;
+      }
+
+      setAttribute(node, key, value as DOMNodeAttribute);
+    }
+
+    return node;
+  },
+  createTextInstance(text, _root, hostContext) {
+    if (!hostContext.isInsideText) {
+      throw new Error(`Text string "${text}" must be rendered inside <Text> component`);
+    }
+
+    return createTextNode(text);
+  },
+  resetTextContent() {},
+  hideTextInstance(node) {
+    setTextNodeValue(node, "");
+  },
+  unhideTextInstance(node, text) {
+    setTextNodeValue(node, text);
+  },
+  getPublicInstance: (instance) => instance,
+  hideInstance(node) {
+    node.yogaNode?.setDisplay(Yoga.DISPLAY_NONE);
+  },
+  unhideInstance(node) {
+    node.yogaNode?.setDisplay(Yoga.DISPLAY_FLEX);
+  },
+  appendInitialChild: appendChildNode,
+  appendChild: appendChildNode,
+  insertBefore: insertBeforeNode,
+  finalizeInitialChildren() {
+    return false;
+  },
+  isPrimaryRenderer: true,
+  supportsMutation: true,
+  supportsPersistence: false,
+  supportsHydration: false,
+  // Scheduler integration for concurrent mode
+  supportsMicrotasks: true,
+  scheduleMicrotask: queueMicrotask,
+  // @ts-expect-error @types/react-reconciler is outdated and doesn't include scheduleCallback
+  scheduleCallback: Scheduler.unstable_scheduleCallback,
+  cancelCallback: Scheduler.unstable_cancelCallback,
+  shouldYield: Scheduler.unstable_shouldYield,
+  now: Scheduler.unstable_now,
+  scheduleTimeout: setTimeout,
+  cancelTimeout: clearTimeout,
+  noTimeout: -1,
+  beforeActiveInstanceBlur() {},
+  afterActiveInstanceBlur() {},
+  detachDeletedInstance() {},
+  getInstanceFromNode: () => null,
+  prepareScopeUpdate() {},
+  getInstanceFromScope: () => null,
+  appendChildToContainer: appendChildNode,
+  insertInContainerBefore: insertBeforeNode,
+  removeChildFromContainer(node, removeNode) {
+    // `node` is the container, i.e. the root itself. Clear before
+    // removeChildNode breaks the parent chain.
+    clearStaticNodeIfContained(findRootNode(node), removeNode);
+
+    removeChildNode(node, removeNode);
+    detachYogaSubtree(removeNode);
+  },
+  commitUpdate(node, _type, oldProps, newProps) {
+    if (node.internal_static) {
+      const rootNode = findRootNode(node);
+
+      if (rootNode) {
+        rootNode.isStaticDirty = true;
+      }
+    }
+
+    const props = diff(oldProps, newProps);
+
+    // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+    const style = diff(oldProps["style"] as Styles, newProps["style"] as Styles);
+
+    if (!props && !style) {
+      return;
+    }
+
+    if (props) {
+      for (const [key, value] of Object.entries(props)) {
+        if (key === "style") {
+          // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+          setStyle(node, value as Styles);
+          continue;
+        }
+
+        if (key === "internal_transform") {
+          // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+          node.internal_transform = value as AnsiTransformer;
+          continue;
+        }
+
+        if (key === "internal_ansi") {
+          node.internal_ansi = value === true;
+          continue;
+        }
+
+        if (key === "internal_textStyle") {
+          node.internal_textStyle = value as SemanticTextStyle | undefined;
+          continue;
+        }
+
+        if (key === "internal_static") {
+          node.internal_static = true;
+          continue;
+        }
+
+        // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+        setAttribute(node, key, value as DOMNodeAttribute);
+      }
+    }
+
+    if (style && node.yogaNode) {
+      // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+      applyStyles(node.yogaNode, style, (newProps["style"] as Styles | undefined) ?? {});
+    }
+  },
+  commitTextUpdate(node, _oldText, newText) {
+    setTextNodeValue(node, newText);
+  },
+  removeChild(node, removeNode) {
+    // `node` is the host parent; its chain up to the root is still intact
+    // here, so derive the owning root from it rather than a global.
+    clearStaticNodeIfContained(findRootNode(node), removeNode);
+
+    removeChildNode(node, removeNode);
+    detachYogaSubtree(removeNode);
+  },
+  setCurrentUpdatePriority(newPriority: number) {
+    currentUpdatePriority = newPriority;
+  },
+  getCurrentUpdatePriority: () => currentUpdatePriority,
+  resolveUpdatePriority() {
+    if (currentUpdatePriority !== NoEventPriority) {
+      return currentUpdatePriority;
+    }
+
+    return DefaultEventPriority;
+  },
+  maySuspendCommit() {
+    // Return true to enable Suspense resource preloading
+    return true;
+  },
+  NotPendingTransition: undefined,
+  // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+  HostTransitionContext: createContext(null) as unknown as ReactContext<unknown>,
+  resetFormInstance() {},
+  requestPostPaintCallback() {},
+  shouldAttemptEagerTransition() {
+    return false;
+  },
+  trackSchedulerEvent() {},
+  resolveEventType() {
+    return null;
+  },
+  resolveEventTimeStamp() {
+    return -1.1;
+  },
+  preloadInstance() {
+    return true;
+  },
+  startSuspendingCommit() {},
+  suspendInstance() {},
+  waitForCommitToBeReady() {
+    return null;
+  },
+  rendererPackageName: pkg.name,
+  rendererVersion: pkg.version,
+});

package/src/render-background.ts

@@ -0,0 +1,59 @@
+import { samplePaint } from "#/color/sample.ts";
+import { type DOMNode } from "#/dom.ts";
+import type { Canvas } from "#/screen/canvas.ts";
+import { cellAttributes, createCell } from "#/screen/index.ts";
+
+export const renderBackground = (x: number, y: number, node: DOMNode, output: Canvas): void => {
+  if (node.style.backgroundColor === undefined) {
+    return;
+  }
+
+  const width = node.yogaNode!.getComputedWidth();
+  const height = node.yogaNode!.getComputedHeight();
+
+  // Calculate the actual content area considering borders
+  const leftBorderWidth = node.style.borderStyle && node.style.borderLeft !== false ? 1 : 0;
+  const rightBorderWidth = node.style.borderStyle && node.style.borderRight !== false ? 1 : 0;
+  const topBorderHeight = node.style.borderStyle && node.style.borderTop !== false ? 1 : 0;
+  const bottomBorderHeight = node.style.borderStyle && node.style.borderBottom !== false ? 1 : 0;
+
+  const contentWidth = width - leftBorderWidth - rightBorderWidth;
+  const contentHeight = height - topBorderHeight - bottomBorderHeight;
+
+  if (!(contentWidth > 0 && contentHeight > 0)) {
+    return;
+  }
+
+  const bounds = {
+    x: x + leftBorderWidth,
+    y: y + topBorderHeight,
+    width: contentWidth,
+    height: contentHeight,
+  };
+  const lines = Array.from({ length: contentHeight }, (_unused, row) =>
+    Array.from({ length: contentWidth }, (_empty, column) => {
+      const resetBackground = node.style.backgroundColor === "";
+      const background = resetBackground
+        ? undefined
+        : samplePaint(
+            node.style.backgroundColor!,
+            bounds.x + column,
+            bounds.y + row,
+            bounds,
+            output.paintContext,
+          );
+      return createCell(
+        " ",
+        1,
+        {
+          ...(background ? { background } : {}),
+          underline: "none",
+          attributes: cellAttributes.none,
+        },
+        undefined,
+        resetBackground ? { background: true } : undefined,
+      );
+    }),
+  );
+  output.writeCells(bounds.x, bounds.y, lines);
+};