@goldenpine/react-form-builder2 0.18.4-patch.1 → 0.20.3-build.2

package/lib/toolbar.js

@@ -7,10 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _reactIntl = require("react-intl");
@@ -19,10 +18,10 @@ var _toolbarGroupItem = _interopRequireDefault(require("./toolbar-group-item"));
 var _UUID = _interopRequireDefault(require("./UUID"));
 var _store = _interopRequireDefault(require("./stores/store"));
 var _functions = require("./functions");
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /**
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function 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; }
+function _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) { (0, _defineProperty2["default"])(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; } /**
   * <Toolbar />
   */
 // function isDefaultItem(item) {
@@ -75,21 +74,19 @@ function buildGroupItems(allItems) {
   };
 }
 var Toolbar = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2["default"])(Toolbar, _React$Component);
-  var _super = _createSuper(Toolbar);
   function Toolbar(props) {
     var _this;
     (0, _classCallCheck2["default"])(this, Toolbar);
-    _this = _super.call(this, props);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "renderItem", function (item) {
+    _this = _callSuper(this, Toolbar, [props]);
+    (0, _defineProperty2["default"])(_this, "renderItem", function (item) {
       return /*#__PURE__*/_react["default"].createElement(_toolbarDraggableItem["default"], {
         data: item,
         key: item.key,
-        onClick: _this._onClick.bind((0, _assertThisInitialized2["default"])(_this), item),
+        onClick: _this._onClick.bind(_this, item),
         onCreate: _this.create
       });
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "togglePin", function () {
+    (0, _defineProperty2["default"])(_this, "togglePin", function () {
       _this.setState(function (prevState) {
         return {
           isPinned: !prevState.isPinned
@@ -102,10 +99,11 @@ var Toolbar = /*#__PURE__*/function (_React$Component) {
       items: items,
       isPinned: false
     };
-    _this.create = _this.create.bind((0, _assertThisInitialized2["default"])(_this));
+    _this.create = _this.create.bind(_this);
     return _this;
   }
-  (0, _createClass2["default"])(Toolbar, [{
+  (0, _inherits2["default"])(Toolbar, _React$Component);
+  return (0, _createClass2["default"])(Toolbar, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       var _this2 = this;
@@ -459,7 +457,7 @@ var Toolbar = /*#__PURE__*/function (_React$Component) {
     key: "addCustomOptions",
     value: function addCustomOptions(item, elementOptions) {
       if (item.type === 'custom') {
-        var customOptions = Object.assign({}, item, elementOptions);
+        var customOptions = _objectSpread(_objectSpread({}, item), elementOptions);
         customOptions.custom = true;
         customOptions.component = item.component || null;
         customOptions.custom_options = item.custom_options || [];
@@ -597,7 +595,7 @@ var Toolbar = /*#__PURE__*/function (_React$Component) {
           // so later you can set height relative to the boundary to use scrollable bar.
           top: this.state.isPinned ? '10%' : '',
           bottom: this.state.isPinned ? '10%' : '',
-          right: this.state.isPinned ? '5%' : ''
+          right: this.state.isPinned ? '3%' : ''
         }
       }, /*#__PURE__*/_react["default"].createElement("div", {
         style: {
@@ -720,7 +718,5 @@ var Toolbar = /*#__PURE__*/function (_React$Component) {
       }
     }
   }]);
-  return Toolbar;
 }(_react["default"].Component);
-var _default = (0, _reactIntl.injectIntl)(Toolbar);
-exports["default"] = _default;
+var _default = exports["default"] = (0, _reactIntl.injectIntl)(Toolbar);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@goldenpine/react-form-builder2",
-  "version": "0.18.4-patch.1",
+  "version": "0.20.3-build.2",
   "description": "A complete form builder for react.",
   "main": "lib/index.js",
   "types": "types/index.d.ts",
@@ -27,16 +27,9 @@
     "drop"
   ],
   "engines": {
-    "node": ">=12.0.0"
+    "node": ">=18.0.0"
   },
   "author": "Kiho Chang",
-  "contributors": [
-    {
-      "name": "Zach Robichaud",
-      "email": "zach2825@gmail.com",
-      "url": "https://turtlebytes.com"
-    }
-  ],
   "dependencies": {
     "beedle": "^0.8.1",
     "classnames": "^2.2.6",
@@ -50,20 +43,20 @@
     "immutability-helper": "^3.1.1",
     "isomorphic-fetch": "^3.0.0",
     "prop-types": "^15.7.2",
-    "react-bootstrap-slider": "^2.2.3",
-    "react-datepicker": "^3.4.1",
-    "react-dnd": "^11.1.3",
-    "react-dnd-html5-backend": "^11.1.3",
-    "react-draft-wysiwyg": "^1.14.7",
-    "react-intl": "^5.24.3",
-    "react-select": "^3.2.0",
-    "react-signature-canvas": "^1.0.3",
-    "react-textarea-autosize": "^7.1.2",
+    "react-bootstrap-slider": "^3.0.0",
+    "react-datepicker": "^8.3.0",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
+    "react-draft-wysiwyg": "^1.15.0",
+    "react-intl": "^7.1.11",
+    "react-select": "^5.10.1",
+    "react-signature-canvas": "^1.1.0-alpha.2",
+    "react-textarea-autosize": "^8.5.9",
     "xss": "^1.0.8"
   },
   "peerDependencies": {
-    "react": ">=16.8.6",
-    "react-dom": ">=16.8.6"
+    "react": ">=18.3.1",
+    "react-dom": ">=18.3.1"
   },
   "devDependencies": {
     "@babel/cli": "^7.26.4",
@@ -89,15 +82,15 @@
     "eslint-plugin-react": "^7.22.0",
     "express": "^4.17.1",
     "multer": "^1.4.2",
-    "react": "^16.14.0",
-    "react-dom": "^16.14.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "rimraf": "^3.0.2",
-    "sass": "^1.52.3",
-    "sass-loader": "^10.0.0",
-    "style-loader": "^1.3.0",
-    "webpack": "^4.46.0",
-    "webpack-cli": "^3.3.12",
-    "webpack-dev-server": "^3.11.2"
+    "sass": "^1.88.0",
+    "sass-loader": "^16.0.5",
+    "style-loader": "^4.0.0",
+    "webpack": "^5.99.8",
+    "webpack-cli": "^6.0.1",
+    "webpack-dev-server": "^5.2.1"
   },
   "scripts": {
     "build": "NODE_OPTIONS=--openssl-legacy-provider webpack --mode production --config webpack.production.config.js",

package/dist/1.app.js

@@ -1 +0,0 @@
-(window.webpackJsonpReactFormBuilder=window.webpackJsonpReactFormBuilder||[]).push([[1],{391:function(e,t,a){"use strict";a.r(t),a.d(t,"default",(function(){return _}));var l=a(8),n=a.n(l),o=a(9),r=a.n(o),s=a(10),i=a.n(s),c=a(17),m=a.n(c),p=a(12),d=a.n(p),h=a(0),u=a.n(h),E=a(185),f=a(92),b=a(126),v=a.n(b),y=a(127),N=a(24),g=a.n(N),w=a(128);function k(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var a,l=d()(e);if(t){var n=d()(this).constructor;a=Reflect.construct(l,arguments,n)}else a=l.apply(this,arguments);return m()(this,a)}}var x=function(e){i()(a,e);var t=k(a);function a(e){var l;return n()(this,a),(l=t.call(this,e)).state={element:l.props.element,data:l.props.data,dirty:!1},l}return r()(a,[{key:"_setValue",value:function(e){return e.replace(/[^A-Z0-9]+/gi,"_").toLowerCase()}},{key:"editOption",value:function(e,t){var a=this.state.element,l=a.options[e].value!==this._setValue(a.options[e].text)?a.options[e].value:this._setValue(t.target.value);a.options[e].text=t.target.value,a.options[e].value=l,this.setState({element:a,dirty:!0})}},{key:"editValue",value:function(e,t){var a=this.state.element,l=""===t.target.value?this._setValue(a.options[e].text):t.target.value;a.options[e].value=l,this.setState({element:a,dirty:!0})}},{key:"editOptionCorrect",value:function(e,t){var a=this.state.element;a.options[e].hasOwnProperty("correct")?delete a.options[e].correct:a.options[e].correct=!0,this.setState({element:a}),this.props.updateElement.call(this.props.preview,a)}},{key:"updateOption",value:function(){var e=this.state.element;this.state.dirty&&(this.props.updateElement.call(this.props.preview,e),this.setState({dirty:!1}))}},{key:"addOption",value:function(e){var t=this.state.element;t.options.splice(e+1,0,{value:"",text:"",key:g.a.uuid()}),this.props.updateElement.call(this.props.preview,t)}},{key:"removeOption",value:function(e){var t=this.state.element;t.options.splice(e,1),this.props.updateElement.call(this.props.preview,t)}},{key:"render",value:function(){var e=this;return this.state.dirty&&(this.state.element.dirty=!0),u.a.createElement("div",{className:"dynamic-option-list"},u.a.createElement("ul",null,u.a.createElement("li",null,u.a.createElement("div",{className:"row"},u.a.createElement("div",{className:"col-sm-6"},u.a.createElement("b",null,u.a.createElement(w.a,{id:"options"}))),this.props.canHaveOptionValue&&u.a.createElement("div",{className:"col-sm-2"},u.a.createElement("b",null,u.a.createElement(w.a,{id:"value"}))),this.props.canHaveOptionValue&&this.props.canHaveOptionCorrect&&u.a.createElement("div",{className:"col-sm-4"},u.a.createElement("b",null,u.a.createElement(w.a,{id:"correct"}))))),this.props.element.options.map((function(t,a){var l="edit_".concat(t.key),n=t.value!==e._setValue(t.text)?t.value:"";return u.a.createElement("li",{className:"clearfix",key:l},u.a.createElement("div",{className:"row"},u.a.createElement("div",{className:"col-sm-6"},u.a.createElement("input",{tabIndex:a+1,className:"form-control",style:{width:"100%"},type:"text",name:"text_".concat(a),placeholder:"Option text",value:t.text,onBlur:e.updateOption.bind(e),onChange:e.editOption.bind(e,a)})),e.props.canHaveOptionValue&&u.a.createElement("div",{className:"col-sm-2"},u.a.createElement("input",{className:"form-control",type:"text",name:"value_".concat(a),value:n,onChange:e.editValue.bind(e,a)})),e.props.canHaveOptionValue&&e.props.canHaveOptionCorrect&&u.a.createElement("div",{className:"col-sm-1"},u.a.createElement("input",{className:"form-control",type:"checkbox",value:"1",onChange:e.editOptionCorrect.bind(e,a),checked:t.hasOwnProperty("correct")})),u.a.createElement("div",{className:"col-sm-3"},u.a.createElement("div",{className:"dynamic-options-actions-buttons"},u.a.createElement("button",{onClick:e.addOption.bind(e,a),className:"btn btn-success"},u.a.createElement("i",{className:"fas fa-plus-circle"})),a>0&&u.a.createElement("button",{onClick:e.removeOption.bind(e,a),className:"btn btn-danger"},u.a.createElement("i",{className:"fas fa-minus-circle"}))))))}))))}}]),a}(u.a.Component),P=a(110);function C(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var a,l=d()(e);if(t){var n=d()(this).constructor;a=Reflect.construct(l,arguments,n)}else a=l.apply(this,arguments);return m()(this,a)}}var O={options:["inline","list","textAlign","fontSize","link","history"],inline:{inDropdown:!1,className:void 0,options:["bold","italic","underline","superscript","subscript"]}},_=function(e){i()(a,e);var t=C(a);function a(e){var l;return n()(this,a),(l=t.call(this,e)).state={element:l.props.element,data:l.props.data,dirty:!1},l}return r()(a,[{key:"toggleRequired",value:function(){}},{key:"editElementProp",value:function(e,t,a){var l=this,n=this.state.element;n[e]=a.target[t],this.setState({element:n,dirty:!0},(function(){"checked"===t&&l.updateElement()}))}},{key:"onEditorStateChange",value:function(e,t,a){var l=v()(Object(f.convertToRaw)(a.getCurrentContent())).replace(/<p>/g,"<div>").replace(/<\/p>/g,"</div>"),n=this.state.element;n[t]=l,this.setState({element:n,dirty:!0})}},{key:"updateElement",value:function(){var e=this.state.element;this.state.dirty&&(this.props.updateElement.call(this.props.preview,e),this.setState({dirty:!1}))}},{key:"convertFromHTML",value:function(e){var t=Object(f.convertFromHTML)(e);if(!t.contentBlocks||!t.contentBlocks.length)return f.EditorState.createEmpty();var a=f.ContentState.createFromBlockArray(t);return f.EditorState.createWithContent(a)}},{key:"addOptions",value:function(){var e=this,t=document.getElementById("optionsApiUrl").value;t&&Object(P.a)(t).then((function(t){e.props.element.options=[];var a=e.props.element.options;t.forEach((function(e){e.key=g.a.uuid(),a.push(e)}));var l=e.state.element;e.setState({element:l,dirty:!0})}))}},{key:"render",value:function(){this.state.dirty&&(this.props.element.dirty=!0);var e,t=!!this.props.element.hasOwnProperty("required")&&this.props.element.required,a=!!this.props.element.hasOwnProperty("readOnly")&&this.props.element.readOnly,l=!!this.props.element.hasOwnProperty("defaultToday")&&this.props.element.defaultToday,n=!!this.props.element.hasOwnProperty("showTimeSelect")&&this.props.element.showTimeSelect,o=!!this.props.element.hasOwnProperty("showTimeSelectOnly")&&this.props.element.showTimeSelectOnly,r=!!this.props.element.hasOwnProperty("showTimeInput")&&this.props.element.showTimeInput,s=!!this.props.element.hasOwnProperty("inline")&&this.props.element.inline,i=!!this.props.element.hasOwnProperty("bold")&&this.props.element.bold,c=!!this.props.element.hasOwnProperty("italic")&&this.props.element.italic,m=!!this.props.element.hasOwnProperty("center")&&this.props.element.center,p=!!this.props.element.hasOwnProperty("pageBreakBefore")&&this.props.element.pageBreakBefore,d=!!this.props.element.hasOwnProperty("alternateForm")&&this.props.element.alternateForm,h=this.props.element,f=h.canHavePageBreakBefore,b=h.canHaveAlternateForm,v=h.canHaveDisplayHorizontal,N=h.canHaveOptionCorrect,g=h.canHaveOptionValue,k="Image"===this.state.element.element||"Camera"===this.state.element.element,P=this.props.files.length?this.props.files:[];return(P.length<1||P.length>0&&""!==P[0].id)&&P.unshift({id:"",file_name:""}),this.props.element.hasOwnProperty("content")&&(e=this.convertFromHTML(this.props.element.content)),this.props.element.hasOwnProperty("label")&&(e=this.convertFromHTML(this.props.element.label)),u.a.createElement("div",null,u.a.createElement("div",{className:"clearfix"},u.a.createElement("h4",{className:"float-left"},this.props.element.text),u.a.createElement("i",{className:"float-right fas fa-times dismiss-edit",onClick:this.props.manualEditModeOff})),this.props.element.hasOwnProperty("content")&&u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label"},u.a.createElement(w.a,{id:"text-to-display"}),":"),u.a.createElement(y.Editor,{toolbar:O,defaultEditorState:e,onBlur:this.updateElement.bind(this),onEditorStateChange:this.onEditorStateChange.bind(this,0,"content"),stripPastedStyles:!0})),this.props.element.hasOwnProperty("file_path")&&u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"fileSelect"},u.a.createElement(w.a,{id:"choose-file"}),":"),u.a.createElement("select",{id:"fileSelect",className:"form-control",defaultValue:this.props.element.file_path,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"file_path","value")},P.map((function(e){var t="file_".concat(e.id);return u.a.createElement("option",{value:e.id,key:t},e.file_name)})))),this.props.element.hasOwnProperty("href")&&u.a.createElement("div",{className:"form-group"},u.a.createElement(E.default,{type:"text",className:"form-control",defaultValue:this.props.element.href,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"href","value")})),this.props.element.hasOwnProperty("label")&&u.a.createElement("div",{className:"form-group"},u.a.createElement("label",null,u.a.createElement(w.a,{id:"display-label"})),u.a.createElement(y.Editor,{toolbar:O,defaultEditorState:e,onBlur:this.updateElement.bind(this),onEditorStateChange:this.onEditorStateChange.bind(this,0,"label"),stripPastedStyles:!0}),u.a.createElement("br",null),u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"is-required",className:"custom-control-input",type:"checkbox",checked:t,value:!0,onChange:this.editElementProp.bind(this,"required","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"is-required"},u.a.createElement(w.a,{id:"required"}))),this.props.element.hasOwnProperty("readOnly")&&u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"is-read-only",className:"custom-control-input",type:"checkbox",checked:a,value:!0,onChange:this.editElementProp.bind(this,"readOnly","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"is-read-only"},u.a.createElement(w.a,{id:"read-only"}))),this.props.element.hasOwnProperty("defaultToday")&&u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"is-default-to-today",className:"custom-control-input",type:"checkbox",checked:l,value:!0,onChange:this.editElementProp.bind(this,"defaultToday","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"is-default-to-today"},u.a.createElement(w.a,{id:"default-to-today"}),"?")),this.props.element.hasOwnProperty("showTimeSelect")&&u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"show-time-select",className:"custom-control-input",type:"checkbox",checked:n,value:!0,onChange:this.editElementProp.bind(this,"showTimeSelect","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"show-time-select"},u.a.createElement(w.a,{id:"show-time-select"}),"?")),n&&this.props.element.hasOwnProperty("showTimeSelectOnly")&&u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"show-time-select-only",className:"custom-control-input",type:"checkbox",checked:o,value:!0,onChange:this.editElementProp.bind(this,"showTimeSelectOnly","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"show-time-select-only"},u.a.createElement(w.a,{id:"show-time-select-only"}),"?")),this.props.element.hasOwnProperty("showTimeInput")&&u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"show-time-input",className:"custom-control-input",type:"checkbox",checked:r,value:!0,onChange:this.editElementProp.bind(this,"showTimeInput","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"show-time-input"},u.a.createElement(w.a,{id:"show-time-input"}),"?")),("RadioButtons"===this.state.element.element||"Checkboxes"===this.state.element.element)&&v&&u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"display-horizontal",className:"custom-control-input",type:"checkbox",checked:s,value:!0,onChange:this.editElementProp.bind(this,"inline","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"display-horizontal"},u.a.createElement(w.a,{id:"display-horizontal"})))),this.props.element.hasOwnProperty("src")&&u.a.createElement("div",null,u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"srcInput"},u.a.createElement(w.a,{id:"link-to"}),":"),u.a.createElement("input",{id:"srcInput",type:"text",className:"form-control",defaultValue:this.props.element.src,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"src","value")}))),k&&u.a.createElement("div",null,u.a.createElement("div",{className:"form-group"},u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"do-center",className:"custom-control-input",type:"checkbox",checked:m,value:!0,onChange:this.editElementProp.bind(this,"center","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"do-center"},u.a.createElement(w.a,{id:"center"}),"?"))),u.a.createElement("div",{className:"row"},u.a.createElement("div",{className:"col-sm-3"},u.a.createElement("label",{className:"control-label",htmlFor:"elementWidth"},u.a.createElement(w.a,{id:"width"}),":"),u.a.createElement("input",{id:"elementWidth",type:"text",className:"form-control",defaultValue:this.props.element.width,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"width","value")})),u.a.createElement("div",{className:"col-sm-3"},u.a.createElement("label",{className:"control-label",htmlFor:"elementHeight"},u.a.createElement(w.a,{id:"height"}),":"),u.a.createElement("input",{id:"elementHeight",type:"text",className:"form-control",defaultValue:this.props.element.height,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"height","value")})))),"Camera"===this.state.element.element&&u.a.createElement("div",null,u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"LabelAfterCameraIcon"},u.a.createElement(w.a,{id:"display-label-after-camera-icon"}),":"),u.a.createElement("input",{id:"LabelAfterCameraIcon",type:"text",className:"form-control",defaultValue:this.props.element.label_after_camera_icon,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"label_after_camera_icon","value")})),u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"MessageUnderCameraIcon"},u.a.createElement(w.a,{id:"display-message-under-camera-icon"}),":"),u.a.createElement("input",{id:"MessageUnderCameraIcon",type:"text",className:"form-control",defaultValue:this.props.element.message_under_camera_icon,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"message_under_camera_icon","value")})),u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"LabelAfterPhotoClearIcon"},u.a.createElement(w.a,{id:"display-label-after-photo-clear-icon"}),":"),u.a.createElement("input",{id:"LabelAfterPhotoClearIcon",type:"text",className:"form-control",defaultValue:this.props.element.label_after_photo_clear_icon,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"label_after_photo_clear_icon","value")}))),"FileUpload"===this.state.element.element&&u.a.createElement("div",null,u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"LabelAfterFileIcon"},u.a.createElement(w.a,{id:"display-label-after-file-icon"}),":"),u.a.createElement("input",{id:"LabelAfterFileIcon",type:"text",className:"form-control",defaultValue:this.props.element.label_after_file_icon,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"label_after_file_icon","value")})),u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"MessageUnderFileIcon"},u.a.createElement(w.a,{id:"display-message-under-file-icon"}),":"),u.a.createElement("input",{id:"MessageUnderFileIcon",type:"text",className:"form-control",defaultValue:this.props.element.message_under_file_icon,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"message_under_file_icon","value")})),u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"LabelAfterFileClearIcon"},u.a.createElement(w.a,{id:"display-label-after-file-clear-icon"}),":"),u.a.createElement("input",{id:"LabelAfterFileClearIcon",type:"text",className:"form-control",defaultValue:this.props.element.label_after_file_clear_icon,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"label_after_file_clear_icon","value")})),u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"fileType"},u.a.createElement(w.a,{id:"choose-file-type"}),":"),u.a.createElement("select",{id:"fileType",className:"form-control",onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"fileType","value")},[{type:"image, application/pdf, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-powerpoint, application/vnd.openxmlformats-officedocument.presentationml.presentation, video/mp4,video/x-m4v,video/*",typeName:"All File Type"},{type:"image",typeName:"Image"},{type:"application/pdf",typeName:"PDF"},{type:"application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document",typeName:"Word"},{type:"application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",typeName:"Excel"},{type:"application/vnd.ms-powerpoint, application/vnd.openxmlformats-officedocument.presentationml.presentation",typeName:"Powerpoint"},{type:"video/mp4,video/x-m4v,video/*",typeName:"Videos"}].map((function(e,t){return u.a.createElement("option",{value:e.type,key:t},e.typeName)}))))),"Signature"===this.state.element.element&&this.props.element.readOnly?u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"variableKey"},u.a.createElement(w.a,{id:"variable-key"}),":"),u.a.createElement("input",{id:"variableKey",type:"text",className:"form-control",defaultValue:this.props.element.variableKey,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"variableKey","value")}),u.a.createElement("p",{className:"help-block"},u.a.createElement(w.a,{id:"variable-key-desc"}),".")):u.a.createElement("div",null),f&&u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label"},u.a.createElement(w.a,{id:"print-options"})),u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"page-break-before-element",className:"custom-control-input",type:"checkbox",checked:p,value:!0,onChange:this.editElementProp.bind(this,"pageBreakBefore","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"page-break-before-element"},u.a.createElement(w.a,{id:"page-break-before-elements"}),"?"))),b&&u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label"},u.a.createElement(w.a,{id:"alternate-signature-page"})),u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"display-on-alternate",className:"custom-control-input",type:"checkbox",checked:d,value:!0,onChange:this.editElementProp.bind(this,"alternateForm","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"display-on-alternate"},u.a.createElement(w.a,{id:"display-on-alternate-signature-page"}),"?"))),this.props.element.hasOwnProperty("step")&&u.a.createElement("div",{className:"form-group"},u.a.createElement("div",{className:"form-group-range"},u.a.createElement("label",{className:"control-label",htmlFor:"rangeStep"},u.a.createElement(w.a,{id:"step"})),u.a.createElement("input",{id:"rangeStep",type:"number",className:"form-control",defaultValue:this.props.element.step,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"step","value")}))),this.props.element.hasOwnProperty("min_value")&&u.a.createElement("div",{className:"form-group"},u.a.createElement("div",{className:"form-group-range"},u.a.createElement("label",{className:"control-label",htmlFor:"rangeMin"},u.a.createElement(w.a,{id:"min"})),u.a.createElement("input",{id:"rangeMin",type:"number",className:"form-control",defaultValue:this.props.element.min_value,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"min_value","value")}),u.a.createElement("input",{type:"text",className:"form-control",defaultValue:this.props.element.min_label,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"min_label","value")}))),this.props.element.hasOwnProperty("max_value")&&u.a.createElement("div",{className:"form-group"},u.a.createElement("div",{className:"form-group-range"},u.a.createElement("label",{className:"control-label",htmlFor:"rangeMax"},u.a.createElement(w.a,{id:"max"})),u.a.createElement("input",{id:"rangeMax",type:"number",className:"form-control",defaultValue:this.props.element.max_value,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"max_value","value")}),u.a.createElement("input",{type:"text",className:"form-control",defaultValue:this.props.element.max_label,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"max_label","value")}))),this.props.element.hasOwnProperty("default_value")&&u.a.createElement("div",{className:"form-group"},u.a.createElement("div",{className:"form-group-range"},u.a.createElement("label",{className:"control-label",htmlFor:"defaultSelected"},u.a.createElement(w.a,{id:"default-selected"})),u.a.createElement("input",{id:"defaultSelected",type:"number",className:"form-control",defaultValue:this.props.element.default_value,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"default_value","value")}))),this.props.element.hasOwnProperty("static")&&this.props.element.static&&u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label"},u.a.createElement(w.a,{id:"text-style"})),u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"do-bold",className:"custom-control-input",type:"checkbox",checked:i,value:!0,onChange:this.editElementProp.bind(this,"bold","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"do-bold"},u.a.createElement(w.a,{id:"bold"}))),u.a.createElement("div",{className:"custom-control custom-checkbox"},u.a.createElement("input",{id:"do-italic",className:"custom-control-input",type:"checkbox",checked:c,value:!0,onChange:this.editElementProp.bind(this,"italic","checked")}),u.a.createElement("label",{className:"custom-control-label",htmlFor:"do-italic"},u.a.createElement(w.a,{id:"italic"})))),this.props.element.showDescription&&u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"questionDescription"},u.a.createElement(w.a,{id:"description"})),u.a.createElement(E.default,{type:"text",className:"form-control",id:"questionDescription",defaultValue:this.props.element.description,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"description","value")})),this.props.showCorrectColumn&&this.props.element.canHaveAnswer&&!this.props.element.hasOwnProperty("options")&&u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"correctAnswer"},u.a.createElement(w.a,{id:"correct-answer"})),u.a.createElement("input",{id:"correctAnswer",type:"text",className:"form-control",defaultValue:this.props.element.correct,onBlur:this.updateElement.bind(this),onChange:this.editElementProp.bind(this,"correct","value")})),this.props.element.canPopulateFromApi&&this.props.element.hasOwnProperty("options")&&u.a.createElement("div",{className:"form-group"},u.a.createElement("label",{className:"control-label",htmlFor:"optionsApiUrl"},u.a.createElement(w.a,{id:"populate-options-from-api"})),u.a.createElement("div",{className:"row"},u.a.createElement("div",{className:"col-sm-6"},u.a.createElement("input",{className:"form-control",style:{width:"100%"},type:"text",id:"optionsApiUrl",placeholder:"http://localhost:8080/api/optionsdata"})),u.a.createElement("div",{className:"col-sm-6"},u.a.createElement("button",{onClick:this.addOptions.bind(this),className:"btn btn-success"},u.a.createElement(w.a,{id:"populate"}))))),this.props.element.hasOwnProperty("options")&&u.a.createElement(x,{showCorrectColumn:this.props.showCorrectColumn,canHaveOptionCorrect:N,canHaveOptionValue:g,data:this.props.preview.state.data,updateElement:this.props.updateElement,preview:this.props.preview,element:this.props.element,key:this.props.element.options.length}))}}]),a}(u.a.Component);_.defaultProps={className:"edit-element-fields"}}}]);