ink 3.2.0 → 4.1.0

package/build/render-node-to-output.js

@@ -1,15 +1,11 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const yoga_layout_prebuilt_1 = __importDefault(require("yoga-layout-prebuilt"));
-const widest_line_1 = __importDefault(require("widest-line"));
-const indent_string_1 = __importDefault(require("indent-string"));
-const wrap_text_1 = __importDefault(require("./wrap-text"));
-const get_max_width_1 = __importDefault(require("./get-max-width"));
-const squash_text_nodes_1 = __importDefault(require("./squash-text-nodes"));
-const render_border_1 = __importDefault(require("./render-border"));
+import widestLine from 'widest-line';
+import indentString from 'indent-string';
+// eslint-disable-next-line n/file-extension-in-import
+import Yoga from 'yoga-wasm-web/auto';
+import wrapText from './wrap-text.js';
+import getMaxWidth from './get-max-width.js';
+import squashTextNodes from './squash-text-nodes.js';
+import renderBorder from './render-border.js';
 // If parent container is `<Box>`, text nodes will be treated as separate nodes in
 // the tree and will have their own coordinates in the layout.
 // To ensure text nodes are aligned correctly, take X and Y of the first text node
@@ -17,25 +13,23 @@ const render_border_1 = __importDefault(require("./render-border"));
 // Only first node is taken into account, because other text nodes can't have margin or padding,
 // so their coordinates will be relative to the first node anyway
 const applyPaddingToText = (node, text) => {
-    var _a;
-    const yogaNode = (_a = node.childNodes[0]) === null || _a === void 0 ? void 0 : _a.yogaNode;
+    const yogaNode = node.childNodes[0]?.yogaNode;
     if (yogaNode) {
         const offsetX = yogaNode.getComputedLeft();
         const offsetY = yogaNode.getComputedTop();
-        text = '\n'.repeat(offsetY) + indent_string_1.default(text, offsetX);
+        text = '\n'.repeat(offsetY) + indentString(text, offsetX);
     }
     return text;
 };
 // After nodes are laid out, render each to output object, which later gets rendered to terminal
 const renderNodeToOutput = (node, output, options) => {
-    var _a;
     const { offsetX = 0, offsetY = 0, transformers = [], skipStaticElements } = options;
     if (skipStaticElements && node.internal_static) {
         return;
     }
     const { yogaNode } = node;
     if (yogaNode) {
-        if (yogaNode.getDisplay() === yoga_layout_prebuilt_1.default.DISPLAY_NONE) {
+        if (yogaNode.getDisplay() === Yoga.DISPLAY_NONE) {
             return;
         }
         // Left and top positions in Yoga are relative to their parent node
@@ -48,21 +42,44 @@ const renderNodeToOutput = (node, output, options) => {
             newTransformers = [node.internal_transform, ...transformers];
         }
         if (node.nodeName === 'ink-text') {
-            let text = squash_text_nodes_1.default(node);
+            let text = squashTextNodes(node);
             if (text.length > 0) {
-                const currentWidth = widest_line_1.default(text);
-                const maxWidth = get_max_width_1.default(yogaNode);
+                const currentWidth = widestLine(text);
+                const maxWidth = getMaxWidth(yogaNode);
                 if (currentWidth > maxWidth) {
-                    const textWrap = (_a = node.style.textWrap) !== null && _a !== void 0 ? _a : 'wrap';
-                    text = wrap_text_1.default(text, maxWidth, textWrap);
+                    const textWrap = node.style.textWrap ?? 'wrap';
+                    text = wrapText(text, maxWidth, textWrap);
                 }
                 text = applyPaddingToText(node, text);
                 output.write(x, y, text, { transformers: newTransformers });
             }
             return;
         }
+        let clipped = false;
         if (node.nodeName === 'ink-box') {
-            render_border_1.default(x, y, node, output);
+            renderBorder(x, y, node, output);
+            const clipHorizontally = node.style.overflowX === 'hidden';
+            const clipVertically = node.style.overflowY === 'hidden';
+            if (clipHorizontally || clipVertically) {
+                const x1 = clipHorizontally
+                    ? x + yogaNode.getComputedBorder(Yoga.EDGE_LEFT)
+                    : undefined;
+                const x2 = clipHorizontally
+                    ? x +
+                        yogaNode.getComputedWidth() -
+                        yogaNode.getComputedBorder(Yoga.EDGE_RIGHT)
+                    : undefined;
+                const y1 = clipVertically
+                    ? y + yogaNode.getComputedBorder(Yoga.EDGE_TOP)
+                    : undefined;
+                const y2 = clipVertically
+                    ? y +
+                        yogaNode.getComputedHeight() -
+                        yogaNode.getComputedBorder(Yoga.EDGE_BOTTOM)
+                    : undefined;
+                output.clip({ x1, x2, y1, y2 });
+                clipped = true;
+            }
         }
         if (node.nodeName === 'ink-root' || node.nodeName === 'ink-box') {
             for (const childNode of node.childNodes) {
@@ -73,8 +90,11 @@ const renderNodeToOutput = (node, output, options) => {
                     skipStaticElements
                 });
             }
+            if (clipped) {
+                output.unclip();
+            }
         }
     }
 };
-exports.default = renderNodeToOutput;
+export default renderNodeToOutput;
 //# sourceMappingURL=render-node-to-output.js.map

package/build/render-node-to-output.js.map

@@ -1 +1 @@
-{"version":3,"file":"render-node-to-output.js","sourceRoot":"","sources":["../src/render-node-to-output.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"render-node-to-output.js","sourceRoot":"","sources":["../src/render-node-to-output.ts"],"names":[],"mappings":"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"}

package/build/render.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="node" />
-import { ReactElement } from 'react';
-import Ink from './ink';
-export interface RenderOptions {
+/// <reference types="node" resolution-mode="require"/>
+import { type ReactElement } from 'react';
+import Ink from './ink.js';
+export type RenderOptions = {
     /**
      * Output stream where app will be rendered.
      *
@@ -37,8 +37,8 @@ export interface RenderOptions {
      * @default true
      */
     patchConsole?: boolean;
-}
-export interface Instance {
+};
+export type Instance = {
     /**
      * Replace previous root node with a new one or update props of the current root node.
      */
@@ -56,8 +56,8 @@ export interface Instance {
      * Clear output.
      */
     clear: () => void;
-}
-declare type RenderFunction = <Props, K extends NodeJS.WriteStream | RenderOptions>(tree: ReactElement<Props>, options?: K) => Instance;
+};
+type RenderFunction = <Props, K extends NodeJS.WriteStream | RenderOptions>(tree: ReactElement<Props>, options?: K) => Instance;
 /**
  * Mount a component and render the output.
  */

package/build/render.js

@@ -1,29 +1,35 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const ink_1 = __importDefault(require("./ink"));
-const instances_1 = __importDefault(require("./instances"));
-const stream_1 = require("stream");
+import { Stream } from 'node:stream';
+import process from 'node:process';
+import Ink from './ink.js';
+import instances from './instances.js';
 /**
  * Mount a component and render the output.
  */
 const render = (node, options) => {
-    const inkOptions = Object.assign({ stdout: process.stdout, stdin: process.stdin, stderr: process.stderr, debug: false, exitOnCtrlC: true, patchConsole: true }, getOptions(options));
-    const instance = getInstance(inkOptions.stdout, () => new ink_1.default(inkOptions));
+    const inkOptions = {
+        stdout: process.stdout,
+        stdin: process.stdin,
+        stderr: process.stderr,
+        debug: false,
+        exitOnCtrlC: true,
+        patchConsole: true,
+        ...getOptions(options)
+    };
+    const instance = getInstance(inkOptions.stdout, () => new Ink(inkOptions));
     instance.render(node);
     return {
         rerender: instance.render,
-        unmount: () => instance.unmount(),
+        unmount() {
+            instance.unmount();
+        },
         waitUntilExit: instance.waitUntilExit,
-        cleanup: () => instances_1.default.delete(inkOptions.stdout),
+        cleanup: () => instances.delete(inkOptions.stdout),
         clear: instance.clear
     };
 };
-exports.default = render;
+export default render;
 const getOptions = (stdout = {}) => {
-    if (stdout instanceof stream_1.Stream) {
+    if (stdout instanceof Stream) {
         return {
             stdout,
             stdin: process.stdin
@@ -32,13 +38,10 @@ const getOptions = (stdout = {}) => {
     return stdout;
 };
 const getInstance = (stdout, createInstance) => {
-    let instance;
-    if (instances_1.default.has(stdout)) {
-        instance = instances_1.default.get(stdout);
-    }
-    else {
+    let instance = instances.get(stdout);
+    if (!instance) {
         instance = createInstance();
-        instances_1.default.set(stdout, instance);
+        instances.set(stdout, instance);
     }
     return instance;
 };

package/build/render.js.map

@@ -1 +1 @@
-{"version":3,"file":"render.js","sourceRoot":"","sources":["../src/render.ts"],"names":[],"mappings":";;;;;AACA,gDAAiD;AACjD,4DAAoC;AACpC,mCAA8B;AAmE9B;;GAEG;AACH,MAAM,MAAM,GAAmB,CAAC,IAAI,EAAE,OAAO,EAAY,EAAE;IAC1D,MAAM,UAAU,mBACf,MAAM,EAAE,OAAO,CAAC,MAAM,EACtB,KAAK,EAAE,OAAO,CAAC,KAAK,EACpB,MAAM,EAAE,OAAO,CAAC,MAAM,EACtB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,IAAI,EACjB,YAAY,EAAE,IAAI,IACf,UAAU,CAAC,OAAO,CAAC,CACtB,CAAC;IAEF,MAAM,QAAQ,GAAQ,WAAW,CAChC,UAAU,CAAC,MAAM,EACjB,GAAG,EAAE,CAAC,IAAI,aAAG,CAAC,UAAU,CAAC,CACzB,CAAC;IAEF,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAEtB,OAAO;QACN,QAAQ,EAAE,QAAQ,CAAC,MAAM;QACzB,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAO,EAAE;QACjC,aAAa,EAAE,QAAQ,CAAC,aAAa;QACrC,OAAO,EAAE,GAAG,EAAE,CAAC,mBAAS,CAAC,MAAM,CAAC,UAAU,CAAC,MAAM,CAAC;QAClD,KAAK,EAAE,QAAQ,CAAC,KAAK;KACrB,CAAC;AACH,CAAC,CAAC;AAEF,kBAAe,MAAM,CAAC;AAEtB,MAAM,UAAU,GAAG,CAClB,SAAyD,EAAE,EAC3C,EAAE;IAClB,IAAI,MAAM,YAAY,eAAM,EAAE;QAC7B,OAAO;YACN,MAAM;YACN,KAAK,EAAE,OAAO,CAAC,KAAK;SACpB,CAAC;KACF;IAED,OAAO,MAAM,CAAC;AACf,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CACnB,MAA0B,EAC1B,cAAyB,EACnB,EAAE;IACR,IAAI,QAAa,CAAC;IAElB,IAAI,mBAAS,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;QAC1B,QAAQ,GAAG,mBAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;KACjC;SAAM;QACN,QAAQ,GAAG,cAAc,EAAE,CAAC;QAC5B,mBAAS,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;KAChC;IAED,OAAO,QAAQ,CAAC;AACjB,CAAC,CAAC"}
+{"version":3,"file":"render.js","sourceRoot":"","sources":["../src/render.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,aAAa,CAAC;AACnC,OAAO,OAAO,MAAM,cAAc,CAAC;AAEnC,OAAO,GAAiC,MAAM,UAAU,CAAC;AACzD,OAAO,SAAS,MAAM,gBAAgB,CAAC;AAmEvC;;GAEG;AACH,MAAM,MAAM,GAAmB,CAAC,IAAI,EAAE,OAAO,EAAY,EAAE;IAC1D,MAAM,UAAU,GAAe;QAC9B,MAAM,EAAE,OAAO,CAAC,MAAM;QACtB,KAAK,EAAE,OAAO,CAAC,KAAK;QACpB,MAAM,EAAE,OAAO,CAAC,MAAM;QACtB,KAAK,EAAE,KAAK;QACZ,WAAW,EAAE,IAAI;QACjB,YAAY,EAAE,IAAI;QAClB,GAAG,UAAU,CAAC,OAAO,CAAC;KACtB,CAAC;IAEF,MAAM,QAAQ,GAAQ,WAAW,CAChC,UAAU,CAAC,MAAM,EACjB,GAAG,EAAE,CAAC,IAAI,GAAG,CAAC,UAAU,CAAC,CACzB,CAAC;IAEF,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAEtB,OAAO;QACN,QAAQ,EAAE,QAAQ,CAAC,MAAM;QACzB,OAAO;YACN,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,CAAC;QACD,aAAa,EAAE,QAAQ,CAAC,aAAa;QACrC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC,MAAM,CAAC;QAClD,KAAK,EAAE,QAAQ,CAAC,KAAK;KACrB,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC;AAEtB,MAAM,UAAU,GAAG,CAClB,SAAyD,EAAE,EAC3C,EAAE;IAClB,IAAI,MAAM,YAAY,MAAM,EAAE;QAC7B,OAAO;YACN,MAAM;YACN,KAAK,EAAE,OAAO,CAAC,KAAK;SACpB,CAAC;KACF;IAED,OAAO,MAAM,CAAC;AACf,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CACnB,MAA0B,EAC1B,cAAyB,EACnB,EAAE;IACR,IAAI,QAAQ,GAAG,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;IAErC,IAAI,CAAC,QAAQ,EAAE;QACd,QAAQ,GAAG,cAAc,EAAE,CAAC;QAC5B,SAAS,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;KAChC;IAED,OAAO,QAAQ,CAAC;AACjB,CAAC,CAAC"}

package/build/renderer.d.ts

@@ -1,8 +1,8 @@
-import { DOMElement } from './dom';
-interface Result {
+import { type DOMElement } from './dom.js';
+type Result = {
     output: string;
     outputHeight: number;
     staticOutput: string;
-}
-declare const _default: (node: DOMElement, terminalWidth: number) => Result;
-export default _default;
+};
+declare const renderer: (node: DOMElement) => Result;
+export default renderer;

package/build/renderer.js

@@ -1,28 +1,19 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const yoga_layout_prebuilt_1 = __importDefault(require("yoga-layout-prebuilt"));
-const render_node_to_output_1 = __importDefault(require("./render-node-to-output"));
-const output_1 = __importDefault(require("./output"));
-exports.default = (node, terminalWidth) => {
-    var _a;
-    node.yogaNode.setWidth(terminalWidth);
+import renderNodeToOutput from './render-node-to-output.js';
+import Output from './output.js';
+const renderer = (node) => {
     if (node.yogaNode) {
-        node.yogaNode.calculateLayout(undefined, undefined, yoga_layout_prebuilt_1.default.DIRECTION_LTR);
-        const output = new output_1.default({
+        const output = new Output({
             width: node.yogaNode.getComputedWidth(),
             height: node.yogaNode.getComputedHeight()
         });
-        render_node_to_output_1.default(node, output, { skipStaticElements: true });
+        renderNodeToOutput(node, output, { skipStaticElements: true });
         let staticOutput;
-        if ((_a = node.staticNode) === null || _a === void 0 ? void 0 : _a.yogaNode) {
-            staticOutput = new output_1.default({
+        if (node.staticNode?.yogaNode) {
+            staticOutput = new Output({
                 width: node.staticNode.yogaNode.getComputedWidth(),
                 height: node.staticNode.yogaNode.getComputedHeight()
             });
-            render_node_to_output_1.default(node.staticNode, staticOutput, {
+            renderNodeToOutput(node.staticNode, staticOutput, {
                 skipStaticElements: false
             });
         }
@@ -41,4 +32,5 @@ exports.default = (node, terminalWidth) => {
         staticOutput: ''
     };
 };
+export default renderer;
 //# sourceMappingURL=renderer.js.map

package/build/renderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderer.js","sourceRoot":"","sources":["../src/renderer.ts"],"names":[],"mappings":";;;;;AAAA,gFAAwC;AACxC,oFAAyD;AACzD,sDAA8B;AAS9B,kBAAe,CAAC,IAAgB,EAAE,aAAqB,EAAU,EAAE;;IAClE,IAAI,CAAC,QAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;IAEvC,IAAI,IAAI,CAAC,QAAQ,EAAE;QAClB,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,SAAS,EAAE,SAAS,EAAE,8BAAI,CAAC,aAAa,CAAC,CAAC;QAExE,MAAM,MAAM,GAAG,IAAI,gBAAM,CAAC;YACzB,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,gBAAgB,EAAE;YACvC,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,iBAAiB,EAAE;SACzC,CAAC,CAAC;QAEH,+BAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,EAAC,kBAAkB,EAAE,IAAI,EAAC,CAAC,CAAC;QAE7D,IAAI,YAAY,CAAC;QAEjB,UAAI,IAAI,CAAC,UAAU,0CAAE,QAAQ,EAAE;YAC9B,YAAY,GAAG,IAAI,gBAAM,CAAC;gBACzB,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,EAAE;gBAClD,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,iBAAiB,EAAE;aACpD,CAAC,CAAC;YAEH,+BAAkB,CAAC,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE;gBACjD,kBAAkB,EAAE,KAAK;aACzB,CAAC,CAAC;SACH;QAED,MAAM,EAAC,MAAM,EAAE,eAAe,EAAE,MAAM,EAAE,YAAY,EAAC,GAAG,MAAM,CAAC,GAAG,EAAE,CAAC;QAErE,OAAO;YACN,MAAM,EAAE,eAAe;YACvB,YAAY;YACZ,2EAA2E;YAC3E,8DAA8D;YAC9D,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,GAAG,EAAE,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,EAAE;SAClE,CAAC;KACF;IAED,OAAO;QACN,MAAM,EAAE,EAAE;QACV,YAAY,EAAE,CAAC;QACf,YAAY,EAAE,EAAE;KAChB,CAAC;AACH,CAAC,CAAC"}
+{"version":3,"file":"renderer.js","sourceRoot":"","sources":["../src/renderer.ts"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,MAAM,4BAA4B,CAAC;AAC5D,OAAO,MAAM,MAAM,aAAa,CAAC;AASjC,MAAM,QAAQ,GAAG,CAAC,IAAgB,EAAU,EAAE;IAC7C,IAAI,IAAI,CAAC,QAAQ,EAAE;QAClB,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC;YACzB,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,gBAAgB,EAAE;YACvC,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,iBAAiB,EAAE;SACzC,CAAC,CAAC;QAEH,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,EAAC,kBAAkB,EAAE,IAAI,EAAC,CAAC,CAAC;QAE7D,IAAI,YAAY,CAAC;QAEjB,IAAI,IAAI,CAAC,UAAU,EAAE,QAAQ,EAAE;YAC9B,YAAY,GAAG,IAAI,MAAM,CAAC;gBACzB,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,EAAE;gBAClD,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,iBAAiB,EAAE;aACpD,CAAC,CAAC;YAEH,kBAAkB,CAAC,IAAI,CAAC,UAAU,EAAE,YAAY,EAAE;gBACjD,kBAAkB,EAAE,KAAK;aACzB,CAAC,CAAC;SACH;QAED,MAAM,EAAC,MAAM,EAAE,eAAe,EAAE,MAAM,EAAE,YAAY,EAAC,GAAG,MAAM,CAAC,GAAG,EAAE,CAAC;QAErE,OAAO;YACN,MAAM,EAAE,eAAe;YACvB,YAAY;YACZ,2EAA2E;YAC3E,8DAA8D;YAC9D,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,GAAG,EAAE,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,EAAE;SAClE,CAAC;KACF;IAED,OAAO;QACN,MAAM,EAAE,EAAE;QACV,YAAY,EAAE,CAAC;QACf,YAAY,EAAE,EAAE;KAChB,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/build/squash-text-nodes.d.ts

@@ -1,3 +1,3 @@
-import { DOMElement } from './dom';
+import { type DOMElement } from './dom.js';
 declare const squashTextNodes: (node: DOMElement) => string;
 export default squashTextNodes;

package/build/squash-text-nodes.js

@@ -1,5 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
 // Squashing text nodes allows to combine multiple text nodes into one and write
 // to `Output` instance only once. For example, <Text>hello{' '}world</Text>
 // is actually 3 text nodes, which would result 3 writes to `Output`.
@@ -31,5 +29,5 @@ const squashTextNodes = (node) => {
     }
     return text;
 };
-exports.default = squashTextNodes;
+export default squashTextNodes;
 //# sourceMappingURL=squash-text-nodes.js.map

package/build/squash-text-nodes.js.map

@@ -1 +1 @@
-{"version":3,"file":"squash-text-nodes.js","sourceRoot":"","sources":["../src/squash-text-nodes.ts"],"names":[],"mappings":";;AAEA,gFAAgF;AAChF,4EAA4E;AAC5E,qEAAqE;AACrE,EAAE;AACF,kGAAkG;AAClG,wFAAwF;AACxF,MAAM,eAAe,GAAG,CAAC,IAAgB,EAAU,EAAE;IACpD,IAAI,IAAI,GAAG,EAAE,CAAC;IAEd,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;QAC/B,KAAK,MAAM,SAAS,IAAI,IAAI,CAAC,UAAU,EAAE;YACxC,IAAI,QAAQ,GAAG,EAAE,CAAC;YAElB,IAAI,SAAS,CAAC,QAAQ,KAAK,OAAO,EAAE;gBACnC,QAAQ,GAAG,SAAS,CAAC,SAAS,CAAC;aAC/B;iBAAM;gBACN,IACC,SAAS,CAAC,QAAQ,KAAK,UAAU;oBACjC,SAAS,CAAC,QAAQ,KAAK,kBAAkB,EACxC;oBACD,QAAQ,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC;iBACtC;gBAED,oFAAoF;gBACpF,iFAAiF;gBACjF,IACC,QAAQ,CAAC,MAAM,GAAG,CAAC;oBACnB,OAAO,SAAS,CAAC,kBAAkB,KAAK,UAAU,EACjD;oBACD,QAAQ,GAAG,SAAS,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;iBAClD;aACD;YAED,IAAI,IAAI,QAAQ,CAAC;SACjB;KACD;IAED,OAAO,IAAI,CAAC;AACb,CAAC,CAAC;AAEF,kBAAe,eAAe,CAAC"}
+{"version":3,"file":"squash-text-nodes.js","sourceRoot":"","sources":["../src/squash-text-nodes.ts"],"names":[],"mappings":"AAEA,gFAAgF;AAChF,4EAA4E;AAC5E,qEAAqE;AACrE,EAAE;AACF,kGAAkG;AAClG,wFAAwF;AACxF,MAAM,eAAe,GAAG,CAAC,IAAgB,EAAU,EAAE;IACpD,IAAI,IAAI,GAAG,EAAE,CAAC;IAEd,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;QAC/B,KAAK,MAAM,SAAS,IAAI,IAAI,CAAC,UAAU,EAAE;YACxC,IAAI,QAAQ,GAAG,EAAE,CAAC;YAElB,IAAI,SAAS,CAAC,QAAQ,KAAK,OAAO,EAAE;gBACnC,QAAQ,GAAG,SAAS,CAAC,SAAS,CAAC;aAC/B;iBAAM;gBACN,IACC,SAAS,CAAC,QAAQ,KAAK,UAAU;oBACjC,SAAS,CAAC,QAAQ,KAAK,kBAAkB,EACxC;oBACD,QAAQ,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC;iBACtC;gBAED,oFAAoF;gBACpF,iFAAiF;gBACjF,IACC,QAAQ,CAAC,MAAM,GAAG,CAAC;oBACnB,OAAO,SAAS,CAAC,kBAAkB,KAAK,UAAU,EACjD;oBACD,QAAQ,GAAG,SAAS,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;iBAClD;aACD;YAED,IAAI,IAAI,QAAQ,CAAC;SACjB;KACD;IAED,OAAO,IAAI,CAAC;AACb,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/build/styles.d.ts

@@ -1,10 +1,18 @@
-import { YogaNode } from 'yoga-layout-prebuilt';
-import { Boxes } from 'cli-boxes';
-import { LiteralUnion } from 'type-fest';
-import { ForegroundColor } from 'chalk';
-export interface Styles {
+import { type Boxes } from 'cli-boxes';
+import { type LiteralUnion } from 'type-fest';
+import { type ForegroundColorName } from 'chalk';
+import { type Node as YogaNode } from 'yoga-wasm-web/auto';
+export type Styles = {
     readonly textWrap?: 'wrap' | 'end' | 'middle' | 'truncate-end' | 'truncate' | 'truncate-middle' | 'truncate-start';
     readonly position?: 'absolute' | 'relative';
+    /**
+     * Gap between element's columns.
+     */
+    readonly columnGap?: number;
+    /**
+     * Gap between element's rows.
+     */
+    readonly rowGap?: number;
     /**
      * Top margin.
      */
@@ -57,6 +65,11 @@ export interface Styles {
      * See [flex-basis](https://css-tricks.com/almanac/properties/f/flex-basis/).
      */
     readonly flexBasis?: number | string;
+    /**
+     * It defines whether the flex items are forced in a single line or can be flowed into multiple lines. If set to multiple lines, it also defines the cross-axis which determines the direction new lines are stacked in.
+     * See [flex-wrap](https://css-tricks.com/almanac/properties/f/flex-wrap/).
+     */
+    readonly flexWrap?: 'nowrap' | 'wrap' | 'wrap-reverse';
     /**
      * The align-items property defines the default behavior for how items are laid out along the cross axis (perpendicular to the main axis).
      * See [align-items](https://css-tricks.com/almanac/properties/a/align-items/).
@@ -103,7 +116,15 @@ export interface Styles {
      * Change border color.
      * Accepts the same values as `color` in <Text> component.
      */
-    readonly borderColor?: LiteralUnion<typeof ForegroundColor, string>;
-}
-declare const _default: (node: YogaNode, style?: Styles) => void;
-export default _default;
+    readonly borderColor?: LiteralUnion<ForegroundColorName, string>;
+    /**
+     * Behavior for an element's overflow in horizontal direction.
+     */
+    readonly overflowX?: 'visible' | 'hidden';
+    /**
+     * Behavior for an element's overflow in vertical direction.
+     */
+    readonly overflowY?: 'visible' | 'hidden';
+};
+declare const styles: (node: YogaNode, style?: Styles) => void;
+export default styles;

package/build/styles.js

@@ -1,65 +1,70 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-/* eslint-disable @typescript-eslint/prefer-nullish-coalescing */
-const yoga_layout_prebuilt_1 = __importDefault(require("yoga-layout-prebuilt"));
+// eslint-disable-next-line n/file-extension-in-import
+import Yoga from 'yoga-wasm-web/auto';
 const applyPositionStyles = (node, style) => {
     if ('position' in style) {
         node.setPositionType(style.position === 'absolute'
-            ? yoga_layout_prebuilt_1.default.POSITION_TYPE_ABSOLUTE
-            : yoga_layout_prebuilt_1.default.POSITION_TYPE_RELATIVE);
+            ? Yoga.POSITION_TYPE_ABSOLUTE
+            : Yoga.POSITION_TYPE_RELATIVE);
     }
 };
 const applyMarginStyles = (node, style) => {
     if ('marginLeft' in style) {
-        node.setMargin(yoga_layout_prebuilt_1.default.EDGE_START, style.marginLeft || 0);
+        node.setMargin(Yoga.EDGE_START, style.marginLeft || 0);
     }
     if ('marginRight' in style) {
-        node.setMargin(yoga_layout_prebuilt_1.default.EDGE_END, style.marginRight || 0);
+        node.setMargin(Yoga.EDGE_END, style.marginRight || 0);
     }
     if ('marginTop' in style) {
-        node.setMargin(yoga_layout_prebuilt_1.default.EDGE_TOP, style.marginTop || 0);
+        node.setMargin(Yoga.EDGE_TOP, style.marginTop || 0);
     }
     if ('marginBottom' in style) {
-        node.setMargin(yoga_layout_prebuilt_1.default.EDGE_BOTTOM, style.marginBottom || 0);
+        node.setMargin(Yoga.EDGE_BOTTOM, style.marginBottom || 0);
     }
 };
 const applyPaddingStyles = (node, style) => {
     if ('paddingLeft' in style) {
-        node.setPadding(yoga_layout_prebuilt_1.default.EDGE_LEFT, style.paddingLeft || 0);
+        node.setPadding(Yoga.EDGE_LEFT, style.paddingLeft || 0);
     }
     if ('paddingRight' in style) {
-        node.setPadding(yoga_layout_prebuilt_1.default.EDGE_RIGHT, style.paddingRight || 0);
+        node.setPadding(Yoga.EDGE_RIGHT, style.paddingRight || 0);
     }
     if ('paddingTop' in style) {
-        node.setPadding(yoga_layout_prebuilt_1.default.EDGE_TOP, style.paddingTop || 0);
+        node.setPadding(Yoga.EDGE_TOP, style.paddingTop || 0);
     }
     if ('paddingBottom' in style) {
-        node.setPadding(yoga_layout_prebuilt_1.default.EDGE_BOTTOM, style.paddingBottom || 0);
+        node.setPadding(Yoga.EDGE_BOTTOM, style.paddingBottom || 0);
     }
 };
 const applyFlexStyles = (node, style) => {
-    var _a;
     if ('flexGrow' in style) {
-        node.setFlexGrow((_a = style.flexGrow) !== null && _a !== void 0 ? _a : 0);
+        node.setFlexGrow(style.flexGrow ?? 0);
     }
     if ('flexShrink' in style) {
         node.setFlexShrink(typeof style.flexShrink === 'number' ? style.flexShrink : 1);
     }
+    if ('flexWrap' in style) {
+        if (style.flexWrap === 'nowrap') {
+            node.setFlexWrap(Yoga.WRAP_NO_WRAP);
+        }
+        if (style.flexWrap === 'wrap') {
+            node.setFlexWrap(Yoga.WRAP_WRAP);
+        }
+        if (style.flexWrap === 'wrap-reverse') {
+            node.setFlexWrap(Yoga.WRAP_WRAP_REVERSE);
+        }
+    }
     if ('flexDirection' in style) {
         if (style.flexDirection === 'row') {
-            node.setFlexDirection(yoga_layout_prebuilt_1.default.FLEX_DIRECTION_ROW);
+            node.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
         }
         if (style.flexDirection === 'row-reverse') {
-            node.setFlexDirection(yoga_layout_prebuilt_1.default.FLEX_DIRECTION_ROW_REVERSE);
+            node.setFlexDirection(Yoga.FLEX_DIRECTION_ROW_REVERSE);
         }
         if (style.flexDirection === 'column') {
-            node.setFlexDirection(yoga_layout_prebuilt_1.default.FLEX_DIRECTION_COLUMN);
+            node.setFlexDirection(Yoga.FLEX_DIRECTION_COLUMN);
         }
         if (style.flexDirection === 'column-reverse') {
-            node.setFlexDirection(yoga_layout_prebuilt_1.default.FLEX_DIRECTION_COLUMN_REVERSE);
+            node.setFlexDirection(Yoga.FLEX_DIRECTION_COLUMN_REVERSE);
         }
     }
     if ('flexBasis' in style) {
@@ -71,57 +76,56 @@ const applyFlexStyles = (node, style) => {
         }
         else {
             // This should be replaced with node.setFlexBasisAuto() when new Yoga release is out
-            node.setFlexBasis(NaN);
+            node.setFlexBasis(Number.NaN);
         }
     }
     if ('alignItems' in style) {
         if (style.alignItems === 'stretch' || !style.alignItems) {
-            node.setAlignItems(yoga_layout_prebuilt_1.default.ALIGN_STRETCH);
+            node.setAlignItems(Yoga.ALIGN_STRETCH);
         }
         if (style.alignItems === 'flex-start') {
-            node.setAlignItems(yoga_layout_prebuilt_1.default.ALIGN_FLEX_START);
+            node.setAlignItems(Yoga.ALIGN_FLEX_START);
         }
         if (style.alignItems === 'center') {
-            node.setAlignItems(yoga_layout_prebuilt_1.default.ALIGN_CENTER);
+            node.setAlignItems(Yoga.ALIGN_CENTER);
         }
         if (style.alignItems === 'flex-end') {
-            node.setAlignItems(yoga_layout_prebuilt_1.default.ALIGN_FLEX_END);
+            node.setAlignItems(Yoga.ALIGN_FLEX_END);
         }
     }
     if ('alignSelf' in style) {
         if (style.alignSelf === 'auto' || !style.alignSelf) {
-            node.setAlignSelf(yoga_layout_prebuilt_1.default.ALIGN_AUTO);
+            node.setAlignSelf(Yoga.ALIGN_AUTO);
         }
         if (style.alignSelf === 'flex-start') {
-            node.setAlignSelf(yoga_layout_prebuilt_1.default.ALIGN_FLEX_START);
+            node.setAlignSelf(Yoga.ALIGN_FLEX_START);
         }
         if (style.alignSelf === 'center') {
-            node.setAlignSelf(yoga_layout_prebuilt_1.default.ALIGN_CENTER);
+            node.setAlignSelf(Yoga.ALIGN_CENTER);
         }
         if (style.alignSelf === 'flex-end') {
-            node.setAlignSelf(yoga_layout_prebuilt_1.default.ALIGN_FLEX_END);
+            node.setAlignSelf(Yoga.ALIGN_FLEX_END);
         }
     }
     if ('justifyContent' in style) {
         if (style.justifyContent === 'flex-start' || !style.justifyContent) {
-            node.setJustifyContent(yoga_layout_prebuilt_1.default.JUSTIFY_FLEX_START);
+            node.setJustifyContent(Yoga.JUSTIFY_FLEX_START);
         }
         if (style.justifyContent === 'center') {
-            node.setJustifyContent(yoga_layout_prebuilt_1.default.JUSTIFY_CENTER);
+            node.setJustifyContent(Yoga.JUSTIFY_CENTER);
         }
         if (style.justifyContent === 'flex-end') {
-            node.setJustifyContent(yoga_layout_prebuilt_1.default.JUSTIFY_FLEX_END);
+            node.setJustifyContent(Yoga.JUSTIFY_FLEX_END);
         }
         if (style.justifyContent === 'space-between') {
-            node.setJustifyContent(yoga_layout_prebuilt_1.default.JUSTIFY_SPACE_BETWEEN);
+            node.setJustifyContent(Yoga.JUSTIFY_SPACE_BETWEEN);
         }
         if (style.justifyContent === 'space-around') {
-            node.setJustifyContent(yoga_layout_prebuilt_1.default.JUSTIFY_SPACE_AROUND);
+            node.setJustifyContent(Yoga.JUSTIFY_SPACE_AROUND);
         }
     }
 };
 const applyDimensionStyles = (node, style) => {
-    var _a, _b;
     if ('width' in style) {
         if (typeof style.width === 'number') {
             node.setWidth(style.width);
@@ -149,7 +153,7 @@ const applyDimensionStyles = (node, style) => {
             node.setMinWidthPercent(Number.parseInt(style.minWidth, 10));
         }
         else {
-            node.setMinWidth((_a = style.minWidth) !== null && _a !== void 0 ? _a : 0);
+            node.setMinWidth(style.minWidth ?? 0);
         }
     }
     if ('minHeight' in style) {
@@ -157,25 +161,33 @@ const applyDimensionStyles = (node, style) => {
             node.setMinHeightPercent(Number.parseInt(style.minHeight, 10));
         }
         else {
-            node.setMinHeight((_b = style.minHeight) !== null && _b !== void 0 ? _b : 0);
+            node.setMinHeight(style.minHeight ?? 0);
         }
     }
 };
 const applyDisplayStyles = (node, style) => {
     if ('display' in style) {
-        node.setDisplay(style.display === 'flex' ? yoga_layout_prebuilt_1.default.DISPLAY_FLEX : yoga_layout_prebuilt_1.default.DISPLAY_NONE);
+        node.setDisplay(style.display === 'flex' ? Yoga.DISPLAY_FLEX : Yoga.DISPLAY_NONE);
     }
 };
 const applyBorderStyles = (node, style) => {
     if ('borderStyle' in style) {
         const borderWidth = typeof style.borderStyle === 'string' ? 1 : 0;
-        node.setBorder(yoga_layout_prebuilt_1.default.EDGE_TOP, borderWidth);
-        node.setBorder(yoga_layout_prebuilt_1.default.EDGE_BOTTOM, borderWidth);
-        node.setBorder(yoga_layout_prebuilt_1.default.EDGE_LEFT, borderWidth);
-        node.setBorder(yoga_layout_prebuilt_1.default.EDGE_RIGHT, borderWidth);
+        node.setBorder(Yoga.EDGE_TOP, borderWidth);
+        node.setBorder(Yoga.EDGE_BOTTOM, borderWidth);
+        node.setBorder(Yoga.EDGE_LEFT, borderWidth);
+        node.setBorder(Yoga.EDGE_RIGHT, borderWidth);
+    }
+};
+const applyGapStyles = (node, style) => {
+    if ('columnGap' in style) {
+        node.setGap(Yoga.GUTTER_COLUMN, style.columnGap ?? 0);
+    }
+    if ('rowGap' in style) {
+        node.setGap(Yoga.GUTTER_ROW, style.rowGap ?? 0);
     }
 };
-exports.default = (node, style = {}) => {
+const styles = (node, style = {}) => {
     applyPositionStyles(node, style);
     applyMarginStyles(node, style);
     applyPaddingStyles(node, style);
@@ -183,5 +195,7 @@ exports.default = (node, style = {}) => {
     applyDimensionStyles(node, style);
     applyDisplayStyles(node, style);
     applyBorderStyles(node, style);
+    applyGapStyles(node, style);
 };
+export default styles;
 //# sourceMappingURL=styles.js.map