@nuvin/ink 6.6.7 → 7.0.0-alpha

package/build/render.d.ts

@@ -1,8 +1,9 @@
 import type { ReactNode } from 'react';
 import Ink, { type RenderMetrics } from './ink.js';
+import { type KittyKeyboardOptions } from './kitty-keyboard.js';
 export type RenderOptions = {
     /**
-    Output stream where app will be rendered.
+    Output stream where the app will be rendered.
 
     @default process.stdout
     */
@@ -33,11 +34,16 @@ export type RenderOptions = {
     /**
     Patch console methods to ensure console output doesn't mix with Ink's output.
 
+    Note: Once unmount starts, Ink restores the native console before React cleanup runs. Teardown-time `console.*` output then follows the normal console behavior instead of being rerouted through Ink.
+
     @default true
     */
     patchConsole?: boolean;
     /**
-    Runs the given callback after each render and re-render.
+    Runs the given callback after each render and re-render with render metrics.
+
+    Note: this callback runs after Ink commits a frame, but it does not wait for `stdout`/`stderr` stream callbacks.
+    To run code after output is flushed, use `waitUntilRenderFlush()`.
     */
     onRender?: (metrics: RenderMetrics) => void;
     /**
@@ -61,6 +67,55 @@ export type RenderOptions = {
     @default false
     */
     incrementalRendering?: boolean;
+    /**
+    Enable React Concurrent Rendering mode.
+
+    When enabled:
+    - Suspense boundaries work correctly with async data
+    - `useTransition` and `useDeferredValue` are fully functional
+    - Updates can be interrupted for higher priority work
+
+    Note: Concurrent mode changes the timing of renders. Some tests may need to use `act()` to properly await updates. Reusing the same stdout across multiple `render()` calls without unmounting is unsupported. Call `unmount()` first if you need to change the rendering mode or create a fresh instance.
+
+    @default false
+    */
+    concurrent?: boolean;
+    /**
+    Configure kitty keyboard protocol support for enhanced keyboard input.
+    Enables additional modifiers (super, hyper, capsLock, numLock) and
+    disambiguated key events in terminals that support the protocol.
+
+    @see https://sw.kovidgoyal.net/kitty/keyboard-protocol/
+    */
+    kittyKeyboard?: KittyKeyboardOptions;
+    /**
+    Override automatic interactive mode detection.
+
+    By default, Ink detects whether the environment is interactive based on CI detection (via [`is-in-ci`](https://github.com/sindresorhus/is-in-ci)) and `stdout.isTTY`. Most users should not need to set this.
+
+    When non-interactive, Ink disables ANSI erase sequences, cursor manipulation, synchronized output, resize handling, and kitty keyboard auto-detection, writing only the final frame at unmount.
+
+    Set to `false` to force non-interactive mode or `true` to force interactive mode when the automatic detection doesn't suit your use case.
+
+    Note: Reusing the same stdout across multiple `render()` calls without unmounting is unsupported. Call `unmount()` first if you need to change this option or create a fresh instance.
+
+    @default true (false if in CI or `stdout.isTTY` is falsy)
+    */
+    interactive?: boolean;
+    /**
+    Render the app in the terminal's alternate screen buffer. When enabled, the app renders on a separate screen, and the original terminal content is restored when the app exits. This is the same mechanism used by programs like vim, htop, and less.
+
+    Note: The terminal's scrollback buffer is not available while in the alternate screen. This is standard terminal behavior; programs like vim use the alternate screen specifically to avoid polluting the user's scrollback history.
+
+    Note: Ink intentionally treats alternate-screen teardown output as disposable. It does not preserve or replay teardown-time frames, hook writes, or `console.*` output after restoring the primary screen.
+
+    Only works in interactive mode. Ignored when `interactive` is `false` or in a non-interactive environment (CI, piped stdout).
+
+    Note: Reusing the same stdout across multiple `render()` calls without unmounting is unsupported. Call `unmount()` first if you need to change this option or create a fresh instance.
+
+    @default false
+    */
+    alternateScreen?: boolean;
 };
 export type Instance = {
     /**
@@ -72,9 +127,42 @@ export type Instance = {
     */
     unmount: Ink['unmount'];
     /**
-    Returns a promise that resolves when the app is unmounted.
+    Returns a promise that settles when the app is unmounted.
+
+    It resolves with the value passed to `exit(value)` and rejects with the error passed to `exit(error)`.
+    When `unmount()` is called manually, it settles after unmount-related stdout writes complete.
+
+    @example
+    ```jsx
+    const {unmount, waitUntilExit} = render(<MyApp />);
+
+    setTimeout(unmount, 1000);
+
+    await waitUntilExit(); // resolves after `unmount()` is called
+    ```
     */
     waitUntilExit: Ink['waitUntilExit'];
+    /**
+    Returns a promise that settles after pending render output is flushed to stdout.
+
+    This can be used after `rerender()` when you need to run code only after the frame is written.
+
+    @example
+    ```jsx
+    const {rerender, waitUntilRenderFlush} = render(<MyApp step="loading" />);
+
+    rerender(<MyApp step="ready" />);
+    await waitUntilRenderFlush(); // output for "ready" is flushed
+
+    runNextCommand();
+    ```
+    */
+    waitUntilRenderFlush: Ink['waitUntilRenderFlush'];
+    /**
+    Unmount the current app and remove the internal Ink instance for this stdout.
+
+    This is mostly useful for advanced cases where you need `render()` to create a fresh instance for the same stream without leaving terminal state such as the alternate screen behind.
+    */
     cleanup: () => void;
     /**
     Clear output.

package/build/render.js

@@ -15,6 +15,8 @@ const render = (node, options) => {
         patchConsole: true,
         maxFps: 30,
         incrementalRendering: false,
+        concurrent: false,
+        alternateScreen: false,
         ...getOptions(options),
     };
     const instance = getInstance(inkOptions.stdout, () => new Ink(inkOptions));
@@ -25,7 +27,10 @@ const render = (node, options) => {
             instance.unmount();
         },
         waitUntilExit: instance.waitUntilExit,
-        cleanup: () => instances.delete(inkOptions.stdout),
+        waitUntilRenderFlush: instance.waitUntilRenderFlush,
+        cleanup() {
+            instance.unmount();
+        },
         clear: instance.clear,
     };
 };
@@ -40,11 +45,18 @@ const getOptions = (stdout = {}) => {
     return stdout;
 };
 const getInstance = (stdout, createInstance) => {
-    let instance = instances.get(stdout);
-    if (!instance) {
-        instance = createInstance();
-        instances.set(stdout, instance);
+    const instance = instances.get(stdout);
+    if (instance === undefined) {
+        const newInstance = createInstance();
+        instances.set(stdout, newInstance);
+        return newInstance;
     }
+    // Ink keeps one live renderer per stdout. Reusing the same stream without
+    // unmounting is unsupported, but return the existing instance so we don't
+    // create two renderers that compete for the same output. Write the warning
+    // directly to native stderr so an existing alternate-screen renderer cannot
+    // swallow it via patchConsole.
+    process.stderr.write('Warning: render() was called again for the same stdout before the previous Ink instance was unmounted. Reusing stdout across multiple render() calls is unsupported. Call unmount() first.\n');
     return instance;
 };
 //# sourceMappingURL=render.js.map

package/build/render.js.map

@@ -1 +1 @@
-{"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,GAAqD,MAAM,UAAU,CAAC;AAC7E,OAAO,SAAS,MAAM,gBAAgB,CAAC;AAkGvC;;EAEE;AACF,MAAM,MAAM,GAAG,CACd,IAAe,EACf,OAA4C,EACjC,EAAE;IACb,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,MAAM,EAAE,EAAE;QACV,oBAAoB,EAAE,KAAK;QAC3B,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,CAAC;QAC9B,OAAO;YACN,MAAM;YACN,KAAK,EAAE,OAAO,CAAC,KAAK;SACpB,CAAC;IACH,CAAC;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,CAAC;QACf,QAAQ,GAAG,cAAc,EAAE,CAAC;QAC5B,SAAS,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACjC,CAAC;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,GAAqD,MAAM,UAAU,CAAC;AAC7E,OAAO,SAAS,MAAM,gBAAgB,CAAC;AA+LvC;;EAEE;AACF,MAAM,MAAM,GAAG,CACd,IAAe,EACf,OAA4C,EACjC,EAAE;IACb,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,MAAM,EAAE,EAAE;QACV,oBAAoB,EAAE,KAAK;QAC3B,UAAU,EAAE,KAAK;QACjB,eAAe,EAAE,KAAK;QACtB,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;IACF,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,oBAAoB,EAAE,QAAQ,CAAC,oBAAoB;QACnD,OAAO;YACN,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,CAAC;QACD,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,CAAC;QAC9B,OAAO;YACN,MAAM;YACN,KAAK,EAAE,OAAO,CAAC,KAAK;SACpB,CAAC;IACH,CAAC;IAED,OAAO,MAAM,CAAC;AACf,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CACnB,MAA0B,EAC1B,cAAyB,EACnB,EAAE;IACR,MAAM,QAAQ,GAAG,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;IAEvC,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;QAC5B,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;QACrC,SAAS,CAAC,GAAG,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;QACnC,OAAO,WAAW,CAAC;IACpB,CAAC;IAED,0EAA0E;IAC1E,0EAA0E;IAC1E,2EAA2E;IAC3E,4EAA4E;IAC5E,+BAA+B;IAC/B,OAAO,CAAC,MAAM,CAAC,KAAK,CACnB,8LAA8L,CAC9L,CAAC;IAEF,OAAO,QAAQ,CAAC;AACjB,CAAC,CAAC"}

package/build/sanitize-ansi.d.ts

@@ -0,0 +1,2 @@
+declare const sanitizeAnsi: (text: string) => string;
+export default sanitizeAnsi;

package/build/sanitize-ansi.js

@@ -0,0 +1,27 @@
+import { hasAnsiControlCharacters, tokenizeAnsi } from './ansi-tokenizer.js';
+const sgrParametersRegex = /^[\d:;]*$/;
+// Strip ANSI escape sequences that would conflict with Ink's layout.
+// Preserved: SGR sequences (colors, bold, etc. - end with 'm') and
+// OSC sequences (hyperlinks, etc. - ESC ] or C1 OSC).
+// Stripped: cursor movement, screen clearing, and other control sequences.
+const sanitizeAnsi = (text) => {
+    if (!hasAnsiControlCharacters(text)) {
+        return text;
+    }
+    let output = '';
+    for (const token of tokenizeAnsi(text)) {
+        if (token.type === 'text' || token.type === 'osc') {
+            output += token.value;
+            continue;
+        }
+        if (token.type === 'csi' &&
+            token.finalCharacter === 'm' &&
+            token.intermediateString === '' &&
+            sgrParametersRegex.test(token.parameterString)) {
+            output += token.value;
+        }
+    }
+    return output;
+};
+export default sanitizeAnsi;
+//# sourceMappingURL=sanitize-ansi.js.map

package/build/sanitize-ansi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sanitize-ansi.js","sourceRoot":"","sources":["../src/sanitize-ansi.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,wBAAwB,EAAE,YAAY,EAAC,MAAM,qBAAqB,CAAC;AAE3E,MAAM,kBAAkB,GAAG,WAAW,CAAC;AAEvC,qEAAqE;AACrE,mEAAmE;AACnE,sDAAsD;AACtD,2EAA2E;AAC3E,MAAM,YAAY,GAAG,CAAC,IAAY,EAAU,EAAE;IAC7C,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,EAAE,CAAC;QACrC,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,MAAM,GAAG,EAAE,CAAC;IAEhB,KAAK,MAAM,KAAK,IAAI,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC;QACxC,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM,IAAI,KAAK,CAAC,IAAI,KAAK,KAAK,EAAE,CAAC;YACnD,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC;YACtB,SAAS;QACV,CAAC;QAED,IACC,KAAK,CAAC,IAAI,KAAK,KAAK;YACpB,KAAK,CAAC,cAAc,KAAK,GAAG;YAC5B,KAAK,CAAC,kBAAkB,KAAK,EAAE;YAC/B,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,EAC7C,CAAC;YACF,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC;QACvB,CAAC;IACF,CAAC;IAED,OAAO,MAAM,CAAC;AACf,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/build/squash-text-nodes.js

@@ -1,3 +1,4 @@
+import sanitizeAnsi from './sanitize-ansi.js';
 // 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`.
@@ -29,7 +30,7 @@ const squashTextNodes = (node) => {
         }
         text += nodeText;
     }
-    return text;
+    return sanitizeAnsi(text);
 };
 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,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC;QAC7D,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;QAEzC,IAAI,SAAS,KAAK,SAAS,EAAE,CAAC;YAC7B,SAAS;QACV,CAAC;QAED,IAAI,QAAQ,GAAG,EAAE,CAAC;QAElB,IAAI,SAAS,CAAC,QAAQ,KAAK,OAAO,EAAE,CAAC;YACpC,QAAQ,GAAG,SAAS,CAAC,SAAS,CAAC;QAChC,CAAC;aAAM,CAAC;YACP,IACC,SAAS,CAAC,QAAQ,KAAK,UAAU;gBACjC,SAAS,CAAC,QAAQ,KAAK,kBAAkB,EACxC,CAAC;gBACF,QAAQ,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC;YACvC,CAAC;YAED,oFAAoF;YACpF,iFAAiF;YACjF,IACC,QAAQ,CAAC,MAAM,GAAG,CAAC;gBACnB,OAAO,SAAS,CAAC,kBAAkB,KAAK,UAAU,EACjD,CAAC;gBACF,QAAQ,GAAG,SAAS,CAAC,kBAAkB,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;YAC1D,CAAC;QACF,CAAC;QAED,IAAI,IAAI,QAAQ,CAAC;IAClB,CAAC;IAED,OAAO,IAAI,CAAC;AACb,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"squash-text-nodes.js","sourceRoot":"","sources":["../src/squash-text-nodes.ts"],"names":[],"mappings":"AACA,OAAO,YAAY,MAAM,oBAAoB,CAAC;AAE9C,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,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC;QAC7D,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;QAEzC,IAAI,SAAS,KAAK,SAAS,EAAE,CAAC;YAC7B,SAAS;QACV,CAAC;QAED,IAAI,QAAQ,GAAG,EAAE,CAAC;QAElB,IAAI,SAAS,CAAC,QAAQ,KAAK,OAAO,EAAE,CAAC;YACpC,QAAQ,GAAG,SAAS,CAAC,SAAS,CAAC;QAChC,CAAC;aAAM,CAAC;YACP,IACC,SAAS,CAAC,QAAQ,KAAK,UAAU;gBACjC,SAAS,CAAC,QAAQ,KAAK,kBAAkB,EACxC,CAAC;gBACF,QAAQ,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC;YACvC,CAAC;YAED,oFAAoF;YACpF,iFAAiF;YACjF,IACC,QAAQ,CAAC,MAAM,GAAG,CAAC;gBACnB,OAAO,SAAS,CAAC,kBAAkB,KAAK,UAAU,EACjD,CAAC;gBACF,QAAQ,GAAG,SAAS,CAAC,kBAAkB,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;YAC1D,CAAC;QACF,CAAC;QAED,IAAI,IAAI,QAAQ,CAAC;IAClB,CAAC;IAED,OAAO,YAAY,CAAC,IAAI,CAAC,CAAC;AAC3B,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/build/styles.d.ts

@@ -3,24 +3,29 @@ import { type LiteralUnion } from 'type-fest';
 import { type ForegroundColorName } from 'ansi-styles';
 import { type Node as YogaNode } from 'yoga-layout';
 export type Styles = {
-    readonly textWrap?: 'wrap' | 'end' | 'middle' | 'truncate-end' | 'truncate' | 'truncate-middle' | 'truncate-start';
-    readonly position?: 'absolute' | 'relative' | 'sticky';
+    readonly textWrap?: 'wrap' | 'hard' | 'truncate-end' | 'truncate' | 'truncate-middle' | 'truncate-start';
     /**
-    Top offset. Used with position="absolute" or position="sticky".
+    Controls how the element is positioned.
+
+    When `position` is `static`, `top`, `right`, `bottom`, and `left` are ignored.
+    */
+    readonly position?: 'absolute' | 'relative' | 'static' | 'sticky';
+    /**
+    Top offset for positioned elements.
     */
-    readonly top?: number;
+    readonly top?: number | string;
     /**
-    Bottom offset. Used with position="absolute" or position="sticky".
+    Right offset for positioned elements.
     */
-    readonly bottom?: number;
+    readonly right?: number | string;
     /**
-    Left offset. Used with position="absolute" or position="sticky".
+    Bottom offset for positioned elements.
     */
-    readonly left?: number;
+    readonly bottom?: number | string;
     /**
-    Right offset. Used with position="absolute" or position="sticky".
+    Left offset for positioned elements.
     */
-    readonly right?: number;
+    readonly left?: number | string;
     /**
     Size of the gap between an element's columns.
     */
@@ -118,12 +123,17 @@ export type Styles = {
     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/).
     */
-    readonly alignItems?: 'flex-start' | 'center' | 'flex-end' | 'stretch';
+    readonly alignItems?: 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
     /**
     It makes possible to override the align-items value for specific flex items.
     See [align-self](https://css-tricks.com/almanac/properties/a/align-self/).
     */
-    readonly alignSelf?: 'flex-start' | 'center' | 'flex-end' | 'auto';
+    readonly alignSelf?: 'flex-start' | 'center' | 'flex-end' | 'auto' | 'stretch' | 'baseline';
+    /**
+    It defines the alignment along the cross axis when there are multiple lines of flex items (when using flex-wrap).
+    See [align-content](https://css-tricks.com/almanac/properties/a/align-content/).
+    */
+    readonly alignContent?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'space-between' | 'space-around' | 'space-evenly';
     /**
     It defines the alignment along the main axis.
     See [justify-content](https://css-tricks.com/almanac/properties/j/justify-content/).
@@ -139,20 +149,28 @@ export type Styles = {
     readonly height?: number | string;
     /**
     Sets a minimum width of the element.
+    Percentages aren't supported yet; see https://github.com/facebook/yoga/issues/872.
     */
     readonly minWidth?: number | string;
     /**
-    Sets a minimum height of the element.
+    Sets a minimum height of the element in lines (rows). You can also set it as a percentage, which will calculate the minimum height based on the height of the parent element.
     */
     readonly minHeight?: number | string;
     /**
-    Sets a maximum height of the element.
+    Sets a maximum width of the element.
+    Percentages aren't supported yet; see https://github.com/facebook/yoga/issues/872.
+    */
+    readonly maxWidth?: number | string;
+    /**
+    Sets a maximum height of the element in lines (rows). You can also set it as a percentage, which will calculate the maximum height based on the height of the parent element.
     */
     readonly maxHeight?: number | string;
     /**
-    Sets a maximum width of the element.
+    Defines the aspect ratio (width/height) for the element.
+
+    Use it with at least one size constraint (`width`, `height`, `minHeight`, or `maxHeight`) so Ink can derive the missing dimension.
     */
-    readonly maxWidth?: number | string;
+    readonly aspectRatio?: number;
     /**
     Set this property to `none` to hide the element.
     */
@@ -162,26 +180,26 @@ export type Styles = {
     */
     readonly borderStyle?: keyof Boxes | BoxStyle;
     /**
-    Determines whether top border is visible.
-    
+    Determines whether the top border is visible.
+
     @default true
     */
     readonly borderTop?: boolean;
     /**
-    Determines whether bottom border is visible.
-    
+    Determines whether the bottom border is visible.
+
     @default true
     */
     readonly borderBottom?: boolean;
     /**
-    Determines whether left border is visible.
-    
+    Determines whether the left border is visible.
+
     @default true
     */
     readonly borderLeft?: boolean;
     /**
-    Determines whether right border is visible.
-    
+    Determines whether the right border is visible.
+
     @default true
     */
     readonly borderRight?: boolean;
@@ -190,19 +208,19 @@ export type Styles = {
     */
     readonly borderColor?: LiteralUnion<ForegroundColorName, string>;
     /**
-    Change top border color. Accepts the same values as `color` in `Text` component.
+    Change the top border color. Accepts the same values as `color` in `Text` component.
     */
     readonly borderTopColor?: LiteralUnion<ForegroundColorName, string>;
     /**
-    Change bottom border color. Accepts the same values as `color` in `Text` component.
+    Change the bottom border color. Accepts the same values as `color` in `Text` component.
     */
     readonly borderBottomColor?: LiteralUnion<ForegroundColorName, string>;
     /**
-    Change left border color. Accepts the same values as `color` in `Text` component.
+    Change the left border color. Accepts the same values as `color` in `Text` component.
     */
     readonly borderLeftColor?: LiteralUnion<ForegroundColorName, string>;
     /**
-    Change right border color. Accepts the same values as `color` in `Text` component.
+    Change the right border color. Accepts the same values as `color` in `Text` component.
     */
     readonly borderRightColor?: LiteralUnion<ForegroundColorName, string>;
     /**
@@ -213,31 +231,51 @@ export type Styles = {
     readonly borderDimColor?: boolean;
     /**
     Dim the top border color.
-    
+
     @default false
     */
     readonly borderTopDimColor?: boolean;
     /**
     Dim the bottom border color.
-    
+
     @default false
     */
     readonly borderBottomDimColor?: boolean;
     /**
     Dim the left border color.
-    
+
     @default false
     */
     readonly borderLeftDimColor?: boolean;
     /**
     Dim the right border color.
-    
+
     @default false
     */
     readonly borderRightDimColor?: boolean;
     /**
+    Change border background color. A shorthand for setting `borderTopBackgroundColor`, `borderRightBackgroundColor`, `borderBottomBackgroundColor`, and `borderLeftBackgroundColor`.
+    */
+    readonly borderBackgroundColor?: LiteralUnion<ForegroundColorName, string>;
+    /**
+    Change top border background color. Accepts the same values as `backgroundColor` in `Text` component.
+    */
+    readonly borderTopBackgroundColor?: LiteralUnion<ForegroundColorName, string>;
+    /**
+    Change bottom border background color. Accepts the same values as `backgroundColor` in `Text` component.
+    */
+    readonly borderBottomBackgroundColor?: LiteralUnion<ForegroundColorName, string>;
+    /**
+    Change left border background color. Accepts the same values as `backgroundColor` in `Text` component.
+    */
+    readonly borderLeftBackgroundColor?: LiteralUnion<ForegroundColorName, string>;
+    /**
+    Change right border background color. Accepts the same values as `backgroundColor` in `Text` component.
+    */
+    readonly borderRightBackgroundColor?: LiteralUnion<ForegroundColorName, string>;
+    /**
     Behavior for an element's overflow in both directions.
-    
+
     @default 'visible'
     */
     readonly overflow?: 'visible' | 'hidden' | 'scroll';
@@ -255,18 +293,18 @@ export type Styles = {
     readonly overflowY?: 'visible' | 'hidden' | 'scroll';
     /**
     Background color for the element.
-    
+
     Accepts the same values as `color` in the `<Text>` component.
     */
     readonly backgroundColor?: LiteralUnion<ForegroundColorName, string>;
     /**
     Controls the stacking order of positioned elements.
     Higher values are rendered on top of lower values.
-    Only affects elements with position: 'absolute' or 'relative'.
-    
+    Only affects positioned elements.
+
     @default 0
     */
     readonly zIndex?: number;
 };
-declare const styles: (node: YogaNode, style?: Styles) => void;
+declare const styles: (node: YogaNode, style?: Styles, currentStyle?: Styles) => void;
 export default styles;