Simulator

For what?

This component is the key execution point of the project. It is responsible for storing I/O, command history and their execution.

Props

export type SimulatorProps = {
  user?: string; // username displayed on the command line
  name?: string; // computer name displayed on the command line
  borderRadius?: {
    topLeft?: string; // border-radius-top-left property
    topRight?: string; // border-radius-top-right property
    bottomLeft?: string; // border-radius-bottom-left property
    bottomRight?: string; // border-radius-bottom-right property
  };
  startMessage?: string; // a welcome message to show at the start, before the prompt begins.
  prompt?: string; // terminal prompt
  theme?: {
    simulatorBackground?: string; // main background
    computerTextColor?: string; // text color after "@" symbol before ":" symbol
    atTextColor?: string; // "@" text color
    pathTextColor?: string; // text color after ":" symbol before prompt
    outputTextColor?: string; // output text color 
    userTextColor?: string; // text color before ":" symbol
    commandTextColor?: string; // command text color
  };
  fs?: Record<string, any>; // virtual file system
  applications?: Record<string, TermApp>; // applications
};

Usage

import {Simulator} from 'reterm';

function App(props) {
  const fs = {
    'file': 'someText',
    Directory: {
      'file1': '=)',
      'file2': 'UwU'
    }
  }
  return (
    <Simulator
      user={'reterm'}
      name={'retermComputer'}
      borderRadius={{
        topLeft: '1px',
        topRight: '1rem',
        bottomLeft: '1vw',
        bottomRight: 'var(--myCSSVariable)'
      }}
      startMessage={'Some text'}
      prompt={'<=>'}
      theme={{
        simulatorBackground: '#1e1e1e',
        computerTextColor: 'red',
        userTextColor: 'rgba(241, 11, 51, 0,75)',
        commandTextColor: 'var(--myCSSColorVariable)'
      }}
      fs={fs}
      applications={{command: {execute: (message, closeApp, value) => return closeApp('some output')}}}
    />
  );
}