@siemens/element-ng 51.3.0 → 51.5.0

package/fesm2022/siemens-element-ng-result-details-list.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"siemens-element-ng-result-details-list.mjs","sources":["../../../../projects/element-ng/result-details-list/si-result-details-list.component.ts","../../../../projects/element-ng/result-details-list/si-result-details-list.component.html","../../../../projects/element-ng/result-details-list/si-result-details-list.datamodel.ts","../../../../projects/element-ng/result-details-list/si-result-details-list.module.ts","../../../../projects/element-ng/result-details-list/index.ts","../../../../projects/element-ng/result-details-list/siemens-element-ng-result-details-list.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport {\n  elementCircleFilled,\n  elementNotChecked,\n  elementOutOfService,\n  elementStateExclamationMark,\n  elementStateTick\n} from '@siemens/element-icons';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiLoadingSpinnerComponent } from '@siemens/element-ng/loading-spinner';\nimport { SiTranslatePipe } from '@siemens/element-translate-ng/translate';\n\nimport { ResultDetailStep } from './si-result-details-list.datamodel';\n\n@Component({\n  selector: 'si-result-details-list',\n  imports: [SiLoadingSpinnerComponent, SiIconComponent, SiTranslatePipe],\n  templateUrl: './si-result-details-list.component.html',\n  styleUrl: './si-result-details-list.component.scss',\n  changeDetection: ChangeDetectionStrategy.Eager\n})\nexport class SiResultDetailsListComponent {\n  /**\n   * Array of steps to show in the list.\n   *\n   * @defaultValue []\n   */\n  readonly steps = input<ResultDetailStep[]>([]);\n\n  protected readonly stepHasValue = computed(() => this.steps().some(item => !!item.value));\n\n  protected readonly icons = addIcons({\n    elementCircleFilled,\n    elementNotChecked,\n    elementOutOfService,\n    elementStateExclamationMark,\n    elementStateTick\n  });\n}\n","<ul class=\"list-unstyled d-flex flex-column mb-0\">\n  @for (step of steps(); track $index) {\n    <li\n      class=\"position-relative d-flex align-items-center timeline px-6 py-5\"\n      [class.text-accent]=\"step.state === 'running'\"\n    >\n      <div class=\"icon-stack icon me-4\">\n        @if (step.state === 'running') {\n          <si-loading-spinner />\n        } @else {\n          @if (step.icon) {\n            <si-icon [icon]=\"step.icon\" />\n          } @else {\n            @switch (step.state) {\n              @case ('passed') {\n                <si-icon class=\"status-success\" [icon]=\"icons.elementCircleFilled\" />\n                <si-icon class=\"status-critical-contrast\" [icon]=\"icons.elementStateTick\" />\n              }\n              @case ('failed') {\n                <si-icon class=\"status-danger\" [icon]=\"icons.elementCircleFilled\" />\n                <si-icon\n                  class=\"status-critical-contrast\"\n                  [icon]=\"icons.elementStateExclamationMark\"\n                />\n              }\n              @case ('not-started') {\n                <si-icon [icon]=\"icons.elementNotChecked\" />\n              }\n              @default {\n                <si-icon [icon]=\"icons.elementOutOfService\" />\n              }\n            }\n          }\n        }\n      </div>\n\n      <div class=\"d-flex flex-column justify-content-center w-100 overflow-hidden\">\n        <div class=\"d-flex\">\n          <div class=\"result-description\">\n            <span class=\"si-h5\">{{ step.description | translate: step.translationParams }}</span>\n            @if (step.detail) {\n              <div class=\"si-body text-secondary result-detail\">{{\n                step.detail | translate: step.translationParams\n              }}</div>\n            }\n            @if (step.errorMessage) {\n              <div class=\"si-h5 text-danger\">{{\n                step.errorMessage | translate: step.translationParams\n              }}</div>\n            }\n          </div>\n          @if (step.value) {\n            <span class=\"result-value\">{{ step.value }}</span>\n          } @else if (stepHasValue()) {\n            <!-- empty placeholder to align step description with other steps-->\n            <span class=\"result-value\"></span>\n          }\n        </div>\n      </div>\n    </li>\n  }\n</ul>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\n\nimport { TranslatableString } from '@siemens/element-translate-ng/translate';\n\n/** */\nexport interface ResultDetailStep {\n  /**\n   * A description of the step.\n   */\n  description: TranslatableString;\n  /**\n   * A state object defining the state of the step.\n   */\n  state: ResultDetailStepState;\n  /**\n   * Optional value to be displayed for the step.\n   */\n  value?: string;\n  /**\n   * Optional error message to display.\n   */\n  errorMessage?: string;\n  /**\n   * Optional custom icon to display. Otherwise a default icon will be shown based on the state property.\n   */\n  icon?: string;\n  /**\n   * Optional detail text which appears below description.\n   */\n  detail?: TranslatableString;\n  /**\n   * Optional translation params to be used with translate pipe.\n   */\n  translationParams?: Record<string, unknown>;\n}\n\n/**\n * This type defines the state that a detailed result step can have.\n */\nexport type ResultDetailStepState =\n  'passed' | 'failed' | 'running' | 'not-supported' | 'not-started';\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiResultDetailsListComponent } from './si-result-details-list.component';\n\n@NgModule({\n  imports: [SiResultDetailsListComponent],\n  exports: [SiResultDetailsListComponent]\n})\nexport class SiResultDetailsListModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-result-details-list.component';\nexport * from './si-result-details-list.datamodel';\nexport * from './si-result-details-list.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;AAAA;;;AAGG;MAsBU,4BAA4B,CAAA;AACvC;;;;AAIG;IACM,KAAK,GAAG,KAAK,CAAqB,EAAE;8EAAC;IAE3B,YAAY,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;qFAAC;IAEtE,KAAK,GAAG,QAAQ,CAAC;QAClC,mBAAmB;QACnB,iBAAiB;QACjB,mBAAmB;QACnB,2BAA2B;QAC3B;AACD,KAAA,CAAC;uGAhBS,4BAA4B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAA5B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,4BAA4B,sNCzBzC,w0EA8DA,EAAA,MAAA,EAAA,CAAA,8+BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,ED1CY,yBAAyB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,mBAAA,EAAA,kBAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,eAAe,iEAAE,eAAe,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,KAAA,EAAA,CAAA;;2FAK1D,4BAA4B,EAAA,UAAA,EAAA,CAAA;kBAPxC,SAAS;+BACE,wBAAwB,EAAA,OAAA,EACzB,CAAC,yBAAyB,EAAE,eAAe,EAAE,eAAe,CAAC,EAAA,eAAA,EAGrD,uBAAuB,CAAC,KAAK,EAAA,QAAA,EAAA,w0EAAA,EAAA,MAAA,EAAA,CAAA,8+BAAA,CAAA,EAAA;;;AEvBhD;;;AAGG;;ACHH;;;AAGG;MASU,yBAAyB,CAAA;uGAAzB,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;wGAAzB,yBAAyB,EAAA,OAAA,EAAA,CAH1B,4BAA4B,CAAA,EAAA,OAAA,EAAA,CAC5B,4BAA4B,CAAA,EAAA,CAAA;AAE3B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,yBAAyB,YAH1B,4BAA4B,CAAA,EAAA,CAAA;;2FAG3B,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBAJrC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,4BAA4B,CAAC;oBACvC,OAAO,EAAE,CAAC,4BAA4B;AACvC,iBAAA;;;ACXD;;;AAGG;;ACHH;;AAEG;;"}
+{"version":3,"file":"siemens-element-ng-result-details-list.mjs","sources":["../../../../projects/element-ng/result-details-list/si-result-details-list.component.ts","../../../../projects/element-ng/result-details-list/si-result-details-list.component.html","../../../../projects/element-ng/result-details-list/si-result-details-list.datamodel.ts","../../../../projects/element-ng/result-details-list/si-result-details-list.module.ts","../../../../projects/element-ng/result-details-list/index.ts","../../../../projects/element-ng/result-details-list/siemens-element-ng-result-details-list.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport {\n  elementCircleFilled,\n  elementNotChecked,\n  elementOutOfService,\n  elementStateExclamationMark,\n  elementStateTick\n} from '@siemens/element-icons';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiLoadingSpinnerComponent } from '@siemens/element-ng/loading-spinner';\nimport { SiTranslatePipe } from '@siemens/element-translate-ng/translate';\n\nimport { ResultDetailStep } from './si-result-details-list.datamodel';\n\n@Component({\n  selector: 'si-result-details-list',\n  imports: [SiLoadingSpinnerComponent, SiIconComponent, SiTranslatePipe],\n  templateUrl: './si-result-details-list.component.html',\n  styleUrl: './si-result-details-list.component.scss',\n  changeDetection: ChangeDetectionStrategy.Eager\n})\nexport class SiResultDetailsListComponent {\n  /**\n   * Array of steps to show in the list.\n   *\n   * @defaultValue []\n   */\n  readonly steps = input<ResultDetailStep[]>([]);\n\n  protected readonly stepHasValue = computed(() => this.steps().some(item => !!item.value));\n\n  protected readonly icons = addIcons({\n    elementCircleFilled,\n    elementNotChecked,\n    elementOutOfService,\n    elementStateExclamationMark,\n    elementStateTick\n  });\n}\n","<ul class=\"list-unstyled d-flex flex-column mb-0\">\n  @for (step of steps(); track $index) {\n    <li\n      class=\"position-relative d-flex align-items-center timeline px-6 py-5\"\n      [class.text-accent]=\"step.state === 'running'\"\n    >\n      <div class=\"icon-stack icon me-4\">\n        @if (step.state === 'running') {\n          <si-loading-spinner />\n        } @else {\n          @if (step.icon) {\n            <si-icon [icon]=\"step.icon\" />\n          } @else {\n            @switch (step.state) {\n              @case ('passed') {\n                <si-icon class=\"status-success\" [icon]=\"icons.elementCircleFilled\" />\n                <si-icon class=\"status-critical-contrast\" [icon]=\"icons.elementStateTick\" />\n              }\n              @case ('failed') {\n                <si-icon class=\"status-danger\" [icon]=\"icons.elementCircleFilled\" />\n                <si-icon\n                  class=\"status-critical-contrast\"\n                  [icon]=\"icons.elementStateExclamationMark\"\n                />\n              }\n              @case ('not-started') {\n                <si-icon [icon]=\"icons.elementNotChecked\" />\n              }\n              @default {\n                <si-icon [icon]=\"icons.elementOutOfService\" />\n              }\n            }\n          }\n        }\n      </div>\n\n      <div class=\"d-flex flex-column justify-content-center w-100 overflow-hidden\">\n        <div class=\"d-flex\">\n          <div class=\"result-description\">\n            <span class=\"si-h5\">{{ step.description | translate: step.translationParams }}</span>\n            @if (step.detail) {\n              <div class=\"si-body text-secondary result-detail\">{{\n                step.detail | translate: step.translationParams\n              }}</div>\n            }\n            @if (step.errorMessage) {\n              <div class=\"si-h5 text-danger\">{{\n                step.errorMessage | translate: step.translationParams\n              }}</div>\n            }\n          </div>\n          @if (step.value) {\n            <span class=\"result-value\">{{ step.value }}</span>\n          } @else if (stepHasValue()) {\n            <!-- empty placeholder to align step description with other steps-->\n            <span class=\"result-value\"></span>\n          }\n        </div>\n      </div>\n    </li>\n  }\n</ul>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\n\nimport { TranslatableString } from '@siemens/element-translate-ng/translate';\n\n/** */\nexport interface ResultDetailStep {\n  /**\n   * A description of the step.\n   */\n  description: TranslatableString;\n  /**\n   * A state object defining the state of the step.\n   */\n  state: ResultDetailStepState;\n  /**\n   * Optional value to be displayed for the step.\n   */\n  value?: string;\n  /**\n   * Optional error message to display.\n   */\n  errorMessage?: string;\n  /**\n   * Optional custom icon to display. Otherwise a default icon will be shown based on the state property.\n   */\n  icon?: string;\n  /**\n   * Optional detail text which appears below description.\n   */\n  detail?: TranslatableString;\n  /**\n   * Optional translation params to be used with translate pipe.\n   */\n  translationParams?: Record<string, unknown>;\n}\n\n/**\n * This type defines the state that a detailed result step can have.\n */\nexport type ResultDetailStepState =\n  'passed' | 'failed' | 'running' | 'not-supported' | 'not-started';\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiResultDetailsListComponent } from './si-result-details-list.component';\n\n@NgModule({\n  imports: [SiResultDetailsListComponent],\n  exports: [SiResultDetailsListComponent]\n})\nexport class SiResultDetailsListModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-result-details-list.component';\nexport * from './si-result-details-list.datamodel';\nexport * from './si-result-details-list.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;AAAA;;;AAGG;MAsBU,4BAA4B,CAAA;AACvC;;;;AAIG;IACM,KAAK,GAAG,KAAK,CAAqB,EAAE;8EAAC;IAE3B,YAAY,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;qFAAC;IAEtE,KAAK,GAAG,QAAQ,CAAC;QAClC,mBAAmB;QACnB,iBAAiB;QACjB,mBAAmB;QACnB,2BAA2B;QAC3B;AACD,KAAA,CAAC;uGAhBS,4BAA4B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAA5B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,4BAA4B,sNCzBzC,w0EA8DA,EAAA,MAAA,EAAA,CAAA,8+BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,ED1CY,yBAAyB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,mBAAA,EAAA,kBAAA,EAAA,WAAA,EAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,eAAe,iEAAE,eAAe,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,KAAA,EAAA,CAAA;;2FAK1D,4BAA4B,EAAA,UAAA,EAAA,CAAA;kBAPxC,SAAS;+BACE,wBAAwB,EAAA,OAAA,EACzB,CAAC,yBAAyB,EAAE,eAAe,EAAE,eAAe,CAAC,EAAA,eAAA,EAGrD,uBAAuB,CAAC,KAAK,EAAA,QAAA,EAAA,w0EAAA,EAAA,MAAA,EAAA,CAAA,8+BAAA,CAAA,EAAA;;;AEvBhD;;;AAGG;;ACHH;;;AAGG;MASU,yBAAyB,CAAA;uGAAzB,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;wGAAzB,yBAAyB,EAAA,OAAA,EAAA,CAH1B,4BAA4B,CAAA,EAAA,OAAA,EAAA,CAC5B,4BAA4B,CAAA,EAAA,CAAA;AAE3B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,yBAAyB,YAH1B,4BAA4B,CAAA,EAAA,CAAA;;2FAG3B,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBAJrC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,4BAA4B,CAAC;oBACvC,OAAO,EAAE,CAAC,4BAA4B;AACvC,iBAAA;;;ACXD;;;AAGG;;ACHH;;AAEG;;"}

package/fesm2022/siemens-element-ng-select.mjs

@@ -75,13 +75,13 @@ class SiSelectOptionComponent {
     optionTemplate = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "optionTemplate" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiSelectOptionComponent, isStandalone: true, selector: "si-select-option", inputs: { option: { classPropertyName: "option", publicName: "option", isSignal: true, isRequired: true, transformFunction: null }, optionTemplate: { classPropertyName: "optionTemplate", publicName: "optionTemplate", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "d-flex align-items-center overflow-hidden" }, ngImport: i0, template: "<ng-container\n  [ngTemplateOutlet]=\"optionTemplate() ?? defaultOptionTemplate\"\n  [ngTemplateOutletContext]=\"{ $implicit: option() }\"\n/>\n\n<ng-template #defaultOptionTemplate let-item siSelectOptionTemplate>\n  @if (item.icon) {\n    <i class=\"icon-stack\">\n      <si-icon\n        class=\"icon me-2\"\n        [icon]=\"item.icon\"\n        [class]=\"!item.disabled && item.iconColor ? item.iconColor : ''\"\n      />\n      @if (item.stackedIcon) {\n        <si-icon\n          class=\"icon me-2\"\n          [class]=\"item.stackedIconColor ?? ''\"\n          [icon]=\"item.stackedIcon\"\n        />\n      }\n    </i>\n  }\n  @if (item.label) {\n    <span class=\"text-truncate\">{{ item.label | translate }}</span>\n  }\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiSelectOptionTemplateDirective, selector: "[siSelectOptionTemplate]" }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiSelectOptionComponent, isStandalone: true, selector: "si-select-option", inputs: { option: { classPropertyName: "option", publicName: "option", isSignal: true, isRequired: true, transformFunction: null }, optionTemplate: { classPropertyName: "optionTemplate", publicName: "optionTemplate", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "d-flex align-items-center overflow-hidden" }, ngImport: i0, template: "<ng-container\n  [ngTemplateOutlet]=\"optionTemplate() ?? defaultOptionTemplate\"\n  [ngTemplateOutletContext]=\"{ $implicit: option() }\"\n/>\n\n<ng-template #defaultOptionTemplate let-item siSelectOptionTemplate>\n  @if (item.icon) {\n    <i class=\"icon-stack\">\n      <si-icon\n        class=\"icon dropdown-item-icon me-2\"\n        [icon]=\"item.icon\"\n        [class]=\"!item.disabled && item.iconColor ? item.iconColor : ''\"\n      />\n      @if (item.stackedIcon) {\n        <si-icon\n          class=\"icon me-2\"\n          [class]=\"item.stackedIconColor ?? ''\"\n          [icon]=\"item.stackedIcon\"\n        />\n      }\n    </i>\n  }\n  @if (item.label) {\n    <span class=\"text-truncate\">{{ item.label | translate }}</span>\n  }\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiSelectOptionTemplateDirective, selector: "[siSelectOptionTemplate]" }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSelectOptionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'si-select-option', imports: [NgTemplateOutlet, SiIconComponent, SiTranslatePipe, SiSelectOptionTemplateDirective], host: {
                         class: 'd-flex align-items-center overflow-hidden'
-                    }, template: "<ng-container\n  [ngTemplateOutlet]=\"optionTemplate() ?? defaultOptionTemplate\"\n  [ngTemplateOutletContext]=\"{ $implicit: option() }\"\n/>\n\n<ng-template #defaultOptionTemplate let-item siSelectOptionTemplate>\n  @if (item.icon) {\n    <i class=\"icon-stack\">\n      <si-icon\n        class=\"icon me-2\"\n        [icon]=\"item.icon\"\n        [class]=\"!item.disabled && item.iconColor ? item.iconColor : ''\"\n      />\n      @if (item.stackedIcon) {\n        <si-icon\n          class=\"icon me-2\"\n          [class]=\"item.stackedIconColor ?? ''\"\n          [icon]=\"item.stackedIcon\"\n        />\n      }\n    </i>\n  }\n  @if (item.label) {\n    <span class=\"text-truncate\">{{ item.label | translate }}</span>\n  }\n</ng-template>\n" }]
+                    }, template: "<ng-container\n  [ngTemplateOutlet]=\"optionTemplate() ?? defaultOptionTemplate\"\n  [ngTemplateOutletContext]=\"{ $implicit: option() }\"\n/>\n\n<ng-template #defaultOptionTemplate let-item siSelectOptionTemplate>\n  @if (item.icon) {\n    <i class=\"icon-stack\">\n      <si-icon\n        class=\"icon dropdown-item-icon me-2\"\n        [icon]=\"item.icon\"\n        [class]=\"!item.disabled && item.iconColor ? item.iconColor : ''\"\n      />\n      @if (item.stackedIcon) {\n        <si-icon\n          class=\"icon me-2\"\n          [class]=\"item.stackedIconColor ?? ''\"\n          [icon]=\"item.stackedIcon\"\n        />\n      }\n    </i>\n  }\n  @if (item.label) {\n    <span class=\"text-truncate\">{{ item.label | translate }}</span>\n  }\n</ng-template>\n" }]
         }], propDecorators: { option: [{ type: i0.Input, args: [{ isSignal: true, alias: "option", required: true }] }], optionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionTemplate", required: false }] }] } });
 
 /**
@@ -482,7 +482,7 @@ class SiSelectListHasFilterComponent extends SiSelectListBase {
         this.closeOverlayIfSingle();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSelectListHasFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiSelectListHasFilterComponent, isStandalone: true, selector: "si-select-list-has-filter", inputs: { filterPlaceholder: { classPropertyName: "filterPlaceholder", publicName: "filterPlaceholder", isSignal: true, isRequired: true, transformFunction: null }, noResultsFoundLabel: { classPropertyName: "noResultsFoundLabel", publicName: "noResultsFoundLabel", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "attr.id": "id()" }, classAttribute: "pt-0" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["filter"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"pt-5 pb-5 px-5 top-0\">\n  <div class=\"search-bar variant-background-0\">\n    <input\n      #filter\n      #siAutocomplete=\"siAutocomplete\"\n      siAutocomplete\n      class=\"search-bar-input form-control\"\n      [placeholder]=\"filterPlaceholder() | translate\"\n      [id]=\"baseId() + 'filter-input'\"\n      [attr.aria-labelledby]=\"baseId() + '-aria-label' + ' ' + labelledby()\"\n      (input)=\"input()\"\n    />\n    <si-icon class=\"search-bar-icon\" [icon]=\"icons.elementSearch\" />\n    @if (selectOptions.loading?.()) {\n      <si-loading-spinner class=\"position-absolute end-0 bottom-0 d-flex align-items-center p-2\" />\n    }\n  </div>\n</div>\n<div\n  class=\"si-select-filtered-items\"\n  tabindex=\"-1\"\n  [siAutocompleteListboxFor]=\"siAutocomplete\"\n  [siAutocompleteDefaultIndex]=\"initIndex()\"\n  [attr.aria-labelledby]=\"baseId() + '-aria-label' + ' ' + labelledby()\"\n  (siAutocompleteOptionSubmitted)=\"select($event)\"\n>\n  @for (item of rows(); track item; let index = $index) {\n    @if (item.type === 'group') {\n      <div\n        role=\"group\"\n        class=\"ps-0\"\n        aria-disabled=\"false\"\n        [attr.aria-labelledby]=\"baseId() + '-' + index + '-group-header'\"\n      >\n        <div class=\"dropdown-header\" [id]=\"baseId() + '-' + index + '-group-header'\">\n          <ng-container\n            [ngTemplateOutlet]=\"groupTemplate() ?? defaultGroupTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: item }\"\n          />\n        </div>\n        @for (optionRow of item.options; track optionRow) {\n          <ng-container\n            [ngTemplateOutlet]=\"optionRowTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionRow }\"\n          />\n        }\n      </div>\n    }\n    @if (item.type === 'option') {\n      <ng-container\n        [ngTemplateOutlet]=\"optionRowTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: item }\"\n      />\n    }\n  } @empty {\n    <div\n      role=\"option\"\n      aria-disabled=\"true\"\n      aria-selected=\"false\"\n      class=\"dropdown-item disabled text-secondary justify-content-center mb-2\"\n    >\n      <span>{{ noResultsFoundLabel() | translate }}</span>\n    </div>\n  }\n\n  <ng-template #optionRowTemplate let-option siSelectOptionRowTemplate>\n    <si-select-option-row\n      [option]=\"option\"\n      [optionTemplate]=\"optionTemplate()\"\n      [siAutocompleteOption]=\"option.value\"\n      [disabled]=\"option.disabled\"\n      [selected]=\"selectionStrategy.arrayValue().includes(option.value)\"\n    />\n  </ng-template>\n</div>\n@if (actionsTemplate()) {\n  <div class=\"dropdown-divider\"></div>\n  <div class=\"d-flex flex-column align-items-start\">\n    <ng-container\n      [ngTemplateOutlet]=\"actionsTemplate()!\"\n      [ngTemplateOutletContext]=\"{\n        searchText: filter.value,\n        visibleOptionsCount: rows().length\n      }\"\n    />\n  </div>\n}\n\n<ng-template #defaultGroupTemplate let-group siSelectGroupTemplate>\n  {{ group.label | translate }}\n</ng-template>\n", styles: [".si-select-filtered-items{max-block-size:min(100vb - 56px,266px);overflow-y:auto}si-loading-spinner{--loading-spinner-size: var(--si-sys-sizing-icon-md)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: SiAutocompleteDirective, selector: "input[siAutocomplete]", exportAs: ["siAutocomplete"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiSelectGroupTemplateDirective, selector: "[siSelectGroupTemplate]" }, { kind: "component", type: SiSelectOptionRowComponent, selector: "si-select-option-row", inputs: ["option", "optionTemplate", "selected"] }, { kind: "directive", type: SiSelectOptionRowTemplateDirective, selector: "[siSelectOptionRowTemplate]" }, { kind: "ngmodule", type: SiAutocompleteModule }, { kind: "directive", type: i1$1.SiAutocompleteListboxDirective, selector: "[siAutocompleteListboxFor]", inputs: ["id", "siAutocompleteListboxFor", "siAutocompleteDefaultIndex"], outputs: ["siAutocompleteOptionSubmitted"], exportAs: ["siAutocompleteListbox"] }, { kind: "directive", type: i1$1.SiAutocompleteOptionDirective, selector: "[siAutocompleteOption]", inputs: ["id", "disabled", "siAutocompleteOption"], exportAs: ["siAutocompleteOption"] }, { kind: "component", type: SiLoadingSpinnerComponent, selector: "si-loading-spinner", inputs: ["isBlockingSpinner", "isSpinnerOverlay", "ariaLabel"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiSelectListHasFilterComponent, isStandalone: true, selector: "si-select-list-has-filter", inputs: { filterPlaceholder: { classPropertyName: "filterPlaceholder", publicName: "filterPlaceholder", isSignal: true, isRequired: true, transformFunction: null }, noResultsFoundLabel: { classPropertyName: "noResultsFoundLabel", publicName: "noResultsFoundLabel", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "attr.id": "id()" }, classAttribute: "pt-0" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["filter"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"pt-5 pb-5 px-5 top-0\">\n  <div class=\"search-bar variant-background-0\">\n    <input\n      #filter\n      #siAutocomplete=\"siAutocomplete\"\n      siAutocomplete\n      class=\"search-bar-input form-control\"\n      [placeholder]=\"filterPlaceholder() | translate\"\n      [id]=\"baseId() + 'filter-input'\"\n      [attr.aria-labelledby]=\"baseId() + '-aria-label' + ' ' + labelledby()\"\n      (input)=\"input()\"\n    />\n    <si-icon class=\"search-bar-icon\" [icon]=\"icons.elementSearch\" />\n    @if (selectOptions.loading?.()) {\n      <si-loading-spinner class=\"position-absolute end-0 bottom-0 d-flex align-items-center p-2\" />\n    }\n  </div>\n</div>\n<div\n  class=\"si-select-filtered-items\"\n  tabindex=\"-1\"\n  [siAutocompleteListboxFor]=\"siAutocomplete\"\n  [siAutocompleteDefaultIndex]=\"initIndex()\"\n  [attr.aria-labelledby]=\"baseId() + '-aria-label' + ' ' + labelledby()\"\n  (siAutocompleteOptionSubmitted)=\"select($event)\"\n>\n  @for (item of rows(); track item; let index = $index) {\n    @if (item.type === 'group') {\n      <div\n        role=\"group\"\n        class=\"ps-0\"\n        aria-disabled=\"false\"\n        [attr.aria-labelledby]=\"baseId() + '-' + index + '-group-header'\"\n      >\n        <div class=\"dropdown-header\" [id]=\"baseId() + '-' + index + '-group-header'\">\n          <ng-container\n            [ngTemplateOutlet]=\"groupTemplate() ?? defaultGroupTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: item }\"\n          />\n        </div>\n        @for (optionRow of item.options; track optionRow) {\n          <ng-container\n            [ngTemplateOutlet]=\"optionRowTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionRow }\"\n          />\n        }\n      </div>\n    }\n    @if (item.type === 'option') {\n      <ng-container\n        [ngTemplateOutlet]=\"optionRowTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: item }\"\n      />\n    }\n  } @empty {\n    <div\n      role=\"option\"\n      aria-disabled=\"true\"\n      aria-selected=\"false\"\n      class=\"dropdown-item disabled text-secondary justify-content-center mb-2\"\n    >\n      <span>{{ noResultsFoundLabel() | translate }}</span>\n    </div>\n  }\n\n  <ng-template #optionRowTemplate let-option siSelectOptionRowTemplate>\n    <si-select-option-row\n      [option]=\"option\"\n      [optionTemplate]=\"optionTemplate()\"\n      [siAutocompleteOption]=\"option.value\"\n      [disabled]=\"option.disabled\"\n      [selected]=\"selectionStrategy.arrayValue().includes(option.value)\"\n    />\n  </ng-template>\n</div>\n@if (actionsTemplate()) {\n  <div class=\"dropdown-divider\"></div>\n  <div class=\"d-flex flex-column align-items-start\">\n    <ng-container\n      [ngTemplateOutlet]=\"actionsTemplate()!\"\n      [ngTemplateOutletContext]=\"{\n        searchText: filter.value,\n        visibleOptionsCount: rows().length\n      }\"\n    />\n  </div>\n}\n\n<ng-template #defaultGroupTemplate let-group siSelectGroupTemplate>\n  {{ group.label | translate }}\n</ng-template>\n", styles: [".si-select-filtered-items{max-block-size:min(100vb - 56px,266px);overflow-y:auto}si-loading-spinner{--loading-spinner-size: var(--si-sys-sizing-icon-md)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: SiAutocompleteDirective, selector: "input[siAutocomplete]", exportAs: ["siAutocomplete"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiSelectGroupTemplateDirective, selector: "[siSelectGroupTemplate]" }, { kind: "component", type: SiSelectOptionRowComponent, selector: "si-select-option-row", inputs: ["option", "optionTemplate", "selected"] }, { kind: "directive", type: SiSelectOptionRowTemplateDirective, selector: "[siSelectOptionRowTemplate]" }, { kind: "ngmodule", type: SiAutocompleteModule }, { kind: "directive", type: i1$1.SiAutocompleteListboxDirective, selector: "[siAutocompleteListboxFor]", inputs: ["id", "siAutocompleteListboxFor", "siAutocompleteDefaultIndex"], outputs: ["siAutocompleteOptionSubmitted"], exportAs: ["siAutocompleteListbox"] }, { kind: "directive", type: i1$1.SiAutocompleteOptionDirective, selector: "[siAutocompleteOption]", inputs: ["id", "disabled", "siAutocompleteOption"], exportAs: ["siAutocompleteOption"] }, { kind: "component", type: SiLoadingSpinnerComponent, selector: "si-loading-spinner", inputs: ["isBlockingSpinner", "isSpinnerOverlay", "ariaLabel", "loadingText"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSelectListHasFilterComponent, decorators: [{
             type: Component,