@opentui/solid 0.1.101 → 0.1.102

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+export function writeSolidToScrollback(renderer: any, node: any, options?: {}): void;
 export function useTimeline(options?: {}): Timeline;
 export function useTerminalDimensions(): import("solid-js").Accessor<{
     width: any;
@@ -57,6 +58,15 @@ export var createTextNode: any;
 export function createSolidSlotRegistry(renderer: any, context: any, options?: {}): import("@opentui/core").SlotRegistry<any, object, any>;
 export function createSlotNode(): SlotRenderable;
 export function createSlot(registry: any, options?: {}): (props: any) => any;
+export function createScrollbackWriter(node: any, options?: {}): (ctx: any) => {
+    root: BoxRenderable;
+    width: number;
+    height: number;
+    rowColumns: any;
+    startOnNewLine: any;
+    trailingNewline: any;
+    teardown: () => void;
+};
 export var createElement: any;
 export function createDynamic(component: any, props: any): import("solid-js").Accessor<any>;
 declare var createComponent2: typeof createComponent;

package/index.d.ts

@@ -13,6 +13,7 @@ export declare const testRender: (node: () => JSX.Element, renderConfig?: TestRe
 }>;
 export * from "./src/reconciler.js";
 export * from "./src/elements/index.js";
+export * from "./src/scrollback.js";
 export * from "./src/time-to-first-draw.js";
 export * from "./src/plugins/slot.js";
 export * from "./src/types/elements.js";

package/index.js

@@ -951,6 +951,155 @@ function extend(objects) {
 function getComponentCatalogue() {
   return componentCatalogue;
 }
+// src/scrollback.ts
+import {
+  BoxRenderable as BoxRenderable2,
+  RootRenderable
+} from "@opentui/core";
+import { createSignal as createSignal2 } from "solid-js";
+var solidScrollbackRootCounter = 0;
+var MAX_AUTO_HEIGHT_PASSES = 4;
+function normalizeSnapshotDimension(value, axis) {
+  if (value === undefined) {
+    return;
+  }
+  if (!Number.isFinite(value)) {
+    throw new Error(`createScrollbackWriter requires a finite ${axis}`);
+  }
+  return Math.max(1, Math.trunc(value));
+}
+function createSnapshotRendererValue(renderContext, root, width, height, firstLineOffset) {
+  const [snapshotWidth] = createSignal2(width);
+  const [snapshotHeight, setSnapshotHeight] = createSignal2(height);
+  const renderer = Object.create(renderContext);
+  let offset = firstLineOffset;
+  Object.defineProperties(renderer, {
+    root: {
+      value: root,
+      enumerable: true,
+      configurable: true
+    },
+    width: {
+      get: snapshotWidth,
+      enumerable: true,
+      configurable: true
+    },
+    height: {
+      get: snapshotHeight,
+      enumerable: true,
+      configurable: true
+    },
+    claimFirstLineOffset: {
+      value: () => {
+        const out = offset;
+        offset = 0;
+        return out;
+      },
+      enumerable: true,
+      configurable: true
+    }
+  });
+  return {
+    renderer,
+    getHeight: snapshotHeight,
+    setHeight(nextHeight) {
+      setSnapshotHeight(nextHeight);
+      renderer.emit("resize", snapshotWidth(), nextHeight);
+    }
+  };
+}
+function runLifecyclePasses(renderContext) {
+  for (const renderable of renderContext.getLifecyclePasses()) {
+    renderable.onLifecyclePass?.call(renderable);
+  }
+}
+function clearLifecyclePasses(renderContext) {
+  for (const renderable of [...renderContext.getLifecyclePasses()]) {
+    renderContext.unregisterLifecyclePass(renderable);
+  }
+}
+function measureSnapshotHeight(renderContext, root) {
+  const measureRoot = new RootRenderable(renderContext);
+  try {
+    measureRoot.add(root);
+    runLifecyclePasses(renderContext);
+    measureRoot.calculateLayout();
+    return Math.max(1, Math.trunc(root.getLayoutNode().getComputedLayout().height));
+  } finally {
+    if (root.parent === measureRoot) {
+      measureRoot.remove(root.id);
+    }
+    measureRoot.destroyRecursively();
+  }
+}
+function resolveSnapshotHeight(renderContext, root, snapshotRenderer) {
+  for (let pass = 0;pass < MAX_AUTO_HEIGHT_PASSES; pass++) {
+    const measuredHeight = measureSnapshotHeight(renderContext, root);
+    if (measuredHeight === snapshotRenderer.getHeight()) {
+      clearLifecyclePasses(renderContext);
+      return measuredHeight;
+    }
+    snapshotRenderer.setHeight(measuredHeight);
+  }
+  return measureSnapshotHeight(renderContext, root);
+}
+function createScrollbackWriter(node, options = {}) {
+  return (ctx) => {
+    const width = normalizeSnapshotDimension(options.width, "width") ?? Math.max(1, Math.trunc(ctx.width));
+    const height = normalizeSnapshotDimension(options.height, "height");
+    const startOnNewLine = options.startOnNewLine ?? true;
+    const firstLineWidth = !startOnNewLine && ctx.tailColumn > 0 && ctx.tailColumn < ctx.width ? Math.min(width, ctx.width - ctx.tailColumn) : width;
+    const firstLineOffset = width - firstLineWidth;
+    const root = new BoxRenderable2(ctx.renderContext, {
+      id: `solid-scrollback-root-${solidScrollbackRootCounter++}`,
+      position: "absolute",
+      left: 0,
+      top: 0,
+      width,
+      height: height ?? "auto",
+      border: false,
+      backgroundColor: "transparent",
+      shouldFill: false,
+      flexDirection: "column"
+    });
+    const snapshotRenderer = createSnapshotRendererValue(ctx.renderContext, root, width, height ?? Math.max(1, ctx.renderContext.height), firstLineOffset);
+    let dispose;
+    let disposed = false;
+    const teardown = () => {
+      if (disposed) {
+        return;
+      }
+      disposed = true;
+      dispose?.();
+    };
+    try {
+      dispose = _render(() => createComponent2(RendererContext.Provider, {
+        get value() {
+          return snapshotRenderer.renderer;
+        },
+        get children() {
+          return node(ctx);
+        }
+      }), root);
+      return {
+        root,
+        width,
+        height: height ?? resolveSnapshotHeight(ctx.renderContext, root, snapshotRenderer),
+        rowColumns: options.rowColumns,
+        startOnNewLine,
+        trailingNewline: options.trailingNewline,
+        teardown
+      };
+    } catch (error) {
+      teardown();
+      root.destroyRecursively();
+      throw error;
+    }
+  };
+}
+function writeSolidToScrollback(renderer, node, options = {}) {
+  renderer.writeToScrollback(createScrollbackWriter(node, options));
+}
 // src/time-to-first-draw.tsx
 import { TimeToFirstDrawRenderable } from "@opentui/core";
 extend({
@@ -965,7 +1114,7 @@ var TimeToFirstDraw = (props) => {
 };
 // src/plugins/slot.tsx
 import { createSlotRegistry } from "@opentui/core";
-import { children, createMemo as createMemo3, createSignal as createSignal2, ErrorBoundary, For, onCleanup as onCleanup3, splitProps as splitProps2 } from "solid-js";
+import { children, createMemo as createMemo3, createSignal as createSignal3, ErrorBoundary, For, onCleanup as onCleanup3, splitProps as splitProps2 } from "solid-js";
 var EMPTY_ENTRY_IDS = [];
 function createSolidSlotRegistry(renderer, context, options = {}) {
   return createSlotRegistry(renderer, "solid:slot-registry", context, options);
@@ -984,7 +1133,7 @@ function Slot(props) {
   const [local, slotProps] = splitProps2(props, ["registry", "name", "mode", "children", "pluginFailurePlaceholder"]);
   const registry = () => local.registry;
   const pluginFailurePlaceholder = () => local.pluginFailurePlaceholder;
-  const [version, setVersion] = createSignal2(0);
+  const [version, setVersion] = createSignal3(0);
   let queued = false;
   let disposed = false;
   const unsubscribe = registry().subscribe(() => {
@@ -1202,6 +1351,7 @@ var testRender = async (node, renderConfig = {}) => {
   return testSetup;
 };
 export {
+  writeSolidToScrollback,
   useTimeline,
   useTerminalDimensions,
   useSelectionHandler,
@@ -1229,6 +1379,7 @@ export {
   createSolidSlotRegistry,
   createSlotNode,
   createSlot,
+  createScrollbackWriter,
   createElement,
   createDynamic,
   createComponent2 as createComponent,

package/package.json

@@ -4,7 +4,7 @@
   "main": "index.js",
   "types": "index.d.ts",
   "type": "module",
-  "version": "0.1.101",
+  "version": "0.1.102",
   "description": "SolidJS renderer for OpenTUI",
   "license": "MIT",
   "repository": {
@@ -35,7 +35,7 @@
   "dependencies": {
     "@babel/core": "7.28.0",
     "@babel/preset-typescript": "7.27.1",
-    "@opentui/core": "0.1.101",
+    "@opentui/core": "0.1.102",
     "babel-plugin-module-resolver": "5.0.2",
     "babel-preset-solid": "1.9.10",
     "entities": "7.0.1",

package/src/scrollback.d.ts

@@ -0,0 +1,12 @@
+import { type CliRenderer, type ScrollbackRenderContext, type ScrollbackWriter } from "@opentui/core";
+import { type JSX } from "solid-js";
+export interface SolidScrollbackWriterOptions {
+    width?: number;
+    height?: number;
+    rowColumns?: number;
+    startOnNewLine?: boolean;
+    trailingNewline?: boolean;
+}
+export type SolidScrollbackNode = (ctx: ScrollbackRenderContext) => JSX.Element;
+export declare function createScrollbackWriter(node: SolidScrollbackNode, options?: SolidScrollbackWriterOptions): ScrollbackWriter;
+export declare function writeSolidToScrollback(renderer: CliRenderer, node: SolidScrollbackNode, options?: SolidScrollbackWriterOptions): void;