diff --git a/packages/core/src/Label/Label.js b/packages/core/src/Label/Label.js
index 5008c21a0c..b2a4cda342 100644
--- a/packages/core/src/Label/Label.js
+++ b/packages/core/src/Label/Label.js
@@ -1,8 +1,10 @@
 import React from 'react'
 import cx from 'classnames'
 import css from 'styled-jsx/css'
+
 import propTypes from '@dhis2/prop-types'
-import { Required } from './Required.js'
+
+import { Required } from '../Required/Required.js'
 
 const styles = css`
     label {
diff --git a/packages/core/src/Label/Required.js b/packages/core/src/Required/Required.js
similarity index 100%
rename from packages/core/src/Label/Required.js
rename to packages/core/src/Required/Required.js
diff --git a/packages/core/src/ToggleField/AddRequired.js b/packages/core/src/ToggleField/AddRequired.js
deleted file mode 100644
index e6ca50bce3..0000000000
--- a/packages/core/src/ToggleField/AddRequired.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import propTypes from '@dhis2/prop-types'
-import React from 'react'
-import { Required } from '../Label/Required.js'
-
-export const AddRequired = ({ label, required, dataTest }) => (
-    <React.Fragment>
-        {label}
-        {required && <Required dataTest={`${dataTest}-required`} />}
-    </React.Fragment>
-)
-
-AddRequired.propTypes = {
-    dataTest: propTypes.string,
-    label: propTypes.node,
-    required: propTypes.bool,
-}
diff --git a/packages/core/src/ToggleField/ToggleField.js b/packages/core/src/ToggleField/ToggleField.js
deleted file mode 100644
index 8178f56e6a..0000000000
--- a/packages/core/src/ToggleField/ToggleField.js
+++ /dev/null
@@ -1,123 +0,0 @@
-import propTypes from '@dhis2/prop-types'
-import React from 'react'
-
-import { statusPropType } from '../common-prop-types.js'
-import { Field } from '../Field/Field.js'
-import { Help } from '../Help/Help.js'
-import { AddRequired } from './AddRequired.js'
-
-const ToggleField = ({
-    value,
-    label,
-    name,
-    className,
-    tabIndex,
-    onChange,
-    onFocus,
-    onBlur,
-    checked,
-    disabled,
-    valid,
-    warning,
-    error,
-    dense,
-    initialFocus,
-    required,
-    helpText,
-    validationText,
-    dataTest,
-    toggleComponent: ToggleComponent,
-}) => (
-    <Field className={className} dataTest={dataTest}>
-        <ToggleComponent
-            value={value}
-            label={
-                <AddRequired
-                    label={label}
-                    required={required}
-                    dataTest={dataTest}
-                />
-            }
-            name={name}
-            tabIndex={tabIndex}
-            onChange={onChange}
-            onFocus={onFocus}
-            onBlur={onBlur}
-            checked={checked}
-            disabled={disabled}
-            valid={valid}
-            warning={warning}
-            error={error}
-            dense={dense}
-            initialFocus={initialFocus}
-        />
-
-        {helpText && <Help dataTest={`${dataTest}-help`}>{helpText}</Help>}
-
-        {validationText && (
-            <Help
-                error={error}
-                warning={warning}
-                valid={valid}
-                dataTest={`${dataTest}-validation`}
-            >
-                {validationText}
-            </Help>
-        )}
-    </Field>
-)
-
-ToggleField.defaultProps = {
-    dataTest: 'dhis2-uicore-togglefield',
-}
-
-/**
- * @typedef {Object} PropTypes
- * @static
- * @private
- *
- * @prop {string} [value]
- * @prop {Node} [label]
- * @prop {string} [name]
- * @prop {string} [className]
- * @prop {string} [tabIndex]
- * @prop {function} [onChange]
- * @prop {function} [onFocus]
- * @prop {function} [onBlur]
- * @prop {boolean} [checked]
- * @prop {boolean} [disabled]
- * @prop {boolean} [valid] - `valid`, `warning`, `error`, `loading`, are mutually exclusive
- * @prop {boolean} [warning]
- * @prop {boolean} [error]
- * @prop {boolean} [dense]
- * @prop {boolean} [initialFocus]
- * @prop {boolean} [required]
- * @prop {string} [helpText]
- * @prop {string} [validationText]
- * @prop {function} toggleComponent
- * @prop {string} [dataTest]
- */
-ToggleField.propTypes = {
-    toggleComponent: propTypes.func.isRequired,
-    checked: propTypes.bool,
-    className: propTypes.string,
-    dataTest: propTypes.string,
-    dense: propTypes.bool,
-    disabled: propTypes.bool,
-    error: statusPropType,
-    helpText: propTypes.string,
-    initialFocus: propTypes.bool,
-    label: propTypes.node,
-    name: propTypes.string,
-    required: propTypes.bool,
-    tabIndex: propTypes.string,
-    valid: statusPropType,
-    validationText: propTypes.string,
-    value: propTypes.string,
-    warning: statusPropType,
-    onBlur: propTypes.func,
-    onChange: propTypes.func,
-    onFocus: propTypes.func,
-}
-
-export { ToggleField }
diff --git a/packages/core/src/index.js b/packages/core/src/index.js
index d018f986b6..5ccee68dd9 100644
--- a/packages/core/src/index.js
+++ b/packages/core/src/index.js
@@ -50,6 +50,7 @@ export { Node } from './Node/Node.js'
 export { Popover } from './Popover/Popover.js'
 export { Popper } from './Popper/Popper.js'
 export { Radio } from './Radio/Radio.js'
+export { Required } from './Required/Required.js'
 export { ScreenCover } from './ScreenCover/ScreenCover.js'
 export { SingleSelect } from './SingleSelect/SingleSelect.js'
 export { SingleSelectOption } from './SingleSelectOption/SingleSelectOption.js'
diff --git a/packages/widgets/src/CheckboxField/CheckboxField.js b/packages/widgets/src/CheckboxField/CheckboxField.js
index 974744ddcf..215090d4e2 100644
--- a/packages/widgets/src/CheckboxField/CheckboxField.js
+++ b/packages/widgets/src/CheckboxField/CheckboxField.js
@@ -1,13 +1,25 @@
 import React from 'react'
 import propTypes from '@dhis2/prop-types'
 
-import { ToggleField, Checkbox } from '@dhis2/ui-core'
+import { Field, Help, Checkbox, Required } from '@dhis2/ui-core'
 
-export const statusPropType = propTypes.mutuallyExclusive(
+const statusPropType = propTypes.mutuallyExclusive(
     ['valid', 'warning', 'error'],
     propTypes.bool
 )
 
+const AddRequired = ({ label, required, dataTest }) => (
+    <React.Fragment>
+        {label}
+        {required && <Required dataTest={`${dataTest}-required`} />}
+    </React.Fragment>
+)
+AddRequired.propTypes = {
+    dataTest: propTypes.string,
+    label: propTypes.node,
+    required: propTypes.bool,
+}
+
 /**
  * @module
  * @param {CheckboxField.PropTypes} props
@@ -40,28 +52,43 @@ const CheckboxField = ({
     validationText,
     dataTest,
 }) => (
-    <ToggleField
-        value={value}
-        label={label}
-        name={name}
-        className={className}
-        toggleComponent={Checkbox}
-        tabIndex={tabIndex}
-        onChange={onChange}
-        onFocus={onFocus}
-        onBlur={onBlur}
-        checked={checked}
-        disabled={disabled}
-        valid={valid}
-        warning={warning}
-        error={error}
-        dense={dense}
-        initialFocus={initialFocus}
-        required={required}
-        helpText={helpText}
-        validationText={validationText}
-        dataTest={dataTest}
-    />
+    <Field className={className} dataTest={dataTest}>
+        <Checkbox
+            value={value}
+            label={
+                <AddRequired
+                    label={label}
+                    required={required}
+                    dataTest={dataTest}
+                />
+            }
+            name={name}
+            tabIndex={tabIndex}
+            onChange={onChange}
+            onFocus={onFocus}
+            onBlur={onBlur}
+            checked={checked}
+            disabled={disabled}
+            valid={valid}
+            warning={warning}
+            error={error}
+            dense={dense}
+            initialFocus={initialFocus}
+        />
+
+        {helpText && <Help dataTest={`${dataTest}-help`}>{helpText}</Help>}
+
+        {validationText && (
+            <Help
+                error={error}
+                warning={warning}
+                valid={valid}
+                dataTest={`${dataTest}-validation`}
+            >
+                {validationText}
+            </Help>
+        )}
+    </Field>
 )
 
 CheckboxField.defaultProps = {
diff --git a/packages/widgets/src/SwitchField/SwitchField.js b/packages/widgets/src/SwitchField/SwitchField.js
index de34ed99c4..b2afc46895 100644
--- a/packages/widgets/src/SwitchField/SwitchField.js
+++ b/packages/widgets/src/SwitchField/SwitchField.js
@@ -1,15 +1,25 @@
 import React from 'react'
 import propTypes from '@dhis2/prop-types'
 
-import { Switch } from '@dhis2/ui-core'
-
-import { ToggleField } from '../ToggleField/ToggleField.js'
+import { Field, Switch, Help, Required } from '@dhis2/ui-core'
 
 const statusPropType = propTypes.mutuallyExclusive(
     ['valid', 'warning', 'error'],
     propTypes.bool
 )
 
+const AddRequired = ({ label, required, dataTest }) => (
+    <React.Fragment>
+        {label}
+        {required && <Required dataTest={`${dataTest}-required`} />}
+    </React.Fragment>
+)
+AddRequired.propTypes = {
+    dataTest: propTypes.string,
+    label: propTypes.node,
+    required: propTypes.bool,
+}
+
 /**
  * @module
  * @param {SwitchField.PropTypes} props
@@ -42,28 +52,43 @@ const SwitchField = ({
     validationText,
     dataTest,
 }) => (
-    <ToggleField
-        toggleComponent={Switch}
-        value={value}
-        label={label}
-        name={name}
-        className={className}
-        tabIndex={tabIndex}
-        onChange={onChange}
-        onFocus={onFocus}
-        onBlur={onBlur}
-        checked={checked}
-        disabled={disabled}
-        valid={valid}
-        warning={warning}
-        error={error}
-        dense={dense}
-        initialFocus={initialFocus}
-        required={required}
-        helpText={helpText}
-        validationText={validationText}
-        dataTest={dataTest}
-    />
+    <Field className={className} dataTest={dataTest}>
+        <Switch
+            value={value}
+            label={
+                <AddRequired
+                    label={label}
+                    required={required}
+                    dataTest={dataTest}
+                />
+            }
+            name={name}
+            tabIndex={tabIndex}
+            onChange={onChange}
+            onFocus={onFocus}
+            onBlur={onBlur}
+            checked={checked}
+            disabled={disabled}
+            valid={valid}
+            warning={warning}
+            error={error}
+            dense={dense}
+            initialFocus={initialFocus}
+        />
+
+        {helpText && <Help dataTest={`${dataTest}-help`}>{helpText}</Help>}
+
+        {validationText && (
+            <Help
+                error={error}
+                warning={warning}
+                valid={valid}
+                dataTest={`${dataTest}-validation`}
+            >
+                {validationText}
+            </Help>
+        )}
+    </Field>
 )
 
 SwitchField.defaultProps = {