@rxap/layout 12.1.0-next.1 → 12.2.1

package/bundles/rxap-layout.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@rxap/services'), require('@angular/common'), require('@angular/material/toolbar'), require('@angular/cdk/portal'), require('rxjs'), require('rxjs/operators'), require('@rxap/authentication'), require('@angular/flex-layout/extended'), require('@angular/flex-layout/flex'), require('@rxap/config'), require('@angular/material/form-field'), require('@angular/material/select'), require('@angular/forms'), require('@angular/material/core'), require('@angular/material/button'), require('@angular/cdk/overlay'), require('@angular/material/icon'), require('@angular/router'), require('@angular/material/progress-bar'), require('@angular/material/sidenav'), require('@rxap/utilities'), require('@rxap/utilities/rxjs'), require('@angular/material/menu'), require('@rxap/directives'), require('@angular/flex-layout'), require('@angular/material/grid-list'), require('@angular/material/divider'), require('@angular/animations'), require('@rxap/material-directives/icon'), require('@rxap/components')) :
-    typeof define === 'function' && define.amd ? define('@rxap/layout', ['exports', '@angular/core', '@rxap/services', '@angular/common', '@angular/material/toolbar', '@angular/cdk/portal', 'rxjs', 'rxjs/operators', '@rxap/authentication', '@angular/flex-layout/extended', '@angular/flex-layout/flex', '@rxap/config', '@angular/material/form-field', '@angular/material/select', '@angular/forms', '@angular/material/core', '@angular/material/button', '@angular/cdk/overlay', '@angular/material/icon', '@angular/router', '@angular/material/progress-bar', '@angular/material/sidenav', '@rxap/utilities', '@rxap/utilities/rxjs', '@angular/material/menu', '@rxap/directives', '@angular/flex-layout', '@angular/material/grid-list', '@angular/material/divider', '@angular/animations', '@rxap/material-directives/icon', '@rxap/components'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.rxap = global.rxap || {}, global.rxap.layout = {}), global.ng.core, global.i1, global.ng.common, global.ng.material.toolbar, global.ng.cdk.portal, global.rxjs, global.rxjs.operators, global.i2$2, global.ng.flexLayout.extended, global.ng.flexLayout.flex, global.i1$1, global.ng.material.formField, global.ng.material.select, global.ng.forms, global.ng.material.core, global.ng.material.button, global.ng.cdk.overlay, global.ng.material.icon, global.ng.router, global.ng.material.progressBar, global.ng.material.sidenav, global.utilities, global.rxjs, global.ng.material.menu, global.i3$5, global.ng.flexLayout, global.ng.material.gridList, global.ng.material.divider, global.ng.animations, global.i5$1, global.components));
-}(this, (function (exports, i0, i1, i2, i3, i4, rxjs$1, operators, i2$2, i2$1, i1$3, i1$1, i3$1, i4$1, i5, i6, i1$2, i3$2, i3$3, i1$4, i2$3, i3$4, utilities, rxjs, i2$4, i3$5, flexLayout, gridList, i2$5, animations, i5$1, components) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@rxap/services'), require('@angular/common'), require('@angular/material/toolbar'), require('@angular/cdk/portal'), require('rxjs'), require('rxjs/operators'), require('@rxap/authentication'), require('@angular/flex-layout/extended'), require('@angular/flex-layout/flex'), require('@rxap/config'), require('@angular/material/form-field'), require('@angular/material/select'), require('@angular/forms'), require('@angular/material/core'), require('@angular/material/button'), require('@angular/cdk/overlay'), require('@angular/material/icon'), require('@angular/router'), require('@angular/material/progress-bar'), require('@angular/material/sidenav'), require('@rxap/utilities'), require('@rxap/utilities/rxjs'), require('@angular/material/menu'), require('@rxap/directives'), require('@angular/flex-layout'), require('@angular/material/grid-list'), require('@angular/material/divider'), require('@angular/animations'), require('@rxap/material-directives/icon'), require('@rxap/components'), require('@angular/material/tooltip')) :
+    typeof define === 'function' && define.amd ? define('@rxap/layout', ['exports', '@angular/core', '@rxap/services', '@angular/common', '@angular/material/toolbar', '@angular/cdk/portal', 'rxjs', 'rxjs/operators', '@rxap/authentication', '@angular/flex-layout/extended', '@angular/flex-layout/flex', '@rxap/config', '@angular/material/form-field', '@angular/material/select', '@angular/forms', '@angular/material/core', '@angular/material/button', '@angular/cdk/overlay', '@angular/material/icon', '@angular/router', '@angular/material/progress-bar', '@angular/material/sidenav', '@rxap/utilities', '@rxap/utilities/rxjs', '@angular/material/menu', '@rxap/directives', '@angular/flex-layout', '@angular/material/grid-list', '@angular/material/divider', '@angular/animations', '@rxap/material-directives/icon', '@rxap/components', '@angular/material/tooltip'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.rxap = global.rxap || {}, global.rxap.layout = {}), global.ng.core, global.i1, global.ng.common, global.ng.material.toolbar, global.ng.cdk.portal, global.rxjs, global.rxjs.operators, global.i2$2, global.ng.flexLayout.extended, global.ng.flexLayout.flex, global.i1$1, global.ng.material.formField, global.ng.material.select, global.ng.forms, global.ng.material.core, global.ng.material.button, global.ng.cdk.overlay, global.ng.material.icon, global.ng.router, global.ng.material.progressBar, global.ng.material.sidenav, global.utilities, global.rxjs, global.ng.material.menu, global.i3$5, global.ng.flexLayout, global.ng.material.gridList, global.ng.material.divider, global.ng.animations, global.i6$1, global.components, global.ng.material.tooltip));
+}(this, (function (exports, i0, i1, i2, i3, i4, rxjs$1, operators, i2$2, i2$1, i1$3, i1$1, i3$1, i4$1, i5, i6, i1$2, i3$2, i3$3, i1$4, i2$3, i3$4, utilities, rxjs, i2$4, i3$5, flexLayout, gridList, i2$5, animations, i6$1, components, i3$6) { 'use strict';
 
     function _interopNamespace(e) {
         if (e && e.__esModule) return e;
@@ -46,7 +46,8 @@
     var i2__namespace$4 = /*#__PURE__*/_interopNamespace(i2$4);
     var i3__namespace$4 = /*#__PURE__*/_interopNamespace(i3$5);
     var i2__namespace$5 = /*#__PURE__*/_interopNamespace(i2$5);
-    var i5__namespace$1 = /*#__PURE__*/_interopNamespace(i5$1);
+    var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
+    var i3__namespace$6 = /*#__PURE__*/_interopNamespace(i3$6);
 
     var RXAP_NAVIGATION_CONFIG = new i0.InjectionToken('rxap/layout/navigation-config');
     var RXAP_NAVIGATION_CONFIG_INSERTS = new i0.InjectionToken('rxap/layout/navigation-config-inserts');
@@ -1560,7 +1561,7 @@
     var SidenavComponentService = /** @class */ (function () {
         function SidenavComponentService(config) {
             this.config = config;
-            this.collapsed$ = new rxjs$1.BehaviorSubject(false);
+            this.collapsed$ = new rxjs$1.BehaviorSubject(true);
             this.collapsed$.next(this.config.get('navigation.collapsed', this.collapsed$.value));
         }
         SidenavComponentService.prototype.toggleNavigationCollapse = function () {
@@ -1654,14 +1655,17 @@
             var isVisibleArray$ = navigationItem.status
                 .map(function (statusToken) { return _this.injector.get(statusToken); })
                 .map(function (status) {
-                var isVisible = status.isVisible(navigationItem.routerLink);
+                var isVisible = status.isVisible(navigationItem);
                 if (typeof isVisible === 'boolean') {
                     return rxjs$1.of(isVisible);
                 }
                 else {
                     return rxjs$1.from(isVisible);
                 }
-            });
+            }).map(function (isVisible$) { return isVisible$.pipe(operators.catchError(function (e) {
+                console.error('isVisible method failed: ' + e.message);
+                return rxjs$1.of(false);
+            })); });
             // TODO : dont wait for all status services to complete, but cancel waiting if one returns false
             return rxjs$1.combineLatest(isVisibleArray$).pipe(operators.map(function (isVisibleArray) { return isVisibleArray.reduce(function (acc, isVisible) { return acc && isVisible; }, true); }), operators.map(function (isVisible) { return (isVisible ? navigationItem : null); }), operators.switchMap(function (navigationItemOrNull) {
                 if (navigationItemOrNull) {
@@ -1755,7 +1759,7 @@
 
     var _c0$3 = ["navigationOverlay"];
     var _c1$2 = ["rxap-navigation-item", ""];
-    function NavigationItemComponent_mat_icon_1_Template(rf, ctx) {
+    function NavigationItemComponent_mat_icon_2_Template(rf, ctx) {
         if (rf & 1) {
             i0__namespace.ɵɵelement(0, "mat-icon", 5);
         }
@@ -1764,7 +1768,7 @@
             i0__namespace.ɵɵproperty("rxapIcon", ctx_r0.item.icon);
         }
     }
-    function NavigationItemComponent_ng_template_2_Template(rf, ctx) {
+    function NavigationItemComponent_ng_template_3_Template(rf, ctx) {
         if (rf & 1) {
             i0__namespace.ɵɵelementStart(0, "span", 6);
             i0__namespace.ɵɵtext(1);
@@ -1776,7 +1780,7 @@
             i0__namespace.ɵɵtextInterpolate(ctx_r1.item.label);
         }
     }
-    function NavigationItemComponent_ul_4_Template(rf, ctx) {
+    function NavigationItemComponent_ul_5_Template(rf, ctx) {
         if (rf & 1) {
             i0__namespace.ɵɵelement(0, "ul", 7);
         }
@@ -1785,7 +1789,7 @@
             i0__namespace.ɵɵproperty("@sub-nav", undefined)("items", ctx_r2.children)("level", ctx_r2.level + 1);
         }
     }
-    function NavigationItemComponent_ng_template_6_li_2_a_1_mat_icon_1_Template(rf, ctx) {
+    function NavigationItemComponent_ng_template_7_li_2_a_1_mat_icon_1_Template(rf, ctx) {
         if (rf & 1) {
             i0__namespace.ɵɵelement(0, "mat-icon", 5);
         }
@@ -1795,10 +1799,10 @@
             i0__namespace.ɵɵproperty("rxapIcon", ctx_r8.asNavigationItem(child_r6).icon);
         }
     }
-    function NavigationItemComponent_ng_template_6_li_2_a_1_Template(rf, ctx) {
+    function NavigationItemComponent_ng_template_7_li_2_a_1_Template(rf, ctx) {
         if (rf & 1) {
             i0__namespace.ɵɵelementStart(0, "a", 11);
-            i0__namespace.ɵɵtemplate(1, NavigationItemComponent_ng_template_6_li_2_a_1_mat_icon_1_Template, 1, 1, "mat-icon", 1);
+            i0__namespace.ɵɵtemplate(1, NavigationItemComponent_ng_template_7_li_2_a_1_mat_icon_1_Template, 1, 1, "mat-icon", 1);
             i0__namespace.ɵɵelementStart(2, "span", 6);
             i0__namespace.ɵɵtext(3);
             i0__namespace.ɵɵelementEnd();
@@ -1814,10 +1818,10 @@
             i0__namespace.ɵɵtextInterpolate(ctx_r7.asNavigationItem(child_r6).label);
         }
     }
-    function NavigationItemComponent_ng_template_6_li_2_Template(rf, ctx) {
+    function NavigationItemComponent_ng_template_7_li_2_Template(rf, ctx) {
         if (rf & 1) {
             i0__namespace.ɵɵelementStart(0, "li");
-            i0__namespace.ɵɵtemplate(1, NavigationItemComponent_ng_template_6_li_2_a_1_Template, 4, 3, "a", 10);
+            i0__namespace.ɵɵtemplate(1, NavigationItemComponent_ng_template_7_li_2_a_1_Template, 4, 3, "a", 10);
             i0__namespace.ɵɵelementEnd();
         }
         if (rf & 2) {
@@ -1827,13 +1831,13 @@
             i0__namespace.ɵɵproperty("ngIf", ctx_r5.isNavigationItem(child_r6));
         }
     }
-    function NavigationItemComponent_ng_template_6_Template(rf, ctx) {
+    function NavigationItemComponent_ng_template_7_Template(rf, ctx) {
         if (rf & 1) {
             var _r12_1 = i0__namespace.ɵɵgetCurrentView();
             i0__namespace.ɵɵelementStart(0, "div", 8);
-            i0__namespace.ɵɵlistener("mouseenter", function NavigationItemComponent_ng_template_6_Template_div_mouseenter_0_listener() { i0__namespace.ɵɵrestoreView(_r12_1); var ctx_r11 = i0__namespace.ɵɵnextContext(); return ctx_r11.lockeOverlay = true; })("mouseleave", function NavigationItemComponent_ng_template_6_Template_div_mouseleave_0_listener() { i0__namespace.ɵɵrestoreView(_r12_1); var ctx_r13 = i0__namespace.ɵɵnextContext(); ctx_r13.lockeOverlay = false; return ctx_r13.onMouseleave(); });
+            i0__namespace.ɵɵlistener("mouseenter", function NavigationItemComponent_ng_template_7_Template_div_mouseenter_0_listener() { i0__namespace.ɵɵrestoreView(_r12_1); var ctx_r11 = i0__namespace.ɵɵnextContext(); return ctx_r11.lockeOverlay = true; })("mouseleave", function NavigationItemComponent_ng_template_7_Template_div_mouseleave_0_listener() { i0__namespace.ɵɵrestoreView(_r12_1); var ctx_r13 = i0__namespace.ɵɵnextContext(); ctx_r13.lockeOverlay = false; return ctx_r13.onMouseleave(); });
             i0__namespace.ɵɵelementStart(1, "ul");
-            i0__namespace.ɵɵtemplate(2, NavigationItemComponent_ng_template_6_li_2_Template, 2, 1, "li", 9);
+            i0__namespace.ɵɵtemplate(2, NavigationItemComponent_ng_template_7_li_2_Template, 2, 1, "li", 9);
             i0__namespace.ɵɵelementEnd();
             i0__namespace.ɵɵelementEnd();
         }
@@ -1962,26 +1966,27 @@
             if (rf & 2) {
                 i0__namespace.ɵɵclassProp("active", ctx.isActive);
             }
-        }, inputs: { item: "item", level: "level" }, features: [i0__namespace.ɵɵNgOnChangesFeature], attrs: _c1$2, decls: 8, vars: 11, consts: [["routerLinkActive", "link-active", "matRipple", "", 3, "routerLink"], ["class", "icon", 3, "rxapIcon", 4, "ngIf"], [3, "ngIf"], ["rxap-navigation", "", "class", "sub-items", "fxFlex", "nogrow", 3, "items", "level", 4, "ngIf"], ["navigationOverlay", ""], [1, "icon", 3, "rxapIcon"], [1, "label"], ["rxap-navigation", "", "fxFlex", "nogrow", 1, "sub-items", 3, "items", "level"], [1, "navigation-overlay-container", "mat-elevation-z1", 3, "mouseenter", "mouseleave"], [4, "ngFor", "ngForOf"], ["class", "navigation-link mat-body-2 mat-body-strong", "matRipple", "", 3, "routerLink", 4, "ngIf"], ["matRipple", "", 1, "navigation-link", "mat-body-2", "mat-body-strong", 3, "routerLink"]], template: function NavigationItemComponent_Template(rf, ctx) {
+        }, inputs: { item: "item", level: "level" }, features: [i0__namespace.ɵɵNgOnChangesFeature], attrs: _c1$2, decls: 9, vars: 15, consts: [["routerLinkActive", "link-active", "matRipple", "", 3, "routerLink", "matTooltipDisabled", "matTooltip"], ["class", "icon", 3, "rxapIcon", 4, "ngIf"], [3, "ngIf"], ["rxap-navigation", "", "class", "sub-items", "fxFlex", "nogrow", 3, "items", "level", 4, "ngIf"], ["navigationOverlay", ""], [1, "icon", 3, "rxapIcon"], [1, "label"], ["rxap-navigation", "", "fxFlex", "nogrow", 1, "sub-items", 3, "items", "level"], [1, "navigation-overlay-container", "mat-elevation-z1", 3, "mouseenter", "mouseleave"], [4, "ngFor", "ngForOf"], ["class", "navigation-link mat-body-2 mat-body-strong", "matRipple", "", 3, "routerLink", 4, "ngIf"], ["matRipple", "", 1, "navigation-link", "mat-body-2", "mat-body-strong", 3, "routerLink"]], template: function NavigationItemComponent_Template(rf, ctx) {
             if (rf & 1) {
                 i0__namespace.ɵɵelementStart(0, "a", 0);
-                i0__namespace.ɵɵtemplate(1, NavigationItemComponent_mat_icon_1_Template, 1, 1, "mat-icon", 1);
-                i0__namespace.ɵɵtemplate(2, NavigationItemComponent_ng_template_2_Template, 2, 1, "ng-template", 2);
-                i0__namespace.ɵɵpipe(3, "async");
+                i0__namespace.ɵɵpipe(1, "async");
+                i0__namespace.ɵɵtemplate(2, NavigationItemComponent_mat_icon_2_Template, 1, 1, "mat-icon", 1);
+                i0__namespace.ɵɵtemplate(3, NavigationItemComponent_ng_template_3_Template, 2, 1, "ng-template", 2);
+                i0__namespace.ɵɵpipe(4, "async");
                 i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵtemplate(4, NavigationItemComponent_ul_4_Template, 1, 3, "ul", 3);
-                i0__namespace.ɵɵpipe(5, "async");
-                i0__namespace.ɵɵtemplate(6, NavigationItemComponent_ng_template_6_Template, 3, 1, "ng-template", null, 4, i0__namespace.ɵɵtemplateRefExtractor);
+                i0__namespace.ɵɵtemplate(5, NavigationItemComponent_ul_5_Template, 1, 3, "ul", 3);
+                i0__namespace.ɵɵpipe(6, "async");
+                i0__namespace.ɵɵtemplate(7, NavigationItemComponent_ng_template_7_Template, 3, 1, "ng-template", null, 4, i0__namespace.ɵɵtemplateRefExtractor);
             }
             if (rf & 2) {
                 i0__namespace.ɵɵclassMapInterpolate1("navigation-link mat-body-2 mat-body-strong navigation-level-", ctx.level, "");
-                i0__namespace.ɵɵproperty("routerLink", ctx.item.routerLink);
-                i0__namespace.ɵɵadvance(1);
+                i0__namespace.ɵɵproperty("routerLink", ctx.item.routerLink)("matTooltipDisabled", !i0__namespace.ɵɵpipeBind1(1, 9, ctx.sidenav.collapsed$))("matTooltip", ctx.item.label);
+                i0__namespace.ɵɵadvance(2);
                 i0__namespace.ɵɵproperty("ngIf", ctx.item.icon);
                 i0__namespace.ɵɵadvance(1);
-                i0__namespace.ɵɵproperty("ngIf", !i0__namespace.ɵɵpipeBind1(3, 7, ctx.sidenav.collapsed$));
+                i0__namespace.ɵɵproperty("ngIf", !i0__namespace.ɵɵpipeBind1(4, 11, ctx.sidenav.collapsed$));
                 i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵproperty("ngIf", ctx.routerLinkActive.isActive && !i0__namespace.ɵɵpipeBind1(5, 9, ctx.sidenav.collapsed$) && ctx.children);
+                i0__namespace.ɵɵproperty("ngIf", ctx.routerLinkActive.isActive && !i0__namespace.ɵɵpipeBind1(6, 13, ctx.sidenav.collapsed$) && ctx.children);
             }
         }, styles: [".navigation-overlay-container,.rxap-navigation-item{display:flex;flex-direction:column;min-height:48px}.navigation-overlay-container .navigation-link,.rxap-navigation-item .navigation-link{display:flex;flex-direction:row;align-items:center;text-decoration:none;height:48px}.navigation-overlay-container .navigation-link .icon,.rxap-navigation-item .navigation-link .icon{margin:0 16px}.navigation-overlay-container .navigation-link .label,.rxap-navigation-item .navigation-link .label{padding-right:12px}.navigation-overlay-container .navigation-link.navigation-level-1,.rxap-navigation-item .navigation-link.navigation-level-1{padding-left:52px}.navigation-overlay-container .navigation-link.navigation-level-1 .icon,.rxap-navigation-item .navigation-link.navigation-level-1 .icon{padding-left:0}.navigation-overlay-container .navigation-link.navigation-level-2,.rxap-navigation-item .navigation-link.navigation-level-2{padding-left:88px}.navigation-overlay-container .navigation-link.navigation-level-2 .icon,.rxap-navigation-item .navigation-link.navigation-level-2 .icon{padding-left:0}.navigation-overlay-container{padding:0 16px}.navigation-overlay-container ul{list-style-type:none;margin:0;padding:0}.navigation-overlay-container ul .navigation-link .label{padding-right:0}.navigation-overlay-container ul .navigation-link .icon{margin-left:0}"], encapsulation: 2, data: { animation: [
                 animations.trigger('sub-nav', [
@@ -2744,11 +2749,12 @@
                 flexLayout.FlexLayoutModule,
                 i1$4.RouterModule,
                 i2.CommonModule,
-                i5$1.IconDirectiveModule,
+                i6$1.IconDirectiveModule,
                 components.ButtonComponentModule,
                 i6.MatRippleModule,
                 i2$5.MatDividerModule,
                 i3$5.StopPropagationDirectiveModule,
+                i3$6.MatTooltipModule
             ]] });
     (function () {
         (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(NavigationComponentModule, [{
@@ -2761,11 +2767,12 @@
                             flexLayout.FlexLayoutModule,
                             i1$4.RouterModule,
                             i2.CommonModule,
-                            i5$1.IconDirectiveModule,
+                            i6$1.IconDirectiveModule,
                             components.ButtonComponentModule,
                             i6.MatRippleModule,
                             i2$5.MatDividerModule,
                             i3$5.StopPropagationDirectiveModule,
+                            i3$6.MatTooltipModule
                         ],
                         exports: [NavigationComponent]
                     }]
@@ -2777,13 +2784,14 @@
                 flexLayout.FlexLayoutModule,
                 i1$4.RouterModule,
                 i2.CommonModule,
-                i5$1.IconDirectiveModule,
+                i6$1.IconDirectiveModule,
                 components.ButtonComponentModule,
                 i6.MatRippleModule,
                 i2$5.MatDividerModule,
-                i3$5.StopPropagationDirectiveModule], exports: [NavigationComponent] });
+                i3$5.StopPropagationDirectiveModule,
+                i3$6.MatTooltipModule], exports: [NavigationComponent] });
     })();
-    i0__namespace.ɵɵsetComponentScope(NavigationItemComponent, [i1__namespace$4.RouterLinkWithHref, i1__namespace$4.RouterLinkActive, i6__namespace.MatRipple, i2__namespace.NgIf, i3__namespace$3.MatIcon, i5__namespace$1.IconDirective, NavigationComponent, i1__namespace$3.DefaultFlexDirective, i2__namespace.NgForOf], [i2__namespace.AsyncPipe]);
+    i0__namespace.ɵɵsetComponentScope(NavigationItemComponent, [i1__namespace$4.RouterLinkWithHref, i1__namespace$4.RouterLinkActive, i6__namespace.MatRipple, i3__namespace$6.MatTooltip, i2__namespace.NgIf, i3__namespace$3.MatIcon, i6__namespace$1.IconDirective, NavigationComponent, i1__namespace$3.DefaultFlexDirective, i2__namespace.NgForOf], [i2__namespace.AsyncPipe]);
 
     var SidenavModule = /** @class */ (function () {
         function SidenavModule() {