3.17.0

.gitignore

@@ -35,7 +35,11 @@ obj
 *.tgz
 
 # VSCode
-.vscode
+.vscode/*
+
+# Included VSCode files
+!.vscode/example-tasks.json
+!.vscode/example-launch.json
 
 # Documentation
 docs/documentation/site

.vscode/example-launch.json

@@ -0,0 +1,44 @@
+{
+    /**
+     * Populate and rename this file to launch.json to configure debugging
+     */
+    "version": "0.2.0",
+    "configurations": [
+      {
+        "name": "Hosted workbench (chrome)",
+        "type": "chrome",
+        "request": "launch",
+        "url": "https://enter-your-SharePoint-site.sharepoint.com/sites/mySite/_layouts/15/workbench.aspx",
+        "webRoot": "${workspaceRoot}",
+        "sourceMaps": true,
+        "sourceMapPathOverrides": {
+          "webpack:///.././src/*": "${webRoot}/src/*",
+          "webpack:///../../../src/*": "${webRoot}/src/*",
+          "webpack:///../../../../src/*": "${webRoot}/src/*",
+          "webpack:///../../../../../src/*": "${webRoot}/src/*"
+        },
+        "preLaunchTask": "npm: serve",
+        "runtimeArgs": [
+          "--remote-debugging-port=9222",
+        ]
+      },
+      {
+        "name": "Hosted workbench (edge)",
+        "type": "edge",
+        "request": "launch",
+        "url": "https://enter-your-SharePoint-site.sharepoint.com/sites/mySite/_layouts/15/workbench.aspx",
+        "webRoot": "${workspaceRoot}",
+        "sourceMaps": true,
+        "sourceMapPathOverrides": {
+          "webpack:///.././src/*": "${webRoot}/src/*",
+          "webpack:///../../../src/*": "${webRoot}/src/*",
+          "webpack:///../../../../src/*": "${webRoot}/src/*",
+          "webpack:///../../../../../src/*": "${webRoot}/src/*"
+        },
+        "preLaunchTask": "npm: serve",
+        "runtimeArgs": [
+          "--remote-debugging-port=9222",
+        ]
+      },
+    ]
+  }

.vscode/example-tasks.json

@@ -0,0 +1,30 @@
+{
+	/**
+     * Populate and rename this file to launch.json to configure debugging
+     */
+	"version": "2.0.0",
+	"tasks": [
+		{
+			"type": "npm",
+			"script": "serve",
+			"isBackground": true,
+			"problemMatcher": {
+				"owner": "custom",
+				"pattern": {
+					"regexp": "."
+				},
+				"background": {
+					"activeOnStart": true,
+					"beginsPattern": "Starting 'bundle'",
+					"endsPattern": "\\[\\sFinished\\s\\]"
+				}
+			},
+			"label": "npm: serve",
+			"detail": "gulp bundle --custom-serve --max_old_space_size=4096 && fast-serve",
+			"group": {
+				"kind": "build",
+				"isDefault": true
+			}
+		},
+	]
+}

CHANGELOG.json

@@ -1,5 +1,33 @@
 {
   "versions": [
+    {
+      "version": "3.17.0",
+      "changes":{
+        "new": [],
+        "enhancements": [
+          "`DyanmicForm`: Added file handling [#1625](https://github.com/pnp/sp-dev-fx-controls-react/pull/1625)",
+          "`DynamicForm`: Custom Formatting and Validation, ControlsTestWebPart updates [#1672](https://github.com/pnp/sp-dev-fx-controls-react/pull/1672)",
+          "`PeoplePicker`: Added custom filter to PeoplePicker selection [#1657](https://github.com/pnp/sp-dev-fx-controls-react/issues/1657)",
+          "`RichText`: Align RichText heading styles and font sizes with OOB SharePoint text web part [#1706](https://github.com/pnp/sp-dev-fx-controls-react/pull/1706)"
+        ],
+        "fixes": [
+          "Build fails due to missing @iconify/react dependency after upgrade to 3.16.0 [#1719](https://github.com/pnp/sp-dev-fx-controls-react/issues/1719)",
+          "`ModernTaxonomyPicker`: not displaying suggestions when typing in values - API not found error [#1688](https://github.com/pnp/sp-dev-fx-controls-react/issues/1688)",
+          "`DynamicForm`: Disable issue on fieldOverrides field control when onBeforeSubmit return true [#1715](https://github.com/pnp/sp-dev-fx-controls-react/issues/1715)",
+          "`PeoplePicker`: PeoplePicker returns no results with webAbsoluteUrl and ensureUser [#1669](https://github.com/pnp/sp-dev-fx-controls-react/issues/1669)",
+          "`DynamicForm`: [DynamicForm] Fixing multi taxonomy field (loading + saving existing item) [#1739](https://github.com/pnp/sp-dev-fx-controls-react/pull/1739)"
+        ]
+      },
+      "contributions": [
+        "[Guido Zambarda](https://github.com/GuidoZam)",
+        "[Lars Fernhomberg](https://github.com/lafe)",
+        "[Mark Bice](https://github.com/mbice)",
+        "[Michaël Maillot](https://github.com/michaelmaillot)",
+        "[Nishkalank Bezawada](https://github.com/NishkalankBezawada)",
+        "[Tom G](https://github.com/t0mgerman)",
+        "[wuxiaojun514](https://github.com/wuxiaojun514)"
+      ]
+    },
     {
       "version": "3.16.2",
       "changes": {

CHANGELOG.md

@@ -1,5 +1,26 @@
 # Releases
 
+## 3.17.0
+
+### Enhancements
+
+- `DyanmicForm`: Added file handling [#1625](https://github.com/pnp/sp-dev-fx-controls-react/pull/1625)
+- `DynamicForm`: Custom Formatting and Validation, ControlsTestWebPart updates [#1672](https://github.com/pnp/sp-dev-fx-controls-react/pull/1672)
+- `PeoplePicker`: Added custom filter to PeoplePicker selection [#1657](https://github.com/pnp/sp-dev-fx-controls-react/issues/1657)
+- `RichText`: Align RichText heading styles and font sizes with OOB SharePoint text web part [#1706](https://github.com/pnp/sp-dev-fx-controls-react/pull/1706)
+
+### Fixes
+
+- Build fails due to missing @iconify/react dependency after upgrade to 3.16.0 [#1719](https://github.com/pnp/sp-dev-fx-controls-react/issues/1719)
+- `ModernTaxonomyPicker`: not displaying suggestions when typing in values - API not found error [#1688](https://github.com/pnp/sp-dev-fx-controls-react/issues/1688)
+- `DynamicForm`: Disable issue on fieldOverrides field control when onBeforeSubmit return true [#1715](https://github.com/pnp/sp-dev-fx-controls-react/issues/1715)
+- `PeoplePicker`: PeoplePicker returns no results with webAbsoluteUrl and ensureUser [#1669](https://github.com/pnp/sp-dev-fx-controls-react/issues/1669)
+- `DynamicForm`: [DynamicForm] Fixing multi taxonomy field (loading + saving existing item) [#1739](https://github.com/pnp/sp-dev-fx-controls-react/pull/1739)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Guido Zambarda](https://github.com/GuidoZam), [Lars Fernhomberg](https://github.com/lafe), [Mark Bice](https://github.com/mbice), [Michaël Maillot](https://github.com/michaelmaillot), [Nishkalank Bezawada](https://github.com/NishkalankBezawada), [Tom G](https://github.com/t0mgerman), [wuxiaojun514](https://github.com/wuxiaojun514).
+
 ## 3.16.2
 
 ### Fixes

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

@@ -1,5 +1,26 @@
 # Releases
 
+## 3.17.0
+
+### Enhancements
+
+- `DyanmicForm`: Added file handling [#1625](https://github.com/pnp/sp-dev-fx-controls-react/pull/1625)
+- `DynamicForm`: Custom Formatting and Validation, ControlsTestWebPart updates [#1672](https://github.com/pnp/sp-dev-fx-controls-react/pull/1672)
+- `PeoplePicker`: Added custom filter to PeoplePicker selection [#1657](https://github.com/pnp/sp-dev-fx-controls-react/issues/1657)
+- `RichText`: Align RichText heading styles and font sizes with OOB SharePoint text web part [#1706](https://github.com/pnp/sp-dev-fx-controls-react/pull/1706)
+
+### Fixes
+
+- Build fails due to missing @iconify/react dependency after upgrade to 3.16.0 [#1719](https://github.com/pnp/sp-dev-fx-controls-react/issues/1719)
+- `ModernTaxonomyPicker`: not displaying suggestions when typing in values - API not found error [#1688](https://github.com/pnp/sp-dev-fx-controls-react/issues/1688)
+- `DynamicForm`: Disable issue on fieldOverrides field control when onBeforeSubmit return true [#1715](https://github.com/pnp/sp-dev-fx-controls-react/issues/1715)
+- `PeoplePicker`: PeoplePicker returns no results with webAbsoluteUrl and ensureUser [#1669](https://github.com/pnp/sp-dev-fx-controls-react/issues/1669)
+- `DynamicForm`: [DynamicForm] Fixing multi taxonomy field (loading + saving existing item) [#1739](https://github.com/pnp/sp-dev-fx-controls-react/pull/1739)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Guido Zambarda](https://github.com/GuidoZam), [Lars Fernhomberg](https://github.com/lafe), [Mark Bice](https://github.com/mbice), [Michaël Maillot](https://github.com/michaelmaillot), [Nishkalank Bezawada](https://github.com/NishkalankBezawada), [Tom G](https://github.com/t0mgerman), [wuxiaojun514](https://github.com/wuxiaojun514).
+
 ## 3.16.2
 
 ### Fixes

docs/documentation/docs/controls/DynamicForm.md

@@ -26,6 +26,17 @@ import { DynamicForm } from "@pnp/spfx-controls-react/lib/DynamicForm";
 ```
 ![DynamicForm](../assets/DynamicForm.png)
 
+## File selection
+
+To upload a file when creating a new document in a document library you need to specify:
+- enableFileSelection: Set this parameter to true to enable file selection.
+- contentTypeId: This parameter specifies the target content type ID of the document you are creating.
+- supportedFileExtensions: This parameter is optional and is used to specify the supported file extensions if they are different from the default ones.
+
+Enabling the file selection will display a new button on top of the form that allow the user to select a file from the recent files, browsing OneDrive or select and upload a file from the computer.
+
+![DynamicFormWithFileSelection](../assets/DynamicFormWithFileSelection.png)
+
 ## Implementation
 
 The `DynamicForm` can be configured with the following properties:
@@ -38,13 +49,15 @@ The `DynamicForm` can be configured with the following properties:
 | contentTypeId | string | no | content type ID |
 | disabled | boolean | no | Allows form to be disabled. Default value is `false`|
 | disabledFields | string[] | no | InternalName of fields that should be disabled. Default value is `false`|
+| enableFileSelection | boolean | no | Specify if the form should support the creation of a new list item in a document library attaching a file to it. This option is only available for document libraries and works only when the contentTypeId is specified and has a base type of type Document. Default value is `false`|
 | hiddenFields | string[] | no | InternalName of fields that should be hidden. Default value is `false`|
 | onListItemLoaded | (listItemData: any) => Promise<void> | no | List item loaded handler. Allows to access list item information after it's loaded.|
 | onBeforeSubmit | (listItemData: any) => Promise<boolean> | no | Before submit handler. Allows to modify the object to be submitted or cancel the submission. To cancel, return `true`.|
 | onSubmitted | (listItemData: any, listItem?: IItem) => void | no | Method that returns listItem data JSON object and PnPJS list item instance (`IItem`). |
 | onSubmitError | (listItemData: any, error: Error) => void | no | Handler of submission error. |
 | onCancelled | () => void | no | Handler when form has been cancelled. |
 | returnListItemInstanceOnSubmit | boolean | no | Specifies if `onSubmitted` event should pass PnPJS list item (`IItem`) as a second parameter. Default - `true` |
+| supportedFileExtensions | string[] | no | Specify the supported file extensions for the file picker. Only used when enableFileSelection is `true`. Default value is `["docx", "doc", "pptx", "ppt", "xlsx", "xls", "pdf"]`. |
 | webAbsoluteUrl | string | no | Absolute Web Url of target site (user requires permissions). |
 | fieldOverrides | {[columnInternalName: string] : {(fieldProperties: IDynamicFieldProps): React.ReactElement\<IDynamicFieldProps\>}} | no | Key value pair for fields you want to override.  Key is the internal field name, value is the function to be called for the custom element to render. |
 | respectEtag | boolean | no | Specifies if the form should respect the ETag of the item. Default - `true` |

docs/documentation/docs/index.md

@@ -112,6 +112,7 @@ The following controls are currently available:
 - [TreeView](./controls/TreeView) (Tree View)
 - [UploadFiles](./controls/UploadFiles) (Upload Files)
 - [VariantThemeProvider](./controls/VariantThemeProvider) (Variant Theme Provider)
+- [ViewPicker](./controls/ViewPicker.md) (View Picker Control)
 - [WebPartTitle](./controls/WebPartTitle) (Customizable web part title control)
 
 

docs/documentation/mkdocs.yml

@@ -73,6 +73,7 @@ nav:
     - TreeView: 'controls/TreeView.md'
     - UploadFiles: 'controls/UploadFiles.md'
     - VariantThemeProvider: 'controls/VariantThemeProvider.md'
+    - ViewPicker: 'controls/ViewPicker.md'
     - WebPartTitle: 'controls/WebPartTitle.md'
   - 'Field Controls':
     - 'Getting started': 'controls/fields/main.md'