formit/lib/FormElements.js

A speedy way to create HTML forms.

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

import renderForm from './renderForm';

const defaultOptions = {
  fieldGroupClassName: '',
  fieldClassName: '',
  formClassName: '',
  labelClassName: '',
  nestedGroupClassName: '',
  nestedFieldClassName: '',
  shouldNestFieldWithinLabel: true,
  submitClassName: '',
  onWillRender: () => {},
  onDidRender: () => {}
};

const FormElements = (selector = '', elements = [], options = defaultOptions) => {
  if (!selector) return;
  const mountNode = document.querySelector(selector);
  if (!mountNode) return;

  const props = _extends({}, defaultOptions, options);
  const {
    fieldGroupClassName,
    fieldClassName,
    formClassName,
    labelClassName,
    nestedGroupClassName,
    nestedFieldClassName,
    submitClassName,
    onWillRender,
    onDidRender,
    shouldNestFieldWithinLabel
  } = props;

  const classNames = {
    fieldGroupClassName,
    fieldClassName,
    formClassName,
    labelClassName,
    nestedGroupClassName,
    nestedFieldClassName,
    submitClassName
  };

  onWillRender(mountNode, { elements, options });

  renderForm(mountNode, elements, { classNames, shouldNestFieldWithinLabel });

  onDidRender(mountNode, { elements, options });
};

window.Formit = FormElements;

export default FormElements;