People Picker (#825)

* Upgraded to SPFx 1.6.0

* Added semi colons to keep Lint happy

* Upgraded SPFx to 1.8..0

samples/react-peoplepicker/config/tslint.json

@@ -1,45 +0,0 @@
-{
-  "$schema": "https://dev.office.com/json-schemas/core-build/tslint.schema.json",
-  // Display errors as warnings
-  "displayAsWarning": true,
-  // The TSLint task may have been configured with several custom lint rules
-  // before this config file is read (for example lint rules from the tslint-microsoft-contrib
-  // project). If true, this flag will deactivate any of these rules.
-  "removeExistingRules": true,
-  // When true, the TSLint task is configured with some default TSLint "rules.":
-  "useDefaultConfigAsBase": false,
-  // Since removeExistingRules=true and useDefaultConfigAsBase=false, there will be no lint rules
-  // which are active, other than the list of rules below.
-  "lintConfig": {
-    // Opt-in to Lint rules which help to eliminate bugs in JavaScript
-    "rules": {
-      "class-name": false,
-      "export-name": false,
-      "forin": false,
-      "label-position": false,
-      "member-access": true,
-      "no-arg": false,
-      "no-console": false,
-      "no-construct": false,
-      "no-duplicate-case": true,
-      "no-duplicate-variable": true,
-      "no-eval": false,
-      "no-function-expression": true,
-      "no-internal-module": true,
-      "no-shadowed-variable": true,
-      "no-switch-case-fall-through": true,
-      "no-unnecessary-semicolons": true,
-      "no-unused-expression": true,
-      "no-use-before-declare": true,
-      "no-with-statement": true,
-      "semicolon": true,
-      "trailing-comma": false,
-      "typedef": false,
-      "typedef-whitespace": false,
-      "use-named-parameter": true,
-      "valid-typeof": true,
-      "variable-name": false,
-      "whitespace": false
-    }
-  }
-}

samples/react-peoplepicker/index.ts

@@ -0,0 +1 @@
+// A file is required to be in the root of the /src directory by the TypeScript compiler

samples/react-peoplepicker/package.json

@@ -5,30 +5,37 @@
   "engines": {
     "node": ">=0.10.0"
   },
-  "dependencies": {
-    "react": "15.4.2",
-    "react-dom": "15.4.2",
-    "@types/react": "15.0.38",
-    "@types/react-dom": "0.14.18",
-    "@types/react-addons-shallow-compare": "0.14.17",
-    "@types/react-addons-update": "0.14.14",
-    "@types/react-addons-test-utils": "0.14.15",
-    "@microsoft/sp-core-library": "~1.3.0",
-    "@microsoft/sp-webpart-base": "~1.3.0",
-    "@microsoft/sp-lodash-subset": "~1.3.0",
-    "@types/webpack-env": ">=1.12.1 <1.14.0"
-  },
-  "devDependencies": {
-    "@microsoft/sp-build-web": "~1.3.0",
-    "@microsoft/sp-module-interfaces": "~1.3.0",
-    "@microsoft/sp-webpart-workbench": "~1.3.0",
-    "gulp": "~3.9.1",
-    "@types/chai": ">=3.4.34 <3.6.0",
-    "@types/mocha": ">=2.2.33 <2.6.0"
-  },
   "scripts": {
     "build": "gulp bundle",
     "clean": "gulp clean",
     "test": "gulp test"
+  },
+  "dependencies": {
+    "react": "16.7.0",
+    "react-dom": "16.7.0",
+    "@types/react": "16.4.2",
+    "@types/react-dom": "16.0.5",
+    "@microsoft/sp-core-library": "1.8.0",
+    "@microsoft/sp-property-pane": "1.8.0",
+    "@microsoft/sp-webpart-base": "1.8.0",
+    "@microsoft/sp-lodash-subset": "1.8.0",
+    "@microsoft/sp-office-ui-fabric-core": "1.8.0",
+    "office-ui-fabric-react": "5.132.0",
+    "@types/webpack-env": "1.13.1",
+    "@types/es6-promise": "0.0.33"
+  },
+  "resolutions": {
+    "@types/react": "16.4.2"
+  },
+  "devDependencies": {
+    "@microsoft/sp-build-web": "1.8.0",
+    "@microsoft/sp-tslint-rules": "1.8.0",
+    "@microsoft/sp-module-interfaces": "1.8.0",
+    "@microsoft/sp-webpart-workbench": "1.8.0",
+    "@microsoft/rush-stack-compiler-2.7": "0.4.0",
+    "gulp": "~3.9.1",
+    "@types/chai": "3.4.34",
+    "@types/mocha": "2.2.38",
+    "ajv": "~5.2.2"
   }
 }

samples/react-peoplepicker/src/index.ts

@@ -0,0 +1 @@
+// A file is required to be in the root of the /src directory by the TypeScript compiler

samples/react-peoplepicker/src/webparts/officeUiFabricPeoplePicker/components/OfficeUiFabricPeoplePicker.tsx

@@ -28,7 +28,7 @@ import {
   IEnsureUser,
   IOfficeUiFabricPeoplePickerState,
   SharePointUserPersona } from '../models/OfficeUiFabricPeoplePicker';
-import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
+  import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types';
 
 const suggestionProps: IBasePickerSuggestionsProps = {
   suggestionsHeaderText: 'Suggested People',
@@ -67,8 +67,8 @@ export default class OfficeUiFabricPeoplePicker extends React.Component<IOfficeU
       disabled: true
     }
   ];
-  constructor() {
+  constructor(props: IOfficeUiFabricPeoplePickerProps) {
-    super();
+    super(props);
     this._peopleList = [];
     people.forEach((persona: IPersonaProps) => {
       let target: IPersonaWithMenu = {};

samples/react-peoplepicker/tsconfig.json

@@ -1,16 +1,38 @@
 {
+  "extends": "./node_modules/@microsoft/rush-stack-compiler-2.7/includes/tsconfig-web.json",
   "compilerOptions": {
     "target": "es5",
     "forceConsistentCasingInFileNames": true,
-    "module": "commonjs",
+    "module": "esnext",
+    "moduleResolution": "node",
     "jsx": "react",
     "declaration": true,
     "sourceMap": true,
     "experimentalDecorators": true,
+    "skipLibCheck": true,
+    "outDir": "lib",
+    "inlineSources": false,
+    "strictNullChecks": false,
+    "noUnusedLocals": false,
+    "typeRoots": [
+      "./node_modules/@types",
+      "./node_modules/@microsoft"
+    ],
     "types": [
       "es6-promise",
-      "es6-collections",
       "webpack-env"
+    ],
+    "lib": [
+      "es5",
+      "dom",
+      "es2015.collection"
     ]
-  }
+  },
-}
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules",
+    "lib"
+  ]
+}

samples/react-peoplepicker/tslint.json

@@ -1,3 +1,30 @@
 {
-    "rulesDirectory": "./config"
+    "extends": "@microsoft/sp-tslint-rules/base-tslint.json",
-}
+    "rules": {
+      "class-name": false,
+      "export-name": false,
+      "forin": false,
+      "label-position": false,
+      "member-access": true,
+      "no-arg": false,
+      "no-console": false,
+      "no-construct": false,
+      "no-duplicate-variable": true,
+      "no-eval": false,
+      "no-function-expression": true,
+      "no-internal-module": true,
+      "no-shadowed-variable": true,
+      "no-switch-case-fall-through": true,
+      "no-unnecessary-semicolons": true,
+      "no-unused-expression": true,
+      "no-use-before-declare": true,
+      "no-with-statement": true,
+      "semicolon": true,
+      "trailing-comma": false,
+      "typedef": false,
+      "typedef-whitespace": false,
+      "use-named-parameter": true,
+      "variable-name": false,
+      "whitespace": false
+    }
+  }