Skip to content

Commit

Permalink
Add option to render using full available height (rows)
Browse files Browse the repository at this point in the history
  • Loading branch information
DanielSRS committed Dec 6, 2024
1 parent 57a4b21 commit f5378de
Show file tree
Hide file tree
Showing 4 changed files with 35 additions and 0 deletions.
24 changes: 24 additions & 0 deletions examples/counter-full-height/counter-full-height.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
import React from 'react';
import {Box, render, Text} from '../../src/index.js';

function CounterFullHeight() {
const [counter, setCounter] = React.useState(0);

React.useEffect(() => {
const timer = setInterval(() => {
setCounter(prevCounter => prevCounter + 1); // eslint-disable-line unicorn/prevent-abbreviations
}, 100);

return () => {
clearInterval(timer);
};
}, []);

return (
<Box borderStyle={'round'} flexGrow={1}>
<Text color="green">{counter} tests passed</Text>
</Box>
);
}

render(<CounterFullHeight />, {fullHeight: true});
1 change: 1 addition & 0 deletions examples/counter-full-height/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
import './counter-full-height.js';
4 changes: 4 additions & 0 deletions src/ink.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ export type Options = {
debug: boolean;
exitOnCtrlC: boolean;
patchConsole: boolean;
fullHeight?: boolean;
waitUntilExit?: () => Promise<void>;
};

Expand Down Expand Up @@ -130,6 +131,9 @@ export default class Ink {
const terminalWidth = this.options.stdout.columns || 80;

this.rootNode.yogaNode!.setWidth(terminalWidth);
if (this.options.fullHeight && this.options.stdout.rows) {
this.rootNode.yogaNode!.setHeight(this.options.stdout.rows);
}

this.rootNode.yogaNode!.calculateLayout(
undefined,
Expand Down
6 changes: 6 additions & 0 deletions src/render.ts
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,12 @@ export type RenderOptions = {
* @default true
*/
patchConsole?: boolean;
/**
* If true, render output will use all avaliable height (rows)
*
* @default undefined
*/
fullHeight?: boolean;
};

export type Instance = {
Expand Down

0 comments on commit f5378de

Please sign in to comment.