@fundamental-ngx/core 0.35.2-rc.18 → 0.35.2-rc.20

package/breadcrumb/fesm2015/fundamental-ngx-core-breadcrumb.mjs

@@ -1,17 +1,17 @@
 import * as i0 from '@angular/core';
-import { Component, ContentChild, forwardRef, ChangeDetectionStrategy, Input, ViewEncapsulation, Optional, ContentChildren, ViewChild, Directive, NgModule } from '@angular/core';
-import * as i6 from '@angular/common';
+import { Component, ContentChild, forwardRef, ViewEncapsulation, ChangeDetectionStrategy, Optional, ContentChildren, ViewChild, Input, Directive, NgModule } from '@angular/core';
+import * as i5 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i4 from '@fundamental-ngx/core/link';
+import * as i3 from '@fundamental-ngx/core/link';
 import { LinkComponent, LinkModule } from '@fundamental-ngx/core/link';
+import * as i6 from '@angular/cdk/portal';
+import { DomPortal, PortalModule } from '@angular/cdk/portal';
 import { BehaviorSubject, Subscription, startWith, map, tap, firstValueFrom } from 'rxjs';
-import * as i1 from '@fundamental-ngx/core/menu';
+import * as i2 from '@fundamental-ngx/core/menu';
 import { MenuComponent, MenuModule } from '@fundamental-ngx/core/menu';
-import * as i1$1 from '@fundamental-ngx/core/utils';
+import * as i1 from '@fundamental-ngx/core/utils';
 import { PipeModule } from '@fundamental-ngx/core/utils';
-import * as i3 from '@angular/cdk/portal';
-import { DomPortal, PortalModule } from '@angular/cdk/portal';
-import * as i5 from '@fundamental-ngx/core/icon';
+import * as i4 from '@fundamental-ngx/core/icon';
 import { IconModule } from '@fundamental-ngx/core/icon';
 import { PopoverModule } from '@fundamental-ngx/core/popover';
 import { DeprecatedCompactDirective, CONTENT_DENSITY_DIRECTIVE, ContentDensityModule } from '@fundamental-ngx/core/content-density';
@@ -26,9 +26,10 @@ import { DeprecatedCompactDirective, CONTENT_DENSITY_DIRECTIVE, ContentDensityMo
  * ```
  */
 class BreadcrumbItemComponent {
-    constructor(_elementRef, renderer2) {
+    constructor(_elementRef, renderer2, _cdR) {
         this._elementRef = _elementRef;
         this.renderer2 = renderer2;
+        this._cdR = _cdR;
         this.show = () => this.renderer2.setStyle(this._elementRef.nativeElement, 'display', 'inline-block');
         this.hide = () => this.renderer2.setStyle(this._elementRef.nativeElement, 'display', 'none');
     }
@@ -45,8 +46,16 @@ class BreadcrumbItemComponent {
         var _a;
         return (!!((_a = this.breadcrumbLink) === null || _a === void 0 ? void 0 : _a.elementRef().nativeElement.getAttribute('href')) || !!this.breadcrumbLink.routerLink);
     }
+    /** @hidden */
+    ngAfterViewInit() {
+        if (this.breadcrumbLink) {
+            this.linkContentPortal = new DomPortal(this.breadcrumbLink.contentSpan.nativeElement);
+        }
+        this.breadcrumbItemPortal = new DomPortal(this.elementRef.nativeElement.firstElementChild);
+        this._cdR.detectChanges();
+    }
 }
-BreadcrumbItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+BreadcrumbItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 BreadcrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbItemComponent, selector: "fd-breadcrumb-item", host: { classAttribute: "fd-breadcrumb__item" }, queries: [{ propertyName: "breadcrumbLink", first: true, predicate: i0.forwardRef(function () { return LinkComponent; }), descendants: true }], ngImport: i0, template: '<div style="display: inline"><ng-content></ng-content></div>', isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbItemComponent, decorators: [{
             type: Component,
@@ -57,43 +66,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
                         class: 'fd-breadcrumb__item'
                     }
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { breadcrumbLink: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { breadcrumbLink: [{
                 type: ContentChild,
                 args: [forwardRef(() => LinkComponent)]
             }] } });
 
-class BreadcrumbHiddenItemComponent {
-    constructor(_cdr) {
-        this._cdr = _cdr;
-    }
-    /** @hidden */
-    ngAfterViewInit() {
-        if (this.breadcrumbItem.breadcrumbLink) {
-            this.linkContentPortal = new DomPortal(this.breadcrumbItem.breadcrumbLink.contentSpan.nativeElement);
-        }
-        this.breadcrumbItemPortal = new DomPortal(this.breadcrumbItem.elementRef.nativeElement.firstElementChild);
-        this._cdr.detectChanges();
-    }
-    /**
-     * We catch interactions with item, Enter, Space, Mouse click and Touch click,
-     * if original element had router link we are proxying click to that element
-     * */
-    itemClicked($event) {
-        if (this.breadcrumbItem.needsClickProxy) {
-            $event.preventDefault();
-            this.breadcrumbItem.breadcrumbLink.elementRef().nativeElement.click();
-        }
-    }
-}
-BreadcrumbHiddenItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbHiddenItemComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbHiddenItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbHiddenItemComponent, selector: "fd-breadcrumb-hidden-item", inputs: { breadcrumbItem: "breadcrumbItem" }, ngImport: i0, template: "<li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n    <a\n        fd-menu-interactive\n        (click)=\"itemClicked($event)\"\n        (keydown.enter)=\"itemClicked($event)\"\n        (keydown.space)=\"itemClicked($event)\"\n    >\n        <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                <fd-menu-addon\n                    position=\"before\"\n                    [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                ></fd-menu-addon>\n            </ng-container>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"linkContentPortal\"></ng-container>\n            </span>\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n            </ng-container>\n        </ng-container>\n        <ng-template #portalContent>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"breadcrumbItemPortal\"></ng-container>\n            </span>\n        </ng-template>\n    </a>\n</li>\n", components: [{ type: i1.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { type: i1.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "glyph", "submenuIndicator", "ariaHidden"] }], directives: [{ type: i1.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MenuTitleDirective, selector: "[fd-menu-title]" }, { type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbHiddenItemComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fd-breadcrumb-hidden-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n    <a\n        fd-menu-interactive\n        (click)=\"itemClicked($event)\"\n        (keydown.enter)=\"itemClicked($event)\"\n        (keydown.space)=\"itemClicked($event)\"\n    >\n        <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                <fd-menu-addon\n                    position=\"before\"\n                    [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                ></fd-menu-addon>\n            </ng-container>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"linkContentPortal\"></ng-container>\n            </span>\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n            </ng-container>\n        </ng-container>\n        <ng-template #portalContent>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"breadcrumbItemPortal\"></ng-container>\n            </span>\n        </ng-template>\n    </a>\n</li>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { breadcrumbItem: [{
-                type: Input
-            }] } });
-
 /**
  * Breadcrumb parent wrapper directive. Must have breadcrumb item child directives.
  *
@@ -178,18 +155,28 @@ class BreadcrumbComponent {
         this.menuComponent.toggle();
         event.preventDefault();
     }
+    /**
+     * We catch interactions with item, Enter, Space, Mouse click and Touch click,
+     * if original element had router link we are proxying click to that element
+     * */
+    itemClicked(breadcrumbItem, $event) {
+        if (breadcrumbItem.needsClickProxy) {
+            $event.preventDefault();
+            breadcrumbItem.breadcrumbLink.elementRef().nativeElement.click();
+        }
+    }
 }
-BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.RtlService, optional: true }, { token: i0.ChangeDetectorRef }, { token: i1$1.ResizeObserverService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbComponent, selector: "fd-breadcrumb", inputs: { containerElement: "containerElement", reverse: "reverse" }, host: { classAttribute: "fd-breadcrumb" }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(function () { return BreadcrumbItemComponent; }) }], viewQueries: [{ propertyName: "menuComponent", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <fd-breadcrumb-hidden-item\n        *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\"\n        [breadcrumbItem]=\"collapsedBreadcrumbItem\"\n    >\n    </fd-breadcrumb-hidden-item>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.1-rc.1\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-breadcrumb\n    .fd-breadcrumb__item\n    .fd-breadcrump__link\n*/.fd-breadcrumb{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-wrap:wrap;align-items:center;list-style:none}.fd-breadcrumb:before,.fd-breadcrumb:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapContent_LabelColor)}.fd-breadcrumb__item:before,.fd-breadcrumb__item:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item:after{content:\"/\";color:var(--sapContent_LabelColor);margin-right:.25rem;margin-left:.25rem}.fd-breadcrumb__item:last-child:after{content:none}.fd-breadcrumb__item .fd-breadcrumb__popover-body{border:none;border-top-left-radius:.125rem;border-top-right-radius:.125rem}.fd-breadcrumb{display:inline-block;white-space:nowrap}.fd-breadcrumb .fd-breadcrumb__collapsed{cursor:pointer}\n"], components: [{ type: i1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { type: BreadcrumbHiddenItemComponent, selector: "fd-breadcrumb-hidden-item", inputs: ["breadcrumbItem"] }, { type: i4.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { type: i5.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }], pipes: { "async": i6.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i0.ElementRef }, { token: i1.RtlService, optional: true }, { token: i0.ChangeDetectorRef }, { token: i1.ResizeObserverService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbComponent, selector: "fd-breadcrumb", inputs: { containerElement: "containerElement", reverse: "reverse" }, host: { classAttribute: "fd-breadcrumb" }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(function () { return BreadcrumbItemComponent; }) }], viewQueries: [{ propertyName: "menuComponent", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <ng-container *ngFor=\"let breadcrumbItem of collapsedBreadcrumbItems\">\n        <li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n            <a\n                fd-menu-interactive\n                (click)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.enter)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.space)=\"itemClicked(breadcrumbItem, $event)\"\n            >\n                <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                        <fd-menu-addon\n                            position=\"before\"\n                            [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                        ></fd-menu-addon>\n                    </ng-container>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.linkContentPortal\"></ng-container>\n                    </span>\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                        <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n                    </ng-container>\n                </ng-container>\n                <ng-template #portalContent>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.breadcrumbItemPortal\"></ng-container>\n                    </span>\n                </ng-template>\n            </a>\n        </li>\n    </ng-container>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.1-rc.1\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-breadcrumb\n    .fd-breadcrumb__item\n    .fd-breadcrump__link\n*/.fd-breadcrumb{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-wrap:wrap;align-items:center;list-style:none}.fd-breadcrumb:before,.fd-breadcrumb:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapContent_LabelColor)}.fd-breadcrumb__item:before,.fd-breadcrumb__item:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item:after{content:\"/\";color:var(--sapContent_LabelColor);margin-right:.25rem;margin-left:.25rem}.fd-breadcrumb__item:last-child:after{content:none}.fd-breadcrumb__item .fd-breadcrumb__popover-body{border:none;border-top-left-radius:.125rem;border-top-right-radius:.125rem}.fd-breadcrumb{display:inline-block;white-space:nowrap}.fd-breadcrumb .fd-breadcrumb__collapsed{cursor:pointer}\n"], components: [{ type: i2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { type: i2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { type: i2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "glyph", "submenuIndicator", "ariaHidden"] }, { type: i3.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { type: i4.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.MenuTitleDirective, selector: "[fd-menu-title]" }, { type: i6.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { type: i2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }], pipes: { "async": i5.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-breadcrumb', host: {
                         class: 'fd-breadcrumb'
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <fd-breadcrumb-hidden-item\n        *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\"\n        [breadcrumbItem]=\"collapsedBreadcrumbItem\"\n    >\n    </fd-breadcrumb-hidden-item>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.1-rc.1\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-breadcrumb\n    .fd-breadcrumb__item\n    .fd-breadcrump__link\n*/.fd-breadcrumb{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-wrap:wrap;align-items:center;list-style:none}.fd-breadcrumb:before,.fd-breadcrumb:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapContent_LabelColor)}.fd-breadcrumb__item:before,.fd-breadcrumb__item:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item:after{content:\"/\";color:var(--sapContent_LabelColor);margin-right:.25rem;margin-left:.25rem}.fd-breadcrumb__item:last-child:after{content:none}.fd-breadcrumb__item .fd-breadcrumb__popover-body{border:none;border-top-left-radius:.125rem;border-top-right-radius:.125rem}.fd-breadcrumb{display:inline-block;white-space:nowrap}.fd-breadcrumb .fd-breadcrumb__collapsed{cursor:pointer}\n"] }]
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <ng-container *ngFor=\"let breadcrumbItem of collapsedBreadcrumbItems\">\n        <li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n            <a\n                fd-menu-interactive\n                (click)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.enter)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.space)=\"itemClicked(breadcrumbItem, $event)\"\n            >\n                <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                        <fd-menu-addon\n                            position=\"before\"\n                            [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                        ></fd-menu-addon>\n                    </ng-container>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.linkContentPortal\"></ng-container>\n                    </span>\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                        <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n                    </ng-container>\n                </ng-container>\n                <ng-template #portalContent>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.breadcrumbItemPortal\"></ng-container>\n                    </span>\n                </ng-template>\n            </a>\n        </li>\n    </ng-container>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.1-rc.1\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-breadcrumb\n    .fd-breadcrumb__item\n    .fd-breadcrump__link\n*/.fd-breadcrumb{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-wrap:wrap;align-items:center;list-style:none}.fd-breadcrumb:before,.fd-breadcrumb:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapContent_LabelColor)}.fd-breadcrumb__item:before,.fd-breadcrumb__item:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item:after{content:\"/\";color:var(--sapContent_LabelColor);margin-right:.25rem;margin-left:.25rem}.fd-breadcrumb__item:last-child:after{content:none}.fd-breadcrumb__item .fd-breadcrumb__popover-body{border:none;border-top-left-radius:.125rem;border-top-right-radius:.125rem}.fd-breadcrumb{display:inline-block;white-space:nowrap}.fd-breadcrumb .fd-breadcrumb__collapsed{cursor:pointer}\n"] }]
         }], ctorParameters: function () {
-        return [{ type: i0.ElementRef }, { type: i1$1.RtlService, decorators: [{
+        return [{ type: i0.ElementRef }, { type: i1.RtlService, decorators: [{
                         type: Optional
-                    }] }, { type: i0.ChangeDetectorRef }, { type: i1$1.ResizeObserverService }, { type: i0.NgZone }];
+                    }] }, { type: i0.ChangeDetectorRef }, { type: i1.ResizeObserverService }, { type: i0.NgZone }];
     }, propDecorators: { breadcrumbItems: [{
                 type: ContentChildren,
                 args: [forwardRef(() => BreadcrumbItemComponent)]
@@ -231,10 +218,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
 class BreadcrumbModule {
 }
 BreadcrumbModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-BreadcrumbModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbModule, declarations: [BreadcrumbComponent,
-        BreadcrumbItemComponent,
-        BreadcrumbHiddenItemComponent,
-        DeprecatedBreadcrumbsCompactDirective], imports: [CommonModule,
+BreadcrumbModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbModule, declarations: [BreadcrumbComponent, BreadcrumbItemComponent, DeprecatedBreadcrumbsCompactDirective], imports: [CommonModule,
         IconModule,
         PopoverModule,
         MenuModule,
@@ -277,12 +261,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
                         DeprecatedBreadcrumbsCompactDirective,
                         ContentDensityModule
                     ],
-                    declarations: [
-                        BreadcrumbComponent,
-                        BreadcrumbItemComponent,
-                        BreadcrumbHiddenItemComponent,
-                        DeprecatedBreadcrumbsCompactDirective
-                    ]
+                    declarations: [BreadcrumbComponent, BreadcrumbItemComponent, DeprecatedBreadcrumbsCompactDirective]
                 }]
         }] });
 

package/breadcrumb/fesm2015/fundamental-ngx-core-breadcrumb.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"fundamental-ngx-core-breadcrumb.mjs","sources":["../../../../../libs/core/src/lib/breadcrumb/breadcrumb-item.component.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb-hidden-item/breadcrumb-hidden-item.component.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb-hidden-item/breadcrumb-hidden-item.component.html","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.html","../../../../../libs/core/src/lib/breadcrumb/deprecated-breadcrumbs-compact.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.module.ts","../../../../../libs/core/src/lib/breadcrumb/fundamental-ngx-core-breadcrumb.ts"],"sourcesContent":["import { Component, ContentChild, ElementRef, forwardRef, Renderer2 } from '@angular/core';\nimport { LinkComponent } from '@fundamental-ngx/core/link';\n\n/**\n * Breadcrumb item directive. Must have child breadcrumb link directives.\n *\n * ```html\n * <fd-breadcrumb-item>\n *     <a fd-link [routerLink]=\"'#'\">Breadcrumb Link</a>\n * </fd-breadcrumb-item>\n * ```\n */\n@Component({\n    selector: 'fd-breadcrumb-item',\n    template: '<div style=\"display: inline\"><ng-content></ng-content></div>',\n    host: {\n        class: 'fd-breadcrumb__item'\n    }\n})\nexport class BreadcrumbItemComponent {\n    /** @hidden */\n    get elementRef(): ElementRef<HTMLElement> {\n        return this._elementRef;\n    }\n\n    /** @hidden */\n    @ContentChild(forwardRef(() => LinkComponent))\n    breadcrumbLink: LinkComponent;\n\n    /** @hidden */\n    get width(): number {\n        return this._elementRef.nativeElement.getBoundingClientRect().width;\n    }\n\n    constructor(private _elementRef: ElementRef<HTMLElement>, private renderer2: Renderer2) {}\n\n    /** @hidden */\n    get needsClickProxy(): boolean {\n        return (\n            !!this.breadcrumbLink?.elementRef().nativeElement.getAttribute('href') || !!this.breadcrumbLink.routerLink\n        );\n    }\n\n    show = (): void => this.renderer2.setStyle(this._elementRef.nativeElement, 'display', 'inline-block');\n    hide = (): void => this.renderer2.setStyle(this._elementRef.nativeElement, 'display', 'none');\n}\n","import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, Input } from '@angular/core';\nimport { BreadcrumbItemComponent } from '../breadcrumb-item.component';\nimport { DomPortal } from '@angular/cdk/portal';\n\n@Component({\n    selector: 'fd-breadcrumb-hidden-item',\n    templateUrl: './breadcrumb-hidden-item.component.html',\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class BreadcrumbHiddenItemComponent implements AfterViewInit {\n    /** Breadcrumb item ref, which is hidden from user and needs to be transformed into menu item */\n    @Input()\n    breadcrumbItem: BreadcrumbItemComponent;\n\n    /** In case there is no link in Item and breadcrumb item is non-interactive, we move whole item content to menu item title */\n    breadcrumbItemPortal: DomPortal<Element>;\n\n    /** When breadcrumb item has link in it, we are moving link content to menu item title */\n    linkContentPortal: DomPortal;\n\n    constructor(private _cdr: ChangeDetectorRef) {}\n\n    /** @hidden */\n    ngAfterViewInit(): void {\n        if (this.breadcrumbItem.breadcrumbLink) {\n            this.linkContentPortal = new DomPortal<HTMLElement>(\n                this.breadcrumbItem.breadcrumbLink.contentSpan.nativeElement\n            );\n        }\n        this.breadcrumbItemPortal = new DomPortal(\n            this.breadcrumbItem.elementRef.nativeElement.firstElementChild as Element\n        );\n        this._cdr.detectChanges();\n    }\n\n    /**\n     * We catch interactions with item, Enter, Space, Mouse click and Touch click,\n     * if original element had router link we are proxying click to that element\n     * */\n    itemClicked($event: any): void {\n        if (this.breadcrumbItem.needsClickProxy) {\n            $event.preventDefault();\n            this.breadcrumbItem.breadcrumbLink.elementRef().nativeElement.click();\n        }\n    }\n}\n","<li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n    <a\n        fd-menu-interactive\n        (click)=\"itemClicked($event)\"\n        (keydown.enter)=\"itemClicked($event)\"\n        (keydown.space)=\"itemClicked($event)\"\n    >\n        <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                <fd-menu-addon\n                    position=\"before\"\n                    [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                ></fd-menu-addon>\n            </ng-container>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"linkContentPortal\"></ng-container>\n            </span>\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n            </ng-container>\n        </ng-container>\n        <ng-template #portalContent>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"breadcrumbItemPortal\"></ng-container>\n            </span>\n        </ng-template>\n    </a>\n</li>\n","import {\n    AfterViewInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    forwardRef,\n    Input,\n    NgZone,\n    OnDestroy,\n    OnInit,\n    Optional,\n    QueryList,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { BreadcrumbItemComponent } from './breadcrumb-item.component';\nimport { ResizeObserverService, RtlService } from '@fundamental-ngx/core/utils';\nimport { BehaviorSubject, firstValueFrom, map, startWith, Subscription, tap } from 'rxjs';\nimport { MenuComponent } from '@fundamental-ngx/core/menu';\nimport { Placement } from '@fundamental-ngx/core/shared';\n\n/**\n * Breadcrumb parent wrapper directive. Must have breadcrumb item child directives.\n *\n * ```html\n * <fd-breadcrumb>\n *     <fd-breadcrumb-item>\n *         <a fd-link [routerLink]=\"'#'\">Breadcrumb Link</a>\n *     </fd-breadcrumb-item>\n * </fd-breadcrumb>\n * ```\n */\n@Component({\n    // TODO to be discussed\n    // eslint-disable-next-line\n    selector: 'fd-breadcrumb',\n    host: {\n        class: 'fd-breadcrumb'\n    },\n    templateUrl: './breadcrumb.component.html',\n    styleUrls: ['./breadcrumb.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class BreadcrumbComponent implements AfterViewInit, OnInit, OnDestroy {\n    /** @hidden */\n    @ContentChildren(forwardRef(() => BreadcrumbItemComponent))\n    breadcrumbItems: QueryList<BreadcrumbItemComponent>;\n\n    /** @hidden */\n    @ViewChild(MenuComponent)\n    menuComponent: MenuComponent;\n\n    /** @hidden */\n    collapsedBreadcrumbItems: Array<BreadcrumbItemComponent> = [];\n\n    /** @hidden */\n    placement$ = new BehaviorSubject<Placement>('bottom-start');\n\n    /**\n     * The element to act as the breadcrumb container. When provided, the breadcrumb's responsive collapsing behavior\n     * performs better. When not provided, the immediate parent element's width will be used.\n     */\n    @Input()\n    containerElement: HTMLElement;\n\n    /** Whether to append items to the overflow dropdown in reverse order. Default is true. */\n    @Input()\n    reverse = false;\n\n    /** @hidden */\n    containerBoundary: number;\n\n    /** @hidden */\n    private _subscriptions = new Subscription();\n\n    /** @hidden */\n    private _itemToSize = new Map<BreadcrumbItemComponent, number>();\n\n    constructor(\n        public elementRef: ElementRef<Element>,\n        @Optional() private _rtlService: RtlService,\n        private _cdRef: ChangeDetectorRef,\n        private _resizeObserver: ResizeObserverService,\n        private _ngZone: NgZone\n    ) {}\n\n    /** @hidden */\n    ngOnInit(): void {\n        if (this._rtlService) {\n            this._subscriptions.add(\n                this._rtlService.rtl.subscribe((value) => this.placement$.next(value ? 'bottom-end' : 'bottom-start'))\n            );\n        }\n    }\n\n    ngAfterViewInit(): void {\n        this._subscriptions.add(\n            this.breadcrumbItems.changes\n                .pipe(\n                    startWith(this.breadcrumbItems),\n                    map((items) => items.toArray() as BreadcrumbItemComponent[]),\n                    map((items) => items.map((item) => [item, item.width]) as [BreadcrumbItemComponent, number][]),\n                    tap((itemToSize: [BreadcrumbItemComponent, number][]) => (this._itemToSize = new Map(itemToSize)))\n                )\n                .subscribe()\n        );\n        firstValueFrom(this._ngZone.onStable).then(() => {\n            this._subscriptions.add(\n                this._resizeObserver\n                    .observe(this.containerElement || (this.elementRef.nativeElement.parentElement as Element))\n                    .subscribe(() => this.onResize())\n            );\n        });\n    }\n\n    /** @hidden */\n    ngOnDestroy(): void {\n        this._subscriptions.unsubscribe();\n    }\n\n    /** @hidden */\n    onResize(): void {\n        if (!this.elementRef.nativeElement.parentElement) {\n            return;\n        }\n        this.containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n\n        if (this.containerElement) {\n            this.containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n\n        let visibleSum = 0;\n        const breadcrumbItemComponents = this.breadcrumbItems.toArray();\n        let i;\n        for (i = breadcrumbItemComponents.length - 1; i >= 0; i--) {\n            const breadcrumbItem = breadcrumbItemComponents[i];\n            const itemSize = this._itemToSize.has(breadcrumbItem)\n                ? (this._itemToSize.get(breadcrumbItem) as number)\n                : breadcrumbItem.width;\n            if (visibleSum + itemSize <= this.containerBoundary) {\n                visibleSum += itemSize;\n                breadcrumbItem.show();\n            } else {\n                break;\n            }\n        }\n        const collapsedBreadcrumbItems = breadcrumbItemComponents.slice(0, ++i);\n        this.collapsedBreadcrumbItems = this.reverse ? collapsedBreadcrumbItems : collapsedBreadcrumbItems.reverse();\n        this.collapsedBreadcrumbItems.forEach((item) => item.hide());\n        this._cdRef.detectChanges();\n    }\n\n    /** @hidden */\n    keyDownHandle(event: Event): void {\n        this.menuComponent.toggle();\n        event.preventDefault();\n    }\n}\n","<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <fd-breadcrumb-hidden-item\n        *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\"\n        [breadcrumbItem]=\"collapsedBreadcrumbItem\"\n    >\n    </fd-breadcrumb-hidden-item>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n","import { Directive, forwardRef } from '@angular/core';\nimport { CONTENT_DENSITY_DIRECTIVE, DeprecatedCompactDirective } from '@fundamental-ngx/core/content-density';\n\n@Directive({\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: 'fd-breadcrumb[compact]',\n    providers: [\n        {\n            provide: CONTENT_DENSITY_DIRECTIVE,\n            useExisting: forwardRef(() => DeprecatedBreadcrumbsCompactDirective)\n        }\n    ]\n})\nexport class DeprecatedBreadcrumbsCompactDirective extends DeprecatedCompactDirective {\n    constructor() {\n        super('fd-breadcrumb');\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { BreadcrumbComponent } from './breadcrumb.component';\nimport { BreadcrumbItemComponent } from './breadcrumb-item.component';\nimport { IconModule } from '@fundamental-ngx/core/icon';\nimport { PopoverModule } from '@fundamental-ngx/core/popover';\nimport { MenuModule } from '@fundamental-ngx/core/menu';\nimport { LinkModule } from '@fundamental-ngx/core/link';\nimport { BreadcrumbHiddenItemComponent } from './breadcrumb-hidden-item/breadcrumb-hidden-item.component';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { PipeModule } from '@fundamental-ngx/core/utils';\nimport { DeprecatedBreadcrumbsCompactDirective } from './deprecated-breadcrumbs-compact.directive';\nimport { ContentDensityModule } from '@fundamental-ngx/core/content-density';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        IconModule,\n        PopoverModule,\n        MenuModule,\n        LinkModule,\n        PortalModule,\n        PipeModule,\n        ContentDensityModule\n    ],\n    exports: [\n        BreadcrumbComponent,\n        BreadcrumbItemComponent,\n        LinkModule,\n        DeprecatedBreadcrumbsCompactDirective,\n        ContentDensityModule\n    ],\n    declarations: [\n        BreadcrumbComponent,\n        BreadcrumbItemComponent,\n        BreadcrumbHiddenItemComponent,\n        DeprecatedBreadcrumbsCompactDirective\n    ]\n})\nexport class BreadcrumbModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"fundamental-ngx-core-breadcrumb.mjs","sources":["../../../../../libs/core/src/lib/breadcrumb/breadcrumb-item.component.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.html","../../../../../libs/core/src/lib/breadcrumb/deprecated-breadcrumbs-compact.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.module.ts","../../../../../libs/core/src/lib/breadcrumb/fundamental-ngx-core-breadcrumb.ts"],"sourcesContent":["import {\n    AfterViewInit,\n    ChangeDetectorRef,\n    Component,\n    ContentChild,\n    ElementRef,\n    forwardRef,\n    Renderer2\n} from '@angular/core';\nimport { LinkComponent } from '@fundamental-ngx/core/link';\nimport { DomPortal } from '@angular/cdk/portal';\n\n/**\n * Breadcrumb item directive. Must have child breadcrumb link directives.\n *\n * ```html\n * <fd-breadcrumb-item>\n *     <a fd-link [routerLink]=\"'#'\">Breadcrumb Link</a>\n * </fd-breadcrumb-item>\n * ```\n */\n@Component({\n    selector: 'fd-breadcrumb-item',\n    template: '<div style=\"display: inline\"><ng-content></ng-content></div>',\n    host: {\n        class: 'fd-breadcrumb__item'\n    }\n})\nexport class BreadcrumbItemComponent implements AfterViewInit {\n    /** @hidden */\n    get elementRef(): ElementRef<HTMLElement> {\n        return this._elementRef;\n    }\n\n    /** @hidden */\n    @ContentChild(forwardRef(() => LinkComponent))\n    breadcrumbLink: LinkComponent;\n\n    /** @hidden */\n    get width(): number {\n        return this._elementRef.nativeElement.getBoundingClientRect().width;\n    }\n\n    /** In case there is no link in Item and breadcrumb item is non-interactive, we move whole item content to menu item title */\n    breadcrumbItemPortal: DomPortal<Element>;\n\n    /** When breadcrumb item has link in it, we are moving link content to menu item title */\n    linkContentPortal: DomPortal;\n\n    constructor(\n        private _elementRef: ElementRef<HTMLElement>,\n        private renderer2: Renderer2,\n        private _cdR: ChangeDetectorRef\n    ) {}\n\n    /** @hidden */\n    get needsClickProxy(): boolean {\n        return (\n            !!this.breadcrumbLink?.elementRef().nativeElement.getAttribute('href') || !!this.breadcrumbLink.routerLink\n        );\n    }\n\n    show = (): void => this.renderer2.setStyle(this._elementRef.nativeElement, 'display', 'inline-block');\n    hide = (): void => this.renderer2.setStyle(this._elementRef.nativeElement, 'display', 'none');\n\n    /** @hidden */\n    ngAfterViewInit(): void {\n        if (this.breadcrumbLink) {\n            this.linkContentPortal = new DomPortal<HTMLElement>(this.breadcrumbLink.contentSpan.nativeElement);\n        }\n        this.breadcrumbItemPortal = new DomPortal(this.elementRef.nativeElement.firstElementChild as Element);\n        this._cdR.detectChanges();\n    }\n}\n","import {\n    AfterViewInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    forwardRef,\n    Input,\n    NgZone,\n    OnDestroy,\n    OnInit,\n    Optional,\n    QueryList,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { BreadcrumbItemComponent } from './breadcrumb-item.component';\nimport { ResizeObserverService, RtlService } from '@fundamental-ngx/core/utils';\nimport { BehaviorSubject, firstValueFrom, map, startWith, Subscription, tap } from 'rxjs';\nimport { MenuComponent } from '@fundamental-ngx/core/menu';\nimport { Placement } from '@fundamental-ngx/core/shared';\n\n/**\n * Breadcrumb parent wrapper directive. Must have breadcrumb item child directives.\n *\n * ```html\n * <fd-breadcrumb>\n *     <fd-breadcrumb-item>\n *         <a fd-link [routerLink]=\"'#'\">Breadcrumb Link</a>\n *     </fd-breadcrumb-item>\n * </fd-breadcrumb>\n * ```\n */\n@Component({\n    // TODO to be discussed\n    // eslint-disable-next-line\n    selector: 'fd-breadcrumb',\n    host: {\n        class: 'fd-breadcrumb'\n    },\n    templateUrl: './breadcrumb.component.html',\n    styleUrls: ['./breadcrumb.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class BreadcrumbComponent implements AfterViewInit, OnInit, OnDestroy {\n    /** @hidden */\n    @ContentChildren(forwardRef(() => BreadcrumbItemComponent))\n    breadcrumbItems: QueryList<BreadcrumbItemComponent>;\n\n    /** @hidden */\n    @ViewChild(MenuComponent)\n    menuComponent: MenuComponent;\n\n    /** @hidden */\n    collapsedBreadcrumbItems: Array<BreadcrumbItemComponent> = [];\n\n    /** @hidden */\n    placement$ = new BehaviorSubject<Placement>('bottom-start');\n\n    /**\n     * The element to act as the breadcrumb container. When provided, the breadcrumb's responsive collapsing behavior\n     * performs better. When not provided, the immediate parent element's width will be used.\n     */\n    @Input()\n    containerElement: HTMLElement;\n\n    /** Whether to append items to the overflow dropdown in reverse order. Default is true. */\n    @Input()\n    reverse = false;\n\n    /** @hidden */\n    containerBoundary: number;\n\n    /** @hidden */\n    private _subscriptions = new Subscription();\n\n    /** @hidden */\n    private _itemToSize = new Map<BreadcrumbItemComponent, number>();\n\n    constructor(\n        public elementRef: ElementRef<Element>,\n        @Optional() private _rtlService: RtlService,\n        private _cdRef: ChangeDetectorRef,\n        private _resizeObserver: ResizeObserverService,\n        private _ngZone: NgZone\n    ) {}\n\n    /** @hidden */\n    ngOnInit(): void {\n        if (this._rtlService) {\n            this._subscriptions.add(\n                this._rtlService.rtl.subscribe((value) => this.placement$.next(value ? 'bottom-end' : 'bottom-start'))\n            );\n        }\n    }\n\n    ngAfterViewInit(): void {\n        this._subscriptions.add(\n            this.breadcrumbItems.changes\n                .pipe(\n                    startWith(this.breadcrumbItems),\n                    map((items) => items.toArray() as BreadcrumbItemComponent[]),\n                    map((items) => items.map((item) => [item, item.width]) as [BreadcrumbItemComponent, number][]),\n                    tap((itemToSize: [BreadcrumbItemComponent, number][]) => (this._itemToSize = new Map(itemToSize)))\n                )\n                .subscribe()\n        );\n        firstValueFrom(this._ngZone.onStable).then(() => {\n            this._subscriptions.add(\n                this._resizeObserver\n                    .observe(this.containerElement || (this.elementRef.nativeElement.parentElement as Element))\n                    .subscribe(() => this.onResize())\n            );\n        });\n    }\n\n    /** @hidden */\n    ngOnDestroy(): void {\n        this._subscriptions.unsubscribe();\n    }\n\n    /** @hidden */\n    onResize(): void {\n        if (!this.elementRef.nativeElement.parentElement) {\n            return;\n        }\n        this.containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n\n        if (this.containerElement) {\n            this.containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n\n        let visibleSum = 0;\n        const breadcrumbItemComponents = this.breadcrumbItems.toArray();\n        let i;\n        for (i = breadcrumbItemComponents.length - 1; i >= 0; i--) {\n            const breadcrumbItem = breadcrumbItemComponents[i];\n            const itemSize = this._itemToSize.has(breadcrumbItem)\n                ? (this._itemToSize.get(breadcrumbItem) as number)\n                : breadcrumbItem.width;\n            if (visibleSum + itemSize <= this.containerBoundary) {\n                visibleSum += itemSize;\n                breadcrumbItem.show();\n            } else {\n                break;\n            }\n        }\n        const collapsedBreadcrumbItems = breadcrumbItemComponents.slice(0, ++i);\n        this.collapsedBreadcrumbItems = this.reverse ? collapsedBreadcrumbItems : collapsedBreadcrumbItems.reverse();\n        this.collapsedBreadcrumbItems.forEach((item) => item.hide());\n        this._cdRef.detectChanges();\n    }\n\n    /** @hidden */\n    keyDownHandle(event: Event): void {\n        this.menuComponent.toggle();\n        event.preventDefault();\n    }\n\n    /**\n     * We catch interactions with item, Enter, Space, Mouse click and Touch click,\n     * if original element had router link we are proxying click to that element\n     * */\n    itemClicked(breadcrumbItem: BreadcrumbItemComponent, $event: any): void {\n        if (breadcrumbItem.needsClickProxy) {\n            $event.preventDefault();\n            breadcrumbItem.breadcrumbLink.elementRef().nativeElement.click();\n        }\n    }\n}\n","<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <ng-container *ngFor=\"let breadcrumbItem of collapsedBreadcrumbItems\">\n        <li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n            <a\n                fd-menu-interactive\n                (click)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.enter)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.space)=\"itemClicked(breadcrumbItem, $event)\"\n            >\n                <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                        <fd-menu-addon\n                            position=\"before\"\n                            [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                        ></fd-menu-addon>\n                    </ng-container>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.linkContentPortal\"></ng-container>\n                    </span>\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                        <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n                    </ng-container>\n                </ng-container>\n                <ng-template #portalContent>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.breadcrumbItemPortal\"></ng-container>\n                    </span>\n                </ng-template>\n            </a>\n        </li>\n    </ng-container>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n","import { Directive, forwardRef } from '@angular/core';\nimport { CONTENT_DENSITY_DIRECTIVE, DeprecatedCompactDirective } from '@fundamental-ngx/core/content-density';\n\n@Directive({\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: 'fd-breadcrumb[compact]',\n    providers: [\n        {\n            provide: CONTENT_DENSITY_DIRECTIVE,\n            useExisting: forwardRef(() => DeprecatedBreadcrumbsCompactDirective)\n        }\n    ]\n})\nexport class DeprecatedBreadcrumbsCompactDirective extends DeprecatedCompactDirective {\n    constructor() {\n        super('fd-breadcrumb');\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { BreadcrumbComponent } from './breadcrumb.component';\nimport { BreadcrumbItemComponent } from './breadcrumb-item.component';\nimport { IconModule } from '@fundamental-ngx/core/icon';\nimport { PopoverModule } from '@fundamental-ngx/core/popover';\nimport { MenuModule } from '@fundamental-ngx/core/menu';\nimport { LinkModule } from '@fundamental-ngx/core/link';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { PipeModule } from '@fundamental-ngx/core/utils';\nimport { DeprecatedBreadcrumbsCompactDirective } from './deprecated-breadcrumbs-compact.directive';\nimport { ContentDensityModule } from '@fundamental-ngx/core/content-density';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        IconModule,\n        PopoverModule,\n        MenuModule,\n        LinkModule,\n        PortalModule,\n        PipeModule,\n        ContentDensityModule\n    ],\n    exports: [\n        BreadcrumbComponent,\n        BreadcrumbItemComponent,\n        LinkModule,\n        DeprecatedBreadcrumbsCompactDirective,\n        ContentDensityModule\n    ],\n    declarations: [BreadcrumbComponent, BreadcrumbItemComponent, DeprecatedBreadcrumbsCompactDirective]\n})\nexport class BreadcrumbModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/breadcrumb/fesm2020/fundamental-ngx-core-breadcrumb.mjs

@@ -1,17 +1,17 @@
 import * as i0 from '@angular/core';
-import { Component, ContentChild, forwardRef, ChangeDetectionStrategy, Input, ViewEncapsulation, Optional, ContentChildren, ViewChild, Directive, NgModule } from '@angular/core';
-import * as i6 from '@angular/common';
+import { Component, ContentChild, forwardRef, ViewEncapsulation, ChangeDetectionStrategy, Optional, ContentChildren, ViewChild, Input, Directive, NgModule } from '@angular/core';
+import * as i5 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i4 from '@fundamental-ngx/core/link';
+import * as i3 from '@fundamental-ngx/core/link';
 import { LinkComponent, LinkModule } from '@fundamental-ngx/core/link';
-import * as i1$1 from '@fundamental-ngx/core/utils';
+import * as i6 from '@angular/cdk/portal';
+import { DomPortal, PortalModule } from '@angular/cdk/portal';
+import * as i1 from '@fundamental-ngx/core/utils';
 import { PipeModule } from '@fundamental-ngx/core/utils';
 import { BehaviorSubject, Subscription, startWith, map, tap, firstValueFrom } from 'rxjs';
-import * as i1 from '@fundamental-ngx/core/menu';
+import * as i2 from '@fundamental-ngx/core/menu';
 import { MenuComponent, MenuModule } from '@fundamental-ngx/core/menu';
-import * as i3 from '@angular/cdk/portal';
-import { DomPortal, PortalModule } from '@angular/cdk/portal';
-import * as i5 from '@fundamental-ngx/core/icon';
+import * as i4 from '@fundamental-ngx/core/icon';
 import { IconModule } from '@fundamental-ngx/core/icon';
 import { PopoverModule } from '@fundamental-ngx/core/popover';
 import { DeprecatedCompactDirective, CONTENT_DENSITY_DIRECTIVE, ContentDensityModule } from '@fundamental-ngx/core/content-density';
@@ -26,9 +26,10 @@ import { DeprecatedCompactDirective, CONTENT_DENSITY_DIRECTIVE, ContentDensityMo
  * ```
  */
 class BreadcrumbItemComponent {
-    constructor(_elementRef, renderer2) {
+    constructor(_elementRef, renderer2, _cdR) {
         this._elementRef = _elementRef;
         this.renderer2 = renderer2;
+        this._cdR = _cdR;
         this.show = () => this.renderer2.setStyle(this._elementRef.nativeElement, 'display', 'inline-block');
         this.hide = () => this.renderer2.setStyle(this._elementRef.nativeElement, 'display', 'none');
     }
@@ -44,8 +45,16 @@ class BreadcrumbItemComponent {
     get needsClickProxy() {
         return (!!this.breadcrumbLink?.elementRef().nativeElement.getAttribute('href') || !!this.breadcrumbLink.routerLink);
     }
+    /** @hidden */
+    ngAfterViewInit() {
+        if (this.breadcrumbLink) {
+            this.linkContentPortal = new DomPortal(this.breadcrumbLink.contentSpan.nativeElement);
+        }
+        this.breadcrumbItemPortal = new DomPortal(this.elementRef.nativeElement.firstElementChild);
+        this._cdR.detectChanges();
+    }
 }
-BreadcrumbItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+BreadcrumbItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 BreadcrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbItemComponent, selector: "fd-breadcrumb-item", host: { classAttribute: "fd-breadcrumb__item" }, queries: [{ propertyName: "breadcrumbLink", first: true, predicate: i0.forwardRef(function () { return LinkComponent; }), descendants: true }], ngImport: i0, template: '<div style="display: inline"><ng-content></ng-content></div>', isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbItemComponent, decorators: [{
             type: Component,
@@ -56,43 +65,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
                         class: 'fd-breadcrumb__item'
                     }
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { breadcrumbLink: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { breadcrumbLink: [{
                 type: ContentChild,
                 args: [forwardRef(() => LinkComponent)]
             }] } });
 
-class BreadcrumbHiddenItemComponent {
-    constructor(_cdr) {
-        this._cdr = _cdr;
-    }
-    /** @hidden */
-    ngAfterViewInit() {
-        if (this.breadcrumbItem.breadcrumbLink) {
-            this.linkContentPortal = new DomPortal(this.breadcrumbItem.breadcrumbLink.contentSpan.nativeElement);
-        }
-        this.breadcrumbItemPortal = new DomPortal(this.breadcrumbItem.elementRef.nativeElement.firstElementChild);
-        this._cdr.detectChanges();
-    }
-    /**
-     * We catch interactions with item, Enter, Space, Mouse click and Touch click,
-     * if original element had router link we are proxying click to that element
-     * */
-    itemClicked($event) {
-        if (this.breadcrumbItem.needsClickProxy) {
-            $event.preventDefault();
-            this.breadcrumbItem.breadcrumbLink.elementRef().nativeElement.click();
-        }
-    }
-}
-BreadcrumbHiddenItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbHiddenItemComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbHiddenItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbHiddenItemComponent, selector: "fd-breadcrumb-hidden-item", inputs: { breadcrumbItem: "breadcrumbItem" }, ngImport: i0, template: "<li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n    <a\n        fd-menu-interactive\n        (click)=\"itemClicked($event)\"\n        (keydown.enter)=\"itemClicked($event)\"\n        (keydown.space)=\"itemClicked($event)\"\n    >\n        <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                <fd-menu-addon\n                    position=\"before\"\n                    [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                ></fd-menu-addon>\n            </ng-container>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"linkContentPortal\"></ng-container>\n            </span>\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n            </ng-container>\n        </ng-container>\n        <ng-template #portalContent>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"breadcrumbItemPortal\"></ng-container>\n            </span>\n        </ng-template>\n    </a>\n</li>\n", components: [{ type: i1.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { type: i1.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "glyph", "submenuIndicator", "ariaHidden"] }], directives: [{ type: i1.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MenuTitleDirective, selector: "[fd-menu-title]" }, { type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbHiddenItemComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fd-breadcrumb-hidden-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n    <a\n        fd-menu-interactive\n        (click)=\"itemClicked($event)\"\n        (keydown.enter)=\"itemClicked($event)\"\n        (keydown.space)=\"itemClicked($event)\"\n    >\n        <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                <fd-menu-addon\n                    position=\"before\"\n                    [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                ></fd-menu-addon>\n            </ng-container>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"linkContentPortal\"></ng-container>\n            </span>\n            <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n            </ng-container>\n        </ng-container>\n        <ng-template #portalContent>\n            <span fd-menu-title>\n                <ng-container [cdkPortalOutlet]=\"breadcrumbItemPortal\"></ng-container>\n            </span>\n        </ng-template>\n    </a>\n</li>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { breadcrumbItem: [{
-                type: Input
-            }] } });
-
 /**
  * Breadcrumb parent wrapper directive. Must have breadcrumb item child directives.
  *
@@ -177,17 +154,27 @@ class BreadcrumbComponent {
         this.menuComponent.toggle();
         event.preventDefault();
     }
+    /**
+     * We catch interactions with item, Enter, Space, Mouse click and Touch click,
+     * if original element had router link we are proxying click to that element
+     * */
+    itemClicked(breadcrumbItem, $event) {
+        if (breadcrumbItem.needsClickProxy) {
+            $event.preventDefault();
+            breadcrumbItem.breadcrumbLink.elementRef().nativeElement.click();
+        }
+    }
 }
-BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.RtlService, optional: true }, { token: i0.ChangeDetectorRef }, { token: i1$1.ResizeObserverService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbComponent, selector: "fd-breadcrumb", inputs: { containerElement: "containerElement", reverse: "reverse" }, host: { classAttribute: "fd-breadcrumb" }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(function () { return BreadcrumbItemComponent; }) }], viewQueries: [{ propertyName: "menuComponent", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <fd-breadcrumb-hidden-item\n        *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\"\n        [breadcrumbItem]=\"collapsedBreadcrumbItem\"\n    >\n    </fd-breadcrumb-hidden-item>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.1-rc.1\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-breadcrumb\n    .fd-breadcrumb__item\n    .fd-breadcrump__link\n*/.fd-breadcrumb{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-wrap:wrap;align-items:center;list-style:none}.fd-breadcrumb:before,.fd-breadcrumb:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapContent_LabelColor)}.fd-breadcrumb__item:before,.fd-breadcrumb__item:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item:after{content:\"/\";color:var(--sapContent_LabelColor);margin-right:.25rem;margin-left:.25rem}.fd-breadcrumb__item:last-child:after{content:none}.fd-breadcrumb__item .fd-breadcrumb__popover-body{border:none;border-top-left-radius:.125rem;border-top-right-radius:.125rem}.fd-breadcrumb{display:inline-block;white-space:nowrap}.fd-breadcrumb .fd-breadcrumb__collapsed{cursor:pointer}\n"], components: [{ type: i1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { type: BreadcrumbHiddenItemComponent, selector: "fd-breadcrumb-hidden-item", inputs: ["breadcrumbItem"] }, { type: i4.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { type: i5.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }], pipes: { "async": i6.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i0.ElementRef }, { token: i1.RtlService, optional: true }, { token: i0.ChangeDetectorRef }, { token: i1.ResizeObserverService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbComponent, selector: "fd-breadcrumb", inputs: { containerElement: "containerElement", reverse: "reverse" }, host: { classAttribute: "fd-breadcrumb" }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(function () { return BreadcrumbItemComponent; }) }], viewQueries: [{ propertyName: "menuComponent", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <ng-container *ngFor=\"let breadcrumbItem of collapsedBreadcrumbItems\">\n        <li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n            <a\n                fd-menu-interactive\n                (click)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.enter)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.space)=\"itemClicked(breadcrumbItem, $event)\"\n            >\n                <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                        <fd-menu-addon\n                            position=\"before\"\n                            [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                        ></fd-menu-addon>\n                    </ng-container>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.linkContentPortal\"></ng-container>\n                    </span>\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                        <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n                    </ng-container>\n                </ng-container>\n                <ng-template #portalContent>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.breadcrumbItemPortal\"></ng-container>\n                    </span>\n                </ng-template>\n            </a>\n        </li>\n    </ng-container>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.1-rc.1\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-breadcrumb\n    .fd-breadcrumb__item\n    .fd-breadcrump__link\n*/.fd-breadcrumb{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-wrap:wrap;align-items:center;list-style:none}.fd-breadcrumb:before,.fd-breadcrumb:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapContent_LabelColor)}.fd-breadcrumb__item:before,.fd-breadcrumb__item:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item:after{content:\"/\";color:var(--sapContent_LabelColor);margin-right:.25rem;margin-left:.25rem}.fd-breadcrumb__item:last-child:after{content:none}.fd-breadcrumb__item .fd-breadcrumb__popover-body{border:none;border-top-left-radius:.125rem;border-top-right-radius:.125rem}.fd-breadcrumb{display:inline-block;white-space:nowrap}.fd-breadcrumb .fd-breadcrumb__collapsed{cursor:pointer}\n"], components: [{ type: i2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { type: i2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { type: i2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "glyph", "submenuIndicator", "ariaHidden"] }, { type: i3.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { type: i4.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.MenuTitleDirective, selector: "[fd-menu-title]" }, { type: i6.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { type: i2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }], pipes: { "async": i5.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-breadcrumb', host: {
                         class: 'fd-breadcrumb'
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <fd-breadcrumb-hidden-item\n        *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\"\n        [breadcrumbItem]=\"collapsedBreadcrumbItem\"\n    >\n    </fd-breadcrumb-hidden-item>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.1-rc.1\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-breadcrumb\n    .fd-breadcrumb__item\n    .fd-breadcrump__link\n*/.fd-breadcrumb{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-wrap:wrap;align-items:center;list-style:none}.fd-breadcrumb:before,.fd-breadcrumb:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapContent_LabelColor)}.fd-breadcrumb__item:before,.fd-breadcrumb__item:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item:after{content:\"/\";color:var(--sapContent_LabelColor);margin-right:.25rem;margin-left:.25rem}.fd-breadcrumb__item:last-child:after{content:none}.fd-breadcrumb__item .fd-breadcrumb__popover-body{border:none;border-top-left-radius:.125rem;border-top-right-radius:.125rem}.fd-breadcrumb{display:inline-block;white-space:nowrap}.fd-breadcrumb .fd-breadcrumb__collapsed{cursor:pointer}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$1.RtlService, decorators: [{
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-menu #menu [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <ng-container *ngFor=\"let breadcrumbItem of collapsedBreadcrumbItems\">\n        <li fd-menu-item [disabled]=\"breadcrumbItem.breadcrumbLink ? breadcrumbItem.breadcrumbLink.disabled : false\">\n            <a\n                fd-menu-interactive\n                (click)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.enter)=\"itemClicked(breadcrumbItem, $event)\"\n                (keydown.space)=\"itemClicked(breadcrumbItem, $event)\"\n            >\n                <ng-container *ngIf=\"breadcrumbItem?.breadcrumbLink; else portalContent\">\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._prefixIconName\">\n                        <fd-menu-addon\n                            position=\"before\"\n                            [glyph]=\"breadcrumbItem.breadcrumbLink._prefixIconName\"\n                        ></fd-menu-addon>\n                    </ng-container>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.linkContentPortal\"></ng-container>\n                    </span>\n                    <ng-container *ngIf=\"breadcrumbItem.breadcrumbLink._postfixIconName\">\n                        <fd-menu-addon [glyph]=\"breadcrumbItem.breadcrumbLink._postfixIconName\"></fd-menu-addon>\n                    </ng-container>\n                </ng-container>\n                <ng-template #portalContent>\n                    <span fd-menu-title>\n                        <ng-container [cdkPortalOutlet]=\"breadcrumbItem.breadcrumbItemPortal\"></ng-container>\n                    </span>\n                </ng-template>\n            </a>\n        </li>\n    </ng-container>\n</fd-menu>\n\n<span class=\"fd-breadcrumb__item\" *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a\n        fd-link\n        tabindex=\"0\"\n        class=\"fd-breadcrumb__collapsed\"\n        (keydown.enter)=\"keyDownHandle($event)\"\n        (keydown.space)=\"keyDownHandle($event)\"\n    >\n        ...\n        <fd-icon glyph=\"slim-arrow-down\"></fd-icon>\n    </a>\n</span>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.1-rc.1\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-breadcrumb\n    .fd-breadcrumb__item\n    .fd-breadcrump__link\n*/.fd-breadcrumb{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;flex-wrap:wrap;align-items:center;list-style:none}.fd-breadcrumb:before,.fd-breadcrumb:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapContent_LabelColor)}.fd-breadcrumb__item:before,.fd-breadcrumb__item:after{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__item:after{content:\"/\";color:var(--sapContent_LabelColor);margin-right:.25rem;margin-left:.25rem}.fd-breadcrumb__item:last-child:after{content:none}.fd-breadcrumb__item .fd-breadcrumb__popover-body{border:none;border-top-left-radius:.125rem;border-top-right-radius:.125rem}.fd-breadcrumb{display:inline-block;white-space:nowrap}.fd-breadcrumb .fd-breadcrumb__collapsed{cursor:pointer}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.RtlService, decorators: [{
                     type: Optional
-                }] }, { type: i0.ChangeDetectorRef }, { type: i1$1.ResizeObserverService }, { type: i0.NgZone }]; }, propDecorators: { breadcrumbItems: [{
+                }] }, { type: i0.ChangeDetectorRef }, { type: i1.ResizeObserverService }, { type: i0.NgZone }]; }, propDecorators: { breadcrumbItems: [{
                 type: ContentChildren,
                 args: [forwardRef(() => BreadcrumbItemComponent)]
             }], menuComponent: [{
@@ -228,10 +215,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
 class BreadcrumbModule {
 }
 BreadcrumbModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-BreadcrumbModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbModule, declarations: [BreadcrumbComponent,
-        BreadcrumbItemComponent,
-        BreadcrumbHiddenItemComponent,
-        DeprecatedBreadcrumbsCompactDirective], imports: [CommonModule,
+BreadcrumbModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: BreadcrumbModule, declarations: [BreadcrumbComponent, BreadcrumbItemComponent, DeprecatedBreadcrumbsCompactDirective], imports: [CommonModule,
         IconModule,
         PopoverModule,
         MenuModule,
@@ -274,12 +258,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
                         DeprecatedBreadcrumbsCompactDirective,
                         ContentDensityModule
                     ],
-                    declarations: [
-                        BreadcrumbComponent,
-                        BreadcrumbItemComponent,
-                        BreadcrumbHiddenItemComponent,
-                        DeprecatedBreadcrumbsCompactDirective
-                    ]
+                    declarations: [BreadcrumbComponent, BreadcrumbItemComponent, DeprecatedBreadcrumbsCompactDirective]
                 }]
         }] });