@visulima/tui 1.0.8 → 2.0.1

package/MIGRATION-GUIDE.md

@@ -0,0 +1,164 @@
+# Migration Guide
+
+This guide documents breaking changes and migration steps for the `@visulima/tui` package.
+
+## Version 2.0.0
+
+### Breaking Changes Summary
+
+- **Component library moved**: every non-primitive component now lives in `@visulima/tui-kit`
+- **`ws` removed**: the DevTools bridge uses the platform-native `WebSocket`
+- **Unchanged**: the renderer, every hook, and the layout/text primitives
+
+`@visulima/tui` keeps the runtime — the Ink-compatible renderer, the hooks, and the primitives every component is built on. Its direct dependencies drop from 13 to 3 (`@visulima/colorize`, `scheduler`, `yoga-layout`). If you only use `render`, `Box`, `Text` and the hooks, a dependency bump is the whole migration.
+
+### Component library moved to `@visulima/tui-kit`
+
+The 110+ higher-level components that lived under `@visulima/tui/components/*` moved to a new package, shipped both as an installable library and as a shadcn-style copy-paste registry.
+
+#### Before (v1.x)
+
+```ts
+import { Accordion } from "@visulima/tui/components/accordion";
+import { Spinner } from "@visulima/tui/components/spinner";
+```
+
+#### After (v2.x)
+
+```sh
+pnpm add @visulima/tui-kit
+```
+
+```ts
+import { Accordion } from "@visulima/tui-kit/accordion";
+import { Spinner } from "@visulima/tui-kit/spinner";
+```
+
+Or vendor the source into your own tree instead, with no runtime dependency on the library:
+
+```sh
+npx shadcn@latest add https://visulima.com/r/spinner.json
+```
+
+The CLI writes the component to `@/components/ui/*`, puts shared helpers in `@/lib/*`, and pulls in whatever that component depends on. The full index is at [`https://visulima.com/r/registry.json`](https://visulima.com/r/registry.json).
+
+#### Primitives that did **not** move
+
+These stay in `@visulima/tui` — leave their imports alone:
+
+`box` · `canvas` · `cursor` · `error-boundary` · `error-overview` · `newline` · `spacer` · `static` · `static-render` · `text` · `transform`
+
+```ts
+// Still correct after upgrading:
+import { Box } from "@visulima/tui/components/box";
+import { Text } from "@visulima/tui/components/text";
+```
+
+#### Automating the rewrite
+
+The rule is mechanical — `@visulima/tui/components/<x>` becomes `@visulima/tui-kit/<x>` unless `<x>` is one of the 11 primitives above. This rewrites every moved import in place; the negative lookahead is what skips the primitives:
+
+```sh
+# From your project root. Requires ripgrep + perl.
+PRIM='box|canvas|cursor|error-boundary|error-overview|newline|spacer|static|static-render|text|transform'
+rg -l "@visulima/tui/components/" --glob '*.{ts,tsx}' \
+  | xargs perl -i -pe "s{\@visulima/tui/components/(?!($PRIM)[\"'/])}{\@visulima/tui-kit/}g"
+```
+
+Without `perl`, two passes of your editor's regex find-and-replace do the same:
+
+1. Replace `@visulima/tui/components/` with `@visulima/tui-kit/` across the project.
+2. Undo the 11 that stayed: replace `@visulima/tui-kit/(box|canvas|cursor|error-boundary|error-overview|newline|spacer|static|static-render|text|transform)(["'/])` with `@visulima/tui/components/$1$2`. The trailing quote-or-slash matters — it stops `static` from also matching `static-render`, and `text` from matching `textarea`.
+
+Run your type-checker afterwards either way. An unresolved import is a compile error, so nothing can rewrite silently wrong.
+
+### `ws` is no longer an optional peer
+
+`ws` only ever backed the React DevTools bridge, which now uses the native `WebSocket` available on the supported Node versions (`^22.14.0 || >=24.10.0`).
+
+- If you installed `ws` explicitly to make DevTools work, remove it.
+- If you never used DevTools, this changes nothing.
+
+The rest of the dependency slimming needs no action — those libraries were either inlined or turned into optional peers you only pay for when using the feature that needs them.
+
+### Why This Change?
+
+The component library and the runtime have different audiences. Most consumers embed a renderer and a handful of primitives; they were paying for 110+ components and 13 dependencies to get them.
+
+Splitting the two means:
+
+- **A smaller install.** `@visulima/tui` now pulls 3 direct dependencies instead of 13.
+- **Two ways to consume components.** `@visulima/tui-kit` is installable like any package, or copy-pasteable through its shadcn registry so you can own and edit the source.
+- **Independent release cadence.** Component work no longer forces a version of the renderer, and vice versa.
+
+### Migration Steps
+
+1. Bump `@visulima/tui` to `2.0.0`.
+2. Add `@visulima/tui-kit` (or adopt the shadcn registry) if you use any non-primitive component.
+3. Run the import rewrite from [the section above](#automating-the-rewrite).
+4. Install the optional peers for any heavy component you use — see the table in the README (`BigText`, `Code`, `DiffView`, `Markdown`, `Table`).
+5. Drop any explicit `ws` dependency you added for DevTools.
+6. Run your type-checker.
+
+### Migration Issues & Solutions
+
+#### 1. A primitive import stopped resolving
+
+**Problem**: `Cannot find module '@visulima/tui-kit/text'` after a bulk find-and-replace.
+
+**Solution**: The 11 primitives stayed in `@visulima/tui`. A blind replace catches them too — use the scripted rewrite above, whose lookahead skips them, or fix them up in a second pass.
+
+#### 2. `static-render` or `textarea` rewritten to the wrong package
+
+**Problem**: The second-pass regex turned `@visulima/tui-kit/static-render` into `@visulima/tui/components/static-render`, or did the same to `textarea`.
+
+**Solution**: Anchor the pattern with the trailing quote-or-slash — `(box|…|text)(["'/])`. Without it, `static` also matches `static-render` and `text` also matches `textarea`, both of which genuinely moved to `@visulima/tui-kit`.
+
+#### 3. A component throws about a missing dependency at runtime
+
+**Problem**: `BigText`, `Code`, `DiffView`, `Markdown` or `Table` fails on a missing `cfonts`, `shiki`, `diff`, `marked` or `@visulima/tabular`.
+
+**Solution**: Those are optional peers, installed only by the consumers that use them. Add the peers listed for that component in the README.
+
+#### 4. DevTools stopped connecting
+
+**Problem**: The React DevTools bridge does not attach after upgrading.
+
+**Solution**: The bridge uses the native `WebSocket`, which needs Node `^22.14.0 || >=24.10.0`. Check your Node version; reinstalling `ws` will not help.
+
+### Verification Steps
+
+1. `pnpm type-check` (or `tsc --noEmit`) — an unresolved import is a compile error, so a mis-rewritten path cannot pass silently.
+2. `rg "@visulima/tui/components/" --glob '*.{ts,tsx}'` — every remaining hit should be one of the 11 primitives.
+3. Run your test suite, then the app itself: mount a screen and press a key to confirm input still routes.
+
+## Also in this release (not breaking)
+
+### `suspendTerminal()`
+
+Hand the terminal to a child process — an editor, a pager, a shell — and restore the render afterwards:
+
+```tsx
+import { useApp } from "@visulima/tui/hooks/use-app";
+
+const { suspendTerminal } = useApp();
+
+// Callback form — runs with the terminal released, then restores:
+await suspendTerminal(async () => {
+    await runEditor();
+});
+
+// Disposable form — restores on scope exit:
+{
+    await using _ = await suspendTerminal();
+    await runEditor();
+}
+```
+
+It releases the alternate screen and Kitty keyboard mode on suspend, and restores both with a full redraw on resume.
+
+### Keystrokes are no longer dropped on focus
+
+`useInput` subscribed from a passive effect, which React flushes on its own schedule — after the commit, and potentially after the next I/O callback. A key arriving in that window reached the app, found no handler subscribed, and was discarded with no queue and no retry. In practice a keystroke typed immediately after a component mounted or took focus could be silently lost.
+
+The subscription now happens in a layout effect, flushed synchronously with the commit, so a handler is always in place before the terminal can deliver the next key. No API change.

package/README.md

@@ -40,13 +40,16 @@
 
 Based on [ratatat](https://github.com/geoffmiller/ratatat) by Geoff Miller.
 
+> [!IMPORTANT]
+> **Breaking change.** The component library (~110 components) moved to the companion package [`@visulima/tui-kit`](https://visulima.com/docs/packages/tui-kit) — installable or copy-pasteable via its shadcn registry. `@visulima/tui` now ships only the renderer, hooks, and layout/text primitives, and its runtime dependencies dropped from 13 to 3. See the [migration guide](https://visulima.com/docs/packages/tui/migration).
+
 ## Features
 
 - **Faster than Ink** on mount (1.3-2.3x), competitive on rerender
 - **Drop-in Ink-compatible** React API
 - **Native Rust diff engine** via NAPI for high-throughput rendering
 - **React hooks** for input, focus, clipboard, mouse, scroll, animation, and window size
-- **Rich component library** - Box, Text, Spinner, Select, TextInput, Tabs, ScrollView, and more
+- **Layout & text primitives** - Box, Text, Static, Transform, and more; the full component library (inputs, charts, tables, 100+) ships in [`@visulima/tui-kit`](https://visulima.com/docs/packages/tui-kit)
 - **Cross-platform** native bindings (macOS, Linux glibc/musl, Windows x64/arm64)
 - **Server-side rendering** via `renderToString`
 - **Testing utilities** with mock streams and frame capture
@@ -67,12 +70,12 @@ pnpm add @visulima/tui react react-reconciler
 
 ### Component imports
 
-Every component lives at its own subpath under `@visulima/tui/components/<kebab-name>`. Hooks, `render`, and primitives stay on the bare `@visulima/tui` entry. This keeps the import graph small — you only pull in what you use, and heavy peer dependencies are loaded only when their component is imported.
+`@visulima/tui` provides `render`, the hooks, and the layout/text primitives (`Box`, `Text`, …) at `@visulima/tui/components/<kebab-name>`. The higher-level component library lives in [`@visulima/tui-kit`](https://visulima.com/docs/packages/tui-kit), imported from `@visulima/tui-kit/<kebab-name>`.
 
 ```tsx
 import { Box } from "@visulima/tui/components/box";
 import { Text } from "@visulima/tui/components/text";
-import { Spinner } from "@visulima/tui/components/spinner";
+import { Spinner } from "@visulima/tui-kit/spinner";
 import { useApp } from "@visulima/tui/hooks/use-app";
 import { useInput } from "@visulima/tui/hooks/use-input";
 import { render } from "@visulima/tui";
@@ -80,17 +83,17 @@ import { render } from "@visulima/tui";
 
 ### Optional peer dependencies
 
-A few components have heavy peer dependencies. Install only the peers for the components you use:
+A few `@visulima/tui-kit` components have heavy peer dependencies. Install only the peers for the components you use:
 
-| Component  | Subpath                              | Required peers                                                                                            |
-| ---------- | ------------------------------------ | --------------------------------------------------------------------------------------------------------- |
-| `BigText`  | `@visulima/tui/components/big-text`  | `cfonts`                                                                                                  |
-| `Code`     | `@visulima/tui/components/code`      | `shiki`, `@shikijs/langs`, `@shikijs/themes`                                                              |
-| `DiffView` | `@visulima/tui/components/diff-view` | `diff` (+ `shiki`, `@shikijs/langs`, `@shikijs/themes` for syntax highlighting)                           |
-| `Markdown` | `@visulima/tui/components/markdown`  | `marked` (+ `shiki`, `@shikijs/langs`, `@shikijs/themes` for code blocks; `@visulima/tabular` for tables) |
-| `Table`    | `@visulima/tui/components/table`     | `@visulima/tabular`                                                                                       |
+| Component  | Subpath                       | Required peers                                                                                            |
+| ---------- | ----------------------------- | --------------------------------------------------------------------------------------------------------- |
+| `BigText`  | `@visulima/tui-kit/big-text`  | `cfonts`                                                                                                  |
+| `Code`     | `@visulima/tui-kit/code`      | `shiki`, `@shikijs/langs`, `@shikijs/themes`                                                              |
+| `DiffView` | `@visulima/tui-kit/diff-view` | `diff` (+ `shiki`, `@shikijs/langs`, `@shikijs/themes` for syntax highlighting)                           |
+| `Markdown` | `@visulima/tui-kit/markdown`  | `marked` (+ `shiki`, `@shikijs/langs`, `@shikijs/themes` for code blocks; `@visulima/tabular` for tables) |
+| `Table`    | `@visulima/tui-kit/table`     | `@visulima/tabular`                                                                                       |
 
-To enable the in-app React DevTools overlay (`DEV=true`), install `react-devtools-core` and `ws`.
+To enable the in-app React DevTools overlay (`DEV=true`), install `react-devtools-core` (the bridge uses the native `WebSocket`, so no `ws` is needed).
 
 ## Quick Start
 

package/dist/components/box.d.ts

@@ -1,27 +1,26 @@
 import { ReactNode, PropsWithChildren, RefAttributes, ForwardRefExoticComponent } from 'react';
 import { Except } from 'type-fest';
-import { D as DOMElement } from "../packem_shared/dom.d-B4kXbaVY.js";
-import { S as Styles } from "../packem_shared/styles.d-cMo36xQz.js";
+import { D as DOMElement } from "../packem_shared/dom.d-CLGlidfI.js";
+import { S as Styles } from "../packem_shared/styles.d-CKGQFfm4.js";
 import 'yoga-layout';
-import "../packem_shared/cursor-helpers.d-BONB9tky.js";
+import "../ink/public/cursor.js";
 import '@visulima/colorize';
-import 'cli-boxes';
 type Props = Except<Styles, "textWrap"> & {
   /**
-  * Hide the element from screen readers.
-  */
+   * Hide the element from screen readers.
+   */
   readonly "aria-hidden"?: boolean;
   /**
-  * A label for the element for screen readers.
-  */
+   * A label for the element for screen readers.
+   */
   readonly "aria-label"?: string;
   /**
-  * The role of the element.
-  */
+   * The role of the element.
+   */
   readonly "aria-role"?: "button" | "checkbox" | "combobox" | "list" | "listbox" | "listitem" | "menu" | "menuitem" | "option" | "progressbar" | "radio" | "radiogroup" | "tab" | "tablist" | "table" | "textbox" | "timer" | "toolbar";
   /**
-  * The state of the element.
-  */
+   * The state of the element.
+   */
   readonly "aria-state"?: {
     readonly busy?: boolean;
     readonly checked?: boolean;
@@ -34,29 +33,29 @@ type Props = Except<Styles, "textWrap"> & {
     readonly selected?: boolean;
   };
   /**
-  * Whether this element is opaque (prevents rendering of covered content beneath it).
-  * Useful for performance optimization with layered content.
-  */
+   * Whether this element is opaque (prevents rendering of covered content beneath it).
+   * Useful for performance optimization with layered content.
+   */
   readonly opaque?: boolean;
   /**
-  * Whether to render a scrollbar for this scrollable element.
-  * Only applies when `overflow` is `'scroll'`. Defaults to `true`.
-  */
+   * Whether to render a scrollbar for this scrollable element.
+   * Only applies when `overflow` is `'scroll'`. Defaults to `true`.
+   */
   readonly scrollbar?: boolean;
   /**
-  * Makes this element sticky within its scroll container.
-  * - `true` or `'top'`: pinned to the top during scroll
-  * - `'bottom'`: pinned to the bottom during scroll
-  */
+   * Makes this element sticky within its scroll container.
+   * - `true` or `'top'`: pinned to the top during scroll
+   * - `'bottom'`: pinned to the bottom during scroll
+   */
   readonly sticky?: boolean | "top" | "bottom";
   /**
-  * Alternate content to render when this element is in its sticky (pinned) state.
-  * Only applies when `sticky` is set. When omitted, the normal children are used.
-  */
+   * Alternate content to render when this element is in its sticky (pinned) state.
+   * Only applies when `sticky` is set. When omitted, the normal children are used.
+   */
   readonly stickyChildren?: ReactNode;
 };
 /**
-* `&lt;Box>` is an essential Ink component to build your layout. It's like `&lt;div style="display: flex">` in the browser.
-*/
+ * `&lt;Box>` is an essential Ink component to build your layout. It's like `&lt;div style="display: flex">` in the browser.
+ */
 declare const Box: ForwardRefExoticComponent<PropsWithChildren<Props> & RefAttributes<DOMElement>>;
 export { Box, type Props as BoxProps, Props, Box as default };

package/dist/components/canvas.d.ts

@@ -1,44 +1,39 @@
 import { ReactElement } from 'react';
-import { C as CanvasContext } from "../packem_shared/buffer.d-EJkZr8uH.js";
-export type { a as CanvasColor, b as CellStyle } from "../packem_shared/buffer.d-EJkZr8uH.js";
+import { C as CanvasContext } from "../packem_shared/buffer.d-CttIC480.js";
+export type { a as CanvasColor, b as CellStyle } from "../packem_shared/buffer.d-CttIC480.js";
 type Props = {
   /**
-  * Imperative draw callback. Mutates the underlying typed-array buffer via
-  * the provided `CanvasContext`. Runs in a `useMemo` keyed by `version` —
-  * pass a stable reference (or hash) so the canvas only re-renders when
-  * the input data truly changes.
-  */
+   * Imperative draw callback. Mutates the underlying typed-array buffer via
+   * the provided `CanvasContext`. Runs in a `useMemo` keyed by `version` —
+   * pass a stable reference (or hash) so the canvas only re-renders when
+   * the input data truly changes.
+   */
   readonly draw: (context: CanvasContext) => void;
   /**
-  * Number of rows (character cells vertically).
-  */
+   * Number of rows (character cells vertically).
+   */
   readonly height: number;
   /**
-  * Invalidation key — required so the memoization contract is explicit.
-  * Re-runs `draw` and re-serializes only the rows the draw callback
-  * dirtied. Pass the data you render (or a hash of it). Use a stable
-  * value (e.g. a counter) when you intentionally want to redraw on
-  * every render.
-  */
+   * Invalidation key — required so the memoization contract is explicit.
+   * Re-runs `draw` and re-serializes only the rows the draw callback
+   * dirtied. Pass the data you render (or a hash of it). Use a stable
+   * value (e.g. a counter) when you intentionally want to redraw on
+   * every render.
+   */
   readonly version: unknown;
   /**
-  * Number of columns (character cells horizontally).
-  */
+   * Number of columns (character cells horizontally).
+   */
   readonly width: number;
 };
 /**
-* A fixed-size cell grid backed by typed arrays. Use the imperative `draw`
-* callback to paint. The canvas emits one `Text` child per row (not per cell)
-* and caches the ANSI output of each row: only rows marked dirty by the last
-* draw pass are re-serialized, and only when `version` changes.
-*
-* This is the foundation for chart/grid components that need more layout
-* control than `Text` alone.
-*/
-declare function Canvas({
-  draw,
-  height,
-  version,
-  width
-}: Props): ReactElement;
+ * A fixed-size cell grid backed by typed arrays. Use the imperative `draw`
+ * callback to paint. The canvas emits one `Text` child per row (not per cell)
+ * and caches the ANSI output of each row: only rows marked dirty by the last
+ * draw pass are re-serialized, and only when `version` changes.
+ *
+ * This is the foundation for chart/grid components that need more layout
+ * control than `Text` alone.
+ */
+declare function Canvas({ draw, height, version, width }: Props): ReactElement;
 export { Canvas, type CanvasContext, type Props as CanvasProps, Props, Canvas as default };

package/dist/components/canvas.js

@@ -1 +1 @@
-import{jsx as $}from"react/jsx-runtime";import{useRef as k,useMemo as _,Fragment as j}from"react";import{a as D}from"../packem_shared/colorize-DU4YZkp3.js";import{Box as z}from"./box.js";import{Text as E}from"./text.js";const T=Math.trunc(1),I=2,A=32,F=0,H=()=>{const c=new Map,r=[void 0];return{decode:l=>r[l],encode:l=>{if(l===void 0)return F;const h=typeof l=="number"?`n:${l}`:`s:${l}`,u=c.get(h);if(u!==void 0)return u;const w=r.length;return r.push(l),c.set(h,w),w}}},C=[9601,9602,9603,9604,9605,9606,9607,9608],S=[9615,9614,9613,9612,9611,9610,9609,9608],U=9608,L=c=>{if(!c)return 0;let r=0;return c.bold&&(r|=T),c.dim&&(r|=I),r},P=c=>typeof c=="number"?c:c.codePointAt(0)??A,O=(c,r)=>{const l=Math.max(0,c*r),h=new Uint32Array(l),u=new Uint32Array(l),w=new Int32Array(l),x=new Int32Array(l),y=new Uint8Array(r),{decode:p,encode:m}=H();h.fill(A);const b=n=>{n>=0&&n<r&&(y[n]=1)},g=(n,t,s,i)=>{if(n<0||n>=c||t<0||t>=r)return;const e=t*c+n,d=P(s),a=m(i?.color),o=m(i?.background),f=L(i);h[e]===d&&u[e]===f&&w[e]===a&&x[e]===o||(h[e]=d,u[e]=f,w[e]=a,x[e]=o,y[t]=1)};return{bg:x,chars:h,colorDecoder:p,context:{clear:()=>{h.fill(A),u.fill(0),w.fill(0),x.fill(0),y.fill(1)},drawHBar:(n,t,s,i,e)=>{if(s<=0||t<0||t>=r)return;const d=Math.max(0,Math.min(1,i)),a=s*S.length,o=Math.round(d*a),f=Math.floor(o/S.length),B=o%S.length;for(let M=0;M<s;M+=1){const v=n+M;M<f?g(v,t,U,e):M===f&&B>0?g(v,t,S[B-1],e):g(v,t,A,e)}b(t)},drawRect:(n,t,s,i,e,d)=>{if(s<=0||i<=0)return;const a=P(e);for(let o=0;o<i;o+=1){for(let f=0;f<s;f+=1)g(n+f,t+o,a,d);b(t+o)}},drawText:(n,t,s,i)=>{if(t<0||t>=r||s.length===0)return;let e=0;for(const d of s)g(n+e,t,d,i),e+=1;b(t)},drawVBar:(n,t,s,i,e)=>{if(s<=0||n<0||n>=c)return;const d=Math.max(0,Math.min(1,i)),a=s*C.length,o=Math.round(d*a),f=Math.floor(o/C.length),B=o%C.length;for(let M=0;M<s;M+=1){const v=s-M-1,R=t+M;v<f?g(n,R,U,e):v===f&&B>0?g(n,R,C[B-1],e):g(n,R,A,e),b(R)}},height:r,setCell:g,width:c},dirty:y,fg:w,height:r,styles:u,width:c}},V=(c,r)=>{const{bg:l,chars:h,colorDecoder:u,fg:w,styles:x,width:y}=c,p=r*y;let m="",b=0,g=x[p],n=w[p],t=l[p];const s=i=>{let e="";for(let f=b;f<i;f+=1)e+=String.fromCodePoint(h[p+f]);const d=u(n),a=u(t);let o=e;d!==void 0&&(o=D(o,typeof d=="number"?String(d):d,"foreground")),a!==void 0&&(o=D(o,typeof a=="number"?String(a):a,"background")),(g&T)!==0&&(o=`\x1B[1m${o}\x1B[22m`),(g&I)!==0&&(o=`\x1B[2m${o}\x1B[22m`),m+=o};for(let i=1;i<y;i+=1){const e=x[p+i],d=w[p+i],a=l[p+i];(e!==g||d!==n||a!==t)&&(s(i),b=i,g=e,n=d,t=a)}return s(y),m};function Q({draw:c,height:r,version:l,width:h}){const u=k(void 0),w=k(void 0);(u.current?.width!==h||u.current.height!==r)&&(u.current=O(h,r),w.current={hasRendered:!1,lines:Array.from({length:r}).fill("")});const x=u.current,y=w.current,p=_(()=>{c(x.context);for(let m=0;m<x.height;m+=1)y.hasRendered&&x.dirty[m]===0||(y.lines[m]=V(x,m),x.dirty[m]=0);return y.hasRendered=!0,[...y.lines]},[l,h,r]);return $(z,{flexDirection:"column",flexShrink:0,height:r,width:h,children:p.map((m,b)=>$(j,{children:$(E,{wrap:"truncate-end",children:m})},b))})}export{Q as Canvas,Q as default};
+import{jsx as a}from"react/jsx-runtime";import{useRef as d,useMemo as f,Fragment as m}from"react";import{createCanvasBuffer as p,serializeRow as x}from"../packem_shared/createCanvasBuffer-CL6sAM-A.js";import{Box as g}from"./box.js";import{Text as w}from"./text.js";function C({draw:h,height:r,version:c,width:n}){const i=d(void 0),s=d(void 0);(i.current?.width!==n||i.current.height!==r)&&(i.current=p(n,r),s.current={hasRendered:!1,lines:Array.from({length:r}).fill("")});const t=i.current,o=s.current,l=f(()=>{h(t.context);for(let e=0;e<t.height;e+=1)o.hasRendered&&t.dirty[e]===0||(o.lines[e]=x(t,e),t.dirty[e]=0);return o.hasRendered=!0,[...o.lines]},[c,n,r]);return a(g,{flexDirection:"column",flexShrink:0,height:r,width:n,children:l.map((e,u)=>a(m,{children:a(w,{wrap:"truncate-end",children:e})},u))})}export{C as Canvas,C as default};

package/dist/components/cursor.d.ts

@@ -1,62 +1,56 @@
 import React, { RefObject } from 'react';
-import { C as CursorShape } from "../packem_shared/cursor-helpers.d-BONB9tky.js";
-import { D as DOMElement } from "../packem_shared/dom.d-B4kXbaVY.js";
+import { CursorShape } from "../ink/public/cursor.js";
+import { D as DOMElement } from "../packem_shared/dom.d-CLGlidfI.js";
 import 'yoga-layout';
 import '@visulima/colorize';
-import 'cli-boxes';
-import "../packem_shared/styles.d-cMo36xQz.js";
+import "../packem_shared/styles.d-CKGQFfm4.js";
 import 'type-fest';
 type Props = {
   /**
-  * Optional reference to anchor cursor coordinates to a different element.
-  * If omitted, `<Cursor>` uses the parent container as anchor.
-  * If `anchorRef` is set but currently unresolved, Ink hides the cursor for that frame.
-  * If multiple `<Cursor>` components are rendered in one frame, the last rendered one controls the terminal cursor position.
-  */
+   * Optional reference to anchor cursor coordinates to a different element.
+   * If omitted, `<Cursor>` uses the parent container as anchor.
+   * If `anchorRef` is set but currently unresolved, Ink hides the cursor for that frame.
+   * If multiple `<Cursor>` components are rendered in one frame, the last rendered one controls the terminal cursor position.
+   */
   readonly anchorRef?: RefObject<DOMElement | null>;
   /**
-  * Optional cursor shape (DECSCUSR). The shape is restored to the terminal
-  * default on unmount, SIGINT, and unhandled React tree throws, so the
-  * parent shell never inherits a leaked shape.
-  *
-  * Steady variants are non-blinking; `blinking-*` variants opt into blink.
-  */
+   * Optional cursor shape (DECSCUSR). The shape is restored to the terminal
+   * default on unmount, SIGINT, and unhandled React tree throws, so the
+   * parent shell never inherits a leaked shape.
+   *
+   * Steady variants are non-blinking; `blinking-*` variants opt into blink.
+   */
   readonly shape?: CursorShape;
   /**
-  * Horizontal offset from anchor content origin.
-  */
+   * Horizontal offset from anchor content origin.
+   */
   readonly x?: number;
   /**
-  * Vertical offset from anchor content origin.
-  */
+   * Vertical offset from anchor content origin.
+   */
   readonly y?: number;
 };
 /**
-* Declaratively position the terminal cursor.
-* `&lt;Cursor>` must not be rendered inside `&lt;Text>`.
-*
-* **Inline mode** (no props): place `&lt;Cursor />` after a `&lt;Text>` node and the
-* cursor appears where that text ended — even when text wraps across lines.
-*
-* **Anchor mode**: pass `anchorRef` and/or `x`/`y` to position relative to
-* another element's content origin.
-* @example Inline mode — cursor follows text naturally
-* ```jsx
-* <Box>
-*     <Text>{prompt + value}</Text>
-*     <Cursor />
-* </Box>
-* ```
-* @example Anchor mode — offset from a referenced element
-* ```jsx
-* <Box ref={ref} />
-* <Cursor anchorRef={ref} x={5} />
-* ```
-*/
-declare function Cursor({
-  anchorRef,
-  shape,
-  x,
-  y
-}: Props): React.JSX.Element;
+ * Declaratively position the terminal cursor.
+ * `&lt;Cursor>` must not be rendered inside `&lt;Text>`.
+ *
+ * **Inline mode** (no props): place `&lt;Cursor />` after a `&lt;Text>` node and the
+ * cursor appears where that text ended — even when text wraps across lines.
+ *
+ * **Anchor mode**: pass `anchorRef` and/or `x`/`y` to position relative to
+ * another element's content origin.
+ * @example Inline mode — cursor follows text naturally
+ * ```jsx
+ * <Box>
+ *     <Text>{prompt + value}</Text>
+ *     <Cursor />
+ * </Box>
+ * ```
+ * @example Anchor mode — offset from a referenced element
+ * ```jsx
+ * <Box ref={ref} />
+ * <Cursor anchorRef={ref} x={5} />
+ * ```
+ */
+declare function Cursor({ anchorRef, shape, x, y }: Props): React.JSX.Element;
 export { Cursor, type Props as CursorProps, Props, Cursor as default };

package/dist/components/error-boundary.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode, PureComponent } from 'react';
+type Props = {
+  readonly children: ReactNode;
+  readonly onError: (error: Error) => void;
+};
+type State = {
+  readonly error?: Error;
+};
+declare class ErrorBoundary extends PureComponent<Props, State> {
+  static displayName: string;
+  static getDerivedStateFromError(error: Error): State;
+  override state: State;
+  override componentDidCatch(error: Error): void;
+  override render(): ReactNode;
+}
+export { type Props as ErrorBoundaryProps, ErrorBoundary as default };

package/dist/components/error-boundary.js

@@ -0,0 +1 @@
+import{jsx as t}from"react/jsx-runtime";import{PureComponent as e}from"react";import o from"./error-overview.js";class p extends e{static displayName="InternalErrorBoundary";static getDerivedStateFromError(r){return{error:r}}state={error:void 0};componentDidCatch(r){this.props.onError(r)}render(){return this.state.error?t(o,{error:this.state.error}):this.props.children}}export{p as default};

package/dist/components/error-overview.d.ts

@@ -0,0 +1,6 @@
+import { ReactElement } from 'react';
+type Props = {
+  readonly error: Error;
+};
+declare function ErrorOverview({ error }: Props): ReactElement;
+export { type Props as ErrorOverviewProps, ErrorOverview as default };

package/dist/components/error-overview.js

@@ -0,0 +1 @@
+import{createRequire as $}from"node:module";import{jsxs as c,jsx as s}from"react/jsx-runtime";import{parseStacktrace as C}from"@visulima/error/stacktrace";import{Box as a}from"./box.js";import{Text as d}from"./text.js";let _;const w=n=>(_??=$(import.meta.url))(n),m=typeof globalThis<"u"&&typeof globalThis.process<"u"?globalThis.process:process,b=n=>{if(typeof m<"u"&&m.versions&&m.versions.node){const[r,t]=m.versions.node.split(".").map(Number);if(r>22||r===22&&t>=3||r===20&&t>=16)return m.getBuiltinModule(n)}return w(n)},{existsSync:v,readFileSync:x}=b("node:fs"),{cwd:y}=m,T=(n,r=2)=>n.replace(/^\t+/gm,t=>" ".repeat(t.length*r)),j=(n,r)=>{const t=[],u=n-r,o=n+r;for(let l=u;l<=o;l++)t.push(l);return t},k=(n,r,t={})=>{var u;if(typeof n!="string")throw new TypeError("Source code is missing.");if(!r||r<1)throw new TypeError("Line number must start from `1`.");const o=T(n).split(/\r?\n/);if(!(r>o.length))return j(r,(u=t.around)!==null&&u!==void 0?u:3).filter(l=>o[l-1]!==void 0).map(l=>({line:l,value:o[l-1]}))},g=n=>{if(!n)return n;const r=y();return n.replace(`file://${r}/`,"").replace(`${r}/`,"")};function B({error:n}){const r=C(n),t=new Map,u=r.map(e=>{const i=!e.methodName&&!e.file?`raw:${e.raw}`:`${g(e.file)??""}:${e.line}:${e.column}:${e.methodName??""}`,f=t.get(i)??0;return t.set(i,f+1),{key:`${i}#${f}`,trace:e}}),o=r[0],l=g(o?.file);let h,p=0;if(l&&o?.line&&v(l)){const e=x(l,"utf8");if(h=k(e,o.line),h)for(const{line:i}of h)p=Math.max(p,String(i).length)}return c(a,{flexDirection:"column",padding:1,children:[c(a,{children:[c(d,{backgroundColor:"red",color:"white",children:[" ","ERROR"," "]}),c(d,{children:[" ",n.message]})]}),o&&l?s(a,{marginTop:1,children:c(d,{dimColor:!0,children:[l,":",o.line,":",o.column]})}):null,o&&h?s(a,{flexDirection:"column",marginTop:1,children:h.map(({line:e,value:i})=>c(a,{children:[s(a,{width:p+1,children:c(d,{"aria-label":e===o.line?`Line ${e}, error`:`Line ${e}`,backgroundColor:e===o.line?"red":void 0,color:e===o.line?"white":void 0,dimColor:e!==o.line,children:[String(e).padStart(p," "),":"]})}),s(d,{backgroundColor:e===o.line?"red":void 0,color:e===o.line?"white":void 0,children:` ${i}`})]},`excerpt-${e}`))}):null,r.length>0?s(a,{flexDirection:"column",marginTop:1,children:u.map(({key:e,trace:i})=>{const f=g(i.file)??"";return!i.methodName&&!i.file?c(a,{children:[s(d,{dimColor:!0,children:"- "}),s(d,{bold:!0,dimColor:!0,children:i.raw})]},e):c(a,{children:[s(d,{dimColor:!0,children:"- "}),s(d,{bold:!0,dimColor:!0,children:i.methodName??"<anonymous>"}),c(d,{"aria-label":`at ${f} line ${i.line} column ${i.column}`,color:"gray",dimColor:!0,children:[" ","(",f,":",i.line,":",i.column,")"]})]},e)})}):null]})}export{B as default};

package/dist/components/newline.d.ts

@@ -1,15 +1,13 @@
 import { ReactElement } from 'react';
 type Props = {
   /**
-  * Number of newlines to insert.
-  * @default 1
-  */
+   * Number of newlines to insert.
+   * @default 1
+   */
   readonly count?: number;
 };
 /**
-* Adds one or more newline (`\n`) characters. Must be used within `<Text>` components.
-*/
-declare function Newline({
-  count
-}: Props): ReactElement;
+ * Adds one or more newline (`\n`) characters. Must be used within `<Text>` components.
+ */
+declare function Newline({ count }: Props): ReactElement;
 export { Newline, type Props as NewlineProps, Props, Newline as default };

package/dist/components/spacer.d.ts

@@ -1,8 +1,8 @@
 import { ReactElement } from 'react';
 /**
-* A flexible space that expands along the major axis of its containing layout.
-*
-* It's useful as a shortcut for filling all the available space between elements.
-*/
+ * A flexible space that expands along the major axis of its containing layout.
+ *
+ * It's useful as a shortcut for filling all the available space between elements.
+ */
 declare function Spacer(): ReactElement;
 export { Spacer, Spacer as default };