@firestitch/app-acl 9.0.19 → 12.0.0

package/bundles/firestitch-app-acl.umd.js

@@ -1,221 +1,368 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/flex-layout'), require('@angular/material/input'), require('@angular/material/radio'), require('@angular/material/button'), require('@angular/material/select'), require('@angular/material/checkbox'), require('@angular/material/dialog'), require('@angular/core'), require('@angular/common'), require('@firestitch/list'), require('@firestitch/popover'), require('@firestitch/dialog'), require('@firestitch/form'), require('@firestitch/label'), require('@firestitch/radiogroup'), require('@firestitch/badge'), require('@firestitch/checkboxgroup'), require('rxjs/operators'), require('@firestitch/filter'), require('@firestitch/common'), require('rxjs'), require('@firestitch/message'), require('lodash-es'), require('snakecase-keys'), require('camelcase-keys'), require('@firestitch/prompt'), require('@angular/forms'), require('@angular/material/form-field')) :
-    typeof define === 'function' && define.amd ? define('@firestitch/app-acl', ['exports', '@angular/flex-layout', '@angular/material/input', '@angular/material/radio', '@angular/material/button', '@angular/material/select', '@angular/material/checkbox', '@angular/material/dialog', '@angular/core', '@angular/common', '@firestitch/list', '@firestitch/popover', '@firestitch/dialog', '@firestitch/form', '@firestitch/label', '@firestitch/radiogroup', '@firestitch/badge', '@firestitch/checkboxgroup', 'rxjs/operators', '@firestitch/filter', '@firestitch/common', 'rxjs', '@firestitch/message', 'lodash-es', 'snakecase-keys', 'camelcase-keys', '@firestitch/prompt', '@angular/forms', '@angular/material/form-field'], factory) :
-    (global = global || self, factory((global.firestitch = global.firestitch || {}, global.firestitch['app-acl'] = {}), global.ng.flexLayout, global.ng.material.input, global.ng.material.radio, global.ng.material.button, global.ng.material.select, global.ng.material.checkbox, global.ng.material.dialog, global.ng.core, global.ng.common, global.list, global.popover, global.dialog$1, global.form, global.label, global.radiogroup, global.badge, global.checkboxgroup, global.rxjs.operators, global.filter, global.common$1, global.rxjs, global.message, global.lodashEs, global._snakecaseKeys, global._camelcaseKeys, global.prompt, global.ng.forms, global.ng.material.formField));
-}(this, (function (exports, flexLayout, input, radio, button, select, checkbox, dialog, core, common, list, popover, dialog$1, form, label, radiogroup, badge, checkboxgroup, operators, filter, common$1, rxjs, message, lodashEs, _snakecaseKeys, _camelcaseKeys, prompt, forms, formField) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/flex-layout'), require('@angular/material/input'), require('@angular/material/radio'), require('@angular/material/button'), require('@angular/material/select'), require('@angular/material/checkbox'), require('@angular/material/dialog'), require('@angular/core'), require('@angular/common'), require('@firestitch/list'), require('@firestitch/popover'), require('@firestitch/dialog'), require('@firestitch/form'), require('@firestitch/label'), require('@firestitch/radiogroup'), require('@firestitch/badge'), require('@firestitch/checkboxgroup'), require('rxjs/operators'), require('@firestitch/filter'), require('@firestitch/common'), require('rxjs'), require('lodash-es'), require('snakecase-keys'), require('camelcase-keys'), require('@firestitch/message'), require('@angular/material/form-field'), require('@angular/material/core'), require('@angular/forms'), require('@angular/flex-layout/flex'), require('@firestitch/prompt')) :
+    typeof define === 'function' && define.amd ? define('@firestitch/app-acl', ['exports', '@angular/flex-layout', '@angular/material/input', '@angular/material/radio', '@angular/material/button', '@angular/material/select', '@angular/material/checkbox', '@angular/material/dialog', '@angular/core', '@angular/common', '@firestitch/list', '@firestitch/popover', '@firestitch/dialog', '@firestitch/form', '@firestitch/label', '@firestitch/radiogroup', '@firestitch/badge', '@firestitch/checkboxgroup', 'rxjs/operators', '@firestitch/filter', '@firestitch/common', 'rxjs', 'lodash-es', 'snakecase-keys', 'camelcase-keys', '@firestitch/message', '@angular/material/form-field', '@angular/material/core', '@angular/forms', '@angular/flex-layout/flex', '@firestitch/prompt'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.firestitch = global.firestitch || {}, global.firestitch["app-acl"] = {}), global.ng.flexLayout, global.ng.material.input, global.ng.material.radio, global.ng.material.button, global.ng.material.select, global.ng.material.checkbox, global.ng.material.dialog, global.ng.core, global.ng.common, global.i12, global.i2$1, global.i4, global.i15, global.i6, global.i7, global.i5$1, global.i1, global.rxjs.operators, global.filter, global.common, global.rxjs, global.lodashEs, global._snakecaseKeys, global._camelcaseKeys, global.i3, global.ng.material.formField, global.ng.material.core, global.ng.forms, global.ng.flexLayout.flex, global.i3$1));
+})(this, (function (exports, flexLayout, i18, i8, i13, i10, i9, i2, i0, i7$1, i12, i2$1, i4, i15, i6, i7, i5$1, i1, operators, filter, common, rxjs, lodashEs, _snakecaseKeys, _camelcaseKeys, i3, i5, i11, i14, i17, i3$1) { 'use strict';
 
-    /*! *****************************************************************************
-    Copyright (c) Microsoft Corporation. All rights reserved.
-    Licensed under the Apache License, Version 2.0 (the "License"); you may not use
-    this file except in compliance with the License. You may obtain a copy of the
-    License at http://www.apache.org/licenses/LICENSE-2.0
-
-    THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-    KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
-    WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
-    MERCHANTABLITY OR NON-INFRINGEMENT.
-
-    See the Apache Version 2.0 License for specific language governing permissions
-    and limitations under the License.
-    ***************************************************************************** */
-    /* global Reflect, Promise */
-
-    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]; };
-        return extendStatics(d, b);
-    };
-
-    function __extends(d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    }
-
-    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];
-            }
-            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];
-        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]))
-                    t[p[i]] = s[p[i]];
-            }
-        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;
-        return c > 3 && r && Object.defineProperty(target, key, r), r;
-    }
-
-    function __param(paramIndex, decorator) {
-        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);
-    }
-
-    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 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;
-        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;
-                }
-                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 };
-        }
-    }
-
-    function __exportStar(m, exports) {
-        for (var p in m) if (!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 };
-            }
-        };
-        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;
-        var i = m.call(o), r, ar = [], e;
-        try {
-            while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-        }
-        catch (error) { e = { error: error }; }
-        finally {
-            try {
-                if (r && !r.done && (m = i["return"])) m.call(i);
-            }
-            finally { if (e) throw e.error; }
-        }
-        return ar;
-    }
-
-    function __spread() {
-        for (var ar = [], i = 0; i < arguments.length; i++)
-            ar = ar.concat(__read(arguments[i]));
-        return ar;
-    }
-
-    function __spreadArrays() {
-        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 __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.");
-        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 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 __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.");
-        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 __makeTemplateObject(cooked, raw) {
-        if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-        return cooked;
-    };
-
-    function __importStar(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;
-        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 __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 _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 i18__namespace = /*#__PURE__*/_interopNamespace(i18);
+    var i8__namespace = /*#__PURE__*/_interopNamespace(i8);
+    var i13__namespace = /*#__PURE__*/_interopNamespace(i13);
+    var i10__namespace = /*#__PURE__*/_interopNamespace(i10);
+    var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
+    var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
+    var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
+    var i7__namespace$1 = /*#__PURE__*/_interopNamespace(i7$1);
+    var i12__namespace = /*#__PURE__*/_interopNamespace(i12);
+    var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$1);
+    var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
+    var i15__namespace = /*#__PURE__*/_interopNamespace(i15);
+    var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
+    var i7__namespace = /*#__PURE__*/_interopNamespace(i7);
+    var i5__namespace$1 = /*#__PURE__*/_interopNamespace(i5$1);
+    var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
+    var _snakecaseKeys__namespace = /*#__PURE__*/_interopNamespace(_snakecaseKeys);
+    var _camelcaseKeys__namespace = /*#__PURE__*/_interopNamespace(_camelcaseKeys);
+    var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
+    var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
+    var i11__namespace = /*#__PURE__*/_interopNamespace(i11);
+    var i14__namespace = /*#__PURE__*/_interopNamespace(i14);
+    var i17__namespace = /*#__PURE__*/_interopNamespace(i17);
+    var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
+
+    /*! *****************************************************************************
+    Copyright (c) Microsoft Corporation.
+
+    Permission to use, copy, modify, and/or distribute this software for any
+    purpose with or without fee is hereby granted.
+
+    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+    PERFORMANCE OF THIS SOFTWARE.
+    ***************************************************************************** */
+    /* global Reflect, Promise */
+    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 (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 () {
+        __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];
+            }
+            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];
+        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]))
+                    t[p[i]] = s[p[i]];
+            }
+        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;
+        return c > 3 && r && Object.defineProperty(target, key, r), r;
+    }
+    function __param(paramIndex, decorator) {
+        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);
+    }
+    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 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;
+        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;
+                    }
+                    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 };
+        }
+    }
+    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 __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 };
+                }
+            };
+        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;
+        var i = m.call(o), r, ar = [], e;
+        try {
+            while ((n === void 0 || n-- > 0) && !(r = i.next()).done)
+                ar.push(r.value);
+        }
+        catch (error) {
+            e = { error: error };
+        }
+        finally {
+            try {
+                if (r && !r.done && (m = i["return"]))
+                    m.call(i);
+            }
+            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 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.");
+        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 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 __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.");
+        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 __makeTemplateObject(cooked, 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;
+        var result = {};
+        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, 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, 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 AclRoleAccess;
@@ -226,9 +373,6 @@
         AclRoleAccess[AclRoleAccess["Full"] = 15] = "Full";
     })(AclRoleAccess || (AclRoleAccess = {}));
 
-    // start:ng42.barrel
-    // end:ng42.barrel
-
     var AclRoleAccesses = [
         { name: 'None', value: AclRoleAccess.None },
         { name: 'Read', value: AclRoleAccess.Read },
@@ -236,10 +380,10 @@
         { name: 'Full', value: AclRoleAccess.Full }
     ];
 
-    var FS_APP_ACL_CONFIG = new core.InjectionToken('fs-app-acl-config');
+    var FS_APP_ACL_CONFIG = new i0.InjectionToken('fs-app-acl-config');
 
-    var snakecaseKeys = _snakecaseKeys;
-    var camelcaseKeys = _camelcaseKeys;
+    var snakecaseKeys = _snakecaseKeys__namespace;
+    var camelcaseKeys = _camelcaseKeys__namespace;
     var FsAppAclService = /** @class */ (function () {
         function FsAppAclService(_appAclConfig) {
             this._appAclConfig = _appAclConfig;
@@ -273,7 +417,7 @@
         FsAppAclService.prototype.getIndexedLevels = function () {
             return this.getLevels()
                 .pipe(operators.map(function (data) {
-                return common$1.list(data, 'name', 'value');
+                return common.list(data, 'name', 'value');
             }));
         };
         FsAppAclService.prototype.input = function (data) {
@@ -298,19 +442,21 @@
                 return this._appAclConfig.case === 'snake' ? snakecaseKeys(data, { deep: true }) : data;
             }
         };
-        FsAppAclService.ctorParameters = function () { return [
-            { type: undefined, decorators: [{ type: core.Inject, args: [FS_APP_ACL_CONFIG,] }] }
-        ]; };
-        FsAppAclService.ɵprov = core["ɵɵdefineInjectable"]({ factory: function FsAppAclService_Factory() { return new FsAppAclService(core["ɵɵinject"](FS_APP_ACL_CONFIG)); }, token: FsAppAclService, providedIn: "root" });
-        FsAppAclService = __decorate([
-            core.Injectable({
-                providedIn: 'root',
-            }),
-            __param(0, core.Inject(FS_APP_ACL_CONFIG)),
-            __metadata("design:paramtypes", [Object])
-        ], FsAppAclService);
         return FsAppAclService;
     }());
+    FsAppAclService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAppAclService, deps: [{ token: FS_APP_ACL_CONFIG }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    FsAppAclService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAppAclService, providedIn: 'root' });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAppAclService, decorators: [{
+                type: i0.Injectable,
+                args: [{
+                        providedIn: 'root',
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [FS_APP_ACL_CONFIG]
+                        }] }];
+        } });
 
     var FsAclRoleComponent = /** @class */ (function () {
         function FsAclRoleComponent(_appAclService, _dialogRef, _message, _data, _cdRef) {
@@ -333,7 +479,7 @@
             this.levelAclRoleConfigs = [];
             this._destroy$ = new rxjs.Subject();
             this.save = function () {
-                var aclRole = __assign(__assign({}, _this.aclRole), { permissions: _this.levelPermissions.map(function (permission) {
+                var aclRole = Object.assign(Object.assign({}, _this.aclRole), { permissions: _this.levelPermissions.map(function (permission) {
                         return {
                             value: permission.value,
                             access: _this.aclRole.permissions[permission.value] || 0,
@@ -360,9 +506,9 @@
                 var _b = __read(_a, 2), aclRole = _b[0], aclPermissions = _b[1];
                 _this.permissions = aclPermissions;
                 _this.aclLevels = _this._data.aclLevels;
-                _this.indexedAclLevels = common$1.list(_this.aclLevels, 'name', 'value');
-                _this.indexedAccesses = common$1.list(AclRoleAccesses, 'name', 'value');
-                _this.aclRole = __assign({
+                _this.indexedAclLevels = common.list(_this.aclLevels, 'name', 'value');
+                _this.indexedAccesses = common.list(AclRoleAccesses, 'name', 'value');
+                _this.aclRole = Object.assign({
                     aclPermissions: [],
                     allPermissions: true,
                     aclRoleConfigs: [],
@@ -474,33 +620,59 @@
         FsAclRoleComponent.prototype._applyMaxPermissionAccess = function () {
             var _this = this;
             this.permissions.forEach(function (permission) {
-                _this.aclRole.permissions[permission.value] = Math.max.apply(Math, __spread(permission.accesses));
+                _this.aclRole.permissions[permission.value] = Math.max.apply(Math, __spreadArray([], __read(permission.accesses)));
             });
         };
-        FsAclRoleComponent.ctorParameters = function () { return [
-            { type: FsAppAclService },
-            { type: dialog.MatDialogRef },
-            { type: message.FsMessage },
-            { type: undefined, decorators: [{ type: core.Inject, args: [dialog.MAT_DIALOG_DATA,] }] },
-            { type: core.ChangeDetectorRef }
-        ]; };
-        __decorate([
-            core.ViewChild(list.FsListComponent),
-            __metadata("design:type", list.FsListComponent)
-        ], FsAclRoleComponent.prototype, "list", void 0);
-        FsAclRoleComponent = __decorate([
-            core.Component({
-                template: "<form fsForm [submit]=\"save\">\n  <fs-dialog>\n    <ng-container *ngIf=\"aclRole\">\n      <div mat-dialog-title>{{ aclRole.id ? 'Edit' : 'Create' }} Role</div>\n      <mat-dialog-content>\n        <div fxLayout=\"row\" fxLayout.lt-md=\"column\" fxLayoutGap=\"40px\" fxLayoutGap.lt-md=\"0\">\n          <div fxLayout=\"column\" fxFlex fxFlex.lt-md=\"0\">\n            <mat-form-field>\n              <input matInput placeholder=\"Name\" [(ngModel)]=\"aclRole.name\" name=\"name\" fsFormRequired>\n            </mat-form-field>\n\n            <fs-label-field *ngIf=\"aclRole.id || aclLevels.length === 1; else levels\">\n              <fs-label>Level</fs-label>\n              {{indexedAclLevels[aclRole.level]}}\n            </fs-label-field>\n\n            <ng-template #levels>\n              <div class=\"level\">\n                <fs-radio-group\n                  [(ngModel)]=\"aclRole.level\"\n                  (ngModelChange)=\"levelChange()\"\n                  fsFormRequired\n                  label=\"Level\"\n                  orientation=\"vertical\"\n                  name=\"level\">\n                  <mat-radio-button\n                    *ngFor=\"let item of aclLevels\"\n                    [value]=\"item.value\"\n                    [disabled]=\"!!aclRole.protected\">\n                      {{ item.name }}\n                  </mat-radio-button>\n                </fs-radio-group>\n              </div>\n            </ng-template>\n\n            <fs-label-field *ngIf=\"levelPermissions.length\">\n              <fs-label>All Permissions</fs-label>\n              <mat-checkbox\n                [(ngModel)]=\"aclRole.allPermissions\"\n                (ngModelChange)=\"allPermissionsChange($event)\"\n                [disabled]=\"!!aclRole.protected\"\n                name=\"allPermissions\">\n              </mat-checkbox>\n            </fs-label-field>\n\n            <div fxLayout=\"column\" *ngFor=\"let config of levelAclRoleConfigs\">\n              <fs-label-field *ngIf=\"config.interface === 'checkbox'\">\n                <fs-label>{{config.name}}</fs-label>\n                <mat-checkbox\n                  [(ngModel)]=\"config.data\"\n                  [name]=\"config.name\">\n                </mat-checkbox>\n                <fs-label-message>\n                  <mat-hint>{{config.description}}</mat-hint>\n                </fs-label-message>\n              </fs-label-field>\n\n              <mat-form-field *ngIf=\"config.interface === 'select'\">\n                <mat-select\n                  [(ngModel)]=\"config.data\"\n                  [name]=\"config.value\"\n                  [required]=\"config.required\"\n                  [placeholder]=\"config.name\">\n                    <mat-option\n                      *ngFor=\"let item of config.values\"\n                      [value]=\"item.value\">\n                        {{ item.name }}\n                    </mat-option>\n                </mat-select>\n                <mat-hint>{{config.description}}</mat-hint>\n              </mat-form-field>\n            </div>\n          </div>\n\n          <div fxLayout=\"column\" fxFlex=\"65\" fxFlex.lt-md=\"0\" *ngIf=\"aclRole.level\" [hidden]=\"!levelPermissions.length\" class=\"permissions\">\n\n            <fs-list [config]=\"listConfig\">\n              <fs-list-column title=\"Permissions\">\n                <ng-template colspan=\"2\" fs-list-group-cell let-row=\"row\" class=\"permission-group\">\n                  <small><b>{{row.category || 'General'}}</b></small>\n                </ng-template>\n                <ng-template fs-list-cell let-row=\"row\">\n                  <div class=\"permission\">{{ row.name }}</div>\n                  <div class=\"description small\">{{ row.description }}</div>\n                </ng-template>\n              </fs-list-column>\n              <fs-list-column title=\"Access\" width=\"1%\" class=\"access\">\n                <ng-template fs-list-cell let-row=\"permission\" let-permission=\"row\">\n                  <span *ngIf=\"aclRole.allPermissions; else elseAll\">\n                    {{ indexedAccesses[aclRole.permissions[permission.value]] }}\n                  </span>\n                  <ng-template #elseAll>\n                    <mat-form-field>\n                      <mat-select\n                        [(ngModel)]=\"aclRole.permissions[permission.value]\"\n                        [disabled]=\"!!aclRole.protected\"\n                        fsFormRequired\n                        name=\"access-{{ permission.value }}\">\n                        <ng-container *ngFor=\"let access of AclRoleAccesses\">\n                          <mat-option\n                            *ngIf=\"access.value === 0 || permission.accesses.indexOf(access.value) !== -1\"\n                            [value]=\"access.value\">\n                              {{ access.name }}\n                          </mat-option>\n                        </ng-container>\n                      </mat-select>\n                    </mat-form-field>\n                  </ng-template>\n                </ng-template>\n              </fs-list-column>\n            </fs-list>\n          </div>\n        </div>\n      </mat-dialog-content>\n      <mat-dialog-actions>\n        <button mat-button type=\"submit\" color=\"primary\">{{ aclRole.id ? 'Save' : 'Create' }}</button>\n        <button mat-button [mat-dialog-close]=\"null\" type=\"button\">Cancel</button>\n      </mat-dialog-actions>\n    </ng-container>\n  </fs-dialog>\n</form>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host .permissions ::ng-deep .fs-list-row-group{background-color:#f6f6f6}:host .permissions ::ng-deep fs-list .access{white-space:nowrap}:host .permissions ::ng-deep .mat-form-field{width:100px}:host .permissions ::ng-deep .mat-form-field .mat-form-field-wrapper{padding-bottom:0}:host .permissions ::ng-deep .mat-form-field .mat-form-field-infix{border-top:0}:host .permissions ::ng-deep .mat-form-field .mat-form-field-underline{bottom:0}:host ::ng-deep fs-radio-group{width:100%}:host ::ng-deep fs-label-field{width:100%}:host .level{width:100%}"]
-            }),
-            __param(3, core.Inject(dialog.MAT_DIALOG_DATA)),
-            __metadata("design:paramtypes", [FsAppAclService,
-                dialog.MatDialogRef,
-                message.FsMessage, Object, core.ChangeDetectorRef])
-        ], FsAclRoleComponent);
         return FsAclRoleComponent;
     }());
+    FsAclRoleComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclRoleComponent, deps: [{ token: FsAppAclService }, { token: i2__namespace.MatDialogRef }, { token: i3__namespace.FsMessage }, { token: i2.MAT_DIALOG_DATA }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsAclRoleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsAclRoleComponent, selector: "ng-component", viewQueries: [{ propertyName: "list", first: true, predicate: i12.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\">\n  <fs-dialog>\n    <ng-container *ngIf=\"aclRole\">\n      <div mat-dialog-title>{{ aclRole.id ? 'Edit' : 'Create' }} Role</div>\n      <mat-dialog-content>\n        <div fxLayout=\"row\" fxLayout.lt-md=\"column\" fxLayoutGap=\"40px\" fxLayoutGap.lt-md=\"0\">\n          <div fxLayout=\"column\" fxFlex fxFlex.lt-md=\"0\">\n            <mat-form-field>\n              <input matInput placeholder=\"Name\" [(ngModel)]=\"aclRole.name\" name=\"name\" fsFormRequired>\n            </mat-form-field>\n\n            <fs-label-field *ngIf=\"aclRole.id || aclLevels.length === 1; else levels\">\n              <fs-label>Level</fs-label>\n              {{indexedAclLevels[aclRole.level]}}\n            </fs-label-field>\n\n            <ng-template #levels>\n              <div class=\"level\">\n                <fs-radio-group\n                  [(ngModel)]=\"aclRole.level\"\n                  (ngModelChange)=\"levelChange()\"\n                  fsFormRequired\n                  label=\"Level\"\n                  orientation=\"vertical\"\n                  name=\"level\">\n                  <mat-radio-button\n                    *ngFor=\"let item of aclLevels\"\n                    [value]=\"item.value\"\n                    [disabled]=\"!!aclRole.protected\">\n                      {{ item.name }}\n                  </mat-radio-button>\n                </fs-radio-group>\n              </div>\n            </ng-template>\n\n            <fs-label-field *ngIf=\"levelPermissions.length\">\n              <fs-label>All Permissions</fs-label>\n              <mat-checkbox\n                [(ngModel)]=\"aclRole.allPermissions\"\n                (ngModelChange)=\"allPermissionsChange($event)\"\n                [disabled]=\"!!aclRole.protected\"\n                name=\"allPermissions\">\n              </mat-checkbox>\n            </fs-label-field>\n\n            <div fxLayout=\"column\" *ngFor=\"let config of levelAclRoleConfigs\">\n              <fs-label-field *ngIf=\"config.interface === 'checkbox'\">\n                <fs-label>{{config.name}}</fs-label>\n                <mat-checkbox\n                  [(ngModel)]=\"config.data\"\n                  [name]=\"config.name\">\n                </mat-checkbox>\n                <fs-label-message>\n                  <mat-hint>{{config.description}}</mat-hint>\n                </fs-label-message>\n              </fs-label-field>\n\n              <mat-form-field *ngIf=\"config.interface === 'select'\">\n                <mat-select\n                  [(ngModel)]=\"config.data\"\n                  [name]=\"config.value\"\n                  [required]=\"config.required\"\n                  [placeholder]=\"config.name\">\n                    <mat-option\n                      *ngFor=\"let item of config.values\"\n                      [value]=\"item.value\">\n                        {{ item.name }}\n                    </mat-option>\n                </mat-select>\n                <mat-hint>{{config.description}}</mat-hint>\n              </mat-form-field>\n            </div>\n          </div>\n\n          <div fxLayout=\"column\" fxFlex=\"65\" fxFlex.lt-md=\"0\" *ngIf=\"aclRole.level\" [hidden]=\"!levelPermissions.length\" class=\"permissions\">\n\n            <fs-list [config]=\"listConfig\">\n              <fs-list-column title=\"Permissions\">\n                <ng-template colspan=\"2\" fs-list-group-cell let-row=\"row\" class=\"permission-group\">\n                  <small><b>{{row.category || 'General'}}</b></small>\n                </ng-template>\n                <ng-template fs-list-cell let-row=\"row\">\n                  <div class=\"permission\">{{ row.name }}</div>\n                  <div class=\"description small\">{{ row.description }}</div>\n                </ng-template>\n              </fs-list-column>\n              <fs-list-column title=\"Access\" width=\"1%\" class=\"access\">\n                <ng-template fs-list-cell let-row=\"permission\" let-permission=\"row\">\n                  <span *ngIf=\"aclRole.allPermissions; else elseAll\">\n                    {{ indexedAccesses[aclRole.permissions[permission.value]] }}\n                  </span>\n                  <ng-template #elseAll>\n                    <mat-form-field>\n                      <mat-select\n                        [(ngModel)]=\"aclRole.permissions[permission.value]\"\n                        [disabled]=\"!!aclRole.protected\"\n                        fsFormRequired\n                        name=\"access-{{ permission.value }}\">\n                        <ng-container *ngFor=\"let access of AclRoleAccesses\">\n                          <mat-option\n                            *ngIf=\"access.value === 0 || permission.accesses.indexOf(access.value) !== -1\"\n                            [value]=\"access.value\">\n                              {{ access.name }}\n                          </mat-option>\n                        </ng-container>\n                      </mat-select>\n                    </mat-form-field>\n                  </ng-template>\n                </ng-template>\n              </fs-list-column>\n            </fs-list>\n          </div>\n        </div>\n      </mat-dialog-content>\n      <mat-dialog-actions>\n        <button mat-button type=\"submit\" color=\"primary\">{{ aclRole.id ? 'Save' : 'Create' }}</button>\n        <button mat-button [mat-dialog-close]=\"null\" type=\"button\">Cancel</button>\n      </mat-dialog-actions>\n    </ng-container>\n  </fs-dialog>\n</form>\n", styles: [":host .permissions ::ng-deep .fs-list-row-group{background-color:#f6f6f6}:host .permissions ::ng-deep fs-list .access{white-space:nowrap}:host .permissions ::ng-deep .mat-form-field{width:100px}:host .permissions ::ng-deep .mat-form-field .mat-form-field-wrapper{padding-bottom:0}:host .permissions ::ng-deep .mat-form-field .mat-form-field-infix{border-top:0}:host .permissions ::ng-deep .mat-form-field .mat-form-field-underline{bottom:0}:host ::ng-deep fs-radio-group{width:100%}:host ::ng-deep fs-label-field{width:100%}:host .level{width:100%}\n"], components: [{ type: i4__namespace.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i5__namespace.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i6__namespace.ɵb, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i6__namespace.ɵa, selector: "fs-label" }, { type: i7__namespace.FsRadioGroupComponent, selector: "fs-radio-group", inputs: ["orientation", "radioPosition", "compareWith", "required", "disabled", "label", "name"] }, { type: i8__namespace.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { type: i9__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i6__namespace.ɵc, selector: "fs-label-message" }, { type: i10__namespace.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i11__namespace.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i12__namespace.FsListComponent, selector: "fs-list", inputs: ["loaderLines", "config"], outputs: ["filtersReady"] }, { type: i13__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: i14__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i15__namespace.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "successDelay", "errorDelay", "submit", "tabGroup"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"] }, { type: i7__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i2__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i17__namespace.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: i17__namespace.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: i17__namespace.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i18__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: i14__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.ɵf, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { type: i14__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5__namespace.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { type: i14__namespace.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i12__namespace.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "customize", "title", "name", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i12__namespace.ɵd, selector: "[fs-list-group-cell]" }, { type: i12__namespace.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i2__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i15__namespace.ɵw, selector: "button[type=\"submit\"]", inputs: ["dirtySubmit", "name"] }, { type: i2__namespace.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclRoleComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        templateUrl: './acl-role.component.html',
+                        styleUrls: ['./acl-role.component.scss'],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: FsAppAclService }, { type: i2__namespace.MatDialogRef }, { type: i3__namespace.FsMessage }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i2.MAT_DIALOG_DATA]
+                        }] }, { type: i0__namespace.ChangeDetectorRef }];
+        }, propDecorators: { list: [{
+                    type: i0.ViewChild,
+                    args: [i12.FsListComponent]
+                }] } });
+
+    var FsAclPermissionPopoverComponent = /** @class */ (function () {
+        function FsAclPermissionPopoverComponent(_appAclService) {
+            this._appAclService = _appAclService;
+        }
+        FsAclPermissionPopoverComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            this._appAclService.getPermissions()
+                .subscribe(function (permissions) {
+                _this.description = permissions.filter(function (item) {
+                    return item.value === _this.permission.value;
+                }).map(function (item) {
+                    return item.description;
+                })[0];
+            });
+        };
+        return FsAclPermissionPopoverComponent;
+    }());
+    FsAclPermissionPopoverComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclPermissionPopoverComponent, deps: [{ token: FsAppAclService }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsAclPermissionPopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsAclPermissionPopoverComponent, selector: "acl-permission-popover", inputs: { permission: "permission" }, ngImport: i0__namespace, template: "\n<fs-popover [template]=\"popover\" maxWidth=\"400\">\n  <ng-content></ng-content>\n</fs-popover>\n\n<ng-template #popover>\n  {{permission.name}}\n  <div class=\"small\">{{description}}</div>\n</ng-template>\n\n", styles: [":host{cursor:pointer}\n"], components: [{ type: i2__namespace$1.FsPopoverComponent, selector: "fs-popover", inputs: ["leaveDelay", "showDelay", "maxWidth", "autoShow", "autoClose", "loadingDiameter", "loading", "indication", "position", "theme", "size", "trigger", "template", "data", "wrapperClass"] }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclPermissionPopoverComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'acl-permission-popover',
+                        templateUrl: './acl-permission-popover.component.html',
+                        styleUrls: ['./acl-permission-popover.component.scss']
+                    }]
+            }], ctorParameters: function () { return [{ type: FsAppAclService }]; }, propDecorators: { permission: [{
+                    type: i0.Input
+                }] } });
 
     var FsAclRolesComponent = /** @class */ (function () {
         function FsAclRolesComponent(_appAclService, _dialog, _cdRef) {
@@ -508,7 +680,7 @@
             this._dialog = _dialog;
             this._cdRef = _cdRef;
             this.aclLevels = [];
-            this.list = new core.QueryList();
+            this.list = new i0.QueryList();
             this.indexedAclRoleLevels = {};
             this._destroy$ = new rxjs.Subject();
         }
@@ -529,7 +701,7 @@
             })
                 .subscribe(function (aclLevels) {
                 _this.aclLevels = aclLevels;
-                _this.indexedAclRoleLevels = common$1.list(_this.aclLevels, 'name', 'value');
+                _this.indexedAclRoleLevels = common.list(_this.aclLevels, 'name', 'value');
                 _this._loadListConfig();
             });
         };
@@ -611,81 +783,32 @@
                 },
             };
         };
-        FsAclRolesComponent.ctorParameters = function () { return [
-            { type: FsAppAclService },
-            { type: dialog.MatDialog },
-            { type: core.ChangeDetectorRef }
-        ]; };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FsAclRolesComponent.prototype, "deleteAclRole", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FsAclRolesComponent.prototype, "saveAclRole", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FsAclRolesComponent.prototype, "loadAclRoles", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FsAclRolesComponent.prototype, "loadAclRole", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Array)
-        ], FsAclRolesComponent.prototype, "aclLevels", void 0);
-        __decorate([
-            core.ViewChildren(list.FsListComponent),
-            __metadata("design:type", Object)
-        ], FsAclRolesComponent.prototype, "list", void 0);
-        FsAclRolesComponent = __decorate([
-            core.Component({
-                selector: 'fs-acl-roles',
-                template: "<fs-list [config]=\"listConfig\" *ngIf=\"listConfig\">\n  <fs-list-column title=\"Name\" name=\"name\" [sortable]=\"true\">\n    <ng-template fs-list-cell let-row=\"row\">\n      <a (click)=\"openDialog(row)\">{{ row.name }}</a>\n    </ng-template>\n  </fs-list-column>\n  <fs-list-column name=\"hierarchy\" title=\"Level\" [sortable]=\"true\">\n    <ng-template fs-list-cell let-row=\"row\">\n      {{ indexedAclRoleLevels[row.level] }}\n    </ng-template>\n  </fs-list-column>\n  <fs-list-column title=\"Permissions\">\n    <ng-template fs-list-cell let-row=\"row\">\n      <div class=\"permissions\">\n        <ng-container *ngFor=\"let permission of row.permissions\">\n          <span *ngIf=\"permission.access\" class=\"permission\">\n            <acl-permission-popover [permission]=\"permission\">{{permission.name}}</acl-permission-popover>\n          </span>\n        </ng-container>\n      </div>\n    </ng-template>\n  </fs-list-column>\n</fs-list>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [".permissions .permission+.permission::before{content:\", \"}"]
-            }),
-            __metadata("design:paramtypes", [FsAppAclService,
-                dialog.MatDialog,
-                core.ChangeDetectorRef])
-        ], FsAclRolesComponent);
         return FsAclRolesComponent;
     }());
-
-    var FsAclPermissionPopoverComponent = /** @class */ (function () {
-        function FsAclPermissionPopoverComponent(_appAclService) {
-            this._appAclService = _appAclService;
-        }
-        FsAclPermissionPopoverComponent.prototype.ngOnInit = function () {
-            var _this = this;
-            this._appAclService.getPermissions()
-                .subscribe(function (permissions) {
-                _this.description = permissions.filter(function (item) {
-                    return item.value === _this.permission.value;
-                }).map(function (item) {
-                    return item.description;
-                })[0];
-            });
-        };
-        FsAclPermissionPopoverComponent.ctorParameters = function () { return [
-            { type: FsAppAclService }
-        ]; };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclPermissionPopoverComponent.prototype, "permission", void 0);
-        FsAclPermissionPopoverComponent = __decorate([
-            core.Component({
-                selector: 'acl-permission-popover',
-                template: "\n<fs-popover [template]=\"popover\" maxWidth=\"400\">\n  <ng-content></ng-content>\n</fs-popover>\n\n<ng-template #popover>\n  {{permission.name}}\n  <div class=\"small\">{{description}}</div>\n</ng-template>\n\n",
-                styles: [":host{cursor:pointer}"]
-            }),
-            __metadata("design:paramtypes", [FsAppAclService])
-        ], FsAclPermissionPopoverComponent);
-        return FsAclPermissionPopoverComponent;
-    }());
+    FsAclRolesComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclRolesComponent, deps: [{ token: FsAppAclService }, { token: i2__namespace.MatDialog }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsAclRolesComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsAclRolesComponent, selector: "fs-acl-roles", inputs: { deleteAclRole: "deleteAclRole", saveAclRole: "saveAclRole", loadAclRoles: "loadAclRoles", loadAclRole: "loadAclRole", aclLevels: "aclLevels" }, viewQueries: [{ propertyName: "list", predicate: i12.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "<fs-list [config]=\"listConfig\" *ngIf=\"listConfig\">\n  <fs-list-column title=\"Name\" name=\"name\" [sortable]=\"true\">\n    <ng-template fs-list-cell let-row=\"row\">\n      <a (click)=\"openDialog(row)\">{{ row.name }}</a>\n    </ng-template>\n  </fs-list-column>\n  <fs-list-column name=\"hierarchy\" title=\"Level\" [sortable]=\"true\">\n    <ng-template fs-list-cell let-row=\"row\">\n      {{ indexedAclRoleLevels[row.level] }}\n    </ng-template>\n  </fs-list-column>\n  <fs-list-column title=\"Permissions\">\n    <ng-template fs-list-cell let-row=\"row\">\n      <div class=\"permissions\">\n        <ng-container *ngFor=\"let permission of row.permissions\">\n          <span *ngIf=\"permission.access\" class=\"permission\">\n            <acl-permission-popover [permission]=\"permission\">{{permission.name}}</acl-permission-popover>\n          </span>\n        </ng-container>\n      </div>\n    </ng-template>\n  </fs-list-column>\n</fs-list>\n", styles: [".permissions .permission+.permission:before{content:\", \"}\n"], components: [{ type: i12__namespace.FsListComponent, selector: "fs-list", inputs: ["loaderLines", "config"], outputs: ["filtersReady"] }, { type: FsAclPermissionPopoverComponent, selector: "acl-permission-popover", inputs: ["permission"] }], directives: [{ type: i7__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i12__namespace.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "customize", "title", "name", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i12__namespace.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i7__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclRolesComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-acl-roles',
+                        templateUrl: 'acl-roles.component.html',
+                        styleUrls: ['acl-roles.component.scss'],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () { return [{ type: FsAppAclService }, { type: i2__namespace.MatDialog }, { type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { deleteAclRole: [{
+                    type: i0.Input
+                }], saveAclRole: [{
+                    type: i0.Input
+                }], loadAclRoles: [{
+                    type: i0.Input
+                }], loadAclRole: [{
+                    type: i0.Input
+                }], aclLevels: [{
+                    type: i0.Input
+                }], list: [{
+                    type: i0.ViewChildren,
+                    args: [i12.FsListComponent]
+                }] } });
 
     var FsAclRolePopoverComponent = /** @class */ (function () {
         function FsAclRolePopoverComponent(_appAclService) {
@@ -704,27 +827,69 @@
                 });
             });
         };
-        FsAclRolePopoverComponent.ctorParameters = function () { return [
-            { type: FsAppAclService }
-        ]; };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclRolePopoverComponent.prototype, "aclRole", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclRolePopoverComponent.prototype, "objectName", void 0);
-        FsAclRolePopoverComponent = __decorate([
-            core.Component({
-                selector: 'fs-acl-role-popover',
-                template: "\n<fs-popover [template]=\"popover\" maxWidth=\"400\">\n  <ng-content></ng-content>\n</fs-popover>\n\n<ng-template #popover>\n  <div class=\"name small\">{{aclRole.name}}<span *ngIf=\"objectName\">: {{objectName}}</span></div>\n\n  <ng-container *ngIf=\"permissions.length; else nonePermission\">\n    <div *ngFor=\"let permission of permissions\" class=\"permission\">\n      <div>{{permission.name}}</div>\n      <div class=\"small\">{{permission.description}}</div>\n    </div>\n  </ng-container>\n\n  <ng-template #nonePermission>\n    None\n  </ng-template>\n</ng-template>\n",
-                styles: [".name{padding-bottom:10px}.permission+.permission{padding-top:5px}:host{cursor:pointer}"]
-            }),
-            __metadata("design:paramtypes", [FsAppAclService])
-        ], FsAclRolePopoverComponent);
         return FsAclRolePopoverComponent;
     }());
+    FsAclRolePopoverComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclRolePopoverComponent, deps: [{ token: FsAppAclService }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsAclRolePopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsAclRolePopoverComponent, selector: "fs-acl-role-popover", inputs: { aclRole: "aclRole", objectName: "objectName" }, ngImport: i0__namespace, template: "\n<fs-popover [template]=\"popover\" maxWidth=\"400\">\n  <ng-content></ng-content>\n</fs-popover>\n\n<ng-template #popover>\n  <div class=\"name small\">{{aclRole.name}}<span *ngIf=\"objectName\">: {{objectName}}</span></div>\n\n  <ng-container *ngIf=\"permissions.length; else nonePermission\">\n    <div *ngFor=\"let permission of permissions\" class=\"permission\">\n      <div>{{permission.name}}</div>\n      <div class=\"small\">{{permission.description}}</div>\n    </div>\n  </ng-container>\n\n  <ng-template #nonePermission>\n    None\n  </ng-template>\n</ng-template>\n", styles: [".name{padding-bottom:10px}.permission+.permission{padding-top:5px}:host{cursor:pointer}\n"], components: [{ type: i2__namespace$1.FsPopoverComponent, selector: "fs-popover", inputs: ["leaveDelay", "showDelay", "maxWidth", "autoShow", "autoClose", "loadingDiameter", "loading", "indication", "position", "theme", "size", "trigger", "template", "data", "wrapperClass"] }], directives: [{ type: i7__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclRolePopoverComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-acl-role-popover',
+                        templateUrl: './acl-role-popover.component.html',
+                        styleUrls: ['./acl-role-popover.component.scss']
+                    }]
+            }], ctorParameters: function () { return [{ type: FsAppAclService }]; }, propDecorators: { aclRole: [{
+                    type: i0.Input
+                }], objectName: [{
+                    type: i0.Input
+                }] } });
+
+    var FsAclObjectRolesComponent = /** @class */ (function () {
+        function FsAclObjectRolesComponent() {
+            this.aclRoles = [];
+            this.required = false;
+            this.multiple = false;
+            this.disabled = false;
+            this.aclObjectRoles = [];
+            this.rolesLabel = 'Roles';
+            this.levelLabel = '';
+            this.change = new i0.EventEmitter();
+            this.compareAclRole = function (o1, o2) {
+                return o1 && o2 && o1.id === o2.id;
+            };
+        }
+        FsAclObjectRolesComponent.prototype.changed = function () {
+            this.change.emit(this.aclObjectRoles);
+        };
+        return FsAclObjectRolesComponent;
+    }());
+    FsAclObjectRolesComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclObjectRolesComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsAclObjectRolesComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsAclObjectRolesComponent, selector: "fs-acl-object-roles", inputs: { aclRoles: "aclRoles", required: "required", multiple: "multiple", disabled: "disabled", aclObjectRoles: "aclObjectRoles", rolesLabel: "rolesLabel", levelLabel: "levelLabel" }, outputs: { change: "change" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!multiple\">\n  <ng-container *ngFor=\"let aclObjectRole of aclObjectRoles\">\n    <fs-checkbox-group\n      [(ngModel)]=\"aclObjectRole.aclRoles\"\n      (ngModelChange)=\"changed()\"\n      name=\"roles\"\n      [compareWith]=\"compareAclRole\"\n      [disabled]=\"disabled\"\n      [label]=\"rolesLabel\"\n      [fsFormRequired]=\"required\"\n      orientation=\"vertical\">\n      <mat-checkbox [disabled]=\"disabled\" *ngFor=\"let aclRole of aclRoles\" [value]=\"aclRole\">\n        {{ aclRole.name }}\n      </mat-checkbox>\n    </fs-checkbox-group>\n  </ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"multiple\">\n  <table>\n    <tr>\n      <td>\n        <small>{{levelLabel}}</small>\n      </td>\n      <td>\n        <small>{{rolesLabel}}</small>\n      </td>\n    </tr>\n    <tr *ngFor=\"let aclObjectRole of aclObjectRoles\">\n      <td>{{aclObjectRole.object.name}}</td>\n      <td>\n        <mat-form-field class=\"form-field-padless\">\n          <mat-select\n            [(ngModel)]=\"aclObjectRole.aclRoles\"\n            multiple=\"true\"\n            [disabled]=\"disabled\"\n            [compareWith]=\"compareAclRole\"\n            (ngModelChange)=\"changed()\"\n            name=\"aclRole_{{ aclObjectRole.object.id }}\">\n            <mat-option *ngFor=\"let aclRole of aclRoles\" [value]=\"aclRole\">\n              {{ aclRole.name }}\n            </mat-option>\n          </mat-select>\n        </mat-form-field>\n      </td>\n    </tr>\n  </table>\n</ng-container>\n", styles: ["table tr td:first-child{padding-right:15px}\n"], components: [{ type: i1__namespace.ɵa, selector: "fs-checkbox-group", inputs: ["orientation", "position", "disabled", "compareWith", "label"], outputs: ["change"] }, { type: i9__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i5__namespace.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i10__namespace.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i11__namespace.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i7__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i14__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i15__namespace.ɵf, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }], viewProviders: [{ provide: i14.ControlContainer, useExisting: i14.NgForm }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclObjectRolesComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-acl-object-roles',
+                        templateUrl: './acl-object-roles.component.html',
+                        styleUrls: ['./acl-object-roles.component.scss'],
+                        viewProviders: [{ provide: i14.ControlContainer, useExisting: i14.NgForm }]
+                    }]
+            }], propDecorators: { aclRoles: [{
+                    type: i0.Input
+                }], required: [{
+                    type: i0.Input
+                }], multiple: [{
+                    type: i0.Input
+                }], disabled: [{
+                    type: i0.Input
+                }], aclObjectRoles: [{
+                    type: i0.Input
+                }], rolesLabel: [{
+                    type: i0.Input
+                }], levelLabel: [{
+                    type: i0.Input
+                }], change: [{
+                    type: i0.Output
+                }] } });
 
     var FsAclEntryComponent = /** @class */ (function () {
         function FsAclEntryComponent(_appAclService, _dialogRef, _message, _data) {
@@ -746,8 +911,8 @@
                     _this.close(data);
                 });
             };
-            this.aclObjectEntry = __assign({}, _data.aclObjectEntry);
-            this.required = (_a = _data.required, (_a !== null && _a !== void 0 ? _a : true));
+            this.aclObjectEntry = Object.assign({}, _data.aclObjectEntry);
+            this.required = (_a = _data.required) !== null && _a !== void 0 ? _a : true;
             if (_data.titleEdit) {
                 this.titleEdit = _data.titleEdit;
             }
@@ -762,8 +927,8 @@
                 environmentId: this.aclObjectEntry.environmentId,
             })
                 .pipe(operators.map(function (data) { return _this._appAclService.input(data); })), this._appAclService.getIndexedLevels())
-                .subscribe(function (_a) {
-                var _b = __read(_a, 2), aclRoles = _b[0], levels = _b[1];
+                .subscribe(function (_b) {
+                var _c = __read(_b, 2), aclRoles = _c[0], levels = _c[1];
                 _this.aclRoles = aclRoles;
                 _this.indexedAclRoleLevels = levels;
                 _this.aclObjectRole = {
@@ -792,24 +957,22 @@
             if (data === void 0) { data = null; }
             this._dialogRef.close(data);
         };
-        FsAclEntryComponent.ctorParameters = function () { return [
-            { type: FsAppAclService },
-            { type: dialog.MatDialogRef },
-            { type: message.FsMessage },
-            { type: undefined, decorators: [{ type: core.Inject, args: [dialog.MAT_DIALOG_DATA,] }] }
-        ]; };
-        FsAclEntryComponent = __decorate([
-            core.Component({
-                template: "<form fsForm [submit]=\"save\">\n  <fs-dialog>\n    <div mat-dialog-title>{{ titleEdit? titleEdit : titleAdd }}</div>\n    <mat-dialog-content>\n      <div *ngIf=\"aclObjectRole\">\n        <fs-label-field *ngIf=\"aclObjectEntry.object\">\n          <fs-label>{{indexedAclRoleLevels[aclObjectEntry.level]}}</fs-label>\n          {{aclObjectEntry.object.name}}\n        </fs-label-field>\n\n        <fs-acl-object-roles\n          [aclRoles]=\"aclRoles\"\n          [aclObjectRoles]=\"[aclObjectRole]\"\n          [required]=\"required\"\n          (change)=\"aclObjectRoleChange($event)\">\n        </fs-acl-object-roles>\n      </div>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <button mat-button type=\"submit\" color=\"primary\">Save</button>\n      <button mat-button mat-dialog-close type=\"button\">Cancel</button>\n    </mat-dialog-actions>\n  </fs-dialog>\n</form>\n",
-                styles: ["::ng-deep .account-roles-autocomplete-panel .mat-option{line-height:normal}::ng-deep .account-roles-autocomplete-panel .mat-option .mat-option-text{display:flex;flex-direction:row;align-items:center}::ng-deep .account-roles-autocomplete-panel .mat-option .mat-option-text fs-badge{margin-right:5px}"]
-            }),
-            __param(3, core.Inject(dialog.MAT_DIALOG_DATA)),
-            __metadata("design:paramtypes", [FsAppAclService,
-                dialog.MatDialogRef,
-                message.FsMessage, Object])
-        ], FsAclEntryComponent);
         return FsAclEntryComponent;
     }());
+    FsAclEntryComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclEntryComponent, deps: [{ token: FsAppAclService }, { token: i2__namespace.MatDialogRef }, { token: i3__namespace.FsMessage }, { token: i2.MAT_DIALOG_DATA }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsAclEntryComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsAclEntryComponent, selector: "ng-component", ngImport: i0__namespace, template: "<form fsForm [submit]=\"save\">\n  <fs-dialog>\n    <div mat-dialog-title>{{ titleEdit? titleEdit : titleAdd }}</div>\n    <mat-dialog-content>\n      <div *ngIf=\"aclObjectRole\">\n        <fs-label-field *ngIf=\"aclObjectEntry.object\">\n          <fs-label>{{indexedAclRoleLevels[aclObjectEntry.level]}}</fs-label>\n          {{aclObjectEntry.object.name}}\n        </fs-label-field>\n\n        <fs-acl-object-roles\n          [aclRoles]=\"aclRoles\"\n          [aclObjectRoles]=\"[aclObjectRole]\"\n          [required]=\"required\"\n          (change)=\"aclObjectRoleChange($event)\">\n        </fs-acl-object-roles>\n      </div>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <button mat-button type=\"submit\" color=\"primary\">Save</button>\n      <button mat-button mat-dialog-close type=\"button\">Cancel</button>\n    </mat-dialog-actions>\n  </fs-dialog>\n</form>\n", styles: ["::ng-deep .account-roles-autocomplete-panel .mat-option{line-height:normal}::ng-deep .account-roles-autocomplete-panel .mat-option .mat-option-text{display:flex;flex-direction:row;align-items:center}::ng-deep .account-roles-autocomplete-panel .mat-option .mat-option-text fs-badge{margin-right:5px}\n"], components: [{ type: i4__namespace.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode"] }, { type: i6__namespace.ɵb, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { type: i6__namespace.ɵa, selector: "fs-label" }, { type: FsAclObjectRolesComponent, selector: "fs-acl-object-roles", inputs: ["aclRoles", "required", "multiple", "disabled", "aclObjectRoles", "rolesLabel", "levelLabel"], outputs: ["change"] }, { type: i13__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: i14__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14__namespace.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i15__namespace.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "successDelay", "errorDelay", "submit", "tabGroup"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"] }, { type: i2__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i2__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i7__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i15__namespace.ɵw, selector: "button[type=\"submit\"]", inputs: ["dirtySubmit", "name"] }, { type: i2__namespace.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: FsAclEntryComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        templateUrl: './acl-entry.component.html',
+                        styleUrls: ['./acl-entry.component.scss'],
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: FsAppAclService }, { type: i2__namespace.MatDialogRef }, { type: i3__namespace.FsMessage }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i2.MAT_DIALOG_DATA]
+                        }] }];
+        } });
 
     var FsAclEntriesComponent = /** @class */ (function () {
         function FsAclEntriesComponent(_appAclService, _dialog, _confirm) {
@@ -843,7 +1006,7 @@
                                 title: 'Remove All Roles',
                                 template: 'Are you sure you would like to remove all roles?',
                             }).subscribe(function () {
-                                var data = _this._appAclService.output(__assign(__assign({}, aclObjectEntry), { aclEntries: [] }));
+                                var data = _this._appAclService.output(Object.assign(Object.assign({}, aclObjectEntry), { aclEntries: [] }));
                                 _this.saveAclObjectEntry(data)
                                     .subscribe(function () {
                                     _this.aclEntriesList.reload();
@@ -934,183 +1097,150 @@
         FsAclEntriesComponent.prototype.reload = function () {
             this.aclEntriesList.reload();
         };
-        FsAclEntriesComponent.ctorParameters = function () { return [
-            { type: FsAppAclService },
-            { type: dialog.MatDialog },
-            { type: prompt.FsPrompt }
-        ]; };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FsAclEntriesComponent.prototype, "loadAclEntries", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FsAclEntriesComponent.prototype, "loadAclRoles", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Function)
-        ], FsAclEntriesComponent.prototype, "saveAclObjectEntry", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclEntriesComponent.prototype, "environmentShow", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclEntriesComponent.prototype, "environmentLabel", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Array)
-        ], FsAclEntriesComponent.prototype, "actions", void 0);
-        __decorate([
-            core.ViewChild(list.FsListComponent),
-            __metadata("design:type", list.FsListComponent)
-        ], FsAclEntriesComponent.prototype, "aclEntriesList", void 0);
-        FsAclEntriesComponent = __decorate([
-            core.Component({
-                selector: 'fs-acl-entries',
-                template: "\n<fs-list [config]=\"aclEntriesConfig\">\n  <fs-list-column>\n    <ng-template fs-list-header>Context</ng-template>\n    <ng-template fs-list-cell let-row=\"row\">\n      <div\n        *ngIf=\"row.object; else elseObject\"\n        fxLayout=\"row\"\n        fxLayoutAlign=\"start center\"\n        fxLayoutGap=\"10px\">\n          <fs-badge *ngIf=\"row.object.imageUrl\" shape=\"circle\" image=\"{{ row.object.imageUrl }}\"></fs-badge>\n          <span>\n            <div><small>{{ row.object.className }}</small></div>\n            <a (click)=\"update(row)\">{{ row.object.name }}</a>\n          </span>\n      </div>\n\n      <ng-template #elseObject>\n        <a (click)=\"update(row)\">App</a>\n      </ng-template>\n    </ng-template>\n  </fs-list-column>\n\n  <fs-list-column [show]=\"environmentShow\">\n    <ng-template fs-list-header>{{environmentLabel}}</ng-template>\n    <ng-template fs-list-cell let-row=\"row\">\n      {{row.environment?.name}}\n    </ng-template>\n  </fs-list-column>\n\n  <fs-list-column>\n    <ng-template fs-list-header>Roles</ng-template>\n    <ng-template fs-list-cell let-row=\"row\">\n      <div fxLayout=\"column\" fxLayoutGap=\"10px\">\n        <div div *ngFor=\"let aclEntry of row.aclEntries\">\n          <ng-container [ngSwitch]=\"row.level\">\n            <ng-container *ngSwitchCase=\"'app'\">\n              <fs-acl-role-popover [aclRole]=\"aclEntry.aclRole\" objectName=\"App\">{{aclEntry.aclRole.name}}</fs-acl-role-popover>\n            </ng-container>\n            <ng-container *ngSwitchDefault>\n              <ng-container *ngIf=\"row.object\">\n                <fs-acl-role-popover [aclRole]=\"aclEntry.aclRole\">{{aclEntry.aclRole.name}}</fs-acl-role-popover>\n              </ng-container>\n            </ng-container>\n          </ng-container>\n        </div>\n      </div>\n    </ng-template>\n  </fs-list-column>\n</fs-list>\n",
-                styles: [""]
-            }),
-            __metadata("design:paramtypes", [FsAppAclService,
-                dialog.MatDialog,
-                prompt.FsPrompt])
-        ], FsAclEntriesComponent);
         return FsAclEntriesComponent;
     }());
-
-    var FsAclObjectRolesComponent = /** @class */ (function () {
-        function FsAclObjectRolesComponent() {
-            this.aclRoles = [];
-            this.required = false;
-            this.multiple = false;
-            this.disabled = false;
-            this.aclObjectRoles = [];
-            this.rolesLabel = 'Roles';
-            this.levelLabel = '';
-            this.change = new core.EventEmitter();
-            this.compareAclRole = function (o1, o2) {
-                return o1 && o2 && o1.id === o2.id;
-            };
-        }
-        FsAclObjectRolesComponent.prototype.changed = function () {
-            this.change.emit(this.aclObjectRoles);
-        };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Array)
-        ], FsAclObjectRolesComponent.prototype, "aclRoles", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclObjectRolesComponent.prototype, "required", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclObjectRolesComponent.prototype, "multiple", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclObjectRolesComponent.prototype, "disabled", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Array)
-        ], FsAclObjectRolesComponent.prototype, "aclObjectRoles", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclObjectRolesComponent.prototype, "rolesLabel", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], FsAclObjectRolesComponent.prototype, "levelLabel", void 0);
-        __decorate([
-            core.Output(),
-            __metadata("design:type", Object)
-        ], FsAclObjectRolesComponent.prototype, "change", void 0);
-        FsAclObjectRolesComponent = __decorate([
-            core.Component({
-                selector: 'fs-acl-object-roles',
-                template: "<ng-container *ngIf=\"!multiple\">\n  <ng-container *ngFor=\"let aclObjectRole of aclObjectRoles\">\n    <fs-checkbox-group\n      [(ngModel)]=\"aclObjectRole.aclRoles\"\n      (ngModelChange)=\"changed()\"\n      name=\"roles\"\n      [compareWith]=\"compareAclRole\"\n      [disabled]=\"disabled\"\n      [label]=\"rolesLabel\"\n      [fsFormRequired]=\"required\"\n      orientation=\"vertical\">\n      <mat-checkbox [disabled]=\"disabled\" *ngFor=\"let aclRole of aclRoles\" [value]=\"aclRole\">\n        {{ aclRole.name }}\n      </mat-checkbox>\n    </fs-checkbox-group>\n  </ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"multiple\">\n  <table>\n    <tr>\n      <td>\n        <small>{{levelLabel}}</small>\n      </td>\n      <td>\n        <small>{{rolesLabel}}</small>\n      </td>\n    </tr>\n    <tr *ngFor=\"let aclObjectRole of aclObjectRoles\">\n      <td>{{aclObjectRole.object.name}}</td>\n      <td>\n        <mat-form-field class=\"form-field-padless\">\n          <mat-select\n            [(ngModel)]=\"aclObjectRole.aclRoles\"\n            multiple=\"true\"\n            [disabled]=\"disabled\"\n            [compareWith]=\"compareAclRole\"\n            (ngModelChange)=\"changed()\"\n            name=\"aclRole_{{ aclObjectRole.object.id }}\">\n            <mat-option *ngFor=\"let aclRole of aclRoles\" [value]=\"aclRole\">\n              {{ aclRole.name }}\n            </mat-option>\n          </mat-select>\n        </mat-form-field>\n      </td>\n    </tr>\n  </table>\n</ng-container>\n",
-                viewProviders: [{ provide: forms.ControlContainer, useExisting: forms.NgForm }],
-                styles: ["table tr td:first-child{padding-right:15px}"]
-            })
-        ], FsAclObjectRolesComponent);
-        return FsAclObjectRolesComponent;
-    }());
+    FsAclEntriesComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclEntriesComponent, deps: [{ token: FsAppAclService }, { token: i2__namespace.MatDialog }, { token: i3__namespace$1.FsPrompt }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsAclEntriesComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsAclEntriesComponent, selector: "fs-acl-entries", inputs: { loadAclEntries: "loadAclEntries", loadAclRoles: "loadAclRoles", saveAclObjectEntry: "saveAclObjectEntry", environmentShow: "environmentShow", environmentLabel: "environmentLabel", actions: "actions" }, viewQueries: [{ propertyName: "aclEntriesList", first: true, predicate: i12.FsListComponent, descendants: true }], ngImport: i0__namespace, template: "\n<fs-list [config]=\"aclEntriesConfig\">\n  <fs-list-column>\n    <ng-template fs-list-header>Context</ng-template>\n    <ng-template fs-list-cell let-row=\"row\">\n      <div\n        *ngIf=\"row.object; else elseObject\"\n        fxLayout=\"row\"\n        fxLayoutAlign=\"start center\"\n        fxLayoutGap=\"10px\">\n          <fs-badge *ngIf=\"row.object.imageUrl\" shape=\"circle\" image=\"{{ row.object.imageUrl }}\"></fs-badge>\n          <span>\n            <div><small>{{ row.object.className }}</small></div>\n            <a (click)=\"update(row)\">{{ row.object.name }}</a>\n          </span>\n      </div>\n\n      <ng-template #elseObject>\n        <a (click)=\"update(row)\">App</a>\n      </ng-template>\n    </ng-template>\n  </fs-list-column>\n\n  <fs-list-column [show]=\"environmentShow\">\n    <ng-template fs-list-header>{{environmentLabel}}</ng-template>\n    <ng-template fs-list-cell let-row=\"row\">\n      {{row.environment?.name}}\n    </ng-template>\n  </fs-list-column>\n\n  <fs-list-column>\n    <ng-template fs-list-header>Roles</ng-template>\n    <ng-template fs-list-cell let-row=\"row\">\n      <div fxLayout=\"column\" fxLayoutGap=\"10px\">\n        <div div *ngFor=\"let aclEntry of row.aclEntries\">\n          <ng-container [ngSwitch]=\"row.level\">\n            <ng-container *ngSwitchCase=\"'app'\">\n              <fs-acl-role-popover [aclRole]=\"aclEntry.aclRole\" objectName=\"App\">{{aclEntry.aclRole.name}}</fs-acl-role-popover>\n            </ng-container>\n            <ng-container *ngSwitchDefault>\n              <ng-container *ngIf=\"row.object\">\n                <fs-acl-role-popover [aclRole]=\"aclEntry.aclRole\">{{aclEntry.aclRole.name}}</fs-acl-role-popover>\n              </ng-container>\n            </ng-container>\n          </ng-container>\n        </div>\n      </div>\n    </ng-template>\n  </fs-list-column>\n</fs-list>\n", styles: [""], components: [{ type: i12__namespace.FsListComponent, selector: "fs-list", inputs: ["loaderLines", "config"], outputs: ["filtersReady"] }, { type: i5__namespace$1.ɵa, selector: "fs-badge", inputs: ["text", "shape", "color", "tooltip", "size", "image", "icon", "iconSize", "iconColor", "backgroundSize"] }, { type: FsAclRolePopoverComponent, selector: "fs-acl-role-popover", inputs: ["aclRole", "objectName"] }], directives: [{ type: i12__namespace.FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "customize", "title", "name", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: i12__namespace.FsListHeaderDirective, selector: "[fs-list-header]", inputs: ["colspan", "align", "class"] }, { type: i12__namespace.FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i7__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i17__namespace.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: i17__namespace.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: i17__namespace.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: i7__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7__namespace$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i7__namespace$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i7__namespace$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAclEntriesComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'fs-acl-entries',
+                        templateUrl: './acl-entries.component.html',
+                        styleUrls: ['./acl-entries.component.scss']
+                    }]
+            }], ctorParameters: function () { return [{ type: FsAppAclService }, { type: i2__namespace.MatDialog }, { type: i3__namespace$1.FsPrompt }]; }, propDecorators: { loadAclEntries: [{
+                    type: i0.Input
+                }], loadAclRoles: [{
+                    type: i0.Input
+                }], saveAclObjectEntry: [{
+                    type: i0.Input
+                }], environmentShow: [{
+                    type: i0.Input
+                }], environmentLabel: [{
+                    type: i0.Input
+                }], actions: [{
+                    type: i0.Input
+                }], aclEntriesList: [{
+                    type: i0.ViewChild,
+                    args: [i12.FsListComponent]
+                }] } });
 
     var FsAppAclModule = /** @class */ (function () {
         function FsAppAclModule() {
         }
-        FsAppAclModule_1 = FsAppAclModule;
-        FsAppAclModule.forRoot = function () {
-            return {
-                ngModule: FsAppAclModule_1,
-            };
-        };
-        var FsAppAclModule_1;
-        FsAppAclModule = FsAppAclModule_1 = __decorate([
-            core.NgModule({
-                imports: [
-                    common.CommonModule,
-                    forms.FormsModule,
-                    dialog.MatDialogModule,
-                    formField.MatFormFieldModule,
-                    checkbox.MatCheckboxModule,
-                    select.MatSelectModule,
-                    button.MatButtonModule,
-                    radio.MatRadioModule,
-                    input.MatInputModule,
-                    flexLayout.FlexLayoutModule,
-                    list.FsListModule,
-                    popover.FsPopoverModule,
-                    dialog$1.FsDialogModule,
-                    form.FsFormModule,
-                    label.FsLabelModule,
-                    radiogroup.FsRadioGroupModule,
-                    badge.FsBadgeModule,
-                    checkboxgroup.FsCheckboxGroupModule,
-                ],
-                declarations: [
-                    FsAclRolesComponent,
-                    FsAclPermissionPopoverComponent,
-                    FsAclRoleComponent,
-                    FsAclEntriesComponent,
-                    FsAclRolePopoverComponent,
-                    FsAclObjectRolesComponent,
-                    FsAclEntryComponent,
-                ],
-                exports: [
-                    FsAclRolesComponent,
-                    FsAclPermissionPopoverComponent,
-                    FsAclRoleComponent,
-                    FsAclEntriesComponent,
-                    FsAclRolePopoverComponent,
-                    FsAclObjectRolesComponent,
-                    FsAclEntryComponent,
-                ],
-                entryComponents: [
-                    FsAclRoleComponent
-                ]
-            })
-        ], FsAppAclModule);
         return FsAppAclModule;
     }());
+    FsAppAclModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAppAclModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    FsAppAclModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAppAclModule, declarations: [FsAclRolesComponent,
+            FsAclPermissionPopoverComponent,
+            FsAclRoleComponent,
+            FsAclEntriesComponent,
+            FsAclRolePopoverComponent,
+            FsAclObjectRolesComponent,
+            FsAclEntryComponent], imports: [i7$1.CommonModule,
+            i14.FormsModule,
+            i2.MatDialogModule,
+            i5.MatFormFieldModule,
+            i9.MatCheckboxModule,
+            i10.MatSelectModule,
+            i13.MatButtonModule,
+            i8.MatRadioModule,
+            i18.MatInputModule,
+            flexLayout.FlexLayoutModule,
+            i12.FsListModule,
+            i2$1.FsPopoverModule,
+            i4.FsDialogModule,
+            i15.FsFormModule,
+            i6.FsLabelModule,
+            i7.FsRadioGroupModule,
+            i5$1.FsBadgeModule,
+            i1.FsCheckboxGroupModule], exports: [FsAclRolesComponent,
+            FsAclPermissionPopoverComponent,
+            FsAclRoleComponent,
+            FsAclEntriesComponent,
+            FsAclRolePopoverComponent,
+            FsAclObjectRolesComponent,
+            FsAclEntryComponent] });
+    FsAppAclModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAppAclModule, imports: [[
+                i7$1.CommonModule,
+                i14.FormsModule,
+                i2.MatDialogModule,
+                i5.MatFormFieldModule,
+                i9.MatCheckboxModule,
+                i10.MatSelectModule,
+                i13.MatButtonModule,
+                i8.MatRadioModule,
+                i18.MatInputModule,
+                flexLayout.FlexLayoutModule,
+                i12.FsListModule,
+                i2$1.FsPopoverModule,
+                i4.FsDialogModule,
+                i15.FsFormModule,
+                i6.FsLabelModule,
+                i7.FsRadioGroupModule,
+                i5$1.FsBadgeModule,
+                i1.FsCheckboxGroupModule,
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsAppAclModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [
+                            i7$1.CommonModule,
+                            i14.FormsModule,
+                            i2.MatDialogModule,
+                            i5.MatFormFieldModule,
+                            i9.MatCheckboxModule,
+                            i10.MatSelectModule,
+                            i13.MatButtonModule,
+                            i8.MatRadioModule,
+                            i18.MatInputModule,
+                            flexLayout.FlexLayoutModule,
+                            i12.FsListModule,
+                            i2$1.FsPopoverModule,
+                            i4.FsDialogModule,
+                            i15.FsFormModule,
+                            i6.FsLabelModule,
+                            i7.FsRadioGroupModule,
+                            i5$1.FsBadgeModule,
+                            i1.FsCheckboxGroupModule,
+                        ],
+                        declarations: [
+                            FsAclRolesComponent,
+                            FsAclPermissionPopoverComponent,
+                            FsAclRoleComponent,
+                            FsAclEntriesComponent,
+                            FsAclRolePopoverComponent,
+                            FsAclObjectRolesComponent,
+                            FsAclEntryComponent,
+                        ],
+                        exports: [
+                            FsAclRolesComponent,
+                            FsAclPermissionPopoverComponent,
+                            FsAclRoleComponent,
+                            FsAclEntriesComponent,
+                            FsAclRolePopoverComponent,
+                            FsAclObjectRolesComponent,
+                            FsAclEntryComponent,
+                        ],
+                    }]
+            }] });
+
+    /**
+     * Generated bundle index. Do not edit.
+     */
 
     exports.FS_APP_ACL_CONFIG = FS_APP_ACL_CONFIG;
     exports.FsAclEntriesComponent = FsAclEntriesComponent;
+    exports.FsAclEntryComponent = FsAclEntryComponent;
+    exports.FsAclObjectRolesComponent = FsAclObjectRolesComponent;
+    exports.FsAclPermissionPopoverComponent = FsAclPermissionPopoverComponent;
+    exports.FsAclRoleComponent = FsAclRoleComponent;
+    exports.FsAclRolePopoverComponent = FsAclRolePopoverComponent;
     exports.FsAclRolesComponent = FsAclRolesComponent;
     exports.FsAppAclModule = FsAppAclModule;
     exports.FsAppAclService = FsAppAclService;
-    exports.ɵa = FsAppAclService;
-    exports.ɵb = FsAclPermissionPopoverComponent;
-    exports.ɵc = FsAclRoleComponent;
-    exports.ɵd = FsAclRolePopoverComponent;
-    exports.ɵe = FsAclObjectRolesComponent;
-    exports.ɵf = FsAclEntryComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });
 
-})));
+}));
 //# sourceMappingURL=firestitch-app-acl.umd.js.map