@tedi-design-system/angular 3.0.0-rc.1

package/fesm2022/tedi-design-system-angular-community.mjs

@@ -0,0 +1,2906 @@
+import * as i0 from '@angular/core';
+import { input, computed, Directive, ChangeDetectionStrategy, ViewEncapsulation, Component, signal, contentChildren, effect, booleanAttribute, inject, model, forwardRef, viewChild, output, TemplateRef, Injector, contentChild, ElementRef, HostListener, Injectable } from '@angular/core';
+import { IconComponent, ButtonComponent, generateUUID, FeedbackTextComponent, LabelComponent, BreakpointService, ClosingButtonComponent, TextComponent, TediTranslationPipe, SpinnerComponent, TediTranslationService, TooltipComponent, TooltipTriggerComponent, TooltipContentComponent, InfoButtonComponent, VerticalSpacingDirective, LinkComponent } from '@tedi-design-system/angular/tedi';
+import * as i1$1 from '@angular/forms';
+import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
+import * as i2 from '@angular/cdk/overlay';
+import { CdkOverlayOrigin, OverlayModule } from '@angular/cdk/overlay';
+import * as i3 from '@angular/cdk/listbox';
+import { CdkListbox, CdkListboxModule } from '@angular/cdk/listbox';
+import { FocusKeyManager, A11yModule } from '@angular/cdk/a11y';
+import { DialogRef, DIALOG_DATA, DialogModule } from '@angular/cdk/dialog';
+import { CdkScrollable } from '@angular/cdk/scrolling';
+import * as i1 from '@angular/common';
+import { NgStyle, CommonModule } from '@angular/common';
+import * as i2$1 from '@angular/cdk/menu';
+import { CdkMenu, CdkMenuModule } from '@angular/cdk/menu';
+import * as i1$2 from '@angular/router';
+import { RouterLink, RouterLinkActive } from '@angular/router';
+import { toSignal } from '@angular/core/rxjs-interop';
+import { startWith } from 'rxjs';
+
+class CardColorsDirective {
+    /**
+     * Modifies background of the block it's attached to.
+     */
+    background = input();
+    border = input();
+    modifierClasses = computed(() => {
+        const modifiers = [];
+        if (this.background()) {
+            modifiers.push(`tedi-card--background--${this.background()}`);
+        }
+        if (this.border()) {
+            modifiers.push(`tedi-card--border--${this.border()}`);
+        }
+        return modifiers.join(" ");
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardColorsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: CardColorsDirective, isStandalone: true, inputs: { background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "modifierClasses()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardColorsDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    host: {
+                        "[class]": "modifierClasses()",
+                    },
+                }]
+        }] });
+
+const getPaddingClasses = (padding) => {
+    if (typeof padding === "string") {
+        return `tedi-card--padding-${padding}`;
+    }
+    else {
+        return Object.entries(padding)
+            .map(([direction, padding]) => {
+            return `tedi-card--padding-${direction}-${padding}`;
+        })
+            .join(" ");
+    }
+};
+class CardPaddingDirective {
+    /**
+     * Modifies padding of the block it's attached to. Can be override whole block or horizontal, vertical or each side separately.
+     */
+    padding = input();
+    modifierClasses = computed(() => {
+        if (this.padding()) {
+            return getPaddingClasses(this.padding());
+        }
+        return "";
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardPaddingDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: CardPaddingDirective, isStandalone: true, inputs: { padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "modifierClasses()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardPaddingDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    host: {
+                        "[class]": "modifierClasses()",
+                    },
+                }]
+        }] });
+
+class CardComponent {
+    /**
+     * Whether card should not have border.
+     * @default false
+     */
+    borderless = input();
+    /**
+     * Sets padding for header and content block.
+     * @default md
+     */
+    spacing = input("md");
+    /**
+     * Creates colored accent left border.
+     */
+    accentBorder = input();
+    /**
+     * Whether card should have selected border.
+     * @default false
+     */
+    selected = input();
+    modifierClasses = computed(() => {
+        const modifiers = [`tedi-card--spacing-${this.spacing()}`];
+        if (this.accentBorder()) {
+            modifiers.push(`tedi-card--accent-border`, `tedi-card--accent-border--${this.accentBorder()}`);
+        }
+        return modifiers.join(" ");
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: CardComponent, isStandalone: true, selector: "tedi-card", inputs: { borderless: { classPropertyName: "borderless", publicName: "borderless", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null }, accentBorder: { classPropertyName: "accentBorder", publicName: "accentBorder", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-card": "true", "class.tedi-card--borderless": "borderless()", "class.tedi-card--selected": "selected()", "class": "modifierClasses()" } }, hostDirectives: [{ directive: CardColorsDirective, inputs: ["background", "background", "border", "border"] }, { directive: CardPaddingDirective, inputs: ["padding", "padding"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".tedi-card{--_card-border: var(--card-border-primary);--_card-selected-border: var(--card-border-selected);--_card-bg: var(--card-background-primary);--_card-timeline-color: var(--general-border-accent);border-radius:var(--_card-radius);display:flex;flex-direction:column;position:relative}.tedi-card{--_card-radius: var(--card-radius-rounded-mobile)}@media (min-width: 576px){.tedi-card{--_card-radius: var(--card-radius-rounded-tablet)}}@media (min-width: 992px){.tedi-card{--_card-radius: var(--card-radius-rounded-desktop)}}.tedi-card--background--accent{--_card-bg: var(--card-background-accent)}.tedi-card--border--accent{--_card-border: var(--card-background-accent)}.tedi-card--background--brand-primary{--_card-bg: var(--card-background-brand-primary)}.tedi-card--border--brand-primary{--_card-border: var(--card-background-brand-primary)}.tedi-card--background--brand-secondary{--_card-bg: var(--card-background-brand-secondary)}.tedi-card--border--brand-secondary{--_card-border: var(--card-background-brand-secondary)}.tedi-card--background--brand-tertiary{--_card-bg: var(--card-background-brand-tertiary)}.tedi-card--border--brand-tertiary{--_card-border: var(--card-background-brand-tertiary)}.tedi-card--background--brand-quaternary{--_card-bg: var(--card-background-brand-quaternary)}.tedi-card--border--brand-quaternary{--_card-border: var(--card-background-brand-quaternary)}.tedi-card--background--primary{--_card-bg: var(--card-background-primary)}.tedi-card--border--primary{--_card-border: var(--card-background-primary)}.tedi-card--background--secondary{--_card-bg: var(--card-background-secondary)}.tedi-card--border--secondary{--_card-border: var(--card-background-secondary)}.tedi-card--background--tertiary{--_card-bg: var(--card-background-tertiary)}.tedi-card--border--tertiary{--_card-border: var(--card-background-tertiary)}.tedi-card--background--info-primary{--_card-bg: var(--general-status-info-background-light)}.tedi-card--border--info-primary{--_card-border: var(--general-status-info-background-light)}.tedi-card--background--info-secondary{--_card-bg: var(--general-status-info-background-dark)}.tedi-card--border--info-secondary{--_card-border: var(--general-status-info-background-dark)}.tedi-card--background--neutral-primary{--_card-bg: var(--general-status-neutral-background-light)}.tedi-card--border--neutral-primary{--_card-border: var(--general-status-neutral-background-light)}.tedi-card--background--neutral-secondary{--_card-bg: var(--general-status-neutral-background-dark)}.tedi-card--border--neutral-secondary{--_card-border: var(--general-status-neutral-background-dark)}.tedi-card--background--success-primary{--_card-bg: var(--card-background-success)}.tedi-card--border--success-primary{--_card-border: var(--card-background-success)}.tedi-card--background--success-secondary{--_card-bg: var(--general-status-success-background-secondary)}.tedi-card--border--success-secondary{--_card-border: var(--general-status-success-background-secondary)}.tedi-card--background--danger-primary{--_card-bg: var(--general-status-danger-background-primary)}.tedi-card--border--danger-primary{--_card-border: var(--general-status-danger-background-primary)}.tedi-card--background--danger-secondary{--_card-bg: var(--general-status-danger-background-secondary)}.tedi-card--border--danger-secondary{--_card-border: var(--general-status-danger-background-secondary)}.tedi-card--background--warning-primary{--_card-bg: var(--general-status-warning-background-light)}.tedi-card--border--warning-primary{--_card-border: var(--general-status-warning-background-light)}.tedi-card--background--warning-secondary{--_card-bg: var(--general-status-warning-background-dark)}.tedi-card--border--warning-secondary{--_card-border: var(--general-status-warning-background-dark)}.tedi-card--spacing-xs{--_card-padding: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--spacing-xs{--_card-padding: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--spacing-xs{--_card-padding: var(--card-padding-xs-desktop)}}.tedi-card--spacing-sm{--_card-padding: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--spacing-sm{--_card-padding: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--spacing-sm{--_card-padding: var(--card-padding-sm-desktop)}}.tedi-card--spacing-md{--_card-padding: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--spacing-md{--_card-padding: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--spacing-md{--_card-padding: var(--card-padding-md-default-desktop)}}.tedi-card--spacing-lg{--_card-padding: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--spacing-lg{--_card-padding: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--spacing-lg{--_card-padding: var(--card-padding-lg-desktop)}}.tedi-card--spacing-none{--_card-padding: 0}.tedi-card{--_card-padding-vertical: var(--_card-padding);--_card-padding-horizontal: var(--_card-padding);--_card-padding-top: var(--_card-padding-vertical);--_card-padding-bottom: var(--_card-padding-vertical);--_card-padding-left: var(--_card-padding-horizontal);--_card-padding-right: var(--_card-padding-horizontal)}.tedi-card--padding-xs{--_card-padding: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-xs{--_card-padding: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-xs{--_card-padding: var(--card-padding-xs-desktop)}}.tedi-card--padding-vertical-xs{--_card-padding-vertical: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-vertical-xs{--_card-padding-vertical: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-vertical-xs{--_card-padding-vertical: var(--card-padding-xs-desktop)}}.tedi-card--padding-horizontal-xs{--_card-padding-horizontal: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-horizontal-xs{--_card-padding-horizontal: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-horizontal-xs{--_card-padding-horizontal: var(--card-padding-xs-desktop)}}.tedi-card--padding-top-xs{--_card-padding-top: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-top-xs{--_card-padding-top: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-top-xs{--_card-padding-top: var(--card-padding-xs-desktop)}}.tedi-card--padding-bottom-xs{--_card-padding-bottom: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-bottom-xs{--_card-padding-bottom: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-bottom-xs{--_card-padding-bottom: var(--card-padding-xs-desktop)}}.tedi-card--padding-left-xs{--_card-padding-left: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-left-xs{--_card-padding-left: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-left-xs{--_card-padding-left: var(--card-padding-xs-desktop)}}.tedi-card--padding-right-xs{--_card-padding-right: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-right-xs{--_card-padding-right: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-right-xs{--_card-padding-right: var(--card-padding-xs-desktop)}}.tedi-card--padding-sm{--_card-padding: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-sm{--_card-padding: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-sm{--_card-padding: var(--card-padding-sm-desktop)}}.tedi-card--padding-vertical-sm{--_card-padding-vertical: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-vertical-sm{--_card-padding-vertical: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-vertical-sm{--_card-padding-vertical: var(--card-padding-sm-desktop)}}.tedi-card--padding-horizontal-sm{--_card-padding-horizontal: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-horizontal-sm{--_card-padding-horizontal: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-horizontal-sm{--_card-padding-horizontal: var(--card-padding-sm-desktop)}}.tedi-card--padding-top-sm{--_card-padding-top: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-top-sm{--_card-padding-top: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-top-sm{--_card-padding-top: var(--card-padding-sm-desktop)}}.tedi-card--padding-bottom-sm{--_card-padding-bottom: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-bottom-sm{--_card-padding-bottom: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-bottom-sm{--_card-padding-bottom: var(--card-padding-sm-desktop)}}.tedi-card--padding-left-sm{--_card-padding-left: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-left-sm{--_card-padding-left: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-left-sm{--_card-padding-left: var(--card-padding-sm-desktop)}}.tedi-card--padding-right-sm{--_card-padding-right: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-right-sm{--_card-padding-right: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-right-sm{--_card-padding-right: var(--card-padding-sm-desktop)}}.tedi-card--padding-md{--_card-padding: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-md{--_card-padding: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-md{--_card-padding: var(--card-padding-md-default-desktop)}}.tedi-card--padding-vertical-md{--_card-padding-vertical: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-vertical-md{--_card-padding-vertical: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-vertical-md{--_card-padding-vertical: var(--card-padding-md-default-desktop)}}.tedi-card--padding-horizontal-md{--_card-padding-horizontal: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-horizontal-md{--_card-padding-horizontal: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-horizontal-md{--_card-padding-horizontal: var(--card-padding-md-default-desktop)}}.tedi-card--padding-top-md{--_card-padding-top: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-top-md{--_card-padding-top: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-top-md{--_card-padding-top: var(--card-padding-md-default-desktop)}}.tedi-card--padding-bottom-md{--_card-padding-bottom: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-bottom-md{--_card-padding-bottom: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-bottom-md{--_card-padding-bottom: var(--card-padding-md-default-desktop)}}.tedi-card--padding-left-md{--_card-padding-left: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-left-md{--_card-padding-left: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-left-md{--_card-padding-left: var(--card-padding-md-default-desktop)}}.tedi-card--padding-right-md{--_card-padding-right: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-right-md{--_card-padding-right: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-right-md{--_card-padding-right: var(--card-padding-md-default-desktop)}}.tedi-card--padding-lg{--_card-padding: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-lg{--_card-padding: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-lg{--_card-padding: var(--card-padding-lg-desktop)}}.tedi-card--padding-vertical-lg{--_card-padding-vertical: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-vertical-lg{--_card-padding-vertical: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-vertical-lg{--_card-padding-vertical: var(--card-padding-lg-desktop)}}.tedi-card--padding-horizontal-lg{--_card-padding-horizontal: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-horizontal-lg{--_card-padding-horizontal: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-horizontal-lg{--_card-padding-horizontal: var(--card-padding-lg-desktop)}}.tedi-card--padding-top-lg{--_card-padding-top: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-top-lg{--_card-padding-top: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-top-lg{--_card-padding-top: var(--card-padding-lg-desktop)}}.tedi-card--padding-bottom-lg{--_card-padding-bottom: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-bottom-lg{--_card-padding-bottom: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-bottom-lg{--_card-padding-bottom: var(--card-padding-lg-desktop)}}.tedi-card--padding-left-lg{--_card-padding-left: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-left-lg{--_card-padding-left: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-left-lg{--_card-padding-left: var(--card-padding-lg-desktop)}}.tedi-card--padding-right-lg{--_card-padding-right: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-right-lg{--_card-padding-right: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-right-lg{--_card-padding-right: var(--card-padding-lg-desktop)}}.tedi-card--padding-none{--_card-padding: 0}.tedi-card--padding-vertical-none{--_card-padding-vertical: 0}.tedi-card--padding-horizontal-none{--_card-padding-horizontal: 0}.tedi-card--padding-top-none{--_card-padding-top: 0}.tedi-card--padding-bottom-none{--_card-padding-bottom: 0}.tedi-card--padding-left-none{--_card-padding-left: 0}.tedi-card--padding-right-none{--_card-padding-right: 0}.tedi-card--accent-border:before{content:\"\";display:block;position:absolute;left:0;top:0;bottom:0;border-top-left-radius:var(--_card-radius);border-bottom-left-radius:var(--_card-radius);border-left:4px solid var(--_card-border-accent)}.tedi-card--accent-border--info{--_card-border-accent: var(--general-status-info-background-dark)}.tedi-card--accent-border--success{--_card-border-accent: var(--general-status-success-background-secondary)}.tedi-card--accent-border--warning{--_card-border-accent: var(--general-status-warning-background-dark)}.tedi-card--accent-border--danger{--_card-border-accent: var(--general-status-danger-background-secondary)}.tedi-card>.tedi-card-header{border-top-left-radius:var(--_card-radius);border-top-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-content:not(:first-child){border-top:transparent}.tedi-card>.tedi-card-content:not(.tedi-card-content--has-separator,:last-child){border-bottom:transparent}.tedi-card>.tedi-card-content:first-child{border-top-left-radius:var(--_card-radius);border-top-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-content:last-child{border-bottom-left-radius:var(--_card-radius);border-bottom-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-row>.tedi-card-content:not(:first-child){border-left:transparent}.tedi-card>.tedi-card-row>.tedi-card-content:not(:last-child,.tedi-card-content--has-separator){border-right:transparent}.tedi-card>.tedi-card-row:first-child>.tedi-card-content:first-child{border-top-left-radius:var(--_card-radius)}.tedi-card>.tedi-card-row:first-child>.tedi-card-content:last-child{border-top-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-row:last-child>.tedi-card-content:first-child{border-bottom-left-radius:var(--_card-radius)}.tedi-card>.tedi-card-row:last-child>.tedi-card-content:last-child{border-bottom-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-row:not(:first-child)>.tedi-card-content{border-top:transparent}.tedi-card>.tedi-card-row:not(:last-child,.tedi-card-row--has-separator)>.tedi-card-content{border-bottom:transparent}.tedi-card--selected{outline:1px solid var(--_card-selected-border);outline-offset:-1px}.tedi-card--borderless{--_card-border: transparent}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-card", standalone: true, imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-card]": "true",
+                        "[class.tedi-card--borderless]": "borderless()",
+                        "[class.tedi-card--selected]": "selected()",
+                        "[class]": "modifierClasses()",
+                    }, hostDirectives: [
+                        {
+                            directive: CardColorsDirective,
+                            inputs: ["background", "border"],
+                        },
+                        {
+                            directive: CardPaddingDirective,
+                            inputs: ["padding"],
+                        },
+                    ], template: "<ng-content></ng-content>\n", styles: [".tedi-card{--_card-border: var(--card-border-primary);--_card-selected-border: var(--card-border-selected);--_card-bg: var(--card-background-primary);--_card-timeline-color: var(--general-border-accent);border-radius:var(--_card-radius);display:flex;flex-direction:column;position:relative}.tedi-card{--_card-radius: var(--card-radius-rounded-mobile)}@media (min-width: 576px){.tedi-card{--_card-radius: var(--card-radius-rounded-tablet)}}@media (min-width: 992px){.tedi-card{--_card-radius: var(--card-radius-rounded-desktop)}}.tedi-card--background--accent{--_card-bg: var(--card-background-accent)}.tedi-card--border--accent{--_card-border: var(--card-background-accent)}.tedi-card--background--brand-primary{--_card-bg: var(--card-background-brand-primary)}.tedi-card--border--brand-primary{--_card-border: var(--card-background-brand-primary)}.tedi-card--background--brand-secondary{--_card-bg: var(--card-background-brand-secondary)}.tedi-card--border--brand-secondary{--_card-border: var(--card-background-brand-secondary)}.tedi-card--background--brand-tertiary{--_card-bg: var(--card-background-brand-tertiary)}.tedi-card--border--brand-tertiary{--_card-border: var(--card-background-brand-tertiary)}.tedi-card--background--brand-quaternary{--_card-bg: var(--card-background-brand-quaternary)}.tedi-card--border--brand-quaternary{--_card-border: var(--card-background-brand-quaternary)}.tedi-card--background--primary{--_card-bg: var(--card-background-primary)}.tedi-card--border--primary{--_card-border: var(--card-background-primary)}.tedi-card--background--secondary{--_card-bg: var(--card-background-secondary)}.tedi-card--border--secondary{--_card-border: var(--card-background-secondary)}.tedi-card--background--tertiary{--_card-bg: var(--card-background-tertiary)}.tedi-card--border--tertiary{--_card-border: var(--card-background-tertiary)}.tedi-card--background--info-primary{--_card-bg: var(--general-status-info-background-light)}.tedi-card--border--info-primary{--_card-border: var(--general-status-info-background-light)}.tedi-card--background--info-secondary{--_card-bg: var(--general-status-info-background-dark)}.tedi-card--border--info-secondary{--_card-border: var(--general-status-info-background-dark)}.tedi-card--background--neutral-primary{--_card-bg: var(--general-status-neutral-background-light)}.tedi-card--border--neutral-primary{--_card-border: var(--general-status-neutral-background-light)}.tedi-card--background--neutral-secondary{--_card-bg: var(--general-status-neutral-background-dark)}.tedi-card--border--neutral-secondary{--_card-border: var(--general-status-neutral-background-dark)}.tedi-card--background--success-primary{--_card-bg: var(--card-background-success)}.tedi-card--border--success-primary{--_card-border: var(--card-background-success)}.tedi-card--background--success-secondary{--_card-bg: var(--general-status-success-background-secondary)}.tedi-card--border--success-secondary{--_card-border: var(--general-status-success-background-secondary)}.tedi-card--background--danger-primary{--_card-bg: var(--general-status-danger-background-primary)}.tedi-card--border--danger-primary{--_card-border: var(--general-status-danger-background-primary)}.tedi-card--background--danger-secondary{--_card-bg: var(--general-status-danger-background-secondary)}.tedi-card--border--danger-secondary{--_card-border: var(--general-status-danger-background-secondary)}.tedi-card--background--warning-primary{--_card-bg: var(--general-status-warning-background-light)}.tedi-card--border--warning-primary{--_card-border: var(--general-status-warning-background-light)}.tedi-card--background--warning-secondary{--_card-bg: var(--general-status-warning-background-dark)}.tedi-card--border--warning-secondary{--_card-border: var(--general-status-warning-background-dark)}.tedi-card--spacing-xs{--_card-padding: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--spacing-xs{--_card-padding: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--spacing-xs{--_card-padding: var(--card-padding-xs-desktop)}}.tedi-card--spacing-sm{--_card-padding: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--spacing-sm{--_card-padding: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--spacing-sm{--_card-padding: var(--card-padding-sm-desktop)}}.tedi-card--spacing-md{--_card-padding: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--spacing-md{--_card-padding: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--spacing-md{--_card-padding: var(--card-padding-md-default-desktop)}}.tedi-card--spacing-lg{--_card-padding: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--spacing-lg{--_card-padding: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--spacing-lg{--_card-padding: var(--card-padding-lg-desktop)}}.tedi-card--spacing-none{--_card-padding: 0}.tedi-card{--_card-padding-vertical: var(--_card-padding);--_card-padding-horizontal: var(--_card-padding);--_card-padding-top: var(--_card-padding-vertical);--_card-padding-bottom: var(--_card-padding-vertical);--_card-padding-left: var(--_card-padding-horizontal);--_card-padding-right: var(--_card-padding-horizontal)}.tedi-card--padding-xs{--_card-padding: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-xs{--_card-padding: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-xs{--_card-padding: var(--card-padding-xs-desktop)}}.tedi-card--padding-vertical-xs{--_card-padding-vertical: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-vertical-xs{--_card-padding-vertical: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-vertical-xs{--_card-padding-vertical: var(--card-padding-xs-desktop)}}.tedi-card--padding-horizontal-xs{--_card-padding-horizontal: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-horizontal-xs{--_card-padding-horizontal: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-horizontal-xs{--_card-padding-horizontal: var(--card-padding-xs-desktop)}}.tedi-card--padding-top-xs{--_card-padding-top: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-top-xs{--_card-padding-top: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-top-xs{--_card-padding-top: var(--card-padding-xs-desktop)}}.tedi-card--padding-bottom-xs{--_card-padding-bottom: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-bottom-xs{--_card-padding-bottom: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-bottom-xs{--_card-padding-bottom: var(--card-padding-xs-desktop)}}.tedi-card--padding-left-xs{--_card-padding-left: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-left-xs{--_card-padding-left: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-left-xs{--_card-padding-left: var(--card-padding-xs-desktop)}}.tedi-card--padding-right-xs{--_card-padding-right: var(--card-padding-xs-mobile)}@media (min-width: 576px){.tedi-card--padding-right-xs{--_card-padding-right: var(--card-padding-xs-tablet)}}@media (min-width: 992px){.tedi-card--padding-right-xs{--_card-padding-right: var(--card-padding-xs-desktop)}}.tedi-card--padding-sm{--_card-padding: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-sm{--_card-padding: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-sm{--_card-padding: var(--card-padding-sm-desktop)}}.tedi-card--padding-vertical-sm{--_card-padding-vertical: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-vertical-sm{--_card-padding-vertical: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-vertical-sm{--_card-padding-vertical: var(--card-padding-sm-desktop)}}.tedi-card--padding-horizontal-sm{--_card-padding-horizontal: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-horizontal-sm{--_card-padding-horizontal: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-horizontal-sm{--_card-padding-horizontal: var(--card-padding-sm-desktop)}}.tedi-card--padding-top-sm{--_card-padding-top: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-top-sm{--_card-padding-top: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-top-sm{--_card-padding-top: var(--card-padding-sm-desktop)}}.tedi-card--padding-bottom-sm{--_card-padding-bottom: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-bottom-sm{--_card-padding-bottom: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-bottom-sm{--_card-padding-bottom: var(--card-padding-sm-desktop)}}.tedi-card--padding-left-sm{--_card-padding-left: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-left-sm{--_card-padding-left: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-left-sm{--_card-padding-left: var(--card-padding-sm-desktop)}}.tedi-card--padding-right-sm{--_card-padding-right: var(--card-padding-sm-mobile)}@media (min-width: 576px){.tedi-card--padding-right-sm{--_card-padding-right: var(--card-padding-sm-tablet)}}@media (min-width: 992px){.tedi-card--padding-right-sm{--_card-padding-right: var(--card-padding-sm-desktop)}}.tedi-card--padding-md{--_card-padding: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-md{--_card-padding: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-md{--_card-padding: var(--card-padding-md-default-desktop)}}.tedi-card--padding-vertical-md{--_card-padding-vertical: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-vertical-md{--_card-padding-vertical: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-vertical-md{--_card-padding-vertical: var(--card-padding-md-default-desktop)}}.tedi-card--padding-horizontal-md{--_card-padding-horizontal: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-horizontal-md{--_card-padding-horizontal: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-horizontal-md{--_card-padding-horizontal: var(--card-padding-md-default-desktop)}}.tedi-card--padding-top-md{--_card-padding-top: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-top-md{--_card-padding-top: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-top-md{--_card-padding-top: var(--card-padding-md-default-desktop)}}.tedi-card--padding-bottom-md{--_card-padding-bottom: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-bottom-md{--_card-padding-bottom: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-bottom-md{--_card-padding-bottom: var(--card-padding-md-default-desktop)}}.tedi-card--padding-left-md{--_card-padding-left: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-left-md{--_card-padding-left: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-left-md{--_card-padding-left: var(--card-padding-md-default-desktop)}}.tedi-card--padding-right-md{--_card-padding-right: var(--card-padding-md-default-mobile)}@media (min-width: 576px){.tedi-card--padding-right-md{--_card-padding-right: var(--card-padding-md-default-tablet)}}@media (min-width: 992px){.tedi-card--padding-right-md{--_card-padding-right: var(--card-padding-md-default-desktop)}}.tedi-card--padding-lg{--_card-padding: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-lg{--_card-padding: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-lg{--_card-padding: var(--card-padding-lg-desktop)}}.tedi-card--padding-vertical-lg{--_card-padding-vertical: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-vertical-lg{--_card-padding-vertical: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-vertical-lg{--_card-padding-vertical: var(--card-padding-lg-desktop)}}.tedi-card--padding-horizontal-lg{--_card-padding-horizontal: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-horizontal-lg{--_card-padding-horizontal: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-horizontal-lg{--_card-padding-horizontal: var(--card-padding-lg-desktop)}}.tedi-card--padding-top-lg{--_card-padding-top: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-top-lg{--_card-padding-top: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-top-lg{--_card-padding-top: var(--card-padding-lg-desktop)}}.tedi-card--padding-bottom-lg{--_card-padding-bottom: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-bottom-lg{--_card-padding-bottom: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-bottom-lg{--_card-padding-bottom: var(--card-padding-lg-desktop)}}.tedi-card--padding-left-lg{--_card-padding-left: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-left-lg{--_card-padding-left: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-left-lg{--_card-padding-left: var(--card-padding-lg-desktop)}}.tedi-card--padding-right-lg{--_card-padding-right: var(--card-padding-lg-mobile)}@media (min-width: 576px){.tedi-card--padding-right-lg{--_card-padding-right: var(--card-padding-lg-tablet)}}@media (min-width: 992px){.tedi-card--padding-right-lg{--_card-padding-right: var(--card-padding-lg-desktop)}}.tedi-card--padding-none{--_card-padding: 0}.tedi-card--padding-vertical-none{--_card-padding-vertical: 0}.tedi-card--padding-horizontal-none{--_card-padding-horizontal: 0}.tedi-card--padding-top-none{--_card-padding-top: 0}.tedi-card--padding-bottom-none{--_card-padding-bottom: 0}.tedi-card--padding-left-none{--_card-padding-left: 0}.tedi-card--padding-right-none{--_card-padding-right: 0}.tedi-card--accent-border:before{content:\"\";display:block;position:absolute;left:0;top:0;bottom:0;border-top-left-radius:var(--_card-radius);border-bottom-left-radius:var(--_card-radius);border-left:4px solid var(--_card-border-accent)}.tedi-card--accent-border--info{--_card-border-accent: var(--general-status-info-background-dark)}.tedi-card--accent-border--success{--_card-border-accent: var(--general-status-success-background-secondary)}.tedi-card--accent-border--warning{--_card-border-accent: var(--general-status-warning-background-dark)}.tedi-card--accent-border--danger{--_card-border-accent: var(--general-status-danger-background-secondary)}.tedi-card>.tedi-card-header{border-top-left-radius:var(--_card-radius);border-top-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-content:not(:first-child){border-top:transparent}.tedi-card>.tedi-card-content:not(.tedi-card-content--has-separator,:last-child){border-bottom:transparent}.tedi-card>.tedi-card-content:first-child{border-top-left-radius:var(--_card-radius);border-top-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-content:last-child{border-bottom-left-radius:var(--_card-radius);border-bottom-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-row>.tedi-card-content:not(:first-child){border-left:transparent}.tedi-card>.tedi-card-row>.tedi-card-content:not(:last-child,.tedi-card-content--has-separator){border-right:transparent}.tedi-card>.tedi-card-row:first-child>.tedi-card-content:first-child{border-top-left-radius:var(--_card-radius)}.tedi-card>.tedi-card-row:first-child>.tedi-card-content:last-child{border-top-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-row:last-child>.tedi-card-content:first-child{border-bottom-left-radius:var(--_card-radius)}.tedi-card>.tedi-card-row:last-child>.tedi-card-content:last-child{border-bottom-right-radius:var(--_card-radius)}.tedi-card>.tedi-card-row:not(:first-child)>.tedi-card-content{border-top:transparent}.tedi-card>.tedi-card-row:not(:last-child,.tedi-card-row--has-separator)>.tedi-card-content{border-bottom:transparent}.tedi-card--selected{outline:1px solid var(--_card-selected-border);outline-offset:-1px}.tedi-card--borderless{--_card-border: transparent}\n"] }]
+        }] });
+
+class AccordionItemComponent {
+    /**
+     * Accordion item id
+     */
+    id = input.required();
+    /**
+     * Whether accordion item is selected
+     */
+    selected = input(false);
+    opened = signal(false);
+    headerId = computed(() => {
+        return `tedi-accordion-header-${this.id()}`;
+    });
+    contentId = computed(() => {
+        return `tedi-accordion-content-${this.id()}`;
+    });
+    open() {
+        this.opened.set(true);
+    }
+    close() {
+        this.opened.set(false);
+    }
+    toggle() {
+        this.opened.update((wasOpened) => !wasOpened);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: AccordionItemComponent, isStandalone: true, selector: "tedi-accordion-item", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-accordion-item": "true" } }, ngImport: i0, template: "<tedi-card\n  [selected]=\"selected()\"\n  class=\"tedi-accordion-item__card\"\n  [class.tedi-accordion-item__card--expanded]=\"opened()\"\n>\n  <ng-content></ng-content>\n</tedi-card>\n", styles: [".tedi-accordion-item{--_accordion-columns: minmax(auto, 200px) auto;--_accordion-header-spacing: 8px}.tedi-accordion-item>.tedi-accordion-item__card{display:grid;grid-template-rows:max-content 0fr;transition:grid-template-rows .3s}.tedi-accordion-item>.tedi-accordion-item__card>.tedi-accordion-item-header-host>.tedi-accordion-item-header{border-top-left-radius:var(--_card-radius);border-top-right-radius:var(--_card-radius);border-bottom-right-radius:var(--_card-radius);border-bottom-left-radius:var(--_card-radius)}.tedi-accordion-item>.tedi-accordion-item__card>.tedi-accordion-item-content>.tedi-card-content{border-top:transparent;border-bottom-left-radius:var(--_card-radius);border-bottom-right-radius:var(--_card-radius)}.tedi-accordion-item>.tedi-accordion-item__card--expanded{grid-template-rows:max-content 1fr}.tedi-accordion-item>.tedi-accordion-item__card--expanded>.tedi-accordion-item-header-host>.tedi-accordion-item-header{border-bottom-right-radius:0;border-bottom-left-radius:0}.tedi-accordion-item>.tedi-accordion-item__card--expanded>.tedi-accordion-item-content{animation:accordion-content-overflow-transition;animation-delay:.3s;animation-fill-mode:forwards}.tedi-accordion-item>.tedi-accordion-item__card:has(.tedi-accordion-icon){grid-template-areas:\"accordion-icon-content accordion-header\" \"accordion-icon-fill accordion-content\";grid-template-columns:var(--_accordion-columns)}.tedi-accordion-item>.tedi-accordion-item__card:has(.tedi-accordion-icon)>.tedi-accordion-item-header-host>.tedi-accordion-item-header{grid-area:accordion-header;border-top-left-radius:0;border-bottom-left-radius:0;border-left:transparent}.tedi-accordion-item>.tedi-accordion-item__card:has(.tedi-accordion-icon)>.tedi-accordion-item-content>.tedi-card-content{border-bottom-left-radius:0;border-left:transparent}.tedi-accordion-item>.tedi-accordion-item__card:has(.tedi-accordion-icon)>.tedi-accordion-item-content{grid-area:accordion-content}@keyframes accordion-content-overflow-transition{to{overflow:visible}}\n"], dependencies: [{ kind: "component", type: CardComponent, selector: "tedi-card", inputs: ["borderless", "spacing", "accentBorder", "selected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-accordion-item", standalone: true, imports: [CardComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-accordion-item]": "true",
+                    }, template: "<tedi-card\n  [selected]=\"selected()\"\n  class=\"tedi-accordion-item__card\"\n  [class.tedi-accordion-item__card--expanded]=\"opened()\"\n>\n  <ng-content></ng-content>\n</tedi-card>\n", styles: [".tedi-accordion-item{--_accordion-columns: minmax(auto, 200px) auto;--_accordion-header-spacing: 8px}.tedi-accordion-item>.tedi-accordion-item__card{display:grid;grid-template-rows:max-content 0fr;transition:grid-template-rows .3s}.tedi-accordion-item>.tedi-accordion-item__card>.tedi-accordion-item-header-host>.tedi-accordion-item-header{border-top-left-radius:var(--_card-radius);border-top-right-radius:var(--_card-radius);border-bottom-right-radius:var(--_card-radius);border-bottom-left-radius:var(--_card-radius)}.tedi-accordion-item>.tedi-accordion-item__card>.tedi-accordion-item-content>.tedi-card-content{border-top:transparent;border-bottom-left-radius:var(--_card-radius);border-bottom-right-radius:var(--_card-radius)}.tedi-accordion-item>.tedi-accordion-item__card--expanded{grid-template-rows:max-content 1fr}.tedi-accordion-item>.tedi-accordion-item__card--expanded>.tedi-accordion-item-header-host>.tedi-accordion-item-header{border-bottom-right-radius:0;border-bottom-left-radius:0}.tedi-accordion-item>.tedi-accordion-item__card--expanded>.tedi-accordion-item-content{animation:accordion-content-overflow-transition;animation-delay:.3s;animation-fill-mode:forwards}.tedi-accordion-item>.tedi-accordion-item__card:has(.tedi-accordion-icon){grid-template-areas:\"accordion-icon-content accordion-header\" \"accordion-icon-fill accordion-content\";grid-template-columns:var(--_accordion-columns)}.tedi-accordion-item>.tedi-accordion-item__card:has(.tedi-accordion-icon)>.tedi-accordion-item-header-host>.tedi-accordion-item-header{grid-area:accordion-header;border-top-left-radius:0;border-bottom-left-radius:0;border-left:transparent}.tedi-accordion-item>.tedi-accordion-item__card:has(.tedi-accordion-icon)>.tedi-accordion-item-content>.tedi-card-content{border-bottom-left-radius:0;border-left:transparent}.tedi-accordion-item>.tedi-accordion-item__card:has(.tedi-accordion-icon)>.tedi-accordion-item-content{grid-area:accordion-content}@keyframes accordion-content-overflow-transition{to{overflow:visible}}\n"] }]
+        }] });
+
+class AccordionComponent {
+    /**
+     * id-s of items that should be opened by default.
+     */
+    defaultOpenItems = input();
+    /**
+     * Whether only one accordion item can be opened at once.
+     * @default false
+     */
+    singleOpen = input(false);
+    accordionItems = contentChildren(AccordionItemComponent, {
+        descendants: true,
+    });
+    prevOpens = [];
+    constructor() {
+        effect(() => {
+            const single = this.singleOpen();
+            const items = this.accordionItems();
+            const opens = items.map((it) => it.opened());
+            let newlyOpenedIndex = -1;
+            if (single && items.length > 0) {
+                for (let i = 0; i < opens.length; i++) {
+                    const prev = i < this.prevOpens.length ? this.prevOpens[i] : false;
+                    if (!prev && opens[i]) {
+                        newlyOpenedIndex = i;
+                    }
+                }
+                if (newlyOpenedIndex >= 0) {
+                    for (let i = 0; i < items.length; i++) {
+                        if (i !== newlyOpenedIndex && items[i].opened()) {
+                            items[i].close();
+                        }
+                    }
+                }
+            }
+            this.prevOpens = opens;
+        });
+    }
+    openDefaultOpenItems() {
+        const defaultOpenItems = this.defaultOpenItems();
+        this.accordionItems().forEach((item) => {
+            if (defaultOpenItems?.includes(item.id())) {
+                item.open();
+            }
+        });
+    }
+    ngOnInit() {
+        this.openDefaultOpenItems();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.15", type: AccordionComponent, isStandalone: true, selector: "tedi-accordion", inputs: { defaultOpenItems: { classPropertyName: "defaultOpenItems", publicName: "defaultOpenItems", isSignal: true, isRequired: false, transformFunction: null }, singleOpen: { classPropertyName: "singleOpen", publicName: "singleOpen", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "accordionItems", predicate: AccordionItemComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:contents}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-accordion", standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n", styles: [":host{display:contents}\n"] }]
+        }], ctorParameters: () => [] });
+
+class AccordionIconComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: AccordionIconComponent, isStandalone: true, selector: "tedi-accordion-icon", host: { properties: { "class.tedi-accordion-icon": "true" } }, hostDirectives: [{ directive: CardColorsDirective, inputs: ["background", "background"] }], ngImport: i0, template: "<div class=\"tedi-accordion-icon__content\"><ng-content></ng-content></div>\n<div class=\"tedi-accordion-icon__fill\"></div>\n", styles: [".tedi-accordion-icon{display:contents;--_card-bg: var(--card-background-secondary)}.tedi-accordion-icon__content{display:block;padding:var(--_card-padding-top) var(--_card-padding-right) var(--_card-padding-bottom) var(--_card-padding-left);grid-area:accordion-icon-content;background-color:var(--_card-bg);border:1px solid var(--_card-border);border-bottom:transparent;border-top-left-radius:var(--_card-radius);border-bottom-left-radius:var(--_card-radius)}.tedi-accordion-icon__fill{display:block;grid-area:accordion-icon-fill;background-color:var(--_card-bg);border:1px solid var(--_card-border);border-top:transparent;border-bottom-left-radius:var(--_card-radius);margin-top:-4px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionIconComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: "tedi-accordion-icon", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-accordion-icon]": "true",
+                    }, hostDirectives: [
+                        {
+                            directive: CardColorsDirective,
+                            inputs: ["background"],
+                        },
+                    ], template: "<div class=\"tedi-accordion-icon__content\"><ng-content></ng-content></div>\n<div class=\"tedi-accordion-icon__fill\"></div>\n", styles: [".tedi-accordion-icon{display:contents;--_card-bg: var(--card-background-secondary)}.tedi-accordion-icon__content{display:block;padding:var(--_card-padding-top) var(--_card-padding-right) var(--_card-padding-bottom) var(--_card-padding-left);grid-area:accordion-icon-content;background-color:var(--_card-bg);border:1px solid var(--_card-border);border-bottom:transparent;border-top-left-radius:var(--_card-radius);border-bottom-left-radius:var(--_card-radius)}.tedi-accordion-icon__fill{display:block;grid-area:accordion-icon-fill;background-color:var(--_card-bg);border:1px solid var(--_card-border);border-top:transparent;border-bottom-left-radius:var(--_card-radius);margin-top:-4px}\n"] }]
+        }] });
+
+class CardContentComponent {
+    /**
+     * Whether content block should have separator.
+     * Inside card the separator is created under the content, inside card row the separator is created to the right of content.
+     * @default false
+     */
+    hasSeparator = input(false, { transform: booleanAttribute });
+    /**
+     * Whether content block should take minimal space inside of row.
+     * Sets flex-grow to 0.
+     * @default false
+     */
+    autoWidth = input(false, { transform: booleanAttribute });
+    /**
+     * Creates a timeline line next to the content block.
+     * @default false
+     */
+    timeline = input(false, { transform: booleanAttribute });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: CardContentComponent, isStandalone: true, selector: "tedi-card-content", inputs: { hasSeparator: { classPropertyName: "hasSeparator", publicName: "hasSeparator", isSignal: true, isRequired: false, transformFunction: null }, autoWidth: { classPropertyName: "autoWidth", publicName: "autoWidth", isSignal: true, isRequired: false, transformFunction: null }, timeline: { classPropertyName: "timeline", publicName: "timeline", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-card-content": "true", "class.tedi-card-content--has-separator": "hasSeparator() || timeline()", "class.tedi-card-content--auto-width": "autoWidth()", "class.tedi-card-content--timeline": "timeline()" } }, hostDirectives: [{ directive: CardColorsDirective, inputs: ["background", "background", "border", "border"] }, { directive: CardPaddingDirective, inputs: ["padding", "padding"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".tedi-card-content{--_card-padding-vertical: var(--_card-padding);--_card-padding-horizontal: var(--_card-padding);--_card-padding-top: var(--_card-padding-vertical);--_card-padding-bottom: var(--_card-padding-vertical);--_card-padding-left: var(--_card-padding-horizontal);--_card-padding-right: var(--_card-padding-horizontal);display:block;background-color:var(--_card-bg);border:1px solid var(--_card-border);padding:var(--_card-padding-top) var(--_card-padding-right) var(--_card-padding-bottom) var(--_card-padding-left);flex:1 1 0}.tedi-card-content--auto-width{flex-grow:0}.tedi-card-content--timeline{position:relative;border-right:1px solid var(--_card-timeline-color)}.tedi-card-content--timeline:after{content:\"\";display:block;background-color:var(--_card-timeline-color);position:absolute;top:22px;right:-.5px;transform:translate(50%);width:9px;height:9px;border-radius:50%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardContentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-card-content", standalone: true, imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-card-content]": "true",
+                        "[class.tedi-card-content--has-separator]": "hasSeparator() || timeline()",
+                        "[class.tedi-card-content--auto-width]": "autoWidth()",
+                        "[class.tedi-card-content--timeline]": "timeline()",
+                    }, hostDirectives: [
+                        {
+                            directive: CardColorsDirective,
+                            inputs: ["background", "border"],
+                        },
+                        {
+                            directive: CardPaddingDirective,
+                            inputs: ["padding"],
+                        },
+                    ], template: "<ng-content></ng-content>\n", styles: [".tedi-card-content{--_card-padding-vertical: var(--_card-padding);--_card-padding-horizontal: var(--_card-padding);--_card-padding-top: var(--_card-padding-vertical);--_card-padding-bottom: var(--_card-padding-vertical);--_card-padding-left: var(--_card-padding-horizontal);--_card-padding-right: var(--_card-padding-horizontal);display:block;background-color:var(--_card-bg);border:1px solid var(--_card-border);padding:var(--_card-padding-top) var(--_card-padding-right) var(--_card-padding-bottom) var(--_card-padding-left);flex:1 1 0}.tedi-card-content--auto-width{flex-grow:0}.tedi-card-content--timeline{position:relative;border-right:1px solid var(--_card-timeline-color)}.tedi-card-content--timeline:after{content:\"\";display:block;background-color:var(--_card-timeline-color);position:absolute;top:22px;right:-.5px;transform:translate(50%);width:9px;height:9px;border-radius:50%}\n"] }]
+        }] });
+
+class AccordionItemContentComponent {
+    background = input();
+    accordionItem = inject(AccordionItemComponent);
+    headerId = this.accordionItem.headerId;
+    contentId = this.accordionItem.contentId;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionItemContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: AccordionItemContentComponent, isStandalone: true, selector: "tedi-accordion-item-content", inputs: { background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-accordion-item-content": "true" } }, ngImport: i0, template: "<tedi-card-content\n  [background]=\"background()\"\n  [id]=\"contentId()\"\n  role=\"region\"\n  [attr.aria-labelledby]=\"headerId()\"\n>\n  <ng-content></ng-content>\n</tedi-card-content>\n", styles: [".tedi-accordion-item-content{display:block;overflow:hidden}\n"], dependencies: [{ kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["hasSeparator", "autoWidth", "timeline"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionItemContentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-accordion-item-content", standalone: true, imports: [CardContentComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-accordion-item-content]": "true",
+                    }, template: "<tedi-card-content\n  [background]=\"background()\"\n  [id]=\"contentId()\"\n  role=\"region\"\n  [attr.aria-labelledby]=\"headerId()\"\n>\n  <ng-content></ng-content>\n</tedi-card-content>\n", styles: [".tedi-accordion-item-content{display:block;overflow:hidden}\n"] }]
+        }] });
+
+class CardHeaderComponent {
+    /**
+     * Variant of the card header.
+     */
+    variant = input();
+    modifierClasses = computed(() => {
+        return `tedi-card-header--${this.variant()}`;
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: CardHeaderComponent, isStandalone: true, selector: "tedi-card-header, [tedi-card-header]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-card-header": "true", "class": "modifierClasses()" } }, hostDirectives: [{ directive: CardColorsDirective, inputs: ["background", "background"] }, { directive: CardPaddingDirective, inputs: ["padding", "padding"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".tedi-card-header{border:1px solid var(--_card-border);background:var(--_card-bg);padding:var(--_card-padding-top) var(--_card-padding-right) var(--_card-padding-bottom) var(--_card-padding-left)}.tedi-card-header--primary{--_card-bg: var(--card-background-primary);--_card-border: var(--card-border-primary)}.tedi-card-header--secondary{--_card-bg: var(--card-background-secondary);--_card-border: var(--card-border-primary)}.tedi-card-header--tertiary{--_card-bg: var(--card-background-tertiary);--_card-border: var(--card-border-primary)}.tedi-card-header--brand{--_card-bg: linear-gradient(140deg, #005295 -17.66%, #1769ab 71.2%);--_card-border: transparent}.tedi-card-header--brand-dark{--_card-bg: var(--card-background-brand-secondary);--_card-border: transparent}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-card-header, [tedi-card-header]", standalone: true, imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-card-header]": "true",
+                        "[class]": "modifierClasses()",
+                    }, hostDirectives: [
+                        {
+                            directive: CardColorsDirective,
+                            inputs: ["background"],
+                        },
+                        {
+                            directive: CardPaddingDirective,
+                            inputs: ["padding"],
+                        },
+                    ], template: "<ng-content></ng-content>\n", styles: [".tedi-card-header{border:1px solid var(--_card-border);background:var(--_card-bg);padding:var(--_card-padding-top) var(--_card-padding-right) var(--_card-padding-bottom) var(--_card-padding-left)}.tedi-card-header--primary{--_card-bg: var(--card-background-primary);--_card-border: var(--card-border-primary)}.tedi-card-header--secondary{--_card-bg: var(--card-background-secondary);--_card-border: var(--card-border-primary)}.tedi-card-header--tertiary{--_card-bg: var(--card-background-tertiary);--_card-border: var(--card-border-primary)}.tedi-card-header--brand{--_card-bg: linear-gradient(140deg, #005295 -17.66%, #1769ab 71.2%);--_card-border: transparent}.tedi-card-header--brand-dark{--_card-bg: var(--card-background-brand-secondary);--_card-border: transparent}\n"] }]
+        }] });
+
+const WHITE_ICON_VARIANTS = ["brand", "brand-dark"];
+class AccordionItemHeaderComponent {
+    /**
+     * Whether accordion header should have indicator arrow
+     * @default false
+     */
+    indicator = input(false);
+    /**
+     * Open button text. Visible if both openText and closeText are provided.
+     */
+    openText = input();
+    /**
+     * Close button text. Visible if both openText and closeText are provided.
+     */
+    closeText = input();
+    /**
+     * Accordion header variant
+     */
+    variant = input();
+    /**
+     * Accordion header background
+     */
+    background = input();
+    /**
+     * Color of the indicator arrow
+     */
+    indicatorColor = input();
+    accordionItem = inject(AccordionItemComponent);
+    opened = this.accordionItem.opened;
+    headerId = this.accordionItem.headerId;
+    contentId = this.accordionItem.contentId;
+    toggleButtonText = computed(() => {
+        if (this.openText() && this.closeText()) {
+            return this.opened() ? this.closeText() : this.openText();
+        }
+        return;
+    });
+    indicatorIconColor = computed(() => {
+        if (this.indicatorColor()) {
+            return this.indicatorColor();
+        }
+        return WHITE_ICON_VARIANTS.includes(this.variant())
+            ? "white"
+            : "brand";
+    });
+    toggle() {
+        this.accordionItem.toggle();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionItemHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: AccordionItemHeaderComponent, isStandalone: true, selector: "tedi-accordion-item-header", inputs: { indicator: { classPropertyName: "indicator", publicName: "indicator", 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 }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, indicatorColor: { classPropertyName: "indicatorColor", publicName: "indicatorColor", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-accordion-item-header-host": "true" } }, ngImport: i0, template: "<button\n  [id]=\"headerId()\"\n  tedi-card-header\n  [variant]=\"variant()\"\n  [background]=\"background()\"\n  class=\"tedi-accordion-item-header\"\n  [class.tedi-accordion-item-header--opened]=\"opened()\"\n  [attr.aria-expanded]=\"opened()\"\n  [attr.aria-controls]=\"contentId()\"\n  (click)=\"toggle()\"\n>\n  <ng-content></ng-content>\n  @if (indicator()) {\n    <tedi-icon\n      name=\"keyboard_arrow_down\"\n      class=\"tedi-accordion-item-header__indicator\"\n      [size]=\"18\"\n      [color]=\"indicatorIconColor()\"\n    />\n  }\n  @if (toggleButtonText()) {\n    <span\n      tedi-button\n      variant=\"neutral\"\n      class=\"tedi-accordion-item-header__toggle\"\n    >\n      {{ toggleButtonText() }}\n      <tedi-icon\n        name=\"keyboard_arrow_down\"\n        class=\"tedi-accordion-item-header__indicator\"\n        [size]=\"16\"\n        color=\"brand\"\n      />\n    </span>\n  }\n  <ng-content select=\"[tedi-accordion-header-end]\"></ng-content>\n</button>\n", styles: [".tedi-accordion-item-header-host{display:contents}.tedi-accordion-item-header{cursor:pointer;font-size:inherit;display:flex;gap:var(--_accordion-header-spacing);align-items:center;justify-content:space-between}.tedi-accordion-item-header [tedi-accordion-header-end]{margin-left:auto}.tedi-accordion-item-header__indicator{transition:transform .3s}.tedi-accordion-item-header .tedi-accordion-item-header__toggle{--_btn-padding-y: 0}.tedi-accordion-item-header--opened>.tedi-accordion-item-header__indicator,.tedi-accordion-item-header--opened>.tedi-accordion-item-header__toggle>.tedi-accordion-item-header__indicator{transform:rotateX(180deg)}\n"], dependencies: [{ kind: "component", type: CardHeaderComponent, selector: "tedi-card-header, [tedi-card-header]", inputs: ["variant"] }, { 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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AccordionItemHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-accordion-item-header", standalone: true, imports: [CardHeaderComponent, IconComponent, ButtonComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-accordion-item-header-host]": "true",
+                    }, template: "<button\n  [id]=\"headerId()\"\n  tedi-card-header\n  [variant]=\"variant()\"\n  [background]=\"background()\"\n  class=\"tedi-accordion-item-header\"\n  [class.tedi-accordion-item-header--opened]=\"opened()\"\n  [attr.aria-expanded]=\"opened()\"\n  [attr.aria-controls]=\"contentId()\"\n  (click)=\"toggle()\"\n>\n  <ng-content></ng-content>\n  @if (indicator()) {\n    <tedi-icon\n      name=\"keyboard_arrow_down\"\n      class=\"tedi-accordion-item-header__indicator\"\n      [size]=\"18\"\n      [color]=\"indicatorIconColor()\"\n    />\n  }\n  @if (toggleButtonText()) {\n    <span\n      tedi-button\n      variant=\"neutral\"\n      class=\"tedi-accordion-item-header__toggle\"\n    >\n      {{ toggleButtonText() }}\n      <tedi-icon\n        name=\"keyboard_arrow_down\"\n        class=\"tedi-accordion-item-header__indicator\"\n        [size]=\"16\"\n        color=\"brand\"\n      />\n    </span>\n  }\n  <ng-content select=\"[tedi-accordion-header-end]\"></ng-content>\n</button>\n", styles: [".tedi-accordion-item-header-host{display:contents}.tedi-accordion-item-header{cursor:pointer;font-size:inherit;display:flex;gap:var(--_accordion-header-spacing);align-items:center;justify-content:space-between}.tedi-accordion-item-header [tedi-accordion-header-end]{margin-left:auto}.tedi-accordion-item-header__indicator{transition:transform .3s}.tedi-accordion-item-header .tedi-accordion-item-header__toggle{--_btn-padding-y: 0}.tedi-accordion-item-header--opened>.tedi-accordion-item-header__indicator,.tedi-accordion-item-header--opened>.tedi-accordion-item-header__toggle>.tedi-accordion-item-header__indicator{transform:rotateX(180deg)}\n"] }]
+        }] });
+
+class CardRowComponent {
+    /**
+     * Whether row should have separator under it.
+     * @default false
+     */
+    hasSeparator = input(false, { transform: booleanAttribute });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: CardRowComponent, isStandalone: true, selector: "tedi-card-row", inputs: { hasSeparator: { classPropertyName: "hasSeparator", publicName: "hasSeparator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-card-row": "true", "class.tedi-card-row--has-separator": "hasSeparator()" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".tedi-card-row{display:flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CardRowComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-card-row", standalone: true, imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-card-row]": "true",
+                        "[class.tedi-card-row--has-separator]": "hasSeparator()",
+                    }, template: "<ng-content></ng-content>\n", styles: [".tedi-card-row{display:flex}\n"] }]
+        }] });
+
+class ChoiceGroupDirective {
+    /*
+     * Variant of the cards in group.
+     */
+    variant = input("primary");
+    /*
+     * Whether choicegroup card has indicator
+     */
+    hasIndicator = input(true);
+    /*
+     * Spacing between radios. unit: px.
+     * @default 4
+     */
+    spacing = input(4);
+    modifierClasses = computed(() => {
+        return `tedi-choicegroup--${this.variant()}`;
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ChoiceGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: ChoiceGroupDirective, isStandalone: true, inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, hasIndicator: { classPropertyName: "hasIndicator", publicName: "hasIndicator", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-choicegroup": "true", "class.tedi-choicegroup--stacked": "spacing() === 0", "class.tedi-choicegroup--plain": "!hasIndicator()", "class": "modifierClasses()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ChoiceGroupDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    host: {
+                        "[class.tedi-choicegroup]": "true",
+                        "[class.tedi-choicegroup--stacked]": "spacing() === 0",
+                        "[class.tedi-choicegroup--plain]": "!hasIndicator()",
+                        "[class]": "modifierClasses()",
+                    },
+                }]
+        }] });
+
+class CheckboxGroupComponent {
+    /**
+     * Checkbox group label.
+     */
+    label = input();
+    /*
+     * Whether checkbox group is disabled
+     */
+    disabled = input();
+    /*
+     * Whether checkbox group has error.
+     */
+    hasError = input();
+    /*
+     * Size of the checkboxes in group.
+     */
+    size = input();
+    /*
+     * Direction in which checkboxes flow.
+     */
+    direction = input("column");
+    /*
+     * Spacing between checkboxes. unit: px.
+     * @default 4
+     */
+    spacing = input(4);
+    /**
+     * FeedbackText component inputs.
+     */
+    feedbackText = input();
+    labelId = computed(() => {
+        if (this.label()) {
+            return generateUUID();
+        }
+        return;
+    });
+    groupDisabled = computed(() => this.disabled());
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CheckboxGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: CheckboxGroupComponent, isStandalone: true, selector: "tedi-checkbox-group", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-checkbox-group": "true", "attr.role": "'group'", "attr.aria-labelledby": "labelId()" } }, ngImport: i0, template: "@if (label()) {\n  <span tedi-label [id]=\"labelId()\">\n    {{ label() }}\n  </span>\n}\n<div\n  class=\"tedi-checkbox-group__checkboxes\"\n  [style.flex-direction]=\"direction()\"\n  [style.gap]=\"spacing() + 'px'\"\n>\n  <ng-content />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-checkbox-group{display:block}.tedi-checkbox-group__checkboxes{display:flex;flex-wrap:wrap}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CheckboxGroupComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: "tedi-checkbox-group", imports: [FeedbackTextComponent, LabelComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-checkbox-group]": "true",
+                        "[attr.role]": "'group'",
+                        "[attr.aria-labelledby]": "labelId()",
+                    }, template: "@if (label()) {\n  <span tedi-label [id]=\"labelId()\">\n    {{ label() }}\n  </span>\n}\n<div\n  class=\"tedi-checkbox-group__checkboxes\"\n  [style.flex-direction]=\"direction()\"\n  [style.gap]=\"spacing() + 'px'\"\n>\n  <ng-content />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-checkbox-group{display:block}.tedi-checkbox-group__checkboxes{display:flex;flex-wrap:wrap}\n"] }]
+        }] });
+
+class CheckboxCardGroupComponent extends CheckboxGroupComponent {
+    /*
+     * Direction in which checkboxes flow.
+     */
+    direction = input("row");
+    /*
+     * Value of card group. Do not use with controlled card group.
+     */
+    value = model([]);
+    checkboxes = contentChildren(forwardRef(() => CheckboxComponent), {
+        descendants: true,
+    });
+    _controlDisabled = signal(false);
+    _onChange = () => { };
+    _onTouched = () => { };
+    groupDisabled = computed(() => {
+        return this.disabled() || this._controlDisabled();
+    });
+    writeValue(value) {
+        this.value.set(value);
+        this.updateCheckboxesState();
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this._controlDisabled.set(isDisabled);
+    }
+    updateCheckboxesState() {
+        const value = this.value();
+        this.checkboxes().forEach((checkbox) => {
+            const checked = value?.includes(checkbox.value());
+            checkbox.checked.set(checked);
+        });
+    }
+    onCheckboxChange(checked, value) {
+        this.value.update((checkedItems) => {
+            if (checked) {
+                return [...checkedItems, value];
+            }
+            else {
+                return checkedItems.filter((item) => item !== value);
+            }
+        });
+        this._onChange(this.value());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CheckboxCardGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: CheckboxCardGroupComponent, isStandalone: true, selector: "tedi-checkbox-card-group", inputs: { direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => CheckboxCardGroupComponent),
+                multi: true,
+            },
+            {
+                provide: CheckboxGroupComponent,
+                useExisting: CheckboxCardGroupComponent,
+            },
+        ], queries: [{ propertyName: "checkboxes", predicate: i0.forwardRef(() => CheckboxComponent), descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: ChoiceGroupDirective, inputs: ["variant", "variant", "hasIndicator", "hasIndicator", "spacing", "spacing"] }], ngImport: i0, template: "@if (label()) {\n  <span tedi-label [id]=\"labelId()\">\n    {{ label() }}\n  </span>\n}\n<div\n  class=\"tedi-checkbox-group__checkboxes\"\n  [style.flex-direction]=\"direction()\"\n  [style.gap]=\"spacing() + 'px'\"\n>\n  <ng-content />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{position:relative;background-color:var(--_choicegroup-card-bg);border:1px solid var(--_choicegroup-card-border);border-radius:var(--_choicegroup-card-radius);padding:var(--_choicegroup-card-padding);--_choicegroup-card-padding-top: var(--_choicegroup-card-padding-vertical);--_choicegroup-card-padding-bottom: var(--_choicegroup-card-padding-vertical);--_choicegroup-card-padding-left: var(--_choicegroup-card-padding-horizontal);--_choicegroup-card-padding-right: var( --_choicegroup-card-padding-horizontal );--_choicegroup-card-padding: var(--_choicegroup-card-padding-top) var(--_choicegroup-card-padding-right) var(--_choicegroup-card-padding-bottom) var(--_choicegroup-card-padding-left)}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-desktop)}}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-desktop)}}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-desktop)}}.tedi-choicegroup .tedi-radio__input-area,.tedi-choicegroup .tedi-checkbox__input-area{position:static}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-inactive-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-inactive-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-inactive-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-active-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-active-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-active-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-hover-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-hover-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-hover-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-disabled-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-disabled-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-disabled-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-inactive-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-active-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-hover-border )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-disabled-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio--error,.tedi-checkbox--error){--_choicegroup-card-bg: var(--form-checkbox-radio-default-background-error);--_choicegroup-card-border: var(--form-general-feedback-error-border)}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_radio-bg: transparent;--_checkbox-bg: transparent;--_radio-border: var( --form-checkbox-radio-default-border-selected-inverted );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-inverted )}.tedi-choicegroup--primary .tedi-checkbox:has(input:active){--_checkbox-border: var( --form-checkbox-radio-default-border-selected-inverted )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-inactive-border-group )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-active-border-group )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-hover-border )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-disabled-border-group )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-inactive-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-inactive-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-inactive-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-active-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-active-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-active-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-hover-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-hover-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-hover-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-disabled-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-disabled-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-disabled-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-inactive-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-active-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-hover-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-disabled-border )}.tedi-choicegroup--secondary :is(.tedi-radio--error,.tedi-checkbox--error){--_choicegroup-card-bg: var(--form-checkbox-radio-default-background-error);--_choicegroup-card-border: var(--form-general-feedback-error-border)}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){outline:1px solid var(--_choicegroup-card-border);outline-offset:-2px}.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible) .tedi-radio__indicator,.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible) .tedi-checkbox__indicator{outline:none}.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible){outline:2px solid var(--form-input-border-active);outline-offset:1px}.tedi-choicegroup--plain .tedi-radio__indicator,.tedi-choicegroup--plain .tedi-checkbox__indicator{display:none}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0;margin-right:-1px}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:checked){z-index:1}\n", ".tedi-checkbox-group{display:block}.tedi-checkbox-group__checkboxes{display:flex;flex-wrap:wrap}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CheckboxCardGroupComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: "tedi-checkbox-card-group", imports: [FeedbackTextComponent, LabelComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => CheckboxCardGroupComponent),
+                            multi: true,
+                        },
+                        {
+                            provide: CheckboxGroupComponent,
+                            useExisting: CheckboxCardGroupComponent,
+                        },
+                    ], hostDirectives: [
+                        {
+                            directive: ChoiceGroupDirective,
+                            inputs: ["variant", "hasIndicator", "spacing"],
+                        },
+                    ], template: "@if (label()) {\n  <span tedi-label [id]=\"labelId()\">\n    {{ label() }}\n  </span>\n}\n<div\n  class=\"tedi-checkbox-group__checkboxes\"\n  [style.flex-direction]=\"direction()\"\n  [style.gap]=\"spacing() + 'px'\"\n>\n  <ng-content />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{position:relative;background-color:var(--_choicegroup-card-bg);border:1px solid var(--_choicegroup-card-border);border-radius:var(--_choicegroup-card-radius);padding:var(--_choicegroup-card-padding);--_choicegroup-card-padding-top: var(--_choicegroup-card-padding-vertical);--_choicegroup-card-padding-bottom: var(--_choicegroup-card-padding-vertical);--_choicegroup-card-padding-left: var(--_choicegroup-card-padding-horizontal);--_choicegroup-card-padding-right: var( --_choicegroup-card-padding-horizontal );--_choicegroup-card-padding: var(--_choicegroup-card-padding-top) var(--_choicegroup-card-padding-right) var(--_choicegroup-card-padding-bottom) var(--_choicegroup-card-padding-left)}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-desktop)}}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-desktop)}}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-desktop)}}.tedi-choicegroup .tedi-radio__input-area,.tedi-choicegroup .tedi-checkbox__input-area{position:static}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-inactive-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-inactive-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-inactive-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-active-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-active-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-active-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-hover-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-hover-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-hover-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-disabled-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-disabled-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-disabled-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-inactive-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-active-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-hover-border )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-disabled-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio--error,.tedi-checkbox--error){--_choicegroup-card-bg: var(--form-checkbox-radio-default-background-error);--_choicegroup-card-border: var(--form-general-feedback-error-border)}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_radio-bg: transparent;--_checkbox-bg: transparent;--_radio-border: var( --form-checkbox-radio-default-border-selected-inverted );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-inverted )}.tedi-choicegroup--primary .tedi-checkbox:has(input:active){--_checkbox-border: var( --form-checkbox-radio-default-border-selected-inverted )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-inactive-border-group )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-active-border-group )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-hover-border )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-disabled-border-group )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-inactive-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-inactive-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-inactive-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-active-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-active-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-active-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-hover-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-hover-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-hover-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-disabled-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-disabled-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-disabled-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-inactive-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-active-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-hover-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-disabled-border )}.tedi-choicegroup--secondary :is(.tedi-radio--error,.tedi-checkbox--error){--_choicegroup-card-bg: var(--form-checkbox-radio-default-background-error);--_choicegroup-card-border: var(--form-general-feedback-error-border)}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){outline:1px solid var(--_choicegroup-card-border);outline-offset:-2px}.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible) .tedi-radio__indicator,.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible) .tedi-checkbox__indicator{outline:none}.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible){outline:2px solid var(--form-input-border-active);outline-offset:1px}.tedi-choicegroup--plain .tedi-radio__indicator,.tedi-choicegroup--plain .tedi-checkbox__indicator{display:none}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0;margin-right:-1px}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:checked){z-index:1}\n", ".tedi-checkbox-group{display:block}.tedi-checkbox-group__checkboxes{display:flex;flex-wrap:wrap}\n"] }]
+        }] });
+
+class CheckboxComponent {
+    /*
+     * unique id.
+     */
+    inputId = input.required();
+    /*
+     * Whether checkbox is checked. Do not used with controlled checkboxes.
+     */
+    checked = model(null);
+    /*
+     * Whether checkbox is indeterminate.
+     */
+    indeterminate = input();
+    /*
+     * Checkbox value. For use in checkbox card group
+     */
+    value = input();
+    /*
+     * Whether checkbox is disabled.
+     */
+    disabled = model();
+    /*
+     * Size of the checkbox. Overwrites group size.
+     */
+    size = input();
+    /*
+     * Whether checkbox has error.
+     */
+    hasError = input();
+    /**
+     * FeedbackText component inputs.
+     */
+    feedbackText = input();
+    _inputEl = viewChild.required("input");
+    checkboxGroup = inject(CheckboxGroupComponent, { optional: true });
+    checkboxCardGroup = inject(CheckboxCardGroupComponent, {
+        optional: true,
+    });
+    _onChange = () => { };
+    _onTouched = () => { };
+    feedbackTextId = computed(() => {
+        if (this.feedbackText()) {
+            return generateUUID();
+        }
+        return;
+    });
+    indicatorIcon = computed(() => {
+        if (this.indeterminate()) {
+            return "remove";
+        }
+        if (this.checked()) {
+            return "check";
+        }
+        return;
+    });
+    checkboxSize = computed(() => {
+        return this.size() ?? this.checkboxGroup?.size();
+    });
+    iconSize = computed(() => {
+        return this.checkboxSize() === "large" ? 18 : 16;
+    });
+    checkboxDisabled = computed(() => {
+        return this.disabled() || this.checkboxGroup?.groupDisabled();
+    });
+    focus() {
+        this._inputEl().nativeElement.focus();
+    }
+    writeValue(value) {
+        this.checked.set(value);
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled.set(isDisabled);
+    }
+    onInputChange(event) {
+        const checked = event.target.checked;
+        this._onChange(checked);
+        this.checked.set(checked);
+        this.checkboxCardGroup?.onCheckboxChange(checked, this.value());
+    }
+    ngOnInit() {
+        if (this.checked()) {
+            this._onChange(true);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: CheckboxComponent, isStandalone: true, selector: "tedi-checkbox", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", 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 }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", disabled: "disabledChange" }, host: { properties: { "class.tedi-checkbox": "true", "class.tedi-checkbox--error": "hasError() || cardGroup?.hasError()", "class.tedi-checkbox--large": "checkboxSize() === 'large'" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => CheckboxComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "_inputEl", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"tedi-checkbox__input-area\">\n  <input\n    class=\"tedi-checkbox__input\"\n    type=\"checkbox\"\n    #input\n    [id]=\"inputId()\"\n    [checked]=\"checked()\"\n    [disabled]=\"checkboxDisabled()\"\n    [attr.aria-describedby]=\"feedbackTextId()\"\n    [indeterminate]=\"indeterminate()\"\n    (change)=\"onInputChange($event)\"\n    (blur)=\"_onTouched()\"\n  />\n  <div class=\"tedi-checkbox__indicator\">\n    @if (indicatorIcon(); as iconName) {\n      <tedi-icon [name]=\"iconName\" color=\"white\" [size]=\"iconSize()\" />\n    }\n  </div>\n</div>\n<label [for]=\"inputId()\" class=\"tedi-checkbox__label\">\n  <ng-content></ng-content>\n</label>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [id]=\"feedbackTextId()\"\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-checkbox{--_checkbox-bg: var(--form-checkbox-radio-default-background-default);--_checkbox-border: var(--form-checkbox-radio-default-border-default);--_checkbox-label-color: var(--general-text-primary);--_checkbox-check-color: var(--_checkbox-border);display:grid;grid-template-areas:\"input-area label\" \". feedback\";grid-template-columns:auto 1fr;align-items:center}.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-desktop)}}.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-desktop)}}.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-desktop)}}.tedi-checkbox{--_label-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-checkbox{--_label-size: var(--body-regular-size-desktop)}}.tedi-checkbox tedi-icon{-webkit-user-select:none;user-select:none}.tedi-checkbox__input-area{position:relative;grid-area:input-area}.tedi-checkbox__input{position:absolute;top:0;left:0;height:100%;width:100%;margin:0;padding:0;opacity:0;z-index:1}.tedi-checkbox__indicator{position:relative;width:var(--_checkbox-size);height:var(--_checkbox-size);border-radius:var(--_checkbox-radius);border:1px solid var(--_checkbox-border);background:var(--_checkbox-bg);margin-right:var(--_checkbox-inner-spacing);display:flex;align-items:center;justify-content:center}.tedi-checkbox__label{color:var(--_checkbox-label-color);font-size:var(--_label-size);grid-area:label}.tedi-checkbox__label{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-checkbox__label{font-family:var(--family-primary-desktop)}}.tedi-checkbox:has(input:checked){--_checkbox-bg: var(--form-checkbox-radio-default-background-selected);--_checkbox-border: var(--form-checkbox-radio-default-border-selected)}.tedi-checkbox:has(input:hover,input:focus-visible) .tedi-checkbox__indicator{outline:1px solid var(--_checkbox-border)}.tedi-checkbox:has(input:hover,input:focus-visible){--_checkbox-border: var(--form-checkbox-radio-default-border-hover)}.tedi-checkbox:has(input:active){--_checkbox-border: var(--form-checkbox-radio-default-border-active);--_checkbox-bg: var(--form-checkbox-radio-default-background-active)}.tedi-checkbox:has(input:disabled){pointer-events:none;--_checkbox-label-color: var(--general-text-disabled);--_checkbox-bg: var(--form-input-background-disabled);--_checkbox-border: var(--form-input-border-disabled)}.tedi-checkbox:has(input:disabled:checked){--_checkbox-bg: var( --form-checkbox-radio-default-background-selected-disabled );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-disabled )}.tedi-checkbox--error{--_checkbox-bg: var(--form-checkbox-radio-default-background-error);--_checkbox-border: var(--form-general-feedback-error-border)}.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-mobile)}@media (min-width: 576px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-tablet)}}@media (min-width: 992px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-desktop)}}.tedi-checkbox .tedi-feedback-text{grid-area:feedback}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { 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: "19.2.15", ngImport: i0, type: CheckboxComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: "tedi-checkbox", imports: [FeedbackTextComponent, IconComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => CheckboxComponent),
+                            multi: true,
+                        },
+                    ], host: {
+                        "[class.tedi-checkbox]": "true",
+                        "[class.tedi-checkbox--error]": "hasError() || cardGroup?.hasError()",
+                        "[class.tedi-checkbox--large]": "checkboxSize() === 'large'",
+                    }, template: "<div class=\"tedi-checkbox__input-area\">\n  <input\n    class=\"tedi-checkbox__input\"\n    type=\"checkbox\"\n    #input\n    [id]=\"inputId()\"\n    [checked]=\"checked()\"\n    [disabled]=\"checkboxDisabled()\"\n    [attr.aria-describedby]=\"feedbackTextId()\"\n    [indeterminate]=\"indeterminate()\"\n    (change)=\"onInputChange($event)\"\n    (blur)=\"_onTouched()\"\n  />\n  <div class=\"tedi-checkbox__indicator\">\n    @if (indicatorIcon(); as iconName) {\n      <tedi-icon [name]=\"iconName\" color=\"white\" [size]=\"iconSize()\" />\n    }\n  </div>\n</div>\n<label [for]=\"inputId()\" class=\"tedi-checkbox__label\">\n  <ng-content></ng-content>\n</label>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [id]=\"feedbackTextId()\"\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-checkbox{--_checkbox-bg: var(--form-checkbox-radio-default-background-default);--_checkbox-border: var(--form-checkbox-radio-default-border-default);--_checkbox-label-color: var(--general-text-primary);--_checkbox-check-color: var(--_checkbox-border);display:grid;grid-template-areas:\"input-area label\" \". feedback\";grid-template-columns:auto 1fr;align-items:center}.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-desktop)}}.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-desktop)}}.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-desktop)}}.tedi-checkbox{--_label-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-checkbox{--_label-size: var(--body-regular-size-desktop)}}.tedi-checkbox tedi-icon{-webkit-user-select:none;user-select:none}.tedi-checkbox__input-area{position:relative;grid-area:input-area}.tedi-checkbox__input{position:absolute;top:0;left:0;height:100%;width:100%;margin:0;padding:0;opacity:0;z-index:1}.tedi-checkbox__indicator{position:relative;width:var(--_checkbox-size);height:var(--_checkbox-size);border-radius:var(--_checkbox-radius);border:1px solid var(--_checkbox-border);background:var(--_checkbox-bg);margin-right:var(--_checkbox-inner-spacing);display:flex;align-items:center;justify-content:center}.tedi-checkbox__label{color:var(--_checkbox-label-color);font-size:var(--_label-size);grid-area:label}.tedi-checkbox__label{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-checkbox__label{font-family:var(--family-primary-desktop)}}.tedi-checkbox:has(input:checked){--_checkbox-bg: var(--form-checkbox-radio-default-background-selected);--_checkbox-border: var(--form-checkbox-radio-default-border-selected)}.tedi-checkbox:has(input:hover,input:focus-visible) .tedi-checkbox__indicator{outline:1px solid var(--_checkbox-border)}.tedi-checkbox:has(input:hover,input:focus-visible){--_checkbox-border: var(--form-checkbox-radio-default-border-hover)}.tedi-checkbox:has(input:active){--_checkbox-border: var(--form-checkbox-radio-default-border-active);--_checkbox-bg: var(--form-checkbox-radio-default-background-active)}.tedi-checkbox:has(input:disabled){pointer-events:none;--_checkbox-label-color: var(--general-text-disabled);--_checkbox-bg: var(--form-input-background-disabled);--_checkbox-border: var(--form-input-border-disabled)}.tedi-checkbox:has(input:disabled:checked){--_checkbox-bg: var( --form-checkbox-radio-default-background-selected-disabled );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-disabled )}.tedi-checkbox--error{--_checkbox-bg: var(--form-checkbox-radio-default-background-error);--_checkbox-border: var(--form-general-feedback-error-border)}.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-mobile)}@media (min-width: 576px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-tablet)}}@media (min-width: 992px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-desktop)}}.tedi-checkbox .tedi-feedback-text{grid-area:feedback}\n"] }]
+        }] });
+
+class FormFieldComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: FormFieldComponent, isStandalone: true, selector: "tedi-form-field", host: { properties: { "class.tedi-form-field": "true" } }, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-form-field{display:flex;flex-direction:column}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FormFieldComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-form-field", standalone: true, template: "<ng-content />", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-form-field]": "true",
+                    }, styles: [".tedi-form-field{display:flex;flex-direction:column}\n"] }]
+        }] });
+
+class InputComponent {
+    /**
+     * Size of the input.
+     * @default default
+     */
+    size = input("default");
+    /**
+     * State of the input.
+     * @default default
+     */
+    state = input("default");
+    modifierClasses = computed(() => {
+        const modifiers = [];
+        if (this.size())
+            modifiers.push(`tedi-input--${this.size()}`);
+        if (this.state())
+            modifiers.push(`tedi-input--${this.state()}`);
+        return modifiers.join(" ");
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: InputComponent, isStandalone: true, selector: "[tedi-input]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-input": "true", "class": "modifierClasses()" } }, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-input{--_border-color: var(--form-input-border-default);--_color: var(--form-input-text-filled);--_background-color: var(--form-input-background-default);--_placeholder-color: var(--form-input-text-placeholder);padding:var(--_padding-y) var(--_padding-x);border-radius:var(--_border-radius);font-size:var(--_font-size);line-height:var(--_line-height);border:1px solid;border-color:var(--_border-color);color:var(--_color);background-color:var(--_background-color);margin-bottom:var(--_form-field-outer-gap)}.tedi-input{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-input{font-family:var(--family-primary-desktop)}}.tedi-input{--_border-radius: var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-input{--_border-radius: var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-input{--_border-radius: var(--form-field-radius-desktop)}}.tedi-input{--_font-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-input{--_font-size: var(--body-regular-size-desktop)}}.tedi-input{--_line-height: var(--body-regular-line-height-mobile)}@media (min-width: 992px){.tedi-input{--_line-height: var(--body-regular-line-height-desktop)}}.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-mobile)}@media (min-width: 576px){.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-tablet)}}@media (min-width: 992px){.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-desktop)}}.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-mobile)}@media (min-width: 576px){.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-tablet)}}@media (min-width: 992px){.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-desktop)}}.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-desktop)}}.tedi-input:focus,.tedi-input:active{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input:hover{--_border-color: var(--form-input-border-hover)}.tedi-input:disabled,.tedi-input--disabled{--_color: var(--form-input-text-disabled);--_border-color: var(--form-input-border-disabled);--_background-color: var(--form-input-background-disabled);pointer-events:none}.tedi-input::placeholder{color:var(--_placeholder-color)}.tedi-input--error:not(:disabled){--_border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(:disabled):focus,.tedi-input--error:not(:disabled):active{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(:disabled){--_border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(:disabled):focus,.tedi-input--valid:not(:disabled):active{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-desktop)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "[tedi-input]", standalone: true, template: "<ng-content />", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-input]": "true",
+                        "[class]": "modifierClasses()",
+                    }, styles: [".tedi-input{--_border-color: var(--form-input-border-default);--_color: var(--form-input-text-filled);--_background-color: var(--form-input-background-default);--_placeholder-color: var(--form-input-text-placeholder);padding:var(--_padding-y) var(--_padding-x);border-radius:var(--_border-radius);font-size:var(--_font-size);line-height:var(--_line-height);border:1px solid;border-color:var(--_border-color);color:var(--_color);background-color:var(--_background-color);margin-bottom:var(--_form-field-outer-gap)}.tedi-input{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-input{font-family:var(--family-primary-desktop)}}.tedi-input{--_border-radius: var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-input{--_border-radius: var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-input{--_border-radius: var(--form-field-radius-desktop)}}.tedi-input{--_font-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-input{--_font-size: var(--body-regular-size-desktop)}}.tedi-input{--_line-height: var(--body-regular-line-height-mobile)}@media (min-width: 992px){.tedi-input{--_line-height: var(--body-regular-line-height-desktop)}}.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-mobile)}@media (min-width: 576px){.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-tablet)}}@media (min-width: 992px){.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-desktop)}}.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-mobile)}@media (min-width: 576px){.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-tablet)}}@media (min-width: 992px){.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-desktop)}}.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-desktop)}}.tedi-input:focus,.tedi-input:active{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input:hover{--_border-color: var(--form-input-border-hover)}.tedi-input:disabled,.tedi-input--disabled{--_color: var(--form-input-text-disabled);--_border-color: var(--form-input-border-disabled);--_background-color: var(--form-input-background-disabled);pointer-events:none}.tedi-input::placeholder{color:var(--_placeholder-color)}.tedi-input--error:not(:disabled){--_border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(:disabled):focus,.tedi-input--error:not(:disabled):active{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(:disabled){--_border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(:disabled):focus,.tedi-input--valid:not(:disabled):active{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-desktop)}}\n"] }]
+        }] });
+
+/**
+ * InputGroupComponent is a component that allows you to group multiple input elements together.
+ *
+ *
+ * Use prefix-slot, suffix-slot and unnamed slots to add input elements to the group.
+ * @example
+ * <tedi-input-group>
+ *   <tedi-button prefix-slot>Prefix</tedi-button>
+ *   <tedi-button suffix-slot>Suffix</tedi-button>
+ *   <input></input>
+ * </tedi-input-group>
+ *
+ */
+class InputGroupComponent {
+    /**
+     * User-visible label for the input group, visible above the input, should describe the purpose of the input group.
+     */
+    label = input();
+    /**
+     * ID of the input group's label, used to associate the label with the input group's custom input.
+     */
+    labelID = input();
+    /**
+     * Disabled state of the input group, causes the input group to be grayed out.
+     * Does not affect children's disabled state.
+     * @default false
+     */
+    disabled = input(false);
+    /**
+     * FeedbackText component inputs, displayed below the input group.
+     */
+    feedback = input();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputGroupComponent, isStandalone: true, selector: "tedi-input-group", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelID: { classPropertyName: "labelID", publicName: "labelID", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, feedback: { classPropertyName: "feedback", publicName: "feedback", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"tedi-input-group\">\n  @if (label()) {\n    <label tedi-label [for]=\"labelID()\">\n      <div class=\"tedi-input-group__label\">{{ label() }}</div>\n    </label>\n  }\n\n  <div\n    [class]=\"{\n      'tedi-input-group__container': true,\n      'tedi-input-group__container--disabled': disabled(),\n    }\"\n  >\n    <div class=\"tedi-input-group__prefix\">\n      <ng-content select=\"[prefix-slot]\" />\n    </div>\n    <div class=\"tedi-input-group__center\">\n      <ng-content />\n    </div>\n    <div class=\"tedi-input-group__suffix\">\n      <ng-content select=\"[suffix-slot]\" />\n    </div>\n  </div>\n  @if (feedback(); as feedbackResult) {\n    <tedi-feedback-text\n      [text]=\"feedbackResult.text\"\n      [type]=\"feedbackResult.type\"\n      [position]=\"feedbackResult.position\"\n    />\n  }\n</div>\n", styles: [".tedi-input-group__container{--_input-group-rounded: var(--radius-02-default);--_input-group-background-color: var(--form-input-background-default);--_input-group-min-height: var(--dimensions-14);--_input-group-text-color: var(--general-text-secondary);--_input-group-border-width: var(--borders-01);--_input-group-border-color: var(--form-input-border-default);--_input-group-side-background-color: var( --form-general-background-action-background );--_input-group-border: var(--_input-group-border-width) solid var(--_input-group-border-color);--_input-group-input-border-radius: var(0);--_input-group-disabled-border-color: var(--neutral-350);--_input-group-disabled-background-color: var(--neutral-300);--_input-group-text-disabled-color: var(--neutral-450);--_input-group-select-padding: 0;--_input-group-select-border: 0;--_input-group-share-border-size: 0;display:flex;background-color:transparent;color:var(--_input-group-text-color);min-height:var(--_input-group-min-height);overflow:hidden}.tedi-input-group__container{--_input-group-padding-x: var(--form-field-padding-x-md-default-mobile)}@media (min-width: 576px){.tedi-input-group__container{--_input-group-padding-x: var(--form-field-padding-x-md-default-tablet)}}@media (min-width: 992px){.tedi-input-group__container{--_input-group-padding-x: var(--form-field-padding-x-md-default-desktop)}}.tedi-input-group__container{--_input-group-padding-y: var(--form-field-padding-y-md-default-mobile)}@media (min-width: 576px){.tedi-input-group__container{--_input-group-padding-y: var(--form-field-padding-y-md-default-tablet)}}@media (min-width: 992px){.tedi-input-group__container{--_input-group-padding-y: var(--form-field-padding-y-md-default-desktop)}}.tedi-input-group__container input.tedi-input{margin:0;width:100%}.tedi-input-group__container .tedi-input-group__prefix .tedi-input:focus{z-index:1000;overflow:visible}.tedi-input-group__container:has(.tedi-input-group__prefix:empty){border-top-left-radius:var(--_input-group-rounded);border-bottom-left-radius:var(--_input-group-rounded)}.tedi-input-group__container:has(.tedi-input-group__prefix:empty) input.tedi-input{border-top-left-radius:var(--_input-group-rounded);border-bottom-left-radius:var(--_input-group-rounded)}.tedi-input-group__container:has(.tedi-input-group__suffix:empty){border-top-right-radius:var(--_input-group-rounded);border-bottom-right-radius:var(--_input-group-rounded)}.tedi-input-group__container:has(.tedi-input-group__suffix:empty) input.tedi-input{border-top-right-radius:var(--_input-group-rounded);border-bottom-right-radius:var(--_input-group-rounded)}.tedi-input-group__container .tedi-input-group__prefix tedi-select .tedi-select__trigger:focus,.tedi-input-group__container .tedi-input-group__prefix tedi-select .tedi-select__trigger:hover{border-right:var(--_input-group-border-width) solid var(--form-input-border-hover)}.tedi-input-group__container .tedi-input-group__suffix tedi-select .tedi-select__trigger:focus,.tedi-input-group__container .tedi-input-group__suffix tedi-select .tedi-select__trigger:hover{border-left:var(--_input-group-border-width) solid var(--form-input-border-hover)}.tedi-input-group__container:has(.tedi-input-group__prefix tedi-select .tedi-select__trigger:focus,.tedi-input-group__prefix tedi-select .tedi-select__trigger:hover) .tedi-input-group__center .tedi-input{border-left:var(--_input-group-share-border-size)}.tedi-input-group__container:has(.tedi-input-group__suffix tedi-select .tedi-select__trigger:focus,.tedi-input-group__suffix tedi-select .tedi-select__trigger:hover) .tedi-input-group__center .tedi-input{border-right:var(--_input-group-share-border-size)}.tedi-input-group__center .tedi-input{border-radius:var(--_input-group-input-border-radius)}.tedi-input-group__container--disabled{--_input-group-text-color: var(--_input-group-text-disabled-color);--_input-group-border-color: var(--_input-group-disabled-border-color);--_input-group-background-color: var( --_input-group-disabled-background-color );--_input-group-side-background-color: var( --_input-group-disabled-background-color )}.tedi-input-group__prefix,.tedi-input-group__suffix{display:flex;align-items:center;flex-shrink:0;background:var(--_input-group-side-background-color);border:var(--_input-group-border);padding:var(--_input-group-padding-y) var(--_input-group-padding-x)}.tedi-input-group__prefix:has(tedi-select),.tedi-input-group__suffix:has(tedi-select){--_input-group-border: var(--_input-group-select-border);padding:var(--_input-group-select-padding);background-color:transparent}.tedi-input-group__prefix tedi-select .tedi-select__trigger,.tedi-input-group__suffix tedi-select .tedi-select__trigger{background:var(--_input-group-side-background-color);height:100%;margin:0}.tedi-input-group__prefix:empty,.tedi-input-group__suffix:empty{display:none}.tedi-input-group__prefix{border-right:0;border-top-left-radius:var(--_input-group-rounded);border-bottom-left-radius:var(--_input-group-rounded)}.tedi-input-group__prefix tedi-select .tedi-select__trigger{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.tedi-input-group__suffix{border-left:0;border-top-right-radius:var(--_input-group-rounded);border-bottom-right-radius:var(--_input-group-rounded)}.tedi-input-group__suffix tedi-select .tedi-select__trigger{border-top-left-radius:0;border-bottom-left-radius:0;border-left:0}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: LabelComponent, selector: "label[tedi-label]", inputs: ["size", "required"] }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputGroupComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-input-group", standalone: true, encapsulation: ViewEncapsulation.None, imports: [FeedbackTextComponent, LabelComponent], template: "<div class=\"tedi-input-group\">\n  @if (label()) {\n    <label tedi-label [for]=\"labelID()\">\n      <div class=\"tedi-input-group__label\">{{ label() }}</div>\n    </label>\n  }\n\n  <div\n    [class]=\"{\n      'tedi-input-group__container': true,\n      'tedi-input-group__container--disabled': disabled(),\n    }\"\n  >\n    <div class=\"tedi-input-group__prefix\">\n      <ng-content select=\"[prefix-slot]\" />\n    </div>\n    <div class=\"tedi-input-group__center\">\n      <ng-content />\n    </div>\n    <div class=\"tedi-input-group__suffix\">\n      <ng-content select=\"[suffix-slot]\" />\n    </div>\n  </div>\n  @if (feedback(); as feedbackResult) {\n    <tedi-feedback-text\n      [text]=\"feedbackResult.text\"\n      [type]=\"feedbackResult.type\"\n      [position]=\"feedbackResult.position\"\n    />\n  }\n</div>\n", styles: [".tedi-input-group__container{--_input-group-rounded: var(--radius-02-default);--_input-group-background-color: var(--form-input-background-default);--_input-group-min-height: var(--dimensions-14);--_input-group-text-color: var(--general-text-secondary);--_input-group-border-width: var(--borders-01);--_input-group-border-color: var(--form-input-border-default);--_input-group-side-background-color: var( --form-general-background-action-background );--_input-group-border: var(--_input-group-border-width) solid var(--_input-group-border-color);--_input-group-input-border-radius: var(0);--_input-group-disabled-border-color: var(--neutral-350);--_input-group-disabled-background-color: var(--neutral-300);--_input-group-text-disabled-color: var(--neutral-450);--_input-group-select-padding: 0;--_input-group-select-border: 0;--_input-group-share-border-size: 0;display:flex;background-color:transparent;color:var(--_input-group-text-color);min-height:var(--_input-group-min-height);overflow:hidden}.tedi-input-group__container{--_input-group-padding-x: var(--form-field-padding-x-md-default-mobile)}@media (min-width: 576px){.tedi-input-group__container{--_input-group-padding-x: var(--form-field-padding-x-md-default-tablet)}}@media (min-width: 992px){.tedi-input-group__container{--_input-group-padding-x: var(--form-field-padding-x-md-default-desktop)}}.tedi-input-group__container{--_input-group-padding-y: var(--form-field-padding-y-md-default-mobile)}@media (min-width: 576px){.tedi-input-group__container{--_input-group-padding-y: var(--form-field-padding-y-md-default-tablet)}}@media (min-width: 992px){.tedi-input-group__container{--_input-group-padding-y: var(--form-field-padding-y-md-default-desktop)}}.tedi-input-group__container input.tedi-input{margin:0;width:100%}.tedi-input-group__container .tedi-input-group__prefix .tedi-input:focus{z-index:1000;overflow:visible}.tedi-input-group__container:has(.tedi-input-group__prefix:empty){border-top-left-radius:var(--_input-group-rounded);border-bottom-left-radius:var(--_input-group-rounded)}.tedi-input-group__container:has(.tedi-input-group__prefix:empty) input.tedi-input{border-top-left-radius:var(--_input-group-rounded);border-bottom-left-radius:var(--_input-group-rounded)}.tedi-input-group__container:has(.tedi-input-group__suffix:empty){border-top-right-radius:var(--_input-group-rounded);border-bottom-right-radius:var(--_input-group-rounded)}.tedi-input-group__container:has(.tedi-input-group__suffix:empty) input.tedi-input{border-top-right-radius:var(--_input-group-rounded);border-bottom-right-radius:var(--_input-group-rounded)}.tedi-input-group__container .tedi-input-group__prefix tedi-select .tedi-select__trigger:focus,.tedi-input-group__container .tedi-input-group__prefix tedi-select .tedi-select__trigger:hover{border-right:var(--_input-group-border-width) solid var(--form-input-border-hover)}.tedi-input-group__container .tedi-input-group__suffix tedi-select .tedi-select__trigger:focus,.tedi-input-group__container .tedi-input-group__suffix tedi-select .tedi-select__trigger:hover{border-left:var(--_input-group-border-width) solid var(--form-input-border-hover)}.tedi-input-group__container:has(.tedi-input-group__prefix tedi-select .tedi-select__trigger:focus,.tedi-input-group__prefix tedi-select .tedi-select__trigger:hover) .tedi-input-group__center .tedi-input{border-left:var(--_input-group-share-border-size)}.tedi-input-group__container:has(.tedi-input-group__suffix tedi-select .tedi-select__trigger:focus,.tedi-input-group__suffix tedi-select .tedi-select__trigger:hover) .tedi-input-group__center .tedi-input{border-right:var(--_input-group-share-border-size)}.tedi-input-group__center .tedi-input{border-radius:var(--_input-group-input-border-radius)}.tedi-input-group__container--disabled{--_input-group-text-color: var(--_input-group-text-disabled-color);--_input-group-border-color: var(--_input-group-disabled-border-color);--_input-group-background-color: var( --_input-group-disabled-background-color );--_input-group-side-background-color: var( --_input-group-disabled-background-color )}.tedi-input-group__prefix,.tedi-input-group__suffix{display:flex;align-items:center;flex-shrink:0;background:var(--_input-group-side-background-color);border:var(--_input-group-border);padding:var(--_input-group-padding-y) var(--_input-group-padding-x)}.tedi-input-group__prefix:has(tedi-select),.tedi-input-group__suffix:has(tedi-select){--_input-group-border: var(--_input-group-select-border);padding:var(--_input-group-select-padding);background-color:transparent}.tedi-input-group__prefix tedi-select .tedi-select__trigger,.tedi-input-group__suffix tedi-select .tedi-select__trigger{background:var(--_input-group-side-background-color);height:100%;margin:0}.tedi-input-group__prefix:empty,.tedi-input-group__suffix:empty{display:none}.tedi-input-group__prefix{border-right:0;border-top-left-radius:var(--_input-group-rounded);border-bottom-left-radius:var(--_input-group-rounded)}.tedi-input-group__prefix tedi-select .tedi-select__trigger{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.tedi-input-group__suffix{border-left:0;border-top-right-radius:var(--_input-group-rounded);border-bottom-right-radius:var(--_input-group-rounded)}.tedi-input-group__suffix tedi-select .tedi-select__trigger{border-top-left-radius:0;border-bottom-left-radius:0;border-left:0}\n"] }]
+        }] });
+
+class RadioGroupComponent {
+    /*
+     * Radio group name
+     */
+    name = input.required();
+    /*
+     * Radio group id.
+     */
+    id = input.required();
+    /**
+     * Radio group label.
+     */
+    label = input();
+    /*
+     * Whether radio group is disabled. Do not use with controlled radios.
+     */
+    disabled = input();
+    /*
+     * Whether radio group has error.
+     */
+    hasError = input();
+    /*
+     * Size of the radios radios in group.
+     */
+    size = input("default");
+    /*
+     * Direction in which radios flow.
+     */
+    direction = input("column");
+    /*
+     * Spacing between radios. unit: px.
+     * @default 4
+     */
+    spacing = input(4);
+    /**
+     * FeedbackText component inputs.
+     */
+    feedbackText = input();
+    /*
+     * Emits selected radio value on change.
+     */
+    // eslint-disable-next-line @angular-eslint/no-output-native
+    change = output();
+    _value = signal(null);
+    _controlDisabled = signal(false);
+    groupDisabled = computed(() => {
+        return this.disabled() || this._controlDisabled();
+    });
+    groupValue = this._value.asReadonly();
+    _onChange = () => { };
+    _onTouched = () => { };
+    writeValue(value) {
+        this._value.set(value);
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this._controlDisabled.set(isDisabled);
+    }
+    selectRadio(value) {
+        this._onChange(value);
+        this.change.emit(value);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: RadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: RadioGroupComponent, isStandalone: true, selector: "tedi-radio-group", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { change: "change" }, host: { properties: { "class.tedi-radio-group": "true", "attr.role": "'radiogroup'" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => RadioGroupComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: "@if (label()) {\n  <label tedi-label [for]=\"id()\">\n    {{ label() }}\n  </label>\n}\n<div\n  class=\"tedi-radio-group__radios\"\n  [style.flex-direction]=\"direction()\"\n  [style.gap]=\"spacing() + 'px'\"\n>\n  <ng-content />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-radio-group{display:block}.tedi-radio-group__radios{display:flex;flex-wrap:wrap}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: LabelComponent, selector: "label[tedi-label]", inputs: ["size", "required"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: RadioGroupComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-radio-group", standalone: true, imports: [FeedbackTextComponent, LabelComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => RadioGroupComponent),
+                            multi: true,
+                        },
+                    ], host: {
+                        "[class.tedi-radio-group]": "true",
+                        "[attr.role]": "'radiogroup'",
+                    }, template: "@if (label()) {\n  <label tedi-label [for]=\"id()\">\n    {{ label() }}\n  </label>\n}\n<div\n  class=\"tedi-radio-group__radios\"\n  [style.flex-direction]=\"direction()\"\n  [style.gap]=\"spacing() + 'px'\"\n>\n  <ng-content />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-radio-group{display:block}.tedi-radio-group__radios{display:flex;flex-wrap:wrap}\n"] }]
+        }] });
+
+class RadioComponent {
+    /*
+     * unique id.
+     */
+    inputId = input.required();
+    /*
+     * Whether radio is checked. Do not used with controlled radios.
+     */
+    checked = model();
+    /*
+     * Radio value.
+     */
+    value = input.required();
+    /*
+     * Whether radio is disabled.
+     */
+    disabled = input();
+    /*
+     * Whether radio has error.
+     */
+    hasError = input();
+    /**
+     * FeedbackText component inputs.
+     */
+    feedbackText = input();
+    _inputEl = viewChild.required("input");
+    radioGroup = inject(RadioGroupComponent, { optional: true });
+    inputDisabled = computed(() => {
+        return this.disabled() || this.radioGroup?.groupDisabled();
+    });
+    inputName = computed(() => {
+        return this.radioGroup?.name();
+    });
+    inputChecked = computed(() => {
+        return this.value() === this.radioGroup?.groupValue() || this.checked();
+    });
+    feedbackTextId = computed(() => {
+        if (this.feedbackText()) {
+            return generateUUID();
+        }
+        return;
+    });
+    focus() {
+        this._inputEl().nativeElement.focus();
+    }
+    onInputChange(event) {
+        event.stopPropagation();
+        this.radioGroup?.selectRadio(this.value());
+    }
+    ngOnInit() {
+        if (this.checked()) {
+            this.radioGroup?.selectRadio(this.value());
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: RadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: RadioComponent, isStandalone: true, selector: "tedi-radio", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { properties: { "class.tedi-radio": "true", "class.tedi-radio--error": "hasError() || radioGroup?.hasError()", "class.tedi-radio--large": "radioGroup?.size() === 'large'" } }, viewQueries: [{ propertyName: "_inputEl", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"tedi-radio__input-area\">\n  <input\n    class=\"tedi-radio__input\"\n    type=\"radio\"\n    #input\n    [id]=\"inputId()\"\n    [checked]=\"inputChecked()\"\n    [disabled]=\"inputDisabled()\"\n    [attr.name]=\"inputName()\"\n    [attr.value]=\"value()\"\n    [attr.aria-describedby]=\"feedbackTextId()\"\n    (change)=\"onInputChange($event)\"\n  />\n  <div class=\"tedi-radio__indicator\"></div>\n</div>\n<label [for]=\"inputId()\" class=\"tedi-radio__label\">\n  <ng-content></ng-content>\n</label>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [id]=\"feedbackTextId()\"\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-radio{--_radio-bg: var(--form-checkbox-radio-default-background-default);--_radio-border: var(--form-checkbox-radio-default-border-default);--_radio-label-color: var(--general-text-primary);--_radio-dot-bg: var(--_radio-border);--_radio-dot-size: 12px;display:grid;grid-template-areas:\"input-area label\" \". feedback\";grid-template-columns:auto 1fr;align-items:center}.tedi-radio{--_radio-inner-spacing: var(--form-checkbox-radio-inner-spacing-mobile)}@media (min-width: 576px){.tedi-radio{--_radio-inner-spacing: var(--form-checkbox-radio-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-radio{--_radio-inner-spacing: var(--form-checkbox-radio-inner-spacing-desktop)}}.tedi-radio{--_radio-size: var(--form-checkbox-radio-size-responsive-mobile)}@media (min-width: 576px){.tedi-radio{--_radio-size: var(--form-checkbox-radio-size-responsive-tablet)}}@media (min-width: 992px){.tedi-radio{--_radio-size: var(--form-checkbox-radio-size-responsive-desktop)}}.tedi-radio{--_label-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-radio{--_label-size: var(--body-regular-size-desktop)}}.tedi-radio__input-area{position:relative;grid-area:input-area}.tedi-radio__input{position:absolute;top:0;left:0;height:100%;width:100%;margin:0;padding:0;opacity:0;z-index:1}.tedi-radio__indicator{position:relative;width:var(--_radio-size);height:var(--_radio-size);border-radius:50%;border:1px solid var(--_radio-border);background:var(--_radio-bg);margin-right:var(--_radio-inner-spacing);display:flex;align-items:center;justify-content:center}.tedi-radio__indicator:after{content:\"\";border-radius:50%;display:none;background:var(--_radio-dot-bg);height:var(--_radio-dot-size);width:var(--_radio-dot-size)}.tedi-radio__label{color:var(--_radio-label-color);font-size:var(--_label-size);grid-area:label}.tedi-radio__label{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-radio__label{font-family:var(--family-primary-desktop)}}.tedi-radio:has(input:checked) .tedi-radio__indicator:after{display:block}.tedi-radio:has(input:checked){--_radio-border: var(--form-checkbox-radio-default-border-selected)}.tedi-radio:has(input:hover,input:focus-visible) .tedi-radio__indicator{outline:1px solid var(--_radio-border)}.tedi-radio:has(input:hover,input:focus-visible){--_radio-border: var(--form-checkbox-radio-default-border-hover)}.tedi-radio:has(input:active){--_radio-border: var(--form-checkbox-radio-default-border-active)}.tedi-radio:has(input:disabled){pointer-events:none;--_radio-label-color: var(--general-text-disabled);--_radio-bg: var(--form-input-background-disabled);--_radio-border: var(--form-input-border-disabled)}.tedi-radio:has(input:disabled:checked){--_radio-dot-bg: var( --form-checkbox-radio-default-background-selected-disabled );--_radio-border: var( --form-checkbox-radio-default-border-selected-disabled )}.tedi-radio--error{--_radio-bg: var(--form-checkbox-radio-default-background-error);--_radio-border: var(--form-general-feedback-error-border)}.tedi-radio--large{--_radio-dot-size: 16px}.tedi-radio--large{--_radio-size: var(--form-checkbox-radio-size-large-mobile)}@media (min-width: 576px){.tedi-radio--large{--_radio-size: var(--form-checkbox-radio-size-large-tablet)}}@media (min-width: 992px){.tedi-radio--large{--_radio-size: var(--form-checkbox-radio-size-large-desktop)}}.tedi-radio .tedi-feedback-text{grid-area:feedback}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: RadioComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-radio", imports: [FeedbackTextComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-radio]": "true",
+                        "[class.tedi-radio--error]": "hasError() || radioGroup?.hasError()",
+                        "[class.tedi-radio--large]": "radioGroup?.size() === 'large'",
+                    }, template: "<div class=\"tedi-radio__input-area\">\n  <input\n    class=\"tedi-radio__input\"\n    type=\"radio\"\n    #input\n    [id]=\"inputId()\"\n    [checked]=\"inputChecked()\"\n    [disabled]=\"inputDisabled()\"\n    [attr.name]=\"inputName()\"\n    [attr.value]=\"value()\"\n    [attr.aria-describedby]=\"feedbackTextId()\"\n    (change)=\"onInputChange($event)\"\n  />\n  <div class=\"tedi-radio__indicator\"></div>\n</div>\n<label [for]=\"inputId()\" class=\"tedi-radio__label\">\n  <ng-content></ng-content>\n</label>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [id]=\"feedbackTextId()\"\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-radio{--_radio-bg: var(--form-checkbox-radio-default-background-default);--_radio-border: var(--form-checkbox-radio-default-border-default);--_radio-label-color: var(--general-text-primary);--_radio-dot-bg: var(--_radio-border);--_radio-dot-size: 12px;display:grid;grid-template-areas:\"input-area label\" \". feedback\";grid-template-columns:auto 1fr;align-items:center}.tedi-radio{--_radio-inner-spacing: var(--form-checkbox-radio-inner-spacing-mobile)}@media (min-width: 576px){.tedi-radio{--_radio-inner-spacing: var(--form-checkbox-radio-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-radio{--_radio-inner-spacing: var(--form-checkbox-radio-inner-spacing-desktop)}}.tedi-radio{--_radio-size: var(--form-checkbox-radio-size-responsive-mobile)}@media (min-width: 576px){.tedi-radio{--_radio-size: var(--form-checkbox-radio-size-responsive-tablet)}}@media (min-width: 992px){.tedi-radio{--_radio-size: var(--form-checkbox-radio-size-responsive-desktop)}}.tedi-radio{--_label-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-radio{--_label-size: var(--body-regular-size-desktop)}}.tedi-radio__input-area{position:relative;grid-area:input-area}.tedi-radio__input{position:absolute;top:0;left:0;height:100%;width:100%;margin:0;padding:0;opacity:0;z-index:1}.tedi-radio__indicator{position:relative;width:var(--_radio-size);height:var(--_radio-size);border-radius:50%;border:1px solid var(--_radio-border);background:var(--_radio-bg);margin-right:var(--_radio-inner-spacing);display:flex;align-items:center;justify-content:center}.tedi-radio__indicator:after{content:\"\";border-radius:50%;display:none;background:var(--_radio-dot-bg);height:var(--_radio-dot-size);width:var(--_radio-dot-size)}.tedi-radio__label{color:var(--_radio-label-color);font-size:var(--_label-size);grid-area:label}.tedi-radio__label{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-radio__label{font-family:var(--family-primary-desktop)}}.tedi-radio:has(input:checked) .tedi-radio__indicator:after{display:block}.tedi-radio:has(input:checked){--_radio-border: var(--form-checkbox-radio-default-border-selected)}.tedi-radio:has(input:hover,input:focus-visible) .tedi-radio__indicator{outline:1px solid var(--_radio-border)}.tedi-radio:has(input:hover,input:focus-visible){--_radio-border: var(--form-checkbox-radio-default-border-hover)}.tedi-radio:has(input:active){--_radio-border: var(--form-checkbox-radio-default-border-active)}.tedi-radio:has(input:disabled){pointer-events:none;--_radio-label-color: var(--general-text-disabled);--_radio-bg: var(--form-input-background-disabled);--_radio-border: var(--form-input-border-disabled)}.tedi-radio:has(input:disabled:checked){--_radio-dot-bg: var( --form-checkbox-radio-default-background-selected-disabled );--_radio-border: var( --form-checkbox-radio-default-border-selected-disabled )}.tedi-radio--error{--_radio-bg: var(--form-checkbox-radio-default-background-error);--_radio-border: var(--form-general-feedback-error-border)}.tedi-radio--large{--_radio-dot-size: 16px}.tedi-radio--large{--_radio-size: var(--form-checkbox-radio-size-large-mobile)}@media (min-width: 576px){.tedi-radio--large{--_radio-size: var(--form-checkbox-radio-size-large-tablet)}}@media (min-width: 992px){.tedi-radio--large{--_radio-size: var(--form-checkbox-radio-size-large-desktop)}}.tedi-radio .tedi-feedback-text{grid-area:feedback}\n"] }]
+        }] });
+
+class RadioCardGroupComponent extends RadioGroupComponent {
+    /*
+     * Direction in which radios flow.
+     */
+    direction = input("row");
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: RadioCardGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: RadioCardGroupComponent, isStandalone: true, selector: "tedi-radio-card-group", inputs: { direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => RadioCardGroupComponent),
+                multi: true,
+            },
+            // Necessary for DI in RadioComponent
+            {
+                provide: RadioGroupComponent,
+                useExisting: RadioCardGroupComponent,
+            },
+        ], usesInheritance: true, hostDirectives: [{ directive: ChoiceGroupDirective, inputs: ["variant", "variant", "hasIndicator", "hasIndicator", "spacing", "spacing"] }], ngImport: i0, template: "@if (label()) {\n  <label tedi-label [for]=\"id()\">\n    {{ label() }}\n  </label>\n}\n<div\n  class=\"tedi-radio-group__radios\"\n  [style.flex-direction]=\"direction()\"\n  [style.gap]=\"spacing() + 'px'\"\n>\n  <ng-content />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-radio-group{display:block}.tedi-radio-group__radios{display:flex;flex-wrap:wrap}\n", ".tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{position:relative;background-color:var(--_choicegroup-card-bg);border:1px solid var(--_choicegroup-card-border);border-radius:var(--_choicegroup-card-radius);padding:var(--_choicegroup-card-padding);--_choicegroup-card-padding-top: var(--_choicegroup-card-padding-vertical);--_choicegroup-card-padding-bottom: var(--_choicegroup-card-padding-vertical);--_choicegroup-card-padding-left: var(--_choicegroup-card-padding-horizontal);--_choicegroup-card-padding-right: var( --_choicegroup-card-padding-horizontal );--_choicegroup-card-padding: var(--_choicegroup-card-padding-top) var(--_choicegroup-card-padding-right) var(--_choicegroup-card-padding-bottom) var(--_choicegroup-card-padding-left)}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-desktop)}}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-desktop)}}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-desktop)}}.tedi-choicegroup .tedi-radio__input-area,.tedi-choicegroup .tedi-checkbox__input-area{position:static}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-inactive-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-inactive-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-inactive-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-active-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-active-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-active-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-hover-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-hover-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-hover-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-disabled-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-disabled-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-disabled-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-inactive-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-active-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-hover-border )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-disabled-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio--error,.tedi-checkbox--error){--_choicegroup-card-bg: var(--form-checkbox-radio-default-background-error);--_choicegroup-card-border: var(--form-general-feedback-error-border)}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_radio-bg: transparent;--_checkbox-bg: transparent;--_radio-border: var( --form-checkbox-radio-default-border-selected-inverted );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-inverted )}.tedi-choicegroup--primary .tedi-checkbox:has(input:active){--_checkbox-border: var( --form-checkbox-radio-default-border-selected-inverted )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-inactive-border-group )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-active-border-group )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-hover-border )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-disabled-border-group )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-inactive-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-inactive-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-inactive-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-active-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-active-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-active-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-hover-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-hover-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-hover-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-disabled-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-disabled-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-disabled-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-inactive-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-active-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-hover-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-disabled-border )}.tedi-choicegroup--secondary :is(.tedi-radio--error,.tedi-checkbox--error){--_choicegroup-card-bg: var(--form-checkbox-radio-default-background-error);--_choicegroup-card-border: var(--form-general-feedback-error-border)}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){outline:1px solid var(--_choicegroup-card-border);outline-offset:-2px}.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible) .tedi-radio__indicator,.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible) .tedi-checkbox__indicator{outline:none}.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible){outline:2px solid var(--form-input-border-active);outline-offset:1px}.tedi-choicegroup--plain .tedi-radio__indicator,.tedi-choicegroup--plain .tedi-checkbox__indicator{display:none}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0;margin-right:-1px}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:checked){z-index:1}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: LabelComponent, selector: "label[tedi-label]", inputs: ["size", "required"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: RadioCardGroupComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: "tedi-radio-card-group", imports: [FeedbackTextComponent, LabelComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => RadioCardGroupComponent),
+                            multi: true,
+                        },
+                        // Necessary for DI in RadioComponent
+                        {
+                            provide: RadioGroupComponent,
+                            useExisting: RadioCardGroupComponent,
+                        },
+                    ], hostDirectives: [
+                        {
+                            directive: ChoiceGroupDirective,
+                            inputs: ["variant", "hasIndicator", "spacing"],
+                        },
+                    ], template: "@if (label()) {\n  <label tedi-label [for]=\"id()\">\n    {{ label() }}\n  </label>\n}\n<div\n  class=\"tedi-radio-group__radios\"\n  [style.flex-direction]=\"direction()\"\n  [style.gap]=\"spacing() + 'px'\"\n>\n  <ng-content />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n", styles: [".tedi-radio-group{display:block}.tedi-radio-group__radios{display:flex;flex-wrap:wrap}\n", ".tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{position:relative;background-color:var(--_choicegroup-card-bg);border:1px solid var(--_choicegroup-card-border);border-radius:var(--_choicegroup-card-radius);padding:var(--_choicegroup-card-padding);--_choicegroup-card-padding-top: var(--_choicegroup-card-padding-vertical);--_choicegroup-card-padding-bottom: var(--_choicegroup-card-padding-vertical);--_choicegroup-card-padding-left: var(--_choicegroup-card-padding-horizontal);--_choicegroup-card-padding-right: var( --_choicegroup-card-padding-horizontal );--_choicegroup-card-padding: var(--_choicegroup-card-padding-top) var(--_choicegroup-card-padding-right) var(--_choicegroup-card-padding-bottom) var(--_choicegroup-card-padding-left)}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-radius: var(--form-checkbox-radio-card-radius-desktop)}}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-horizontal: var(--form-checkbox-radio-card-checkbox-padding-x-desktop)}}.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-mobile)}@media (min-width: 576px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-tablet)}}@media (min-width: 992px){.tedi-choicegroup .tedi-radio,.tedi-choicegroup .tedi-checkbox{--_choicegroup-card-padding-vertical: var(--form-checkbox-radio-card-checkbox-padding-y-desktop)}}.tedi-choicegroup .tedi-radio__input-area,.tedi-choicegroup .tedi-checkbox__input-area{position:static}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-inactive-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-inactive-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-inactive-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-active-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-active-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-active-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-hover-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-hover-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-hover-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-bg: var( --form-checkbox-radio-card-primary-disabled-background );--_radio-label-color: var( --form-checkbox-radio-card-primary-disabled-text );--_checkbox-label-color: var( --form-checkbox-radio-card-primary-disabled-text )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-inactive-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-active-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-hover-border )}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-disabled-border-separate )}.tedi-choicegroup--primary :is(.tedi-radio--error,.tedi-checkbox--error){--_choicegroup-card-bg: var(--form-checkbox-radio-default-background-error);--_choicegroup-card-border: var(--form-general-feedback-error-border)}.tedi-choicegroup--primary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_radio-bg: transparent;--_checkbox-bg: transparent;--_radio-border: var( --form-checkbox-radio-default-border-selected-inverted );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-inverted )}.tedi-choicegroup--primary .tedi-checkbox:has(input:active){--_checkbox-border: var( --form-checkbox-radio-default-border-selected-inverted )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-inactive-border-group )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-active-border-group )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-hover-border )}.tedi-choicegroup--primary.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-primary-disabled-border-group )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-inactive-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-inactive-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-inactive-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-active-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-active-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-active-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-hover-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-hover-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-hover-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-bg: var( --form-checkbox-radio-card-secondary-disabled-background );--_radio-label-color: var( --form-checkbox-radio-card-secondary-disabled-text );--_checkbox-label-color: var( --form-checkbox-radio-card-secondary-disabled-text )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-inactive-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-active-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:hover){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-hover-border )}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:disabled){--_choicegroup-card-border: var( --form-checkbox-radio-card-secondary-disabled-border )}.tedi-choicegroup--secondary :is(.tedi-radio--error,.tedi-checkbox--error){--_choicegroup-card-bg: var(--form-checkbox-radio-default-background-error);--_choicegroup-card-border: var(--form-general-feedback-error-border)}.tedi-choicegroup--secondary :is(.tedi-radio,.tedi-checkbox):has(input:checked){outline:1px solid var(--_choicegroup-card-border);outline-offset:-2px}.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible) .tedi-radio__indicator,.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible) .tedi-checkbox__indicator{outline:none}.tedi-choicegroup :is(.tedi-radio,.tedi-checkbox):has(input:focus-visible){outline:2px solid var(--form-input-border-active);outline-offset:1px}.tedi-choicegroup--plain .tedi-radio__indicator,.tedi-choicegroup--plain .tedi-checkbox__indicator{display:none}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0;margin-right:-1px}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.tedi-choicegroup--stacked :is(.tedi-radio,.tedi-checkbox):has(input:checked){z-index:1}\n"] }]
+        }] });
+
+class SelectOptionComponent {
+    /**
+     * Value of the option
+     */
+    value = input.required();
+    /**
+     * Label of the option
+     */
+    label = input.required();
+    /**
+     * Whether the option is disabled
+     */
+    disabled = input(false);
+    /**
+     * Group the option belongs to
+     * This is used for grouping options in the dropdown.
+     * If not provided, the option will not be grouped.
+     */
+    group = input(null);
+    templateRef = viewChild(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.15", type: SelectOptionComponent, isStandalone: true, selector: "tedi-select-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template><ng-content /></ng-template>", isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SelectOptionComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "tedi-select-option",
+                    imports: [],
+                    template: "<ng-template><ng-content /></ng-template>",
+                    standalone: true,
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }] });
+
+class DropdownTriggerDirective {
+    dropdownContext = inject(DropdownComponent);
+    overlayOrigin = inject(CdkOverlayOrigin, { self: true });
+    ariaAttributes = computed(() => {
+        if (!this.dropdownContext.dropdownRole())
+            return {};
+        return {
+            hasPopup: this.dropdownContext.dropdownRole(),
+            expanded: this.dropdownContext.opened() ? "true" : "false",
+            controls: this.dropdownContext.opened()
+                ? this.dropdownContext.dropdownId()
+                : undefined,
+        };
+    });
+    onClick() {
+        this.dropdownContext.toggle();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: DropdownTriggerDirective, isStandalone: true, selector: "[tedi-dropdown-trigger]", host: { listeners: { "click": "onClick()" }, properties: { "attr.aria-has-popup": "ariaAttributes().hasPopup", "attr.aria-expanded": "ariaAttributes().expanded", "attr.aria-controls": "ariaAttributes().controls" } }, hostDirectives: [{ directive: i2.CdkOverlayOrigin }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownTriggerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[tedi-dropdown-trigger]",
+                    host: {
+                        "[attr.aria-has-popup]": "ariaAttributes().hasPopup",
+                        "[attr.aria-expanded]": "ariaAttributes().expanded",
+                        "[attr.aria-controls]": "ariaAttributes().controls",
+                        "(click)": "onClick()",
+                    },
+                    hostDirectives: [CdkOverlayOrigin],
+                }]
+        }] });
+
+class DropdownComponent {
+    injector = inject(Injector);
+    dropdownId = input.required();
+    dropdownRole = input();
+    opened = model(false);
+    triggerDirective = contentChild.required(DropdownTriggerDirective);
+    dropdownItems = contentChildren(forwardRef(() => DropdownItemComponent), { descendants: true });
+    isMobile = inject(BreakpointService).isBelowBreakpoint("sm");
+    keyManager;
+    overlayOrigin = computed(() => {
+        return this.triggerDirective().overlayOrigin;
+    });
+    toggle() {
+        this.opened.update((wasOpened) => !wasOpened);
+    }
+    close() {
+        this.opened.set(false);
+    }
+    onKeyDown(event) {
+        this.keyManager?.onKeydown(event);
+    }
+    ngOnInit() {
+        this.keyManager = new FocusKeyManager(this.dropdownItems, this.injector).withWrap();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: DropdownComponent, isStandalone: true, selector: "tedi-dropdown", inputs: { dropdownId: { classPropertyName: "dropdownId", publicName: "dropdownId", isSignal: true, isRequired: true, transformFunction: null }, dropdownRole: { classPropertyName: "dropdownRole", publicName: "dropdownRole", isSignal: true, isRequired: false, transformFunction: null }, opened: { classPropertyName: "opened", publicName: "opened", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "openedChange" }, queries: [{ propertyName: "triggerDirective", first: true, predicate: DropdownTriggerDirective, descendants: true, isSignal: true }, { propertyName: "dropdownItems", predicate: i0.forwardRef(() => DropdownItemComponent), descendants: true, isSignal: true }], ngImport: i0, template: "<ng-content select=\"[tedi-dropdown-trigger]\" />\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin()\"\n  [cdkConnectedOverlayOpen]=\"opened()\"\n  [cdkConnectedOverlayOffsetY]=\"4\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayViewportMargin]=\"16\"\n  cdkConnectedOverlayPanelClass=\"tedi-dropdown__overlay-pane\"\n  (overlayKeydown)=\"onKeyDown($event)\"\n  (overlayOutsideClick)=\"close()\"\n>\n  <tedi-card\n    padding=\"none\"\n    class=\"tedi-dropdown__card\"\n    [attr.role]=\"dropdownRole()\"\n    [attr.id]=\"dropdownId()\"\n  >\n    @if (isMobile()) {\n      <tedi-card-content hasSeparator autoWidth padding=\"xs\">\n        <button\n          tedi-closing-button\n          (click)=\"close()\"\n          size=\"small\"\n          class=\"tedi-dropdown__close-button\"\n        ></button>\n      </tedi-card-content>\n    }\n    <tedi-card-content>\n      <ng-content />\n    </tedi-card-content>\n  </tedi-card>\n</ng-template>\n", styles: [".tedi-dropdown__card.tedi-card{box-shadow:0 1px 5px 0 var(--alpha-20, rgba(0, 0, 0, .2));overflow-y:auto}@media (max-width: 575.98px){.tedi-dropdown__card.tedi-card{position:fixed;inset:0}}.tedi-dropdown__close-button{margin-left:auto}@media (max-width: 575.98px){.tedi-dropdown__overlay-pane{transform:none!important}}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.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: "component", type: CardComponent, selector: "tedi-card", inputs: ["borderless", "spacing", "accentBorder", "selected"] }, { kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["hasSeparator", "autoWidth", "timeline"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-dropdown", imports: [
+                        OverlayModule,
+                        CardComponent,
+                        CardContentComponent,
+                        ClosingButtonComponent,
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[tedi-dropdown-trigger]\" />\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"overlayOrigin()\"\n  [cdkConnectedOverlayOpen]=\"opened()\"\n  [cdkConnectedOverlayOffsetY]=\"4\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayViewportMargin]=\"16\"\n  cdkConnectedOverlayPanelClass=\"tedi-dropdown__overlay-pane\"\n  (overlayKeydown)=\"onKeyDown($event)\"\n  (overlayOutsideClick)=\"close()\"\n>\n  <tedi-card\n    padding=\"none\"\n    class=\"tedi-dropdown__card\"\n    [attr.role]=\"dropdownRole()\"\n    [attr.id]=\"dropdownId()\"\n  >\n    @if (isMobile()) {\n      <tedi-card-content hasSeparator autoWidth padding=\"xs\">\n        <button\n          tedi-closing-button\n          (click)=\"close()\"\n          size=\"small\"\n          class=\"tedi-dropdown__close-button\"\n        ></button>\n      </tedi-card-content>\n    }\n    <tedi-card-content>\n      <ng-content />\n    </tedi-card-content>\n  </tedi-card>\n</ng-template>\n", styles: [".tedi-dropdown__card.tedi-card{box-shadow:0 1px 5px 0 var(--alpha-20, rgba(0, 0, 0, .2));overflow-y:auto}@media (max-width: 575.98px){.tedi-dropdown__card.tedi-card{position:fixed;inset:0}}.tedi-dropdown__close-button{margin-left:auto}@media (max-width: 575.98px){.tedi-dropdown__overlay-pane{transform:none!important}}\n"] }]
+        }] });
+
+const itemRole = {
+    menu: "menuitem",
+    listbox: "option",
+};
+class DropdownItemComponent {
+    element;
+    /**
+     * Applies the selected style to the dropdown item.
+     */
+    selected = input(false);
+    /**
+     * Applies the disabled style to the dropdown item.
+     */
+    // eslint-disable-next-line @angular-eslint/no-input-rename
+    disabledInput = input(false, { alias: "disabled" });
+    disabled; // for cdk/a11y keymanager
+    itemSelected = output();
+    dropdownContext = inject(DropdownComponent, { optional: true });
+    ariaAttributes = computed(() => {
+        const dropdownRole = this.dropdownContext?.dropdownRole();
+        if (!dropdownRole)
+            return {};
+        return {
+            role: itemRole[dropdownRole],
+            disabled: String(this.disabledInput()),
+            selected: dropdownRole === "listbox" ? String(this.selected()) : undefined,
+            tabIndex: 0,
+        };
+    });
+    focus() {
+        this.element.nativeElement.focus();
+    }
+    onKeyDown(event) {
+        if (event.key === "Enter" || event.key === " ") {
+            if (this.element.nativeElement.nodeName === "BUTTON") {
+                event.preventDefault();
+            }
+            if (this.element.nativeElement.nodeName === "A" &&
+                event.key === "Enter") {
+                event.preventDefault();
+            }
+            this.selectItem();
+        }
+    }
+    selectItem() {
+        this.dropdownContext?.close();
+        this.itemSelected.emit();
+    }
+    constructor(element) {
+        this.element = element;
+        effect(() => {
+            this.disabled = this.disabledInput();
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: DropdownItemComponent, isStandalone: true, selector: "[tedi-dropdown-item]", inputs: { selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelected: "itemSelected" }, host: { listeners: { "click": "selectItem()", "keydown": "onKeyDown($event)" }, properties: { "class.tedi-dropdown-item": "true", "class.tedi-dropdown-item--active": "this.selected()", "class.tedi-dropdown-item--disabled": "this.disabledInput()", "attr.role": "ariaAttributes().role", "attr.aria-disabled": "ariaAttributes().disabled", "attr.aria-selected": "ariaAttributes().selected", "attr.tabindex": "ariaAttributes().tabIndex" } }, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-dropdown-item{--_background-color: var(--dropdown-item-default-background);--_color: var(--dropdown-item-default-text);display:block;width:100%;background-color:var(--_background-color);color:var(--_color);cursor:pointer;text-align:left;border:none;border-radius:0}.tedi-dropdown-item{font-family:var(--family-primary-mobile)}@media (min-width: 576px){.tedi-dropdown-item{font-family:var(--family-primary-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{font-family:var(--family-primary-desktop)}}.tedi-dropdown-item{font-weight:var(--body-regular-weight-mobile)}@media (min-width: 576px){.tedi-dropdown-item{font-weight:var(--body-regular-weight-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{font-weight:var(--body-regular-weight-desktop)}}.tedi-dropdown-item{font-size:var(--body-regular-size-mobile)}@media (min-width: 576px){.tedi-dropdown-item{font-size:var(--body-regular-size-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{font-size:var(--body-regular-size-desktop)}}.tedi-dropdown-item{line-height:var(--body-regular-line-height-mobile)}@media (min-width: 576px){.tedi-dropdown-item{line-height:var(--body-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{line-height:var(--body-regular-line-height-desktop)}}.tedi-dropdown-item{padding:var(--form-select-item-padding-y-mobile) var(--form-select-item-padding-x-mobile)}@media (min-width: 576px){.tedi-dropdown-item{padding:var(--form-select-item-padding-y-tablet) var(--form-select-item-padding-x-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{padding:var(--form-select-item-padding-y-desktop) var(--form-select-item-padding-x-desktop)}}.tedi-dropdown-item{--_form-select-item-radius: var(--form-select-item-radius-mobile)}@media (min-width: 576px){.tedi-dropdown-item{--_form-select-item-radius: var(--form-select-item-radius-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{--_form-select-item-radius: var(--form-select-item-radius-desktop)}}.tedi-dropdown-item--active,.tedi-dropdown-item--active:hover{--_background-color: var(--dropdown-item-active-background);--_color: var(--dropdown-item-active-text)}.tedi-dropdown-item--disabled,.tedi-dropdown-item--disabled:hover{--_background-color: var(--dropdown-item-disabled-background);--_color: var(--dropdown-item-disabled-text)}.tedi-dropdown-item:hover:not(.tedi-dropdown-item--active,.tedi-dropdown-item--disabled){--_background-color: var(--dropdown-item-hover-background);--_color: var(--dropdown-item-hover-text)}.tedi-dropdown-item:focus-visible{--_background-color: var(--dropdown-item-hover-background);--_color: var(--dropdown-item-hover-text)}.tedi-dropdown-item:first-child{border-top-left-radius:var(--_form-select-item-radius);border-top-right-radius:var(--_form-select-item-radius)}.tedi-dropdown-item:last-child{border-bottom-left-radius:var(--_form-select-item-radius);border-bottom-right-radius:var(--_form-select-item-radius)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "[tedi-dropdown-item]", template: "<ng-content />", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-dropdown-item]": "true",
+                        "[class.tedi-dropdown-item--active]": "this.selected()",
+                        "[class.tedi-dropdown-item--disabled]": "this.disabledInput()",
+                        "[attr.role]": "ariaAttributes().role",
+                        "[attr.aria-disabled]": "ariaAttributes().disabled",
+                        "[attr.aria-selected]": "ariaAttributes().selected",
+                        "[attr.tabindex]": "ariaAttributes().tabIndex",
+                        "(click)": "selectItem()",
+                        "(keydown)": "onKeyDown($event)",
+                    }, styles: [".tedi-dropdown-item{--_background-color: var(--dropdown-item-default-background);--_color: var(--dropdown-item-default-text);display:block;width:100%;background-color:var(--_background-color);color:var(--_color);cursor:pointer;text-align:left;border:none;border-radius:0}.tedi-dropdown-item{font-family:var(--family-primary-mobile)}@media (min-width: 576px){.tedi-dropdown-item{font-family:var(--family-primary-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{font-family:var(--family-primary-desktop)}}.tedi-dropdown-item{font-weight:var(--body-regular-weight-mobile)}@media (min-width: 576px){.tedi-dropdown-item{font-weight:var(--body-regular-weight-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{font-weight:var(--body-regular-weight-desktop)}}.tedi-dropdown-item{font-size:var(--body-regular-size-mobile)}@media (min-width: 576px){.tedi-dropdown-item{font-size:var(--body-regular-size-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{font-size:var(--body-regular-size-desktop)}}.tedi-dropdown-item{line-height:var(--body-regular-line-height-mobile)}@media (min-width: 576px){.tedi-dropdown-item{line-height:var(--body-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{line-height:var(--body-regular-line-height-desktop)}}.tedi-dropdown-item{padding:var(--form-select-item-padding-y-mobile) var(--form-select-item-padding-x-mobile)}@media (min-width: 576px){.tedi-dropdown-item{padding:var(--form-select-item-padding-y-tablet) var(--form-select-item-padding-x-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{padding:var(--form-select-item-padding-y-desktop) var(--form-select-item-padding-x-desktop)}}.tedi-dropdown-item{--_form-select-item-radius: var(--form-select-item-radius-mobile)}@media (min-width: 576px){.tedi-dropdown-item{--_form-select-item-radius: var(--form-select-item-radius-tablet)}}@media (min-width: 992px){.tedi-dropdown-item{--_form-select-item-radius: var(--form-select-item-radius-desktop)}}.tedi-dropdown-item--active,.tedi-dropdown-item--active:hover{--_background-color: var(--dropdown-item-active-background);--_color: var(--dropdown-item-active-text)}.tedi-dropdown-item--disabled,.tedi-dropdown-item--disabled:hover{--_background-color: var(--dropdown-item-disabled-background);--_color: var(--dropdown-item-disabled-text)}.tedi-dropdown-item:hover:not(.tedi-dropdown-item--active,.tedi-dropdown-item--disabled){--_background-color: var(--dropdown-item-hover-background);--_color: var(--dropdown-item-hover-text)}.tedi-dropdown-item:focus-visible{--_background-color: var(--dropdown-item-hover-background);--_color: var(--dropdown-item-hover-text)}.tedi-dropdown-item:first-child{border-top-left-radius:var(--_form-select-item-radius);border-top-right-radius:var(--_form-select-item-radius)}.tedi-dropdown-item:last-child{border-bottom-left-radius:var(--_form-select-item-radius);border-bottom-right-radius:var(--_form-select-item-radius)}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }] });
+
+const modalBreakpoints = ["xs", "sm", "md", "lg", "xl"];
+class ModalComponent {
+    maxWidth = model("sm");
+    variant = model("default");
+    dialogRef = inject(DialogRef, { optional: true });
+    dialogData = inject(DIALOG_DATA, {
+        optional: true,
+    });
+    // host classes
+    hostClasses = computed(() => {
+        const classes = ["tedi-modal"];
+        if (this.variant() === "small") {
+            classes.push("tedi-modal--padding-small");
+        }
+        for (const breakpoint of modalBreakpoints) {
+            if (this.maxWidth() === breakpoint) {
+                classes.push(`tedi-modal--width-${breakpoint}`);
+            }
+        }
+        return classes.join(" ");
+    });
+    ngOnInit() {
+        const data = this.dialogData;
+        this.dialogRef?.addPanelClass("tedi-modal-panel");
+        if (!data)
+            return;
+        if (data.maxWidth) {
+            this.maxWidth.set(data.maxWidth);
+        }
+        if (data.variant) {
+            this.variant.set(data.variant);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: ModalComponent, isStandalone: true, selector: "tedi-modal", inputs: { maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { maxWidth: "maxWidthChange", variant: "variantChange" }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: "<div class=\"tedi-modal__container\">\n  <ng-content select=\"tedi-modal-header\" />\n  <div class=\"tedi-modal__content\" cdkScrollable>\n    <ng-content />\n  </div>\n\n  <ng-content select=\"tedi-modal-footer\" />\n</div>\n", styles: [".cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;display:flex;max-width:100%;max-height:100%;z-index:1000}.cdk-overlay-backdrop{position:absolute;inset:0;pointer-events:auto;-webkit-tap-highlight-color:transparent;opacity:0;touch-action:manipulation;z-index:1000;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}@media (prefers-reduced-motion){.cdk-overlay-backdrop{transition-duration:1ms}}.cdk-overlay-backdrop-showing{opacity:1}@media (forced-colors: active){.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:#00000052}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,.cdk-high-contrast-active .cdk-overlay-transparent-backdrop{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;display:flex;flex-direction:column;min-width:1px;min-height:1px;z-index:1000}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.cdk-overlay-pane:has(.tedi-modal--width-xs),.tedi-modal--width-xs{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-xs),.tedi-modal--width-xs{max-width:var(--modal-max-width-xs-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-xs),.tedi-modal--width-xs{max-width:var(--modal-max-width-xs-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-xs),.tedi-modal--width-xs{max-width:var(--modal-max-width-xs-desktop)}}.cdk-overlay-pane:has(.tedi-modal--width-sm),.tedi-modal--width-sm{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-sm),.tedi-modal--width-sm{max-width:var(--modal-max-width-sm-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-sm),.tedi-modal--width-sm{max-width:var(--modal-max-width-sm-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-sm),.tedi-modal--width-sm{max-width:var(--modal-max-width-sm-desktop)}}.cdk-overlay-pane:has(.tedi-modal--width-md),.tedi-modal--width-md{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-md),.tedi-modal--width-md{max-width:var(--modal-max-width-md-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-md),.tedi-modal--width-md{max-width:var(--modal-max-width-md-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-md),.tedi-modal--width-md{max-width:var(--modal-max-width-md-desktop)}}.cdk-overlay-pane:has(.tedi-modal--width-lg),.tedi-modal--width-lg{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-lg),.tedi-modal--width-lg{max-width:var(--modal-max-width-lg-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-lg),.tedi-modal--width-lg{max-width:var(--modal-max-width-lg-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-lg),.tedi-modal--width-lg{max-width:var(--modal-max-width-lg-desktop)}}.cdk-overlay-pane:has(.tedi-modal--width-xl),.tedi-modal--width-xl{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-xl),.tedi-modal--width-xl{max-width:var(--modal-max-width-xl-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-xl),.tedi-modal--width-xl{max-width:var(--modal-max-width-xl-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-xl),.tedi-modal--width-xl{max-width:var(--modal-max-width-xl-desktop)}}.tedi-modal{--_modal-border: var(--borders-01) solid var(--modal-border);--_modal-padding: var(--dimensions-13);overflow:auto;----_tedi-modal-heading-padding-x-x-desktop: var(--dimensions-10);----_tedi-modal-heading-padding-x-x-tablet: var(--dimensions-10);----_tedi-modal-heading-padding-x-x-mobile: var(--dimensions-10);----_tedi-modal-heading-padding-x-y-desktop: var(--dimensions-05);----_tedi-modal-heading-padding-x-y-tablet: var(--dimensions-05);----_tedi-modal-heading-padding-x-y-mobile: var(--dimensions-05)}.tedi-modal{--_tedi-modal-heading-padding-x: var(--modal-heading-padding-x-mobile)}@media (min-width: 576px){.tedi-modal{--_tedi-modal-heading-padding-x: var(--modal-heading-padding-x-tablet)}}@media (min-width: 992px){.tedi-modal{--_tedi-modal-heading-padding-x: var(--modal-heading-padding-x-desktop)}}.tedi-modal{--_tedi-modal-heading-padding-y: var(--modal-heading-padding-y-mobile)}@media (min-width: 576px){.tedi-modal{--_tedi-modal-heading-padding-y: var(--modal-heading-padding-y-tablet)}}@media (min-width: 992px){.tedi-modal{--_tedi-modal-heading-padding-y: var(--modal-heading-padding-y-desktop)}}.tedi-modal{--_tedi-modal-footer-padding-x: var(--modal-footer-padding-x-mobile)}@media (min-width: 576px){.tedi-modal{--_tedi-modal-footer-padding-x: var(--modal-footer-padding-x-tablet)}}@media (min-width: 992px){.tedi-modal{--_tedi-modal-footer-padding-x: var(--modal-footer-padding-x-desktop)}}.tedi-modal{--_tedi-modal-footer-padding-y: var(--modal-footer-padding-y-mobile)}@media (min-width: 576px){.tedi-modal{--_tedi-modal-footer-padding-y: var(--modal-footer-padding-y-tablet)}}@media (min-width: 992px){.tedi-modal{--_tedi-modal-footer-padding-y: var(--modal-footer-padding-y-desktop)}}.tedi-modal--padding-small{--modal-heading-padding-x-desktop: var(--dimensions-10);--modal-heading-padding-x-tablet: var(--dimensions-10);--modal-heading-padding-x-mobile: var(--dimensions-10);--modal-heading-padding-y-desktop: var(--dimensions-05);--modal-heading-padding-y-tablet: var(--dimensions-05);--modal-heading-padding-y-mobile: var(--dimensions-05);--modal-footer-padding-x-desktop: var(--dimensions-10);--modal-footer-padding-x-tablet: var(--dimensions-10);--modal-footer-padding-x-mobile: var(--dimensions-10);--modal-footer-padding-y-desktop: var(--dimensions-05);--modal-footer-padding-y-tablet: var(--dimensions-05);--modal-footer-padding-y-mobile: var(--dimensions-05)}.tedi-modal__content{padding:var(--_modal-padding);overflow-y:auto}.tedi-modal__container{display:flex;flex-direction:column;max-height:95dvh;background-color:var(--modal-background);border:var(--_modal-border)}.tedi-modal__container{border-radius:var(--modal-radius-mobile)}@media (min-width: 576px){.tedi-modal__container{border-radius:var(--modal-radius-tablet)}}@media (min-width: 992px){.tedi-modal__container{border-radius:var(--modal-radius-desktop)}}\n"], dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-modal", imports: [DialogModule, CdkScrollable], encapsulation: ViewEncapsulation.None, host: {
+                        "[class]": "hostClasses()",
+                    }, template: "<div class=\"tedi-modal__container\">\n  <ng-content select=\"tedi-modal-header\" />\n  <div class=\"tedi-modal__content\" cdkScrollable>\n    <ng-content />\n  </div>\n\n  <ng-content select=\"tedi-modal-footer\" />\n</div>\n", styles: [".cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;display:flex;max-width:100%;max-height:100%;z-index:1000}.cdk-overlay-backdrop{position:absolute;inset:0;pointer-events:auto;-webkit-tap-highlight-color:transparent;opacity:0;touch-action:manipulation;z-index:1000;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}@media (prefers-reduced-motion){.cdk-overlay-backdrop{transition-duration:1ms}}.cdk-overlay-backdrop-showing{opacity:1}@media (forced-colors: active){.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:#00000052}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,.cdk-high-contrast-active .cdk-overlay-transparent-backdrop{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;display:flex;flex-direction:column;min-width:1px;min-height:1px;z-index:1000}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.cdk-overlay-pane:has(.tedi-modal--width-xs),.tedi-modal--width-xs{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-xs),.tedi-modal--width-xs{max-width:var(--modal-max-width-xs-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-xs),.tedi-modal--width-xs{max-width:var(--modal-max-width-xs-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-xs),.tedi-modal--width-xs{max-width:var(--modal-max-width-xs-desktop)}}.cdk-overlay-pane:has(.tedi-modal--width-sm),.tedi-modal--width-sm{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-sm),.tedi-modal--width-sm{max-width:var(--modal-max-width-sm-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-sm),.tedi-modal--width-sm{max-width:var(--modal-max-width-sm-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-sm),.tedi-modal--width-sm{max-width:var(--modal-max-width-sm-desktop)}}.cdk-overlay-pane:has(.tedi-modal--width-md),.tedi-modal--width-md{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-md),.tedi-modal--width-md{max-width:var(--modal-max-width-md-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-md),.tedi-modal--width-md{max-width:var(--modal-max-width-md-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-md),.tedi-modal--width-md{max-width:var(--modal-max-width-md-desktop)}}.cdk-overlay-pane:has(.tedi-modal--width-lg),.tedi-modal--width-lg{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-lg),.tedi-modal--width-lg{max-width:var(--modal-max-width-lg-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-lg),.tedi-modal--width-lg{max-width:var(--modal-max-width-lg-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-lg),.tedi-modal--width-lg{max-width:var(--modal-max-width-lg-desktop)}}.cdk-overlay-pane:has(.tedi-modal--width-xl),.tedi-modal--width-xl{width:100%}.cdk-overlay-pane:has(.tedi-modal--width-xl),.tedi-modal--width-xl{max-width:var(--modal-max-width-xl-mobile)}@media (min-width: 576px){.cdk-overlay-pane:has(.tedi-modal--width-xl),.tedi-modal--width-xl{max-width:var(--modal-max-width-xl-tablet)}}@media (min-width: 992px){.cdk-overlay-pane:has(.tedi-modal--width-xl),.tedi-modal--width-xl{max-width:var(--modal-max-width-xl-desktop)}}.tedi-modal{--_modal-border: var(--borders-01) solid var(--modal-border);--_modal-padding: var(--dimensions-13);overflow:auto;----_tedi-modal-heading-padding-x-x-desktop: var(--dimensions-10);----_tedi-modal-heading-padding-x-x-tablet: var(--dimensions-10);----_tedi-modal-heading-padding-x-x-mobile: var(--dimensions-10);----_tedi-modal-heading-padding-x-y-desktop: var(--dimensions-05);----_tedi-modal-heading-padding-x-y-tablet: var(--dimensions-05);----_tedi-modal-heading-padding-x-y-mobile: var(--dimensions-05)}.tedi-modal{--_tedi-modal-heading-padding-x: var(--modal-heading-padding-x-mobile)}@media (min-width: 576px){.tedi-modal{--_tedi-modal-heading-padding-x: var(--modal-heading-padding-x-tablet)}}@media (min-width: 992px){.tedi-modal{--_tedi-modal-heading-padding-x: var(--modal-heading-padding-x-desktop)}}.tedi-modal{--_tedi-modal-heading-padding-y: var(--modal-heading-padding-y-mobile)}@media (min-width: 576px){.tedi-modal{--_tedi-modal-heading-padding-y: var(--modal-heading-padding-y-tablet)}}@media (min-width: 992px){.tedi-modal{--_tedi-modal-heading-padding-y: var(--modal-heading-padding-y-desktop)}}.tedi-modal{--_tedi-modal-footer-padding-x: var(--modal-footer-padding-x-mobile)}@media (min-width: 576px){.tedi-modal{--_tedi-modal-footer-padding-x: var(--modal-footer-padding-x-tablet)}}@media (min-width: 992px){.tedi-modal{--_tedi-modal-footer-padding-x: var(--modal-footer-padding-x-desktop)}}.tedi-modal{--_tedi-modal-footer-padding-y: var(--modal-footer-padding-y-mobile)}@media (min-width: 576px){.tedi-modal{--_tedi-modal-footer-padding-y: var(--modal-footer-padding-y-tablet)}}@media (min-width: 992px){.tedi-modal{--_tedi-modal-footer-padding-y: var(--modal-footer-padding-y-desktop)}}.tedi-modal--padding-small{--modal-heading-padding-x-desktop: var(--dimensions-10);--modal-heading-padding-x-tablet: var(--dimensions-10);--modal-heading-padding-x-mobile: var(--dimensions-10);--modal-heading-padding-y-desktop: var(--dimensions-05);--modal-heading-padding-y-tablet: var(--dimensions-05);--modal-heading-padding-y-mobile: var(--dimensions-05);--modal-footer-padding-x-desktop: var(--dimensions-10);--modal-footer-padding-x-tablet: var(--dimensions-10);--modal-footer-padding-x-mobile: var(--dimensions-10);--modal-footer-padding-y-desktop: var(--dimensions-05);--modal-footer-padding-y-tablet: var(--dimensions-05);--modal-footer-padding-y-mobile: var(--dimensions-05)}.tedi-modal__content{padding:var(--_modal-padding);overflow-y:auto}.tedi-modal__container{display:flex;flex-direction:column;max-height:95dvh;background-color:var(--modal-background);border:var(--_modal-border)}.tedi-modal__container{border-radius:var(--modal-radius-mobile)}@media (min-width: 576px){.tedi-modal__container{border-radius:var(--modal-radius-tablet)}}@media (min-width: 992px){.tedi-modal__container{border-radius:var(--modal-radius-desktop)}}\n"] }]
+        }] });
+
+class ModalFooterComponent {
+    align = model("flex-end");
+    buttons = model();
+    dialogData = inject(DIALOG_DATA, {
+        optional: true,
+    });
+    ngOnInit() {
+        const data = this.dialogData;
+        if (!data)
+            return;
+        const { buttons, align: alignButtons } = data;
+        if (buttons) {
+            this.buttons.set(buttons);
+        }
+        if (alignButtons) {
+            this.align.set(alignButtons);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ModalFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ModalFooterComponent, isStandalone: true, selector: "tedi-modal-footer", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { align: "alignChange", buttons: "buttonsChange" }, ngImport: i0, template: "<div class=\"tedi-modal-footer\" [style.justify-content]=\"align()\">\n  <ng-content>\n    @for (button of buttons(); track button.label) {\n      <button\n        tedi-button\n        [size]=\"button.size || 'small'\"\n        [variant]=\"button.variant || 'secondary'\"\n        [disabled]=\"button.disabled\"\n        [ngStyle]=\"button.style\"\n        (click)=\"button.action()\"\n      >\n        @if (button.icon && button.iconPosition == \"start\") {\n          <tedi-icon [name]=\"button.icon\" />\n        }\n        {{ button.label }}\n        @if (button.icon && button.iconPosition == \"end\") {\n          <tedi-icon [name]=\"button.icon\" />\n        }\n      </button>\n    }\n  </ng-content>\n</div>\n", styles: [".tedi-modal-footer{--_modal-footer-gap: .5rem;display:flex;gap:var(--_modal-footer-gap);border-top:var(--_modal-border);padding:var(--_tedi-modal-footer-padding-y) var(--_tedi-modal-footer-padding-x)}\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: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ModalFooterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-modal-footer", imports: [ButtonComponent, IconComponent, NgStyle], template: "<div class=\"tedi-modal-footer\" [style.justify-content]=\"align()\">\n  <ng-content>\n    @for (button of buttons(); track button.label) {\n      <button\n        tedi-button\n        [size]=\"button.size || 'small'\"\n        [variant]=\"button.variant || 'secondary'\"\n        [disabled]=\"button.disabled\"\n        [ngStyle]=\"button.style\"\n        (click)=\"button.action()\"\n      >\n        @if (button.icon && button.iconPosition == \"start\") {\n          <tedi-icon [name]=\"button.icon\" />\n        }\n        {{ button.label }}\n        @if (button.icon && button.iconPosition == \"end\") {\n          <tedi-icon [name]=\"button.icon\" />\n        }\n      </button>\n    }\n  </ng-content>\n</div>\n", styles: [".tedi-modal-footer{--_modal-footer-gap: .5rem;display:flex;gap:var(--_modal-footer-gap);border-top:var(--_modal-border);padding:var(--_tedi-modal-footer-padding-y) var(--_tedi-modal-footer-padding-x)}\n"] }]
+        }] });
+
+class ModalHeaderComponent {
+    title = model("Title");
+    feedback = model();
+    closeButton = model(true);
+    dialogRef = inject(DialogRef, { optional: true });
+    dialogData = inject(DIALOG_DATA, {
+        optional: true,
+    });
+    closeModal() {
+        this.dialogRef?.close();
+    }
+    ngOnInit() {
+        const data = this.dialogData;
+        if (!data)
+            return;
+        const { title, feedback, closeButton } = data;
+        if (title) {
+            this.title.set(title);
+        }
+        if (feedback) {
+            this.feedback.set({
+                ...feedback,
+            });
+        }
+        if (typeof closeButton === "boolean") {
+            this.closeButton.set(data.closeButton);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ModalHeaderComponent, isStandalone: true, selector: "tedi-modal-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, feedback: { classPropertyName: "feedback", publicName: "feedback", isSignal: true, isRequired: false, transformFunction: null }, closeButton: { classPropertyName: "closeButton", publicName: "closeButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { title: "titleChange", feedback: "feedbackChange", closeButton: "closeButtonChange" }, ngImport: i0, template: "<div class=\"tedi-modal-header\">\n  <div class=\"tedi-modal-header__title\">\n    <ng-content>\n      <h1 tedi-text modifiers=\"h3\">\n        {{ title() }}\n      </h1>\n    </ng-content>\n\n    <ng-content select=\"[header-exit-button]\">\n      @if (closeButton()) {\n        <button\n          tedi-closing-button\n          variant=\"neutral\"\n          (click)=\"closeModal()\"\n        ></button>\n      }\n    </ng-content>\n  </div>\n\n  @if (feedback()) {\n    <tedi-feedback-text\n      [text]=\"feedback()!.text\"\n      [type]=\"feedback()!.type\"\n      [position]=\"feedback()!.position\"\n    />\n  }\n</div>\n", styles: [".tedi-modal-header{border-bottom:var(--_modal-border);padding:var(--_tedi-modal-heading-padding-y) var(--_tedi-modal-heading-padding-x)}.tedi-modal-header__title{display:flex;justify-content:space-between;align-items:center}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ModalHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-modal-header", imports: [FeedbackTextComponent, ClosingButtonComponent, TextComponent], template: "<div class=\"tedi-modal-header\">\n  <div class=\"tedi-modal-header__title\">\n    <ng-content>\n      <h1 tedi-text modifiers=\"h3\">\n        {{ title() }}\n      </h1>\n    </ng-content>\n\n    <ng-content select=\"[header-exit-button]\">\n      @if (closeButton()) {\n        <button\n          tedi-closing-button\n          variant=\"neutral\"\n          (click)=\"closeModal()\"\n        ></button>\n      }\n    </ng-content>\n  </div>\n\n  @if (feedback()) {\n    <tedi-feedback-text\n      [text]=\"feedback()!.text\"\n      [type]=\"feedback()!.type\"\n      [position]=\"feedback()!.position\"\n    />\n  }\n</div>\n", styles: [".tedi-modal-header{border-bottom:var(--_modal-border);padding:var(--_tedi-modal-heading-padding-y) var(--_tedi-modal-heading-padding-x)}.tedi-modal-header__title{display:flex;justify-content:space-between;align-items:center}\n"] }]
+        }] });
+
+class SelectComponent {
+    /**
+     * The id of the select input (for label association).
+     * @default ""
+     */
+    inputId = input.required();
+    /**
+     * The label for the select input.
+     * @default ""
+     */
+    label = input();
+    /**
+     * Should show label as required?
+     * @default false
+     */
+    required = input(false);
+    /**
+     * The placeholder text to display when no option is selected.
+     * @default ""
+     */
+    placeholder = input("");
+    /**
+     * The state of the input.
+     * @default "default"
+     */
+    state = input("default");
+    /**
+     * The size of the input.
+     * @default "default"
+     */
+    size = input("default");
+    /**
+     * Whether the clear button will be shown when an option is selected.
+     * @default false
+     */
+    clearable = input(true);
+    feedbackText = input();
+    isOpen = signal(false);
+    selectedOptions = signal([]);
+    listboxRef = viewChild(CdkListbox, { read: ElementRef });
+    triggerRef = viewChild(CdkOverlayOrigin, { read: ElementRef });
+    hostRef = inject(ElementRef);
+    options = contentChildren(SelectOptionComponent);
+    dropdownWidth = signal(0);
+    disabled = signal(false);
+    optionGroups = computed(() => {
+        const groups = [];
+        this.options().forEach((option) => {
+            const group = groups.find((g) => g.label === option.group());
+            if (group) {
+                group.options.push(option);
+            }
+            else {
+                groups.push({ label: option.group() ?? "", options: [option] });
+            }
+        });
+        return groups;
+    });
+    ngAfterContentChecked() {
+        this.setDropdownWidth();
+    }
+    onWindowResize() {
+        this.setDropdownWidth();
+    }
+    toggleIsOpen(value) {
+        if (this.disabled())
+            return;
+        if (value === undefined) {
+            this.isOpen.update((previousValue) => !previousValue);
+        }
+        else if (value === false) {
+            this.isOpen.set(value);
+            this.focusTrigger();
+        }
+    }
+    handleValueChange(event) {
+        const selected = event.value[0] ?? null;
+        this.selectedOptions.set(selected ? [selected] : []);
+        this.onChange(selected);
+        this.onTouched();
+        this.toggleIsOpen(false);
+    }
+    clear(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        this.selectedOptions.set([]);
+        this.onChange(null);
+        this.onTouched();
+    }
+    focusListboxWhenVisible = effect(() => {
+        if (this.listboxRef())
+            this.listboxRef()?.nativeElement.focus();
+    });
+    focusTrigger() {
+        this.triggerRef()?.nativeElement.focus();
+    }
+    isOptionSelected(option) {
+        return this.selectedOptions().includes(option);
+    }
+    selectedLabels = computed(() => {
+        return this.options()
+            .filter((option) => this.isOptionSelected(option.value()))
+            .map((option) => option.label());
+    });
+    setDropdownWidth() {
+        const computedWidth = this.hostRef?.nativeElement?.getBoundingClientRect()?.width ?? 0;
+        this.dropdownWidth.set(computedWidth);
+    }
+    // ControlValueAccessor implementation
+    onChange = () => { };
+    onTouched = () => { };
+    writeValue(value) {
+        this.selectedOptions.set(value ? [value] : []);
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled.set(isDisabled);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: SelectComponent, isStandalone: true, selector: "tedi-select", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", 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 }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onWindowResize()" }, classAttribute: "tedi-select" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => SelectComponent),
+                multi: true,
+            },
+        ], queries: [{ propertyName: "options", predicate: SelectOptionComponent, isSignal: true }], viewQueries: [{ propertyName: "listboxRef", first: true, predicate: CdkListbox, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "triggerRef", first: true, predicate: CdkOverlayOrigin, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@let listboxId = inputId() + \"-listbox\";\n@let labelId = inputId() + \"-label\";\n\n@if (label()) {\n  <label\n    [id]=\"labelId\"\n    tedi-label\n    [for]=\"inputId()\"\n    [required]=\"required()\"\n    [size]=\"size()\"\n  >\n    {{ label() }}\n  </label>\n}\n<div\n  [id]=\"inputId()\"\n  class=\"tedi-select__trigger\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  tedi-input\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  role=\"combobox\"\n  aria-haspopup=\"listbox\"\n  [attr.aria-expanded]=\"isOpen()\"\n  [attr.aria-controls]=\"listboxId\"\n  [attr.aria-labelledby]=\"labelId\"\n  [tabindex]=\"disabled() ? -1 : 0\"\n  [state]=\"state()\"\n  [size]=\"size()\"\n  (click)=\"toggleIsOpen()\"\n  (keydown.enter)=\"toggleIsOpen()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  <span class=\"tedi-select__label\">\n    @if (selectedLabels().length) {\n      {{ selectedLabels() }}\n    } @else {\n      <span class=\"tedi-select__label--placeholder\">\n        {{ placeholder() }}\n      </span>\n    }\n  </span>\n\n  @if (clearable() && selectedOptions().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      title=\"Clear\"\n      (click)=\"clear($event)\"\n    ></button>\n  }\n\n  <tedi-icon class=\"tedi-select__arrow\" name=\"arrow_drop_down\" />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayHasBackdrop]=\"true\"\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  (backdropClick)=\"toggleIsOpen(false)\"\n  (detach)=\"toggleIsOpen(false)\"\n>\n  <tedi-card\n    class=\"tedi-select__dropdown\"\n    spacing=\"none\"\n    [style.width.px]=\"dropdownWidth()\"\n  >\n    <tedi-card-content>\n      <ul\n        [id]=\"listboxId\"\n        class=\"tedi-select__options\"\n        cdkListbox\n        cdkListboxUseActiveDescendant\n        [cdkListboxValue]=\"selectedOptions()\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n      >\n        @if (options().length) {\n          @for (group of optionGroups(); track $index) {\n            @if (group.label.length > 0) {\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            @for (option of group.options; track option.value()) {\n              <li\n                tedi-dropdown-item\n                [selected]=\"isOptionSelected(option.value())\"\n                [cdkOption]=\"option.value()\"\n                [cdkOptionDisabled]=\"option.disabled()\"\n                [disabled]=\"option.disabled()\"\n              >\n                @if (option.templateRef(); as optionNgContent) {\n                  <div class=\"tedi-select__dropdown-item--custom-content\">\n                    <ng-container [ngTemplateOutlet]=\"optionNgContent\" />\n                  </div>\n                  <span class=\"tedi-select__dropdown-item--label\">\n                    {{ option.label() }}\n                  </span>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li tedi-dropdown-item class=\"tedi-select__no-options\">\n            {{ \"select.no-options\" | tediTranslate }}\n          </li>\n        }\n      </ul>\n    </tedi-card-content>\n  </tedi-card>\n</ng-template>\n", styles: [".tedi-select{display:block;width:100%}.tedi-select{--_inner-gap: var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-desktop)}}.tedi-select__trigger{display:flex;width:100%;justify-content:space-between}.tedi-select__label{overflow:hidden;text-align:left;flex-grow:1;cursor:default}.tedi-select__label--placeholder{pointer-events:none;color:var(--_placeholder-color)}.tedi-select__clear{padding:0;margin:0;border:none;background:none;flex-grow:0;color:var(--button-close-text-default);cursor:pointer}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{flex-grow:0;cursor:default}.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__dropdown{box-shadow:0 1px 5px 0 var(--alpha-20);max-height:300px;overflow-y:auto}.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-desktop)}}.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-desktop)}}.tedi-select__options{margin:0;padding:0}.tedi-select__options:focus .cdk-option-active{background:var(--dropdown-item-hover-background);color:var(--dropdown-item-hover-text)}.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;text-transform:uppercase;letter-spacing:0px;padding:8px 12px 4px}.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-desktop)}}.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-desktop)}}.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-mobile)}@media (min-width: 576px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-tablet)}}@media (min-width: 992px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-desktop)}}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-mobile)}@media (min-width: 576px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-tablet)}}@media (min-width: 992px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-desktop)}}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex-wrap:wrap;gap:var(--_inner-gap)}.tedi-select__multiselect-container--single-row{overflow:hidden;flex-wrap:nowrap}.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-checkbox{pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.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: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { 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: "component", type: InputComponent, selector: "[tedi-input]", inputs: ["size", "state"] }, { kind: "component", type: CardComponent, selector: "tedi-card", inputs: ["borderless", "spacing", "accentBorder", "selected"] }, { kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["hasSeparator", "autoWidth", "timeline"] }, { kind: "component", type: DropdownItemComponent, selector: "[tedi-dropdown-item]", inputs: ["selected", "disabled"], outputs: ["itemSelected"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: LabelComponent, selector: "label[tedi-label]", inputs: ["size", "required"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SelectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-select", imports: [
+                        CommonModule,
+                        OverlayModule,
+                        CdkListboxModule,
+                        InputComponent,
+                        CardComponent,
+                        CardContentComponent,
+                        DropdownItemComponent,
+                        ClosingButtonComponent,
+                        IconComponent,
+                        LabelComponent,
+                        FeedbackTextComponent,
+                        TextComponent,
+                        TediTranslationPipe,
+                    ], standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: "tedi-select",
+                    }, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => SelectComponent),
+                            multi: true,
+                        },
+                    ], template: "@let listboxId = inputId() + \"-listbox\";\n@let labelId = inputId() + \"-label\";\n\n@if (label()) {\n  <label\n    [id]=\"labelId\"\n    tedi-label\n    [for]=\"inputId()\"\n    [required]=\"required()\"\n    [size]=\"size()\"\n  >\n    {{ label() }}\n  </label>\n}\n<div\n  [id]=\"inputId()\"\n  class=\"tedi-select__trigger\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  tedi-input\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  role=\"combobox\"\n  aria-haspopup=\"listbox\"\n  [attr.aria-expanded]=\"isOpen()\"\n  [attr.aria-controls]=\"listboxId\"\n  [attr.aria-labelledby]=\"labelId\"\n  [tabindex]=\"disabled() ? -1 : 0\"\n  [state]=\"state()\"\n  [size]=\"size()\"\n  (click)=\"toggleIsOpen()\"\n  (keydown.enter)=\"toggleIsOpen()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  <span class=\"tedi-select__label\">\n    @if (selectedLabels().length) {\n      {{ selectedLabels() }}\n    } @else {\n      <span class=\"tedi-select__label--placeholder\">\n        {{ placeholder() }}\n      </span>\n    }\n  </span>\n\n  @if (clearable() && selectedOptions().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      title=\"Clear\"\n      (click)=\"clear($event)\"\n    ></button>\n  }\n\n  <tedi-icon class=\"tedi-select__arrow\" name=\"arrow_drop_down\" />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayHasBackdrop]=\"true\"\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  (backdropClick)=\"toggleIsOpen(false)\"\n  (detach)=\"toggleIsOpen(false)\"\n>\n  <tedi-card\n    class=\"tedi-select__dropdown\"\n    spacing=\"none\"\n    [style.width.px]=\"dropdownWidth()\"\n  >\n    <tedi-card-content>\n      <ul\n        [id]=\"listboxId\"\n        class=\"tedi-select__options\"\n        cdkListbox\n        cdkListboxUseActiveDescendant\n        [cdkListboxValue]=\"selectedOptions()\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n      >\n        @if (options().length) {\n          @for (group of optionGroups(); track $index) {\n            @if (group.label.length > 0) {\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            @for (option of group.options; track option.value()) {\n              <li\n                tedi-dropdown-item\n                [selected]=\"isOptionSelected(option.value())\"\n                [cdkOption]=\"option.value()\"\n                [cdkOptionDisabled]=\"option.disabled()\"\n                [disabled]=\"option.disabled()\"\n              >\n                @if (option.templateRef(); as optionNgContent) {\n                  <div class=\"tedi-select__dropdown-item--custom-content\">\n                    <ng-container [ngTemplateOutlet]=\"optionNgContent\" />\n                  </div>\n                  <span class=\"tedi-select__dropdown-item--label\">\n                    {{ option.label() }}\n                  </span>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li tedi-dropdown-item class=\"tedi-select__no-options\">\n            {{ \"select.no-options\" | tediTranslate }}\n          </li>\n        }\n      </ul>\n    </tedi-card-content>\n  </tedi-card>\n</ng-template>\n", styles: [".tedi-select{display:block;width:100%}.tedi-select{--_inner-gap: var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-desktop)}}.tedi-select__trigger{display:flex;width:100%;justify-content:space-between}.tedi-select__label{overflow:hidden;text-align:left;flex-grow:1;cursor:default}.tedi-select__label--placeholder{pointer-events:none;color:var(--_placeholder-color)}.tedi-select__clear{padding:0;margin:0;border:none;background:none;flex-grow:0;color:var(--button-close-text-default);cursor:pointer}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{flex-grow:0;cursor:default}.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__dropdown{box-shadow:0 1px 5px 0 var(--alpha-20);max-height:300px;overflow-y:auto}.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-desktop)}}.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-desktop)}}.tedi-select__options{margin:0;padding:0}.tedi-select__options:focus .cdk-option-active{background:var(--dropdown-item-hover-background);color:var(--dropdown-item-hover-text)}.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;text-transform:uppercase;letter-spacing:0px;padding:8px 12px 4px}.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-desktop)}}.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-desktop)}}.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-mobile)}@media (min-width: 576px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-tablet)}}@media (min-width: 992px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-desktop)}}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-mobile)}@media (min-width: 576px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-tablet)}}@media (min-width: 992px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-desktop)}}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex-wrap:wrap;gap:var(--_inner-gap)}.tedi-select__multiselect-container--single-row{overflow:hidden;flex-wrap:nowrap}.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-checkbox{pointer-events:none}\n"] }]
+        }], propDecorators: { onWindowResize: [{
+                type: HostListener,
+                args: ["window:resize"]
+            }] } });
+
+class TagComponent {
+    /**
+     * Whether the tag is in loading state.
+     * When true, a spinner will be displayed inside the tag.
+     * @default false
+     */
+    loading = input(false);
+    /**
+     * Whether the tag can be closed.
+     * When true, a close button will be displayed that emits the 'closed' event when clicked.
+     * @default false
+     */
+    closable = input(false);
+    /**
+     * The visual style of the tag.
+     * Possible values: 'primary', 'secondary', 'danger'
+     * @default "primary"
+     */
+    type = input("primary");
+    /**
+     * Event emitted when the close button is clicked.
+     * Only relevant when closable is true.
+     */
+    closed = output();
+    classes = computed(() => {
+        const classList = [];
+        if (this.type()) {
+            classList.push(`tedi-tag--${this.type()}`);
+        }
+        return classList.join(" ");
+    });
+    handleClose(event) {
+        this.closed.emit(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TagComponent, isStandalone: true, selector: "tedi-tag", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, host: { properties: { "class.tedi-tag": "true", "class.tedi-tag--loading": "loading()", "class.tedi-tag--closable": "closable()", "class": "classes()" } }, ngImport: i0, template: "@if (type() === \"danger\") {\n  <span class=\"tedi-tag__icon-wrapper\">\n    <tedi-icon name=\"error\" color=\"danger\" [size]=\"16\" />\n  </span>\n}\n\n<span class=\"tedi-tag__content\">\n  <ng-content />\n</span>\n\n@if (loading()) {\n  <span class=\"tedi-tag__spinner-wrapper\">\n    <tedi-spinner [size]=\"10\" />\n  </span>\n} @else if (closable()) {\n  <!-- TODO: Not sure about the aria-label and title here. Should they come from input and be translatable? -->\n  <button\n    type=\"button\"\n    class=\"tedi-tag__closing-button\"\n    [attr.aria-label]=\"'remove' | tediTranslate\"\n    [title]=\"'remove' | tediTranslate\"\n    (click)=\"handleClose($event)\"\n  >\n    <tedi-icon name=\"close\" [size]=\"18\" />\n  </button>\n}\n", styles: [".tedi-tag{--_background-color: var(--tag-primary-background);--_border-color: var(--tag-primary-border);--_border-width: 1px;--_tag-padding-y: calc(var(--tag-default-padding-y) - var(--_border-width));display:inline-flex;align-items:flex-start;gap:var(--_gap-x);padding:0 var(--_padding-x);background-color:var(--_background-color);border:var(--_border-width) solid;border-color:var(--_border-color);border-radius:var(--_border-radius);font-family:var(--family-primary);color:var(--general-text-primary);line-height:var(--_line-height);overflow:hidden}.tedi-tag{--_padding-y: var(--tag-default-padding-y-mobile)}@media (min-width: 576px){.tedi-tag{--_padding-y: var(--tag-default-padding-y-tablet)}}@media (min-width: 992px){.tedi-tag{--_padding-y: var(--tag-default-padding-y-desktop)}}.tedi-tag{--_padding-x: var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-tag{--_padding-x: var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-tag{--_padding-x: var(--tag-default-padding-x-desktop)}}.tedi-tag{--_border-radius: var(--tag-default-radius-mobile)}@media (min-width: 576px){.tedi-tag{--_border-radius: var(--tag-default-radius-tablet)}}@media (min-width: 992px){.tedi-tag{--_border-radius: var(--tag-default-radius-desktop)}}.tedi-tag{--_gap-x: var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-tag{--_gap-x: var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-tag{--_gap-x: var(--tag-default-padding-x-desktop)}}.tedi-tag{font-weight:var(--body-small-regular-weight-mobile)}@media (min-width: 576px){.tedi-tag{font-weight:var(--body-small-regular-weight-tablet)}}@media (min-width: 992px){.tedi-tag{font-weight:var(--body-small-regular-weight-desktop)}}.tedi-tag{font-size:var(--body-small-regular-size-mobile)}@media (min-width: 576px){.tedi-tag{font-size:var(--body-small-regular-size-tablet)}}@media (min-width: 992px){.tedi-tag{font-size:var(--body-small-regular-size-desktop)}}.tedi-tag{--_line-height: var(--body-small-regular-line-height-mobile)}@media (min-width: 576px){.tedi-tag{--_line-height: var(--body-small-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-tag{--_line-height: var(--body-small-regular-line-height-desktop)}}.tedi-tag{--_tag-padding-y: var(--tag-default-padding-y-mobile)}@media (min-width: 576px){.tedi-tag{--_tag-padding-y: var(--tag-default-padding-y-tablet)}}@media (min-width: 992px){.tedi-tag{--_tag-padding-y: var(--tag-default-padding-y-desktop)}}.tedi-tag__content{padding:calc(var(--_tag-padding-y) - var(--_border-width)) 0}.tedi-tag__icon-wrapper{line-height:calc(var(--_line-height) + var(--_tag-padding-y))}.tedi-tag__closing-button{display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;margin:0;border:none;background-color:#00000003;transition:background-color .3s ease-in-out;height:calc(var(--_button-height) - var(--_border-width) * 2)}.tedi-tag__closing-button{--_button-height: var(--button-xs-icon-size-mobile)}@media (min-width: 576px){.tedi-tag__closing-button{--_button-height: var(--button-xs-icon-size-tablet)}}@media (min-width: 992px){.tedi-tag__closing-button{--_button-height: var(--button-xs-icon-size-desktop)}}.tedi-tag__closing-button{min-width:var(--button-xs-icon-size-mobile)}@media (min-width: 576px){.tedi-tag__closing-button{min-width:var(--button-xs-icon-size-tablet)}}@media (min-width: 992px){.tedi-tag__closing-button{min-width:var(--button-xs-icon-size-desktop)}}.tedi-tag__closing-button:hover,.tedi-tag__closing-button:focus{background-color:#0000001a}.tedi-tag__spinner-wrapper{display:flex;align-items:center;height:calc(var(--_line-height) + var(--_tag-padding-y))}.tedi-tag--closable:not(.tedi-tag--loading){padding-right:0}.tedi-tag--secondary{--_background-color: var(--tag-secondary-background);--_border-color: var(--tag-secondary-border)}.tedi-tag--danger{--_background-color: var(--tag-danger-background);--_border-color: var(--tag-danger-border)}\n"], dependencies: [{ kind: "component", type: SpinnerComponent, selector: "tedi-spinner", inputs: ["size", "color", "label"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TagComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-tag", imports: [SpinnerComponent, IconComponent, TediTranslationPipe], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-tag]": "true",
+                        "[class.tedi-tag--loading]": "loading()",
+                        "[class.tedi-tag--closable]": "closable()",
+                        "[class]": "classes()",
+                    }, template: "@if (type() === \"danger\") {\n  <span class=\"tedi-tag__icon-wrapper\">\n    <tedi-icon name=\"error\" color=\"danger\" [size]=\"16\" />\n  </span>\n}\n\n<span class=\"tedi-tag__content\">\n  <ng-content />\n</span>\n\n@if (loading()) {\n  <span class=\"tedi-tag__spinner-wrapper\">\n    <tedi-spinner [size]=\"10\" />\n  </span>\n} @else if (closable()) {\n  <!-- TODO: Not sure about the aria-label and title here. Should they come from input and be translatable? -->\n  <button\n    type=\"button\"\n    class=\"tedi-tag__closing-button\"\n    [attr.aria-label]=\"'remove' | tediTranslate\"\n    [title]=\"'remove' | tediTranslate\"\n    (click)=\"handleClose($event)\"\n  >\n    <tedi-icon name=\"close\" [size]=\"18\" />\n  </button>\n}\n", styles: [".tedi-tag{--_background-color: var(--tag-primary-background);--_border-color: var(--tag-primary-border);--_border-width: 1px;--_tag-padding-y: calc(var(--tag-default-padding-y) - var(--_border-width));display:inline-flex;align-items:flex-start;gap:var(--_gap-x);padding:0 var(--_padding-x);background-color:var(--_background-color);border:var(--_border-width) solid;border-color:var(--_border-color);border-radius:var(--_border-radius);font-family:var(--family-primary);color:var(--general-text-primary);line-height:var(--_line-height);overflow:hidden}.tedi-tag{--_padding-y: var(--tag-default-padding-y-mobile)}@media (min-width: 576px){.tedi-tag{--_padding-y: var(--tag-default-padding-y-tablet)}}@media (min-width: 992px){.tedi-tag{--_padding-y: var(--tag-default-padding-y-desktop)}}.tedi-tag{--_padding-x: var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-tag{--_padding-x: var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-tag{--_padding-x: var(--tag-default-padding-x-desktop)}}.tedi-tag{--_border-radius: var(--tag-default-radius-mobile)}@media (min-width: 576px){.tedi-tag{--_border-radius: var(--tag-default-radius-tablet)}}@media (min-width: 992px){.tedi-tag{--_border-radius: var(--tag-default-radius-desktop)}}.tedi-tag{--_gap-x: var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-tag{--_gap-x: var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-tag{--_gap-x: var(--tag-default-padding-x-desktop)}}.tedi-tag{font-weight:var(--body-small-regular-weight-mobile)}@media (min-width: 576px){.tedi-tag{font-weight:var(--body-small-regular-weight-tablet)}}@media (min-width: 992px){.tedi-tag{font-weight:var(--body-small-regular-weight-desktop)}}.tedi-tag{font-size:var(--body-small-regular-size-mobile)}@media (min-width: 576px){.tedi-tag{font-size:var(--body-small-regular-size-tablet)}}@media (min-width: 992px){.tedi-tag{font-size:var(--body-small-regular-size-desktop)}}.tedi-tag{--_line-height: var(--body-small-regular-line-height-mobile)}@media (min-width: 576px){.tedi-tag{--_line-height: var(--body-small-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-tag{--_line-height: var(--body-small-regular-line-height-desktop)}}.tedi-tag{--_tag-padding-y: var(--tag-default-padding-y-mobile)}@media (min-width: 576px){.tedi-tag{--_tag-padding-y: var(--tag-default-padding-y-tablet)}}@media (min-width: 992px){.tedi-tag{--_tag-padding-y: var(--tag-default-padding-y-desktop)}}.tedi-tag__content{padding:calc(var(--_tag-padding-y) - var(--_border-width)) 0}.tedi-tag__icon-wrapper{line-height:calc(var(--_line-height) + var(--_tag-padding-y))}.tedi-tag__closing-button{display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;margin:0;border:none;background-color:#00000003;transition:background-color .3s ease-in-out;height:calc(var(--_button-height) - var(--_border-width) * 2)}.tedi-tag__closing-button{--_button-height: var(--button-xs-icon-size-mobile)}@media (min-width: 576px){.tedi-tag__closing-button{--_button-height: var(--button-xs-icon-size-tablet)}}@media (min-width: 992px){.tedi-tag__closing-button{--_button-height: var(--button-xs-icon-size-desktop)}}.tedi-tag__closing-button{min-width:var(--button-xs-icon-size-mobile)}@media (min-width: 576px){.tedi-tag__closing-button{min-width:var(--button-xs-icon-size-tablet)}}@media (min-width: 992px){.tedi-tag__closing-button{min-width:var(--button-xs-icon-size-desktop)}}.tedi-tag__closing-button:hover,.tedi-tag__closing-button:focus{background-color:#0000001a}.tedi-tag__spinner-wrapper{display:flex;align-items:center;height:calc(var(--_line-height) + var(--_tag-padding-y))}.tedi-tag--closable:not(.tedi-tag--loading){padding-right:0}.tedi-tag--secondary{--_background-color: var(--tag-secondary-background);--_border-color: var(--tag-secondary-border)}.tedi-tag--danger{--_background-color: var(--tag-danger-background);--_border-color: var(--tag-danger-border)}\n"] }]
+        }] });
+
+class StatusBadgeComponent {
+    /**
+     * Additional classes to apply custom styles to the StatusBadge.
+     */
+    className = input();
+    /**
+     * Provides the full text or description when the Badge represents an abbreviation.
+     * This is typically shown as a tooltip on hover.
+     */
+    title = input();
+    /**
+     * ID attribute
+     */
+    id = input();
+    /**
+     * ARIA role attribute for accessibility.
+     */
+    role = input();
+    /**
+     * Specifies the color scheme of the StatusBadge.
+     * @default default
+     */
+    color = input("neutral");
+    /**
+     * Determines the style or visual type of the StatusBadge.
+     * @default filled
+     */
+    variant = input("filled");
+    /**
+     * Specifies the size of the StatusBadge.
+     * @default default
+     */
+    size = input("default");
+    /**
+     * StatusBadge status indicator
+     */
+    status = input("inactive");
+    /**
+     * The name of the icon to be displayed inside the StatusBadge. The icon is rendered using the `Icon` component.
+     */
+    icon = input("");
+    classes = computed(() => {
+        const classList = ["tedi-status-badge"];
+        if (this.color()) {
+            classList.push(`tedi-status-badge--color-${this.color()}`);
+        }
+        if (this.variant()) {
+            classList.push(`tedi-status-badge--variant-${this.variant()}`);
+        }
+        if (this.status() && this.status() !== "none") {
+            classList.push("tedi-status-badge--status", `tedi-status-badge--status-${this.status()}`);
+        }
+        if (this.size() === "large") {
+            classList.push("tedi-status-badge--large");
+        }
+        if (this.icon() && !this.title()) {
+            classList.push("tedi-status-badge__icon-only");
+        }
+        if (this.className()) {
+            classList.push(this.className());
+        }
+        return classList.join(" ");
+    });
+    ariaLive = computed(() => {
+        switch (this.role()) {
+            case "alert":
+                return "assertive";
+            case "status":
+                return "polite";
+            default:
+                return undefined;
+        }
+    });
+    mapBadgeColorToIconColor = computed(() => {
+        switch (this.color()) {
+            case "brand":
+                return "brand-dark";
+            case "success":
+                return "success";
+            case "accent":
+                return "secondary";
+            case "danger":
+                return "danger";
+            case "warning":
+                return "warning-dark";
+            default:
+                return "primary";
+        }
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StatusBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: StatusBadgeComponent, isStandalone: true, selector: "[tedi-status-badge]", inputs: { className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "attr.title": "title()", "attr.id": "id()", "attr.role": "role()", "attr.aria-live": "ariaLive()", "attr.aria-label": "title()" } }, ngImport: i0, template: "@if (icon()) {\n  <tedi-icon [name]=\"icon()\" [color]=\"mapBadgeColorToIconColor()\" [size]=\"16\" />\n}\n<span class=\"tedi-status-badge__inner-text\">\n  <ng-content></ng-content>\n</span>\n", styles: [".tedi-status-badge__inner-text:empty{display:none}.tedi-status-badge{--status-badge-icon-primary: var(--blue-700);--status-badge-icon-secondary: var(--orange-700);position:relative;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:var(--_status-badge-text);background:var(--_status-badge-background);box-shadow:var(--_status-badge-box-shadow)}.tedi-status-badge{font-size:var(--body-small-regular-size-mobile)}@media (min-width: 992px){.tedi-status-badge{font-size:var(--body-small-regular-size-desktop)}}.tedi-status-badge{font-weight:var(--body-small-regular-weight-mobile)}@media (min-width: 992px){.tedi-status-badge{font-weight:var(--body-small-regular-weight-desktop)}}.tedi-status-badge{line-height:var(--body-small-regular-line-height-mobile)}@media (min-width: 992px){.tedi-status-badge{line-height:var(--body-small-regular-line-height-desktop)}}.tedi-status-badge{padding:var(--tag-default-padding-y-mobile) var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-status-badge{padding:var(--tag-default-padding-y-tablet) var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-status-badge{padding:var(--tag-default-padding-y-desktop) var(--tag-default-padding-x-desktop)}}.tedi-status-badge{border-radius:var(--tag-default-radius-mobile)}@media (min-width: 576px){.tedi-status-badge{border-radius:var(--tag-default-radius-tablet)}}@media (min-width: 992px){.tedi-status-badge{border-radius:var(--tag-default-radius-desktop)}}.tedi-status-badge__inner-text{min-width:fit-content}.tedi-status-badge__inner-text{padding-left:var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-status-badge__inner-text{padding-left:var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-status-badge__inner-text{padding-left:var(--tag-default-padding-x-desktop)}}.tedi-status-badge__inner-text{padding-right:var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-status-badge__inner-text{padding-right:var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-status-badge__inner-text{padding-right:var(--tag-default-padding-x-desktop)}}.tedi-status-badge--large{min-width:var(--tag-status-large-min-width-mobile)}@media (min-width: 576px){.tedi-status-badge--large{min-width:var(--tag-status-large-min-width-tablet)}}@media (min-width: 992px){.tedi-status-badge--large{min-width:var(--tag-status-large-min-width-desktop)}}.tedi-status-badge--large{padding:var(--tag-status-large-padding-y-mobile) var(--tag-status-large-padding-x-mobile)}@media (min-width: 576px){.tedi-status-badge--large{padding:var(--tag-status-large-padding-y-tablet) var(--tag-status-large-padding-x-tablet)}}@media (min-width: 992px){.tedi-status-badge--large{padding:var(--tag-status-large-padding-y-desktop) var(--tag-status-large-padding-x-desktop)}}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-neutral{--_status-badge-text: var(--status-badge-text-neutral);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-neutral);--_status-badge-background: var( --status-badge-background-neutral );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-brand{--_status-badge-text: var(--status-badge-text-brand);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-brand);--_status-badge-background: var( --status-badge-background-brand );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-accent{--_status-badge-text: var(--status-badge-text-accent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-accent);--_status-badge-background: var( --status-badge-background-accent );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-success{--_status-badge-text: var(--status-badge-text-success);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-success);--_status-badge-background: var( --status-badge-background-success );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-danger{--_status-badge-text: var(--status-badge-text-danger);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-danger);--_status-badge-background: var( --status-badge-background-danger );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-warning{--_status-badge-text: var(--status-badge-text-warning);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-warning);--_status-badge-background: var( --status-badge-background-warning );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-transparent{--_status-badge-text: var(--status-badge-text-transparent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-transparent);--_status-badge-background: var( --status-badge-background-transparent );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-neutral{--_status-badge-text: var(--status-badge-text-neutral);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-neutral);--_status-badge-background: var( --status-badge-background-neutral )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-brand{--_status-badge-text: var(--status-badge-text-brand);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-brand);--_status-badge-background: var( --status-badge-background-brand )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-accent{--_status-badge-text: var(--status-badge-text-accent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-accent);--_status-badge-background: var( --status-badge-background-accent )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-success{--_status-badge-text: var(--status-badge-text-success);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-success);--_status-badge-background: var( --status-badge-background-success )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-danger{--_status-badge-text: var(--status-badge-text-danger);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-danger);--_status-badge-background: var( --status-badge-background-danger )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-warning{--_status-badge-text: var(--status-badge-text-warning);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-warning);--_status-badge-background: var( --status-badge-background-warning )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-transparent{--_status-badge-text: var(--status-badge-text-transparent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-transparent);--_status-badge-background: var( --status-badge-background-transparent )}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-neutral{--_status-badge-text: var(--status-badge-text-neutral);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-neutral);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-brand{--_status-badge-text: var(--status-badge-text-brand);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-brand);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-accent{--_status-badge-text: var(--status-badge-text-accent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-accent);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-success{--_status-badge-text: var(--status-badge-text-success);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-success);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-danger{--_status-badge-text: var(--status-badge-text-danger);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-danger);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-warning{--_status-badge-text: var(--status-badge-text-warning);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-warning);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-transparent{--_status-badge-text: var(--status-badge-text-transparent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-transparent);--_status-badge-background: transparent}.tedi-status-badge--status:before{position:absolute;top:-.25rem;right:-.25rem;z-index:1;width:.625rem;height:.625rem;content:\"\";border:1px solid var(--neutral-100);border-radius:50%;background-color:var(--_status-badge--indicator-background)}.tedi-status-badge--status.tedi-badge--large:before{top:-.1875rem;right:-.1875rem;width:.875rem;height:.875rem}.tedi-status-badge--status-inactive:before{--_status-badge--indicator-background: var( --status-badge-indicator-inactive )}.tedi-status-badge--status-success:before{--_status-badge--indicator-background: var( --status-badge-indicator-success )}.tedi-status-badge--status-danger:before{--_status-badge--indicator-background: var( --status-badge-indicator-danger )}.tedi-status-badge--status-warning:before{--_status-badge--indicator-background: var( --status-badge-indicator-warning )}.tedi-status-badge__icon-only{display:inline-flex;align-items:center;min-height:24px}.tedi-status-badge__icon-only{line-height:var(--body-small-regular-line-height-mobile)}@media (min-width: 576px){.tedi-status-badge__icon-only{line-height:var(--body-small-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-status-badge__icon-only{line-height:var(--body-small-regular-line-height-desktop)}}.tedi-status-badge__icon-primary{color:var(--status-badge-icon-primary)}.tedi-status-badge__icon-accent{color:var(--status-badge-icon-secondary)}@media print{.tedi-status-badge{filter:grayscale(1)}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StatusBadgeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "[tedi-status-badge]", imports: [IconComponent], encapsulation: ViewEncapsulation.None, host: {
+                        "[class]": "classes()",
+                        "[attr.title]": "title()",
+                        "[attr.id]": "id()",
+                        "[attr.role]": "role()",
+                        "[attr.aria-live]": "ariaLive()",
+                        "[attr.aria-label]": "title()",
+                    }, template: "@if (icon()) {\n  <tedi-icon [name]=\"icon()\" [color]=\"mapBadgeColorToIconColor()\" [size]=\"16\" />\n}\n<span class=\"tedi-status-badge__inner-text\">\n  <ng-content></ng-content>\n</span>\n", styles: [".tedi-status-badge__inner-text:empty{display:none}.tedi-status-badge{--status-badge-icon-primary: var(--blue-700);--status-badge-icon-secondary: var(--orange-700);position:relative;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:var(--_status-badge-text);background:var(--_status-badge-background);box-shadow:var(--_status-badge-box-shadow)}.tedi-status-badge{font-size:var(--body-small-regular-size-mobile)}@media (min-width: 992px){.tedi-status-badge{font-size:var(--body-small-regular-size-desktop)}}.tedi-status-badge{font-weight:var(--body-small-regular-weight-mobile)}@media (min-width: 992px){.tedi-status-badge{font-weight:var(--body-small-regular-weight-desktop)}}.tedi-status-badge{line-height:var(--body-small-regular-line-height-mobile)}@media (min-width: 992px){.tedi-status-badge{line-height:var(--body-small-regular-line-height-desktop)}}.tedi-status-badge{padding:var(--tag-default-padding-y-mobile) var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-status-badge{padding:var(--tag-default-padding-y-tablet) var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-status-badge{padding:var(--tag-default-padding-y-desktop) var(--tag-default-padding-x-desktop)}}.tedi-status-badge{border-radius:var(--tag-default-radius-mobile)}@media (min-width: 576px){.tedi-status-badge{border-radius:var(--tag-default-radius-tablet)}}@media (min-width: 992px){.tedi-status-badge{border-radius:var(--tag-default-radius-desktop)}}.tedi-status-badge__inner-text{min-width:fit-content}.tedi-status-badge__inner-text{padding-left:var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-status-badge__inner-text{padding-left:var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-status-badge__inner-text{padding-left:var(--tag-default-padding-x-desktop)}}.tedi-status-badge__inner-text{padding-right:var(--tag-default-padding-x-mobile)}@media (min-width: 576px){.tedi-status-badge__inner-text{padding-right:var(--tag-default-padding-x-tablet)}}@media (min-width: 992px){.tedi-status-badge__inner-text{padding-right:var(--tag-default-padding-x-desktop)}}.tedi-status-badge--large{min-width:var(--tag-status-large-min-width-mobile)}@media (min-width: 576px){.tedi-status-badge--large{min-width:var(--tag-status-large-min-width-tablet)}}@media (min-width: 992px){.tedi-status-badge--large{min-width:var(--tag-status-large-min-width-desktop)}}.tedi-status-badge--large{padding:var(--tag-status-large-padding-y-mobile) var(--tag-status-large-padding-x-mobile)}@media (min-width: 576px){.tedi-status-badge--large{padding:var(--tag-status-large-padding-y-tablet) var(--tag-status-large-padding-x-tablet)}}@media (min-width: 992px){.tedi-status-badge--large{padding:var(--tag-status-large-padding-y-desktop) var(--tag-status-large-padding-x-desktop)}}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-neutral{--_status-badge-text: var(--status-badge-text-neutral);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-neutral);--_status-badge-background: var( --status-badge-background-neutral );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-brand{--_status-badge-text: var(--status-badge-text-brand);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-brand);--_status-badge-background: var( --status-badge-background-brand );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-accent{--_status-badge-text: var(--status-badge-text-accent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-accent);--_status-badge-background: var( --status-badge-background-accent );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-success{--_status-badge-text: var(--status-badge-text-success);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-success);--_status-badge-background: var( --status-badge-background-success );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-danger{--_status-badge-text: var(--status-badge-text-danger);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-danger);--_status-badge-background: var( --status-badge-background-danger );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-warning{--_status-badge-text: var(--status-badge-text-warning);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-warning);--_status-badge-background: var( --status-badge-background-warning );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled.tedi-status-badge--color-transparent{--_status-badge-text: var(--status-badge-text-transparent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-transparent);--_status-badge-background: var( --status-badge-background-transparent );--_status-badge-box-shadow: none}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-neutral{--_status-badge-text: var(--status-badge-text-neutral);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-neutral);--_status-badge-background: var( --status-badge-background-neutral )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-brand{--_status-badge-text: var(--status-badge-text-brand);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-brand);--_status-badge-background: var( --status-badge-background-brand )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-accent{--_status-badge-text: var(--status-badge-text-accent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-accent);--_status-badge-background: var( --status-badge-background-accent )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-success{--_status-badge-text: var(--status-badge-text-success);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-success);--_status-badge-background: var( --status-badge-background-success )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-danger{--_status-badge-text: var(--status-badge-text-danger);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-danger);--_status-badge-background: var( --status-badge-background-danger )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-warning{--_status-badge-text: var(--status-badge-text-warning);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-warning);--_status-badge-background: var( --status-badge-background-warning )}.tedi-status-badge.tedi-status-badge--variant-filled-bordered.tedi-status-badge--color-transparent{--_status-badge-text: var(--status-badge-text-transparent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-transparent);--_status-badge-background: var( --status-badge-background-transparent )}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-neutral{--_status-badge-text: var(--status-badge-text-neutral);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-neutral);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-brand{--_status-badge-text: var(--status-badge-text-brand);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-brand);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-accent{--_status-badge-text: var(--status-badge-text-accent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-accent);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-success{--_status-badge-text: var(--status-badge-text-success);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-success);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-danger{--_status-badge-text: var(--status-badge-text-danger);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-danger);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-warning{--_status-badge-text: var(--status-badge-text-warning);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-warning);--_status-badge-background: transparent}.tedi-status-badge.tedi-status-badge--variant-bordered.tedi-status-badge--color-transparent{--_status-badge-text: var(--status-badge-text-transparent);--_status-badge-box-shadow: inset 0 0 0 1px var(--status-badge-border-transparent);--_status-badge-background: transparent}.tedi-status-badge--status:before{position:absolute;top:-.25rem;right:-.25rem;z-index:1;width:.625rem;height:.625rem;content:\"\";border:1px solid var(--neutral-100);border-radius:50%;background-color:var(--_status-badge--indicator-background)}.tedi-status-badge--status.tedi-badge--large:before{top:-.1875rem;right:-.1875rem;width:.875rem;height:.875rem}.tedi-status-badge--status-inactive:before{--_status-badge--indicator-background: var( --status-badge-indicator-inactive )}.tedi-status-badge--status-success:before{--_status-badge--indicator-background: var( --status-badge-indicator-success )}.tedi-status-badge--status-danger:before{--_status-badge--indicator-background: var( --status-badge-indicator-danger )}.tedi-status-badge--status-warning:before{--_status-badge--indicator-background: var( --status-badge-indicator-warning )}.tedi-status-badge__icon-only{display:inline-flex;align-items:center;min-height:24px}.tedi-status-badge__icon-only{line-height:var(--body-small-regular-line-height-mobile)}@media (min-width: 576px){.tedi-status-badge__icon-only{line-height:var(--body-small-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-status-badge__icon-only{line-height:var(--body-small-regular-line-height-desktop)}}.tedi-status-badge__icon-primary{color:var(--status-badge-icon-primary)}.tedi-status-badge__icon-accent{color:var(--status-badge-icon-secondary)}@media print{.tedi-status-badge{filter:grayscale(1)}}\n"] }]
+        }] });
+
+var specialOptionControls;
+(function (specialOptionControls) {
+    specialOptionControls["SELECT_ALL"] = "SELECT_ALL";
+    specialOptionControls["SELECTGROUP"] = "SELECTGROUP_";
+})(specialOptionControls || (specialOptionControls = {}));
+class MultiselectComponent {
+    /**
+     * The id of the select input (for label association).
+     * @default ""
+     */
+    inputId = input.required();
+    /**
+     * The label for the select input.
+     * @default ""
+     */
+    label = input();
+    /**
+     * Should show label as required?
+     * @default false
+     */
+    required = input(false);
+    /**
+     * The placeholder text to display when no option is selected.
+     * @default ""
+     */
+    placeholder = input("");
+    /**
+     * The state of the input.
+     * @default "default"
+     */
+    state = input("default");
+    /**
+     * The size of the input.
+     * @default "default"
+     */
+    size = input("default");
+    /**
+     * Whether the select should be rendered as a multi-row dropdown.
+     * @default false
+     */
+    multiRow = input(false);
+    /**
+     * Whether the selected labels show removing buttons.
+     * @default false
+     */
+    clearableTags = input(false);
+    /**
+     * Whether the select should allow selecting all options at once.
+     * @default false
+     */
+    selectAll = input(false);
+    /**
+     * Whether the select should allow selecting groups of options.
+     * @default false
+     */
+    selectableGroups = input(false);
+    /**
+     * Whether the clear button will be shown when an option is selected.
+     * @default true
+     */
+    clearable = input(true);
+    feedbackText = input();
+    specialOptionControls = specialOptionControls;
+    isOpen = signal(false);
+    selectedOptions = signal([]);
+    listboxRef = viewChild(CdkListbox, { read: ElementRef });
+    triggerRef = viewChild(CdkOverlayOrigin, { read: ElementRef });
+    hostRef = inject(ElementRef);
+    options = contentChildren(SelectOptionComponent);
+    dropdownWidth = signal(0);
+    disabled = signal(false);
+    optionGroups = computed(() => {
+        const groups = [];
+        this.options().forEach((option) => {
+            const group = groups.find((g) => g.label === option.group());
+            if (group) {
+                group.options.push(option);
+            }
+            else {
+                groups.push({ label: option.group() ?? "", options: [option] });
+            }
+        });
+        return groups;
+    });
+    onWindowResize() {
+        this.setDropdownWidth();
+    }
+    toggleIsOpen(value) {
+        if (this.disabled())
+            return;
+        if (value === undefined) {
+            this.isOpen.update((previousValue) => !previousValue);
+        }
+        else if (value === false) {
+            this.isOpen.set(value);
+            this.focusTrigger();
+        }
+    }
+    handleValueChange(event) {
+        // Check if event value includes any "select-all-group" selection
+        const selectedGroup = event.value
+            .find((v) => v.startsWith(specialOptionControls.SELECTGROUP))
+            ?.replace(specialOptionControls.SELECTGROUP, "");
+        if (event.value.includes(specialOptionControls.SELECT_ALL)) {
+            // If "select-all" is selected, toggle all options
+            this.toggleSelectAll();
+        }
+        else if (selectedGroup) {
+            // If a group selection is made, toggle the group
+            this.toggleGroupSelection(selectedGroup);
+        }
+        else {
+            // Otherwise, update the selected options directly
+            this.selectedOptions.set(event.value);
+            this.onChange(event.value);
+        }
+        this.onTouched();
+    }
+    clear(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        this.selectedOptions.set([]);
+        this.onChange([]);
+        this.onTouched();
+    }
+    focusListboxWhenVisible = effect(() => {
+        if (this.listboxRef())
+            this.listboxRef()?.nativeElement.focus();
+    });
+    focusTrigger() {
+        this.triggerRef()?.nativeElement.focus();
+    }
+    isOptionSelected(option) {
+        return this.selectedOptions().includes(option);
+    }
+    setDropdownWidth() {
+        const computedWidth = this.hostRef?.nativeElement?.getBoundingClientRect()?.width ?? 0;
+        this.dropdownWidth.set(computedWidth);
+    }
+    allOptions = computed(() => {
+        return this.options()
+            .filter((option) => !option.disabled())
+            .map((option) => option.value());
+    });
+    allOptionsSelected = computed(() => {
+        return this.selectedOptions().length === this.allOptions().length;
+    });
+    toggleSelectAll() {
+        const newSelection = this.allOptionsSelected() ? [] : this.allOptions();
+        this.selectedOptions.set(newSelection);
+        this.onChange(newSelection);
+    }
+    getLabel(value) {
+        const option = this.options().find((opt) => opt.value() === value);
+        return option ? option.label() : undefined;
+    }
+    isGroupSelected(groupLabel) {
+        const group = this.optionGroups().find((g) => g.label === groupLabel);
+        if (!group)
+            return false;
+        const enabledGroupOptions = group.options
+            .filter((option) => !option.disabled())
+            .map((option) => option.value());
+        return (enabledGroupOptions.length > 0 &&
+            enabledGroupOptions.every((option) => this.selectedOptions().includes(option)));
+    }
+    toggleGroupSelection(groupLabel) {
+        const group = this.optionGroups().find((g) => g.label === groupLabel);
+        if (!group)
+            return;
+        const enabledGroupOptions = group.options
+            .filter((option) => !option.disabled())
+            .map((option) => option.value());
+        const allGroupOptionsSelected = this.isGroupSelected(groupLabel);
+        let newSelection;
+        if (allGroupOptionsSelected) {
+            newSelection = this.selectedOptions().filter((option) => !enabledGroupOptions.includes(option));
+        }
+        else {
+            const currentSelected = new Set(this.selectedOptions());
+            enabledGroupOptions.forEach((option) => currentSelected.add(option));
+            newSelection = Array.from(currentSelected);
+        }
+        this.selectedOptions.set(newSelection);
+        this.onChange(newSelection);
+    }
+    deselect(event, value) {
+        event.stopPropagation();
+        event.preventDefault();
+        if (this.disabled())
+            return;
+        const newSelection = this.selectedOptions().filter((option) => option !== value);
+        this.selectedOptions.set(newSelection);
+        this.onChange(newSelection);
+        this.onTouched();
+    }
+    // ControlValueAccessor implementation
+    onChange = () => { };
+    onTouched = () => { };
+    writeValue(value) {
+        this.selectedOptions.set(value || []);
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled.set(isDisabled);
+    }
+    ngAfterContentChecked() {
+        this.setDropdownWidth();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MultiselectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: MultiselectComponent, isStandalone: true, selector: "tedi-multiselect", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", 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 }, multiRow: { classPropertyName: "multiRow", publicName: "multiRow", isSignal: true, isRequired: false, transformFunction: null }, clearableTags: { classPropertyName: "clearableTags", publicName: "clearableTags", isSignal: true, isRequired: false, transformFunction: null }, selectAll: { classPropertyName: "selectAll", publicName: "selectAll", isSignal: true, isRequired: false, transformFunction: null }, selectableGroups: { classPropertyName: "selectableGroups", publicName: "selectableGroups", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onWindowResize()" }, classAttribute: "tedi-select tedi-select--multiselect" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => MultiselectComponent),
+                multi: true,
+            },
+        ], queries: [{ propertyName: "options", predicate: SelectOptionComponent, isSignal: true }], viewQueries: [{ propertyName: "listboxRef", first: true, predicate: CdkListbox, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "triggerRef", first: true, predicate: CdkOverlayOrigin, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@let listboxId = inputId() + \"-listbox\";\n@let labelId = inputId() + \"-label\";\n\n@if (label()) {\n  <label\n    [id]=\"labelId\"\n    tedi-label\n    [for]=\"inputId()\"\n    [required]=\"required()\"\n    [size]=\"size()\"\n  >\n    {{ label() }}\n  </label>\n}\n<div\n  [id]=\"inputId()\"\n  class=\"tedi-select__trigger\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  tedi-input\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  role=\"combobox\"\n  aria-haspopup=\"listbox\"\n  [attr.aria-expanded]=\"isOpen()\"\n  [attr.aria-controls]=\"listboxId\"\n  [attr.aria-labelledby]=\"labelId\"\n  [tabindex]=\"disabled() ? -1 : 0\"\n  [state]=\"state()\"\n  [size]=\"size()\"\n  (click)=\"toggleIsOpen()\"\n  (keydown.enter)=\"toggleIsOpen()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  <span class=\"tedi-select__label\">\n    @if (selectedOptions().length) {\n      <div\n        class=\"tedi-select__multiselect-container\"\n        [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n      >\n        @for (value of selectedOptions(); track value) {\n          <tedi-tag\n            [closable]=\"clearableTags()\"\n            (closed)=\"deselect($event, value)\"\n          >\n            {{ getLabel(value) }}\n          </tedi-tag>\n        }\n      </div>\n    } @else {\n      <span class=\"tedi-select__label--placeholder\">\n        {{ placeholder() }}\n      </span>\n    }\n  </span>\n\n  @if (clearable() && selectedOptions().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      title=\"Clear\"\n      (click)=\"clear($event)\"\n    ></button>\n  }\n\n  <tedi-icon class=\"tedi-select__arrow\" name=\"arrow_drop_down\" />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayHasBackdrop]=\"true\"\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  (backdropClick)=\"toggleIsOpen(false)\"\n  (detach)=\"toggleIsOpen(false)\"\n>\n  <tedi-card\n    class=\"tedi-select__dropdown\"\n    spacing=\"none\"\n    [style.width.px]=\"dropdownWidth()\"\n  >\n    <tedi-card-content>\n      <ul\n        [id]=\"listboxId\"\n        class=\"tedi-select__options\"\n        cdkListbox\n        cdkListboxMultiple\n        [cdkListboxValue]=\"selectedOptions()\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (options().length) {\n          @if (selectAll()) {\n            <li\n              tedi-dropdown-item\n              [cdkOption]=\"specialOptionControls.SELECT_ALL\"\n            >\n              <tedi-checkbox\n                class=\"tedi-select__multiselect-checkbox\"\n                [inputId]=\"inputId() + '-select-all'\"\n                [checked]=\"allOptionsSelected()\"\n              >\n                {{ \"select.select-all\" | tediTranslate }}\n              </tedi-checkbox>\n            </li>\n          }\n\n          @for (group of optionGroups(); track $index) {\n            @if (group.label.length) {\n              @if (selectableGroups()) {\n                <li\n                  tedi-dropdown-item\n                  class=\"tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"specialOptionControls.SELECTGROUP + group.label\"\n                >\n                  <div class=\"tedi-select__group-checkbox\">\n                    <tedi-checkbox\n                      class=\"tedi-select__multiselect-checkbox\"\n                      [inputId]=\"'group-' + group.label\"\n                      [checked]=\"isGroupSelected(group.label)\"\n                    >\n                      <span tedi-text color=\"tertiary\">\n                        {{ group.label }}\n                      </span>\n                    </tedi-checkbox>\n                  </div>\n                </li>\n              } @else {\n                <li\n                  tedi-dropdown-item\n                  class=\"tedi-select__group-name\"\n                  role=\"presentation\"\n                >\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()) {\n              <li\n                tedi-dropdown-item\n                [cdkOption]=\"option.value()\"\n                [cdkOptionDisabled]=\"option.disabled()\"\n                [disabled]=\"option.disabled()\"\n              >\n                <tedi-checkbox\n                  class=\"tedi-select__multiselect-checkbox\"\n                  [inputId]=\"'option-' + option.value()\"\n                  [checked]=\"isOptionSelected(option.value())\"\n                >\n                  @if (option.templateRef(); as optionTemplate) {\n                    <span class=\"tedi-select__dropdown-item--custom-content\">\n                      <ng-container [ngTemplateOutlet]=\"optionTemplate\" />\n                    </span>\n                    <span class=\"tedi-select__dropdown-item--label\">\n                      {{ option.label() }}\n                    </span>\n                  } @else {\n                    {{ option.label() }}\n                  }\n                </tedi-checkbox>\n              </li>\n            }\n          }\n        } @else {\n          <li tedi-dropdown-item class=\"tedi-select__no-options\">\n            {{ \"select.no-options\" | tediTranslate }}\n          </li>\n        }\n      </ul>\n    </tedi-card-content>\n  </tedi-card>\n</ng-template>\n", styles: [".tedi-select{display:block;width:100%}.tedi-select{--_inner-gap: var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-desktop)}}.tedi-select__trigger{display:flex;width:100%;justify-content:space-between}.tedi-select__label{overflow:hidden;text-align:left;flex-grow:1;cursor:default}.tedi-select__label--placeholder{pointer-events:none;color:var(--_placeholder-color)}.tedi-select__clear{padding:0;margin:0;border:none;background:none;flex-grow:0;color:var(--button-close-text-default);cursor:pointer}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{flex-grow:0;cursor:default}.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__dropdown{box-shadow:0 1px 5px 0 var(--alpha-20);max-height:300px;overflow-y:auto}.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-desktop)}}.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-desktop)}}.tedi-select__options{margin:0;padding:0}.tedi-select__options:focus .cdk-option-active{background:var(--dropdown-item-hover-background);color:var(--dropdown-item-hover-text)}.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;text-transform:uppercase;letter-spacing:0px;padding:8px 12px 4px}.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-desktop)}}.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-desktop)}}.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-mobile)}@media (min-width: 576px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-tablet)}}@media (min-width: 992px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-desktop)}}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-mobile)}@media (min-width: 576px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-tablet)}}@media (min-width: 992px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-desktop)}}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex-wrap:wrap;gap:var(--_inner-gap)}.tedi-select__multiselect-container--single-row{overflow:hidden;flex-wrap:nowrap}.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-checkbox{pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.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: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { 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: "component", type: InputComponent, selector: "[tedi-input]", inputs: ["size", "state"] }, { kind: "component", type: CardComponent, selector: "tedi-card", inputs: ["borderless", "spacing", "accentBorder", "selected"] }, { kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["hasSeparator", "autoWidth", "timeline"] }, { kind: "component", type: DropdownItemComponent, selector: "[tedi-dropdown-item]", inputs: ["selected", "disabled"], outputs: ["itemSelected"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: LabelComponent, selector: "label[tedi-label]", inputs: ["size", "required"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: CheckboxComponent, selector: "tedi-checkbox", inputs: ["inputId", "checked", "indeterminate", "value", "disabled", "size", "hasError", "feedbackText"], outputs: ["checkedChange", "disabledChange"] }, { kind: "component", type: TagComponent, selector: "tedi-tag", inputs: ["loading", "closable", "type"], outputs: ["closed"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MultiselectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-multiselect", imports: [
+                        CommonModule,
+                        OverlayModule,
+                        CdkListboxModule,
+                        InputComponent,
+                        CardComponent,
+                        CardContentComponent,
+                        DropdownItemComponent,
+                        ClosingButtonComponent,
+                        IconComponent,
+                        LabelComponent,
+                        FeedbackTextComponent,
+                        TextComponent,
+                        CheckboxComponent,
+                        TagComponent,
+                        TediTranslationPipe,
+                    ], standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: "tedi-select tedi-select--multiselect",
+                    }, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => MultiselectComponent),
+                            multi: true,
+                        },
+                    ], template: "@let listboxId = inputId() + \"-listbox\";\n@let labelId = inputId() + \"-label\";\n\n@if (label()) {\n  <label\n    [id]=\"labelId\"\n    tedi-label\n    [for]=\"inputId()\"\n    [required]=\"required()\"\n    [size]=\"size()\"\n  >\n    {{ label() }}\n  </label>\n}\n<div\n  [id]=\"inputId()\"\n  class=\"tedi-select__trigger\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  tedi-input\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  role=\"combobox\"\n  aria-haspopup=\"listbox\"\n  [attr.aria-expanded]=\"isOpen()\"\n  [attr.aria-controls]=\"listboxId\"\n  [attr.aria-labelledby]=\"labelId\"\n  [tabindex]=\"disabled() ? -1 : 0\"\n  [state]=\"state()\"\n  [size]=\"size()\"\n  (click)=\"toggleIsOpen()\"\n  (keydown.enter)=\"toggleIsOpen()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  <span class=\"tedi-select__label\">\n    @if (selectedOptions().length) {\n      <div\n        class=\"tedi-select__multiselect-container\"\n        [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n      >\n        @for (value of selectedOptions(); track value) {\n          <tedi-tag\n            [closable]=\"clearableTags()\"\n            (closed)=\"deselect($event, value)\"\n          >\n            {{ getLabel(value) }}\n          </tedi-tag>\n        }\n      </div>\n    } @else {\n      <span class=\"tedi-select__label--placeholder\">\n        {{ placeholder() }}\n      </span>\n    }\n  </span>\n\n  @if (clearable() && selectedOptions().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      title=\"Clear\"\n      (click)=\"clear($event)\"\n    ></button>\n  }\n\n  <tedi-icon class=\"tedi-select__arrow\" name=\"arrow_drop_down\" />\n</div>\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayHasBackdrop]=\"true\"\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  (backdropClick)=\"toggleIsOpen(false)\"\n  (detach)=\"toggleIsOpen(false)\"\n>\n  <tedi-card\n    class=\"tedi-select__dropdown\"\n    spacing=\"none\"\n    [style.width.px]=\"dropdownWidth()\"\n  >\n    <tedi-card-content>\n      <ul\n        [id]=\"listboxId\"\n        class=\"tedi-select__options\"\n        cdkListbox\n        cdkListboxMultiple\n        [cdkListboxValue]=\"selectedOptions()\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (options().length) {\n          @if (selectAll()) {\n            <li\n              tedi-dropdown-item\n              [cdkOption]=\"specialOptionControls.SELECT_ALL\"\n            >\n              <tedi-checkbox\n                class=\"tedi-select__multiselect-checkbox\"\n                [inputId]=\"inputId() + '-select-all'\"\n                [checked]=\"allOptionsSelected()\"\n              >\n                {{ \"select.select-all\" | tediTranslate }}\n              </tedi-checkbox>\n            </li>\n          }\n\n          @for (group of optionGroups(); track $index) {\n            @if (group.label.length) {\n              @if (selectableGroups()) {\n                <li\n                  tedi-dropdown-item\n                  class=\"tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"specialOptionControls.SELECTGROUP + group.label\"\n                >\n                  <div class=\"tedi-select__group-checkbox\">\n                    <tedi-checkbox\n                      class=\"tedi-select__multiselect-checkbox\"\n                      [inputId]=\"'group-' + group.label\"\n                      [checked]=\"isGroupSelected(group.label)\"\n                    >\n                      <span tedi-text color=\"tertiary\">\n                        {{ group.label }}\n                      </span>\n                    </tedi-checkbox>\n                  </div>\n                </li>\n              } @else {\n                <li\n                  tedi-dropdown-item\n                  class=\"tedi-select__group-name\"\n                  role=\"presentation\"\n                >\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()) {\n              <li\n                tedi-dropdown-item\n                [cdkOption]=\"option.value()\"\n                [cdkOptionDisabled]=\"option.disabled()\"\n                [disabled]=\"option.disabled()\"\n              >\n                <tedi-checkbox\n                  class=\"tedi-select__multiselect-checkbox\"\n                  [inputId]=\"'option-' + option.value()\"\n                  [checked]=\"isOptionSelected(option.value())\"\n                >\n                  @if (option.templateRef(); as optionTemplate) {\n                    <span class=\"tedi-select__dropdown-item--custom-content\">\n                      <ng-container [ngTemplateOutlet]=\"optionTemplate\" />\n                    </span>\n                    <span class=\"tedi-select__dropdown-item--label\">\n                      {{ option.label() }}\n                    </span>\n                  } @else {\n                    {{ option.label() }}\n                  }\n                </tedi-checkbox>\n              </li>\n            }\n          }\n        } @else {\n          <li tedi-dropdown-item class=\"tedi-select__no-options\">\n            {{ \"select.no-options\" | tediTranslate }}\n          </li>\n        }\n      </ul>\n    </tedi-card-content>\n  </tedi-card>\n</ng-template>\n", styles: [".tedi-select{display:block;width:100%}.tedi-select{--_inner-gap: var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-desktop)}}.tedi-select__trigger{display:flex;width:100%;justify-content:space-between}.tedi-select__label{overflow:hidden;text-align:left;flex-grow:1;cursor:default}.tedi-select__label--placeholder{pointer-events:none;color:var(--_placeholder-color)}.tedi-select__clear{padding:0;margin:0;border:none;background:none;flex-grow:0;color:var(--button-close-text-default);cursor:pointer}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{flex-grow:0;cursor:default}.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__dropdown{box-shadow:0 1px 5px 0 var(--alpha-20);max-height:300px;overflow-y:auto}.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-desktop)}}.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-desktop)}}.tedi-select__options{margin:0;padding:0}.tedi-select__options:focus .cdk-option-active{background:var(--dropdown-item-hover-background);color:var(--dropdown-item-hover-text)}.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;text-transform:uppercase;letter-spacing:0px;padding:8px 12px 4px}.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-desktop)}}.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-desktop)}}.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-mobile)}@media (min-width: 576px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-tablet)}}@media (min-width: 992px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-desktop)}}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-mobile)}@media (min-width: 576px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-tablet)}}@media (min-width: 992px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-desktop)}}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex-wrap:wrap;gap:var(--_inner-gap)}.tedi-select__multiselect-container--single-row{overflow:hidden;flex-wrap:nowrap}.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-checkbox{pointer-events:none}\n"] }]
+        }], propDecorators: { onWindowResize: [{
+                type: HostListener,
+                args: ["window:resize"]
+            }] } });
+
+class TextareaComponent extends InputComponent {
+    /**
+     * Whether the textarea should be resizable in the X direction.
+     * @default false
+     */
+    resizeX = input(false);
+    /**
+     * Whether the textarea should be resizable in the Y direction.
+     * @default true
+     */
+    resizeY = input(true);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TextareaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: TextareaComponent, isStandalone: true, selector: "[tedi-textarea]", inputs: { resizeX: { classPropertyName: "resizeX", publicName: "resizeX", isSignal: true, isRequired: false, transformFunction: null }, resizeY: { classPropertyName: "resizeY", publicName: "resizeY", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-textarea": "true", "class.tedi-textarea--resizeX": "this.resizeX()", "class.tedi-textarea--resizeY": "this.resizeY()" } }, usesInheritance: true, ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-input{--_border-color: var(--form-input-border-default);--_color: var(--form-input-text-filled);--_background-color: var(--form-input-background-default);--_placeholder-color: var(--form-input-text-placeholder);padding:var(--_padding-y) var(--_padding-x);border-radius:var(--_border-radius);font-size:var(--_font-size);line-height:var(--_line-height);border:1px solid;border-color:var(--_border-color);color:var(--_color);background-color:var(--_background-color);margin-bottom:var(--_form-field-outer-gap)}.tedi-input{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-input{font-family:var(--family-primary-desktop)}}.tedi-input{--_border-radius: var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-input{--_border-radius: var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-input{--_border-radius: var(--form-field-radius-desktop)}}.tedi-input{--_font-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-input{--_font-size: var(--body-regular-size-desktop)}}.tedi-input{--_line-height: var(--body-regular-line-height-mobile)}@media (min-width: 992px){.tedi-input{--_line-height: var(--body-regular-line-height-desktop)}}.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-mobile)}@media (min-width: 576px){.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-tablet)}}@media (min-width: 992px){.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-desktop)}}.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-mobile)}@media (min-width: 576px){.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-tablet)}}@media (min-width: 992px){.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-desktop)}}.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-desktop)}}.tedi-input:focus,.tedi-input:active{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input:hover{--_border-color: var(--form-input-border-hover)}.tedi-input:disabled,.tedi-input--disabled{--_color: var(--form-input-text-disabled);--_border-color: var(--form-input-border-disabled);--_background-color: var(--form-input-background-disabled);pointer-events:none}.tedi-input::placeholder{color:var(--_placeholder-color)}.tedi-input--error:not(:disabled){--_border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(:disabled):focus,.tedi-input--error:not(:disabled):active{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(:disabled){--_border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(:disabled):focus,.tedi-input--valid:not(:disabled):active{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-desktop)}}\n", ".tedi-textarea{width:100%;resize:none}.tedi-textarea{min-height:var(--form-textarea-min-height-mobile)}@media (min-width: 576px){.tedi-textarea{min-height:var(--form-textarea-min-height-tablet)}}@media (min-width: 992px){.tedi-textarea{min-height:var(--form-textarea-min-height-desktop)}}.tedi-textarea{padding:var(--form-field-padding-y-md-default-mobile) var(--form-field-padding-x-md-default-mobile)}@media (min-width: 576px){.tedi-textarea{padding:var(--form-field-padding-y-md-default-tablet) var(--form-field-padding-x-md-default-tablet)}}@media (min-width: 992px){.tedi-textarea{padding:var(--form-field-padding-y-md-default-desktop) var(--form-field-padding-x-md-default-desktop)}}.tedi-textarea--resizeX{resize:horizontal}.tedi-textarea--resizeY{resize:vertical}.tedi-textarea--resizeY.tedi-textarea--resizeX{resize:both}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TextareaComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "[tedi-textarea]", standalone: true, template: "<ng-content />", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-textarea]": "true",
+                        "[class.tedi-textarea--resizeX]": "this.resizeX()",
+                        "[class.tedi-textarea--resizeY]": "this.resizeY()",
+                    }, styles: [".tedi-input{--_border-color: var(--form-input-border-default);--_color: var(--form-input-text-filled);--_background-color: var(--form-input-background-default);--_placeholder-color: var(--form-input-text-placeholder);padding:var(--_padding-y) var(--_padding-x);border-radius:var(--_border-radius);font-size:var(--_font-size);line-height:var(--_line-height);border:1px solid;border-color:var(--_border-color);color:var(--_color);background-color:var(--_background-color);margin-bottom:var(--_form-field-outer-gap)}.tedi-input{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-input{font-family:var(--family-primary-desktop)}}.tedi-input{--_border-radius: var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-input{--_border-radius: var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-input{--_border-radius: var(--form-field-radius-desktop)}}.tedi-input{--_font-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-input{--_font-size: var(--body-regular-size-desktop)}}.tedi-input{--_line-height: var(--body-regular-line-height-mobile)}@media (min-width: 992px){.tedi-input{--_line-height: var(--body-regular-line-height-desktop)}}.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-mobile)}@media (min-width: 576px){.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-tablet)}}@media (min-width: 992px){.tedi-input{--_padding-y: var(--form-field-padding-y-md-default-desktop)}}.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-mobile)}@media (min-width: 576px){.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-tablet)}}@media (min-width: 992px){.tedi-input{--_padding-x: var(--form-field-padding-x-md-default-desktop)}}.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-input{--_form-field-outer-gap: var(--form-field-outer-spacing-desktop)}}.tedi-input:focus,.tedi-input:active{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input:hover{--_border-color: var(--form-input-border-hover)}.tedi-input:disabled,.tedi-input--disabled{--_color: var(--form-input-text-disabled);--_border-color: var(--form-input-border-disabled);--_background-color: var(--form-input-background-disabled);pointer-events:none}.tedi-input::placeholder{color:var(--_placeholder-color)}.tedi-input--error:not(:disabled){--_border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(:disabled):focus,.tedi-input--error:not(:disabled):active{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(:disabled){--_border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(:disabled):focus,.tedi-input--valid:not(:disabled):active{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-input--small{--_padding-y: var(--form-field-padding-y-sm-desktop)}}\n", ".tedi-textarea{width:100%;resize:none}.tedi-textarea{min-height:var(--form-textarea-min-height-mobile)}@media (min-width: 576px){.tedi-textarea{min-height:var(--form-textarea-min-height-tablet)}}@media (min-width: 992px){.tedi-textarea{min-height:var(--form-textarea-min-height-desktop)}}.tedi-textarea{padding:var(--form-field-padding-y-md-default-mobile) var(--form-field-padding-x-md-default-mobile)}@media (min-width: 576px){.tedi-textarea{padding:var(--form-field-padding-y-md-default-tablet) var(--form-field-padding-x-md-default-tablet)}}@media (min-width: 992px){.tedi-textarea{padding:var(--form-field-padding-y-md-default-desktop) var(--form-field-padding-x-md-default-desktop)}}.tedi-textarea--resizeX{resize:horizontal}.tedi-textarea--resizeY{resize:vertical}.tedi-textarea--resizeY.tedi-textarea--resizeX{resize:both}\n"] }]
+        }] });
+
+class SearchComponent {
+    /**
+     * Search input ID for accessibility
+     */
+    inputId = input.required();
+    /**
+     * Autocomplete options for the search input
+     * @default []
+     */
+    autocompleteOptions = input([]);
+    /**
+     * Minimum number of characters to trigger autocomplete
+     * @default 3
+     */
+    autocompleteFrom = input();
+    /**
+     * Size of the search component
+     * @default "default"
+     */
+    size = input("default");
+    /**
+     * Input state for validation
+     * @default "default"
+     */
+    state = input("default");
+    /**
+     * Should the search button be shown
+     * @default false
+     */
+    withButton = input(false);
+    /**
+     * Add text to the search button
+     * @default undefined
+     */
+    buttonText = input(undefined);
+    /**
+     * Should the search input be clearable
+     * @default true
+     */
+    clearable = input(true);
+    /**
+     * Text to show when no results are found
+     * @default "Vasteid ei leitud"
+     */
+    noResultText = input("Vasteid ei leitud");
+    /**
+     * Should the searc input be disabled
+     * @default false
+     */
+    disabled = input(false);
+    /**
+     * Placeholder text for the search input
+     * @default ""
+     */
+    placeholder = input("");
+    /**
+     * Should the search input show a loading spinner
+     * @default false
+     */
+    loading = input(false);
+    /**
+     * Label for the search input
+     * @default undefined
+     */
+    label = input();
+    /**
+     * Feedback text component for displaying messages
+     * @default undefined
+     */
+    feedbackText = input();
+    // Emitted events
+    searchEvent = output();
+    clearEvent = output();
+    _inputValue = model();
+    _selectedOption = model();
+    _width = signal(0);
+    _elementRef = inject(ElementRef);
+    _disabled = signal(false);
+    _isVisible = signal(false);
+    _cdkMenuRef = viewChild(CdkMenu, { read: ElementRef });
+    _overlayOriginRef = viewChild(CdkOverlayOrigin, { read: ElementRef });
+    modifierClasses = computed(() => {
+        const modifiers = [];
+        if (this.size())
+            modifiers.push(`tedi-search--${this.size()}`);
+        if (this.state())
+            modifiers.push(`tedi-search--${this.state()}`);
+        return modifiers.join(" ");
+    });
+    ngAfterContentChecked() {
+        this._width.set(this.getWidth());
+    }
+    inputChanged(inputValue) {
+        const selected = this._selectedOption();
+        // Clear selected option if input value is changed and is not matching the selected option
+        if (selected && inputValue !== selected.label) {
+            this._selectedOption.set(undefined);
+        }
+        this.handleOverlayOpen();
+        this.onChange(inputValue);
+    }
+    focusInput() {
+        this.handleOverlayOpen();
+    }
+    // Logic to show/hide the autocomplete dropdown
+    handleOverlayOpen() {
+        const inputValue = this._inputValue();
+        const autocompleteFrom = this.autocompleteFrom();
+        const baseRules = !this.withButton() && !this._selectedOption();
+        const showAutocompleteIfLength = autocompleteFrom && inputValue && inputValue.length >= autocompleteFrom;
+        if (baseRules && (showAutocompleteIfLength || autocompleteFrom === 0)) {
+            this._isVisible.set(true);
+        }
+        else {
+            this._isVisible.set(false);
+        }
+    }
+    // Filter the autocomplete options based on the input value
+    _foundOptions = computed(() => {
+        const inputValue = this._inputValue();
+        if (!inputValue)
+            return this.autocompleteOptions();
+        return this.autocompleteOptions().filter((option) => {
+            const searchString = inputValue.toLowerCase().split(" ");
+            return searchString.every((searchTerm) => option.label.toLowerCase().includes(searchTerm) ||
+                option.description?.toLowerCase().includes(searchTerm));
+        });
+    });
+    iconSize = computed(() => {
+        const size = this.size();
+        const hasButton = this.withButton();
+        const hasButtonText = !!this.buttonText();
+        if (size === "large") {
+            if (hasButton && hasButtonText)
+                return 18;
+            return 24;
+        }
+        else if (size === "small") {
+            if (hasButton)
+                return 18;
+            return 16;
+        }
+        else {
+            return 18;
+        }
+    });
+    buttonSize = computed(() => {
+        switch (this.size()) {
+            case "large":
+                return "default";
+            case "small":
+                return "small";
+            default:
+                return "default";
+        }
+    });
+    // ControlValueAccessor methods
+    onChange = () => { };
+    onTouched = () => { };
+    writeValue(value) {
+        if (typeof value === "string") {
+            this._inputValue.set(value);
+            this._selectedOption.set(undefined);
+        }
+        else {
+            this._inputValue.set(value?.label || "");
+            this._selectedOption.set(value);
+        }
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this._disabled.set(isDisabled);
+    }
+    searchButtonClick() {
+        this.searchEvent.emit(this._selectedOption() ?? this._inputValue() ?? "");
+        this.onChange(this._selectedOption() ?? this._inputValue() ?? "");
+        this.onTouched();
+    }
+    selectResult(option) {
+        this._selectedOption.set(option);
+        this._inputValue.set(option.label);
+        // Emit the selected option if the search button is not shown
+        if (!this.withButton()) {
+            this.searchEvent.emit(option);
+            this.onChange(option);
+        }
+        this.onTouched();
+        this.closeOverlay(true);
+    }
+    clearResult() {
+        this._inputValue.set("");
+        this._selectedOption.set(undefined);
+        this.searchEvent.emit("");
+        this.onChange("");
+        this.onTouched();
+        this.clearEvent.emit();
+    }
+    focusDropdown(event) {
+        // Prevent default behavior and stop propagation if event is provided
+        if (event) {
+            event.preventDefault();
+            event.stopPropagation();
+        }
+        const dropdownToFocus = this._cdkMenuRef();
+        if (dropdownToFocus) {
+            dropdownToFocus.nativeElement.focus();
+        }
+    }
+    closeOverlay(focusBackToInput) {
+        this._isVisible.set(false);
+        if (focusBackToInput) {
+            this._overlayOriginRef()?.nativeElement?.focus();
+        }
+    }
+    getWidth() {
+        return this._elementRef?.nativeElement?.getBoundingClientRect()?.width || 0;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: SearchComponent, isStandalone: true, selector: "tedi-search", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, autocompleteOptions: { classPropertyName: "autocompleteOptions", publicName: "autocompleteOptions", isSignal: true, isRequired: false, transformFunction: null }, autocompleteFrom: { classPropertyName: "autocompleteFrom", publicName: "autocompleteFrom", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, withButton: { classPropertyName: "withButton", publicName: "withButton", isSignal: true, isRequired: false, transformFunction: null }, buttonText: { classPropertyName: "buttonText", publicName: "buttonText", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, noResultText: { classPropertyName: "noResultText", publicName: "noResultText", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null }, _inputValue: { classPropertyName: "_inputValue", publicName: "_inputValue", isSignal: true, isRequired: false, transformFunction: null }, _selectedOption: { classPropertyName: "_selectedOption", publicName: "_selectedOption", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { searchEvent: "searchEvent", clearEvent: "clearEvent", _inputValue: "_inputValueChange", _selectedOption: "_selectedOptionChange" }, host: { properties: { "class.tedi-search": "true", "class.tedi-search--with-button": "withButton()", "class.tedi-search--with-button-text": "!!buttonText()", "class.tedi-search--disabled": "_disabled()", "class": "modifierClasses()" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => SearchComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "_cdkMenuRef", first: true, predicate: CdkMenu, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "_overlayOriginRef", first: true, predicate: CdkOverlayOrigin, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@if (label()) {\n  <label tedi-label [for]=\"inputId()\">\n    {{ label() }}\n  </label>\n}\n\n<div class=\"tedi-search__container\">\n  <input\n    cdkOverlayOrigin\n    [id]=\"inputId()\"\n    class=\"tedi-search__input\"\n    type=\"text\"\n    [(ngModel)]=\"_inputValue\"\n    [placeholder]=\"placeholder()\"\n    [disabled]=\"_disabled()\"\n    (focus)=\"focusInput()\"\n    (keydown.enter)=\"focusDropdown($event)\"\n    (keydown.arrowDown)=\"focusDropdown($event)\"\n    (ngModelChange)=\"inputChanged($event)\"\n    (blur)=\"onTouched()\"\n    #trigger=\"cdkOverlayOrigin\"\n  />\n\n  <div class=\"tedi-search__suffix\">\n    @if (clearable() && _inputValue()) {\n      <button\n        type=\"reset\"\n        tedi-closing-button\n        [size]=\"size() === 'large' ? 'default' : 'small'\"\n        [iconSize]=\"size() === 'large' ? 24 : 18\"\n        (click)=\"$event.stopPropagation(); clearResult()\"\n      ></button>\n      @if (!withButton()) {\n        <div class=\"tedi-search__suffix-separator\"></div>\n      }\n    }\n    @if (!withButton()) {\n      @if (!loading()) {\n        <tedi-icon\n          class=\"tedi-search__search-icon\"\n          name=\"search\"\n          color=\"secondary\"\n          [size]=\"iconSize()\"\n        />\n      } @else {\n        <tedi-spinner />\n      }\n    }\n  </div>\n\n  @if (withButton()) {\n    @if (loading()) {\n      <tedi-spinner />\n    }\n    <button\n      tedi-button\n      class=\"tedi-search__trigger\"\n      [size]=\"buttonSize()\"\n      (click)=\"searchButtonClick()\"\n      [disabled]=\"_disabled()\"\n    >\n      <tedi-icon name=\"search\" color=\"white\" [size]=\"iconSize()\" />\n      {{ buttonText() }}\n    </button>\n  }\n</div>\n\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"_isVisible()\"\n  [cdkConnectedOverlayDisableClose]=\"true\"\n  (overlayOutsideClick)=\"closeOverlay(false)\"\n  (overlayKeydown)=\"$event.key === 'Escape' ? closeOverlay(true) : null\"\n  #searchPanel\n>\n  <tedi-card class=\"tedi-search__panel\" [style.width.px]=\"_width()\">\n    @if (loading()) {\n      <tedi-card-content padding=\"md\" [hasSeparator]=\"true\">\n        <tedi-spinner />\n      </tedi-card-content>\n    } @else if (_foundOptions().length) {\n      <tedi-card-content padding=\"none\" [hasSeparator]=\"true\" cdkMenu>\n        @for (option of _foundOptions(); track option.value) {\n          <button\n            cdkMenuItem\n            tedi-dropdown-item\n            [value]=\"option.value\"\n            [selected]=\"option.value === _selectedOption()?.value\"\n            (click)=\"selectResult(option)\"\n            #autocompleteOption\n          >\n            @if (option.description) {\n              <strong>{{ option.label }}</strong> \u00B7 {{ option.description }}\n            } @else {\n              {{ option.label }}\n            }\n          </button>\n        }\n      </tedi-card-content>\n    } @else {\n      <tedi-card-content [hasSeparator]=\"true\" padding=\"md\">\n        {{ noResultText() }}\n      </tedi-card-content>\n    }\n\n    <tedi-card-content class=\"tedi-search__footer-content\" padding=\"md\">\n      <ng-content></ng-content>\n    </tedi-card-content>\n  </tedi-card>\n</ng-template>\n", styles: [".tedi-search{--_border-color: var(--form-input-border-default)}.tedi-search{--_form-field-outer-gap: var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-search{--_form-field-outer-gap: var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-search{--_form-field-outer-gap: var(--form-field-outer-spacing-desktop)}}.tedi-search__container{display:flex;border:1px solid;align-items:center;border-color:var(--_border-color);border-radius:var(--_border-radius);margin-bottom:var(--_form-field-outer-gap)}.tedi-search__container{--_border-radius: var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-search__container{--_border-radius: var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-search__container{--_border-radius: var(--form-field-radius-desktop)}}.tedi-search__container{gap:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-search__container{gap:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-search__container{gap:var(--form-field-inner-spacing-desktop)}}.tedi-search__container{--_padding: var(--form-field-padding-y-md-default-mobile)}@media (min-width: 576px){.tedi-search__container{--_padding: var(--form-field-padding-y-md-default-tablet)}}@media (min-width: 992px){.tedi-search__container{--_padding: var(--form-field-padding-y-md-default-desktop)}}.tedi-search__container:hover{--_border-color: var(--form-input-border-hover)}.tedi-search__container:focus-within{--_border-color: var(--form-input-border-active);box-shadow:0 0 0 1px var(--form-input-border-active)}.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container{--_border-color: var(--form-general-feedback-error-border)}.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container:focus,.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container:active{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container:hover{--_border-color: var(--form-general-feedback-error-border)}.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container:focus-within{--_border-color: var(--form-general-feedback-error-border);box-shadow:0 0 0 1px var(--form-general-feedback-error-border)}.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container{--_border-color: var(--form-general-feedback-success-border)}.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container:focus,.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container:active{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container:hover{border-color:var(--form-general-feedback-success-border)}.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container:focus-within{border-color:var(--form-general-feedback-success-border);box-shadow:0 0 0 1px var(--form-general-feedback-success-border)}.tedi-search__input{width:100%;flex-grow:1;border:0;padding:var(--_padding);padding-right:0;margin:0;border-radius:var(--_border-radius);border-top-right-radius:0;border-bottom-right-radius:0;letter-spacing:0px}.tedi-search__input{font-weight:var(--body-regular-weight-mobile)}@media (min-width: 576px){.tedi-search__input{font-weight:var(--body-regular-weight-tablet)}}@media (min-width: 992px){.tedi-search__input{font-weight:var(--body-regular-weight-desktop)}}.tedi-search__input{font-size:var(--body-regular-size-mobile)}@media (min-width: 576px){.tedi-search__input{font-size:var(--body-regular-size-tablet)}}@media (min-width: 992px){.tedi-search__input{font-size:var(--body-regular-size-desktop)}}.tedi-search__input{line-height:var(--body-regular-line-height-mobile)}@media (min-width: 576px){.tedi-search__input{line-height:var(--body-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-search__input{line-height:var(--body-regular-line-height-desktop)}}.tedi-search__trigger.tedi-button{border-radius:var(--_border-radius);border-top-left-radius:0;border-bottom-left-radius:0;align-self:stretch}.tedi-search__trigger.tedi-button{--_border-radius: var(--button-radius-sm-mobile)}@media (min-width: 576px){.tedi-search__trigger.tedi-button{--_border-radius: var(--button-radius-sm-tablet)}}@media (min-width: 992px){.tedi-search__trigger.tedi-button{--_border-radius: var(--button-radius-sm-desktop)}}.tedi-search__suffix{display:flex;align-self:stretch;align-items:center;padding:0 var(--_padding)}.tedi-search__suffix{gap:var(--layout-grid-gutters-04-mobile)}@media (min-width: 576px){.tedi-search__suffix{gap:var(--layout-grid-gutters-04-tablet)}}@media (min-width: 992px){.tedi-search__suffix{gap:var(--layout-grid-gutters-04-desktop)}}.tedi-search--with-button .tedi-search__suffix{padding:0}.tedi-search__suffix-separator{width:1px;border-left:1px solid var(--general-border-primary);height:1em}.tedi-search__panel{margin:var(--_form-outer-gap) 0;max-height:300px;overflow-y:auto}.tedi-search__panel{--_form-outer-gap: var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-search__panel{--_form-outer-gap: var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-search__panel{--_form-outer-gap: var(--form-field-outer-spacing-desktop)}}.tedi-search__footer-content:empty{display:none}.tedi-search--small .tedi-search__container{--_padding: var(--form-field-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-search--small .tedi-search__container{--_padding: var(--form-field-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-search--small .tedi-search__container{--_padding: var(--form-field-padding-y-sm-desktop)}}.tedi-search--large.tedi-search--with-button:not(.tedi-search--with-button-text) .tedi-search__trigger.tedi-button{height:auto;width:56px}.tedi-search--large.tedi-search--with-button:not(.tedi-search--with-button-text) .tedi-search__trigger.tedi-button .tedi-icon--size-24{font-size:var(--icon-05-desktop)}.tedi-search--large .tedi-search__container{--_padding: var(--form-field-padding-y-lg-mobile)}@media (min-width: 576px){.tedi-search--large .tedi-search__container{--_padding: var(--form-field-padding-y-lg-tablet)}}@media (min-width: 992px){.tedi-search--large .tedi-search__container{--_padding: var(--form-field-padding-y-lg-desktop)}}.tedi-search--disabled .tedi-search__container{background-color:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}.tedi-search--disabled .tedi-search__input{background-color:var(--form-input-background-disabled);pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: "ngmodule", type: CdkMenuModule }, { kind: "directive", type: i2$1.CdkMenu, selector: "[cdkMenu]", outputs: ["closed"], exportAs: ["cdkMenu"] }, { kind: "directive", type: i2$1.CdkMenuItem, selector: "[cdkMenuItem]", inputs: ["cdkMenuItemDisabled", "cdkMenuitemTypeaheadLabel"], outputs: ["cdkMenuItemTriggered"], exportAs: ["cdkMenuItem"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.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: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: CardComponent, selector: "tedi-card", inputs: ["borderless", "spacing", "accentBorder", "selected"] }, { kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["hasSeparator", "autoWidth", "timeline"] }, { kind: "component", type: DropdownItemComponent, selector: "[tedi-dropdown-item]", inputs: ["selected", "disabled"], outputs: ["itemSelected"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize"] }, { kind: "ngmodule", type: A11yModule }, { kind: "component", type: SpinnerComponent, selector: "tedi-spinner", inputs: ["size", "color", "label"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: LabelComponent, selector: "label[tedi-label]", inputs: ["size", "required"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: SearchComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-search", standalone: true, imports: [
+                        FormsModule,
+                        ButtonComponent,
+                        IconComponent,
+                        CdkMenuModule,
+                        OverlayModule,
+                        CardComponent,
+                        CardContentComponent,
+                        DropdownItemComponent,
+                        ClosingButtonComponent,
+                        A11yModule,
+                        SpinnerComponent,
+                        FeedbackTextComponent,
+                        LabelComponent,
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        "[class.tedi-search]": "true",
+                        "[class.tedi-search--with-button]": "withButton()",
+                        "[class.tedi-search--with-button-text]": "!!buttonText()",
+                        "[class.tedi-search--disabled]": "_disabled()",
+                        "[class]": "modifierClasses()",
+                    }, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => SearchComponent),
+                            multi: true,
+                        },
+                    ], template: "@if (label()) {\n  <label tedi-label [for]=\"inputId()\">\n    {{ label() }}\n  </label>\n}\n\n<div class=\"tedi-search__container\">\n  <input\n    cdkOverlayOrigin\n    [id]=\"inputId()\"\n    class=\"tedi-search__input\"\n    type=\"text\"\n    [(ngModel)]=\"_inputValue\"\n    [placeholder]=\"placeholder()\"\n    [disabled]=\"_disabled()\"\n    (focus)=\"focusInput()\"\n    (keydown.enter)=\"focusDropdown($event)\"\n    (keydown.arrowDown)=\"focusDropdown($event)\"\n    (ngModelChange)=\"inputChanged($event)\"\n    (blur)=\"onTouched()\"\n    #trigger=\"cdkOverlayOrigin\"\n  />\n\n  <div class=\"tedi-search__suffix\">\n    @if (clearable() && _inputValue()) {\n      <button\n        type=\"reset\"\n        tedi-closing-button\n        [size]=\"size() === 'large' ? 'default' : 'small'\"\n        [iconSize]=\"size() === 'large' ? 24 : 18\"\n        (click)=\"$event.stopPropagation(); clearResult()\"\n      ></button>\n      @if (!withButton()) {\n        <div class=\"tedi-search__suffix-separator\"></div>\n      }\n    }\n    @if (!withButton()) {\n      @if (!loading()) {\n        <tedi-icon\n          class=\"tedi-search__search-icon\"\n          name=\"search\"\n          color=\"secondary\"\n          [size]=\"iconSize()\"\n        />\n      } @else {\n        <tedi-spinner />\n      }\n    }\n  </div>\n\n  @if (withButton()) {\n    @if (loading()) {\n      <tedi-spinner />\n    }\n    <button\n      tedi-button\n      class=\"tedi-search__trigger\"\n      [size]=\"buttonSize()\"\n      (click)=\"searchButtonClick()\"\n      [disabled]=\"_disabled()\"\n    >\n      <tedi-icon name=\"search\" color=\"white\" [size]=\"iconSize()\" />\n      {{ buttonText() }}\n    </button>\n  }\n</div>\n\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"_isVisible()\"\n  [cdkConnectedOverlayDisableClose]=\"true\"\n  (overlayOutsideClick)=\"closeOverlay(false)\"\n  (overlayKeydown)=\"$event.key === 'Escape' ? closeOverlay(true) : null\"\n  #searchPanel\n>\n  <tedi-card class=\"tedi-search__panel\" [style.width.px]=\"_width()\">\n    @if (loading()) {\n      <tedi-card-content padding=\"md\" [hasSeparator]=\"true\">\n        <tedi-spinner />\n      </tedi-card-content>\n    } @else if (_foundOptions().length) {\n      <tedi-card-content padding=\"none\" [hasSeparator]=\"true\" cdkMenu>\n        @for (option of _foundOptions(); track option.value) {\n          <button\n            cdkMenuItem\n            tedi-dropdown-item\n            [value]=\"option.value\"\n            [selected]=\"option.value === _selectedOption()?.value\"\n            (click)=\"selectResult(option)\"\n            #autocompleteOption\n          >\n            @if (option.description) {\n              <strong>{{ option.label }}</strong> \u00B7 {{ option.description }}\n            } @else {\n              {{ option.label }}\n            }\n          </button>\n        }\n      </tedi-card-content>\n    } @else {\n      <tedi-card-content [hasSeparator]=\"true\" padding=\"md\">\n        {{ noResultText() }}\n      </tedi-card-content>\n    }\n\n    <tedi-card-content class=\"tedi-search__footer-content\" padding=\"md\">\n      <ng-content></ng-content>\n    </tedi-card-content>\n  </tedi-card>\n</ng-template>\n", styles: [".tedi-search{--_border-color: var(--form-input-border-default)}.tedi-search{--_form-field-outer-gap: var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-search{--_form-field-outer-gap: var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-search{--_form-field-outer-gap: var(--form-field-outer-spacing-desktop)}}.tedi-search__container{display:flex;border:1px solid;align-items:center;border-color:var(--_border-color);border-radius:var(--_border-radius);margin-bottom:var(--_form-field-outer-gap)}.tedi-search__container{--_border-radius: var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-search__container{--_border-radius: var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-search__container{--_border-radius: var(--form-field-radius-desktop)}}.tedi-search__container{gap:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-search__container{gap:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-search__container{gap:var(--form-field-inner-spacing-desktop)}}.tedi-search__container{--_padding: var(--form-field-padding-y-md-default-mobile)}@media (min-width: 576px){.tedi-search__container{--_padding: var(--form-field-padding-y-md-default-tablet)}}@media (min-width: 992px){.tedi-search__container{--_padding: var(--form-field-padding-y-md-default-desktop)}}.tedi-search__container:hover{--_border-color: var(--form-input-border-hover)}.tedi-search__container:focus-within{--_border-color: var(--form-input-border-active);box-shadow:0 0 0 1px var(--form-input-border-active)}.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container{--_border-color: var(--form-general-feedback-error-border)}.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container:focus,.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container:active{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container:hover{--_border-color: var(--form-general-feedback-error-border)}.tedi-search--error:not(.tedi-search--disabled) .tedi-search__container:focus-within{--_border-color: var(--form-general-feedback-error-border);box-shadow:0 0 0 1px var(--form-general-feedback-error-border)}.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container{--_border-color: var(--form-general-feedback-success-border)}.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container:focus,.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container:active{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container:hover{border-color:var(--form-general-feedback-success-border)}.tedi-search--valid:not(.tedi-search--disabled) .tedi-search__container:focus-within{border-color:var(--form-general-feedback-success-border);box-shadow:0 0 0 1px var(--form-general-feedback-success-border)}.tedi-search__input{width:100%;flex-grow:1;border:0;padding:var(--_padding);padding-right:0;margin:0;border-radius:var(--_border-radius);border-top-right-radius:0;border-bottom-right-radius:0;letter-spacing:0px}.tedi-search__input{font-weight:var(--body-regular-weight-mobile)}@media (min-width: 576px){.tedi-search__input{font-weight:var(--body-regular-weight-tablet)}}@media (min-width: 992px){.tedi-search__input{font-weight:var(--body-regular-weight-desktop)}}.tedi-search__input{font-size:var(--body-regular-size-mobile)}@media (min-width: 576px){.tedi-search__input{font-size:var(--body-regular-size-tablet)}}@media (min-width: 992px){.tedi-search__input{font-size:var(--body-regular-size-desktop)}}.tedi-search__input{line-height:var(--body-regular-line-height-mobile)}@media (min-width: 576px){.tedi-search__input{line-height:var(--body-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-search__input{line-height:var(--body-regular-line-height-desktop)}}.tedi-search__trigger.tedi-button{border-radius:var(--_border-radius);border-top-left-radius:0;border-bottom-left-radius:0;align-self:stretch}.tedi-search__trigger.tedi-button{--_border-radius: var(--button-radius-sm-mobile)}@media (min-width: 576px){.tedi-search__trigger.tedi-button{--_border-radius: var(--button-radius-sm-tablet)}}@media (min-width: 992px){.tedi-search__trigger.tedi-button{--_border-radius: var(--button-radius-sm-desktop)}}.tedi-search__suffix{display:flex;align-self:stretch;align-items:center;padding:0 var(--_padding)}.tedi-search__suffix{gap:var(--layout-grid-gutters-04-mobile)}@media (min-width: 576px){.tedi-search__suffix{gap:var(--layout-grid-gutters-04-tablet)}}@media (min-width: 992px){.tedi-search__suffix{gap:var(--layout-grid-gutters-04-desktop)}}.tedi-search--with-button .tedi-search__suffix{padding:0}.tedi-search__suffix-separator{width:1px;border-left:1px solid var(--general-border-primary);height:1em}.tedi-search__panel{margin:var(--_form-outer-gap) 0;max-height:300px;overflow-y:auto}.tedi-search__panel{--_form-outer-gap: var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-search__panel{--_form-outer-gap: var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-search__panel{--_form-outer-gap: var(--form-field-outer-spacing-desktop)}}.tedi-search__footer-content:empty{display:none}.tedi-search--small .tedi-search__container{--_padding: var(--form-field-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-search--small .tedi-search__container{--_padding: var(--form-field-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-search--small .tedi-search__container{--_padding: var(--form-field-padding-y-sm-desktop)}}.tedi-search--large.tedi-search--with-button:not(.tedi-search--with-button-text) .tedi-search__trigger.tedi-button{height:auto;width:56px}.tedi-search--large.tedi-search--with-button:not(.tedi-search--with-button-text) .tedi-search__trigger.tedi-button .tedi-icon--size-24{font-size:var(--icon-05-desktop)}.tedi-search--large .tedi-search__container{--_padding: var(--form-field-padding-y-lg-mobile)}@media (min-width: 576px){.tedi-search--large .tedi-search__container{--_padding: var(--form-field-padding-y-lg-tablet)}}@media (min-width: 992px){.tedi-search--large .tedi-search__container{--_padding: var(--form-field-padding-y-lg-desktop)}}.tedi-search--disabled .tedi-search__container{background-color:var(--form-input-background-disabled);border-color:var(--form-input-border-disabled)}.tedi-search--disabled .tedi-search__input{background-color:var(--form-input-background-disabled);pointer-events:none}\n"] }]
+        }] });
+
+const IECkiloBytes = 1024;
+const SIkiloBytes = 1000;
+const IECMegabytes = IECkiloBytes * IECkiloBytes;
+const SIMegabytes = SIkiloBytes * SIkiloBytes;
+var SIFileSize;
+(function (SIFileSize) {
+    SIFileSize[SIFileSize["kB"] = 1000] = "kB";
+    SIFileSize[SIFileSize["MB"] = 1000000] = "MB";
+})(SIFileSize || (SIFileSize = {}));
+var IECFileSize;
+(function (IECFileSize) {
+    IECFileSize[IECFileSize["kB"] = 1024] = "kB";
+    IECFileSize[IECFileSize["MB"] = 1048576] = "MB";
+})(IECFileSize || (IECFileSize = {}));
+const FileSizeStandards = {
+    SI: SIFileSize,
+    IEC: IECFileSize,
+};
+
+function formatBytes(bytes, standard) {
+    let kB = 0;
+    let MB = 0;
+    switch (standard) {
+        case "IEC":
+            kB = IECFileSize.kB;
+            MB = IECFileSize.MB;
+            break;
+        case "SI":
+            kB = SIFileSize.kB;
+            MB = SIFileSize.MB;
+            break;
+        default:
+            throw new Error(`Unknown filesize display standard: ${standard}`);
+    }
+    if (bytes >= MB) {
+        const mbString = standard === "SI" ? "MB" : "MiB";
+        return `${roundNumber(bytes / MB)} ${mbString}`;
+    }
+    if (bytes >= kB) {
+        const bytesString = standard === "SI" ? "kB" : "KiB";
+        return `${roundNumber(bytes / kB)} ${bytesString}`;
+    }
+    return `${bytes} B`;
+}
+function roundNumber(num, decimals = 2) {
+    const rounded = num.toFixed(decimals);
+    return rounded.includes(".") ? rounded.replace(/\.?0+$/, "") : rounded;
+}
+function getDefaultHelpers(accept, maxSize, standard, translate) {
+    if (!translate)
+        throw new Error("Translate function is required to generate default helpers.");
+    const textArray = [];
+    if (accept) {
+        textArray.push(`${translate("file-upload.accept")} ${accept.replaceAll(",", ", ")}`);
+    }
+    if (maxSize) {
+        textArray.push(`${translate("file-upload.max-size")} ${formatBytes(maxSize, standard)}`);
+    }
+    return textArray.filter(Boolean).join(". ");
+}
+function validateFileSize(maxSize, acceptFileTypes, file, standard, translate) {
+    if (maxSize && file.size > maxSize) {
+        const maxSizeMB = formatBytes(maxSize, standard);
+        return translate(`file-upload.size-rejected-extended`, file.name, maxSizeMB);
+    }
+    return undefined;
+}
+function validateFileType(maxSize, acceptFileTypes, file, standard, translate) {
+    if (acceptFileTypes) {
+        const validTypes = acceptFileTypes
+            .split(",")
+            .map((type) => type.trim().toLowerCase());
+        const fileType = file.type.toLowerCase();
+        const fileName = file.name.toLowerCase() || "";
+        const matches = validTypes.some((type) => {
+            if (type.startsWith(".")) {
+                return fileName.endsWith(type);
+            }
+            if (type.endsWith("/*")) {
+                return fileType.startsWith(type.replace("/*", ""));
+            }
+            return fileType === type;
+        });
+        if (!matches) {
+            return translate(`file-upload.extension-rejected-extended`, file.name, acceptFileTypes);
+        }
+    }
+    return undefined;
+}
+
+class FileDropzone {
+    /*
+     * Additional CSS class names to apply to the dropzone for custom styling
+     */
+    className;
+    /*
+     * The text label displayed for the file dropzone, providing context for users.
+     */
+    label;
+    /*
+     * Provides a tooltip (such as an error or instruction message) to guide the user.
+     */
+    helper;
+    /*
+     * Disables the file delete button, preventing user interaction.
+     */
+    disabled;
+    /*
+     * Per file status of the file set by validation.
+     */
+    fileStatus;
+    /*
+     * Possible additional properties for the file, such as metadata.
+     */
+    metaData;
+    /*
+     * The actual file object being uploaded.
+     */
+    file;
+    constructor(file) {
+        this.file = file;
+    }
+    get name() {
+        return this.file.name;
+    }
+    get size() {
+        return this.file.size;
+    }
+    get type() {
+        return this.file.type;
+    }
+}
+
+class FileService {
+    maxSize = signal(0).asReadonly();
+    accept = signal("").asReadonly();
+    mode = signal("append").asReadonly();
+    validators = signal([]).asReadonly();
+    sizeDisplayStandard = signal("IEC").asReadonly();
+    uploadState = signal("none");
+    _files = signal([]);
+    _translateService = inject(TediTranslationService);
+    get files() {
+        return this._files.asReadonly();
+    }
+    async addFiles(files) {
+        let newFiles = this.normalizeFiles(files);
+        const currentFiles = this.files();
+        switch (this.mode()) {
+            case "append": {
+                // index any duplicate name file
+                newFiles = await this._renameDuplicates(currentFiles, newFiles);
+                break;
+            }
+            case "replace": {
+                // replace any files with the same name
+                const filesToCheck = [...currentFiles, ...newFiles];
+                const duplicateFiles = filesToCheck.filter((file, index, self) => self.findIndex((f) => f.name === file.name) !== index);
+                if (duplicateFiles.length > 0) {
+                    newFiles = newFiles.filter((file) => !duplicateFiles.some((f) => f.name === file.name));
+                }
+                break;
+            }
+        }
+        newFiles.push(...currentFiles);
+        // remove old invalid files, fileStatus will not yet be set for new files
+        if (this.uploadState() === "invalid") {
+            newFiles = newFiles.filter((file) => file.fileStatus !== "invalid");
+        }
+        const error = this._checkErrorState(newFiles);
+        this._files.set(newFiles);
+        this.uploadState.set(this._getNewState(!!error.length));
+        return error;
+    }
+    reValidateFiles() {
+        const files = this.files();
+        const error = this._checkErrorState(files);
+        this.uploadState.set(this._getNewState(!!error.length));
+    }
+    normalizeFiles(files) {
+        if (!files || files.length === 0) {
+            return [];
+        }
+        const newFiles = files.map((file) => {
+            if (file instanceof FileDropzone) {
+                return file;
+            }
+            if (file instanceof File) {
+                return new FileDropzone(file);
+            }
+            throw new Error("Invalid file type provided to addFiles");
+        });
+        return newFiles;
+    }
+    removeFiles(files) {
+        if (!files || files.length === 0) {
+            return [];
+        }
+        const newFiles = this.files().filter((file) => !files.includes(file));
+        this._files.set(newFiles);
+        const errors = this._checkErrorState(newFiles);
+        if (errors.length) {
+            this.uploadState.set("invalid");
+        }
+        else {
+            this.uploadState.set(this._files.length > 0 ? "valid" : "none");
+        }
+        return errors;
+    }
+    _getNewState(error) {
+        if (error) {
+            return "invalid";
+        }
+        return this._files().length > 0 ? "valid" : "none";
+    }
+    _checkErrorState(files) {
+        const errors = [];
+        for (const file of files) {
+            file.helper = undefined;
+            const error = this.validators()
+                .map((validator) => validator(this.maxSize(), this.accept(), file, this.sizeDisplayStandard(), this._translateService.translate.bind(this._translateService)))
+                .filter((err) => err !== undefined);
+            if (error.length) {
+                errors.push(...error);
+                file.helper = {
+                    type: "error",
+                    text: error.join(", "),
+                };
+            }
+            file.fileStatus = error.length ? "invalid" : "valid";
+        }
+        return errors;
+    }
+    async _renameDuplicates(currentFiles, newFiles) {
+        const renamedFiles = [];
+        const fileNames = new Set(currentFiles.map((file) => file.name.toLowerCase()));
+        for (const file of newFiles) {
+            const maxCounter = 1000;
+            let newName = file.name;
+            let counter = 1;
+            while (fileNames.has(newName.toLowerCase()) && counter < maxCounter) {
+                // the .extension part of the file name unfortunately
+                const [fileName, ...rest] = file.name.split(".");
+                newName = `${fileName} (${counter}).${rest.join(".")}`;
+                counter++;
+            }
+            fileNames.add(newName.toLowerCase());
+            renamedFiles.push(await this._copyFile(file.file, newName));
+        }
+        return renamedFiles;
+    }
+    _copyFile(original, newName) {
+        return original.arrayBuffer().then((buffer) => {
+            const file = new File([buffer], newName ?? original.name, {
+                type: original.type,
+                lastModified: original.lastModified,
+            });
+            return new FileDropzone(file);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FileService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FileService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FileService, decorators: [{
+            type: Injectable
+        }] });
+
+class FileDropzoneComponent {
+    /**
+     * Specifies the allowed file types (e.g., "image/png, image/jpeg").
+     *
+     * Does not validate the contents of the file, only the file extension.
+     *
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/accept
+     **/
+    accept = input("");
+    /**
+     * The maximum file size allowed for upload, in bytes.
+     * @default 0 (no limit)
+     **/
+    maxSize = input(0);
+    /**
+     * Specifies the standard to use when displaying file sizes or maximum file size.
+     * Options are "SI" (base 10) or "IEC" (base 2).
+     *
+     * SI units are in multiples of 1000 (e.g., 1 kB = 1000 bytes).
+     *
+     * IEC units are in multiples of 1024 (e.g., 1 KiB = 1024 bytes).
+     * @default "IEC"
+     *
+     * https://wiki.ubuntu.com/UnitsPolicy
+     */
+    sizeDisplayStandard = input("IEC");
+    /**
+     * Determines if multiple files can be uploaded at once via the file picker.
+     *
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/multiple
+     * @default false
+     **/
+    multiple = input(false);
+    /**
+     * If true, each file is validated separately instead of rejecting all at once.
+      @default false
+     **/
+    validateIndividually = input(false);
+    /**
+     * An array of default files that are preloaded in the upload list.
+     * @default false
+     **/
+    defaultFiles = input([]);
+    /**
+     * The unique identifier for the input element that this label is associated with.
+     * This ID should match the input element's `id` attribute to ensure accessibility.
+     */
+    inputId = input();
+    /**
+     * The name attribute for the file input, used for form submission and identifying the field.
+     */
+    name = input();
+    /**
+     * The text label displayed for the file dropzone, providing context for users.
+     */
+    label = input("file-dropzone.label");
+    /**
+     * Additional CSS class names to apply to the dropzone for custom styling
+     */
+    className = input();
+    /**
+     * Specifies how to handle file name conflicts when multiple file of the same name are added.
+     * Options are:
+     * - "append": Adds new files to the end of the list, keeping existing files
+     * - "replace": Replaces existing files with new files of the same name
+     *  @default "append"
+     */
+    mode = input("append");
+    /**
+     * If true, allows uploading folders instead of just files.
+     * This enables the user to select a folder and upload all its contents.
+     * Default file browser behaviour will prevent upload of files in this state.
+     * @default false
+     */
+    uploadFolder = input(false);
+    /**
+     * Validation functions that can be used to validate files.
+     * Each function should return a string error message if validation fails, or undefined if it passes
+     */
+    validators = input([
+        validateFileSize,
+        validateFileType,
+    ]);
+    /**
+     * If true, shows the file dropzone as in a erroring state with red border.
+     * Overrides default validation state.
+     * @default false
+     **/
+    hasError = input(false);
+    /**
+     * Output event triggered when files are added.
+     **/
+    fileChange = output();
+    /**
+     * Output event triggered when a file is removed.
+     **/
+    fileDelete = output();
+    fileInputElement = viewChild.required("fileInput");
+    formatBytes = (bytes) => formatBytes(bytes, this.sizeDisplayStandard());
+    _uploadState = computed(() => this._fileService.uploadState());
+    _onChange = (_) => { };
+    _onTouched = () => { };
+    _translationService = inject(TediTranslationService);
+    _fileService = inject(FileService);
+    isDragActive = signal(false);
+    disabled = signal(false);
+    uploadError = signal(null);
+    files = this._fileService.files;
+    classes = computed(() => {
+        const classList = ["tedi-file-dropzone"];
+        if (this.disabled()) {
+            classList.push("tedi-file-dropzone--disabled");
+        }
+        if (this.hasError()) {
+            classList.push("tedi-file-dropzone--invalid");
+        }
+        else if (this._uploadState() !== "none") {
+            classList.push(`tedi-file-dropzone--${this._uploadState()}`);
+        }
+        if (this.isDragActive()) {
+            classList.push("tedi-file-dropzone--drop-over");
+        }
+        if (this.className()) {
+            classList.push(this.className());
+        }
+        return classList.join(" ");
+    });
+    helperText = computed(() => ({
+        text: getDefaultHelpers(this.accept(), this.maxSize(), this.sizeDisplayStandard(), this._translationService.translate.bind(this._translationService)),
+        type: "hint",
+        position: "left",
+    }));
+    ngOnInit() {
+        this.addFiles(this.defaultFiles());
+        this._fileService.maxSize = this.maxSize;
+        this._fileService.accept = this.accept;
+        this._fileService.mode = this.mode;
+        this._fileService.validators = this.validators;
+        this._fileService.sizeDisplayStandard = this.sizeDisplayStandard;
+    }
+    fileClasses = (file) => {
+        const classList = ["tedi-file-dropzone__file-item"];
+        if (file.className) {
+            classList.push(...file.className);
+        }
+        if (file.fileStatus != "none") {
+            classList.push(`tedi-file-dropzone__file-item--${file.fileStatus}`);
+        }
+        return classList.join(" ");
+    };
+    tooltipClasses = (file) => {
+        const classes = ["tedi-file-dropzone__tooltip"];
+        classes.push(`tedi-file-dropzone__tooltip--${file.helper?.type || "hint"}`);
+        return classes.join(" ");
+    };
+    selectionChange = (event) => {
+        const fileList = event.target.files;
+        const files = Array.from(fileList || []);
+        this.addFiles(files);
+        this.fileInputElement().nativeElement.value = "";
+    };
+    onBlur() {
+        this._onTouched();
+    }
+    openFilePicker() {
+        this.fileInputElement().nativeElement.click();
+    }
+    onDragOver = (event) => {
+        event?.preventDefault();
+    };
+    onDragEnter = (event) => {
+        event?.preventDefault();
+        this.isDragActive.set(true);
+        if (event?.dataTransfer) {
+            event.dataTransfer.dropEffect = "copy";
+        }
+    };
+    onDragLeave = (event) => {
+        event?.preventDefault();
+        this.isDragActive.set(false);
+    };
+    onDrop = async (event) => {
+        this.onDragLeave(event);
+        event?.preventDefault();
+        if (!event.dataTransfer)
+            return;
+        const files = Array.from(event.dataTransfer.files);
+        this.addFiles(files);
+    };
+    async addFiles(files) {
+        if (!Array.isArray(files) || !files.length) {
+            return;
+        }
+        const error = await this._fileService.addFiles(files);
+        const normalizedFiles = this._fileService.normalizeFiles(files);
+        this._updateErrorState(error);
+        this._onChange(this._fileService.files());
+        this.fileChange.emit(normalizedFiles);
+    }
+    removeFile(file) {
+        const error = this._fileService.removeFiles([file]);
+        this._updateErrorState(error);
+        this._onChange(this._fileService.files());
+        this.fileDelete.emit(file);
+    }
+    _updateErrorState(error) {
+        if (this._uploadState() === "invalid" &&
+            !this.validateIndividually() &&
+            error.length) {
+            this.uploadError.set(error[0]);
+        }
+        else {
+            this.uploadError.set("");
+        }
+    }
+    onContainerClick() {
+        this.openFilePicker();
+    }
+    writeValue(files) {
+        this.addFiles(files || []);
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled.set(isDisabled);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FileDropzoneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: FileDropzoneComponent, isStandalone: true, selector: "tedi-file-dropzone", inputs: { accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxSize: { classPropertyName: "maxSize", publicName: "maxSize", isSignal: true, isRequired: false, transformFunction: null }, sizeDisplayStandard: { classPropertyName: "sizeDisplayStandard", publicName: "sizeDisplayStandard", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, validateIndividually: { classPropertyName: "validateIndividually", publicName: "validateIndividually", isSignal: true, isRequired: false, transformFunction: null }, defaultFiles: { classPropertyName: "defaultFiles", publicName: "defaultFiles", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, uploadFolder: { classPropertyName: "uploadFolder", publicName: "uploadFolder", isSignal: true, isRequired: false, transformFunction: null }, validators: { classPropertyName: "validators", publicName: "validators", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileChange: "fileChange", fileDelete: "fileDelete" }, host: { listeners: { "blur": "onBlur()", "keydown.code.enter": "openFilePicker()", "dragover": "onDragOver($event)", "dragenter": "onDragEnter($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" } }, providers: [
+            FileService,
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => FileDropzoneComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "fileInputElement", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<input\n  #fileInput\n  class=\"tedi-file-dropzone__input\"\n  type=\"file\"\n  [disabled]=\"disabled()\"\n  [multiple]=\"multiple()\"\n  [id]=\"inputId()\"\n  [attr.webkitdirectory]=\"uploadFolder() ? '' : null\"\n  [accept]=\"accept()\"\n  (change)=\"selectionChange($event)\"\n/>\n\n<button [className]=\"classes()\" (click)=\"onContainerClick()\">\n  <div class=\"tedi-file-dropzone__label-wrapper\">\n    <tedi-icon\n      [name]=\"isDragActive() ? 'file_upload' : 'attach_file'\"\n      [color]=\"disabled() ? 'tertiary' : 'secondary'\"\n    />\n    <label tedi-label class=\"tedi-file-dropzone__label\">{{\n      (isDragActive() ? \"file-upload.drag-and-drop\" : label()) | tediTranslate\n    }}</label>\n  </div>\n</button>\n\n<ng-content select=\"[helper-text]\">\n  @if (helperText(); as message) {\n    <tedi-feedback-text\n      [text]=\"message.text\"\n      [type]=\"message.type || 'hint'\"\n      [position]=\"message.position || 'left'\"\n    />\n  }\n</ng-content>\n\n@for (file of files(); track file.name) {\n  <div class=\"tedi-file-dropzone__file-list\" [tediVerticalSpacing]=\"0.5\">\n    <tedi-card\n      [className]=\"fileClasses(file)\"\n      padding=\"none\"\n      [background]=\"\n        file.fileStatus && file.fileStatus == 'invalid'\n          ? 'danger-primary'\n          : 'tertiary'\n      \"\n    >\n      <tedi-card-content class=\"tedi-file-dropzone__card\" padding=\"xs\">\n        <div class=\"tedi-file-dropzone__file-name\">\n          {{ file.label ?? file.name }}\n\n          @if (file && validateIndividually() && file.helper; as helper) {\n            <tedi-tooltip [className]=\"tooltipClasses(file)\">\n              <tedi-tooltip-trigger>\n                <button tedi-info-button [disabled]=\"file.disabled\"></button>\n              </tedi-tooltip-trigger>\n\n              <tedi-tooltip-content [position]=\"helper?.position || 'top'\">\n                {{ helper.text }}\n              </tedi-tooltip-content>\n            </tedi-tooltip>\n          }\n        </div>\n        <button\n          tedi-closing-button\n          [title]=\"'clear' | tediTranslate\"\n          [iconSize]=\"18\"\n          (click)=\"removeFile(file)\"\n          size=\"small\"\n        ></button>\n      </tedi-card-content>\n    </tedi-card>\n  </div>\n}\n\n<ng-content select=\"[error-text]\">\n  @if (this.uploadError(); as message) {\n    <tedi-feedback-text [text]=\"message\" type=\"error\" position=\"left\" />\n  }\n</ng-content>\n", styles: [".tedi-file-dropzone{text-align:center;cursor:pointer;background-color:var(--file-dropzone-background-default);border:2px dotted var(--file-dropzone-border-default);transition:border-color .2s ease-in-out,background-color .2s ease-in-out}.tedi-file-dropzone{border-radius:var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-file-dropzone{border-radius:var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{border-radius:var(--form-field-radius-desktop)}}.tedi-file-dropzone{padding-left:var(--file-dropzone-padding-x-mobile)}@media (min-width: 576px){.tedi-file-dropzone{padding-left:var(--file-dropzone-padding-x-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{padding-left:var(--file-dropzone-padding-x-desktop)}}.tedi-file-dropzone{padding-right:var(--file-dropzone-padding-x-mobile)}@media (min-width: 576px){.tedi-file-dropzone{padding-right:var(--file-dropzone-padding-x-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{padding-right:var(--file-dropzone-padding-x-desktop)}}.tedi-file-dropzone{padding-top:var(--file-dropzone-padding-y-mobile)}@media (min-width: 576px){.tedi-file-dropzone{padding-top:var(--file-dropzone-padding-y-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{padding-top:var(--file-dropzone-padding-y-desktop)}}.tedi-file-dropzone{padding-bottom:var(--file-dropzone-padding-y-mobile)}@media (min-width: 576px){.tedi-file-dropzone{padding-bottom:var(--file-dropzone-padding-y-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{padding-bottom:var(--file-dropzone-padding-y-desktop)}}.tedi-file-dropzone{margin-bottom:var(--layout-grid-gutters-04-mobile)}@media (min-width: 576px){.tedi-file-dropzone{margin-bottom:var(--layout-grid-gutters-04-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{margin-bottom:var(--layout-grid-gutters-04-desktop)}}.tedi-file-dropzone:hover{background-color:var(--file-dropzone-background-hover);border-color:var(--file-dropzone-border-hover)}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper{display:flex;justify-content:center}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label{font-weight:500;color:var(--file-dropzone-text-default)}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label:hover{cursor:pointer}.tedi-file-dropzone--disabled{pointer-events:none;cursor:not-allowed;background-color:var(--file-dropzone-background-disabled);border-color:var(--file-dropzone-border-disabled)}.tedi-file-dropzone--disabled .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label{color:var(--general-text-disabled)}.tedi-file-dropzone--invalid{border-color:var(--form-general-feedback-error-border)}.tedi-file-dropzone--valid{border-color:var(--form-general-feedback-success-border)}.tedi-file-dropzone--drop-over{color:var(--file-dropzone-text-drop-over);background-color:var(--file-dropzone-background-drop-over);border-color:var(--file-dropzone-border-drop-over)}.tedi-file-dropzone:focus-visible{outline:2px solid var(--file-dropzone-border-hover);outline-offset:1px}.tedi-file-dropzone__input{display:none}.tedi-file-dropzone__file-list{width:100%;list-style:none}.tedi-file-dropzone__file-list{margin-top:var(--layout-grid-gutters-04-mobile)}@media (min-width: 576px){.tedi-file-dropzone__file-list{margin-top:var(--layout-grid-gutters-04-tablet)}}@media (min-width: 992px){.tedi-file-dropzone__file-list{margin-top:var(--layout-grid-gutters-04-desktop)}}.tedi-file-dropzone__file-name{overflow-wrap:anywhere}\n", ".tedi-file-dropzone{width:100%}.tedi-file-dropzone__label-wrapper{pointer-events:none}.tedi-file-dropzone__card{display:flex;justify-content:space-between;align-items:center;--_card-border: transparent}.tedi-file-dropzone__tooltip--error .tedi-info-button{--button-main-neutral-text-default: var(--red-700)}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: CardComponent, selector: "tedi-card", inputs: ["borderless", "spacing", "accentBorder", "selected"] }, { kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["hasSeparator", "autoWidth", "timeline"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize"] }, { kind: "component", type: TooltipComponent, selector: "tedi-tooltip", inputs: ["openWith"] }, { kind: "component", type: TooltipTriggerComponent, selector: "tedi-tooltip-trigger" }, { kind: "component", type: TooltipContentComponent, selector: "tedi-tooltip-content", inputs: ["position", "maxWidth"] }, { kind: "component", type: InfoButtonComponent, selector: "button[tedi-info-button]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: VerticalSpacingDirective, selector: "[tediVerticalSpacing]", inputs: ["tediVerticalSpacing"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FileDropzoneComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-file-dropzone", imports: [
+                        IconComponent,
+                        FeedbackTextComponent,
+                        CardComponent,
+                        CardContentComponent,
+                        ClosingButtonComponent,
+                        TooltipComponent,
+                        TooltipTriggerComponent,
+                        TooltipContentComponent,
+                        InfoButtonComponent,
+                        ReactiveFormsModule,
+                        VerticalSpacingDirective,
+                        TediTranslationPipe,
+                    ], providers: [
+                        FileService,
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => FileDropzoneComponent),
+                            multi: true,
+                        },
+                    ], template: "<input\n  #fileInput\n  class=\"tedi-file-dropzone__input\"\n  type=\"file\"\n  [disabled]=\"disabled()\"\n  [multiple]=\"multiple()\"\n  [id]=\"inputId()\"\n  [attr.webkitdirectory]=\"uploadFolder() ? '' : null\"\n  [accept]=\"accept()\"\n  (change)=\"selectionChange($event)\"\n/>\n\n<button [className]=\"classes()\" (click)=\"onContainerClick()\">\n  <div class=\"tedi-file-dropzone__label-wrapper\">\n    <tedi-icon\n      [name]=\"isDragActive() ? 'file_upload' : 'attach_file'\"\n      [color]=\"disabled() ? 'tertiary' : 'secondary'\"\n    />\n    <label tedi-label class=\"tedi-file-dropzone__label\">{{\n      (isDragActive() ? \"file-upload.drag-and-drop\" : label()) | tediTranslate\n    }}</label>\n  </div>\n</button>\n\n<ng-content select=\"[helper-text]\">\n  @if (helperText(); as message) {\n    <tedi-feedback-text\n      [text]=\"message.text\"\n      [type]=\"message.type || 'hint'\"\n      [position]=\"message.position || 'left'\"\n    />\n  }\n</ng-content>\n\n@for (file of files(); track file.name) {\n  <div class=\"tedi-file-dropzone__file-list\" [tediVerticalSpacing]=\"0.5\">\n    <tedi-card\n      [className]=\"fileClasses(file)\"\n      padding=\"none\"\n      [background]=\"\n        file.fileStatus && file.fileStatus == 'invalid'\n          ? 'danger-primary'\n          : 'tertiary'\n      \"\n    >\n      <tedi-card-content class=\"tedi-file-dropzone__card\" padding=\"xs\">\n        <div class=\"tedi-file-dropzone__file-name\">\n          {{ file.label ?? file.name }}\n\n          @if (file && validateIndividually() && file.helper; as helper) {\n            <tedi-tooltip [className]=\"tooltipClasses(file)\">\n              <tedi-tooltip-trigger>\n                <button tedi-info-button [disabled]=\"file.disabled\"></button>\n              </tedi-tooltip-trigger>\n\n              <tedi-tooltip-content [position]=\"helper?.position || 'top'\">\n                {{ helper.text }}\n              </tedi-tooltip-content>\n            </tedi-tooltip>\n          }\n        </div>\n        <button\n          tedi-closing-button\n          [title]=\"'clear' | tediTranslate\"\n          [iconSize]=\"18\"\n          (click)=\"removeFile(file)\"\n          size=\"small\"\n        ></button>\n      </tedi-card-content>\n    </tedi-card>\n  </div>\n}\n\n<ng-content select=\"[error-text]\">\n  @if (this.uploadError(); as message) {\n    <tedi-feedback-text [text]=\"message\" type=\"error\" position=\"left\" />\n  }\n</ng-content>\n", styles: [".tedi-file-dropzone{text-align:center;cursor:pointer;background-color:var(--file-dropzone-background-default);border:2px dotted var(--file-dropzone-border-default);transition:border-color .2s ease-in-out,background-color .2s ease-in-out}.tedi-file-dropzone{border-radius:var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-file-dropzone{border-radius:var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{border-radius:var(--form-field-radius-desktop)}}.tedi-file-dropzone{padding-left:var(--file-dropzone-padding-x-mobile)}@media (min-width: 576px){.tedi-file-dropzone{padding-left:var(--file-dropzone-padding-x-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{padding-left:var(--file-dropzone-padding-x-desktop)}}.tedi-file-dropzone{padding-right:var(--file-dropzone-padding-x-mobile)}@media (min-width: 576px){.tedi-file-dropzone{padding-right:var(--file-dropzone-padding-x-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{padding-right:var(--file-dropzone-padding-x-desktop)}}.tedi-file-dropzone{padding-top:var(--file-dropzone-padding-y-mobile)}@media (min-width: 576px){.tedi-file-dropzone{padding-top:var(--file-dropzone-padding-y-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{padding-top:var(--file-dropzone-padding-y-desktop)}}.tedi-file-dropzone{padding-bottom:var(--file-dropzone-padding-y-mobile)}@media (min-width: 576px){.tedi-file-dropzone{padding-bottom:var(--file-dropzone-padding-y-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{padding-bottom:var(--file-dropzone-padding-y-desktop)}}.tedi-file-dropzone{margin-bottom:var(--layout-grid-gutters-04-mobile)}@media (min-width: 576px){.tedi-file-dropzone{margin-bottom:var(--layout-grid-gutters-04-tablet)}}@media (min-width: 992px){.tedi-file-dropzone{margin-bottom:var(--layout-grid-gutters-04-desktop)}}.tedi-file-dropzone:hover{background-color:var(--file-dropzone-background-hover);border-color:var(--file-dropzone-border-hover)}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper{display:flex;justify-content:center}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label{font-weight:500;color:var(--file-dropzone-text-default)}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label:hover{cursor:pointer}.tedi-file-dropzone--disabled{pointer-events:none;cursor:not-allowed;background-color:var(--file-dropzone-background-disabled);border-color:var(--file-dropzone-border-disabled)}.tedi-file-dropzone--disabled .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label{color:var(--general-text-disabled)}.tedi-file-dropzone--invalid{border-color:var(--form-general-feedback-error-border)}.tedi-file-dropzone--valid{border-color:var(--form-general-feedback-success-border)}.tedi-file-dropzone--drop-over{color:var(--file-dropzone-text-drop-over);background-color:var(--file-dropzone-background-drop-over);border-color:var(--file-dropzone-border-drop-over)}.tedi-file-dropzone:focus-visible{outline:2px solid var(--file-dropzone-border-hover);outline-offset:1px}.tedi-file-dropzone__input{display:none}.tedi-file-dropzone__file-list{width:100%;list-style:none}.tedi-file-dropzone__file-list{margin-top:var(--layout-grid-gutters-04-mobile)}@media (min-width: 576px){.tedi-file-dropzone__file-list{margin-top:var(--layout-grid-gutters-04-tablet)}}@media (min-width: 992px){.tedi-file-dropzone__file-list{margin-top:var(--layout-grid-gutters-04-desktop)}}.tedi-file-dropzone__file-name{overflow-wrap:anywhere}\n", ".tedi-file-dropzone{width:100%}.tedi-file-dropzone__label-wrapper{pointer-events:none}.tedi-file-dropzone__card{display:flex;justify-content:space-between;align-items:center;--_card-border: transparent}.tedi-file-dropzone__tooltip--error .tedi-info-button{--button-main-neutral-text-default: var(--red-700)}\n"] }]
+        }], propDecorators: { onBlur: [{
+                type: HostListener,
+                args: ["blur"]
+            }], openFilePicker: [{
+                type: HostListener,
+                args: ["keydown.code.enter"]
+            }], onDragOver: [{
+                type: HostListener,
+                args: ["dragover", ["$event"]]
+            }], onDragEnter: [{
+                type: HostListener,
+                args: ["dragenter", ["$event"]]
+            }], onDragLeave: [{
+                type: HostListener,
+                args: ["dragleave", ["$event"]]
+            }], onDrop: [{
+                type: HostListener,
+                args: ["drop", ["$event"]]
+            }] } });
+
+class BreadcrumbsComponent {
+    crumbs = input([]);
+    shortCrumbs = input(false);
+    xs = input();
+    sm = input();
+    md = input();
+    lg = input();
+    xl = input();
+    xxl = input();
+    breakpointService = inject(BreakpointService);
+    breakpointInputs = computed(() => {
+        return this.breakpointService.getBreakpointInputs({
+            crumbs: this.crumbs(),
+            shortCrumbs: this.shortCrumbs(),
+            xs: this.xs(),
+            sm: this.sm(),
+            md: this.md(),
+            lg: this.lg(),
+            xl: this.xl(),
+            xxl: this.xxl(),
+        });
+    });
+    getSecondLastCrumb() {
+        const crumbs = this.breakpointInputs().crumbs;
+        if (crumbs.length > 1) {
+            return crumbs[crumbs.length - 2];
+        }
+        return null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: BreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: BreadcrumbsComponent, isStandalone: true, selector: "tedi-breadcrumbs", inputs: { crumbs: { classPropertyName: "crumbs", publicName: "crumbs", isSignal: true, isRequired: false, transformFunction: null }, shortCrumbs: { classPropertyName: "shortCrumbs", publicName: "shortCrumbs", isSignal: true, isRequired: false, transformFunction: null }, xs: { classPropertyName: "xs", publicName: "xs", isSignal: true, isRequired: false, transformFunction: null }, sm: { classPropertyName: "sm", publicName: "sm", isSignal: true, isRequired: false, transformFunction: null }, md: { classPropertyName: "md", publicName: "md", isSignal: true, isRequired: false, transformFunction: null }, lg: { classPropertyName: "lg", publicName: "lg", isSignal: true, isRequired: false, transformFunction: null }, xl: { classPropertyName: "xl", publicName: "xl", isSignal: true, isRequired: false, transformFunction: null }, xxl: { classPropertyName: "xxl", publicName: "xxl", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<nav\n  *ngIf=\"this.breakpointInputs().crumbs.length > 0\"\n  aria-label=\"Breadcrumb\"\n  class=\"tedi__breadcrumbs\"\n>\n  <ol class=\"tedi__breadcrumbs__list\">\n    <ng-container *ngIf=\"!this.breakpointInputs().shortCrumbs\">\n      <ng-container\n        *ngFor=\"let crumb of this.breakpointInputs().crumbs; let last = last\"\n      >\n        @if (!last) {\n          <li class=\"tedi__breadcrumbs__item\">\n            <a tedi-link [routerLink]=\"crumb.href\" [underline]=\"false\">{{\n              crumb.label\n            }}</a>\n            <tedi-icon color=\"brand\" name=\"chevron_right\" />\n          </li>\n        } @else {\n          <li\n            aria-current=\"page\"\n            tedi-text\n            modifiers=\"inline-block\"\n            color=\"secondary\"\n          >\n            {{ crumb.label }}\n          </li>\n        }\n      </ng-container>\n    </ng-container>\n  </ol>\n  <ng-container\n    *ngIf=\"\n      this.breakpointInputs().crumbs.length > 1 &&\n      this.breakpointInputs().shortCrumbs\n    \"\n  >\n    <div class=\"tedi__breadcrumbs__item\">\n      <tedi-icon color=\"brand\" name=\"arrow_back\" />\n      <a\n        tedi-link\n        [routerLink]=\"getSecondLastCrumb()?.href\"\n        [underline]=\"false\"\n        >{{ getSecondLastCrumb()?.label }}</a\n      >\n    </div>\n  </ng-container>\n</nav>\n", styles: [":host{display:block}.tedi__breadcrumbs__list{display:flex;flex-wrap:wrap;align-items:center;margin:0;list-style:none}.tedi__breadcrumbs__item{display:flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: LinkComponent, selector: "[tedi-link]", inputs: ["variant", "size", "underline", "xs", "sm", "md", "lg", "xl", "xxl"] }, { 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"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: BreadcrumbsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-breadcrumbs", standalone: true, imports: [
+                        CommonModule,
+                        RouterLink,
+                        LinkComponent,
+                        IconComponent,
+                        TextComponent,
+                    ], template: "<nav\n  *ngIf=\"this.breakpointInputs().crumbs.length > 0\"\n  aria-label=\"Breadcrumb\"\n  class=\"tedi__breadcrumbs\"\n>\n  <ol class=\"tedi__breadcrumbs__list\">\n    <ng-container *ngIf=\"!this.breakpointInputs().shortCrumbs\">\n      <ng-container\n        *ngFor=\"let crumb of this.breakpointInputs().crumbs; let last = last\"\n      >\n        @if (!last) {\n          <li class=\"tedi__breadcrumbs__item\">\n            <a tedi-link [routerLink]=\"crumb.href\" [underline]=\"false\">{{\n              crumb.label\n            }}</a>\n            <tedi-icon color=\"brand\" name=\"chevron_right\" />\n          </li>\n        } @else {\n          <li\n            aria-current=\"page\"\n            tedi-text\n            modifiers=\"inline-block\"\n            color=\"secondary\"\n          >\n            {{ crumb.label }}\n          </li>\n        }\n      </ng-container>\n    </ng-container>\n  </ol>\n  <ng-container\n    *ngIf=\"\n      this.breakpointInputs().crumbs.length > 1 &&\n      this.breakpointInputs().shortCrumbs\n    \"\n  >\n    <div class=\"tedi__breadcrumbs__item\">\n      <tedi-icon color=\"brand\" name=\"arrow_back\" />\n      <a\n        tedi-link\n        [routerLink]=\"getSecondLastCrumb()?.href\"\n        [underline]=\"false\"\n        >{{ getSecondLastCrumb()?.label }}</a\n      >\n    </div>\n  </ng-container>\n</nav>\n", styles: [":host{display:block}.tedi__breadcrumbs__list{display:flex;flex-wrap:wrap;align-items:center;margin:0;list-style:none}.tedi__breadcrumbs__item{display:flex;align-items:center}\n"] }]
+        }] });
+
+class PaginationPageComponent {
+    page = input.required();
+    active = input();
+    pageSelected = output();
+    selectPage() {
+        this.pageSelected.emit();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PaginationPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: PaginationPageComponent, isStandalone: true, selector: "tedi-pagination-page", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: true, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageSelected: "pageSelected" }, ngImport: i0, template: "@if (page() === -1) {\n  <span tedi-text color=\"secondary\">...</span>\n} @else {\n  <button\n    class=\"tedi-pagination__page\"\n    [class.tedi-pagination__page--active]=\"active()\"\n    type=\"button\"\n    [attr.aria-current]=\"active() ? 'page' : undefined\"\n    [attr.aria-label]=\"'pagination.page' | tediTranslate: page() : active()\"\n    (click)=\"selectPage()\"\n  >\n    {{ page() }}\n  </button>\n}\n", styles: [":host{display:flex;align-items:center;justify-content:center;height:var(--_pagination-button-size);width:var(--_pagination-button-size)}\n"], dependencies: [{ kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PaginationPageComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-pagination-page", imports: [TextComponent, TediTranslationPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (page() === -1) {\n  <span tedi-text color=\"secondary\">...</span>\n} @else {\n  <button\n    class=\"tedi-pagination__page\"\n    [class.tedi-pagination__page--active]=\"active()\"\n    type=\"button\"\n    [attr.aria-current]=\"active() ? 'page' : undefined\"\n    [attr.aria-label]=\"'pagination.page' | tediTranslate: page() : active()\"\n    (click)=\"selectPage()\"\n  >\n    {{ page() }}\n  </button>\n}\n", styles: [":host{display:flex;align-items:center;justify-content:center;height:var(--_pagination-button-size);width:var(--_pagination-button-size)}\n"] }]
+        }] });
+
+const getPagesToDisplay = (currentPage, lastPage) => {
+    const pages = new Set([1, currentPage, lastPage].filter((nr) => Boolean(nr)));
+    let pagesAdded = pages.size;
+    for (let diffFromCurrent = 1; diffFromCurrent <= 6 && pagesAdded < 7; diffFromCurrent++) {
+        if (currentPage - diffFromCurrent > 1) {
+            pages.add(currentPage - diffFromCurrent);
+            pagesAdded += 1;
+        }
+        if (currentPage + diffFromCurrent < lastPage) {
+            pages.add(currentPage + diffFromCurrent);
+            pagesAdded += 1;
+        }
+    }
+    const sortedPages = [...pages].sort((a, b) => a - b);
+    if (sortedPages[0] && sortedPages[2] && sortedPages[2] - sortedPages[0] > 2) {
+        sortedPages.splice(1, 1, -1);
+    }
+    if (sortedPages[sortedPages.length - 1] &&
+        sortedPages[sortedPages.length - 3] &&
+        sortedPages[sortedPages.length - 1] - sortedPages[sortedPages.length - 3] >
+            2) {
+        sortedPages.splice(sortedPages.length - 2, 1, -1);
+    }
+    return sortedPages;
+};
+
+class PaginationComponent {
+    page = model(1);
+    pageSize = model(50);
+    pageSizeOptions = input([10, 50, 100]);
+    length = input(0);
+    hideResults = input(false, { transform: booleanAttribute });
+    hidePageSize = input(false, { transform: booleanAttribute });
+    lastPage = computed(() => {
+        return Math.ceil(this.length() / this.pageSize());
+    });
+    dropdownId = crypto.randomUUID();
+    pages = computed(() => {
+        return getPagesToDisplay(this.page(), this.lastPage());
+    });
+    hasPreviousButton = computed(() => this.page() > 1);
+    hasNextButton = computed(() => this.page() < this.lastPage());
+    changePage(step) {
+        this.page.update((currentPage) => currentPage + step);
+    }
+    selectPage(page) {
+        this.page.set(page);
+    }
+    pageSizeChanged() {
+        this.page.set(1);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: PaginationComponent, isStandalone: true, selector: "tedi-pagination", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, hideResults: { classPropertyName: "hideResults", publicName: "hideResults", isSignal: true, isRequired: false, transformFunction: null }, hidePageSize: { classPropertyName: "hidePageSize", publicName: "hidePageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange", pageSize: "pageSizeChange" }, ngImport: i0, template: "<div class=\"tedi-pagination\">\n  @if (!hideResults()) {\n    <span\n      tedi-text\n      class=\"tedi-pagination__results\"\n      color=\"secondary\"\n      modifiers=\"small\"\n      >{{ length() }} {{ \"pagination.results\" | tediTranslate: length() }}</span\n    >\n  }\n  <nav\n    [attr.aria-label]=\"'pagination.title' | tediTranslate\"\n    class=\"tedi-pagination__pager\"\n  >\n    <ul class=\"tedi-pagination__pages\">\n      <li>\n        <button\n          tedi-button\n          [disabled]=\"!hasPreviousButton()\"\n          class=\"tedi-pagination__nav-button\"\n          size=\"small\"\n          variant=\"neutral\"\n          type=\"button\"\n          (click)=\"changePage(-1)\"\n          [attr.aria-label]=\"'pagination.prev-page' | tediTranslate\"\n        >\n          <tedi-icon name=\"arrow_back\" />\n        </button>\n      </li>\n      @for (pageNr of pages(); track $index) {\n        <li>\n          <tedi-pagination-page\n            [page]=\"pageNr\"\n            [active]=\"pageNr === page()\"\n            (pageSelected)=\"selectPage(pageNr)\"\n          />\n        </li>\n      }\n      <li>\n        <button\n          tedi-button\n          [disabled]=\"!hasNextButton()\"\n          class=\"tedi-pagination__nav-button\"\n          size=\"small\"\n          variant=\"neutral\"\n          type=\"button\"\n          (click)=\"changePage(1)\"\n          [attr.aria-label]=\"'pagination.next-page' | tediTranslate\"\n        >\n          <tedi-icon name=\"arrow_forward\" />\n        </button>\n      </li>\n    </ul>\n  </nav>\n\n  @if (!hidePageSize()) {\n    <div class=\"tedi-pagination__page-size-options\">\n      <label tedi-text color=\"secondary\" modifiers=\"small\" [for]=\"dropdownId\">{{\n        \"pagination.page-size\" | tediTranslate\n      }}</label>\n      <select\n        [id]=\"dropdownId\"\n        [(ngModel)]=\"pageSize\"\n        (change)=\"pageSizeChanged()\"\n        class=\"tedi-pagination__dropdown\"\n      >\n        @for (size of pageSizeOptions(); track size) {\n          <option [value]=\"size\">{{ size }}</option>\n        }\n      </select>\n    </div>\n  }\n</div>\n", styles: [".tedi-pagination{--_pagination-border: var(--general-border-secondary, #9293a4);--_pagination-background: var(--general-surface-primary, #fff);--_pagination-page-background: transparent;--_pagination-page-text: var(--general-text-secondary, #4b4e62);--_pagination-layout: \"results page-size-options\" \"pager pager\";border-top:1px solid var(--_pagination-border);background:var(--_pagination-background);padding:var(--_pagination-padding-y) var(--_pagination-padding-x);display:grid;align-items:center;grid-template-areas:var(--_pagination-layout)}.tedi-pagination{--_pagination-padding-y: var(--pagination-padding-y-mobile)}@media (min-width: 576px){.tedi-pagination{--_pagination-padding-y: var(--pagination-padding-y-tablet)}}@media (min-width: 992px){.tedi-pagination{--_pagination-padding-y: var(--pagination-padding-y-desktop)}}.tedi-pagination{--_pagination-padding-x: var(--pagination-padding-x-mobile)}@media (min-width: 576px){.tedi-pagination{--_pagination-padding-x: var(--pagination-padding-x-tablet)}}@media (min-width: 992px){.tedi-pagination{--_pagination-padding-x: var(--pagination-padding-x-desktop)}}.tedi-pagination{--_pagination-button-size: var(--pagination-button-size-mobile)}@media (min-width: 576px){.tedi-pagination{--_pagination-button-size: var(--pagination-button-size-tablet)}}@media (min-width: 992px){.tedi-pagination{--_pagination-button-size: var(--pagination-button-size-desktop)}}.tedi-pagination{gap:var(--layout-grid-gutters-04-mobile)}@media (min-width: 576px){.tedi-pagination{gap:var(--layout-grid-gutters-04-tablet)}}@media (min-width: 992px){.tedi-pagination{gap:var(--layout-grid-gutters-04-desktop)}}@media (min-width: 768px){.tedi-pagination{--_pagination-layout: \"results pager page-size-options\";grid-template-columns:repeat(3,1fr)}}.tedi-pagination__results{grid-area:results}.tedi-pagination__pager{grid-area:pager;justify-self:center}.tedi-pagination__pages{display:flex;justify-items:center;align-items:center;list-style:none;margin:0}.tedi-pagination__pages{gap:var(--layout-grid-gutters-08-mobile)}@media (min-width: 576px){.tedi-pagination__pages{gap:var(--layout-grid-gutters-08-tablet)}}@media (min-width: 992px){.tedi-pagination__pages{gap:var(--layout-grid-gutters-08-desktop)}}.tedi-pagination__page{display:flex;justify-content:center;align-items:center;height:100%;width:100%;flex-shrink:0;border-radius:50%;border:none;background:var(--_pagination-page-background);color:var(--_pagination-page-text);cursor:pointer}.tedi-pagination__page:hover{--_pagination-page-background: var( --button-main-neutral-icon-only-background-hover, #e7f0f6 );--_pagination-page-text: var(--button-main-neutral-text-hover, #004277)}.tedi-pagination__page:active{--_pagination-page-background: var( --button-main-neutral-icon-only-background-active, #d0e1ee );--_pagination-page-text: var(--button-main-neutral-text-active, #003662)}.tedi-pagination__page:focus{--_pagination-page-background: var( --button-main-neutral-icon-only-background-focus, rgba(0, 0, 0, 0) );--_pagination-page-text: var(--button-main-neutral-text-focus, #005aa3)}.tedi-pagination__page.tedi-pagination__page--active{--_pagination-page-background: var( --general-surface-brand-secondary, #004277 );--_pagination-page-text: var(--general-text-white, #fff);pointer-events:none}.tedi-pagination__nav-button.tedi-button[disabled]{color:transparent;pointer-events:none;-webkit-user-select:none;user-select:none}.tedi-pagination__page-size-options{grid-area:page-size-options;display:flex;align-items:center;justify-self:flex-end}.tedi-pagination__page-size-options{gap:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-pagination__page-size-options{gap:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-pagination__page-size-options{gap:var(--form-field-inner-spacing-desktop)}}.tedi-pagination__dropdown{border:1px solid var(--form-input-border-default, #838494)}.tedi-pagination__dropdown{border-radius:var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-pagination__dropdown{border-radius:var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-pagination__dropdown{border-radius:var(--form-field-radius-desktop)}}.tedi-pagination__dropdown{min-height:var(--form-field-height-sm-mobile)}@media (min-width: 576px){.tedi-pagination__dropdown{min-height:var(--form-field-height-sm-tablet)}}@media (min-width: 992px){.tedi-pagination__dropdown{min-height:var(--form-field-height-sm-desktop)}}\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: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }, { kind: "component", type: PaginationPageComponent, selector: "tedi-pagination-page", inputs: ["page", "active"], outputs: ["pageSelected"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PaginationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-pagination", imports: [
+                        ButtonComponent,
+                        IconComponent,
+                        TextComponent,
+                        TediTranslationPipe,
+                        PaginationPageComponent,
+                        FormsModule,
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"tedi-pagination\">\n  @if (!hideResults()) {\n    <span\n      tedi-text\n      class=\"tedi-pagination__results\"\n      color=\"secondary\"\n      modifiers=\"small\"\n      >{{ length() }} {{ \"pagination.results\" | tediTranslate: length() }}</span\n    >\n  }\n  <nav\n    [attr.aria-label]=\"'pagination.title' | tediTranslate\"\n    class=\"tedi-pagination__pager\"\n  >\n    <ul class=\"tedi-pagination__pages\">\n      <li>\n        <button\n          tedi-button\n          [disabled]=\"!hasPreviousButton()\"\n          class=\"tedi-pagination__nav-button\"\n          size=\"small\"\n          variant=\"neutral\"\n          type=\"button\"\n          (click)=\"changePage(-1)\"\n          [attr.aria-label]=\"'pagination.prev-page' | tediTranslate\"\n        >\n          <tedi-icon name=\"arrow_back\" />\n        </button>\n      </li>\n      @for (pageNr of pages(); track $index) {\n        <li>\n          <tedi-pagination-page\n            [page]=\"pageNr\"\n            [active]=\"pageNr === page()\"\n            (pageSelected)=\"selectPage(pageNr)\"\n          />\n        </li>\n      }\n      <li>\n        <button\n          tedi-button\n          [disabled]=\"!hasNextButton()\"\n          class=\"tedi-pagination__nav-button\"\n          size=\"small\"\n          variant=\"neutral\"\n          type=\"button\"\n          (click)=\"changePage(1)\"\n          [attr.aria-label]=\"'pagination.next-page' | tediTranslate\"\n        >\n          <tedi-icon name=\"arrow_forward\" />\n        </button>\n      </li>\n    </ul>\n  </nav>\n\n  @if (!hidePageSize()) {\n    <div class=\"tedi-pagination__page-size-options\">\n      <label tedi-text color=\"secondary\" modifiers=\"small\" [for]=\"dropdownId\">{{\n        \"pagination.page-size\" | tediTranslate\n      }}</label>\n      <select\n        [id]=\"dropdownId\"\n        [(ngModel)]=\"pageSize\"\n        (change)=\"pageSizeChanged()\"\n        class=\"tedi-pagination__dropdown\"\n      >\n        @for (size of pageSizeOptions(); track size) {\n          <option [value]=\"size\">{{ size }}</option>\n        }\n      </select>\n    </div>\n  }\n</div>\n", styles: [".tedi-pagination{--_pagination-border: var(--general-border-secondary, #9293a4);--_pagination-background: var(--general-surface-primary, #fff);--_pagination-page-background: transparent;--_pagination-page-text: var(--general-text-secondary, #4b4e62);--_pagination-layout: \"results page-size-options\" \"pager pager\";border-top:1px solid var(--_pagination-border);background:var(--_pagination-background);padding:var(--_pagination-padding-y) var(--_pagination-padding-x);display:grid;align-items:center;grid-template-areas:var(--_pagination-layout)}.tedi-pagination{--_pagination-padding-y: var(--pagination-padding-y-mobile)}@media (min-width: 576px){.tedi-pagination{--_pagination-padding-y: var(--pagination-padding-y-tablet)}}@media (min-width: 992px){.tedi-pagination{--_pagination-padding-y: var(--pagination-padding-y-desktop)}}.tedi-pagination{--_pagination-padding-x: var(--pagination-padding-x-mobile)}@media (min-width: 576px){.tedi-pagination{--_pagination-padding-x: var(--pagination-padding-x-tablet)}}@media (min-width: 992px){.tedi-pagination{--_pagination-padding-x: var(--pagination-padding-x-desktop)}}.tedi-pagination{--_pagination-button-size: var(--pagination-button-size-mobile)}@media (min-width: 576px){.tedi-pagination{--_pagination-button-size: var(--pagination-button-size-tablet)}}@media (min-width: 992px){.tedi-pagination{--_pagination-button-size: var(--pagination-button-size-desktop)}}.tedi-pagination{gap:var(--layout-grid-gutters-04-mobile)}@media (min-width: 576px){.tedi-pagination{gap:var(--layout-grid-gutters-04-tablet)}}@media (min-width: 992px){.tedi-pagination{gap:var(--layout-grid-gutters-04-desktop)}}@media (min-width: 768px){.tedi-pagination{--_pagination-layout: \"results pager page-size-options\";grid-template-columns:repeat(3,1fr)}}.tedi-pagination__results{grid-area:results}.tedi-pagination__pager{grid-area:pager;justify-self:center}.tedi-pagination__pages{display:flex;justify-items:center;align-items:center;list-style:none;margin:0}.tedi-pagination__pages{gap:var(--layout-grid-gutters-08-mobile)}@media (min-width: 576px){.tedi-pagination__pages{gap:var(--layout-grid-gutters-08-tablet)}}@media (min-width: 992px){.tedi-pagination__pages{gap:var(--layout-grid-gutters-08-desktop)}}.tedi-pagination__page{display:flex;justify-content:center;align-items:center;height:100%;width:100%;flex-shrink:0;border-radius:50%;border:none;background:var(--_pagination-page-background);color:var(--_pagination-page-text);cursor:pointer}.tedi-pagination__page:hover{--_pagination-page-background: var( --button-main-neutral-icon-only-background-hover, #e7f0f6 );--_pagination-page-text: var(--button-main-neutral-text-hover, #004277)}.tedi-pagination__page:active{--_pagination-page-background: var( --button-main-neutral-icon-only-background-active, #d0e1ee );--_pagination-page-text: var(--button-main-neutral-text-active, #003662)}.tedi-pagination__page:focus{--_pagination-page-background: var( --button-main-neutral-icon-only-background-focus, rgba(0, 0, 0, 0) );--_pagination-page-text: var(--button-main-neutral-text-focus, #005aa3)}.tedi-pagination__page.tedi-pagination__page--active{--_pagination-page-background: var( --general-surface-brand-secondary, #004277 );--_pagination-page-text: var(--general-text-white, #fff);pointer-events:none}.tedi-pagination__nav-button.tedi-button[disabled]{color:transparent;pointer-events:none;-webkit-user-select:none;user-select:none}.tedi-pagination__page-size-options{grid-area:page-size-options;display:flex;align-items:center;justify-self:flex-end}.tedi-pagination__page-size-options{gap:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-pagination__page-size-options{gap:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-pagination__page-size-options{gap:var(--form-field-inner-spacing-desktop)}}.tedi-pagination__dropdown{border:1px solid var(--form-input-border-default, #838494)}.tedi-pagination__dropdown{border-radius:var(--form-field-radius-mobile)}@media (min-width: 576px){.tedi-pagination__dropdown{border-radius:var(--form-field-radius-tablet)}}@media (min-width: 992px){.tedi-pagination__dropdown{border-radius:var(--form-field-radius-desktop)}}.tedi-pagination__dropdown{min-height:var(--form-field-height-sm-mobile)}@media (min-width: 576px){.tedi-pagination__dropdown{min-height:var(--form-field-height-sm-tablet)}}@media (min-width: 992px){.tedi-pagination__dropdown{min-height:var(--form-field-height-sm-desktop)}}\n"] }]
+        }] });
+
+class TabContentComponent {
+    tabId = input.required();
+    content = viewChild.required("content");
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TabContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.15", type: TabContentComponent, isStandalone: true, selector: "tedi-tab-content", inputs: { tabId: { classPropertyName: "tabId", publicName: "tabId", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #content>\n  <ng-content />\n</ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TabContentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-tab-content", imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #content>\n  <ng-content />\n</ng-template>\n" }]
+        }] });
+
+class TabComponent {
+    element;
+    tabId = input.required();
+    selected = model(false);
+    disabledInput = input(false, {
+        transform: booleanAttribute,
+        // eslint-disable-next-line @angular-eslint/no-input-rename
+        alias: "disabled",
+    });
+    disabled; // for cdk/a11y keymanager
+    tabSelected = output();
+    routerLinkActive = inject(RouterLinkActive, { self: true });
+    linkActive = toSignal(this.routerLinkActive.isActiveChange.pipe(startWith(this.routerLinkActive.isActive)));
+    isTabActive = computed(() => this.selected() || this.linkActive());
+    selectTab() {
+        this.selected.set(true);
+        this.tabSelected.emit();
+    }
+    focus() {
+        this.element.nativeElement.focus();
+    }
+    constructor(element) {
+        this.element = element;
+        effect(() => {
+            this.disabled = this.disabledInput();
+        });
+        this.routerLinkActive.routerLinkActive = ["tedi-tab--active"]; // should be changed once hostDirectives allow default values
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TabComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: TabComponent, isStandalone: true, selector: "[tedi-tab]", inputs: { tabId: { classPropertyName: "tabId", publicName: "tabId", isSignal: true, isRequired: true, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange", tabSelected: "tabSelected" }, host: { listeners: { "click": "selectTab()" }, properties: { "class.tedi-tab": "true", "class.tedi-tab--selected": "selected()", "class.tedi-tab--disabled": "disabledInput()", "attr.role": "'tab'" } }, hostDirectives: [{ directive: i1$2.RouterLinkActive, inputs: ["routerLinkActiveOptions", "routerLinkActiveOptions", "ariaCurrentWhenActive", "ariaCurrentWhenActive"], outputs: ["isActiveChange", "isActiveChange"] }], ngImport: i0, template: "<ng-content />\n", styles: [".tedi-tab{--_tab-background: var(--tab-item-default-background);--_tab-color: var(--tab-item-default-text);--_tab-padding: var(--_tab-padding-y) var(--_tab-padding-x);--_tab-selected-border: var(--tab-item-selected-border);padding:var(--_tab-padding);background:var(--_tab-background);color:var(--_tab-color);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--_tab-inner-spacing);border:none;cursor:pointer;text-decoration:none}.tedi-tab{--_tab-padding-y: var(--tab-spacing-y-mobile)}@media (min-width: 576px){.tedi-tab{--_tab-padding-y: var(--tab-spacing-y-tablet)}}@media (min-width: 992px){.tedi-tab{--_tab-padding-y: var(--tab-spacing-y-desktop)}}.tedi-tab{--_tab-padding-x: var(--tab-spacing-x-mobile)}@media (min-width: 576px){.tedi-tab{--_tab-padding-x: var(--tab-spacing-x-tablet)}}@media (min-width: 992px){.tedi-tab{--_tab-padding-x: var(--tab-spacing-x-desktop)}}.tedi-tab{--_tab-inner-spacing: var(--tab-inner-spacing-mobile)}@media (min-width: 576px){.tedi-tab{--_tab-inner-spacing: var(--tab-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-tab{--_tab-inner-spacing: var(--tab-inner-spacing-desktop)}}.tedi-tab{font-size:var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-tab{font-size:var(--body-regular-size-desktop)}}.tedi-tab:active{--_tab-background: var(--tab-item-active-background);--_tab-color: var(--tab-item-active-text)}.tedi-tab:hover,.tedi-tab:focus{--_tab-background: var(--tab-item-hover-background);--_tab-color: var(--tab-item-hover-text)}.tedi-tab--selected,.tedi-tab--active{--_tab-background: var(--tab-item-selected-background);--_tab-color: var(--tab-item-selected-text)}.tedi-tab--selected,.tedi-tab--active{font-weight:var(--body-bold-weight-mobile)}@media (min-width: 576px){.tedi-tab--selected,.tedi-tab--active{font-weight:var(--body-bold-weight-tablet)}}@media (min-width: 992px){.tedi-tab--selected,.tedi-tab--active{font-weight:var(--body-bold-weight-desktop)}}.tedi-tab--selected:after,.tedi-tab--active:after{content:\"\";position:absolute;border-top:3px solid var(--_tab-selected-border);top:0;left:0;right:0}.tedi-tab--disabled{pointer-events:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TabComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "[tedi-tab]", imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-tab]": "true",
+                        "[class.tedi-tab--selected]": "selected()",
+                        "[class.tedi-tab--disabled]": "disabledInput()",
+                        "[attr.role]": "'tab'",
+                        "(click)": "selectTab()",
+                    }, hostDirectives: [
+                        {
+                            directive: RouterLinkActive,
+                            inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive"],
+                            outputs: ["isActiveChange"],
+                        },
+                    ], template: "<ng-content />\n", styles: [".tedi-tab{--_tab-background: var(--tab-item-default-background);--_tab-color: var(--tab-item-default-text);--_tab-padding: var(--_tab-padding-y) var(--_tab-padding-x);--_tab-selected-border: var(--tab-item-selected-border);padding:var(--_tab-padding);background:var(--_tab-background);color:var(--_tab-color);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--_tab-inner-spacing);border:none;cursor:pointer;text-decoration:none}.tedi-tab{--_tab-padding-y: var(--tab-spacing-y-mobile)}@media (min-width: 576px){.tedi-tab{--_tab-padding-y: var(--tab-spacing-y-tablet)}}@media (min-width: 992px){.tedi-tab{--_tab-padding-y: var(--tab-spacing-y-desktop)}}.tedi-tab{--_tab-padding-x: var(--tab-spacing-x-mobile)}@media (min-width: 576px){.tedi-tab{--_tab-padding-x: var(--tab-spacing-x-tablet)}}@media (min-width: 992px){.tedi-tab{--_tab-padding-x: var(--tab-spacing-x-desktop)}}.tedi-tab{--_tab-inner-spacing: var(--tab-inner-spacing-mobile)}@media (min-width: 576px){.tedi-tab{--_tab-inner-spacing: var(--tab-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-tab{--_tab-inner-spacing: var(--tab-inner-spacing-desktop)}}.tedi-tab{font-size:var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-tab{font-size:var(--body-regular-size-desktop)}}.tedi-tab:active{--_tab-background: var(--tab-item-active-background);--_tab-color: var(--tab-item-active-text)}.tedi-tab:hover,.tedi-tab:focus{--_tab-background: var(--tab-item-hover-background);--_tab-color: var(--tab-item-hover-text)}.tedi-tab--selected,.tedi-tab--active{--_tab-background: var(--tab-item-selected-background);--_tab-color: var(--tab-item-selected-text)}.tedi-tab--selected,.tedi-tab--active{font-weight:var(--body-bold-weight-mobile)}@media (min-width: 576px){.tedi-tab--selected,.tedi-tab--active{font-weight:var(--body-bold-weight-tablet)}}@media (min-width: 992px){.tedi-tab--selected,.tedi-tab--active{font-weight:var(--body-bold-weight-desktop)}}.tedi-tab--selected:after,.tedi-tab--active:after{content:\"\";position:absolute;border-top:3px solid var(--_tab-selected-border);top:0;left:0;right:0}.tedi-tab--disabled{pointer-events:none}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }] });
+
+class TabsComponent {
+    injector = inject(Injector);
+    mobileTabsOpened = signal(false);
+    tabs = contentChildren(TabComponent);
+    tabContents = contentChildren(TabContentComponent);
+    keyManager;
+    activeTabId = computed(() => this.tabs()
+        .find((tab) => tab.isTabActive())
+        ?.tabId());
+    activeTabContent = computed(() => this.tabContents()
+        .find((content) => content.tabId() === this.activeTabId())
+        ?.content());
+    onActiveTabChanges(tabs) {
+        tabs.forEach((tab) => {
+            tab.tabSelected.subscribe(() => {
+                this.mobileTabsOpened.set(false);
+                tabs.forEach((otherTab) => {
+                    if (otherTab !== tab) {
+                        otherTab.selected.set(false);
+                    }
+                });
+            });
+        });
+    }
+    onKeyDown(event) {
+        this.keyManager?.onKeydown(event);
+    }
+    constructor() {
+        effect(() => {
+            const tabs = this.tabs();
+            this.onActiveTabChanges(tabs);
+        });
+    }
+    ngOnInit() {
+        this.keyManager = new FocusKeyManager(this.tabs, this.injector)
+            .withWrap()
+            .withHorizontalOrientation("ltr");
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TabsComponent, isStandalone: true, selector: "tedi-tabs", host: { listeners: { "keydown": "onKeyDown($event)" }, properties: { "class.tedi-tabs": "true" } }, queries: [{ propertyName: "tabs", predicate: TabComponent, isSignal: true }, { propertyName: "tabContents", predicate: TabContentComponent, isSignal: true }], ngImport: i0, template: "<ng-template #tabsList><ng-content select=\"[tedi-tab]\" /></ng-template>\n\n<tedi-card padding=\"none\">\n  <tedi-card-content>\n    <div role=\"tablist\" class=\"tedi-tabs__tab-list\">\n      @if (!mobileTabsOpened()) {\n        <ng-container *ngTemplateOutlet=\"tabsList\" />\n      }\n      <button\n        aria-haspopup=\"menu\"\n        (click)=\"mobileTabsOpened.set(true)\"\n        class=\"tedi-tab tedi-tab--more-btn\"\n      >\n        {{ \"more\" | tediTranslate }}\n        <tedi-icon name=\"expand_more\" [size]=\"18\" />\n      </button>\n    </div>\n  </tedi-card-content>\n\n  <tedi-card-content role=\"tabpanel\" [attr.aria-labelledby]=\"activeTabId()\">\n    @if (activeTabContent(); as activeContent) {\n      <ng-container *ngTemplateOutlet=\"activeContent\" />\n    }\n    <ng-content></ng-content>\n  </tedi-card-content>\n</tedi-card>\n\n@if (mobileTabsOpened()) {\n  <tedi-card padding=\"none\" class=\"tedi-tabs__mobile-dropdown\">\n    <tedi-card-content hasSeparator autoWidth padding=\"xs\">\n      <button\n        tedi-closing-button\n        size=\"small\"\n        (click)=\"mobileTabsOpened.set(false)\"\n      ></button>\n    </tedi-card-content>\n    <tedi-card-content class=\"tedi-tabs__mobile-list\">\n      <ng-container *ngTemplateOutlet=\"tabsList\" />\n    </tedi-card-content>\n  </tedi-card>\n}\n", styles: [".tedi-tabs{--_tab-list-background: var(--tab-background)}.tedi-tabs__tab-list{display:flex;justify-content:start;overflow:auto;border-top-left-radius:var(--tab-top-radius, 4px);border-top-right-radius:var(--tab-top-radius, 4px);background:var(--_tab-list-background)}@media (max-width: 575.98px){.tedi-tabs__tab-list .tedi-tab:not(.tedi-tab--more-btn){flex-grow:1}.tedi-tabs__tab-list .tedi-tab:not(.tedi-tab--active,.tedi-tab--selected,.tedi-tab--more-btn){display:none}}@media (min-width: 576px){.tedi-tabs .tedi-tab--more-btn{display:none}}.tedi-tabs__mobile-dropdown.tedi-card{position:fixed;inset:0;z-index:1050}.tedi-tabs__mobile-list.tedi-card-content{display:flex;flex-direction:column}.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active{--_tab-background: var(--dropdown-item-active-background);--_tab-color: var(--dropdown-item-active-text)}.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active{font-weight:var(--body-regular-weight-mobile)}@media (min-width: 576px){.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active{font-weight:var(--body-regular-weight-tablet)}}@media (min-width: 992px){.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active{font-weight:var(--body-regular-weight-desktop)}}.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected:after,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active:after{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CardComponent, selector: "tedi-card", inputs: ["borderless", "spacing", "accentBorder", "selected"] }, { kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["hasSeparator", "autoWidth", "timeline"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TabsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-tabs", imports: [
+                        CommonModule,
+                        CardComponent,
+                        CardContentComponent,
+                        ClosingButtonComponent,
+                        IconComponent,
+                        TediTranslationPipe,
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        "[class.tedi-tabs]": "true",
+                        "(keydown)": "onKeyDown($event)",
+                    }, template: "<ng-template #tabsList><ng-content select=\"[tedi-tab]\" /></ng-template>\n\n<tedi-card padding=\"none\">\n  <tedi-card-content>\n    <div role=\"tablist\" class=\"tedi-tabs__tab-list\">\n      @if (!mobileTabsOpened()) {\n        <ng-container *ngTemplateOutlet=\"tabsList\" />\n      }\n      <button\n        aria-haspopup=\"menu\"\n        (click)=\"mobileTabsOpened.set(true)\"\n        class=\"tedi-tab tedi-tab--more-btn\"\n      >\n        {{ \"more\" | tediTranslate }}\n        <tedi-icon name=\"expand_more\" [size]=\"18\" />\n      </button>\n    </div>\n  </tedi-card-content>\n\n  <tedi-card-content role=\"tabpanel\" [attr.aria-labelledby]=\"activeTabId()\">\n    @if (activeTabContent(); as activeContent) {\n      <ng-container *ngTemplateOutlet=\"activeContent\" />\n    }\n    <ng-content></ng-content>\n  </tedi-card-content>\n</tedi-card>\n\n@if (mobileTabsOpened()) {\n  <tedi-card padding=\"none\" class=\"tedi-tabs__mobile-dropdown\">\n    <tedi-card-content hasSeparator autoWidth padding=\"xs\">\n      <button\n        tedi-closing-button\n        size=\"small\"\n        (click)=\"mobileTabsOpened.set(false)\"\n      ></button>\n    </tedi-card-content>\n    <tedi-card-content class=\"tedi-tabs__mobile-list\">\n      <ng-container *ngTemplateOutlet=\"tabsList\" />\n    </tedi-card-content>\n  </tedi-card>\n}\n", styles: [".tedi-tabs{--_tab-list-background: var(--tab-background)}.tedi-tabs__tab-list{display:flex;justify-content:start;overflow:auto;border-top-left-radius:var(--tab-top-radius, 4px);border-top-right-radius:var(--tab-top-radius, 4px);background:var(--_tab-list-background)}@media (max-width: 575.98px){.tedi-tabs__tab-list .tedi-tab:not(.tedi-tab--more-btn){flex-grow:1}.tedi-tabs__tab-list .tedi-tab:not(.tedi-tab--active,.tedi-tab--selected,.tedi-tab--more-btn){display:none}}@media (min-width: 576px){.tedi-tabs .tedi-tab--more-btn{display:none}}.tedi-tabs__mobile-dropdown.tedi-card{position:fixed;inset:0;z-index:1050}.tedi-tabs__mobile-list.tedi-card-content{display:flex;flex-direction:column}.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active{--_tab-background: var(--dropdown-item-active-background);--_tab-color: var(--dropdown-item-active-text)}.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active{font-weight:var(--body-regular-weight-mobile)}@media (min-width: 576px){.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active{font-weight:var(--body-regular-weight-tablet)}}@media (min-width: 992px){.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active{font-weight:var(--body-regular-weight-desktop)}}.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--selected:after,.tedi-tabs__mobile-list.tedi-card-content .tedi-tab--active:after{display:none}\n"] }]
+        }], ctorParameters: () => [] });
+
+class TableStylesComponent {
+    size = input("default");
+    verticalBorders = input(false, { transform: booleanAttribute });
+    striped = input(false, { transform: booleanAttribute });
+    clickable = input(false, { transform: booleanAttribute });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableStylesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: TableStylesComponent, isStandalone: true, selector: "tedi-table-styles", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, verticalBorders: { classPropertyName: "verticalBorders", publicName: "verticalBorders", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-table-styles": "true", "class.tedi-table-styles--striped": "striped()", "class.tedi-table-styles--vertical-borders": "verticalBorders()", "class.tedi-table-styles--clickable": "clickable()", "class.tedi-table-styles--sm": "size() === 'small'" } }, ngImport: i0, template: "<div class=\"tedi-table-scroll\" cdkScrollable>\n  <ng-content />\n</div>\n<ng-content select=\"tedi-pagination, [tedi-table-pagination]\" />\n", styles: [".tedi-table-styles{--_table-bg: var(--table-default);--_table-border: var(--table-border);--_table-contrast-border: var(--table-border-th);--_table-stripe: var(--table-striped);--_table-hover: var(--table-hover);--_table-color: var(--general-text-primary);--_table-header-color: var(--general-text-tertiary);display:block;background:var(--_table-bg);border-radius:var(--_table-radius);border:1px solid var(--_table-border);overflow:hidden}.tedi-table-styles{--_table-radius: var(--table-radius-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-radius: var(--table-radius-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-radius: var(--table-radius-desktop)}}.tedi-table-styles{--_table-header-padding-y: var(--table-header-padding-y-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-header-padding-y: var(--table-header-padding-y-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-header-padding-y: var(--table-header-padding-y-desktop)}}.tedi-table-styles{--_table-header-padding-x: var(--table-header-padding-x-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-header-padding-x: var(--table-header-padding-x-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-header-padding-x: var(--table-header-padding-x-desktop)}}.tedi-table-styles{--_table-data-padding-y: var(--table-data-padding-y-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-data-padding-y: var(--table-data-padding-y-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-data-padding-y: var(--table-data-padding-y-desktop)}}.tedi-table-styles{--_table-data-padding-x: var(--table-data-padding-x-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-data-padding-x: var(--table-data-padding-x-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-data-padding-x: var(--table-data-padding-x-desktop)}}.tedi-table-styles table{border-collapse:collapse;border-spacing:0;vertical-align:middle;width:100%;position:relative}.tedi-table-styles th,.tedi-table-styles td{text-align:left}.tedi-table-styles th,.tedi-table-styles td{font-family:var(--family-primary-mobile)}@media (min-width: 576px){.tedi-table-styles th,.tedi-table-styles td{font-family:var(--family-primary-tablet)}}@media (min-width: 992px){.tedi-table-styles th,.tedi-table-styles td{font-family:var(--family-primary-desktop)}}.tedi-table-styles th,.tedi-table-styles td{font-weight:var(--body-regular-weight-mobile)}@media (min-width: 576px){.tedi-table-styles th,.tedi-table-styles td{font-weight:var(--body-regular-weight-tablet)}}@media (min-width: 992px){.tedi-table-styles th,.tedi-table-styles td{font-weight:var(--body-regular-weight-desktop)}}.tedi-table-styles th,.tedi-table-styles td{font-size:var(--body-regular-size-mobile)}@media (min-width: 576px){.tedi-table-styles th,.tedi-table-styles td{font-size:var(--body-regular-size-tablet)}}@media (min-width: 992px){.tedi-table-styles th,.tedi-table-styles td{font-size:var(--body-regular-size-desktop)}}.tedi-table-styles th,.tedi-table-styles td{line-height:var(--body-regular-line-height-mobile)}@media (min-width: 576px){.tedi-table-styles th,.tedi-table-styles td{line-height:var(--body-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-table-styles th,.tedi-table-styles td{line-height:var(--body-regular-line-height-desktop)}}.tedi-table-styles th{padding:var(--_table-header-padding-y) var(--_table-header-padding-x);border-bottom:1px solid var(--_table-contrast-border);color:var(--_table-header-color)}.tedi-table-styles td{padding:var(--_table-data-padding-y) var(--_table-data-padding-x);border-bottom:1px solid var(--_table-border);color:var(--_table-color)}.tedi-table-styles tr:last-child td{border-bottom:none}.tedi-table-styles .tedi-cell--align-center{text-align:center}.tedi-table-styles .tedi-cell--align-right{text-align:right}.tedi-table-styles .tedi-row--secondary{background-color:var(--_table-stripe)}.tedi-table-styles .tedi-table-scroll{overflow-x:auto}.tedi-table-styles--striped tbody tr:nth-child(2n){background-color:var(--_table-stripe)}.tedi-table-styles--clickable tbody tr:hover{cursor:pointer;background-color:var(--_table-hover)}.tedi-table-styles--vertical-borders :is(th,td):not(:last-child){border-right:1px solid var(--_table-border)}.tedi-table-styles--sm{--_table-header-padding-y: var(--table-header-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-table-styles--sm{--_table-header-padding-y: var(--table-header-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-table-styles--sm{--_table-header-padding-y: var(--table-header-padding-y-sm-desktop)}}.tedi-table-styles--sm{--_table-header-padding-x: var(--table-header-padding-x-sm-mobile)}@media (min-width: 576px){.tedi-table-styles--sm{--_table-header-padding-x: var(--table-header-padding-x-sm-tablet)}}@media (min-width: 992px){.tedi-table-styles--sm{--_table-header-padding-x: var(--table-header-padding-x-sm-desktop)}}.tedi-table-styles--sm{--_table-data-padding-y: var(--table-data-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-table-styles--sm{--_table-data-padding-y: var(--table-data-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-table-styles--sm{--_table-data-padding-y: var(--table-data-padding-y-sm-desktop)}}.tedi-table-styles--sm{--_table-data-padding-x: var(--table-data-padding-x-sm-mobile)}@media (min-width: 576px){.tedi-table-styles--sm{--_table-data-padding-x: var(--table-data-padding-x-sm-tablet)}}@media (min-width: 992px){.tedi-table-styles--sm{--_table-data-padding-x: var(--table-data-padding-x-sm-desktop)}}\n"], dependencies: [{ kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableStylesComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-table-styles", imports: [CdkScrollable], host: {
+                        "[class.tedi-table-styles]": "true",
+                        "[class.tedi-table-styles--striped]": "striped()",
+                        "[class.tedi-table-styles--vertical-borders]": "verticalBorders()",
+                        "[class.tedi-table-styles--clickable]": "clickable()",
+                        "[class.tedi-table-styles--sm]": "size() === 'small'",
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"tedi-table-scroll\" cdkScrollable>\n  <ng-content />\n</div>\n<ng-content select=\"tedi-pagination, [tedi-table-pagination]\" />\n", styles: [".tedi-table-styles{--_table-bg: var(--table-default);--_table-border: var(--table-border);--_table-contrast-border: var(--table-border-th);--_table-stripe: var(--table-striped);--_table-hover: var(--table-hover);--_table-color: var(--general-text-primary);--_table-header-color: var(--general-text-tertiary);display:block;background:var(--_table-bg);border-radius:var(--_table-radius);border:1px solid var(--_table-border);overflow:hidden}.tedi-table-styles{--_table-radius: var(--table-radius-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-radius: var(--table-radius-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-radius: var(--table-radius-desktop)}}.tedi-table-styles{--_table-header-padding-y: var(--table-header-padding-y-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-header-padding-y: var(--table-header-padding-y-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-header-padding-y: var(--table-header-padding-y-desktop)}}.tedi-table-styles{--_table-header-padding-x: var(--table-header-padding-x-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-header-padding-x: var(--table-header-padding-x-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-header-padding-x: var(--table-header-padding-x-desktop)}}.tedi-table-styles{--_table-data-padding-y: var(--table-data-padding-y-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-data-padding-y: var(--table-data-padding-y-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-data-padding-y: var(--table-data-padding-y-desktop)}}.tedi-table-styles{--_table-data-padding-x: var(--table-data-padding-x-mobile)}@media (min-width: 576px){.tedi-table-styles{--_table-data-padding-x: var(--table-data-padding-x-tablet)}}@media (min-width: 992px){.tedi-table-styles{--_table-data-padding-x: var(--table-data-padding-x-desktop)}}.tedi-table-styles table{border-collapse:collapse;border-spacing:0;vertical-align:middle;width:100%;position:relative}.tedi-table-styles th,.tedi-table-styles td{text-align:left}.tedi-table-styles th,.tedi-table-styles td{font-family:var(--family-primary-mobile)}@media (min-width: 576px){.tedi-table-styles th,.tedi-table-styles td{font-family:var(--family-primary-tablet)}}@media (min-width: 992px){.tedi-table-styles th,.tedi-table-styles td{font-family:var(--family-primary-desktop)}}.tedi-table-styles th,.tedi-table-styles td{font-weight:var(--body-regular-weight-mobile)}@media (min-width: 576px){.tedi-table-styles th,.tedi-table-styles td{font-weight:var(--body-regular-weight-tablet)}}@media (min-width: 992px){.tedi-table-styles th,.tedi-table-styles td{font-weight:var(--body-regular-weight-desktop)}}.tedi-table-styles th,.tedi-table-styles td{font-size:var(--body-regular-size-mobile)}@media (min-width: 576px){.tedi-table-styles th,.tedi-table-styles td{font-size:var(--body-regular-size-tablet)}}@media (min-width: 992px){.tedi-table-styles th,.tedi-table-styles td{font-size:var(--body-regular-size-desktop)}}.tedi-table-styles th,.tedi-table-styles td{line-height:var(--body-regular-line-height-mobile)}@media (min-width: 576px){.tedi-table-styles th,.tedi-table-styles td{line-height:var(--body-regular-line-height-tablet)}}@media (min-width: 992px){.tedi-table-styles th,.tedi-table-styles td{line-height:var(--body-regular-line-height-desktop)}}.tedi-table-styles th{padding:var(--_table-header-padding-y) var(--_table-header-padding-x);border-bottom:1px solid var(--_table-contrast-border);color:var(--_table-header-color)}.tedi-table-styles td{padding:var(--_table-data-padding-y) var(--_table-data-padding-x);border-bottom:1px solid var(--_table-border);color:var(--_table-color)}.tedi-table-styles tr:last-child td{border-bottom:none}.tedi-table-styles .tedi-cell--align-center{text-align:center}.tedi-table-styles .tedi-cell--align-right{text-align:right}.tedi-table-styles .tedi-row--secondary{background-color:var(--_table-stripe)}.tedi-table-styles .tedi-table-scroll{overflow-x:auto}.tedi-table-styles--striped tbody tr:nth-child(2n){background-color:var(--_table-stripe)}.tedi-table-styles--clickable tbody tr:hover{cursor:pointer;background-color:var(--_table-hover)}.tedi-table-styles--vertical-borders :is(th,td):not(:last-child){border-right:1px solid var(--_table-border)}.tedi-table-styles--sm{--_table-header-padding-y: var(--table-header-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-table-styles--sm{--_table-header-padding-y: var(--table-header-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-table-styles--sm{--_table-header-padding-y: var(--table-header-padding-y-sm-desktop)}}.tedi-table-styles--sm{--_table-header-padding-x: var(--table-header-padding-x-sm-mobile)}@media (min-width: 576px){.tedi-table-styles--sm{--_table-header-padding-x: var(--table-header-padding-x-sm-tablet)}}@media (min-width: 992px){.tedi-table-styles--sm{--_table-header-padding-x: var(--table-header-padding-x-sm-desktop)}}.tedi-table-styles--sm{--_table-data-padding-y: var(--table-data-padding-y-sm-mobile)}@media (min-width: 576px){.tedi-table-styles--sm{--_table-data-padding-y: var(--table-data-padding-y-sm-tablet)}}@media (min-width: 992px){.tedi-table-styles--sm{--_table-data-padding-y: var(--table-data-padding-y-sm-desktop)}}.tedi-table-styles--sm{--_table-data-padding-x: var(--table-data-padding-x-sm-mobile)}@media (min-width: 576px){.tedi-table-styles--sm{--_table-data-padding-x: var(--table-data-padding-x-sm-tablet)}}@media (min-width: 992px){.tedi-table-styles--sm{--_table-data-padding-x: var(--table-data-padding-x-sm-desktop)}}\n"] }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AccordionComponent, AccordionIconComponent, AccordionItemComponent, AccordionItemContentComponent, AccordionItemHeaderComponent, BreadcrumbsComponent, CardColorsDirective, CardComponent, CardContentComponent, CardHeaderComponent, CardPaddingDirective, CardRowComponent, CheckboxCardGroupComponent, CheckboxComponent, CheckboxGroupComponent, ChoiceGroupDirective, DropdownComponent, DropdownItemComponent, DropdownTriggerDirective, FileDropzoneComponent, FormFieldComponent, InputComponent, InputGroupComponent, ModalComponent, ModalFooterComponent, ModalHeaderComponent, MultiselectComponent, PaginationComponent, RadioCardGroupComponent, RadioComponent, RadioGroupComponent, SearchComponent, SelectComponent, SelectOptionComponent, StatusBadgeComponent, TabComponent, TabContentComponent, TableStylesComponent, TabsComponent, TagComponent, TextareaComponent, modalBreakpoints, specialOptionControls };
+//# sourceMappingURL=tedi-design-system-angular-community.mjs.map