diff --git a/docs/operate/customize/metadata/custom_fields/widgets.md b/docs/operate/customize/metadata/custom_fields/widgets.md
index c4d866f6..2de8f2af 100644
--- a/docs/operate/customize/metadata/custom_fields/widgets.md
+++ b/docs/operate/customize/metadata/custom_fields/widgets.md
@@ -4,6 +4,28 @@ _Introduced in v10_
The following document is a reference guide for all the React UI widgets available for custom fields.
+## Common props
+
+These props are applicable to all widgets. In the reference below, only props additional to these are shown for each widget.
+
+- **fieldPath** `String` _required_: The path to the field e.g. `cern:experiment`.
+
+- **label** `String` _required_: The label for the element's display. This is used whenever the field should be displayed e.g. upload form, landing page etc.
+
+- **labelIcon** `String` _optional_: The optional icon that your field might have. The value should be one of the [Semantic UI icons](https://react.semantic-ui.com/elements/icon/).
+ - Previously known as **icon**.
+
+- **placeholder** `String`: The placeholder for the element's display. You should fill this in with an example value.
+
+- **helpText** `String` _required_: The description for the element's display. You should provide useful information on how the users should fill this field in.
+ - Previously known as **description**.
+
+- **required** `Boolean` _optional_: Define if the field should be required i.e. display the `*` symbol.
+
+- **disabled** `Boolean` _optional_: Define if the field should be displayed as disabled thus no input can be filled.
+
+- **hidden** `Boolean` _optional_: Define if the field should be hidden completely. Hiding a field will still retain any value that it already contained.
+
## Input
An input field for a single string value.
@@ -14,29 +36,13 @@ An input field for a single string value.
```
-### Props
-
-- **fieldPath** `String` _required_: The path to the field e.g. `cern:experiment`.
-
-- **label** `String` _required_: The label for the element's display. This is used whenever the field should be displayed e.g. upload form, landing page etc.
-
-- **placeholder** `String` _required_: The placeholder for the element's display. You should fill this in with an example value.
-
-- **description** `String` _required_: The description for the element's display. You should provide useful information on how the users should fill this field in.
-
-- **icon** `String` _optional_: The optional icon that your field might have. The value should be one of the [Semantic UI icons](https://react.semantic-ui.com/elements/icon/).
-
-- **required** `Boolean` _optional_: Define if the field should be required i.e. display the `*` symbol.
-
-- **disabled** `Boolean` _optional_: Define if the field should be displayed as disabled thus no input can be filled.
-
## NumberInput
An input field for numbers e.g. integers, float etc.
@@ -47,29 +53,13 @@ An input field for numbers e.g. integers, float etc.
```
-### Props
-
-- **fieldPath** `String` _required_: The path to the field e.g. `cern:experiment`.
-
-- **label** `String` _required_: The label for the element's display. This is used whenever the field should be displayed e.g. upload form, landing page etc.
-
-- **placeholder** `String` _required_: The placeholder for the element's display. You should fill this in with an example value.
-
-- **description** `String` _required_: The description for the element's display. You should provide useful information on how the users should fill this field in.
-
-- **icon** `String` _optional_: The optional icon that your field might have. The value should be one of the [Semantic UI icons](https://react.semantic-ui.com/elements/icon/).
-
-- **required** `Boolean` _optional_: Define if the field should be required i.e. display the `*` symbol.
-
-- **disabled** `Boolean` _optional_: Define if the field should be displayed as disabled thus no input can be filled.
-
## MultiInput
An input field for multiple string values.
@@ -80,27 +70,15 @@ An input field for multiple string values.
```
-### Props
-
-- **fieldPath** `String` _required_: The path to the field e.g. `cern:experiment`.
-
-- **label** `String` _required_: The label for the element's display. This is used whenever the field should be displayed e.g. upload form, landing page etc.
-
-- **placeholder** `String` _required_: The placeholder for the element's display. You should fill this in with an example value.
-
-- **description** `String` _required_: The description for the element's display. You should provide useful information on how the users should fill this field in.
-
-- **icon** `String` _optional_: The optional icon that your field might have. The value should be one of the [Semantic UI icons](https://react.semantic-ui.com/elements/icon/).
-
-- **required** `Boolean` _optional_: Define if the field should be required i.e. display the `*` symbol.
+### Additional props
- **additionLabel** `String` _optional_: The label to show when a user is adding a new value.
@@ -118,24 +96,14 @@ A rich input field for HTML text, with a WYSIWYG editor.
```
-### Props
-
-- **fieldPath** `String` _required_: The path to the field e.g. `cern:experiment`.
-
-- **label** `String` _required_: The label for the element's display. This is used whenever the field should be displayed e.g. upload form, landing page etc.
-
-- **description** `String` _required_: The description for the element's display. You should provide useful information on how the users should fill this field in.
-
-- **icon** `String` _optional_: The optional icon that your field might have. The value should be one of the [Semantic UI icons](https://react.semantic-ui.com/elements/icon/).
-
-- **required** `Boolean` _optional_: Define if the field should be required i.e. display the `*` symbol.
+### Additional props
- **editorConfig** `Object` _optional_: The config to pass to the underlying HTML WYSIWYG editor as described in the [CKEditor configuration](https://ckeditor.com/docs/ckeditor5/latest/api/module_core_editor_editorconfig-EditorConfig.html) page.
@@ -149,24 +117,12 @@ An input field for multi line text.
```
-### Props
-
-- **fieldPath** `String` _required_: The path to the field e.g. `cern:experiment`.
-
-- **label** `String` _required_: The label for the element's display. This is used whenever the field should be displayed e.g. upload form, landing page etc.
-
-- **description** `String` _required_: The description for the element's display. You should provide useful information on how the users should fill this field in.
-
-- **icon** `String` _optional_: The optional icon that your field might have. The value should be one of the [Semantic UI icons](https://react.semantic-ui.com/elements/icon/).
-
-- **required** `Boolean` _optional_: Define if the field should be required i.e. display the `*` symbol.
-
## Dropdown
A dropdown field that renders the complete list of possible options, where the user can select one or multiple values. It is meant to be used with small vocabularies.
@@ -177,9 +133,9 @@ A dropdown field that renders the complete list of possible options, where the u
```
-### Props
-
-- **fieldPath** `String` _required_: The path to the field e.g. `cern:experiment`.
-
-- **label** `String` _required_: The label for the element's display. This is used whenever the field should be displayed e.g. upload form, landing page etc.
-
-- **placeholder** `String` _required_: The placeholder for the element's display. You should fill this in with an example value.
-
-- **description** `String` _required_: The description for the element's display. You should provide useful information on how the users should fill this field in.
-
-- **icon** `String` _optional_: The optional icon that your field might have. The value should be one of the [Semantic UI icons](https://react.semantic-ui.com/elements/icon/).
-
-- **required** `Boolean` _optional_: Define if the field should be required i.e. display the `*` symbol.
+### Additional props
- **search** `Boolean` _optional_: Define if the user should be able to search in the current available options.
@@ -217,9 +161,9 @@ A dropdown field that allows the user to search for values, connected to the RES
```
-### Props
-
-- **fieldPath** `String` _required_: The path to the field e.g. `cern:experiment`.
-
-- **label** `String` _required_: The label for the element's display. This is used whenever the field should be displayed e.g. upload form, landing page etc.
-
-- **placeholder** `String` _required_: The placeholder for the element's display. You should fill this in with an example value.
-
-- **description** `String` _required_: The description for the element's display. You should provide useful information on how the users should fill this field in.
+### Additional props
- **autocompleteFrom** `String` _required_: The endpoint from which the component should fetch options. This will point to your vocabulary endpoint e.g. `/api/vocabularies/myvocabulary`.
- **autocompleteFromAcceptHeader** `String` _optional_: The `Accept` header to send to the `autocompleteFrom` API. If not provided, the **default** header is
`application/vnd.inveniordm.v1+json`.
-- **icon** `String` _optional_: The optional icon that your field might have. The value should be one of the [Semantic UI icons](https://react.semantic-ui.com/elements/icon/).
-
-- **required** `Boolean` _optional_: Define if the field should be required i.e. display the `*` symbol.
-
- **clearable** `Boolean` _optional_: Define if the user can deselect all the selected values.
- **multiple** `Boolean` _optional_ : Define if the field accepts multiple values.
@@ -261,24 +193,14 @@ A field for boolean values. It displays 2 checkboxes for each corresponding valu
```
-### Props
-
-- **fieldPath** `String` _required_: The path to the field e.g. `cern:experiment`.
-
-- **label** `String` _required_: The label for the element's display. This is used whenever the field should be displayed e.g. upload form, landing page etc.
+### Additional props
- **trueLabel** `String` _required_: The label for the element's display when the value is `true`. This is used whenever the `true` value should be displayed e.g. upload form, landing page etc.
- **falseLabel** `String` _required_: The label for the element's display when the value is `false`. This is used whenever the `false` value should be displayed e.g. upload form, landing page etc.
-
-- **description** `String` _required_: The description for the element's display. You should provide useful information on how the users should fill this field in.
-
-- **icon** `String` _optional_: The optional icon that your field might have. The value should be one of the [Semantic UI icons](https://react.semantic-ui.com/elements/icon/).
-
-- **required** `Boolean` _optional_: Define if the field should be required i.e. display the `*` symbol.