@findify/mjs/lib/helpers/appendFeature.js

Findify widgets

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.mutateDom = undefined;

var _reactDom = require("react-dom");

var _findClosestElement = require("./findClosestElement");

var _findClosestElement2 = _interopRequireDefault(_findClosestElement);

var _registerHooks = require("./registerHooks");

var _registerHooks2 = _interopRequireDefault(_registerHooks);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var createDiv = function createDiv(className) {
  var div = document.createElement('div');
  if (className) div.className = className;
  return div;
};

var mutateDom = exports.mutateDom = function mutateDom(node, appendTo) {
  var reactRoot = createDiv('findify-root');

  if (appendTo === 'self') {
    node.innerHTML = '';
    node.appendChild(reactRoot);
  } else if (appendTo === 'parent') {
    var wrapper = createDiv('findify-component-wrapper');
    var nodeClone = node.cloneNode(true);
    var parent = node.parentNode;
    wrapper.appendChild(node);
    wrapper.appendChild(reactRoot);
    parent.append(wrapper);
  } else {
    var _wrapper = document.getElementsByTagName('body')[0];

    _wrapper.appendChild(reactRoot);
  }

  if (node.tagName === 'INPUT') {
    node.autocomplete = 'off';
    var form = (0, _findClosestElement2.default)('form')(node);
    if (form) form.removeAttribute('onsubmit');
  }

  return reactRoot;
};

exports.default = function (analytics) {
  return function (_ref) {
    var node = _ref.node,
        type = _ref.type,
        config = _ref.config,
        initialHTML = _ref.initialHTML;
    var componentDOMRoot;

    var featureCreator = require("../features/".concat(type, "/index.tsx")).default;

    (0, _registerHooks2.default)({
      type: type,
      config: config
    }, function (config, hooks) {
      var _featureCreator = featureCreator({
        type: type,
        node: node,
        config: config,
        hooks: hooks,
        analytics: analytics,
        initialHTML: initialHTML
      }),
          appendTo = _featureCreator.appendTo,
          Component = _featureCreator.Component;

      componentDOMRoot = componentDOMRoot || mutateDom(node, config.appendTo || appendTo);
      (0, _reactDom.render)(Component, componentDOMRoot);
    });
  };
};