feat: Upgrade to angular 12

.browserslistrc

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

.circleci/config.yml

@@ -1,11 +1,14 @@
 version: 2.1
+orbs:
+  browser-tools: circleci/browser-tools@1.1.0
 jobs:
   test:
     docker:
-      - image: circleci/node:14-browsers
+      - image: cimg/node:current-browsers
         environment:
           CHROME_BIN: '/usr/bin/google-chrome'
     steps:
+      - browser-tools/install-chrome
       - checkout
       - run:
           name: npm-install
@@ -21,7 +24,7 @@ jobs:
           command: bash <(curl -s https://codecov.io/bash)
   release:
     docker:
-      - image: circleci/node:14
+      - image: cimg/node:current
     steps:
       - checkout
       - run: npm ci

.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": {}
+    }
+  ]
+}

.nvmrc

@@ -1 +1 @@
-14
+16

README.md

@@ -1,17 +1,18 @@
 # ngx-codemirror [![npm](https://badgen.net/npm/v/@ctrl/ngx-codemirror)](https://www.npmjs.com/package/@ctrl/ngx-codemirror) [![CircleCI](https://badgen.net/circleci/github/scttcper/ngx-codemirror)](https://circleci.com/gh/scttcper/ngx-codemirror) [![coverage](https://badgen.net/codecov/c/github/scttcper/ngx-codemirror)](https://codecov.io/gh/scttcper/ngx-codemirror)
 
-DEMO: https://ngx-codemirror.vercel.app  
+DEMO: https://ngx-codemirror.vercel.app
 
 ## Dependencies
 
 Latest version available for each version of Angular
 
-| @ctrl/ngx-codemirror | Angular |
-| -------------------- | ------- |
-| 1.3.10               | 6.x 7.x |
-| 2.2.1                | 8.x     |
-| 3.1.3                | 9.x     |
-| current              | >= 10.x |
+| @ctrl/ngx-codemirror | Angular   |
+| -------------------- | --------- |
+| 1.3.10               | 6.x 7.x   |
+| 2.2.1                | 8.x       |
+| 3.1.3                | 9.x       |
+| 4.1.1                | 10.x 11.x |
+| current              | >= 12.x   |
 
 An Angular component wrapper for [CodeMirror](https://codemirror.net/) that extends ngModel. Based on [JedWatson/react-codemirror](https://github.com/JedWatson/react-codemirror)
 
@@ -56,7 +57,7 @@ import 'codemirror/mode/markdown/markdown';
 
 Import the base css file and your [theme](https://codemirror.net/demo/theme.html)
 
-```scss
+```css
 @import '~codemirror/lib/codemirror';
 @import '~codemirror/theme/material';
 ```

angular.json

@@ -7,7 +7,7 @@
       "projectType": "application",
       "schematics": {
         "@schematics/angular:component": {
-          "style": "scss"
+          "style": "css"
         },
         "@schematics/angular:application": {
           "strict": true
@@ -20,16 +20,28 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
-            "allowedCommonJsDependencies": ["codemirror"],
+            "allowedCommonJsDependencies": [
+              "codemirror"
+            ],
             "outputPath": "dist",
             "index": "src/index.html",
             "main": "src/main.ts",
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.app.json",
-            "aot": true,
-            "assets": ["src/favicon.ico", "src/assets"],
-            "styles": ["src/styles.scss"],
-            "scripts": []
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.css"
+            ],
+            "scripts": [],
+            "vendorChunk": true,
+            "extractLicenses": false,
+            "buildOptimizer": false,
+            "sourceMap": true,
+            "optimization": false,
+            "namedChunks": true
           },
           "configurations": {
             "production": {
@@ -39,7 +51,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,
@@ -85,20 +106,30 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.spec.json",
             "karmaConfig": "karma.conf.js",
-            "assets": ["src/favicon.ico", "src/assets"],
-            "styles": ["src/styles.scss"],
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.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-codemirror"
+  "defaultProject": "ngx-codemirror",
+  "cli": {
+    "defaultCollection": "@angular-eslint/schematics"
+  }
 }