@theseam/ui-common 0.3.12-beta.0 → 0.3.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/theseam-ui-common-framework.umd.js +47 -899
- package/bundles/theseam-ui-common-framework.umd.js.map +1 -1
- package/bundles/theseam-ui-common-layout.umd.js +5 -14
- package/bundles/theseam-ui-common-layout.umd.js.map +1 -1
- package/bundles/theseam-ui-common-menu.umd.js +0 -4
- package/bundles/theseam-ui-common-menu.umd.js.map +1 -1
- package/esm2015/framework/base-layout/base-layout.component.js +4 -12
- package/esm2015/framework/base-layout/base-layout.module.js +1 -4
- package/esm2015/framework/base-layout/directives/base-layout-nav-toggle.directive.js +3 -17
- package/esm2015/framework/public-api.js +1 -2
- package/esm2015/framework/side-nav/side-nav-item/side-nav-item.component.js +5 -11
- package/esm2015/framework/side-nav/side-nav-toggle/side-nav-toggle.component.js +5 -5
- package/esm2015/framework/side-nav/side-nav.component.js +18 -67
- package/esm2015/framework/side-nav/side-nav.service.js +1 -1
- package/esm2015/framework/theseam-ui-common-framework.js +9 -13
- package/esm2015/framework/top-bar/top-bar-item.directive.js +2 -9
- package/esm2015/framework/top-bar/top-bar-menu-button/top-bar-menu-button.component.js +3 -4
- package/esm2015/framework/top-bar/top-bar.component.js +7 -44
- package/esm2015/framework/top-bar/top-bar.module.js +3 -9
- package/esm2015/layout/layout.service.js +2 -12
- package/esm2015/menu/menu-toggle.directive.js +2 -6
- package/fesm2015/theseam-ui-common-framework.js +41 -730
- package/fesm2015/theseam-ui-common-framework.js.map +1 -1
- package/fesm2015/theseam-ui-common-layout.js +2 -11
- package/fesm2015/theseam-ui-common-layout.js.map +1 -1
- package/fesm2015/theseam-ui-common-menu.js +1 -5
- package/fesm2015/theseam-ui-common-menu.js.map +1 -1
- package/framework/base-layout/base-layout.component.d.ts +1 -3
- package/framework/base-layout/base-layout.component.scss +10 -18
- package/framework/base-layout/directives/base-layout-nav-toggle.directive.d.ts +2 -7
- package/framework/base-layout/styles/_variables.scss +0 -21
- package/framework/public-api.d.ts +0 -1
- package/framework/side-nav/side-nav-item/side-nav-item.component.d.ts +0 -2
- package/framework/side-nav/side-nav-item/side-nav-item.component.scss +5 -7
- package/framework/side-nav/side-nav-toggle/side-nav-toggle.component.d.ts +2 -4
- package/framework/side-nav/side-nav-toggle/side-nav-toggle.component.scss +6 -3
- package/framework/side-nav/side-nav.component.d.ts +1 -13
- package/framework/side-nav/side-nav.component.scss +1 -0
- package/framework/side-nav/styles/_themes/light/_variables.scss +14 -24
- package/framework/side-nav/styles/_themes/primary/_variables.scss +0 -8
- package/framework/theseam-ui-common-framework.d.ts +8 -12
- package/framework/theseam-ui-common-framework.metadata.json +1 -1
- package/framework/top-bar/top-bar-item.directive.d.ts +0 -3
- package/framework/top-bar/top-bar-menu-button/top-bar-menu-button.component.d.ts +1 -4
- package/framework/top-bar/top-bar.component.d.ts +3 -25
- package/framework/top-bar/top-bar.component.scss +2 -7
- package/layout/layout.service.d.ts +1 -9
- package/layout/theseam-ui-common-layout.metadata.json +1 -1
- package/menu/menu-toggle.directive.d.ts +1 -2
- package/menu/theseam-ui-common-menu.metadata.json +1 -1
- package/package.json +1 -1
- package/esm2015/framework/base-layout/directives/base-layout-side-bar-header.directive.js +0 -15
- package/esm2015/framework/nav/horizontal-nav/horizontal-nav.component.js +0 -68
- package/esm2015/framework/nav/index.js +0 -6
- package/esm2015/framework/nav/nav-item/nav-item.component.js +0 -169
- package/esm2015/framework/nav/nav-utils.js +0 -105
- package/esm2015/framework/nav/nav.models.js +0 -2
- package/esm2015/framework/nav/nav.module.js +0 -42
- package/esm2015/framework/nav/nav.service.js +0 -175
- package/esm2015/framework/top-bar/top-bar-compact-menu-btn-detail.directive.js +0 -15
- package/esm2015/framework/top-bar/top-bar-nav-toggle-btn-detail.directive.js +0 -15
- package/framework/base-layout/directives/base-layout-side-bar-header.directive.d.ts +0 -6
- package/framework/nav/horizontal-nav/horizontal-nav.component.d.ts +0 -31
- package/framework/nav/index.d.ts +0 -5
- package/framework/nav/nav-item/nav-item.component.d.ts +0 -67
- package/framework/nav/nav-utils.d.ts +0 -19
- package/framework/nav/nav.models.d.ts +0 -76
- package/framework/nav/nav.module.d.ts +0 -2
- package/framework/nav/nav.service.d.ts +0 -21
- package/framework/top-bar/top-bar-compact-menu-btn-detail.directive.d.ts +0 -5
- package/framework/top-bar/top-bar-nav-toggle-btn-detail.directive.d.ts +0 -5
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('
|
|
3
|
-
typeof define === 'function' && define.amd ? define('@theseam/ui-common/framework', ['exports', '@angular/core', '
|
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.theseam = global.theseam || {}, global.theseam["ui-common"] = global.theseam["ui-common"] || {}, global.theseam["ui-common"].framework = {}), global.ng.core, global.
|
|
5
|
-
})(this, (function (exports, i0,
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/cdk/portal'), require('rxjs'), require('@fortawesome/free-solid-svg-icons'), require('@theseam/ui-common/layout'), require('@angular/common'), require('@theseam/ui-common/buttons'), require('@theseam/ui-common/icon'), require('@theseam/ui-common/scrollbar'), require('rxjs/operators'), require('@angular/cdk/coercion'), require('@angular/cdk/drag-drop'), require('@theseam/ui-common/core'), require('@theseam/ui-common/widget'), require('@theseam/ui-common/dynamic-component-loader'), require('@theseam/ui-common/utils'), require('@theseam/ui-common/shared'), require('@angular/animations'), require('@angular/router'), require('@angular/cdk/a11y'), require('@ng-bootstrap/ng-bootstrap'), require('@theseam/ui-common/menu'), require('@fortawesome/free-regular-svg-icons'), require('@ajsf/core'), require('@angular/forms'), require('@ng-select/ng-select'), require('@theseam/ui-common/checkbox'), require('@theseam/ui-common/form-field')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define('@theseam/ui-common/framework', ['exports', '@angular/core', '@angular/cdk/portal', 'rxjs', '@fortawesome/free-solid-svg-icons', '@theseam/ui-common/layout', '@angular/common', '@theseam/ui-common/buttons', '@theseam/ui-common/icon', '@theseam/ui-common/scrollbar', 'rxjs/operators', '@angular/cdk/coercion', '@angular/cdk/drag-drop', '@theseam/ui-common/core', '@theseam/ui-common/widget', '@theseam/ui-common/dynamic-component-loader', '@theseam/ui-common/utils', '@theseam/ui-common/shared', '@angular/animations', '@angular/router', '@angular/cdk/a11y', '@ng-bootstrap/ng-bootstrap', '@theseam/ui-common/menu', '@fortawesome/free-regular-svg-icons', '@ajsf/core', '@angular/forms', '@ng-select/ng-select', '@theseam/ui-common/checkbox', '@theseam/ui-common/form-field'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.theseam = global.theseam || {}, global.theseam["ui-common"] = global.theseam["ui-common"] || {}, global.theseam["ui-common"].framework = {}), global.ng.core, global.ng.cdk.portal, global.rxjs, global.freeSolidSvgIcons, global.theseam["ui-common"].layout, global.ng.common, global.theseam["ui-common"].buttons, global.theseam["ui-common"].icon, global.theseam["ui-common"].scrollbar, global.rxjs.operators, global.ng.cdk.coercion, global.ng.cdk.dragDrop, global.theseam["ui-common"].core, global.theseam["ui-common"].widget, global.theseam["ui-common"]["dynamic-component-loader"], global.theseam["ui-common"].utils, global.theseam["ui-common"].shared, global.ng.animations, global.ng.router, global.ng.cdk.a11y, global.ngBootstrap, global.theseam["ui-common"].menu, global.freeRegularSvgIcons, global.core$1, global.ng.forms, global.ngSelect, global.theseam["ui-common"].checkbox, global.theseam["ui-common"]["form-field"]));
|
|
5
|
+
})(this, (function (exports, i0, portal, rxjs, freeSolidSvgIcons, layout, common, buttons, icon, scrollbar, operators, coercion, dragDrop, core, widget, i1, utils, shared, animations, router, a11y, ngBootstrap, menu, freeRegularSvgIcons, core$1, forms, ngSelect, checkbox, formField) { 'use strict';
|
|
6
6
|
|
|
7
7
|
function _interopNamespace(e) {
|
|
8
8
|
if (e && e.__esModule) return e;
|
|
@@ -76,13 +76,10 @@
|
|
|
76
76
|
* Can be used to toggle the expand state of the registered nav.
|
|
77
77
|
*/
|
|
78
78
|
var BaseLayoutNavToggleDirective = /** @class */ (function () {
|
|
79
|
-
function BaseLayoutNavToggleDirective(
|
|
80
|
-
this._cdr = _cdr;
|
|
79
|
+
function BaseLayoutNavToggleDirective(_baseLayout) {
|
|
81
80
|
this.type = 'button';
|
|
82
81
|
/** Screenreader label for the button. */
|
|
83
82
|
this.ariaLabel = 'Navigation toggle';
|
|
84
|
-
this._toggleClass = true;
|
|
85
|
-
this._expandedClass = false;
|
|
86
83
|
this.baseLayout = _baseLayout;
|
|
87
84
|
}
|
|
88
85
|
Object.defineProperty(BaseLayoutNavToggleDirective.prototype, "_attrType", {
|
|
@@ -100,14 +97,6 @@
|
|
|
100
97
|
this.baseLayout.registeredNav.toggle();
|
|
101
98
|
}
|
|
102
99
|
};
|
|
103
|
-
BaseLayoutNavToggleDirective.prototype.ngOnInit = function () {
|
|
104
|
-
var _this = this;
|
|
105
|
-
var _a, _b;
|
|
106
|
-
(_b = (_a = this.baseLayout) === null || _a === void 0 ? void 0 : _a.registeredNav) === null || _b === void 0 ? void 0 : _b.expanded$.pipe(operators.tap(function (exp) {
|
|
107
|
-
_this._expandedClass = exp;
|
|
108
|
-
_this._cdr.markForCheck();
|
|
109
|
-
})).subscribe();
|
|
110
|
-
};
|
|
111
100
|
return BaseLayoutNavToggleDirective;
|
|
112
101
|
}());
|
|
113
102
|
BaseLayoutNavToggleDirective.decorators = [
|
|
@@ -117,7 +106,6 @@
|
|
|
117
106
|
},] }
|
|
118
107
|
];
|
|
119
108
|
BaseLayoutNavToggleDirective.ctorParameters = function () { return [
|
|
120
|
-
{ type: i0.ChangeDetectorRef },
|
|
121
109
|
{ type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [THESEAM_BASE_LAYOUT_REF,] }] }
|
|
122
110
|
]; };
|
|
123
111
|
BaseLayoutNavToggleDirective.propDecorators = {
|
|
@@ -125,8 +113,6 @@
|
|
|
125
113
|
type: [{ type: i0.Input }],
|
|
126
114
|
_attrAriaLabel: [{ type: i0.HostBinding, args: ['attr.aria-label',] }],
|
|
127
115
|
ariaLabel: [{ type: i0.Input, args: ['aria-label',] }],
|
|
128
|
-
_toggleClass: [{ type: i0.HostBinding, args: ['class.base-layout-nav-toggle',] }],
|
|
129
|
-
_expandedClass: [{ type: i0.HostBinding, args: ['class.base-layout-nav-toggle--expanded',] }],
|
|
130
116
|
_onClick: [{ type: i0.HostListener, args: ['click',] }]
|
|
131
117
|
};
|
|
132
118
|
|
|
@@ -173,7 +159,6 @@
|
|
|
173
159
|
this.faAngleDoubleRight = freeSolidSvgIcons.faAngleDoubleRight;
|
|
174
160
|
this.faAngleDoubleLeft = freeSolidSvgIcons.faAngleDoubleLeft;
|
|
175
161
|
this.overlayNav = false;
|
|
176
|
-
this.showSidebar = true;
|
|
177
162
|
this._hasSideBar = new rxjs.BehaviorSubject(false);
|
|
178
163
|
this._registeredNav = new rxjs.BehaviorSubject(undefined);
|
|
179
164
|
this.registeredNav$ = this._registeredNav.asObservable();
|
|
@@ -193,17 +178,12 @@
|
|
|
193
178
|
configurable: true
|
|
194
179
|
});
|
|
195
180
|
TheSeamBaseLayoutComponent.prototype.ngOnInit = function () {
|
|
196
|
-
if (this.mobileBreakpoint) {
|
|
197
|
-
this._layout.setMobileBreakpoint(this.mobileBreakpoint);
|
|
198
|
-
}
|
|
199
181
|
if (this._topBarTpl) {
|
|
200
182
|
this._topBarPortal = new portal.TemplatePortal(this._topBarTpl, this._viewContainerRef);
|
|
201
183
|
}
|
|
202
184
|
if (this._sideBarTpl) {
|
|
203
185
|
this._sideBarPortal = new portal.TemplatePortal(this._sideBarTpl, this._viewContainerRef);
|
|
204
|
-
|
|
205
|
-
this._hasSideBar.next(true);
|
|
206
|
-
}
|
|
186
|
+
this._hasSideBar.next(true);
|
|
207
187
|
}
|
|
208
188
|
if (this._contentTpl) {
|
|
209
189
|
this._contentPortal = new portal.TemplatePortal(this._contentTpl, this._viewContainerRef);
|
|
@@ -261,11 +241,11 @@
|
|
|
261
241
|
TheSeamBaseLayoutComponent.decorators = [
|
|
262
242
|
{ type: i0.Component, args: [{
|
|
263
243
|
selector: 'seam-base-layout',
|
|
264
|
-
template: "<div class=\"base-layout-side-bar-nav-content-mobile\" *ngIf=\"isMobile$ | async\">\n <ng-template [cdkPortalOutlet]=\"_sideBarPortal\"></ng-template>\n</div>\n\n<div class=\"base-layout-top-bar-container\">\n <ng-template [cdkPortalOutlet]=\"_topBarPortal\"></ng-template>\n</div>\n<div class=\"base-layout-main-container\">\n <div *ngIf=\"hasSideBar$ | async\"\n class=\"base-layout-side-bar-container\">\n <div class=\"base-layout-side-bar-nav-content\" *ngIf=\"!(isMobile$ | async)\">\n <ng-template [cdkPortalOutlet]=\"_sideBarPortal\"></ng-template>\n </div>\n </div>\n <div class=\"base-layout-content-container\">\n <div class=\"base-layout-content-container-header d-flex flex-row\">\n
|
|
244
|
+
template: "<div class=\"base-layout-side-bar-nav-content-mobile\" *ngIf=\"isMobile$ | async\">\n <ng-template [cdkPortalOutlet]=\"_sideBarPortal\"></ng-template>\n</div>\n\n<div class=\"base-layout-top-bar-container\">\n <ng-template [cdkPortalOutlet]=\"_topBarPortal\"></ng-template>\n</div>\n<div class=\"base-layout-main-container\">\n <div *ngIf=\"hasSideBar$ | async\"\n class=\"base-layout-side-bar-container\">\n <div class=\"base-layout-side-bar-nav-content\" *ngIf=\"!(isMobile$ | async)\">\n <ng-template [cdkPortalOutlet]=\"_sideBarPortal\"></ng-template>\n </div>\n </div>\n <div class=\"base-layout-content-container\">\n <div class=\"base-layout-content-container-header\">\n <!-- <ng-template [cdkPortalOutlet]=\"_contentHeaderPortal\"></ng-template> -->\n\n <div class=\"d-flex d-flex-row\">\n <div class=\"flex-grow-1\">\n <ng-template [cdkPortalOutlet]=\"_contentHeaderPortal\"></ng-template>\n </div>\n <div class=\"d-flex\">\n <ng-container *ngFor=\"let action of registeredActions$ | async; first as isFirst\">\n <div>\n <ng-container [ngTemplateOutlet]=\"$any(action)?.template\"></ng-container>\n </div>\n </ng-container>\n </div>\n </div>\n\n\n </div>\n <div class=\"base-layout-content-container-inner\" seamOverlayScrollbar>\n <ng-template [cdkPortalOutlet]=\"_contentPortal\"></ng-template>\n </div>\n <div class=\"base-layout-content-container-footer\">\n <ng-template [cdkPortalOutlet]=\"_contentFooterPortal\"></ng-template>\n </div>\n </div>\n</div>\n",
|
|
265
245
|
providers: [THE_SEAM_BASE_LAYOUT],
|
|
266
246
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
267
247
|
encapsulation: i0.ViewEncapsulation.None,
|
|
268
|
-
styles: ["seam-base-layout{display:flex;flex-direction:column;height:100%;width:100%}seam-base-layout .base-layout-side-bar-nav-content-mobile{position:absolute;top:0;bottom:0;left:0;z-index:
|
|
248
|
+
styles: ["seam-base-layout{display:flex;flex-direction:column;height:100%;width:100%}seam-base-layout .base-layout-side-bar-nav-content-mobile{position:absolute;top:0;bottom:0;left:0;float:left;z-index:9999}seam-base-layout .base-layout-side-bar-container{flex:0 0 auto;display:flex;flex-direction:column;border-top:none;border-right:1px solid #dee2e6;border-bottom:none;border-left:none}seam-base-layout .base-layout-side-bar-container .base-layout-side-bar-nav-content{flex:1 1 0}seam-base-layout .base-layout-main-container{flex:1 1 100%;display:flex;flex-direction:row;transform:translateZ(0)}seam-base-layout .base-layout-top-bar-container{flex:0 0 auto;border-top:none;border-right:none;border-bottom:1px solid #dee2e6;border-left:none}seam-base-layout .base-layout-content-container{flex:1 1 auto;display:flex;flex-direction:column}seam-base-layout .base-layout-content-container .base-layout-content-container-header{flex:0 0 auto}seam-base-layout .base-layout-content-container .base-layout-content-container-inner{flex:1 1 auto}seam-base-layout .base-layout-content-container .base-layout-content-container-footer{flex:0 0 auto}seam-base-layout .base-layout-content-container-header{margin:.25rem;padding:0;background:none;border-radius:0;overflow:hidden}seam-base-layout .btn-baselayout-action{margin:0 0 0 .25rem;color:#212529;background-color:#e9ecef;border-color:#e9ecef;padding:.5rem 1rem;font-size:1rem;line-height:1.5;border-radius:.25rem;border:none;color:#6c757d}seam-base-layout .btn-baselayout-action:hover{color:#212529;background-color:#d3d9df;border-color:#cbd3da}seam-base-layout .btn-baselayout-action:focus,seam-base-layout .btn-baselayout-action.focus{color:#212529;background-color:#d3d9df;border-color:#cbd3da;box-shadow:0 0 0 .2rem #cbced180}seam-base-layout .btn-baselayout-action.disabled,seam-base-layout .btn-baselayout-action:disabled{color:#212529;background-color:#e9ecef;border-color:#e9ecef}seam-base-layout .btn-baselayout-action:not(:disabled):not(.disabled):active,seam-base-layout .btn-baselayout-action:not(:disabled):not(.disabled).active,.show>seam-base-layout .btn-baselayout-action.dropdown-toggle{color:#212529;background-color:#d3d9df;border-color:#c4ccd4}seam-base-layout .btn-baselayout-action:not(:disabled):not(.disabled):active:focus,seam-base-layout .btn-baselayout-action:not(:disabled):not(.disabled).active:focus,.show>seam-base-layout .btn-baselayout-action.dropdown-toggle:focus{box-shadow:0 0 0 .2rem #cbced180}seam-base-layout .btn-baselayout-action:hover{color:#6c757d}seam-base-layout .btn-baselayout-action:focus,seam-base-layout .btn-baselayout-action.focus{color:#6c757d}\n"]
|
|
269
249
|
},] }
|
|
270
250
|
];
|
|
271
251
|
TheSeamBaseLayoutComponent.ctorParameters = function () { return [
|
|
@@ -274,8 +254,6 @@
|
|
|
274
254
|
]; };
|
|
275
255
|
TheSeamBaseLayoutComponent.propDecorators = {
|
|
276
256
|
overlayNav: [{ type: i0.Input }],
|
|
277
|
-
mobileBreakpoint: [{ type: i0.Input }],
|
|
278
|
-
showSidebar: [{ type: i0.Input }],
|
|
279
257
|
_topBarTpl: [{ type: i0.ContentChild, args: [BaseLayoutTopBarDirective, { static: true, read: i0.TemplateRef },] }],
|
|
280
258
|
_sideBarTpl: [{ type: i0.ContentChild, args: [BaseLayoutSideBarDirective, { static: true, read: i0.TemplateRef },] }],
|
|
281
259
|
_contentTpl: [{ type: i0.ContentChild, args: [BaseLayoutContentDirective, { static: true, read: i0.TemplateRef },] }],
|
|
@@ -298,21 +276,6 @@
|
|
|
298
276
|
{ type: i0.ElementRef }
|
|
299
277
|
]; };
|
|
300
278
|
|
|
301
|
-
var BaseLayoutSideBarHeaderDirective = /** @class */ (function () {
|
|
302
|
-
function BaseLayoutSideBarHeaderDirective(_elementRef) {
|
|
303
|
-
this._elementRef = _elementRef;
|
|
304
|
-
}
|
|
305
|
-
return BaseLayoutSideBarHeaderDirective;
|
|
306
|
-
}());
|
|
307
|
-
BaseLayoutSideBarHeaderDirective.decorators = [
|
|
308
|
-
{ type: i0.Directive, args: [{
|
|
309
|
-
selector: '[seamBaseLayoutSideBarHeader]'
|
|
310
|
-
},] }
|
|
311
|
-
];
|
|
312
|
-
BaseLayoutSideBarHeaderDirective.ctorParameters = function () { return [
|
|
313
|
-
{ type: i0.ElementRef }
|
|
314
|
-
]; };
|
|
315
|
-
|
|
316
279
|
var TheSeamBaseLayoutModule = /** @class */ (function () {
|
|
317
280
|
function TheSeamBaseLayoutModule() {
|
|
318
281
|
}
|
|
@@ -325,7 +288,6 @@
|
|
|
325
288
|
BaseLayoutContentDirective,
|
|
326
289
|
BaseLayoutSideBarDirective,
|
|
327
290
|
BaseLayoutSideBarFooterDirective,
|
|
328
|
-
BaseLayoutSideBarHeaderDirective,
|
|
329
291
|
BaseLayoutTopBarDirective,
|
|
330
292
|
BaseLayoutNavToggleDirective,
|
|
331
293
|
BaseLayoutContentHeaderDirective,
|
|
@@ -343,7 +305,6 @@
|
|
|
343
305
|
BaseLayoutContentDirective,
|
|
344
306
|
BaseLayoutSideBarDirective,
|
|
345
307
|
BaseLayoutSideBarFooterDirective,
|
|
346
|
-
BaseLayoutSideBarHeaderDirective,
|
|
347
308
|
BaseLayoutTopBarDirective,
|
|
348
309
|
BaseLayoutNavToggleDirective,
|
|
349
310
|
BaseLayoutContentHeaderDirective,
|
|
@@ -1813,20 +1774,14 @@
|
|
|
1813
1774
|
this._sideNav = _sideNav;
|
|
1814
1775
|
this._baseLayoutRef = _baseLayoutRef;
|
|
1815
1776
|
this._ngUnsubscribe = new rxjs.Subject();
|
|
1816
|
-
this.faBars = freeSolidSvgIcons.faBars;
|
|
1817
1777
|
// @HostBinding('@sideNavExpand') _sideNavExpand = EXPANDED_STATE
|
|
1818
1778
|
// _sideNavExpand = EXPANDED_STATE
|
|
1819
1779
|
// @HostBinding('@sideNavAnim') _sideNavExpand = EXPANDED_STATE
|
|
1820
1780
|
this._sideNavExpand = 'initial';
|
|
1821
1781
|
this.hasHeaderToggle = true;
|
|
1822
|
-
this.toggleIcon = freeSolidSvgIcons.faBars;
|
|
1823
1782
|
this._items = new rxjs.BehaviorSubject([]);
|
|
1824
|
-
this.indentSize = 10;
|
|
1825
1783
|
this._expanded = new rxjs.BehaviorSubject(true);
|
|
1826
1784
|
this.expanded$ = this._expanded.asObservable();
|
|
1827
|
-
this.expandOrigin = 'left';
|
|
1828
|
-
this.expandHeight = '100%';
|
|
1829
|
-
this.expandWidth = 'calc(100vw - 50px)';
|
|
1830
1785
|
this._overlay = new rxjs.BehaviorSubject(false);
|
|
1831
1786
|
this.overlay$ = this._overlay.asObservable();
|
|
1832
1787
|
this.toggleExpand = new i0.EventEmitter();
|
|
@@ -1876,9 +1831,6 @@
|
|
|
1876
1831
|
this.sideNavExpandedState$
|
|
1877
1832
|
.pipe(operators.takeUntil(this._ngUnsubscribe))
|
|
1878
1833
|
.subscribe(function (v) { return _this._sideNavExpand = v; });
|
|
1879
|
-
if (this._sideBarHeaderTpl) {
|
|
1880
|
-
this._sideBarHeaderPortal = new portal.TemplatePortal(this._sideBarHeaderTpl, this._viewContainerRef);
|
|
1881
|
-
}
|
|
1882
1834
|
if (this._sideBarFooterTpl) {
|
|
1883
1835
|
this._sideBarFooterPortal = new portal.TemplatePortal(this._sideBarFooterTpl, this._viewContainerRef);
|
|
1884
1836
|
}
|
|
@@ -1909,33 +1861,12 @@
|
|
|
1909
1861
|
this._backdropHidden.next(true);
|
|
1910
1862
|
}
|
|
1911
1863
|
};
|
|
1912
|
-
Object.defineProperty(SideNavComponent.prototype, "expandOriginTransform", {
|
|
1913
|
-
get: function () {
|
|
1914
|
-
switch (this.expandOrigin) {
|
|
1915
|
-
case 'right':
|
|
1916
|
-
return this._sideNavExpand === EXPANDED_OVERLAY_STATE ? 'translateX(100vw) translateX(-100%)' :
|
|
1917
|
-
this._sideNavExpand === COLLAPSED_OVERLAY_STATE ? 'translateX(100vw)' : null;
|
|
1918
|
-
case 'top':
|
|
1919
|
-
return this._sideNavExpand === EXPANDED_OVERLAY_STATE ? 'translateY(0)' :
|
|
1920
|
-
this._sideNavExpand === COLLAPSED_OVERLAY_STATE ? 'translateY(-100%)' : null;
|
|
1921
|
-
case 'bottom':
|
|
1922
|
-
return this._sideNavExpand === EXPANDED_OVERLAY_STATE ? 'translateY(100vh) translateY(-100%)' :
|
|
1923
|
-
this._sideNavExpand === COLLAPSED_OVERLAY_STATE ? 'translateY(100vh)' : null;
|
|
1924
|
-
case 'left':
|
|
1925
|
-
default:
|
|
1926
|
-
return this._sideNavExpand === EXPANDED_OVERLAY_STATE ? 'translateX(0)' :
|
|
1927
|
-
this._sideNavExpand === COLLAPSED_OVERLAY_STATE ? 'translateX(-100%)' : null;
|
|
1928
|
-
}
|
|
1929
|
-
},
|
|
1930
|
-
enumerable: false,
|
|
1931
|
-
configurable: true
|
|
1932
|
-
});
|
|
1933
1864
|
return SideNavComponent;
|
|
1934
1865
|
}());
|
|
1935
1866
|
SideNavComponent.decorators = [
|
|
1936
1867
|
{ type: i0.Component, args: [{
|
|
1937
1868
|
selector: 'seam-side-nav',
|
|
1938
|
-
template: "<div class=\"side-nav-backdrop\" *ngIf=\"isMobile$ | async\"\n [@sideNavBackdrop]=\"_sideNavExpand\"\n [class.side-nav-backdrop-hidden]=\"_backdropHidden | async\"
|
|
1869
|
+
template: "<div class=\"side-nav-backdrop\" *ngIf=\"isMobile$ | async\"\n [@sideNavBackdrop]=\"_sideNavExpand\"\n [class.side-nav-backdrop-hidden]=\"_backdropHidden | async\"></div>\n\n<div class=\"side-nav-inner-wrapper\" [@sideNavExpand]=\"_sideNavExpand\"\n (@sideNavExpand.start)=\"animateStart()\"\n (@sideNavExpand.done)=\"animateEnd()\">\n <nav class=\"nav side-nav-content\">\n <seam-side-nav-toggle *ngIf=\"hasHeaderToggle\"\n [expanded]=\"expanded$ | async\"\n (toggleExpand)=\"toggle()\">\n </seam-side-nav-toggle>\n <div class=\"side-nav-items-container\" seamOverlayScrollbar>\n <seam-side-nav-item *ngFor=\"let item of items$ | async\"\n [compact]=\"!(expanded$ | async)\"\n [itemType]=\"$any(item)?.itemType\"\n [icon]=\"$any(item)?.icon\"\n [label]=\"$any(item)?.label\"\n [link]=\"$any(item)?.link\"\n [badgeText]=\"$any(item)?.badge?.text\"\n [badgeTheme]=\"$any(item)?.badge?.theme || 'danger'\"\n [badgeSrContent]=\"$any(item)?.badge?.srContent\"\n [badgeTooltip]=\"$any(item)?.badge?.tooltip\"\n [queryParams]=\"$any(item)?.queryParams\"\n [children]=\"$any(item)?.children\"\n [active]=\"$any(item).__state.active\"\n [expanded]=\"$any(item).__state.expanded\">\n </seam-side-nav-item>\n </div>\n <ng-template [cdkPortalOutlet]=\"_sideBarFooterPortal\"></ng-template>\n </nav>\n</div>\n",
|
|
1939
1870
|
providers: [
|
|
1940
1871
|
TheSeamSideNavService
|
|
1941
1872
|
],
|
|
@@ -1962,42 +1893,32 @@
|
|
|
1962
1893
|
animations.transition(sideNavExpandStateChangeFn, animations.animate('0.2s ease-in-out')),
|
|
1963
1894
|
]),
|
|
1964
1895
|
animations.trigger('sideNavExpand', [
|
|
1965
|
-
// TODO: Make width configurable
|
|
1896
|
+
// TODO: Make width configurable.
|
|
1966
1897
|
animations.state(EXPANDED_STATE$1, animations.style({ width: '260px' })),
|
|
1967
1898
|
animations.state(COLLAPSED_STATE$1, animations.style({ width: '50px', 'overflow-x': 'hidden' })),
|
|
1968
1899
|
animations.state(EXPANDED_OVERLAY_STATE, animations.style({
|
|
1969
1900
|
position: 'absolute',
|
|
1970
1901
|
top: 0,
|
|
1902
|
+
height: '100%',
|
|
1971
1903
|
bottom: 0,
|
|
1972
1904
|
left: 0,
|
|
1973
|
-
|
|
1974
|
-
width: '{{ width }}',
|
|
1975
|
-
transform: '{{ origin }}',
|
|
1905
|
+
float: 'left',
|
|
1976
1906
|
zIndex: '9999',
|
|
1977
|
-
|
|
1978
|
-
|
|
1979
|
-
|
|
1980
|
-
height: '100%',
|
|
1981
|
-
width: 'calc(100vw - 50px)',
|
|
1982
|
-
}
|
|
1983
|
-
}),
|
|
1907
|
+
width: 'calc(100vw - 50px)',
|
|
1908
|
+
transform: 'translateX(0)'
|
|
1909
|
+
})),
|
|
1984
1910
|
animations.state(COLLAPSED_OVERLAY_STATE, animations.style({
|
|
1985
1911
|
position: 'absolute',
|
|
1986
1912
|
top: 0,
|
|
1913
|
+
height: '100%',
|
|
1987
1914
|
bottom: 0,
|
|
1988
1915
|
left: 0,
|
|
1989
|
-
|
|
1990
|
-
width: '{{ width }}',
|
|
1991
|
-
transform: '{{ origin }}',
|
|
1992
|
-
'overflow-x': 'hidden',
|
|
1916
|
+
float: 'left',
|
|
1993
1917
|
zIndex: '9999',
|
|
1994
|
-
|
|
1995
|
-
|
|
1996
|
-
|
|
1997
|
-
|
|
1998
|
-
width: 'calc(100vw - 50px)',
|
|
1999
|
-
}
|
|
2000
|
-
}),
|
|
1918
|
+
width: 'calc(100vw - 50px)',
|
|
1919
|
+
transform: 'translateX(calc(-100vw + 50px))',
|
|
1920
|
+
'overflow-x': 'hidden'
|
|
1921
|
+
})),
|
|
2001
1922
|
// transition(`${EXPANDED_STATE} <=> ${COLLAPSED_STATE}`, animate('0.2s ease-in-out')),
|
|
2002
1923
|
animations.transition(sideNavExpandStateChangeFn, animations.animate('0.2s ease-in-out')),
|
|
2003
1924
|
// transition(`${EXPANDED_STATE} <=> ${COLLAPSED_STATE}`, [
|
|
@@ -2026,26 +1947,15 @@
|
|
|
2026
1947
|
SideNavComponent.propDecorators = {
|
|
2027
1948
|
_sideNavExpand: [{ type: i0.HostBinding, args: ['@sideNavAnim',] }],
|
|
2028
1949
|
hasHeaderToggle: [{ type: i0.Input }],
|
|
2029
|
-
toggleIcon: [{ type: i0.Input }],
|
|
2030
|
-
toggleTpl: [{ type: i0.Input }],
|
|
2031
1950
|
items: [{ type: i0.Input }],
|
|
2032
|
-
hideEmptyIcon: [{ type: i0.Input }],
|
|
2033
|
-
indentSize: [{ type: i0.Input }],
|
|
2034
1951
|
expanded: [{ type: i0.Input }],
|
|
2035
|
-
expandOrigin: [{ type: i0.Input }],
|
|
2036
|
-
expandHeight: [{ type: i0.Input }],
|
|
2037
|
-
expandWidth: [{ type: i0.Input }],
|
|
2038
1952
|
overlay: [{ type: i0.Input }],
|
|
2039
1953
|
toggleExpand: [{ type: i0.Output }],
|
|
2040
|
-
_sideBarHeaderTpl: [{ type: i0.ContentChild, args: [BaseLayoutSideBarHeaderDirective, { static: true, read: i0.TemplateRef },] }],
|
|
2041
1954
|
_sideBarFooterTpl: [{ type: i0.ContentChild, args: [BaseLayoutSideBarFooterDirective, { static: true, read: i0.TemplateRef },] }]
|
|
2042
1955
|
};
|
|
2043
1956
|
__decorate([
|
|
2044
1957
|
core.InputBoolean()
|
|
2045
|
-
], SideNavComponent.prototype, "hasHeaderToggle", void 0);
|
|
2046
|
-
__decorate([
|
|
2047
|
-
core.InputNumber(10)
|
|
2048
|
-
], SideNavComponent.prototype, "indentSize", void 0);
|
|
1958
|
+
], SideNavComponent.prototype, "hasHeaderToggle", void 0);
|
|
2049
1959
|
|
|
2050
1960
|
var EXPANDED_STATE = 'expanded';
|
|
2051
1961
|
var COLLAPSED_STATE = 'collapsed';
|
|
@@ -2098,14 +2008,13 @@
|
|
|
2098
2008
|
this._badgeTooltip = {
|
|
2099
2009
|
tooltip: value,
|
|
2100
2010
|
placement: 'auto',
|
|
2101
|
-
disabled: false
|
|
2102
|
-
container: 'body'
|
|
2011
|
+
disabled: false
|
|
2103
2012
|
};
|
|
2104
2013
|
}
|
|
2105
2014
|
else {
|
|
2106
2015
|
this._badgeTooltip = Object.assign(Object.assign({}, value), { placement: value.placement || 'auto', disabled: typeof (value === null || value === void 0 ? void 0 : value.disabled) === 'boolean'
|
|
2107
2016
|
? value.disabled
|
|
2108
|
-
: typeof value.tooltip === 'string' ? false : true
|
|
2017
|
+
: typeof value.tooltip === 'string' ? false : true });
|
|
2109
2018
|
}
|
|
2110
2019
|
}
|
|
2111
2020
|
else {
|
|
@@ -2145,19 +2054,12 @@
|
|
|
2145
2054
|
this._sideNav.collapse();
|
|
2146
2055
|
}
|
|
2147
2056
|
};
|
|
2148
|
-
Object.defineProperty(SideNavItemComponent.prototype, "showIconBlock", {
|
|
2149
|
-
get: function () {
|
|
2150
|
-
return utils.notNullOrUndefined(this.icon) || this.hideEmptyIcon !== true;
|
|
2151
|
-
},
|
|
2152
|
-
enumerable: false,
|
|
2153
|
-
configurable: true
|
|
2154
|
-
});
|
|
2155
2057
|
return SideNavItemComponent;
|
|
2156
2058
|
}());
|
|
2157
2059
|
SideNavItemComponent.decorators = [
|
|
2158
2060
|
{ type: i0.Component, args: [{
|
|
2159
2061
|
selector: 'seam-side-nav-item',
|
|
2160
|
-
template: "<div class=\"d-flex flex-row
|
|
2062
|
+
template: "<div class=\"d-flex flex-row\">\n <ng-container *ngIf=\"itemType === 'basic'\">\n <ng-template [ngTemplateOutlet]=\"itemTypeBasic\"></ng-template>\n </ng-container>\n <ng-container *ngIf=\"itemType === 'link'\">\n <ng-template [ngTemplateOutlet]=\"itemTypeLink\"></ng-template>\n </ng-container>\n <ng-container *ngIf=\"itemType === 'divider'\">\n <ng-template [ngTemplateOutlet]=\"itemTypeDivider\"></ng-template>\n </ng-container>\n <ng-container *ngIf=\"itemType === 'title'\">\n <ng-template [ngTemplateOutlet]=\"itemTypeTitle\"></ng-template>\n </ng-container>\n</div>\n\n<ng-container *ngIf=\"hasChildren\">\n <div class=\"side-nav--group side-nav--group--level-{{ hierLevel + 1 }}\"\n [@childGroupAnim]=\"childGroupAnimState$ | async\">\n <seam-side-nav-item *ngFor=\"let child of children\"\n [hierLevel]=\"compact ? 0 : (hierLevel + 1)\"\n [compact]=\"compact\"\n [itemType]=\"$any(child).itemType\"\n [icon]=\"$any(child).icon\"\n [label]=\"$any(child).label\"\n [link]=\"$any(child).link\"\n [badgeText]=\"$any(child).badge?.text\"\n [badgeTheme]=\"$any(child).badge?.theme || 'danger'\"\n [badgeSrContent]=\"$any(child).badge?.srContent\"\n [badgeTooltip]=\"$any(child)?.badge?.tooltip\"\n [queryParams]=\"$any(child).queryParams\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n [children]=\"$any(child)?.children\"\n [active]=\"$any(child).__state.active\"\n [expanded]=\"$any(child).__state.expanded\">\n </seam-side-nav-item>\n </div>\n</ng-container>\n\n<ng-template #itemTypeBasic>\n <button class=\"side-nav-item btn side-nav-btn p-0 d-flex flex-row rounded-0 text-decoration-none text-nowrap w-100\"\n cdkMonitorElementFocus\n (click)=\"toggleChildren()\"\n [attr.aria-expanded]=\"expanded\">\n <div class=\"nav-link d-flex flex-row w-100\" [class.nav-link__compact]=\"compact\">\n <div [style.padding-left.px]=\"hierLevel * indentSize\"></div>\n <div class=\"side-nav-item--icon\">\n <seam-icon *ngIf=\"icon\" [icon]=\"icon\"></seam-icon>\n <ng-container *ngIf=\"compact\">\n <ng-template [ngTemplateOutlet]=\"itemBadge\"></ng-template>\n </ng-container>\n </div>\n <span *ngIf=\"!compact\" side-nav-item-label style=\"margin-left: 11px;\">\n {{ label }}\n </span>\n <span *ngIf=\"compact\" class=\"sr-only\" side-nav-item-label>{{ label }}</span>\n <ng-container *ngIf=\"!compact\">\n <ng-template [ngTemplateOutlet]=\"itemBadge\"></ng-template>\n </ng-container>\n </div>\n\n <div *ngIf=\"hasChildren && !compact\"\n class=\"btn side-nav-btn side-nav-item--toggle-btn-container rounded-0\">\n <seam-icon\n class=\"side-nav-item--toggle-btn\"\n [class.side-nav-item--toggle-btn-expanded]=\"expanded\"\n [icon]=\"faAngleLeft\"\n type>\n </seam-icon>\n </div>\n </button>\n</ng-template>\n\n<ng-template #itemTypeLink>\n <a *ngIf=\"link; else noLink\" class=\"side-nav-item nav-link d-flex flex-row text-nowrap w-100 align-items-center\"\n [class.nav-link__compact]=\"compact\"\n [routerLink]=\"link\"\n [queryParams]=\"queryParams\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n (click)=\"_linkClicked()\">\n <div [style.padding-left.px]=\"hierLevel * indentSize\"></div>\n <div class=\"side-nav-item--icon\">\n <seam-icon *ngIf=\"icon\" [icon]=\"icon\"></seam-icon>\n <ng-container *ngIf=\"compact\">\n <ng-template [ngTemplateOutlet]=\"itemBadge\"></ng-template>\n </ng-container>\n </div>\n <span *ngIf=\"!compact\" style=\"margin-left: 11px;\" side-nav-item-label>\n {{ label }}\n </span>\n <span *ngIf=\"compact\" class=\"sr-only\" side-nav-item-label>{{ label }}</span>\n <ng-container *ngIf=\"!compact\">\n <ng-template [ngTemplateOutlet]=\"itemBadge\"></ng-template>\n </ng-container>\n </a>\n\n <ng-template #noLink>\n <a class=\"side-nav-item nav-link d-flex flex-row text-nowrap w-100 align-items-center\" [class.nav-link__compact]=\"compact\">\n <div [style.padding-left.px]=\"hierLevel * indentSize\"></div>\n <div class=\"side-nav-item--icon\">\n <seam-icon *ngIf=\"icon\" [icon]=\"icon\"></seam-icon>\n </div>\n <span *ngIf=\"!compact\" style=\"margin-left: 11px;\" side-nav-item-label>\n {{ label }}\n </span>\n <span *ngIf=\"compact\" class=\"sr-only\" side-nav-item-label>{{ label }}</span>\n </a>\n </ng-template>\n\n <button *ngIf=\"hasChildren && !compact\"\n type=\"button\"\n class=\"btn side-nav-btn side-nav-item--toggle-btn-container rounded-0\"\n (click)=\"toggleChildren()\"\n [attr.aria-expanded]=\"expanded\"\n cdkMonitorElementFocus>\n <seam-icon\n class=\"side-nav-item--toggle-btn\"\n [class.side-nav-item--toggle-btn-expanded]=\"expanded\"\n [icon]=\"faAngleLeft\"\n type>\n </seam-icon>\n <span class=\"sr-only\">Group Toggle</span>\n </button>\n</ng-template>\n\n<ng-template #itemTypeDivider>\n <div class=\"px-2 w-100\">\n <hr class=\"side-nav-item--divider\" />\n </div>\n</ng-template>\n\n<ng-template #itemTypeTitle>\n <ng-container *ngIf=\"!compact\">\n <span class=\"side-nav-item--title pt-1\" side-nav-item-label>{{ label }}</span>\n </ng-container>\n</ng-template>\n\n<ng-template #itemBadge>\n <ng-container *ngIf=\"badgeText\">\n <div class=\"badge-spacer flex-grow-1\" *ngIf=\"!compact\"></div>\n <div class=\"side-nav-item--badge\"\n [class.side-nav-item--badge-no-icon]=\"!icon\"\n [ngbTooltip]=\"$any(badgeTooltip)?.tooltip\"\n [tooltipClass]=\"$any(badgeTooltip)?.class\"\n [placement]=\"$any(badgeTooltip)?.placement\"\n [container]=\"$any(badgeTooltip)?.container\"\n [disableTooltip]=\"!badgeTooltip || !!$any(badgeTooltip)?.disabled\">\n <span class=\"badge badge-pill badge-{{ badgeTheme }}\">\n <ng-container *ngIf=\"!compact || !icon\">\n {{ badgeText }}\n </ng-container>\n <span *ngIf=\"badgeSrContent\">{{ badgeSrContent }}</span>\n </span>\n </div>\n </ng-container>\n</ng-template>\n",
|
|
2161
2063
|
exportAs: 'seamSideNavItem',
|
|
2162
2064
|
animations: [
|
|
2163
2065
|
animations.trigger('childGroupAnim', [
|
|
@@ -2190,7 +2092,7 @@
|
|
|
2190
2092
|
],
|
|
2191
2093
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
2192
2094
|
encapsulation: i0.ViewEncapsulation.None,
|
|
2193
|
-
styles: ["seam-side-nav-item{display:block;transition:.25s ease-in-out background-color}seam-side-nav-item.seam-side-nav-item--active{background-color:#2a6395}seam-side-nav-item.seam-side-nav-item--active .active,seam-side-nav-item.seam-side-nav-item--active:active,seam-side-nav-item.seam-side-nav-item--active .side-nav-item.active:hover{background-color:#2a6395}seam-side-nav-item.seam-side-nav-item--active .side-nav-item:hover{background-color:#2f71a9}seam-side-nav-item.seam-side-nav-item--active .nav-link{color:#fff}seam-side-nav-item
|
|
2095
|
+
styles: ["seam-side-nav-item{display:block;transition:.25s ease-in-out background-color}seam-side-nav-item.seam-side-nav-item--active{background-color:#2a6395}seam-side-nav-item.seam-side-nav-item--active .active,seam-side-nav-item.seam-side-nav-item--active:active,seam-side-nav-item.seam-side-nav-item--active .side-nav-item.active:hover{background-color:#2a6395}seam-side-nav-item.seam-side-nav-item--active .side-nav-item:hover{background-color:#2f71a9}seam-side-nav-item.seam-side-nav-item--active .nav-link{color:#fff}seam-side-nav-item .badge{vertical-align:middle}seam-side-nav-item:not(.side-nav-item--icon) .side-nav-item--badge{pointer-events:all;margin-left:5px;margin-right:3px}seam-side-nav-item .side-nav-item--icon{position:relative;width:24px;max-width:24px;min-width:24px;height:24px;max-height:24px;min-height:24px;text-align:center}seam-side-nav-item .side-nav-item--icon .side-nav-item--badge{top:-4px;right:-4px;position:absolute}seam-side-nav-item .side-nav-item--icon .side-nav-item--badge .badge:empty{display:block;width:8px;height:8px;padding:0}seam-side-nav-item .side-nav-item--icon .side-nav-item--badge.side-nav-item--badge-no-icon{top:0px;right:0px}seam-side-nav-item .side-nav-item{min-height:45px;transition:.25s ease-in-out background-color}seam-side-nav-item .side-nav-item:hover{background-color:#2f71a9}seam-side-nav-item .side-nav-item.active{pointer-events:none;cursor:default}seam-side-nav-item a.side-nav-item:not([href]):not([tabindex]){color:#ccc}seam-side-nav-item a.side-nav-item:not([href]):not([tabindex]):hover{background-color:transparent}seam-side-nav-item .nav-link{color:#fff;padding-right:2px}seam-side-nav-item .nav-link__compact{padding-right:0;padding-left:12px}seam-side-nav-item .nav-link:last-child{padding-right:8px}seam-side-nav-item .side-nav-btn{font-weight:400;color:#fff;text-decoration:none}seam-side-nav-item .side-nav-btn:hover{color:#2f71a9;text-decoration:underline}seam-side-nav-item .side-nav-btn:focus,seam-side-nav-item .side-nav-btn.focus{text-decoration:underline;box-shadow:none}seam-side-nav-item .side-nav-btn:disabled,seam-side-nav-item .side-nav-btn.disabled{color:#ccc;pointer-events:none}seam-side-nav-item .cdk-keyboard-focused{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}seam-side-nav-item .side-nav-item--toggle-btn-container{transition:.25s ease-in-out background-color;padding:.5rem 1rem}seam-side-nav-item button.side-nav-item--toggle-btn-container:hover{background-color:#2f71a9}seam-side-nav-item .side-nav-item--toggle-btn{color:#fff}seam-side-nav-item .side-nav-item--toggle-btn .svg-inline--fa{transition:.1s ease-in-out transform}seam-side-nav-item .side-nav-item--toggle-btn.side-nav-item--toggle-btn-expanded .svg-inline--fa{transform:rotate(-90deg)}seam-side-nav-item .side-nav--group{will-change:height;overflow:hidden}seam-side-nav-item .side-nav--group--level-1{background-color:#3276b1}seam-side-nav-item .side-nav--group--level-2{background-color:#2e6ea5}seam-side-nav-item .side-nav--group--level-3{background-color:#2b6699}seam-side-nav-item .side-nav--group--level-4{background-color:#285e8d}seam-side-nav-item .side-nav--group--level-5{background-color:#245681}seam-side-nav-item .side-nav--group--level-6{background-color:#214e75}seam-side-nav-item .side-nav--group--level-7{background-color:#1e4669}seam-side-nav-item .side-nav--group--level-8{background-color:#1a3e5d}seam-side-nav-item .side-nav--group--level-9{background-color:#173651}seam-side-nav-item .side-nav-item--divider{display:block;border-top:1px solid #2a6395;width:100%}seam-side-nav-item .side-nav-item--title{color:#fff;font-size:24px;padding-left:10px}seam-side-nav-item .sr-only{top:0;left:0}\n"]
|
|
2194
2096
|
},] }
|
|
2195
2097
|
];
|
|
2196
2098
|
SideNavItemComponent.ctorParameters = function () { return [
|
|
@@ -2200,7 +2102,6 @@
|
|
|
2200
2102
|
SideNavItemComponent.propDecorators = {
|
|
2201
2103
|
itemType: [{ type: i0.Input }],
|
|
2202
2104
|
icon: [{ type: i0.Input }],
|
|
2203
|
-
hideEmptyIcon: [{ type: i0.Input }],
|
|
2204
2105
|
label: [{ type: i0.Input }],
|
|
2205
2106
|
active: [{ type: i0.Input }],
|
|
2206
2107
|
link: [{ type: i0.Input }],
|
|
@@ -2229,6 +2130,7 @@
|
|
|
2229
2130
|
|
|
2230
2131
|
var SideNavToggleComponent = /** @class */ (function () {
|
|
2231
2132
|
function SideNavToggleComponent() {
|
|
2133
|
+
this.faBars = freeSolidSvgIcons.faBars;
|
|
2232
2134
|
this.expanded = false;
|
|
2233
2135
|
this.toggleExpand = new i0.EventEmitter();
|
|
2234
2136
|
}
|
|
@@ -2241,20 +2143,18 @@
|
|
|
2241
2143
|
SideNavToggleComponent.decorators = [
|
|
2242
2144
|
{ type: i0.Component, args: [{
|
|
2243
2145
|
selector: 'seam-side-nav-toggle',
|
|
2244
|
-
template: "<div class=\"side-nav-toggle--content\"
|
|
2146
|
+
template: "<div class=\"side-nav-toggle--content\" *ngIf=\"expanded\">\n <ng-content></ng-content>\n</div>\n<button seamIconBtn [icon]=\"faBars\"\n iconType=\"borderless-styled-square\"\n btnSize=\"sm\"\n class=\"side-nav-toggle--btn ml-1\"\n (click)=\"toggle()\">\n <span class=\"sr-only\">Toggle sidebar</span>\n</button>\n",
|
|
2245
2147
|
host: {
|
|
2246
2148
|
'[class.side-nav-toggle--compact]': '!expanded'
|
|
2247
2149
|
},
|
|
2248
2150
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
2249
2151
|
encapsulation: i0.ViewEncapsulation.None,
|
|
2250
|
-
styles: ["seam-side-nav-toggle{display:flex;flex-direction:row;flex-shrink:0;
|
|
2152
|
+
styles: ["seam-side-nav-toggle{display:flex;flex-direction:row;flex-shrink:0;position:relative;height:45px;width:100%}seam-side-nav-toggle .side-nav-toggle--content{flex:1 1 0}seam-side-nav-toggle .side-nav-toggle--btn{position:absolute;top:0;right:5px;color:#fff}seam-side-nav-toggle .side-nav-toggle--btn seam-icon{padding:5px}\n"]
|
|
2251
2153
|
},] }
|
|
2252
2154
|
];
|
|
2253
2155
|
SideNavToggleComponent.ctorParameters = function () { return []; };
|
|
2254
2156
|
SideNavToggleComponent.propDecorators = {
|
|
2255
2157
|
expanded: [{ type: i0.Input }],
|
|
2256
|
-
toggleIcon: [{ type: i0.Input }],
|
|
2257
|
-
toggleTpl: [{ type: i0.Input }],
|
|
2258
2158
|
toggleExpand: [{ type: i0.Output }]
|
|
2259
2159
|
};
|
|
2260
2160
|
__decorate([
|
|
@@ -2333,7 +2233,7 @@
|
|
|
2333
2233
|
{ type: i0.Component, args: [{
|
|
2334
2234
|
// tslint:disable-next-line:component-selector
|
|
2335
2235
|
selector: 'button[seamTopBarMenuButton]',
|
|
2336
|
-
template: "<div class=\"d-flex flex-row\" *ngIf=\"!compact; else compactTpl\">\n <div class=\"text-left flex-grow-1 text-truncate\">\n <ng-template [ngTemplateOutlet]=\"$any(detailTpl)\"></ng-template>\n </div>\n <!-- Arrow Button -->\n <div class=\"pl-2 d-flex flex-column\">\n <div class=\"flex-grow-1\"></div>\n <seam-icon class=\"d-block\" [icon]=\"faAngleDown\"></seam-icon>\n <div class=\"flex-grow-1\"></div>\n </div>\n</div>\n<ng-template #compactTpl>\n <
|
|
2236
|
+
template: "<div class=\"d-flex flex-row\" *ngIf=\"!compact; else compactTpl\">\n <div class=\"text-left flex-grow-1 text-truncate\">\n <ng-template [ngTemplateOutlet]=\"$any(detailTpl)\"></ng-template>\n </div>\n <!-- Arrow Button -->\n <div class=\"pl-2 d-flex flex-column\">\n <div class=\"flex-grow-1\"></div>\n <seam-icon class=\"d-block\" [icon]=\"faAngleDown\"></seam-icon>\n <div class=\"flex-grow-1\"></div>\n </div>\n</div>\n<ng-template #compactTpl>\n <seam-icon [icon]=\"profileIcon\" iconType=\"borderless-styled-square\"></seam-icon>\n</ng-template>\n",
|
|
2337
2237
|
encapsulation: i0.ViewEncapsulation.None,
|
|
2338
2238
|
exportAs: 'seamButton',
|
|
2339
2239
|
// tslint:disable-next-line:use-input-property-decorator
|
|
@@ -2341,7 +2241,7 @@
|
|
|
2341
2241
|
// tslint:disable-next-line:use-host-property-decorator
|
|
2342
2242
|
host: {
|
|
2343
2243
|
'attr.type': 'button',
|
|
2344
|
-
'class': 'btn border text-decoration-none py-0
|
|
2244
|
+
'class': 'btn border text-decoration-none py-0',
|
|
2345
2245
|
'[attr.aria-disabled]': 'disabled.toString()',
|
|
2346
2246
|
'[attr.disabled]': 'disabled || null',
|
|
2347
2247
|
},
|
|
@@ -2351,7 +2251,6 @@
|
|
|
2351
2251
|
];
|
|
2352
2252
|
TopBarMenuButtonComponent.propDecorators = {
|
|
2353
2253
|
detailTpl: [{ type: i0.Input }],
|
|
2354
|
-
compactDetailTpl: [{ type: i0.Input }],
|
|
2355
2254
|
compact: [{ type: i0.Input }],
|
|
2356
2255
|
profileIcon: [{ type: i0.Input }],
|
|
2357
2256
|
_hasCompactClass: [{ type: i0.HostBinding, args: ['class.top-bar-menu-button--compact',] }],
|
|
@@ -2387,15 +2286,7 @@
|
|
|
2387
2286
|
var TopBarItemDirective = /** @class */ (function () {
|
|
2388
2287
|
function TopBarItemDirective(template) {
|
|
2389
2288
|
this.template = template;
|
|
2390
|
-
this.position = 'right';
|
|
2391
2289
|
}
|
|
2392
|
-
Object.defineProperty(TopBarItemDirective.prototype, "seamTopBarItem", {
|
|
2393
|
-
set: function (value) {
|
|
2394
|
-
this.position = value;
|
|
2395
|
-
},
|
|
2396
|
-
enumerable: false,
|
|
2397
|
-
configurable: true
|
|
2398
|
-
});
|
|
2399
2290
|
return TopBarItemDirective;
|
|
2400
2291
|
}());
|
|
2401
2292
|
TopBarItemDirective.decorators = [
|
|
@@ -2405,10 +2296,7 @@
|
|
|
2405
2296
|
];
|
|
2406
2297
|
TopBarItemDirective.ctorParameters = function () { return [
|
|
2407
2298
|
{ type: i0.TemplateRef }
|
|
2408
|
-
]; };
|
|
2409
|
-
TopBarItemDirective.propDecorators = {
|
|
2410
|
-
seamTopBarItem: [{ type: i0.Input }]
|
|
2411
|
-
};
|
|
2299
|
+
]; };
|
|
2412
2300
|
|
|
2413
2301
|
var TopBarMenuBtnDetailDirective = /** @class */ (function () {
|
|
2414
2302
|
function TopBarMenuBtnDetailDirective(template) {
|
|
@@ -2440,36 +2328,6 @@
|
|
|
2440
2328
|
{ type: menu.MenuComponent, decorators: [{ type: i0.Self }] }
|
|
2441
2329
|
]; };
|
|
2442
2330
|
|
|
2443
|
-
var TopBarCompactMenuBtnDetailDirective = /** @class */ (function () {
|
|
2444
|
-
function TopBarCompactMenuBtnDetailDirective(template) {
|
|
2445
|
-
this.template = template;
|
|
2446
|
-
}
|
|
2447
|
-
return TopBarCompactMenuBtnDetailDirective;
|
|
2448
|
-
}());
|
|
2449
|
-
TopBarCompactMenuBtnDetailDirective.decorators = [
|
|
2450
|
-
{ type: i0.Directive, args: [{
|
|
2451
|
-
selector: '[seamTopBarCompactMenuBtnDetail]'
|
|
2452
|
-
},] }
|
|
2453
|
-
];
|
|
2454
|
-
TopBarCompactMenuBtnDetailDirective.ctorParameters = function () { return [
|
|
2455
|
-
{ type: i0.TemplateRef }
|
|
2456
|
-
]; };
|
|
2457
|
-
|
|
2458
|
-
var TopBarNavToggleBtnDetailDirective = /** @class */ (function () {
|
|
2459
|
-
function TopBarNavToggleBtnDetailDirective(template) {
|
|
2460
|
-
this.template = template;
|
|
2461
|
-
}
|
|
2462
|
-
return TopBarNavToggleBtnDetailDirective;
|
|
2463
|
-
}());
|
|
2464
|
-
TopBarNavToggleBtnDetailDirective.decorators = [
|
|
2465
|
-
{ type: i0.Directive, args: [{
|
|
2466
|
-
selector: '[seamTopBarNavToggleBtnDetail]'
|
|
2467
|
-
},] }
|
|
2468
|
-
];
|
|
2469
|
-
TopBarNavToggleBtnDetailDirective.ctorParameters = function () { return [
|
|
2470
|
-
{ type: i0.TemplateRef }
|
|
2471
|
-
]; };
|
|
2472
|
-
|
|
2473
2331
|
/**
|
|
2474
2332
|
* Top bar of an app.
|
|
2475
2333
|
*
|
|
@@ -2494,26 +2352,8 @@
|
|
|
2494
2352
|
this.logoRoute = '/';
|
|
2495
2353
|
/** Determines if the title should be displayed. */
|
|
2496
2354
|
this.hasTitle = false;
|
|
2497
|
-
/** Determines if the top bar button should be displayed. */
|
|
2498
|
-
this.hasTopBarMenuButton = true;
|
|
2499
2355
|
/** Icon to display on mobile to activate profile dropdown. Defaults to faUserCircle. */
|
|
2500
2356
|
this.profileIcon = freeRegularSvgIcons.faUserCircle;
|
|
2501
|
-
/** Icon to display for mobile nav toggle. Defaults to faBars. */
|
|
2502
|
-
this.toggleIcon = freeSolidSvgIcons.faBars;
|
|
2503
|
-
/** Display nav toggle on either left or right side of top bar. Defaults to left. */
|
|
2504
|
-
this.navToggleAlign = 'left';
|
|
2505
|
-
/** @ignore */
|
|
2506
|
-
this._leftItems = new rxjs.BehaviorSubject([]);
|
|
2507
|
-
/** Additional templates to display on left side of top bar */
|
|
2508
|
-
this.leftItems$ = this._leftItems.asObservable();
|
|
2509
|
-
/** @ignore */
|
|
2510
|
-
this._centerItems = new rxjs.BehaviorSubject([]);
|
|
2511
|
-
/** Additional templates to display in center of top bar */
|
|
2512
|
-
this.centerItems$ = this._centerItems.asObservable();
|
|
2513
|
-
/** @ignore */
|
|
2514
|
-
this._rightItems = new rxjs.BehaviorSubject([]);
|
|
2515
|
-
/** Additional templates to display on right side of top bar */
|
|
2516
|
-
this.rightItems$ = this._rightItems.asObservable();
|
|
2517
2357
|
this.isMobile$ = this._layout.isMobile$;
|
|
2518
2358
|
}
|
|
2519
2359
|
/** @ignore */
|
|
@@ -2527,16 +2367,7 @@
|
|
|
2527
2367
|
TheSeamTopBarComponent.prototype.ngAfterContentInit = function () {
|
|
2528
2368
|
var _this = this;
|
|
2529
2369
|
if (this._topBarItems) {
|
|
2530
|
-
this._topBarItems.changes.pipe(operators.startWith(undefined), operators.takeUntil(this._ngUnsubscribe), operators.map(function () {
|
|
2531
|
-
var _a;
|
|
2532
|
-
var items = ((_a = _this._topBarItems) === null || _a === void 0 ? void 0 : _a.toArray()) || [];
|
|
2533
|
-
var left = items.filter(function (i) { return i.position === 'left'; });
|
|
2534
|
-
var right = items.filter(function (i) { return i.position === 'right'; });
|
|
2535
|
-
var center = items.filter(function (i) { return i.position === 'center'; });
|
|
2536
|
-
_this._leftItems.next(left);
|
|
2537
|
-
_this._rightItems.next(right);
|
|
2538
|
-
_this._centerItems.next(center);
|
|
2539
|
-
}), operators.shareReplay({ bufferSize: 1, refCount: true })).subscribe();
|
|
2370
|
+
this._items$ = this._topBarItems.changes.pipe(operators.startWith(undefined), operators.takeUntil(this._ngUnsubscribe), operators.map(function () { var _a; return ((_a = _this._topBarItems) === null || _a === void 0 ? void 0 : _a.toArray()) || []; }), operators.shareReplay({ bufferSize: 1, refCount: true }));
|
|
2540
2371
|
}
|
|
2541
2372
|
};
|
|
2542
2373
|
return TheSeamTopBarComponent;
|
|
@@ -2544,11 +2375,11 @@
|
|
|
2544
2375
|
TheSeamTopBarComponent.decorators = [
|
|
2545
2376
|
{ type: i0.Component, args: [{
|
|
2546
2377
|
selector: 'seam-top-bar',
|
|
2547
|
-
template: "<div class=\"
|
|
2378
|
+
template: "<!-- Nav Toggle -->\n<div class=\"d-flex flex-column justify-content-center pr-2\" *ngIf=\"isMobile$ | async\">\n <button seamBaseLayoutNavToggle seamIconBtn [icon]=\"faBars\" iconType=\"borderless-styled-square\"></button>\n</div>\n\n<!-- Logo -->\n<div class=\"top-bar--logo d-flex flex-column justify-content-center\" *ngIf=\"logoHref; else useLogoRoute\"\n [class.top-bar--logo-mobile]=\"isMobile$ | async\">\n <a [href]=\"logoHref\" [target]=\"logoHrefTarget\">\n <div>\n <img *ngIf=\"logo\" [src]=\"logo\" [src.lt-md]=\"hasTitle ? logoSm : logo\" alt=\"Logo\">\n </div>\n </a>\n</div>\n\n<ng-template #useLogoRoute>\n <div class=\"top-bar--logo d-flex flex-column justify-content-center\" [routerLink]=\"logoRoute\"\n [class.top-bar--logo-mobile]=\"isMobile$ | async\">\n <div>\n <img *ngIf=\"logo\" [src]=\"logo\" [src.lt-md]=\"hasTitle ? logoSm : logo\" alt=\"Logo\">\n </div>\n </div>\n</ng-template>\n\n<!-- Title -->\n<div class=\"d-flex flex-column flex-grow-1\">\n <seam-top-bar-title *ngIf=\"hasTitle\"\n [titleText]=\"titleText\"\n [subTitleText]=\"subTitleText\"\n [class.ml-2]=\"isMobile$ | async\">\n </seam-top-bar-title>\n</div>\n\n<!-- Items -->\n<div class=\"top-bar-icon-container mr-2\">\n <ng-container *ngFor=\"let item of _items$ | async\">\n <ng-template [ngTemplateOutlet]=\"item.template\"></ng-template>\n </ng-container>\n</div>\n\n<!-- Menu -->\n<button seamTopBarMenuButton\n [seamMenuToggle]=\"_topBarMenu?.menu\"\n [detailTpl]=\"_topBarMenuBtnDetailTpl?.template\"\n [compact]=\"isMobile$ | async\"\n [profileIcon]=\"profileIcon\">\n</button>\n",
|
|
2548
2379
|
encapsulation: i0.ViewEncapsulation.None,
|
|
2549
2380
|
exportAs: 'seamTopBar',
|
|
2550
2381
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
2551
|
-
styles: ["seam-top-bar{display:flex;flex:1 1 100%;flex-direction:row;background:white;margin:0;padding:8px;border-radius:0;box-shadow:none}.top-bar--logo{flex:0 0 auto;overflow:hidden;cursor:pointer}.top-bar--logo img{height:auto;max-height:60px;width:auto;max-width:200px}.top-bar--logo.top-bar--logo-mobile img{height:auto;max-height:40px;width:auto;max-width:150px}.top-bar
|
|
2382
|
+
styles: ["seam-top-bar{display:flex;flex:1 1 100%;flex-direction:row;background:white;margin:0;padding:8px;border-radius:0;box-shadow:none}.top-bar--logo{flex:0 0 auto;overflow:hidden;cursor:pointer}.top-bar--logo img{height:auto;max-height:60px;width:auto;max-width:200px}.top-bar--logo.top-bar--logo-mobile img{height:auto;max-height:40px;width:auto;max-width:150px}.top-bar-icon-container{margin:auto 0}\n"]
|
|
2552
2383
|
},] }
|
|
2553
2384
|
];
|
|
2554
2385
|
TheSeamTopBarComponent.ctorParameters = function () { return [
|
|
@@ -2558,8 +2389,6 @@
|
|
|
2558
2389
|
_topBarMenu: [{ type: i0.ContentChild, args: [TopBarMenuDirective, { static: true },] }],
|
|
2559
2390
|
_topBarItems: [{ type: i0.ContentChildren, args: [TopBarItemDirective,] }],
|
|
2560
2391
|
_topBarMenuBtnDetailTpl: [{ type: i0.ContentChild, args: [TopBarMenuBtnDetailDirective,] }],
|
|
2561
|
-
_topBarCompactMenuBtnDetailTpl: [{ type: i0.ContentChild, args: [TopBarCompactMenuBtnDetailDirective,] }],
|
|
2562
|
-
_topBarNavToggleBtnDetailTpl: [{ type: i0.ContentChild, args: [TopBarNavToggleBtnDetailDirective,] }],
|
|
2563
2392
|
logo: [{ type: i0.Input }],
|
|
2564
2393
|
logoSm: [{ type: i0.Input }],
|
|
2565
2394
|
logoHref: [{ type: i0.Input }],
|
|
@@ -2568,17 +2397,11 @@
|
|
|
2568
2397
|
hasTitle: [{ type: i0.Input }],
|
|
2569
2398
|
titleText: [{ type: i0.Input }],
|
|
2570
2399
|
subTitleText: [{ type: i0.Input }],
|
|
2571
|
-
|
|
2572
|
-
profileIcon: [{ type: i0.Input }],
|
|
2573
|
-
toggleIcon: [{ type: i0.Input }],
|
|
2574
|
-
navToggleAlign: [{ type: i0.Input }]
|
|
2400
|
+
profileIcon: [{ type: i0.Input }]
|
|
2575
2401
|
};
|
|
2576
2402
|
__decorate([
|
|
2577
2403
|
core.InputBoolean()
|
|
2578
|
-
], TheSeamTopBarComponent.prototype, "hasTitle", void 0);
|
|
2579
|
-
__decorate([
|
|
2580
|
-
core.InputBoolean()
|
|
2581
|
-
], TheSeamTopBarComponent.prototype, "hasTopBarMenuButton", void 0);
|
|
2404
|
+
], TheSeamTopBarComponent.prototype, "hasTitle", void 0);
|
|
2582
2405
|
|
|
2583
2406
|
var TheSeamTopBarModule = /** @class */ (function () {
|
|
2584
2407
|
function TheSeamTopBarModule() {
|
|
@@ -2593,9 +2416,7 @@
|
|
|
2593
2416
|
TopBarMenuButtonComponent,
|
|
2594
2417
|
TopBarMenuDirective,
|
|
2595
2418
|
TopBarItemDirective,
|
|
2596
|
-
TopBarMenuBtnDetailDirective
|
|
2597
|
-
TopBarCompactMenuBtnDetailDirective,
|
|
2598
|
-
TopBarNavToggleBtnDetailDirective
|
|
2419
|
+
TopBarMenuBtnDetailDirective
|
|
2599
2420
|
],
|
|
2600
2421
|
imports: [
|
|
2601
2422
|
common.CommonModule,
|
|
@@ -2612,9 +2433,7 @@
|
|
|
2612
2433
|
TopBarMenuDirective,
|
|
2613
2434
|
menu.TheSeamMenuModule,
|
|
2614
2435
|
TopBarItemDirective,
|
|
2615
|
-
TopBarMenuBtnDetailDirective
|
|
2616
|
-
TopBarCompactMenuBtnDetailDirective,
|
|
2617
|
-
TopBarNavToggleBtnDetailDirective
|
|
2436
|
+
TopBarMenuBtnDetailDirective
|
|
2618
2437
|
]
|
|
2619
2438
|
},] }
|
|
2620
2439
|
];
|
|
@@ -3484,656 +3303,6 @@
|
|
|
3484
3303
|
},] }
|
|
3485
3304
|
];
|
|
3486
3305
|
|
|
3487
|
-
function isHorizontalNavItemType(item, type) {
|
|
3488
|
-
return item.itemType === type;
|
|
3489
|
-
}
|
|
3490
|
-
function isHorizontalNavItemActive(item) {
|
|
3491
|
-
var _a, _b;
|
|
3492
|
-
return (_b = (_a = item.__state) === null || _a === void 0 ? void 0 : _a.active) !== null && _b !== void 0 ? _b : false;
|
|
3493
|
-
}
|
|
3494
|
-
function isHorizontalNavItemExpanded(item) {
|
|
3495
|
-
var _a, _b;
|
|
3496
|
-
return (_b = (_a = item.__state) === null || _a === void 0 ? void 0 : _a.expanded) !== null && _b !== void 0 ? _b : false;
|
|
3497
|
-
}
|
|
3498
|
-
function horizontalNavItemHasChildren(item) {
|
|
3499
|
-
return horizontalNavItemCanHaveChildren(item) && utils.hasProperty(item, 'children') && item.children.length > 0;
|
|
3500
|
-
}
|
|
3501
|
-
function horizontalNavItemCanHaveChildren(item) {
|
|
3502
|
-
return isHorizontalNavItemType(item, 'basic') || isHorizontalNavItemType(item, 'link');
|
|
3503
|
-
}
|
|
3504
|
-
function horizontalNavItemHasActiveChild(item) {
|
|
3505
|
-
var e_1, _c;
|
|
3506
|
-
if (!horizontalNavItemHasChildren(item)) {
|
|
3507
|
-
return false;
|
|
3508
|
-
}
|
|
3509
|
-
try {
|
|
3510
|
-
for (var _d = __values(item.children), _e = _d.next(); !_e.done; _e = _d.next()) {
|
|
3511
|
-
var child = _e.value;
|
|
3512
|
-
if (getHorizontalNavItemStateProp(child, 'active') || horizontalNavItemHasActiveChild(child)) {
|
|
3513
|
-
return true;
|
|
3514
|
-
}
|
|
3515
|
-
}
|
|
3516
|
-
}
|
|
3517
|
-
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
3518
|
-
finally {
|
|
3519
|
-
try {
|
|
3520
|
-
if (_e && !_e.done && (_c = _d.return)) _c.call(_d);
|
|
3521
|
-
}
|
|
3522
|
-
finally { if (e_1) throw e_1.error; }
|
|
3523
|
-
}
|
|
3524
|
-
return false;
|
|
3525
|
-
}
|
|
3526
|
-
function horizontalNavItemHasExpandedChild(item) {
|
|
3527
|
-
var e_2, _c;
|
|
3528
|
-
if (!horizontalNavItemHasChildren(item)) {
|
|
3529
|
-
return false;
|
|
3530
|
-
}
|
|
3531
|
-
try {
|
|
3532
|
-
for (var _d = __values(item.children), _e = _d.next(); !_e.done; _e = _d.next()) {
|
|
3533
|
-
var child = _e.value;
|
|
3534
|
-
if (getHorizontalNavItemStateProp(child, 'expanded')) {
|
|
3535
|
-
return true;
|
|
3536
|
-
}
|
|
3537
|
-
}
|
|
3538
|
-
}
|
|
3539
|
-
catch (e_2_1) { e_2 = { error: e_2_1 }; }
|
|
3540
|
-
finally {
|
|
3541
|
-
try {
|
|
3542
|
-
if (_e && !_e.done && (_c = _d.return)) _c.call(_d);
|
|
3543
|
-
}
|
|
3544
|
-
finally { if (e_2) throw e_2.error; }
|
|
3545
|
-
}
|
|
3546
|
-
return false;
|
|
3547
|
-
}
|
|
3548
|
-
function horizontalNavItemCanBeActive(item) {
|
|
3549
|
-
return isHorizontalNavItemType(item, 'basic') || isHorizontalNavItemType(item, 'link');
|
|
3550
|
-
}
|
|
3551
|
-
function horizontalNavItemCanExpand(item) {
|
|
3552
|
-
return horizontalNavItemCanHaveChildren(item);
|
|
3553
|
-
}
|
|
3554
|
-
function findHorizontalNavLinkItems(items) {
|
|
3555
|
-
var linkItems = [];
|
|
3556
|
-
var _fn = function (_items) {
|
|
3557
|
-
var e_3, _c;
|
|
3558
|
-
try {
|
|
3559
|
-
for (var _items_1 = __values(_items), _items_1_1 = _items_1.next(); !_items_1_1.done; _items_1_1 = _items_1.next()) {
|
|
3560
|
-
var item = _items_1_1.value;
|
|
3561
|
-
if (isHorizontalNavItemType(item, 'link')) {
|
|
3562
|
-
linkItems.push(item);
|
|
3563
|
-
}
|
|
3564
|
-
if (horizontalNavItemCanHaveChildren(item) && utils.hasProperty(item, 'children')) {
|
|
3565
|
-
_fn(item.children);
|
|
3566
|
-
}
|
|
3567
|
-
}
|
|
3568
|
-
}
|
|
3569
|
-
catch (e_3_1) { e_3 = { error: e_3_1 }; }
|
|
3570
|
-
finally {
|
|
3571
|
-
try {
|
|
3572
|
-
if (_items_1_1 && !_items_1_1.done && (_c = _items_1.return)) _c.call(_items_1);
|
|
3573
|
-
}
|
|
3574
|
-
finally { if (e_3) throw e_3.error; }
|
|
3575
|
-
}
|
|
3576
|
-
};
|
|
3577
|
-
_fn(items);
|
|
3578
|
-
return linkItems;
|
|
3579
|
-
}
|
|
3580
|
-
function setHorizontalNavItemStateProp(item, prop, value) {
|
|
3581
|
-
if (utils.hasProperty(item, '__state')) {
|
|
3582
|
-
item.__state[prop] = value;
|
|
3583
|
-
}
|
|
3584
|
-
}
|
|
3585
|
-
function getHorizontalNavItemStateProp(item, prop) {
|
|
3586
|
-
return setDefaultHorizontalNavItemState(item).__state[prop];
|
|
3587
|
-
}
|
|
3588
|
-
function setDefaultHorizontalNavItemState(item) {
|
|
3589
|
-
if (utils.hasProperty(item, '__state')) {
|
|
3590
|
-
return item;
|
|
3591
|
-
}
|
|
3592
|
-
item.__state = {
|
|
3593
|
-
active: false,
|
|
3594
|
-
expanded: false
|
|
3595
|
-
};
|
|
3596
|
-
// TODO: See if there is a nice way to fix the typing for this.
|
|
3597
|
-
return item;
|
|
3598
|
-
}
|
|
3599
|
-
function areSameHorizontalNavItem(item1, item2) {
|
|
3600
|
-
if (utils.isNullOrUndefined(item1) || utils.isNullOrUndefined(item2)) {
|
|
3601
|
-
return false;
|
|
3602
|
-
}
|
|
3603
|
-
if (item1.itemType !== item2.itemType) {
|
|
3604
|
-
return false;
|
|
3605
|
-
}
|
|
3606
|
-
if (isHorizontalNavItemType(item1, 'title') && isHorizontalNavItemType(item2, 'title')) {
|
|
3607
|
-
return item1.label === item2.label;
|
|
3608
|
-
}
|
|
3609
|
-
else if (isHorizontalNavItemType(item1, 'divider') && isHorizontalNavItemType(item2, 'divider')) {
|
|
3610
|
-
return item1.label === item2.label;
|
|
3611
|
-
}
|
|
3612
|
-
else if (isHorizontalNavItemType(item1, 'basic') && isHorizontalNavItemType(item2, 'basic')) {
|
|
3613
|
-
return item1.label === item2.label;
|
|
3614
|
-
}
|
|
3615
|
-
else if (isHorizontalNavItemType(item1, 'link') && isHorizontalNavItemType(item2, 'link')) {
|
|
3616
|
-
return item1.label === item2.label && item1.link === item2.link;
|
|
3617
|
-
}
|
|
3618
|
-
else if (isHorizontalNavItemType(item1, 'button') && isHorizontalNavItemType(item2, 'button')) {
|
|
3619
|
-
return item1.onClick === item2.onClick;
|
|
3620
|
-
}
|
|
3621
|
-
return false;
|
|
3622
|
-
}
|
|
3623
|
-
|
|
3624
|
-
var NavItemComponent = /** @class */ (function () {
|
|
3625
|
-
function NavItemComponent() {
|
|
3626
|
-
this._ngUnsubscribe = new rxjs.Subject();
|
|
3627
|
-
this.faAngleLeft = freeSolidSvgIcons.faAngleLeft;
|
|
3628
|
-
this.active = false;
|
|
3629
|
-
this._link = new rxjs.BehaviorSubject(undefined);
|
|
3630
|
-
this.link$ = this._link.asObservable();
|
|
3631
|
-
this.hierLevel = 0;
|
|
3632
|
-
this.indentSize = 10;
|
|
3633
|
-
this._expanded = new rxjs.BehaviorSubject(false);
|
|
3634
|
-
this.expanded$ = this._expanded.asObservable();
|
|
3635
|
-
this._compact = new rxjs.BehaviorSubject(false);
|
|
3636
|
-
this.compact$ = this._compact.asObservable();
|
|
3637
|
-
this.badgeTheme = 'danger';
|
|
3638
|
-
this.childAction = 'menu';
|
|
3639
|
-
this.expandAction = 'toggle';
|
|
3640
|
-
this.navItemExpanded = new i0.EventEmitter();
|
|
3641
|
-
}
|
|
3642
|
-
Object.defineProperty(NavItemComponent.prototype, "link", {
|
|
3643
|
-
get: function () { return this._link.value; },
|
|
3644
|
-
set: function (value) { this._link.next(value); },
|
|
3645
|
-
enumerable: false,
|
|
3646
|
-
configurable: true
|
|
3647
|
-
});
|
|
3648
|
-
Object.defineProperty(NavItemComponent.prototype, "expanded", {
|
|
3649
|
-
get: function () { return this._expanded.value; },
|
|
3650
|
-
set: function (value) {
|
|
3651
|
-
this._expanded.next(coercion.coerceBooleanProperty(value));
|
|
3652
|
-
},
|
|
3653
|
-
enumerable: false,
|
|
3654
|
-
configurable: true
|
|
3655
|
-
});
|
|
3656
|
-
Object.defineProperty(NavItemComponent.prototype, "compact", {
|
|
3657
|
-
get: function () { return this._compact.value; },
|
|
3658
|
-
set: function (value) { this._compact.next(coercion.coerceBooleanProperty(value)); },
|
|
3659
|
-
enumerable: false,
|
|
3660
|
-
configurable: true
|
|
3661
|
-
});
|
|
3662
|
-
Object.defineProperty(NavItemComponent.prototype, "badgeTooltip", {
|
|
3663
|
-
get: function () { return this._badgeTooltip; },
|
|
3664
|
-
set: function (value) {
|
|
3665
|
-
if (value !== null && value !== undefined) {
|
|
3666
|
-
if (typeof value === 'string') {
|
|
3667
|
-
this._badgeTooltip = {
|
|
3668
|
-
tooltip: value,
|
|
3669
|
-
placement: 'auto',
|
|
3670
|
-
disabled: false
|
|
3671
|
-
};
|
|
3672
|
-
}
|
|
3673
|
-
else {
|
|
3674
|
-
this._badgeTooltip = Object.assign(Object.assign({}, value), { placement: value.placement || 'auto', disabled: typeof (value === null || value === void 0 ? void 0 : value.disabled) === 'boolean'
|
|
3675
|
-
? value.disabled
|
|
3676
|
-
: typeof value.tooltip === 'string' ? false : true });
|
|
3677
|
-
}
|
|
3678
|
-
}
|
|
3679
|
-
else {
|
|
3680
|
-
this._badgeTooltip = undefined;
|
|
3681
|
-
}
|
|
3682
|
-
},
|
|
3683
|
-
enumerable: false,
|
|
3684
|
-
configurable: true
|
|
3685
|
-
});
|
|
3686
|
-
Object.defineProperty(NavItemComponent.prototype, "_isActiveCssClass", {
|
|
3687
|
-
get: function () { return this.active; },
|
|
3688
|
-
enumerable: false,
|
|
3689
|
-
configurable: true
|
|
3690
|
-
});
|
|
3691
|
-
Object.defineProperty(NavItemComponent.prototype, "_isChildActiveCssClass", {
|
|
3692
|
-
get: function () { return this.hasActiveChild; },
|
|
3693
|
-
enumerable: false,
|
|
3694
|
-
configurable: true
|
|
3695
|
-
});
|
|
3696
|
-
Object.defineProperty(NavItemComponent.prototype, "_isExpandedCssClass", {
|
|
3697
|
-
get: function () { return this.expanded; },
|
|
3698
|
-
enumerable: false,
|
|
3699
|
-
configurable: true
|
|
3700
|
-
});
|
|
3701
|
-
Object.defineProperty(NavItemComponent.prototype, "_attrDataHierLevel", {
|
|
3702
|
-
get: function () { return this.hierLevel; },
|
|
3703
|
-
enumerable: false,
|
|
3704
|
-
configurable: true
|
|
3705
|
-
});
|
|
3706
|
-
NavItemComponent.prototype.ngOnDestroy = function () {
|
|
3707
|
-
this._ngUnsubscribe.next();
|
|
3708
|
-
this._ngUnsubscribe.complete();
|
|
3709
|
-
};
|
|
3710
|
-
Object.defineProperty(NavItemComponent.prototype, "hasChildren", {
|
|
3711
|
-
get: function () {
|
|
3712
|
-
return Array.isArray(this.children) && this.children.length > 0;
|
|
3713
|
-
},
|
|
3714
|
-
enumerable: false,
|
|
3715
|
-
configurable: true
|
|
3716
|
-
});
|
|
3717
|
-
Object.defineProperty(NavItemComponent.prototype, "hasActiveChild", {
|
|
3718
|
-
get: function () {
|
|
3719
|
-
if (utils.notNullOrUndefined(this.item)) {
|
|
3720
|
-
return horizontalNavItemHasActiveChild(this.item);
|
|
3721
|
-
}
|
|
3722
|
-
return false;
|
|
3723
|
-
},
|
|
3724
|
-
enumerable: false,
|
|
3725
|
-
configurable: true
|
|
3726
|
-
});
|
|
3727
|
-
Object.defineProperty(NavItemComponent.prototype, "hasMenuToggle", {
|
|
3728
|
-
get: function () {
|
|
3729
|
-
return this.hasChildren && this.childAction === 'menu';
|
|
3730
|
-
},
|
|
3731
|
-
enumerable: false,
|
|
3732
|
-
configurable: true
|
|
3733
|
-
});
|
|
3734
|
-
Object.defineProperty(NavItemComponent.prototype, "menuTpl", {
|
|
3735
|
-
get: function () {
|
|
3736
|
-
return this.hasMenuToggle ? this._menu : undefined;
|
|
3737
|
-
},
|
|
3738
|
-
enumerable: false,
|
|
3739
|
-
configurable: true
|
|
3740
|
-
});
|
|
3741
|
-
Object.defineProperty(NavItemComponent.prototype, "hasExpandingChildren", {
|
|
3742
|
-
get: function () {
|
|
3743
|
-
return this.hasChildren && this.childAction === 'expand';
|
|
3744
|
-
},
|
|
3745
|
-
enumerable: false,
|
|
3746
|
-
configurable: true
|
|
3747
|
-
});
|
|
3748
|
-
NavItemComponent.prototype._toggleChildren = function (event) {
|
|
3749
|
-
var ex = !this.expanded;
|
|
3750
|
-
if (this.expandAction === 'expandOnly') {
|
|
3751
|
-
ex = true;
|
|
3752
|
-
}
|
|
3753
|
-
this.expanded = ex;
|
|
3754
|
-
this.navItemExpanded.emit(this.expanded);
|
|
3755
|
-
// Prevents seam-menu from closing out when toggling child expand
|
|
3756
|
-
event.stopPropagation();
|
|
3757
|
-
};
|
|
3758
|
-
// Updates expanded state when user exits seam-menu
|
|
3759
|
-
NavItemComponent.prototype._menuEvent = function (menuExpanded) {
|
|
3760
|
-
if (menuExpanded === false) {
|
|
3761
|
-
this.expanded = false;
|
|
3762
|
-
// TODO: figure out why closing seam-menu with expanded submenu messes up animation
|
|
3763
|
-
if (this._navItems && this._navItems.length) {
|
|
3764
|
-
this._navItems.forEach(function (navItem) {
|
|
3765
|
-
navItem.expanded = false;
|
|
3766
|
-
});
|
|
3767
|
-
}
|
|
3768
|
-
}
|
|
3769
|
-
};
|
|
3770
|
-
Object.defineProperty(NavItemComponent.prototype, "showIconBlock", {
|
|
3771
|
-
get: function () {
|
|
3772
|
-
return utils.notNullOrUndefined(this.icon) || this.hideEmptyIcon !== true;
|
|
3773
|
-
},
|
|
3774
|
-
enumerable: false,
|
|
3775
|
-
configurable: true
|
|
3776
|
-
});
|
|
3777
|
-
return NavItemComponent;
|
|
3778
|
-
}());
|
|
3779
|
-
NavItemComponent.decorators = [
|
|
3780
|
-
{ type: i0.Component, args: [{
|
|
3781
|
-
selector: 'seam-nav-item',
|
|
3782
|
-
template: "<div class=\"d-flex flex-row h-100\">\n <ng-container *ngIf=\"itemType === 'basic'\">\n <ng-template [ngTemplateOutlet]=\"itemTypeBasic\"></ng-template>\n </ng-container>\n <ng-container *ngIf=\"itemType === 'link'\">\n <ng-template [ngTemplateOutlet]=\"itemTypeLink\"></ng-template>\n </ng-container>\n <ng-container *ngIf=\"itemType === 'divider'\">\n <ng-template [ngTemplateOutlet]=\"itemTypeDivider\"></ng-template>\n </ng-container>\n <ng-container *ngIf=\"itemType === 'title'\">\n <ng-template [ngTemplateOutlet]=\"itemTypeTitle\"></ng-template>\n </ng-container>\n</div>\n\n<ng-container *ngIf=\"hasExpandingChildren\">\n <div class=\"nav--group nav--group--level-{{ hierLevel + 1 }}\"\n *ngIf=\"expanded$ | async\" @childGroupAnim>\n <ng-container *ngTemplateOutlet=\"navChildren\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #itemTypeBasic>\n <button class=\"nav-item btn nav-btn p-0 d-flex align-items-stretch flex-row text-decoration-none w-100\"\n cdkMonitorElementFocus\n (click)=\"_toggleChildren($event)\"\n [seamMenuToggle]=\"menuTpl\"\n (menuToggle)=\"_menuEvent($event)\"\n [attr.aria-expanded]=\"expanded$ | async\">\n <div class=\"nav-link d-flex flex-row align-items-center w-100\" [class.nav-link__compact]=\"compact\">\n <div class=\"nav-item--icon\" *ngIf=\"showIconBlock\">\n <seam-icon [icon]=\"icon\" *ngIf=\"icon\"></seam-icon>\n <ng-container *ngIf=\"compact\">\n <ng-template [ngTemplateOutlet]=\"itemBadge\"></ng-template>\n </ng-container>\n </div>\n <span *ngIf=\"!compact\" nav-item-label>\n {{ label }}\n </span>\n <span *ngIf=\"compact\" class=\"sr-only\" nav-item-label>{{ label }}</span>\n <ng-container *ngIf=\"!compact\">\n <ng-template [ngTemplateOutlet]=\"itemBadge\"></ng-template>\n </ng-container>\n </div>\n\n <div *ngIf=\"hasChildren && !compact\"\n class=\"btn nav-btn nav-item--toggle-btn-container d-flex align-items-center\">\n <seam-icon\n class=\"nav-item--toggle-btn\"\n [class.nav-item--toggle-btn-expanded]=\"expanded$ | async\"\n [icon]=\"faAngleLeft\"\n type>\n </seam-icon>\n </div>\n </button>\n</ng-template>\n\n<ng-template #itemTypeLink>\n <a *ngIf=\"link; else noLink\" class=\"nav-item nav-link d-flex flex-row w-100 align-items-center\"\n [class.nav-link__compact]=\"compact\"\n [routerLink]=\"link\"\n [queryParams]=\"queryParams\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: true }\">\n <div class=\"nav-item--icon\" *ngIf=\"showIconBlock\">\n <seam-icon [icon]=\"icon\" *ngIf=\"icon\"></seam-icon>\n <ng-container *ngIf=\"compact\">\n <ng-template [ngTemplateOutlet]=\"itemBadge\"></ng-template>\n </ng-container>\n </div>\n <span *ngIf=\"!compact\" nav-item-label>\n {{ label }}\n </span>\n <span *ngIf=\"compact\" class=\"sr-only\" nav-item-label>{{ label }}</span>\n <ng-container *ngIf=\"!compact\">\n <ng-template [ngTemplateOutlet]=\"itemBadge\"></ng-template>\n </ng-container>\n </a>\n\n <ng-template #noLink>\n <a class=\"nav-item nav-link d-flex flex-row w-100 align-items-center\" [class.nav-link__compact]=\"compact\">\n <div class=\"nav-item--icon\" *ngIf=\"showIconBlock\">\n <seam-icon [icon]=\"icon\" *ngIf=\"icon\"></seam-icon>\n </div>\n <span *ngIf=\"!compact\" nav-item-label>\n {{ label }}\n </span>\n <span *ngIf=\"compact\" class=\"sr-only\" nav-item-label>{{ label }}</span>\n </a>\n </ng-template>\n\n <button *ngIf=\"hasChildren && !compact\"\n type=\"button\"\n class=\"btn nav-btn nav-item--toggle-btn-container\"\n (click)=\"_toggleChildren($event)\"\n [seamMenuToggle]=\"menuTpl\"\n (menuToggle)=\"_menuEvent($event)\"\n [attr.aria-expanded]=\"expanded$ | async\"\n cdkMonitorElementFocus>\n <seam-icon\n class=\"nav-item--toggle-btn\"\n [class.nav-item--toggle-btn-expanded]=\"expanded$ | async\"\n [icon]=\"faAngleLeft\"\n type>\n </seam-icon>\n <span class=\"sr-only\">Group Toggle</span>\n </button>\n</ng-template>\n\n<ng-template #itemTypeDivider>\n <div class=\"px-2 w-100\">\n <hr class=\"nav-item--divider\" />\n </div>\n</ng-template>\n\n<ng-template #itemTypeTitle>\n <ng-container *ngIf=\"!compact\">\n <span class=\"nav-item--title pt-1\" nav-item-label>{{ label }}</span>\n </ng-container>\n</ng-template>\n\n<ng-template #itemBadge>\n <ng-container *ngIf=\"badgeText\">\n <div class=\"badge-spacer flex-grow-1\" *ngIf=\"!compact\"></div>\n <div class=\"nav-item--badge\"\n [class.nav-item--badge-no-icon]=\"!icon\"\n [ngbTooltip]=\"$any(badgeTooltip)?.tooltip\"\n [tooltipClass]=\"$any(badgeTooltip)?.class\"\n [placement]=\"$any(badgeTooltip)?.placement\"\n [container]=\"$any(badgeTooltip)?.container\"\n [disableTooltip]=\"!badgeTooltip || !!$any(badgeTooltip)?.disabled\">\n <span class=\"badge badge-pill badge-{{ badgeTheme }}\">\n <ng-container *ngIf=\"!compact || !icon\">\n {{ badgeText }}\n </ng-container>\n <span *ngIf=\"badgeSrContent\">{{ badgeSrContent }}</span>\n </span>\n </div>\n </ng-container>\n</ng-template>\n\n<seam-menu #menu *ngIf=\"hasMenuToggle\">\n <ng-container *ngTemplateOutlet=\"navChildren\"></ng-container>\n</seam-menu>\n\n<ng-template #navChildren>\n <seam-nav-item *ngFor=\"let child of children\"\n [item]=\"child\"\n [hierLevel]=\"compact ? 0 : (hierLevel + 1)\"\n [compact]=\"compact\"\n [itemType]=\"$any(child).itemType\"\n [icon]=\"$any(child).icon\"\n [label]=\"$any(child).label\"\n [link]=\"$any(child).link\"\n [badgeText]=\"$any(child).badge?.text\"\n [badgeTheme]=\"$any(child).badge?.theme || 'danger'\"\n [badgeSrContent]=\"$any(child).badge?.srContent\"\n [badgeTooltip]=\"$any(child)?.badge?.tooltip\"\n [queryParams]=\"$any(child).queryParams\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n [children]=\"$any(child)?.children\"\n [active]=\"$any(child).__state?.active\"\n [expanded]=\"$any(child).__state?.expanded\"\n childAction=\"expand\"\n [hideEmptyIcon]=\"hideEmptyIcon\">\n </seam-nav-item>\n</ng-template>\n\n",
|
|
3783
|
-
exportAs: 'seamNavItem',
|
|
3784
|
-
animations: [
|
|
3785
|
-
animations.trigger('childGroupAnim', [
|
|
3786
|
-
animations.transition(':enter', [
|
|
3787
|
-
animations.style({ height: 0 }),
|
|
3788
|
-
animations.animate('0.2s ease-in-out', animations.style({ height: '*' }))
|
|
3789
|
-
]),
|
|
3790
|
-
animations.transition(':leave', [
|
|
3791
|
-
animations.style({ height: '*' }),
|
|
3792
|
-
animations.animate('0.2s ease-in-out', animations.style({ height: 0 }))
|
|
3793
|
-
])
|
|
3794
|
-
])
|
|
3795
|
-
],
|
|
3796
|
-
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
3797
|
-
encapsulation: i0.ViewEncapsulation.None,
|
|
3798
|
-
styles: ["seam-nav-item{display:block;transition:.25s ease-in-out background-color;text-align:inherit;border-radius:0;overflow:hidden;background:transparent;margin:0}seam-nav-item.seam-nav-item--expanded{background-color:transparent}seam-nav-item.seam-nav-item--expanded .nav-link{color:#000}seam-nav-item.seam-nav-item--child-active{background-color:#dae0e5}seam-nav-item.seam-nav-item--child-active .nav-link{color:#000}seam-nav-item.seam-nav-item--active{background-color:#dae0e5}seam-nav-item.seam-nav-item--active .active,seam-nav-item.seam-nav-item--active:active,seam-nav-item.seam-nav-item--active .nav-item.active:hover{background-color:#dae0e5}seam-nav-item.seam-nav-item--active .nav-item:hover{background-color:#e9ecef}seam-nav-item.seam-nav-item--active .nav-link{color:#000}seam-nav-item .badge{vertical-align:middle}seam-nav-item:not(.nav-item--icon) .nav-item--badge{pointer-events:all;margin-left:5px;margin-right:3px}seam-nav-item .nav-item--icon{position:relative;width:24px;max-width:24px;min-width:24px;height:24px;max-height:24px;min-height:24px;text-align:center;margin-right:.5rem}seam-nav-item .nav-item--icon .nav-item--badge{top:-4px;right:-4px;position:absolute}seam-nav-item .nav-item--icon .nav-item--badge .badge:empty{display:block;width:8px;height:8px;padding:0}seam-nav-item .nav-item--icon .nav-item--badge.nav-item--badge-no-icon{top:0px;right:0px}seam-nav-item .nav-item{transition:.25s ease-in-out background-color}seam-nav-item .nav-item:hover{background-color:#e9ecef}seam-nav-item .nav-item.active{pointer-events:none;cursor:default}seam-nav-item a.nav-item:not([href]):not([tabindex]){color:#000}seam-nav-item a.nav-item:not([href]):not([tabindex]):hover{background-color:transparent}seam-nav-item .nav-link{color:#000}seam-nav-item .nav-btn{font-weight:400;color:#000;text-decoration:none;border-radius:0;border:0 solid #dee2e6}seam-nav-item .nav-btn:hover{color:#000;text-decoration:underline}seam-nav-item .nav-btn:focus,seam-nav-item .nav-btn.focus{text-decoration:underline;box-shadow:none}seam-nav-item .nav-btn:disabled,seam-nav-item .nav-btn.disabled{color:#000;pointer-events:none}seam-nav-item .cdk-keyboard-focused{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}seam-nav-item .nav-item--toggle-btn-container{transition:.25s ease-in-out background-color;padding:0 .5rem}seam-nav-item button.nav-item--toggle-btn-container:hover{background-color:#e9ecef}seam-nav-item .nav-item--toggle-btn .svg-inline--fa{transition:.1s ease-in-out transform;transform:none}seam-nav-item .nav-item--toggle-btn.nav-item--toggle-btn-expanded .svg-inline--fa{transform:rotate(-90deg)}seam-nav-item .nav--group{will-change:height;overflow:hidden}seam-nav-item .nav--group--level-1{background-color:#eff1f4}seam-nav-item .nav--group--level-2{background-color:#e6eaed}seam-nav-item .nav--group--level-3{background-color:#dde2e7}seam-nav-item .nav--group--level-4{background-color:#d4dae1}seam-nav-item .nav--group--level-5{background-color:#cbd3da}seam-nav-item .nav--group--level-6{background-color:#c2cbd4}seam-nav-item .nav--group--level-7{background-color:#bac3cd}seam-nav-item .nav--group--level-8{background-color:#b1bcc7}seam-nav-item .nav--group--level-9{background-color:#a8b4c1}seam-nav-item .nav-item--divider{display:block;border-top:1px solid #dae0e5;width:100%}seam-nav-item .nav-item--title{color:#000;font-size:24px;padding-left:10px}seam-nav-item .sr-only{top:0;left:0}\n"]
|
|
3799
|
-
},] }
|
|
3800
|
-
];
|
|
3801
|
-
NavItemComponent.ctorParameters = function () { return []; };
|
|
3802
|
-
NavItemComponent.propDecorators = {
|
|
3803
|
-
item: [{ type: i0.Input }],
|
|
3804
|
-
itemType: [{ type: i0.Input }],
|
|
3805
|
-
icon: [{ type: i0.Input }],
|
|
3806
|
-
hideEmptyIcon: [{ type: i0.Input }],
|
|
3807
|
-
label: [{ type: i0.Input }],
|
|
3808
|
-
active: [{ type: i0.Input }],
|
|
3809
|
-
link: [{ type: i0.Input }],
|
|
3810
|
-
queryParams: [{ type: i0.Input }],
|
|
3811
|
-
children: [{ type: i0.Input }],
|
|
3812
|
-
hierLevel: [{ type: i0.Input }],
|
|
3813
|
-
indentSize: [{ type: i0.Input }],
|
|
3814
|
-
expanded: [{ type: i0.Input }],
|
|
3815
|
-
compact: [{ type: i0.Input }],
|
|
3816
|
-
badgeText: [{ type: i0.Input }],
|
|
3817
|
-
badgeTheme: [{ type: i0.Input }],
|
|
3818
|
-
badgeSrContent: [{ type: i0.Input }],
|
|
3819
|
-
badgeTooltip: [{ type: i0.Input }],
|
|
3820
|
-
childAction: [{ type: i0.Input }],
|
|
3821
|
-
expandAction: [{ type: i0.Input }],
|
|
3822
|
-
navItemExpanded: [{ type: i0.Output }],
|
|
3823
|
-
_isActiveCssClass: [{ type: i0.HostBinding, args: ['class.seam-nav-item--active',] }],
|
|
3824
|
-
_isChildActiveCssClass: [{ type: i0.HostBinding, args: ['class.seam-nav-item--child-active',] }],
|
|
3825
|
-
_isExpandedCssClass: [{ type: i0.HostBinding, args: ['class.seam-nav-item--expanded',] }],
|
|
3826
|
-
_attrDataHierLevel: [{ type: i0.HostBinding, args: ['attr.data-hier-level',] }],
|
|
3827
|
-
_menu: [{ type: i0.ViewChild, args: [menu.MenuComponent,] }],
|
|
3828
|
-
_navItems: [{ type: i0.ViewChildren, args: [NavItemComponent,] }]
|
|
3829
|
-
};
|
|
3830
|
-
__decorate([
|
|
3831
|
-
core.InputBoolean()
|
|
3832
|
-
], NavItemComponent.prototype, "active", void 0);
|
|
3833
|
-
__decorate([
|
|
3834
|
-
core.InputNumber(0)
|
|
3835
|
-
], NavItemComponent.prototype, "hierLevel", void 0);
|
|
3836
|
-
__decorate([
|
|
3837
|
-
core.InputNumber(10)
|
|
3838
|
-
], NavItemComponent.prototype, "indentSize", void 0);
|
|
3839
|
-
|
|
3840
|
-
var TheSeamNavService = /** @class */ (function () {
|
|
3841
|
-
function TheSeamNavService(_router) {
|
|
3842
|
-
this._router = _router;
|
|
3843
|
-
this._updatingCount = new rxjs.BehaviorSubject(0);
|
|
3844
|
-
this.itemChanged = new rxjs.Subject();
|
|
3845
|
-
this.loading$ = this._updatingCount.pipe(operators.map(function (count) { return count > 0; }), operators.distinctUntilChanged(), operators.shareReplay({ bufferSize: 1, refCount: true }));
|
|
3846
|
-
}
|
|
3847
|
-
TheSeamNavService.prototype.createItemsObservable = function (items) {
|
|
3848
|
-
var _this = this;
|
|
3849
|
-
return rxjs.defer(function () {
|
|
3850
|
-
_this.updateItemsStates(items);
|
|
3851
|
-
return new rxjs.Observable(function (subscriber) {
|
|
3852
|
-
var stateChangeSub = _this.itemChanged.pipe(operators.switchMap(function (change) {
|
|
3853
|
-
return _this.loading$.pipe(operators.filter(function (loading) { return !loading; }));
|
|
3854
|
-
})).subscribe(function () {
|
|
3855
|
-
subscriber.next(items);
|
|
3856
|
-
});
|
|
3857
|
-
try {
|
|
3858
|
-
_this.updateItemsStates(items);
|
|
3859
|
-
}
|
|
3860
|
-
catch (err) {
|
|
3861
|
-
subscriber.error(err);
|
|
3862
|
-
}
|
|
3863
|
-
var routeChangeSub = _this._router.events.pipe(operators.filter(function (event) { return event instanceof router.NavigationEnd; })).subscribe(function () {
|
|
3864
|
-
try {
|
|
3865
|
-
_this.updateItemsStates(items);
|
|
3866
|
-
}
|
|
3867
|
-
catch (err) {
|
|
3868
|
-
subscriber.error(err);
|
|
3869
|
-
}
|
|
3870
|
-
});
|
|
3871
|
-
return function () {
|
|
3872
|
-
stateChangeSub.unsubscribe();
|
|
3873
|
-
routeChangeSub.unsubscribe();
|
|
3874
|
-
};
|
|
3875
|
-
}).pipe(operators.startWith(items));
|
|
3876
|
-
});
|
|
3877
|
-
};
|
|
3878
|
-
TheSeamNavService.prototype._incUpdatingCount = function () {
|
|
3879
|
-
this._updatingCount.next(this._updatingCount.value + 1);
|
|
3880
|
-
};
|
|
3881
|
-
TheSeamNavService.prototype._decrUpdatingCount = function () {
|
|
3882
|
-
this._updatingCount.next(this._updatingCount.value - 1);
|
|
3883
|
-
};
|
|
3884
|
-
TheSeamNavService.prototype.updateItemsStates = function (items) {
|
|
3885
|
-
var e_1, _a;
|
|
3886
|
-
this._incUpdatingCount();
|
|
3887
|
-
try {
|
|
3888
|
-
try {
|
|
3889
|
-
for (var items_1 = __values(items), items_1_1 = items_1.next(); !items_1_1.done; items_1_1 = items_1.next()) {
|
|
3890
|
-
var item = items_1_1.value;
|
|
3891
|
-
if (horizontalNavItemHasChildren(item)) {
|
|
3892
|
-
this.updateItemsStates(item.children);
|
|
3893
|
-
}
|
|
3894
|
-
this.updateItemState(item);
|
|
3895
|
-
}
|
|
3896
|
-
}
|
|
3897
|
-
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
3898
|
-
finally {
|
|
3899
|
-
try {
|
|
3900
|
-
if (items_1_1 && !items_1_1.done && (_a = items_1.return)) _a.call(items_1);
|
|
3901
|
-
}
|
|
3902
|
-
finally { if (e_1) throw e_1.error; }
|
|
3903
|
-
}
|
|
3904
|
-
this._decrUpdatingCount();
|
|
3905
|
-
}
|
|
3906
|
-
catch (err) {
|
|
3907
|
-
this._decrUpdatingCount();
|
|
3908
|
-
throw err;
|
|
3909
|
-
}
|
|
3910
|
-
};
|
|
3911
|
-
TheSeamNavService.prototype.updateItemState = function (item) {
|
|
3912
|
-
this._incUpdatingCount();
|
|
3913
|
-
try {
|
|
3914
|
-
setDefaultHorizontalNavItemState(item);
|
|
3915
|
-
if (isHorizontalNavItemType(item, 'link')) {
|
|
3916
|
-
var url = this._getUrl(item);
|
|
3917
|
-
if (utils.notNullOrUndefined(url)) {
|
|
3918
|
-
var opts = this._getMatchOptions(item);
|
|
3919
|
-
this.setItemStateProp(item, 'active', this._router.isActive(url, opts));
|
|
3920
|
-
}
|
|
3921
|
-
}
|
|
3922
|
-
// TODO: Implement this in a more optimized way. Unless our apps start
|
|
3923
|
-
// having large navs constantly updating their state, this shouldn't
|
|
3924
|
-
// have much impact on performance.
|
|
3925
|
-
this._updateItemExpandedState(item);
|
|
3926
|
-
this._decrUpdatingCount();
|
|
3927
|
-
}
|
|
3928
|
-
catch (err) {
|
|
3929
|
-
this._decrUpdatingCount();
|
|
3930
|
-
throw err;
|
|
3931
|
-
}
|
|
3932
|
-
};
|
|
3933
|
-
TheSeamNavService.prototype._updateItemsExpandedState = function (items) {
|
|
3934
|
-
var e_2, _a;
|
|
3935
|
-
try {
|
|
3936
|
-
for (var items_2 = __values(items), items_2_1 = items_2.next(); !items_2_1.done; items_2_1 = items_2.next()) {
|
|
3937
|
-
var item = items_2_1.value;
|
|
3938
|
-
if (horizontalNavItemHasChildren(item)) {
|
|
3939
|
-
this._updateItemsExpandedState(item.children);
|
|
3940
|
-
}
|
|
3941
|
-
this._updateItemExpandedState(item);
|
|
3942
|
-
}
|
|
3943
|
-
}
|
|
3944
|
-
catch (e_2_1) { e_2 = { error: e_2_1 }; }
|
|
3945
|
-
finally {
|
|
3946
|
-
try {
|
|
3947
|
-
if (items_2_1 && !items_2_1.done && (_a = items_2.return)) _a.call(items_2);
|
|
3948
|
-
}
|
|
3949
|
-
finally { if (e_2) throw e_2.error; }
|
|
3950
|
-
}
|
|
3951
|
-
};
|
|
3952
|
-
TheSeamNavService.prototype._updateItemExpandedState = function (item) {
|
|
3953
|
-
if (!horizontalNavItemCanExpand(item)) {
|
|
3954
|
-
if (getHorizontalNavItemStateProp(item, 'expanded')) {
|
|
3955
|
-
this.setItemStateProp(item, 'expanded', false);
|
|
3956
|
-
}
|
|
3957
|
-
return;
|
|
3958
|
-
}
|
|
3959
|
-
if (horizontalNavItemHasChildren(item)) {
|
|
3960
|
-
this._updateItemsExpandedState(item.children);
|
|
3961
|
-
}
|
|
3962
|
-
if (horizontalNavItemHasActiveChild(item) || horizontalNavItemHasExpandedChild(item)) {
|
|
3963
|
-
if (!getHorizontalNavItemStateProp(item, 'expanded')) {
|
|
3964
|
-
this.setItemStateProp(item, 'expanded', true);
|
|
3965
|
-
}
|
|
3966
|
-
}
|
|
3967
|
-
else {
|
|
3968
|
-
if (getHorizontalNavItemStateProp(item, 'expanded')) {
|
|
3969
|
-
this.setItemStateProp(item, 'expanded', false);
|
|
3970
|
-
}
|
|
3971
|
-
}
|
|
3972
|
-
};
|
|
3973
|
-
TheSeamNavService.prototype._getNavExtras = function (item) {
|
|
3974
|
-
var navigationExtras = {};
|
|
3975
|
-
if (utils.hasProperty(item, 'queryParams')) {
|
|
3976
|
-
navigationExtras.queryParams = item.queryParams;
|
|
3977
|
-
}
|
|
3978
|
-
if (utils.hasProperty(item, 'fragment')) {
|
|
3979
|
-
navigationExtras.fragment = item.fragment;
|
|
3980
|
-
}
|
|
3981
|
-
if (utils.hasProperty(item, 'queryParamsHandling')) {
|
|
3982
|
-
navigationExtras.queryParamsHandling = item.queryParamsHandling;
|
|
3983
|
-
}
|
|
3984
|
-
if (utils.hasProperty(item, 'preserveFragment')) {
|
|
3985
|
-
navigationExtras.preserveFragment = item.preserveFragment;
|
|
3986
|
-
}
|
|
3987
|
-
return navigationExtras;
|
|
3988
|
-
};
|
|
3989
|
-
TheSeamNavService.prototype._getUrl = function (item) {
|
|
3990
|
-
var link = item.link;
|
|
3991
|
-
if (typeof link === 'string') {
|
|
3992
|
-
return this._router.createUrlTree([link], this._getNavExtras(item)).toString();
|
|
3993
|
-
}
|
|
3994
|
-
else if (Array.isArray(link)) {
|
|
3995
|
-
return this._router.createUrlTree(link, this._getNavExtras(item)).toString();
|
|
3996
|
-
}
|
|
3997
|
-
return null;
|
|
3998
|
-
};
|
|
3999
|
-
TheSeamNavService.prototype._getMatchOptions = function (item) {
|
|
4000
|
-
var defaultMatchOpts = {
|
|
4001
|
-
paths: 'subset',
|
|
4002
|
-
queryParams: 'subset',
|
|
4003
|
-
fragment: 'ignored',
|
|
4004
|
-
matrixParams: 'ignored'
|
|
4005
|
-
};
|
|
4006
|
-
if (utils.hasProperty(item, 'matchOptions')) {
|
|
4007
|
-
return Object.assign(Object.assign({}, defaultMatchOpts), item.matchOptions);
|
|
4008
|
-
}
|
|
4009
|
-
return defaultMatchOpts;
|
|
4010
|
-
};
|
|
4011
|
-
TheSeamNavService.prototype.setItemStateProp = function (item, prop, value) {
|
|
4012
|
-
var currentValue = getHorizontalNavItemStateProp(item, prop);
|
|
4013
|
-
if (currentValue !== value) {
|
|
4014
|
-
setHorizontalNavItemStateProp(item, prop, value);
|
|
4015
|
-
var changed = {
|
|
4016
|
-
item: item,
|
|
4017
|
-
prop: prop,
|
|
4018
|
-
prevValue: currentValue,
|
|
4019
|
-
newValue: value
|
|
4020
|
-
};
|
|
4021
|
-
this.itemChanged.next(changed);
|
|
4022
|
-
}
|
|
4023
|
-
};
|
|
4024
|
-
return TheSeamNavService;
|
|
4025
|
-
}());
|
|
4026
|
-
TheSeamNavService.decorators = [
|
|
4027
|
-
{ type: i0.Injectable }
|
|
4028
|
-
];
|
|
4029
|
-
TheSeamNavService.ctorParameters = function () { return [
|
|
4030
|
-
{ type: router.Router }
|
|
4031
|
-
]; };
|
|
4032
|
-
|
|
4033
|
-
var HorizontalNavComponent = /** @class */ (function () {
|
|
4034
|
-
function HorizontalNavComponent() {
|
|
4035
|
-
this._ngUnsubscribe = new rxjs.Subject();
|
|
4036
|
-
this._items = new rxjs.BehaviorSubject([]);
|
|
4037
|
-
this.hideEmptyIcon = true;
|
|
4038
|
-
this.hierLevel = 0;
|
|
4039
|
-
this.childAction = 'menu';
|
|
4040
|
-
this.expandAction = 'toggle';
|
|
4041
|
-
this._focusedNavItem = new rxjs.BehaviorSubject(undefined);
|
|
4042
|
-
this.focusedNavItem$ = this._focusedNavItem.asObservable();
|
|
4043
|
-
this.navItemExpanded = new i0.EventEmitter();
|
|
4044
|
-
this.items$ = this._items.asObservable();
|
|
4045
|
-
}
|
|
4046
|
-
Object.defineProperty(HorizontalNavComponent.prototype, "items", {
|
|
4047
|
-
get: function () { return this._items.value; },
|
|
4048
|
-
set: function (value) {
|
|
4049
|
-
this._items.next(value);
|
|
4050
|
-
},
|
|
4051
|
-
enumerable: false,
|
|
4052
|
-
configurable: true
|
|
4053
|
-
});
|
|
4054
|
-
Object.defineProperty(HorizontalNavComponent.prototype, "focusedNavItem", {
|
|
4055
|
-
/**
|
|
4056
|
-
* The 'focused' nav item refers to the item in
|
|
4057
|
-
* the list that was most recently expanded or activated.
|
|
4058
|
-
* // TODO: make all this better
|
|
4059
|
-
*/
|
|
4060
|
-
get: function () {
|
|
4061
|
-
return this._focusedNavItem.value;
|
|
4062
|
-
},
|
|
4063
|
-
set: function (value) {
|
|
4064
|
-
this._focusedNavItem.next(value);
|
|
4065
|
-
},
|
|
4066
|
-
enumerable: false,
|
|
4067
|
-
configurable: true
|
|
4068
|
-
});
|
|
4069
|
-
HorizontalNavComponent.prototype.ngOnInit = function () { };
|
|
4070
|
-
HorizontalNavComponent.prototype.ngOnDestroy = function () {
|
|
4071
|
-
this._ngUnsubscribe.next();
|
|
4072
|
-
this._ngUnsubscribe.complete();
|
|
4073
|
-
};
|
|
4074
|
-
HorizontalNavComponent.prototype._navItemExpanded = function (item, expanded) {
|
|
4075
|
-
this.navItemExpanded.emit({ navItem: item, expanded: expanded });
|
|
4076
|
-
};
|
|
4077
|
-
HorizontalNavComponent.prototype._navItemIsFocused = function (item) {
|
|
4078
|
-
return this.focusedNavItem$.pipe(operators.map(function (focusedNavItem) { return areSameHorizontalNavItem(focusedNavItem, item); }));
|
|
4079
|
-
};
|
|
4080
|
-
return HorizontalNavComponent;
|
|
4081
|
-
}());
|
|
4082
|
-
HorizontalNavComponent.decorators = [
|
|
4083
|
-
{ type: i0.Component, args: [{
|
|
4084
|
-
selector: 'seam-horizontal-nav',
|
|
4085
|
-
template: "<div class=\"nav-inner-wrapper\" class=\"nav-inner-wrapper-{{hierLevel}}\">\n <div class=\"nav-items-row\">\n <seam-nav-item *ngFor=\"let item of items$ | async\"\n class=\"flex-shrink-0\"\n [item]=\"item\"\n [itemType]=\"$any(item)?.itemType\"\n [icon]=\"$any(item)?.icon\"\n [label]=\"$any(item)?.label\"\n [link]=\"$any(item)?.link\"\n [badgeText]=\"$any(item)?.badge?.text\"\n [badgeTheme]=\"$any(item)?.badge?.theme || 'danger'\"\n [badgeSrContent]=\"$any(item)?.badge?.srContent\"\n [badgeTooltip]=\"$any(item)?.badge?.tooltip\"\n [queryParams]=\"$any(item)?.queryParams\"\n [children]=\"$any(item)?.children\"\n [active]=\"$any(item).__state?.active\"\n [expanded]=\"$any(item).__state?.expanded\"\n [hierLevel]=\"hierLevel\"\n [childAction]=\"childAction\"\n [expandAction]=\"expandAction\"\n (navItemExpanded)=\"_navItemExpanded(item, $event)\"\n [class.seam-nav-item--focused]=\"_navItemIsFocused(item) | async\"\n [hideEmptyIcon]=\"hideEmptyIcon\">\n </seam-nav-item>\n </div>\n</div>\n",
|
|
4086
|
-
providers: [
|
|
4087
|
-
TheSeamNavService
|
|
4088
|
-
],
|
|
4089
|
-
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
4090
|
-
encapsulation: i0.ViewEncapsulation.None,
|
|
4091
|
-
styles: ["seam-horizontal-nav,.seam-horizontal-nav{display:block;height:100%;position:relative;z-index:2}seam-horizontal-nav .nav-inner-wrapper,.seam-horizontal-nav .nav-inner-wrapper{background:none;height:100%}seam-horizontal-nav .nav-backdrop,.seam-horizontal-nav .nav-backdrop{background:rgba(52,58,64,.6);width:100vw;height:100vh}seam-horizontal-nav .nav-backdrop.nav-backdrop-hidden,.seam-horizontal-nav .nav-backdrop.nav-backdrop-hidden{display:none;width:0;height:0;padding:0;margin:0}seam-horizontal-nav .nav-content,.seam-horizontal-nav .nav-content{display:flex;flex-direction:column;height:100%;flex-wrap:nowrap}seam-horizontal-nav .nav-items-container,.seam-horizontal-nav .nav-items-container{display:flex;flex-direction:column;width:100%;flex:1 1 100%}seam-horizontal-nav .nav-items-row,.seam-horizontal-nav .nav-items-row{height:100%;display:flex;padding:.25rem .5rem}\n"]
|
|
4092
|
-
},] }
|
|
4093
|
-
];
|
|
4094
|
-
HorizontalNavComponent.ctorParameters = function () { return []; };
|
|
4095
|
-
HorizontalNavComponent.propDecorators = {
|
|
4096
|
-
items: [{ type: i0.Input }],
|
|
4097
|
-
hideEmptyIcon: [{ type: i0.Input }],
|
|
4098
|
-
hierLevel: [{ type: i0.Input }],
|
|
4099
|
-
childAction: [{ type: i0.Input }],
|
|
4100
|
-
expandAction: [{ type: i0.Input }],
|
|
4101
|
-
focusedNavItem: [{ type: i0.Input }],
|
|
4102
|
-
navItemExpanded: [{ type: i0.Output }]
|
|
4103
|
-
};
|
|
4104
|
-
|
|
4105
|
-
var TheSeamNavModule = /** @class */ (function () {
|
|
4106
|
-
function TheSeamNavModule() {
|
|
4107
|
-
}
|
|
4108
|
-
return TheSeamNavModule;
|
|
4109
|
-
}());
|
|
4110
|
-
TheSeamNavModule.decorators = [
|
|
4111
|
-
{ type: i0.NgModule, args: [{
|
|
4112
|
-
declarations: [
|
|
4113
|
-
NavItemComponent,
|
|
4114
|
-
HorizontalNavComponent,
|
|
4115
|
-
],
|
|
4116
|
-
imports: [
|
|
4117
|
-
common.CommonModule,
|
|
4118
|
-
router.RouterModule,
|
|
4119
|
-
icon.TheSeamIconModule,
|
|
4120
|
-
a11y.A11yModule,
|
|
4121
|
-
scrollbar.TheSeamScrollbarModule,
|
|
4122
|
-
layout.TheSeamLayoutModule,
|
|
4123
|
-
ngBootstrap.NgbTooltipModule,
|
|
4124
|
-
portal.PortalModule,
|
|
4125
|
-
menu.TheSeamMenuModule
|
|
4126
|
-
],
|
|
4127
|
-
exports: [
|
|
4128
|
-
NavItemComponent,
|
|
4129
|
-
HorizontalNavComponent,
|
|
4130
|
-
],
|
|
4131
|
-
providers: [
|
|
4132
|
-
TheSeamNavService,
|
|
4133
|
-
]
|
|
4134
|
-
},] }
|
|
4135
|
-
];
|
|
4136
|
-
|
|
4137
3306
|
/**
|
|
4138
3307
|
* Generated bundle index. Do not edit.
|
|
4139
3308
|
*/
|
|
@@ -4153,8 +3322,6 @@
|
|
|
4153
3322
|
exports.DashboardWidgetsService = DashboardWidgetsService;
|
|
4154
3323
|
exports.HierarchyLevelResolver = HierarchyLevelResolver;
|
|
4155
3324
|
exports.HierarchyRouterOutletComponent = HierarchyRouterOutletComponent;
|
|
4156
|
-
exports.HorizontalNavComponent = HorizontalNavComponent;
|
|
4157
|
-
exports.NavItemComponent = NavItemComponent;
|
|
4158
3325
|
exports.SideNavComponent = SideNavComponent;
|
|
4159
3326
|
exports.SideNavItemComponent = SideNavItemComponent;
|
|
4160
3327
|
exports.SideNavToggleComponent = SideNavToggleComponent;
|
|
@@ -4166,7 +3333,6 @@
|
|
|
4166
3333
|
exports.TheSeamDashboardModule = TheSeamDashboardModule;
|
|
4167
3334
|
exports.TheSeamDynamicRouterModule = TheSeamDynamicRouterModule;
|
|
4168
3335
|
exports.TheSeamFramework = TheSeamFramework;
|
|
4169
|
-
exports.TheSeamNavModule = TheSeamNavModule;
|
|
4170
3336
|
exports.TheSeamSchemaFormFrameworkComponent = TheSeamSchemaFormFrameworkComponent;
|
|
4171
3337
|
exports.TheSeamSchemaFormModule = TheSeamSchemaFormModule;
|
|
4172
3338
|
exports.TheSeamSideNavModule = TheSeamSideNavModule;
|
|
@@ -4177,34 +3343,20 @@
|
|
|
4177
3343
|
exports.TopBarMenuButtonComponent = TopBarMenuButtonComponent;
|
|
4178
3344
|
exports.TopBarMenuDirective = TopBarMenuDirective;
|
|
4179
3345
|
exports.TopBarTitleComponent = TopBarTitleComponent;
|
|
4180
|
-
exports.areSameHorizontalNavItem = areSameHorizontalNavItem;
|
|
4181
3346
|
exports.canBeActive = canBeActive;
|
|
4182
3347
|
exports.canExpand = canExpand;
|
|
4183
3348
|
exports.canHaveChildren = canHaveChildren;
|
|
4184
3349
|
exports.fader = fader;
|
|
4185
|
-
exports.findHorizontalNavLinkItems = findHorizontalNavLinkItems;
|
|
4186
3350
|
exports.findLinkItems = findLinkItems;
|
|
4187
|
-
exports.getHorizontalNavItemStateProp = getHorizontalNavItemStateProp;
|
|
4188
3351
|
exports.getItemStateProp = getItemStateProp;
|
|
4189
3352
|
exports.hasActiveChild = hasActiveChild;
|
|
4190
3353
|
exports.hasChildren = hasChildren;
|
|
4191
3354
|
exports.hasExpandedChild = hasExpandedChild;
|
|
4192
|
-
exports.horizontalNavItemCanBeActive = horizontalNavItemCanBeActive;
|
|
4193
|
-
exports.horizontalNavItemCanExpand = horizontalNavItemCanExpand;
|
|
4194
|
-
exports.horizontalNavItemCanHaveChildren = horizontalNavItemCanHaveChildren;
|
|
4195
|
-
exports.horizontalNavItemHasActiveChild = horizontalNavItemHasActiveChild;
|
|
4196
|
-
exports.horizontalNavItemHasChildren = horizontalNavItemHasChildren;
|
|
4197
|
-
exports.horizontalNavItemHasExpandedChild = horizontalNavItemHasExpandedChild;
|
|
4198
3355
|
exports.isExpanded = isExpanded;
|
|
4199
|
-
exports.isHorizontalNavItemActive = isHorizontalNavItemActive;
|
|
4200
|
-
exports.isHorizontalNavItemExpanded = isHorizontalNavItemExpanded;
|
|
4201
|
-
exports.isHorizontalNavItemType = isHorizontalNavItemType;
|
|
4202
3356
|
exports.isNavItemActive = isNavItemActive;
|
|
4203
3357
|
exports.isNavItemType = isNavItemType;
|
|
4204
3358
|
exports.routeChanges = routeChanges;
|
|
4205
|
-
exports.setDefaultHorizontalNavItemState = setDefaultHorizontalNavItemState;
|
|
4206
3359
|
exports.setDefaultState = setDefaultState;
|
|
4207
|
-
exports.setHorizontalNavItemStateProp = setHorizontalNavItemStateProp;
|
|
4208
3360
|
exports.setItemStateProp = setItemStateProp;
|
|
4209
3361
|
exports.sideNavExpandStateChangeFn = sideNavExpandStateChangeFn;
|
|
4210
3362
|
exports.sideToSide = sideToSide;
|
|
@@ -4212,18 +3364,14 @@
|
|
|
4212
3364
|
exports.stepper = stepper;
|
|
4213
3365
|
exports.transformer = transformer;
|
|
4214
3366
|
exports["ɵa"] = BaseLayoutSideBarFooterDirective;
|
|
4215
|
-
exports["ɵb"] =
|
|
4216
|
-
exports["ɵc"] =
|
|
4217
|
-
exports["ɵd"] =
|
|
4218
|
-
exports["ɵe"] =
|
|
4219
|
-
exports["ɵf"] =
|
|
4220
|
-
exports["ɵg"] =
|
|
4221
|
-
exports["ɵh"] =
|
|
4222
|
-
exports["ɵi"] =
|
|
4223
|
-
exports["ɵj"] = TheSeamSchemaFormInputComponent;
|
|
4224
|
-
exports["ɵk"] = TheSeamSchemaFormNumberComponent;
|
|
4225
|
-
exports["ɵl"] = TheSeamSchemaFormSubmitSplitComponent;
|
|
4226
|
-
exports["ɵm"] = TheSeamNavService;
|
|
3367
|
+
exports["ɵb"] = TheSeamSideNavService;
|
|
3368
|
+
exports["ɵc"] = TheSeamSchemaFormControlsModule;
|
|
3369
|
+
exports["ɵd"] = TheSeamSchemaFormCheckboxComponent;
|
|
3370
|
+
exports["ɵe"] = TheSeamSchemaFormSubmitComponent;
|
|
3371
|
+
exports["ɵf"] = TheSeamSchemaFormSelectComponent;
|
|
3372
|
+
exports["ɵg"] = TheSeamSchemaFormInputComponent;
|
|
3373
|
+
exports["ɵh"] = TheSeamSchemaFormNumberComponent;
|
|
3374
|
+
exports["ɵi"] = TheSeamSchemaFormSubmitSplitComponent;
|
|
4227
3375
|
|
|
4228
3376
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4229
3377
|
|