Merge branch 'dev' into dynamic-form-list-customization

Author: Tom German

CHANGELOG.json

@@ -4,13 +4,36 @@
       "version": "3.16.0",
       "changes": {
         "new": [
+          "`ViewPicker`: new control ViewPicker [#1439](https://github.com/pnp/sp-dev-fx-controls-react/issues/1439)"
         ],
         "enhancements": [
+          "`FieldCollectionData`: render on page instead of panel and added combobox and peoplepicker controls [#1588](https://github.com/pnp/sp-dev-fx-controls-react/pull/1588)",
+          "`FieldCollectionData`: added date field control and updated number field [#1600](https://github.com/pnp/sp-dev-fx-controls-react/pull/1600)",
+          "`ListItemComments`: Added ListItemComments component to Controls.tsx [#1621](https://github.com/pnp/sp-dev-fx-controls-react/pull/1621)",
+          "`FolderPicker`: Improve documentation of FolderPicker [#1379](https://github.com/pnp/sp-dev-fx-controls-react/pull/1379)",
+          "`RichText`: Add https:// as placeholder instead of textbox value when adding url [#1651](https://github.com/pnp/sp-dev-fx-controls-react/pull/1656)"
         ],
         "fixes": [
+          "`AccessibleAccordion`: fix typo in documentation [#1634](https://github.com/pnp/sp-dev-fx-controls-react/pull/1634)",
+          "`DynamicForm`: fix issue with MultiChoice field [#1510](https://github.com/pnp/sp-dev-fx-controls-react/issues/1510)",
+          "`Localization`: Update dutch translations [#1635](https://github.com/pnp/sp-dev-fx-controls-react/issues/1635)",
+          "`TaxonomyPicker`: suggested item contains double termset name [#1597](https://github.com/pnp/sp-dev-fx-controls-react/issues/1597)",
+          "`DynamicForm`: DynamicForm does not properly handle NULL default values for Taxonomy fields [#1267](https://github.com/pnp/sp-dev-fx-controls-react/issues/1267)",
+          "`DynamicForm`: New items are always created with the default content type if the list has multiple content types [#1626](https://github.com/pnp/sp-dev-fx-controls-react/pull/1626)",
+          "`PeoplePicker`:PeoplePicker won't accept Multiple Users with the same name [#1620] (https://github.com/pnp/sp-dev-fx-controls-react/pull/1620)",
+          "`DynamicForm`: Dynamic Form accessed TaxonomyFieldTypeMulti without considering sub-array results [#1614](https://github.com/pnp/sp-dev-fx-controls-react/pull/1614)",
+          "`DynamicForm`: Number validations are working, but the percentage values are not getting saved [#1601](https://github.com/pnp/sp-dev-fx-controls-react/pull/1601)"
         ]
       },
       "contributions": [
+        "[Guido Zambarda](https://github.com/GuidoZam)",
+        "[Joakim](https://github.com/daenur76)",
+        "[Michaël Maillot](https://github.com/michaelmaillot)",
+        "[Nils Andresen](https://github.com/nils-a)",
+        "[Nishkalank Bezawada](https://github.com/NishkalankBezawada)",
+        "[Rico van de Ven](https://github.com/RicoNL)",
+        "[Steve Beaugé](https://github.com/stevebeauge)",
+        "[wuxiaojun514](https://github.com/wuxiaojun514)"
       ]
     },
     {

CHANGELOG.md

@@ -1,5 +1,35 @@
 # Releases
 
+## 3.16.0
+
+### New control(s)
+
+- `ViewPicker`: new control ViewPicker [#1439](https://github.com/pnp/sp-dev-fx-controls-react/issues/1439)
+
+### Enhancements
+
+- `FieldCollectionData`: render on page instead of panel and added combobox and peoplepicker controls [#1588](https://github.com/pnp/sp-dev-fx-controls-react/pull/1588)
+- `FieldCollectionData`: added date field control and updated number field [#1600](https://github.com/pnp/sp-dev-fx-controls-react/pull/1600)
+- `ListItemComments`: Added ListItemComments component to Controls.tsx [#1621](https://github.com/pnp/sp-dev-fx-controls-react/pull/1621)
+- `FolderPicker`: Improve documentation of FolderPicker [#1379](https://github.com/pnp/sp-dev-fx-controls-react/pull/1379)
+- `RichText`: Add https:// as placeholder instead of textbox value when adding url [#1651](https://github.com/pnp/sp-dev-fx-controls-react/pull/1656)
+
+### Fixes
+
+- `AccessibleAccordion`: fix typo in documentation [#1634](https://github.com/pnp/sp-dev-fx-controls-react/pull/1634)
+- `DynamicForm`: fix issue with MultiChoice field [#1510](https://github.com/pnp/sp-dev-fx-controls-react/issues/1510)
+- `Localization`: Update dutch translations [#1635](https://github.com/pnp/sp-dev-fx-controls-react/issues/1635)
+- `TaxonomyPicker`: suggested item contains double termset name [#1597](https://github.com/pnp/sp-dev-fx-controls-react/issues/1597)
+- `DynamicForm`: DynamicForm does not properly handle NULL default values for Taxonomy fields [#1267](https://github.com/pnp/sp-dev-fx-controls-react/issues/1267)
+- `DynamicForm`: New items are always created with the default content type if the list has multiple content types [#1626](https://github.com/pnp/sp-dev-fx-controls-react/pull/1626)
+- `PeoplePicker`:PeoplePicker won't accept Multiple Users with the same name [#1620] (https://github.com/pnp/sp-dev-fx-controls-react/pull/1620)
+- `DynamicForm`: Dynamic Form accessed TaxonomyFieldTypeMulti without considering sub-array results [#1614](https://github.com/pnp/sp-dev-fx-controls-react/pull/1614)
+- `DynamicForm`: Number validations are working, but the percentage values are not getting saved [#1601](https://github.com/pnp/sp-dev-fx-controls-react/pull/1601)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Guido Zambarda](https://github.com/GuidoZam), [Joakim](https://github.com/daenur76), [Michaël Maillot](https://github.com/michaelmaillot), [Nils Andresen](https://github.com/nils-a), [Nishkalank Bezawada](https://github.com/NishkalankBezawada), [Rico van de Ven](https://github.com/RicoNL), [Steve Beaugé](https://github.com/stevebeauge), [wuxiaojun514](https://github.com/wuxiaojun514).
+
 ## 3.15.0
 
 ### New control(s)

README.md

@@ -15,7 +15,6 @@ Please use following logic on submitting your questions or issues to right locat
 * You have general question or challenge with SPFx - use [sp-dev-docs repository issue list](https://github.com/sharepoint/sp-dev-docs/issues).
 * You have issue on specific controls in this package - use [issue list in this repository](https://github.com/pnp/sp-dev-fx-controls-react/issues).
 
-
 ## Contributing
 
 We'd love your help! If you have ideas for new features or feedback, let us know by creating an issue in the [issues list](https://github.com/pnp/sp-dev-fx-controls-react/issues). Before you submit a PR with your improvements, please review our [project guides](https://pnp.github.io/sp-dev-fx-controls-react/guides).

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

@@ -1,5 +1,35 @@
 # Releases
 
+## 3.16.0
+
+### New control(s)
+
+- `ViewPicker`: new control ViewPicker [#1439](https://github.com/pnp/sp-dev-fx-controls-react/issues/1439)
+
+### Enhancements
+
+- `FieldCollectionData`: render on page instead of panel and added combobox and peoplepicker controls [#1588](https://github.com/pnp/sp-dev-fx-controls-react/pull/1588)
+- `FieldCollectionData`: added date field control and updated number field [#1600](https://github.com/pnp/sp-dev-fx-controls-react/pull/1600)
+- `ListItemComments`: Added ListItemComments component to Controls.tsx [#1621](https://github.com/pnp/sp-dev-fx-controls-react/pull/1621)
+- `FolderPicker`: Improve documentation of FolderPicker [#1379](https://github.com/pnp/sp-dev-fx-controls-react/pull/1379)
+- `RichText`: Add https:// as placeholder instead of textbox value when adding url [#1651](https://github.com/pnp/sp-dev-fx-controls-react/pull/1656)
+
+### Fixes
+
+- `AccessibleAccordion`: fix typo in documentation [#1634](https://github.com/pnp/sp-dev-fx-controls-react/pull/1634)
+- `DynamicForm`: fix issue with MultiChoice field [#1510](https://github.com/pnp/sp-dev-fx-controls-react/issues/1510)
+- `Localization`: Update dutch translations [#1635](https://github.com/pnp/sp-dev-fx-controls-react/issues/1635)
+- `TaxonomyPicker`: suggested item contains double termset name [#1597](https://github.com/pnp/sp-dev-fx-controls-react/issues/1597)
+- `DynamicForm`: DynamicForm does not properly handle NULL default values for Taxonomy fields [#1267](https://github.com/pnp/sp-dev-fx-controls-react/issues/1267)
+- `DynamicForm`: New items are always created with the default content type if the list has multiple content types [#1626](https://github.com/pnp/sp-dev-fx-controls-react/pull/1626)
+- `PeoplePicker`:PeoplePicker won't accept Multiple Users with the same name [#1620] (https://github.com/pnp/sp-dev-fx-controls-react/pull/1620)
+- `DynamicForm`: Dynamic Form accessed TaxonomyFieldTypeMulti without considering sub-array results [#1614](https://github.com/pnp/sp-dev-fx-controls-react/pull/1614)
+- `DynamicForm`: Number validations are working, but the percentage values are not getting saved [#1601](https://github.com/pnp/sp-dev-fx-controls-react/pull/1601)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Guido Zambarda](https://github.com/GuidoZam), [Joakim](https://github.com/daenur76), [Michaël Maillot](https://github.com/michaelmaillot), [Nils Andresen](https://github.com/nils-a), [Nishkalank Bezawada](https://github.com/NishkalankBezawada), [Rico van de Ven](https://github.com/RicoNL), [Steve Beaugé](https://github.com/stevebeauge), [wuxiaojun514](https://github.com/wuxiaojun514).
+
 ## 3.15.0
 
 ### New control(s)

docs/documentation/docs/assets/ViewPicker-multi.png

@@ -30,11 +30,13 @@ Here is an example of the control in action inside a Web Part:
 * Check that you installed the `@pnp/spfx-controls-react` dependency. Check out the [getting started](../../#getting-started) page for more information about installing the dependency.
 
 * In your component file, import the `AdaptiveCardDesignerHost` control as follows:
+
 ```Typescript  
 import { AdaptiveCardDesignerHost, HostContainer, BindingPreviewMode, Versions } from "@pnp/spfx-controls-react/lib/AdaptiveCardDesignerHost";
 ```
 
 - Example on use the `AdaptiveCardDesignerHost` control with only required properties:
+
 ```Typescript
 <AdaptiveCardDesignerHost
   headerText="Adaptive Card Designer"
@@ -45,6 +47,7 @@ import { AdaptiveCardDesignerHost, HostContainer, BindingPreviewMode, Versions }
 ```
 
 - Example on use the `AdaptiveCardDesignerHost` control with all properties:
+
 ```Typescript
 <AdaptiveCardDesignerHost
   headerText="Adaptive Card Designer"
@@ -72,6 +75,7 @@ import { AdaptiveCardDesignerHost, HostContainer, BindingPreviewMode, Versions }
   snippets={snippets}
 />
 ```
+
 ## Implementation
 
 The `AdaptiveCardDesignerHost` control can be configured with the following properties:

docs/documentation/docs/assets/ViewPicker1.PNG

@@ -96,7 +96,7 @@ The `FieldCollectionData` control can be configured with the following propertie
 | saveAndAddBtnLabel | string | yes | Label of the save and add button. | |
 | cancelBtnLabel | string | yes | Label of the cancel button. | |
 | fields | ICustomCollectionField[] | yes | The fields to be used for the list of collection data. | |
-| value | string | yes | The collection data value. | |
+| value | any[] | yes | The collection data value. | |
 | enableSorting | boolean | no | Specify if you want to be able to sort the items in the collection. | false |
 | disabled | boolean | no | Specify if the control is disabled. | false |
 | disableItemCreation | boolean | no | Allows you to specify if user can create new items. | false |
@@ -106,6 +106,9 @@ The `FieldCollectionData` control can be configured with the following propertie
 | itemsPerPage | number | no | Allows you to specify the amount of items displayed per page. Paging control is added automatically. | |
 | executeFiltering | (searchFilter: string, item: any) => boolean | no | Allows you to show Search Box and specify own filtering logic. | |
 | panelProps | IPanelProps | no | Allows you to pass in props of the panel such as type and customWidth to control the underlying panel. | |
+| context | BaseComponentContext | no | Needed if **peoplepicker** field type is used | |
+| usePanel | boolean | no | Specify if you want the control to opened in a panel or directly on the page (only useful within webpart) | true | 
+| noDataMessage | string | no | Specify the message when no items are added to the collection ||
 
 Interface `ICustomCollectionField`
 
@@ -116,13 +119,18 @@ Interface `ICustomCollectionField`
 | type | CustomCollectionFieldType | yes | Specifies the type of field to render. |
 | disableEdit | boolean | no | Allows you to specify if a field is disabled for editing. |
 | required | boolean | no | Specify if the field is required. |
-| options | [IDropdownOption[]](https://developer.microsoft.com/en-us/fabric#/components/dropdown) | no | Dropdown options. Only necessary when dropdown type is used. |
+| options | [IDropdownOption[]](https://developer.microsoft.com/en-us/fabric#/components/dropdown) [IComboboxOption[]](https://developer.microsoft.com/en-us/fluentui#/controls/web/combobox) | no | Dropdown options. Only necessary when dropdown or combobox type is used. |
 | onRenderOption | IRenderFunction<ISelectableOption> | no | Dropdown custom options render method. Only for the **dropdown** field type. |
 | placeholder | string | no | Placehoder text which will be used for the input field. If not provided the input title will be used. |
 | defaultValue | any | no | Specify a default value for the input field. |
 | deferredValidationTime | number | no | Field will start to validate after users stop typing for `deferredValidationTime` milliseconds. Default: 200ms. |
 | onGetErrorMessage | (value: any, index: number, crntItem: any): string \| Promise<string> | no | The method is used to get the validation error message and determine whether the input value is valid or not. It provides you the current row index and the item you are currently editing. |
 | onCustomRender | (field: ICustomCollectionField, value: any, onUpdate: (fieldId: string, value: any) => void, item: any, itemUniqueId: string, onCustomFieldValidation: (fieldId: string, errorMessage: string) => void) => JSX.Element | no | This property is only required if you are using the `custom` field type and it can be used to specify the custom rendering of your control in the collection data. |
+| multiSelect | boolean| no | Specifies multiple options can be selected (**combobox**) or mutliple users can be selected (**peoplepicker**) |
+| allowFreeform | boolean | no | Specifies that own options can be entered. Only for **combobox** field type |
+| minimumUsers| number | no | Specifies the minimum number of users to be entered for **peoplepicker** field type |
+| minimumUsersMessage| string | no | Specifies the message to be displayed if minimumUsers are not entered for **peoplepicker** field type |
+| maximumUsers | number | no | Specifies the maximum number of users to be entered for **peoplepicker** field type |
 
 Enum `CustomCollectionFieldType`
 
@@ -132,8 +140,10 @@ Enum `CustomCollectionFieldType`
 | number | Number field |
 | boolean | Checkbox |
 | dropdown | Dropdown field. You will have to specify the `options` property when using this field type |
+| combobox | Combobox field. You wil have to specify the `options` property, optional specify `allowFreeform` and `multiSelect` |
 | fabricIcon | Name of the [Office UI Fabric icon](https://developer.microsoft.com/en-us/fabric#/styles/icons) |
 | url | URL field |
+| peoplepicker | Peoplepicker control |
 | custom | This gives you control over the whole field rendering. Be sure to provide the `onCustomRender` method to render your control in the collection data. |
 
 ![](https://telemetry.sharepointpnp.com/sp-dev-fx-property-controls/wiki/FieldCollectionData)

docs/documentation/docs/assets/ViewPicker2.png

@@ -50,6 +50,19 @@ private _onFolderSelect = (folder: IFolder): void => {
 }
 ```
 
+- If you want to pick a folder outside the current site collection (not the one targeted by the SPFx context), you have to specify which site collection owns the folder. You can do this by setting the `siteAbsoluteUrl` property to the URL of the site collection that owns the folder.
+
+```TypeScript
+<FolderPicker context={this.props.context}
+                label='Folder Picker'
+                rootFolder={{
+                  Name: 'Documents',
+                  ServerRelativeUrl: '/sites/anotherSite/Shared Documents'
+                }}
+                siteAbsoluteUrl="https://contoso.sharepoint.com/sites/anotherSite"             
+                onSelect={this._onFolderSelect} />
+```
+
 ## Implementation
 
 The `FolderPicker` control can be configured with the following properties:
@@ -59,6 +72,7 @@ The `FolderPicker` control can be configured with the following properties:
 | context | BaseComponentContext | yes | The context object of the SPFx loaded webpart or customizer. |
 | label | string | yes | The label for the control. |
 | rootFolder | IFolder | yes | The lowest level folder that can be explored. This can be the root folder of a library. |
+| siteAbsoluteUrl | string | no | The absolute url of the target site. Only required if rootFolder does not belongs to the current site |
 | defaultFolder | IFolder | no | The default folder to be selected or explored. |
 | required | boolean | no | Is selection required. |
 | disabled | boolean | no | Is the control disabled. |