From ed96cbf3701b2241236df3ba423e2af9768e1175 Mon Sep 17 00:00:00 2001
From: Jacques <jacques@trixta.com>
Date: Wed, 5 Aug 2020 20:54:07 +0200
Subject: [PATCH 1/7] fix: docs

---
 docs/themes/semantic-ui/uiSchema.md    |  2 +-
 packages/semantic-ui/test/util.test.js | 60 ++++++++++++++++++++++++++
 2 files changed, 61 insertions(+), 1 deletion(-)
 create mode 100644 packages/semantic-ui/test/util.test.js

diff --git a/docs/themes/semantic-ui/uiSchema.md b/docs/themes/semantic-ui/uiSchema.md
index c742a8345a..91dc5706a6 100644
--- a/docs/themes/semantic-ui/uiSchema.md
+++ b/docs/themes/semantic-ui/uiSchema.md
@@ -106,7 +106,7 @@ wrapLabel: wrap all labels in a div, for custom styling via CSS
 ```jsx
 <Form
   formContext={{
-    "semantic"={
+    "semantic" : {
       "wrapLabel": true,
       "wrapContent": true
     }
diff --git a/packages/semantic-ui/test/util.test.js b/packages/semantic-ui/test/util.test.js
new file mode 100644
index 0000000000..d15e55c409
--- /dev/null
+++ b/packages/semantic-ui/test/util.test.js
@@ -0,0 +1,60 @@
+const { getSemanticProps,getSemanticErrorProps } = require("../src/util");
+
+
+describe("util js functions", () => {
+
+  describe("getSemanticProps", () => {
+
+      test("defaultSchemaProps should be returned", () => {
+        const uiSchema = {
+          "ui:options": {
+          }
+        };
+        expect(getSemanticProps({ uiSchema, defaultSchemaProps:{ wrapItem: false , horizontalButtons: true } })).toEqual({
+          "wrapItem": false,
+          "horizontalButtons": true
+        });
+      });
+
+      test("semantic props if passed should overwrite defaultSchemaProps", () => {
+        const uiSchema = {
+          "ui:options": {
+            "semantic": {
+              "wrapItem": true,
+              "horizontalButtons": true
+            }
+          }
+        };
+        expect(getSemanticProps({ uiSchema, defaultSchemaProps:{ wrapItem: false , horizontalButtons: true } })).toEqual({
+          "wrapItem": true,
+          "horizontalButtons": true
+        });
+      });
+  });
+
+  describe("getSemanticErrorProps", () => {
+    test("default semantic errorOptions props should be returned", () => {
+      const uiSchema = {
+        "ui:options": {
+        }
+      };
+      expect(getSemanticErrorProps({ uiSchema })).toEqual({
+         size: 'small', pointing:'above'
+      });
+    });
+
+    test("semantic errorOptions props if passed should overwrite defaultSchemaProps", () => {
+      const uiSchema = {
+        "ui:options": {
+          semantic: {
+            errorOptions: { 'size': 'large' }
+          }
+        }
+      };
+      expect(getSemanticErrorProps({ uiSchema })).toEqual({
+          'size': 'large',
+       });
+    });
+  });
+
+});

From e4c9d46daa180daa5036345e3a02e07a2ac5c3ea Mon Sep 17 00:00:00 2001
From: Jacques <jacques@trixta.com>
Date: Wed, 5 Aug 2020 20:58:53 +0200
Subject: [PATCH 2/7] update: custom fields

---
 .../src/DateTimeWidget/DateTimeWidget.js      | 62 +++++++++++++++
 .../semantic-ui/src/DateTimeWidget/index.js   |  2 +
 .../semantic-ui/src/DateWidget/DateWidget.js  | 60 ++++++++++++++
 packages/semantic-ui/src/DateWidget/index.js  |  2 +
 .../src/EmailWidget/EmailWidget.js            | 78 +++++++++++++++++++
 packages/semantic-ui/src/EmailWidget/index.js |  2 +
 .../src/SubmitButton/SubmitButton.js          |  4 +
 .../semantic-ui/src/SubmitButton/index.js     |  2 +
 .../semantic-ui/src/URLWidget/URLWidget.js    | 62 +++++++++++++++
 packages/semantic-ui/src/URLWidget/index.js   |  2 +
 packages/semantic-ui/src/Widgets/Widgets.js   |  9 ++-
 packages/semantic-ui/src/util.js              | 55 +++++++++++--
 12 files changed, 331 insertions(+), 9 deletions(-)
 create mode 100644 packages/semantic-ui/src/DateTimeWidget/DateTimeWidget.js
 create mode 100644 packages/semantic-ui/src/DateTimeWidget/index.js
 create mode 100644 packages/semantic-ui/src/DateWidget/DateWidget.js
 create mode 100644 packages/semantic-ui/src/DateWidget/index.js
 create mode 100644 packages/semantic-ui/src/EmailWidget/EmailWidget.js
 create mode 100644 packages/semantic-ui/src/EmailWidget/index.js
 create mode 100644 packages/semantic-ui/src/SubmitButton/SubmitButton.js
 create mode 100644 packages/semantic-ui/src/SubmitButton/index.js
 create mode 100644 packages/semantic-ui/src/URLWidget/URLWidget.js
 create mode 100644 packages/semantic-ui/src/URLWidget/index.js

diff --git a/packages/semantic-ui/src/DateTimeWidget/DateTimeWidget.js b/packages/semantic-ui/src/DateTimeWidget/DateTimeWidget.js
new file mode 100644
index 0000000000..4ce2711642
--- /dev/null
+++ b/packages/semantic-ui/src/DateTimeWidget/DateTimeWidget.js
@@ -0,0 +1,62 @@
+/* eslint-disable react/prop-types */
+import React from "react";
+import { utils } from "@rjsf/core";
+import { getSemanticProps } from "../util";
+import { Form } from "semantic-ui-react";
+
+const { localToUTC, utcToLocal, getDisplayLabel } = utils;
+
+function DateTimeWidget(props) {
+  const {
+  id,
+  required,
+  readonly,
+  disabled,
+  name,
+  label,
+  schema,
+  uiSchema,
+  value,
+  onChange,
+  onBlur,
+  onFocus,
+  autofocus,
+  options,
+  formContext,
+  } = props;
+  const semanticProps = getSemanticProps({
+    uiSchema,
+    schema,
+    formContext,
+    options,
+    defaultSchemaProps: {},
+  });
+  const _onChange = ({ target: { value } }) => onChange && onChange(localToUTC(value));
+  const _onBlur = () => onBlur && onBlur(id, value);
+  const _onFocus = () => onFocus && onFocus(id, value);
+  const dateValue = utcToLocal(value);
+  const displayLabel = getDisplayLabel(
+    schema,
+    uiSchema
+    /* TODO: , rootSchema */
+  );
+  return (
+    <Form.Input
+    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}
+  />
+  );
+}
+
+export default DateTimeWidget;
diff --git a/packages/semantic-ui/src/DateTimeWidget/index.js b/packages/semantic-ui/src/DateTimeWidget/index.js
new file mode 100644
index 0000000000..0db366167f
--- /dev/null
+++ b/packages/semantic-ui/src/DateTimeWidget/index.js
@@ -0,0 +1,2 @@
+export { default } from './DateTimeWidget';
+export * from './DateTimeWidget';
diff --git a/packages/semantic-ui/src/DateWidget/DateWidget.js b/packages/semantic-ui/src/DateWidget/DateWidget.js
new file mode 100644
index 0000000000..69f0815a80
--- /dev/null
+++ b/packages/semantic-ui/src/DateWidget/DateWidget.js
@@ -0,0 +1,60 @@
+/* eslint-disable react/prop-types */
+import React from "react";
+import { getSemanticProps } from "../util";
+import { Form } from "semantic-ui-react";
+import {  utils } from "@rjsf/core";
+
+const { getDisplayLabel } = utils;
+function DateWidget(props) {
+  const {
+    id,
+    required,
+    readonly,
+    disabled,
+    name,
+    label,
+    value,
+    onChange,
+    onBlur,
+    onFocus,
+    autofocus,
+    options,
+    formContext,
+    schema,
+    uiSchema,
+  } = props;
+  const semanticProps = getSemanticProps({
+    uiSchema,
+    schema,
+    formContext,
+    options,
+    defaultSchemaProps: {},
+  });
+  const _onChange = ({ target: { value } }) => onChange && onChange(value);
+  const _onBlur = () => onBlur && onBlur(id, value);
+  const _onFocus = () => onFocus && onFocus(id, value);
+  const displayLabel = getDisplayLabel(
+    schema,
+    uiSchema
+    /* TODO: , rootSchema */
+  );
+  return (
+    <Form.Input
+    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}
+  />
+  );
+}
+
+export default DateWidget;
diff --git a/packages/semantic-ui/src/DateWidget/index.js b/packages/semantic-ui/src/DateWidget/index.js
new file mode 100644
index 0000000000..923b0077fb
--- /dev/null
+++ b/packages/semantic-ui/src/DateWidget/index.js
@@ -0,0 +1,2 @@
+export { default } from './DateWidget';
+export * from './DateWidget';
diff --git a/packages/semantic-ui/src/EmailWidget/EmailWidget.js b/packages/semantic-ui/src/EmailWidget/EmailWidget.js
new file mode 100644
index 0000000000..cbf9fc988e
--- /dev/null
+++ b/packages/semantic-ui/src/EmailWidget/EmailWidget.js
@@ -0,0 +1,78 @@
+import React from "react";
+import PropTypes from "prop-types";
+import { Form } from "semantic-ui-react";
+import { getSemanticProps } from "../util";
+import {  utils } from "@rjsf/core";
+
+const { getDisplayLabel } = utils;
+function EmailWidget(props) {
+  const {
+    id,
+    required,
+    readonly,
+    disabled,
+    name,
+    label,
+    schema,
+    uiSchema,
+    value,
+    onChange,
+    onBlur,
+    onFocus,
+    autofocus,
+    options,
+    formContext,
+  } = props;
+  const semanticProps = getSemanticProps({
+    schema,
+    uiSchema,
+    formContext,
+    options,
+    defaultSchemaProps:{
+      inverted: false,
+      fluid: true,
+    }
+ });
+  // eslint-disable-next-line no-shadow
+  const _onChange = ({ target: { value } }) =>
+    onChange(value === "" ? options.emptyValue : value);
+  const _onBlur = () => onBlur && onBlur(id, value);
+  const _onFocus = () => onFocus && onFocus(id, value);
+  const displayLabel = getDisplayLabel(
+    schema,
+    uiSchema
+    /* TODO: , rootSchema */
+  );
+  return (
+    <Form.Input
+      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}
+    />
+  );
+}
+
+EmailWidget.defaultProps = {
+  options: {
+    semantic: {
+      fluid: true,
+      inverted: false,
+    },
+  },
+};
+
+EmailWidget.propTypes = {
+  options: PropTypes.object,
+};
+
+export default EmailWidget;
diff --git a/packages/semantic-ui/src/EmailWidget/index.js b/packages/semantic-ui/src/EmailWidget/index.js
new file mode 100644
index 0000000000..c48979eea8
--- /dev/null
+++ b/packages/semantic-ui/src/EmailWidget/index.js
@@ -0,0 +1,2 @@
+export { default } from './EmailWidget';
+export * from './EmailWidget';
diff --git a/packages/semantic-ui/src/SubmitButton/SubmitButton.js b/packages/semantic-ui/src/SubmitButton/SubmitButton.js
new file mode 100644
index 0000000000..afab81e7fb
--- /dev/null
+++ b/packages/semantic-ui/src/SubmitButton/SubmitButton.js
@@ -0,0 +1,4 @@
+import React from "react";
+import { Button } from "semantic-ui-react";
+export default () => (<Button content="Submit" type="submit" primary />);
+
diff --git a/packages/semantic-ui/src/SubmitButton/index.js b/packages/semantic-ui/src/SubmitButton/index.js
new file mode 100644
index 0000000000..f676497ba2
--- /dev/null
+++ b/packages/semantic-ui/src/SubmitButton/index.js
@@ -0,0 +1,2 @@
+export { default } from './SubmitButton';
+export * from './SubmitButton';
diff --git a/packages/semantic-ui/src/URLWidget/URLWidget.js b/packages/semantic-ui/src/URLWidget/URLWidget.js
new file mode 100644
index 0000000000..f197f5d168
--- /dev/null
+++ b/packages/semantic-ui/src/URLWidget/URLWidget.js
@@ -0,0 +1,62 @@
+import React from "react";
+import { Form } from "semantic-ui-react";
+import { getSemanticProps } from "../util";
+import {  utils } from "@rjsf/core";
+
+const { getDisplayLabel } = utils;
+function URLWidget(props) {
+  const {
+    id,
+    name,
+    label,
+    value,
+    required,
+    readonly,
+    disabled,
+    onChange,
+    onBlur,
+    onFocus,
+    autofocus,
+    options,
+    schema,
+    uiSchema,
+    formContext,
+  } = props;
+  const semanticProps = getSemanticProps(
+    { formContext, options,
+      uiSchema,
+      defaultSchemaProps: {
+        fluid: true,
+        inverted: false,
+    }
+  });
+  // eslint-disable-next-line no-shadow
+  const _onChange = ({ target: { value } }) =>
+    onChange(value === "" ? options.emptyValue : value);
+  const _onBlur = () => onBlur && onBlur(id, value);
+  const _onFocus = () => onFocus && onFocus(id, value);
+  const displayLabel = getDisplayLabel(
+    schema,
+    uiSchema
+    /* TODO: , rootSchema */
+  );
+  return (
+    <Form.Input
+      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}
+    />
+  );
+}
+
+export default URLWidget;
diff --git a/packages/semantic-ui/src/URLWidget/index.js b/packages/semantic-ui/src/URLWidget/index.js
new file mode 100644
index 0000000000..65d5258635
--- /dev/null
+++ b/packages/semantic-ui/src/URLWidget/index.js
@@ -0,0 +1,2 @@
+export { default } from './URLWidget';
+export * from './URLWidget';
diff --git a/packages/semantic-ui/src/Widgets/Widgets.js b/packages/semantic-ui/src/Widgets/Widgets.js
index b375ed1061..93847482b5 100644
--- a/packages/semantic-ui/src/Widgets/Widgets.js
+++ b/packages/semantic-ui/src/Widgets/Widgets.js
@@ -7,11 +7,18 @@ import SelectWidget from "../SelectWidget/SelectWidget";
 import TextareaWidget from "../TextareaWidget/TextareaWidget";
 import TextWidget from "../TextWidget/TextWidget";
 import UpDownWidget from "../UpDownWidget/UpDownWidget";
-
+import DateWidget from "../DateWidget/DateWidget";
+import DateTimeWidget from "../DateTimeWidget/DateTimeWidget";
+import EmailWidget from "../EmailWidget/EmailWidget";
+import URLWidget from "../URLWidget/URLWidget";
 export default {
   CheckboxWidget,
   CheckboxesWidget,
+  DateWidget,
+  DateTimeWidget,
   PasswordWidget,
+  EmailWidget,
+  URLWidget,
   RadioWidget,
   RangeWidget,
   SelectWidget,
diff --git a/packages/semantic-ui/src/util.js b/packages/semantic-ui/src/util.js
index c8c9607860..f4dee505fc 100644
--- a/packages/semantic-ui/src/util.js
+++ b/packages/semantic-ui/src/util.js
@@ -4,21 +4,60 @@ import React from "react";
  * Extract props meant for semantic UI components from props that are
  * passed to Widgets, Templates and Fields.
  * @param {Object} params
- * @param {Object} params.formContext
- * @param {Object} params.uiSchema
- * @param {Object} params.options
+ * @param {Object?} params.formContext
+ * @param {Object?} params.uiSchema
+ * @param {Object?} params.options
+ * @param {Object?} params.defaultSchemaProps
+ * @param {Object?} params.defaultContextProps
  * @returns {any}
  */
 export function getSemanticProps({
   formContext = {},
   uiSchema = {},
   options = {},
+  defaultSchemaProps = { fluid: true ,inverted: false },
+  defaultContextProps= { }
 }) {
+
+   const hasFormContextProps = formContext.semantic  ? true : false;
+   const hasSchemaProps = uiSchema["ui:options"] && uiSchema["ui:options"].semantic ? true : false;
+   const hasOptionsProps = options.semantic  ? true : false;
+
+  return Object.assign(
+    {},
+    hasFormContextProps ? formContext.semantic : defaultContextProps,
+    hasSchemaProps ? uiSchema["ui:options"].semantic : defaultSchemaProps,
+    hasOptionsProps ? options.semantic : {},
+  );
+}
+
+/**
+ * Extract error props meant for semantic UI components from props that are
+ * passed to Widgets, Templates and Fields.
+ * @param {Object} params
+ * @param {Object?} params.formContext
+ * @param {Object?} params.uiSchema
+ * @param {Object?} params.defaultProps
+ * @returns {any}
+ */
+export function getSemanticErrorProps({
+  formContext = {},
+  uiSchema = {},
+  options = {},
+  defaultProps = { size: 'small', pointing:'above' }
+}) {
+
+  const hasFormContextProps = formContext.semantic && formContext.semantic.errorOptions || false;
+  const hasSchemaProps = uiSchema["ui:options"] && uiSchema["ui:options"].semantic && uiSchema["ui:options"].semantic.errorOptions || false;
+  const hasOptionsProps = options.semantic && options.semantic.errorOptions || false;
+
+  const defaultSemanticErrorProps =  defaultProps;
+
   return Object.assign(
     {},
-    formContext.semantic || {},
-    uiSchema["ui:options"] ? uiSchema["ui:options"].semantic : {},
-    options.semantic || {}
+    hasFormContextProps ? formContext.semantic.errorOptions : {},
+    hasSchemaProps ? uiSchema["ui:options"].semantic.errorOptions  : defaultSemanticErrorProps,
+    hasOptionsProps ? options.semantic.errorOptions : {}
   );
 }
 
@@ -48,9 +87,9 @@ export function cleanClassNames(classNameArr, omit = []) {
 
 /**
  *
- * @param wrap
+ * @param {boolean} wrap
  * @param Component
- * @param props
+ * @param {Object} props
  * @returns {*}
  * @constructor
  */

From 0d5631508ba294cac63da2306240e7dbf5e85d30 Mon Sep 17 00:00:00 2001
From: Jacques <jacques@trixta.com>
Date: Wed, 5 Aug 2020 20:59:21 +0200
Subject: [PATCH 3/7] update: default semantic props

---
 packages/semantic-ui/package-lock.json        | 171 ++++++++++++++++++
 .../ArrayFieldTemplate/ArrayFieldTemplate.js  |  22 +--
 .../src/CheckboxWidget/CheckboxWidget.js      |  28 +--
 .../src/CheckboxesWidget/CheckboxesWidget.js  |  44 ++---
 .../src/FieldTemplate/FieldTemplate.js        |   5 +-
 .../src/PasswordWidget/PasswordWidget.js      |  69 +++----
 .../src/RadioWidget/RadioWidget.js            |  55 +++---
 .../src/RangeWidget/RangeWidget.js            |  53 +++---
 .../src/SelectWidget/SelectWidget.js          |  65 ++++---
 .../semantic-ui/src/TextWidget/TextWidget.js  |  69 +++----
 .../src/TextareaWidget/TextareaWidget.js      |  61 +++----
 packages/semantic-ui/src/Theme/Theme.js       |   3 +
 .../src/UpDownWidget/UpDownWidget.js          |  66 +++----
 13 files changed, 437 insertions(+), 274 deletions(-)

diff --git a/packages/semantic-ui/package-lock.json b/packages/semantic-ui/package-lock.json
index 146b657f2e..157f2b5265 100644
--- a/packages/semantic-ui/package-lock.json
+++ b/packages/semantic-ui/package-lock.json
@@ -3744,6 +3744,51 @@
         "fastq": "^1.6.0"
       }
     },
+    "@rjsf/core": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@rjsf/core/-/core-2.2.2.tgz",
+      "integrity": "sha512-4d6DHIiTJEkUq5vyl4LIxLGIYYKKnHcprf94oVchUtGQvRFjNUDFxeFQoyr90oaxcBMs2WDDcCgjcFaKVyfErg==",
+      "dev": true,
+      "requires": {
+        "@babel/runtime-corejs2": "^7.8.7",
+        "@types/json-schema": "^7.0.4",
+        "ajv": "^6.7.0",
+        "core-js": "^2.5.7",
+        "json-schema-merge-allof": "^0.6.0",
+        "jsonpointer": "^4.0.1",
+        "lodash": "^4.17.15",
+        "prop-types": "^15.7.2",
+        "react-app-polyfill": "^1.0.4",
+        "react-is": "^16.9.0",
+        "shortid": "^2.2.14"
+      },
+      "dependencies": {
+        "ajv": {
+          "version": "6.12.3",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.3.tgz",
+          "integrity": "sha512-4K0cK3L1hsqk9xIb2z9vs/XU+PGJZ9PNpJRDS9YLzmNdX6jmVPfamLvTJr0aDAusnHyCHO6MjzlkAsgtqp9teA==",
+          "dev": true,
+          "requires": {
+            "fast-deep-equal": "^3.1.1",
+            "fast-json-stable-stringify": "^2.0.0",
+            "json-schema-traverse": "^0.4.1",
+            "uri-js": "^4.2.2"
+          }
+        },
+        "fast-deep-equal": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
+          "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
+          "dev": true
+        },
+        "json-schema-traverse": {
+          "version": "0.4.1",
+          "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+          "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+          "dev": true
+        }
+      }
+    },
     "@samverschueren/stream-to-observable": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/@samverschueren/stream-to-observable/-/stream-to-observable-0.3.0.tgz",
@@ -5987,6 +6032,29 @@
       "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==",
       "dev": true
     },
+    "compute-gcd": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/compute-gcd/-/compute-gcd-1.2.0.tgz",
+      "integrity": "sha1-/B7eW2UAHpUCJlAvRlQ4Y+T+oQ4=",
+      "dev": true,
+      "requires": {
+        "validate.io-array": "^1.0.3",
+        "validate.io-function": "^1.0.2",
+        "validate.io-integer-array": "^1.0.0"
+      }
+    },
+    "compute-lcm": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/compute-lcm/-/compute-lcm-1.1.0.tgz",
+      "integrity": "sha1-q9ltBAtBsKFm+JlEtci3xRHiGtU=",
+      "dev": true,
+      "requires": {
+        "compute-gcd": "^1.2.0",
+        "validate.io-array": "^1.0.3",
+        "validate.io-function": "^1.0.2",
+        "validate.io-integer-array": "^1.0.0"
+      }
+    },
     "concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -11972,6 +12040,26 @@
       "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=",
       "dev": true
     },
+    "json-schema-compare": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/json-schema-compare/-/json-schema-compare-0.2.2.tgz",
+      "integrity": "sha512-c4WYmDKyJXhs7WWvAWm3uIYnfyWFoIp+JEoX34rctVvEkMYCPGhXtvmFFXiffBbxfZsvQ0RNnV5H7GvDF5HCqQ==",
+      "dev": true,
+      "requires": {
+        "lodash": "^4.17.4"
+      }
+    },
+    "json-schema-merge-allof": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/json-schema-merge-allof/-/json-schema-merge-allof-0.6.0.tgz",
+      "integrity": "sha512-LEw4VMQVRceOPLuGRWcxW5orTTiR9ZAtqTAe4rQUjNADTeR81bezBVFa0MqIwp0YmHIM1KkhSjZM7o+IQhaPbQ==",
+      "dev": true,
+      "requires": {
+        "compute-lcm": "^1.1.0",
+        "json-schema-compare": "^0.2.2",
+        "lodash": "^4.17.4"
+      }
+    },
     "json-schema-traverse": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.3.1.tgz",
@@ -11999,6 +12087,12 @@
         "minimist": "^1.2.0"
       }
     },
+    "jsonpointer": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.1.0.tgz",
+      "integrity": "sha512-CXcRvMyTlnR53xMcKnuMzfCA5i/nfblTnnr74CZb6C4vG39eu6w51t7nKmU5MfLfbTgGItliNyjO/ciNPDqClg==",
+      "dev": true
+    },
     "jsprim": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
@@ -16779,6 +16873,15 @@
       "integrity": "sha1-Q2CxfGETatOAeDl/8RQW4Ybc+7g=",
       "dev": true
     },
+    "raf": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
+      "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==",
+      "dev": true,
+      "requires": {
+        "performance-now": "^2.1.0"
+      }
+    },
     "randombytes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@@ -16839,6 +16942,37 @@
         "prop-types": "^15.6.2"
       }
     },
+    "react-app-polyfill": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/react-app-polyfill/-/react-app-polyfill-1.0.6.tgz",
+      "integrity": "sha512-OfBnObtnGgLGfweORmdZbyEz+3dgVePQBb3zipiaDsMHV1NpWm0rDFYIVXFV/AK+x4VIIfWHhrdMIeoTLyRr2g==",
+      "dev": true,
+      "requires": {
+        "core-js": "^3.5.0",
+        "object-assign": "^4.1.1",
+        "promise": "^8.0.3",
+        "raf": "^3.4.1",
+        "regenerator-runtime": "^0.13.3",
+        "whatwg-fetch": "^3.0.0"
+      },
+      "dependencies": {
+        "core-js": {
+          "version": "3.6.5",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz",
+          "integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA==",
+          "dev": true
+        },
+        "promise": {
+          "version": "8.1.0",
+          "resolved": "https://registry.npmjs.org/promise/-/promise-8.1.0.tgz",
+          "integrity": "sha512-W04AqnILOL/sPRXziNicCjSNRruLAuIHEOVBazepu0545DDNGYHz7ar9ZgZ1fMU8/MA4mVxp5rkBWRi6OXIy3Q==",
+          "dev": true,
+          "requires": {
+            "asap": "~2.0.6"
+          }
+        }
+      }
+    },
     "react-codemirror2": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/react-codemirror2/-/react-codemirror2-4.3.0.tgz",
@@ -19296,6 +19430,43 @@
         "builtins": "^1.0.3"
       }
     },
+    "validate.io-array": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/validate.io-array/-/validate.io-array-1.0.6.tgz",
+      "integrity": "sha1-W1osr9j4uFq7L4hroVPy2Tond00=",
+      "dev": true
+    },
+    "validate.io-function": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/validate.io-function/-/validate.io-function-1.0.2.tgz",
+      "integrity": "sha1-NDoZgC7TsZaCaceA5VjpNBHAutc=",
+      "dev": true
+    },
+    "validate.io-integer": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/validate.io-integer/-/validate.io-integer-1.0.5.tgz",
+      "integrity": "sha1-FoSWSAuVviJH7EQ/IjPeT4mHgGg=",
+      "dev": true,
+      "requires": {
+        "validate.io-number": "^1.0.3"
+      }
+    },
+    "validate.io-integer-array": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/validate.io-integer-array/-/validate.io-integer-array-1.0.0.tgz",
+      "integrity": "sha1-LKveAzKTpry+Bj/q/pHq9GsToIk=",
+      "dev": true,
+      "requires": {
+        "validate.io-array": "^1.0.3",
+        "validate.io-integer": "^1.0.4"
+      }
+    },
+    "validate.io-number": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/validate.io-number/-/validate.io-number-1.0.3.tgz",
+      "integrity": "sha1-9j/+2iSL8opnqNSODjtGGhZluvg=",
+      "dev": true
+    },
     "vary": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
diff --git a/packages/semantic-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.js b/packages/semantic-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.js
index 1faaff4287..09e6e40f6a 100644
--- a/packages/semantic-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.js
+++ b/packages/semantic-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.js
@@ -1,6 +1,5 @@
 /* eslint-disable react/prop-types,react/destructuring-assignment */
 import React from "react";
-import PropTypes from "prop-types";
 import { Button, Grid, Segment } from "semantic-ui-react";
 import { utils } from '@rjsf/core';
 import AddButton from "../AddButton";
@@ -231,8 +230,17 @@ function DefaultNormalArrayFieldTemplate({
 }
 
 function ArrayFieldTemplate(props) {
-  const { schema } = props;
-  const { horizontalButtons, wrapItem } = getSemanticProps(props);
+  const { options,
+    schema,
+    uiSchema,
+    formContext, } = props;
+  const semanticProps = getSemanticProps({
+      options,
+      uiSchema,
+      formContext,
+      defaultSchemaProps: { horizontalButtons : false, wrapItem : false }
+  });
+  const  { horizontalButtons, wrapItem } = semanticProps;
   const itemProps = { horizontalButtons, wrapItem };
 
   if (isFixedItems(schema)) {
@@ -241,12 +249,4 @@ function ArrayFieldTemplate(props) {
   return <DefaultNormalArrayFieldTemplate {...props} itemProps={itemProps} />;
 }
 
-ArrayFieldTemplate.defaultProps = {
-  options: {},
-};
-
-ArrayFieldTemplate.propTypes = {
-  options: PropTypes.object,
-};
-
 export default ArrayFieldTemplate;
diff --git a/packages/semantic-ui/src/CheckboxWidget/CheckboxWidget.js b/packages/semantic-ui/src/CheckboxWidget/CheckboxWidget.js
index 53f94a3cf2..4cb1408898 100644
--- a/packages/semantic-ui/src/CheckboxWidget/CheckboxWidget.js
+++ b/packages/semantic-ui/src/CheckboxWidget/CheckboxWidget.js
@@ -6,19 +6,27 @@ import { getSemanticProps } from "../util";
 function CheckboxWidget(props) {
   const {
     id,
+    label,
     value,
     required,
-    disabled,
     readonly,
-    label,
-    autofocus,
+    disabled,
     onChange,
     onBlur,
-    options,
     onFocus,
+    autofocus,
+    options,
+    schema,
+    uiSchema,
     formContext,
   } = props;
-  const semanticProps = getSemanticProps({ formContext, options });
+  const semanticProps = getSemanticProps({
+    options,
+    formContext,
+    schema,
+    uiSchema,
+    defaultSchemaProps: {},
+   });
   const _onChange = (event, data) => onChange && onChange(data.checked);
   const _onBlur = () => onBlur && onBlur(id, value);
   const _onFocus = () => onFocus && onFocus(id, value);
@@ -34,17 +42,9 @@ function CheckboxWidget(props) {
       onBlur={_onBlur}
       onFocus={_onFocus}
       required={required}
-      label={label}
+      label={label || schema.title}
     />
   );
 }
 
-CheckboxWidget.defaultProps = {
-  options: {
-    semantic: {
-      inverted: false,
-    },
-  },
-};
-
 export default CheckboxWidget;
diff --git a/packages/semantic-ui/src/CheckboxesWidget/CheckboxesWidget.js b/packages/semantic-ui/src/CheckboxesWidget/CheckboxesWidget.js
index 0ca5c4ac09..ea58ffb9bd 100644
--- a/packages/semantic-ui/src/CheckboxesWidget/CheckboxesWidget.js
+++ b/packages/semantic-ui/src/CheckboxesWidget/CheckboxesWidget.js
@@ -16,22 +16,30 @@ function deselectValue(value, selected) {
   return selected.filter(v => v !== value);
 }
 
-function CheckboxesWidget({
-  id,
-  disabled,
-  options,
-  value,
-  autofocus,
-  readonly,
-  onChange,
-  onBlur,
-  onFocus,
-  formContext,
-  schema,
-}) {
+function CheckboxesWidget(props) {
+  const {
+    id,
+    value,
+    readonly,
+    disabled,
+    onChange,
+    onBlur,
+    onFocus,
+    autofocus,
+    options,
+    schema,
+    uiSchema,
+    formContext,
+  } = props;
   const { enumOptions, enumDisabled, inline } = options;
   const { title } = schema;
-  const semanticProps = getSemanticProps({ formContext, options });
+  const semanticProps = getSemanticProps({
+    options,
+    formContext,
+    schema,
+    uiSchema,
+    defaultSchemaProps: {},
+   });
   const _onChange = option => ({ target: { checked } }) => {
     // eslint-disable-next-line no-shadow
     const all = enumOptions.map(({ value }) => value);
@@ -73,12 +81,4 @@ function CheckboxesWidget({
   );
 }
 
-CheckboxesWidget.defaultProps = {
-  options: {
-    semantic: {
-      inverted: false,
-    },
-  },
-};
-
 export default CheckboxesWidget;
diff --git a/packages/semantic-ui/src/FieldTemplate/FieldTemplate.js b/packages/semantic-ui/src/FieldTemplate/FieldTemplate.js
index 2da54e0f52..c1c17a490a 100644
--- a/packages/semantic-ui/src/FieldTemplate/FieldTemplate.js
+++ b/packages/semantic-ui/src/FieldTemplate/FieldTemplate.js
@@ -4,7 +4,7 @@ import { Form } from "semantic-ui-react";
 import DescriptionField from "../DescriptionField";
 import HelpField from "../HelpField";
 import RawErrors from "../RawErrors";
-import { getSemanticProps, MaybeWrap } from "../util";
+import { getSemanticProps, getSemanticErrorProps, MaybeWrap } from "../util";
 
 function FieldTemplate({
   id,
@@ -19,7 +19,8 @@ function FieldTemplate({
   ...props
 }) {
   const semanticProps = getSemanticProps(props);
-  const { wrapLabel, wrapContent, errorOptions } = semanticProps;
+  const { wrapLabel, wrapContent } = semanticProps;
+  const errorOptions = getSemanticErrorProps(props);
   return (
     <Form.Group key={id} widths="equal" grouped>
       <MaybeWrap wrap={wrapContent} className="sui-field-content">
diff --git a/packages/semantic-ui/src/PasswordWidget/PasswordWidget.js b/packages/semantic-ui/src/PasswordWidget/PasswordWidget.js
index 6231f3a23a..328bcff662 100644
--- a/packages/semantic-ui/src/PasswordWidget/PasswordWidget.js
+++ b/packages/semantic-ui/src/PasswordWidget/PasswordWidget.js
@@ -1,37 +1,53 @@
 /* eslint-disable react/prop-types */
 import React from "react";
-import PropTypes from "prop-types";
 import { Form } from "semantic-ui-react";
 import { getSemanticProps } from "../util";
+import {  utils } from "@rjsf/core";
 
-function PasswordWidget({
-  id,
-  required,
-  readonly,
-  disabled,
-  label,
-  name,
-  value,
-  onChange,
-  onBlur,
-  onFocus,
-  autofocus,
-  options,
-  schema,
-  formContext,
-}) {
-  const semanticProps = getSemanticProps({ formContext, options });
+const { getDisplayLabel } = utils;
+function PasswordWidget(props) {
+  const {
+    id,
+    required,
+    readonly,
+    disabled,
+    label,
+    name,
+    value,
+    onChange,
+    onBlur,
+    onFocus,
+    autofocus,
+    options,
+    schema,
+    uiSchema,
+    formContext,
+  } = props;
+  const semanticProps = getSemanticProps({
+    schema,
+    uiSchema,
+    formContext,
+    options,
+    defaultSchemaProps: {
+      inverted: false,
+      fluid: true,
+    }
+ });
   // eslint-disable-next-line no-shadow
   const _onChange = ({ target: { value } }) =>
     onChange && onChange(value === "" ? options.emptyValue : value);
   const _onBlur = () => onBlur && onBlur(id, value);
   const _onFocus = () => onFocus && onFocus(id, value);
-
+  const displayLabel = getDisplayLabel(
+    schema,
+    uiSchema
+    /* TODO: , rootSchema */
+  );
   return (
     <Form.Input
       id={id}
       key={id}
-      label={label || schema.title}
+      label={displayLabel ? label || schema.title : false}
       autoFocus={autofocus}
       required={required}
       disabled={disabled || readonly}
@@ -46,17 +62,4 @@ function PasswordWidget({
   );
 }
 
-PasswordWidget.defaultProps = {
-  options: {
-    semantic: {
-      inverted: false,
-      fluid: true,
-    },
-  },
-};
-
-PasswordWidget.propTypes = {
-  options: PropTypes.object,
-};
-
 export default PasswordWidget;
diff --git a/packages/semantic-ui/src/RadioWidget/RadioWidget.js b/packages/semantic-ui/src/RadioWidget/RadioWidget.js
index 95815a9cc9..920c3ee383 100644
--- a/packages/semantic-ui/src/RadioWidget/RadioWidget.js
+++ b/packages/semantic-ui/src/RadioWidget/RadioWidget.js
@@ -1,29 +1,35 @@
 /* eslint-disable react/jsx-no-undef,react/no-array-index-key,react/prop-types */
 import React from "react";
 import { Form, Radio } from "semantic-ui-react";
-import PropTypes from "prop-types";
 import { getSemanticProps } from "../util";
 
-function RadioWidget({
-  id,
-  schema,
-  options,
-  value,
-  required,
-  disabled,
-  readonly,
-  onChange,
-  onBlur,
-  onFocus,
-  formContext,
-}) {
+function RadioWidget(props) {
+  const {
+    id,
+    value,
+    required,
+    disabled,
+    readonly,
+    onChange,
+    onBlur,
+    onFocus,
+    schema,
+    options,
+    formContext,
+    uiSchema,
+  } = props;
   // Generating a unique field name to identify this set of radio buttons
   const name = Math.random().toString();
   const { enumOptions, enumDisabled } = options;
-  const semanticProps = getSemanticProps({ formContext, options });
+  const semanticProps = getSemanticProps(
+    { formContext,
+      options,
+      uiSchema,
+      defaultSchemaProps: {}
+    });
   // eslint-disable-next-line no-shadow
-  const _onChange = (event, { value }) =>
-    onChange && onChange(schema.type === "boolean" ? value !== "false" : value);
+  const _onChange = (event, { value : eventValue }) =>{
+    return onChange &&  onChange(schema.type === "boolean" ? eventValue !== "false" : eventValue);};
   const _onBlur = () => onBlur && onBlur(id, value);
   const _onFocus = () => onFocus && onFocus(id, value);
   const inlineOption = options.inline ? { inline: true } : { grouped: true };
@@ -43,7 +49,7 @@ function RadioWidget({
             label={`${option.label}`}
             value={`${option.value}`}
             key={`${option.value}-${i}`}
-            checked={value === option.value}
+            checked={value == option.value}
             onChange={_onChange}
             disabled={disabled || itemDisabled || readonly}
           />
@@ -53,17 +59,4 @@ function RadioWidget({
   );
 }
 
-RadioWidget.defaultProps = {
-  options: {
-    semantic: {
-      inverted: false,
-      fluid: true,
-    },
-  },
-};
-
-RadioWidget.propTypes = {
-  options: PropTypes.object,
-};
-
 export default RadioWidget;
diff --git a/packages/semantic-ui/src/RangeWidget/RangeWidget.js b/packages/semantic-ui/src/RangeWidget/RangeWidget.js
index 694cd96a85..4073863a1f 100644
--- a/packages/semantic-ui/src/RangeWidget/RangeWidget.js
+++ b/packages/semantic-ui/src/RangeWidget/RangeWidget.js
@@ -1,27 +1,34 @@
 /* eslint-disable react/prop-types */
 import React from "react";
-import PropTypes from "prop-types";
 import { Input } from "semantic-ui-react";
 import { utils } from '@rjsf/core';
 import { getSemanticProps } from "../util";
 
 const { rangeSpec } = utils;
-function RangeWidget({
-  value,
-  readonly,
-  disabled,
-  onBlur,
-  onFocus,
-  options,
-  schema,
-  onChange,
-  required,
-  label,
-  name,
-  id,
-  formContext,
-}) {
-  const semanticProps = getSemanticProps({ formContext, options });
+function RangeWidget(props) {
+  const {
+    id,
+    name,
+    value,
+    required,
+    readonly,
+    disabled,
+    onChange,
+    onBlur,
+    onFocus,
+    options,
+    schema,
+    uiSchema,
+    formContext,
+  } = props;
+  const semanticProps = getSemanticProps(
+    { formContext,
+      options,
+      uiSchema,
+      defaultSchemaProps: {
+        fluid: true,
+      }
+    });
 
   // eslint-disable-next-line no-shadow
   const _onChange = ({ target: { value } }) =>
@@ -50,16 +57,4 @@ function RangeWidget({
   );
 }
 
-RangeWidget.defaultProps = {
-  options: {
-    semantic: {
-      fluid: true,
-    },
-  },
-};
-
-RangeWidget.propTypes = {
-  options: PropTypes.object,
-};
-
 export default RangeWidget;
diff --git a/packages/semantic-ui/src/SelectWidget/SelectWidget.js b/packages/semantic-ui/src/SelectWidget/SelectWidget.js
index 74a6037655..b6a734ae48 100644
--- a/packages/semantic-ui/src/SelectWidget/SelectWidget.js
+++ b/packages/semantic-ui/src/SelectWidget/SelectWidget.js
@@ -3,7 +3,6 @@ import React from "react";
 import _ from "lodash";
 import { Form } from "semantic-ui-react";
 import { utils } from '@rjsf/core';
-import PropTypes from "prop-types";
 import { getSemanticProps } from "../util";
 
 const { asNumber, guessType } = utils;
@@ -59,23 +58,37 @@ const processValue = (schema, value) => {
   return value;
 };
 
-function SelectWidget({
-  schema,
-  id,
-  options,
-  name,
-  required,
-  disabled,
-  readonly,
-  value,
-  multiple,
-  placeholder,
-  autofocus,
-  onChange,
-  onBlur,
-  onFocus,
-}) {
-  const semanticProps = getSemanticProps({ options });
+function SelectWidget(props) {
+  const {
+    schema,
+    uiSchema,
+    formContext,
+    id,
+    options,
+    name,
+    required,
+    disabled,
+    readonly,
+    value,
+    multiple,
+    placeholder,
+    autofocus,
+    onChange,
+    onBlur,
+    onFocus,
+  } = props;
+  const semanticProps = getSemanticProps({
+    schema,
+    uiSchema,
+    formContext,
+    options,
+    defaultSchemaProps:{
+      inverted: "false",
+      selection: true,
+      scrolling: true,
+      upward: false,
+    }
+ });
   const { enumDisabled, enumOptions } = options;
   const emptyValue = multiple ? [] : "";
   const dropdownOptions = createDefaultValueOptionsForDropDown(
@@ -114,20 +127,4 @@ function SelectWidget({
   );
 }
 
-SelectWidget.defaultProps = {
-  options: {
-    semantic: {
-      inverted: "false",
-      fluid: true,
-      selection: true,
-      scrolling: true,
-      upward: false,
-    },
-  },
-};
-
-SelectWidget.propTypes = {
-  options: PropTypes.object,
-};
-
 export default SelectWidget;
diff --git a/packages/semantic-ui/src/TextWidget/TextWidget.js b/packages/semantic-ui/src/TextWidget/TextWidget.js
index 6eec0bd040..7e5a343932 100644
--- a/packages/semantic-ui/src/TextWidget/TextWidget.js
+++ b/packages/semantic-ui/src/TextWidget/TextWidget.js
@@ -1,37 +1,53 @@
 /* eslint-disable react/prop-types */
 import React from "react";
-import PropTypes from "prop-types";
 import { Form } from "semantic-ui-react";
 import { getSemanticProps } from "../util";
+import {  utils } from "@rjsf/core";
 
-function TextWidget({
-  id,
-  required,
-  readonly,
-  disabled,
-  name,
-  label,
-  schema,
-  value,
-  onChange,
-  onBlur,
-  onFocus,
-  autofocus,
-  options,
-  formContext,
-}) {
-  const semanticProps = getSemanticProps({ formContext, options });
+const { getDisplayLabel } = utils;
+function TextWidget(props) {
+  const {
+    id,
+    name,
+    label,
+    value,
+    required,
+    readonly,
+    disabled,
+    onChange,
+    onBlur,
+    onFocus,
+    autofocus,
+    options,
+    type,
+    schema,
+    uiSchema,
+    formContext,
+  } = props;
+  const semanticProps = getSemanticProps(
+    { formContext, options,
+      uiSchema,
+      defaultSchemaProps: {
+        fluid: true,
+        inverted: false,
+    }
+  });
   // eslint-disable-next-line no-shadow
   const _onChange = ({ target: { value } }) =>
     onChange(value === "" ? options.emptyValue : value);
   const _onBlur = () => onBlur && onBlur(id, value);
   const _onFocus = () => onFocus && onFocus(id, value);
+  const displayLabel = getDisplayLabel(
+    schema,
+    uiSchema
+    /* TODO: , rootSchema */
+  );
   return (
     <Form.Input
       key={id}
       id={id}
-      type={schema.type}
-      label={schema.title || label}
+      type={type || schema.type}
+      label={displayLabel ? label || schema.title : false}
       required={required}
       autoFocus={autofocus}
       disabled={disabled || readonly}
@@ -45,17 +61,4 @@ function TextWidget({
   );
 }
 
-TextWidget.defaultProps = {
-  options: {
-    semantic: {
-      fluid: true,
-      inverted: false,
-    },
-  },
-};
-
-TextWidget.propTypes = {
-  options: PropTypes.object,
-};
-
 export default TextWidget;
diff --git a/packages/semantic-ui/src/TextareaWidget/TextareaWidget.js b/packages/semantic-ui/src/TextareaWidget/TextareaWidget.js
index 187d3beefc..59b0414653 100644
--- a/packages/semantic-ui/src/TextareaWidget/TextareaWidget.js
+++ b/packages/semantic-ui/src/TextareaWidget/TextareaWidget.js
@@ -1,38 +1,45 @@
 /* eslint-disable react/prop-types */
 import React from "react";
-import PropTypes from "prop-types";
 import { Form } from "semantic-ui-react";
 import { getSemanticProps } from "../util";
+import {  utils } from "@rjsf/core";
 
-function TextareaWidget({
-  id,
-  placeholder,
-  value,
-  required,
-  disabled,
-  autofocus,
-  label,
-  name,
-  readonly,
-  onBlur,
-  onFocus,
-  onChange,
-  options,
-  schema,
-  formContext,
-}) {
-  const semanticProps = getSemanticProps({ formContext, options });
+const { getDisplayLabel } = utils;
+function TextareaWidget(props) {
+  const {
+    id,
+    placeholder,
+    value,
+    required,
+    disabled,
+    autofocus,
+    label,
+    name,
+    readonly,
+    onBlur,
+    onFocus,
+    onChange,
+    options,
+    schema,
+    uiSchema,
+    formContext,
+  } = props;
+  const semanticProps = getSemanticProps({ formContext, options, defaultSchemaProps: {} });
   // eslint-disable-next-line no-shadow
   const _onChange = ({ target: { value } }) =>
     onChange && onChange(value === "" ? options.emptyValue : value);
   const _onBlur = () => onBlur && onBlur(id, value);
   const _onFocus = () => onFocus && onFocus(id, value);
-
+  const displayLabel = getDisplayLabel(
+    schema,
+    uiSchema
+    /* TODO: , rootSchema */
+  );
   return (
     <Form.TextArea
       id={id}
       key={id}
-      label={schema.title || label}
+      label={displayLabel ? label || schema.title : false}
       placeholder={placeholder}
       autoFocus={autofocus}
       required={required}
@@ -48,16 +55,4 @@ function TextareaWidget({
   );
 }
 
-TextareaWidget.defaultProps = {
-  options: {
-    semantic: {
-      inverted: false,
-    },
-  },
-};
-
-TextareaWidget.propTypes = {
-  options: PropTypes.object,
-};
-
 export default TextareaWidget;
diff --git a/packages/semantic-ui/src/Theme/Theme.js b/packages/semantic-ui/src/Theme/Theme.js
index f57f686eeb..d086674893 100644
--- a/packages/semantic-ui/src/Theme/Theme.js
+++ b/packages/semantic-ui/src/Theme/Theme.js
@@ -1,5 +1,7 @@
+import React from 'react';
 import { utils } from '@rjsf/core';
 import { Form as SuiForm } from "semantic-ui-react";
+import SubmitButton from '../SubmitButton';
 import ArrayFieldTemplate from "../ArrayFieldTemplate";
 import ErrorList from "../ErrorList";
 import Fields from "../Fields";
@@ -17,6 +19,7 @@ const Theme = {
   ObjectFieldTemplate,
   tagName: SuiForm,
   widgets: { ...widgets, ...Widgets },
+  children: React.createElement(SubmitButton)
 };
 
 export default Theme;
diff --git a/packages/semantic-ui/src/UpDownWidget/UpDownWidget.js b/packages/semantic-ui/src/UpDownWidget/UpDownWidget.js
index c940d39dd5..0edaffc374 100644
--- a/packages/semantic-ui/src/UpDownWidget/UpDownWidget.js
+++ b/packages/semantic-ui/src/UpDownWidget/UpDownWidget.js
@@ -1,31 +1,46 @@
 /* eslint-disable react/prop-types */
 import React from "react";
-import PropTypes from "prop-types";
 import { Form } from "semantic-ui-react";
 import { getSemanticProps } from
 '../util';
+import {  utils } from "@rjsf/core";
 
-function UpDownWidget({
-  id,
-  required,
-  readonly,
-  disabled,
-  label,
-  name,
-  value,
-  options,
-  onChange,
-  onBlur,
-  onFocus,
-  autofocus,
-  rawErrors,
-  formContext,
-}) {
-  const semanticProps = getSemanticProps({ formContext, options });
+const { getDisplayLabel } = utils;
+function UpDownWidget(props) {
+  const {
+    id,
+    name,
+    label,
+    value,
+    required,
+    readonly,
+    disabled,
+    onChange,
+    onBlur,
+    onFocus,
+    autofocus,
+    options,
+    schema,
+    uiSchema,
+    formContext,
+  } = props;
+  const semanticProps = getSemanticProps(
+    { formContext, options,
+      uiSchema,
+      defaultSchemaProps: {
+        fluid: true,
+        inverted: false,
+    }
+  });
   // eslint-disable-next-line no-shadow
   const _onChange = ({ target: { value } }) => onChange && onChange(value);
   const _onBlur = () => onBlur && onBlur(id, value);
   const _onFocus = () => onFocus && onFocus(id, value);
+  const displayLabel = getDisplayLabel(
+    schema,
+    uiSchema
+    /* TODO: , rootSchema */
+  );
   return (
     <React.Fragment>
       <Form.Input
@@ -34,7 +49,7 @@ function UpDownWidget({
         autoFocus={autofocus}
         required={required}
         type="number"
-        label={label}
+        label={displayLabel ? label || schema.title : false}
         disabled={disabled || readonly}
         name={name}
         {...semanticProps}
@@ -47,17 +62,4 @@ function UpDownWidget({
   );
 }
 
-UpDownWidget.defaultProps = {
-  options: {
-    semantic: {
-      inverted: false,
-      fluid: true,
-    },
-  },
-};
-
-UpDownWidget.propTypes = {
-  options: PropTypes.object,
-};
-
 export default UpDownWidget;

From a122854aef9bb4ae786ac1de87ee6b50af10679a Mon Sep 17 00:00:00 2001
From: Jacques <jacques@trixta.com>
Date: Wed, 5 Aug 2020 21:58:58 +0200
Subject: [PATCH 4/7] update: tests

---
 .../test/__snapshots__/Array.test.js.snap     |  47 +++--
 .../test/__snapshots__/Form.test.js.snap      | 167 +++++++++---------
 .../test/__snapshots__/Object.test.js.snap    |  15 +-
 packages/semantic-ui/test/util.test.js        |   2 +-
 4 files changed, 113 insertions(+), 118 deletions(-)

diff --git a/packages/semantic-ui/test/__snapshots__/Array.test.js.snap b/packages/semantic-ui/test/__snapshots__/Array.test.js.snap
index 5881a01524..e163042a6c 100644
--- a/packages/semantic-ui/test/__snapshots__/Array.test.js.snap
+++ b/packages/semantic-ui/test/__snapshots__/Array.test.js.snap
@@ -40,14 +40,13 @@ exports[`array fields array 1`] = `
       </div>
     </div>
   </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
 
@@ -68,7 +67,7 @@ exports[`array fields checkboxes 1`] = `
         aria-expanded={false}
         aria-multiselectable={true}
         autoFocus={false}
-        className="ui fluid multiple selection scrolling dropdown"
+        className="ui multiple selection scrolling dropdown"
         inverted="false"
         onBlur={[Function]}
         onChange={[Function]}
@@ -155,14 +154,13 @@ exports[`array fields checkboxes 1`] = `
       </div>
     </div>
   </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
 
@@ -270,13 +268,12 @@ exports[`array fields fixed array 1`] = `
       </div>
     </div>
   </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
diff --git a/packages/semantic-ui/test/__snapshots__/Form.test.js.snap b/packages/semantic-ui/test/__snapshots__/Form.test.js.snap
index dcd22da680..0d7581fed2 100644
--- a/packages/semantic-ui/test/__snapshots__/Form.test.js.snap
+++ b/packages/semantic-ui/test/__snapshots__/Form.test.js.snap
@@ -9,14 +9,13 @@ exports[`single fields null field 1`] = `
   <div
     className="grouped equal width fields"
   />
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
 
@@ -48,14 +47,13 @@ exports[`single fields number field 1`] = `
       </div>
     </div>
   </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
 
@@ -81,14 +79,13 @@ exports[`single fields string field format data-url 1`] = `
       </p>
     </div>
   </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
 
@@ -101,30 +98,32 @@ exports[`single fields string field format email 1`] = `
   <div
     className="grouped equal width fields"
   >
-    <input
-      autoFocus={false}
-      className="form-control"
-      disabled={false}
-      id="root"
-      list={null}
-      onBlur={[Function]}
-      onChange={[Function]}
-      onFocus={[Function]}
-      placeholder=""
-      readOnly={false}
-      required={false}
-      type="email"
-      value=""
-    />
-  </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
+    <div
+      className="field"
     >
-      Submit
-    </button>
+      <div
+        className="ui fluid input"
+      >
+        <input
+          autoFocus={false}
+          disabled={false}
+          id="root"
+          onBlur={[Function]}
+          onChange={[Function]}
+          onFocus={[Function]}
+          type="email"
+          value=""
+        />
+      </div>
+    </div>
   </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
 
@@ -137,30 +136,32 @@ exports[`single fields string field format uri 1`] = `
   <div
     className="grouped equal width fields"
   >
-    <input
-      autoFocus={false}
-      className="form-control"
-      disabled={false}
-      id="root"
-      list={null}
-      onBlur={[Function]}
-      onChange={[Function]}
-      onFocus={[Function]}
-      placeholder=""
-      readOnly={false}
-      required={false}
-      type="url"
-      value=""
-    />
-  </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
+    <div
+      className="field"
     >
-      Submit
-    </button>
+      <div
+        className="ui fluid input"
+      >
+        <input
+          autoFocus={false}
+          disabled={false}
+          id="root"
+          onBlur={[Function]}
+          onChange={[Function]}
+          onFocus={[Function]}
+          type="url"
+          value=""
+        />
+      </div>
+    </div>
   </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
 
@@ -192,14 +193,13 @@ exports[`single fields string field regular 1`] = `
       </div>
     </div>
   </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
 
@@ -235,13 +235,12 @@ exports[`single fields unsupported field 1`] = `
       </pre>
     </div>
   </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
diff --git a/packages/semantic-ui/test/__snapshots__/Object.test.js.snap b/packages/semantic-ui/test/__snapshots__/Object.test.js.snap
index 3b59e747c4..f2a7618faf 100644
--- a/packages/semantic-ui/test/__snapshots__/Object.test.js.snap
+++ b/packages/semantic-ui/test/__snapshots__/Object.test.js.snap
@@ -66,13 +66,12 @@ exports[`object fields object 1`] = `
       </div>
     </div>
   </div>
-  <div>
-    <button
-      className="btn btn-info"
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
 </form>
 `;
diff --git a/packages/semantic-ui/test/util.test.js b/packages/semantic-ui/test/util.test.js
index d15e55c409..066415b627 100644
--- a/packages/semantic-ui/test/util.test.js
+++ b/packages/semantic-ui/test/util.test.js
@@ -1,4 +1,4 @@
-const { getSemanticProps,getSemanticErrorProps } = require("../src/util");
+import { getSemanticProps,getSemanticErrorProps } from '../src/util';
 
 
 describe("util js functions", () => {

From cc640d106f50e8946b5871383e9856c277fd2da5 Mon Sep 17 00:00:00 2001
From: Jacques <jacques@trixta.com>
Date: Wed, 12 Aug 2020 19:26:35 +0200
Subject: [PATCH 5/7] update: select widget label

---
 packages/semantic-ui/src/SelectWidget/SelectWidget.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/packages/semantic-ui/src/SelectWidget/SelectWidget.js b/packages/semantic-ui/src/SelectWidget/SelectWidget.js
index b6a734ae48..db13527371 100644
--- a/packages/semantic-ui/src/SelectWidget/SelectWidget.js
+++ b/packages/semantic-ui/src/SelectWidget/SelectWidget.js
@@ -66,6 +66,7 @@ function SelectWidget(props) {
     id,
     options,
     name,
+    label,
     required,
     disabled,
     readonly,
@@ -107,10 +108,12 @@ function SelectWidget(props) {
     // eslint-disable-next-line no-shadow
     target: { value },
   }) => onFocus && onFocus(id, processValue(schema, value));
+
   return (
     <Form.Dropdown
       key={id}
       name={name}
+      label={label || schema.title}
       multiple={typeof multiple === "undefined" ? false : multiple}
       value={typeof value === "undefined" ? emptyValue : value}
       disabled={disabled}

From a241e8ba1c8d57e1bcf190203b75472286aa3c52 Mon Sep 17 00:00:00 2001
From: Jacques <jacques@trixta.com>
Date: Mon, 14 Sep 2020 12:37:03 +0200
Subject: [PATCH 6/7] update: formContext props override others update:
 semantic

---
 .../themes/semantic-ui/uiSchema.md            |  1 -
 packages/semantic-ui/package-lock.json        | 12 +++++-----
 packages/semantic-ui/package.json             |  4 ++--
 packages/semantic-ui/src/util.js              | 15 +++++++++---
 packages/semantic-ui/test/util.test.js        | 24 +++++++++++++++++++
 5 files changed, 44 insertions(+), 12 deletions(-)

diff --git a/docs/api-reference/themes/semantic-ui/uiSchema.md b/docs/api-reference/themes/semantic-ui/uiSchema.md
index 91dc5706a6..bc3f8fb257 100644
--- a/docs/api-reference/themes/semantic-ui/uiSchema.md
+++ b/docs/api-reference/themes/semantic-ui/uiSchema.md
@@ -110,7 +110,6 @@ wrapLabel: wrap all labels in a div, for custom styling via CSS
       "wrapLabel": true,
       "wrapContent": true
     }
-    uiSchema={uiSchema}
   // other props...
   }}
 />
diff --git a/packages/semantic-ui/package-lock.json b/packages/semantic-ui/package-lock.json
index 260668383c..849310d802 100644
--- a/packages/semantic-ui/package-lock.json
+++ b/packages/semantic-ui/package-lock.json
@@ -3745,9 +3745,9 @@
       }
     },
     "@rjsf/core": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@rjsf/core/-/core-2.2.2.tgz",
-      "integrity": "sha512-4d6DHIiTJEkUq5vyl4LIxLGIYYKKnHcprf94oVchUtGQvRFjNUDFxeFQoyr90oaxcBMs2WDDcCgjcFaKVyfErg==",
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/@rjsf/core/-/core-2.4.0.tgz",
+      "integrity": "sha512-8zlydBkGldOxGXFEwNGFa1gzTxpcxaYn7ofegcu8XHJ7IKMCfpnU3ABg+H3eml1KZCX3FODmj1tHFJKuTmfynw==",
       "dev": true,
       "requires": {
         "@babel/runtime-corejs2": "^7.8.7",
@@ -3764,9 +3764,9 @@
       },
       "dependencies": {
         "ajv": {
-          "version": "6.12.3",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.3.tgz",
-          "integrity": "sha512-4K0cK3L1hsqk9xIb2z9vs/XU+PGJZ9PNpJRDS9YLzmNdX6jmVPfamLvTJr0aDAusnHyCHO6MjzlkAsgtqp9teA==",
+          "version": "6.12.5",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.5.tgz",
+          "integrity": "sha512-lRF8RORchjpKG50/WFf8xmg7sgCLFiYNNnqdKflk63whMQcWR5ngGjiSXkL9bjxy6B2npOK2HSMN49jEBMSkag==",
           "dev": true,
           "requires": {
             "fast-deep-equal": "^3.1.1",
diff --git a/packages/semantic-ui/package.json b/packages/semantic-ui/package.json
index 3be6add0d2..639fdba118 100644
--- a/packages/semantic-ui/package.json
+++ b/packages/semantic-ui/package.json
@@ -31,8 +31,8 @@
     "@rjsf/core": "^2.0.0",
     "lodash": "^4.17.15",
     "react": ">=16",
-    "semantic-ui-css": "^2.4.1",
-    "semantic-ui-react": "^0.87.3",
+    "semantic-ui-css": "2.4.1",
+    "semantic-ui-react": "1.2.1",
     "shortid": "^2.2.14"
   },
   "devDependencies": {
diff --git a/packages/semantic-ui/src/util.js b/packages/semantic-ui/src/util.js
index f4dee505fc..4d1bdfd808 100644
--- a/packages/semantic-ui/src/util.js
+++ b/packages/semantic-ui/src/util.js
@@ -22,12 +22,21 @@ export function getSemanticProps({
    const hasFormContextProps = formContext.semantic  ? true : false;
    const hasSchemaProps = uiSchema["ui:options"] && uiSchema["ui:options"].semantic ? true : false;
    const hasOptionsProps = options.semantic  ? true : false;
+   const formContextProps = hasFormContextProps ? formContext.semantic : defaultContextProps;
+   let schemaProps = hasSchemaProps ? uiSchema["ui:options"].semantic : defaultSchemaProps;
+   let optionProps = hasOptionsProps ? options.semantic : {};
+   // formContext props should overide other props
+   if (hasFormContextProps){
+     Object.keys(formContext.semantic).map((key) => {
+      optionProps[key] = formContext.semantic[key];
+     });
+   }
 
   return Object.assign(
     {},
-    hasFormContextProps ? formContext.semantic : defaultContextProps,
-    hasSchemaProps ? uiSchema["ui:options"].semantic : defaultSchemaProps,
-    hasOptionsProps ? options.semantic : {},
+    formContextProps,
+    schemaProps,
+    optionProps,
   );
 }
 
diff --git a/packages/semantic-ui/test/util.test.js b/packages/semantic-ui/test/util.test.js
index 066415b627..c25cf5c432 100644
--- a/packages/semantic-ui/test/util.test.js
+++ b/packages/semantic-ui/test/util.test.js
@@ -30,6 +30,30 @@ describe("util js functions", () => {
           "horizontalButtons": true
         });
       });
+
+
+      test("formContext semantic props if passed should overwrite ui:options", () => {
+        const uiSchema = {
+          "ui:options": {
+            "semantic": {
+              "wrapItem": true,
+              "inverted": false,
+              "horizontalButtons": false
+            }
+          }
+        };
+        const formContext = { semantic:{
+          "inverted": true,
+          "horizontalButtons": true
+        }
+        };
+        expect(getSemanticProps({ uiSchema,formContext, defaultSchemaProps:{ wrapItem: false , horizontalButtons: true } })).toEqual({
+          "wrapItem": true,
+          "inverted": true,
+          "horizontalButtons": true
+        });
+      });
+
   });
 
   describe("getSemanticErrorProps", () => {

From 9f54345469bfe3ce06ad63fa31ec4918932526b3 Mon Sep 17 00:00:00 2001
From: Jacques Nel <jacqueswho@gmail.com>
Date: Mon, 1 Feb 2021 11:15:52 +0200
Subject: [PATCH 7/7] remove unused type prop

---
 packages/semantic-ui/src/TextWidget/TextWidget.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/semantic-ui/src/TextWidget/TextWidget.js b/packages/semantic-ui/src/TextWidget/TextWidget.js
index ea359b5112..e49ce5c639 100644
--- a/packages/semantic-ui/src/TextWidget/TextWidget.js
+++ b/packages/semantic-ui/src/TextWidget/TextWidget.js
@@ -19,7 +19,6 @@ function TextWidget(props) {
     onFocus,
     autofocus,
     options,
-    type,
     schema,
     uiSchema,
     formContext,