@claude-code-kit/ink-renderer 0.1.0 → 0.2.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Minnzen
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,45 @@
+# @claude-code-kit/ink-renderer
+
+Terminal rendering engine for claude-code-kit — React reconciler, Yoga Flexbox layout, keyboard/mouse events, ANSI output.
+
+Part of [claude-code-kit](https://github.com/Minnzen/claude-code-kit).
+
+## Installation
+
+```bash
+pnpm add @claude-code-kit/ink-renderer react
+```
+
+## Quick Start
+
+```tsx
+import React from 'react'
+import { render, Box, Text } from '@claude-code-kit/ink-renderer'
+
+function App() {
+  return (
+    <Box flexDirection="column" padding={1}>
+      <Text bold color="green">Hello from claude-code-kit</Text>
+      <Text>Build terminal UIs like React apps.</Text>
+    </Box>
+  )
+}
+
+await render(<App />)
+```
+
+## Included
+
+- Rendering API: `render`, `renderSync`, `createRoot`
+- Primitives: `Box`, `Text`, `Spacer`, `Newline`, `Link`, `Button`, `ScrollBox`
+- Hooks: `useInput`, `useApp`, `useStdin`, `useInterval`, `useAnimationFrame`
+- Terminal helpers: `AlternateScreen`, `RawAnsi`, `Ansi`, `ErrorOverview`
+
+## Docs
+
+- Full project docs: [github.com/Minnzen/claude-code-kit](https://github.com/Minnzen/claude-code-kit)
+- Components overview: [docs/components.md](https://github.com/Minnzen/claude-code-kit/blob/main/docs/components.md)
+
+## License
+
+MIT

package/dist/index.js

@@ -80,9 +80,96 @@ var import_stream = require("stream");
 // src/ink.tsx
 var import_auto_bind = __toESM(require("auto-bind"));
 var import_fs3 = require("fs");
-var import_noop2 = __toESM(require("lodash-es/noop"));
-var import_throttle = __toESM(require("lodash-es/throttle"));
-var import_constants4 = require("react-reconciler/constants");
+
+// src/lodash-replacements.ts
+function noop() {
+}
+function throttle(func, wait, options = {}) {
+  let timerId;
+  let lastCallTime;
+  let lastInvokeTime = 0;
+  let lastArgs;
+  let result;
+  const leading = options.leading !== false;
+  const trailing = options.trailing !== false;
+  function invokeFunc(time) {
+    lastInvokeTime = time;
+    const args = lastArgs;
+    lastArgs = void 0;
+    result = func(...args);
+    return result;
+  }
+  function startTimer(pendingFunc, remainingWait2) {
+    timerId = setTimeout(pendingFunc, remainingWait2);
+  }
+  function shouldInvoke(time) {
+    const timeSinceLastCall = lastCallTime === void 0 ? wait : time - lastCallTime;
+    const timeSinceLastInvoke = time - lastInvokeTime;
+    return lastCallTime === void 0 || timeSinceLastCall >= wait || timeSinceLastCall < 0 || timeSinceLastInvoke >= wait;
+  }
+  function remainingWait(time) {
+    const timeSinceLastCall = time - (lastCallTime ?? 0);
+    return Math.max(0, wait - timeSinceLastCall);
+  }
+  function timerExpired() {
+    const time = Date.now();
+    if (shouldInvoke(time)) {
+      trailingEdge(time);
+      return;
+    }
+    startTimer(timerExpired, remainingWait(time));
+  }
+  function trailingEdge(time) {
+    timerId = void 0;
+    if (trailing && lastArgs) {
+      invokeFunc(time);
+    }
+    lastArgs = void 0;
+  }
+  function leadingEdge(time) {
+    lastInvokeTime = time;
+    startTimer(timerExpired, wait);
+    if (leading) {
+      invokeFunc(time);
+    }
+  }
+  const throttled = function(...args) {
+    const time = Date.now();
+    const isInvoking = shouldInvoke(time);
+    lastArgs = args;
+    lastCallTime = time;
+    if (isInvoking) {
+      if (timerId === void 0) {
+        leadingEdge(time);
+        return result;
+      }
+    }
+    if (timerId === void 0) {
+      startTimer(timerExpired, wait);
+    }
+    return result;
+  };
+  throttled.cancel = function() {
+    if (timerId !== void 0) {
+      clearTimeout(timerId);
+    }
+    lastInvokeTime = 0;
+    lastArgs = void 0;
+    lastCallTime = void 0;
+    timerId = void 0;
+  };
+  throttled.flush = function() {
+    if (timerId === void 0) {
+      return result;
+    }
+    trailingEdge(Date.now());
+    return result;
+  };
+  return throttled;
+}
+
+// src/ink.tsx
+var import_constants4 = require("react-reconciler/constants.js");
 var import_signal_exit = require("signal-exit");
 var import_yoga_layout3 = require("@claude-code-kit/shared/yoga-layout");
 var import_shared13 = require("@claude-code-kit/shared");
@@ -172,6 +259,22 @@ var colorize = (str, color, type) => {
     const thirdValue = Number(matches[3]);
     return type === "foreground" ? import_chalk.default.rgb(firstValue, secondValue, thirdValue)(str) : import_chalk.default.bgRgb(firstValue, secondValue, thirdValue)(str);
   }
+  const PLAIN_ANSI = {
+    black: type === "foreground" ? import_chalk.default.black : import_chalk.default.bgBlack,
+    red: type === "foreground" ? import_chalk.default.red : import_chalk.default.bgRed,
+    green: type === "foreground" ? import_chalk.default.green : import_chalk.default.bgGreen,
+    yellow: type === "foreground" ? import_chalk.default.yellow : import_chalk.default.bgYellow,
+    blue: type === "foreground" ? import_chalk.default.blue : import_chalk.default.bgBlue,
+    magenta: type === "foreground" ? import_chalk.default.magenta : import_chalk.default.bgMagenta,
+    cyan: type === "foreground" ? import_chalk.default.cyan : import_chalk.default.bgCyan,
+    white: type === "foreground" ? import_chalk.default.white : import_chalk.default.bgWhite,
+    gray: type === "foreground" ? import_chalk.default.gray : import_chalk.default.bgBlackBright,
+    grey: type === "foreground" ? import_chalk.default.gray : import_chalk.default.bgBlackBright
+  };
+  const fn = PLAIN_ANSI[color];
+  if (fn) {
+    return fn(str);
+  }
   return str;
 };
 function applyTextStyles(text, styles2) {
@@ -2153,7 +2256,7 @@ function findOwnerChainAtRow(root, y) {
 }
 
 // src/events/dispatcher.ts
-var import_constants = require("react-reconciler/constants");
+var import_constants = require("react-reconciler/constants.js");
 var import_shared3 = require("@claude-code-kit/shared");
 
 // src/events/event-handlers.ts
@@ -2813,7 +2916,7 @@ var diff = (before, after) => {
   const changed = {};
   let isChanged = false;
   for (const key of Object.keys(before)) {
-    const isDeleted = after ? !Object.hasOwn(after, key) : true;
+    const isDeleted = after ? !Object.prototype.hasOwnProperty.call(after, key) : true;
     if (isDeleted) {
       changed[key] = void 0;
       isChanged = true;
@@ -4142,7 +4245,7 @@ function findPlainTextUrlAt(screen, col, row) {
   let url = token.slice(urlStart, urlEnd);
   const OPENER = { ")": "(", "]": "[", "}": "{" };
   while (url.length > 0) {
-    const last = url.at(-1);
+    const last = url.charAt(url.length - 1);
     if (".,;:!?".includes(last)) {
       url = url.slice(0, -1);
       continue;
@@ -4506,7 +4609,7 @@ function osc(...parts) {
 }
 function wrapForMultiplexer(sequence) {
   if (process.env["TMUX"]) {
-    const escaped = sequence.replaceAll("\x1B", "\x1B\x1B");
+    const escaped = sequence.split("\x1B").join("\x1B\x1B");
     return `\x1BPtmux;${escaped}\x1B\\`;
   }
   if (process.env["STY"]) {
@@ -4515,7 +4618,7 @@ function wrapForMultiplexer(sequence) {
   return sequence;
 }
 function tmuxPassthrough(payload) {
-  return `${ESC}Ptmux;${payload.replaceAll(ESC, ESC + ESC)}${ST}`;
+  return `${ESC}Ptmux;${payload.split(ESC).join(ESC + ESC)}${ST}`;
 }
 async function tmuxLoadBuffer(text) {
   if (!process.env["TMUX"]) return false;
@@ -4755,11 +4858,12 @@ function supportsTabStatus() {
 function tabStatus(fields) {
   const parts = [];
   const rgb2 = (c) => c.type === "rgb" ? `#${[c.r, c.g, c.b].map((n) => n.toString(16).padStart(2, "0")).join("")}` : "";
+  const escapeStatusValue = (value) => value.split("\\").join("\\\\").split(";").join("\\;");
   if ("indicator" in fields)
     parts.push(`indicator=${fields.indicator ? rgb2(fields.indicator) : ""}`);
   if ("status" in fields)
     parts.push(
-      `status=${fields.status?.replaceAll("\\", "\\\\").replaceAll(";", "\\;") ?? ""}`
+      `status=${fields.status ? escapeStatusValue(fields.status) : ""}`
     );
   if ("statusColor" in fields)
     parts.push(
@@ -6797,12 +6901,13 @@ var Output = class {
       if (operation.fromAbsolute) absoluteClears.push(rect);
     }
     const clips = [];
+    const getCurrentClip = () => clips[clips.length - 1];
     for (const operation of this.operations) {
       switch (operation.type) {
         case "clear":
           continue;
         case "clip":
-          clips.push(intersectClip(clips.at(-1), operation.clip));
+          clips.push(intersectClip(getCurrentClip(), operation.clip));
           continue;
         case "unclip":
           clips.pop();
@@ -6815,7 +6920,7 @@ var Output = class {
             width: regionWidth,
             height: regionHeight
           } = operation;
-          const clip = clips.at(-1);
+          const clip = getCurrentClip();
           const startX = Math.max(regionX, clip?.x1 ?? 0);
           const startY = Math.max(regionY, clip?.y1 ?? 0);
           const maxY = Math.min(
@@ -6861,7 +6966,7 @@ var Output = class {
           let lines = text.split("\n");
           let swFrom = 0;
           let prevContentEnd = 0;
-          const clip = clips.at(-1);
+          const clip = getCurrentClip();
           if (clip) {
             const clipHorizontally = typeof clip?.x1 === "number" && typeof clip?.x2 === "number";
             const clipVertically = typeof clip?.y1 === "number" && typeof clip?.y2 === "number";
@@ -7984,8 +8089,7 @@ function dropSubtreeCache(node) {
 var render_node_to_output_default = renderNodeToOutput;
 
 // src/render-to-screen.ts
-var import_noop = __toESM(require("lodash-es/noop"));
-var import_constants3 = require("react-reconciler/constants");
+var import_constants3 = require("react-reconciler/constants.js");
 var import_shared11 = require("@claude-code-kit/shared");
 var timing = { reconcile: 0, yoga: 0, paint: 0, scan: 0, calls: 0 };
 function scanPositions(screen, query) {
@@ -8382,7 +8486,7 @@ var Ink = class {
       stylePool: this.stylePool
     });
     const deferredRender = () => queueMicrotask(this.onRender);
-    this.scheduleRender = (0, import_throttle.default)(deferredRender, FRAME_INTERVAL_MS, {
+    this.scheduleRender = throttle(deferredRender, FRAME_INTERVAL_MS, {
       leading: true,
       trailing: true
     });
@@ -8428,13 +8532,13 @@ var Ink = class {
       false,
       null,
       "id",
-      import_noop2.default,
+      noop,
       // onUncaughtError
-      import_noop2.default,
+      noop,
       // onCaughtError
-      import_noop2.default,
+      noop,
       // onRecoverableError
-      import_noop2.default
+      noop
       // onDefaultTransitionIndicator
     );
     if (false) {
@@ -9225,7 +9329,7 @@ var Ink = class {
   render(node) {
     this.currentNode = node;
     const tree = /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(App, { stdin: this.options.stdin, stdout: this.options.stdout, stderr: this.options.stderr, exitOnCtrlC: this.options.exitOnCtrlC, onExit: this.unmount, terminalColumns: this.terminalColumns, terminalRows: this.terminalRows, selection: this.selection, onSelectionChange: this.notifySelectionChange, onClickAt: this.dispatchClick, onHoverAt: this.dispatchHover, getHyperlinkAt: this.getHyperlinkAt, onOpenHyperlink: this.openHyperlink, onMultiClick: this.handleMultiClick, onSelectionDrag: this.handleSelectionDrag, onStdinResume: this.reassertTerminalModes, onCursorDeclaration: this.setCursorDeclaration, dispatchKeyboardEvent: this.dispatchKeyboardEvent, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TerminalWriteProvider, { value: this.writeRaw, children: node }) });
-    reconciler_default.updateContainerSync(tree, this.container, null, import_noop2.default);
+    reconciler_default.updateContainerSync(tree, this.container, null, noop);
     reconciler_default.flushSyncWork();
   }
   unmount(error) {
@@ -9261,7 +9365,7 @@ var Ink = class {
       clearTimeout(this.drainTimer);
       this.drainTimer = null;
     }
-    reconciler_default.updateContainerSync(null, this.container, null, import_noop2.default);
+    reconciler_default.updateContainerSync(null, this.container, null, noop);
     reconciler_default.flushSyncWork();
     instances_default.delete(this.options.stdout);
     this.rootNode.yogaNode?.free();

package/dist/index.mjs

@@ -5,9 +5,96 @@ import { Stream } from "stream";
 // src/ink.tsx
 import autoBind from "auto-bind";
 import { closeSync, constants as fsConstants, openSync, readSync, writeSync } from "fs";
-import noop2 from "lodash-es/noop";
-import throttle from "lodash-es/throttle";
-import { ConcurrentRoot } from "react-reconciler/constants";
+
+// src/lodash-replacements.ts
+function noop() {
+}
+function throttle(func, wait, options = {}) {
+  let timerId;
+  let lastCallTime;
+  let lastInvokeTime = 0;
+  let lastArgs;
+  let result;
+  const leading = options.leading !== false;
+  const trailing = options.trailing !== false;
+  function invokeFunc(time) {
+    lastInvokeTime = time;
+    const args = lastArgs;
+    lastArgs = void 0;
+    result = func(...args);
+    return result;
+  }
+  function startTimer(pendingFunc, remainingWait2) {
+    timerId = setTimeout(pendingFunc, remainingWait2);
+  }
+  function shouldInvoke(time) {
+    const timeSinceLastCall = lastCallTime === void 0 ? wait : time - lastCallTime;
+    const timeSinceLastInvoke = time - lastInvokeTime;
+    return lastCallTime === void 0 || timeSinceLastCall >= wait || timeSinceLastCall < 0 || timeSinceLastInvoke >= wait;
+  }
+  function remainingWait(time) {
+    const timeSinceLastCall = time - (lastCallTime ?? 0);
+    return Math.max(0, wait - timeSinceLastCall);
+  }
+  function timerExpired() {
+    const time = Date.now();
+    if (shouldInvoke(time)) {
+      trailingEdge(time);
+      return;
+    }
+    startTimer(timerExpired, remainingWait(time));
+  }
+  function trailingEdge(time) {
+    timerId = void 0;
+    if (trailing && lastArgs) {
+      invokeFunc(time);
+    }
+    lastArgs = void 0;
+  }
+  function leadingEdge(time) {
+    lastInvokeTime = time;
+    startTimer(timerExpired, wait);
+    if (leading) {
+      invokeFunc(time);
+    }
+  }
+  const throttled = function(...args) {
+    const time = Date.now();
+    const isInvoking = shouldInvoke(time);
+    lastArgs = args;
+    lastCallTime = time;
+    if (isInvoking) {
+      if (timerId === void 0) {
+        leadingEdge(time);
+        return result;
+      }
+    }
+    if (timerId === void 0) {
+      startTimer(timerExpired, wait);
+    }
+    return result;
+  };
+  throttled.cancel = function() {
+    if (timerId !== void 0) {
+      clearTimeout(timerId);
+    }
+    lastInvokeTime = 0;
+    lastArgs = void 0;
+    lastCallTime = void 0;
+    timerId = void 0;
+  };
+  throttled.flush = function() {
+    if (timerId === void 0) {
+      return result;
+    }
+    trailingEdge(Date.now());
+    return result;
+  };
+  return throttled;
+}
+
+// src/ink.tsx
+import { ConcurrentRoot } from "react-reconciler/constants.js";
 import { onExit } from "signal-exit";
 import { getYogaCounters as getYogaCounters2 } from "@claude-code-kit/shared/yoga-layout";
 import { logForDebugging as logForDebugging7 } from "@claude-code-kit/shared";
@@ -97,6 +184,22 @@ var colorize = (str, color, type) => {
     const thirdValue = Number(matches[3]);
     return type === "foreground" ? chalk.rgb(firstValue, secondValue, thirdValue)(str) : chalk.bgRgb(firstValue, secondValue, thirdValue)(str);
   }
+  const PLAIN_ANSI = {
+    black: type === "foreground" ? chalk.black : chalk.bgBlack,
+    red: type === "foreground" ? chalk.red : chalk.bgRed,
+    green: type === "foreground" ? chalk.green : chalk.bgGreen,
+    yellow: type === "foreground" ? chalk.yellow : chalk.bgYellow,
+    blue: type === "foreground" ? chalk.blue : chalk.bgBlue,
+    magenta: type === "foreground" ? chalk.magenta : chalk.bgMagenta,
+    cyan: type === "foreground" ? chalk.cyan : chalk.bgCyan,
+    white: type === "foreground" ? chalk.white : chalk.bgWhite,
+    gray: type === "foreground" ? chalk.gray : chalk.bgBlackBright,
+    grey: type === "foreground" ? chalk.gray : chalk.bgBlackBright
+  };
+  const fn = PLAIN_ANSI[color];
+  if (fn) {
+    return fn(str);
+  }
   return str;
 };
 function applyTextStyles(text, styles2) {
@@ -2095,7 +2198,7 @@ import {
   DefaultEventPriority,
   DiscreteEventPriority,
   NoEventPriority
-} from "react-reconciler/constants";
+} from "react-reconciler/constants.js";
 import { logError } from "@claude-code-kit/shared";
 
 // src/events/event-handlers.ts
@@ -2755,7 +2858,7 @@ var diff = (before, after) => {
   const changed = {};
   let isChanged = false;
   for (const key of Object.keys(before)) {
-    const isDeleted = after ? !Object.hasOwn(after, key) : true;
+    const isDeleted = after ? !Object.prototype.hasOwnProperty.call(after, key) : true;
     if (isDeleted) {
       changed[key] = void 0;
       isChanged = true;
@@ -4087,7 +4190,7 @@ function findPlainTextUrlAt(screen, col, row) {
   let url = token.slice(urlStart, urlEnd);
   const OPENER = { ")": "(", "]": "[", "}": "{" };
   while (url.length > 0) {
-    const last = url.at(-1);
+    const last = url.charAt(url.length - 1);
     if (".,;:!?".includes(last)) {
       url = url.slice(0, -1);
       continue;
@@ -4451,7 +4554,7 @@ function osc(...parts) {
 }
 function wrapForMultiplexer(sequence) {
   if (process.env["TMUX"]) {
-    const escaped = sequence.replaceAll("\x1B", "\x1B\x1B");
+    const escaped = sequence.split("\x1B").join("\x1B\x1B");
     return `\x1BPtmux;${escaped}\x1B\\`;
   }
   if (process.env["STY"]) {
@@ -4460,7 +4563,7 @@ function wrapForMultiplexer(sequence) {
   return sequence;
 }
 function tmuxPassthrough(payload) {
-  return `${ESC}Ptmux;${payload.replaceAll(ESC, ESC + ESC)}${ST}`;
+  return `${ESC}Ptmux;${payload.split(ESC).join(ESC + ESC)}${ST}`;
 }
 async function tmuxLoadBuffer(text) {
   if (!process.env["TMUX"]) return false;
@@ -4700,11 +4803,12 @@ function supportsTabStatus() {
 function tabStatus(fields) {
   const parts = [];
   const rgb2 = (c) => c.type === "rgb" ? `#${[c.r, c.g, c.b].map((n) => n.toString(16).padStart(2, "0")).join("")}` : "";
+  const escapeStatusValue = (value) => value.split("\\").join("\\\\").split(";").join("\\;");
   if ("indicator" in fields)
     parts.push(`indicator=${fields.indicator ? rgb2(fields.indicator) : ""}`);
   if ("status" in fields)
     parts.push(
-      `status=${fields.status?.replaceAll("\\", "\\\\").replaceAll(";", "\\;") ?? ""}`
+      `status=${fields.status ? escapeStatusValue(fields.status) : ""}`
     );
   if ("statusColor" in fields)
     parts.push(
@@ -6748,12 +6852,13 @@ var Output = class {
       if (operation.fromAbsolute) absoluteClears.push(rect);
     }
     const clips = [];
+    const getCurrentClip = () => clips[clips.length - 1];
     for (const operation of this.operations) {
       switch (operation.type) {
         case "clear":
           continue;
         case "clip":
-          clips.push(intersectClip(clips.at(-1), operation.clip));
+          clips.push(intersectClip(getCurrentClip(), operation.clip));
           continue;
         case "unclip":
           clips.pop();
@@ -6766,7 +6871,7 @@ var Output = class {
             width: regionWidth,
             height: regionHeight
           } = operation;
-          const clip = clips.at(-1);
+          const clip = getCurrentClip();
           const startX = Math.max(regionX, clip?.x1 ?? 0);
           const startY = Math.max(regionY, clip?.y1 ?? 0);
           const maxY = Math.min(
@@ -6812,7 +6917,7 @@ var Output = class {
           let lines = text.split("\n");
           let swFrom = 0;
           let prevContentEnd = 0;
-          const clip = clips.at(-1);
+          const clip = getCurrentClip();
           if (clip) {
             const clipHorizontally = typeof clip?.x1 === "number" && typeof clip?.x2 === "number";
             const clipVertically = typeof clip?.y1 === "number" && typeof clip?.y2 === "number";
@@ -7935,8 +8040,7 @@ function dropSubtreeCache(node) {
 var render_node_to_output_default = renderNodeToOutput;
 
 // src/render-to-screen.ts
-import noop from "lodash-es/noop";
-import { LegacyRoot } from "react-reconciler/constants";
+import { LegacyRoot } from "react-reconciler/constants.js";
 import { logForDebugging as logForDebugging5 } from "@claude-code-kit/shared";
 var timing = { reconcile: 0, yoga: 0, paint: 0, scan: 0, calls: 0 };
 function scanPositions(screen, query) {
@@ -8379,13 +8483,13 @@ var Ink = class {
       false,
       null,
       "id",
-      noop2,
+      noop,
       // onUncaughtError
-      noop2,
+      noop,
       // onCaughtError
-      noop2,
+      noop,
       // onRecoverableError
-      noop2
+      noop
       // onDefaultTransitionIndicator
     );
     if (false) {
@@ -9176,7 +9280,7 @@ var Ink = class {
   render(node) {
     this.currentNode = node;
     const tree = /* @__PURE__ */ jsx7(App, { stdin: this.options.stdin, stdout: this.options.stdout, stderr: this.options.stderr, exitOnCtrlC: this.options.exitOnCtrlC, onExit: this.unmount, terminalColumns: this.terminalColumns, terminalRows: this.terminalRows, selection: this.selection, onSelectionChange: this.notifySelectionChange, onClickAt: this.dispatchClick, onHoverAt: this.dispatchHover, getHyperlinkAt: this.getHyperlinkAt, onOpenHyperlink: this.openHyperlink, onMultiClick: this.handleMultiClick, onSelectionDrag: this.handleSelectionDrag, onStdinResume: this.reassertTerminalModes, onCursorDeclaration: this.setCursorDeclaration, dispatchKeyboardEvent: this.dispatchKeyboardEvent, children: /* @__PURE__ */ jsx7(TerminalWriteProvider, { value: this.writeRaw, children: node }) });
-    reconciler_default.updateContainerSync(tree, this.container, null, noop2);
+    reconciler_default.updateContainerSync(tree, this.container, null, noop);
     reconciler_default.flushSyncWork();
   }
   unmount(error) {
@@ -9212,7 +9316,7 @@ var Ink = class {
       clearTimeout(this.drainTimer);
       this.drainTimer = null;
     }
-    reconciler_default.updateContainerSync(null, this.container, null, noop2);
+    reconciler_default.updateContainerSync(null, this.container, null, noop);
     reconciler_default.flushSyncWork();
     instances_default.delete(this.options.stdout);
     this.rootNode.yogaNode?.free();

package/package.json

@@ -1,13 +1,14 @@
 {
   "name": "@claude-code-kit/ink-renderer",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Terminal rendering engine extracted from Claude Code — React reconciler + Yoga layout + TTY output",
   "license": "MIT",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
   "files": [
-    "dist"
+    "dist",
+    "README.md"
   ],
   "exports": {
     ".": {
@@ -26,7 +27,6 @@
     "emoji-regex": "*",
     "get-east-asian-width": "*",
     "indent-string": "*",
-    "lodash-es": "*",
     "semver": "*",
     "signal-exit": "*",
     "stack-utils": "*",
@@ -35,13 +35,14 @@
     "type-fest": "*",
     "usehooks-ts": "*",
     "wrap-ansi": "*",
-    "@claude-code-kit/shared": "0.1.0"
+    "@claude-code-kit/shared": "0.2.0"
   },
   "peerDependencies": {
     "react": ">=18.0.0",
     "react-reconciler": ">=0.29.0"
   },
   "devDependencies": {
+    "@types/react-reconciler": "0.33.0",
     "react": "*",
     "react-reconciler": "*",
     "tsup": "*",
@@ -70,6 +71,8 @@
     "access": "public"
   },
   "scripts": {
-    "build": "tsup"
+    "build": "tsup",
+    "typecheck": "tsc --noEmit -p tsconfig.json",
+    "lint": "biome check src/"
   }
 }