@miesil/pp-breadcrumbs
Version:
PP-Breadcrumbs is an Angular 7 module generating breadcrumbs based on the routing state.
330 lines (321 loc) • 13.4 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('rxjs'), require('lodash'), require('rxjs/operators'), require('@angular/core'), require('@angular/router'), require('@angular/common')) :
typeof define === 'function' && define.amd ? define('@miesil/pp-breadcrumbs', ['exports', 'rxjs', 'lodash', 'rxjs/operators', '@angular/core', '@angular/router', '@angular/common'], factory) :
(factory((global.miesil = global.miesil || {}, global.miesil['pp-breadcrumbs'] = {}),global.rxjs,global.lodash,global.rxjs.operators,global.ng.core,global.ng.router,global.ng.common));
}(this, (function (exports,rxjs,lodash,operators,i0,i1,common) { 'use strict';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
lodash.templateSettings.interpolate = /{{([\s\S]+?)}}/g;
var PpBreadcrumbsResolver = /** @class */ (function () {
function PpBreadcrumbsResolver() {
}
/**
* @param {?} route
* @param {?} state
* @return {?}
*/
PpBreadcrumbsResolver.prototype.resolve = /**
* @param {?} route
* @param {?} state
* @return {?}
*/
function (route, state) {
/** @type {?} */
var data = route.routeConfig.data;
/** @type {?} */
var path = this.getFullPath(route);
/** @type {?} */
var rawText = typeof data.breadcrumbs === 'string' ? data.breadcrumbs : data.breadcrumbs.text || data.text || path;
return rxjs.of([
{
path: path,
text: this.stringFormat(rawText, route.data)
}
]);
};
/**
* @param {?} route
* @return {?}
*/
PpBreadcrumbsResolver.prototype.getFullPath = /**
* @param {?} route
* @return {?}
*/
function (route) {
/** @type {?} */
var relativePath = ( /**
* @param {?} segments
* @return {?}
*/function (segments) {
return segments.reduce(( /**
* @param {?} a
* @param {?} v
* @return {?}
*/function (a, v) { return (a += '/' + v.path); }), '');
});
/** @type {?} */
var fullPath = ( /**
* @param {?} routes
* @return {?}
*/function (routes) {
return routes.reduce(( /**
* @param {?} a
* @param {?} v
* @return {?}
*/function (a, v) { return (a += relativePath(v.url)); }), '');
});
return fullPath(route.pathFromRoot);
};
/**
* @private
* @param {?} templateString
* @param {?} binding
* @return {?}
*/
PpBreadcrumbsResolver.prototype.stringFormat = /**
* @private
* @param {?} templateString
* @param {?} binding
* @return {?}
*/
function (templateString, binding) {
/** @type {?} */
var compiled = lodash.template(templateString);
return compiled(binding);
};
PpBreadcrumbsResolver.decorators = [
{ type: i0.Injectable }
];
return PpBreadcrumbsResolver;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var PpBreadcrumbsService = /** @class */ (function () {
function PpBreadcrumbsService(router, route, injector) {
var _this = this;
this.router = router;
this.injector = injector;
this.breadcrumbs = new rxjs.BehaviorSubject([]);
this.defaultResolver = new PpBreadcrumbsResolver();
this.breadcrumbsSource = [];
this.router.events.pipe(operators.filter(( /**
* @param {?} x
* @return {?}
*/function (x) { return x instanceof i1.NavigationEnd; }))).subscribe(( /**
* @param {?} event
* @return {?}
*/function (event) {
_this.resolveCrumbs(router.routerState.snapshot.root)
.pipe(operators.mergeMap(( /**
* @param {?} breadcrumbs
* @return {?}
*/function (breadcrumbs) { return breadcrumbs; })), operators.distinct(( /**
* @param {?} breadcrumb
* @return {?}
*/function (breadcrumb) { return breadcrumb.text; })), operators.toArray(), operators.tap(( /**
* @param {?} breadcrumbs
* @return {?}
*/function (breadcrumbs) { return _this.breadcrumbsSource = breadcrumbs; })), operators.mergeMap(( /**
* @param {?} breadcrumbs
* @return {?}
*/function (breadcrumbs) {
return _this.postProcess ? _this.wrapIntoObservable(_this.postProcess(breadcrumbs)).pipe(operators.first()) : rxjs.of(breadcrumbs);
})))
.subscribe(( /**
* @param {?} breadcrumbs
* @return {?}
*/function (breadcrumbs) {
_this.breadcrumbs.next(breadcrumbs);
}));
}));
}
Object.defineProperty(PpBreadcrumbsService.prototype, "crumbs$", {
get: /**
* @return {?}
*/ function () {
return this.breadcrumbs;
},
enumerable: true,
configurable: true
});
/**
* @return {?}
*/
PpBreadcrumbsService.prototype.refreshBreadcrumbs = /**
* @return {?}
*/
function () {
var _this = this;
(this.postProcess ? this.wrapIntoObservable(this.postProcess(this.breadcrumbsSource)).pipe(operators.first()) : rxjs.of(this.breadcrumbsSource))
.subscribe(( /**
* @param {?} breadcrumbs
* @return {?}
*/function (breadcrumbs) {
_this.breadcrumbs.next(breadcrumbs);
}));
};
/**
* @private
* @param {?} route
* @return {?}
*/
PpBreadcrumbsService.prototype.resolveCrumbs = /**
* @private
* @param {?} route
* @return {?}
*/
function (route) {
/** @type {?} */
var crumbs$ = rxjs.of([]);
/** @type {?} */
var data = route.routeConfig && route.routeConfig.data;
if (data && data.breadcrumbs) {
/** @type {?} */
var resolver = data.breadcrumbs.prototype instanceof PpBreadcrumbsResolver ? this.injector.get(data.breadcrumbs) : this.defaultResolver;
/** @type {?} */
var result = resolver.resolve(route, this.router.routerState.snapshot);
crumbs$ = this.wrapIntoObservable(result).pipe(operators.first());
}
return route.firstChild ? rxjs.concat(crumbs$, this.resolveCrumbs(route.firstChild)) : crumbs$;
};
/**
* @private
* @template T
* @param {?} value
* @return {?}
*/
PpBreadcrumbsService.prototype.wrapIntoObservable = /**
* @private
* @template T
* @param {?} value
* @return {?}
*/
function (value) {
return value instanceof rxjs.Observable ? value : this.isPromise(value) ? rxjs.from(Promise.resolve(value)) : rxjs.of(( /** @type {?} */(value)));
};
/**
* @private
* @param {?} value
* @return {?}
*/
PpBreadcrumbsService.prototype.isPromise = /**
* @private
* @param {?} value
* @return {?}
*/
function (value) {
return value && typeof value.then === 'function';
};
PpBreadcrumbsService.decorators = [
{ type: i0.Injectable, args: [{
providedIn: 'root'
},] }
];
/** @nocollapse */
PpBreadcrumbsService.ctorParameters = function () {
return [
{ type: i1.Router },
{ type: i1.ActivatedRoute },
{ type: i0.Injector }
];
};
/** @nocollapse */ PpBreadcrumbsService.ngInjectableDef = i0.defineInjectable({ factory: function PpBreadcrumbsService_Factory() { return new PpBreadcrumbsService(i0.inject(i1.Router), i0.inject(i1.ActivatedRoute), i0.inject(i0.INJECTOR)); }, token: PpBreadcrumbsService, providedIn: "root" });
return PpBreadcrumbsService;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var PpBreadcrumbsComponent = /** @class */ (function () {
function PpBreadcrumbsComponent(service) {
this.service = service;
this.subscriptions = [];
this.onNavigate = new i0.EventEmitter();
}
/**
* @return {?}
*/
PpBreadcrumbsComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
this.subscriptions.push(this.service.crumbs$.subscribe(( /**
* @param {?} x
* @return {?}
*/function (x) {
_this.crumbs = x;
})));
};
/**
* @return {?}
*/
PpBreadcrumbsComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.subscriptions.forEach(( /**
* @param {?} x
* @return {?}
*/function (x) { return x.unsubscribe(); }));
this.onNavigate.complete();
this.onNavigate = undefined;
};
/**
* @return {?}
*/
PpBreadcrumbsComponent.prototype.click = /**
* @return {?}
*/
function () {
this.onNavigate.emit({});
};
PpBreadcrumbsComponent.decorators = [
{ type: i0.Component, args: [{
selector: 'pp-breadcrumbs',
template: "<ol *ngIf=\"crumbs.length\" class=\"breadcrumb\">\r\n <li *ngFor=\"let crumb of crumbs; let first = first; let last = last\" [ngClass]=\"{ 'active': last }\" class=\"breadcrumb-item\">\r\n <a *ngIf=\"!last; else lastBreadcrumb\" [routerLink]=\"crumb.path\" [innerHTML]=\"crumb.text\" (click)=\"click()\"></a>\r\n <ng-template #lastBreadcrumb>\r\n <span [innerHTML]=\"crumb.text\"></span>\r\n </ng-template>\r\n </li>\r\n</ol>\r\n",
styles: [""]
}] }
];
/** @nocollapse */
PpBreadcrumbsComponent.ctorParameters = function () {
return [
{ type: PpBreadcrumbsService }
];
};
PpBreadcrumbsComponent.propDecorators = {
onNavigate: [{ type: i0.Output }]
};
return PpBreadcrumbsComponent;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var PpBreadcrumbsModule = /** @class */ (function () {
function PpBreadcrumbsModule() {
}
PpBreadcrumbsModule.decorators = [
{ type: i0.NgModule, args: [{
declarations: [PpBreadcrumbsComponent],
imports: [common.CommonModule, i1.RouterModule],
exports: [PpBreadcrumbsComponent]
},] }
];
return PpBreadcrumbsModule;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
exports.PpBreadcrumbsService = PpBreadcrumbsService;
exports.PpBreadcrumbsComponent = PpBreadcrumbsComponent;
exports.PpBreadcrumbsResolver = PpBreadcrumbsResolver;
exports.PpBreadcrumbsModule = PpBreadcrumbsModule;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=miesil-pp-breadcrumbs.umd.js.map