npm - @tedi-design-system/angular - Versions diffs - 9.0.0-rc.9 → 9.0.1-rc.1 - Mend

@tedi-design-system/angular 9.0.0-rc.9 → 9.0.1-rc.1

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 (12) hide show

package/fesm2022/tedi-design-system-angular-community-text-editor.mjs +2 -2
package/fesm2022/tedi-design-system-angular-community-text-editor.mjs.map +1 -1
package/fesm2022/tedi-design-system-angular-community.mjs +10 -10
package/fesm2022/tedi-design-system-angular-community.mjs.map +1 -1
package/fesm2022/tedi-design-system-angular-tedi.mjs +397 -164
package/fesm2022/tedi-design-system-angular-tedi.mjs.map +1 -1
package/fonts/LICENSE-Apache-2.0.txt +202 -0
package/index-without-icons.css +1 -1
package/index.css +1 -1
package/package.json +2 -2
package/tedi/index.d.ts +137 -62
package/tedi/index.d.ts.map +1 -1

package/fesm2022/tedi-design-system-angular-tedi.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { input, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, signal, inject, ElementRef, Directive, booleanAttribute, output, ViewContainerRef, Renderer2, effect, HostListener, Injectable, InjectionToken, model, isDevMode, forwardRef, contentChild, DestroyRef, afterRenderEffect, contentChildren, PLATFORM_ID, REQUEST, isSignal, Pipe, Injector, TemplateRef, viewChild, viewChildren, untracked, afterNextRender, NgZone, linkedSignal, ErrorHandler, Optional, SkipSelf, HostAttributeToken, ViewChild, numberAttribute, HostBinding, runInInjectionContext, ContentChildren, RendererStyleFlags2, ContentChild, makeEnvironmentProviders } from '@angular/core';
+import { input, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, signal, inject, ElementRef, Directive, booleanAttribute, output, ViewContainerRef, Renderer2, effect, HostListener, Injectable, InjectionToken, model, isDevMode, forwardRef, contentChild, DestroyRef, afterRenderEffect, contentChildren, PLATFORM_ID, REQUEST, isSignal, Pipe, Injector, TemplateRef, numberAttribute, viewChild, viewChildren, untracked, afterNextRender, NgZone, linkedSignal, ErrorHandler, Optional, SkipSelf, HostAttributeToken, ViewChild, HostBinding, runInInjectionContext, ContentChildren, RendererStyleFlags2, ContentChild, makeEnvironmentProviders } from '@angular/core';
 import { BreakpointObserver } from '@angular/cdk/layout';
 import * as i1 from '@angular/cdk/overlay';
 import { CdkOverlayOrigin, OverlayContainer, OverlayModule, Overlay, OverlayConfig, CdkConnectedOverlay } from '@angular/cdk/overlay';
@@ -248,7 +248,7 @@ class ButtonComponent {
         return classList.join(" ");
     }, ...(ngDevMode ? [{ debugName: "classes" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: ButtonComponent, isStandalone: true, selector: "[tedi-button]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, hostDirectives: [{ directive: BaseButtonDirective }], ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-inactive-text);--_btn-bg: var(--button-group-primary-inactive-background);--_btn-border: var(--button-group-primary-inactive-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-inactive-text);--_btn-focus-bg: var(--button-group-primary-inactive-background);--_btn-focus-border: var(--button-group-primary-inactive-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-inactive-text);--_btn-bg: var(--button-group-secondary-inactive-background);--_btn-border: var(--button-group-secondary-inactive-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-inactive-text);--_btn-focus-bg: var(--button-group-secondary-inactive-background);--_btn-focus-border: var(--button-group-secondary-inactive-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}\n"], encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: ButtonComponent, isStandalone: true, selector: "[tedi-button]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, hostDirectives: [{ directive: BaseButtonDirective }], ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-unselected-text);--_btn-bg: var(--button-group-primary-unselected-background);--_btn-border: var(--button-group-primary-unselected-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-unselected-text);--_btn-focus-bg: var(--button-group-primary-unselected-background);--_btn-focus-border: var(--button-group-primary-unselected-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-unselected-text);--_btn-bg: var(--button-group-secondary-unselected-background);--_btn-border: var(--button-group-secondary-unselected-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-unselected-text);--_btn-focus-bg: var(--button-group-secondary-unselected-background);--_btn-focus-border: var(--button-group-secondary-unselected-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}\n"], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
@@ -258,7 +258,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         },
                     ], host: {
                         "[class]": "classes()",
-                    }, styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-inactive-text);--_btn-bg: var(--button-group-primary-inactive-background);--_btn-border: var(--button-group-primary-inactive-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-inactive-text);--_btn-focus-bg: var(--button-group-primary-inactive-background);--_btn-focus-border: var(--button-group-primary-inactive-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-inactive-text);--_btn-bg: var(--button-group-secondary-inactive-background);--_btn-border: var(--button-group-secondary-inactive-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-inactive-text);--_btn-focus-bg: var(--button-group-secondary-inactive-background);--_btn-focus-border: var(--button-group-secondary-inactive-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}\n"] }]
+                    }, styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-unselected-text);--_btn-bg: var(--button-group-primary-unselected-background);--_btn-border: var(--button-group-primary-unselected-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-unselected-text);--_btn-focus-bg: var(--button-group-primary-unselected-background);--_btn-focus-border: var(--button-group-primary-unselected-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-unselected-text);--_btn-bg: var(--button-group-secondary-unselected-background);--_btn-border: var(--button-group-secondary-unselected-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-unselected-text);--_btn-focus-bg: var(--button-group-secondary-unselected-background);--_btn-focus-border: var(--button-group-secondary-unselected-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}\n"] }]
         }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
 /**
@@ -859,7 +859,7 @@ class CheckboxComponent {
      */
     size = input("default", ...(ngDevMode ? [{ debugName: "size" }] : []));
     /**
-     * Is checkbox invalid?
+     * Show the checkbox in an invalid state.
      * @default false
      */
     invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
@@ -870,7 +870,7 @@ class CheckboxComponent {
      */
     value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
     /**
-     * Disables this checkbox. An enclosing disabled `<tedi-checkbox-group>`
+     * Disable this checkbox. An enclosing disabled `<tedi-checkbox-group>`
      * forces disabled regardless of this input.
      * @default false
      */
@@ -904,7 +904,7 @@ class CheckboxComponent {
         this.group.onChildChange(v, this.hostElement.checked);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: CheckboxComponent, isStandalone: true, selector: "input[type=checkbox][tedi-checkbox]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "change": "handleChange()" }, properties: { "class.tedi-checkbox--large": "size() === 'large'", "class.tedi-checkbox--invalid": "invalid()", "disabled": "effectiveDisabled()" } }, ngImport: i0, template: "", isInline: true, styles: ["input[tedi-checkbox][type=checkbox]{--_checkbox-icon-size: 1.125rem;position:relative;width:var(--form-checkbox-radio-size-responsive);min-width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--form-checkbox-radio-default-background-default);border:1px solid var(--form-checkbox-radio-default-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-checkbox)}@media(min-width:36rem){input[tedi-checkbox][type=checkbox]{--_checkbox-icon-size: 1rem}}input[tedi-checkbox][type=checkbox]:not(:disabled):hover{border-color:var(--form-checkbox-radio-default-border-hover);box-shadow:0 0 0 1px var(--form-checkbox-radio-default-border-hover)}input[tedi-checkbox][type=checkbox]:not(:disabled):active{background-color:var(--form-checkbox-radio-default-background-active);border-color:var(--form-checkbox-radio-default-border-active);box-shadow:none}input[tedi-checkbox][type=checkbox]:not(:checked):disabled{cursor:not-allowed;background-color:var(--form-general-background-disabled);border-color:var(--form-general-border-disabled)}input[tedi-checkbox][type=checkbox]:checked,input[tedi-checkbox][type=checkbox]:indeterminate{background-color:var(--form-checkbox-radio-default-background-selected);border-color:var(--form-checkbox-radio-default-border-selected)}input[tedi-checkbox][type=checkbox]:checked:disabled,input[tedi-checkbox][type=checkbox]:indeterminate:disabled{cursor:not-allowed;background-color:var(--form-checkbox-radio-default-background-selected-disabled);border-color:var(--form-checkbox-radio-default-border-selected-disabled)}input[tedi-checkbox][type=checkbox]:checked:before,input[tedi-checkbox][type=checkbox]:indeterminate:before{position:absolute;top:50%;left:50%;font-family:Material Symbols Outlined,sans-serif;font-size:var(--_checkbox-icon-size);line-height:1;color:var(--form-checkbox-radio-default-check-indicator-default);content:\"check\";transform:translate(-50%,-50%);-webkit-font-smoothing:antialiased}input[tedi-checkbox][type=checkbox]:checked:before{content:\"check\"}input[tedi-checkbox][type=checkbox]:indeterminate:before{content:\"remove\"}input[tedi-checkbox][type=checkbox]:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}input[tedi-checkbox][type=checkbox]:not(:checked,:disabled).tedi-checkbox--invalid,input[tedi-checkbox][type=checkbox]:not(:checked,:disabled):user-invalid,input[tedi-checkbox][type=checkbox]:not(:checked,:disabled).ng-invalid.ng-touched{background-color:var(--form-checkbox-radio-default-background-error);border-color:var(--form-general-feedback-error-border)}input[tedi-checkbox][type=checkbox]:not(:checked,:disabled).tedi-checkbox--invalid:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:disabled):user-invalid:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:disabled).ng-invalid.ng-touched:hover{border-color:var(--form-general-feedback-error-border);box-shadow:0 0 0 1px var(--form-general-feedback-error-border)}input[tedi-checkbox][type=checkbox].tedi-checkbox--large{--_checkbox-icon-size: 1.125rem;width:var(--form-checkbox-radio-size-large);height:var(--form-checkbox-radio-size-large)}label:has(input[tedi-checkbox]:not(:disabled)){cursor:pointer}label:has(input[tedi-checkbox]:disabled){cursor:not-allowed}label:has(input[tedi-checkbox])+tedi-feedback-text{padding-left:var(--form-checkbox-radio-size-responsive);margin-left:var(--form-checkbox-radio-inner-spacing)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: CheckboxComponent, isStandalone: true, selector: "input[type=checkbox][tedi-checkbox]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "change": "handleChange()" }, properties: { "class.tedi-checkbox--large": "size() === 'large'", "class.tedi-checkbox--invalid": "invalid()", "disabled": "effectiveDisabled()" } }, ngImport: i0, template: "", isInline: true, styles: ["input[tedi-checkbox][type=checkbox]{--_checkbox-icon-size: 1.125rem;--_checkbox-bg: var(--form-choice-checkbox-unselected-default);--_checkbox-border: var(--form-choice-checkbox-unselected-border-default);--_checkbox-icon: var(--form-choice-checkbox-selected-indicator-default);--_checkbox-inset: 0 0 0 0 transparent;--_checkbox-ring: 0 0 0 0 transparent;position:relative;width:var(--form-checkbox-radio-size-responsive);min-width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--_checkbox-bg);border:var(--tedi-borders-01) solid var(--_checkbox-border);border-radius:var(--form-checkbox-radio-indicator-radius-checkbox);box-shadow:var(--_checkbox-inset),var(--_checkbox-ring)}@media(min-width:36rem){input[tedi-checkbox][type=checkbox]{--_checkbox-icon-size: 1rem}}input[tedi-checkbox][type=checkbox]:not(:disabled,:checked,:indeterminate):hover{--_checkbox-border: var(--form-choice-checkbox-unselected-border-hover);--_checkbox-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_checkbox-border)}input[tedi-checkbox][type=checkbox]:not(:disabled,:checked,:indeterminate):active{--_checkbox-border: var(--form-choice-checkbox-unselected-border-active);--_checkbox-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_checkbox-border)}input[tedi-checkbox][type=checkbox]:focus-visible:not(:disabled){--_checkbox-ring: 0 0 0 var(--tedi-borders-01) var(--general-effect-colors-focus-outset-inner-shadow), 0 0 0 var(--tedi-borders-03) var(--general-effect-colors-focus-outset-outer-shadow);outline:none}input[tedi-checkbox][type=checkbox]:focus-visible:not(:disabled,:checked,:indeterminate){--_checkbox-border: var(--form-choice-checkbox-unselected-border-focus)}input[tedi-checkbox][type=checkbox]:disabled:not(:checked,:indeterminate){--_checkbox-bg: var(--form-choice-checkbox-unselected-disabled);--_checkbox-border: var(--form-choice-checkbox-unselected-border-disabled);cursor:not-allowed}input[tedi-checkbox][type=checkbox]:checked,input[tedi-checkbox][type=checkbox]:indeterminate{--_checkbox-bg: var(--form-choice-checkbox-selected-default);--_checkbox-border: var(--form-choice-checkbox-selected-border-default)}input[tedi-checkbox][type=checkbox]:checked:not(:disabled):hover,input[tedi-checkbox][type=checkbox]:indeterminate:not(:disabled):hover{--_checkbox-bg: var(--form-choice-checkbox-selected-hover);--_checkbox-border: var(--form-choice-checkbox-selected-border-hover);--_checkbox-icon: var(--form-choice-checkbox-selected-indicator-hover)}input[tedi-checkbox][type=checkbox]:checked:not(:disabled):active,input[tedi-checkbox][type=checkbox]:indeterminate:not(:disabled):active{--_checkbox-bg: var(--form-choice-checkbox-selected-active);--_checkbox-border: var(--form-choice-checkbox-selected-border-active);--_checkbox-icon: var(--form-choice-checkbox-selected-indicator-active)}input[tedi-checkbox][type=checkbox]:checked:focus-visible:not(:disabled,:hover,:active),input[tedi-checkbox][type=checkbox]:indeterminate:focus-visible:not(:disabled,:hover,:active){--_checkbox-border: var(--form-choice-checkbox-selected-border-focus)}input[tedi-checkbox][type=checkbox]:checked:disabled,input[tedi-checkbox][type=checkbox]:indeterminate:disabled{--_checkbox-bg: var(--form-choice-checkbox-selected-disabled);--_checkbox-border: var(--form-choice-checkbox-selected-border-disabled);--_checkbox-icon: var(--form-choice-checkbox-selected-indicator-disabled);cursor:not-allowed}input[tedi-checkbox][type=checkbox]:checked:before,input[tedi-checkbox][type=checkbox]:indeterminate:before{position:absolute;top:50%;left:50%;font-family:Material Symbols Outlined,sans-serif;font-size:var(--_checkbox-icon-size);line-height:1;color:var(--_checkbox-icon);content:\"check\";transform:translate(-50%,-50%);-webkit-font-smoothing:antialiased}input[tedi-checkbox][type=checkbox]:checked:before{content:\"check\"}input[tedi-checkbox][type=checkbox]:indeterminate:before{content:\"remove\"}input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).tedi-checkbox--invalid,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled):user-invalid,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).ng-invalid.ng-touched{--_checkbox-border: var(--form-choice-checkbox-unselected-border-error)}input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).tedi-checkbox--invalid:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).tedi-checkbox--invalid:active,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled):user-invalid:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled):user-invalid:active,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).ng-invalid.ng-touched:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).ng-invalid.ng-touched:active{--_checkbox-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_checkbox-border)}input[tedi-checkbox][type=checkbox].tedi-checkbox--large{--_checkbox-icon-size: 1.125rem;width:var(--form-checkbox-radio-size-large);height:var(--form-checkbox-radio-size-large)}label:has(input[tedi-checkbox]:not(:disabled)){cursor:pointer}label:has(input[tedi-checkbox]:disabled){cursor:not-allowed}label:has(input[tedi-checkbox])+tedi-feedback-text{padding-left:var(--form-checkbox-radio-size-responsive);margin-left:var(--form-checkbox-radio-inner-spacing)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CheckboxComponent, decorators: [{
             type: Component,
@@ -913,12 +913,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "[class.tedi-checkbox--invalid]": "invalid()",
                         "[disabled]": "effectiveDisabled()",
                         "(change)": "handleChange()",
-                    }, styles: ["input[tedi-checkbox][type=checkbox]{--_checkbox-icon-size: 1.125rem;position:relative;width:var(--form-checkbox-radio-size-responsive);min-width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--form-checkbox-radio-default-background-default);border:1px solid var(--form-checkbox-radio-default-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-checkbox)}@media(min-width:36rem){input[tedi-checkbox][type=checkbox]{--_checkbox-icon-size: 1rem}}input[tedi-checkbox][type=checkbox]:not(:disabled):hover{border-color:var(--form-checkbox-radio-default-border-hover);box-shadow:0 0 0 1px var(--form-checkbox-radio-default-border-hover)}input[tedi-checkbox][type=checkbox]:not(:disabled):active{background-color:var(--form-checkbox-radio-default-background-active);border-color:var(--form-checkbox-radio-default-border-active);box-shadow:none}input[tedi-checkbox][type=checkbox]:not(:checked):disabled{cursor:not-allowed;background-color:var(--form-general-background-disabled);border-color:var(--form-general-border-disabled)}input[tedi-checkbox][type=checkbox]:checked,input[tedi-checkbox][type=checkbox]:indeterminate{background-color:var(--form-checkbox-radio-default-background-selected);border-color:var(--form-checkbox-radio-default-border-selected)}input[tedi-checkbox][type=checkbox]:checked:disabled,input[tedi-checkbox][type=checkbox]:indeterminate:disabled{cursor:not-allowed;background-color:var(--form-checkbox-radio-default-background-selected-disabled);border-color:var(--form-checkbox-radio-default-border-selected-disabled)}input[tedi-checkbox][type=checkbox]:checked:before,input[tedi-checkbox][type=checkbox]:indeterminate:before{position:absolute;top:50%;left:50%;font-family:Material Symbols Outlined,sans-serif;font-size:var(--_checkbox-icon-size);line-height:1;color:var(--form-checkbox-radio-default-check-indicator-default);content:\"check\";transform:translate(-50%,-50%);-webkit-font-smoothing:antialiased}input[tedi-checkbox][type=checkbox]:checked:before{content:\"check\"}input[tedi-checkbox][type=checkbox]:indeterminate:before{content:\"remove\"}input[tedi-checkbox][type=checkbox]:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}input[tedi-checkbox][type=checkbox]:not(:checked,:disabled).tedi-checkbox--invalid,input[tedi-checkbox][type=checkbox]:not(:checked,:disabled):user-invalid,input[tedi-checkbox][type=checkbox]:not(:checked,:disabled).ng-invalid.ng-touched{background-color:var(--form-checkbox-radio-default-background-error);border-color:var(--form-general-feedback-error-border)}input[tedi-checkbox][type=checkbox]:not(:checked,:disabled).tedi-checkbox--invalid:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:disabled):user-invalid:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:disabled).ng-invalid.ng-touched:hover{border-color:var(--form-general-feedback-error-border);box-shadow:0 0 0 1px var(--form-general-feedback-error-border)}input[tedi-checkbox][type=checkbox].tedi-checkbox--large{--_checkbox-icon-size: 1.125rem;width:var(--form-checkbox-radio-size-large);height:var(--form-checkbox-radio-size-large)}label:has(input[tedi-checkbox]:not(:disabled)){cursor:pointer}label:has(input[tedi-checkbox]:disabled){cursor:not-allowed}label:has(input[tedi-checkbox])+tedi-feedback-text{padding-left:var(--form-checkbox-radio-size-responsive);margin-left:var(--form-checkbox-radio-inner-spacing)}\n"] }]
+                    }, styles: ["input[tedi-checkbox][type=checkbox]{--_checkbox-icon-size: 1.125rem;--_checkbox-bg: var(--form-choice-checkbox-unselected-default);--_checkbox-border: var(--form-choice-checkbox-unselected-border-default);--_checkbox-icon: var(--form-choice-checkbox-selected-indicator-default);--_checkbox-inset: 0 0 0 0 transparent;--_checkbox-ring: 0 0 0 0 transparent;position:relative;width:var(--form-checkbox-radio-size-responsive);min-width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--_checkbox-bg);border:var(--tedi-borders-01) solid var(--_checkbox-border);border-radius:var(--form-checkbox-radio-indicator-radius-checkbox);box-shadow:var(--_checkbox-inset),var(--_checkbox-ring)}@media(min-width:36rem){input[tedi-checkbox][type=checkbox]{--_checkbox-icon-size: 1rem}}input[tedi-checkbox][type=checkbox]:not(:disabled,:checked,:indeterminate):hover{--_checkbox-border: var(--form-choice-checkbox-unselected-border-hover);--_checkbox-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_checkbox-border)}input[tedi-checkbox][type=checkbox]:not(:disabled,:checked,:indeterminate):active{--_checkbox-border: var(--form-choice-checkbox-unselected-border-active);--_checkbox-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_checkbox-border)}input[tedi-checkbox][type=checkbox]:focus-visible:not(:disabled){--_checkbox-ring: 0 0 0 var(--tedi-borders-01) var(--general-effect-colors-focus-outset-inner-shadow), 0 0 0 var(--tedi-borders-03) var(--general-effect-colors-focus-outset-outer-shadow);outline:none}input[tedi-checkbox][type=checkbox]:focus-visible:not(:disabled,:checked,:indeterminate){--_checkbox-border: var(--form-choice-checkbox-unselected-border-focus)}input[tedi-checkbox][type=checkbox]:disabled:not(:checked,:indeterminate){--_checkbox-bg: var(--form-choice-checkbox-unselected-disabled);--_checkbox-border: var(--form-choice-checkbox-unselected-border-disabled);cursor:not-allowed}input[tedi-checkbox][type=checkbox]:checked,input[tedi-checkbox][type=checkbox]:indeterminate{--_checkbox-bg: var(--form-choice-checkbox-selected-default);--_checkbox-border: var(--form-choice-checkbox-selected-border-default)}input[tedi-checkbox][type=checkbox]:checked:not(:disabled):hover,input[tedi-checkbox][type=checkbox]:indeterminate:not(:disabled):hover{--_checkbox-bg: var(--form-choice-checkbox-selected-hover);--_checkbox-border: var(--form-choice-checkbox-selected-border-hover);--_checkbox-icon: var(--form-choice-checkbox-selected-indicator-hover)}input[tedi-checkbox][type=checkbox]:checked:not(:disabled):active,input[tedi-checkbox][type=checkbox]:indeterminate:not(:disabled):active{--_checkbox-bg: var(--form-choice-checkbox-selected-active);--_checkbox-border: var(--form-choice-checkbox-selected-border-active);--_checkbox-icon: var(--form-choice-checkbox-selected-indicator-active)}input[tedi-checkbox][type=checkbox]:checked:focus-visible:not(:disabled,:hover,:active),input[tedi-checkbox][type=checkbox]:indeterminate:focus-visible:not(:disabled,:hover,:active){--_checkbox-border: var(--form-choice-checkbox-selected-border-focus)}input[tedi-checkbox][type=checkbox]:checked:disabled,input[tedi-checkbox][type=checkbox]:indeterminate:disabled{--_checkbox-bg: var(--form-choice-checkbox-selected-disabled);--_checkbox-border: var(--form-choice-checkbox-selected-border-disabled);--_checkbox-icon: var(--form-choice-checkbox-selected-indicator-disabled);cursor:not-allowed}input[tedi-checkbox][type=checkbox]:checked:before,input[tedi-checkbox][type=checkbox]:indeterminate:before{position:absolute;top:50%;left:50%;font-family:Material Symbols Outlined,sans-serif;font-size:var(--_checkbox-icon-size);line-height:1;color:var(--_checkbox-icon);content:\"check\";transform:translate(-50%,-50%);-webkit-font-smoothing:antialiased}input[tedi-checkbox][type=checkbox]:checked:before{content:\"check\"}input[tedi-checkbox][type=checkbox]:indeterminate:before{content:\"remove\"}input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).tedi-checkbox--invalid,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled):user-invalid,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).ng-invalid.ng-touched{--_checkbox-border: var(--form-choice-checkbox-unselected-border-error)}input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).tedi-checkbox--invalid:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).tedi-checkbox--invalid:active,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled):user-invalid:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled):user-invalid:active,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).ng-invalid.ng-touched:hover,input[tedi-checkbox][type=checkbox]:not(:checked,:indeterminate,:disabled).ng-invalid.ng-touched:active{--_checkbox-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_checkbox-border)}input[tedi-checkbox][type=checkbox].tedi-checkbox--large{--_checkbox-icon-size: 1.125rem;width:var(--form-checkbox-radio-size-large);height:var(--form-checkbox-radio-size-large)}label:has(input[tedi-checkbox]:not(:disabled)){cursor:pointer}label:has(input[tedi-checkbox]:disabled){cursor:not-allowed}label:has(input[tedi-checkbox])+tedi-feedback-text{padding-left:var(--form-checkbox-radio-size-responsive);margin-left:var(--form-checkbox-radio-inner-spacing)}\n"] }]
         }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
-class DropdownItemValueComponent {
+class OptionContentComponent {
     /**
-     * Type of item value - controls selection indicator
+     * Type of option content - controls selection indicator
      * - 'default': No selection indicator
      * - 'checkbox': Shows checkbox (for multiselect)
      * - 'radio': Shows radio button (for single select listbox)
@@ -955,21 +955,21 @@ class DropdownItemValueComponent {
     onIndicatorClick(event) {
         event.preventDefault();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: DropdownItemValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: DropdownItemValueComponent, isStandalone: true, selector: "tedi-dropdown-item-value", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-dropdown-item-value--vertical": "layout() === 'vertical'", "class.tedi-dropdown-item-value--horizontal": "layout() === 'horizontal'", "class.tedi-dropdown-item-value--checkbox": "type() === 'checkbox'", "class.tedi-dropdown-item-value--radio": "type() === 'radio'" }, classAttribute: "tedi-dropdown-item-value" }, ngImport: i0, template: "@if (type() === \"checkbox\") {\n  <input\n    type=\"checkbox\"\n    tedi-checkbox\n    class=\"tedi-dropdown-item-value__checkbox\"\n    tabindex=\"-1\"\n    aria-hidden=\"true\"\n    [checked]=\"selected()\"\n    [indeterminate]=\"indeterminate()\"\n    [disabled]=\"disabled()\"\n    (click)=\"onIndicatorClick($event)\"\n  />\n} @else if (type() === \"radio\") {\n  <input\n    type=\"radio\"\n    class=\"tedi-dropdown-item-value__radio\"\n    tabindex=\"-1\"\n    aria-hidden=\"true\"\n    [checked]=\"selected()\"\n    [disabled]=\"disabled()\"\n    (click)=\"onIndicatorClick($event)\"\n  />\n}\n<ng-content select=\"tedi-icon, [tediIcon]\" />\n<div class=\"tedi-dropdown-item-value__content\">\n  <ng-content select=\"tedi-dropdown-item-value-label\" />\n  <ng-content select=\"tedi-dropdown-item-value-meta\" />\n</div>\n<ng-content />\n", styles: [".tedi-dropdown-item-value{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%}.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--radio{align-items:flex-start}.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--checkbox>input[tedi-checkbox][type=checkbox],.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--checkbox>input.tedi-dropdown-item-value__radio,.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--checkbox>.tedi-icon,.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--radio>input[tedi-checkbox][type=checkbox],.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--radio>input.tedi-dropdown-item-value__radio,.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--radio>.tedi-icon{margin-top:calc((var(--body-regular-line-height) - var(--form-checkbox-radio-size-responsive)) / 2)}.tedi-dropdown-item-value--radio{gap:var(--form-checkbox-radio-inner-spacing)}.tedi-dropdown-item-value__checkbox,.tedi-dropdown-item-value__radio{flex-shrink:0;pointer-events:none}.tedi-dropdown-item-value__radio{position:relative;width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--form-checkbox-radio-default-background-default);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-default-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}.tedi-dropdown-item-value__radio:checked{background-color:var(--form-checkbox-radio-default-background-default);border-color:var(--form-checkbox-radio-default-border-selected)}.tedi-dropdown-item-value__radio:checked:before{position:absolute;top:50%;left:50%;width:calc(var(--form-checkbox-radio-size-responsive) * .625);height:calc(var(--form-checkbox-radio-size-responsive) * .625);content:\"\";background:var(--form-checkbox-radio-default-border-selected);border-radius:50%;transform:translate(-50%,-50%)}.tedi-dropdown-item-value__radio:disabled{cursor:not-allowed;background-color:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}.tedi-dropdown-item-value__radio:disabled:checked{background-color:var(--form-checkbox-radio-default-background-default);border-color:var(--form-checkbox-radio-default-border-selected-disabled)}.tedi-dropdown-item-value__radio:disabled:checked:before{background:var(--form-checkbox-radio-default-border-selected-disabled)}.tedi-dropdown-item-value__content{display:flex;flex:1 0 0;min-width:0}.tedi-dropdown-item-value--horizontal .tedi-dropdown-item-value__content{flex-direction:row;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:space-between}.tedi-dropdown-item-value--vertical .tedi-dropdown-item-value__content{flex-direction:column;align-items:flex-start}.tedi-dropdown-item-value__label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--dropdown-item-default-text)}.tedi-dropdown-item-value__label--no-clip{overflow:visible}.tedi-dropdown-item-value__meta{flex-shrink:0;font-size:var(--body-small-regular-size);line-height:var(--body-small-regular-line-height);color:var(--general-text-tertiary)}.tedi-dropdown-item-value--vertical .tedi-dropdown-item-value__meta{flex-shrink:1}li[tedi-dropdown-item][aria-selected=true] .tedi-dropdown-item-value__label,li[tedi-dropdown-item][aria-selected=true] .tedi-dropdown-item-value__meta,li[tedi-dropdown-item].tedi-dropdown-item--selected .tedi-dropdown-item-value__label,li[tedi-dropdown-item].tedi-dropdown-item--selected .tedi-dropdown-item-value__meta,.tedi-dropdown-item[aria-selected=true] .tedi-dropdown-item-value__label,.tedi-dropdown-item[aria-selected=true] .tedi-dropdown-item-value__meta,.tedi-dropdown-item.tedi-dropdown-item--selected .tedi-dropdown-item-value__label,.tedi-dropdown-item.tedi-dropdown-item--selected .tedi-dropdown-item-value__meta{color:inherit}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__label,li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__meta,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__label,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__meta{color:inherit}li[tedi-dropdown-item][aria-disabled=true] .tedi-dropdown-item-value__label,li[tedi-dropdown-item][aria-disabled=true] .tedi-dropdown-item-value__meta,li[tedi-dropdown-item].tedi-dropdown-item--disabled .tedi-dropdown-item-value__label,li[tedi-dropdown-item].tedi-dropdown-item--disabled .tedi-dropdown-item-value__meta,.tedi-dropdown-item[aria-disabled=true] .tedi-dropdown-item-value__label,.tedi-dropdown-item[aria-disabled=true] .tedi-dropdown-item-value__meta,.tedi-dropdown-item.tedi-dropdown-item--disabled .tedi-dropdown-item-value__label,.tedi-dropdown-item.tedi-dropdown-item--disabled .tedi-dropdown-item-value__meta{color:inherit}li[tedi-dropdown-item]:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio)[aria-selected=true],li[tedi-dropdown-item]:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio).tedi-dropdown-item--selected,.tedi-dropdown-item:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio)[aria-selected=true],.tedi-dropdown-item:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio).tedi-dropdown-item--selected{color:var(--dropdown-item-default-text);background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio)[aria-selected=true]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),li[tedi-dropdown-item]:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio).tedi-dropdown-item--selected:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),.tedi-dropdown-item:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio)[aria-selected=true]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),.tedi-dropdown-item:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio).tedi-dropdown-item--selected:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__radio,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__radio{background-color:var(--form-checkbox-radio-default-background-hover);border-color:var(--form-checkbox-radio-default-border-hover);border-width:var(--tedi-borders-02)}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "input[type=checkbox][tedi-checkbox]", inputs: ["size", "invalid", "value", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: OptionContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: OptionContentComponent, isStandalone: true, selector: "tedi-option-content", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-option-content--vertical": "layout() === 'vertical'", "class.tedi-option-content--horizontal": "layout() === 'horizontal'", "class.tedi-option-content--checkbox": "type() === 'checkbox'", "class.tedi-option-content--radio": "type() === 'radio'" }, classAttribute: "tedi-option-content" }, ngImport: i0, template: "@if (type() === \"checkbox\") {\n  <input\n    type=\"checkbox\"\n    tedi-checkbox\n    class=\"tedi-option-content__checkbox\"\n    tabindex=\"-1\"\n    aria-hidden=\"true\"\n    [checked]=\"selected()\"\n    [indeterminate]=\"indeterminate()\"\n    [disabled]=\"disabled()\"\n    (click)=\"onIndicatorClick($event)\"\n  />\n} @else if (type() === \"radio\") {\n  <input\n    type=\"radio\"\n    class=\"tedi-option-content__radio\"\n    tabindex=\"-1\"\n    aria-hidden=\"true\"\n    [checked]=\"selected()\"\n    [disabled]=\"disabled()\"\n    (click)=\"onIndicatorClick($event)\"\n  />\n}\n<ng-content select=\"tedi-icon, [tediIcon]\" />\n<div class=\"tedi-option-content__content\">\n  <ng-content select=\"tedi-option-content-label\" />\n  <ng-content select=\"tedi-option-content-meta\" />\n</div>\n<ng-content />\n", styles: [".tedi-option-content{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%}.tedi-option-content--vertical.tedi-option-content--checkbox,.tedi-option-content--vertical.tedi-option-content--radio{align-items:flex-start}.tedi-option-content--vertical.tedi-option-content--checkbox>input[tedi-checkbox][type=checkbox],.tedi-option-content--vertical.tedi-option-content--checkbox>input.tedi-option-content__radio,.tedi-option-content--vertical.tedi-option-content--checkbox>.tedi-icon,.tedi-option-content--vertical.tedi-option-content--radio>input[tedi-checkbox][type=checkbox],.tedi-option-content--vertical.tedi-option-content--radio>input.tedi-option-content__radio,.tedi-option-content--vertical.tedi-option-content--radio>.tedi-icon{margin-top:calc((var(--body-regular-line-height) - var(--form-checkbox-radio-size-responsive)) / 2)}.tedi-option-content--radio{gap:var(--form-checkbox-radio-inner-spacing)}.tedi-option-content__checkbox,.tedi-option-content__radio{flex-shrink:0;pointer-events:none}.tedi-option-content__radio{position:relative;width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--form-choice-radio-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-radio-unselected-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}.tedi-option-content__radio:checked{background-color:var(--form-choice-radio-selected-background-default);border-color:var(--form-choice-radio-selected-border-default)}.tedi-option-content__radio:checked:before{position:absolute;top:50%;left:50%;width:calc(var(--form-checkbox-radio-size-responsive) * .625);height:calc(var(--form-checkbox-radio-size-responsive) * .625);content:\"\";background:var(--form-choice-radio-selected-indicator-default);border-radius:50%;transform:translate(-50%,-50%)}.tedi-option-content__radio:disabled{cursor:not-allowed;background-color:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}.tedi-option-content__radio:disabled:checked{background-color:var(--form-choice-radio-selected-background-default);border-color:var(--form-choice-radio-selected-border-disabled)}.tedi-option-content__radio:disabled:checked:before{background:var(--form-choice-radio-selected-indicator-disabled)}.tedi-option-content__content{display:flex;flex:1 0 0;min-width:0}.tedi-option-content--horizontal .tedi-option-content__content{flex-direction:row;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:space-between}.tedi-option-content--vertical .tedi-option-content__content{flex-direction:column;align-items:flex-start}.tedi-option-content__label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--dropdown-item-default-text)}.tedi-option-content__label--no-clip{overflow:visible}.tedi-option-content__meta{flex-shrink:0;font-size:var(--body-small-regular-size);line-height:var(--body-small-regular-line-height);color:var(--general-text-tertiary)}.tedi-option-content--vertical .tedi-option-content__meta{flex-shrink:1}li[tedi-dropdown-item][aria-selected=true] .tedi-option-content__label,li[tedi-dropdown-item][aria-selected=true] .tedi-option-content__meta,li[tedi-dropdown-item].tedi-dropdown-item--selected .tedi-option-content__label,li[tedi-dropdown-item].tedi-dropdown-item--selected .tedi-option-content__meta,.tedi-dropdown-item[aria-selected=true] .tedi-option-content__label,.tedi-dropdown-item[aria-selected=true] .tedi-option-content__meta,.tedi-dropdown-item.tedi-dropdown-item--selected .tedi-option-content__label,.tedi-dropdown-item.tedi-dropdown-item--selected .tedi-option-content__meta{color:inherit}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__label,li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__meta,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__label,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__meta{color:inherit}li[tedi-dropdown-item][aria-disabled=true] .tedi-option-content__label,li[tedi-dropdown-item][aria-disabled=true] .tedi-option-content__meta,li[tedi-dropdown-item].tedi-dropdown-item--disabled .tedi-option-content__label,li[tedi-dropdown-item].tedi-dropdown-item--disabled .tedi-option-content__meta,.tedi-dropdown-item[aria-disabled=true] .tedi-option-content__label,.tedi-dropdown-item[aria-disabled=true] .tedi-option-content__meta,.tedi-dropdown-item.tedi-dropdown-item--disabled .tedi-option-content__label,.tedi-dropdown-item.tedi-dropdown-item--disabled .tedi-option-content__meta{color:inherit}li[tedi-dropdown-item]:has(.tedi-option-content--checkbox,.tedi-option-content--radio)[aria-selected=true],li[tedi-dropdown-item]:has(.tedi-option-content--checkbox,.tedi-option-content--radio).tedi-dropdown-item--selected,.tedi-dropdown-item:has(.tedi-option-content--checkbox,.tedi-option-content--radio)[aria-selected=true],.tedi-dropdown-item:has(.tedi-option-content--checkbox,.tedi-option-content--radio).tedi-dropdown-item--selected{color:var(--dropdown-item-default-text);background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:has(.tedi-option-content--checkbox,.tedi-option-content--radio)[aria-selected=true]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),li[tedi-dropdown-item]:has(.tedi-option-content--checkbox,.tedi-option-content--radio).tedi-dropdown-item--selected:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),.tedi-dropdown-item:has(.tedi-option-content--checkbox,.tedi-option-content--radio)[aria-selected=true]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),.tedi-dropdown-item:has(.tedi-option-content--checkbox,.tedi-option-content--radio).tedi-dropdown-item--selected:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio{border-width:var(--tedi-borders-02)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:not(:checked),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:not(:checked){background-color:var(--form-choice-radio-unselected-background-default);border-color:var(--form-choice-radio-unselected-border-hover)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:checked,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:checked{border-color:var(--form-choice-radio-selected-border-hover)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:checked:before,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:checked:before{background:var(--form-choice-radio-selected-indicator-hover)}\n"], dependencies: [{ kind: "component", type: CheckboxComponent, selector: "input[type=checkbox][tedi-checkbox]", inputs: ["size", "invalid", "value", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: DropdownItemValueComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: OptionContentComponent, decorators: [{
             type: Component,
-            args: [{ selector: "tedi-dropdown-item-value", standalone: true, imports: [CheckboxComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
-                        class: "tedi-dropdown-item-value",
-                        "[class.tedi-dropdown-item-value--vertical]": "layout() === 'vertical'",
-                        "[class.tedi-dropdown-item-value--horizontal]": "layout() === 'horizontal'",
-                        "[class.tedi-dropdown-item-value--checkbox]": "type() === 'checkbox'",
-                        "[class.tedi-dropdown-item-value--radio]": "type() === 'radio'",
-                    }, template: "@if (type() === \"checkbox\") {\n  <input\n    type=\"checkbox\"\n    tedi-checkbox\n    class=\"tedi-dropdown-item-value__checkbox\"\n    tabindex=\"-1\"\n    aria-hidden=\"true\"\n    [checked]=\"selected()\"\n    [indeterminate]=\"indeterminate()\"\n    [disabled]=\"disabled()\"\n    (click)=\"onIndicatorClick($event)\"\n  />\n} @else if (type() === \"radio\") {\n  <input\n    type=\"radio\"\n    class=\"tedi-dropdown-item-value__radio\"\n    tabindex=\"-1\"\n    aria-hidden=\"true\"\n    [checked]=\"selected()\"\n    [disabled]=\"disabled()\"\n    (click)=\"onIndicatorClick($event)\"\n  />\n}\n<ng-content select=\"tedi-icon, [tediIcon]\" />\n<div class=\"tedi-dropdown-item-value__content\">\n  <ng-content select=\"tedi-dropdown-item-value-label\" />\n  <ng-content select=\"tedi-dropdown-item-value-meta\" />\n</div>\n<ng-content />\n", styles: [".tedi-dropdown-item-value{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%}.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--radio{align-items:flex-start}.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--checkbox>input[tedi-checkbox][type=checkbox],.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--checkbox>input.tedi-dropdown-item-value__radio,.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--checkbox>.tedi-icon,.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--radio>input[tedi-checkbox][type=checkbox],.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--radio>input.tedi-dropdown-item-value__radio,.tedi-dropdown-item-value--vertical.tedi-dropdown-item-value--radio>.tedi-icon{margin-top:calc((var(--body-regular-line-height) - var(--form-checkbox-radio-size-responsive)) / 2)}.tedi-dropdown-item-value--radio{gap:var(--form-checkbox-radio-inner-spacing)}.tedi-dropdown-item-value__checkbox,.tedi-dropdown-item-value__radio{flex-shrink:0;pointer-events:none}.tedi-dropdown-item-value__radio{position:relative;width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--form-checkbox-radio-default-background-default);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-default-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}.tedi-dropdown-item-value__radio:checked{background-color:var(--form-checkbox-radio-default-background-default);border-color:var(--form-checkbox-radio-default-border-selected)}.tedi-dropdown-item-value__radio:checked:before{position:absolute;top:50%;left:50%;width:calc(var(--form-checkbox-radio-size-responsive) * .625);height:calc(var(--form-checkbox-radio-size-responsive) * .625);content:\"\";background:var(--form-checkbox-radio-default-border-selected);border-radius:50%;transform:translate(-50%,-50%)}.tedi-dropdown-item-value__radio:disabled{cursor:not-allowed;background-color:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}.tedi-dropdown-item-value__radio:disabled:checked{background-color:var(--form-checkbox-radio-default-background-default);border-color:var(--form-checkbox-radio-default-border-selected-disabled)}.tedi-dropdown-item-value__radio:disabled:checked:before{background:var(--form-checkbox-radio-default-border-selected-disabled)}.tedi-dropdown-item-value__content{display:flex;flex:1 0 0;min-width:0}.tedi-dropdown-item-value--horizontal .tedi-dropdown-item-value__content{flex-direction:row;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:space-between}.tedi-dropdown-item-value--vertical .tedi-dropdown-item-value__content{flex-direction:column;align-items:flex-start}.tedi-dropdown-item-value__label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--dropdown-item-default-text)}.tedi-dropdown-item-value__label--no-clip{overflow:visible}.tedi-dropdown-item-value__meta{flex-shrink:0;font-size:var(--body-small-regular-size);line-height:var(--body-small-regular-line-height);color:var(--general-text-tertiary)}.tedi-dropdown-item-value--vertical .tedi-dropdown-item-value__meta{flex-shrink:1}li[tedi-dropdown-item][aria-selected=true] .tedi-dropdown-item-value__label,li[tedi-dropdown-item][aria-selected=true] .tedi-dropdown-item-value__meta,li[tedi-dropdown-item].tedi-dropdown-item--selected .tedi-dropdown-item-value__label,li[tedi-dropdown-item].tedi-dropdown-item--selected .tedi-dropdown-item-value__meta,.tedi-dropdown-item[aria-selected=true] .tedi-dropdown-item-value__label,.tedi-dropdown-item[aria-selected=true] .tedi-dropdown-item-value__meta,.tedi-dropdown-item.tedi-dropdown-item--selected .tedi-dropdown-item-value__label,.tedi-dropdown-item.tedi-dropdown-item--selected .tedi-dropdown-item-value__meta{color:inherit}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__label,li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__meta,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__label,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__meta{color:inherit}li[tedi-dropdown-item][aria-disabled=true] .tedi-dropdown-item-value__label,li[tedi-dropdown-item][aria-disabled=true] .tedi-dropdown-item-value__meta,li[tedi-dropdown-item].tedi-dropdown-item--disabled .tedi-dropdown-item-value__label,li[tedi-dropdown-item].tedi-dropdown-item--disabled .tedi-dropdown-item-value__meta,.tedi-dropdown-item[aria-disabled=true] .tedi-dropdown-item-value__label,.tedi-dropdown-item[aria-disabled=true] .tedi-dropdown-item-value__meta,.tedi-dropdown-item.tedi-dropdown-item--disabled .tedi-dropdown-item-value__label,.tedi-dropdown-item.tedi-dropdown-item--disabled .tedi-dropdown-item-value__meta{color:inherit}li[tedi-dropdown-item]:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio)[aria-selected=true],li[tedi-dropdown-item]:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio).tedi-dropdown-item--selected,.tedi-dropdown-item:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio)[aria-selected=true],.tedi-dropdown-item:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio).tedi-dropdown-item--selected{color:var(--dropdown-item-default-text);background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio)[aria-selected=true]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),li[tedi-dropdown-item]:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio).tedi-dropdown-item--selected:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),.tedi-dropdown-item:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio)[aria-selected=true]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),.tedi-dropdown-item:has(.tedi-dropdown-item-value--checkbox,.tedi-dropdown-item-value--radio).tedi-dropdown-item--selected:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__radio,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-dropdown-item-value__radio{background-color:var(--form-checkbox-radio-default-background-hover);border-color:var(--form-checkbox-radio-default-border-hover);border-width:var(--tedi-borders-02)}\n"] }]
+            args: [{ selector: "tedi-option-content", standalone: true, imports: [CheckboxComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        class: "tedi-option-content",
+                        "[class.tedi-option-content--vertical]": "layout() === 'vertical'",
+                        "[class.tedi-option-content--horizontal]": "layout() === 'horizontal'",
+                        "[class.tedi-option-content--checkbox]": "type() === 'checkbox'",
+                        "[class.tedi-option-content--radio]": "type() === 'radio'",
+                    }, template: "@if (type() === \"checkbox\") {\n  <input\n    type=\"checkbox\"\n    tedi-checkbox\n    class=\"tedi-option-content__checkbox\"\n    tabindex=\"-1\"\n    aria-hidden=\"true\"\n    [checked]=\"selected()\"\n    [indeterminate]=\"indeterminate()\"\n    [disabled]=\"disabled()\"\n    (click)=\"onIndicatorClick($event)\"\n  />\n} @else if (type() === \"radio\") {\n  <input\n    type=\"radio\"\n    class=\"tedi-option-content__radio\"\n    tabindex=\"-1\"\n    aria-hidden=\"true\"\n    [checked]=\"selected()\"\n    [disabled]=\"disabled()\"\n    (click)=\"onIndicatorClick($event)\"\n  />\n}\n<ng-content select=\"tedi-icon, [tediIcon]\" />\n<div class=\"tedi-option-content__content\">\n  <ng-content select=\"tedi-option-content-label\" />\n  <ng-content select=\"tedi-option-content-meta\" />\n</div>\n<ng-content />\n", styles: [".tedi-option-content{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%}.tedi-option-content--vertical.tedi-option-content--checkbox,.tedi-option-content--vertical.tedi-option-content--radio{align-items:flex-start}.tedi-option-content--vertical.tedi-option-content--checkbox>input[tedi-checkbox][type=checkbox],.tedi-option-content--vertical.tedi-option-content--checkbox>input.tedi-option-content__radio,.tedi-option-content--vertical.tedi-option-content--checkbox>.tedi-icon,.tedi-option-content--vertical.tedi-option-content--radio>input[tedi-checkbox][type=checkbox],.tedi-option-content--vertical.tedi-option-content--radio>input.tedi-option-content__radio,.tedi-option-content--vertical.tedi-option-content--radio>.tedi-icon{margin-top:calc((var(--body-regular-line-height) - var(--form-checkbox-radio-size-responsive)) / 2)}.tedi-option-content--radio{gap:var(--form-checkbox-radio-inner-spacing)}.tedi-option-content__checkbox,.tedi-option-content__radio{flex-shrink:0;pointer-events:none}.tedi-option-content__radio{position:relative;width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--form-choice-radio-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-radio-unselected-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}.tedi-option-content__radio:checked{background-color:var(--form-choice-radio-selected-background-default);border-color:var(--form-choice-radio-selected-border-default)}.tedi-option-content__radio:checked:before{position:absolute;top:50%;left:50%;width:calc(var(--form-checkbox-radio-size-responsive) * .625);height:calc(var(--form-checkbox-radio-size-responsive) * .625);content:\"\";background:var(--form-choice-radio-selected-indicator-default);border-radius:50%;transform:translate(-50%,-50%)}.tedi-option-content__radio:disabled{cursor:not-allowed;background-color:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}.tedi-option-content__radio:disabled:checked{background-color:var(--form-choice-radio-selected-background-default);border-color:var(--form-choice-radio-selected-border-disabled)}.tedi-option-content__radio:disabled:checked:before{background:var(--form-choice-radio-selected-indicator-disabled)}.tedi-option-content__content{display:flex;flex:1 0 0;min-width:0}.tedi-option-content--horizontal .tedi-option-content__content{flex-direction:row;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:space-between}.tedi-option-content--vertical .tedi-option-content__content{flex-direction:column;align-items:flex-start}.tedi-option-content__label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--dropdown-item-default-text)}.tedi-option-content__label--no-clip{overflow:visible}.tedi-option-content__meta{flex-shrink:0;font-size:var(--body-small-regular-size);line-height:var(--body-small-regular-line-height);color:var(--general-text-tertiary)}.tedi-option-content--vertical .tedi-option-content__meta{flex-shrink:1}li[tedi-dropdown-item][aria-selected=true] .tedi-option-content__label,li[tedi-dropdown-item][aria-selected=true] .tedi-option-content__meta,li[tedi-dropdown-item].tedi-dropdown-item--selected .tedi-option-content__label,li[tedi-dropdown-item].tedi-dropdown-item--selected .tedi-option-content__meta,.tedi-dropdown-item[aria-selected=true] .tedi-option-content__label,.tedi-dropdown-item[aria-selected=true] .tedi-option-content__meta,.tedi-dropdown-item.tedi-dropdown-item--selected .tedi-option-content__label,.tedi-dropdown-item.tedi-dropdown-item--selected .tedi-option-content__meta{color:inherit}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__label,li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__meta,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__label,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__meta{color:inherit}li[tedi-dropdown-item][aria-disabled=true] .tedi-option-content__label,li[tedi-dropdown-item][aria-disabled=true] .tedi-option-content__meta,li[tedi-dropdown-item].tedi-dropdown-item--disabled .tedi-option-content__label,li[tedi-dropdown-item].tedi-dropdown-item--disabled .tedi-option-content__meta,.tedi-dropdown-item[aria-disabled=true] .tedi-option-content__label,.tedi-dropdown-item[aria-disabled=true] .tedi-option-content__meta,.tedi-dropdown-item.tedi-dropdown-item--disabled .tedi-option-content__label,.tedi-dropdown-item.tedi-dropdown-item--disabled .tedi-option-content__meta{color:inherit}li[tedi-dropdown-item]:has(.tedi-option-content--checkbox,.tedi-option-content--radio)[aria-selected=true],li[tedi-dropdown-item]:has(.tedi-option-content--checkbox,.tedi-option-content--radio).tedi-dropdown-item--selected,.tedi-dropdown-item:has(.tedi-option-content--checkbox,.tedi-option-content--radio)[aria-selected=true],.tedi-dropdown-item:has(.tedi-option-content--checkbox,.tedi-option-content--radio).tedi-dropdown-item--selected{color:var(--dropdown-item-default-text);background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:has(.tedi-option-content--checkbox,.tedi-option-content--radio)[aria-selected=true]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),li[tedi-dropdown-item]:has(.tedi-option-content--checkbox,.tedi-option-content--radio).tedi-dropdown-item--selected:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),.tedi-dropdown-item:has(.tedi-option-content--checkbox,.tedi-option-content--radio)[aria-selected=true]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]),.tedi-dropdown-item:has(.tedi-option-content--checkbox,.tedi-option-content--radio).tedi-dropdown-item--selected:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio{border-width:var(--tedi-borders-02)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:not(:checked),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:not(:checked){background-color:var(--form-choice-radio-unselected-background-default);border-color:var(--form-choice-radio-unselected-border-hover)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:checked,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:checked{border-color:var(--form-choice-radio-selected-border-hover)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:checked:before,.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true]) .tedi-option-content__radio:checked:before{background:var(--form-choice-radio-selected-indicator-hover)}\n"] }]
         }], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
-class DropdownItemValueLabelComponent {
+class OptionContentLabelComponent {
     /**
      * Whether the label clips overflowing content for text ellipsis. Set `false`
      * when the label holds content with decorations that intentionally sit
@@ -977,20 +977,20 @@ class DropdownItemValueLabelComponent {
      * @default true
      */
     clipContent = input(true, ...(ngDevMode ? [{ debugName: "clipContent" }] : []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: DropdownItemValueLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: DropdownItemValueLabelComponent, isStandalone: true, selector: "tedi-dropdown-item-value-label", inputs: { clipContent: { classPropertyName: "clipContent", publicName: "clipContent", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-dropdown-item-value__label--no-clip": "!clipContent()" }, classAttribute: "tedi-dropdown-item-value__label" }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: OptionContentLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: OptionContentLabelComponent, isStandalone: true, selector: "tedi-option-content-label", inputs: { clipContent: { classPropertyName: "clipContent", publicName: "clipContent", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-option-content__label--no-clip": "!clipContent()" }, classAttribute: "tedi-option-content__label" }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: DropdownItemValueLabelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: OptionContentLabelComponent, decorators: [{
             type: Component,
             args: [{
-                    selector: "tedi-dropdown-item-value-label",
+                    selector: "tedi-option-content-label",
                     template: `<ng-content />`,
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     encapsulation: ViewEncapsulation.None,
                     host: {
-                        class: "tedi-dropdown-item-value__label",
-                        "[class.tedi-dropdown-item-value__label--no-clip]": "!clipContent()",
+                        class: "tedi-option-content__label",
+                        "[class.tedi-option-content__label--no-clip]": "!clipContent()",
                     },
                 }]
         }], propDecorators: { clipContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "clipContent", required: false }] }] } });
@@ -1038,8 +1038,8 @@ class DropdownItemComponent {
     host = inject(ElementRef);
     dropdown = inject(DROPDOWN_API);
     dropdownContent = inject(DROPDOWN_CONTENT_API);
-    /** Check if custom dropdown-item-value is provided */
-    customItemValue = contentChild(DropdownItemValueComponent, ...(ngDevMode ? [{ debugName: "customItemValue" }] : []));
+    /** Check if custom option content is provided */
+    customOptionContent = contentChild(OptionContentComponent, ...(ngDevMode ? [{ debugName: "customOptionContent" }] : []));
     renderer = inject(Renderer2);
     destroyRef = inject(DestroyRef);
     control = null;
@@ -1242,17 +1242,17 @@ class DropdownItemComponent {
         this.dropdown.dropdownTrigger()?.focus();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: DropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: DropdownItemComponent, isStandalone: true, selector: "li[tedi-dropdown-item]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, interactiveContent: { classPropertyName: "interactiveContent", publicName: "interactiveContent", isSignal: true, isRequired: false, transformFunction: null }, clipContent: { classPropertyName: "clipContent", publicName: "clipContent", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelect: "itemSelect" }, host: { listeners: { "click": "onClick()", "mousedown": "onMousedown($event)", "keydown": "onKeydown($event)" }, properties: { "attr.role": "hostRole()", "attr.aria-selected": "hostAriaSelected()", "attr.aria-disabled": "hostAriaDisabled()", "attr.tabindex": "hostTabindex()" } }, queries: [{ propertyName: "customItemValue", first: true, predicate: DropdownItemValueComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"tedi-dropdown-item-value\" />\n\n@if (!customItemValue()) {\n  <tedi-dropdown-item-value>\n    <tedi-dropdown-item-value-label [clipContent]=\"clipContent()\">\n      <ng-content />\n    </tedi-dropdown-item-value-label>\n  </tedi-dropdown-item-value>\n}\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}\n"], dependencies: [{ kind: "component", type: DropdownItemValueComponent, selector: "tedi-dropdown-item-value", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: DropdownItemValueLabelComponent, selector: "tedi-dropdown-item-value-label", inputs: ["clipContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: DropdownItemComponent, isStandalone: true, selector: "li[tedi-dropdown-item]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, interactiveContent: { classPropertyName: "interactiveContent", publicName: "interactiveContent", isSignal: true, isRequired: false, transformFunction: null }, clipContent: { classPropertyName: "clipContent", publicName: "clipContent", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelect: "itemSelect" }, host: { listeners: { "click": "onClick()", "mousedown": "onMousedown($event)", "keydown": "onKeydown($event)" }, properties: { "attr.role": "hostRole()", "attr.aria-selected": "hostAriaSelected()", "attr.aria-disabled": "hostAriaDisabled()", "attr.tabindex": "hostTabindex()" } }, queries: [{ propertyName: "customOptionContent", first: true, predicate: OptionContentComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"tedi-option-content\" />\n\n@if (!customOptionContent()) {\n  <tedi-option-content>\n    <tedi-option-content-label [clipContent]=\"clipContent()\">\n      <ng-content />\n    </tedi-option-content-label>\n  </tedi-option-content>\n}\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}\n"], dependencies: [{ kind: "component", type: OptionContentComponent, selector: "tedi-option-content", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: OptionContentLabelComponent, selector: "tedi-option-content-label", inputs: ["clipContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: DropdownItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: "li[tedi-dropdown-item]", standalone: true, imports: [DropdownItemValueComponent, DropdownItemValueLabelComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+            args: [{ selector: "li[tedi-dropdown-item]", standalone: true, imports: [OptionContentComponent, OptionContentLabelComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         "[attr.role]": "hostRole()",
                         "[attr.aria-selected]": "hostAriaSelected()",
                         "[attr.aria-disabled]": "hostAriaDisabled()",
                         "[attr.tabindex]": "hostTabindex()",
-                    }, template: "<ng-content select=\"tedi-dropdown-item-value\" />\n\n@if (!customItemValue()) {\n  <tedi-dropdown-item-value>\n    <tedi-dropdown-item-value-label [clipContent]=\"clipContent()\">\n      <ng-content />\n    </tedi-dropdown-item-value-label>\n  </tedi-dropdown-item-value>\n}\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], interactiveContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactiveContent", required: false }] }], clipContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "clipContent", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], itemSelect: [{ type: i0.Output, args: ["itemSelect"] }], customItemValue: [{ type: i0.ContentChild, args: [i0.forwardRef(() => DropdownItemValueComponent), { isSignal: true }] }], onClick: [{
+                    }, template: "<ng-content select=\"tedi-option-content\" />\n\n@if (!customOptionContent()) {\n  <tedi-option-content>\n    <tedi-option-content-label [clipContent]=\"clipContent()\">\n      <ng-content />\n    </tedi-option-content-label>\n  </tedi-option-content>\n}\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], interactiveContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactiveContent", required: false }] }], clipContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "clipContent", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], itemSelect: [{ type: i0.Output, args: ["itemSelect"] }], customOptionContent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => OptionContentComponent), { isSignal: true }] }], onClick: [{
                 type: HostListener,
                 args: ["click"]
             }], onMousedown: [{
@@ -3723,7 +3723,7 @@ class ButtonGroupComponent {
         this.toggle(item.value());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: ButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: ButtonGroupComponent, isStandalone: true, selector: "tedi-button-group", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, stretch: { classPropertyName: "stretch", publicName: "stretch", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, enableMobileDropdown: { classPropertyName: "enableMobileDropdown", publicName: "enableMobileDropdown", isSignal: true, isRequired: false, transformFunction: null }, mobileBreakpoint: { classPropertyName: "mobileBreakpoint", publicName: "mobileBreakpoint", isSignal: true, isRequired: false, transformFunction: null }, dropdownLabel: { classPropertyName: "dropdownLabel", publicName: "dropdownLabel", isSignal: true, isRequired: false, transformFunction: null }, dropdownLabelMode: { classPropertyName: "dropdownLabelMode", publicName: "dropdownLabelMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", selectionChange: "selectionChange" }, host: { properties: { "class": "hostClasses()", "attr.role": "isDropdownMode() ? null : 'group'", "attr.aria-label": "ariaLabel() || null" } }, queries: [{ propertyName: "items", predicate: i0.forwardRef(() => ButtonGroupButtonDirective), isSignal: true }], ngImport: i0, template: "<ng-content />\n\n@if (isDropdownMode()) {\n  <tedi-dropdown\n    class=\"tedi-button-group__dropdown\"\n    appendTo=\"body\"\n    [offset]=\"0\"\n  >\n    <button\n      tedi-dropdown-trigger\n      tedi-button\n      type=\"button\"\n      [variant]=\"triggerVariant()\"\n      [attr.aria-label]=\"ariaLabel() || null\"\n      class=\"tedi-button-group__dropdown-trigger\"\n    >\n      <tedi-icon [name]=\"triggerIcon()\" color=\"inherit\" [size]=\"18\" />\n      {{ triggerLabel() }}\n    </button>\n\n    <tedi-dropdown-content>\n      @for (item of items(); track item.value()) {\n        <li\n          tedi-dropdown-item\n          [value]=\"item.value()\"\n          [disabled]=\"item.disabled()\"\n          [class.tedi-dropdown-item--selected]=\"item.selected()\"\n          (itemSelect)=\"onDropdownItemSelect(item)\"\n        >\n          <tedi-dropdown-item-value>\n            @if (item.iconLeft()) {\n              <tedi-icon\n                [name]=\"item.iconLeft()!\"\n                color=\"inherit\"\n                [size]=\"18\"\n              />\n            } @else if (item.icon()) {\n              <tedi-icon [name]=\"item.icon()!\" color=\"inherit\" [size]=\"18\" />\n            }\n            <tedi-dropdown-item-value-label>{{\n              item.label()\n            }}</tedi-dropdown-item-value-label>\n            @if (item.iconRight()) {\n              <tedi-icon\n                [name]=\"item.iconRight()!\"\n                color=\"inherit\"\n                [size]=\"18\"\n              />\n            }\n          </tedi-dropdown-item-value>\n        </li>\n      }\n    </tedi-dropdown-content>\n  </tedi-dropdown>\n}\n", styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-inactive-text);--_btn-bg: var(--button-group-primary-inactive-background);--_btn-border: var(--button-group-primary-inactive-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-inactive-text);--_btn-focus-bg: var(--button-group-primary-inactive-background);--_btn-focus-border: var(--button-group-primary-inactive-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-inactive-text);--_btn-bg: var(--button-group-secondary-inactive-background);--_btn-border: var(--button-group-secondary-inactive-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-inactive-text);--_btn-focus-bg: var(--button-group-secondary-inactive-background);--_btn-focus-border: var(--button-group-secondary-inactive-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}.tedi-button-group{display:flex}.tedi-button-group--stretch .tedi-button{flex:1}.tedi-button-group .tedi-button:focus-visible{z-index:2}.tedi-button-group .tedi-button[aria-pressed=true]{z-index:1}.tedi-button-group .tedi-button[aria-pressed=true]:not(:disabled){color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group>.tedi-button:not(:first-child){margin-left:calc(var(--tedi-borders-01) * -1);border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group>.tedi-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.tedi-button-group tedi-tooltip:not(:first-child) tedi-tooltip-trigger{margin-left:calc(var(--tedi-borders-01) * -1)}.tedi-button-group tedi-tooltip:not(:first-child) .tedi-button{border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group tedi-tooltip:not(:last-child) .tedi-button{border-top-right-radius:0;border-bottom-right-radius:0}@media(max-width:47.98rem){.tedi-button-group .tedi-button{flex:1}}.tedi-button-group--dropdown-mode>.tedi-button,.tedi-button-group--dropdown-mode>tedi-tooltip{display:none}.tedi-button-group__dropdown{display:flex;flex:1 1 auto}.tedi-button-group__dropdown-trigger{flex:1}.tedi-button-group__dropdown-trigger[aria-expanded=true]{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger{border-radius:var(--button-radius-sm)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary{padding:calc(var(--_btn-padding-y) - var(--tedi-borders-02)) calc(var(--_btn-padding-x) - var(--tedi-borders-02));border-width:var(--tedi-borders-02)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary:not([aria-expanded=true]){border-color:var(--button-group-secondary-selected-border)}.tedi-button.tedi-button-group-button{gap:0}.tedi-button-group-button__label{padding-inline:var(--_btn-inner-spacing)}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: DropdownComponent, selector: "tedi-dropdown", inputs: ["value", "position", "preventOverflow", "offset", "hideOnScroll"], outputs: ["valueChange"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[tedi-dropdown-trigger]", inputs: ["ariaHaspopup"] }, { kind: "component", type: DropdownContentComponent, selector: "tedi-dropdown-content", inputs: ["dropdownRole"] }, { kind: "component", type: DropdownItemComponent, selector: "li[tedi-dropdown-item]", inputs: ["value", "disabled", "interactiveContent", "clipContent", "closeOnSelect"], outputs: ["itemSelect"] }, { kind: "component", type: DropdownItemValueComponent, selector: "tedi-dropdown-item-value", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: DropdownItemValueLabelComponent, selector: "tedi-dropdown-item-value-label", inputs: ["clipContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: ButtonGroupComponent, isStandalone: true, selector: "tedi-button-group", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, stretch: { classPropertyName: "stretch", publicName: "stretch", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, enableMobileDropdown: { classPropertyName: "enableMobileDropdown", publicName: "enableMobileDropdown", isSignal: true, isRequired: false, transformFunction: null }, mobileBreakpoint: { classPropertyName: "mobileBreakpoint", publicName: "mobileBreakpoint", isSignal: true, isRequired: false, transformFunction: null }, dropdownLabel: { classPropertyName: "dropdownLabel", publicName: "dropdownLabel", isSignal: true, isRequired: false, transformFunction: null }, dropdownLabelMode: { classPropertyName: "dropdownLabelMode", publicName: "dropdownLabelMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", selectionChange: "selectionChange" }, host: { properties: { "class": "hostClasses()", "attr.role": "isDropdownMode() ? null : 'group'", "attr.aria-label": "ariaLabel() || null" } }, queries: [{ propertyName: "items", predicate: i0.forwardRef(() => ButtonGroupButtonDirective), isSignal: true }], ngImport: i0, template: "<ng-content />\n\n@if (isDropdownMode()) {\n  <tedi-dropdown\n    class=\"tedi-button-group__dropdown\"\n    appendTo=\"body\"\n    [offset]=\"0\"\n  >\n    <button\n      tedi-dropdown-trigger\n      tedi-button\n      type=\"button\"\n      [variant]=\"triggerVariant()\"\n      [attr.aria-label]=\"ariaLabel() || null\"\n      class=\"tedi-button-group__dropdown-trigger\"\n    >\n      <tedi-icon [name]=\"triggerIcon()\" color=\"inherit\" [size]=\"18\" />\n      {{ triggerLabel() }}\n    </button>\n\n    <tedi-dropdown-content>\n      @for (item of items(); track item.value()) {\n        <li\n          tedi-dropdown-item\n          [value]=\"item.value()\"\n          [disabled]=\"item.disabled()\"\n          [class.tedi-dropdown-item--selected]=\"item.selected()\"\n          (itemSelect)=\"onDropdownItemSelect(item)\"\n        >\n          <tedi-option-content>\n            @if (item.iconLeft()) {\n              <tedi-icon\n                [name]=\"item.iconLeft()!\"\n                color=\"inherit\"\n                [size]=\"18\"\n              />\n            } @else if (item.icon()) {\n              <tedi-icon [name]=\"item.icon()!\" color=\"inherit\" [size]=\"18\" />\n            }\n            <tedi-option-content-label>{{\n              item.label()\n            }}</tedi-option-content-label>\n            @if (item.iconRight()) {\n              <tedi-icon\n                [name]=\"item.iconRight()!\"\n                color=\"inherit\"\n                [size]=\"18\"\n              />\n            }\n          </tedi-option-content>\n        </li>\n      }\n    </tedi-dropdown-content>\n  </tedi-dropdown>\n}\n", styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-unselected-text);--_btn-bg: var(--button-group-primary-unselected-background);--_btn-border: var(--button-group-primary-unselected-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-unselected-text);--_btn-focus-bg: var(--button-group-primary-unselected-background);--_btn-focus-border: var(--button-group-primary-unselected-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-unselected-text);--_btn-bg: var(--button-group-secondary-unselected-background);--_btn-border: var(--button-group-secondary-unselected-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-unselected-text);--_btn-focus-bg: var(--button-group-secondary-unselected-background);--_btn-focus-border: var(--button-group-secondary-unselected-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}.tedi-button-group{display:flex}.tedi-button-group--stretch .tedi-button{flex:1}.tedi-button-group .tedi-button:focus-visible{z-index:2}.tedi-button-group .tedi-button[aria-pressed=true]{z-index:1}.tedi-button-group .tedi-button[aria-pressed=true]:not(:disabled){color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group>.tedi-button:not(:first-child){margin-left:calc(var(--tedi-borders-01) * -1);border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group>.tedi-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.tedi-button-group tedi-tooltip:not(:first-child) tedi-tooltip-trigger{margin-left:calc(var(--tedi-borders-01) * -1)}.tedi-button-group tedi-tooltip:not(:first-child) .tedi-button{border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group tedi-tooltip:not(:last-child) .tedi-button{border-top-right-radius:0;border-bottom-right-radius:0}@media(max-width:47.98rem){.tedi-button-group .tedi-button{flex:1}}.tedi-button-group--dropdown-mode>.tedi-button,.tedi-button-group--dropdown-mode>tedi-tooltip{display:none}.tedi-button-group__dropdown{display:flex;flex:1 1 auto}.tedi-button-group__dropdown-trigger{flex:1}.tedi-button-group__dropdown-trigger[aria-expanded=true]{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger{border-radius:var(--button-radius-sm)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary{padding:calc(var(--_btn-padding-y) - var(--tedi-borders-02)) calc(var(--_btn-padding-x) - var(--tedi-borders-02));border-width:var(--tedi-borders-02)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary:not([aria-expanded=true]){border-color:var(--button-group-secondary-selected-border)}.tedi-button.tedi-button-group-button{gap:0}.tedi-button-group-button__label{padding-inline:var(--_btn-inner-spacing)}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: DropdownComponent, selector: "tedi-dropdown", inputs: ["value", "position", "preventOverflow", "offset", "hideOnScroll"], outputs: ["valueChange"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[tedi-dropdown-trigger]", inputs: ["ariaHaspopup"] }, { kind: "component", type: DropdownContentComponent, selector: "tedi-dropdown-content", inputs: ["dropdownRole"] }, { kind: "component", type: DropdownItemComponent, selector: "li[tedi-dropdown-item]", inputs: ["value", "disabled", "interactiveContent", "clipContent", "closeOnSelect"], outputs: ["itemSelect"] }, { kind: "component", type: OptionContentComponent, selector: "tedi-option-content", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: OptionContentLabelComponent, selector: "tedi-option-content-label", inputs: ["clipContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: ButtonGroupComponent, decorators: [{
             type: Component,
@@ -3734,13 +3734,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         DropdownTriggerDirective,
                         DropdownContentComponent,
                         DropdownItemComponent,
-                        DropdownItemValueComponent,
-                        DropdownItemValueLabelComponent,
+                        OptionContentComponent,
+                        OptionContentLabelComponent,
                     ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         "[class]": "hostClasses()",
                         "[attr.role]": "isDropdownMode() ? null : 'group'",
                         "[attr.aria-label]": "ariaLabel() || null",
-                    }, template: "<ng-content />\n\n@if (isDropdownMode()) {\n  <tedi-dropdown\n    class=\"tedi-button-group__dropdown\"\n    appendTo=\"body\"\n    [offset]=\"0\"\n  >\n    <button\n      tedi-dropdown-trigger\n      tedi-button\n      type=\"button\"\n      [variant]=\"triggerVariant()\"\n      [attr.aria-label]=\"ariaLabel() || null\"\n      class=\"tedi-button-group__dropdown-trigger\"\n    >\n      <tedi-icon [name]=\"triggerIcon()\" color=\"inherit\" [size]=\"18\" />\n      {{ triggerLabel() }}\n    </button>\n\n    <tedi-dropdown-content>\n      @for (item of items(); track item.value()) {\n        <li\n          tedi-dropdown-item\n          [value]=\"item.value()\"\n          [disabled]=\"item.disabled()\"\n          [class.tedi-dropdown-item--selected]=\"item.selected()\"\n          (itemSelect)=\"onDropdownItemSelect(item)\"\n        >\n          <tedi-dropdown-item-value>\n            @if (item.iconLeft()) {\n              <tedi-icon\n                [name]=\"item.iconLeft()!\"\n                color=\"inherit\"\n                [size]=\"18\"\n              />\n            } @else if (item.icon()) {\n              <tedi-icon [name]=\"item.icon()!\" color=\"inherit\" [size]=\"18\" />\n            }\n            <tedi-dropdown-item-value-label>{{\n              item.label()\n            }}</tedi-dropdown-item-value-label>\n            @if (item.iconRight()) {\n              <tedi-icon\n                [name]=\"item.iconRight()!\"\n                color=\"inherit\"\n                [size]=\"18\"\n              />\n            }\n          </tedi-dropdown-item-value>\n        </li>\n      }\n    </tedi-dropdown-content>\n  </tedi-dropdown>\n}\n", styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-inactive-text);--_btn-bg: var(--button-group-primary-inactive-background);--_btn-border: var(--button-group-primary-inactive-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-inactive-text);--_btn-focus-bg: var(--button-group-primary-inactive-background);--_btn-focus-border: var(--button-group-primary-inactive-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-inactive-text);--_btn-bg: var(--button-group-secondary-inactive-background);--_btn-border: var(--button-group-secondary-inactive-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-inactive-text);--_btn-focus-bg: var(--button-group-secondary-inactive-background);--_btn-focus-border: var(--button-group-secondary-inactive-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}.tedi-button-group{display:flex}.tedi-button-group--stretch .tedi-button{flex:1}.tedi-button-group .tedi-button:focus-visible{z-index:2}.tedi-button-group .tedi-button[aria-pressed=true]{z-index:1}.tedi-button-group .tedi-button[aria-pressed=true]:not(:disabled){color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group>.tedi-button:not(:first-child){margin-left:calc(var(--tedi-borders-01) * -1);border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group>.tedi-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.tedi-button-group tedi-tooltip:not(:first-child) tedi-tooltip-trigger{margin-left:calc(var(--tedi-borders-01) * -1)}.tedi-button-group tedi-tooltip:not(:first-child) .tedi-button{border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group tedi-tooltip:not(:last-child) .tedi-button{border-top-right-radius:0;border-bottom-right-radius:0}@media(max-width:47.98rem){.tedi-button-group .tedi-button{flex:1}}.tedi-button-group--dropdown-mode>.tedi-button,.tedi-button-group--dropdown-mode>tedi-tooltip{display:none}.tedi-button-group__dropdown{display:flex;flex:1 1 auto}.tedi-button-group__dropdown-trigger{flex:1}.tedi-button-group__dropdown-trigger[aria-expanded=true]{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger{border-radius:var(--button-radius-sm)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary{padding:calc(var(--_btn-padding-y) - var(--tedi-borders-02)) calc(var(--_btn-padding-x) - var(--tedi-borders-02));border-width:var(--tedi-borders-02)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary:not([aria-expanded=true]){border-color:var(--button-group-secondary-selected-border)}.tedi-button.tedi-button-group-button{gap:0}.tedi-button-group-button__label{padding-inline:var(--_btn-inner-spacing)}\n"] }]
+                    }, template: "<ng-content />\n\n@if (isDropdownMode()) {\n  <tedi-dropdown\n    class=\"tedi-button-group__dropdown\"\n    appendTo=\"body\"\n    [offset]=\"0\"\n  >\n    <button\n      tedi-dropdown-trigger\n      tedi-button\n      type=\"button\"\n      [variant]=\"triggerVariant()\"\n      [attr.aria-label]=\"ariaLabel() || null\"\n      class=\"tedi-button-group__dropdown-trigger\"\n    >\n      <tedi-icon [name]=\"triggerIcon()\" color=\"inherit\" [size]=\"18\" />\n      {{ triggerLabel() }}\n    </button>\n\n    <tedi-dropdown-content>\n      @for (item of items(); track item.value()) {\n        <li\n          tedi-dropdown-item\n          [value]=\"item.value()\"\n          [disabled]=\"item.disabled()\"\n          [class.tedi-dropdown-item--selected]=\"item.selected()\"\n          (itemSelect)=\"onDropdownItemSelect(item)\"\n        >\n          <tedi-option-content>\n            @if (item.iconLeft()) {\n              <tedi-icon\n                [name]=\"item.iconLeft()!\"\n                color=\"inherit\"\n                [size]=\"18\"\n              />\n            } @else if (item.icon()) {\n              <tedi-icon [name]=\"item.icon()!\" color=\"inherit\" [size]=\"18\" />\n            }\n            <tedi-option-content-label>{{\n              item.label()\n            }}</tedi-option-content-label>\n            @if (item.iconRight()) {\n              <tedi-icon\n                [name]=\"item.iconRight()!\"\n                color=\"inherit\"\n                [size]=\"18\"\n              />\n            }\n          </tedi-option-content>\n        </li>\n      }\n    </tedi-dropdown-content>\n  </tedi-dropdown>\n}\n", styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-unselected-text);--_btn-bg: var(--button-group-primary-unselected-background);--_btn-border: var(--button-group-primary-unselected-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-unselected-text);--_btn-focus-bg: var(--button-group-primary-unselected-background);--_btn-focus-border: var(--button-group-primary-unselected-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-unselected-text);--_btn-bg: var(--button-group-secondary-unselected-background);--_btn-border: var(--button-group-secondary-unselected-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-unselected-text);--_btn-focus-bg: var(--button-group-secondary-unselected-background);--_btn-focus-border: var(--button-group-secondary-unselected-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}.tedi-button-group{display:flex}.tedi-button-group--stretch .tedi-button{flex:1}.tedi-button-group .tedi-button:focus-visible{z-index:2}.tedi-button-group .tedi-button[aria-pressed=true]{z-index:1}.tedi-button-group .tedi-button[aria-pressed=true]:not(:disabled){color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group>.tedi-button:not(:first-child){margin-left:calc(var(--tedi-borders-01) * -1);border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group>.tedi-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.tedi-button-group tedi-tooltip:not(:first-child) tedi-tooltip-trigger{margin-left:calc(var(--tedi-borders-01) * -1)}.tedi-button-group tedi-tooltip:not(:first-child) .tedi-button{border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group tedi-tooltip:not(:last-child) .tedi-button{border-top-right-radius:0;border-bottom-right-radius:0}@media(max-width:47.98rem){.tedi-button-group .tedi-button{flex:1}}.tedi-button-group--dropdown-mode>.tedi-button,.tedi-button-group--dropdown-mode>tedi-tooltip{display:none}.tedi-button-group__dropdown{display:flex;flex:1 1 auto}.tedi-button-group__dropdown-trigger{flex:1}.tedi-button-group__dropdown-trigger[aria-expanded=true]{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger{border-radius:var(--button-radius-sm)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary{padding:calc(var(--_btn-padding-y) - var(--tedi-borders-02)) calc(var(--_btn-padding-x) - var(--tedi-borders-02));border-width:var(--tedi-borders-02)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary:not([aria-expanded=true]){border-color:var(--button-group-secondary-selected-border)}.tedi-button.tedi-button-group-button{gap:0}.tedi-button-group-button__label{padding-inline:var(--_btn-inner-spacing)}\n"] }]
         }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], stretch: [{ type: i0.Input, args: [{ isSignal: true, alias: "stretch", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], enableMobileDropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableMobileDropdown", required: false }] }], mobileBreakpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobileBreakpoint", required: false }] }], dropdownLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownLabel", required: false }] }], dropdownLabelMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownLabelMode", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], items: [{ type: i0.ContentChildren, args: [forwardRef(() => ButtonGroupButtonDirective), { isSignal: true }] }] } });
 /**
@@ -4994,7 +4994,7 @@ class AccordionItemHeaderComponent {
         this.item.toggle();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: AccordionItemHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: AccordionItemHeaderComponent, isStandalone: true, selector: "tedi-accordion-item-header", inputs: { headerClickable: { classPropertyName: "headerClickable", publicName: "headerClickable", isSignal: true, isRequired: false, transformFunction: null }, titleLayout: { classPropertyName: "titleLayout", publicName: "titleLayout", isSignal: true, isRequired: false, transformFunction: null }, openText: { classPropertyName: "openText", publicName: "openText", isSignal: true, isRequired: false, transformFunction: null }, closeText: { classPropertyName: "closeText", publicName: "closeText", isSignal: true, isRequired: false, transformFunction: null }, showExpandLabel: { classPropertyName: "showExpandLabel", publicName: "showExpandLabel", isSignal: true, isRequired: false, transformFunction: null }, showDefaultExpandAction: { classPropertyName: "showDefaultExpandAction", publicName: "showDefaultExpandAction", isSignal: true, isRequired: false, transformFunction: null }, expandActionPosition: { classPropertyName: "expandActionPosition", publicName: "expandActionPosition", isSignal: true, isRequired: false, transformFunction: null }, headerClass: { classPropertyName: "headerClass", publicName: "headerClass", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null }, expandActionArrowType: { classPropertyName: "expandActionArrowType", publicName: "expandActionArrowType", isSignal: true, isRequired: false, transformFunction: null }, expandActionSize: { classPropertyName: "expandActionSize", publicName: "expandActionSize", isSignal: true, isRequired: false, transformFunction: null }, expandActionInverted: { classPropertyName: "expandActionInverted", publicName: "expandActionInverted", isSignal: true, isRequired: false, transformFunction: null }, expandActionUnderline: { classPropertyName: "expandActionUnderline", publicName: "expandActionUnderline", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-accordion-item-header": "true", "class.tedi-accordion-item-header--hoverable": "headerClickable() && !item.disabled()", "class.tedi-accordion-item-header--expanded": "expanded()", "class.tedi-accordion-item-header--with-icon-card": "item.showIconCard()", "class.tedi-accordion-item-header--disabled": "item.disabled()", "class": "headerClass() ?? ''" } }, ngImport: i0, template: "@switch (headingLevel()) {\n  @case (1) {\n    <h1 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h1>\n  }\n  @case (2) {\n    <h2 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h2>\n  }\n  @case (3) {\n    <h3 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h3>\n  }\n  @case (4) {\n    <h4 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h4>\n  }\n  @case (5) {\n    <h5 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h5>\n  }\n  @case (6) {\n    <h6 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h6>\n  }\n  @default {\n    <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n  }\n}\n\n<ng-template #trigger>\n  @if (headerClickable()) {\n    <button\n      [id]=\"headerId\"\n      type=\"button\"\n      class=\"tedi-accordion-item-header__trigger\"\n      (click)=\"toggle()\"\n      [disabled]=\"disabled()\"\n      [attr.aria-expanded]=\"expanded()\"\n      [attr.aria-controls]=\"contentId\"\n    >\n      <ng-container *ngTemplateOutlet=\"headerContent\"></ng-container>\n    </button>\n  } @else {\n    <div [id]=\"headerId\" class=\"tedi-accordion-item-header__trigger\">\n      <ng-container *ngTemplateOutlet=\"headerContent\"></ng-container>\n    </div>\n  }\n</ng-template>\n\n<ng-template #headerContent>\n  <div class=\"tedi-accordion-item-header__start\">\n    <ng-content select=\"[tedi-accordion-start-action]\"></ng-content>\n\n    <ng-content select=\"[tedi-accordion-before-title]\"></ng-content>\n\n    <span\n      class=\"tedi-accordion-item-header__title\"\n      [class.tedi-accordion-item-header__title--grow]=\"titleLayout() === 'fill'\"\n    >\n      <span class=\"tedi-accordion-item-header__title-main\">\n        @if (showStartExpandAction()) {\n          <ng-container *ngTemplateOutlet=\"collapseButton\"></ng-container>\n        }\n\n        <span tedi-text color=\"secondary\" modifiers=\"normal\">\n          <ng-content select=\"[tedi-accordion-title]\"></ng-content>\n        </span>\n      </span>\n\n      <ng-content select=\"[tedi-accordion-start-description]\"></ng-content>\n    </span>\n\n    <ng-content select=\"[tedi-accordion-after-title]\"></ng-content>\n  </div>\n\n  <ng-content select=\"[tedi-accordion-end-description]\"></ng-content>\n\n  @if (showEndExpandAction()) {\n    <ng-container *ngTemplateOutlet=\"collapseButton\"></ng-container>\n  }\n\n  <ng-content select=\"[tedi-accordion-end-action]\"></ng-content>\n</ng-template>\n\n<ng-template #collapseButton>\n  @if (headerClickable()) {\n    <div\n      tedi-text\n      modifiers=\"normal\"\n      class=\"tedi-accordion-item-header__expand-indicator\"\n      [class.tedi-accordion-item-header__expand-indicator--with-label]=\"\n        showExpandLabel()\n      \"\n    >\n      {{ showExpandLabel() ? expandLabel() : \"\" }}\n      <tedi-icon\n        aria-hidden=\"true\"\n        name=\"expand_more\"\n        class=\"tedi-accordion-item-header__icon\"\n        [class.tedi-accordion-item-header__icon--expanded]=\"expanded()\"\n        [class.tedi-accordion-item-header__icon--no-label]=\"!showExpandLabel()\"\n      />\n    </div>\n  } @else {\n    <button\n      tedi-collapse-button\n      [underline]=\"expandActionUnderline()\"\n      (openChange)=\"toggle()\"\n      [open]=\"expanded()\"\n      [openText]=\"openText()\"\n      [closeText]=\"closeText()\"\n      [hideText]=\"!showExpandLabel()\"\n      [arrowType]=\"expandActionArrowType()\"\n      [size]=\"resolvedExpandActionSize()\"\n      [inverted]=\"expandActionInverted()\"\n      [ariaControls]=\"contentId\"\n      [disabled]=\"disabled()\"\n      [attr.aria-disabled]=\"disabled() || null\"\n      [attr.tabindex]=\"disabled() ? -1 : null\"\n    ></button>\n  }\n</ng-template>\n", styles: [".tedi-accordion-item-header{position:relative;display:flex;grid-row:1;grid-column:2;align-items:stretch;min-width:0;background:var(--card-background-primary);border:1px solid var(--card-border-primary);border-radius:var(--card-radius-rounded)}.tedi-accordion-item-header--expanded{border-radius:var(--card-radius-rounded) var(--card-radius-rounded) 0 0}.tedi-accordion-item-header--expanded.tedi-accordion-item-header--with-icon-card{border-radius:0 var(--card-radius-rounded) 0 0}.tedi-accordion-item-header--with-icon-card{border-radius:var(--card-radius-sharp) var(--card-radius-rounded) var(--card-radius-rounded) var(--card-radius-sharp)}.tedi-accordion-item-header--hoverable{cursor:pointer}.tedi-accordion-item-header--hoverable:hover{background:var(--general-surface-hover)}.tedi-accordion-item-header--hoverable:active{background:var(--general-surface-brand-tertiary)}.tedi-accordion-item-header--hoverable:has(.tedi-accordion-item-header__trigger:focus-visible){z-index:1;outline:none;background:var(--card-background-primary);border:1px solid var(--card-border-primary);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--tedi-primary-500)}.tedi-accordion-item-header--disabled{color:var(--general-text-disabled);cursor:not-allowed}.tedi-accordion-item-header--disabled .tedi-accordion-item-header__title-main [tedi-text],.tedi-accordion-item-header--disabled .tedi-accordion-item-header__expand-indicator{color:inherit}.tedi-accordion-item-header__heading-wrapper{display:contents}.tedi-accordion-item-header__trigger{display:flex;flex:1;gap:var(--layout-grid-gutters-16);align-items:center;min-width:0;padding:var(--card-padding-md-default);font:inherit;color:inherit;text-align:inherit;cursor:inherit;outline:none;background:transparent;border:0}.tedi-accordion-item-header__start{display:flex;flex:1;gap:var(--layout-grid-gutters-08);align-items:center;min-width:0}.tedi-accordion-item-header__title{display:flex;gap:var(--layout-grid-gutters-08);min-width:0}.tedi-accordion-item-header__title-main{display:flex;gap:inherit;align-items:center;min-width:0}.tedi-accordion-item-header__title:has([tedi-accordion-start-description]){flex-direction:column;gap:0;align-items:flex-start}.tedi-accordion-item-header__title:has([tedi-accordion-start-description])>*{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tedi-accordion-item-header__title--grow{flex:1}.tedi-accordion-item-header__expand-indicator{display:flex;align-items:center;color:var(--accordion-action-color)}.tedi-accordion-item-header__expand-indicator .tedi-accordion-item-header__icon{color:inherit}.tedi-accordion-item-header__expand-indicator--with-label .tedi-accordion-item-header__icon{margin-left:var(--button-sm-inner-spacing);font-size:var(--tedi-size-02);line-height:inherit}.tedi-accordion-item-header__icon{transition:transform .2s ease-in-out}.tedi-accordion-item-header__icon--expanded{transform:rotate(-180deg)}.tedi-link .tedi-accordion-item-header__icon--no-label{font-size:var(--icon-05)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: CollapseButtonComponent, selector: "button[tedi-collapse-button]", inputs: ["open", "openText", "closeText", "hideText", "arrowType", "size", "inverted", "underline", "ariaControls", "ariaLabel", "id"], outputs: ["openChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: AccordionItemHeaderComponent, isStandalone: true, selector: "tedi-accordion-item-header", inputs: { headerClickable: { classPropertyName: "headerClickable", publicName: "headerClickable", isSignal: true, isRequired: false, transformFunction: null }, titleLayout: { classPropertyName: "titleLayout", publicName: "titleLayout", isSignal: true, isRequired: false, transformFunction: null }, openText: { classPropertyName: "openText", publicName: "openText", isSignal: true, isRequired: false, transformFunction: null }, closeText: { classPropertyName: "closeText", publicName: "closeText", isSignal: true, isRequired: false, transformFunction: null }, showExpandLabel: { classPropertyName: "showExpandLabel", publicName: "showExpandLabel", isSignal: true, isRequired: false, transformFunction: null }, showDefaultExpandAction: { classPropertyName: "showDefaultExpandAction", publicName: "showDefaultExpandAction", isSignal: true, isRequired: false, transformFunction: null }, expandActionPosition: { classPropertyName: "expandActionPosition", publicName: "expandActionPosition", isSignal: true, isRequired: false, transformFunction: null }, headerClass: { classPropertyName: "headerClass", publicName: "headerClass", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null }, expandActionArrowType: { classPropertyName: "expandActionArrowType", publicName: "expandActionArrowType", isSignal: true, isRequired: false, transformFunction: null }, expandActionSize: { classPropertyName: "expandActionSize", publicName: "expandActionSize", isSignal: true, isRequired: false, transformFunction: null }, expandActionInverted: { classPropertyName: "expandActionInverted", publicName: "expandActionInverted", isSignal: true, isRequired: false, transformFunction: null }, expandActionUnderline: { classPropertyName: "expandActionUnderline", publicName: "expandActionUnderline", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-accordion-item-header": "true", "class.tedi-accordion-item-header--hoverable": "headerClickable() && !item.disabled()", "class.tedi-accordion-item-header--expanded": "expanded()", "class.tedi-accordion-item-header--with-icon-card": "item.showIconCard()", "class.tedi-accordion-item-header--disabled": "item.disabled()", "class": "headerClass() ?? ''" } }, ngImport: i0, template: "@switch (headingLevel()) {\n  @case (1) {\n    <h1 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h1>\n  }\n  @case (2) {\n    <h2 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h2>\n  }\n  @case (3) {\n    <h3 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h3>\n  }\n  @case (4) {\n    <h4 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h4>\n  }\n  @case (5) {\n    <h5 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h5>\n  }\n  @case (6) {\n    <h6 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h6>\n  }\n  @default {\n    <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n  }\n}\n\n<ng-template #trigger>\n  @if (headerClickable()) {\n    <button\n      [id]=\"headerId\"\n      type=\"button\"\n      class=\"tedi-accordion-item-header__trigger\"\n      (click)=\"toggle()\"\n      [disabled]=\"disabled()\"\n      [attr.aria-expanded]=\"expanded()\"\n      [attr.aria-controls]=\"contentId\"\n    >\n      <ng-container *ngTemplateOutlet=\"headerContent\"></ng-container>\n    </button>\n  } @else {\n    <div [id]=\"headerId\" class=\"tedi-accordion-item-header__trigger\">\n      <ng-container *ngTemplateOutlet=\"headerContent\"></ng-container>\n    </div>\n  }\n</ng-template>\n\n<ng-template #headerContent>\n  <div class=\"tedi-accordion-item-header__start\">\n    <ng-content select=\"[tedi-accordion-start-action]\"></ng-content>\n\n    <ng-content select=\"[tedi-accordion-before-title]\"></ng-content>\n\n    <span\n      class=\"tedi-accordion-item-header__title\"\n      [class.tedi-accordion-item-header__title--grow]=\"titleLayout() === 'fill'\"\n    >\n      <span class=\"tedi-accordion-item-header__title-main\">\n        @if (showStartExpandAction()) {\n          <ng-container *ngTemplateOutlet=\"collapseButton\"></ng-container>\n        }\n\n        <span tedi-text color=\"secondary\" modifiers=\"normal\">\n          <ng-content select=\"[tedi-accordion-title]\"></ng-content>\n        </span>\n      </span>\n\n      <ng-content select=\"[tedi-accordion-start-description]\"></ng-content>\n    </span>\n\n    <ng-content select=\"[tedi-accordion-after-title]\"></ng-content>\n  </div>\n\n  <ng-content select=\"[tedi-accordion-end-description]\"></ng-content>\n\n  @if (showEndExpandAction()) {\n    <ng-container *ngTemplateOutlet=\"collapseButton\"></ng-container>\n  }\n\n  <ng-content select=\"[tedi-accordion-end-action]\"></ng-content>\n</ng-template>\n\n<ng-template #collapseButton>\n  @if (headerClickable()) {\n    <div\n      tedi-text\n      modifiers=\"normal\"\n      class=\"tedi-accordion-item-header__expand-indicator\"\n      [class.tedi-accordion-item-header__expand-indicator--with-label]=\"\n        showExpandLabel()\n      \"\n    >\n      {{ showExpandLabel() ? expandLabel() : \"\" }}\n      <tedi-icon\n        aria-hidden=\"true\"\n        name=\"expand_more\"\n        class=\"tedi-accordion-item-header__icon\"\n        [class.tedi-accordion-item-header__icon--expanded]=\"expanded()\"\n        [class.tedi-accordion-item-header__icon--no-label]=\"!showExpandLabel()\"\n      />\n    </div>\n  } @else {\n    <button\n      tedi-collapse-button\n      [underline]=\"expandActionUnderline()\"\n      (openChange)=\"toggle()\"\n      [open]=\"expanded()\"\n      [openText]=\"openText()\"\n      [closeText]=\"closeText()\"\n      [hideText]=\"!showExpandLabel()\"\n      [arrowType]=\"expandActionArrowType()\"\n      [size]=\"resolvedExpandActionSize()\"\n      [inverted]=\"expandActionInverted()\"\n      [ariaControls]=\"contentId\"\n      [disabled]=\"disabled()\"\n      [attr.aria-disabled]=\"disabled() || null\"\n      [attr.tabindex]=\"disabled() ? -1 : null\"\n    ></button>\n  }\n</ng-template>\n", styles: [".tedi-accordion-item-header{position:relative;display:flex;grid-row:1;grid-column:2;align-items:stretch;min-width:0;background:var(--card-background-primary);border:1px solid var(--card-border-primary);border-radius:var(--card-radius-rounded)}.tedi-accordion-item-header--expanded{border-radius:var(--card-radius-rounded) var(--card-radius-rounded) 0 0}.tedi-accordion-item-header--expanded.tedi-accordion-item-header--with-icon-card{border-radius:0 var(--card-radius-rounded) 0 0}.tedi-accordion-item-header--with-icon-card{border-radius:var(--card-radius-sharp) var(--card-radius-rounded) var(--card-radius-rounded) var(--card-radius-sharp)}.tedi-accordion-item-header--hoverable{cursor:pointer}.tedi-accordion-item-header--hoverable:hover{background:var(--general-state-hover)}.tedi-accordion-item-header--hoverable:active{background:var(--general-surface-brand-tertiary)}.tedi-accordion-item-header--hoverable:has(.tedi-accordion-item-header__trigger:focus-visible){z-index:1;outline:none;background:var(--card-background-primary);border:1px solid var(--card-border-primary);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--tedi-primary-500)}.tedi-accordion-item-header--disabled{color:var(--general-text-disabled);cursor:not-allowed}.tedi-accordion-item-header--disabled .tedi-accordion-item-header__title-main [tedi-text],.tedi-accordion-item-header--disabled .tedi-accordion-item-header__expand-indicator{color:inherit}.tedi-accordion-item-header__heading-wrapper{display:contents}.tedi-accordion-item-header__trigger{display:flex;flex:1;gap:var(--layout-grid-gutters-16);align-items:center;min-width:0;padding:var(--card-padding-md-default);font:inherit;color:inherit;text-align:inherit;cursor:inherit;outline:none;background:transparent;border:0}.tedi-accordion-item-header__start{display:flex;flex:1;gap:var(--layout-grid-gutters-08);align-items:center;min-width:0}.tedi-accordion-item-header__title{display:flex;gap:var(--layout-grid-gutters-08);min-width:0}.tedi-accordion-item-header__title-main{display:flex;gap:inherit;align-items:center;min-width:0}.tedi-accordion-item-header__title:has([tedi-accordion-start-description]){flex-direction:column;gap:0;align-items:flex-start}.tedi-accordion-item-header__title:has([tedi-accordion-start-description])>*{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tedi-accordion-item-header__title--grow{flex:1}.tedi-accordion-item-header__expand-indicator{display:flex;align-items:center;color:var(--accordion-action-color)}.tedi-accordion-item-header__expand-indicator .tedi-accordion-item-header__icon{color:inherit}.tedi-accordion-item-header__expand-indicator--with-label .tedi-accordion-item-header__icon{margin-left:var(--button-sm-inner-spacing);font-size:var(--tedi-size-02);line-height:inherit}.tedi-accordion-item-header__icon{transition:transform .2s ease-in-out}.tedi-accordion-item-header__icon--expanded{transform:rotate(-180deg)}.tedi-link .tedi-accordion-item-header__icon--no-label{font-size:var(--icon-05)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: CollapseButtonComponent, selector: "button[tedi-collapse-button]", inputs: ["open", "openText", "closeText", "hideText", "arrowType", "size", "inverted", "underline", "ariaControls", "ariaLabel", "id"], outputs: ["openChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: AccordionItemHeaderComponent, decorators: [{
             type: Component,
@@ -5010,7 +5010,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "[class.tedi-accordion-item-header--with-icon-card]": "item.showIconCard()",
                         "[class.tedi-accordion-item-header--disabled]": "item.disabled()",
                         "[class]": "headerClass() ?? ''",
-                    }, template: "@switch (headingLevel()) {\n  @case (1) {\n    <h1 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h1>\n  }\n  @case (2) {\n    <h2 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h2>\n  }\n  @case (3) {\n    <h3 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h3>\n  }\n  @case (4) {\n    <h4 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h4>\n  }\n  @case (5) {\n    <h5 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h5>\n  }\n  @case (6) {\n    <h6 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h6>\n  }\n  @default {\n    <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n  }\n}\n\n<ng-template #trigger>\n  @if (headerClickable()) {\n    <button\n      [id]=\"headerId\"\n      type=\"button\"\n      class=\"tedi-accordion-item-header__trigger\"\n      (click)=\"toggle()\"\n      [disabled]=\"disabled()\"\n      [attr.aria-expanded]=\"expanded()\"\n      [attr.aria-controls]=\"contentId\"\n    >\n      <ng-container *ngTemplateOutlet=\"headerContent\"></ng-container>\n    </button>\n  } @else {\n    <div [id]=\"headerId\" class=\"tedi-accordion-item-header__trigger\">\n      <ng-container *ngTemplateOutlet=\"headerContent\"></ng-container>\n    </div>\n  }\n</ng-template>\n\n<ng-template #headerContent>\n  <div class=\"tedi-accordion-item-header__start\">\n    <ng-content select=\"[tedi-accordion-start-action]\"></ng-content>\n\n    <ng-content select=\"[tedi-accordion-before-title]\"></ng-content>\n\n    <span\n      class=\"tedi-accordion-item-header__title\"\n      [class.tedi-accordion-item-header__title--grow]=\"titleLayout() === 'fill'\"\n    >\n      <span class=\"tedi-accordion-item-header__title-main\">\n        @if (showStartExpandAction()) {\n          <ng-container *ngTemplateOutlet=\"collapseButton\"></ng-container>\n        }\n\n        <span tedi-text color=\"secondary\" modifiers=\"normal\">\n          <ng-content select=\"[tedi-accordion-title]\"></ng-content>\n        </span>\n      </span>\n\n      <ng-content select=\"[tedi-accordion-start-description]\"></ng-content>\n    </span>\n\n    <ng-content select=\"[tedi-accordion-after-title]\"></ng-content>\n  </div>\n\n  <ng-content select=\"[tedi-accordion-end-description]\"></ng-content>\n\n  @if (showEndExpandAction()) {\n    <ng-container *ngTemplateOutlet=\"collapseButton\"></ng-container>\n  }\n\n  <ng-content select=\"[tedi-accordion-end-action]\"></ng-content>\n</ng-template>\n\n<ng-template #collapseButton>\n  @if (headerClickable()) {\n    <div\n      tedi-text\n      modifiers=\"normal\"\n      class=\"tedi-accordion-item-header__expand-indicator\"\n      [class.tedi-accordion-item-header__expand-indicator--with-label]=\"\n        showExpandLabel()\n      \"\n    >\n      {{ showExpandLabel() ? expandLabel() : \"\" }}\n      <tedi-icon\n        aria-hidden=\"true\"\n        name=\"expand_more\"\n        class=\"tedi-accordion-item-header__icon\"\n        [class.tedi-accordion-item-header__icon--expanded]=\"expanded()\"\n        [class.tedi-accordion-item-header__icon--no-label]=\"!showExpandLabel()\"\n      />\n    </div>\n  } @else {\n    <button\n      tedi-collapse-button\n      [underline]=\"expandActionUnderline()\"\n      (openChange)=\"toggle()\"\n      [open]=\"expanded()\"\n      [openText]=\"openText()\"\n      [closeText]=\"closeText()\"\n      [hideText]=\"!showExpandLabel()\"\n      [arrowType]=\"expandActionArrowType()\"\n      [size]=\"resolvedExpandActionSize()\"\n      [inverted]=\"expandActionInverted()\"\n      [ariaControls]=\"contentId\"\n      [disabled]=\"disabled()\"\n      [attr.aria-disabled]=\"disabled() || null\"\n      [attr.tabindex]=\"disabled() ? -1 : null\"\n    ></button>\n  }\n</ng-template>\n", styles: [".tedi-accordion-item-header{position:relative;display:flex;grid-row:1;grid-column:2;align-items:stretch;min-width:0;background:var(--card-background-primary);border:1px solid var(--card-border-primary);border-radius:var(--card-radius-rounded)}.tedi-accordion-item-header--expanded{border-radius:var(--card-radius-rounded) var(--card-radius-rounded) 0 0}.tedi-accordion-item-header--expanded.tedi-accordion-item-header--with-icon-card{border-radius:0 var(--card-radius-rounded) 0 0}.tedi-accordion-item-header--with-icon-card{border-radius:var(--card-radius-sharp) var(--card-radius-rounded) var(--card-radius-rounded) var(--card-radius-sharp)}.tedi-accordion-item-header--hoverable{cursor:pointer}.tedi-accordion-item-header--hoverable:hover{background:var(--general-surface-hover)}.tedi-accordion-item-header--hoverable:active{background:var(--general-surface-brand-tertiary)}.tedi-accordion-item-header--hoverable:has(.tedi-accordion-item-header__trigger:focus-visible){z-index:1;outline:none;background:var(--card-background-primary);border:1px solid var(--card-border-primary);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--tedi-primary-500)}.tedi-accordion-item-header--disabled{color:var(--general-text-disabled);cursor:not-allowed}.tedi-accordion-item-header--disabled .tedi-accordion-item-header__title-main [tedi-text],.tedi-accordion-item-header--disabled .tedi-accordion-item-header__expand-indicator{color:inherit}.tedi-accordion-item-header__heading-wrapper{display:contents}.tedi-accordion-item-header__trigger{display:flex;flex:1;gap:var(--layout-grid-gutters-16);align-items:center;min-width:0;padding:var(--card-padding-md-default);font:inherit;color:inherit;text-align:inherit;cursor:inherit;outline:none;background:transparent;border:0}.tedi-accordion-item-header__start{display:flex;flex:1;gap:var(--layout-grid-gutters-08);align-items:center;min-width:0}.tedi-accordion-item-header__title{display:flex;gap:var(--layout-grid-gutters-08);min-width:0}.tedi-accordion-item-header__title-main{display:flex;gap:inherit;align-items:center;min-width:0}.tedi-accordion-item-header__title:has([tedi-accordion-start-description]){flex-direction:column;gap:0;align-items:flex-start}.tedi-accordion-item-header__title:has([tedi-accordion-start-description])>*{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tedi-accordion-item-header__title--grow{flex:1}.tedi-accordion-item-header__expand-indicator{display:flex;align-items:center;color:var(--accordion-action-color)}.tedi-accordion-item-header__expand-indicator .tedi-accordion-item-header__icon{color:inherit}.tedi-accordion-item-header__expand-indicator--with-label .tedi-accordion-item-header__icon{margin-left:var(--button-sm-inner-spacing);font-size:var(--tedi-size-02);line-height:inherit}.tedi-accordion-item-header__icon{transition:transform .2s ease-in-out}.tedi-accordion-item-header__icon--expanded{transform:rotate(-180deg)}.tedi-link .tedi-accordion-item-header__icon--no-label{font-size:var(--icon-05)}\n"] }]
+                    }, template: "@switch (headingLevel()) {\n  @case (1) {\n    <h1 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h1>\n  }\n  @case (2) {\n    <h2 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h2>\n  }\n  @case (3) {\n    <h3 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h3>\n  }\n  @case (4) {\n    <h4 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h4>\n  }\n  @case (5) {\n    <h5 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h5>\n  }\n  @case (6) {\n    <h6 class=\"tedi-accordion-item-header__heading-wrapper\">\n      <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n    </h6>\n  }\n  @default {\n    <ng-container *ngTemplateOutlet=\"trigger\"></ng-container>\n  }\n}\n\n<ng-template #trigger>\n  @if (headerClickable()) {\n    <button\n      [id]=\"headerId\"\n      type=\"button\"\n      class=\"tedi-accordion-item-header__trigger\"\n      (click)=\"toggle()\"\n      [disabled]=\"disabled()\"\n      [attr.aria-expanded]=\"expanded()\"\n      [attr.aria-controls]=\"contentId\"\n    >\n      <ng-container *ngTemplateOutlet=\"headerContent\"></ng-container>\n    </button>\n  } @else {\n    <div [id]=\"headerId\" class=\"tedi-accordion-item-header__trigger\">\n      <ng-container *ngTemplateOutlet=\"headerContent\"></ng-container>\n    </div>\n  }\n</ng-template>\n\n<ng-template #headerContent>\n  <div class=\"tedi-accordion-item-header__start\">\n    <ng-content select=\"[tedi-accordion-start-action]\"></ng-content>\n\n    <ng-content select=\"[tedi-accordion-before-title]\"></ng-content>\n\n    <span\n      class=\"tedi-accordion-item-header__title\"\n      [class.tedi-accordion-item-header__title--grow]=\"titleLayout() === 'fill'\"\n    >\n      <span class=\"tedi-accordion-item-header__title-main\">\n        @if (showStartExpandAction()) {\n          <ng-container *ngTemplateOutlet=\"collapseButton\"></ng-container>\n        }\n\n        <span tedi-text color=\"secondary\" modifiers=\"normal\">\n          <ng-content select=\"[tedi-accordion-title]\"></ng-content>\n        </span>\n      </span>\n\n      <ng-content select=\"[tedi-accordion-start-description]\"></ng-content>\n    </span>\n\n    <ng-content select=\"[tedi-accordion-after-title]\"></ng-content>\n  </div>\n\n  <ng-content select=\"[tedi-accordion-end-description]\"></ng-content>\n\n  @if (showEndExpandAction()) {\n    <ng-container *ngTemplateOutlet=\"collapseButton\"></ng-container>\n  }\n\n  <ng-content select=\"[tedi-accordion-end-action]\"></ng-content>\n</ng-template>\n\n<ng-template #collapseButton>\n  @if (headerClickable()) {\n    <div\n      tedi-text\n      modifiers=\"normal\"\n      class=\"tedi-accordion-item-header__expand-indicator\"\n      [class.tedi-accordion-item-header__expand-indicator--with-label]=\"\n        showExpandLabel()\n      \"\n    >\n      {{ showExpandLabel() ? expandLabel() : \"\" }}\n      <tedi-icon\n        aria-hidden=\"true\"\n        name=\"expand_more\"\n        class=\"tedi-accordion-item-header__icon\"\n        [class.tedi-accordion-item-header__icon--expanded]=\"expanded()\"\n        [class.tedi-accordion-item-header__icon--no-label]=\"!showExpandLabel()\"\n      />\n    </div>\n  } @else {\n    <button\n      tedi-collapse-button\n      [underline]=\"expandActionUnderline()\"\n      (openChange)=\"toggle()\"\n      [open]=\"expanded()\"\n      [openText]=\"openText()\"\n      [closeText]=\"closeText()\"\n      [hideText]=\"!showExpandLabel()\"\n      [arrowType]=\"expandActionArrowType()\"\n      [size]=\"resolvedExpandActionSize()\"\n      [inverted]=\"expandActionInverted()\"\n      [ariaControls]=\"contentId\"\n      [disabled]=\"disabled()\"\n      [attr.aria-disabled]=\"disabled() || null\"\n      [attr.tabindex]=\"disabled() ? -1 : null\"\n    ></button>\n  }\n</ng-template>\n", styles: [".tedi-accordion-item-header{position:relative;display:flex;grid-row:1;grid-column:2;align-items:stretch;min-width:0;background:var(--card-background-primary);border:1px solid var(--card-border-primary);border-radius:var(--card-radius-rounded)}.tedi-accordion-item-header--expanded{border-radius:var(--card-radius-rounded) var(--card-radius-rounded) 0 0}.tedi-accordion-item-header--expanded.tedi-accordion-item-header--with-icon-card{border-radius:0 var(--card-radius-rounded) 0 0}.tedi-accordion-item-header--with-icon-card{border-radius:var(--card-radius-sharp) var(--card-radius-rounded) var(--card-radius-rounded) var(--card-radius-sharp)}.tedi-accordion-item-header--hoverable{cursor:pointer}.tedi-accordion-item-header--hoverable:hover{background:var(--general-state-hover)}.tedi-accordion-item-header--hoverable:active{background:var(--general-surface-brand-tertiary)}.tedi-accordion-item-header--hoverable:has(.tedi-accordion-item-header__trigger:focus-visible){z-index:1;outline:none;background:var(--card-background-primary);border:1px solid var(--card-border-primary);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--tedi-primary-500)}.tedi-accordion-item-header--disabled{color:var(--general-text-disabled);cursor:not-allowed}.tedi-accordion-item-header--disabled .tedi-accordion-item-header__title-main [tedi-text],.tedi-accordion-item-header--disabled .tedi-accordion-item-header__expand-indicator{color:inherit}.tedi-accordion-item-header__heading-wrapper{display:contents}.tedi-accordion-item-header__trigger{display:flex;flex:1;gap:var(--layout-grid-gutters-16);align-items:center;min-width:0;padding:var(--card-padding-md-default);font:inherit;color:inherit;text-align:inherit;cursor:inherit;outline:none;background:transparent;border:0}.tedi-accordion-item-header__start{display:flex;flex:1;gap:var(--layout-grid-gutters-08);align-items:center;min-width:0}.tedi-accordion-item-header__title{display:flex;gap:var(--layout-grid-gutters-08);min-width:0}.tedi-accordion-item-header__title-main{display:flex;gap:inherit;align-items:center;min-width:0}.tedi-accordion-item-header__title:has([tedi-accordion-start-description]){flex-direction:column;gap:0;align-items:flex-start}.tedi-accordion-item-header__title:has([tedi-accordion-start-description])>*{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tedi-accordion-item-header__title--grow{flex:1}.tedi-accordion-item-header__expand-indicator{display:flex;align-items:center;color:var(--accordion-action-color)}.tedi-accordion-item-header__expand-indicator .tedi-accordion-item-header__icon{color:inherit}.tedi-accordion-item-header__expand-indicator--with-label .tedi-accordion-item-header__icon{margin-left:var(--button-sm-inner-spacing);font-size:var(--tedi-size-02);line-height:inherit}.tedi-accordion-item-header__icon{transition:transform .2s ease-in-out}.tedi-accordion-item-header__icon--expanded{transform:rotate(-180deg)}.tedi-link .tedi-accordion-item-header__icon--no-label{font-size:var(--icon-05)}\n"] }]
         }], propDecorators: { headerClickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerClickable", required: false }] }], titleLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleLayout", required: false }] }], openText: [{ type: i0.Input, args: [{ isSignal: true, alias: "openText", required: false }] }], closeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeText", required: false }] }], showExpandLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showExpandLabel", required: false }] }], showDefaultExpandAction: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDefaultExpandAction", required: false }] }], expandActionPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandActionPosition", required: false }] }], headerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerClass", required: false }] }], headingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingLevel", required: false }] }], expandActionArrowType: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandActionArrowType", required: false }] }], expandActionSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandActionSize", required: false }] }], expandActionInverted: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandActionInverted", required: false }] }], expandActionUnderline: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandActionUnderline", required: false }] }] } });
 class AccordionItemContentComponent {
@@ -5770,6 +5770,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
 /** Ignore tiny calculation differences when deciding the carousel’s position. */
 const EPSILON = 0.001;
+/** Drag speed, in slides per ms, that counts as a flick. */
+const FLICK_VELOCITY = 0.0015;
+/** A flick's speed is measured over this many ms before release. */
+const FLICK_WINDOW = 100;
+/** Drags shorter than this (px) never move the carousel, so taps and jitter stay put. */
+const MIN_SWIPE_DISTANCE = 10;
+/** A mouse holds still while clicking, so a shorter drag is already deliberate. */
+const MIN_MOUSE_SWIPE_DISTANCE = 4;
 class CarouselContentComponent {
     /** Slides per view (minimum 1, can be fractional, e.g. 1.25 for peeking) */
     slidesPerView = input({ xs: 1 }, ...(ngDevMode ? [{ debugName: "slidesPerView", transform: (v) => breakpointInput(v) }] : [{ transform: (v) => breakpointInput(v) }]));
@@ -5779,6 +5787,15 @@ class CarouselContentComponent {
     fade = input(false, ...(ngDevMode ? [{ debugName: "fade" }] : []));
     /** Transition duration in ms */
     transitionMs = input(400, ...(ngDevMode ? [{ debugName: "transitionMs" }] : []));
+    /**
+     * How far a drag must go to move on, as a fraction (0–1) of the distance to the next
+     * position, which is one slide except for a shorter final step when not looping.
+     * Each position fully dragged past counts; a quick flick moves one position.
+     * @default 0.3
+     */
+    swipeThreshold = input(0.3, ...(ngDevMode ? [{ debugName: "swipeThreshold", transform: (value) => Math.min(Math.max(numberAttribute(value, 0.3), 0), 1) }] : [{
+            transform: (value) => Math.min(Math.max(numberAttribute(value, 0.3), 0), 1),
+        }]));
     /**
      * Whether navigation wraps around at the ends. When `false`, it stops at the
      * first and last reachable positions and disables the corresponding arrow.
@@ -5963,6 +5980,12 @@ class CarouselContentComponent {
     pendingFocus = false;
     startX = 0;
     startIndex = 0;
+    lastX = 0;
+    lastTime = 0;
+    /** Recent pointer positions, for measuring flick speed at release. */
+    samples = [];
+    /** The current drag's minimum swipe distance (px), set by its pointer type. */
+    minSwipeDistance = MIN_SWIPE_DISTANCE;
     ro;
     wheelTimeout;
     scrollDelta = 0;
@@ -6057,6 +6080,13 @@ class CarouselContentComponent {
         this.animate.set(false);
         this.startX = ev.clientX;
         this.startIndex = this.trackIndex();
+        this.lastX = ev.clientX;
+        this.lastTime = ev.timeStamp;
+        this.samples = [{ x: ev.clientX, t: ev.timeStamp }];
+        this.minSwipeDistance =
+            ev.pointerType === "mouse"
+                ? MIN_MOUSE_SWIPE_DISTANCE
+                : MIN_SWIPE_DISTANCE;
         if (this.loop()) {
             this.windowBase.set(Math.floor(this.startIndex));
         }
@@ -6066,6 +6096,12 @@ class CarouselContentComponent {
             return;
         }
         const dx = ev.clientX - this.startX;
+        this.lastX = ev.clientX;
+        this.lastTime = ev.timeStamp;
+        this.samples.push({ x: ev.clientX, t: ev.timeStamp });
+        while (this.samples[0].t < ev.timeStamp - FLICK_WINDOW) {
+            this.samples.shift();
+        }
         const cellWidth = (this.viewportWidth() -
             this.currentGap() * (this.currentSlidesPerView() - 1)) /
             this.currentSlidesPerView() +
@@ -6079,13 +6115,104 @@ class CarouselContentComponent {
         const clamped = Math.min(Math.max(targetIndex, min), max);
         this.trackIndex.set(clamped);
     }
-    onPointerUp() {
+    /**
+     * The browser ended the drag, e.g. to scroll the page, or capture was lost mid-drag:
+     * not a swipe, so return to where it started. After a normal release this is a no-op,
+     * as `lostpointercapture` follows `pointerup`.
+     */
+    onPointerCancel() {
         if (!this.dragging) {
             return;
         }
         this.dragging = false;
         this.animate.set(true);
-        this.trackIndex.set(this.snap(this.trackIndex()));
+        this.trackIndex.set(this.snap(this.startIndex));
+    }
+    onPointerUp(ev) {
+        if (!this.dragging) {
+            return;
+        }
+        // The pointer can move after the last pointermove; the release reports where it ended.
+        if (typeof ev?.clientX === "number") {
+            this.onPointerMove(ev);
+        }
+        this.dragging = false;
+        this.animate.set(true);
+        this.trackIndex.set(this.swipeTarget(ev?.timeStamp ?? this.lastTime));
+    }
+    /**
+     * Where a released drag settles. Walks stop position to stop position in the drag
+     * direction: each gap fully dragged moves on, and a partly dragged gap moves on once it
+     * reaches `swipeThreshold` of that gap (a bounded track's final gap can be short).
+     * A flick that did not move on otherwise moves one position.
+     */
+    swipeTarget(releasedAt) {
+        const dx = this.lastX - this.startX;
+        if (Math.abs(dx) < this.minSwipeDistance) {
+            return this.snap(this.startIndex);
+        }
+        // Take the direction from the pointer: at a bound the clamped track does not move.
+        const forward = dx < 0;
+        let remaining = Math.abs(this.trackIndex() - this.startIndex);
+        let position = this.startIndex;
+        let moved = false;
+        for (;;) {
+            const next = this.adjacentStop(position, forward);
+            const gap = Math.abs(next - position);
+            if (gap < EPSILON) {
+                break;
+            }
+            if (remaining >= gap - EPSILON) {
+                position = next;
+                remaining -= gap;
+                moved = true;
+                continue;
+            }
+            if (remaining > EPSILON &&
+                remaining >= gap * this.swipeThreshold() - EPSILON) {
+                position = next;
+                moved = true;
+            }
+            break;
+        }
+        if (!moved && this.isFlick(releasedAt)) {
+            return this.adjacentStop(this.startIndex, forward);
+        }
+        return moved ? position : this.snap(this.startIndex);
+    }
+    /** The next stop position after `position` in the given direction (itself at a bound). */
+    adjacentStop(position, forward) {
+        return forward
+            ? this.clampIndex(Math.floor(position + EPSILON) + 1)
+            : this.clampIndex(Math.ceil(position - EPSILON) - 1);
+    }
+    /**
+     * Whether the drag ended in a flick: at least `minSwipeDistance` of movement in the
+     * drag direction within the last `FLICK_WINDOW` ms before release, fast enough. Measuring
+     * up to the release lets a pause before the swipe pass and a hold after it slow it down.
+     */
+    isFlick(releasedAt) {
+        // Unmeasured, the gap alone would give a tiny cell width and make any drag a flick.
+        if (!this.viewportWidth()) {
+            return false;
+        }
+        const recent = this.samples.find((sample) => sample.t >= releasedAt - FLICK_WINDOW);
+        if (!recent) {
+            return false;
+        }
+        const distance = this.lastX - recent.x;
+        const elapsed = releasedAt - recent.t;
+        const sameDirection = Math.sign(distance) === Math.sign(this.lastX - this.startX);
+        if (elapsed <= 0 ||
+            !sameDirection ||
+            Math.abs(distance) < this.minSwipeDistance) {
+            return false;
+        }
+        const cellWidth = (this.viewportWidth() -
+            this.currentGap() * (this.currentSlidesPerView() - 1)) /
+            this.currentSlidesPerView() +
+            this.currentGap();
+        return Math.abs(distance) / cellWidth / elapsed > FLICK_VELOCITY;
     }
     ngAfterViewInit() {
         const viewport = this.host.nativeElement;
@@ -6213,7 +6340,7 @@ class CarouselContentComponent {
         }, 100);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CarouselContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: CarouselContentComponent, isStandalone: true, selector: "tedi-carousel-content", inputs: { slidesPerView: { classPropertyName: "slidesPerView", publicName: "slidesPerView", isSignal: true, isRequired: false, transformFunction: null }, gap: { classPropertyName: "gap", publicName: "gap", isSignal: true, isRequired: false, transformFunction: null }, fade: { classPropertyName: "fade", publicName: "fade", isSignal: true, isRequired: false, transformFunction: null }, transitionMs: { classPropertyName: "transitionMs", publicName: "transitionMs", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "tabindex": "0", "role": "region", "aria-roledescription": "carousel", "aria-live": "off" }, listeners: { "scroll": "onScroll()", "wheel": "onWheel($event)", "keydown": "onKeyDown($event)", "pointerdown": "onPointerDown($event)", "pointermove": "onPointerMove($event)", "pointerup": "onPointerUp()", "pointercancel": "onPointerUp()", "lostpointercapture": "onPointerUp()" }, properties: { "attr.aria-label": "resolvedAriaLabel()", "class": "classes()" } }, queries: [{ propertyName: "slides", predicate: CarouselSlideDirective, isSignal: true }], viewQueries: [{ propertyName: "track", first: true, predicate: ["track"], descendants: true, isSignal: true }, { propertyName: "slideElements", predicate: ["slide"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  #track\n  class=\"tedi-carousel__track\"\n  [style]=\"trackStyle()\"\n  (transitionend)=\"onTransitionEnd($event)\"\n>\n  @for (idx of renderedIndices(); track $index) {\n    <div\n      #slide\n      class=\"tedi-carousel__slide\"\n      [attr.role]=\"isSlideVisible($index) ? 'group' : 'presentation'\"\n      aria-roledescription=\"slide\"\n      [attr.aria-label]=\"\n        translationService.track('carousel.slide', idx + 1, slides().length)()\n      \"\n      [attr.aria-current]=\"$index === renderedActiveIndex() ? 'true' : null\"\n      [attr.aria-hidden]=\"isSlideVisible($index) ? null : 'true'\"\n      [attr.tabindex]=\"isSlideVisible($index) ? '-1' : null\"\n      [style.flex]=\"slideFlex()\"\n    >\n      <ng-container *ngTemplateOutlet=\"slides()[idx].template\"></ng-container>\n    </div>\n  }\n</div>\n", styles: [".tedi-carousel__content{position:relative;width:100%;overflow:hidden;overscroll-behavior:contain;touch-action:pan-y;cursor:grab}.tedi-carousel__content:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-03))}.tedi-carousel__content:active{cursor:grabbing}.tedi-carousel__content--fade-right{-webkit-mask-image:linear-gradient(to right,black 90%,transparent 100%);mask-image:linear-gradient(to right,black 90%,transparent 100%)}.tedi-carousel__content--fade-x{-webkit-mask-image:linear-gradient(to right,black 85%,transparent 100%),linear-gradient(to left,black 85%,transparent 100%);mask-image:linear-gradient(to right,black 85%,transparent 100%),linear-gradient(to left,black 85%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}.tedi-carousel__track{display:flex;will-change:transform}.tedi-carousel__slide{-webkit-user-select:none;user-select:none;scroll-snap-align:none;scroll-margin:0;-webkit-user-drag:none}.tedi-carousel__slide:focus{outline:none}.tedi-carousel__slide:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-03))}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: CarouselContentComponent, isStandalone: true, selector: "tedi-carousel-content", inputs: { slidesPerView: { classPropertyName: "slidesPerView", publicName: "slidesPerView", isSignal: true, isRequired: false, transformFunction: null }, gap: { classPropertyName: "gap", publicName: "gap", isSignal: true, isRequired: false, transformFunction: null }, fade: { classPropertyName: "fade", publicName: "fade", isSignal: true, isRequired: false, transformFunction: null }, transitionMs: { classPropertyName: "transitionMs", publicName: "transitionMs", isSignal: true, isRequired: false, transformFunction: null }, swipeThreshold: { classPropertyName: "swipeThreshold", publicName: "swipeThreshold", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "tabindex": "0", "role": "region", "aria-roledescription": "carousel", "aria-live": "off" }, listeners: { "scroll": "onScroll()", "wheel": "onWheel($event)", "keydown": "onKeyDown($event)", "pointerdown": "onPointerDown($event)", "pointermove": "onPointerMove($event)", "pointercancel": "onPointerCancel()", "lostpointercapture": "onPointerCancel()", "pointerup": "onPointerUp($event)" }, properties: { "attr.aria-label": "resolvedAriaLabel()", "class": "classes()" } }, queries: [{ propertyName: "slides", predicate: CarouselSlideDirective, isSignal: true }], viewQueries: [{ propertyName: "track", first: true, predicate: ["track"], descendants: true, isSignal: true }, { propertyName: "slideElements", predicate: ["slide"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  #track\n  class=\"tedi-carousel__track\"\n  [style]=\"trackStyle()\"\n  (transitionend)=\"onTransitionEnd($event)\"\n>\n  @for (idx of renderedIndices(); track $index) {\n    <div\n      #slide\n      class=\"tedi-carousel__slide\"\n      [attr.role]=\"isSlideVisible($index) ? 'group' : 'presentation'\"\n      aria-roledescription=\"slide\"\n      [attr.aria-label]=\"\n        translationService.track('carousel.slide', idx + 1, slides().length)()\n      \"\n      [attr.aria-current]=\"$index === renderedActiveIndex() ? 'true' : null\"\n      [attr.aria-hidden]=\"isSlideVisible($index) ? null : 'true'\"\n      [attr.tabindex]=\"isSlideVisible($index) ? '-1' : null\"\n      [style.flex]=\"slideFlex()\"\n    >\n      <ng-container *ngTemplateOutlet=\"slides()[idx].template\"></ng-container>\n    </div>\n  }\n</div>\n", styles: [".tedi-carousel__content{position:relative;width:100%;overflow:hidden;overscroll-behavior:contain;touch-action:pan-y;cursor:grab}.tedi-carousel__content:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-03))}.tedi-carousel__content:active{cursor:grabbing}.tedi-carousel__content--fade-right{-webkit-mask-image:linear-gradient(to right,black 90%,transparent 100%);mask-image:linear-gradient(to right,black 90%,transparent 100%)}.tedi-carousel__content--fade-x{-webkit-mask-image:linear-gradient(to right,black 85%,transparent 100%),linear-gradient(to left,black 85%,transparent 100%);mask-image:linear-gradient(to right,black 85%,transparent 100%),linear-gradient(to left,black 85%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}.tedi-carousel__track{display:flex;will-change:transform}.tedi-carousel__slide{-webkit-user-select:none;user-select:none;scroll-snap-align:none;scroll-margin:0;-webkit-user-drag:none}.tedi-carousel__slide:focus{outline:none}.tedi-carousel__slide:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-03))}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CarouselContentComponent, decorators: [{
             type: Component,
@@ -6225,7 +6352,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "aria-live": "off",
                         "[class]": "classes()",
                     }, template: "<div\n  #track\n  class=\"tedi-carousel__track\"\n  [style]=\"trackStyle()\"\n  (transitionend)=\"onTransitionEnd($event)\"\n>\n  @for (idx of renderedIndices(); track $index) {\n    <div\n      #slide\n      class=\"tedi-carousel__slide\"\n      [attr.role]=\"isSlideVisible($index) ? 'group' : 'presentation'\"\n      aria-roledescription=\"slide\"\n      [attr.aria-label]=\"\n        translationService.track('carousel.slide', idx + 1, slides().length)()\n      \"\n      [attr.aria-current]=\"$index === renderedActiveIndex() ? 'true' : null\"\n      [attr.aria-hidden]=\"isSlideVisible($index) ? null : 'true'\"\n      [attr.tabindex]=\"isSlideVisible($index) ? '-1' : null\"\n      [style.flex]=\"slideFlex()\"\n    >\n      <ng-container *ngTemplateOutlet=\"slides()[idx].template\"></ng-container>\n    </div>\n  }\n</div>\n", styles: [".tedi-carousel__content{position:relative;width:100%;overflow:hidden;overscroll-behavior:contain;touch-action:pan-y;cursor:grab}.tedi-carousel__content:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-03))}.tedi-carousel__content:active{cursor:grabbing}.tedi-carousel__content--fade-right{-webkit-mask-image:linear-gradient(to right,black 90%,transparent 100%);mask-image:linear-gradient(to right,black 90%,transparent 100%)}.tedi-carousel__content--fade-x{-webkit-mask-image:linear-gradient(to right,black 85%,transparent 100%),linear-gradient(to left,black 85%,transparent 100%);mask-image:linear-gradient(to right,black 85%,transparent 100%),linear-gradient(to left,black 85%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}.tedi-carousel__track{display:flex;will-change:transform}.tedi-carousel__slide{-webkit-user-select:none;user-select:none;scroll-snap-align:none;scroll-margin:0;-webkit-user-drag:none}.tedi-carousel__slide:focus{outline:none}.tedi-carousel__slide:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-03))}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { slidesPerView: [{ type: i0.Input, args: [{ isSignal: true, alias: "slidesPerView", required: false }] }], gap: [{ type: i0.Input, args: [{ isSignal: true, alias: "gap", required: false }] }], fade: [{ type: i0.Input, args: [{ isSignal: true, alias: "fade", required: false }] }], transitionMs: [{ type: i0.Input, args: [{ isSignal: true, alias: "transitionMs", required: false }] }], loop: [{ type: i0.Input, args: [{ isSignal: true, alias: "loop", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], track: [{ type: i0.ViewChild, args: ["track", { isSignal: true }] }], slideElements: [{ type: i0.ViewChildren, args: ["slide", { isSignal: true }] }], slides: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => CarouselSlideDirective), { isSignal: true }] }], onScroll: [{
+        }], ctorParameters: () => [], propDecorators: { slidesPerView: [{ type: i0.Input, args: [{ isSignal: true, alias: "slidesPerView", required: false }] }], gap: [{ type: i0.Input, args: [{ isSignal: true, alias: "gap", required: false }] }], fade: [{ type: i0.Input, args: [{ isSignal: true, alias: "fade", required: false }] }], transitionMs: [{ type: i0.Input, args: [{ isSignal: true, alias: "transitionMs", required: false }] }], swipeThreshold: [{ type: i0.Input, args: [{ isSignal: true, alias: "swipeThreshold", required: false }] }], loop: [{ type: i0.Input, args: [{ isSignal: true, alias: "loop", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], track: [{ type: i0.ViewChild, args: ["track", { isSignal: true }] }], slideElements: [{ type: i0.ViewChildren, args: ["slide", { isSignal: true }] }], slides: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => CarouselSlideDirective), { isSignal: true }] }], onScroll: [{
                 type: HostListener,
                 args: ["scroll"]
             }], onWheel: [{
@@ -6240,15 +6367,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
             }], onPointerMove: [{
                 type: HostListener,
                 args: ["pointermove", ["$event"]]
-            }], onPointerUp: [{
-                type: HostListener,
-                args: ["pointerup"]
-            }, {
+            }], onPointerCancel: [{
                 type: HostListener,
                 args: ["pointercancel"]
             }, {
                 type: HostListener,
                 args: ["lostpointercapture"]
+            }], onPointerUp: [{
+                type: HostListener,
+                args: ["pointerup", ["$event"]]
             }] } });
 class CarouselComponent {
@@ -7232,11 +7359,11 @@ class CalendarMonthGridComponent {
         this.monthSelect.emit(this.monthDate(index));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CalendarMonthGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: CalendarMonthGridComponent, isStandalone: true, selector: "tedi-calendar-month-grid", inputs: { year: { classPropertyName: "year", publicName: "year", isSignal: true, isRequired: true, transformFunction: null }, selectedMonth: { classPropertyName: "selectedMonth", publicName: "selectedMonth", isSignal: true, isRequired: false, transformFunction: null }, localeCode: { classPropertyName: "localeCode", publicName: "localeCode", isSignal: true, isRequired: false, transformFunction: null }, monthNameFormat: { classPropertyName: "monthNameFormat", publicName: "monthNameFormat", isSignal: true, isRequired: false, transformFunction: null }, isMonthDisabled: { classPropertyName: "isMonthDisabled", publicName: "isMonthDisabled", isSignal: true, isRequired: false, transformFunction: null }, inputDisabled: { classPropertyName: "inputDisabled", publicName: "inputDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { monthSelect: "monthSelect" }, ngImport: i0, template: "<div\n  class=\"tedi-calendar-month-grid\"\n  role=\"grid\"\n  [attr.aria-label]=\"gridAriaLabel()\"\n>\n  @for (row of rows(); track $index) {\n    <div class=\"tedi-calendar-month-grid__row\" role=\"row\">\n      @for (i of row; track i) {\n        <div class=\"tedi-calendar-month-grid__cell\" role=\"gridcell\">\n          <button\n            type=\"button\"\n            class=\"tedi-calendar-month-grid__month\"\n            [class.tedi-calendar-month-grid__month--selected]=\"isSelected(i)\"\n            [class.tedi-calendar-month-grid__month--current]=\"isCurrent(i)\"\n            [class.tedi-calendar-month-grid__month--disabled]=\"isDisabled(i)\"\n            [attr.aria-label]=\"monthLongNames()[i]\"\n            [attr.aria-selected]=\"isSelected(i) ? 'true' : null\"\n            [attr.aria-disabled]=\"isDisabled(i) ? 'true' : null\"\n            (click)=\"handleClick(i)\"\n          >\n            {{ monthNames()[i] }}\n          </button>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-calendar-month-grid{display:flex;flex-direction:column;gap:var(--layout-grid-gutters-08);width:100%;margin-top:var(--card-padding-md-default)}.tedi-calendar-month-grid__row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--layout-grid-gutters-08)}.tedi-calendar-month-grid__cell{display:flex}.tedi-calendar-month-grid__month{display:flex;flex:1;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-checkbox-radio-card-primary-default-text);cursor:pointer;background:var(--form-checkbox-radio-card-secondary-default-background);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-card-secondary-default-border);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-calendar-month-grid__month:hover{color:var(--form-checkbox-radio-card-secondary-hover-text);background:var(--form-checkbox-radio-card-secondary-hover-background);border-color:var(--form-checkbox-radio-card-secondary-hover-border)}.tedi-calendar-month-grid__month:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-calendar-month-grid__month--current{border-color:var(--form-datepicker-today-border)}.tedi-calendar-month-grid__month--selected{color:var(--form-checkbox-radio-card-secondary-selected-text);background:var(--form-checkbox-radio-card-secondary-selected-background);border-color:var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-selected-border)}.tedi-calendar-month-grid__month--disabled,.tedi-calendar-month-grid__month[aria-disabled=true]{color:var(--form-checkbox-radio-card-secondary-disabled-default-text);pointer-events:none;cursor:not-allowed;background:var(--form-checkbox-radio-card-secondary-disabled-default-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-default-border)}.tedi-calendar-month-grid__month--selected.tedi-calendar-month-grid__month--disabled{color:var(--form-checkbox-radio-card-secondary-disabled-selected-text);background:var(--form-checkbox-radio-card-secondary-disabled-selected-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-disabled-selected-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: CalendarMonthGridComponent, isStandalone: true, selector: "tedi-calendar-month-grid", inputs: { year: { classPropertyName: "year", publicName: "year", isSignal: true, isRequired: true, transformFunction: null }, selectedMonth: { classPropertyName: "selectedMonth", publicName: "selectedMonth", isSignal: true, isRequired: false, transformFunction: null }, localeCode: { classPropertyName: "localeCode", publicName: "localeCode", isSignal: true, isRequired: false, transformFunction: null }, monthNameFormat: { classPropertyName: "monthNameFormat", publicName: "monthNameFormat", isSignal: true, isRequired: false, transformFunction: null }, isMonthDisabled: { classPropertyName: "isMonthDisabled", publicName: "isMonthDisabled", isSignal: true, isRequired: false, transformFunction: null }, inputDisabled: { classPropertyName: "inputDisabled", publicName: "inputDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { monthSelect: "monthSelect" }, ngImport: i0, template: "<div\n  class=\"tedi-calendar-month-grid\"\n  role=\"grid\"\n  [attr.aria-label]=\"gridAriaLabel()\"\n>\n  @for (row of rows(); track $index) {\n    <div class=\"tedi-calendar-month-grid__row\" role=\"row\">\n      @for (i of row; track i) {\n        <div class=\"tedi-calendar-month-grid__cell\" role=\"gridcell\">\n          <button\n            type=\"button\"\n            class=\"tedi-calendar-month-grid__month\"\n            [class.tedi-calendar-month-grid__month--selected]=\"isSelected(i)\"\n            [class.tedi-calendar-month-grid__month--current]=\"isCurrent(i)\"\n            [class.tedi-calendar-month-grid__month--disabled]=\"isDisabled(i)\"\n            [attr.aria-label]=\"monthLongNames()[i]\"\n            [attr.aria-selected]=\"isSelected(i) ? 'true' : null\"\n            [attr.aria-disabled]=\"isDisabled(i) ? 'true' : null\"\n            (click)=\"handleClick(i)\"\n          >\n            {{ monthNames()[i] }}\n          </button>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-calendar-month-grid{display:flex;flex-direction:column;gap:var(--layout-grid-gutters-08);width:100%;margin-top:var(--card-padding-md-default)}.tedi-calendar-month-grid__row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--layout-grid-gutters-08)}.tedi-calendar-month-grid__cell{display:flex}.tedi-calendar-month-grid__month{display:flex;flex:1;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-choice-card-primary-unselected-text-default);cursor:pointer;background:var(--form-choice-card-secondary-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-card-secondary-unselected-border-default);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-calendar-month-grid__month:hover{color:var(--form-choice-card-secondary-unselected-text-hover);background:var(--form-choice-card-secondary-unselected-background-hover);border-color:var(--form-choice-card-secondary-unselected-border-hover)}.tedi-calendar-month-grid__month:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-calendar-month-grid__month--current{border-color:var(--form-datepicker-today-border)}.tedi-calendar-month-grid__month--selected{color:var(--form-choice-card-secondary-selected-text-default);background:var(--form-choice-card-secondary-selected-background-default);border-color:var(--form-choice-card-secondary-selected-border-default);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-default)}.tedi-calendar-month-grid__month--disabled,.tedi-calendar-month-grid__month[aria-disabled=true]{color:var(--form-choice-card-secondary-unselected-text-disabled);pointer-events:none;cursor:not-allowed;background:var(--form-choice-card-secondary-unselected-background-disabled);border-color:var(--form-choice-card-secondary-unselected-border-disabled)}.tedi-calendar-month-grid__month--selected.tedi-calendar-month-grid__month--disabled{color:var(--form-choice-card-secondary-selected-text-disabled);background:var(--form-choice-card-secondary-selected-background-disabled);border-color:var(--form-choice-card-secondary-selected-border-disabled);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-disabled)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CalendarMonthGridComponent, decorators: [{
             type: Component,
-            args: [{ selector: "tedi-calendar-month-grid", standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"tedi-calendar-month-grid\"\n  role=\"grid\"\n  [attr.aria-label]=\"gridAriaLabel()\"\n>\n  @for (row of rows(); track $index) {\n    <div class=\"tedi-calendar-month-grid__row\" role=\"row\">\n      @for (i of row; track i) {\n        <div class=\"tedi-calendar-month-grid__cell\" role=\"gridcell\">\n          <button\n            type=\"button\"\n            class=\"tedi-calendar-month-grid__month\"\n            [class.tedi-calendar-month-grid__month--selected]=\"isSelected(i)\"\n            [class.tedi-calendar-month-grid__month--current]=\"isCurrent(i)\"\n            [class.tedi-calendar-month-grid__month--disabled]=\"isDisabled(i)\"\n            [attr.aria-label]=\"monthLongNames()[i]\"\n            [attr.aria-selected]=\"isSelected(i) ? 'true' : null\"\n            [attr.aria-disabled]=\"isDisabled(i) ? 'true' : null\"\n            (click)=\"handleClick(i)\"\n          >\n            {{ monthNames()[i] }}\n          </button>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-calendar-month-grid{display:flex;flex-direction:column;gap:var(--layout-grid-gutters-08);width:100%;margin-top:var(--card-padding-md-default)}.tedi-calendar-month-grid__row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--layout-grid-gutters-08)}.tedi-calendar-month-grid__cell{display:flex}.tedi-calendar-month-grid__month{display:flex;flex:1;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-checkbox-radio-card-primary-default-text);cursor:pointer;background:var(--form-checkbox-radio-card-secondary-default-background);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-card-secondary-default-border);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-calendar-month-grid__month:hover{color:var(--form-checkbox-radio-card-secondary-hover-text);background:var(--form-checkbox-radio-card-secondary-hover-background);border-color:var(--form-checkbox-radio-card-secondary-hover-border)}.tedi-calendar-month-grid__month:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-calendar-month-grid__month--current{border-color:var(--form-datepicker-today-border)}.tedi-calendar-month-grid__month--selected{color:var(--form-checkbox-radio-card-secondary-selected-text);background:var(--form-checkbox-radio-card-secondary-selected-background);border-color:var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-selected-border)}.tedi-calendar-month-grid__month--disabled,.tedi-calendar-month-grid__month[aria-disabled=true]{color:var(--form-checkbox-radio-card-secondary-disabled-default-text);pointer-events:none;cursor:not-allowed;background:var(--form-checkbox-radio-card-secondary-disabled-default-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-default-border)}.tedi-calendar-month-grid__month--selected.tedi-calendar-month-grid__month--disabled{color:var(--form-checkbox-radio-card-secondary-disabled-selected-text);background:var(--form-checkbox-radio-card-secondary-disabled-selected-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-disabled-selected-border)}\n"] }]
+            args: [{ selector: "tedi-calendar-month-grid", standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"tedi-calendar-month-grid\"\n  role=\"grid\"\n  [attr.aria-label]=\"gridAriaLabel()\"\n>\n  @for (row of rows(); track $index) {\n    <div class=\"tedi-calendar-month-grid__row\" role=\"row\">\n      @for (i of row; track i) {\n        <div class=\"tedi-calendar-month-grid__cell\" role=\"gridcell\">\n          <button\n            type=\"button\"\n            class=\"tedi-calendar-month-grid__month\"\n            [class.tedi-calendar-month-grid__month--selected]=\"isSelected(i)\"\n            [class.tedi-calendar-month-grid__month--current]=\"isCurrent(i)\"\n            [class.tedi-calendar-month-grid__month--disabled]=\"isDisabled(i)\"\n            [attr.aria-label]=\"monthLongNames()[i]\"\n            [attr.aria-selected]=\"isSelected(i) ? 'true' : null\"\n            [attr.aria-disabled]=\"isDisabled(i) ? 'true' : null\"\n            (click)=\"handleClick(i)\"\n          >\n            {{ monthNames()[i] }}\n          </button>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-calendar-month-grid{display:flex;flex-direction:column;gap:var(--layout-grid-gutters-08);width:100%;margin-top:var(--card-padding-md-default)}.tedi-calendar-month-grid__row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--layout-grid-gutters-08)}.tedi-calendar-month-grid__cell{display:flex}.tedi-calendar-month-grid__month{display:flex;flex:1;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-choice-card-primary-unselected-text-default);cursor:pointer;background:var(--form-choice-card-secondary-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-card-secondary-unselected-border-default);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-calendar-month-grid__month:hover{color:var(--form-choice-card-secondary-unselected-text-hover);background:var(--form-choice-card-secondary-unselected-background-hover);border-color:var(--form-choice-card-secondary-unselected-border-hover)}.tedi-calendar-month-grid__month:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-calendar-month-grid__month--current{border-color:var(--form-datepicker-today-border)}.tedi-calendar-month-grid__month--selected{color:var(--form-choice-card-secondary-selected-text-default);background:var(--form-choice-card-secondary-selected-background-default);border-color:var(--form-choice-card-secondary-selected-border-default);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-default)}.tedi-calendar-month-grid__month--disabled,.tedi-calendar-month-grid__month[aria-disabled=true]{color:var(--form-choice-card-secondary-unselected-text-disabled);pointer-events:none;cursor:not-allowed;background:var(--form-choice-card-secondary-unselected-background-disabled);border-color:var(--form-choice-card-secondary-unselected-border-disabled)}.tedi-calendar-month-grid__month--selected.tedi-calendar-month-grid__month--disabled{color:var(--form-choice-card-secondary-selected-text-disabled);background:var(--form-choice-card-secondary-selected-background-disabled);border-color:var(--form-choice-card-secondary-selected-border-disabled);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-disabled)}\n"] }]
         }], propDecorators: { year: [{ type: i0.Input, args: [{ isSignal: true, alias: "year", required: true }] }], selectedMonth: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedMonth", required: false }] }], localeCode: [{ type: i0.Input, args: [{ isSignal: true, alias: "localeCode", required: false }] }], monthNameFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "monthNameFormat", required: false }] }], isMonthDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isMonthDisabled", required: false }] }], inputDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputDisabled", required: false }] }], monthSelect: [{ type: i0.Output, args: ["monthSelect"] }] } });
 class CalendarYearGridComponent {
@@ -7290,11 +7417,11 @@ class CalendarYearGridComponent {
         this.yearSelect.emit(this.yearDate(year));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CalendarYearGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: CalendarYearGridComponent, isStandalone: true, selector: "tedi-calendar-year-grid", inputs: { pageStart: { classPropertyName: "pageStart", publicName: "pageStart", isSignal: true, isRequired: true, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, selectedYear: { classPropertyName: "selectedYear", publicName: "selectedYear", isSignal: true, isRequired: false, transformFunction: null }, isYearDisabled: { classPropertyName: "isYearDisabled", publicName: "isYearDisabled", isSignal: true, isRequired: false, transformFunction: null }, inputDisabled: { classPropertyName: "inputDisabled", publicName: "inputDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { yearSelect: "yearSelect" }, ngImport: i0, template: "<div\n  class=\"tedi-calendar-year-grid\"\n  role=\"grid\"\n  [attr.aria-label]=\"gridAriaLabel()\"\n>\n  @for (row of rows(); track $index) {\n    <div class=\"tedi-calendar-year-grid__row\" role=\"row\">\n      @for (entry of row; track entry.year) {\n        <div class=\"tedi-calendar-year-grid__cell\" role=\"gridcell\">\n          <button\n            type=\"button\"\n            class=\"tedi-calendar-year-grid__year\"\n            [class.tedi-calendar-year-grid__year--selected]=\"\n              isSelected(entry.year)\n            \"\n            [class.tedi-calendar-year-grid__year--current]=\"\n              isCurrent(entry.year)\n            \"\n            [class.tedi-calendar-year-grid__year--disabled]=\"\n              isDisabled(entry.year)\n            \"\n            [attr.aria-selected]=\"isSelected(entry.year) || null\"\n            [attr.aria-disabled]=\"isDisabled(entry.year) || null\"\n            (click)=\"handleClick(entry.year)\"\n          >\n            {{ entry.year }}\n          </button>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-calendar-year-grid{display:flex;flex-direction:column;gap:var(--layout-grid-gutters-08);width:100%;margin-top:var(--card-padding-md-default)}.tedi-calendar-year-grid__row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--layout-grid-gutters-08)}.tedi-calendar-year-grid__cell{display:flex}.tedi-calendar-year-grid__year{display:flex;flex:1;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-checkbox-radio-card-primary-default-text);cursor:pointer;background:var(--form-checkbox-radio-card-secondary-default-background);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-card-secondary-default-border);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-calendar-year-grid__year:hover{color:var(--form-checkbox-radio-card-secondary-hover-text);background:var(--form-checkbox-radio-card-secondary-hover-background);border-color:var(--form-checkbox-radio-card-secondary-hover-border)}.tedi-calendar-year-grid__year:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-calendar-year-grid__year--current{border-color:var(--form-datepicker-today-border)}.tedi-calendar-year-grid__year--selected{color:var(--form-checkbox-radio-card-secondary-selected-text);background:var(--form-checkbox-radio-card-secondary-selected-background);border-color:var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-selected-border)}.tedi-calendar-year-grid__year--disabled,.tedi-calendar-year-grid__year[aria-disabled=true]{color:var(--form-checkbox-radio-card-secondary-disabled-default-text);pointer-events:none;cursor:not-allowed;background:var(--form-checkbox-radio-card-secondary-disabled-default-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-default-border)}.tedi-calendar-year-grid__year--selected.tedi-calendar-year-grid__year--disabled{color:var(--form-checkbox-radio-card-secondary-disabled-selected-text);background:var(--form-checkbox-radio-card-secondary-disabled-selected-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-disabled-selected-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: CalendarYearGridComponent, isStandalone: true, selector: "tedi-calendar-year-grid", inputs: { pageStart: { classPropertyName: "pageStart", publicName: "pageStart", isSignal: true, isRequired: true, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, selectedYear: { classPropertyName: "selectedYear", publicName: "selectedYear", isSignal: true, isRequired: false, transformFunction: null }, isYearDisabled: { classPropertyName: "isYearDisabled", publicName: "isYearDisabled", isSignal: true, isRequired: false, transformFunction: null }, inputDisabled: { classPropertyName: "inputDisabled", publicName: "inputDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { yearSelect: "yearSelect" }, ngImport: i0, template: "<div\n  class=\"tedi-calendar-year-grid\"\n  role=\"grid\"\n  [attr.aria-label]=\"gridAriaLabel()\"\n>\n  @for (row of rows(); track $index) {\n    <div class=\"tedi-calendar-year-grid__row\" role=\"row\">\n      @for (entry of row; track entry.year) {\n        <div class=\"tedi-calendar-year-grid__cell\" role=\"gridcell\">\n          <button\n            type=\"button\"\n            class=\"tedi-calendar-year-grid__year\"\n            [class.tedi-calendar-year-grid__year--selected]=\"\n              isSelected(entry.year)\n            \"\n            [class.tedi-calendar-year-grid__year--current]=\"\n              isCurrent(entry.year)\n            \"\n            [class.tedi-calendar-year-grid__year--disabled]=\"\n              isDisabled(entry.year)\n            \"\n            [attr.aria-selected]=\"isSelected(entry.year) || null\"\n            [attr.aria-disabled]=\"isDisabled(entry.year) || null\"\n            (click)=\"handleClick(entry.year)\"\n          >\n            {{ entry.year }}\n          </button>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-calendar-year-grid{display:flex;flex-direction:column;gap:var(--layout-grid-gutters-08);width:100%;margin-top:var(--card-padding-md-default)}.tedi-calendar-year-grid__row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--layout-grid-gutters-08)}.tedi-calendar-year-grid__cell{display:flex}.tedi-calendar-year-grid__year{display:flex;flex:1;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-choice-card-primary-unselected-text-default);cursor:pointer;background:var(--form-choice-card-secondary-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-card-secondary-unselected-border-default);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-calendar-year-grid__year:hover{color:var(--form-choice-card-secondary-unselected-text-hover);background:var(--form-choice-card-secondary-unselected-background-hover);border-color:var(--form-choice-card-secondary-unselected-border-hover)}.tedi-calendar-year-grid__year:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-calendar-year-grid__year--current{border-color:var(--form-datepicker-today-border)}.tedi-calendar-year-grid__year--selected{color:var(--form-choice-card-secondary-selected-text-default);background:var(--form-choice-card-secondary-selected-background-default);border-color:var(--form-choice-card-secondary-selected-border-default);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-default)}.tedi-calendar-year-grid__year--disabled,.tedi-calendar-year-grid__year[aria-disabled=true]{color:var(--form-choice-card-secondary-unselected-text-disabled);pointer-events:none;cursor:not-allowed;background:var(--form-choice-card-secondary-unselected-background-disabled);border-color:var(--form-choice-card-secondary-unselected-border-disabled)}.tedi-calendar-year-grid__year--selected.tedi-calendar-year-grid__year--disabled{color:var(--form-choice-card-secondary-selected-text-disabled);background:var(--form-choice-card-secondary-selected-background-disabled);border-color:var(--form-choice-card-secondary-selected-border-disabled);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-disabled)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CalendarYearGridComponent, decorators: [{
             type: Component,
-            args: [{ selector: "tedi-calendar-year-grid", standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"tedi-calendar-year-grid\"\n  role=\"grid\"\n  [attr.aria-label]=\"gridAriaLabel()\"\n>\n  @for (row of rows(); track $index) {\n    <div class=\"tedi-calendar-year-grid__row\" role=\"row\">\n      @for (entry of row; track entry.year) {\n        <div class=\"tedi-calendar-year-grid__cell\" role=\"gridcell\">\n          <button\n            type=\"button\"\n            class=\"tedi-calendar-year-grid__year\"\n            [class.tedi-calendar-year-grid__year--selected]=\"\n              isSelected(entry.year)\n            \"\n            [class.tedi-calendar-year-grid__year--current]=\"\n              isCurrent(entry.year)\n            \"\n            [class.tedi-calendar-year-grid__year--disabled]=\"\n              isDisabled(entry.year)\n            \"\n            [attr.aria-selected]=\"isSelected(entry.year) || null\"\n            [attr.aria-disabled]=\"isDisabled(entry.year) || null\"\n            (click)=\"handleClick(entry.year)\"\n          >\n            {{ entry.year }}\n          </button>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-calendar-year-grid{display:flex;flex-direction:column;gap:var(--layout-grid-gutters-08);width:100%;margin-top:var(--card-padding-md-default)}.tedi-calendar-year-grid__row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--layout-grid-gutters-08)}.tedi-calendar-year-grid__cell{display:flex}.tedi-calendar-year-grid__year{display:flex;flex:1;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-checkbox-radio-card-primary-default-text);cursor:pointer;background:var(--form-checkbox-radio-card-secondary-default-background);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-card-secondary-default-border);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-calendar-year-grid__year:hover{color:var(--form-checkbox-radio-card-secondary-hover-text);background:var(--form-checkbox-radio-card-secondary-hover-background);border-color:var(--form-checkbox-radio-card-secondary-hover-border)}.tedi-calendar-year-grid__year:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-calendar-year-grid__year--current{border-color:var(--form-datepicker-today-border)}.tedi-calendar-year-grid__year--selected{color:var(--form-checkbox-radio-card-secondary-selected-text);background:var(--form-checkbox-radio-card-secondary-selected-background);border-color:var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-selected-border)}.tedi-calendar-year-grid__year--disabled,.tedi-calendar-year-grid__year[aria-disabled=true]{color:var(--form-checkbox-radio-card-secondary-disabled-default-text);pointer-events:none;cursor:not-allowed;background:var(--form-checkbox-radio-card-secondary-disabled-default-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-default-border)}.tedi-calendar-year-grid__year--selected.tedi-calendar-year-grid__year--disabled{color:var(--form-checkbox-radio-card-secondary-disabled-selected-text);background:var(--form-checkbox-radio-card-secondary-disabled-selected-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-disabled-selected-border)}\n"] }]
+            args: [{ selector: "tedi-calendar-year-grid", standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"tedi-calendar-year-grid\"\n  role=\"grid\"\n  [attr.aria-label]=\"gridAriaLabel()\"\n>\n  @for (row of rows(); track $index) {\n    <div class=\"tedi-calendar-year-grid__row\" role=\"row\">\n      @for (entry of row; track entry.year) {\n        <div class=\"tedi-calendar-year-grid__cell\" role=\"gridcell\">\n          <button\n            type=\"button\"\n            class=\"tedi-calendar-year-grid__year\"\n            [class.tedi-calendar-year-grid__year--selected]=\"\n              isSelected(entry.year)\n            \"\n            [class.tedi-calendar-year-grid__year--current]=\"\n              isCurrent(entry.year)\n            \"\n            [class.tedi-calendar-year-grid__year--disabled]=\"\n              isDisabled(entry.year)\n            \"\n            [attr.aria-selected]=\"isSelected(entry.year) || null\"\n            [attr.aria-disabled]=\"isDisabled(entry.year) || null\"\n            (click)=\"handleClick(entry.year)\"\n          >\n            {{ entry.year }}\n          </button>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-calendar-year-grid{display:flex;flex-direction:column;gap:var(--layout-grid-gutters-08);width:100%;margin-top:var(--card-padding-md-default)}.tedi-calendar-year-grid__row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--layout-grid-gutters-08)}.tedi-calendar-year-grid__cell{display:flex}.tedi-calendar-year-grid__year{display:flex;flex:1;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-choice-card-primary-unselected-text-default);cursor:pointer;background:var(--form-choice-card-secondary-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-card-secondary-unselected-border-default);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-calendar-year-grid__year:hover{color:var(--form-choice-card-secondary-unselected-text-hover);background:var(--form-choice-card-secondary-unselected-background-hover);border-color:var(--form-choice-card-secondary-unselected-border-hover)}.tedi-calendar-year-grid__year:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-calendar-year-grid__year--current{border-color:var(--form-datepicker-today-border)}.tedi-calendar-year-grid__year--selected{color:var(--form-choice-card-secondary-selected-text-default);background:var(--form-choice-card-secondary-selected-background-default);border-color:var(--form-choice-card-secondary-selected-border-default);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-default)}.tedi-calendar-year-grid__year--disabled,.tedi-calendar-year-grid__year[aria-disabled=true]{color:var(--form-choice-card-secondary-unselected-text-disabled);pointer-events:none;cursor:not-allowed;background:var(--form-choice-card-secondary-unselected-background-disabled);border-color:var(--form-choice-card-secondary-unselected-border-disabled)}.tedi-calendar-year-grid__year--selected.tedi-calendar-year-grid__year--disabled{color:var(--form-choice-card-secondary-selected-text-disabled);background:var(--form-choice-card-secondary-selected-background-disabled);border-color:var(--form-choice-card-secondary-selected-border-disabled);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-disabled)}\n"] }]
         }], propDecorators: { pageStart: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageStart", required: true }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], selectedYear: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedYear", required: false }] }], isYearDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isYearDisabled", required: false }] }], inputDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputDisabled", required: false }] }], yearSelect: [{ type: i0.Output, args: ["yearSelect"] }] } });
 class CalendarHeaderComponent {
@@ -10235,13 +10362,13 @@ class SelectComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: SelectComponent, isStandalone: true, selector: "tedi-select", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, showClearOnInteraction: { classPropertyName: "showClearOnInteraction", publicName: "showClearOnInteraction", isSignal: true, isRequired: false, transformFunction: null }, dropdownWidthRef: { classPropertyName: "dropdownWidthRef", publicName: "dropdownWidthRef", isSignal: true, isRequired: false, transformFunction: null }, dropdownAlign: { classPropertyName: "dropdownAlign", publicName: "dropdownAlign", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, allowMultiple: { classPropertyName: "allowMultiple", publicName: "allowMultiple", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, selectableGroups: { classPropertyName: "selectableGroups", publicName: "selectableGroups", isSignal: true, isRequired: false, transformFunction: null }, isTagRemovable: { classPropertyName: "isTagRemovable", publicName: "isTagRemovable", isSignal: true, isRequired: false, transformFunction: null }, multiRow: { classPropertyName: "multiRow", publicName: "multiRow", isSignal: true, isRequired: false, transformFunction: null }, tagEllipsis: { classPropertyName: "tagEllipsis", publicName: "tagEllipsis", isSignal: true, isRequired: false, transformFunction: null }, ellipsis: { classPropertyName: "ellipsis", publicName: "ellipsis", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, disabledKey: { classPropertyName: "disabledKey", publicName: "disabledKey", isSignal: true, isRequired: false, transformFunction: null }, noOptionsMessage: { classPropertyName: "noOptionsMessage", publicName: "noOptionsMessage", isSignal: true, isRequired: false, transformFunction: null }, maxDropdownHeight: { classPropertyName: "maxDropdownHeight", publicName: "maxDropdownHeight", isSignal: true, isRequired: false, transformFunction: null }, hideOnScroll: { classPropertyName: "hideOnScroll", publicName: "hideOnScroll", isSignal: true, isRequired: false, transformFunction: null }, dropdownType: { classPropertyName: "dropdownType", publicName: "dropdownType", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualItemSize: { classPropertyName: "virtualItemSize", publicName: "virtualItemSize", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, searchFn: { classPropertyName: "searchFn", publicName: "searchFn", isSignal: true, isRequired: false, transformFunction: null }, clearSearchOnSelect: { classPropertyName: "clearSearchOnSelect", publicName: "clearSearchOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", searchChange: "searchChange", opened: "opened", closed: "closed", cleared: "cleared" }, host: { listeners: { "window:resize": "onWindowResize()", "document:click": "onDocumentClick($event)" }, properties: { "class.tedi-select--multiselect": "allowMultiple()", "class.tedi-select--clear-on-interaction": "showClearOnInteraction() && clearable() && !!selectedValues().length" }, classAttribute: "tedi-select" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: SelectComponent, isStandalone: true, selector: "tedi-select", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, showClearOnInteraction: { classPropertyName: "showClearOnInteraction", publicName: "showClearOnInteraction", isSignal: true, isRequired: false, transformFunction: null }, dropdownWidthRef: { classPropertyName: "dropdownWidthRef", publicName: "dropdownWidthRef", isSignal: true, isRequired: false, transformFunction: null }, dropdownAlign: { classPropertyName: "dropdownAlign", publicName: "dropdownAlign", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, allowMultiple: { classPropertyName: "allowMultiple", publicName: "allowMultiple", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, selectableGroups: { classPropertyName: "selectableGroups", publicName: "selectableGroups", isSignal: true, isRequired: false, transformFunction: null }, isTagRemovable: { classPropertyName: "isTagRemovable", publicName: "isTagRemovable", isSignal: true, isRequired: false, transformFunction: null }, multiRow: { classPropertyName: "multiRow", publicName: "multiRow", isSignal: true, isRequired: false, transformFunction: null }, tagEllipsis: { classPropertyName: "tagEllipsis", publicName: "tagEllipsis", isSignal: true, isRequired: false, transformFunction: null }, ellipsis: { classPropertyName: "ellipsis", publicName: "ellipsis", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, disabledKey: { classPropertyName: "disabledKey", publicName: "disabledKey", isSignal: true, isRequired: false, transformFunction: null }, noOptionsMessage: { classPropertyName: "noOptionsMessage", publicName: "noOptionsMessage", isSignal: true, isRequired: false, transformFunction: null }, maxDropdownHeight: { classPropertyName: "maxDropdownHeight", publicName: "maxDropdownHeight", isSignal: true, isRequired: false, transformFunction: null }, hideOnScroll: { classPropertyName: "hideOnScroll", publicName: "hideOnScroll", isSignal: true, isRequired: false, transformFunction: null }, dropdownType: { classPropertyName: "dropdownType", publicName: "dropdownType", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualItemSize: { classPropertyName: "virtualItemSize", publicName: "virtualItemSize", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, searchFn: { classPropertyName: "searchFn", publicName: "searchFn", isSignal: true, isRequired: false, transformFunction: null }, clearSearchOnSelect: { classPropertyName: "clearSearchOnSelect", publicName: "clearSearchOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", searchChange: "searchChange", opened: "opened", closed: "closed", cleared: "cleared" }, host: { listeners: { "window:resize": "onWindowResize()", "document:click": "onDocumentClick($event)" }, properties: { "class.tedi-select--multiselect": "allowMultiple()", "class.tedi-select--clear-on-interaction": "showClearOnInteraction() && clearable() && !disabled() && !!selectedValues().length" }, classAttribute: "tedi-select" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => SelectComponent),
                 multi: true,
             },
-        ], queries: [{ propertyName: "optionTemplate", first: true, predicate: SelectOptionTemplateDirective, descendants: true, isSignal: true }, { propertyName: "valueTemplate", first: true, predicate: SelectValueTemplateDirective, descendants: true, isSignal: true }, { propertyName: "tooltipTemplate", first: true, predicate: SelectTooltipTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "listboxRef", first: true, predicate: CdkListbox, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "cdkListboxRef", first: true, predicate: CdkListbox, descendants: true, isSignal: true }, { propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }, { propertyName: "virtualListboxRef", first: true, predicate: ["virtualListbox"], descendants: true, isSignal: true }, { propertyName: "connectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true, isSignal: true }, { propertyName: "triggerRef", first: true, predicate: ["trigger"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "searchInputRef", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }, { propertyName: "multiselectContainerRef", first: true, predicate: ["multiselectContainer"], descendants: true, isSignal: true }, { propertyName: "tagRefs", predicate: ["tagElement"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@if (label()) {\n  <tedi-label-row>\n    <label\n      [id]=\"labelId()\"\n      tedi-label\n      [for]=\"inputId()\"\n      [required]=\"required()\"\n      [size]=\"size()\"\n      (click)=\"onTriggerClick()\"\n    >\n      {{ label() }}\n    </label>\n    @if (tooltipTemplate()?.template; as tooltipTpl) {\n      <tedi-info-tooltip>\n        <ng-container [ngTemplateOutlet]=\"tooltipTpl\" />\n      </tedi-info-tooltip>\n    } @else if (tooltip(); as tooltipText) {\n      <tedi-info-tooltip>{{ tooltipText }}</tedi-info-tooltip>\n    }\n  </tedi-label-row>\n}\n<div\n  [id]=\"searchable() ? null : inputId()\"\n  class=\"tedi-select__trigger tedi-input\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  [class.tedi-input--small]=\"size() === 'small'\"\n  [class.tedi-input--error]=\"state() === 'error'\"\n  [class.tedi-input--valid]=\"state() === 'valid'\"\n  [class.tedi-select__trigger--searchable]=\"searchable()\"\n  [class.tedi-select__trigger--search-focused]=\"searchFocused()\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  [attr.role]=\"searchable() ? null : 'combobox'\"\n  [attr.aria-haspopup]=\"searchable() ? null : 'listbox'\"\n  [attr.aria-expanded]=\"searchable() ? null : isOpen()\"\n  [attr.aria-controls]=\"!searchable() && isOpen() ? listboxId() : null\"\n  [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n  [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n  [attr.aria-invalid]=\"!searchable() ? isInvalid() || null : null\"\n  [attr.aria-describedby]=\"!searchable() ? feedbackId() : null\"\n  [tabindex]=\"searchable() || disabled() ? -1 : 0\"\n  (click)=\"onTriggerClick()\"\n  (keydown.enter)=\"onTriggerEnter()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  @if (searchable()) {\n    <div class=\"tedi-select__search-wrapper\">\n      @if (showSingleSelectedValue()) {\n        <span class=\"tedi-select__selected-value\">\n          @if (valueTemplate(); as tpl) {\n            @if (selectedOptions()[0]; as option) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"getValueContext(option)\"\n              />\n            }\n          } @else {\n            {{ selectedLabels().join(\", \") }}\n          }\n        </span>\n      }\n      @if (allowMultiple() && selectedValues().length) {\n        <ng-container\n          [ngTemplateOutlet]=\"multiselectTags\"\n          [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n        />\n      } @else {\n        <input\n          #searchInput\n          [id]=\"inputId()\"\n          type=\"text\"\n          class=\"tedi-select__search-input\"\n          [class.tedi-select__search-input--hidden]=\"showSingleSelectedValue()\"\n          [placeholder]=\"showSingleSelectedValue() ? '' : placeholder()\"\n          [value]=\"searchTerm()\"\n          [disabled]=\"disabled()\"\n          (input)=\"onSearchInput($event)\"\n          (focus)=\"onSearchFocus()\"\n          (blur)=\"onSearchBlur()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          autocomplete=\"off\"\n          role=\"combobox\"\n          aria-autocomplete=\"list\"\n          [attr.aria-expanded]=\"isOpen()\"\n          [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n          [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n          [attr.aria-label]=\"resolvedAriaLabel()\"\n          [attr.aria-invalid]=\"isInvalid() || null\"\n          [attr.aria-describedby]=\"feedbackId()\"\n        />\n      }\n    </div>\n  } @else {\n    <span class=\"tedi-select__label\">\n      @if (selectedValues().length) {\n        @if (allowMultiple()) {\n          <ng-container\n            [ngTemplateOutlet]=\"multiselectTags\"\n            [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n          />\n        } @else if (ellipsis(); as ellipsisPos) {\n          <tedi-ellipsis [position]=\"ellipsisPos\" [lineClamp]=\"1\">\n            <ng-container [ngTemplateOutlet]=\"singleValue\" />\n          </tedi-ellipsis>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"singleValue\" />\n        }\n      } @else {\n        <span class=\"tedi-select__label--placeholder\">\n          {{ placeholder() }}\n        </span>\n      }\n    </span>\n  }\n\n  @if (clearable() && selectedValues().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'clear' | tediTranslate\"\n      (click)=\"clear($event)\"\n      (keydown.enter)=\"clear($event)\"\n      (keydown.space)=\"clear($event)\"\n      [attr.aria-describedby]=\"label() ? labelId() : null\"\n    ></button>\n  }\n\n  <span\n    class=\"tedi-select__arrow\"\n    aria-hidden=\"true\"\n    (click)=\"onArrowClick($event)\"\n  >\n    <tedi-icon name=\"arrow_drop_down\" />\n  </span>\n</div>\n@if (name(); as fieldName) {\n  @for (formValue of formValues(); track $index) {\n    <input\n      type=\"hidden\"\n      [name]=\"fieldName\"\n      [value]=\"formValue\"\n      [disabled]=\"disabled()\"\n    />\n  }\n}\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [id]=\"feedbackId()\"\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template #singleValue>\n  @if (valueTemplate(); as tpl) {\n    @if (selectedOptions()[0]; as option) {\n      <ng-container\n        [ngTemplateOutlet]=\"tpl.template\"\n        [ngTemplateOutletContext]=\"getValueContext(option)\"\n      />\n    }\n  } @else {\n    {{ selectedLabels().join(\", \") }}\n  }\n</ng-template>\n\n<ng-template #multiselectTags>\n  <div\n    class=\"tedi-select__multiselect-container\"\n    [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n    [class.tedi-select__multiselect-container--ellipsis]=\"tagEllipsis()\"\n    #multiselectContainer\n  >\n    @if (multiRow()) {\n      @for (value of selectedValues(); track value) {\n        <tedi-tag\n          [ellipsis]=\"tagEllipsis()\"\n          [closable]=\"isTagRemovable()\"\n          (closed)=\"deselect($event, value)\"\n        >\n          {{ getLabel(value) }}\n        </tedi-tag>\n      }\n    } @else {\n      <div class=\"tedi-select__multiselect-tags\">\n        @for (value of selectedValues(); track value; let i = $index) {\n          @if (visibleTagsCount() === null || i < visibleTagsCount()!) {\n            <tedi-tag\n              #tagElement\n              [ellipsis]=\"tagEllipsis()\"\n              [closable]=\"isTagRemovable()\"\n              (closed)=\"deselect($event, value)\"\n            >\n              {{ getLabel(value) }}\n            </tedi-tag>\n          }\n        }\n      </div>\n      @if (hiddenTagsCount() > 0) {\n        <tedi-tag class=\"tedi-select__multiselect-counter\"\n          >+{{ hiddenTagsCount() }}</tedi-tag\n        >\n      }\n    }\n    @if (searchable()) {\n      <input\n        #searchInput\n        [id]=\"inputId()\"\n        type=\"text\"\n        class=\"tedi-select__search-input\"\n        [value]=\"searchTerm()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onSearchInput($event)\"\n        (focus)=\"onSearchFocus()\"\n        (blur)=\"onSearchBlur()\"\n        (keydown)=\"onSearchKeydown($event)\"\n        autocomplete=\"off\"\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n        [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n        [attr.aria-label]=\"resolvedAriaLabel()\"\n        [attr.aria-invalid]=\"isInvalid() || null\"\n        [attr.aria-describedby]=\"feedbackId()\"\n      />\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"dropdownPositions()\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n  (attach)=\"onOverlayAttached()\"\n  (detach)=\"toggleIsOpen(true)\"\n>\n  <div\n    class=\"tedi-select__dropdown\"\n    [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n    [style.max-height]=\"dropdownMaxHeight() ? dropdownMaxHeight() + 'px' : null\"\n  >\n    @if (virtualize()) {\n      <div\n        #virtualListbox\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options tedi-select__options--virtual\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        role=\"listbox\"\n        [attr.aria-multiselectable]=\"allowMultiple() ? true : null\"\n        [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n        [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n        [attr.aria-activedescendant]=\"activeDescendantId()\"\n        [tabindex]=\"searchable() ? -1 : 0\"\n        (keydown)=\"onVirtualListboxKeydown($event)\"\n      >\n        @if (filteredOptions().length) {\n          @if (showSelectAllRow()) {\n            <div\n              class=\"tedi-dropdown-item\"\n              [id]=\"listboxId() + '-select-all'\"\n              role=\"option\"\n              [attr.aria-selected]=\"allOptionsSelected()\"\n              [class.tedi-dropdown-item--active]=\"activeIndex() === 0\"\n              (click)=\"onVirtualSelectAllClick()\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </div>\n          }\n          <cdk-virtual-scroll-viewport\n            class=\"tedi-select__viewport\"\n            [itemSize]=\"virtualRowHeight()\"\n            [style.height.px]=\"virtualViewportHeight()\"\n            [minBufferPx]=\"virtualRowHeight() * 6\"\n            [maxBufferPx]=\"virtualRowHeight() * 12\"\n          >\n            <div\n              *cdkVirtualFor=\"\n                let option of filteredOptions();\n                let i = index;\n                trackBy: trackByOptionValue\n              \"\n              class=\"tedi-dropdown-item\"\n              [id]=\"virtualOptionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"isOptionSelected(option.value)\"\n              [attr.aria-disabled]=\"option.disabled ? true : null\"\n              [class.tedi-dropdown-item--selected]=\"\n                !allowMultiple() && isOptionSelected(option.value)\n              \"\n              [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n              [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n              [class.tedi-dropdown-item--active]=\"\n                activeIndex() - (showSelectAllRow() ? 1 : 0) === i\n              \"\n              (click)=\"onVirtualOptionClick(option)\"\n            >\n              @if (optionTemplate(); as tpl) {\n                <ng-container\n                  [ngTemplateOutlet]=\"tpl.template\"\n                  [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                />\n              } @else {\n                <tedi-dropdown-item-value\n                  [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              }\n            </div>\n          </cdk-virtual-scroll-viewport>\n        } @else {\n          <div\n            class=\"tedi-dropdown-item tedi-select__no-options\"\n            role=\"option\"\n            aria-disabled=\"true\"\n          >\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </div>\n        }\n      </div>\n    } @else {\n      <ul\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        [class.tedi-select__options--swatch-grid]=\"dropdownType() === 'grid'\"\n        cdkListbox\n        [cdkListboxMultiple]=\"allowMultiple()\"\n        [cdkListboxValue]=\"visibleSelectedValues()\"\n        [cdkListboxNavigatesDisabledOptions]=\"false\"\n        [cdkListboxUseActiveDescendant]=\"true\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        (keydown.tab)=\"toggleIsOpen(true)\"\n        (keydown.escape)=\"toggleIsOpen(true)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (filteredOptions().length) {\n          @if (allowMultiple() && showSelectAll()) {\n            <li\n              class=\"tedi-dropdown-item\"\n              [cdkOption]=\"SpecialOptionControls.SELECT_ALL\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </li>\n          }\n\n          @for (group of optionGroups(); track group.label) {\n            @if (group.label.length > 0) {\n              @if (allowMultiple() && selectableGroups()) {\n                <li\n                  class=\"tedi-dropdown-item tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"SpecialOptionControls.SELECT_GROUP + group.label\"\n                >\n                  <tedi-dropdown-item-value\n                    type=\"checkbox\"\n                    [selected]=\"isGroupSelected(group.label)\"\n                    [indeterminate]=\"isGroupIndeterminate(group.label)\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      group.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                </li>\n              } @else {\n                <li class=\"tedi-select__group-name\" role=\"presentation\">\n                  <span tedi-text color=\"tertiary\">\n                    {{ group.label }}\n                  </span>\n                </li>\n              }\n            }\n\n            @for (option of group.options; track option.value; let i = $index) {\n              <li\n                class=\"tedi-dropdown-item\"\n                [class.tedi-dropdown-item--selected]=\"\n                  !allowMultiple() && isOptionSelected(option.value)\n                \"\n                [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n                [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n                [cdkOption]=\"option.value\"\n                [cdkOptionDisabled]=\"option.disabled\"\n              >\n                @if (optionTemplate(); as tpl) {\n                  <ng-container\n                    [ngTemplateOutlet]=\"tpl.template\"\n                    [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                  />\n                } @else {\n                  <tedi-dropdown-item-value\n                    [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                    [selected]=\"isOptionSelected(option.value)\"\n                    [disabled]=\"!!option.disabled\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      option.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li class=\"tedi-dropdown-item tedi-select__no-options\">\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </li>\n        }\n      </ul>\n    }\n  </div>\n</ng-template>\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}.tedi-input{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);--_placeholder-color: var(--form-input-text-placeholder);--_search-input-reserve: 5rem;margin-bottom:0;font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled)}.tedi-input:hover{--_field-border-color: var(--form-input-border-hover)}.tedi-input:focus,.tedi-input:active,.tedi-input.tedi-select__trigger--search-focused{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input--disabled{--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);color:var(--form-input-text-disabled);pointer-events:none}.tedi-input--error:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(.tedi-input--disabled):focus,.tedi-input--error:not(.tedi-input--disabled):active,.tedi-input--error:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-input--valid:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(.tedi-input--disabled):focus,.tedi-input--valid:not(.tedi-input--disabled):active,.tedi-input--valid:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-select{display:block;width:100%}.tedi-select--clear-on-interaction .tedi-select__clear{visibility:hidden}.tedi-select--clear-on-interaction .tedi-select__clear+.tedi-select__arrow{border-left-color:transparent}.tedi-select--clear-on-interaction .tedi-select__trigger:hover .tedi-select__clear,.tedi-select--clear-on-interaction .tedi-select__trigger:active .tedi-select__clear,.tedi-select--clear-on-interaction .tedi-select__trigger:focus-within .tedi-select__clear{visibility:visible}.tedi-select--clear-on-interaction .tedi-select__trigger:hover .tedi-select__clear+.tedi-select__arrow,.tedi-select--clear-on-interaction .tedi-select__trigger:active .tedi-select__clear+.tedi-select__arrow,.tedi-select--clear-on-interaction .tedi-select__trigger:focus-within .tedi-select__clear+.tedi-select__arrow{border-left-color:var(--general-border-primary)}.tedi-select .tedi-feedback-text{margin-top:var(--form-field-outer-spacing)}.tedi-select__trigger{display:flex;justify-content:space-between;width:100%;cursor:pointer}.tedi-select__label{flex-grow:1;overflow:hidden;text-align:left;cursor:default}.tedi-select__label--placeholder{color:var(--_placeholder-color);pointer-events:none}.tedi-select__clear{flex-grow:0;padding:0;margin:0;color:var(--button-close-text-default);cursor:pointer;background:none;border:none}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{display:inline-flex;flex-grow:0;flex-shrink:0;align-items:center;padding-left:var(--form-field-inner-spacing);margin-left:var(--form-field-inner-spacing);color:inherit;cursor:default}.tedi-select__dropdown{display:flex;flex-direction:column;max-height:100%;margin-top:var(--form-field-outer-spacing);margin-bottom:var(--form-field-outer-spacing);background:var(--card-background-primary);border-radius:var(--card-radius-rounded);box-shadow:0 1px 5px 0 var(--tedi-alpha-20)}.tedi-select__trigger--searchable{cursor:text}.tedi-select__search-wrapper{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--body-regular-line-height);overflow:hidden}.tedi-select__selected-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.tedi-select__search-input{position:absolute;top:0;left:0;width:100%;height:100%;padding:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;background:transparent;border:none}.tedi-select__search-input:focus{outline:none}.tedi-select__search-input::placeholder{color:var(--form-input-text-placeholder)}.tedi-select__search-input--hidden{color:transparent;caret-color:var(--form-input-text-filled)}.tedi-select__search-input:not(.tedi-select__search-input--hidden){position:relative;flex:1 1 var(--_search-input-reserve);width:auto;min-width:0;height:auto}.tedi-select__options{flex:1;min-height:0;padding:0;margin:0;overflow-y:auto;outline:none}.tedi-select__options .tedi-dropdown-item{outline:none}.tedi-select__options .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled),.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--active:not(.tedi-dropdown-item--disabled){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-select__options .tedi-dropdown-item[aria-selected=true],.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-select__options .tedi-dropdown-item[aria-selected=true] .tedi-icon,.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected .tedi-icon{color:inherit}.tedi-select__options--virtual{display:flex;flex-direction:column;overflow:visible}.tedi-select__viewport{width:100%}.tedi-select__viewport .tedi-dropdown-item{box-sizing:border-box}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;padding:var(--dropdown-group-label-padding-y) var(--dropdown-group-label-padding-x) var(--layout-grid-gutters-04);font-size:var(--heading-subtitle-small-size);font-weight:var(--heading-subtitle-small-weight);line-height:var(--heading-subtitle-small-line-height);text-transform:uppercase;letter-spacing:0}.tedi-select__group-name--selectable{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);text-transform:none;letter-spacing:inherit}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left)}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);min-width:0}.tedi-select__multiselect-container--single-row{flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-tags{display:flex;flex:0 0 auto;gap:var(--form-field-inner-spacing);min-width:0;overflow:hidden}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-counter{flex-shrink:0}.tedi-select__multiselect-container--single-row.tedi-select__multiselect-container--ellipsis .tedi-select__multiselect-tags{flex:0 1 auto}.tedi-select__no-options{color:var(--general-text-tertiary);cursor:default}.tedi-select__no-options:hover{color:var(--general-text-tertiary);background:var(--dropdown-item-default-background)}.tedi-select__dropdown:has(.tedi-select__options--swatch-grid){width:fit-content}.tedi-select__options--swatch-grid{--tedi-swatch-size: 24px;--tedi-swatch-gap: var(--layout-grid-gutters-04);--tedi-swatch-columns: 11;display:grid;grid-template-columns:repeat(auto-fit,var(--tedi-swatch-size));gap:var(--tedi-swatch-gap);max-width:calc(var(--tedi-swatch-columns) * (var(--tedi-swatch-size) + var(--tedi-swatch-gap)));padding:var(--dropdown-body-padding-y) var(--dropdown-body-padding-x)}.tedi-select__options--swatch-grid .tedi-dropdown-item{display:flex;align-items:center;justify-content:center;width:var(--tedi-swatch-size);height:var(--tedi-swatch-size);min-height:auto;padding:var(--layout-grid-gutters-02);color:inherit;background:transparent;border-radius:var(--card-radius-rounded)}.tedi-select__options--swatch-grid .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled){outline-offset:0}.tedi-select__options--swatch-grid .tedi-dropdown-item[aria-selected=true],.tedi-select__options--swatch-grid .tedi-dropdown-item.tedi-dropdown-item--selected{color:inherit;background:transparent;border:var(--tedi-borders-02) solid var(--card-border-selected)}.tedi-select__options--swatch-grid .tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled){background:transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i1.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: CdkListboxModule }, { kind: "directive", type: i3.CdkListbox, selector: "[cdkListbox]", inputs: ["id", "tabindex", "cdkListboxValue", "cdkListboxMultiple", "cdkListboxDisabled", "cdkListboxUseActiveDescendant", "cdkListboxOrientation", "cdkListboxCompareWith", "cdkListboxNavigationWrapDisabled", "cdkListboxNavigatesDisabledOptions"], outputs: ["cdkListboxValueChange"], exportAs: ["cdkListbox"] }, { kind: "directive", type: i3.CdkOption, selector: "[cdkOption]", inputs: ["id", "cdkOption", "cdkOptionTypeaheadLabel", "cdkOptionDisabled", "tabindex"], exportAs: ["cdkOption"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: LabelComponent, selector: "[tedi-label]", inputs: ["size", "required", "color", "visuallyHidden"] }, { kind: "component", type: LabelRowComponent, selector: "tedi-label-row" }, { kind: "component", type: InfoTooltipComponent, selector: "tedi-info-tooltip", inputs: ["position", "openWith", "maxWidth", "color", "ariaLabel"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["id", "text", "type", "position"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: TagComponent, selector: "tedi-tag", inputs: ["loading", "closable", "type", "ellipsis"], outputs: ["closed"] }, { kind: "component", type: DropdownItemValueComponent, selector: "tedi-dropdown-item-value", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: DropdownItemValueLabelComponent, selector: "tedi-dropdown-item-value-label", inputs: ["clipContent"] }, { kind: "component", type: EllipsisComponent, selector: "tedi-ellipsis", inputs: ["lineClamp", "tooltip", "position"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], queries: [{ propertyName: "optionTemplate", first: true, predicate: SelectOptionTemplateDirective, descendants: true, isSignal: true }, { propertyName: "valueTemplate", first: true, predicate: SelectValueTemplateDirective, descendants: true, isSignal: true }, { propertyName: "tooltipTemplate", first: true, predicate: SelectTooltipTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "listboxRef", first: true, predicate: CdkListbox, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "cdkListboxRef", first: true, predicate: CdkListbox, descendants: true, isSignal: true }, { propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }, { propertyName: "virtualListboxRef", first: true, predicate: ["virtualListbox"], descendants: true, isSignal: true }, { propertyName: "connectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true, isSignal: true }, { propertyName: "triggerRef", first: true, predicate: ["trigger"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "searchInputRef", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }, { propertyName: "multiselectContainerRef", first: true, predicate: ["multiselectContainer"], descendants: true, isSignal: true }, { propertyName: "tagRefs", predicate: ["tagElement"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@if (label()) {\n  <tedi-label-row>\n    <label\n      [id]=\"labelId()\"\n      tedi-label\n      [for]=\"inputId()\"\n      [required]=\"required()\"\n      [size]=\"size()\"\n      (click)=\"onTriggerClick()\"\n    >\n      {{ label() }}\n    </label>\n    @if (tooltipTemplate()?.template; as tooltipTpl) {\n      <tedi-info-tooltip>\n        <ng-container [ngTemplateOutlet]=\"tooltipTpl\" />\n      </tedi-info-tooltip>\n    } @else if (tooltip(); as tooltipText) {\n      <tedi-info-tooltip>{{ tooltipText }}</tedi-info-tooltip>\n    }\n  </tedi-label-row>\n}\n<div\n  [id]=\"searchable() ? null : inputId()\"\n  class=\"tedi-select__trigger tedi-input\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  [class.tedi-input--small]=\"size() === 'small'\"\n  [class.tedi-input--error]=\"state() === 'error'\"\n  [class.tedi-input--valid]=\"state() === 'valid'\"\n  [class.tedi-select__trigger--searchable]=\"searchable()\"\n  [class.tedi-select__trigger--search-focused]=\"searchFocused()\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  [attr.role]=\"searchable() ? null : 'combobox'\"\n  [attr.aria-haspopup]=\"searchable() ? null : 'listbox'\"\n  [attr.aria-expanded]=\"searchable() ? null : isOpen()\"\n  [attr.aria-controls]=\"!searchable() && isOpen() ? listboxId() : null\"\n  [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n  [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n  [attr.aria-invalid]=\"!searchable() ? isInvalid() || null : null\"\n  [attr.aria-describedby]=\"!searchable() ? feedbackId() : null\"\n  [tabindex]=\"searchable() || disabled() ? -1 : 0\"\n  (click)=\"onTriggerClick()\"\n  (keydown.enter)=\"onTriggerEnter()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  @if (searchable()) {\n    <div class=\"tedi-select__search-wrapper\">\n      @if (showSingleSelectedValue()) {\n        <span class=\"tedi-select__selected-value\">\n          @if (valueTemplate(); as tpl) {\n            @if (selectedOptions()[0]; as option) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"getValueContext(option)\"\n              />\n            }\n          } @else {\n            {{ selectedLabels().join(\", \") }}\n          }\n        </span>\n      }\n      @if (allowMultiple() && selectedValues().length) {\n        <ng-container\n          [ngTemplateOutlet]=\"multiselectTags\"\n          [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n        />\n      } @else {\n        <input\n          #searchInput\n          [id]=\"inputId()\"\n          type=\"text\"\n          class=\"tedi-select__search-input\"\n          [class.tedi-select__search-input--hidden]=\"showSingleSelectedValue()\"\n          [placeholder]=\"showSingleSelectedValue() ? '' : placeholder()\"\n          [value]=\"searchTerm()\"\n          [disabled]=\"disabled()\"\n          (input)=\"onSearchInput($event)\"\n          (focus)=\"onSearchFocus()\"\n          (blur)=\"onSearchBlur()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          autocomplete=\"off\"\n          role=\"combobox\"\n          aria-autocomplete=\"list\"\n          [attr.aria-expanded]=\"isOpen()\"\n          [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n          [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n          [attr.aria-label]=\"resolvedAriaLabel()\"\n          [attr.aria-invalid]=\"isInvalid() || null\"\n          [attr.aria-describedby]=\"feedbackId()\"\n        />\n      }\n    </div>\n  } @else {\n    <span class=\"tedi-select__label\">\n      @if (selectedValues().length) {\n        @if (allowMultiple()) {\n          <ng-container\n            [ngTemplateOutlet]=\"multiselectTags\"\n            [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n          />\n        } @else if (ellipsis(); as ellipsisPos) {\n          <tedi-ellipsis [position]=\"ellipsisPos\" [lineClamp]=\"1\">\n            <ng-container [ngTemplateOutlet]=\"singleValue\" />\n          </tedi-ellipsis>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"singleValue\" />\n        }\n      } @else {\n        <span class=\"tedi-select__label--placeholder\">\n          {{ placeholder() }}\n        </span>\n      }\n    </span>\n  }\n\n  @if (clearable() && !disabled() && selectedValues().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'clear' | tediTranslate\"\n      (click)=\"clear($event)\"\n      (keydown.enter)=\"clear($event)\"\n      (keydown.space)=\"clear($event)\"\n      [attr.aria-describedby]=\"label() ? labelId() : null\"\n    ></button>\n  }\n\n  <span\n    class=\"tedi-select__arrow\"\n    aria-hidden=\"true\"\n    (click)=\"onArrowClick($event)\"\n  >\n    <tedi-icon name=\"arrow_drop_down\" />\n  </span>\n</div>\n@if (name(); as fieldName) {\n  @for (formValue of formValues(); track $index) {\n    <input\n      type=\"hidden\"\n      [name]=\"fieldName\"\n      [value]=\"formValue\"\n      [disabled]=\"disabled()\"\n    />\n  }\n}\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [id]=\"feedbackId()\"\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template #singleValue>\n  @if (valueTemplate(); as tpl) {\n    @if (selectedOptions()[0]; as option) {\n      <ng-container\n        [ngTemplateOutlet]=\"tpl.template\"\n        [ngTemplateOutletContext]=\"getValueContext(option)\"\n      />\n    }\n  } @else {\n    {{ selectedLabels().join(\", \") }}\n  }\n</ng-template>\n\n<ng-template #multiselectTags>\n  <div\n    class=\"tedi-select__multiselect-container\"\n    [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n    [class.tedi-select__multiselect-container--ellipsis]=\"tagEllipsis()\"\n    #multiselectContainer\n  >\n    @if (multiRow()) {\n      @for (value of selectedValues(); track value) {\n        <tedi-tag\n          [ellipsis]=\"tagEllipsis()\"\n          [closable]=\"isTagRemovable()\"\n          (closed)=\"deselect($event, value)\"\n        >\n          {{ getLabel(value) }}\n        </tedi-tag>\n      }\n    } @else {\n      <div class=\"tedi-select__multiselect-tags\">\n        @for (value of selectedValues(); track value; let i = $index) {\n          @if (visibleTagsCount() === null || i < visibleTagsCount()!) {\n            <tedi-tag\n              #tagElement\n              [ellipsis]=\"tagEllipsis()\"\n              [closable]=\"isTagRemovable()\"\n              (closed)=\"deselect($event, value)\"\n            >\n              {{ getLabel(value) }}\n            </tedi-tag>\n          }\n        }\n      </div>\n      @if (hiddenTagsCount() > 0) {\n        <tedi-tag class=\"tedi-select__multiselect-counter\"\n          >+{{ hiddenTagsCount() }}</tedi-tag\n        >\n      }\n    }\n    @if (searchable()) {\n      <input\n        #searchInput\n        [id]=\"inputId()\"\n        type=\"text\"\n        class=\"tedi-select__search-input\"\n        [value]=\"searchTerm()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onSearchInput($event)\"\n        (focus)=\"onSearchFocus()\"\n        (blur)=\"onSearchBlur()\"\n        (keydown)=\"onSearchKeydown($event)\"\n        autocomplete=\"off\"\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n        [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n        [attr.aria-label]=\"resolvedAriaLabel()\"\n        [attr.aria-invalid]=\"isInvalid() || null\"\n        [attr.aria-describedby]=\"feedbackId()\"\n      />\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"dropdownPositions()\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n  (attach)=\"onOverlayAttached()\"\n  (detach)=\"toggleIsOpen(true)\"\n>\n  <div\n    class=\"tedi-select__dropdown\"\n    [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n    [style.max-height]=\"dropdownMaxHeight() ? dropdownMaxHeight() + 'px' : null\"\n  >\n    @if (virtualize()) {\n      <div\n        #virtualListbox\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options tedi-select__options--virtual\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        role=\"listbox\"\n        [attr.aria-multiselectable]=\"allowMultiple() ? true : null\"\n        [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n        [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n        [attr.aria-activedescendant]=\"activeDescendantId()\"\n        [tabindex]=\"searchable() ? -1 : 0\"\n        (keydown)=\"onVirtualListboxKeydown($event)\"\n      >\n        @if (filteredOptions().length) {\n          @if (showSelectAllRow()) {\n            <div\n              class=\"tedi-dropdown-item\"\n              [id]=\"listboxId() + '-select-all'\"\n              role=\"option\"\n              [attr.aria-selected]=\"allOptionsSelected()\"\n              [class.tedi-dropdown-item--active]=\"activeIndex() === 0\"\n              (click)=\"onVirtualSelectAllClick()\"\n            >\n              <tedi-option-content\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-option-content-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-option-content-label>\n              </tedi-option-content>\n            </div>\n          }\n          <cdk-virtual-scroll-viewport\n            class=\"tedi-select__viewport\"\n            [itemSize]=\"virtualRowHeight()\"\n            [style.height.px]=\"virtualViewportHeight()\"\n            [minBufferPx]=\"virtualRowHeight() * 6\"\n            [maxBufferPx]=\"virtualRowHeight() * 12\"\n          >\n            <div\n              *cdkVirtualFor=\"\n                let option of filteredOptions();\n                let i = index;\n                trackBy: trackByOptionValue\n              \"\n              class=\"tedi-dropdown-item\"\n              [id]=\"virtualOptionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"isOptionSelected(option.value)\"\n              [attr.aria-disabled]=\"option.disabled ? true : null\"\n              [class.tedi-dropdown-item--selected]=\"\n                !allowMultiple() && isOptionSelected(option.value)\n              \"\n              [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n              [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n              [class.tedi-dropdown-item--active]=\"\n                activeIndex() - (showSelectAllRow() ? 1 : 0) === i\n              \"\n              (click)=\"onVirtualOptionClick(option)\"\n            >\n              @if (optionTemplate(); as tpl) {\n                <ng-container\n                  [ngTemplateOutlet]=\"tpl.template\"\n                  [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                />\n              } @else {\n                <tedi-option-content\n                  [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-option-content-label>{{\n                    option.label\n                  }}</tedi-option-content-label>\n                </tedi-option-content>\n              }\n            </div>\n          </cdk-virtual-scroll-viewport>\n        } @else {\n          <div\n            class=\"tedi-dropdown-item tedi-select__no-options\"\n            role=\"option\"\n            aria-disabled=\"true\"\n          >\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </div>\n        }\n      </div>\n    } @else {\n      <ul\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        [class.tedi-select__options--swatch-grid]=\"dropdownType() === 'grid'\"\n        cdkListbox\n        [cdkListboxMultiple]=\"allowMultiple()\"\n        [cdkListboxValue]=\"visibleSelectedValues()\"\n        [cdkListboxNavigatesDisabledOptions]=\"false\"\n        [cdkListboxUseActiveDescendant]=\"true\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        (keydown.tab)=\"toggleIsOpen(true)\"\n        (keydown.escape)=\"toggleIsOpen(true)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (filteredOptions().length) {\n          @if (allowMultiple() && showSelectAll()) {\n            <li\n              class=\"tedi-dropdown-item\"\n              [cdkOption]=\"SpecialOptionControls.SELECT_ALL\"\n            >\n              <tedi-option-content\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-option-content-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-option-content-label>\n              </tedi-option-content>\n            </li>\n          }\n\n          @for (group of optionGroups(); track group.label) {\n            @if (group.label.length > 0) {\n              @if (allowMultiple() && selectableGroups()) {\n                <li\n                  class=\"tedi-dropdown-item tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"SpecialOptionControls.SELECT_GROUP + group.label\"\n                >\n                  <tedi-option-content\n                    type=\"checkbox\"\n                    [selected]=\"isGroupSelected(group.label)\"\n                    [indeterminate]=\"isGroupIndeterminate(group.label)\"\n                  >\n                    <tedi-option-content-label>{{\n                      group.label\n                    }}</tedi-option-content-label>\n                  </tedi-option-content>\n                </li>\n              } @else {\n                <li class=\"tedi-select__group-name\" role=\"presentation\">\n                  <span tedi-text color=\"tertiary\">\n                    {{ group.label }}\n                  </span>\n                </li>\n              }\n            }\n\n            @for (option of group.options; track option.value; let i = $index) {\n              <li\n                class=\"tedi-dropdown-item\"\n                [class.tedi-dropdown-item--selected]=\"\n                  !allowMultiple() && isOptionSelected(option.value)\n                \"\n                [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n                [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n                [cdkOption]=\"option.value\"\n                [cdkOptionDisabled]=\"option.disabled\"\n              >\n                @if (optionTemplate(); as tpl) {\n                  <ng-container\n                    [ngTemplateOutlet]=\"tpl.template\"\n                    [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                  />\n                } @else {\n                  <tedi-option-content\n                    [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                    [selected]=\"isOptionSelected(option.value)\"\n                    [disabled]=\"!!option.disabled\"\n                  >\n                    <tedi-option-content-label>{{\n                      option.label\n                    }}</tedi-option-content-label>\n                  </tedi-option-content>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li class=\"tedi-dropdown-item tedi-select__no-options\">\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </li>\n        }\n      </ul>\n    }\n  </div>\n</ng-template>\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}.tedi-input{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);--_placeholder-color: var(--form-input-text-placeholder);--_search-input-reserve: 5rem;margin-bottom:0;font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled)}.tedi-input:hover{--_field-border-color: var(--form-input-border-hover)}.tedi-input:focus,.tedi-input:active,.tedi-input.tedi-select__trigger--search-focused{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input--disabled{--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);color:var(--form-input-text-disabled);pointer-events:none}.tedi-input--error:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(.tedi-input--disabled):focus,.tedi-input--error:not(.tedi-input--disabled):active,.tedi-input--error:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-input--valid:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(.tedi-input--disabled):focus,.tedi-input--valid:not(.tedi-input--disabled):active,.tedi-input--valid:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-select{display:block;width:100%}.tedi-select--clear-on-interaction .tedi-select__clear{visibility:hidden}.tedi-select--clear-on-interaction .tedi-select__clear+.tedi-select__arrow{border-left-color:transparent}.tedi-select--clear-on-interaction .tedi-select__trigger:hover .tedi-select__clear,.tedi-select--clear-on-interaction .tedi-select__trigger:active .tedi-select__clear,.tedi-select--clear-on-interaction .tedi-select__trigger:focus-within .tedi-select__clear{visibility:visible}.tedi-select--clear-on-interaction .tedi-select__trigger:hover .tedi-select__clear+.tedi-select__arrow,.tedi-select--clear-on-interaction .tedi-select__trigger:active .tedi-select__clear+.tedi-select__arrow,.tedi-select--clear-on-interaction .tedi-select__trigger:focus-within .tedi-select__clear+.tedi-select__arrow{border-left-color:var(--general-border-primary)}.tedi-select .tedi-feedback-text{margin-top:var(--form-field-outer-spacing)}.tedi-select__trigger{display:flex;justify-content:space-between;width:100%;cursor:pointer;outline:none}.tedi-select__label{flex-grow:1;overflow:hidden;text-align:left;cursor:default}.tedi-select__label--placeholder{color:var(--_placeholder-color);pointer-events:none}.tedi-select__clear{flex-grow:0;padding:0;margin:0;color:var(--button-close-text-default);cursor:pointer;background:none;border:none}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{display:inline-flex;flex-grow:0;flex-shrink:0;align-items:center;padding-left:var(--form-field-inner-spacing);margin-left:var(--form-field-inner-spacing);color:inherit;cursor:default}.tedi-select__dropdown{display:flex;flex-direction:column;max-height:100%;margin-top:var(--form-field-outer-spacing);margin-bottom:var(--form-field-outer-spacing);background:var(--card-background-primary);border-radius:var(--card-radius-rounded);box-shadow:0 1px 5px 0 var(--tedi-alpha-20)}.tedi-select__trigger--searchable{cursor:text}.tedi-select__search-wrapper{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--body-regular-line-height);overflow:hidden}.tedi-select__selected-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.tedi-select__search-input{position:absolute;top:0;left:0;width:100%;height:100%;padding:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;background:transparent;border:none}.tedi-select__search-input:focus{outline:none}.tedi-select__search-input::placeholder{color:var(--form-input-text-placeholder)}.tedi-select__search-input--hidden{color:transparent;caret-color:var(--form-input-text-filled)}.tedi-select__search-input:not(.tedi-select__search-input--hidden){position:relative;flex:1 1 var(--_search-input-reserve);width:auto;min-width:0;height:auto}.tedi-select__options{flex:1;min-height:0;padding:0;margin:0;overflow-y:auto;outline:none}.tedi-select__options .tedi-dropdown-item{outline:none}.tedi-select__options .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled),.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--active:not(.tedi-dropdown-item--disabled){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-select__options .tedi-dropdown-item[aria-selected=true],.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-select__options .tedi-dropdown-item[aria-selected=true] .tedi-icon,.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected .tedi-icon{color:inherit}.tedi-select__options--virtual{display:flex;flex-direction:column;overflow:visible}.tedi-select__viewport{width:100%}.tedi-select__viewport .tedi-dropdown-item{box-sizing:border-box}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;padding:var(--dropdown-group-label-padding-y) var(--dropdown-group-label-padding-x) var(--layout-grid-gutters-04);font-size:var(--heading-subtitle-small-size);font-weight:var(--heading-subtitle-small-weight);line-height:var(--heading-subtitle-small-line-height);text-transform:uppercase;letter-spacing:0}.tedi-select__group-name--selectable{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);text-transform:none;letter-spacing:inherit}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left)}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);min-width:0}.tedi-select__multiselect-container--single-row{flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-tags{display:flex;flex:0 0 auto;gap:var(--form-field-inner-spacing);min-width:0;overflow:hidden}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-counter{flex-shrink:0}.tedi-select__multiselect-container--single-row.tedi-select__multiselect-container--ellipsis .tedi-select__multiselect-tags{flex:0 1 auto}.tedi-select__no-options{color:var(--general-text-tertiary);cursor:default}.tedi-select__no-options:hover{color:var(--general-text-tertiary);background:var(--dropdown-item-default-background)}.tedi-select__dropdown:has(.tedi-select__options--swatch-grid){width:fit-content}.tedi-select__options--swatch-grid{--tedi-swatch-size: 24px;--tedi-swatch-gap: var(--layout-grid-gutters-04);--tedi-swatch-columns: 11;display:grid;grid-template-columns:repeat(auto-fit,var(--tedi-swatch-size));gap:var(--tedi-swatch-gap);max-width:calc(var(--tedi-swatch-columns) * (var(--tedi-swatch-size) + var(--tedi-swatch-gap)));padding:var(--dropdown-body-padding-y) var(--dropdown-body-padding-x)}.tedi-select__options--swatch-grid .tedi-dropdown-item{display:flex;align-items:center;justify-content:center;width:var(--tedi-swatch-size);height:var(--tedi-swatch-size);min-height:auto;padding:var(--layout-grid-gutters-02);color:inherit;background:transparent;border-radius:var(--card-radius-rounded)}.tedi-select__options--swatch-grid .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled){outline-offset:0}.tedi-select__options--swatch-grid .tedi-dropdown-item[aria-selected=true],.tedi-select__options--swatch-grid .tedi-dropdown-item.tedi-dropdown-item--selected{color:inherit;background:transparent;border:var(--tedi-borders-02) solid var(--card-border-selected)}.tedi-select__options--swatch-grid .tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled){background:transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i1.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: CdkListboxModule }, { kind: "directive", type: i3.CdkListbox, selector: "[cdkListbox]", inputs: ["id", "tabindex", "cdkListboxValue", "cdkListboxMultiple", "cdkListboxDisabled", "cdkListboxUseActiveDescendant", "cdkListboxOrientation", "cdkListboxCompareWith", "cdkListboxNavigationWrapDisabled", "cdkListboxNavigatesDisabledOptions"], outputs: ["cdkListboxValueChange"], exportAs: ["cdkListbox"] }, { kind: "directive", type: i3.CdkOption, selector: "[cdkOption]", inputs: ["id", "cdkOption", "cdkOptionTypeaheadLabel", "cdkOptionDisabled", "tabindex"], exportAs: ["cdkOption"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: LabelComponent, selector: "[tedi-label]", inputs: ["size", "required", "color", "visuallyHidden"] }, { kind: "component", type: LabelRowComponent, selector: "tedi-label-row" }, { kind: "component", type: InfoTooltipComponent, selector: "tedi-info-tooltip", inputs: ["position", "openWith", "maxWidth", "color", "ariaLabel"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["id", "text", "type", "position"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: TagComponent, selector: "tedi-tag", inputs: ["loading", "closable", "type", "ellipsis"], outputs: ["closed"] }, { kind: "component", type: OptionContentComponent, selector: "tedi-option-content", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: OptionContentLabelComponent, selector: "tedi-option-content-label", inputs: ["clipContent"] }, { kind: "component", type: EllipsisComponent, selector: "tedi-ellipsis", inputs: ["lineClamp", "tooltip", "position"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
@@ -10259,20 +10386,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         TextComponent,
                         TagComponent,
                         TediTranslationPipe,
-                        DropdownItemValueComponent,
-                        DropdownItemValueLabelComponent,
+                        OptionContentComponent,
+                        OptionContentLabelComponent,
                         EllipsisComponent,
                     ], standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "tedi-select",
                         "[class.tedi-select--multiselect]": "allowMultiple()",
-                        "[class.tedi-select--clear-on-interaction]": "showClearOnInteraction() && clearable() && !!selectedValues().length",
+                        "[class.tedi-select--clear-on-interaction]": "showClearOnInteraction() && clearable() && !disabled() && !!selectedValues().length",
                     }, providers: [
                         {
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => SelectComponent),
                             multi: true,
                         },
-                    ], template: "@if (label()) {\n  <tedi-label-row>\n    <label\n      [id]=\"labelId()\"\n      tedi-label\n      [for]=\"inputId()\"\n      [required]=\"required()\"\n      [size]=\"size()\"\n      (click)=\"onTriggerClick()\"\n    >\n      {{ label() }}\n    </label>\n    @if (tooltipTemplate()?.template; as tooltipTpl) {\n      <tedi-info-tooltip>\n        <ng-container [ngTemplateOutlet]=\"tooltipTpl\" />\n      </tedi-info-tooltip>\n    } @else if (tooltip(); as tooltipText) {\n      <tedi-info-tooltip>{{ tooltipText }}</tedi-info-tooltip>\n    }\n  </tedi-label-row>\n}\n<div\n  [id]=\"searchable() ? null : inputId()\"\n  class=\"tedi-select__trigger tedi-input\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  [class.tedi-input--small]=\"size() === 'small'\"\n  [class.tedi-input--error]=\"state() === 'error'\"\n  [class.tedi-input--valid]=\"state() === 'valid'\"\n  [class.tedi-select__trigger--searchable]=\"searchable()\"\n  [class.tedi-select__trigger--search-focused]=\"searchFocused()\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  [attr.role]=\"searchable() ? null : 'combobox'\"\n  [attr.aria-haspopup]=\"searchable() ? null : 'listbox'\"\n  [attr.aria-expanded]=\"searchable() ? null : isOpen()\"\n  [attr.aria-controls]=\"!searchable() && isOpen() ? listboxId() : null\"\n  [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n  [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n  [attr.aria-invalid]=\"!searchable() ? isInvalid() || null : null\"\n  [attr.aria-describedby]=\"!searchable() ? feedbackId() : null\"\n  [tabindex]=\"searchable() || disabled() ? -1 : 0\"\n  (click)=\"onTriggerClick()\"\n  (keydown.enter)=\"onTriggerEnter()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  @if (searchable()) {\n    <div class=\"tedi-select__search-wrapper\">\n      @if (showSingleSelectedValue()) {\n        <span class=\"tedi-select__selected-value\">\n          @if (valueTemplate(); as tpl) {\n            @if (selectedOptions()[0]; as option) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"getValueContext(option)\"\n              />\n            }\n          } @else {\n            {{ selectedLabels().join(\", \") }}\n          }\n        </span>\n      }\n      @if (allowMultiple() && selectedValues().length) {\n        <ng-container\n          [ngTemplateOutlet]=\"multiselectTags\"\n          [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n        />\n      } @else {\n        <input\n          #searchInput\n          [id]=\"inputId()\"\n          type=\"text\"\n          class=\"tedi-select__search-input\"\n          [class.tedi-select__search-input--hidden]=\"showSingleSelectedValue()\"\n          [placeholder]=\"showSingleSelectedValue() ? '' : placeholder()\"\n          [value]=\"searchTerm()\"\n          [disabled]=\"disabled()\"\n          (input)=\"onSearchInput($event)\"\n          (focus)=\"onSearchFocus()\"\n          (blur)=\"onSearchBlur()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          autocomplete=\"off\"\n          role=\"combobox\"\n          aria-autocomplete=\"list\"\n          [attr.aria-expanded]=\"isOpen()\"\n          [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n          [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n          [attr.aria-label]=\"resolvedAriaLabel()\"\n          [attr.aria-invalid]=\"isInvalid() || null\"\n          [attr.aria-describedby]=\"feedbackId()\"\n        />\n      }\n    </div>\n  } @else {\n    <span class=\"tedi-select__label\">\n      @if (selectedValues().length) {\n        @if (allowMultiple()) {\n          <ng-container\n            [ngTemplateOutlet]=\"multiselectTags\"\n            [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n          />\n        } @else if (ellipsis(); as ellipsisPos) {\n          <tedi-ellipsis [position]=\"ellipsisPos\" [lineClamp]=\"1\">\n            <ng-container [ngTemplateOutlet]=\"singleValue\" />\n          </tedi-ellipsis>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"singleValue\" />\n        }\n      } @else {\n        <span class=\"tedi-select__label--placeholder\">\n          {{ placeholder() }}\n        </span>\n      }\n    </span>\n  }\n\n  @if (clearable() && selectedValues().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'clear' | tediTranslate\"\n      (click)=\"clear($event)\"\n      (keydown.enter)=\"clear($event)\"\n      (keydown.space)=\"clear($event)\"\n      [attr.aria-describedby]=\"label() ? labelId() : null\"\n    ></button>\n  }\n\n  <span\n    class=\"tedi-select__arrow\"\n    aria-hidden=\"true\"\n    (click)=\"onArrowClick($event)\"\n  >\n    <tedi-icon name=\"arrow_drop_down\" />\n  </span>\n</div>\n@if (name(); as fieldName) {\n  @for (formValue of formValues(); track $index) {\n    <input\n      type=\"hidden\"\n      [name]=\"fieldName\"\n      [value]=\"formValue\"\n      [disabled]=\"disabled()\"\n    />\n  }\n}\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [id]=\"feedbackId()\"\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template #singleValue>\n  @if (valueTemplate(); as tpl) {\n    @if (selectedOptions()[0]; as option) {\n      <ng-container\n        [ngTemplateOutlet]=\"tpl.template\"\n        [ngTemplateOutletContext]=\"getValueContext(option)\"\n      />\n    }\n  } @else {\n    {{ selectedLabels().join(\", \") }}\n  }\n</ng-template>\n\n<ng-template #multiselectTags>\n  <div\n    class=\"tedi-select__multiselect-container\"\n    [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n    [class.tedi-select__multiselect-container--ellipsis]=\"tagEllipsis()\"\n    #multiselectContainer\n  >\n    @if (multiRow()) {\n      @for (value of selectedValues(); track value) {\n        <tedi-tag\n          [ellipsis]=\"tagEllipsis()\"\n          [closable]=\"isTagRemovable()\"\n          (closed)=\"deselect($event, value)\"\n        >\n          {{ getLabel(value) }}\n        </tedi-tag>\n      }\n    } @else {\n      <div class=\"tedi-select__multiselect-tags\">\n        @for (value of selectedValues(); track value; let i = $index) {\n          @if (visibleTagsCount() === null || i < visibleTagsCount()!) {\n            <tedi-tag\n              #tagElement\n              [ellipsis]=\"tagEllipsis()\"\n              [closable]=\"isTagRemovable()\"\n              (closed)=\"deselect($event, value)\"\n            >\n              {{ getLabel(value) }}\n            </tedi-tag>\n          }\n        }\n      </div>\n      @if (hiddenTagsCount() > 0) {\n        <tedi-tag class=\"tedi-select__multiselect-counter\"\n          >+{{ hiddenTagsCount() }}</tedi-tag\n        >\n      }\n    }\n    @if (searchable()) {\n      <input\n        #searchInput\n        [id]=\"inputId()\"\n        type=\"text\"\n        class=\"tedi-select__search-input\"\n        [value]=\"searchTerm()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onSearchInput($event)\"\n        (focus)=\"onSearchFocus()\"\n        (blur)=\"onSearchBlur()\"\n        (keydown)=\"onSearchKeydown($event)\"\n        autocomplete=\"off\"\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n        [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n        [attr.aria-label]=\"resolvedAriaLabel()\"\n        [attr.aria-invalid]=\"isInvalid() || null\"\n        [attr.aria-describedby]=\"feedbackId()\"\n      />\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"dropdownPositions()\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n  (attach)=\"onOverlayAttached()\"\n  (detach)=\"toggleIsOpen(true)\"\n>\n  <div\n    class=\"tedi-select__dropdown\"\n    [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n    [style.max-height]=\"dropdownMaxHeight() ? dropdownMaxHeight() + 'px' : null\"\n  >\n    @if (virtualize()) {\n      <div\n        #virtualListbox\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options tedi-select__options--virtual\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        role=\"listbox\"\n        [attr.aria-multiselectable]=\"allowMultiple() ? true : null\"\n        [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n        [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n        [attr.aria-activedescendant]=\"activeDescendantId()\"\n        [tabindex]=\"searchable() ? -1 : 0\"\n        (keydown)=\"onVirtualListboxKeydown($event)\"\n      >\n        @if (filteredOptions().length) {\n          @if (showSelectAllRow()) {\n            <div\n              class=\"tedi-dropdown-item\"\n              [id]=\"listboxId() + '-select-all'\"\n              role=\"option\"\n              [attr.aria-selected]=\"allOptionsSelected()\"\n              [class.tedi-dropdown-item--active]=\"activeIndex() === 0\"\n              (click)=\"onVirtualSelectAllClick()\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </div>\n          }\n          <cdk-virtual-scroll-viewport\n            class=\"tedi-select__viewport\"\n            [itemSize]=\"virtualRowHeight()\"\n            [style.height.px]=\"virtualViewportHeight()\"\n            [minBufferPx]=\"virtualRowHeight() * 6\"\n            [maxBufferPx]=\"virtualRowHeight() * 12\"\n          >\n            <div\n              *cdkVirtualFor=\"\n                let option of filteredOptions();\n                let i = index;\n                trackBy: trackByOptionValue\n              \"\n              class=\"tedi-dropdown-item\"\n              [id]=\"virtualOptionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"isOptionSelected(option.value)\"\n              [attr.aria-disabled]=\"option.disabled ? true : null\"\n              [class.tedi-dropdown-item--selected]=\"\n                !allowMultiple() && isOptionSelected(option.value)\n              \"\n              [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n              [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n              [class.tedi-dropdown-item--active]=\"\n                activeIndex() - (showSelectAllRow() ? 1 : 0) === i\n              \"\n              (click)=\"onVirtualOptionClick(option)\"\n            >\n              @if (optionTemplate(); as tpl) {\n                <ng-container\n                  [ngTemplateOutlet]=\"tpl.template\"\n                  [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                />\n              } @else {\n                <tedi-dropdown-item-value\n                  [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              }\n            </div>\n          </cdk-virtual-scroll-viewport>\n        } @else {\n          <div\n            class=\"tedi-dropdown-item tedi-select__no-options\"\n            role=\"option\"\n            aria-disabled=\"true\"\n          >\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </div>\n        }\n      </div>\n    } @else {\n      <ul\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        [class.tedi-select__options--swatch-grid]=\"dropdownType() === 'grid'\"\n        cdkListbox\n        [cdkListboxMultiple]=\"allowMultiple()\"\n        [cdkListboxValue]=\"visibleSelectedValues()\"\n        [cdkListboxNavigatesDisabledOptions]=\"false\"\n        [cdkListboxUseActiveDescendant]=\"true\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        (keydown.tab)=\"toggleIsOpen(true)\"\n        (keydown.escape)=\"toggleIsOpen(true)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (filteredOptions().length) {\n          @if (allowMultiple() && showSelectAll()) {\n            <li\n              class=\"tedi-dropdown-item\"\n              [cdkOption]=\"SpecialOptionControls.SELECT_ALL\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </li>\n          }\n\n          @for (group of optionGroups(); track group.label) {\n            @if (group.label.length > 0) {\n              @if (allowMultiple() && selectableGroups()) {\n                <li\n                  class=\"tedi-dropdown-item tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"SpecialOptionControls.SELECT_GROUP + group.label\"\n                >\n                  <tedi-dropdown-item-value\n                    type=\"checkbox\"\n                    [selected]=\"isGroupSelected(group.label)\"\n                    [indeterminate]=\"isGroupIndeterminate(group.label)\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      group.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                </li>\n              } @else {\n                <li class=\"tedi-select__group-name\" role=\"presentation\">\n                  <span tedi-text color=\"tertiary\">\n                    {{ group.label }}\n                  </span>\n                </li>\n              }\n            }\n\n            @for (option of group.options; track option.value; let i = $index) {\n              <li\n                class=\"tedi-dropdown-item\"\n                [class.tedi-dropdown-item--selected]=\"\n                  !allowMultiple() && isOptionSelected(option.value)\n                \"\n                [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n                [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n                [cdkOption]=\"option.value\"\n                [cdkOptionDisabled]=\"option.disabled\"\n              >\n                @if (optionTemplate(); as tpl) {\n                  <ng-container\n                    [ngTemplateOutlet]=\"tpl.template\"\n                    [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                  />\n                } @else {\n                  <tedi-dropdown-item-value\n                    [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                    [selected]=\"isOptionSelected(option.value)\"\n                    [disabled]=\"!!option.disabled\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      option.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li class=\"tedi-dropdown-item tedi-select__no-options\">\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </li>\n        }\n      </ul>\n    }\n  </div>\n</ng-template>\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}.tedi-input{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);--_placeholder-color: var(--form-input-text-placeholder);--_search-input-reserve: 5rem;margin-bottom:0;font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled)}.tedi-input:hover{--_field-border-color: var(--form-input-border-hover)}.tedi-input:focus,.tedi-input:active,.tedi-input.tedi-select__trigger--search-focused{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input--disabled{--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);color:var(--form-input-text-disabled);pointer-events:none}.tedi-input--error:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(.tedi-input--disabled):focus,.tedi-input--error:not(.tedi-input--disabled):active,.tedi-input--error:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-input--valid:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(.tedi-input--disabled):focus,.tedi-input--valid:not(.tedi-input--disabled):active,.tedi-input--valid:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-select{display:block;width:100%}.tedi-select--clear-on-interaction .tedi-select__clear{visibility:hidden}.tedi-select--clear-on-interaction .tedi-select__clear+.tedi-select__arrow{border-left-color:transparent}.tedi-select--clear-on-interaction .tedi-select__trigger:hover .tedi-select__clear,.tedi-select--clear-on-interaction .tedi-select__trigger:active .tedi-select__clear,.tedi-select--clear-on-interaction .tedi-select__trigger:focus-within .tedi-select__clear{visibility:visible}.tedi-select--clear-on-interaction .tedi-select__trigger:hover .tedi-select__clear+.tedi-select__arrow,.tedi-select--clear-on-interaction .tedi-select__trigger:active .tedi-select__clear+.tedi-select__arrow,.tedi-select--clear-on-interaction .tedi-select__trigger:focus-within .tedi-select__clear+.tedi-select__arrow{border-left-color:var(--general-border-primary)}.tedi-select .tedi-feedback-text{margin-top:var(--form-field-outer-spacing)}.tedi-select__trigger{display:flex;justify-content:space-between;width:100%;cursor:pointer}.tedi-select__label{flex-grow:1;overflow:hidden;text-align:left;cursor:default}.tedi-select__label--placeholder{color:var(--_placeholder-color);pointer-events:none}.tedi-select__clear{flex-grow:0;padding:0;margin:0;color:var(--button-close-text-default);cursor:pointer;background:none;border:none}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{display:inline-flex;flex-grow:0;flex-shrink:0;align-items:center;padding-left:var(--form-field-inner-spacing);margin-left:var(--form-field-inner-spacing);color:inherit;cursor:default}.tedi-select__dropdown{display:flex;flex-direction:column;max-height:100%;margin-top:var(--form-field-outer-spacing);margin-bottom:var(--form-field-outer-spacing);background:var(--card-background-primary);border-radius:var(--card-radius-rounded);box-shadow:0 1px 5px 0 var(--tedi-alpha-20)}.tedi-select__trigger--searchable{cursor:text}.tedi-select__search-wrapper{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--body-regular-line-height);overflow:hidden}.tedi-select__selected-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.tedi-select__search-input{position:absolute;top:0;left:0;width:100%;height:100%;padding:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;background:transparent;border:none}.tedi-select__search-input:focus{outline:none}.tedi-select__search-input::placeholder{color:var(--form-input-text-placeholder)}.tedi-select__search-input--hidden{color:transparent;caret-color:var(--form-input-text-filled)}.tedi-select__search-input:not(.tedi-select__search-input--hidden){position:relative;flex:1 1 var(--_search-input-reserve);width:auto;min-width:0;height:auto}.tedi-select__options{flex:1;min-height:0;padding:0;margin:0;overflow-y:auto;outline:none}.tedi-select__options .tedi-dropdown-item{outline:none}.tedi-select__options .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled),.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--active:not(.tedi-dropdown-item--disabled){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-select__options .tedi-dropdown-item[aria-selected=true],.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-select__options .tedi-dropdown-item[aria-selected=true] .tedi-icon,.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected .tedi-icon{color:inherit}.tedi-select__options--virtual{display:flex;flex-direction:column;overflow:visible}.tedi-select__viewport{width:100%}.tedi-select__viewport .tedi-dropdown-item{box-sizing:border-box}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;padding:var(--dropdown-group-label-padding-y) var(--dropdown-group-label-padding-x) var(--layout-grid-gutters-04);font-size:var(--heading-subtitle-small-size);font-weight:var(--heading-subtitle-small-weight);line-height:var(--heading-subtitle-small-line-height);text-transform:uppercase;letter-spacing:0}.tedi-select__group-name--selectable{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);text-transform:none;letter-spacing:inherit}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left)}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);min-width:0}.tedi-select__multiselect-container--single-row{flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-tags{display:flex;flex:0 0 auto;gap:var(--form-field-inner-spacing);min-width:0;overflow:hidden}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-counter{flex-shrink:0}.tedi-select__multiselect-container--single-row.tedi-select__multiselect-container--ellipsis .tedi-select__multiselect-tags{flex:0 1 auto}.tedi-select__no-options{color:var(--general-text-tertiary);cursor:default}.tedi-select__no-options:hover{color:var(--general-text-tertiary);background:var(--dropdown-item-default-background)}.tedi-select__dropdown:has(.tedi-select__options--swatch-grid){width:fit-content}.tedi-select__options--swatch-grid{--tedi-swatch-size: 24px;--tedi-swatch-gap: var(--layout-grid-gutters-04);--tedi-swatch-columns: 11;display:grid;grid-template-columns:repeat(auto-fit,var(--tedi-swatch-size));gap:var(--tedi-swatch-gap);max-width:calc(var(--tedi-swatch-columns) * (var(--tedi-swatch-size) + var(--tedi-swatch-gap)));padding:var(--dropdown-body-padding-y) var(--dropdown-body-padding-x)}.tedi-select__options--swatch-grid .tedi-dropdown-item{display:flex;align-items:center;justify-content:center;width:var(--tedi-swatch-size);height:var(--tedi-swatch-size);min-height:auto;padding:var(--layout-grid-gutters-02);color:inherit;background:transparent;border-radius:var(--card-radius-rounded)}.tedi-select__options--swatch-grid .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled){outline-offset:0}.tedi-select__options--swatch-grid .tedi-dropdown-item[aria-selected=true],.tedi-select__options--swatch-grid .tedi-dropdown-item.tedi-dropdown-item--selected{color:inherit;background:transparent;border:var(--tedi-borders-02) solid var(--card-border-selected)}.tedi-select__options--swatch-grid .tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled){background:transparent}\n"] }]
+                    ], template: "@if (label()) {\n  <tedi-label-row>\n    <label\n      [id]=\"labelId()\"\n      tedi-label\n      [for]=\"inputId()\"\n      [required]=\"required()\"\n      [size]=\"size()\"\n      (click)=\"onTriggerClick()\"\n    >\n      {{ label() }}\n    </label>\n    @if (tooltipTemplate()?.template; as tooltipTpl) {\n      <tedi-info-tooltip>\n        <ng-container [ngTemplateOutlet]=\"tooltipTpl\" />\n      </tedi-info-tooltip>\n    } @else if (tooltip(); as tooltipText) {\n      <tedi-info-tooltip>{{ tooltipText }}</tedi-info-tooltip>\n    }\n  </tedi-label-row>\n}\n<div\n  [id]=\"searchable() ? null : inputId()\"\n  class=\"tedi-select__trigger tedi-input\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  [class.tedi-input--small]=\"size() === 'small'\"\n  [class.tedi-input--error]=\"state() === 'error'\"\n  [class.tedi-input--valid]=\"state() === 'valid'\"\n  [class.tedi-select__trigger--searchable]=\"searchable()\"\n  [class.tedi-select__trigger--search-focused]=\"searchFocused()\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  [attr.role]=\"searchable() ? null : 'combobox'\"\n  [attr.aria-haspopup]=\"searchable() ? null : 'listbox'\"\n  [attr.aria-expanded]=\"searchable() ? null : isOpen()\"\n  [attr.aria-controls]=\"!searchable() && isOpen() ? listboxId() : null\"\n  [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n  [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n  [attr.aria-invalid]=\"!searchable() ? isInvalid() || null : null\"\n  [attr.aria-describedby]=\"!searchable() ? feedbackId() : null\"\n  [tabindex]=\"searchable() || disabled() ? -1 : 0\"\n  (click)=\"onTriggerClick()\"\n  (keydown.enter)=\"onTriggerEnter()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  @if (searchable()) {\n    <div class=\"tedi-select__search-wrapper\">\n      @if (showSingleSelectedValue()) {\n        <span class=\"tedi-select__selected-value\">\n          @if (valueTemplate(); as tpl) {\n            @if (selectedOptions()[0]; as option) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"getValueContext(option)\"\n              />\n            }\n          } @else {\n            {{ selectedLabels().join(\", \") }}\n          }\n        </span>\n      }\n      @if (allowMultiple() && selectedValues().length) {\n        <ng-container\n          [ngTemplateOutlet]=\"multiselectTags\"\n          [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n        />\n      } @else {\n        <input\n          #searchInput\n          [id]=\"inputId()\"\n          type=\"text\"\n          class=\"tedi-select__search-input\"\n          [class.tedi-select__search-input--hidden]=\"showSingleSelectedValue()\"\n          [placeholder]=\"showSingleSelectedValue() ? '' : placeholder()\"\n          [value]=\"searchTerm()\"\n          [disabled]=\"disabled()\"\n          (input)=\"onSearchInput($event)\"\n          (focus)=\"onSearchFocus()\"\n          (blur)=\"onSearchBlur()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          autocomplete=\"off\"\n          role=\"combobox\"\n          aria-autocomplete=\"list\"\n          [attr.aria-expanded]=\"isOpen()\"\n          [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n          [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n          [attr.aria-label]=\"resolvedAriaLabel()\"\n          [attr.aria-invalid]=\"isInvalid() || null\"\n          [attr.aria-describedby]=\"feedbackId()\"\n        />\n      }\n    </div>\n  } @else {\n    <span class=\"tedi-select__label\">\n      @if (selectedValues().length) {\n        @if (allowMultiple()) {\n          <ng-container\n            [ngTemplateOutlet]=\"multiselectTags\"\n            [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n          />\n        } @else if (ellipsis(); as ellipsisPos) {\n          <tedi-ellipsis [position]=\"ellipsisPos\" [lineClamp]=\"1\">\n            <ng-container [ngTemplateOutlet]=\"singleValue\" />\n          </tedi-ellipsis>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"singleValue\" />\n        }\n      } @else {\n        <span class=\"tedi-select__label--placeholder\">\n          {{ placeholder() }}\n        </span>\n      }\n    </span>\n  }\n\n  @if (clearable() && !disabled() && selectedValues().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'clear' | tediTranslate\"\n      (click)=\"clear($event)\"\n      (keydown.enter)=\"clear($event)\"\n      (keydown.space)=\"clear($event)\"\n      [attr.aria-describedby]=\"label() ? labelId() : null\"\n    ></button>\n  }\n\n  <span\n    class=\"tedi-select__arrow\"\n    aria-hidden=\"true\"\n    (click)=\"onArrowClick($event)\"\n  >\n    <tedi-icon name=\"arrow_drop_down\" />\n  </span>\n</div>\n@if (name(); as fieldName) {\n  @for (formValue of formValues(); track $index) {\n    <input\n      type=\"hidden\"\n      [name]=\"fieldName\"\n      [value]=\"formValue\"\n      [disabled]=\"disabled()\"\n    />\n  }\n}\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [id]=\"feedbackId()\"\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template #singleValue>\n  @if (valueTemplate(); as tpl) {\n    @if (selectedOptions()[0]; as option) {\n      <ng-container\n        [ngTemplateOutlet]=\"tpl.template\"\n        [ngTemplateOutletContext]=\"getValueContext(option)\"\n      />\n    }\n  } @else {\n    {{ selectedLabels().join(\", \") }}\n  }\n</ng-template>\n\n<ng-template #multiselectTags>\n  <div\n    class=\"tedi-select__multiselect-container\"\n    [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n    [class.tedi-select__multiselect-container--ellipsis]=\"tagEllipsis()\"\n    #multiselectContainer\n  >\n    @if (multiRow()) {\n      @for (value of selectedValues(); track value) {\n        <tedi-tag\n          [ellipsis]=\"tagEllipsis()\"\n          [closable]=\"isTagRemovable()\"\n          (closed)=\"deselect($event, value)\"\n        >\n          {{ getLabel(value) }}\n        </tedi-tag>\n      }\n    } @else {\n      <div class=\"tedi-select__multiselect-tags\">\n        @for (value of selectedValues(); track value; let i = $index) {\n          @if (visibleTagsCount() === null || i < visibleTagsCount()!) {\n            <tedi-tag\n              #tagElement\n              [ellipsis]=\"tagEllipsis()\"\n              [closable]=\"isTagRemovable()\"\n              (closed)=\"deselect($event, value)\"\n            >\n              {{ getLabel(value) }}\n            </tedi-tag>\n          }\n        }\n      </div>\n      @if (hiddenTagsCount() > 0) {\n        <tedi-tag class=\"tedi-select__multiselect-counter\"\n          >+{{ hiddenTagsCount() }}</tedi-tag\n        >\n      }\n    }\n    @if (searchable()) {\n      <input\n        #searchInput\n        [id]=\"inputId()\"\n        type=\"text\"\n        class=\"tedi-select__search-input\"\n        [value]=\"searchTerm()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onSearchInput($event)\"\n        (focus)=\"onSearchFocus()\"\n        (blur)=\"onSearchBlur()\"\n        (keydown)=\"onSearchKeydown($event)\"\n        autocomplete=\"off\"\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n        [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n        [attr.aria-label]=\"resolvedAriaLabel()\"\n        [attr.aria-invalid]=\"isInvalid() || null\"\n        [attr.aria-describedby]=\"feedbackId()\"\n      />\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"dropdownPositions()\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n  (attach)=\"onOverlayAttached()\"\n  (detach)=\"toggleIsOpen(true)\"\n>\n  <div\n    class=\"tedi-select__dropdown\"\n    [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n    [style.max-height]=\"dropdownMaxHeight() ? dropdownMaxHeight() + 'px' : null\"\n  >\n    @if (virtualize()) {\n      <div\n        #virtualListbox\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options tedi-select__options--virtual\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        role=\"listbox\"\n        [attr.aria-multiselectable]=\"allowMultiple() ? true : null\"\n        [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n        [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n        [attr.aria-activedescendant]=\"activeDescendantId()\"\n        [tabindex]=\"searchable() ? -1 : 0\"\n        (keydown)=\"onVirtualListboxKeydown($event)\"\n      >\n        @if (filteredOptions().length) {\n          @if (showSelectAllRow()) {\n            <div\n              class=\"tedi-dropdown-item\"\n              [id]=\"listboxId() + '-select-all'\"\n              role=\"option\"\n              [attr.aria-selected]=\"allOptionsSelected()\"\n              [class.tedi-dropdown-item--active]=\"activeIndex() === 0\"\n              (click)=\"onVirtualSelectAllClick()\"\n            >\n              <tedi-option-content\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-option-content-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-option-content-label>\n              </tedi-option-content>\n            </div>\n          }\n          <cdk-virtual-scroll-viewport\n            class=\"tedi-select__viewport\"\n            [itemSize]=\"virtualRowHeight()\"\n            [style.height.px]=\"virtualViewportHeight()\"\n            [minBufferPx]=\"virtualRowHeight() * 6\"\n            [maxBufferPx]=\"virtualRowHeight() * 12\"\n          >\n            <div\n              *cdkVirtualFor=\"\n                let option of filteredOptions();\n                let i = index;\n                trackBy: trackByOptionValue\n              \"\n              class=\"tedi-dropdown-item\"\n              [id]=\"virtualOptionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"isOptionSelected(option.value)\"\n              [attr.aria-disabled]=\"option.disabled ? true : null\"\n              [class.tedi-dropdown-item--selected]=\"\n                !allowMultiple() && isOptionSelected(option.value)\n              \"\n              [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n              [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n              [class.tedi-dropdown-item--active]=\"\n                activeIndex() - (showSelectAllRow() ? 1 : 0) === i\n              \"\n              (click)=\"onVirtualOptionClick(option)\"\n            >\n              @if (optionTemplate(); as tpl) {\n                <ng-container\n                  [ngTemplateOutlet]=\"tpl.template\"\n                  [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                />\n              } @else {\n                <tedi-option-content\n                  [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-option-content-label>{{\n                    option.label\n                  }}</tedi-option-content-label>\n                </tedi-option-content>\n              }\n            </div>\n          </cdk-virtual-scroll-viewport>\n        } @else {\n          <div\n            class=\"tedi-dropdown-item tedi-select__no-options\"\n            role=\"option\"\n            aria-disabled=\"true\"\n          >\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </div>\n        }\n      </div>\n    } @else {\n      <ul\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        [class.tedi-select__options--swatch-grid]=\"dropdownType() === 'grid'\"\n        cdkListbox\n        [cdkListboxMultiple]=\"allowMultiple()\"\n        [cdkListboxValue]=\"visibleSelectedValues()\"\n        [cdkListboxNavigatesDisabledOptions]=\"false\"\n        [cdkListboxUseActiveDescendant]=\"true\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        (keydown.tab)=\"toggleIsOpen(true)\"\n        (keydown.escape)=\"toggleIsOpen(true)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (filteredOptions().length) {\n          @if (allowMultiple() && showSelectAll()) {\n            <li\n              class=\"tedi-dropdown-item\"\n              [cdkOption]=\"SpecialOptionControls.SELECT_ALL\"\n            >\n              <tedi-option-content\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-option-content-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-option-content-label>\n              </tedi-option-content>\n            </li>\n          }\n\n          @for (group of optionGroups(); track group.label) {\n            @if (group.label.length > 0) {\n              @if (allowMultiple() && selectableGroups()) {\n                <li\n                  class=\"tedi-dropdown-item tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"SpecialOptionControls.SELECT_GROUP + group.label\"\n                >\n                  <tedi-option-content\n                    type=\"checkbox\"\n                    [selected]=\"isGroupSelected(group.label)\"\n                    [indeterminate]=\"isGroupIndeterminate(group.label)\"\n                  >\n                    <tedi-option-content-label>{{\n                      group.label\n                    }}</tedi-option-content-label>\n                  </tedi-option-content>\n                </li>\n              } @else {\n                <li class=\"tedi-select__group-name\" role=\"presentation\">\n                  <span tedi-text color=\"tertiary\">\n                    {{ group.label }}\n                  </span>\n                </li>\n              }\n            }\n\n            @for (option of group.options; track option.value; let i = $index) {\n              <li\n                class=\"tedi-dropdown-item\"\n                [class.tedi-dropdown-item--selected]=\"\n                  !allowMultiple() && isOptionSelected(option.value)\n                \"\n                [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n                [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n                [cdkOption]=\"option.value\"\n                [cdkOptionDisabled]=\"option.disabled\"\n              >\n                @if (optionTemplate(); as tpl) {\n                  <ng-container\n                    [ngTemplateOutlet]=\"tpl.template\"\n                    [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                  />\n                } @else {\n                  <tedi-option-content\n                    [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                    [selected]=\"isOptionSelected(option.value)\"\n                    [disabled]=\"!!option.disabled\"\n                  >\n                    <tedi-option-content-label>{{\n                      option.label\n                    }}</tedi-option-content-label>\n                  </tedi-option-content>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li class=\"tedi-dropdown-item tedi-select__no-options\">\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </li>\n        }\n      </ul>\n    }\n  </div>\n</ng-template>\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}.tedi-input{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);--_placeholder-color: var(--form-input-text-placeholder);--_search-input-reserve: 5rem;margin-bottom:0;font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled)}.tedi-input:hover{--_field-border-color: var(--form-input-border-hover)}.tedi-input:focus,.tedi-input:active,.tedi-input.tedi-select__trigger--search-focused{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input--disabled{--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);color:var(--form-input-text-disabled);pointer-events:none}.tedi-input--error:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(.tedi-input--disabled):focus,.tedi-input--error:not(.tedi-input--disabled):active,.tedi-input--error:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-input--valid:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(.tedi-input--disabled):focus,.tedi-input--valid:not(.tedi-input--disabled):active,.tedi-input--valid:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-select{display:block;width:100%}.tedi-select--clear-on-interaction .tedi-select__clear{visibility:hidden}.tedi-select--clear-on-interaction .tedi-select__clear+.tedi-select__arrow{border-left-color:transparent}.tedi-select--clear-on-interaction .tedi-select__trigger:hover .tedi-select__clear,.tedi-select--clear-on-interaction .tedi-select__trigger:active .tedi-select__clear,.tedi-select--clear-on-interaction .tedi-select__trigger:focus-within .tedi-select__clear{visibility:visible}.tedi-select--clear-on-interaction .tedi-select__trigger:hover .tedi-select__clear+.tedi-select__arrow,.tedi-select--clear-on-interaction .tedi-select__trigger:active .tedi-select__clear+.tedi-select__arrow,.tedi-select--clear-on-interaction .tedi-select__trigger:focus-within .tedi-select__clear+.tedi-select__arrow{border-left-color:var(--general-border-primary)}.tedi-select .tedi-feedback-text{margin-top:var(--form-field-outer-spacing)}.tedi-select__trigger{display:flex;justify-content:space-between;width:100%;cursor:pointer;outline:none}.tedi-select__label{flex-grow:1;overflow:hidden;text-align:left;cursor:default}.tedi-select__label--placeholder{color:var(--_placeholder-color);pointer-events:none}.tedi-select__clear{flex-grow:0;padding:0;margin:0;color:var(--button-close-text-default);cursor:pointer;background:none;border:none}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{display:inline-flex;flex-grow:0;flex-shrink:0;align-items:center;padding-left:var(--form-field-inner-spacing);margin-left:var(--form-field-inner-spacing);color:inherit;cursor:default}.tedi-select__dropdown{display:flex;flex-direction:column;max-height:100%;margin-top:var(--form-field-outer-spacing);margin-bottom:var(--form-field-outer-spacing);background:var(--card-background-primary);border-radius:var(--card-radius-rounded);box-shadow:0 1px 5px 0 var(--tedi-alpha-20)}.tedi-select__trigger--searchable{cursor:text}.tedi-select__search-wrapper{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--body-regular-line-height);overflow:hidden}.tedi-select__selected-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.tedi-select__search-input{position:absolute;top:0;left:0;width:100%;height:100%;padding:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;background:transparent;border:none}.tedi-select__search-input:focus{outline:none}.tedi-select__search-input::placeholder{color:var(--form-input-text-placeholder)}.tedi-select__search-input--hidden{color:transparent;caret-color:var(--form-input-text-filled)}.tedi-select__search-input:not(.tedi-select__search-input--hidden){position:relative;flex:1 1 var(--_search-input-reserve);width:auto;min-width:0;height:auto}.tedi-select__options{flex:1;min-height:0;padding:0;margin:0;overflow-y:auto;outline:none}.tedi-select__options .tedi-dropdown-item{outline:none}.tedi-select__options .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled),.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--active:not(.tedi-dropdown-item--disabled){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-select__options .tedi-dropdown-item[aria-selected=true],.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-select__options .tedi-dropdown-item[aria-selected=true] .tedi-icon,.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected .tedi-icon{color:inherit}.tedi-select__options--virtual{display:flex;flex-direction:column;overflow:visible}.tedi-select__viewport{width:100%}.tedi-select__viewport .tedi-dropdown-item{box-sizing:border-box}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;padding:var(--dropdown-group-label-padding-y) var(--dropdown-group-label-padding-x) var(--layout-grid-gutters-04);font-size:var(--heading-subtitle-small-size);font-weight:var(--heading-subtitle-small-weight);line-height:var(--heading-subtitle-small-line-height);text-transform:uppercase;letter-spacing:0}.tedi-select__group-name--selectable{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);text-transform:none;letter-spacing:inherit}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left)}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);min-width:0}.tedi-select__multiselect-container--single-row{flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-tags{display:flex;flex:0 0 auto;gap:var(--form-field-inner-spacing);min-width:0;overflow:hidden}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-counter{flex-shrink:0}.tedi-select__multiselect-container--single-row.tedi-select__multiselect-container--ellipsis .tedi-select__multiselect-tags{flex:0 1 auto}.tedi-select__no-options{color:var(--general-text-tertiary);cursor:default}.tedi-select__no-options:hover{color:var(--general-text-tertiary);background:var(--dropdown-item-default-background)}.tedi-select__dropdown:has(.tedi-select__options--swatch-grid){width:fit-content}.tedi-select__options--swatch-grid{--tedi-swatch-size: 24px;--tedi-swatch-gap: var(--layout-grid-gutters-04);--tedi-swatch-columns: 11;display:grid;grid-template-columns:repeat(auto-fit,var(--tedi-swatch-size));gap:var(--tedi-swatch-gap);max-width:calc(var(--tedi-swatch-columns) * (var(--tedi-swatch-size) + var(--tedi-swatch-gap)));padding:var(--dropdown-body-padding-y) var(--dropdown-body-padding-x)}.tedi-select__options--swatch-grid .tedi-dropdown-item{display:flex;align-items:center;justify-content:center;width:var(--tedi-swatch-size);height:var(--tedi-swatch-size);min-height:auto;padding:var(--layout-grid-gutters-02);color:inherit;background:transparent;border-radius:var(--card-radius-rounded)}.tedi-select__options--swatch-grid .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled){outline-offset:0}.tedi-select__options--swatch-grid .tedi-dropdown-item[aria-selected=true],.tedi-select__options--swatch-grid .tedi-dropdown-item.tedi-dropdown-item--selected{color:inherit;background:transparent;border:var(--tedi-borders-02) solid var(--card-border-selected)}.tedi-select__options--swatch-grid .tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled){background:transparent}\n"] }]
         }], ctorParameters: () => [], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], showClearOnInteraction: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearOnInteraction", required: false }] }], dropdownWidthRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownWidthRef", required: false }] }], dropdownAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownAlign", required: false }] }], feedbackText: [{ type: i0.Input, args: [{ isSignal: true, alias: "feedbackText", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], bindLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindLabel", required: false }] }], bindValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindValue", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], allowMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowMultiple", required: false }] }], groupBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupBy", required: false }] }], showSelectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSelectAll", required: false }] }], selectableGroups: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectableGroups", required: false }] }], isTagRemovable: [{ type: i0.Input, args: [{ isSignal: true, alias: "isTagRemovable", required: false }] }], multiRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiRow", required: false }] }], tagEllipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "tagEllipsis", required: false }] }], ellipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "ellipsis", required: false }] }], compareWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareWith", required: false }] }], disabledKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledKey", required: false }] }], noOptionsMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "noOptionsMessage", required: false }] }], maxDropdownHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDropdownHeight", required: false }] }], hideOnScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnScroll", required: false }] }], dropdownType: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownType", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], virtualItemSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualItemSize", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], searchFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchFn", required: false }] }], clearSearchOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearSearchOnSelect", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], searchChange: [{ type: i0.Output, args: ["searchChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], cleared: [{ type: i0.Output, args: ["cleared"] }], listboxRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkListbox), { ...{ read: ElementRef }, isSignal: true }] }], cdkListboxRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkListbox), { isSignal: true }] }], viewport: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkVirtualScrollViewport), { isSignal: true }] }], virtualListboxRef: [{ type: i0.ViewChild, args: ["virtualListbox", { isSignal: true }] }], connectedOverlay: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkConnectedOverlay), { isSignal: true }] }], triggerRef: [{ type: i0.ViewChild, args: ["trigger", { ...{ read: ElementRef }, isSignal: true }] }], searchInputRef: [{ type: i0.ViewChild, args: ["searchInput", { isSignal: true }] }], multiselectContainerRef: [{ type: i0.ViewChild, args: ["multiselectContainer", { isSignal: true }] }], tagRefs: [{ type: i0.ViewChildren, args: ["tagElement", { ...{ read: ElementRef }, isSignal: true }] }], optionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SelectOptionTemplateDirective), { isSignal: true }] }], valueTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SelectValueTemplateDirective), { isSignal: true }] }], tooltipTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SelectTooltipTemplateDirective), { isSignal: true }] }], onWindowResize: [{
                 type: HostListener,
                 args: ["window:resize"]
@@ -10911,7 +11038,7 @@ class PaginationOptionPickerModalComponent {
         this.modalRef.close(value);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: PaginationOptionPickerModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: PaginationOptionPickerModalComponent, isStandalone: true, selector: "tedi-pagination-option-picker-modal", host: { classAttribute: "tedi-pagination-option-picker-modal" }, viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }], ngImport: i0, template: "<tedi-modal>\n  <tedi-modal-header closeButtonSize=\"small\">\n    @if (data.title) {\n      <h2>{{ data.title }}</h2>\n    }\n  </tedi-modal-header>\n  <tedi-modal-content>\n    <cdk-virtual-scroll-viewport\n      class=\"tedi-pagination-option-picker-modal__viewport\"\n      [class.tedi-pagination-option-picker-modal__viewport--ready]=\"ready()\"\n      [itemSize]=\"itemSize\"\n      [style.--_tedi-pagination-option-picker-count]=\"data.options.length\"\n      minBufferPx=\"240\"\n      maxBufferPx=\"480\"\n    >\n      <button\n        *cdkVirtualFor=\"\n          let option of data.options;\n          trackBy: trackByValue;\n          let last = last\n        \"\n        type=\"button\"\n        class=\"tedi-pagination-option-picker-modal__item\"\n        [class.tedi-pagination-option-picker-modal__item--selected]=\"\n          option.value === data.selectedValue\n        \"\n        [class.tedi-pagination-option-picker-modal__item--last]=\"last\"\n        [attr.aria-current]=\"\n          option.value === data.selectedValue ? 'true' : null\n        \"\n        [attr.aria-label]=\"option.ariaLabel\"\n        (click)=\"selectValue(option.value)\"\n      >\n        <span\n          class=\"tedi-pagination-option-picker-modal__radio\"\n          [class.tedi-pagination-option-picker-modal__radio--selected]=\"\n            option.value === data.selectedValue\n          \"\n          aria-hidden=\"true\"\n        ></span>\n        <span class=\"tedi-pagination-option-picker-modal__label\">{{\n          option.label\n        }}</span>\n      </button>\n    </cdk-virtual-scroll-viewport>\n  </tedi-modal-content>\n</tedi-modal>\n", styles: [".tedi-pagination-option-picker-modal{--_tedi-modal-body-padding: 0;--_tedi-pagination-option-picker-item-size: 48px}.tedi-pagination-option-picker-modal .tedi-modal-content{overflow:hidden}.tedi-pagination-option-picker-modal__viewport{display:block;visibility:hidden;width:100%;height:min(var(--_tedi-pagination-option-picker-count, 1) * var(--_tedi-pagination-option-picker-item-size),95dvh)}.tedi-pagination-option-picker-modal__viewport--ready{visibility:visible}.tedi-pagination-option-picker-modal__item{box-sizing:border-box;display:flex;gap:var(--form-checkbox-radio-inner-spacing);align-items:center;width:100%;height:var(--_tedi-pagination-option-picker-item-size);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--general-text-primary);text-align:left;cursor:pointer;background:var(--dropdown-item-default-background);border:none;border-bottom:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-pagination-option-picker-modal__item:hover{background:var(--general-surface-tertiary)}.tedi-pagination-option-picker-modal__item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(var(--tedi-borders-02) * -1)}.tedi-pagination-option-picker-modal__item--selected{color:var(--general-text-white);background:var(--dropdown-item-active-background)}.tedi-pagination-option-picker-modal__item--selected:hover{background:var(--dropdown-item-active-background)}.tedi-pagination-option-picker-modal__item--last{border-bottom:none}.tedi-pagination-option-picker-modal__radio{position:relative;flex-shrink:0;width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);background:var(--form-checkbox-radio-default-background-default);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-default-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}.tedi-pagination-option-picker-modal__radio--selected{background:var(--dropdown-item-active-background);border-color:var(--general-text-white)}.tedi-pagination-option-picker-modal__radio--selected:after{position:absolute;inset:4px;content:\"\";background:var(--general-text-white);border-radius:50%}.tedi-pagination-option-picker-modal__label{flex:1}\n"], dependencies: [{ kind: "component", type: ModalComponent, selector: "tedi-modal", inputs: ["open", "size", "width", "position", "closeOnBackdropClick", "ariaLabel", "ariaLabelledBy"], outputs: ["openChange"] }, { kind: "component", type: ModalHeaderComponent, selector: "tedi-modal-header", inputs: ["showClose", "closeButtonSize"] }, { kind: "component", type: ModalContentComponent, selector: "tedi-modal-content" }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i1.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: PaginationOptionPickerModalComponent, isStandalone: true, selector: "tedi-pagination-option-picker-modal", host: { classAttribute: "tedi-pagination-option-picker-modal" }, viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }], ngImport: i0, template: "<tedi-modal>\n  <tedi-modal-header closeButtonSize=\"small\">\n    @if (data.title) {\n      <h2>{{ data.title }}</h2>\n    }\n  </tedi-modal-header>\n  <tedi-modal-content>\n    <cdk-virtual-scroll-viewport\n      class=\"tedi-pagination-option-picker-modal__viewport\"\n      [class.tedi-pagination-option-picker-modal__viewport--ready]=\"ready()\"\n      [itemSize]=\"itemSize\"\n      [style.--_tedi-pagination-option-picker-count]=\"data.options.length\"\n      minBufferPx=\"240\"\n      maxBufferPx=\"480\"\n    >\n      <button\n        *cdkVirtualFor=\"\n          let option of data.options;\n          trackBy: trackByValue;\n          let last = last\n        \"\n        type=\"button\"\n        class=\"tedi-pagination-option-picker-modal__item\"\n        [class.tedi-pagination-option-picker-modal__item--selected]=\"\n          option.value === data.selectedValue\n        \"\n        [class.tedi-pagination-option-picker-modal__item--last]=\"last\"\n        [attr.aria-current]=\"\n          option.value === data.selectedValue ? 'true' : null\n        \"\n        [attr.aria-label]=\"option.ariaLabel\"\n        (click)=\"selectValue(option.value)\"\n      >\n        <span\n          class=\"tedi-pagination-option-picker-modal__radio\"\n          [class.tedi-pagination-option-picker-modal__radio--selected]=\"\n            option.value === data.selectedValue\n          \"\n          aria-hidden=\"true\"\n        ></span>\n        <span class=\"tedi-pagination-option-picker-modal__label\">{{\n          option.label\n        }}</span>\n      </button>\n    </cdk-virtual-scroll-viewport>\n  </tedi-modal-content>\n</tedi-modal>\n", styles: [".tedi-pagination-option-picker-modal{--_tedi-modal-body-padding: 0;--_tedi-pagination-option-picker-item-size: 48px}.tedi-pagination-option-picker-modal .tedi-modal-content{overflow:hidden}.tedi-pagination-option-picker-modal__viewport{display:block;visibility:hidden;width:100%;height:min(var(--_tedi-pagination-option-picker-count, 1) * var(--_tedi-pagination-option-picker-item-size),95dvh)}.tedi-pagination-option-picker-modal__viewport--ready{visibility:visible}.tedi-pagination-option-picker-modal__item{box-sizing:border-box;display:flex;gap:var(--form-checkbox-radio-inner-spacing);align-items:center;width:100%;height:var(--_tedi-pagination-option-picker-item-size);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--general-text-primary);text-align:left;cursor:pointer;background:var(--dropdown-item-default-background);border:none;border-bottom:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-pagination-option-picker-modal__item:hover{background:var(--general-surface-tertiary)}.tedi-pagination-option-picker-modal__item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(var(--tedi-borders-02) * -1)}.tedi-pagination-option-picker-modal__item--selected{color:var(--general-text-white);background:var(--dropdown-item-active-background)}.tedi-pagination-option-picker-modal__item--selected:hover{background:var(--dropdown-item-active-background)}.tedi-pagination-option-picker-modal__item--last{border-bottom:none}.tedi-pagination-option-picker-modal__radio{position:relative;flex-shrink:0;width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);background:var(--form-choice-radio-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-radio-unselected-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}.tedi-pagination-option-picker-modal__radio--selected{background:var(--dropdown-item-active-background);border-color:var(--general-text-white)}.tedi-pagination-option-picker-modal__radio--selected:after{position:absolute;inset:4px;content:\"\";background:var(--general-text-white);border-radius:50%}.tedi-pagination-option-picker-modal__label{flex:1}\n"], dependencies: [{ kind: "component", type: ModalComponent, selector: "tedi-modal", inputs: ["open", "size", "width", "position", "closeOnBackdropClick", "ariaLabel", "ariaLabelledBy"], outputs: ["openChange"] }, { kind: "component", type: ModalHeaderComponent, selector: "tedi-modal-header", inputs: ["showClose", "closeButtonSize"] }, { kind: "component", type: ModalContentComponent, selector: "tedi-modal-content" }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i1.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: PaginationOptionPickerModalComponent, decorators: [{
             type: Component,
@@ -10922,7 +11049,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         ScrollingModule,
                     ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "tedi-pagination-option-picker-modal",
-                    }, template: "<tedi-modal>\n  <tedi-modal-header closeButtonSize=\"small\">\n    @if (data.title) {\n      <h2>{{ data.title }}</h2>\n    }\n  </tedi-modal-header>\n  <tedi-modal-content>\n    <cdk-virtual-scroll-viewport\n      class=\"tedi-pagination-option-picker-modal__viewport\"\n      [class.tedi-pagination-option-picker-modal__viewport--ready]=\"ready()\"\n      [itemSize]=\"itemSize\"\n      [style.--_tedi-pagination-option-picker-count]=\"data.options.length\"\n      minBufferPx=\"240\"\n      maxBufferPx=\"480\"\n    >\n      <button\n        *cdkVirtualFor=\"\n          let option of data.options;\n          trackBy: trackByValue;\n          let last = last\n        \"\n        type=\"button\"\n        class=\"tedi-pagination-option-picker-modal__item\"\n        [class.tedi-pagination-option-picker-modal__item--selected]=\"\n          option.value === data.selectedValue\n        \"\n        [class.tedi-pagination-option-picker-modal__item--last]=\"last\"\n        [attr.aria-current]=\"\n          option.value === data.selectedValue ? 'true' : null\n        \"\n        [attr.aria-label]=\"option.ariaLabel\"\n        (click)=\"selectValue(option.value)\"\n      >\n        <span\n          class=\"tedi-pagination-option-picker-modal__radio\"\n          [class.tedi-pagination-option-picker-modal__radio--selected]=\"\n            option.value === data.selectedValue\n          \"\n          aria-hidden=\"true\"\n        ></span>\n        <span class=\"tedi-pagination-option-picker-modal__label\">{{\n          option.label\n        }}</span>\n      </button>\n    </cdk-virtual-scroll-viewport>\n  </tedi-modal-content>\n</tedi-modal>\n", styles: [".tedi-pagination-option-picker-modal{--_tedi-modal-body-padding: 0;--_tedi-pagination-option-picker-item-size: 48px}.tedi-pagination-option-picker-modal .tedi-modal-content{overflow:hidden}.tedi-pagination-option-picker-modal__viewport{display:block;visibility:hidden;width:100%;height:min(var(--_tedi-pagination-option-picker-count, 1) * var(--_tedi-pagination-option-picker-item-size),95dvh)}.tedi-pagination-option-picker-modal__viewport--ready{visibility:visible}.tedi-pagination-option-picker-modal__item{box-sizing:border-box;display:flex;gap:var(--form-checkbox-radio-inner-spacing);align-items:center;width:100%;height:var(--_tedi-pagination-option-picker-item-size);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--general-text-primary);text-align:left;cursor:pointer;background:var(--dropdown-item-default-background);border:none;border-bottom:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-pagination-option-picker-modal__item:hover{background:var(--general-surface-tertiary)}.tedi-pagination-option-picker-modal__item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(var(--tedi-borders-02) * -1)}.tedi-pagination-option-picker-modal__item--selected{color:var(--general-text-white);background:var(--dropdown-item-active-background)}.tedi-pagination-option-picker-modal__item--selected:hover{background:var(--dropdown-item-active-background)}.tedi-pagination-option-picker-modal__item--last{border-bottom:none}.tedi-pagination-option-picker-modal__radio{position:relative;flex-shrink:0;width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);background:var(--form-checkbox-radio-default-background-default);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-default-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}.tedi-pagination-option-picker-modal__radio--selected{background:var(--dropdown-item-active-background);border-color:var(--general-text-white)}.tedi-pagination-option-picker-modal__radio--selected:after{position:absolute;inset:4px;content:\"\";background:var(--general-text-white);border-radius:50%}.tedi-pagination-option-picker-modal__label{flex:1}\n"] }]
+                    }, template: "<tedi-modal>\n  <tedi-modal-header closeButtonSize=\"small\">\n    @if (data.title) {\n      <h2>{{ data.title }}</h2>\n    }\n  </tedi-modal-header>\n  <tedi-modal-content>\n    <cdk-virtual-scroll-viewport\n      class=\"tedi-pagination-option-picker-modal__viewport\"\n      [class.tedi-pagination-option-picker-modal__viewport--ready]=\"ready()\"\n      [itemSize]=\"itemSize\"\n      [style.--_tedi-pagination-option-picker-count]=\"data.options.length\"\n      minBufferPx=\"240\"\n      maxBufferPx=\"480\"\n    >\n      <button\n        *cdkVirtualFor=\"\n          let option of data.options;\n          trackBy: trackByValue;\n          let last = last\n        \"\n        type=\"button\"\n        class=\"tedi-pagination-option-picker-modal__item\"\n        [class.tedi-pagination-option-picker-modal__item--selected]=\"\n          option.value === data.selectedValue\n        \"\n        [class.tedi-pagination-option-picker-modal__item--last]=\"last\"\n        [attr.aria-current]=\"\n          option.value === data.selectedValue ? 'true' : null\n        \"\n        [attr.aria-label]=\"option.ariaLabel\"\n        (click)=\"selectValue(option.value)\"\n      >\n        <span\n          class=\"tedi-pagination-option-picker-modal__radio\"\n          [class.tedi-pagination-option-picker-modal__radio--selected]=\"\n            option.value === data.selectedValue\n          \"\n          aria-hidden=\"true\"\n        ></span>\n        <span class=\"tedi-pagination-option-picker-modal__label\">{{\n          option.label\n        }}</span>\n      </button>\n    </cdk-virtual-scroll-viewport>\n  </tedi-modal-content>\n</tedi-modal>\n", styles: [".tedi-pagination-option-picker-modal{--_tedi-modal-body-padding: 0;--_tedi-pagination-option-picker-item-size: 48px}.tedi-pagination-option-picker-modal .tedi-modal-content{overflow:hidden}.tedi-pagination-option-picker-modal__viewport{display:block;visibility:hidden;width:100%;height:min(var(--_tedi-pagination-option-picker-count, 1) * var(--_tedi-pagination-option-picker-item-size),95dvh)}.tedi-pagination-option-picker-modal__viewport--ready{visibility:visible}.tedi-pagination-option-picker-modal__item{box-sizing:border-box;display:flex;gap:var(--form-checkbox-radio-inner-spacing);align-items:center;width:100%;height:var(--_tedi-pagination-option-picker-item-size);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--general-text-primary);text-align:left;cursor:pointer;background:var(--dropdown-item-default-background);border:none;border-bottom:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-pagination-option-picker-modal__item:hover{background:var(--general-surface-tertiary)}.tedi-pagination-option-picker-modal__item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(var(--tedi-borders-02) * -1)}.tedi-pagination-option-picker-modal__item--selected{color:var(--general-text-white);background:var(--dropdown-item-active-background)}.tedi-pagination-option-picker-modal__item--selected:hover{background:var(--dropdown-item-active-background)}.tedi-pagination-option-picker-modal__item--last{border-bottom:none}.tedi-pagination-option-picker-modal__radio{position:relative;flex-shrink:0;width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);background:var(--form-choice-radio-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-radio-unselected-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}.tedi-pagination-option-picker-modal__radio--selected{background:var(--dropdown-item-active-background);border-color:var(--general-text-white)}.tedi-pagination-option-picker-modal__radio--selected:after{position:absolute;inset:4px;content:\"\";background:var(--general-text-white);border-radius:50%}.tedi-pagination-option-picker-modal__label{flex:1}\n"] }]
         }], propDecorators: { viewport: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkVirtualScrollViewport), { isSignal: true }] }] } });
 class PaginationComponent {
@@ -11537,7 +11664,7 @@ class RadioComponent {
      */
     size = input("default", ...(ngDevMode ? [{ debugName: "size" }] : []));
     /**
-     * Is radio invalid?
+     * Show the radio in an invalid state.
      * @default false
      */
     invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
@@ -11548,7 +11675,7 @@ class RadioComponent {
      */
     value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
     /**
-     * Disables this radio. An enclosing disabled `<tedi-radio-group>` forces
+     * Disable this radio. An enclosing disabled `<tedi-radio-group>` forces
      * disabled regardless of this input.
      * @default false
      */
@@ -11584,7 +11711,7 @@ class RadioComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: RadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: RadioComponent, isStandalone: true, selector: "input[type=radio][tedi-radio]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "change": "handleChange()" }, properties: { "class.tedi-radio--large": "size() === 'large'", "class.tedi-radio--invalid": "invalid()", "disabled": "effectiveDisabled()" } }, ngImport: i0, template: "", isInline: true, styles: ["input[tedi-radio][type=radio]{--_radio-dot-size: calc(var(--form-checkbox-radio-size-responsive) * .67);position:relative;width:var(--form-checkbox-radio-size-responsive);min-width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--form-checkbox-radio-default-background-default);border:1px solid var(--form-checkbox-radio-default-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}input[tedi-radio][type=radio]:before{position:absolute;top:50%;left:50%;width:var(--_radio-dot-size);height:var(--_radio-dot-size);content:\"\";background:transparent;border-radius:var(--form-checkbox-radio-indicator-radius-radio);transform:translate(-50%,-50%);transition:background-color .15s ease}input[tedi-radio][type=radio]:not(:disabled):hover{border-color:var(--form-checkbox-radio-default-border-hover);box-shadow:0 0 0 1px var(--form-checkbox-radio-default-border-hover)}input[tedi-radio][type=radio]:not(:disabled):active{border-color:var(--form-checkbox-radio-default-border-active);box-shadow:none}input[tedi-radio][type=radio]:not(:disabled):active:before{background:var(--form-checkbox-radio-default-background-active)}input[tedi-radio][type=radio]:not(:checked):disabled{cursor:not-allowed;background-color:var(--form-general-background-disabled);border-color:var(--form-general-border-disabled)}input[tedi-radio][type=radio]:checked{border-color:var(--form-checkbox-radio-default-border-selected)}input[tedi-radio][type=radio]:checked:before{background:var(--form-checkbox-radio-default-background-selected)}input[tedi-radio][type=radio]:checked:disabled{cursor:not-allowed;border-color:var(--form-checkbox-radio-default-border-selected-disabled)}input[tedi-radio][type=radio]:checked:disabled:before{background:var(--form-checkbox-radio-default-background-selected-disabled)}input[tedi-radio][type=radio]:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched{background-color:var(--form-checkbox-radio-default-background-error);border-color:var(--form-general-feedback-error-border)}input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid:hover,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid:hover,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched:hover{border-color:var(--form-general-feedback-error-border);box-shadow:0 0 0 1px var(--form-general-feedback-error-border)}input[tedi-radio][type=radio].tedi-radio--large{--_radio-dot-size: calc(var(--form-checkbox-radio-size-large) * .67);width:var(--form-checkbox-radio-size-large);height:var(--form-checkbox-radio-size-large)}label:has(input[tedi-radio]:not(:disabled)){cursor:pointer}label:has(input[tedi-radio]:disabled){cursor:not-allowed}label:has(input[tedi-radio])+tedi-feedback-text{padding-left:var(--form-checkbox-radio-size-responsive);margin-left:var(--form-checkbox-radio-inner-spacing)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: RadioComponent, isStandalone: true, selector: "input[type=radio][tedi-radio]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "change": "handleChange()" }, properties: { "class.tedi-radio--large": "size() === 'large'", "class.tedi-radio--invalid": "invalid()", "disabled": "effectiveDisabled()" } }, ngImport: i0, template: "", isInline: true, styles: ["input[tedi-radio][type=radio]{--_radio-dot-size: calc(var(--form-checkbox-radio-size-responsive) * .67);--_radio-bg: var(--form-choice-radio-unselected-background-default);--_radio-border: var(--form-choice-radio-unselected-border-default);--_radio-dot: transparent;--_radio-inset: 0 0 0 0 transparent;--_radio-ring: 0 0 0 0 transparent;position:relative;width:var(--form-checkbox-radio-size-responsive);min-width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--_radio-bg);border:var(--tedi-borders-01) solid var(--_radio-border);border-radius:var(--form-checkbox-radio-indicator-radius-radio);box-shadow:var(--_radio-inset),var(--_radio-ring)}input[tedi-radio][type=radio]:before{position:absolute;top:50%;left:50%;width:var(--_radio-dot-size);height:var(--_radio-dot-size);content:\"\";background:var(--_radio-dot);border-radius:var(--form-checkbox-radio-indicator-radius-radio);transform:translate(-50%,-50%);transition:background-color .15s ease}input[tedi-radio][type=radio]:not(:disabled,:checked):hover{--_radio-border: var(--form-choice-radio-unselected-border-hover);--_radio-inset: inset 0 0 0 calc(var(--tedi-borders-02) - var(--tedi-borders-01)) var(--_radio-border)}input[tedi-radio][type=radio]:not(:disabled,:checked):active{--_radio-border: var(--form-choice-radio-unselected-border-active);--_radio-inset: inset 0 0 0 calc(var(--tedi-borders-02) - var(--tedi-borders-01)) var(--_radio-border)}input[tedi-radio][type=radio]:focus-visible:not(:disabled){--_radio-ring: 0 0 0 var(--tedi-borders-01) var(--general-effect-colors-focus-outset-inner-shadow), 0 0 0 var(--tedi-borders-03) var(--general-effect-colors-focus-outset-outer-shadow);outline:none}input[tedi-radio][type=radio]:focus-visible:not(:disabled,:checked){--_radio-border: var(--form-choice-radio-unselected-border-focus)}input[tedi-radio][type=radio]:disabled:not(:checked){--_radio-bg: var(--form-choice-radio-unselected-background-disabled);--_radio-border: var(--form-choice-radio-unselected-border-disabled);cursor:not-allowed}input[tedi-radio][type=radio]:checked{--_radio-bg: var(--form-choice-radio-selected-background-default);--_radio-border: var(--form-choice-radio-selected-border-default);--_radio-dot: var(--form-choice-radio-selected-indicator-default)}input[tedi-radio][type=radio]:checked:not(:disabled):hover{--_radio-border: var(--form-choice-radio-selected-border-hover);--_radio-dot: var(--form-choice-radio-selected-indicator-hover)}input[tedi-radio][type=radio]:checked:not(:disabled):active{--_radio-border: var(--form-choice-radio-selected-border-active);--_radio-dot: var(--form-choice-radio-selected-indicator-active)}input[tedi-radio][type=radio]:checked:focus-visible:not(:disabled,:hover,:active){--_radio-border: var(--form-choice-radio-selected-border-focus);--_radio-dot: var(--form-choice-radio-selected-indicator-focus)}input[tedi-radio][type=radio]:checked:disabled{--_radio-border: var(--form-choice-radio-selected-border-disabled);--_radio-dot: var(--form-choice-radio-selected-indicator-disabled);cursor:not-allowed}input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched{--_radio-border: var(--form-choice-radio-unselected-border-error)}input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid:hover,input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid:active,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid:hover,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid:active,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched:hover,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched:active{--_radio-inset: inset 0 0 0 calc(var(--tedi-borders-02) - var(--tedi-borders-01)) var(--_radio-border)}input[tedi-radio][type=radio].tedi-radio--large{--_radio-dot-size: calc(var(--form-checkbox-radio-size-large) * .67);width:var(--form-checkbox-radio-size-large);height:var(--form-checkbox-radio-size-large)}label:has(input[tedi-radio]:not(:disabled)){cursor:pointer}label:has(input[tedi-radio]:disabled){cursor:not-allowed}label:has(input[tedi-radio])+tedi-feedback-text{padding-left:var(--form-checkbox-radio-size-responsive);margin-left:var(--form-checkbox-radio-inner-spacing)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: RadioComponent, decorators: [{
             type: Component,
@@ -11593,7 +11720,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "[class.tedi-radio--invalid]": "invalid()",
                         "[disabled]": "effectiveDisabled()",
                         "(change)": "handleChange()",
-                    }, styles: ["input[tedi-radio][type=radio]{--_radio-dot-size: calc(var(--form-checkbox-radio-size-responsive) * .67);position:relative;width:var(--form-checkbox-radio-size-responsive);min-width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--form-checkbox-radio-default-background-default);border:1px solid var(--form-checkbox-radio-default-border-default);border-radius:var(--form-checkbox-radio-indicator-radius-radio)}input[tedi-radio][type=radio]:before{position:absolute;top:50%;left:50%;width:var(--_radio-dot-size);height:var(--_radio-dot-size);content:\"\";background:transparent;border-radius:var(--form-checkbox-radio-indicator-radius-radio);transform:translate(-50%,-50%);transition:background-color .15s ease}input[tedi-radio][type=radio]:not(:disabled):hover{border-color:var(--form-checkbox-radio-default-border-hover);box-shadow:0 0 0 1px var(--form-checkbox-radio-default-border-hover)}input[tedi-radio][type=radio]:not(:disabled):active{border-color:var(--form-checkbox-radio-default-border-active);box-shadow:none}input[tedi-radio][type=radio]:not(:disabled):active:before{background:var(--form-checkbox-radio-default-background-active)}input[tedi-radio][type=radio]:not(:checked):disabled{cursor:not-allowed;background-color:var(--form-general-background-disabled);border-color:var(--form-general-border-disabled)}input[tedi-radio][type=radio]:checked{border-color:var(--form-checkbox-radio-default-border-selected)}input[tedi-radio][type=radio]:checked:before{background:var(--form-checkbox-radio-default-background-selected)}input[tedi-radio][type=radio]:checked:disabled{cursor:not-allowed;border-color:var(--form-checkbox-radio-default-border-selected-disabled)}input[tedi-radio][type=radio]:checked:disabled:before{background:var(--form-checkbox-radio-default-background-selected-disabled)}input[tedi-radio][type=radio]:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched{background-color:var(--form-checkbox-radio-default-background-error);border-color:var(--form-general-feedback-error-border)}input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid:hover,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid:hover,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched:hover{border-color:var(--form-general-feedback-error-border);box-shadow:0 0 0 1px var(--form-general-feedback-error-border)}input[tedi-radio][type=radio].tedi-radio--large{--_radio-dot-size: calc(var(--form-checkbox-radio-size-large) * .67);width:var(--form-checkbox-radio-size-large);height:var(--form-checkbox-radio-size-large)}label:has(input[tedi-radio]:not(:disabled)){cursor:pointer}label:has(input[tedi-radio]:disabled){cursor:not-allowed}label:has(input[tedi-radio])+tedi-feedback-text{padding-left:var(--form-checkbox-radio-size-responsive);margin-left:var(--form-checkbox-radio-inner-spacing)}\n"] }]
+                    }, styles: ["input[tedi-radio][type=radio]{--_radio-dot-size: calc(var(--form-checkbox-radio-size-responsive) * .67);--_radio-bg: var(--form-choice-radio-unselected-background-default);--_radio-border: var(--form-choice-radio-unselected-border-default);--_radio-dot: transparent;--_radio-inset: 0 0 0 0 transparent;--_radio-ring: 0 0 0 0 transparent;position:relative;width:var(--form-checkbox-radio-size-responsive);min-width:var(--form-checkbox-radio-size-responsive);height:var(--form-checkbox-radio-size-responsive);padding:0;margin:0;vertical-align:middle;appearance:none;cursor:pointer;background-color:var(--_radio-bg);border:var(--tedi-borders-01) solid var(--_radio-border);border-radius:var(--form-checkbox-radio-indicator-radius-radio);box-shadow:var(--_radio-inset),var(--_radio-ring)}input[tedi-radio][type=radio]:before{position:absolute;top:50%;left:50%;width:var(--_radio-dot-size);height:var(--_radio-dot-size);content:\"\";background:var(--_radio-dot);border-radius:var(--form-checkbox-radio-indicator-radius-radio);transform:translate(-50%,-50%);transition:background-color .15s ease}input[tedi-radio][type=radio]:not(:disabled,:checked):hover{--_radio-border: var(--form-choice-radio-unselected-border-hover);--_radio-inset: inset 0 0 0 calc(var(--tedi-borders-02) - var(--tedi-borders-01)) var(--_radio-border)}input[tedi-radio][type=radio]:not(:disabled,:checked):active{--_radio-border: var(--form-choice-radio-unselected-border-active);--_radio-inset: inset 0 0 0 calc(var(--tedi-borders-02) - var(--tedi-borders-01)) var(--_radio-border)}input[tedi-radio][type=radio]:focus-visible:not(:disabled){--_radio-ring: 0 0 0 var(--tedi-borders-01) var(--general-effect-colors-focus-outset-inner-shadow), 0 0 0 var(--tedi-borders-03) var(--general-effect-colors-focus-outset-outer-shadow);outline:none}input[tedi-radio][type=radio]:focus-visible:not(:disabled,:checked){--_radio-border: var(--form-choice-radio-unselected-border-focus)}input[tedi-radio][type=radio]:disabled:not(:checked){--_radio-bg: var(--form-choice-radio-unselected-background-disabled);--_radio-border: var(--form-choice-radio-unselected-border-disabled);cursor:not-allowed}input[tedi-radio][type=radio]:checked{--_radio-bg: var(--form-choice-radio-selected-background-default);--_radio-border: var(--form-choice-radio-selected-border-default);--_radio-dot: var(--form-choice-radio-selected-indicator-default)}input[tedi-radio][type=radio]:checked:not(:disabled):hover{--_radio-border: var(--form-choice-radio-selected-border-hover);--_radio-dot: var(--form-choice-radio-selected-indicator-hover)}input[tedi-radio][type=radio]:checked:not(:disabled):active{--_radio-border: var(--form-choice-radio-selected-border-active);--_radio-dot: var(--form-choice-radio-selected-indicator-active)}input[tedi-radio][type=radio]:checked:focus-visible:not(:disabled,:hover,:active){--_radio-border: var(--form-choice-radio-selected-border-focus);--_radio-dot: var(--form-choice-radio-selected-indicator-focus)}input[tedi-radio][type=radio]:checked:disabled{--_radio-border: var(--form-choice-radio-selected-border-disabled);--_radio-dot: var(--form-choice-radio-selected-indicator-disabled);cursor:not-allowed}input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched{--_radio-border: var(--form-choice-radio-unselected-border-error)}input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid:hover,input[tedi-radio][type=radio]:not(:checked,:disabled).tedi-radio--invalid:active,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid:hover,input[tedi-radio][type=radio]:not(:checked,:disabled):user-invalid:active,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched:hover,input[tedi-radio][type=radio]:not(:checked,:disabled).ng-invalid.ng-touched:active{--_radio-inset: inset 0 0 0 calc(var(--tedi-borders-02) - var(--tedi-borders-01)) var(--_radio-border)}input[tedi-radio][type=radio].tedi-radio--large{--_radio-dot-size: calc(var(--form-checkbox-radio-size-large) * .67);width:var(--form-checkbox-radio-size-large);height:var(--form-checkbox-radio-size-large)}label:has(input[tedi-radio]:not(:disabled)){cursor:pointer}label:has(input[tedi-radio]:disabled){cursor:not-allowed}label:has(input[tedi-radio])+tedi-feedback-text{padding-left:var(--form-checkbox-radio-size-responsive);margin-left:var(--form-checkbox-radio-inner-spacing)}\n"] }]
         }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
 /**
@@ -11939,7 +12066,7 @@ class FormFieldComponent {
     /**
      * Whether the field shows a clear button once the control holds a value. The
      * single source of truth for every control inside it — date and time fields
-     * read it too instead of declaring their own input. A textarea never gets one.
+     * read it too instead of declaring their own input.
      * @default true
      */
     clearable = input(true, ...(ngDevMode ? [{ debugName: "clearable", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
@@ -11991,6 +12118,7 @@ class FormFieldComponent {
             !!control?.reset);
     }, ...(ngDevMode ? [{ debugName: "renderClearButton" }] : []));
     ownsSurface = computed(() => this.hasBox(), ...(ngDevMode ? [{ debugName: "ownsSurface" }] : []));
+    controlScrollbarWidth = computed(() => `${this.control()?.scrollbarWidth?.() ?? 0}px`, ...(ngDevMode ? [{ debugName: "controlScrollbarWidth" }] : []));
     disabled = computed(() => this.inputGroup?.disabled() ?? false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
     invalid = computed(() => this.feedback()?.type() === "error" ||
         this.characterCountExceeded() ||
@@ -12048,10 +12176,17 @@ class FormFieldComponent {
         return 18;
     }, ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
     showClearButton = computed(() => this.renderClearButton() &&
+        !this.isDisabled() &&
         !!this.control()?.value() &&
         !this.control()?.readOnly?.(), ...(ngDevMode ? [{ debugName: "showClearButton" }] : []));
+    /**
+     * Focus goes back to the control: the button hides once the value is gone, so
+     * it would otherwise drop to the page.
+     */
     clear() {
-        this.control()?.reset?.();
+        const control = this.control();
+        control?.reset?.();
+        control?.focus?.();
     }
     /**
      * The box padding and the layout wrappers around the control are outside its
@@ -12084,7 +12219,7 @@ class FormFieldComponent {
                 provide: TEDI_FIELD_CONTEXT,
                 useExisting: forwardRef(() => FormFieldComponent),
             },
-        ], queries: [{ propertyName: "control", first: true, predicate: TEDI_FORM_FIELD_CONTROL, descendants: true, isSignal: true }, { propertyName: "feedback", first: true, predicate: FeedbackTextComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"label[tedi-label], tedi-label-row\"></ng-content>\n\n<ng-template #controlSlot>\n  <ng-content></ng-content>\n</ng-template>\n\n@if (hasBox()) {\n  <div [ngClass]=\"boxClasses()\" (mousedown)=\"handleBoxMouseDown($event)\">\n    <ng-container [ngTemplateOutlet]=\"controlSlot\"></ng-container>\n\n    @if (renderClearButton()) {\n      <div\n        class=\"tedi-form-field__buttons\"\n        [class.tedi-form-field__buttons--hidden]=\"!showClearButton()\"\n        [attr.aria-hidden]=\"!showClearButton() || null\"\n      >\n        <button\n          class=\"tedi-form-field__clear\"\n          tedi-closing-button\n          type=\"button\"\n          size=\"small\"\n          [ariaLabel]=\"'clear' | tediTranslate\"\n          [iconSize]=\"18\"\n          [tabIndex]=\"showClearButton() ? 0 : -1\"\n          [disabled]=\"isDisabled() || !showClearButton()\"\n          (click)=\"clear()\"\n        ></button>\n\n        @if (icon()) {\n          <tedi-separator axis=\"vertical\" size=\"1rem\" />\n        }\n      </div>\n    }\n\n    @if (resolvedIcon(); as icon) {\n      <div class=\"tedi-form-field__icon\">\n        <tedi-icon\n          [name]=\"icon.name\"\n          [size]=\"icon.size ?? iconSize()\"\n          [color]=\"icon.color ?? 'inherit'\"\n          [type]=\"icon.type ?? 'outlined'\"\n          [variant]=\"icon.variant ?? 'outlined'\"\n          [attr.aria-hidden]=\"true\"\n        />\n      </div>\n    }\n  </div>\n} @else {\n  <ng-container [ngTemplateOutlet]=\"controlSlot\"></ng-container>\n}\n\n@if (feedback() || characterLimit() != null) {\n  <div class=\"tedi-form-field__feedback\">\n    <ng-content select=\"tedi-feedback-text\"></ng-content>\n\n    @if (characterLimit() != null) {\n      <span\n        class=\"tedi-form-field__character-count\"\n        [class.tedi-form-field__character-count--error]=\"\n          characterCountExceeded()\n        \"\n        [id]=\"characterCountId()\"\n        aria-live=\"polite\"\n      >\n        {{ characterCount() }}/{{ characterLimit() }}\n      </span>\n    }\n  </div>\n}\n\n<div class=\"tedi-form-field__extra\">\n  <ng-content select=\"[tediFormFieldExtra]\"></ng-content>\n</div>\n", styles: [".tedi-form-field{--_icon-size: 1.125rem;display:flex;flex-direction:column}.tedi-form-field--small{--_icon-size: 1rem}.tedi-form-field--large{--_icon-size: 1.5rem}.tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);height:var(--_field-height);padding:var(--_field-padding-y) var(--_field-padding-x)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):active,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):has(input:active,textarea:active),.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):focus-within,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):has(input:focus-visible,textarea:focus-visible){--_field-ring-color: var(--_field-border-color)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:hover,textarea:hover){--_field-border-color: var(--form-input-border-hover)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:active,textarea:active){--_field-border-color: var(--form-input-border-active)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-within,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:focus-visible,textarea:focus-visible){--_field-border-color: var(--form-input-border-focus)}.tedi-form-field__box:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-form-field__box{--tedi-form-field-addon-lane: 0rem;position:relative;display:flex;gap:var(--form-field-inner-spacing);align-items:center;width:100%}.tedi-form-field__box:has(.tedi-form-field__icon){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--_icon-size) )}.tedi-form-field__box:has(.tedi-form-field__buttons){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--form-field-button-height-sm) )}.tedi-form-field__box:has(.tedi-form-field__buttons):has(.tedi-form-field__icon){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--form-field-button-height-sm) + var(--layout-grid-gutters-04) + var(--tedi-borders-01) + var(--form-field-inner-spacing) + var(--_icon-size) )}.tedi-form-field--small .tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-form-field--large .tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-lg);--_field-padding-x: var(--form-field-padding-x-lg);--_field-height: var(--form-field-height-lg)}.tedi-form-field__buttons{display:flex;gap:var(--layout-grid-gutters-04);align-items:center}.tedi-form-field__buttons--hidden,.tedi-form-field--clear-on-interaction .tedi-form-field__buttons{visibility:hidden}.tedi-form-field--clear-on-interaction .tedi-form-field__box:hover .tedi-form-field__buttons,.tedi-form-field--clear-on-interaction .tedi-form-field__box:active .tedi-form-field__buttons,.tedi-form-field--clear-on-interaction .tedi-form-field__box:focus-within .tedi-form-field__buttons{visibility:visible}.tedi-form-field__clear:disabled{cursor:not-allowed}.tedi-form-field__feedback{display:flex;gap:var(--layout-grid-gutters-16);align-items:flex-start;margin-top:var(--form-field-outer-spacing)}.tedi-form-field__character-count{margin-left:auto;font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);white-space:nowrap}.tedi-form-field__character-count--error{color:var(--form-general-feedback-error-text)}.tedi-form-field__extra{margin-top:var(--form-field-outer-spacing)}.tedi-form-field__extra:empty{display:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: SeparatorComponent, selector: "tedi-separator", inputs: ["axis", "color", "variant", "dotSize", "dotFilled", "thickness", "spacing", "size"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], queries: [{ propertyName: "control", first: true, predicate: TEDI_FORM_FIELD_CONTROL, descendants: true, isSignal: true }, { propertyName: "feedback", first: true, predicate: FeedbackTextComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"label[tedi-label], tedi-label-row\"></ng-content>\n\n<ng-template #controlSlot>\n  <ng-content></ng-content>\n</ng-template>\n\n@if (hasBox()) {\n  <div\n    [ngClass]=\"boxClasses()\"\n    [style.--tedi-form-field-control-scrollbar]=\"controlScrollbarWidth()\"\n    (mousedown)=\"handleBoxMouseDown($event)\"\n  >\n    <ng-container [ngTemplateOutlet]=\"controlSlot\"></ng-container>\n\n    @if (renderClearButton()) {\n      <div\n        class=\"tedi-form-field__buttons\"\n        [class.tedi-form-field__buttons--hidden]=\"!showClearButton()\"\n        [attr.aria-hidden]=\"!showClearButton() || null\"\n      >\n        <button\n          class=\"tedi-form-field__clear\"\n          tedi-closing-button\n          type=\"button\"\n          size=\"small\"\n          [ariaLabel]=\"'clear' | tediTranslate\"\n          [iconSize]=\"18\"\n          [tabIndex]=\"showClearButton() ? 0 : -1\"\n          [disabled]=\"!showClearButton()\"\n          (click)=\"clear()\"\n        ></button>\n\n        @if (icon()) {\n          <tedi-separator axis=\"vertical\" size=\"1rem\" />\n        }\n      </div>\n    }\n\n    @if (resolvedIcon(); as icon) {\n      <div class=\"tedi-form-field__icon\">\n        <tedi-icon\n          [name]=\"icon.name\"\n          [size]=\"icon.size ?? iconSize()\"\n          [color]=\"icon.color ?? 'inherit'\"\n          [type]=\"icon.type ?? 'outlined'\"\n          [variant]=\"icon.variant ?? 'outlined'\"\n          [attr.aria-hidden]=\"true\"\n        />\n      </div>\n    }\n  </div>\n} @else {\n  <ng-container [ngTemplateOutlet]=\"controlSlot\"></ng-container>\n}\n\n@if (feedback() || characterLimit() != null) {\n  <div class=\"tedi-form-field__feedback\">\n    <ng-content select=\"tedi-feedback-text\"></ng-content>\n\n    @if (characterLimit() != null) {\n      <span\n        class=\"tedi-form-field__character-count\"\n        [class.tedi-form-field__character-count--error]=\"\n          characterCountExceeded()\n        \"\n        [id]=\"characterCountId()\"\n        aria-live=\"polite\"\n      >\n        {{ characterCount() }}/{{ characterLimit() }}\n      </span>\n    }\n  </div>\n}\n\n<div class=\"tedi-form-field__extra\">\n  <ng-content select=\"[tediFormFieldExtra]\"></ng-content>\n</div>\n", styles: [".tedi-form-field{--_icon-size: 1.125rem;display:flex;flex-direction:column}.tedi-form-field--small{--_icon-size: 1rem}.tedi-form-field--large{--_icon-size: 1.5rem}.tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);height:var(--_field-height);padding:var(--_field-padding-y) var(--_field-padding-x)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):active,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):has(input:active,textarea:active),.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):focus-within,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):has(input:focus-visible,textarea:focus-visible){--_field-ring-color: var(--_field-border-color)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:hover,textarea:hover){--_field-border-color: var(--form-input-border-hover)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:active,textarea:active){--_field-border-color: var(--form-input-border-active)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-within,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:focus-visible,textarea:focus-visible){--_field-border-color: var(--form-input-border-focus)}.tedi-form-field__box:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-form-field__box{--tedi-form-field-addon-lane: 0rem;position:relative;display:flex;gap:var(--form-field-inner-spacing);align-items:center;width:100%}.tedi-form-field__box:has(.tedi-form-field__icon){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--_icon-size) )}.tedi-form-field__box:has(.tedi-form-field__buttons){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--form-field-button-height-sm) )}.tedi-form-field__box:has(.tedi-form-field__buttons):has(.tedi-form-field__icon){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--form-field-button-height-sm) + var(--layout-grid-gutters-04) + var(--tedi-borders-01) + var(--form-field-inner-spacing) + var(--_icon-size) )}.tedi-form-field--small .tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-form-field--large .tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-lg);--_field-padding-x: var(--form-field-padding-x-lg);--_field-height: var(--form-field-height-lg)}.tedi-form-field__buttons{display:flex;gap:var(--layout-grid-gutters-04);align-items:center}.tedi-form-field__buttons--hidden,.tedi-form-field--clear-on-interaction .tedi-form-field__buttons{visibility:hidden}.tedi-form-field--clear-on-interaction .tedi-form-field__box:hover .tedi-form-field__buttons,.tedi-form-field--clear-on-interaction .tedi-form-field__box:active .tedi-form-field__buttons,.tedi-form-field--clear-on-interaction .tedi-form-field__box:focus-within .tedi-form-field__buttons{visibility:visible}.tedi-form-field__clear:disabled{cursor:not-allowed}.tedi-form-field__feedback{display:flex;gap:var(--layout-grid-gutters-16);align-items:flex-start;margin-top:var(--form-field-outer-spacing)}.tedi-form-field__character-count{margin-left:auto;font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);white-space:nowrap}.tedi-form-field__character-count--error{color:var(--form-general-feedback-error-text)}.tedi-form-field__extra{margin-top:var(--form-field-outer-spacing)}.tedi-form-field__extra:empty{display:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: SeparatorComponent, selector: "tedi-separator", inputs: ["axis", "color", "variant", "dotSize", "dotFilled", "thickness", "spacing", "size"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: FormFieldComponent, decorators: [{
             type: Component,
@@ -12102,7 +12237,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         },
                     ], host: {
                         "[class]": "hostClasses()",
-                    }, template: "<ng-content select=\"label[tedi-label], tedi-label-row\"></ng-content>\n\n<ng-template #controlSlot>\n  <ng-content></ng-content>\n</ng-template>\n\n@if (hasBox()) {\n  <div [ngClass]=\"boxClasses()\" (mousedown)=\"handleBoxMouseDown($event)\">\n    <ng-container [ngTemplateOutlet]=\"controlSlot\"></ng-container>\n\n    @if (renderClearButton()) {\n      <div\n        class=\"tedi-form-field__buttons\"\n        [class.tedi-form-field__buttons--hidden]=\"!showClearButton()\"\n        [attr.aria-hidden]=\"!showClearButton() || null\"\n      >\n        <button\n          class=\"tedi-form-field__clear\"\n          tedi-closing-button\n          type=\"button\"\n          size=\"small\"\n          [ariaLabel]=\"'clear' | tediTranslate\"\n          [iconSize]=\"18\"\n          [tabIndex]=\"showClearButton() ? 0 : -1\"\n          [disabled]=\"isDisabled() || !showClearButton()\"\n          (click)=\"clear()\"\n        ></button>\n\n        @if (icon()) {\n          <tedi-separator axis=\"vertical\" size=\"1rem\" />\n        }\n      </div>\n    }\n\n    @if (resolvedIcon(); as icon) {\n      <div class=\"tedi-form-field__icon\">\n        <tedi-icon\n          [name]=\"icon.name\"\n          [size]=\"icon.size ?? iconSize()\"\n          [color]=\"icon.color ?? 'inherit'\"\n          [type]=\"icon.type ?? 'outlined'\"\n          [variant]=\"icon.variant ?? 'outlined'\"\n          [attr.aria-hidden]=\"true\"\n        />\n      </div>\n    }\n  </div>\n} @else {\n  <ng-container [ngTemplateOutlet]=\"controlSlot\"></ng-container>\n}\n\n@if (feedback() || characterLimit() != null) {\n  <div class=\"tedi-form-field__feedback\">\n    <ng-content select=\"tedi-feedback-text\"></ng-content>\n\n    @if (characterLimit() != null) {\n      <span\n        class=\"tedi-form-field__character-count\"\n        [class.tedi-form-field__character-count--error]=\"\n          characterCountExceeded()\n        \"\n        [id]=\"characterCountId()\"\n        aria-live=\"polite\"\n      >\n        {{ characterCount() }}/{{ characterLimit() }}\n      </span>\n    }\n  </div>\n}\n\n<div class=\"tedi-form-field__extra\">\n  <ng-content select=\"[tediFormFieldExtra]\"></ng-content>\n</div>\n", styles: [".tedi-form-field{--_icon-size: 1.125rem;display:flex;flex-direction:column}.tedi-form-field--small{--_icon-size: 1rem}.tedi-form-field--large{--_icon-size: 1.5rem}.tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);height:var(--_field-height);padding:var(--_field-padding-y) var(--_field-padding-x)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):active,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):has(input:active,textarea:active),.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):focus-within,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):has(input:focus-visible,textarea:focus-visible){--_field-ring-color: var(--_field-border-color)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:hover,textarea:hover){--_field-border-color: var(--form-input-border-hover)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:active,textarea:active){--_field-border-color: var(--form-input-border-active)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-within,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:focus-visible,textarea:focus-visible){--_field-border-color: var(--form-input-border-focus)}.tedi-form-field__box:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-form-field__box{--tedi-form-field-addon-lane: 0rem;position:relative;display:flex;gap:var(--form-field-inner-spacing);align-items:center;width:100%}.tedi-form-field__box:has(.tedi-form-field__icon){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--_icon-size) )}.tedi-form-field__box:has(.tedi-form-field__buttons){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--form-field-button-height-sm) )}.tedi-form-field__box:has(.tedi-form-field__buttons):has(.tedi-form-field__icon){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--form-field-button-height-sm) + var(--layout-grid-gutters-04) + var(--tedi-borders-01) + var(--form-field-inner-spacing) + var(--_icon-size) )}.tedi-form-field--small .tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-form-field--large .tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-lg);--_field-padding-x: var(--form-field-padding-x-lg);--_field-height: var(--form-field-height-lg)}.tedi-form-field__buttons{display:flex;gap:var(--layout-grid-gutters-04);align-items:center}.tedi-form-field__buttons--hidden,.tedi-form-field--clear-on-interaction .tedi-form-field__buttons{visibility:hidden}.tedi-form-field--clear-on-interaction .tedi-form-field__box:hover .tedi-form-field__buttons,.tedi-form-field--clear-on-interaction .tedi-form-field__box:active .tedi-form-field__buttons,.tedi-form-field--clear-on-interaction .tedi-form-field__box:focus-within .tedi-form-field__buttons{visibility:visible}.tedi-form-field__clear:disabled{cursor:not-allowed}.tedi-form-field__feedback{display:flex;gap:var(--layout-grid-gutters-16);align-items:flex-start;margin-top:var(--form-field-outer-spacing)}.tedi-form-field__character-count{margin-left:auto;font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);white-space:nowrap}.tedi-form-field__character-count--error{color:var(--form-general-feedback-error-text)}.tedi-form-field__extra{margin-top:var(--form-field-outer-spacing)}.tedi-form-field__extra:empty{display:none}\n"] }]
+                    }, template: "<ng-content select=\"label[tedi-label], tedi-label-row\"></ng-content>\n\n<ng-template #controlSlot>\n  <ng-content></ng-content>\n</ng-template>\n\n@if (hasBox()) {\n  <div\n    [ngClass]=\"boxClasses()\"\n    [style.--tedi-form-field-control-scrollbar]=\"controlScrollbarWidth()\"\n    (mousedown)=\"handleBoxMouseDown($event)\"\n  >\n    <ng-container [ngTemplateOutlet]=\"controlSlot\"></ng-container>\n\n    @if (renderClearButton()) {\n      <div\n        class=\"tedi-form-field__buttons\"\n        [class.tedi-form-field__buttons--hidden]=\"!showClearButton()\"\n        [attr.aria-hidden]=\"!showClearButton() || null\"\n      >\n        <button\n          class=\"tedi-form-field__clear\"\n          tedi-closing-button\n          type=\"button\"\n          size=\"small\"\n          [ariaLabel]=\"'clear' | tediTranslate\"\n          [iconSize]=\"18\"\n          [tabIndex]=\"showClearButton() ? 0 : -1\"\n          [disabled]=\"!showClearButton()\"\n          (click)=\"clear()\"\n        ></button>\n\n        @if (icon()) {\n          <tedi-separator axis=\"vertical\" size=\"1rem\" />\n        }\n      </div>\n    }\n\n    @if (resolvedIcon(); as icon) {\n      <div class=\"tedi-form-field__icon\">\n        <tedi-icon\n          [name]=\"icon.name\"\n          [size]=\"icon.size ?? iconSize()\"\n          [color]=\"icon.color ?? 'inherit'\"\n          [type]=\"icon.type ?? 'outlined'\"\n          [variant]=\"icon.variant ?? 'outlined'\"\n          [attr.aria-hidden]=\"true\"\n        />\n      </div>\n    }\n  </div>\n} @else {\n  <ng-container [ngTemplateOutlet]=\"controlSlot\"></ng-container>\n}\n\n@if (feedback() || characterLimit() != null) {\n  <div class=\"tedi-form-field__feedback\">\n    <ng-content select=\"tedi-feedback-text\"></ng-content>\n\n    @if (characterLimit() != null) {\n      <span\n        class=\"tedi-form-field__character-count\"\n        [class.tedi-form-field__character-count--error]=\"\n          characterCountExceeded()\n        \"\n        [id]=\"characterCountId()\"\n        aria-live=\"polite\"\n      >\n        {{ characterCount() }}/{{ characterLimit() }}\n      </span>\n    }\n  </div>\n}\n\n<div class=\"tedi-form-field__extra\">\n  <ng-content select=\"[tediFormFieldExtra]\"></ng-content>\n</div>\n", styles: [".tedi-form-field{--_icon-size: 1.125rem;display:flex;flex-direction:column}.tedi-form-field--small{--_icon-size: 1rem}.tedi-form-field--large{--_icon-size: 1.5rem}.tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);height:var(--_field-height);padding:var(--_field-padding-y) var(--_field-padding-x)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):active,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):has(input:active,textarea:active),.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):focus-within,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled):has(input:focus-visible,textarea:focus-visible){--_field-ring-color: var(--_field-border-color)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:hover,textarea:hover){--_field-border-color: var(--form-input-border-hover)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:active,textarea:active){--_field-border-color: var(--form-input-border-active)}.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-within,.tedi-form-field__box:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:focus-visible,textarea:focus-visible){--_field-border-color: var(--form-input-border-focus)}.tedi-form-field__box:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-form-field__box{--tedi-form-field-addon-lane: 0rem;position:relative;display:flex;gap:var(--form-field-inner-spacing);align-items:center;width:100%}.tedi-form-field__box:has(.tedi-form-field__icon){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--_icon-size) )}.tedi-form-field__box:has(.tedi-form-field__buttons){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--form-field-button-height-sm) )}.tedi-form-field__box:has(.tedi-form-field__buttons):has(.tedi-form-field__icon){--tedi-form-field-addon-lane: calc( var(--form-field-inner-spacing) + var(--form-field-button-height-sm) + var(--layout-grid-gutters-04) + var(--tedi-borders-01) + var(--form-field-inner-spacing) + var(--_icon-size) )}.tedi-form-field--small .tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-form-field--large .tedi-form-field__box{--_field-padding-y: var(--form-field-padding-y-lg);--_field-padding-x: var(--form-field-padding-x-lg);--_field-height: var(--form-field-height-lg)}.tedi-form-field__buttons{display:flex;gap:var(--layout-grid-gutters-04);align-items:center}.tedi-form-field__buttons--hidden,.tedi-form-field--clear-on-interaction .tedi-form-field__buttons{visibility:hidden}.tedi-form-field--clear-on-interaction .tedi-form-field__box:hover .tedi-form-field__buttons,.tedi-form-field--clear-on-interaction .tedi-form-field__box:active .tedi-form-field__buttons,.tedi-form-field--clear-on-interaction .tedi-form-field__box:focus-within .tedi-form-field__buttons{visibility:visible}.tedi-form-field__clear:disabled{cursor:not-allowed}.tedi-form-field__feedback{display:flex;gap:var(--layout-grid-gutters-16);align-items:flex-start;margin-top:var(--form-field-outer-spacing)}.tedi-form-field__character-count{margin-left:auto;font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);white-space:nowrap}.tedi-form-field__character-count--error{color:var(--form-general-feedback-error-text)}.tedi-form-field__extra{margin-top:var(--form-field-outer-spacing)}.tedi-form-field__extra:empty{display:none}\n"] }]
         }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], showClearOnInteraction: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearOnInteraction", required: false }] }], inputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputClass", required: false }] }], characterLimit: [{ type: i0.Input, args: [{ isSignal: true, alias: "characterLimit", required: false }] }], control: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TEDI_FORM_FIELD_CONTROL), { ...{
                             descendants: true,
                         }, isSignal: true }] }], feedback: [{ type: i0.ContentChild, args: [i0.forwardRef(() => FeedbackTextComponent), { ...{
@@ -14748,7 +14883,7 @@ class TediTableComponent {
                 useFactory: (component) => component.contextValue,
                 deps: [TediTableComponent],
             },
-        ], queries: [{ propertyName: "customResultsTemplateRef", first: true, predicate: TediPaginationResultsDirective, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, isSignal: true }, { propertyName: "tableElement", first: true, predicate: ["tableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"tedi-table-toolbar\" />\n<ng-content select=\"tedi-table-columns-menu\" />\n\n<!-- Live region for screen-reader announcements during keyboard reordering -->\n@if (reorderableColumns() || reorderableRows()) {\n  <div\n    [id]=\"liveRegionId\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n    class=\"tedi-table__sr-only\"\n  ></div>\n}\n\n@if (resolvedTopSlot(); as top) {\n  <div class=\"tedi-table__pagination tedi-table__pagination--top\">\n    <tedi-pagination\n      [pageCount]=\"paginationPageCount()\"\n      [page]=\"paginationPage()\"\n      [totalItems]=\"paginationTotalItems()\"\n      [pageSize]=\"paginationPageSize()\"\n      [pageSizeOptions]=\"paginationPageSizeOptions()\"\n      [boundaryCount]=\"top.boundaryCount\"\n      [siblingCount]=\"top.siblingCount\"\n      [labels]=\"top.labels\"\n      [background]=\"top.background\"\n      [align]=\"top.align\"\n      [dividerPosition]=\"top.dividerPosition\"\n      [hideResults]=\"top.hideResults\"\n      [hidePageSize]=\"top.hidePageSize\"\n      [hidePager]=\"top.hidePager\"\n      [hideArrows]=\"top.hideArrows\"\n      [disableArrowsAtBoundary]=\"top.disableArrowsAtBoundary\"\n      [arrowVariant]=\"top.arrowVariant\"\n      [showArrowLabels]=\"top.showArrowLabels\"\n      [previousIcon]=\"top.previousIcon\"\n      [nextIcon]=\"top.nextIcon\"\n      [showModalTitle]=\"top.showModalTitle\"\n      [xs]=\"top.xs\"\n      [sm]=\"top.sm\"\n      [md]=\"top.md\"\n      [lg]=\"top.lg\"\n      [xl]=\"top.xl\"\n      [xxl]=\"top.xxl\"\n      (pageChange)=\"handlePaginationPageChange($event)\"\n      (pageSizeChange)=\"handlePaginationPageSizeChange($event)\"\n    >\n      @if (topResultsTemplate(); as tpl) {\n        <span tediPaginationResults>\n          <ng-container *ngTemplateOutlet=\"tpl\" />\n        </span>\n      }\n    </tedi-pagination>\n  </div>\n}\n\n<div\n  #scrollContainer\n  class=\"tedi-table__scroll\"\n  [class.tedi-table__scroll--shadow-start]=\"hasStartShadow()\"\n  [class.tedi-table__scroll--shadow-end]=\"hasEndShadow()\"\n  [class.tedi-table__scroll--shadow-header]=\"hasHeaderShadow()\"\n  [attr.style]=\"maxHeightStyle()\"\n  cdkScrollable\n  tabindex=\"0\"\n  role=\"group\"\n  [attr.aria-label]=\"scrollRegionLabel()\"\n  (scroll)=\"onHorizontalScroll()\"\n>\n  <table\n    #tableElement\n    class=\"tedi-table__table\"\n    [attr.id]=\"id() || null\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-labelledby]=\"ariaLabelledby() || null\"\n    [attr.aria-rowcount]=\"ariaRowCount()\"\n    [attr.aria-colcount]=\"leafColumnCount() > 0 ? leafColumnCount() : null\"\n  >\n    @if (caption(); as cap) {\n      <caption class=\"tedi-table__caption\">\n        @if (isString(cap)) {\n          {{ cap }}\n        } @else {\n          <ng-container *ngTemplateOutlet=\"$any(cap)\" />\n        }\n      </caption>\n    }\n\n    <thead class=\"tedi-table__head\">\n      @for (\n        headerGroup of headerGroups();\n        track headerGroup.id;\n        let rowIndex = $index\n      ) {\n        <tr\n          class=\"tedi-table__row\"\n          [attr.aria-rowindex]=\"ariaRowIndexingEnabled() ? rowIndex + 1 : null\"\n          [cdkDropListDisabled]=\"!reorderableColumns() || rowIndex > 0\"\n          cdkDropList\n          cdkDropListOrientation=\"horizontal\"\n          cdkDropListAutoScrollDisabled\n          (cdkDropListDropped)=\"handleColumnDrop($event)\"\n        >\n          @for (header of headerGroup.headers; track header.id) {\n            @if (shouldRenderHeader(header, rowIndex)) {\n              @let meta = getColumnMeta(header.column);\n              @let ariaSort = getHeaderAriaSort(header.column);\n              @let srHeaderLabel = getSrOnlyHeaderLabel(header.column);\n              @let rowSpan = getHeaderRowSpan(header, rowIndex);\n              @let headerAlign = meta?.headerAlign ?? meta?.align;\n              <th\n                scope=\"col\"\n                cdkDrag\n                [cdkDragDisabled]=\"\n                  !reorderableColumns() ||\n                  rowIndex > 0 ||\n                  header.column.id === SELECT_COLUMN_ID ||\n                  header.column.id === EXPAND_COLUMN_ID\n                \"\n                cdkDragLockAxis=\"x\"\n                (keydown)=\"handleHeaderKeydown($event, header)\"\n                [class]=\"\n                  'tedi-table__header-cell' +\n                  (isHeaderGroup(header)\n                    ? ' tedi-table__header-cell--group'\n                    : '') +\n                  (headerAlign\n                    ? ' tedi-table__cell--align-' + headerAlign\n                    : '') +\n                  (meta?.vAlign\n                    ? ' tedi-table__cell--valign-' + meta?.vAlign\n                    : '') +\n                  (pickedUpColumnId() === header.column.id\n                    ? ' tedi-table__header-cell--picked-up'\n                    : '') +\n                  controlCellClass(header.column.id) +\n                  stickyLeftClass(header.column.id) +\n                  stickyRightClass(header.column.id)\n                \"\n                [attr.colspan]=\"header.colSpan > 1 ? header.colSpan : null\"\n                [attr.rowspan]=\"rowSpan\"\n                [attr.aria-sort]=\"ariaSort\"\n                [style.width.px]=\"headerCellWidth(header.column)\"\n                [style.min-width.px]=\"columnMinWidth(header.column)\"\n                [style.max-width.px]=\"columnMaxWidth(header.column)\"\n                [style.left.px]=\"stickyLeft(header.column.id)\"\n                [style.right.px]=\"stickyRight(header.column.id)\"\n              >\n                @if (srHeaderLabel) {\n                  <span class=\"tedi-table__sr-only\">{{ srHeaderLabel }}</span>\n                }\n                @if (header.column.id === SELECT_COLUMN_ID) {\n                  @if (selectionMode() === \"multiple\") {\n                    <input\n                      tedi-checkbox\n                      type=\"checkbox\"\n                      [id]=\"resolvedId() + '-select-all'\"\n                      [name]=\"resolvedId() + '-select-all'\"\n                      [attr.aria-label]=\"selectAllLabel()\"\n                      [checked]=\"isAllPageRowsSelected()\"\n                      [indeterminate]=\"\n                        isSomePageRowsSelected() && !isAllPageRowsSelected()\n                      \"\n                      (change)=\"handleSelectAll($any($event.target).checked)\"\n                    />\n                  }\n                } @else if (header.column.id === EXPAND_COLUMN_ID) {\n                  <!-- empty -->\n                } @else if (header.column.id === DRAG_COLUMN_ID) {\n                  <!-- empty -->\n                } @else {\n                  <span class=\"tedi-table__header-content\">\n                    @if (\n                      reorderableColumns() &&\n                      rowIndex === 0 &&\n                      !isHeaderGroup(header)\n                    ) {\n                      <button\n                        type=\"button\"\n                        cdkDragHandle\n                        class=\"tedi-table__drag-handle\"\n                        [class.tedi-table__drag-handle--picked-up]=\"\n                          pickedUpColumnId() === header.column.id\n                        \"\n                        [id]=\"reorderHandleId(header.column.id)\"\n                        [attr.aria-label]=\"dragColumnLabel()\"\n                        [attr.aria-pressed]=\"\n                          reorderableColumns()\n                            ? pickedUpColumnId() === header.column.id\n                            : null\n                        \"\n                      >\n                        <tedi-icon\n                          name=\"drag_indicator\"\n                          [size]=\"18\"\n                          color=\"inherit\"\n                        />\n                      </button>\n                    }\n                    <ng-container\n                      *flexRender=\"\n                        header.column.columnDef.header;\n                        props: header.getContext();\n                        let content\n                      \"\n                    >\n                      @if (shouldRenderSortableHeader(header.column, content)) {\n                        <button\n                          tedi-table-header-button\n                          [icon]=\"sortIcon(header.column)\"\n                          [selected]=\"!!header.column.getIsSorted()\"\n                          (click)=\"handleSortToggle(header.column)\"\n                        >\n                          {{ content }}\n                        </button>\n                      } @else if (isString(content) || isNumber(content)) {\n                        {{ content }}\n                      } @else {\n                        {{ content }}\n                      }\n                    </ng-container>\n                    @if (shouldRenderFilterButton(header.column)) {\n                      @if (filterUsesModal()) {\n                        <button\n                          tedi-table-header-button\n                          icon=\"filter_alt\"\n                          [selected]=\"filterIsActive(header.column)\"\n                          [filled]=\"filterIsActive(header.column)\"\n                          [aria-label]=\"filterAriaLabel(header.column)\"\n                          (click)=\"openFilterModal(header.column)\"\n                        ></button>\n                      } @else {\n                        <tedi-popover\n                          #filterPopover\n                          class=\"tedi-table__filter-popover\"\n                          position=\"bottom-end\"\n                          [preventOverflow]=\"true\"\n                        >\n                          <button\n                            tedi-popover-trigger\n                            tedi-table-header-button\n                            icon=\"filter_alt\"\n                            [selected]=\"filterIsActive(header.column)\"\n                            [filled]=\"filterIsActive(header.column)\"\n                            [aria-label]=\"filterAriaLabel(header.column)\"\n                            (click)=\"handleFilterTriggerClick(header.column)\"\n                          ></button>\n                          <tedi-popover-content\n                            [maxWidth]=\"filterPopoverWidthFor(header.column)\"\n                          >\n                            <div class=\"tedi-table__filter\">\n                              <div class=\"tedi-table__filter-body\">\n                                @if (filterTemplateFor(header.column); as tpl) {\n                                  <ng-container\n                                    *ngTemplateOutlet=\"\n                                      tpl;\n                                      context: filterContextFor(\n                                        header.column,\n                                        filterPopover\n                                      )\n                                    \"\n                                  />\n                                }\n                              </div>\n                              <div class=\"tedi-table__filter-actions\">\n                                <button\n                                  tedi-button\n                                  variant=\"secondary\"\n                                  size=\"small\"\n                                  type=\"button\"\n                                  (click)=\"\n                                    handleFilterClear(\n                                      header.column,\n                                      filterPopover\n                                    )\n                                  \"\n                                >\n                                  {{ filterClearLabel() }}\n                                </button>\n                                <button\n                                  tedi-button\n                                  variant=\"primary\"\n                                  size=\"small\"\n                                  type=\"button\"\n                                  (click)=\"\n                                    handleFilterApply(\n                                      header.column,\n                                      filterPopover\n                                    )\n                                  \"\n                                >\n                                  {{ filterApplyLabel() }}\n                                </button>\n                              </div>\n                            </div>\n                          </tedi-popover-content>\n                        </tedi-popover>\n                      }\n                    }\n                  </span>\n                }\n              </th>\n            }\n          }\n        </tr>\n      }\n      @if (enableColumnFilters()) {\n        <tr\n          class=\"tedi-table__row tedi-table__row--filter\"\n          [attr.aria-rowindex]=\"\n            ariaRowIndexingEnabled() ? headerGroups().length + 1 : null\n          \"\n        >\n          @for (column of leafColumns(); track column.id) {\n            @let filterId = resolvedId() + \"-filter-\" + column.id;\n            <th class=\"tedi-table__header-cell\" scope=\"col\">\n              @if (column.getCanFilter()) {\n                <tedi-form-field size=\"small\">\n                  <input\n                    tedi-text-field\n                    type=\"text\"\n                    [id]=\"filterId\"\n                    [name]=\"filterId\"\n                    [attr.aria-label]=\"filterLabel(column)\"\n                    [placeholder]=\"filterPlaceholder()\"\n                    [value]=\"getFilterValue(column)\"\n                    (input)=\"\n                      handleColumnFilter(column, $any($event.target).value)\n                    \"\n                    (clear)=\"handleColumnFilter(column, '')\"\n                  />\n                </tedi-form-field>\n              }\n            </th>\n          }\n        </tr>\n      }\n    </thead>\n\n    <tbody\n      class=\"tedi-table__body\"\n      cdkDropList\n      [cdkDropListDisabled]=\"!reorderableRows()\"\n      (cdkDropListDropped)=\"handleRowDrop($any($event))\"\n    >\n      @if (rows().length === 0) {\n        <tr class=\"tedi-table__row\">\n          <td\n            class=\"tedi-table__cell tedi-table__cell--placeholder\"\n            [attr.colspan]=\"leafColumnCount() > 0 ? leafColumnCount() : 1\"\n          >\n            @if (placeholder(); as pl) {\n              @if (placeholderRole()) {\n                <div [attr.role]=\"placeholderRole()\">\n                  @if (isString(pl)) {\n                    {{ pl }}\n                  } @else {\n                    <ng-container *ngTemplateOutlet=\"$any(pl)\" />\n                  }\n                </div>\n              } @else {\n                @if (isString(pl)) {\n                  {{ pl }}\n                } @else {\n                  <ng-container *ngTemplateOutlet=\"$any(pl)\" />\n                }\n              }\n            } @else {\n              @if (placeholderRole()) {\n                <div [attr.role]=\"placeholderRole()\">\n                  {{ placeholderLabel() }}\n                </div>\n              } @else {\n                {{ placeholderLabel() }}\n              }\n            }\n          </td>\n        </tr>\n      } @else {\n        @for (row of rows(); track row.id) {\n          @let isActiveRow =\n            activeRowId() !== undefined && row.id === activeRowId();\n          @let ariaRowIndex = rowAriaIndexById().get(row.id) ?? null;\n          @let subRowId = resolvedId() + \"-sub-\" + row.id;\n          @let expandsOnClick = rowExpandsOnClick(row);\n          <tr\n            cdkDrag\n            [cdkDragDisabled]=\"!reorderableRows()\"\n            cdkDragLockAxis=\"y\"\n            [class]=\"\n              'tedi-table__row' +\n              (this.selectedRowHighlight() && row.getIsSelected()\n                ? ' tedi-table__row--selected'\n                : '') +\n              (isActiveRow ? ' tedi-table__row--active' : '') +\n              (interactive() || expandsOnClick\n                ? ' tedi-table__row--clickable'\n                : '') +\n              (row.depth > 0 ? ' tedi-table__row--sub-row' : '') +\n              (groupStartRowIds().has(row.id)\n                ? ' tedi-table__row--group-start'\n                : '') +\n              (pickedUpRow() === row.original\n                ? ' tedi-table__row--picked-up'\n                : '')\n            \"\n            [attr.role]=\"\n              interactive() && !rowHasNestedInteractive(row) ? 'button' : null\n            \"\n            [attr.tabindex]=\"interactive() ? 0 : null\"\n            [attr.aria-label]=\"rowAriaLabelFor(row)\"\n            [attr.aria-rowindex]=\"ariaRowIndex\"\n            [attr.aria-current]=\"isActiveRow ? 'true' : null\"\n            (click)=\"\n              (interactive() || expandsOnClick) && handleRowClick($event, row)\n            \"\n            (keydown)=\"handleRowKeydown($event, row)\"\n            (mouseenter)=\"handleRowMouseEnter(row)\"\n            (mouseleave)=\"handleRowMouseLeave()\"\n          >\n            @for (cell of row.getVisibleCells(); track cell.id) {\n              @let cellMeta = getColumnMeta(cell.column);\n              @let cellContext = cell.getContext();\n              @let resolvedSpan = resolveRowSpan(cell, cellContext);\n              @if (resolvedSpan !== 0) {\n                <td\n                  [class]=\"\n                    'tedi-table__cell' +\n                    (cellMeta?.align\n                      ? ' tedi-table__cell--align-' + cellMeta?.align\n                      : '') +\n                    (cellMeta?.vAlign\n                      ? ' tedi-table__cell--valign-' + cellMeta?.vAlign\n                      : '') +\n                    controlCellClass(cell.column.id) +\n                    stickyLeftClass(cell.column.id) +\n                    stickyRightClass(cell.column.id)\n                  \"\n                  [style.left.px]=\"stickyLeft(cell.column.id)\"\n                  [style.right.px]=\"stickyRight(cell.column.id)\"\n                  [attr.rowspan]=\"\n                    resolvedSpan !== null && resolvedSpan > 1\n                      ? resolvedSpan\n                      : null\n                  \"\n                >\n                  @if (cell.column.id === DRAG_COLUMN_ID) {\n                    <button\n                      type=\"button\"\n                      cdkDragHandle\n                      class=\"tedi-table__drag-handle\"\n                      [class.tedi-table__drag-handle--picked-up]=\"\n                        pickedUpRow() === row.original\n                      \"\n                      [id]=\"rowReorderHandleId(row.id)\"\n                      [attr.aria-label]=\"dragRowLabel()\"\n                      [attr.aria-pressed]=\"\n                        reorderableRows()\n                          ? pickedUpRow() === row.original\n                          : null\n                      \"\n                      (click)=\"$event.stopPropagation()\"\n                      (keydown)=\"handleRowReorderKeydown($event, row)\"\n                    >\n                      <tedi-icon\n                        name=\"drag_indicator\"\n                        [size]=\"18\"\n                        color=\"inherit\"\n                      />\n                    </button>\n                  } @else if (cell.column.id === SELECT_COLUMN_ID) {\n                    @if (selectionMode() === \"multiple\") {\n                      <input\n                        tedi-checkbox\n                        type=\"checkbox\"\n                        [id]=\"resolvedId() + '-select-' + row.id\"\n                        [name]=\"resolvedId() + '-select-' + row.id\"\n                        [attr.aria-label]=\"selectRowLabel(row)\"\n                        [checked]=\"isRowSelected(row)\"\n                        [disabled]=\"!row.getCanSelect()\"\n                        [indeterminate]=\"isRowIndeterminate(row)\"\n                        (change)=\"\n                          handleSelectRow(row, $any($event.target).checked)\n                        \"\n                        (click)=\"$event.stopPropagation()\"\n                      />\n                    } @else {\n                      <input\n                        tedi-radio\n                        type=\"radio\"\n                        [id]=\"resolvedId() + '-select-' + row.id\"\n                        [name]=\"resolvedId() + '-select-row'\"\n                        [attr.aria-label]=\"selectRowLabel(row)\"\n                        [checked]=\"row.getIsSelected()\"\n                        [disabled]=\"!row.getCanSelect()\"\n                        (change)=\"\n                          handleSelectRow(row, $any($event.target).checked)\n                        \"\n                        (click)=\"$event.stopPropagation()\"\n                      />\n                    }\n                  } @else if (cell.column.id === EXPAND_COLUMN_ID) {\n                    <span\n                      class=\"tedi-table__expand-toggle\"\n                      [class.tedi-table__expand-toggle--icon-only]=\"\n                        !expandButtonHasLabel()\n                      \"\n                    >\n                      @if (row.getCanExpand()) {\n                        @let expandOpen = row.getIsExpanded();\n                        <button\n                          tedi-collapse-button\n                          [arrowType]=\"resolvedExpandVariant()\"\n                          [hideText]=\"!expandButtonHasLabel()\"\n                          [openText]=\"expandButtonOpenText()\"\n                          [closeText]=\"expandButtonCloseText()\"\n                          [open]=\"expandOpen\"\n                          [id]=\"resolvedId() + '-expand-' + row.id\"\n                          [ariaControls]=\"\n                            renderSubComponent() ? subRowId : undefined\n                          \"\n                          [ariaLabel]=\"\n                            expandButtonHasLabel()\n                              ? undefined\n                              : expandRowLabel(expandOpen)\n                          \"\n                          (openChange)=\"handleExpandToggle(row)\"\n                          (click)=\"$event.stopPropagation()\"\n                          (keydown)=\"handleExpandKeydown($event)\"\n                        ></button>\n                      }\n                    </span>\n                  } @else {\n                    <ng-container\n                      *flexRender=\"\n                        cell.column.columnDef.cell;\n                        props: cellContext;\n                        let content\n                      \"\n                    >\n                      {{ content }}\n                    </ng-container>\n                  }\n                </td>\n              }\n            }\n          </tr>\n          @if (renderSubComponent(); as subTpl) {\n            @if (row.getCanExpand()) {\n              @let isExpanded = row.getIsExpanded();\n              <tr\n                [class]=\"\n                  'tedi-table__row tedi-table__row--sub-component' +\n                  (isExpanded ? ' tedi-table__row--sub-component-open' : '')\n                \"\n              >\n                <td\n                  class=\"tedi-table__cell tedi-table__cell--sub-component\"\n                  [attr.id]=\"subRowId\"\n                  [attr.role]=\"isExpanded ? 'region' : null\"\n                  [attr.aria-label]=\"isExpanded ? rowDetailsLabel() : null\"\n                  [attr.inert]=\"isExpanded ? null : ''\"\n                  [attr.colspan]=\"leafColumnCount() > 0 ? leafColumnCount() : 1\"\n                >\n                  <div class=\"tedi-table__sub-component-wrapper\">\n                    <div class=\"tedi-table__sub-component-content\">\n                      <div class=\"tedi-table__sub-component-inner\">\n                        <ng-container\n                          *ngTemplateOutlet=\"\n                            subTpl;\n                            context: { $implicit: row }\n                          \"\n                        />\n                      </div>\n                    </div>\n                  </div>\n                </td>\n              </tr>\n            }\n          }\n        }\n      }\n    </tbody>\n\n    @if (hasFooter()) {\n      <tfoot class=\"tedi-table__foot\">\n        @for (group of footerGroups(); track group.id) {\n          <tr class=\"tedi-table__row\">\n            @for (header of group.headers; track header.id) {\n              @let footerMeta = getColumnMeta(header.column);\n              <td\n                [class]=\"\n                  'tedi-table__cell tedi-table__cell--footer' +\n                  (footerMeta?.align\n                    ? ' tedi-table__cell--align-' + footerMeta?.align\n                    : '') +\n                  (footerMeta?.vAlign\n                    ? ' tedi-table__cell--valign-' + footerMeta?.vAlign\n                    : '')\n                \"\n                [attr.colspan]=\"header.colSpan > 1 ? header.colSpan : null\"\n              >\n                @if (!header.isPlaceholder) {\n                  <ng-container\n                    *flexRender=\"\n                      header.column.columnDef.footer;\n                      props: header.getContext();\n                      let content\n                    \"\n                  >\n                    {{ content }}\n                  </ng-container>\n                }\n              </td>\n            }\n          </tr>\n        }\n      </tfoot>\n    }\n  </table>\n</div>\n\n@if (resolvedBottomSlot(); as bottom) {\n  <div class=\"tedi-table__pagination tedi-table__pagination--bottom\">\n    <tedi-pagination\n      [pageCount]=\"paginationPageCount()\"\n      [page]=\"paginationPage()\"\n      [totalItems]=\"paginationTotalItems()\"\n      [pageSize]=\"paginationPageSize()\"\n      [pageSizeOptions]=\"paginationPageSizeOptions()\"\n      [boundaryCount]=\"bottom.boundaryCount\"\n      [siblingCount]=\"bottom.siblingCount\"\n      [labels]=\"bottom.labels\"\n      [background]=\"bottom.background\"\n      [align]=\"bottom.align\"\n      [dividerPosition]=\"bottom.dividerPosition\"\n      [hideResults]=\"bottom.hideResults\"\n      [hidePageSize]=\"bottom.hidePageSize\"\n      [hidePager]=\"bottom.hidePager\"\n      [hideArrows]=\"bottom.hideArrows\"\n      [disableArrowsAtBoundary]=\"bottom.disableArrowsAtBoundary\"\n      [arrowVariant]=\"bottom.arrowVariant\"\n      [showArrowLabels]=\"bottom.showArrowLabels\"\n      [previousIcon]=\"bottom.previousIcon\"\n      [nextIcon]=\"bottom.nextIcon\"\n      [showModalTitle]=\"bottom.showModalTitle\"\n      [xs]=\"bottom.xs\"\n      [sm]=\"bottom.sm\"\n      [md]=\"bottom.md\"\n      [lg]=\"bottom.lg\"\n      [xl]=\"bottom.xl\"\n      [xxl]=\"bottom.xxl\"\n      (pageChange)=\"handlePaginationPageChange($event)\"\n      (pageSizeChange)=\"handlePaginationPageSizeChange($event)\"\n    >\n      @if (bottomResultsTemplate(); as tpl) {\n        <span tediPaginationResults>\n          <ng-container *ngTemplateOutlet=\"tpl\" />\n        </span>\n      }\n    </tedi-pagination>\n  </div>\n}\n", styles: [".tedi-table{display:flex;flex-direction:column;gap:var(--tedi-dimensions-10);width:100%}.tedi-table__scroll{overflow-x:auto;background:var(--table-default);border:var(--tedi-borders-01) solid var(--table-border);border-radius:var(--table-radius)}.tedi-table__table{width:100%;font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--general-text-primary);border-spacing:0;border-collapse:collapse;background:var(--table-default)}.tedi-table__caption{padding:var(--tedi-dimensions-10) var(--table-header-padding-x);font-weight:var(--body-regular-weight);color:var(--general-text-primary);text-align:left;caption-side:top}.tedi-table__head{background:var(--table-default)}.tedi-table__header-cell{padding:var(--table-header-padding-y) var(--table-header-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);color:var(--general-text-tertiary);text-align:left;white-space:nowrap;background:var(--table-default);border-bottom:1px solid var(--table-border-th)}.tedi-table__header-content{display:inline-flex;gap:var(--layout-grid-gutters-04);align-items:center}.tedi-table__filter-popover{display:inline-flex;align-items:center}.tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__body .tedi-table__row:last-child>.tedi-table__cell{border-bottom:0}.tedi-table--group-dividers-between .tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:0}.tedi-table--group-dividers-between .tedi-table__body .tedi-table__row--group-start>.tedi-table__cell{border-top:var(--tedi-borders-01) solid var(--table-border)}.tedi-table--group-dividers-none .tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:0}.tedi-table__cell{padding:var(--table-data-padding-y) var(--table-data-padding-x);vertical-align:middle;color:var(--general-text-primary);background:var(--table-default)}.tedi-table__cell--control{padding-right:var(--table-data-padding-x-sm);padding-left:var(--table-data-padding-x-sm)}.tedi-table__cell--control-fit{width:1%;white-space:nowrap}.tedi-table__cell--align-left{text-align:left}.tedi-table__cell--align-center{text-align:center}.tedi-table__cell--align-right{text-align:right}.tedi-table__cell--valign-top{vertical-align:top}.tedi-table__cell--valign-middle{vertical-align:middle}.tedi-table__cell--valign-bottom{vertical-align:bottom}.tedi-table__expand-toggle{display:flex;align-items:center}.tedi-table__expand-toggle--icon-only{min-height:var(--button-sm-icon-size)}.tedi-table__cell--placeholder{padding:var(--tedi-dimensions-14) var(--table-data-padding-x);color:var(--general-text-secondary);text-align:center}.tedi-table--small .tedi-table__header-cell{padding:var(--table-header-padding-y-sm) var(--table-header-padding-x-sm)}.tedi-table--small .tedi-table__cell{padding:var(--table-data-padding-y-sm) var(--table-data-padding-x-sm)}.tedi-table__foot{font-weight:var(--heading-weight);background:var(--table-default)}.tedi-table__cell--footer{color:var(--general-text-primary);border-top:var(--tedi-borders-01) solid var(--table-border-th)}.tedi-table__row--selected>.tedi-table__cell{background:var(--table-active)}.tedi-table__row--clickable{cursor:pointer}.tedi-table__row--clickable:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(var(--tedi-borders-02) * -1);background:transparent;border-color:transparent}.tedi-table__body .tedi-table__row--sub-component>.tedi-table__cell{background:var(--table-striped);border-bottom:0}.tedi-table__body .tedi-table__row--sub-component-open>.tedi-table__cell{border-bottom:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__row--sub-row>.tedi-table__cell{background:var(--table-striped)}.tedi-table__cell--sub-component{padding:0}.tedi-table__sub-component-wrapper{display:grid;grid-template-rows:0fr}.tedi-table__row--sub-component-open .tedi-table__sub-component-wrapper{grid-template-rows:1fr}.tedi-table__sub-component-content{min-height:0;overflow:hidden}.tedi-table__sub-component-inner{padding:var(--table-data-padding-y) var(--table-data-padding-x)}.tedi-table__row--filter{background:var(--general-surface-primary)}.tedi-table__row--filter .tedi-table__header-cell{padding-top:var(--tedi-dimensions-05);padding-bottom:var(--tedi-dimensions-05);font-weight:var(--body-regular-weight);background:var(--general-surface-primary)}.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell{background:var(--table-striped)}.tedi-table.tedi-table--row-hover .tedi-table__body .tedi-table__row:hover>.tedi-table__cell{background:var(--table-hover)}.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--active>.tedi-table__cell,.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--active:hover>.tedi-table__cell{background:var(--table-hover)}.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--picked-up>.tedi-table__cell{background:var(--table-hover)}.tedi-table--vertical-borders .tedi-table__header-cell,.tedi-table--vertical-borders .tedi-table__cell{border-right:var(--tedi-borders-01) solid var(--table-border)}.tedi-table--vertical-borders thead tr:first-child .tedi-table__header-cell:last-child,.tedi-table--vertical-borders .tedi-table__row>.tedi-table__cell:last-child{border-right:0}.tedi-table--borderless .tedi-table__scroll{background:transparent;border:0;border-radius:0}.tedi-table--has-pagination{gap:0}.tedi-table--has-pagination-bottom .tedi-table__scroll{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.tedi-table--has-pagination-top .tedi-table__scroll{border-top:0;border-top-left-radius:0;border-top-right-radius:0}.tedi-table__pagination{overflow:hidden;border:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__pagination--bottom{border-top:0;border-bottom-right-radius:var(--table-radius);border-bottom-left-radius:var(--table-radius)}.tedi-table__pagination--top{border-bottom:0;border-top-left-radius:var(--table-radius);border-top-right-radius:var(--table-radius)}.tedi-table--borderless .tedi-table__pagination{background:transparent;border:0}.tedi-table--sticky-first-column .tedi-table__header-cell.tedi-table__cell--sticky-left{position:sticky;z-index:2;background:var(--table-default)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left{position:sticky;z-index:1;background:var(--table-default)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left-edge:after{position:absolute;top:0;bottom:0;left:100%;width:var(--tedi-dimensions-03);pointer-events:none;content:\"\"}.tedi-table--sticky-first-column .tedi-table__scroll--shadow-start .tedi-table__cell--sticky-left-edge:after{background:linear-gradient(to right,var(--tedi-alpha-10),transparent)}.tedi-table--sticky-first-column .tedi-table__body .tedi-table__row--sub-row>.tedi-table__cell--sticky-left{background:var(--table-striped)}.tedi-table--sticky-first-column.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell--sticky-left{background:var(--table-striped)}.tedi-table--sticky-first-column .tedi-table__body .tedi-table__row--picked-up>.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column.tedi-table--striped .tedi-table__body .tedi-table__row--picked-up:nth-of-type(2n)>.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell--picked-up.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left{box-shadow:inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-start{box-shadow:inset var(--tedi-borders-02) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-start.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset var(--tedi-borders-02) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__header-cell.tedi-table__cell--sticky-right{position:sticky;z-index:2;background:var(--table-default)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right{position:sticky;z-index:1;background:var(--table-default)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right-edge:after{position:absolute;top:0;right:100%;bottom:0;width:var(--tedi-dimensions-03);pointer-events:none;content:\"\"}.tedi-table--sticky-last-column .tedi-table__scroll--shadow-end .tedi-table__cell--sticky-right-edge:after{background:linear-gradient(to left,var(--tedi-alpha-10),transparent)}.tedi-table--sticky-last-column .tedi-table__body .tedi-table__row--sub-row>.tedi-table__cell--sticky-right{background:var(--table-striped)}.tedi-table--sticky-last-column.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell--sticky-right{background:var(--table-striped)}.tedi-table--sticky-last-column .tedi-table__body .tedi-table__row--picked-up>.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column.tedi-table--striped .tedi-table__body .tedi-table__row--picked-up:nth-of-type(2n)>.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell--picked-up.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right{box-shadow:inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-start{box-shadow:inset calc(var(--tedi-borders-02) * -1) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-start.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset calc(var(--tedi-borders-02) * -1) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-header .tedi-table__head{border-bottom:0}.tedi-table--sticky-header .tedi-table__head .tedi-table__row{position:sticky;top:0;z-index:2;background:var(--table-default)}.tedi-table--sticky-header .tedi-table__head .tedi-table__header-cell{position:sticky;top:0;z-index:2;background:var(--table-default);border-bottom:0;box-shadow:inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-left{z-index:3}.tedi-table--sticky-header.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-right{z-index:3}.tedi-table--sticky-header.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header .tedi-table__scroll--shadow-header .tedi-table__head .tedi-table__row:after{position:absolute;top:100%;right:0;left:0;height:var(--tedi-dimensions-03);pointer-events:none;content:\"\";background:linear-gradient(to bottom,var(--tedi-alpha-10),transparent)}.tedi-table--fixed-layout .tedi-table__table{table-layout:fixed}.tedi-table__drag-handle{display:inline-flex;align-items:center;justify-content:center;padding:2px;color:var(--general-text-tertiary);cursor:grab;background:transparent;border:0;border-radius:var(--button-radius-sm)}.tedi-table__drag-handle:hover{color:var(--general-text-primary);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-table__drag-handle:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:0}.tedi-table__drag-handle.cdk-drag-disabled{color:var(--general-text-disabled);cursor:not-allowed}.tedi-table__drag-handle--picked-up{color:var(--tedi-primary-500);cursor:grabbing}.cdk-drag-preview .tedi-table__drag-handle,.cdk-drop-list-dragging .tedi-table__drag-handle{cursor:grabbing}.cdk-drag-preview.tedi-table__row,.cdk-drag-preview.tedi-table__header-cell{display:table;cursor:grabbing;background:var(--table-hover);border:var(--tedi-borders-01) solid var(--card-border-primary);border-radius:var(--table-radius);box-shadow:0 6px 16px var(--tedi-alpha-20)}.cdk-drag-preview.tedi-table__row>.tedi-table__cell{background:var(--table-hover)}.cdk-drag-placeholder.tedi-table__row,.cdk-drag-placeholder.tedi-table__header-cell{opacity:.3}.cdk-drop-list-dragging .tedi-table__row:not(.cdk-drag-placeholder),.cdk-drop-list-dragging .tedi-table__header-cell:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.tedi-table__filter{display:flex;flex-direction:column;gap:var(--tedi-dimensions-12);width:100%}.tedi-table__filter-actions{display:flex;gap:var(--button-gutter-x-sm)}.tedi-table__filter-actions>*{flex:1 1 0;justify-content:center}.tedi-table .tedi-table__head .tedi-table__header-cell--picked-up{cursor:grabbing;background:var(--table-hover)}.tedi-table__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: FlexRenderDirective, selector: "[flexRender]", inputs: ["flexRender", "flexRenderProps", "flexRenderInjector"] }, { kind: "component", type: PaginationComponent, selector: "tedi-pagination", inputs: ["pageCount", "page", "totalItems", "pageSize", "pageSizeOptions", "boundaryCount", "siblingCount", "labels", "background", "dividerPosition", "align", "hideResults", "hidePageSize", "hidePager", "hideArrows", "disableArrowsAtBoundary", "arrowVariant", "showArrowLabels", "previousIcon", "nextIcon", "showModalTitle", "xs", "sm", "md", "lg", "xl", "xxl"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "directive", type: TediPaginationResultsDirective, selector: "[tediPaginationResults]" }, { kind: "component", type: TediTableHeaderButtonComponent, selector: "button[tedi-table-header-button]", inputs: ["icon", "filled", "selected", "disabled", "iconSize", "aria-label"] }, { kind: "component", type: CheckboxComponent, selector: "input[type=checkbox][tedi-checkbox]", inputs: ["size", "invalid", "value", "disabled"] }, { kind: "component", type: RadioComponent, selector: "input[type=radio][tedi-radio]", inputs: ["size", "invalid", "value", "disabled"] }, { kind: "component", type: TextFieldComponent, selector: "input[tedi-text-field]", inputs: ["value", "size", "invalid", "arrowsHidden", "disabled", "readonly", "readOnly"], outputs: ["valueChange", "clear"] }, { kind: "component", type: FormFieldComponent, selector: "tedi-form-field", inputs: ["size", "icon", "clearable", "showClearOnInteraction", "inputClass", "characterLimit"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: CollapseButtonComponent, selector: "button[tedi-collapse-button]", inputs: ["open", "openText", "closeText", "hideText", "arrowType", "size", "inverted", "underline", "ariaControls", "ariaLabel", "id"], outputs: ["openChange"] }, { kind: "component", type: PopoverComponent, selector: "tedi-popover", inputs: ["position", "preventOverflow", "dismissible", "hideOnScroll", "withBorder", "withArrow", "lockScroll", "timeoutDelay", "offset"] }, { kind: "component", type: PopoverContentComponent, selector: "tedi-popover-content", inputs: ["maxWidth", "title", "showClose"] }, { kind: "directive", type: PopoverTriggerDirective, selector: "[tedi-popover-trigger]", inputs: ["underline", "interactive"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], queries: [{ propertyName: "customResultsTemplateRef", first: true, predicate: TediPaginationResultsDirective, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, isSignal: true }, { propertyName: "tableElement", first: true, predicate: ["tableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"tedi-table-toolbar\" />\n<ng-content select=\"tedi-table-columns-menu\" />\n\n<!-- Live region for screen-reader announcements during keyboard reordering -->\n@if (reorderableColumns() || reorderableRows()) {\n  <div\n    [id]=\"liveRegionId\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n    class=\"sr-only\"\n  ></div>\n}\n\n@if (resolvedTopSlot(); as top) {\n  <div class=\"tedi-table__pagination tedi-table__pagination--top\">\n    <tedi-pagination\n      [pageCount]=\"paginationPageCount()\"\n      [page]=\"paginationPage()\"\n      [totalItems]=\"paginationTotalItems()\"\n      [pageSize]=\"paginationPageSize()\"\n      [pageSizeOptions]=\"paginationPageSizeOptions()\"\n      [boundaryCount]=\"top.boundaryCount\"\n      [siblingCount]=\"top.siblingCount\"\n      [labels]=\"top.labels\"\n      [background]=\"top.background\"\n      [align]=\"top.align\"\n      [dividerPosition]=\"top.dividerPosition\"\n      [hideResults]=\"top.hideResults\"\n      [hidePageSize]=\"top.hidePageSize\"\n      [hidePager]=\"top.hidePager\"\n      [hideArrows]=\"top.hideArrows\"\n      [disableArrowsAtBoundary]=\"top.disableArrowsAtBoundary\"\n      [arrowVariant]=\"top.arrowVariant\"\n      [showArrowLabels]=\"top.showArrowLabels\"\n      [previousIcon]=\"top.previousIcon\"\n      [nextIcon]=\"top.nextIcon\"\n      [showModalTitle]=\"top.showModalTitle\"\n      [xs]=\"top.xs\"\n      [sm]=\"top.sm\"\n      [md]=\"top.md\"\n      [lg]=\"top.lg\"\n      [xl]=\"top.xl\"\n      [xxl]=\"top.xxl\"\n      (pageChange)=\"handlePaginationPageChange($event)\"\n      (pageSizeChange)=\"handlePaginationPageSizeChange($event)\"\n    >\n      @if (topResultsTemplate(); as tpl) {\n        <span tediPaginationResults>\n          <ng-container *ngTemplateOutlet=\"tpl\" />\n        </span>\n      }\n    </tedi-pagination>\n  </div>\n}\n\n<div\n  #scrollContainer\n  class=\"tedi-table__scroll\"\n  [class.tedi-table__scroll--shadow-start]=\"hasStartShadow()\"\n  [class.tedi-table__scroll--shadow-end]=\"hasEndShadow()\"\n  [class.tedi-table__scroll--shadow-header]=\"hasHeaderShadow()\"\n  [attr.style]=\"maxHeightStyle()\"\n  cdkScrollable\n  tabindex=\"0\"\n  role=\"group\"\n  [attr.aria-label]=\"scrollRegionLabel()\"\n  (scroll)=\"onHorizontalScroll()\"\n>\n  <table\n    #tableElement\n    class=\"tedi-table__table\"\n    [attr.id]=\"id() || null\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-labelledby]=\"ariaLabelledby() || null\"\n    [attr.aria-rowcount]=\"ariaRowCount()\"\n    [attr.aria-colcount]=\"leafColumnCount() > 0 ? leafColumnCount() : null\"\n  >\n    @if (caption(); as cap) {\n      <caption class=\"tedi-table__caption\">\n        @if (isString(cap)) {\n          {{ cap }}\n        } @else {\n          <ng-container *ngTemplateOutlet=\"$any(cap)\" />\n        }\n      </caption>\n    }\n\n    <thead class=\"tedi-table__head\">\n      @for (\n        headerGroup of headerGroups();\n        track headerGroup.id;\n        let rowIndex = $index\n      ) {\n        <tr\n          class=\"tedi-table__row\"\n          [attr.aria-rowindex]=\"ariaRowIndexingEnabled() ? rowIndex + 1 : null\"\n          [cdkDropListDisabled]=\"!reorderableColumns() || rowIndex > 0\"\n          cdkDropList\n          cdkDropListOrientation=\"horizontal\"\n          cdkDropListAutoScrollDisabled\n          (cdkDropListDropped)=\"handleColumnDrop($event)\"\n        >\n          @for (header of headerGroup.headers; track header.id) {\n            @if (shouldRenderHeader(header, rowIndex)) {\n              @let meta = getColumnMeta(header.column);\n              @let ariaSort = getHeaderAriaSort(header.column);\n              @let srHeaderLabel = getSrOnlyHeaderLabel(header.column);\n              @let rowSpan = getHeaderRowSpan(header, rowIndex);\n              @let headerAlign = meta?.headerAlign ?? meta?.align;\n              <th\n                scope=\"col\"\n                cdkDrag\n                [cdkDragDisabled]=\"\n                  !reorderableColumns() ||\n                  rowIndex > 0 ||\n                  header.column.id === SELECT_COLUMN_ID ||\n                  header.column.id === EXPAND_COLUMN_ID\n                \"\n                cdkDragLockAxis=\"x\"\n                (keydown)=\"handleHeaderKeydown($event, header)\"\n                [class]=\"\n                  'tedi-table__header-cell' +\n                  (isHeaderGroup(header)\n                    ? ' tedi-table__header-cell--group'\n                    : '') +\n                  (headerAlign\n                    ? ' tedi-table__cell--align-' + headerAlign\n                    : '') +\n                  (meta?.vAlign\n                    ? ' tedi-table__cell--valign-' + meta?.vAlign\n                    : '') +\n                  (pickedUpColumnId() === header.column.id\n                    ? ' tedi-table__header-cell--picked-up'\n                    : '') +\n                  controlCellClass(header.column.id) +\n                  stickyLeftClass(header.column.id) +\n                  stickyRightClass(header.column.id)\n                \"\n                [attr.colspan]=\"header.colSpan > 1 ? header.colSpan : null\"\n                [attr.rowspan]=\"rowSpan\"\n                [attr.aria-sort]=\"ariaSort\"\n                [style.width.px]=\"headerCellWidth(header.column)\"\n                [style.min-width.px]=\"columnMinWidth(header.column)\"\n                [style.max-width.px]=\"columnMaxWidth(header.column)\"\n                [style.left.px]=\"stickyLeft(header.column.id)\"\n                [style.right.px]=\"stickyRight(header.column.id)\"\n              >\n                @if (srHeaderLabel) {\n                  <span class=\"sr-only\">{{ srHeaderLabel }}</span>\n                }\n                @if (header.column.id === SELECT_COLUMN_ID) {\n                  @if (selectionMode() === \"multiple\") {\n                    <input\n                      tedi-checkbox\n                      type=\"checkbox\"\n                      [id]=\"resolvedId() + '-select-all'\"\n                      [name]=\"resolvedId() + '-select-all'\"\n                      [attr.aria-label]=\"selectAllLabel()\"\n                      [checked]=\"isAllPageRowsSelected()\"\n                      [indeterminate]=\"\n                        isSomePageRowsSelected() && !isAllPageRowsSelected()\n                      \"\n                      (change)=\"handleSelectAll($any($event.target).checked)\"\n                    />\n                  }\n                } @else if (header.column.id === EXPAND_COLUMN_ID) {\n                  <!-- empty -->\n                } @else if (header.column.id === DRAG_COLUMN_ID) {\n                  <!-- empty -->\n                } @else {\n                  <span class=\"tedi-table__header-content\">\n                    @if (\n                      reorderableColumns() &&\n                      rowIndex === 0 &&\n                      !isHeaderGroup(header)\n                    ) {\n                      <button\n                        type=\"button\"\n                        cdkDragHandle\n                        class=\"tedi-table__drag-handle\"\n                        [class.tedi-table__drag-handle--picked-up]=\"\n                          pickedUpColumnId() === header.column.id\n                        \"\n                        [id]=\"reorderHandleId(header.column.id)\"\n                        [attr.aria-label]=\"dragColumnLabel()\"\n                        [attr.aria-pressed]=\"\n                          reorderableColumns()\n                            ? pickedUpColumnId() === header.column.id\n                            : null\n                        \"\n                      >\n                        <tedi-icon\n                          name=\"drag_indicator\"\n                          [size]=\"18\"\n                          color=\"inherit\"\n                        />\n                      </button>\n                    }\n                    <ng-container\n                      *flexRender=\"\n                        header.column.columnDef.header;\n                        props: header.getContext();\n                        let content\n                      \"\n                    >\n                      @if (shouldRenderSortableHeader(header.column, content)) {\n                        <button\n                          tedi-table-header-button\n                          [icon]=\"sortIcon(header.column)\"\n                          [selected]=\"!!header.column.getIsSorted()\"\n                          (click)=\"handleSortToggle(header.column)\"\n                        >\n                          {{ content }}\n                        </button>\n                      } @else if (isString(content) || isNumber(content)) {\n                        {{ content }}\n                      } @else {\n                        {{ content }}\n                      }\n                    </ng-container>\n                    @if (shouldRenderFilterButton(header.column)) {\n                      @if (filterUsesModal()) {\n                        <button\n                          tedi-table-header-button\n                          icon=\"filter_alt\"\n                          [selected]=\"filterIsActive(header.column)\"\n                          [filled]=\"filterIsActive(header.column)\"\n                          [aria-label]=\"filterAriaLabel(header.column)\"\n                          (click)=\"openFilterModal(header.column)\"\n                        ></button>\n                      } @else {\n                        <tedi-popover\n                          #filterPopover\n                          class=\"tedi-table__filter-popover\"\n                          position=\"bottom-end\"\n                          [preventOverflow]=\"true\"\n                        >\n                          <button\n                            tedi-popover-trigger\n                            tedi-table-header-button\n                            icon=\"filter_alt\"\n                            [selected]=\"filterIsActive(header.column)\"\n                            [filled]=\"filterIsActive(header.column)\"\n                            [aria-label]=\"filterAriaLabel(header.column)\"\n                            (click)=\"handleFilterTriggerClick(header.column)\"\n                          ></button>\n                          <tedi-popover-content\n                            [maxWidth]=\"filterPopoverWidthFor(header.column)\"\n                          >\n                            <div class=\"tedi-table__filter\">\n                              <div class=\"tedi-table__filter-body\">\n                                @if (filterTemplateFor(header.column); as tpl) {\n                                  <ng-container\n                                    *ngTemplateOutlet=\"\n                                      tpl;\n                                      context: filterContextFor(\n                                        header.column,\n                                        filterPopover\n                                      )\n                                    \"\n                                  />\n                                }\n                              </div>\n                              <div class=\"tedi-table__filter-actions\">\n                                <button\n                                  tedi-button\n                                  variant=\"secondary\"\n                                  size=\"small\"\n                                  type=\"button\"\n                                  (click)=\"\n                                    handleFilterClear(\n                                      header.column,\n                                      filterPopover\n                                    )\n                                  \"\n                                >\n                                  {{ filterClearLabel() }}\n                                </button>\n                                <button\n                                  tedi-button\n                                  variant=\"primary\"\n                                  size=\"small\"\n                                  type=\"button\"\n                                  (click)=\"\n                                    handleFilterApply(\n                                      header.column,\n                                      filterPopover\n                                    )\n                                  \"\n                                >\n                                  {{ filterApplyLabel() }}\n                                </button>\n                              </div>\n                            </div>\n                          </tedi-popover-content>\n                        </tedi-popover>\n                      }\n                    }\n                  </span>\n                }\n              </th>\n            }\n          }\n        </tr>\n      }\n      @if (enableColumnFilters()) {\n        <tr\n          class=\"tedi-table__row tedi-table__row--filter\"\n          [attr.aria-rowindex]=\"\n            ariaRowIndexingEnabled() ? headerGroups().length + 1 : null\n          \"\n        >\n          @for (column of leafColumns(); track column.id) {\n            @let filterId = resolvedId() + \"-filter-\" + column.id;\n            <th class=\"tedi-table__header-cell\" scope=\"col\">\n              @if (column.getCanFilter()) {\n                <tedi-form-field size=\"small\">\n                  <input\n                    tedi-text-field\n                    type=\"text\"\n                    [id]=\"filterId\"\n                    [name]=\"filterId\"\n                    [attr.aria-label]=\"filterLabel(column)\"\n                    [placeholder]=\"filterPlaceholder()\"\n                    [value]=\"getFilterValue(column)\"\n                    (input)=\"\n                      handleColumnFilter(column, $any($event.target).value)\n                    \"\n                    (clear)=\"handleColumnFilter(column, '')\"\n                  />\n                </tedi-form-field>\n              }\n            </th>\n          }\n        </tr>\n      }\n    </thead>\n\n    <tbody\n      class=\"tedi-table__body\"\n      cdkDropList\n      [cdkDropListDisabled]=\"!reorderableRows()\"\n      (cdkDropListDropped)=\"handleRowDrop($any($event))\"\n    >\n      @if (rows().length === 0) {\n        <tr class=\"tedi-table__row\">\n          <td\n            class=\"tedi-table__cell tedi-table__cell--placeholder\"\n            [attr.colspan]=\"leafColumnCount() > 0 ? leafColumnCount() : 1\"\n          >\n            @if (placeholder(); as pl) {\n              @if (placeholderRole()) {\n                <div [attr.role]=\"placeholderRole()\">\n                  @if (isString(pl)) {\n                    {{ pl }}\n                  } @else {\n                    <ng-container *ngTemplateOutlet=\"$any(pl)\" />\n                  }\n                </div>\n              } @else {\n                @if (isString(pl)) {\n                  {{ pl }}\n                } @else {\n                  <ng-container *ngTemplateOutlet=\"$any(pl)\" />\n                }\n              }\n            } @else {\n              @if (placeholderRole()) {\n                <div [attr.role]=\"placeholderRole()\">\n                  {{ placeholderLabel() }}\n                </div>\n              } @else {\n                {{ placeholderLabel() }}\n              }\n            }\n          </td>\n        </tr>\n      } @else {\n        @for (row of rows(); track row.id) {\n          @let isActiveRow =\n            activeRowId() !== undefined && row.id === activeRowId();\n          @let ariaRowIndex = rowAriaIndexById().get(row.id) ?? null;\n          @let subRowId = resolvedId() + \"-sub-\" + row.id;\n          @let expandsOnClick = rowExpandsOnClick(row);\n          <tr\n            cdkDrag\n            [cdkDragDisabled]=\"!reorderableRows()\"\n            cdkDragLockAxis=\"y\"\n            [class]=\"\n              'tedi-table__row' +\n              (this.selectedRowHighlight() && row.getIsSelected()\n                ? ' tedi-table__row--selected'\n                : '') +\n              (isActiveRow ? ' tedi-table__row--active' : '') +\n              (interactive() || expandsOnClick\n                ? ' tedi-table__row--clickable'\n                : '') +\n              (row.depth > 0 ? ' tedi-table__row--sub-row' : '') +\n              (groupStartRowIds().has(row.id)\n                ? ' tedi-table__row--group-start'\n                : '') +\n              (pickedUpRow() === row.original\n                ? ' tedi-table__row--picked-up'\n                : '')\n            \"\n            [attr.role]=\"\n              interactive() && !rowHasNestedInteractive(row) ? 'button' : null\n            \"\n            [attr.tabindex]=\"interactive() ? 0 : null\"\n            [attr.aria-label]=\"rowAriaLabelFor(row)\"\n            [attr.aria-rowindex]=\"ariaRowIndex\"\n            [attr.aria-current]=\"isActiveRow ? 'true' : null\"\n            (click)=\"\n              (interactive() || expandsOnClick) && handleRowClick($event, row)\n            \"\n            (keydown)=\"handleRowKeydown($event, row)\"\n            (mouseenter)=\"handleRowMouseEnter(row)\"\n            (mouseleave)=\"handleRowMouseLeave()\"\n          >\n            @for (cell of row.getVisibleCells(); track cell.id) {\n              @let cellMeta = getColumnMeta(cell.column);\n              @let cellContext = cell.getContext();\n              @let resolvedSpan = resolveRowSpan(cell, cellContext);\n              @if (resolvedSpan !== 0) {\n                <td\n                  [class]=\"\n                    'tedi-table__cell' +\n                    (cellMeta?.align\n                      ? ' tedi-table__cell--align-' + cellMeta?.align\n                      : '') +\n                    (cellMeta?.vAlign\n                      ? ' tedi-table__cell--valign-' + cellMeta?.vAlign\n                      : '') +\n                    controlCellClass(cell.column.id) +\n                    stickyLeftClass(cell.column.id) +\n                    stickyRightClass(cell.column.id)\n                  \"\n                  [style.left.px]=\"stickyLeft(cell.column.id)\"\n                  [style.right.px]=\"stickyRight(cell.column.id)\"\n                  [attr.rowspan]=\"\n                    resolvedSpan !== null && resolvedSpan > 1\n                      ? resolvedSpan\n                      : null\n                  \"\n                >\n                  @if (cell.column.id === DRAG_COLUMN_ID) {\n                    <button\n                      type=\"button\"\n                      cdkDragHandle\n                      class=\"tedi-table__drag-handle\"\n                      [class.tedi-table__drag-handle--picked-up]=\"\n                        pickedUpRow() === row.original\n                      \"\n                      [id]=\"rowReorderHandleId(row.id)\"\n                      [attr.aria-label]=\"dragRowLabel()\"\n                      [attr.aria-pressed]=\"\n                        reorderableRows()\n                          ? pickedUpRow() === row.original\n                          : null\n                      \"\n                      (click)=\"$event.stopPropagation()\"\n                      (keydown)=\"handleRowReorderKeydown($event, row)\"\n                    >\n                      <tedi-icon\n                        name=\"drag_indicator\"\n                        [size]=\"18\"\n                        color=\"inherit\"\n                      />\n                    </button>\n                  } @else if (cell.column.id === SELECT_COLUMN_ID) {\n                    @if (selectionMode() === \"multiple\") {\n                      <input\n                        tedi-checkbox\n                        type=\"checkbox\"\n                        [id]=\"resolvedId() + '-select-' + row.id\"\n                        [name]=\"resolvedId() + '-select-' + row.id\"\n                        [attr.aria-label]=\"selectRowLabel(row)\"\n                        [checked]=\"isRowSelected(row)\"\n                        [disabled]=\"!row.getCanSelect()\"\n                        [indeterminate]=\"isRowIndeterminate(row)\"\n                        (change)=\"\n                          handleSelectRow(row, $any($event.target).checked)\n                        \"\n                        (click)=\"$event.stopPropagation()\"\n                      />\n                    } @else {\n                      <input\n                        tedi-radio\n                        type=\"radio\"\n                        [id]=\"resolvedId() + '-select-' + row.id\"\n                        [name]=\"resolvedId() + '-select-row'\"\n                        [attr.aria-label]=\"selectRowLabel(row)\"\n                        [checked]=\"row.getIsSelected()\"\n                        [disabled]=\"!row.getCanSelect()\"\n                        (change)=\"\n                          handleSelectRow(row, $any($event.target).checked)\n                        \"\n                        (click)=\"$event.stopPropagation()\"\n                      />\n                    }\n                  } @else if (cell.column.id === EXPAND_COLUMN_ID) {\n                    <span\n                      class=\"tedi-table__expand-toggle\"\n                      [class.tedi-table__expand-toggle--icon-only]=\"\n                        !expandButtonHasLabel()\n                      \"\n                    >\n                      @if (row.getCanExpand()) {\n                        @let expandOpen = row.getIsExpanded();\n                        <button\n                          tedi-collapse-button\n                          [arrowType]=\"resolvedExpandVariant()\"\n                          [hideText]=\"!expandButtonHasLabel()\"\n                          [openText]=\"expandButtonOpenText()\"\n                          [closeText]=\"expandButtonCloseText()\"\n                          [open]=\"expandOpen\"\n                          [id]=\"resolvedId() + '-expand-' + row.id\"\n                          [ariaControls]=\"\n                            renderSubComponent() ? subRowId : undefined\n                          \"\n                          [ariaLabel]=\"\n                            expandButtonHasLabel()\n                              ? undefined\n                              : expandRowLabel(expandOpen)\n                          \"\n                          (openChange)=\"handleExpandToggle(row)\"\n                          (click)=\"$event.stopPropagation()\"\n                          (keydown)=\"handleExpandKeydown($event)\"\n                        ></button>\n                      }\n                    </span>\n                  } @else {\n                    <ng-container\n                      *flexRender=\"\n                        cell.column.columnDef.cell;\n                        props: cellContext;\n                        let content\n                      \"\n                    >\n                      {{ content }}\n                    </ng-container>\n                  }\n                </td>\n              }\n            }\n          </tr>\n          @if (renderSubComponent(); as subTpl) {\n            @if (row.getCanExpand()) {\n              @let isExpanded = row.getIsExpanded();\n              <tr\n                [class]=\"\n                  'tedi-table__row tedi-table__row--sub-component' +\n                  (isExpanded ? ' tedi-table__row--sub-component-open' : '')\n                \"\n              >\n                <td\n                  class=\"tedi-table__cell tedi-table__cell--sub-component\"\n                  [attr.id]=\"subRowId\"\n                  [attr.role]=\"isExpanded ? 'region' : null\"\n                  [attr.aria-label]=\"isExpanded ? rowDetailsLabel() : null\"\n                  [attr.inert]=\"isExpanded ? null : ''\"\n                  [attr.colspan]=\"leafColumnCount() > 0 ? leafColumnCount() : 1\"\n                >\n                  <div class=\"tedi-table__sub-component-wrapper\">\n                    <div class=\"tedi-table__sub-component-content\">\n                      <div class=\"tedi-table__sub-component-inner\">\n                        <ng-container\n                          *ngTemplateOutlet=\"\n                            subTpl;\n                            context: { $implicit: row }\n                          \"\n                        />\n                      </div>\n                    </div>\n                  </div>\n                </td>\n              </tr>\n            }\n          }\n        }\n      }\n    </tbody>\n\n    @if (hasFooter()) {\n      <tfoot class=\"tedi-table__foot\">\n        @for (group of footerGroups(); track group.id) {\n          <tr class=\"tedi-table__row\">\n            @for (header of group.headers; track header.id) {\n              @let footerMeta = getColumnMeta(header.column);\n              <td\n                [class]=\"\n                  'tedi-table__cell tedi-table__cell--footer' +\n                  (footerMeta?.align\n                    ? ' tedi-table__cell--align-' + footerMeta?.align\n                    : '') +\n                  (footerMeta?.vAlign\n                    ? ' tedi-table__cell--valign-' + footerMeta?.vAlign\n                    : '')\n                \"\n                [attr.colspan]=\"header.colSpan > 1 ? header.colSpan : null\"\n              >\n                @if (!header.isPlaceholder) {\n                  <ng-container\n                    *flexRender=\"\n                      header.column.columnDef.footer;\n                      props: header.getContext();\n                      let content\n                    \"\n                  >\n                    {{ content }}\n                  </ng-container>\n                }\n              </td>\n            }\n          </tr>\n        }\n      </tfoot>\n    }\n  </table>\n</div>\n\n@if (resolvedBottomSlot(); as bottom) {\n  <div class=\"tedi-table__pagination tedi-table__pagination--bottom\">\n    <tedi-pagination\n      [pageCount]=\"paginationPageCount()\"\n      [page]=\"paginationPage()\"\n      [totalItems]=\"paginationTotalItems()\"\n      [pageSize]=\"paginationPageSize()\"\n      [pageSizeOptions]=\"paginationPageSizeOptions()\"\n      [boundaryCount]=\"bottom.boundaryCount\"\n      [siblingCount]=\"bottom.siblingCount\"\n      [labels]=\"bottom.labels\"\n      [background]=\"bottom.background\"\n      [align]=\"bottom.align\"\n      [dividerPosition]=\"bottom.dividerPosition\"\n      [hideResults]=\"bottom.hideResults\"\n      [hidePageSize]=\"bottom.hidePageSize\"\n      [hidePager]=\"bottom.hidePager\"\n      [hideArrows]=\"bottom.hideArrows\"\n      [disableArrowsAtBoundary]=\"bottom.disableArrowsAtBoundary\"\n      [arrowVariant]=\"bottom.arrowVariant\"\n      [showArrowLabels]=\"bottom.showArrowLabels\"\n      [previousIcon]=\"bottom.previousIcon\"\n      [nextIcon]=\"bottom.nextIcon\"\n      [showModalTitle]=\"bottom.showModalTitle\"\n      [xs]=\"bottom.xs\"\n      [sm]=\"bottom.sm\"\n      [md]=\"bottom.md\"\n      [lg]=\"bottom.lg\"\n      [xl]=\"bottom.xl\"\n      [xxl]=\"bottom.xxl\"\n      (pageChange)=\"handlePaginationPageChange($event)\"\n      (pageSizeChange)=\"handlePaginationPageSizeChange($event)\"\n    >\n      @if (bottomResultsTemplate(); as tpl) {\n        <span tediPaginationResults>\n          <ng-container *ngTemplateOutlet=\"tpl\" />\n        </span>\n      }\n    </tedi-pagination>\n  </div>\n}\n", styles: [".tedi-table{display:flex;flex-direction:column;gap:var(--tedi-dimensions-10);width:100%}.tedi-table__scroll{overflow-x:auto;background:var(--table-default);border:var(--tedi-borders-01) solid var(--table-border);border-radius:var(--table-radius)}.tedi-table__table{width:100%;font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--general-text-primary);border-spacing:0;border-collapse:collapse;background:var(--table-default)}.tedi-table__caption{padding:var(--tedi-dimensions-10) var(--table-header-padding-x);font-weight:var(--body-regular-weight);color:var(--general-text-primary);text-align:left;caption-side:top}.tedi-table__head{background:var(--table-default)}.tedi-table__header-cell{padding:var(--table-header-padding-y) var(--table-header-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);color:var(--general-text-tertiary);text-align:left;white-space:nowrap;background:var(--table-default);border-bottom:1px solid var(--table-border-th)}.tedi-table__header-content{display:inline-flex;gap:var(--layout-grid-gutters-04);align-items:center}.tedi-table__filter-popover{display:inline-flex;align-items:center}.tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__body .tedi-table__row:last-child>.tedi-table__cell{border-bottom:0}.tedi-table--group-dividers-between .tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:0}.tedi-table--group-dividers-between .tedi-table__body .tedi-table__row--group-start>.tedi-table__cell{border-top:var(--tedi-borders-01) solid var(--table-border)}.tedi-table--group-dividers-none .tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:0}.tedi-table__cell{padding:var(--table-data-padding-y) var(--table-data-padding-x);vertical-align:middle;color:var(--general-text-primary);background:var(--table-default)}.tedi-table__cell--control{padding-right:var(--table-data-padding-x-sm);padding-left:var(--table-data-padding-x-sm)}.tedi-table__cell--control-fit{width:1%;white-space:nowrap}.tedi-table__cell--align-left{text-align:left}.tedi-table__cell--align-center{text-align:center}.tedi-table__cell--align-right{text-align:right}.tedi-table__cell--valign-top{vertical-align:top}.tedi-table__cell--valign-middle{vertical-align:middle}.tedi-table__cell--valign-bottom{vertical-align:bottom}.tedi-table__expand-toggle{display:flex;align-items:center}.tedi-table__expand-toggle--icon-only{min-height:var(--button-sm-icon-size)}.tedi-table__cell--placeholder{padding:var(--tedi-dimensions-14) var(--table-data-padding-x);color:var(--general-text-secondary);text-align:center}.tedi-table--small .tedi-table__header-cell{padding:var(--table-header-padding-y-sm) var(--table-header-padding-x-sm)}.tedi-table--small .tedi-table__cell{padding:var(--table-data-padding-y-sm) var(--table-data-padding-x-sm)}.tedi-table__foot{font-weight:var(--heading-weight);background:var(--table-default)}.tedi-table__cell--footer{color:var(--general-text-primary);border-top:var(--tedi-borders-01) solid var(--table-border-th)}.tedi-table__row--selected>.tedi-table__cell{background:var(--table-active)}.tedi-table__row--clickable{cursor:pointer}.tedi-table__row--clickable:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(var(--tedi-borders-02) * -1);background:transparent;border-color:transparent}.tedi-table__body .tedi-table__row--sub-component>.tedi-table__cell{background:var(--table-striped);border-bottom:0}.tedi-table__body .tedi-table__row--sub-component-open>.tedi-table__cell{border-bottom:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__row--sub-row>.tedi-table__cell{background:var(--table-striped)}.tedi-table__cell--sub-component{padding:0}.tedi-table__sub-component-wrapper{display:grid;grid-template-rows:0fr}.tedi-table__row--sub-component-open .tedi-table__sub-component-wrapper{grid-template-rows:1fr}.tedi-table__sub-component-content{min-height:0;overflow:hidden}.tedi-table__sub-component-inner{padding:var(--table-data-padding-y) var(--table-data-padding-x)}.tedi-table__row--filter{background:var(--general-surface-primary)}.tedi-table__row--filter .tedi-table__header-cell{padding-top:var(--tedi-dimensions-05);padding-bottom:var(--tedi-dimensions-05);font-weight:var(--body-regular-weight);background:var(--general-surface-primary)}.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell{background:var(--table-striped)}.tedi-table.tedi-table--row-hover .tedi-table__body .tedi-table__row:hover>.tedi-table__cell{background:var(--table-hover)}.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--active>.tedi-table__cell,.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--active:hover>.tedi-table__cell{background:var(--table-hover)}.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--picked-up>.tedi-table__cell{background:var(--table-hover)}.tedi-table--vertical-borders .tedi-table__header-cell,.tedi-table--vertical-borders .tedi-table__cell{border-right:var(--tedi-borders-01) solid var(--table-border)}.tedi-table--vertical-borders thead tr:first-child .tedi-table__header-cell:last-child,.tedi-table--vertical-borders .tedi-table__row>.tedi-table__cell:last-child{border-right:0}.tedi-table--borderless .tedi-table__scroll{background:transparent;border:0;border-radius:0}.tedi-table--has-pagination{gap:0}.tedi-table--has-pagination-bottom .tedi-table__scroll{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.tedi-table--has-pagination-top .tedi-table__scroll{border-top:0;border-top-left-radius:0;border-top-right-radius:0}.tedi-table__pagination{overflow:hidden;border:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__pagination--bottom{border-top:0;border-bottom-right-radius:var(--table-radius);border-bottom-left-radius:var(--table-radius)}.tedi-table__pagination--top{border-bottom:0;border-top-left-radius:var(--table-radius);border-top-right-radius:var(--table-radius)}.tedi-table--borderless .tedi-table__pagination{background:transparent;border:0}.tedi-table--sticky-first-column .tedi-table__header-cell.tedi-table__cell--sticky-left{position:sticky;z-index:2;background:var(--table-default)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left{position:sticky;z-index:1;background:var(--table-default)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left-edge:after{position:absolute;top:0;bottom:0;left:100%;width:var(--tedi-dimensions-03);pointer-events:none;content:\"\"}.tedi-table--sticky-first-column .tedi-table__scroll--shadow-start .tedi-table__cell--sticky-left-edge:after{background:linear-gradient(to right,var(--tedi-alpha-10),transparent)}.tedi-table--sticky-first-column .tedi-table__body .tedi-table__row--sub-row>.tedi-table__cell--sticky-left{background:var(--table-striped)}.tedi-table--sticky-first-column.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell--sticky-left{background:var(--table-striped)}.tedi-table--sticky-first-column .tedi-table__body .tedi-table__row--picked-up>.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column.tedi-table--striped .tedi-table__body .tedi-table__row--picked-up:nth-of-type(2n)>.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell--picked-up.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left{box-shadow:inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-start{box-shadow:inset var(--tedi-borders-02) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-start.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset var(--tedi-borders-02) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__header-cell.tedi-table__cell--sticky-right{position:sticky;z-index:2;background:var(--table-default)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right{position:sticky;z-index:1;background:var(--table-default)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right-edge:after{position:absolute;top:0;right:100%;bottom:0;width:var(--tedi-dimensions-03);pointer-events:none;content:\"\"}.tedi-table--sticky-last-column .tedi-table__scroll--shadow-end .tedi-table__cell--sticky-right-edge:after{background:linear-gradient(to left,var(--tedi-alpha-10),transparent)}.tedi-table--sticky-last-column .tedi-table__body .tedi-table__row--sub-row>.tedi-table__cell--sticky-right{background:var(--table-striped)}.tedi-table--sticky-last-column.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell--sticky-right{background:var(--table-striped)}.tedi-table--sticky-last-column .tedi-table__body .tedi-table__row--picked-up>.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column.tedi-table--striped .tedi-table__body .tedi-table__row--picked-up:nth-of-type(2n)>.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell--picked-up.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right{box-shadow:inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-start{box-shadow:inset calc(var(--tedi-borders-02) * -1) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-start.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset calc(var(--tedi-borders-02) * -1) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-header .tedi-table__head{border-bottom:0}.tedi-table--sticky-header .tedi-table__head .tedi-table__row{position:sticky;top:0;z-index:2;background:var(--table-default)}.tedi-table--sticky-header .tedi-table__head .tedi-table__header-cell{position:sticky;top:0;z-index:2;background:var(--table-default);border-bottom:0;box-shadow:inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-left{z-index:3}.tedi-table--sticky-header.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-right{z-index:3}.tedi-table--sticky-header.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header .tedi-table__scroll--shadow-header .tedi-table__head .tedi-table__row:after{position:absolute;top:100%;right:0;left:0;height:var(--tedi-dimensions-03);pointer-events:none;content:\"\";background:linear-gradient(to bottom,var(--tedi-alpha-10),transparent)}.tedi-table--fixed-layout .tedi-table__table{table-layout:fixed}.tedi-table__drag-handle{display:inline-flex;align-items:center;justify-content:center;padding:2px;color:var(--general-text-tertiary);cursor:grab;background:transparent;border:0;border-radius:var(--button-radius-sm)}.tedi-table__drag-handle:hover{color:var(--general-text-primary);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-table__drag-handle:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:0}.tedi-table__drag-handle.cdk-drag-disabled{color:var(--general-text-disabled);cursor:not-allowed}.tedi-table__drag-handle--picked-up{color:var(--tedi-primary-500);cursor:grabbing}.cdk-drag-preview .tedi-table__drag-handle,.cdk-drop-list-dragging .tedi-table__drag-handle{cursor:grabbing}.cdk-drag-preview.tedi-table__row,.cdk-drag-preview.tedi-table__header-cell{display:table;cursor:grabbing;background:var(--table-hover);border:var(--tedi-borders-01) solid var(--card-border-primary);border-radius:var(--table-radius);box-shadow:0 6px 16px var(--tedi-alpha-20)}.cdk-drag-preview.tedi-table__row>.tedi-table__cell{background:var(--table-hover)}.cdk-drag-placeholder.tedi-table__row,.cdk-drag-placeholder.tedi-table__header-cell{opacity:.3}.cdk-drop-list-dragging .tedi-table__row:not(.cdk-drag-placeholder),.cdk-drop-list-dragging .tedi-table__header-cell:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.tedi-table__filter{display:flex;flex-direction:column;gap:var(--tedi-dimensions-12);width:100%}.tedi-table__filter-actions{display:flex;gap:var(--button-gutter-x-sm)}.tedi-table__filter-actions>*{flex:1 1 0;justify-content:center}.tedi-table .tedi-table__head .tedi-table__header-cell--picked-up{cursor:grabbing;background:var(--table-hover)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: FlexRenderDirective, selector: "[flexRender]", inputs: ["flexRender", "flexRenderProps", "flexRenderInjector"] }, { kind: "component", type: PaginationComponent, selector: "tedi-pagination", inputs: ["pageCount", "page", "totalItems", "pageSize", "pageSizeOptions", "boundaryCount", "siblingCount", "labels", "background", "dividerPosition", "align", "hideResults", "hidePageSize", "hidePager", "hideArrows", "disableArrowsAtBoundary", "arrowVariant", "showArrowLabels", "previousIcon", "nextIcon", "showModalTitle", "xs", "sm", "md", "lg", "xl", "xxl"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "directive", type: TediPaginationResultsDirective, selector: "[tediPaginationResults]" }, { kind: "component", type: TediTableHeaderButtonComponent, selector: "button[tedi-table-header-button]", inputs: ["icon", "filled", "selected", "disabled", "iconSize", "aria-label"] }, { kind: "component", type: CheckboxComponent, selector: "input[type=checkbox][tedi-checkbox]", inputs: ["size", "invalid", "value", "disabled"] }, { kind: "component", type: RadioComponent, selector: "input[type=radio][tedi-radio]", inputs: ["size", "invalid", "value", "disabled"] }, { kind: "component", type: TextFieldComponent, selector: "input[tedi-text-field]", inputs: ["value", "size", "invalid", "arrowsHidden", "disabled", "readonly", "readOnly"], outputs: ["valueChange", "clear"] }, { kind: "component", type: FormFieldComponent, selector: "tedi-form-field", inputs: ["size", "icon", "clearable", "showClearOnInteraction", "inputClass", "characterLimit"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: CollapseButtonComponent, selector: "button[tedi-collapse-button]", inputs: ["open", "openText", "closeText", "hideText", "arrowType", "size", "inverted", "underline", "ariaControls", "ariaLabel", "id"], outputs: ["openChange"] }, { kind: "component", type: PopoverComponent, selector: "tedi-popover", inputs: ["position", "preventOverflow", "dismissible", "hideOnScroll", "withBorder", "withArrow", "lockScroll", "timeoutDelay", "offset"] }, { kind: "component", type: PopoverContentComponent, selector: "tedi-popover-content", inputs: ["maxWidth", "title", "showClose"] }, { kind: "directive", type: PopoverTriggerDirective, selector: "[tedi-popover-trigger]", inputs: ["underline", "interactive"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TediTableComponent, decorators: [{
             type: Component,
@@ -14782,7 +14917,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                             useFactory: (component) => component.contextValue,
                             deps: [TediTableComponent],
                         },
-                    ], template: "<ng-content select=\"tedi-table-toolbar\" />\n<ng-content select=\"tedi-table-columns-menu\" />\n\n<!-- Live region for screen-reader announcements during keyboard reordering -->\n@if (reorderableColumns() || reorderableRows()) {\n  <div\n    [id]=\"liveRegionId\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n    class=\"tedi-table__sr-only\"\n  ></div>\n}\n\n@if (resolvedTopSlot(); as top) {\n  <div class=\"tedi-table__pagination tedi-table__pagination--top\">\n    <tedi-pagination\n      [pageCount]=\"paginationPageCount()\"\n      [page]=\"paginationPage()\"\n      [totalItems]=\"paginationTotalItems()\"\n      [pageSize]=\"paginationPageSize()\"\n      [pageSizeOptions]=\"paginationPageSizeOptions()\"\n      [boundaryCount]=\"top.boundaryCount\"\n      [siblingCount]=\"top.siblingCount\"\n      [labels]=\"top.labels\"\n      [background]=\"top.background\"\n      [align]=\"top.align\"\n      [dividerPosition]=\"top.dividerPosition\"\n      [hideResults]=\"top.hideResults\"\n      [hidePageSize]=\"top.hidePageSize\"\n      [hidePager]=\"top.hidePager\"\n      [hideArrows]=\"top.hideArrows\"\n      [disableArrowsAtBoundary]=\"top.disableArrowsAtBoundary\"\n      [arrowVariant]=\"top.arrowVariant\"\n      [showArrowLabels]=\"top.showArrowLabels\"\n      [previousIcon]=\"top.previousIcon\"\n      [nextIcon]=\"top.nextIcon\"\n      [showModalTitle]=\"top.showModalTitle\"\n      [xs]=\"top.xs\"\n      [sm]=\"top.sm\"\n      [md]=\"top.md\"\n      [lg]=\"top.lg\"\n      [xl]=\"top.xl\"\n      [xxl]=\"top.xxl\"\n      (pageChange)=\"handlePaginationPageChange($event)\"\n      (pageSizeChange)=\"handlePaginationPageSizeChange($event)\"\n    >\n      @if (topResultsTemplate(); as tpl) {\n        <span tediPaginationResults>\n          <ng-container *ngTemplateOutlet=\"tpl\" />\n        </span>\n      }\n    </tedi-pagination>\n  </div>\n}\n\n<div\n  #scrollContainer\n  class=\"tedi-table__scroll\"\n  [class.tedi-table__scroll--shadow-start]=\"hasStartShadow()\"\n  [class.tedi-table__scroll--shadow-end]=\"hasEndShadow()\"\n  [class.tedi-table__scroll--shadow-header]=\"hasHeaderShadow()\"\n  [attr.style]=\"maxHeightStyle()\"\n  cdkScrollable\n  tabindex=\"0\"\n  role=\"group\"\n  [attr.aria-label]=\"scrollRegionLabel()\"\n  (scroll)=\"onHorizontalScroll()\"\n>\n  <table\n    #tableElement\n    class=\"tedi-table__table\"\n    [attr.id]=\"id() || null\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-labelledby]=\"ariaLabelledby() || null\"\n    [attr.aria-rowcount]=\"ariaRowCount()\"\n    [attr.aria-colcount]=\"leafColumnCount() > 0 ? leafColumnCount() : null\"\n  >\n    @if (caption(); as cap) {\n      <caption class=\"tedi-table__caption\">\n        @if (isString(cap)) {\n          {{ cap }}\n        } @else {\n          <ng-container *ngTemplateOutlet=\"$any(cap)\" />\n        }\n      </caption>\n    }\n\n    <thead class=\"tedi-table__head\">\n      @for (\n        headerGroup of headerGroups();\n        track headerGroup.id;\n        let rowIndex = $index\n      ) {\n        <tr\n          class=\"tedi-table__row\"\n          [attr.aria-rowindex]=\"ariaRowIndexingEnabled() ? rowIndex + 1 : null\"\n          [cdkDropListDisabled]=\"!reorderableColumns() || rowIndex > 0\"\n          cdkDropList\n          cdkDropListOrientation=\"horizontal\"\n          cdkDropListAutoScrollDisabled\n          (cdkDropListDropped)=\"handleColumnDrop($event)\"\n        >\n          @for (header of headerGroup.headers; track header.id) {\n            @if (shouldRenderHeader(header, rowIndex)) {\n              @let meta = getColumnMeta(header.column);\n              @let ariaSort = getHeaderAriaSort(header.column);\n              @let srHeaderLabel = getSrOnlyHeaderLabel(header.column);\n              @let rowSpan = getHeaderRowSpan(header, rowIndex);\n              @let headerAlign = meta?.headerAlign ?? meta?.align;\n              <th\n                scope=\"col\"\n                cdkDrag\n                [cdkDragDisabled]=\"\n                  !reorderableColumns() ||\n                  rowIndex > 0 ||\n                  header.column.id === SELECT_COLUMN_ID ||\n                  header.column.id === EXPAND_COLUMN_ID\n                \"\n                cdkDragLockAxis=\"x\"\n                (keydown)=\"handleHeaderKeydown($event, header)\"\n                [class]=\"\n                  'tedi-table__header-cell' +\n                  (isHeaderGroup(header)\n                    ? ' tedi-table__header-cell--group'\n                    : '') +\n                  (headerAlign\n                    ? ' tedi-table__cell--align-' + headerAlign\n                    : '') +\n                  (meta?.vAlign\n                    ? ' tedi-table__cell--valign-' + meta?.vAlign\n                    : '') +\n                  (pickedUpColumnId() === header.column.id\n                    ? ' tedi-table__header-cell--picked-up'\n                    : '') +\n                  controlCellClass(header.column.id) +\n                  stickyLeftClass(header.column.id) +\n                  stickyRightClass(header.column.id)\n                \"\n                [attr.colspan]=\"header.colSpan > 1 ? header.colSpan : null\"\n                [attr.rowspan]=\"rowSpan\"\n                [attr.aria-sort]=\"ariaSort\"\n                [style.width.px]=\"headerCellWidth(header.column)\"\n                [style.min-width.px]=\"columnMinWidth(header.column)\"\n                [style.max-width.px]=\"columnMaxWidth(header.column)\"\n                [style.left.px]=\"stickyLeft(header.column.id)\"\n                [style.right.px]=\"stickyRight(header.column.id)\"\n              >\n                @if (srHeaderLabel) {\n                  <span class=\"tedi-table__sr-only\">{{ srHeaderLabel }}</span>\n                }\n                @if (header.column.id === SELECT_COLUMN_ID) {\n                  @if (selectionMode() === \"multiple\") {\n                    <input\n                      tedi-checkbox\n                      type=\"checkbox\"\n                      [id]=\"resolvedId() + '-select-all'\"\n                      [name]=\"resolvedId() + '-select-all'\"\n                      [attr.aria-label]=\"selectAllLabel()\"\n                      [checked]=\"isAllPageRowsSelected()\"\n                      [indeterminate]=\"\n                        isSomePageRowsSelected() && !isAllPageRowsSelected()\n                      \"\n                      (change)=\"handleSelectAll($any($event.target).checked)\"\n                    />\n                  }\n                } @else if (header.column.id === EXPAND_COLUMN_ID) {\n                  <!-- empty -->\n                } @else if (header.column.id === DRAG_COLUMN_ID) {\n                  <!-- empty -->\n                } @else {\n                  <span class=\"tedi-table__header-content\">\n                    @if (\n                      reorderableColumns() &&\n                      rowIndex === 0 &&\n                      !isHeaderGroup(header)\n                    ) {\n                      <button\n                        type=\"button\"\n                        cdkDragHandle\n                        class=\"tedi-table__drag-handle\"\n                        [class.tedi-table__drag-handle--picked-up]=\"\n                          pickedUpColumnId() === header.column.id\n                        \"\n                        [id]=\"reorderHandleId(header.column.id)\"\n                        [attr.aria-label]=\"dragColumnLabel()\"\n                        [attr.aria-pressed]=\"\n                          reorderableColumns()\n                            ? pickedUpColumnId() === header.column.id\n                            : null\n                        \"\n                      >\n                        <tedi-icon\n                          name=\"drag_indicator\"\n                          [size]=\"18\"\n                          color=\"inherit\"\n                        />\n                      </button>\n                    }\n                    <ng-container\n                      *flexRender=\"\n                        header.column.columnDef.header;\n                        props: header.getContext();\n                        let content\n                      \"\n                    >\n                      @if (shouldRenderSortableHeader(header.column, content)) {\n                        <button\n                          tedi-table-header-button\n                          [icon]=\"sortIcon(header.column)\"\n                          [selected]=\"!!header.column.getIsSorted()\"\n                          (click)=\"handleSortToggle(header.column)\"\n                        >\n                          {{ content }}\n                        </button>\n                      } @else if (isString(content) || isNumber(content)) {\n                        {{ content }}\n                      } @else {\n                        {{ content }}\n                      }\n                    </ng-container>\n                    @if (shouldRenderFilterButton(header.column)) {\n                      @if (filterUsesModal()) {\n                        <button\n                          tedi-table-header-button\n                          icon=\"filter_alt\"\n                          [selected]=\"filterIsActive(header.column)\"\n                          [filled]=\"filterIsActive(header.column)\"\n                          [aria-label]=\"filterAriaLabel(header.column)\"\n                          (click)=\"openFilterModal(header.column)\"\n                        ></button>\n                      } @else {\n                        <tedi-popover\n                          #filterPopover\n                          class=\"tedi-table__filter-popover\"\n                          position=\"bottom-end\"\n                          [preventOverflow]=\"true\"\n                        >\n                          <button\n                            tedi-popover-trigger\n                            tedi-table-header-button\n                            icon=\"filter_alt\"\n                            [selected]=\"filterIsActive(header.column)\"\n                            [filled]=\"filterIsActive(header.column)\"\n                            [aria-label]=\"filterAriaLabel(header.column)\"\n                            (click)=\"handleFilterTriggerClick(header.column)\"\n                          ></button>\n                          <tedi-popover-content\n                            [maxWidth]=\"filterPopoverWidthFor(header.column)\"\n                          >\n                            <div class=\"tedi-table__filter\">\n                              <div class=\"tedi-table__filter-body\">\n                                @if (filterTemplateFor(header.column); as tpl) {\n                                  <ng-container\n                                    *ngTemplateOutlet=\"\n                                      tpl;\n                                      context: filterContextFor(\n                                        header.column,\n                                        filterPopover\n                                      )\n                                    \"\n                                  />\n                                }\n                              </div>\n                              <div class=\"tedi-table__filter-actions\">\n                                <button\n                                  tedi-button\n                                  variant=\"secondary\"\n                                  size=\"small\"\n                                  type=\"button\"\n                                  (click)=\"\n                                    handleFilterClear(\n                                      header.column,\n                                      filterPopover\n                                    )\n                                  \"\n                                >\n                                  {{ filterClearLabel() }}\n                                </button>\n                                <button\n                                  tedi-button\n                                  variant=\"primary\"\n                                  size=\"small\"\n                                  type=\"button\"\n                                  (click)=\"\n                                    handleFilterApply(\n                                      header.column,\n                                      filterPopover\n                                    )\n                                  \"\n                                >\n                                  {{ filterApplyLabel() }}\n                                </button>\n                              </div>\n                            </div>\n                          </tedi-popover-content>\n                        </tedi-popover>\n                      }\n                    }\n                  </span>\n                }\n              </th>\n            }\n          }\n        </tr>\n      }\n      @if (enableColumnFilters()) {\n        <tr\n          class=\"tedi-table__row tedi-table__row--filter\"\n          [attr.aria-rowindex]=\"\n            ariaRowIndexingEnabled() ? headerGroups().length + 1 : null\n          \"\n        >\n          @for (column of leafColumns(); track column.id) {\n            @let filterId = resolvedId() + \"-filter-\" + column.id;\n            <th class=\"tedi-table__header-cell\" scope=\"col\">\n              @if (column.getCanFilter()) {\n                <tedi-form-field size=\"small\">\n                  <input\n                    tedi-text-field\n                    type=\"text\"\n                    [id]=\"filterId\"\n                    [name]=\"filterId\"\n                    [attr.aria-label]=\"filterLabel(column)\"\n                    [placeholder]=\"filterPlaceholder()\"\n                    [value]=\"getFilterValue(column)\"\n                    (input)=\"\n                      handleColumnFilter(column, $any($event.target).value)\n                    \"\n                    (clear)=\"handleColumnFilter(column, '')\"\n                  />\n                </tedi-form-field>\n              }\n            </th>\n          }\n        </tr>\n      }\n    </thead>\n\n    <tbody\n      class=\"tedi-table__body\"\n      cdkDropList\n      [cdkDropListDisabled]=\"!reorderableRows()\"\n      (cdkDropListDropped)=\"handleRowDrop($any($event))\"\n    >\n      @if (rows().length === 0) {\n        <tr class=\"tedi-table__row\">\n          <td\n            class=\"tedi-table__cell tedi-table__cell--placeholder\"\n            [attr.colspan]=\"leafColumnCount() > 0 ? leafColumnCount() : 1\"\n          >\n            @if (placeholder(); as pl) {\n              @if (placeholderRole()) {\n                <div [attr.role]=\"placeholderRole()\">\n                  @if (isString(pl)) {\n                    {{ pl }}\n                  } @else {\n                    <ng-container *ngTemplateOutlet=\"$any(pl)\" />\n                  }\n                </div>\n              } @else {\n                @if (isString(pl)) {\n                  {{ pl }}\n                } @else {\n                  <ng-container *ngTemplateOutlet=\"$any(pl)\" />\n                }\n              }\n            } @else {\n              @if (placeholderRole()) {\n                <div [attr.role]=\"placeholderRole()\">\n                  {{ placeholderLabel() }}\n                </div>\n              } @else {\n                {{ placeholderLabel() }}\n              }\n            }\n          </td>\n        </tr>\n      } @else {\n        @for (row of rows(); track row.id) {\n          @let isActiveRow =\n            activeRowId() !== undefined && row.id === activeRowId();\n          @let ariaRowIndex = rowAriaIndexById().get(row.id) ?? null;\n          @let subRowId = resolvedId() + \"-sub-\" + row.id;\n          @let expandsOnClick = rowExpandsOnClick(row);\n          <tr\n            cdkDrag\n            [cdkDragDisabled]=\"!reorderableRows()\"\n            cdkDragLockAxis=\"y\"\n            [class]=\"\n              'tedi-table__row' +\n              (this.selectedRowHighlight() && row.getIsSelected()\n                ? ' tedi-table__row--selected'\n                : '') +\n              (isActiveRow ? ' tedi-table__row--active' : '') +\n              (interactive() || expandsOnClick\n                ? ' tedi-table__row--clickable'\n                : '') +\n              (row.depth > 0 ? ' tedi-table__row--sub-row' : '') +\n              (groupStartRowIds().has(row.id)\n                ? ' tedi-table__row--group-start'\n                : '') +\n              (pickedUpRow() === row.original\n                ? ' tedi-table__row--picked-up'\n                : '')\n            \"\n            [attr.role]=\"\n              interactive() && !rowHasNestedInteractive(row) ? 'button' : null\n            \"\n            [attr.tabindex]=\"interactive() ? 0 : null\"\n            [attr.aria-label]=\"rowAriaLabelFor(row)\"\n            [attr.aria-rowindex]=\"ariaRowIndex\"\n            [attr.aria-current]=\"isActiveRow ? 'true' : null\"\n            (click)=\"\n              (interactive() || expandsOnClick) && handleRowClick($event, row)\n            \"\n            (keydown)=\"handleRowKeydown($event, row)\"\n            (mouseenter)=\"handleRowMouseEnter(row)\"\n            (mouseleave)=\"handleRowMouseLeave()\"\n          >\n            @for (cell of row.getVisibleCells(); track cell.id) {\n              @let cellMeta = getColumnMeta(cell.column);\n              @let cellContext = cell.getContext();\n              @let resolvedSpan = resolveRowSpan(cell, cellContext);\n              @if (resolvedSpan !== 0) {\n                <td\n                  [class]=\"\n                    'tedi-table__cell' +\n                    (cellMeta?.align\n                      ? ' tedi-table__cell--align-' + cellMeta?.align\n                      : '') +\n                    (cellMeta?.vAlign\n                      ? ' tedi-table__cell--valign-' + cellMeta?.vAlign\n                      : '') +\n                    controlCellClass(cell.column.id) +\n                    stickyLeftClass(cell.column.id) +\n                    stickyRightClass(cell.column.id)\n                  \"\n                  [style.left.px]=\"stickyLeft(cell.column.id)\"\n                  [style.right.px]=\"stickyRight(cell.column.id)\"\n                  [attr.rowspan]=\"\n                    resolvedSpan !== null && resolvedSpan > 1\n                      ? resolvedSpan\n                      : null\n                  \"\n                >\n                  @if (cell.column.id === DRAG_COLUMN_ID) {\n                    <button\n                      type=\"button\"\n                      cdkDragHandle\n                      class=\"tedi-table__drag-handle\"\n                      [class.tedi-table__drag-handle--picked-up]=\"\n                        pickedUpRow() === row.original\n                      \"\n                      [id]=\"rowReorderHandleId(row.id)\"\n                      [attr.aria-label]=\"dragRowLabel()\"\n                      [attr.aria-pressed]=\"\n                        reorderableRows()\n                          ? pickedUpRow() === row.original\n                          : null\n                      \"\n                      (click)=\"$event.stopPropagation()\"\n                      (keydown)=\"handleRowReorderKeydown($event, row)\"\n                    >\n                      <tedi-icon\n                        name=\"drag_indicator\"\n                        [size]=\"18\"\n                        color=\"inherit\"\n                      />\n                    </button>\n                  } @else if (cell.column.id === SELECT_COLUMN_ID) {\n                    @if (selectionMode() === \"multiple\") {\n                      <input\n                        tedi-checkbox\n                        type=\"checkbox\"\n                        [id]=\"resolvedId() + '-select-' + row.id\"\n                        [name]=\"resolvedId() + '-select-' + row.id\"\n                        [attr.aria-label]=\"selectRowLabel(row)\"\n                        [checked]=\"isRowSelected(row)\"\n                        [disabled]=\"!row.getCanSelect()\"\n                        [indeterminate]=\"isRowIndeterminate(row)\"\n                        (change)=\"\n                          handleSelectRow(row, $any($event.target).checked)\n                        \"\n                        (click)=\"$event.stopPropagation()\"\n                      />\n                    } @else {\n                      <input\n                        tedi-radio\n                        type=\"radio\"\n                        [id]=\"resolvedId() + '-select-' + row.id\"\n                        [name]=\"resolvedId() + '-select-row'\"\n                        [attr.aria-label]=\"selectRowLabel(row)\"\n                        [checked]=\"row.getIsSelected()\"\n                        [disabled]=\"!row.getCanSelect()\"\n                        (change)=\"\n                          handleSelectRow(row, $any($event.target).checked)\n                        \"\n                        (click)=\"$event.stopPropagation()\"\n                      />\n                    }\n                  } @else if (cell.column.id === EXPAND_COLUMN_ID) {\n                    <span\n                      class=\"tedi-table__expand-toggle\"\n                      [class.tedi-table__expand-toggle--icon-only]=\"\n                        !expandButtonHasLabel()\n                      \"\n                    >\n                      @if (row.getCanExpand()) {\n                        @let expandOpen = row.getIsExpanded();\n                        <button\n                          tedi-collapse-button\n                          [arrowType]=\"resolvedExpandVariant()\"\n                          [hideText]=\"!expandButtonHasLabel()\"\n                          [openText]=\"expandButtonOpenText()\"\n                          [closeText]=\"expandButtonCloseText()\"\n                          [open]=\"expandOpen\"\n                          [id]=\"resolvedId() + '-expand-' + row.id\"\n                          [ariaControls]=\"\n                            renderSubComponent() ? subRowId : undefined\n                          \"\n                          [ariaLabel]=\"\n                            expandButtonHasLabel()\n                              ? undefined\n                              : expandRowLabel(expandOpen)\n                          \"\n                          (openChange)=\"handleExpandToggle(row)\"\n                          (click)=\"$event.stopPropagation()\"\n                          (keydown)=\"handleExpandKeydown($event)\"\n                        ></button>\n                      }\n                    </span>\n                  } @else {\n                    <ng-container\n                      *flexRender=\"\n                        cell.column.columnDef.cell;\n                        props: cellContext;\n                        let content\n                      \"\n                    >\n                      {{ content }}\n                    </ng-container>\n                  }\n                </td>\n              }\n            }\n          </tr>\n          @if (renderSubComponent(); as subTpl) {\n            @if (row.getCanExpand()) {\n              @let isExpanded = row.getIsExpanded();\n              <tr\n                [class]=\"\n                  'tedi-table__row tedi-table__row--sub-component' +\n                  (isExpanded ? ' tedi-table__row--sub-component-open' : '')\n                \"\n              >\n                <td\n                  class=\"tedi-table__cell tedi-table__cell--sub-component\"\n                  [attr.id]=\"subRowId\"\n                  [attr.role]=\"isExpanded ? 'region' : null\"\n                  [attr.aria-label]=\"isExpanded ? rowDetailsLabel() : null\"\n                  [attr.inert]=\"isExpanded ? null : ''\"\n                  [attr.colspan]=\"leafColumnCount() > 0 ? leafColumnCount() : 1\"\n                >\n                  <div class=\"tedi-table__sub-component-wrapper\">\n                    <div class=\"tedi-table__sub-component-content\">\n                      <div class=\"tedi-table__sub-component-inner\">\n                        <ng-container\n                          *ngTemplateOutlet=\"\n                            subTpl;\n                            context: { $implicit: row }\n                          \"\n                        />\n                      </div>\n                    </div>\n                  </div>\n                </td>\n              </tr>\n            }\n          }\n        }\n      }\n    </tbody>\n\n    @if (hasFooter()) {\n      <tfoot class=\"tedi-table__foot\">\n        @for (group of footerGroups(); track group.id) {\n          <tr class=\"tedi-table__row\">\n            @for (header of group.headers; track header.id) {\n              @let footerMeta = getColumnMeta(header.column);\n              <td\n                [class]=\"\n                  'tedi-table__cell tedi-table__cell--footer' +\n                  (footerMeta?.align\n                    ? ' tedi-table__cell--align-' + footerMeta?.align\n                    : '') +\n                  (footerMeta?.vAlign\n                    ? ' tedi-table__cell--valign-' + footerMeta?.vAlign\n                    : '')\n                \"\n                [attr.colspan]=\"header.colSpan > 1 ? header.colSpan : null\"\n              >\n                @if (!header.isPlaceholder) {\n                  <ng-container\n                    *flexRender=\"\n                      header.column.columnDef.footer;\n                      props: header.getContext();\n                      let content\n                    \"\n                  >\n                    {{ content }}\n                  </ng-container>\n                }\n              </td>\n            }\n          </tr>\n        }\n      </tfoot>\n    }\n  </table>\n</div>\n\n@if (resolvedBottomSlot(); as bottom) {\n  <div class=\"tedi-table__pagination tedi-table__pagination--bottom\">\n    <tedi-pagination\n      [pageCount]=\"paginationPageCount()\"\n      [page]=\"paginationPage()\"\n      [totalItems]=\"paginationTotalItems()\"\n      [pageSize]=\"paginationPageSize()\"\n      [pageSizeOptions]=\"paginationPageSizeOptions()\"\n      [boundaryCount]=\"bottom.boundaryCount\"\n      [siblingCount]=\"bottom.siblingCount\"\n      [labels]=\"bottom.labels\"\n      [background]=\"bottom.background\"\n      [align]=\"bottom.align\"\n      [dividerPosition]=\"bottom.dividerPosition\"\n      [hideResults]=\"bottom.hideResults\"\n      [hidePageSize]=\"bottom.hidePageSize\"\n      [hidePager]=\"bottom.hidePager\"\n      [hideArrows]=\"bottom.hideArrows\"\n      [disableArrowsAtBoundary]=\"bottom.disableArrowsAtBoundary\"\n      [arrowVariant]=\"bottom.arrowVariant\"\n      [showArrowLabels]=\"bottom.showArrowLabels\"\n      [previousIcon]=\"bottom.previousIcon\"\n      [nextIcon]=\"bottom.nextIcon\"\n      [showModalTitle]=\"bottom.showModalTitle\"\n      [xs]=\"bottom.xs\"\n      [sm]=\"bottom.sm\"\n      [md]=\"bottom.md\"\n      [lg]=\"bottom.lg\"\n      [xl]=\"bottom.xl\"\n      [xxl]=\"bottom.xxl\"\n      (pageChange)=\"handlePaginationPageChange($event)\"\n      (pageSizeChange)=\"handlePaginationPageSizeChange($event)\"\n    >\n      @if (bottomResultsTemplate(); as tpl) {\n        <span tediPaginationResults>\n          <ng-container *ngTemplateOutlet=\"tpl\" />\n        </span>\n      }\n    </tedi-pagination>\n  </div>\n}\n", styles: [".tedi-table{display:flex;flex-direction:column;gap:var(--tedi-dimensions-10);width:100%}.tedi-table__scroll{overflow-x:auto;background:var(--table-default);border:var(--tedi-borders-01) solid var(--table-border);border-radius:var(--table-radius)}.tedi-table__table{width:100%;font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--general-text-primary);border-spacing:0;border-collapse:collapse;background:var(--table-default)}.tedi-table__caption{padding:var(--tedi-dimensions-10) var(--table-header-padding-x);font-weight:var(--body-regular-weight);color:var(--general-text-primary);text-align:left;caption-side:top}.tedi-table__head{background:var(--table-default)}.tedi-table__header-cell{padding:var(--table-header-padding-y) var(--table-header-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);color:var(--general-text-tertiary);text-align:left;white-space:nowrap;background:var(--table-default);border-bottom:1px solid var(--table-border-th)}.tedi-table__header-content{display:inline-flex;gap:var(--layout-grid-gutters-04);align-items:center}.tedi-table__filter-popover{display:inline-flex;align-items:center}.tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__body .tedi-table__row:last-child>.tedi-table__cell{border-bottom:0}.tedi-table--group-dividers-between .tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:0}.tedi-table--group-dividers-between .tedi-table__body .tedi-table__row--group-start>.tedi-table__cell{border-top:var(--tedi-borders-01) solid var(--table-border)}.tedi-table--group-dividers-none .tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:0}.tedi-table__cell{padding:var(--table-data-padding-y) var(--table-data-padding-x);vertical-align:middle;color:var(--general-text-primary);background:var(--table-default)}.tedi-table__cell--control{padding-right:var(--table-data-padding-x-sm);padding-left:var(--table-data-padding-x-sm)}.tedi-table__cell--control-fit{width:1%;white-space:nowrap}.tedi-table__cell--align-left{text-align:left}.tedi-table__cell--align-center{text-align:center}.tedi-table__cell--align-right{text-align:right}.tedi-table__cell--valign-top{vertical-align:top}.tedi-table__cell--valign-middle{vertical-align:middle}.tedi-table__cell--valign-bottom{vertical-align:bottom}.tedi-table__expand-toggle{display:flex;align-items:center}.tedi-table__expand-toggle--icon-only{min-height:var(--button-sm-icon-size)}.tedi-table__cell--placeholder{padding:var(--tedi-dimensions-14) var(--table-data-padding-x);color:var(--general-text-secondary);text-align:center}.tedi-table--small .tedi-table__header-cell{padding:var(--table-header-padding-y-sm) var(--table-header-padding-x-sm)}.tedi-table--small .tedi-table__cell{padding:var(--table-data-padding-y-sm) var(--table-data-padding-x-sm)}.tedi-table__foot{font-weight:var(--heading-weight);background:var(--table-default)}.tedi-table__cell--footer{color:var(--general-text-primary);border-top:var(--tedi-borders-01) solid var(--table-border-th)}.tedi-table__row--selected>.tedi-table__cell{background:var(--table-active)}.tedi-table__row--clickable{cursor:pointer}.tedi-table__row--clickable:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(var(--tedi-borders-02) * -1);background:transparent;border-color:transparent}.tedi-table__body .tedi-table__row--sub-component>.tedi-table__cell{background:var(--table-striped);border-bottom:0}.tedi-table__body .tedi-table__row--sub-component-open>.tedi-table__cell{border-bottom:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__row--sub-row>.tedi-table__cell{background:var(--table-striped)}.tedi-table__cell--sub-component{padding:0}.tedi-table__sub-component-wrapper{display:grid;grid-template-rows:0fr}.tedi-table__row--sub-component-open .tedi-table__sub-component-wrapper{grid-template-rows:1fr}.tedi-table__sub-component-content{min-height:0;overflow:hidden}.tedi-table__sub-component-inner{padding:var(--table-data-padding-y) var(--table-data-padding-x)}.tedi-table__row--filter{background:var(--general-surface-primary)}.tedi-table__row--filter .tedi-table__header-cell{padding-top:var(--tedi-dimensions-05);padding-bottom:var(--tedi-dimensions-05);font-weight:var(--body-regular-weight);background:var(--general-surface-primary)}.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell{background:var(--table-striped)}.tedi-table.tedi-table--row-hover .tedi-table__body .tedi-table__row:hover>.tedi-table__cell{background:var(--table-hover)}.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--active>.tedi-table__cell,.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--active:hover>.tedi-table__cell{background:var(--table-hover)}.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--picked-up>.tedi-table__cell{background:var(--table-hover)}.tedi-table--vertical-borders .tedi-table__header-cell,.tedi-table--vertical-borders .tedi-table__cell{border-right:var(--tedi-borders-01) solid var(--table-border)}.tedi-table--vertical-borders thead tr:first-child .tedi-table__header-cell:last-child,.tedi-table--vertical-borders .tedi-table__row>.tedi-table__cell:last-child{border-right:0}.tedi-table--borderless .tedi-table__scroll{background:transparent;border:0;border-radius:0}.tedi-table--has-pagination{gap:0}.tedi-table--has-pagination-bottom .tedi-table__scroll{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.tedi-table--has-pagination-top .tedi-table__scroll{border-top:0;border-top-left-radius:0;border-top-right-radius:0}.tedi-table__pagination{overflow:hidden;border:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__pagination--bottom{border-top:0;border-bottom-right-radius:var(--table-radius);border-bottom-left-radius:var(--table-radius)}.tedi-table__pagination--top{border-bottom:0;border-top-left-radius:var(--table-radius);border-top-right-radius:var(--table-radius)}.tedi-table--borderless .tedi-table__pagination{background:transparent;border:0}.tedi-table--sticky-first-column .tedi-table__header-cell.tedi-table__cell--sticky-left{position:sticky;z-index:2;background:var(--table-default)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left{position:sticky;z-index:1;background:var(--table-default)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left-edge:after{position:absolute;top:0;bottom:0;left:100%;width:var(--tedi-dimensions-03);pointer-events:none;content:\"\"}.tedi-table--sticky-first-column .tedi-table__scroll--shadow-start .tedi-table__cell--sticky-left-edge:after{background:linear-gradient(to right,var(--tedi-alpha-10),transparent)}.tedi-table--sticky-first-column .tedi-table__body .tedi-table__row--sub-row>.tedi-table__cell--sticky-left{background:var(--table-striped)}.tedi-table--sticky-first-column.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell--sticky-left{background:var(--table-striped)}.tedi-table--sticky-first-column .tedi-table__body .tedi-table__row--picked-up>.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column.tedi-table--striped .tedi-table__body .tedi-table__row--picked-up:nth-of-type(2n)>.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell--picked-up.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left{box-shadow:inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-start{box-shadow:inset var(--tedi-borders-02) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-start.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset var(--tedi-borders-02) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__header-cell.tedi-table__cell--sticky-right{position:sticky;z-index:2;background:var(--table-default)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right{position:sticky;z-index:1;background:var(--table-default)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right-edge:after{position:absolute;top:0;right:100%;bottom:0;width:var(--tedi-dimensions-03);pointer-events:none;content:\"\"}.tedi-table--sticky-last-column .tedi-table__scroll--shadow-end .tedi-table__cell--sticky-right-edge:after{background:linear-gradient(to left,var(--tedi-alpha-10),transparent)}.tedi-table--sticky-last-column .tedi-table__body .tedi-table__row--sub-row>.tedi-table__cell--sticky-right{background:var(--table-striped)}.tedi-table--sticky-last-column.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell--sticky-right{background:var(--table-striped)}.tedi-table--sticky-last-column .tedi-table__body .tedi-table__row--picked-up>.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column.tedi-table--striped .tedi-table__body .tedi-table__row--picked-up:nth-of-type(2n)>.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell--picked-up.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right{box-shadow:inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-start{box-shadow:inset calc(var(--tedi-borders-02) * -1) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-start.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset calc(var(--tedi-borders-02) * -1) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-header .tedi-table__head{border-bottom:0}.tedi-table--sticky-header .tedi-table__head .tedi-table__row{position:sticky;top:0;z-index:2;background:var(--table-default)}.tedi-table--sticky-header .tedi-table__head .tedi-table__header-cell{position:sticky;top:0;z-index:2;background:var(--table-default);border-bottom:0;box-shadow:inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-left{z-index:3}.tedi-table--sticky-header.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-right{z-index:3}.tedi-table--sticky-header.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header .tedi-table__scroll--shadow-header .tedi-table__head .tedi-table__row:after{position:absolute;top:100%;right:0;left:0;height:var(--tedi-dimensions-03);pointer-events:none;content:\"\";background:linear-gradient(to bottom,var(--tedi-alpha-10),transparent)}.tedi-table--fixed-layout .tedi-table__table{table-layout:fixed}.tedi-table__drag-handle{display:inline-flex;align-items:center;justify-content:center;padding:2px;color:var(--general-text-tertiary);cursor:grab;background:transparent;border:0;border-radius:var(--button-radius-sm)}.tedi-table__drag-handle:hover{color:var(--general-text-primary);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-table__drag-handle:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:0}.tedi-table__drag-handle.cdk-drag-disabled{color:var(--general-text-disabled);cursor:not-allowed}.tedi-table__drag-handle--picked-up{color:var(--tedi-primary-500);cursor:grabbing}.cdk-drag-preview .tedi-table__drag-handle,.cdk-drop-list-dragging .tedi-table__drag-handle{cursor:grabbing}.cdk-drag-preview.tedi-table__row,.cdk-drag-preview.tedi-table__header-cell{display:table;cursor:grabbing;background:var(--table-hover);border:var(--tedi-borders-01) solid var(--card-border-primary);border-radius:var(--table-radius);box-shadow:0 6px 16px var(--tedi-alpha-20)}.cdk-drag-preview.tedi-table__row>.tedi-table__cell{background:var(--table-hover)}.cdk-drag-placeholder.tedi-table__row,.cdk-drag-placeholder.tedi-table__header-cell{opacity:.3}.cdk-drop-list-dragging .tedi-table__row:not(.cdk-drag-placeholder),.cdk-drop-list-dragging .tedi-table__header-cell:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.tedi-table__filter{display:flex;flex-direction:column;gap:var(--tedi-dimensions-12);width:100%}.tedi-table__filter-actions{display:flex;gap:var(--button-gutter-x-sm)}.tedi-table__filter-actions>*{flex:1 1 0;justify-content:center}.tedi-table .tedi-table__head .tedi-table__header-cell--picked-up{cursor:grabbing;background:var(--table-hover)}.tedi-table__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}\n"] }]
+                    ], template: "<ng-content select=\"tedi-table-toolbar\" />\n<ng-content select=\"tedi-table-columns-menu\" />\n\n<!-- Live region for screen-reader announcements during keyboard reordering -->\n@if (reorderableColumns() || reorderableRows()) {\n  <div\n    [id]=\"liveRegionId\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n    class=\"sr-only\"\n  ></div>\n}\n\n@if (resolvedTopSlot(); as top) {\n  <div class=\"tedi-table__pagination tedi-table__pagination--top\">\n    <tedi-pagination\n      [pageCount]=\"paginationPageCount()\"\n      [page]=\"paginationPage()\"\n      [totalItems]=\"paginationTotalItems()\"\n      [pageSize]=\"paginationPageSize()\"\n      [pageSizeOptions]=\"paginationPageSizeOptions()\"\n      [boundaryCount]=\"top.boundaryCount\"\n      [siblingCount]=\"top.siblingCount\"\n      [labels]=\"top.labels\"\n      [background]=\"top.background\"\n      [align]=\"top.align\"\n      [dividerPosition]=\"top.dividerPosition\"\n      [hideResults]=\"top.hideResults\"\n      [hidePageSize]=\"top.hidePageSize\"\n      [hidePager]=\"top.hidePager\"\n      [hideArrows]=\"top.hideArrows\"\n      [disableArrowsAtBoundary]=\"top.disableArrowsAtBoundary\"\n      [arrowVariant]=\"top.arrowVariant\"\n      [showArrowLabels]=\"top.showArrowLabels\"\n      [previousIcon]=\"top.previousIcon\"\n      [nextIcon]=\"top.nextIcon\"\n      [showModalTitle]=\"top.showModalTitle\"\n      [xs]=\"top.xs\"\n      [sm]=\"top.sm\"\n      [md]=\"top.md\"\n      [lg]=\"top.lg\"\n      [xl]=\"top.xl\"\n      [xxl]=\"top.xxl\"\n      (pageChange)=\"handlePaginationPageChange($event)\"\n      (pageSizeChange)=\"handlePaginationPageSizeChange($event)\"\n    >\n      @if (topResultsTemplate(); as tpl) {\n        <span tediPaginationResults>\n          <ng-container *ngTemplateOutlet=\"tpl\" />\n        </span>\n      }\n    </tedi-pagination>\n  </div>\n}\n\n<div\n  #scrollContainer\n  class=\"tedi-table__scroll\"\n  [class.tedi-table__scroll--shadow-start]=\"hasStartShadow()\"\n  [class.tedi-table__scroll--shadow-end]=\"hasEndShadow()\"\n  [class.tedi-table__scroll--shadow-header]=\"hasHeaderShadow()\"\n  [attr.style]=\"maxHeightStyle()\"\n  cdkScrollable\n  tabindex=\"0\"\n  role=\"group\"\n  [attr.aria-label]=\"scrollRegionLabel()\"\n  (scroll)=\"onHorizontalScroll()\"\n>\n  <table\n    #tableElement\n    class=\"tedi-table__table\"\n    [attr.id]=\"id() || null\"\n    [attr.aria-label]=\"ariaLabel() || null\"\n    [attr.aria-labelledby]=\"ariaLabelledby() || null\"\n    [attr.aria-rowcount]=\"ariaRowCount()\"\n    [attr.aria-colcount]=\"leafColumnCount() > 0 ? leafColumnCount() : null\"\n  >\n    @if (caption(); as cap) {\n      <caption class=\"tedi-table__caption\">\n        @if (isString(cap)) {\n          {{ cap }}\n        } @else {\n          <ng-container *ngTemplateOutlet=\"$any(cap)\" />\n        }\n      </caption>\n    }\n\n    <thead class=\"tedi-table__head\">\n      @for (\n        headerGroup of headerGroups();\n        track headerGroup.id;\n        let rowIndex = $index\n      ) {\n        <tr\n          class=\"tedi-table__row\"\n          [attr.aria-rowindex]=\"ariaRowIndexingEnabled() ? rowIndex + 1 : null\"\n          [cdkDropListDisabled]=\"!reorderableColumns() || rowIndex > 0\"\n          cdkDropList\n          cdkDropListOrientation=\"horizontal\"\n          cdkDropListAutoScrollDisabled\n          (cdkDropListDropped)=\"handleColumnDrop($event)\"\n        >\n          @for (header of headerGroup.headers; track header.id) {\n            @if (shouldRenderHeader(header, rowIndex)) {\n              @let meta = getColumnMeta(header.column);\n              @let ariaSort = getHeaderAriaSort(header.column);\n              @let srHeaderLabel = getSrOnlyHeaderLabel(header.column);\n              @let rowSpan = getHeaderRowSpan(header, rowIndex);\n              @let headerAlign = meta?.headerAlign ?? meta?.align;\n              <th\n                scope=\"col\"\n                cdkDrag\n                [cdkDragDisabled]=\"\n                  !reorderableColumns() ||\n                  rowIndex > 0 ||\n                  header.column.id === SELECT_COLUMN_ID ||\n                  header.column.id === EXPAND_COLUMN_ID\n                \"\n                cdkDragLockAxis=\"x\"\n                (keydown)=\"handleHeaderKeydown($event, header)\"\n                [class]=\"\n                  'tedi-table__header-cell' +\n                  (isHeaderGroup(header)\n                    ? ' tedi-table__header-cell--group'\n                    : '') +\n                  (headerAlign\n                    ? ' tedi-table__cell--align-' + headerAlign\n                    : '') +\n                  (meta?.vAlign\n                    ? ' tedi-table__cell--valign-' + meta?.vAlign\n                    : '') +\n                  (pickedUpColumnId() === header.column.id\n                    ? ' tedi-table__header-cell--picked-up'\n                    : '') +\n                  controlCellClass(header.column.id) +\n                  stickyLeftClass(header.column.id) +\n                  stickyRightClass(header.column.id)\n                \"\n                [attr.colspan]=\"header.colSpan > 1 ? header.colSpan : null\"\n                [attr.rowspan]=\"rowSpan\"\n                [attr.aria-sort]=\"ariaSort\"\n                [style.width.px]=\"headerCellWidth(header.column)\"\n                [style.min-width.px]=\"columnMinWidth(header.column)\"\n                [style.max-width.px]=\"columnMaxWidth(header.column)\"\n                [style.left.px]=\"stickyLeft(header.column.id)\"\n                [style.right.px]=\"stickyRight(header.column.id)\"\n              >\n                @if (srHeaderLabel) {\n                  <span class=\"sr-only\">{{ srHeaderLabel }}</span>\n                }\n                @if (header.column.id === SELECT_COLUMN_ID) {\n                  @if (selectionMode() === \"multiple\") {\n                    <input\n                      tedi-checkbox\n                      type=\"checkbox\"\n                      [id]=\"resolvedId() + '-select-all'\"\n                      [name]=\"resolvedId() + '-select-all'\"\n                      [attr.aria-label]=\"selectAllLabel()\"\n                      [checked]=\"isAllPageRowsSelected()\"\n                      [indeterminate]=\"\n                        isSomePageRowsSelected() && !isAllPageRowsSelected()\n                      \"\n                      (change)=\"handleSelectAll($any($event.target).checked)\"\n                    />\n                  }\n                } @else if (header.column.id === EXPAND_COLUMN_ID) {\n                  <!-- empty -->\n                } @else if (header.column.id === DRAG_COLUMN_ID) {\n                  <!-- empty -->\n                } @else {\n                  <span class=\"tedi-table__header-content\">\n                    @if (\n                      reorderableColumns() &&\n                      rowIndex === 0 &&\n                      !isHeaderGroup(header)\n                    ) {\n                      <button\n                        type=\"button\"\n                        cdkDragHandle\n                        class=\"tedi-table__drag-handle\"\n                        [class.tedi-table__drag-handle--picked-up]=\"\n                          pickedUpColumnId() === header.column.id\n                        \"\n                        [id]=\"reorderHandleId(header.column.id)\"\n                        [attr.aria-label]=\"dragColumnLabel()\"\n                        [attr.aria-pressed]=\"\n                          reorderableColumns()\n                            ? pickedUpColumnId() === header.column.id\n                            : null\n                        \"\n                      >\n                        <tedi-icon\n                          name=\"drag_indicator\"\n                          [size]=\"18\"\n                          color=\"inherit\"\n                        />\n                      </button>\n                    }\n                    <ng-container\n                      *flexRender=\"\n                        header.column.columnDef.header;\n                        props: header.getContext();\n                        let content\n                      \"\n                    >\n                      @if (shouldRenderSortableHeader(header.column, content)) {\n                        <button\n                          tedi-table-header-button\n                          [icon]=\"sortIcon(header.column)\"\n                          [selected]=\"!!header.column.getIsSorted()\"\n                          (click)=\"handleSortToggle(header.column)\"\n                        >\n                          {{ content }}\n                        </button>\n                      } @else if (isString(content) || isNumber(content)) {\n                        {{ content }}\n                      } @else {\n                        {{ content }}\n                      }\n                    </ng-container>\n                    @if (shouldRenderFilterButton(header.column)) {\n                      @if (filterUsesModal()) {\n                        <button\n                          tedi-table-header-button\n                          icon=\"filter_alt\"\n                          [selected]=\"filterIsActive(header.column)\"\n                          [filled]=\"filterIsActive(header.column)\"\n                          [aria-label]=\"filterAriaLabel(header.column)\"\n                          (click)=\"openFilterModal(header.column)\"\n                        ></button>\n                      } @else {\n                        <tedi-popover\n                          #filterPopover\n                          class=\"tedi-table__filter-popover\"\n                          position=\"bottom-end\"\n                          [preventOverflow]=\"true\"\n                        >\n                          <button\n                            tedi-popover-trigger\n                            tedi-table-header-button\n                            icon=\"filter_alt\"\n                            [selected]=\"filterIsActive(header.column)\"\n                            [filled]=\"filterIsActive(header.column)\"\n                            [aria-label]=\"filterAriaLabel(header.column)\"\n                            (click)=\"handleFilterTriggerClick(header.column)\"\n                          ></button>\n                          <tedi-popover-content\n                            [maxWidth]=\"filterPopoverWidthFor(header.column)\"\n                          >\n                            <div class=\"tedi-table__filter\">\n                              <div class=\"tedi-table__filter-body\">\n                                @if (filterTemplateFor(header.column); as tpl) {\n                                  <ng-container\n                                    *ngTemplateOutlet=\"\n                                      tpl;\n                                      context: filterContextFor(\n                                        header.column,\n                                        filterPopover\n                                      )\n                                    \"\n                                  />\n                                }\n                              </div>\n                              <div class=\"tedi-table__filter-actions\">\n                                <button\n                                  tedi-button\n                                  variant=\"secondary\"\n                                  size=\"small\"\n                                  type=\"button\"\n                                  (click)=\"\n                                    handleFilterClear(\n                                      header.column,\n                                      filterPopover\n                                    )\n                                  \"\n                                >\n                                  {{ filterClearLabel() }}\n                                </button>\n                                <button\n                                  tedi-button\n                                  variant=\"primary\"\n                                  size=\"small\"\n                                  type=\"button\"\n                                  (click)=\"\n                                    handleFilterApply(\n                                      header.column,\n                                      filterPopover\n                                    )\n                                  \"\n                                >\n                                  {{ filterApplyLabel() }}\n                                </button>\n                              </div>\n                            </div>\n                          </tedi-popover-content>\n                        </tedi-popover>\n                      }\n                    }\n                  </span>\n                }\n              </th>\n            }\n          }\n        </tr>\n      }\n      @if (enableColumnFilters()) {\n        <tr\n          class=\"tedi-table__row tedi-table__row--filter\"\n          [attr.aria-rowindex]=\"\n            ariaRowIndexingEnabled() ? headerGroups().length + 1 : null\n          \"\n        >\n          @for (column of leafColumns(); track column.id) {\n            @let filterId = resolvedId() + \"-filter-\" + column.id;\n            <th class=\"tedi-table__header-cell\" scope=\"col\">\n              @if (column.getCanFilter()) {\n                <tedi-form-field size=\"small\">\n                  <input\n                    tedi-text-field\n                    type=\"text\"\n                    [id]=\"filterId\"\n                    [name]=\"filterId\"\n                    [attr.aria-label]=\"filterLabel(column)\"\n                    [placeholder]=\"filterPlaceholder()\"\n                    [value]=\"getFilterValue(column)\"\n                    (input)=\"\n                      handleColumnFilter(column, $any($event.target).value)\n                    \"\n                    (clear)=\"handleColumnFilter(column, '')\"\n                  />\n                </tedi-form-field>\n              }\n            </th>\n          }\n        </tr>\n      }\n    </thead>\n\n    <tbody\n      class=\"tedi-table__body\"\n      cdkDropList\n      [cdkDropListDisabled]=\"!reorderableRows()\"\n      (cdkDropListDropped)=\"handleRowDrop($any($event))\"\n    >\n      @if (rows().length === 0) {\n        <tr class=\"tedi-table__row\">\n          <td\n            class=\"tedi-table__cell tedi-table__cell--placeholder\"\n            [attr.colspan]=\"leafColumnCount() > 0 ? leafColumnCount() : 1\"\n          >\n            @if (placeholder(); as pl) {\n              @if (placeholderRole()) {\n                <div [attr.role]=\"placeholderRole()\">\n                  @if (isString(pl)) {\n                    {{ pl }}\n                  } @else {\n                    <ng-container *ngTemplateOutlet=\"$any(pl)\" />\n                  }\n                </div>\n              } @else {\n                @if (isString(pl)) {\n                  {{ pl }}\n                } @else {\n                  <ng-container *ngTemplateOutlet=\"$any(pl)\" />\n                }\n              }\n            } @else {\n              @if (placeholderRole()) {\n                <div [attr.role]=\"placeholderRole()\">\n                  {{ placeholderLabel() }}\n                </div>\n              } @else {\n                {{ placeholderLabel() }}\n              }\n            }\n          </td>\n        </tr>\n      } @else {\n        @for (row of rows(); track row.id) {\n          @let isActiveRow =\n            activeRowId() !== undefined && row.id === activeRowId();\n          @let ariaRowIndex = rowAriaIndexById().get(row.id) ?? null;\n          @let subRowId = resolvedId() + \"-sub-\" + row.id;\n          @let expandsOnClick = rowExpandsOnClick(row);\n          <tr\n            cdkDrag\n            [cdkDragDisabled]=\"!reorderableRows()\"\n            cdkDragLockAxis=\"y\"\n            [class]=\"\n              'tedi-table__row' +\n              (this.selectedRowHighlight() && row.getIsSelected()\n                ? ' tedi-table__row--selected'\n                : '') +\n              (isActiveRow ? ' tedi-table__row--active' : '') +\n              (interactive() || expandsOnClick\n                ? ' tedi-table__row--clickable'\n                : '') +\n              (row.depth > 0 ? ' tedi-table__row--sub-row' : '') +\n              (groupStartRowIds().has(row.id)\n                ? ' tedi-table__row--group-start'\n                : '') +\n              (pickedUpRow() === row.original\n                ? ' tedi-table__row--picked-up'\n                : '')\n            \"\n            [attr.role]=\"\n              interactive() && !rowHasNestedInteractive(row) ? 'button' : null\n            \"\n            [attr.tabindex]=\"interactive() ? 0 : null\"\n            [attr.aria-label]=\"rowAriaLabelFor(row)\"\n            [attr.aria-rowindex]=\"ariaRowIndex\"\n            [attr.aria-current]=\"isActiveRow ? 'true' : null\"\n            (click)=\"\n              (interactive() || expandsOnClick) && handleRowClick($event, row)\n            \"\n            (keydown)=\"handleRowKeydown($event, row)\"\n            (mouseenter)=\"handleRowMouseEnter(row)\"\n            (mouseleave)=\"handleRowMouseLeave()\"\n          >\n            @for (cell of row.getVisibleCells(); track cell.id) {\n              @let cellMeta = getColumnMeta(cell.column);\n              @let cellContext = cell.getContext();\n              @let resolvedSpan = resolveRowSpan(cell, cellContext);\n              @if (resolvedSpan !== 0) {\n                <td\n                  [class]=\"\n                    'tedi-table__cell' +\n                    (cellMeta?.align\n                      ? ' tedi-table__cell--align-' + cellMeta?.align\n                      : '') +\n                    (cellMeta?.vAlign\n                      ? ' tedi-table__cell--valign-' + cellMeta?.vAlign\n                      : '') +\n                    controlCellClass(cell.column.id) +\n                    stickyLeftClass(cell.column.id) +\n                    stickyRightClass(cell.column.id)\n                  \"\n                  [style.left.px]=\"stickyLeft(cell.column.id)\"\n                  [style.right.px]=\"stickyRight(cell.column.id)\"\n                  [attr.rowspan]=\"\n                    resolvedSpan !== null && resolvedSpan > 1\n                      ? resolvedSpan\n                      : null\n                  \"\n                >\n                  @if (cell.column.id === DRAG_COLUMN_ID) {\n                    <button\n                      type=\"button\"\n                      cdkDragHandle\n                      class=\"tedi-table__drag-handle\"\n                      [class.tedi-table__drag-handle--picked-up]=\"\n                        pickedUpRow() === row.original\n                      \"\n                      [id]=\"rowReorderHandleId(row.id)\"\n                      [attr.aria-label]=\"dragRowLabel()\"\n                      [attr.aria-pressed]=\"\n                        reorderableRows()\n                          ? pickedUpRow() === row.original\n                          : null\n                      \"\n                      (click)=\"$event.stopPropagation()\"\n                      (keydown)=\"handleRowReorderKeydown($event, row)\"\n                    >\n                      <tedi-icon\n                        name=\"drag_indicator\"\n                        [size]=\"18\"\n                        color=\"inherit\"\n                      />\n                    </button>\n                  } @else if (cell.column.id === SELECT_COLUMN_ID) {\n                    @if (selectionMode() === \"multiple\") {\n                      <input\n                        tedi-checkbox\n                        type=\"checkbox\"\n                        [id]=\"resolvedId() + '-select-' + row.id\"\n                        [name]=\"resolvedId() + '-select-' + row.id\"\n                        [attr.aria-label]=\"selectRowLabel(row)\"\n                        [checked]=\"isRowSelected(row)\"\n                        [disabled]=\"!row.getCanSelect()\"\n                        [indeterminate]=\"isRowIndeterminate(row)\"\n                        (change)=\"\n                          handleSelectRow(row, $any($event.target).checked)\n                        \"\n                        (click)=\"$event.stopPropagation()\"\n                      />\n                    } @else {\n                      <input\n                        tedi-radio\n                        type=\"radio\"\n                        [id]=\"resolvedId() + '-select-' + row.id\"\n                        [name]=\"resolvedId() + '-select-row'\"\n                        [attr.aria-label]=\"selectRowLabel(row)\"\n                        [checked]=\"row.getIsSelected()\"\n                        [disabled]=\"!row.getCanSelect()\"\n                        (change)=\"\n                          handleSelectRow(row, $any($event.target).checked)\n                        \"\n                        (click)=\"$event.stopPropagation()\"\n                      />\n                    }\n                  } @else if (cell.column.id === EXPAND_COLUMN_ID) {\n                    <span\n                      class=\"tedi-table__expand-toggle\"\n                      [class.tedi-table__expand-toggle--icon-only]=\"\n                        !expandButtonHasLabel()\n                      \"\n                    >\n                      @if (row.getCanExpand()) {\n                        @let expandOpen = row.getIsExpanded();\n                        <button\n                          tedi-collapse-button\n                          [arrowType]=\"resolvedExpandVariant()\"\n                          [hideText]=\"!expandButtonHasLabel()\"\n                          [openText]=\"expandButtonOpenText()\"\n                          [closeText]=\"expandButtonCloseText()\"\n                          [open]=\"expandOpen\"\n                          [id]=\"resolvedId() + '-expand-' + row.id\"\n                          [ariaControls]=\"\n                            renderSubComponent() ? subRowId : undefined\n                          \"\n                          [ariaLabel]=\"\n                            expandButtonHasLabel()\n                              ? undefined\n                              : expandRowLabel(expandOpen)\n                          \"\n                          (openChange)=\"handleExpandToggle(row)\"\n                          (click)=\"$event.stopPropagation()\"\n                          (keydown)=\"handleExpandKeydown($event)\"\n                        ></button>\n                      }\n                    </span>\n                  } @else {\n                    <ng-container\n                      *flexRender=\"\n                        cell.column.columnDef.cell;\n                        props: cellContext;\n                        let content\n                      \"\n                    >\n                      {{ content }}\n                    </ng-container>\n                  }\n                </td>\n              }\n            }\n          </tr>\n          @if (renderSubComponent(); as subTpl) {\n            @if (row.getCanExpand()) {\n              @let isExpanded = row.getIsExpanded();\n              <tr\n                [class]=\"\n                  'tedi-table__row tedi-table__row--sub-component' +\n                  (isExpanded ? ' tedi-table__row--sub-component-open' : '')\n                \"\n              >\n                <td\n                  class=\"tedi-table__cell tedi-table__cell--sub-component\"\n                  [attr.id]=\"subRowId\"\n                  [attr.role]=\"isExpanded ? 'region' : null\"\n                  [attr.aria-label]=\"isExpanded ? rowDetailsLabel() : null\"\n                  [attr.inert]=\"isExpanded ? null : ''\"\n                  [attr.colspan]=\"leafColumnCount() > 0 ? leafColumnCount() : 1\"\n                >\n                  <div class=\"tedi-table__sub-component-wrapper\">\n                    <div class=\"tedi-table__sub-component-content\">\n                      <div class=\"tedi-table__sub-component-inner\">\n                        <ng-container\n                          *ngTemplateOutlet=\"\n                            subTpl;\n                            context: { $implicit: row }\n                          \"\n                        />\n                      </div>\n                    </div>\n                  </div>\n                </td>\n              </tr>\n            }\n          }\n        }\n      }\n    </tbody>\n\n    @if (hasFooter()) {\n      <tfoot class=\"tedi-table__foot\">\n        @for (group of footerGroups(); track group.id) {\n          <tr class=\"tedi-table__row\">\n            @for (header of group.headers; track header.id) {\n              @let footerMeta = getColumnMeta(header.column);\n              <td\n                [class]=\"\n                  'tedi-table__cell tedi-table__cell--footer' +\n                  (footerMeta?.align\n                    ? ' tedi-table__cell--align-' + footerMeta?.align\n                    : '') +\n                  (footerMeta?.vAlign\n                    ? ' tedi-table__cell--valign-' + footerMeta?.vAlign\n                    : '')\n                \"\n                [attr.colspan]=\"header.colSpan > 1 ? header.colSpan : null\"\n              >\n                @if (!header.isPlaceholder) {\n                  <ng-container\n                    *flexRender=\"\n                      header.column.columnDef.footer;\n                      props: header.getContext();\n                      let content\n                    \"\n                  >\n                    {{ content }}\n                  </ng-container>\n                }\n              </td>\n            }\n          </tr>\n        }\n      </tfoot>\n    }\n  </table>\n</div>\n\n@if (resolvedBottomSlot(); as bottom) {\n  <div class=\"tedi-table__pagination tedi-table__pagination--bottom\">\n    <tedi-pagination\n      [pageCount]=\"paginationPageCount()\"\n      [page]=\"paginationPage()\"\n      [totalItems]=\"paginationTotalItems()\"\n      [pageSize]=\"paginationPageSize()\"\n      [pageSizeOptions]=\"paginationPageSizeOptions()\"\n      [boundaryCount]=\"bottom.boundaryCount\"\n      [siblingCount]=\"bottom.siblingCount\"\n      [labels]=\"bottom.labels\"\n      [background]=\"bottom.background\"\n      [align]=\"bottom.align\"\n      [dividerPosition]=\"bottom.dividerPosition\"\n      [hideResults]=\"bottom.hideResults\"\n      [hidePageSize]=\"bottom.hidePageSize\"\n      [hidePager]=\"bottom.hidePager\"\n      [hideArrows]=\"bottom.hideArrows\"\n      [disableArrowsAtBoundary]=\"bottom.disableArrowsAtBoundary\"\n      [arrowVariant]=\"bottom.arrowVariant\"\n      [showArrowLabels]=\"bottom.showArrowLabels\"\n      [previousIcon]=\"bottom.previousIcon\"\n      [nextIcon]=\"bottom.nextIcon\"\n      [showModalTitle]=\"bottom.showModalTitle\"\n      [xs]=\"bottom.xs\"\n      [sm]=\"bottom.sm\"\n      [md]=\"bottom.md\"\n      [lg]=\"bottom.lg\"\n      [xl]=\"bottom.xl\"\n      [xxl]=\"bottom.xxl\"\n      (pageChange)=\"handlePaginationPageChange($event)\"\n      (pageSizeChange)=\"handlePaginationPageSizeChange($event)\"\n    >\n      @if (bottomResultsTemplate(); as tpl) {\n        <span tediPaginationResults>\n          <ng-container *ngTemplateOutlet=\"tpl\" />\n        </span>\n      }\n    </tedi-pagination>\n  </div>\n}\n", styles: [".tedi-table{display:flex;flex-direction:column;gap:var(--tedi-dimensions-10);width:100%}.tedi-table__scroll{overflow-x:auto;background:var(--table-default);border:var(--tedi-borders-01) solid var(--table-border);border-radius:var(--table-radius)}.tedi-table__table{width:100%;font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--general-text-primary);border-spacing:0;border-collapse:collapse;background:var(--table-default)}.tedi-table__caption{padding:var(--tedi-dimensions-10) var(--table-header-padding-x);font-weight:var(--body-regular-weight);color:var(--general-text-primary);text-align:left;caption-side:top}.tedi-table__head{background:var(--table-default)}.tedi-table__header-cell{padding:var(--table-header-padding-y) var(--table-header-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);color:var(--general-text-tertiary);text-align:left;white-space:nowrap;background:var(--table-default);border-bottom:1px solid var(--table-border-th)}.tedi-table__header-content{display:inline-flex;gap:var(--layout-grid-gutters-04);align-items:center}.tedi-table__filter-popover{display:inline-flex;align-items:center}.tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__body .tedi-table__row:last-child>.tedi-table__cell{border-bottom:0}.tedi-table--group-dividers-between .tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:0}.tedi-table--group-dividers-between .tedi-table__body .tedi-table__row--group-start>.tedi-table__cell{border-top:var(--tedi-borders-01) solid var(--table-border)}.tedi-table--group-dividers-none .tedi-table__body .tedi-table__row>.tedi-table__cell{border-bottom:0}.tedi-table__cell{padding:var(--table-data-padding-y) var(--table-data-padding-x);vertical-align:middle;color:var(--general-text-primary);background:var(--table-default)}.tedi-table__cell--control{padding-right:var(--table-data-padding-x-sm);padding-left:var(--table-data-padding-x-sm)}.tedi-table__cell--control-fit{width:1%;white-space:nowrap}.tedi-table__cell--align-left{text-align:left}.tedi-table__cell--align-center{text-align:center}.tedi-table__cell--align-right{text-align:right}.tedi-table__cell--valign-top{vertical-align:top}.tedi-table__cell--valign-middle{vertical-align:middle}.tedi-table__cell--valign-bottom{vertical-align:bottom}.tedi-table__expand-toggle{display:flex;align-items:center}.tedi-table__expand-toggle--icon-only{min-height:var(--button-sm-icon-size)}.tedi-table__cell--placeholder{padding:var(--tedi-dimensions-14) var(--table-data-padding-x);color:var(--general-text-secondary);text-align:center}.tedi-table--small .tedi-table__header-cell{padding:var(--table-header-padding-y-sm) var(--table-header-padding-x-sm)}.tedi-table--small .tedi-table__cell{padding:var(--table-data-padding-y-sm) var(--table-data-padding-x-sm)}.tedi-table__foot{font-weight:var(--heading-weight);background:var(--table-default)}.tedi-table__cell--footer{color:var(--general-text-primary);border-top:var(--tedi-borders-01) solid var(--table-border-th)}.tedi-table__row--selected>.tedi-table__cell{background:var(--table-active)}.tedi-table__row--clickable{cursor:pointer}.tedi-table__row--clickable:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(var(--tedi-borders-02) * -1);background:transparent;border-color:transparent}.tedi-table__body .tedi-table__row--sub-component>.tedi-table__cell{background:var(--table-striped);border-bottom:0}.tedi-table__body .tedi-table__row--sub-component-open>.tedi-table__cell{border-bottom:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__row--sub-row>.tedi-table__cell{background:var(--table-striped)}.tedi-table__cell--sub-component{padding:0}.tedi-table__sub-component-wrapper{display:grid;grid-template-rows:0fr}.tedi-table__row--sub-component-open .tedi-table__sub-component-wrapper{grid-template-rows:1fr}.tedi-table__sub-component-content{min-height:0;overflow:hidden}.tedi-table__sub-component-inner{padding:var(--table-data-padding-y) var(--table-data-padding-x)}.tedi-table__row--filter{background:var(--general-surface-primary)}.tedi-table__row--filter .tedi-table__header-cell{padding-top:var(--tedi-dimensions-05);padding-bottom:var(--tedi-dimensions-05);font-weight:var(--body-regular-weight);background:var(--general-surface-primary)}.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell{background:var(--table-striped)}.tedi-table.tedi-table--row-hover .tedi-table__body .tedi-table__row:hover>.tedi-table__cell{background:var(--table-hover)}.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--active>.tedi-table__cell,.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--active:hover>.tedi-table__cell{background:var(--table-hover)}.tedi-table .tedi-table__body .tedi-table__row.tedi-table__row--picked-up>.tedi-table__cell{background:var(--table-hover)}.tedi-table--vertical-borders .tedi-table__header-cell,.tedi-table--vertical-borders .tedi-table__cell{border-right:var(--tedi-borders-01) solid var(--table-border)}.tedi-table--vertical-borders thead tr:first-child .tedi-table__header-cell:last-child,.tedi-table--vertical-borders .tedi-table__row>.tedi-table__cell:last-child{border-right:0}.tedi-table--borderless .tedi-table__scroll{background:transparent;border:0;border-radius:0}.tedi-table--has-pagination{gap:0}.tedi-table--has-pagination-bottom .tedi-table__scroll{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.tedi-table--has-pagination-top .tedi-table__scroll{border-top:0;border-top-left-radius:0;border-top-right-radius:0}.tedi-table__pagination{overflow:hidden;border:var(--tedi-borders-01) solid var(--table-border)}.tedi-table__pagination--bottom{border-top:0;border-bottom-right-radius:var(--table-radius);border-bottom-left-radius:var(--table-radius)}.tedi-table__pagination--top{border-bottom:0;border-top-left-radius:var(--table-radius);border-top-right-radius:var(--table-radius)}.tedi-table--borderless .tedi-table__pagination{background:transparent;border:0}.tedi-table--sticky-first-column .tedi-table__header-cell.tedi-table__cell--sticky-left{position:sticky;z-index:2;background:var(--table-default)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left{position:sticky;z-index:1;background:var(--table-default)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border)}.tedi-table--sticky-first-column .tedi-table__cell--sticky-left-edge:after{position:absolute;top:0;bottom:0;left:100%;width:var(--tedi-dimensions-03);pointer-events:none;content:\"\"}.tedi-table--sticky-first-column .tedi-table__scroll--shadow-start .tedi-table__cell--sticky-left-edge:after{background:linear-gradient(to right,var(--tedi-alpha-10),transparent)}.tedi-table--sticky-first-column .tedi-table__body .tedi-table__row--sub-row>.tedi-table__cell--sticky-left{background:var(--table-striped)}.tedi-table--sticky-first-column.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell--sticky-left{background:var(--table-striped)}.tedi-table--sticky-first-column .tedi-table__body .tedi-table__row--picked-up>.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column.tedi-table--striped .tedi-table__body .tedi-table__row--picked-up:nth-of-type(2n)>.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell--picked-up.tedi-table__cell--sticky-left{background:var(--table-hover)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left{box-shadow:inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-start{box-shadow:inset var(--tedi-borders-02) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-first-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-left-start.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset var(--tedi-borders-02) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__header-cell.tedi-table__cell--sticky-right{position:sticky;z-index:2;background:var(--table-default)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right{position:sticky;z-index:1;background:var(--table-default)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border)}.tedi-table--sticky-last-column .tedi-table__cell--sticky-right-edge:after{position:absolute;top:0;right:100%;bottom:0;width:var(--tedi-dimensions-03);pointer-events:none;content:\"\"}.tedi-table--sticky-last-column .tedi-table__scroll--shadow-end .tedi-table__cell--sticky-right-edge:after{background:linear-gradient(to left,var(--tedi-alpha-10),transparent)}.tedi-table--sticky-last-column .tedi-table__body .tedi-table__row--sub-row>.tedi-table__cell--sticky-right{background:var(--table-striped)}.tedi-table--sticky-last-column.tedi-table--striped .tedi-table__body .tedi-table__row:nth-of-type(2n)>.tedi-table__cell--sticky-right{background:var(--table-striped)}.tedi-table--sticky-last-column .tedi-table__body .tedi-table__row--picked-up>.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column.tedi-table--striped .tedi-table__body .tedi-table__row--picked-up:nth-of-type(2n)>.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell--picked-up.tedi-table__cell--sticky-right{background:var(--table-hover)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right{box-shadow:inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-start{box-shadow:inset calc(var(--tedi-borders-02) * -1) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-last-column .tedi-table__row--clickable:focus-visible>.tedi-table__cell--sticky-right-start.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset calc(var(--tedi-borders-02) * -1) 0 0 var(--tedi-primary-500),inset 0 var(--tedi-borders-02) 0 var(--tedi-primary-500),inset 0 calc(var(--tedi-borders-02) * -1) 0 var(--tedi-primary-500)}.tedi-table--sticky-header .tedi-table__head{border-bottom:0}.tedi-table--sticky-header .tedi-table__head .tedi-table__row{position:sticky;top:0;z-index:2;background:var(--table-default)}.tedi-table--sticky-header .tedi-table__head .tedi-table__header-cell{position:sticky;top:0;z-index:2;background:var(--table-default);border-bottom:0;box-shadow:inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-left{z-index:3}.tedi-table--sticky-header.tedi-table--sticky-first-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-left-edge{box-shadow:inset -1px 0 0 var(--table-border),inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-right{z-index:3}.tedi-table--sticky-header.tedi-table--sticky-last-column .tedi-table__head .tedi-table__header-cell.tedi-table__cell--sticky-right-edge{box-shadow:inset 1px 0 0 var(--table-border),inset 0 -1px 0 var(--table-border-th)}.tedi-table--sticky-header .tedi-table__scroll--shadow-header .tedi-table__head .tedi-table__row:after{position:absolute;top:100%;right:0;left:0;height:var(--tedi-dimensions-03);pointer-events:none;content:\"\";background:linear-gradient(to bottom,var(--tedi-alpha-10),transparent)}.tedi-table--fixed-layout .tedi-table__table{table-layout:fixed}.tedi-table__drag-handle{display:inline-flex;align-items:center;justify-content:center;padding:2px;color:var(--general-text-tertiary);cursor:grab;background:transparent;border:0;border-radius:var(--button-radius-sm)}.tedi-table__drag-handle:hover{color:var(--general-text-primary);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-table__drag-handle:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:0}.tedi-table__drag-handle.cdk-drag-disabled{color:var(--general-text-disabled);cursor:not-allowed}.tedi-table__drag-handle--picked-up{color:var(--tedi-primary-500);cursor:grabbing}.cdk-drag-preview .tedi-table__drag-handle,.cdk-drop-list-dragging .tedi-table__drag-handle{cursor:grabbing}.cdk-drag-preview.tedi-table__row,.cdk-drag-preview.tedi-table__header-cell{display:table;cursor:grabbing;background:var(--table-hover);border:var(--tedi-borders-01) solid var(--card-border-primary);border-radius:var(--table-radius);box-shadow:0 6px 16px var(--tedi-alpha-20)}.cdk-drag-preview.tedi-table__row>.tedi-table__cell{background:var(--table-hover)}.cdk-drag-placeholder.tedi-table__row,.cdk-drag-placeholder.tedi-table__header-cell{opacity:.3}.cdk-drop-list-dragging .tedi-table__row:not(.cdk-drag-placeholder),.cdk-drop-list-dragging .tedi-table__header-cell:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.tedi-table__filter{display:flex;flex-direction:column;gap:var(--tedi-dimensions-12);width:100%}.tedi-table__filter-actions{display:flex;gap:var(--button-gutter-x-sm)}.tedi-table__filter-actions>*{flex:1 1 0;justify-content:center}.tedi-table .tedi-table__head .tedi-table__header-cell--picked-up{cursor:grabbing;background:var(--table-hover)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], striped: [{ type: i0.Input, args: [{ isSignal: true, alias: "striped", required: false }] }], verticalBorders: [{ type: i0.Input, args: [{ isSignal: true, alias: "verticalBorders", required: false }] }], borderless: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderless", required: false }] }], stickyFirstColumn: [{ type: i0.Input, args: [{ isSignal: true, alias: "stickyFirstColumn", required: false }] }], stickyLastColumn: [{ type: i0.Input, args: [{ isSignal: true, alias: "stickyLastColumn", required: false }] }], stickyHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "stickyHeader", required: false }] }], fixedLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixedLayout", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], activeRowId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeRowId", required: false }] }], selectedRowHighlight: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedRowHighlight", required: false }] }], rowHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowHover", required: false }] }], enableRowSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableRowSelection", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], enableColumnFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableColumnFilters", required: false }] }], renderSubComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "renderSubComponent", required: false }] }], getRowCanExpand: [{ type: i0.Input, args: [{ isSignal: true, alias: "getRowCanExpand", required: false }] }], expandTrigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandTrigger", required: false }] }], expandButtonVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandButtonVariant", required: false }] }], expandButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandButtonLabel", required: false }] }], getSubRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "getSubRows", required: false }] }], getRowId: [{ type: i0.Input, args: [{ isSignal: true, alias: "getRowId", required: false }] }], groupRowsBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupRowsBy", required: false }] }], rowGroupDividers: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowGroupDividers", required: false }] }], controlColumnOrder: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlColumnOrder", required: false }] }], filterModalBreakpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterModalBreakpoint", required: false }] }], filterModalFullscreen: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterModalFullscreen", required: false }] }], filterPopoverWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterPopoverWidth", required: false }] }], pagination: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagination", required: false }] }], paginationTop: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginationTop", required: false }] }], manualPagination: [{ type: i0.Input, args: [{ isSignal: true, alias: "manualPagination", required: false }] }], manualSorting: [{ type: i0.Input, args: [{ isSignal: true, alias: "manualSorting", required: false }] }], manualFiltering: [{ type: i0.Input, args: [{ isSignal: true, alias: "manualFiltering", required: false }] }], pageCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageCount", required: false }] }], rowCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowCount", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], defaultState: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultState", required: false }] }], persist: [{ type: i0.Input, args: [{ isSignal: true, alias: "persist", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], placeholderRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholderRole", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], rowAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowAriaLabel", required: false }] }], reorderableRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderableRows", required: false }] }], reorderableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderableColumns", required: false }] }], stateChange: [{ type: i0.Output, args: ["stateChange"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], rowDrop: [{ type: i0.Output, args: ["rowDrop"] }], customResultsTemplateRef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TediPaginationResultsDirective), { ...{ read: TemplateRef }, isSignal: true }] }], scrollContainer: [{ type: i0.ViewChild, args: ["scrollContainer", { isSignal: true }] }], tableElement: [{ type: i0.ViewChild, args: ["tableElement", { isSignal: true }] }] } });
 class TediTableToolbarComponent {
@@ -14822,7 +14957,7 @@ class TediTableColumnsMenuComponent {
         column.toggleVisibility();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TediTableColumnsMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: TediTableColumnsMenuComponent, isStandalone: true, selector: "tedi-table-columns-menu", inputs: { triggerLabel: { classPropertyName: "triggerLabel", publicName: "triggerLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-name": "tedi-table-columns-menu" }, classAttribute: "tedi-table-columns-menu" }, ngImport: i0, template: "<tedi-dropdown position=\"bottom-end\">\n  <button tedi-button tedi-dropdown-trigger variant=\"neutral\" type=\"button\">\n    <tedi-icon name=\"tune\" [size]=\"18\" color=\"inherit\" />\n    {{ triggerLabel() ?? defaultLabel() }}\n  </button>\n  <tedi-dropdown-content>\n    @for (column of hideableColumns(); track column.id) {\n      @let isVisible = column.getIsVisible();\n      @let isLastVisible = isVisible && visibleCount() === 1;\n      <li\n        tedi-dropdown-item\n        [value]=\"column.id\"\n        [disabled]=\"isLastVisible\"\n        [closeOnSelect]=\"false\"\n        (itemSelect)=\"handleToggle(column)\"\n      >\n        <tedi-dropdown-item-value\n          type=\"checkbox\"\n          [selected]=\"isVisible\"\n          [disabled]=\"isLastVisible\"\n        >\n          <tedi-dropdown-item-value-label>\n            {{ resolveHeader(column) }}\n          </tedi-dropdown-item-value-label>\n        </tedi-dropdown-item-value>\n      </li>\n    }\n  </tedi-dropdown-content>\n</tedi-dropdown>\n", styles: [".tedi-table-columns-menu{display:inline-flex}.tedi-table-columns-menu__option{display:flex;width:100%}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: DropdownComponent, selector: "tedi-dropdown", inputs: ["value", "position", "preventOverflow", "offset", "hideOnScroll"], outputs: ["valueChange"] }, { kind: "component", type: DropdownContentComponent, selector: "tedi-dropdown-content", inputs: ["dropdownRole"] }, { kind: "component", type: DropdownItemComponent, selector: "li[tedi-dropdown-item]", inputs: ["value", "disabled", "interactiveContent", "clipContent", "closeOnSelect"], outputs: ["itemSelect"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[tedi-dropdown-trigger]", inputs: ["ariaHaspopup"] }, { kind: "component", type: DropdownItemValueComponent, selector: "tedi-dropdown-item-value", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: DropdownItemValueLabelComponent, selector: "tedi-dropdown-item-value-label", inputs: ["clipContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: TediTableColumnsMenuComponent, isStandalone: true, selector: "tedi-table-columns-menu", inputs: { triggerLabel: { classPropertyName: "triggerLabel", publicName: "triggerLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-name": "tedi-table-columns-menu" }, classAttribute: "tedi-table-columns-menu" }, ngImport: i0, template: "<tedi-dropdown position=\"bottom-end\">\n  <button tedi-button tedi-dropdown-trigger variant=\"neutral\" type=\"button\">\n    <tedi-icon name=\"tune\" [size]=\"18\" color=\"inherit\" />\n    {{ triggerLabel() ?? defaultLabel() }}\n  </button>\n  <tedi-dropdown-content>\n    @for (column of hideableColumns(); track column.id) {\n      @let isVisible = column.getIsVisible();\n      @let isLastVisible = isVisible && visibleCount() === 1;\n      <li\n        tedi-dropdown-item\n        [value]=\"column.id\"\n        [disabled]=\"isLastVisible\"\n        [closeOnSelect]=\"false\"\n        (itemSelect)=\"handleToggle(column)\"\n      >\n        <tedi-option-content\n          type=\"checkbox\"\n          [selected]=\"isVisible\"\n          [disabled]=\"isLastVisible\"\n        >\n          <tedi-option-content-label>\n            {{ resolveHeader(column) }}\n          </tedi-option-content-label>\n        </tedi-option-content>\n      </li>\n    }\n  </tedi-dropdown-content>\n</tedi-dropdown>\n", styles: [".tedi-table-columns-menu{display:inline-flex}.tedi-table-columns-menu__option{display:flex;width:100%}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: DropdownComponent, selector: "tedi-dropdown", inputs: ["value", "position", "preventOverflow", "offset", "hideOnScroll"], outputs: ["valueChange"] }, { kind: "component", type: DropdownContentComponent, selector: "tedi-dropdown-content", inputs: ["dropdownRole"] }, { kind: "component", type: DropdownItemComponent, selector: "li[tedi-dropdown-item]", inputs: ["value", "disabled", "interactiveContent", "clipContent", "closeOnSelect"], outputs: ["itemSelect"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[tedi-dropdown-trigger]", inputs: ["ariaHaspopup"] }, { kind: "component", type: OptionContentComponent, selector: "tedi-option-content", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: OptionContentLabelComponent, selector: "tedi-option-content-label", inputs: ["clipContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TediTableColumnsMenuComponent, decorators: [{
             type: Component,
@@ -14833,12 +14968,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         DropdownContentComponent,
                         DropdownItemComponent,
                         DropdownTriggerDirective,
-                        DropdownItemValueComponent,
-                        DropdownItemValueLabelComponent,
+                        OptionContentComponent,
+                        OptionContentLabelComponent,
                     ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "tedi-table-columns-menu",
                         "data-name": "tedi-table-columns-menu",
-                    }, template: "<tedi-dropdown position=\"bottom-end\">\n  <button tedi-button tedi-dropdown-trigger variant=\"neutral\" type=\"button\">\n    <tedi-icon name=\"tune\" [size]=\"18\" color=\"inherit\" />\n    {{ triggerLabel() ?? defaultLabel() }}\n  </button>\n  <tedi-dropdown-content>\n    @for (column of hideableColumns(); track column.id) {\n      @let isVisible = column.getIsVisible();\n      @let isLastVisible = isVisible && visibleCount() === 1;\n      <li\n        tedi-dropdown-item\n        [value]=\"column.id\"\n        [disabled]=\"isLastVisible\"\n        [closeOnSelect]=\"false\"\n        (itemSelect)=\"handleToggle(column)\"\n      >\n        <tedi-dropdown-item-value\n          type=\"checkbox\"\n          [selected]=\"isVisible\"\n          [disabled]=\"isLastVisible\"\n        >\n          <tedi-dropdown-item-value-label>\n            {{ resolveHeader(column) }}\n          </tedi-dropdown-item-value-label>\n        </tedi-dropdown-item-value>\n      </li>\n    }\n  </tedi-dropdown-content>\n</tedi-dropdown>\n", styles: [".tedi-table-columns-menu{display:inline-flex}.tedi-table-columns-menu__option{display:flex;width:100%}\n"] }]
+                    }, template: "<tedi-dropdown position=\"bottom-end\">\n  <button tedi-button tedi-dropdown-trigger variant=\"neutral\" type=\"button\">\n    <tedi-icon name=\"tune\" [size]=\"18\" color=\"inherit\" />\n    {{ triggerLabel() ?? defaultLabel() }}\n  </button>\n  <tedi-dropdown-content>\n    @for (column of hideableColumns(); track column.id) {\n      @let isVisible = column.getIsVisible();\n      @let isLastVisible = isVisible && visibleCount() === 1;\n      <li\n        tedi-dropdown-item\n        [value]=\"column.id\"\n        [disabled]=\"isLastVisible\"\n        [closeOnSelect]=\"false\"\n        (itemSelect)=\"handleToggle(column)\"\n      >\n        <tedi-option-content\n          type=\"checkbox\"\n          [selected]=\"isVisible\"\n          [disabled]=\"isLastVisible\"\n        >\n          <tedi-option-content-label>\n            {{ resolveHeader(column) }}\n          </tedi-option-content-label>\n        </tedi-option-content>\n      </li>\n    }\n  </tedi-dropdown-content>\n</tedi-dropdown>\n", styles: [".tedi-table-columns-menu{display:inline-flex}.tedi-table-columns-menu__option{display:flex;width:100%}\n"] }]
         }], propDecorators: { triggerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "triggerLabel", required: false }] }] } });
 class LinkComponent {
@@ -15613,7 +15748,7 @@ class FilterComponent {
                 useExisting: forwardRef(() => FilterComponent),
                 multi: true,
             },
-        ], queries: [{ propertyName: "customContent", first: true, predicate: FilterContentDirective, descendants: true, isSignal: true }, { propertyName: "filterPrepend", first: true, predicate: FilterPrependDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, isSignal: true }, { propertyName: "dropdownPanel", first: true, predicate: ["dropdownPanel"], descendants: true, isSignal: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true, isSignal: true }, { propertyName: "triggerBtn", first: true, predicate: ["triggerBtn"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (hasDropdown()) {\n  <tedi-dropdown #dropdown position=\"bottom-start\">\n    <button\n      #triggerBtn\n      tedi-dropdown-trigger\n      ariaHaspopup=\"dialog\"\n      class=\"tedi-filter__button\"\n      type=\"button\"\n      [disabled]=\"isDisabled()\"\n      (click)=\"focusDropdownContent()\"\n      (keydown.arrowDown)=\"focusDropdownContent(true)\"\n      (keydown.arrowUp)=\"focusDropdownContent(true, true)\"\n    >\n      <ng-container *ngTemplateOutlet=\"buttonContent\" />\n    </button>\n    <tedi-dropdown-content>\n      <div\n        #dropdownPanel\n        class=\"tedi-filter-dropdown\"\n        [class.tedi-filter-dropdown--custom]=\"hasCustomContent()\"\n        role=\"dialog\"\n        [attr.aria-label]=\"text()\"\n        (keydown)=\"handleDropdownKeydown($event)\"\n      >\n        @if (hasCustomContent()) {\n          <div class=\"tedi-filter-dropdown__custom-content\">\n            <ng-content select=\"[tediFilterContent]\" />\n          </div>\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"onCustomClear()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        } @else if (isSingleSelect()) {\n          @if (showSearch()) {\n            <ng-container *ngTemplateOutlet=\"searchField\" />\n          }\n\n          <div\n            #optionsList\n            class=\"tedi-filter-dropdown__options\"\n            role=\"listbox\"\n            [attr.aria-label]=\"text()\"\n            [attr.aria-activedescendant]=\"activeDescendantId()\"\n            tabindex=\"0\"\n            (focus)=\"onOptionsFocus()\"\n            (blur)=\"onOptionsBlur()\"\n            (mousedown)=\"onOptionsMousedown()\"\n            (keydown)=\"onOptionsKeydown($event)\"\n          >\n            @for (\n              option of filteredOptions();\n              track option.value;\n              let i = $index\n            ) {\n              <div\n                class=\"tedi-filter-dropdown__item\"\n                [class.tedi-filter-dropdown__item--disabled]=\"option.disabled\"\n                [class.tedi-filter-dropdown__item--focused]=\"\n                  activeOptionIndex() === i\n                \"\n                [class.tedi-filter-dropdown__item--selected]=\"\n                  isOptionSelected(option.value)\n                \"\n                role=\"option\"\n                [attr.aria-selected]=\"isOptionSelected(option.value)\"\n                [attr.aria-disabled]=\"option.disabled || null\"\n                [id]=\"getOptionId(i)\"\n                (click)=\"!option.disabled && selectOption(option.value)\"\n              >\n                <tedi-dropdown-item-value\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              </div>\n            }\n          </div>\n\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"clearSingleSelection()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        } @else {\n          @if (showSearch()) {\n            <ng-container *ngTemplateOutlet=\"searchField\" />\n          }\n\n          @if (showSelectAll() && filteredOptions().length > 0) {\n            <div\n              class=\"tedi-filter-dropdown__item tedi-filter-dropdown__item--select-all\"\n              role=\"checkbox\"\n              [attr.aria-checked]=\"\n                allFilteredSelected()\n                  ? 'true'\n                  : someFilteredSelected()\n                    ? 'mixed'\n                    : 'false'\n              \"\n              (click)=\"toggleSelectAll()\"\n              (keydown.enter)=\"toggleSelectAll()\"\n              (keydown.space)=\"$event.preventDefault(); toggleSelectAll()\"\n              tabindex=\"0\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allFilteredSelected()\"\n                [indeterminate]=\"someFilteredSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  resolvedSelectAllLabel()\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </div>\n            <tedi-separator />\n          }\n\n          <div\n            #optionsList\n            class=\"tedi-filter-dropdown__options\"\n            role=\"listbox\"\n            aria-multiselectable=\"true\"\n            [attr.aria-label]=\"text()\"\n            [attr.aria-activedescendant]=\"activeDescendantId()\"\n            tabindex=\"0\"\n            (focus)=\"onOptionsFocus()\"\n            (blur)=\"onOptionsBlur()\"\n            (mousedown)=\"onOptionsMousedown()\"\n            (keydown)=\"onOptionsKeydown($event)\"\n          >\n            @for (\n              option of filteredOptions();\n              track option.value;\n              let i = $index\n            ) {\n              <div\n                class=\"tedi-filter-dropdown__item\"\n                [class.tedi-filter-dropdown__item--disabled]=\"option.disabled\"\n                [class.tedi-filter-dropdown__item--focused]=\"\n                  activeOptionIndex() === i\n                \"\n                role=\"option\"\n                [attr.aria-selected]=\"isOptionSelected(option.value)\"\n                [attr.aria-disabled]=\"option.disabled || null\"\n                [id]=\"getOptionId(i)\"\n                (click)=\"!option.disabled && toggleOption(option.value)\"\n              >\n                <tedi-dropdown-item-value\n                  type=\"checkbox\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              </div>\n            }\n          </div>\n\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"clearSelection()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        }\n      </div>\n    </tedi-dropdown-content>\n  </tedi-dropdown>\n} @else {\n  <button\n    class=\"tedi-filter__button\"\n    type=\"button\"\n    [disabled]=\"isDisabled()\"\n    [attr.role]=\"isGroupedRadio() ? 'radio' : null\"\n    [attr.aria-checked]=\"isGroupedRadio() ? isSelected() : null\"\n    [attr.aria-pressed]=\"isGroupedRadio() ? null : isSelected()\"\n    (click)=\"toggle()\"\n  >\n    <ng-container *ngTemplateOutlet=\"buttonContent\" />\n  </button>\n}\n\n<ng-template #buttonContent>\n  @if (!hasDropdown() && isSelected()) {\n    <tedi-icon\n      class=\"tedi-filter__icon\"\n      name=\"check\"\n      [size]=\"iconSize()\"\n      color=\"inherit\"\n    />\n  }\n\n  <div\n    class=\"tedi-filter__prepend\"\n    [class.tedi-filter__prepend--hidden]=\"hidePrepend()\"\n  >\n    <ng-content select=\"[tediFilterPrepend]\" />\n  </div>\n\n  <span class=\"tedi-filter__text\">{{ displayText() }}</span>\n\n  <div class=\"tedi-filter__append\">\n    <ng-content select=\"[tediFilterAppend]\" />\n  </div>\n\n  @if (isMultiSelect() && isSelected() && selectedCount() > 0) {\n    <tedi-status-badge\n      class=\"tedi-filter__count\"\n      [text]=\"'' + selectedCount()\"\n      color=\"brand\"\n    />\n  }\n\n  @if (hasDropdown()) {\n    <tedi-icon\n      class=\"tedi-filter__icon\"\n      name=\"arrow_drop_down\"\n      variant=\"filled\"\n      [size]=\"iconSize()\"\n      color=\"inherit\"\n    />\n  }\n</ng-template>\n\n<ng-template #searchField>\n  <div class=\"tedi-filter-dropdown__search\">\n    <tedi-form-field icon=\"search\" [clearable]=\"searchClearable()\">\n      <input\n        tedi-text-field\n        type=\"text\"\n        role=\"searchbox\"\n        [attr.aria-label]=\"text()\"\n        [(value)]=\"searchTerm\"\n        (clear)=\"onSearchClear()\"\n      />\n    </tedi-form-field>\n  </div>\n  <tedi-separator />\n</ng-template>\n", styles: [".tedi-filter{--_filter-bg: transparent;--_filter-text: inherit;--_filter-border: transparent;--_filter-border-width: var(--tedi-borders-01);--_filter-padding-x: var(--filter-default-padding-x);--_filter-radius: var(--form-checkbox-radio-card-radius);display:inline-flex}.tedi-filter__button{display:inline-flex;align-items:center;max-width:var(--button-width-max);padding:0 var(--_filter-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--_filter-text);cursor:pointer;background-color:var(--_filter-bg);border:var(--_filter-border-width) solid var(--_filter-border);border-radius:var(--_filter-radius)}.tedi-filter__button:focus-visible{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:var(--tedi-borders-01)}.tedi-filter__button:disabled{cursor:not-allowed}.tedi-filter__button:not(:disabled):hover .tedi-icon{color:inherit}.tedi-filter--selected .tedi-icon{color:inherit}.tedi-filter__text{padding:calc(var(--filter-default-padding-y) - var(--_filter-border-width)) var(--filter-default-inner-spacing);white-space:nowrap}.tedi-filter__icon{padding:0 var(--filter-default-inner-spacing-sm)}.tedi-filter__prepend{display:flex;align-items:center;padding:0 var(--filter-default-inner-spacing-sm);color:var(--_filter-text)}.tedi-filter__prepend:empty{display:none}.tedi-filter__append{display:flex;align-items:center;padding:0 var(--layout-grid-gutters-02)}.tedi-filter__append:empty{display:none}.tedi-filter__prepend--hidden{display:none}.tedi-filter__count{padding-left:var(--layout-grid-gutters-04)}.tedi-filter--primary{--_filter-border-width: 0px;--_filter-bg: var(--filter-primary-default-background);--_filter-text: var(--filter-primary-default-text)}.tedi-filter--primary .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-primary-hover-background);--_filter-text: var(--filter-primary-hover-text)}.tedi-filter--primary .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-primary-active-background);--_filter-text: var(--filter-primary-active-text)}.tedi-filter--primary.tedi-filter--selected{--_filter-bg: var(--filter-primary-selected-background);--_filter-text: var(--filter-primary-selected-text)}.tedi-filter--primary.tedi-filter--selected .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-primary-hover-background);--_filter-text: var(--filter-primary-hover-text)}.tedi-filter--primary.tedi-filter--selected .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-primary-active-background);--_filter-text: var(--filter-primary-active-text)}.tedi-filter--primary.tedi-filter--disabled{--_filter-bg: var(--filter-primary-disabled-background);--_filter-text: var(--filter-primary-disabled-text)}.tedi-filter--secondary{--_filter-bg: var(--filter-secondary-default-background);--_filter-text: var(--filter-secondary-default-text);--_filter-border: var(--filter-secondary-default-border)}.tedi-filter--secondary .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-secondary-hover-background);--_filter-text: var(--filter-secondary-hover-text);--_filter-border: var(--filter-secondary-hover-border)}.tedi-filter--secondary .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-secondary-active-background);--_filter-text: var(--filter-secondary-active-text);--_filter-border: var(--filter-secondary-active-border)}.tedi-filter--secondary.tedi-filter--selected{--_filter-bg: var(--filter-secondary-selected-background);--_filter-text: var(--filter-secondary-selected-text);--_filter-border: var(--filter-secondary-selected-border);--_filter-border-width: var(--general-border-width-selected)}.tedi-filter--secondary.tedi-filter--disabled{--_filter-bg: var(--filter-secondary-disabled-background);--_filter-text: var(--filter-secondary-disabled-text);--_filter-border: var(--filter-secondary-disabled-border);--_filter-border-width: var(--tedi-borders-01)}.tedi-filter--large{--_filter-padding-x: var(--filter-lg-padding-x)}.tedi-filter--large .tedi-filter__text{padding-top:calc(var(--filter-lg-padding-y) - var(--_filter-border-width));padding-bottom:calc(var(--filter-lg-padding-y) - var(--_filter-border-width))}.tedi-filter-dropdown{display:flex;flex-direction:column;overflow:hidden;background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__custom-content,.tedi-filter-dropdown__search{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}.tedi-filter-dropdown__options{flex:1;max-height:var(--form-select-area-max-height);overflow-y:auto;outline:none}.tedi-filter-dropdown__item{display:flex;align-items:center;width:100%;min-height:var(--form-field-height);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__item:hover:not(.tedi-filter-dropdown__item--disabled){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}.tedi-filter-dropdown__item:focus-visible{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-filter-dropdown__item--disabled{cursor:not-allowed}.tedi-filter-dropdown__item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-filter-dropdown__item--selected .tedi-dropdown-item-value__label,.tedi-filter-dropdown__item--selected .tedi-dropdown-item-value__meta{color:inherit}.tedi-filter-dropdown__item--selected:hover:not(.tedi-filter-dropdown__item--selected--disabled){color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-filter-dropdown__item--focused{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-filter-dropdown__clear{display:flex;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__clear .tedi-icon{font-size:var(--button-icon-inner-size)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: StatusBadgeComponent, selector: "tedi-status-badge", inputs: ["text", "class", "title", "role", "color", "variant", "size", "status", "icon"] }, { kind: "component", type: SeparatorComponent, selector: "tedi-separator", inputs: ["axis", "color", "variant", "dotSize", "dotFilled", "thickness", "spacing", "size"] }, { kind: "component", type: DropdownComponent, selector: "tedi-dropdown", inputs: ["value", "position", "preventOverflow", "offset", "hideOnScroll"], outputs: ["valueChange"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[tedi-dropdown-trigger]", inputs: ["ariaHaspopup"] }, { kind: "component", type: DropdownContentComponent, selector: "tedi-dropdown-content", inputs: ["dropdownRole"] }, { kind: "component", type: DropdownItemValueComponent, selector: "tedi-dropdown-item-value", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: DropdownItemValueLabelComponent, selector: "tedi-dropdown-item-value-label", inputs: ["clipContent"] }, { kind: "component", type: FormFieldComponent, selector: "tedi-form-field", inputs: ["size", "icon", "clearable", "showClearOnInteraction", "inputClass", "characterLimit"] }, { kind: "component", type: TextFieldComponent, selector: "input[tedi-text-field]", inputs: ["value", "size", "invalid", "arrowsHidden", "disabled", "readonly", "readOnly"], outputs: ["valueChange", "clear"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], queries: [{ propertyName: "customContent", first: true, predicate: FilterContentDirective, descendants: true, isSignal: true }, { propertyName: "filterPrepend", first: true, predicate: FilterPrependDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, isSignal: true }, { propertyName: "dropdownPanel", first: true, predicate: ["dropdownPanel"], descendants: true, isSignal: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true, isSignal: true }, { propertyName: "triggerBtn", first: true, predicate: ["triggerBtn"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (hasDropdown()) {\n  <tedi-dropdown #dropdown position=\"bottom-start\">\n    <button\n      #triggerBtn\n      tedi-dropdown-trigger\n      ariaHaspopup=\"dialog\"\n      class=\"tedi-filter__button\"\n      type=\"button\"\n      [disabled]=\"isDisabled()\"\n      (click)=\"focusDropdownContent()\"\n      (keydown.arrowDown)=\"focusDropdownContent(true)\"\n      (keydown.arrowUp)=\"focusDropdownContent(true, true)\"\n    >\n      <ng-container *ngTemplateOutlet=\"buttonContent\" />\n    </button>\n    <tedi-dropdown-content>\n      <div\n        #dropdownPanel\n        class=\"tedi-filter-dropdown\"\n        [class.tedi-filter-dropdown--custom]=\"hasCustomContent()\"\n        role=\"dialog\"\n        [attr.aria-label]=\"text()\"\n        (keydown)=\"handleDropdownKeydown($event)\"\n      >\n        @if (hasCustomContent()) {\n          <div class=\"tedi-filter-dropdown__custom-content\">\n            <ng-content select=\"[tediFilterContent]\" />\n          </div>\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"onCustomClear()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        } @else if (isSingleSelect()) {\n          @if (showSearch()) {\n            <ng-container *ngTemplateOutlet=\"searchField\" />\n          }\n\n          <div\n            #optionsList\n            class=\"tedi-filter-dropdown__options\"\n            role=\"listbox\"\n            [attr.aria-label]=\"text()\"\n            [attr.aria-activedescendant]=\"activeDescendantId()\"\n            tabindex=\"0\"\n            (focus)=\"onOptionsFocus()\"\n            (blur)=\"onOptionsBlur()\"\n            (mousedown)=\"onOptionsMousedown()\"\n            (keydown)=\"onOptionsKeydown($event)\"\n          >\n            @for (\n              option of filteredOptions();\n              track option.value;\n              let i = $index\n            ) {\n              <div\n                class=\"tedi-filter-dropdown__item\"\n                [class.tedi-filter-dropdown__item--disabled]=\"option.disabled\"\n                [class.tedi-filter-dropdown__item--focused]=\"\n                  activeOptionIndex() === i\n                \"\n                [class.tedi-filter-dropdown__item--selected]=\"\n                  isOptionSelected(option.value)\n                \"\n                role=\"option\"\n                [attr.aria-selected]=\"isOptionSelected(option.value)\"\n                [attr.aria-disabled]=\"option.disabled || null\"\n                [id]=\"getOptionId(i)\"\n                (click)=\"!option.disabled && selectOption(option.value)\"\n              >\n                <tedi-option-content\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-option-content-label>{{\n                    option.label\n                  }}</tedi-option-content-label>\n                </tedi-option-content>\n              </div>\n            }\n          </div>\n\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"clearSingleSelection()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        } @else {\n          @if (showSearch()) {\n            <ng-container *ngTemplateOutlet=\"searchField\" />\n          }\n\n          @if (showSelectAll() && filteredOptions().length > 0) {\n            <div\n              class=\"tedi-filter-dropdown__item tedi-filter-dropdown__item--select-all\"\n              role=\"checkbox\"\n              [attr.aria-checked]=\"\n                allFilteredSelected()\n                  ? 'true'\n                  : someFilteredSelected()\n                    ? 'mixed'\n                    : 'false'\n              \"\n              (click)=\"toggleSelectAll()\"\n              (keydown.enter)=\"toggleSelectAll()\"\n              (keydown.space)=\"$event.preventDefault(); toggleSelectAll()\"\n              tabindex=\"0\"\n            >\n              <tedi-option-content\n                type=\"checkbox\"\n                [selected]=\"allFilteredSelected()\"\n                [indeterminate]=\"someFilteredSelected()\"\n              >\n                <tedi-option-content-label>{{\n                  resolvedSelectAllLabel()\n                }}</tedi-option-content-label>\n              </tedi-option-content>\n            </div>\n            <tedi-separator />\n          }\n\n          <div\n            #optionsList\n            class=\"tedi-filter-dropdown__options\"\n            role=\"listbox\"\n            aria-multiselectable=\"true\"\n            [attr.aria-label]=\"text()\"\n            [attr.aria-activedescendant]=\"activeDescendantId()\"\n            tabindex=\"0\"\n            (focus)=\"onOptionsFocus()\"\n            (blur)=\"onOptionsBlur()\"\n            (mousedown)=\"onOptionsMousedown()\"\n            (keydown)=\"onOptionsKeydown($event)\"\n          >\n            @for (\n              option of filteredOptions();\n              track option.value;\n              let i = $index\n            ) {\n              <div\n                class=\"tedi-filter-dropdown__item\"\n                [class.tedi-filter-dropdown__item--disabled]=\"option.disabled\"\n                [class.tedi-filter-dropdown__item--focused]=\"\n                  activeOptionIndex() === i\n                \"\n                role=\"option\"\n                [attr.aria-selected]=\"isOptionSelected(option.value)\"\n                [attr.aria-disabled]=\"option.disabled || null\"\n                [id]=\"getOptionId(i)\"\n                (click)=\"!option.disabled && toggleOption(option.value)\"\n              >\n                <tedi-option-content\n                  type=\"checkbox\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-option-content-label>{{\n                    option.label\n                  }}</tedi-option-content-label>\n                </tedi-option-content>\n              </div>\n            }\n          </div>\n\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"clearSelection()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        }\n      </div>\n    </tedi-dropdown-content>\n  </tedi-dropdown>\n} @else {\n  <button\n    class=\"tedi-filter__button\"\n    type=\"button\"\n    [disabled]=\"isDisabled()\"\n    [attr.role]=\"isGroupedRadio() ? 'radio' : null\"\n    [attr.aria-checked]=\"isGroupedRadio() ? isSelected() : null\"\n    [attr.aria-pressed]=\"isGroupedRadio() ? null : isSelected()\"\n    (click)=\"toggle()\"\n  >\n    <ng-container *ngTemplateOutlet=\"buttonContent\" />\n  </button>\n}\n\n<ng-template #buttonContent>\n  @if (!hasDropdown() && isSelected()) {\n    <tedi-icon\n      class=\"tedi-filter__icon\"\n      name=\"check\"\n      [size]=\"iconSize()\"\n      color=\"inherit\"\n    />\n  }\n\n  <div\n    class=\"tedi-filter__prepend\"\n    [class.tedi-filter__prepend--hidden]=\"hidePrepend()\"\n  >\n    <ng-content select=\"[tediFilterPrepend]\" />\n  </div>\n\n  <span class=\"tedi-filter__text\">{{ displayText() }}</span>\n\n  <div class=\"tedi-filter__append\">\n    <ng-content select=\"[tediFilterAppend]\" />\n  </div>\n\n  @if (isMultiSelect() && isSelected() && selectedCount() > 0) {\n    <tedi-status-badge\n      class=\"tedi-filter__count\"\n      [text]=\"'' + selectedCount()\"\n      color=\"brand\"\n    />\n  }\n\n  @if (hasDropdown()) {\n    <tedi-icon\n      class=\"tedi-filter__icon\"\n      name=\"arrow_drop_down\"\n      variant=\"filled\"\n      [size]=\"iconSize()\"\n      color=\"inherit\"\n    />\n  }\n</ng-template>\n\n<ng-template #searchField>\n  <div class=\"tedi-filter-dropdown__search\">\n    <tedi-form-field icon=\"search\" [clearable]=\"searchClearable()\">\n      <input\n        tedi-text-field\n        type=\"text\"\n        role=\"searchbox\"\n        [attr.aria-label]=\"text()\"\n        [(value)]=\"searchTerm\"\n        (clear)=\"onSearchClear()\"\n      />\n    </tedi-form-field>\n  </div>\n  <tedi-separator />\n</ng-template>\n", styles: [".tedi-filter{--_filter-bg: transparent;--_filter-text: inherit;--_filter-border: transparent;--_filter-border-width: var(--tedi-borders-01);--_filter-padding-x: var(--filter-default-padding-x);--_filter-radius: var(--form-checkbox-radio-card-radius);display:inline-flex}.tedi-filter__button{display:inline-flex;align-items:center;max-width:var(--button-width-max);padding:0 var(--_filter-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--_filter-text);cursor:pointer;background-color:var(--_filter-bg);border:var(--_filter-border-width) solid var(--_filter-border);border-radius:var(--_filter-radius)}.tedi-filter__button:focus-visible{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:var(--tedi-borders-01)}.tedi-filter__button:disabled{cursor:not-allowed}.tedi-filter__button:not(:disabled):hover .tedi-icon{color:inherit}.tedi-filter--selected .tedi-icon{color:inherit}.tedi-filter__text{padding:calc(var(--filter-default-padding-y) - var(--_filter-border-width)) var(--filter-default-inner-spacing);white-space:nowrap}.tedi-filter__icon{padding:0 var(--filter-default-inner-spacing-sm)}.tedi-filter__prepend{display:flex;align-items:center;padding:0 var(--filter-default-inner-spacing-sm);color:var(--_filter-text)}.tedi-filter__prepend:empty{display:none}.tedi-filter__append{display:flex;align-items:center;padding:0 var(--layout-grid-gutters-02)}.tedi-filter__append:empty{display:none}.tedi-filter__prepend--hidden{display:none}.tedi-filter__count{padding-left:var(--layout-grid-gutters-04)}.tedi-filter--primary{--_filter-border-width: 0px;--_filter-bg: var(--filter-primary-default-background);--_filter-text: var(--filter-primary-default-text)}.tedi-filter--primary .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-primary-hover-background);--_filter-text: var(--filter-primary-hover-text)}.tedi-filter--primary .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-primary-active-background);--_filter-text: var(--filter-primary-active-text)}.tedi-filter--primary.tedi-filter--selected{--_filter-bg: var(--filter-primary-selected-background);--_filter-text: var(--filter-primary-selected-text)}.tedi-filter--primary.tedi-filter--selected .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-primary-hover-background);--_filter-text: var(--filter-primary-hover-text)}.tedi-filter--primary.tedi-filter--selected .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-primary-active-background);--_filter-text: var(--filter-primary-active-text)}.tedi-filter--primary.tedi-filter--disabled{--_filter-bg: var(--filter-primary-disabled-background);--_filter-text: var(--filter-primary-disabled-text)}.tedi-filter--secondary{--_filter-bg: var(--filter-secondary-default-background);--_filter-text: var(--filter-secondary-default-text);--_filter-border: var(--filter-secondary-default-border)}.tedi-filter--secondary .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-secondary-hover-background);--_filter-text: var(--filter-secondary-hover-text);--_filter-border: var(--filter-secondary-hover-border)}.tedi-filter--secondary .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-secondary-active-background);--_filter-text: var(--filter-secondary-active-text);--_filter-border: var(--filter-secondary-active-border)}.tedi-filter--secondary.tedi-filter--selected{--_filter-bg: var(--filter-secondary-selected-background);--_filter-text: var(--filter-secondary-selected-text);--_filter-border: var(--filter-secondary-selected-border);--_filter-border-width: var(--general-border-width-selected)}.tedi-filter--secondary.tedi-filter--disabled{--_filter-bg: var(--filter-secondary-disabled-background);--_filter-text: var(--filter-secondary-disabled-text);--_filter-border: var(--filter-secondary-disabled-border);--_filter-border-width: var(--tedi-borders-01)}.tedi-filter--large{--_filter-padding-x: var(--filter-lg-padding-x)}.tedi-filter--large .tedi-filter__text{padding-top:calc(var(--filter-lg-padding-y) - var(--_filter-border-width));padding-bottom:calc(var(--filter-lg-padding-y) - var(--_filter-border-width))}.tedi-filter-dropdown{display:flex;flex-direction:column;overflow:hidden;background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__custom-content,.tedi-filter-dropdown__search{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}.tedi-filter-dropdown__options{flex:1;max-height:var(--form-select-area-max-height);overflow-y:auto;outline:none}.tedi-filter-dropdown__item{display:flex;align-items:center;width:100%;min-height:var(--form-field-height);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__item:hover:not(.tedi-filter-dropdown__item--disabled){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}.tedi-filter-dropdown__item:focus-visible{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-filter-dropdown__item--disabled{cursor:not-allowed}.tedi-filter-dropdown__item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-filter-dropdown__item--selected .tedi-option-content__label,.tedi-filter-dropdown__item--selected .tedi-option-content__meta{color:inherit}.tedi-filter-dropdown__item--selected:hover:not(.tedi-filter-dropdown__item--selected--disabled){color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-filter-dropdown__item--focused{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-filter-dropdown__clear{display:flex;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__clear .tedi-icon{font-size:var(--button-icon-inner-size)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: StatusBadgeComponent, selector: "tedi-status-badge", inputs: ["text", "class", "title", "role", "color", "variant", "size", "status", "icon"] }, { kind: "component", type: SeparatorComponent, selector: "tedi-separator", inputs: ["axis", "color", "variant", "dotSize", "dotFilled", "thickness", "spacing", "size"] }, { kind: "component", type: DropdownComponent, selector: "tedi-dropdown", inputs: ["value", "position", "preventOverflow", "offset", "hideOnScroll"], outputs: ["valueChange"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[tedi-dropdown-trigger]", inputs: ["ariaHaspopup"] }, { kind: "component", type: DropdownContentComponent, selector: "tedi-dropdown-content", inputs: ["dropdownRole"] }, { kind: "component", type: OptionContentComponent, selector: "tedi-option-content", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: OptionContentLabelComponent, selector: "tedi-option-content-label", inputs: ["clipContent"] }, { kind: "component", type: FormFieldComponent, selector: "tedi-form-field", inputs: ["size", "icon", "clearable", "showClearOnInteraction", "inputClass", "characterLimit"] }, { kind: "component", type: TextFieldComponent, selector: "input[tedi-text-field]", inputs: ["value", "size", "invalid", "arrowsHidden", "disabled", "readonly", "readOnly"], outputs: ["valueChange", "clear"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: FilterComponent, decorators: [{
             type: Component,
@@ -15626,8 +15761,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         DropdownComponent,
                         DropdownTriggerDirective,
                         DropdownContentComponent,
-                        DropdownItemValueComponent,
-                        DropdownItemValueLabelComponent,
+                        OptionContentComponent,
+                        OptionContentLabelComponent,
                         FormFieldComponent,
                         TextFieldComponent,
                         FilterContentDirective,
@@ -15644,7 +15779,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "[class.tedi-filter--large]": "size() === 'large'",
                         "[class.tedi-filter--selected]": "isSelected()",
                         "[class.tedi-filter--disabled]": "isDisabled()",
-                    }, template: "@if (hasDropdown()) {\n  <tedi-dropdown #dropdown position=\"bottom-start\">\n    <button\n      #triggerBtn\n      tedi-dropdown-trigger\n      ariaHaspopup=\"dialog\"\n      class=\"tedi-filter__button\"\n      type=\"button\"\n      [disabled]=\"isDisabled()\"\n      (click)=\"focusDropdownContent()\"\n      (keydown.arrowDown)=\"focusDropdownContent(true)\"\n      (keydown.arrowUp)=\"focusDropdownContent(true, true)\"\n    >\n      <ng-container *ngTemplateOutlet=\"buttonContent\" />\n    </button>\n    <tedi-dropdown-content>\n      <div\n        #dropdownPanel\n        class=\"tedi-filter-dropdown\"\n        [class.tedi-filter-dropdown--custom]=\"hasCustomContent()\"\n        role=\"dialog\"\n        [attr.aria-label]=\"text()\"\n        (keydown)=\"handleDropdownKeydown($event)\"\n      >\n        @if (hasCustomContent()) {\n          <div class=\"tedi-filter-dropdown__custom-content\">\n            <ng-content select=\"[tediFilterContent]\" />\n          </div>\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"onCustomClear()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        } @else if (isSingleSelect()) {\n          @if (showSearch()) {\n            <ng-container *ngTemplateOutlet=\"searchField\" />\n          }\n\n          <div\n            #optionsList\n            class=\"tedi-filter-dropdown__options\"\n            role=\"listbox\"\n            [attr.aria-label]=\"text()\"\n            [attr.aria-activedescendant]=\"activeDescendantId()\"\n            tabindex=\"0\"\n            (focus)=\"onOptionsFocus()\"\n            (blur)=\"onOptionsBlur()\"\n            (mousedown)=\"onOptionsMousedown()\"\n            (keydown)=\"onOptionsKeydown($event)\"\n          >\n            @for (\n              option of filteredOptions();\n              track option.value;\n              let i = $index\n            ) {\n              <div\n                class=\"tedi-filter-dropdown__item\"\n                [class.tedi-filter-dropdown__item--disabled]=\"option.disabled\"\n                [class.tedi-filter-dropdown__item--focused]=\"\n                  activeOptionIndex() === i\n                \"\n                [class.tedi-filter-dropdown__item--selected]=\"\n                  isOptionSelected(option.value)\n                \"\n                role=\"option\"\n                [attr.aria-selected]=\"isOptionSelected(option.value)\"\n                [attr.aria-disabled]=\"option.disabled || null\"\n                [id]=\"getOptionId(i)\"\n                (click)=\"!option.disabled && selectOption(option.value)\"\n              >\n                <tedi-dropdown-item-value\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              </div>\n            }\n          </div>\n\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"clearSingleSelection()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        } @else {\n          @if (showSearch()) {\n            <ng-container *ngTemplateOutlet=\"searchField\" />\n          }\n\n          @if (showSelectAll() && filteredOptions().length > 0) {\n            <div\n              class=\"tedi-filter-dropdown__item tedi-filter-dropdown__item--select-all\"\n              role=\"checkbox\"\n              [attr.aria-checked]=\"\n                allFilteredSelected()\n                  ? 'true'\n                  : someFilteredSelected()\n                    ? 'mixed'\n                    : 'false'\n              \"\n              (click)=\"toggleSelectAll()\"\n              (keydown.enter)=\"toggleSelectAll()\"\n              (keydown.space)=\"$event.preventDefault(); toggleSelectAll()\"\n              tabindex=\"0\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allFilteredSelected()\"\n                [indeterminate]=\"someFilteredSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  resolvedSelectAllLabel()\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </div>\n            <tedi-separator />\n          }\n\n          <div\n            #optionsList\n            class=\"tedi-filter-dropdown__options\"\n            role=\"listbox\"\n            aria-multiselectable=\"true\"\n            [attr.aria-label]=\"text()\"\n            [attr.aria-activedescendant]=\"activeDescendantId()\"\n            tabindex=\"0\"\n            (focus)=\"onOptionsFocus()\"\n            (blur)=\"onOptionsBlur()\"\n            (mousedown)=\"onOptionsMousedown()\"\n            (keydown)=\"onOptionsKeydown($event)\"\n          >\n            @for (\n              option of filteredOptions();\n              track option.value;\n              let i = $index\n            ) {\n              <div\n                class=\"tedi-filter-dropdown__item\"\n                [class.tedi-filter-dropdown__item--disabled]=\"option.disabled\"\n                [class.tedi-filter-dropdown__item--focused]=\"\n                  activeOptionIndex() === i\n                \"\n                role=\"option\"\n                [attr.aria-selected]=\"isOptionSelected(option.value)\"\n                [attr.aria-disabled]=\"option.disabled || null\"\n                [id]=\"getOptionId(i)\"\n                (click)=\"!option.disabled && toggleOption(option.value)\"\n              >\n                <tedi-dropdown-item-value\n                  type=\"checkbox\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              </div>\n            }\n          </div>\n\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"clearSelection()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        }\n      </div>\n    </tedi-dropdown-content>\n  </tedi-dropdown>\n} @else {\n  <button\n    class=\"tedi-filter__button\"\n    type=\"button\"\n    [disabled]=\"isDisabled()\"\n    [attr.role]=\"isGroupedRadio() ? 'radio' : null\"\n    [attr.aria-checked]=\"isGroupedRadio() ? isSelected() : null\"\n    [attr.aria-pressed]=\"isGroupedRadio() ? null : isSelected()\"\n    (click)=\"toggle()\"\n  >\n    <ng-container *ngTemplateOutlet=\"buttonContent\" />\n  </button>\n}\n\n<ng-template #buttonContent>\n  @if (!hasDropdown() && isSelected()) {\n    <tedi-icon\n      class=\"tedi-filter__icon\"\n      name=\"check\"\n      [size]=\"iconSize()\"\n      color=\"inherit\"\n    />\n  }\n\n  <div\n    class=\"tedi-filter__prepend\"\n    [class.tedi-filter__prepend--hidden]=\"hidePrepend()\"\n  >\n    <ng-content select=\"[tediFilterPrepend]\" />\n  </div>\n\n  <span class=\"tedi-filter__text\">{{ displayText() }}</span>\n\n  <div class=\"tedi-filter__append\">\n    <ng-content select=\"[tediFilterAppend]\" />\n  </div>\n\n  @if (isMultiSelect() && isSelected() && selectedCount() > 0) {\n    <tedi-status-badge\n      class=\"tedi-filter__count\"\n      [text]=\"'' + selectedCount()\"\n      color=\"brand\"\n    />\n  }\n\n  @if (hasDropdown()) {\n    <tedi-icon\n      class=\"tedi-filter__icon\"\n      name=\"arrow_drop_down\"\n      variant=\"filled\"\n      [size]=\"iconSize()\"\n      color=\"inherit\"\n    />\n  }\n</ng-template>\n\n<ng-template #searchField>\n  <div class=\"tedi-filter-dropdown__search\">\n    <tedi-form-field icon=\"search\" [clearable]=\"searchClearable()\">\n      <input\n        tedi-text-field\n        type=\"text\"\n        role=\"searchbox\"\n        [attr.aria-label]=\"text()\"\n        [(value)]=\"searchTerm\"\n        (clear)=\"onSearchClear()\"\n      />\n    </tedi-form-field>\n  </div>\n  <tedi-separator />\n</ng-template>\n", styles: [".tedi-filter{--_filter-bg: transparent;--_filter-text: inherit;--_filter-border: transparent;--_filter-border-width: var(--tedi-borders-01);--_filter-padding-x: var(--filter-default-padding-x);--_filter-radius: var(--form-checkbox-radio-card-radius);display:inline-flex}.tedi-filter__button{display:inline-flex;align-items:center;max-width:var(--button-width-max);padding:0 var(--_filter-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--_filter-text);cursor:pointer;background-color:var(--_filter-bg);border:var(--_filter-border-width) solid var(--_filter-border);border-radius:var(--_filter-radius)}.tedi-filter__button:focus-visible{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:var(--tedi-borders-01)}.tedi-filter__button:disabled{cursor:not-allowed}.tedi-filter__button:not(:disabled):hover .tedi-icon{color:inherit}.tedi-filter--selected .tedi-icon{color:inherit}.tedi-filter__text{padding:calc(var(--filter-default-padding-y) - var(--_filter-border-width)) var(--filter-default-inner-spacing);white-space:nowrap}.tedi-filter__icon{padding:0 var(--filter-default-inner-spacing-sm)}.tedi-filter__prepend{display:flex;align-items:center;padding:0 var(--filter-default-inner-spacing-sm);color:var(--_filter-text)}.tedi-filter__prepend:empty{display:none}.tedi-filter__append{display:flex;align-items:center;padding:0 var(--layout-grid-gutters-02)}.tedi-filter__append:empty{display:none}.tedi-filter__prepend--hidden{display:none}.tedi-filter__count{padding-left:var(--layout-grid-gutters-04)}.tedi-filter--primary{--_filter-border-width: 0px;--_filter-bg: var(--filter-primary-default-background);--_filter-text: var(--filter-primary-default-text)}.tedi-filter--primary .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-primary-hover-background);--_filter-text: var(--filter-primary-hover-text)}.tedi-filter--primary .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-primary-active-background);--_filter-text: var(--filter-primary-active-text)}.tedi-filter--primary.tedi-filter--selected{--_filter-bg: var(--filter-primary-selected-background);--_filter-text: var(--filter-primary-selected-text)}.tedi-filter--primary.tedi-filter--selected .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-primary-hover-background);--_filter-text: var(--filter-primary-hover-text)}.tedi-filter--primary.tedi-filter--selected .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-primary-active-background);--_filter-text: var(--filter-primary-active-text)}.tedi-filter--primary.tedi-filter--disabled{--_filter-bg: var(--filter-primary-disabled-background);--_filter-text: var(--filter-primary-disabled-text)}.tedi-filter--secondary{--_filter-bg: var(--filter-secondary-default-background);--_filter-text: var(--filter-secondary-default-text);--_filter-border: var(--filter-secondary-default-border)}.tedi-filter--secondary .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-secondary-hover-background);--_filter-text: var(--filter-secondary-hover-text);--_filter-border: var(--filter-secondary-hover-border)}.tedi-filter--secondary .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-secondary-active-background);--_filter-text: var(--filter-secondary-active-text);--_filter-border: var(--filter-secondary-active-border)}.tedi-filter--secondary.tedi-filter--selected{--_filter-bg: var(--filter-secondary-selected-background);--_filter-text: var(--filter-secondary-selected-text);--_filter-border: var(--filter-secondary-selected-border);--_filter-border-width: var(--general-border-width-selected)}.tedi-filter--secondary.tedi-filter--disabled{--_filter-bg: var(--filter-secondary-disabled-background);--_filter-text: var(--filter-secondary-disabled-text);--_filter-border: var(--filter-secondary-disabled-border);--_filter-border-width: var(--tedi-borders-01)}.tedi-filter--large{--_filter-padding-x: var(--filter-lg-padding-x)}.tedi-filter--large .tedi-filter__text{padding-top:calc(var(--filter-lg-padding-y) - var(--_filter-border-width));padding-bottom:calc(var(--filter-lg-padding-y) - var(--_filter-border-width))}.tedi-filter-dropdown{display:flex;flex-direction:column;overflow:hidden;background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__custom-content,.tedi-filter-dropdown__search{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}.tedi-filter-dropdown__options{flex:1;max-height:var(--form-select-area-max-height);overflow-y:auto;outline:none}.tedi-filter-dropdown__item{display:flex;align-items:center;width:100%;min-height:var(--form-field-height);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__item:hover:not(.tedi-filter-dropdown__item--disabled){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}.tedi-filter-dropdown__item:focus-visible{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-filter-dropdown__item--disabled{cursor:not-allowed}.tedi-filter-dropdown__item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-filter-dropdown__item--selected .tedi-dropdown-item-value__label,.tedi-filter-dropdown__item--selected .tedi-dropdown-item-value__meta{color:inherit}.tedi-filter-dropdown__item--selected:hover:not(.tedi-filter-dropdown__item--selected--disabled){color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-filter-dropdown__item--focused{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-filter-dropdown__clear{display:flex;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__clear .tedi-icon{font-size:var(--button-icon-inner-size)}\n"] }]
+                    }, template: "@if (hasDropdown()) {\n  <tedi-dropdown #dropdown position=\"bottom-start\">\n    <button\n      #triggerBtn\n      tedi-dropdown-trigger\n      ariaHaspopup=\"dialog\"\n      class=\"tedi-filter__button\"\n      type=\"button\"\n      [disabled]=\"isDisabled()\"\n      (click)=\"focusDropdownContent()\"\n      (keydown.arrowDown)=\"focusDropdownContent(true)\"\n      (keydown.arrowUp)=\"focusDropdownContent(true, true)\"\n    >\n      <ng-container *ngTemplateOutlet=\"buttonContent\" />\n    </button>\n    <tedi-dropdown-content>\n      <div\n        #dropdownPanel\n        class=\"tedi-filter-dropdown\"\n        [class.tedi-filter-dropdown--custom]=\"hasCustomContent()\"\n        role=\"dialog\"\n        [attr.aria-label]=\"text()\"\n        (keydown)=\"handleDropdownKeydown($event)\"\n      >\n        @if (hasCustomContent()) {\n          <div class=\"tedi-filter-dropdown__custom-content\">\n            <ng-content select=\"[tediFilterContent]\" />\n          </div>\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"onCustomClear()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        } @else if (isSingleSelect()) {\n          @if (showSearch()) {\n            <ng-container *ngTemplateOutlet=\"searchField\" />\n          }\n\n          <div\n            #optionsList\n            class=\"tedi-filter-dropdown__options\"\n            role=\"listbox\"\n            [attr.aria-label]=\"text()\"\n            [attr.aria-activedescendant]=\"activeDescendantId()\"\n            tabindex=\"0\"\n            (focus)=\"onOptionsFocus()\"\n            (blur)=\"onOptionsBlur()\"\n            (mousedown)=\"onOptionsMousedown()\"\n            (keydown)=\"onOptionsKeydown($event)\"\n          >\n            @for (\n              option of filteredOptions();\n              track option.value;\n              let i = $index\n            ) {\n              <div\n                class=\"tedi-filter-dropdown__item\"\n                [class.tedi-filter-dropdown__item--disabled]=\"option.disabled\"\n                [class.tedi-filter-dropdown__item--focused]=\"\n                  activeOptionIndex() === i\n                \"\n                [class.tedi-filter-dropdown__item--selected]=\"\n                  isOptionSelected(option.value)\n                \"\n                role=\"option\"\n                [attr.aria-selected]=\"isOptionSelected(option.value)\"\n                [attr.aria-disabled]=\"option.disabled || null\"\n                [id]=\"getOptionId(i)\"\n                (click)=\"!option.disabled && selectOption(option.value)\"\n              >\n                <tedi-option-content\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-option-content-label>{{\n                    option.label\n                  }}</tedi-option-content-label>\n                </tedi-option-content>\n              </div>\n            }\n          </div>\n\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"clearSingleSelection()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        } @else {\n          @if (showSearch()) {\n            <ng-container *ngTemplateOutlet=\"searchField\" />\n          }\n\n          @if (showSelectAll() && filteredOptions().length > 0) {\n            <div\n              class=\"tedi-filter-dropdown__item tedi-filter-dropdown__item--select-all\"\n              role=\"checkbox\"\n              [attr.aria-checked]=\"\n                allFilteredSelected()\n                  ? 'true'\n                  : someFilteredSelected()\n                    ? 'mixed'\n                    : 'false'\n              \"\n              (click)=\"toggleSelectAll()\"\n              (keydown.enter)=\"toggleSelectAll()\"\n              (keydown.space)=\"$event.preventDefault(); toggleSelectAll()\"\n              tabindex=\"0\"\n            >\n              <tedi-option-content\n                type=\"checkbox\"\n                [selected]=\"allFilteredSelected()\"\n                [indeterminate]=\"someFilteredSelected()\"\n              >\n                <tedi-option-content-label>{{\n                  resolvedSelectAllLabel()\n                }}</tedi-option-content-label>\n              </tedi-option-content>\n            </div>\n            <tedi-separator />\n          }\n\n          <div\n            #optionsList\n            class=\"tedi-filter-dropdown__options\"\n            role=\"listbox\"\n            aria-multiselectable=\"true\"\n            [attr.aria-label]=\"text()\"\n            [attr.aria-activedescendant]=\"activeDescendantId()\"\n            tabindex=\"0\"\n            (focus)=\"onOptionsFocus()\"\n            (blur)=\"onOptionsBlur()\"\n            (mousedown)=\"onOptionsMousedown()\"\n            (keydown)=\"onOptionsKeydown($event)\"\n          >\n            @for (\n              option of filteredOptions();\n              track option.value;\n              let i = $index\n            ) {\n              <div\n                class=\"tedi-filter-dropdown__item\"\n                [class.tedi-filter-dropdown__item--disabled]=\"option.disabled\"\n                [class.tedi-filter-dropdown__item--focused]=\"\n                  activeOptionIndex() === i\n                \"\n                role=\"option\"\n                [attr.aria-selected]=\"isOptionSelected(option.value)\"\n                [attr.aria-disabled]=\"option.disabled || null\"\n                [id]=\"getOptionId(i)\"\n                (click)=\"!option.disabled && toggleOption(option.value)\"\n              >\n                <tedi-option-content\n                  type=\"checkbox\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-option-content-label>{{\n                    option.label\n                  }}</tedi-option-content-label>\n                </tedi-option-content>\n              </div>\n            }\n          </div>\n\n          @if (showClear()) {\n            <tedi-separator />\n            <div class=\"tedi-filter-dropdown__clear\">\n              <button\n                tedi-button\n                variant=\"neutral\"\n                size=\"small\"\n                type=\"button\"\n                (click)=\"clearSelection()\"\n              >\n                <tedi-icon name=\"refresh\" [size]=\"18\" color=\"brand\" />\n                <span>{{ resolvedClearLabel() }}</span>\n              </button>\n            </div>\n          }\n        }\n      </div>\n    </tedi-dropdown-content>\n  </tedi-dropdown>\n} @else {\n  <button\n    class=\"tedi-filter__button\"\n    type=\"button\"\n    [disabled]=\"isDisabled()\"\n    [attr.role]=\"isGroupedRadio() ? 'radio' : null\"\n    [attr.aria-checked]=\"isGroupedRadio() ? isSelected() : null\"\n    [attr.aria-pressed]=\"isGroupedRadio() ? null : isSelected()\"\n    (click)=\"toggle()\"\n  >\n    <ng-container *ngTemplateOutlet=\"buttonContent\" />\n  </button>\n}\n\n<ng-template #buttonContent>\n  @if (!hasDropdown() && isSelected()) {\n    <tedi-icon\n      class=\"tedi-filter__icon\"\n      name=\"check\"\n      [size]=\"iconSize()\"\n      color=\"inherit\"\n    />\n  }\n\n  <div\n    class=\"tedi-filter__prepend\"\n    [class.tedi-filter__prepend--hidden]=\"hidePrepend()\"\n  >\n    <ng-content select=\"[tediFilterPrepend]\" />\n  </div>\n\n  <span class=\"tedi-filter__text\">{{ displayText() }}</span>\n\n  <div class=\"tedi-filter__append\">\n    <ng-content select=\"[tediFilterAppend]\" />\n  </div>\n\n  @if (isMultiSelect() && isSelected() && selectedCount() > 0) {\n    <tedi-status-badge\n      class=\"tedi-filter__count\"\n      [text]=\"'' + selectedCount()\"\n      color=\"brand\"\n    />\n  }\n\n  @if (hasDropdown()) {\n    <tedi-icon\n      class=\"tedi-filter__icon\"\n      name=\"arrow_drop_down\"\n      variant=\"filled\"\n      [size]=\"iconSize()\"\n      color=\"inherit\"\n    />\n  }\n</ng-template>\n\n<ng-template #searchField>\n  <div class=\"tedi-filter-dropdown__search\">\n    <tedi-form-field icon=\"search\" [clearable]=\"searchClearable()\">\n      <input\n        tedi-text-field\n        type=\"text\"\n        role=\"searchbox\"\n        [attr.aria-label]=\"text()\"\n        [(value)]=\"searchTerm\"\n        (clear)=\"onSearchClear()\"\n      />\n    </tedi-form-field>\n  </div>\n  <tedi-separator />\n</ng-template>\n", styles: [".tedi-filter{--_filter-bg: transparent;--_filter-text: inherit;--_filter-border: transparent;--_filter-border-width: var(--tedi-borders-01);--_filter-padding-x: var(--filter-default-padding-x);--_filter-radius: var(--form-checkbox-radio-card-radius);display:inline-flex}.tedi-filter__button{display:inline-flex;align-items:center;max-width:var(--button-width-max);padding:0 var(--_filter-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--_filter-text);cursor:pointer;background-color:var(--_filter-bg);border:var(--_filter-border-width) solid var(--_filter-border);border-radius:var(--_filter-radius)}.tedi-filter__button:focus-visible{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:var(--tedi-borders-01)}.tedi-filter__button:disabled{cursor:not-allowed}.tedi-filter__button:not(:disabled):hover .tedi-icon{color:inherit}.tedi-filter--selected .tedi-icon{color:inherit}.tedi-filter__text{padding:calc(var(--filter-default-padding-y) - var(--_filter-border-width)) var(--filter-default-inner-spacing);white-space:nowrap}.tedi-filter__icon{padding:0 var(--filter-default-inner-spacing-sm)}.tedi-filter__prepend{display:flex;align-items:center;padding:0 var(--filter-default-inner-spacing-sm);color:var(--_filter-text)}.tedi-filter__prepend:empty{display:none}.tedi-filter__append{display:flex;align-items:center;padding:0 var(--layout-grid-gutters-02)}.tedi-filter__append:empty{display:none}.tedi-filter__prepend--hidden{display:none}.tedi-filter__count{padding-left:var(--layout-grid-gutters-04)}.tedi-filter--primary{--_filter-border-width: 0px;--_filter-bg: var(--filter-primary-default-background);--_filter-text: var(--filter-primary-default-text)}.tedi-filter--primary .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-primary-hover-background);--_filter-text: var(--filter-primary-hover-text)}.tedi-filter--primary .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-primary-active-background);--_filter-text: var(--filter-primary-active-text)}.tedi-filter--primary.tedi-filter--selected{--_filter-bg: var(--filter-primary-selected-background);--_filter-text: var(--filter-primary-selected-text)}.tedi-filter--primary.tedi-filter--selected .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-primary-hover-background);--_filter-text: var(--filter-primary-hover-text)}.tedi-filter--primary.tedi-filter--selected .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-primary-active-background);--_filter-text: var(--filter-primary-active-text)}.tedi-filter--primary.tedi-filter--disabled{--_filter-bg: var(--filter-primary-disabled-background);--_filter-text: var(--filter-primary-disabled-text)}.tedi-filter--secondary{--_filter-bg: var(--filter-secondary-default-background);--_filter-text: var(--filter-secondary-default-text);--_filter-border: var(--filter-secondary-default-border)}.tedi-filter--secondary .tedi-filter__button:not(:disabled):hover{--_filter-bg: var(--filter-secondary-hover-background);--_filter-text: var(--filter-secondary-hover-text);--_filter-border: var(--filter-secondary-hover-border)}.tedi-filter--secondary .tedi-filter__button:not(:disabled):active{--_filter-bg: var(--filter-secondary-active-background);--_filter-text: var(--filter-secondary-active-text);--_filter-border: var(--filter-secondary-active-border)}.tedi-filter--secondary.tedi-filter--selected{--_filter-bg: var(--filter-secondary-selected-background);--_filter-text: var(--filter-secondary-selected-text);--_filter-border: var(--filter-secondary-selected-border);--_filter-border-width: var(--general-border-width-selected)}.tedi-filter--secondary.tedi-filter--disabled{--_filter-bg: var(--filter-secondary-disabled-background);--_filter-text: var(--filter-secondary-disabled-text);--_filter-border: var(--filter-secondary-disabled-border);--_filter-border-width: var(--tedi-borders-01)}.tedi-filter--large{--_filter-padding-x: var(--filter-lg-padding-x)}.tedi-filter--large .tedi-filter__text{padding-top:calc(var(--filter-lg-padding-y) - var(--_filter-border-width));padding-bottom:calc(var(--filter-lg-padding-y) - var(--_filter-border-width))}.tedi-filter-dropdown{display:flex;flex-direction:column;overflow:hidden;background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__custom-content,.tedi-filter-dropdown__search{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}.tedi-filter-dropdown__options{flex:1;max-height:var(--form-select-area-max-height);overflow-y:auto;outline:none}.tedi-filter-dropdown__item{display:flex;align-items:center;width:100%;min-height:var(--form-field-height);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__item:hover:not(.tedi-filter-dropdown__item--disabled){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}.tedi-filter-dropdown__item:focus-visible{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-filter-dropdown__item--disabled{cursor:not-allowed}.tedi-filter-dropdown__item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-filter-dropdown__item--selected .tedi-option-content__label,.tedi-filter-dropdown__item--selected .tedi-option-content__meta{color:inherit}.tedi-filter-dropdown__item--selected:hover:not(.tedi-filter-dropdown__item--selected--disabled){color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-filter-dropdown__item--focused{outline:var(--tedi-borders-02) solid var(--form-input-border-active);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-filter-dropdown__clear{display:flex;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);background:var(--dropdown-item-default-background)}.tedi-filter-dropdown__clear .tedi-icon{font-size:var(--button-icon-inner-size)}\n"] }]
         }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }, { type: i0.Output, args: ["selectedChange"] }], allowMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowMultiple", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], showSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSearch", required: false }] }], searchClearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchClearable", required: false }] }], clearSearchOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearSearchOnSelect", required: false }] }], showSelectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSelectAll", required: false }] }], showClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClear", required: false }] }], selectAllLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAllLabel", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }], cleared: [{ type: i0.Output, args: ["cleared"] }], preserveLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "preserveLabel", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], dropdown: [{ type: i0.ViewChild, args: ["dropdown", { isSignal: true }] }], dropdownPanel: [{ type: i0.ViewChild, args: ["dropdownPanel", { isSignal: true }] }], optionsList: [{ type: i0.ViewChild, args: ["optionsList", { isSignal: true }] }], triggerBtn: [{ type: i0.ViewChild, args: ["triggerBtn", { isSignal: true }] }], customContent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => FilterContentDirective), { isSignal: true }] }], filterPrepend: [{ type: i0.ContentChild, args: [i0.forwardRef(() => FilterPrependDirective), { isSignal: true }] }] } });
 class CheckboxCardComponent {
@@ -15654,13 +15789,13 @@ class CheckboxCardComponent {
      */
     variant = input("primary", ...(ngDevMode ? [{ debugName: "variant" }] : []));
     /**
-     * Whether to show the checkbox indicator.
-     * When false, the checkbox is visually hidden but remains functional.
+     * Show the checkbox indicator.
+     * When false, the checkbox is visually hidden but stays functional.
      * @default true
      */
     showIndicator = input(true, ...(ngDevMode ? [{ debugName: "showIndicator" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CheckboxCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: CheckboxCardComponent, isStandalone: true, selector: "label[tedi-checkbox-card]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, showIndicator: { classPropertyName: "showIndicator", publicName: "showIndicator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-checkbox-card--primary": "variant() === 'primary'", "class.tedi-checkbox-card--secondary": "variant() === 'secondary'", "class.tedi-checkbox-card--hide-indicator": "!showIndicator()" }, classAttribute: "tedi-checkbox-card" }, ngImport: i0, template: "<div class=\"tedi-checkbox-card__content\">\n  <ng-content />\n</div>\n<ng-content select=\"tedi-feedback-text\" />\n", styles: ["label[tedi-checkbox-card]{--_card-bg: transparent;--_card-text: inherit;--_card-border: transparent;display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:var(--form-field-height);padding:calc(var(--form-checkbox-radio-card-checkbox-padding-y) - var(--tedi-borders-01)) var(--form-checkbox-radio-card-checkbox-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--_card-text);cursor:pointer;background-color:var(--_card-bg);border:1px solid var(--_card-border);border-radius:var(--form-checkbox-radio-card-radius)}label[tedi-checkbox-card] [tedi-text],label[tedi-checkbox-card] tedi-icon{color:inherit}label[tedi-checkbox-card] input[tedi-checkbox],label[tedi-checkbox-card] tedi-icon{flex-shrink:0}label[tedi-checkbox-card] .tedi-checkbox-card__content{display:flex;gap:var(--form-checkbox-radio-card-inner-spacing);align-items:center}label[tedi-checkbox-card]>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--form-checkbox-radio-card-inner-spacing));color:inherit}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator input[tedi-checkbox]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator>.tedi-feedback-text{padding-left:0}label[tedi-checkbox-card] input[tedi-checkbox]:not(:disabled):hover{box-shadow:none}label[tedi-checkbox-card]:has(input:focus-visible){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}label[tedi-checkbox-card]:has(input:focus-visible) input[tedi-checkbox]:focus-visible{outline:none}label[tedi-checkbox-card]:has(input:disabled){cursor:not-allowed}label[tedi-checkbox-card].tedi-checkbox-card--primary{--_card-bg: var(--form-checkbox-radio-card-primary-default-background);--_card-text: var(--form-checkbox-radio-card-primary-default-text);--_card-border: var( --form-checkbox-radio-card-primary-default-border-separate )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked){--_card-bg: var(--form-checkbox-radio-card-primary-selected-background);--_card-text: var(--form-checkbox-radio-card-primary-selected-text);--_card-border: var( --form-checkbox-radio-card-primary-selected-border-separate )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked) input[tedi-checkbox]:not(:disabled){background-color:transparent;border-color:var(--form-checkbox-radio-default-border-selected-inverted)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:hover:not(:disabled)){--_card-bg: var(--form-checkbox-radio-card-primary-hover-background);--_card-text: var(--form-checkbox-radio-card-primary-hover-text);--_card-border: var(--form-checkbox-radio-card-primary-hover-border)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:not(:checked)){--_card-bg: var( --form-checkbox-radio-card-primary-disabled-default-background );--_card-text: var( --form-checkbox-radio-card-primary-disabled-default-text );--_card-border: var( --form-checkbox-radio-card-primary-disabled-default-background )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:checked){--_card-bg: var( --form-checkbox-radio-card-primary-disabled-selected-background );--_card-text: var( --form-checkbox-radio-card-primary-disabled-selected-text );--_card-border: var( --form-checkbox-radio-card-primary-disabled-selected-background )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:checked) input[tedi-checkbox]{background-color:transparent;border-color:var(--form-checkbox-radio-default-border-selected-inverted)}label[tedi-checkbox-card].tedi-checkbox-card--secondary{--_card-bg: var(--form-checkbox-radio-card-secondary-default-background);--_card-text: var(--form-checkbox-radio-card-secondary-default-text);--_card-border: var(--form-checkbox-radio-card-secondary-default-border)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked){--_card-bg: var(--form-checkbox-radio-card-secondary-selected-background);--_card-text: var(--form-checkbox-radio-card-secondary-selected-text);--_card-border: var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_card-border)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:hover:not(:disabled)){--_card-bg: var(--form-checkbox-radio-card-secondary-hover-background);--_card-text: var(--form-checkbox-radio-card-secondary-hover-text);--_card-border: var(--form-checkbox-radio-card-secondary-hover-border)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:disabled:not(:checked)){--_card-bg: var( --form-checkbox-radio-card-secondary-disabled-default-background );--_card-text: var( --form-checkbox-radio-card-secondary-disabled-default-text );--_card-border: var( --form-checkbox-radio-card-secondary-disabled-default-border )}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:disabled:checked){--_card-bg: var( --form-checkbox-radio-card-secondary-disabled-selected-background );--_card-text: var( --form-checkbox-radio-card-secondary-disabled-selected-text );--_card-border: var( --form-checkbox-radio-card-secondary-disabled-selected-border );box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_card-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: CheckboxCardComponent, isStandalone: true, selector: "label[tedi-checkbox-card]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, showIndicator: { classPropertyName: "showIndicator", publicName: "showIndicator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-checkbox-card--primary": "variant() === 'primary'", "class.tedi-checkbox-card--secondary": "variant() === 'secondary'", "class.tedi-checkbox-card--hide-indicator": "!showIndicator()" }, classAttribute: "tedi-checkbox-card" }, ngImport: i0, template: "<div class=\"tedi-checkbox-card__content\">\n  <ng-content />\n</div>\n<ng-content select=\"tedi-feedback-text\" />\n", styles: ["label[tedi-checkbox-card]{--form-checkbox-radio-size-responsive: var(--form-checkbox-radio-size-fixed);--_card-bg: transparent;--_card-text: inherit;--_card-border: transparent;--_card-inset: 0 0 0 0 transparent;--_card-ring: 0 0 0 0 transparent;display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-height:var(--form-field-height);padding:calc(var(--form-checkbox-radio-card-checkbox-padding-y) - var(--tedi-borders-01)) var(--form-checkbox-radio-card-checkbox-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--_card-text);cursor:pointer;background-color:var(--_card-bg);border:var(--tedi-borders-01) solid var(--_card-border);border-radius:var(--form-checkbox-radio-card-radius);box-shadow:var(--_card-inset),var(--_card-ring)}label[tedi-checkbox-card]:before,label[tedi-checkbox-card]:after{flex:1 1 0;max-height:calc((var(--form-field-height) - var(--body-regular-line-height)) / 2 - var(--form-checkbox-radio-card-checkbox-padding-y));content:\"\"}label[tedi-checkbox-card] [tedi-text],label[tedi-checkbox-card] tedi-icon{color:inherit}label[tedi-checkbox-card] input[tedi-checkbox],label[tedi-checkbox-card] tedi-icon{flex-shrink:0}label[tedi-checkbox-card] input[tedi-checkbox]{--_checkbox-icon-size: 1rem;pointer-events:none}label[tedi-checkbox-card] .tedi-checkbox-card__content{display:flex;gap:var(--form-checkbox-radio-card-inner-spacing);align-items:center}label[tedi-checkbox-card]>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--form-checkbox-radio-card-inner-spacing));color:inherit}label[tedi-checkbox-card]:has(>.tedi-checkbox-card__content>tedi-icon)>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--icon-03) + var(--form-checkbox-radio-card-inner-spacing) * 2)}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator input[tedi-checkbox]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator>.tedi-feedback-text{padding-left:0}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator:has(>.tedi-checkbox-card__content>tedi-icon)>.tedi-feedback-text{padding-left:calc(var(--icon-03) + var(--form-checkbox-radio-card-inner-spacing))}label[tedi-checkbox-card]:has(input:focus-visible){--_card-ring: 0 0 0 var(--tedi-borders-01) var(--general-effect-colors-focus-outset-inner-shadow), 0 0 0 var(--tedi-borders-03) var(--general-effect-colors-focus-outset-outer-shadow)}label[tedi-checkbox-card]:has(input:focus-visible) input[tedi-checkbox][type=checkbox]{--_checkbox-ring: 0 0 0 0 transparent}label[tedi-checkbox-card]:has(input:disabled){cursor:not-allowed}label[tedi-checkbox-card].tedi-checkbox-card--primary{--_card-bg: var(--form-choice-card-primary-unselected-background-default);--_card-text: var(--form-choice-card-primary-unselected-text-default);--_card-border: var( --form-choice-card-primary-unselected-border-borderless )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:hover:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-hover);--_card-text: var(--form-choice-card-primary-unselected-text-hover);--_card-border: var(--form-choice-card-primary-unselected-border-hover)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:active:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-active);--_card-text: var(--form-choice-card-primary-unselected-text-active);--_card-border: var(--form-choice-card-primary-unselected-border-active)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:focus-visible:not(:hover,:active,:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-focus);--_card-text: var(--form-choice-card-primary-unselected-text-focus)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked){--_card-bg: var(--form-choice-card-primary-selected-background-default);--_card-text: var(--form-choice-card-primary-selected-text-default);--_card-border: var(--_card-bg)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-default);--_checkbox-border: var( --form-choice-checkbox-selected-border-inverted );--_checkbox-icon: var( --form-choice-checkbox-selected-indicator-default )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:hover:not(:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-hover);--_card-text: var(--form-choice-card-primary-selected-text-hover)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:hover:not(:disabled)) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-hover)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:active:not(:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-active);--_card-text: var(--form-choice-card-primary-selected-text-active)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:active:not(:disabled)) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-active)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:focus-visible:not(:hover,:active,:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-focus);--_card-text: var(--form-choice-card-primary-selected-text-focus)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:focus-visible:not(:hover,:active,:disabled)) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-focus)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:not(:checked)){--_card-bg: var( --form-choice-card-primary-unselected-background-disabled );--_card-text: var(--form-choice-card-primary-unselected-text-disabled);--_card-border: var( --form-choice-card-primary-unselected-border-disabled )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:checked){--_card-bg: var(--form-choice-card-primary-selected-background-disabled);--_card-text: var(--form-choice-card-primary-selected-text-disabled);--_card-border: var(--_card-bg)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:checked) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-disabled);--_checkbox-border: var( --form-choice-checkbox-selected-border-inverted );--_checkbox-icon: var( --form-choice-checkbox-selected-indicator-disabled )}label[tedi-checkbox-card].tedi-checkbox-card--secondary{--_card-bg: var(--form-choice-card-secondary-unselected-background-default);--_card-text: var(--form-choice-card-secondary-unselected-text-default);--_card-border: var(--form-choice-card-secondary-unselected-border-default)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:hover:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-secondary-unselected-background-hover);--_card-text: var(--form-choice-card-secondary-unselected-text-hover);--_card-border: var(--form-choice-card-secondary-unselected-border-hover)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:active:not(:disabled,:checked)){--_card-bg: var( --form-choice-card-secondary-unselected-background-active );--_card-text: var(--form-choice-card-secondary-unselected-text-active);--_card-border: var( --form-choice-card-secondary-unselected-border-active )}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:focus-visible:not(:hover,:active,:disabled,:checked)){--_card-bg: var(--form-choice-card-secondary-unselected-background-focus);--_card-text: var(--form-choice-card-secondary-unselected-text-focus);--_card-border: var(--form-choice-card-secondary-unselected-border-focus)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked){--_card-bg: var(--form-choice-card-secondary-selected-background-default);--_card-text: var(--form-choice-card-secondary-selected-text-default);--_card-border: var(--form-choice-card-secondary-selected-border-default);--_card-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_card-border)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked:hover:not(:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-hover);--_card-text: var(--form-choice-card-secondary-selected-text-hover);--_card-border: var(--form-choice-card-secondary-selected-border-hover)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked:active:not(:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-active);--_card-text: var(--form-choice-card-secondary-selected-text-active);--_card-border: var(--form-choice-card-secondary-selected-border-active)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked:focus-visible:not(:hover,:active,:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-focus);--_card-text: var(--form-choice-card-secondary-selected-text-focus);--_card-border: var(--form-choice-card-secondary-selected-border-focus)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:disabled:not(:checked)){--_card-bg: var( --form-choice-card-secondary-unselected-background-disabled );--_card-text: var(--form-choice-card-secondary-unselected-text-disabled);--_card-border: var( --form-choice-card-secondary-unselected-border-disabled )}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:disabled:checked){--_card-bg: var( --form-choice-card-secondary-selected-background-disabled );--_card-text: var(--form-choice-card-secondary-selected-text-disabled);--_card-border: var( --form-choice-card-secondary-selected-border-disabled );--_card-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_card-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CheckboxCardComponent, decorators: [{
             type: Component,
@@ -15669,18 +15804,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "[class.tedi-checkbox-card--primary]": "variant() === 'primary'",
                         "[class.tedi-checkbox-card--secondary]": "variant() === 'secondary'",
                         "[class.tedi-checkbox-card--hide-indicator]": "!showIndicator()",
-                    }, template: "<div class=\"tedi-checkbox-card__content\">\n  <ng-content />\n</div>\n<ng-content select=\"tedi-feedback-text\" />\n", styles: ["label[tedi-checkbox-card]{--_card-bg: transparent;--_card-text: inherit;--_card-border: transparent;display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:var(--form-field-height);padding:calc(var(--form-checkbox-radio-card-checkbox-padding-y) - var(--tedi-borders-01)) var(--form-checkbox-radio-card-checkbox-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--_card-text);cursor:pointer;background-color:var(--_card-bg);border:1px solid var(--_card-border);border-radius:var(--form-checkbox-radio-card-radius)}label[tedi-checkbox-card] [tedi-text],label[tedi-checkbox-card] tedi-icon{color:inherit}label[tedi-checkbox-card] input[tedi-checkbox],label[tedi-checkbox-card] tedi-icon{flex-shrink:0}label[tedi-checkbox-card] .tedi-checkbox-card__content{display:flex;gap:var(--form-checkbox-radio-card-inner-spacing);align-items:center}label[tedi-checkbox-card]>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--form-checkbox-radio-card-inner-spacing));color:inherit}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator input[tedi-checkbox]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator>.tedi-feedback-text{padding-left:0}label[tedi-checkbox-card] input[tedi-checkbox]:not(:disabled):hover{box-shadow:none}label[tedi-checkbox-card]:has(input:focus-visible){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}label[tedi-checkbox-card]:has(input:focus-visible) input[tedi-checkbox]:focus-visible{outline:none}label[tedi-checkbox-card]:has(input:disabled){cursor:not-allowed}label[tedi-checkbox-card].tedi-checkbox-card--primary{--_card-bg: var(--form-checkbox-radio-card-primary-default-background);--_card-text: var(--form-checkbox-radio-card-primary-default-text);--_card-border: var( --form-checkbox-radio-card-primary-default-border-separate )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked){--_card-bg: var(--form-checkbox-radio-card-primary-selected-background);--_card-text: var(--form-checkbox-radio-card-primary-selected-text);--_card-border: var( --form-checkbox-radio-card-primary-selected-border-separate )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked) input[tedi-checkbox]:not(:disabled){background-color:transparent;border-color:var(--form-checkbox-radio-default-border-selected-inverted)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:hover:not(:disabled)){--_card-bg: var(--form-checkbox-radio-card-primary-hover-background);--_card-text: var(--form-checkbox-radio-card-primary-hover-text);--_card-border: var(--form-checkbox-radio-card-primary-hover-border)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:not(:checked)){--_card-bg: var( --form-checkbox-radio-card-primary-disabled-default-background );--_card-text: var( --form-checkbox-radio-card-primary-disabled-default-text );--_card-border: var( --form-checkbox-radio-card-primary-disabled-default-background )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:checked){--_card-bg: var( --form-checkbox-radio-card-primary-disabled-selected-background );--_card-text: var( --form-checkbox-radio-card-primary-disabled-selected-text );--_card-border: var( --form-checkbox-radio-card-primary-disabled-selected-background )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:checked) input[tedi-checkbox]{background-color:transparent;border-color:var(--form-checkbox-radio-default-border-selected-inverted)}label[tedi-checkbox-card].tedi-checkbox-card--secondary{--_card-bg: var(--form-checkbox-radio-card-secondary-default-background);--_card-text: var(--form-checkbox-radio-card-secondary-default-text);--_card-border: var(--form-checkbox-radio-card-secondary-default-border)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked){--_card-bg: var(--form-checkbox-radio-card-secondary-selected-background);--_card-text: var(--form-checkbox-radio-card-secondary-selected-text);--_card-border: var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_card-border)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:hover:not(:disabled)){--_card-bg: var(--form-checkbox-radio-card-secondary-hover-background);--_card-text: var(--form-checkbox-radio-card-secondary-hover-text);--_card-border: var(--form-checkbox-radio-card-secondary-hover-border)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:disabled:not(:checked)){--_card-bg: var( --form-checkbox-radio-card-secondary-disabled-default-background );--_card-text: var( --form-checkbox-radio-card-secondary-disabled-default-text );--_card-border: var( --form-checkbox-radio-card-secondary-disabled-default-border )}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:disabled:checked){--_card-bg: var( --form-checkbox-radio-card-secondary-disabled-selected-background );--_card-text: var( --form-checkbox-radio-card-secondary-disabled-selected-text );--_card-border: var( --form-checkbox-radio-card-secondary-disabled-selected-border );box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_card-border)}\n"] }]
+                    }, template: "<div class=\"tedi-checkbox-card__content\">\n  <ng-content />\n</div>\n<ng-content select=\"tedi-feedback-text\" />\n", styles: ["label[tedi-checkbox-card]{--form-checkbox-radio-size-responsive: var(--form-checkbox-radio-size-fixed);--_card-bg: transparent;--_card-text: inherit;--_card-border: transparent;--_card-inset: 0 0 0 0 transparent;--_card-ring: 0 0 0 0 transparent;display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-height:var(--form-field-height);padding:calc(var(--form-checkbox-radio-card-checkbox-padding-y) - var(--tedi-borders-01)) var(--form-checkbox-radio-card-checkbox-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--_card-text);cursor:pointer;background-color:var(--_card-bg);border:var(--tedi-borders-01) solid var(--_card-border);border-radius:var(--form-checkbox-radio-card-radius);box-shadow:var(--_card-inset),var(--_card-ring)}label[tedi-checkbox-card]:before,label[tedi-checkbox-card]:after{flex:1 1 0;max-height:calc((var(--form-field-height) - var(--body-regular-line-height)) / 2 - var(--form-checkbox-radio-card-checkbox-padding-y));content:\"\"}label[tedi-checkbox-card] [tedi-text],label[tedi-checkbox-card] tedi-icon{color:inherit}label[tedi-checkbox-card] input[tedi-checkbox],label[tedi-checkbox-card] tedi-icon{flex-shrink:0}label[tedi-checkbox-card] input[tedi-checkbox]{--_checkbox-icon-size: 1rem;pointer-events:none}label[tedi-checkbox-card] .tedi-checkbox-card__content{display:flex;gap:var(--form-checkbox-radio-card-inner-spacing);align-items:center}label[tedi-checkbox-card]>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--form-checkbox-radio-card-inner-spacing));color:inherit}label[tedi-checkbox-card]:has(>.tedi-checkbox-card__content>tedi-icon)>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--icon-03) + var(--form-checkbox-radio-card-inner-spacing) * 2)}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator input[tedi-checkbox]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator>.tedi-feedback-text{padding-left:0}label[tedi-checkbox-card].tedi-checkbox-card--hide-indicator:has(>.tedi-checkbox-card__content>tedi-icon)>.tedi-feedback-text{padding-left:calc(var(--icon-03) + var(--form-checkbox-radio-card-inner-spacing))}label[tedi-checkbox-card]:has(input:focus-visible){--_card-ring: 0 0 0 var(--tedi-borders-01) var(--general-effect-colors-focus-outset-inner-shadow), 0 0 0 var(--tedi-borders-03) var(--general-effect-colors-focus-outset-outer-shadow)}label[tedi-checkbox-card]:has(input:focus-visible) input[tedi-checkbox][type=checkbox]{--_checkbox-ring: 0 0 0 0 transparent}label[tedi-checkbox-card]:has(input:disabled){cursor:not-allowed}label[tedi-checkbox-card].tedi-checkbox-card--primary{--_card-bg: var(--form-choice-card-primary-unselected-background-default);--_card-text: var(--form-choice-card-primary-unselected-text-default);--_card-border: var( --form-choice-card-primary-unselected-border-borderless )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:hover:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-hover);--_card-text: var(--form-choice-card-primary-unselected-text-hover);--_card-border: var(--form-choice-card-primary-unselected-border-hover)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:active:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-active);--_card-text: var(--form-choice-card-primary-unselected-text-active);--_card-border: var(--form-choice-card-primary-unselected-border-active)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:focus-visible:not(:hover,:active,:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-focus);--_card-text: var(--form-choice-card-primary-unselected-text-focus)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked){--_card-bg: var(--form-choice-card-primary-selected-background-default);--_card-text: var(--form-choice-card-primary-selected-text-default);--_card-border: var(--_card-bg)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-default);--_checkbox-border: var( --form-choice-checkbox-selected-border-inverted );--_checkbox-icon: var( --form-choice-checkbox-selected-indicator-default )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:hover:not(:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-hover);--_card-text: var(--form-choice-card-primary-selected-text-hover)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:hover:not(:disabled)) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-hover)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:active:not(:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-active);--_card-text: var(--form-choice-card-primary-selected-text-active)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:active:not(:disabled)) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-active)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:focus-visible:not(:hover,:active,:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-focus);--_card-text: var(--form-choice-card-primary-selected-text-focus)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:checked:focus-visible:not(:hover,:active,:disabled)) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-focus)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:not(:checked)){--_card-bg: var( --form-choice-card-primary-unselected-background-disabled );--_card-text: var(--form-choice-card-primary-unselected-text-disabled);--_card-border: var( --form-choice-card-primary-unselected-border-disabled )}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:checked){--_card-bg: var(--form-choice-card-primary-selected-background-disabled);--_card-text: var(--form-choice-card-primary-selected-text-disabled);--_card-border: var(--_card-bg)}label[tedi-checkbox-card].tedi-checkbox-card--primary:has(input:disabled:checked) input[tedi-checkbox][type=checkbox]{--_checkbox-bg: var(--form-choice-inverted-indicator-disabled);--_checkbox-border: var( --form-choice-checkbox-selected-border-inverted );--_checkbox-icon: var( --form-choice-checkbox-selected-indicator-disabled )}label[tedi-checkbox-card].tedi-checkbox-card--secondary{--_card-bg: var(--form-choice-card-secondary-unselected-background-default);--_card-text: var(--form-choice-card-secondary-unselected-text-default);--_card-border: var(--form-choice-card-secondary-unselected-border-default)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:hover:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-secondary-unselected-background-hover);--_card-text: var(--form-choice-card-secondary-unselected-text-hover);--_card-border: var(--form-choice-card-secondary-unselected-border-hover)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:active:not(:disabled,:checked)){--_card-bg: var( --form-choice-card-secondary-unselected-background-active );--_card-text: var(--form-choice-card-secondary-unselected-text-active);--_card-border: var( --form-choice-card-secondary-unselected-border-active )}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:focus-visible:not(:hover,:active,:disabled,:checked)){--_card-bg: var(--form-choice-card-secondary-unselected-background-focus);--_card-text: var(--form-choice-card-secondary-unselected-text-focus);--_card-border: var(--form-choice-card-secondary-unselected-border-focus)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked){--_card-bg: var(--form-choice-card-secondary-selected-background-default);--_card-text: var(--form-choice-card-secondary-selected-text-default);--_card-border: var(--form-choice-card-secondary-selected-border-default);--_card-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_card-border)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked:hover:not(:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-hover);--_card-text: var(--form-choice-card-secondary-selected-text-hover);--_card-border: var(--form-choice-card-secondary-selected-border-hover)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked:active:not(:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-active);--_card-text: var(--form-choice-card-secondary-selected-text-active);--_card-border: var(--form-choice-card-secondary-selected-border-active)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:checked:focus-visible:not(:hover,:active,:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-focus);--_card-text: var(--form-choice-card-secondary-selected-text-focus);--_card-border: var(--form-choice-card-secondary-selected-border-focus)}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:disabled:not(:checked)){--_card-bg: var( --form-choice-card-secondary-unselected-background-disabled );--_card-text: var(--form-choice-card-secondary-unselected-text-disabled);--_card-border: var( --form-choice-card-secondary-unselected-border-disabled )}label[tedi-checkbox-card].tedi-checkbox-card--secondary:has(input:disabled:checked){--_card-bg: var( --form-choice-card-secondary-selected-background-disabled );--_card-text: var(--form-choice-card-secondary-selected-text-disabled);--_card-border: var( --form-choice-card-secondary-selected-border-disabled );--_card-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_card-border)}\n"] }]
         }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], showIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIndicator", required: false }] }] } });
 class CheckboxCardGroupComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CheckboxCardGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.24", type: CheckboxCardGroupComponent, isStandalone: true, selector: "tedi-checkbox-card-group", host: { classAttribute: "tedi-checkbox-card-group" }, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-checkbox-card-group{display:flex;flex-wrap:wrap;gap:var(--form-checkbox-radio-card-gutter)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.24", type: CheckboxCardGroupComponent, isStandalone: true, selector: "tedi-checkbox-card-group", host: { classAttribute: "tedi-checkbox-card-group" }, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-checkbox-card-group{display:flex;flex-wrap:wrap;gap:var(--form-checkbox-radio-card-gutter);align-items:flex-start}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: CheckboxCardGroupComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: "tedi-checkbox-card-group", template: "<ng-content />", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "tedi-checkbox-card-group",
-                    }, styles: [".tedi-checkbox-card-group{display:flex;flex-wrap:wrap;gap:var(--form-checkbox-radio-card-gutter)}\n"] }]
+                    }, styles: [".tedi-checkbox-card-group{display:flex;flex-wrap:wrap;gap:var(--form-checkbox-radio-card-gutter);align-items:flex-start}\n"] }]
         }] });
 class RadioCardGroupComponent {
@@ -15691,16 +15826,23 @@ class RadioCardGroupComponent {
      * @default false
      */
     grouped = input(false, ...(ngDevMode ? [{ debugName: "grouped" }] : []));
+    /**
+     * Gives primary cards a border in the unselected state. Child
+     * `tedi-radio-card` instances inherit this. Has no effect on grouped cards,
+     * which always have a border.
+     * @default false
+     */
+    bordered = input(false, ...(ngDevMode ? [{ debugName: "bordered" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: RadioCardGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: RadioCardGroupComponent, isStandalone: true, selector: "tedi-radio-card-group", inputs: { grouped: { classPropertyName: "grouped", publicName: "grouped", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-radio-card-group--grouped": "grouped()" }, classAttribute: "tedi-radio-card-group" }, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-radio-card-group{display:flex;flex-wrap:wrap;gap:var(--form-checkbox-radio-card-gutter)}.tedi-radio-card-group--grouped{display:inline-flex;flex-wrap:nowrap;gap:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: RadioCardGroupComponent, isStandalone: true, selector: "tedi-radio-card-group", inputs: { grouped: { classPropertyName: "grouped", publicName: "grouped", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-radio-card-group--grouped": "grouped()" }, classAttribute: "tedi-radio-card-group" }, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-radio-card-group{display:flex;flex-wrap:wrap;gap:var(--form-checkbox-radio-card-gutter);align-items:flex-start}.tedi-radio-card-group--grouped{display:inline-flex;flex-wrap:nowrap;gap:0;align-items:stretch}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: RadioCardGroupComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: "tedi-radio-card-group", template: "<ng-content />", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "tedi-radio-card-group",
                         "[class.tedi-radio-card-group--grouped]": "grouped()",
-                    }, styles: [".tedi-radio-card-group{display:flex;flex-wrap:wrap;gap:var(--form-checkbox-radio-card-gutter)}.tedi-radio-card-group--grouped{display:inline-flex;flex-wrap:nowrap;gap:0}\n"] }]
-        }], propDecorators: { grouped: [{ type: i0.Input, args: [{ isSignal: true, alias: "grouped", required: false }] }] } });
+                    }, styles: [".tedi-radio-card-group{display:flex;flex-wrap:wrap;gap:var(--form-checkbox-radio-card-gutter);align-items:flex-start}.tedi-radio-card-group--grouped{display:inline-flex;flex-wrap:nowrap;gap:0;align-items:stretch}\n"] }]
+        }], propDecorators: { grouped: [{ type: i0.Input, args: [{ isSignal: true, alias: "grouped", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }] } });
 class RadioCardComponent {
     /**
@@ -15709,7 +15851,7 @@ class RadioCardComponent {
      */
     variant = input("primary", ...(ngDevMode ? [{ debugName: "variant" }] : []));
     /**
-     * Whether the card is part of a button-group style layout. Prefer setting
+     * Show the card as part of a button-group style layout. Prefer setting
      * `grouped` on the enclosing `tedi-radio-card-group` instead; this input
      * is retained for standalone cards outside a group.
      *
@@ -15720,8 +15862,15 @@ class RadioCardComponent {
      */
     grouped = input(false, ...(ngDevMode ? [{ debugName: "grouped" }] : []));
     /**
-     * Whether to show the radio indicator.
-     * When false, the radio is visually hidden but remains functional.
+     * Gives a primary card a border in the unselected state. Can also be set on
+     * the enclosing `tedi-radio-card-group`. Only applies to `variant="primary"`;
+     * has no effect on grouped cards, which always have a border.
+     * @default false
+     */
+    bordered = input(false, ...(ngDevMode ? [{ debugName: "bordered" }] : []));
+    /**
+     * Show the radio indicator.
+     * When false, the radio is visually hidden but stays functional.
      * @default true
      */
     showIndicator = input(true, ...(ngDevMode ? [{ debugName: "showIndicator" }] : []));
@@ -15729,8 +15878,9 @@ class RadioCardComponent {
         optional: true,
     });
     isGrouped = computed(() => this.grouped() || (this.cardGroup?.grouped() ?? false), ...(ngDevMode ? [{ debugName: "isGrouped" }] : []));
+    isBordered = computed(() => this.bordered() || (this.cardGroup?.bordered() ?? false), ...(ngDevMode ? [{ debugName: "isBordered" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: RadioCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: RadioCardComponent, isStandalone: true, selector: "label[tedi-radio-card]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, grouped: { classPropertyName: "grouped", publicName: "grouped", isSignal: true, isRequired: false, transformFunction: null }, showIndicator: { classPropertyName: "showIndicator", publicName: "showIndicator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-radio-card--primary": "variant() === 'primary'", "class.tedi-radio-card--secondary": "variant() === 'secondary'", "class.tedi-radio-card--grouped": "isGrouped()", "class.tedi-radio-card--hide-indicator": "!showIndicator()" }, classAttribute: "tedi-radio-card" }, ngImport: i0, template: "<div class=\"tedi-radio-card__content\">\n  <ng-content />\n</div>\n<ng-content select=\"tedi-feedback-text\" />\n", styles: ["label[tedi-radio-card]{--_card-bg: transparent;--_card-text: inherit;--_card-border: transparent;display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:var(--form-field-height);padding:calc(var(--form-checkbox-radio-card-checkbox-padding-y) - var(--tedi-borders-01)) var(--form-checkbox-radio-card-checkbox-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--_card-text);cursor:pointer;background-color:var(--_card-bg);border:1px solid var(--_card-border);border-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card] [tedi-text],label[tedi-radio-card] tedi-icon{color:inherit}label[tedi-radio-card] input[tedi-radio],label[tedi-radio-card] tedi-icon{flex-shrink:0}label[tedi-radio-card] .tedi-radio-card__content{display:flex;gap:var(--form-checkbox-radio-card-inner-spacing);align-items:center}label[tedi-radio-card]>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--form-checkbox-radio-card-inner-spacing));color:inherit}label[tedi-radio-card].tedi-radio-card--hide-indicator input[tedi-radio]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}label[tedi-radio-card].tedi-radio-card--hide-indicator>.tedi-feedback-text{padding-left:0}label[tedi-radio-card] input[tedi-radio]:not(:disabled):hover{box-shadow:none}label[tedi-radio-card]:has(input:focus-visible){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}label[tedi-radio-card]:has(input:focus-visible) input[tedi-radio]:focus-visible{outline:none}label[tedi-radio-card]:has(input:disabled){cursor:not-allowed}label[tedi-radio-card].tedi-radio-card--grouped{border-radius:0}label[tedi-radio-card].tedi-radio-card--grouped:first-child{border-top-left-radius:var(--form-checkbox-radio-card-radius);border-bottom-left-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card].tedi-radio-card--grouped:last-child{border-top-right-radius:var(--form-checkbox-radio-card-radius);border-bottom-right-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card].tedi-radio-card--grouped+label[tedi-radio-card].tedi-radio-card--grouped{margin-left:-1px}label[tedi-radio-card].tedi-radio-card--grouped:has(input:focus-visible){z-index:5}label[tedi-radio-card].tedi-radio-card--grouped:has(input:checked){z-index:1}label[tedi-radio-card].tedi-radio-card--primary{--_card-bg: var(--form-checkbox-radio-card-primary-default-background);--_card-text: var(--form-checkbox-radio-card-primary-default-text);--_card-border: var( --form-checkbox-radio-card-primary-default-border-separate )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped{--_card-border: var( --form-checkbox-radio-card-primary-default-border-group )}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked){--_card-bg: var(--form-checkbox-radio-card-primary-selected-background);--_card-text: var(--form-checkbox-radio-card-primary-selected-text);--_card-border: var( --form-checkbox-radio-card-primary-selected-border-separate )}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked).tedi-radio-card--grouped{--_card-border: var( --form-checkbox-radio-card-primary-selected-border-group )}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked) input[tedi-radio]:not(:disabled){background-color:transparent;border-color:var(--form-checkbox-radio-default-border-selected-inverted)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked) input[tedi-radio]:not(:disabled):before{background:var(--form-checkbox-radio-default-check-indicator-default)}label[tedi-radio-card].tedi-radio-card--primary:has(input:hover:not(:disabled)){--_card-bg: var(--form-checkbox-radio-card-primary-hover-background);--_card-text: var(--form-checkbox-radio-card-primary-hover-text);--_card-border: var(--form-checkbox-radio-card-primary-hover-border)}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:not(:checked)){--_card-bg: var( --form-checkbox-radio-card-primary-disabled-default-background );--_card-text: var( --form-checkbox-radio-card-primary-disabled-default-text );--_card-border: var( --form-checkbox-radio-card-primary-disabled-default-background )}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked){--_card-bg: var( --form-checkbox-radio-card-primary-disabled-selected-background );--_card-text: var( --form-checkbox-radio-card-primary-disabled-selected-text );--_card-border: var( --form-checkbox-radio-card-primary-disabled-selected-background )}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked) input[tedi-radio]{background-color:transparent;border-color:var(--form-checkbox-radio-default-border-selected-inverted)}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked) input[tedi-radio]:before{background:var(--form-checkbox-radio-default-check-indicator-default)}label[tedi-radio-card].tedi-radio-card--secondary{--_card-bg: var(--form-checkbox-radio-card-secondary-default-background);--_card-text: var(--form-checkbox-radio-card-secondary-default-text);--_card-border: var(--form-checkbox-radio-card-secondary-default-border)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked){--_card-bg: var(--form-checkbox-radio-card-secondary-selected-background);--_card-text: var(--form-checkbox-radio-card-secondary-selected-text);--_card-border: var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_card-border)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:hover:not(:disabled)){--_card-bg: var(--form-checkbox-radio-card-secondary-hover-background);--_card-text: var(--form-checkbox-radio-card-secondary-hover-text);--_card-border: var(--form-checkbox-radio-card-secondary-hover-border)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:disabled:not(:checked)){--_card-bg: var( --form-checkbox-radio-card-secondary-disabled-default-background );--_card-text: var( --form-checkbox-radio-card-secondary-disabled-default-text );--_card-border: var( --form-checkbox-radio-card-secondary-disabled-default-border )}label[tedi-radio-card].tedi-radio-card--secondary:has(input:disabled:checked){--_card-bg: var( --form-checkbox-radio-card-secondary-disabled-selected-background );--_card-text: var( --form-checkbox-radio-card-secondary-disabled-selected-text );--_card-border: var( --form-checkbox-radio-card-secondary-disabled-selected-border );box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_card-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: RadioCardComponent, isStandalone: true, selector: "label[tedi-radio-card]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, grouped: { classPropertyName: "grouped", publicName: "grouped", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, showIndicator: { classPropertyName: "showIndicator", publicName: "showIndicator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-radio-card--primary": "variant() === 'primary'", "class.tedi-radio-card--secondary": "variant() === 'secondary'", "class.tedi-radio-card--grouped": "isGrouped()", "class.tedi-radio-card--bordered": "isBordered()", "class.tedi-radio-card--hide-indicator": "!showIndicator()" }, classAttribute: "tedi-radio-card" }, ngImport: i0, template: "<div class=\"tedi-radio-card__content\">\n  <ng-content />\n</div>\n<ng-content select=\"tedi-feedback-text\" />\n", styles: ["label[tedi-radio-card]{--form-checkbox-radio-size-responsive: var(--form-checkbox-radio-size-fixed);--_card-bg: transparent;--_card-text: inherit;--_card-border: transparent;--_card-inset: 0 0 0 0 transparent;--_card-ring: 0 0 0 0 transparent;display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-height:var(--form-field-height);padding:calc(var(--form-checkbox-radio-card-checkbox-padding-y) - var(--tedi-borders-01)) var(--form-checkbox-radio-card-checkbox-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--_card-text);cursor:pointer;background-color:var(--_card-bg);border:var(--tedi-borders-01) solid var(--_card-border);border-radius:var(--form-checkbox-radio-card-radius);box-shadow:var(--_card-inset),var(--_card-ring)}label[tedi-radio-card]:before,label[tedi-radio-card]:after{flex:1 1 0;max-height:calc((var(--form-field-height) - var(--body-regular-line-height)) / 2 - var(--form-checkbox-radio-card-checkbox-padding-y));content:\"\"}label[tedi-radio-card] [tedi-text],label[tedi-radio-card] tedi-icon{color:inherit}label[tedi-radio-card] input[tedi-radio],label[tedi-radio-card] tedi-icon{flex-shrink:0}label[tedi-radio-card] input[tedi-radio]{pointer-events:none}label[tedi-radio-card] .tedi-radio-card__content{display:flex;gap:var(--form-checkbox-radio-card-inner-spacing);align-items:center}label[tedi-radio-card]>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--form-checkbox-radio-card-inner-spacing));color:inherit}label[tedi-radio-card]:has(>.tedi-radio-card__content>tedi-icon)>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--icon-03) + var(--form-checkbox-radio-card-inner-spacing) * 2)}label[tedi-radio-card].tedi-radio-card--hide-indicator input[tedi-radio]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}label[tedi-radio-card].tedi-radio-card--hide-indicator>.tedi-feedback-text{padding-left:0}label[tedi-radio-card].tedi-radio-card--hide-indicator:has(>.tedi-radio-card__content>tedi-icon)>.tedi-feedback-text{padding-left:calc(var(--icon-03) + var(--form-checkbox-radio-card-inner-spacing))}label[tedi-radio-card].tedi-radio-card--grouped{border-radius:0}label[tedi-radio-card].tedi-radio-card--grouped:first-child{border-top-left-radius:var(--form-checkbox-radio-card-radius);border-bottom-left-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card].tedi-radio-card--grouped:last-child{border-top-right-radius:var(--form-checkbox-radio-card-radius);border-bottom-right-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card].tedi-radio-card--grouped+label[tedi-radio-card].tedi-radio-card--grouped{margin-left:-1px}label[tedi-radio-card].tedi-radio-card--grouped:has(input:focus-visible){z-index:5}label[tedi-radio-card].tedi-radio-card--grouped:has(input:checked){z-index:1}label[tedi-radio-card]:has(input:focus-visible){--_card-ring: 0 0 0 var(--tedi-borders-01) var(--general-effect-colors-focus-outset-inner-shadow), 0 0 0 var(--tedi-borders-03) var(--general-effect-colors-focus-outset-outer-shadow)}label[tedi-radio-card]:has(input:focus-visible) input[tedi-radio][type=radio]{--_radio-ring: 0 0 0 0 transparent}label[tedi-radio-card]:has(input:disabled){cursor:not-allowed}label[tedi-radio-card].tedi-radio-card--primary{--_card-bg: var(--form-choice-card-primary-unselected-background-default);--_card-text: var(--form-choice-card-primary-unselected-text-default);--_card-border: var( --form-choice-card-primary-unselected-border-borderless )}label[tedi-radio-card].tedi-radio-card--primary:has(input:hover:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-hover);--_card-text: var(--form-choice-card-primary-unselected-text-hover);--_card-border: var(--form-choice-card-primary-unselected-border-hover)}label[tedi-radio-card].tedi-radio-card--primary:has(input:active:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-active);--_card-text: var(--form-choice-card-primary-unselected-text-active);--_card-border: var(--form-choice-card-primary-unselected-border-active)}label[tedi-radio-card].tedi-radio-card--primary:has(input:focus-visible:not(:hover,:active,:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-focus);--_card-text: var(--form-choice-card-primary-unselected-text-focus)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked){--_card-bg: var(--form-choice-card-primary-selected-background-default);--_card-text: var(--form-choice-card-primary-selected-text-default);--_card-border: var(--_card-bg)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-default);--_radio-border: var(--form-choice-radio-selected-border-inverted);--_radio-dot: var(--form-choice-radio-selected-indicator-inverted)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:hover:not(:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-hover);--_card-text: var(--form-choice-card-primary-selected-text-hover)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:hover:not(:disabled)) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-hover)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:active:not(:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-active);--_card-text: var(--form-choice-card-primary-selected-text-active)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:active:not(:disabled)) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-active)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:focus-visible:not(:hover,:active,:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-focus);--_card-text: var(--form-choice-card-primary-selected-text-focus)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:focus-visible:not(:hover,:active,:disabled)) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-focus)}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:not(:checked)){--_card-bg: var( --form-choice-card-primary-unselected-background-disabled );--_card-text: var(--form-choice-card-primary-unselected-text-disabled);--_card-border: var( --form-choice-card-primary-unselected-border-disabled )}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked){--_card-bg: var(--form-choice-card-primary-selected-background-disabled);--_card-text: var(--form-choice-card-primary-selected-text-disabled);--_card-border: var(--_card-bg)}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-disabled);--_radio-border: var(--form-choice-radio-selected-border-inverted);--_radio-dot: var(--form-choice-radio-selected-indicator-inverted)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered{--_card-border: var(--form-choice-card-primary-unselected-border-default)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered:has(input:hover:not(:disabled,:checked)){--_card-border: var(--form-choice-card-primary-unselected-border-hover)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered:has(input:active:not(:disabled,:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-active )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered:has(input:checked){--_card-border: var(--_card-bg)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered:has(input:disabled:not(:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-disabled )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped{--_card-border: var(--form-choice-card-primary-unselected-border-default)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:hover:not(:disabled,:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-group-hover )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:active:not(:disabled,:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-group-active )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:checked){--_card-border: var(--form-choice-card-primary-selected-border-default)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:checked:hover:not(:disabled)){--_card-border: var( --form-choice-card-primary-selected-border-group-hover )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:checked:active:not(:disabled)){--_card-border: var( --form-choice-card-primary-selected-border-group-active )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:disabled:not(:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-disabled )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:disabled:checked){--_card-border: var( --form-choice-card-primary-selected-border-group-disabled )}label[tedi-radio-card].tedi-radio-card--secondary{--_card-bg: var(--form-choice-card-secondary-unselected-background-default);--_card-text: var(--form-choice-card-secondary-unselected-text-default);--_card-border: var(--form-choice-card-secondary-unselected-border-default)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:hover:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-secondary-unselected-background-hover);--_card-text: var(--form-choice-card-secondary-unselected-text-hover);--_card-border: var(--form-choice-card-secondary-unselected-border-hover)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:active:not(:disabled,:checked)){--_card-bg: var( --form-choice-card-secondary-unselected-background-active );--_card-text: var(--form-choice-card-secondary-unselected-text-active);--_card-border: var( --form-choice-card-secondary-unselected-border-active )}label[tedi-radio-card].tedi-radio-card--secondary:has(input:focus-visible:not(:hover,:active,:disabled,:checked)){--_card-bg: var(--form-choice-card-secondary-unselected-background-focus);--_card-text: var(--form-choice-card-secondary-unselected-text-focus);--_card-border: var(--form-choice-card-secondary-unselected-border-focus)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked){--_card-bg: var(--form-choice-card-secondary-selected-background-default);--_card-text: var(--form-choice-card-secondary-selected-text-default);--_card-border: var(--form-choice-card-secondary-selected-border-default);--_card-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_card-border)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked:hover:not(:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-hover);--_card-text: var(--form-choice-card-secondary-selected-text-hover);--_card-border: var(--form-choice-card-secondary-selected-border-hover)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked:active:not(:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-active);--_card-text: var(--form-choice-card-secondary-selected-text-active);--_card-border: var(--form-choice-card-secondary-selected-border-active)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked:focus-visible:not(:hover,:active,:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-focus);--_card-text: var(--form-choice-card-secondary-selected-text-focus);--_card-border: var(--form-choice-card-secondary-selected-border-focus)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:disabled:not(:checked)){--_card-bg: var( --form-choice-card-secondary-unselected-background-disabled );--_card-text: var(--form-choice-card-secondary-unselected-text-disabled);--_card-border: var( --form-choice-card-secondary-unselected-border-disabled )}label[tedi-radio-card].tedi-radio-card--secondary:has(input:disabled:checked){--_card-bg: var( --form-choice-card-secondary-selected-background-disabled );--_card-text: var(--form-choice-card-secondary-selected-text-disabled);--_card-border: var( --form-choice-card-secondary-selected-border-disabled );--_card-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_card-border)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: RadioCardComponent, decorators: [{
             type: Component,
@@ -15739,9 +15889,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "[class.tedi-radio-card--primary]": "variant() === 'primary'",
                         "[class.tedi-radio-card--secondary]": "variant() === 'secondary'",
                         "[class.tedi-radio-card--grouped]": "isGrouped()",
+                        "[class.tedi-radio-card--bordered]": "isBordered()",
                         "[class.tedi-radio-card--hide-indicator]": "!showIndicator()",
-                    }, template: "<div class=\"tedi-radio-card__content\">\n  <ng-content />\n</div>\n<ng-content select=\"tedi-feedback-text\" />\n", styles: ["label[tedi-radio-card]{--_card-bg: transparent;--_card-text: inherit;--_card-border: transparent;display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:var(--form-field-height);padding:calc(var(--form-checkbox-radio-card-checkbox-padding-y) - var(--tedi-borders-01)) var(--form-checkbox-radio-card-checkbox-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--_card-text);cursor:pointer;background-color:var(--_card-bg);border:1px solid var(--_card-border);border-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card] [tedi-text],label[tedi-radio-card] tedi-icon{color:inherit}label[tedi-radio-card] input[tedi-radio],label[tedi-radio-card] tedi-icon{flex-shrink:0}label[tedi-radio-card] .tedi-radio-card__content{display:flex;gap:var(--form-checkbox-radio-card-inner-spacing);align-items:center}label[tedi-radio-card]>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--form-checkbox-radio-card-inner-spacing));color:inherit}label[tedi-radio-card].tedi-radio-card--hide-indicator input[tedi-radio]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}label[tedi-radio-card].tedi-radio-card--hide-indicator>.tedi-feedback-text{padding-left:0}label[tedi-radio-card] input[tedi-radio]:not(:disabled):hover{box-shadow:none}label[tedi-radio-card]:has(input:focus-visible){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}label[tedi-radio-card]:has(input:focus-visible) input[tedi-radio]:focus-visible{outline:none}label[tedi-radio-card]:has(input:disabled){cursor:not-allowed}label[tedi-radio-card].tedi-radio-card--grouped{border-radius:0}label[tedi-radio-card].tedi-radio-card--grouped:first-child{border-top-left-radius:var(--form-checkbox-radio-card-radius);border-bottom-left-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card].tedi-radio-card--grouped:last-child{border-top-right-radius:var(--form-checkbox-radio-card-radius);border-bottom-right-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card].tedi-radio-card--grouped+label[tedi-radio-card].tedi-radio-card--grouped{margin-left:-1px}label[tedi-radio-card].tedi-radio-card--grouped:has(input:focus-visible){z-index:5}label[tedi-radio-card].tedi-radio-card--grouped:has(input:checked){z-index:1}label[tedi-radio-card].tedi-radio-card--primary{--_card-bg: var(--form-checkbox-radio-card-primary-default-background);--_card-text: var(--form-checkbox-radio-card-primary-default-text);--_card-border: var( --form-checkbox-radio-card-primary-default-border-separate )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped{--_card-border: var( --form-checkbox-radio-card-primary-default-border-group )}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked){--_card-bg: var(--form-checkbox-radio-card-primary-selected-background);--_card-text: var(--form-checkbox-radio-card-primary-selected-text);--_card-border: var( --form-checkbox-radio-card-primary-selected-border-separate )}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked).tedi-radio-card--grouped{--_card-border: var( --form-checkbox-radio-card-primary-selected-border-group )}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked) input[tedi-radio]:not(:disabled){background-color:transparent;border-color:var(--form-checkbox-radio-default-border-selected-inverted)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked) input[tedi-radio]:not(:disabled):before{background:var(--form-checkbox-radio-default-check-indicator-default)}label[tedi-radio-card].tedi-radio-card--primary:has(input:hover:not(:disabled)){--_card-bg: var(--form-checkbox-radio-card-primary-hover-background);--_card-text: var(--form-checkbox-radio-card-primary-hover-text);--_card-border: var(--form-checkbox-radio-card-primary-hover-border)}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:not(:checked)){--_card-bg: var( --form-checkbox-radio-card-primary-disabled-default-background );--_card-text: var( --form-checkbox-radio-card-primary-disabled-default-text );--_card-border: var( --form-checkbox-radio-card-primary-disabled-default-background )}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked){--_card-bg: var( --form-checkbox-radio-card-primary-disabled-selected-background );--_card-text: var( --form-checkbox-radio-card-primary-disabled-selected-text );--_card-border: var( --form-checkbox-radio-card-primary-disabled-selected-background )}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked) input[tedi-radio]{background-color:transparent;border-color:var(--form-checkbox-radio-default-border-selected-inverted)}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked) input[tedi-radio]:before{background:var(--form-checkbox-radio-default-check-indicator-default)}label[tedi-radio-card].tedi-radio-card--secondary{--_card-bg: var(--form-checkbox-radio-card-secondary-default-background);--_card-text: var(--form-checkbox-radio-card-secondary-default-text);--_card-border: var(--form-checkbox-radio-card-secondary-default-border)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked){--_card-bg: var(--form-checkbox-radio-card-secondary-selected-background);--_card-text: var(--form-checkbox-radio-card-secondary-selected-text);--_card-border: var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_card-border)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:hover:not(:disabled)){--_card-bg: var(--form-checkbox-radio-card-secondary-hover-background);--_card-text: var(--form-checkbox-radio-card-secondary-hover-text);--_card-border: var(--form-checkbox-radio-card-secondary-hover-border)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:disabled:not(:checked)){--_card-bg: var( --form-checkbox-radio-card-secondary-disabled-default-background );--_card-text: var( --form-checkbox-radio-card-secondary-disabled-default-text );--_card-border: var( --form-checkbox-radio-card-secondary-disabled-default-border )}label[tedi-radio-card].tedi-radio-card--secondary:has(input:disabled:checked){--_card-bg: var( --form-checkbox-radio-card-secondary-disabled-selected-background );--_card-text: var( --form-checkbox-radio-card-secondary-disabled-selected-text );--_card-border: var( --form-checkbox-radio-card-secondary-disabled-selected-border );box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_card-border)}\n"] }]
-        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], grouped: [{ type: i0.Input, args: [{ isSignal: true, alias: "grouped", required: false }] }], showIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIndicator", required: false }] }] } });
+                    }, template: "<div class=\"tedi-radio-card__content\">\n  <ng-content />\n</div>\n<ng-content select=\"tedi-feedback-text\" />\n", styles: ["label[tedi-radio-card]{--form-checkbox-radio-size-responsive: var(--form-checkbox-radio-size-fixed);--_card-bg: transparent;--_card-text: inherit;--_card-border: transparent;--_card-inset: 0 0 0 0 transparent;--_card-ring: 0 0 0 0 transparent;display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-height:var(--form-field-height);padding:calc(var(--form-checkbox-radio-card-checkbox-padding-y) - var(--tedi-borders-01)) var(--form-checkbox-radio-card-checkbox-padding-x);font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--_card-text);cursor:pointer;background-color:var(--_card-bg);border:var(--tedi-borders-01) solid var(--_card-border);border-radius:var(--form-checkbox-radio-card-radius);box-shadow:var(--_card-inset),var(--_card-ring)}label[tedi-radio-card]:before,label[tedi-radio-card]:after{flex:1 1 0;max-height:calc((var(--form-field-height) - var(--body-regular-line-height)) / 2 - var(--form-checkbox-radio-card-checkbox-padding-y));content:\"\"}label[tedi-radio-card] [tedi-text],label[tedi-radio-card] tedi-icon{color:inherit}label[tedi-radio-card] input[tedi-radio],label[tedi-radio-card] tedi-icon{flex-shrink:0}label[tedi-radio-card] input[tedi-radio]{pointer-events:none}label[tedi-radio-card] .tedi-radio-card__content{display:flex;gap:var(--form-checkbox-radio-card-inner-spacing);align-items:center}label[tedi-radio-card]>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--form-checkbox-radio-card-inner-spacing));color:inherit}label[tedi-radio-card]:has(>.tedi-radio-card__content>tedi-icon)>.tedi-feedback-text{padding-left:calc(var(--form-checkbox-radio-size-responsive) + var(--icon-03) + var(--form-checkbox-radio-card-inner-spacing) * 2)}label[tedi-radio-card].tedi-radio-card--hide-indicator input[tedi-radio]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}label[tedi-radio-card].tedi-radio-card--hide-indicator>.tedi-feedback-text{padding-left:0}label[tedi-radio-card].tedi-radio-card--hide-indicator:has(>.tedi-radio-card__content>tedi-icon)>.tedi-feedback-text{padding-left:calc(var(--icon-03) + var(--form-checkbox-radio-card-inner-spacing))}label[tedi-radio-card].tedi-radio-card--grouped{border-radius:0}label[tedi-radio-card].tedi-radio-card--grouped:first-child{border-top-left-radius:var(--form-checkbox-radio-card-radius);border-bottom-left-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card].tedi-radio-card--grouped:last-child{border-top-right-radius:var(--form-checkbox-radio-card-radius);border-bottom-right-radius:var(--form-checkbox-radio-card-radius)}label[tedi-radio-card].tedi-radio-card--grouped+label[tedi-radio-card].tedi-radio-card--grouped{margin-left:-1px}label[tedi-radio-card].tedi-radio-card--grouped:has(input:focus-visible){z-index:5}label[tedi-radio-card].tedi-radio-card--grouped:has(input:checked){z-index:1}label[tedi-radio-card]:has(input:focus-visible){--_card-ring: 0 0 0 var(--tedi-borders-01) var(--general-effect-colors-focus-outset-inner-shadow), 0 0 0 var(--tedi-borders-03) var(--general-effect-colors-focus-outset-outer-shadow)}label[tedi-radio-card]:has(input:focus-visible) input[tedi-radio][type=radio]{--_radio-ring: 0 0 0 0 transparent}label[tedi-radio-card]:has(input:disabled){cursor:not-allowed}label[tedi-radio-card].tedi-radio-card--primary{--_card-bg: var(--form-choice-card-primary-unselected-background-default);--_card-text: var(--form-choice-card-primary-unselected-text-default);--_card-border: var( --form-choice-card-primary-unselected-border-borderless )}label[tedi-radio-card].tedi-radio-card--primary:has(input:hover:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-hover);--_card-text: var(--form-choice-card-primary-unselected-text-hover);--_card-border: var(--form-choice-card-primary-unselected-border-hover)}label[tedi-radio-card].tedi-radio-card--primary:has(input:active:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-active);--_card-text: var(--form-choice-card-primary-unselected-text-active);--_card-border: var(--form-choice-card-primary-unselected-border-active)}label[tedi-radio-card].tedi-radio-card--primary:has(input:focus-visible:not(:hover,:active,:disabled,:checked)){--_card-bg: var(--form-choice-card-primary-unselected-background-focus);--_card-text: var(--form-choice-card-primary-unselected-text-focus)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked){--_card-bg: var(--form-choice-card-primary-selected-background-default);--_card-text: var(--form-choice-card-primary-selected-text-default);--_card-border: var(--_card-bg)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-default);--_radio-border: var(--form-choice-radio-selected-border-inverted);--_radio-dot: var(--form-choice-radio-selected-indicator-inverted)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:hover:not(:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-hover);--_card-text: var(--form-choice-card-primary-selected-text-hover)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:hover:not(:disabled)) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-hover)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:active:not(:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-active);--_card-text: var(--form-choice-card-primary-selected-text-active)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:active:not(:disabled)) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-active)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:focus-visible:not(:hover,:active,:disabled)){--_card-bg: var(--form-choice-card-primary-selected-background-focus);--_card-text: var(--form-choice-card-primary-selected-text-focus)}label[tedi-radio-card].tedi-radio-card--primary:has(input:checked:focus-visible:not(:hover,:active,:disabled)) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-focus)}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:not(:checked)){--_card-bg: var( --form-choice-card-primary-unselected-background-disabled );--_card-text: var(--form-choice-card-primary-unselected-text-disabled);--_card-border: var( --form-choice-card-primary-unselected-border-disabled )}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked){--_card-bg: var(--form-choice-card-primary-selected-background-disabled);--_card-text: var(--form-choice-card-primary-selected-text-disabled);--_card-border: var(--_card-bg)}label[tedi-radio-card].tedi-radio-card--primary:has(input:disabled:checked) input[tedi-radio][type=radio]{--_radio-bg: var(--form-choice-inverted-indicator-disabled);--_radio-border: var(--form-choice-radio-selected-border-inverted);--_radio-dot: var(--form-choice-radio-selected-indicator-inverted)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered{--_card-border: var(--form-choice-card-primary-unselected-border-default)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered:has(input:hover:not(:disabled,:checked)){--_card-border: var(--form-choice-card-primary-unselected-border-hover)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered:has(input:active:not(:disabled,:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-active )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered:has(input:checked){--_card-border: var(--_card-bg)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--bordered:has(input:disabled:not(:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-disabled )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped{--_card-border: var(--form-choice-card-primary-unselected-border-default)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:hover:not(:disabled,:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-group-hover )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:active:not(:disabled,:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-group-active )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:checked){--_card-border: var(--form-choice-card-primary-selected-border-default)}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:checked:hover:not(:disabled)){--_card-border: var( --form-choice-card-primary-selected-border-group-hover )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:checked:active:not(:disabled)){--_card-border: var( --form-choice-card-primary-selected-border-group-active )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:disabled:not(:checked)){--_card-border: var( --form-choice-card-primary-unselected-border-disabled )}label[tedi-radio-card].tedi-radio-card--primary.tedi-radio-card--grouped:has(input:disabled:checked){--_card-border: var( --form-choice-card-primary-selected-border-group-disabled )}label[tedi-radio-card].tedi-radio-card--secondary{--_card-bg: var(--form-choice-card-secondary-unselected-background-default);--_card-text: var(--form-choice-card-secondary-unselected-text-default);--_card-border: var(--form-choice-card-secondary-unselected-border-default)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:hover:not(:disabled,:checked)){--_card-bg: var(--form-choice-card-secondary-unselected-background-hover);--_card-text: var(--form-choice-card-secondary-unselected-text-hover);--_card-border: var(--form-choice-card-secondary-unselected-border-hover)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:active:not(:disabled,:checked)){--_card-bg: var( --form-choice-card-secondary-unselected-background-active );--_card-text: var(--form-choice-card-secondary-unselected-text-active);--_card-border: var( --form-choice-card-secondary-unselected-border-active )}label[tedi-radio-card].tedi-radio-card--secondary:has(input:focus-visible:not(:hover,:active,:disabled,:checked)){--_card-bg: var(--form-choice-card-secondary-unselected-background-focus);--_card-text: var(--form-choice-card-secondary-unselected-text-focus);--_card-border: var(--form-choice-card-secondary-unselected-border-focus)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked){--_card-bg: var(--form-choice-card-secondary-selected-background-default);--_card-text: var(--form-choice-card-secondary-selected-text-default);--_card-border: var(--form-choice-card-secondary-selected-border-default);--_card-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_card-border)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked:hover:not(:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-hover);--_card-text: var(--form-choice-card-secondary-selected-text-hover);--_card-border: var(--form-choice-card-secondary-selected-border-hover)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked:active:not(:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-active);--_card-text: var(--form-choice-card-secondary-selected-text-active);--_card-border: var(--form-choice-card-secondary-selected-border-active)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:checked:focus-visible:not(:hover,:active,:disabled)){--_card-bg: var(--form-choice-card-secondary-selected-background-focus);--_card-text: var(--form-choice-card-secondary-selected-text-focus);--_card-border: var(--form-choice-card-secondary-selected-border-focus)}label[tedi-radio-card].tedi-radio-card--secondary:has(input:disabled:not(:checked)){--_card-bg: var( --form-choice-card-secondary-unselected-background-disabled );--_card-text: var(--form-choice-card-secondary-unselected-text-disabled);--_card-border: var( --form-choice-card-secondary-unselected-border-disabled )}label[tedi-radio-card].tedi-radio-card--secondary:has(input:disabled:checked){--_card-bg: var( --form-choice-card-secondary-selected-background-disabled );--_card-text: var(--form-choice-card-secondary-selected-text-disabled);--_card-border: var( --form-choice-card-secondary-selected-border-disabled );--_card-inset: inset 0 0 0 calc(var(--general-border-width-selected) - var(--tedi-borders-01)) var(--_card-border)}\n"] }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], grouped: [{ type: i0.Input, args: [{ isSignal: true, alias: "grouped", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], showIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIndicator", required: false }] }] } });
 class DateInputComponent {
     inputId = input.required(...(ngDevMode ? [{ debugName: "inputId" }] : []));
@@ -15916,6 +16067,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                             read: ElementRef,
                         }, isSignal: true }] }], textField: [{ type: i0.ViewChild, args: [i0.forwardRef(() => TextFieldComponent), { isSignal: true }] }] } });
+/**
+ * Gap in px between a form field and its dropdown panel. Internal: not exported
+ * from the package.
+ */
+const FIELD_OVERLAY_GAP = 4;
 class DateFieldModalComponent {
     data = inject(MODAL_DATA);
     ref = inject((ModalRef));
@@ -16268,10 +16425,30 @@ class DateFieldComponent {
             ? { originX: "start", overlayX: "start" }
             : { originX: "end", overlayX: "end" };
         return [
-            { ...aligned, originY: "bottom", overlayY: "top", offsetY: 4 },
-            { ...aligned, originY: "top", overlayY: "bottom", offsetY: -4 },
-            { ...opposite, originY: "bottom", overlayY: "top", offsetY: 4 },
-            { ...opposite, originY: "top", overlayY: "bottom", offsetY: -4 },
+            {
+                ...aligned,
+                originY: "bottom",
+                overlayY: "top",
+                offsetY: FIELD_OVERLAY_GAP,
+            },
+            {
+                ...aligned,
+                originY: "top",
+                overlayY: "bottom",
+                offsetY: -FIELD_OVERLAY_GAP,
+            },
+            {
+                ...opposite,
+                originY: "bottom",
+                overlayY: "top",
+                offsetY: FIELD_OVERLAY_GAP,
+            },
+            {
+                ...opposite,
+                originY: "top",
+                overlayY: "bottom",
+                offsetY: -FIELD_OVERLAY_GAP,
+            },
         ];
     }, ...(ngDevMode ? [{ debugName: "overlayPositions" }] : []));
     /**
@@ -17713,7 +17890,7 @@ class DatePickerComponent {
                 useExisting: forwardRef(() => DatePickerComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }, { propertyName: "calendarGrid", first: true, predicate: ["gridElement"], descendants: true, isSignal: true }, { propertyName: "popover", first: true, predicate: PopoverComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<input\n  #inputElement\n  type=\"text\"\n  class=\"tedi-date-picker__input\"\n  role=\"combobox\"\n  aria-autocomplete=\"none\"\n  aria-haspopup=\"dialog\"\n  [class.tedi-date-picker__input--small]=\"inputSize() === 'small'\"\n  [class.tedi-date-picker__input--valid]=\"inputState() === 'valid'\"\n  [class.tedi-date-picker__input--error]=\"inputState() === 'error'\"\n  [attr.id]=\"inputId()\"\n  [attr.placeholder]=\"inputPlaceholder()\"\n  [attr.aria-expanded]=\"!fieldDisabled() && popover().isOpen()\"\n  [attr.aria-controls]=\"uniqueId\"\n  [attr.aria-readonly]=\"!allowManualInput()\"\n  [readOnly]=\"!allowManualInput()\"\n  [value]=\"inputValue()\"\n  [disabled]=\"fieldDisabled()\"\n  (input)=\"onInput($event)\"\n  (blur)=\"onInputBlur()\"\n  (click)=\"onInputClick()\"\n/>\n<div class=\"tedi-date-picker__input-buttons\">\n  @if (selected()) {\n    <button\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      class=\"tedi-date-picker__clear\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'date-picker.clear-date' | tediTranslate\"\n      [disabled]=\"fieldDisabled()\"\n      (click)=\"clearInput()\"\n    ></button>\n    <tedi-separator axis=\"vertical\" size=\"1rem\" />\n  }\n  <tedi-popover\n    style=\"display: flex; align-items: center\"\n    position=\"bottom-end\"\n    [withArrow]=\"false\"\n    [preventOverflow]=\"true\"\n  >\n    <button\n      tedi-button\n      tedi-popover-trigger\n      type=\"button\"\n      variant=\"neutral\"\n      size=\"small\"\n      class=\"tedi-date-picker__toggle\"\n      [attr.aria-label]=\"'date-picker.open-calendar' | tediTranslate\"\n      [disabled]=\"fieldDisabled()\"\n      (click)=\"openCalendar()\"\n    >\n      <tedi-icon name=\"calendar_today\" size=\"inherit\" />\n    </button>\n    <tedi-popover-content maxWidth=\"none\" style=\"padding: 0\">\n      <div\n        class=\"tedi-date-picker__calendar\"\n        (keydown)=\"onCalendarKeyDown($event)\"\n      >\n        <tedi-date-picker-header\n          [uniqueId]=\"uniqueId\"\n          [currentView]=\"currentView()\"\n          [month]=\"month()\"\n          [monthMode]=\"monthMode()\"\n          [yearMode]=\"yearMode()\"\n          [showNavigation]=\"showNavigation()\"\n          [canGoPrev]=\"canGoPrev()\"\n          [canGoNext]=\"canGoNext()\"\n          [selectedYear]=\"selectedYear()\"\n          [years]=\"years()\"\n          [pagedYears]=\"pagedYears()\"\n          [hasPrevYearPage]=\"hasPrevYearPage()\"\n          [hasNextYearPage]=\"hasNextYearPage()\"\n          [disabledMonths]=\"disabledMonths()\"\n          [disabledYears]=\"disabledYears()\"\n          (prevMonth)=\"prevMonth()\"\n          (nextMonth)=\"nextMonth()\"\n          (monthSelect)=\"onMonthSelect($event)\"\n          (yearSelect)=\"onYearSelect($event)\"\n          (monthClick)=\"onMonthClick()\"\n          (yearClick)=\"onYearClick()\"\n          (prevYearPage)=\"prevYearPage()\"\n          (nextYearPage)=\"nextYearPage()\"\n        />\n\n        @if (currentView() === \"calendar-grid\") {\n          <tedi-date-picker-calendar-grid\n            #gridElement\n            [gridId]=\"uniqueId\"\n            [weekRows]=\"weekRows()\"\n            [weekNumbers]=\"weekNumbers()\"\n            [showWeekNumbers]=\"showWeekNumbers()\"\n            [activeDate]=\"activeDate()\"\n            [selected]=\"selected()\"\n            [today]=\"today\"\n            (daySelect)=\"selectDay($event)\"\n            (dayKeydown)=\"onDayKeydown($event.event, $event.date)\"\n          />\n        } @else if (currentView() === \"month-grid\") {\n          <tedi-date-picker-month-grid\n            [currentMonth]=\"month()\"\n            (monthSelect)=\"onMonthSelect($event)\"\n          />\n        } @else if (currentView() === \"year-grid\") {\n          <tedi-date-picker-year-grid\n            [pagedYears]=\"pagedYears()\"\n            [selectedYear]=\"selectedYear()\"\n            (yearSelect)=\"onYearSelect($event)\"\n          />\n        }\n      </div>\n    </tedi-popover-content>\n  </tedi-popover>\n</div>\n", styles: ["tedi-date-picker{display:flex;gap:var(--form-field-inner-spacing);align-self:stretch;min-height:var(--form-field-height);padding-right:var(--form-field-padding-x-md-default);background:var(--form-input-background-default);border:var(--tedi-borders-01) solid var(--form-input-border-default);border-radius:var(--form-field-radius)}tedi-date-picker:has(.tedi-date-picker__input:hover):not(:has(.tedi-date-picker__input:disabled)){border-color:var(--form-input-border-hover)}tedi-date-picker:has(.tedi-date-picker__input:active):not(:has(.tedi-date-picker__input:disabled)),tedi-date-picker:has(.tedi-date-picker__input:focus):not(:has(.tedi-date-picker__input:disabled)){border-color:var(--form-input-border-active);box-shadow:inset 0 0 0 1px var(--form-input-border-active)}tedi-date-picker:has(.tedi-date-picker__input:disabled){cursor:not-allowed;background:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}tedi-date-picker:has(.tedi-date-picker__input--valid){border-color:var(--form-general-feedback-success-border)}tedi-date-picker:has(.tedi-date-picker__input--error){border-color:var(--form-general-feedback-error-border)}tedi-date-picker:has(.tedi-date-picker__input--small){min-height:var(--form-field-height-sm)}.tedi-date-picker__input{flex:1;min-width:0;padding-left:var(--form-field-padding-x-md-default);font-size:var(--body-regular-size);color:var(--form-input-text-filled);outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-date-picker__input::placeholder{color:var(--form-input-text-placeholder)}.tedi-date-picker__input:disabled{cursor:not-allowed;background:transparent}.tedi-date-picker__input-buttons{display:flex;gap:var(--layout-grid-gutters-04);align-items:center;align-self:center;justify-content:center;min-width:0}.tedi-date-picker__clear:disabled{cursor:not-allowed}.tedi-date-picker__toggle{width:var(--button-xs-icon-size)!important;height:var(--form-field-button-height-sm)!important;font-size:1.125rem!important;border-radius:var(--button-radius-sm)!important}.tedi-date-picker__toggle:disabled{cursor:not-allowed}.tedi-date-picker__calendar{display:block;width:fit-content;-webkit-user-select:none;user-select:none;background:var(--card-background-primary);border-radius:var(--card-radius-rounded)}.tedi-date-picker__header{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default) var(--card-padding-md-default) var(--card-padding-xs) var(--card-padding-md-default)}.tedi-date-picker__controls{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;margin:0 auto}.tedi-date-picker__dropdown-trigger{display:inline-flex;gap:var(--layout-grid-gutters-02);align-items:center;padding:0;padding-left:var(--layout-grid-gutters-04);font-size:1rem;font-weight:500;color:var(--general-text-primary);cursor:pointer;background:transparent;border:0;border-radius:var(--button-radius-sm)}.tedi-date-picker__dropdown-trigger:hover{color:var(--button-main-neutral-text-hover);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-date-picker__dropdown-trigger:hover tedi-icon{color:var(--button-main-neutral-text-hover)}.tedi-date-picker__dropdown-trigger:active{color:var(--button-main-neutral-text-active);background:var(--button-main-neutral-icon-only-background-active)}.tedi-date-picker__dropdown-trigger:active tedi-icon{color:var(--button-main-neutral-text-active)}.tedi-date-picker__dropdown-trigger:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__dropdown-trigger tedi-icon{font-size:2rem;color:var(--general-icon-tertiary)}.tedi-date-picker__dropdown-content{max-height:15rem}.tedi-date-picker__dropdown-content--month{width:10rem}.tedi-date-picker__dropdown-content--year{width:8.75rem}.tedi-date-picker__label{font-weight:500;color:var(--general-text-primary)}.tedi-date-picker__nav{font-size:var(--button-icon-inner-icon-only-size)!important}.tedi-date-picker__weekdays{display:grid;grid-template-columns:repeat(7,1fr);padding:0 var(--card-padding-md-default)}.tedi-date-picker__weekdays--numbered{grid-template-columns:repeat(8,1fr)}.tedi-date-picker__weekday{display:flex;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);text-align:center;text-transform:uppercase;border-bottom:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-date-picker__grid{display:flex;flex-direction:column;padding:0 var(--card-padding-md-default) var(--card-padding-md-default) var(--card-padding-md-default)}.tedi-date-picker__row{display:grid;grid-template-columns:repeat(7,1fr)}.tedi-date-picker__row--numbered{grid-template-columns:repeat(8,1fr)}.tedi-date-picker__weeknumber{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);border-right:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-date-picker__day{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-regular-size);color:var(--general-text-primary);cursor:pointer;background:none;border:none;border-radius:var(--button-radius-sm)}.tedi-date-picker__day:hover{background:var(--form-datepicker-date-hover)}.tedi-date-picker__day:active{background:var(--form-datepicker-date-active)}.tedi-date-picker__day:disabled{cursor:not-allowed;opacity:.3}.tedi-date-picker__day:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__day--other-month{color:var(--form-datepicker-date-text-muted)}.tedi-date-picker__day--selected{color:var(--form-datepicker-date-text-selected);background:var(--form-datepicker-date-selected);border-radius:var(--button-radius-sm)}.tedi-date-picker__day--selected:hover{background:var(--form-datepicker-date-selected)}.tedi-date-picker__day--selected .tedi-date-picker__today{border-color:var(--form-datepicker-today-border-secondary)}.tedi-date-picker__today{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);border:var(--tedi-borders-01) solid var(--form-datepicker-today-border);border-radius:var(--button-radius-default)}.tedi-date-picker__month-year-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--layout-grid-gutters-08);padding:var(--card-padding-md-default)}.tedi-date-picker__month-year-button{display:flex;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-checkbox-radio-card-primary-default-text);background:var(--form-checkbox-radio-card-secondary-default-background);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-card-secondary-default-border);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-date-picker__month-year-button:hover{color:var(--form-checkbox-radio-card-secondary-hover-text);background:var(--form-checkbox-radio-card-secondary-hover-background);border-color:var(--form-checkbox-radio-card-secondary-hover-border)}.tedi-date-picker__month-year-button:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__month-year-button:disabled{color:var(--form-checkbox-radio-card-secondary-disabled-default-text);cursor:not-allowed;background:var(--form-checkbox-radio-card-secondary-disabled-default-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-default-border)}.tedi-date-picker__month-year-button--selected{color:var(--form-checkbox-radio-card-secondary-selected-text);background:var(--form-checkbox-radio-card-secondary-selected-background);border-color:var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-selected-border)}.tedi-date-picker__month-year-button--selected:disabled{color:var(--form-checkbox-radio-card-secondary-disabled-selected-text);cursor:not-allowed;background:var(--form-checkbox-radio-card-secondary-disabled-selected-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-disabled-selected-border)}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: SeparatorComponent, selector: "tedi-separator", inputs: ["axis", "color", "variant", "dotSize", "dotFilled", "thickness", "spacing", "size"] }, { kind: "component", type: PopoverComponent, selector: "tedi-popover", inputs: ["position", "preventOverflow", "dismissible", "hideOnScroll", "withBorder", "withArrow", "lockScroll", "timeoutDelay", "offset"] }, { kind: "directive", type: PopoverTriggerDirective, selector: "[tedi-popover-trigger]", inputs: ["underline", "interactive"] }, { kind: "component", type: PopoverContentComponent, selector: "tedi-popover-content", inputs: ["maxWidth", "title", "showClose"] }, { kind: "component", type: DatePickerHeaderComponent, selector: "tedi-date-picker-header", inputs: ["uniqueId", "currentView", "month", "monthMode", "yearMode", "showNavigation", "canGoPrev", "canGoNext", "selectedYear", "years", "pagedYears", "hasPrevYearPage", "hasNextYearPage", "disabledMonths", "disabledYears"], outputs: ["prevMonth", "nextMonth", "monthSelect", "yearSelect", "monthClick", "yearClick", "prevYearPage", "nextYearPage"] }, { kind: "component", type: DatePickerCalendarGridComponent, selector: "tedi-date-picker-calendar-grid", inputs: ["gridId", "weekRows", "weekNumbers", "showWeekNumbers", "activeDate", "selected", "today"], outputs: ["daySelect", "dayKeydown"] }, { kind: "component", type: DatePickerMonthGridComponent, selector: "tedi-date-picker-month-grid", inputs: ["currentMonth"], outputs: ["monthSelect"] }, { kind: "component", type: DatePickerYearGridComponent, selector: "tedi-date-picker-year-grid", inputs: ["pagedYears", "selectedYear"], outputs: ["yearSelect"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }, { propertyName: "calendarGrid", first: true, predicate: ["gridElement"], descendants: true, isSignal: true }, { propertyName: "popover", first: true, predicate: PopoverComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<input\n  #inputElement\n  type=\"text\"\n  class=\"tedi-date-picker__input\"\n  role=\"combobox\"\n  aria-autocomplete=\"none\"\n  aria-haspopup=\"dialog\"\n  [class.tedi-date-picker__input--small]=\"inputSize() === 'small'\"\n  [class.tedi-date-picker__input--valid]=\"inputState() === 'valid'\"\n  [class.tedi-date-picker__input--error]=\"inputState() === 'error'\"\n  [attr.id]=\"inputId()\"\n  [attr.placeholder]=\"inputPlaceholder()\"\n  [attr.aria-expanded]=\"!fieldDisabled() && popover().isOpen()\"\n  [attr.aria-controls]=\"uniqueId\"\n  [attr.aria-readonly]=\"!allowManualInput()\"\n  [readOnly]=\"!allowManualInput()\"\n  [value]=\"inputValue()\"\n  [disabled]=\"fieldDisabled()\"\n  (input)=\"onInput($event)\"\n  (blur)=\"onInputBlur()\"\n  (click)=\"onInputClick()\"\n/>\n<div class=\"tedi-date-picker__input-buttons\">\n  @if (selected()) {\n    <button\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      class=\"tedi-date-picker__clear\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'date-picker.clear-date' | tediTranslate\"\n      [disabled]=\"fieldDisabled()\"\n      (click)=\"clearInput()\"\n    ></button>\n    <tedi-separator axis=\"vertical\" size=\"1rem\" />\n  }\n  <tedi-popover\n    style=\"display: flex; align-items: center\"\n    position=\"bottom-end\"\n    [withArrow]=\"false\"\n    [preventOverflow]=\"true\"\n  >\n    <button\n      tedi-button\n      tedi-popover-trigger\n      type=\"button\"\n      variant=\"neutral\"\n      size=\"small\"\n      class=\"tedi-date-picker__toggle\"\n      [attr.aria-label]=\"'date-picker.open-calendar' | tediTranslate\"\n      [disabled]=\"fieldDisabled()\"\n      (click)=\"openCalendar()\"\n    >\n      <tedi-icon name=\"calendar_today\" size=\"inherit\" />\n    </button>\n    <tedi-popover-content maxWidth=\"none\" style=\"padding: 0\">\n      <div\n        class=\"tedi-date-picker__calendar\"\n        (keydown)=\"onCalendarKeyDown($event)\"\n      >\n        <tedi-date-picker-header\n          [uniqueId]=\"uniqueId\"\n          [currentView]=\"currentView()\"\n          [month]=\"month()\"\n          [monthMode]=\"monthMode()\"\n          [yearMode]=\"yearMode()\"\n          [showNavigation]=\"showNavigation()\"\n          [canGoPrev]=\"canGoPrev()\"\n          [canGoNext]=\"canGoNext()\"\n          [selectedYear]=\"selectedYear()\"\n          [years]=\"years()\"\n          [pagedYears]=\"pagedYears()\"\n          [hasPrevYearPage]=\"hasPrevYearPage()\"\n          [hasNextYearPage]=\"hasNextYearPage()\"\n          [disabledMonths]=\"disabledMonths()\"\n          [disabledYears]=\"disabledYears()\"\n          (prevMonth)=\"prevMonth()\"\n          (nextMonth)=\"nextMonth()\"\n          (monthSelect)=\"onMonthSelect($event)\"\n          (yearSelect)=\"onYearSelect($event)\"\n          (monthClick)=\"onMonthClick()\"\n          (yearClick)=\"onYearClick()\"\n          (prevYearPage)=\"prevYearPage()\"\n          (nextYearPage)=\"nextYearPage()\"\n        />\n\n        @if (currentView() === \"calendar-grid\") {\n          <tedi-date-picker-calendar-grid\n            #gridElement\n            [gridId]=\"uniqueId\"\n            [weekRows]=\"weekRows()\"\n            [weekNumbers]=\"weekNumbers()\"\n            [showWeekNumbers]=\"showWeekNumbers()\"\n            [activeDate]=\"activeDate()\"\n            [selected]=\"selected()\"\n            [today]=\"today\"\n            (daySelect)=\"selectDay($event)\"\n            (dayKeydown)=\"onDayKeydown($event.event, $event.date)\"\n          />\n        } @else if (currentView() === \"month-grid\") {\n          <tedi-date-picker-month-grid\n            [currentMonth]=\"month()\"\n            (monthSelect)=\"onMonthSelect($event)\"\n          />\n        } @else if (currentView() === \"year-grid\") {\n          <tedi-date-picker-year-grid\n            [pagedYears]=\"pagedYears()\"\n            [selectedYear]=\"selectedYear()\"\n            (yearSelect)=\"onYearSelect($event)\"\n          />\n        }\n      </div>\n    </tedi-popover-content>\n  </tedi-popover>\n</div>\n", styles: ["tedi-date-picker{display:flex;gap:var(--form-field-inner-spacing);align-self:stretch;min-height:var(--form-field-height);padding-right:var(--form-field-padding-x-md-default);background:var(--form-input-background-default);border:var(--tedi-borders-01) solid var(--form-input-border-default);border-radius:var(--form-field-radius)}tedi-date-picker:has(.tedi-date-picker__input:hover):not(:has(.tedi-date-picker__input:disabled)){border-color:var(--form-input-border-hover)}tedi-date-picker:has(.tedi-date-picker__input:active):not(:has(.tedi-date-picker__input:disabled)),tedi-date-picker:has(.tedi-date-picker__input:focus):not(:has(.tedi-date-picker__input:disabled)){border-color:var(--form-input-border-active);box-shadow:inset 0 0 0 1px var(--form-input-border-active)}tedi-date-picker:has(.tedi-date-picker__input:disabled){cursor:not-allowed;background:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}tedi-date-picker:has(.tedi-date-picker__input--valid){border-color:var(--form-general-feedback-success-border)}tedi-date-picker:has(.tedi-date-picker__input--error){border-color:var(--form-general-feedback-error-border)}tedi-date-picker:has(.tedi-date-picker__input--small){min-height:var(--form-field-height-sm)}.tedi-date-picker__input{flex:1;min-width:0;padding-left:var(--form-field-padding-x-md-default);font-size:var(--body-regular-size);color:var(--form-input-text-filled);outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-date-picker__input::placeholder{color:var(--form-input-text-placeholder)}.tedi-date-picker__input:disabled{cursor:not-allowed;background:transparent}.tedi-date-picker__input-buttons{display:flex;gap:var(--layout-grid-gutters-04);align-items:center;align-self:center;justify-content:center;min-width:0}.tedi-date-picker__clear:disabled{cursor:not-allowed}.tedi-date-picker__toggle{width:var(--button-xs-icon-size)!important;height:var(--form-field-button-height-sm)!important;font-size:1.125rem!important;border-radius:var(--button-radius-sm)!important}.tedi-date-picker__toggle:disabled{cursor:not-allowed}.tedi-date-picker__calendar{display:block;width:fit-content;-webkit-user-select:none;user-select:none;background:var(--card-background-primary);border-radius:var(--card-radius-rounded)}.tedi-date-picker__header{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default) var(--card-padding-md-default) var(--card-padding-xs) var(--card-padding-md-default)}.tedi-date-picker__controls{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;margin:0 auto}.tedi-date-picker__dropdown-trigger{display:inline-flex;gap:var(--layout-grid-gutters-02);align-items:center;padding:0;padding-left:var(--layout-grid-gutters-04);font-size:1rem;font-weight:500;color:var(--general-text-primary);cursor:pointer;background:transparent;border:0;border-radius:var(--button-radius-sm)}.tedi-date-picker__dropdown-trigger:hover{color:var(--button-main-neutral-text-hover);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-date-picker__dropdown-trigger:hover tedi-icon{color:var(--button-main-neutral-text-hover)}.tedi-date-picker__dropdown-trigger:active{color:var(--button-main-neutral-text-active);background:var(--button-main-neutral-icon-only-background-active)}.tedi-date-picker__dropdown-trigger:active tedi-icon{color:var(--button-main-neutral-text-active)}.tedi-date-picker__dropdown-trigger:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__dropdown-trigger tedi-icon{font-size:2rem;color:var(--general-icon-tertiary)}.tedi-date-picker__dropdown-content{max-height:15rem}.tedi-date-picker__dropdown-content--month{width:10rem}.tedi-date-picker__dropdown-content--year{width:8.75rem}.tedi-date-picker__label{font-weight:500;color:var(--general-text-primary)}.tedi-date-picker__nav{font-size:var(--button-icon-inner-icon-only-size)!important}.tedi-date-picker__weekdays{display:grid;grid-template-columns:repeat(7,1fr);padding:0 var(--card-padding-md-default)}.tedi-date-picker__weekdays--numbered{grid-template-columns:repeat(8,1fr)}.tedi-date-picker__weekday{display:flex;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);text-align:center;text-transform:uppercase;border-bottom:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-date-picker__grid{display:flex;flex-direction:column;padding:0 var(--card-padding-md-default) var(--card-padding-md-default) var(--card-padding-md-default)}.tedi-date-picker__row{display:grid;grid-template-columns:repeat(7,1fr)}.tedi-date-picker__row--numbered{grid-template-columns:repeat(8,1fr)}.tedi-date-picker__weeknumber{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);border-right:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-date-picker__day{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-regular-size);color:var(--general-text-primary);cursor:pointer;background:none;border:none;border-radius:var(--button-radius-sm)}.tedi-date-picker__day:hover{background:var(--form-datepicker-date-hover)}.tedi-date-picker__day:active{background:var(--form-datepicker-date-active)}.tedi-date-picker__day:disabled{cursor:not-allowed;opacity:.3}.tedi-date-picker__day:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__day--other-month{color:var(--form-datepicker-date-text-muted)}.tedi-date-picker__day--selected{color:var(--form-datepicker-date-text-selected);background:var(--form-datepicker-date-selected);border-radius:var(--button-radius-sm)}.tedi-date-picker__day--selected:hover{background:var(--form-datepicker-date-selected)}.tedi-date-picker__day--selected .tedi-date-picker__today{border-color:var(--form-datepicker-today-border-secondary)}.tedi-date-picker__today{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);border:var(--tedi-borders-01) solid var(--form-datepicker-today-border);border-radius:var(--button-radius-default)}.tedi-date-picker__month-year-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--layout-grid-gutters-08);padding:var(--card-padding-md-default)}.tedi-date-picker__month-year-button{display:flex;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-choice-card-primary-unselected-text-default);background:var(--form-choice-card-secondary-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-card-secondary-unselected-border-default);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-date-picker__month-year-button:hover{color:var(--form-choice-card-secondary-unselected-text-hover);background:var(--form-choice-card-secondary-unselected-background-hover);border-color:var(--form-choice-card-secondary-unselected-border-hover)}.tedi-date-picker__month-year-button:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__month-year-button:disabled{color:var(--form-choice-card-secondary-unselected-text-disabled);cursor:not-allowed;background:var(--form-choice-card-secondary-unselected-background-disabled);border-color:var(--form-choice-card-secondary-unselected-border-disabled)}.tedi-date-picker__month-year-button--selected{color:var(--form-choice-card-secondary-selected-text-default);background:var(--form-choice-card-secondary-selected-background-default);border-color:var(--form-choice-card-secondary-selected-border-default);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-default)}.tedi-date-picker__month-year-button--selected:disabled{color:var(--form-choice-card-secondary-selected-text-disabled);cursor:not-allowed;background:var(--form-choice-card-secondary-selected-background-disabled);border-color:var(--form-choice-card-secondary-selected-border-disabled);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-disabled)}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: SeparatorComponent, selector: "tedi-separator", inputs: ["axis", "color", "variant", "dotSize", "dotFilled", "thickness", "spacing", "size"] }, { kind: "component", type: PopoverComponent, selector: "tedi-popover", inputs: ["position", "preventOverflow", "dismissible", "hideOnScroll", "withBorder", "withArrow", "lockScroll", "timeoutDelay", "offset"] }, { kind: "directive", type: PopoverTriggerDirective, selector: "[tedi-popover-trigger]", inputs: ["underline", "interactive"] }, { kind: "component", type: PopoverContentComponent, selector: "tedi-popover-content", inputs: ["maxWidth", "title", "showClose"] }, { kind: "component", type: DatePickerHeaderComponent, selector: "tedi-date-picker-header", inputs: ["uniqueId", "currentView", "month", "monthMode", "yearMode", "showNavigation", "canGoPrev", "canGoNext", "selectedYear", "years", "pagedYears", "hasPrevYearPage", "hasNextYearPage", "disabledMonths", "disabledYears"], outputs: ["prevMonth", "nextMonth", "monthSelect", "yearSelect", "monthClick", "yearClick", "prevYearPage", "nextYearPage"] }, { kind: "component", type: DatePickerCalendarGridComponent, selector: "tedi-date-picker-calendar-grid", inputs: ["gridId", "weekRows", "weekNumbers", "showWeekNumbers", "activeDate", "selected", "today"], outputs: ["daySelect", "dayKeydown"] }, { kind: "component", type: DatePickerMonthGridComponent, selector: "tedi-date-picker-month-grid", inputs: ["currentMonth"], outputs: ["monthSelect"] }, { kind: "component", type: DatePickerYearGridComponent, selector: "tedi-date-picker-year-grid", inputs: ["pagedYears", "selectedYear"], outputs: ["yearSelect"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: DatePickerComponent, decorators: [{
             type: Component,
@@ -17736,7 +17913,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                             useExisting: forwardRef(() => DatePickerComponent),
                             multi: true,
                         },
-                    ], template: "<input\n  #inputElement\n  type=\"text\"\n  class=\"tedi-date-picker__input\"\n  role=\"combobox\"\n  aria-autocomplete=\"none\"\n  aria-haspopup=\"dialog\"\n  [class.tedi-date-picker__input--small]=\"inputSize() === 'small'\"\n  [class.tedi-date-picker__input--valid]=\"inputState() === 'valid'\"\n  [class.tedi-date-picker__input--error]=\"inputState() === 'error'\"\n  [attr.id]=\"inputId()\"\n  [attr.placeholder]=\"inputPlaceholder()\"\n  [attr.aria-expanded]=\"!fieldDisabled() && popover().isOpen()\"\n  [attr.aria-controls]=\"uniqueId\"\n  [attr.aria-readonly]=\"!allowManualInput()\"\n  [readOnly]=\"!allowManualInput()\"\n  [value]=\"inputValue()\"\n  [disabled]=\"fieldDisabled()\"\n  (input)=\"onInput($event)\"\n  (blur)=\"onInputBlur()\"\n  (click)=\"onInputClick()\"\n/>\n<div class=\"tedi-date-picker__input-buttons\">\n  @if (selected()) {\n    <button\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      class=\"tedi-date-picker__clear\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'date-picker.clear-date' | tediTranslate\"\n      [disabled]=\"fieldDisabled()\"\n      (click)=\"clearInput()\"\n    ></button>\n    <tedi-separator axis=\"vertical\" size=\"1rem\" />\n  }\n  <tedi-popover\n    style=\"display: flex; align-items: center\"\n    position=\"bottom-end\"\n    [withArrow]=\"false\"\n    [preventOverflow]=\"true\"\n  >\n    <button\n      tedi-button\n      tedi-popover-trigger\n      type=\"button\"\n      variant=\"neutral\"\n      size=\"small\"\n      class=\"tedi-date-picker__toggle\"\n      [attr.aria-label]=\"'date-picker.open-calendar' | tediTranslate\"\n      [disabled]=\"fieldDisabled()\"\n      (click)=\"openCalendar()\"\n    >\n      <tedi-icon name=\"calendar_today\" size=\"inherit\" />\n    </button>\n    <tedi-popover-content maxWidth=\"none\" style=\"padding: 0\">\n      <div\n        class=\"tedi-date-picker__calendar\"\n        (keydown)=\"onCalendarKeyDown($event)\"\n      >\n        <tedi-date-picker-header\n          [uniqueId]=\"uniqueId\"\n          [currentView]=\"currentView()\"\n          [month]=\"month()\"\n          [monthMode]=\"monthMode()\"\n          [yearMode]=\"yearMode()\"\n          [showNavigation]=\"showNavigation()\"\n          [canGoPrev]=\"canGoPrev()\"\n          [canGoNext]=\"canGoNext()\"\n          [selectedYear]=\"selectedYear()\"\n          [years]=\"years()\"\n          [pagedYears]=\"pagedYears()\"\n          [hasPrevYearPage]=\"hasPrevYearPage()\"\n          [hasNextYearPage]=\"hasNextYearPage()\"\n          [disabledMonths]=\"disabledMonths()\"\n          [disabledYears]=\"disabledYears()\"\n          (prevMonth)=\"prevMonth()\"\n          (nextMonth)=\"nextMonth()\"\n          (monthSelect)=\"onMonthSelect($event)\"\n          (yearSelect)=\"onYearSelect($event)\"\n          (monthClick)=\"onMonthClick()\"\n          (yearClick)=\"onYearClick()\"\n          (prevYearPage)=\"prevYearPage()\"\n          (nextYearPage)=\"nextYearPage()\"\n        />\n\n        @if (currentView() === \"calendar-grid\") {\n          <tedi-date-picker-calendar-grid\n            #gridElement\n            [gridId]=\"uniqueId\"\n            [weekRows]=\"weekRows()\"\n            [weekNumbers]=\"weekNumbers()\"\n            [showWeekNumbers]=\"showWeekNumbers()\"\n            [activeDate]=\"activeDate()\"\n            [selected]=\"selected()\"\n            [today]=\"today\"\n            (daySelect)=\"selectDay($event)\"\n            (dayKeydown)=\"onDayKeydown($event.event, $event.date)\"\n          />\n        } @else if (currentView() === \"month-grid\") {\n          <tedi-date-picker-month-grid\n            [currentMonth]=\"month()\"\n            (monthSelect)=\"onMonthSelect($event)\"\n          />\n        } @else if (currentView() === \"year-grid\") {\n          <tedi-date-picker-year-grid\n            [pagedYears]=\"pagedYears()\"\n            [selectedYear]=\"selectedYear()\"\n            (yearSelect)=\"onYearSelect($event)\"\n          />\n        }\n      </div>\n    </tedi-popover-content>\n  </tedi-popover>\n</div>\n", styles: ["tedi-date-picker{display:flex;gap:var(--form-field-inner-spacing);align-self:stretch;min-height:var(--form-field-height);padding-right:var(--form-field-padding-x-md-default);background:var(--form-input-background-default);border:var(--tedi-borders-01) solid var(--form-input-border-default);border-radius:var(--form-field-radius)}tedi-date-picker:has(.tedi-date-picker__input:hover):not(:has(.tedi-date-picker__input:disabled)){border-color:var(--form-input-border-hover)}tedi-date-picker:has(.tedi-date-picker__input:active):not(:has(.tedi-date-picker__input:disabled)),tedi-date-picker:has(.tedi-date-picker__input:focus):not(:has(.tedi-date-picker__input:disabled)){border-color:var(--form-input-border-active);box-shadow:inset 0 0 0 1px var(--form-input-border-active)}tedi-date-picker:has(.tedi-date-picker__input:disabled){cursor:not-allowed;background:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}tedi-date-picker:has(.tedi-date-picker__input--valid){border-color:var(--form-general-feedback-success-border)}tedi-date-picker:has(.tedi-date-picker__input--error){border-color:var(--form-general-feedback-error-border)}tedi-date-picker:has(.tedi-date-picker__input--small){min-height:var(--form-field-height-sm)}.tedi-date-picker__input{flex:1;min-width:0;padding-left:var(--form-field-padding-x-md-default);font-size:var(--body-regular-size);color:var(--form-input-text-filled);outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-date-picker__input::placeholder{color:var(--form-input-text-placeholder)}.tedi-date-picker__input:disabled{cursor:not-allowed;background:transparent}.tedi-date-picker__input-buttons{display:flex;gap:var(--layout-grid-gutters-04);align-items:center;align-self:center;justify-content:center;min-width:0}.tedi-date-picker__clear:disabled{cursor:not-allowed}.tedi-date-picker__toggle{width:var(--button-xs-icon-size)!important;height:var(--form-field-button-height-sm)!important;font-size:1.125rem!important;border-radius:var(--button-radius-sm)!important}.tedi-date-picker__toggle:disabled{cursor:not-allowed}.tedi-date-picker__calendar{display:block;width:fit-content;-webkit-user-select:none;user-select:none;background:var(--card-background-primary);border-radius:var(--card-radius-rounded)}.tedi-date-picker__header{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default) var(--card-padding-md-default) var(--card-padding-xs) var(--card-padding-md-default)}.tedi-date-picker__controls{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;margin:0 auto}.tedi-date-picker__dropdown-trigger{display:inline-flex;gap:var(--layout-grid-gutters-02);align-items:center;padding:0;padding-left:var(--layout-grid-gutters-04);font-size:1rem;font-weight:500;color:var(--general-text-primary);cursor:pointer;background:transparent;border:0;border-radius:var(--button-radius-sm)}.tedi-date-picker__dropdown-trigger:hover{color:var(--button-main-neutral-text-hover);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-date-picker__dropdown-trigger:hover tedi-icon{color:var(--button-main-neutral-text-hover)}.tedi-date-picker__dropdown-trigger:active{color:var(--button-main-neutral-text-active);background:var(--button-main-neutral-icon-only-background-active)}.tedi-date-picker__dropdown-trigger:active tedi-icon{color:var(--button-main-neutral-text-active)}.tedi-date-picker__dropdown-trigger:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__dropdown-trigger tedi-icon{font-size:2rem;color:var(--general-icon-tertiary)}.tedi-date-picker__dropdown-content{max-height:15rem}.tedi-date-picker__dropdown-content--month{width:10rem}.tedi-date-picker__dropdown-content--year{width:8.75rem}.tedi-date-picker__label{font-weight:500;color:var(--general-text-primary)}.tedi-date-picker__nav{font-size:var(--button-icon-inner-icon-only-size)!important}.tedi-date-picker__weekdays{display:grid;grid-template-columns:repeat(7,1fr);padding:0 var(--card-padding-md-default)}.tedi-date-picker__weekdays--numbered{grid-template-columns:repeat(8,1fr)}.tedi-date-picker__weekday{display:flex;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);text-align:center;text-transform:uppercase;border-bottom:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-date-picker__grid{display:flex;flex-direction:column;padding:0 var(--card-padding-md-default) var(--card-padding-md-default) var(--card-padding-md-default)}.tedi-date-picker__row{display:grid;grid-template-columns:repeat(7,1fr)}.tedi-date-picker__row--numbered{grid-template-columns:repeat(8,1fr)}.tedi-date-picker__weeknumber{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);border-right:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-date-picker__day{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-regular-size);color:var(--general-text-primary);cursor:pointer;background:none;border:none;border-radius:var(--button-radius-sm)}.tedi-date-picker__day:hover{background:var(--form-datepicker-date-hover)}.tedi-date-picker__day:active{background:var(--form-datepicker-date-active)}.tedi-date-picker__day:disabled{cursor:not-allowed;opacity:.3}.tedi-date-picker__day:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__day--other-month{color:var(--form-datepicker-date-text-muted)}.tedi-date-picker__day--selected{color:var(--form-datepicker-date-text-selected);background:var(--form-datepicker-date-selected);border-radius:var(--button-radius-sm)}.tedi-date-picker__day--selected:hover{background:var(--form-datepicker-date-selected)}.tedi-date-picker__day--selected .tedi-date-picker__today{border-color:var(--form-datepicker-today-border-secondary)}.tedi-date-picker__today{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);border:var(--tedi-borders-01) solid var(--form-datepicker-today-border);border-radius:var(--button-radius-default)}.tedi-date-picker__month-year-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--layout-grid-gutters-08);padding:var(--card-padding-md-default)}.tedi-date-picker__month-year-button{display:flex;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-checkbox-radio-card-primary-default-text);background:var(--form-checkbox-radio-card-secondary-default-background);border:var(--tedi-borders-01) solid var(--form-checkbox-radio-card-secondary-default-border);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-date-picker__month-year-button:hover{color:var(--form-checkbox-radio-card-secondary-hover-text);background:var(--form-checkbox-radio-card-secondary-hover-background);border-color:var(--form-checkbox-radio-card-secondary-hover-border)}.tedi-date-picker__month-year-button:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__month-year-button:disabled{color:var(--form-checkbox-radio-card-secondary-disabled-default-text);cursor:not-allowed;background:var(--form-checkbox-radio-card-secondary-disabled-default-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-default-border)}.tedi-date-picker__month-year-button--selected{color:var(--form-checkbox-radio-card-secondary-selected-text);background:var(--form-checkbox-radio-card-secondary-selected-background);border-color:var(--form-checkbox-radio-card-secondary-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-selected-border)}.tedi-date-picker__month-year-button--selected:disabled{color:var(--form-checkbox-radio-card-secondary-disabled-selected-text);cursor:not-allowed;background:var(--form-checkbox-radio-card-secondary-disabled-selected-background);border-color:var(--form-checkbox-radio-card-secondary-disabled-selected-border);box-shadow:0 0 0 1px var(--form-checkbox-radio-card-secondary-disabled-selected-border)}\n"] }]
+                    ], template: "<input\n  #inputElement\n  type=\"text\"\n  class=\"tedi-date-picker__input\"\n  role=\"combobox\"\n  aria-autocomplete=\"none\"\n  aria-haspopup=\"dialog\"\n  [class.tedi-date-picker__input--small]=\"inputSize() === 'small'\"\n  [class.tedi-date-picker__input--valid]=\"inputState() === 'valid'\"\n  [class.tedi-date-picker__input--error]=\"inputState() === 'error'\"\n  [attr.id]=\"inputId()\"\n  [attr.placeholder]=\"inputPlaceholder()\"\n  [attr.aria-expanded]=\"!fieldDisabled() && popover().isOpen()\"\n  [attr.aria-controls]=\"uniqueId\"\n  [attr.aria-readonly]=\"!allowManualInput()\"\n  [readOnly]=\"!allowManualInput()\"\n  [value]=\"inputValue()\"\n  [disabled]=\"fieldDisabled()\"\n  (input)=\"onInput($event)\"\n  (blur)=\"onInputBlur()\"\n  (click)=\"onInputClick()\"\n/>\n<div class=\"tedi-date-picker__input-buttons\">\n  @if (selected()) {\n    <button\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      class=\"tedi-date-picker__clear\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'date-picker.clear-date' | tediTranslate\"\n      [disabled]=\"fieldDisabled()\"\n      (click)=\"clearInput()\"\n    ></button>\n    <tedi-separator axis=\"vertical\" size=\"1rem\" />\n  }\n  <tedi-popover\n    style=\"display: flex; align-items: center\"\n    position=\"bottom-end\"\n    [withArrow]=\"false\"\n    [preventOverflow]=\"true\"\n  >\n    <button\n      tedi-button\n      tedi-popover-trigger\n      type=\"button\"\n      variant=\"neutral\"\n      size=\"small\"\n      class=\"tedi-date-picker__toggle\"\n      [attr.aria-label]=\"'date-picker.open-calendar' | tediTranslate\"\n      [disabled]=\"fieldDisabled()\"\n      (click)=\"openCalendar()\"\n    >\n      <tedi-icon name=\"calendar_today\" size=\"inherit\" />\n    </button>\n    <tedi-popover-content maxWidth=\"none\" style=\"padding: 0\">\n      <div\n        class=\"tedi-date-picker__calendar\"\n        (keydown)=\"onCalendarKeyDown($event)\"\n      >\n        <tedi-date-picker-header\n          [uniqueId]=\"uniqueId\"\n          [currentView]=\"currentView()\"\n          [month]=\"month()\"\n          [monthMode]=\"monthMode()\"\n          [yearMode]=\"yearMode()\"\n          [showNavigation]=\"showNavigation()\"\n          [canGoPrev]=\"canGoPrev()\"\n          [canGoNext]=\"canGoNext()\"\n          [selectedYear]=\"selectedYear()\"\n          [years]=\"years()\"\n          [pagedYears]=\"pagedYears()\"\n          [hasPrevYearPage]=\"hasPrevYearPage()\"\n          [hasNextYearPage]=\"hasNextYearPage()\"\n          [disabledMonths]=\"disabledMonths()\"\n          [disabledYears]=\"disabledYears()\"\n          (prevMonth)=\"prevMonth()\"\n          (nextMonth)=\"nextMonth()\"\n          (monthSelect)=\"onMonthSelect($event)\"\n          (yearSelect)=\"onYearSelect($event)\"\n          (monthClick)=\"onMonthClick()\"\n          (yearClick)=\"onYearClick()\"\n          (prevYearPage)=\"prevYearPage()\"\n          (nextYearPage)=\"nextYearPage()\"\n        />\n\n        @if (currentView() === \"calendar-grid\") {\n          <tedi-date-picker-calendar-grid\n            #gridElement\n            [gridId]=\"uniqueId\"\n            [weekRows]=\"weekRows()\"\n            [weekNumbers]=\"weekNumbers()\"\n            [showWeekNumbers]=\"showWeekNumbers()\"\n            [activeDate]=\"activeDate()\"\n            [selected]=\"selected()\"\n            [today]=\"today\"\n            (daySelect)=\"selectDay($event)\"\n            (dayKeydown)=\"onDayKeydown($event.event, $event.date)\"\n          />\n        } @else if (currentView() === \"month-grid\") {\n          <tedi-date-picker-month-grid\n            [currentMonth]=\"month()\"\n            (monthSelect)=\"onMonthSelect($event)\"\n          />\n        } @else if (currentView() === \"year-grid\") {\n          <tedi-date-picker-year-grid\n            [pagedYears]=\"pagedYears()\"\n            [selectedYear]=\"selectedYear()\"\n            (yearSelect)=\"onYearSelect($event)\"\n          />\n        }\n      </div>\n    </tedi-popover-content>\n  </tedi-popover>\n</div>\n", styles: ["tedi-date-picker{display:flex;gap:var(--form-field-inner-spacing);align-self:stretch;min-height:var(--form-field-height);padding-right:var(--form-field-padding-x-md-default);background:var(--form-input-background-default);border:var(--tedi-borders-01) solid var(--form-input-border-default);border-radius:var(--form-field-radius)}tedi-date-picker:has(.tedi-date-picker__input:hover):not(:has(.tedi-date-picker__input:disabled)){border-color:var(--form-input-border-hover)}tedi-date-picker:has(.tedi-date-picker__input:active):not(:has(.tedi-date-picker__input:disabled)),tedi-date-picker:has(.tedi-date-picker__input:focus):not(:has(.tedi-date-picker__input:disabled)){border-color:var(--form-input-border-active);box-shadow:inset 0 0 0 1px var(--form-input-border-active)}tedi-date-picker:has(.tedi-date-picker__input:disabled){cursor:not-allowed;background:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}tedi-date-picker:has(.tedi-date-picker__input--valid){border-color:var(--form-general-feedback-success-border)}tedi-date-picker:has(.tedi-date-picker__input--error){border-color:var(--form-general-feedback-error-border)}tedi-date-picker:has(.tedi-date-picker__input--small){min-height:var(--form-field-height-sm)}.tedi-date-picker__input{flex:1;min-width:0;padding-left:var(--form-field-padding-x-md-default);font-size:var(--body-regular-size);color:var(--form-input-text-filled);outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-date-picker__input::placeholder{color:var(--form-input-text-placeholder)}.tedi-date-picker__input:disabled{cursor:not-allowed;background:transparent}.tedi-date-picker__input-buttons{display:flex;gap:var(--layout-grid-gutters-04);align-items:center;align-self:center;justify-content:center;min-width:0}.tedi-date-picker__clear:disabled{cursor:not-allowed}.tedi-date-picker__toggle{width:var(--button-xs-icon-size)!important;height:var(--form-field-button-height-sm)!important;font-size:1.125rem!important;border-radius:var(--button-radius-sm)!important}.tedi-date-picker__toggle:disabled{cursor:not-allowed}.tedi-date-picker__calendar{display:block;width:fit-content;-webkit-user-select:none;user-select:none;background:var(--card-background-primary);border-radius:var(--card-radius-rounded)}.tedi-date-picker__header{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default) var(--card-padding-md-default) var(--card-padding-xs) var(--card-padding-md-default)}.tedi-date-picker__controls{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;margin:0 auto}.tedi-date-picker__dropdown-trigger{display:inline-flex;gap:var(--layout-grid-gutters-02);align-items:center;padding:0;padding-left:var(--layout-grid-gutters-04);font-size:1rem;font-weight:500;color:var(--general-text-primary);cursor:pointer;background:transparent;border:0;border-radius:var(--button-radius-sm)}.tedi-date-picker__dropdown-trigger:hover{color:var(--button-main-neutral-text-hover);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-date-picker__dropdown-trigger:hover tedi-icon{color:var(--button-main-neutral-text-hover)}.tedi-date-picker__dropdown-trigger:active{color:var(--button-main-neutral-text-active);background:var(--button-main-neutral-icon-only-background-active)}.tedi-date-picker__dropdown-trigger:active tedi-icon{color:var(--button-main-neutral-text-active)}.tedi-date-picker__dropdown-trigger:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__dropdown-trigger tedi-icon{font-size:2rem;color:var(--general-icon-tertiary)}.tedi-date-picker__dropdown-content{max-height:15rem}.tedi-date-picker__dropdown-content--month{width:10rem}.tedi-date-picker__dropdown-content--year{width:8.75rem}.tedi-date-picker__label{font-weight:500;color:var(--general-text-primary)}.tedi-date-picker__nav{font-size:var(--button-icon-inner-icon-only-size)!important}.tedi-date-picker__weekdays{display:grid;grid-template-columns:repeat(7,1fr);padding:0 var(--card-padding-md-default)}.tedi-date-picker__weekdays--numbered{grid-template-columns:repeat(8,1fr)}.tedi-date-picker__weekday{display:flex;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);text-align:center;text-transform:uppercase;border-bottom:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-date-picker__grid{display:flex;flex-direction:column;padding:0 var(--card-padding-md-default) var(--card-padding-md-default) var(--card-padding-md-default)}.tedi-date-picker__row{display:grid;grid-template-columns:repeat(7,1fr)}.tedi-date-picker__row--numbered{grid-template-columns:repeat(8,1fr)}.tedi-date-picker__weeknumber{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-small-regular-size);color:var(--general-text-tertiary);border-right:var(--tedi-borders-01) solid var(--general-border-primary)}.tedi-date-picker__day{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);font-size:var(--body-regular-size);color:var(--general-text-primary);cursor:pointer;background:none;border:none;border-radius:var(--button-radius-sm)}.tedi-date-picker__day:hover{background:var(--form-datepicker-date-hover)}.tedi-date-picker__day:active{background:var(--form-datepicker-date-active)}.tedi-date-picker__day:disabled{cursor:not-allowed;opacity:.3}.tedi-date-picker__day:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__day--other-month{color:var(--form-datepicker-date-text-muted)}.tedi-date-picker__day--selected{color:var(--form-datepicker-date-text-selected);background:var(--form-datepicker-date-selected);border-radius:var(--button-radius-sm)}.tedi-date-picker__day--selected:hover{background:var(--form-datepicker-date-selected)}.tedi-date-picker__day--selected .tedi-date-picker__today{border-color:var(--form-datepicker-today-border-secondary)}.tedi-date-picker__today{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--form-calendar-date-width);height:var(--form-calendar-date-width);border:var(--tedi-borders-01) solid var(--form-datepicker-today-border);border-radius:var(--button-radius-default)}.tedi-date-picker__month-year-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--layout-grid-gutters-08);padding:var(--card-padding-md-default)}.tedi-date-picker__month-year-button{display:flex;align-items:center;justify-content:center;padding:var(--form-checkbox-radio-card-radio-padding-y) var(--form-checkbox-radio-card-radio-padding-x);font-size:var(--body-regular-size);color:var(--form-choice-card-primary-unselected-text-default);background:var(--form-choice-card-secondary-unselected-background-default);border:var(--tedi-borders-01) solid var(--form-choice-card-secondary-unselected-border-default);border-radius:var(--form-checkbox-radio-card-radius)}.tedi-date-picker__month-year-button:hover{color:var(--form-choice-card-secondary-unselected-text-hover);background:var(--form-choice-card-secondary-unselected-background-hover);border-color:var(--form-choice-card-secondary-unselected-border-hover)}.tedi-date-picker__month-year-button:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-date-picker__month-year-button:disabled{color:var(--form-choice-card-secondary-unselected-text-disabled);cursor:not-allowed;background:var(--form-choice-card-secondary-unselected-background-disabled);border-color:var(--form-choice-card-secondary-unselected-border-disabled)}.tedi-date-picker__month-year-button--selected{color:var(--form-choice-card-secondary-selected-text-default);background:var(--form-choice-card-secondary-selected-background-default);border-color:var(--form-choice-card-secondary-selected-border-default);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-default)}.tedi-date-picker__month-year-button--selected:disabled{color:var(--form-choice-card-secondary-selected-text-disabled);cursor:not-allowed;background:var(--form-choice-card-secondary-selected-background-disabled);border-color:var(--form-choice-card-secondary-selected-border-disabled);box-shadow:0 0 0 1px var(--form-choice-card-secondary-selected-border-disabled)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }, { type: i0.Output, args: ["selectedChange"] }], month: [{ type: i0.Input, args: [{ isSignal: true, alias: "month", required: false }] }, { type: i0.Output, args: ["monthChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], disabledMatchers: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledMatchers", required: false }] }], showNavigation: [{ type: i0.Input, args: [{ isSignal: true, alias: "showNavigation", required: false }] }], monthMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "monthMode", required: false }] }], yearMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "yearMode", required: false }] }], startYear: [{ type: i0.Input, args: [{ isSignal: true, alias: "startYear", required: false }] }], endYear: [{ type: i0.Input, args: [{ isSignal: true, alias: "endYear", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], inputPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputPlaceholder", required: false }] }], inputState: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputState", required: false }] }], inputSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputSize", required: false }] }], inputDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputDisabled", required: false }] }], allowManualInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowManualInput", required: false }] }], showWeekNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "showWeekNumbers", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], inputElement: [{ type: i0.ViewChild, args: ["inputElement", { isSignal: true }] }], calendarGrid: [{ type: i0.ViewChild, args: ["gridElement", { isSignal: true }] }], popover: [{ type: i0.ViewChild, args: [i0.forwardRef(() => PopoverComponent), { isSignal: true }] }] } });
 class NumberFieldComponent {
@@ -17964,7 +18141,7 @@ class SearchSuggestionComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: SearchSuggestionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: SearchSuggestionComponent, isStandalone: true, selector: "li[tedi-search-suggestion]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, custom: { classPropertyName: "custom", publicName: "custom", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "option", "tabindex": "-1" }, properties: { "class.tedi-search-suggestion--active": "isActive()", "class.tedi-search-suggestion--custom": "custom()", "class.tedi-search-suggestion--disabled": "disabledInput()", "attr.aria-selected": "isActive()", "attr.aria-disabled": "disabledInput() || null" }, classAttribute: "tedi-search-suggestion" }, ngImport: i0, template: "@if (custom()) {\n  <ng-content />\n} @else {\n  <span class=\"tedi-search-suggestion__label\">\n    @for (part of parts(); track $index) {\n      <span tedi-text [modifiers]=\"part.match ? 'bold' : undefined\">{{\n        part.text\n      }}</span>\n    }\n  </span>\n\n  @if (description()) {\n    <span\n      tedi-text\n      class=\"tedi-search-suggestion__description\"\n      color=\"tertiary\"\n      modifiers=\"small\"\n      >{{ description() }}</span\n    >\n  }\n}\n", styles: [".tedi-search-suggestion{display:block;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:inherit;cursor:pointer;background:transparent}.tedi-search-suggestion:hover,.tedi-search-suggestion--active{background:var(--dropdown-item-hover-background)}.tedi-search-suggestion--custom{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center}.tedi-search-suggestion--disabled,.tedi-search-suggestion--disabled:hover{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-search-suggestion--disabled [class*=tedi-text--]{color:inherit}.tedi-search-suggestion__label,.tedi-search-suggestion__description{display:block}\n"], dependencies: [{ kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: SearchSuggestionComponent, isStandalone: true, selector: "li[tedi-search-suggestion]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, custom: { classPropertyName: "custom", publicName: "custom", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "option", "tabindex": "-1" }, properties: { "class.tedi-search-suggestion--active": "isActive()", "class.tedi-search-suggestion--custom": "custom()", "class.tedi-search-suggestion--disabled": "disabledInput()", "attr.aria-selected": "isActive()", "attr.aria-disabled": "disabledInput() || null" }, classAttribute: "tedi-search-suggestion" }, ngImport: i0, template: "@if (custom()) {\n  <ng-content />\n} @else {\n  <span class=\"tedi-search-suggestion__label\">\n    @for (part of parts(); track $index) {\n      <span tedi-text [modifiers]=\"part.match ? 'bold' : undefined\">{{\n        part.text\n      }}</span>\n    }\n  </span>\n\n  @if (description()) {\n    <span\n      tedi-text\n      class=\"tedi-search-suggestion__description\"\n      color=\"tertiary\"\n      modifiers=\"small\"\n      >{{ description() }}</span\n    >\n  }\n}\n", styles: [".tedi-search-suggestion{display:block;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:inherit;cursor:pointer;background:transparent}.tedi-search-suggestion:hover,.tedi-search-suggestion--active{color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}.tedi-search-suggestion:hover .tedi-search-suggestion__label [class*=tedi-text--],.tedi-search-suggestion--active .tedi-search-suggestion__label [class*=tedi-text--],.tedi-search-suggestion:hover .tedi-search-suggestion__description,.tedi-search-suggestion--active .tedi-search-suggestion__description{color:inherit}.tedi-search-suggestion--custom{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center}.tedi-search-suggestion--disabled,.tedi-search-suggestion--disabled:hover{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-search-suggestion--disabled [class*=tedi-text--]{color:inherit}.tedi-search-suggestion__label,.tedi-search-suggestion__description{display:block}\n"], dependencies: [{ kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: SearchSuggestionComponent, decorators: [{
             type: Component,
@@ -17977,7 +18154,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "[class.tedi-search-suggestion--disabled]": "disabledInput()",
                         "[attr.aria-selected]": "isActive()",
                         "[attr.aria-disabled]": "disabledInput() || null",
-                    }, template: "@if (custom()) {\n  <ng-content />\n} @else {\n  <span class=\"tedi-search-suggestion__label\">\n    @for (part of parts(); track $index) {\n      <span tedi-text [modifiers]=\"part.match ? 'bold' : undefined\">{{\n        part.text\n      }}</span>\n    }\n  </span>\n\n  @if (description()) {\n    <span\n      tedi-text\n      class=\"tedi-search-suggestion__description\"\n      color=\"tertiary\"\n      modifiers=\"small\"\n      >{{ description() }}</span\n    >\n  }\n}\n", styles: [".tedi-search-suggestion{display:block;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:inherit;cursor:pointer;background:transparent}.tedi-search-suggestion:hover,.tedi-search-suggestion--active{background:var(--dropdown-item-hover-background)}.tedi-search-suggestion--custom{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center}.tedi-search-suggestion--disabled,.tedi-search-suggestion--disabled:hover{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-search-suggestion--disabled [class*=tedi-text--]{color:inherit}.tedi-search-suggestion__label,.tedi-search-suggestion__description{display:block}\n"] }]
+                    }, template: "@if (custom()) {\n  <ng-content />\n} @else {\n  <span class=\"tedi-search-suggestion__label\">\n    @for (part of parts(); track $index) {\n      <span tedi-text [modifiers]=\"part.match ? 'bold' : undefined\">{{\n        part.text\n      }}</span>\n    }\n  </span>\n\n  @if (description()) {\n    <span\n      tedi-text\n      class=\"tedi-search-suggestion__description\"\n      color=\"tertiary\"\n      modifiers=\"small\"\n      >{{ description() }}</span\n    >\n  }\n}\n", styles: [".tedi-search-suggestion{display:block;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:inherit;cursor:pointer;background:transparent}.tedi-search-suggestion:hover,.tedi-search-suggestion--active{color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}.tedi-search-suggestion:hover .tedi-search-suggestion__label [class*=tedi-text--],.tedi-search-suggestion--active .tedi-search-suggestion__label [class*=tedi-text--],.tedi-search-suggestion:hover .tedi-search-suggestion__description,.tedi-search-suggestion--active .tedi-search-suggestion__description{color:inherit}.tedi-search-suggestion--custom{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center}.tedi-search-suggestion--disabled,.tedi-search-suggestion--disabled:hover{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-search-suggestion--disabled [class*=tedi-text--]{color:inherit}.tedi-search-suggestion__label,.tedi-search-suggestion__description{display:block}\n"] }]
         }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], query: [{ type: i0.Input, args: [{ isSignal: true, alias: "query", required: false }] }], custom: [{ type: i0.Input, args: [{ isSignal: true, alias: "custom", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
 /**
@@ -18042,13 +18219,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                 }]
         }] });
-/**
- * Flush against the field, flipping above when it would overflow. The panel
- * border meets the field border, so there is no offset.
- */
+/** Below the field, flipping above when it would overflow. */
 const SEARCH_OVERLAY_POSITIONS = [
-    { originX: "start", originY: "bottom", overlayX: "start", overlayY: "top" },
-    { originX: "start", originY: "top", overlayX: "start", overlayY: "bottom" },
+    {
+        originX: "start",
+        originY: "bottom",
+        overlayX: "start",
+        overlayY: "top",
+        offsetY: FIELD_OVERLAY_GAP,
+    },
+    {
+        originX: "start",
+        originY: "top",
+        overlayX: "start",
+        overlayY: "bottom",
+        offsetY: -FIELD_OVERLAY_GAP,
+    },
 ];
 class SearchComponent {
     /**
@@ -18176,8 +18362,9 @@ class SearchComponent {
     suggestionSelect = output();
     suggestionTemplate = contentChild(SearchSuggestionTemplateDirective, ...(ngDevMode ? [{ debugName: "suggestionTemplate" }] : []));
     footerTemplate = contentChild(SearchFooterTemplateDirective, ...(ngDevMode ? [{ debugName: "footerTemplate" }] : []));
-    inputRef = viewChild("searchInput", ...(ngDevMode ? [{ debugName: "inputRef", read: ElementRef }] : [{ read: ElementRef }]));
-    overlayOrigin = viewChild.required(CdkOverlayOrigin);
+    inputRef = viewChild.required("searchInput", {
+        read: (ElementRef),
+    });
     connectedOverlay = viewChild(CdkConnectedOverlay, ...(ngDevMode ? [{ debugName: "connectedOverlay" }] : []));
     suggestionRows = viewChildren(SearchSuggestionComponent, ...(ngDevMode ? [{ debugName: "suggestionRows" }] : []));
     formDisabled = signal(false, ...(ngDevMode ? [{ debugName: "formDisabled" }] : []));
@@ -18201,10 +18388,10 @@ class SearchComponent {
     overlayPositions = SEARCH_OVERLAY_POSITIONS;
     panelWidth = signal(0, ...(ngDevMode ? [{ debugName: "panelWidth" }] : []));
     /**
-     * True while the panel sits above the field on the fallback position, so the
-     * rounded edge can move to the side that is not joined to the field.
+     * The bordered input box, not the whole form field, so the panel overlays the
+     * hint instead of opening below it.
      */
-    panelAbove = signal(false, ...(ngDevMode ? [{ debugName: "panelAbove" }] : []));
+    panelOrigin = signal(this.hostElement.nativeElement, ...(ngDevMode ? [{ debugName: "panelOrigin" }] : []));
     isDisabled = computed(() => this.disabled() || this.formDisabled(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
     fieldIcon = computed(() => this.button() ? undefined : this.searchIcon(), ...(ngDevMode ? [{ debugName: "fieldIcon" }] : []));
     fieldHeight = computed(() => {
@@ -18225,7 +18412,7 @@ class SearchComponent {
             return null;
         return button?.ariaLabel ?? this.translationService.translate("search");
     }, ...(ngDevMode ? [{ debugName: "buttonAriaLabel" }] : []));
-    feedbackId = computed(() => this.feedbackText() ? `${this.inputId()}-feedback` : null, ...(ngDevMode ? [{ debugName: "feedbackId" }] : []));
+    feedbackId = computed(() => `${this.inputId()}-feedback`, ...(ngDevMode ? [{ debugName: "feedbackId" }] : []));
     searchAriaLabel = computed(() => this.ariaLabel() ||
         this.label() ||
         this.placeholder() ||
@@ -18338,9 +18525,15 @@ class SearchComponent {
     openPanel() {
         if (!this.autocomplete())
             return;
+        this.panelOrigin.set(this.fieldSurface());
         this.panelWidth.set(this.hostElement.nativeElement.offsetWidth);
         this.panelOpen.set(true);
     }
+    /** The box wrapping input and icons, or the input itself when it owns the surface. */
+    fieldSurface() {
+        const input = this.inputRef().nativeElement;
+        return input.closest(".tedi-form-field__box") ?? input;
+    }
     closePanel() {
         this.cleanupScrollListener();
         this.panelOpen.set(false);
@@ -18348,9 +18541,6 @@ class SearchComponent {
         // would leave `aria-activedescendant` pointing at a removed element.
         this.resetActiveOption();
     }
-    onPositionChange(change) {
-        this.panelAbove.set(change.connectionPair.overlayY === "bottom");
-    }
     onOverlayAttach() {
         if (this.hideOnScroll()) {
             this.setupScrollListener();
@@ -18459,9 +18649,7 @@ class SearchComponent {
         return footer ? getFocusableElements(footer) : [];
     }
     focusAfterField() {
-        const input = this.inputRef()?.nativeElement;
-        if (!input)
-            return;
+        const input = this.inputRef().nativeElement;
         const panel = this.panelElement();
         const focusables = getFocusableElements(this.hostElement.nativeElement.ownerDocument.body).filter((el) => !panel?.contains(el));
         const next = focusables[focusables.indexOf(input) + 1];
@@ -18496,8 +18684,7 @@ class SearchComponent {
         this.searchEvent.emit(this.value());
     }
     focus() {
-        const input = this.inputRef()?.nativeElement;
-        input?.focus();
+        this.inputRef().nativeElement.focus();
     }
     writeValue(value) {
         this.value.set(value ?? "");
@@ -18551,7 +18738,7 @@ class SearchComponent {
                 useExisting: forwardRef(() => SearchComponent),
                 multi: true,
             },
-        ], queries: [{ propertyName: "suggestionTemplate", first: true, predicate: SearchSuggestionTemplateDirective, descendants: true, isSignal: true }, { propertyName: "footerTemplate", first: true, predicate: SearchFooterTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["searchInput"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "overlayOrigin", first: true, predicate: CdkOverlayOrigin, descendants: true, isSignal: true }, { propertyName: "connectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true, isSignal: true }, { propertyName: "suggestionRows", predicate: SearchSuggestionComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<tedi-form-field\n  class=\"tedi-search__field\"\n  cdkOverlayOrigin\n  #origin=\"cdkOverlayOrigin\"\n  [size]=\"size()\"\n  [icon]=\"fieldIcon()\"\n  [clearable]=\"clearable() && !isDisabled()\"\n  [showClearOnInteraction]=\"showClearOnInteraction()\"\n>\n  @if (label()) {\n    <label tedi-label [for]=\"inputId()\">\n      {{ label() }}\n    </label>\n  }\n\n  <input\n    #searchInput\n    tedi-text-field\n    type=\"text\"\n    [attr.role]=\"inputRole()\"\n    [attr.aria-autocomplete]=\"ariaAutocomplete()\"\n    [attr.aria-expanded]=\"ariaExpanded()\"\n    [attr.aria-controls]=\"ariaControls()\"\n    [attr.aria-activedescendant]=\"activeOptionId()\"\n    [id]=\"inputId()\"\n    [value]=\"value()\"\n    [placeholder]=\"placeholder()\"\n    [disabled]=\"isDisabled()\"\n    [attr.aria-label]=\"inputAriaLabel()\"\n    (valueChange)=\"onInputValue($event)\"\n    (clear)=\"onClear()\"\n    (focus)=\"onInputFocus()\"\n    (keydown)=\"onKeydown($event)\"\n    (blur)=\"onBlur()\"\n  />\n\n  @if (feedbackText(); as feedback) {\n    <tedi-feedback-text\n      [id]=\"feedbackId()\"\n      [text]=\"feedback.text\"\n      [type]=\"feedback.type\"\n      [position]=\"feedback.position\"\n    />\n  }\n</tedi-form-field>\n\n@if (button(); as btn) {\n  <button\n    tedi-button\n    type=\"button\"\n    class=\"tedi-search__button\"\n    [variant]=\"btn.variant ?? 'primary'\"\n    [size]=\"buttonSize()\"\n    [disabled]=\"isDisabled()\"\n    [attr.aria-label]=\"buttonAriaLabel()\"\n    (click)=\"emitSearch()\"\n  >\n    <tedi-icon [name]=\"btn.icon ?? 'search'\" [size]=\"buttonIconSize()\" />\n    @if (btn.text) {\n      {{ btn.text }}\n    }\n  </button>\n}\n\n<div\n  class=\"tedi-search__announcement sr-only\"\n  role=\"status\"\n  aria-live=\"polite\"\n  aria-atomic=\"true\"\n>\n  {{ announcement() }}\n</div>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"origin\"\n  [cdkConnectedOverlayOpen]=\"panelVisible()\"\n  [cdkConnectedOverlayWidth]=\"panelWidth()\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayDisableClose]=\"true\"\n  (overlayOutsideClick)=\"closePanel()\"\n  (positionChange)=\"onPositionChange($event)\"\n  (attach)=\"onOverlayAttach()\"\n  (detach)=\"onOverlayDetach()\"\n>\n  <div\n    class=\"tedi-search__panel\"\n    [class.tedi-search__panel--above]=\"panelAbove()\"\n  >\n    @if (loading()) {\n      <div class=\"tedi-search__panel-status\">\n        <tedi-spinner [size]=\"16\" />\n        <span tedi-text color=\"tertiary\">{{ resolvedLoadingText() }}</span>\n      </div>\n    } @else if (hasSuggestions()) {\n      <ul class=\"tedi-search__panel-list\" role=\"listbox\" [id]=\"listboxId()\">\n        @for (\n          suggestion of resolvedSuggestions();\n          track suggestion.label + $index;\n          let i = $index\n        ) {\n          <li\n            tedi-search-suggestion\n            [label]=\"suggestion.label\"\n            [description]=\"suggestion.description\"\n            [disabled]=\"suggestion.disabled\"\n            [query]=\"query()\"\n            [custom]=\"!!suggestionTemplate()\"\n            [id]=\"optionId(i)\"\n            (mousedown)=\"$event.preventDefault()\"\n            (click)=\"selectSuggestion(suggestion)\"\n          >\n            @if (suggestionTemplate(); as tpl) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"{\n                  $implicit: suggestion.item,\n                  item: suggestion.item,\n                  index: i,\n                  label: suggestion.label,\n                  description: suggestion.description,\n                  disabled: suggestion.disabled,\n                  query: query(),\n                }\"\n              />\n            }\n          </li>\n        }\n      </ul>\n    } @else {\n      <div class=\"tedi-search__panel-status\">\n        <span tedi-text color=\"tertiary\">{{ resolvedNoResultsText() }}</span>\n      </div>\n    }\n\n    @if (footerTemplate(); as footer) {\n      <div\n        class=\"tedi-search__footer\"\n        (keydown)=\"onFooterKeydown($event)\"\n        (focusout)=\"onFocusOut($event)\"\n      >\n        <ng-container [ngTemplateOutlet]=\"footer.template\" />\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [".tedi-search{display:flex;align-items:flex-end;width:100%}.tedi-search__field{flex:1 1 auto;min-width:0}.tedi-search__button{flex:0 0 auto;align-self:flex-end;white-space:nowrap}.tedi-search .tedi-search__button{height:var(--tedi-search-field-height);min-height:0;border-radius:0 var(--button-radius-sm) var(--button-radius-sm) 0}.tedi-search--button-icon-only .tedi-search__button{width:var(--tedi-search-field-height);padding-right:0;padding-left:0}.tedi-search--has-button .tedi-field-surface{border-right-width:0;border-top-right-radius:0;border-bottom-right-radius:0}.tedi-search__panel{display:flex;flex-direction:column;width:100%;max-height:var(--form-select-area-max-height);overflow:hidden;background:var(--dropdown-item-default-background);border:1px solid var(--card-border-primary);border-radius:0 0 var(--form-select-area-radius) var(--form-select-area-radius);box-shadow:0 1px 5px 0 var(--general-effect-colors-elevation-dropdown-area-drop-shadow)}.tedi-search__panel--above{border-radius:var(--form-select-area-radius) var(--form-select-area-radius) 0 0}.tedi-search__panel-list{min-height:0;padding:0;margin:0;overflow-y:auto;list-style:none}.tedi-search__footer{display:flex;flex:0 0 auto;flex-direction:column;gap:var(--dropdown-item-inner-spacing);align-items:center;padding:var(--card-padding-md-default);background:var(--dropdown-item-default-background);border-top:1px solid var(--card-border-primary)}.tedi-search-footer-actions{display:flex;flex-wrap:wrap;gap:var(--button-gutter-x);justify-content:center}.tedi-search__panel-status{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}\n"], dependencies: [{ kind: "component", type: FormFieldComponent, selector: "tedi-form-field", inputs: ["size", "icon", "clearable", "showClearOnInteraction", "inputClass", "characterLimit"] }, { kind: "component", type: TextFieldComponent, selector: "input[tedi-text-field]", inputs: ["value", "size", "invalid", "arrowsHidden", "disabled", "readonly", "readOnly"], outputs: ["valueChange", "clear"] }, { kind: "component", type: LabelComponent, selector: "[tedi-label]", inputs: ["size", "required", "color", "visuallyHidden"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["id", "text", "type", "position"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: SpinnerComponent, selector: "tedi-spinner", inputs: ["size", "color", "label"] }, { kind: "component", type: SearchSuggestionComponent, selector: "li[tedi-search-suggestion]", inputs: ["label", "description", "query", "custom", "disabled"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], queries: [{ propertyName: "suggestionTemplate", first: true, predicate: SearchSuggestionTemplateDirective, descendants: true, isSignal: true }, { propertyName: "footerTemplate", first: true, predicate: SearchFooterTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["searchInput"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "connectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true, isSignal: true }, { propertyName: "suggestionRows", predicate: SearchSuggestionComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<tedi-form-field\n  class=\"tedi-search__field\"\n  [size]=\"size()\"\n  [icon]=\"fieldIcon()\"\n  [clearable]=\"clearable() && !isDisabled()\"\n  [showClearOnInteraction]=\"showClearOnInteraction()\"\n>\n  @if (label()) {\n    <label tedi-label [for]=\"inputId()\">\n      {{ label() }}\n    </label>\n  }\n\n  <input\n    #searchInput\n    tedi-text-field\n    type=\"text\"\n    [attr.role]=\"inputRole()\"\n    [attr.aria-autocomplete]=\"ariaAutocomplete()\"\n    [attr.aria-expanded]=\"ariaExpanded()\"\n    [attr.aria-controls]=\"ariaControls()\"\n    [attr.aria-activedescendant]=\"activeOptionId()\"\n    [id]=\"inputId()\"\n    [value]=\"value()\"\n    [placeholder]=\"placeholder()\"\n    [disabled]=\"isDisabled()\"\n    [attr.aria-label]=\"inputAriaLabel()\"\n    (valueChange)=\"onInputValue($event)\"\n    (clear)=\"onClear()\"\n    (focus)=\"onInputFocus()\"\n    (keydown)=\"onKeydown($event)\"\n    (blur)=\"onBlur()\"\n  />\n\n  @if (feedbackText(); as feedback) {\n    <tedi-feedback-text\n      [id]=\"feedbackId()\"\n      [text]=\"feedback.text\"\n      [type]=\"feedback.type\"\n      [position]=\"feedback.position\"\n    />\n  }\n</tedi-form-field>\n\n@if (button(); as btn) {\n  <button\n    tedi-button\n    type=\"button\"\n    class=\"tedi-search__button\"\n    [variant]=\"btn.variant ?? 'primary'\"\n    [size]=\"buttonSize()\"\n    [disabled]=\"isDisabled()\"\n    [attr.aria-label]=\"buttonAriaLabel()\"\n    (click)=\"emitSearch()\"\n  >\n    <tedi-icon [name]=\"btn.icon ?? 'search'\" [size]=\"buttonIconSize()\" />\n    @if (btn.text) {\n      {{ btn.text }}\n    }\n  </button>\n}\n\n<div\n  class=\"tedi-search__announcement sr-only\"\n  role=\"status\"\n  aria-live=\"polite\"\n  aria-atomic=\"true\"\n>\n  {{ announcement() }}\n</div>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"panelOrigin()\"\n  [cdkConnectedOverlayOpen]=\"panelVisible()\"\n  [cdkConnectedOverlayWidth]=\"panelWidth()\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayDisableClose]=\"true\"\n  (overlayOutsideClick)=\"closePanel()\"\n  (attach)=\"onOverlayAttach()\"\n  (detach)=\"onOverlayDetach()\"\n>\n  <div class=\"tedi-search__panel\">\n    @if (loading()) {\n      <div class=\"tedi-search__panel-status\">\n        <tedi-spinner [size]=\"16\" />\n        <span tedi-text color=\"tertiary\">{{ resolvedLoadingText() }}</span>\n      </div>\n    } @else if (hasSuggestions()) {\n      <ul class=\"tedi-search__panel-list\" role=\"listbox\" [id]=\"listboxId()\">\n        @for (\n          suggestion of resolvedSuggestions();\n          track suggestion.label + $index;\n          let i = $index\n        ) {\n          <li\n            tedi-search-suggestion\n            [label]=\"suggestion.label\"\n            [description]=\"suggestion.description\"\n            [disabled]=\"suggestion.disabled\"\n            [query]=\"query()\"\n            [custom]=\"!!suggestionTemplate()\"\n            [id]=\"optionId(i)\"\n            (mousedown)=\"$event.preventDefault()\"\n            (click)=\"selectSuggestion(suggestion)\"\n          >\n            @if (suggestionTemplate(); as tpl) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"{\n                  $implicit: suggestion.item,\n                  item: suggestion.item,\n                  index: i,\n                  label: suggestion.label,\n                  description: suggestion.description,\n                  disabled: suggestion.disabled,\n                  query: query(),\n                }\"\n              />\n            }\n          </li>\n        }\n      </ul>\n    } @else {\n      <div class=\"tedi-search__panel-status\">\n        <span tedi-text color=\"tertiary\">{{ resolvedNoResultsText() }}</span>\n      </div>\n    }\n\n    @if (footerTemplate(); as footer) {\n      <div\n        class=\"tedi-search__footer\"\n        (keydown)=\"onFooterKeydown($event)\"\n        (focusout)=\"onFocusOut($event)\"\n      >\n        <ng-container [ngTemplateOutlet]=\"footer.template\" />\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [".tedi-search{display:flex;align-items:flex-end;width:100%}.tedi-search__field{flex:1 1 auto;min-width:0}.tedi-search__button{flex:0 0 auto;align-self:flex-end;white-space:nowrap}.tedi-search .tedi-search__button{height:var(--tedi-search-field-height);min-height:0;border-radius:0 var(--button-radius-sm) var(--button-radius-sm) 0}.tedi-search--button-icon-only .tedi-search__button{width:var(--tedi-search-field-height);padding-right:0;padding-left:0}.tedi-search--has-button .tedi-field-surface{border-right-width:0;border-top-right-radius:0;border-bottom-right-radius:0}.tedi-search__panel{display:flex;flex-direction:column;width:100%;max-height:var(--form-select-area-max-height);overflow:hidden;background:var(--dropdown-item-default-background);border:1px solid var(--card-border-primary);border-radius:var(--form-select-area-radius);box-shadow:0 1px 5px 0 var(--general-effect-colors-elevation-dropdown-area-drop-shadow)}.tedi-search__panel-list{min-height:0;padding:0;margin:0;overflow-y:auto;list-style:none}.tedi-search__footer{display:flex;flex:0 0 auto;flex-direction:column;gap:var(--dropdown-item-inner-spacing);align-items:center;padding:var(--card-padding-md-default);background:var(--dropdown-item-default-background);border-top:1px solid var(--card-border-primary)}.tedi-search-footer-actions{display:flex;flex-wrap:wrap;gap:var(--button-gutter-x);justify-content:center}.tedi-search__panel-status{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}\n"], dependencies: [{ kind: "component", type: FormFieldComponent, selector: "tedi-form-field", inputs: ["size", "icon", "clearable", "showClearOnInteraction", "inputClass", "characterLimit"] }, { kind: "component", type: TextFieldComponent, selector: "input[tedi-text-field]", inputs: ["value", "size", "invalid", "arrowsHidden", "disabled", "readonly", "readOnly"], outputs: ["valueChange", "clear"] }, { kind: "component", type: LabelComponent, selector: "[tedi-label]", inputs: ["size", "required", "color", "visuallyHidden"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["id", "text", "type", "position"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: SpinnerComponent, selector: "tedi-spinner", inputs: ["size", "color", "label"] }, { kind: "component", type: SearchSuggestionComponent, selector: "li[tedi-search-suggestion]", inputs: ["label", "description", "query", "custom", "disabled"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: SearchComponent, decorators: [{
             type: Component,
@@ -18581,8 +18768,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "[style.--tedi-search-field-height]": "fieldHeight()",
                         "[class.tedi-search--button-icon-only]": "!!button() && !button()?.text",
                         "[class.tedi-search--has-button]": "!!button()",
-                    }, template: "<tedi-form-field\n  class=\"tedi-search__field\"\n  cdkOverlayOrigin\n  #origin=\"cdkOverlayOrigin\"\n  [size]=\"size()\"\n  [icon]=\"fieldIcon()\"\n  [clearable]=\"clearable() && !isDisabled()\"\n  [showClearOnInteraction]=\"showClearOnInteraction()\"\n>\n  @if (label()) {\n    <label tedi-label [for]=\"inputId()\">\n      {{ label() }}\n    </label>\n  }\n\n  <input\n    #searchInput\n    tedi-text-field\n    type=\"text\"\n    [attr.role]=\"inputRole()\"\n    [attr.aria-autocomplete]=\"ariaAutocomplete()\"\n    [attr.aria-expanded]=\"ariaExpanded()\"\n    [attr.aria-controls]=\"ariaControls()\"\n    [attr.aria-activedescendant]=\"activeOptionId()\"\n    [id]=\"inputId()\"\n    [value]=\"value()\"\n    [placeholder]=\"placeholder()\"\n    [disabled]=\"isDisabled()\"\n    [attr.aria-label]=\"inputAriaLabel()\"\n    (valueChange)=\"onInputValue($event)\"\n    (clear)=\"onClear()\"\n    (focus)=\"onInputFocus()\"\n    (keydown)=\"onKeydown($event)\"\n    (blur)=\"onBlur()\"\n  />\n\n  @if (feedbackText(); as feedback) {\n    <tedi-feedback-text\n      [id]=\"feedbackId()\"\n      [text]=\"feedback.text\"\n      [type]=\"feedback.type\"\n      [position]=\"feedback.position\"\n    />\n  }\n</tedi-form-field>\n\n@if (button(); as btn) {\n  <button\n    tedi-button\n    type=\"button\"\n    class=\"tedi-search__button\"\n    [variant]=\"btn.variant ?? 'primary'\"\n    [size]=\"buttonSize()\"\n    [disabled]=\"isDisabled()\"\n    [attr.aria-label]=\"buttonAriaLabel()\"\n    (click)=\"emitSearch()\"\n  >\n    <tedi-icon [name]=\"btn.icon ?? 'search'\" [size]=\"buttonIconSize()\" />\n    @if (btn.text) {\n      {{ btn.text }}\n    }\n  </button>\n}\n\n<div\n  class=\"tedi-search__announcement sr-only\"\n  role=\"status\"\n  aria-live=\"polite\"\n  aria-atomic=\"true\"\n>\n  {{ announcement() }}\n</div>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"origin\"\n  [cdkConnectedOverlayOpen]=\"panelVisible()\"\n  [cdkConnectedOverlayWidth]=\"panelWidth()\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayDisableClose]=\"true\"\n  (overlayOutsideClick)=\"closePanel()\"\n  (positionChange)=\"onPositionChange($event)\"\n  (attach)=\"onOverlayAttach()\"\n  (detach)=\"onOverlayDetach()\"\n>\n  <div\n    class=\"tedi-search__panel\"\n    [class.tedi-search__panel--above]=\"panelAbove()\"\n  >\n    @if (loading()) {\n      <div class=\"tedi-search__panel-status\">\n        <tedi-spinner [size]=\"16\" />\n        <span tedi-text color=\"tertiary\">{{ resolvedLoadingText() }}</span>\n      </div>\n    } @else if (hasSuggestions()) {\n      <ul class=\"tedi-search__panel-list\" role=\"listbox\" [id]=\"listboxId()\">\n        @for (\n          suggestion of resolvedSuggestions();\n          track suggestion.label + $index;\n          let i = $index\n        ) {\n          <li\n            tedi-search-suggestion\n            [label]=\"suggestion.label\"\n            [description]=\"suggestion.description\"\n            [disabled]=\"suggestion.disabled\"\n            [query]=\"query()\"\n            [custom]=\"!!suggestionTemplate()\"\n            [id]=\"optionId(i)\"\n            (mousedown)=\"$event.preventDefault()\"\n            (click)=\"selectSuggestion(suggestion)\"\n          >\n            @if (suggestionTemplate(); as tpl) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"{\n                  $implicit: suggestion.item,\n                  item: suggestion.item,\n                  index: i,\n                  label: suggestion.label,\n                  description: suggestion.description,\n                  disabled: suggestion.disabled,\n                  query: query(),\n                }\"\n              />\n            }\n          </li>\n        }\n      </ul>\n    } @else {\n      <div class=\"tedi-search__panel-status\">\n        <span tedi-text color=\"tertiary\">{{ resolvedNoResultsText() }}</span>\n      </div>\n    }\n\n    @if (footerTemplate(); as footer) {\n      <div\n        class=\"tedi-search__footer\"\n        (keydown)=\"onFooterKeydown($event)\"\n        (focusout)=\"onFocusOut($event)\"\n      >\n        <ng-container [ngTemplateOutlet]=\"footer.template\" />\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [".tedi-search{display:flex;align-items:flex-end;width:100%}.tedi-search__field{flex:1 1 auto;min-width:0}.tedi-search__button{flex:0 0 auto;align-self:flex-end;white-space:nowrap}.tedi-search .tedi-search__button{height:var(--tedi-search-field-height);min-height:0;border-radius:0 var(--button-radius-sm) var(--button-radius-sm) 0}.tedi-search--button-icon-only .tedi-search__button{width:var(--tedi-search-field-height);padding-right:0;padding-left:0}.tedi-search--has-button .tedi-field-surface{border-right-width:0;border-top-right-radius:0;border-bottom-right-radius:0}.tedi-search__panel{display:flex;flex-direction:column;width:100%;max-height:var(--form-select-area-max-height);overflow:hidden;background:var(--dropdown-item-default-background);border:1px solid var(--card-border-primary);border-radius:0 0 var(--form-select-area-radius) var(--form-select-area-radius);box-shadow:0 1px 5px 0 var(--general-effect-colors-elevation-dropdown-area-drop-shadow)}.tedi-search__panel--above{border-radius:var(--form-select-area-radius) var(--form-select-area-radius) 0 0}.tedi-search__panel-list{min-height:0;padding:0;margin:0;overflow-y:auto;list-style:none}.tedi-search__footer{display:flex;flex:0 0 auto;flex-direction:column;gap:var(--dropdown-item-inner-spacing);align-items:center;padding:var(--card-padding-md-default);background:var(--dropdown-item-default-background);border-top:1px solid var(--card-border-primary)}.tedi-search-footer-actions{display:flex;flex-wrap:wrap;gap:var(--button-gutter-x);justify-content:center}.tedi-search__panel-status{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], showClearOnInteraction: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearOnInteraction", required: false }] }], searchIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchIcon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], button: [{ type: i0.Input, args: [{ isSignal: true, alias: "button", required: false }] }], feedbackText: [{ type: i0.Input, args: [{ isSignal: true, alias: "feedbackText", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], suggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "suggestions", required: false }] }], bindLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindLabel", required: false }] }], bindDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindDescription", required: false }] }], bindDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindDisabled", required: false }] }], minQueryLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minQueryLength", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], hideOnScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnScroll", required: false }] }], panelOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelOpen", required: false }] }, { type: i0.Output, args: ["panelOpenChange"] }], noResultsText: [{ type: i0.Input, args: [{ isSignal: true, alias: "noResultsText", required: false }] }], loadingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingText", required: false }] }], resultsCountText: [{ type: i0.Input, args: [{ isSignal: true, alias: "resultsCountText", required: false }] }], searchEvent: [{ type: i0.Output, args: ["searchEvent"] }], clear: [{ type: i0.Output, args: ["clear"] }], suggestionSelect: [{ type: i0.Output, args: ["suggestionSelect"] }], suggestionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SearchSuggestionTemplateDirective), { isSignal: true }] }], footerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SearchFooterTemplateDirective), { isSignal: true }] }], inputRef: [{ type: i0.ViewChild, args: ["searchInput", { ...{ read: ElementRef }, isSignal: true }] }], overlayOrigin: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkOverlayOrigin), { isSignal: true }] }], connectedOverlay: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkConnectedOverlay), { isSignal: true }] }], suggestionRows: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => SearchSuggestionComponent), { isSignal: true }] }] } });
+                    }, template: "<tedi-form-field\n  class=\"tedi-search__field\"\n  [size]=\"size()\"\n  [icon]=\"fieldIcon()\"\n  [clearable]=\"clearable() && !isDisabled()\"\n  [showClearOnInteraction]=\"showClearOnInteraction()\"\n>\n  @if (label()) {\n    <label tedi-label [for]=\"inputId()\">\n      {{ label() }}\n    </label>\n  }\n\n  <input\n    #searchInput\n    tedi-text-field\n    type=\"text\"\n    [attr.role]=\"inputRole()\"\n    [attr.aria-autocomplete]=\"ariaAutocomplete()\"\n    [attr.aria-expanded]=\"ariaExpanded()\"\n    [attr.aria-controls]=\"ariaControls()\"\n    [attr.aria-activedescendant]=\"activeOptionId()\"\n    [id]=\"inputId()\"\n    [value]=\"value()\"\n    [placeholder]=\"placeholder()\"\n    [disabled]=\"isDisabled()\"\n    [attr.aria-label]=\"inputAriaLabel()\"\n    (valueChange)=\"onInputValue($event)\"\n    (clear)=\"onClear()\"\n    (focus)=\"onInputFocus()\"\n    (keydown)=\"onKeydown($event)\"\n    (blur)=\"onBlur()\"\n  />\n\n  @if (feedbackText(); as feedback) {\n    <tedi-feedback-text\n      [id]=\"feedbackId()\"\n      [text]=\"feedback.text\"\n      [type]=\"feedback.type\"\n      [position]=\"feedback.position\"\n    />\n  }\n</tedi-form-field>\n\n@if (button(); as btn) {\n  <button\n    tedi-button\n    type=\"button\"\n    class=\"tedi-search__button\"\n    [variant]=\"btn.variant ?? 'primary'\"\n    [size]=\"buttonSize()\"\n    [disabled]=\"isDisabled()\"\n    [attr.aria-label]=\"buttonAriaLabel()\"\n    (click)=\"emitSearch()\"\n  >\n    <tedi-icon [name]=\"btn.icon ?? 'search'\" [size]=\"buttonIconSize()\" />\n    @if (btn.text) {\n      {{ btn.text }}\n    }\n  </button>\n}\n\n<div\n  class=\"tedi-search__announcement sr-only\"\n  role=\"status\"\n  aria-live=\"polite\"\n  aria-atomic=\"true\"\n>\n  {{ announcement() }}\n</div>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"panelOrigin()\"\n  [cdkConnectedOverlayOpen]=\"panelVisible()\"\n  [cdkConnectedOverlayWidth]=\"panelWidth()\"\n  [cdkConnectedOverlayPositions]=\"overlayPositions\"\n  [cdkConnectedOverlayDisableClose]=\"true\"\n  (overlayOutsideClick)=\"closePanel()\"\n  (attach)=\"onOverlayAttach()\"\n  (detach)=\"onOverlayDetach()\"\n>\n  <div class=\"tedi-search__panel\">\n    @if (loading()) {\n      <div class=\"tedi-search__panel-status\">\n        <tedi-spinner [size]=\"16\" />\n        <span tedi-text color=\"tertiary\">{{ resolvedLoadingText() }}</span>\n      </div>\n    } @else if (hasSuggestions()) {\n      <ul class=\"tedi-search__panel-list\" role=\"listbox\" [id]=\"listboxId()\">\n        @for (\n          suggestion of resolvedSuggestions();\n          track suggestion.label + $index;\n          let i = $index\n        ) {\n          <li\n            tedi-search-suggestion\n            [label]=\"suggestion.label\"\n            [description]=\"suggestion.description\"\n            [disabled]=\"suggestion.disabled\"\n            [query]=\"query()\"\n            [custom]=\"!!suggestionTemplate()\"\n            [id]=\"optionId(i)\"\n            (mousedown)=\"$event.preventDefault()\"\n            (click)=\"selectSuggestion(suggestion)\"\n          >\n            @if (suggestionTemplate(); as tpl) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"{\n                  $implicit: suggestion.item,\n                  item: suggestion.item,\n                  index: i,\n                  label: suggestion.label,\n                  description: suggestion.description,\n                  disabled: suggestion.disabled,\n                  query: query(),\n                }\"\n              />\n            }\n          </li>\n        }\n      </ul>\n    } @else {\n      <div class=\"tedi-search__panel-status\">\n        <span tedi-text color=\"tertiary\">{{ resolvedNoResultsText() }}</span>\n      </div>\n    }\n\n    @if (footerTemplate(); as footer) {\n      <div\n        class=\"tedi-search__footer\"\n        (keydown)=\"onFooterKeydown($event)\"\n        (focusout)=\"onFocusOut($event)\"\n      >\n        <ng-container [ngTemplateOutlet]=\"footer.template\" />\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [".tedi-search{display:flex;align-items:flex-end;width:100%}.tedi-search__field{flex:1 1 auto;min-width:0}.tedi-search__button{flex:0 0 auto;align-self:flex-end;white-space:nowrap}.tedi-search .tedi-search__button{height:var(--tedi-search-field-height);min-height:0;border-radius:0 var(--button-radius-sm) var(--button-radius-sm) 0}.tedi-search--button-icon-only .tedi-search__button{width:var(--tedi-search-field-height);padding-right:0;padding-left:0}.tedi-search--has-button .tedi-field-surface{border-right-width:0;border-top-right-radius:0;border-bottom-right-radius:0}.tedi-search__panel{display:flex;flex-direction:column;width:100%;max-height:var(--form-select-area-max-height);overflow:hidden;background:var(--dropdown-item-default-background);border:1px solid var(--card-border-primary);border-radius:var(--form-select-area-radius);box-shadow:0 1px 5px 0 var(--general-effect-colors-elevation-dropdown-area-drop-shadow)}.tedi-search__panel-list{min-height:0;padding:0;margin:0;overflow-y:auto;list-style:none}.tedi-search__footer{display:flex;flex:0 0 auto;flex-direction:column;gap:var(--dropdown-item-inner-spacing);align-items:center;padding:var(--card-padding-md-default);background:var(--dropdown-item-default-background);border-top:1px solid var(--card-border-primary)}.tedi-search-footer-actions{display:flex;flex-wrap:wrap;gap:var(--button-gutter-x);justify-content:center}.tedi-search__panel-status{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], showClearOnInteraction: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearOnInteraction", required: false }] }], searchIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchIcon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], button: [{ type: i0.Input, args: [{ isSignal: true, alias: "button", required: false }] }], feedbackText: [{ type: i0.Input, args: [{ isSignal: true, alias: "feedbackText", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], suggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "suggestions", required: false }] }], bindLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindLabel", required: false }] }], bindDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindDescription", required: false }] }], bindDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindDisabled", required: false }] }], minQueryLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minQueryLength", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], hideOnScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnScroll", required: false }] }], panelOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelOpen", required: false }] }, { type: i0.Output, args: ["panelOpenChange"] }], noResultsText: [{ type: i0.Input, args: [{ isSignal: true, alias: "noResultsText", required: false }] }], loadingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingText", required: false }] }], resultsCountText: [{ type: i0.Input, args: [{ isSignal: true, alias: "resultsCountText", required: false }] }], searchEvent: [{ type: i0.Output, args: ["searchEvent"] }], clear: [{ type: i0.Output, args: ["clear"] }], suggestionSelect: [{ type: i0.Output, args: ["suggestionSelect"] }], suggestionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SearchSuggestionTemplateDirective), { isSignal: true }] }], footerTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SearchFooterTemplateDirective), { isSignal: true }] }], inputRef: [{ type: i0.ViewChild, args: ["searchInput", { ...{
+                            read: (ElementRef),
+                        }, isSignal: true }] }], connectedOverlay: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkConnectedOverlay), { isSignal: true }] }], suggestionRows: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => SearchSuggestionComponent), { isSignal: true }] }] } });
 /**
  * Row of buttons inside a `tediSearchFooter`. Centres them and wraps to a new
@@ -18590,13 +18779,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
  */
 class SearchFooterActionsComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: SearchFooterActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.24", type: SearchFooterActionsComponent, isStandalone: true, selector: "tedi-search-footer-actions", host: { classAttribute: "tedi-search-footer-actions" }, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-search{display:flex;align-items:flex-end;width:100%}.tedi-search__field{flex:1 1 auto;min-width:0}.tedi-search__button{flex:0 0 auto;align-self:flex-end;white-space:nowrap}.tedi-search .tedi-search__button{height:var(--tedi-search-field-height);min-height:0;border-radius:0 var(--button-radius-sm) var(--button-radius-sm) 0}.tedi-search--button-icon-only .tedi-search__button{width:var(--tedi-search-field-height);padding-right:0;padding-left:0}.tedi-search--has-button .tedi-field-surface{border-right-width:0;border-top-right-radius:0;border-bottom-right-radius:0}.tedi-search__panel{display:flex;flex-direction:column;width:100%;max-height:var(--form-select-area-max-height);overflow:hidden;background:var(--dropdown-item-default-background);border:1px solid var(--card-border-primary);border-radius:0 0 var(--form-select-area-radius) var(--form-select-area-radius);box-shadow:0 1px 5px 0 var(--general-effect-colors-elevation-dropdown-area-drop-shadow)}.tedi-search__panel--above{border-radius:var(--form-select-area-radius) var(--form-select-area-radius) 0 0}.tedi-search__panel-list{min-height:0;padding:0;margin:0;overflow-y:auto;list-style:none}.tedi-search__footer{display:flex;flex:0 0 auto;flex-direction:column;gap:var(--dropdown-item-inner-spacing);align-items:center;padding:var(--card-padding-md-default);background:var(--dropdown-item-default-background);border-top:1px solid var(--card-border-primary)}.tedi-search-footer-actions{display:flex;flex-wrap:wrap;gap:var(--button-gutter-x);justify-content:center}.tedi-search__panel-status{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.24", type: SearchFooterActionsComponent, isStandalone: true, selector: "tedi-search-footer-actions", host: { classAttribute: "tedi-search-footer-actions" }, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-search{display:flex;align-items:flex-end;width:100%}.tedi-search__field{flex:1 1 auto;min-width:0}.tedi-search__button{flex:0 0 auto;align-self:flex-end;white-space:nowrap}.tedi-search .tedi-search__button{height:var(--tedi-search-field-height);min-height:0;border-radius:0 var(--button-radius-sm) var(--button-radius-sm) 0}.tedi-search--button-icon-only .tedi-search__button{width:var(--tedi-search-field-height);padding-right:0;padding-left:0}.tedi-search--has-button .tedi-field-surface{border-right-width:0;border-top-right-radius:0;border-bottom-right-radius:0}.tedi-search__panel{display:flex;flex-direction:column;width:100%;max-height:var(--form-select-area-max-height);overflow:hidden;background:var(--dropdown-item-default-background);border:1px solid var(--card-border-primary);border-radius:var(--form-select-area-radius);box-shadow:0 1px 5px 0 var(--general-effect-colors-elevation-dropdown-area-drop-shadow)}.tedi-search__panel-list{min-height:0;padding:0;margin:0;overflow-y:auto;list-style:none}.tedi-search__footer{display:flex;flex:0 0 auto;flex-direction:column;gap:var(--dropdown-item-inner-spacing);align-items:center;padding:var(--card-padding-md-default);background:var(--dropdown-item-default-background);border-top:1px solid var(--card-border-primary)}.tedi-search-footer-actions{display:flex;flex-wrap:wrap;gap:var(--button-gutter-x);justify-content:center}.tedi-search__panel-status{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: SearchFooterActionsComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: "tedi-search-footer-actions", template: "<ng-content />", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "tedi-search-footer-actions",
-                    }, styles: [".tedi-search{display:flex;align-items:flex-end;width:100%}.tedi-search__field{flex:1 1 auto;min-width:0}.tedi-search__button{flex:0 0 auto;align-self:flex-end;white-space:nowrap}.tedi-search .tedi-search__button{height:var(--tedi-search-field-height);min-height:0;border-radius:0 var(--button-radius-sm) var(--button-radius-sm) 0}.tedi-search--button-icon-only .tedi-search__button{width:var(--tedi-search-field-height);padding-right:0;padding-left:0}.tedi-search--has-button .tedi-field-surface{border-right-width:0;border-top-right-radius:0;border-bottom-right-radius:0}.tedi-search__panel{display:flex;flex-direction:column;width:100%;max-height:var(--form-select-area-max-height);overflow:hidden;background:var(--dropdown-item-default-background);border:1px solid var(--card-border-primary);border-radius:0 0 var(--form-select-area-radius) var(--form-select-area-radius);box-shadow:0 1px 5px 0 var(--general-effect-colors-elevation-dropdown-area-drop-shadow)}.tedi-search__panel--above{border-radius:var(--form-select-area-radius) var(--form-select-area-radius) 0 0}.tedi-search__panel-list{min-height:0;padding:0;margin:0;overflow-y:auto;list-style:none}.tedi-search__footer{display:flex;flex:0 0 auto;flex-direction:column;gap:var(--dropdown-item-inner-spacing);align-items:center;padding:var(--card-padding-md-default);background:var(--dropdown-item-default-background);border-top:1px solid var(--card-border-primary)}.tedi-search-footer-actions{display:flex;flex-wrap:wrap;gap:var(--button-gutter-x);justify-content:center}.tedi-search__panel-status{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}\n"] }]
+                    }, styles: [".tedi-search{display:flex;align-items:flex-end;width:100%}.tedi-search__field{flex:1 1 auto;min-width:0}.tedi-search__button{flex:0 0 auto;align-self:flex-end;white-space:nowrap}.tedi-search .tedi-search__button{height:var(--tedi-search-field-height);min-height:0;border-radius:0 var(--button-radius-sm) var(--button-radius-sm) 0}.tedi-search--button-icon-only .tedi-search__button{width:var(--tedi-search-field-height);padding-right:0;padding-left:0}.tedi-search--has-button .tedi-field-surface{border-right-width:0;border-top-right-radius:0;border-bottom-right-radius:0}.tedi-search__panel{display:flex;flex-direction:column;width:100%;max-height:var(--form-select-area-max-height);overflow:hidden;background:var(--dropdown-item-default-background);border:1px solid var(--card-border-primary);border-radius:var(--form-select-area-radius);box-shadow:0 1px 5px 0 var(--general-effect-colors-elevation-dropdown-area-drop-shadow)}.tedi-search__panel-list{min-height:0;padding:0;margin:0;overflow-y:auto;list-style:none}.tedi-search__footer{display:flex;flex:0 0 auto;flex-direction:column;gap:var(--dropdown-item-inner-spacing);align-items:center;padding:var(--card-padding-md-default);background:var(--dropdown-item-default-background);border-top:1px solid var(--card-border-primary)}.tedi-search-footer-actions{display:flex;flex-wrap:wrap;gap:var(--button-gutter-x);justify-content:center}.tedi-search__panel-status{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;justify-content:center;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x)}\n"] }]
         }] });
 class SliderComponent {
@@ -18905,7 +19094,7 @@ class ToggleComponent {
                 useExisting: forwardRef(() => ToggleComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<input\n  #inputElement\n  [id]=\"inputId()\"\n  [checked]=\"checked()\"\n  [disabled]=\"disabled()\"\n  [required]=\"required()\"\n  [attr.aria-checked]=\"checked()\"\n  [attr.aria-label]=\"ariaLabel() || null\"\n  type=\"checkbox\"\n  class=\"tedi-toggle__input\"\n  role=\"switch\"\n  (change)=\"handleChange($event)\"\n/>\n<span class=\"tedi-toggle__slider\" aria-hidden=\"true\">\n  @if (icon() && size() === \"large\") {\n    <tedi-icon\n      [name]=\"checked() ? 'lock_open_right' : 'lock'\"\n      [color]=\"iconColor()\"\n      [size]=\"16\"\n      class=\"tedi-toggle__icon\"\n    />\n  }\n</span>\n", styles: [".tedi-toggle{position:relative;display:block}.tedi-toggle--size-default{--_toggle-indicator: var(--form-toggle-default-indicator);width:var(--form-toggle-default-width);height:var(--form-toggle-default-height)}.tedi-toggle--size-default .tedi-toggle__slider{width:var(--form-toggle-default-indicator);height:var(--form-toggle-default-indicator)}.tedi-toggle--size-large{--_toggle-indicator: var(--form-toggle-large-indicator);width:var(--form-toggle-large-width);height:var(--form-toggle-large-height)}.tedi-toggle--size-large .tedi-toggle__slider{width:var(--form-toggle-large-indicator);height:var(--form-toggle-large-indicator)}.tedi-toggle--primary-filled .tedi-toggle__input{background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-filled .tedi-toggle__input:hover{background-color:var(--form-toggle-primary-inactive-hover)}.tedi-toggle--primary-filled .tedi-toggle__input:active{background-color:var(--form-toggle-primary-inactive-active)}.tedi-toggle--primary-filled .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-filled .tedi-toggle__input:disabled{cursor:not-allowed;background-color:var(--form-toggle-primary-inactive-default);opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-indicator)}.tedi-toggle--primary-filled .tedi-toggle__input:checked{background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:hover{background-color:var(--form-toggle-primary-active-hover)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:active{background-color:var(--form-toggle-primary-active-active)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:disabled{cursor:not-allowed;background-color:var(--form-toggle-primary-active-default);opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:checked:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-indicator)}.tedi-toggle--primary-outlined .tedi-toggle__input{border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:hover{border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:hover+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:active{border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:active+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-default);opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:checked{border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:hover{border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:hover+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:active{border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:active+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-default);opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input{background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-filled .tedi-toggle__input:hover{background-color:var(--form-toggle-colored-inactive-hover)}.tedi-toggle--colored-filled .tedi-toggle__input:active{background-color:var(--form-toggle-colored-inactive-active)}.tedi-toggle--colored-filled .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-filled .tedi-toggle__input:disabled{cursor:not-allowed;background-color:var(--form-toggle-colored-inactive-default);opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-indicator)}.tedi-toggle--colored-filled .tedi-toggle__input:checked{background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:hover{background-color:var(--form-toggle-colored-active-hover)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:active{background-color:var(--form-toggle-colored-active-active)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:disabled{cursor:not-allowed;background-color:var(--form-toggle-colored-active-default);opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:checked:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-indicator)}.tedi-toggle--colored-outlined .tedi-toggle__input{border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:hover{border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:hover+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:active{border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:active+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-default);opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:checked{border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:hover{border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:hover+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:active{border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:active+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-default);opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle__input{width:100%;height:100%;margin:0;appearance:none;cursor:pointer;border-radius:var(--form-toggle-radius)}.tedi-toggle__input:checked+.tedi-toggle__slider{left:calc(100% - var(--_toggle-indicator) - var(--form-toggle-padding));transform:translateY(-50%)}.tedi-toggle__slider{position:absolute;top:50%;left:var(--form-toggle-padding);display:flex;align-items:center;justify-content:center;pointer-events:none;border-radius:50%;transform:translateY(-50%);transition:left .17s ease-out}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<input\n  #inputElement\n  [id]=\"inputId()\"\n  [checked]=\"checked()\"\n  [disabled]=\"disabled()\"\n  [required]=\"required()\"\n  [attr.aria-checked]=\"checked()\"\n  [attr.aria-label]=\"ariaLabel() || null\"\n  type=\"checkbox\"\n  class=\"tedi-toggle__input\"\n  role=\"switch\"\n  (change)=\"handleChange($event)\"\n/>\n<span class=\"tedi-toggle__slider\" aria-hidden=\"true\">\n  @if (icon() && size() === \"large\") {\n    <tedi-icon\n      [name]=\"checked() ? 'lock_open_right' : 'lock'\"\n      [color]=\"iconColor()\"\n      [size]=\"16\"\n      class=\"tedi-toggle__icon\"\n    />\n  }\n</span>\n", styles: [".tedi-toggle{position:relative;display:block}.tedi-toggle--size-default{--_toggle-indicator: var(--form-toggle-default-indicator);width:var(--form-toggle-default-width);height:var(--form-toggle-default-height)}.tedi-toggle--size-default .tedi-toggle__slider{width:var(--form-toggle-default-indicator);height:var(--form-toggle-default-indicator)}.tedi-toggle--size-large{--_toggle-indicator: var(--form-toggle-large-indicator);width:var(--form-toggle-large-width);height:var(--form-toggle-large-height)}.tedi-toggle--size-large .tedi-toggle__slider{width:var(--form-toggle-large-indicator);height:var(--form-toggle-large-indicator)}.tedi-toggle--primary-filled .tedi-toggle__input{background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-filled .tedi-toggle__input:hover{background-color:var(--form-toggle-primary-unselected-hover)}.tedi-toggle--primary-filled .tedi-toggle__input:active{background-color:var(--form-toggle-primary-unselected-active)}.tedi-toggle--primary-filled .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-filled .tedi-toggle__input:disabled{cursor:not-allowed;background-color:var(--form-toggle-primary-unselected-default);opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-indicator)}.tedi-toggle--primary-filled .tedi-toggle__input:checked{background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:hover{background-color:var(--form-toggle-primary-selected-hover)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:active{background-color:var(--form-toggle-primary-selected-active)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:disabled{cursor:not-allowed;background-color:var(--form-toggle-primary-selected-default);opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:checked:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-indicator)}.tedi-toggle--primary-outlined .tedi-toggle__input{border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:hover{border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:hover+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:active{border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:active+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-default);opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:checked{border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:hover{border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:hover+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:active{border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:active+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-default);opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input{background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-filled .tedi-toggle__input:hover{background-color:var(--form-toggle-colored-unselected-hover)}.tedi-toggle--colored-filled .tedi-toggle__input:active{background-color:var(--form-toggle-colored-unselected-active)}.tedi-toggle--colored-filled .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-filled .tedi-toggle__input:disabled{cursor:not-allowed;background-color:var(--form-toggle-colored-unselected-default);opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-indicator)}.tedi-toggle--colored-filled .tedi-toggle__input:checked{background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:hover{background-color:var(--form-toggle-colored-selected-hover)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:active{background-color:var(--form-toggle-colored-selected-active)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:disabled{cursor:not-allowed;background-color:var(--form-toggle-colored-selected-default);opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:checked:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-indicator)}.tedi-toggle--colored-outlined .tedi-toggle__input{border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:hover{border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:hover+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:active{border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:active+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-default);opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:checked{border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:hover{border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:hover+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:active{border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:active+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-default);opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle__input{width:100%;height:100%;margin:0;appearance:none;cursor:pointer;border-radius:var(--form-toggle-radius)}.tedi-toggle__input:checked+.tedi-toggle__slider{left:calc(100% - var(--_toggle-indicator) - var(--form-toggle-padding));transform:translateY(-50%)}.tedi-toggle__slider{position:absolute;top:50%;left:var(--form-toggle-padding);display:flex;align-items:center;justify-content:center;pointer-events:none;border-radius:50%;transform:translateY(-50%);transition:left .17s ease-out}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: ToggleComponent, decorators: [{
             type: Component,
@@ -18917,7 +19106,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         },
                     ], host: {
                         "[class]": "classes()",
-                    }, template: "<input\n  #inputElement\n  [id]=\"inputId()\"\n  [checked]=\"checked()\"\n  [disabled]=\"disabled()\"\n  [required]=\"required()\"\n  [attr.aria-checked]=\"checked()\"\n  [attr.aria-label]=\"ariaLabel() || null\"\n  type=\"checkbox\"\n  class=\"tedi-toggle__input\"\n  role=\"switch\"\n  (change)=\"handleChange($event)\"\n/>\n<span class=\"tedi-toggle__slider\" aria-hidden=\"true\">\n  @if (icon() && size() === \"large\") {\n    <tedi-icon\n      [name]=\"checked() ? 'lock_open_right' : 'lock'\"\n      [color]=\"iconColor()\"\n      [size]=\"16\"\n      class=\"tedi-toggle__icon\"\n    />\n  }\n</span>\n", styles: [".tedi-toggle{position:relative;display:block}.tedi-toggle--size-default{--_toggle-indicator: var(--form-toggle-default-indicator);width:var(--form-toggle-default-width);height:var(--form-toggle-default-height)}.tedi-toggle--size-default .tedi-toggle__slider{width:var(--form-toggle-default-indicator);height:var(--form-toggle-default-indicator)}.tedi-toggle--size-large{--_toggle-indicator: var(--form-toggle-large-indicator);width:var(--form-toggle-large-width);height:var(--form-toggle-large-height)}.tedi-toggle--size-large .tedi-toggle__slider{width:var(--form-toggle-large-indicator);height:var(--form-toggle-large-indicator)}.tedi-toggle--primary-filled .tedi-toggle__input{background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-filled .tedi-toggle__input:hover{background-color:var(--form-toggle-primary-inactive-hover)}.tedi-toggle--primary-filled .tedi-toggle__input:active{background-color:var(--form-toggle-primary-inactive-active)}.tedi-toggle--primary-filled .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-filled .tedi-toggle__input:disabled{cursor:not-allowed;background-color:var(--form-toggle-primary-inactive-default);opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-indicator)}.tedi-toggle--primary-filled .tedi-toggle__input:checked{background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:hover{background-color:var(--form-toggle-primary-active-hover)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:active{background-color:var(--form-toggle-primary-active-active)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:disabled{cursor:not-allowed;background-color:var(--form-toggle-primary-active-default);opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:checked:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-indicator)}.tedi-toggle--primary-outlined .tedi-toggle__input{border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:hover{border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:hover+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:active{border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:active+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-primary-inactive-default);opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-primary-inactive-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:checked{border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:hover{border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:hover+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:active{border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:active+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-primary-active-default);opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-primary-active-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input{background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-filled .tedi-toggle__input:hover{background-color:var(--form-toggle-colored-inactive-hover)}.tedi-toggle--colored-filled .tedi-toggle__input:active{background-color:var(--form-toggle-colored-inactive-active)}.tedi-toggle--colored-filled .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-filled .tedi-toggle__input:disabled{cursor:not-allowed;background-color:var(--form-toggle-colored-inactive-default);opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-indicator)}.tedi-toggle--colored-filled .tedi-toggle__input:checked{background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:hover{background-color:var(--form-toggle-colored-active-hover)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:active{background-color:var(--form-toggle-colored-active-active)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:disabled{cursor:not-allowed;background-color:var(--form-toggle-colored-active-default);opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:checked:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-indicator)}.tedi-toggle--colored-outlined .tedi-toggle__input{border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:hover{border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:hover+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:active{border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:active+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-colored-inactive-default);opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-colored-inactive-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:checked{border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:hover{border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:hover+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:active{border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:active+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-active-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-colored-active-default);opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-colored-active-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle__input{width:100%;height:100%;margin:0;appearance:none;cursor:pointer;border-radius:var(--form-toggle-radius)}.tedi-toggle__input:checked+.tedi-toggle__slider{left:calc(100% - var(--_toggle-indicator) - var(--form-toggle-padding));transform:translateY(-50%)}.tedi-toggle__slider{position:absolute;top:50%;left:var(--form-toggle-padding);display:flex;align-items:center;justify-content:center;pointer-events:none;border-radius:50%;transform:translateY(-50%);transition:left .17s ease-out}\n"] }]
+                    }, template: "<input\n  #inputElement\n  [id]=\"inputId()\"\n  [checked]=\"checked()\"\n  [disabled]=\"disabled()\"\n  [required]=\"required()\"\n  [attr.aria-checked]=\"checked()\"\n  [attr.aria-label]=\"ariaLabel() || null\"\n  type=\"checkbox\"\n  class=\"tedi-toggle__input\"\n  role=\"switch\"\n  (change)=\"handleChange($event)\"\n/>\n<span class=\"tedi-toggle__slider\" aria-hidden=\"true\">\n  @if (icon() && size() === \"large\") {\n    <tedi-icon\n      [name]=\"checked() ? 'lock_open_right' : 'lock'\"\n      [color]=\"iconColor()\"\n      [size]=\"16\"\n      class=\"tedi-toggle__icon\"\n    />\n  }\n</span>\n", styles: [".tedi-toggle{position:relative;display:block}.tedi-toggle--size-default{--_toggle-indicator: var(--form-toggle-default-indicator);width:var(--form-toggle-default-width);height:var(--form-toggle-default-height)}.tedi-toggle--size-default .tedi-toggle__slider{width:var(--form-toggle-default-indicator);height:var(--form-toggle-default-indicator)}.tedi-toggle--size-large{--_toggle-indicator: var(--form-toggle-large-indicator);width:var(--form-toggle-large-width);height:var(--form-toggle-large-height)}.tedi-toggle--size-large .tedi-toggle__slider{width:var(--form-toggle-large-indicator);height:var(--form-toggle-large-indicator)}.tedi-toggle--primary-filled .tedi-toggle__input{background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-filled .tedi-toggle__input:hover{background-color:var(--form-toggle-primary-unselected-hover)}.tedi-toggle--primary-filled .tedi-toggle__input:active{background-color:var(--form-toggle-primary-unselected-active)}.tedi-toggle--primary-filled .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-filled .tedi-toggle__input:disabled{cursor:not-allowed;background-color:var(--form-toggle-primary-unselected-default);opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-indicator)}.tedi-toggle--primary-filled .tedi-toggle__input:checked{background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:hover{background-color:var(--form-toggle-primary-selected-hover)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:active{background-color:var(--form-toggle-primary-selected-active)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-filled .tedi-toggle__input:checked:disabled{cursor:not-allowed;background-color:var(--form-toggle-primary-selected-default);opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:checked:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--primary-filled .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-indicator)}.tedi-toggle--primary-outlined .tedi-toggle__input{border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:hover{border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:hover+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:active{border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:active+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-primary-unselected-default);opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-primary-unselected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:checked{border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:hover{border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:hover+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-hover)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:active{border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:active+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-active)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-primary-selected-default);opacity:.5}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-primary-selected-default)}.tedi-toggle--primary-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input{background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-filled .tedi-toggle__input:hover{background-color:var(--form-toggle-colored-unselected-hover)}.tedi-toggle--colored-filled .tedi-toggle__input:active{background-color:var(--form-toggle-colored-unselected-active)}.tedi-toggle--colored-filled .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-filled .tedi-toggle__input:disabled{cursor:not-allowed;background-color:var(--form-toggle-colored-unselected-default);opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-indicator)}.tedi-toggle--colored-filled .tedi-toggle__input:checked{background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:hover{background-color:var(--form-toggle-colored-selected-hover)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:active{background-color:var(--form-toggle-colored-selected-active)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-filled .tedi-toggle__input:checked:disabled{cursor:not-allowed;background-color:var(--form-toggle-colored-selected-default);opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:checked:disabled+.tedi-toggle__slider .tedi-toggle__icon{opacity:.5}.tedi-toggle--colored-filled .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-indicator)}.tedi-toggle--colored-outlined .tedi-toggle__input{border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:hover{border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:hover+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:active{border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:active+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-colored-unselected-default);opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-colored-unselected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:checked{border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:hover{border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:hover+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-hover)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:active{border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:active+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-active)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:focus-visible{outline:calc(2 * var(--tedi-borders-01)) solid var(--form-toggle-primary-selected-default);outline-offset:var(--tedi-borders-01);border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:focus-visible+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled{cursor:not-allowed;border:var(--tedi-borders-01) solid var(--form-toggle-colored-selected-default);opacity:.5}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{background-color:var(--form-toggle-colored-selected-default)}.tedi-toggle--colored-outlined .tedi-toggle__input:checked:disabled+.tedi-toggle__slider{opacity:.5}.tedi-toggle__input{width:100%;height:100%;margin:0;appearance:none;cursor:pointer;border-radius:var(--form-toggle-radius)}.tedi-toggle__input:checked+.tedi-toggle__slider{left:calc(100% - var(--_toggle-indicator) - var(--form-toggle-padding));transform:translateY(-50%)}.tedi-toggle__slider{position:absolute;top:50%;left:var(--form-toggle-padding);display:flex;align-items:center;justify-content:center;pointer-events:none;border-radius:50%;transform:translateY(-50%);transition:left .17s ease-out}\n"] }]
         }], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: true }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], inputRef: [{
                 type: ViewChild,
                 args: ["inputElement"]
@@ -19104,18 +19293,19 @@ class TextareaComponent {
      * Number of rows the field rests at, and the fewest it can ever show. With no
      * `height` set this is what sizes the textarea, so it is the input to reach
      * for when a field needs to be taller or shorter — in every mode, not just
-     * while `autoGrow` is on.
+     * while `autoGrow` is on. Values below 1 are treated as 1. It never rests
+     * below the native `rows` (2 by default), so set `rows="1"` for a single-row
+     * field.
      *
      * @default 3
      */
     minRows = input(3, ...(ngDevMode ? [{ debugName: "minRows" }] : []));
     /**
      * Most rows the field shows before it starts scrolling. Caps `autoGrow`'s
-     * growth and how far the resize grip can be dragged.
-     *
-     * @default 12
+     * growth and how far the resize grip can be dragged. Unset, neither has a
+     * row limit.
      */
-    maxRows = input(12, ...(ngDevMode ? [{ debugName: "maxRows" }] : []));
+    maxRows = input(...(ngDevMode ? [undefined, { debugName: "maxRows" }] : []));
     /**
      * Exact resting height (e.g. `'7.5rem'`, `200` → `200px`), for the rare field
      * that has to match something other than a whole number of rows. Prefer
@@ -19144,17 +19334,25 @@ class TextareaComponent {
             return null;
         return this.toCssSize(height);
     }, ...(ngDevMode ? [{ debugName: "heightStyle" }] : []));
+    // Below one row the field is shorter than its own line of text and scrolls
+    // while empty.
+    resolvedMinRows = computed(() => Math.max(1, this.minRows()), ...(ngDevMode ? [{ debugName: "resolvedMinRows" }] : []));
     /**
      * `minRows` is the resting height as much as it is the floor: with no `height`
      * the textarea has nothing else to size to, so the floor is what it settles
      * at. That makes it the one number a consumer has to change.
      */
-    minHeightStyle = computed(() => this.rowsToHeight(this.minRows()), ...(ngDevMode ? [{ debugName: "minHeightStyle" }] : []));
+    minHeightStyle = computed(() => this.rowsToHeight(this.resolvedMinRows()), ...(ngDevMode ? [{ debugName: "minHeightStyle" }] : []));
     maxHeightStyle = computed(() => {
-        const limits = [this.rowsToHeight(this.maxRows())];
+        const limits = [];
+        const maxRows = this.maxRows();
         const maxHeight = this.maxHeight();
+        if (maxRows != null)
+            limits.push(this.rowsToHeight(maxRows));
         if (maxHeight != null)
             limits.push(this.toCssSize(maxHeight));
+        if (limits.length === 0)
+            return null;
         return limits.length === 1 ? limits[0] : `min(${limits.join(", ")})`;
     }, ...(ngDevMode ? [{ debugName: "maxHeightStyle" }] : []));
     // Native `readonly`, under both the attribute (`readonly`) and the property
@@ -19177,9 +19375,22 @@ class TextareaComponent {
             transform: booleanAttribute,
         }]));
     readOnly = computed(() => this.readOnlyAttribute() || this.readOnlyProperty(), ...(ngDevMode ? [{ debugName: "readOnly" }] : []));
-    /** Textareas take no clear button, even inside a `clearable` form field. */
-    clearButton = false;
-    disabled = computed(() => this.formDisabled() || (this.fieldContext?.disabled() ?? false), ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    /**
+     * Disables the textarea from a parent template. Combined with the
+     * reactive-forms disabled state and any input-group state, so a wrapping
+     * `tedi-form-field` sees it too.
+     */
+    disabledInput = input(false, ...(ngDevMode ? [{ debugName: "disabledInput",
+            // eslint-disable-next-line @angular-eslint/no-input-rename
+            alias: "disabled",
+            transform: booleanAttribute }] : [{
+            // eslint-disable-next-line @angular-eslint/no-input-rename
+            alias: "disabled",
+            transform: booleanAttribute,
+        }]));
+    disabled = computed(() => this.disabledInput() ||
+        this.formDisabled() ||
+        (this.fieldContext?.disabled() ?? false), ...(ngDevMode ? [{ debugName: "disabled" }] : []));
     derived = deriveControlState();
     describedBy = controlDescribedBy();
     touched = this.derived.touched;
@@ -19187,8 +19398,30 @@ class TextareaComponent {
     invalid = computed(() => this.invalidInput() ||
         this.derived.invalid() ||
         (this.fieldContext?.invalid() ?? false), ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    /**
+     * The textarea reaches under a wrapping field's clear button and icon, so a
+     * classic scrollbar would land beneath them. Reported so the field can move
+     * them clear of it; overlay scrollbars take no room and stay at 0.
+     */
+    scrollbarWidth = signal(0, ...(ngDevMode ? [{ debugName: "scrollbarWidth" }] : []));
+    resizeObserver = null;
     ngOnInit() {
         this.derived.connect();
+        // The content box narrows when a scrollbar appears, so this also catches
+        // overflow starting or stopping, not just resizes.
+        if (typeof ResizeObserver !== "undefined") {
+            this.resizeObserver = new ResizeObserver(() => this.measureScrollbarWidth());
+            this.resizeObserver.observe(this.el.nativeElement);
+        }
+    }
+    ngOnDestroy() {
+        this.resizeObserver?.disconnect();
+    }
+    measureScrollbarWidth() {
+        const el = this.el.nativeElement;
+        const style = getComputedStyle(el);
+        const borders = parseFloat(style.borderLeftWidth) + parseFloat(style.borderRightWidth);
+        this.scrollbarWidth.set(Math.max(0, el.offsetWidth - el.clientWidth - borders));
     }
     setDescribedBy(ids) {
         this.describedBy.set(ids);
@@ -19218,7 +19451,6 @@ class TextareaComponent {
     }
     setDisabledState(isDisabled) {
         this.formDisabled.set(isDisabled);
-        this.renderer.setProperty(this.el.nativeElement, "disabled", isDisabled);
     }
     handleInputChange(event) {
         const textarea = event.target;
@@ -19242,7 +19474,7 @@ class TextareaComponent {
         this.onTouched();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: TextareaComponent, isStandalone: true, selector: "textarea[tedi-textarea]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, autoGrow: { classPropertyName: "autoGrow", publicName: "autoGrow", isSignal: true, isRequired: false, transformFunction: null }, minRows: { classPropertyName: "minRows", publicName: "minRows", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, readOnlyAttribute: { classPropertyName: "readOnlyAttribute", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, readOnlyProperty: { classPropertyName: "readOnlyProperty", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { listeners: { "input": "handleInputChange($event)", "blur": "handleBlur()" }, properties: { "class.tedi-field-surface": "paintsSurface()", "class.tedi-field-surface--valid": "paintsSurface() && valid()", "class.tedi-textarea--small": "resolvedSize() === 'small'", "class.tedi-textarea--not-resizable": "!resizable()", "class.tedi-textarea--auto-grow": "autoGrow()", "style.height": "heightStyle()", "style.min-height": "minHeightStyle()", "style.max-height": "maxHeightStyle()", "attr.aria-invalid": "invalid() || null", "attr.aria-describedby": "describedBy.attribute()", "readOnly": "readOnly()" }, classAttribute: "tedi-textarea" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: TextareaComponent, isStandalone: true, selector: "textarea[tedi-textarea]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, autoGrow: { classPropertyName: "autoGrow", publicName: "autoGrow", isSignal: true, isRequired: false, transformFunction: null }, minRows: { classPropertyName: "minRows", publicName: "minRows", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, readOnlyAttribute: { classPropertyName: "readOnlyAttribute", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, readOnlyProperty: { classPropertyName: "readOnlyProperty", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { listeners: { "input": "handleInputChange($event)", "blur": "handleBlur()" }, properties: { "class.tedi-field-surface": "paintsSurface()", "class.tedi-field-surface--valid": "paintsSurface() && valid()", "class.tedi-textarea--small": "resolvedSize() === 'small'", "class.tedi-textarea--not-resizable": "!resizable()", "class.tedi-textarea--auto-grow": "autoGrow()", "style.height": "heightStyle()", "style.min-height": "minHeightStyle()", "style.max-height": "maxHeightStyle()", "attr.aria-invalid": "invalid() || null", "attr.aria-describedby": "describedBy.attribute()", "readOnly": "readOnly()", "disabled": "disabled()" }, classAttribute: "tedi-textarea" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => TextareaComponent),
@@ -19252,7 +19484,7 @@ class TextareaComponent {
                 provide: TEDI_FORM_FIELD_CONTROL,
                 useExisting: forwardRef(() => TextareaComponent),
             },
-        ], ngImport: i0, template: "", isInline: true, styles: [".tedi-textarea{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-textarea-min-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;width:100%;padding:var(--_field-padding-y) var(--form-field-padding-x-md-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled);resize:vertical;outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-textarea::placeholder{color:var(--form-input-text-placeholder)}.tedi-textarea:disabled{color:var(--form-input-text-disabled);cursor:not-allowed}.tedi-textarea:not(.tedi-field-surface){flex:1;min-width:0}.tedi-textarea--not-resizable{resize:none}.tedi-textarea--auto-grow{field-sizing:content;resize:none}.tedi-textarea:where(.tedi-field-surface){background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):active,.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):focus-visible{--_field-ring-color: var(--_field-border-color)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover{--_field-border-color: var(--form-input-border-hover)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active{--_field-border-color: var(--form-input-border-active)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-visible{--_field-border-color: var(--form-input-border-focus)}.tedi-textarea.tedi-field-surface:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-textarea--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-form-field__box:has(>.tedi-textarea){align-items:flex-start;height:auto;min-height:var(--_field-height);padding-block:0;padding-inline:0 var(--form-field-padding-x-md-default)}.tedi-form-field__box:has(>.tedi-textarea) .tedi-form-field__buttons,.tedi-form-field__box:has(>.tedi-textarea) .tedi-form-field__icon{display:flex;align-items:center;height:var(--_field-height)}.tedi-form-field__box>.tedi-textarea{padding-inline-end:calc(var(--form-field-padding-x-md-default) + var(--tedi-form-field-addon-lane));margin-inline-end:calc(-1 * (var(--form-field-padding-x-md-default) + var(--tedi-form-field-addon-lane)))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], ngImport: i0, template: "", isInline: true, styles: [".tedi-textarea{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-textarea-min-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;width:100%;padding:var(--_field-padding-y) var(--form-field-padding-x-md-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled);resize:vertical;outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-textarea::placeholder{color:var(--form-input-text-placeholder)}.tedi-textarea:disabled{color:var(--form-input-text-disabled);cursor:not-allowed}.tedi-textarea:not(.tedi-field-surface){flex:1;min-width:0}.tedi-textarea--not-resizable{resize:none}.tedi-textarea--auto-grow{field-sizing:content;resize:none}.tedi-textarea:where(.tedi-field-surface){background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);outline:calc(2 * var(--tedi-borders-01)) solid var(--_field-ring-color);outline-offset:calc(-2 * var(--tedi-borders-01));box-shadow:none}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):active,.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):focus-visible{--_field-ring-color: var(--_field-border-color)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover{--_field-border-color: var(--form-input-border-hover)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active{--_field-border-color: var(--form-input-border-active)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-visible{--_field-border-color: var(--form-input-border-focus)}.tedi-textarea.tedi-field-surface:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-textarea--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-form-field__box:has(>.tedi-textarea){outline:calc(2 * var(--tedi-borders-01)) solid var(--_field-ring-color);outline-offset:calc(-2 * var(--tedi-borders-01));box-shadow:none;align-items:flex-start;height:auto;min-height:var(--_field-height);padding-block:0;padding-inline:0 calc(var(--form-field-padding-x-md-default) + var(--tedi-form-field-control-scrollbar))}.tedi-form-field__box:has(>.tedi-textarea) .tedi-form-field__buttons,.tedi-form-field__box:has(>.tedi-textarea) .tedi-form-field__icon{display:flex;align-items:center;height:var(--_field-height)}.tedi-form-field__box>.tedi-textarea{padding-inline-end:calc(var(--form-field-padding-x-md-default) + var(--tedi-form-field-addon-lane));margin-inline-end:calc(-1 * (var(--form-field-padding-x-md-default) + var(--tedi-form-field-addon-lane) + var(--tedi-form-field-control-scrollbar)))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TextareaComponent, decorators: [{
             type: Component,
@@ -19279,10 +19511,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         "[attr.aria-invalid]": "invalid() || null",
                         "[attr.aria-describedby]": "describedBy.attribute()",
                         "[readOnly]": "readOnly()",
+                        "[disabled]": "disabled()",
                         "(input)": "handleInputChange($event)",
                         "(blur)": "handleBlur()",
-                    }, styles: [".tedi-textarea{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-textarea-min-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;width:100%;padding:var(--_field-padding-y) var(--form-field-padding-x-md-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled);resize:vertical;outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-textarea::placeholder{color:var(--form-input-text-placeholder)}.tedi-textarea:disabled{color:var(--form-input-text-disabled);cursor:not-allowed}.tedi-textarea:not(.tedi-field-surface){flex:1;min-width:0}.tedi-textarea--not-resizable{resize:none}.tedi-textarea--auto-grow{field-sizing:content;resize:none}.tedi-textarea:where(.tedi-field-surface){background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):active,.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):focus-visible{--_field-ring-color: var(--_field-border-color)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover{--_field-border-color: var(--form-input-border-hover)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active{--_field-border-color: var(--form-input-border-active)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-visible{--_field-border-color: var(--form-input-border-focus)}.tedi-textarea.tedi-field-surface:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-textarea--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-form-field__box:has(>.tedi-textarea){align-items:flex-start;height:auto;min-height:var(--_field-height);padding-block:0;padding-inline:0 var(--form-field-padding-x-md-default)}.tedi-form-field__box:has(>.tedi-textarea) .tedi-form-field__buttons,.tedi-form-field__box:has(>.tedi-textarea) .tedi-form-field__icon{display:flex;align-items:center;height:var(--_field-height)}.tedi-form-field__box>.tedi-textarea{padding-inline-end:calc(var(--form-field-padding-x-md-default) + var(--tedi-form-field-addon-lane));margin-inline-end:calc(-1 * (var(--form-field-padding-x-md-default) + var(--tedi-form-field-addon-lane)))}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], invalidInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], autoGrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoGrow", required: false }] }], minRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "minRows", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], readOnlyAttribute: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], readOnlyProperty: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }] } });
+                    }, styles: [".tedi-textarea{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-textarea-min-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;width:100%;padding:var(--_field-padding-y) var(--form-field-padding-x-md-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled);resize:vertical;outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-textarea::placeholder{color:var(--form-input-text-placeholder)}.tedi-textarea:disabled{color:var(--form-input-text-disabled);cursor:not-allowed}.tedi-textarea:not(.tedi-field-surface){flex:1;min-width:0}.tedi-textarea--not-resizable{resize:none}.tedi-textarea--auto-grow{field-sizing:content;resize:none}.tedi-textarea:where(.tedi-field-surface){background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);outline:calc(2 * var(--tedi-borders-01)) solid var(--_field-ring-color);outline-offset:calc(-2 * var(--tedi-borders-01));box-shadow:none}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):active,.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):focus-visible{--_field-ring-color: var(--_field-border-color)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover{--_field-border-color: var(--form-input-border-hover)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active{--_field-border-color: var(--form-input-border-active)}.tedi-textarea.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-visible{--_field-border-color: var(--form-input-border-focus)}.tedi-textarea.tedi-field-surface:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-textarea--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-form-field__box:has(>.tedi-textarea){outline:calc(2 * var(--tedi-borders-01)) solid var(--_field-ring-color);outline-offset:calc(-2 * var(--tedi-borders-01));box-shadow:none;align-items:flex-start;height:auto;min-height:var(--_field-height);padding-block:0;padding-inline:0 calc(var(--form-field-padding-x-md-default) + var(--tedi-form-field-control-scrollbar))}.tedi-form-field__box:has(>.tedi-textarea) .tedi-form-field__buttons,.tedi-form-field__box:has(>.tedi-textarea) .tedi-form-field__icon{display:flex;align-items:center;height:var(--_field-height)}.tedi-form-field__box>.tedi-textarea{padding-inline-end:calc(var(--form-field-padding-x-md-default) + var(--tedi-form-field-addon-lane));margin-inline-end:calc(-1 * (var(--form-field-padding-x-md-default) + var(--tedi-form-field-addon-lane) + var(--tedi-form-field-control-scrollbar)))}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], invalidInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], autoGrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoGrow", required: false }] }], minRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "minRows", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], readOnlyAttribute: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], readOnlyProperty: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
 /**
  * Checks if a string is a valid `HH:mm` time (00:00 – 23:59).
@@ -19981,7 +20214,7 @@ class TimePickerComponent {
                 useExisting: forwardRef(() => TimePickerComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "hourColumns", predicate: ["hourColumn"], descendants: true, isSignal: true }, { propertyName: "minuteColumns", predicate: ["minuteColumn"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (variant() === \"scroll\") {\n  <div class=\"tedi-time-picker__columns\" role=\"group\">\n    <div\n      #hourColumn\n      class=\"tedi-time-picker__column\"\n      role=\"listbox\"\n      [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n      [attr.aria-label]=\"'time-picker.hours' | tediTranslate\"\n      [attr.aria-activedescendant]=\"hourActiveId()\"\n      [attr.aria-disabled]=\"isDisabled()\"\n      (keydown)=\"onColumnKeydown($event, 'hour')\"\n      (scroll)=\"onColumnScroll('hour')\"\n    >\n      @for (hour of hours; track hour; let i = $index) {\n        <button\n          type=\"button\"\n          class=\"tedi-time-picker__item\"\n          role=\"option\"\n          [id]=\"hourItemId(i)\"\n          [class.tedi-time-picker__item--selected]=\"\n            highlightedHourIndex() === i\n          \"\n          [attr.aria-selected]=\"selectedHour() === +hour\"\n          [disabled]=\"isDisabled()\"\n          tabindex=\"-1\"\n          (click)=\"onHourClick(hour)\"\n        >\n          {{ hour }}\n        </button>\n      }\n    </div>\n    <div class=\"tedi-time-picker__separator\"></div>\n    <div\n      #minuteColumn\n      class=\"tedi-time-picker__column\"\n      role=\"listbox\"\n      [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n      [attr.aria-label]=\"'time-picker.minutes' | tediTranslate\"\n      [attr.aria-activedescendant]=\"minuteActiveId()\"\n      [attr.aria-disabled]=\"isDisabled()\"\n      (keydown)=\"onColumnKeydown($event, 'minute')\"\n      (scroll)=\"onColumnScroll('minute')\"\n    >\n      @for (minute of minutes(); track minute; let i = $index) {\n        <button\n          type=\"button\"\n          class=\"tedi-time-picker__item\"\n          role=\"option\"\n          [id]=\"minuteItemId(i)\"\n          [class.tedi-time-picker__item--selected]=\"\n            highlightedMinuteIndex() === i\n          \"\n          [attr.aria-selected]=\"selectedMinute() === +minute\"\n          [disabled]=\"isDisabled()\"\n          tabindex=\"-1\"\n          (click)=\"onMinuteClick(minute)\"\n        >\n          {{ minute }}\n        </button>\n      }\n    </div>\n  </div>\n} @else if (variant() === \"dropdown\") {\n  @if (timeSlots().length === 0) {\n    <p class=\"tedi-time-picker__empty\">\n      {{ \"time-picker.no-slots\" | tediTranslate }}\n    </p>\n  } @else {\n    <div\n      class=\"tedi-time-picker__dropdown\"\n      role=\"listbox\"\n      [attr.aria-label]=\"'time-picker.times' | tediTranslate\"\n      [attr.aria-disabled]=\"isDisabled() ? true : null\"\n    >\n      @for (slot of timeSlots(); track slot; let i = $index) {\n        <div\n          class=\"tedi-time-picker__dropdown-item\"\n          role=\"option\"\n          [class.tedi-time-picker__dropdown-item--selected]=\"\n            isSlotSelected(slot)\n          \"\n          [attr.aria-selected]=\"isSlotSelected(slot)\"\n          [attr.aria-disabled]=\"isDisabled() ? true : null\"\n          [attr.tabindex]=\"isDisabled() ? -1 : getDropdownTabIndex(i)\"\n          (click)=\"!isDisabled() && selectSlot(slot)\"\n          (keydown)=\"onDropdownKeydown($event)\"\n        >\n          {{ slot }}\n        </div>\n      }\n    </div>\n  }\n} @else if (variant() === \"slots\") {\n  @if (timeSlots().length === 0) {\n    <p class=\"tedi-time-picker__empty\">\n      {{ \"time-picker.no-slots\" | tediTranslate }}\n    </p>\n  } @else {\n    <tedi-radio-card-group\n      class=\"tedi-time-picker__grid\"\n      role=\"radiogroup\"\n      [style]=\"gridStyle()\"\n    >\n      @for (slot of timeSlots(); track slot; let i = $index) {\n        <label\n          tedi-radio-card\n          variant=\"secondary\"\n          class=\"tedi-time-picker__slot\"\n          [showIndicator]=\"showSlotIndicator()\"\n          [for]=\"slotId(i)\"\n        >\n          <input\n            tedi-radio\n            type=\"radio\"\n            [id]=\"slotId(i)\"\n            [name]=\"radioGroupName\"\n            [value]=\"slot\"\n            [checked]=\"isSlotSelected(slot)\"\n            [disabled]=\"isDisabled()\"\n            (change)=\"onRadioChange(slot)\"\n          />\n          {{ slot }}\n        </label>\n      }\n    </tedi-radio-card-group>\n  }\n}\n", styles: [".tedi-time-picker{--tedi-time-picker-item-height: var(--tedi-dimensions-16);--tedi-time-picker-columns-height: 12.5rem;--tedi-time-picker-width: var(--tedi-containers-01);--_tedi-time-picker-snap-padding: calc((var(--tedi-time-picker-columns-height) - var(--tedi-time-picker-item-height)) / 2);display:block;width:fit-content}.tedi-time-picker--disabled{pointer-events:none;opacity:.5}.tedi-time-picker--disabled .tedi-time-picker__column,.tedi-time-picker--disabled .tedi-time-picker__dropdown{overflow:hidden}.tedi-time-picker--bordered{overflow:hidden;border:var(--tedi-borders-01) solid var(--general-border-primary);border-radius:var(--card-radius-rounded)}@media(max-width:61.98rem){.tedi-time-picker{--tedi-time-picker-item-height: var(--tedi-dimensions-18);--tedi-time-picker-columns-height: 15.75rem}}.tedi-time-picker__columns{position:relative;display:flex;width:var(--tedi-time-picker-width);height:var(--tedi-time-picker-columns-height);overflow:hidden;-webkit-user-select:none;user-select:none;background:var(--card-background-primary)}.tedi-time-picker__columns:before{position:absolute;inset:0;z-index:3;pointer-events:none;content:\"\";background:linear-gradient(to bottom,var(--card-background-primary) 0%,transparent 30%,transparent 70%,var(--card-background-primary) 100%)}.tedi-time-picker__columns:after{position:absolute;top:50%;right:0;left:0;z-index:1;height:var(--tedi-time-picker-item-height);pointer-events:none;content:\"\";background:var(--form-datepicker-date-selected);transform:translateY(-50%)}.tedi-time-picker__column{position:relative;z-index:2;flex:1;height:100%;padding:var(--_tedi-time-picker-snap-padding) 0;overflow-y:scroll;scroll-behavior:smooth;overscroll-behavior-y:contain;scroll-snap-type:y mandatory;scroll-padding:var(--_tedi-time-picker-snap-padding);scrollbar-width:none;-webkit-overflow-scrolling:touch;-ms-overflow-style:none}.tedi-time-picker__column::-webkit-scrollbar{display:none}.tedi-time-picker__column:focus{outline:none}.tedi-time-picker__column:focus-visible{z-index:5;outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-time-picker__separator{position:relative;z-index:2;width:var(--tedi-borders-02);background:var(--general-border-primary)}.tedi-time-picker__item{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;height:var(--tedi-time-picker-item-height);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);color:var(--general-text-primary);cursor:pointer;scroll-snap-align:center;scroll-snap-stop:always;background:none;border:0}.tedi-time-picker__item:disabled{cursor:not-allowed}.tedi-time-picker__item:focus,.tedi-time-picker__item:focus-visible{outline:none;box-shadow:none}.tedi-time-picker__item--selected{z-index:2;color:var(--form-datepicker-date-text-selected)}.tedi-time-picker__dropdown{display:flex;flex-direction:column;min-width:var(--tedi-time-picker-dropdown-min-width, auto);overflow:auto;border-radius:var(--dropdown-item-radius)}.tedi-time-picker__empty{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);margin:0;font-size:var(--body-small-regular-size);color:var(--general-text-secondary);text-align:center}.tedi-time-picker__dropdown-item{display:flex;align-items:center;width:100%;min-height:var(--tedi-dimensions-16);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}.tedi-time-picker__dropdown-item:hover{color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}.tedi-time-picker__dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-time-picker__dropdown-item[aria-disabled=true]{cursor:not-allowed}.tedi-time-picker__dropdown-item[aria-disabled=true]:hover{color:var(--dropdown-item-default-text);background:var(--dropdown-item-default-background)}.tedi-time-picker__dropdown-item--selected,.tedi-time-picker__dropdown-item--selected:hover{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-time-picker__grid{gap:var(--layout-grid-gutters-08);padding:var(--card-padding-md-default)}\n"], dependencies: [{ kind: "component", type: RadioCardComponent, selector: "label[tedi-radio-card]", inputs: ["variant", "grouped", "showIndicator"] }, { kind: "component", type: RadioCardGroupComponent, selector: "tedi-radio-card-group", inputs: ["grouped"] }, { kind: "component", type: RadioComponent, selector: "input[type=radio][tedi-radio]", inputs: ["size", "invalid", "value", "disabled"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], viewQueries: [{ propertyName: "hourColumns", predicate: ["hourColumn"], descendants: true, isSignal: true }, { propertyName: "minuteColumns", predicate: ["minuteColumn"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (variant() === \"scroll\") {\n  <div class=\"tedi-time-picker__columns\" role=\"group\">\n    <div\n      #hourColumn\n      class=\"tedi-time-picker__column\"\n      role=\"listbox\"\n      [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n      [attr.aria-label]=\"'time-picker.hours' | tediTranslate\"\n      [attr.aria-activedescendant]=\"hourActiveId()\"\n      [attr.aria-disabled]=\"isDisabled()\"\n      (keydown)=\"onColumnKeydown($event, 'hour')\"\n      (scroll)=\"onColumnScroll('hour')\"\n    >\n      @for (hour of hours; track hour; let i = $index) {\n        <button\n          type=\"button\"\n          class=\"tedi-time-picker__item\"\n          role=\"option\"\n          [id]=\"hourItemId(i)\"\n          [class.tedi-time-picker__item--selected]=\"\n            highlightedHourIndex() === i\n          \"\n          [attr.aria-selected]=\"selectedHour() === +hour\"\n          [disabled]=\"isDisabled()\"\n          tabindex=\"-1\"\n          (click)=\"onHourClick(hour)\"\n        >\n          {{ hour }}\n        </button>\n      }\n    </div>\n    <div class=\"tedi-time-picker__separator\"></div>\n    <div\n      #minuteColumn\n      class=\"tedi-time-picker__column\"\n      role=\"listbox\"\n      [attr.tabindex]=\"isDisabled() ? -1 : 0\"\n      [attr.aria-label]=\"'time-picker.minutes' | tediTranslate\"\n      [attr.aria-activedescendant]=\"minuteActiveId()\"\n      [attr.aria-disabled]=\"isDisabled()\"\n      (keydown)=\"onColumnKeydown($event, 'minute')\"\n      (scroll)=\"onColumnScroll('minute')\"\n    >\n      @for (minute of minutes(); track minute; let i = $index) {\n        <button\n          type=\"button\"\n          class=\"tedi-time-picker__item\"\n          role=\"option\"\n          [id]=\"minuteItemId(i)\"\n          [class.tedi-time-picker__item--selected]=\"\n            highlightedMinuteIndex() === i\n          \"\n          [attr.aria-selected]=\"selectedMinute() === +minute\"\n          [disabled]=\"isDisabled()\"\n          tabindex=\"-1\"\n          (click)=\"onMinuteClick(minute)\"\n        >\n          {{ minute }}\n        </button>\n      }\n    </div>\n  </div>\n} @else if (variant() === \"dropdown\") {\n  @if (timeSlots().length === 0) {\n    <p class=\"tedi-time-picker__empty\">\n      {{ \"time-picker.no-slots\" | tediTranslate }}\n    </p>\n  } @else {\n    <div\n      class=\"tedi-time-picker__dropdown\"\n      role=\"listbox\"\n      [attr.aria-label]=\"'time-picker.times' | tediTranslate\"\n      [attr.aria-disabled]=\"isDisabled() ? true : null\"\n    >\n      @for (slot of timeSlots(); track slot; let i = $index) {\n        <div\n          class=\"tedi-time-picker__dropdown-item\"\n          role=\"option\"\n          [class.tedi-time-picker__dropdown-item--selected]=\"\n            isSlotSelected(slot)\n          \"\n          [attr.aria-selected]=\"isSlotSelected(slot)\"\n          [attr.aria-disabled]=\"isDisabled() ? true : null\"\n          [attr.tabindex]=\"isDisabled() ? -1 : getDropdownTabIndex(i)\"\n          (click)=\"!isDisabled() && selectSlot(slot)\"\n          (keydown)=\"onDropdownKeydown($event)\"\n        >\n          {{ slot }}\n        </div>\n      }\n    </div>\n  }\n} @else if (variant() === \"slots\") {\n  @if (timeSlots().length === 0) {\n    <p class=\"tedi-time-picker__empty\">\n      {{ \"time-picker.no-slots\" | tediTranslate }}\n    </p>\n  } @else {\n    <tedi-radio-card-group\n      class=\"tedi-time-picker__grid\"\n      role=\"radiogroup\"\n      [style]=\"gridStyle()\"\n    >\n      @for (slot of timeSlots(); track slot; let i = $index) {\n        <label\n          tedi-radio-card\n          variant=\"secondary\"\n          class=\"tedi-time-picker__slot\"\n          [showIndicator]=\"showSlotIndicator()\"\n          [for]=\"slotId(i)\"\n        >\n          <input\n            tedi-radio\n            type=\"radio\"\n            [id]=\"slotId(i)\"\n            [name]=\"radioGroupName\"\n            [value]=\"slot\"\n            [checked]=\"isSlotSelected(slot)\"\n            [disabled]=\"isDisabled()\"\n            (change)=\"onRadioChange(slot)\"\n          />\n          {{ slot }}\n        </label>\n      }\n    </tedi-radio-card-group>\n  }\n}\n", styles: [".tedi-time-picker{--tedi-time-picker-item-height: var(--tedi-dimensions-16);--tedi-time-picker-columns-height: 12.5rem;--tedi-time-picker-width: var(--tedi-containers-01);--_tedi-time-picker-snap-padding: calc((var(--tedi-time-picker-columns-height) - var(--tedi-time-picker-item-height)) / 2);display:block;width:fit-content}.tedi-time-picker--disabled{pointer-events:none;opacity:.5}.tedi-time-picker--disabled .tedi-time-picker__column,.tedi-time-picker--disabled .tedi-time-picker__dropdown{overflow:hidden}.tedi-time-picker--bordered{overflow:hidden;border:var(--tedi-borders-01) solid var(--general-border-primary);border-radius:var(--card-radius-rounded)}@media(max-width:61.98rem){.tedi-time-picker{--tedi-time-picker-item-height: var(--tedi-dimensions-18);--tedi-time-picker-columns-height: 15.75rem}}.tedi-time-picker__columns{position:relative;display:flex;width:var(--tedi-time-picker-width);height:var(--tedi-time-picker-columns-height);overflow:hidden;-webkit-user-select:none;user-select:none;background:var(--card-background-primary)}.tedi-time-picker__columns:before{position:absolute;inset:0;z-index:3;pointer-events:none;content:\"\";background:linear-gradient(to bottom,var(--card-background-primary) 0%,transparent 30%,transparent 70%,var(--card-background-primary) 100%)}.tedi-time-picker__columns:after{position:absolute;top:50%;right:0;left:0;z-index:1;height:var(--tedi-time-picker-item-height);pointer-events:none;content:\"\";background:var(--form-datepicker-date-selected);transform:translateY(-50%)}.tedi-time-picker__column{position:relative;z-index:2;flex:1;height:100%;padding:var(--_tedi-time-picker-snap-padding) 0;overflow-y:scroll;scroll-behavior:smooth;overscroll-behavior-y:contain;scroll-snap-type:y mandatory;scroll-padding:var(--_tedi-time-picker-snap-padding);scrollbar-width:none;-webkit-overflow-scrolling:touch;-ms-overflow-style:none}.tedi-time-picker__column::-webkit-scrollbar{display:none}.tedi-time-picker__column:focus{outline:none}.tedi-time-picker__column:focus-visible{z-index:5;outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-time-picker__separator{position:relative;z-index:2;width:var(--tedi-borders-02);background:var(--general-border-primary)}.tedi-time-picker__item{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;height:var(--tedi-time-picker-item-height);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);color:var(--general-text-primary);cursor:pointer;scroll-snap-align:center;scroll-snap-stop:always;background:none;border:0}.tedi-time-picker__item:disabled{cursor:not-allowed}.tedi-time-picker__item:focus,.tedi-time-picker__item:focus-visible{outline:none;box-shadow:none}.tedi-time-picker__item--selected{z-index:2;color:var(--form-datepicker-date-text-selected)}.tedi-time-picker__dropdown{display:flex;flex-direction:column;min-width:var(--tedi-time-picker-dropdown-min-width, auto);overflow:auto;border-radius:var(--dropdown-item-radius)}.tedi-time-picker__empty{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);margin:0;font-size:var(--body-small-regular-size);color:var(--general-text-secondary);text-align:center}.tedi-time-picker__dropdown-item{display:flex;align-items:center;width:100%;min-height:var(--tedi-dimensions-16);padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}.tedi-time-picker__dropdown-item:hover{color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}.tedi-time-picker__dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-time-picker__dropdown-item[aria-disabled=true]{cursor:not-allowed}.tedi-time-picker__dropdown-item[aria-disabled=true]:hover{color:var(--dropdown-item-default-text);background:var(--dropdown-item-default-background)}.tedi-time-picker__dropdown-item--selected,.tedi-time-picker__dropdown-item--selected:hover{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-time-picker__grid{gap:var(--layout-grid-gutters-08);padding:var(--card-padding-md-default)}\n"], dependencies: [{ kind: "component", type: RadioCardComponent, selector: "label[tedi-radio-card]", inputs: ["variant", "grouped", "bordered", "showIndicator"] }, { kind: "component", type: RadioCardGroupComponent, selector: "tedi-radio-card-group", inputs: ["grouped", "bordered"] }, { kind: "component", type: RadioComponent, selector: "input[type=radio][tedi-radio]", inputs: ["size", "invalid", "value", "disabled"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TimePickerComponent, decorators: [{
             type: Component,
@@ -20145,7 +20378,7 @@ class TimeFieldComponent {
         this.derived.connect();
     }
     hasValue = computed(() => this.value() !== null && this.value() !== "", ...(ngDevMode ? [{ debugName: "hasValue" }] : []));
-    showClear = computed(() => this.hasValue() && this.clearableResolved(), ...(ngDevMode ? [{ debugName: "showClear" }] : []));
+    showClear = computed(() => this.hasValue() && this.clearableResolved() && !this.isDisabled(), ...(ngDevMode ? [{ debugName: "showClear" }] : []));
     /** The clear button sits in the time field's action row, beside the picker. */
     ownsClearButton = true;
     /** Own `clearable` wins, then the wrapping `tedi-form-field`'s. */
@@ -20408,7 +20641,7 @@ class TimeFieldComponent {
                 provide: TEDI_FORM_FIELD_CONTROL,
                 useExisting: forwardRef(() => TimeFieldComponent),
             },
-        ], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }, { propertyName: "fieldEl", first: true, predicate: ["fieldEl"], descendants: true, isSignal: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }, { propertyName: "timePicker", first: true, predicate: ["timePicker"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (usePopover()) {\n  <!--\n    The field wrapper is the popover anchor + trigger, so the picker matches the\n    input width. Button-trigger mode disables clicks on everything but the icon\n    (see SCSS); input-trigger mode opens from anywhere in the field.\n  -->\n  <tedi-popover\n    #popover\n    class=\"tedi-time-field__popover\"\n    [position]=\"popoverPosition()\"\n    [withArrow]=\"false\"\n    [preventOverflow]=\"true\"\n  >\n    <div\n      #fieldEl\n      tedi-popover-trigger\n      [interactive]=\"false\"\n      class=\"tedi-time-field__field\"\n      [class.tedi-time-field__field--button-trigger]=\"!inputIsTrigger()\"\n      [class.tedi-field-surface]=\"paintsSurface()\"\n      [class.tedi-field-surface--invalid]=\"paintsSurface() && invalid()\"\n      [class.tedi-field-surface--valid]=\"paintsSurface() && valid()\"\n      [class.tedi-field-surface--disabled]=\"paintsSurface() && disabled()\"\n      [attr.tabindex]=\"-1\"\n      (focus)=\"onFieldFocus($event)\"\n      (click)=\"onFieldClick()\"\n    >\n      <ng-container *ngTemplateOutlet=\"timeInput\" />\n      <div class=\"tedi-time-field__actions\">\n        <ng-container *ngTemplateOutlet=\"clearButton\" />\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [class.tedi-time-field__icon--open]=\"popoverIsOpen()\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [attr.aria-expanded]=\"popoverIsOpen() || null\"\n          aria-haspopup=\"dialog\"\n          (click)=\"onIconClick()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      </div>\n    </div>\n    <tedi-popover-content\n      class=\"tedi-time-field__popover-content\"\n      maxWidth=\"none\"\n    >\n      <ng-container *ngTemplateOutlet=\"pickerWheel\" />\n    </tedi-popover-content>\n  </tedi-popover>\n} @else {\n  <!-- No picker / native picker / mobile-modal / disabled: plain field, no popover. -->\n  <div\n    #fieldEl\n    class=\"tedi-time-field__field\"\n    [class.tedi-field-surface]=\"paintsSurface()\"\n    [class.tedi-field-surface--invalid]=\"paintsSurface() && invalid()\"\n    [class.tedi-field-surface--valid]=\"paintsSurface() && valid()\"\n    [class.tedi-field-surface--disabled]=\"paintsSurface() && disabled()\"\n  >\n    <ng-container *ngTemplateOutlet=\"timeInput\" />\n    <div class=\"tedi-time-field__actions\">\n      <ng-container *ngTemplateOutlet=\"clearButton\" />\n      @if (hasNativePicker()) {\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [disabled]=\"isDisabled()\"\n          (click)=\"openNativePicker()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      } @else if (hasPicker()) {\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [disabled]=\"isDisabled()\"\n          (click)=\"openPicker()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      } @else {\n        <span\n          class=\"tedi-time-field__icon tedi-time-field__icon--static\"\n          aria-hidden=\"true\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </span>\n      }\n    </div>\n  </div>\n}\n\n<ng-template #timeInput>\n  <input\n    #inputElement\n    class=\"tedi-time-field__input\"\n    inputmode=\"numeric\"\n    [type]=\"inputType()\"\n    [id]=\"inputId()\"\n    [attr.placeholder]=\"placeholder()\"\n    [value]=\"inputValue()\"\n    [disabled]=\"isDisabled()\"\n    [readOnly]=\"inputIsTrigger()\"\n    [attr.aria-invalid]=\"invalid() || null\"\n    (click)=\"onInputClick($event)\"\n    (input)=\"handleInput($event)\"\n    (blur)=\"handleBlur()\"\n  />\n</ng-template>\n\n<ng-template #clearButton>\n  @if (showClear()) {\n    <button\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      class=\"tedi-time-field__clear\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'time-field.clear' | tediTranslate\"\n      [disabled]=\"isDisabled()\"\n      (click)=\"onClearClick($event)\"\n    ></button>\n    <tedi-separator axis=\"vertical\" size=\"1rem\" />\n  }\n</ng-template>\n\n<ng-template #pickerWheel>\n  <tedi-time-picker\n    #timePicker\n    [value]=\"value()\"\n    [variant]=\"customPickerVariant()\"\n    [timeSlots]=\"timeSlots()\"\n    [columns]=\"columns()\"\n    [showSlotIndicator]=\"showSlotIndicator()\"\n    [minuteStep]=\"minuteStep()\"\n    [trapFocus]=\"true\"\n    [style.--tedi-time-picker-dropdown-min-width.px]=\"dropdownMinWidth()\"\n    (valueChange)=\"onPickerValueChange($event)\"\n    (closeRequested)=\"closePopover()\"\n  />\n</ng-template>\n", styles: [".tedi-time-field{display:flex;flex:1;min-width:0}.tedi-time-field--small .tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-time-field--large .tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-lg);--_field-padding-x: var(--form-field-padding-x-lg);--_field-height: var(--form-field-height-lg)}.tedi-time-field__popover{display:flex;flex:1;min-width:0}.tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;display:flex;flex:1;gap:var(--form-field-inner-spacing);align-items:center;min-width:0}.tedi-time-field__field:focus,.tedi-time-field__field:focus-visible{outline:none}.tedi-time-field__field:where(.tedi-field-surface){background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);height:var(--_field-height);padding:var(--_field-padding-y) var(--_field-padding-x)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):active,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):has(input:active,textarea:active),.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):focus-within,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):has(input:focus-visible,textarea:focus-visible){--_field-ring-color: var(--_field-border-color)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:hover,textarea:hover){--_field-border-color: var(--form-input-border-hover)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:active,textarea:active){--_field-border-color: var(--form-input-border-active)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-within,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:focus-visible,textarea:focus-visible){--_field-border-color: var(--form-input-border-focus)}.tedi-time-field__field.tedi-field-surface:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-time-field__field--button-trigger{pointer-events:none}.tedi-time-field__field--button-trigger .tedi-time-field__input,.tedi-time-field__field--button-trigger .tedi-time-field__clear,.tedi-time-field__field--button-trigger .tedi-time-field__icon{pointer-events:auto}.tedi-time-field__input{flex:1;min-width:0;padding-inline-start:1px;margin-inline-start:-1px;font-family:inherit;font-size:var(--body-regular-size);color:var(--form-input-text-filled);outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-time-field__input::placeholder{color:var(--form-input-text-placeholder)}.tedi-time-field__input:disabled{color:var(--form-input-text-disabled);cursor:not-allowed}.tedi-time-field__input::-webkit-calendar-picker-indicator,.tedi-time-field__input::-webkit-inner-spin-button,.tedi-time-field__input::-webkit-outer-spin-button,.tedi-time-field__input::-webkit-clear-button,.tedi-time-field__input::-webkit-list-button{display:none;margin:0;appearance:none}.tedi-time-field__actions{display:flex;flex-shrink:0;gap:var(--layout-grid-gutters-04);align-items:center;align-self:center;justify-content:center}.tedi-time-field__clear{flex-shrink:0}.tedi-time-field__clear:disabled{cursor:not-allowed}.tedi-time-field__popover-content.tedi-popover-content{padding:0}.tedi-time-field .tedi-time-field__icon{flex-shrink:0;--button-sm-icon-size: var(--form-field-button-height-sm);width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);font-size:1.125rem;border-radius:var(--button-radius-sm)}@media(max-width:47.98rem){.tedi-time-field .tedi-time-field__icon{--button-sm-icon-size: var(--form-field-button-height)}}.tedi-time-field .tedi-time-field__icon:disabled{cursor:not-allowed}.tedi-time-field .tedi-time-field__icon--open:not(:disabled),.tedi-time-field .tedi-time-field__icon--open:not(:disabled):hover,.tedi-time-field .tedi-time-field__icon--open:not(:disabled):active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-time-field .tedi-time-field__icon--static{display:inline-flex;align-items:center;justify-content:center;color:var(--form-input-text-placeholder)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: SeparatorComponent, selector: "tedi-separator", inputs: ["axis", "color", "variant", "dotSize", "dotFilled", "thickness", "spacing", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: PopoverComponent, selector: "tedi-popover", inputs: ["position", "preventOverflow", "dismissible", "hideOnScroll", "withBorder", "withArrow", "lockScroll", "timeoutDelay", "offset"] }, { kind: "component", type: PopoverContentComponent, selector: "tedi-popover-content", inputs: ["maxWidth", "title", "showClose"] }, { kind: "directive", type: PopoverTriggerDirective, selector: "[tedi-popover-trigger]", inputs: ["underline", "interactive"] }, { kind: "component", type: TimePickerComponent, selector: "tedi-time-picker", inputs: ["value", "variant", "timeSlots", "columns", "showSlotIndicator", "minuteStep", "disabled", "border", "trapFocus"], outputs: ["valueChange", "closeRequested"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }, { propertyName: "fieldEl", first: true, predicate: ["fieldEl"], descendants: true, isSignal: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }, { propertyName: "timePicker", first: true, predicate: ["timePicker"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (usePopover()) {\n  <!--\n    The field wrapper is the popover anchor + trigger, so the picker matches the\n    input width. Button-trigger mode disables clicks on everything but the icon\n    (see SCSS); input-trigger mode opens from anywhere in the field.\n  -->\n  <tedi-popover\n    #popover\n    class=\"tedi-time-field__popover\"\n    [position]=\"popoverPosition()\"\n    [withArrow]=\"false\"\n    [preventOverflow]=\"true\"\n  >\n    <div\n      #fieldEl\n      tedi-popover-trigger\n      [interactive]=\"false\"\n      class=\"tedi-time-field__field\"\n      [class.tedi-time-field__field--button-trigger]=\"!inputIsTrigger()\"\n      [class.tedi-field-surface]=\"paintsSurface()\"\n      [class.tedi-field-surface--invalid]=\"paintsSurface() && invalid()\"\n      [class.tedi-field-surface--valid]=\"paintsSurface() && valid()\"\n      [class.tedi-field-surface--disabled]=\"paintsSurface() && disabled()\"\n      [attr.tabindex]=\"-1\"\n      (focus)=\"onFieldFocus($event)\"\n      (click)=\"onFieldClick()\"\n    >\n      <ng-container *ngTemplateOutlet=\"timeInput\" />\n      <div class=\"tedi-time-field__actions\">\n        <ng-container *ngTemplateOutlet=\"clearButton\" />\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [class.tedi-time-field__icon--open]=\"popoverIsOpen()\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [attr.aria-expanded]=\"popoverIsOpen() || null\"\n          aria-haspopup=\"dialog\"\n          (click)=\"onIconClick()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      </div>\n    </div>\n    <tedi-popover-content\n      class=\"tedi-time-field__popover-content\"\n      maxWidth=\"none\"\n    >\n      <ng-container *ngTemplateOutlet=\"pickerWheel\" />\n    </tedi-popover-content>\n  </tedi-popover>\n} @else {\n  <!-- No picker / native picker / mobile-modal / disabled: plain field, no popover. -->\n  <div\n    #fieldEl\n    class=\"tedi-time-field__field\"\n    [class.tedi-field-surface]=\"paintsSurface()\"\n    [class.tedi-field-surface--invalid]=\"paintsSurface() && invalid()\"\n    [class.tedi-field-surface--valid]=\"paintsSurface() && valid()\"\n    [class.tedi-field-surface--disabled]=\"paintsSurface() && disabled()\"\n  >\n    <ng-container *ngTemplateOutlet=\"timeInput\" />\n    <div class=\"tedi-time-field__actions\">\n      <ng-container *ngTemplateOutlet=\"clearButton\" />\n      @if (hasNativePicker()) {\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [disabled]=\"isDisabled()\"\n          (click)=\"openNativePicker()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      } @else if (hasPicker()) {\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [disabled]=\"isDisabled()\"\n          (click)=\"openPicker()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      } @else {\n        <span\n          class=\"tedi-time-field__icon tedi-time-field__icon--static\"\n          aria-hidden=\"true\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </span>\n      }\n    </div>\n  </div>\n}\n\n<ng-template #timeInput>\n  <input\n    #inputElement\n    class=\"tedi-time-field__input\"\n    inputmode=\"numeric\"\n    [type]=\"inputType()\"\n    [id]=\"inputId()\"\n    [attr.placeholder]=\"placeholder()\"\n    [value]=\"inputValue()\"\n    [disabled]=\"isDisabled()\"\n    [readOnly]=\"inputIsTrigger()\"\n    [attr.aria-invalid]=\"invalid() || null\"\n    (click)=\"onInputClick($event)\"\n    (input)=\"handleInput($event)\"\n    (blur)=\"handleBlur()\"\n  />\n</ng-template>\n\n<ng-template #clearButton>\n  @if (showClear()) {\n    <button\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      class=\"tedi-time-field__clear\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'time-field.clear' | tediTranslate\"\n      (click)=\"onClearClick($event)\"\n    ></button>\n    <tedi-separator axis=\"vertical\" size=\"1rem\" />\n  }\n</ng-template>\n\n<ng-template #pickerWheel>\n  <tedi-time-picker\n    #timePicker\n    [value]=\"value()\"\n    [variant]=\"customPickerVariant()\"\n    [timeSlots]=\"timeSlots()\"\n    [columns]=\"columns()\"\n    [showSlotIndicator]=\"showSlotIndicator()\"\n    [minuteStep]=\"minuteStep()\"\n    [trapFocus]=\"true\"\n    [style.--tedi-time-picker-dropdown-min-width.px]=\"dropdownMinWidth()\"\n    (valueChange)=\"onPickerValueChange($event)\"\n    (closeRequested)=\"closePopover()\"\n  />\n</ng-template>\n", styles: [".tedi-time-field{display:flex;flex:1;min-width:0}.tedi-time-field--small .tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-time-field--large .tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-lg);--_field-padding-x: var(--form-field-padding-x-lg);--_field-height: var(--form-field-height-lg)}.tedi-time-field__popover{display:flex;flex:1;min-width:0}.tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;display:flex;flex:1;gap:var(--form-field-inner-spacing);align-items:center;min-width:0}.tedi-time-field__field:focus,.tedi-time-field__field:focus-visible{outline:none}.tedi-time-field__field:where(.tedi-field-surface){background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);height:var(--_field-height);padding:var(--_field-padding-y) var(--_field-padding-x)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):active,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):has(input:active,textarea:active),.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):focus-within,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):has(input:focus-visible,textarea:focus-visible){--_field-ring-color: var(--_field-border-color)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:hover,textarea:hover){--_field-border-color: var(--form-input-border-hover)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:active,textarea:active){--_field-border-color: var(--form-input-border-active)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-within,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:focus-visible,textarea:focus-visible){--_field-border-color: var(--form-input-border-focus)}.tedi-time-field__field.tedi-field-surface:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-time-field__field--button-trigger{pointer-events:none}.tedi-time-field__field--button-trigger .tedi-time-field__input,.tedi-time-field__field--button-trigger .tedi-time-field__clear,.tedi-time-field__field--button-trigger .tedi-time-field__icon{pointer-events:auto}.tedi-time-field__input{flex:1;min-width:0;padding-inline-start:1px;margin-inline-start:-1px;font-family:inherit;font-size:var(--body-regular-size);color:var(--form-input-text-filled);outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-time-field__input::placeholder{color:var(--form-input-text-placeholder)}.tedi-time-field__input:disabled{color:var(--form-input-text-disabled);cursor:not-allowed}.tedi-time-field__input::-webkit-calendar-picker-indicator,.tedi-time-field__input::-webkit-inner-spin-button,.tedi-time-field__input::-webkit-outer-spin-button,.tedi-time-field__input::-webkit-clear-button,.tedi-time-field__input::-webkit-list-button{display:none;margin:0;appearance:none}.tedi-time-field__actions{display:flex;flex-shrink:0;gap:var(--layout-grid-gutters-04);align-items:center;align-self:center;justify-content:center}.tedi-time-field__clear{flex-shrink:0}.tedi-time-field__clear:disabled{cursor:not-allowed}.tedi-time-field__popover-content.tedi-popover-content{padding:0}.tedi-time-field .tedi-time-field__icon{flex-shrink:0;--button-sm-icon-size: var(--form-field-button-height-sm);width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);font-size:1.125rem;border-radius:var(--button-radius-sm)}@media(max-width:47.98rem){.tedi-time-field .tedi-time-field__icon{--button-sm-icon-size: var(--form-field-button-height)}}.tedi-time-field .tedi-time-field__icon:disabled{cursor:not-allowed}.tedi-time-field .tedi-time-field__icon--open:not(:disabled),.tedi-time-field .tedi-time-field__icon--open:not(:disabled):hover,.tedi-time-field .tedi-time-field__icon--open:not(:disabled):active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-time-field .tedi-time-field__icon--static{display:inline-flex;align-items:center;justify-content:center;color:var(--form-input-text-placeholder)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: SeparatorComponent, selector: "tedi-separator", inputs: ["axis", "color", "variant", "dotSize", "dotFilled", "thickness", "spacing", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: PopoverComponent, selector: "tedi-popover", inputs: ["position", "preventOverflow", "dismissible", "hideOnScroll", "withBorder", "withArrow", "lockScroll", "timeoutDelay", "offset"] }, { kind: "component", type: PopoverContentComponent, selector: "tedi-popover-content", inputs: ["maxWidth", "title", "showClose"] }, { kind: "directive", type: PopoverTriggerDirective, selector: "[tedi-popover-trigger]", inputs: ["underline", "interactive"] }, { kind: "component", type: TimePickerComponent, selector: "tedi-time-picker", inputs: ["value", "variant", "timeSlots", "columns", "showSlotIndicator", "minuteStep", "disabled", "border", "trapFocus"], outputs: ["valueChange", "closeRequested"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TimeFieldComponent, decorators: [{
             type: Component,
@@ -20437,7 +20670,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                         class: "tedi-time-field",
                         "[class.tedi-time-field--small]": "resolvedSize() === 'small'",
                         "[class.tedi-time-field--large]": "resolvedSize() === 'large'",
-                    }, template: "@if (usePopover()) {\n  <!--\n    The field wrapper is the popover anchor + trigger, so the picker matches the\n    input width. Button-trigger mode disables clicks on everything but the icon\n    (see SCSS); input-trigger mode opens from anywhere in the field.\n  -->\n  <tedi-popover\n    #popover\n    class=\"tedi-time-field__popover\"\n    [position]=\"popoverPosition()\"\n    [withArrow]=\"false\"\n    [preventOverflow]=\"true\"\n  >\n    <div\n      #fieldEl\n      tedi-popover-trigger\n      [interactive]=\"false\"\n      class=\"tedi-time-field__field\"\n      [class.tedi-time-field__field--button-trigger]=\"!inputIsTrigger()\"\n      [class.tedi-field-surface]=\"paintsSurface()\"\n      [class.tedi-field-surface--invalid]=\"paintsSurface() && invalid()\"\n      [class.tedi-field-surface--valid]=\"paintsSurface() && valid()\"\n      [class.tedi-field-surface--disabled]=\"paintsSurface() && disabled()\"\n      [attr.tabindex]=\"-1\"\n      (focus)=\"onFieldFocus($event)\"\n      (click)=\"onFieldClick()\"\n    >\n      <ng-container *ngTemplateOutlet=\"timeInput\" />\n      <div class=\"tedi-time-field__actions\">\n        <ng-container *ngTemplateOutlet=\"clearButton\" />\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [class.tedi-time-field__icon--open]=\"popoverIsOpen()\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [attr.aria-expanded]=\"popoverIsOpen() || null\"\n          aria-haspopup=\"dialog\"\n          (click)=\"onIconClick()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      </div>\n    </div>\n    <tedi-popover-content\n      class=\"tedi-time-field__popover-content\"\n      maxWidth=\"none\"\n    >\n      <ng-container *ngTemplateOutlet=\"pickerWheel\" />\n    </tedi-popover-content>\n  </tedi-popover>\n} @else {\n  <!-- No picker / native picker / mobile-modal / disabled: plain field, no popover. -->\n  <div\n    #fieldEl\n    class=\"tedi-time-field__field\"\n    [class.tedi-field-surface]=\"paintsSurface()\"\n    [class.tedi-field-surface--invalid]=\"paintsSurface() && invalid()\"\n    [class.tedi-field-surface--valid]=\"paintsSurface() && valid()\"\n    [class.tedi-field-surface--disabled]=\"paintsSurface() && disabled()\"\n  >\n    <ng-container *ngTemplateOutlet=\"timeInput\" />\n    <div class=\"tedi-time-field__actions\">\n      <ng-container *ngTemplateOutlet=\"clearButton\" />\n      @if (hasNativePicker()) {\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [disabled]=\"isDisabled()\"\n          (click)=\"openNativePicker()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      } @else if (hasPicker()) {\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [disabled]=\"isDisabled()\"\n          (click)=\"openPicker()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      } @else {\n        <span\n          class=\"tedi-time-field__icon tedi-time-field__icon--static\"\n          aria-hidden=\"true\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </span>\n      }\n    </div>\n  </div>\n}\n\n<ng-template #timeInput>\n  <input\n    #inputElement\n    class=\"tedi-time-field__input\"\n    inputmode=\"numeric\"\n    [type]=\"inputType()\"\n    [id]=\"inputId()\"\n    [attr.placeholder]=\"placeholder()\"\n    [value]=\"inputValue()\"\n    [disabled]=\"isDisabled()\"\n    [readOnly]=\"inputIsTrigger()\"\n    [attr.aria-invalid]=\"invalid() || null\"\n    (click)=\"onInputClick($event)\"\n    (input)=\"handleInput($event)\"\n    (blur)=\"handleBlur()\"\n  />\n</ng-template>\n\n<ng-template #clearButton>\n  @if (showClear()) {\n    <button\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      class=\"tedi-time-field__clear\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'time-field.clear' | tediTranslate\"\n      [disabled]=\"isDisabled()\"\n      (click)=\"onClearClick($event)\"\n    ></button>\n    <tedi-separator axis=\"vertical\" size=\"1rem\" />\n  }\n</ng-template>\n\n<ng-template #pickerWheel>\n  <tedi-time-picker\n    #timePicker\n    [value]=\"value()\"\n    [variant]=\"customPickerVariant()\"\n    [timeSlots]=\"timeSlots()\"\n    [columns]=\"columns()\"\n    [showSlotIndicator]=\"showSlotIndicator()\"\n    [minuteStep]=\"minuteStep()\"\n    [trapFocus]=\"true\"\n    [style.--tedi-time-picker-dropdown-min-width.px]=\"dropdownMinWidth()\"\n    (valueChange)=\"onPickerValueChange($event)\"\n    (closeRequested)=\"closePopover()\"\n  />\n</ng-template>\n", styles: [".tedi-time-field{display:flex;flex:1;min-width:0}.tedi-time-field--small .tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-time-field--large .tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-lg);--_field-padding-x: var(--form-field-padding-x-lg);--_field-height: var(--form-field-height-lg)}.tedi-time-field__popover{display:flex;flex:1;min-width:0}.tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;display:flex;flex:1;gap:var(--form-field-inner-spacing);align-items:center;min-width:0}.tedi-time-field__field:focus,.tedi-time-field__field:focus-visible{outline:none}.tedi-time-field__field:where(.tedi-field-surface){background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);height:var(--_field-height);padding:var(--_field-padding-y) var(--_field-padding-x)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):active,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):has(input:active,textarea:active),.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):focus-within,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):has(input:focus-visible,textarea:focus-visible){--_field-ring-color: var(--_field-border-color)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:hover,textarea:hover){--_field-border-color: var(--form-input-border-hover)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:active,textarea:active){--_field-border-color: var(--form-input-border-active)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-within,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:focus-visible,textarea:focus-visible){--_field-border-color: var(--form-input-border-focus)}.tedi-time-field__field.tedi-field-surface:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-time-field__field--button-trigger{pointer-events:none}.tedi-time-field__field--button-trigger .tedi-time-field__input,.tedi-time-field__field--button-trigger .tedi-time-field__clear,.tedi-time-field__field--button-trigger .tedi-time-field__icon{pointer-events:auto}.tedi-time-field__input{flex:1;min-width:0;padding-inline-start:1px;margin-inline-start:-1px;font-family:inherit;font-size:var(--body-regular-size);color:var(--form-input-text-filled);outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-time-field__input::placeholder{color:var(--form-input-text-placeholder)}.tedi-time-field__input:disabled{color:var(--form-input-text-disabled);cursor:not-allowed}.tedi-time-field__input::-webkit-calendar-picker-indicator,.tedi-time-field__input::-webkit-inner-spin-button,.tedi-time-field__input::-webkit-outer-spin-button,.tedi-time-field__input::-webkit-clear-button,.tedi-time-field__input::-webkit-list-button{display:none;margin:0;appearance:none}.tedi-time-field__actions{display:flex;flex-shrink:0;gap:var(--layout-grid-gutters-04);align-items:center;align-self:center;justify-content:center}.tedi-time-field__clear{flex-shrink:0}.tedi-time-field__clear:disabled{cursor:not-allowed}.tedi-time-field__popover-content.tedi-popover-content{padding:0}.tedi-time-field .tedi-time-field__icon{flex-shrink:0;--button-sm-icon-size: var(--form-field-button-height-sm);width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);font-size:1.125rem;border-radius:var(--button-radius-sm)}@media(max-width:47.98rem){.tedi-time-field .tedi-time-field__icon{--button-sm-icon-size: var(--form-field-button-height)}}.tedi-time-field .tedi-time-field__icon:disabled{cursor:not-allowed}.tedi-time-field .tedi-time-field__icon--open:not(:disabled),.tedi-time-field .tedi-time-field__icon--open:not(:disabled):hover,.tedi-time-field .tedi-time-field__icon--open:not(:disabled):active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-time-field .tedi-time-field__icon--static{display:inline-flex;align-items:center;justify-content:center;color:var(--form-input-text-placeholder)}\n"] }]
+                    }, template: "@if (usePopover()) {\n  <!--\n    The field wrapper is the popover anchor + trigger, so the picker matches the\n    input width. Button-trigger mode disables clicks on everything but the icon\n    (see SCSS); input-trigger mode opens from anywhere in the field.\n  -->\n  <tedi-popover\n    #popover\n    class=\"tedi-time-field__popover\"\n    [position]=\"popoverPosition()\"\n    [withArrow]=\"false\"\n    [preventOverflow]=\"true\"\n  >\n    <div\n      #fieldEl\n      tedi-popover-trigger\n      [interactive]=\"false\"\n      class=\"tedi-time-field__field\"\n      [class.tedi-time-field__field--button-trigger]=\"!inputIsTrigger()\"\n      [class.tedi-field-surface]=\"paintsSurface()\"\n      [class.tedi-field-surface--invalid]=\"paintsSurface() && invalid()\"\n      [class.tedi-field-surface--valid]=\"paintsSurface() && valid()\"\n      [class.tedi-field-surface--disabled]=\"paintsSurface() && disabled()\"\n      [attr.tabindex]=\"-1\"\n      (focus)=\"onFieldFocus($event)\"\n      (click)=\"onFieldClick()\"\n    >\n      <ng-container *ngTemplateOutlet=\"timeInput\" />\n      <div class=\"tedi-time-field__actions\">\n        <ng-container *ngTemplateOutlet=\"clearButton\" />\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [class.tedi-time-field__icon--open]=\"popoverIsOpen()\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [attr.aria-expanded]=\"popoverIsOpen() || null\"\n          aria-haspopup=\"dialog\"\n          (click)=\"onIconClick()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      </div>\n    </div>\n    <tedi-popover-content\n      class=\"tedi-time-field__popover-content\"\n      maxWidth=\"none\"\n    >\n      <ng-container *ngTemplateOutlet=\"pickerWheel\" />\n    </tedi-popover-content>\n  </tedi-popover>\n} @else {\n  <!-- No picker / native picker / mobile-modal / disabled: plain field, no popover. -->\n  <div\n    #fieldEl\n    class=\"tedi-time-field__field\"\n    [class.tedi-field-surface]=\"paintsSurface()\"\n    [class.tedi-field-surface--invalid]=\"paintsSurface() && invalid()\"\n    [class.tedi-field-surface--valid]=\"paintsSurface() && valid()\"\n    [class.tedi-field-surface--disabled]=\"paintsSurface() && disabled()\"\n  >\n    <ng-container *ngTemplateOutlet=\"timeInput\" />\n    <div class=\"tedi-time-field__actions\">\n      <ng-container *ngTemplateOutlet=\"clearButton\" />\n      @if (hasNativePicker()) {\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [disabled]=\"isDisabled()\"\n          (click)=\"openNativePicker()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      } @else if (hasPicker()) {\n        <button\n          tedi-button\n          type=\"button\"\n          variant=\"neutral\"\n          size=\"small\"\n          class=\"tedi-time-field__icon\"\n          [attr.aria-label]=\"'time-field.select-time' | tediTranslate\"\n          [disabled]=\"isDisabled()\"\n          (click)=\"openPicker()\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </button>\n      } @else {\n        <span\n          class=\"tedi-time-field__icon tedi-time-field__icon--static\"\n          aria-hidden=\"true\"\n        >\n          <tedi-icon name=\"schedule\" color=\"inherit\" size=\"inherit\" />\n        </span>\n      }\n    </div>\n  </div>\n}\n\n<ng-template #timeInput>\n  <input\n    #inputElement\n    class=\"tedi-time-field__input\"\n    inputmode=\"numeric\"\n    [type]=\"inputType()\"\n    [id]=\"inputId()\"\n    [attr.placeholder]=\"placeholder()\"\n    [value]=\"inputValue()\"\n    [disabled]=\"isDisabled()\"\n    [readOnly]=\"inputIsTrigger()\"\n    [attr.aria-invalid]=\"invalid() || null\"\n    (click)=\"onInputClick($event)\"\n    (input)=\"handleInput($event)\"\n    (blur)=\"handleBlur()\"\n  />\n</ng-template>\n\n<ng-template #clearButton>\n  @if (showClear()) {\n    <button\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      class=\"tedi-time-field__clear\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'time-field.clear' | tediTranslate\"\n      (click)=\"onClearClick($event)\"\n    ></button>\n    <tedi-separator axis=\"vertical\" size=\"1rem\" />\n  }\n</ng-template>\n\n<ng-template #pickerWheel>\n  <tedi-time-picker\n    #timePicker\n    [value]=\"value()\"\n    [variant]=\"customPickerVariant()\"\n    [timeSlots]=\"timeSlots()\"\n    [columns]=\"columns()\"\n    [showSlotIndicator]=\"showSlotIndicator()\"\n    [minuteStep]=\"minuteStep()\"\n    [trapFocus]=\"true\"\n    [style.--tedi-time-picker-dropdown-min-width.px]=\"dropdownMinWidth()\"\n    (valueChange)=\"onPickerValueChange($event)\"\n    (closeRequested)=\"closePopover()\"\n  />\n</ng-template>\n", styles: [".tedi-time-field{display:flex;flex:1;min-width:0}.tedi-time-field--small .tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-time-field--large .tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-lg);--_field-padding-x: var(--form-field-padding-x-lg);--_field-height: var(--form-field-height-lg)}.tedi-time-field__popover{display:flex;flex:1;min-width:0}.tedi-time-field__field{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;display:flex;flex:1;gap:var(--form-field-inner-spacing);align-items:center;min-width:0}.tedi-time-field__field:focus,.tedi-time-field__field:focus-visible{outline:none}.tedi-time-field__field:where(.tedi-field-surface){background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);height:var(--_field-height);padding:var(--_field-padding-y) var(--_field-padding-x)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):is([aria-invalid=true],.tedi-field-surface--invalid){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled).tedi-field-surface--valid{--_field-border-color: var(--form-general-feedback-success-border)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):active,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):has(input:active,textarea:active),.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):focus-within,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled):has(input:focus-visible,textarea:focus-visible){--_field-ring-color: var(--_field-border-color)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):hover,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:hover,textarea:hover){--_field-border-color: var(--form-input-border-hover)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):active,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:active,textarea:active){--_field-border-color: var(--form-input-border-active)}.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):focus-within,.tedi-time-field__field.tedi-field-surface:not(:disabled,.tedi-field-surface--disabled,[aria-invalid=true],.tedi-field-surface--invalid,.tedi-field-surface--valid):has(input:focus-visible,textarea:focus-visible){--_field-border-color: var(--form-input-border-focus)}.tedi-time-field__field.tedi-field-surface:is(:disabled,.tedi-field-surface--disabled){--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);--_field-ring-color: transparent;cursor:not-allowed}.tedi-time-field__field--button-trigger{pointer-events:none}.tedi-time-field__field--button-trigger .tedi-time-field__input,.tedi-time-field__field--button-trigger .tedi-time-field__clear,.tedi-time-field__field--button-trigger .tedi-time-field__icon{pointer-events:auto}.tedi-time-field__input{flex:1;min-width:0;padding-inline-start:1px;margin-inline-start:-1px;font-family:inherit;font-size:var(--body-regular-size);color:var(--form-input-text-filled);outline:none;background:transparent;border:0;border-radius:var(--form-field-radius)}.tedi-time-field__input::placeholder{color:var(--form-input-text-placeholder)}.tedi-time-field__input:disabled{color:var(--form-input-text-disabled);cursor:not-allowed}.tedi-time-field__input::-webkit-calendar-picker-indicator,.tedi-time-field__input::-webkit-inner-spin-button,.tedi-time-field__input::-webkit-outer-spin-button,.tedi-time-field__input::-webkit-clear-button,.tedi-time-field__input::-webkit-list-button{display:none;margin:0;appearance:none}.tedi-time-field__actions{display:flex;flex-shrink:0;gap:var(--layout-grid-gutters-04);align-items:center;align-self:center;justify-content:center}.tedi-time-field__clear{flex-shrink:0}.tedi-time-field__clear:disabled{cursor:not-allowed}.tedi-time-field__popover-content.tedi-popover-content{padding:0}.tedi-time-field .tedi-time-field__icon{flex-shrink:0;--button-sm-icon-size: var(--form-field-button-height-sm);width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);font-size:1.125rem;border-radius:var(--button-radius-sm)}@media(max-width:47.98rem){.tedi-time-field .tedi-time-field__icon{--button-sm-icon-size: var(--form-field-button-height)}}.tedi-time-field .tedi-time-field__icon:disabled{cursor:not-allowed}.tedi-time-field .tedi-time-field__icon--open:not(:disabled),.tedi-time-field .tedi-time-field__icon--open:not(:disabled):hover,.tedi-time-field .tedi-time-field__icon--open:not(:disabled):active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-time-field .tedi-time-field__icon--static{display:inline-flex;align-items:center;justify-content:center;color:var(--form-input-text-placeholder)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], invalidInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], pickerVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerVariant", required: false }] }], useNativePicker: [{ type: i0.Input, args: [{ isSignal: true, alias: "useNativePicker", required: false }] }], pickerTrigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickerTrigger", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], timeSlots: [{ type: i0.Input, args: [{ isSignal: true, alias: "timeSlots", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], showSlotIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSlotIndicator", required: false }] }], minuteStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "minuteStep", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], fullscreen: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullscreen", required: false }] }], inputElement: [{ type: i0.ViewChild, args: ["inputElement", { isSignal: true }] }], fieldEl: [{ type: i0.ViewChild, args: ["fieldEl", { isSignal: true }] }], popover: [{ type: i0.ViewChild, args: ["popover", { isSignal: true }] }], timePicker: [{ type: i0.ViewChild, args: ["timePicker", { isSignal: true }] }] } });
 class ProgressBarComponent {
@@ -20866,6 +21099,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                     }, template: "<ng-content></ng-content>\n", styles: [".tedi-row{display:grid}.tedi-row--cols-auto{--_grid-col-size-calc: calc( (100% - var(--_grid-gap) * (12 - 1)) / 12 );--_grid-col-min-size-calc: min( 100%, max(var(--_grid-col-width), var(--_grid-col-size-calc)) );grid-template-columns:repeat(auto-fit,minmax(var(--_grid-col-min-size-calc),1fr))}.tedi-row--cols-1{grid-template-columns:repeat(1,1fr)}.tedi-row--cols-2{grid-template-columns:repeat(2,1fr)}.tedi-row--cols-3{grid-template-columns:repeat(3,1fr)}.tedi-row--cols-4{grid-template-columns:repeat(4,1fr)}.tedi-row--cols-5{grid-template-columns:repeat(5,1fr)}.tedi-row--cols-6{grid-template-columns:repeat(6,1fr)}.tedi-row--cols-7{grid-template-columns:repeat(7,1fr)}.tedi-row--cols-8{grid-template-columns:repeat(8,1fr)}.tedi-row--cols-9{grid-template-columns:repeat(9,1fr)}.tedi-row--cols-10{grid-template-columns:repeat(10,1fr)}.tedi-row--cols-11{grid-template-columns:repeat(11,1fr)}.tedi-row--cols-12{grid-template-columns:repeat(12,1fr)}.tedi-row--justify-items-start{justify-items:start}.tedi-row--justify-items-end{justify-items:end}.tedi-row--justify-items-center{justify-items:center}.tedi-row--justify-items-stretch{justify-items:stretch}.tedi-row--align-items-start{align-items:start}.tedi-row--align-items-end{align-items:end}.tedi-row--align-items-center{align-items:center}.tedi-row--align-items-stretch{align-items:stretch}.g-0{gap:0}.gx-0{column-gap:0}.gy-0{row-gap:0}.g-1{gap:.25rem}.gx-1{column-gap:.25rem}.gy-1{row-gap:.25rem}.g-2{gap:.5rem}.gx-2{column-gap:.5rem}.gy-2{row-gap:.5rem}.g-3{gap:1rem}.gx-3{column-gap:1rem}.gy-3{row-gap:1rem}.g-4{gap:1.5rem}.gx-4{column-gap:1.5rem}.gy-4{row-gap:1.5rem}.g-5{gap:3rem}.gx-5{column-gap:3rem}.gy-5{row-gap:3rem}\n"] }]
         }], propDecorators: { cols: [{ type: i0.Input, args: [{ isSignal: true, alias: "cols", required: false }] }], minColWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minColWidth", required: false }] }], justifyItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "justifyItems", required: false }] }], alignItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignItems", required: false }] }], gap: [{ type: i0.Input, args: [{ isSignal: true, alias: "gap", required: false }] }], gapX: [{ type: i0.Input, args: [{ isSignal: true, alias: "gapX", required: false }] }], gapY: [{ type: i0.Input, args: [{ isSignal: true, alias: "gapY", required: false }] }], xs: [{ type: i0.Input, args: [{ isSignal: true, alias: "xs", required: false }] }], sm: [{ type: i0.Input, args: [{ isSignal: true, alias: "sm", required: false }] }], md: [{ type: i0.Input, args: [{ isSignal: true, alias: "md", required: false }] }], lg: [{ type: i0.Input, args: [{ isSignal: true, alias: "lg", required: false }] }], xl: [{ type: i0.Input, args: [{ isSignal: true, alias: "xl", required: false }] }], xxl: [{ type: i0.Input, args: [{ isSignal: true, alias: "xxl", required: false }] }] } });
+class OptionContentMetaComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: OptionContentMetaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.24", type: OptionContentMetaComponent, isStandalone: true, selector: "tedi-option-content-meta", host: { classAttribute: "tedi-option-content__meta" }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: OptionContentMetaComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "tedi-option-content-meta",
+                    template: `<ng-content />`,
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    host: {
+                        class: "tedi-option-content__meta",
+                    },
+                }]
+        }] });
 class ScrollFadeComponent {
     /** Size of the fade gradient in percentages. */
     fadeSize = input(20, ...(ngDevMode ? [{ debugName: "fadeSize" }] : []));
@@ -23994,24 +24245,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                     }, template: "@if (isActive()) {\n  <ng-content />\n}\n", styles: [".tedi-tabs-content{background:var(--tab-item-selected-background)}.tedi-tabs-content:not([hidden]){display:block}\n"] }]
         }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
-class DropdownItemValueMetaComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: DropdownItemValueMetaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.24", type: DropdownItemValueMetaComponent, isStandalone: true, selector: "tedi-dropdown-item-value-meta", host: { classAttribute: "tedi-dropdown-item-value__meta" }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: DropdownItemValueMetaComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: "tedi-dropdown-item-value-meta",
-                    template: `<ng-content />`,
-                    standalone: true,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    encapsulation: ViewEncapsulation.None,
-                    host: {
-                        class: "tedi-dropdown-item-value__meta",
-                    },
-                }]
-        }] });
 /**
  * Applies the print helper classes from `@tedi-design-system/core` to the host element.
  */
@@ -24152,5 +24385,5 @@ function provideTedi(config = {}) {
  * Generated bundle index. Do not edit.
  */
-export { AVAILABLE_LANGUAGES, AccordionComponent, AccordionItemComponent, AccordionItemContentComponent, AccordionItemHeaderComponent, AlertComponent, AttachmentActionsComponent, AttachmentComponent, BREAKPOINTS, BaseButtonDirective, BreadcrumbItemDirective, BreadcrumbSeparatorDirective, BreadcrumbsComponent, BreakpointService, ButtonComponent, ButtonGroupButtonDirective, ButtonGroupComponent, COUNTER_TAG_WIDTH, CalendarComponent, CardButtonComponent, CardComponent, CardContentComponent, CardHeaderComponent, CardIconComponent, CardRowComponent, CarouselComponent, CarouselContentComponent, CarouselFooterComponent, CarouselHeaderComponent, CarouselIndicatorsComponent, CarouselNavigationComponent, CarouselSlideDirective, CheckboxCardComponent, CheckboxCardGroupComponent, CheckboxComponent, CheckboxGroupComponent, ClosingButtonComponent, ColComponent, CollapseButtonComponent, CollapseComponent, DROPDOWN_API, DROPDOWN_CONTENT_API, DateFieldComponent, DatePickerComponent, DropdownComponent, DropdownContentComponent, DropdownItemComponent, DropdownItemValueComponent, DropdownItemValueLabelComponent, DropdownItemValueMetaComponent, DropdownTriggerDirective, EllipsisComponent, EmptyStateComponent, FeedbackTextComponent, FilterComponent, FilterContentDirective, FilterGroupComponent, FilterPrependDirective, FloatingButtonComponent, FooterBodyComponent, FooterBottomComponent, FooterComponent, FooterSectionComponent, FooterSideComponent, FormFieldComponent, FormFieldExtraDirective, HeaderActionsComponent, HeaderBottomComponent, HeaderComponent, HeaderContentComponent, HeaderLanguageComponent, HeaderLoginComponent, HeaderLogoComponent, HeaderLogoDarkDirective, HeaderLogoutComponent, HeaderMobileButtonComponent, HeaderProfileComponent, HeaderRoleComponent, HeaderRoleContentDirective, HeaderRoleNoResultsDirective, HeaderRoleTitleDirective, HeaderSearchComponent, HeaderTopComponent, HeadingWithIconComponent, HideAtDirective, HorizontalPushHandler, HorizontalStepperComponent, HorizontalStepperItemComponent, IconComponent, InfoButtonComponent, InfoTooltipComponent, InputGroupComponent, InputGroupPrefixDirective, InputGroupSuffixDirective, LANGUAGE_COOKIE_NAME, LANGUAGE_FALLBACK_VALUE, LabelComponent, LabelRowComponent, LinkComponent, ListComponent, MODAL_DATA, MODAL_SIZE, ModalComponent, ModalContentComponent, ModalFooterComponent, ModalHeaderComponent, ModalRef, ModalService, NumberFieldComponent, PaginationComponent, PopoverComponent, PopoverContentComponent, PopoverTriggerDirective, PrintDirective, ProgressBarComponent, RadioCardComponent, RadioCardGroupComponent, RadioComponent, RadioGroupComponent, RowComponent, ScrollFadeComponent, SearchComponent, SearchFooterActionsComponent, SearchFooterTemplateDirective, SearchSuggestionComponent, SearchSuggestionTemplateDirective, SelectComponent, SelectOptionTemplateDirective, SelectTooltipTemplateDirective, SelectValueTemplateDirective, SeparatorComponent, ShowAtDirective, SideNavComponent, SideNavDropdownComponent, SideNavDropdownGroupComponent, SideNavDropdownItemComponent, SideNavGroupTitleComponent, SideNavItemComponent, SideNavOverlayComponent, SideNavToggleComponent, SkeletonBlockComponent, SkeletonComponent, SliderComponent, SpecialOptionControls, SpinnerComponent, StatusBadgeComponent, StatusIndicatorComponent, TAG_GAP, TEDI_FIELD_CONTEXT, TEDI_FORM_FIELD_CONTROL, TEDI_INPUT_GROUP, TEDI_TABLE_CONTEXT, TEDI_THEME_DEFAULT_TOKEN, TEDI_TRANSLATION_DEFAULT_TOKEN, THEME_CLASS_PREFIX, THEME_COOKIE_NAME, THEME_FALLBACK_VALUE, TOAST_DEFAULT_DURATION, TableOfContentsCollapsibleComponent, TableOfContentsComponent, TableOfContentsItemComponent, TableOfContentsItemSuffixDirective, TabsComponent, TabsContentComponent, TabsListComponent, TabsTriggerComponent, TagComponent, TediPaginationResultsDirective, TediTableColumnsMenuComponent, TediTableComponent, TediTableHeaderButtonComponent, TediTableToolbarComponent, TediTranslationPipe, TediTranslationService, TextComponent, TextFieldComponent, TextGroupComponent, TextGroupLabelComponent, TextGroupValueComponent, TextareaComponent, ThemeService, TimeFieldComponent, TimePickerComponent, TimelineComponent, TimelineDescriptionComponent, TimelineItemComponent, TimelineTimingsBottomDirective, TimelineTitleComponent, ToastComponent, ToastService, ToggleComponent, TooltipComponent, TooltipContentComponent, TooltipTriggerComponent, TruncateComponent, VerticalSpacingDirective, VerticalSpacingItemDirective, addDays, addMonths, addYears, breakpointInput, buildMonthGrid, calculateArrowOffset, calculateVisibleTagCount, computeGroupSpans, controlDescribedBy, cookieSignal, createTablePersistence, deriveControlState, endOfMonth, formatDate, formatLocaleDate, formatLocaleDateHint, formatLocaleDateLong, formatMonthYear, generateUUID, getCardBorderPlacementColor, getDaysInMonth, getFirstDayOfWeek, getFocusableElements, getISOWeek, getMonthNames, getPaddingCssVariables, getPlacementFromPositionChange, getWeekdayNames, groupRowSpan, highlightParts, injectTediTableContext, isAfterDay, isBeforeDay, isDateInRange, isSameDay, isSameMonth, isSameYear, isValidTime, matchAny, matchDate, normalizeTime, parseDate, parseLocaleDate, provideTedi, resolveCardBorderRadius, startOfMonth, startOfWeek, toConnectedPositions, toggleDateInArray, usePagination, warnDeprecated };
+export { AVAILABLE_LANGUAGES, AccordionComponent, AccordionItemComponent, AccordionItemContentComponent, AccordionItemHeaderComponent, AlertComponent, AttachmentActionsComponent, AttachmentComponent, BREAKPOINTS, BaseButtonDirective, BreadcrumbItemDirective, BreadcrumbSeparatorDirective, BreadcrumbsComponent, BreakpointService, ButtonComponent, ButtonGroupButtonDirective, ButtonGroupComponent, COUNTER_TAG_WIDTH, CalendarComponent, CardButtonComponent, CardComponent, CardContentComponent, CardHeaderComponent, CardIconComponent, CardRowComponent, CarouselComponent, CarouselContentComponent, CarouselFooterComponent, CarouselHeaderComponent, CarouselIndicatorsComponent, CarouselNavigationComponent, CarouselSlideDirective, CheckboxCardComponent, CheckboxCardGroupComponent, CheckboxComponent, CheckboxGroupComponent, ClosingButtonComponent, ColComponent, CollapseButtonComponent, CollapseComponent, DROPDOWN_API, DROPDOWN_CONTENT_API, DateFieldComponent, DatePickerComponent, DropdownComponent, DropdownContentComponent, DropdownItemComponent, DropdownTriggerDirective, EllipsisComponent, EmptyStateComponent, FeedbackTextComponent, FilterComponent, FilterContentDirective, FilterGroupComponent, FilterPrependDirective, FloatingButtonComponent, FooterBodyComponent, FooterBottomComponent, FooterComponent, FooterSectionComponent, FooterSideComponent, FormFieldComponent, FormFieldExtraDirective, HeaderActionsComponent, HeaderBottomComponent, HeaderComponent, HeaderContentComponent, HeaderLanguageComponent, HeaderLoginComponent, HeaderLogoComponent, HeaderLogoDarkDirective, HeaderLogoutComponent, HeaderMobileButtonComponent, HeaderProfileComponent, HeaderRoleComponent, HeaderRoleContentDirective, HeaderRoleNoResultsDirective, HeaderRoleTitleDirective, HeaderSearchComponent, HeaderTopComponent, HeadingWithIconComponent, HideAtDirective, HorizontalPushHandler, HorizontalStepperComponent, HorizontalStepperItemComponent, IconComponent, InfoButtonComponent, InfoTooltipComponent, InputGroupComponent, InputGroupPrefixDirective, InputGroupSuffixDirective, LANGUAGE_COOKIE_NAME, LANGUAGE_FALLBACK_VALUE, LabelComponent, LabelRowComponent, LinkComponent, ListComponent, MODAL_DATA, MODAL_SIZE, ModalComponent, ModalContentComponent, ModalFooterComponent, ModalHeaderComponent, ModalRef, ModalService, NumberFieldComponent, OptionContentComponent, OptionContentLabelComponent, OptionContentMetaComponent, PaginationComponent, PopoverComponent, PopoverContentComponent, PopoverTriggerDirective, PrintDirective, ProgressBarComponent, RadioCardComponent, RadioCardGroupComponent, RadioComponent, RadioGroupComponent, RowComponent, ScrollFadeComponent, SearchComponent, SearchFooterActionsComponent, SearchFooterTemplateDirective, SearchSuggestionComponent, SearchSuggestionTemplateDirective, SelectComponent, SelectOptionTemplateDirective, SelectTooltipTemplateDirective, SelectValueTemplateDirective, SeparatorComponent, ShowAtDirective, SideNavComponent, SideNavDropdownComponent, SideNavDropdownGroupComponent, SideNavDropdownItemComponent, SideNavGroupTitleComponent, SideNavItemComponent, SideNavOverlayComponent, SideNavToggleComponent, SkeletonBlockComponent, SkeletonComponent, SliderComponent, SpecialOptionControls, SpinnerComponent, StatusBadgeComponent, StatusIndicatorComponent, TAG_GAP, TEDI_FIELD_CONTEXT, TEDI_FORM_FIELD_CONTROL, TEDI_INPUT_GROUP, TEDI_TABLE_CONTEXT, TEDI_THEME_DEFAULT_TOKEN, TEDI_TRANSLATION_DEFAULT_TOKEN, THEME_CLASS_PREFIX, THEME_COOKIE_NAME, THEME_FALLBACK_VALUE, TOAST_DEFAULT_DURATION, TableOfContentsCollapsibleComponent, TableOfContentsComponent, TableOfContentsItemComponent, TableOfContentsItemSuffixDirective, TabsComponent, TabsContentComponent, TabsListComponent, TabsTriggerComponent, TagComponent, TediPaginationResultsDirective, TediTableColumnsMenuComponent, TediTableComponent, TediTableHeaderButtonComponent, TediTableToolbarComponent, TediTranslationPipe, TediTranslationService, TextComponent, TextFieldComponent, TextGroupComponent, TextGroupLabelComponent, TextGroupValueComponent, TextareaComponent, ThemeService, TimeFieldComponent, TimePickerComponent, TimelineComponent, TimelineDescriptionComponent, TimelineItemComponent, TimelineTimingsBottomDirective, TimelineTitleComponent, ToastComponent, ToastService, ToggleComponent, TooltipComponent, TooltipContentComponent, TooltipTriggerComponent, TruncateComponent, VerticalSpacingDirective, VerticalSpacingItemDirective, addDays, addMonths, addYears, breakpointInput, buildMonthGrid, calculateArrowOffset, calculateVisibleTagCount, computeGroupSpans, controlDescribedBy, cookieSignal, createTablePersistence, deriveControlState, endOfMonth, formatDate, formatLocaleDate, formatLocaleDateHint, formatLocaleDateLong, formatMonthYear, generateUUID, getCardBorderPlacementColor, getDaysInMonth, getFirstDayOfWeek, getFocusableElements, getISOWeek, getMonthNames, getPaddingCssVariables, getPlacementFromPositionChange, getWeekdayNames, groupRowSpan, highlightParts, injectTediTableContext, isAfterDay, isBeforeDay, isDateInRange, isSameDay, isSameMonth, isSameYear, isValidTime, matchAny, matchDate, normalizeTime, parseDate, parseLocaleDate, provideTedi, resolveCardBorderRadius, startOfMonth, startOfWeek, toConnectedPositions, toggleDateInArray, usePagination, warnDeprecated };
 //# sourceMappingURL=tedi-design-system-angular-tedi.mjs.map