Package Exports
- react-hackterm
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-hackterm) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
React hackterm
Hackable terminal emulator in React
Milestone
- Hackable Terminal UI
- Terminal prefixing
- Custom commands
- Command flags
- Theming
- Command history
Installation
//use npm
$ npm i react-hackterm
//use yarn
$ yarn add react-term
Themes
Available theme: default, github, grass, ocean and pure.
Usage
import React from "react";
import ReactDOM from "react-dom";
import Terminal from "react-hackterm";
function App() {
return (
<div className="App">
<Terminal
config={{
mode: "root",
modeText: "example.com",
width: 500,
height: 300,
edge: true,
font: "monospace",
text: 14
}}
theme="pure"
bar="macos"
command={[
{
name: "whoami",
description: "Get package name",
value: "react-hackterm"
},
{
name: "pwd",
description: "Print working directory",
value: "/User/remote/guest/"
}
]}
/>
</div>
);
}
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);Inbuilt command
| Commands | Value |
|---|---|
| help | Show available commands |
| info | About terminal |
| date | Get current date |
| repo | Reach hackable terminal repository |
| clear | Show clear history |
Properties
| Property | Value | Type |
|---|---|---|
| config | { mode: "root", modeText: "example.com", width: 500, height: 300, edge: true, font: "monospace", text: 14 } |
object |
| commands | [{ name: "repo", description: "Get repo", value: "https://github.com/" }] |
array |
| theme | default, github, grass, ocean or pure. | string |
| bar | windows, macos or ubuntu | string |