Merge branch 'dev' of https://github.com/pnp/sp-dev-fx-controls-react into joaojmendes-UploadFiles

Author: joelfmrodrigues

.yo-rc.json

@@ -1,6 +1,6 @@
 {
   "@microsoft/generator-sharepoint": {
-    "version": "1.15.2",
+    "version": "1.16.1",
     "libraryName": "sp-dev-fx-controls-react",
     "libraryId": "92b1e52c-a5fa-490a-bcf4-76080f39442c",
     "environment": "spo",

CHANGELOG.json

@@ -9,20 +9,25 @@
           "`ListItemPicker`: Add Styles property to ListItemPicker and ComboBoxListItemPicker [#1407](https://github.com/pnp/sp-dev-fx-controls-react/pull/1407)",
           "`SitePicker`: Pass `styles` property to Dropdown [#1389](https://github.com/pnp/sp-dev-fx-controls-react/pull/1389)",
           "`FilePicker`: Site Tab - Many Document Libraries No Scrolling [#1413](https://github.com/pnp/sp-dev-fx-controls-react/pull/1413)",
-          "`DynamicForm`: Add `respectETag` option to `DynamicForm` [#1395](https://github.com/pnp/sp-dev-fx-controls-react/issues/1395)"
+          "`DynamicForm`: Add `respectETag` option to `DynamicForm` [#1395](https://github.com/pnp/sp-dev-fx-controls-react/issues/1395)",
+          "`MonacoEditor`: Fixed minor typos and misleading instructions [#1415](https://github.com/pnp/sp-dev-fx-controls-react/pull/1415)",
+          "SharePoint Framework v1.16.1 support [#1427](https://github.com/pnp/sp-dev-fx-controls-react/issues/1427)",
+          "`RichText`: `label` property is missing [#1375](https://github.com/pnp/sp-dev-fx-controls-react/issues/1375)"
         ],
         "fixes": [
           "`DateTimePicker`: broken link for `getErrorMessage` property fixed [#1277](https://github.com/pnp/sp-dev-fx-controls-react/pull/1381)",
           "`ProgressStepsIndicator`: Fix missing image reference in Progress Steps Indicator [#1409](https://github.com/pnp/sp-dev-fx-controls-react/issues/1409)",
           "`DynamicForm`: Dynamicform is hanging on the loading screen if the list has a single value list lookup field [#1393](https://github.com/pnp/sp-dev-fx-controls-react/issues/1393)",
           "`ListView`: Update ListView control docs to use a valid field for the icon [#1398](https://github.com/pnp/sp-dev-fx-controls-react/pull/1398)",
-          "`Accordion`: Fixing Accordion control documentation image issue [#1408](https://github.com/pnp/sp-dev-fx-controls-react/issues/1408)"
+          "`Accordion`: Fixing Accordion control documentation image issue [#1408](https://github.com/pnp/sp-dev-fx-controls-react/issues/1408)",
+          "`DynamicForm`: Cannot read properties of undefined (reading 'startsWith') when submitting the form with `contentType={undefined]` [#1431](https://github.com/pnp/sp-dev-fx-controls-react/issues/1431)"
         ]
       },
       "contributions": [
         "[Brian Krainer Jacobsen](https://github.com/krainer)",
         "[Edin Kapic](https://github.com/ekapic)",
         "[Harminder Singh](https://github.com/HarminderSethi)",
+        "[Hugo Bernier](https://github.com/hugoabernier)",
         "[João Mendes](https://github.com/joaojmendes)",
         "[mgitta](https://github.com/mgitta)",
         "[Michaël Maillot](https://github.com/michaelmaillot)",

CHANGELOG.md

@@ -9,17 +9,22 @@
 - `SitePicker`: Pass `styles` property to Dropdown [#1389](https://github.com/pnp/sp-dev-fx-controls-react/pull/1389)
 - `FilePicker`: Site Tab - Many Document Libraries No Scrolling [#1413](https://github.com/pnp/sp-dev-fx-controls-react/pull/1413)
 - `DynamicForm`: Add `respectETag` option to `DynamicForm` [#1395](https://github.com/pnp/sp-dev-fx-controls-react/issues/1395)
+- `MonacoEditor`: Fixed minor typos and misleading instructions [#1415](https://github.com/pnp/sp-dev-fx-controls-react/pull/1415)
+- SharePoint Framework v1.16.1 support [#1427](https://github.com/pnp/sp-dev-fx-controls-react/issues/1427)
+- `RichText`: `label` property is missing [#1375](https://github.com/pnp/sp-dev-fx-controls-react/issues/1375)
 
 ### Fixes
 
 - `DateTimePicker`: broken link for `getErrorMessage` property fixed [#1277](https://github.com/pnp/sp-dev-fx-controls-react/pull/1381)
 - `ProgressStepsIndicator`: Fix missing image reference in Progress Steps Indicator [#1409](https://github.com/pnp/sp-dev-fx-controls-react/issues/1409)
 - `DynamicForm`: Dynamicform is hanging on the loading screen if the list has a single value list lookup field [#1393](https://github.com/pnp/sp-dev-fx-controls-react/issues/1393)
 - `ListView`: Update ListView control docs to use a valid field for the icon [#1398](https://github.com/pnp/sp-dev-fx-controls-react/pull/1398)
+- `Accordion`: Fixing Accordion control documentation image issue [#1408](https://github.com/pnp/sp-dev-fx-controls-react/issues/1408)
+- `DynamicForm`: Cannot read properties of undefined (reading 'startsWith') when submitting the form with `contentType={undefined]` [#1431](https://github.com/pnp/sp-dev-fx-controls-react/issues/1431)
 
 ### Contributors
 
-Special thanks to our contributors (in alphabetical order): [Brian Krainer Jacobsen](https://github.com/krainer), [Edin Kapic](https://github.com/ekapic), [Harminder Singh](https://github.com/HarminderSethi), [João Mendes](https://github.com/joaojmendes), [mgitta](https://github.com/mgitta), [mikezimm](https://github.com/mikezimm).
+Special thanks to our contributors (in alphabetical order): [Brian Krainer Jacobsen](https://github.com/krainer), [Edin Kapic](https://github.com/ekapic), [Harminder Singh](https://github.com/HarminderSethi), [Hugo Bernier](https://github.com/hugoabernier), [João Mendes](https://github.com/joaojmendes), [mgitta](https://github.com/mgitta), [Michaël Maillot](https://github.com/michaelmaillot), [mikezimm](https://github.com/mikezimm).
 
 ## 3.12.0
 

docs/documentation/docs/about/release-notes.md

@@ -9,17 +9,22 @@
 - `SitePicker`: Pass `styles` property to Dropdown [#1389](https://github.com/pnp/sp-dev-fx-controls-react/pull/1389)
 - `FilePicker`: Site Tab - Many Document Libraries No Scrolling [#1413](https://github.com/pnp/sp-dev-fx-controls-react/pull/1413)
 - `DynamicForm`: Add `respectETag` option to `DynamicForm` [#1395](https://github.com/pnp/sp-dev-fx-controls-react/issues/1395)
+- `MonacoEditor`: Fixed minor typos and misleading instructions [#1415](https://github.com/pnp/sp-dev-fx-controls-react/pull/1415)
+- SharePoint Framework v1.16.1 support [#1427](https://github.com/pnp/sp-dev-fx-controls-react/issues/1427)
+- `RichText`: `label` property is missing [#1375](https://github.com/pnp/sp-dev-fx-controls-react/issues/1375)
 
 ### Fixes
 
 - `DateTimePicker`: broken link for `getErrorMessage` property fixed [#1277](https://github.com/pnp/sp-dev-fx-controls-react/pull/1381)
 - `ProgressStepsIndicator`: Fix missing image reference in Progress Steps Indicator [#1409](https://github.com/pnp/sp-dev-fx-controls-react/issues/1409)
 - `DynamicForm`: Dynamicform is hanging on the loading screen if the list has a single value list lookup field [#1393](https://github.com/pnp/sp-dev-fx-controls-react/issues/1393)
 - `ListView`: Update ListView control docs to use a valid field for the icon [#1398](https://github.com/pnp/sp-dev-fx-controls-react/pull/1398)
+- `Accordion`: Fixing Accordion control documentation image issue [#1408](https://github.com/pnp/sp-dev-fx-controls-react/issues/1408)
+- `DynamicForm`: Cannot read properties of undefined (reading 'startsWith') when submitting the form with `contentType={undefined]` [#1431](https://github.com/pnp/sp-dev-fx-controls-react/issues/1431)
 
 ### Contributors
 
-Special thanks to our contributors (in alphabetical order): [Brian Krainer Jacobsen](https://github.com/krainer), [Edin Kapic](https://github.com/ekapic), [Harminder Singh](https://github.com/HarminderSethi), [João Mendes](https://github.com/joaojmendes), [mgitta](https://github.com/mgitta), [mikezimm](https://github.com/mikezimm).
+Special thanks to our contributors (in alphabetical order): [Brian Krainer Jacobsen](https://github.com/krainer), [Edin Kapic](https://github.com/ekapic), [Harminder Singh](https://github.com/HarminderSethi), [Hugo Bernier](https://github.com/hugoabernier), [João Mendes](https://github.com/joaojmendes), [mgitta](https://github.com/mgitta), [Michaël Maillot](https://github.com/michaelmaillot), [mikezimm](https://github.com/mikezimm).
 
 ## 3.12.0
 

docs/documentation/docs/controls/MonacoEditor.md

@@ -1,6 +1,6 @@
 # Monaco Editor control
 
-This control is a implementatiopn of Monaco Editor.
+This control is an implementation of the Monaco Editor. The Monaco Editor is the code editor that powers [VS Code](https://github.com/microsoft/vscode). 
 
 Here is an example of the control:
 
@@ -30,22 +30,33 @@ import { MonacoEditor } from "@pnp/spfx-controls-react/lib/MonacoEditor";
 ```
 
 - The `onValueChange` change event returns the upadated code and array with messages of errors on validation and can be implemented as follows:
-  **this validation is done only to JSON language
+
+> This validation is only available for JSON language
+
+Your `onValueChange` handler would follow a similar format to this:
+
+
+```TypeScript
+   const onValueChange = (newValue: string, validationErrors: string[]): void => { console.log(newValue); };
+```
+
+Or, if using React Hooks:
 
 ```TypeScript
   const onValueChange = React.useCallback((newValue: string, validationErrors: string[]): void => {console.log(newValue);} , []);
 ```
 
+
 ## Implementation
 
 The `MonacoEditor` control can be configured with the following properties:
 
 | Property | Type | Required | Description |
 | ---- | ---- | ---- | ---- |
 | value | string   | yes | default content for editor |
-| theme | string | no | theme used by editor , two themes are supported 'vs'  and 'vs-dark', default 'vs' |
-| readOnly | boolean | no | indecate if editor is in read only mode |
-| showLineNumbers | boolean | no | editor show linenumber or not, default : yes|
+| theme | string | no | theme used by editor, two themes are supported 'vs'  and 'vs-dark', default 'vs' |
+| readOnly | boolean | no | indicate if editor is in read-only mode |
+| showLineNumbers | boolean | no | editor show line number or not, default : yes|
 | onValueChange |(newValue:string, validationErrors:string[]) => void | no | function to get code changes, return an array with validation error in case of language is 'JSON' |
 | language |string | yes | editor code language, please see https://microsoft.github.io/monaco-editor/index.html for supported languages|
 | jsonDiagnosticsOptions |monaco.languages.json.DiagnosticsOptions | no | define options to JSON validation, please see  https://microsoft.github.io/monaco-editor/index.html for more details |

docs/documentation/docs/controls/RichText.md

@@ -41,17 +41,40 @@ private onTextChange = (newText: string) => {
 }
 ```
 
+- By adding `label` property, the control is better identified, especially when used in a form
+
+```TypeScript
+<RichText label="My multiline text field" value={this.props.value} />
+```
+
+It is also possible to customize the control label's rendering:
+
+```TypeScript
+const richText = (
+  <RichText id="spfxRichText" label="My multiline text field"
+            onRenderLabel={onRenderCustomLabel}
+            value={this.props.value} />
+);
+
+const onRenderCustomLabel = (rtProps: IRichTextProps): JSX.Element => {
+  return <Label htmlFor={rtProps.id}>{rtProps.label}</Label>;
+}
+```
+
 ## Implementation
 
 The RichText control can be configured with the following properties:
 
 | Property | Type | Required | Description |
 | ---- | ---- | ---- | ---- |
+| id | string | no | The ID to apply to the RichText control. |
+| label | string | no | The label displayed above the RichText control. |
 | className | string | no | The custom CSS class to apply to the RichText control. |
 | isEditMode | boolean | no | `true` indicates that users will be able to edit the content of the RichText control. `false` will display the rich text as read-only. |
 | styleOptions | StyleOptions | no | Define the styles you want to show or hide for the rich text editor |
 | value | string | no | Sets the rich text to display in the RichText control. |
 | onChange | (text: string) => string | no | onChange handler for the RichText control. The function must return a `string` containing the rich text to display in the RichText control. |
+| onRenderLabel | (props: IRichTextProps) => JSX.Element | no | Custom renderer for the RichText control's label. The function must return a `JSX.Element`. |
 
 `StyleOptions` interface