@onereach/webform/src/lib.js

Content Builder includes several views for: - Content builder view itself; - Web Form view; - Slack block-kit builder;

import Vue from 'vue';
import orUI from '@onereach/ui';
import 'keen-ui/dist/keen-ui.css';
import '@onereach/ui/dist/or-ui.css';
import WebFormLib from './views/webform/WebFormLib.vue';
import EventBus from './helpers/eventBus';
import constants from '@/constants';
import { sliceTicks } from '@/utils/index.js';
import { buildStore } from './store';
export default class App {
  constructor (options = {}) {
    if (!options.formUrl) {
      console.warn('Rich Web Form: No form url found');
    }

    this.config = App.mergeSettings(options);

    const wrapper = document.createElement('div');
    this.selector = document.querySelector(this.config.selector);

    if (this.selector === null) {
      throw new Error('Something wrong with your selector 😭');
    }

    this.selector.appendChild(wrapper);

    Vue.use(orUI);

    const store = buildStore({ formKey: options.key, mode: 'lib' });
    Vue.prototype.$sliceTicks = sliceTicks;
    Vue.prototype.$constants = constants;

    this.app = new Vue({
      el: wrapper,
      store,
      render: h => h(
        WebFormLib,
        {
          props: {
            ...this.config
          }
        }
      )
    });

    this.EventBus = EventBus;
  }

  on (event, fn) {
    this.EventBus.$on(event, fn);
  }

  emit (event, params) {
    this.EventBus.$emit(event, params);
  }

  static mergeSettings (options) {
    const settings = {
      selector: '#rwf',
      hideSubmitButton: false,
      hideCancelButton: false
    };

    const userSttings = options;
    for (const attrname in userSttings) {
      settings[attrname] = userSttings[attrname];
    }

    return settings;
  }

  // public methods
  submit () {
    this.EventBus.$emit('webform-submit');
  }
}