How to use workflow-react - 10 common examples
To help you get started, we’ve selected a few workflow-react examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
havardh / workflow / packages / workflow-app-terminal / flows / Example.js View on Github 
/* eslint-env node */
import { basename } from 'path';
import React from 'react';
import { render, Workspace, requireComponent } from 'workflow-react';
const { Terminal } = requireComponent('workflow-app-terminal');
export const flow = render(
);/* eslint-env node */
import React from 'react';
import { render, Workspace, requireComponent } from 'workflow-react';
const { Notepad } = requireComponent('workflow-app-notepad');
export const flow = render(
);/* eslint-env node */
import React from 'react';
import { render, Workspace, requireComponent } from 'workflow-react';
const { Chrome } = requireComponent('workflow-app-chrome');
export const flow = render(
);/* eslint-env node */
import React from 'react';
import { render, Workspace, requireComponent } from 'workflow-react';
const { Terminal } = requireComponent('workflow-app-terminal');
const { Less } = requireComponent('workflow-app-less');
export const flow = render(
);/* eslint-env node */
import React from 'react';
import { render, Workspace, requireComponent } from 'workflow-react';
const { Slack } = requireComponent('workflow-app-slack');
export const flow = render(
);/* eslint-env node */
import React from 'react';
import render, { Workspace, Layouts, requireComponent } from 'workflow-react';
const { SplitH, SplitV } = Layouts;
const Emacs = requireComponent('workflow-app-emacs');
const Terminal = requireComponent('workflow-app-terminal');
const Ssh = requireComponent('workflow-app-ssh');
export default render(/* eslint-env node */
import { join } from 'path';
import React from 'react';
import render, { Workspace, requireComponent } from 'workflow-react';
const { SplitH } = requireComponent('workflow-layout-tiled');
const Atom = requireComponent('workflow-app-atom');
const Chrome = requireComponent('workflow-app-chrome');
async function seconds(secs) {
return new Promise(resolve => setTimeout(resolve, secs * 1000));
}
class AtomWrapper extends React.Component {
constructor(props) {
super(props);
this.state = { file: 'package.json' };
}
async componentDidMount() {
await seconds(4);
this.setState({ file: 'WorkflowServerDemo.js' });
await seconds(2);/* eslint-env node */
import React from 'react';
import render, { Workspace, Layouts, requireComponent } from 'workflow-react';
const { SplitH, SplitV } = Layouts;
const Emacs = requireComponent('workflow-app-emacs');
const Terminal = requireComponent('workflow-app-terminal');
const Ssh = requireComponent('workflow-app-ssh');
export default render(/* eslint-env node */
import { join } from 'path';
import React from 'react';
import render, { Workspace, requireComponent } from 'workflow-react';
const { SplitH } = requireComponent('workflow-layout-tiled');
const Atom = requireComponent('workflow-app-atom');
const Chrome = requireComponent('workflow-app-chrome');
async function seconds(secs) {
return new Promise(resolve => setTimeout(resolve, secs * 1000));
}
class AtomWrapper extends React.Component {
constructor(props) {
super(props);
this.state = { file: 'package.json' };
}
async componentDidMount() {
await seconds(4);
this.setState({ file: 'WorkflowServerDemo.js' });
await seconds(2);
this.setState({ file: '../package.json' });/* eslint-env node */
import React from 'react';
import render, { Workspace, Layouts, requireComponent } from 'workflow-react';
const { SplitH, SplitV } = Layouts;
const Emacs = requireComponent('workflow-app-emacs');
const Terminal = requireComponent('workflow-app-terminal');
const Ssh = requireComponent('workflow-app-ssh');
export default render(workflow-react
This module contains a [react](https://github.com/facebook/react) binding library for writing workflow configuration files. The example below shows how to configure a 50-50 split between a text editor and a browser.
