diff --git a/CHANGELOG.md b/CHANGELOG.md
index 908f58b8..fb28592a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,52 @@
### [@coreui/angular](https://coreui.io/) changelog
+##### `v2.4.0`
+`dist` is the same as `v2.4.0-beta.1`
+- update: `@angular/animations` to `^7.2.5`
+- update: `@angular/common` to `^7.2.5`
+- update: `@angular/compiler` to `^7.2.5`
+- update: `@angular/core` to `^7.2.5`
+- update: `@angular/forms` to `^7.2.5`
+- update: `@angular/http` to `^7.2.5`
+- update: `@angular/platform-browser` to `^7.2.5`
+- update: `@angular/platform-browser-dynamic` to `^7.2.5`
+- update: `@angular/router` to `^7.2.5`
+- update: `@angular-devkit/build-angular` to `^0.13.2`
+- update: `@angular-devkit/build-ng-packagr` to `^0.13.2`
+- update: `@angular/cli` to `^7.3.2`
+- update: `@angular/compiler-cli` to `^7.2.5`
+- update: `@angular/language-service` to `^7.2.5`
+- update: `@types/node` to `^11.9.4`
+- update: `karma` to `^4.0.0`
+- update: `karma-coverage-istanbul-reporter` to `^2.0.5`
+
+##### `v2.4.0-beta.1`
+- fix(sidebar): navItems reassignment bug [#126](https://github.com/coreui/coreui-free-angular-admin-template/issues/126), [#42](https://github.com/coreui/coreui-free-angular-admin-template/issues/42), #12
+- refactor(aside): drop `Replace`
+- refactor(breadcrumb): drop `Replace` new component `cui-breadcrumb` (migration needed)
+- refactor(footer): minor changes
+- refactor(header): drop `Replace`
+- refactor(layout): cleanup
+- refactor(sidebar-nav): drop `Replace`, redesign
+- update: `@angular/animations` to `^7.2.4`
+- update: `@angular/common` to `^7.2.4`
+- update: `@angular/compiler` to `^7.2.4`
+- update: `@angular/core` to `^7.2.4`
+- update: `@angular/forms` to `^7.2.4`
+- update: `@angular/http` to `^7.2.4`
+- update: `@angular/platform-browser` to `^7.2.4`
+- update: `@angular/platform-browser-dynamic` to `^7.2.4`
+- update: `@angular/router` to `^7.2.4`
+- update: `core-js` to `^2.6.5`
+- update: `@angular-devkit/build-angular` to `^0.13.1`
+- update: `@angular-devkit/build-ng-packagr` to `^0.13.1`
+- update: `@angular/cli` to `^7.3.1`
+- update: `@angular/compiler-cli` to `^7.2.4`
+- update: `@angular/language-service` to `^7.2.4`
+- update: `@types/jasmine` to `^3.3.9`
+- update: `@types/node` to `^10.12.26`
+- update: `ng-packagr` to `^4.7.1`
+
##### `v2.3.1`
- fix: faulty LayoutModule import causes: Unexpected value 'undefined' imported by the module #47
- refactor(appSidebarToggler): inject `ClassToggler` instead of ToggleClasses function
diff --git a/dist/@coreui/angular/bundles/coreui-angular.umd.js b/dist/@coreui/angular/bundles/coreui-angular.umd.js
index a4cefe40..5d34c332 100644
--- a/dist/@coreui/angular/bundles/coreui-angular.umd.js
+++ b/dist/@coreui/angular/bundles/coreui-angular.umd.js
@@ -1,8 +1,8 @@
(function (global, factory) {
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('rxjs/index'), require('rxjs/operators'), require('@angular/core'), require('@angular/common'), require('@angular/router')) :
- typeof define === 'function' && define.amd ? define('@coreui/angular', ['exports', 'rxjs/index', 'rxjs/operators', '@angular/core', '@angular/common', '@angular/router'], factory) :
- (factory((global.coreui = global.coreui || {}, global.coreui.angular = {}),global.rxjs.index,global.rxjs.operators,global.ng.core,global.ng.common,global.ng.router));
-}(this, (function (exports,index,operators,core,common,router) { 'use strict';
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('rxjs/index'), require('rxjs/operators'), require('@angular/router'), require('@angular/common'), require('@angular/core')) :
+ typeof define === 'function' && define.amd ? define('@coreui/angular', ['exports', 'rxjs/index', 'rxjs/operators', '@angular/router', '@angular/common', '@angular/core'], factory) :
+ (factory((global.coreui = global.coreui || {}, global.coreui.angular = {}),global.rxjs.index,global.rxjs.operators,global.ng.router,global.ng.common,global.ng.core));
+}(this, (function (exports,index,operators,router,common,core) { 'use strict';
/**
* @fileoverview added by tsickle
@@ -162,7 +162,6 @@
body.classList.contains('sidebar-minimized') ?
this.renderer.removeClass(body, 'sidebar-minimized') :
this.renderer.addClass(body, 'sidebar-minimized');
- // document.body.classList.toggle('sidebar-minimized');
};
SidebarMinimizeDirective.decorators = [
{ type: core.Directive, args: [{
@@ -186,25 +185,6 @@
this.document = document;
this.renderer = renderer;
}
- // Check if element has class
- // Check if element has class
- /**
- * @private
- * @param {?} target
- * @param {?} elementClassName
- * @return {?}
- */
- MobileSidebarToggleDirective.prototype.hasClass =
- // Check if element has class
- /**
- * @private
- * @param {?} target
- * @param {?} elementClassName
- * @return {?}
- */
- function (target, elementClassName) {
- return new RegExp('(\\s|^)' + elementClassName + '(\\s|$)').test(target.className);
- };
/**
* @param {?} $event
* @return {?}
@@ -220,7 +200,6 @@
body.classList.contains('sidebar-show') ?
this.renderer.removeClass(body, 'sidebar-show') :
this.renderer.addClass(body, 'sidebar-show');
- // document.body.classList.toggle('sidebar-show');
};
MobileSidebarToggleDirective.decorators = [
{ type: core.Directive, args: [{
@@ -247,54 +226,6 @@
this.document = document;
this.renderer = renderer;
}
- // Check if element has class
- // Check if element has class
- /**
- * @private
- * @param {?} target
- * @param {?} elementClassName
- * @return {?}
- */
- SidebarOffCanvasCloseDirective.prototype.hasClass =
- // Check if element has class
- /**
- * @private
- * @param {?} target
- * @param {?} elementClassName
- * @return {?}
- */
- function (target, elementClassName) {
- return new RegExp('(\\s|^)' + elementClassName + '(\\s|$)').test(target.className);
- };
- // Toggle element class
- // Toggle element class
- /**
- * @private
- * @param {?} elem
- * @param {?} elementClassName
- * @return {?}
- */
- SidebarOffCanvasCloseDirective.prototype.toggleClass =
- // Toggle element class
- /**
- * @private
- * @param {?} elem
- * @param {?} elementClassName
- * @return {?}
- */
- function (elem, elementClassName) {
- /** @type {?} */
- var newClass = ' ' + elem.className.replace(/[\t\r\n]/g, ' ') + ' ';
- if (this.hasClass(elem, elementClassName)) {
- while (newClass.indexOf(' ' + elementClassName + ' ') >= 0) {
- newClass = newClass.replace(' ' + elementClassName + ' ', ' ');
- }
- elem.className = newClass.replace(/^\s+|\s+$/g, '');
- }
- else {
- elem.className += ' ' + elementClassName;
- }
- };
/**
* @param {?} $event
* @return {?}
@@ -307,11 +238,10 @@
$event.preventDefault();
/** @type {?} */
var body = this.document.body;
- if (this.hasClass(body, 'sidebar-off-canvas')) {
+ if (body.classList.contains('sidebar-off-canvas')) {
body.classList.contains('sidebar-show') ?
this.renderer.removeClass(body, 'sidebar-show') :
this.renderer.addClass(body, 'sidebar-show');
- // this.toggleClass(document.body, 'sidebar-opened');
}
};
SidebarOffCanvasCloseDirective.decorators = [
@@ -351,7 +281,6 @@
body.classList.contains('brand-minimized') ?
this.renderer.removeClass(body, 'brand-minimized') :
this.renderer.addClass(body, 'brand-minimized');
- // document.body.classList.toggle('brand-minimized');
};
BrandMinimizeDirective.decorators = [
{ type: core.Directive, args: [{
@@ -419,8 +348,7 @@
return AsideToggleDirective;
}());
var HtmlAttributesDirective = /** @class */ (function () {
- function HtmlAttributesDirective(document, renderer, el) {
- this.document = document;
+ function HtmlAttributesDirective(renderer, el) {
this.renderer = renderer;
this.el = el;
}
@@ -507,7 +435,6 @@
/** @nocollapse */
HtmlAttributesDirective.ctorParameters = function () {
return [
- { type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] },
{ type: core.Renderer2 },
{ type: core.ElementRef }
];
@@ -592,10 +519,12 @@
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AppAsideComponent = /** @class */ (function () {
- function AppAsideComponent(document, renderer, el) {
+ function AppAsideComponent(document, renderer, hostElement) {
this.document = document;
this.renderer = renderer;
- this.el = el;
+ this.hostElement = hostElement;
+ this.fixedClass = 'aside-menu-fixed';
+ renderer.addClass(hostElement.nativeElement, 'aside-menu');
}
/**
* @return {?}
@@ -604,7 +533,6 @@
* @return {?}
*/
function () {
- Replace(this.el);
this.isFixed(this.fixed);
this.isOffCanvas(this.offCanvas);
this.displayBreakpoint(this.display);
@@ -616,7 +544,7 @@
* @return {?}
*/
function () {
- this.renderer.removeClass(this.document.body, 'aside-menu-fixed');
+ this.renderer.removeClass(this.document.body, this.fixedClass);
};
/**
* @param {?=} fixed
@@ -631,7 +559,7 @@
fixed = this.fixed;
}
if (fixed) {
- this.renderer.addClass(this.document.body, 'aside-menu-fixed');
+ this.renderer.addClass(this.document.body, this.fixedClass);
}
};
/**
@@ -670,8 +598,8 @@
};
AppAsideComponent.decorators = [
{ type: core.Component, args: [{
- selector: 'app-aside',
- template: "\n \n "
+ selector: 'app-aside, cui-aside',
+ template: ""
}] }
];
/** @nocollapse */
@@ -795,6 +723,7 @@
this.renderer = renderer;
this.service = service;
this.el = el;
+ this.fixedClass = 'breadcrumb-fixed';
}
/**
* @return {?}
@@ -814,7 +743,7 @@
* @return {?}
*/
function () {
- this.renderer.removeClass(this.document.body, 'breadcrumb-fixed');
+ this.renderer.removeClass(this.document.body, this.fixedClass);
};
/**
* @param {?=} fixed
@@ -829,7 +758,7 @@
fixed = this.fixed;
}
if (fixed) {
- this.renderer.addClass(this.document.body, 'breadcrumb-fixed');
+ this.renderer.addClass(this.document.body, this.fixedClass);
}
};
AppBreadcrumbComponent.decorators = [
@@ -853,6 +782,72 @@
return AppBreadcrumbComponent;
}());
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var CuiBreadcrumbComponent = /** @class */ (function () {
+ function CuiBreadcrumbComponent(document, renderer, service) {
+ this.document = document;
+ this.renderer = renderer;
+ this.service = service;
+ this.fixedClass = 'breadcrumb-fixed';
+ }
+ /**
+ * @return {?}
+ */
+ CuiBreadcrumbComponent.prototype.ngOnInit = /**
+ * @return {?}
+ */
+ function () {
+ this.isFixed(this.fixed);
+ this.breadcrumbs = this.service.breadcrumbs;
+ };
+ /**
+ * @return {?}
+ */
+ CuiBreadcrumbComponent.prototype.ngOnDestroy = /**
+ * @return {?}
+ */
+ function () {
+ this.renderer.removeClass(this.document.body, this.fixedClass);
+ };
+ /**
+ * @param {?=} fixed
+ * @return {?}
+ */
+ CuiBreadcrumbComponent.prototype.isFixed = /**
+ * @param {?=} fixed
+ * @return {?}
+ */
+ function (fixed) {
+ if (fixed === void 0) {
+ fixed = this.fixed;
+ }
+ if (fixed) {
+ this.renderer.addClass(this.document.body, this.fixedClass);
+ }
+ };
+ CuiBreadcrumbComponent.decorators = [
+ { type: core.Component, args: [{
+ selector: 'cui-breadcrumb',
+ template: "\n \n - \n {{breadcrumb.label.title}}\n {{breadcrumb.label.title}}\n
\n \n \n
\n"
+ }] }
+ ];
+ /** @nocollapse */
+ CuiBreadcrumbComponent.ctorParameters = function () {
+ return [
+ { type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] },
+ { type: core.Renderer2 },
+ { type: AppBreadcrumbService }
+ ];
+ };
+ CuiBreadcrumbComponent.propDecorators = {
+ fixed: [{ type: core.Input }]
+ };
+ return CuiBreadcrumbComponent;
+ }());
+
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -880,8 +875,8 @@
AppBreadcrumbModule.decorators = [
{ type: core.NgModule, args: [{
imports: [common.CommonModule, router.RouterModule],
- exports: [AppBreadcrumbComponent],
- declarations: [AppBreadcrumbComponent]
+ exports: [AppBreadcrumbComponent, CuiBreadcrumbComponent],
+ declarations: [AppBreadcrumbComponent, CuiBreadcrumbComponent]
},] }
];
return AppBreadcrumbModule;
@@ -897,10 +892,12 @@
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AppFooterComponent = /** @class */ (function () {
- function AppFooterComponent(document, renderer) {
+ function AppFooterComponent(document, renderer, hostElement) {
this.document = document;
this.renderer = renderer;
+ this.hostElement = hostElement;
this.fixedClass = 'footer-fixed';
+ renderer.addClass(hostElement.nativeElement, 'app-footer');
}
/**
* @return {?}
@@ -946,12 +943,12 @@
AppFooterComponent.ctorParameters = function () {
return [
{ type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] },
- { type: core.Renderer2 }
+ { type: core.Renderer2 },
+ { type: core.ElementRef }
];
};
AppFooterComponent.propDecorators = {
- fixed: [{ type: core.Input }],
- true: [{ type: core.HostBinding, args: ['class.app-footer',] }]
+ fixed: [{ type: core.Input }]
};
return AppFooterComponent;
}());
@@ -983,13 +980,15 @@
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AppHeaderComponent = /** @class */ (function () {
- function AppHeaderComponent(document, renderer, el) {
+ function AppHeaderComponent(document, renderer, hostElement) {
this.document = document;
this.renderer = renderer;
- this.el = el;
+ this.hostElement = hostElement;
this.navbarBrandText = { icon: '🅲', text: '🅲 CoreUI' };
this.navbarBrandHref = '';
this.fixedClass = 'header-fixed';
+ renderer.addClass(hostElement.nativeElement, 'app-header');
+ renderer.addClass(hostElement.nativeElement, 'navbar');
}
/**
* @return {?}
@@ -998,7 +997,6 @@
* @return {?}
*/
function () {
- Replace(this.el);
this.isFixed(this.fixed);
this.navbarBrandImg = Boolean(this.navbarBrand || this.navbarBrandFull || this.navbarBrandMinimized);
};
@@ -1029,8 +1027,8 @@
};
AppHeaderComponent.decorators = [
{ type: core.Component, args: [{
- selector: 'app-header',
- template: "\n \n "
+ selector: 'app-header, cui-header',
+ template: "\n \n\n\n \n ![]()
\n ![]()
\n ![]()
\n \n \n \n \n \n\n\n \n\n\n\n \n\n\n \n\n"
}] }
];
/** @nocollapse */
@@ -1086,142 +1084,16 @@
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- var AppSidebarFooterComponent = /** @class */ (function () {
- function AppSidebarFooterComponent(el) {
- this.el = el;
- }
- /**
- * @return {?}
- */
- AppSidebarFooterComponent.prototype.ngOnInit = /**
- * @return {?}
- */
- function () {
- Replace(this.el);
- };
- AppSidebarFooterComponent.decorators = [
- { type: core.Component, args: [{
- selector: 'app-sidebar-footer',
- template: "\n "
- }] }
- ];
- /** @nocollapse */
- AppSidebarFooterComponent.ctorParameters = function () {
- return [
- { type: core.ElementRef }
- ];
- };
- return AppSidebarFooterComponent;
- }());
-
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- var AppSidebarFormComponent = /** @class */ (function () {
- function AppSidebarFormComponent(el) {
- this.el = el;
- }
- /**
- * @return {?}
- */
- AppSidebarFormComponent.prototype.ngOnInit = /**
- * @return {?}
- */
- function () {
- Replace(this.el);
- };
- AppSidebarFormComponent.decorators = [
- { type: core.Component, args: [{
- selector: 'app-sidebar-form',
- template: "\n \n "
- }] }
- ];
- /** @nocollapse */
- AppSidebarFormComponent.ctorParameters = function () {
- return [
- { type: core.ElementRef }
- ];
- };
- return AppSidebarFormComponent;
- }());
-
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- var AppSidebarHeaderComponent = /** @class */ (function () {
- function AppSidebarHeaderComponent(el) {
- this.el = el;
- }
- /**
- * @return {?}
- */
- AppSidebarHeaderComponent.prototype.ngOnInit = /**
- * @return {?}
- */
- function () {
- Replace(this.el);
- };
- AppSidebarHeaderComponent.decorators = [
- { type: core.Component, args: [{
- selector: 'app-sidebar-header',
- template: "\n \n "
- }] }
- ];
- /** @nocollapse */
- AppSidebarHeaderComponent.ctorParameters = function () {
- return [
- { type: core.ElementRef }
- ];
- };
- return AppSidebarHeaderComponent;
- }());
-
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- var AppSidebarMinimizerComponent = /** @class */ (function () {
- function AppSidebarMinimizerComponent(el) {
- this.el = el;
- }
- /**
- * @return {?}
- */
- AppSidebarMinimizerComponent.prototype.ngOnInit = /**
- * @return {?}
- */
- function () {
- Replace(this.el);
- };
- AppSidebarMinimizerComponent.decorators = [
- { type: core.Component, args: [{
- selector: 'app-sidebar-minimizer',
- template: "\n \n "
- }] }
- ];
- /** @nocollapse */
- AppSidebarMinimizerComponent.ctorParameters = function () {
- return [
- { type: core.ElementRef }
- ];
- };
- return AppSidebarMinimizerComponent;
- }());
-
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AppSidebarComponent = /** @class */ (function () {
- function AppSidebarComponent(document, renderer) {
+ function AppSidebarComponent(document, renderer, hostElement) {
this.document = document;
this.renderer = renderer;
+ this.hostElement = hostElement;
+ renderer.addClass(hostElement.nativeElement, 'sidebar');
}
/**
* @return {?}
@@ -1309,23 +1181,6 @@
this.renderer.addClass(this.document.body, 'sidebar-off-canvas');
}
};
- /**
- * @param {?=} fixed
- * @return {?}
- */
- AppSidebarComponent.prototype.fixedPosition = /**
- * @param {?=} fixed
- * @return {?}
- */
- function (fixed) {
- if (fixed === void 0) {
- fixed = this.fixed;
- }
- console.warn('deprecated fixedPosition(), use isFixed() instead');
- if (fixed) {
- this.renderer.addClass(this.document.body, 'sidebar-fixed');
- }
- };
/**
* @param {?=} display
* @return {?}
@@ -1354,7 +1209,8 @@
AppSidebarComponent.ctorParameters = function () {
return [
{ type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] },
- { type: core.Renderer2 }
+ { type: core.Renderer2 },
+ { type: core.ElementRef }
];
};
AppSidebarComponent.propDecorators = {
@@ -1362,8 +1218,7 @@
display: [{ type: core.Input }],
fixed: [{ type: core.Input }],
minimized: [{ type: core.Input }],
- offCanvas: [{ type: core.Input }],
- true: [{ type: core.HostBinding, args: ['class.sidebar',] }]
+ offCanvas: [{ type: core.Input }]
};
return AppSidebarComponent;
}());
@@ -1372,31 +1227,189 @@
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
- var NavDropdownDirective = /** @class */ (function () {
- function NavDropdownDirective(el) {
- this.el = el;
+ var AppSidebarFooterComponent = /** @class */ (function () {
+ function AppSidebarFooterComponent(renderer, hostElement) {
+ this.renderer = renderer;
+ this.hostElement = hostElement;
+ renderer.addClass(hostElement.nativeElement, 'app-sidebar-footer');
}
/**
* @return {?}
*/
- NavDropdownDirective.prototype.toggle = /**
+ AppSidebarFooterComponent.prototype.ngOnInit = /**
* @return {?}
*/
- function () {
- this.el.nativeElement.classList.toggle('open');
- };
- NavDropdownDirective.decorators = [
- { type: core.Directive, args: [{
- selector: '[appNavDropdown]'
- },] }
+ function () { };
+ AppSidebarFooterComponent.decorators = [
+ { type: core.Component, args: [{
+ selector: 'app-sidebar-footer',
+ template: ""
+ }] }
];
/** @nocollapse */
- NavDropdownDirective.ctorParameters = function () {
+ AppSidebarFooterComponent.ctorParameters = function () {
return [
+ { type: core.Renderer2 },
{ type: core.ElementRef }
];
};
- return NavDropdownDirective;
+ return AppSidebarFooterComponent;
+ }());
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var AppSidebarFormComponent = /** @class */ (function () {
+ function AppSidebarFormComponent(renderer, hostElement) {
+ this.renderer = renderer;
+ this.hostElement = hostElement;
+ renderer.addClass(hostElement.nativeElement, 'sidebar-form');
+ }
+ /**
+ * @return {?}
+ */
+ AppSidebarFormComponent.prototype.ngOnInit = /**
+ * @return {?}
+ */
+ function () { };
+ AppSidebarFormComponent.decorators = [
+ { type: core.Component, args: [{
+ selector: 'app-sidebar-form',
+ template: ""
+ }] }
+ ];
+ /** @nocollapse */
+ AppSidebarFormComponent.ctorParameters = function () {
+ return [
+ { type: core.Renderer2 },
+ { type: core.ElementRef }
+ ];
+ };
+ return AppSidebarFormComponent;
+ }());
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var AppSidebarHeaderComponent = /** @class */ (function () {
+ function AppSidebarHeaderComponent(renderer, hostElement) {
+ this.renderer = renderer;
+ this.hostElement = hostElement;
+ renderer.addClass(hostElement.nativeElement, 'sidebar-header');
+ }
+ /**
+ * @return {?}
+ */
+ AppSidebarHeaderComponent.prototype.ngOnInit = /**
+ * @return {?}
+ */
+ function () { };
+ AppSidebarHeaderComponent.decorators = [
+ { type: core.Component, args: [{
+ selector: 'app-sidebar-header',
+ template: ""
+ }] }
+ ];
+ /** @nocollapse */
+ AppSidebarHeaderComponent.ctorParameters = function () {
+ return [
+ { type: core.Renderer2 },
+ { type: core.ElementRef }
+ ];
+ };
+ return AppSidebarHeaderComponent;
+ }());
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var AppSidebarMinimizerComponent = /** @class */ (function () {
+ function AppSidebarMinimizerComponent(document, renderer, hostElement) {
+ this.document = document;
+ this.renderer = renderer;
+ this.hostElement = hostElement;
+ this.role = 'button';
+ renderer.addClass(hostElement.nativeElement, 'sidebar-minimizer');
+ }
+ /**
+ * @param {?} $event
+ * @return {?}
+ */
+ AppSidebarMinimizerComponent.prototype.toggleOpen = /**
+ * @param {?} $event
+ * @return {?}
+ */
+ function ($event) {
+ $event.preventDefault();
+ /** @type {?} */
+ var body = this.document.body;
+ body.classList.contains('sidebar-minimized') ?
+ this.renderer.removeClass(body, 'sidebar-minimized') :
+ this.renderer.addClass(body, 'sidebar-minimized');
+ body.classList.contains('brand-minimized') ?
+ this.renderer.removeClass(body, 'brand-minimized') :
+ this.renderer.addClass(body, 'brand-minimized');
+ };
+ /**
+ * @return {?}
+ */
+ AppSidebarMinimizerComponent.prototype.ngOnInit = /**
+ * @return {?}
+ */
+ function () { };
+ AppSidebarMinimizerComponent.decorators = [
+ { type: core.Component, args: [{
+ selector: 'app-sidebar-minimizer',
+ template: ""
+ }] }
+ ];
+ /** @nocollapse */
+ AppSidebarMinimizerComponent.ctorParameters = function () {
+ return [
+ { type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] },
+ { type: core.Renderer2 },
+ { type: core.ElementRef }
+ ];
+ };
+ AppSidebarMinimizerComponent.propDecorators = {
+ role: [{ type: core.HostBinding, args: ['attr.role',] }],
+ toggleOpen: [{ type: core.HostListener, args: ['click', ['$event'],] }]
+ };
+ return AppSidebarMinimizerComponent;
+ }());
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var NavDropdownDirective = /** @class */ (function () {
+ function NavDropdownDirective(el) {
+ this.el = el;
+ }
+ /**
+ * @return {?}
+ */
+ NavDropdownDirective.prototype.toggle = /**
+ * @return {?}
+ */
+ function () {
+ this.el.nativeElement.classList.toggle('open');
+ };
+ NavDropdownDirective.decorators = [
+ { type: core.Directive, args: [{
+ selector: '[appNavDropdown]'
+ },] }
+ ];
+ /** @nocollapse */
+ NavDropdownDirective.ctorParameters = function () {
+ return [
+ { type: core.ElementRef }
+ ];
+ };
+ return NavDropdownDirective;
}());
/**
* Allows the dropdown to be toggled via click.
@@ -1433,32 +1446,19 @@
};
return NavDropdownToggleDirective;
}());
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
var AppSidebarNavComponent = /** @class */ (function () {
- function AppSidebarNavComponent() {
+ function AppSidebarNavComponent(router$$1, renderer, hostElement) {
+ this.router = router$$1;
+ this.renderer = renderer;
+ this.hostElement = hostElement;
this.role = 'nav';
+ renderer.addClass(hostElement.nativeElement, 'sidebar-nav');
}
- /**
- * @param {?} item
- * @return {?}
- */
- AppSidebarNavComponent.prototype.isDivider = /**
- * @param {?} item
- * @return {?}
- */
- function (item) {
- return item.divider ? true : false;
- };
- /**
- * @param {?} item
- * @return {?}
- */
- AppSidebarNavComponent.prototype.isTitle = /**
- * @param {?} item
- * @return {?}
- */
- function (item) {
- return item.title ? true : false;
- };
/**
* @param {?} changes
* @return {?}
@@ -1468,102 +1468,257 @@
* @return {?}
*/
function (changes) {
- this.navItemsArray = JSON.parse(JSON.stringify(this.navItems));
+ this.navItemsArray = JSON.parse(JSON.stringify(this.navItems || []));
};
AppSidebarNavComponent.decorators = [
{ type: core.Component, args: [{
selector: 'app-sidebar-nav',
- template: "\n \n \n \n \n \n \n \n \n \n \n
\n "
+ template: "\n\n"
}] }
];
/** @nocollapse */
- AppSidebarNavComponent.ctorParameters = function () { return []; };
+ AppSidebarNavComponent.ctorParameters = function () {
+ return [
+ { type: router.Router },
+ { type: core.Renderer2 },
+ { type: core.ElementRef }
+ ];
+ };
AppSidebarNavComponent.propDecorators = {
navItems: [{ type: core.Input }],
- true: [{ type: core.HostBinding, args: ['class.sidebar-nav',] }],
role: [{ type: core.HostBinding, args: ['attr.role',] }]
};
return AppSidebarNavComponent;
}());
- var AppSidebarNavItemComponent = /** @class */ (function () {
- function AppSidebarNavItemComponent(router$$1, el) {
- this.router = router$$1;
- this.el = el;
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var AppSidebarNavDividerComponent = /** @class */ (function () {
+ function AppSidebarNavDividerComponent() {
}
/**
* @return {?}
*/
- AppSidebarNavItemComponent.prototype.hasClass = /**
+ AppSidebarNavDividerComponent.prototype.ngOnInit = /**
* @return {?}
*/
- function () {
- return this.item.class ? true : false;
+ function () { };
+ AppSidebarNavDividerComponent.decorators = [
+ { type: core.Component, args: [{
+ selector: 'app-sidebar-nav-divider',
+ template: ""
+ }] }
+ ];
+ /** @nocollapse */
+ AppSidebarNavDividerComponent.ctorParameters = function () { return []; };
+ AppSidebarNavDividerComponent.propDecorators = {
+ item: [{ type: core.Input }]
+ };
+ return AppSidebarNavDividerComponent;
+ }());
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var SidebarNavHelper = /** @class */ (function () {
+ function SidebarNavHelper() {
+ this.hasBadge = ( /**
+ * @param {?} item
+ * @return {?}
+ */function (item) { return Boolean(item.badge); });
+ this.hasIcon = ( /**
+ * @param {?} item
+ * @return {?}
+ */function (item) { return Boolean(item.icon); });
+ }
+ /**
+ * @param {?} item
+ * @return {?}
+ */
+ SidebarNavHelper.prototype.itemType = /**
+ * @param {?} item
+ * @return {?}
+ */
+ function (item) {
+ if (item.divider) {
+ return 'divider';
+ }
+ else if (item.title) {
+ return 'title';
+ }
+ else if (item.children) {
+ return 'dropdown';
+ }
+ else if (item.label) {
+ return 'label';
+ }
+ else if (!Object.keys(item).length) {
+ return 'empty';
+ }
+ else {
+ return 'link';
+ }
};
/**
+ * @param {?} item
* @return {?}
*/
- AppSidebarNavItemComponent.prototype.isDropdown = /**
+ SidebarNavHelper.prototype.getClass = /**
+ * @param {?} item
* @return {?}
*/
- function () {
- return this.item.children ? true : false;
+ function (item) {
+ /** @type {?} */
+ var itemType = this.itemType(item);
+ /** @type {?} */
+ var itemClass;
+ if (['divider', 'title'].includes(itemType)) {
+ itemClass = "nav-" + itemType;
+ }
+ else if (itemType === 'dropdown') {
+ itemClass = 'nav-item nav-dropdown';
+ }
+ else {
+ itemClass = 'nav-item';
+ }
+ return item.class ? itemClass + " " + item.class : itemClass;
};
/**
+ * @param {?} router
+ * @param {?} item
* @return {?}
*/
- AppSidebarNavItemComponent.prototype.thisUrl = /**
+ SidebarNavHelper.prototype.isActive = /**
+ * @param {?} router
+ * @param {?} item
* @return {?}
*/
- function () {
- return this.item.url;
+ function (router$$1, item) {
+ return router$$1.isActive(item.url, false);
};
/**
+ * @param {?} item
* @return {?}
*/
- AppSidebarNavItemComponent.prototype.isActive = /**
+ SidebarNavHelper.prototype.getIconClass = /**
+ * @param {?} item
* @return {?}
*/
- function () {
- return this.router.isActive(this.thisUrl(), false);
+ function (item) {
+ /** @type {?} */
+ var classes = {
+ 'nav-icon': true
+ };
+ /** @type {?} */
+ var icon = item.icon;
+ classes[icon] = !!item.icon;
+ return classes;
};
/**
+ * @param {?} item
* @return {?}
*/
- AppSidebarNavItemComponent.prototype.ngOnInit = /**
+ SidebarNavHelper.prototype.getBadgeClass = /**
+ * @param {?} item
* @return {?}
*/
- function () {
- Replace(this.el);
+ function (item) {
+ /** @type {?} */
+ var classes = {
+ 'badge': true
+ };
+ /** @type {?} */
+ var variant = "badge-" + item.badge.variant;
+ classes[variant] = !!item.badge.variant;
+ return classes;
};
- AppSidebarNavItemComponent.decorators = [
+ return SidebarNavHelper;
+ }());
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var AppSidebarNavDropdownComponent = /** @class */ (function () {
+ function AppSidebarNavDropdownComponent(helper) {
+ this.helper = helper;
+ }
+ AppSidebarNavDropdownComponent.decorators = [
{ type: core.Component, args: [{
- selector: 'app-sidebar-nav-item',
- template: "\n \n \n \n \n \n \n \n \n "
+ selector: 'app-sidebar-nav-dropdown',
+ template: "\n \n \n {{item.name}}\n {{ item.badge.text }}\n \n \n \n ",
+ providers: [SidebarNavHelper],
+ styles: ['.nav-dropdown-toggle { cursor: pointer; }',
+ '.nav-dropdown-items { display: block; }']
}] }
];
/** @nocollapse */
- AppSidebarNavItemComponent.ctorParameters = function () {
+ AppSidebarNavDropdownComponent.ctorParameters = function () {
return [
- { type: router.Router },
- { type: core.ElementRef }
+ { type: SidebarNavHelper }
];
};
- AppSidebarNavItemComponent.propDecorators = {
+ AppSidebarNavDropdownComponent.propDecorators = {
item: [{ type: core.Input }]
};
- return AppSidebarNavItemComponent;
+ return AppSidebarNavDropdownComponent;
+ }());
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var AppSidebarNavItemsComponent = /** @class */ (function () {
+ function AppSidebarNavItemsComponent(router$$1, helper) {
+ this.router = router$$1;
+ this.helper = helper;
+ }
+ AppSidebarNavItemsComponent.decorators = [
+ { type: core.Component, args: [{
+ selector: 'app-sidebar-nav-items',
+ template: "\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n "
+ }] }
+ ];
+ /** @nocollapse */
+ AppSidebarNavItemsComponent.ctorParameters = function () {
+ return [
+ { type: router.Router },
+ { type: SidebarNavHelper }
+ ];
+ };
+ AppSidebarNavItemsComponent.propDecorators = {
+ items: [{ type: core.Input }]
+ };
+ return AppSidebarNavItemsComponent;
}());
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
var AppSidebarNavLinkComponent = /** @class */ (function () {
- function AppSidebarNavLinkComponent(document, renderer, router$$1, el) {
+ function AppSidebarNavLinkComponent(document, renderer, helper) {
this.document = document;
this.renderer = renderer;
- this.router = router$$1;
- this.el = el;
+ this.helper = helper;
}
/**
* @return {?}
*/
- AppSidebarNavLinkComponent.prototype.getClasses = /**
+ AppSidebarNavLinkComponent.prototype.ngOnInit = /**
+ * @return {?}
+ */
+ function () {
+ this.linkType = this.getLinkType();
+ this.href = this.isDisabled() ? '' : this.item.url;
+ };
+ /**
+ * @return {?}
+ */
+ AppSidebarNavLinkComponent.prototype.getLinkClass = /**
* @return {?}
*/
function () {
@@ -1577,7 +1732,7 @@
};
if (this.hasVariant()) {
/** @type {?} */
- var variant = "nav-link-" + this.link.variant;
+ var variant = "nav-link-" + this.item.variant;
classes[variant] = true;
}
return classes;
@@ -1589,7 +1744,7 @@
* @return {?}
*/
function () {
- return this.isDisabled() ? 'disabled' : this.isExternalLink() ? 'external' : '';
+ return this.isExternalLink() ? 'external' : 'link';
};
/**
* @return {?}
@@ -1598,16 +1753,7 @@
* @return {?}
*/
function () {
- return this.link.variant ? true : false;
- };
- /**
- * @return {?}
- */
- AppSidebarNavLinkComponent.prototype.isBadge = /**
- * @return {?}
- */
- function () {
- return this.link.badge ? true : false;
+ return !!this.item.variant;
};
/**
* @return {?}
@@ -1616,7 +1762,7 @@
* @return {?}
*/
function () {
- return this.link.attributes && this.link.attributes.disabled ? true : false;
+ return !!(this.item.attributes && this.item.attributes.disabled);
};
/**
* @return {?}
@@ -1625,16 +1771,7 @@
* @return {?}
*/
function () {
- return this.link.url.substring(0, 4) === 'http' ? true : false;
- };
- /**
- * @return {?}
- */
- AppSidebarNavLinkComponent.prototype.isIcon = /**
- * @return {?}
- */
- function () {
- return this.link.icon ? true : false;
+ return this.item.url.substring(0, 4) === 'http';
};
/**
* @return {?}
@@ -1647,19 +1784,11 @@
this.renderer.removeClass(this.document.body, 'sidebar-show');
}
};
- /**
- * @return {?}
- */
- AppSidebarNavLinkComponent.prototype.ngOnInit = /**
- * @return {?}
- */
- function () {
- Replace(this.el);
- };
AppSidebarNavLinkComponent.decorators = [
{ type: core.Component, args: [{
selector: 'app-sidebar-nav-link',
- template: "\n \n \n \n {{ link.name }}\n {{ link.badge.text }}\n \n \n \n {{ link.name }}\n {{ link.badge.text }}\n \n \n \n {{ link.name }}\n {{ link.badge.text }}\n \n \n "
+ template: "\n \n \n {{item.name}}\n {{ item.badge.text }}\n \n \n \n {{item.name}}\n {{ item.badge.text }}\n \n\n",
+ providers: [SidebarNavHelper]
}] }
];
/** @nocollapse */
@@ -1667,119 +1796,223 @@
return [
{ type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] },
{ type: core.Renderer2 },
- { type: router.Router },
- { type: core.ElementRef }
+ { type: SidebarNavHelper }
];
};
AppSidebarNavLinkComponent.propDecorators = {
- link: [{ type: core.Input }]
+ item: [{ type: core.Input }]
};
return AppSidebarNavLinkComponent;
}());
- var AppSidebarNavDropdownComponent = /** @class */ (function () {
- function AppSidebarNavDropdownComponent(router$$1, el) {
- this.router = router$$1;
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var AppSidebarNavTitleComponent = /** @class */ (function () {
+ function AppSidebarNavTitleComponent(el, renderer) {
this.el = el;
+ this.renderer = renderer;
}
/**
* @return {?}
*/
- AppSidebarNavDropdownComponent.prototype.isBadge = /**
+ AppSidebarNavTitleComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
- return this.link.badge ? true : false;
+ /** @type {?} */
+ var nativeElement = this.el.nativeElement;
+ /** @type {?} */
+ var name = this.renderer.createText(this.item.name);
+ if (this.item.class) {
+ /** @type {?} */
+ var classes = this.item.class;
+ this.renderer.addClass(nativeElement, classes);
+ }
+ if (this.item.wrapper) {
+ /** @type {?} */
+ var wrapper = this.renderer.createElement(this.item.wrapper.element);
+ this.addAttribs(this.item.wrapper.attributes, wrapper);
+ this.renderer.appendChild(wrapper, name);
+ this.renderer.appendChild(nativeElement, wrapper);
+ }
+ else {
+ this.renderer.appendChild(nativeElement, name);
+ }
};
/**
+ * @private
+ * @param {?} attribs
+ * @param {?} element
* @return {?}
*/
- AppSidebarNavDropdownComponent.prototype.isIcon = /**
+ AppSidebarNavTitleComponent.prototype.addAttribs = /**
+ * @private
+ * @param {?} attribs
+ * @param {?} element
* @return {?}
*/
- function () {
- return this.link.icon ? true : false;
+ function (attribs, element) {
+ if (attribs) {
+ for (var attr in attribs) {
+ if (attr === 'style' && typeof (attribs[attr]) === 'object') {
+ this.setStyle(attribs[attr], element);
+ }
+ else if (attr === 'class') {
+ this.addClass(attribs[attr], element);
+ }
+ else {
+ this.setAttrib(attr, attribs[attr], element);
+ }
+ }
+ }
};
/**
+ * @private
+ * @param {?} styles
+ * @param {?} el
* @return {?}
*/
- AppSidebarNavDropdownComponent.prototype.ngOnInit = /**
+ AppSidebarNavTitleComponent.prototype.setStyle = /**
+ * @private
+ * @param {?} styles
+ * @param {?} el
* @return {?}
*/
- function () {
- Replace(this.el);
+ function (styles, el) {
+ for (var style in styles) {
+ this.renderer.setStyle(el, style, styles[style]);
+ }
};
- AppSidebarNavDropdownComponent.decorators = [
+ /**
+ * @private
+ * @param {?} classes
+ * @param {?} el
+ * @return {?}
+ */
+ AppSidebarNavTitleComponent.prototype.addClass = /**
+ * @private
+ * @param {?} classes
+ * @param {?} el
+ * @return {?}
+ */
+ function (classes, el) {
+ var _this = this;
+ /** @type {?} */
+ var classArray = (Array.isArray(classes) ? classes : classes.split(' '));
+ classArray.filter(( /**
+ * @param {?} element
+ * @return {?}
+ */function (element) { return element.length > 0; })).forEach(( /**
+ * @param {?} element
+ * @return {?}
+ */function (element) {
+ _this.renderer.addClass(el, element);
+ }));
+ };
+ /**
+ * @private
+ * @param {?} key
+ * @param {?} value
+ * @param {?} el
+ * @return {?}
+ */
+ AppSidebarNavTitleComponent.prototype.setAttrib = /**
+ * @private
+ * @param {?} key
+ * @param {?} value
+ * @param {?} el
+ * @return {?}
+ */
+ function (key, value, el) {
+ this.renderer.setAttribute(el, key, value);
+ };
+ AppSidebarNavTitleComponent.decorators = [
{ type: core.Component, args: [{
- selector: 'app-sidebar-nav-dropdown',
- template: "\n \n \n {{ link.name }}\n {{ link.badge.text }}\n \n \n ",
- styles: ['.nav-dropdown-toggle { cursor: pointer; }']
+ selector: 'app-sidebar-nav-title',
+ template: ''
}] }
];
/** @nocollapse */
- AppSidebarNavDropdownComponent.ctorParameters = function () {
+ AppSidebarNavTitleComponent.ctorParameters = function () {
return [
- { type: router.Router },
- { type: core.ElementRef }
+ { type: core.ElementRef },
+ { type: core.Renderer2 }
];
};
- AppSidebarNavDropdownComponent.propDecorators = {
- link: [{ type: core.Input }]
+ AppSidebarNavTitleComponent.propDecorators = {
+ item: [{ type: core.Input }]
};
- return AppSidebarNavDropdownComponent;
+ return AppSidebarNavTitleComponent;
}());
- var AppSidebarNavTitleComponent = /** @class */ (function () {
- function AppSidebarNavTitleComponent(el, renderer) {
- this.el = el;
- this.renderer = renderer;
+
+ /**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+ var AppSidebarNavLabelComponent = /** @class */ (function () {
+ function AppSidebarNavLabelComponent(helper) {
+ this.helper = helper;
}
/**
* @return {?}
*/
- AppSidebarNavTitleComponent.prototype.ngOnInit = /**
+ AppSidebarNavLabelComponent.prototype.ngOnInit = /**
+ * @return {?}
+ */
+ function () {
+ };
+ /**
+ * @return {?}
+ */
+ AppSidebarNavLabelComponent.prototype.getItemClass = /**
* @return {?}
*/
function () {
/** @type {?} */
- var nativeElement = this.el.nativeElement;
+ var labelClass = {
+ 'nav-label': true,
+ 'active': true
+ };
/** @type {?} */
- var li = this.renderer.createElement('li');
+ var itemClass = this.item.class;
+ labelClass[itemClass] = !!itemClass;
+ return labelClass;
+ };
+ /**
+ * @return {?}
+ */
+ AppSidebarNavLabelComponent.prototype.getLabelIconClass = /**
+ * @return {?}
+ */
+ function () {
/** @type {?} */
- var name = this.renderer.createText(this.title.name);
- this.renderer.addClass(li, 'nav-title');
- if (this.title.class) {
- /** @type {?} */
- var classes = this.title.class;
- this.renderer.addClass(li, classes);
- }
- if (this.title.wrapper) {
- /** @type {?} */
- var wrapper = this.renderer.createElement(this.title.wrapper.element);
- this.renderer.appendChild(wrapper, name);
- this.renderer.appendChild(li, wrapper);
- }
- else {
- this.renderer.appendChild(li, name);
- }
- this.renderer.appendChild(nativeElement, li);
- Replace(this.el);
+ var classes = this.helper.getIconClass(this.item);
+ /** @type {?} */
+ var variant = "text-" + this.item.label.variant;
+ classes[variant] = !!variant;
+ /** @type {?} */
+ var labelClass = this.item.label.class;
+ classes[labelClass] = !!labelClass;
+ return classes;
};
- AppSidebarNavTitleComponent.decorators = [
+ AppSidebarNavLabelComponent.decorators = [
{ type: core.Component, args: [{
- selector: 'app-sidebar-nav-title',
- template: ''
+ selector: 'app-sidebar-nav-label',
+ template: "\n \n {{item.name}}\n {{ item.badge.text }}\n\n"
}] }
];
/** @nocollapse */
- AppSidebarNavTitleComponent.ctorParameters = function () {
+ AppSidebarNavLabelComponent.ctorParameters = function () {
return [
- { type: core.ElementRef },
- { type: core.Renderer2 }
+ { type: SidebarNavHelper }
];
};
- AppSidebarNavTitleComponent.propDecorators = {
- title: [{ type: core.Input }]
+ AppSidebarNavLabelComponent.propDecorators = {
+ item: [{ type: core.Input }]
};
- return AppSidebarNavTitleComponent;
+ return AppSidebarNavLabelComponent;
}());
/**
@@ -1802,9 +2035,10 @@
AppSidebarHeaderComponent,
AppSidebarMinimizerComponent,
AppSidebarComponent,
+ AppSidebarNavItemsComponent,
AppSidebarNavComponent,
+ AppSidebarNavDividerComponent,
AppSidebarNavDropdownComponent,
- AppSidebarNavItemComponent,
AppSidebarNavLinkComponent,
AppSidebarNavTitleComponent,
NavDropdownDirective,
@@ -1818,13 +2052,18 @@
AppSidebarMinimizerComponent,
AppSidebarMinimizerComponent,
AppSidebarComponent,
+ AppSidebarNavItemsComponent,
AppSidebarNavComponent,
+ AppSidebarNavDividerComponent,
AppSidebarNavDropdownComponent,
- AppSidebarNavItemComponent,
AppSidebarNavLinkComponent,
AppSidebarNavTitleComponent,
NavDropdownDirective,
- NavDropdownToggleDirective
+ NavDropdownToggleDirective,
+ AppSidebarNavLabelComponent
+ ],
+ providers: [
+ SidebarNavHelper
]
},] }
];
@@ -1854,8 +2093,9 @@
exports.ɵj = AppAsideComponent;
exports.ɵk = AppBreadcrumbComponent;
exports.ɵl = AppBreadcrumbService;
- exports.ɵm = AppFooterComponent;
- exports.ɵn = AppHeaderComponent;
+ exports.ɵm = CuiBreadcrumbComponent;
+ exports.ɵn = AppFooterComponent;
+ exports.ɵo = AppHeaderComponent;
exports.ɵg = AsideToggleDirective;
exports.ɵf = BrandMinimizeDirective;
exports.ɵh = HtmlAttributesDirective;
@@ -1865,18 +2105,21 @@
exports.ɵb = SidebarToggleDirective;
exports.ɵa = LayoutModule;
exports.ɵi = ClassToggler;
- exports.ɵo = AppSidebarFooterComponent;
- exports.ɵp = AppSidebarFormComponent;
- exports.ɵq = AppSidebarHeaderComponent;
- exports.ɵr = AppSidebarMinimizerComponent;
- exports.ɵv = AppSidebarNavComponent;
+ exports.ɵp = AppSidebarFooterComponent;
+ exports.ɵq = AppSidebarFormComponent;
+ exports.ɵr = AppSidebarHeaderComponent;
+ exports.ɵs = AppSidebarMinimizerComponent;
+ exports.ɵw = AppSidebarNavComponent;
+ exports.ɵbb = NavDropdownDirective;
+ exports.ɵbc = NavDropdownToggleDirective;
+ exports.ɵv = SidebarNavHelper;
+ exports.ɵx = AppSidebarNavDividerComponent;
exports.ɵy = AppSidebarNavDropdownComponent;
- exports.ɵw = AppSidebarNavItemComponent;
- exports.ɵx = AppSidebarNavLinkComponent;
- exports.ɵz = AppSidebarNavTitleComponent;
- exports.ɵt = NavDropdownDirective;
- exports.ɵu = NavDropdownToggleDirective;
- exports.ɵs = AppSidebarComponent;
+ exports.ɵu = AppSidebarNavItemsComponent;
+ exports.ɵbd = AppSidebarNavLabelComponent;
+ exports.ɵz = AppSidebarNavLinkComponent;
+ exports.ɵba = AppSidebarNavTitleComponent;
+ exports.ɵt = AppSidebarComponent;
Object.defineProperty(exports, '__esModule', { value: true });
diff --git a/dist/@coreui/angular/bundles/coreui-angular.umd.js.map b/dist/@coreui/angular/bundles/coreui-angular.umd.js.map
index c4ed9374..7f980594 100644
--- a/dist/@coreui/angular/bundles/coreui-angular.umd.js.map
+++ b/dist/@coreui/angular/bundles/coreui-angular.umd.js.map
@@ -1 +1 @@
-{"version":3,"file":"coreui-angular.umd.js.map","sources":["ng://@coreui/angular/lib/shared/classes.ts","ng://@coreui/angular/lib/shared/toggle-classes.ts","ng://@coreui/angular/lib/shared/layout/layout.directive.ts","ng://@coreui/angular/lib/shared/layout/layout.module.ts","ng://@coreui/angular/lib/shared/replace.ts","ng://@coreui/angular/lib/aside/app-aside.component.ts","ng://@coreui/angular/lib/aside/app-aside.module.ts","ng://@coreui/angular/lib/breadcrumb/app-breadcrumb.service.ts","ng://@coreui/angular/lib/breadcrumb/app-breadcrumb.component.ts","ng://@coreui/angular/lib/breadcrumb/app-breadcrumb.module.ts","ng://@coreui/angular/lib/footer/app-footer.component.ts","ng://@coreui/angular/lib/footer/app-footer.module.ts","ng://@coreui/angular/lib/header/app-header.component.ts","ng://@coreui/angular/lib/header/app-header.module.ts","ng://@coreui/angular/lib/sidebar/app-sidebar-footer.component.ts","ng://@coreui/angular/lib/sidebar/app-sidebar-form.component.ts","ng://@coreui/angular/lib/sidebar/app-sidebar-header.component.ts","ng://@coreui/angular/lib/sidebar/app-sidebar-minimizer.component.ts","ng://@coreui/angular/lib/sidebar/app-sidebar.component.ts","ng://@coreui/angular/lib/sidebar/app-sidebar-nav.component.ts","ng://@coreui/angular/lib/sidebar/app-sidebar.module.ts"],"sourcesContent":["export const sidebarCssClasses: Array = [\r\n 'sidebar-show',\r\n 'sidebar-sm-show',\r\n 'sidebar-md-show',\r\n 'sidebar-lg-show',\r\n 'sidebar-xl-show'\r\n];\r\n\r\nexport const asideMenuCssClasses: Array = [\r\n 'aside-menu-show',\r\n 'aside-menu-sm-show',\r\n 'aside-menu-md-show',\r\n 'aside-menu-lg-show',\r\n 'aside-menu-xl-show'\r\n];\r\n","import {Inject, Injectable, Renderer2} from '@angular/core';\r\nimport {DOCUMENT} from '@angular/common';\r\n\r\nconst RemoveClasses = (NewClassNames) => {\r\n const MatchClasses = NewClassNames.map((Class) => document.body.classList.contains(Class));\r\n return MatchClasses.indexOf(true) !== -1;\r\n};\r\n\r\nexport const ToggleClasses = (Toggle, ClassNames) => {\r\n const Level = ClassNames.indexOf(Toggle);\r\n const NewClassNames = ClassNames.slice(0, Level + 1);\r\n\r\n if (RemoveClasses(NewClassNames)) {\r\n NewClassNames.map((Class) => document.body.classList.remove(Class));\r\n } else {\r\n document.body.classList.add(Toggle);\r\n }\r\n};\r\n\r\n@Injectable()\r\nexport class ClassToggler {\r\n\r\n constructor(\r\n @Inject(DOCUMENT) private document: any,\r\n private renderer: Renderer2,\r\n ) {}\r\n\r\n removeClasses(NewClassNames) {\r\n const MatchClasses = NewClassNames.map((Class) => this.document.body.classList.contains(Class));\r\n return MatchClasses.indexOf(true) !== -1;\r\n }\r\n\r\n toggleClasses(Toggle, ClassNames) {\r\n const Level = ClassNames.indexOf(Toggle);\r\n const NewClassNames = ClassNames.slice(0, Level + 1);\r\n\r\n if (this.removeClasses(NewClassNames)) {\r\n NewClassNames.map((Class) => this.renderer.removeClass(this.document.body, Class));\r\n } else {\r\n this.renderer.addClass(this.document.body, Toggle);\r\n }\r\n }\r\n}\r\n","import {Directive, ElementRef, HostListener, Inject, Input, OnInit, Renderer2} from '@angular/core';\nimport {DOCUMENT} from '@angular/common';\n\nimport { asideMenuCssClasses, sidebarCssClasses } from '../classes';\nimport { ClassToggler } from '../toggle-classes';\n\n/**\n* Allows the sidebar to be toggled via click.\n*/\n@Directive({\n selector: '[appSidebarToggler]',\n providers: [ClassToggler]\n})\nexport class SidebarToggleDirective implements OnInit {\n @Input('appSidebarToggler') breakpoint: string;\n public bp;\n constructor(private classToggler: ClassToggler) {}\n ngOnInit(): void {\n this.bp = this.breakpoint;\n }\n @HostListener('click', ['$event'])\n toggleOpen($event: any) {\n $event.preventDefault();\n const cssClass = this.bp ? `sidebar-${this.bp}-show` : sidebarCssClasses[0];\n this.classToggler.toggleClasses(cssClass, sidebarCssClasses);\n }\n}\n\n@Directive({\n selector: '[appSidebarMinimizer]'\n})\nexport class SidebarMinimizeDirective {\n constructor(\n @Inject(DOCUMENT) private document: any,\n private renderer: Renderer2,\n ) { }\n\n @HostListener('click', ['$event'])\n toggleOpen($event: any) {\n $event.preventDefault();\n const body = this.document.body;\n body.classList.contains('sidebar-minimized') ?\n this.renderer.removeClass(body, 'sidebar-minimized') :\n this.renderer.addClass(body, 'sidebar-minimized');\n // document.body.classList.toggle('sidebar-minimized');\n }\n}\n\n@Directive({\n selector: '[appMobileSidebarToggler]'\n})\nexport class MobileSidebarToggleDirective {\n constructor(\n @Inject(DOCUMENT) private document: any,\n private renderer: Renderer2,\n ) { }\n\n // Check if element has class\n private hasClass(target: any, elementClassName: string) {\n return new RegExp('(\\\\s|^)' + elementClassName + '(\\\\s|$)').test(target.className);\n }\n\n @HostListener('click', ['$event'])\n toggleOpen($event: any) {\n $event.preventDefault();\n const body = this.document.body;\n body.classList.contains('sidebar-show') ?\n this.renderer.removeClass(body, 'sidebar-show') :\n this.renderer.addClass(body, 'sidebar-show');\n // document.body.classList.toggle('sidebar-show');\n }\n}\n\n/**\n* Allows the off-canvas sidebar to be closed via click.\n*/\n@Directive({\n selector: '[appSidebarClose]'\n})\nexport class SidebarOffCanvasCloseDirective {\n constructor(\n @Inject(DOCUMENT) private document: any,\n private renderer: Renderer2,\n ) { }\n\n // Check if element has class\n private hasClass(target: any, elementClassName: string) {\n return new RegExp('(\\\\s|^)' + elementClassName + '(\\\\s|$)').test(target.className);\n }\n\n // Toggle element class\n private toggleClass(elem: any, elementClassName: string) {\n let newClass = ' ' + elem.className.replace( /[\\t\\r\\n]/g, ' ' ) + ' ';\n if (this.hasClass(elem, elementClassName)) {\n while (newClass.indexOf(' ' + elementClassName + ' ') >= 0 ) {\n newClass = newClass.replace( ' ' + elementClassName + ' ' , ' ' );\n }\n elem.className = newClass.replace(/^\\s+|\\s+$/g, '');\n } else {\n elem.className += ' ' + elementClassName;\n }\n }\n\n @HostListener('click', ['$event'])\n toggleOpen($event: any) {\n $event.preventDefault();\n\n const body = this.document.body;\n if (this.hasClass(body, 'sidebar-off-canvas')) {\n body.classList.contains('sidebar-show') ?\n this.renderer.removeClass(body, 'sidebar-show') :\n this.renderer.addClass(body, 'sidebar-show');\n // this.toggleClass(document.body, 'sidebar-opened');\n }\n }\n}\n\n@Directive({\n selector: '[appBrandMinimizer]'\n})\nexport class BrandMinimizeDirective {\n constructor(\n @Inject(DOCUMENT) private document: any,\n private renderer: Renderer2,\n ) { }\n\n @HostListener('click', ['$event'])\n toggleOpen($event: any) {\n $event.preventDefault();\n const body = this.document.body;\n body.classList.contains('brand-minimized') ?\n this.renderer.removeClass(body, 'brand-minimized') :\n this.renderer.addClass(body, 'brand-minimized');\n // document.body.classList.toggle('brand-minimized');\n }\n}\n\n\n/**\n* Allows the aside to be toggled via click.\n*/\n@Directive({\n selector: '[appAsideMenuToggler]',\n providers: [ClassToggler]\n})\nexport class AsideToggleDirective implements OnInit {\n @Input('appAsideMenuToggler') breakpoint: string;\n public bp;\n constructor(private classToggler: ClassToggler) {}\n ngOnInit(): void {\n this.bp = this.breakpoint;\n }\n @HostListener('click', ['$event'])\n toggleOpen($event: any) {\n $event.preventDefault();\n const cssClass = this.bp ? `aside-menu-${this.bp}-show` : asideMenuCssClasses[0];\n this.classToggler.toggleClasses(cssClass, asideMenuCssClasses);\n }\n}\n\n@Directive({\n selector: '[appHtmlAttr]'\n})\nexport class HtmlAttributesDirective implements OnInit {\n @Input() appHtmlAttr: {[key: string]: string };\n\n constructor(\n @Inject(DOCUMENT) private document: any,\n private renderer: Renderer2,\n private el: ElementRef\n ) {}\n\n ngOnInit() {\n const attribs = this.appHtmlAttr;\n for (const attr in attribs) {\n if (attr === 'style' && typeof(attribs[attr]) === 'object' ) {\n this.setStyle(attribs[attr]);\n } else if (attr === 'class') {\n this.addClass(attribs[attr]);\n } else {\n this.setAttrib(attr, attribs[attr]);\n }\n }\n }\n\n private setStyle(styles) {\n for (const style in styles) {\n this.renderer.setStyle(this.el.nativeElement, style, styles[style] );\n }\n }\n\n private addClass(classes) {\n const classArray = (Array.isArray(classes) ? classes : classes.split(' '));\n classArray.filter((element) => element.length > 0).forEach(element => {\n this.renderer.addClass(this.el.nativeElement, element );\n });\n }\n\n private setAttrib(key, value) {\n this.renderer.setAttribute(this.el.nativeElement, key, value );\n }\n}\n","import { CommonModule } from '@angular/common';\r\nimport { NgModule} from '@angular/core';\r\nimport {\r\n AsideToggleDirective,\r\n BrandMinimizeDirective,\r\n MobileSidebarToggleDirective,\r\n SidebarToggleDirective,\r\n SidebarMinimizeDirective,\r\n SidebarOffCanvasCloseDirective,\r\n HtmlAttributesDirective\r\n} from './layout.directive';\r\nimport { ClassToggler } from '../toggle-classes';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule\r\n ],\r\n exports: [\r\n AsideToggleDirective,\r\n BrandMinimizeDirective,\r\n MobileSidebarToggleDirective,\r\n SidebarToggleDirective,\r\n SidebarMinimizeDirective,\r\n SidebarOffCanvasCloseDirective,\r\n HtmlAttributesDirective\r\n ],\r\n declarations: [\r\n AsideToggleDirective,\r\n BrandMinimizeDirective,\r\n MobileSidebarToggleDirective,\r\n SidebarToggleDirective,\r\n SidebarMinimizeDirective,\r\n SidebarOffCanvasCloseDirective,\r\n HtmlAttributesDirective\r\n ],\r\n providers: [\r\n ClassToggler\r\n ]\r\n})\r\nexport class LayoutModule { }\r\n","export function Replace(el: any): any {\r\n const nativeElement: HTMLElement = el.nativeElement;\r\n const parentElement: HTMLElement = nativeElement.parentElement;\r\n // move all children out of the element\r\n while (nativeElement.firstChild) {\r\n parentElement.insertBefore(nativeElement.firstChild, nativeElement);\r\n }\r\n // remove the empty element(the host)\r\n parentElement.removeChild(nativeElement);\r\n}\r\n","import {Component, ElementRef, Input, OnInit, OnDestroy, Inject, Renderer2} from '@angular/core';\r\nimport {DOCUMENT} from '@angular/common';\r\n\r\nimport { asideMenuCssClasses, Replace } from '../shared';\r\n\r\n@Component({\r\n selector: 'app-aside',\r\n template: `\r\n \r\n `\r\n})\r\nexport class AppAsideComponent implements OnInit, OnDestroy {\r\n @Input() display: any;\r\n @Input() fixed: boolean;\r\n @Input() offCanvas: boolean;\r\n\r\n constructor(\r\n @Inject(DOCUMENT) private document: any,\r\n private renderer: Renderer2,\r\n private el: ElementRef\r\n ) {}\r\n\r\n ngOnInit(): void {\r\n Replace(this.el);\r\n this.isFixed(this.fixed);\r\n this.isOffCanvas(this.offCanvas);\r\n this.displayBreakpoint(this.display);\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this.renderer.removeClass(this.document.body, 'aside-menu-fixed');\r\n }\r\n\r\n isFixed(fixed: boolean = this.fixed): void {\r\n if (fixed) {\r\n this.renderer.addClass(this.document.body, 'aside-menu-fixed');\r\n }\r\n }\r\n\r\n isOffCanvas(offCanvas: boolean = this.offCanvas): void {\r\n if (offCanvas) {\r\n this.renderer.addClass(this.document.body, 'aside-menu-off-canvas');\r\n }\r\n }\r\n\r\n displayBreakpoint(display: any = this.display): void {\r\n if (display !== false ) {\r\n const cssClass = this.display ? `aside-menu-${this.display}-show` : asideMenuCssClasses[0];\r\n this.renderer.addClass(this.document.body, cssClass);\r\n }\r\n }\r\n}\r\n","import { CommonModule} from '@angular/common';\r\nimport { NgModule } from '@angular/core';\r\nimport { LayoutModule } from './../shared/layout/layout.module';\r\n\r\nimport { AppAsideComponent } from './app-aside.component';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n LayoutModule\r\n ],\r\n exports: [\r\n AppAsideComponent,\r\n LayoutModule\r\n ],\r\n declarations: [\r\n AppAsideComponent\r\n ]\r\n})\r\nexport class AppAsideModule {}\r\n","import { Injectable } from '@angular/core';\r\nimport { Router, ActivatedRoute, NavigationEnd } from '@angular/router';\r\nimport { BehaviorSubject, Observable } from 'rxjs/index';\r\nimport { filter } from 'rxjs/operators';\r\n\r\n@Injectable()\r\nexport class AppBreadcrumbService {\r\n\r\n breadcrumbs: Observable>;\r\n\r\n private _breadcrumbs: BehaviorSubject>;\r\n\r\n constructor(private router: Router, private route: ActivatedRoute) {\r\n\r\n this._breadcrumbs = new BehaviorSubject(new Array