Updated sample.json, readme and minor coding lint issues

samples/react-tiles-v2/README.md

@@ -13,9 +13,11 @@ This is a rebuild of the awesome project created by @hugoabernier [https://githu
 
 ![SPFx 1.11](https://img.shields.io/badge/SPFx-1.11.0-green.svg) 
 ![Node.js LTS 10.x](https://img.shields.io/badge/Node.js-LTS%2010.x-green.svg) 
-![SharePoint Online](https://img.shields.io/badge/SharePoint-Online-yellow.svg)
-![Teams N/A: Untested with Microsoft Teams](https://img.shields.io/badge/Teams-N%2FA-lightgrey.svg "Untested with Microsoft Teams") 
-![Workbench Local | Hosted](https://img.shields.io/badge/Workbench-Local%20%7C%20Hosted-green.svg)
+![Compatible with SharePoint Online](https://img.shields.io/badge/SharePoint%20Online-Compatible-green.svg)
+![Does not work with SharePoint 2019](https://img.shields.io/badge/SharePoint%20Server%202019-Incompatible-red.svg "SharePoint Server 2019 requires SPFx 1.4.1 or lower")
+![Does not work with SharePoint 2016 (Feature Pack 2)](https://img.shields.io/badge/SharePoint%20Server%202016%20(Feature%20Pack%202)-Incompatible-red.svg "SharePoint Server 2016 Feature Pack 2 requires SPFx 1.1")
+![Local Workbench Compatible](https://img.shields.io/badge/Local%20Workbench-Compatible-green.svg)
+![Hosted Workbench Compatible](https://img.shields.io/badge/Hosted%20Workbench-Compatible-green.svg)
 
 
 ## Applies to
@@ -44,8 +46,8 @@ Version|Date|Comments
 - Clone this repository
 - Ensure that you are at the solution folder
 - in the command-line run:
-  - **npm install**
-  - **gulp serve**
+  - `npm install`
+  - `gulp serve`
 
 
 ## Features
@@ -76,10 +78,10 @@ This extension illustrates the following concepts:
 
 We do not support samples, but we this community is always willing to help, and we want to improve these samples. We use GitHub to track issues, which makes it easy for  community members to volunteer their time and help resolve issues.
 
-If you encounter any issues while using this sample, [create a new issue](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=bug-report.yml&sample=react-tiles-v2&authors=@omarelanis&title=react-tiles-v2%20-%20).
+If you encounter any issues while using this sample, [create a new issue](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=bug-report.yml&sample=react-tiles-v2&authors=fthorild%20@fthorild&title=react-tiles-v2%20-%20).
 
-For questions regarding this sample, [create a new question](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=question.yml&sample=react-tiles-v2&authors=@omarelanis&title=react-tiles-v2%20-%20).
+For questions regarding this sample, [create a new question](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=question.yml&sample=react-tiles-v2&authors=fthorild%20@fthorild&title=react-tiles-v2%20-%20).
 
-Finally, if you have an idea for improvement, [make a suggestion](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=suggestion.yml&sample=react-tiles-v2&authors=@omarelanis&title=react-tiles-v2%20-%20).
+Finally, if you have an idea for improvement, [make a suggestion](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=suggestion.yml&sample=react-tiles-v2&authors=fthorild%20@fthorild&title=react-tiles-v2%20-%20).
 
 <img src="https://telemetry.sharepointpnp.com/sp-dev-fx-webparts/samples/react-tiles-v2" />

samples/react-tiles-v2/assets/sample.json

@@ -9,7 +9,7 @@
       "This solution creates a customisable Tiles Web part, it uses a stored collection from the PnP `PropertyFieldCollectionData` control and allows the user to choose the colour scheme (theme or custom) and to set the size of the tiles. By default the tiles use a fluid flex layout to use the available screen area."
     ],
     "creationDateTime": "2021-07-14",
-    "updateDateTime": "2021-07-14",
+    "updateDateTime": "2021-10-14",
     "products": [
       "SharePoint",
       "Office"
@@ -22,6 +22,10 @@
       {
         "key": "SPFX-VERSION",
         "value": "1.11"
+      },
+      {
+        "key": "PNPCONTROLS",
+        "value": "IconPicker, WebPartTitle, Placeholder, PropertyFieldCollectionData"
       }
     ],
     "thumbnails": [
@@ -37,6 +41,12 @@
         "gitHubAccount": "omarelanis",
         "pictureUrl": "https://github.com/omarelanis.png",
         "name": "Omar El-Anis"
+      },
+      {
+        "gitHubAccount": "fthorild",
+        "name": "Fredrik Thorild",
+        "company": "Sogeti Sweden",
+        "pictureUrl": "https://github.com/fthorild.png"
       }
     ],
     "references": [

samples/react-tiles-v2/src/webparts/Tiles/components/colorpicker/SimpleColorPicker.tsx

@@ -7,7 +7,7 @@ export class SimpleColorPicker extends React.Component<ISimpleColorPickerProps,
         super(props);
         this.state = { val: '#efefef' };
     }
-    handleChange = event => {
+    private handleChange = event => {
         const value = event.target.value;
         (async () => {
             await this.setState({ val: value });

samples/react-tiles-v2/src/webparts/Tiles/components/colorpicker/index.ts

@@ -1,3 +1,3 @@
-export * from './ISimpleColorPickerState'
-export * from './ISimpleColorPickerProps'
-export * from './SimpleColorPicker'
+export * from './ISimpleColorPickerState';
+export * from './ISimpleColorPickerProps';
+export * from './SimpleColorPicker';