@goldenpine/react-form-builder2 0.18.4-patch.1

package/lib/preview.js

@@ -0,0 +1,392 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _immutabilityHelper = _interopRequireDefault(require("immutability-helper"));
+var _store = _interopRequireDefault(require("./stores/store"));
+var _formDynamicEdit = _interopRequireDefault(require("./form-dynamic-edit"));
+var _sortableFormElements = _interopRequireDefault(require("./sortable-form-elements"));
+var _componentDragLayer = _interopRequireDefault(require("./form-elements/component-drag-layer"));
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /**
+  * <Preview />
+  */
+var PlaceHolder = _sortableFormElements["default"].PlaceHolder;
+var Preview = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(Preview, _React$Component);
+  var _super = _createSuper(Preview);
+  function Preview(props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, Preview);
+    _this = _super.call(this, props);
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+      data: [],
+      answer_data: {}
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "editModeOff", function (e) {
+      if (_this.editForm.current && !_this.editForm.current.contains(e.target)) {
+        _this.manualEditModeOff();
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "manualEditModeOff", function () {
+      var editElement = _this.props.editElement;
+      if (editElement && editElement.dirty) {
+        editElement.dirty = false;
+        _this.updateElement(editElement);
+      }
+      _this.props.manualEditModeOff();
+    });
+    var onLoad = props.onLoad,
+      onPost = props.onPost;
+    _store["default"].setExternalHandler(onLoad, onPost);
+    _this.editForm = /*#__PURE__*/_react["default"].createRef();
+    _this.state = {
+      data: props.data || [],
+      answer_data: {}
+    };
+    _this.seq = 0;
+    _this._onUpdate = _this._onChange.bind((0, _assertThisInitialized2["default"])(_this));
+    _this.getDataById = _this.getDataById.bind((0, _assertThisInitialized2["default"])(_this));
+    _this.moveCard = _this.moveCard.bind((0, _assertThisInitialized2["default"])(_this));
+    _this.insertCard = _this.insertCard.bind((0, _assertThisInitialized2["default"])(_this));
+    _this.setAsChild = _this.setAsChild.bind((0, _assertThisInitialized2["default"])(_this));
+    _this.removeChild = _this.removeChild.bind((0, _assertThisInitialized2["default"])(_this));
+    _this._onDestroy = _this._onDestroy.bind((0, _assertThisInitialized2["default"])(_this));
+    return _this;
+  }
+  (0, _createClass2["default"])(Preview, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var _this2 = this;
+      var _this$props = this.props,
+        data = _this$props.data,
+        url = _this$props.url,
+        saveUrl = _this$props.saveUrl,
+        saveAlways = _this$props.saveAlways;
+      _store["default"].subscribe(function (state) {
+        return _this2._onUpdate(state.data);
+      });
+      _store["default"].dispatch('load', {
+        loadUrl: url,
+        saveUrl: saveUrl,
+        data: data || [],
+        saveAlways: saveAlways
+      });
+      document.addEventListener('mousedown', this.editModeOff);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      document.removeEventListener('mousedown', this.editModeOff);
+    }
+  }, {
+    key: "_setValue",
+    value: function _setValue(text) {
+      return text.replace(/[^A-Z0-9]+/ig, '_').toLowerCase();
+    }
+  }, {
+    key: "updateElement",
+    value: function updateElement(element) {
+      var data = this.state.data;
+      var found = false;
+      for (var i = 0, len = data.length; i < len; i++) {
+        if (element.id === data[i].id) {
+          data[i] = element;
+          found = true;
+          break;
+        }
+      }
+      if (found) {
+        this.seq = this.seq > 100000 ? 0 : this.seq + 1;
+        _store["default"].dispatch('updateOrder', data);
+      }
+    }
+  }, {
+    key: "_onChange",
+    value: function _onChange(data) {
+      var _this3 = this;
+      var answer_data = {};
+      data.forEach(function (item) {
+        if (item && item.readOnly && _this3.props.variables[item.variableKey]) {
+          answer_data[item.field_name] = _this3.props.variables[item.variableKey];
+        }
+      });
+      this.setState({
+        data: data,
+        answer_data: answer_data
+      });
+    }
+  }, {
+    key: "_onDestroy",
+    value: function _onDestroy(item) {
+      var _this4 = this;
+      if (item.childItems) {
+        item.childItems.forEach(function (x) {
+          var child = _this4.getDataById(x);
+          if (child) {
+            _store["default"].dispatch('delete', child);
+          }
+        });
+      }
+      _store["default"].dispatch('delete', item);
+    }
+  }, {
+    key: "getDataById",
+    value: function getDataById(id) {
+      var data = this.state.data;
+      return data.find(function (x) {
+        return x && x.id === id;
+      });
+    }
+  }, {
+    key: "swapChildren",
+    value: function swapChildren(data, item, child, col) {
+      if (child.col !== undefined && item.id !== child.parentId) {
+        return false;
+      }
+      if (!(child.col !== undefined && child.col !== col && item.childItems[col])) {
+        // No child was assigned yet in both source and target.
+        return false;
+      }
+      var oldId = item.childItems[col];
+      var oldItem = this.getDataById(oldId);
+      var oldCol = child.col;
+      // eslint-disable-next-line no-param-reassign
+      item.childItems[oldCol] = oldId;
+      oldItem.col = oldCol;
+      // eslint-disable-next-line no-param-reassign
+      item.childItems[col] = child.id;
+      child.col = col;
+      _store["default"].dispatch('updateOrder', data);
+      return true;
+    }
+  }, {
+    key: "setAsChild",
+    value: function setAsChild(item, child, col, isBusy) {
+      var data = this.state.data;
+      if (this.swapChildren(data, item, child, col)) {
+        return;
+      }
+      if (isBusy) {
+        return;
+      }
+      var oldParent = this.getDataById(child.parentId);
+      var oldCol = child.col;
+      // eslint-disable-next-line no-param-reassign
+      item.childItems[col] = child.id;
+      child.col = col;
+      // eslint-disable-next-line no-param-reassign
+      child.parentId = item.id;
+      // eslint-disable-next-line no-param-reassign
+      child.parentIndex = data.indexOf(item);
+      if (oldParent) {
+        oldParent.childItems[oldCol] = null;
+      }
+      var list = data.filter(function (x) {
+        return x && x.parentId === item.id;
+      });
+      var toRemove = list.filter(function (x) {
+        return item.childItems.indexOf(x.id) === -1;
+      });
+      var newData = data;
+      if (toRemove.length) {
+        // console.log('toRemove', toRemove);
+        newData = data.filter(function (x) {
+          return toRemove.indexOf(x) === -1;
+        });
+      }
+      if (!this.getDataById(child.id)) {
+        newData.push(child);
+      }
+      _store["default"].dispatch('updateOrder', newData);
+    }
+  }, {
+    key: "removeChild",
+    value: function removeChild(item, col) {
+      var data = this.state.data;
+      var oldId = item.childItems[col];
+      var oldItem = this.getDataById(oldId);
+      if (oldItem) {
+        var newData = data.filter(function (x) {
+          return x !== oldItem;
+        });
+        // eslint-disable-next-line no-param-reassign
+        item.childItems[col] = null;
+        // delete oldItem.parentId;
+        this.seq = this.seq > 100000 ? 0 : this.seq + 1;
+        _store["default"].dispatch('updateOrder', newData);
+        this.setState({
+          data: newData
+        });
+      }
+    }
+  }, {
+    key: "restoreCard",
+    value: function restoreCard(item, id) {
+      var data = this.state.data;
+      var parent = this.getDataById(item.data.parentId);
+      var oldItem = this.getDataById(id);
+      if (parent && oldItem) {
+        var newIndex = data.indexOf(oldItem);
+        var newData = (0, _toConsumableArray2["default"])(data); // data.filter(x => x !== oldItem);
+        // eslint-disable-next-line no-param-reassign
+        parent.childItems[oldItem.col] = null;
+        delete oldItem.parentId;
+        // eslint-disable-next-line no-param-reassign
+        delete item.setAsChild;
+        // eslint-disable-next-line no-param-reassign
+        delete item.parentIndex;
+        // eslint-disable-next-line no-param-reassign
+        item.index = newIndex;
+        this.seq = this.seq > 100000 ? 0 : this.seq + 1;
+        _store["default"].dispatch('updateOrder', newData);
+        this.setState({
+          data: newData
+        });
+      }
+    }
+  }, {
+    key: "insertCard",
+    value: function insertCard(item, hoverIndex, id) {
+      var data = this.state.data;
+      if (id) {
+        this.restoreCard(item, id);
+      } else {
+        data.splice(hoverIndex, 0, item);
+        this.saveData(item, hoverIndex, hoverIndex);
+        _store["default"].dispatch('insertItem', item);
+      }
+    }
+  }, {
+    key: "moveCard",
+    value: function moveCard(dragIndex, hoverIndex) {
+      var data = this.state.data;
+      var dragCard = data[dragIndex];
+      // happens sometimes when you click to insert a new item from the toolbox
+      if (dragCard !== undefined) {
+        this.saveData(dragCard, dragIndex, hoverIndex);
+      }
+    }
+
+    // eslint-disable-next-line no-unused-vars
+  }, {
+    key: "cardPlaceHolder",
+    value: function cardPlaceHolder(dragIndex, hoverIndex) {
+      // Dummy
+    }
+  }, {
+    key: "saveData",
+    value: function saveData(dragCard, dragIndex, hoverIndex) {
+      var newData = (0, _immutabilityHelper["default"])(this.state, {
+        data: {
+          $splice: [[dragIndex, 1], [hoverIndex, 0, dragCard]]
+        }
+      });
+      this.setState(newData);
+      _store["default"].dispatch('updateOrder', newData.data);
+    }
+  }, {
+    key: "getElement",
+    value: function getElement(item, index) {
+      if (item.custom) {
+        if (!item.component || typeof item.component !== 'function') {
+          // eslint-disable-next-line no-param-reassign
+          item.component = this.props.registry.get(item.key);
+        }
+      }
+      var SortableFormElement = _sortableFormElements["default"][item.element];
+      if (SortableFormElement === null) {
+        return null;
+      }
+      return /*#__PURE__*/_react["default"].createElement(SortableFormElement, {
+        id: item.id,
+        seq: this.seq,
+        index: index,
+        moveCard: this.moveCard,
+        insertCard: this.insertCard,
+        mutable: false,
+        parent: this.props.parent,
+        editModeOn: this.props.editModeOn,
+        isDraggable: true,
+        key: item.id,
+        sortData: item.id,
+        data: item,
+        getDataById: this.getDataById,
+        setAsChild: this.setAsChild,
+        removeChild: this.removeChild,
+        _onDestroy: this._onDestroy
+      });
+    }
+  }, {
+    key: "showEditForm",
+    value: function showEditForm() {
+      var _this5 = this;
+      var handleUpdateElement = function handleUpdateElement(element) {
+        return _this5.updateElement(element);
+      };
+      handleUpdateElement.bind(this);
+      var formElementEditProps = {
+        showCorrectColumn: this.props.showCorrectColumn,
+        files: this.props.files,
+        manualEditModeOff: this.manualEditModeOff,
+        preview: this,
+        element: this.props.editElement,
+        updateElement: handleUpdateElement
+      };
+      return this.props.renderEditForm(formElementEditProps);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this6 = this;
+      var classes = this.props.className;
+      if (this.props.editMode) {
+        classes += ' is-editing';
+      }
+      var data = this.state.data.filter(function (x) {
+        return !!x && !x.parentId;
+      });
+      var items = data.map(function (item, index) {
+        return _this6.getElement(item, index);
+      });
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: "edit-form",
+        ref: this.editForm
+      }, this.props.editElement !== null && this.showEditForm()), /*#__PURE__*/_react["default"].createElement("div", {
+        className: "Sortable"
+      }, items), /*#__PURE__*/_react["default"].createElement(PlaceHolder, {
+        id: "form-place-holder",
+        show: items.length === 0,
+        index: items.length,
+        moveCard: this.cardPlaceHolder,
+        insertCard: this.insertCard
+      }), /*#__PURE__*/_react["default"].createElement(_componentDragLayer["default"], null));
+    }
+  }]);
+  return Preview;
+}(_react["default"].Component);
+exports["default"] = Preview;
+Preview.defaultProps = {
+  showCorrectColumn: false,
+  files: [],
+  editMode: false,
+  editElement: null,
+  className: 'col-md-9 react-form-builder-preview float-left',
+  renderEditForm: function renderEditForm(props) {
+    return /*#__PURE__*/_react["default"].createElement(_formDynamicEdit["default"], props);
+  }
+};

package/lib/sortable-element.js

@@ -0,0 +1,177 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = _default;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactDom = require("react-dom");
+var _reactDnd = require("react-dnd");
+var _ItemTypes = _interopRequireDefault(require("./ItemTypes"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+var style = {
+  border: '1px dashed gray',
+  padding: '0.5rem 1rem',
+  marginBottom: '.5rem',
+  backgroundColor: 'white',
+  cursor: 'pointer'
+};
+var cardSource = {
+  beginDrag: function beginDrag(props) {
+    return {
+      itemType: _ItemTypes["default"].CARD,
+      id: props.id,
+      index: props.index
+    };
+  }
+};
+var cardTarget = {
+  drop: function drop(props, monitor, component) {
+    if (!component) {
+      return;
+    }
+    var item = monitor.getItem();
+    var hoverIndex = props.index;
+    var dragIndex = item.index;
+    if (props.data && props.data.isContainer || item.itemType === _ItemTypes["default"].CARD) {
+      // console.log('cardTarget -  Drop', item.itemType);
+      return;
+    }
+    if (item.data && typeof item.setAsChild === 'function') {
+      // console.log('BOX', item);
+      if (dragIndex === -1) {
+        props.insertCard(item, hoverIndex, item.id);
+      }
+    }
+  },
+  hover: function hover(props, monitor, component) {
+    var _props$data, _item$data;
+    var item = monitor.getItem();
+    if (item.itemType === _ItemTypes["default"].BOX && item.index === -1) return;
+
+    // Don't replace multi-column component unless both drag & hover are multi-column
+    if ((_props$data = props.data) !== null && _props$data !== void 0 && _props$data.isContainer && !((_item$data = item.data) !== null && _item$data !== void 0 && _item$data.isContainer)) return;
+    var dragIndex = item.index;
+    var hoverIndex = props.index;
+
+    // Don't replace items with themselves
+    if (dragIndex === hoverIndex) {
+      return;
+    }
+    if (dragIndex === -1) {
+      if (props.data && props.data.isContainer) {
+        return;
+      }
+      // console.log('CARD', item);
+      item.index = hoverIndex;
+      props.insertCard(item.onCreate(item.data), hoverIndex);
+    }
+
+    // Determine rectangle on screen
+    var hoverBoundingRect = (0, _reactDom.findDOMNode)(component).getBoundingClientRect();
+
+    // Get vertical middle
+    var hoverMiddleY = (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;
+
+    // Determine mouse position
+    var clientOffset = monitor.getClientOffset();
+
+    // Get pixels to the top
+    var hoverClientY = clientOffset.y - hoverBoundingRect.top;
+
+    // Only perform the move when the mouse has crossed half of the items height
+    // When dragging downwards, only move when the cursor is below 50%
+    // When dragging upwards, only move when the cursor is above 50%
+
+    // Dragging downwards
+    if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) {
+      return;
+    }
+
+    // Dragging upwards
+    if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) {
+      return;
+    }
+
+    // Time to actually perform the action
+    props.moveCard(dragIndex, hoverIndex);
+
+    // Note: we're mutating the monitor item here!
+    // Generally it's better to avoid mutations,
+    // but it's good here for the sake of performance
+    // to avoid expensive index searches.
+
+    // if (item.itemType == ItemTypes.BOX) item.cardIndex = hoverIndex;
+    // else
+    item.index = hoverIndex;
+  }
+};
+
+// eslint-disable-next-line no-unused-vars
+function _default(ComposedComponent) {
+  var Card = /*#__PURE__*/function (_Component) {
+    (0, _inherits2["default"])(Card, _Component);
+    var _super = _createSuper(Card);
+    function Card() {
+      (0, _classCallCheck2["default"])(this, Card);
+      return _super.apply(this, arguments);
+    }
+    (0, _createClass2["default"])(Card, [{
+      key: "render",
+      value: function render() {
+        var _this$props = this.props,
+          isDragging = _this$props.isDragging,
+          connectDragPreview = _this$props.connectDragPreview,
+          connectDropTarget = _this$props.connectDropTarget;
+        var opacity = isDragging ? 0 : 1;
+        return connectDragPreview(connectDropTarget(/*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(ComposedComponent, (0, _extends2["default"])({}, this.props, {
+          style: _objectSpread(_objectSpread({}, style), {}, {
+            opacity: opacity
+          })
+        })))));
+      }
+    }]);
+    return Card;
+  }(_react.Component);
+  (0, _defineProperty2["default"])(Card, "propTypes", {
+    connectDragSource: _propTypes["default"].func,
+    connectDragPreview: _propTypes["default"].func,
+    connectDropTarget: _propTypes["default"].func,
+    index: _propTypes["default"].number.isRequired,
+    isDragging: _propTypes["default"].bool,
+    id: _propTypes["default"].any.isRequired,
+    // text: PropTypes.string.isRequired,
+    moveCard: _propTypes["default"].func.isRequired,
+    seq: _propTypes["default"].number
+  });
+  (0, _defineProperty2["default"])(Card, "defaultProps", {
+    seq: -1
+  });
+  var x = (0, _reactDnd.DropTarget)([_ItemTypes["default"].CARD, _ItemTypes["default"].BOX], cardTarget, function (connect) {
+    return {
+      connectDropTarget: connect.dropTarget()
+    };
+  })(Card);
+  return (0, _reactDnd.DragSource)(_ItemTypes["default"].CARD, cardSource, function (connect, monitor) {
+    return {
+      connectDragSource: connect.dragSource(),
+      connectDragPreview: connect.dragPreview(),
+      isDragging: monitor.isDragging()
+    };
+  })(x);
+}

package/lib/sortable-form-elements.js

@@ -0,0 +1,66 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _sortableElement = _interopRequireDefault(require("./sortable-element"));
+var _formPlaceHolder = _interopRequireDefault(require("./form-place-holder"));
+var _formElements = _interopRequireDefault(require("./form-elements"));
+var _multiColumn = require("./multi-column");
+var _fieldset = require("./fieldset");
+var _customElement = _interopRequireDefault(require("./form-elements/custom-element"));
+var Header = _formElements["default"].Header,
+  Paragraph = _formElements["default"].Paragraph,
+  Label = _formElements["default"].Label,
+  LineBreak = _formElements["default"].LineBreak,
+  TextInput = _formElements["default"].TextInput,
+  EmailInput = _formElements["default"].EmailInput,
+  PhoneNumber = _formElements["default"].PhoneNumber,
+  NumberInput = _formElements["default"].NumberInput,
+  TextArea = _formElements["default"].TextArea,
+  Dropdown = _formElements["default"].Dropdown,
+  Checkboxes = _formElements["default"].Checkboxes,
+  DatePicker = _formElements["default"].DatePicker,
+  RadioButtons = _formElements["default"].RadioButtons,
+  Image = _formElements["default"].Image,
+  Rating = _formElements["default"].Rating,
+  Tags = _formElements["default"].Tags,
+  Signature = _formElements["default"].Signature,
+  HyperLink = _formElements["default"].HyperLink,
+  Download = _formElements["default"].Download,
+  Camera = _formElements["default"].Camera,
+  Range = _formElements["default"].Range,
+  FileUpload = _formElements["default"].FileUpload;
+var FormElements = {};
+FormElements.Header = (0, _sortableElement["default"])(Header);
+FormElements.Paragraph = (0, _sortableElement["default"])(Paragraph);
+FormElements.Label = (0, _sortableElement["default"])(Label);
+FormElements.LineBreak = (0, _sortableElement["default"])(LineBreak);
+FormElements.TextInput = (0, _sortableElement["default"])(TextInput);
+FormElements.EmailInput = (0, _sortableElement["default"])(EmailInput);
+FormElements.PhoneNumber = (0, _sortableElement["default"])(PhoneNumber);
+FormElements.NumberInput = (0, _sortableElement["default"])(NumberInput);
+FormElements.TextArea = (0, _sortableElement["default"])(TextArea);
+FormElements.Dropdown = (0, _sortableElement["default"])(Dropdown);
+FormElements.Signature = (0, _sortableElement["default"])(Signature);
+FormElements.Checkboxes = (0, _sortableElement["default"])(Checkboxes);
+FormElements.DatePicker = (0, _sortableElement["default"])(DatePicker);
+FormElements.RadioButtons = (0, _sortableElement["default"])(RadioButtons);
+FormElements.Image = (0, _sortableElement["default"])(Image);
+FormElements.Rating = (0, _sortableElement["default"])(Rating);
+FormElements.Tags = (0, _sortableElement["default"])(Tags);
+FormElements.HyperLink = (0, _sortableElement["default"])(HyperLink);
+FormElements.Download = (0, _sortableElement["default"])(Download);
+FormElements.Camera = (0, _sortableElement["default"])(Camera);
+FormElements.FileUpload = (0, _sortableElement["default"])(FileUpload);
+FormElements.Range = (0, _sortableElement["default"])(Range);
+FormElements.PlaceHolder = (0, _sortableElement["default"])(_formPlaceHolder["default"]);
+FormElements.FieldSet = (0, _sortableElement["default"])(_fieldset.FieldSet);
+FormElements.TwoColumnRow = (0, _sortableElement["default"])(_multiColumn.TwoColumnRow);
+FormElements.ThreeColumnRow = (0, _sortableElement["default"])(_multiColumn.ThreeColumnRow);
+FormElements.MultiColumnRow = (0, _sortableElement["default"])(_multiColumn.MultiColumnRow);
+FormElements.CustomElement = (0, _sortableElement["default"])(_customElement["default"]);
+var _default = FormElements;
+exports["default"] = _default;

package/lib/stores/registry.js

@@ -0,0 +1,42 @@
+"use strict";
+
+/* eslint-disable no-use-before-define */
+function regg() {
+  var registry = {};
+  var self = {
+    register: register,
+    list: list,
+    get: get
+  };
+
+  /**
+   * Registers a entry and make it read only
+   * @param {String} name To get the entry by
+   * @param {Object} entry What you want to register
+   */
+  function register(name, entry) {
+    if (!name) {
+      throw new Error('You must provide a valid name for this entry.');
+    }
+    if (registry[name] !== undefined) {
+      throw new Error("'".concat(name, "' already registered"));
+    }
+    if (!entry) {
+      throw new Error("You must provide something to register as '".concat(name, "'"));
+    }
+    registry[name] = entry;
+    return self;
+  }
+  function get(name) {
+    // eslint-disable-next-line no-prototype-builtins
+    if (!registry.hasOwnProperty(name)) {
+      console.error("No such entry '".concat(name, "'"));
+    }
+    return registry[name];
+  }
+  function list() {
+    return Object.keys(registry);
+  }
+  return self;
+}
+module.exports = regg();