Write interactive CLI apps with React
| Package | Description | Version |
|---|---|---|
@react-slate/core |
The core functionality and logic. |
https://zamotany.github.io/react-slate/
- Render React apps to:
- terminal with
render - terminal in fullscreen mode with
renderFullscreen - a string with
renderToString - a JSON tree
renderToJson
- terminal with
- Use
for awaitto continuously render your app usingrenderToStringorrenderToJson. - Render your app to alternative screen buffer and go back to the previous content upon exit with
renderFullscreen. - Log messages to main screen buffer with
consolewhen exiting when in fullscreen mode (renderFullscreen). - Build layouts with FlexBox (https://github.com/vislyhq/stretch).
- Disable colors with
NO_COLORenvironment variable. - Use standard ANSI colors, RBG, Hex and CSS keywords to style your app.
- Use built-in
<Progress />and<Spinner />components. - Get layout information using
onLayoutprop. - Handle clicks using
onClickprop. - Detect mouse wheel events using
onWheelprop. - Support for absolute positioning and depth (
zIndex). - Built with TypeScript.
Please check out Roadmap for in-progress and planned features.
- Web components are not compatible.
- Strings must be wrapped in a
<Text>component.
yarn add react @react-slate/coreimport React from 'react';
import { render, View, Text } from '@react-slate/core';
function App() {
return (
<View width="100%" flexDirection="row" justifyContent="center">
<Text color="green" bold>Hello world!</Text>
</View>
);
}
render(<App />);