Merge branch 'tsekityam-patch-4' into dev

Author: estruyf

docs/documentation/docs/controls/PeoplePicker.md

@@ -72,6 +72,7 @@ The People picker control can be configured with the following properties:
 | 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. |
+| resultsMaximumNumber | number | no | Maximum number of suggestions to show in the full suggestion list. Default is 5. |
 
 Enum `PrincipalType`
 

src/controls/peoplepicker/IPeoplePicker.ts

@@ -28,6 +28,10 @@ export interface IPeoplePickerProps {
    * Name of SharePoint Group
    */
   groupName?: string;
+  /**
+   * Maximum number of suggestions to show in the full suggestion list. (default: 5)
+   */
+  resultsMaximumNumber?: number;
   /**
    * Selection Limit of Control
    */

src/controls/peoplepicker/PeoplePickerComponent.tsx

@@ -17,12 +17,6 @@ import { IPersonaProps } from "office-ui-fabric-react/lib/components/Persona/Per
 import { MessageBarType } from "office-ui-fabric-react/lib/components/MessageBar";
 import { ValidationState } from 'office-ui-fabric-react/lib/components/pickers/BasePicker.types';
 
-const suggestionProps: IBasePickerSuggestionsProps = {
-  suggestionsHeaderText: 'Suggested People',
-  noResultsFoundText: 'No results found',
-  loadingText: 'Loading'
-};
-
 /**
 * PeoplePicker component
 */
@@ -367,6 +361,14 @@ export class PeoplePicker extends React.Component<IPeoplePickerProps, IPeoplePic
    * Default React component render method
    */
   public render(): React.ReactElement<IPeoplePickerProps> {
+    const suggestionProps: IBasePickerSuggestionsProps = {
+      suggestionsHeaderText: strings.peoplePickerSuggestionsHeaderText,
+      noResultsFoundText: strings.peoplePickerNoResultsFoundText,
+      loadingText: strings.peoplePickerLoadingText,
+      resultsMaximumNumber: this.props.resultsMaximumNumber ? this.props.resultsMaximumNumber : 5
+    };
+
+
     const peoplepicker = (
       <div id="people" className={`${styles.defaultClass} ${this.props.peoplePickerWPclassName ? this.props.peoplePickerWPclassName : ''}`}>
         <Label>{this.props.titleText || strings.peoplePickerComponentTitleText}</Label>

src/loc/en-us.ts

@@ -49,5 +49,8 @@ define([], () => {
     peoplePickerComponentTooltipMessage: "People Picker",
     peoplePickerComponentErrorMessage: "People picker is mandatory",
     peoplePickerComponentTitleText: "Pick the user(s)",
+    peoplePickerSuggestionsHeaderText: 'Suggested People',
+    peoplePickerNoResultsFoundText: 'No results found',
+    peoplePickerLoadingText: 'Loading'
   };
 });

src/loc/mystrings.d.ts

@@ -2,6 +2,11 @@ declare interface IControlStrings {
   peoplePickerComponentTooltipMessage: string;
   peoplePickerComponentErrorMessage: string;
   peoplePickerComponentTitleText: string;
+  peoplePickerSuggestionsHeaderText: string;
+  peoplePickerNoResultsFoundText: string;
+  peoplePickerLoadingText: string;
+
+
   SiteBreadcrumbLabel: string;
   ListViewGroupEmptyLabel: string;
   WebPartTitlePlaceholder: string;

src/webparts/controlsTest/components/ControlsTest.tsx

@@ -350,7 +350,8 @@ private onServicePickerChange(terms: IPickerTerms): void {
             defaultSelectedUsers={["[email protected]", "[email protected]"]}
             selectedItems={this._getPeoplePickerItems}
             showHiddenInUI={false}
-            principleTypes={[PrincipalType.User]} />
+            principleTypes={[PrincipalType.User]}
+            resultsMaximumNumber={2} />
 
           <PeoplePicker
             context={this.props.context}