Sprint 19

.gitignore

@@ -8,7 +8,7 @@
 /bazel-out
 
 # dependencies
-/node_modules
+node_modules
 
 # profiling files
 chrome-profiler-events*.json

CHANGELOG.md

@@ -1,5 +1,24 @@
 # Changelog
 
+## [1.12.0] - 06-04-21
+### Resolves
+
+- The mobile service should use the ngrx store to maintain state. (#333)
+- Weaver Components should use an alternate mechanism to display: none when components are ready (#363)
+- Weaver Components should use Ngrx to to maintain state. (#364)
+- Weaver Components should build without warnings (#365)
+- Refactor Template Service to Template Utility (#379)
+- Refactor to pure pipes (#380)
+- Remove isMobileAgent from base component (#381)
+- Refactor mobile store to layout store (#382)
+- Afford input text color on text component (#388)
+- Colors in color utility should be brought in via JSON (#390)
+- Weaver Components Manifest should support path variables (#398)
+
+## [1.11.1] - 05-19-21
+### Resolves
+- Weaver Components should use an alternate mechanism to display: none when components are ready (#363)
+
 ## [1.11.0] - 05-12-21
 ### Resolves
 

angular.json

@@ -8,6 +8,9 @@
       "schematics": {
         "@schematics/angular:component": {
           "style": "scss"
+        },
+        "@schematics/angular:application": {
+          "strict": true
         }
       },
       "root": "",
@@ -23,7 +26,7 @@
             "main": "src/main.ts",
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.app.json",
-            "aot": true,
+            "inlineStyleLanguage": "scss",
             "assets": [
               "src/favicon.ico",
               "src/assets",
@@ -52,40 +55,51 @@
                   "with": "src/environments/environment.prod.ts"
                 }
               ],
+              "buildOptimizer": true,
               "optimization": true,
-              "outputHashing": "none",
               "sourceMap": false,
               "extractCss": false,
               "extractLicenses": true,
-              "namedChunks": false,
               "commonChunk": false,
+              "namedChunks": false,
               "vendorChunk": false,
-              "buildOptimizer": true,
               "budgets": [
                 {
                   "type": "initial",
-                  "maximumWarning": "1.5mb",
-                  "maximumError": "2mb"
+                  "maximumWarning": "2mb",
+                  "maximumError": "2.5mb"
                 },
                 {
                   "type": "anyComponentStyle",
                   "maximumWarning": "50kb",
                   "maximumError": "500kb"
                 }
-              ]
+              ],
+              "outputHashing": "none"
+            },
+            "development": {
+              "buildOptimizer": false,
+              "optimization": false,
+              "sourceMap": true,
+              "extractLicenses": false,
+              "commonChunk": true,
+              "namedChunks": true,
+              "vendorChunk": true
             }
-          }
+          },
+          "defaultConfiguration": "production"
         },
         "serve": {
           "builder": "ngx-build-plus:dev-server",
-          "options": {
-            "browserTarget": "weaver-components:build"
-          },
           "configurations": {
             "production": {
               "browserTarget": "weaver-components:build:production"
+            },
+            "development": {
+              "browserTarget": "weaver-components:build:development"
             }
-          }
+          },
+          "defaultConfiguration": "development"
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
@@ -100,6 +114,7 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.spec.json",
             "karmaConfig": "karma.conf.js",
+            "inlineStyleLanguage": "scss",
             "assets": [
               "src/favicon.ico",
               "src/assets"
@@ -144,16 +159,19 @@
       "prefix": "wvr",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-ng-packagr:build",
+          "builder": "@angular-devkit/build-angular:ng-packagr",
           "options": {
-            "tsConfig": "projects/wvr-elements/tsconfig.lib.json",
             "project": "projects/wvr-elements/ng-package.json"
           },
           "configurations": {
             "production": {
               "tsConfig": "projects/wvr-elements/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "projects/wvr-elements/tsconfig.lib.json"
             }
-          }
+          },
+          "defaultConfiguration": "production"
         },
         "test": {
           "builder": "ngx-build-plus:karma",

package.json

@@ -4,16 +4,16 @@
     "type": "git",
     "url": "git+https://github.com/TAMULib/weaver-components.git"
   },
-  "version": "1.11.1",
+  "version": "1.12.0",
   "private": false,
   "license": "MIT",
   "config": {
     "DOCKER_SERVER": ""
   },
   "scripts": {
-    "build": "ng build --prod --single-bundle --output-hashing none",
+    "build": "ng build --configuration production --single-bundle --output-hashing none",
     "build:clean": "npm run clean && npm run build",
-    "build:wvr-elements": "ng build --prod wvr-elements",
+    "build:wvr-elements": "ng build --configuration production wvr-elements",
     "build:wvr-components-style": "node scripts/build-wvr-components-style.js",
     "build:wvr-components": "node scripts/build-wvr-components.js",
     "build:wvr-components-static": "node scripts/build-wvr-components-static.js",
@@ -52,83 +52,81 @@
     "test:ci": "npm run test:audit && npm run test:coverage"
   },
   "dependencies": {
-    "@angular/animations": "^11.2.13",
-    "@angular/common": "^11.2.13",
-    "@angular/compiler": "^11.2.13",
-    "@angular/core": "^11.2.13",
-    "@angular/elements": "^11.2.13",
-    "@angular/forms": "^11.2.13",
-    "@angular/localize": "^11.2.13",
-    "@angular/platform-browser": "^11.2.13",
-    "@angular/platform-browser-dynamic": "^11.2.13",
-    "@angular/router": "^11.2.13",
-    "@ng-bootstrap/ng-bootstrap": "^9.1.0",
-    "@ngrx/effects": "^11.1.1",
-    "@ngrx/entity": "^11.1.1",
-    "@ngrx/router-store": "^11.1.1",
-    "@ngrx/store": "^11.1.1",
-    "@ngrx/store-devtools": "^11.1.1",
+    "@angular/animations": "^12.0.2",
+    "@angular/common": "^12.0.2",
+    "@angular/compiler": "^12.0.2",
+    "@angular/core": "^12.0.2",
+    "@angular/elements": "^12.0.2",
+    "@angular/forms": "^12.0.2",
+    "@angular/localize": "^12.0.2",
+    "@angular/platform-browser": "^12.0.2",
+    "@angular/platform-browser-dynamic": "^12.0.2",
+    "@angular/router": "^12.0.2",
+    "@ng-bootstrap/ng-bootstrap": "^9.1.1",
+    "@ngrx/effects": "^12.0.0",
+    "@ngrx/entity": "^12.0.0",
+    "@ngrx/router-store": "^12.0.0",
+    "@ngrx/store": "^12.0.0",
+    "@ngrx/store-devtools": "^12.0.0",
     "@tinymce/tinymce-angular": "^4.2.3",
-    "@types/json5": "^2.2.0",
+    "@ungap/custom-elements": "^1.0.0",
     "bootstrap": "^4.6.0",
     "css-element-queries": "^1.2.3",
-    "document-register-element": "^1.14.5",
     "handlebars": "^4.7.7",
     "json5": "^2.2.0",
-    "ng-inline-svg": "^12.1.0",
-    "npm": "^7.12.1",
+    "ng-inline-svg": "^13.0.0",
     "rxjs": "~6.6.7",
-    "tinymce": "^5.8.0",
+    "tinymce": "^5.8.1",
     "tslib": "^2.2.0",
     "web-animations-js": "^2.3.2",
     "zone.js": "~0.11.4"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^0.1102.12",
-    "@angular-devkit/build-ng-packagr": "~0.1002.0",
-    "@angular-devkit/schematics": "^11.2.12",
-    "@angular/cli": "^11.2.12",
-    "@angular/compiler-cli": "^11.2.13",
-    "@angular/language-service": "^11.2.13",
+    "@angular-devkit/build-angular": "^12.0.2",
+    "@angular-devkit/schematics": "^12.0.2",
+    "@angular/cli": "^12.0.2",
+    "@angular/compiler-cli": "^12.0.2",
+    "@angular/language-service": "^12.0.2",
     "@compodoc/compodoc": "^1.1.11",
     "@lhci/cli": "^0.7.2",
-    "@ngrx/schematics": "^11.1.1",
+    "@ngrx/schematics": "^12.0.0",
     "@pickra/copy-code-block": "^1.2.0",
-    "@types/jasmine": "~3.7.2",
+    "@types/jasmine": "~3.7.6",
     "@types/jasminewd2": "~2.0.9",
-    "@types/node": "^15.0.2",
+    "@types/json5": "^2.2.0",
+    "@types/node": "^15.6.1",
     "angular-tslint-rules": "^1.20.4",
     "chalk": "^4.1.1",
-    "chrome-launcher": "^0.13.4",
+    "chrome-launcher": "^0.14.0",
     "codelyzer": "^6.0.2",
     "concat": "^1.0.3",
     "console-stamp": "^3.0.2",
     "coveralls": "^3.1.0",
     "dotenv-override": "^5.0.1",
     "dotenv-override-true": "^6.2.2",
+    "fs-extra": "^10.0.0",
     "glob": "^7.1.7",
     "handlebars-loader": "^1.7.1",
     "jasmine-core": "~3.7.1",
     "jasmine-spec-reporter": "~7.0.0",
-    "jsdom": "^16.5.3",
+    "jsdom": "^16.6.0",
     "karma": "^6.3.2",
     "karma-chrome-launcher": "~3.1.0",
     "karma-coverage": "^2.0.3",
     "karma-coverage-istanbul-reporter": "~3.0.3",
     "karma-jasmine": "~4.0.1",
     "karma-jasmine-html-reporter": "^1.6.0",
     "karma-ng-html2js-preprocessor": "^1.0.0",
-    "lighthouse": "^7.4.0",
-    "lighthouse-badges": "^1.1.4",
-    "ng-packagr": "^11.2.4",
-    "ngx-build-plus": "^11.0.0",
+    "lighthouse": "^7.5.0",
+    "lighthouse-badges": "^1.1.5",
+    "ng-packagr": "^12.0.2",
+    "ngx-build-plus": "^12.0.1",
     "protractor": "~7.0.0",
     "rimraf": "^3.0.2",
     "shelljs": "^0.8.4",
     "static-server": "^2.2.1",
-    "ts-loader": "^9.1.2",
-    "ts-node": "~9.1.1",
+    "ts-node": "~10.0.0",
     "tslint": "~6.1.3",
-    "typescript": "~4.0.7"
+    "typescript": "~4.2.4"
   }
 }

projects/wvr-elements/ng-package.json

@@ -2,10 +2,20 @@
   "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
   "dest": "../../dist/wvr-elements",
   "lib": {
-    "entryFile": "src/public-api.ts"
+    "entryFile": "src/public-api.ts",
+    "umdModuleIds": {
+      "@ngrx/effects": "effects",
+      "@ngrx/entity": "entity",
+      "@ngrx/store": "store",
+      "@ngrx/store-devtools": "storeDevtools",
+      "@ng-bootstrap/ng-bootstrap": "ngBootstrap",
+      "@tinymce/tinymce-angular": "tinymceAngular",
+      "css-element-queries": "cssElementQueries",
+      "handlebars/dist/cjs/handlebars": "Handlebars",
+      "json5": "JSON5",
+      "ng-inline-svg": "ngInlineSvg",
+      "tinymce": "tinymce"
+    }
   },
-  "allowedNonPeerDependencies": [
-    "css-element-queries",
-    "handlebars"
-  ]
+  "allowedNonPeerDependencies": []
 }

projects/wvr-elements/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wvr/elements",
-  "version": "1.11.1",
+  "version": "1.12.0",
   "description": "Collection of angular components for Weaver's Custom Web Component UI",
   "author": "Texas A&M University Libraries",
   "private": false,
@@ -20,16 +20,16 @@
     "web components"
   ],
   "license": "MIT",
-  "dependencies": {
-    "css-element-queries": "^1.2.3",
-    "tslib": "^2.0.3",
-    "handlebars": "^4.7.6"
-  },
   "bin": {
     "wvr-ud": "./scripts/build-wvr-ud.js"
   },
+  "dependencies": {
+    "tslib": "^2.2.0"
+  },
   "peerDependencies": {
-    "@angular/common": "^11.0.3",
-    "@angular/core": "^11.0.3"
+    "@angular/common": "^12.0.1",
+    "@angular/core": "^12.0.1",
+    "css-element-queries": "^1.2.3",
+    "handlebars": "^4.7.7"
   }
 }

projects/wvr-elements/src/lib/core/action-registry.service.ts

@@ -9,7 +9,7 @@ import { actions } from './actions';
 })
 export class ActionRegistryService {
 
-  private actions: any;
+  private readonly actions: any;
 
   constructor() {
     this.actions = { ...actions };

projects/wvr-elements/src/lib/core/actions.ts

@@ -1,10 +1,12 @@
 import * as Manifest from './manifest/manifest.actions';
+import * as Layout from './layout/layout.actions';
 import * as Modal from './modal/modal.actions';
 import * as Rest from './rest/rest.actions';
 import * as Theme from './theme/theme.actions';
 import * as Wysiwyg from './wysiwyg/wysiwyg.actions';
 
 export const actions = {
+  Layout,
   Manifest,
   Modal,
   Rest,

projects/wvr-elements/src/lib/core/layout/layout.actions.ts

@@ -0,0 +1,6 @@
+import { createAction, props } from '@ngrx/store';
+
+export const setIsMobile = createAction(
+  '[Layout] Set Mobile',
+  props<{ isMobile: boolean }>()
+);