1.1.0 • Published 1 year ago
react-termynal-new v1.1.0
React-Termynal-New
react-termynal-new
is another react wrapper around the css/javascript library termynal.js.
Installation
npm install react-termynal-new
Usage
import React from 'react';
import {App as Termynal, DataLine} from 'react-termynal-new';
const App = () => {
return (
<Termynal>
<DataLine type="input">pip install spacy</DataLine>
<DataLine type="progress"></DataLine>
<DataLine>SUCCESS: spacy-2.0.18-cp36-cp36m-win_amd64.whl is in your current directory.</DataLine>
<DataLine></DataLine>
<DataLine type="input">python -m spacy download en</DataLine>
<DataLine type="progress"></DataLine>
<DataLine>Installed en_core_web_sm-2.0.0</DataLine>
<DataLine></DataLine>
<DataLine type="input">python</DataLine>
<DataLine type="input" prompt=">>>">import spacy</DataLine>
<DataLine type="input" prompt=">>>">nlp = spacy.load('en')</DataLine>
<DataLine type="input" prompt=">>>">doc = nlp("Hello world!")</DataLine>
<DataLine type="input" prompt=">>>">print([(w.text, w.pos_) for w in doc])</DataLine>
<DataLine type="output">[('Hello', 'INTJ'), ('world', 'NOUN'), ('!', 'PUNCT')]</DataLine>
</Termynal>
);
};
export default App;
Props
App
Prop | Type | Default | Description |
---|---|---|---|
id | string | termynal | The id of the terminal |
title | string | bash | The title of the terminal |
flex | boolean | false | Whether to make height of terminal flexible |
startDelay | number | 600 | The delay before the terminal starts typing |
typeDelay | number | 90 | The delay between each character typed in input line |
lineDelay | number | 1500 | The delay between each line |
progressLength | number | 40 | The length of the progress bar |
progressChar | string | █ | The character to use for the progress bar |
progressPercent | number | 100 | The percentage of the progress bar to fill |
cursor | string | ▋ | The character to use for the cursor |
children | ReactElement[] | [] | The lines to render in the terminal |
DataLine
Prop | Type | Description |
---|---|---|
type | string | The type of the element. Can be 'input', 'progress', or '' as pure text line |
cursor | string | The character to use for the cursor |
value | string | The value of the element |
delay | number | The delay before the element is rendered |
typeDelay | number | The delay between each character typed in input line |
prompt | string | The prompt to use for input lines |
progressLength | number | The length of the progress bar |
progressChar | string | The character to use for the progress bar |
progressPercent | number | The percentage of the progress bar to fill |