Merge pull request #172 from SharePoint/dev

Merge for v1.10.0 release

Author: estruyf

.circleci/config.yml

@@ -1,7 +1,7 @@
 defaults: &defaults
   working_directory: ~/sp-dev-fx-controls-react
   docker:
-    - image: circleci/node:6.11.5
+    - image: circleci/node:8.9.1
 
 version: 2
 jobs:

CHANGELOG.JSON

@@ -1,5 +1,36 @@
 {
   "versions": [
+    {
+      "version": "1.10.0",
+      "changes": {
+        "new": [
+          "`ListItemPicker`: New field control [#165](https://github.com/SharePoint/sp-dev-fx-controls-react/pull/165)"
+        ],
+        "enhancements": [
+          "Dutch localization added [#100](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/100)",
+          "German localization added [#101](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/101)",
+          "French localization added [#102](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/102)",
+          "`PeoplePicker`: Move defaultSelectedUsers from ComponentWillMount to ComponentDidUpdate Lifecycle [#135](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/135)",
+          "`PeoplePicker`: Initialize with users from a list item [#138](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/138)",
+          "`PeoplePicker`: Remove Messagebar error handling to match Office UI Fabric field error styling [#140](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/140)",
+          "`PeoplePicker`: REST API filter and nometadata header added to reduce payload [#139](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/139)",
+          "`PeoplePicker`: Allow to set the maximum number of suggestions `suggestionsLimit` [#143](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/143) [#148](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/148)",
+          "`TaxonomyPicker`: retreiving the terms in the correct custom sort order [#146](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/146)",
+          "`PeoplePicker`: Documentation format updated to make it easier to check the default values [#159](https://github.com/SharePoint/sp-dev-fx-controls-react/pull/159)"
+        ],
+        "fixes": []
+      },
+      "contributions": [
+        "[Marc D Anderson](https://github.com/sympmarc)",
+        "[Ole Bergtun](https://github.com/trillian74)",
+        "[João Mendes](https://github.com/joaojmendes)",
+        "[Markus Möller](https://github.com/mmsharepoint)",
+        "[Asish Padhy](https://github.com/AsishP)",
+        "[PooLP](https://github.com/PooLP)",
+        "[Gautam Sheth](https://github.com/gautamdsheth)",
+        "[Tse Kit Yam](https://github.com/tsekityam)"
+      ]
+    },
     {
       "version": "1.9.0",
       "changes": {

CHANGELOG.md

@@ -1,5 +1,28 @@
 # Releases
 
+## 1.10.0
+
+**New control(s)**
+
+- `ListItemPicker`: New field control [#165](https://github.com/SharePoint/sp-dev-fx-controls-react/pull/165)
+
+**Enhancements**
+
+- Dutch localization added [#100](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/100)
+- German localization added [#101](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/101)
+- French localization added [#102](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/102)
+- `PeoplePicker`: Move defaultSelectedUsers from ComponentWillMount to ComponentDidUpdate Lifecycle [#135](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/135)
+- `PeoplePicker`: Initialize with users from a list item [#138](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/138)
+- `PeoplePicker`: Remove Messagebar error handling to match Office UI Fabric field error styling [#140](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/140)
+- `PeoplePicker`: REST API filter and nometadata header added to reduce payload [#139](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/139)
+- `PeoplePicker`: Allow to set the maximum number of suggestions `suggestionsLimit` [#143](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/143) [#148](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/148)
+- `TaxonomyPicker`: retreiving the terms in the correct custom sort order [#146](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/146)
+- `PeoplePicker`: Documentation format updated to make it easier to check the default values [#159](https://github.com/SharePoint/sp-dev-fx-controls-react/pull/159)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Marc D Anderson](https://github.com/sympmarc), [Ole Bergtun](https://github.com/trillian74), [João Mendes](https://github.com/joaojmendes), [Markus Möller](https://github.com/mmsharepoint), [Asish Padhy](https://github.com/AsishP), [PooLP](https://github.com/PooLP), [Gautam Sheth](https://github.com/gautamdsheth), [Tse Kit Yam](https://github.com/tsekityam).
+
 ## 1.9.0
 
 **Enhancements**
@@ -12,6 +35,10 @@
 - `IFrameDialog`: Unnecessary horizontal scroll in IFrame dialog [#132](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/132)
 - `PeoplePicker`: Suggested People not loading after first selection [#134](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/134)
 
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Gautam Sheth](https://github.com/gautamdsheth), [Alex Terentiev](https://github.com/AJIXuMuK).
+
 ## 1.8.0
 
 **Enhancements**
@@ -32,6 +59,10 @@
 - `IFrameDialog`: dialog width is not correct in IE11 [#118](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/118)
 - `PeoplePicker`: fix freezes when typing in search values [#117](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/117)
 
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Thomas Lamb](https://github.com/ThomasLamb), [Joel Rodrigues](https://github.com/joelfmrodrigues), [Mikael Svenson](https://github.com/wobba), [Alex Terentiev](https://github.com/AJIXuMuK).
+
 ## 1.7.0
 
 **Enhancements**
@@ -45,6 +76,10 @@
 
 - `FieldNameRenderer` onClick does not suppress default link behavior [#103](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/103)
 
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): Octavie van Haaften, Asish Padhy, Mikael Svenson, Alex Terentiev.
+
 ## 1.6.0
 
 **Enhancements**
@@ -56,6 +91,10 @@
 - New telemetry approach which allows you to use Application Insights [#81](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/81)
 - PeoplePicker property selectedItems not implemented? [#90](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/90)
 
+### Contributors
+
+Special thanks to our contributor: Octavie van Haaften.
+
 ## 1.5.0
 
 **New control(s)**
@@ -72,6 +111,10 @@
 - `FieldUserRenderer` uses email prop for `GetPropertiesFor` [#84](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/84)
 - Fixed issue in single selection mode when all group items were selected in the `ListView` when user clicked on the group header [#86](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/86)
 
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): Asish Padhy, Alex Terentiev.
+
 ## 1.4.0
 
 **New control(s)**

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

@@ -1,5 +1,28 @@
 # Releases
 
+## 1.10.0
+
+**New control(s)**
+
+- `ListItemPicker`: New field control [#165](https://github.com/SharePoint/sp-dev-fx-controls-react/pull/165)
+
+**Enhancements**
+
+- Dutch localization added [#100](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/100)
+- German localization added [#101](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/101)
+- French localization added [#102](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/102)
+- `PeoplePicker`: Move defaultSelectedUsers from ComponentWillMount to ComponentDidUpdate Lifecycle [#135](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/135)
+- `PeoplePicker`: Initialize with users from a list item [#138](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/138)
+- `PeoplePicker`: Remove Messagebar error handling to match Office UI Fabric field error styling [#140](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/140)
+- `PeoplePicker`: REST API filter and nometadata header added to reduce payload [#139](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/139)
+- `PeoplePicker`: Allow to set the maximum number of suggestions `suggestionsLimit` [#143](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/143) [#148](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/148)
+- `TaxonomyPicker`: retreiving the terms in the correct custom sort order [#146](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/146)
+- `PeoplePicker`: Documentation format updated to make it easier to check the default values [#159](https://github.com/SharePoint/sp-dev-fx-controls-react/pull/159)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Marc D Anderson](https://github.com/sympmarc), [Ole Bergtun](https://github.com/trillian74), [João Mendes](https://github.com/joaojmendes), [Markus Möller](https://github.com/mmsharepoint), [Asish Padhy](https://github.com/AsishP), [PooLP](https://github.com/PooLP), [Gautam Sheth](https://github.com/gautamdsheth), [Tse Kit Yam](https://github.com/tsekityam).
+
 ## 1.9.0
 
 **Enhancements**
@@ -12,6 +35,10 @@
 - `IFrameDialog`: Unnecessary horizontal scroll in IFrame dialog [#132](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/132)
 - `PeoplePicker`: Suggested People not loading after first selection [#134](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/134)
 
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Gautam Sheth](https://github.com/gautamdsheth), [Alex Terentiev](https://github.com/AJIXuMuK).
+
 ## 1.8.0
 
 **Enhancements**
@@ -32,6 +59,10 @@
 - `IFrameDialog`: dialog width is not correct in IE11 [#118](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/118)
 - `PeoplePicker`: fix freezes when typing in search values [#117](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/117)
 
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Thomas Lamb](https://github.com/ThomasLamb), [Joel Rodrigues](https://github.com/joelfmrodrigues), [Mikael Svenson](https://github.com/wobba), [Alex Terentiev](https://github.com/AJIXuMuK).
+
 ## 1.7.0
 
 **Enhancements**
@@ -45,6 +76,10 @@
 
 - `FieldNameRenderer` onClick does not suppress default link behavior [#103](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/103)
 
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): Octavie van Haaften, Asish Padhy, Mikael Svenson, Alex Terentiev.
+
 ## 1.6.0
 
 **Enhancements**
@@ -56,6 +91,10 @@
 - New telemetry approach which allows you to use Application Insights [#81](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/81)
 - PeoplePicker property selectedItems not implemented? [#90](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/90)
 
+### Contributors
+
+Special thanks to our contributor: Octavie van Haaften.
+
 ## 1.5.0
 
 **New control(s)**
@@ -72,6 +111,10 @@
 - `FieldUserRenderer` uses email prop for `GetPropertiesFor` [#84](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/84)
 - Fixed issue in single selection mode when all group items were selected in the `ListView` when user clicked on the group header [#86](https://github.com/SharePoint/sp-dev-fx-controls-react/issues/86)
 
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): Asish Padhy, Alex Terentiev.
+
 ## 1.4.0
 
 **New control(s)**

docs/documentation/docs/assets/ListItemPicker-selectedItems.png

@@ -0,0 +1,59 @@
+# ListItemPicker control
+
+This control allows you to select one or more items from a list. The item selection is based from a column value. The control will suggest items based on the inserted value.
+
+Here is an example of the control:
+
+![ListItemPicker select list items](../assets/ListItemPicker-selectlist.png)
+
+![ListItemPicker select list items](../assets/ListItemPicker-selectlist2.png)
+
+![ListItemPicker selected Items](../assets/ListItemPicker-selectedItems.png)
+
+## How to use this control in your solutions
+
+- 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.
+- Import the control into your component:
+
+```TypeScript
+import { ListItemPicker } from '@pnp/spfx-controls-react/listItemPicker';
+```
+- Use the `ListItemPicker` control in your code as follows:
+
+```TypeScript
+<ListItemPicker listId='da8daf15-d84f-4ab1-9800-7568f82fed3f'
+                columnInternalName='Title'
+                itemLimit={2}
+                onSelectedItem={this.onSelectedItem}
+                context={this.props.context} />
+```
+
+- The `onSelectedItem` change event returns the list items selected and can be implemented as follows:
+
+```TypeScript
+private onSelectedItem(data: { key: string; name: string }[]) {
+  for (const item of data) {
+    console.log(`Item value: ${item.name}`);
+  }
+}
+```
+## Implementation
+
+The `ListItemPicker` control can be configured with the following properties:
+
+
+| Property | Type | Required | Description |
+| ---- | ---- | ---- | ---- |
+| columnInternalName | string | yes | InternalName of column to search and get values. |
+| context | WebPartContext \| ApplicationCustomizerContext | yes | SPFx web part or extention context |
+| listId | string | yes | Guid of the list. |
+| itemLimit | number | yes | Number of items which can be selected |
+| onSelectItem | (items: any[]) => void | yes | Callback function which returns the selected items. |
+| className | string | no | ClassName for the picker. |
+| webUrl | string | no | URL of the site. By default it uses the current site URL. |
+| defaultSelectedItems | any[] | no | Initial items that have already been selected and should appear in the people picker. |
+| suggestionsHeaderText | string | no | The text that should appear at the top of the suggestion box. |
+| noResultsFoundText | string | no | The text that should appear when no results are returned. |
+| disabled | boolean | no | Specifies if the control is disabled or not. |
+
+![](https://telemetry.sharepointpnp.com/sp-dev-fx-controls-react/wiki/controls/ListItemPicker)

docs/documentation/docs/assets/ListItemPicker-selectlist.png

@@ -52,26 +52,27 @@ private _getPeoplePickerItems(items: any[]) {
 
 The People picker control can be configured with the following properties:
 
-| Property | Type | Required | Description |
-| ---- | ---- | ---- | ---- |
-| context | WebPartContext | yes | Context of the current web part. |
-| titleText | string | yes | Text to be displayed on the control |
-| groupName | string | no | group from which users are fetched. Leave it blank if need to filter all users |
-| personSelectionLimit | number | no | Defines the limit of people that can be selected in the control|
-| isRequired | boolean | no | Set if the control is required or not |
-| disabled | boolean | no | Set if the control is disabled or not |
-| errorMessage | string | no | Specify the error message to display |
-| errorMessageclassName | string | no | applies custom styling to the error message section|
-| showtooltip | boolean | no | Defines if need a tooltip or not |
-| tooltip | string | no | Specify the tooltip message to display |
-| tooltipDirectional | DirectionalHint | no | Direction where the tooltip would be shown |
-| selectedItems | function | no | get the selected users in the control |
-| peoplePickerWPclassName | string | no | applies custom styling to the people picker element |
-| peoplePickerCntrlclassName | string | no | applies custom styling to the people picker control only |
-| defaultSelectedUsers | string[] | no | Default selected user emails |
-| webAbsoluteUrl | string | no | Specify the site URL on which you want to perform the user query call. Default is the current site URL. |
-| showHiddenInUI | boolean | no | Show users which are hidden from the UI. By default these users/groups hidden for the UI will not be shown. |
-| principleTypes | PrincipleType[] | no | Define which type of data you want to retrieve: User, SharePoint groups, Security groups. Multiple are possible. |
+| Property | Type | Required | Description | Default |
+| ---- | ---- | ---- | ---- | ---- |
+| context | WebPartContext | yes | Context of the current web part. | |
+| titleText | string | yes | Text to be displayed on the control | |
+| groupName | string | no | group from which users are fetched. Leave it blank if need to filter all users | _none_ |
+| personSelectionLimit | number | no | Defines the limit of people that can be selected in the control | |
+| isRequired | boolean | no | Set if the control is required or not | false |
+| disabled | boolean | no | Set if the control is disabled or not | false |
+| errorMessage | string | no | Specify the error message to display | |
+| errorMessageClassName | string | no | applies custom styling to the error message section | |
+| showtooltip | boolean | no | Defines if need a tooltip or not | false |
+| tooltip | string | no | Specify the tooltip message to display | |
+| tooltipDirectional | DirectionalHint | no | Direction where the tooltip would be shown | |
+| selectedItems | function | no | get the selected users in the control | |
+| peoplePickerWPclassName | string | no | applies custom styling to the people picker element | |
+| peoplePickerCntrlclassName | string | no | applies custom styling to the people picker control only | |
+| defaultSelectedUsers | string[] | no | Default selected user emails | |
+| webAbsoluteUrl | string | no | Specify the site URL on which you want to perform the user query call. | Current site URL |
+| showHiddenInUI | boolean | no | Show users which are hidden from the UI. By default these users/groups hidden for the UI will not be shown. | false |
+| principleTypes | PrincipleType[] | no | Define which type of data you want to retrieve: User, SharePoint groups, Security groups. Multiple are possible. | |
+| suggestionsLimit | number | no | Maximum number of suggestions to show in the full suggestion list. | 5 |
 
 Enum `PrincipalType`