@rjsf/semantic-ui 4.2.2 → 5.0.0-beta.2

package/dist/semantic-ui.umd.development.js

@@ -1,15 +1,15 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@rjsf/core'), require('semantic-ui-react'), require('react'), require('prop-types'), require('nanoid'), require('lodash-es')) :
-  typeof define === 'function' && define.amd ? define(['exports', '@rjsf/core', 'semantic-ui-react', 'react', 'prop-types', 'nanoid', 'lodash-es'], factory) :
-  (global = global || self, factory(global['@rjsf/semantic-ui'] = {}, global.core, global.semanticUiReact, global.React, global.PropTypes, global.nanoid, global._));
-}(this, (function (exports, core, semanticUiReact, React, PropTypes, nanoid, _) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@rjsf/core'), require('semantic-ui-react'), require('react'), require('@rjsf/utils'), require('prop-types'), require('nanoid'), require('lodash-es')) :
+  typeof define === 'function' && define.amd ? define(['exports', '@rjsf/core', 'semantic-ui-react', 'react', '@rjsf/utils', 'prop-types', 'nanoid', 'lodash-es'], factory) :
+  (global = global || self, factory(global['@rjsf/semantic-ui'] = {}, global.core, global.semanticUiReact, global.React, global.utils, global.PropTypes, global.nanoid, global._));
+}(this, (function (exports, core, semanticUiReact, React, utils, PropTypes, nanoid, _) { 'use strict';
 
   React = React && Object.prototype.hasOwnProperty.call(React, 'default') ? React['default'] : React;
   PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
   _ = _ && Object.prototype.hasOwnProperty.call(_, 'default') ? _['default'] : _;
 
   function _extends() {
-    _extends = Object.assign || function (target) {
+    _extends = Object.assign ? Object.assign.bind() : function (target) {
       for (var i = 1; i < arguments.length; i++) {
         var source = arguments[i];
 
@@ -22,33 +22,19 @@
 
       return target;
     };
-
     return _extends.apply(this, arguments);
   }
 
-  function _objectWithoutPropertiesLoose(source, excluded) {
-    if (source == null) return {};
-    var target = {};
-    var sourceKeys = Object.keys(source);
-    var key, i;
-
-    for (i = 0; i < sourceKeys.length; i++) {
-      key = sourceKeys[i];
-      if (excluded.indexOf(key) >= 0) continue;
-      target[key] = source[key];
-    }
-
-    return target;
-  }
-
   function AddButton(props) {
-    return React.createElement(semanticUiReact.Button, _extends({}, props, {
+    return /*#__PURE__*/React.createElement(semanticUiReact.Button, _extends({
+      title: "Add Item"
+    }, props, {
       icon: true,
       size: "tiny",
       labelPosition: "left"
-    }), React.createElement(semanticUiReact.Icon, {
+    }), /*#__PURE__*/React.createElement(semanticUiReact.Icon, {
       name: "plus"
-    }), "Add Item");
+    }));
   }
 
   /**
@@ -64,24 +50,23 @@
    */
 
   function getSemanticProps(_ref) {
-    var _ref$formContext = _ref.formContext,
-        formContext = _ref$formContext === void 0 ? {} : _ref$formContext,
-        _ref$uiSchema = _ref.uiSchema,
-        uiSchema = _ref$uiSchema === void 0 ? {} : _ref$uiSchema,
-        _ref$options = _ref.options,
-        options = _ref$options === void 0 ? {} : _ref$options,
-        _ref$defaultSchemaPro = _ref.defaultSchemaProps,
-        defaultSchemaProps = _ref$defaultSchemaPro === void 0 ? {
-      fluid: true,
-      inverted: false
-    } : _ref$defaultSchemaPro,
-        _ref$defaultContextPr = _ref.defaultContextProps,
-        defaultContextProps = _ref$defaultContextPr === void 0 ? {} : _ref$defaultContextPr;
-    var formContextProps = formContext.semantic;
-    var schemaProps = uiSchema["ui:options"] && uiSchema["ui:options"].semantic;
-    var optionProps = options.semantic; // formContext props should overide other props
-
-    return Object.assign({}, _extends({}, defaultSchemaProps && defaultSchemaProps), _extends({}, defaultContextProps && defaultContextProps), schemaProps, optionProps, formContextProps);
+    let {
+      formContext = {},
+      uiSchema = {},
+      options = {},
+      defaultSchemaProps = {
+        fluid: true,
+        inverted: false
+      },
+      defaultContextProps = {}
+    } = _ref;
+    const formContextProps = formContext.semantic;
+    let schemaProps = uiSchema["ui:options"] && uiSchema["ui:options"].semantic;
+    let optionProps = options.semantic; // formContext props should overide other props
+
+    return Object.assign({}, { ...(defaultSchemaProps && defaultSchemaProps)
+    }, { ...(defaultContextProps && defaultContextProps)
+    }, schemaProps, optionProps, formContextProps);
   }
   /**
    * Extract error props meant for semantic UI components from props that are
@@ -94,21 +79,20 @@
    */
 
   function getSemanticErrorProps(_ref2) {
-    var _ref2$formContext = _ref2.formContext,
-        formContext = _ref2$formContext === void 0 ? {} : _ref2$formContext,
-        _ref2$uiSchema = _ref2.uiSchema,
-        uiSchema = _ref2$uiSchema === void 0 ? {} : _ref2$uiSchema,
-        _ref2$options = _ref2.options,
-        options = _ref2$options === void 0 ? {} : _ref2$options,
-        _ref2$defaultProps = _ref2.defaultProps,
-        defaultProps = _ref2$defaultProps === void 0 ? {
-      size: 'small',
-      pointing: 'above'
-    } : _ref2$defaultProps;
-    var formContextProps = formContext.semantic && formContext.semantic.errorOptions;
-    var schemaProps = uiSchema["ui:options"] && uiSchema["ui:options"].semantic && uiSchema["ui:options"].semantic.errorOptions;
-    var optionProps = options.semantic && options.semantic.errorOptions;
-    return Object.assign({}, _extends({}, defaultProps && defaultProps), schemaProps, optionProps, formContextProps);
+    let {
+      formContext = {},
+      uiSchema = {},
+      options = {},
+      defaultProps = {
+        size: "small",
+        pointing: "above"
+      }
+    } = _ref2;
+    const formContextProps = formContext.semantic && formContext.semantic.errorOptions;
+    const schemaProps = uiSchema["ui:options"] && uiSchema["ui:options"].semantic && uiSchema["ui:options"].semantic.errorOptions;
+    const optionProps = options.semantic && options.semantic.errorOptions;
+    return Object.assign({}, { ...(defaultProps && defaultProps)
+    }, schemaProps, optionProps, formContextProps);
   }
   /**
    * Combine multiple strings containing class names into a single string,
@@ -127,14 +111,10 @@
 
     // Split each arg on whitespace, and add it to an array. Skip false-y args
     // like "" and undefined.
-    var classList = classNameArr.filter(Boolean).reduce(function (previous, current) {
-      return previous.concat(current.trim().split(/\s+/));
-    }, []); // Remove any class names from omit, and make the rest unique before
+    const classList = classNameArr.filter(Boolean).reduce((previous, current) => previous.concat(current.trim().split(/\s+/)), []); // Remove any class names from omit, and make the rest unique before
     // returning them as a string
 
-    return [].concat(new Set(classList.filter(function (cn) {
-      return !omit.includes(cn);
-    }))).join(" ");
+    return [...new Set(classList.filter(cn => !omit.includes(cn)))].join(" ");
   }
   /**
    *
@@ -146,235 +126,237 @@
    */
 
   function MaybeWrap(_ref3) {
-    var wrap = _ref3.wrap,
-        _ref3$component = _ref3.component,
-        Component = _ref3$component === void 0 ? "div" : _ref3$component,
-        props = _objectWithoutPropertiesLoose(_ref3, ["wrap", "component"]);
-
-    return wrap ? React.createElement(Component, props) : props.children;
+    let {
+      wrap,
+      component: Component = "div",
+      ...props
+    } = _ref3;
+    return wrap ? /*#__PURE__*/React.createElement(Component, props) : props.children;
   }
 
-  var isFixedItems = core.utils.isFixedItems;
-
-  var ArrayFieldTitle = function ArrayFieldTitle(_ref) {
-    var TitleField = _ref.TitleField,
-        idSchema = _ref.idSchema,
-        uiSchema = _ref.uiSchema,
-        title = _ref.title;
-
-    if (!title) {
-      return null;
-    }
-
-    var id = idSchema.$id + "__title";
-    return React.createElement(TitleField, {
-      id: id,
-      title: title,
-      options: uiSchema["ui:options"]
-    });
-  };
-
-  function ArrayFieldDescription(_ref2) {
-    var DescriptionField = _ref2.DescriptionField,
-        idSchema = _ref2.idSchema,
-        description = _ref2.description;
-
-    if (!description) {
-      // See #312: Ensure compatibility with old versions of React.
-      return null;
-    }
-
-    var id = idSchema.$id + "__description";
-    return React.createElement(DescriptionField, {
-      id: id,
-      description: description
-    });
-  }
-
-  var gridStyle = function gridStyle(vertical) {
-    return {
-      display: "grid",
-      gridTemplateColumns: "1fr " + (vertical ? 65 : 110) + "px"
-    };
-  }; // checks if its the first array item
+  const gridStyle = vertical => ({
+    display: "grid",
+    gridTemplateColumns: "1fr " + (vertical ? 65 : 110) + "px"
+  }); // checks if it's the first array item
 
 
   function isInitialArrayItem(props) {
     // no underscore because im not sure if we want to import a library here
-    var idSchema = props.children.props.idSchema;
+    const {
+      idSchema
+    } = props.children.props;
     return idSchema.target && idSchema.conditions;
-  } // Used in the two templates
-
+  }
 
-  function DefaultArrayItem(props) {
-    return React.createElement("div", {
-      className: "array-item",
-      key: props.key
-    }, React.createElement(MaybeWrap, {
-      wrap: props.wrapItem,
+  const ArrayFieldItemTemplate = props => {
+    const {
+      children,
+      disabled,
+      hasToolbar,
+      hasMoveDown,
+      hasMoveUp,
+      hasRemove,
+      horizontalButtons,
+      index,
+      onDropIndexClick,
+      onReorderClick,
+      readonly,
+      wrapItem,
+      registry
+    } = props;
+    const {
+      MoveDownButton,
+      MoveUpButton,
+      RemoveButton
+    } = registry.templates.ButtonTemplates;
+    return /*#__PURE__*/React.createElement("div", {
+      className: "array-item"
+    }, /*#__PURE__*/React.createElement(MaybeWrap, {
+      wrap: wrapItem,
       component: semanticUiReact.Segment
-    }, React.createElement(semanticUiReact.Grid, {
-      style: !isInitialArrayItem(props) ? _extends({}, gridStyle(!props.horizontalButtons), {
+    }, /*#__PURE__*/React.createElement(semanticUiReact.Grid, {
+      style: !isInitialArrayItem(props) ? { ...gridStyle(!horizontalButtons),
         alignItems: "center"
-      }) : gridStyle(!props.horizontalButtons)
-    }, React.createElement(semanticUiReact.Grid.Column, {
+      } : gridStyle(!horizontalButtons)
+    }, /*#__PURE__*/React.createElement(semanticUiReact.Grid.Column, {
       width: 16,
       verticalAlign: "middle"
-    }, props.children), props.hasToolbar && React.createElement(semanticUiReact.Grid.Column, null, (props.hasMoveUp || props.hasMoveDown || props.hasRemove) && React.createElement(semanticUiReact.Button.Group, {
+    }, children), hasToolbar && /*#__PURE__*/React.createElement(semanticUiReact.Grid.Column, null, (hasMoveUp || hasMoveDown || hasRemove) && /*#__PURE__*/React.createElement(semanticUiReact.Button.Group, {
       size: "mini",
-      vertical: !props.horizontalButtons
-    }, (props.hasMoveUp || props.hasMoveDown) && React.createElement(semanticUiReact.Button, {
-      icon: "angle up",
+      vertical: !horizontalButtons
+    }, (hasMoveUp || hasMoveDown) && /*#__PURE__*/React.createElement(MoveUpButton, {
       className: "array-item-move-up",
-      tabIndex: "-1",
-      disabled: props.disabled || props.readOnly || !props.hasMoveUp,
-      onClick: props.onReorderClick(props.index, props.index - 1)
-    }), (props.hasMoveUp || props.hasMoveDown) && React.createElement(semanticUiReact.Button, {
-      icon: "angle down",
+      disabled: disabled || readonly || !hasMoveUp,
+      onClick: onReorderClick(index, index - 1)
+    }), (hasMoveUp || hasMoveDown) && /*#__PURE__*/React.createElement(MoveDownButton, {
       className: "array-item-move-down",
-      tabIndex: "-1",
-      disabled: props.disabled || props.readOnly || !props.hasMoveDown,
-      onClick: props.onReorderClick(props.index, props.index + 1)
-    }), props.hasRemove && React.createElement(semanticUiReact.Button, {
-      icon: "trash",
+      disabled: disabled || readonly || !hasMoveDown,
+      onClick: onReorderClick(index, index + 1)
+    }), hasRemove && /*#__PURE__*/React.createElement(RemoveButton, {
       className: "array-item-remove",
-      tabIndex: "-1",
-      disabled: props.disabled || props.readOnly,
-      onClick: props.onDropIndexClick(props.index)
+      disabled: disabled || readonly,
+      onClick: onDropIndexClick(index)
     }))))));
-  } // Used for arrays that are represented as multiple selection fields
-  // (displayed as a multi select or checkboxes)
-
-
-  function DefaultFixedArrayFieldTemplate(_ref3) {
-    var uiSchema = _ref3.uiSchema,
-        idSchema = _ref3.idSchema,
-        canAdd = _ref3.canAdd,
-        className = _ref3.className,
-        classNames = _ref3.classNames,
-        disabled = _ref3.disabled,
-        items = _ref3.items,
-        onAddClick = _ref3.onAddClick,
-        readOnly = _ref3.readOnly,
-        required = _ref3.required,
-        schema = _ref3.schema,
-        title = _ref3.title,
-        TitleField = _ref3.TitleField,
-        itemProps = _ref3.itemProps;
-    var fieldTitle = uiSchema["ui:title"] || title;
-    var fieldDescription = uiSchema["ui:description"] || schema.description;
-    return React.createElement("div", {
-      className: cleanClassNames([className, classNames])
-    }, React.createElement(ArrayFieldTitle, {
-      key: "array-field-title-" + idSchema.$id,
-      TitleField: TitleField,
-      idSchema: idSchema,
-      uiSchema: uiSchema,
-      title: fieldTitle,
-      required: required
-    }), fieldDescription && React.createElement("div", {
-      className: "field-description",
-      key: "field-description-" + idSchema.$id
-    }, fieldDescription), React.createElement("div", {
-      key: "array-item-list-" + idSchema.$id
-    }, React.createElement("div", {
-      className: "row array-item-list"
-    }, items && items.map(function (p) {
-      return DefaultArrayItem(_extends({}, p, itemProps));
-    })), canAdd && React.createElement("div", {
-      style: {
-        marginTop: "1rem",
-        position: "relative",
-        textAlign: "right"
-      }
-    }, React.createElement(AddButton, {
-      onClick: onAddClick,
-      disabled: disabled || readOnly
-    }))));
-  }
+  };
 
-  function DefaultNormalArrayFieldTemplate(_ref4) {
-    var uiSchema = _ref4.uiSchema,
-        idSchema = _ref4.idSchema,
-        canAdd = _ref4.canAdd,
-        className = _ref4.className,
-        classNames = _ref4.classNames,
-        disabled = _ref4.disabled,
-        DescriptionField = _ref4.DescriptionField,
-        items = _ref4.items,
-        onAddClick = _ref4.onAddClick,
-        readOnly = _ref4.readOnly,
-        required = _ref4.required,
-        schema = _ref4.schema,
-        title = _ref4.title,
-        TitleField = _ref4.TitleField,
-        itemProps = _ref4.itemProps;
-    var fieldTitle = uiSchema["ui:title"] || title;
-    var fieldDescription = uiSchema["ui:description"] || schema.description;
-    return React.createElement("div", {
-      className: cleanClassNames([className, classNames, "sortable-form-fields"])
-    }, React.createElement(ArrayFieldTitle, {
-      key: "array-field-title-" + idSchema.$id,
-      TitleField: TitleField,
+  function ArrayFieldTemplate(_ref) {
+    let {
+      uiSchema,
+      idSchema,
+      canAdd,
+      className,
+      classNames,
+      disabled,
+      formContext,
+      items,
+      onAddClick,
+      options,
+      readOnly,
+      required,
+      schema,
+      title,
+      registry
+    } = _ref;
+    const semanticProps = getSemanticProps({
+      options,
+      uiSchema,
+      formContext,
+      defaultSchemaProps: {
+        horizontalButtons: false,
+        wrapItem: false
+      }
+    });
+    const {
+      horizontalButtons,
+      wrapItem
+    } = semanticProps;
+    const itemProps = {
+      horizontalButtons,
+      wrapItem
+    };
+    const uiOptions = utils.getUiOptions(uiSchema);
+    const ArrayFieldDescriptionTemplate = utils.getTemplate("ArrayFieldDescriptionTemplate", registry, uiOptions);
+    const ArrayFieldItemTemplate = utils.getTemplate("ArrayFieldItemTemplate", registry, uiOptions);
+    const ArrayFieldTitleTemplate = utils.getTemplate("ArrayFieldTitleTemplate", registry, uiOptions); // Button templates are not overridden in the uiSchema
+
+    const {
+      ButtonTemplates: {
+        AddButton
+      }
+    } = registry.templates;
+    const fieldTitle = uiOptions.title || title;
+    const fieldDescription = uiOptions.description || schema.description;
+    return /*#__PURE__*/React.createElement("div", {
+      className: cleanClassNames([className, classNames, utils.isFixedItems(schema) ? "" : "sortable-form-fields"])
+    }, /*#__PURE__*/React.createElement(ArrayFieldTitleTemplate, {
       idSchema: idSchema,
-      uiSchema: uiSchema,
       title: fieldTitle,
-      required: required
-    }), fieldDescription && React.createElement(ArrayFieldDescription, {
-      key: "array-field-description-" + idSchema.$id,
-      DescriptionField: DescriptionField,
+      uiSchema: uiSchema,
+      required: required,
+      registry: registry
+    }), fieldDescription && /*#__PURE__*/React.createElement(ArrayFieldDescriptionTemplate, {
       idSchema: idSchema,
-      description: fieldDescription
-    }), React.createElement("div", {
+      description: fieldDescription,
+      uiSchema: uiSchema,
+      registry: registry
+    }), /*#__PURE__*/React.createElement("div", {
       key: "array-item-list-" + idSchema.$id
-    }, React.createElement("div", {
+    }, /*#__PURE__*/React.createElement("div", {
       className: "row array-item-list"
-    }, items && items.map(function (p) {
-      return DefaultArrayItem(_extends({}, p, itemProps));
-    })), canAdd && React.createElement("div", {
+    }, items && items.map(props => /*#__PURE__*/React.createElement(ArrayFieldItemTemplate, _extends({}, props, itemProps)))), canAdd && /*#__PURE__*/React.createElement("div", {
       style: {
         marginTop: "1rem",
         position: "relative",
         textAlign: "right"
       }
-    }, React.createElement(AddButton, {
+    }, /*#__PURE__*/React.createElement(AddButton, {
       onClick: onAddClick,
       disabled: disabled || readOnly
     }))));
   }
 
-  function ArrayFieldTemplate(props) {
-    var options = props.options,
-        schema = props.schema,
-        uiSchema = props.uiSchema,
-        formContext = props.formContext;
-    var semanticProps = getSemanticProps({
-      options: options,
-      uiSchema: uiSchema,
-      formContext: formContext,
-      defaultSchemaProps: {
-        horizontalButtons: false,
-        wrapItem: false
-      }
+  function BaseInputTemplate(props) {
+    const {
+      id,
+      placeholder,
+      name,
+      label,
+      value,
+      required,
+      readonly,
+      disabled,
+      onChange,
+      onBlur,
+      onFocus,
+      autofocus,
+      options,
+      schema,
+      uiSchema,
+      formContext,
+      type,
+      registry,
+      rawErrors = []
+    } = props;
+    const inputProps = utils.getInputProps(schema, type, options);
+    const semanticProps = getSemanticProps({
+      uiSchema,
+      formContext,
+      options
     });
-    var horizontalButtons = semanticProps.horizontalButtons,
-        wrapItem = semanticProps.wrapItem;
-    var itemProps = {
-      horizontalButtons: horizontalButtons,
-      wrapItem: wrapItem
+    const {
+      schemaUtils
+    } = registry; // eslint-disable-next-line no-shadow
+
+    const _onChange = _ref => {
+      let {
+        target: {
+          value
+        }
+      } = _ref;
+      return onChange(value === "" ? options.emptyValue : value);
     };
 
-    if (isFixedItems(schema)) {
-      return React.createElement(DefaultFixedArrayFieldTemplate, _extends({}, props, {
-        itemProps: itemProps
-      }));
-    }
+    const _onBlur = () => onBlur && onBlur(id, value);
+
+    const _onFocus = () => onFocus && onFocus(id, value);
 
-    return React.createElement(DefaultNormalArrayFieldTemplate, _extends({}, props, {
-      itemProps: itemProps
+    const displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema);
+    return /*#__PURE__*/React.createElement(semanticUiReact.Form.Input, _extends({
+      key: id,
+      id: id,
+      placeholder: placeholder
+    }, inputProps, {
+      label: displayLabel ? label || schema.title : false,
+      required: required,
+      autoFocus: autofocus,
+      disabled: disabled || readonly,
+      name: name
+    }, semanticProps, {
+      value: value || value === 0 ? value : "",
+      error: rawErrors.length > 0,
+      onChange: _onChange,
+      onBlur: _onBlur,
+      onFocus: _onFocus
     }));
   }
 
+  /* eslint-disable react/prop-types */
+
+  function DescriptionField(_ref) {
+    let {
+      className,
+      description,
+      id
+    } = _ref;
+
+    if (description) {
+      return /*#__PURE__*/React.createElement("p", {
+        id: id,
+        className: className || "sui-description"
+      }, description);
+    }
+  }
+
   /* eslint-disable react/no-array-index-key */
   /**
    *
@@ -384,61 +366,59 @@
    */
 
   function ErrorList(_ref) {
-    var errors = _ref.errors;
-    return React.createElement(semanticUiReact.Message, {
+    let {
+      errors
+    } = _ref;
+    return /*#__PURE__*/React.createElement(semanticUiReact.Message, {
       negative: true
-    }, React.createElement(semanticUiReact.Message.Header, null, "Errors"), React.createElement(semanticUiReact.Message.List, null, errors.map(function (error, index) {
-      return React.createElement(semanticUiReact.Message.Item, {
-        key: "error-" + index
-      }, error.stack);
-    })));
+    }, /*#__PURE__*/React.createElement(semanticUiReact.Message.Header, null, "Errors"), /*#__PURE__*/React.createElement(semanticUiReact.Message.List, null, errors.map((error, index) => /*#__PURE__*/React.createElement(semanticUiReact.Message.Item, {
+      key: "error-" + index
+    }, error.stack))));
   }
 
   ErrorList.propTypes = {
     errors: PropTypes.array
   };
 
-  /* eslint-disable react/prop-types */
-
-  function DescriptionField(_ref) {
-    var className = _ref.className,
-        description = _ref.description;
-
-    if (description) {
-      return React.createElement("p", {
-        className: className || "sui-description"
-      }, description);
-    }
-  }
-
-  function TitleField(_ref) {
-    var title = _ref.title,
-        options = _ref.options;
-    var semantic = options.semantic;
-
-    if (title) {
-      return React.createElement(semanticUiReact.Header, _extends({}, semantic, {
-        as: "h5"
-      }), title);
-    }
+  function IconButton(props) {
+    const {
+      icon,
+      iconType,
+      className,
+      ...otherProps
+    } = props;
+    return /*#__PURE__*/React.createElement(semanticUiReact.Button, _extends({
+      icon: icon,
+      size: iconType,
+      className: className
+    }, otherProps));
   }
 
-  TitleField.defaultProps = {
-    options: {
-      semantic: {
-        inverted: false,
-        dividing: true
-      }
-    }
-  };
-  TitleField.propTypes = {
-    options: PropTypes.object
-  };
-
-  var Fields = {
-    DescriptionField: DescriptionField,
-    TitleField: TitleField
+  IconButton.propTypes = {
+    icon: PropTypes.string.isRequired,
+    className: PropTypes.string
   };
+  function MoveDownButton(props) {
+    return /*#__PURE__*/React.createElement(IconButton, _extends({
+      title: "Move down"
+    }, props, {
+      icon: "angle down"
+    }));
+  }
+  function MoveUpButton(props) {
+    return /*#__PURE__*/React.createElement(IconButton, _extends({
+      title: "Move up"
+    }, props, {
+      icon: "angle up"
+    }));
+  }
+  function RemoveButton(props) {
+    return /*#__PURE__*/React.createElement(IconButton, _extends({
+      title: "Remove"
+    }, props, {
+      icon: "trash"
+    }));
+  }
 
   /* eslint-disable react/prop-types */
   /**
@@ -446,11 +426,13 @@
    */
 
   function HelpField(_ref) {
-    var helpText = _ref.helpText,
-        id = _ref.id;
+    let {
+      helpText,
+      id
+    } = _ref;
 
     if (helpText) {
-      return React.createElement(semanticUiReact.Message, {
+      return /*#__PURE__*/React.createElement(semanticUiReact.Message, {
         size: "mini",
         info: true,
         id: id,
@@ -477,25 +459,27 @@
    */
 
   function RawErrors(_ref) {
-    var errors = _ref.errors,
-        options = _ref.options;
-    var pointing = options.pointing,
-        size = options.size;
+    let {
+      errors,
+      options
+    } = _ref;
+    const {
+      pointing,
+      size
+    } = options;
 
     if (errors && errors.length > 0) {
-      return React.createElement(semanticUiReact.Label, {
+      return /*#__PURE__*/React.createElement(semanticUiReact.Label, {
         color: "red",
         pointing: pointing || "above",
         size: size || "small",
         basic: true
-      }, React.createElement(semanticUiReact.List, {
+      }, /*#__PURE__*/React.createElement(semanticUiReact.List, {
         bulleted: true
-      }, errors.map(function (error) {
-        return React.createElement(semanticUiReact.List.Item, {
-          key: nanoid.nanoid(),
-          content: error
-        });
-      })));
+      }, errors.map(error => /*#__PURE__*/React.createElement(semanticUiReact.List.Item, {
+        key: nanoid.nanoid(),
+        content: error
+      }))));
     }
 
     return null;
@@ -512,47 +496,56 @@
     errors: PropTypes.array
   };
 
-  var ADDITIONAL_PROPERTY_FLAG = core.utils.ADDITIONAL_PROPERTY_FLAG;
-
-  var WrapIfAdditional = function WrapIfAdditional(_ref) {
-    var children = _ref.children,
-        classNames = _ref.classNames,
-        disabled = _ref.disabled,
-        formContext = _ref.formContext,
-        id = _ref.id,
-        label = _ref.label,
-        onDropPropertyClick = _ref.onDropPropertyClick,
-        onKeyChange = _ref.onKeyChange,
-        readonly = _ref.readonly,
-        required = _ref.required,
-        schema = _ref.schema;
-    var _formContext$readonly = formContext.readonlyAsDisabled,
-        readonlyAsDisabled = _formContext$readonly === void 0 ? true : _formContext$readonly,
-        wrapperStyle = formContext.wrapperStyle;
-    var keyLabel = label + " Key"; // i18n ?
-
-    var additional = schema.hasOwnProperty(ADDITIONAL_PROPERTY_FLAG);
+  const WrapIfAdditional = _ref => {
+    let {
+      children,
+      classNames,
+      disabled,
+      formContext,
+      id,
+      label,
+      onDropPropertyClick,
+      onKeyChange,
+      readonly,
+      required,
+      schema,
+      registry
+    } = _ref;
+    const {
+      RemoveButton
+    } = registry.templates.ButtonTemplates;
+    const {
+      readonlyAsDisabled = true,
+      wrapperStyle
+    } = formContext;
+    const keyLabel = label + " Key"; // i18n ?
+
+    const additional = (utils.ADDITIONAL_PROPERTY_FLAG in schema);
 
     if (!additional) {
-      return React.createElement(React.Fragment, null, children);
+      return /*#__PURE__*/React.createElement("div", {
+        className: classNames
+      }, children);
     }
 
-    var handleBlur = function handleBlur(_ref2) {
-      var target = _ref2.target;
+    const handleBlur = _ref2 => {
+      let {
+        target
+      } = _ref2;
       return onKeyChange(target.value);
     };
 
-    return React.createElement("div", {
+    return /*#__PURE__*/React.createElement("div", {
       className: classNames,
       key: id + "-key"
-    }, React.createElement(semanticUiReact.Grid, {
+    }, /*#__PURE__*/React.createElement(semanticUiReact.Grid, {
       columns: "equal"
-    }, React.createElement(semanticUiReact.Grid.Row, null, React.createElement(semanticUiReact.Grid.Column, {
+    }, /*#__PURE__*/React.createElement(semanticUiReact.Grid.Row, null, /*#__PURE__*/React.createElement(semanticUiReact.Grid.Column, {
       className: "form-additional"
-    }, React.createElement(semanticUiReact.Form.Group, {
+    }, /*#__PURE__*/React.createElement(semanticUiReact.Form.Group, {
       widths: "equal",
       grouped: true
-    }, React.createElement(semanticUiReact.Form.Input, {
+    }, /*#__PURE__*/React.createElement(semanticUiReact.Form.Input, {
       className: "form-group",
       hasFeedback: true,
       fluid: true,
@@ -566,159 +559,243 @@
       onBlur: !readonly ? handleBlur : undefined,
       style: wrapperStyle,
       type: "text"
-    }))), React.createElement(semanticUiReact.Grid.Column, {
+    }))), /*#__PURE__*/React.createElement(semanticUiReact.Grid.Column, {
       className: "form-additional",
       verticalAlign: "middle"
-    }, children), React.createElement(semanticUiReact.Grid.Column, null, React.createElement(semanticUiReact.Button, {
-      size: "mini",
-      icon: "trash",
+    }, children), /*#__PURE__*/React.createElement(semanticUiReact.Grid.Column, null, /*#__PURE__*/React.createElement(RemoveButton, {
+      iconType: "mini",
       className: "array-item-remove",
-      tabIndex: "-1",
       disabled: disabled || readonly,
       onClick: onDropPropertyClick(label)
     })))));
   };
 
   function FieldTemplate(_ref) {
-    var id = _ref.id,
-        children = _ref.children,
-        classNames = _ref.classNames,
-        displayLabel = _ref.displayLabel,
-        label = _ref.label,
-        _ref$rawErrors = _ref.rawErrors,
-        rawErrors = _ref$rawErrors === void 0 ? [] : _ref$rawErrors,
-        rawHelp = _ref.rawHelp,
-        hidden = _ref.hidden,
-        rawDescription = _ref.rawDescription,
-        props = _objectWithoutPropertiesLoose(_ref, ["id", "children", "className", "classNames", "displayLabel", "label", "rawErrors", "rawHelp", "hidden", "rawDescription"]);
-
-    var semanticProps = getSemanticProps(props);
-    var wrapLabel = semanticProps.wrapLabel,
-        wrapContent = semanticProps.wrapContent;
-    var errorOptions = getSemanticErrorProps(props);
+    let {
+      id,
+      children,
+      className,
+      // pass className for styling libs (like styled-components)
+      classNames,
+      displayLabel,
+      label,
+      rawErrors = [],
+      rawHelp,
+      hidden,
+      rawDescription,
+      registry,
+      uiSchema,
+      ...props
+    } = _ref;
+    const semanticProps = getSemanticProps(props);
+    const {
+      wrapLabel,
+      wrapContent
+    } = semanticProps;
+    const errorOptions = getSemanticErrorProps(props);
+    const uiOptions = utils.getUiOptions(uiSchema);
+    const DescriptionFieldTemplate = utils.getTemplate("DescriptionFieldTemplate", registry, uiOptions);
 
     if (hidden) {
-      return children;
+      return /*#__PURE__*/React.createElement("div", {
+        style: {
+          display: "none"
+        }
+      }, children);
     }
 
-    return React.createElement(WrapIfAdditional, _extends({
+    return /*#__PURE__*/React.createElement(WrapIfAdditional, _extends({
       classNames: classNames,
       id: id,
-      label: label
-    }, props), React.createElement(semanticUiReact.Form.Group, {
+      label: label,
+      registry: registry
+    }, props), /*#__PURE__*/React.createElement(semanticUiReact.Form.Group, {
       key: id,
       widths: "equal",
       grouped: true
-    }, React.createElement(MaybeWrap, {
+    }, /*#__PURE__*/React.createElement(MaybeWrap, {
       wrap: wrapContent,
       className: "sui-field-content"
-    }, children, displayLabel && rawDescription && React.createElement(MaybeWrap, {
+    }, children, displayLabel && rawDescription && /*#__PURE__*/React.createElement(MaybeWrap, {
       wrap: wrapLabel,
       className: "sui-field-label"
-    }, rawDescription && React.createElement(DescriptionField, {
+    }, rawDescription && /*#__PURE__*/React.createElement(DescriptionFieldTemplate, {
+      id: id + "-description",
       description: rawDescription
-    })), React.createElement(HelpField, {
+    })), /*#__PURE__*/React.createElement(HelpField, {
       helpText: rawHelp,
       id: id + "__help"
-    }), React.createElement(RawErrors, {
+    }), /*#__PURE__*/React.createElement(RawErrors, {
       errors: rawErrors,
       options: errorOptions
     }))));
   }
 
   /* eslint-disable react/prop-types */
-  var canExpand = core.utils.canExpand;
 
   function ObjectFieldTemplate(_ref) {
-    var DescriptionField = _ref.DescriptionField,
-        description = _ref.description,
-        TitleField = _ref.TitleField,
-        onAddClick = _ref.onAddClick,
-        title = _ref.title,
-        properties = _ref.properties,
-        disabled = _ref.disabled,
-        readOnly = _ref.readOnly,
-        required = _ref.required,
-        uiSchema = _ref.uiSchema,
-        schema = _ref.schema,
-        formData = _ref.formData,
-        idSchema = _ref.idSchema;
-    var fieldTitle = uiSchema["ui:title"] || title;
-    var fieldDescription = uiSchema["ui:description"] || description;
-    return React.createElement(React.Fragment, null, fieldTitle && React.createElement(TitleField, {
+    let {
+      description,
+      onAddClick,
+      title,
+      properties,
+      disabled,
+      readOnly,
+      required,
+      uiSchema,
+      schema,
+      formData,
+      idSchema,
+      registry
+    } = _ref;
+    const uiOptions = utils.getUiOptions(uiSchema);
+    const TitleFieldTemplate = utils.getTemplate("TitleFieldTemplate", registry, uiOptions);
+    const DescriptionFieldTemplate = utils.getTemplate("DescriptionFieldTemplate", registry, uiOptions); // Button templates are not overridden in the uiSchema
+
+    const {
+      ButtonTemplates: {
+        AddButton
+      }
+    } = registry.templates;
+    const fieldTitle = uiOptions.title || title;
+    const fieldDescription = uiOptions.description || description;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, fieldTitle && /*#__PURE__*/React.createElement(TitleFieldTemplate, {
       id: idSchema.$id + "-title",
       title: fieldTitle,
-      options: uiSchema["ui:options"],
-      required: required
-    }), fieldDescription && React.createElement(DescriptionField, {
+      required: required,
+      uiSchema: uiSchema,
+      registry: registry
+    }), fieldDescription && /*#__PURE__*/React.createElement(DescriptionFieldTemplate, {
       id: idSchema.$id + "-description",
-      description: fieldDescription
-    }), properties.map(function (prop) {
-      return prop.content;
-    }), canExpand(schema, uiSchema, formData) && React.createElement(semanticUiReact.Grid.Column, {
+      description: fieldDescription,
+      registry: registry
+    }), properties.map(prop => prop.content), utils.canExpand(schema, uiSchema, formData) && /*#__PURE__*/React.createElement(semanticUiReact.Grid.Column, {
       width: 16,
       verticalAlign: "middle"
-    }, React.createElement(semanticUiReact.Grid.Row, null, React.createElement("div", {
+    }, /*#__PURE__*/React.createElement(semanticUiReact.Grid.Row, null, /*#__PURE__*/React.createElement("div", {
       style: {
         marginTop: "1rem",
         position: "relative",
         textAlign: "right"
       }
-    }, React.createElement(AddButton, {
+    }, /*#__PURE__*/React.createElement(AddButton, {
       onClick: onAddClick(schema),
       disabled: disabled || readOnly
     })))));
   }
 
-  var getDisplayLabel = core.utils.getDisplayLabel;
+  var SubmitButton = (_ref => {
+    let {
+      uiSchema
+    } = _ref;
+    const {
+      submitText,
+      norender,
+      props: submitButtonProps
+    } = utils.getSubmitButtonOptions(uiSchema);
+
+    if (norender) {
+      return null;
+    }
+
+    return /*#__PURE__*/React.createElement(semanticUiReact.Button, _extends({
+      type: "submit",
+      primary: true
+    }, submitButtonProps), submitText);
+  });
+
+  const DEFAULT_OPTIONS = {
+    semantic: {
+      inverted: false,
+      dividing: true
+    }
+  };
+
+  function TitleField(_ref) {
+    let {
+      id,
+      title,
+      uiSchema
+    } = _ref;
+    const uiOptions = utils.getUiOptions(uiSchema);
+    const {
+      semantic
+    } = uiOptions.options || DEFAULT_OPTIONS;
+
+    if (title) {
+      return /*#__PURE__*/React.createElement(semanticUiReact.Header, _extends({
+        id: id
+      }, semantic, {
+        as: "h5"
+      }), title);
+    }
+  }
+
+  var Templates = {
+    ArrayFieldItemTemplate,
+    ArrayFieldTemplate,
+    BaseInputTemplate,
+    ButtonTemplates: {
+      AddButton,
+      MoveDownButton,
+      MoveUpButton,
+      RemoveButton,
+      SubmitButton
+    },
+    DescriptionFieldTemplate: DescriptionField,
+    ErrorListTemplate: ErrorList,
+    FieldTemplate,
+    ObjectFieldTemplate,
+    TitleFieldTemplate: TitleField
+  };
 
   function CheckboxWidget(props) {
-    var id = props.id,
-        value = props.value,
-        required = props.required,
-        disabled = props.disabled,
-        readonly = props.readonly,
-        label = props.label,
-        autofocus = props.autofocus,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        options = props.options,
-        onFocus = props.onFocus,
-        formContext = props.formContext,
-        schema = props.schema,
-        uiSchema = props.uiSchema;
-    var semanticProps = getSemanticProps({
-      options: options,
-      formContext: formContext,
-      schema: schema,
-      uiSchema: uiSchema,
+    const {
+      id,
+      value,
+      required,
+      disabled,
+      readonly,
+      label,
+      autofocus,
+      onChange,
+      onBlur,
+      options,
+      onFocus,
+      formContext,
+      schema,
+      uiSchema,
+      registry,
+      rawErrors = []
+    } = props;
+    const semanticProps = getSemanticProps({
+      options,
+      formContext,
+      schema,
+      uiSchema,
       defaultSchemaProps: {
         inverted: false
       }
     });
-    var displayLabel = getDisplayLabel(schema, uiSchema
-    /* TODO: , rootSchema */
-    );
+    const {
+      schemaUtils
+    } = registry;
+    const displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema);
 
-    var _onChange = function _onChange(event, data) {
-      return onChange && onChange(data.checked);
-    };
+    const _onChange = (event, data) => onChange && onChange(data.checked);
 
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
+    const _onBlur = () => onBlur && onBlur(id, value);
 
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
+    const _onFocus = () => onFocus && onFocus(id, value);
 
-    var checked = value == "true" || value == true;
-    return React.createElement(semanticUiReact.Form.Checkbox, _extends({
+    const checked = value == "true" || value == true;
+    return /*#__PURE__*/React.createElement(semanticUiReact.Form.Checkbox, _extends({
       id: id,
       disabled: disabled || readonly,
       autoFocus: autofocus
     }, semanticProps, {
       checked: typeof value === "undefined" ? false : checked,
+      error: rawErrors.length > 0,
       onChange: _onChange,
       onBlur: _onBlur,
       onFocus: _onFocus,
@@ -728,89 +805,100 @@
   }
 
   function selectValue(value, selected, all) {
-    var at = all.indexOf(value);
-    var updated = selected.slice(0, at).concat(value, selected.slice(at)); // As inserting values at predefined index positions doesn't work with empty
+    const at = all.indexOf(value);
+    const updated = selected.slice(0, at).concat(value, selected.slice(at)); // As inserting values at predefined index positions doesn't work with empty
     // arrays, we need to reorder the updated selection to match the initial order
 
-    return updated.sort(function (a, b) {
-      return all.indexOf(a) > all.indexOf(b);
-    });
+    return updated.sort((a, b) => all.indexOf(a) > all.indexOf(b));
   }
 
   function deselectValue(value, selected) {
-    return selected.filter(function (v) {
-      return v !== value;
-    });
+    return selected.filter(v => v !== value);
   }
 
   function CheckboxesWidget(props) {
-    var id = props.id,
-        disabled = props.disabled,
-        options = props.options,
-        value = props.value,
-        autofocus = props.autofocus,
-        readonly = props.readonly,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        formContext = props.formContext,
-        schema = props.schema,
-        uiSchema = props.uiSchema;
-    var enumOptions = options.enumOptions,
-        enumDisabled = options.enumDisabled,
-        inline = options.inline;
-    var title = schema.title;
-    var semanticProps = getSemanticProps({
-      options: options,
-      formContext: formContext,
-      schema: schema,
-      uiSchema: uiSchema,
+    const {
+      id,
+      disabled,
+      options,
+      value,
+      autofocus,
+      readonly,
+      onChange,
+      onBlur,
+      onFocus,
+      formContext,
+      schema,
+      uiSchema,
+      rawErrors = [],
+      registry
+    } = props;
+    const TitleFieldTemplate = utils.getTemplate("TitleFieldTemplate", registry, options);
+    const {
+      enumOptions,
+      enumDisabled,
+      inline
+    } = options;
+    const {
+      title
+    } = schema;
+    const semanticProps = getSemanticProps({
+      options,
+      formContext,
+      schema,
+      uiSchema,
       defaultSchemaProps: {
         inverted: false
       }
     });
 
-    var _onChange = function _onChange(option) {
-      return function (_ref) {
-        var checked = _ref.target.checked;
-        // eslint-disable-next-line no-shadow
-        var all = enumOptions.map(function (_ref2) {
-          var value = _ref2.value;
-          return value;
-        });
-
-        if (checked) {
-          onChange(selectValue(option.value, value, all));
-        } else {
-          onChange(deselectValue(option.value, value));
+    const _onChange = option => _ref => {
+      let {
+        target: {
+          checked
         }
-      };
-    };
+      } = _ref;
+      // eslint-disable-next-line no-shadow
+      const all = enumOptions.map(_ref2 => {
+        let {
+          value
+        } = _ref2;
+        return value;
+      });
 
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
+      if (checked) {
+        onChange(selectValue(option.value, value, all));
+      } else {
+        onChange(deselectValue(option.value, value));
+      }
     };
 
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
+    const _onBlur = () => onBlur && onBlur(id, value);
+
+    const _onFocus = () => onFocus && onFocus(id, value);
 
-    var inlineOption = inline ? {
+    const inlineOption = inline ? {
       inline: true
     } : {
       grouped: true
     };
-    return React.createElement(React.Fragment, null, title && React.createElement(TitleField, {
-      title: title
-    }), React.createElement(semanticUiReact.Form.Group, inlineOption, enumOptions.map(function (option, index) {
-      var checked = value.indexOf(option.value) !== -1;
-      var itemDisabled = enumDisabled && enumDisabled.indexOf(option.value) !== -1;
-      return React.createElement(semanticUiReact.Form.Checkbox, _extends({
+    return /*#__PURE__*/React.createElement(React.Fragment, null, title && /*#__PURE__*/React.createElement(TitleFieldTemplate, {
+      id: id + "-title",
+      title: title,
+      uiSchema: uiSchema,
+      registry: registry
+    }), /*#__PURE__*/React.createElement(semanticUiReact.Form.Group, _extends({
+      id: id
+    }, inlineOption), enumOptions.map((option, index) => {
+      const checked = value.indexOf(option.value) !== -1;
+      const itemDisabled = enumDisabled && enumDisabled.indexOf(option.value) !== -1;
+      return /*#__PURE__*/React.createElement(semanticUiReact.Form.Checkbox, _extends({
         id: id + "_" + index,
         key: id + "_" + index,
         label: option.label
       }, semanticProps, {
         checked: checked,
+        error: rawErrors.length > 0,
         disabled: disabled || itemDisabled || readonly,
         autoFocus: autofocus && index === 0,
         onChange: _onChange(option),
@@ -820,116 +908,60 @@
     })));
   }
 
-  var getDisplayLabel$1 = core.utils.getDisplayLabel;
-
-  function PasswordWidget(props) {
-    var id = props.id,
-        required = props.required,
-        readonly = props.readonly,
-        disabled = props.disabled,
-        label = props.label,
-        name = props.name,
-        value = props.value,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        autofocus = props.autofocus,
-        options = props.options,
-        schema = props.schema,
-        uiSchema = props.uiSchema,
-        formContext = props.formContext;
-    var semanticProps = getSemanticProps({
-      schema: schema,
-      uiSchema: uiSchema,
-      formContext: formContext,
-      options: options
-    }); // eslint-disable-next-line no-shadow
-
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
-      return onChange && onChange(value === "" ? options.emptyValue : value);
-    };
-
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
-
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
-
-    var displayLabel = getDisplayLabel$1(schema, uiSchema
-    /* TODO: , rootSchema */
-    );
-    return React.createElement(semanticUiReact.Form.Input, _extends({
-      id: id,
-      key: id,
-      label: displayLabel ? label || schema.title : false,
-      autoFocus: autofocus,
-      required: required,
-      disabled: disabled || readonly,
-      name: name
-    }, semanticProps, {
-      type: "password",
-      value: value || "",
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus
-    }));
-  }
-
   function RadioWidget(props) {
-    var id = props.id,
-        value = props.value,
-        required = props.required,
-        disabled = props.disabled,
-        readonly = props.readonly,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        schema = props.schema,
-        options = props.options,
-        formContext = props.formContext,
-        uiSchema = props.uiSchema; // Generating a unique field name to identify this set of radio buttons
-
-    var name = Math.random().toString();
-    var enumOptions = options.enumOptions,
-        enumDisabled = options.enumDisabled;
-    var semanticProps = getSemanticProps({
-      formContext: formContext,
-      options: options,
-      uiSchema: uiSchema
+    const {
+      id,
+      value,
+      required,
+      disabled,
+      readonly,
+      onChange,
+      onBlur,
+      onFocus,
+      schema,
+      options,
+      formContext,
+      uiSchema,
+      rawErrors = []
+    } = props;
+    const {
+      enumOptions,
+      enumDisabled
+    } = options;
+    const semanticProps = getSemanticProps({
+      formContext,
+      options,
+      uiSchema
     }); // eslint-disable-next-line no-shadow
 
-    var _onChange = function _onChange(event, _ref) {
-      var eventValue = _ref.value;
+    const _onChange = (event, _ref) => {
+      let {
+        value: eventValue
+      } = _ref;
       return onChange && onChange(schema.type === "boolean" ? eventValue !== "false" : eventValue);
     };
 
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
+    const _onBlur = () => onBlur && onBlur(id, value);
 
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
+    const _onFocus = () => onFocus && onFocus(id, value);
 
-    var inlineOption = options.inline ? {
+    const inlineOption = options.inline ? {
       inline: true
     } : {
       grouped: true
     };
-    return React.createElement(semanticUiReact.Form.Group, inlineOption, enumOptions.map(function (option, i) {
-      var itemDisabled = enumDisabled && enumDisabled.indexOf(option.value) !== -1;
-      return React.createElement(semanticUiReact.Form.Field, _extends({
+    return /*#__PURE__*/React.createElement(semanticUiReact.Form.Group, inlineOption, enumOptions.map((option, i) => {
+      const itemDisabled = enumDisabled && enumDisabled.indexOf(option.value) !== -1;
+      return /*#__PURE__*/React.createElement(semanticUiReact.Form.Field, _extends({
         required: required,
         control: semanticUiReact.Radio,
-        name: name
+        name: id + "-radio-" + option.value
       }, semanticProps, {
         onFocus: _onFocus,
         onBlur: _onBlur,
         label: "" + option.label,
         value: "" + option.value,
+        error: rawErrors.length > 0,
         key: option.value + "-" + i,
         checked: value == option.value,
         onChange: _onChange,
@@ -938,62 +970,61 @@
     }));
   }
 
-  var rangeSpec = core.utils.rangeSpec;
-
   function RangeWidget(props) {
-    var id = props.id,
-        name = props.name,
-        value = props.value,
-        required = props.required,
-        readonly = props.readonly,
-        disabled = props.disabled,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        options = props.options,
-        schema = props.schema,
-        uiSchema = props.uiSchema,
-        formContext = props.formContext;
-    var semanticProps = getSemanticProps({
-      formContext: formContext,
-      options: options,
-      uiSchema: uiSchema,
+    const {
+      id,
+      name,
+      value,
+      required,
+      readonly,
+      disabled,
+      onChange,
+      onBlur,
+      onFocus,
+      options,
+      schema,
+      uiSchema,
+      formContext,
+      rawErrors = []
+    } = props;
+    const semanticProps = getSemanticProps({
+      formContext,
+      options,
+      uiSchema,
       defaultSchemaProps: {
         fluid: true
       }
     }); // eslint-disable-next-line no-shadow
 
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
+    const _onChange = _ref => {
+      let {
+        target: {
+          value
+        }
+      } = _ref;
       return onChange && onChange(value === "" ? options.emptyValue : value);
     };
 
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
+    const _onBlur = () => onBlur && onBlur(id, value);
 
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
+    const _onFocus = () => onFocus && onFocus(id, value);
 
-    return React.createElement(React.Fragment, null, React.createElement(semanticUiReact.Input, _extends({
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(semanticUiReact.Input, _extends({
       id: id,
       key: id,
       name: name,
       type: "range",
       required: required,
       disabled: disabled || readonly
-    }, rangeSpec(schema), semanticProps, {
+    }, utils.rangeSpec(schema), semanticProps, {
       value: value || "",
+      error: rawErrors.length > 0,
       onChange: _onChange,
       onBlur: _onBlur,
       onFocus: _onFocus
-    })), React.createElement("span", null, value));
+    })), /*#__PURE__*/React.createElement("span", null, value));
   }
 
-  var asNumber = core.utils.asNumber,
-      guessType = core.utils.guessType;
-  var nums = /*#__PURE__*/new Set(["number", "integer"]);
   /**
    * * Returns and creates an array format required for semantic drop down
    * @param {array} enumOptions- array of items for the dropdown
@@ -1002,82 +1033,50 @@
    */
 
   function createDefaultValueOptionsForDropDown(enumOptions, enumDisabled) {
-    var disabledOptions = enumDisabled || [];
-    var options = []; // eslint-disable-next-line no-shadow
-
-    options = _.map(enumOptions, function (_ref) {
-      var label = _ref.label,
-          value = _ref.value;
+    const disabledOptions = enumDisabled || [];
+    let options = []; // eslint-disable-next-line no-shadow
+
+    options = _.map(enumOptions, _ref => {
+      let {
+        label,
+        value
+      } = _ref;
       return {
         disabled: disabledOptions.indexOf(value) !== -1,
         key: label,
         text: label,
-        value: value
+        value
       };
     });
     return options;
   }
-  /**
-   * This is a silly limitation in the DOM where option change event values are
-   * always retrieved as strings.
-   */
-
-
-  var processValue = function processValue(schema, value) {
-    // "enum" is a reserved word, so only "type" and "items" can be destructured
-    var type = schema.type,
-        items = schema.items;
-
-    if (value === "") {
-      return undefined;
-    } else if (type === "array" && items && nums.has(items.type)) {
-      return value.map(asNumber);
-    } else if (type === "boolean") {
-      return value === "true" || value === true;
-    } else if (type === "number") {
-      return asNumber(value);
-    } // If type is undefined, but an enum is present, try and infer the type from
-    // the enum values
-
-
-    if (schema.enum) {
-      if (schema.enum.every(function (x) {
-        return guessType(x) === "number";
-      })) {
-        return asNumber(value);
-      } else if (schema.enum.every(function (x) {
-        return guessType(x) === "boolean";
-      })) {
-        return value === "true";
-      }
-    }
-
-    return value;
-  };
 
   function SelectWidget(props) {
-    var schema = props.schema,
-        uiSchema = props.uiSchema,
-        formContext = props.formContext,
-        id = props.id,
-        options = props.options,
-        name = props.name,
-        label = props.label,
-        required = props.required,
-        disabled = props.disabled,
-        readonly = props.readonly,
-        value = props.value,
-        multiple = props.multiple,
-        placeholder = props.placeholder,
-        autofocus = props.autofocus,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus;
-    var semanticProps = getSemanticProps({
-      schema: schema,
-      uiSchema: uiSchema,
-      formContext: formContext,
-      options: options,
+    const {
+      schema,
+      uiSchema,
+      formContext,
+      id,
+      options,
+      name,
+      label,
+      required,
+      disabled,
+      readonly,
+      value,
+      multiple,
+      placeholder,
+      autofocus,
+      onChange,
+      onBlur,
+      onFocus,
+      rawErrors = []
+    } = props;
+    const semanticProps = getSemanticProps({
+      schema,
+      uiSchema,
+      formContext,
+      options,
       defaultSchemaProps: {
         inverted: "false",
         selection: true,
@@ -1086,34 +1085,48 @@
         upward: false
       }
     });
-    var enumDisabled = options.enumDisabled,
-        enumOptions = options.enumOptions;
-    var emptyValue = multiple ? [] : "";
-    var dropdownOptions = createDefaultValueOptionsForDropDown(enumOptions, enumDisabled);
-
-    var _onChange = function _onChange(event, // eslint-disable-next-line no-shadow
-    _ref2) {
-      var value = _ref2.value;
-      return onChange && onChange(processValue(schema, value));
+    const {
+      enumDisabled,
+      enumOptions
+    } = options;
+    const emptyValue = multiple ? [] : "";
+    const dropdownOptions = createDefaultValueOptionsForDropDown(enumOptions, enumDisabled);
+
+    const _onChange = (event, // eslint-disable-next-line no-shadow
+    _ref2) => {
+      let {
+        value
+      } = _ref2;
+      return onChange && onChange(utils.processSelectValue(schema, value, options));
     }; // eslint-disable-next-line no-shadow
 
 
-    var _onBlur = function _onBlur(_ref3) {
-      var value = _ref3.target.value;
-      return onBlur && onBlur(id, processValue(schema, value));
+    const _onBlur = _ref3 => {
+      let {
+        target: {
+          value
+        }
+      } = _ref3;
+      return onBlur && onBlur(id, utils.processSelectValue(schema, value, options));
     };
 
-    var _onFocus = function _onFocus(_ref4) {
-      var value = _ref4.target.value;
-      return onFocus && onFocus(id, processValue(schema, value));
+    const _onFocus = _ref4 => {
+      let {
+        // eslint-disable-next-line no-shadow
+        target: {
+          value
+        }
+      } = _ref4;
+      return onFocus && onFocus(id, utils.processSelectValue(schema, value, options));
     };
 
-    return React.createElement(semanticUiReact.Form.Dropdown, _extends({
+    return /*#__PURE__*/React.createElement(semanticUiReact.Form.Dropdown, _extends({
       key: id,
       name: name,
       label: label || schema.title,
       multiple: typeof multiple === "undefined" ? false : multiple,
       value: typeof value === "undefined" ? emptyValue : value,
+      error: rawErrors.length > 0,
       disabled: disabled,
       placeholder: placeholder
     }, semanticProps, {
@@ -1127,50 +1140,53 @@
     }));
   }
 
-  var getDisplayLabel$2 = core.utils.getDisplayLabel;
-
   function TextareaWidget(props) {
-    var id = props.id,
-        placeholder = props.placeholder,
-        value = props.value,
-        required = props.required,
-        disabled = props.disabled,
-        autofocus = props.autofocus,
-        label = props.label,
-        name = props.name,
-        readonly = props.readonly,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        onChange = props.onChange,
-        options = props.options,
-        schema = props.schema,
-        uiSchema = props.uiSchema,
-        formContext = props.formContext;
-    var semanticProps = getSemanticProps({
-      formContext: formContext,
-      options: options,
+    const {
+      id,
+      placeholder,
+      value,
+      required,
+      disabled,
+      autofocus,
+      label,
+      name,
+      readonly,
+      onBlur,
+      onFocus,
+      onChange,
+      options,
+      schema,
+      uiSchema,
+      formContext,
+      registry,
+      rawErrors = []
+    } = props;
+    const semanticProps = getSemanticProps({
+      formContext,
+      options,
       defaultSchemaProps: {
         inverted: false
       }
-    }); // eslint-disable-next-line no-shadow
-
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
+    });
+    const {
+      schemaUtils
+    } = registry; // eslint-disable-next-line no-shadow
+
+    const _onChange = _ref => {
+      let {
+        target: {
+          value
+        }
+      } = _ref;
       return onChange && onChange(value === "" ? options.emptyValue : value);
     };
 
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
+    const _onBlur = () => onBlur && onBlur(id, value);
 
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
+    const _onFocus = () => onFocus && onFocus(id, value);
 
-    var displayLabel = getDisplayLabel$2(schema, uiSchema
-    /* TODO: , rootSchema */
-    );
-    return React.createElement(semanticUiReact.Form.TextArea, _extends({
+    const displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema);
+    return /*#__PURE__*/React.createElement(semanticUiReact.Form.TextArea, _extends({
       id: id,
       key: id,
       label: displayLabel ? label || schema.title : false,
@@ -1181,6 +1197,7 @@
       name: name
     }, semanticProps, {
       value: value || "",
+      error: rawErrors.length > 0,
       rows: options.rows || 5,
       onChange: _onChange,
       onBlur: _onBlur,
@@ -1188,415 +1205,25 @@
     }));
   }
 
-  var getDisplayLabel$3 = core.utils.getDisplayLabel;
-
-  function TextWidget(props) {
-    var id = props.id,
-        placeholder = props.placeholder,
-        name = props.name,
-        label = props.label,
-        value = props.value,
-        required = props.required,
-        readonly = props.readonly,
-        disabled = props.disabled,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        autofocus = props.autofocus,
-        options = props.options,
-        schema = props.schema,
-        uiSchema = props.uiSchema,
-        formContext = props.formContext;
-    var semanticProps = getSemanticProps({
-      formContext: formContext,
-      options: options,
-      uiSchema: uiSchema
-    }); // eslint-disable-next-line no-shadow
-
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
-      return onChange(value === "" ? options.emptyValue : value);
-    };
-
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
-
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
-
-    var displayLabel = getDisplayLabel$3(schema, uiSchema
-    /* TODO: , rootSchema */
-    );
-    return React.createElement(semanticUiReact.Form.Input, _extends({
-      key: id,
-      id: id,
-      placeholder: placeholder,
-      type: schema.type === 'string' ? 'text' : "" + schema.type,
-      label: displayLabel ? label || schema.title : false,
-      required: required,
-      autoFocus: autofocus,
-      disabled: disabled || readonly,
-      name: name
-    }, semanticProps, {
-      value: value || value === 0 ? value : "",
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus
-    }));
-  }
-
-  var getDisplayLabel$4 = core.utils.getDisplayLabel;
-
-  function UpDownWidget(props) {
-    var id = props.id,
-        name = props.name,
-        label = props.label,
-        value = props.value,
-        required = props.required,
-        readonly = props.readonly,
-        disabled = props.disabled,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        autofocus = props.autofocus,
-        options = props.options,
-        schema = props.schema,
-        uiSchema = props.uiSchema,
-        formContext = props.formContext;
-    var semanticProps = getSemanticProps({
-      formContext: formContext,
-      options: options,
-      uiSchema: uiSchema
-    }); // eslint-disable-next-line no-shadow
-
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
-      return onChange && onChange(value);
-    };
-
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
-
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
-
-    var displayLabel = getDisplayLabel$4(schema, uiSchema
-    /* TODO: , rootSchema */
-    );
-    return React.createElement(React.Fragment, null, React.createElement(semanticUiReact.Form.Input, _extends({
-      id: id,
-      key: id,
-      autoFocus: autofocus,
-      required: required,
-      type: "number",
-      label: displayLabel ? label || schema.title : false,
-      disabled: disabled || readonly,
-      name: name
-    }, semanticProps, {
-      value: value || value === 0 ? value : "",
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus
-    })));
-  }
-
-  var getDisplayLabel$5 = core.utils.getDisplayLabel;
-
-  function DateWidget(props) {
-    var id = props.id,
-        required = props.required,
-        readonly = props.readonly,
-        disabled = props.disabled,
-        name = props.name,
-        label = props.label,
-        value = props.value,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        autofocus = props.autofocus,
-        options = props.options,
-        formContext = props.formContext,
-        schema = props.schema,
-        uiSchema = props.uiSchema;
-    var semanticProps = getSemanticProps({
-      uiSchema: uiSchema,
-      schema: schema,
-      formContext: formContext,
-      options: options
-    });
-
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
-      return onChange && onChange(value);
-    };
-
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
-
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
-
-    var displayLabel = getDisplayLabel$5(schema, uiSchema
-    /* TODO: , rootSchema */
-    );
-    return React.createElement(semanticUiReact.Form.Input, _extends({
-      key: id,
-      id: id,
-      type: "date",
-      label: displayLabel ? label || schema.title : false,
-      required: required,
-      autoFocus: autofocus,
-      disabled: disabled || readonly,
-      name: name
-    }, semanticProps, {
-      value: value || value === 0 ? value : "",
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus
-    }));
-  }
-
-  var localToUTC = core.utils.localToUTC,
-      utcToLocal = core.utils.utcToLocal,
-      getDisplayLabel$6 = core.utils.getDisplayLabel;
-
-  function DateTimeWidget(props) {
-    var id = props.id,
-        required = props.required,
-        readonly = props.readonly,
-        disabled = props.disabled,
-        name = props.name,
-        label = props.label,
-        schema = props.schema,
-        uiSchema = props.uiSchema,
-        value = props.value,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        autofocus = props.autofocus,
-        options = props.options,
-        formContext = props.formContext;
-    var semanticProps = getSemanticProps({
-      uiSchema: uiSchema,
-      schema: schema,
-      formContext: formContext,
-      options: options
-    });
-
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
-      return onChange && onChange(localToUTC(value));
-    };
-
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
-
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
-
-    var dateValue = utcToLocal(value);
-    var displayLabel = getDisplayLabel$6(schema, uiSchema
-    /* TODO: , rootSchema */
-    );
-    return React.createElement(semanticUiReact.Form.Input, _extends({
-      key: id,
-      id: id,
-      type: "datetime-local",
-      label: displayLabel ? label || schema.title : false,
-      required: required,
-      autoFocus: autofocus,
-      disabled: disabled || readonly,
-      name: name
-    }, semanticProps, {
-      value: dateValue,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus
-    }));
-  }
-
-  var getDisplayLabel$7 = core.utils.getDisplayLabel;
-
-  function EmailWidget(props) {
-    var id = props.id,
-        required = props.required,
-        readonly = props.readonly,
-        disabled = props.disabled,
-        name = props.name,
-        label = props.label,
-        schema = props.schema,
-        uiSchema = props.uiSchema,
-        value = props.value,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        autofocus = props.autofocus,
-        options = props.options,
-        formContext = props.formContext;
-    var semanticProps = getSemanticProps({
-      schema: schema,
-      uiSchema: uiSchema,
-      formContext: formContext,
-      options: options
-    }); // eslint-disable-next-line no-shadow
-
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
-      return onChange(value === "" ? options.emptyValue : value);
-    };
-
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
-
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
-
-    var displayLabel = getDisplayLabel$7(schema, uiSchema
-    /* TODO: , rootSchema */
-    );
-    return React.createElement(semanticUiReact.Form.Input, _extends({
-      key: id,
-      id: id,
-      type: "email",
-      label: displayLabel ? label || schema.title : false,
-      required: required,
-      autoFocus: autofocus,
-      disabled: disabled || readonly,
-      name: name
-    }, semanticProps, {
-      value: value || value === 0 ? value : "",
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus
-    }));
-  }
-
-  var getDisplayLabel$8 = core.utils.getDisplayLabel;
-
-  function URLWidget(props) {
-    var id = props.id,
-        name = props.name,
-        label = props.label,
-        value = props.value,
-        required = props.required,
-        readonly = props.readonly,
-        disabled = props.disabled,
-        onChange = props.onChange,
-        onBlur = props.onBlur,
-        onFocus = props.onFocus,
-        autofocus = props.autofocus,
-        options = props.options,
-        schema = props.schema,
-        uiSchema = props.uiSchema,
-        formContext = props.formContext;
-    var semanticProps = getSemanticProps({
-      formContext: formContext,
-      options: options,
-      uiSchema: uiSchema
-    }); // eslint-disable-next-line no-shadow
-
-    var _onChange = function _onChange(_ref) {
-      var value = _ref.target.value;
-      return onChange(value === "" ? options.emptyValue : value);
-    };
-
-    var _onBlur = function _onBlur() {
-      return onBlur && onBlur(id, value);
-    };
-
-    var _onFocus = function _onFocus() {
-      return onFocus && onFocus(id, value);
-    };
-
-    var displayLabel = getDisplayLabel$8(schema, uiSchema
-    /* TODO: , rootSchema */
-    );
-    return React.createElement(semanticUiReact.Form.Input, _extends({
-      key: id,
-      id: id,
-      type: "url",
-      label: displayLabel ? label || schema.title : false,
-      required: required,
-      autoFocus: autofocus,
-      disabled: disabled || readonly,
-      name: name
-    }, semanticProps, {
-      value: value || value === 0 ? value : "",
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus
-    }));
-  }
-
-  var getSubmitButtonOptions = core.utils.getSubmitButtonOptions;
-  var SubmitButton = (function (_ref) {
-    var uiSchema = _ref.uiSchema;
-
-    var _getSubmitButtonOptio = getSubmitButtonOptions(uiSchema),
-        submitText = _getSubmitButtonOptio.submitText,
-        norender = _getSubmitButtonOptio.norender,
-        submitButtonProps = _getSubmitButtonOptio.props;
-
-    if (norender) {
-      return null;
-    }
-
-    return React.createElement(semanticUiReact.Button, _extends({
-      type: "submit",
-      primary: true
-    }, submitButtonProps), submitText);
-  });
-
   var Widgets = {
-    CheckboxWidget: CheckboxWidget,
-    CheckboxesWidget: CheckboxesWidget,
-    DateWidget: DateWidget,
-    DateTimeWidget: DateTimeWidget,
-    PasswordWidget: PasswordWidget,
-    EmailWidget: EmailWidget,
-    URLWidget: URLWidget,
-    RadioWidget: RadioWidget,
-    RangeWidget: RangeWidget,
-    SelectWidget: SelectWidget,
-    TextareaWidget: TextareaWidget,
-    TextWidget: TextWidget,
-    UpDownWidget: UpDownWidget,
-    SubmitButton: SubmitButton
+    CheckboxWidget,
+    CheckboxesWidget,
+    RadioWidget,
+    RangeWidget,
+    SelectWidget,
+    TextareaWidget
   };
 
-  var getDefaultRegistry = core.utils.getDefaultRegistry;
-
-  var _getDefaultRegistry = /*#__PURE__*/getDefaultRegistry(),
-      fields = _getDefaultRegistry.fields,
-      widgets = _getDefaultRegistry.widgets;
-
-  var Theme = {
-    ArrayFieldTemplate: ArrayFieldTemplate,
-    ErrorList: ErrorList,
-    fields: /*#__PURE__*/_extends({}, fields, Fields),
-    FieldTemplate: FieldTemplate,
-    ObjectFieldTemplate: ObjectFieldTemplate,
-    _internalFormWrapper: semanticUiReact.Form,
-    widgets: /*#__PURE__*/_extends({}, widgets, Widgets)
+  const Theme = {
+    templates: Templates,
+    widgets: Widgets,
+    _internalFormWrapper: semanticUiReact.Form
   };
 
-  var SemanticUIForm = /*#__PURE__*/core.withTheme(Theme);
+  const SemanticUIForm = /*#__PURE__*/core.withTheme(Theme);
 
-  exports.ArrayFieldTemplate = ArrayFieldTemplate;
-  exports.FieldTemplate = FieldTemplate;
-  exports.Fields = Fields;
-  exports.ObjectFieldTemplate = ObjectFieldTemplate;
-  exports.SemanticUIForm = SemanticUIForm;
+  exports.Form = SemanticUIForm;
+  exports.Templates = Templates;
   exports.Theme = Theme;
   exports.Widgets = Widgets;
   exports.default = SemanticUIForm;