npm - @fundamental-ngx/core - Versions diffs - 0.55.4 → 0.55.5 - Mend

@fundamental-ngx/core 0.55.4 → 0.55.5

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

Files changed (171) hide show

package/fesm2022/fundamental-ngx-core-message-toast.mjs CHANGED Viewed

@@ -79,7 +79,7 @@ class MessageToastComponent extends BaseToastDurationDismissibleContainerCompone
         super(config);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: MessageToastComponent, deps: [{ token: MessageToastConfig }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: MessageToastComponent, isStandalone: true, selector: "fd-message-toast", host: { attributes: { "role": "alert", "tabindex": "-1" }, properties: { "style.width": "width", "style.min-width": "minWidth", "style.max-width": "maxWidth", "style.height": "height", "style.min-height": "minHeight", "style.max-height": "maxHeight", "attr.aria-label": "ariaLabel", "attr.aria-live": "\"polite\"", "attr.id": "id" }, classAttribute: "fd-message-toast" }, usesInheritance: true, ngImport: i0, template: `<ng-template cdkPortalOutlet></ng-template>`, isInline: true, styles: [".cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;display:flex;max-width:100%;max-height:100%;z-index:1000}.cdk-overlay-backdrop{position:absolute;inset:0;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);opacity:0;z-index:1000;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}.cdk-overlay-backdrop-showing{opacity:1}@media (forced-colors: active){.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:#00000052}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,.cdk-high-contrast-active .cdk-overlay-transparent-backdrop{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;display:flex;flex-direction:column;min-width:1px;min-height:1px;z-index:1000}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.fd-message-toast{background-color:var(--sapList_Background);border:0;border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapList_TextColor);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-width:15rem;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem;text-align:center;width:auto}.fd-message-toast:after,.fd-message-toast:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fn-toast-overlay-container .cdk-overlay-pane{max-height:none;height:fit-content}\n/*!\n * Fundamental Library Styles v0.38.0\n * Copyright (c) 2024 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"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [toastAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: MessageToastComponent, isStandalone: true, selector: "fd-message-toast", host: { attributes: { "role": "alert", "tabindex": "-1" }, properties: { "style.width": "width", "style.min-width": "minWidth", "style.max-width": "maxWidth", "style.height": "height", "style.min-height": "minHeight", "style.max-height": "maxHeight", "attr.aria-label": "ariaLabel", "attr.aria-live": "\"polite\"", "attr.id": "id" }, classAttribute: "fd-message-toast" }, usesInheritance: true, ngImport: i0, template: `<ng-template cdkPortalOutlet></ng-template>`, isInline: true, styles: [".cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;display:flex;max-width:100%;max-height:100%;z-index:1000}.cdk-overlay-backdrop{position:absolute;inset:0;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);opacity:0;z-index:1000;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}.cdk-overlay-backdrop-showing{opacity:1}@media (forced-colors: active){.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:#00000052}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,.cdk-high-contrast-active .cdk-overlay-transparent-backdrop{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;display:flex;flex-direction:column;min-width:1px;min-height:1px;z-index:1000}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.fd-message-toast{background-color:var(--sapIndicationColor_9_Background);border:0;border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-shadow:var(--sapContent_Lite_Shadow);box-shadow:var(--sapContent_Lite_Shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_ContrastTextColor);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-width:15rem;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem;text-align:center;width:auto}.fd-message-toast:after,.fd-message-toast:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fn-toast-overlay-container .cdk-overlay-pane{max-height:none;height:fit-content}\n/*!\n * Fundamental Library Styles v0.39.2\n * Copyright (c) 2025 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"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [toastAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: MessageToastComponent, decorators: [{
             type: Component,
@@ -96,7 +96,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         role: 'alert',
                         tabindex: '-1',
                         class: 'fd-message-toast'
-                    }, imports: [PortalModule], styles: [".cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;display:flex;max-width:100%;max-height:100%;z-index:1000}.cdk-overlay-backdrop{position:absolute;inset:0;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);opacity:0;z-index:1000;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}.cdk-overlay-backdrop-showing{opacity:1}@media (forced-colors: active){.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:#00000052}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,.cdk-high-contrast-active .cdk-overlay-transparent-backdrop{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;display:flex;flex-direction:column;min-width:1px;min-height:1px;z-index:1000}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.fd-message-toast{background-color:var(--sapList_Background);border:0;border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-shadow:var(--sapContent_Shadow2);box-shadow:var(--sapContent_Shadow2);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapList_TextColor);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-width:15rem;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem;text-align:center;width:auto}.fd-message-toast:after,.fd-message-toast:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fn-toast-overlay-container .cdk-overlay-pane{max-height:none;height:fit-content}\n/*!\n * Fundamental Library Styles v0.38.0\n * Copyright (c) 2024 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"] }]
+                    }, imports: [PortalModule], styles: [".cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;display:flex;max-width:100%;max-height:100%;z-index:1000}.cdk-overlay-backdrop{position:absolute;inset:0;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);opacity:0;z-index:1000;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}.cdk-overlay-backdrop-showing{opacity:1}@media (forced-colors: active){.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:#00000052}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,.cdk-high-contrast-active .cdk-overlay-transparent-backdrop{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;display:flex;flex-direction:column;min-width:1px;min-height:1px;z-index:1000}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.fd-message-toast{background-color:var(--sapIndicationColor_9_Background);border:0;border-radius:var(--sapElement_BorderCornerRadius);-webkit-box-shadow:var(--sapContent_Lite_Shadow);box-shadow:var(--sapContent_Lite_Shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_ContrastTextColor);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-width:15rem;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem;text-align:center;width:auto}.fd-message-toast:after,.fd-message-toast:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fn-toast-overlay-container .cdk-overlay-pane{max-height:none;height:fit-content}\n/*!\n * Fundamental Library Styles v0.39.2\n * Copyright (c) 2025 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"] }]
         }], ctorParameters: () => [{ type: MessageToastConfig }] });
 class MessageToastService extends BaseDismissibleToastService {

package/fesm2022/fundamental-ngx-core-message-toast.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"fundamental-ngx-core-message-toast.mjs","sources":["../../../../libs/core/message-toast/constants/message-toast.token.ts","../../../../libs/core/message-toast/ref/message-toast.ref.ts","../../../../libs/core/message-toast/components/message-toast-text.component.ts","../../../../libs/core/message-toast/config/message-toast.config.ts","../../../../libs/core/message-toast/constants/message-toast.animation.ts","../../../../libs/core/message-toast/message-toast.component.ts","../../../../libs/core/message-toast/message-toast.service.ts","../../../../libs/core/message-toast/provide-config.ts","../../../../libs/core/message-toast/message-toast.module.ts","../../../../libs/core/message-toast/toast-overlay-container.class.ts","../../../../libs/core/message-toast/fundamental-ngx-core-message-toast.ts"],"sourcesContent":["/** Injection token that can be used to access the data that was passed in to a Message Toast. /\nimport { InjectionToken } from '@angular/core';\nimport { MessageToastConfig } from '../config/message-toast.config';\n\nexport const MESSAGE_TOAST_DATA = new InjectionToken<any>('MessageToastData');\nexport const MESSAGE_TOAST_CONFIG = new InjectionToken<MessageToastConfig>('MessageToastConfig');\n","import { OverlayRef } from '@angular/cdk/overlay';\nimport { BaseToastDurationDismissibleRef, BaseToastPosition } from '@fundamental-ngx/cdk/utils';\nimport { MessageToastConfig } from '../config/message-toast.config';\nimport { MessageToastComponent } from '../message-toast.component';\n\nexport class MessageToastRef<T = any> extends BaseToastDurationDismissibleRef<T, MessageToastConfig> {\n /* Observable that is triggered when the message toast has timed out. /\n afterTimeout = this._afterDismissed$.asObservable();\n\n /* Data passed from the service open method. /\n readonly data: T;\n\n /* @hidden /\n constructor(\n public containerInstance: MessageToastComponent,\n public overlayRef: OverlayRef,\n public positionStrategy: BaseToastPosition\n ) {\n super(containerInstance, overlayRef, positionStrategy);\n\n this.data = this.containerInstance.config.data;\n }\n}\n","import { ChangeDetectionStrategy, Component, Inject, ViewEncapsulation } from '@angular/core';\nimport { ToastTextComponent } from '@fundamental-ngx/cdk/utils';\nimport { MESSAGE_TOAST_DATA } from '../constants/message-toast.token';\nimport { MessageToastRef } from '../ref/message-toast.ref';\n\n@Component({\n selector: 'fd-message-toast-text',\n template: `{{ message }}`,\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n standalone: true\n})\nexport class MessageToastTextComponent implements ToastTextComponent {\n /* @hidden /\n constructor(\n public toastRef: MessageToastRef<MessageToastTextComponent>,\n @Inject(MESSAGE_TOAST_DATA) public message: string\n ) {}\n}\n","import { BaseToastDurationDismissibleConfig } from '@fundamental-ngx/cdk/utils';\n\n/\n Configuration used when opening a Message Toast.\n /\nexport class MessageToastConfig<T = any> extends BaseToastDurationDismissibleConfig<T> {\n /* Whether the Message Toast should be animated. /\n animated? = false;\n}\n","import { animate, state, style, transition, trigger } from '@angular/animations';\n\nexport const toastAnimation = trigger('state', [\n state(\n 'void, hidden',\n style({\n transform: 'translateY(1rem)',\n opacity: 0\n })\n ),\n state(\n 'visible',\n style({\n transform: 'translateY(0)',\n opacity: 1\n })\n ),\n transition(' => visible', animate('150ms cubic-bezier(0, 0, 0.2, 1)')),\n transition(\n '* => void, * => hidden',\n animate(\n '75ms cubic-bezier(0.4, 0.0, 1, 1)',\n style({\n opacity: 0\n })\n )\n )\n]);\n","import { PortalModule } from '@angular/cdk/portal';\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\nimport { BaseToastDurationDismissibleContainerComponent } from '@fundamental-ngx/cdk/utils';\nimport { MessageToastConfig } from './config/message-toast.config';\nimport { toastAnimation } from './constants/message-toast.animation';\n\n@Component({\n selector: 'fd-message-toast',\n template: `<ng-template cdkPortalOutlet></ng-template>`,\n styleUrl: './message-toast.component.scss',\n animations: [toastAnimation],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n '[style.width]': 'width',\n '[style.min-width]': 'minWidth',\n '[style.max-width]': 'maxWidth',\n '[style.height]': 'height',\n '[style.min-height]': 'minHeight',\n '[style.max-height]': 'maxHeight',\n '[attr.aria-label]': 'ariaLabel',\n '[attr.aria-live]': '\"polite\"',\n '[attr.id]': 'id',\n role: 'alert',\n tabindex: '-1',\n class: 'fd-message-toast'\n },\n imports: [PortalModule]\n})\nexport class MessageToastComponent extends BaseToastDurationDismissibleContainerComponent<MessageToastConfig> {\n /** @hidden /\n constructor(config: MessageToastConfig) {\n super(config);\n }\n}\n","import { Overlay, OverlayRef } from '@angular/cdk/overlay';\nimport { EmbeddedViewRef, Inject, Injectable, Injector, StaticProvider, TemplateRef, Type } from '@angular/core';\nimport { BaseDismissibleToastService, BaseToastPosition, ToastBottomCenterPosition } from '@fundamental-ngx/cdk/utils';\nimport { MessageToastTextComponent } from './components/message-toast-text.component';\nimport { MessageToastConfig } from './config/message-toast.config';\nimport { MESSAGE_TOAST_CONFIG, MESSAGE_TOAST_DATA } from './constants/message-toast.token';\nimport { MessageToastComponent } from './message-toast.component';\nimport { MessageToastRef } from './ref/message-toast.ref';\n\n@Injectable()\nexport class MessageToastService<P = any> extends BaseDismissibleToastService<MessageToastConfig<P>> {\n /* @Hidden /\n protected toastTextComponent = MessageToastTextComponent;\n /* @Hidden /\n protected toastContainerComponent = MessageToastComponent;\n /* @Hidden /\n protected toastDataInjectionToken = MESSAGE_TOAST_DATA;\n /* @Hidden /\n protected toastPositionStrategy = ToastBottomCenterPosition;\n /* @Hidden /\n protected defaultConfig;\n\n /* @hidden /\n constructor(overlay: Overlay, injector: Injector, @Inject(MESSAGE_TOAST_CONFIG) config: MessageToastConfig) {\n super(overlay, injector);\n this.defaultConfig = config;\n }\n\n /\n Opens toast with a provided message.\n * @param message Message to display in a Message Toast.\n * @param config Toast configuration.\n * @returns Toast reference.\n /\n open<T = any>(\n message: string \| Type<T> \| TemplateRef<any>,\n config?: MessageToastConfig<P>\n ): MessageToastRef<MessageToastTextComponent \| T \| EmbeddedViewRef<any>> {\n const mergedConfig = { ...this.defaultConfig, ...config };\n if (message instanceof TemplateRef) {\n return this.openFromTemplate(message, mergedConfig);\n } else if (typeof message === 'string') {\n return this.openFromString(message, mergedConfig);\n }\n return this.openFromComponent(message, mergedConfig);\n }\n\n /\n Opens a Toast with provided message as a content.\n * @param message string to render inside a Toast.\n * @param config Toast configuration\n /\n openFromString(message: string, config?: MessageToastConfig<P>): MessageToastRef<MessageToastTextComponent> {\n const mergedConfig = { ...this.defaultConfig, ...config };\n mergedConfig.data = message;\n return this.openFromComponent(\n this.toastTextComponent,\n mergedConfig\n ) as MessageToastRef<MessageToastTextComponent>;\n }\n\n /\n Opens a Toast with provided component inside.\n * @param component Component to render inside a Toast.\n * @param config Toast configuration.\n * @returns Toast reference.\n /\n openFromComponent<T>(component: Type<T>, config: MessageToastConfig<P>): MessageToastRef<T> {\n return this._attach(component, config) as MessageToastRef<T>;\n }\n\n /\n Opens a Toast with provided Template Reference.\n * @param template Template Reference to render inside a Toast.\n * @param config Toast configuration.\n * @returns Toast reference.\n /\n openFromTemplate(template: TemplateRef<any>, config: MessageToastConfig<P>): MessageToastRef<EmbeddedViewRef<any>> {\n return this._attach(template, config) as MessageToastRef<EmbeddedViewRef<any>>;\n }\n\n /* @hidden /\n protected getContainerComponentProviders(config: MessageToastConfig<P>): StaticProvider[] {\n return [{ provide: MessageToastConfig, useValue: config }];\n }\n\n /* @hidden /\n protected getContentComponentProviders<T>(\n config: MessageToastConfig<P>,\n messageToastRef: MessageToastRef<T>\n ): StaticProvider[] {\n return [\n { provide: MessageToastRef, useValue: messageToastRef },\n { provide: this.toastDataInjectionToken, useValue: config.data }\n ];\n }\n\n /* @hidden /\n protected getToastRef<T>(\n containerRef: MessageToastComponent,\n overlayRef: OverlayRef,\n positionStrategy: BaseToastPosition = ToastBottomCenterPosition\n ): MessageToastRef<T \| EmbeddedViewRef<any>> {\n return new MessageToastRef<T \| EmbeddedViewRef<any>>(containerRef, overlayRef, positionStrategy);\n }\n}\n","import { Provider } from '@angular/core';\nimport { MessageToastConfig } from './config/message-toast.config';\nimport { MESSAGE_TOAST_CONFIG } from './constants/message-toast.token';\n\n/\n Function allows to provide custom configuration for Message Toast.\n * @param config\n * @returns\n /\nexport function provideMessageToastConfig(config: MessageToastConfig): Provider {\n return {\n provide: MESSAGE_TOAST_CONFIG,\n useValue: config\n };\n}\n","import { OverlayModule } from '@angular/cdk/overlay';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { ModuleWithProviders, NgModule } from '@angular/core';\nimport { MessageToastTextComponent } from './components/message-toast-text.component';\nimport { MessageToastConfig } from './config/message-toast.config';\nimport { MESSAGE_TOAST_CONFIG } from './constants/message-toast.token';\nimport { MessageToastComponent } from './message-toast.component';\nimport { MessageToastService } from './message-toast.service';\nimport { provideMessageToastConfig } from './provide-config';\n\n@NgModule({\n imports: [PortalModule, OverlayModule, MessageToastComponent, MessageToastTextComponent],\n exports: [MessageToastComponent],\n providers: [MessageToastService, { provide: MESSAGE_TOAST_CONFIG, useValue: new MessageToastConfig() }]\n})\nexport class MessageToastModule {\n /\n Allows configuring module on a global level with custom configuration.\n * @param config User's custom configuration.\n /\n static withConfig(config: MessageToastConfig): ModuleWithProviders<MessageToastModule> {\n return {\n ngModule: MessageToastModule,\n providers: [provideMessageToastConfig(config)]\n };\n }\n}\n","import { OverlayContainer } from '@angular/cdk/overlay';\nimport { Injectable } from '@angular/core';\n\n/\n Custom overlay container for CDK Overlay.\n /\n@Injectable()\nexport class ToastOverlayContainer extends OverlayContainer {\n /\n This method returns the overlay container element. It will lazily\n * create the element the first time it is called to facilitate using\n * the container in non-browser environments.\n * @returns the container element\n /\n getContainerElement(): HTMLElement {\n const containerElement = super.getContainerElement();\n\n containerElement.classList.add('fd-message-toast-container');\n\n return containerElement;\n }\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":["i1.MessageToastConfig"],"mappings":"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"}
1	+ {"version":3,"file":"fundamental-ngx-core-message-toast.mjs","sources":["../../../../libs/core/message-toast/constants/message-toast.token.ts","../../../../libs/core/message-toast/ref/message-toast.ref.ts","../../../../libs/core/message-toast/components/message-toast-text.component.ts","../../../../libs/core/message-toast/config/message-toast.config.ts","../../../../libs/core/message-toast/constants/message-toast.animation.ts","../../../../libs/core/message-toast/message-toast.component.ts","../../../../libs/core/message-toast/message-toast.service.ts","../../../../libs/core/message-toast/provide-config.ts","../../../../libs/core/message-toast/message-toast.module.ts","../../../../libs/core/message-toast/toast-overlay-container.class.ts","../../../../libs/core/message-toast/fundamental-ngx-core-message-toast.ts"],"sourcesContent":["/** Injection token that can be used to access the data that was passed in to a Message Toast. /\nimport { InjectionToken } from '@angular/core';\nimport { MessageToastConfig } from '../config/message-toast.config';\n\nexport const MESSAGE_TOAST_DATA = new InjectionToken<any>('MessageToastData');\nexport const MESSAGE_TOAST_CONFIG = new InjectionToken<MessageToastConfig>('MessageToastConfig');\n","import { OverlayRef } from '@angular/cdk/overlay';\nimport { BaseToastDurationDismissibleRef, BaseToastPosition } from '@fundamental-ngx/cdk/utils';\nimport { MessageToastConfig } from '../config/message-toast.config';\nimport { MessageToastComponent } from '../message-toast.component';\n\nexport class MessageToastRef<T = any> extends BaseToastDurationDismissibleRef<T, MessageToastConfig> {\n /* Observable that is triggered when the message toast has timed out. /\n afterTimeout = this._afterDismissed$.asObservable();\n\n /* Data passed from the service open method. /\n readonly data: T;\n\n /* @hidden /\n constructor(\n public containerInstance: MessageToastComponent,\n public overlayRef: OverlayRef,\n public positionStrategy: BaseToastPosition\n ) {\n super(containerInstance, overlayRef, positionStrategy);\n\n this.data = this.containerInstance.config.data;\n }\n}\n","import { ChangeDetectionStrategy, Component, Inject, ViewEncapsulation } from '@angular/core';\nimport { ToastTextComponent } from '@fundamental-ngx/cdk/utils';\nimport { MESSAGE_TOAST_DATA } from '../constants/message-toast.token';\nimport { MessageToastRef } from '../ref/message-toast.ref';\n\n@Component({\n selector: 'fd-message-toast-text',\n template: `{{ message }}`,\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n standalone: true\n})\nexport class MessageToastTextComponent implements ToastTextComponent {\n /* @hidden /\n constructor(\n public toastRef: MessageToastRef<MessageToastTextComponent>,\n @Inject(MESSAGE_TOAST_DATA) public message: string\n ) {}\n}\n","import { BaseToastDurationDismissibleConfig } from '@fundamental-ngx/cdk/utils';\n\n/\n Configuration used when opening a Message Toast.\n /\nexport class MessageToastConfig<T = any> extends BaseToastDurationDismissibleConfig<T> {\n /* Whether the Message Toast should be animated. /\n animated? = false;\n}\n","import { animate, state, style, transition, trigger } from '@angular/animations';\n\nexport const toastAnimation = trigger('state', [\n state(\n 'void, hidden',\n style({\n transform: 'translateY(1rem)',\n opacity: 0\n })\n ),\n state(\n 'visible',\n style({\n transform: 'translateY(0)',\n opacity: 1\n })\n ),\n transition(' => visible', animate('150ms cubic-bezier(0, 0, 0.2, 1)')),\n transition(\n '* => void, * => hidden',\n animate(\n '75ms cubic-bezier(0.4, 0.0, 1, 1)',\n style({\n opacity: 0\n })\n )\n )\n]);\n","import { PortalModule } from '@angular/cdk/portal';\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\nimport { BaseToastDurationDismissibleContainerComponent } from '@fundamental-ngx/cdk/utils';\nimport { MessageToastConfig } from './config/message-toast.config';\nimport { toastAnimation } from './constants/message-toast.animation';\n\n@Component({\n selector: 'fd-message-toast',\n template: `<ng-template cdkPortalOutlet></ng-template>`,\n styleUrl: './message-toast.component.scss',\n animations: [toastAnimation],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n '[style.width]': 'width',\n '[style.min-width]': 'minWidth',\n '[style.max-width]': 'maxWidth',\n '[style.height]': 'height',\n '[style.min-height]': 'minHeight',\n '[style.max-height]': 'maxHeight',\n '[attr.aria-label]': 'ariaLabel',\n '[attr.aria-live]': '\"polite\"',\n '[attr.id]': 'id',\n role: 'alert',\n tabindex: '-1',\n class: 'fd-message-toast'\n },\n imports: [PortalModule]\n})\nexport class MessageToastComponent extends BaseToastDurationDismissibleContainerComponent<MessageToastConfig> {\n /** @hidden /\n constructor(config: MessageToastConfig) {\n super(config);\n }\n}\n","import { Overlay, OverlayRef } from '@angular/cdk/overlay';\nimport { EmbeddedViewRef, Inject, Injectable, Injector, StaticProvider, TemplateRef, Type } from '@angular/core';\nimport { BaseDismissibleToastService, BaseToastPosition, ToastBottomCenterPosition } from '@fundamental-ngx/cdk/utils';\nimport { MessageToastTextComponent } from './components/message-toast-text.component';\nimport { MessageToastConfig } from './config/message-toast.config';\nimport { MESSAGE_TOAST_CONFIG, MESSAGE_TOAST_DATA } from './constants/message-toast.token';\nimport { MessageToastComponent } from './message-toast.component';\nimport { MessageToastRef } from './ref/message-toast.ref';\n\n@Injectable()\nexport class MessageToastService<P = any> extends BaseDismissibleToastService<MessageToastConfig<P>> {\n /* @Hidden /\n protected toastTextComponent = MessageToastTextComponent;\n /* @Hidden /\n protected toastContainerComponent = MessageToastComponent;\n /* @Hidden /\n protected toastDataInjectionToken = MESSAGE_TOAST_DATA;\n /* @Hidden /\n protected toastPositionStrategy = ToastBottomCenterPosition;\n /* @Hidden /\n protected defaultConfig;\n\n /* @hidden /\n constructor(overlay: Overlay, injector: Injector, @Inject(MESSAGE_TOAST_CONFIG) config: MessageToastConfig) {\n super(overlay, injector);\n this.defaultConfig = config;\n }\n\n /\n Opens toast with a provided message.\n * @param message Message to display in a Message Toast.\n * @param config Toast configuration.\n * @returns Toast reference.\n /\n open<T = any>(\n message: string \| Type<T> \| TemplateRef<any>,\n config?: MessageToastConfig<P>\n ): MessageToastRef<MessageToastTextComponent \| T \| EmbeddedViewRef<any>> {\n const mergedConfig = { ...this.defaultConfig, ...config };\n if (message instanceof TemplateRef) {\n return this.openFromTemplate(message, mergedConfig);\n } else if (typeof message === 'string') {\n return this.openFromString(message, mergedConfig);\n }\n return this.openFromComponent(message, mergedConfig);\n }\n\n /\n Opens a Toast with provided message as a content.\n * @param message string to render inside a Toast.\n * @param config Toast configuration\n /\n openFromString(message: string, config?: MessageToastConfig<P>): MessageToastRef<MessageToastTextComponent> {\n const mergedConfig = { ...this.defaultConfig, ...config };\n mergedConfig.data = message;\n return this.openFromComponent(\n this.toastTextComponent,\n mergedConfig\n ) as MessageToastRef<MessageToastTextComponent>;\n }\n\n /\n Opens a Toast with provided component inside.\n * @param component Component to render inside a Toast.\n * @param config Toast configuration.\n * @returns Toast reference.\n /\n openFromComponent<T>(component: Type<T>, config: MessageToastConfig<P>): MessageToastRef<T> {\n return this._attach(component, config) as MessageToastRef<T>;\n }\n\n /\n Opens a Toast with provided Template Reference.\n * @param template Template Reference to render inside a Toast.\n * @param config Toast configuration.\n * @returns Toast reference.\n /\n openFromTemplate(template: TemplateRef<any>, config: MessageToastConfig<P>): MessageToastRef<EmbeddedViewRef<any>> {\n return this._attach(template, config) as MessageToastRef<EmbeddedViewRef<any>>;\n }\n\n /* @hidden /\n protected getContainerComponentProviders(config: MessageToastConfig<P>): StaticProvider[] {\n return [{ provide: MessageToastConfig, useValue: config }];\n }\n\n /* @hidden /\n protected getContentComponentProviders<T>(\n config: MessageToastConfig<P>,\n messageToastRef: MessageToastRef<T>\n ): StaticProvider[] {\n return [\n { provide: MessageToastRef, useValue: messageToastRef },\n { provide: this.toastDataInjectionToken, useValue: config.data }\n ];\n }\n\n /* @hidden /\n protected getToastRef<T>(\n containerRef: MessageToastComponent,\n overlayRef: OverlayRef,\n positionStrategy: BaseToastPosition = ToastBottomCenterPosition\n ): MessageToastRef<T \| EmbeddedViewRef<any>> {\n return new MessageToastRef<T \| EmbeddedViewRef<any>>(containerRef, overlayRef, positionStrategy);\n }\n}\n","import { Provider } from '@angular/core';\nimport { MessageToastConfig } from './config/message-toast.config';\nimport { MESSAGE_TOAST_CONFIG } from './constants/message-toast.token';\n\n/\n Function allows to provide custom configuration for Message Toast.\n * @param config\n * @returns\n /\nexport function provideMessageToastConfig(config: MessageToastConfig): Provider {\n return {\n provide: MESSAGE_TOAST_CONFIG,\n useValue: config\n };\n}\n","import { OverlayModule } from '@angular/cdk/overlay';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { ModuleWithProviders, NgModule } from '@angular/core';\nimport { MessageToastTextComponent } from './components/message-toast-text.component';\nimport { MessageToastConfig } from './config/message-toast.config';\nimport { MESSAGE_TOAST_CONFIG } from './constants/message-toast.token';\nimport { MessageToastComponent } from './message-toast.component';\nimport { MessageToastService } from './message-toast.service';\nimport { provideMessageToastConfig } from './provide-config';\n\n@NgModule({\n imports: [PortalModule, OverlayModule, MessageToastComponent, MessageToastTextComponent],\n exports: [MessageToastComponent],\n providers: [MessageToastService, { provide: MESSAGE_TOAST_CONFIG, useValue: new MessageToastConfig() }]\n})\nexport class MessageToastModule {\n /\n Allows configuring module on a global level with custom configuration.\n * @param config User's custom configuration.\n /\n static withConfig(config: MessageToastConfig): ModuleWithProviders<MessageToastModule> {\n return {\n ngModule: MessageToastModule,\n providers: [provideMessageToastConfig(config)]\n };\n }\n}\n","import { OverlayContainer } from '@angular/cdk/overlay';\nimport { Injectable } from '@angular/core';\n\n/\n Custom overlay container for CDK Overlay.\n /\n@Injectable()\nexport class ToastOverlayContainer extends OverlayContainer {\n /\n This method returns the overlay container element. It will lazily\n * create the element the first time it is called to facilitate using\n * the container in non-browser environments.\n * @returns the container element\n /\n getContainerElement(): HTMLElement {\n const containerElement = super.getContainerElement();\n\n containerElement.classList.add('fd-message-toast-container');\n\n return containerElement;\n }\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":["i1.MessageToastConfig"],"mappings":"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"}

package/fesm2022/fundamental-ngx-core-micro-process-flow.mjs CHANGED Viewed

@@ -381,7 +381,7 @@ class MicroProcessFlowComponent {
                 useExisting: MicroProcessFlowComponent
             },
             contentDensityObserverProviders()
-        ], queries: [{ propertyName: "items", predicate: MicroProcessFlowItemComponent }, { propertyName: "focusableItems", predicate: MicroProcessFlowFocusableItemDirective, descendants: true }], viewQueries: [{ propertyName: "_wrapperContainer", first: true, predicate: ["wrapperContainer"], descendants: true }, { propertyName: "_container", first: true, predicate: ["container"], descendants: true }, { propertyName: "_goNextButton", first: true, predicate: ["goNextButton"], descendants: true }], ngImport: i0, template: "@if (showPreviousButton) {\n    <a\n        tabindex=\"0\"\n        class=\"fd-micro-process-flow__link-previous\"\n        role=\"button\"\n        type=\"button\"\n        (click)=\"goBack()\"\n        (keypress)=\"onKeypressHandler(-1, $event)\"\n    >\n        {{ previousItemsCount }}\n    </a>\n}\n<div class=\"fd-micro-process-flow__overflow-container\" #container>\n    <div\n        class=\"fd-micro-process-flow__wrapper\"\n        #wrapperContainer\n        [style.transition-duration]=\"transitionSpeed + 'ms'\"\n        [style.transition-timing-function]=\"transitionTimingFunction\"\n    >\n        <ng-content select=\"fd-micro-process-flow-item\"></ng-content>\n    </div>\n</div>\n@if (showNextButton) {\n    <a\n        tabindex=\"0\"\n        class=\"fd-micro-process-flow__link-next\"\n        role=\"button\"\n        type=\"button\"\n        (click)=\"goNext()\"\n        (keypress)=\"onKeypressHandler(1, $event)\"\n        #goNextButton\n    >\n        {{ nextItemsCount }}\n    </a>\n}\n", styles: [":root{--fdMicro_Process_Flow_Item_Background:var(--sapNeutralBackground);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNeutralBorderColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--fdMicro_Process_Flow_Item_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--fdMicro_Process_Flow_Item_Border_Color);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Width:2.75rem;--fdMicro_Process_Flow_Item_Min_Width:1.875rem;--fdMicro_Process_Flow_Compact_Item_Width:2rem;--fdMicro_Process_Flow_Compact_Item_Min_Width:1.375rem;--fdMicro_Process_Flow_Connector_Width:1.125rem;--fdMicro_Process_Flow_Compact_Connector_Width:.625rem;--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontLargeSize);--fdMicro_Process_Flow_Visible_items:8;--fdMicro_Process_Flow_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem);--fdMicro_Process_Flow_Compact_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Compact_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem)}.fd-micro-process-flow{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;max-width:var(--fdMicro_Process_Flow_Max_Container_Width)}.fd-micro-process-flow:after,.fd-micro-process-flow:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow--independent-steps .fd-micro-process-flow__connector:before{border-color:transparent}.fd-micro-process-flow__wrapper{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.fd-micro-process-flow__wrapper:after,.fd-micro-process-flow__wrapper:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__overflow-container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;overflow:hidden;width:100%}.fd-micro-process-flow__overflow-container:after,.fd-micro-process-flow__overflow-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next,.fd-micro-process-flow__link-previous{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);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-inline:0;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapGroup_TitleTextColor);cursor:pointer;font-size:var(--sapFontSize);padding-block:0;padding-inline:.313rem;text-shadow:var(--sapContent_TextShadow)}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next.is-focus,.fd-micro-process-flow__link-next:focus,.fd-micro-process-flow__link-previous.is-focus,.fd-micro-process-flow__link-previous:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapButton_TextColor);font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-micro-process-flow__link-next.is-hover:after,.fd-micro-process-flow__link-next.is-hover:before,.fd-micro-process-flow__link-next:hover:after,.fd-micro-process-flow__link-next:hover:before,.fd-micro-process-flow__link-previous.is-hover:after,.fd-micro-process-flow__link-previous.is-hover:before,.fd-micro-process-flow__link-previous:hover:after,.fd-micro-process-flow__link-previous:hover:before{color:var(--sapButton_Hover_TextColor)}.fd-micro-process-flow__link-previous:before{content:\"\\e067\";-webkit-padding-end:.313rem;padding-inline-end:.313rem}.fd-micro-process-flow__link-previous[dir=rtl]:before,[dir=rtl] .fd-micro-process-flow__link-previous:before{content:\"\\e066\"}.fd-micro-process-flow__link-next{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.fd-micro-process-flow__link-next:after{content:\"\\e066\";-webkit-padding-start:.313rem;padding-inline-start:.313rem}.fd-micro-process-flow__link-next[dir=rtl]:after,[dir=rtl] .fd-micro-process-flow__link-next:after{content:\"\\e067\"}.fd-micro-process-flow .fd-micro-process-flow__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-padding-start:.1875rem;margin-block:calc(var(--sapContent_FocusWidth) + var(--sapContent_FocusWidth));margin-inline:0;padding-inline-start:.1875rem;position:relative;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-micro-process-flow .fd-micro-process-flow__item:after,.fd-micro-process-flow .fd-micro-process-flow__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__item--positive{--fdMicro_Process_Flow_Item_Background:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--information{--fdMicro_Process_Flow_Item_Background:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--negative{--fdMicro_Process_Flow_Item_Background:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--critical{--fdMicro_Process_Flow_Item_Background:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container.is-hover,.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container:hover{--fdMicro_Process_Flow_Icon_Color:var(--sapButton_Information_Hover_TextColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapInformationBorderColor)}.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container.is-active,.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container:active{--fdMicro_Process_Flow_Icon_Color:var(--sapContent_ContrastIconColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapContent_Selected_ForegroundColor)}.fd-micro-process-flow .fd-micro-process-flow__item .fd-status-indicator .fdstatus-indicator__svg{width:auto}.fd-micro-process-flow__focusable-item.is-focus,.fd-micro-process-flow__focusable-item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:.0625rem}.fd-micro-process-flow .fd-micro-process-flow__icon-container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--fdMicro_Process_Flow_Item_Background);border:.0625rem solid var(--fdMicro_Process_Flow_Item_Border_Color);border-radius:50%;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width)}.fd-micro-process-flow .fd-micro-process-flow__icon-container:after,.fd-micro-process-flow .fd-micro-process-flow__icon-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__icon-container .fd-micro-process-flow__icon{color:var(--fdMicro_Process_Flow_Icon_Color);font-size:var(--fdMicro_Process_Flow_Icon_Font_Size)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-hover,.fd-micro-process-flow .fd-micro-process-flow__icon-container:hover{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Hover_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Hover_Border_Color)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-active,.fd-micro-process-flow .fd-micro-process-flow__icon-container:active{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Active_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Active_Border_Color);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow__content{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width);width:100%}.fd-micro-process-flow__content:after,.fd-micro-process-flow__content:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;height:100%;min-width:var(--fdMicro_Process_Flow_Connector_Width);position:relative;-webkit-margin-start:.1875rem;margin-inline-start:.1875rem}.fd-micro-process-flow__connector:after,.fd-micro-process-flow__connector:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector:before{border-bottom:.0625rem solid var(--sapContent_ForegroundBorderColor);content:\"\";display:block;position:absolute;width:100%;z-index:1}.fd-micro-process-flow__connector--intermediate:after{background:var(--sapNegativeElementColor);bottom:0;content:\"\";display:block;left:50%;position:absolute;top:0;width:.25rem;-webkit-margin-start:-.125rem;margin-inline-start:-.125rem;z-index:2}.fd-micro-process-flow__connector--intermediate[dir=rtl]:after,[dir=rtl] .fd-micro-process-flow__connector--intermediate:after{-webkit-margin-end:-.125rem;margin-inline-end:-.125rem}.fd-micro-process-flow__connector .fd-micro-process-flow__intermediary-item{line-height:1;position:relative;z-index:3}.fd-micro-process-flow[class*=-compact],.fd-micro-process-flow[class*=-condensed],[class*=-compact] .fd-micro-process-flow:not([class*=-cozy]),[class*=-condensed] .fd-micro-process-flow:not([class*=-cozy]){--fdMicro_Process_Flow_Item_Min_Width:var(--fdMicro_Process_Flow_Compact_Item_Min_Width);--fdMicro_Process_Flow_Connector_Width:var(--fdMicro_Process_Flow_Compact_Connector_Width);--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontSmallSize);--fdMicro_Process_Flow_Item_Width:var(--fdMicro_Process_Flow_Compact_Item_Width);--fdMicro_Process_Flow_Max_Container_Width:var(--fdMicro_Process_Flow_Compact_Max_Container_Width)}\n/*! Bundled license information:\n\nfundamental-styles/dist/micro-process-flow.css:\n  (*!\n   * Fundamental Library Styles v0.38.0\n   * Copyright (c) 2024 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"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "items", predicate: MicroProcessFlowItemComponent }, { propertyName: "focusableItems", predicate: MicroProcessFlowFocusableItemDirective, descendants: true }], viewQueries: [{ propertyName: "_wrapperContainer", first: true, predicate: ["wrapperContainer"], descendants: true }, { propertyName: "_container", first: true, predicate: ["container"], descendants: true }, { propertyName: "_goNextButton", first: true, predicate: ["goNextButton"], descendants: true }], ngImport: i0, template: "@if (showPreviousButton) {\n    <a\n        tabindex=\"0\"\n        class=\"fd-micro-process-flow__link-previous\"\n        role=\"button\"\n        type=\"button\"\n        (click)=\"goBack()\"\n        (keypress)=\"onKeypressHandler(-1, $event)\"\n    >\n        {{ previousItemsCount }}\n    </a>\n}\n<div class=\"fd-micro-process-flow__overflow-container\" #container>\n    <div\n        class=\"fd-micro-process-flow__wrapper\"\n        #wrapperContainer\n        [style.transition-duration]=\"transitionSpeed + 'ms'\"\n        [style.transition-timing-function]=\"transitionTimingFunction\"\n    >\n        <ng-content select=\"fd-micro-process-flow-item\"></ng-content>\n    </div>\n</div>\n@if (showNextButton) {\n    <a\n        tabindex=\"0\"\n        class=\"fd-micro-process-flow__link-next\"\n        role=\"button\"\n        type=\"button\"\n        (click)=\"goNext()\"\n        (keypress)=\"onKeypressHandler(1, $event)\"\n        #goNextButton\n    >\n        {{ nextItemsCount }}\n    </a>\n}\n", styles: [":root{--fdMicro_Process_Flow_Item_Background:var(--sapNeutralBackground);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNeutralBorderColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--fdMicro_Process_Flow_Item_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--fdMicro_Process_Flow_Item_Border_Color);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Width:2.75rem;--fdMicro_Process_Flow_Item_Min_Width:1.875rem;--fdMicro_Process_Flow_Compact_Item_Width:2rem;--fdMicro_Process_Flow_Compact_Item_Min_Width:1.375rem;--fdMicro_Process_Flow_Connector_Width:1.125rem;--fdMicro_Process_Flow_Compact_Connector_Width:.625rem;--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontLargeSize);--fdMicro_Process_Flow_Visible_items:8;--fdMicro_Process_Flow_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem);--fdMicro_Process_Flow_Compact_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Compact_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem)}.fd-micro-process-flow{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;max-width:var(--fdMicro_Process_Flow_Max_Container_Width)}.fd-micro-process-flow:after,.fd-micro-process-flow:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow--independent-steps .fd-micro-process-flow__connector:before{border-color:transparent}.fd-micro-process-flow__wrapper{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.fd-micro-process-flow__wrapper:after,.fd-micro-process-flow__wrapper:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__overflow-container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;overflow:hidden;width:100%}.fd-micro-process-flow__overflow-container:after,.fd-micro-process-flow__overflow-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next,.fd-micro-process-flow__link-previous{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);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-inline:0;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapGroup_TitleTextColor);cursor:pointer;font-size:var(--sapFontSize);padding-block:0;padding-inline:.313rem;text-shadow:var(--sapContent_TextShadow)}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next.is-focus,.fd-micro-process-flow__link-next:focus,.fd-micro-process-flow__link-previous.is-focus,.fd-micro-process-flow__link-previous:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapButton_TextColor);font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-micro-process-flow__link-next.is-hover:after,.fd-micro-process-flow__link-next.is-hover:before,.fd-micro-process-flow__link-next:hover:after,.fd-micro-process-flow__link-next:hover:before,.fd-micro-process-flow__link-previous.is-hover:after,.fd-micro-process-flow__link-previous.is-hover:before,.fd-micro-process-flow__link-previous:hover:after,.fd-micro-process-flow__link-previous:hover:before{color:var(--sapButton_Hover_TextColor)}.fd-micro-process-flow__link-previous:before{content:\"\\e067\";-webkit-padding-end:.313rem;padding-inline-end:.313rem}.fd-micro-process-flow__link-previous[dir=rtl]:before,[dir=rtl] .fd-micro-process-flow__link-previous:before{content:\"\\e066\"}.fd-micro-process-flow__link-next{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.fd-micro-process-flow__link-next:after{content:\"\\e066\";-webkit-padding-start:.313rem;padding-inline-start:.313rem}.fd-micro-process-flow__link-next[dir=rtl]:after,[dir=rtl] .fd-micro-process-flow__link-next:after{content:\"\\e067\"}.fd-micro-process-flow .fd-micro-process-flow__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-padding-start:.1875rem;margin-block:calc(var(--sapContent_FocusWidth) + var(--sapContent_FocusWidth));margin-inline:0;padding-inline-start:.1875rem;position:relative;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-micro-process-flow .fd-micro-process-flow__item:after,.fd-micro-process-flow .fd-micro-process-flow__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__item--positive{--fdMicro_Process_Flow_Item_Background:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--information{--fdMicro_Process_Flow_Item_Background:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--negative{--fdMicro_Process_Flow_Item_Background:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--critical{--fdMicro_Process_Flow_Item_Background:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container.is-hover,.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container:hover{--fdMicro_Process_Flow_Icon_Color:var(--sapButton_Information_Hover_TextColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapInformationBorderColor)}.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container.is-active,.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container:active{--fdMicro_Process_Flow_Icon_Color:var(--sapContent_ContrastIconColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapContent_Selected_ForegroundColor)}.fd-micro-process-flow .fd-micro-process-flow__item .fd-status-indicator .fdstatus-indicator__svg{width:auto}.fd-micro-process-flow__focusable-item.is-focus,.fd-micro-process-flow__focusable-item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:.0625rem}.fd-micro-process-flow .fd-micro-process-flow__icon-container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--fdMicro_Process_Flow_Item_Background);border:.0625rem solid var(--fdMicro_Process_Flow_Item_Border_Color);border-radius:50%;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width)}.fd-micro-process-flow .fd-micro-process-flow__icon-container:after,.fd-micro-process-flow .fd-micro-process-flow__icon-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__icon-container .fd-micro-process-flow__icon{color:var(--fdMicro_Process_Flow_Icon_Color);font-size:var(--fdMicro_Process_Flow_Icon_Font_Size)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-hover,.fd-micro-process-flow .fd-micro-process-flow__icon-container:hover{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Hover_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Hover_Border_Color)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-active,.fd-micro-process-flow .fd-micro-process-flow__icon-container:active{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Active_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Active_Border_Color);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow__content{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width);width:100%}.fd-micro-process-flow__content:after,.fd-micro-process-flow__content:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;height:100%;min-width:var(--fdMicro_Process_Flow_Connector_Width);position:relative;-webkit-margin-start:.1875rem;margin-inline-start:.1875rem}.fd-micro-process-flow__connector:after,.fd-micro-process-flow__connector:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector:before{border-bottom:.0625rem solid var(--sapContent_ForegroundBorderColor);content:\"\";display:block;position:absolute;width:100%;z-index:1}.fd-micro-process-flow__connector--intermediate:after{background:var(--sapNegativeElementColor);bottom:0;content:\"\";display:block;left:50%;position:absolute;top:0;width:.25rem;-webkit-margin-start:-.125rem;margin-inline-start:-.125rem;z-index:2}.fd-micro-process-flow__connector--intermediate[dir=rtl]:after,[dir=rtl] .fd-micro-process-flow__connector--intermediate:after{-webkit-margin-end:-.125rem;margin-inline-end:-.125rem}.fd-micro-process-flow__connector .fd-micro-process-flow__intermediary-item{line-height:1;position:relative;z-index:3}.fd-micro-process-flow[class*=-compact],.fd-micro-process-flow[class*=-condensed],[class*=-compact] .fd-micro-process-flow:not([class*=-cozy]),[class*=-condensed] .fd-micro-process-flow:not([class*=-cozy]){--fdMicro_Process_Flow_Item_Min_Width:var(--fdMicro_Process_Flow_Compact_Item_Min_Width);--fdMicro_Process_Flow_Connector_Width:var(--fdMicro_Process_Flow_Compact_Connector_Width);--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontSmallSize);--fdMicro_Process_Flow_Item_Width:var(--fdMicro_Process_Flow_Compact_Item_Width);--fdMicro_Process_Flow_Max_Container_Width:var(--fdMicro_Process_Flow_Compact_Max_Container_Width)}\n/*! Bundled license information:\n\nfundamental-styles/dist/micro-process-flow.css:\n  (*!\n   * Fundamental Library Styles v0.39.2\n   * Copyright (c) 2025 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"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: MicroProcessFlowComponent, decorators: [{
             type: Component,
@@ -394,7 +394,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                             useExisting: MicroProcessFlowComponent
                         },
                         contentDensityObserverProviders()
-                    ], imports: [], template: "@if (showPreviousButton) {\n    <a\n        tabindex=\"0\"\n        class=\"fd-micro-process-flow__link-previous\"\n        role=\"button\"\n        type=\"button\"\n        (click)=\"goBack()\"\n        (keypress)=\"onKeypressHandler(-1, $event)\"\n    >\n        {{ previousItemsCount }}\n    </a>\n}\n<div class=\"fd-micro-process-flow__overflow-container\" #container>\n    <div\n        class=\"fd-micro-process-flow__wrapper\"\n        #wrapperContainer\n        [style.transition-duration]=\"transitionSpeed + 'ms'\"\n        [style.transition-timing-function]=\"transitionTimingFunction\"\n    >\n        <ng-content select=\"fd-micro-process-flow-item\"></ng-content>\n    </div>\n</div>\n@if (showNextButton) {\n    <a\n        tabindex=\"0\"\n        class=\"fd-micro-process-flow__link-next\"\n        role=\"button\"\n        type=\"button\"\n        (click)=\"goNext()\"\n        (keypress)=\"onKeypressHandler(1, $event)\"\n        #goNextButton\n    >\n        {{ nextItemsCount }}\n    </a>\n}\n", styles: [":root{--fdMicro_Process_Flow_Item_Background:var(--sapNeutralBackground);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNeutralBorderColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--fdMicro_Process_Flow_Item_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--fdMicro_Process_Flow_Item_Border_Color);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Width:2.75rem;--fdMicro_Process_Flow_Item_Min_Width:1.875rem;--fdMicro_Process_Flow_Compact_Item_Width:2rem;--fdMicro_Process_Flow_Compact_Item_Min_Width:1.375rem;--fdMicro_Process_Flow_Connector_Width:1.125rem;--fdMicro_Process_Flow_Compact_Connector_Width:.625rem;--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontLargeSize);--fdMicro_Process_Flow_Visible_items:8;--fdMicro_Process_Flow_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem);--fdMicro_Process_Flow_Compact_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Compact_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem)}.fd-micro-process-flow{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;max-width:var(--fdMicro_Process_Flow_Max_Container_Width)}.fd-micro-process-flow:after,.fd-micro-process-flow:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow--independent-steps .fd-micro-process-flow__connector:before{border-color:transparent}.fd-micro-process-flow__wrapper{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.fd-micro-process-flow__wrapper:after,.fd-micro-process-flow__wrapper:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__overflow-container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;overflow:hidden;width:100%}.fd-micro-process-flow__overflow-container:after,.fd-micro-process-flow__overflow-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next,.fd-micro-process-flow__link-previous{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);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-inline:0;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapGroup_TitleTextColor);cursor:pointer;font-size:var(--sapFontSize);padding-block:0;padding-inline:.313rem;text-shadow:var(--sapContent_TextShadow)}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next.is-focus,.fd-micro-process-flow__link-next:focus,.fd-micro-process-flow__link-previous.is-focus,.fd-micro-process-flow__link-previous:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapButton_TextColor);font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-micro-process-flow__link-next.is-hover:after,.fd-micro-process-flow__link-next.is-hover:before,.fd-micro-process-flow__link-next:hover:after,.fd-micro-process-flow__link-next:hover:before,.fd-micro-process-flow__link-previous.is-hover:after,.fd-micro-process-flow__link-previous.is-hover:before,.fd-micro-process-flow__link-previous:hover:after,.fd-micro-process-flow__link-previous:hover:before{color:var(--sapButton_Hover_TextColor)}.fd-micro-process-flow__link-previous:before{content:\"\\e067\";-webkit-padding-end:.313rem;padding-inline-end:.313rem}.fd-micro-process-flow__link-previous[dir=rtl]:before,[dir=rtl] .fd-micro-process-flow__link-previous:before{content:\"\\e066\"}.fd-micro-process-flow__link-next{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.fd-micro-process-flow__link-next:after{content:\"\\e066\";-webkit-padding-start:.313rem;padding-inline-start:.313rem}.fd-micro-process-flow__link-next[dir=rtl]:after,[dir=rtl] .fd-micro-process-flow__link-next:after{content:\"\\e067\"}.fd-micro-process-flow .fd-micro-process-flow__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-padding-start:.1875rem;margin-block:calc(var(--sapContent_FocusWidth) + var(--sapContent_FocusWidth));margin-inline:0;padding-inline-start:.1875rem;position:relative;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-micro-process-flow .fd-micro-process-flow__item:after,.fd-micro-process-flow .fd-micro-process-flow__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__item--positive{--fdMicro_Process_Flow_Item_Background:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--information{--fdMicro_Process_Flow_Item_Background:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--negative{--fdMicro_Process_Flow_Item_Background:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--critical{--fdMicro_Process_Flow_Item_Background:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container.is-hover,.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container:hover{--fdMicro_Process_Flow_Icon_Color:var(--sapButton_Information_Hover_TextColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapInformationBorderColor)}.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container.is-active,.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container:active{--fdMicro_Process_Flow_Icon_Color:var(--sapContent_ContrastIconColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapContent_Selected_ForegroundColor)}.fd-micro-process-flow .fd-micro-process-flow__item .fd-status-indicator .fdstatus-indicator__svg{width:auto}.fd-micro-process-flow__focusable-item.is-focus,.fd-micro-process-flow__focusable-item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:.0625rem}.fd-micro-process-flow .fd-micro-process-flow__icon-container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--fdMicro_Process_Flow_Item_Background);border:.0625rem solid var(--fdMicro_Process_Flow_Item_Border_Color);border-radius:50%;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width)}.fd-micro-process-flow .fd-micro-process-flow__icon-container:after,.fd-micro-process-flow .fd-micro-process-flow__icon-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__icon-container .fd-micro-process-flow__icon{color:var(--fdMicro_Process_Flow_Icon_Color);font-size:var(--fdMicro_Process_Flow_Icon_Font_Size)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-hover,.fd-micro-process-flow .fd-micro-process-flow__icon-container:hover{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Hover_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Hover_Border_Color)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-active,.fd-micro-process-flow .fd-micro-process-flow__icon-container:active{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Active_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Active_Border_Color);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow__content{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width);width:100%}.fd-micro-process-flow__content:after,.fd-micro-process-flow__content:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;height:100%;min-width:var(--fdMicro_Process_Flow_Connector_Width);position:relative;-webkit-margin-start:.1875rem;margin-inline-start:.1875rem}.fd-micro-process-flow__connector:after,.fd-micro-process-flow__connector:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector:before{border-bottom:.0625rem solid var(--sapContent_ForegroundBorderColor);content:\"\";display:block;position:absolute;width:100%;z-index:1}.fd-micro-process-flow__connector--intermediate:after{background:var(--sapNegativeElementColor);bottom:0;content:\"\";display:block;left:50%;position:absolute;top:0;width:.25rem;-webkit-margin-start:-.125rem;margin-inline-start:-.125rem;z-index:2}.fd-micro-process-flow__connector--intermediate[dir=rtl]:after,[dir=rtl] .fd-micro-process-flow__connector--intermediate:after{-webkit-margin-end:-.125rem;margin-inline-end:-.125rem}.fd-micro-process-flow__connector .fd-micro-process-flow__intermediary-item{line-height:1;position:relative;z-index:3}.fd-micro-process-flow[class*=-compact],.fd-micro-process-flow[class*=-condensed],[class*=-compact] .fd-micro-process-flow:not([class*=-cozy]),[class*=-condensed] .fd-micro-process-flow:not([class*=-cozy]){--fdMicro_Process_Flow_Item_Min_Width:var(--fdMicro_Process_Flow_Compact_Item_Min_Width);--fdMicro_Process_Flow_Connector_Width:var(--fdMicro_Process_Flow_Compact_Connector_Width);--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontSmallSize);--fdMicro_Process_Flow_Item_Width:var(--fdMicro_Process_Flow_Compact_Item_Width);--fdMicro_Process_Flow_Max_Container_Width:var(--fdMicro_Process_Flow_Compact_Max_Container_Width)}\n/*! Bundled license information:\n\nfundamental-styles/dist/micro-process-flow.css:\n  (*!\n   * Fundamental Library Styles v0.38.0\n   * Copyright (c) 2024 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: [], template: "@if (showPreviousButton) {\n    <a\n        tabindex=\"0\"\n        class=\"fd-micro-process-flow__link-previous\"\n        role=\"button\"\n        type=\"button\"\n        (click)=\"goBack()\"\n        (keypress)=\"onKeypressHandler(-1, $event)\"\n    >\n        {{ previousItemsCount }}\n    </a>\n}\n<div class=\"fd-micro-process-flow__overflow-container\" #container>\n    <div\n        class=\"fd-micro-process-flow__wrapper\"\n        #wrapperContainer\n        [style.transition-duration]=\"transitionSpeed + 'ms'\"\n        [style.transition-timing-function]=\"transitionTimingFunction\"\n    >\n        <ng-content select=\"fd-micro-process-flow-item\"></ng-content>\n    </div>\n</div>\n@if (showNextButton) {\n    <a\n        tabindex=\"0\"\n        class=\"fd-micro-process-flow__link-next\"\n        role=\"button\"\n        type=\"button\"\n        (click)=\"goNext()\"\n        (keypress)=\"onKeypressHandler(1, $event)\"\n        #goNextButton\n    >\n        {{ nextItemsCount }}\n    </a>\n}\n", styles: [":root{--fdMicro_Process_Flow_Item_Background:var(--sapNeutralBackground);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNeutralBorderColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--fdMicro_Process_Flow_Item_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--fdMicro_Process_Flow_Item_Border_Color);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Width:2.75rem;--fdMicro_Process_Flow_Item_Min_Width:1.875rem;--fdMicro_Process_Flow_Compact_Item_Width:2rem;--fdMicro_Process_Flow_Compact_Item_Min_Width:1.375rem;--fdMicro_Process_Flow_Connector_Width:1.125rem;--fdMicro_Process_Flow_Compact_Connector_Width:.625rem;--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontLargeSize);--fdMicro_Process_Flow_Visible_items:8;--fdMicro_Process_Flow_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem);--fdMicro_Process_Flow_Compact_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Compact_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem)}.fd-micro-process-flow{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;max-width:var(--fdMicro_Process_Flow_Max_Container_Width)}.fd-micro-process-flow:after,.fd-micro-process-flow:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow--independent-steps .fd-micro-process-flow__connector:before{border-color:transparent}.fd-micro-process-flow__wrapper{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.fd-micro-process-flow__wrapper:after,.fd-micro-process-flow__wrapper:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__overflow-container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;overflow:hidden;width:100%}.fd-micro-process-flow__overflow-container:after,.fd-micro-process-flow__overflow-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next,.fd-micro-process-flow__link-previous{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);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-inline:0;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapGroup_TitleTextColor);cursor:pointer;font-size:var(--sapFontSize);padding-block:0;padding-inline:.313rem;text-shadow:var(--sapContent_TextShadow)}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next.is-focus,.fd-micro-process-flow__link-next:focus,.fd-micro-process-flow__link-previous.is-focus,.fd-micro-process-flow__link-previous:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapButton_TextColor);font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-micro-process-flow__link-next.is-hover:after,.fd-micro-process-flow__link-next.is-hover:before,.fd-micro-process-flow__link-next:hover:after,.fd-micro-process-flow__link-next:hover:before,.fd-micro-process-flow__link-previous.is-hover:after,.fd-micro-process-flow__link-previous.is-hover:before,.fd-micro-process-flow__link-previous:hover:after,.fd-micro-process-flow__link-previous:hover:before{color:var(--sapButton_Hover_TextColor)}.fd-micro-process-flow__link-previous:before{content:\"\\e067\";-webkit-padding-end:.313rem;padding-inline-end:.313rem}.fd-micro-process-flow__link-previous[dir=rtl]:before,[dir=rtl] .fd-micro-process-flow__link-previous:before{content:\"\\e066\"}.fd-micro-process-flow__link-next{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.fd-micro-process-flow__link-next:after{content:\"\\e066\";-webkit-padding-start:.313rem;padding-inline-start:.313rem}.fd-micro-process-flow__link-next[dir=rtl]:after,[dir=rtl] .fd-micro-process-flow__link-next:after{content:\"\\e067\"}.fd-micro-process-flow .fd-micro-process-flow__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-padding-start:.1875rem;margin-block:calc(var(--sapContent_FocusWidth) + var(--sapContent_FocusWidth));margin-inline:0;padding-inline-start:.1875rem;position:relative;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-micro-process-flow .fd-micro-process-flow__item:after,.fd-micro-process-flow .fd-micro-process-flow__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__item--positive{--fdMicro_Process_Flow_Item_Background:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--information{--fdMicro_Process_Flow_Item_Background:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--negative{--fdMicro_Process_Flow_Item_Background:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--critical{--fdMicro_Process_Flow_Item_Background:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container.is-hover,.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container:hover{--fdMicro_Process_Flow_Icon_Color:var(--sapButton_Information_Hover_TextColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapInformationBorderColor)}.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container.is-active,.fd-micro-process-flow .fd-micro-process-flow__item--information .fd-micro-process-flow__icon-container:active{--fdMicro_Process_Flow_Icon_Color:var(--sapContent_ContrastIconColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapContent_Selected_ForegroundColor)}.fd-micro-process-flow .fd-micro-process-flow__item .fd-status-indicator .fdstatus-indicator__svg{width:auto}.fd-micro-process-flow__focusable-item.is-focus,.fd-micro-process-flow__focusable-item:focus{outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:.0625rem}.fd-micro-process-flow .fd-micro-process-flow__icon-container{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--fdMicro_Process_Flow_Item_Background);border:.0625rem solid var(--fdMicro_Process_Flow_Item_Border_Color);border-radius:50%;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width)}.fd-micro-process-flow .fd-micro-process-flow__icon-container:after,.fd-micro-process-flow .fd-micro-process-flow__icon-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__icon-container .fd-micro-process-flow__icon{color:var(--fdMicro_Process_Flow_Icon_Color);font-size:var(--fdMicro_Process_Flow_Icon_Font_Size)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-hover,.fd-micro-process-flow .fd-micro-process-flow__icon-container:hover{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Hover_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Hover_Border_Color)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-active,.fd-micro-process-flow .fd-micro-process-flow__icon-container:active{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Active_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Active_Border_Color);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow__content{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width);width:100%}.fd-micro-process-flow__content:after,.fd-micro-process-flow__content:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;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;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;height:100%;min-width:var(--fdMicro_Process_Flow_Connector_Width);position:relative;-webkit-margin-start:.1875rem;margin-inline-start:.1875rem}.fd-micro-process-flow__connector:after,.fd-micro-process-flow__connector:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector:before{border-bottom:.0625rem solid var(--sapContent_ForegroundBorderColor);content:\"\";display:block;position:absolute;width:100%;z-index:1}.fd-micro-process-flow__connector--intermediate:after{background:var(--sapNegativeElementColor);bottom:0;content:\"\";display:block;left:50%;position:absolute;top:0;width:.25rem;-webkit-margin-start:-.125rem;margin-inline-start:-.125rem;z-index:2}.fd-micro-process-flow__connector--intermediate[dir=rtl]:after,[dir=rtl] .fd-micro-process-flow__connector--intermediate:after{-webkit-margin-end:-.125rem;margin-inline-end:-.125rem}.fd-micro-process-flow__connector .fd-micro-process-flow__intermediary-item{line-height:1;position:relative;z-index:3}.fd-micro-process-flow[class*=-compact],.fd-micro-process-flow[class*=-condensed],[class*=-compact] .fd-micro-process-flow:not([class*=-cozy]),[class*=-condensed] .fd-micro-process-flow:not([class*=-cozy]){--fdMicro_Process_Flow_Item_Min_Width:var(--fdMicro_Process_Flow_Compact_Item_Min_Width);--fdMicro_Process_Flow_Connector_Width:var(--fdMicro_Process_Flow_Compact_Connector_Width);--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontSmallSize);--fdMicro_Process_Flow_Item_Width:var(--fdMicro_Process_Flow_Compact_Item_Width);--fdMicro_Process_Flow_Max_Container_Width:var(--fdMicro_Process_Flow_Compact_Max_Container_Width)}\n/*! Bundled license information:\n\nfundamental-styles/dist/micro-process-flow.css:\n  (*!\n   * Fundamental Library Styles v0.39.2\n   * Copyright (c) 2025 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: i0.ChangeDetectorRef }, { type: i1.RtlService, decorators: [{
                     type: Optional
                 }] }], propDecorators: { independentSteps: [{

package/fesm2022/fundamental-ngx-core-multi-combobox.mjs CHANGED Viewed

@@ -1387,7 +1387,7 @@ class MultiComboboxComponent extends BaseMultiCombobox {
                 provide: MULTI_COMBOBOX_COMPONENT,
                 useExisting: MultiComboboxComponent
             }
-        ], queries: [{ propertyName: "customTemplates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true, read: ElementRef }, { propertyName: "listComponent", first: true, predicate: FD_LIST_COMPONENT, descendants: true }, { propertyName: "mobileControlTemplate", first: true, predicate: ["mobileControlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_tokenizer", first: true, predicate: TokenizerComponent, descendants: true }, { propertyName: "_inputGroup", first: true, predicate: ["inputGroup"], descendants: true, read: ElementRef }], usesInheritance: true, hostDirectives: [{ directive: i2.CvaDirective, inputs: ["id", "inputId", "placeholder", "placeholder", "state", "state", "stateMessage", "stateMessage", "disabled", "disabled", "readonly", "readonly", "name", "name"] }, { directive: i3.DataSourceDirective, inputs: ["dataSource", "dataSource"], outputs: ["dataChanged", "dataChanged"] }], ngImport: i0, template: "<div class=\"fd-multi-combobox\">\n    @if (mobile) {\n        <ng-template [ngTemplateOutlet]=\"controlTemplate\"></ng-template>\n    } @else {\n        <fd-popover\n            additionalBodyClass=\"fd-popover-custom-list fd-multi-combobox__list-container\"\n            (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n            [isOpen]=\"isOpen\"\n            [triggers]=\"[]\"\n            [disabled]=\"_cva.disabled\"\n            [maxWidth]=\"_popoverMaxWidth\"\n            [fillControlMode]=\"fillControlMode\"\n        >\n            <fd-popover-control>\n                <ng-template [ngTemplateOutlet]=\"controlTemplate\"></ng-template>\n            </fd-popover-control>\n            <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n                <ng-template [ngTemplateOutlet]=\"listTemplate\"></ng-template>\n                <ng-content></ng-content>\n            </fd-popover-body>\n        </fd-popover>\n    }\n</div>\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            #inputGroup\n            [id]=\"_cva.id + '-input-group-container'\"\n            [state]=\"_cva.state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!_cva.readonly\"\n            [glyph]=\"!_cva.readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"_cva.disabled || _cva.readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"_cva.disabled || _cva.readonly\"\n            [attr.aria-readonly]=\"_cva.readonly\"\n            [glyphAriaLabel]=\"_cva.ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && _onPrimaryButtonClick(false)\"\n            (keydown)=\"_navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                [tokenizerFocusable]=\"false\"\n                [compactCollapse]=\"true\"\n                [showOverflowPopover]=\"false\"\n                #tokenizer\n                class=\"fd-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"_moreClicked()\"\n                fdMultiAnnouncer\n                [multiAnnouncerOptions]=\"_suggestions\"\n            >\n                @for (token of _selectedSuggestions; track token) {\n                    <fd-token [readOnly]=\"_cva.disabled\" (onCloseClick)=\"_removeToken(token, $event)\">\n                        {{ token.label }}\n                    </fd-token>\n                }\n                <input\n                    #searchInputElement\n                    fdkAutoComplete\n                    (onComplete)=\"_onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    autocomplete=\"off\"\n                    [ariaLabel]=\"'coreMultiComboBox.multiComboBoxAriaLabel' | fdTranslate\"\n                    [attr.aria-labelledby]=\"_cva.ariaLabelledBy\"\n                    [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                    [attr.aria-owns]=\"autoComplete && !mobile ? _cva.id + '-result' : null\"\n                    [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                    fd-form-control\n                    fd-input-group-input\n                    tabindex=\"0\"\n                    [id]=\"_cva.id\"\n                    [name]=\"_cva.name\"\n                    (keydown)=\"_onInputKeydownHandler($event)\"\n                    [disabled]=\"_cva.disabled\"\n                    [(ngModel)]=\"inputText\"\n                    (ngModelChange)=\"_searchTermChanged()\"\n                    [attr.placeholder]=\"_selectedSuggestions.length ? null : _cva.placeholder\"\n                    (focus)=\"tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && _onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"_cva.readonly\"\n                    [attr.aria-readonly]=\"_cva.readonly\"\n                    [attr.aria-required]=\"_cva.required\"\n                    [displayFn]=\"_displayFn\"\n                    class=\"fd-tokenizer__input fd-input-group__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n        @if (mobile && isOpen ? false : !!_cva.stateMessage) {\n            <fd-form-message [type]=\"_cva.state\" [innerHtml]=\"_cva.stateMessage\"></fd-form-message>\n        }\n    </fd-form-input-message-group>\n</ng-template>\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"_cva.id + '-input-group-container'\"\n        class=\"fd-multi-combobox-input-group-custom\"\n        [state]=\"_cva.state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"_cva.disabled || _cva.readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"_cva.disabled || _cva.readonly\"\n        [attr.aria-readonly]=\"_cva.readonly\"\n        [glyphAriaLabel]=\"_cva.ariaLabel\"\n    >\n        <input\n            fdkAutoComplete\n            (onComplete)=\"_onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            type=\"text\"\n            role=\"combobox\"\n            autocomplete=\"off\"\n            [ariaLabel]=\"'coreMultiComboBox.multiComboBoxAriaLabel' | fdTranslate\"\n            [attr.aria-labelledby]=\"_cva.ariaLabelledBy\"\n            [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n            [attr.aria-owns]=\"autoComplete && !mobile ? _cva.id + '-result' : null\"\n            [attr.aria-haspopup]=\"autoComplete && !mobile\"\n            fd-form-control\n            fd-input-group-input\n            tabindex=\"0\"\n            [id]=\"_cva.id\"\n            [name]=\"_cva.name\"\n            (keydown)=\"_onInputKeydownHandler($event)\"\n            [disabled]=\"_cva.disabled\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"_searchTermChanged()\"\n            [placeholder]=\"_cva.placeholder\"\n            (focus)=\"_cva.onTouched()\"\n            (blur)=\"!mobile && _onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"_cva.readonly\"\n            [attr.aria-readonly]=\"_cva.readonly\"\n            [displayFn]=\"_displayFn\"\n        />\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [byline]=\"byline\"\n        [selection]=\"byline\"\n        (focusEscapeList)=\"_handleListFocusEscape($event)\"\n        class=\"fd-multi-combobox__list fd-list--multi-input\"\n        [id]=\"_cva.id + '-result'\"\n        role=\"listbox\"\n        [style.max-height]=\"!mobile && maxHeight\"\n        [style.min-width.px]=\"!mobile && minWidth\"\n        [style.max-width.px]=\"autoResize && maxWidth\"\n        [attr.aria-labelledby]=\"_cva.id + '-search'\"\n        aria-multiselectable=\"true\"\n        (keydown.tab)=\"close()\"\n        (keydown.shift.tab)=\"close()\"\n    >\n        @if (!!_cva.stateMessage) {\n            <fd-form-message [type]=\"_cva.state\" [innerHtml]=\"_cva.stateMessage\"></fd-form-message>\n        }\n        @if (showSelectAll) {\n            <fd-multi-combobox-select-all-toggler\n                [selectAllHandler]=\"_handleSelectAllItems\"\n                [valueChanges]=\"selectionChange\"\n                [selectedItems]=\"_selectedSuggestions\"\n                [flatItems]=\"_flatSuggestions\"\n            ></fd-multi-combobox-select-all-toggler>\n        }\n        <ng-content></ng-content>\n        @if (isGroup) {\n            @for (group of _suggestions; track group) {\n                @if (!groupItemTemplate) {\n                    <label fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                } @else {\n                    <ng-template\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-template>\n                }\n                @for (optionItem of group.children; track optionItem; let i = $index) {\n                    <li\n                        fd-list-item\n                        role=\"option\"\n                        [tabindex]=\"0\"\n                        (click)=\"!mobile && _onOptionClicked($event, i)\"\n                        (keydown)=\"_onItemKeyDownHandler($event)\"\n                        [selected]=\"!!optionItem.selected\"\n                    >\n                        <fd-checkbox\n                            (click)=\"_onOptionCheckboxClicked($event, i)\"\n                            (ngModelChange)=\"_toggleSelection(optionItem)\"\n                            [ngModel]=\"optionItem.selected\"\n                        >\n                        </fd-checkbox>\n                        <ng-template\n                            [ngTemplateOutlet]=\"listItem\"\n                            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                        ></ng-template>\n                    </li>\n                }\n            }\n        } @else {\n            @for (optionItem of _suggestions; track optionItem; let i = $index) {\n                <li\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && _onOptionClicked($event, i)\"\n                    (keydown)=\"_onItemKeyDownHandler($event)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"_onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"_toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-template\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-template>\n                </li>\n            }\n        }\n    </ul>\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    @if (optionItem.selected && !!selectedItemTemplate) {\n        <ng-template\n            [ngTemplateOutlet]=\"selectedItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    }\n    @if (!(optionItem.selected && selectedItemTemplate)) {\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-template>\n        <ng-template\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-template>\n    }\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    @if (!optionItemTemplate) {\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight: inputText\"\n            fdTruncatedTitle\n        ></span>\n    } @else {\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    }\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    @if (showSecondaryText) {\n        @if (!secondaryItemTemplate) {\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight: inputText\"\n            ></span>\n        } @else {\n            <ng-template\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-template>\n        }\n    }\n</ng-template>\n", styles: [".fd-margin--tiny{margin-block:.5rem;margin-inline:.5rem}.fd-margin--sm{margin-block:1rem;margin-inline:1rem}.fd-margin--md{margin-block:2rem;margin-inline:2rem}.fd-margin--lg{margin-block:3rem;margin-inline:3rem}.fd-margin--none{margin-block:0;margin-inline:0}.fd-margin-top--tiny{-webkit-margin-before:.5rem;margin-block-start:.5rem}.fd-margin-top--sm{-webkit-margin-before:1rem;margin-block-start:1rem}.fd-margin-top--md{-webkit-margin-before:2rem;margin-block-start:2rem}.fd-margin-top--lg{-webkit-margin-before:3rem;margin-block-start:3rem}.fd-margin-top--none{-webkit-margin-before:0;margin-block-start:0}.fd-margin-end--tiny{-webkit-margin-end:.5rem;margin-inline-end:.5rem}.fd-margin-end--sm{-webkit-margin-end:1rem;margin-inline-end:1rem}.fd-margin-end--md{-webkit-margin-end:2rem;margin-inline-end:2rem}.fd-margin-end--lg{-webkit-margin-end:3rem;margin-inline-end:3rem}.fd-margin-end--none{-webkit-margin-end:0;margin-inline-end:0}.fd-margin-bottom--tiny{-webkit-margin-after:.5rem;margin-block-end:.5rem}.fd-margin-bottom--sm{-webkit-margin-after:1rem;margin-block-end:1rem}.fd-margin-bottom--md{-webkit-margin-after:2rem;margin-block-end:2rem}.fd-margin-bottom--lg{-webkit-margin-after:3rem;margin-block-end:3rem}.fd-margin-bottom--none{-webkit-margin-after:0;margin-block-end:0}.fd-margin-begin--tiny{-webkit-margin-start:.5rem;margin-inline-start:.5rem}.fd-margin-begin--sm{-webkit-margin-start:1rem;margin-inline-start:1rem}.fd-margin-begin--md{-webkit-margin-start:2rem;margin-inline-start:2rem}.fd-margin-begin--lg{-webkit-margin-start:3rem;margin-inline-start:3rem}.fd-margin-begin--none{-webkit-margin-start:0;margin-inline-start:0}.fd-margin-top-bottom--tiny{margin-block:.5rem}.fd-margin-top-bottom--sm{margin-block:1rem}.fd-margin-top-bottom--md{margin-block:2rem}.fd-margin-top-bottom--lg{margin-block:3rem}.fd-margin-begin-end--tiny{margin-inline:.5rem}.fd-margin-begin-end--sm{margin-inline:1rem}.fd-margin-begin-end--md{margin-inline:2rem}.fd-margin-begin-end--lg{margin-inline:3rem}.fd-margin-responsive--sm{margin-block:0 1rem;margin-inline:0}.fd-margin-responsive--md{margin-block:1rem;margin-inline:1rem}.fd-margin-responsive--lg{margin-block:1rem;margin-inline:2rem}.fd-margin-responsive--xl{margin-block:1rem;margin-inline:3rem}.fd-margin-negative-begin-end--tiny{margin-block:0;margin-inline:-.5rem}.fd-margin-negative-begin-end--sm{margin-block:0;margin-inline:-1rem}.fd-margin-negative-begin-end--md{margin-block:0;margin-inline:-2rem}.fd-margin-negative-begin-end--lg{margin-block:0;margin-inline:-3rem}.fd-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}[class*=--compact] .fd-multi-combobox-tokenizer-custom:not([class*=--cozy]):not([class*=--condensed]),.is-compact .fd-multi-combobox-tokenizer-custom:not(.is-cozy):not(.is-condensed),.fd-multi-combobox-tokenizer-custom[class*=--compact],.fd-multi-combobox-tokenizer-custom.is-compact{width:calc(100% - 2rem)}.fd-multi-combobox-input-group-custom{display:inline-block}.fd-multi-combobox .fd-popover-custom{display:block}.fd-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fd-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fd-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}.fd-multi-combobox__list-container fd-form-message{max-width:100%;border-radius:0!important}.fd-dialog__body fd-form-message{max-width:100%;border-radius:0!important}\n/*! Bundled license information:\n\nfundamental-styles/dist/margins.css:\n  (*!\n   * Fundamental Library Styles v0.38.0\n   * Copyright (c) 2024 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: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen", "preventSpaceKeyScroll"], outputs: ["isOpenChange"] }, { kind: "component", type: InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "glyphFont", "moreTerm", "open", "showOverflowPopover"], outputs: ["moreClickedEvent"] }, { kind: "component", type: TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdkAutoComplete]", inputs: ["options", "inputText", "enable", "displayFn", "matcher"], outputs: ["onComplete"] }, { kind: "component", type: FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: SelectAllTogglerComponent, selector: "fd-multi-combobox-select-all-toggler", inputs: ["selectAllHandler", "valueChanges", "selectedItems", "flatItems"] }, { kind: "directive", type: ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id", "preventClick"], outputs: ["keyDown"] }, { kind: "component", type: CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "directive", type: ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }, { kind: "pipe", type: SearchHighlightPipe, name: "highlight" }, { kind: "directive", type: MultiAnnouncerDirective, selector: "[fdMultiAnnouncer]", inputs: ["multiAnnouncerOptions"], exportAs: ["fdMultiAnnouncer"] }, { kind: "directive", type: TruncatedTitleDirective, selector: "[fdkTruncatedTitle], [fdTruncatedTitle], [fd-truncate-title]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "customTemplates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true, read: ElementRef }, { propertyName: "listComponent", first: true, predicate: FD_LIST_COMPONENT, descendants: true }, { propertyName: "mobileControlTemplate", first: true, predicate: ["mobileControlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_tokenizer", first: true, predicate: TokenizerComponent, descendants: true }, { propertyName: "_inputGroup", first: true, predicate: ["inputGroup"], descendants: true, read: ElementRef }], usesInheritance: true, hostDirectives: [{ directive: i2.CvaDirective, inputs: ["id", "inputId", "placeholder", "placeholder", "state", "state", "stateMessage", "stateMessage", "disabled", "disabled", "readonly", "readonly", "name", "name"] }, { directive: i3.DataSourceDirective, inputs: ["dataSource", "dataSource"], outputs: ["dataChanged", "dataChanged"] }], ngImport: i0, template: "<div class=\"fd-multi-combobox\">\n    @if (mobile) {\n        <ng-template [ngTemplateOutlet]=\"controlTemplate\"></ng-template>\n    } @else {\n        <fd-popover\n            additionalBodyClass=\"fd-popover-custom-list fd-multi-combobox__list-container\"\n            (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n            [isOpen]=\"isOpen\"\n            [triggers]=\"[]\"\n            [disabled]=\"_cva.disabled\"\n            [maxWidth]=\"_popoverMaxWidth\"\n            [fillControlMode]=\"fillControlMode\"\n        >\n            <fd-popover-control>\n                <ng-template [ngTemplateOutlet]=\"controlTemplate\"></ng-template>\n            </fd-popover-control>\n            <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n                <ng-template [ngTemplateOutlet]=\"listTemplate\"></ng-template>\n                <ng-content></ng-content>\n            </fd-popover-body>\n        </fd-popover>\n    }\n</div>\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            #inputGroup\n            [id]=\"_cva.id + '-input-group-container'\"\n            [state]=\"_cva.state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!_cva.readonly\"\n            [glyph]=\"!_cva.readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"_cva.disabled || _cva.readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"_cva.disabled || _cva.readonly\"\n            [attr.aria-readonly]=\"_cva.readonly\"\n            [glyphAriaLabel]=\"_cva.ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && _onPrimaryButtonClick(false)\"\n            (keydown)=\"_navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                [tokenizerFocusable]=\"false\"\n                [compactCollapse]=\"true\"\n                [showOverflowPopover]=\"false\"\n                #tokenizer\n                class=\"fd-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"_moreClicked()\"\n                fdMultiAnnouncer\n                [multiAnnouncerOptions]=\"_suggestions\"\n            >\n                @for (token of _selectedSuggestions; track token) {\n                    <fd-token [readOnly]=\"_cva.disabled\" (onCloseClick)=\"_removeToken(token, $event)\">\n                        {{ token.label }}\n                    </fd-token>\n                }\n                <input\n                    #searchInputElement\n                    fdkAutoComplete\n                    (onComplete)=\"_onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    autocomplete=\"off\"\n                    [ariaLabel]=\"'coreMultiComboBox.multiComboBoxAriaLabel' | fdTranslate\"\n                    [attr.aria-labelledby]=\"_cva.ariaLabelledBy\"\n                    [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                    [attr.aria-owns]=\"autoComplete && !mobile ? _cva.id + '-result' : null\"\n                    [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                    fd-form-control\n                    fd-input-group-input\n                    tabindex=\"0\"\n                    [id]=\"_cva.id\"\n                    [name]=\"_cva.name\"\n                    (keydown)=\"_onInputKeydownHandler($event)\"\n                    [disabled]=\"_cva.disabled\"\n                    [(ngModel)]=\"inputText\"\n                    (ngModelChange)=\"_searchTermChanged()\"\n                    [attr.placeholder]=\"_selectedSuggestions.length ? null : _cva.placeholder\"\n                    (focus)=\"tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && _onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"_cva.readonly\"\n                    [attr.aria-readonly]=\"_cva.readonly\"\n                    [attr.aria-required]=\"_cva.required\"\n                    [displayFn]=\"_displayFn\"\n                    class=\"fd-tokenizer__input fd-input-group__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n        @if (mobile && isOpen ? false : !!_cva.stateMessage) {\n            <fd-form-message [type]=\"_cva.state\" [innerHtml]=\"_cva.stateMessage\"></fd-form-message>\n        }\n    </fd-form-input-message-group>\n</ng-template>\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"_cva.id + '-input-group-container'\"\n        class=\"fd-multi-combobox-input-group-custom\"\n        [state]=\"_cva.state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"_cva.disabled || _cva.readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"_cva.disabled || _cva.readonly\"\n        [attr.aria-readonly]=\"_cva.readonly\"\n        [glyphAriaLabel]=\"_cva.ariaLabel\"\n    >\n        <input\n            fdkAutoComplete\n            (onComplete)=\"_onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            type=\"text\"\n            role=\"combobox\"\n            autocomplete=\"off\"\n            [ariaLabel]=\"'coreMultiComboBox.multiComboBoxAriaLabel' | fdTranslate\"\n            [attr.aria-labelledby]=\"_cva.ariaLabelledBy\"\n            [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n            [attr.aria-owns]=\"autoComplete && !mobile ? _cva.id + '-result' : null\"\n            [attr.aria-haspopup]=\"autoComplete && !mobile\"\n            fd-form-control\n            fd-input-group-input\n            tabindex=\"0\"\n            [id]=\"_cva.id\"\n            [name]=\"_cva.name\"\n            (keydown)=\"_onInputKeydownHandler($event)\"\n            [disabled]=\"_cva.disabled\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"_searchTermChanged()\"\n            [placeholder]=\"_cva.placeholder\"\n            (focus)=\"_cva.onTouched()\"\n            (blur)=\"!mobile && _onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"_cva.readonly\"\n            [attr.aria-readonly]=\"_cva.readonly\"\n            [displayFn]=\"_displayFn\"\n        />\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [byline]=\"byline\"\n        [selection]=\"byline\"\n        (focusEscapeList)=\"_handleListFocusEscape($event)\"\n        class=\"fd-multi-combobox__list fd-list--multi-input\"\n        [id]=\"_cva.id + '-result'\"\n        role=\"listbox\"\n        [style.max-height]=\"!mobile && maxHeight\"\n        [style.min-width.px]=\"!mobile && minWidth\"\n        [style.max-width.px]=\"autoResize && maxWidth\"\n        [attr.aria-labelledby]=\"_cva.id + '-search'\"\n        aria-multiselectable=\"true\"\n        (keydown.tab)=\"close()\"\n        (keydown.shift.tab)=\"close()\"\n    >\n        @if (!!_cva.stateMessage) {\n            <fd-form-message [type]=\"_cva.state\" [innerHtml]=\"_cva.stateMessage\"></fd-form-message>\n        }\n        @if (showSelectAll) {\n            <fd-multi-combobox-select-all-toggler\n                [selectAllHandler]=\"_handleSelectAllItems\"\n                [valueChanges]=\"selectionChange\"\n                [selectedItems]=\"_selectedSuggestions\"\n                [flatItems]=\"_flatSuggestions\"\n            ></fd-multi-combobox-select-all-toggler>\n        }\n        <ng-content></ng-content>\n        @if (isGroup) {\n            @for (group of _suggestions; track group) {\n                @if (!groupItemTemplate) {\n                    <label fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                } @else {\n                    <ng-template\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-template>\n                }\n                @for (optionItem of group.children; track optionItem; let i = $index) {\n                    <li\n                        fd-list-item\n                        role=\"option\"\n                        [tabindex]=\"0\"\n                        (click)=\"!mobile && _onOptionClicked($event, i)\"\n                        (keydown)=\"_onItemKeyDownHandler($event)\"\n                        [selected]=\"!!optionItem.selected\"\n                    >\n                        <fd-checkbox\n                            (click)=\"_onOptionCheckboxClicked($event, i)\"\n                            (ngModelChange)=\"_toggleSelection(optionItem)\"\n                            [ngModel]=\"optionItem.selected\"\n                        >\n                        </fd-checkbox>\n                        <ng-template\n                            [ngTemplateOutlet]=\"listItem\"\n                            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                        ></ng-template>\n                    </li>\n                }\n            }\n        } @else {\n            @for (optionItem of _suggestions; track optionItem; let i = $index) {\n                <li\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && _onOptionClicked($event, i)\"\n                    (keydown)=\"_onItemKeyDownHandler($event)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"_onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"_toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-template\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-template>\n                </li>\n            }\n        }\n    </ul>\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    @if (optionItem.selected && !!selectedItemTemplate) {\n        <ng-template\n            [ngTemplateOutlet]=\"selectedItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    }\n    @if (!(optionItem.selected && selectedItemTemplate)) {\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-template>\n        <ng-template\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-template>\n    }\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    @if (!optionItemTemplate) {\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight: inputText\"\n            fdTruncatedTitle\n        ></span>\n    } @else {\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    }\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    @if (showSecondaryText) {\n        @if (!secondaryItemTemplate) {\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight: inputText\"\n            ></span>\n        } @else {\n            <ng-template\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-template>\n        }\n    }\n</ng-template>\n", styles: [".fd-margin--tiny{margin-block:.5rem;margin-inline:.5rem}.fd-margin--sm{margin-block:1rem;margin-inline:1rem}.fd-margin--md{margin-block:2rem;margin-inline:2rem}.fd-margin--lg{margin-block:3rem;margin-inline:3rem}.fd-margin--none{margin-block:0;margin-inline:0}.fd-margin-top--tiny{-webkit-margin-before:.5rem;margin-block-start:.5rem}.fd-margin-top--sm{-webkit-margin-before:1rem;margin-block-start:1rem}.fd-margin-top--md{-webkit-margin-before:2rem;margin-block-start:2rem}.fd-margin-top--lg{-webkit-margin-before:3rem;margin-block-start:3rem}.fd-margin-top--none{-webkit-margin-before:0;margin-block-start:0}.fd-margin-end--tiny{-webkit-margin-end:.5rem;margin-inline-end:.5rem}.fd-margin-end--sm{-webkit-margin-end:1rem;margin-inline-end:1rem}.fd-margin-end--md{-webkit-margin-end:2rem;margin-inline-end:2rem}.fd-margin-end--lg{-webkit-margin-end:3rem;margin-inline-end:3rem}.fd-margin-end--none{-webkit-margin-end:0;margin-inline-end:0}.fd-margin-bottom--tiny{-webkit-margin-after:.5rem;margin-block-end:.5rem}.fd-margin-bottom--sm{-webkit-margin-after:1rem;margin-block-end:1rem}.fd-margin-bottom--md{-webkit-margin-after:2rem;margin-block-end:2rem}.fd-margin-bottom--lg{-webkit-margin-after:3rem;margin-block-end:3rem}.fd-margin-bottom--none{-webkit-margin-after:0;margin-block-end:0}.fd-margin-begin--tiny{-webkit-margin-start:.5rem;margin-inline-start:.5rem}.fd-margin-begin--sm{-webkit-margin-start:1rem;margin-inline-start:1rem}.fd-margin-begin--md{-webkit-margin-start:2rem;margin-inline-start:2rem}.fd-margin-begin--lg{-webkit-margin-start:3rem;margin-inline-start:3rem}.fd-margin-begin--none{-webkit-margin-start:0;margin-inline-start:0}.fd-margin-top-bottom--tiny{margin-block:.5rem}.fd-margin-top-bottom--sm{margin-block:1rem}.fd-margin-top-bottom--md{margin-block:2rem}.fd-margin-top-bottom--lg{margin-block:3rem}.fd-margin-begin-end--tiny{margin-inline:.5rem}.fd-margin-begin-end--sm{margin-inline:1rem}.fd-margin-begin-end--md{margin-inline:2rem}.fd-margin-begin-end--lg{margin-inline:3rem}.fd-margin-responsive--sm{margin-block:0 1rem;margin-inline:0}.fd-margin-responsive--md{margin-block:1rem;margin-inline:1rem}.fd-margin-responsive--lg{margin-block:1rem;margin-inline:2rem}.fd-margin-responsive--xl{margin-block:1rem;margin-inline:3rem}.fd-margin-negative-begin-end--tiny{margin-block:0;margin-inline:-.5rem}.fd-margin-negative-begin-end--sm{margin-block:0;margin-inline:-1rem}.fd-margin-negative-begin-end--md{margin-block:0;margin-inline:-2rem}.fd-margin-negative-begin-end--lg{margin-block:0;margin-inline:-3rem}.fd-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}[class*=--compact] .fd-multi-combobox-tokenizer-custom:not([class*=--cozy]):not([class*=--condensed]),.is-compact .fd-multi-combobox-tokenizer-custom:not(.is-cozy):not(.is-condensed),.fd-multi-combobox-tokenizer-custom[class*=--compact],.fd-multi-combobox-tokenizer-custom.is-compact{width:calc(100% - 2rem)}.fd-multi-combobox-input-group-custom{display:inline-block}.fd-multi-combobox .fd-popover-custom{display:block}.fd-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fd-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fd-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}.fd-multi-combobox__list-container fd-form-message{max-width:100%;border-radius:0!important}.fd-dialog__body fd-form-message{max-width:100%;border-radius:0!important}\n/*! Bundled license information:\n\nfundamental-styles/dist/margins.css:\n  (*!\n   * Fundamental Library Styles v0.39.2\n   * Copyright (c) 2025 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: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen", "preventSpaceKeyScroll"], outputs: ["isOpenChange"] }, { kind: "component", type: InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "glyphFont", "moreTerm", "open", "showOverflowPopover"], outputs: ["moreClickedEvent"] }, { kind: "component", type: TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdkAutoComplete]", inputs: ["options", "inputText", "enable", "displayFn", "matcher"], outputs: ["onComplete"] }, { kind: "component", type: FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: SelectAllTogglerComponent, selector: "fd-multi-combobox-select-all-toggler", inputs: ["selectAllHandler", "valueChanges", "selectedItems", "flatItems"] }, { kind: "directive", type: ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"] }, { kind: "component", type: CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "directive", type: ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }, { kind: "pipe", type: SearchHighlightPipe, name: "highlight" }, { kind: "directive", type: MultiAnnouncerDirective, selector: "[fdMultiAnnouncer]", inputs: ["multiAnnouncerOptions"], exportAs: ["fdMultiAnnouncer"] }, { kind: "directive", type: TruncatedTitleDirective, selector: "[fdkTruncatedTitle], [fdTruncatedTitle], [fd-truncate-title]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: MultiComboboxComponent, decorators: [{
             type: Component,
@@ -1439,7 +1439,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         SearchHighlightPipe,
                         MultiAnnouncerDirective,
                         TruncatedTitleDirective
-                    ], template: "<div class=\"fd-multi-combobox\">\n    @if (mobile) {\n        <ng-template [ngTemplateOutlet]=\"controlTemplate\"></ng-template>\n    } @else {\n        <fd-popover\n            additionalBodyClass=\"fd-popover-custom-list fd-multi-combobox__list-container\"\n            (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n            [isOpen]=\"isOpen\"\n            [triggers]=\"[]\"\n            [disabled]=\"_cva.disabled\"\n            [maxWidth]=\"_popoverMaxWidth\"\n            [fillControlMode]=\"fillControlMode\"\n        >\n            <fd-popover-control>\n                <ng-template [ngTemplateOutlet]=\"controlTemplate\"></ng-template>\n            </fd-popover-control>\n            <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n                <ng-template [ngTemplateOutlet]=\"listTemplate\"></ng-template>\n                <ng-content></ng-content>\n            </fd-popover-body>\n        </fd-popover>\n    }\n</div>\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            #inputGroup\n            [id]=\"_cva.id + '-input-group-container'\"\n            [state]=\"_cva.state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!_cva.readonly\"\n            [glyph]=\"!_cva.readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"_cva.disabled || _cva.readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"_cva.disabled || _cva.readonly\"\n            [attr.aria-readonly]=\"_cva.readonly\"\n            [glyphAriaLabel]=\"_cva.ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && _onPrimaryButtonClick(false)\"\n            (keydown)=\"_navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                [tokenizerFocusable]=\"false\"\n                [compactCollapse]=\"true\"\n                [showOverflowPopover]=\"false\"\n                #tokenizer\n                class=\"fd-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"_moreClicked()\"\n                fdMultiAnnouncer\n                [multiAnnouncerOptions]=\"_suggestions\"\n            >\n                @for (token of _selectedSuggestions; track token) {\n                    <fd-token [readOnly]=\"_cva.disabled\" (onCloseClick)=\"_removeToken(token, $event)\">\n                        {{ token.label }}\n                    </fd-token>\n                }\n                <input\n                    #searchInputElement\n                    fdkAutoComplete\n                    (onComplete)=\"_onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    autocomplete=\"off\"\n                    [ariaLabel]=\"'coreMultiComboBox.multiComboBoxAriaLabel' | fdTranslate\"\n                    [attr.aria-labelledby]=\"_cva.ariaLabelledBy\"\n                    [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                    [attr.aria-owns]=\"autoComplete && !mobile ? _cva.id + '-result' : null\"\n                    [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                    fd-form-control\n                    fd-input-group-input\n                    tabindex=\"0\"\n                    [id]=\"_cva.id\"\n                    [name]=\"_cva.name\"\n                    (keydown)=\"_onInputKeydownHandler($event)\"\n                    [disabled]=\"_cva.disabled\"\n                    [(ngModel)]=\"inputText\"\n                    (ngModelChange)=\"_searchTermChanged()\"\n                    [attr.placeholder]=\"_selectedSuggestions.length ? null : _cva.placeholder\"\n                    (focus)=\"tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && _onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"_cva.readonly\"\n                    [attr.aria-readonly]=\"_cva.readonly\"\n                    [attr.aria-required]=\"_cva.required\"\n                    [displayFn]=\"_displayFn\"\n                    class=\"fd-tokenizer__input fd-input-group__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n        @if (mobile && isOpen ? false : !!_cva.stateMessage) {\n            <fd-form-message [type]=\"_cva.state\" [innerHtml]=\"_cva.stateMessage\"></fd-form-message>\n        }\n    </fd-form-input-message-group>\n</ng-template>\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"_cva.id + '-input-group-container'\"\n        class=\"fd-multi-combobox-input-group-custom\"\n        [state]=\"_cva.state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"_cva.disabled || _cva.readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"_cva.disabled || _cva.readonly\"\n        [attr.aria-readonly]=\"_cva.readonly\"\n        [glyphAriaLabel]=\"_cva.ariaLabel\"\n    >\n        <input\n            fdkAutoComplete\n            (onComplete)=\"_onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            type=\"text\"\n            role=\"combobox\"\n            autocomplete=\"off\"\n            [ariaLabel]=\"'coreMultiComboBox.multiComboBoxAriaLabel' | fdTranslate\"\n            [attr.aria-labelledby]=\"_cva.ariaLabelledBy\"\n            [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n            [attr.aria-owns]=\"autoComplete && !mobile ? _cva.id + '-result' : null\"\n            [attr.aria-haspopup]=\"autoComplete && !mobile\"\n            fd-form-control\n            fd-input-group-input\n            tabindex=\"0\"\n            [id]=\"_cva.id\"\n            [name]=\"_cva.name\"\n            (keydown)=\"_onInputKeydownHandler($event)\"\n            [disabled]=\"_cva.disabled\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"_searchTermChanged()\"\n            [placeholder]=\"_cva.placeholder\"\n            (focus)=\"_cva.onTouched()\"\n            (blur)=\"!mobile && _onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"_cva.readonly\"\n            [attr.aria-readonly]=\"_cva.readonly\"\n            [displayFn]=\"_displayFn\"\n        />\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [byline]=\"byline\"\n        [selection]=\"byline\"\n        (focusEscapeList)=\"_handleListFocusEscape($event)\"\n        class=\"fd-multi-combobox__list fd-list--multi-input\"\n        [id]=\"_cva.id + '-result'\"\n        role=\"listbox\"\n        [style.max-height]=\"!mobile && maxHeight\"\n        [style.min-width.px]=\"!mobile && minWidth\"\n        [style.max-width.px]=\"autoResize && maxWidth\"\n        [attr.aria-labelledby]=\"_cva.id + '-search'\"\n        aria-multiselectable=\"true\"\n        (keydown.tab)=\"close()\"\n        (keydown.shift.tab)=\"close()\"\n    >\n        @if (!!_cva.stateMessage) {\n            <fd-form-message [type]=\"_cva.state\" [innerHtml]=\"_cva.stateMessage\"></fd-form-message>\n        }\n        @if (showSelectAll) {\n            <fd-multi-combobox-select-all-toggler\n                [selectAllHandler]=\"_handleSelectAllItems\"\n                [valueChanges]=\"selectionChange\"\n                [selectedItems]=\"_selectedSuggestions\"\n                [flatItems]=\"_flatSuggestions\"\n            ></fd-multi-combobox-select-all-toggler>\n        }\n        <ng-content></ng-content>\n        @if (isGroup) {\n            @for (group of _suggestions; track group) {\n                @if (!groupItemTemplate) {\n                    <label fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                } @else {\n                    <ng-template\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-template>\n                }\n                @for (optionItem of group.children; track optionItem; let i = $index) {\n                    <li\n                        fd-list-item\n                        role=\"option\"\n                        [tabindex]=\"0\"\n                        (click)=\"!mobile && _onOptionClicked($event, i)\"\n                        (keydown)=\"_onItemKeyDownHandler($event)\"\n                        [selected]=\"!!optionItem.selected\"\n                    >\n                        <fd-checkbox\n                            (click)=\"_onOptionCheckboxClicked($event, i)\"\n                            (ngModelChange)=\"_toggleSelection(optionItem)\"\n                            [ngModel]=\"optionItem.selected\"\n                        >\n                        </fd-checkbox>\n                        <ng-template\n                            [ngTemplateOutlet]=\"listItem\"\n                            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                        ></ng-template>\n                    </li>\n                }\n            }\n        } @else {\n            @for (optionItem of _suggestions; track optionItem; let i = $index) {\n                <li\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && _onOptionClicked($event, i)\"\n                    (keydown)=\"_onItemKeyDownHandler($event)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"_onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"_toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-template\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-template>\n                </li>\n            }\n        }\n    </ul>\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    @if (optionItem.selected && !!selectedItemTemplate) {\n        <ng-template\n            [ngTemplateOutlet]=\"selectedItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    }\n    @if (!(optionItem.selected && selectedItemTemplate)) {\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-template>\n        <ng-template\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-template>\n    }\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    @if (!optionItemTemplate) {\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight: inputText\"\n            fdTruncatedTitle\n        ></span>\n    } @else {\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    }\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    @if (showSecondaryText) {\n        @if (!secondaryItemTemplate) {\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight: inputText\"\n            ></span>\n        } @else {\n            <ng-template\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-template>\n        }\n    }\n</ng-template>\n", styles: [".fd-margin--tiny{margin-block:.5rem;margin-inline:.5rem}.fd-margin--sm{margin-block:1rem;margin-inline:1rem}.fd-margin--md{margin-block:2rem;margin-inline:2rem}.fd-margin--lg{margin-block:3rem;margin-inline:3rem}.fd-margin--none{margin-block:0;margin-inline:0}.fd-margin-top--tiny{-webkit-margin-before:.5rem;margin-block-start:.5rem}.fd-margin-top--sm{-webkit-margin-before:1rem;margin-block-start:1rem}.fd-margin-top--md{-webkit-margin-before:2rem;margin-block-start:2rem}.fd-margin-top--lg{-webkit-margin-before:3rem;margin-block-start:3rem}.fd-margin-top--none{-webkit-margin-before:0;margin-block-start:0}.fd-margin-end--tiny{-webkit-margin-end:.5rem;margin-inline-end:.5rem}.fd-margin-end--sm{-webkit-margin-end:1rem;margin-inline-end:1rem}.fd-margin-end--md{-webkit-margin-end:2rem;margin-inline-end:2rem}.fd-margin-end--lg{-webkit-margin-end:3rem;margin-inline-end:3rem}.fd-margin-end--none{-webkit-margin-end:0;margin-inline-end:0}.fd-margin-bottom--tiny{-webkit-margin-after:.5rem;margin-block-end:.5rem}.fd-margin-bottom--sm{-webkit-margin-after:1rem;margin-block-end:1rem}.fd-margin-bottom--md{-webkit-margin-after:2rem;margin-block-end:2rem}.fd-margin-bottom--lg{-webkit-margin-after:3rem;margin-block-end:3rem}.fd-margin-bottom--none{-webkit-margin-after:0;margin-block-end:0}.fd-margin-begin--tiny{-webkit-margin-start:.5rem;margin-inline-start:.5rem}.fd-margin-begin--sm{-webkit-margin-start:1rem;margin-inline-start:1rem}.fd-margin-begin--md{-webkit-margin-start:2rem;margin-inline-start:2rem}.fd-margin-begin--lg{-webkit-margin-start:3rem;margin-inline-start:3rem}.fd-margin-begin--none{-webkit-margin-start:0;margin-inline-start:0}.fd-margin-top-bottom--tiny{margin-block:.5rem}.fd-margin-top-bottom--sm{margin-block:1rem}.fd-margin-top-bottom--md{margin-block:2rem}.fd-margin-top-bottom--lg{margin-block:3rem}.fd-margin-begin-end--tiny{margin-inline:.5rem}.fd-margin-begin-end--sm{margin-inline:1rem}.fd-margin-begin-end--md{margin-inline:2rem}.fd-margin-begin-end--lg{margin-inline:3rem}.fd-margin-responsive--sm{margin-block:0 1rem;margin-inline:0}.fd-margin-responsive--md{margin-block:1rem;margin-inline:1rem}.fd-margin-responsive--lg{margin-block:1rem;margin-inline:2rem}.fd-margin-responsive--xl{margin-block:1rem;margin-inline:3rem}.fd-margin-negative-begin-end--tiny{margin-block:0;margin-inline:-.5rem}.fd-margin-negative-begin-end--sm{margin-block:0;margin-inline:-1rem}.fd-margin-negative-begin-end--md{margin-block:0;margin-inline:-2rem}.fd-margin-negative-begin-end--lg{margin-block:0;margin-inline:-3rem}.fd-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}[class*=--compact] .fd-multi-combobox-tokenizer-custom:not([class*=--cozy]):not([class*=--condensed]),.is-compact .fd-multi-combobox-tokenizer-custom:not(.is-cozy):not(.is-condensed),.fd-multi-combobox-tokenizer-custom[class*=--compact],.fd-multi-combobox-tokenizer-custom.is-compact{width:calc(100% - 2rem)}.fd-multi-combobox-input-group-custom{display:inline-block}.fd-multi-combobox .fd-popover-custom{display:block}.fd-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fd-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fd-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}.fd-multi-combobox__list-container fd-form-message{max-width:100%;border-radius:0!important}.fd-dialog__body fd-form-message{max-width:100%;border-radius:0!important}\n/*! Bundled license information:\n\nfundamental-styles/dist/margins.css:\n  (*!\n   * Fundamental Library Styles v0.38.0\n   * Copyright (c) 2024 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-multi-combobox\">\n    @if (mobile) {\n        <ng-template [ngTemplateOutlet]=\"controlTemplate\"></ng-template>\n    } @else {\n        <fd-popover\n            additionalBodyClass=\"fd-popover-custom-list fd-multi-combobox__list-container\"\n            (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n            [isOpen]=\"isOpen\"\n            [triggers]=\"[]\"\n            [disabled]=\"_cva.disabled\"\n            [maxWidth]=\"_popoverMaxWidth\"\n            [fillControlMode]=\"fillControlMode\"\n        >\n            <fd-popover-control>\n                <ng-template [ngTemplateOutlet]=\"controlTemplate\"></ng-template>\n            </fd-popover-control>\n            <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n                <ng-template [ngTemplateOutlet]=\"listTemplate\"></ng-template>\n                <ng-content></ng-content>\n            </fd-popover-body>\n        </fd-popover>\n    }\n</div>\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            #inputGroup\n            [id]=\"_cva.id + '-input-group-container'\"\n            [state]=\"_cva.state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!_cva.readonly\"\n            [glyph]=\"!_cva.readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"_cva.disabled || _cva.readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"_cva.disabled || _cva.readonly\"\n            [attr.aria-readonly]=\"_cva.readonly\"\n            [glyphAriaLabel]=\"_cva.ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && _onPrimaryButtonClick(false)\"\n            (keydown)=\"_navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                [tokenizerFocusable]=\"false\"\n                [compactCollapse]=\"true\"\n                [showOverflowPopover]=\"false\"\n                #tokenizer\n                class=\"fd-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"_moreClicked()\"\n                fdMultiAnnouncer\n                [multiAnnouncerOptions]=\"_suggestions\"\n            >\n                @for (token of _selectedSuggestions; track token) {\n                    <fd-token [readOnly]=\"_cva.disabled\" (onCloseClick)=\"_removeToken(token, $event)\">\n                        {{ token.label }}\n                    </fd-token>\n                }\n                <input\n                    #searchInputElement\n                    fdkAutoComplete\n                    (onComplete)=\"_onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    autocomplete=\"off\"\n                    [ariaLabel]=\"'coreMultiComboBox.multiComboBoxAriaLabel' | fdTranslate\"\n                    [attr.aria-labelledby]=\"_cva.ariaLabelledBy\"\n                    [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                    [attr.aria-owns]=\"autoComplete && !mobile ? _cva.id + '-result' : null\"\n                    [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                    fd-form-control\n                    fd-input-group-input\n                    tabindex=\"0\"\n                    [id]=\"_cva.id\"\n                    [name]=\"_cva.name\"\n                    (keydown)=\"_onInputKeydownHandler($event)\"\n                    [disabled]=\"_cva.disabled\"\n                    [(ngModel)]=\"inputText\"\n                    (ngModelChange)=\"_searchTermChanged()\"\n                    [attr.placeholder]=\"_selectedSuggestions.length ? null : _cva.placeholder\"\n                    (focus)=\"tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && _onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"_cva.readonly\"\n                    [attr.aria-readonly]=\"_cva.readonly\"\n                    [attr.aria-required]=\"_cva.required\"\n                    [displayFn]=\"_displayFn\"\n                    class=\"fd-tokenizer__input fd-input-group__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n        @if (mobile && isOpen ? false : !!_cva.stateMessage) {\n            <fd-form-message [type]=\"_cva.state\" [innerHtml]=\"_cva.stateMessage\"></fd-form-message>\n        }\n    </fd-form-input-message-group>\n</ng-template>\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"_cva.id + '-input-group-container'\"\n        class=\"fd-multi-combobox-input-group-custom\"\n        [state]=\"_cva.state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"_cva.disabled || _cva.readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"_cva.disabled || _cva.readonly\"\n        [attr.aria-readonly]=\"_cva.readonly\"\n        [glyphAriaLabel]=\"_cva.ariaLabel\"\n    >\n        <input\n            fdkAutoComplete\n            (onComplete)=\"_onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            type=\"text\"\n            role=\"combobox\"\n            autocomplete=\"off\"\n            [ariaLabel]=\"'coreMultiComboBox.multiComboBoxAriaLabel' | fdTranslate\"\n            [attr.aria-labelledby]=\"_cva.ariaLabelledBy\"\n            [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n            [attr.aria-owns]=\"autoComplete && !mobile ? _cva.id + '-result' : null\"\n            [attr.aria-haspopup]=\"autoComplete && !mobile\"\n            fd-form-control\n            fd-input-group-input\n            tabindex=\"0\"\n            [id]=\"_cva.id\"\n            [name]=\"_cva.name\"\n            (keydown)=\"_onInputKeydownHandler($event)\"\n            [disabled]=\"_cva.disabled\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"_searchTermChanged()\"\n            [placeholder]=\"_cva.placeholder\"\n            (focus)=\"_cva.onTouched()\"\n            (blur)=\"!mobile && _onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"_cva.readonly\"\n            [attr.aria-readonly]=\"_cva.readonly\"\n            [displayFn]=\"_displayFn\"\n        />\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [byline]=\"byline\"\n        [selection]=\"byline\"\n        (focusEscapeList)=\"_handleListFocusEscape($event)\"\n        class=\"fd-multi-combobox__list fd-list--multi-input\"\n        [id]=\"_cva.id + '-result'\"\n        role=\"listbox\"\n        [style.max-height]=\"!mobile && maxHeight\"\n        [style.min-width.px]=\"!mobile && minWidth\"\n        [style.max-width.px]=\"autoResize && maxWidth\"\n        [attr.aria-labelledby]=\"_cva.id + '-search'\"\n        aria-multiselectable=\"true\"\n        (keydown.tab)=\"close()\"\n        (keydown.shift.tab)=\"close()\"\n    >\n        @if (!!_cva.stateMessage) {\n            <fd-form-message [type]=\"_cva.state\" [innerHtml]=\"_cva.stateMessage\"></fd-form-message>\n        }\n        @if (showSelectAll) {\n            <fd-multi-combobox-select-all-toggler\n                [selectAllHandler]=\"_handleSelectAllItems\"\n                [valueChanges]=\"selectionChange\"\n                [selectedItems]=\"_selectedSuggestions\"\n                [flatItems]=\"_flatSuggestions\"\n            ></fd-multi-combobox-select-all-toggler>\n        }\n        <ng-content></ng-content>\n        @if (isGroup) {\n            @for (group of _suggestions; track group) {\n                @if (!groupItemTemplate) {\n                    <label fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                } @else {\n                    <ng-template\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-template>\n                }\n                @for (optionItem of group.children; track optionItem; let i = $index) {\n                    <li\n                        fd-list-item\n                        role=\"option\"\n                        [tabindex]=\"0\"\n                        (click)=\"!mobile && _onOptionClicked($event, i)\"\n                        (keydown)=\"_onItemKeyDownHandler($event)\"\n                        [selected]=\"!!optionItem.selected\"\n                    >\n                        <fd-checkbox\n                            (click)=\"_onOptionCheckboxClicked($event, i)\"\n                            (ngModelChange)=\"_toggleSelection(optionItem)\"\n                            [ngModel]=\"optionItem.selected\"\n                        >\n                        </fd-checkbox>\n                        <ng-template\n                            [ngTemplateOutlet]=\"listItem\"\n                            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                        ></ng-template>\n                    </li>\n                }\n            }\n        } @else {\n            @for (optionItem of _suggestions; track optionItem; let i = $index) {\n                <li\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && _onOptionClicked($event, i)\"\n                    (keydown)=\"_onItemKeyDownHandler($event)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"_onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"_toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-template\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-template>\n                </li>\n            }\n        }\n    </ul>\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    @if (optionItem.selected && !!selectedItemTemplate) {\n        <ng-template\n            [ngTemplateOutlet]=\"selectedItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    }\n    @if (!(optionItem.selected && selectedItemTemplate)) {\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-template>\n        <ng-template\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-template>\n    }\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    @if (!optionItemTemplate) {\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight: inputText\"\n            fdTruncatedTitle\n        ></span>\n    } @else {\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    }\n</ng-template>\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    @if (showSecondaryText) {\n        @if (!secondaryItemTemplate) {\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight: inputText\"\n            ></span>\n        } @else {\n            <ng-template\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-template>\n        }\n    }\n</ng-template>\n", styles: [".fd-margin--tiny{margin-block:.5rem;margin-inline:.5rem}.fd-margin--sm{margin-block:1rem;margin-inline:1rem}.fd-margin--md{margin-block:2rem;margin-inline:2rem}.fd-margin--lg{margin-block:3rem;margin-inline:3rem}.fd-margin--none{margin-block:0;margin-inline:0}.fd-margin-top--tiny{-webkit-margin-before:.5rem;margin-block-start:.5rem}.fd-margin-top--sm{-webkit-margin-before:1rem;margin-block-start:1rem}.fd-margin-top--md{-webkit-margin-before:2rem;margin-block-start:2rem}.fd-margin-top--lg{-webkit-margin-before:3rem;margin-block-start:3rem}.fd-margin-top--none{-webkit-margin-before:0;margin-block-start:0}.fd-margin-end--tiny{-webkit-margin-end:.5rem;margin-inline-end:.5rem}.fd-margin-end--sm{-webkit-margin-end:1rem;margin-inline-end:1rem}.fd-margin-end--md{-webkit-margin-end:2rem;margin-inline-end:2rem}.fd-margin-end--lg{-webkit-margin-end:3rem;margin-inline-end:3rem}.fd-margin-end--none{-webkit-margin-end:0;margin-inline-end:0}.fd-margin-bottom--tiny{-webkit-margin-after:.5rem;margin-block-end:.5rem}.fd-margin-bottom--sm{-webkit-margin-after:1rem;margin-block-end:1rem}.fd-margin-bottom--md{-webkit-margin-after:2rem;margin-block-end:2rem}.fd-margin-bottom--lg{-webkit-margin-after:3rem;margin-block-end:3rem}.fd-margin-bottom--none{-webkit-margin-after:0;margin-block-end:0}.fd-margin-begin--tiny{-webkit-margin-start:.5rem;margin-inline-start:.5rem}.fd-margin-begin--sm{-webkit-margin-start:1rem;margin-inline-start:1rem}.fd-margin-begin--md{-webkit-margin-start:2rem;margin-inline-start:2rem}.fd-margin-begin--lg{-webkit-margin-start:3rem;margin-inline-start:3rem}.fd-margin-begin--none{-webkit-margin-start:0;margin-inline-start:0}.fd-margin-top-bottom--tiny{margin-block:.5rem}.fd-margin-top-bottom--sm{margin-block:1rem}.fd-margin-top-bottom--md{margin-block:2rem}.fd-margin-top-bottom--lg{margin-block:3rem}.fd-margin-begin-end--tiny{margin-inline:.5rem}.fd-margin-begin-end--sm{margin-inline:1rem}.fd-margin-begin-end--md{margin-inline:2rem}.fd-margin-begin-end--lg{margin-inline:3rem}.fd-margin-responsive--sm{margin-block:0 1rem;margin-inline:0}.fd-margin-responsive--md{margin-block:1rem;margin-inline:1rem}.fd-margin-responsive--lg{margin-block:1rem;margin-inline:2rem}.fd-margin-responsive--xl{margin-block:1rem;margin-inline:3rem}.fd-margin-negative-begin-end--tiny{margin-block:0;margin-inline:-.5rem}.fd-margin-negative-begin-end--sm{margin-block:0;margin-inline:-1rem}.fd-margin-negative-begin-end--md{margin-block:0;margin-inline:-2rem}.fd-margin-negative-begin-end--lg{margin-block:0;margin-inline:-3rem}.fd-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}[class*=--compact] .fd-multi-combobox-tokenizer-custom:not([class*=--cozy]):not([class*=--condensed]),.is-compact .fd-multi-combobox-tokenizer-custom:not(.is-cozy):not(.is-condensed),.fd-multi-combobox-tokenizer-custom[class*=--compact],.fd-multi-combobox-tokenizer-custom.is-compact{width:calc(100% - 2rem)}.fd-multi-combobox-input-group-custom{display:inline-block}.fd-multi-combobox .fd-popover-custom{display:block}.fd-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fd-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fd-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}.fd-multi-combobox__list-container fd-form-message{max-width:100%;border-radius:0!important}.fd-dialog__body fd-form-message{max-width:100%;border-radius:0!important}\n/*! Bundled license information:\n\nfundamental-styles/dist/margins.css:\n  (*!\n   * Fundamental Library Styles v0.39.2\n   * Copyright (c) 2025 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: i0.ElementRef }, { type: i0.Injector }, { type: i0.ViewContainerRef }, { type: i1.DynamicComponentService }], propDecorators: { showSelectAll: [{
                 type: Input
             }], selectedItems: [{