react-survey-builder 1.0.84 → 1.0.86

package/dist/bundle.js

@@ -895,7 +895,7 @@ eval("/* eslint-disable */\n// Private array of chars to use\nvar CHARS = '01234
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements/component-header */ \"./src/survey-elements/component-header.jsx\");\n/* harmony import */ var _multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../multi-column/dustbin */ \"./src/multi-column/dustbin.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _survey_elements_myxss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../survey-elements/myxss */ \"./src/survey-elements/myxss.js\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nvar _excluded = [\"item\", \"controls\", \"items\", \"editModeOn\", \"getItemById\", \"setAsChild\", \"removeChild\", \"seq\", \"index\", \"style\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\n/* eslint-disable camelcase */\n\n\n\n\n\n\n\nvar accepts = [_ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].BOX, _ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].CARD];\nvar ComponentLegend = function ComponentLegend(_ref) {\n  var item = _ref.item;\n  var labelText = _survey_elements_myxss__WEBPACK_IMPORTED_MODULE_4__[\"default\"].process(item.label);\n  if (!labelText || !labelText.trim()) {\n    return null;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"legend\", {\n    dangerouslySetInnerHTML: {\n      __html: labelText\n    }\n  });\n};\nvar FieldsetBase = function FieldsetBase(_ref2) {\n  var item = _ref2.item,\n    controls = _ref2.controls,\n    items = _ref2.items,\n    editModeOn = _ref2.editModeOn,\n    getItemById = _ref2.getItemById,\n    setAsChild = _ref2.setAsChild,\n    removeChild = _ref2.removeChild,\n    seq = _ref2.seq,\n    index = _ref2.index,\n    style = _ref2.style,\n    otherProps = _objectWithoutProperties(_ref2, _excluded);\n  var pageBreakBefore = item.pageBreakBefore;\n  var baseClasses = \"SortableItem rfb-item\";\n  if (pageBreakBefore) {\n    baseClasses += \" alwaysbreak\";\n  }\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems) ? _toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems) : [null]),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    childItemIds = _React$useState2[0],\n    setChildItemIds = _React$useState2[1];\n  var _onDropSuccess = function onDropSuccess(droppedIndex) {\n    // let updatedItem = isObjectNotEmpty(item) ? { ...item } : {};\n    // let existingChildItemIds = isListNotEmpty(updatedItem.childItems) ? [...updatedItem.childItems] : [null];\n    // const isLastChild = existingChildItemIds === (droppedIndex + 1);\n    // console.log('onDropSuccess', droppedIndex, existingChildItemIds, childItemIds, item, isLastChild);\n\n    // if (isLastChild) {\n    //     let updatedChildItemIds = Array.from({ length: existingChildItemIds.length + 1 }, (v, i) => { return existingChildItemIds[i] ? existingChildItemIds[i] : null });\n    //     setChildItemIds(updatedChildItemIds);\n    // }\n  };\n  react__WEBPACK_IMPORTED_MODULE_0___default().useEffect(function () {\n    if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems)) {\n      setChildItemIds([].concat(_toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems), [null]));\n    } else {\n      setChildItemIds([null]);\n    }\n  }, [item]);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({}, style),\n    className: baseClasses\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _extends({\n    item: item,\n    index: index,\n    editModeOn: editModeOn,\n    setAsChild: setAsChild\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"fieldset\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ComponentLegend, {\n    item: item\n  }), childItemIds === null || childItemIds === void 0 ? void 0 : childItemIds.map(function (childItemId, childItemIndex) {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      key: \"\".concat(childItemIndex, \"_\").concat(childItemId || \"_\")\n    }, controls ? controls[childItemIndex] : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n      style: {\n        width: \"100%\"\n      },\n      item: item,\n      accepts: accepts,\n      items: childItemIds,\n      key: childItemIndex,\n      col: childItemIndex,\n      onDropSuccess: function onDropSuccess() {\n        _onDropSuccess(childItemIndex);\n      },\n      parentIndex: index,\n      editModeOn: editModeOn,\n      _onDestroy: function _onDestroy() {\n        removeChild(item, childItemIndex);\n      },\n      getItemById: getItemById,\n      setAsChild: setAsChild,\n      seq: seq,\n      rowNo: childItemIndex\n    }));\n  })));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FieldsetBase);\n\n//# sourceURL=webpack://react-survey-builder/./src/fieldset/Fieldset.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements/component-header */ \"./src/survey-elements/component-header.jsx\");\n/* harmony import */ var _multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../multi-column/dustbin */ \"./src/multi-column/dustbin.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _survey_elements_myxss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../survey-elements/myxss */ \"./src/survey-elements/myxss.js\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nvar _excluded = [\"item\", \"controls\", \"items\", \"editModeOn\", \"getItemById\", \"setAsChild\", \"removeChild\", \"seq\", \"index\", \"style\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\n/* eslint-disable camelcase */\n\n\n\n\n\n\n\nvar accepts = [_ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].BOX, _ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].CARD];\nvar ComponentLegend = function ComponentLegend(_ref) {\n  var item = _ref.item;\n  var labelText = _survey_elements_myxss__WEBPACK_IMPORTED_MODULE_4__[\"default\"].process(item.label);\n  if (!labelText || !labelText.trim()) {\n    return null;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"legend\", {\n    dangerouslySetInnerHTML: {\n      __html: labelText\n    }\n  });\n};\nvar FieldsetBase = function FieldsetBase(_ref2) {\n  var item = _ref2.item,\n    controls = _ref2.controls,\n    items = _ref2.items,\n    editModeOn = _ref2.editModeOn,\n    getItemById = _ref2.getItemById,\n    setAsChild = _ref2.setAsChild,\n    removeChild = _ref2.removeChild,\n    seq = _ref2.seq,\n    index = _ref2.index,\n    style = _ref2.style,\n    otherProps = _objectWithoutProperties(_ref2, _excluded);\n  var pageBreakBefore = item.pageBreakBefore;\n  var baseClasses = \"SortableItem rfb-item\";\n  if (pageBreakBefore) {\n    baseClasses += \" alwaysbreak\";\n  }\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems) ? _toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems) : [null]),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    childItemIds = _React$useState2[0],\n    setChildItemIds = _React$useState2[1];\n  var _onDropSuccess = function onDropSuccess(droppedIndex) {\n    // let updatedItem = isObjectNotEmpty(item) ? { ...item } : {};\n    // let existingChildItemIds = isListNotEmpty(updatedItem.childItems) ? [...updatedItem.childItems] : [null];\n    // const isLastChild = existingChildItemIds === (droppedIndex + 1);\n    // console.log('onDropSuccess', droppedIndex, existingChildItemIds, childItemIds, item, isLastChild);\n\n    // if (isLastChild) {\n    //     let updatedChildItemIds = Array.from({ length: existingChildItemIds.length + 1 }, (v, i) => { return existingChildItemIds[i] ? existingChildItemIds[i] : null });\n    //     setChildItemIds(updatedChildItemIds);\n    // }\n  };\n  react__WEBPACK_IMPORTED_MODULE_0___default().useEffect(function () {\n    if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_5__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems)) {\n      setChildItemIds([].concat(_toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems), [null]));\n    } else {\n      setChildItemIds([null]);\n    }\n  }, [item]);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({}, style),\n    className: baseClasses\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _extends({\n    item: item,\n    index: index,\n    editModeOn: editModeOn,\n    setAsChild: setAsChild\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"fieldset\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ComponentLegend, {\n    item: item\n  }), childItemIds === null || childItemIds === void 0 ? void 0 : childItemIds.map(function (childItemId, childItemIndex) {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      key: \"\".concat(childItemIndex, \"_\").concat(childItemId || \"_\")\n    }, controls ? controls[childItemIndex] : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n      style: {\n        width: \"100%\"\n      },\n      item: item,\n      accepts: accepts,\n      items: childItemIds,\n      key: childItemIndex,\n      col: childItemIndex,\n      onDropSuccess: function onDropSuccess() {\n        _onDropSuccess(childItemIndex);\n      },\n      parentIndex: index,\n      editModeOn: editModeOn,\n      _onDestroy: function _onDestroy() {\n        removeChild(item, childItemIndex);\n      },\n      getItemById: getItemById,\n      setAsChild: setAsChild,\n      seq: seq,\n      rowNo: childItemIndex,\n      checkboxButtonClassName: item === null || item === void 0 ? void 0 : item.checkboxButtonClassName,\n      headerClassName: item === null || item === void 0 ? void 0 : item.headerClassName,\n      labelClassName: item === null || item === void 0 ? void 0 : item.labelClassName,\n      paragraphClassName: item === null || item === void 0 ? void 0 : item.paragraphClassName,\n      staticVariables: item === null || item === void 0 ? void 0 : item.staticVariables\n    }));\n  })));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FieldsetBase);\n\n//# sourceURL=webpack://react-survey-builder/./src/fieldset/Fieldset.jsx?");
 
 /***/ }),
 
@@ -961,7 +961,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   MultiColumnRow: () => (/* binding */ MultiColumnRow),\n/* harmony export */   ThreeColumnRow: () => (/* binding */ ThreeColumnRow),\n/* harmony export */   TwoColumnRow: () => (/* binding */ TwoColumnRow)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements/component-header */ \"./src/survey-elements/component-header.jsx\");\n/* harmony import */ var _survey_elements_component_label__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../survey-elements/component-label */ \"./src/survey-elements/component-label.jsx\");\n/* harmony import */ var _dustbin__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./dustbin */ \"./src/multi-column/dustbin.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Row.js\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nvar _excluded = [\"controls\", \"item\", \"items\", \"editModeOn\", \"getItemById\", \"setAsChild\", \"removeChild\", \"seq\", \"className\", \"index\", \"style\"],\n  _excluded2 = [\"item\", \"className\"],\n  _excluded3 = [\"item\", \"className\"],\n  _excluded4 = [\"item\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\n/* eslint-disable camelcase */\n\n\n\n\n\n\nvar accepts = [_ItemTypes__WEBPACK_IMPORTED_MODULE_4__[\"default\"].BOX, _ItemTypes__WEBPACK_IMPORTED_MODULE_4__[\"default\"].CARD];\nvar MultiColumnRowBase = function MultiColumnRowBase(_ref) {\n  var controls = _ref.controls,\n    item = _ref.item,\n    items = _ref.items,\n    editModeOn = _ref.editModeOn,\n    getItemById = _ref.getItemById,\n    setAsChild = _ref.setAsChild,\n    removeChild = _ref.removeChild,\n    seq = _ref.seq,\n    className = _ref.className,\n    index = _ref.index,\n    style = _ref.style,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var childItems = item.childItems,\n    pageBreakBefore = item.pageBreakBefore;\n  var baseClasses = 'SortableItem rfb-item';\n  if (pageBreakBefore) {\n    baseClasses += ' alwaysbreak';\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({}, style),\n    className: baseClasses\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _extends({\n    item: item,\n    isFieldSet: false,\n    index: index,\n    editModeOn: editModeOn,\n    setAsChild: setAsChild\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_label__WEBPACK_IMPORTED_MODULE_2__[\"default\"], _extends({\n    item: item\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_5__[\"default\"], null, childItems.map(function (childItemId, childItemIndex) {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      key: \"\".concat(childItemIndex, \"_\").concat(childItemId || '_'),\n      className: className\n    }, controls ? controls[childItemIndex] : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dustbin__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n      style: {\n        width: '100%'\n      },\n      item: item,\n      accepts: accepts,\n      items: childItems,\n      col: childItemIndex,\n      parentIndex: index,\n      editModeOn: editModeOn,\n      _onDestroy: function _onDestroy() {\n        removeChild(item, childItemIndex);\n      },\n      getItemById: getItemById,\n      setAsChild: setAsChild,\n      seq: seq\n    }));\n  }))));\n};\nvar TwoColumnRow = function TwoColumnRow(_ref2) {\n  var item = _ref2.item,\n    className = _ref2.className,\n    rest = _objectWithoutProperties(_ref2, _excluded2);\n  var classNameVal = className || 'col-md-6';\n  if (!item.childItems) {\n    // eslint-disable-next-line no-param-reassign\n    item.childItems = [null, null];\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(MultiColumnRowBase, _extends({}, rest, {\n    className: classNameVal,\n    item: item\n  }));\n};\nvar ThreeColumnRow = function ThreeColumnRow(_ref3) {\n  var item = _ref3.item,\n    className = _ref3.className,\n    rest = _objectWithoutProperties(_ref3, _excluded3);\n  var classNameVal = className || 'col-md-4';\n  if (!item.childItems) {\n    // eslint-disable-next-line no-param-reassign\n    item.childItems = [null, null, null];\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(MultiColumnRowBase, _extends({}, rest, {\n    className: classNameVal,\n    item: item\n  }));\n};\nvar MultiColumnRow = function MultiColumnRow(_ref4) {\n  var item = _ref4.item,\n    rest = _objectWithoutProperties(_ref4, _excluded4);\n  var colCount = item.colCount || 4;\n  var classNameVal = item.className || (colCount === 4 ? 'col-md-3' : 'col');\n  if (!item.childItems) {\n    // eslint-disable-next-line no-param-reassign\n    item.childItems = Array.from({\n      length: colCount\n    }, function (v, i) {\n      return null;\n    });\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(MultiColumnRowBase, _extends({}, rest, {\n    className: classNameVal,\n    item: item\n  }));\n};\n\n\n//# sourceURL=webpack://react-survey-builder/./src/multi-column/MultiColumnRow.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   MultiColumnRow: () => (/* binding */ MultiColumnRow),\n/* harmony export */   ThreeColumnRow: () => (/* binding */ ThreeColumnRow),\n/* harmony export */   TwoColumnRow: () => (/* binding */ TwoColumnRow)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements/component-header */ \"./src/survey-elements/component-header.jsx\");\n/* harmony import */ var _survey_elements_component_label__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../survey-elements/component-label */ \"./src/survey-elements/component-label.jsx\");\n/* harmony import */ var _dustbin__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./dustbin */ \"./src/multi-column/dustbin.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Row.js\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nvar _excluded = [\"controls\", \"item\", \"items\", \"editModeOn\", \"getItemById\", \"setAsChild\", \"removeChild\", \"seq\", \"className\", \"index\", \"style\"],\n  _excluded2 = [\"item\", \"className\"],\n  _excluded3 = [\"item\", \"className\"],\n  _excluded4 = [\"item\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\n/* eslint-disable camelcase */\n\n\n\n\n\n\nvar accepts = [_ItemTypes__WEBPACK_IMPORTED_MODULE_4__[\"default\"].BOX, _ItemTypes__WEBPACK_IMPORTED_MODULE_4__[\"default\"].CARD];\nvar MultiColumnRowBase = function MultiColumnRowBase(_ref) {\n  var controls = _ref.controls,\n    item = _ref.item,\n    items = _ref.items,\n    editModeOn = _ref.editModeOn,\n    getItemById = _ref.getItemById,\n    setAsChild = _ref.setAsChild,\n    removeChild = _ref.removeChild,\n    seq = _ref.seq,\n    className = _ref.className,\n    index = _ref.index,\n    style = _ref.style,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var childItems = item.childItems,\n    pageBreakBefore = item.pageBreakBefore;\n  var baseClasses = 'SortableItem rfb-item';\n  if (pageBreakBefore) {\n    baseClasses += ' alwaysbreak';\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({}, style),\n    className: baseClasses\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _extends({\n    item: item,\n    isFieldSet: false,\n    index: index,\n    editModeOn: editModeOn,\n    setAsChild: setAsChild\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_label__WEBPACK_IMPORTED_MODULE_2__[\"default\"], _extends({\n    item: item\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_5__[\"default\"], null, childItems.map(function (childItemId, childItemIndex) {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      key: \"\".concat(childItemIndex, \"_\").concat(childItemId || '_'),\n      className: className\n    }, controls ? controls[childItemIndex] : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dustbin__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n      style: {\n        width: '100%'\n      },\n      item: item,\n      accepts: accepts,\n      items: childItems,\n      col: childItemIndex,\n      parentIndex: index,\n      editModeOn: editModeOn,\n      _onDestroy: function _onDestroy() {\n        removeChild(item, childItemIndex);\n      },\n      getItemById: getItemById,\n      setAsChild: setAsChild,\n      seq: seq,\n      checkboxButtonClassName: item === null || item === void 0 ? void 0 : item.checkboxButtonClassName,\n      headerClassName: item === null || item === void 0 ? void 0 : item.headerClassName,\n      labelClassName: item === null || item === void 0 ? void 0 : item.labelClassName,\n      paragraphClassName: item === null || item === void 0 ? void 0 : item.paragraphClassName,\n      staticVariables: item === null || item === void 0 ? void 0 : item.staticVariables\n    }));\n  }))));\n};\nvar TwoColumnRow = function TwoColumnRow(_ref2) {\n  var item = _ref2.item,\n    className = _ref2.className,\n    rest = _objectWithoutProperties(_ref2, _excluded2);\n  var classNameVal = className || 'col-md-6';\n  if (!item.childItems) {\n    // eslint-disable-next-line no-param-reassign\n    item.childItems = [null, null];\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(MultiColumnRowBase, _extends({}, rest, {\n    className: classNameVal,\n    item: item\n  }));\n};\nvar ThreeColumnRow = function ThreeColumnRow(_ref3) {\n  var item = _ref3.item,\n    className = _ref3.className,\n    rest = _objectWithoutProperties(_ref3, _excluded3);\n  var classNameVal = className || 'col-md-4';\n  if (!item.childItems) {\n    // eslint-disable-next-line no-param-reassign\n    item.childItems = [null, null, null];\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(MultiColumnRowBase, _extends({}, rest, {\n    className: classNameVal,\n    item: item\n  }));\n};\nvar MultiColumnRow = function MultiColumnRow(_ref4) {\n  var item = _ref4.item,\n    rest = _objectWithoutProperties(_ref4, _excluded4);\n  var colCount = item.colCount || 4;\n  var classNameVal = item.className || (colCount === 4 ? 'col-md-3' : 'col');\n  if (!item.childItems) {\n    // eslint-disable-next-line no-param-reassign\n    item.childItems = Array.from({\n      length: colCount\n    }, function (v, i) {\n      return null;\n    });\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(MultiColumnRowBase, _extends({}, rest, {\n    className: classNameVal,\n    item: item\n  }));\n};\n\n\n//# sourceURL=webpack://react-survey-builder/./src/multi-column/MultiColumnRow.jsx?");
 
 /***/ }),
 
@@ -972,7 +972,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dnd__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react-dnd */ \"./node_modules/react-dnd/dist/esm/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _stores_store__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../stores/store */ \"./src/stores/store.js\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../utils/objectUtils */ \"./src/utils/objectUtils.js\");\nvar _excluded = [\"onDropSuccess\", \"seq\", \"draggedItem\", \"parentIndex\", \"canDrop\", \"isOver\", \"isOverCurrent\", \"connectDropTarget\", \"items\", \"col\", \"getItemById\"];\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\n\n\n\n\n\n\n\n\nfunction getCustomElement(item, props) {\n  var _item$fieldName;\n  if (!item.component || typeof item.component !== 'function') {\n    item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_4___default().get(item.key);\n    if (!item.component) {\n      console.error(\"\".concat(item.element, \" was not registered\"));\n    }\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_3__[\"default\"], _extends({}, props, {\n    mutable: false,\n    key: \"form_\".concat(item.id),\n    id: item.id,\n    name: (_item$fieldName = item.fieldName) !== null && _item$fieldName !== void 0 ? _item$fieldName : item.name,\n    item: _objectSpread(_objectSpread({}, item), {}, {\n      mutable: false,\n      readOnly: false,\n      print: false\n    })\n  }));\n}\nvar getElement = function getElement(item, props) {\n  var _item$fieldName2;\n  if (!item) return null;\n  if (item.custom) {\n    return getCustomElement(item, props);\n  }\n  // console.log('getDustbinElement', item);\n  var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_1__[\"default\"][item.element || item.key];\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, _extends({}, props, {\n    id: item.id,\n    key: \"form_\".concat(item.id),\n    name: (_item$fieldName2 = item.fieldName) !== null && _item$fieldName2 !== void 0 ? _item$fieldName2 : item.name,\n    mutable: false,\n    item: _objectSpread(_objectSpread({}, item), {}, {\n      mutable: false,\n      readOnly: false,\n      print: false\n    })\n  }));\n};\nvar getStyle = function getStyle(backgroundColor) {\n  return {\n    border: '1px dashed rgba(0,0,0,0.2)',\n    minHeight: '2rem',\n    minWidth: '7rem',\n    width: '100%',\n    backgroundColor: backgroundColor,\n    padding: 0,\n    \"float\": 'left'\n  };\n};\nvar isContainer = function isContainer(containerItem) {\n  if (containerItem.itemType !== _ItemTypes__WEBPACK_IMPORTED_MODULE_2__[\"default\"].CARD) {\n    var item = containerItem.item;\n    if (item) {\n      if (item.isContainer) {\n        return true;\n      }\n      if (item.fieldName) {\n        return item.fieldName.indexOf('_col_row') > -1;\n      }\n    }\n  }\n  return false;\n};\nvar Dustbin = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forwardRef(function (_ref, ref) {\n  var onDropSuccess = _ref.onDropSuccess,\n    seq = _ref.seq,\n    draggedItem = _ref.draggedItem,\n    parentIndex = _ref.parentIndex,\n    canDrop = _ref.canDrop,\n    isOver = _ref.isOver,\n    isOverCurrent = _ref.isOverCurrent,\n    connectDropTarget = _ref.connectDropTarget,\n    items = _ref.items,\n    col = _ref.col,\n    getItemById = _ref.getItemById,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var item = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_6__.isListNotEmpty)(items) ? getItemById(items[col]) : null;\n  react__WEBPACK_IMPORTED_MODULE_0___default().useImperativeHandle(ref, function () {\n    return {\n      onDrop: function onDrop(dropped) {\n        // console.log(\"dropped item\", dropped);\n        var item = dropped.item;\n        if (item) {\n          if (onDropSuccess) {\n            onDropSuccess();\n          }\n          _stores_store__WEBPACK_IMPORTED_MODULE_5__[\"default\"].dispatch('deleteLastItem');\n        }\n      }\n    };\n  }, []);\n  var element = getElement(item, otherProps);\n  var sameCard = draggedItem ? draggedItem.index === parentIndex : false;\n\n  // console.log('dragIndex:',draggedItem?.index)\n  // console.log('HoverIndex:',parentIndex)\n  // console.log('SameCard:',sameCard)\n\n  var backgroundColor = 'rgba(0, 0, 0, .03)';\n  if (!sameCard && isOver && canDrop && !draggedItem.item.isContainer) {\n    backgroundColor = '#F7F589';\n  }\n\n  // console.log('sameCard, canDrop', sameCard, canDrop);\n  return connectDropTarget( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: !sameCard ? getStyle(backgroundColor) : getStyle('rgba(0, 0, 0, .03')\n  }, !element && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"w-100 text-center\",\n    style: {\n      margin: 20\n    }\n  }, \"Drop your element here \"), element));\n});\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ((0,react_dnd__WEBPACK_IMPORTED_MODULE_7__.DropTarget)(function (props) {\n  return props.accepts;\n}, {\n  drop: function drop(props, monitor, component) {\n    // console.log('droptargetprops', props)\n    if (!component) {\n      return;\n    }\n\n    // //Do nothing with busy dustbin\n    // if(props.items[props.col]) return;\n    // Allow swap column if target and source are in same multi column row\n    var isBusy = !!props.items[props.col];\n    var item = monitor.getItem();\n\n    // console.log('dustbin', props, item, isBusy);\n\n    // Do nothing when moving the box inside the same column\n    if (props.col === item.col && props.items[props.col] === item.id) return;\n\n    // Do not allow replace component other than both items in same multi column row\n    if (item.col === undefined && props.items[props.col]) {\n      //store.dispatch('resetLastItem');\n      //console.log('dropping item in dustbin');\n      //store.dispatch('deleteLastItem');\n      return;\n    }\n\n    // do not allow an existing child to be dropped in the dropzone as it will duplicate the child with the same id for both instances\n    if ((props.item.element === 'Fieldset' || props.item.element === 'Step') && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_6__.isListNotEmpty)(props.item.childItems) && item.col === props.item.childItems.length) {\n      return;\n    }\n    if (!isContainer(item)) {\n      component.onDrop(item);\n      // console.log(\"calling on Drop from 137\", item)\n      if (item.item && typeof props.setAsChild === 'function') {\n        // console.log('setAsChild function being called');\n        var isNew = !item.item.id;\n        var $dataItem = isNew ? item.onCreate(item.item) : item.item;\n        props.setAsChild(props.item, $dataItem, isNew, item.index, props.col, isBusy);\n      }\n    }\n  }\n}, function (connect, monitor) {\n  return {\n    connectDropTarget: connect.dropTarget(),\n    draggedItem: monitor.getItem() ? monitor.getItem() : null,\n    isOver: monitor.isOver(),\n    isOverCurrent: monitor.isOver({\n      shallow: true\n    }),\n    canDrop: monitor.canDrop()\n  };\n})(Dustbin));\n\n//# sourceURL=webpack://react-survey-builder/./src/multi-column/dustbin.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dnd__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react-dnd */ \"./node_modules/react-dnd/dist/esm/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _stores_store__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../stores/store */ \"./src/stores/store.js\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../utils/objectUtils */ \"./src/utils/objectUtils.js\");\nvar _excluded = [\"onDropSuccess\", \"seq\", \"draggedItem\", \"parentIndex\", \"canDrop\", \"isOver\", \"isOverCurrent\", \"connectDropTarget\", \"items\", \"col\", \"getItemById\"];\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\n\n\n\n\n\n\n\n\nfunction getCustomElement(item, props) {\n  var _item$fieldName;\n  if (!item.component || typeof item.component !== 'function') {\n    item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_4___default().get(item.key);\n    if (!item.component) {\n      console.error(\"\".concat(item.element, \" was not registered\"));\n    }\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_3__[\"default\"], _extends({}, props, {\n    mutable: false,\n    key: \"form_\".concat(item.id),\n    id: item.id,\n    name: (_item$fieldName = item.fieldName) !== null && _item$fieldName !== void 0 ? _item$fieldName : item.name,\n    item: _objectSpread(_objectSpread({}, item), {}, {\n      mutable: false,\n      readOnly: false,\n      print: false\n    })\n  }));\n}\nvar getElement = function getElement(item, props) {\n  var _item$fieldName2;\n  if (!item) return null;\n  if (item.custom) {\n    return getCustomElement(item, props);\n  }\n  // console.log('getDustbinElement', item);\n  var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_1__[\"default\"][item.element || item.key];\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, _extends({}, props, {\n    id: item.id,\n    key: \"form_\".concat(item.id),\n    name: (_item$fieldName2 = item.fieldName) !== null && _item$fieldName2 !== void 0 ? _item$fieldName2 : item.name,\n    mutable: false,\n    item: _objectSpread(_objectSpread({}, item), {}, {\n      staticVariables: props === null || props === void 0 ? void 0 : props.staticVariables,\n      checkboxButtonClassName: props === null || props === void 0 ? void 0 : props.checkboxButtonClassName,\n      headerClassName: props === null || props === void 0 ? void 0 : props.headerClassName,\n      labelClassName: props === null || props === void 0 ? void 0 : props.labelClassName,\n      paragraphClassName: props === null || props === void 0 ? void 0 : props.paragraphClassName,\n      mutable: false,\n      readOnly: false,\n      print: false\n    })\n  }));\n};\nvar getStyle = function getStyle(backgroundColor) {\n  return {\n    border: '1px dashed rgba(0,0,0,0.2)',\n    minHeight: '2rem',\n    minWidth: '7rem',\n    width: '100%',\n    backgroundColor: backgroundColor,\n    padding: 0,\n    \"float\": 'left'\n  };\n};\nvar isContainer = function isContainer(containerItem) {\n  if (containerItem.itemType !== _ItemTypes__WEBPACK_IMPORTED_MODULE_2__[\"default\"].CARD) {\n    var item = containerItem.item;\n    if (item) {\n      if (item.isContainer) {\n        return true;\n      }\n      if (item.fieldName) {\n        return item.fieldName.indexOf('_col_row') > -1;\n      }\n    }\n  }\n  return false;\n};\nvar Dustbin = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forwardRef(function (_ref, ref) {\n  var onDropSuccess = _ref.onDropSuccess,\n    seq = _ref.seq,\n    draggedItem = _ref.draggedItem,\n    parentIndex = _ref.parentIndex,\n    canDrop = _ref.canDrop,\n    isOver = _ref.isOver,\n    isOverCurrent = _ref.isOverCurrent,\n    connectDropTarget = _ref.connectDropTarget,\n    items = _ref.items,\n    col = _ref.col,\n    getItemById = _ref.getItemById,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var item = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_6__.isListNotEmpty)(items) ? getItemById(items[col]) : null;\n  react__WEBPACK_IMPORTED_MODULE_0___default().useImperativeHandle(ref, function () {\n    return {\n      onDrop: function onDrop(dropped) {\n        // console.log(\"dropped item\", dropped);\n        var item = dropped.item;\n        if (item) {\n          if (onDropSuccess) {\n            onDropSuccess();\n          }\n          _stores_store__WEBPACK_IMPORTED_MODULE_5__[\"default\"].dispatch('deleteLastItem');\n        }\n      }\n    };\n  }, []);\n  var element = getElement(item, otherProps);\n  var sameCard = draggedItem ? draggedItem.index === parentIndex : false;\n\n  // console.log('dragIndex:',draggedItem?.index)\n  // console.log('HoverIndex:',parentIndex)\n  // console.log('SameCard:',sameCard)\n\n  var backgroundColor = 'rgba(0, 0, 0, .03)';\n  if (!sameCard && isOver && canDrop && !draggedItem.item.isContainer) {\n    backgroundColor = '#F7F589';\n  }\n\n  // console.log('sameCard, canDrop', sameCard, canDrop);\n  return connectDropTarget( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: !sameCard ? getStyle(backgroundColor) : getStyle('rgba(0, 0, 0, .03')\n  }, !element && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"w-100 text-center\",\n    style: {\n      margin: 20\n    }\n  }, \"Drop your element here \"), element));\n});\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ((0,react_dnd__WEBPACK_IMPORTED_MODULE_7__.DropTarget)(function (props) {\n  return props.accepts;\n}, {\n  drop: function drop(props, monitor, component) {\n    // console.log('droptargetprops', props)\n    if (!component) {\n      return;\n    }\n\n    // //Do nothing with busy dustbin\n    // if(props.items[props.col]) return;\n    // Allow swap column if target and source are in same multi column row\n    var isBusy = !!props.items[props.col];\n    var item = monitor.getItem();\n\n    // console.log('dustbin', props, item, isBusy);\n\n    // Do nothing when moving the box inside the same column\n    if (props.col === item.col && props.items[props.col] === item.id) return;\n\n    // Do not allow replace component other than both items in same multi column row\n    if (item.col === undefined && props.items[props.col]) {\n      //store.dispatch('resetLastItem');\n      //console.log('dropping item in dustbin');\n      //store.dispatch('deleteLastItem');\n      return;\n    }\n\n    // do not allow an existing child to be dropped in the dropzone as it will duplicate the child with the same id for both instances\n    if ((props.item.element === 'Fieldset' || props.item.element === 'Step') && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_6__.isListNotEmpty)(props.item.childItems) && item.col === props.item.childItems.length) {\n      return;\n    }\n    if (!isContainer(item)) {\n      component.onDrop(item);\n      // console.log(\"calling on Drop from 137\", item)\n      if (item.item && typeof props.setAsChild === 'function') {\n        // console.log('setAsChild function being called');\n        var isNew = !item.item.id;\n        var $dataItem = isNew ? item.onCreate(item.item) : item.item;\n        props.setAsChild(props.item, $dataItem, isNew, item.index, props.col, isBusy);\n      }\n    }\n  }\n}, function (connect, monitor) {\n  return {\n    connectDropTarget: connect.dropTarget(),\n    draggedItem: monitor.getItem() ? monitor.getItem() : null,\n    isOver: monitor.isOver(),\n    isOverCurrent: monitor.isOver({\n      shallow: true\n    }),\n    canDrop: monitor.canDrop()\n  };\n})(Dustbin));\n\n//# sourceURL=webpack://react-survey-builder/./src/multi-column/dustbin.jsx?");
 
 /***/ }),
 
@@ -1027,7 +1027,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements/component-header */ \"./src/survey-elements/component-header.jsx\");\n/* harmony import */ var _multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../multi-column/dustbin */ \"./src/multi-column/dustbin.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nvar _excluded = [\"item\", \"controls\", \"items\", \"answers\", \"editModeOn\", \"getItemById\", \"setAsChild\", \"removeChild\", \"seq\", \"index\", \"style\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\n/* eslint-disable camelcase */\n\n\n\n\n\n\nvar accepts = [_ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].BOX, _ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].CARD];\nvar StepBase = function StepBase(_ref) {\n  var item = _ref.item,\n    controls = _ref.controls,\n    items = _ref.items,\n    answers = _ref.answers,\n    editModeOn = _ref.editModeOn,\n    getItemById = _ref.getItemById,\n    setAsChild = _ref.setAsChild,\n    removeChild = _ref.removeChild,\n    seq = _ref.seq,\n    index = _ref.index,\n    style = _ref.style,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var pageBreakBefore = item.pageBreakBefore;\n  var baseClasses = \"SortableItem rfb-item\";\n  if (pageBreakBefore) {\n    baseClasses += \" alwaysbreak\";\n  }\n\n  // const [hidden, setHidden] = React.useState(item?.conditional ?? false);\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems) ? _toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems) : [null]),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    childItemIds = _React$useState2[0],\n    setChildItemIds = _React$useState2[1];\n  var _onDropSuccess = function onDropSuccess(droppedIndex) {\n    // let updatedItem = isObjectNotEmpty(item) ? { ...item } : {};\n    // let existingChildItemIds = isListNotEmpty(updatedItem.childItems) ? [...updatedItem.childItems] : [null];\n    // const isLastChild = existingChildItemIds === (droppedIndex + 1);\n    // console.log('onDropSuccess', droppedIndex, existingChildItemIds, childItemIds, item, isLastChild);\n\n    // if (isLastChild) {\n    //     let updatedChildItemIds = Array.from({ length: existingChildItemIds.length + 1 }, (v, i) => { return existingChildItemIds[i] ? existingChildItemIds[i] : null });\n    //     setChildItemIds(updatedChildItemIds);\n    // }\n  };\n  react__WEBPACK_IMPORTED_MODULE_0___default().useEffect(function () {\n    if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems)) {\n      setChildItemIds([].concat(_toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems), [null]));\n    } else {\n      setChildItemIds([null]);\n    }\n  }, [item]);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({}, style),\n    className: baseClasses\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _extends({\n    item: item,\n    index: index,\n    editModeOn: editModeOn,\n    setAsChild: setAsChild,\n    isStep: true\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: 'd-grid w-100'\n  }, childItemIds === null || childItemIds === void 0 ? void 0 : childItemIds.map(function (childItemId, childItemIndex) {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      key: \"\".concat(childItemIndex, \"_\").concat(childItemId || \"_\")\n    }, controls ? controls[childItemIndex] : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n      style: {\n        width: \"100%\"\n      },\n      item: item,\n      accepts: accepts,\n      items: childItemIds,\n      key: childItemIndex,\n      col: childItemIndex,\n      onDropSuccess: function onDropSuccess() {\n        _onDropSuccess(childItemIndex);\n      },\n      parentIndex: index,\n      editModeOn: editModeOn,\n      _onDestroy: function _onDestroy() {\n        removeChild(item, childItemIndex);\n      },\n      getItemById: getItemById,\n      setAsChild: setAsChild,\n      seq: seq,\n      rowNo: childItemIndex\n    }));\n  })));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (StepBase);\n\n//# sourceURL=webpack://react-survey-builder/./src/step/Step.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements/component-header */ \"./src/survey-elements/component-header.jsx\");\n/* harmony import */ var _multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../multi-column/dustbin */ \"./src/multi-column/dustbin.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nvar _excluded = [\"item\", \"controls\", \"items\", \"answers\", \"editModeOn\", \"getItemById\", \"setAsChild\", \"removeChild\", \"seq\", \"index\", \"style\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\n/* eslint-disable camelcase */\n\n\n\n\n\n\nvar accepts = [_ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].BOX, _ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].CARD];\nvar StepBase = function StepBase(_ref) {\n  var item = _ref.item,\n    controls = _ref.controls,\n    items = _ref.items,\n    answers = _ref.answers,\n    editModeOn = _ref.editModeOn,\n    getItemById = _ref.getItemById,\n    setAsChild = _ref.setAsChild,\n    removeChild = _ref.removeChild,\n    seq = _ref.seq,\n    index = _ref.index,\n    style = _ref.style,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var pageBreakBefore = item.pageBreakBefore;\n  var baseClasses = \"SortableItem rfb-item\";\n  if (pageBreakBefore) {\n    baseClasses += \" alwaysbreak\";\n  }\n\n  // const [hidden, setHidden] = React.useState(item?.conditional ?? false);\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems) ? _toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems) : [null]),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    childItemIds = _React$useState2[0],\n    setChildItemIds = _React$useState2[1];\n  var _onDropSuccess = function onDropSuccess(droppedIndex) {\n    // let updatedItem = isObjectNotEmpty(item) ? { ...item } : {};\n    // let existingChildItemIds = isListNotEmpty(updatedItem.childItems) ? [...updatedItem.childItems] : [null];\n    // const isLastChild = existingChildItemIds === (droppedIndex + 1);\n    // console.log('onDropSuccess', droppedIndex, existingChildItemIds, childItemIds, item, isLastChild);\n\n    // if (isLastChild) {\n    //     let updatedChildItemIds = Array.from({ length: existingChildItemIds.length + 1 }, (v, i) => { return existingChildItemIds[i] ? existingChildItemIds[i] : null });\n    //     setChildItemIds(updatedChildItemIds);\n    // }\n  };\n  react__WEBPACK_IMPORTED_MODULE_0___default().useEffect(function () {\n    if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems)) {\n      setChildItemIds([].concat(_toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems), [null]));\n    } else {\n      setChildItemIds([null]);\n    }\n  }, [item]);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({}, style),\n    className: baseClasses\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _extends({\n    item: item,\n    index: index,\n    editModeOn: editModeOn,\n    setAsChild: setAsChild,\n    isStep: true\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: 'd-grid w-100'\n  }, childItemIds === null || childItemIds === void 0 ? void 0 : childItemIds.map(function (childItemId, childItemIndex) {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      key: \"\".concat(childItemIndex, \"_\").concat(childItemId || \"_\")\n    }, controls ? controls[childItemIndex] : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n      style: {\n        width: \"100%\"\n      },\n      item: item,\n      accepts: accepts,\n      items: childItemIds,\n      key: childItemIndex,\n      col: childItemIndex,\n      onDropSuccess: function onDropSuccess() {\n        _onDropSuccess(childItemIndex);\n      },\n      parentIndex: index,\n      editModeOn: editModeOn,\n      _onDestroy: function _onDestroy() {\n        removeChild(item, childItemIndex);\n      },\n      getItemById: getItemById,\n      setAsChild: setAsChild,\n      seq: seq,\n      rowNo: childItemIndex,\n      checkboxButtonClassName: item === null || item === void 0 ? void 0 : item.checkboxButtonClassName,\n      headerClassName: item === null || item === void 0 ? void 0 : item.headerClassName,\n      labelClassName: item === null || item === void 0 ? void 0 : item.labelClassName,\n      paragraphClassName: item === null || item === void 0 ? void 0 : item.paragraphClassName,\n      staticVariables: item === null || item === void 0 ? void 0 : item.staticVariables\n    }));\n  })));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (StepBase);\n\n//# sourceURL=webpack://react-survey-builder/./src/step/Step.jsx?");
 
 /***/ }),
 
@@ -1191,7 +1191,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__),\n/* harmony export */   myContentXSS: () => (/* binding */ myContentXSS)\n/* harmony export */ });\n/* harmony import */ var xss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! xss */ \"./node_modules/xss/lib/index.js\");\n/* harmony import */ var xss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(xss__WEBPACK_IMPORTED_MODULE_0__);\n\nvar myxss = new (xss__WEBPACK_IMPORTED_MODULE_0___default().FilterXSS)({\n  whiteList: {\n    a: ['href', 'title', 'target'],\n    u: [],\n    br: [],\n    b: [],\n    i: [],\n    ol: ['style'],\n    ul: ['style'],\n    li: [],\n    p: ['style'],\n    sub: [],\n    sup: [],\n    div: ['style'],\n    em: [],\n    strong: [],\n    span: ['style'],\n    ins: []\n  }\n});\nvar myContentXSS = new (xss__WEBPACK_IMPORTED_MODULE_0___default().FilterXSS)({\n  whiteList: {\n    a: ['href', 'title', 'target', 'style', 'class'],\n    abbr: [\"title\"],\n    address: [],\n    area: [\"shape\", \"coords\", \"href\", \"alt\"],\n    article: [],\n    aside: [],\n    b: [],\n    big: [],\n    blockquote: [\"cite\"],\n    br: [],\n    caption: [],\n    center: [],\n    cite: [],\n    code: [],\n    col: [\"align\", \"valign\", \"span\", \"width\"],\n    colgroup: [\"align\", \"valign\", \"span\", \"width\"],\n    dd: [],\n    del: [\"datetime\"],\n    details: [\"open\"],\n    div: ['style', 'class'],\n    dl: ['style', 'class'],\n    dt: ['style', 'class'],\n    em: [],\n    figcaption: [],\n    figure: [],\n    font: [\"color\", \"size\", \"face\"],\n    footer: [],\n    h1: ['style', 'class'],\n    h2: ['style', 'class'],\n    h3: ['style', 'class'],\n    h4: ['style', 'class'],\n    h5: ['style', 'class'],\n    h6: ['style', 'class'],\n    header: [],\n    hr: [],\n    i: [],\n    img: [\"src\", \"alt\", \"title\", \"width\", \"height\", \"loading\"],\n    ins: [\"datetime\"],\n    li: ['style', 'class'],\n    mark: [],\n    nav: [],\n    ol: ['style', 'class'],\n    p: ['style', 'class'],\n    pre: [],\n    s: [],\n    section: [],\n    small: [],\n    span: ['style', 'class'],\n    strike: [],\n    strong: [],\n    sub: [],\n    summary: [],\n    sup: [],\n    table: [\"width\", \"border\", \"align\", \"valign\"],\n    tbody: [\"align\", \"valign\"],\n    td: [\"width\", \"rowspan\", \"colspan\", \"align\", \"valign\"],\n    tfoot: [\"align\", \"valign\"],\n    th: [\"width\", \"rowspan\", \"colspan\", \"align\", \"valign\"],\n    thead: [\"align\", \"valign\"],\n    tr: [\"rowspan\", \"align\", \"valign\"],\n    tt: [],\n    u: [],\n    ul: ['style', 'class']\n  }\n});\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (myxss);\n\n//# sourceURL=webpack://react-survey-builder/./src/survey-elements/myxss.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__),\n/* harmony export */   myContentXSS: () => (/* binding */ myContentXSS)\n/* harmony export */ });\n/* harmony import */ var xss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! xss */ \"./node_modules/xss/lib/index.js\");\n/* harmony import */ var xss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(xss__WEBPACK_IMPORTED_MODULE_0__);\n\nvar myxss = new (xss__WEBPACK_IMPORTED_MODULE_0___default().FilterXSS)({\n  whiteList: {\n    a: ['href', 'title', 'target'],\n    u: [],\n    br: [],\n    b: [],\n    i: [],\n    ol: ['style'],\n    ul: ['style'],\n    li: [],\n    p: ['style'],\n    sub: [],\n    sup: [],\n    div: ['style'],\n    em: [],\n    strong: [],\n    span: ['style'],\n    ins: []\n  }\n});\nvar myContentXSS = new (xss__WEBPACK_IMPORTED_MODULE_0___default().FilterXSS)({\n  css: false,\n  whiteList: {\n    a: ['href', 'title', 'target', 'style', 'class'],\n    abbr: [\"title\"],\n    address: [],\n    area: [\"shape\", \"coords\", \"href\", \"alt\"],\n    article: [],\n    aside: [],\n    b: [],\n    big: [],\n    blockquote: [\"cite\"],\n    br: [],\n    button: ['href', 'title', 'target', 'style', 'class', 'type'],\n    caption: [],\n    center: [],\n    cite: [],\n    code: [],\n    col: [\"align\", \"valign\", \"span\", \"width\"],\n    colgroup: [\"align\", \"valign\", \"span\", \"width\"],\n    dd: [],\n    del: [\"datetime\"],\n    details: [\"open\"],\n    div: ['style', 'class', 'id'],\n    dl: ['style', 'class'],\n    dt: ['style', 'class'],\n    em: [],\n    figcaption: [],\n    figure: [],\n    font: [\"color\", \"size\", \"face\"],\n    footer: [],\n    h1: ['style', 'class', 'id'],\n    h2: ['style', 'class', 'id'],\n    h3: ['style', 'class', 'id'],\n    h4: ['style', 'class', 'id'],\n    h5: ['style', 'class', 'id'],\n    h6: ['style', 'class', 'id'],\n    header: [],\n    hr: [],\n    i: [],\n    img: [\"src\", \"alt\", \"title\", \"width\", \"height\", \"loading\"],\n    ins: [\"datetime\"],\n    li: ['style', 'class'],\n    mark: [],\n    nav: [],\n    ol: ['style', 'class'],\n    p: ['style', 'class'],\n    pre: [],\n    s: [],\n    section: [],\n    small: [],\n    span: ['style', 'class'],\n    strike: [],\n    strong: [],\n    sub: [],\n    summary: [],\n    sup: [],\n    table: [\"width\", \"border\", \"align\", \"valign\"],\n    tbody: [\"align\", \"valign\"],\n    td: [\"width\", \"rowspan\", \"colspan\", \"align\", \"valign\"],\n    tfoot: [\"align\", \"valign\"],\n    th: [\"width\", \"rowspan\", \"colspan\", \"align\", \"valign\"],\n    thead: [\"align\", \"valign\"],\n    tr: [\"rowspan\", \"align\", \"valign\"],\n    tt: [],\n    u: [],\n    ul: ['style', 'class']\n  },\n  onIgnoreTagAttr: function onIgnoreTagAttr(tag, name, value, isWhiteAttr) {\n    if (name.substr(0, 5) === \"data-\") {\n      // escape its value using built-in escapeAttrValue function\n      return name + '=\"' + xss__WEBPACK_IMPORTED_MODULE_0___default().escapeAttrValue(value) + '\"';\n    }\n  }\n});\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (myxss);\n\n//# sourceURL=webpack://react-survey-builder/./src/survey-elements/myxss.js?");
 
 /***/ }),
 

package/lib/fieldset/Fieldset.js

@@ -111,7 +111,12 @@ var FieldsetBase = function FieldsetBase(_ref2) {
       getItemById: getItemById,
       setAsChild: setAsChild,
       seq: seq,
-      rowNo: childItemIndex
+      rowNo: childItemIndex,
+      checkboxButtonClassName: item === null || item === void 0 ? void 0 : item.checkboxButtonClassName,
+      headerClassName: item === null || item === void 0 ? void 0 : item.headerClassName,
+      labelClassName: item === null || item === void 0 ? void 0 : item.labelClassName,
+      paragraphClassName: item === null || item === void 0 ? void 0 : item.paragraphClassName,
+      staticVariables: item === null || item === void 0 ? void 0 : item.staticVariables
     }));
   })));
 };

package/lib/multi-column/MultiColumnRow.js

@@ -68,7 +68,12 @@ var MultiColumnRowBase = function MultiColumnRowBase(_ref) {
       },
       getItemById: getItemById,
       setAsChild: setAsChild,
-      seq: seq
+      seq: seq,
+      checkboxButtonClassName: item === null || item === void 0 ? void 0 : item.checkboxButtonClassName,
+      headerClassName: item === null || item === void 0 ? void 0 : item.headerClassName,
+      labelClassName: item === null || item === void 0 ? void 0 : item.labelClassName,
+      paragraphClassName: item === null || item === void 0 ? void 0 : item.paragraphClassName,
+      staticVariables: item === null || item === void 0 ? void 0 : item.staticVariables
     }));
   }))));
 };

package/lib/multi-column/dustbin.js

@@ -50,6 +50,11 @@ var getElement = function getElement(item, props) {
     name: (_item$fieldName2 = item.fieldName) !== null && _item$fieldName2 !== void 0 ? _item$fieldName2 : item.name,
     mutable: false,
     item: _objectSpread(_objectSpread({}, item), {}, {
+      staticVariables: props === null || props === void 0 ? void 0 : props.staticVariables,
+      checkboxButtonClassName: props === null || props === void 0 ? void 0 : props.checkboxButtonClassName,
+      headerClassName: props === null || props === void 0 ? void 0 : props.headerClassName,
+      labelClassName: props === null || props === void 0 ? void 0 : props.labelClassName,
+      paragraphClassName: props === null || props === void 0 ? void 0 : props.paragraphClassName,
       mutable: false,
       readOnly: false,
       print: false

package/lib/step/Step.js

@@ -102,7 +102,12 @@ var StepBase = function StepBase(_ref) {
       getItemById: getItemById,
       setAsChild: setAsChild,
       seq: seq,
-      rowNo: childItemIndex
+      rowNo: childItemIndex,
+      checkboxButtonClassName: item === null || item === void 0 ? void 0 : item.checkboxButtonClassName,
+      headerClassName: item === null || item === void 0 ? void 0 : item.headerClassName,
+      labelClassName: item === null || item === void 0 ? void 0 : item.labelClassName,
+      paragraphClassName: item === null || item === void 0 ? void 0 : item.paragraphClassName,
+      staticVariables: item === null || item === void 0 ? void 0 : item.staticVariables
     }));
   })));
 };

package/lib/survey-elements/myxss.js

@@ -20,6 +20,7 @@ var myxss = new xss.FilterXSS({
   }
 });
 export var myContentXSS = new xss.FilterXSS({
+  css: false,
   whiteList: {
     a: ['href', 'title', 'target', 'style', 'class'],
     abbr: ["title"],
@@ -31,6 +32,7 @@ export var myContentXSS = new xss.FilterXSS({
     big: [],
     blockquote: ["cite"],
     br: [],
+    button: ['href', 'title', 'target', 'style', 'class', 'type'],
     caption: [],
     center: [],
     cite: [],
@@ -40,7 +42,7 @@ export var myContentXSS = new xss.FilterXSS({
     dd: [],
     del: ["datetime"],
     details: ["open"],
-    div: ['style', 'class'],
+    div: ['style', 'class', 'id'],
     dl: ['style', 'class'],
     dt: ['style', 'class'],
     em: [],
@@ -48,12 +50,12 @@ export var myContentXSS = new xss.FilterXSS({
     figure: [],
     font: ["color", "size", "face"],
     footer: [],
-    h1: ['style', 'class'],
-    h2: ['style', 'class'],
-    h3: ['style', 'class'],
-    h4: ['style', 'class'],
-    h5: ['style', 'class'],
-    h6: ['style', 'class'],
+    h1: ['style', 'class', 'id'],
+    h2: ['style', 'class', 'id'],
+    h3: ['style', 'class', 'id'],
+    h4: ['style', 'class', 'id'],
+    h5: ['style', 'class', 'id'],
+    h6: ['style', 'class', 'id'],
     header: [],
     hr: [],
     i: [],
@@ -84,6 +86,12 @@ export var myContentXSS = new xss.FilterXSS({
     tt: [],
     u: [],
     ul: ['style', 'class']
+  },
+  onIgnoreTagAttr: function onIgnoreTagAttr(tag, name, value, isWhiteAttr) {
+    if (name.substr(0, 5) === "data-") {
+      // escape its value using built-in escapeAttrValue function
+      return name + '="' + xss.escapeAttrValue(value) + '"';
+    }
   }
 });
 export default myxss;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-survey-builder",
-  "version": "1.0.84",
+  "version": "1.0.86",
   "description": "A complete survey builder for react.",
   "main": "lib/index.js",
   "types": "types/index.d.ts",