primeng/fesm2022/primeng-breadcrumb.mjs

PrimeNG is an open source UI library for Angular featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeB

import * as i2 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { Injectable, EventEmitter, inject, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, ContentChild, ContentChildren, NgModule } from '@angular/core';
import * as i1 from '@angular/router';
import { RouterModule } from '@angular/router';
import { PrimeTemplate, SharedModule } from 'primeng/api';
import { BaseComponent } from 'primeng/basecomponent';
import { ChevronRightIcon, HomeIcon } from 'primeng/icons';
import * as i3 from 'primeng/tooltip';
import { TooltipModule } from 'primeng/tooltip';
import { BaseStyle } from 'primeng/base';

const theme = ({ dt }) => `
.p-breadcrumb {
    background: ${dt('breadcrumb.background')};
    padding: ${dt('breadcrumb.padding')};
    overflow-x: auto;
}

.p-breadcrumb-list {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: ${dt('breadcrumb.gap')};
}

.p-breadcrumb-separator {
    display: flex;
    align-items: center;
    color: ${dt('breadcrumb.separator.color')};
}

.p-breadcrumb-separator .p-icon:dir(rtl) {
    transform: rotate(180deg);
}

.p-breadcrumb::-webkit-scrollbar {
    display: none;
}

.p-breadcrumb-item-link {
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: ${dt('breadcrumb.item.gap')};
    transition: background ${dt('breadcrumb.transition.duration')}, color ${dt('breadcrumb.transition.duration')}, outline-color ${dt('breadcrumb.transition.duration')}, box-shadow ${dt('breadcrumb.transition.duration')};
    border-radius: ${dt('breadcrumb.item.border.radius')};
    outline-color: transparent;
    color: ${dt('breadcrumb.item.color')};
}

.p-breadcrumb-item-link:focus-visible {
    box-shadow: ${dt('breadcrumb.item.focus.ring.shadow')};
    outline: ${dt('breadcrumb.item.focus.ring.width')} ${dt('breadcrumb.item.focus.ring.style')} ${dt('breadcrumb.item.focus.ring.color')};
    outline-offset: ${dt('breadcrumb.item.focus.ring.offset')};
}

.p-breadcrumb-item-link:hover .p-breadcrumb-item-label {
    color: ${dt('breadcrumb.item.hover.color')};
}

.p-breadcrumb-item-label {
    transition: inherit;
}

.p-breadcrumb-item-icon {
    color: ${dt('breadcrumb.item.icon.color')};
    transition: inherit;
}

.p-breadcrumb-item-link:hover .p-breadcrumb-item-icon {
    color: ${dt('breadcrumb.item.icon.hover.color')};
}
`;
const classes = {
    root: 'p-breadcrumb p-component',
    list: 'p-breadcrumb-list',
    homeItem: 'p-breadcrumb-home-item',
    separator: 'p-breadcrumb-separator',
    item: ({ instance }) => ['p-breadcrumb-item', { 'p-disabled': instance.disabled() }],
    itemLink: 'p-breadcrumb-item-link',
    itemIcon: 'p-breadcrumb-item-icon',
    itemLabel: 'p-breadcrumb-item-label'
};
class BreadCrumbStyle extends BaseStyle {
    name = 'breadcrumb';
    theme = theme;
    classes = classes;
    static ɵfac = /*@__PURE__*/ (() => { let ɵBreadCrumbStyle_BaseFactory; return function BreadCrumbStyle_Factory(__ngFactoryType__) { return (ɵBreadCrumbStyle_BaseFactory || (ɵBreadCrumbStyle_BaseFactory = i0.ɵɵgetInheritedFactory(BreadCrumbStyle)))(__ngFactoryType__ || BreadCrumbStyle); }; })();
    static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: BreadCrumbStyle, factory: BreadCrumbStyle.ɵfac });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(BreadCrumbStyle, [{
        type: Injectable
    }], null, null); })();
/**
 *
 * Breadcrumb provides contextual information about page hierarchy.
 *
 * [Live Demo](https://www.primeng.org/breadcrumb/)
 *
 * @module breadcrumbstyle
 *
 */
var BreadcrumbClasses;
(function (BreadcrumbClasses) {
    /**
     * Class name of the root element
     */
    BreadcrumbClasses["root"] = "p-breadcrumb";
    /**
     * Class name of the list element
     */
    BreadcrumbClasses["list"] = "p-breadcrumb-list";
    /**
     * Class name of the home item element
     */
    BreadcrumbClasses["homeItem"] = "p-breadcrumb-home-item";
    /**
     * Class name of the separator element
     */
    BreadcrumbClasses["separator"] = "p-breadcrumb-separator";
    /**
     * Class name of the item element
     */
    BreadcrumbClasses["item"] = "p-breadcrumb-item";
    /**
     * Class name of the item link element
     */
    BreadcrumbClasses["itemLink"] = "p-breadcrumb-item-link";
    /**
     * Class name of the item icon element
     */
    BreadcrumbClasses["itemIcon"] = "p-breadcrumb-item-icon";
    /**
     * Class name of the item label element
     */
    BreadcrumbClasses["itemLabel"] = "p-breadcrumb-item-label";
})(BreadcrumbClasses || (BreadcrumbClasses = {}));

const _c0 = ["item"];
const _c1 = ["separator"];
const _c2 = a0 => ({ "p-breadcrumb-home-item": true, "p-disabled": a0 });
const _c3 = () => ({ exact: false });
const _c4 = a0 => ({ "p-breadcrumb-item": true, "p-disabled": a0 });
const _c5 = a0 => ({ $implicit: a0 });
function Breadcrumb_li_2_a_1_span_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "span", 16);
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(3);
    i0.ɵɵproperty("ngClass", ctx_r1.home.icon)("ngStyle", ctx_r1.home == null ? null : ctx_r1.home.style);
} }
function Breadcrumb_li_2_a_1_HomeIcon_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "HomeIcon", 17);
} if (rf & 2) {
    i0.ɵɵproperty("styleClass", "p-breadcrumb-item-icon");
} }
function Breadcrumb_li_2_a_1_ng_container_3_span_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "span", 19);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(4);
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate(ctx_r1.home.label);
} }
function Breadcrumb_li_2_a_1_ng_container_3_ng_template_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "span", 20);
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(4);
    i0.ɵɵproperty("innerHTML", ctx_r1.home.label, i0.ɵɵsanitizeHtml);
} }
function Breadcrumb_li_2_a_1_ng_container_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵtemplate(1, Breadcrumb_li_2_a_1_ng_container_3_span_1_Template, 2, 1, "span", 18)(2, Breadcrumb_li_2_a_1_ng_container_3_ng_template_2_Template, 1, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const htmlHomeLabel_r3 = i0.ɵɵreference(3);
    const ctx_r1 = i0.ɵɵnextContext(3);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r1.home.escape !== false)("ngIfElse", htmlHomeLabel_r3);
} }
function Breadcrumb_li_2_a_1_Template(rf, ctx) { if (rf & 1) {
    const _r1 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "a", 12);
    i0.ɵɵlistener("click", function Breadcrumb_li_2_a_1_Template_a_click_0_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onClick($event, ctx_r1.home)); });
    i0.ɵɵtemplate(1, Breadcrumb_li_2_a_1_span_1_Template, 1, 2, "span", 13)(2, Breadcrumb_li_2_a_1_HomeIcon_2_Template, 1, 1, "HomeIcon", 14)(3, Breadcrumb_li_2_a_1_ng_container_3_Template, 4, 2, "ng-container", 15);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵproperty("href", ctx_r1.home.url ? ctx_r1.home.url : null, i0.ɵɵsanitizeUrl)("target", ctx_r1.home.target);
    i0.ɵɵattribute("aria-label", ctx_r1.homeAriaLabel)("title", ctx_r1.home.title)("tabindex", ctx_r1.home.disabled ? null : "0");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r1.home.icon);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", !ctx_r1.home.icon);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r1.home.label);
} }
function Breadcrumb_li_2_a_2_span_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "span", 16);
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(3);
    i0.ɵɵproperty("ngClass", ctx_r1.home.icon)("ngStyle", ctx_r1.home.iconStyle);
} }
function Breadcrumb_li_2_a_2_HomeIcon_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "HomeIcon", 17);
} if (rf & 2) {
    i0.ɵɵproperty("styleClass", "p-breadcrumb-item-icon");
} }
function Breadcrumb_li_2_a_2_ng_container_3_span_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "span", 19);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(4);
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate(ctx_r1.home.label);
} }
function Breadcrumb_li_2_a_2_ng_container_3_ng_template_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "span", 20);
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(4);
    i0.ɵɵproperty("innerHTML", ctx_r1.home.label, i0.ɵɵsanitizeHtml);
} }
function Breadcrumb_li_2_a_2_ng_container_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵtemplate(1, Breadcrumb_li_2_a_2_ng_container_3_span_1_Template, 2, 1, "span", 18)(2, Breadcrumb_li_2_a_2_ng_container_3_ng_template_2_Template, 1, 1, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const htmlHomeRouteLabel_r5 = i0.ɵɵreference(3);
    const ctx_r1 = i0.ɵɵnextContext(3);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r1.home.escape !== false)("ngIfElse", htmlHomeRouteLabel_r5);
} }
function Breadcrumb_li_2_a_2_Template(rf, ctx) { if (rf & 1) {
    const _r4 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "a", 21);
    i0.ɵɵlistener("click", function Breadcrumb_li_2_a_2_Template_a_click_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onClick($event, ctx_r1.home)); });
    i0.ɵɵtemplate(1, Breadcrumb_li_2_a_2_span_1_Template, 1, 2, "span", 13)(2, Breadcrumb_li_2_a_2_HomeIcon_2_Template, 1, 1, "HomeIcon", 14)(3, Breadcrumb_li_2_a_2_ng_container_3_Template, 4, 2, "ng-container", 15);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵproperty("routerLink", ctx_r1.home.routerLink)("queryParams", ctx_r1.home.queryParams)("routerLinkActiveOptions", ctx_r1.home.routerLinkActiveOptions || i0.ɵɵpureFunction0(16, _c3))("target", ctx_r1.home.target)("fragment", ctx_r1.home.fragment)("queryParamsHandling", ctx_r1.home.queryParamsHandling)("preserveFragment", ctx_r1.home.preserveFragment)("skipLocationChange", ctx_r1.home.skipLocationChange)("replaceUrl", ctx_r1.home.replaceUrl)("state", ctx_r1.home.state);
    i0.ɵɵattribute("aria-label", ctx_r1.homeAriaLabel)("title", ctx_r1.home.title)("tabindex", ctx_r1.home.disabled ? null : "0");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r1.home.icon);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", !ctx_r1.home.icon);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r1.home.label);
} }
function Breadcrumb_li_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "li", 9);
    i0.ɵɵtemplate(1, Breadcrumb_li_2_a_1_Template, 4, 8, "a", 10)(2, Breadcrumb_li_2_a_2_Template, 4, 17, "a", 11);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵclassMap(ctx_r1.home.styleClass);
    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(9, _c2, ctx_r1.home.disabled))("ngStyle", ctx_r1.home.style)("tooltipOptions", ctx_r1.home.tooltipOptions);
    i0.ɵɵattribute("id", ctx_r1.home.id)("data-pc-section", "home");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", !ctx_r1.home.routerLink);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r1.home.routerLink);
} }
function Breadcrumb_li_3_ChevronRightIcon_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "ChevronRightIcon");
} }
function Breadcrumb_li_3_2_ng_template_0_Template(rf, ctx) { }
function Breadcrumb_li_3_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵtemplate(0, Breadcrumb_li_3_2_ng_template_0_Template, 0, 0, "ng-template");
} }
function Breadcrumb_li_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "li", 22);
    i0.ɵɵtemplate(1, Breadcrumb_li_3_ChevronRightIcon_1_Template, 1, 0, "ChevronRightIcon", 15)(2, Breadcrumb_li_3_2_Template, 1, 0, null, 23);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵattribute("data-pc-section", "separator");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", !ctx_r1.separatorTemplate && !ctx_r1._separatorTemplate);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.separatorTemplate || ctx_r1._separatorTemplate);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_1_0_ng_template_0_Template(rf, ctx) { }
function Breadcrumb_ng_template_4_li_0_Conditional_1_0_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵtemplate(0, Breadcrumb_ng_template_4_li_0_Conditional_1_0_ng_template_0_Template, 0, 0, "ng-template");
} }
function Breadcrumb_ng_template_4_li_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵtemplate(0, Breadcrumb_ng_template_4_li_0_Conditional_1_0_Template, 1, 0, null, 26);
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(2).$implicit;
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.itemTemplate || ctx_r1._itemTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c5, menuitem_r6));
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_span_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "span", 16);
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(5).$implicit;
    i0.ɵɵproperty("ngClass", menuitem_r6 == null ? null : menuitem_r6.icon)("ngStyle", menuitem_r6 == null ? null : menuitem_r6.iconStyle);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_ng_container_2_span_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "span", 19);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(6).$implicit;
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate(menuitem_r6 == null ? null : menuitem_r6.label);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_ng_container_2_ng_template_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "span", 20);
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(6).$implicit;
    i0.ɵɵproperty("innerHTML", menuitem_r6 == null ? null : menuitem_r6.label, i0.ɵɵsanitizeHtml);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵtemplate(1, Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_ng_container_2_span_1_Template, 2, 1, "span", 18)(2, Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_ng_container_2_ng_template_2_Template, 1, 1, "ng-template", null, 2, i0.ɵɵtemplateRefExtractor);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const htmlLabel_r8 = i0.ɵɵreference(3);
    const menuitem_r6 = i0.ɵɵnextContext(5).$implicit;
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", (menuitem_r6 == null ? null : menuitem_r6.escape) !== false)("ngIfElse", htmlLabel_r8);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵtemplate(1, Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_span_1_Template, 1, 2, "span", 13)(2, Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_ng_container_2_Template, 4, 2, "ng-container", 15);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(4).$implicit;
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", menuitem_r6 == null ? null : menuitem_r6.icon);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", menuitem_r6 == null ? null : menuitem_r6.label);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_Template(rf, ctx) { if (rf & 1) {
    const _r7 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "a", 28);
    i0.ɵɵlistener("click", function Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_Template_a_click_0_listener($event) { i0.ɵɵrestoreView(_r7); const menuitem_r6 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onClick($event, menuitem_r6)); });
    i0.ɵɵtemplate(1, Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_ng_container_1_Template, 3, 2, "ng-container", 15);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(3).$implicit;
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵproperty("target", menuitem_r6 == null ? null : menuitem_r6.target);
    i0.ɵɵattribute("href", (menuitem_r6 == null ? null : menuitem_r6.url) ? menuitem_r6 == null ? null : menuitem_r6.url : null, i0.ɵɵsanitizeUrl)("title", menuitem_r6 == null ? null : menuitem_r6.title)("tabindex", (menuitem_r6 == null ? null : menuitem_r6.disabled) ? null : "0");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", !ctx_r1.itemTemplate && !ctx_r1._itemTemplate);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_span_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "span", 16);
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(4).$implicit;
    i0.ɵɵproperty("ngClass", menuitem_r6 == null ? null : menuitem_r6.icon)("ngStyle", menuitem_r6 == null ? null : menuitem_r6.iconStyle);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_ng_container_2_span_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "span", 19);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(5).$implicit;
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate(menuitem_r6 == null ? null : menuitem_r6.label);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_ng_container_2_ng_template_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "span", 20);
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(5).$implicit;
    i0.ɵɵproperty("innerHTML", menuitem_r6 == null ? null : menuitem_r6.label, i0.ɵɵsanitizeHtml);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵtemplate(1, Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_ng_container_2_span_1_Template, 2, 1, "span", 18)(2, Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_ng_container_2_ng_template_2_Template, 1, 1, "ng-template", null, 3, i0.ɵɵtemplateRefExtractor);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const htmlRouteLabel_r10 = i0.ɵɵreference(3);
    const menuitem_r6 = i0.ɵɵnextContext(4).$implicit;
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", (menuitem_r6 == null ? null : menuitem_r6.escape) !== false)("ngIfElse", htmlRouteLabel_r10);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_Template(rf, ctx) { if (rf & 1) {
    const _r9 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "a", 21);
    i0.ɵɵlistener("click", function Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_Template_a_click_0_listener($event) { i0.ɵɵrestoreView(_r9); const menuitem_r6 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onClick($event, menuitem_r6)); });
    i0.ɵɵtemplate(1, Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_span_1_Template, 1, 2, "span", 13)(2, Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_ng_container_2_Template, 4, 2, "ng-container", 15);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(3).$implicit;
    i0.ɵɵproperty("routerLink", menuitem_r6 == null ? null : menuitem_r6.routerLink)("queryParams", menuitem_r6 == null ? null : menuitem_r6.queryParams)("routerLinkActiveOptions", (menuitem_r6 == null ? null : menuitem_r6.routerLinkActiveOptions) || i0.ɵɵpureFunction0(14, _c3))("target", menuitem_r6 == null ? null : menuitem_r6.target)("fragment", menuitem_r6 == null ? null : menuitem_r6.fragment)("queryParamsHandling", menuitem_r6 == null ? null : menuitem_r6.queryParamsHandling)("preserveFragment", menuitem_r6 == null ? null : menuitem_r6.preserveFragment)("skipLocationChange", menuitem_r6 == null ? null : menuitem_r6.skipLocationChange)("replaceUrl", menuitem_r6 == null ? null : menuitem_r6.replaceUrl)("state", menuitem_r6 == null ? null : menuitem_r6.state);
    i0.ɵɵattribute("title", menuitem_r6 == null ? null : menuitem_r6.title)("tabindex", (menuitem_r6 == null ? null : menuitem_r6.disabled) ? null : "0");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", menuitem_r6 == null ? null : menuitem_r6.icon);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", menuitem_r6 == null ? null : menuitem_r6.label);
} }
function Breadcrumb_ng_template_4_li_0_Conditional_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵtemplate(0, Breadcrumb_ng_template_4_li_0_Conditional_2_a_0_Template, 2, 5, "a", 27)(1, Breadcrumb_ng_template_4_li_0_Conditional_2_a_1_Template, 3, 15, "a", 11);
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext(2).$implicit;
    i0.ɵɵproperty("ngIf", !(menuitem_r6 == null ? null : menuitem_r6.routerLink));
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", menuitem_r6 == null ? null : menuitem_r6.routerLink);
} }
function Breadcrumb_ng_template_4_li_0_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "li", 25);
    i0.ɵɵtemplate(1, Breadcrumb_ng_template_4_li_0_Conditional_1_Template, 1, 4)(2, Breadcrumb_ng_template_4_li_0_Conditional_2_Template, 2, 2);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const menuitem_r6 = i0.ɵɵnextContext().$implicit;
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵclassMap(menuitem_r6.styleClass);
    i0.ɵɵproperty("ngStyle", menuitem_r6.style)("ngClass", i0.ɵɵpureFunction1(8, _c4, menuitem_r6.disabled))("tooltipOptions", menuitem_r6.tooltipOptions);
    i0.ɵɵattribute("id", menuitem_r6.id)("data-pc-section", "menuitem");
    i0.ɵɵadvance();
    i0.ɵɵconditional(ctx_r1.itemTemplate || ctx_r1._itemTemplate ? 1 : 2);
} }
function Breadcrumb_ng_template_4_li_1_ChevronRightIcon_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "ChevronRightIcon");
} }
function Breadcrumb_ng_template_4_li_1_2_ng_template_0_Template(rf, ctx) { }
function Breadcrumb_ng_template_4_li_1_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵtemplate(0, Breadcrumb_ng_template_4_li_1_2_ng_template_0_Template, 0, 0, "ng-template");
} }
function Breadcrumb_ng_template_4_li_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "li", 22);
    i0.ɵɵtemplate(1, Breadcrumb_ng_template_4_li_1_ChevronRightIcon_1_Template, 1, 0, "ChevronRightIcon", 15)(2, Breadcrumb_ng_template_4_li_1_2_Template, 1, 0, null, 23);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵattribute("data-pc-section", "separator");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", !ctx_r1.separatorTemplate && !ctx_r1._separatorTemplate);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.separatorTemplate || ctx_r1._separatorTemplate);
} }
function Breadcrumb_ng_template_4_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵtemplate(0, Breadcrumb_ng_template_4_li_0_Template, 3, 10, "li", 24)(1, Breadcrumb_ng_template_4_li_1_Template, 3, 3, "li", 7);
} if (rf & 2) {
    const menuitem_r6 = ctx.$implicit;
    const end_r11 = ctx.last;
    i0.ɵɵproperty("ngIf", menuitem_r6.visible !== false);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", !end_r11 && menuitem_r6.visible !== false);
} }
/**
 * Breadcrumb provides contextual information about page hierarchy.
 * @group Components
 */
class Breadcrumb extends BaseComponent {
    router;
    /**
     * An array of menuitems.
     * @group Props
     */
    model;
    /**
     * Inline style of the component.
     * @group Props
     */
    style;
    /**
     * Style class of the component.
     * @group Props
     */
    styleClass;
    /**
     * MenuItem configuration for the home icon.
     * @group Props
     */
    home;
    /**
     * Defines a string that labels the home icon for accessibility.
     * @group Props
     */
    homeAriaLabel;
    /**
     * Fired when an item is selected.
     * @param {BreadcrumbItemClickEvent} event - custom click event.
     * @group Emits
     */
    onItemClick = new EventEmitter();
    _componentStyle = inject(BreadCrumbStyle);
    constructor(router) {
        super();
        this.router = router;
    }
    onClick(event, item) {
        if (item.disabled) {
            event.preventDefault();
            return;
        }
        if (!item.url && !item.routerLink) {
            event.preventDefault();
        }
        if (item.command) {
            item.command({
                originalEvent: event,
                item: item
            });
        }
        this.onItemClick.emit({
            originalEvent: event,
            item: item
        });
    }
    /**
     * Defines template option for item.
     * @group Templates
     */
    itemTemplate;
    /**
     * Defines template option for separator.
     * @group Templates
     */
    separatorTemplate;
    templates;
    _separatorTemplate;
    _itemTemplate;
    ngAfterContentInit() {
        this.templates?.forEach((item) => {
            switch (item.getType()) {
                case 'separator':
                    this._separatorTemplate = item.template;
                    break;
                case 'item':
                    this._itemTemplate = item.template;
                    break;
                default:
                    this._itemTemplate = item.template;
                    break;
            }
        });
    }
    static ɵfac = function Breadcrumb_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || Breadcrumb)(i0.ɵɵdirectiveInject(i1.Router)); };
    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Breadcrumb, selectors: [["p-breadcrumb"]], contentQueries: function Breadcrumb_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
            i0.ɵɵcontentQuery(dirIndex, _c0, 5);
            i0.ɵɵcontentQuery(dirIndex, _c1, 5);
            i0.ɵɵcontentQuery(dirIndex, PrimeTemplate, 4);
        } if (rf & 2) {
            let _t;
            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.itemTemplate = _t.first);
            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.separatorTemplate = _t.first);
            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.templates = _t);
        } }, inputs: { model: "model", style: "style", styleClass: "styleClass", home: "home", homeAriaLabel: "homeAriaLabel" }, outputs: { onItemClick: "onItemClick" }, features: [i0.ɵɵProvidersFeature([BreadCrumbStyle]), i0.ɵɵInheritDefinitionFeature], decls: 5, vars: 10, consts: [["htmlHomeLabel", ""], ["htmlHomeRouteLabel", ""], ["htmlLabel", ""], ["htmlRouteLabel", ""], [3, "ngStyle", "ngClass"], [1, "p-breadcrumb-list"], ["pTooltip", "", 3, "class", "ngClass", "ngStyle", "tooltipOptions", 4, "ngIf"], ["class", "p-breadcrumb-separator", 4, "ngIf"], ["ngFor", "", 3, "ngForOf"], ["pTooltip", "", 3, "ngClass", "ngStyle", "tooltipOptions"], ["class", "p-breadcrumb-item-link", 3, "href", "target", "click", 4, "ngIf"], ["class", "p-breadcrumb-item-link", 3, "routerLink", "queryParams", "routerLinkActiveOptions", "target", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "click", 4, "ngIf"], [1, "p-breadcrumb-item-link", 3, "click", "href", "target"], ["class", "p-breadcrumb-item-icon", 3, "ngClass", "ngStyle", 4, "ngIf"], [3, "styleClass", 4, "ngIf"], [4, "ngIf"], [1, "p-breadcrumb-item-icon", 3, "ngClass", "ngStyle"], [3, "styleClass"], ["class", "p-breadcrumb-item-label", 4, "ngIf", "ngIfElse"], [1, "p-breadcrumb-item-label"], [1, "p-breadcrumb-item-label", 3, "innerHTML"], [1, "p-breadcrumb-item-link", 3, "click", "routerLink", "queryParams", "routerLinkActiveOptions", "target", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state"], [1, "p-breadcrumb-separator"], [4, "ngTemplateOutlet"], ["pTooltip", "", 3, "class", "ngStyle", "ngClass", "tooltipOptions", 4, "ngIf"], ["pTooltip", "", 3, "ngStyle", "ngClass", "tooltipOptions"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], ["class", "p-breadcrumb-item-link", 3, "target", "click", 4, "ngIf"], [1, "p-breadcrumb-item-link", 3, "click", "target"]], template: function Breadcrumb_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "nav", 4)(1, "ol", 5);
            i0.ɵɵtemplate(2, Breadcrumb_li_2_Template, 3, 11, "li", 6)(3, Breadcrumb_li_3_Template, 3, 3, "li", 7)(4, Breadcrumb_ng_template_4_Template, 2, 2, "ng-template", 8);
            i0.ɵɵelementEnd()();
        } if (rf & 2) {
            i0.ɵɵclassMap(ctx.styleClass);
            i0.ɵɵproperty("ngStyle", ctx.style)("ngClass", "p-breadcrumb p-component");
            i0.ɵɵattribute("data-pc-name", "breadcrumb")("data-pc-section", "root");
            i0.ɵɵadvance();
            i0.ɵɵattribute("data-pc-section", "menu");
            i0.ɵɵadvance();
            i0.ɵɵproperty("ngIf", ctx.home && ctx.home.visible !== false);
            i0.ɵɵadvance();
            i0.ɵɵproperty("ngIf", ctx.model && ctx.home);
            i0.ɵɵadvance();
            i0.ɵɵproperty("ngForOf", ctx.model);
        } }, dependencies: [CommonModule, i2.NgClass, i2.NgForOf, i2.NgIf, i2.NgTemplateOutlet, i2.NgStyle, RouterModule, i1.RouterLink, TooltipModule, i3.Tooltip, ChevronRightIcon, HomeIcon, SharedModule], encapsulation: 2, changeDetection: 0 });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(Breadcrumb, [{
        type: Component,
        args: [{
                selector: 'p-breadcrumb',
                standalone: true,
                imports: [CommonModule, RouterModule, TooltipModule, ChevronRightIcon, HomeIcon, SharedModule],
                template: `
        <nav [class]="styleClass" [ngStyle]="style" [ngClass]="'p-breadcrumb p-component'" [attr.data-pc-name]="'breadcrumb'" [attr.data-pc-section]="'root'">
            <ol [attr.data-pc-section]="'menu'" class="p-breadcrumb-list">
                <li
                    [class]="home.styleClass"
                    [attr.id]="home.id"
                    [ngClass]="{ 'p-breadcrumb-home-item': true, 'p-disabled': home.disabled }"
                    [ngStyle]="home.style"
                    *ngIf="home && home.visible !== false"
                    pTooltip
                    [tooltipOptions]="home.tooltipOptions"
                    [attr.data-pc-section]="'home'"
                >
                    <a
                        [href]="home.url ? home.url : null"
                        *ngIf="!home.routerLink"
                        [attr.aria-label]="homeAriaLabel"
                        class="p-breadcrumb-item-link"
                        (click)="onClick($event, home)"
                        [target]="home.target"
                        [attr.title]="home.title"
                        [attr.tabindex]="home.disabled ? null : '0'"
                    >
                        <span *ngIf="home.icon" class="p-breadcrumb-item-icon" [ngClass]="home.icon" [ngStyle]="home?.style"></span>
                        <HomeIcon *ngIf="!home.icon" [styleClass]="'p-breadcrumb-item-icon'" />
                        <ng-container *ngIf="home.label">
                            <span *ngIf="home.escape !== false; else htmlHomeLabel" class="p-breadcrumb-item-label">{{ home.label }}</span>
                            <ng-template #htmlHomeLabel><span class="p-breadcrumb-item-label" [innerHTML]="home.label"></span></ng-template>
                        </ng-container>
                    </a>
                    <a
                        *ngIf="home.routerLink"
                        [routerLink]="home.routerLink"
                        [attr.aria-label]="homeAriaLabel"
                        [queryParams]="home.queryParams"
                        [routerLinkActiveOptions]="home.routerLinkActiveOptions || { exact: false }"
                        class="p-breadcrumb-item-link"
                        (click)="onClick($event, home)"
                        [target]="home.target"
                        [attr.title]="home.title"
                        [attr.tabindex]="home.disabled ? null : '0'"
                        [fragment]="home.fragment"
                        [queryParamsHandling]="home.queryParamsHandling"
                        [preserveFragment]="home.preserveFragment"
                        [skipLocationChange]="home.skipLocationChange"
                        [replaceUrl]="home.replaceUrl"
                        [state]="home.state"
                    >
                        <span *ngIf="home.icon" class="p-breadcrumb-item-icon" [ngClass]="home.icon" [ngStyle]="home.iconStyle"></span>
                        <HomeIcon *ngIf="!home.icon" [styleClass]="'p-breadcrumb-item-icon'" />
                        <ng-container *ngIf="home.label">
                            <span *ngIf="home.escape !== false; else htmlHomeRouteLabel" class="p-breadcrumb-item-label">{{ home.label }}</span>
                            <ng-template #htmlHomeRouteLabel><span class="p-breadcrumb-item-label" [innerHTML]="home.label"></span></ng-template>
                        </ng-container>
                    </a>
                </li>
                <li *ngIf="model && home" class="p-breadcrumb-separator" [attr.data-pc-section]="'separator'">
                    <ChevronRightIcon *ngIf="!separatorTemplate && !_separatorTemplate" />
                    <ng-template *ngTemplateOutlet="separatorTemplate || _separatorTemplate"></ng-template>
                </li>
                <ng-template ngFor let-menuitem let-end="last" [ngForOf]="model">
                    <li
                        *ngIf="menuitem.visible !== false"
                        [class]="menuitem.styleClass"
                        [attr.id]="menuitem.id"
                        [ngStyle]="menuitem.style"
                        [ngClass]="{ 'p-breadcrumb-item': true, 'p-disabled': menuitem.disabled }"
                        pTooltip
                        [tooltipOptions]="menuitem.tooltipOptions"
                        [attr.data-pc-section]="'menuitem'"
                    >
                        @if (itemTemplate || _itemTemplate) {
                            <ng-template *ngTemplateOutlet="itemTemplate || _itemTemplate; context: { $implicit: menuitem }"></ng-template>
                        } @else {
                            <a
                                *ngIf="!menuitem?.routerLink"
                                [attr.href]="menuitem?.url ? menuitem?.url : null"
                                class="p-breadcrumb-item-link"
                                (click)="onClick($event, menuitem)"
                                [target]="menuitem?.target"
                                [attr.title]="menuitem?.title"
                                [attr.tabindex]="menuitem?.disabled ? null : '0'"
                            >
                                <ng-container *ngIf="!itemTemplate && !_itemTemplate">
                                    <span *ngIf="menuitem?.icon" class="p-breadcrumb-item-icon" [ngClass]="menuitem?.icon" [ngStyle]="menuitem?.iconStyle"></span>
                                    <ng-container *ngIf="menuitem?.label">
                                        <span *ngIf="menuitem?.escape !== false; else htmlLabel" class="p-breadcrumb-item-label">{{ menuitem?.label }}</span>
                                        <ng-template #htmlLabel><span class="p-breadcrumb-item-label" [innerHTML]="menuitem?.label"></span></ng-template>
                                    </ng-container>
                                </ng-container>
                            </a>
                            <a
                                *ngIf="menuitem?.routerLink"
                                [routerLink]="menuitem?.routerLink"
                                [queryParams]="menuitem?.queryParams"
                                [routerLinkActiveOptions]="menuitem?.routerLinkActiveOptions || { exact: false }"
                                class="p-breadcrumb-item-link"
                                (click)="onClick($event, menuitem)"
                                [target]="menuitem?.target"
                                [attr.title]="menuitem?.title"
                                [attr.tabindex]="menuitem?.disabled ? null : '0'"
                                [fragment]="menuitem?.fragment"
                                [queryParamsHandling]="menuitem?.queryParamsHandling"
                                [preserveFragment]="menuitem?.preserveFragment"
                                [skipLocationChange]="menuitem?.skipLocationChange"
                                [replaceUrl]="menuitem?.replaceUrl"
                                [state]="menuitem?.state"
                            >
                                <span *ngIf="menuitem?.icon" class="p-breadcrumb-item-icon" [ngClass]="menuitem?.icon" [ngStyle]="menuitem?.iconStyle"></span>
                                <ng-container *ngIf="menuitem?.label">
                                    <span *ngIf="menuitem?.escape !== false; else htmlRouteLabel" class="p-breadcrumb-item-label">{{ menuitem?.label }}</span>
                                    <ng-template #htmlRouteLabel><span class="p-breadcrumb-item-label" [innerHTML]="menuitem?.label"></span></ng-template>
                                </ng-container>
                            </a>
                        }
                    </li>
                    <li *ngIf="!end && menuitem.visible !== false" class="p-breadcrumb-separator" [attr.data-pc-section]="'separator'">
                        <ChevronRightIcon *ngIf="!separatorTemplate && !_separatorTemplate" />
                        <ng-template *ngTemplateOutlet="separatorTemplate || _separatorTemplate"></ng-template>
                    </li>
                </ng-template>
            </ol>
        </nav>
    `,
                changeDetection: ChangeDetectionStrategy.OnPush,
                encapsulation: ViewEncapsulation.None,
                providers: [BreadCrumbStyle]
            }]
    }], () => [{ type: i1.Router }], { model: [{
            type: Input
        }], style: [{
            type: Input
        }], styleClass: [{
            type: Input
        }], home: [{
            type: Input
        }], homeAriaLabel: [{
            type: Input
        }], onItemClick: [{
            type: Output
        }], itemTemplate: [{
            type: ContentChild,
            args: ['item']
        }], separatorTemplate: [{
            type: ContentChild,
            args: ['separator']
        }], templates: [{
            type: ContentChildren,
            args: [PrimeTemplate]
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(Breadcrumb, { className: "Breadcrumb", filePath: "breadcrumb.ts", lineNumber: 147 }); })();
class BreadcrumbModule {
    static ɵfac = function BreadcrumbModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || BreadcrumbModule)(); };
    static ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: BreadcrumbModule });
    static ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [Breadcrumb, SharedModule, SharedModule] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(BreadcrumbModule, [{
        type: NgModule,
        args: [{
                imports: [Breadcrumb, SharedModule],
                exports: [Breadcrumb, SharedModule]
            }]
    }], null, null); })();
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(BreadcrumbModule, { imports: [Breadcrumb, SharedModule], exports: [Breadcrumb, SharedModule] }); })();

/**
 * Generated bundle index. Do not edit.
 */

export { BreadCrumbStyle, Breadcrumb, BreadcrumbClasses, BreadcrumbModule };
//# sourceMappingURL=primeng-breadcrumb.mjs.map