UNPKG

xng-breadcrumb

Version:

A declarative and reactive breadcrumb approach for Angular 6 and beyond https://www.npmjs.com/package/xng-breadcrumb

101 lines (100 loc) 4.28 kB
import { ActivatedRoute, Router } from '@angular/router'; import { Breadcrumb } from './breadcrumb'; export declare class BreadcrumbService { private activatedRoute; private router; /** * breadcrumb label for base OR root path. Usually, this can be set as 'Home' */ private baseBreadcrumb; private baseHref; /** * dynamicBreadcrumbStore holds information about dynamically updated breadcrumbs. * Breadcrumbs can be set from anywhere (component, service) in the app. * On every breadcrumb update check this store and use the info if available. */ private dynamicBreadcrumbStore; /** * breadcrumbList for the current route * When breadcrumb info is changed dynamically, check if the currentBreadcrumbs is effected * If effected, update the change and emit a new stream */ private currentBreadcrumbs; /** * Breadcrumbs observable to be subscribed by BreadcrumbComponent * Emits on every route change OR dynamic update of breadcrumb */ private breadcrumbs; breadcrumbs$: import("rxjs").Observable<Breadcrumb[]>; private pathParamPrefix; private pathParamRegexIdentifier; private pathParamRegexReplacer; constructor(activatedRoute: ActivatedRoute, router: Router); /** * Update breadcrumb label or options for - * * route (complete route path). route can be passed the same way you define angular routes * 1) update label Ex: set('/mentor', 'Mentor'), set('/mentor/:id', 'Mentor Details') * 2) change visibility Ex: set('/mentor/:id/edit', { skip: true }) * 3) add info Ex: set('/mentor/:id/edit', { info: { icon: 'edit', iconColor: 'blue' } }) * ------------------------ OR ------------------------- * * alias (prefixed with '@'). breadcrumb alias is unique for a route * 1) update label Ex: set('@mentor', 'Enabler') * 2) change visibility Ex: set('@mentorEdit', { skip: true }) * 3) add info Ex: set('@mentorEdit', { info: { icon: 'edit', iconColor: 'blue' } }) */ set(pathOrAlias: string, breadcrumb: string | Breadcrumb): void; private setBaseBreadcrumb; /** * Whenever route changes build breadcrumb list again */ private detectRouteChanges; private prepareBreadcrumbList; private prepareBreadcrumbItem; /** * For a specific route, breadcrumb can be defined either on parent data OR it's child(which has empty path) data * When both are defined, child takes precedence * * Ex: Below we are setting breadcrumb on both parent and child. * So, child takes precedence and "Defined On Child" is displayed for the route 'home' * { path: 'home', loadChildren: './home/home.module#HomeModule' , data: {breadcrumb: "Defined On Module"}} * AND * children: [ * { path: '', component: ShowUserComponent, data: {breadcrumb: "Defined On Child" } * ] */ private parseRouteData; private getFromStore; /** * To update breadcrumb label for a route with path param, we need regex that matches route. * Instead of user providing regex, we help in preparing regex dynamically * * Ex: route declaration - path: '/mentor/:id' * breadcrumbService.set('/mentor/:id', 'Uday'); * '/mentor/2' OR 'mentor/adasd' we should use 'Uday' as label * * regex string is built, if route has path params(contains with ':') */ private buildRouteRegExp; /** * Update current breadcrumb definition and emit a new stream of breadcrumbs * Also update the store to reuse dynamic declarations */ private updateStore; private getBreadcrumbIndexes; private getBreadcrumbIndexesByType; private resolvePathParam; /** * get empty children of a module or Component. Empty child is the one with path: '' * When parent and it's children (that has empty route path) define data * merge them both with child taking precedence */ private mergeWithBaseChildData; private validateArguments; /** * breadcrumb can be passed a label or an options object * If passed as a string convert to breadcrumb options object */ private getBreadcrumbOptions; }