npm - @fundamental-ngx/core - Versions diffs - 0.37.0-rc.2 → 0.37.0-rc.21 - Mend

@fundamental-ngx/core 0.37.0-rc.2 → 0.37.0-rc.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (373) hide show

package/esm2020/time-picker/time-picker.component.mjs CHANGED Viewed

@@ -399,7 +399,7 @@ TimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
         PopoverFormMessageService,
         PopoverService,
         registerFormItemControl(TimePickerComponent)
-    ], viewQueries: [{ propertyName: "child", first: true, predicate: TimeComponent, descendants: true }, { propertyName: "_inputGroupElement", first: true, predicate: ["inputGroupComponent"], descendants: true, read: ElementRef }, { propertyName: "_inputElement", first: true, predicate: InputGroupInputDirective, descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<fd-popover\n    [(isOpen)]=\"isOpen\"\n    (isOpenChange)=\"_onOpenStateChanged($event)\"\n    [triggers]=\"[]\"\n    [disabled]=\"disabled\"\n    [placement]=\"placement\"\n    [closeOnEscapeKey]=\"true\"\n    [focusAutoCapture]=\"false\"\n    [focusTrapped]=\"true\"\n>\n    <fd-popover-control>\n        <fd-input-group\n            #inputGroupComponent\n            (addOnButtonClicked)=\"_addOnButtonClicked()\"\n            [button]=\"true\"\n            [state]=\"state\"\n            [disabled]=\"disabled\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [isControl]=\"true\"\n            [isExpanded]=\"isOpen\"\n            [glyphAriaLabel]=\"timePickerButtonLabel || ('coreTimePicker.timePickerButtonLabel' | fdTranslate)\"\n            glyph=\"fob-watch\"\n        >\n            <input\n                type=\"text\"\n                class=\"fd-input\"\n                fd-input-group-input\n                [value]=\"_inputTimeValue\"\n                (focusout)=\"_timeInputChanged($any($event.currentTarget).value)\"\n                (keyup.enter)=\"_timeInputChanged($any($event.currentTarget).value)\"\n                [disabled]=\"disabled\"\n                [attr.id]=\"inputId\"\n                [placeholder]=\"_placeholder\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-label]=\"timePickerInputLabel || ('coreTimePicker.timePickerInputLabel' | fdTranslate)\"\n                [attr.aria-describedby]=\"_formValueStateMessageId\"\n                [attr.aria-required]=\"required\"\n            />\n        </fd-input-group>\n    </fd-popover-control>\n    <fd-popover-body>\n        <fd-form-message [embedded]=\"true\" *ngIf=\"_message\" [type]=\"state\">\n            {{ _message }}\n        </fd-form-message>\n        <ng-content></ng-content>\n        <fd-time\n            *ngIf=\"isOpen\"\n            [tablet]=\"tablet\"\n            [disabled]=\"disabled\"\n            [keepTwoDigits]=\"keepTwoDigitsTime\"\n            [ngModel]=\"time\"\n            (ngModelChange)=\"_timeComponentValueChanged($event)\"\n            [meridian]=\"_meridian\"\n            [displayHours]=\"_displayHours\"\n            [displayMinutes]=\"_displayMinutes\"\n            [displaySeconds]=\"_displaySeconds\"\n            [spinnerButtons]=\"spinnerButtons\"\n        ></fd-time>\n    </fd-popover-body>\n</fd-popover>\n\n<div style=\"display: none\" aria-hidden=\"true\">\n    <div [attr.id]=\"_formValueStateMessageId\" aria-atomic=\"true\" aria-live=\"assertive\">\n        <ng-container [ngSwitch]=\"state\">\n            <ng-container *ngSwitchCase=\"'success'\">{{ valueStateSuccessMessage }}</ng-container>\n            <ng-container *ngSwitchCase=\"'information'\">{{ valueStateInformationMessage }}</ng-container>\n            <ng-container *ngSwitchCase=\"'warning'\">{{ valueStateWarningMessage }}</ng-container>\n            <ng-container *ngSwitchCase=\"'error'\">{{ valueStateErrorMessage }}</ng-container>\n        </ng-container>\n        {{ _message }}\n    </div>\n</div>\n", styles: [".fd-timepicker-custom{display:inline-block}.fd-timepicker-custom fd-popover{display:block}.fd-timepicker-custom fd-time{width:auto}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i6.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["disableScrollbar"] }, { kind: "component", type: i6.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i7.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i7.InputGroupInputDirective, selector: "[fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: i8.TimeComponent, selector: "fd-time", inputs: ["meridian", "validate", "keepTwoDigits", "disabled", "displaySeconds", "displayMinutes", "displayHours", "tablet", "elementsAtOnce", "time", "spinnerButtons"] }, { kind: "component", type: i2.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "pipe", type: i9.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    ], viewQueries: [{ propertyName: "child", first: true, predicate: TimeComponent, descendants: true }, { propertyName: "_inputGroupElement", first: true, predicate: ["inputGroupComponent"], descendants: true, read: ElementRef }, { propertyName: "_inputElement", first: true, predicate: InputGroupInputDirective, descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<fd-popover\n    [(isOpen)]=\"isOpen\"\n    (isOpenChange)=\"_onOpenStateChanged($event)\"\n    [triggers]=\"[]\"\n    [disabled]=\"disabled\"\n    [placement]=\"placement\"\n    [closeOnEscapeKey]=\"true\"\n    [focusAutoCapture]=\"false\"\n    [focusTrapped]=\"true\"\n>\n    <fd-popover-control>\n        <fd-input-group\n            #inputGroupComponent\n            (addOnButtonClicked)=\"_addOnButtonClicked()\"\n            [button]=\"true\"\n            [state]=\"state\"\n            [disabled]=\"disabled\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [isControl]=\"true\"\n            [isExpanded]=\"isOpen\"\n            [glyphAriaLabel]=\"timePickerButtonLabel || ('coreTimePicker.timePickerButtonLabel' | fdTranslate)\"\n            glyph=\"fob-watch\"\n        >\n            <input\n                type=\"text\"\n                class=\"fd-input\"\n                fd-input-group-input\n                [value]=\"_inputTimeValue\"\n                (focusout)=\"_timeInputChanged($any($event.currentTarget).value)\"\n                (keyup.enter)=\"_timeInputChanged($any($event.currentTarget).value)\"\n                [disabled]=\"disabled\"\n                [attr.id]=\"inputId\"\n                [placeholder]=\"_placeholder\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-label]=\"timePickerInputLabel || ('coreTimePicker.timePickerInputLabel' | fdTranslate)\"\n                [attr.aria-describedby]=\"_formValueStateMessageId\"\n                [attr.aria-required]=\"required\"\n            />\n        </fd-input-group>\n    </fd-popover-control>\n    <fd-popover-body>\n        <fd-form-message [embedded]=\"true\" *ngIf=\"_message\" [type]=\"state\">\n            {{ _message }}\n        </fd-form-message>\n        <ng-content></ng-content>\n        <fd-time\n            *ngIf=\"isOpen\"\n            [tablet]=\"tablet\"\n            [disabled]=\"disabled\"\n            [keepTwoDigits]=\"keepTwoDigitsTime\"\n            [ngModel]=\"time\"\n            (ngModelChange)=\"_timeComponentValueChanged($event)\"\n            [meridian]=\"_meridian\"\n            [displayHours]=\"_displayHours\"\n            [displayMinutes]=\"_displayMinutes\"\n            [displaySeconds]=\"_displaySeconds\"\n            [spinnerButtons]=\"spinnerButtons\"\n        ></fd-time>\n    </fd-popover-body>\n</fd-popover>\n\n<div style=\"display: none\" aria-hidden=\"true\">\n    <div [attr.id]=\"_formValueStateMessageId\" aria-atomic=\"true\" aria-live=\"assertive\">\n        <ng-container [ngSwitch]=\"state\">\n            <ng-container *ngSwitchCase=\"'success'\">{{ valueStateSuccessMessage }}</ng-container>\n            <ng-container *ngSwitchCase=\"'information'\">{{ valueStateInformationMessage }}</ng-container>\n            <ng-container *ngSwitchCase=\"'warning'\">{{ valueStateWarningMessage }}</ng-container>\n            <ng-container *ngSwitchCase=\"'error'\">{{ valueStateErrorMessage }}</ng-container>\n        </ng-container>\n        {{ _message }}\n    </div>\n</div>\n", styles: [".fd-timepicker-custom{display:inline-block}.fd-timepicker-custom fd-popover{display:block}.fd-timepicker-custom fd-time{width:auto}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i6.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i6.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i7.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i7.InputGroupInputDirective, selector: "[fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: i8.TimeComponent, selector: "fd-time", inputs: ["meridian", "validate", "keepTwoDigits", "disabled", "displaySeconds", "displayMinutes", "displayHours", "tablet", "elementsAtOnce", "time", "spinnerButtons"] }, { kind: "component", type: i2.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "pipe", type: i9.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: TimePickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-time-picker', host: {

package/esm2020/title/title.component.mjs CHANGED Viewed

@@ -45,13 +45,13 @@ export class TitleComponent extends TitleToken {
     }
 }
 TitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: TitleComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-TitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: { headerSize: "headerSize", wrap: "wrap" }, host: { properties: { "class.fd-title--wrap": "wrap" }, classAttribute: "fd-title" }, providers: [{ provide: TitleToken, useExisting: TitleComponent }], exportAs: ["fd-title"], usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.25.1-rc.16\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 */.fd-title{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-family:var(--fdTitle_Font_Family);font-size:1rem;font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-title:after,.fd-title:before{box-sizing:inherit;font-size:inherit}.fd-title--h1{font-size:var(--sapFontHeader1Size)}.fd-title--h2{font-size:var(--sapFontHeader2Size)}.fd-title--h3{font-size:var(--sapFontHeader3Size)}.fd-title--h4{font-size:var(--sapFontHeader4Size)}.fd-title--h5{font-size:var(--sapFontHeader5Size)}.fd-title--h6{font-size:var(--sapFontHeader6Size)}.fd-title--wrap{overflow:auto;text-overflow:clip;white-space:normal}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+TitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: { headerSize: "headerSize", wrap: "wrap" }, host: { properties: { "class.fd-title--wrap": "wrap" }, classAttribute: "fd-title" }, providers: [{ provide: TitleToken, useExisting: TitleComponent }], exportAs: ["fd-title"], usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.26.0-rc.27\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 */.fd-title{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-family:var(--fdTitle_Font_Family);font-size:1rem;font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-title:after,.fd-title:before{box-sizing:inherit;font-size:inherit}.fd-title--h1{font-size:var(--sapFontHeader1Size)}.fd-title--h2{font-size:var(--sapFontHeader2Size)}.fd-title--h3{font-size:var(--sapFontHeader3Size)}.fd-title--h4{font-size:var(--sapFontHeader4Size)}.fd-title--h5{font-size:var(--sapFontHeader5Size)}.fd-title--h6{font-size:var(--sapFontHeader6Size)}.fd-title--wrap{overflow:auto;text-overflow:clip;white-space:normal}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: TitleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]', exportAs: 'fd-title', template: '<ng-content></ng-content>', host: {
                         class: 'fd-title',
                         '[class.fd-title--wrap]': 'wrap'
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: TitleToken, useExisting: TitleComponent }], styles: ["/*!\n * Fundamental Library Styles v0.25.1-rc.16\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 */.fd-title{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-family:var(--fdTitle_Font_Family);font-size:1rem;font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-title:after,.fd-title:before{box-sizing:inherit;font-size:inherit}.fd-title--h1{font-size:var(--sapFontHeader1Size)}.fd-title--h2{font-size:var(--sapFontHeader2Size)}.fd-title--h3{font-size:var(--sapFontHeader3Size)}.fd-title--h4{font-size:var(--sapFontHeader4Size)}.fd-title--h5{font-size:var(--sapFontHeader5Size)}.fd-title--h6{font-size:var(--sapFontHeader6Size)}.fd-title--wrap{overflow:auto;text-overflow:clip;white-space:normal}\n"] }]
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: TitleToken, useExisting: TitleComponent }], styles: ["/*!\n * Fundamental Library Styles v0.26.0-rc.27\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 */.fd-title{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-family:var(--fdTitle_Font_Family);font-size:1rem;font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-title:after,.fd-title:before{box-sizing:inherit;font-size:inherit}.fd-title--h1{font-size:var(--sapFontHeader1Size)}.fd-title--h2{font-size:var(--sapFontHeader2Size)}.fd-title--h3{font-size:var(--sapFontHeader3Size)}.fd-title--h4{font-size:var(--sapFontHeader4Size)}.fd-title--h5{font-size:var(--sapFontHeader5Size)}.fd-title--h6{font-size:var(--sapFontHeader6Size)}.fd-title--wrap{overflow:auto;text-overflow:clip;white-space:normal}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { headerSize: [{
                 type: Input
             }], wrap: [{

package/esm2020/token/token.component.mjs CHANGED Viewed

@@ -81,10 +81,10 @@ export class TokenComponent {
     }
 }
 TokenComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: TokenComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component });
-TokenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: TokenComponent, selector: "fd-token", inputs: { disabled: "disabled", selected: "selected", readOnly: "readOnly", deleteButtonLabel: "deleteButtonLabel", ariaRoleDescription: "ariaRoleDescription" }, outputs: { onCloseClick: "onCloseClick", onRemove: "onRemove", onTokenClick: "onTokenClick", onTokenKeydown: "onTokenKeydown" }, providers: [contentDensityObserverProviders()], viewQueries: [{ propertyName: "tokenWrapperElement", first: true, predicate: ["tokenWrapperElement"], descendants: true }, { propertyName: "_content", first: true, predicate: ["content"], descendants: true }, { propertyName: "_viewContainer", first: true, predicate: ["viewContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<span\n    #tokenWrapperElement\n    class=\"fd-token\"\n    role=\"option\"\n    tabindex=\"0\"\n    [attr.aria-roledescription]=\"ariaRoleDescription\"\n    (click)=\"tokenClickHandler($event)\"\n    (keydown)=\"tokenKeydownHandler($event)\"\n    [attr.aria-setsize]=\"totalCount\"\n    [class.fd-token__disabled]=\"disabled\"\n    [class.fd-token--compact]=\"_contentDensityObserver.isCompact$ | async\"\n    [class.fd-token--selected]=\"selected\"\n    [class.fd-token--readonly]=\"readOnly\"\n    [attr.aria-selected]=\"selected\"\n    [attr.aria-readonly]=\"readOnly\"\n>\n    <span class=\"fd-token__text no-text-select\">\n        <ng-container #viewContainer></ng-container>\n    </span>\n    <span\n        (click)=\"closeClickHandler($event)\"\n        role=\"button\"\n        [attr.aria-label]=\"deleteButtonLabel || ('coreToken.deleteButtonLabel' | fdTranslate)\"\n        *ngIf=\"!readOnly\"\n        class=\"fd-token__close\"\n    ></span>\n</span>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.25.1-rc.16\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 */.fd-token{-webkit-box-sizing:border-box;-ms-flex-negative:0;align-items:center;background-color:var(--sapButton_TokenBackground);border:0;border:var(--sapButton_BorderWidth) solid var(--sapButton_TokenBorderColor);border-radius:var(--fdToken_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);color:var(--fdToken_Text_Color);cursor:default;display:inline-flex;flex-shrink:0;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:1.625rem;line-height:var(--sapContent_LineHeight);line-height:1.5rem;margin:0;max-width:100%;min-width:3.625rem;padding:0;padding:.25rem 0 .25rem var(--fdToken_Padding_Left);text-align:center;text-overflow:clip;white-space:nowrap}.fd-token:after,.fd-token:before{box-sizing:inherit;font-size:inherit}.fd-token[dir=rtl],[dir=rtl] .fd-token{padding-left:0;padding-right:var(--fdToken_Padding_Left)}.fd-token__text{max-width:100%;min-width:auto;overflow:hidden;text-overflow:ellipsis;text-shadow:var(--fdToken_Text_Shadow);width:100%}.fd-token__close{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background-color:transparent;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_IconColor);cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;height:1.625rem;justify-content:center;line-height:var(--sapContent_LineHeight);line-height:1.25rem;margin:0;min-width:1.75rem;padding:.25rem .5rem;width:1.75rem}.fd-token__close:after,.fd-token__close:before{box-sizing:inherit;font-size:inherit}.fd-token__close:before{content:\"\\e03e\";font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-token__close.is-focus,.fd-token__close:focus{box-shadow:none;outline:none;z-index:5}.fd-token:hover{-webkit-box-shadow:var(--fdToken_Box_Shadow_Hover);background-color:var(--fdToken_Background_Color_Hover);border-color:var(--fdToken_Border_Color_Hover);box-shadow:var(--fdToken_Box_Shadow_Hover)}.fd-token.is-focus,.fd-token:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:var(--fdToken_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token--compact{height:1.25rem;line-height:1.125rem;min-width:3rem;padding:.1rem 0 .1rem .25rem}.fd-token--compact .fd-token__close{height:1.25rem;min-width:1.25rem;padding:.1rem .25rem;vertical-align:baseline;width:1.25rem}.fd-token--compact[dir=rtl],[dir=rtl] .fd-token--compact{padding-left:0;padding-right:.25rem}.fd-token--compact.is-focus,.fd-token--compact:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:var(--fdToken_Outline_Offset);outline-offset:var(--fdToken_Outline_Offset_Compact);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token--disabled{cursor:not-allowed}.fd-token--readonly{background-color:var(--fdToken_Background_Color_Read_Only);border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);color:var(--sapContent_LabelColor);padding:.25rem .375rem}.fd-token--readonly.fd-token--compact{padding:.1rem .25rem}.fd-token--readonly.fd-token--compact[dir=rtl],[dir=rtl] .fd-token--readonly.fd-token--compact{padding-left:.25rem}.fd-token--readonly.is-hover,.fd-token--readonly:hover{-webkit-box-shadow:none;background-color:var(--fdToken_Background_Color_Read_Only);border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);box-shadow:none;color:var(--sapContent_LabelColor)}.fd-token--readonly[dir=rtl],[dir=rtl] .fd-token--readonly{padding-left:.375rem}.fd-token.fd-token--selected{background-color:var(--sapButton_Selected_Background);border-color:var(--sapButton_Selected_BorderColor)}.fd-token.fd-token--selected,.fd-token.fd-token--selected .fd-token__close{color:var(--sapButton_Selected_TextColor)}.fd-token.fd-token--selected.is-hover,.fd-token.fd-token--selected:hover{-webkit-box-shadow:var(--fdToken_Box_Shadow_Selected_Hover);background-color:var(--sapButton_Selected_Hover_Background);border-color:var(--sapButton_Selected_Hover_BorderColor);box-shadow:var(--fdToken_Box_Shadow_Selected_Hover)}.fd-token.fd-token--selected.is-focus,.fd-token.fd-token--selected:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-color:var(--fdToken_Border_Color_Selected_Focus);outline-offset:var(--fdToken_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token__disabled:after{cursor:not-allowed}.no-text-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+TokenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: TokenComponent, selector: "fd-token", inputs: { disabled: "disabled", selected: "selected", readOnly: "readOnly", deleteButtonLabel: "deleteButtonLabel", ariaRoleDescription: "ariaRoleDescription" }, outputs: { onCloseClick: "onCloseClick", onRemove: "onRemove", onTokenClick: "onTokenClick", onTokenKeydown: "onTokenKeydown" }, providers: [contentDensityObserverProviders()], viewQueries: [{ propertyName: "tokenWrapperElement", first: true, predicate: ["tokenWrapperElement"], descendants: true }, { propertyName: "_content", first: true, predicate: ["content"], descendants: true }, { propertyName: "_viewContainer", first: true, predicate: ["viewContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<span\n    #tokenWrapperElement\n    class=\"fd-token\"\n    role=\"option\"\n    tabindex=\"0\"\n    [attr.aria-roledescription]=\"ariaRoleDescription\"\n    (click)=\"tokenClickHandler($event)\"\n    (keydown)=\"tokenKeydownHandler($event)\"\n    [attr.aria-setsize]=\"totalCount\"\n    [class.fd-token__disabled]=\"disabled\"\n    [class.fd-token--compact]=\"_contentDensityObserver.isCompact$ | async\"\n    [class.fd-token--selected]=\"selected\"\n    [class.fd-token--readonly]=\"readOnly\"\n    [attr.aria-selected]=\"selected\"\n    [attr.aria-readonly]=\"readOnly\"\n>\n    <span class=\"fd-token__text no-text-select\">\n        <ng-container #viewContainer></ng-container>\n    </span>\n    <span\n        (click)=\"closeClickHandler($event)\"\n        role=\"button\"\n        [attr.aria-label]=\"deleteButtonLabel || ('coreToken.deleteButtonLabel' | fdTranslate)\"\n        *ngIf=\"!readOnly\"\n        class=\"fd-token__close\"\n    ></span>\n</span>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.26.0-rc.27\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 */.fd-token{-webkit-box-sizing:border-box;-ms-flex-negative:0;align-items:center;background-color:var(--sapButton_TokenBackground);border:0;border:var(--sapButton_BorderWidth) solid var(--sapButton_TokenBorderColor);border-radius:var(--fdToken_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);color:var(--fdToken_Text_Color);cursor:default;display:inline-flex;flex-shrink:0;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:1.625rem;line-height:var(--sapContent_LineHeight);line-height:1.5rem;margin:0;max-width:100%;min-width:3.625rem;padding:0;padding:.25rem 0 .25rem var(--fdToken_Padding_Left);text-align:center;text-overflow:clip;white-space:nowrap}.fd-token:after,.fd-token:before{box-sizing:inherit;font-size:inherit}.fd-token[dir=rtl],[dir=rtl] .fd-token{padding-left:0;padding-right:var(--fdToken_Padding_Left)}.fd-token__text{max-width:100%;min-width:auto;overflow:hidden;text-overflow:ellipsis;text-shadow:var(--fdToken_Text_Shadow);width:100%}.fd-token__close{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background-color:transparent;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_IconColor);cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;height:1.625rem;justify-content:center;line-height:var(--sapContent_LineHeight);line-height:1.25rem;margin:0;min-width:1.75rem;padding:.25rem .5rem;width:1.75rem}.fd-token__close:after,.fd-token__close:before{box-sizing:inherit;font-size:inherit}.fd-token__close:before{content:\"\\e03e\";font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-token__close.is-focus,.fd-token__close:focus{box-shadow:none;outline:none;z-index:5}.fd-token:hover{-webkit-box-shadow:var(--fdToken_Box_Shadow_Hover);background-color:var(--fdToken_Background_Color_Hover);border-color:var(--fdToken_Border_Color_Hover);box-shadow:var(--fdToken_Box_Shadow_Hover)}.fd-token.is-focus,.fd-token:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:var(--fdToken_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token--compact{height:1.25rem;line-height:1.125rem;min-width:3rem;padding:.1rem 0 .1rem .25rem}.fd-token--compact .fd-token__close{height:1.25rem;min-width:1.25rem;padding:.1rem .25rem;vertical-align:baseline;width:1.25rem}.fd-token--compact[dir=rtl],[dir=rtl] .fd-token--compact{padding-left:0;padding-right:.25rem}.fd-token--compact.is-focus,.fd-token--compact:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:var(--fdToken_Outline_Offset);outline-offset:var(--fdToken_Outline_Offset_Compact);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token--disabled{cursor:not-allowed}.fd-token--readonly{background-color:var(--fdToken_Background_Color_Read_Only);border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);color:var(--sapContent_LabelColor);padding:.25rem .375rem}.fd-token--readonly.fd-token--compact{padding:.1rem .25rem}.fd-token--readonly.fd-token--compact[dir=rtl],[dir=rtl] .fd-token--readonly.fd-token--compact{padding-left:.25rem}.fd-token--readonly.is-hover,.fd-token--readonly:hover{-webkit-box-shadow:none;background-color:var(--fdToken_Background_Color_Read_Only);border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);box-shadow:none;color:var(--sapContent_LabelColor)}.fd-token--readonly[dir=rtl],[dir=rtl] .fd-token--readonly{padding-left:.375rem}.fd-token.fd-token--selected{background-color:var(--sapButton_Selected_Background);border-color:var(--sapButton_Selected_BorderColor)}.fd-token.fd-token--selected,.fd-token.fd-token--selected .fd-token__close{color:var(--sapButton_Selected_TextColor)}.fd-token.fd-token--selected.is-hover,.fd-token.fd-token--selected:hover{-webkit-box-shadow:var(--fdToken_Box_Shadow_Selected_Hover);background-color:var(--sapButton_Selected_Hover_Background);border-color:var(--sapButton_Selected_Hover_BorderColor);box-shadow:var(--fdToken_Box_Shadow_Selected_Hover)}.fd-token.fd-token--selected.is-focus,.fd-token.fd-token--selected:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-color:var(--fdToken_Border_Color_Selected_Focus);outline-offset:var(--fdToken_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token__disabled:after{cursor:not-allowed}.no-text-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: TokenComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fd-token', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [contentDensityObserverProviders()], template: "<span\n    #tokenWrapperElement\n    class=\"fd-token\"\n    role=\"option\"\n    tabindex=\"0\"\n    [attr.aria-roledescription]=\"ariaRoleDescription\"\n    (click)=\"tokenClickHandler($event)\"\n    (keydown)=\"tokenKeydownHandler($event)\"\n    [attr.aria-setsize]=\"totalCount\"\n    [class.fd-token__disabled]=\"disabled\"\n    [class.fd-token--compact]=\"_contentDensityObserver.isCompact$ | async\"\n    [class.fd-token--selected]=\"selected\"\n    [class.fd-token--readonly]=\"readOnly\"\n    [attr.aria-selected]=\"selected\"\n    [attr.aria-readonly]=\"readOnly\"\n>\n    <span class=\"fd-token__text no-text-select\">\n        <ng-container #viewContainer></ng-container>\n    </span>\n    <span\n        (click)=\"closeClickHandler($event)\"\n        role=\"button\"\n        [attr.aria-label]=\"deleteButtonLabel || ('coreToken.deleteButtonLabel' | fdTranslate)\"\n        *ngIf=\"!readOnly\"\n        class=\"fd-token__close\"\n    ></span>\n</span>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.25.1-rc.16\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 */.fd-token{-webkit-box-sizing:border-box;-ms-flex-negative:0;align-items:center;background-color:var(--sapButton_TokenBackground);border:0;border:var(--sapButton_BorderWidth) solid var(--sapButton_TokenBorderColor);border-radius:var(--fdToken_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);color:var(--fdToken_Text_Color);cursor:default;display:inline-flex;flex-shrink:0;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:1.625rem;line-height:var(--sapContent_LineHeight);line-height:1.5rem;margin:0;max-width:100%;min-width:3.625rem;padding:0;padding:.25rem 0 .25rem var(--fdToken_Padding_Left);text-align:center;text-overflow:clip;white-space:nowrap}.fd-token:after,.fd-token:before{box-sizing:inherit;font-size:inherit}.fd-token[dir=rtl],[dir=rtl] .fd-token{padding-left:0;padding-right:var(--fdToken_Padding_Left)}.fd-token__text{max-width:100%;min-width:auto;overflow:hidden;text-overflow:ellipsis;text-shadow:var(--fdToken_Text_Shadow);width:100%}.fd-token__close{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background-color:transparent;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_IconColor);cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;height:1.625rem;justify-content:center;line-height:var(--sapContent_LineHeight);line-height:1.25rem;margin:0;min-width:1.75rem;padding:.25rem .5rem;width:1.75rem}.fd-token__close:after,.fd-token__close:before{box-sizing:inherit;font-size:inherit}.fd-token__close:before{content:\"\\e03e\";font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-token__close.is-focus,.fd-token__close:focus{box-shadow:none;outline:none;z-index:5}.fd-token:hover{-webkit-box-shadow:var(--fdToken_Box_Shadow_Hover);background-color:var(--fdToken_Background_Color_Hover);border-color:var(--fdToken_Border_Color_Hover);box-shadow:var(--fdToken_Box_Shadow_Hover)}.fd-token.is-focus,.fd-token:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:var(--fdToken_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token--compact{height:1.25rem;line-height:1.125rem;min-width:3rem;padding:.1rem 0 .1rem .25rem}.fd-token--compact .fd-token__close{height:1.25rem;min-width:1.25rem;padding:.1rem .25rem;vertical-align:baseline;width:1.25rem}.fd-token--compact[dir=rtl],[dir=rtl] .fd-token--compact{padding-left:0;padding-right:.25rem}.fd-token--compact.is-focus,.fd-token--compact:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:var(--fdToken_Outline_Offset);outline-offset:var(--fdToken_Outline_Offset_Compact);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token--disabled{cursor:not-allowed}.fd-token--readonly{background-color:var(--fdToken_Background_Color_Read_Only);border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);color:var(--sapContent_LabelColor);padding:.25rem .375rem}.fd-token--readonly.fd-token--compact{padding:.1rem .25rem}.fd-token--readonly.fd-token--compact[dir=rtl],[dir=rtl] .fd-token--readonly.fd-token--compact{padding-left:.25rem}.fd-token--readonly.is-hover,.fd-token--readonly:hover{-webkit-box-shadow:none;background-color:var(--fdToken_Background_Color_Read_Only);border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);box-shadow:none;color:var(--sapContent_LabelColor)}.fd-token--readonly[dir=rtl],[dir=rtl] .fd-token--readonly{padding-left:.375rem}.fd-token.fd-token--selected{background-color:var(--sapButton_Selected_Background);border-color:var(--sapButton_Selected_BorderColor)}.fd-token.fd-token--selected,.fd-token.fd-token--selected .fd-token__close{color:var(--sapButton_Selected_TextColor)}.fd-token.fd-token--selected.is-hover,.fd-token.fd-token--selected:hover{-webkit-box-shadow:var(--fdToken_Box_Shadow_Selected_Hover);background-color:var(--sapButton_Selected_Hover_Background);border-color:var(--sapButton_Selected_Hover_BorderColor);box-shadow:var(--fdToken_Box_Shadow_Selected_Hover)}.fd-token.fd-token--selected.is-focus,.fd-token.fd-token--selected:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-color:var(--fdToken_Border_Color_Selected_Focus);outline-offset:var(--fdToken_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token__disabled:after{cursor:not-allowed}.no-text-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}\n"] }]
+            args: [{ selector: 'fd-token', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [contentDensityObserverProviders()], template: "<span\n    #tokenWrapperElement\n    class=\"fd-token\"\n    role=\"option\"\n    tabindex=\"0\"\n    [attr.aria-roledescription]=\"ariaRoleDescription\"\n    (click)=\"tokenClickHandler($event)\"\n    (keydown)=\"tokenKeydownHandler($event)\"\n    [attr.aria-setsize]=\"totalCount\"\n    [class.fd-token__disabled]=\"disabled\"\n    [class.fd-token--compact]=\"_contentDensityObserver.isCompact$ | async\"\n    [class.fd-token--selected]=\"selected\"\n    [class.fd-token--readonly]=\"readOnly\"\n    [attr.aria-selected]=\"selected\"\n    [attr.aria-readonly]=\"readOnly\"\n>\n    <span class=\"fd-token__text no-text-select\">\n        <ng-container #viewContainer></ng-container>\n    </span>\n    <span\n        (click)=\"closeClickHandler($event)\"\n        role=\"button\"\n        [attr.aria-label]=\"deleteButtonLabel || ('coreToken.deleteButtonLabel' | fdTranslate)\"\n        *ngIf=\"!readOnly\"\n        class=\"fd-token__close\"\n    ></span>\n</span>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.26.0-rc.27\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 */.fd-token{-webkit-box-sizing:border-box;-ms-flex-negative:0;align-items:center;background-color:var(--sapButton_TokenBackground);border:0;border:var(--sapButton_BorderWidth) solid var(--sapButton_TokenBorderColor);border-radius:var(--fdToken_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);color:var(--fdToken_Text_Color);cursor:default;display:inline-flex;flex-shrink:0;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:1.625rem;line-height:var(--sapContent_LineHeight);line-height:1.5rem;margin:0;max-width:100%;min-width:3.625rem;padding:0;padding:.25rem 0 .25rem var(--fdToken_Padding_Left);text-align:center;text-overflow:clip;white-space:nowrap}.fd-token:after,.fd-token:before{box-sizing:inherit;font-size:inherit}.fd-token[dir=rtl],[dir=rtl] .fd-token{padding-left:0;padding-right:var(--fdToken_Padding_Left)}.fd-token__text{max-width:100%;min-width:auto;overflow:hidden;text-overflow:ellipsis;text-shadow:var(--fdToken_Text_Shadow);width:100%}.fd-token__close{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background-color:transparent;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_IconColor);cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;height:1.625rem;justify-content:center;line-height:var(--sapContent_LineHeight);line-height:1.25rem;margin:0;min-width:1.75rem;padding:.25rem .5rem;width:1.75rem}.fd-token__close:after,.fd-token__close:before{box-sizing:inherit;font-size:inherit}.fd-token__close:before{content:\"\\e03e\";font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-token__close.is-focus,.fd-token__close:focus{box-shadow:none;outline:none;z-index:5}.fd-token:hover{-webkit-box-shadow:var(--fdToken_Box_Shadow_Hover);background-color:var(--fdToken_Background_Color_Hover);border-color:var(--fdToken_Border_Color_Hover);box-shadow:var(--fdToken_Box_Shadow_Hover)}.fd-token.is-focus,.fd-token:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:var(--fdToken_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token--compact{height:1.25rem;line-height:1.125rem;min-width:3rem;padding:.1rem 0 .1rem .25rem}.fd-token--compact .fd-token__close{height:1.25rem;min-width:1.25rem;padding:.1rem .25rem;vertical-align:baseline;width:1.25rem}.fd-token--compact[dir=rtl],[dir=rtl] .fd-token--compact{padding-left:0;padding-right:.25rem}.fd-token--compact.is-focus,.fd-token--compact:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:var(--fdToken_Outline_Offset);outline-offset:var(--fdToken_Outline_Offset_Compact);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token--disabled{cursor:not-allowed}.fd-token--readonly{background-color:var(--fdToken_Background_Color_Read_Only);border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);color:var(--sapContent_LabelColor);padding:.25rem .375rem}.fd-token--readonly.fd-token--compact{padding:.1rem .25rem}.fd-token--readonly.fd-token--compact[dir=rtl],[dir=rtl] .fd-token--readonly.fd-token--compact{padding-left:.25rem}.fd-token--readonly.is-hover,.fd-token--readonly:hover{-webkit-box-shadow:none;background-color:var(--fdToken_Background_Color_Read_Only);border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);box-shadow:none;color:var(--sapContent_LabelColor)}.fd-token--readonly[dir=rtl],[dir=rtl] .fd-token--readonly{padding-left:.375rem}.fd-token.fd-token--selected{background-color:var(--sapButton_Selected_Background);border-color:var(--sapButton_Selected_BorderColor)}.fd-token.fd-token--selected,.fd-token.fd-token--selected .fd-token__close{color:var(--sapButton_Selected_TextColor)}.fd-token.fd-token--selected.is-hover,.fd-token.fd-token--selected:hover{-webkit-box-shadow:var(--fdToken_Box_Shadow_Selected_Hover);background-color:var(--sapButton_Selected_Hover_Background);border-color:var(--sapButton_Selected_Hover_BorderColor);box-shadow:var(--fdToken_Box_Shadow_Selected_Hover)}.fd-token.fd-token--selected.is-focus,.fd-token.fd-token--selected:focus{box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-color:var(--fdToken_Border_Color_Selected_Focus);outline-offset:var(--fdToken_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-token__disabled:after{cursor:not-allowed}.no-text-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.ContentDensityObserver }]; }, propDecorators: { disabled: [{
                 type: Input
             }], tokenWrapperElement: [{

package/esm2020/token/tokenizer.component.mjs CHANGED Viewed

@@ -545,7 +545,7 @@ export class TokenizerComponent {
     }
 }
 TokenizerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: TokenizerComponent, deps: [{ token: i1.ContentDensityObserver }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i2.RtlService, optional: true }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-TokenizerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: TokenizerComponent, selector: "fd-tokenizer", inputs: { class: "class", disableKeyboardDeletion: "disableKeyboardDeletion", compactCollapse: "compactCollapse", tokenizerFocusable: "tokenizerFocusable", inputValue: "inputValue", glyph: "glyph", moreTerm: "moreTerm", open: "open" }, outputs: { moreClickedEvent: "moreClickedEvent" }, host: { listeners: { "keydown": "keyDown($event)" } }, providers: [contentDensityObserverProviders()], queries: [{ propertyName: "input", first: true, predicate: i0.forwardRef(function () { return FormControlComponent; }), descendants: true }, { propertyName: "tokenList", predicate: i0.forwardRef(function () { return TokenComponent; }) }], viewQueries: [{ propertyName: "tokenizerInnerEl", first: true, predicate: ["tokenizerInner"], descendants: true }, { propertyName: "moreElement", first: true, predicate: ["moreElement"], descendants: true }, { propertyName: "content", first: true, predicate: ["inputGroupAddOn"], descendants: true }, { propertyName: "_viewContainer", predicate: ["viewContainer"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"fd-tokenizer fd-tokenizer--scrollable\"\n    [class.is-focus]=\"_tokenizerHasFocus\"\n    [class.fd-tokenizer--compact]=\"compact\"\n>\n    <div class=\"fd-tokenizer__inner\" #tokenizerInner>\n        <div role=\"listbox\">\n            <ng-content select=\"fd-token\"></ng-content>\n        </div>\n\n        <ng-container *ngIf=\"_showOverflowPopover && (compact || compactCollapse); else moreElement\">\n            <ng-container *ngTemplateOutlet=\"tokensOverflow\"></ng-container>\n        </ng-container>\n\n        <ng-content select=\"[fd-form-control]\"></ng-content>\n    </div>\n    <span fd-input-group-addon *ngIf=\"glyph\" #inputGroupAddOn [button]=\"true\" placement=\"after\">\n        <button\n            fd-button\n            [class]=\"compact ? 'fd-tokenizer-addon--compact' : 'fd-tokenizer-addon'\"\n            fdType=\"transparent\"\n            [glyph]=\"glyph\"\n            type=\"button\"\n        ></button>\n    </span>\n</div>\n\n<ng-template #tokensOverflow>\n    <fd-popover placement=\"bottom-start\" title=\"\" [noArrow]=\"false\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"moreElement\"></ng-container>\n        </fd-popover-control>\n\n        <fd-popover-body>\n            <ul fd-list class=\"fd-tokenizer__overflow-list\">\n                <li fd-list-item class=\"fd-tokenizer__overflow-list-item\" *ngFor=\"let token of _hiddenTokens\">\n                    <ng-container #viewContainer></ng-container>\n\n                    <span\n                        *ngIf=\"!token.readOnly\"\n                        class=\"fd-token__close\"\n                        role=\"button\"\n                        [attr.aria-label]=\"token.deleteButtonLabel || ('coreToken.deleteButtonLabel' | fdTranslate)\"\n                        (click)=\"token.closeClickHandler($event)\"\n                    ></span>\n                </li>\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #moreElement>\n    <span\n        (click)=\"moreClicked()\"\n        *ngIf=\"\n            (moreTokensLeft.length > 0 || moreTokensRight.length > 0 || hiddenCozyTokenCount > 0) &&\n            !open &&\n            !_tokenizerHasFocus\n        \"\n        class=\"fd-tokenizer-more\"\n        role=\"button\"\n        tabindex=\"0\"\n    >\n        <ng-container *ngIf=\"compact || compactCollapse\">\n            {{ 'coreTokenizer.moreLabel' | fdTranslate: { count: moreTokensLeft.length + moreTokensRight.length } }}\n        </ng-container>\n        <ng-container *ngIf=\"!compact && !compactCollapse\">\n            {{ 'coreTokenizer.moreLabel' | fdTranslate: { count: hiddenCozyTokenCount } }}\n        </ng-container>\n    </span>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.25.1-rc.16\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 */.fd-tokenizer{-webkit-box-sizing:border-box;-webkit-box-shadow:none;-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--sapField_BackgroundStyle);background-color:var(--sapField_Background);border:none;border-radius:var(--sapField_BorderCornerRadius);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2.25rem;height:auto;line-height:var(--sapContent_LineHeight);margin:0;min-height:2.25rem;min-width:2.75rem;outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-tokenizer:after,.fd-tokenizer:before{box-sizing:inherit;font-size:inherit}.fd-tokenizer::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer[dir=rtl]::placeholder,[dir=rtl] .fd-tokenizer::placeholder{text-indent:.125rem}.fd-tokenizer::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::-ms-clear{display:none}.fd-tokenizer.is-hover,.fd-tokenizer:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle);background-color:var(--sapField_Hover_Background);border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-tokenizer.is-focus,.fd-tokenizer:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-tokenizer.is-hover,.fd-tokenizer:hover{box-shadow:none}.fd-tokenizer__inner{-ms-overflow-style:none;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:end;-ms-flex-pack:end;align-items:center;display:flex;float:right;justify-content:flex-end;overflow:hidden;padding:0 .3125rem;scrollbar-width:none;white-space:nowrap;width:100%}.fd-tokenizer__inner::-webkit-scrollbar{display:none}.fd-tokenizer .fd-token{margin-right:.3125rem;max-width:calc(100% - 3.3125rem)}.fd-tokenizer .fd-token[dir=rtl],[dir=rtl] .fd-tokenizer .fd-token{margin:0 0 0 .3125rem}.fd-tokenizer__indicator{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-tokenizer__indicator:after,.fd-tokenizer__indicator:before{box-sizing:inherit;font-size:inherit}.fd-tokenizer .fd-tokenizer__input{background:transparent}.fd-tokenizer .fd-tokenizer__input.fd-input{border:none;min-width:3rem;padding:0}.fd-tokenizer .fd-tokenizer__input:first-child{padding:0 .3125rem}.fd-tokenizer .fd-tokenizer__input:last-child{flex-basis:100%}.fd-tokenizer .fd-tokenizer__input.is-focus,.fd-tokenizer .fd-tokenizer__input:focus{-webkit-box-shadow:none;background:none;background-color:transparent;border:none;box-shadow:none;outline:none;z-index:5}.fd-tokenizer .fd-tokenizer__input.is-hover,.fd-tokenizer .fd-tokenizer__input:hover{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none}.fd-tokenizer.is-focus,.fd-tokenizer:focus{-webkit-box-shadow:none;border:none;box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:-.0625rem;outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-tokenizer--compact{height:1.625rem;min-height:1.625rem}.fd-tokenizer--compact .fd-tokenizer__inner{padding:0 .25rem}.fd-tokenizer--compact .fd-tokenizer__input.fd-input{min-width:2rem}.fd-tokenizer--compact .fd-tokenizer__input:first-child{padding:0 .25rem}.fd-tokenizer--compact .fd-token{margin-right:.25rem;max-width:calc(100% - 2.25rem)}.fd-tokenizer--compact .fd-token[dir=rtl],[dir=rtl] .fd-tokenizer--compact .fd-token{margin:0 0 0 .3125rem}.fd-tokenizer--readonly{background-color:var(--sapField_ReadOnly_Background);overflow:visible}.fd-tokenizer--readonly .fd-tokenizer__inner{overflow:visible}.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true],.fd-tokenizer--readonly .fd-tokenizer__input[readonly]{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none}.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly.is-focus,.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly:focus,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true].is-focus,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true]:focus,.fd-tokenizer--readonly .fd-tokenizer__input[readonly].is-focus,.fd-tokenizer--readonly .fd-tokenizer__input[readonly]:focus{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none;z-index:5}.fd-tokenizer--scrollable .fd-tokenizer__inner{justify-content:normal;overflow:scroll}.fd-tokenizer .fd-token{max-width:inherit}input.fd-input.fd-tokenizer__input{background-color:transparent;margin-right:1px;border:none;outline:none}.fd-tokenizer-more{padding-right:.5rem}[dir=rtl] .fd-tokenizer-more,.fd-tokenizer-more[dir=rtl]{padding-left:.5rem;padding-right:0}.fd-input-group__addon--button .fd-input-group__button.fd-tokenizer-addon{height:2.25rem}.fd-input-group__addon--button .fd-input-group__button.fd-tokenizer-addon--compact{height:1.625rem}.fd-tokenizer__overflow-list-item{display:flex;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.InputGroupAddOnDirective, selector: "[fd-input-group-addon]", inputs: ["class", "placement", "type", "state", "button"] }, { kind: "component", type: i5.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i6.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["disableScrollbar"] }, { kind: "component", type: i6.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "pipe", type: i8.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+TokenizerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: TokenizerComponent, selector: "fd-tokenizer", inputs: { class: "class", disableKeyboardDeletion: "disableKeyboardDeletion", compactCollapse: "compactCollapse", tokenizerFocusable: "tokenizerFocusable", inputValue: "inputValue", glyph: "glyph", moreTerm: "moreTerm", open: "open" }, outputs: { moreClickedEvent: "moreClickedEvent" }, host: { listeners: { "keydown": "keyDown($event)" } }, providers: [contentDensityObserverProviders()], queries: [{ propertyName: "input", first: true, predicate: i0.forwardRef(function () { return FormControlComponent; }), descendants: true }, { propertyName: "tokenList", predicate: i0.forwardRef(function () { return TokenComponent; }) }], viewQueries: [{ propertyName: "tokenizerInnerEl", first: true, predicate: ["tokenizerInner"], descendants: true }, { propertyName: "moreElement", first: true, predicate: ["moreElement"], descendants: true }, { propertyName: "content", first: true, predicate: ["inputGroupAddOn"], descendants: true }, { propertyName: "_viewContainer", predicate: ["viewContainer"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"fd-tokenizer fd-tokenizer--scrollable\"\n    [class.is-focus]=\"_tokenizerHasFocus\"\n    [class.fd-tokenizer--compact]=\"compact\"\n>\n    <div class=\"fd-tokenizer__inner\" #tokenizerInner>\n        <div role=\"listbox\">\n            <ng-content select=\"fd-token\"></ng-content>\n        </div>\n\n        <ng-container *ngIf=\"_showOverflowPopover && (compact || compactCollapse); else moreElement\">\n            <ng-container *ngTemplateOutlet=\"tokensOverflow\"></ng-container>\n        </ng-container>\n\n        <ng-content select=\"[fd-form-control]\"></ng-content>\n    </div>\n    <span fd-input-group-addon *ngIf=\"glyph\" #inputGroupAddOn [button]=\"true\" placement=\"after\">\n        <button\n            fd-button\n            [class]=\"compact ? 'fd-tokenizer-addon--compact' : 'fd-tokenizer-addon'\"\n            fdType=\"transparent\"\n            [glyph]=\"glyph\"\n            type=\"button\"\n        ></button>\n    </span>\n</div>\n\n<ng-template #tokensOverflow>\n    <fd-popover placement=\"bottom-start\" title=\"\" [noArrow]=\"false\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"moreElement\"></ng-container>\n        </fd-popover-control>\n\n        <fd-popover-body>\n            <ul fd-list class=\"fd-tokenizer__overflow-list\">\n                <li fd-list-item class=\"fd-tokenizer__overflow-list-item\" *ngFor=\"let token of _hiddenTokens\">\n                    <ng-container #viewContainer></ng-container>\n\n                    <span\n                        *ngIf=\"!token.readOnly\"\n                        class=\"fd-token__close\"\n                        role=\"button\"\n                        [attr.aria-label]=\"token.deleteButtonLabel || ('coreToken.deleteButtonLabel' | fdTranslate)\"\n                        (click)=\"token.closeClickHandler($event)\"\n                    ></span>\n                </li>\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #moreElement>\n    <span\n        (click)=\"moreClicked()\"\n        *ngIf=\"\n            (moreTokensLeft.length > 0 || moreTokensRight.length > 0 || hiddenCozyTokenCount > 0) &&\n            !open &&\n            !_tokenizerHasFocus\n        \"\n        class=\"fd-tokenizer-more\"\n        role=\"button\"\n        tabindex=\"0\"\n    >\n        <ng-container *ngIf=\"compact || compactCollapse\">\n            {{ 'coreTokenizer.moreLabel' | fdTranslate: { count: moreTokensLeft.length + moreTokensRight.length } }}\n        </ng-container>\n        <ng-container *ngIf=\"!compact && !compactCollapse\">\n            {{ 'coreTokenizer.moreLabel' | fdTranslate: { count: hiddenCozyTokenCount } }}\n        </ng-container>\n    </span>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.26.0-rc.27\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 */.fd-tokenizer{-webkit-box-sizing:border-box;-webkit-box-shadow:none;-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--sapField_BackgroundStyle);background-color:var(--sapField_Background);border:none;border-radius:var(--sapField_BorderCornerRadius);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2.25rem;height:auto;line-height:var(--sapContent_LineHeight);margin:0;min-height:2.25rem;min-width:2.75rem;outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-tokenizer:after,.fd-tokenizer:before{box-sizing:inherit;font-size:inherit}.fd-tokenizer::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer[dir=rtl]::placeholder,[dir=rtl] .fd-tokenizer::placeholder{text-indent:.125rem}.fd-tokenizer::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::-ms-clear{display:none}.fd-tokenizer.is-hover,.fd-tokenizer:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle);background-color:var(--sapField_Hover_Background);border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-tokenizer.is-focus,.fd-tokenizer:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-tokenizer.is-hover,.fd-tokenizer:hover{box-shadow:none}.fd-tokenizer__inner{-ms-overflow-style:none;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:end;-ms-flex-pack:end;align-items:center;display:flex;float:right;justify-content:flex-end;overflow:hidden;padding:0 .3125rem;scrollbar-width:none;white-space:nowrap;width:100%}.fd-tokenizer__inner::-webkit-scrollbar{display:none}.fd-tokenizer .fd-token{margin-right:.3125rem;max-width:calc(100% - 3.3125rem)}.fd-tokenizer .fd-token[dir=rtl],[dir=rtl] .fd-tokenizer .fd-token{margin:0 0 0 .3125rem}.fd-tokenizer__indicator{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-tokenizer__indicator:after,.fd-tokenizer__indicator:before{box-sizing:inherit;font-size:inherit}.fd-tokenizer .fd-tokenizer__input{background:transparent}.fd-tokenizer .fd-tokenizer__input.fd-input{border:none;min-width:3rem;padding:0}.fd-tokenizer .fd-tokenizer__input:first-child{padding:0 .3125rem}.fd-tokenizer .fd-tokenizer__input:last-child{flex-basis:100%}.fd-tokenizer .fd-tokenizer__input.is-focus,.fd-tokenizer .fd-tokenizer__input:focus{-webkit-box-shadow:none;background:none;background-color:transparent;border:none;box-shadow:none;outline:none;z-index:5}.fd-tokenizer .fd-tokenizer__input.is-hover,.fd-tokenizer .fd-tokenizer__input:hover{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none}.fd-tokenizer.is-focus,.fd-tokenizer:focus{-webkit-box-shadow:none;border:none;box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:-.0625rem;outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-tokenizer--compact{height:1.625rem;min-height:1.625rem}.fd-tokenizer--compact .fd-tokenizer__inner{padding:0 .25rem}.fd-tokenizer--compact .fd-tokenizer__input.fd-input{min-width:2rem}.fd-tokenizer--compact .fd-tokenizer__input:first-child{padding:0 .25rem}.fd-tokenizer--compact .fd-token{margin-right:.25rem;max-width:calc(100% - 2.25rem)}.fd-tokenizer--compact .fd-token[dir=rtl],[dir=rtl] .fd-tokenizer--compact .fd-token{margin:0 0 0 .3125rem}.fd-tokenizer--readonly{background-color:var(--sapField_ReadOnly_Background);overflow:visible}.fd-tokenizer--readonly .fd-tokenizer__inner{overflow:visible}.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true],.fd-tokenizer--readonly .fd-tokenizer__input[readonly]{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none}.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly.is-focus,.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly:focus,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true].is-focus,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true]:focus,.fd-tokenizer--readonly .fd-tokenizer__input[readonly].is-focus,.fd-tokenizer--readonly .fd-tokenizer__input[readonly]:focus{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none;z-index:5}.fd-tokenizer--scrollable .fd-tokenizer__inner{justify-content:normal;overflow:scroll}.fd-tokenizer .fd-token{max-width:inherit}input.fd-input.fd-tokenizer__input{background-color:transparent;margin-right:1px;border:none;outline:none}.fd-tokenizer-more{padding-right:.5rem}[dir=rtl] .fd-tokenizer-more,.fd-tokenizer-more[dir=rtl]{padding-left:.5rem;padding-right:0}.fd-input-group__addon--button .fd-input-group__button.fd-tokenizer-addon{height:2.25rem}.fd-input-group__addon--button .fd-input-group__button.fd-tokenizer-addon--compact{height:1.625rem}.fd-tokenizer__overflow-list-item{display:flex;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.InputGroupAddOnDirective, selector: "[fd-input-group-addon]", inputs: ["class", "placement", "type", "state", "button"] }, { kind: "component", type: i5.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i6.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i6.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "pipe", type: i8.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     applyCssClass,
     __metadata("design:type", Function),
@@ -554,7 +554,7 @@ __decorate([
 ], TokenizerComponent.prototype, "buildComponentCssClass", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: TokenizerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fd-tokenizer', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [contentDensityObserverProviders()], template: "<div\n    class=\"fd-tokenizer fd-tokenizer--scrollable\"\n    [class.is-focus]=\"_tokenizerHasFocus\"\n    [class.fd-tokenizer--compact]=\"compact\"\n>\n    <div class=\"fd-tokenizer__inner\" #tokenizerInner>\n        <div role=\"listbox\">\n            <ng-content select=\"fd-token\"></ng-content>\n        </div>\n\n        <ng-container *ngIf=\"_showOverflowPopover && (compact || compactCollapse); else moreElement\">\n            <ng-container *ngTemplateOutlet=\"tokensOverflow\"></ng-container>\n        </ng-container>\n\n        <ng-content select=\"[fd-form-control]\"></ng-content>\n    </div>\n    <span fd-input-group-addon *ngIf=\"glyph\" #inputGroupAddOn [button]=\"true\" placement=\"after\">\n        <button\n            fd-button\n            [class]=\"compact ? 'fd-tokenizer-addon--compact' : 'fd-tokenizer-addon'\"\n            fdType=\"transparent\"\n            [glyph]=\"glyph\"\n            type=\"button\"\n        ></button>\n    </span>\n</div>\n\n<ng-template #tokensOverflow>\n    <fd-popover placement=\"bottom-start\" title=\"\" [noArrow]=\"false\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"moreElement\"></ng-container>\n        </fd-popover-control>\n\n        <fd-popover-body>\n            <ul fd-list class=\"fd-tokenizer__overflow-list\">\n                <li fd-list-item class=\"fd-tokenizer__overflow-list-item\" *ngFor=\"let token of _hiddenTokens\">\n                    <ng-container #viewContainer></ng-container>\n\n                    <span\n                        *ngIf=\"!token.readOnly\"\n                        class=\"fd-token__close\"\n                        role=\"button\"\n                        [attr.aria-label]=\"token.deleteButtonLabel || ('coreToken.deleteButtonLabel' | fdTranslate)\"\n                        (click)=\"token.closeClickHandler($event)\"\n                    ></span>\n                </li>\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #moreElement>\n    <span\n        (click)=\"moreClicked()\"\n        *ngIf=\"\n            (moreTokensLeft.length > 0 || moreTokensRight.length > 0 || hiddenCozyTokenCount > 0) &&\n            !open &&\n            !_tokenizerHasFocus\n        \"\n        class=\"fd-tokenizer-more\"\n        role=\"button\"\n        tabindex=\"0\"\n    >\n        <ng-container *ngIf=\"compact || compactCollapse\">\n            {{ 'coreTokenizer.moreLabel' | fdTranslate: { count: moreTokensLeft.length + moreTokensRight.length } }}\n        </ng-container>\n        <ng-container *ngIf=\"!compact && !compactCollapse\">\n            {{ 'coreTokenizer.moreLabel' | fdTranslate: { count: hiddenCozyTokenCount } }}\n        </ng-container>\n    </span>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.25.1-rc.16\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 */.fd-tokenizer{-webkit-box-sizing:border-box;-webkit-box-shadow:none;-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--sapField_BackgroundStyle);background-color:var(--sapField_Background);border:none;border-radius:var(--sapField_BorderCornerRadius);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2.25rem;height:auto;line-height:var(--sapContent_LineHeight);margin:0;min-height:2.25rem;min-width:2.75rem;outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-tokenizer:after,.fd-tokenizer:before{box-sizing:inherit;font-size:inherit}.fd-tokenizer::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer[dir=rtl]::placeholder,[dir=rtl] .fd-tokenizer::placeholder{text-indent:.125rem}.fd-tokenizer::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::-ms-clear{display:none}.fd-tokenizer.is-hover,.fd-tokenizer:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle);background-color:var(--sapField_Hover_Background);border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-tokenizer.is-focus,.fd-tokenizer:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-tokenizer.is-hover,.fd-tokenizer:hover{box-shadow:none}.fd-tokenizer__inner{-ms-overflow-style:none;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:end;-ms-flex-pack:end;align-items:center;display:flex;float:right;justify-content:flex-end;overflow:hidden;padding:0 .3125rem;scrollbar-width:none;white-space:nowrap;width:100%}.fd-tokenizer__inner::-webkit-scrollbar{display:none}.fd-tokenizer .fd-token{margin-right:.3125rem;max-width:calc(100% - 3.3125rem)}.fd-tokenizer .fd-token[dir=rtl],[dir=rtl] .fd-tokenizer .fd-token{margin:0 0 0 .3125rem}.fd-tokenizer__indicator{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-tokenizer__indicator:after,.fd-tokenizer__indicator:before{box-sizing:inherit;font-size:inherit}.fd-tokenizer .fd-tokenizer__input{background:transparent}.fd-tokenizer .fd-tokenizer__input.fd-input{border:none;min-width:3rem;padding:0}.fd-tokenizer .fd-tokenizer__input:first-child{padding:0 .3125rem}.fd-tokenizer .fd-tokenizer__input:last-child{flex-basis:100%}.fd-tokenizer .fd-tokenizer__input.is-focus,.fd-tokenizer .fd-tokenizer__input:focus{-webkit-box-shadow:none;background:none;background-color:transparent;border:none;box-shadow:none;outline:none;z-index:5}.fd-tokenizer .fd-tokenizer__input.is-hover,.fd-tokenizer .fd-tokenizer__input:hover{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none}.fd-tokenizer.is-focus,.fd-tokenizer:focus{-webkit-box-shadow:none;border:none;box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:-.0625rem;outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-tokenizer--compact{height:1.625rem;min-height:1.625rem}.fd-tokenizer--compact .fd-tokenizer__inner{padding:0 .25rem}.fd-tokenizer--compact .fd-tokenizer__input.fd-input{min-width:2rem}.fd-tokenizer--compact .fd-tokenizer__input:first-child{padding:0 .25rem}.fd-tokenizer--compact .fd-token{margin-right:.25rem;max-width:calc(100% - 2.25rem)}.fd-tokenizer--compact .fd-token[dir=rtl],[dir=rtl] .fd-tokenizer--compact .fd-token{margin:0 0 0 .3125rem}.fd-tokenizer--readonly{background-color:var(--sapField_ReadOnly_Background);overflow:visible}.fd-tokenizer--readonly .fd-tokenizer__inner{overflow:visible}.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true],.fd-tokenizer--readonly .fd-tokenizer__input[readonly]{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none}.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly.is-focus,.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly:focus,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true].is-focus,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true]:focus,.fd-tokenizer--readonly .fd-tokenizer__input[readonly].is-focus,.fd-tokenizer--readonly .fd-tokenizer__input[readonly]:focus{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none;z-index:5}.fd-tokenizer--scrollable .fd-tokenizer__inner{justify-content:normal;overflow:scroll}.fd-tokenizer .fd-token{max-width:inherit}input.fd-input.fd-tokenizer__input{background-color:transparent;margin-right:1px;border:none;outline:none}.fd-tokenizer-more{padding-right:.5rem}[dir=rtl] .fd-tokenizer-more,.fd-tokenizer-more[dir=rtl]{padding-left:.5rem;padding-right:0}.fd-input-group__addon--button .fd-input-group__button.fd-tokenizer-addon{height:2.25rem}.fd-input-group__addon--button .fd-input-group__button.fd-tokenizer-addon--compact{height:1.625rem}.fd-tokenizer__overflow-list-item{display:flex;justify-content:space-between}\n"] }]
+            args: [{ selector: 'fd-tokenizer', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [contentDensityObserverProviders()], template: "<div\n    class=\"fd-tokenizer fd-tokenizer--scrollable\"\n    [class.is-focus]=\"_tokenizerHasFocus\"\n    [class.fd-tokenizer--compact]=\"compact\"\n>\n    <div class=\"fd-tokenizer__inner\" #tokenizerInner>\n        <div role=\"listbox\">\n            <ng-content select=\"fd-token\"></ng-content>\n        </div>\n\n        <ng-container *ngIf=\"_showOverflowPopover && (compact || compactCollapse); else moreElement\">\n            <ng-container *ngTemplateOutlet=\"tokensOverflow\"></ng-container>\n        </ng-container>\n\n        <ng-content select=\"[fd-form-control]\"></ng-content>\n    </div>\n    <span fd-input-group-addon *ngIf=\"glyph\" #inputGroupAddOn [button]=\"true\" placement=\"after\">\n        <button\n            fd-button\n            [class]=\"compact ? 'fd-tokenizer-addon--compact' : 'fd-tokenizer-addon'\"\n            fdType=\"transparent\"\n            [glyph]=\"glyph\"\n            type=\"button\"\n        ></button>\n    </span>\n</div>\n\n<ng-template #tokensOverflow>\n    <fd-popover placement=\"bottom-start\" title=\"\" [noArrow]=\"false\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"moreElement\"></ng-container>\n        </fd-popover-control>\n\n        <fd-popover-body>\n            <ul fd-list class=\"fd-tokenizer__overflow-list\">\n                <li fd-list-item class=\"fd-tokenizer__overflow-list-item\" *ngFor=\"let token of _hiddenTokens\">\n                    <ng-container #viewContainer></ng-container>\n\n                    <span\n                        *ngIf=\"!token.readOnly\"\n                        class=\"fd-token__close\"\n                        role=\"button\"\n                        [attr.aria-label]=\"token.deleteButtonLabel || ('coreToken.deleteButtonLabel' | fdTranslate)\"\n                        (click)=\"token.closeClickHandler($event)\"\n                    ></span>\n                </li>\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #moreElement>\n    <span\n        (click)=\"moreClicked()\"\n        *ngIf=\"\n            (moreTokensLeft.length > 0 || moreTokensRight.length > 0 || hiddenCozyTokenCount > 0) &&\n            !open &&\n            !_tokenizerHasFocus\n        \"\n        class=\"fd-tokenizer-more\"\n        role=\"button\"\n        tabindex=\"0\"\n    >\n        <ng-container *ngIf=\"compact || compactCollapse\">\n            {{ 'coreTokenizer.moreLabel' | fdTranslate: { count: moreTokensLeft.length + moreTokensRight.length } }}\n        </ng-container>\n        <ng-container *ngIf=\"!compact && !compactCollapse\">\n            {{ 'coreTokenizer.moreLabel' | fdTranslate: { count: hiddenCozyTokenCount } }}\n        </ng-container>\n    </span>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.26.0-rc.27\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 */.fd-tokenizer{-webkit-box-sizing:border-box;-webkit-box-shadow:none;-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--sapField_BackgroundStyle);background-color:var(--sapField_Background);border:none;border-radius:var(--sapField_BorderCornerRadius);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2.25rem;height:auto;line-height:var(--sapContent_LineHeight);margin:0;min-height:2.25rem;min-width:2.75rem;outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-tokenizer:after,.fd-tokenizer:before{box-sizing:inherit;font-size:inherit}.fd-tokenizer::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer[dir=rtl]::placeholder,[dir=rtl] .fd-tokenizer::placeholder{text-indent:.125rem}.fd-tokenizer::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::-ms-clear{display:none}.fd-tokenizer.is-hover,.fd-tokenizer:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle);background-color:var(--sapField_Hover_Background);border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-tokenizer.is-focus,.fd-tokenizer:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-tokenizer.is-hover,.fd-tokenizer:hover{box-shadow:none}.fd-tokenizer__inner{-ms-overflow-style:none;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:end;-ms-flex-pack:end;align-items:center;display:flex;float:right;justify-content:flex-end;overflow:hidden;padding:0 .3125rem;scrollbar-width:none;white-space:nowrap;width:100%}.fd-tokenizer__inner::-webkit-scrollbar{display:none}.fd-tokenizer .fd-token{margin-right:.3125rem;max-width:calc(100% - 3.3125rem)}.fd-tokenizer .fd-token[dir=rtl],[dir=rtl] .fd-tokenizer .fd-token{margin:0 0 0 .3125rem}.fd-tokenizer__indicator{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-tokenizer__indicator:after,.fd-tokenizer__indicator:before{box-sizing:inherit;font-size:inherit}.fd-tokenizer .fd-tokenizer__input{background:transparent}.fd-tokenizer .fd-tokenizer__input.fd-input{border:none;min-width:3rem;padding:0}.fd-tokenizer .fd-tokenizer__input:first-child{padding:0 .3125rem}.fd-tokenizer .fd-tokenizer__input:last-child{flex-basis:100%}.fd-tokenizer .fd-tokenizer__input.is-focus,.fd-tokenizer .fd-tokenizer__input:focus{-webkit-box-shadow:none;background:none;background-color:transparent;border:none;box-shadow:none;outline:none;z-index:5}.fd-tokenizer .fd-tokenizer__input.is-hover,.fd-tokenizer .fd-tokenizer__input:hover{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none}.fd-tokenizer.is-focus,.fd-tokenizer:focus{-webkit-box-shadow:none;border:none;box-shadow:none;outline-color:var(--sapContent_FocusColor);outline-offset:-.0625rem;outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-tokenizer--compact{height:1.625rem;min-height:1.625rem}.fd-tokenizer--compact .fd-tokenizer__inner{padding:0 .25rem}.fd-tokenizer--compact .fd-tokenizer__input.fd-input{min-width:2rem}.fd-tokenizer--compact .fd-tokenizer__input:first-child{padding:0 .25rem}.fd-tokenizer--compact .fd-token{margin-right:.25rem;max-width:calc(100% - 2.25rem)}.fd-tokenizer--compact .fd-token[dir=rtl],[dir=rtl] .fd-tokenizer--compact .fd-token{margin:0 0 0 .3125rem}.fd-tokenizer--readonly{background-color:var(--sapField_ReadOnly_Background);overflow:visible}.fd-tokenizer--readonly .fd-tokenizer__inner{overflow:visible}.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true],.fd-tokenizer--readonly .fd-tokenizer__input[readonly]{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none}.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly.is-focus,.fd-tokenizer--readonly .fd-tokenizer__input.is-readonly:focus,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true].is-focus,.fd-tokenizer--readonly .fd-tokenizer__input[aria-readonly=true]:focus,.fd-tokenizer--readonly .fd-tokenizer__input[readonly].is-focus,.fd-tokenizer--readonly .fd-tokenizer__input[readonly]:focus{-webkit-box-shadow:none;background:none;background-color:transparent;box-shadow:none;z-index:5}.fd-tokenizer--scrollable .fd-tokenizer__inner{justify-content:normal;overflow:scroll}.fd-tokenizer .fd-token{max-width:inherit}input.fd-input.fd-tokenizer__input{background-color:transparent;margin-right:1px;border:none;outline:none}.fd-tokenizer-more{padding-right:.5rem}[dir=rtl] .fd-tokenizer-more,.fd-tokenizer-more[dir=rtl]{padding-left:.5rem;padding-right:0}.fd-input-group__addon--button .fd-input-group__button.fd-tokenizer-addon{height:2.25rem}.fd-input-group__addon--button .fd-input-group__button.fd-tokenizer-addon--compact{height:1.625rem}.fd-tokenizer__overflow-list-item{display:flex;justify-content:space-between}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ContentDensityObserver }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i2.RtlService, decorators: [{
                     type: Optional
                 }] }, { type: i0.Renderer2 }]; }, propDecorators: { class: [{

package/esm2020/toolbar/toolbar.component.mjs CHANGED Viewed

@@ -400,7 +400,7 @@ ToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versi
         contentDensityObserverProviders({
             defaultContentDensity: ContentDensityMode.COMPACT
         })
-    ], queries: [{ propertyName: "titleComponent", first: true, predicate: TitleToken, descendants: true }, { propertyName: "toolbarItems", predicate: i0.forwardRef(function () { return ToolbarItemDirective; }) }], viewQueries: [{ propertyName: "toolbar", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "overflowBody", first: true, predicate: ["overflowBody"], descendants: true }, { propertyName: "overflowSpacer", first: true, predicate: ["overflowSpacer"], descendants: true }], ngImport: i0, template: "<div #toolbar [tabindex]=\"tabindex\" [class.fd-toolbar--cozy]=\"_contentDensityObserver.isCozy$ | async\">\n    <h4 *ngIf=\"title\" class=\"fd-title fd-title--h4 fd-toolbar__title\">{{ title }}</h4>\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"shouldOverflow\">\n        <span #overflowSpacer class=\"fd-toolbar__spacer\"></span>\n\n        <span class=\"fd-toolbar__separator\" *ngIf=\"overflowVisibility | async\"></span>\n\n        <fd-popover placement=\"bottom-end\" [noArrow]=\"true\" class=\"fd-popover\">\n            <fd-popover-control>\n                <button\n                    *ngIf=\"overflowVisibility | async\"\n                    fd-button\n                    title=\"More\"\n                    aria-label=\"More\"\n                    aria-haspopup=\"true\"\n                    fdType=\"transparent\"\n                    glyph=\"overflow\"\n                ></button>\n            </fd-popover-control>\n\n            <fd-popover-body>\n                <div class=\"fd-toolbar__overflow\" #overflowBody></div>\n            </fd-popover-body>\n        </fd-popover>\n    </ng-container>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.25.1-rc.16\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 */.fd-toolbar>*~:not(.fd-toolbar__spacer){margin-left:.5rem}.fd-toolbar>*~[dir=rtl]:not(.fd-toolbar__spacer),[dir=rtl] .fd-toolbar>*~:not(.fd-toolbar__spacer){margin-left:0;margin-right:.5rem}.fd-toolbar{-webkit-box-sizing:border-box;align-items:center;border:0;border-bottom:.0625rem solid var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 .5rem}.fd-toolbar:after,.fd-toolbar:before{box-sizing:inherit;font-size:inherit}.fd-toolbar>.fd-toolbar__spacer+:not(.fd-toolbar__spacer){margin-left:0;margin-right:0}.fd-toolbar--title{height:2.75rem;padding:0 .5rem 0 1rem}.fd-toolbar--clear{border-bottom:none}.fd-toolbar--auto{background-color:var(--fdToolbar_Auto_Background)}.fd-toolbar--solid{background-color:var(--fdToolbar_Solid_Background)}.fd-toolbar--transparent{background-color:var(--sapToolbar_Background)}.fd-toolbar--fade-in{-webkit-transition:visibility 0s linear 0s,opacity 1s;opacity:1;transition:visibility 0s linear 0s,opacity 1s;visibility:visible}.fd-toolbar--fade-out{-webkit-transition:visibility 0s linear 1s,opacity 1ms;opacity:0;transition:visibility 0s linear 1s,opacity 1ms;visibility:hidden}.fd-toolbar--info{background-color:var(--sapInfobar_NonInteractive_Background);color:var(--sapList_TextColor);outline:none;padding-left:.5rem;padding-right:1rem;position:relative}.fd-toolbar--info.fd-toolbar--active{background-color:var(--sapInfobar_Background);color:var(--sapInfobar_TextColor)}.fd-toolbar--info.fd-toolbar--active.is-hover,.fd-toolbar--info.fd-toolbar--active:hover{background-color:var(--sapInfobar_Hover_Background)}.fd-toolbar--info.fd-toolbar--active.is-active,.fd-toolbar--info.fd-toolbar--active:active{background-color:var(--sapInfobar_Active_Background)}.fd-toolbar--info[dir=rtl],[dir=rtl] .fd-toolbar--info{padding-left:1rem;padding-right:.5rem}.fd-toolbar--info.is-focus:after,.fd-toolbar--info:focus:after{border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:.0625rem;pointer-events:none;position:absolute}.fd-toolbar--info.is-focus,.fd-toolbar--info:focus{z-index:5}.fd-toolbar--info.is-focus:after,.fd-toolbar--info:focus:after{border-color:var(--fdToolbar_Info_Outline_Color)}.fd-toolbar--info [class*=sap-icon]{color:var(--sapInfobar_TextColor);font-size:1rem;height:1rem;line-height:1rem}.fd-toolbar__spacer{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1 auto;border:0;box-sizing:border-box;color:var(--sapTextColor);flex:1 auto;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:100%;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-toolbar__spacer:after,.fd-toolbar__spacer:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__spacer--fixed{-webkit-box-flex:0;-ms-flex:none;display:inline-block;flex:none}.fd-toolbar__separator{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_SeparatorColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:1.5rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:.0625rem}.fd-toolbar__separator:after,.fd-toolbar__separator:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;max-height:50vh;max-width:20rem;overflow:auto;padding:.1875rem .375rem}.fd-toolbar__overflow:after,.fd-toolbar__overflow:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-button{justify-content:flex-start;margin:.1875rem 0;text-align:left;width:auto}.fd-toolbar__overflow .fd-toolbar__overflow-button[dir=rtl],[dir=rtl] .fd-toolbar__overflow .fd-toolbar__overflow-button{text-align:right}.fd-toolbar__overflow .fd-toolbar__overflow-button--menu{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;display:flex;justify-content:center;justify-content:space-between;max-width:100%}.fd-toolbar__overflow .fd-toolbar__separator{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_SeparatorColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:.0625rem;line-height:var(--sapContent_LineHeight);margin:.1875rem;padding:0;width:auto}.fd-toolbar__overflow .fd-toolbar__separator:after,.fd-toolbar__overflow .fd-toolbar__separator:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-form-label,.fd-toolbar__overflow .fd-toolbar__overflow-label{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-toolbar__overflow .fd-toolbar__overflow-form-label:after,.fd-toolbar__overflow .fd-toolbar__overflow-form-label:before,.fd-toolbar__overflow .fd-toolbar__overflow-label:after,.fd-toolbar__overflow .fd-toolbar__overflow-label:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-form-label--text,.fd-toolbar__overflow .fd-toolbar__overflow-label--text{margin-top:.4375rem}.fd-toolbar__title{color:var(--sapGroup_TitleTextColor)}.fd-toolbar--cozy{height:2.75rem;min-height:2.75rem}.fd-toolbar--cozy.fd-toolbar--info{height:2rem;min-height:2rem}.fd-toolbar--cozy .fd-toolbar__overflow{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:.25rem .5rem}.fd-toolbar--cozy .fd-toolbar__overflow:after,.fd-toolbar--cozy .fd-toolbar__overflow:before{box-sizing:inherit;font-size:inherit}.fd-toolbar>*{flex-shrink:0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i4.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["disableScrollbar"] }, { kind: "component", type: i4.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    ], queries: [{ propertyName: "titleComponent", first: true, predicate: TitleToken, descendants: true }, { propertyName: "toolbarItems", predicate: i0.forwardRef(function () { return ToolbarItemDirective; }) }], viewQueries: [{ propertyName: "toolbar", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "overflowBody", first: true, predicate: ["overflowBody"], descendants: true }, { propertyName: "overflowSpacer", first: true, predicate: ["overflowSpacer"], descendants: true }], ngImport: i0, template: "<div #toolbar [tabindex]=\"tabindex\" [class.fd-toolbar--cozy]=\"_contentDensityObserver.isCozy$ | async\">\n    <h4 *ngIf=\"title\" class=\"fd-title fd-title--h4 fd-toolbar__title\">{{ title }}</h4>\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"shouldOverflow\">\n        <span #overflowSpacer class=\"fd-toolbar__spacer\"></span>\n\n        <span class=\"fd-toolbar__separator\" *ngIf=\"overflowVisibility | async\"></span>\n\n        <fd-popover placement=\"bottom-end\" [noArrow]=\"true\" class=\"fd-popover\">\n            <fd-popover-control>\n                <button\n                    *ngIf=\"overflowVisibility | async\"\n                    fd-button\n                    title=\"More\"\n                    aria-label=\"More\"\n                    aria-haspopup=\"true\"\n                    fdType=\"transparent\"\n                    glyph=\"overflow\"\n                ></button>\n            </fd-popover-control>\n\n            <fd-popover-body>\n                <div class=\"fd-toolbar__overflow\" #overflowBody></div>\n            </fd-popover-body>\n        </fd-popover>\n    </ng-container>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.26.0-rc.27\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 */.fd-toolbar>*~:not(.fd-toolbar__spacer){margin-left:.5rem}.fd-toolbar>*~[dir=rtl]:not(.fd-toolbar__spacer),[dir=rtl] .fd-toolbar>*~:not(.fd-toolbar__spacer){margin-left:0;margin-right:.5rem}.fd-toolbar{-webkit-box-sizing:border-box;align-items:center;border:0;border-bottom:.0625rem solid var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 .5rem}.fd-toolbar:after,.fd-toolbar:before{box-sizing:inherit;font-size:inherit}.fd-toolbar>.fd-toolbar__spacer+:not(.fd-toolbar__spacer){margin-left:0;margin-right:0}.fd-toolbar--title{height:2.75rem;padding:0 .5rem 0 1rem}.fd-toolbar--clear{border-bottom:none}.fd-toolbar--auto{background-color:var(--fdToolbar_Auto_Background)}.fd-toolbar--solid{background-color:var(--fdToolbar_Solid_Background)}.fd-toolbar--transparent{background-color:var(--sapToolbar_Background)}.fd-toolbar--fade-in{-webkit-transition:visibility 0s linear 0s,opacity 1s;opacity:1;transition:visibility 0s linear 0s,opacity 1s;visibility:visible}.fd-toolbar--fade-out{-webkit-transition:visibility 0s linear 1s,opacity 1ms;opacity:0;transition:visibility 0s linear 1s,opacity 1ms;visibility:hidden}.fd-toolbar--info{background-color:var(--sapInfobar_NonInteractive_Background);color:var(--sapList_TextColor);outline:none;padding-left:.5rem;padding-right:1rem;position:relative}.fd-toolbar--info.fd-toolbar--active{background-color:var(--sapInfobar_Background);color:var(--sapInfobar_TextColor)}.fd-toolbar--info.fd-toolbar--active.is-hover,.fd-toolbar--info.fd-toolbar--active:hover{background-color:var(--sapInfobar_Hover_Background)}.fd-toolbar--info.fd-toolbar--active.is-active,.fd-toolbar--info.fd-toolbar--active:active{background-color:var(--sapInfobar_Active_Background)}.fd-toolbar--info[dir=rtl],[dir=rtl] .fd-toolbar--info{padding-left:1rem;padding-right:.5rem}.fd-toolbar--info.is-focus:after,.fd-toolbar--info:focus:after{border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:.0625rem;pointer-events:none;position:absolute}.fd-toolbar--info.is-focus,.fd-toolbar--info:focus{z-index:5}.fd-toolbar--info.is-focus:after,.fd-toolbar--info:focus:after{border-color:var(--fdToolbar_Info_Outline_Color)}.fd-toolbar--info [class*=sap-icon]{color:var(--sapInfobar_TextColor);font-size:1rem;height:1rem;line-height:1rem}.fd-toolbar__spacer{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1 auto;border:0;box-sizing:border-box;color:var(--sapTextColor);flex:1 auto;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:100%;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-toolbar__spacer:after,.fd-toolbar__spacer:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__spacer--fixed{-webkit-box-flex:0;-ms-flex:none;display:inline-block;flex:none}.fd-toolbar__separator{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_SeparatorColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:1.5rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:.0625rem}.fd-toolbar__separator:after,.fd-toolbar__separator:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;max-height:50vh;max-width:20rem;overflow:auto;padding:.1875rem .375rem}.fd-toolbar__overflow:after,.fd-toolbar__overflow:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-button{justify-content:flex-start;margin:.1875rem 0;text-align:left;width:auto}.fd-toolbar__overflow .fd-toolbar__overflow-button[dir=rtl],[dir=rtl] .fd-toolbar__overflow .fd-toolbar__overflow-button{text-align:right}.fd-toolbar__overflow .fd-toolbar__overflow-button--menu{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;display:flex;justify-content:center;justify-content:space-between;max-width:100%}.fd-toolbar__overflow .fd-toolbar__separator{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_SeparatorColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:.0625rem;line-height:var(--sapContent_LineHeight);margin:.1875rem;padding:0;width:auto}.fd-toolbar__overflow .fd-toolbar__separator:after,.fd-toolbar__overflow .fd-toolbar__separator:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-form-label,.fd-toolbar__overflow .fd-toolbar__overflow-label{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-toolbar__overflow .fd-toolbar__overflow-form-label:after,.fd-toolbar__overflow .fd-toolbar__overflow-form-label:before,.fd-toolbar__overflow .fd-toolbar__overflow-label:after,.fd-toolbar__overflow .fd-toolbar__overflow-label:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-form-label--text,.fd-toolbar__overflow .fd-toolbar__overflow-label--text{margin-top:.4375rem}.fd-toolbar__title{color:var(--sapGroup_TitleTextColor)}.fd-toolbar--cozy{height:2.75rem;min-height:2.75rem}.fd-toolbar--cozy.fd-toolbar--info{height:2rem;min-height:2rem}.fd-toolbar--cozy .fd-toolbar__overflow{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:.25rem .5rem}.fd-toolbar--cozy .fd-toolbar__overflow:after,.fd-toolbar--cozy .fd-toolbar__overflow:before{box-sizing:inherit;font-size:inherit}.fd-toolbar>*{flex-shrink:0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i4.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i4.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     applyCssClass,
     __metadata("design:type", Function),
@@ -413,7 +413,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImpor
                         contentDensityObserverProviders({
                             defaultContentDensity: ContentDensityMode.COMPACT
                         })
-                    ], template: "<div #toolbar [tabindex]=\"tabindex\" [class.fd-toolbar--cozy]=\"_contentDensityObserver.isCozy$ | async\">\n    <h4 *ngIf=\"title\" class=\"fd-title fd-title--h4 fd-toolbar__title\">{{ title }}</h4>\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"shouldOverflow\">\n        <span #overflowSpacer class=\"fd-toolbar__spacer\"></span>\n\n        <span class=\"fd-toolbar__separator\" *ngIf=\"overflowVisibility | async\"></span>\n\n        <fd-popover placement=\"bottom-end\" [noArrow]=\"true\" class=\"fd-popover\">\n            <fd-popover-control>\n                <button\n                    *ngIf=\"overflowVisibility | async\"\n                    fd-button\n                    title=\"More\"\n                    aria-label=\"More\"\n                    aria-haspopup=\"true\"\n                    fdType=\"transparent\"\n                    glyph=\"overflow\"\n                ></button>\n            </fd-popover-control>\n\n            <fd-popover-body>\n                <div class=\"fd-toolbar__overflow\" #overflowBody></div>\n            </fd-popover-body>\n        </fd-popover>\n    </ng-container>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.25.1-rc.16\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 */.fd-toolbar>*~:not(.fd-toolbar__spacer){margin-left:.5rem}.fd-toolbar>*~[dir=rtl]:not(.fd-toolbar__spacer),[dir=rtl] .fd-toolbar>*~:not(.fd-toolbar__spacer){margin-left:0;margin-right:.5rem}.fd-toolbar{-webkit-box-sizing:border-box;align-items:center;border:0;border-bottom:.0625rem solid var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 .5rem}.fd-toolbar:after,.fd-toolbar:before{box-sizing:inherit;font-size:inherit}.fd-toolbar>.fd-toolbar__spacer+:not(.fd-toolbar__spacer){margin-left:0;margin-right:0}.fd-toolbar--title{height:2.75rem;padding:0 .5rem 0 1rem}.fd-toolbar--clear{border-bottom:none}.fd-toolbar--auto{background-color:var(--fdToolbar_Auto_Background)}.fd-toolbar--solid{background-color:var(--fdToolbar_Solid_Background)}.fd-toolbar--transparent{background-color:var(--sapToolbar_Background)}.fd-toolbar--fade-in{-webkit-transition:visibility 0s linear 0s,opacity 1s;opacity:1;transition:visibility 0s linear 0s,opacity 1s;visibility:visible}.fd-toolbar--fade-out{-webkit-transition:visibility 0s linear 1s,opacity 1ms;opacity:0;transition:visibility 0s linear 1s,opacity 1ms;visibility:hidden}.fd-toolbar--info{background-color:var(--sapInfobar_NonInteractive_Background);color:var(--sapList_TextColor);outline:none;padding-left:.5rem;padding-right:1rem;position:relative}.fd-toolbar--info.fd-toolbar--active{background-color:var(--sapInfobar_Background);color:var(--sapInfobar_TextColor)}.fd-toolbar--info.fd-toolbar--active.is-hover,.fd-toolbar--info.fd-toolbar--active:hover{background-color:var(--sapInfobar_Hover_Background)}.fd-toolbar--info.fd-toolbar--active.is-active,.fd-toolbar--info.fd-toolbar--active:active{background-color:var(--sapInfobar_Active_Background)}.fd-toolbar--info[dir=rtl],[dir=rtl] .fd-toolbar--info{padding-left:1rem;padding-right:.5rem}.fd-toolbar--info.is-focus:after,.fd-toolbar--info:focus:after{border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:.0625rem;pointer-events:none;position:absolute}.fd-toolbar--info.is-focus,.fd-toolbar--info:focus{z-index:5}.fd-toolbar--info.is-focus:after,.fd-toolbar--info:focus:after{border-color:var(--fdToolbar_Info_Outline_Color)}.fd-toolbar--info [class*=sap-icon]{color:var(--sapInfobar_TextColor);font-size:1rem;height:1rem;line-height:1rem}.fd-toolbar__spacer{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1 auto;border:0;box-sizing:border-box;color:var(--sapTextColor);flex:1 auto;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:100%;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-toolbar__spacer:after,.fd-toolbar__spacer:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__spacer--fixed{-webkit-box-flex:0;-ms-flex:none;display:inline-block;flex:none}.fd-toolbar__separator{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_SeparatorColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:1.5rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:.0625rem}.fd-toolbar__separator:after,.fd-toolbar__separator:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;max-height:50vh;max-width:20rem;overflow:auto;padding:.1875rem .375rem}.fd-toolbar__overflow:after,.fd-toolbar__overflow:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-button{justify-content:flex-start;margin:.1875rem 0;text-align:left;width:auto}.fd-toolbar__overflow .fd-toolbar__overflow-button[dir=rtl],[dir=rtl] .fd-toolbar__overflow .fd-toolbar__overflow-button{text-align:right}.fd-toolbar__overflow .fd-toolbar__overflow-button--menu{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;display:flex;justify-content:center;justify-content:space-between;max-width:100%}.fd-toolbar__overflow .fd-toolbar__separator{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_SeparatorColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:.0625rem;line-height:var(--sapContent_LineHeight);margin:.1875rem;padding:0;width:auto}.fd-toolbar__overflow .fd-toolbar__separator:after,.fd-toolbar__overflow .fd-toolbar__separator:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-form-label,.fd-toolbar__overflow .fd-toolbar__overflow-label{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-toolbar__overflow .fd-toolbar__overflow-form-label:after,.fd-toolbar__overflow .fd-toolbar__overflow-form-label:before,.fd-toolbar__overflow .fd-toolbar__overflow-label:after,.fd-toolbar__overflow .fd-toolbar__overflow-label:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-form-label--text,.fd-toolbar__overflow .fd-toolbar__overflow-label--text{margin-top:.4375rem}.fd-toolbar__title{color:var(--sapGroup_TitleTextColor)}.fd-toolbar--cozy{height:2.75rem;min-height:2.75rem}.fd-toolbar--cozy.fd-toolbar--info{height:2rem;min-height:2rem}.fd-toolbar--cozy .fd-toolbar__overflow{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:.25rem .5rem}.fd-toolbar--cozy .fd-toolbar__overflow:after,.fd-toolbar--cozy .fd-toolbar__overflow:before{box-sizing:inherit;font-size:inherit}.fd-toolbar>*{flex-shrink:0}\n"] }]
+                    ], template: "<div #toolbar [tabindex]=\"tabindex\" [class.fd-toolbar--cozy]=\"_contentDensityObserver.isCozy$ | async\">\n    <h4 *ngIf=\"title\" class=\"fd-title fd-title--h4 fd-toolbar__title\">{{ title }}</h4>\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"shouldOverflow\">\n        <span #overflowSpacer class=\"fd-toolbar__spacer\"></span>\n\n        <span class=\"fd-toolbar__separator\" *ngIf=\"overflowVisibility | async\"></span>\n\n        <fd-popover placement=\"bottom-end\" [noArrow]=\"true\" class=\"fd-popover\">\n            <fd-popover-control>\n                <button\n                    *ngIf=\"overflowVisibility | async\"\n                    fd-button\n                    title=\"More\"\n                    aria-label=\"More\"\n                    aria-haspopup=\"true\"\n                    fdType=\"transparent\"\n                    glyph=\"overflow\"\n                ></button>\n            </fd-popover-control>\n\n            <fd-popover-body>\n                <div class=\"fd-toolbar__overflow\" #overflowBody></div>\n            </fd-popover-body>\n        </fd-popover>\n    </ng-container>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.26.0-rc.27\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 */.fd-toolbar>*~:not(.fd-toolbar__spacer){margin-left:.5rem}.fd-toolbar>*~[dir=rtl]:not(.fd-toolbar__spacer),[dir=rtl] .fd-toolbar>*~:not(.fd-toolbar__spacer){margin-left:0;margin-right:.5rem}.fd-toolbar{-webkit-box-sizing:border-box;align-items:center;border:0;border-bottom:.0625rem solid var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 .5rem}.fd-toolbar:after,.fd-toolbar:before{box-sizing:inherit;font-size:inherit}.fd-toolbar>.fd-toolbar__spacer+:not(.fd-toolbar__spacer){margin-left:0;margin-right:0}.fd-toolbar--title{height:2.75rem;padding:0 .5rem 0 1rem}.fd-toolbar--clear{border-bottom:none}.fd-toolbar--auto{background-color:var(--fdToolbar_Auto_Background)}.fd-toolbar--solid{background-color:var(--fdToolbar_Solid_Background)}.fd-toolbar--transparent{background-color:var(--sapToolbar_Background)}.fd-toolbar--fade-in{-webkit-transition:visibility 0s linear 0s,opacity 1s;opacity:1;transition:visibility 0s linear 0s,opacity 1s;visibility:visible}.fd-toolbar--fade-out{-webkit-transition:visibility 0s linear 1s,opacity 1ms;opacity:0;transition:visibility 0s linear 1s,opacity 1ms;visibility:hidden}.fd-toolbar--info{background-color:var(--sapInfobar_NonInteractive_Background);color:var(--sapList_TextColor);outline:none;padding-left:.5rem;padding-right:1rem;position:relative}.fd-toolbar--info.fd-toolbar--active{background-color:var(--sapInfobar_Background);color:var(--sapInfobar_TextColor)}.fd-toolbar--info.fd-toolbar--active.is-hover,.fd-toolbar--info.fd-toolbar--active:hover{background-color:var(--sapInfobar_Hover_Background)}.fd-toolbar--info.fd-toolbar--active.is-active,.fd-toolbar--info.fd-toolbar--active:active{background-color:var(--sapInfobar_Active_Background)}.fd-toolbar--info[dir=rtl],[dir=rtl] .fd-toolbar--info{padding-left:1rem;padding-right:.5rem}.fd-toolbar--info.is-focus:after,.fd-toolbar--info:focus:after{border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:.0625rem;pointer-events:none;position:absolute}.fd-toolbar--info.is-focus,.fd-toolbar--info:focus{z-index:5}.fd-toolbar--info.is-focus:after,.fd-toolbar--info:focus:after{border-color:var(--fdToolbar_Info_Outline_Color)}.fd-toolbar--info [class*=sap-icon]{color:var(--sapInfobar_TextColor);font-size:1rem;height:1rem;line-height:1rem}.fd-toolbar__spacer{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1 auto;border:0;box-sizing:border-box;color:var(--sapTextColor);flex:1 auto;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:100%;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-toolbar__spacer:after,.fd-toolbar__spacer:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__spacer--fixed{-webkit-box-flex:0;-ms-flex:none;display:inline-block;flex:none}.fd-toolbar__separator{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_SeparatorColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:1.5rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:.0625rem}.fd-toolbar__separator:after,.fd-toolbar__separator:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;max-height:50vh;max-width:20rem;overflow:auto;padding:.1875rem .375rem}.fd-toolbar__overflow:after,.fd-toolbar__overflow:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-button{justify-content:flex-start;margin:.1875rem 0;text-align:left;width:auto}.fd-toolbar__overflow .fd-toolbar__overflow-button[dir=rtl],[dir=rtl] .fd-toolbar__overflow .fd-toolbar__overflow-button{text-align:right}.fd-toolbar__overflow .fd-toolbar__overflow-button--menu{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;display:flex;justify-content:center;justify-content:space-between;max-width:100%}.fd-toolbar__overflow .fd-toolbar__separator{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_SeparatorColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:.0625rem;line-height:var(--sapContent_LineHeight);margin:.1875rem;padding:0;width:auto}.fd-toolbar__overflow .fd-toolbar__separator:after,.fd-toolbar__overflow .fd-toolbar__separator:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-form-label,.fd-toolbar__overflow .fd-toolbar__overflow-label{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-toolbar__overflow .fd-toolbar__overflow-form-label:after,.fd-toolbar__overflow .fd-toolbar__overflow-form-label:before,.fd-toolbar__overflow .fd-toolbar__overflow-label:after,.fd-toolbar__overflow .fd-toolbar__overflow-label:before{box-sizing:inherit;font-size:inherit}.fd-toolbar__overflow .fd-toolbar__overflow-form-label--text,.fd-toolbar__overflow .fd-toolbar__overflow-label--text{margin-top:.4375rem}.fd-toolbar__title{color:var(--sapGroup_TitleTextColor)}.fd-toolbar--cozy{height:2.75rem;min-height:2.75rem}.fd-toolbar--cozy.fd-toolbar--info{height:2rem;min-height:2rem}.fd-toolbar--cozy .fd-toolbar__overflow{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:.25rem .5rem}.fd-toolbar--cozy .fd-toolbar__overflow:after,.fd-toolbar--cozy .fd-toolbar__overflow:before{box-sizing:inherit;font-size:inherit}.fd-toolbar>*{flex-shrink:0}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i1.ContentDensityObserver }, { type: undefined, decorators: [{
                     type: Optional
                 }, {

package/esm2020/tree/tree-child.component.mjs CHANGED Viewed

@@ -48,7 +48,7 @@ export class TreeChildComponent {
     }
 }
 TreeChildComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: TreeChildComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TreeChildComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: TreeChildComponent, selector: "fd-tree-child", inputs: { row: "row", hideChildren: "hideChildren", displayTreeActions: "displayTreeActions" }, outputs: { editClicked: "editClicked", deleteClicked: "deleteClicked" }, ngImport: i0, template: "<li #treeChild class=\"fd-tree__item\" role=\"treeitem\">\n    <div class=\"fd-tree__row\">\n        <div\n            *ngFor=\"let cell of row.rowData; let i = index\"\n            [attr.data-index]=\"i\"\n            class=\"fd-tree__col\"\n            [class.fd-tree__col--control]=\"i === 0\"\n        >\n            <button\n                (click)=\"toggleDisplayChildren()\"\n                *ngIf=\"row.children && i === 0\"\n                class=\"fd-tree__control\"\n                aria-label=\"Expand\"\n                [class.is-pressed]=\"!hideChildren\"\n                [attr.aria-pressed]=\"!hideChildren\"\n            ></button>\n            <ng-container *ngIf=\"typeOf(cell) === 'string'\">\n                {{ cell }}\n            </ng-container>\n            <ng-container *ngIf=\"typeOf(cell) === 'object'\">\n                <ng-container *ngIf=\"cell.linkUrl\">\n                    <ng-container *ngIf=\"cell.displayText\">\n                        <!-- link with display text -->\n                        <a [attr.href]=\"cell.linkUrl\" class=\"fd-has-font-weight-semi\">{{ cell.displayText }}</a>\n                    </ng-container>\n                    <ng-container *ngIf=\"!cell.displayText\">\n                        <!-- link without display text -->\n                        <a [attr.href]=\"cell.linkUrl\" class=\"fd-has-font-weight-semi\">{{ cell.linkUrl }}</a>\n                    </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!cell.linkUrl\">\n                    {{ cell.displayText }}\n                </ng-container>\n            </ng-container>\n        </div>\n        <div class=\"fd-tree__col fd-tree__col--actions\">\n            <ng-container *ngIf=\"displayTreeActions\">\n                <button fd-button fdType=\"transparent\" glyph=\"vertical-grip\" [fdMenuTrigger]=\"menu\"></button>\n\n                <fd-menu #menu>\n                    <li fd-menu-item (click)=\"editTreeItem(row)\">\n                        <div fd-menu-interactive>\n                            <span fd-menu-title>Edit</span>\n                        </div>\n                    </li>\n                    <li fd-menu-item (click)=\"deleteTreeItem(row)\">\n                        <div fd-menu-interactive>\n                            <span fd-menu-title>Delete</span>\n                        </div>\n                    </li>\n                </fd-menu>\n            </ng-container>\n        </div>\n    </div>\n    <ul\n        *ngIf=\"row.children && row.children.length > 0\"\n        [class.is-hidden]=\"hideChildren\"\n        class=\"fd-tree__group\"\n        role=\"group\"\n    >\n        <fd-tree-child\n            *ngFor=\"let child of row.children\"\n            [displayTreeActions]=\"displayTreeActions\"\n            [row]=\"child\"\n            [class]=\"child.sublevelClass\"\n        >\n        </fd-tree-child>\n    </ul>\n</li>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i3.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "directive", type: i3.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i3.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i3.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: TreeChildComponent, selector: "fd-tree-child", inputs: ["row", "hideChildren", "displayTreeActions"], outputs: ["editClicked", "deleteClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+TreeChildComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: TreeChildComponent, selector: "fd-tree-child", inputs: { row: "row", hideChildren: "hideChildren", displayTreeActions: "displayTreeActions" }, outputs: { editClicked: "editClicked", deleteClicked: "deleteClicked" }, ngImport: i0, template: "<li #treeChild class=\"fd-tree__item\" role=\"treeitem\">\n    <div class=\"fd-tree__row\">\n        <div\n            *ngFor=\"let cell of row.rowData; let i = index\"\n            [attr.data-index]=\"i\"\n            class=\"fd-tree__col\"\n            [class.fd-tree__col--control]=\"i === 0\"\n        >\n            <button\n                (click)=\"toggleDisplayChildren()\"\n                *ngIf=\"row.children && i === 0\"\n                class=\"fd-tree__control\"\n                aria-label=\"Expand\"\n                [class.is-pressed]=\"!hideChildren\"\n                [attr.aria-pressed]=\"!hideChildren\"\n            ></button>\n            <ng-container *ngIf=\"typeOf(cell) === 'string'\">\n                {{ cell }}\n            </ng-container>\n            <ng-container *ngIf=\"typeOf(cell) === 'object'\">\n                <ng-container *ngIf=\"cell.linkUrl\">\n                    <ng-container *ngIf=\"cell.displayText\">\n                        <!-- link with display text -->\n                        <a [attr.href]=\"cell.linkUrl\" class=\"fd-has-font-weight-semi\">{{ cell.displayText }}</a>\n                    </ng-container>\n                    <ng-container *ngIf=\"!cell.displayText\">\n                        <!-- link without display text -->\n                        <a [attr.href]=\"cell.linkUrl\" class=\"fd-has-font-weight-semi\">{{ cell.linkUrl }}</a>\n                    </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!cell.linkUrl\">\n                    {{ cell.displayText }}\n                </ng-container>\n            </ng-container>\n        </div>\n        <div class=\"fd-tree__col fd-tree__col--actions\">\n            <ng-container *ngIf=\"displayTreeActions\">\n                <button fd-button fdType=\"transparent\" glyph=\"vertical-grip\" [fdMenuTrigger]=\"menu\"></button>\n\n                <fd-menu #menu>\n                    <li fd-menu-item (click)=\"editTreeItem(row)\">\n                        <div fd-menu-interactive>\n                            <span fd-menu-title>Edit</span>\n                        </div>\n                    </li>\n                    <li fd-menu-item (click)=\"deleteTreeItem(row)\">\n                        <div fd-menu-interactive>\n                            <span fd-menu-title>Delete</span>\n                        </div>\n                    </li>\n                </fd-menu>\n            </ng-container>\n        </div>\n    </div>\n    <ul\n        *ngIf=\"row.children && row.children.length > 0\"\n        [class.is-hidden]=\"hideChildren\"\n        class=\"fd-tree__group\"\n        role=\"group\"\n    >\n        <fd-tree-child\n            *ngFor=\"let child of row.children\"\n            [displayTreeActions]=\"displayTreeActions\"\n            [row]=\"child\"\n            [class]=\"child.sublevelClass\"\n        >\n        </fd-tree-child>\n    </ul>\n</li>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "tabbableScrollbar", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i3.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "directive", type: i3.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i3.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i3.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: TreeChildComponent, selector: "fd-tree-child", inputs: ["row", "hideChildren", "displayTreeActions"], outputs: ["editClicked", "deleteClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: TreeChildComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-tree-child', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<li #treeChild class=\"fd-tree__item\" role=\"treeitem\">\n    <div class=\"fd-tree__row\">\n        <div\n            *ngFor=\"let cell of row.rowData; let i = index\"\n            [attr.data-index]=\"i\"\n            class=\"fd-tree__col\"\n            [class.fd-tree__col--control]=\"i === 0\"\n        >\n            <button\n                (click)=\"toggleDisplayChildren()\"\n                *ngIf=\"row.children && i === 0\"\n                class=\"fd-tree__control\"\n                aria-label=\"Expand\"\n                [class.is-pressed]=\"!hideChildren\"\n                [attr.aria-pressed]=\"!hideChildren\"\n            ></button>\n            <ng-container *ngIf=\"typeOf(cell) === 'string'\">\n                {{ cell }}\n            </ng-container>\n            <ng-container *ngIf=\"typeOf(cell) === 'object'\">\n                <ng-container *ngIf=\"cell.linkUrl\">\n                    <ng-container *ngIf=\"cell.displayText\">\n                        <!-- link with display text -->\n                        <a [attr.href]=\"cell.linkUrl\" class=\"fd-has-font-weight-semi\">{{ cell.displayText }}</a>\n                    </ng-container>\n                    <ng-container *ngIf=\"!cell.displayText\">\n                        <!-- link without display text -->\n                        <a [attr.href]=\"cell.linkUrl\" class=\"fd-has-font-weight-semi\">{{ cell.linkUrl }}</a>\n                    </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!cell.linkUrl\">\n                    {{ cell.displayText }}\n                </ng-container>\n            </ng-container>\n        </div>\n        <div class=\"fd-tree__col fd-tree__col--actions\">\n            <ng-container *ngIf=\"displayTreeActions\">\n                <button fd-button fdType=\"transparent\" glyph=\"vertical-grip\" [fdMenuTrigger]=\"menu\"></button>\n\n                <fd-menu #menu>\n                    <li fd-menu-item (click)=\"editTreeItem(row)\">\n                        <div fd-menu-interactive>\n                            <span fd-menu-title>Edit</span>\n                        </div>\n                    </li>\n                    <li fd-menu-item (click)=\"deleteTreeItem(row)\">\n                        <div fd-menu-interactive>\n                            <span fd-menu-title>Delete</span>\n                        </div>\n                    </li>\n                </fd-menu>\n            </ng-container>\n        </div>\n    </div>\n    <ul\n        *ngIf=\"row.children && row.children.length > 0\"\n        [class.is-hidden]=\"hideChildren\"\n        class=\"fd-tree__group\"\n        role=\"group\"\n    >\n        <fd-tree-child\n            *ngFor=\"let child of row.children\"\n            [displayTreeActions]=\"displayTreeActions\"\n            [row]=\"child\"\n            [class]=\"child.sublevelClass\"\n        >\n        </fd-tree-child>\n    </ul>\n</li>\n" }]
@@ -63,4 +63,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImpor
             }], deleteClicked: [{
                 type: Output
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHJlZS1jaGlsZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzL2NvcmUvc3JjL2xpYi90cmVlL3RyZWUtY2hpbGQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vbGlicy9jb3JlL3NyYy9saWIvdHJlZS90cmVlLWNoaWxkLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDSCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixLQUFLLEVBRUwsTUFBTSxFQUNOLGlCQUFpQixFQUNwQixNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFTdkIsTUFBTSxPQUFPLGtCQUFrQjtJQU4vQjtRQWdCSSxjQUFjO1FBQ0osZ0JBQVcsR0FBc0IsSUFBSSxZQUFZLEVBQU8sQ0FBQztRQUVuRSxjQUFjO1FBQ0osa0JBQWEsR0FBc0IsSUFBSSxZQUFZLEVBQU8sQ0FBQztLQXlDeEU7SUF2Q0csY0FBYztJQUNkLFFBQVE7UUFDSixJQUFJLENBQUMsWUFBWSxHQUFHLEtBQUssQ0FBQztJQUM5QixDQUFDO0lBRUQsY0FBYztJQUNkLHFCQUFxQixDQUFDLE9BQVE7UUFDMUIsSUFBSSxPQUFPLEtBQUssU0FBUyxFQUFFO1lBQ3ZCLElBQUksQ0FBQyxZQUFZLEdBQUcsT0FBTyxDQUFDO1NBQy9CO2FBQU07WUFDSCxJQUFJLENBQUMsWUFBWSxHQUFHLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQztTQUMxQztJQUNMLENBQUM7SUFFRCxjQUFjO0lBQ2QsTUFBTSxDQUFDLFFBQVM7UUFDWixJQUFJLE1BQU0sQ0FBQztRQUNYLElBQUksT0FBTyxRQUFRLEtBQUssUUFBUSxFQUFFO1lBQzlCLE1BQU0sR0FBRyxRQUFRLENBQUM7U0FDckI7YUFBTSxJQUFJLE9BQU8sUUFBUSxLQUFLLFFBQVEsRUFBRTtZQUNyQyxNQUFNLEdBQUcsUUFBUSxDQUFDO1NBQ3JCO1FBRUQsT0FBTyxNQUFNLENBQUM7SUFDbEIsQ0FBQztJQUVELGNBQWM7SUFDZCxZQUFZLENBQUMsR0FBSTtRQUNiLElBQUksR0FBRyxFQUFFO1lBQ0wsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7U0FDOUI7SUFDTCxDQUFDO0lBRUQsY0FBYztJQUNkLGNBQWMsQ0FBQyxHQUFJO1FBQ2YsSUFBSSxHQUFHLEVBQUU7WUFDTCxJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztTQUNoQztJQUNMLENBQUM7OytHQXREUSxrQkFBa0I7bUdBQWxCLGtCQUFrQiw4TkNqQi9CLGczRkFxRUEsdWpDRHBEYSxrQkFBa0I7MkZBQWxCLGtCQUFrQjtrQkFOOUIsU0FBUzsrQkFDSSxlQUFlLGlCQUVWLGlCQUFpQixDQUFDLElBQUksbUJBQ3BCLHVCQUF1QixDQUFDLE1BQU07OEJBSXRDLEdBQUc7c0JBQVgsS0FBSztnQkFHRyxZQUFZO3NCQUFwQixLQUFLO2dCQUdHLGtCQUFrQjtzQkFBMUIsS0FBSztnQkFHSSxXQUFXO3NCQUFwQixNQUFNO2dCQUdHLGFBQWE7c0JBQXRCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBFdmVudEVtaXR0ZXIsXG4gICAgSW5wdXQsXG4gICAgT25Jbml0LFxuICAgIE91dHB1dCxcbiAgICBWaWV3RW5jYXBzdWxhdGlvblxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFRyZWVSb3dPYmplY3QgfSBmcm9tICcuL3RyZWUtcm93LW9iamVjdC5tb2RlbCc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnZmQtdHJlZS1jaGlsZCcsXG4gICAgdGVtcGxhdGVVcmw6ICcuL3RyZWUtY2hpbGQuY29tcG9uZW50Lmh0bWwnLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2hcbn0pXG5leHBvcnQgY2xhc3MgVHJlZUNoaWxkQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIEBJbnB1dCgpIHJvdzogVHJlZVJvd09iamVjdDtcblxuICAgIC8qKiBAaGlkZGVuICovXG4gICAgQElucHV0KCkgaGlkZUNoaWxkcmVuOiBib29sZWFuO1xuXG4gICAgLyoqIEBoaWRkZW4gKi9cbiAgICBASW5wdXQoKSBkaXNwbGF5VHJlZUFjdGlvbnM6IGJvb2xlYW47XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIEBPdXRwdXQoKSBlZGl0Q2xpY2tlZDogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcblxuICAgIC8qKiBAaGlkZGVuICovXG4gICAgQE91dHB1dCgpIGRlbGV0ZUNsaWNrZWQ6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIG5nT25Jbml0KCk6IHZvaWQge1xuICAgICAgICB0aGlzLmhpZGVDaGlsZHJlbiA9IGZhbHNlO1xuICAgIH1cblxuICAgIC8qKiBAaGlkZGVuICovXG4gICAgdG9nZ2xlRGlzcGxheUNoaWxkcmVuKGhpZGVBbGw/KTogdm9pZCB7XG4gICAgICAgIGlmIChoaWRlQWxsICE9PSB1bmRlZmluZWQpIHtcbiAgICAgICAgICAgIHRoaXMuaGlkZUNoaWxkcmVuID0gaGlkZUFsbDtcbiAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgIHRoaXMuaGlkZUNoaWxkcmVuID0gIXRoaXMuaGlkZUNoaWxkcmVuO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgLyoqIEBoaWRkZW4gKi9cbiAgICB0eXBlT2YodmFyaWFibGU/KTogc3RyaW5nIHtcbiAgICAgICAgbGV0IHJldFZhbDtcbiAgICAgICAgaWYgKHR5cGVvZiB2YXJpYWJsZSA9PT0gJ3N0cmluZycpIHtcbiAgICAgICAgICAgIHJldFZhbCA9ICdzdHJpbmcnO1xuICAgICAgICB9IGVsc2UgaWYgKHR5cGVvZiB2YXJpYWJsZSA9PT0gJ29iamVjdCcpIHtcbiAgICAgICAgICAgIHJldFZhbCA9ICdvYmplY3QnO1xuICAgICAgICB9XG5cbiAgICAgICAgcmV0dXJuIHJldFZhbDtcbiAgICB9XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIGVkaXRUcmVlSXRlbShyb3c/KTogdm9pZCB7XG4gICAgICAgIGlmIChyb3cpIHtcbiAgICAgICAgICAgIHRoaXMuZWRpdENsaWNrZWQuZW1pdChyb3cpO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgLyoqIEBoaWRkZW4gKi9cbiAgICBkZWxldGVUcmVlSXRlbShyb3c/KTogdm9pZCB7XG4gICAgICAgIGlmIChyb3cpIHtcbiAgICAgICAgICAgIHRoaXMuZGVsZXRlQ2xpY2tlZC5lbWl0KHJvdyk7XG4gICAgICAgIH1cbiAgICB9XG59XG4iLCI8bGkgI3RyZWVDaGlsZCBjbGFzcz1cImZkLXRyZWVfX2l0ZW1cIiByb2xlPVwidHJlZWl0ZW1cIj5cbiAgICA8ZGl2IGNsYXNzPVwiZmQtdHJlZV9fcm93XCI+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICAgICpuZ0Zvcj1cImxldCBjZWxsIG9mIHJvdy5yb3dEYXRhOyBsZXQgaSA9IGluZGV4XCJcbiAgICAgICAgICAgIFthdHRyLmRhdGEtaW5kZXhdPVwiaVwiXG4gICAgICAgICAgICBjbGFzcz1cImZkLXRyZWVfX2NvbFwiXG4gICAgICAgICAgICBbY2xhc3MuZmQtdHJlZV9fY29sLS1jb250cm9sXT1cImkgPT09IDBcIlxuICAgICAgICA+XG4gICAgICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgICAgICAgKGNsaWNrKT1cInRvZ2dsZURpc3BsYXlDaGlsZHJlbigpXCJcbiAgICAgICAgICAgICAgICAqbmdJZj1cInJvdy5jaGlsZHJlbiAmJiBpID09PSAwXCJcbiAgICAgICAgICAgICAgICBjbGFzcz1cImZkLXRyZWVfX2NvbnRyb2xcIlxuICAgICAgICAgICAgICAgIGFyaWEtbGFiZWw9XCJFeHBhbmRcIlxuICAgICAgICAgICAgICAgIFtjbGFzcy5pcy1wcmVzc2VkXT1cIiFoaWRlQ2hpbGRyZW5cIlxuICAgICAgICAgICAgICAgIFthdHRyLmFyaWEtcHJlc3NlZF09XCIhaGlkZUNoaWxkcmVuXCJcbiAgICAgICAgICAgID48L2J1dHRvbj5cbiAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJ0eXBlT2YoY2VsbCkgPT09ICdzdHJpbmcnXCI+XG4gICAgICAgICAgICAgICAge3sgY2VsbCB9fVxuICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwidHlwZU9mKGNlbGwpID09PSAnb2JqZWN0J1wiPlxuICAgICAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJjZWxsLmxpbmtVcmxcIj5cbiAgICAgICAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImNlbGwuZGlzcGxheVRleHRcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwhLS0gbGluayB3aXRoIGRpc3BsYXkgdGV4dCAtLT5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxhIFthdHRyLmhyZWZdPVwiY2VsbC5saW5rVXJsXCIgY2xhc3M9XCJmZC1oYXMtZm9udC13ZWlnaHQtc2VtaVwiPnt7IGNlbGwuZGlzcGxheVRleHQgfX08L2E+XG4gICAgICAgICAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiIWNlbGwuZGlzcGxheVRleHRcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwhLS0gbGluayB3aXRob3V0IGRpc3BsYXkgdGV4dCAtLT5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxhIFthdHRyLmhyZWZdPVwiY2VsbC5saW5rVXJsXCIgY2xhc3M9XCJmZC1oYXMtZm9udC13ZWlnaHQtc2VtaVwiPnt7IGNlbGwubGlua1VybCB9fTwvYT5cbiAgICAgICAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIiFjZWxsLmxpbmtVcmxcIj5cbiAgICAgICAgICAgICAgICAgICAge3sgY2VsbC5kaXNwbGF5VGV4dCB9fVxuICAgICAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwiZmQtdHJlZV9fY29sIGZkLXRyZWVfX2NvbC0tYWN0aW9uc1wiPlxuICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImRpc3BsYXlUcmVlQWN0aW9uc1wiPlxuICAgICAgICAgICAgICAgIDxidXR0b24gZmQtYnV0dG9uIGZkVHlwZT1cInRyYW5zcGFyZW50XCIgZ2x5cGg9XCJ2ZXJ0aWNhbC1ncmlwXCIgW2ZkTWVudVRyaWdnZXJdPVwibWVudVwiPjwvYnV0dG9uPlxuXG4gICAgICAgICAgICAgICAgPGZkLW1lbnUgI21lbnU+XG4gICAgICAgICAgICAgICAgICAgIDxsaSBmZC1tZW51LWl0ZW0gKGNsaWNrKT1cImVkaXRUcmVlSXRlbShyb3cpXCI+XG4gICAgICAgICAgICAgICAgICAgICAgICA8ZGl2IGZkLW1lbnUtaW50ZXJhY3RpdmU+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPHNwYW4gZmQtbWVudS10aXRsZT5FZGl0PC9zcGFuPlxuICAgICAgICAgICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgICAgICAgIDwvbGk+XG4gICAgICAgICAgICAgICAgICAgIDxsaSBmZC1tZW51LWl0ZW0gKGNsaWNrKT1cImRlbGV0ZVRyZWVJdGVtKHJvdylcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxkaXYgZmQtbWVudS1pbnRlcmFjdGl2ZT5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8c3BhbiBmZC1tZW51LXRpdGxlPkRlbGV0ZTwvc3Bhbj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgICAgICA8L2xpPlxuICAgICAgICAgICAgICAgIDwvZmQtbWVudT5cbiAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgICA8dWxcbiAgICAgICAgKm5nSWY9XCJyb3cuY2hpbGRyZW4gJiYgcm93LmNoaWxkcmVuLmxlbmd0aCA+IDBcIlxuICAgICAgICBbY2xhc3MuaXMtaGlkZGVuXT1cImhpZGVDaGlsZHJlblwiXG4gICAgICAgIGNsYXNzPVwiZmQtdHJlZV9fZ3JvdXBcIlxuICAgICAgICByb2xlPVwiZ3JvdXBcIlxuICAgID5cbiAgICAgICAgPGZkLXRyZWUtY2hpbGRcbiAgICAgICAgICAgICpuZ0Zvcj1cImxldCBjaGlsZCBvZiByb3cuY2hpbGRyZW5cIlxuICAgICAgICAgICAgW2Rpc3BsYXlUcmVlQWN0aW9uc109XCJkaXNwbGF5VHJlZUFjdGlvbnNcIlxuICAgICAgICAgICAgW3Jvd109XCJjaGlsZFwiXG4gICAgICAgICAgICBbY2xhc3NdPVwiY2hpbGQuc3VibGV2ZWxDbGFzc1wiXG4gICAgICAgID5cbiAgICAgICAgPC9mZC10cmVlLWNoaWxkPlxuICAgIDwvdWw+XG48L2xpPlxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHJlZS1jaGlsZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzL2NvcmUvc3JjL2xpYi90cmVlL3RyZWUtY2hpbGQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vbGlicy9jb3JlL3NyYy9saWIvdHJlZS90cmVlLWNoaWxkLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDSCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixLQUFLLEVBRUwsTUFBTSxFQUNOLGlCQUFpQixFQUNwQixNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFTdkIsTUFBTSxPQUFPLGtCQUFrQjtJQU4vQjtRQWdCSSxjQUFjO1FBQ0osZ0JBQVcsR0FBc0IsSUFBSSxZQUFZLEVBQU8sQ0FBQztRQUVuRSxjQUFjO1FBQ0osa0JBQWEsR0FBc0IsSUFBSSxZQUFZLEVBQU8sQ0FBQztLQXlDeEU7SUF2Q0csY0FBYztJQUNkLFFBQVE7UUFDSixJQUFJLENBQUMsWUFBWSxHQUFHLEtBQUssQ0FBQztJQUM5QixDQUFDO0lBRUQsY0FBYztJQUNkLHFCQUFxQixDQUFDLE9BQVE7UUFDMUIsSUFBSSxPQUFPLEtBQUssU0FBUyxFQUFFO1lBQ3ZCLElBQUksQ0FBQyxZQUFZLEdBQUcsT0FBTyxDQUFDO1NBQy9CO2FBQU07WUFDSCxJQUFJLENBQUMsWUFBWSxHQUFHLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQztTQUMxQztJQUNMLENBQUM7SUFFRCxjQUFjO0lBQ2QsTUFBTSxDQUFDLFFBQVM7UUFDWixJQUFJLE1BQU0sQ0FBQztRQUNYLElBQUksT0FBTyxRQUFRLEtBQUssUUFBUSxFQUFFO1lBQzlCLE1BQU0sR0FBRyxRQUFRLENBQUM7U0FDckI7YUFBTSxJQUFJLE9BQU8sUUFBUSxLQUFLLFFBQVEsRUFBRTtZQUNyQyxNQUFNLEdBQUcsUUFBUSxDQUFDO1NBQ3JCO1FBRUQsT0FBTyxNQUFNLENBQUM7SUFDbEIsQ0FBQztJQUVELGNBQWM7SUFDZCxZQUFZLENBQUMsR0FBSTtRQUNiLElBQUksR0FBRyxFQUFFO1lBQ0wsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7U0FDOUI7SUFDTCxDQUFDO0lBRUQsY0FBYztJQUNkLGNBQWMsQ0FBQyxHQUFJO1FBQ2YsSUFBSSxHQUFHLEVBQUU7WUFDTCxJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztTQUNoQztJQUNMLENBQUM7OytHQXREUSxrQkFBa0I7bUdBQWxCLGtCQUFrQiw4TkNqQi9CLGczRkFxRUEsaW5DRHBEYSxrQkFBa0I7MkZBQWxCLGtCQUFrQjtrQkFOOUIsU0FBUzsrQkFDSSxlQUFlLGlCQUVWLGlCQUFpQixDQUFDLElBQUksbUJBQ3BCLHVCQUF1QixDQUFDLE1BQU07OEJBSXRDLEdBQUc7c0JBQVgsS0FBSztnQkFHRyxZQUFZO3NCQUFwQixLQUFLO2dCQUdHLGtCQUFrQjtzQkFBMUIsS0FBSztnQkFHSSxXQUFXO3NCQUFwQixNQUFNO2dCQUdHLGFBQWE7c0JBQXRCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBFdmVudEVtaXR0ZXIsXG4gICAgSW5wdXQsXG4gICAgT25Jbml0LFxuICAgIE91dHB1dCxcbiAgICBWaWV3RW5jYXBzdWxhdGlvblxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFRyZWVSb3dPYmplY3QgfSBmcm9tICcuL3RyZWUtcm93LW9iamVjdC5tb2RlbCc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnZmQtdHJlZS1jaGlsZCcsXG4gICAgdGVtcGxhdGVVcmw6ICcuL3RyZWUtY2hpbGQuY29tcG9uZW50Lmh0bWwnLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2hcbn0pXG5leHBvcnQgY2xhc3MgVHJlZUNoaWxkQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIEBJbnB1dCgpIHJvdzogVHJlZVJvd09iamVjdDtcblxuICAgIC8qKiBAaGlkZGVuICovXG4gICAgQElucHV0KCkgaGlkZUNoaWxkcmVuOiBib29sZWFuO1xuXG4gICAgLyoqIEBoaWRkZW4gKi9cbiAgICBASW5wdXQoKSBkaXNwbGF5VHJlZUFjdGlvbnM6IGJvb2xlYW47XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIEBPdXRwdXQoKSBlZGl0Q2xpY2tlZDogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcblxuICAgIC8qKiBAaGlkZGVuICovXG4gICAgQE91dHB1dCgpIGRlbGV0ZUNsaWNrZWQ6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIG5nT25Jbml0KCk6IHZvaWQge1xuICAgICAgICB0aGlzLmhpZGVDaGlsZHJlbiA9IGZhbHNlO1xuICAgIH1cblxuICAgIC8qKiBAaGlkZGVuICovXG4gICAgdG9nZ2xlRGlzcGxheUNoaWxkcmVuKGhpZGVBbGw/KTogdm9pZCB7XG4gICAgICAgIGlmIChoaWRlQWxsICE9PSB1bmRlZmluZWQpIHtcbiAgICAgICAgICAgIHRoaXMuaGlkZUNoaWxkcmVuID0gaGlkZUFsbDtcbiAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgIHRoaXMuaGlkZUNoaWxkcmVuID0gIXRoaXMuaGlkZUNoaWxkcmVuO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgLyoqIEBoaWRkZW4gKi9cbiAgICB0eXBlT2YodmFyaWFibGU/KTogc3RyaW5nIHtcbiAgICAgICAgbGV0IHJldFZhbDtcbiAgICAgICAgaWYgKHR5cGVvZiB2YXJpYWJsZSA9PT0gJ3N0cmluZycpIHtcbiAgICAgICAgICAgIHJldFZhbCA9ICdzdHJpbmcnO1xuICAgICAgICB9IGVsc2UgaWYgKHR5cGVvZiB2YXJpYWJsZSA9PT0gJ29iamVjdCcpIHtcbiAgICAgICAgICAgIHJldFZhbCA9ICdvYmplY3QnO1xuICAgICAgICB9XG5cbiAgICAgICAgcmV0dXJuIHJldFZhbDtcbiAgICB9XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIGVkaXRUcmVlSXRlbShyb3c/KTogdm9pZCB7XG4gICAgICAgIGlmIChyb3cpIHtcbiAgICAgICAgICAgIHRoaXMuZWRpdENsaWNrZWQuZW1pdChyb3cpO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgLyoqIEBoaWRkZW4gKi9cbiAgICBkZWxldGVUcmVlSXRlbShyb3c/KTogdm9pZCB7XG4gICAgICAgIGlmIChyb3cpIHtcbiAgICAgICAgICAgIHRoaXMuZGVsZXRlQ2xpY2tlZC5lbWl0KHJvdyk7XG4gICAgICAgIH1cbiAgICB9XG59XG4iLCI8bGkgI3RyZWVDaGlsZCBjbGFzcz1cImZkLXRyZWVfX2l0ZW1cIiByb2xlPVwidHJlZWl0ZW1cIj5cbiAgICA8ZGl2IGNsYXNzPVwiZmQtdHJlZV9fcm93XCI+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICAgICpuZ0Zvcj1cImxldCBjZWxsIG9mIHJvdy5yb3dEYXRhOyBsZXQgaSA9IGluZGV4XCJcbiAgICAgICAgICAgIFthdHRyLmRhdGEtaW5kZXhdPVwiaVwiXG4gICAgICAgICAgICBjbGFzcz1cImZkLXRyZWVfX2NvbFwiXG4gICAgICAgICAgICBbY2xhc3MuZmQtdHJlZV9fY29sLS1jb250cm9sXT1cImkgPT09IDBcIlxuICAgICAgICA+XG4gICAgICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgICAgICAgKGNsaWNrKT1cInRvZ2dsZURpc3BsYXlDaGlsZHJlbigpXCJcbiAgICAgICAgICAgICAgICAqbmdJZj1cInJvdy5jaGlsZHJlbiAmJiBpID09PSAwXCJcbiAgICAgICAgICAgICAgICBjbGFzcz1cImZkLXRyZWVfX2NvbnRyb2xcIlxuICAgICAgICAgICAgICAgIGFyaWEtbGFiZWw9XCJFeHBhbmRcIlxuICAgICAgICAgICAgICAgIFtjbGFzcy5pcy1wcmVzc2VkXT1cIiFoaWRlQ2hpbGRyZW5cIlxuICAgICAgICAgICAgICAgIFthdHRyLmFyaWEtcHJlc3NlZF09XCIhaGlkZUNoaWxkcmVuXCJcbiAgICAgICAgICAgID48L2J1dHRvbj5cbiAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJ0eXBlT2YoY2VsbCkgPT09ICdzdHJpbmcnXCI+XG4gICAgICAgICAgICAgICAge3sgY2VsbCB9fVxuICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwidHlwZU9mKGNlbGwpID09PSAnb2JqZWN0J1wiPlxuICAgICAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJjZWxsLmxpbmtVcmxcIj5cbiAgICAgICAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImNlbGwuZGlzcGxheVRleHRcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwhLS0gbGluayB3aXRoIGRpc3BsYXkgdGV4dCAtLT5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxhIFthdHRyLmhyZWZdPVwiY2VsbC5saW5rVXJsXCIgY2xhc3M9XCJmZC1oYXMtZm9udC13ZWlnaHQtc2VtaVwiPnt7IGNlbGwuZGlzcGxheVRleHQgfX08L2E+XG4gICAgICAgICAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiIWNlbGwuZGlzcGxheVRleHRcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwhLS0gbGluayB3aXRob3V0IGRpc3BsYXkgdGV4dCAtLT5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxhIFthdHRyLmhyZWZdPVwiY2VsbC5saW5rVXJsXCIgY2xhc3M9XCJmZC1oYXMtZm9udC13ZWlnaHQtc2VtaVwiPnt7IGNlbGwubGlua1VybCB9fTwvYT5cbiAgICAgICAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIiFjZWxsLmxpbmtVcmxcIj5cbiAgICAgICAgICAgICAgICAgICAge3sgY2VsbC5kaXNwbGF5VGV4dCB9fVxuICAgICAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwiZmQtdHJlZV9fY29sIGZkLXRyZWVfX2NvbC0tYWN0aW9uc1wiPlxuICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImRpc3BsYXlUcmVlQWN0aW9uc1wiPlxuICAgICAgICAgICAgICAgIDxidXR0b24gZmQtYnV0dG9uIGZkVHlwZT1cInRyYW5zcGFyZW50XCIgZ2x5cGg9XCJ2ZXJ0aWNhbC1ncmlwXCIgW2ZkTWVudVRyaWdnZXJdPVwibWVudVwiPjwvYnV0dG9uPlxuXG4gICAgICAgICAgICAgICAgPGZkLW1lbnUgI21lbnU+XG4gICAgICAgICAgICAgICAgICAgIDxsaSBmZC1tZW51LWl0ZW0gKGNsaWNrKT1cImVkaXRUcmVlSXRlbShyb3cpXCI+XG4gICAgICAgICAgICAgICAgICAgICAgICA8ZGl2IGZkLW1lbnUtaW50ZXJhY3RpdmU+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPHNwYW4gZmQtbWVudS10aXRsZT5FZGl0PC9zcGFuPlxuICAgICAgICAgICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgICAgICAgIDwvbGk+XG4gICAgICAgICAgICAgICAgICAgIDxsaSBmZC1tZW51LWl0ZW0gKGNsaWNrKT1cImRlbGV0ZVRyZWVJdGVtKHJvdylcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxkaXYgZmQtbWVudS1pbnRlcmFjdGl2ZT5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8c3BhbiBmZC1tZW51LXRpdGxlPkRlbGV0ZTwvc3Bhbj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgICAgICA8L2xpPlxuICAgICAgICAgICAgICAgIDwvZmQtbWVudT5cbiAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgICA8dWxcbiAgICAgICAgKm5nSWY9XCJyb3cuY2hpbGRyZW4gJiYgcm93LmNoaWxkcmVuLmxlbmd0aCA+IDBcIlxuICAgICAgICBbY2xhc3MuaXMtaGlkZGVuXT1cImhpZGVDaGlsZHJlblwiXG4gICAgICAgIGNsYXNzPVwiZmQtdHJlZV9fZ3JvdXBcIlxuICAgICAgICByb2xlPVwiZ3JvdXBcIlxuICAgID5cbiAgICAgICAgPGZkLXRyZWUtY2hpbGRcbiAgICAgICAgICAgICpuZ0Zvcj1cImxldCBjaGlsZCBvZiByb3cuY2hpbGRyZW5cIlxuICAgICAgICAgICAgW2Rpc3BsYXlUcmVlQWN0aW9uc109XCJkaXNwbGF5VHJlZUFjdGlvbnNcIlxuICAgICAgICAgICAgW3Jvd109XCJjaGlsZFwiXG4gICAgICAgICAgICBbY2xhc3NdPVwiY2hpbGQuc3VibGV2ZWxDbGFzc1wiXG4gICAgICAgID5cbiAgICAgICAgPC9mZC10cmVlLWNoaWxkPlxuICAgIDwvdWw+XG48L2xpPlxuIl19