How to use the blessed.form function in blessed

const startForm = ({
  screen,
  formProperties = {},
  submitLabel = 'Start',
  onSubmit = () => {},
}) => {
  // console.log(`arguments[0]: '${JSON.stringify(arguments[0])}'`);
  const form = blessed.form({
    label: 'Action Form',
    mouse: true,
    keys: true,
    vi: true,
    left: 0,
    top: 0,
    width: "100%",
    scrollable: true,
    scrollbar: {
      ch: " "
    },
    border: 'line',
    ...formProperties
  });

  form.on("submit", onSubmit);

function login_form(screen, kube_config, kubebox, { closable } = { closable: false }) {
  const form = blessed.form({
    name      : 'form',
    screen    : screen,
    keys      : true,
    clickable : true,
    left      : 'center',
    top       : 'center',
    width     : 53,
    height    : kube_config ? 9 : 7,
    shrink    : false,
    border    : { type : 'line' },
  });
  // retain key grabbing as text areas reset it after input reading / blurring
  form.on('focus', () => form.screen.grabKeys = true);

  form.on('element keypress', (el, ch, key) => {
    // submit the form on enter for textboxes

}
    },
    left: 'center',
    top: '15%',
    width: '70%',
    height: 21
  })

  // screen.on('keypress', function(ch, key) {
  //   if (connections.visible && key.name == 'escape') {
  //     connections.hide()
  //     screen.render()
  //   }
  // })

  var form = blessed.form({
    parent: connections,
    mouse: true,
    keys: true,
    vi: true,
    bg: 'white',
    fg: 'black',
    left: 1,
    right: 1,
    top: 1,
    bottom: 3
  })

  var list = connections._.list = blessed.list({
    parent: form,
    mouse: true,
    keys: true,

constructor(channel) {
        this.channel = channel;
        this.screen = this.channel.screen;
        this.api = this.channel.api;

        this.form = blessed.form({
            parent: this.channel.box,
            keys: true,
            left: 0,
            bottom: 0,
            width: '100%-2',
            height: 4,
            // border: {type: 'line'}
        });

        this.textbox = blessed.textbox({
            parent: this.form,
            left: 0,
            top: 0,
            width: '100%',
            height: 4,
            input: true,

function MessageForm(channel) {
        var _this = this;

        _classCallCheck(this, MessageForm);

        this.channel = channel;
        this.screen = this.channel.screen;
        this.api = this.channel.api;

        this.form = blessed.form({
            parent: this.channel.box,
            keys: true,
            left: 0,
            bottom: 0,
            width: '100%-2',
            height: 4
            // border: {type: 'line'}
        });

        this.textbox = blessed.textbox({
            parent: this.form,
            left: 0,
            top: 0,
            width: '100%',
            height: 4,
            input: true,

function login_dialog() {
  const form = blessed.form({
    keys   : true,
    mouse  : true,
    vi     : true,
    left   : 'center',
    top    : 'center',
    width  : 53,
    height : 10,
    shrink : 'never',
    border : {
      type : 'line'
    }
  });

  form.on('element keypress', (el, ch, key) => {
    if (key.name === 'enter') {
      form.submit();

export default contentContainer => {
  return blessed.form({
    bottom: 0,
    height: '100%',
    left: 0,
    parent: contentContainer,
    vi: true,
    width: '100%'
  });
};

module.exports.createToggleScreen = function(screen, callback) {
  var toggleForm = blessed.form({
    parent: screen,
    keys: true,
    type: "overlay",
    top: "center",
    left: "center",
    width: 35,
    height: 5,
    bg: colorScheme.background,
    color: "white"
  });

  let label = blessed.box({
    parent: toggleForm,
    top: 1,
    left: 2,
    width: 33,

module.exports.createLoginScreen = (screen, callback) => {
  let loginForm = null;
  loginForm = blessed.form({
    parent: screen,
    keys: true,
    type: "overlay",
    top: "center",
    left: "center",
    width: 45,
    height: 20,
    bg: colorScheme.background,
    color: "white"
  });

  let label = blessed.box({
    parent: loginForm,
    top: 1,
    left: "center",
    width: 16,

const eventForm = ({
  screen,
  formProperties = {},
  availableEvents = [],
  onSubmit = () => {}
}) => {
  const form = blessed.form({
    label: 'Action Form',
    mouse: true,
    keys: true,
    vi: true,
    left: 0,
    top: 0,
    width: "100%",
    scrollable: true,
    scrollbar: {
      ch: " "
    },
    border: 'line',
    ...formProperties
  });

  form.on("submit", function(data) {