Introducing React Terminal: A customizable terminal component for your React applications.

Here's what it provides:

• 🔮 Highly Customizable: Personalize the title bar, prompt, and output to perfectly match your app's design.
• ⌨️ Custom Commands: Define your own commands to perform specific actions within your app.
• ⏳ Async/Await Support: termireact handles asynchronous operations seamlessly, displaying a loader while waiting .
• ⬆️ ⬇️ Command History: Navigate through past commands with ease using the up and down arrow keys.
• #️⃣ JSX Rendering: Integrate JSX elements directly into your terminal output for a richer experience.
• 🌈 Ansi Support: Support for ANSI escape codes to add color and style to your terminal output.
• 🎨 Multiple Themes: Choose from pre-built themes or create your own custom look.
• 📦 Persistence (IndexedDB): Save and recall terminal history for a more convenient user experience.

Getting Started

The Project follows a Compound component pattern. You can use the components to build your own terminal. Each Components extends from Either a div or textarea (in case of input textarea) element so you can pass the element props to the components.

Install the package:

npm install @envoy1084/react-terminal
# or
yarn add @envoy1084/react-terminal
# or
pnpm add @envoy1084/react-terminal
# or
bun add @envoy1084/react-terminal
Copy

Usage:

import {
    Terminal,
    TerminalInputBox,
    TerminalLoader,
    TerminalOutput,
    TerminalTitleBar,
    TerminalWelcomeMessage,
} from '@envoy1084/react-terminal';

const MyComponent = () => {
    return (
        <Terminal>
            <TerminalTitleBar>
                <TerminalTitleBar.ActionGroup />
                <TerminalTitleBar.Title />
            </TerminalTitleBar>
            <TerminalWelcomeMessage />
            <TerminalOutput />
            <TerminalInputBox>
                <TerminalInputBox.Prompt />
                <TerminalInputBox.TextArea />
            </TerminalInputBox>
            <TerminalLoader />
        </Terminal>
    );
};

export default MyComponent;
Copy

Contributing

If you have any ideas on how to improve the project, feel free to contribute! Please read the contributing guidelines before submitting a pull request.

License

This project is licensed under the MIT License - see the LICENSE