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

package/fesm2022/fundamental-ngx-core-token.mjs

@@ -154,13 +154,13 @@ class TokenComponent {
         this._itemPosition.set(itemPosition);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: TokenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: TokenComponent, isStandalone: true, selector: "fd-token", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCloseClick: "onCloseClick", onRemove: "onRemove", onTokenClick: "onTokenClick", onTokenKeydown: "onTokenKeydown", elementFocused: "elementFocused", selected: "selectedChange" }, host: { properties: { "style.max-width.%": "100" } }, providers: [contentDensityObserverProviders()], viewQueries: [{ propertyName: "tokenWrapperElement", first: true, predicate: ["tokenWrapperElement"], descendants: true, isSignal: true }, { propertyName: "_content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "_viewContainer", first: true, predicate: ["viewContainer"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: "<span\n    #tokenWrapperElement\n    class=\"fd-token\"\n    role=\"option\"\n    tabindex=\"0\"\n    [attr.aria-roledescription]=\"('coreToken.ariaRoleDescription' | fdTranslate)()\"\n    (click)=\"tokenClickHandler($event)\"\n    (keydown)=\"tokenKeydownHandler($event)\"\n    [attr.aria-setsize]=\"_totalCount()\"\n    [attr.aria-posinset]=\"_itemPosition()\"\n    [class.fd-token__disabled]=\"disabled()\"\n    [class.fd-token--selected]=\"selected()\"\n    [class.fd-token--readonly]=\"readOnly()\"\n    [attr.aria-selected]=\"selected()\"\n>\n    <span class=\"fd-token__text no-text-select\">\n        <ng-container #viewContainer></ng-container>\n    </span>\n    @if (!readOnly()) {\n        <span\n            (click)=\"closeClickHandler($event)\"\n            role=\"button\"\n            [attr.aria-label]=\"('coreToken.deleteButtonLabel' | fdTranslate)()\"\n            class=\"fd-token__close\"\n        ></span>\n    }\n</span>\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: [".fd-token{--fdToken_Background_Color:var(--sapButton_TokenBackground);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--sapButton_TokenBorderColor);--fdToken_Padding_Inline:.3125rem 0;--fdToken_Height:1.625rem;--fdToken_Min_Width:3.625rem;--fdToken_Close_Color:var(--sapContent_IconColor);--fdToken_Close_Padding_Block:.25rem;--fdToken_Close_Padding_Inline:.5rem;--fdToken_Close_Width:1.75rem;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);cursor:default;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-negative:0;background-color:var(--fdToken_Background_Color);border:var(--fdToken_Border);border-radius:var(--fdToken_Border_Radius);color:var(--fdToken_Text_Color);flex-shrink:0;font-size:var(--sapFontSize);height:var(--fdToken_Height);line-height:1.5rem;max-width:100%;min-width:var(--fdToken_Min_Width);padding-inline:var(--fdToken_Padding_Inline);text-align:center;text-overflow:clip;white-space:nowrap}.fd-token:after,.fd-token:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.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{background-color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdToken_Close_Color);cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;height:var(--fdToken_Height);line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;min-width:var(--fdToken_Close_Width);padding-block:0;padding-block:var(--fdToken_Close_Padding_Block);padding-inline:0;padding-inline:var(--fdToken_Close_Padding_Inline);width:var(--fdToken_Close_Width);-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.fd-token__close:after,.fd-token__close:before{-webkit-box-sizing:inherit;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{-webkit-box-shadow:none;box-shadow:none;outline:none;z-index:5}.fd-token.is-hover,.fd-token:hover{--fdToken_Background_Color:var(--fdToken_Background_Color_Hover);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Hover)}.fd-token.is-focus,.fd-token:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius)}.fd-token[class*=-compact],.fd-token[class*=-condensed],[class*=-compact] .fd-token:not([class*=-cozy]),[class*=-condensed] .fd-token:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem 0;--fdToken_Height:1.25rem;--fdToken_Close_Padding_Block:.125rem;--fdToken_Close_Padding_Inline:.25rem;--fdToken_Close_Width:1.25rem;line-height:1.125rem;min-width:3rem}.fd-token[class*=-compact].is-focus,.fd-token[class*=-compact]:focus,.fd-token[class*=-condensed].is-focus,.fd-token[class*=-condensed]:focus,[class*=-compact] .fd-token:not([class*=-cozy]).is-focus,[class*=-compact] .fd-token:not([class*=-cozy]):focus,[class*=-condensed] .fd-token:not([class*=-cozy]).is-focus,[class*=-condensed] .fd-token:not([class*=-cozy]):focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius);outline-offset:var(--fdToken_Outline_Offset_Compact)}.fd-token--disabled{cursor:not-allowed}.fd-token--readonly{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Padding_Inline:var(--fdToken_ReadOnly_Padding_Inline);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--readonly[class*=-compact],.fd-token--readonly[class*=-condensed],[class*=-compact] .fd-token--readonly:not([class*=-cozy]),[class*=-condensed] .fd-token--readonly:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem}.fd-token--readonly.is-hover,.fd-token--readonly:hover{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--display{--fdToken_Text_Color:var(--sapTextColor);--fdToken_Border:none;--fdToken_Background_Color:transparent;--fdToken_Min_Width:fit-content;margin-inline:0;padding-inline:0;pointer-events:none;text-align:start}.fd-token--selected{--fdToken_Text_Color:var(--sapButton_Selected_TextColor);--fdToken_Background_Color:var(--sapButton_Selected_Background);--fdToken_Border:var(--fdToken_Selected_Border);--fdToken_Padding_Inline:.3125rem 0;background:var(--fdToken_Selected_Border_BottomStyle);font-family:var(--fdToken_Selected_Font_Family);position:relative}.fd-token--selected.fd-token--readonly{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Padding_Inline:var(--fdToken_ReadOnly_Padding_Inline);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--selected.fd-token--readonly[class*=-compact],.fd-token--selected.fd-token--readonly[class*=-condensed],[class*=-compact] .fd-token--selected.fd-token--readonly:not([class*=-cozy]),[class*=-condensed] .fd-token--selected.fd-token--readonly:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem}.fd-token--selected.fd-token--readonly.is-hover,.fd-token--selected.fd-token--readonly:hover{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--selected .fd-token__close{--fdToken_Close_Color:var(--sapButton_Selected_TextColor)}.fd-token--selected.is-hover,.fd-token--selected:hover{background-color:var(--sapButton_Selected_Hover_Background);--fdToken_Border:var(--fdToken_Selected_Border)}.fd-token--selected.is-focus,.fd-token--selected:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius);outline-color:var(--fdToken_Border_Color_Selected_Focus);--fdToken_Border:var(--fdToken_Selected_Border)}fd-token{display:inline-flex}.fd-token__disabled:after{cursor:not-allowed}.no-text-select{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}\n/*! Bundled license information:\n\nfundamental-styles/dist/token.css:\n  (*!\n   * Fundamental Library Styles v0.41.8\n   * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"], dependencies: [{ kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: TokenComponent, isStandalone: true, selector: "fd-token", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCloseClick: "onCloseClick", onRemove: "onRemove", onTokenClick: "onTokenClick", onTokenKeydown: "onTokenKeydown", elementFocused: "elementFocused", selected: "selectedChange" }, host: { properties: { "style.max-width.%": "100" } }, providers: [contentDensityObserverProviders()], viewQueries: [{ propertyName: "tokenWrapperElement", first: true, predicate: ["tokenWrapperElement"], descendants: true, isSignal: true }, { propertyName: "_content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "_viewContainer", first: true, predicate: ["viewContainer"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: "<span\n    #tokenWrapperElement\n    class=\"fd-token\"\n    role=\"option\"\n    tabindex=\"0\"\n    [attr.aria-roledescription]=\"('coreToken.ariaRoleDescription' | fdTranslate)()\"\n    (click)=\"tokenClickHandler($event)\"\n    (keydown)=\"tokenKeydownHandler($event)\"\n    [attr.aria-setsize]=\"_totalCount()\"\n    [attr.aria-posinset]=\"_itemPosition()\"\n    [class.fd-token__disabled]=\"disabled()\"\n    [class.fd-token--selected]=\"selected()\"\n    [class.fd-token--readonly]=\"readOnly()\"\n    [attr.aria-selected]=\"selected()\"\n>\n    <span class=\"fd-token__text no-text-select\">\n        <ng-container #viewContainer></ng-container>\n    </span>\n    @if (!readOnly()) {\n        <span\n            (click)=\"closeClickHandler($event)\"\n            role=\"button\"\n            [attr.aria-label]=\"('coreToken.deleteButtonLabel' | fdTranslate)()\"\n            class=\"fd-token__close\"\n        ></span>\n    }\n</span>\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: [".fd-token{--fdToken_Background_Color:var(--sapButton_TokenBackground);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--sapButton_TokenBorderColor);--fdToken_Padding_Inline:.3125rem 0;--fdToken_Height:1.625rem;--fdToken_Min_Width:3.625rem;--fdToken_Close_Color:var(--sapContent_IconColor);--fdToken_Close_Padding_Block:.25rem;--fdToken_Close_Padding_Inline:.5rem;--fdToken_Close_Width:1.75rem;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);cursor:default;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-negative:0;background-color:var(--fdToken_Background_Color);border:var(--fdToken_Border);border-radius:var(--fdToken_Border_Radius);color:var(--fdToken_Text_Color);flex-shrink:0;font-size:var(--sapFontSize);height:var(--fdToken_Height);line-height:1.5rem;max-width:100%;min-width:var(--fdToken_Min_Width);padding-inline:var(--fdToken_Padding_Inline);text-align:center;text-overflow:clip;white-space:nowrap}.fd-token:after,.fd-token:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.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{background-color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdToken_Close_Color);cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;height:var(--fdToken_Height);line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;min-width:var(--fdToken_Close_Width);padding-block:0;padding-block:var(--fdToken_Close_Padding_Block);padding-inline:0;padding-inline:var(--fdToken_Close_Padding_Inline);width:var(--fdToken_Close_Width);-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.fd-token__close:after,.fd-token__close:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-token__close:before{font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-token__close:before{content:\"\\e03e\"}.fd-token__close.is-focus,.fd-token__close:focus{-webkit-box-shadow:none;box-shadow:none;outline:none;z-index:5}.fd-token.is-hover,.fd-token:hover{--fdToken_Background_Color:var(--fdToken_Background_Color_Hover);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Hover)}.fd-token.is-focus,.fd-token:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius)}.fd-token[class*=-compact],.fd-token[class*=-condensed],[class*=-compact] .fd-token:not([class*=-cozy]),[class*=-condensed] .fd-token:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem 0;--fdToken_Height:1.25rem;--fdToken_Close_Padding_Block:.125rem;--fdToken_Close_Padding_Inline:.25rem;--fdToken_Close_Width:1.25rem;line-height:1.125rem;min-width:3rem}.fd-token[class*=-compact].is-focus,.fd-token[class*=-compact]:focus,.fd-token[class*=-condensed].is-focus,.fd-token[class*=-condensed]:focus,[class*=-compact] .fd-token:not([class*=-cozy]).is-focus,[class*=-compact] .fd-token:not([class*=-cozy]):focus,[class*=-condensed] .fd-token:not([class*=-cozy]).is-focus,[class*=-condensed] .fd-token:not([class*=-cozy]):focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius);outline-offset:var(--fdToken_Outline_Offset_Compact)}.fd-token--disabled{cursor:not-allowed}.fd-token--readonly{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Padding_Inline:var(--fdToken_ReadOnly_Padding_Inline);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--readonly[class*=-compact],.fd-token--readonly[class*=-condensed],[class*=-compact] .fd-token--readonly:not([class*=-cozy]),[class*=-condensed] .fd-token--readonly:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem}.fd-token--readonly.is-hover,.fd-token--readonly:hover{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--display{--fdToken_Text_Color:var(--sapTextColor);--fdToken_Border:none;--fdToken_Background_Color:transparent;--fdToken_Min_Width:fit-content;margin-inline:0;padding-inline:0;pointer-events:none;text-align:start}.fd-token--selected{--fdToken_Text_Color:var(--sapButton_Selected_TextColor);--fdToken_Background_Color:var(--sapButton_Selected_Background);--fdToken_Border:var(--fdToken_Selected_Border);--fdToken_Padding_Inline:.3125rem 0;background:var(--fdToken_Selected_Border_BottomStyle);font-family:var(--fdToken_Selected_Font_Family);position:relative}.fd-token--selected.fd-token--readonly{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Padding_Inline:var(--fdToken_ReadOnly_Padding_Inline);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--selected.fd-token--readonly[class*=-compact],.fd-token--selected.fd-token--readonly[class*=-condensed],[class*=-compact] .fd-token--selected.fd-token--readonly:not([class*=-cozy]),[class*=-condensed] .fd-token--selected.fd-token--readonly:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem}.fd-token--selected.fd-token--readonly.is-hover,.fd-token--selected.fd-token--readonly:hover{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--selected .fd-token__close{--fdToken_Close_Color:var(--sapButton_Selected_TextColor)}.fd-token--selected.is-hover,.fd-token--selected:hover{background-color:var(--sapButton_Selected_Hover_Background);--fdToken_Border:var(--fdToken_Selected_Border)}.fd-token--selected.is-focus,.fd-token--selected:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius);outline-color:var(--fdToken_Border_Color_Selected_Focus);--fdToken_Border:var(--fdToken_Selected_Border)}fd-token{display:inline-flex}.fd-token__disabled:after{cursor:not-allowed}.no-text-select{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}\n/*! Bundled license information:\n\nfundamental-styles/dist/token.css:\n  (*!\n   * Fundamental Library Styles v0.41.9\n   * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"], dependencies: [{ kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: TokenComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-token', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [contentDensityObserverProviders()], host: {
                         '[style.max-width.%]': '100'
-                    }, imports: [FdTranslatePipe], template: "<span\n    #tokenWrapperElement\n    class=\"fd-token\"\n    role=\"option\"\n    tabindex=\"0\"\n    [attr.aria-roledescription]=\"('coreToken.ariaRoleDescription' | fdTranslate)()\"\n    (click)=\"tokenClickHandler($event)\"\n    (keydown)=\"tokenKeydownHandler($event)\"\n    [attr.aria-setsize]=\"_totalCount()\"\n    [attr.aria-posinset]=\"_itemPosition()\"\n    [class.fd-token__disabled]=\"disabled()\"\n    [class.fd-token--selected]=\"selected()\"\n    [class.fd-token--readonly]=\"readOnly()\"\n    [attr.aria-selected]=\"selected()\"\n>\n    <span class=\"fd-token__text no-text-select\">\n        <ng-container #viewContainer></ng-container>\n    </span>\n    @if (!readOnly()) {\n        <span\n            (click)=\"closeClickHandler($event)\"\n            role=\"button\"\n            [attr.aria-label]=\"('coreToken.deleteButtonLabel' | fdTranslate)()\"\n            class=\"fd-token__close\"\n        ></span>\n    }\n</span>\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: [".fd-token{--fdToken_Background_Color:var(--sapButton_TokenBackground);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--sapButton_TokenBorderColor);--fdToken_Padding_Inline:.3125rem 0;--fdToken_Height:1.625rem;--fdToken_Min_Width:3.625rem;--fdToken_Close_Color:var(--sapContent_IconColor);--fdToken_Close_Padding_Block:.25rem;--fdToken_Close_Padding_Inline:.5rem;--fdToken_Close_Width:1.75rem;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);cursor:default;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-negative:0;background-color:var(--fdToken_Background_Color);border:var(--fdToken_Border);border-radius:var(--fdToken_Border_Radius);color:var(--fdToken_Text_Color);flex-shrink:0;font-size:var(--sapFontSize);height:var(--fdToken_Height);line-height:1.5rem;max-width:100%;min-width:var(--fdToken_Min_Width);padding-inline:var(--fdToken_Padding_Inline);text-align:center;text-overflow:clip;white-space:nowrap}.fd-token:after,.fd-token:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.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{background-color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdToken_Close_Color);cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;height:var(--fdToken_Height);line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;min-width:var(--fdToken_Close_Width);padding-block:0;padding-block:var(--fdToken_Close_Padding_Block);padding-inline:0;padding-inline:var(--fdToken_Close_Padding_Inline);width:var(--fdToken_Close_Width);-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.fd-token__close:after,.fd-token__close:before{-webkit-box-sizing:inherit;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{-webkit-box-shadow:none;box-shadow:none;outline:none;z-index:5}.fd-token.is-hover,.fd-token:hover{--fdToken_Background_Color:var(--fdToken_Background_Color_Hover);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Hover)}.fd-token.is-focus,.fd-token:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius)}.fd-token[class*=-compact],.fd-token[class*=-condensed],[class*=-compact] .fd-token:not([class*=-cozy]),[class*=-condensed] .fd-token:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem 0;--fdToken_Height:1.25rem;--fdToken_Close_Padding_Block:.125rem;--fdToken_Close_Padding_Inline:.25rem;--fdToken_Close_Width:1.25rem;line-height:1.125rem;min-width:3rem}.fd-token[class*=-compact].is-focus,.fd-token[class*=-compact]:focus,.fd-token[class*=-condensed].is-focus,.fd-token[class*=-condensed]:focus,[class*=-compact] .fd-token:not([class*=-cozy]).is-focus,[class*=-compact] .fd-token:not([class*=-cozy]):focus,[class*=-condensed] .fd-token:not([class*=-cozy]).is-focus,[class*=-condensed] .fd-token:not([class*=-cozy]):focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius);outline-offset:var(--fdToken_Outline_Offset_Compact)}.fd-token--disabled{cursor:not-allowed}.fd-token--readonly{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Padding_Inline:var(--fdToken_ReadOnly_Padding_Inline);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--readonly[class*=-compact],.fd-token--readonly[class*=-condensed],[class*=-compact] .fd-token--readonly:not([class*=-cozy]),[class*=-condensed] .fd-token--readonly:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem}.fd-token--readonly.is-hover,.fd-token--readonly:hover{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--display{--fdToken_Text_Color:var(--sapTextColor);--fdToken_Border:none;--fdToken_Background_Color:transparent;--fdToken_Min_Width:fit-content;margin-inline:0;padding-inline:0;pointer-events:none;text-align:start}.fd-token--selected{--fdToken_Text_Color:var(--sapButton_Selected_TextColor);--fdToken_Background_Color:var(--sapButton_Selected_Background);--fdToken_Border:var(--fdToken_Selected_Border);--fdToken_Padding_Inline:.3125rem 0;background:var(--fdToken_Selected_Border_BottomStyle);font-family:var(--fdToken_Selected_Font_Family);position:relative}.fd-token--selected.fd-token--readonly{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Padding_Inline:var(--fdToken_ReadOnly_Padding_Inline);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--selected.fd-token--readonly[class*=-compact],.fd-token--selected.fd-token--readonly[class*=-condensed],[class*=-compact] .fd-token--selected.fd-token--readonly:not([class*=-cozy]),[class*=-condensed] .fd-token--selected.fd-token--readonly:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem}.fd-token--selected.fd-token--readonly.is-hover,.fd-token--selected.fd-token--readonly:hover{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--selected .fd-token__close{--fdToken_Close_Color:var(--sapButton_Selected_TextColor)}.fd-token--selected.is-hover,.fd-token--selected:hover{background-color:var(--sapButton_Selected_Hover_Background);--fdToken_Border:var(--fdToken_Selected_Border)}.fd-token--selected.is-focus,.fd-token--selected:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius);outline-color:var(--fdToken_Border_Color_Selected_Focus);--fdToken_Border:var(--fdToken_Selected_Border)}fd-token{display:inline-flex}.fd-token__disabled:after{cursor:not-allowed}.no-text-select{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}\n/*! Bundled license information:\n\nfundamental-styles/dist/token.css:\n  (*!\n   * Fundamental Library Styles v0.41.8\n   * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"] }]
+                    }, imports: [FdTranslatePipe], template: "<span\n    #tokenWrapperElement\n    class=\"fd-token\"\n    role=\"option\"\n    tabindex=\"0\"\n    [attr.aria-roledescription]=\"('coreToken.ariaRoleDescription' | fdTranslate)()\"\n    (click)=\"tokenClickHandler($event)\"\n    (keydown)=\"tokenKeydownHandler($event)\"\n    [attr.aria-setsize]=\"_totalCount()\"\n    [attr.aria-posinset]=\"_itemPosition()\"\n    [class.fd-token__disabled]=\"disabled()\"\n    [class.fd-token--selected]=\"selected()\"\n    [class.fd-token--readonly]=\"readOnly()\"\n    [attr.aria-selected]=\"selected()\"\n>\n    <span class=\"fd-token__text no-text-select\">\n        <ng-container #viewContainer></ng-container>\n    </span>\n    @if (!readOnly()) {\n        <span\n            (click)=\"closeClickHandler($event)\"\n            role=\"button\"\n            [attr.aria-label]=\"('coreToken.deleteButtonLabel' | fdTranslate)()\"\n            class=\"fd-token__close\"\n        ></span>\n    }\n</span>\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: [".fd-token{--fdToken_Background_Color:var(--sapButton_TokenBackground);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--sapButton_TokenBorderColor);--fdToken_Padding_Inline:.3125rem 0;--fdToken_Height:1.625rem;--fdToken_Min_Width:3.625rem;--fdToken_Close_Color:var(--sapContent_IconColor);--fdToken_Close_Padding_Block:.25rem;--fdToken_Close_Padding_Inline:.5rem;--fdToken_Close_Width:1.75rem;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);cursor:default;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-negative:0;background-color:var(--fdToken_Background_Color);border:var(--fdToken_Border);border-radius:var(--fdToken_Border_Radius);color:var(--fdToken_Text_Color);flex-shrink:0;font-size:var(--sapFontSize);height:var(--fdToken_Height);line-height:1.5rem;max-width:100%;min-width:var(--fdToken_Min_Width);padding-inline:var(--fdToken_Padding_Inline);text-align:center;text-overflow:clip;white-space:nowrap}.fd-token:after,.fd-token:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.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{background-color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdToken_Close_Color);cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;height:var(--fdToken_Height);line-height:normal;line-height:1.25rem;margin-block:0;margin-inline:0;min-width:var(--fdToken_Close_Width);padding-block:0;padding-block:var(--fdToken_Close_Padding_Block);padding-inline:0;padding-inline:var(--fdToken_Close_Padding_Inline);width:var(--fdToken_Close_Width);-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.fd-token__close:after,.fd-token__close:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-token__close:before{font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-token__close:before{content:\"\\e03e\"}.fd-token__close.is-focus,.fd-token__close:focus{-webkit-box-shadow:none;box-shadow:none;outline:none;z-index:5}.fd-token.is-hover,.fd-token:hover{--fdToken_Background_Color:var(--fdToken_Background_Color_Hover);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Hover)}.fd-token.is-focus,.fd-token:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius)}.fd-token[class*=-compact],.fd-token[class*=-condensed],[class*=-compact] .fd-token:not([class*=-cozy]),[class*=-condensed] .fd-token:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem 0;--fdToken_Height:1.25rem;--fdToken_Close_Padding_Block:.125rem;--fdToken_Close_Padding_Inline:.25rem;--fdToken_Close_Width:1.25rem;line-height:1.125rem;min-width:3rem}.fd-token[class*=-compact].is-focus,.fd-token[class*=-compact]:focus,.fd-token[class*=-condensed].is-focus,.fd-token[class*=-condensed]:focus,[class*=-compact] .fd-token:not([class*=-cozy]).is-focus,[class*=-compact] .fd-token:not([class*=-cozy]):focus,[class*=-condensed] .fd-token:not([class*=-cozy]).is-focus,[class*=-condensed] .fd-token:not([class*=-cozy]):focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius);outline-offset:var(--fdToken_Outline_Offset_Compact)}.fd-token--disabled{cursor:not-allowed}.fd-token--readonly{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Padding_Inline:var(--fdToken_ReadOnly_Padding_Inline);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--readonly[class*=-compact],.fd-token--readonly[class*=-condensed],[class*=-compact] .fd-token--readonly:not([class*=-cozy]),[class*=-condensed] .fd-token--readonly:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem}.fd-token--readonly.is-hover,.fd-token--readonly:hover{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--display{--fdToken_Text_Color:var(--sapTextColor);--fdToken_Border:none;--fdToken_Background_Color:transparent;--fdToken_Min_Width:fit-content;margin-inline:0;padding-inline:0;pointer-events:none;text-align:start}.fd-token--selected{--fdToken_Text_Color:var(--sapButton_Selected_TextColor);--fdToken_Background_Color:var(--sapButton_Selected_Background);--fdToken_Border:var(--fdToken_Selected_Border);--fdToken_Padding_Inline:.3125rem 0;background:var(--fdToken_Selected_Border_BottomStyle);font-family:var(--fdToken_Selected_Font_Family);position:relative}.fd-token--selected.fd-token--readonly{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Padding_Inline:var(--fdToken_ReadOnly_Padding_Inline);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--selected.fd-token--readonly[class*=-compact],.fd-token--selected.fd-token--readonly[class*=-condensed],[class*=-compact] .fd-token--selected.fd-token--readonly:not([class*=-cozy]),[class*=-condensed] .fd-token--selected.fd-token--readonly:not([class*=-cozy]){--fdToken_Padding_Inline:.25rem}.fd-token--selected.fd-token--readonly.is-hover,.fd-token--selected.fd-token--readonly:hover{--fdToken_Text_Color:var(--sapContent_LabelColor);--fdToken_Border:var(--sapButton_BorderWidth) solid var(--fdToken_Border_Color_Read_Only);--fdToken_Background_Color:var(--fdToken_Background_Color_Read_Only)}.fd-token--selected .fd-token__close{--fdToken_Close_Color:var(--sapButton_Selected_TextColor)}.fd-token--selected.is-hover,.fd-token--selected:hover{background-color:var(--sapButton_Selected_Hover_Background);--fdToken_Border:var(--fdToken_Selected_Border)}.fd-token--selected.is-focus,.fd-token--selected:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdToken_Outline_Offset);--fdToken_Border_Radius:var(--fdToken_Focus_Border_Radius);outline-color:var(--fdToken_Border_Color_Selected_Focus);--fdToken_Border:var(--fdToken_Selected_Border)}fd-token{display:inline-flex}.fd-token__disabled:after{cursor:not-allowed}.no-text-select{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}\n/*! Bundled license information:\n\nfundamental-styles/dist/token.css:\n  (*!\n   * Fundamental Library Styles v0.41.9\n   * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"] }]
         }], propDecorators: { tokenWrapperElement: [{ type: i0.ViewChild, args: ['tokenWrapperElement', { isSignal: true }] }], _content: [{ type: i0.ViewChild, args: ['content', { isSignal: true }] }], _viewContainer: [{ type: i0.ViewChild, args: ['viewContainer', { ...{ read: ViewContainerRef }, isSignal: true }] }], onCloseClick: [{ type: i0.Output, args: ["onCloseClick"] }], onRemove: [{ type: i0.Output, args: ["onRemove"] }], onTokenClick: [{ type: i0.Output, args: ["onTokenClick"] }], onTokenKeydown: [{ type: i0.Output, args: ["onTokenKeydown"] }], elementFocused: [{ type: i0.Output, args: ["elementFocused"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }, { type: i0.Output, args: ["selectedChange"] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }] } });
 
 class TokenizerComponent {
@@ -825,7 +825,7 @@ class TokenizerComponent {
         this._cdRef.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: TokenizerComponent, deps: [{ token: i1.ContentDensityObserver }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: DOCUMENT }, { token: i2.LiveAnnouncer }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: TokenizerComponent, isStandalone: true, selector: "fd-tokenizer", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: false, isRequired: false, transformFunction: null }, disableKeyboardDeletion: { classPropertyName: "disableKeyboardDeletion", publicName: "disableKeyboardDeletion", isSignal: false, isRequired: false, transformFunction: null }, compactCollapse: { classPropertyName: "compactCollapse", publicName: "compactCollapse", isSignal: false, isRequired: false, transformFunction: null }, tokenizerFocusable: { classPropertyName: "tokenizerFocusable", publicName: "tokenizerFocusable", isSignal: false, isRequired: false, transformFunction: null }, inputValue: { classPropertyName: "inputValue", publicName: "inputValue", isSignal: false, isRequired: false, transformFunction: null }, glyph: { classPropertyName: "glyph", publicName: "glyph", isSignal: false, isRequired: false, transformFunction: null }, glyphFont: { classPropertyName: "glyphFont", publicName: "glyphFont", isSignal: false, isRequired: false, transformFunction: null }, moreTerm: { classPropertyName: "moreTerm", publicName: "moreTerm", isSignal: false, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: false, isRequired: false, transformFunction: null }, showOverflowPopover: { classPropertyName: "showOverflowPopover", publicName: "showOverflowPopover", isSignal: false, isRequired: false, transformFunction: null }, externalHiddenCount: { classPropertyName: "externalHiddenCount", publicName: "externalHiddenCount", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { moreClickedEvent: "moreClickedEvent" }, host: { listeners: { "keydown": "keyDown($event)" } }, providers: [contentDensityObserverProviders()], queries: [{ propertyName: "input", first: true, predicate: i0.forwardRef(() => FormControlComponent), descendants: true, read: ElementRef }, { propertyName: "tokenList", predicate: i0.forwardRef(() => TokenComponent) }], viewQueries: [{ propertyName: "tokenizerInnerEl", first: true, predicate: ["tokenizerInner"], descendants: true }, { propertyName: "moreElement", first: true, predicate: ["moreElementSpan"], descendants: true }, { propertyName: "content", first: true, predicate: ["inputGroupAddOn"], descendants: true }, { propertyName: "_viewContainer", predicate: ["viewContainer"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"fd-tokenizer fd-tokenizer--scrollable\" [class.is-focus]=\"_tokenizerHasFocus\">\n    <div class=\"fd-tokenizer__inner\" #tokenizerInner>\n        <div\n            [attr.aria-hidden]=\"tokenList.length === 0\"\n            role=\"listbox\"\n            [attr.aria-label]=\"('coreTokenizer.tokenizerLabel' | fdTranslate)()\"\n            [style.width]=\"_tokensContainerWidth\"\n        >\n            <ng-content select=\"fd-token\"></ng-content>\n        </div>\n        @if (\n            showOverflowPopover &&\n            (_contentDensityObserver.isCompactSignal() || compactCollapse) &&\n            externalHiddenCount() === 0\n        ) {\n            <ng-template [ngTemplateOutlet]=\"tokensOverflow\"></ng-template>\n        } @else {\n            @if (\n                hasInternalOverflowIndicator() &&\n                moreTokensLeft.length + moreTokensRight.length + hiddenCozyTokenCount + externalHiddenCount() > 0\n            ) {\n                <span\n                    (click)=\"moreClicked()\"\n                    (keydown.enter)=\"moreClicked()\"\n                    (keydown.space)=\"$event.preventDefault(); moreClicked()\"\n                    #moreElementSpan\n                    class=\"fd-tokenizer-more\"\n                    role=\"button\"\n                    tabindex=\"0\"\n                >\n                    @if (_contentDensityObserver.isCompactSignal() || compactCollapse) {\n                        {{\n                            (\n                                'coreTokenizer.moreLabel'\n                                | fdTranslate\n                                    : { count: moreTokensLeft.length + moreTokensRight.length + externalHiddenCount() }\n                            )()\n                        }}\n                    }\n                    @if (!_contentDensityObserver.isCompactSignal() && !compactCollapse) {\n                        {{\n                            (\n                                'coreTokenizer.moreLabel'\n                                | fdTranslate: { count: hiddenCozyTokenCount + externalHiddenCount() }\n                            )()\n                        }}\n                    }\n                </span>\n            }\n        }\n        <ng-content select=\"[fd-tokenizer-extra]\"></ng-content>\n        <ng-content select=\"[fd-form-control]\"></ng-content>\n    </div>\n    @if (glyph) {\n        <span fd-input-group-addon #inputGroupAddOn [button]=\"true\" placement=\"after\">\n            <button\n                fd-button\n                class=\"fd-tokenizer-addon\"\n                fdType=\"transparent\"\n                [glyph]=\"glyph\"\n                [glyphFont]=\"glyphFont\"\n                type=\"button\"\n            ></button>\n        </span>\n    }\n</div>\n<ng-template #tokensOverflow>\n    <fd-popover placement=\"bottom-start\" title=\"\" [noArrow]=\"false\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n        <fd-popover-control>\n            <ng-template [ngTemplateOutlet]=\"moreElement\"></ng-template>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ul fd-list class=\"fd-tokenizer__overflow-list\">\n                @for (token of _hiddenTokens; track token) {\n                    <li fd-list-item class=\"fd-tokenizer__overflow-list-item\">\n                        <ng-container #viewContainer></ng-container>\n                        @if (!token.readOnly) {\n                            <span\n                                class=\"fd-token__close\"\n                                role=\"button\"\n                                [attr.aria-label]=\"('coreToken.deleteButtonLabel' | fdTranslate)()\"\n                                (click)=\"token.closeClickHandler($event)\"\n                            ></span>\n                        }\n                    </li>\n                }\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n<ng-template #moreElement>\n    @if (\n        hasInternalOverflowIndicator() &&\n        moreTokensLeft.length + moreTokensRight.length + hiddenCozyTokenCount + externalHiddenCount() > 0\n    ) {\n        <span\n            (click)=\"moreClicked()\"\n            (keydown.enter)=\"moreClicked()\"\n            (keydown.space)=\"$event.preventDefault(); moreClicked()\"\n            #moreElementSpan\n            class=\"fd-tokenizer-more\"\n            role=\"button\"\n            tabindex=\"0\"\n        >\n            @if (_contentDensityObserver.isCompactSignal() || compactCollapse) {\n                {{\n                    (\n                        'coreTokenizer.moreLabel'\n                        | fdTranslate: { count: moreTokensLeft.length + moreTokensRight.length + externalHiddenCount() }\n                    )()\n                }}\n            }\n            @if (!_contentDensityObserver.isCompactSignal() && !compactCollapse) {\n                {{\n                    ('coreTokenizer.moreLabel' | fdTranslate: { count: hiddenCozyTokenCount + externalHiddenCount() })()\n                }}\n            }\n        </span>\n    }\n</ng-template>\n", styles: ["@charset \"UTF-8\";.fd-tokenizer{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--sapField_BackgroundStyle,var(--sapField_BackgroundStyle));background-color:var(--sapField_Background,var(--sapField_Background));border:none;border-radius:var(--sapField_BorderCornerRadius);-webkit-box-shadow:var(--sapField_Shadow);box-shadow:var(--sapField_Shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdInput_Height,var(--sapElement_Height));line-height:normal;margin-block:var(--fdInput_Field_Margin_Block,.25rem);margin-block:0;margin-inline:0;min-height:var(--fdInput_Height,var(--sapElement_Height));min-width:2.75rem;outline:none;overflow:hidden;padding-block:0;padding-inline:var(--fdInput_Field_Padding_Inline,.625rem);padding-inline:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-tokenizer:after,.fd-tokenizer:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-tokenizer::-webkit-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::-moz-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer:-ms-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::-ms-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer[dir=rtl]::-webkit-input-placeholder,[dir=rtl] .fd-tokenizer::-webkit-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::-moz-placeholder,[dir=rtl] .fd-tokenizer::-moz-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]:-ms-input-placeholder,[dir=rtl] .fd-tokenizer:-ms-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::-ms-input-placeholder,[dir=rtl] .fd-tokenizer::-ms-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::placeholder,[dir=rtl] .fd-tokenizer::placeholder{text-indent:.125rem}.fd-tokenizer::-moz-selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::-ms-clear{display:none}.fd-tokenizer.is-hover,.fd-tokenizer:hover{background:var(--sapField_Hover_BackgroundStyle,var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background,var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-tokenizer.is-focus,.fd-tokenizer:focus{background:var(--sapField_Focus_Background,var(--sapField_Focus_Background));outline:var(--fdInput_Outline_Color) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdInput_Outline_Offset)}.fd-tokenizer.is-hover,.fd-tokenizer:hover{-webkit-box-shadow:none;box-shadow:none}.fd-tokenizer__inner{-ms-overflow-style:none;display:-webkit-box;display:-ms-flexbox;display:flex;float:right;height:100%;overflow:hidden;padding-block:0;padding-inline:var(--fdTokenizer_Inner_Padding,.3125rem);scrollbar-width:none;white-space:nowrap;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.fd-tokenizer__inner::-webkit-scrollbar{display:none}.fd-tokenizer .fd-token{-webkit-margin-end:.3125rem;margin-inline-end:.3125rem;max-width:calc(100% - 3.3125rem)}.fd-tokenizer__indicator{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdTokenizer_Indicator_Color);cursor:pointer;display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-tokenizer__indicator:after,.fd-tokenizer__indicator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-tokenizer .fd-tokenizer__input{background:transparent;-webkit-box-shadow:none;box-shadow:none;height:100%;min-height:100%}.fd-tokenizer .fd-tokenizer__input.fd-input{border:none;min-width:3rem;padding-block:0;padding-inline:0}.fd-tokenizer .fd-tokenizer__input:first-child{padding-block:0;padding-inline:.3125rem}.fd-tokenizer .fd-tokenizer__input:last-child{-ms-flex-preferred-size:100%;flex-basis:100%}.fd-tokenizer .fd-tokenizer__input.is-focus,.fd-tokenizer .fd-tokenizer__input:focus{background:none;background-color:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;outline:none;z-index:5}.fd-tokenizer .fd-tokenizer__input.is-hover,.fd-tokenizer .fd-tokenizer__input:hover{background:none;background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.fd-tokenizer.is-focus,.fd-tokenizer:focus{border:none;-webkit-box-shadow:none;box-shadow:none;outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.0625rem;z-index:5}.fd-tokenizer[class*=-compact],.fd-tokenizer[class*=-condensed],[class*=-compact] .fd-tokenizer:not([class*=-cozy]),[class*=-condensed] .fd-tokenizer:not([class*=-cozy]){height:1.625rem;min-height:1.625rem;--fdTokenizer_Inner_Padding:.25rem;--fdInput_Field_Compact_Min_Width:2rem}.fd-tokenizer[class*=-compact] .fd-tokenizer__input:first-child,.fd-tokenizer[class*=-condensed] .fd-tokenizer__input:first-child,[class*=-compact] .fd-tokenizer:not([class*=-cozy]) .fd-tokenizer__input:first-child,[class*=-condensed] .fd-tokenizer:not([class*=-cozy]) .fd-tokenizer__input:first-child{padding-block:0;padding-inline:.25rem}.fd-tokenizer[class*=-compact] .fd-token,.fd-tokenizer[class*=-condensed] .fd-token,[class*=-compact] .fd-tokenizer:not([class*=-cozy]) .fd-token,[class*=-condensed] .fd-tokenizer:not([class*=-cozy]) .fd-token{-webkit-margin-end:.25rem;margin-inline-end:.25rem;max-width:calc(100% - 2.25rem)}.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]{background:none;background-color:transparent;-webkit-box-shadow:none;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{background:none;background-color:transparent;-webkit-box-shadow:none;box-shadow:none;z-index:5}.fd-tokenizer--display{background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;overflow:visible;pointer-events:none}.fd-tokenizer--display .fd-tokenizer__inner{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-tokenizer--display .fd-tokenizer__indicator .fd-popover__control{cursor:pointer;pointer-events:all}.fd-tokenizer--display .fd-tokenizer__indicator .fd-popover__body{pointer-events:none}.fd-tokenizer--display .fd-tokenizer__input{display:none}.fd-tokenizer--display .fd-tokenizer__inner{overflow:visible}.fd-tokenizer--display .fd-token{-webkit-margin-end:0;margin-inline-end:0}.fd-tokenizer--display .fd-token--display:after{content:\"\\b7\";display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-width:1rem}.fd-tokenizer--display .fd-token--display:has(+.fd-tokenizer__input):after{content:\"\";min-width:0}.fd-tokenizer--display+.fd-input-group__addon.fd-input-group__addon--button{display:none}.fd-tokenizer--scrollable .fd-tokenizer__inner{-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:normal;overflow-x:scroll}.fd-tokenizer .fd-token{max-width:inherit!important}input.fd-input.fd-tokenizer__input{background-color:transparent;margin-right:1px;border:none;outline:none}.fd-tokenizer-more{padding-right:.5rem;color:var(--sapLinkColor);cursor:pointer}[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/*! Bundled license information:\n\nfundamental-styles/dist/tokenizer.css:\n  (*!\n   * Fundamental Library Styles v0.41.8\n   * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: InputGroupAddOnDirective, selector: "[fdInputGroupAddon], [fd-input-group-addon]", inputs: ["class", "placement", "type", "state", "button"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["id"], exportAs: ["fd-button"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "bodyRole", "bodyAriaLabelledBy", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight", "ariaModal"], outputs: ["onClose"] }, { kind: "component", type: ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter", "searchResultsList"], outputs: ["focusEscapeList"] }, { kind: "component", type: ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "counterRole", "counterAriaLabel", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl", "suggestion"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: TokenizerComponent, isStandalone: true, selector: "fd-tokenizer", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: false, isRequired: false, transformFunction: null }, disableKeyboardDeletion: { classPropertyName: "disableKeyboardDeletion", publicName: "disableKeyboardDeletion", isSignal: false, isRequired: false, transformFunction: null }, compactCollapse: { classPropertyName: "compactCollapse", publicName: "compactCollapse", isSignal: false, isRequired: false, transformFunction: null }, tokenizerFocusable: { classPropertyName: "tokenizerFocusable", publicName: "tokenizerFocusable", isSignal: false, isRequired: false, transformFunction: null }, inputValue: { classPropertyName: "inputValue", publicName: "inputValue", isSignal: false, isRequired: false, transformFunction: null }, glyph: { classPropertyName: "glyph", publicName: "glyph", isSignal: false, isRequired: false, transformFunction: null }, glyphFont: { classPropertyName: "glyphFont", publicName: "glyphFont", isSignal: false, isRequired: false, transformFunction: null }, moreTerm: { classPropertyName: "moreTerm", publicName: "moreTerm", isSignal: false, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: false, isRequired: false, transformFunction: null }, showOverflowPopover: { classPropertyName: "showOverflowPopover", publicName: "showOverflowPopover", isSignal: false, isRequired: false, transformFunction: null }, externalHiddenCount: { classPropertyName: "externalHiddenCount", publicName: "externalHiddenCount", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { moreClickedEvent: "moreClickedEvent" }, host: { listeners: { "keydown": "keyDown($event)" } }, providers: [contentDensityObserverProviders()], queries: [{ propertyName: "input", first: true, predicate: i0.forwardRef(() => FormControlComponent), descendants: true, read: ElementRef }, { propertyName: "tokenList", predicate: i0.forwardRef(() => TokenComponent) }], viewQueries: [{ propertyName: "tokenizerInnerEl", first: true, predicate: ["tokenizerInner"], descendants: true }, { propertyName: "moreElement", first: true, predicate: ["moreElementSpan"], descendants: true }, { propertyName: "content", first: true, predicate: ["inputGroupAddOn"], descendants: true }, { propertyName: "_viewContainer", predicate: ["viewContainer"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"fd-tokenizer fd-tokenizer--scrollable\" [class.is-focus]=\"_tokenizerHasFocus\">\n    <div class=\"fd-tokenizer__inner\" #tokenizerInner>\n        <div\n            [attr.aria-hidden]=\"tokenList.length === 0\"\n            role=\"listbox\"\n            [attr.aria-label]=\"('coreTokenizer.tokenizerLabel' | fdTranslate)()\"\n            [style.width]=\"_tokensContainerWidth\"\n        >\n            <ng-content select=\"fd-token\"></ng-content>\n        </div>\n        @if (\n            showOverflowPopover &&\n            (_contentDensityObserver.isCompactSignal() || compactCollapse) &&\n            externalHiddenCount() === 0\n        ) {\n            <ng-template [ngTemplateOutlet]=\"tokensOverflow\"></ng-template>\n        } @else {\n            @if (\n                hasInternalOverflowIndicator() &&\n                moreTokensLeft.length + moreTokensRight.length + hiddenCozyTokenCount + externalHiddenCount() > 0\n            ) {\n                <span\n                    (click)=\"moreClicked()\"\n                    (keydown.enter)=\"moreClicked()\"\n                    (keydown.space)=\"$event.preventDefault(); moreClicked()\"\n                    #moreElementSpan\n                    class=\"fd-tokenizer-more\"\n                    role=\"button\"\n                    tabindex=\"0\"\n                >\n                    @if (_contentDensityObserver.isCompactSignal() || compactCollapse) {\n                        {{\n                            (\n                                'coreTokenizer.moreLabel'\n                                | fdTranslate\n                                    : { count: moreTokensLeft.length + moreTokensRight.length + externalHiddenCount() }\n                            )()\n                        }}\n                    }\n                    @if (!_contentDensityObserver.isCompactSignal() && !compactCollapse) {\n                        {{\n                            (\n                                'coreTokenizer.moreLabel'\n                                | fdTranslate: { count: hiddenCozyTokenCount + externalHiddenCount() }\n                            )()\n                        }}\n                    }\n                </span>\n            }\n        }\n        <ng-content select=\"[fd-tokenizer-extra]\"></ng-content>\n        <ng-content select=\"[fd-form-control]\"></ng-content>\n    </div>\n    @if (glyph) {\n        <span fd-input-group-addon #inputGroupAddOn [button]=\"true\" placement=\"after\">\n            <button\n                fd-button\n                class=\"fd-tokenizer-addon\"\n                fdType=\"transparent\"\n                [glyph]=\"glyph\"\n                [glyphFont]=\"glyphFont\"\n                type=\"button\"\n            ></button>\n        </span>\n    }\n</div>\n<ng-template #tokensOverflow>\n    <fd-popover placement=\"bottom-start\" title=\"\" [noArrow]=\"false\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n        <fd-popover-control>\n            <ng-template [ngTemplateOutlet]=\"moreElement\"></ng-template>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ul fd-list class=\"fd-tokenizer__overflow-list\">\n                @for (token of _hiddenTokens; track token) {\n                    <li fd-list-item class=\"fd-tokenizer__overflow-list-item\">\n                        <ng-container #viewContainer></ng-container>\n                        @if (!token.readOnly) {\n                            <span\n                                class=\"fd-token__close\"\n                                role=\"button\"\n                                [attr.aria-label]=\"('coreToken.deleteButtonLabel' | fdTranslate)()\"\n                                (click)=\"token.closeClickHandler($event)\"\n                            ></span>\n                        }\n                    </li>\n                }\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n<ng-template #moreElement>\n    @if (\n        hasInternalOverflowIndicator() &&\n        moreTokensLeft.length + moreTokensRight.length + hiddenCozyTokenCount + externalHiddenCount() > 0\n    ) {\n        <span\n            (click)=\"moreClicked()\"\n            (keydown.enter)=\"moreClicked()\"\n            (keydown.space)=\"$event.preventDefault(); moreClicked()\"\n            #moreElementSpan\n            class=\"fd-tokenizer-more\"\n            role=\"button\"\n            tabindex=\"0\"\n        >\n            @if (_contentDensityObserver.isCompactSignal() || compactCollapse) {\n                {{\n                    (\n                        'coreTokenizer.moreLabel'\n                        | fdTranslate: { count: moreTokensLeft.length + moreTokensRight.length + externalHiddenCount() }\n                    )()\n                }}\n            }\n            @if (!_contentDensityObserver.isCompactSignal() && !compactCollapse) {\n                {{\n                    ('coreTokenizer.moreLabel' | fdTranslate: { count: hiddenCozyTokenCount + externalHiddenCount() })()\n                }}\n            }\n        </span>\n    }\n</ng-template>\n", styles: ["@charset \"UTF-8\";.fd-tokenizer{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--sapField_BackgroundStyle,var(--sapField_BackgroundStyle));background-color:var(--sapField_Background,var(--sapField_Background));border:none;border-radius:var(--sapField_BorderCornerRadius);-webkit-box-shadow:var(--sapField_Shadow);box-shadow:var(--sapField_Shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdInput_Height,var(--sapElement_Height));line-height:normal;margin-block:var(--fdInput_Field_Margin_Block,.25rem);margin-block:0;margin-inline:0;min-height:var(--fdInput_Height,var(--sapElement_Height));min-width:2.75rem;outline:none;overflow:hidden;padding-block:0;padding-inline:var(--fdInput_Field_Padding_Inline,.625rem);padding-inline:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-tokenizer:after,.fd-tokenizer:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-tokenizer::-webkit-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::-moz-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer:-ms-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::-ms-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer[dir=rtl]::-webkit-input-placeholder,[dir=rtl] .fd-tokenizer::-webkit-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::-moz-placeholder,[dir=rtl] .fd-tokenizer::-moz-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]:-ms-input-placeholder,[dir=rtl] .fd-tokenizer:-ms-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::-ms-input-placeholder,[dir=rtl] .fd-tokenizer::-ms-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::placeholder,[dir=rtl] .fd-tokenizer::placeholder{text-indent:.125rem}.fd-tokenizer::-moz-selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::-ms-clear{display:none}.fd-tokenizer.is-hover,.fd-tokenizer:hover{background:var(--sapField_Hover_BackgroundStyle,var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background,var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-tokenizer.is-focus,.fd-tokenizer:focus{background:var(--sapField_Focus_Background,var(--sapField_Focus_Background));outline:var(--fdInput_Outline_Color) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdInput_Outline_Offset)}.fd-tokenizer.is-hover,.fd-tokenizer:hover{-webkit-box-shadow:none;box-shadow:none}.fd-tokenizer__inner{-ms-overflow-style:none;display:-webkit-box;display:-ms-flexbox;display:flex;float:right;height:100%;overflow:hidden;padding-block:0;padding-inline:var(--fdTokenizer_Inner_Padding,.3125rem);scrollbar-width:none;white-space:nowrap;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.fd-tokenizer__inner::-webkit-scrollbar{display:none}.fd-tokenizer .fd-token{-webkit-margin-end:.3125rem;margin-inline-end:.3125rem;max-width:calc(100% - 3.3125rem)}.fd-tokenizer__indicator{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdTokenizer_Indicator_Color);cursor:pointer;display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-tokenizer__indicator:after,.fd-tokenizer__indicator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-tokenizer .fd-tokenizer__input{background:transparent;-webkit-box-shadow:none;box-shadow:none;height:100%;min-height:100%}.fd-tokenizer .fd-tokenizer__input.fd-input{border:none;min-width:3rem;padding-block:0;padding-inline:0}.fd-tokenizer .fd-tokenizer__input:first-child{padding-block:0;padding-inline:.3125rem}.fd-tokenizer .fd-tokenizer__input:last-child{-ms-flex-preferred-size:100%;flex-basis:100%}.fd-tokenizer .fd-tokenizer__input.is-focus,.fd-tokenizer .fd-tokenizer__input:focus{background:none;background-color:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;outline:none;z-index:5}.fd-tokenizer .fd-tokenizer__input.is-hover,.fd-tokenizer .fd-tokenizer__input:hover{background:none;background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.fd-tokenizer.is-focus,.fd-tokenizer:focus{border:none;-webkit-box-shadow:none;box-shadow:none;outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.0625rem;z-index:5}.fd-tokenizer[class*=-compact],.fd-tokenizer[class*=-condensed],[class*=-compact] .fd-tokenizer:not([class*=-cozy]),[class*=-condensed] .fd-tokenizer:not([class*=-cozy]){height:1.625rem;min-height:1.625rem;--fdTokenizer_Inner_Padding:.25rem;--fdInput_Field_Compact_Min_Width:2rem}.fd-tokenizer[class*=-compact] .fd-tokenizer__input:first-child,.fd-tokenizer[class*=-condensed] .fd-tokenizer__input:first-child,[class*=-compact] .fd-tokenizer:not([class*=-cozy]) .fd-tokenizer__input:first-child,[class*=-condensed] .fd-tokenizer:not([class*=-cozy]) .fd-tokenizer__input:first-child{padding-block:0;padding-inline:.25rem}.fd-tokenizer[class*=-compact] .fd-token,.fd-tokenizer[class*=-condensed] .fd-token,[class*=-compact] .fd-tokenizer:not([class*=-cozy]) .fd-token,[class*=-condensed] .fd-tokenizer:not([class*=-cozy]) .fd-token{-webkit-margin-end:.25rem;margin-inline-end:.25rem;max-width:calc(100% - 2.25rem)}.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]{background:none;background-color:transparent;-webkit-box-shadow:none;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{background:none;background-color:transparent;-webkit-box-shadow:none;box-shadow:none;z-index:5}.fd-tokenizer--display{background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;overflow:visible;pointer-events:none}.fd-tokenizer--display .fd-tokenizer__inner{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-tokenizer--display .fd-tokenizer__indicator .fd-popover__control{cursor:pointer;pointer-events:all}.fd-tokenizer--display .fd-tokenizer__indicator .fd-popover__body{pointer-events:none}.fd-tokenizer--display .fd-tokenizer__input{display:none}.fd-tokenizer--display .fd-tokenizer__inner{overflow:visible}.fd-tokenizer--display .fd-token{-webkit-margin-end:0;margin-inline-end:0}.fd-tokenizer--display .fd-token--display:after{content:\"\\b7\";display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-width:1rem}.fd-tokenizer--display .fd-token--display:has(+.fd-tokenizer__input):after{content:\"\";min-width:0}.fd-tokenizer--display+.fd-input-group__addon.fd-input-group__addon--button{display:none}.fd-tokenizer--scrollable .fd-tokenizer__inner{-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:normal;overflow-x:scroll}.fd-tokenizer .fd-token{max-width:inherit!important}input.fd-input.fd-tokenizer__input{background-color:transparent;margin-right:1px;border:none;outline:none}.fd-tokenizer-more{padding-right:.5rem;color:var(--sapLinkColor);cursor:pointer}[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/*! Bundled license information:\n\nfundamental-styles/dist/tokenizer.css:\n  (*!\n   * Fundamental Library Styles v0.41.9\n   * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: InputGroupAddOnDirective, selector: "[fdInputGroupAddon], [fd-input-group-addon]", inputs: ["class", "placement", "type", "state", "button"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["id"], exportAs: ["fd-button"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "bodyRole", "bodyAriaLabelledBy", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight", "ariaModal"], outputs: ["onClose"] }, { kind: "component", type: ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter", "notification", "searchResultsList"], outputs: ["focusEscapeList"] }, { kind: "component", type: ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "counterRole", "counterAriaLabel", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl", "suggestion"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 __decorate([
     applyCssClass,
@@ -845,7 +845,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
                         ListComponent,
                         ListItemComponent,
                         FdTranslatePipe
-                    ], template: "<div class=\"fd-tokenizer fd-tokenizer--scrollable\" [class.is-focus]=\"_tokenizerHasFocus\">\n    <div class=\"fd-tokenizer__inner\" #tokenizerInner>\n        <div\n            [attr.aria-hidden]=\"tokenList.length === 0\"\n            role=\"listbox\"\n            [attr.aria-label]=\"('coreTokenizer.tokenizerLabel' | fdTranslate)()\"\n            [style.width]=\"_tokensContainerWidth\"\n        >\n            <ng-content select=\"fd-token\"></ng-content>\n        </div>\n        @if (\n            showOverflowPopover &&\n            (_contentDensityObserver.isCompactSignal() || compactCollapse) &&\n            externalHiddenCount() === 0\n        ) {\n            <ng-template [ngTemplateOutlet]=\"tokensOverflow\"></ng-template>\n        } @else {\n            @if (\n                hasInternalOverflowIndicator() &&\n                moreTokensLeft.length + moreTokensRight.length + hiddenCozyTokenCount + externalHiddenCount() > 0\n            ) {\n                <span\n                    (click)=\"moreClicked()\"\n                    (keydown.enter)=\"moreClicked()\"\n                    (keydown.space)=\"$event.preventDefault(); moreClicked()\"\n                    #moreElementSpan\n                    class=\"fd-tokenizer-more\"\n                    role=\"button\"\n                    tabindex=\"0\"\n                >\n                    @if (_contentDensityObserver.isCompactSignal() || compactCollapse) {\n                        {{\n                            (\n                                'coreTokenizer.moreLabel'\n                                | fdTranslate\n                                    : { count: moreTokensLeft.length + moreTokensRight.length + externalHiddenCount() }\n                            )()\n                        }}\n                    }\n                    @if (!_contentDensityObserver.isCompactSignal() && !compactCollapse) {\n                        {{\n                            (\n                                'coreTokenizer.moreLabel'\n                                | fdTranslate: { count: hiddenCozyTokenCount + externalHiddenCount() }\n                            )()\n                        }}\n                    }\n                </span>\n            }\n        }\n        <ng-content select=\"[fd-tokenizer-extra]\"></ng-content>\n        <ng-content select=\"[fd-form-control]\"></ng-content>\n    </div>\n    @if (glyph) {\n        <span fd-input-group-addon #inputGroupAddOn [button]=\"true\" placement=\"after\">\n            <button\n                fd-button\n                class=\"fd-tokenizer-addon\"\n                fdType=\"transparent\"\n                [glyph]=\"glyph\"\n                [glyphFont]=\"glyphFont\"\n                type=\"button\"\n            ></button>\n        </span>\n    }\n</div>\n<ng-template #tokensOverflow>\n    <fd-popover placement=\"bottom-start\" title=\"\" [noArrow]=\"false\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n        <fd-popover-control>\n            <ng-template [ngTemplateOutlet]=\"moreElement\"></ng-template>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ul fd-list class=\"fd-tokenizer__overflow-list\">\n                @for (token of _hiddenTokens; track token) {\n                    <li fd-list-item class=\"fd-tokenizer__overflow-list-item\">\n                        <ng-container #viewContainer></ng-container>\n                        @if (!token.readOnly) {\n                            <span\n                                class=\"fd-token__close\"\n                                role=\"button\"\n                                [attr.aria-label]=\"('coreToken.deleteButtonLabel' | fdTranslate)()\"\n                                (click)=\"token.closeClickHandler($event)\"\n                            ></span>\n                        }\n                    </li>\n                }\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n<ng-template #moreElement>\n    @if (\n        hasInternalOverflowIndicator() &&\n        moreTokensLeft.length + moreTokensRight.length + hiddenCozyTokenCount + externalHiddenCount() > 0\n    ) {\n        <span\n            (click)=\"moreClicked()\"\n            (keydown.enter)=\"moreClicked()\"\n            (keydown.space)=\"$event.preventDefault(); moreClicked()\"\n            #moreElementSpan\n            class=\"fd-tokenizer-more\"\n            role=\"button\"\n            tabindex=\"0\"\n        >\n            @if (_contentDensityObserver.isCompactSignal() || compactCollapse) {\n                {{\n                    (\n                        'coreTokenizer.moreLabel'\n                        | fdTranslate: { count: moreTokensLeft.length + moreTokensRight.length + externalHiddenCount() }\n                    )()\n                }}\n            }\n            @if (!_contentDensityObserver.isCompactSignal() && !compactCollapse) {\n                {{\n                    ('coreTokenizer.moreLabel' | fdTranslate: { count: hiddenCozyTokenCount + externalHiddenCount() })()\n                }}\n            }\n        </span>\n    }\n</ng-template>\n", styles: ["@charset \"UTF-8\";.fd-tokenizer{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--sapField_BackgroundStyle,var(--sapField_BackgroundStyle));background-color:var(--sapField_Background,var(--sapField_Background));border:none;border-radius:var(--sapField_BorderCornerRadius);-webkit-box-shadow:var(--sapField_Shadow);box-shadow:var(--sapField_Shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdInput_Height,var(--sapElement_Height));line-height:normal;margin-block:var(--fdInput_Field_Margin_Block,.25rem);margin-block:0;margin-inline:0;min-height:var(--fdInput_Height,var(--sapElement_Height));min-width:2.75rem;outline:none;overflow:hidden;padding-block:0;padding-inline:var(--fdInput_Field_Padding_Inline,.625rem);padding-inline:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-tokenizer:after,.fd-tokenizer:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-tokenizer::-webkit-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::-moz-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer:-ms-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::-ms-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer[dir=rtl]::-webkit-input-placeholder,[dir=rtl] .fd-tokenizer::-webkit-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::-moz-placeholder,[dir=rtl] .fd-tokenizer::-moz-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]:-ms-input-placeholder,[dir=rtl] .fd-tokenizer:-ms-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::-ms-input-placeholder,[dir=rtl] .fd-tokenizer::-ms-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::placeholder,[dir=rtl] .fd-tokenizer::placeholder{text-indent:.125rem}.fd-tokenizer::-moz-selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::-ms-clear{display:none}.fd-tokenizer.is-hover,.fd-tokenizer:hover{background:var(--sapField_Hover_BackgroundStyle,var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background,var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-tokenizer.is-focus,.fd-tokenizer:focus{background:var(--sapField_Focus_Background,var(--sapField_Focus_Background));outline:var(--fdInput_Outline_Color) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdInput_Outline_Offset)}.fd-tokenizer.is-hover,.fd-tokenizer:hover{-webkit-box-shadow:none;box-shadow:none}.fd-tokenizer__inner{-ms-overflow-style:none;display:-webkit-box;display:-ms-flexbox;display:flex;float:right;height:100%;overflow:hidden;padding-block:0;padding-inline:var(--fdTokenizer_Inner_Padding,.3125rem);scrollbar-width:none;white-space:nowrap;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.fd-tokenizer__inner::-webkit-scrollbar{display:none}.fd-tokenizer .fd-token{-webkit-margin-end:.3125rem;margin-inline-end:.3125rem;max-width:calc(100% - 3.3125rem)}.fd-tokenizer__indicator{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdTokenizer_Indicator_Color);cursor:pointer;display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-tokenizer__indicator:after,.fd-tokenizer__indicator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-tokenizer .fd-tokenizer__input{background:transparent;-webkit-box-shadow:none;box-shadow:none;height:100%;min-height:100%}.fd-tokenizer .fd-tokenizer__input.fd-input{border:none;min-width:3rem;padding-block:0;padding-inline:0}.fd-tokenizer .fd-tokenizer__input:first-child{padding-block:0;padding-inline:.3125rem}.fd-tokenizer .fd-tokenizer__input:last-child{-ms-flex-preferred-size:100%;flex-basis:100%}.fd-tokenizer .fd-tokenizer__input.is-focus,.fd-tokenizer .fd-tokenizer__input:focus{background:none;background-color:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;outline:none;z-index:5}.fd-tokenizer .fd-tokenizer__input.is-hover,.fd-tokenizer .fd-tokenizer__input:hover{background:none;background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.fd-tokenizer.is-focus,.fd-tokenizer:focus{border:none;-webkit-box-shadow:none;box-shadow:none;outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.0625rem;z-index:5}.fd-tokenizer[class*=-compact],.fd-tokenizer[class*=-condensed],[class*=-compact] .fd-tokenizer:not([class*=-cozy]),[class*=-condensed] .fd-tokenizer:not([class*=-cozy]){height:1.625rem;min-height:1.625rem;--fdTokenizer_Inner_Padding:.25rem;--fdInput_Field_Compact_Min_Width:2rem}.fd-tokenizer[class*=-compact] .fd-tokenizer__input:first-child,.fd-tokenizer[class*=-condensed] .fd-tokenizer__input:first-child,[class*=-compact] .fd-tokenizer:not([class*=-cozy]) .fd-tokenizer__input:first-child,[class*=-condensed] .fd-tokenizer:not([class*=-cozy]) .fd-tokenizer__input:first-child{padding-block:0;padding-inline:.25rem}.fd-tokenizer[class*=-compact] .fd-token,.fd-tokenizer[class*=-condensed] .fd-token,[class*=-compact] .fd-tokenizer:not([class*=-cozy]) .fd-token,[class*=-condensed] .fd-tokenizer:not([class*=-cozy]) .fd-token{-webkit-margin-end:.25rem;margin-inline-end:.25rem;max-width:calc(100% - 2.25rem)}.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]{background:none;background-color:transparent;-webkit-box-shadow:none;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{background:none;background-color:transparent;-webkit-box-shadow:none;box-shadow:none;z-index:5}.fd-tokenizer--display{background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;overflow:visible;pointer-events:none}.fd-tokenizer--display .fd-tokenizer__inner{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-tokenizer--display .fd-tokenizer__indicator .fd-popover__control{cursor:pointer;pointer-events:all}.fd-tokenizer--display .fd-tokenizer__indicator .fd-popover__body{pointer-events:none}.fd-tokenizer--display .fd-tokenizer__input{display:none}.fd-tokenizer--display .fd-tokenizer__inner{overflow:visible}.fd-tokenizer--display .fd-token{-webkit-margin-end:0;margin-inline-end:0}.fd-tokenizer--display .fd-token--display:after{content:\"\\b7\";display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-width:1rem}.fd-tokenizer--display .fd-token--display:has(+.fd-tokenizer__input):after{content:\"\";min-width:0}.fd-tokenizer--display+.fd-input-group__addon.fd-input-group__addon--button{display:none}.fd-tokenizer--scrollable .fd-tokenizer__inner{-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:normal;overflow-x:scroll}.fd-tokenizer .fd-token{max-width:inherit!important}input.fd-input.fd-tokenizer__input{background-color:transparent;margin-right:1px;border:none;outline:none}.fd-tokenizer-more{padding-right:.5rem;color:var(--sapLinkColor);cursor:pointer}[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/*! Bundled license information:\n\nfundamental-styles/dist/tokenizer.css:\n  (*!\n   * Fundamental Library Styles v0.41.8\n   * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"] }]
+                    ], template: "<div class=\"fd-tokenizer fd-tokenizer--scrollable\" [class.is-focus]=\"_tokenizerHasFocus\">\n    <div class=\"fd-tokenizer__inner\" #tokenizerInner>\n        <div\n            [attr.aria-hidden]=\"tokenList.length === 0\"\n            role=\"listbox\"\n            [attr.aria-label]=\"('coreTokenizer.tokenizerLabel' | fdTranslate)()\"\n            [style.width]=\"_tokensContainerWidth\"\n        >\n            <ng-content select=\"fd-token\"></ng-content>\n        </div>\n        @if (\n            showOverflowPopover &&\n            (_contentDensityObserver.isCompactSignal() || compactCollapse) &&\n            externalHiddenCount() === 0\n        ) {\n            <ng-template [ngTemplateOutlet]=\"tokensOverflow\"></ng-template>\n        } @else {\n            @if (\n                hasInternalOverflowIndicator() &&\n                moreTokensLeft.length + moreTokensRight.length + hiddenCozyTokenCount + externalHiddenCount() > 0\n            ) {\n                <span\n                    (click)=\"moreClicked()\"\n                    (keydown.enter)=\"moreClicked()\"\n                    (keydown.space)=\"$event.preventDefault(); moreClicked()\"\n                    #moreElementSpan\n                    class=\"fd-tokenizer-more\"\n                    role=\"button\"\n                    tabindex=\"0\"\n                >\n                    @if (_contentDensityObserver.isCompactSignal() || compactCollapse) {\n                        {{\n                            (\n                                'coreTokenizer.moreLabel'\n                                | fdTranslate\n                                    : { count: moreTokensLeft.length + moreTokensRight.length + externalHiddenCount() }\n                            )()\n                        }}\n                    }\n                    @if (!_contentDensityObserver.isCompactSignal() && !compactCollapse) {\n                        {{\n                            (\n                                'coreTokenizer.moreLabel'\n                                | fdTranslate: { count: hiddenCozyTokenCount + externalHiddenCount() }\n                            )()\n                        }}\n                    }\n                </span>\n            }\n        }\n        <ng-content select=\"[fd-tokenizer-extra]\"></ng-content>\n        <ng-content select=\"[fd-form-control]\"></ng-content>\n    </div>\n    @if (glyph) {\n        <span fd-input-group-addon #inputGroupAddOn [button]=\"true\" placement=\"after\">\n            <button\n                fd-button\n                class=\"fd-tokenizer-addon\"\n                fdType=\"transparent\"\n                [glyph]=\"glyph\"\n                [glyphFont]=\"glyphFont\"\n                type=\"button\"\n            ></button>\n        </span>\n    }\n</div>\n<ng-template #tokensOverflow>\n    <fd-popover placement=\"bottom-start\" title=\"\" [noArrow]=\"false\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n        <fd-popover-control>\n            <ng-template [ngTemplateOutlet]=\"moreElement\"></ng-template>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ul fd-list class=\"fd-tokenizer__overflow-list\">\n                @for (token of _hiddenTokens; track token) {\n                    <li fd-list-item class=\"fd-tokenizer__overflow-list-item\">\n                        <ng-container #viewContainer></ng-container>\n                        @if (!token.readOnly) {\n                            <span\n                                class=\"fd-token__close\"\n                                role=\"button\"\n                                [attr.aria-label]=\"('coreToken.deleteButtonLabel' | fdTranslate)()\"\n                                (click)=\"token.closeClickHandler($event)\"\n                            ></span>\n                        }\n                    </li>\n                }\n            </ul>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n<ng-template #moreElement>\n    @if (\n        hasInternalOverflowIndicator() &&\n        moreTokensLeft.length + moreTokensRight.length + hiddenCozyTokenCount + externalHiddenCount() > 0\n    ) {\n        <span\n            (click)=\"moreClicked()\"\n            (keydown.enter)=\"moreClicked()\"\n            (keydown.space)=\"$event.preventDefault(); moreClicked()\"\n            #moreElementSpan\n            class=\"fd-tokenizer-more\"\n            role=\"button\"\n            tabindex=\"0\"\n        >\n            @if (_contentDensityObserver.isCompactSignal() || compactCollapse) {\n                {{\n                    (\n                        'coreTokenizer.moreLabel'\n                        | fdTranslate: { count: moreTokensLeft.length + moreTokensRight.length + externalHiddenCount() }\n                    )()\n                }}\n            }\n            @if (!_contentDensityObserver.isCompactSignal() && !compactCollapse) {\n                {{\n                    ('coreTokenizer.moreLabel' | fdTranslate: { count: hiddenCozyTokenCount + externalHiddenCount() })()\n                }}\n            }\n        </span>\n    }\n</ng-template>\n", styles: ["@charset \"UTF-8\";.fd-tokenizer{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--sapField_BackgroundStyle,var(--sapField_BackgroundStyle));background-color:var(--sapField_Background,var(--sapField_Background));border:none;border-radius:var(--sapField_BorderCornerRadius);-webkit-box-shadow:var(--sapField_Shadow);box-shadow:var(--sapField_Shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdInput_Height,var(--sapElement_Height));line-height:normal;margin-block:var(--fdInput_Field_Margin_Block,.25rem);margin-block:0;margin-inline:0;min-height:var(--fdInput_Height,var(--sapElement_Height));min-width:2.75rem;outline:none;overflow:hidden;padding-block:0;padding-inline:var(--fdInput_Field_Padding_Inline,.625rem);padding-inline:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-tokenizer:after,.fd-tokenizer:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-tokenizer::-webkit-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::-moz-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer:-ms-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::-ms-input-placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-tokenizer[dir=rtl]::-webkit-input-placeholder,[dir=rtl] .fd-tokenizer::-webkit-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::-moz-placeholder,[dir=rtl] .fd-tokenizer::-moz-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]:-ms-input-placeholder,[dir=rtl] .fd-tokenizer:-ms-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::-ms-input-placeholder,[dir=rtl] .fd-tokenizer::-ms-input-placeholder{text-indent:.125rem}.fd-tokenizer[dir=rtl]::placeholder,[dir=rtl] .fd-tokenizer::placeholder{text-indent:.125rem}.fd-tokenizer::-moz-selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-tokenizer::-ms-clear{display:none}.fd-tokenizer.is-hover,.fd-tokenizer:hover{background:var(--sapField_Hover_BackgroundStyle,var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background,var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-tokenizer.is-focus,.fd-tokenizer:focus{background:var(--sapField_Focus_Background,var(--sapField_Focus_Background));outline:var(--fdInput_Outline_Color) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:var(--fdInput_Outline_Offset)}.fd-tokenizer.is-hover,.fd-tokenizer:hover{-webkit-box-shadow:none;box-shadow:none}.fd-tokenizer__inner{-ms-overflow-style:none;display:-webkit-box;display:-ms-flexbox;display:flex;float:right;height:100%;overflow:hidden;padding-block:0;padding-inline:var(--fdTokenizer_Inner_Padding,.3125rem);scrollbar-width:none;white-space:nowrap;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.fd-tokenizer__inner::-webkit-scrollbar{display:none}.fd-tokenizer .fd-token{-webkit-margin-end:.3125rem;margin-inline-end:.3125rem;max-width:calc(100% - 3.3125rem)}.fd-tokenizer__indicator{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdTokenizer_Indicator_Color);cursor:pointer;display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-tokenizer__indicator:after,.fd-tokenizer__indicator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-tokenizer .fd-tokenizer__input{background:transparent;-webkit-box-shadow:none;box-shadow:none;height:100%;min-height:100%}.fd-tokenizer .fd-tokenizer__input.fd-input{border:none;min-width:3rem;padding-block:0;padding-inline:0}.fd-tokenizer .fd-tokenizer__input:first-child{padding-block:0;padding-inline:.3125rem}.fd-tokenizer .fd-tokenizer__input:last-child{-ms-flex-preferred-size:100%;flex-basis:100%}.fd-tokenizer .fd-tokenizer__input.is-focus,.fd-tokenizer .fd-tokenizer__input:focus{background:none;background-color:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;outline:none;z-index:5}.fd-tokenizer .fd-tokenizer__input.is-hover,.fd-tokenizer .fd-tokenizer__input:hover{background:none;background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.fd-tokenizer.is-focus,.fd-tokenizer:focus{border:none;-webkit-box-shadow:none;box-shadow:none;outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.0625rem;z-index:5}.fd-tokenizer[class*=-compact],.fd-tokenizer[class*=-condensed],[class*=-compact] .fd-tokenizer:not([class*=-cozy]),[class*=-condensed] .fd-tokenizer:not([class*=-cozy]){height:1.625rem;min-height:1.625rem;--fdTokenizer_Inner_Padding:.25rem;--fdInput_Field_Compact_Min_Width:2rem}.fd-tokenizer[class*=-compact] .fd-tokenizer__input:first-child,.fd-tokenizer[class*=-condensed] .fd-tokenizer__input:first-child,[class*=-compact] .fd-tokenizer:not([class*=-cozy]) .fd-tokenizer__input:first-child,[class*=-condensed] .fd-tokenizer:not([class*=-cozy]) .fd-tokenizer__input:first-child{padding-block:0;padding-inline:.25rem}.fd-tokenizer[class*=-compact] .fd-token,.fd-tokenizer[class*=-condensed] .fd-token,[class*=-compact] .fd-tokenizer:not([class*=-cozy]) .fd-token,[class*=-condensed] .fd-tokenizer:not([class*=-cozy]) .fd-token{-webkit-margin-end:.25rem;margin-inline-end:.25rem;max-width:calc(100% - 2.25rem)}.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]{background:none;background-color:transparent;-webkit-box-shadow:none;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{background:none;background-color:transparent;-webkit-box-shadow:none;box-shadow:none;z-index:5}.fd-tokenizer--display{background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none;overflow:visible;pointer-events:none}.fd-tokenizer--display .fd-tokenizer__inner{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-tokenizer--display .fd-tokenizer__indicator .fd-popover__control{cursor:pointer;pointer-events:all}.fd-tokenizer--display .fd-tokenizer__indicator .fd-popover__body{pointer-events:none}.fd-tokenizer--display .fd-tokenizer__input{display:none}.fd-tokenizer--display .fd-tokenizer__inner{overflow:visible}.fd-tokenizer--display .fd-token{-webkit-margin-end:0;margin-inline-end:0}.fd-tokenizer--display .fd-token--display:after{content:\"\\b7\";display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-width:1rem}.fd-tokenizer--display .fd-token--display:has(+.fd-tokenizer__input):after{content:\"\";min-width:0}.fd-tokenizer--display+.fd-input-group__addon.fd-input-group__addon--button{display:none}.fd-tokenizer--scrollable .fd-tokenizer__inner{-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:normal;overflow-x:scroll}.fd-tokenizer .fd-token{max-width:inherit!important}input.fd-input.fd-tokenizer__input{background-color:transparent;margin-right:1px;border:none;outline:none}.fd-tokenizer-more{padding-right:.5rem;color:var(--sapLinkColor);cursor:pointer}[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/*! Bundled license information:\n\nfundamental-styles/dist/tokenizer.css:\n  (*!\n   * Fundamental Library Styles v0.41.9\n   * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"] }]
         }], ctorParameters: () => [{ type: i1.ContentDensityObserver }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]