ngx-breadcrumbs
Version:
Angular 4+ routing breadcrumbs
266 lines (265 loc) • 8.64 kB
JavaScript
import { Component, Injectable, Injector, NgModule } from '@angular/core';
import { ActivatedRoute, NavigationEnd, Router, RouterModule } from '@angular/router';
import { Observable as Observable$1 } from 'rxjs/Observable';
import { BehaviorSubject as BehaviorSubject$1 } from 'rxjs/BehaviorSubject';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/filter';
import 'rxjs/add/operator/concat';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/operator/toArray';
import 'rxjs/add/operator/distinct';
import 'rxjs/add/operator/first';
import 'rxjs/add/observable/fromPromise';
import * as template from 'lodash.template';
import * as templateSettings from 'lodash.templatesettings';
import { CommonModule } from '@angular/common';
// Angular makes it impossible to make modules optional :(
// try {
// const _ = r('lodash');
// _template = _.template;
// _templateSettings = _.templateSetting
// } catch (e) {
// try {
// _template = r('lodash.template');
// _templateSettings = r('lodash.templatesettings');
// } catch (e) {
// _template = (y) => (x) => y;
// _templateSettings = {};
// }
// } finally {
// _templateSettings.interpolate = /{{([\s\S]+?)}}/g;
// }
var _ = {
template: template,
templateSettings: templateSettings
};
_.templateSettings.interpolate = /{{([\s\S]+?)}}/g;
/**
* @param {?} template
* @param {?} binding
* @return {?}
*/
function stringFormat(template$$1, binding) {
var /** @type {?} */ compiled = _.template(template$$1);
return compiled(binding);
}
/**
* @param {?} value
* @return {?}
*/
function isPromise(value) {
return value && (typeof value.then === 'function');
}
/**
* @template T
* @param {?} value
* @return {?}
*/
function wrapIntoObservable(value) {
if (value instanceof Observable$1)
return value;
if (isPromise(value)) {
return Observable$1.fromPromise(Promise.resolve(value));
}
return Observable$1.of(/** @type {?} */ (value));
}
var McBreadcrumbsConfig = (function () {
function McBreadcrumbsConfig() {
}
return McBreadcrumbsConfig;
}());
McBreadcrumbsConfig.decorators = [
{ type: Injectable },
];
/**
* @nocollapse
*/
McBreadcrumbsConfig.ctorParameters = function () { return []; };
var McBreadcrumbsResolver = (function () {
function McBreadcrumbsResolver() {
}
/**
* @param {?} route
* @param {?} state
* @return {?}
*/
McBreadcrumbsResolver.prototype.resolve = function (route, state) {
var /** @type {?} */ data = route.routeConfig.data;
var /** @type {?} */ path = this.getFullPath(route);
var /** @type {?} */ text = typeof (data.breadcrumbs) === 'string' ? data.breadcrumbs : data.breadcrumbs.text || data.text || path;
text = stringFormat(text, route.data);
var /** @type {?} */ crumbs = [{
text: text,
path: path
}];
return Observable$1.of(crumbs);
};
/**
* @param {?} route
* @return {?}
*/
McBreadcrumbsResolver.prototype.getFullPath = function (route) {
var /** @type {?} */ relativePath = function (segments) { return segments.reduce(function (a, v) { return a += '/' + v.path; }, ''); };
var /** @type {?} */ fullPath = function (routes) { return routes.reduce(function (a, v) { return a += relativePath(v.url); }, ''); };
return fullPath(route.pathFromRoot);
};
return McBreadcrumbsResolver;
}());
var McBreadcrumbsService = (function () {
/**
* @param {?} _router
* @param {?} route
* @param {?} _config
* @param {?} _injector
*/
function McBreadcrumbsService(_router, route, _config, _injector) {
var _this = this;
this._router = _router;
this._config = _config;
this._injector = _injector;
this._breadcrumbs = new BehaviorSubject$1([]);
this._defaultResolver = new McBreadcrumbsResolver();
this._router.events
.filter(function (x) { return x instanceof NavigationEnd; })
.subscribe(function (event) {
var route = _router.routerState.snapshot.root;
//Observable.of(this._config.prefixCrumbs)
_this._resolveCrumbs(route)
.flatMap(function (x) { return x; })
.distinct(function (x) { return x.text; })
.toArray()
.flatMap(function (x) {
if (_this._config.postProcess) {
var y = _this._config.postProcess(x);
return wrapIntoObservable(y).first();
}
else {
return Observable$1.of(x);
}
})
.subscribe(function (x) {
_this._breadcrumbs.next(x);
});
});
}
Object.defineProperty(McBreadcrumbsService.prototype, "crumbs$", {
/**
* @return {?}
*/
get: function () {
return this._breadcrumbs;
},
enumerable: true,
configurable: true
});
/**
* @param {?} route
* @return {?}
*/
McBreadcrumbsService.prototype._resolveCrumbs = function (route) {
var /** @type {?} */ crumbs$;
var /** @type {?} */ data = route.routeConfig &&
route.routeConfig.data;
if (data && data.breadcrumbs) {
var /** @type {?} */ resolver = void 0;
if (data.breadcrumbs.prototype instanceof McBreadcrumbsResolver) {
resolver = this._injector.get(data.breadcrumbs);
}
else {
resolver = this._defaultResolver;
}
var /** @type {?} */ result = resolver.resolve(route, this._router.routerState.snapshot);
crumbs$ = wrapIntoObservable(result).first();
}
else {
crumbs$ = Observable$1.of([]);
}
if (route.firstChild) {
crumbs$ = crumbs$.concat(this._resolveCrumbs(route.firstChild));
}
return crumbs$;
};
return McBreadcrumbsService;
}());
McBreadcrumbsService.decorators = [
{ type: Injectable },
];
/**
* @nocollapse
*/
McBreadcrumbsService.ctorParameters = function () { return [
{ type: Router, },
{ type: ActivatedRoute, },
{ type: McBreadcrumbsConfig, },
{ type: Injector, },
]; };
var McBreadcrumbsComponent = (function () {
/**
* @param {?} service
*/
function McBreadcrumbsComponent(service) {
this.service = service;
this.subscriptions = new Array();
}
/**
* @return {?}
*/
McBreadcrumbsComponent.prototype.ngOnInit = function () {
var _this = this;
var /** @type {?} */ s = this.service.crumbs$.subscribe(function (x) {
_this.crumbs = x;
});
};
/**
* @return {?}
*/
McBreadcrumbsComponent.prototype.ngOnDestroy = function () {
this.subscriptions.forEach(function (x) { return x.unsubscribe(); });
};
return McBreadcrumbsComponent;
}());
McBreadcrumbsComponent.decorators = [
{ type: Component, args: [{
selector: 'mc-breadcrumbs',
template: "\n <ol *ngIf=\"crumbs.length\" class=\"breadcrumb\">\n <li *ngFor=\"let crumb of crumbs; let last = last\" [ngClass]=\"{ 'active': last }\" class=\"breadcrumb-item\">\n <a *ngIf=\"!last\" [routerLink]=\"crumb.path\">{{ crumb.text }}</a>\n <span *ngIf=\"last\">{{ crumb.text }}</span>\n </li>\n </ol>\n "
},] },
];
/**
* @nocollapse
*/
McBreadcrumbsComponent.ctorParameters = function () { return [
{ type: McBreadcrumbsService, },
]; };
var McBreadcrumbsModule = (function () {
function McBreadcrumbsModule() {
}
/**
* @return {?}
*/
McBreadcrumbsModule.forRoot = function () {
return {
ngModule: McBreadcrumbsModule,
providers: [
McBreadcrumbsService,
McBreadcrumbsConfig
]
};
};
return McBreadcrumbsModule;
}());
McBreadcrumbsModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule, RouterModule],
declarations: [McBreadcrumbsComponent],
exports: [McBreadcrumbsComponent]
},] },
];
/**
* @nocollapse
*/
McBreadcrumbsModule.ctorParameters = function () { return []; };
/**
* Generated bundle index. Do not edit.
*/
export { McBreadcrumbsComponent, McBreadcrumbsService, McBreadcrumbsConfig, McBreadcrumbsResolver, McBreadcrumbsModule };
//# sourceMappingURL=ngx-breadcrumbs.es5.js.map