@fundamental-ngx/core 0.34.3-rc.3 → 0.34.3-rc.30

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

@@ -115,6 +115,8 @@ class BreadcrumbComponent {
         this.collapsedBreadcrumbItems = [];
         /** @hidden */
         this.placement$ = new BehaviorSubject('bottom-start');
+        /** Whether or not to append items to the overflow dropdown in reverse order. Default is true. */
+        this.reverse = false;
         /** @hidden */
         this._subscriptions = new Subscription();
     }
@@ -193,7 +195,9 @@ class BreadcrumbComponent {
             i < this.breadcrumbItems.length) {
             const breadcrumbItem = this.breadcrumbItems.filter((item, index) => index === i)[0];
             if (this.collapsedBreadcrumbItems.indexOf(breadcrumbItem) === -1) {
-                this.collapsedBreadcrumbItems.push(breadcrumbItem);
+                this.reverse
+                    ? this.collapsedBreadcrumbItems.push(breadcrumbItem)
+                    : this.collapsedBreadcrumbItems.unshift(breadcrumbItem);
             }
             // hide the original breadcrumb items that have been moved in to the collapsed menu
             breadcrumbItem.elementRef.nativeElement.style.display = 'none';
@@ -264,12 +268,12 @@ class BreadcrumbComponent {
     }
 }
 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: i1.ContentDensityService, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbComponent, selector: "fd-breadcrumb", inputs: { compact: "compact", containerElement: "containerElement" }, host: { listeners: { "window:resize": "onResize()" }, classAttribute: "fd-breadcrumb" }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(function () { return BreadcrumbItemDirective; }) }], viewQueries: [{ propertyName: "menuComponent", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "<fd-menu #menu [compact]=\"compact\" closeOnEscapeKey=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\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:after,.fd-breadcrumb:before{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:after,.fd-breadcrumb__item:before{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__link{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(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);line-height:inherit;display:inline-block;transition:all 125ms ease-in}.fd-breadcrumb__link:after,.fd-breadcrumb__link:before{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__link--emphasized{font-weight:700}.fd-breadcrumb__link:visited{color:var(--sapLink_Visited_Color)}.fd-breadcrumb__link.is-hover,.fd-breadcrumb__link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-focus,.fd-breadcrumb__link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-active,.fd-breadcrumb__link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-breadcrumb__link--inverted.is-hover,.fd-breadcrumb__link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-breadcrumb__link--inverted.is-focus,.fd-breadcrumb__link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-breadcrumb__link--subtle{color:var(--sapLink_SubtleColor)}.fd-breadcrumb__link.is-disabled,.fd-breadcrumb__link:disabled,.fd-breadcrumb__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-breadcrumb__link>img{vertical-align:bottom}.fd-breadcrumb__link:focus .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:active .fd-breadcrumb__dropdown-icon,.fd-breadcrumb__link:active:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Hover_Color)}.fd-breadcrumb__dropdown-icon [class*=sap-icon],.fd-breadcrumb__dropdown-icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;text-decoration:inherit;color:var(--sapLinkColor)}.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", "compact", "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"] }], directives: [{ type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { type: i2.MenuTitleDirective, selector: "[fd-menu-title]" }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BreadcrumbItemDirective, selector: "fd-breadcrumb-item" }, { type: i2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { type: BreadcrumbLinkDirective, selector: "[fd-breadcrumb-link]", inputs: ["routerLink"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbComponent, selector: "fd-breadcrumb", inputs: { compact: "compact", containerElement: "containerElement", reverse: "reverse" }, host: { listeners: { "window:resize": "onResize()" }, classAttribute: "fd-breadcrumb" }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(function () { return BreadcrumbItemDirective; }) }], viewQueries: [{ propertyName: "menuComponent", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "<fd-menu #menu [compact]=\"compact\" [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\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:after,.fd-breadcrumb:before{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:after,.fd-breadcrumb__item:before{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__link{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(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);line-height:inherit;display:inline-block;transition:all 125ms ease-in}.fd-breadcrumb__link:after,.fd-breadcrumb__link:before{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__link--emphasized{font-weight:700}.fd-breadcrumb__link:visited{color:var(--sapLink_Visited_Color)}.fd-breadcrumb__link.is-hover,.fd-breadcrumb__link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-focus,.fd-breadcrumb__link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-active,.fd-breadcrumb__link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-breadcrumb__link--inverted.is-hover,.fd-breadcrumb__link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-breadcrumb__link--inverted.is-focus,.fd-breadcrumb__link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-breadcrumb__link--subtle{color:var(--sapLink_SubtleColor)}.fd-breadcrumb__link.is-disabled,.fd-breadcrumb__link:disabled,.fd-breadcrumb__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-breadcrumb__link>img{vertical-align:bottom}.fd-breadcrumb__link:focus .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:active .fd-breadcrumb__dropdown-icon,.fd-breadcrumb__link:active:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Hover_Color)}.fd-breadcrumb__dropdown-icon [class*=sap-icon],.fd-breadcrumb__dropdown-icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;text-decoration:inherit;color:var(--sapLinkColor)}.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", "compact", "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"] }], directives: [{ type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { type: i2.MenuTitleDirective, selector: "[fd-menu-title]" }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BreadcrumbItemDirective, selector: "fd-breadcrumb-item" }, { type: i2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { type: BreadcrumbLinkDirective, selector: "[fd-breadcrumb-link]", inputs: ["routerLink"] }], pipes: { "async": i3.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 [compact]=\"compact\" closeOnEscapeKey=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\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:after,.fd-breadcrumb:before{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:after,.fd-breadcrumb__item:before{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__link{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(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);line-height:inherit;display:inline-block;transition:all 125ms ease-in}.fd-breadcrumb__link:after,.fd-breadcrumb__link:before{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__link--emphasized{font-weight:700}.fd-breadcrumb__link:visited{color:var(--sapLink_Visited_Color)}.fd-breadcrumb__link.is-hover,.fd-breadcrumb__link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-focus,.fd-breadcrumb__link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-active,.fd-breadcrumb__link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-breadcrumb__link--inverted.is-hover,.fd-breadcrumb__link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-breadcrumb__link--inverted.is-focus,.fd-breadcrumb__link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-breadcrumb__link--subtle{color:var(--sapLink_SubtleColor)}.fd-breadcrumb__link.is-disabled,.fd-breadcrumb__link:disabled,.fd-breadcrumb__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-breadcrumb__link>img{vertical-align:bottom}.fd-breadcrumb__link:focus .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:active .fd-breadcrumb__dropdown-icon,.fd-breadcrumb__link:active:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Hover_Color)}.fd-breadcrumb__dropdown-icon [class*=sap-icon],.fd-breadcrumb__dropdown-icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;text-decoration:inherit;color:var(--sapLinkColor)}.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 [compact]=\"compact\" [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\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:after,.fd-breadcrumb:before{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:after,.fd-breadcrumb__item:before{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__link{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(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);line-height:inherit;display:inline-block;transition:all 125ms ease-in}.fd-breadcrumb__link:after,.fd-breadcrumb__link:before{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__link--emphasized{font-weight:700}.fd-breadcrumb__link:visited{color:var(--sapLink_Visited_Color)}.fd-breadcrumb__link.is-hover,.fd-breadcrumb__link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-focus,.fd-breadcrumb__link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-active,.fd-breadcrumb__link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-breadcrumb__link--inverted.is-hover,.fd-breadcrumb__link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-breadcrumb__link--inverted.is-focus,.fd-breadcrumb__link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-breadcrumb__link--subtle{color:var(--sapLink_SubtleColor)}.fd-breadcrumb__link.is-disabled,.fd-breadcrumb__link:disabled,.fd-breadcrumb__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-breadcrumb__link>img{vertical-align:bottom}.fd-breadcrumb__link:focus .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:active .fd-breadcrumb__dropdown-icon,.fd-breadcrumb__link:active:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Hover_Color)}.fd-breadcrumb__dropdown-icon [class*=sap-icon],.fd-breadcrumb__dropdown-icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;text-decoration:inherit;color:var(--sapLinkColor)}.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
@@ -286,6 +290,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
                 args: [MenuComponent]
             }], containerElement: [{
                 type: Input
+            }], reverse: [{
+                type: Input
             }], onResize: [{
                 type: HostListener,
                 args: ['window:resize', []]

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-link.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb-item.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.html","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.module.ts","../../../../../libs/core/src/lib/breadcrumb/fundamental-ngx-core-breadcrumb.ts"],"sourcesContent":["import { Directive, ElementRef, Input } from '@angular/core';\n\n/**\n * Breadcrumb link directive. Use Angular router options (such as 'routerLink' and 'queryParams') with this directive.\n *\n * ```html\n * <a fd-breadcrumb-link [routerLink]=\"'some-url'\" [queryParams]=\"'params'\">Breadcrumb Link</a>\n * ```\n */\n@Directive({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: '[fd-breadcrumb-link]',\n    host: {\n        class: 'fd-breadcrumb__link'\n    }\n})\nexport class BreadcrumbLinkDirective {\n    /** @hidden */\n    @Input()\n    routerLink = '';\n\n    get elementRef(): ElementRef {\n        return this._elementRef;\n    }\n\n    constructor(private _elementRef: ElementRef) {}\n}\n","import { AfterContentInit, ContentChild, Directive, ElementRef, forwardRef } from '@angular/core';\nimport { BreadcrumbLinkDirective } from './breadcrumb-link.directive';\n\n/**\n * Breadcrumb item directive. Must have child breadcrumb link directives.\n *\n * ```html\n * <fd-breadcrumb-item>\n *     <a fd-breadcrumb-link [routerLink]=\"'#'\">Breadcrumb Link</a>\n * </fd-breadcrumb-item>\n * ```\n */\n@Directive({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: 'fd-breadcrumb-item',\n    host: {\n        class: 'fd-breadcrumb__item'\n    }\n})\nexport class BreadcrumbItemDirective implements AfterContentInit {\n    /** @hidden */\n    get elementRef(): ElementRef {\n        return this._elementRef;\n    }\n\n    /** @hidden */\n    href = '';\n\n    /** @hidden */\n    routerLink = '';\n\n    /** @hidden */\n    @ContentChild(forwardRef(() => BreadcrumbLinkDirective))\n    breadcrumbLink: BreadcrumbLinkDirective;\n\n    constructor(private _elementRef: ElementRef) {}\n\n    /** @hidden */\n    ngAfterContentInit(): void {\n        if (this.breadcrumbLink && this.breadcrumbLink.elementRef.nativeElement.getAttribute('href')) {\n            this.href = this.breadcrumbLink.elementRef.nativeElement.getAttribute('href');\n        }\n        if (this.breadcrumbLink && this.breadcrumbLink.routerLink) {\n            this.routerLink = this.breadcrumbLink.routerLink;\n        }\n    }\n}\n","import {\n    AfterContentInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    forwardRef,\n    HostListener,\n    Input,\n    OnDestroy,\n    OnInit,\n    Optional,\n    QueryList,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { BreadcrumbItemDirective } from './breadcrumb-item.directive';\nimport { RtlService } from '@fundamental-ngx/core/utils';\nimport { BehaviorSubject, Subscription } from 'rxjs';\nimport { KeyUtil } from '@fundamental-ngx/core/utils';\nimport { MenuComponent } from '@fundamental-ngx/core/menu';\nimport { ENTER, SPACE } from '@angular/cdk/keycodes';\nimport { Placement } from '@fundamental-ngx/core/shared';\nimport { ContentDensityService } from '@fundamental-ngx/core/utils';\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-breadcrumb-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 AfterContentInit, OnInit, OnDestroy {\n    /** Whenever links wrapped inside overflow should be displayed in compact mode  */\n    @Input()\n    compact?: boolean;\n\n    /** @hidden */\n    @ContentChildren(forwardRef(() => BreadcrumbItemDirective))\n    breadcrumbItems: QueryList<BreadcrumbItemDirective>;\n\n    /** @hidden */\n    @ViewChild(MenuComponent)\n    menuComponent: MenuComponent;\n\n    /** @hidden */\n    collapsedBreadcrumbItems: Array<BreadcrumbItemDirective> = [];\n\n    /** @hidden used to compare to the current width to know whether to collapse or expand breadcrumbs */\n    previousContainerWidth: number;\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    /** @hidden */\n    containerBoundary: number;\n\n    /** @hidden */\n    private _subscriptions = new Subscription();\n\n    constructor(\n        public elementRef: ElementRef,\n        @Optional() private _rtlService: RtlService,\n        @Optional() private _contentDensityService: ContentDensityService,\n        private _cdRef: ChangeDetectorRef\n    ) {}\n\n    /** @hidden */\n    ngAfterContentInit(): void {\n        this.onResize();\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        if (this.compact === undefined && this._contentDensityService) {\n            this._subscriptions.add(\n                this._contentDensityService._isCompactDensity.subscribe((isCompact) => {\n                    this.compact = isCompact;\n                    this._cdRef.markForCheck();\n                })\n            );\n        }\n    }\n\n    /** @hidden */\n    ngOnDestroy(): void {\n        this._subscriptions.unsubscribe();\n    }\n\n    /** @hidden */\n    @HostListener('window:resize', [])\n    onResize(): void {\n        if (!this.elementRef.nativeElement.parentElement) {\n            return;\n        }\n        this.containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n        if (this.containerElement) {\n            this.containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n        /*\n            if this is the first load and there is no previousContainerWidth,\n            or the container boundary is smaller than the previousContainerWidth\n         */\n        if (!this.previousContainerWidth || this.containerBoundary < this.previousContainerWidth) {\n            // and the breadcrumbs extend past the window\n            if (this.elementRef.nativeElement.getBoundingClientRect().width > this.containerBoundary) {\n                this.collapseBreadcrumbs();\n            }\n        } else if (this.collapsedBreadcrumbItems.length) {\n            // if the screen is getting bigger and there are collapsed breadcrumbs\n            this.expandBreadcrumbs();\n        }\n        this.previousContainerWidth = this.containerBoundary;\n        this._cdRef.detectChanges();\n    }\n\n    /** @hidden */\n    keyDownHandle(event: KeyboardEvent): void {\n        if (KeyUtil.isKeyCode(event, [ENTER, SPACE])) {\n            this.menuComponent.toggle();\n            event.preventDefault();\n        }\n    }\n\n    /** @hidden */\n    getContainerBoundary(): number {\n        let containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n        if (this.containerElement) {\n            containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n\n        return containerBoundary;\n    }\n\n    /**\n     * @hidden\n     *\n     * This function moves breadcrumbs from the original QueryList of BreadCrumbItemDirectives into the array of\n     * collapsedBreadcrumbItems.\n     * */\n    collapseBreadcrumbs(): void {\n        let i = 0;\n        const containerBoundary = this.getContainerBoundary();\n        // move the breadcrumb items into a collapsed menu one by one, until the last one is inside the window\n        while (\n            this.elementRef.nativeElement.getBoundingClientRect().width > containerBoundary &&\n            i < this.breadcrumbItems.length\n        ) {\n            const breadcrumbItem = this.breadcrumbItems.filter((item, index) => index === i)[0];\n            if (this.collapsedBreadcrumbItems.indexOf(breadcrumbItem) === -1) {\n                this.collapsedBreadcrumbItems.push(breadcrumbItem);\n            }\n            // hide the original breadcrumb items that have been moved in to the collapsed menu\n            breadcrumbItem.elementRef.nativeElement.style.display = 'none';\n            i++;\n        }\n    }\n\n    /**\n     * @hidden\n     *\n     * This function removes breadcrumb items from the collapsedBreadcrumbItems array and makes them visible again in the\n     * original QueryList of BreadcrumbItemDirectives.\n     * */\n    expandBreadcrumbs(): void {\n        let breakLoop = false;\n        let i = 0;\n        const originalCollapsedLength = this.collapsedBreadcrumbItems.length;\n        while (this.fitInBoundries() && !breakLoop && i < originalCollapsedLength) {\n            // get the most recently collapsed breadcrumb\n            const collapsedItemToPop = this.getCollapsedItem();\n            // find the corresponding breadcrumb from the original breadcrumb item QueryList\n            const breadcrumbToCheck = this.getBreadcrumbToCheck(collapsedItemToPop);\n            /*\n              set display: 'inline-block' and visibility: 'hidden' - this way, the parent breadcrumb component's width will\n              contain the width of the breadcrumb item we might pop, without actually making the item visible to the user\n             */\n            this.applyStylesToBreadcrumb(breadcrumbToCheck);\n\n            if (this.fitInBoundries()) {\n                /*\n                  if the width of the breadcrumb component is still smaller than the window width, including the\n                  breadcrumbToCheck, pop the latest collapsedBreadcrumbItem\n                */\n                this.popLastElement();\n                this.makeBreadcrumbVisible(breadcrumbToCheck);\n            } else {\n                /*\n                  if the width of the breadcrumb component is wider than the window after making the breadcrumbToCheck's\n                  display: 'inline-block', then put it's display back to 'none' and don't pop the collapsedBreadcrumbItem\n                 */\n                this.makeBreadcrumbInvisible(breadcrumbToCheck);\n                breakLoop = true;\n            }\n            i++;\n        }\n    }\n\n    private fitInBoundries(): boolean {\n        return this.elementRef.nativeElement.getBoundingClientRect().width < this.getContainerBoundary();\n    }\n\n    private getCollapsedItem(): BreadcrumbItemDirective {\n        return this.collapsedBreadcrumbItems[this.collapsedBreadcrumbItems.length - 1];\n    }\n\n    private getBreadcrumbToCheck(collapsedItemToPop: BreadcrumbItemDirective): BreadcrumbItemDirective {\n        return this.breadcrumbItems.filter((item) => item === collapsedItemToPop)[0];\n    }\n\n    private applyStylesToBreadcrumb(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.display = 'inline-block';\n        breadcrumb.elementRef.nativeElement.style.visibility = 'hidden';\n    }\n\n    private popLastElement(): void {\n        this.collapsedBreadcrumbItems.pop();\n        // make the breadcrumb we checked visible\n    }\n\n    private makeBreadcrumbVisible(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.visibility = 'visible';\n    }\n\n    private makeBreadcrumbInvisible(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.display = 'none';\n    }\n}\n","<fd-menu #menu [compact]=\"compact\" closeOnEscapeKey=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { RouterModule } from '@angular/router';\n\nimport { BreadcrumbComponent } from './breadcrumb.component';\nimport { BreadcrumbItemDirective } from './breadcrumb-item.directive';\nimport { BreadcrumbLinkDirective } from './breadcrumb-link.directive';\nimport { IconModule } from '@fundamental-ngx/core/icon';\nimport { PopoverModule } from '@fundamental-ngx/core/popover';\nimport { MenuModule } from '@fundamental-ngx/core/menu';\n\n@NgModule({\n    imports: [CommonModule, IconModule, PopoverModule, MenuModule, RouterModule],\n    exports: [BreadcrumbComponent, BreadcrumbItemDirective, BreadcrumbLinkDirective],\n    declarations: [BreadcrumbComponent, BreadcrumbItemDirective, BreadcrumbLinkDirective]\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-link.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb-item.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.html","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.module.ts","../../../../../libs/core/src/lib/breadcrumb/fundamental-ngx-core-breadcrumb.ts"],"sourcesContent":["import { Directive, ElementRef, Input } from '@angular/core';\n\n/**\n * Breadcrumb link directive. Use Angular router options (such as 'routerLink' and 'queryParams') with this directive.\n *\n * ```html\n * <a fd-breadcrumb-link [routerLink]=\"'some-url'\" [queryParams]=\"'params'\">Breadcrumb Link</a>\n * ```\n */\n@Directive({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: '[fd-breadcrumb-link]',\n    host: {\n        class: 'fd-breadcrumb__link'\n    }\n})\nexport class BreadcrumbLinkDirective {\n    /** @hidden */\n    @Input()\n    routerLink = '';\n\n    get elementRef(): ElementRef {\n        return this._elementRef;\n    }\n\n    constructor(private _elementRef: ElementRef) {}\n}\n","import { AfterContentInit, ContentChild, Directive, ElementRef, forwardRef } from '@angular/core';\nimport { BreadcrumbLinkDirective } from './breadcrumb-link.directive';\n\n/**\n * Breadcrumb item directive. Must have child breadcrumb link directives.\n *\n * ```html\n * <fd-breadcrumb-item>\n *     <a fd-breadcrumb-link [routerLink]=\"'#'\">Breadcrumb Link</a>\n * </fd-breadcrumb-item>\n * ```\n */\n@Directive({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: 'fd-breadcrumb-item',\n    host: {\n        class: 'fd-breadcrumb__item'\n    }\n})\nexport class BreadcrumbItemDirective implements AfterContentInit {\n    /** @hidden */\n    get elementRef(): ElementRef {\n        return this._elementRef;\n    }\n\n    /** @hidden */\n    href = '';\n\n    /** @hidden */\n    routerLink = '';\n\n    /** @hidden */\n    @ContentChild(forwardRef(() => BreadcrumbLinkDirective))\n    breadcrumbLink: BreadcrumbLinkDirective;\n\n    constructor(private _elementRef: ElementRef) {}\n\n    /** @hidden */\n    ngAfterContentInit(): void {\n        if (this.breadcrumbLink && this.breadcrumbLink.elementRef.nativeElement.getAttribute('href')) {\n            this.href = this.breadcrumbLink.elementRef.nativeElement.getAttribute('href');\n        }\n        if (this.breadcrumbLink && this.breadcrumbLink.routerLink) {\n            this.routerLink = this.breadcrumbLink.routerLink;\n        }\n    }\n}\n","import {\n    AfterContentInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    forwardRef,\n    HostListener,\n    Input,\n    OnDestroy,\n    OnInit,\n    Optional,\n    QueryList,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { BreadcrumbItemDirective } from './breadcrumb-item.directive';\nimport { RtlService } from '@fundamental-ngx/core/utils';\nimport { BehaviorSubject, Subscription } from 'rxjs';\nimport { KeyUtil } from '@fundamental-ngx/core/utils';\nimport { MenuComponent } from '@fundamental-ngx/core/menu';\nimport { ENTER, SPACE } from '@angular/cdk/keycodes';\nimport { Placement } from '@fundamental-ngx/core/shared';\nimport { ContentDensityService } from '@fundamental-ngx/core/utils';\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-breadcrumb-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 AfterContentInit, OnInit, OnDestroy {\n    /** Whenever links wrapped inside overflow should be displayed in compact mode  */\n    @Input()\n    compact?: boolean;\n\n    /** @hidden */\n    @ContentChildren(forwardRef(() => BreadcrumbItemDirective))\n    breadcrumbItems: QueryList<BreadcrumbItemDirective>;\n\n    /** @hidden */\n    @ViewChild(MenuComponent)\n    menuComponent: MenuComponent;\n\n    /** @hidden */\n    collapsedBreadcrumbItems: Array<BreadcrumbItemDirective> = [];\n\n    /** @hidden used to compare to the current width to know whether to collapse or expand breadcrumbs */\n    previousContainerWidth: number;\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 or not 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    constructor(\n        public elementRef: ElementRef,\n        @Optional() private _rtlService: RtlService,\n        @Optional() private _contentDensityService: ContentDensityService,\n        private _cdRef: ChangeDetectorRef\n    ) {}\n\n    /** @hidden */\n    ngAfterContentInit(): void {\n        this.onResize();\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        if (this.compact === undefined && this._contentDensityService) {\n            this._subscriptions.add(\n                this._contentDensityService._isCompactDensity.subscribe((isCompact) => {\n                    this.compact = isCompact;\n                    this._cdRef.markForCheck();\n                })\n            );\n        }\n    }\n\n    /** @hidden */\n    ngOnDestroy(): void {\n        this._subscriptions.unsubscribe();\n    }\n\n    /** @hidden */\n    @HostListener('window:resize', [])\n    onResize(): void {\n        if (!this.elementRef.nativeElement.parentElement) {\n            return;\n        }\n        this.containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n        if (this.containerElement) {\n            this.containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n        /*\n            if this is the first load and there is no previousContainerWidth,\n            or the container boundary is smaller than the previousContainerWidth\n         */\n        if (!this.previousContainerWidth || this.containerBoundary < this.previousContainerWidth) {\n            // and the breadcrumbs extend past the window\n            if (this.elementRef.nativeElement.getBoundingClientRect().width > this.containerBoundary) {\n                this.collapseBreadcrumbs();\n            }\n        } else if (this.collapsedBreadcrumbItems.length) {\n            // if the screen is getting bigger and there are collapsed breadcrumbs\n            this.expandBreadcrumbs();\n        }\n        this.previousContainerWidth = this.containerBoundary;\n        this._cdRef.detectChanges();\n    }\n\n    /** @hidden */\n    keyDownHandle(event: KeyboardEvent): void {\n        if (KeyUtil.isKeyCode(event, [ENTER, SPACE])) {\n            this.menuComponent.toggle();\n            event.preventDefault();\n        }\n    }\n\n    /** @hidden */\n    getContainerBoundary(): number {\n        let containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n        if (this.containerElement) {\n            containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n\n        return containerBoundary;\n    }\n\n    /**\n     * @hidden\n     *\n     * This function moves breadcrumbs from the original QueryList of BreadCrumbItemDirectives into the array of\n     * collapsedBreadcrumbItems.\n     * */\n    collapseBreadcrumbs(): void {\n        let i = 0;\n        const containerBoundary = this.getContainerBoundary();\n        // move the breadcrumb items into a collapsed menu one by one, until the last one is inside the window\n        while (\n            this.elementRef.nativeElement.getBoundingClientRect().width > containerBoundary &&\n            i < this.breadcrumbItems.length\n        ) {\n            const breadcrumbItem = this.breadcrumbItems.filter((item, index) => index === i)[0];\n            if (this.collapsedBreadcrumbItems.indexOf(breadcrumbItem) === -1) {\n                this.reverse\n                    ? this.collapsedBreadcrumbItems.push(breadcrumbItem)\n                    : this.collapsedBreadcrumbItems.unshift(breadcrumbItem);\n            }\n            // hide the original breadcrumb items that have been moved in to the collapsed menu\n            breadcrumbItem.elementRef.nativeElement.style.display = 'none';\n            i++;\n        }\n    }\n\n    /**\n     * @hidden\n     *\n     * This function removes breadcrumb items from the collapsedBreadcrumbItems array and makes them visible again in the\n     * original QueryList of BreadcrumbItemDirectives.\n     * */\n    expandBreadcrumbs(): void {\n        let breakLoop = false;\n        let i = 0;\n        const originalCollapsedLength = this.collapsedBreadcrumbItems.length;\n        while (this.fitInBoundries() && !breakLoop && i < originalCollapsedLength) {\n            // get the most recently collapsed breadcrumb\n            const collapsedItemToPop = this.getCollapsedItem();\n            // find the corresponding breadcrumb from the original breadcrumb item QueryList\n            const breadcrumbToCheck = this.getBreadcrumbToCheck(collapsedItemToPop);\n            /*\n              set display: 'inline-block' and visibility: 'hidden' - this way, the parent breadcrumb component's width will\n              contain the width of the breadcrumb item we might pop, without actually making the item visible to the user\n             */\n            this.applyStylesToBreadcrumb(breadcrumbToCheck);\n\n            if (this.fitInBoundries()) {\n                /*\n                  if the width of the breadcrumb component is still smaller than the window width, including the\n                  breadcrumbToCheck, pop the latest collapsedBreadcrumbItem\n                */\n                this.popLastElement();\n                this.makeBreadcrumbVisible(breadcrumbToCheck);\n            } else {\n                /*\n                  if the width of the breadcrumb component is wider than the window after making the breadcrumbToCheck's\n                  display: 'inline-block', then put it's display back to 'none' and don't pop the collapsedBreadcrumbItem\n                 */\n                this.makeBreadcrumbInvisible(breadcrumbToCheck);\n                breakLoop = true;\n            }\n            i++;\n        }\n    }\n\n    private fitInBoundries(): boolean {\n        return this.elementRef.nativeElement.getBoundingClientRect().width < this.getContainerBoundary();\n    }\n\n    private getCollapsedItem(): BreadcrumbItemDirective {\n        return this.collapsedBreadcrumbItems[this.collapsedBreadcrumbItems.length - 1];\n    }\n\n    private getBreadcrumbToCheck(collapsedItemToPop: BreadcrumbItemDirective): BreadcrumbItemDirective {\n        return this.breadcrumbItems.filter((item) => item === collapsedItemToPop)[0];\n    }\n\n    private applyStylesToBreadcrumb(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.display = 'inline-block';\n        breadcrumb.elementRef.nativeElement.style.visibility = 'hidden';\n    }\n\n    private popLastElement(): void {\n        this.collapsedBreadcrumbItems.pop();\n        // make the breadcrumb we checked visible\n    }\n\n    private makeBreadcrumbVisible(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.visibility = 'visible';\n    }\n\n    private makeBreadcrumbInvisible(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.display = 'none';\n    }\n}\n","<fd-menu #menu [compact]=\"compact\" [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { RouterModule } from '@angular/router';\n\nimport { BreadcrumbComponent } from './breadcrumb.component';\nimport { BreadcrumbItemDirective } from './breadcrumb-item.directive';\nimport { BreadcrumbLinkDirective } from './breadcrumb-link.directive';\nimport { IconModule } from '@fundamental-ngx/core/icon';\nimport { PopoverModule } from '@fundamental-ngx/core/popover';\nimport { MenuModule } from '@fundamental-ngx/core/menu';\n\n@NgModule({\n    imports: [CommonModule, IconModule, PopoverModule, MenuModule, RouterModule],\n    exports: [BreadcrumbComponent, BreadcrumbItemDirective, BreadcrumbLinkDirective],\n    declarations: [BreadcrumbComponent, BreadcrumbItemDirective, BreadcrumbLinkDirective]\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

@@ -115,6 +115,8 @@ class BreadcrumbComponent {
         this.collapsedBreadcrumbItems = [];
         /** @hidden */
         this.placement$ = new BehaviorSubject('bottom-start');
+        /** Whether or not to append items to the overflow dropdown in reverse order. Default is true. */
+        this.reverse = false;
         /** @hidden */
         this._subscriptions = new Subscription();
     }
@@ -193,7 +195,9 @@ class BreadcrumbComponent {
             i < this.breadcrumbItems.length) {
             const breadcrumbItem = this.breadcrumbItems.filter((item, index) => index === i)[0];
             if (this.collapsedBreadcrumbItems.indexOf(breadcrumbItem) === -1) {
-                this.collapsedBreadcrumbItems.push(breadcrumbItem);
+                this.reverse
+                    ? this.collapsedBreadcrumbItems.push(breadcrumbItem)
+                    : this.collapsedBreadcrumbItems.unshift(breadcrumbItem);
             }
             // hide the original breadcrumb items that have been moved in to the collapsed menu
             breadcrumbItem.elementRef.nativeElement.style.display = 'none';
@@ -264,12 +268,12 @@ class BreadcrumbComponent {
     }
 }
 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: i1.ContentDensityService, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbComponent, selector: "fd-breadcrumb", inputs: { compact: "compact", containerElement: "containerElement" }, host: { listeners: { "window:resize": "onResize()" }, classAttribute: "fd-breadcrumb" }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(function () { return BreadcrumbItemDirective; }) }], viewQueries: [{ propertyName: "menuComponent", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "<fd-menu #menu [compact]=\"compact\" closeOnEscapeKey=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\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:after,.fd-breadcrumb:before{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:after,.fd-breadcrumb__item:before{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__link{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(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);line-height:inherit;display:inline-block;transition:all 125ms ease-in}.fd-breadcrumb__link:after,.fd-breadcrumb__link:before{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__link--emphasized{font-weight:700}.fd-breadcrumb__link:visited{color:var(--sapLink_Visited_Color)}.fd-breadcrumb__link.is-hover,.fd-breadcrumb__link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-focus,.fd-breadcrumb__link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-active,.fd-breadcrumb__link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-breadcrumb__link--inverted.is-hover,.fd-breadcrumb__link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-breadcrumb__link--inverted.is-focus,.fd-breadcrumb__link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-breadcrumb__link--subtle{color:var(--sapLink_SubtleColor)}.fd-breadcrumb__link.is-disabled,.fd-breadcrumb__link:disabled,.fd-breadcrumb__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-breadcrumb__link>img{vertical-align:bottom}.fd-breadcrumb__link:focus .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:active .fd-breadcrumb__dropdown-icon,.fd-breadcrumb__link:active:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Hover_Color)}.fd-breadcrumb__dropdown-icon [class*=sap-icon],.fd-breadcrumb__dropdown-icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;text-decoration:inherit;color:var(--sapLinkColor)}.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", "compact", "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"] }], directives: [{ type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { type: i2.MenuTitleDirective, selector: "[fd-menu-title]" }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BreadcrumbItemDirective, selector: "fd-breadcrumb-item" }, { type: i2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { type: BreadcrumbLinkDirective, selector: "[fd-breadcrumb-link]", inputs: ["routerLink"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: BreadcrumbComponent, selector: "fd-breadcrumb", inputs: { compact: "compact", containerElement: "containerElement", reverse: "reverse" }, host: { listeners: { "window:resize": "onResize()" }, classAttribute: "fd-breadcrumb" }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(function () { return BreadcrumbItemDirective; }) }], viewQueries: [{ propertyName: "menuComponent", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "<fd-menu #menu [compact]=\"compact\" [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\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:after,.fd-breadcrumb:before{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:after,.fd-breadcrumb__item:before{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__link{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(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);line-height:inherit;display:inline-block;transition:all 125ms ease-in}.fd-breadcrumb__link:after,.fd-breadcrumb__link:before{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__link--emphasized{font-weight:700}.fd-breadcrumb__link:visited{color:var(--sapLink_Visited_Color)}.fd-breadcrumb__link.is-hover,.fd-breadcrumb__link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-focus,.fd-breadcrumb__link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-active,.fd-breadcrumb__link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-breadcrumb__link--inverted.is-hover,.fd-breadcrumb__link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-breadcrumb__link--inverted.is-focus,.fd-breadcrumb__link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-breadcrumb__link--subtle{color:var(--sapLink_SubtleColor)}.fd-breadcrumb__link.is-disabled,.fd-breadcrumb__link:disabled,.fd-breadcrumb__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-breadcrumb__link>img{vertical-align:bottom}.fd-breadcrumb__link:focus .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:active .fd-breadcrumb__dropdown-icon,.fd-breadcrumb__link:active:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Hover_Color)}.fd-breadcrumb__dropdown-icon [class*=sap-icon],.fd-breadcrumb__dropdown-icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;text-decoration:inherit;color:var(--sapLinkColor)}.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", "compact", "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"] }], directives: [{ type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { type: i2.MenuTitleDirective, selector: "[fd-menu-title]" }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BreadcrumbItemDirective, selector: "fd-breadcrumb-item" }, { type: i2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { type: BreadcrumbLinkDirective, selector: "[fd-breadcrumb-link]", inputs: ["routerLink"] }], pipes: { "async": i3.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 [compact]=\"compact\" closeOnEscapeKey=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\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:after,.fd-breadcrumb:before{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:after,.fd-breadcrumb__item:before{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__link{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(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);line-height:inherit;display:inline-block;transition:all 125ms ease-in}.fd-breadcrumb__link:after,.fd-breadcrumb__link:before{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__link--emphasized{font-weight:700}.fd-breadcrumb__link:visited{color:var(--sapLink_Visited_Color)}.fd-breadcrumb__link.is-hover,.fd-breadcrumb__link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-focus,.fd-breadcrumb__link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-active,.fd-breadcrumb__link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-breadcrumb__link--inverted.is-hover,.fd-breadcrumb__link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-breadcrumb__link--inverted.is-focus,.fd-breadcrumb__link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-breadcrumb__link--subtle{color:var(--sapLink_SubtleColor)}.fd-breadcrumb__link.is-disabled,.fd-breadcrumb__link:disabled,.fd-breadcrumb__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-breadcrumb__link>img{vertical-align:bottom}.fd-breadcrumb__link:focus .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:active .fd-breadcrumb__dropdown-icon,.fd-breadcrumb__link:active:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Hover_Color)}.fd-breadcrumb__dropdown-icon [class*=sap-icon],.fd-breadcrumb__dropdown-icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;text-decoration:inherit;color:var(--sapLinkColor)}.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 [compact]=\"compact\" [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\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:after,.fd-breadcrumb:before{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:after,.fd-breadcrumb__item:before{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__link{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(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);line-height:inherit;display:inline-block;transition:all 125ms ease-in}.fd-breadcrumb__link:after,.fd-breadcrumb__link:before{box-sizing:inherit;font-size:inherit}.fd-breadcrumb__link--emphasized{font-weight:700}.fd-breadcrumb__link:visited{color:var(--sapLink_Visited_Color)}.fd-breadcrumb__link.is-hover,.fd-breadcrumb__link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-focus,.fd-breadcrumb__link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link.is-active,.fd-breadcrumb__link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-breadcrumb__link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-breadcrumb__link--inverted.is-hover,.fd-breadcrumb__link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-breadcrumb__link--inverted.is-focus,.fd-breadcrumb__link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-breadcrumb__link--subtle{color:var(--sapLink_SubtleColor)}.fd-breadcrumb__link.is-disabled,.fd-breadcrumb__link:disabled,.fd-breadcrumb__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-breadcrumb__link>img{vertical-align:bottom}.fd-breadcrumb__link:focus .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:active .fd-breadcrumb__dropdown-icon,.fd-breadcrumb__link:active:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Active_Color)}.fd-breadcrumb__link:hover .fd-breadcrumb__dropdown-icon{color:var(--sapLink_Hover_Color)}.fd-breadcrumb__dropdown-icon [class*=sap-icon],.fd-breadcrumb__dropdown-icon[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;text-decoration:inherit;color:var(--sapLinkColor)}.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: i1.ContentDensityService, decorators: [{
@@ -284,6 +288,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
                 args: [MenuComponent]
             }], containerElement: [{
                 type: Input
+            }], reverse: [{
+                type: Input
             }], onResize: [{
                 type: HostListener,
                 args: ['window:resize', []]

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

@@ -1 +1 @@
-{"version":3,"file":"fundamental-ngx-core-breadcrumb.mjs","sources":["../../../../../libs/core/src/lib/breadcrumb/breadcrumb-link.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb-item.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.html","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.module.ts","../../../../../libs/core/src/lib/breadcrumb/fundamental-ngx-core-breadcrumb.ts"],"sourcesContent":["import { Directive, ElementRef, Input } from '@angular/core';\n\n/**\n * Breadcrumb link directive. Use Angular router options (such as 'routerLink' and 'queryParams') with this directive.\n *\n * ```html\n * <a fd-breadcrumb-link [routerLink]=\"'some-url'\" [queryParams]=\"'params'\">Breadcrumb Link</a>\n * ```\n */\n@Directive({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: '[fd-breadcrumb-link]',\n    host: {\n        class: 'fd-breadcrumb__link'\n    }\n})\nexport class BreadcrumbLinkDirective {\n    /** @hidden */\n    @Input()\n    routerLink = '';\n\n    get elementRef(): ElementRef {\n        return this._elementRef;\n    }\n\n    constructor(private _elementRef: ElementRef) {}\n}\n","import { AfterContentInit, ContentChild, Directive, ElementRef, forwardRef } from '@angular/core';\nimport { BreadcrumbLinkDirective } from './breadcrumb-link.directive';\n\n/**\n * Breadcrumb item directive. Must have child breadcrumb link directives.\n *\n * ```html\n * <fd-breadcrumb-item>\n *     <a fd-breadcrumb-link [routerLink]=\"'#'\">Breadcrumb Link</a>\n * </fd-breadcrumb-item>\n * ```\n */\n@Directive({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: 'fd-breadcrumb-item',\n    host: {\n        class: 'fd-breadcrumb__item'\n    }\n})\nexport class BreadcrumbItemDirective implements AfterContentInit {\n    /** @hidden */\n    get elementRef(): ElementRef {\n        return this._elementRef;\n    }\n\n    /** @hidden */\n    href = '';\n\n    /** @hidden */\n    routerLink = '';\n\n    /** @hidden */\n    @ContentChild(forwardRef(() => BreadcrumbLinkDirective))\n    breadcrumbLink: BreadcrumbLinkDirective;\n\n    constructor(private _elementRef: ElementRef) {}\n\n    /** @hidden */\n    ngAfterContentInit(): void {\n        if (this.breadcrumbLink && this.breadcrumbLink.elementRef.nativeElement.getAttribute('href')) {\n            this.href = this.breadcrumbLink.elementRef.nativeElement.getAttribute('href');\n        }\n        if (this.breadcrumbLink && this.breadcrumbLink.routerLink) {\n            this.routerLink = this.breadcrumbLink.routerLink;\n        }\n    }\n}\n","import {\n    AfterContentInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    forwardRef,\n    HostListener,\n    Input,\n    OnDestroy,\n    OnInit,\n    Optional,\n    QueryList,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { BreadcrumbItemDirective } from './breadcrumb-item.directive';\nimport { RtlService } from '@fundamental-ngx/core/utils';\nimport { BehaviorSubject, Subscription } from 'rxjs';\nimport { KeyUtil } from '@fundamental-ngx/core/utils';\nimport { MenuComponent } from '@fundamental-ngx/core/menu';\nimport { ENTER, SPACE } from '@angular/cdk/keycodes';\nimport { Placement } from '@fundamental-ngx/core/shared';\nimport { ContentDensityService } from '@fundamental-ngx/core/utils';\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-breadcrumb-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 AfterContentInit, OnInit, OnDestroy {\n    /** Whenever links wrapped inside overflow should be displayed in compact mode  */\n    @Input()\n    compact?: boolean;\n\n    /** @hidden */\n    @ContentChildren(forwardRef(() => BreadcrumbItemDirective))\n    breadcrumbItems: QueryList<BreadcrumbItemDirective>;\n\n    /** @hidden */\n    @ViewChild(MenuComponent)\n    menuComponent: MenuComponent;\n\n    /** @hidden */\n    collapsedBreadcrumbItems: Array<BreadcrumbItemDirective> = [];\n\n    /** @hidden used to compare to the current width to know whether to collapse or expand breadcrumbs */\n    previousContainerWidth: number;\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    /** @hidden */\n    containerBoundary: number;\n\n    /** @hidden */\n    private _subscriptions = new Subscription();\n\n    constructor(\n        public elementRef: ElementRef,\n        @Optional() private _rtlService: RtlService,\n        @Optional() private _contentDensityService: ContentDensityService,\n        private _cdRef: ChangeDetectorRef\n    ) {}\n\n    /** @hidden */\n    ngAfterContentInit(): void {\n        this.onResize();\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        if (this.compact === undefined && this._contentDensityService) {\n            this._subscriptions.add(\n                this._contentDensityService._isCompactDensity.subscribe((isCompact) => {\n                    this.compact = isCompact;\n                    this._cdRef.markForCheck();\n                })\n            );\n        }\n    }\n\n    /** @hidden */\n    ngOnDestroy(): void {\n        this._subscriptions.unsubscribe();\n    }\n\n    /** @hidden */\n    @HostListener('window:resize', [])\n    onResize(): void {\n        if (!this.elementRef.nativeElement.parentElement) {\n            return;\n        }\n        this.containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n        if (this.containerElement) {\n            this.containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n        /*\n            if this is the first load and there is no previousContainerWidth,\n            or the container boundary is smaller than the previousContainerWidth\n         */\n        if (!this.previousContainerWidth || this.containerBoundary < this.previousContainerWidth) {\n            // and the breadcrumbs extend past the window\n            if (this.elementRef.nativeElement.getBoundingClientRect().width > this.containerBoundary) {\n                this.collapseBreadcrumbs();\n            }\n        } else if (this.collapsedBreadcrumbItems.length) {\n            // if the screen is getting bigger and there are collapsed breadcrumbs\n            this.expandBreadcrumbs();\n        }\n        this.previousContainerWidth = this.containerBoundary;\n        this._cdRef.detectChanges();\n    }\n\n    /** @hidden */\n    keyDownHandle(event: KeyboardEvent): void {\n        if (KeyUtil.isKeyCode(event, [ENTER, SPACE])) {\n            this.menuComponent.toggle();\n            event.preventDefault();\n        }\n    }\n\n    /** @hidden */\n    getContainerBoundary(): number {\n        let containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n        if (this.containerElement) {\n            containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n\n        return containerBoundary;\n    }\n\n    /**\n     * @hidden\n     *\n     * This function moves breadcrumbs from the original QueryList of BreadCrumbItemDirectives into the array of\n     * collapsedBreadcrumbItems.\n     * */\n    collapseBreadcrumbs(): void {\n        let i = 0;\n        const containerBoundary = this.getContainerBoundary();\n        // move the breadcrumb items into a collapsed menu one by one, until the last one is inside the window\n        while (\n            this.elementRef.nativeElement.getBoundingClientRect().width > containerBoundary &&\n            i < this.breadcrumbItems.length\n        ) {\n            const breadcrumbItem = this.breadcrumbItems.filter((item, index) => index === i)[0];\n            if (this.collapsedBreadcrumbItems.indexOf(breadcrumbItem) === -1) {\n                this.collapsedBreadcrumbItems.push(breadcrumbItem);\n            }\n            // hide the original breadcrumb items that have been moved in to the collapsed menu\n            breadcrumbItem.elementRef.nativeElement.style.display = 'none';\n            i++;\n        }\n    }\n\n    /**\n     * @hidden\n     *\n     * This function removes breadcrumb items from the collapsedBreadcrumbItems array and makes them visible again in the\n     * original QueryList of BreadcrumbItemDirectives.\n     * */\n    expandBreadcrumbs(): void {\n        let breakLoop = false;\n        let i = 0;\n        const originalCollapsedLength = this.collapsedBreadcrumbItems.length;\n        while (this.fitInBoundries() && !breakLoop && i < originalCollapsedLength) {\n            // get the most recently collapsed breadcrumb\n            const collapsedItemToPop = this.getCollapsedItem();\n            // find the corresponding breadcrumb from the original breadcrumb item QueryList\n            const breadcrumbToCheck = this.getBreadcrumbToCheck(collapsedItemToPop);\n            /*\n              set display: 'inline-block' and visibility: 'hidden' - this way, the parent breadcrumb component's width will\n              contain the width of the breadcrumb item we might pop, without actually making the item visible to the user\n             */\n            this.applyStylesToBreadcrumb(breadcrumbToCheck);\n\n            if (this.fitInBoundries()) {\n                /*\n                  if the width of the breadcrumb component is still smaller than the window width, including the\n                  breadcrumbToCheck, pop the latest collapsedBreadcrumbItem\n                */\n                this.popLastElement();\n                this.makeBreadcrumbVisible(breadcrumbToCheck);\n            } else {\n                /*\n                  if the width of the breadcrumb component is wider than the window after making the breadcrumbToCheck's\n                  display: 'inline-block', then put it's display back to 'none' and don't pop the collapsedBreadcrumbItem\n                 */\n                this.makeBreadcrumbInvisible(breadcrumbToCheck);\n                breakLoop = true;\n            }\n            i++;\n        }\n    }\n\n    private fitInBoundries(): boolean {\n        return this.elementRef.nativeElement.getBoundingClientRect().width < this.getContainerBoundary();\n    }\n\n    private getCollapsedItem(): BreadcrumbItemDirective {\n        return this.collapsedBreadcrumbItems[this.collapsedBreadcrumbItems.length - 1];\n    }\n\n    private getBreadcrumbToCheck(collapsedItemToPop: BreadcrumbItemDirective): BreadcrumbItemDirective {\n        return this.breadcrumbItems.filter((item) => item === collapsedItemToPop)[0];\n    }\n\n    private applyStylesToBreadcrumb(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.display = 'inline-block';\n        breadcrumb.elementRef.nativeElement.style.visibility = 'hidden';\n    }\n\n    private popLastElement(): void {\n        this.collapsedBreadcrumbItems.pop();\n        // make the breadcrumb we checked visible\n    }\n\n    private makeBreadcrumbVisible(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.visibility = 'visible';\n    }\n\n    private makeBreadcrumbInvisible(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.display = 'none';\n    }\n}\n","<fd-menu #menu [compact]=\"compact\" closeOnEscapeKey=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { RouterModule } from '@angular/router';\n\nimport { BreadcrumbComponent } from './breadcrumb.component';\nimport { BreadcrumbItemDirective } from './breadcrumb-item.directive';\nimport { BreadcrumbLinkDirective } from './breadcrumb-link.directive';\nimport { IconModule } from '@fundamental-ngx/core/icon';\nimport { PopoverModule } from '@fundamental-ngx/core/popover';\nimport { MenuModule } from '@fundamental-ngx/core/menu';\n\n@NgModule({\n    imports: [CommonModule, IconModule, PopoverModule, MenuModule, RouterModule],\n    exports: [BreadcrumbComponent, BreadcrumbItemDirective, BreadcrumbLinkDirective],\n    declarations: [BreadcrumbComponent, BreadcrumbItemDirective, BreadcrumbLinkDirective]\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-link.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb-item.directive.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.ts","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.component.html","../../../../../libs/core/src/lib/breadcrumb/breadcrumb.module.ts","../../../../../libs/core/src/lib/breadcrumb/fundamental-ngx-core-breadcrumb.ts"],"sourcesContent":["import { Directive, ElementRef, Input } from '@angular/core';\n\n/**\n * Breadcrumb link directive. Use Angular router options (such as 'routerLink' and 'queryParams') with this directive.\n *\n * ```html\n * <a fd-breadcrumb-link [routerLink]=\"'some-url'\" [queryParams]=\"'params'\">Breadcrumb Link</a>\n * ```\n */\n@Directive({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: '[fd-breadcrumb-link]',\n    host: {\n        class: 'fd-breadcrumb__link'\n    }\n})\nexport class BreadcrumbLinkDirective {\n    /** @hidden */\n    @Input()\n    routerLink = '';\n\n    get elementRef(): ElementRef {\n        return this._elementRef;\n    }\n\n    constructor(private _elementRef: ElementRef) {}\n}\n","import { AfterContentInit, ContentChild, Directive, ElementRef, forwardRef } from '@angular/core';\nimport { BreadcrumbLinkDirective } from './breadcrumb-link.directive';\n\n/**\n * Breadcrumb item directive. Must have child breadcrumb link directives.\n *\n * ```html\n * <fd-breadcrumb-item>\n *     <a fd-breadcrumb-link [routerLink]=\"'#'\">Breadcrumb Link</a>\n * </fd-breadcrumb-item>\n * ```\n */\n@Directive({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/directive-selector\n    selector: 'fd-breadcrumb-item',\n    host: {\n        class: 'fd-breadcrumb__item'\n    }\n})\nexport class BreadcrumbItemDirective implements AfterContentInit {\n    /** @hidden */\n    get elementRef(): ElementRef {\n        return this._elementRef;\n    }\n\n    /** @hidden */\n    href = '';\n\n    /** @hidden */\n    routerLink = '';\n\n    /** @hidden */\n    @ContentChild(forwardRef(() => BreadcrumbLinkDirective))\n    breadcrumbLink: BreadcrumbLinkDirective;\n\n    constructor(private _elementRef: ElementRef) {}\n\n    /** @hidden */\n    ngAfterContentInit(): void {\n        if (this.breadcrumbLink && this.breadcrumbLink.elementRef.nativeElement.getAttribute('href')) {\n            this.href = this.breadcrumbLink.elementRef.nativeElement.getAttribute('href');\n        }\n        if (this.breadcrumbLink && this.breadcrumbLink.routerLink) {\n            this.routerLink = this.breadcrumbLink.routerLink;\n        }\n    }\n}\n","import {\n    AfterContentInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    forwardRef,\n    HostListener,\n    Input,\n    OnDestroy,\n    OnInit,\n    Optional,\n    QueryList,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { BreadcrumbItemDirective } from './breadcrumb-item.directive';\nimport { RtlService } from '@fundamental-ngx/core/utils';\nimport { BehaviorSubject, Subscription } from 'rxjs';\nimport { KeyUtil } from '@fundamental-ngx/core/utils';\nimport { MenuComponent } from '@fundamental-ngx/core/menu';\nimport { ENTER, SPACE } from '@angular/cdk/keycodes';\nimport { Placement } from '@fundamental-ngx/core/shared';\nimport { ContentDensityService } from '@fundamental-ngx/core/utils';\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-breadcrumb-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 AfterContentInit, OnInit, OnDestroy {\n    /** Whenever links wrapped inside overflow should be displayed in compact mode  */\n    @Input()\n    compact?: boolean;\n\n    /** @hidden */\n    @ContentChildren(forwardRef(() => BreadcrumbItemDirective))\n    breadcrumbItems: QueryList<BreadcrumbItemDirective>;\n\n    /** @hidden */\n    @ViewChild(MenuComponent)\n    menuComponent: MenuComponent;\n\n    /** @hidden */\n    collapsedBreadcrumbItems: Array<BreadcrumbItemDirective> = [];\n\n    /** @hidden used to compare to the current width to know whether to collapse or expand breadcrumbs */\n    previousContainerWidth: number;\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 or not 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    constructor(\n        public elementRef: ElementRef,\n        @Optional() private _rtlService: RtlService,\n        @Optional() private _contentDensityService: ContentDensityService,\n        private _cdRef: ChangeDetectorRef\n    ) {}\n\n    /** @hidden */\n    ngAfterContentInit(): void {\n        this.onResize();\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        if (this.compact === undefined && this._contentDensityService) {\n            this._subscriptions.add(\n                this._contentDensityService._isCompactDensity.subscribe((isCompact) => {\n                    this.compact = isCompact;\n                    this._cdRef.markForCheck();\n                })\n            );\n        }\n    }\n\n    /** @hidden */\n    ngOnDestroy(): void {\n        this._subscriptions.unsubscribe();\n    }\n\n    /** @hidden */\n    @HostListener('window:resize', [])\n    onResize(): void {\n        if (!this.elementRef.nativeElement.parentElement) {\n            return;\n        }\n        this.containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n        if (this.containerElement) {\n            this.containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n        /*\n            if this is the first load and there is no previousContainerWidth,\n            or the container boundary is smaller than the previousContainerWidth\n         */\n        if (!this.previousContainerWidth || this.containerBoundary < this.previousContainerWidth) {\n            // and the breadcrumbs extend past the window\n            if (this.elementRef.nativeElement.getBoundingClientRect().width > this.containerBoundary) {\n                this.collapseBreadcrumbs();\n            }\n        } else if (this.collapsedBreadcrumbItems.length) {\n            // if the screen is getting bigger and there are collapsed breadcrumbs\n            this.expandBreadcrumbs();\n        }\n        this.previousContainerWidth = this.containerBoundary;\n        this._cdRef.detectChanges();\n    }\n\n    /** @hidden */\n    keyDownHandle(event: KeyboardEvent): void {\n        if (KeyUtil.isKeyCode(event, [ENTER, SPACE])) {\n            this.menuComponent.toggle();\n            event.preventDefault();\n        }\n    }\n\n    /** @hidden */\n    getContainerBoundary(): number {\n        let containerBoundary = this.elementRef.nativeElement.parentElement.getBoundingClientRect().width;\n        if (this.containerElement) {\n            containerBoundary = this.containerElement.getBoundingClientRect().width;\n        }\n\n        return containerBoundary;\n    }\n\n    /**\n     * @hidden\n     *\n     * This function moves breadcrumbs from the original QueryList of BreadCrumbItemDirectives into the array of\n     * collapsedBreadcrumbItems.\n     * */\n    collapseBreadcrumbs(): void {\n        let i = 0;\n        const containerBoundary = this.getContainerBoundary();\n        // move the breadcrumb items into a collapsed menu one by one, until the last one is inside the window\n        while (\n            this.elementRef.nativeElement.getBoundingClientRect().width > containerBoundary &&\n            i < this.breadcrumbItems.length\n        ) {\n            const breadcrumbItem = this.breadcrumbItems.filter((item, index) => index === i)[0];\n            if (this.collapsedBreadcrumbItems.indexOf(breadcrumbItem) === -1) {\n                this.reverse\n                    ? this.collapsedBreadcrumbItems.push(breadcrumbItem)\n                    : this.collapsedBreadcrumbItems.unshift(breadcrumbItem);\n            }\n            // hide the original breadcrumb items that have been moved in to the collapsed menu\n            breadcrumbItem.elementRef.nativeElement.style.display = 'none';\n            i++;\n        }\n    }\n\n    /**\n     * @hidden\n     *\n     * This function removes breadcrumb items from the collapsedBreadcrumbItems array and makes them visible again in the\n     * original QueryList of BreadcrumbItemDirectives.\n     * */\n    expandBreadcrumbs(): void {\n        let breakLoop = false;\n        let i = 0;\n        const originalCollapsedLength = this.collapsedBreadcrumbItems.length;\n        while (this.fitInBoundries() && !breakLoop && i < originalCollapsedLength) {\n            // get the most recently collapsed breadcrumb\n            const collapsedItemToPop = this.getCollapsedItem();\n            // find the corresponding breadcrumb from the original breadcrumb item QueryList\n            const breadcrumbToCheck = this.getBreadcrumbToCheck(collapsedItemToPop);\n            /*\n              set display: 'inline-block' and visibility: 'hidden' - this way, the parent breadcrumb component's width will\n              contain the width of the breadcrumb item we might pop, without actually making the item visible to the user\n             */\n            this.applyStylesToBreadcrumb(breadcrumbToCheck);\n\n            if (this.fitInBoundries()) {\n                /*\n                  if the width of the breadcrumb component is still smaller than the window width, including the\n                  breadcrumbToCheck, pop the latest collapsedBreadcrumbItem\n                */\n                this.popLastElement();\n                this.makeBreadcrumbVisible(breadcrumbToCheck);\n            } else {\n                /*\n                  if the width of the breadcrumb component is wider than the window after making the breadcrumbToCheck's\n                  display: 'inline-block', then put it's display back to 'none' and don't pop the collapsedBreadcrumbItem\n                 */\n                this.makeBreadcrumbInvisible(breadcrumbToCheck);\n                breakLoop = true;\n            }\n            i++;\n        }\n    }\n\n    private fitInBoundries(): boolean {\n        return this.elementRef.nativeElement.getBoundingClientRect().width < this.getContainerBoundary();\n    }\n\n    private getCollapsedItem(): BreadcrumbItemDirective {\n        return this.collapsedBreadcrumbItems[this.collapsedBreadcrumbItems.length - 1];\n    }\n\n    private getBreadcrumbToCheck(collapsedItemToPop: BreadcrumbItemDirective): BreadcrumbItemDirective {\n        return this.breadcrumbItems.filter((item) => item === collapsedItemToPop)[0];\n    }\n\n    private applyStylesToBreadcrumb(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.display = 'inline-block';\n        breadcrumb.elementRef.nativeElement.style.visibility = 'hidden';\n    }\n\n    private popLastElement(): void {\n        this.collapsedBreadcrumbItems.pop();\n        // make the breadcrumb we checked visible\n    }\n\n    private makeBreadcrumbVisible(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.visibility = 'visible';\n    }\n\n    private makeBreadcrumbInvisible(breadcrumb: BreadcrumbItemDirective): void {\n        breadcrumb.elementRef.nativeElement.style.display = 'none';\n    }\n}\n","<fd-menu #menu [compact]=\"compact\" [closeOnEscapeKey]=\"true\" [focusAutoCapture]=\"true\" [placement]=\"placement$ | async\">\n    <li fd-menu-item *ngFor=\"let collapsedBreadcrumbItem of collapsedBreadcrumbItems\">\n        <a\n            fd-menu-interactive\n            [attr.href]=\"collapsedBreadcrumbItem.href\"\n            [routerLink]=\"collapsedBreadcrumbItem.routerLink\"\n        >\n            <span fd-menu-title>{{ collapsedBreadcrumbItem.elementRef.nativeElement.innerText }}</span>\n        </a>\n    </li>\n</fd-menu>\n\n<fd-breadcrumb-item *ngIf=\"collapsedBreadcrumbItems.length\" [fdMenuTrigger]=\"menu\">\n    <a fd-breadcrumb-link tabindex=\"0\" class=\"fd-breadcrumb__collapsed\" (keydown)=\"keyDownHandle($event)\">\n        ...\n        <i role=\"presentation\" class=\"fd-breadcrumb__dropdown-icon sap-icon sap-icon--slim-arrow-down\"></i>\n    </a>\n</fd-breadcrumb-item>\n\n<ng-content></ng-content>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { RouterModule } from '@angular/router';\n\nimport { BreadcrumbComponent } from './breadcrumb.component';\nimport { BreadcrumbItemDirective } from './breadcrumb-item.directive';\nimport { BreadcrumbLinkDirective } from './breadcrumb-link.directive';\nimport { IconModule } from '@fundamental-ngx/core/icon';\nimport { PopoverModule } from '@fundamental-ngx/core/popover';\nimport { MenuModule } from '@fundamental-ngx/core/menu';\n\n@NgModule({\n    imports: [CommonModule, IconModule, PopoverModule, MenuModule, RouterModule],\n    exports: [BreadcrumbComponent, BreadcrumbItemDirective, BreadcrumbLinkDirective],\n    declarations: [BreadcrumbComponent, BreadcrumbItemDirective, BreadcrumbLinkDirective]\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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fundamental-ngx/core/breadcrumb",
-  "version": "0.34.3-rc.3",
+  "version": "0.34.3-rc.30",
   "peerDependencies": {
     "@angular/common": "^13.0.0",
     "@angular/core": "^13.0.0"

package/busy-indicator/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fundamental-ngx/core/busy-indicator",
-  "version": "0.34.3-rc.3",
+  "version": "0.34.3-rc.30",
   "peerDependencies": {
     "@angular/common": "^13.0.0",
     "@angular/core": "^13.0.0"

package/button/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fundamental-ngx/core/button",
-  "version": "0.34.3-rc.3",
+  "version": "0.34.3-rc.30",
   "peerDependencies": {
     "@angular/common": "^13.0.0",
     "@angular/core": "^13.0.0"

package/calendar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fundamental-ngx/core/calendar",
-  "version": "0.34.3-rc.3",
+  "version": "0.34.3-rc.30",
   "peerDependencies": {
     "@angular/common": "^13.0.0",
     "@angular/core": "^13.0.0"

package/card/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fundamental-ngx/core/card",
-  "version": "0.34.3-rc.3",
+  "version": "0.34.3-rc.30",
   "peerDependencies": {
     "@angular/common": "^13.0.0",
     "@angular/core": "^13.0.0"

package/carousel/carousel.component.d.ts

@@ -11,6 +11,10 @@ export declare enum SlideDirection {
     NEXT = 1,
     PREVIOUS = 2
 }
+export interface FittingSlidesAndWidth {
+    width: number;
+    slides: number;
+}
 declare class CarouselActiveSlides {
     readonly activeItems: CarouselItemComponent[];
     readonly slideDirection: string;
@@ -22,7 +26,7 @@ export declare class CarouselComponent implements OnInit, AfterContentInit, Afte
     private readonly _changeDetectorRef;
     private readonly _carouselService;
     private readonly _rtlService;
-    /** Id for the Carousel. */
+    /** ID for the Carousel. */
     id: string;
     /** Sets aria-label attribute for carousel */
     ariaLabel: any;
@@ -68,7 +72,8 @@ export declare class CarouselComponent implements OnInit, AfterContentInit, Afte
     /** Is carousel is vertical. Default value is false. */
     vertical: boolean;
     /** Number of items to be visible at a time */
-    visibleSlidesCount: number;
+    set visibleSlidesCount(value: number | 'auto');
+    get visibleSlidesCount(): number | 'auto';
     /** An event that is emitted after a slide transition has happened */
     readonly slideChange: EventEmitter<CarouselActiveSlides>;
     /**
@@ -108,6 +113,10 @@ export declare class CarouselComponent implements OnInit, AfterContentInit, Afte
     /** @hidden */
     get _slidesWrapperSizePx(): string;
     /** @hidden */
+    private _visibleSlidesCount;
+    /** @hidden */
+    private _visibleSlidesNumericCount;
+    /** @hidden */
     private _resourceStrings;
     /** @hidden */
     private _config;
@@ -185,7 +194,7 @@ export declare class CarouselComponent implements OnInit, AfterContentInit, Afte
     /** @hidden On Swiping of slide, manage page indicator */
     private _onSlideSwipe;
     /**
-     * @hidden Making slides visible when slides are dragged. Otherwise it looses the effect.
+     * @hidden Making slides visible when slides are dragged. Otherwise, it looses the effect.
      */
     private _onSlideDrag;
     /**
@@ -193,6 +202,14 @@ export declare class CarouselComponent implements OnInit, AfterContentInit, Afte
      * Resizes inner carousel container to fit all items in the viewport and hide those which are not fully in it.
      */
     private _resizeContentContainer;
+    /**
+     * @hidden
+     * Calculates how many slides can be shown within current carousel viewport.
+     * @returns Object containing fitting slides count and total width of those slides.
+     */
+    private _getFittingSlidesAndWidth;
+    /** @hidden */
+    private _getVisibleSlidesCount;
     static ɵfac: i0.ɵɵFactoryDeclaration<CarouselComponent, [null, null, null, null, { optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<CarouselComponent, "fd-carousel", never, { "id": "id"; "ariaLabel": "ariaLabel"; "ariaLabelledBy": "ariaLabelledBy"; "ariaDescribedBy": "ariaDescribedBy"; "pageIndicatorsOrientation": "pageIndicatorsOrientation"; "height": "height"; "width": "width"; "loop": "loop"; "leftNavigationBtnLabel": "leftNavigationBtnLabel"; "rightNavigationBtnLabel": "rightNavigationBtnLabel"; "navigation": "navigation"; "navigatorInPageIndicator": "navigatorInPageIndicator"; "numericIndicator": "numericIndicator"; "pageIndicatorContainer": "pageIndicatorContainer"; "pageIndicator": "pageIndicator"; "resourceStrings": "resourceStrings"; "slideTransitionDuration": "slideTransitionDuration"; "swipeEnabled": "swipeEnabled"; "vertical": "vertical"; "visibleSlidesCount": "visibleSlidesCount"; }, { "slideChange": "slideChange"; }, ["slides"], ["*"]>;
 }