https://github.com/loopmode/xpty

xterm.js and node-pty for react and electron
https://github.com/loopmode/xpty

Last synced: 4 days ago
JSON representation

xterm.js and node-pty for react and electron

• Host: GitHub
• URL: https://github.com/loopmode/xpty
• Owner: loopmode
• Created: 2019-11-22T11:05:26.000Z (almost 5 years ago)
• Default Branch: master
• Last Pushed: 2022-02-12T18:50:43.000Z (almost 3 years ago)
• Last Synced: 2024-10-11T16:21:47.467Z (about 1 month ago)
• Language: TypeScript
• Size: 179 KB
• Stars: 8
• Watchers: 2
• Forks: 2
• Open Issues: 7
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# @loopmode/pty

A react component and some helpers for building terminals in electron apps.  

Based on [`xterm`](https://www.npmjs.com/package/xterm) and [`node-pty`](https://www.npmjs.com/package/node-pty).

## Usage

There are two parts to this:

1. A child process that is managed by node-pty and

2. a view that is managed by xterm.

### Creating a child process

```ts

import { PtyManager, createCommand } from '@loopmode/xpty';

const command = createCommand({

  cmd: 'ls -lah',

  cwd: '~'

});

const ptyProcess = PtyManager.connect(command);

```

If you do not want to immediatly execute the command, pass `false` as second argument.

The returned object is an [`pty.IPty`](https://github.com/microsoft/node-pty/blob/master/typings/node-pty.d.ts#L108) instance.

### Rendering a view

Basically, you render the `XTerminal` component and pass a `ptyProcess` prop to it.

```tsx

import React from 'react';

import { XTerminal } from '@loopmode/xpty';

export const Example = ({ ptyProcess }) => {

  return (

    

  )

}

```

### TODO

- hook, e.g. `usePty`, to get a `ptyProcess` easily

- docs for existing features and props

- more features and props

- tests