@ashley-shrok/viewmodel-shell 0.4.8 → 0.4.9

package/dist/tui.d.ts

@@ -62,12 +62,18 @@ export declare class TuiAdapter implements Adapter {
      *  interactive TTY; "content" = legacy intrinsic-content size, no
      *  alt-screen (the opt-out escape hatch — pre-0.4.5 behavior). */
     private readonly viewport;
+    /** `sidebar` rail width as a fraction of the terminal (fill path only).
+     *  Default 1/3; clamped to a sane [0.15, 0.6] so a bad value can't break
+     *  the layout. Adapter-level styling knob (NOT wire — appearance, not
+     *  arrangement). */
+    private readonly sidebarFraction;
     /** Set once ESC[?1049h was written, so dispose() emits the paired
      *  ESC[?1049l exactly once (idempotent restore — same discipline as the
      *  cursor restore Ink does on unmount). */
     private altEntered;
     constructor(opts?: {
         viewport?: "fill" | "content";
+        sidebarFraction?: number;
     });
     /** Injected by tui-cli.ts: lets a keyboard Ctrl-C (which, under Ink's raw
      *  mode, is delivered as input 0x03 and never raises SIGINT) reach the

package/dist/tui.js

@@ -990,6 +990,7 @@ function App(props) {
         interactive,
         fill: fillViewport,
         fillCols: fillViewport ? vp.cols : undefined,
+        railFraction: props.railFraction,
         draft: (k) => draftFor(k),
         onFieldChange: (k, v) => setDraft((s) => ({ ...s, [k]: v })),
         onFieldSubmit,
@@ -1046,12 +1047,19 @@ export class TuiAdapter {
      *  interactive TTY; "content" = legacy intrinsic-content size, no
      *  alt-screen (the opt-out escape hatch — pre-0.4.5 behavior). */
     viewport;
+    /** `sidebar` rail width as a fraction of the terminal (fill path only).
+     *  Default 1/3; clamped to a sane [0.15, 0.6] so a bad value can't break
+     *  the layout. Adapter-level styling knob (NOT wire — appearance, not
+     *  arrangement). */
+    sidebarFraction;
     /** Set once ESC[?1049h was written, so dispose() emits the paired
      *  ESC[?1049l exactly once (idempotent restore — same discipline as the
      *  cursor restore Ink does on unmount). */
     altEntered = false;
     constructor(opts) {
         this.viewport = opts?.viewport ?? "fill";
+        const f = opts?.sidebarFraction ?? 1 / 3;
+        this.sidebarFraction = Math.min(0.6, Math.max(0.15, f));
     }
     /** Injected by tui-cli.ts: lets a keyboard Ctrl-C (which, under Ink's raw
      *  mode, is delivered as input 0x03 and never raises SIGINT) reach the
@@ -1107,7 +1115,7 @@ export class TuiAdapter {
     }
     /** The interactive element used by render() and by interaction unit tests. */
     createApp(vm, onAction, opts) {
-        return (_jsx(App, { vm: vm, onAction: onAction, requestExit: opts?.requestExit ?? this.requestExit, interstitial: this.interstitial, viewport: this.viewport, renderWith: (v, rctx) => this.renderNode(v, 0, "comfortable", undefined, rctx) }));
+        return (_jsx(App, { vm: vm, onAction: onAction, requestExit: opts?.requestExit ?? this.requestExit, interstitial: this.interstitial, viewport: this.viewport, railFraction: this.sidebarFraction, renderWith: (v, rctx) => this.renderNode(v, 0, "comfortable", undefined, rctx) }));
     }
     /** Render a full-screen loud notice through the SINGLE existing Ink instance
      *  (never a 2nd inkRender, never a raw stdout write that would corrupt Ink's
@@ -1275,7 +1283,15 @@ export class TuiAdapter {
                 // ORIGINAL flex props, byte-identical.
                 const cols = topLevel && rctx.fillCols ? rctx.fillCols : 0;
                 const filling = cols > 0;
-                const RAIL = 24;
+                // 0.4.9 — PROPORTIONAL rail (default 1/3, clamped [24,56]) instead of
+                // a hardcoded 24 (unusable on wide terminals: 24/146 ≈ 16%). Never
+                // below the old 24 on small terminals; capped so ultra-wide keeps the
+                // detail pane dominant. Tunable via `new TuiAdapter({ sidebarFraction })`.
+                // Only the filling branches use RAIL; the non-fill path keeps the
+                // literal flexBasis:24/minWidth:18 (byte-identical).
+                const RAIL = filling
+                    ? Math.min(56, Math.max(24, Math.round(cols * (rctx.railFraction ?? 1 / 3))))
+                    : 24;
                 const g = sp.gap || 1;
                 const mw = Math.max(1, cols - RAIL - g);
                 if (rest.length === 0) {
@@ -1284,7 +1300,11 @@ export class TuiAdapter {
                     // numeric width (a default-row box would not width-stretch it).
                     _jsx(Box, { flexDirection: "column", flexShrink: 0, ...fillW, children: rail })) : (_jsx(Box, { flexShrink: 0, flexBasis: 24, minWidth: 18, children: rail }));
                 }
-                return (_jsxs(Box, { flexDirection: "row", gap: g, ...fillW, children: [filling ? (_jsx(Box, { flexShrink: 0, width: RAIL, children: rail })) : (_jsx(Box, { flexShrink: 0, flexBasis: 24, minWidth: 18, children: rail })), filling ? (
+                return (_jsxs(Box, { flexDirection: "row", gap: g, ...fillW, children: [filling ? (
+                        // flexDirection:column ⇒ the rail's section align-stretches to
+                        // the numeric RAIL width (a default-row box sizes it to content
+                        // — same lesson as the single-child branch).
+                        _jsx(Box, { flexDirection: "column", flexShrink: 0, width: RAIL, children: rail })) : (_jsx(Box, { flexShrink: 0, flexBasis: 24, minWidth: 18, children: rail })), filling ? (
                         // Single numeric-width column directly holding the detail
                         // sections — exactly the `stack` shape the oracle proves scales
                         // (a card section align-stretches to a numeric-width parent).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ashley-shrok/viewmodel-shell",
-  "version": "0.4.8",
+  "version": "0.4.9",
   "description": "A server-driven UI framework where the wire format is structured enough that agents can build full-stack apps without ever opening a browser and all UI tests are pure unit tests with no browser runtime. Server returns a JSON tree of typed nodes; a thin TypeScript adapter renders it to DOM. Backend-agnostic — a .NET reference backend ships with the repo, but any language can produce the JSON contract.",
   "type": "module",
   "license": "MIT",