feat: upgrade to angular 12, eslint, update emoji datasource (scttcpe…

…r#378)

.browserslistrc

@@ -10,6 +10,8 @@
 
 last 1 Chrome version
 last 1 Firefox version
-last 1 Safari major version
-last 1 iOS major versions
-not IE 9-11
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR
+not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the 'not' prefix on this line.

.eslintrc.json

@@ -0,0 +1,34 @@
+{
+  "root": true,
+  "ignorePatterns": [
+    "projects/**/*"
+  ],
+  "overrides": [
+    {
+      "files": [
+        "*.ts"
+      ],
+      "parserOptions": {
+        "project": [
+          "tsconfig.json",
+          "e2e/tsconfig.json"
+        ],
+        "createDefaultProgram": true
+      },
+      "extends": [
+        "plugin:@angular-eslint/recommended",
+        "plugin:@angular-eslint/template/process-inline-templates"
+      ],
+      "rules": {}
+    },
+    {
+      "files": [
+        "*.html"
+      ],
+      "extends": [
+        "plugin:@angular-eslint/template/recommended"
+      ],
+      "rules": {}
+    }
+  ]
+}

README.md

@@ -10,15 +10,6 @@
 
 This project is a port of [emoji-mart](https://github.com/missive/emoji-mart) by missive
 
-- [Installation](#installation)
-- [Components](#components)
-  - [Picker](#picker)
-  - [Emoji](#emoji)
-- [Custom emojis](#custom-emojis)
-- [Headless search](#headless-search)
-- [Storage](#storage)
-- [Features](#features)
-
 ## Installation
 
 ```sh
@@ -29,12 +20,13 @@ npm install @ctrl/ngx-emoji-mart
 
 Latest version available for each version of Angular
 
-| @ctrl/ngx-emoji-mart | Angular |
-| -------------------- | ------- |
-| 0.17.0               | 6.x 7.x |
-| 1.0.6                | 8.x     |
-| 3.1.0                | 9.x     |
-| current              | >= 10.x |
+| @ctrl/ngx-emoji-mart | Angular   |
+| -------------------- | --------- |
+| 0.17.0               | 6.x 7.x   |
+| 1.0.6                | 8.x       |
+| 3.1.0                | 9.x       |
+| 5.1.1                | 10.x 11.x |
+| current              | >= 10.x   |
 
 ## Components
 
@@ -109,7 +101,7 @@ use component
 | **useButton**               | `false`                   | Uses button elements for emoji instead of spans                                                                                                                                          |
 | **enableFrequentEmojiSort** | `false`                   | Enables re-sorting of emoji on click                                                                                                                                                     |
 | **virtualize**              | `false`                   | Enables experimental virtualized rendering to render only emoji categories in view                                                                                                       |
-| **virtualizeOffset**        | `0`                       | use with virtualize option to add or subtract the amount of pixels used to determine whether or not render the category          |
+| **virtualizeOffset**        | `0`                       | use with virtualize option to add or subtract the amount of pixels used to determine whether or not render the category                                                                  |
 
 #### I18n
 
@@ -264,7 +256,7 @@ const customEmojis = [
     text: '',
     emoticons: [],
     keywords: ['test', 'flag'],
-    spriteUrl: 'https://unpkg.com/emoji-datasource-twitter@6.0.0/img/twitter/sheets-256/64.png',
+    spriteUrl: 'https://unpkg.com/emoji-datasource-twitter@6.0.1/img/twitter/sheets-256/64.png',
     sheet_x: 1,
     sheet_y: 1,
     size: 64,

angular.json

@@ -22,16 +22,21 @@
             "main": "src/main.ts",
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.app.json",
-            "aot": true,
             "assets": [
               "src/favicon.ico",
               "src/assets"
             ],
             "styles": [
-              "src/styles.scss",
+              "src/styles.css",
               "src/lib/picker/picker.css"
             ],
-            "scripts": []
+            "scripts": [],
+            "vendorChunk": true,
+            "extractLicenses": false,
+            "buildOptimizer": false,
+            "sourceMap": true,
+            "optimization": false,
+            "namedChunks": true
           },
           "configurations": {
             "production": {
@@ -41,7 +46,16 @@
                   "with": "src/environments/environment.prod.ts"
                 }
               ],
-              "optimization": true,
+              "optimization": {
+                "scripts": true,
+                "fonts": {
+                  "inline": true
+                },
+                "styles": {
+                  "minify": true,
+                  "inlineCritical": false
+                }
+              },
               "outputHashing": "all",
               "sourceMap": false,
               "namedChunks": false,
@@ -92,25 +106,26 @@
               "src/assets"
             ],
             "styles": [
-              "src/styles.scss",
+              "src/styles.css",
               "src/lib/picker/picker.css"
             ],
             "scripts": []
           }
         },
         "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
+          "builder": "@angular-eslint/builder:lint",
           "options": {
-            "tsConfig": [
-              "tsconfig.app.json",
-              "tsconfig.spec.json"
-            ],
-            "exclude": [
-              "**/node_modules/**"
+            "lintFilePatterns": [
+              "src/**/*.ts",
+              "src/**/*.html"
             ]
           }
         }
       }
-    }},
-  "defaultProject": "ngx-emoji-mart"
+    }
+  },
+  "defaultProject": "ngx-emoji-mart",
+  "cli": {
+    "defaultCollection": "@angular-eslint/schematics"
+  }
 }