gd-sprest-bs/dist/gd-sprest-bs.js

SharePoint JavaScript, TypeScript and Web Components designed using the Bootstrap framework.

/*! For license information please see gd-sprest-bs.js.LICENSE.txt */
(function(){var __webpack_modules__={"./build/components/core.js":function(__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 */   Components: function() { return /* reexport safe */ gd_bs__WEBPACK_IMPORTED_MODULE_0__.Components; }\n/* harmony export */ });\n/* harmony import */ var gd_bs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! gd-bs */ "./node_modules/.pnpm/gd-bs@6.9.20_@popperjs+core@2.11.8/node_modules/gd-bs/build/index.js");\n\n\n//# sourceURL=webpack://gd-sprest-bs/./build/components/core.js?')},"./build/components/datetime/index.js":function(__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 */   DateTime: function() { return /* binding */ DateTime; },\n/* harmony export */   DateTimeControlType: function() { return /* binding */ DateTimeControlType; }\n/* harmony export */ });\n/* harmony import */ var flatpickr__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! flatpickr */ "./node_modules/.pnpm/flatpickr@4.6.13/node_modules/flatpickr/dist/flatpickr.min.js");\n/* harmony import */ var flatpickr__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(flatpickr__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var gd_bs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! gd-bs */ "./node_modules/.pnpm/gd-bs@6.9.20_@popperjs+core@2.11.8/node_modules/gd-bs/build/index.js");\n\n\n/**\r\n * Date/Time\r\n */\nvar DateTime = function DateTime(props) {\n  // Create the date/time element\n  var elDateTime = document.createElement("div");\n  elDateTime.className = "date-time";\n  // Create the textbox\n  var textbox = gd_bs__WEBPACK_IMPORTED_MODULE_1__.Components.InputGroup({\n    el: elDateTime,\n    label: props.label,\n    isDisabled: props.disabled,\n    onChange: props.onChange\n  });\n  // Get the options and default the values\n  var options = props.options || {};\n  options.enableTime = props.showTime;\n  options.dateFormat = options.dateFormat || "m-d-Y" + (props.showTime ? " h:i K" : "");\n  // See if the value is a string\n  if (props.value && typeof props.value === "string") {\n    options.defaultDate = new Date(props.value);\n  } else {\n    // Set the value\n    options.defaultDate = props.value;\n  }\n  // Apply the plugin\n  var datetime = flatpickr(textbox.el.querySelector("input"), options);\n  // See if we are disabling the component\n  if (props.disabled) {\n    // Remove the read-only setting set by the flatpickr\n    textbox.elTextbox.readOnly = false;\n  }\n  // Create the element\n  var el = document.createElement("div");\n  el.appendChild(elDateTime);\n  // See if we are rendering it to an element\n  if (props.el) {\n    // Ensure the parent element exists\n    if (props.el.parentElement && props.el.parentElement.classList) {\n      // Set the bootstrap class\n      props.el.parentElement.classList.contains("bs") ? null : props.el.parentElement.classList.add("bs");\n    }\n    // Append the elements\n    while (el.children.length > 0) {\n      props.el.appendChild(el.children[0]);\n    }\n    // Update the element\n    el = props.el;\n  } else {\n    // Set the bootstrap class\n    el.classList.add("bs");\n  }\n  // Create the object\n  var obj = {\n    el: elDateTime,\n    flatpickrObj: datetime,\n    getDate: function getDate() {\n      return datetime.selectedDates[0];\n    },\n    getValue: function getValue() {\n      return textbox.getValue();\n    },\n    setValue: function setValue(dt, dtFormat) {\n      // Default the format\n      dtFormat = dtFormat || (props.options ? props.options.dateFormat : null);\n      // Set the date/time\n      datetime.setDate(dt, true, dtFormat);\n    }\n  };\n  // Execute the assign to event\n  props.assignTo ? props.assignTo(obj) : null;\n  // Return the object\n  return obj;\n};\n// Customize the form control\nvar DateTimeControlType = 100;\ngd_bs__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes["DateTime"] = DateTimeControlType;\ngd_bs__WEBPACK_IMPORTED_MODULE_1__.Components.CustomControls.registerType(DateTimeControlType, function (props) {\n  var dt = null;\n  // Set the created method\n  var onRendered = props.onControlRendered;\n  props.onControlRendered = function (ctrl) {\n    // Render a date/time\n    dt = DateTime({\n      className: props.className,\n      disabled: props.isDisabled || props.isReadonly,\n      el: ctrl.el,\n      options: props.options,\n      showTime: props.showTime,\n      value: props.value\n    });\n    // See if the label exists\n    var elLabel = ctrl["_elLabel"];\n    if (elLabel) {\n      // Set the id and aria properties\n      elLabel ? elLabel.id = (props.id || props.name) + "_label" : null;\n      dt.el.querySelector("input").setAttribute("aria-labelledby", elLabel.id);\n    }\n    // Set the control\n    ctrl.setControl(dt);\n    // Call the custom render event\n    onRendered ? onRendered(ctrl) : null;\n  };\n  var onValidate = props.onValidate;\n  props.onValidate = function (ctrl, result) {\n    // See if the field is required\n    if (ctrl.required) {\n      // Get the date field elements\n      var elDateElements = dt.el.querySelectorAll(".form-control");\n      for (var i = 0; i < elDateElements.length; i++) {\n        // Get the visible input element\n        var elDateElement = elDateElements[i];\n        if (elDateElement.type != "hidden") {\n          // See if the value exists\n          if (result.value) {\n            // Update the classes\n            elDateElement.classList.remove("is-invalid");\n            elDateElement.classList.add("is-valid");\n          } else {\n            // Update the classes\n            elDateElement.classList.remove("is-valid");\n            elDateElement.classList.add("is-invalid");\n          }\n        }\n      }\n    }\n    // Call the onvalidate event\n    var returnVal = onValidate ? onValidate(ctrl, result) : null;\n    // Return the result\n    return returnVal || result;\n  };\n  // Register a people picker\n  props.onGetValue = function (ctrl) {\n    // Return the value\n    return dt ? dt.getDate() : ctrl.value;\n  };\n});\n\n//# sourceURL=webpack://gd-sprest-bs/./build/components/datetime/index.js?')},"./build/components/field/index.js":function(__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 */   Field: function() { return /* binding */ Field; }\n/* harmony export */ });\n/* harmony import */ var gd_sprest__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! gd-sprest */ "gd-sprest");\n/* harmony import */ var gd_sprest__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(gd_sprest__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../core */ "./build/components/core.js");\n/* harmony import */ var _datetime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../datetime */ "./build/components/datetime/index.js");\n/* harmony import */ var _peoplePicker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../peoplePicker */ "./build/components/peoplePicker/index.js");\n/* harmony import */ var _richTextBox__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../richTextBox */ "./build/components/richTextBox/index.js");\n\n\n\n\n\n/**\r\n * Field\r\n */\nvar Field = function Field(props) {\n  var control;\n  var lookupFieldInfo = null;\n  var mmsFieldInfo = null;\n  // Method to get the choice options\n  var getChoiceItems = function getChoiceItems(isCheckbox, field, selectedValues) {\n    var items = [];\n    // Update the selected values\n    selectedValues = selectedValues && selectedValues.results ? selectedValues.results : [selectedValues];\n    // Parse the choices\n    for (var i = 0; i < field.Choices.results.length; i++) {\n      var choice = field.Choices.results[i];\n      var isSelected = false;\n      // Determine if this choice is selected\n      for (var j = 0; j < selectedValues.length; j++) {\n        // See if this choice is selected\n        if (choice == selectedValues[j]) {\n          // Set the flag and break from the loop\n          isSelected = true;\n          break;\n        }\n      }\n      // See if this is a checkbox\n      if (isCheckbox) {\n        // Add the item\n        items.push({\n          isSelected: isSelected,\n          label: choice\n        });\n      } else {\n        // Add the item\n        items.push({\n          isSelected: isSelected,\n          label: choice,\n          text: choice,\n          value: choice\n        });\n      }\n    }\n    // Parse the selected values\n    for (var _i = 0; _i < selectedValues.length; _i++) {\n      var existsFl = false;\n      var selectedValue = selectedValues[_i];\n      // Parse the items\n      for (var _j = 0; _j < items.length; _j++) {\n        var itemValue = isCheckbox ? items[_j]["label"] : items[_j]["value"];\n        // See if the value exists\n        if (selectedValue == itemValue) {\n          // Set the flag\n          existsFl = true;\n          break;\n        }\n      }\n      // Ensure a value exists and see if this was a fill-in choice\n      if (!existsFl && selectedValue) {\n        // See if this is a checkbox\n        if (isCheckbox) {\n          // Add the item\n          items.push({\n            isSelected: true,\n            label: selectedValue\n          });\n        } else {\n          // Add the item\n          items.push({\n            isSelected: true,\n            label: selectedValue,\n            text: selectedValue,\n            value: selectedValue\n          });\n        }\n      }\n    }\n    // See if this is a dropdown and no selected values exists, and this is a required field\n    if (!isCheckbox && items.length > 0 && selectedValues.length == 0 && field.Required) {\n      // Select the first item\n      items[0].isSelected = true;\n    }\n    // Return the items\n    return items;\n  };\n  // Method to get the file extension\n  var getFileExtension = function getFileExtension() {\n    var fileName = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";\n    var extension = fileName.split(\'.\');\n    return extension[extension.length - 1].toLowerCase();\n  };\n  // Method to generate the lookup dropdown items\n  var getLookupItems = function getLookupItems(field, lookupItems, selectedValues) {\n    var items = [];\n    // Update the selected values\n    selectedValues = selectedValues && selectedValues.results ? selectedValues.results : [selectedValues];\n    // Parse the lookup items\n    for (var i = 0; i < lookupItems.length; i++) {\n      var item = lookupItems[i];\n      var isSelected = false;\n      // Determine if this lookup is selected\n      for (var j = 0; j < selectedValues.length; j++) {\n        var id = selectedValues[j] && selectedValues[j].Id ? selectedValues[j].Id : selectedValues[j];\n        // See if this choice is selected\n        if (item.Id == id) {\n          // Set the flag and break from the loop\n          isSelected = true;\n          break;\n        }\n      }\n      // Add the item\n      items.push({\n        data: item,\n        isSelected: isSelected,\n        text: item[field.LookupField],\n        value: item.Id.toString()\n      });\n    }\n    // See if no selected values exists, and this is a required field\n    if (items.length > 0 && selectedValues.length == 0 && field.Required) {\n      // Select the first item\n      items[0].isSelected = true;\n    }\n    // Return the items\n    return items;\n  };\n  // Method to get the mms dropdown items\n  var _getMMSItems = function getMMSItems(term) {\n    var selectedValues = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];\n    var isRoot = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;\n    var items = [];\n    // See if information exists\n    if (term.info && !isRoot) {\n      var isSelected = false;\n      // Parse the selected values\n      for (var i = 0; i < selectedValues.length; i++) {\n        // See if this item is selected\n        if (selectedValues[i] == term.info.id) {\n          isSelected = true;\n          break;\n        }\n      }\n      // Add the heading\n      items.push({\n        data: term,\n        isSelected: isSelected,\n        text: term.info.name,\n        value: term.info.id\n      });\n    }\n    // Parse the terms\n    for (var termName in term) {\n      var child = term[termName];\n      // Skip the info and parent properties\n      if (termName == "info" || termName == "parent") {\n        continue;\n      }\n      // Get the child items\n      var childItems = _getMMSItems(child, selectedValues, false);\n      // Add the item\n      items = items.concat(childItems);\n    }\n    // See if no selected values exists, and this is a required field\n    if (items.length > 0 && selectedValues.length == 0 && isRequired) {\n      // Select the first item\n      items[0].isSelected = true;\n    }\n    // Return the items\n    return items;\n  };\n  // Set the properties based on the field link\n  var fieldLink = props.listInfo.fieldLinks ? props.listInfo.fieldLinks[props.field.InternalName] : null;\n  var isReadonly = fieldLink && typeof fieldLink.ReadOnly === "boolean" ? fieldLink.ReadOnly : props.field.ReadOnlyField;\n  var isRequired = fieldLink && typeof fieldLink.Required === "boolean" ? fieldLink.Required : props.field.Required;\n  // See if this is an internal field\n  if (props.field.CanBeDeleted == false) {\n    // Override the property based on the field property\n    isReadonly = isReadonly || props.field.ReadOnlyField;\n  }\n  // Set the default properties for the control\n  var controlProps = {\n    description: props.field.Description,\n    errorMessage: props.errorMessage,\n    id: props.field.InternalName,\n    isReadonly: isReadonly,\n    label: (isRequired ? "* " : "") + props.field.Title,\n    name: props.field.InternalName,\n    onControlRendering: function onControlRendering(control) {\n      // Execute the event\n      return props.onControlRendering ? props.onControlRendering(control, props.field) : null;\n    },\n    onControlRendered: function onControlRendered(formControl) {\n      // Save the control\n      control = formControl;\n      // Execute the event\n      return props.onControlRendered ? props.onControlRendered(control, props.field) : null;\n    },\n    required: isRequired,\n    type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.TextField,\n    value: props.value\n  };\n  // Define a base validation method\n  var baseValidation = null;\n  // See if this is a new form, a default value exists and no value has been defined\n  if (props.controlMode == gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.ControlMode.New && props.field.DefaultValue && props.value == null) {\n    // Set the default value\n    controlProps.value = props.field.DefaultValue;\n  }\n  // Set the type\n  var onControlRendered = null;\n  var onControlRendering = null;\n  switch (props.field.FieldTypeKind) {\n    // Boolean\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.Boolean:\n      // Set the type\n      controlProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Checkbox;\n      // Create the item\n      controlProps.items = [{\n        label: controlProps.label\n      }];\n      // Clear the label\n      controlProps.label = "";\n      break;\n    // Choice\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.Choice:\n      var allowFillIn = props.field.FillInChoice;\n      var displayRadioButtons = props.field.SchemaXml.indexOf(\'Format="RadioButtons"\') > 0 ? true : false;\n      // See if we are displaying radio buttons\n      if (displayRadioButtons) {\n        // Set the type\n        controlProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Switch;\n      } else {\n        // Set the type\n        controlProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Dropdown;\n      }\n      // Get the items\n      var items = getChoiceItems(displayRadioButtons, props.field, props.value);\n      // Add a blank entry if this is a dropdown\n      if (!displayRadioButtons) {\n        items = [{\n          text: "",\n          value: null\n        }].concat(items);\n      }\n      // See if we are allowing custom values\n      if (allowFillIn) {\n        // Set the base validation\n        baseValidation = function baseValidation(ctrl, result) {\n          // Update the value\n          result.value = result.value && typeof result.value.text === "string" ? result.value.value : result.value;\n          // See if a fill-in choice exists\n          var fillInChoice = tbFillIn.getValue();\n          if (fillInChoice) {\n            // Override the value\n            result.value = fillInChoice;\n          }\n          // See if this control is required\n          if (ctrl.props.required) {\n            // Update the flag\n            result.isValid = result.value ? true : false;\n          }\n          // Return the result\n          return result;\n        };\n        // Set the rendered event\n        var tbFillIn = null;\n        onControlRendered = controlProps.onControlRendered;\n        controlProps.onControlRendered = function (formControl) {\n          // Append a textbox\n          tbFillIn = _core__WEBPACK_IMPORTED_MODULE_1__.Components.InputGroup({\n            el: formControl.el,\n            className: "choice-fill-in",\n            placeholder: "Fill In Choice"\n          });\n          // Call the event\n          onControlRendered ? onControlRendered(formControl) : null;\n        };\n      }\n      // Set the items\n      controlProps.items = items;\n      // Set the base validation\n      baseValidation = function baseValidation(ctrl, result) {\n        // See if a selected item exists and the field is required\n        if (result.value && ctrl.props.required) {\n          // See if this is a dropdown\n          if (ctrl.props.type == _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Dropdown) {\n            var ddlItem = result.value;\n            // See if the text and value don\'t exist\n            if (ddlItem.value || ddlItem.text ? false : true) {\n              // Set the flag\n              result.isValid = false;\n            }\n          }\n          // Else, it\'s a switch\n          else {\n            var cbItem = result.value;\n            // See if a value doesn\'t exist\n            if (cbItem.label ? false : true) {\n              // Set the flag\n              result.isValid = false;\n            }\n          }\n        }\n        // Return the result\n        return result;\n      };\n      break;\n    // Currency Field\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.Currency:\n      // Set the type\n      controlProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.TextField;\n      // Set the rendered event\n      onControlRendering = controlProps.onControlRendering;\n      controlProps.onControlRendering = function (tbProps) {\n        // See if the currency exists in the field\n        var shortName = props.field.TypeShortDescription;\n        var matches = /\\(([^)]+)\\)/.exec(shortName);\n        var symbol = matches.length > 0 ? matches[1] : "$";\n        // Set the text\n        tbProps.prependedLabel = symbol;\n        // Call the event\n        onControlRendering ? onControlRendering(tbProps) : null;\n        // Set the validation event\n        // Validate the extension\n        baseValidation = function baseValidation(ctrl, results) {\n          // Ensure a value exists\n          if (results.value) {\n            // Ensure it\'s a valid currency value\n            results.isValid = /(?=.*?\\d)^\\$?(([1-9]\\d{0,2}(,\\d{3})*)|\\d+)?(\\.\\d{1,2})?$/.test(results.value);\n            results.invalidMessage = "The currency format is not a valid.";\n          }\n          // Return the results\n          return results;\n        };\n      };\n      break;\n    // Date/Time\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.DateTime:\n      // Set the time flag\n      var showTime = props.field.DisplayFormat == gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.DateFormat.DateTime;\n      controlProps.showTime = showTime;\n      // Set the type\n      controlProps.type = _datetime__WEBPACK_IMPORTED_MODULE_2__.DateTimeControlType;\n      // See if there is a formula and this is a new form\n      var dtValue = (props.field.DefaultFormula || props.field.DefaultValue || "").toLowerCase();\n      if (dtValue && props.controlMode == gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.ControlMode.New) {\n        var idx = dtValue.indexOf("today");\n        // See if the date is a formula\n        if (idx >= 0) {\n          var dtNow = new Date(Date.now());\n          // See if we are adding days\n          var daysIdx = dtValue.indexOf("+", idx);\n          if (daysIdx > 0) {\n            // Get the number of days to add\n            var days = parseInt(dtValue.substr(daysIdx + 1));\n            if (days > 0) {\n              // Add the days\n              dtNow.setDate(dtNow.getDate() + days);\n            }\n          }\n          // See if we are subtracting days\n          daysIdx = dtValue.indexOf("-", idx);\n          if (daysIdx > 0) {\n            // Get the number of days to add\n            var _days = parseInt(dtValue.substr(daysIdx + 1));\n            if (_days > 0) {\n              // Add the days\n              dtNow.setDate(dtNow.getDate() - _days);\n            }\n          }\n          // Set the value\n          controlProps.value = dtNow;\n        } else {\n          // Set the value\n          controlProps.value = new Date(dtValue);\n        }\n      }\n      break;\n    // Image\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.Image:\n      var fileInfo = null;\n      var imageValue = controlProps.value;\n      // Set the type\n      controlProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.TextField;\n      controlProps.placeholder = "Add an image";\n      controlProps.isDisabled = true;\n      // Update the value\n      if (controlProps.value) {\n        // Update the value to only display the file name\n        try {\n          var imageProps = JSON.parse(controlProps.value);\n          controlProps.value = imageProps.fileName;\n        } catch (_a) {}\n      }\n      // Validate the extension\n      baseValidation = function baseValidation(ctrl, results) {\n        // See if we are uploading a new file\n        if (fileInfo) {\n          // Ensure it\'s an image\n          var info = fileInfo.name.split(\'.\');\n          var fileExt = info[info.length - 1].toLowerCase();\n          if (["tiff", "pjp", "jfif", "bmp", "gif", "svg", "png", "xbm", "dib", "jxl", "jpeg", "svgz", "jpg", "webp", "ico", "tif", "pjpeg", "avif"].indexOf(fileExt) < 0) {\n            // Set the flag\n            results.isValid = false;\n            results.invalidMessage = "The file must be an image.";\n          }\n        }\n        // Else, see if a value doesn\'t exist\n        else if (results.value == null) {\n          // Set the flag based on if it\'s required\n          results.isValid = ctrl.props.required ? false : results.isValid;\n        }\n        // Return the results\n        return results;\n      };\n      onControlRendered = controlProps.onControlRendered;\n      controlProps.onControlRendered = function (ctrl) {\n        // Append the edit button\n        _core__WEBPACK_IMPORTED_MODULE_1__.Components.Button({\n          el: ctrl.textbox.el,\n          type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.ButtonTypes.OutlineSecondary,\n          text: "Edit",\n          onClick: function onClick() {\n            // Show a file loader\n            gd_sprest__WEBPACK_IMPORTED_MODULE_0__.Helper.ListForm.showFileDialog().then(function (file) {\n              // Save the file info\n              fileInfo = file;\n              fileInfo.fieldId = props.field.Id;\n              fileInfo.fieldName = props.field.InternalName;\n              // Set the value to the file name\n              ctrl.textbox.setValue(file.name);\n            });\n          }\n        });\n        // Append the clear button\n        _core__WEBPACK_IMPORTED_MODULE_1__.Components.Button({\n          el: ctrl.textbox.el,\n          type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.ButtonTypes.OutlineSecondary,\n          text: "Clear",\n          onClick: function onClick() {\n            // Clear the value\n            ctrl.textbox.setValue("");\n            fileInfo = null;\n            imageValue = null;\n          }\n        });\n        // Call the rendered event\n        onControlRendered ? onControlRendered(ctrl) : null;\n      };\n      // Set the get value event\n      controlProps.onGetValue = function () {\n        // Return the file information\n        return fileInfo || imageValue;\n      };\n      break;\n    // Lookup\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.Lookup:\n      // Default the lookup field props will determine the default type\n      controlProps.type = props.field.AllowMultipleValues ? _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.MultiDropdown : _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Dropdown;\n      // See if this field is readonly and a value exists\n      if (isReadonly) {\n        // Update the value\n        controlProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Readonly;\n        // Ensure a value exists\n        if (props.value) {\n          // Set the rendered event\n          onControlRendered = controlProps.onControlRendered;\n          controlProps.onControlRendered = function (formControl) {\n            // Set the class name\n            control.el.classList.add("form-control");\n            control.el.style.backgroundColor = "#e9ecef";\n            // Override the html rendered\n            control.el.innerHTML = props.listInfo.fieldValuesAsHtml[props.field.InternalName];\n          };\n        }\n      } else {\n        // Set the rendering event\n        onControlRendering = controlProps.onControlRendering;\n        controlProps.onControlRendering = function (newProps) {\n          // Update the control properties\n          controlProps = newProps;\n          // Display a loading message\n          controlProps.loadingMessage = "Loading the Lookup Data";\n          // Return a promise\n          return new Promise(function (resolve, reject) {\n            // Load the field information\n            gd_sprest__WEBPACK_IMPORTED_MODULE_0__.Helper.ListFormField.create({\n              field: props.field,\n              listName: props.listInfo.list.Title,\n              name: props.field.InternalName,\n              webUrl: props.listInfo.webUrl\n            }).then(\n            // Success\n            function (fieldInfo) {\n              // Save the field information\n              lookupFieldInfo = fieldInfo;\n              // Set the lookup filter\n              lookupFieldInfo.lookupFilter = props.lookupFilter;\n              // Update the multi property\n              controlProps.multi = lookupFieldInfo.multi;\n              // Get the drop down information\n              gd_sprest__WEBPACK_IMPORTED_MODULE_0__.Helper.ListFormField.loadLookupData(lookupFieldInfo, 500).then(\n              // Success\n              function (items) {\n                // Get the dropdown items\n                var ddlItems = getLookupItems(props.field, items, props.value);\n                // See if this is not a required field and not a multi-select\n                if (!isRequired && !lookupFieldInfo.multi) {\n                  // Add a blank entry\n                  ddlItems = [{\n                    text: "",\n                    value: null\n                  }].concat(ddlItems);\n                }\n                // Set the items\n                controlProps.items = ddlItems;\n                // Clear the element\n                controlProps.el ? controlProps.el.innerHTML = "" : null;\n                // Clear the value, since the getLookupItems method takes care of this for us\n                controlProps.value = null;\n                // Call the event\n                var returnVal = onControlRendering ? onControlRendering(controlProps) : null;\n                if (returnVal && returnVal.then) {\n                  // Wait for the promise to complete\n                  returnVal.then(function (props) {\n                    // Resolve the promise\n                    resolve(props || controlProps);\n                  });\n                } else {\n                  // Resolve the promise\n                  resolve(controlProps);\n                }\n              },\n              // Error\n              function (msg) {\n                // Set the error message\n                var errorMessage = "Error loading the lookup field values for \'" + props.field.InternalName + "\'.";\n                // Display an error message\n                _core__WEBPACK_IMPORTED_MODULE_1__.Components.Alert({\n                  el: controlProps.el,\n                  content: errorMessage,\n                  type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.AlertTypes.Danger\n                });\n                // Call the error event\n                props.onError ? props.onError(errorMessage) : null;\n              });\n            },\n            // Error\n            function (msg) {\n              // Set the error message\n              var errorMessage = "Error loading the field information for field \'" + props.field.InternalName + "\'.";\n              // Display an error message\n              controlProps.el.innerHTML = "";\n              _core__WEBPACK_IMPORTED_MODULE_1__.Components.Alert({\n                el: controlProps.el,\n                content: "Error loading the lookup field information.",\n                type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.AlertTypes.Danger\n              });\n              // Call the error event\n              props.onError ? props.onError(errorMessage) : null;\n              // Reject the request\n              reject(msg);\n            });\n          });\n        };\n      }\n      break;\n    // Multi-Choice\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.MultiChoice:\n      var allowFillInMulti = props.field.FillInChoice;\n      var isChoice = props.field.SchemaXml.indexOf(\'Format="RadioButtons"\') > 0 ? true : false;\n      // Set the type\n      controlProps.type = isChoice ? _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.MultiSwitch : _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.MultiDropdown;\n      // Update the value\n      controlProps.value = (props.value ? props.value.results : null) || props.value;\n      // Set the items\n      controlProps.items = getChoiceItems(isChoice, props.field, props.value);\n      // See if we are allowing custom values\n      if (allowFillInMulti) {\n        // Set the base validation\n        baseValidation = function baseValidation(ctrl, result) {\n          // See if a fill-in choice exists\n          var fillInChoice = _tbFillIn.getValue();\n          if (fillInChoice) {\n            // Append the value\n            result.value.push({\n              isSelected: true,\n              label: fillInChoice,\n              text: fillInChoice,\n              value: fillInChoice\n            });\n          }\n          // See if this control is required\n          if (ctrl.props.required) {\n            // Update the flag\n            result.isValid = result.value.length ? true : false;\n          }\n          // Return the result\n          return result;\n        };\n        // Set the rendered event\n        var _tbFillIn = null;\n        onControlRendered = controlProps.onControlRendered;\n        controlProps.onControlRendered = function (formControl) {\n          // Append a textbox\n          _tbFillIn = _core__WEBPACK_IMPORTED_MODULE_1__.Components.InputGroup({\n            el: formControl.el,\n            className: "choice-fill-in",\n            placeholder: "Fill In Choice"\n          });\n          // Call the event\n          onControlRendered ? onControlRendered(formControl) : null;\n        };\n      }\n      break;\n    // Note\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.Note:\n      var noteField = props.field;\n      // See if this is plain text\n      if (noteField.RichText) {\n        var rtbProps = controlProps;\n        var fullToolbar = noteField.SchemaXml.match(/RichTextMode="FullHtml"/i) ? true : false;\n        // Set the properties\n        rtbProps.type = _richTextBox__WEBPACK_IMPORTED_MODULE_4__.RichTextBoxControlType;\n        rtbProps.toolbarType = fullToolbar ? _richTextBox__WEBPACK_IMPORTED_MODULE_4__.RichTextBoxTypes.Full : _richTextBox__WEBPACK_IMPORTED_MODULE_4__.RichTextBoxTypes.Basic;\n      } else {\n        // Set the properties\n        controlProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.TextArea;\n        controlProps.rows = props.field.NumberOfLines;\n      }\n      break;\n    // Number Field\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.Number:\n      var numberField = props.field;\n      var numberProps = controlProps;\n      // Set the default value\n      numberProps.value = numberProps.value == null ? numberField.DefaultValue : numberProps.value;\n      // See if this is a percentage\n      var isPercent = numberField.ShowAsPercentage;\n      if (isPercent == null) {\n        // Set the value from the schema (2013 environments)\n        isPercent = numberField.SchemaXml.toLowerCase().indexOf(\'percentage="true"\') > 0;\n      }\n      if (isPercent) {\n        // Set the type\n        numberProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Range;\n        // Default the max\n        numberProps.max = numberField.MaximumValue == 1 || numberField.MaximumValue == Number.MAX_VALUE ? 100 : numberField.MaximumValue;\n        // Set the min value\n        numberProps.min = numberField.MinimumValue == -1.7976931348623157e+308 ? 0 : numberField.MinimumValue;\n        // Set the value\n        numberProps.value = numberProps.value == null || numberProps.value == Number.MIN_VALUE ? 0 : numberProps.value;\n        numberProps.value = numberProps.value * (numberProps.max == 100 && numberProps.value <= 1 ? 100 : 1);\n      }\n      // Else, see if the min/max values are defined\n      else if (typeof numberField.MaximumValue == "number" && numberField.MaximumValue != Number.MAX_VALUE && typeof numberField.MinimumValue == "number" && numberField.MinimumValue != Number.MIN_VALUE) {\n        // Update the properties to display a range\n        numberProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Range;\n        numberProps.max = numberField.MaximumValue;\n        numberProps.min = numberField.MinimumValue;\n        numberProps.value = typeof numberProps.value == "number" ? numberProps.value : numberProps.min;\n        // Set validation\n        if (numberField.MinimumValue || numberField.MaximumValue) {\n          // Add validation\n          baseValidation = function baseValidation(control, result) {\n            // Ensure the value is a number\n            if (/^[0-9]*$/.test(result.value) == false) {\n              // Update the validation and return it\n              result.isValid = false;\n              result.invalidMessage = "The value must be a number.";\n              return result;\n            }\n            // Validate the min value\n            if (numberField.MinimumValue && result.value < numberField.MinimumValue) {\n              // Update the validation and return it\n              result.isValid = false;\n              result.invalidMessage = "The value must be greater than or equal to " + numberField.MinimumValue;\n              return result;\n            }\n            // Validate the max value\n            if (numberField.MaximumValue && result.value > numberField.MaximumValue) {\n              // Update the validation and return it\n              result.isValid = false;\n              result.invalidMessage = "The value must be less than or equal to " + numberField.MaximumValue;\n              return result;\n            }\n            // Valid\n            result.isValid = true;\n            // Return the result\n            return result;\n          };\n        }\n      } else {\n        // Set the type\n        numberProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.TextField;\n        // Set the render event\n        onControlRendered = controlProps.onControlRendered;\n        controlProps.onControlRendered = function (formControl) {\n          // Set the type to be a number\n          formControl.textbox.elTextbox.setAttribute("type", "number");\n        };\n      }\n      break;\n    // URL\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.URL:\n      var desc = null;\n      var url = null;\n      var value = props.value;\n      // See if a value exists\n      if (props.value) {\n        // Update the value\n        controlProps.value = props.value.Url;\n      }\n      // Set the render event\n      onControlRendered = controlProps.onControlRendered;\n      controlProps.onControlRendered = function (formControl) {\n        // Save the control\n        control = formControl;\n        // Clear the element\n        control.el.innerHTML = "";\n        // See if we are rendering the description\n        var showDesc = controlProps.showDescription;\n        showDesc = typeof showDesc === "boolean" ? showDesc : true;\n        if (showDesc) {\n          // Render the description\n          desc = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControl({\n            className: "mb-1",\n            el: control.el,\n            placeholder: "Description",\n            type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.TextField,\n            value: value ? value.Description : null\n          });\n        }\n        // Render the url\n        url = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControl({\n          el: control.el,\n          placeholder: "Url",\n          type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.TextField,\n          value: value ? value.Url : null\n        });\n        // Set the get value event\n        control.props.onGetValue = function () {\n          // Return the value\n          return {\n            Description: desc ? desc.getValue() : url.getValue(),\n            Url: url.getValue()\n          };\n        };\n        // Call the event\n        onControlRendered ? onControlRendered(formControl) : null;\n      };\n      // Set the validate event\n      baseValidation = function baseValidation(control, result) {\n        var descValid,\n          urlValid = false;\n        // Get the form control elements\n        var elFormControl = control.el.querySelectorAll(".form-control");\n        // See if both the description and url are displayed\n        var elDesc = null;\n        var elUrl = null;\n        if (elFormControl.length > 1) {\n          // Set the elements\n          elDesc = elFormControl[0];\n          elUrl = elFormControl[1];\n        } else {\n          // Set the elements\n          elUrl = elFormControl[0];\n          // Set the flag\n          descValid = true;\n        }\n        // See if the description exists\n        if (elDesc) {\n          // Clear the classes\n          elDesc.classList.remove("is-invalid");\n          elDesc.classList.remove("is-valid");\n          // Set the flag\n          descValid = control.props.required ? desc.getValue() ? true : false : true;\n          // Set the class\n          elDesc.classList.add(descValid ? "is-valid" : "is-invalid");\n        }\n        // See if the url exists\n        if (elUrl) {\n          // Clear the classes\n          elUrl.classList.remove("is-invalid");\n          elUrl.classList.remove("is-valid");\n          // Set the flag\n          urlValid = control.props.required ? url.getValue() ? true : false : true;\n          // Set the class\n          elUrl.classList.add(urlValid ? "is-valid" : "is-invalid");\n        }\n        // Set the validation falg\n        result.isValid = descValid && urlValid;\n        // Return the result\n        return result;\n      };\n      break;\n    // User\n    case gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldType.User:\n      // Set the type\n      controlProps.type = isReadonly ? _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Readonly : _peoplePicker__WEBPACK_IMPORTED_MODULE_3__.PeoplePickerControlType;\n      // Update the properties, based on the field settings\n      controlProps.allowGroups = props.field.SelectionGroup == gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.FieldUserSelectionType.PeopleAndGroups;\n      controlProps.groupId = props.field.SelectionGroup;\n      controlProps.multi = props.field.AllowMultipleValues;\n      // Set the rendered event\n      onControlRendered = controlProps.onControlRendered;\n      controlProps.onControlRendered = function (formControl) {\n        // Save the control\n        control = formControl;\n        // See if this field is readonly and a value exists\n        if (props.value && isReadonly) {\n          // Set the class name\n          control.el.classList.add("form-control");\n          control.el.style.backgroundColor = "#e9ecef";\n          // Override the html rendered\n          control.el.innerHTML = props.listInfo.fieldValuesAsHtml[props.field.InternalName];\n        }\n        // Call the event\n        onControlRendered ? onControlRendered(formControl) : null;\n      };\n      break;\n  }\n  // See if this is the document name field\n  if (props.field.InternalName == "FileLeafRef") {\n    // Set base validation\n    baseValidation = function baseValidation(control, result) {\n      var value = result.value;\n      // Ensure the value exists\n      result.isValid = value ? true : false;\n      if (result.isValid) {\n        // See if it ends w/ a .\n        if (value[value.length - 1] == \'.\') {\n          // Update the validation\n          result.isValid = false;\n          result.invalidMessage = "The value cannot end with a \'.\' character.";\n        }\n        // Else, see if it contains invalid characters\n        else if (/[~"\\#\\%\\&\\*\\:\\<\\>\\?\\/\\\\\\{\\|\\}"]/.test(value) || value.indexOf(\'\\\\\') >= 0) {\n          // Update the validation\n          result.isValid = false;\n          result.invalidMessage = "The value cannot contain the following characters: ~ \\" # % & * : < > ? / \\\\ { | }";\n        }\n        // Else, see if we are changing the extension\n        else if (control.props.value) {\n          // Get the file extensions\n          var origExtension = getFileExtension(control.props.value);\n          var newExtension = getFileExtension(value);\n          // Update the validation\n          result.isValid = origExtension == newExtension;\n          result.invalidMessage = "The file extension cannot be changed. It must end with \'." + origExtension + "\'";\n        }\n      }\n      // Return the validation result\n      return result;\n    };\n  }\n  // See if this is a taxonomy field\n  if (/^TaxonomyFieldType/.test(props.field.TypeAsString)) {\n    // Set the type\n    controlProps.type = _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Dropdown;\n    // Set a render event\n    onControlRendering = controlProps.onControlRendering;\n    controlProps.onControlRendering = function (newProps) {\n      // Update the control properties\n      controlProps = newProps;\n      // Return a promise\n      return new Promise(function (resolve, reject) {\n        // Display a loading message\n        controlProps.loadingMessage = "Loading the MMS Data";\n        // Load the field information\n        gd_sprest__WEBPACK_IMPORTED_MODULE_0__.Helper.ListFormField.create({\n          field: props.field,\n          listName: props.listInfo.list.Title,\n          name: props.field.InternalName,\n          webUrl: props.listInfo.webUrl\n        }).then(\n        // Success\n        function (fieldInfo) {\n          // Save the field information\n          mmsFieldInfo = fieldInfo;\n          // Set the type\n          controlProps.type = mmsFieldInfo.multi ? _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.MultiDropdown : _core__WEBPACK_IMPORTED_MODULE_1__.Components.FormControlTypes.Dropdown;\n          // Load the value field\n          gd_sprest__WEBPACK_IMPORTED_MODULE_0__.Helper.ListFormField.loadMMSValueField(mmsFieldInfo).then(\n          // Success\n          function (valueField) {\n            // Set the value field\n            mmsFieldInfo.valueField = valueField;\n            // See if this is a new form\n            if (props.controlMode == gd_sprest__WEBPACK_IMPORTED_MODULE_0__.SPTypes.ControlMode.New) {\n              var fieldValue = [];\n              // Get the default values\n              var values = (props.field.DefaultValue || "").split(";#");\n              for (var i = 0; i < values.length; i++) {\n                var _value = values[i].split("|");\n                if (_value.length == 2) {\n                  // Add the term id\n                  fieldValue.push(_value[1]);\n                }\n              }\n              // Update the field value\n              controlProps.value = fieldValue;\n            } else {\n              var _fieldValue = props.value;\n              // Get the field value\n              var _values = _fieldValue && _fieldValue.results ? _fieldValue.results : [_fieldValue];\n              // Clear the field values\n              _fieldValue = [];\n              // Parse the values\n              for (var _i2 = 0; _i2 < _values.length; _i2++) {\n                // Ensure the value exists\n                if (_values[_i2] && _values[_i2].TermGuid) {\n                  // Add the value\n                  _fieldValue.push(_values[_i2].TermGuid);\n                }\n              }\n              // Update the field value\n              controlProps.value = _fieldValue;\n            }\n            // Load the terms\n            gd_sprest__WEBPACK_IMPORTED_MODULE_0__.Helper.ListFormField.loadMMSData(mmsFieldInfo).then(\n            // Success\n            function (terms) {\n              // Get the items\n              var items = _getMMSItems(gd_sprest__WEBPACK_IMPORTED_MODULE_0__.Helper.Taxonomy.toObject(terms), controlProps.value);\n              // See if this is not a required field and not a multi-select\n              if (!isRequired && !mmsFieldInfo.multi) {\n                // Add a blank entry\n                items = [{\n                  text: "",\n                  value: null\n                }].concat(items);\n              }\n              // Set the items\n              controlProps.items = items;\n              // Clear the element\n              controlProps.el ? controlProps.el.innerHTML = "" : null;\n              // Call the event\n              var returnVal = onControlRendering ? onControlRendering(controlProps) : null;\n              if (returnVal && returnVal.then) {\n                // Wait for the promise to complete\n                returnVal.then(function (props) {\n                  // Resolve the promise\n                  resolve(props || controlProps);\n                });\n              } else {\n                // Resolve the promise\n                resolve(controlProps);\n              }\n            },\n            // Error\n            function (msg) {\n              // Set the error message\n              var errorMessage = "Error loading the mms terms for \'" + props.field.InternalName + "\'.";\n              // Display an error message\n              _core__WEBPACK_IMPORTED_MODULE_1__.Components.Alert({\n                el: controlProps.el,\n                content: errorMessage,\n                type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.AlertTypes.Danger\n              });\n              // Call the error event\n              props.onError ? props.onError(errorMessage) : null;\n            });\n          },\n          // Error\n          function (msg) {\n            // Set the error message\n            var errorMessage = "Error loading the mms value field for \'" + props.field.InternalName + "\'.";\n            // Display an error message\n            _core__WEBPACK_IMPORTED_MODULE_1__.Components.Alert({\n              el: controlProps.el,\n              content: errorMessage,\n              type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.AlertTypes.Danger\n            });\n            // Call the error event\n            props.onError ? props.onError(errorMessage) : null;\n            // Reject the request\n            reject(msg);\n          });\n        }, function (msg) {\n          // Display an error message\n          _core__WEBPACK_IMPORTED_MODULE_1__.Components.Alert({\n            el: controlProps.el,\n            content: msg,\n            type: _core__WEBPACK_IMPORTED_MODULE_1__.Components.AlertTypes.Danger\n          });\n          // Call the error event\n          props.onError ? props.onError(msg) : null