@firestitch/system 9.2.2 → 12.1.1

package/bundles/firestitch-system.umd.js

@@ -1,8 +1,142 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/material/form-field'), require('@angular/material/expansion'), require('@angular/material/input'), require('@angular/material/select'), require('@angular/material/dialog'), require('@angular/material/tooltip'), require('@angular/material/icon'), require('@angular/flex-layout'), require('@angular/material/button'), require('@firestitch/date'), require('@firestitch/datepicker'), require('@firestitch/skeleton'), require('@firestitch/list'), require('@firestitch/file-manager'), require('@firestitch/dialog'), require('@firestitch/label'), require('@firestitch/file'), require('@firestitch/menu'), require('@firestitch/message'), require('@firestitch/build'), require('rxjs/operators'), require('rxjs'), require('date-fns'), require('@firestitch/filter'), require('@firestitch/selection'), require('@firestitch/prompt'), require('lodash-es'), require('ngx-clipboard'), require('@angular/material/tabs')) :
-    typeof define === 'function' && define.amd ? define('@firestitch/system', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/material/form-field', '@angular/material/expansion', '@angular/material/input', '@angular/material/select', '@angular/material/dialog', '@angular/material/tooltip', '@angular/material/icon', '@angular/flex-layout', '@angular/material/button', '@firestitch/date', '@firestitch/datepicker', '@firestitch/skeleton', '@firestitch/list', '@firestitch/file-manager', '@firestitch/dialog', '@firestitch/label', '@firestitch/file', '@firestitch/menu', '@firestitch/message', '@firestitch/build', 'rxjs/operators', 'rxjs', 'date-fns', '@firestitch/filter', '@firestitch/selection', '@firestitch/prompt', 'lodash-es', 'ngx-clipboard', '@angular/material/tabs'], factory) :
-    (global = global || self, factory((global.firestitch = global.firestitch || {}, global.firestitch.system = {}), global.ng.core, global.ng.common, global.ng.forms, global.ng.material.formField, global.ng.material.expansion, global.ng.material.input, global.ng.material.select, global.ng.material.dialog, global.ng.material.tooltip, global.ng.material.icon, global.ng.flexLayout, global.ng.material.button, global.date, global.datepicker, global.skeleton, global.list, global.fileManager, global.dialog$1, global.label, global.file, global.menu, global.message, global.build, global.rxjs.operators, global.rxjs, global.dateFns, global.filter, global.selection, global.prompt, global.lodashEs, global.ngxClipboard, global.ng.material.tabs));
-}(this, (function (exports, core, common, forms, formField, expansion, input, select, dialog, tooltip, icon, flexLayout, button, date, datepicker, skeleton, list, fileManager, dialog$1, label, file, menu, message, build, operators, rxjs, dateFns, filter, selection, prompt, lodashEs, ngxClipboard, tabs) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/material/form-field'), require('@angular/material/expansion'), require('@angular/material/input'), require('@angular/material/select'), require('@angular/material/dialog'), require('@angular/material/tooltip'), require('@angular/material/icon'), require('@angular/flex-layout'), require('@angular/material/button'), require('@firestitch/date'), require('@firestitch/datepicker'), require('@firestitch/skeleton'), require('@firestitch/list'), require('@firestitch/file-manager'), require('@firestitch/dialog'), require('@firestitch/label'), require('@firestitch/file'), require('@firestitch/menu'), require('rxjs/operators'), require('rxjs'), require('date-fns'), require('@firestitch/message'), require('@firestitch/build'), require('@angular/flex-layout/flex'), require('@angular/flex-layout/extended'), require('@firestitch/filter'), require('@angular/material/tabs'), require('@firestitch/selection'), require('lodash-es'), require('ngx-clipboard'), require('@firestitch/prompt'), require('@angular/material/core')) :
+    typeof define === 'function' && define.amd ? define('@firestitch/system', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/material/form-field', '@angular/material/expansion', '@angular/material/input', '@angular/material/select', '@angular/material/dialog', '@angular/material/tooltip', '@angular/material/icon', '@angular/flex-layout', '@angular/material/button', '@firestitch/date', '@firestitch/datepicker', '@firestitch/skeleton', '@firestitch/list', '@firestitch/file-manager', '@firestitch/dialog', '@firestitch/label', '@firestitch/file', '@firestitch/menu', 'rxjs/operators', 'rxjs', 'date-fns', '@firestitch/message', '@firestitch/build', '@angular/flex-layout/flex', '@angular/flex-layout/extended', '@firestitch/filter', '@angular/material/tabs', '@firestitch/selection', 'lodash-es', 'ngx-clipboard', '@firestitch/prompt', '@angular/material/core'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.firestitch = global.firestitch || {}, global.firestitch.system = {}), global.ng.core, global.ng.common, global.ng.forms, global.ng.material.formField, global.ng.material.expansion, global.ng.material.input, global.ng.material.select, global.ng.material.dialog, global.ng.material.tooltip, global.ng.material.icon, global.ng.flexLayout, global.ng.material.button, global.i4$2, global.i10$1, global.i5, global.i3$1, global.i1$2, global.i2$2, global.i2$1, global.i11$1, global.i4$1, global.rxjs.operators, global.rxjs, global.dateFns, global.i1, global.i2, global.ng.flexLayout.flex, global.ng.flexLayout.extended, global.filter, global.ng.material.tabs, global.selection, global.lodashEs, global.i2$3, global.i3$2, global.ng.material.core));
+})(this, (function (exports, i0, i9, i15, i7, i4$3, i14, i8, i1$1, i11, i6, flexLayout, i4, i4$2, i10$1, i5, i3$1, i1$2, i2$2, i2$1, i11$1, i4$1, operators, rxjs, dateFns, i1, i2, i6$1, i10, filter, i3, selection, lodashEs, i2$3, i3$2, i9$1) { 'use strict';
+
+    function _interopNamespace(e) {
+        if (e && e.__esModule) return e;
+        var n = Object.create(null);
+        if (e) {
+            Object.keys(e).forEach(function (k) {
+                if (k !== 'default') {
+                    var d = Object.getOwnPropertyDescriptor(e, k);
+                    Object.defineProperty(n, k, d.get ? d : {
+                        enumerable: true,
+                        get: function () { return e[k]; }
+                    });
+                }
+            });
+        }
+        n["default"] = e;
+        return Object.freeze(n);
+    }
+
+    var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
+    var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
+    var i15__namespace = /*#__PURE__*/_interopNamespace(i15);
+    var i7__namespace = /*#__PURE__*/_interopNamespace(i7);
+    var i4__namespace$3 = /*#__PURE__*/_interopNamespace(i4$3);
+    var i14__namespace = /*#__PURE__*/_interopNamespace(i14);
+    var i8__namespace = /*#__PURE__*/_interopNamespace(i8);
+    var i1__namespace$1 = /*#__PURE__*/_interopNamespace(i1$1);
+    var i11__namespace = /*#__PURE__*/_interopNamespace(i11);
+    var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
+    var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
+    var i4__namespace$2 = /*#__PURE__*/_interopNamespace(i4$2);
+    var i10__namespace$1 = /*#__PURE__*/_interopNamespace(i10$1);
+    var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
+    var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
+    var i1__namespace$2 = /*#__PURE__*/_interopNamespace(i1$2);
+    var i2__namespace$2 = /*#__PURE__*/_interopNamespace(i2$2);
+    var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$1);
+    var i11__namespace$1 = /*#__PURE__*/_interopNamespace(i11$1);
+    var i4__namespace$1 = /*#__PURE__*/_interopNamespace(i4$1);
+    var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
+    var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
+    var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
+    var i10__namespace = /*#__PURE__*/_interopNamespace(i10);
+    var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
+    var i2__namespace$3 = /*#__PURE__*/_interopNamespace(i2$3);
+    var i3__namespace$2 = /*#__PURE__*/_interopNamespace(i3$2);
+    var i9__namespace$1 = /*#__PURE__*/_interopNamespace(i9$1);
+
+    var FS_SYSTEM_CONFIG = new i0.InjectionToken('fs-system-config');
+
+    var DashboardComponent = /** @class */ (function () {
+        function DashboardComponent(_message, _cdRef, _buildService) {
+            this._message = _message;
+            this._cdRef = _cdRef;
+            this._buildService = _buildService;
+            this.buttonActions = [];
+            this.menuActions = [];
+            this._destroy$ = new rxjs.Subject();
+            this.actions = [];
+        }
+        DashboardComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            this._load();
+            this.buttonActions = this.actions.filter(function (item) { return !item.menu; });
+            this.menuActions = this.actions.filter(function (item) { return item.menu; });
+            this.build = this._buildService.build;
+            this._buildService.buildChange$
+                .pipe(operators.takeUntil(this._destroy$))
+                .subscribe(function (build) {
+                _this.build = build;
+                _this._cdRef.markForCheck();
+            });
+        };
+        DashboardComponent.prototype._load = function () {
+            var _this = this;
+            this.load()
+                .subscribe(function (dashboard) {
+                _this.dashboard = dashboard;
+                _this.dashboard.cronRanAttention = !dashboard.cronRan ||
+                    dateFns.differenceInMinutes(new Date(), new Date(dashboard.cronRan)) > 15;
+                _this._cdRef.markForCheck();
+            });
+        };
+        DashboardComponent.prototype.ngOnDestroy = function () {
+            this._destroy$.next();
+            this._destroy$.complete();
+        };
+        DashboardComponent.prototype.actionClick = function (action) {
+            action.click();
+        };
+        DashboardComponent.prototype.initClick = function () {
+            var _this = this;
+            this.init()
+                .subscribe(function () {
+                _this._message.success('Successfully initialized the system');
+            });
+        };
+        DashboardComponent.prototype.upgradeClick = function () {
+            var _this = this;
+            this.upgrade()
+                .subscribe(function () {
+                _this._load();
+                _this._message.success('Successfully upgraded the system');
+            });
+        };
+        return DashboardComponent;
+    }());
+    DashboardComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: DashboardComponent, deps: [{ token: i1__namespace.FsMessage }, { token: i0__namespace.ChangeDetectorRef }, { token: i2__namespace.FsBuildService }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    DashboardComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: DashboardComponent, selector: "fs-system-dashboard", inputs: { init: "init", upgrade: "upgrade", load: "load", actions: "actions" }, ngImport: i0__namespace, template: "<div *fsSkeleton=\"dashboard\">\r\n\r\n  <div class=\"h2-container\">\r\n\r\n    <div class=\"actions\">\r\n        <h2>Actions</h2>\r\n        <div fxLayout=\"row\" fxLayoutGap=\"5px\" fxLayout.xs=\"column\">\r\n          <button mat-raised-button (click)=\"upgradeClick()\">Run Upgrades</button>\r\n          <button mat-raised-button (click)=\"initClick()\">Init System</button>\r\n\r\n          <button\r\n            *ngFor=\"let action of buttonActions\"\r\n            mat-raised-button\r\n            (click)=\"actionClick(action)\">\r\n            {{action.label}}\r\n          </button>\r\n\r\n          <ng-container *ngIf=\"menuActions.length\">\r\n\r\n            <fs-menu buttonClass=\"mat-raised-button menu-button\">\r\n              <ng-template\r\n                *ngFor=\"let action of menuActions\"\r\n                fs-menu-item\r\n                (click)=\"actionClick(action)\">\r\n                {{action.label}}\r\n              </ng-template>\r\n            </fs-menu>\r\n\r\n\r\n          </ng-container>\r\n\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div\r\n      fxLayout=\"row wrap\"\r\n      fxLayout.xs=\"column\"\r\n      fxLayoutGap.xs=\"0px\"\r\n      fxLayoutAlign=\"start start\"\r\n      fxLayoutGap=\"50px\">\r\n\r\n      <div>\r\n        <h2>Server</h2>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Date/Time</fs-label>\r\n          {{dashboard.serverTime | fsDateFormat: 'date-time'}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Timezone</fs-label>\r\n          {{dashboard.serverTimezone}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Hostname</fs-label>\r\n          {{dashboard.serverHostname}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Directory</fs-label>\r\n          {{dashboard.appDirectory}}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div>\r\n        <h2>System</h2>\r\n        <fs-label-field>\r\n          <fs-label>Mode</fs-label>\r\n          {{dashboard.appMode}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Notification Recipients</fs-label>\r\n          {{dashboard.notifyRecipients.join(', ')}}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div>\r\n        <h2>Database</h2>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Name</fs-label>\r\n          {{dashboard.databaseName}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Date/Time</fs-label>\r\n          {{dashboard.databaseTime | fsDateFormat: 'date-time'}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Timezone</fs-label>\r\n          {{dashboard.databaseTimezone}}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div *ngIf=\"build || dashboard.upgrades.length\">\r\n        <h2>Build</h2>\r\n\r\n        <ng-container *ngIf=\"build\">\r\n          <fs-label-field>\r\n            <fs-label>Version</fs-label>\r\n            {{build.version}}\r\n          </fs-label-field>\r\n\r\n          <fs-label-field>\r\n            <fs-label>Date</fs-label>\r\n            {{ build.date | fsDateFormat: 'date-time' }}\r\n          </fs-label-field>\r\n        </ng-container>\r\n\r\n        <fs-label-field *ngIf=\"dashboard.upgrades.length\">\r\n          <fs-label>Pending Upgrades</fs-label>\r\n          <span class=\"attention\" [ngClass]=\"{ 'needs-attention': !!dashboard.upgrades.length }\">\r\n            {{dashboard.upgrades.length}}\r\n            <mat-icon\r\n                [matTooltip]=\"dashboard.upgrades.join('\\n')\"\r\n                matTooltipClass=\"tooltip-pending-upgrades\"\r\n                >\r\n              warning\r\n            </mat-icon>\r\n          </span>\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div>\r\n        <h2>Cron</h2>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Last Ran</fs-label>\r\n          <span class=\"attention\" [ngClass]=\"{ 'needs-attention': dashboard.cronRanAttention }\">\r\n            <span *ngIf=\"!dashboard.cronRan\">Never</span>\r\n            <span *ngIf=\"dashboard.cronRan\">{{dashboard.cronRan | fsDateFormat: 'date-time'}}</span>\r\n            <mat-icon>warning</mat-icon>\r\n          </span>\r\n        </fs-label-field>\r\n      </div>\r\n  </div>\r\n</div>\r\n", styles: [".actions{margin-bottom:1.25em}table td{padding:3px}.attention{display:flex;align-items:center}.attention mat-icon{display:none;margin-left:2px}.attention.needs-attention{color:#c00}.attention.needs-attention mat-icon{display:inline}::ng-deep .tooltip-pending-upgrades{white-space:pre-line}@media (max-width: 600px){:host ::ng-deep .menu-button{width:100%;border-radius:4px}}@media (min-width: 600px){:host ::ng-deep .menu-button{box-shadow:none}}\n"], components: [{ type: i4__namespace.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4__namespace$1.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass"], outputs: ["opened", "closed"] }, { type: i2__namespace$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i2__namespace$1.FsLabelComponent, selector: "fs-label" }, { type: i6__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i5__namespace.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i6__namespace$1.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i6__namespace$1.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i9__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i9__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]", inputs: ["fsClass", "class", "id", "label", "hidden", "groupHidden", "dismissAfterClick", "link", "target", "queryParams"], outputs: ["click"] }, { type: i6__namespace$1.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i9__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i10__namespace.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i11__namespace.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], pipes: { "fsDateFormat": i4__namespace$2.FsDateFormatPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: DashboardComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-system-dashboard',
+                        templateUrl: 'dashboard.component.html',
+                        styleUrls: ['dashboard.component.scss'],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () { return [{ type: i1__namespace.FsMessage }, { type: i0__namespace.ChangeDetectorRef }, { type: i2__namespace.FsBuildService }]; }, propDecorators: { init: [{
+                    type: i0.Input
+                }], upgrade: [{
+                    type: i0.Input
+                }], load: [{
+                    type: i0.Input
+                }], actions: [{
+                    type: i0.Input
+                }] } });
+
+    function indexNameValue(arry) {
+        var obj = {};
+        arry.forEach(function (item) {
+            obj[item.value] = item.name;
+        });
+        return obj;
+    }
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -19,35 +153,38 @@
     PERFORMANCE OF THIS SOFTWARE.
     ***************************************************************************** */
     /* global Reflect, Promise */
-
-    var extendStatics = function(d, b) {
+    var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b)
+                if (Object.prototype.hasOwnProperty.call(b, p))
+                    d[p] = b[p]; };
         return extendStatics(d, b);
     };
-
     function __extends(d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     }
-
-    var __assign = function() {
+    var __assign = function () {
         __assign = Object.assign || function __assign(t) {
             for (var s, i = 1, n = arguments.length; i < n; i++) {
                 s = arguments[i];
-                for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+                for (var p in s)
+                    if (Object.prototype.hasOwnProperty.call(s, p))
+                        t[p] = s[p];
             }
             return t;
         };
         return __assign.apply(this, arguments);
     };
-
     function __rest(s, e) {
         var t = {};
-        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-            t[p] = s[p];
+        for (var p in s)
+            if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+                t[p] = s[p];
         if (s != null && typeof Object.getOwnPropertySymbols === "function")
             for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
                 if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
@@ -55,275 +192,271 @@
             }
         return t;
     }
-
     function __decorate(decorators, target, key, desc) {
         var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-        else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+        if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+            r = Reflect.decorate(decorators, target, key, desc);
+        else
+            for (var i = decorators.length - 1; i >= 0; i--)
+                if (d = decorators[i])
+                    r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
         return c > 3 && r && Object.defineProperty(target, key, r), r;
     }
-
     function __param(paramIndex, decorator) {
-        return function (target, key) { decorator(target, key, paramIndex); }
+        return function (target, key) { decorator(target, key, paramIndex); };
     }
-
     function __metadata(metadataKey, metadataValue) {
-        if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
+        if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
+            return Reflect.metadata(metadataKey, metadataValue);
     }
-
     function __awaiter(thisArg, _arguments, P, generator) {
         function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
         return new (P || (P = Promise))(function (resolve, reject) {
-            function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-            function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+            function fulfilled(value) { try {
+                step(generator.next(value));
+            }
+            catch (e) {
+                reject(e);
+            } }
+            function rejected(value) { try {
+                step(generator["throw"](value));
+            }
+            catch (e) {
+                reject(e);
+            } }
             function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
             step((generator = generator.apply(thisArg, _arguments || [])).next());
         });
     }
-
     function __generator(thisArg, body) {
-        var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-        return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+        var _ = { label: 0, sent: function () { if (t[0] & 1)
+                throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+        return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function () { return this; }), g;
         function verb(n) { return function (v) { return step([n, v]); }; }
         function step(op) {
-            if (f) throw new TypeError("Generator is already executing.");
-            while (_) try {
-                if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-                if (y = 0, t) op = [op[0] & 2, t.value];
-                switch (op[0]) {
-                    case 0: case 1: t = op; break;
-                    case 4: _.label++; return { value: op[1], done: false };
-                    case 5: _.label++; y = op[1]; op = [0]; continue;
-                    case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                    default:
-                        if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                        if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                        if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                        if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                        if (t[2]) _.ops.pop();
-                        _.trys.pop(); continue;
+            if (f)
+                throw new TypeError("Generator is already executing.");
+            while (_)
+                try {
+                    if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done)
+                        return t;
+                    if (y = 0, t)
+                        op = [op[0] & 2, t.value];
+                    switch (op[0]) {
+                        case 0:
+                        case 1:
+                            t = op;
+                            break;
+                        case 4:
+                            _.label++;
+                            return { value: op[1], done: false };
+                        case 5:
+                            _.label++;
+                            y = op[1];
+                            op = [0];
+                            continue;
+                        case 7:
+                            op = _.ops.pop();
+                            _.trys.pop();
+                            continue;
+                        default:
+                            if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
+                                _ = 0;
+                                continue;
+                            }
+                            if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) {
+                                _.label = op[1];
+                                break;
+                            }
+                            if (op[0] === 6 && _.label < t[1]) {
+                                _.label = t[1];
+                                t = op;
+                                break;
+                            }
+                            if (t && _.label < t[2]) {
+                                _.label = t[2];
+                                _.ops.push(op);
+                                break;
+                            }
+                            if (t[2])
+                                _.ops.pop();
+                            _.trys.pop();
+                            continue;
+                    }
+                    op = body.call(thisArg, _);
                 }
-                op = body.call(thisArg, _);
-            } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-            if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+                catch (e) {
+                    op = [6, e];
+                    y = 0;
+                }
+                finally {
+                    f = t = 0;
+                }
+            if (op[0] & 5)
+                throw op[1];
+            return { value: op[0] ? op[1] : void 0, done: true };
         }
     }
-
-    function __createBinding(o, m, k, k2) {
-        if (k2 === undefined) k2 = k;
+    var __createBinding = Object.create ? (function (o, m, k, k2) {
+        if (k2 === undefined)
+            k2 = k;
+        Object.defineProperty(o, k2, { enumerable: true, get: function () { return m[k]; } });
+    }) : (function (o, m, k, k2) {
+        if (k2 === undefined)
+            k2 = k;
         o[k2] = m[k];
+    });
+    function __exportStar(m, o) {
+        for (var p in m)
+            if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p))
+                __createBinding(o, m, p);
     }
-
-    function __exportStar(m, exports) {
-        for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) exports[p] = m[p];
-    }
-
     function __values(o) {
         var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-        if (m) return m.call(o);
-        if (o && typeof o.length === "number") return {
-            next: function () {
-                if (o && i >= o.length) o = void 0;
-                return { value: o && o[i++], done: !o };
-            }
-        };
+        if (m)
+            return m.call(o);
+        if (o && typeof o.length === "number")
+            return {
+                next: function () {
+                    if (o && i >= o.length)
+                        o = void 0;
+                    return { value: o && o[i++], done: !o };
+                }
+            };
         throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
     }
-
     function __read(o, n) {
         var m = typeof Symbol === "function" && o[Symbol.iterator];
-        if (!m) return o;
+        if (!m)
+            return o;
         var i = m.call(o), r, ar = [], e;
         try {
-            while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+            while ((n === void 0 || n-- > 0) && !(r = i.next()).done)
+                ar.push(r.value);
+        }
+        catch (error) {
+            e = { error: error };
         }
-        catch (error) { e = { error: error }; }
         finally {
             try {
-                if (r && !r.done && (m = i["return"])) m.call(i);
+                if (r && !r.done && (m = i["return"]))
+                    m.call(i);
+            }
+            finally {
+                if (e)
+                    throw e.error;
             }
-            finally { if (e) throw e.error; }
         }
         return ar;
     }
-
+    /** @deprecated */
     function __spread() {
         for (var ar = [], i = 0; i < arguments.length; i++)
             ar = ar.concat(__read(arguments[i]));
         return ar;
     }
-
+    /** @deprecated */
     function __spreadArrays() {
-        for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
+        for (var s = 0, i = 0, il = arguments.length; i < il; i++)
+            s += arguments[i].length;
         for (var r = Array(s), k = 0, i = 0; i < il; i++)
             for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
                 r[k] = a[j];
         return r;
-    };
-
+    }
+    function __spreadArray(to, from, pack) {
+        if (pack || arguments.length === 2)
+            for (var i = 0, l = from.length, ar; i < l; i++) {
+                if (ar || !(i in from)) {
+                    if (!ar)
+                        ar = Array.prototype.slice.call(from, 0, i);
+                    ar[i] = from[i];
+                }
+            }
+        return to.concat(ar || Array.prototype.slice.call(from));
+    }
     function __await(v) {
         return this instanceof __await ? (this.v = v, this) : new __await(v);
     }
-
     function __asyncGenerator(thisArg, _arguments, generator) {
-        if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+        if (!Symbol.asyncIterator)
+            throw new TypeError("Symbol.asyncIterator is not defined.");
         var g = generator.apply(thisArg, _arguments || []), i, q = [];
         return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
-        function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
-        function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
+        function verb(n) { if (g[n])
+            i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
+        function resume(n, v) { try {
+            step(g[n](v));
+        }
+        catch (e) {
+            settle(q[0][3], e);
+        } }
         function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
         function fulfill(value) { resume("next", value); }
         function reject(value) { resume("throw", value); }
-        function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
+        function settle(f, v) { if (f(v), q.shift(), q.length)
+            resume(q[0][0], q[0][1]); }
     }
-
     function __asyncDelegator(o) {
         var i, p;
         return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
         function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
     }
-
     function __asyncValues(o) {
-        if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+        if (!Symbol.asyncIterator)
+            throw new TypeError("Symbol.asyncIterator is not defined.");
         var m = o[Symbol.asyncIterator], i;
         return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
         function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
-        function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
+        function settle(resolve, reject, d, v) { Promise.resolve(v).then(function (v) { resolve({ value: v, done: d }); }, reject); }
     }
-
     function __makeTemplateObject(cooked, raw) {
-        if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+        if (Object.defineProperty) {
+            Object.defineProperty(cooked, "raw", { value: raw });
+        }
+        else {
+            cooked.raw = raw;
+        }
         return cooked;
+    }
+    ;
+    var __setModuleDefault = Object.create ? (function (o, v) {
+        Object.defineProperty(o, "default", { enumerable: true, value: v });
+    }) : function (o, v) {
+        o["default"] = v;
     };
-
     function __importStar(mod) {
-        if (mod && mod.__esModule) return mod;
+        if (mod && mod.__esModule)
+            return mod;
         var result = {};
-        if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-        result.default = mod;
+        if (mod != null)
+            for (var k in mod)
+                if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k))
+                    __createBinding(result, mod, k);
+        __setModuleDefault(result, mod);
         return result;
     }
-
     function __importDefault(mod) {
         return (mod && mod.__esModule) ? mod : { default: mod };
     }
-
-    function __classPrivateFieldGet(receiver, privateMap) {
-        if (!privateMap.has(receiver)) {
-            throw new TypeError("attempted to get private field on non-instance");
-        }
-        return privateMap.get(receiver);
+    function __classPrivateFieldGet(receiver, state, kind, f) {
+        if (kind === "a" && !f)
+            throw new TypeError("Private accessor was defined without a getter");
+        if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+            throw new TypeError("Cannot read private member from an object whose class did not declare it");
+        return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
     }
-
-    function __classPrivateFieldSet(receiver, privateMap, value) {
-        if (!privateMap.has(receiver)) {
-            throw new TypeError("attempted to set private field on non-instance");
-        }
-        privateMap.set(receiver, value);
-        return value;
+    function __classPrivateFieldSet(receiver, state, value, kind, f) {
+        if (kind === "m")
+            throw new TypeError("Private method is not writable");
+        if (kind === "a" && !f)
+            throw new TypeError("Private accessor was defined without a setter");
+        if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+            throw new TypeError("Cannot write private member to an object whose class did not declare it");
+        return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
     }
 
-    var FS_SYSTEM_CONFIG = new core.InjectionToken('fs-system-config');
-
-    var DashboardComponent = /** @class */ (function () {
-        function DashboardComponent(_message, _cdRef, _buildService) {
-            this._message = _message;
-            this._cdRef = _cdRef;
-            this._buildService = _buildService;
-            this.buttonActions = [];
-            this.menuActions = [];
-            this._destroy$ = new rxjs.Subject();
-            this.actions = [];
-        }
-        DashboardComponent.prototype.ngOnInit = function () {
-            var _this = this;
-            this._load();
-            this.buttonActions = this.actions.filter(function (item) { return !item.menu; });
-            this.menuActions = this.actions.filter(function (item) { return item.menu; });
-            this.build = this._buildService.build;
-            this._buildService.buildChange$
-                .pipe(operators.takeUntil(this._destroy$))
-                .subscribe(function (build) {
-                _this.build = build;
-                _this._cdRef.markForCheck();
-            });
-        };
-        DashboardComponent.prototype._load = function () {
-            var _this = this;
-            this.load()
-                .subscribe(function (dashboard) {
-                _this.dashboard = dashboard;
-                _this.dashboard.cronRanAttention = !dashboard.cronRan ||
-                    dateFns.differenceInMinutes(new Date(), new Date(dashboard.cronRan)) > 15;
-                _this._cdRef.markForCheck();
-            });
-        };
-        DashboardComponent.prototype.ngOnDestroy = function () {
-            this._destroy$.next();
-            this._destroy$.complete();
-        };
-        DashboardComponent.prototype.actionClick = function (action) {
-            action.click();
-        };
-        DashboardComponent.prototype.initClick = function () {
-            var _this = this;
-            this.init()
-                .subscribe(function () {
-                _this._message.success('Successfully initialized the system');
-            });
-        };
-        DashboardComponent.prototype.upgradeClick = function () {
-            var _this = this;
-            this.upgrade()
-                .subscribe(function () {
-                _this._load();
-                _this._message.success('Successfully upgraded the system');
-            });
-        };
-        DashboardComponent.ctorParameters = function () { return [
-            { type: message.FsMessage },
-            { type: core.ChangeDetectorRef },
-            { type: build.FsBuildService }
-        ]; };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], DashboardComponent.prototype, "init", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], DashboardComponent.prototype, "upgrade", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], DashboardComponent.prototype, "load", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Array)
-        ], DashboardComponent.prototype, "actions", void 0);
-        DashboardComponent = __decorate([
-            core.Component({
-                selector: 'fs-system-dashboard',
-                template: "<div *fsSkeleton=\"dashboard\">\r\n\r\n  <div class=\"h2-container\">\r\n\r\n    <div class=\"actions\">\r\n        <h2>Actions</h2>\r\n        <div fxLayout=\"row\" fxLayoutGap=\"5px\" fxLayout.xs=\"column\">\r\n          <button mat-raised-button (click)=\"upgradeClick()\">Run Upgrades</button>\r\n          <button mat-raised-button (click)=\"initClick()\">Init System</button>\r\n\r\n          <button\r\n            *ngFor=\"let action of buttonActions\"\r\n            mat-raised-button\r\n            (click)=\"actionClick(action)\">\r\n            {{action.label}}\r\n          </button>\r\n\r\n          <ng-container *ngIf=\"menuActions.length\">\r\n\r\n            <fs-menu buttonClass=\"mat-raised-button menu-button\">\r\n              <ng-template\r\n                *ngFor=\"let action of menuActions\"\r\n                fs-menu-item\r\n                (click)=\"actionClick(action)\">\r\n                {{action.label}}\r\n              </ng-template>\r\n            </fs-menu>\r\n\r\n\r\n          </ng-container>\r\n\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div\r\n      fxLayout=\"row wrap\"\r\n      fxLayout.xs=\"column\"\r\n      fxLayoutGap.xs=\"0px\"\r\n      fxLayoutAlign=\"start start\"\r\n      fxLayoutGap=\"50px\">\r\n\r\n      <div>\r\n        <h2>Server</h2>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Date/Time</fs-label>\r\n          {{dashboard.serverTime | fsDateFormat: 'date-time'}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Timezone</fs-label>\r\n          {{dashboard.serverTimezone}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Hostname</fs-label>\r\n          {{dashboard.serverHostname}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Directory</fs-label>\r\n          {{dashboard.appDirectory}}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div>\r\n        <h2>System</h2>\r\n        <fs-label-field>\r\n          <fs-label>Mode</fs-label>\r\n          {{dashboard.appMode}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Notification Recipients</fs-label>\r\n          {{dashboard.notifyRecipients.join(', ')}}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div>\r\n        <h2>Database</h2>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Name</fs-label>\r\n          {{dashboard.databaseName}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Date/Time</fs-label>\r\n          {{dashboard.databaseTime | fsDateFormat: 'date-time'}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Timezone</fs-label>\r\n          {{dashboard.databaseTimezone}}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div *ngIf=\"build || dashboard.upgrades.length\">\r\n        <h2>Build</h2>\r\n\r\n        <ng-container *ngIf=\"build\">\r\n          <fs-label-field>\r\n            <fs-label>Version</fs-label>\r\n            {{build.version}}\r\n          </fs-label-field>\r\n\r\n          <fs-label-field>\r\n            <fs-label>Date</fs-label>\r\n            {{ build.date | fsDateFormat: 'date-time' }}\r\n          </fs-label-field>\r\n        </ng-container>\r\n\r\n        <fs-label-field *ngIf=\"dashboard.upgrades.length\">\r\n          <fs-label>Pending Upgrades</fs-label>\r\n          <span class=\"attention\" [ngClass]=\"{ 'needs-attention': !!dashboard.upgrades.length }\">\r\n            {{dashboard.upgrades.length}}\r\n            <mat-icon\r\n                [matTooltip]=\"dashboard.upgrades.join('\\n')\"\r\n                matTooltipClass=\"tooltip-pending-upgrades\"\r\n                >\r\n              warning\r\n            </mat-icon>\r\n          </span>\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div>\r\n        <h2>Cron</h2>\r\n\r\n        <fs-label-field>\r\n          <fs-label>Last Ran</fs-label>\r\n          <span class=\"attention\" [ngClass]=\"{ 'needs-attention': dashboard.cronRanAttention }\">\r\n            <span *ngIf=\"!dashboard.cronRan\">Never</span>\r\n            <span *ngIf=\"dashboard.cronRan\">{{dashboard.cronRan | fsDateFormat: 'date-time'}}</span>\r\n            <mat-icon>warning</mat-icon>\r\n          </span>\r\n        </fs-label-field>\r\n      </div>\r\n  </div>\r\n</div>\r\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [".actions{margin-bottom:1.25em}table td{padding:3px}.attention{display:flex;align-items:center}.attention mat-icon{display:none;margin-left:2px}.attention.needs-attention{color:#c00}.attention.needs-attention mat-icon{display:inline}::ng-deep .tooltip-pending-upgrades{white-space:pre-line}@media (max-width:600px){:host ::ng-deep .menu-button{width:100%;border-radius:4px}}@media (min-width:600px){:host ::ng-deep .menu-button{box-shadow:none}}"]
-            }),
-            __metadata("design:paramtypes", [message.FsMessage,
-                core.ChangeDetectorRef,
-                build.FsBuildService])
-        ], DashboardComponent);
-        return DashboardComponent;
-    }());
-
-    function indexNameValue(arry) {
-        var obj = {};
-        arry.forEach(function (item) {
-            obj[item.value] = item.name;
-        });
-        return obj;
-    }
-
-
+    exports.CronState = void 0;
     (function (CronState) {
         CronState["Running"] = "running";
         CronState["Idle"] = "idle";
@@ -347,14 +480,14 @@
         SettingInterfaceType["None"] = "N";
     })(SettingInterfaceType || (SettingInterfaceType = {}));
 
-
+    exports.ApiLogState = void 0;
     (function (ApiLogState) {
         ApiLogState["Success"] = "success";
         ApiLogState["Failed"] = "failed";
         ApiLogState["Deleted"] = "deleted";
     })(exports.ApiLogState || (exports.ApiLogState = {}));
 
-
+    exports.ProcessState = void 0;
     (function (ProcessState) {
         ProcessState["Queued"] = "Q";
         ProcessState["Running"] = "R";
@@ -430,19 +563,22 @@
                 return accum;
             }, {});
         };
-        CronLogComponent.ctorParameters = function () { return [
-            { type: undefined, decorators: [{ type: core.Inject, args: [dialog.MAT_DIALOG_DATA,] }] }
-        ]; };
-        CronLogComponent = __decorate([
-            core.Component({
-                template: "<fs-dialog *fsSkeleton=\"cronLog\">\r\n  <div mat-dialog-title>Cron Log</div>\r\n  <mat-dialog-content>\r\n    <div class=\"row\">\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Status\r\n        </fs-label>\r\n        <div [ngStyle]=\"{ color: CronLogStateColors[cronLog.state]}\">\r\n          {{CronLogStates[cronLog.state] || cronLog.state}}\r\n        </div>\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Date\r\n        </fs-label>\r\n        <fs-date-ago [date]=\"cronLog.createDate\"></fs-date-ago>\r\n      </fs-label-field>\r\n    </div>\r\n  \r\n    <fs-label-field *ngIf=\"cronLog.message\">\r\n      <fs-label>\r\n        Message\r\n      </fs-label>\r\n      <div class=\"message\">\r\n        {{cronLog.message}}\r\n      </div>\r\n    </fs-label-field>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">Done</button>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n",
-                styles: [".message{white-space:pre-line}.row{display:flex;flex-wrap:wrap}.row fs-label-field:not(:last-child){margin-right:40px}"]
-            }),
-            __param(0, core.Inject(dialog.MAT_DIALOG_DATA)),
-            __metadata("design:paramtypes", [Object])
-        ], CronLogComponent);
         return CronLogComponent;
-    }());
+    }());
+    CronLogComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CronLogComponent, deps: [{ token: i1$1.MAT_DIALOG_DATA }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    CronLogComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CronLogComponent, selector: "ng-component", ngImport: i0__namespace, template: "<fs-dialog *fsSkeleton=\"cronLog\">\r\n  <div mat-dialog-title>Cron Log</div>\r\n  <mat-dialog-content>\r\n    <div class=\"row\">\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Status\r\n        </fs-label>\r\n        <div [ngStyle]=\"{ color: CronLogStateColors[cronLog.state]}\">\r\n          {{CronLogStates[cronLog.state] || cronLog.state}}\r\n        </div>\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Date\r\n        </fs-label>\r\n        <fs-date-ago [date]=\"cronLog.createDate\"></fs-date-ago>\r\n      </fs-label-field>\r\n    </div>\r\n  \r\n    <fs-label-field *ngIf=\"cronLog.message\">\r\n      <fs-label>\r\n        Message\r\n      </fs-label>\r\n      <div class=\"message\">\r\n        {{cronLog.message}}\r\n      </div>\r\n    </fs-label-field>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">Done</button>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n", styles: [".message{white-space:pre-line}.row{display:flex;flex-wrap:wrap}.row fs-label-field:not(:last-child){margin-right:40px}\n"], components: [{ type: i2__namespace$2.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i2__namespace$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i2__namespace$1.FsLabelComponent, selector: "fs-label" }, { type: i4__namespace$2.FsDateAgoComponent, selector: "fs-date-ago", inputs: ["date", "showTime", "format", "showTooltip", "tooltipDateFormat"] }, { type: i4__namespace.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i5__namespace.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i1__namespace$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i9__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i10__namespace.DefaultStyleDirective, selector: "  [ngStyle],  [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],  [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],  [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { type: i9__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1__namespace$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CronLogComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        templateUrl: './cron-log.component.html',
+                        styleUrls: ['./cron-log.component.scss']
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i1$1.MAT_DIALOG_DATA]
+                        }] }];
+        } });
 
     var CronComponent = /** @class */ (function () {
         function CronComponent(_data, _dialog, _cdRef) {
@@ -484,7 +620,7 @@
             var _this = this;
             this._data.loadCron(this._data.cron)
                 .subscribe(function (cron) {
-                _this.cron = __assign(__assign({}, _this._data.cron), cron);
+                _this.cron = Object.assign(Object.assign({}, _this._data.cron), cron);
                 if (_this._data.loadCronLogs) {
                     _this.config = {
                         filters: [
@@ -492,9 +628,9 @@
                                 type: filter.ItemType.Select,
                                 name: 'state',
                                 label: 'Status',
-                                values: __spread([
+                                values: __spreadArray([
                                     { name: 'All', value: null }
-                                ], CronLogStates),
+                                ], __read(CronLogStates)),
                             },
                             {
                                 type: filter.ItemType.DateRange,
@@ -503,7 +639,7 @@
                             },
                         ],
                         fetch: function (query) {
-                            query = __assign(__assign({}, query), { cronId: _this.cron.id });
+                            query = Object.assign(Object.assign({}, query), { cronId: _this.cron.id });
                             return _this._data.loadCronLogs(query);
                         },
                     };
@@ -515,23 +651,23 @@
                 _this._cdRef.markForCheck();
             });
         };
-        CronComponent.ctorParameters = function () { return [
-            { type: undefined, decorators: [{ type: core.Inject, args: [dialog.MAT_DIALOG_DATA,] }] },
-            { type: dialog.MatDialog },
-            { type: core.ChangeDetectorRef }
-        ]; };
-        CronComponent = __decorate([
-            core.Component({
-                template: "<fs-dialog *fsSkeleton=\"cron\">\r\n  <h1 mat-dialog-title>\r\n    Cron\r\n    <div class=\"small\">{{cron.name}}</div>\r\n  </h1>\r\n  <mat-dialog-content>\r\n    <mat-tab-group (selectedIndexChange)=\"selectedIndexChange($event)\">\r\n      <mat-tab label=\"Overview\">\r\n        <div class=\"row\">\r\n          <fs-label-field>\r\n            <fs-label>\r\n              Status\r\n            </fs-label>\r\n            {{CronStates[cron.state]}}\r\n          </fs-label-field>\r\n\r\n          <fs-label-field *ngIf=\"cron.cronSetting\">\r\n            <fs-label>\r\n              Run Frequency\r\n            </fs-label>\r\n            {{cron.cronSetting.summary}}\r\n          </fs-label-field>\r\n\r\n          <fs-label-field>\r\n            <fs-label>\r\n              Last Ran\r\n            </fs-label>\r\n            <ng-container *ngIf=\"cron.duration===null; else lastRan\">\r\n              Never\r\n            </ng-container>\r\n            <ng-template #lastRan>\r\n              <fs-date-ago [date]=\"cron.createDate\"></fs-date-ago>\r\n              <div><small *ngIf=\"cron.duration\">Duration: {{ cron.duration | fsDateDuration }}</small></div>\r\n            </ng-template>\r\n          </fs-label-field>\r\n        </div>\r\n\r\n        <fs-label-field *ngIf=\"cron.message\">\r\n          <fs-label>\r\n            Last Message\r\n          </fs-label>\r\n          <div class=\"message\">{{cron.message}}</div>\r\n        </fs-label-field>\r\n      </mat-tab>\r\n      <mat-tab label=\"Logs\" *ngIf=\"config\">\r\n        <ng-template matTabContent>\r\n          <fs-list [config]=\"config\">\r\n            <fs-list-column name=\"state\" title=\"Status\">\r\n              <ng-template fs-list-cell let-row=\"row\">\r\n                <a \r\n                    (click)=\"cronLogOpen(row)\"\r\n                    [ngStyle]=\"{ color: CronLogStateColors[row.state] }\">\r\n                  {{CronLogStates[row.state] || row.state}}\r\n                </a>\r\n              </ng-template>\r\n            </fs-list-column>\r\n            \r\n            <fs-list-column title=\"Message\" class=\"col-message\">\r\n              <ng-template fs-list-cell let-row=\"row\">\r\n                <div class=\"message\">{{row.message}}</div>\r\n              </ng-template>\r\n            </fs-list-column>\r\n\r\n            <fs-list-column name=\"create_date\" title=\"Date\" class=\"col-date\">\r\n              <ng-template fs-list-cell let-row=\"row\">\r\n                <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n              </ng-template>\r\n            </fs-list-column>\r\n          </fs-list> \r\n        </ng-template>\r\n      </mat-tab>\r\n    </mat-tab-group>\r\n\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>   \r\n    <button \r\n        mat-button \r\n        [mat-dialog-close]=\"true\" \r\n        color=\"primary\">\r\n      Done\r\n    </button>\r\n    <ng-container *ngIf=\"tabIndex === 0\">\r\n      <button   \r\n          *ngFor=\"let cronAction of cronActions\"\r\n          mat-button \r\n          (click)=\"cronActionClick(cronAction)\">\r\n        {{cronAction.label}}\r\n      </button>  \r\n    </ng-container>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host ::ng-deep .col-message .message{white-space:break-spaces;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}:host ::ng-deep .col-date{white-space:nowrap}h1 .small{line-height:normal}.row{display:flex;flex-wrap:wrap}.row fs-label-field:not(:last-child){margin-right:40px}.message{white-space:pre-line}"]
-            }),
-            __param(0, core.Inject(dialog.MAT_DIALOG_DATA)),
-            __metadata("design:paramtypes", [Object, dialog.MatDialog,
-                core.ChangeDetectorRef])
-        ], CronComponent);
         return CronComponent;
-    }());
+    }());
+    CronComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CronComponent, deps: [{ token: i1$1.MAT_DIALOG_DATA }, { token: i1__namespace$1.MatDialog }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    CronComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CronComponent, selector: "ng-component", ngImport: i0__namespace, template: "<fs-dialog *fsSkeleton=\"cron\">\r\n  <h1 mat-dialog-title>\r\n    Cron\r\n    <div class=\"small\">{{cron.name}}</div>\r\n  </h1>\r\n  <mat-dialog-content>\r\n    <mat-tab-group (selectedIndexChange)=\"selectedIndexChange($event)\">\r\n      <mat-tab label=\"Overview\">\r\n        <div class=\"row\">\r\n          <fs-label-field>\r\n            <fs-label>\r\n              Status\r\n            </fs-label>\r\n            {{CronStates[cron.state]}}\r\n          </fs-label-field>\r\n\r\n          <fs-label-field *ngIf=\"cron.cronSetting\">\r\n            <fs-label>\r\n              Run Frequency\r\n            </fs-label>\r\n            {{cron.cronSetting.summary}}\r\n          </fs-label-field>\r\n\r\n          <fs-label-field>\r\n            <fs-label>\r\n              Last Ran\r\n            </fs-label>\r\n            <ng-container *ngIf=\"cron.duration===null; else lastRan\">\r\n              Never\r\n            </ng-container>\r\n            <ng-template #lastRan>\r\n              <fs-date-ago [date]=\"cron.createDate\"></fs-date-ago>\r\n              <div><small *ngIf=\"cron.duration\">Duration: {{ cron.duration | fsDateDuration }}</small></div>\r\n            </ng-template>\r\n          </fs-label-field>\r\n        </div>\r\n\r\n        <fs-label-field *ngIf=\"cron.message\">\r\n          <fs-label>\r\n            Last Message\r\n          </fs-label>\r\n          <div class=\"message\">{{cron.message}}</div>\r\n        </fs-label-field>\r\n      </mat-tab>\r\n      <mat-tab label=\"Logs\" *ngIf=\"config\">\r\n        <ng-template matTabContent>\r\n          <fs-list [config]=\"config\">\r\n            <fs-list-column name=\"state\" title=\"Status\">\r\n              <ng-template fs-list-cell let-row=\"row\">\r\n                <a \r\n                    (click)=\"cronLogOpen(row)\"\r\n                    [ngStyle]=\"{ color: CronLogStateColors[row.state] }\">\r\n                  {{CronLogStates[row.state] || row.state}}\r\n                </a>\r\n              </ng-template>\r\n            </fs-list-column>\r\n            \r\n            <fs-list-column title=\"Message\" class=\"col-message\">\r\n              <ng-template fs-list-cell let-row=\"row\">\r\n                <div class=\"message\">{{row.message}}</div>\r\n              </ng-template>\r\n            </fs-list-column>\r\n\r\n            <fs-list-column name=\"create_date\" title=\"Date\" class=\"col-date\">\r\n              <ng-template fs-list-cell let-row=\"row\">\r\n                <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n              </ng-template>\r\n            </fs-list-column>\r\n          </fs-list> \r\n        </ng-template>\r\n      </mat-tab>\r\n    </mat-tab-group>\r\n\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>   \r\n    <button \r\n        mat-button \r\n        [mat-dialog-close]=\"true\" \r\n        color=\"primary\">\r\n      Done\r\n    </button>\r\n    <ng-container *ngIf=\"tabIndex === 0\">\r\n      <button   \r\n          *ngFor=\"let cronAction of cronActions\"\r\n          mat-button \r\n          (click)=\"cronActionClick(cronAction)\">\r\n        {{cronAction.label}}\r\n      </button>  \r\n    </ng-container>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n", styles: [":host ::ng-deep .col-message .message{white-space:break-spaces;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}:host ::ng-deep .col-date{white-space:nowrap}h1 .small{line-height:normal}.row{display:flex;flex-wrap:wrap}.row fs-label-field:not(:last-child){margin-right:40px}.message{white-space:pre-line}\n"], components: [{ type: i2__namespace$2.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i3__namespace.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { type: i3__namespace.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby"], exportAs: ["matTab"] }, { type: i2__namespace$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i2__namespace$1.FsLabelComponent, selector: "fs-label" }, { type: i4__namespace$2.FsDateAgoComponent, selector: "fs-date-ago", inputs: ["date", "showTime", "format", "showTooltip", "tooltipDateFormat"] }, { type: i3__namespace$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i4__namespace.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i5__namespace.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i1__namespace$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i9__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.MatTabContent, selector: "[matTabContent]" }, { type: i3__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i3__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i9__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i10__namespace.DefaultStyleDirective, selector: "  [ngStyle],  [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],  [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],  [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { type: i1__namespace$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1__namespace$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }, { type: i9__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "fsDateDuration": i4__namespace$2.FsDateDurationPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CronComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        templateUrl: './cron.component.html',
+                        styleUrls: ['./cron.component.scss'],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i1$1.MAT_DIALOG_DATA]
+                        }] }, { type: i1__namespace$1.MatDialog }, { type: i0__namespace.ChangeDetectorRef }];
+        } });
 
     var CronsComponent = /** @class */ (function () {
         function CronsComponent(_message, _dialog) {
@@ -556,7 +692,7 @@
                 ],
                 rowActions: this.getCronActions()
                     .map(function (rowAction) {
-                    return __assign(__assign({}, rowAction), { click: function (cron) {
+                    return Object.assign(Object.assign({}, rowAction), { click: function (cron) {
                             rowAction.action(cron)
                                 .subscribe();
                         } });
@@ -673,61 +809,61 @@
                 },
             ];
         };
-        CronsComponent.ctorParameters = function () { return [
-            { type: message.FsMessage },
-            { type: dialog.MatDialog }
-        ]; };
-        __decorate([
-            core.ViewChild(list.FsListComponent, { static: true }),
-            __metadata("design:type", list.FsListComponent)
-        ], CronsComponent.prototype, "list", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], CronsComponent.prototype, "enable", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], CronsComponent.prototype, "disable", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], CronsComponent.prototype, "kill", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], CronsComponent.prototype, "queue", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], CronsComponent.prototype, "run", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], CronsComponent.prototype, "loadCrons", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], CronsComponent.prototype, "loadCron", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], CronsComponent.prototype, "loadCronLogs", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], CronsComponent.prototype, "bulk", void 0);
-        CronsComponent = __decorate([
-            core.Component({
-                selector: 'fs-system-crons',
-                template: "<fs-list [config]=\"config\">\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Name</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <a (click)=\"open(row)\">{{row.name}}</a>\r\n      <div *ngIf=\"row.cronSetting\">\r\n        <small>{{row.cronSetting.summary}}</small>\r\n      </div>\r\n    </ng-template>\r\n  </fs-list-column>\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Status</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{cronStates[row.state]}}\r\n    </ng-template>\r\n  </fs-list-column>\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Last Ran</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <ng-container *ngIf=\"row.duration===null; else lastRan\">\r\n        Never\r\n      </ng-container>\r\n      <ng-template #lastRan>\r\n        <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n        <div><small *ngIf=\"row.duration\">Duration: {{ row.duration | fsDateDuration }}</small></div>\r\n      </ng-template>\r\n    </ng-template>\r\n  </fs-list-column>\r\n</fs-list>\r\n",
-                styles: [""]
-            }),
-            __metadata("design:paramtypes", [message.FsMessage,
-                dialog.MatDialog])
-        ], CronsComponent);
         return CronsComponent;
-    }());
+    }());
+    CronsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CronsComponent, deps: [{ token: i1__namespace.FsMessage }, { token: i1__namespace$1.MatDialog }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    CronsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CronsComponent, selector: "fs-system-crons", inputs: { enable: "enable", disable: "disable", kill: "kill", queue: "queue", run: "run", loadCrons: "loadCrons", loadCron: "loadCron", loadCronLogs: "loadCronLogs", bulk: "bulk" }, viewQueries: [{ propertyName: "list", first: true, predicate: i3$1.FsListComponent, descendants: true, static: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"config\">\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Name</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <a (click)=\"open(row)\">{{row.name}}</a>\r\n      <div *ngIf=\"row.cronSetting\">\r\n        <small>{{row.cronSetting.summary}}</small>\r\n      </div>\r\n    </ng-template>\r\n  </fs-list-column>\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Status</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{cronStates[row.state]}}\r\n    </ng-template>\r\n  </fs-list-column>\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Last Ran</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <ng-container *ngIf=\"row.duration===null; else lastRan\">\r\n        Never\r\n      </ng-container>\r\n      <ng-template #lastRan>\r\n        <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n        <div><small *ngIf=\"row.duration\">Duration: {{ row.duration | fsDateDuration }}</small></div>\r\n      </ng-template>\r\n    </ng-template>\r\n  </fs-list-column>\r\n</fs-list>\r\n", styles: [""], components: [{ type: i3__namespace$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i4__namespace$2.FsDateAgoComponent, selector: "fs-date-ago", inputs: ["date", "showTime", "format", "showTooltip", "tooltipDateFormat"] }], directives: [{ type: i3__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i3__namespace$1.FsListHeaderDirective, selector: "[fs-list-header]", inputs: ["colspan", "align", "class"] }, { type: i3__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i9__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "fsDateDuration": i4__namespace$2.FsDateDurationPipe } });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CronsComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-system-crons',
+                        templateUrl: './crons.component.html',
+                        styleUrls: ['./crons.component.scss'],
+                    }]
+            }], ctorParameters: function () { return [{ type: i1__namespace.FsMessage }, { type: i1__namespace$1.MatDialog }]; }, propDecorators: { list: [{
+                    type: i0.ViewChild,
+                    args: [i3$1.FsListComponent, { static: true }]
+                }], enable: [{
+                    type: i0.Input
+                }], disable: [{
+                    type: i0.Input
+                }], kill: [{
+                    type: i0.Input
+                }], queue: [{
+                    type: i0.Input
+                }], run: [{
+                    type: i0.Input
+                }], loadCrons: [{
+                    type: i0.Input
+                }], loadCron: [{
+                    type: i0.Input
+                }], loadCronLogs: [{
+                    type: i0.Input
+                }], bulk: [{
+                    type: i0.Input
+                }] } });
+
+    var KeyNameValuePipe = /** @class */ (function () {
+        function KeyNameValuePipe() {
+        }
+        KeyNameValuePipe.prototype.transform = function (values) {
+            return Object.keys(values).map(function (key) {
+                return { value: key, name: values[key] };
+            });
+        };
+        return KeyNameValuePipe;
+    }());
+    KeyNameValuePipe.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: KeyNameValuePipe, deps: [], target: i0__namespace.ɵɵFactoryTarget.Pipe });
+    KeyNameValuePipe.ɵpipe = i0__namespace.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: KeyNameValuePipe, name: "keyNameValue" });
+    KeyNameValuePipe.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: KeyNameValuePipe });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: KeyNameValuePipe, decorators: [{
+                type: i0.Pipe,
+                args: [{
+                        name: 'keyNameValue'
+                    }]
+            }, {
+                type: i0.Injectable
+            }] });
 
     var SettingsComponent = /** @class */ (function () {
         function SettingsComponent(_message, _clipboardService, _prompt, _cdRef) {
@@ -735,8 +871,8 @@
             this._clipboardService = _clipboardService;
             this._prompt = _prompt;
             this._cdRef = _cdRef;
-            this.fileRemove = new core.EventEmitter();
-            this.fileSelect = new core.EventEmitter();
+            this.fileRemove = new i0.EventEmitter();
+            this.fileSelect = new i0.EventEmitter();
             this.groupedSettings = [];
             this.groups = [];
             this.SettingInterfaceType = SettingInterfaceType;
@@ -753,7 +889,7 @@
                     switch (setting.interfaceType) {
                         case SettingInterfaceType.Date:
                         case SettingInterfaceType.Time:
-                            setting.value = date.parse(setting.value);
+                            setting.value = i4$2.parse(setting.value);
                         case SettingInterfaceType.SelectMultiple:
                             setting.value = Array.isArray(setting.value) ? setting.value : [];
                             break;
@@ -819,42 +955,27 @@
                 _this._message.success('Changes Saved');
             });
         };
-        SettingsComponent.ctorParameters = function () { return [
-            { type: message.FsMessage },
-            { type: ngxClipboard.ClipboardService },
-            { type: prompt.FsPrompt },
-            { type: core.ChangeDetectorRef }
-        ]; };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], SettingsComponent.prototype, "loadSettings", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], SettingsComponent.prototype, "save", void 0);
-        __decorate([
-            core.Output(),
-            __metadata("design:type", Object)
-        ], SettingsComponent.prototype, "fileRemove", void 0);
-        __decorate([
-            core.Output(),
-            __metadata("design:type", Object)
-        ], SettingsComponent.prototype, "fileSelect", void 0);
-        SettingsComponent = __decorate([
-            core.Component({
-                selector: 'fs-system-settings',
-                template: "\r\n<mat-accordion>\r\n  <mat-expansion-panel hideToggle *ngFor=\"let group of groups\">\r\n    <mat-expansion-panel-header>\r\n      <mat-panel-title>\r\n        <div class=\"title-row\">\r\n          <div class=\"title\">{{group || 'General'}}</div>\r\n          <div class=\"actions\">\r\n            <button\r\n              type=\"button\"\r\n              [matTooltip]=\"'Export ' + (group || 'General') + ' Settings'\"\r\n              mat-icon-button\r\n              (click)=\"export($event, groupedSettings[group])\">\r\n              <mat-icon>cloud_download</mat-icon>\r\n            </button>\r\n            <button\r\n              type=\"button\"\r\n              [matTooltip]=\"'Import ' + (group || 'General') + ' Settings'\"\r\n              mat-icon-button\r\n              (click)=\"import($event, group)\">\r\n              <mat-icon>cloud_upload</mat-icon>\r\n            </button>\r\n          </div>\r\n        </div>\r\n      </mat-panel-title>\r\n    </mat-expansion-panel-header>\r\n\r\n    <div hideToggle *ngFor=\"let setting of groupedSettings[group]\">\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\"\r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.InputBox\">\r\n        <input\r\n          matInput\r\n          [placeholder]=\"setting.label\"\r\n          [(ngModel)]=\"setting.value\"\r\n          [name]=\"'setting' + setting.id\">\r\n          <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\" \r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.Textarea\">\r\n        <textarea\r\n          matInput\r\n          [placeholder]=\"setting.label\"\r\n          [(ngModel)]=\"setting.value\"\r\n          [name]=\"'setting' + setting.id\">\r\n        </textarea>\r\n        <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\" \r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.Select || setting.interfaceType===SettingInterfaceType.SelectMultiple\">\r\n        <mat-select\r\n            [placeholder]=\"setting.label\"\r\n            [(ngModel)]=\"setting.value\"\r\n            [multiple]=\"setting.interfaceType===SettingInterfaceType.SelectMultiple\"\r\n            [name]=\"'setting' + setting.id\">\r\n          <mat-option *ngFor=\"let item of setting.values | keyNameValue\" [value]=\"item.value\">\r\n            {{item.name}}\r\n          </mat-option>\r\n        </mat-select>\r\n        <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\" \r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.Date\">\r\n        <input\r\n          matInput\r\n          fsDatePicker\r\n          [placeholder]=\"setting.label\"\r\n          [(ngModel)]=\"setting.value\"\r\n          [name]=\"'setting' + setting.id\">\r\n          <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\" \r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.Time\">\r\n        <input\r\n          matInput\r\n          fsTimePicker\r\n          [placeholder]=\"setting.label\"\r\n          [(ngModel)]=\"setting.value\"\r\n          [name]=\"'setting' + setting.id\">\r\n          <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <fs-file-picker\r\n        *ngIf=\"setting.interfaceType===SettingInterfaceType.File\"\r\n        [allowRemove]=\"true\"\r\n        [allowDownload]=\"true\"\r\n        (select)=\"fileSelect.emit({ setting: setting, file: $event.file })\"\r\n        (remove)=\"fileRemove.emit(setting)\"\r\n        [url]=\"setting.value\">\r\n        <div fsFileLabel>{{setting.label}}</div>\r\n      </fs-file-picker>\r\n    </div>\r\n\r\n    <button mat-raised-button color=\"primary\" type=\"button\" (click)=\"saveGroup(group)\">Save</button>\r\n\r\n  </mat-expansion-panel>\r\n\r\n</mat-accordion>\r\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [".mat-expansion-panel-header{font-size:19px}.full-width{width:100%}.title-row{flex-direction:row;box-sizing:border-box;display:flex;place-content:center flex-start;align-items:center;width:100%}.title-row .title{display:flex;flex:1}:host ::ng-deep .mat-expansion-panel-header-title{margin:0}:host ::ng-deep .mat-expansion-panel .actions{display:none}:host ::ng-deep .mat-expansion-panel.mat-expanded .actions{display:block}"]
-            }),
-            __metadata("design:paramtypes", [message.FsMessage,
-                ngxClipboard.ClipboardService,
-                prompt.FsPrompt,
-                core.ChangeDetectorRef])
-        ], SettingsComponent);
         return SettingsComponent;
-    }());
+    }());
+    SettingsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SettingsComponent, deps: [{ token: i1__namespace.FsMessage }, { token: i2__namespace$3.ClipboardService }, { token: i3__namespace$2.FsPrompt }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    SettingsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SettingsComponent, selector: "fs-system-settings", inputs: { loadSettings: "loadSettings", save: "save" }, outputs: { fileRemove: "fileRemove", fileSelect: "fileSelect" }, ngImport: i0__namespace, template: "\r\n<mat-accordion>\r\n  <mat-expansion-panel hideToggle *ngFor=\"let group of groups\">\r\n    <mat-expansion-panel-header>\r\n      <mat-panel-title>\r\n        <div class=\"title-row\">\r\n          <div class=\"title\">{{group || 'General'}}</div>\r\n          <div class=\"actions\">\r\n            <button\r\n              type=\"button\"\r\n              [matTooltip]=\"'Export ' + (group || 'General') + ' Settings'\"\r\n              mat-icon-button\r\n              (click)=\"export($event, groupedSettings[group])\">\r\n              <mat-icon>cloud_download</mat-icon>\r\n            </button>\r\n            <button\r\n              type=\"button\"\r\n              [matTooltip]=\"'Import ' + (group || 'General') + ' Settings'\"\r\n              mat-icon-button\r\n              (click)=\"import($event, group)\">\r\n              <mat-icon>cloud_upload</mat-icon>\r\n            </button>\r\n          </div>\r\n        </div>\r\n      </mat-panel-title>\r\n    </mat-expansion-panel-header>\r\n\r\n    <div hideToggle *ngFor=\"let setting of groupedSettings[group]\">\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\"\r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.InputBox\">\r\n        <input\r\n          matInput\r\n          [placeholder]=\"setting.label\"\r\n          [(ngModel)]=\"setting.value\"\r\n          [name]=\"'setting' + setting.id\">\r\n          <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\" \r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.Textarea\">\r\n        <textarea\r\n          matInput\r\n          [placeholder]=\"setting.label\"\r\n          [(ngModel)]=\"setting.value\"\r\n          [name]=\"'setting' + setting.id\">\r\n        </textarea>\r\n        <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\" \r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.Select || setting.interfaceType===SettingInterfaceType.SelectMultiple\">\r\n        <mat-select\r\n            [placeholder]=\"setting.label\"\r\n            [(ngModel)]=\"setting.value\"\r\n            [multiple]=\"setting.interfaceType===SettingInterfaceType.SelectMultiple\"\r\n            [name]=\"'setting' + setting.id\">\r\n          <mat-option *ngFor=\"let item of setting.values | keyNameValue\" [value]=\"item.value\">\r\n            {{item.name}}\r\n          </mat-option>\r\n        </mat-select>\r\n        <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\" \r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.Date\">\r\n        <input\r\n          matInput\r\n          fsDatePicker\r\n          [placeholder]=\"setting.label\"\r\n          [(ngModel)]=\"setting.value\"\r\n          [name]=\"'setting' + setting.id\">\r\n          <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <mat-form-field \r\n          class=\"full-width form-field-multiline-subscript\" \r\n          *ngIf=\"setting.interfaceType===SettingInterfaceType.Time\">\r\n        <input\r\n          matInput\r\n          fsTimePicker\r\n          [placeholder]=\"setting.label\"\r\n          [(ngModel)]=\"setting.value\"\r\n          [name]=\"'setting' + setting.id\">\r\n          <mat-hint>{{setting.instruction}}</mat-hint>\r\n      </mat-form-field>\r\n\r\n      <fs-file-picker\r\n        *ngIf=\"setting.interfaceType===SettingInterfaceType.File\"\r\n        [allowRemove]=\"true\"\r\n        [allowDownload]=\"true\"\r\n        (select)=\"fileSelect.emit({ setting: setting, file: $event.file })\"\r\n        (remove)=\"fileRemove.emit(setting)\"\r\n        [url]=\"setting.value\">\r\n        <div fsFileLabel>{{setting.label}}</div>\r\n      </fs-file-picker>\r\n    </div>\r\n\r\n    <button mat-raised-button color=\"primary\" type=\"button\" (click)=\"saveGroup(group)\">Save</button>\r\n\r\n  </mat-expansion-panel>\r\n\r\n</mat-accordion>\r\n", styles: [".mat-expansion-panel-header{font-size:19px}.full-width{width:100%}.title-row{flex-direction:row;box-sizing:border-box;display:flex;place-content:center flex-start;align-items:center;width:100%}.title-row .title{display:flex;flex:1}:host ::ng-deep .mat-expansion-panel-header-title{margin:0}:host ::ng-deep .mat-expansion-panel .actions{display:none}:host ::ng-deep .mat-expansion-panel.mat-expanded .actions{display:block}\n"], components: [{ type: i4__namespace$3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { type: i4__namespace$3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { type: i4__namespace.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i6__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i7__namespace.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i8__namespace.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i9__namespace$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i10__namespace$1.FsDatePickerComponent, selector: "[fsDatePicker]", inputs: ["minYear", "maxYear", "minDate", "maxDate", "startOfDay", "view", "format", "minutes"], outputs: ["change"] }, { type: i10__namespace$1.FsTimePickerComponent, selector: "[fsTimePicker]", inputs: ["view"] }, { type: i11__namespace$1.FsFilePickerComponent, selector: "fs-file-picker", inputs: ["imageWidth", "imageHeight", "imageQuality", "showFilename", "url", "file", "accept", "disabled", "width", "height", "previewWidth", "previewHeight", "allowDownload", "allowReupload", "allowRemove"], outputs: ["select", "remove"] }], directives: [{ type: i4__namespace$3.MatAccordion, selector: "mat-accordion", inputs: ["multi", "displayMode", "togglePosition", "hideToggle"], exportAs: ["matAccordion"] }, { type: i9__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4__namespace$3.MatExpansionPanelTitle, selector: "mat-panel-title" }, { type: i11__namespace.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i9__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i14__namespace.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { type: i15__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i15__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i15__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7__namespace.MatHint, selector: "mat-hint", inputs: ["align", "id"] }], pipes: { "keyNameValue": KeyNameValuePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SettingsComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-system-settings',
+                        templateUrl: './settings.component.html',
+                        styleUrls: ['./settings.component.scss'],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () { return [{ type: i1__namespace.FsMessage }, { type: i2__namespace$3.ClipboardService }, { type: i3__namespace$2.FsPrompt }, { type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { loadSettings: [{
+                    type: i0.Input
+                }], save: [{
+                    type: i0.Input
+                }], fileRemove: [{
+                    type: i0.Output
+                }], fileSelect: [{
+                    type: i0.Output
+                }] } });
 
     var FileManagerComponent = /** @class */ (function () {
         function FileManagerComponent() {
@@ -885,57 +1006,30 @@
                 }
             };
         };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FileManagerComponent.prototype, "fetch", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FileManagerComponent.prototype, "deleteFile", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FileManagerComponent.prototype, "deleteDirectory", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FileManagerComponent.prototype, "createDirectory", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FileManagerComponent.prototype, "download", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FileManagerComponent.prototype, "upload", void 0);
-        FileManagerComponent = __decorate([
-            core.Component({
-                selector: 'fs-system-file-manager',
-                template: "<fs-file-manager [config]=\"config\"></fs-file-manager>",
-                styles: [""]
-            }),
-            __metadata("design:paramtypes", [])
-        ], FileManagerComponent);
         return FileManagerComponent;
-    }());
-
-    var KeyNameValuePipe = /** @class */ (function () {
-        function KeyNameValuePipe() {
-        }
-        KeyNameValuePipe.prototype.transform = function (values) {
-            return Object.keys(values).map(function (key) {
-                return { value: key, name: values[key] };
-            });
-        };
-        KeyNameValuePipe = __decorate([
-            core.Pipe({
-                name: 'keyNameValue'
-            }),
-            core.Injectable()
-        ], KeyNameValuePipe);
-        return KeyNameValuePipe;
-    }());
+    }());
+    FileManagerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FileManagerComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FileManagerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FileManagerComponent, selector: "fs-system-file-manager", inputs: { fetch: "fetch", deleteFile: "deleteFile", deleteDirectory: "deleteDirectory", createDirectory: "createDirectory", download: "download", upload: "upload" }, ngImport: i0__namespace, template: "<fs-file-manager [config]=\"config\"></fs-file-manager>", styles: [""], components: [{ type: i1__namespace$2.FsFileManagerComponent, selector: "fs-file-manager", inputs: ["config"] }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FileManagerComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-system-file-manager',
+                        templateUrl: './file-manager.component.html',
+                        styleUrls: ['./file-manager.component.scss']
+                    }]
+            }], ctorParameters: function () { return []; }, propDecorators: { fetch: [{
+                    type: i0.Input
+                }], deleteFile: [{
+                    type: i0.Input
+                }], deleteDirectory: [{
+                    type: i0.Input
+                }], createDirectory: [{
+                    type: i0.Input
+                }], download: [{
+                    type: i0.Input
+                }], upload: [{
+                    type: i0.Input
+                }] } });
 
     var ProcessComponent = /** @class */ (function () {
         function ProcessComponent(_dialogRef, data) {
@@ -959,20 +1053,22 @@
                 _this.process = process;
             });
         };
-        ProcessComponent.ctorParameters = function () { return [
-            { type: dialog.MatDialogRef },
-            { type: undefined, decorators: [{ type: core.Inject, args: [dialog.MAT_DIALOG_DATA,] }] }
-        ]; };
-        ProcessComponent = __decorate([
-            core.Component({
-                template: "<fs-dialog *fsSkeleton=\"process\">\r\n  <div mat-dialog-title>Process</div>\r\n  <mat-dialog-content>\r\n    <div fxLayout=\"column\">\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Name\r\n        </fs-label>\r\n        {{process.prettyName}}\r\n      </fs-label-field>\r\n\r\n      <div fxLayout=\"row\" fxLayoutGap=\"20px\">\r\n\r\n        <fs-label-field>\r\n          <fs-label>\r\n            Status\r\n          </fs-label>\r\n          {{ProcessStates[process.state]}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.notify\">\r\n          <fs-label>\r\n            Notification Email\r\n          </fs-label>\r\n          {{process.notify}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.pid\">\r\n          <fs-label>\r\n            PID\r\n          </fs-label>\r\n          {{process.pid}}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div fxLayout=\"row\" fxLayoutGap=\"20px\">\r\n        <fs-label-field>\r\n          <fs-label>\r\n            Create Date\r\n          </fs-label>\r\n          {{ process.createDate | fsDateFormat: 'date-time' }}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.startDate\">\r\n          <fs-label>\r\n            Start Date\r\n          </fs-label>\r\n          {{ process.startDate | fsDateFormat: 'date-time' }}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.endDate\">\r\n          <fs-label>\r\n            Complete Date\r\n          </fs-label>\r\n          {{ process.endDate | fsDateFormat: 'date-time' }}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.duration\">\r\n          <fs-label>\r\n            Duration\r\n          </fs-label>\r\n          {{ process.duration | fsDateDuration: {hours: true, minutes: true, seconds: true} }}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <fs-label-field *ngIf=\"process.message\">\r\n        <fs-label>\r\n          Message\r\n        </fs-label>\r\n        {{process.message}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"process.log\" class=\"log\">\r\n        <fs-label>\r\n          Log\r\n        </fs-label>{{process.log}}\r\n      </fs-label-field>\r\n\r\n    </div>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">Done</button>\r\n    <button\r\n      *ngIf=\"process.state===ProcessState.Running && data.loadProcess\"\r\n      mat-button\r\n      (click)=\"load()\">\r\n      Reload\r\n    </button>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n",
-                styles: [":host ::ng-deep .log .field-content{white-space:pre-wrap;font-family:monospace;font-size:14px}"]
-            }),
-            __param(1, core.Inject(dialog.MAT_DIALOG_DATA)),
-            __metadata("design:paramtypes", [dialog.MatDialogRef, Object])
-        ], ProcessComponent);
         return ProcessComponent;
-    }());
+    }());
+    ProcessComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ProcessComponent, deps: [{ token: i1__namespace$1.MatDialogRef }, { token: i1$1.MAT_DIALOG_DATA }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    ProcessComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ProcessComponent, selector: "ng-component", ngImport: i0__namespace, template: "<fs-dialog *fsSkeleton=\"process\">\r\n  <div mat-dialog-title>Process</div>\r\n  <mat-dialog-content>\r\n    <div fxLayout=\"column\">\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Name\r\n        </fs-label>\r\n        {{process.prettyName}}\r\n      </fs-label-field>\r\n\r\n      <div fxLayout=\"row\" fxLayoutGap=\"20px\">\r\n\r\n        <fs-label-field>\r\n          <fs-label>\r\n            Status\r\n          </fs-label>\r\n          {{ProcessStates[process.state]}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.notify\">\r\n          <fs-label>\r\n            Notification Email\r\n          </fs-label>\r\n          {{process.notify}}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.pid\">\r\n          <fs-label>\r\n            PID\r\n          </fs-label>\r\n          {{process.pid}}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <div fxLayout=\"row\" fxLayoutGap=\"20px\">\r\n        <fs-label-field>\r\n          <fs-label>\r\n            Create Date\r\n          </fs-label>\r\n          {{ process.createDate | fsDateFormat: 'date-time' }}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.startDate\">\r\n          <fs-label>\r\n            Start Date\r\n          </fs-label>\r\n          {{ process.startDate | fsDateFormat: 'date-time' }}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.endDate\">\r\n          <fs-label>\r\n            Complete Date\r\n          </fs-label>\r\n          {{ process.endDate | fsDateFormat: 'date-time' }}\r\n        </fs-label-field>\r\n\r\n        <fs-label-field *ngIf=\"process.duration\">\r\n          <fs-label>\r\n            Duration\r\n          </fs-label>\r\n          {{ process.duration | fsDateDuration: {hours: true, minutes: true, seconds: true} }}\r\n        </fs-label-field>\r\n      </div>\r\n\r\n      <fs-label-field *ngIf=\"process.message\">\r\n        <fs-label>\r\n          Message\r\n        </fs-label>\r\n        {{process.message}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"process.log\" class=\"log\">\r\n        <fs-label>\r\n          Log\r\n        </fs-label>{{process.log}}\r\n      </fs-label-field>\r\n\r\n    </div>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">Done</button>\r\n    <button\r\n      *ngIf=\"process.state===ProcessState.Running && data.loadProcess\"\r\n      mat-button\r\n      (click)=\"load()\">\r\n      Reload\r\n    </button>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n", styles: [":host ::ng-deep .log .field-content{white-space:pre-wrap;font-family:monospace;font-size:14px}\n"], components: [{ type: i2__namespace$2.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i2__namespace$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i2__namespace$1.FsLabelComponent, selector: "fs-label" }, { type: i4__namespace.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i5__namespace.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i1__namespace$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i6__namespace$1.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i6__namespace$1.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i9__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1__namespace$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "fsDateFormat": i4__namespace$2.FsDateFormatPipe, "fsDateDuration": i4__namespace$2.FsDateDurationPipe } });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ProcessComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        templateUrl: './process.component.html',
+                        styleUrls: ['./process.component.scss']
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i1__namespace$1.MatDialogRef }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i1$1.MAT_DIALOG_DATA]
+                        }] }];
+        } });
 
     var ProcessesComponent = /** @class */ (function () {
         function ProcessesComponent(_dialog, _message) {
@@ -1093,53 +1189,35 @@
             this._destroy$.next();
             this._destroy$.complete();
         };
-        ProcessesComponent.ctorParameters = function () { return [
-            { type: dialog.MatDialog },
-            { type: message.FsMessage }
-        ]; };
-        __decorate([
-            core.ViewChild(list.FsListComponent),
-            __metadata("design:type", list.FsListComponent)
-        ], ProcessesComponent.prototype, "list", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], ProcessesComponent.prototype, "loadProcesses", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], ProcessesComponent.prototype, "loadProcess", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], ProcessesComponent.prototype, "run", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], ProcessesComponent.prototype, "kill", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], ProcessesComponent.prototype, "delete", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], ProcessesComponent.prototype, "download", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Array)
-        ], ProcessesComponent.prototype, "actions", void 0);
-        ProcessesComponent = __decorate([
-            core.Component({
-                selector: 'fs-system-processes',
-                template: "<fs-list [config]=\"config\">\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Name</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <a (click)=\"open(row)\">{{row.prettyName}}</a>\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Status</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{ProcessStates[row.state]}}\r\n      <small>\r\n        <div *ngIf=\"row.state===ProcessState.Running && row.percent\">Complete: {{ row.percent }}%</div>\r\n        <div *ngIf=\"row.state===ProcessState.Completed && row.filename\">Download: <a href=\"javascript:;\" (click)=\"download(row)\">{{ row.filename }}</a></div>\r\n        <div *ngIf=\"row.pid\">PID: {{ row.pid }}</div>\r\n        <div *ngIf=\"row.state===ProcessState.Running && row.notify\">Notify: {{ row.notify }}</div>\r\n      </small>\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Duration</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{ row.duration | fsDateDuration: {hours: true, minutes: true, seconds: true} }}\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Message</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{row.message}}\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Completed</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <fs-date-ago [date]=\"row.endDate\"></fs-date-ago>\r\n    </ng-template>\r\n  </fs-list-column>\r\n</fs-list>\r\n",
-                styles: [""]
-            }),
-            __metadata("design:paramtypes", [dialog.MatDialog,
-                message.FsMessage])
-        ], ProcessesComponent);
         return ProcessesComponent;
-    }());
+    }());
+    ProcessesComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ProcessesComponent, deps: [{ token: i1__namespace$1.MatDialog }, { token: i1__namespace.FsMessage }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    ProcessesComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ProcessesComponent, selector: "fs-system-processes", inputs: { loadProcesses: "loadProcesses", loadProcess: "loadProcess", run: "run", kill: "kill", delete: "delete", download: "download", actions: "actions" }, viewQueries: [{ propertyName: "list", first: true, predicate: i3$1.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"config\">\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Name</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <a (click)=\"open(row)\">{{row.prettyName}}</a>\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Status</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{ProcessStates[row.state]}}\r\n      <small>\r\n        <div *ngIf=\"row.state===ProcessState.Running && row.percent\">Complete: {{ row.percent }}%</div>\r\n        <div *ngIf=\"row.state===ProcessState.Completed && row.filename\">Download: <a href=\"javascript:;\" (click)=\"download(row)\">{{ row.filename }}</a></div>\r\n        <div *ngIf=\"row.pid\">PID: {{ row.pid }}</div>\r\n        <div *ngIf=\"row.state===ProcessState.Running && row.notify\">Notify: {{ row.notify }}</div>\r\n      </small>\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Duration</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{ row.duration | fsDateDuration: {hours: true, minutes: true, seconds: true} }}\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Message</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{row.message}}\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Completed</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <fs-date-ago [date]=\"row.endDate\"></fs-date-ago>\r\n    </ng-template>\r\n  </fs-list-column>\r\n</fs-list>\r\n", styles: [""], components: [{ type: i3__namespace$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i4__namespace$2.FsDateAgoComponent, selector: "fs-date-ago", inputs: ["date", "showTime", "format", "showTooltip", "tooltipDateFormat"] }], directives: [{ type: i3__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i3__namespace$1.FsListHeaderDirective, selector: "[fs-list-header]", inputs: ["colspan", "align", "class"] }, { type: i3__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i9__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "fsDateDuration": i4__namespace$2.FsDateDurationPipe } });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ProcessesComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-system-processes',
+                        templateUrl: './processes.component.html',
+                        styleUrls: ['./processes.component.scss']
+                    }]
+            }], ctorParameters: function () { return [{ type: i1__namespace$1.MatDialog }, { type: i1__namespace.FsMessage }]; }, propDecorators: { list: [{
+                    type: i0.ViewChild,
+                    args: [i3$1.FsListComponent]
+                }], loadProcesses: [{
+                    type: i0.Input
+                }], loadProcess: [{
+                    type: i0.Input
+                }], run: [{
+                    type: i0.Input
+                }], kill: [{
+                    type: i0.Input
+                }], delete: [{
+                    type: i0.Input
+                }], download: [{
+                    type: i0.Input
+                }], actions: [{
+                    type: i0.Input
+                }] } });
 
     var ServerLogComponent = /** @class */ (function () {
         function ServerLogComponent(data) {
@@ -1158,19 +1236,22 @@
                 catch (e) { }
             }
         };
-        ServerLogComponent.ctorParameters = function () { return [
-            { type: undefined, decorators: [{ type: core.Inject, args: [dialog.MAT_DIALOG_DATA,] }] }
-        ]; };
-        ServerLogComponent = __decorate([
-            core.Component({
-                template: "<fs-dialog *fsSkeleton=\"log\">\r\n  <div mat-dialog-title>Log</div>\r\n  <mat-dialog-content>\r\n    <div fxLayout=\"column\">\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Error Type\r\n        </fs-label>\r\n        {{log.type}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Message\r\n        </fs-label>\r\n        {{log.message}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          URL\r\n        </fs-label>\r\n        {{log.url}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Date\r\n        </fs-label>\r\n        {{log.createDate|fsDateFormat: 'full-date-time'}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          File\r\n        </fs-label>\r\n        {{log.file}} @ {{log.line}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Backtrace\r\n        </fs-label>\r\n        <pre>{{log.backtrace|json}}</pre>\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          $_SERVER\r\n        </fs-label>\r\n        <pre>{{log.server|json}}</pre>\r\n      </fs-label-field>\r\n    </div>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">Done</button>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n",
-                styles: [""]
-            }),
-            __param(0, core.Inject(dialog.MAT_DIALOG_DATA)),
-            __metadata("design:paramtypes", [Object])
-        ], ServerLogComponent);
         return ServerLogComponent;
-    }());
+    }());
+    ServerLogComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ServerLogComponent, deps: [{ token: i1$1.MAT_DIALOG_DATA }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    ServerLogComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ServerLogComponent, selector: "ng-component", ngImport: i0__namespace, template: "<fs-dialog *fsSkeleton=\"log\">\r\n  <div mat-dialog-title>Log</div>\r\n  <mat-dialog-content>\r\n    <div fxLayout=\"column\">\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Error Type\r\n        </fs-label>\r\n        {{log.type}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Message\r\n        </fs-label>\r\n        {{log.message}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          URL\r\n        </fs-label>\r\n        {{log.url}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Date\r\n        </fs-label>\r\n        {{log.createDate|fsDateFormat: 'full-date-time'}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          File\r\n        </fs-label>\r\n        {{log.file}} @ {{log.line}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Backtrace\r\n        </fs-label>\r\n        <pre>{{log.backtrace|json}}</pre>\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          $_SERVER\r\n        </fs-label>\r\n        <pre>{{log.server|json}}</pre>\r\n      </fs-label-field>\r\n    </div>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">Done</button>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n", styles: [""], components: [{ type: i2__namespace$2.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i2__namespace$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i2__namespace$1.FsLabelComponent, selector: "fs-label" }, { type: i4__namespace.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i5__namespace.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i1__namespace$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i6__namespace$1.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i1__namespace$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1__namespace$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "fsDateFormat": i4__namespace$2.FsDateFormatPipe, "json": i9__namespace.JsonPipe } });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ServerLogComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        templateUrl: './server-log.component.html',
+                        styleUrls: ['./server-log.component.scss']
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i1$1.MAT_DIALOG_DATA]
+                        }] }];
+        } });
 
     var ServerLogsComponent = /** @class */ (function () {
         function ServerLogsComponent(_dialog) {
@@ -1203,27 +1284,23 @@
                 width: '85%'
             });
         };
-        ServerLogsComponent.ctorParameters = function () { return [
-            { type: dialog.MatDialog }
-        ]; };
-        __decorate([
-            core.ViewChild('list', { static: true }),
-            __metadata("design:type", list.FsListComponent)
-        ], ServerLogsComponent.prototype, "list", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], ServerLogsComponent.prototype, "loadLogs", void 0);
-        ServerLogsComponent = __decorate([
-            core.Component({
-                selector: 'fs-system-server-logs',
-                template: "<fs-list [config]=\"config\">\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Message</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        <a href=\"javascript:;\" (click)=\"open(row)\">{{row.message}}</a>\r\n      </ng-template>\r\n    </fs-list-column>\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Type</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        {{row.type}}\r\n      </ng-template>\r\n    </fs-list-column>\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Date</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n      </ng-template>\r\n    </fs-list-column>\r\n  </fs-list>\r\n",
-                styles: [""]
-            }),
-            __metadata("design:paramtypes", [dialog.MatDialog])
-        ], ServerLogsComponent);
         return ServerLogsComponent;
-    }());
+    }());
+    ServerLogsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ServerLogsComponent, deps: [{ token: i1__namespace$1.MatDialog }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    ServerLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ServerLogsComponent, selector: "fs-system-server-logs", inputs: { loadLogs: "loadLogs" }, viewQueries: [{ propertyName: "list", first: true, predicate: ["list"], descendants: true, static: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"config\">\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Message</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        <a href=\"javascript:;\" (click)=\"open(row)\">{{row.message}}</a>\r\n      </ng-template>\r\n    </fs-list-column>\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Type</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        {{row.type}}\r\n      </ng-template>\r\n    </fs-list-column>\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Date</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n      </ng-template>\r\n    </fs-list-column>\r\n  </fs-list>\r\n", styles: [""], components: [{ type: i3__namespace$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i4__namespace$2.FsDateAgoComponent, selector: "fs-date-ago", inputs: ["date", "showTime", "format", "showTooltip", "tooltipDateFormat"] }], directives: [{ type: i3__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i3__namespace$1.FsListHeaderDirective, selector: "[fs-list-header]", inputs: ["colspan", "align", "class"] }, { type: i3__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ServerLogsComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-system-server-logs',
+                        templateUrl: './server-logs.component.html',
+                        styleUrls: ['./server-logs.component.scss']
+                    }]
+            }], ctorParameters: function () { return [{ type: i1__namespace$1.MatDialog }]; }, propDecorators: { list: [{
+                    type: i0.ViewChild,
+                    args: ['list', { static: true }]
+                }], loadLogs: [{
+                    type: i0.Input
+                }] } });
 
     var UpgradeLogsComponent = /** @class */ (function () {
         function UpgradeLogsComponent() {
@@ -1250,23 +1327,23 @@
                 }
             };
         };
-        __decorate([
-            core.ViewChild(list.FsListComponent, { static: true }),
-            __metadata("design:type", list.FsListComponent)
-        ], UpgradeLogsComponent.prototype, "list", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], UpgradeLogsComponent.prototype, "loadUpgradeLogs", void 0);
-        UpgradeLogsComponent = __decorate([
-            core.Component({
-                selector: 'fs-system-upgrade-logs',
-                template: "<fs-list [config]=\"config\">\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Name</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{row.name}}\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Function</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{row.function}}()\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Date</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n    </ng-template>\r\n  </fs-list-column>\r\n</fs-list>\r\n",
-                styles: [""]
-            })
-        ], UpgradeLogsComponent);
         return UpgradeLogsComponent;
-    }());
+    }());
+    UpgradeLogsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: UpgradeLogsComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    UpgradeLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: UpgradeLogsComponent, selector: "fs-system-upgrade-logs", inputs: { loadUpgradeLogs: "loadUpgradeLogs" }, viewQueries: [{ propertyName: "list", first: true, predicate: i3$1.FsListComponent, descendants: true, static: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"config\">\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Name</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{row.name}}\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Function</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      {{row.function}}()\r\n    </ng-template>\r\n  </fs-list-column>\r\n\r\n  <fs-list-column>\r\n    <ng-template fs-list-header>Date</ng-template>\r\n    <ng-template fs-list-cell let-row=\"row\">\r\n      <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n    </ng-template>\r\n  </fs-list-column>\r\n</fs-list>\r\n", styles: [""], components: [{ type: i3__namespace$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i4__namespace$2.FsDateAgoComponent, selector: "fs-date-ago", inputs: ["date", "showTime", "format", "showTooltip", "tooltipDateFormat"] }], directives: [{ type: i3__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i3__namespace$1.FsListHeaderDirective, selector: "[fs-list-header]", inputs: ["colspan", "align", "class"] }, { type: i3__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: UpgradeLogsComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-system-upgrade-logs',
+                        templateUrl: './upgrade-logs.component.html',
+                        styleUrls: ['./upgrade-logs.component.scss']
+                    }]
+            }], propDecorators: { list: [{
+                    type: i0.ViewChild,
+                    args: [i3$1.FsListComponent, { static: true }]
+                }], loadUpgradeLogs: [{
+                    type: i0.Input
+                }] } });
 
     var ApiLogComponent = /** @class */ (function () {
         function ApiLogComponent(_dialogRef, data) {
@@ -1279,20 +1356,22 @@
                 this.apiLog = this.data.apiLog;
             }
         };
-        ApiLogComponent.ctorParameters = function () { return [
-            { type: dialog.MatDialogRef },
-            { type: undefined, decorators: [{ type: core.Inject, args: [dialog.MAT_DIALOG_DATA,] }] }
-        ]; };
-        ApiLogComponent = __decorate([
-            core.Component({
-                template: "<fs-dialog *fsSkeleton=\"apiLog\">\r\n  <div mat-dialog-title>API Log</div>\r\n  <mat-dialog-content>\r\n    <div fxLayout=\"column\">\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Type\r\n        </fs-label>\r\n        {{apiLog.type}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Status\r\n        </fs-label>\r\n        {{apiLogStates[apiLog.state]}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Date\r\n        </fs-label>\r\n        {{apiLog.createDate|fsDateFormat: 'full-date-time'}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.length\">\r\n        <fs-label>\r\n          Duration\r\n        </fs-label>\r\n        {{ apiLog.length | fsDateDuration }}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.code\">\r\n        <fs-label>\r\n          Code\r\n        </fs-label>\r\n        {{apiLog.code}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.message\">\r\n        <fs-label>\r\n          Message\r\n        </fs-label>\r\n        {{apiLog.message}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.url\">\r\n        <fs-label>\r\n          URL\r\n        </fs-label>\r\n        {{apiLog.url}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.request\">\r\n        <fs-label>\r\n          Request\r\n        </fs-label>\r\n        <pre>{{apiLog.request|json}}</pre>\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.response\">\r\n        <fs-label>\r\n          Response\r\n        </fs-label>\r\n        <pre>{{apiLog.response|json}}</pre>\r\n      </fs-label-field>\r\n\r\n    </div>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">Done</button>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n",
-                styles: [""]
-            }),
-            __param(1, core.Inject(dialog.MAT_DIALOG_DATA)),
-            __metadata("design:paramtypes", [dialog.MatDialogRef, Object])
-        ], ApiLogComponent);
         return ApiLogComponent;
-    }());
+    }());
+    ApiLogComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ApiLogComponent, deps: [{ token: i1__namespace$1.MatDialogRef }, { token: i1$1.MAT_DIALOG_DATA }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    ApiLogComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ApiLogComponent, selector: "ng-component", ngImport: i0__namespace, template: "<fs-dialog *fsSkeleton=\"apiLog\">\r\n  <div mat-dialog-title>API Log</div>\r\n  <mat-dialog-content>\r\n    <div fxLayout=\"column\">\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Type\r\n        </fs-label>\r\n        {{apiLog.type}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Status\r\n        </fs-label>\r\n        {{apiLogStates[apiLog.state]}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field>\r\n        <fs-label>\r\n          Date\r\n        </fs-label>\r\n        {{apiLog.createDate|fsDateFormat: 'full-date-time'}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.length\">\r\n        <fs-label>\r\n          Duration\r\n        </fs-label>\r\n        {{ apiLog.length | fsDateDuration }}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.code\">\r\n        <fs-label>\r\n          Code\r\n        </fs-label>\r\n        {{apiLog.code}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.message\">\r\n        <fs-label>\r\n          Message\r\n        </fs-label>\r\n        {{apiLog.message}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.url\">\r\n        <fs-label>\r\n          URL\r\n        </fs-label>\r\n        {{apiLog.url}}\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.request\">\r\n        <fs-label>\r\n          Request\r\n        </fs-label>\r\n        <pre>{{apiLog.request|json}}</pre>\r\n      </fs-label-field>\r\n\r\n      <fs-label-field *ngIf=\"apiLog.response\">\r\n        <fs-label>\r\n          Response\r\n        </fs-label>\r\n        <pre>{{apiLog.response|json}}</pre>\r\n      </fs-label-field>\r\n\r\n    </div>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">Done</button>\r\n  </mat-dialog-actions>\r\n</fs-dialog>\r\n", styles: [""], components: [{ type: i2__namespace$2.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i2__namespace$1.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i2__namespace$1.FsLabelComponent, selector: "fs-label" }, { type: i4__namespace.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i5__namespace.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { type: i1__namespace$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i6__namespace$1.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i9__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1__namespace$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "fsDateFormat": i4__namespace$2.FsDateFormatPipe, "fsDateDuration": i4__namespace$2.FsDateDurationPipe, "json": i9__namespace.JsonPipe } });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ApiLogComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        templateUrl: './api-log.component.html',
+                        styleUrls: ['./api-log.component.scss']
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i1__namespace$1.MatDialogRef }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i1$1.MAT_DIALOG_DATA]
+                        }] }];
+        } });
 
     var ApiLogsComponent = /** @class */ (function () {
         function ApiLogsComponent(_dialog) {
@@ -1337,27 +1416,23 @@
                 width: '85%'
             });
         };
-        ApiLogsComponent.ctorParameters = function () { return [
-            { type: dialog.MatDialog }
-        ]; };
-        __decorate([
-            core.ViewChild(list.FsListComponent, { static: true }),
-            __metadata("design:type", list.FsListComponent)
-        ], ApiLogsComponent.prototype, "list", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], ApiLogsComponent.prototype, "loadApiLogs", void 0);
-        ApiLogsComponent = __decorate([
-            core.Component({
-                selector: 'fs-system-api-logs',
-                template: "<fs-list [config]=\"config\">\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Name</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        <a href=\"javascript:;\" (click)=\"open(row)\">{{row.type || 'Unknown'}}</a>\r\n      </ng-template>\r\n    </fs-list-column>\r\n    <fs-list-column>\r\n        <ng-template fs-list-header>Message</ng-template>\r\n        <ng-template fs-list-cell let-row=\"row\">\r\n          {{row.message}}\r\n        </ng-template>\r\n      </fs-list-column>\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Status</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        {{apiLogStates[row.state]}}\r\n      </ng-template>\r\n    </fs-list-column>\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Date</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n        <div><small *ngIf=\"row.length\">Duration: {{ row.length | fsDateDuration }}</small></div>\r\n      </ng-template>\r\n    </fs-list-column>\r\n  </fs-list>\r\n",
-                styles: [""]
-            }),
-            __metadata("design:paramtypes", [dialog.MatDialog])
-        ], ApiLogsComponent);
         return ApiLogsComponent;
-    }());
+    }());
+    ApiLogsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ApiLogsComponent, deps: [{ token: i1__namespace$1.MatDialog }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    ApiLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ApiLogsComponent, selector: "fs-system-api-logs", inputs: { loadApiLogs: "loadApiLogs" }, viewQueries: [{ propertyName: "list", first: true, predicate: i3$1.FsListComponent, descendants: true, static: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"config\">\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Name</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        <a href=\"javascript:;\" (click)=\"open(row)\">{{row.type || 'Unknown'}}</a>\r\n      </ng-template>\r\n    </fs-list-column>\r\n    <fs-list-column>\r\n        <ng-template fs-list-header>Message</ng-template>\r\n        <ng-template fs-list-cell let-row=\"row\">\r\n          {{row.message}}\r\n        </ng-template>\r\n      </fs-list-column>\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Status</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        {{apiLogStates[row.state]}}\r\n      </ng-template>\r\n    </fs-list-column>\r\n    <fs-list-column>\r\n      <ng-template fs-list-header>Date</ng-template>\r\n      <ng-template fs-list-cell let-row=\"row\">\r\n        <fs-date-ago [date]=\"row.createDate\"></fs-date-ago>\r\n        <div><small *ngIf=\"row.length\">Duration: {{ row.length | fsDateDuration }}</small></div>\r\n      </ng-template>\r\n    </fs-list-column>\r\n  </fs-list>\r\n", styles: [""], components: [{ type: i3__namespace$1.FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i4__namespace$2.FsDateAgoComponent, selector: "fs-date-ago", inputs: ["date", "showTime", "format", "showTooltip", "tooltipDateFormat"] }], directives: [{ type: i3__namespace$1.FsListColumnDirective, selector: "fs-list-column", inputs: ["title", "name", "show", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i3__namespace$1.FsListHeaderDirective, selector: "[fs-list-header]", inputs: ["colspan", "align", "class"] }, { type: i3__namespace$1.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i9__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "fsDateDuration": i4__namespace$2.FsDateDurationPipe } });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ApiLogsComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-system-api-logs',
+                        templateUrl: './api-logs.component.html',
+                        styleUrls: ['./api-logs.component.scss']
+                    }]
+            }], ctorParameters: function () { return [{ type: i1__namespace$1.MatDialog }]; }, propDecorators: { list: [{
+                    type: i0.ViewChild,
+                    args: [i3$1.FsListComponent, { static: true }]
+                }], loadApiLogs: [{
+                    type: i0.Input
+                }] } });
 
     var InfoComponent = /** @class */ (function () {
         function InfoComponent() {
@@ -1378,119 +1453,191 @@
                 _this.iframe.nativeElement.style.height = scrollHeight + "px";
             });
         };
-        __decorate([
-            core.ViewChild('iframe'),
-            __metadata("design:type", core.ElementRef)
-        ], InfoComponent.prototype, "iframe", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], InfoComponent.prototype, "load", void 0);
-        InfoComponent = __decorate([
-            core.Component({
-                selector: 'fs-system-info',
-                template: "<iframe #iframe></iframe>\r\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: ["iframe{width:100%;border:0}"]
-            })
-        ], InfoComponent);
         return InfoComponent;
-    }());
+    }());
+    InfoComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: InfoComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    InfoComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: InfoComponent, selector: "fs-system-info", inputs: { load: "load" }, viewQueries: [{ propertyName: "iframe", first: true, predicate: ["iframe"], descendants: true }], ngImport: i0__namespace, template: "<iframe #iframe></iframe>\r\n", styles: ["iframe{width:100%;border:0}\n"], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: InfoComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-system-info',
+                        templateUrl: 'info.component.html',
+                        styleUrls: ['info.component.scss'],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], propDecorators: { iframe: [{
+                    type: i0.ViewChild,
+                    args: ['iframe']
+                }], load: [{
+                    type: i0.Input
+                }] } });
 
     var FsSystemModule = /** @class */ (function () {
         function FsSystemModule() {
         }
-        FsSystemModule_1 = FsSystemModule;
         FsSystemModule.forRoot = function (config) {
             return {
-                ngModule: FsSystemModule_1,
+                ngModule: FsSystemModule,
                 providers: [
                     { provide: FS_SYSTEM_CONFIG, useValue: config || {} },
                 ]
             };
         };
-        var FsSystemModule_1;
-        FsSystemModule = FsSystemModule_1 = __decorate([
-            core.NgModule({
-                imports: [
-                    common.CommonModule,
-                    flexLayout.FlexLayoutModule,
-                    forms.FormsModule,
-                    button.MatButtonModule,
-                    expansion.MatExpansionModule,
-                    tooltip.MatTooltipModule,
-                    icon.MatIconModule,
-                    formField.MatFormFieldModule,
-                    input.MatInputModule,
-                    select.MatSelectModule,
-                    dialog.MatDialogModule,
-                    tabs.MatTabsModule,
-                    date.FsDateModule,
-                    skeleton.FsSkeletonModule,
-                    list.FsListModule,
-                    file.FsFileModule,
-                    fileManager.FsFileManagerModule,
-                    label.FsLabelModule,
-                    dialog$1.FsDialogModule,
-                    datepicker.FsDatePickerModule,
-                    menu.FsMenuModule,
-                    ngxClipboard.ClipboardModule,
-                ],
-                exports: [
-                    DashboardComponent,
-                    CronsComponent,
-                    SettingsComponent,
-                    FileManagerComponent,
-                    ProcessesComponent,
-                    ServerLogsComponent,
-                    UpgradeLogsComponent,
-                    ApiLogsComponent,
-                    InfoComponent,
-                ],
-                declarations: [
-                    DashboardComponent,
-                    CronsComponent,
-                    SettingsComponent,
-                    KeyNameValuePipe,
-                    FileManagerComponent,
-                    ProcessesComponent,
-                    ServerLogComponent,
-                    ServerLogsComponent,
-                    UpgradeLogsComponent,
-                    ApiLogsComponent,
-                    ApiLogComponent,
-                    InfoComponent,
-                    ProcessComponent,
-                    CronComponent,
-                    CronLogComponent,
-                ],
-            })
-        ], FsSystemModule);
         return FsSystemModule;
-    }());
+    }());
+    FsSystemModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsSystemModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    FsSystemModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsSystemModule, declarations: [DashboardComponent,
+            CronsComponent,
+            SettingsComponent,
+            KeyNameValuePipe,
+            FileManagerComponent,
+            ProcessesComponent,
+            ServerLogComponent,
+            ServerLogsComponent,
+            UpgradeLogsComponent,
+            ApiLogsComponent,
+            ApiLogComponent,
+            InfoComponent,
+            ProcessComponent,
+            CronComponent,
+            CronLogComponent], imports: [i9.CommonModule,
+            flexLayout.FlexLayoutModule,
+            i15.FormsModule,
+            i4.MatButtonModule,
+            i4$3.MatExpansionModule,
+            i11.MatTooltipModule,
+            i6.MatIconModule,
+            i7.MatFormFieldModule,
+            i14.MatInputModule,
+            i8.MatSelectModule,
+            i1$1.MatDialogModule,
+            i3.MatTabsModule,
+            i4$2.FsDateModule,
+            i5.FsSkeletonModule,
+            i3$1.FsListModule,
+            i11$1.FsFileModule,
+            i1$2.FsFileManagerModule,
+            i2$1.FsLabelModule,
+            i2$2.FsDialogModule,
+            i10$1.FsDatePickerModule,
+            i4$1.FsMenuModule,
+            i2$3.ClipboardModule], exports: [DashboardComponent,
+            CronsComponent,
+            SettingsComponent,
+            FileManagerComponent,
+            ProcessesComponent,
+            ServerLogsComponent,
+            UpgradeLogsComponent,
+            ApiLogsComponent,
+            InfoComponent] });
+    FsSystemModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsSystemModule, imports: [[
+                i9.CommonModule,
+                flexLayout.FlexLayoutModule,
+                i15.FormsModule,
+                i4.MatButtonModule,
+                i4$3.MatExpansionModule,
+                i11.MatTooltipModule,
+                i6.MatIconModule,
+                i7.MatFormFieldModule,
+                i14.MatInputModule,
+                i8.MatSelectModule,
+                i1$1.MatDialogModule,
+                i3.MatTabsModule,
+                i4$2.FsDateModule,
+                i5.FsSkeletonModule,
+                i3$1.FsListModule,
+                i11$1.FsFileModule,
+                i1$2.FsFileManagerModule,
+                i2$1.FsLabelModule,
+                i2$2.FsDialogModule,
+                i10$1.FsDatePickerModule,
+                i4$1.FsMenuModule,
+                i2$3.ClipboardModule,
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsSystemModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [
+                            i9.CommonModule,
+                            flexLayout.FlexLayoutModule,
+                            i15.FormsModule,
+                            i4.MatButtonModule,
+                            i4$3.MatExpansionModule,
+                            i11.MatTooltipModule,
+                            i6.MatIconModule,
+                            i7.MatFormFieldModule,
+                            i14.MatInputModule,
+                            i8.MatSelectModule,
+                            i1$1.MatDialogModule,
+                            i3.MatTabsModule,
+                            i4$2.FsDateModule,
+                            i5.FsSkeletonModule,
+                            i3$1.FsListModule,
+                            i11$1.FsFileModule,
+                            i1$2.FsFileManagerModule,
+                            i2$1.FsLabelModule,
+                            i2$2.FsDialogModule,
+                            i10$1.FsDatePickerModule,
+                            i4$1.FsMenuModule,
+                            i2$3.ClipboardModule,
+                        ],
+                        exports: [
+                            DashboardComponent,
+                            CronsComponent,
+                            SettingsComponent,
+                            FileManagerComponent,
+                            ProcessesComponent,
+                            ServerLogsComponent,
+                            UpgradeLogsComponent,
+                            ApiLogsComponent,
+                            InfoComponent,
+                        ],
+                        declarations: [
+                            DashboardComponent,
+                            CronsComponent,
+                            SettingsComponent,
+                            KeyNameValuePipe,
+                            FileManagerComponent,
+                            ProcessesComponent,
+                            ServerLogComponent,
+                            ServerLogsComponent,
+                            UpgradeLogsComponent,
+                            ApiLogsComponent,
+                            ApiLogComponent,
+                            InfoComponent,
+                            ProcessComponent,
+                            CronComponent,
+                            CronLogComponent,
+                        ],
+                    }]
+            }] });
+
+    /**
+     * Generated bundle index. Do not edit.
+     */
 
+    exports.ApiLogComponent = ApiLogComponent;
     exports.ApiLogStates = ApiLogStates;
+    exports.ApiLogsComponent = ApiLogsComponent;
+    exports.CronComponent = CronComponent;
+    exports.CronLogComponent = CronLogComponent;
     exports.CronStates = CronStates;
+    exports.CronsComponent = CronsComponent;
+    exports.DashboardComponent = DashboardComponent;
     exports.FS_SYSTEM_CONFIG = FS_SYSTEM_CONFIG;
+    exports.FileManagerComponent = FileManagerComponent;
     exports.FsSystemModule = FsSystemModule;
+    exports.InfoComponent = InfoComponent;
+    exports.KeyNameValuePipe = KeyNameValuePipe;
+    exports.ProcessComponent = ProcessComponent;
     exports.ProcessStates = ProcessStates;
-    exports.ɵa = DashboardComponent;
-    exports.ɵb = CronsComponent;
-    exports.ɵc = SettingsComponent;
-    exports.ɵd = FileManagerComponent;
-    exports.ɵe = ProcessesComponent;
-    exports.ɵf = ServerLogsComponent;
-    exports.ɵg = UpgradeLogsComponent;
-    exports.ɵh = ApiLogsComponent;
-    exports.ɵi = InfoComponent;
-    exports.ɵj = KeyNameValuePipe;
-    exports.ɵk = ServerLogComponent;
-    exports.ɵl = ApiLogComponent;
-    exports.ɵm = ProcessComponent;
-    exports.ɵn = CronComponent;
-    exports.ɵo = CronLogComponent;
+    exports.ProcessesComponent = ProcessesComponent;
+    exports.ServerLogComponent = ServerLogComponent;
+    exports.ServerLogsComponent = ServerLogsComponent;
+    exports.SettingsComponent = SettingsComponent;
+    exports.UpgradeLogsComponent = UpgradeLogsComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });
 
-})));
+}));
 //# sourceMappingURL=firestitch-system.umd.js.map