Merge pull request #448 from TAMULib/445-reduce_dependencies

Redesign dependency list, reducing dependencies where possible.

.gitignore

@@ -62,3 +62,8 @@ src/assets/tinymce/
 
 .wvr-ud/static-assets/styles.css
 .verdaccio
+
+docs/
+static/
+development/
+.lighthouseci/

package.json

@@ -4,7 +4,7 @@
     "type": "git",
     "url": "git+https://github.com/TAMULib/tamu-library-components.git"
   },
-  "version": "2.0.2",
+  "version": "2.0.3-rc.1",
   "private": false,
   "license": "MIT",
   "engines": {
@@ -59,85 +59,68 @@
     "test:ci": "npm run test:audit && npm run test:coverage"
   },
   "dependencies": {
-    "@angular/animations": "^12.2.16",
-    "@angular/common": "^12.2.16",
-    "@angular/compiler": "^12.2.16",
-    "@angular/core": "^12.2.16",
-    "@angular/elements": "^12.2.16",
-    "@angular/forms": "^12.2.16",
-    "@angular/localize": "^12.2.16",
-    "@angular/platform-browser": "^12.2.16",
-    "@angular/platform-browser-dynamic": "^12.2.16",
-    "@angular/router": "^12.2.16",
-    "@ng-bootstrap/ng-bootstrap": "^10.0.0",
-    "@ngrx/effects": "^12.4.0",
-    "@ngrx/entity": "^12.4.0",
-    "@ngrx/store": "^12.4.0",
-    "@ngrx/store-devtools": "^12.4.0",
-    "@stomp/stompjs": "^6.1.2",
-    "@tinymce/tinymce-angular": "^4.2.4",
-    "@ungap/custom-elements": "^1.1.0",
-    "@wvr/elements": "2.0.2",
-    "bootstrap": "^4.6.2",
-    "css-element-queries": "^1.2.3",
-    "handlebars": "^4.7.7",
-    "jsdom": "^20.0.0",
-    "karma-viewport": "^1.0.9",
-    "ng-inline-svg": "^13.1.1",
-    "ng-lazyload-image": "^9.1.3",
-    "ngx-build-plus": "^12.2.0",
-    "rxjs-compat": "^6.6.7",
-    "sockjs-client": "^1.6.1",
-    "tinymce": "^6.1.2",
-    "tslib": "^2.4.0",
-    "web-animations-js": "^2.3.2",
-    "zone.js": "~0.11.8"
+    "@angular/animations": "12.2.16",
+    "@angular/elements": "12.2.16",
+    "@angular/platform-browser-dynamic": "12.2.16",
+    "@ng-bootstrap/ng-bootstrap": "10.0.0",
+    "@ngrx/effects": "12.5.1",
+    "@ngrx/entity": "12.5.1",
+    "@ngrx/store-devtools": "12.5.1",
+    "@stomp/stompjs": "6.1.2",
+    "@tinymce/tinymce-angular": "4.2.4",
+    "@wvr/elements": "next",
+    "bootstrap": "4.6.2",
+    "ng-lazyload-image": "9.1.3",
+    "ngx-build-plus": "12.2.0",
+    "sockjs-client": "1.6.1",
+    "tinymce": "6.2.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^12.2.16",
-    "@angular-devkit/schematics": "^12.2.16",
-    "@angular-eslint/eslint-plugin": "^14.0.3",
-    "@angular/cli": "^12.2.16",
-    "@angular/compiler-cli": "^12.2.16",
-    "@angular/language-service": "^12.2.16",
-    "@compodoc/compodoc": "^1.1.19",
-    "@lhci/cli": "^0.8.1",
-    "@types/jasmine": "~3.10.3",
-    "@types/jasminewd2": "~2.0.10",
-    "@types/node": "^16.11.7",
-    "@typescript-eslint/eslint-plugin": "^5.36.1",
-    "@typescript-eslint/eslint-plugin-tslint": "^5.36.1",
-    "@typescript-eslint/parser": "^5.36.1",
-    "codelyzer": "^6.0.2",
-    "compression": "^1.7.4",
-    "concat": "^1.0.3",
-    "console-stamp": "^3.0.6",
-    "coveralls": "^3.1.1",
-    "dotenv-override-true": "^6.2.2",
-    "eslint": "^8.23.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-import": "^2.26.0",
-    "glob": "^7.2.3",
-    "jasmine-core": "~3.9.0",
-    "jasmine-spec-reporter": "~7.0.0",
-    "karma": "~6.4.0",
-    "karma-chrome-launcher": "~3.1.1",
-    "karma-coverage": "^2.2.0",
-    "karma-coverage-istanbul-reporter": "~3.0.3",
-    "karma-jasmine": "~4.0.2",
-    "karma-jasmine-html-reporter": "^1.7.0",
-    "karma-ng-html2js-preprocessor": "^1.0.0",
-    "lighthouse": "^9.6.6",
-    "lighthouse-badges": "^1.1.26",
-    "ng-packagr": "^12.2.7",
-    "protractor": "~7.0.0",
-    "rimraf": "^3.0.2",
-    "shelljs": "^0.8.5",
-    "static-server": "^2.2.1",
-    "ts-node": "~10.2.1",
-    "typescript": "~4.3.5"
+    "@angular-devkit/build-angular": "12.2.16",
+    "@angular-eslint/eslint-plugin": "14.1.2",
+    "@angular/cli": "12.2.16",
+    "@compodoc/compodoc": "1.1.19",
+    "@lhci/cli": "0.9.0",
+    "@types/jasminewd2": "2.0.10",
+    "@typescript-eslint/eslint-plugin": "5.38.1",
+    "@typescript-eslint/eslint-plugin-tslint": "5.38.1",
+    "codelyzer": "6.0.2",
+    "concat": "1.0.3",
+    "console-stamp": "3.0.6",
+    "coveralls": "3.1.1",
+    "dotenv-override-true": "6.2.2",
+    "eslint": "8.24.0",
+    "eslint-config-prettier": "8.5.0",
+    "eslint-plugin-import": "2.26.0",
+    "glob": "7.2.3",
+    "jasmine": "4.4.0",
+    "jasmine-spec-reporter": "7.0.0",
+    "jsdom": "20.0.0",
+    "karma": "6.4.1",
+    "karma-chrome-launcher": "3.1.1",
+    "karma-coverage": "2.2.0",
+    "karma-coverage-istanbul-reporter": "3.0.3",
+    "karma-jasmine": "4.0.2",
+    "karma-jasmine-html-reporter": "1.7.0",
+    "karma-ng-html2js-preprocessor": "1.0.0",
+    "karma-viewport": "1.0.9",
+    "lighthouse": "9.6.7",
+    "lighthouse-badges": "1.1.26",
+    "ng-packagr": "12.2.7",
+    "protractor": "7.0.0",
+    "shelljs": "0.8.5",
+    "static-server": "2.2.1",
+    "ts-node": "10.9.1"
   },
   "overrides": {
-    "@types/eslint": "^6.1.3"
+    "@angular/core": "12.2.16",
+    "@types/eslint": "6.8.1",
+    "chokidar": "3.5.3",
+    "fs-extra": "10.1.0",
+    "glob": "7.2.3",
+    "latest-version": "7.0.0",
+    "selfsigned": "2.1.1",
+    "terser": "5.15.0",
+    "tslib": "2.4.0"
   }
 }

projects/tl-elements/ng-package.json

@@ -5,8 +5,7 @@
     "entryFile": "src/public-api.ts",
     "umdModuleIds": {
       "@wvr/elements": "elements",
-      "@tinymce/tinymce-angular": "tinymceAngular",
-      "ng-inline-svg": "ngInlineSvg"
+      "@tinymce/tinymce-angular": "tinymceAngular"
     }
   },
   "allowedNonPeerDependencies": []

projects/tl-elements/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wvr/tl-elements",
-  "version": "2.0.2",
+  "version": "2.0.3-rc.1",
   "description": "Collection of angular components for TAMU's Custom Web Component UI",
   "author": "Texas A&M University Libraries",
   "private": false,
@@ -21,13 +21,11 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "tslib": "^2.3.1"
+    "tslib": "2.4.0"
   },
   "peerDependencies": {
-    "@angular/common": "^12.2.7",
-    "@angular/core": "^12.2.7",
-    "@tinymce/tinymce-angular": "^4.2.1",
-    "@wvr/elements": "2.0.2",
-    "ng-inline-svg": "^12.1.0"
+    "@angular/common": "12.2.16",
+    "@tinymce/tinymce-angular": "4.2.4",
+    "@wvr/elements": "next"
   }
 }

projects/tl-elements/src/lib/shared/tl-shared.module.ts

@@ -3,7 +3,6 @@ import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { EditorModule } from '@tinymce/tinymce-angular';
 import { WvrSharedModule } from '@wvr/elements';
-import { InlineSVGModule } from 'ng-inline-svg';
 import { TlAlertComponent } from '../tl-alert/tl-alert.component';
 import { TlButtonComponent } from '../tl-button/tl-button.component';
 import { TlCardComponent } from '../tl-card/tl-card.component';
@@ -51,7 +50,6 @@ const MODULES = [
   CommonModule,
   EditorModule,
   FormsModule,
-  InlineSVGModule,
   ReactiveFormsModule,
   WvrSharedModule
 ];

projects/tl-elements/src/test.ts

@@ -1,6 +1,4 @@
 // This file is required by karma.conf.js and loads recursively all the .spec and framework files
-// tslint:disable-next-line:no-import-side-effect
-import '@angular/localize/init';
 /* tslint:disable: no-import-side-effect */
 import 'zone.js';
 import 'zone.js/testing';

src/app/app.module.ts

@@ -1,7 +1,7 @@
 import { Injector, NgModule } from '@angular/core';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { Store } from '@ngrx/store';
-import { StoreDevtoolsModule } from '@ngrx/store-devtools';
+import { storeDevtoolsInstrument } from '../environments/environment';
 import { TINYMCE_SCRIPT_SRC } from '@tinymce/tinymce-angular';
 import { actions, AppConfig, APP_CONFIG, registerWeaverElements, RootState, ThemeVariants } from '@wvr/elements';
 import { themes } from '../../projects/tl-elements/src/lib/shared/themes';
@@ -13,10 +13,7 @@ const getTinyMCEScript = (appConfig: AppConfig): string => `${appConfig.assetsUr
 @NgModule({
   imports: [
     BrowserAnimationsModule,
-    StoreDevtoolsModule.instrument({
-      maxAge: 25, // retains last 25 states
-      logOnly: true // restrict extension to log-only mode
-    }),
+    ...storeDevtoolsInstrument,
     TLCoreModule,
     TLSharedModule
   ],

src/environments/environment.prod.ts

@@ -1,3 +1,6 @@
+// Excluse devtools from production as per https://ngrx.io/guide/store-devtools/recipes/exclude .
+export const storeDevtoolsInstrument = [];
+
 export const environment = {
   production: true
 };

src/environments/environment.ts

@@ -1,3 +1,13 @@
+import { StoreDevtoolsModule } from '@ngrx/store-devtools';
+
+// Excluse devtools from production as per https://ngrx.io/guide/store-devtools/recipes/exclude .
+export const storeDevtoolsInstrument = [
+  StoreDevtoolsModule.instrument({
+    maxAge: 25, // retains last 25 states
+    logOnly: true // restrict extension to log-only mode
+  })
+];
+
 // This file can be replaced during build by using the `fileReplacements` array.
 // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
 // The list of file replacements can be found in `angular.json`.

src/polyfills.ts

@@ -1,10 +1,3 @@
-/***************************************************************************************************
- * Load `$localize` onto the global scope - used if i18n tags appear in Angular templates.
- */
-
-// tslint:disable-next-line:no-import-side-effect
-import '@angular/localize/init';
-
 /**
  * This file includes polyfills needed by Angular and is loaded before the app.
  * You can add your own extra polyfills to this file.
@@ -25,19 +18,6 @@ import '@angular/localize/init';
  * BROWSER POLYFILLS
  */
 
-/** IE10 and IE11 requires the following for NgClass support on SVG elements */
-
-// import 'classlist.js';  // Run `npm install --save classlist.js`.
-
-/**
- * Web Animations `@angular/platform-browser/animations`
- * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
- * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
- */
-
-// tslint:disable-next-line:no-import-side-effect
-import 'web-animations-js';  // Run `npm install --save web-animations-js`.
-
 /**
  * By default, zone.js will patch all possible macroTask and DomEvents
  * user can disable parts of macroTask/DomEvents patch by setting following flags
@@ -78,6 +58,3 @@ import 'zone.js';  // Included with Angular CLI.
 /***************************************************************************************************
  * APPLICATION IMPORTS
  */
-
-// tslint:disable-next-line:no-import-side-effect
-import '@ungap/custom-elements';