react-survey-builder 1.0.43 → 1.0.45

package/lib/survey-elements-edit.js

@@ -19,7 +19,7 @@ var _draftjsToHtml = _interopRequireDefault(require("draftjs-to-html"));
 var _dynamicOptionList = _interopRequireDefault(require("./dynamic-option-list"));
 var _requests = require("./stores/requests");
 var _fa = require("react-icons/fa");
-var _reactBootstrap = require("react-bootstrap");
+var _esm = require("react-bootstrap/esm");
 var _reactSimpleWysiwyg = _interopRequireDefault(require("react-simple-wysiwyg"));
 var _functions = require("./functions");
 var _excluded = ["onChange", "onBlur", "value", "name"];
@@ -173,11 +173,11 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
       }, this.props.element.text), /*#__PURE__*/_react["default"].createElement(_fa.FaTimes, {
         className: "float-end dismiss-edit",
         onClick: this.props.manualEditModeOff
-      })), this.props.element.hasOwnProperty('content') && (this.state.element.element === 'Header' || this.state.element.element === 'Label' || this.state.element.element === 'Paragraph' || this.state.element.element === 'ContentBody') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('content') && (this.state.element.element === 'Header' || this.state.element.element === 'Label' || this.state.element.element === 'Paragraph' || this.state.element.element === 'ContentBody') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold"
-      }, "Text to display:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Text to display:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         type: "text",
         id: "content",
         name: "content",
@@ -186,12 +186,12 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
         defaultValue: this.props.element.content,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'content', 'value')
-      })), this.props.element.hasOwnProperty('filePath') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('filePath') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "fileSelect"
-      }, "Choose file:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Select, {
+      }, "Choose file:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Select, {
         id: "fileSelect",
         defaultValue: this.props.element.filePath,
         onBlur: this.updateElement.bind(this),
@@ -202,22 +202,22 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
           value: file.id,
           key: thisKey
         }, file.file_name);
-      }))), this.props.element.hasOwnProperty('href') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      }))), this.props.element.hasOwnProperty('href') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "href"
-      }, "Link to:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Link to:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         id: "href",
         type: "text",
         defaultValue: this.props.element.href,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'href', 'value')
-      })), this.props.element.hasOwnProperty('label') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('label') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold"
-      }, "Display Label:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Display Label:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         type: "text",
         id: "label",
         name: "label",
@@ -226,50 +226,50 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
         defaultValue: this.props.element.label,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'label', 'value')
-      })), (this.props.element.hasOwnProperty('required') || this.props.element.hasOwnProperty('readOnly') || this.props.element.hasOwnProperty('defaultToday') || ['Checkboxes', 'Checkbox'].indexOf(this.state.element.element) !== -1 || (this.state.element.element === 'RadioButtons' || this.state.element.element === 'Checkboxes') && this.props.element.hasOwnProperty('inline')) && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), (this.props.element.hasOwnProperty('required') || this.props.element.hasOwnProperty('readOnly') || this.props.element.hasOwnProperty('defaultToday') || ['Checkboxes', 'Checkbox'].indexOf(this.state.element.element) !== -1 || (this.state.element.element === 'RadioButtons' || this.state.element.element === 'Checkboxes') && this.props.element.hasOwnProperty('inline')) && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold"
-      }, "Field Properties:"), this.props.element.hasOwnProperty('required') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }, "Field Properties:"), this.props.element.hasOwnProperty('required') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "is-required",
         label: "Required",
         type: "checkbox",
         checked: thisRequiredChecked,
         value: true,
         onChange: this.editElementProp.bind(this, 'required', 'checked')
-      }), this.props.element.hasOwnProperty('readOnly') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }), this.props.element.hasOwnProperty('readOnly') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "is-read-only",
         label: "Read Only",
         type: "checkbox",
         checked: thisReadOnly,
         value: true,
         onChange: this.editElementProp.bind(this, 'readOnly', 'checked')
-      }), this.props.element.hasOwnProperty('defaultToday') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }), this.props.element.hasOwnProperty('defaultToday') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "is-default-to-today",
         label: "Default to Today",
         type: "checkbox",
         checked: thisDefaultToday,
         value: true,
         onChange: this.editElementProp.bind(this, 'defaultToday', 'checked')
-      }), ['Checkboxes', 'Checkbox'].indexOf(this.state.element.element) !== -1 && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }), ['Checkboxes', 'Checkbox'].indexOf(this.state.element.element) !== -1 && /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "default-checked",
         label: "Default Checked",
         type: "checkbox",
         checked: thisDefaultChecked,
         value: true,
         onChange: this.editElementProp.bind(this, 'defaultChecked', 'checked')
-      }), (this.state.element.element === 'RadioButtons' || this.state.element.element === 'Checkboxes') && this.props.element.hasOwnProperty('inline') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }), (this.state.element.element === 'RadioButtons' || this.state.element.element === 'Checkboxes') && this.props.element.hasOwnProperty('inline') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "display-horizontal",
         label: "Display Horizontal",
         type: "checkbox",
         checked: thisCheckedInline,
         value: true,
         onChange: this.editElementProp.bind(this, 'inline', 'checked')
-      })), this.state.element.element === 'Checkbox' && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.state.element.element === 'Checkbox' && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold"
-      }, "Checkbox Label Text:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Checkbox Label Text:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         type: "text",
         id: "boxLabel",
         name: "boxLabel",
@@ -285,59 +285,59 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
             resize: 'both'
           }
         }
-      })), this.props.element.hasOwnProperty('src') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('src') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "srcInput"
-      }, "Link to:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Link to:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         id: "srcInput",
         type: "text",
         defaultValue: this.props.element.src,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'src', 'value')
-      })), (this.state.element.element === 'Image' || this.state.element.element === 'Camera') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), (this.state.element.element === 'Image' || this.state.element.element === 'Camera') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Row, null, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Col, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Row, null, /*#__PURE__*/_react["default"].createElement(_esm.Col, {
         sm: 3
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "do-center"
-      }, "Alignment:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }, "Alignment:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "do-center",
         label: "Center",
         type: "checkbox",
         checked: thisCheckedCenter,
         value: true,
         onChange: this.editElementProp.bind(this, 'center', 'checked')
-      })), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Col, {
+      })), /*#__PURE__*/_react["default"].createElement(_esm.Col, {
         sm: 3
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "elementWidth"
-      }, "Width:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Width:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         id: "elementWidth",
         type: "number",
         defaultValue: this.props.element.width,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'width', 'value')
-      })), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Col, {
+      })), /*#__PURE__*/_react["default"].createElement(_esm.Col, {
         sm: 3
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "elementHeight"
-      }, "Height:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Height:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         id: "elementHeight",
         type: "number",
         defaultValue: this.props.element.height,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'height', 'value')
-      })))), this.state.element.element === 'FileUpload' && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })))), this.state.element.element === 'FileUpload' && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "fileType"
-      }, "Choose file type:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Select, {
+      }, "Choose file type:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Select, {
         id: "fileType",
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'fileType', 'value')
@@ -367,109 +367,109 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
           value: file.type,
           key: index
         }, file.typeName);
-      }))), this.props.element.hasOwnProperty('pageBreakBefore') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      }))), this.props.element.hasOwnProperty('pageBreakBefore') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold"
-      }, "Print options:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }, "Print options:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "page-break-before-element",
         label: "Page Break Before Element",
         type: "checkbox",
         checked: thisCheckedPageBreak,
         value: true,
         onChange: this.editElementProp.bind(this, 'pageBreakBefore', 'checked')
-      })), this.props.element.hasOwnProperty('alternateForm') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('alternateForm') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold"
-      }, "Alternate/Signature Page:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }, "Alternate/Signature Page:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "display-on-alternate",
         label: "Display on alternate/signature Page",
         type: "checkbox",
         checked: thisCheckedAlternateForm,
         value: true,
         onChange: this.editElementProp.bind(this, 'alternateForm', 'checked')
-      })), this.props.element.hasOwnProperty('step') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('step') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: "form-group-range"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "rangeStep"
-      }, "Step:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Step:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         id: "rangeStep",
         type: "number",
         defaultValue: this.props.element.step,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'step', 'value')
-      }))), this.props.element.hasOwnProperty('minValue') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      }))), this.props.element.hasOwnProperty('minValue') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: "form-group-range"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "rangeMin"
-      }, "Min:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Min:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         id: "rangeMin",
         type: "number",
         defaultValue: this.props.element.minValue,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'minValue', 'value')
-      }))), this.props.element.hasOwnProperty('minLabel') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      }))), this.props.element.hasOwnProperty('minLabel') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: "form-group-range"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "rangeMin"
-      }, "Minimum Value Label:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Minimum Value Label:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         type: "text",
         defaultValue: this.props.element.minLabel,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'minLabel', 'value')
-      }))), this.props.element.hasOwnProperty('maxValue') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      }))), this.props.element.hasOwnProperty('maxValue') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: "form-group-range"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "rangeMax"
-      }, "Max:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Max:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         id: "rangeMax",
         type: "number",
         defaultValue: this.props.element.maxValue,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'maxValue', 'value')
-      }))), this.props.element.hasOwnProperty('maxLabel') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      }))), this.props.element.hasOwnProperty('maxLabel') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: "form-group-range"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "rangeMax"
-      }, "Maximum Value Label:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Maximum Value Label:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         type: "text",
         defaultValue: this.props.element.maxLabel,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'maxLabel', 'value')
-      }))), this.props.element.hasOwnProperty('defaultValue') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      }))), this.props.element.hasOwnProperty('defaultValue') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: "form-group-range"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "defaultSelected"
-      }, "Default Selected:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Default Selected:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         id: "defaultSelected",
         type: "number",
         defaultValue: this.props.element.defaultValue,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'defaultValue', 'value')
-      }))), this.props.element.hasOwnProperty('static') && this.props.element["static"] && this.props.element.hasOwnProperty('bold') && this.props.element.hasOwnProperty('italic') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      }))), this.props.element.hasOwnProperty('static') && this.props.element["static"] && this.props.element.hasOwnProperty('bold') && this.props.element.hasOwnProperty('italic') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold"
-      }, "Text Style:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }, "Text Style:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "do-bold",
         inline: true,
         label: "Bold",
@@ -477,7 +477,7 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
         checked: thisCheckedBold,
         value: true,
         onChange: this.editElementProp.bind(this, 'bold', 'checked')
-      }), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }), /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "do-italic",
         inline: true,
         label: "Italic",
@@ -485,34 +485,34 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
         checked: thisCheckedItalic,
         value: true,
         onChange: this.editElementProp.bind(this, 'italic', 'checked')
-      })), this.props.element.hasOwnProperty('placeholder') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('placeholder') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "placeholder"
-      }, "Placeholder:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Placeholder:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         type: "text",
         id: "placeholder",
         defaultValue: this.props.element.placeholder,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'placeholder', 'value')
-      })), this.props.element.hasOwnProperty('customName') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('customName') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "customName"
-      }, "A Name To Give This Input That Will Show Up In Data Retrieval:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "A Name To Give This Input That Will Show Up In Data Retrieval:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         type: "text",
         id: "customName",
         defaultValue: this.props.element.customName,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'customName', 'value')
-      })), this.props.element.hasOwnProperty('labelLocation') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('labelLocation') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "labelLocation"
-      }, "Choose Label Location:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Select, {
+      }, "Choose Label Location:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Select, {
         id: "labelLocation",
         defaultValue: this.props.element.labelLocation,
         onBlur: this.updateElement.bind(this),
@@ -521,20 +521,20 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
         value: "ABOVE"
       }, "Above Form Field"), /*#__PURE__*/_react["default"].createElement("option", {
         value: "FLOATING"
-      }, "Floating Inside Form Field"))), this.props.element.hasOwnProperty('hideLabel') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      }, "Floating Inside Form Field"))), this.props.element.hasOwnProperty('hideLabel') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold"
-      }, "Hide Label:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Check, {
+      }, "Hide Label:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Check, {
         id: "hide-label",
         label: "Hide Label",
         type: "checkbox",
         checked: thisCheckedHideLabel,
         value: true,
         onChange: this.editElementProp.bind(this, 'hideLabel', 'checked')
-      })), this.props.element.hasOwnProperty('help') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.hasOwnProperty('help') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "help"
       }, "Help instructions/details that will show up beneath the input field:"), /*#__PURE__*/_react["default"].createElement(_reactTextareaAutosize["default"], {
@@ -544,9 +544,9 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
         defaultValue: this.props.element.help,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'help', 'value')
-      })), (this.props.showDescription && !this.props.element["static"] || this.props.element.hasOwnProperty('description')) && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), (this.props.showDescription && !this.props.element["static"] || this.props.element.hasOwnProperty('description')) && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "description"
       }, "Description:"), /*#__PURE__*/_react["default"].createElement(_reactTextareaAutosize["default"], {
@@ -556,34 +556,34 @@ var SurveyElementsEdit = exports["default"] = /*#__PURE__*/function (_React$Comp
         defaultValue: this.props.element.description,
         onBlur: this.updateElement.bind(this),
         onChange: this.editElementProp.bind(this, 'description', 'value')
-      })), this.props.showCorrectColumn && canHaveAnswer && !this.props.element.hasOwnProperty('options') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.showCorrectColumn && canHaveAnswer && !this.props.element.hasOwnProperty('options') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "correct"
-      }, "Correct Answer:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, "Correct Answer:"), /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         id: "correct",
         type: "text",
         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') && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Group, {
+      })), this.props.element.canPopulateFromApi && this.props.element.hasOwnProperty('options') && /*#__PURE__*/_react["default"].createElement(_esm.Form.Group, {
         className: "form-group mb-5"
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Label, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Label, {
         className: "fw-bold",
         htmlFor: "optionsApiUrl"
-      }, "Populate Options from API:"), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Row, null, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Col, {
+      }, "Populate Options from API:"), /*#__PURE__*/_react["default"].createElement(_esm.Row, null, /*#__PURE__*/_react["default"].createElement(_esm.Col, {
         sm: 6
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Form.Control, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Form.Control, {
         style: {
           width: '100%'
         },
         type: "text",
         id: "optionsApiUrl",
         placeholder: "http://localhost:8080/api/optionsdata"
-      })), /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Col, {
+      })), /*#__PURE__*/_react["default"].createElement(_esm.Col, {
         sm: 6
-      }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Button, {
+      }, /*#__PURE__*/_react["default"].createElement(_esm.Button, {
         variant: "success",
         onClick: this.addOptions.bind(this)
       }, "Populate")))), this.props.element.hasOwnProperty('options') && /*#__PURE__*/_react["default"].createElement(_dynamicOptionList["default"], {

package/lib/survey-validator.js

@@ -13,7 +13,7 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
 var _react = _interopRequireDefault(require("react"));
 var _xss = _interopRequireDefault(require("xss"));
 var _fa = require("react-icons/fa");
-var _reactBootstrap = require("react-bootstrap");
+var _esm = require("react-bootstrap/esm");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 var myxss = new _xss["default"].FilterXSS({
@@ -80,14 +80,14 @@ var SurveyValidator = exports["default"] = /*#__PURE__*/function (_React$Compone
           }
         });
       });
-      return /*#__PURE__*/_react["default"].createElement("div", null, this.state.errors.length > 0 && /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Alert, {
+      return /*#__PURE__*/_react["default"].createElement("div", null, this.state.errors.length > 0 && /*#__PURE__*/_react["default"].createElement(_esm.Alert, {
         variant: "danger",
         className: "validation-error d-flex-inline justify-content-between"
       }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_fa.FaExclamationTriangle, {
         className: "float-start"
       }), /*#__PURE__*/_react["default"].createElement("ul", {
         className: "float-start"
-      }, errors)), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Button, {
+      }, errors)), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_esm.Button, {
         variant: "danger",
         size: "sm",
         className: "float-end",

package/lib/toolbar-group-item.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireDefault(require("react"));
-var _reactBootstrap = require("react-bootstrap");
+var _esm = require("react-bootstrap/esm");
 var ToolbarGroupItem = function ToolbarGroupItem(_ref) {
   var name = _ref.name,
     group = _ref.group,
@@ -22,7 +22,7 @@ var ToolbarGroupItem = function ToolbarGroupItem(_ref) {
   var classShow = 'collapse' + (show ? ' show' : '');
   return /*#__PURE__*/_react["default"].createElement("li", null, /*#__PURE__*/_react["default"].createElement("div", {
     className: "toolbar-group-item"
-  }, /*#__PURE__*/_react["default"].createElement(_reactBootstrap.Button, {
+  }, /*#__PURE__*/_react["default"].createElement(_esm.Button, {
     variant: "link",
     className: "btn-block text-left",
     type: "button",

package/lib/utils/validators.js

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.validatePhone = exports.validateEmail = exports.validateDate = exports.toE164PhoneNumber = void 0;
+var _reactPhoneNumberInput = require("react-phone-number-input");
+var validateEmail = exports.validateEmail = function validateEmail(email) {
+  return email.match(
+  // eslint-disable-next-line no-useless-escape
+  /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/);
+};
+var toE164PhoneNumber = exports.toE164PhoneNumber = function toE164PhoneNumber(phoneNumberValue) {
+  if (phoneNumberValue !== undefined && phoneNumberValue !== null) {
+    //Filter only numbers from the input
+    var cleaned = ('' + phoneNumberValue).replace(/\D/g, '');
+
+    //Check if the input is of correct
+    var match = cleaned.match(/^(1|)?(\d{3})(\d{3})(\d{4})$/);
+    if (match) {
+      //Remove the matched extension code
+      //Change this to format for any country code.
+      var intlCode = match[1] ? '+1' : '+1';
+      return [intlCode, match[2], match[3], match[4]].join('');
+    }
+    return '';
+  } else {
+    return '';
+  }
+};
+var validatePhone = exports.validatePhone = function validatePhone(phone) {
+  return (0, _reactPhoneNumberInput.isValidPhoneNumber)(toE164PhoneNumber(phone), 'US');
+};
+var validateDate = exports.validateDate = function validateDate(dateString) {
+  if (dateString !== undefined && dateString !== null && dateString !== "") {
+    var dateformat = /^(0?[1-9]|1[0-2])[\/](0?[1-9]|[1-2][0-9]|3[01])[\/]\d{4}$/;
+
+    // Matching the date through regular expression      
+    if (dateString.match(dateformat)) {
+      var operator = dateString.split('/');
+
+      // Extract the string into month, date and year      
+      var datepart = [];
+      if (operator.length > 1) {
+        datepart = dateString.split('/');
+      }
+      var month = parseInt(datepart[0]);
+      var day = parseInt(datepart[1]);
+      var year = parseInt(datepart[2]);
+      if (day > 31 || day < 1) {
+        return false;
+      }
+      var currentYear = new Date().getFullYear();
+      if (year < 1900 || year > currentYear + 5) {
+        return false;
+      }
+
+      // Create a list of days of a month      
+      var ListofDays = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+      if (month === 1 || month > 2) {
+        if (day > ListofDays[month - 1]) {
+          // to check if the date is out of range     
+          return false;
+        }
+      } else if (month === 2) {
+        var leapYear = false;
+        if (!(year % 4) && year % 100 || !(year % 400)) leapYear = true;
+        if (leapYear === false && day >= 29) return false;else if (leapYear === true && day > 29) {
+          // console.log('Invalid date format!');
+          return false;
+        }
+      } else if (month > 12 || month < 1) {
+        return false;
+      }
+    } else {
+      // console.log("Invalid date format!");
+      return false;
+    }
+  }
+  return true;
+};