@akveo/nga-theme
Version:
@akveo/nga-theme
1,153 lines (1,140 loc) • 153 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@ng-bootstrap/ng-bootstrap'), require('rxjs/ReplaySubject'), require('rxjs/Subject'), require('rxjs/BehaviorSubject'), require('rxjs/add/operator/publish'), require('rxjs/add/operator/map'), require('rxjs/add/operator/filter'), require('rxjs/add/operator/pairwise'), require('rxjs/add/operator/distinctUntilChanged'), require('rxjs/add/operator/debounceTime'), require('@angular/forms'), require('@angular/router'), require('rxjs/add/operator/toPromise'), require('immutable'), require('rxjs/add/operator/share'), require('rxjs/Observable'), require('rxjs/add/observable/of'), require('rxjs/add/operator/delay')) :
typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@ng-bootstrap/ng-bootstrap', 'rxjs/ReplaySubject', 'rxjs/Subject', 'rxjs/BehaviorSubject', 'rxjs/add/operator/publish', 'rxjs/add/operator/map', 'rxjs/add/operator/filter', 'rxjs/add/operator/pairwise', 'rxjs/add/operator/distinctUntilChanged', 'rxjs/add/operator/debounceTime', '@angular/forms', '@angular/router', 'rxjs/add/operator/toPromise', 'immutable', 'rxjs/add/operator/share', 'rxjs/Observable', 'rxjs/add/observable/of', 'rxjs/add/operator/delay'], factory) :
(factory((global.nga = global.nga || {}, global.nga.theme = global.nga.theme || {}),global.ng.core,global.ng.common,global['ng-bootstrap']['ng-bootstrap'],global.Rx,global.Rx,global.Rx,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.Rx.Observable.prototype,global.ng.forms,global.ng.router,global.Rx.Observable.prototype,global.immutable,global.Rx.Observable.prototype,global.Rx));
}(this, (function (exports,_angular_core,_angular_common,_ngBootstrap_ngBootstrap,rxjs_ReplaySubject,rxjs_Subject,rxjs_BehaviorSubject,rxjs_add_operator_publish,rxjs_add_operator_map,rxjs_add_operator_filter,rxjs_add_operator_pairwise,rxjs_add_operator_distinctUntilChanged,rxjs_add_operator_debounceTime,_angular_forms,_angular_router,rxjs_add_operator_toPromise,immutable,rxjs_add_operator_share,rxjs_Observable) { 'use strict';
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var ngaThemeOptionsToken = new _angular_core.InjectionToken('NGA_THEME_OPTIONS');
var ngaMediaBreakpointsToken = new _angular_core.InjectionToken('NGA_MEDIA_BREAKPOINTS');
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate$2 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata$1 = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
// TODO: move to theme config
var builtInThemes = [
{
name: 'default',
base: null,
variables: {
fontMain: 'SegoeUI',
fontSecondary: 'Exo',
colorBg: '#edf1f7',
colorFg: '#d1d1ff',
colorFgHeading: '#828282',
colorFgHint: '#a1a1e5',
colorFgHighlight: '#00f9a6',
separator: '#d1d1ff',
colorGray: 'rgba(81, 113, 165, 0.15)',
colorNeutral: 'transparent',
colorWhite: '#ffffff',
colorDisabled: 'rgba(255, 255, 255, 0.4)',
colorPrimary: '#a48aff',
colorSuccess: '#00e172',
colorInfo: '#4e9fff',
colorWarning: '#e5c742',
colorDanger: '#ff666d',
layoutBg: '#edf1f7',
},
},
{
name: 'cosmic',
base: 'default',
variables: {
colorBg: '#3d3780',
colorFg: '#a1a1e5',
colorFgHeading: '#ffffff',
separator: '#342e73',
colorGray: 'rgba(81, 113, 165, 0.15)',
colorNeutral: 'transparent',
colorWhite: '#ffffff',
colorPrimary: '#7659ff',
colorSuccess: '#00d977',
colorInfo: '#0088ff',
colorWarning: '#eae95f',
colorDanger: '#ff386a',
layoutBg: '#2c2961',
},
},
{
name: 'light',
base: 'default',
variables: {
colorBg: '#white',
colorFg: '#2f3234',
},
},
];
// TODO rename it to themeRegistry or smth similar as currently it overlaps with theme options
var NgaThemeConfig = (function () {
function NgaThemeConfig() {
var _this = this;
this.themes = {};
builtInThemes.forEach(function (theme) {
_this.register(theme.variables, theme.name, theme.base);
});
}
NgaThemeConfig.prototype.register = function (config, themeName, baseTheme) {
var base = this.has(baseTheme) ? this.get(baseTheme) : {};
this.themes[themeName] = Object.assign({}, base, config);
};
NgaThemeConfig.prototype.has = function (themeName) {
return !!this.themes[themeName];
};
NgaThemeConfig.prototype.get = function (themeName) {
if (!this.themes[themeName]) {
throw Error("NgaThemeConfig: no theme '" + themeName + "' found registered.");
}
return Object.assign({}, this.themes[themeName]);
};
return NgaThemeConfig;
}());
NgaThemeConfig = __decorate$2([
_angular_core.Injectable(),
__metadata$1("design:paramtypes", [])
], NgaThemeConfig);
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate$3 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata$2 = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var __param$1 = (this && this.__param) || function (paramIndex, decorator) {
return function (target, key) { decorator(target, key, paramIndex); }
};
var DEFAULT_MEDIA_BREAKPOINTS = [
{
name: 'xs',
width: 0,
},
{
name: 'sm',
width: 576,
},
{
name: 'md',
width: 768,
},
{
name: 'lg',
width: 992,
},
{
name: 'xl',
width: 1200,
},
{
name: 'xxl',
width: 1400,
},
{
name: 'xxxl',
width: 1600,
},
];
/**
* Manages media breakpoints
*
* Provides access to available media breakpoints to convert window width to a configured breakpoint,
* e.g. 200px - *xs* breakpoint
*/
exports.NgaMediaBreakpointsService = (function () {
function NgaMediaBreakpointsService(breakpoints) {
this.breakpoints = breakpoints;
}
/**
* Returns a configured breakpoint by width
* @param width number
* @returns {Z|{name: string, width: number}}
*/
NgaMediaBreakpointsService.prototype.getBreakpoint = function (width) {
var unknown = { name: 'unknown', width: width };
var breakpoints = this.getBreakpoints();
return breakpoints
.find(function (point, index) {
var next = breakpoints[index + 1];
return width >= point.width && (!next || width < next.width);
}) || unknown;
};
/**
* Returns a list of configured breakpoins for the theme
* @returns {{name: string, width: number}[]}
*/
NgaMediaBreakpointsService.prototype.getBreakpoints = function () {
return this.breakpoints;
};
return NgaMediaBreakpointsService;
}());
exports.NgaMediaBreakpointsService = __decorate$3([
_angular_core.Injectable(),
__param$1(0, _angular_core.Inject(ngaMediaBreakpointsToken)),
__metadata$2("design:paramtypes", [Object])
], exports.NgaMediaBreakpointsService);
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate$1 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var __param = (this && this.__param) || function (paramIndex, decorator) {
return function (target, key) { decorator(target, key, paramIndex); }
};
exports.NgaThemeService = (function () {
function NgaThemeService(options, breakpointService, themeConfig) {
this.options = options;
this.breakpointService = breakpointService;
this.themeConfig = themeConfig;
this.themeChanges$ = new rxjs_ReplaySubject.ReplaySubject(1);
this.appendToLayoutTop$ = new rxjs_ReplaySubject.ReplaySubject(1);
this.createLayoutTop$ = new rxjs_Subject.Subject();
this.appendLayoutClass$ = new rxjs_Subject.Subject();
this.removeLayoutClass$ = new rxjs_Subject.Subject();
this.changeWindowWidth$ = new rxjs_Subject.Subject();
if (options && options.name) {
this.changeTheme(options.name);
}
}
NgaThemeService.prototype.changeTheme = function (name) {
this.themeChanges$.next({ name: name, previous: this.currentTheme });
this.currentTheme = name;
};
NgaThemeService.prototype.changeWindowWidth = function (width) {
this.changeWindowWidth$.next(width);
};
NgaThemeService.prototype.appendToLayoutTop = function (component) {
var observable = new rxjs_BehaviorSubject.BehaviorSubject(null);
this.appendToLayoutTop$.next({ component: component, listener: observable });
return observable.asObservable();
};
NgaThemeService.prototype.getConfig = function () {
var _this = this;
return this.onThemeChange().map(function (theme) {
return _this.themeConfig.get(theme.name);
});
};
NgaThemeService.prototype.clearLayoutTop = function () {
var observable = new rxjs_BehaviorSubject.BehaviorSubject(null);
this.createLayoutTop$.next({ listener: observable });
return observable.asObservable();
};
/**
* Triggers media query breakpoint change
* Returns a pair where the first item is previous media breakpoint and the second item is current breakpoit.
* ```
* [{ name: 'xs', width: 0 }, { name: 'md', width: 768 }] // change from `xs` to `md`
* ```
* @returns {Observable<[NgaMediaBreakpoint, NgaMediaBreakpoint]>}
*/
NgaThemeService.prototype.onMediaQueryChange = function () {
var _this = this;
return this.changeWindowWidth$
.pairwise()
.map(function (_a) {
var prevWidth = _a[0], width = _a[1];
return [
_this.breakpointService.getBreakpoint(prevWidth),
_this.breakpointService.getBreakpoint(width),
];
})
.filter(function (_a) {
var prevPoint = _a[0], point = _a[1];
return prevPoint.name !== point.name;
})
.distinctUntilChanged(null, function (params) { return params[0].name + params[1].name; });
};
NgaThemeService.prototype.onThemeChange = function () {
return this.themeChanges$.publish().refCount();
};
NgaThemeService.prototype.onAppendToTop = function () {
return this.appendToLayoutTop$.publish().refCount();
};
NgaThemeService.prototype.onClearLayoutTop = function () {
return this.createLayoutTop$.publish().refCount();
};
NgaThemeService.prototype.appendLayoutClass = function (className) {
this.appendLayoutClass$.next(className);
};
NgaThemeService.prototype.onAppendLayoutClass = function () {
return this.appendLayoutClass$.publish().refCount();
};
NgaThemeService.prototype.removeLayoutClass = function (className) {
this.removeLayoutClass$.next(className);
};
NgaThemeService.prototype.onRemoveLayoutClass = function () {
return this.removeLayoutClass$.publish().refCount();
};
return NgaThemeService;
}());
exports.NgaThemeService = __decorate$1([
_angular_core.Injectable(),
__param(0, _angular_core.Inject(ngaThemeOptionsToken)),
__metadata("design:paramtypes", [Object, exports.NgaMediaBreakpointsService,
NgaThemeConfig])
], exports.NgaThemeService);
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate$4 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
exports.NgaSpinnerService = (function () {
function NgaSpinnerService() {
this.loaders = [];
this.selector = 'nga-global-spinner';
}
NgaSpinnerService.prototype.registerLoader = function (method) {
this.loaders.push(method);
};
NgaSpinnerService.prototype.clear = function () {
this.loaders = [];
};
NgaSpinnerService.prototype.load = function () {
this.showSpinner();
this.executeAll();
};
NgaSpinnerService.prototype.executeAll = function (done) {
var _this = this;
if (done === void 0) { done = function () { }; }
Promise.all(this.loaders).then(function (values) {
_this.hideSpinner();
done.call(null, values);
})
.catch(function (error) {
// TODO: Promise.reject
console.error(error);
});
};
// TODO is there any better way of doing this?
NgaSpinnerService.prototype.showSpinner = function () {
var el = this.getSpinnerElement();
if (el) {
el.style['display'] = 'block';
}
};
NgaSpinnerService.prototype.hideSpinner = function () {
var el = this.getSpinnerElement();
if (el) {
el.style['display'] = 'none';
}
};
NgaSpinnerService.prototype.getSpinnerElement = function () {
return document.getElementById(this.selector);
};
return NgaSpinnerService;
}());
exports.NgaSpinnerService = __decorate$4([
_angular_core.Injectable()
], exports.NgaSpinnerService);
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
exports.NgaThemeModule = NgaThemeModule_1 = (function () {
function NgaThemeModule() {
}
// TODO: check the options (throw exception?)
/**
* Main Theme Module
*
* @param ngaThemeOptions {NgaThemeOptions} Main theme options
* @param ngaMediaBreakpoints {NgaMediaBreakpoint} Available media breakpoins
*
* @returns {ModuleWithProviders}
*/
NgaThemeModule.forRoot = function (ngaThemeOptions, ngaMediaBreakpoints) {
return {
ngModule: NgaThemeModule_1,
imports: [
_ngBootstrap_ngBootstrap.NgbModule.forRoot(),
],
exports: [
_ngBootstrap_ngBootstrap.NgbModule,
],
providers: [
{ provide: ngaThemeOptionsToken, useValue: ngaThemeOptions || {} },
{ provide: ngaMediaBreakpointsToken, useValue: ngaMediaBreakpoints || DEFAULT_MEDIA_BREAKPOINTS },
NgaThemeConfig,
exports.NgaThemeService,
exports.NgaMediaBreakpointsService,
exports.NgaSpinnerService,
],
};
};
return NgaThemeModule;
}());
exports.NgaThemeModule = NgaThemeModule_1 = __decorate([
_angular_core.NgModule({
imports: [
_angular_common.CommonModule,
_ngBootstrap_ngBootstrap.NgbModule.forRoot(),
],
exports: [
_ngBootstrap_ngBootstrap.NgbModule,
],
})
], exports.NgaThemeModule);
var NgaThemeModule_1;
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate$6 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var NgaSharedModule = (function () {
function NgaSharedModule() {
}
return NgaSharedModule;
}());
NgaSharedModule = __decorate$6([
_angular_core.NgModule({
exports: [
_angular_common.CommonModule,
// TODO: probably we don't need FormsModule in SharedModule
_angular_forms.FormsModule,
_angular_router.RouterModule,
],
})
], NgaSharedModule);
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate$7 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata$3 = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
/**
* Component intended to be used within the `<nga-card>` component.
* It adds styles for a preset header section.
*/
var NgaCardHeaderComponent = (function () {
function NgaCardHeaderComponent() {
}
return NgaCardHeaderComponent;
}());
NgaCardHeaderComponent = __decorate$7([
_angular_core.Component({
selector: 'nga-card-header',
template: "<ng-content></ng-content>",
})
], NgaCardHeaderComponent);
/**
* Component intended to be used within the `<nga-card>` component.
* It adds styles for a preset body section.
*/
var NgaCardBodyComponent = (function () {
function NgaCardBodyComponent() {
}
return NgaCardBodyComponent;
}());
NgaCardBodyComponent = __decorate$7([
_angular_core.Component({
selector: 'nga-card-body',
template: "<ng-content></ng-content>",
})
], NgaCardBodyComponent);
/**
* Component intended to be used within the `<nga-card>` component.
* It adds styles for a preset footer section.
*/
var NgaCardFooterComponent = (function () {
function NgaCardFooterComponent() {
}
return NgaCardFooterComponent;
}());
NgaCardFooterComponent = __decorate$7([
_angular_core.Component({
selector: 'nga-card-footer',
template: "<ng-content></ng-content>",
})
], NgaCardFooterComponent);
/**
* A basic content container component
*
* While this component can be used alone, it also provides a number
* of child components for common card sections, including:
* - nga-card-header
* - nga-card-body
* - nga-card-footer
*/
var NgaCardComponent = NgaCardComponent_1 = (function () {
function NgaCardComponent() {
}
Object.defineProperty(NgaCardComponent.prototype, "xxsmall", {
get: function () {
return this.size === NgaCardComponent_1.SIZE_XXSMALL;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "xsmall", {
get: function () {
return this.size === NgaCardComponent_1.SIZE_XSMALL;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "small", {
get: function () {
return this.size === NgaCardComponent_1.SIZE_SMALL;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "medium", {
get: function () {
return this.size === NgaCardComponent_1.SIZE_MEDIUM;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "large", {
get: function () {
return this.size === NgaCardComponent_1.SIZE_LARGE;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "xlarge", {
get: function () {
return this.size === NgaCardComponent_1.SIZE_XLARGE;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "xxlarge", {
get: function () {
return this.size === NgaCardComponent_1.SIZE_XXLARGE;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "active", {
get: function () {
return this.status === NgaCardComponent_1.STATUS_ACTIVE;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "disabled", {
get: function () {
return this.status === NgaCardComponent_1.STATUS_DISABLED;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "primary", {
get: function () {
return this.status === NgaCardComponent_1.STATUS_PRIMARY;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "info", {
get: function () {
return this.status === NgaCardComponent_1.STATUS_INFO;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "success", {
get: function () {
return this.status === NgaCardComponent_1.STATUS_SUCCESS;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "warning", {
get: function () {
return this.status === NgaCardComponent_1.STATUS_WARNING;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "danger", {
get: function () {
return this.status === NgaCardComponent_1.STATUS_DANGER;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "setSize", {
set: function (val) {
this.size = val;
},
enumerable: true,
configurable: true
});
Object.defineProperty(NgaCardComponent.prototype, "setStatus", {
set: function (val) {
this.status = val;
},
enumerable: true,
configurable: true
});
return NgaCardComponent;
}());
NgaCardComponent.SIZE_XXSMALL = 'xxsmall';
NgaCardComponent.SIZE_XSMALL = 'xsmall';
NgaCardComponent.SIZE_SMALL = 'small';
NgaCardComponent.SIZE_MEDIUM = 'medium';
NgaCardComponent.SIZE_LARGE = 'large';
NgaCardComponent.SIZE_XLARGE = 'xlarge';
NgaCardComponent.SIZE_XXLARGE = 'xxlarge';
NgaCardComponent.STATUS_ACTIVE = 'active';
NgaCardComponent.STATUS_DISABLED = 'disabled';
NgaCardComponent.STATUS_PRIMARY = 'primary';
NgaCardComponent.STATUS_INFO = 'info';
NgaCardComponent.STATUS_SUCCESS = 'success';
NgaCardComponent.STATUS_WARNING = 'warning';
NgaCardComponent.STATUS_DANGER = 'danger';
__decorate$7([
_angular_core.HostBinding('class.xxsmall-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "xxsmall", null);
__decorate$7([
_angular_core.HostBinding('class.xsmall-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "xsmall", null);
__decorate$7([
_angular_core.HostBinding('class.small-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "small", null);
__decorate$7([
_angular_core.HostBinding('class.medium-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "medium", null);
__decorate$7([
_angular_core.HostBinding('class.large-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "large", null);
__decorate$7([
_angular_core.HostBinding('class.xlarge-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "xlarge", null);
__decorate$7([
_angular_core.HostBinding('class.xxlarge-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "xxlarge", null);
__decorate$7([
_angular_core.HostBinding('class.active-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "active", null);
__decorate$7([
_angular_core.HostBinding('class.disabled-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "disabled", null);
__decorate$7([
_angular_core.HostBinding('class.primary-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "primary", null);
__decorate$7([
_angular_core.HostBinding('class.info-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "info", null);
__decorate$7([
_angular_core.HostBinding('class.success-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "success", null);
__decorate$7([
_angular_core.HostBinding('class.warning-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "warning", null);
__decorate$7([
_angular_core.HostBinding('class.danger-card'),
__metadata$3("design:type", Object),
__metadata$3("design:paramtypes", [])
], NgaCardComponent.prototype, "danger", null);
__decorate$7([
_angular_core.Input('size'),
__metadata$3("design:type", String),
__metadata$3("design:paramtypes", [String])
], NgaCardComponent.prototype, "setSize", null);
__decorate$7([
_angular_core.Input('status'),
__metadata$3("design:type", String),
__metadata$3("design:paramtypes", [String])
], NgaCardComponent.prototype, "setStatus", null);
NgaCardComponent = NgaCardComponent_1 = __decorate$7([
_angular_core.Component({
selector: 'nga-card',
styles: [":host{display:flex;flex-direction:column} "],
template: "\n <ng-content></ng-content>\n <ng-content select=\"nga-card-header\"></ng-content>\n <ng-content select=\"nga-card-body\"></ng-content>\n <ng-content select=\"nga-card-footer\"></ng-content>\n ",
})
], NgaCardComponent);
var NgaCardComponent_1;
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate$5 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var NGA_CARD_COMPONENTS = [
NgaCardComponent,
NgaCardBodyComponent,
NgaCardFooterComponent,
NgaCardHeaderComponent,
];
exports.NgaCardModule = (function () {
function NgaCardModule() {
}
return NgaCardModule;
}());
exports.NgaCardModule = __decorate$5([
_angular_core.NgModule({
imports: [
NgaSharedModule,
],
declarations: NGA_CARD_COMPONENTS.slice(),
exports: NGA_CARD_COMPONENTS.slice(),
})
], exports.NgaCardModule);
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/ function convertToBoolProperty(val) {
if (typeof val === 'string') {
val = val.toLowerCase().trim();
return (val === 'true' || val === '');
}
return !!val;
}
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate$9 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata$4 = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
/**
* Component intended to be used within the `<nga-layout>` component.
* It adds styles for a preset column section.
*/
var NgaLayoutColumnComponent = (function () {
function NgaLayoutColumnComponent() {
}
Object.defineProperty(NgaLayoutColumnComponent.prototype, "left", {
set: function (val) {
this.leftValue = convertToBoolProperty(val);
},
enumerable: true,
configurable: true
});
return NgaLayoutColumnComponent;
}());
__decorate$9([
_angular_core.HostBinding('class.left'),
__metadata$4("design:type", Boolean)
], NgaLayoutColumnComponent.prototype, "leftValue", void 0);
__decorate$9([
_angular_core.Input(),
__metadata$4("design:type", Boolean),
__metadata$4("design:paramtypes", [Boolean])
], NgaLayoutColumnComponent.prototype, "left", null);
NgaLayoutColumnComponent = __decorate$9([
_angular_core.Component({
selector: 'nga-layout-column',
template: "\n <ng-content></ng-content>\n ",
})
], NgaLayoutColumnComponent);
/**
* Component intended to be used within the `<nga-layout>` component.
* It adds styles for a preset header section.
*/
var NgaLayoutHeaderComponent = (function () {
function NgaLayoutHeaderComponent() {
}
Object.defineProperty(NgaLayoutHeaderComponent.prototype, "fixed", {
set: function (val) {
this.fixedValue = convertToBoolProperty(val);
},
enumerable: true,
configurable: true
});
return NgaLayoutHeaderComponent;
}());
__decorate$9([
_angular_core.HostBinding('class.fixed'),
__metadata$4("design:type", Boolean)
], NgaLayoutHeaderComponent.prototype, "fixedValue", void 0);
__decorate$9([
_angular_core.Input(),
__metadata$4("design:type", Boolean),
__metadata$4("design:paramtypes", [Boolean])
], NgaLayoutHeaderComponent.prototype, "fixed", null);
NgaLayoutHeaderComponent = __decorate$9([
_angular_core.Component({
selector: 'nga-layout-header',
template: "\n <nav [class.fixed]=\"fixedValue\">\n <ng-content></ng-content>\n </nav>\n ",
})
], NgaLayoutHeaderComponent);
/**
* Component intended to be used within the `<nga-layout>` component.
* It adds styles for a preset footer section.
*/
var NgaLayoutFooterComponent = (function () {
function NgaLayoutFooterComponent() {
}
Object.defineProperty(NgaLayoutFooterComponent.prototype, "fixed", {
set: function (val) {
this.fixedValue = convertToBoolProperty(val);
},
enumerable: true,
configurable: true
});
return NgaLayoutFooterComponent;
}());
__decorate$9([
_angular_core.HostBinding('class.fixed'),
__metadata$4("design:type", Boolean)
], NgaLayoutFooterComponent.prototype, "fixedValue", void 0);
__decorate$9([
_angular_core.Input(),
__metadata$4("design:type", Boolean),
__metadata$4("design:paramtypes", [Boolean])
], NgaLayoutFooterComponent.prototype, "fixed", null);
NgaLayoutFooterComponent = __decorate$9([
_angular_core.Component({
selector: 'nga-layout-footer',
template: "\n <nav [class.fixed]=\"fixedValue\">\n <ng-content></ng-content>\n </nav>\n ",
})
], NgaLayoutFooterComponent);
/**
* A basic content container component
*
* While this component can be used alone, it also provides a number
* of child components for common layout sections, including:
* - nga-sidebar
* - nga-layout-column
* - nga-layout-content
* - nga-layout-header
* - nga-layout-footer
*/
var NgaLayoutComponent = (function () {
function NgaLayoutComponent(themeService, spinnerService, componentFactoryResolver, elementRef, renderer) {
var _this = this;
this.themeService = themeService;
this.spinnerService = spinnerService;
this.componentFactoryResolver = componentFactoryResolver;
this.elementRef = elementRef;
this.renderer = renderer;
// TODO: can we remove this?
this.centerValue = false;
this.afterViewInit$ = new rxjs_BehaviorSubject.BehaviorSubject(null);
this.themeSubscription = this.themeService.onThemeChange().subscribe(function (theme) {
if (theme.previous) {
_this.renderer.removeClass(_this.elementRef.nativeElement, "nga-theme-" + theme.previous);
}
_this.renderer.addClass(_this.elementRef.nativeElement, "nga-theme-" + theme.name);
});
this.appendClassSubscription = this.themeService.onAppendLayoutClass().subscribe(function (className) {
_this.renderer.addClass(_this.elementRef.nativeElement, className);
});
this.removeClassSubscription = this.themeService.onRemoveLayoutClass().subscribe(function (className) {
_this.renderer.removeClass(_this.elementRef.nativeElement, className);
});
this.spinnerService.registerLoader(new Promise(function (resolve, reject) {
_this.afterViewInit$.subscribe(function (_) { return resolve(); });
}));
this.spinnerService.load();
// trigger first time so that after the change we have the initial value
this.themeService.changeWindowWidth(window.innerWidth);
}
Object.defineProperty(NgaLayoutComponent.prototype, "center", {
set: function (val) {
this.centerValue = convertToBoolProperty(val);
},
enumerable: true,
configurable: true
});
NgaLayoutComponent.prototype.ngAfterViewInit = function () {
var _this = this;
this.appendSubscription = this.themeService.onAppendToTop()
.subscribe(function (data) {
var componentFactory = _this.componentFactoryResolver.resolveComponentFactory(data.component);
var componentRef = _this.veryTopRef.createComponent(componentFactory);
data.listener.next(componentRef);
});
this.clearSubscription = this.themeService.onClearLayoutTop()
.subscribe(function (data) {
_this.veryTopRef.clear();
data.listener.next(true);
});
this.afterViewInit$.next(true);
};
NgaLayoutComponent.prototype.ngOnDestroy = function () {
this.themeSubscription.unsubscribe();
this.appendClassSubscription.unsubscribe();
this.removeClassSubscription.unsubscribe();
this.appendSubscription.unsubscribe();
this.clearSubscription.unsubscribe();
};
NgaLayoutComponent.prototype.onResize = function (event) {
this.themeService.changeWindowWidth(event.target.innerWidth);
};
return NgaLayoutComponent;
}());
__decorate$9([
_angular_core.HostBinding('class.center'),
__metadata$4("design:type", Boolean)
], NgaLayoutComponent.prototype, "centerValue", void 0);
__decorate$9([
_angular_core.Input(),
__metadata$4("design:type", Boolean),
__metadata$4("design:paramtypes", [Boolean])
], NgaLayoutComponent.prototype, "center", null);
__decorate$9([
_angular_core.ViewChild('layoutTopDynamicArea', { read: _angular_core.ViewContainerRef }),
__metadata$4("design:type", _angular_core.ViewContainerRef)
], NgaLayoutComponent.prototype, "veryTopRef", void 0);
__decorate$9([
_angular_core.HostListener('window:resize', ['$event']),
__metadata$4("design:type", Function),
__metadata$4("design:paramtypes", [Object]),
__metadata$4("design:returntype", void 0)
], NgaLayoutComponent.prototype, "onResize", null);
NgaLayoutComponent = __decorate$9([
_angular_core.Component({
selector: 'nga-layout',
styles: [":host{-webkit-font-smoothing:antialiased}:host .layout{display:flex;flex-direction:column}:host /deep/ nga-layout-header{display:block}:host /deep/ nga-layout-header nav{align-items:center;display:flex}:host /deep/ nga-layout-header.fixed{position:fixed;left:0;right:0;z-index:100}:host .layout-container{flex:1;display:flex;flex-direction:row}:host .layout-container /deep/ nga-sidebar{order:0}:host .layout-container /deep/ nga-sidebar.right{order:2}:host .layout-container /deep/ nga-sidebar .fixed{position:fixed;width:100%;overflow-y:auto;height:100%}:host .layout-container .content{display:flex;flex:1;flex-direction:column}:host .layout-container .content.center{max-width:100%;position:relative;margin-left:auto;margin-right:auto}:host .layout-container .content .columns{display:flex;flex-direction:row;flex:1}:host .layout-container .content .columns /deep/ nga-layout-column{order:2;flex:1 0}:host .layout-container .content .columns /deep/ nga-layout-column.left{order:1}:host .layout-container .content /deep/ nga-layout-footer{display:block;margin-top:auto}:host .layout-container .content /deep/ nga-layout-footer nav{justify-content:center;display:flex} "],
template: "\n <ng-template #layoutTopDynamicArea></ng-template>\n <div class=\"layout\">\n <ng-content select=\"nga-layout-header\"></ng-content>\n <div class=\"layout-container\">\n <ng-content select=\"nga-sidebar\"></ng-content>\n <ng-content select=\"nga-sidebar[left]\"></ng-content>\n <div class=\"content\" [class.center]=\"centerValue\">\n <div class=\"columns\">\n <ng-content select=\"nga-layout-column\"></ng-content>\n </div>\n <ng-content select=\"nga-layout-footer\"></ng-content>\n </div>\n <ng-content select=\"nga-sidebar[right]\"></ng-content>\n </div>\n </div>\n ",
}),
__metadata$4("design:paramtypes", [exports.NgaThemeService,
exports.NgaSpinnerService,
_angular_core.ComponentFactoryResolver,
_angular_core.ElementRef,
_angular_core.Renderer2])
], NgaLayoutComponent);
var __decorate$8 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var NGA_LAYOUT_COMPONENTS = [
NgaLayoutComponent,
NgaLayoutColumnComponent,
NgaLayoutFooterComponent,
NgaLayoutHeaderComponent,
];
exports.NgaLayoutModule = (function () {
function NgaLayoutModule() {
}
return NgaLayoutModule;
}());
exports.NgaLayoutModule = __decorate$8([
_angular_core.NgModule({
imports: [
NgaSharedModule,
],
declarations: NGA_LAYOUT_COMPONENTS.slice(),
exports: NGA_LAYOUT_COMPONENTS.slice(),
})
], exports.NgaLayoutModule);
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
var __decorate$12 = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata$6 = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var __param$2 = (this && this.__param) || function (paramIndex, decorator) {
return function (target, key) { decorator(target, key, paramIndex); }
};
var itemClick$ = new rxjs_ReplaySubject.ReplaySubject(1);
var addItems$ = new rxjs_ReplaySubject.ReplaySubject(1);
var navigateHome$ = new rxjs_ReplaySubject.ReplaySubject(1);
var getSelectedItem$ = new rxjs_ReplaySubject.ReplaySubject(1);
var itemSelect$ = new rxjs_ReplaySubject.ReplaySubject(1);
var itemHover$ = new rxjs_ReplaySubject.ReplaySubject(1);
var submenuToggle$ = new rxjs_ReplaySubject.ReplaySubject(1);
var NgaMenuItem = (function () {
function NgaMenuItem() {
this.pathMath = 'full'; // TODO: is not set if item is initialized by default, should be set anyway
}
return NgaMenuItem;
}());
var ngaMenuOptionsToken = new _angular_core.InjectionToken('NGA_MENU_OPTIONS');
// TODO: map select events to router change events
exports.NgaMenuService = (function () {
function NgaMenuService() {
}
NgaMenuService.prototype.addItems = function (items, tag) {
addItems$.next({ tag: tag, items: items });
};
NgaMenuService.prototype.navigateHome = function (tag) {
navigateHome$.next({ tag: tag });
};
NgaMenuService.prototype.getSelectedItem = function (tag) {
var listener = new rxjs_BehaviorSubject.BehaviorSubject(null);
getSelectedItem$.next({ tag: tag, listener: listener });
return listener.asObservable();
};
NgaMenuService.prototype.onItemClick = function () {
return itemClick$.publish().refCount();
};
NgaMenuService.prototype.onItemSelect = function () {
return itemSelect$.publish().refCount();
};
NgaMenuService.prototype.onItemHover = function () {
return itemHover$.publish().refCount();
};
NgaMenuService.prototype.onSubmenuToggle = function () {
return submenuToggle$.publish().refCount();
};
return NgaMenuService;
}());
exports.NgaMenuService = __decorate$12([
_angular_core.Injectable()
], exports.NgaMenuService);
var NgaMenuInternalService = (function () {
function NgaMenuInternalService(router, location, options) {
this.router = router;
this.location = location;
this.options = options;
this.stack = immutable.List();
this.items = immutable.List();
if (options && options.items) {
this.items = immutable.List(this.options.items);
}
else {
this.items = immutable.List();
}
}
NgaMenuInternalService.prototype.getItems = function () {
return immutable.List(this.items);
};
NgaMenuInternalService.prototype.prepareItems = function (items) {
var _this = this;
items.forEach(function (i) { return _this.setParent(i); });
items.forEach(function (i) { return _this.prepareItem(i); });
this.clearStack();
};
NgaMenuInternalService.prototype.onAddItem = function () {
return addItems$.publish().refCount();
};
NgaMenuInternalService.prototype.onNavigateHome = function () {
return navigateHome$.publish().refCount();
};
NgaMenuInternalService.prototype.onGetSelectedItem = function () {
return getSelectedItem$.publish().refCount();
};
NgaMenuInternalService.prototype.itemHover = function (item, tag) {
itemHover$.next({
tag: tag,
item: item,
});
};
NgaMenuInternalService.prototype.submenuToggle = function (item, tag) {
submenuToggle$.next({
tag: tag,
item: item,
});
};
NgaMenuInternalService.prototype.resetItems = function (items) {
var _this = this;
items.forEach(function (i) { return _this.resetItem(i); });
this.clearStack();
};
NgaMenuInternalService.prototype.itemSelect = function (item, tag) {
itemSelect$.next({
tag: tag,
item: item,
});
};
NgaMenuInternalService.prototype.itemClick = function (item, tag