feat(ng-mat-core): Introducing @s-libs/ng-mat-core! A library of ut…

…ility for Angular Material. The first things available: `SlDialogService` (#71)
simontonsoftware · Dec 18, 2021 · 91de8e6 · 91de8e6
1 parent c850e95
commit 91de8e6
Show file tree

Hide file tree

Showing 47 changed files with 1,132 additions and 30 deletions.
diff --git a/.idea/runConfigurations/ng_mat_core___build.xml b/.idea/runConfigurations/ng_mat_core___build.xml
diff --git a/.idea/runConfigurations/ng_mat_core___test_server.xml b/.idea/runConfigurations/ng_mat_core___test_server.xml
diff --git a/.idea/s-libs.iml b/.idea/s-libs.iml
diff --git a/angular.json b/angular.json
@@ -432,6 +432,47 @@
         }
       }
     },
+    "ng-mat-core": {
+      "projectType": "library",
+      "root": "projects/ng-mat-core",
+      "sourceRoot": "projects/ng-mat-core/src",
+      "prefix": "lib",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "project": "projects/ng-mat-core/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "projects/ng-mat-core/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "projects/ng-mat-core/tsconfig.lib.json"
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "projects/ng-mat-core/src/test.ts",
+            "tsConfig": "projects/ng-mat-core/tsconfig.spec.json",
+            "karmaConfig": "projects/ng-mat-core/karma.conf.js",
+            "polyfills": "projects/ng-mat-core/src/test-polyfills.ts"
+          }
+        },
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": [
+              "projects/ng-mat-core/**/*.ts",
+              "projects/ng-mat-core/**/*.html"
+            ]
+          }
+        }
+      }
+    },
     "rxjs-core": {
       "projectType": "library",
       "root": "projects/rxjs-core",

diff --git a/package.json b/package.json
@@ -19,10 +19,12 @@
   },
   "dependencies": {
     "@angular/animations": "~13.0.0",
+    "@angular/cdk": "~13.0.0",
     "@angular/common": "~13.0.0",
     "@angular/compiler": "~13.0.0",
     "@angular/core": "~13.0.0",
     "@angular/forms": "~13.0.0",
+    "@angular/material": "~13.0.0",
     "@angular/platform-browser": "~13.0.0",
     "@angular/platform-browser-dynamic": "~13.0.0",
     "@angular/router": "~13.0.0",
@@ -38,10 +40,8 @@
     "@angular-eslint/eslint-plugin-template": "13.0.1",
     "@angular-eslint/schematics": "13.0.1",
     "@angular-eslint/template-parser": "13.0.1",
-    "@angular/cdk": "~13.0.0-next.0",
     "@angular/cli": "~13.0.2",
     "@angular/compiler-cli": "~13.0.0",
-    "@angular/material": "~13.0.1",
     "@types/glob": "^7.2.0",
     "@types/jasmine": "~3.10.0",
     "@types/lodash-es": "^4.17.3",

diff --git a/projects/app-state/.browserslistrc b/projects/app-state/.browserslistrc
@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR
diff --git a/projects/app-state/package.json b/projects/app-state/package.json
@@ -14,5 +14,7 @@
     "@s-libs/micro-dash": "^13.0.0",
     "@s-libs/rxjs-core": "^13.0.0"
   },
-  "dependencies": { "tslib": "^2.3.0" }
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
 }
diff --git a/projects/integration/src/app/app-state-performance/app-state-performance.component.ts b/projects/integration/src/app/app-state-performance/app-state-performance.component.ts
@@ -4,6 +4,6 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
   selector: 'sl-app-state-performance',
   templateUrl: './app-state-performance.component.html',
   styleUrls: ['./app-state-performance.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AppStatePerformanceComponent {}
diff --git a/projects/js-core/.browserslistrc b/projects/js-core/.browserslistrc
@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR
diff --git a/projects/js-core/package.json b/projects/js-core/package.json
@@ -9,6 +9,10 @@
     "url": "https://github.com/simontonsoftware/s-libs.git",
     "directory": "projects/js-core"
   },
-  "peerDependencies": { "@s-libs/micro-dash": "^13.0.0" },
-  "dependencies": { "tslib": "^2.3.0" }
+  "peerDependencies": {
+    "@s-libs/micro-dash": "^13.0.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
 }
diff --git a/projects/micro-dash/.browserslistrc b/projects/micro-dash/.browserslistrc
@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR
diff --git a/projects/micro-dash/package.json b/projects/micro-dash/package.json
@@ -10,5 +10,8 @@
     "url": "https://github.com/simontonsoftware/s-libs.git",
     "directory": "projects/micro-dash"
   },
-  "dependencies": { "tslib": "^2.3.0", "utility-types": "^3.10.0" }
+  "dependencies": {
+    "tslib": "^2.3.0",
+    "utility-types": "^3.10.0"
+  }
 }
diff --git a/projects/ng-app-state/.browserslistrc b/projects/ng-app-state/.browserslistrc
@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR
diff --git a/projects/ng-app-state/package.json b/projects/ng-app-state/package.json
@@ -17,5 +17,7 @@
     "@s-libs/ng-core": "^13.0.0",
     "@s-libs/rxjs-core": "^13.0.0"
   },
-  "dependencies": { "tslib": "^2.3.0" }
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
 }
diff --git a/projects/ng-core/.browserslistrc b/projects/ng-core/.browserslistrc
@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR
diff --git a/projects/ng-core/README.md b/projects/ng-core/README.md
@@ -7,9 +7,9 @@ To quickly see what is available, see the [api documentation](https://simontonso
 Install along with its peer dependencies using:
 
 ```shell script
-npm install --save @s-libs/js-core @s-libs/micro-dash
+npm install --save @s-libs/rxjs-core @s-libs/js-core @s-libs/micro-dash
 
 # OR
 
-yarn add @s-libs/js-core @s-libs/micro-dash
+yarn add @s-libs/rxjs-core @s-libs/js-core @s-libs/micro-dash
 ```
diff --git a/projects/ng-core/package.json b/projects/ng-core/package.json
@@ -16,5 +16,7 @@
     "@s-libs/micro-dash": "^13.0.0",
     "@s-libs/rxjs-core": "^13.0.0"
   },
-  "dependencies": { "tslib": "^2.3.0" }
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
 }
diff --git a/projects/ng-dev/.browserslistrc b/projects/ng-dev/.browserslistrc
@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR
diff --git a/projects/ng-dev/README.md b/projects/ng-dev/README.md
@@ -8,3 +8,52 @@ To quickly see what is available, see the [api documentation](https://simontonso
 yarn add @s-libs/ng-core @s-libs/rxjs-core @s-libs/js-core @s-libs/micro-dash @angular/cdk
 yarn add -D @s-libs/ng-dev
 ```
+
+## Fixing Jasmine Clock
+
+If you are creating a library project and use [`Angular Context`](https://simontonsoftware.github.io/s-libs/ng-dev/classes/AngularContext.html) or [`Component Context`](https://simontonsoftware.github.io/s-libs/ng-dev/classes/ComponentContext.html) for its tests, you may run into this error:
+
+```
+Error: Jasmine Clock was unable to install over custom global timer functions. Is the clock already installed?
+```
+
+You can see details on Angular's issue filed [here](https://github.com/angular/angular-cli/issues/14432). To work around it, create a new file `projects/your-lib-name/src/test-polyfills.ts` with this code:
+
+```ts
+// This file can be deleted after https://github.com/angular/angular-cli/issues/14432. Be sure to delete it from `angular.json`, `tsconfig.lib.json`, and `tsconfig.spec.json`, too.
+import "zone.js";
+```
+
+Add this innermost "polyfills" line to your `angular.json`:
+
+```json
+{
+  "projects": {
+    "your-lib-name": {
+      "architect": {
+        "test": {
+          "options": {
+            "polyfills": "projects/ng-mat-core/src/test-polyfills.ts"
+          }
+        }
+      }
+    }
+  }
+}
+```
+
+Add it to the "exclude" property in your `tsconfig.lib.json`:
+
+```json
+{
+  "exclude": ["src/test-polyfills.ts"]
+}
+```
+
+Add it to the "include" property in `tsconfig.spec.json`:
+
+```json
+{
+  "include": ["src/test-polyfills.ts"]
+}
+```
diff --git a/projects/ng-dev/package.json b/projects/ng-dev/package.json
@@ -19,5 +19,7 @@
     "@s-libs/rxjs-core": "^13.0.0",
     "jasmine-core": "^3.10.0"
   },
-  "dependencies": { "tslib": "^2.3.0" }
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
 }
diff --git a/projects/ng-mat-core/.browserslistrc b/projects/ng-mat-core/.browserslistrc
@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR
diff --git a/projects/ng-mat-core/.eslintrc.json b/projects/ng-mat-core/.eslintrc.json
@@ -0,0 +1,21 @@
+{
+  "extends": "../../.eslintrc.json",
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts"],
+      "parserOptions": {
+        "project": [
+          "projects/ng-mat-core/tsconfig.lib.json",
+          "projects/ng-mat-core/tsconfig.spec.json"
+        ],
+        "createDefaultProgram": true
+      },
+      "rules": {}
+    },
+    {
+      "files": ["*.html"],
+      "rules": {}
+    }
+  ]
+}