ng-prime-tools
Version:
An advanced PrimeNG table for Angular
50 lines • 9.85 kB
JavaScript
import { Component, Input, } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "./pt-bread-crumb.service";
import * as i2 from "@angular/common";
import * as i3 from "primeng/breadcrumb";
export class PTBreadCrumbComponent {
constructor(breadcrumbService, renderer, el) {
this.breadcrumbService = breadcrumbService;
this.renderer = renderer;
this.el = el;
}
ngOnInit() {
this.home = { icon: 'pi pi-home', routerLink: 'dashboard' };
// Pass the input menuData to the service
this.breadcrumbService.setMenuData(this.breadCrumbConfig.menuData);
this.breadCrumbSubscription = this.breadcrumbService.breadcrumb$.subscribe((breadcrumb) => {
this.items = breadcrumb;
});
}
ngAfterViewInit() {
this.applyBackgroundStyles();
}
ngOnDestroy() {
if (this.breadCrumbSubscription) {
this.breadCrumbSubscription.unsubscribe();
}
}
applyBackgroundStyles() {
const transparency = this.breadCrumbConfig.pattern?.transparencyPercentage || '100';
const backgroundImage = this.breadCrumbConfig.pattern?.imageUrl
? `linear-gradient(rgba(255, 255, 255, ${1 - parseFloat(transparency) / 100}), rgba(255, 255, 255, ${1 - parseFloat(transparency) / 100})), url('${this.breadCrumbConfig.pattern.imageUrl}')`
: '';
// Delay to ensure that the element is fully rendered before applying styles
setTimeout(() => {
const breadcrumbNav = this.el.nativeElement.querySelector('nav.p-breadcrumb.p-component');
if (breadcrumbNav) {
this.renderer.setStyle(breadcrumbNav, 'background-image', backgroundImage);
}
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: PTBreadCrumbComponent, deps: [{ token: i1.PTBreadCrumbService }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: PTBreadCrumbComponent, selector: "pt-bread-crumb", inputs: { breadCrumbConfig: "breadCrumbConfig" }, ngImport: i0, template: "<div\n *ngIf=\"items && items.length > 0\"\n class=\"pt-bread-crumb breadcrumb-container\"\n>\n <p-breadcrumb class=\"max-w-full\" [model]=\"items\" [home]=\"home\"></p-breadcrumb>\n</div>\n", styles: [".pt-bread-crumb ::ng-deep chevronrighticon.p-element.p-icon-wrapper.ng-star-inserted{margin-top:4px}.pt-bread-crumb ::ng-deep .p-breadcrumb{margin-bottom:20px}.pt-bread-crumb .breadcrumb-container{padding:10px;border-radius:5px;margin-bottom:20px}.pt-bread-crumb ::ng-deep .breadcrumb-background{background-size:cover;background-position:center;background-repeat:no-repeat}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: PTBreadCrumbComponent, decorators: [{
type: Component,
args: [{ selector: 'pt-bread-crumb', template: "<div\n *ngIf=\"items && items.length > 0\"\n class=\"pt-bread-crumb breadcrumb-container\"\n>\n <p-breadcrumb class=\"max-w-full\" [model]=\"items\" [home]=\"home\"></p-breadcrumb>\n</div>\n", styles: [".pt-bread-crumb ::ng-deep chevronrighticon.p-element.p-icon-wrapper.ng-star-inserted{margin-top:4px}.pt-bread-crumb ::ng-deep .p-breadcrumb{margin-bottom:20px}.pt-bread-crumb .breadcrumb-container{padding:10px;border-radius:5px;margin-bottom:20px}.pt-bread-crumb ::ng-deep .breadcrumb-background{background-size:cover;background-position:center;background-repeat:no-repeat}\n"] }]
}], ctorParameters: () => [{ type: i1.PTBreadCrumbService }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { breadCrumbConfig: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHQtYnJlYWQtY3J1bWIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctcHJpbWUtdG9vbHMvc3JjL2xpYi9wdC1icmVhZC1jcnVtYi9wdC1icmVhZC1jcnVtYi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1wcmltZS10b29scy9zcmMvbGliL3B0LWJyZWFkLWNydW1iL3B0LWJyZWFkLWNydW1iLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxHQU1OLE1BQU0sZUFBZSxDQUFDOzs7OztBQVd2QixNQUFNLE9BQU8scUJBQXFCO0lBTWhDLFlBQ1UsaUJBQXNDLEVBQ3RDLFFBQW1CLEVBQ25CLEVBQWM7UUFGZCxzQkFBaUIsR0FBakIsaUJBQWlCLENBQXFCO1FBQ3RDLGFBQVEsR0FBUixRQUFRLENBQVc7UUFDbkIsT0FBRSxHQUFGLEVBQUUsQ0FBWTtJQUNyQixDQUFDO0lBRUosUUFBUTtRQUNOLElBQUksQ0FBQyxJQUFJLEdBQUcsRUFBRSxJQUFJLEVBQUUsWUFBWSxFQUFFLFVBQVUsRUFBRSxXQUFXLEVBQUUsQ0FBQztRQUU1RCx5Q0FBeUM7UUFDekMsSUFBSSxDQUFDLGlCQUFpQixDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsUUFBUSxDQUFDLENBQUM7UUFFbkUsSUFBSSxDQUFDLHNCQUFzQixHQUFHLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxXQUFXLENBQUMsU0FBUyxDQUN4RSxDQUFDLFVBQVUsRUFBRSxFQUFFO1lBQ2IsSUFBSSxDQUFDLEtBQUssR0FBRyxVQUFVLENBQUM7UUFDMUIsQ0FBQyxDQUNGLENBQUM7SUFDSixDQUFDO0lBRUQsZUFBZTtRQUNiLElBQUksQ0FBQyxxQkFBcUIsRUFBRSxDQUFDO0lBQy9CLENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxJQUFJLENBQUMsc0JBQXNCLEVBQUUsQ0FBQztZQUNoQyxJQUFJLENBQUMsc0JBQXNCLENBQUMsV0FBVyxFQUFFLENBQUM7UUFDNUMsQ0FBQztJQUNILENBQUM7SUFFRCxxQkFBcUI7UUFDbkIsTUFBTSxZQUFZLEdBQ2hCLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxPQUFPLEVBQUUsc0JBQXNCLElBQUksS0FBSyxDQUFDO1FBQ2pFLE1BQU0sZUFBZSxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxPQUFPLEVBQUUsUUFBUTtZQUM3RCxDQUFDLENBQUMsdUNBQ0UsQ0FBQyxHQUFHLFVBQVUsQ0FBQyxZQUFZLENBQUMsR0FBRyxHQUNqQywwQkFBMEIsQ0FBQyxHQUFHLFVBQVUsQ0FBQyxZQUFZLENBQUMsR0FBRyxHQUFHLFlBQzFELElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxPQUFPLENBQUMsUUFDaEMsSUFBSTtZQUNOLENBQUMsQ0FBQyxFQUFFLENBQUM7UUFFUCw0RUFBNEU7UUFDNUUsVUFBVSxDQUFDLEdBQUcsRUFBRTtZQUNkLE1BQU0sYUFBYSxHQUFHLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLGFBQWEsQ0FDdkQsOEJBQThCLENBQy9CLENBQUM7WUFFRixJQUFJLGFBQWEsRUFBRSxDQUFDO2dCQUNsQixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FDcEIsYUFBYSxFQUNiLGtCQUFrQixFQUNsQixlQUFlLENBQ2hCLENBQUM7WUFDSixDQUFDO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDOytHQTVEVSxxQkFBcUI7bUdBQXJCLHFCQUFxQix3R0NuQmxDLG1NQU1BOzs0RkRhYSxxQkFBcUI7a0JBTGpDLFNBQVM7K0JBQ0UsZ0JBQWdCO3lJQUtqQixnQkFBZ0I7c0JBQXhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDb21wb25lbnQsXG4gIElucHV0LFxuICBPbkluaXQsXG4gIE9uRGVzdHJveSxcbiAgUmVuZGVyZXIyLFxuICBFbGVtZW50UmVmLFxuICBBZnRlclZpZXdJbml0LFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE1lbnVJdGVtIH0gZnJvbSAncHJpbWVuZy9hcGknO1xuaW1wb3J0IHsgU3Vic2NyaXB0aW9uIH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBQVEJyZWFkQ3J1bWJTZXJ2aWNlIH0gZnJvbSAnLi9wdC1icmVhZC1jcnVtYi5zZXJ2aWNlJztcbmltcG9ydCB7IEJyZWFkQ3J1bWJDb25maWcgfSBmcm9tICcuLi9tb2RlbHMvYnJlYWQtY3J1bWItY29uZmlnLm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAncHQtYnJlYWQtY3J1bWInLFxuICB0ZW1wbGF0ZVVybDogJy4vcHQtYnJlYWQtY3J1bWIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9wdC1icmVhZC1jcnVtYi5jb21wb25lbnQuY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIFBUQnJlYWRDcnVtYkNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgT25EZXN0cm95LCBBZnRlclZpZXdJbml0IHtcbiAgQElucHV0KCkgYnJlYWRDcnVtYkNvbmZpZyE6IEJyZWFkQ3J1bWJDb25maWc7XG4gIGl0ZW1zOiBNZW51SXRlbVtdIHwgdW5kZWZpbmVkO1xuICBob21lOiBNZW51SXRlbSB8IHVuZGVmaW5lZDtcbiAgYnJlYWRDcnVtYlN1YnNjcmlwdGlvbiE6IFN1YnNjcmlwdGlvbjtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIGJyZWFkY3J1bWJTZXJ2aWNlOiBQVEJyZWFkQ3J1bWJTZXJ2aWNlLFxuICAgIHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMixcbiAgICBwcml2YXRlIGVsOiBFbGVtZW50UmVmXG4gICkge31cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLmhvbWUgPSB7IGljb246ICdwaSBwaS1ob21lJywgcm91dGVyTGluazogJ2Rhc2hib2FyZCcgfTtcblxuICAgIC8vIFBhc3MgdGhlIGlucHV0IG1lbnVEYXRhIHRvIHRoZSBzZXJ2aWNlXG4gICAgdGhpcy5icmVhZGNydW1iU2VydmljZS5zZXRNZW51RGF0YSh0aGlzLmJyZWFkQ3J1bWJDb25maWcubWVudURhdGEpO1xuXG4gICAgdGhpcy5icmVhZENydW1iU3Vic2NyaXB0aW9uID0gdGhpcy5icmVhZGNydW1iU2VydmljZS5icmVhZGNydW1iJC5zdWJzY3JpYmUoXG4gICAgICAoYnJlYWRjcnVtYikgPT4ge1xuICAgICAgICB0aGlzLml0ZW1zID0gYnJlYWRjcnVtYjtcbiAgICAgIH1cbiAgICApO1xuICB9XG5cbiAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xuICAgIHRoaXMuYXBwbHlCYWNrZ3JvdW5kU3R5bGVzKCk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5icmVhZENydW1iU3Vic2NyaXB0aW9uKSB7XG4gICAgICB0aGlzLmJyZWFkQ3J1bWJTdWJzY3JpcHRpb24udW5zdWJzY3JpYmUoKTtcbiAgICB9XG4gIH1cblxuICBhcHBseUJhY2tncm91bmRTdHlsZXMoKSB7XG4gICAgY29uc3QgdHJhbnNwYXJlbmN5ID1cbiAgICAgIHRoaXMuYnJlYWRDcnVtYkNvbmZpZy5wYXR0ZXJuPy50cmFuc3BhcmVuY3lQZXJjZW50YWdlIHx8ICcxMDAnO1xuICAgIGNvbnN0IGJhY2tncm91bmRJbWFnZSA9IHRoaXMuYnJlYWRDcnVtYkNvbmZpZy5wYXR0ZXJuPy5pbWFnZVVybFxuICAgICAgPyBgbGluZWFyLWdyYWRpZW50KHJnYmEoMjU1LCAyNTUsIDI1NSwgJHtcbiAgICAgICAgICAxIC0gcGFyc2VGbG9hdCh0cmFuc3BhcmVuY3kpIC8gMTAwXG4gICAgICAgIH0pLCByZ2JhKDI1NSwgMjU1LCAyNTUsICR7MSAtIHBhcnNlRmxvYXQodHJhbnNwYXJlbmN5KSAvIDEwMH0pKSwgdXJsKCcke1xuICAgICAgICAgIHRoaXMuYnJlYWRDcnVtYkNvbmZpZy5wYXR0ZXJuLmltYWdlVXJsXG4gICAgICAgIH0nKWBcbiAgICAgIDogJyc7XG5cbiAgICAvLyBEZWxheSB0byBlbnN1cmUgdGhhdCB0aGUgZWxlbWVudCBpcyBmdWxseSByZW5kZXJlZCBiZWZvcmUgYXBwbHlpbmcgc3R5bGVzXG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICBjb25zdCBicmVhZGNydW1iTmF2ID0gdGhpcy5lbC5uYXRpdmVFbGVtZW50LnF1ZXJ5U2VsZWN0b3IoXG4gICAgICAgICduYXYucC1icmVhZGNydW1iLnAtY29tcG9uZW50J1xuICAgICAgKTtcblxuICAgICAgaWYgKGJyZWFkY3J1bWJOYXYpIHtcbiAgICAgICAgdGhpcy5yZW5kZXJlci5zZXRTdHlsZShcbiAgICAgICAgICBicmVhZGNydW1iTmF2LFxuICAgICAgICAgICdiYWNrZ3JvdW5kLWltYWdlJyxcbiAgICAgICAgICBiYWNrZ3JvdW5kSW1hZ2VcbiAgICAgICAgKTtcbiAgICAgIH1cbiAgICB9KTtcbiAgfVxufVxuIiwiPGRpdlxuICAqbmdJZj1cIml0ZW1zICYmIGl0ZW1zLmxlbmd0aCA+IDBcIlxuICBjbGFzcz1cInB0LWJyZWFkLWNydW1iIGJyZWFkY3J1bWItY29udGFpbmVyXCJcbj5cbiAgPHAtYnJlYWRjcnVtYiBjbGFzcz1cIm1heC13LWZ1bGxcIiBbbW9kZWxdPVwiaXRlbXNcIiBbaG9tZV09XCJob21lXCI+PC9wLWJyZWFkY3J1bWI+XG48L2Rpdj5cbiJdfQ==