@tedi-design-system/angular 8.1.0-rc.16 → 8.1.0-rc.18

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

@@ -2707,20 +2707,6 @@ const translationsMap = {
         en: "Table of contents",
         ru: "Содержание",
     },
-    "table-of-contents.valid": {
-        description: "Number of valid steps",
-        components: ["TableOfContents"],
-        et: (count) => `${count} valiidsed`,
-        en: (count) => `${count} valid`,
-        ru: (count) => `${count} действительны`,
-    },
-    "table-of-contents.invalid": {
-        description: "Number of invalid steps",
-        components: ["TableOfContents"],
-        et: (count) => `${count} mitte valiidne`,
-        en: (count) => `${count} invalid`,
-        ru: (count) => `${count} неверный`,
-    },
     "truncate.see-more": {
         description: "See more button label",
         components: ["Truncate"],
@@ -12583,6 +12569,11 @@ class SelectComponent {
      * Used for label association and accessibility.
      */
     inputId = input.required(...(ngDevMode ? [{ debugName: "inputId" }] : []));
+    /**
+     * Name the selection is submitted under in a native form, one entry per
+     * selected value. With object options, set `bindValue` to pick what is sent.
+     */
+    name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
     /**
      * Label text displayed above the select.
      */
@@ -12853,6 +12844,17 @@ class SelectComponent {
     measuredRowHeight = signal(null, ...(ngDevMode ? [{ debugName: "measuredRowHeight" }] : []));
     static DEFAULT_ROW_HEIGHT = 40;
     static SMALL_ROW_HEIGHT = 36;
+    /**
+     * Values written to the hidden form inputs — one entry per selected value,
+     * and a single empty entry when nothing is selected, so the field is still
+     * submitted.
+     */
+    formValues = computed(() => {
+        const values = this.selectedValues();
+        if (!values.length)
+            return [""];
+        return values.map((value) => (value == null ? "" : String(value)));
+    }, ...(ngDevMode ? [{ debugName: "formValues" }] : []));
     hiddenTagsCount = computed(() => {
         const visible = this.visibleTagsCount();
         const total = this.selectedValues().length;
@@ -13870,13 +13872,13 @@ class SelectComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: SelectComponent, isStandalone: true, selector: "tedi-select", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, dropdownWidthRef: { classPropertyName: "dropdownWidthRef", publicName: "dropdownWidthRef", isSignal: true, isRequired: false, transformFunction: null }, dropdownAlign: { classPropertyName: "dropdownAlign", publicName: "dropdownAlign", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, allowMultiple: { classPropertyName: "allowMultiple", publicName: "allowMultiple", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, selectableGroups: { classPropertyName: "selectableGroups", publicName: "selectableGroups", isSignal: true, isRequired: false, transformFunction: null }, isTagRemovable: { classPropertyName: "isTagRemovable", publicName: "isTagRemovable", isSignal: true, isRequired: false, transformFunction: null }, multiRow: { classPropertyName: "multiRow", publicName: "multiRow", isSignal: true, isRequired: false, transformFunction: null }, tagEllipsis: { classPropertyName: "tagEllipsis", publicName: "tagEllipsis", isSignal: true, isRequired: false, transformFunction: null }, ellipsis: { classPropertyName: "ellipsis", publicName: "ellipsis", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, disabledKey: { classPropertyName: "disabledKey", publicName: "disabledKey", isSignal: true, isRequired: false, transformFunction: null }, noOptionsMessage: { classPropertyName: "noOptionsMessage", publicName: "noOptionsMessage", isSignal: true, isRequired: false, transformFunction: null }, maxDropdownHeight: { classPropertyName: "maxDropdownHeight", publicName: "maxDropdownHeight", isSignal: true, isRequired: false, transformFunction: null }, hideOnScroll: { classPropertyName: "hideOnScroll", publicName: "hideOnScroll", isSignal: true, isRequired: false, transformFunction: null }, dropdownType: { classPropertyName: "dropdownType", publicName: "dropdownType", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualItemSize: { classPropertyName: "virtualItemSize", publicName: "virtualItemSize", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, searchFn: { classPropertyName: "searchFn", publicName: "searchFn", isSignal: true, isRequired: false, transformFunction: null }, clearSearchOnSelect: { classPropertyName: "clearSearchOnSelect", publicName: "clearSearchOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", searchChange: "searchChange", opened: "opened", closed: "closed", cleared: "cleared" }, host: { listeners: { "window:resize": "onWindowResize()", "document:click": "onDocumentClick($event)" }, properties: { "class.tedi-select--multiselect": "allowMultiple()" }, classAttribute: "tedi-select" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: SelectComponent, isStandalone: true, selector: "tedi-select", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, dropdownWidthRef: { classPropertyName: "dropdownWidthRef", publicName: "dropdownWidthRef", isSignal: true, isRequired: false, transformFunction: null }, dropdownAlign: { classPropertyName: "dropdownAlign", publicName: "dropdownAlign", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, bindLabel: { classPropertyName: "bindLabel", publicName: "bindLabel", isSignal: true, isRequired: false, transformFunction: null }, bindValue: { classPropertyName: "bindValue", publicName: "bindValue", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, allowMultiple: { classPropertyName: "allowMultiple", publicName: "allowMultiple", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, selectableGroups: { classPropertyName: "selectableGroups", publicName: "selectableGroups", isSignal: true, isRequired: false, transformFunction: null }, isTagRemovable: { classPropertyName: "isTagRemovable", publicName: "isTagRemovable", isSignal: true, isRequired: false, transformFunction: null }, multiRow: { classPropertyName: "multiRow", publicName: "multiRow", isSignal: true, isRequired: false, transformFunction: null }, tagEllipsis: { classPropertyName: "tagEllipsis", publicName: "tagEllipsis", isSignal: true, isRequired: false, transformFunction: null }, ellipsis: { classPropertyName: "ellipsis", publicName: "ellipsis", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, disabledKey: { classPropertyName: "disabledKey", publicName: "disabledKey", isSignal: true, isRequired: false, transformFunction: null }, noOptionsMessage: { classPropertyName: "noOptionsMessage", publicName: "noOptionsMessage", isSignal: true, isRequired: false, transformFunction: null }, maxDropdownHeight: { classPropertyName: "maxDropdownHeight", publicName: "maxDropdownHeight", isSignal: true, isRequired: false, transformFunction: null }, hideOnScroll: { classPropertyName: "hideOnScroll", publicName: "hideOnScroll", isSignal: true, isRequired: false, transformFunction: null }, dropdownType: { classPropertyName: "dropdownType", publicName: "dropdownType", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualItemSize: { classPropertyName: "virtualItemSize", publicName: "virtualItemSize", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, searchFn: { classPropertyName: "searchFn", publicName: "searchFn", isSignal: true, isRequired: false, transformFunction: null }, clearSearchOnSelect: { classPropertyName: "clearSearchOnSelect", publicName: "clearSearchOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", searchChange: "searchChange", opened: "opened", closed: "closed", cleared: "cleared" }, host: { listeners: { "window:resize": "onWindowResize()", "document:click": "onDocumentClick($event)" }, properties: { "class.tedi-select--multiselect": "allowMultiple()" }, classAttribute: "tedi-select" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => SelectComponent),
                 multi: true,
             },
-        ], queries: [{ propertyName: "optionTemplate", first: true, predicate: SelectOptionTemplateDirective, descendants: true, isSignal: true }, { propertyName: "valueTemplate", first: true, predicate: SelectValueTemplateDirective, descendants: true, isSignal: true }, { propertyName: "tooltipTemplate", first: true, predicate: SelectTooltipTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "listboxRef", first: true, predicate: CdkListbox, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "cdkListboxRef", first: true, predicate: CdkListbox, descendants: true, isSignal: true }, { propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }, { propertyName: "virtualListboxRef", first: true, predicate: ["virtualListbox"], descendants: true, isSignal: true }, { propertyName: "connectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true, isSignal: true }, { propertyName: "triggerRef", first: true, predicate: ["trigger"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "searchInputRef", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }, { propertyName: "multiselectContainerRef", first: true, predicate: ["multiselectContainer"], descendants: true, isSignal: true }, { propertyName: "tagRefs", predicate: ["tagElement"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@if (label()) {\n  <tedi-label-row>\n    <label\n      [id]=\"labelId()\"\n      tedi-label\n      [for]=\"inputId()\"\n      [required]=\"required()\"\n      [size]=\"size()\"\n      (click)=\"onTriggerClick()\"\n    >\n      {{ label() }}\n    </label>\n    @if (tooltipTemplate()?.template; as tooltipTpl) {\n      <tedi-info-tooltip>\n        <ng-container [ngTemplateOutlet]=\"tooltipTpl\" />\n      </tedi-info-tooltip>\n    } @else if (tooltip(); as tooltipText) {\n      <tedi-info-tooltip>{{ tooltipText }}</tedi-info-tooltip>\n    }\n  </tedi-label-row>\n}\n<div\n  [id]=\"searchable() ? null : inputId()\"\n  class=\"tedi-select__trigger tedi-input\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  [class.tedi-input--small]=\"size() === 'small'\"\n  [class.tedi-input--error]=\"state() === 'error'\"\n  [class.tedi-input--valid]=\"state() === 'valid'\"\n  [class.tedi-select__trigger--searchable]=\"searchable()\"\n  [class.tedi-select__trigger--search-focused]=\"searchFocused()\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  [attr.role]=\"searchable() ? null : 'combobox'\"\n  [attr.aria-haspopup]=\"searchable() ? null : 'listbox'\"\n  [attr.aria-expanded]=\"searchable() ? null : isOpen()\"\n  [attr.aria-controls]=\"!searchable() && isOpen() ? listboxId() : null\"\n  [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n  [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n  [tabindex]=\"searchable() || disabled() ? -1 : 0\"\n  (click)=\"onTriggerClick()\"\n  (keydown.enter)=\"onTriggerEnter()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  @if (searchable()) {\n    <div class=\"tedi-select__search-wrapper\">\n      @if (showSingleSelectedValue()) {\n        <span class=\"tedi-select__selected-value\">\n          @if (valueTemplate(); as tpl) {\n            @if (selectedOptions()[0]; as option) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"getValueContext(option)\"\n              />\n            }\n          } @else {\n            {{ selectedLabels().join(\", \") }}\n          }\n        </span>\n      }\n      @if (allowMultiple() && selectedValues().length) {\n        <ng-container\n          [ngTemplateOutlet]=\"multiselectTags\"\n          [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n        />\n      } @else {\n        <input\n          #searchInput\n          [id]=\"inputId()\"\n          type=\"text\"\n          class=\"tedi-select__search-input\"\n          [class.tedi-select__search-input--hidden]=\"showSingleSelectedValue()\"\n          [placeholder]=\"showSingleSelectedValue() ? '' : placeholder()\"\n          [value]=\"searchTerm()\"\n          [disabled]=\"disabled()\"\n          (input)=\"onSearchInput($event)\"\n          (focus)=\"onSearchFocus()\"\n          (blur)=\"onSearchBlur()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          autocomplete=\"off\"\n          role=\"combobox\"\n          aria-autocomplete=\"list\"\n          [attr.aria-expanded]=\"isOpen()\"\n          [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n          [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n          [attr.aria-label]=\"resolvedAriaLabel()\"\n        />\n      }\n    </div>\n  } @else {\n    <span class=\"tedi-select__label\">\n      @if (selectedValues().length) {\n        @if (allowMultiple()) {\n          <ng-container\n            [ngTemplateOutlet]=\"multiselectTags\"\n            [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n          />\n        } @else if (ellipsis(); as ellipsisPos) {\n          <tedi-ellipsis [position]=\"ellipsisPos\" [lineClamp]=\"1\">\n            <ng-container [ngTemplateOutlet]=\"singleValue\" />\n          </tedi-ellipsis>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"singleValue\" />\n        }\n      } @else {\n        <span class=\"tedi-select__label--placeholder\">\n          {{ placeholder() }}\n        </span>\n      }\n    </span>\n  }\n\n  @if (clearable() && selectedValues().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'clear' | tediTranslate\"\n      (click)=\"clear($event)\"\n      (keydown.enter)=\"clear($event)\"\n      (keydown.space)=\"clear($event)\"\n      [attr.aria-describedby]=\"label() ? labelId() : null\"\n    ></button>\n  }\n\n  <span\n    class=\"tedi-select__arrow\"\n    aria-hidden=\"true\"\n    (click)=\"onArrowClick($event)\"\n  >\n    <tedi-icon name=\"arrow_drop_down\" />\n  </span>\n</div>\n@if (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 #singleValue>\n  @if (valueTemplate(); as tpl) {\n    @if (selectedOptions()[0]; as option) {\n      <ng-container\n        [ngTemplateOutlet]=\"tpl.template\"\n        [ngTemplateOutletContext]=\"getValueContext(option)\"\n      />\n    }\n  } @else {\n    {{ selectedLabels().join(\", \") }}\n  }\n</ng-template>\n\n<ng-template #multiselectTags>\n  <div\n    class=\"tedi-select__multiselect-container\"\n    [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n    [class.tedi-select__multiselect-container--ellipsis]=\"tagEllipsis()\"\n    #multiselectContainer\n  >\n    @if (multiRow()) {\n      @for (value of selectedValues(); track value) {\n        <tedi-tag\n          [ellipsis]=\"tagEllipsis()\"\n          [closable]=\"isTagRemovable()\"\n          (closed)=\"deselect($event, value)\"\n        >\n          {{ getLabel(value) }}\n        </tedi-tag>\n      }\n    } @else {\n      <div class=\"tedi-select__multiselect-tags\">\n        @for (value of selectedValues(); track value; let i = $index) {\n          @if (visibleTagsCount() === null || i < visibleTagsCount()!) {\n            <tedi-tag\n              #tagElement\n              [ellipsis]=\"tagEllipsis()\"\n              [closable]=\"isTagRemovable()\"\n              (closed)=\"deselect($event, value)\"\n            >\n              {{ getLabel(value) }}\n            </tedi-tag>\n          }\n        }\n      </div>\n      @if (hiddenTagsCount() > 0) {\n        <tedi-tag class=\"tedi-select__multiselect-counter\"\n          >+{{ hiddenTagsCount() }}</tedi-tag\n        >\n      }\n    }\n    @if (searchable()) {\n      <input\n        #searchInput\n        [id]=\"inputId()\"\n        type=\"text\"\n        class=\"tedi-select__search-input\"\n        [value]=\"searchTerm()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onSearchInput($event)\"\n        (focus)=\"onSearchFocus()\"\n        (blur)=\"onSearchBlur()\"\n        (keydown)=\"onSearchKeydown($event)\"\n        autocomplete=\"off\"\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n        [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n        [attr.aria-label]=\"resolvedAriaLabel()\"\n      />\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"dropdownPositions()\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n  (attach)=\"onOverlayAttached()\"\n  (detach)=\"toggleIsOpen(true)\"\n>\n  <div\n    class=\"tedi-select__dropdown\"\n    [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n    [style.max-height]=\"dropdownMaxHeight() ? dropdownMaxHeight() + 'px' : null\"\n  >\n    @if (virtualize()) {\n      <div\n        #virtualListbox\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options tedi-select__options--virtual\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        role=\"listbox\"\n        [attr.aria-multiselectable]=\"allowMultiple() ? true : null\"\n        [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n        [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n        [attr.aria-activedescendant]=\"activeDescendantId()\"\n        [tabindex]=\"searchable() ? -1 : 0\"\n        (keydown)=\"onVirtualListboxKeydown($event)\"\n      >\n        @if (filteredOptions().length) {\n          @if (showSelectAllRow()) {\n            <div\n              class=\"tedi-dropdown-item\"\n              [id]=\"listboxId() + '-select-all'\"\n              role=\"option\"\n              [attr.aria-selected]=\"allOptionsSelected()\"\n              [class.tedi-dropdown-item--active]=\"activeIndex() === 0\"\n              (click)=\"onVirtualSelectAllClick()\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </div>\n          }\n          <cdk-virtual-scroll-viewport\n            class=\"tedi-select__viewport\"\n            [itemSize]=\"virtualRowHeight()\"\n            [style.height.px]=\"virtualViewportHeight()\"\n            [minBufferPx]=\"virtualRowHeight() * 6\"\n            [maxBufferPx]=\"virtualRowHeight() * 12\"\n          >\n            <div\n              *cdkVirtualFor=\"\n                let option of filteredOptions();\n                let i = index;\n                trackBy: trackByOptionValue\n              \"\n              class=\"tedi-dropdown-item\"\n              [id]=\"virtualOptionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"isOptionSelected(option.value)\"\n              [attr.aria-disabled]=\"option.disabled ? true : null\"\n              [class.tedi-dropdown-item--selected]=\"\n                !allowMultiple() && isOptionSelected(option.value)\n              \"\n              [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n              [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n              [class.tedi-dropdown-item--active]=\"\n                activeIndex() - (showSelectAllRow() ? 1 : 0) === i\n              \"\n              (click)=\"onVirtualOptionClick(option)\"\n            >\n              @if (optionTemplate(); as tpl) {\n                <ng-container\n                  [ngTemplateOutlet]=\"tpl.template\"\n                  [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                />\n              } @else {\n                <tedi-dropdown-item-value\n                  [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              }\n            </div>\n          </cdk-virtual-scroll-viewport>\n        } @else {\n          <div\n            class=\"tedi-dropdown-item tedi-select__no-options\"\n            role=\"option\"\n            aria-disabled=\"true\"\n          >\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </div>\n        }\n      </div>\n    } @else {\n      <ul\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        [class.tedi-select__options--swatch-grid]=\"dropdownType() === 'grid'\"\n        cdkListbox\n        [cdkListboxMultiple]=\"allowMultiple()\"\n        [cdkListboxValue]=\"visibleSelectedValues()\"\n        [cdkListboxNavigatesDisabledOptions]=\"false\"\n        [cdkListboxUseActiveDescendant]=\"true\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        (keydown.tab)=\"toggleIsOpen(true)\"\n        (keydown.escape)=\"toggleIsOpen(true)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (filteredOptions().length) {\n          @if (allowMultiple() && showSelectAll()) {\n            <li\n              class=\"tedi-dropdown-item\"\n              [cdkOption]=\"SpecialOptionControls.SELECT_ALL\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </li>\n          }\n\n          @for (group of optionGroups(); track group.label) {\n            @if (group.label.length > 0) {\n              @if (allowMultiple() && selectableGroups()) {\n                <li\n                  class=\"tedi-dropdown-item tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"SpecialOptionControls.SELECT_GROUP + group.label\"\n                >\n                  <tedi-dropdown-item-value\n                    type=\"checkbox\"\n                    [selected]=\"isGroupSelected(group.label)\"\n                    [indeterminate]=\"isGroupIndeterminate(group.label)\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      group.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                </li>\n              } @else {\n                <li class=\"tedi-select__group-name\" role=\"presentation\">\n                  <span tedi-text color=\"tertiary\">\n                    {{ group.label }}\n                  </span>\n                </li>\n              }\n            }\n\n            @for (option of group.options; track option.value; let i = $index) {\n              <li\n                class=\"tedi-dropdown-item\"\n                [class.tedi-dropdown-item--selected]=\"\n                  !allowMultiple() && isOptionSelected(option.value)\n                \"\n                [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n                [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n                [cdkOption]=\"option.value\"\n                [cdkOptionDisabled]=\"option.disabled\"\n              >\n                @if (optionTemplate(); as tpl) {\n                  <ng-container\n                    [ngTemplateOutlet]=\"tpl.template\"\n                    [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                  />\n                } @else {\n                  <tedi-dropdown-item-value\n                    [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                    [selected]=\"isOptionSelected(option.value)\"\n                    [disabled]=\"!!option.disabled\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      option.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li class=\"tedi-dropdown-item tedi-select__no-options\">\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </li>\n        }\n      </ul>\n    }\n  </div>\n</ng-template>\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}.tedi-input{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);--_placeholder-color: var(--form-input-text-placeholder);--_search-input-reserve: 5rem;margin-bottom:0;font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled)}.tedi-input:hover{--_field-border-color: var(--form-input-border-hover)}.tedi-input:focus,.tedi-input:active,.tedi-input.tedi-select__trigger--search-focused{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input--disabled{--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);color:var(--form-input-text-disabled);pointer-events:none}.tedi-input--error:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(.tedi-input--disabled):focus,.tedi-input--error:not(.tedi-input--disabled):active,.tedi-input--error:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-input--valid:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(.tedi-input--disabled):focus,.tedi-input--valid:not(.tedi-input--disabled):active,.tedi-input--valid:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-select{display:block;width:100%}.tedi-select .tedi-feedback-text{margin-top:var(--form-field-outer-spacing)}.tedi-select__trigger{display:flex;justify-content:space-between;width:100%;cursor:pointer}.tedi-select__label{flex-grow:1;overflow:hidden;text-align:left;cursor:default}.tedi-select__label--placeholder{color:var(--_placeholder-color);pointer-events:none}.tedi-select__clear{flex-grow:0;padding:0;margin:0;color:var(--button-close-text-default);cursor:pointer;background:none;border:none}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{display:inline-flex;flex-grow:0;flex-shrink:0;align-items:center;padding-left:var(--form-field-inner-spacing);margin-left:var(--form-field-inner-spacing);color:inherit;cursor:default}.tedi-select__dropdown{display:flex;flex-direction:column;max-height:100%;margin-top:var(--form-field-outer-spacing);margin-bottom:var(--form-field-outer-spacing);background:var(--card-background-primary);border-radius:var(--card-radius-rounded);box-shadow:0 1px 5px 0 var(--tedi-alpha-20)}.tedi-select__trigger--searchable{cursor:text}.tedi-select__search-wrapper{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--body-regular-line-height);overflow:hidden}.tedi-select__selected-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.tedi-select__search-input{position:absolute;top:0;left:0;width:100%;height:100%;padding:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;background:transparent;border:none}.tedi-select__search-input:focus{outline:none}.tedi-select__search-input::placeholder{color:var(--form-input-text-placeholder)}.tedi-select__search-input--hidden{color:transparent;caret-color:var(--form-input-text-filled)}.tedi-select__search-input:not(.tedi-select__search-input--hidden){position:relative;flex:1 1 var(--_search-input-reserve);width:auto;min-width:0;height:auto}.tedi-select__options{flex:1;min-height:0;padding:0;margin:0;overflow-y:auto;outline:none}.tedi-select__options .tedi-dropdown-item{outline:none}.tedi-select__options .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled),.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--active:not(.tedi-dropdown-item--disabled){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-select__options .tedi-dropdown-item[aria-selected=true],.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-select__options .tedi-dropdown-item[aria-selected=true] .tedi-icon,.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected .tedi-icon{color:inherit}.tedi-select__options--virtual{display:flex;flex-direction:column;overflow:visible}.tedi-select__viewport{width:100%}.tedi-select__viewport .tedi-dropdown-item{box-sizing:border-box}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;padding:var(--dropdown-group-label-padding-y) var(--dropdown-group-label-padding-x) var(--layout-grid-gutters-04);font-size:var(--heading-subtitle-small-size);font-weight:var(--heading-subtitle-small-weight);line-height:var(--heading-subtitle-small-line-height);text-transform:uppercase;letter-spacing:0}.tedi-select__group-name--selectable{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);text-transform:none;letter-spacing:inherit}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left)}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);min-width:0}.tedi-select__multiselect-container--single-row{flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-tags{display:flex;flex:0 0 auto;gap:var(--form-field-inner-spacing);min-width:0;overflow:hidden}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-counter{flex-shrink:0}.tedi-select__multiselect-container--single-row.tedi-select__multiselect-container--ellipsis .tedi-select__multiselect-tags{flex:0 1 auto}.tedi-select__no-options{color:var(--general-text-tertiary);cursor:default}.tedi-select__no-options:hover{color:var(--general-text-tertiary);background:var(--dropdown-item-default-background)}.tedi-select__dropdown:has(.tedi-select__options--swatch-grid){width:fit-content}.tedi-select__options--swatch-grid{--tedi-swatch-size: 24px;--tedi-swatch-gap: var(--layout-grid-gutters-04);--tedi-swatch-columns: 11;display:grid;grid-template-columns:repeat(auto-fit,var(--tedi-swatch-size));gap:var(--tedi-swatch-gap);max-width:calc(var(--tedi-swatch-columns) * (var(--tedi-swatch-size) + var(--tedi-swatch-gap)));padding:var(--dropdown-body-padding-y) var(--dropdown-body-padding-x)}.tedi-select__options--swatch-grid .tedi-dropdown-item{display:flex;align-items:center;justify-content:center;width:var(--tedi-swatch-size);height:var(--tedi-swatch-size);min-height:auto;padding:var(--layout-grid-gutters-02);color:inherit;background:transparent;border-radius:var(--card-radius-rounded)}.tedi-select__options--swatch-grid .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled){outline-offset:0}.tedi-select__options--swatch-grid .tedi-dropdown-item[aria-selected=true],.tedi-select__options--swatch-grid .tedi-dropdown-item.tedi-dropdown-item--selected{color:inherit;background:transparent;border:var(--tedi-borders-02) solid var(--card-border-selected)}.tedi-select__options--swatch-grid .tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled){background:transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i1.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: CdkListboxModule }, { kind: "directive", type: i3.CdkListbox, selector: "[cdkListbox]", inputs: ["id", "tabindex", "cdkListboxValue", "cdkListboxMultiple", "cdkListboxDisabled", "cdkListboxUseActiveDescendant", "cdkListboxOrientation", "cdkListboxCompareWith", "cdkListboxNavigationWrapDisabled", "cdkListboxNavigatesDisabledOptions"], outputs: ["cdkListboxValueChange"], exportAs: ["cdkListbox"] }, { kind: "directive", type: i3.CdkOption, selector: "[cdkOption]", inputs: ["id", "cdkOption", "cdkOptionTypeaheadLabel", "cdkOptionDisabled", "tabindex"], exportAs: ["cdkOption"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: LabelComponent, selector: "[tedi-label]", inputs: ["size", "required", "color", "visuallyHidden"] }, { kind: "component", type: LabelRowComponent, selector: "tedi-label-row" }, { kind: "component", type: InfoTooltipComponent, selector: "tedi-info-tooltip", inputs: ["position", "openWith", "maxWidth", "color", "ariaLabel"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["id", "text", "type", "position"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: TagComponent, selector: "tedi-tag", inputs: ["loading", "closable", "type", "ellipsis"], outputs: ["closed"] }, { kind: "component", type: DropdownItemValueComponent, selector: "tedi-dropdown-item-value", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: DropdownItemValueLabelComponent, selector: "tedi-dropdown-item-value-label", inputs: ["clipContent"] }, { kind: "component", type: EllipsisComponent, selector: "tedi-ellipsis", inputs: ["lineClamp", "tooltip", "position"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], queries: [{ propertyName: "optionTemplate", first: true, predicate: SelectOptionTemplateDirective, descendants: true, isSignal: true }, { propertyName: "valueTemplate", first: true, predicate: SelectValueTemplateDirective, descendants: true, isSignal: true }, { propertyName: "tooltipTemplate", first: true, predicate: SelectTooltipTemplateDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "listboxRef", first: true, predicate: CdkListbox, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "cdkListboxRef", first: true, predicate: CdkListbox, descendants: true, isSignal: true }, { propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }, { propertyName: "virtualListboxRef", first: true, predicate: ["virtualListbox"], descendants: true, isSignal: true }, { propertyName: "connectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true, isSignal: true }, { propertyName: "triggerRef", first: true, predicate: ["trigger"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "searchInputRef", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }, { propertyName: "multiselectContainerRef", first: true, predicate: ["multiselectContainer"], descendants: true, isSignal: true }, { propertyName: "tagRefs", predicate: ["tagElement"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@if (label()) {\n  <tedi-label-row>\n    <label\n      [id]=\"labelId()\"\n      tedi-label\n      [for]=\"inputId()\"\n      [required]=\"required()\"\n      [size]=\"size()\"\n      (click)=\"onTriggerClick()\"\n    >\n      {{ label() }}\n    </label>\n    @if (tooltipTemplate()?.template; as tooltipTpl) {\n      <tedi-info-tooltip>\n        <ng-container [ngTemplateOutlet]=\"tooltipTpl\" />\n      </tedi-info-tooltip>\n    } @else if (tooltip(); as tooltipText) {\n      <tedi-info-tooltip>{{ tooltipText }}</tedi-info-tooltip>\n    }\n  </tedi-label-row>\n}\n<div\n  [id]=\"searchable() ? null : inputId()\"\n  class=\"tedi-select__trigger tedi-input\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  [class.tedi-input--small]=\"size() === 'small'\"\n  [class.tedi-input--error]=\"state() === 'error'\"\n  [class.tedi-input--valid]=\"state() === 'valid'\"\n  [class.tedi-select__trigger--searchable]=\"searchable()\"\n  [class.tedi-select__trigger--search-focused]=\"searchFocused()\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  [attr.role]=\"searchable() ? null : 'combobox'\"\n  [attr.aria-haspopup]=\"searchable() ? null : 'listbox'\"\n  [attr.aria-expanded]=\"searchable() ? null : isOpen()\"\n  [attr.aria-controls]=\"!searchable() && isOpen() ? listboxId() : null\"\n  [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n  [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n  [tabindex]=\"searchable() || disabled() ? -1 : 0\"\n  (click)=\"onTriggerClick()\"\n  (keydown.enter)=\"onTriggerEnter()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  @if (searchable()) {\n    <div class=\"tedi-select__search-wrapper\">\n      @if (showSingleSelectedValue()) {\n        <span class=\"tedi-select__selected-value\">\n          @if (valueTemplate(); as tpl) {\n            @if (selectedOptions()[0]; as option) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"getValueContext(option)\"\n              />\n            }\n          } @else {\n            {{ selectedLabels().join(\", \") }}\n          }\n        </span>\n      }\n      @if (allowMultiple() && selectedValues().length) {\n        <ng-container\n          [ngTemplateOutlet]=\"multiselectTags\"\n          [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n        />\n      } @else {\n        <input\n          #searchInput\n          [id]=\"inputId()\"\n          type=\"text\"\n          class=\"tedi-select__search-input\"\n          [class.tedi-select__search-input--hidden]=\"showSingleSelectedValue()\"\n          [placeholder]=\"showSingleSelectedValue() ? '' : placeholder()\"\n          [value]=\"searchTerm()\"\n          [disabled]=\"disabled()\"\n          (input)=\"onSearchInput($event)\"\n          (focus)=\"onSearchFocus()\"\n          (blur)=\"onSearchBlur()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          autocomplete=\"off\"\n          role=\"combobox\"\n          aria-autocomplete=\"list\"\n          [attr.aria-expanded]=\"isOpen()\"\n          [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n          [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n          [attr.aria-label]=\"resolvedAriaLabel()\"\n        />\n      }\n    </div>\n  } @else {\n    <span class=\"tedi-select__label\">\n      @if (selectedValues().length) {\n        @if (allowMultiple()) {\n          <ng-container\n            [ngTemplateOutlet]=\"multiselectTags\"\n            [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n          />\n        } @else if (ellipsis(); as ellipsisPos) {\n          <tedi-ellipsis [position]=\"ellipsisPos\" [lineClamp]=\"1\">\n            <ng-container [ngTemplateOutlet]=\"singleValue\" />\n          </tedi-ellipsis>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"singleValue\" />\n        }\n      } @else {\n        <span class=\"tedi-select__label--placeholder\">\n          {{ placeholder() }}\n        </span>\n      }\n    </span>\n  }\n\n  @if (clearable() && selectedValues().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'clear' | tediTranslate\"\n      (click)=\"clear($event)\"\n      (keydown.enter)=\"clear($event)\"\n      (keydown.space)=\"clear($event)\"\n      [attr.aria-describedby]=\"label() ? labelId() : null\"\n    ></button>\n  }\n\n  <span\n    class=\"tedi-select__arrow\"\n    aria-hidden=\"true\"\n    (click)=\"onArrowClick($event)\"\n  >\n    <tedi-icon name=\"arrow_drop_down\" />\n  </span>\n</div>\n@if (name(); as fieldName) {\n  @for (formValue of formValues(); track $index) {\n    <input\n      type=\"hidden\"\n      [name]=\"fieldName\"\n      [value]=\"formValue\"\n      [disabled]=\"disabled()\"\n    />\n  }\n}\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template #singleValue>\n  @if (valueTemplate(); as tpl) {\n    @if (selectedOptions()[0]; as option) {\n      <ng-container\n        [ngTemplateOutlet]=\"tpl.template\"\n        [ngTemplateOutletContext]=\"getValueContext(option)\"\n      />\n    }\n  } @else {\n    {{ selectedLabels().join(\", \") }}\n  }\n</ng-template>\n\n<ng-template #multiselectTags>\n  <div\n    class=\"tedi-select__multiselect-container\"\n    [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n    [class.tedi-select__multiselect-container--ellipsis]=\"tagEllipsis()\"\n    #multiselectContainer\n  >\n    @if (multiRow()) {\n      @for (value of selectedValues(); track value) {\n        <tedi-tag\n          [ellipsis]=\"tagEllipsis()\"\n          [closable]=\"isTagRemovable()\"\n          (closed)=\"deselect($event, value)\"\n        >\n          {{ getLabel(value) }}\n        </tedi-tag>\n      }\n    } @else {\n      <div class=\"tedi-select__multiselect-tags\">\n        @for (value of selectedValues(); track value; let i = $index) {\n          @if (visibleTagsCount() === null || i < visibleTagsCount()!) {\n            <tedi-tag\n              #tagElement\n              [ellipsis]=\"tagEllipsis()\"\n              [closable]=\"isTagRemovable()\"\n              (closed)=\"deselect($event, value)\"\n            >\n              {{ getLabel(value) }}\n            </tedi-tag>\n          }\n        }\n      </div>\n      @if (hiddenTagsCount() > 0) {\n        <tedi-tag class=\"tedi-select__multiselect-counter\"\n          >+{{ hiddenTagsCount() }}</tedi-tag\n        >\n      }\n    }\n    @if (searchable()) {\n      <input\n        #searchInput\n        [id]=\"inputId()\"\n        type=\"text\"\n        class=\"tedi-select__search-input\"\n        [value]=\"searchTerm()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onSearchInput($event)\"\n        (focus)=\"onSearchFocus()\"\n        (blur)=\"onSearchBlur()\"\n        (keydown)=\"onSearchKeydown($event)\"\n        autocomplete=\"off\"\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n        [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n        [attr.aria-label]=\"resolvedAriaLabel()\"\n      />\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"dropdownPositions()\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n  (attach)=\"onOverlayAttached()\"\n  (detach)=\"toggleIsOpen(true)\"\n>\n  <div\n    class=\"tedi-select__dropdown\"\n    [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n    [style.max-height]=\"dropdownMaxHeight() ? dropdownMaxHeight() + 'px' : null\"\n  >\n    @if (virtualize()) {\n      <div\n        #virtualListbox\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options tedi-select__options--virtual\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        role=\"listbox\"\n        [attr.aria-multiselectable]=\"allowMultiple() ? true : null\"\n        [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n        [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n        [attr.aria-activedescendant]=\"activeDescendantId()\"\n        [tabindex]=\"searchable() ? -1 : 0\"\n        (keydown)=\"onVirtualListboxKeydown($event)\"\n      >\n        @if (filteredOptions().length) {\n          @if (showSelectAllRow()) {\n            <div\n              class=\"tedi-dropdown-item\"\n              [id]=\"listboxId() + '-select-all'\"\n              role=\"option\"\n              [attr.aria-selected]=\"allOptionsSelected()\"\n              [class.tedi-dropdown-item--active]=\"activeIndex() === 0\"\n              (click)=\"onVirtualSelectAllClick()\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </div>\n          }\n          <cdk-virtual-scroll-viewport\n            class=\"tedi-select__viewport\"\n            [itemSize]=\"virtualRowHeight()\"\n            [style.height.px]=\"virtualViewportHeight()\"\n            [minBufferPx]=\"virtualRowHeight() * 6\"\n            [maxBufferPx]=\"virtualRowHeight() * 12\"\n          >\n            <div\n              *cdkVirtualFor=\"\n                let option of filteredOptions();\n                let i = index;\n                trackBy: trackByOptionValue\n              \"\n              class=\"tedi-dropdown-item\"\n              [id]=\"virtualOptionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"isOptionSelected(option.value)\"\n              [attr.aria-disabled]=\"option.disabled ? true : null\"\n              [class.tedi-dropdown-item--selected]=\"\n                !allowMultiple() && isOptionSelected(option.value)\n              \"\n              [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n              [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n              [class.tedi-dropdown-item--active]=\"\n                activeIndex() - (showSelectAllRow() ? 1 : 0) === i\n              \"\n              (click)=\"onVirtualOptionClick(option)\"\n            >\n              @if (optionTemplate(); as tpl) {\n                <ng-container\n                  [ngTemplateOutlet]=\"tpl.template\"\n                  [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                />\n              } @else {\n                <tedi-dropdown-item-value\n                  [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              }\n            </div>\n          </cdk-virtual-scroll-viewport>\n        } @else {\n          <div\n            class=\"tedi-dropdown-item tedi-select__no-options\"\n            role=\"option\"\n            aria-disabled=\"true\"\n          >\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </div>\n        }\n      </div>\n    } @else {\n      <ul\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        [class.tedi-select__options--swatch-grid]=\"dropdownType() === 'grid'\"\n        cdkListbox\n        [cdkListboxMultiple]=\"allowMultiple()\"\n        [cdkListboxValue]=\"visibleSelectedValues()\"\n        [cdkListboxNavigatesDisabledOptions]=\"false\"\n        [cdkListboxUseActiveDescendant]=\"true\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        (keydown.tab)=\"toggleIsOpen(true)\"\n        (keydown.escape)=\"toggleIsOpen(true)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (filteredOptions().length) {\n          @if (allowMultiple() && showSelectAll()) {\n            <li\n              class=\"tedi-dropdown-item\"\n              [cdkOption]=\"SpecialOptionControls.SELECT_ALL\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </li>\n          }\n\n          @for (group of optionGroups(); track group.label) {\n            @if (group.label.length > 0) {\n              @if (allowMultiple() && selectableGroups()) {\n                <li\n                  class=\"tedi-dropdown-item tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"SpecialOptionControls.SELECT_GROUP + group.label\"\n                >\n                  <tedi-dropdown-item-value\n                    type=\"checkbox\"\n                    [selected]=\"isGroupSelected(group.label)\"\n                    [indeterminate]=\"isGroupIndeterminate(group.label)\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      group.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                </li>\n              } @else {\n                <li class=\"tedi-select__group-name\" role=\"presentation\">\n                  <span tedi-text color=\"tertiary\">\n                    {{ group.label }}\n                  </span>\n                </li>\n              }\n            }\n\n            @for (option of group.options; track option.value; let i = $index) {\n              <li\n                class=\"tedi-dropdown-item\"\n                [class.tedi-dropdown-item--selected]=\"\n                  !allowMultiple() && isOptionSelected(option.value)\n                \"\n                [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n                [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n                [cdkOption]=\"option.value\"\n                [cdkOptionDisabled]=\"option.disabled\"\n              >\n                @if (optionTemplate(); as tpl) {\n                  <ng-container\n                    [ngTemplateOutlet]=\"tpl.template\"\n                    [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                  />\n                } @else {\n                  <tedi-dropdown-item-value\n                    [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                    [selected]=\"isOptionSelected(option.value)\"\n                    [disabled]=\"!!option.disabled\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      option.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li class=\"tedi-dropdown-item tedi-select__no-options\">\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </li>\n        }\n      </ul>\n    }\n  </div>\n</ng-template>\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}.tedi-input{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);--_placeholder-color: var(--form-input-text-placeholder);--_search-input-reserve: 5rem;margin-bottom:0;font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled)}.tedi-input:hover{--_field-border-color: var(--form-input-border-hover)}.tedi-input:focus,.tedi-input:active,.tedi-input.tedi-select__trigger--search-focused{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input--disabled{--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);color:var(--form-input-text-disabled);pointer-events:none}.tedi-input--error:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(.tedi-input--disabled):focus,.tedi-input--error:not(.tedi-input--disabled):active,.tedi-input--error:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-input--valid:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(.tedi-input--disabled):focus,.tedi-input--valid:not(.tedi-input--disabled):active,.tedi-input--valid:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-select{display:block;width:100%}.tedi-select .tedi-feedback-text{margin-top:var(--form-field-outer-spacing)}.tedi-select__trigger{display:flex;justify-content:space-between;width:100%;cursor:pointer}.tedi-select__label{flex-grow:1;overflow:hidden;text-align:left;cursor:default}.tedi-select__label--placeholder{color:var(--_placeholder-color);pointer-events:none}.tedi-select__clear{flex-grow:0;padding:0;margin:0;color:var(--button-close-text-default);cursor:pointer;background:none;border:none}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{display:inline-flex;flex-grow:0;flex-shrink:0;align-items:center;padding-left:var(--form-field-inner-spacing);margin-left:var(--form-field-inner-spacing);color:inherit;cursor:default}.tedi-select__dropdown{display:flex;flex-direction:column;max-height:100%;margin-top:var(--form-field-outer-spacing);margin-bottom:var(--form-field-outer-spacing);background:var(--card-background-primary);border-radius:var(--card-radius-rounded);box-shadow:0 1px 5px 0 var(--tedi-alpha-20)}.tedi-select__trigger--searchable{cursor:text}.tedi-select__search-wrapper{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--body-regular-line-height);overflow:hidden}.tedi-select__selected-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.tedi-select__search-input{position:absolute;top:0;left:0;width:100%;height:100%;padding:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;background:transparent;border:none}.tedi-select__search-input:focus{outline:none}.tedi-select__search-input::placeholder{color:var(--form-input-text-placeholder)}.tedi-select__search-input--hidden{color:transparent;caret-color:var(--form-input-text-filled)}.tedi-select__search-input:not(.tedi-select__search-input--hidden){position:relative;flex:1 1 var(--_search-input-reserve);width:auto;min-width:0;height:auto}.tedi-select__options{flex:1;min-height:0;padding:0;margin:0;overflow-y:auto;outline:none}.tedi-select__options .tedi-dropdown-item{outline:none}.tedi-select__options .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled),.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--active:not(.tedi-dropdown-item--disabled){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-select__options .tedi-dropdown-item[aria-selected=true],.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-select__options .tedi-dropdown-item[aria-selected=true] .tedi-icon,.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected .tedi-icon{color:inherit}.tedi-select__options--virtual{display:flex;flex-direction:column;overflow:visible}.tedi-select__viewport{width:100%}.tedi-select__viewport .tedi-dropdown-item{box-sizing:border-box}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;padding:var(--dropdown-group-label-padding-y) var(--dropdown-group-label-padding-x) var(--layout-grid-gutters-04);font-size:var(--heading-subtitle-small-size);font-weight:var(--heading-subtitle-small-weight);line-height:var(--heading-subtitle-small-line-height);text-transform:uppercase;letter-spacing:0}.tedi-select__group-name--selectable{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);text-transform:none;letter-spacing:inherit}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left)}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);min-width:0}.tedi-select__multiselect-container--single-row{flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-tags{display:flex;flex:0 0 auto;gap:var(--form-field-inner-spacing);min-width:0;overflow:hidden}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-counter{flex-shrink:0}.tedi-select__multiselect-container--single-row.tedi-select__multiselect-container--ellipsis .tedi-select__multiselect-tags{flex:0 1 auto}.tedi-select__no-options{color:var(--general-text-tertiary);cursor:default}.tedi-select__no-options:hover{color:var(--general-text-tertiary);background:var(--dropdown-item-default-background)}.tedi-select__dropdown:has(.tedi-select__options--swatch-grid){width:fit-content}.tedi-select__options--swatch-grid{--tedi-swatch-size: 24px;--tedi-swatch-gap: var(--layout-grid-gutters-04);--tedi-swatch-columns: 11;display:grid;grid-template-columns:repeat(auto-fit,var(--tedi-swatch-size));gap:var(--tedi-swatch-gap);max-width:calc(var(--tedi-swatch-columns) * (var(--tedi-swatch-size) + var(--tedi-swatch-gap)));padding:var(--dropdown-body-padding-y) var(--dropdown-body-padding-x)}.tedi-select__options--swatch-grid .tedi-dropdown-item{display:flex;align-items:center;justify-content:center;width:var(--tedi-swatch-size);height:var(--tedi-swatch-size);min-height:auto;padding:var(--layout-grid-gutters-02);color:inherit;background:transparent;border-radius:var(--card-radius-rounded)}.tedi-select__options--swatch-grid .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled){outline-offset:0}.tedi-select__options--swatch-grid .tedi-dropdown-item[aria-selected=true],.tedi-select__options--swatch-grid .tedi-dropdown-item.tedi-dropdown-item--selected{color:inherit;background:transparent;border:var(--tedi-borders-02) solid var(--card-border-selected)}.tedi-select__options--swatch-grid .tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled){background:transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i1.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: CdkListboxModule }, { kind: "directive", type: i3.CdkListbox, selector: "[cdkListbox]", inputs: ["id", "tabindex", "cdkListboxValue", "cdkListboxMultiple", "cdkListboxDisabled", "cdkListboxUseActiveDescendant", "cdkListboxOrientation", "cdkListboxCompareWith", "cdkListboxNavigationWrapDisabled", "cdkListboxNavigatesDisabledOptions"], outputs: ["cdkListboxValueChange"], exportAs: ["cdkListbox"] }, { kind: "directive", type: i3.CdkOption, selector: "[cdkOption]", inputs: ["id", "cdkOption", "cdkOptionTypeaheadLabel", "cdkOptionDisabled", "tabindex"], exportAs: ["cdkOption"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize", "icon", "ariaLabel", "showTitle"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: LabelComponent, selector: "[tedi-label]", inputs: ["size", "required", "color", "visuallyHidden"] }, { kind: "component", type: LabelRowComponent, selector: "tedi-label-row" }, { kind: "component", type: InfoTooltipComponent, selector: "tedi-info-tooltip", inputs: ["position", "openWith", "maxWidth", "color", "ariaLabel"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["id", "text", "type", "position"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: TagComponent, selector: "tedi-tag", inputs: ["loading", "closable", "type", "ellipsis"], outputs: ["closed"] }, { kind: "component", type: DropdownItemValueComponent, selector: "tedi-dropdown-item-value", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: DropdownItemValueLabelComponent, selector: "tedi-dropdown-item-value-label", inputs: ["clipContent"] }, { kind: "component", type: EllipsisComponent, selector: "tedi-ellipsis", inputs: ["lineClamp", "tooltip", "position"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
@@ -13906,8 +13908,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                             useExisting: forwardRef(() => SelectComponent),
                             multi: true,
                         },
-                    ], template: "@if (label()) {\n  <tedi-label-row>\n    <label\n      [id]=\"labelId()\"\n      tedi-label\n      [for]=\"inputId()\"\n      [required]=\"required()\"\n      [size]=\"size()\"\n      (click)=\"onTriggerClick()\"\n    >\n      {{ label() }}\n    </label>\n    @if (tooltipTemplate()?.template; as tooltipTpl) {\n      <tedi-info-tooltip>\n        <ng-container [ngTemplateOutlet]=\"tooltipTpl\" />\n      </tedi-info-tooltip>\n    } @else if (tooltip(); as tooltipText) {\n      <tedi-info-tooltip>{{ tooltipText }}</tedi-info-tooltip>\n    }\n  </tedi-label-row>\n}\n<div\n  [id]=\"searchable() ? null : inputId()\"\n  class=\"tedi-select__trigger tedi-input\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  [class.tedi-input--small]=\"size() === 'small'\"\n  [class.tedi-input--error]=\"state() === 'error'\"\n  [class.tedi-input--valid]=\"state() === 'valid'\"\n  [class.tedi-select__trigger--searchable]=\"searchable()\"\n  [class.tedi-select__trigger--search-focused]=\"searchFocused()\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  [attr.role]=\"searchable() ? null : 'combobox'\"\n  [attr.aria-haspopup]=\"searchable() ? null : 'listbox'\"\n  [attr.aria-expanded]=\"searchable() ? null : isOpen()\"\n  [attr.aria-controls]=\"!searchable() && isOpen() ? listboxId() : null\"\n  [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n  [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n  [tabindex]=\"searchable() || disabled() ? -1 : 0\"\n  (click)=\"onTriggerClick()\"\n  (keydown.enter)=\"onTriggerEnter()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  @if (searchable()) {\n    <div class=\"tedi-select__search-wrapper\">\n      @if (showSingleSelectedValue()) {\n        <span class=\"tedi-select__selected-value\">\n          @if (valueTemplate(); as tpl) {\n            @if (selectedOptions()[0]; as option) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"getValueContext(option)\"\n              />\n            }\n          } @else {\n            {{ selectedLabels().join(\", \") }}\n          }\n        </span>\n      }\n      @if (allowMultiple() && selectedValues().length) {\n        <ng-container\n          [ngTemplateOutlet]=\"multiselectTags\"\n          [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n        />\n      } @else {\n        <input\n          #searchInput\n          [id]=\"inputId()\"\n          type=\"text\"\n          class=\"tedi-select__search-input\"\n          [class.tedi-select__search-input--hidden]=\"showSingleSelectedValue()\"\n          [placeholder]=\"showSingleSelectedValue() ? '' : placeholder()\"\n          [value]=\"searchTerm()\"\n          [disabled]=\"disabled()\"\n          (input)=\"onSearchInput($event)\"\n          (focus)=\"onSearchFocus()\"\n          (blur)=\"onSearchBlur()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          autocomplete=\"off\"\n          role=\"combobox\"\n          aria-autocomplete=\"list\"\n          [attr.aria-expanded]=\"isOpen()\"\n          [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n          [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n          [attr.aria-label]=\"resolvedAriaLabel()\"\n        />\n      }\n    </div>\n  } @else {\n    <span class=\"tedi-select__label\">\n      @if (selectedValues().length) {\n        @if (allowMultiple()) {\n          <ng-container\n            [ngTemplateOutlet]=\"multiselectTags\"\n            [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n          />\n        } @else if (ellipsis(); as ellipsisPos) {\n          <tedi-ellipsis [position]=\"ellipsisPos\" [lineClamp]=\"1\">\n            <ng-container [ngTemplateOutlet]=\"singleValue\" />\n          </tedi-ellipsis>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"singleValue\" />\n        }\n      } @else {\n        <span class=\"tedi-select__label--placeholder\">\n          {{ placeholder() }}\n        </span>\n      }\n    </span>\n  }\n\n  @if (clearable() && selectedValues().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'clear' | tediTranslate\"\n      (click)=\"clear($event)\"\n      (keydown.enter)=\"clear($event)\"\n      (keydown.space)=\"clear($event)\"\n      [attr.aria-describedby]=\"label() ? labelId() : null\"\n    ></button>\n  }\n\n  <span\n    class=\"tedi-select__arrow\"\n    aria-hidden=\"true\"\n    (click)=\"onArrowClick($event)\"\n  >\n    <tedi-icon name=\"arrow_drop_down\" />\n  </span>\n</div>\n@if (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 #singleValue>\n  @if (valueTemplate(); as tpl) {\n    @if (selectedOptions()[0]; as option) {\n      <ng-container\n        [ngTemplateOutlet]=\"tpl.template\"\n        [ngTemplateOutletContext]=\"getValueContext(option)\"\n      />\n    }\n  } @else {\n    {{ selectedLabels().join(\", \") }}\n  }\n</ng-template>\n\n<ng-template #multiselectTags>\n  <div\n    class=\"tedi-select__multiselect-container\"\n    [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n    [class.tedi-select__multiselect-container--ellipsis]=\"tagEllipsis()\"\n    #multiselectContainer\n  >\n    @if (multiRow()) {\n      @for (value of selectedValues(); track value) {\n        <tedi-tag\n          [ellipsis]=\"tagEllipsis()\"\n          [closable]=\"isTagRemovable()\"\n          (closed)=\"deselect($event, value)\"\n        >\n          {{ getLabel(value) }}\n        </tedi-tag>\n      }\n    } @else {\n      <div class=\"tedi-select__multiselect-tags\">\n        @for (value of selectedValues(); track value; let i = $index) {\n          @if (visibleTagsCount() === null || i < visibleTagsCount()!) {\n            <tedi-tag\n              #tagElement\n              [ellipsis]=\"tagEllipsis()\"\n              [closable]=\"isTagRemovable()\"\n              (closed)=\"deselect($event, value)\"\n            >\n              {{ getLabel(value) }}\n            </tedi-tag>\n          }\n        }\n      </div>\n      @if (hiddenTagsCount() > 0) {\n        <tedi-tag class=\"tedi-select__multiselect-counter\"\n          >+{{ hiddenTagsCount() }}</tedi-tag\n        >\n      }\n    }\n    @if (searchable()) {\n      <input\n        #searchInput\n        [id]=\"inputId()\"\n        type=\"text\"\n        class=\"tedi-select__search-input\"\n        [value]=\"searchTerm()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onSearchInput($event)\"\n        (focus)=\"onSearchFocus()\"\n        (blur)=\"onSearchBlur()\"\n        (keydown)=\"onSearchKeydown($event)\"\n        autocomplete=\"off\"\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n        [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n        [attr.aria-label]=\"resolvedAriaLabel()\"\n      />\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"dropdownPositions()\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n  (attach)=\"onOverlayAttached()\"\n  (detach)=\"toggleIsOpen(true)\"\n>\n  <div\n    class=\"tedi-select__dropdown\"\n    [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n    [style.max-height]=\"dropdownMaxHeight() ? dropdownMaxHeight() + 'px' : null\"\n  >\n    @if (virtualize()) {\n      <div\n        #virtualListbox\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options tedi-select__options--virtual\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        role=\"listbox\"\n        [attr.aria-multiselectable]=\"allowMultiple() ? true : null\"\n        [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n        [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n        [attr.aria-activedescendant]=\"activeDescendantId()\"\n        [tabindex]=\"searchable() ? -1 : 0\"\n        (keydown)=\"onVirtualListboxKeydown($event)\"\n      >\n        @if (filteredOptions().length) {\n          @if (showSelectAllRow()) {\n            <div\n              class=\"tedi-dropdown-item\"\n              [id]=\"listboxId() + '-select-all'\"\n              role=\"option\"\n              [attr.aria-selected]=\"allOptionsSelected()\"\n              [class.tedi-dropdown-item--active]=\"activeIndex() === 0\"\n              (click)=\"onVirtualSelectAllClick()\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </div>\n          }\n          <cdk-virtual-scroll-viewport\n            class=\"tedi-select__viewport\"\n            [itemSize]=\"virtualRowHeight()\"\n            [style.height.px]=\"virtualViewportHeight()\"\n            [minBufferPx]=\"virtualRowHeight() * 6\"\n            [maxBufferPx]=\"virtualRowHeight() * 12\"\n          >\n            <div\n              *cdkVirtualFor=\"\n                let option of filteredOptions();\n                let i = index;\n                trackBy: trackByOptionValue\n              \"\n              class=\"tedi-dropdown-item\"\n              [id]=\"virtualOptionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"isOptionSelected(option.value)\"\n              [attr.aria-disabled]=\"option.disabled ? true : null\"\n              [class.tedi-dropdown-item--selected]=\"\n                !allowMultiple() && isOptionSelected(option.value)\n              \"\n              [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n              [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n              [class.tedi-dropdown-item--active]=\"\n                activeIndex() - (showSelectAllRow() ? 1 : 0) === i\n              \"\n              (click)=\"onVirtualOptionClick(option)\"\n            >\n              @if (optionTemplate(); as tpl) {\n                <ng-container\n                  [ngTemplateOutlet]=\"tpl.template\"\n                  [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                />\n              } @else {\n                <tedi-dropdown-item-value\n                  [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              }\n            </div>\n          </cdk-virtual-scroll-viewport>\n        } @else {\n          <div\n            class=\"tedi-dropdown-item tedi-select__no-options\"\n            role=\"option\"\n            aria-disabled=\"true\"\n          >\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </div>\n        }\n      </div>\n    } @else {\n      <ul\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        [class.tedi-select__options--swatch-grid]=\"dropdownType() === 'grid'\"\n        cdkListbox\n        [cdkListboxMultiple]=\"allowMultiple()\"\n        [cdkListboxValue]=\"visibleSelectedValues()\"\n        [cdkListboxNavigatesDisabledOptions]=\"false\"\n        [cdkListboxUseActiveDescendant]=\"true\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        (keydown.tab)=\"toggleIsOpen(true)\"\n        (keydown.escape)=\"toggleIsOpen(true)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (filteredOptions().length) {\n          @if (allowMultiple() && showSelectAll()) {\n            <li\n              class=\"tedi-dropdown-item\"\n              [cdkOption]=\"SpecialOptionControls.SELECT_ALL\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </li>\n          }\n\n          @for (group of optionGroups(); track group.label) {\n            @if (group.label.length > 0) {\n              @if (allowMultiple() && selectableGroups()) {\n                <li\n                  class=\"tedi-dropdown-item tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"SpecialOptionControls.SELECT_GROUP + group.label\"\n                >\n                  <tedi-dropdown-item-value\n                    type=\"checkbox\"\n                    [selected]=\"isGroupSelected(group.label)\"\n                    [indeterminate]=\"isGroupIndeterminate(group.label)\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      group.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                </li>\n              } @else {\n                <li class=\"tedi-select__group-name\" role=\"presentation\">\n                  <span tedi-text color=\"tertiary\">\n                    {{ group.label }}\n                  </span>\n                </li>\n              }\n            }\n\n            @for (option of group.options; track option.value; let i = $index) {\n              <li\n                class=\"tedi-dropdown-item\"\n                [class.tedi-dropdown-item--selected]=\"\n                  !allowMultiple() && isOptionSelected(option.value)\n                \"\n                [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n                [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n                [cdkOption]=\"option.value\"\n                [cdkOptionDisabled]=\"option.disabled\"\n              >\n                @if (optionTemplate(); as tpl) {\n                  <ng-container\n                    [ngTemplateOutlet]=\"tpl.template\"\n                    [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                  />\n                } @else {\n                  <tedi-dropdown-item-value\n                    [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                    [selected]=\"isOptionSelected(option.value)\"\n                    [disabled]=\"!!option.disabled\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      option.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li class=\"tedi-dropdown-item tedi-select__no-options\">\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </li>\n        }\n      </ul>\n    }\n  </div>\n</ng-template>\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}.tedi-input{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);--_placeholder-color: var(--form-input-text-placeholder);--_search-input-reserve: 5rem;margin-bottom:0;font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled)}.tedi-input:hover{--_field-border-color: var(--form-input-border-hover)}.tedi-input:focus,.tedi-input:active,.tedi-input.tedi-select__trigger--search-focused{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input--disabled{--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);color:var(--form-input-text-disabled);pointer-events:none}.tedi-input--error:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(.tedi-input--disabled):focus,.tedi-input--error:not(.tedi-input--disabled):active,.tedi-input--error:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-input--valid:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(.tedi-input--disabled):focus,.tedi-input--valid:not(.tedi-input--disabled):active,.tedi-input--valid:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-select{display:block;width:100%}.tedi-select .tedi-feedback-text{margin-top:var(--form-field-outer-spacing)}.tedi-select__trigger{display:flex;justify-content:space-between;width:100%;cursor:pointer}.tedi-select__label{flex-grow:1;overflow:hidden;text-align:left;cursor:default}.tedi-select__label--placeholder{color:var(--_placeholder-color);pointer-events:none}.tedi-select__clear{flex-grow:0;padding:0;margin:0;color:var(--button-close-text-default);cursor:pointer;background:none;border:none}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{display:inline-flex;flex-grow:0;flex-shrink:0;align-items:center;padding-left:var(--form-field-inner-spacing);margin-left:var(--form-field-inner-spacing);color:inherit;cursor:default}.tedi-select__dropdown{display:flex;flex-direction:column;max-height:100%;margin-top:var(--form-field-outer-spacing);margin-bottom:var(--form-field-outer-spacing);background:var(--card-background-primary);border-radius:var(--card-radius-rounded);box-shadow:0 1px 5px 0 var(--tedi-alpha-20)}.tedi-select__trigger--searchable{cursor:text}.tedi-select__search-wrapper{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--body-regular-line-height);overflow:hidden}.tedi-select__selected-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.tedi-select__search-input{position:absolute;top:0;left:0;width:100%;height:100%;padding:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;background:transparent;border:none}.tedi-select__search-input:focus{outline:none}.tedi-select__search-input::placeholder{color:var(--form-input-text-placeholder)}.tedi-select__search-input--hidden{color:transparent;caret-color:var(--form-input-text-filled)}.tedi-select__search-input:not(.tedi-select__search-input--hidden){position:relative;flex:1 1 var(--_search-input-reserve);width:auto;min-width:0;height:auto}.tedi-select__options{flex:1;min-height:0;padding:0;margin:0;overflow-y:auto;outline:none}.tedi-select__options .tedi-dropdown-item{outline:none}.tedi-select__options .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled),.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--active:not(.tedi-dropdown-item--disabled){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-select__options .tedi-dropdown-item[aria-selected=true],.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-select__options .tedi-dropdown-item[aria-selected=true] .tedi-icon,.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected .tedi-icon{color:inherit}.tedi-select__options--virtual{display:flex;flex-direction:column;overflow:visible}.tedi-select__viewport{width:100%}.tedi-select__viewport .tedi-dropdown-item{box-sizing:border-box}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;padding:var(--dropdown-group-label-padding-y) var(--dropdown-group-label-padding-x) var(--layout-grid-gutters-04);font-size:var(--heading-subtitle-small-size);font-weight:var(--heading-subtitle-small-weight);line-height:var(--heading-subtitle-small-line-height);text-transform:uppercase;letter-spacing:0}.tedi-select__group-name--selectable{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);text-transform:none;letter-spacing:inherit}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left)}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);min-width:0}.tedi-select__multiselect-container--single-row{flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-tags{display:flex;flex:0 0 auto;gap:var(--form-field-inner-spacing);min-width:0;overflow:hidden}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-counter{flex-shrink:0}.tedi-select__multiselect-container--single-row.tedi-select__multiselect-container--ellipsis .tedi-select__multiselect-tags{flex:0 1 auto}.tedi-select__no-options{color:var(--general-text-tertiary);cursor:default}.tedi-select__no-options:hover{color:var(--general-text-tertiary);background:var(--dropdown-item-default-background)}.tedi-select__dropdown:has(.tedi-select__options--swatch-grid){width:fit-content}.tedi-select__options--swatch-grid{--tedi-swatch-size: 24px;--tedi-swatch-gap: var(--layout-grid-gutters-04);--tedi-swatch-columns: 11;display:grid;grid-template-columns:repeat(auto-fit,var(--tedi-swatch-size));gap:var(--tedi-swatch-gap);max-width:calc(var(--tedi-swatch-columns) * (var(--tedi-swatch-size) + var(--tedi-swatch-gap)));padding:var(--dropdown-body-padding-y) var(--dropdown-body-padding-x)}.tedi-select__options--swatch-grid .tedi-dropdown-item{display:flex;align-items:center;justify-content:center;width:var(--tedi-swatch-size);height:var(--tedi-swatch-size);min-height:auto;padding:var(--layout-grid-gutters-02);color:inherit;background:transparent;border-radius:var(--card-radius-rounded)}.tedi-select__options--swatch-grid .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled){outline-offset:0}.tedi-select__options--swatch-grid .tedi-dropdown-item[aria-selected=true],.tedi-select__options--swatch-grid .tedi-dropdown-item.tedi-dropdown-item--selected{color:inherit;background:transparent;border:var(--tedi-borders-02) solid var(--card-border-selected)}.tedi-select__options--swatch-grid .tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled){background:transparent}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], dropdownWidthRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownWidthRef", required: false }] }], dropdownAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownAlign", required: false }] }], feedbackText: [{ type: i0.Input, args: [{ isSignal: true, alias: "feedbackText", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], bindLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindLabel", required: false }] }], bindValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindValue", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], allowMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowMultiple", required: false }] }], groupBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupBy", required: false }] }], showSelectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSelectAll", required: false }] }], selectableGroups: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectableGroups", required: false }] }], isTagRemovable: [{ type: i0.Input, args: [{ isSignal: true, alias: "isTagRemovable", required: false }] }], multiRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiRow", required: false }] }], tagEllipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "tagEllipsis", required: false }] }], ellipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "ellipsis", required: false }] }], compareWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareWith", required: false }] }], disabledKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledKey", required: false }] }], noOptionsMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "noOptionsMessage", required: false }] }], maxDropdownHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDropdownHeight", required: false }] }], hideOnScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnScroll", required: false }] }], dropdownType: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownType", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], virtualItemSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualItemSize", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], searchFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchFn", required: false }] }], clearSearchOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearSearchOnSelect", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], searchChange: [{ type: i0.Output, args: ["searchChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], cleared: [{ type: i0.Output, args: ["cleared"] }], listboxRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkListbox), { ...{ read: ElementRef }, isSignal: true }] }], cdkListboxRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkListbox), { isSignal: true }] }], viewport: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkVirtualScrollViewport), { isSignal: true }] }], virtualListboxRef: [{ type: i0.ViewChild, args: ["virtualListbox", { isSignal: true }] }], connectedOverlay: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkConnectedOverlay), { isSignal: true }] }], triggerRef: [{ type: i0.ViewChild, args: ["trigger", { ...{ read: ElementRef }, isSignal: true }] }], searchInputRef: [{ type: i0.ViewChild, args: ["searchInput", { isSignal: true }] }], multiselectContainerRef: [{ type: i0.ViewChild, args: ["multiselectContainer", { isSignal: true }] }], tagRefs: [{ type: i0.ViewChildren, args: ["tagElement", { ...{ read: ElementRef }, isSignal: true }] }], optionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SelectOptionTemplateDirective), { isSignal: true }] }], valueTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SelectValueTemplateDirective), { isSignal: true }] }], tooltipTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SelectTooltipTemplateDirective), { isSignal: true }] }], onWindowResize: [{
+                    ], template: "@if (label()) {\n  <tedi-label-row>\n    <label\n      [id]=\"labelId()\"\n      tedi-label\n      [for]=\"inputId()\"\n      [required]=\"required()\"\n      [size]=\"size()\"\n      (click)=\"onTriggerClick()\"\n    >\n      {{ label() }}\n    </label>\n    @if (tooltipTemplate()?.template; as tooltipTpl) {\n      <tedi-info-tooltip>\n        <ng-container [ngTemplateOutlet]=\"tooltipTpl\" />\n      </tedi-info-tooltip>\n    } @else if (tooltip(); as tooltipText) {\n      <tedi-info-tooltip>{{ tooltipText }}</tedi-info-tooltip>\n    }\n  </tedi-label-row>\n}\n<div\n  [id]=\"searchable() ? null : inputId()\"\n  class=\"tedi-select__trigger tedi-input\"\n  [class.tedi-input--disabled]=\"disabled()\"\n  [class.tedi-input--small]=\"size() === 'small'\"\n  [class.tedi-input--error]=\"state() === 'error'\"\n  [class.tedi-input--valid]=\"state() === 'valid'\"\n  [class.tedi-select__trigger--searchable]=\"searchable()\"\n  [class.tedi-select__trigger--search-focused]=\"searchFocused()\"\n  cdkOverlayOrigin\n  #trigger=\"cdkOverlayOrigin\"\n  [attr.role]=\"searchable() ? null : 'combobox'\"\n  [attr.aria-haspopup]=\"searchable() ? null : 'listbox'\"\n  [attr.aria-expanded]=\"searchable() ? null : isOpen()\"\n  [attr.aria-controls]=\"!searchable() && isOpen() ? listboxId() : null\"\n  [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n  [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n  [tabindex]=\"searchable() || disabled() ? -1 : 0\"\n  (click)=\"onTriggerClick()\"\n  (keydown.enter)=\"onTriggerEnter()\"\n  (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n  (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n  (blur)=\"onTouched()\"\n>\n  @if (searchable()) {\n    <div class=\"tedi-select__search-wrapper\">\n      @if (showSingleSelectedValue()) {\n        <span class=\"tedi-select__selected-value\">\n          @if (valueTemplate(); as tpl) {\n            @if (selectedOptions()[0]; as option) {\n              <ng-container\n                [ngTemplateOutlet]=\"tpl.template\"\n                [ngTemplateOutletContext]=\"getValueContext(option)\"\n              />\n            }\n          } @else {\n            {{ selectedLabels().join(\", \") }}\n          }\n        </span>\n      }\n      @if (allowMultiple() && selectedValues().length) {\n        <ng-container\n          [ngTemplateOutlet]=\"multiselectTags\"\n          [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n        />\n      } @else {\n        <input\n          #searchInput\n          [id]=\"inputId()\"\n          type=\"text\"\n          class=\"tedi-select__search-input\"\n          [class.tedi-select__search-input--hidden]=\"showSingleSelectedValue()\"\n          [placeholder]=\"showSingleSelectedValue() ? '' : placeholder()\"\n          [value]=\"searchTerm()\"\n          [disabled]=\"disabled()\"\n          (input)=\"onSearchInput($event)\"\n          (focus)=\"onSearchFocus()\"\n          (blur)=\"onSearchBlur()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          autocomplete=\"off\"\n          role=\"combobox\"\n          aria-autocomplete=\"list\"\n          [attr.aria-expanded]=\"isOpen()\"\n          [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n          [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n          [attr.aria-label]=\"resolvedAriaLabel()\"\n        />\n      }\n    </div>\n  } @else {\n    <span class=\"tedi-select__label\">\n      @if (selectedValues().length) {\n        @if (allowMultiple()) {\n          <ng-container\n            [ngTemplateOutlet]=\"multiselectTags\"\n            [ngTemplateOutletContext]=\"{ $implicit: multiselectContainerRef }\"\n          />\n        } @else if (ellipsis(); as ellipsisPos) {\n          <tedi-ellipsis [position]=\"ellipsisPos\" [lineClamp]=\"1\">\n            <ng-container [ngTemplateOutlet]=\"singleValue\" />\n          </tedi-ellipsis>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"singleValue\" />\n        }\n      } @else {\n        <span class=\"tedi-select__label--placeholder\">\n          {{ placeholder() }}\n        </span>\n      }\n    </span>\n  }\n\n  @if (clearable() && selectedValues().length) {\n    <button\n      class=\"tedi-select__clear\"\n      tedi-closing-button\n      type=\"button\"\n      size=\"small\"\n      [iconSize]=\"18\"\n      [ariaLabel]=\"'clear' | tediTranslate\"\n      (click)=\"clear($event)\"\n      (keydown.enter)=\"clear($event)\"\n      (keydown.space)=\"clear($event)\"\n      [attr.aria-describedby]=\"label() ? labelId() : null\"\n    ></button>\n  }\n\n  <span\n    class=\"tedi-select__arrow\"\n    aria-hidden=\"true\"\n    (click)=\"onArrowClick($event)\"\n  >\n    <tedi-icon name=\"arrow_drop_down\" />\n  </span>\n</div>\n@if (name(); as fieldName) {\n  @for (formValue of formValues(); track $index) {\n    <input\n      type=\"hidden\"\n      [name]=\"fieldName\"\n      [value]=\"formValue\"\n      [disabled]=\"disabled()\"\n    />\n  }\n}\n@if (feedbackText(); as feedback) {\n  <tedi-feedback-text\n    [text]=\"feedback.text\"\n    [type]=\"feedback.type\"\n    [position]=\"feedback.position\"\n  />\n}\n\n<ng-template #singleValue>\n  @if (valueTemplate(); as tpl) {\n    @if (selectedOptions()[0]; as option) {\n      <ng-container\n        [ngTemplateOutlet]=\"tpl.template\"\n        [ngTemplateOutletContext]=\"getValueContext(option)\"\n      />\n    }\n  } @else {\n    {{ selectedLabels().join(\", \") }}\n  }\n</ng-template>\n\n<ng-template #multiselectTags>\n  <div\n    class=\"tedi-select__multiselect-container\"\n    [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n    [class.tedi-select__multiselect-container--ellipsis]=\"tagEllipsis()\"\n    #multiselectContainer\n  >\n    @if (multiRow()) {\n      @for (value of selectedValues(); track value) {\n        <tedi-tag\n          [ellipsis]=\"tagEllipsis()\"\n          [closable]=\"isTagRemovable()\"\n          (closed)=\"deselect($event, value)\"\n        >\n          {{ getLabel(value) }}\n        </tedi-tag>\n      }\n    } @else {\n      <div class=\"tedi-select__multiselect-tags\">\n        @for (value of selectedValues(); track value; let i = $index) {\n          @if (visibleTagsCount() === null || i < visibleTagsCount()!) {\n            <tedi-tag\n              #tagElement\n              [ellipsis]=\"tagEllipsis()\"\n              [closable]=\"isTagRemovable()\"\n              (closed)=\"deselect($event, value)\"\n            >\n              {{ getLabel(value) }}\n            </tedi-tag>\n          }\n        }\n      </div>\n      @if (hiddenTagsCount() > 0) {\n        <tedi-tag class=\"tedi-select__multiselect-counter\"\n          >+{{ hiddenTagsCount() }}</tedi-tag\n        >\n      }\n    }\n    @if (searchable()) {\n      <input\n        #searchInput\n        [id]=\"inputId()\"\n        type=\"text\"\n        class=\"tedi-select__search-input\"\n        [value]=\"searchTerm()\"\n        [disabled]=\"disabled()\"\n        (input)=\"onSearchInput($event)\"\n        (focus)=\"onSearchFocus()\"\n        (blur)=\"onSearchBlur()\"\n        (keydown)=\"onSearchKeydown($event)\"\n        autocomplete=\"off\"\n        role=\"combobox\"\n        aria-autocomplete=\"list\"\n        [attr.aria-expanded]=\"isOpen()\"\n        [attr.aria-controls]=\"isOpen() ? listboxId() : null\"\n        [attr.aria-labelledby]=\"resolvedAriaLabelledby()\"\n        [attr.aria-label]=\"resolvedAriaLabel()\"\n      />\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"trigger\"\n  [cdkConnectedOverlayOpen]=\"isOpen()\"\n  [cdkConnectedOverlayPositions]=\"dropdownPositions()\"\n  [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n  [cdkConnectedOverlayGrowAfterOpen]=\"true\"\n  (attach)=\"onOverlayAttached()\"\n  (detach)=\"toggleIsOpen(true)\"\n>\n  <div\n    class=\"tedi-select__dropdown\"\n    [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n    [style.max-height]=\"dropdownMaxHeight() ? dropdownMaxHeight() + 'px' : null\"\n  >\n    @if (virtualize()) {\n      <div\n        #virtualListbox\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options tedi-select__options--virtual\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        role=\"listbox\"\n        [attr.aria-multiselectable]=\"allowMultiple() ? true : null\"\n        [attr.aria-labelledby]=\"!searchable() ? resolvedAriaLabelledby() : null\"\n        [attr.aria-label]=\"!searchable() ? resolvedAriaLabel() : null\"\n        [attr.aria-activedescendant]=\"activeDescendantId()\"\n        [tabindex]=\"searchable() ? -1 : 0\"\n        (keydown)=\"onVirtualListboxKeydown($event)\"\n      >\n        @if (filteredOptions().length) {\n          @if (showSelectAllRow()) {\n            <div\n              class=\"tedi-dropdown-item\"\n              [id]=\"listboxId() + '-select-all'\"\n              role=\"option\"\n              [attr.aria-selected]=\"allOptionsSelected()\"\n              [class.tedi-dropdown-item--active]=\"activeIndex() === 0\"\n              (click)=\"onVirtualSelectAllClick()\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </div>\n          }\n          <cdk-virtual-scroll-viewport\n            class=\"tedi-select__viewport\"\n            [itemSize]=\"virtualRowHeight()\"\n            [style.height.px]=\"virtualViewportHeight()\"\n            [minBufferPx]=\"virtualRowHeight() * 6\"\n            [maxBufferPx]=\"virtualRowHeight() * 12\"\n          >\n            <div\n              *cdkVirtualFor=\"\n                let option of filteredOptions();\n                let i = index;\n                trackBy: trackByOptionValue\n              \"\n              class=\"tedi-dropdown-item\"\n              [id]=\"virtualOptionId(i)\"\n              role=\"option\"\n              [attr.aria-selected]=\"isOptionSelected(option.value)\"\n              [attr.aria-disabled]=\"option.disabled ? true : null\"\n              [class.tedi-dropdown-item--selected]=\"\n                !allowMultiple() && isOptionSelected(option.value)\n              \"\n              [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n              [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n              [class.tedi-dropdown-item--active]=\"\n                activeIndex() - (showSelectAllRow() ? 1 : 0) === i\n              \"\n              (click)=\"onVirtualOptionClick(option)\"\n            >\n              @if (optionTemplate(); as tpl) {\n                <ng-container\n                  [ngTemplateOutlet]=\"tpl.template\"\n                  [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                />\n              } @else {\n                <tedi-dropdown-item-value\n                  [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                  [selected]=\"isOptionSelected(option.value)\"\n                  [disabled]=\"!!option.disabled\"\n                >\n                  <tedi-dropdown-item-value-label>{{\n                    option.label\n                  }}</tedi-dropdown-item-value-label>\n                </tedi-dropdown-item-value>\n              }\n            </div>\n          </cdk-virtual-scroll-viewport>\n        } @else {\n          <div\n            class=\"tedi-dropdown-item tedi-select__no-options\"\n            role=\"option\"\n            aria-disabled=\"true\"\n          >\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </div>\n        }\n      </div>\n    } @else {\n      <ul\n        [id]=\"listboxId()\"\n        class=\"tedi-select__options\"\n        [class.tedi-select__options--multiselect]=\"allowMultiple()\"\n        [class.tedi-select__options--swatch-grid]=\"dropdownType() === 'grid'\"\n        cdkListbox\n        [cdkListboxMultiple]=\"allowMultiple()\"\n        [cdkListboxValue]=\"visibleSelectedValues()\"\n        [cdkListboxNavigatesDisabledOptions]=\"false\"\n        [cdkListboxUseActiveDescendant]=\"true\"\n        (cdkListboxValueChange)=\"handleValueChange($event)\"\n        (keydown.tab)=\"toggleIsOpen(true)\"\n        (keydown.escape)=\"toggleIsOpen(true)\"\n        #listbox=\"cdkListbox\"\n      >\n        @if (filteredOptions().length) {\n          @if (allowMultiple() && showSelectAll()) {\n            <li\n              class=\"tedi-dropdown-item\"\n              [cdkOption]=\"SpecialOptionControls.SELECT_ALL\"\n            >\n              <tedi-dropdown-item-value\n                type=\"checkbox\"\n                [selected]=\"allOptionsSelected()\"\n                [indeterminate]=\"someOptionsSelected()\"\n              >\n                <tedi-dropdown-item-value-label>{{\n                  \"select.select-all\" | tediTranslate\n                }}</tedi-dropdown-item-value-label>\n              </tedi-dropdown-item-value>\n            </li>\n          }\n\n          @for (group of optionGroups(); track group.label) {\n            @if (group.label.length > 0) {\n              @if (allowMultiple() && selectableGroups()) {\n                <li\n                  class=\"tedi-dropdown-item tedi-select__group-name tedi-select__group-name--selectable\"\n                  [cdkOption]=\"SpecialOptionControls.SELECT_GROUP + group.label\"\n                >\n                  <tedi-dropdown-item-value\n                    type=\"checkbox\"\n                    [selected]=\"isGroupSelected(group.label)\"\n                    [indeterminate]=\"isGroupIndeterminate(group.label)\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      group.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                </li>\n              } @else {\n                <li class=\"tedi-select__group-name\" role=\"presentation\">\n                  <span tedi-text color=\"tertiary\">\n                    {{ group.label }}\n                  </span>\n                </li>\n              }\n            }\n\n            @for (option of group.options; track option.value; let i = $index) {\n              <li\n                class=\"tedi-dropdown-item\"\n                [class.tedi-dropdown-item--selected]=\"\n                  !allowMultiple() && isOptionSelected(option.value)\n                \"\n                [class.tedi-dropdown-item--disabled]=\"option.disabled\"\n                [class.tedi-dropdown-item--custom]=\"optionTemplate()\"\n                [cdkOption]=\"option.value\"\n                [cdkOptionDisabled]=\"option.disabled\"\n              >\n                @if (optionTemplate(); as tpl) {\n                  <ng-container\n                    [ngTemplateOutlet]=\"tpl.template\"\n                    [ngTemplateOutletContext]=\"getOptionContext(option, i)\"\n                  />\n                } @else {\n                  <tedi-dropdown-item-value\n                    [type]=\"allowMultiple() ? 'checkbox' : 'default'\"\n                    [selected]=\"isOptionSelected(option.value)\"\n                    [disabled]=\"!!option.disabled\"\n                  >\n                    <tedi-dropdown-item-value-label>{{\n                      option.label\n                    }}</tedi-dropdown-item-value-label>\n                  </tedi-dropdown-item-value>\n                }\n              </li>\n            }\n          }\n        } @else {\n          <li class=\"tedi-dropdown-item tedi-select__no-options\">\n            {{ noOptionsMessage() || (\"select.no-options\" | tediTranslate) }}\n          </li>\n        }\n      </ul>\n    }\n  </div>\n</ng-template>\n", styles: ["li[tedi-dropdown-item],.tedi-dropdown-item{display:flex;gap:var(--dropdown-item-inner-spacing);align-items:center;width:100%;min-height:40px;padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);color:var(--dropdown-item-default-text);cursor:pointer;background:var(--dropdown-item-default-background)}li[tedi-dropdown-item]:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]),.tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled,[aria-disabled=true],.tedi-dropdown-item--selected,[aria-selected=true]){color:var(--dropdown-item-hover-text);background:var(--dropdown-item-hover-background)}li[tedi-dropdown-item]:focus-visible,.tedi-dropdown-item:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}li[tedi-dropdown-item][aria-selected=true],li[tedi-dropdown-item].tedi-dropdown-item--selected,.tedi-dropdown-item[aria-selected=true],.tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}li[tedi-dropdown-item][aria-disabled=true],li[tedi-dropdown-item].tedi-dropdown-item--disabled,.tedi-dropdown-item[aria-disabled=true],.tedi-dropdown-item.tedi-dropdown-item--disabled{color:var(--general-text-disabled);cursor:not-allowed;background:var(--dropdown-item-disabled-background)}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item]{position:relative}.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] a[href]:after,.tedi-dropdown-content__list--plain>li[tedi-dropdown-item] button:after{position:absolute;inset:0;content:\"\"}.tedi-input{--_field-padding-y: var(--form-field-padding-y-md-default);--_field-padding-x: var(--form-field-padding-x-md-default);--_field-height: var(--form-field-height);--_field-border-color: var(--form-input-border-default);--_field-background: var(--form-input-background-default);--_field-ring-color: transparent;background:var(--_field-background);border:var(--tedi-borders-01) solid var(--_field-border-color);border-radius:var(--form-field-radius);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--_field-ring-color);min-height:var(--_field-height);padding:calc(var(--_field-padding-y) - var(--tedi-borders-01)) var(--_field-padding-x);--_placeholder-color: var(--form-input-text-placeholder);--_search-input-reserve: 5rem;margin-bottom:0;font-family:var(--family-default);font-size:var(--body-regular-size);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled)}.tedi-input:hover{--_field-border-color: var(--form-input-border-hover)}.tedi-input:focus,.tedi-input:active,.tedi-input.tedi-select__trigger--search-focused{border-color:var(--form-input-border-hover);box-shadow:inset 0 0 0 1px var(--form-input-border-hover)}.tedi-input--disabled{--_field-border-color: var(--form-input-border-disabled);--_field-background: var(--form-input-background-disabled);color:var(--form-input-text-disabled);pointer-events:none}.tedi-input--error:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-error-border)}.tedi-input--error:not(.tedi-input--disabled):focus,.tedi-input--error:not(.tedi-input--disabled):active,.tedi-input--error:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-error-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-error-border)}.tedi-input--valid:not(.tedi-input--disabled){--_field-border-color: var(--form-general-feedback-success-border)}.tedi-input--valid:not(.tedi-input--disabled):focus,.tedi-input--valid:not(.tedi-input--disabled):active,.tedi-input--valid:not(.tedi-input--disabled).tedi-select__trigger--search-focused{border-color:var(--form-general-feedback-success-border);box-shadow:inset 0 0 0 1px var(--form-general-feedback-success-border)}.tedi-input--small{--_field-padding-y: var(--form-field-padding-y-sm);--_field-height: var(--form-field-height-sm)}.tedi-select{display:block;width:100%}.tedi-select .tedi-feedback-text{margin-top:var(--form-field-outer-spacing)}.tedi-select__trigger{display:flex;justify-content:space-between;width:100%;cursor:pointer}.tedi-select__label{flex-grow:1;overflow:hidden;text-align:left;cursor:default}.tedi-select__label--placeholder{color:var(--_placeholder-color);pointer-events:none}.tedi-select__clear{flex-grow:0;padding:0;margin:0;color:var(--button-close-text-default);cursor:pointer;background:none;border:none}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{display:inline-flex;flex-grow:0;flex-shrink:0;align-items:center;padding-left:var(--form-field-inner-spacing);margin-left:var(--form-field-inner-spacing);color:inherit;cursor:default}.tedi-select__dropdown{display:flex;flex-direction:column;max-height:100%;margin-top:var(--form-field-outer-spacing);margin-bottom:var(--form-field-outer-spacing);background:var(--card-background-primary);border-radius:var(--card-radius-rounded);box-shadow:0 1px 5px 0 var(--tedi-alpha-20)}.tedi-select__trigger--searchable{cursor:text}.tedi-select__search-wrapper{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--body-regular-line-height);overflow:hidden}.tedi-select__selected-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.tedi-select__search-input{position:absolute;top:0;left:0;width:100%;height:100%;padding:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;background:transparent;border:none}.tedi-select__search-input:focus{outline:none}.tedi-select__search-input::placeholder{color:var(--form-input-text-placeholder)}.tedi-select__search-input--hidden{color:transparent;caret-color:var(--form-input-text-filled)}.tedi-select__search-input:not(.tedi-select__search-input--hidden){position:relative;flex:1 1 var(--_search-input-reserve);width:auto;min-width:0;height:auto}.tedi-select__options{flex:1;min-height:0;padding:0;margin:0;overflow-y:auto;outline:none}.tedi-select__options .tedi-dropdown-item{outline:none}.tedi-select__options .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled),.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--active:not(.tedi-dropdown-item--disabled){outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:calc(-1 * var(--tedi-borders-02))}.tedi-select__options .tedi-dropdown-item[aria-selected=true],.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected{color:var(--dropdown-item-active-text);background:var(--dropdown-item-active-background)}.tedi-select__options .tedi-dropdown-item[aria-selected=true] .tedi-icon,.tedi-select__options .tedi-dropdown-item.tedi-dropdown-item--selected .tedi-icon{color:inherit}.tedi-select__options--virtual{display:flex;flex-direction:column;overflow:visible}.tedi-select__viewport{width:100%}.tedi-select__viewport .tedi-dropdown-item{box-sizing:border-box}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;padding:var(--dropdown-group-label-padding-y) var(--dropdown-group-label-padding-x) var(--layout-grid-gutters-04);font-size:var(--heading-subtitle-small-size);font-weight:var(--heading-subtitle-small-weight);line-height:var(--heading-subtitle-small-line-height);text-transform:uppercase;letter-spacing:0}.tedi-select__group-name--selectable{padding:var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);text-transform:none;letter-spacing:inherit}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left)}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex:1;flex-wrap:wrap;gap:var(--form-field-inner-spacing);min-width:0}.tedi-select__multiselect-container--single-row{flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-tags{display:flex;flex:0 0 auto;gap:var(--form-field-inner-spacing);min-width:0;overflow:hidden}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-container--single-row .tedi-select__multiselect-counter{flex-shrink:0}.tedi-select__multiselect-container--single-row.tedi-select__multiselect-container--ellipsis .tedi-select__multiselect-tags{flex:0 1 auto}.tedi-select__no-options{color:var(--general-text-tertiary);cursor:default}.tedi-select__no-options:hover{color:var(--general-text-tertiary);background:var(--dropdown-item-default-background)}.tedi-select__dropdown:has(.tedi-select__options--swatch-grid){width:fit-content}.tedi-select__options--swatch-grid{--tedi-swatch-size: 24px;--tedi-swatch-gap: var(--layout-grid-gutters-04);--tedi-swatch-columns: 11;display:grid;grid-template-columns:repeat(auto-fit,var(--tedi-swatch-size));gap:var(--tedi-swatch-gap);max-width:calc(var(--tedi-swatch-columns) * (var(--tedi-swatch-size) + var(--tedi-swatch-gap)));padding:var(--dropdown-body-padding-y) var(--dropdown-body-padding-x)}.tedi-select__options--swatch-grid .tedi-dropdown-item{display:flex;align-items:center;justify-content:center;width:var(--tedi-swatch-size);height:var(--tedi-swatch-size);min-height:auto;padding:var(--layout-grid-gutters-02);color:inherit;background:transparent;border-radius:var(--card-radius-rounded)}.tedi-select__options--swatch-grid .tedi-dropdown-item.cdk-option-active:not(.tedi-dropdown-item--disabled){outline-offset:0}.tedi-select__options--swatch-grid .tedi-dropdown-item[aria-selected=true],.tedi-select__options--swatch-grid .tedi-dropdown-item.tedi-dropdown-item--selected{color:inherit;background:transparent;border:var(--tedi-borders-02) solid var(--card-border-selected)}.tedi-select__options--swatch-grid .tedi-dropdown-item:hover:not(.tedi-dropdown-item--disabled){background:transparent}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], dropdownWidthRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownWidthRef", required: false }] }], dropdownAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownAlign", required: false }] }], feedbackText: [{ type: i0.Input, args: [{ isSignal: true, alias: "feedbackText", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], bindLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindLabel", required: false }] }], bindValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindValue", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], allowMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowMultiple", required: false }] }], groupBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupBy", required: false }] }], showSelectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSelectAll", required: false }] }], selectableGroups: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectableGroups", required: false }] }], isTagRemovable: [{ type: i0.Input, args: [{ isSignal: true, alias: "isTagRemovable", required: false }] }], multiRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiRow", required: false }] }], tagEllipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "tagEllipsis", required: false }] }], ellipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "ellipsis", required: false }] }], compareWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareWith", required: false }] }], disabledKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledKey", required: false }] }], noOptionsMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "noOptionsMessage", required: false }] }], maxDropdownHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDropdownHeight", required: false }] }], hideOnScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnScroll", required: false }] }], dropdownType: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownType", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], virtualItemSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualItemSize", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], searchFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchFn", required: false }] }], clearSearchOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearSearchOnSelect", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], searchChange: [{ type: i0.Output, args: ["searchChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], cleared: [{ type: i0.Output, args: ["cleared"] }], listboxRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkListbox), { ...{ read: ElementRef }, isSignal: true }] }], cdkListboxRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkListbox), { isSignal: true }] }], viewport: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkVirtualScrollViewport), { isSignal: true }] }], virtualListboxRef: [{ type: i0.ViewChild, args: ["virtualListbox", { isSignal: true }] }], connectedOverlay: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkConnectedOverlay), { isSignal: true }] }], triggerRef: [{ type: i0.ViewChild, args: ["trigger", { ...{ read: ElementRef }, isSignal: true }] }], searchInputRef: [{ type: i0.ViewChild, args: ["searchInput", { isSignal: true }] }], multiselectContainerRef: [{ type: i0.ViewChild, args: ["multiselectContainer", { isSignal: true }] }], tagRefs: [{ type: i0.ViewChildren, args: ["tagElement", { ...{ read: ElementRef }, isSignal: true }] }], optionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SelectOptionTemplateDirective), { isSignal: true }] }], valueTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SelectValueTemplateDirective), { isSignal: true }] }], tooltipTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SelectTooltipTemplateDirective), { isSignal: true }] }], onWindowResize: [{
                 type: HostListener,
                 args: ["window:resize"]
             }], onDocumentClick: [{
@@ -16600,7 +16602,7 @@ class PaginationComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: PaginationComponent, isStandalone: true, selector: "tedi-pagination", inputs: { pageCount: { classPropertyName: "pageCount", publicName: "pageCount", isSignal: true, isRequired: true, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", 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 }, boundaryCount: { classPropertyName: "boundaryCount", publicName: "boundaryCount", isSignal: true, isRequired: false, transformFunction: null }, siblingCount: { classPropertyName: "siblingCount", publicName: "siblingCount", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, dividerPosition: { classPropertyName: "dividerPosition", publicName: "dividerPosition", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", 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 }, hidePager: { classPropertyName: "hidePager", publicName: "hidePager", isSignal: true, isRequired: false, transformFunction: null }, hideArrows: { classPropertyName: "hideArrows", publicName: "hideArrows", isSignal: true, isRequired: false, transformFunction: null }, disableArrowsAtBoundary: { classPropertyName: "disableArrowsAtBoundary", publicName: "disableArrowsAtBoundary", isSignal: true, isRequired: false, transformFunction: null }, arrowVariant: { classPropertyName: "arrowVariant", publicName: "arrowVariant", isSignal: true, isRequired: false, transformFunction: null }, showArrowLabels: { classPropertyName: "showArrowLabels", publicName: "showArrowLabels", isSignal: true, isRequired: false, transformFunction: null }, previousIcon: { classPropertyName: "previousIcon", publicName: "previousIcon", isSignal: true, isRequired: false, transformFunction: null }, nextIcon: { classPropertyName: "nextIcon", publicName: "nextIcon", isSignal: true, isRequired: false, transformFunction: null }, showModalTitle: { classPropertyName: "showModalTitle", publicName: "showModalTitle", 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 } }, outputs: { page: "pageChange", pageSize: "pageSizeChange" }, host: { attributes: { "data-name": "tedi-pagination" }, properties: { "class": "hostClasses()" } }, queries: [{ propertyName: "customResults", first: true, predicate: TediPaginationResultsDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<span\n  class=\"tedi-pagination__status\"\n  role=\"status\"\n  aria-live=\"polite\"\n  aria-atomic=\"true\"\n>\n  {{ statusText() }}\n</span>\n\n<div class=\"tedi-pagination__slot-start\">\n  @if (showResults()) {\n    @if (customResults()) {\n      <ng-content select=\"[tediPaginationResults]\" />\n    } @else {\n      <span class=\"tedi-pagination__results\">\n        {{ mergedLabels().results(totalItems()!) }}\n      </span>\n    }\n  }\n</div>\n\n<div class=\"tedi-pagination__slot-center\">\n  @if (showPager()) {\n    <nav\n      class=\"tedi-pagination__nav\"\n      [attr.aria-label]=\"mergedLabels().ariaLabel\"\n    >\n      @if (showPrevious()) {\n        <button\n          tedi-button\n          type=\"button\"\n          size=\"small\"\n          [variant]=\"resolvedArrowVariant()\"\n          class=\"tedi-pagination__nav-button tedi-pagination__nav-button--previous\"\n          [attr.aria-label]=\"\n            resolvedShowArrowLabels() ? null : mergedLabels().previous\n          \"\n          [disabled]=\"previousItem().disabled\"\n          (click)=\"handlePageChange(previousItem().page)\"\n        >\n          <tedi-icon [name]=\"previousIcon()\" />\n          @if (resolvedShowArrowLabels()) {\n            <span>{{ mergedLabels().previous }}</span>\n          }\n        </button>\n      }\n\n      @if (!useCompactPicker()) {\n        <ul class=\"tedi-pagination__list\">\n          @for (item of pageItems(); track $index) {\n            @if (item.type === \"ellipsis\") {\n              <li\n                class=\"tedi-pagination__item tedi-pagination__item--ellipsis\"\n                aria-hidden=\"true\"\n              >\n                \u2026\n              </li>\n            } @else {\n              <li class=\"tedi-pagination__item\">\n                <button\n                  type=\"button\"\n                  class=\"tedi-pagination__page\"\n                  [class.tedi-pagination__page--selected]=\"item.selected\"\n                  [attr.aria-label]=\"\n                    item.selected\n                      ? mergedLabels().currentPageAriaLabel(item.page!)\n                      : mergedLabels().pageAriaLabel(item.page!)\n                  \"\n                  [attr.aria-current]=\"item.selected ? 'page' : null\"\n                  (click)=\"handlePageChange(item.page)\"\n                >\n                  {{ item.page }}\n                </button>\n              </li>\n            }\n          }\n        </ul>\n      }\n      @if (useCompactPicker()) {\n        <button\n          type=\"button\"\n          class=\"tedi-pagination__mobile-trigger\"\n          aria-haspopup=\"dialog\"\n          [attr.aria-expanded]=\"isMobileModalOpen()\"\n          [attr.aria-label]=\"mobileTriggerAriaLabel()\"\n          (click)=\"openMobilePicker()\"\n        >\n          <span\n            class=\"tedi-pagination__mobile-trigger-label\"\n            aria-hidden=\"true\"\n          >\n            <strong>{{ currentPage() }}</strong>\n            <span>/</span>\n            <span>{{ pageCount() }}</span>\n          </span>\n          <tedi-icon name=\"arrow_drop_down\" />\n        </button>\n      }\n\n      @if (showNext()) {\n        <button\n          tedi-button\n          type=\"button\"\n          size=\"small\"\n          [variant]=\"resolvedArrowVariant()\"\n          class=\"tedi-pagination__nav-button tedi-pagination__nav-button--next\"\n          [attr.aria-label]=\"\n            resolvedShowArrowLabels() ? null : mergedLabels().next\n          \"\n          [disabled]=\"nextItem().disabled\"\n          (click)=\"handlePageChange(nextItem().page)\"\n        >\n          @if (resolvedShowArrowLabels()) {\n            <span>{{ mergedLabels().next }}</span>\n          }\n          <tedi-icon [name]=\"nextIcon()\" />\n        </button>\n      }\n    </nav>\n  }\n</div>\n\n<div class=\"tedi-pagination__slot-end\">\n  @if (showPageSizeSelect()) {\n    <div class=\"tedi-pagination__page-size\">\n      @if (useCompactPicker()) {\n        <span class=\"tedi-pagination__page-size-label\">\n          {{ mergedLabels().pageSize }}\n        </span>\n        <button\n          type=\"button\"\n          class=\"tedi-pagination__page-size-trigger\"\n          aria-haspopup=\"dialog\"\n          [attr.aria-expanded]=\"isPageSizeModalOpen()\"\n          [attr.aria-label]=\"mobilePageSizeAriaLabel()\"\n          (click)=\"openPageSizePicker()\"\n        >\n          <span aria-hidden=\"true\">{{ selectedPageSizeLabel() }}</span>\n          <tedi-icon name=\"arrow_drop_down\" />\n        </button>\n      } @else {\n        <span class=\"tedi-pagination__page-size-label\" [id]=\"pageSizeLabelId\">\n          {{ mergedLabels().pageSize }}\n        </span>\n        <tedi-select\n          class=\"tedi-pagination__page-size-select\"\n          [inputId]=\"pageSizeInputId\"\n          [ariaLabelledby]=\"pageSizeLabelId\"\n          size=\"small\"\n          [options]=\"pageSizeSelectOptions()\"\n          bindLabel=\"label\"\n          bindValue=\"value\"\n          dropdownAlign=\"end\"\n          [value]=\"pageSize()\"\n          (selectionChange)=\"handlePageSizeChange($event)\"\n        />\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-pagination{display:flex;flex-flow:row wrap;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:center;width:100%;padding:var(--pagination-padding-y) var(--pagination-padding-x)}@media(max-width:35.98rem){.tedi-pagination{flex-direction:column;gap:var(--layout-grid-gutters-08)}}.tedi-pagination--align-left .tedi-pagination__slot-start,.tedi-pagination--align-left .tedi-pagination__slot-end,.tedi-pagination--align-right .tedi-pagination__slot-start,.tedi-pagination--align-right .tedi-pagination__slot-end{flex:0 0 auto;justify-content:flex-start}.tedi-pagination--align-left{justify-content:flex-start}@media(max-width:35.98rem){.tedi-pagination--align-left{align-items:flex-start}}.tedi-pagination--align-right{justify-content:flex-end}@media(max-width:35.98rem){.tedi-pagination--align-right{align-items:flex-end}}.tedi-pagination--bg-white{background:var(--general-surface-primary)}.tedi-pagination--bg-transparent{background:transparent}.tedi-pagination--divider-top:not(.tedi-pagination--bg-transparent){border-top:var(--tedi-borders-01) solid var(--general-border-secondary)}.tedi-pagination--divider-bottom:not(.tedi-pagination--bg-transparent){border-bottom:var(--tedi-borders-01) solid var(--general-border-secondary)}.tedi-pagination--no-pager .tedi-pagination__slot-center,.tedi-pagination--align-left.tedi-pagination--no-results .tedi-pagination__slot-start,.tedi-pagination--align-left.tedi-pagination--no-page-size .tedi-pagination__slot-end,.tedi-pagination--align-right.tedi-pagination--no-results .tedi-pagination__slot-start,.tedi-pagination--align-right.tedi-pagination--no-page-size .tedi-pagination__slot-end{display:none}.tedi-pagination__status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}.tedi-pagination__slot-start{display:inline-flex;flex:1 1 0;align-items:center;justify-content:flex-start}.tedi-pagination__slot-center{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center}@media(max-width:35.98rem){.tedi-pagination__slot-center{align-self:stretch}}.tedi-pagination__slot-end{display:flex;flex:1 1 0;align-items:center;justify-content:flex-end}.tedi-pagination__results{flex:0 0 auto;font-family:var(--family-default);font-size:var(--body-small-regular-size);font-weight:var(--body-small-regular-weight);line-height:var(--body-small-regular-line-height);color:var(--general-text-secondary);white-space:nowrap}@media(max-width:47.98rem){.tedi-pagination__results{font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height)}}.tedi-pagination__nav{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;justify-content:center}@media(max-width:47.98rem){.tedi-pagination__nav{display:grid;grid-template-columns:var(--button-sm-icon-size) auto var(--button-sm-icon-size)}}@media(max-width:35.98rem){.tedi-pagination__nav{grid-template-columns:1fr auto 1fr;width:100%}}@media(max-width:47.98rem){.tedi-pagination--arrow-labels .tedi-pagination__nav{display:flex}}.tedi-pagination__list{display:flex;flex-wrap:nowrap;gap:var(--layout-grid-gutters-08);align-items:center;padding:0;margin:0;list-style:none}.tedi-pagination__item{display:inline-flex;align-items:center;justify-content:center}.tedi-pagination__item--ellipsis{width:var(--pagination-button-size);height:var(--pagination-button-size);font-family:var(--family-default);font-size:var(--body-small-regular-size);line-height:var(--body-small-regular-line-height);color:var(--general-text-secondary);-webkit-user-select:none;user-select:none}.tedi-pagination__page{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:var(--pagination-button-size);height:var(--pagination-button-size);padding:0 var(--layout-grid-gutters-04);font-family:var(--family-default);font-size:var(--body-small-regular-size);font-weight:var(--body-small-regular-weight);line-height:var(--body-small-regular-line-height);color:var(--general-text-secondary);cursor:pointer;background:transparent;border:none;border-radius:var(--button-radius-default)}.tedi-pagination__page:before{position:absolute;inset:-4px;content:\"\"}.tedi-pagination__page:hover{color:var(--button-main-neutral-text-hover);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-pagination__page:active{color:var(--button-main-neutral-text-active);background:var(--button-main-neutral-icon-only-background-active)}.tedi-pagination__page:focus-visible{color:var(--button-main-neutral-text-focus);outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-pagination__page--selected{color:var(--general-text-white);cursor:default;background:var(--general-surface-brand-secondary)}.tedi-pagination__page--selected:hover,.tedi-pagination__page--selected:active,.tedi-pagination__page--selected:focus-visible{color:var(--general-text-white);background:var(--general-surface-brand-secondary)}@media(max-width:47.98rem){.tedi-pagination__nav-button--previous{grid-column:1;justify-self:end}}@media(max-width:47.98rem){.tedi-pagination__nav-button--next{grid-column:3;justify-self:start}}.tedi-pagination__mobile-trigger{display:inline-flex;gap:var(--form-field-inner-spacing);align-items:center;justify-self:center;min-height:var(--form-field-height-sm);padding:var(--form-field-padding-y-sm) var(--form-field-padding-x-md-default);color:var(--form-input-text-filled);cursor:pointer;background:var(--form-input-background-default);border:var(--tedi-borders-01) solid var(--form-input-border-default);border-radius:var(--form-field-radius)}@media(max-width:47.98rem){.tedi-pagination__mobile-trigger{grid-column:2}}.tedi-pagination__mobile-trigger:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-pagination__mobile-trigger-label{display:inline-flex;gap:var(--layout-grid-gutters-04);align-items:center;font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height)}.tedi-pagination__mobile-trigger-label strong{font-weight:var(--body-bold-weight);color:var(--general-text-brand)}.tedi-pagination__page-size{display:flex;gap:var(--form-field-inner-spacing);align-items:center;justify-content:flex-end;min-width:0}@media(max-width:35.98rem){.tedi-pagination__page-size{flex-direction:column;gap:var(--layout-grid-gutters-04);align-items:center;justify-content:center}}@media(max-width:35.98rem){.tedi-pagination--align-left .tedi-pagination__page-size{align-items:flex-start}}@media(max-width:35.98rem){.tedi-pagination--align-right .tedi-pagination__page-size{align-items:flex-end}}.tedi-pagination__page-size-label{font-family:var(--family-default);font-size:var(--body-small-regular-size);font-weight:var(--body-small-regular-weight);line-height:var(--body-small-regular-line-height);color:var(--general-text-secondary);white-space:nowrap;cursor:default}@media(max-width:47.98rem){.tedi-pagination__page-size-label{font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height)}}.tedi-pagination__page-size-select.tedi-select{width:auto;min-width:96px}.tedi-pagination__page-size-trigger{display:inline-flex;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--form-field-height-sm);padding:var(--form-field-padding-y-sm) var(--form-field-padding-x-md-default);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled);cursor:pointer;background:var(--form-input-background-default);border:var(--tedi-borders-01) solid var(--form-input-border-default);border-radius:var(--form-field-radius)}.tedi-pagination__page-size-trigger:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}\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: SelectComponent, selector: "tedi-select", inputs: ["inputId", "label", "tooltip", "ariaLabelledby", "ariaLabel", "required", "placeholder", "state", "size", "clearable", "dropdownWidthRef", "dropdownAlign", "feedbackText", "options", "bindLabel", "bindValue", "value", "allowMultiple", "groupBy", "showSelectAll", "selectableGroups", "isTagRemovable", "multiRow", "tagEllipsis", "ellipsis", "compareWith", "disabledKey", "noOptionsMessage", "maxDropdownHeight", "hideOnScroll", "dropdownType", "virtualScroll", "virtualItemSize", "searchable", "searchFn", "clearSearchOnSelect"], outputs: ["selectionChange", "searchChange", "opened", "closed", "cleared"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: PaginationComponent, isStandalone: true, selector: "tedi-pagination", inputs: { pageCount: { classPropertyName: "pageCount", publicName: "pageCount", isSignal: true, isRequired: true, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", 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 }, boundaryCount: { classPropertyName: "boundaryCount", publicName: "boundaryCount", isSignal: true, isRequired: false, transformFunction: null }, siblingCount: { classPropertyName: "siblingCount", publicName: "siblingCount", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, dividerPosition: { classPropertyName: "dividerPosition", publicName: "dividerPosition", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", 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 }, hidePager: { classPropertyName: "hidePager", publicName: "hidePager", isSignal: true, isRequired: false, transformFunction: null }, hideArrows: { classPropertyName: "hideArrows", publicName: "hideArrows", isSignal: true, isRequired: false, transformFunction: null }, disableArrowsAtBoundary: { classPropertyName: "disableArrowsAtBoundary", publicName: "disableArrowsAtBoundary", isSignal: true, isRequired: false, transformFunction: null }, arrowVariant: { classPropertyName: "arrowVariant", publicName: "arrowVariant", isSignal: true, isRequired: false, transformFunction: null }, showArrowLabels: { classPropertyName: "showArrowLabels", publicName: "showArrowLabels", isSignal: true, isRequired: false, transformFunction: null }, previousIcon: { classPropertyName: "previousIcon", publicName: "previousIcon", isSignal: true, isRequired: false, transformFunction: null }, nextIcon: { classPropertyName: "nextIcon", publicName: "nextIcon", isSignal: true, isRequired: false, transformFunction: null }, showModalTitle: { classPropertyName: "showModalTitle", publicName: "showModalTitle", 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 } }, outputs: { page: "pageChange", pageSize: "pageSizeChange" }, host: { attributes: { "data-name": "tedi-pagination" }, properties: { "class": "hostClasses()" } }, queries: [{ propertyName: "customResults", first: true, predicate: TediPaginationResultsDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<span\n  class=\"tedi-pagination__status\"\n  role=\"status\"\n  aria-live=\"polite\"\n  aria-atomic=\"true\"\n>\n  {{ statusText() }}\n</span>\n\n<div class=\"tedi-pagination__slot-start\">\n  @if (showResults()) {\n    @if (customResults()) {\n      <ng-content select=\"[tediPaginationResults]\" />\n    } @else {\n      <span class=\"tedi-pagination__results\">\n        {{ mergedLabels().results(totalItems()!) }}\n      </span>\n    }\n  }\n</div>\n\n<div class=\"tedi-pagination__slot-center\">\n  @if (showPager()) {\n    <nav\n      class=\"tedi-pagination__nav\"\n      [attr.aria-label]=\"mergedLabels().ariaLabel\"\n    >\n      @if (showPrevious()) {\n        <button\n          tedi-button\n          type=\"button\"\n          size=\"small\"\n          [variant]=\"resolvedArrowVariant()\"\n          class=\"tedi-pagination__nav-button tedi-pagination__nav-button--previous\"\n          [attr.aria-label]=\"\n            resolvedShowArrowLabels() ? null : mergedLabels().previous\n          \"\n          [disabled]=\"previousItem().disabled\"\n          (click)=\"handlePageChange(previousItem().page)\"\n        >\n          <tedi-icon [name]=\"previousIcon()\" />\n          @if (resolvedShowArrowLabels()) {\n            <span>{{ mergedLabels().previous }}</span>\n          }\n        </button>\n      }\n\n      @if (!useCompactPicker()) {\n        <ul class=\"tedi-pagination__list\">\n          @for (item of pageItems(); track $index) {\n            @if (item.type === \"ellipsis\") {\n              <li\n                class=\"tedi-pagination__item tedi-pagination__item--ellipsis\"\n                aria-hidden=\"true\"\n              >\n                \u2026\n              </li>\n            } @else {\n              <li class=\"tedi-pagination__item\">\n                <button\n                  type=\"button\"\n                  class=\"tedi-pagination__page\"\n                  [class.tedi-pagination__page--selected]=\"item.selected\"\n                  [attr.aria-label]=\"\n                    item.selected\n                      ? mergedLabels().currentPageAriaLabel(item.page!)\n                      : mergedLabels().pageAriaLabel(item.page!)\n                  \"\n                  [attr.aria-current]=\"item.selected ? 'page' : null\"\n                  (click)=\"handlePageChange(item.page)\"\n                >\n                  {{ item.page }}\n                </button>\n              </li>\n            }\n          }\n        </ul>\n      }\n      @if (useCompactPicker()) {\n        <button\n          type=\"button\"\n          class=\"tedi-pagination__mobile-trigger\"\n          aria-haspopup=\"dialog\"\n          [attr.aria-expanded]=\"isMobileModalOpen()\"\n          [attr.aria-label]=\"mobileTriggerAriaLabel()\"\n          (click)=\"openMobilePicker()\"\n        >\n          <span\n            class=\"tedi-pagination__mobile-trigger-label\"\n            aria-hidden=\"true\"\n          >\n            <strong>{{ currentPage() }}</strong>\n            <span>/</span>\n            <span>{{ pageCount() }}</span>\n          </span>\n          <tedi-icon name=\"arrow_drop_down\" />\n        </button>\n      }\n\n      @if (showNext()) {\n        <button\n          tedi-button\n          type=\"button\"\n          size=\"small\"\n          [variant]=\"resolvedArrowVariant()\"\n          class=\"tedi-pagination__nav-button tedi-pagination__nav-button--next\"\n          [attr.aria-label]=\"\n            resolvedShowArrowLabels() ? null : mergedLabels().next\n          \"\n          [disabled]=\"nextItem().disabled\"\n          (click)=\"handlePageChange(nextItem().page)\"\n        >\n          @if (resolvedShowArrowLabels()) {\n            <span>{{ mergedLabels().next }}</span>\n          }\n          <tedi-icon [name]=\"nextIcon()\" />\n        </button>\n      }\n    </nav>\n  }\n</div>\n\n<div class=\"tedi-pagination__slot-end\">\n  @if (showPageSizeSelect()) {\n    <div class=\"tedi-pagination__page-size\">\n      @if (useCompactPicker()) {\n        <span class=\"tedi-pagination__page-size-label\">\n          {{ mergedLabels().pageSize }}\n        </span>\n        <button\n          type=\"button\"\n          class=\"tedi-pagination__page-size-trigger\"\n          aria-haspopup=\"dialog\"\n          [attr.aria-expanded]=\"isPageSizeModalOpen()\"\n          [attr.aria-label]=\"mobilePageSizeAriaLabel()\"\n          (click)=\"openPageSizePicker()\"\n        >\n          <span aria-hidden=\"true\">{{ selectedPageSizeLabel() }}</span>\n          <tedi-icon name=\"arrow_drop_down\" />\n        </button>\n      } @else {\n        <span class=\"tedi-pagination__page-size-label\" [id]=\"pageSizeLabelId\">\n          {{ mergedLabels().pageSize }}\n        </span>\n        <tedi-select\n          class=\"tedi-pagination__page-size-select\"\n          [inputId]=\"pageSizeInputId\"\n          [ariaLabelledby]=\"pageSizeLabelId\"\n          size=\"small\"\n          [options]=\"pageSizeSelectOptions()\"\n          bindLabel=\"label\"\n          bindValue=\"value\"\n          dropdownAlign=\"end\"\n          [value]=\"pageSize()\"\n          (selectionChange)=\"handlePageSizeChange($event)\"\n        />\n      }\n    </div>\n  }\n</div>\n", styles: [".tedi-pagination{display:flex;flex-flow:row wrap;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:center;width:100%;padding:var(--pagination-padding-y) var(--pagination-padding-x)}@media(max-width:35.98rem){.tedi-pagination{flex-direction:column;gap:var(--layout-grid-gutters-08)}}.tedi-pagination--align-left .tedi-pagination__slot-start,.tedi-pagination--align-left .tedi-pagination__slot-end,.tedi-pagination--align-right .tedi-pagination__slot-start,.tedi-pagination--align-right .tedi-pagination__slot-end{flex:0 0 auto;justify-content:flex-start}.tedi-pagination--align-left{justify-content:flex-start}@media(max-width:35.98rem){.tedi-pagination--align-left{align-items:flex-start}}.tedi-pagination--align-right{justify-content:flex-end}@media(max-width:35.98rem){.tedi-pagination--align-right{align-items:flex-end}}.tedi-pagination--bg-white{background:var(--general-surface-primary)}.tedi-pagination--bg-transparent{background:transparent}.tedi-pagination--divider-top:not(.tedi-pagination--bg-transparent){border-top:var(--tedi-borders-01) solid var(--general-border-secondary)}.tedi-pagination--divider-bottom:not(.tedi-pagination--bg-transparent){border-bottom:var(--tedi-borders-01) solid var(--general-border-secondary)}.tedi-pagination--no-pager .tedi-pagination__slot-center,.tedi-pagination--align-left.tedi-pagination--no-results .tedi-pagination__slot-start,.tedi-pagination--align-left.tedi-pagination--no-page-size .tedi-pagination__slot-end,.tedi-pagination--align-right.tedi-pagination--no-results .tedi-pagination__slot-start,.tedi-pagination--align-right.tedi-pagination--no-page-size .tedi-pagination__slot-end{display:none}.tedi-pagination__status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}.tedi-pagination__slot-start{display:inline-flex;flex:1 1 0;align-items:center;justify-content:flex-start}.tedi-pagination__slot-center{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center}@media(max-width:35.98rem){.tedi-pagination__slot-center{align-self:stretch}}.tedi-pagination__slot-end{display:flex;flex:1 1 0;align-items:center;justify-content:flex-end}.tedi-pagination__results{flex:0 0 auto;font-family:var(--family-default);font-size:var(--body-small-regular-size);font-weight:var(--body-small-regular-weight);line-height:var(--body-small-regular-line-height);color:var(--general-text-secondary);white-space:nowrap}@media(max-width:47.98rem){.tedi-pagination__results{font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height)}}.tedi-pagination__nav{display:flex;gap:var(--layout-grid-gutters-08);align-items:center;justify-content:center}@media(max-width:47.98rem){.tedi-pagination__nav{display:grid;grid-template-columns:var(--button-sm-icon-size) auto var(--button-sm-icon-size)}}@media(max-width:35.98rem){.tedi-pagination__nav{grid-template-columns:1fr auto 1fr;width:100%}}@media(max-width:47.98rem){.tedi-pagination--arrow-labels .tedi-pagination__nav{display:flex}}.tedi-pagination__list{display:flex;flex-wrap:nowrap;gap:var(--layout-grid-gutters-08);align-items:center;padding:0;margin:0;list-style:none}.tedi-pagination__item{display:inline-flex;align-items:center;justify-content:center}.tedi-pagination__item--ellipsis{width:var(--pagination-button-size);height:var(--pagination-button-size);font-family:var(--family-default);font-size:var(--body-small-regular-size);line-height:var(--body-small-regular-line-height);color:var(--general-text-secondary);-webkit-user-select:none;user-select:none}.tedi-pagination__page{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:var(--pagination-button-size);height:var(--pagination-button-size);padding:0 var(--layout-grid-gutters-04);font-family:var(--family-default);font-size:var(--body-small-regular-size);font-weight:var(--body-small-regular-weight);line-height:var(--body-small-regular-line-height);color:var(--general-text-secondary);cursor:pointer;background:transparent;border:none;border-radius:var(--button-radius-default)}.tedi-pagination__page:before{position:absolute;inset:-4px;content:\"\"}.tedi-pagination__page:hover{color:var(--button-main-neutral-text-hover);background:var(--button-main-neutral-icon-only-background-hover)}.tedi-pagination__page:active{color:var(--button-main-neutral-text-active);background:var(--button-main-neutral-icon-only-background-active)}.tedi-pagination__page:focus-visible{color:var(--button-main-neutral-text-focus);outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-pagination__page--selected{color:var(--general-text-white);cursor:default;background:var(--general-surface-brand-secondary)}.tedi-pagination__page--selected:hover,.tedi-pagination__page--selected:active,.tedi-pagination__page--selected:focus-visible{color:var(--general-text-white);background:var(--general-surface-brand-secondary)}@media(max-width:47.98rem){.tedi-pagination__nav-button--previous{grid-column:1;justify-self:end}}@media(max-width:47.98rem){.tedi-pagination__nav-button--next{grid-column:3;justify-self:start}}.tedi-pagination__mobile-trigger{display:inline-flex;gap:var(--form-field-inner-spacing);align-items:center;justify-self:center;min-height:var(--form-field-height-sm);padding:var(--form-field-padding-y-sm) var(--form-field-padding-x-md-default);color:var(--form-input-text-filled);cursor:pointer;background:var(--form-input-background-default);border:var(--tedi-borders-01) solid var(--form-input-border-default);border-radius:var(--form-field-radius)}@media(max-width:47.98rem){.tedi-pagination__mobile-trigger{grid-column:2}}.tedi-pagination__mobile-trigger:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}.tedi-pagination__mobile-trigger-label{display:inline-flex;gap:var(--layout-grid-gutters-04);align-items:center;font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height)}.tedi-pagination__mobile-trigger-label strong{font-weight:var(--body-bold-weight);color:var(--general-text-brand)}.tedi-pagination__page-size{display:flex;gap:var(--form-field-inner-spacing);align-items:center;justify-content:flex-end;min-width:0}@media(max-width:35.98rem){.tedi-pagination__page-size{flex-direction:column;gap:var(--layout-grid-gutters-04);align-items:center;justify-content:center}}@media(max-width:35.98rem){.tedi-pagination--align-left .tedi-pagination__page-size{align-items:flex-start}}@media(max-width:35.98rem){.tedi-pagination--align-right .tedi-pagination__page-size{align-items:flex-end}}.tedi-pagination__page-size-label{font-family:var(--family-default);font-size:var(--body-small-regular-size);font-weight:var(--body-small-regular-weight);line-height:var(--body-small-regular-line-height);color:var(--general-text-secondary);white-space:nowrap;cursor:default}@media(max-width:47.98rem){.tedi-pagination__page-size-label{font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height)}}.tedi-pagination__page-size-select.tedi-select{width:auto;min-width:96px}.tedi-pagination__page-size-trigger{display:inline-flex;gap:var(--form-field-inner-spacing);align-items:center;min-height:var(--form-field-height-sm);padding:var(--form-field-padding-y-sm) var(--form-field-padding-x-md-default);font-family:var(--family-default);font-size:var(--body-regular-size);font-weight:var(--body-regular-weight);line-height:var(--body-regular-line-height);color:var(--form-input-text-filled);cursor:pointer;background:var(--form-input-background-default);border:var(--tedi-borders-01) solid var(--form-input-border-default);border-radius:var(--form-field-radius)}.tedi-pagination__page-size-trigger:focus-visible{outline:var(--tedi-borders-02) solid var(--tedi-primary-500);outline-offset:var(--tedi-borders-01)}\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: SelectComponent, selector: "tedi-select", inputs: ["inputId", "name", "label", "tooltip", "ariaLabelledby", "ariaLabel", "required", "placeholder", "state", "size", "clearable", "dropdownWidthRef", "dropdownAlign", "feedbackText", "options", "bindLabel", "bindValue", "value", "allowMultiple", "groupBy", "showSelectAll", "selectableGroups", "isTagRemovable", "multiRow", "tagEllipsis", "ellipsis", "compareWith", "disabledKey", "noOptionsMessage", "maxDropdownHeight", "hideOnScroll", "dropdownType", "virtualScroll", "virtualItemSize", "searchable", "searchFn", "clearSearchOnSelect"], outputs: ["selectionChange", "searchChange", "opened", "closed", "cleared"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: PaginationComponent, decorators: [{
             type: Component,
@@ -22541,6 +22543,450 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
                     }, template: "<ng-content />\n", styles: [".tedi-horizontal-stepper{display:flex;background-color:var(--stepper-background)}.tedi-horizontal-stepper--transparent{background-color:transparent}.tedi-horizontal-stepper--compact .tedi-horizontal-stepper-item{flex:1 0 0}.tedi-horizontal-stepper--compact .tedi-horizontal-stepper-item--selected{flex:0 0 auto}.tedi-horizontal-stepper--compact .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__step{align-items:center;justify-content:center;width:100%}.tedi-horizontal-stepper--compact .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__content{display:none}.tedi-horizontal-stepper--compact .tedi-horizontal-stepper-item--selected .tedi-horizontal-stepper-item__content{display:flex}@media(max-width:35.98rem){.tedi-horizontal-stepper--compact-sm .tedi-horizontal-stepper-item{flex:1 0 0}.tedi-horizontal-stepper--compact-sm .tedi-horizontal-stepper-item--selected{flex:0 0 auto}.tedi-horizontal-stepper--compact-sm .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__step{align-items:center;justify-content:center;width:100%}.tedi-horizontal-stepper--compact-sm .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__content{display:none}.tedi-horizontal-stepper--compact-sm .tedi-horizontal-stepper-item--selected .tedi-horizontal-stepper-item__content{display:flex}}@media(max-width:47.98rem){.tedi-horizontal-stepper--compact-md .tedi-horizontal-stepper-item{flex:1 0 0}.tedi-horizontal-stepper--compact-md .tedi-horizontal-stepper-item--selected{flex:0 0 auto}.tedi-horizontal-stepper--compact-md .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__step{align-items:center;justify-content:center;width:100%}.tedi-horizontal-stepper--compact-md .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__content{display:none}.tedi-horizontal-stepper--compact-md .tedi-horizontal-stepper-item--selected .tedi-horizontal-stepper-item__content{display:flex}}@media(max-width:61.98rem){.tedi-horizontal-stepper--compact-lg .tedi-horizontal-stepper-item{flex:1 0 0}.tedi-horizontal-stepper--compact-lg .tedi-horizontal-stepper-item--selected{flex:0 0 auto}.tedi-horizontal-stepper--compact-lg .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__step{align-items:center;justify-content:center;width:100%}.tedi-horizontal-stepper--compact-lg .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__content{display:none}.tedi-horizontal-stepper--compact-lg .tedi-horizontal-stepper-item--selected .tedi-horizontal-stepper-item__content{display:flex}}@media(max-width:74.98rem){.tedi-horizontal-stepper--compact-xl .tedi-horizontal-stepper-item{flex:1 0 0}.tedi-horizontal-stepper--compact-xl .tedi-horizontal-stepper-item--selected{flex:0 0 auto}.tedi-horizontal-stepper--compact-xl .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__step{align-items:center;justify-content:center;width:100%}.tedi-horizontal-stepper--compact-xl .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__content{display:none}.tedi-horizontal-stepper--compact-xl .tedi-horizontal-stepper-item--selected .tedi-horizontal-stepper-item__content{display:flex}}@media(max-width:87.48rem){.tedi-horizontal-stepper--compact-xxl .tedi-horizontal-stepper-item{flex:1 0 0}.tedi-horizontal-stepper--compact-xxl .tedi-horizontal-stepper-item--selected{flex:0 0 auto}.tedi-horizontal-stepper--compact-xxl .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__step{align-items:center;justify-content:center;width:100%}.tedi-horizontal-stepper--compact-xxl .tedi-horizontal-stepper-item .tedi-horizontal-stepper-item__content{display:none}.tedi-horizontal-stepper--compact-xxl .tedi-horizontal-stepper-item--selected .tedi-horizontal-stepper-item__content{display:flex}}\n"] }]
         }], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => HorizontalStepperItemComponent), { isSignal: true }] }] } });
 
+/**
+ * A single entry in a `tedi-table-of-contents`. Its non-item content (a
+ * `tedi-link`, anchor or button) is the clickable label; nested
+ * `tedi-table-of-contents-item` children become this item's sub-items and are
+ * only revealed when the item is on the active branch.
+ */
+class TableOfContentsItemComponent {
+    /**
+     * Unique id. Required to mark the item active (via the parent's `activeId`)
+     * and to be the parent of nested items. Named `itemId` to avoid
+     * shadowing the native `id` attribute.
+     */
+    itemId = input(...(ngDevMode ? [undefined, { debugName: "itemId" }] : []));
+    /** Render a separator below the item. */
+    separator = input(false, ...(ngDevMode ? [{ debugName: "separator" }] : []));
+    root = inject(TableOfContentsComponent);
+    parent = inject(TableOfContentsItemComponent, {
+        optional: true,
+        skipSelf: true,
+    });
+    /** Direct nested items (a single level down). */
+    childItems = contentChildren(TableOfContentsItemComponent, ...(ngDevMode ? [{ debugName: "childItems" }] : []));
+    numbered = computed(() => this.root.numbered(), ...(ngDevMode ? [{ debugName: "numbered" }] : []));
+    depth = computed(() => this.parent ? this.parent.depth() + 1 : 1, ...(ngDevMode ? [{ debugName: "depth" }] : []));
+    /** CSS indent level — capped at 2, matching the design's two-level hierarchy. */
+    level = computed(() => Math.min(this.depth(), 2), ...(ngDevMode ? [{ debugName: "level" }] : []));
+    hasChildren = computed(() => this.childItems().length > 0, ...(ngDevMode ? [{ debugName: "hasChildren" }] : []));
+    isSelected = computed(() => !!this.itemId() && this.itemId() === this.root.activeId(), ...(ngDevMode ? [{ debugName: "isSelected" }] : []));
+    /** Whether the active item is this item or somewhere in its subtree. */
+    containsActive = computed(() => this.isSelected() ||
+        this.childItems().some((child) => child.containsActive()), ...(ngDevMode ? [{ debugName: "containsActive" }] : []));
+    /**
+     * Whether this item's nested group is expanded: always when the TOC is
+     * `defaultOpen`, otherwise only along the branch leading to the active item.
+     */
+    isOpen = computed(() => this.hasChildren() && (this.root.defaultOpen() || this.containsActive()), ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+    siblings = computed(() => this.parent ? this.parent.childItems() : this.root.items(), ...(ngDevMode ? [{ debugName: "siblings" }] : []));
+    index = computed(() => this.siblings().indexOf(this), ...(ngDevMode ? [{ debugName: "index" }] : []));
+    numberPrefix = computed(() => this.parent ? this.parent.numberBase() : undefined, ...(ngDevMode ? [{ debugName: "numberPrefix" }] : []));
+    /** Hierarchical number base without trailing dot, e.g. `2` or `2.1`. */
+    numberBase = computed(() => {
+        const position = this.index() + 1;
+        const prefix = this.numberPrefix();
+        return prefix ? `${prefix}.${position}` : `${position}`;
+    }, ...(ngDevMode ? [{ debugName: "numberBase" }] : []));
+    /** Rendered number — `1.` at the top level, `1.1` when nested. */
+    numberLabel = computed(() => this.numberPrefix() ? this.numberBase() : `${this.numberBase()}.`, ...(ngDevMode ? [{ debugName: "numberLabel" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TableOfContentsItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: TableOfContentsItemComponent, isStandalone: true, selector: "tedi-table-of-contents-item", inputs: { itemId: { classPropertyName: "itemId", publicName: "itemId", isSignal: true, isRequired: false, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "listitem" }, properties: { "class.tedi-table-of-contents__item--selected": "isSelected()", "attr.aria-current": "isSelected() ? 'location' : null", "attr.data-name": "'table-of-contents-item'" }, classAttribute: "tedi-table-of-contents__item" }, queries: [{ propertyName: "childItems", predicate: TableOfContentsItemComponent, isSignal: true }], ngImport: i0, template: "<span\n  class=\"tedi-table-of-contents__row\"\n  [class]=\"'tedi-table-of-contents__row--level-' + level()\"\n>\n  @if (numbered()) {\n    <span class=\"tedi-table-of-contents__number\" aria-hidden=\"true\">{{\n      numberLabel()\n    }}</span>\n  }\n  <span class=\"tedi-table-of-contents__content\">\n    <ng-content />\n  </span>\n  <ng-content select=\"[tediTocItemSuffix]\" />\n</span>\n\n@if (separator()) {\n  <div class=\"tedi-table-of-contents__separator\">\n    <tedi-separator />\n  </div>\n}\n\n@if (isOpen()) {\n  <ul class=\"tedi-table-of-contents__group\" role=\"list\">\n    <ng-content select=\"tedi-table-of-contents-item\" />\n  </ul>\n}\n", dependencies: [{ kind: "component", type: SeparatorComponent, selector: "tedi-separator", inputs: ["axis", "color", "variant", "dotSize", "dotFilled", "thickness", "spacing", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TableOfContentsItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-table-of-contents-item", standalone: true, imports: [SeparatorComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: "tedi-table-of-contents__item",
+                        role: "listitem",
+                        "[class.tedi-table-of-contents__item--selected]": "isSelected()",
+                        "[attr.aria-current]": "isSelected() ? 'location' : null",
+                        "[attr.data-name]": "'table-of-contents-item'",
+                    }, template: "<span\n  class=\"tedi-table-of-contents__row\"\n  [class]=\"'tedi-table-of-contents__row--level-' + level()\"\n>\n  @if (numbered()) {\n    <span class=\"tedi-table-of-contents__number\" aria-hidden=\"true\">{{\n      numberLabel()\n    }}</span>\n  }\n  <span class=\"tedi-table-of-contents__content\">\n    <ng-content />\n  </span>\n  <ng-content select=\"[tediTocItemSuffix]\" />\n</span>\n\n@if (separator()) {\n  <div class=\"tedi-table-of-contents__separator\">\n    <tedi-separator />\n  </div>\n}\n\n@if (isOpen()) {\n  <ul class=\"tedi-table-of-contents__group\" role=\"list\">\n    <ng-content select=\"tedi-table-of-contents-item\" />\n  </ul>\n}\n" }]
+        }], propDecorators: { itemId: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemId", required: false }] }], separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }], childItems: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => TableOfContentsItemComponent), { isSignal: true }] }] } });
+
+let nextUniqueId = 0;
+/**
+ * A navigation aid that lists the sections of a page and highlights the one the
+ * reader is on. Compose it from `tedi-table-of-contents-item` elements; nest
+ * items to build a two-level hierarchy.
+ *
+ * The active item is controlled via `activeId`: it gets the accent bar and active link colour.
+ *
+ * When `sticky` is enabled the container pins while the page scrolls. Two knobs
+ * adapt it to the surrounding layout: `stickyOffset` moves where it pins (raise
+ * it to clear a fixed header), and `stickyMaxHeight` overrides the height cap
+ * for when the TOC scrolls inside a fixed-height container rather than the window.
+ *
+ * The gap the sticky TOC leaves above the viewport bottom has no input — override
+ * the `--tedi-table-of-contents-sticky-bottom` CSS custom property (default
+ * `1.5rem`) from any ancestor when you need to clear a fixed footer.
+ */
+class TableOfContentsComponent {
+    /**
+     * Heading rendered above the list. Defaults to the localised "Table of
+     * contents" label; pass `null` (or an empty string) to render it headless —
+     * the navigation keeps an accessible name via `aria-label`.
+     */
+    heading = input(undefined, ...(ngDevMode ? [{ debugName: "heading" }] : []));
+    /**
+     * Semantic level of the heading element (`h1`–`h6`). The visual style stays
+     * h4 regardless; set this to match the surrounding page's heading outline
+     * (e.g. `h2` when the TOC follows only a page `h1`).
+     */
+    headingLevel = input("h3", ...(ngDevMode ? [{ debugName: "headingLevel" }] : []));
+    /**
+     * Visual variant:
+     * - `default` — rendered inside a bordered card.
+     * - `transparent` — no card chrome; the list sits on the page with a
+     *   continuous grey left rail.
+     */
+    variant = input("default", ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    /**
+     * Draws a divider under each item except the last — sub-items included — so the
+     * list reads as a set of separated rows.
+     * @default false
+     */
+    bordered = input(false, ...(ngDevMode ? [{ debugName: "bordered" }] : []));
+    /** Id of the currently active item. */
+    activeId = input(...(ngDevMode ? [undefined, { debugName: "activeId" }] : []));
+    /**
+     * Keep the active item visible inside the TOC's own scroll area. When the list
+     * is taller than a bounded or sticky container and `activeId` changes, the TOC
+     * scrolls its internal scroll region just enough to reveal the active item.
+     * No-op when the list isn't scrollable (short lists, unbounded layouts).
+     * @default false
+     */
+    scrollActiveIntoView = input(false, ...(ngDevMode ? [{ debugName: "scrollActiveIntoView" }] : []));
+    /**
+     * Whether nested items are expanded by default. When `true` (default) the full
+     * outline is always visible. When `false`, a branch reveals its sub-items only
+     * while it is on the active trail (the active item or one of its ancestors).
+     * @default true
+     */
+    defaultOpen = input(true, ...(ngDevMode ? [{ debugName: "defaultOpen" }] : []));
+    /** Show auto-generated hierarchical numbers (`1.`, `2.`, `2.1`, …). */
+    numbered = input(false, ...(ngDevMode ? [{ debugName: "numbered" }] : []));
+    /** Stick the container to the viewport while scrolling. */
+    sticky = input(true, ...(ngDevMode ? [{ debugName: "sticky" }] : []));
+    /**
+     * Distance from the top of the scroll container at which the sticky TOC pins,
+     * as any CSS length or expression. Raise it to clear a fixed header — e.g.
+     * `"calc(var(--layout-header-height) + 1.5rem)"`. Drives both `top` and the
+     * default `max-height`. Only applies while `sticky` is `true`.
+     * @default "1.5rem"
+     */
+    stickyOffset = input(...(ngDevMode ? [undefined, { debugName: "stickyOffset" }] : []));
+    /**
+     * Overrides the sticky height cap. The default keeps the TOC within the
+     * viewport (`calc(100dvh - offset - 1.5rem)`); set this when the TOC scrolls
+     * inside a fixed-height container rather than the window — e.g.
+     * `"calc(30rem - 3rem)"` for a 30rem scroll region. Only applies while
+     * `sticky` is `true`.
+     */
+    stickyMaxHeight = input(...(ngDevMode ? [undefined, { debugName: "stickyMaxHeight" }] : []));
+    /**
+     * Accessible name for the navigation landmark. Overrides the default, which is
+     * the heading (via `aria-labelledby`) or the localised title when headless.
+     * Useful to disambiguate multiple tables of contents on one page.
+     */
+    ariaLabel = input(...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : []));
+    translations = inject(TediTranslationService);
+    host = inject(ElementRef);
+    platformId = inject(PLATFORM_ID);
+    constructor() {
+        // Reveal the active item within the TOC's own scroll region whenever it
+        // changes. Runs after render so nested items have finished expanding.
+        afterRenderEffect(() => {
+            const activeId = this.activeId();
+            if (!this.scrollActiveIntoView() || !activeId)
+                return;
+            if (!isPlatformBrowser(this.platformId))
+                return;
+            this.revealActiveItem();
+        });
+    }
+    /** Top-level items, used by items to compute their hierarchical numbers. */
+    items = contentChildren(forwardRef(() => TableOfContentsItemComponent), ...(ngDevMode ? [{ debugName: "items" }] : []));
+    titleLabel = this.translations.track("table-of-contents.title");
+    resolvedHeading = computed(() => {
+        const heading = this.heading();
+        return heading === undefined ? this.titleLabel() : heading;
+    }, ...(ngDevMode ? [{ debugName: "resolvedHeading" }] : []));
+    navLabel = computed(() => this.ariaLabel() || this.titleLabel(), ...(ngDevMode ? [{ debugName: "navLabel" }] : []));
+    headingId = `tedi-table-of-contents-heading-${(nextUniqueId += 1)}`;
+    /** Scroll the TOC's own scroll region so the active item's row is visible. */
+    revealActiveItem() {
+        const hostEl = this.host.nativeElement;
+        const activeItem = hostEl.querySelector('[aria-current="location"]');
+        if (!activeItem)
+            return;
+        // Position by the item's own row, not the whole subtree (which may include
+        // expanded children).
+        const target = activeItem.querySelector(":scope > .tedi-table-of-contents__row") ?? activeItem;
+        const scroller = this.findScrollParent(target);
+        if (!scroller)
+            return;
+        const scrollerRect = scroller.getBoundingClientRect();
+        const targetRect = target.getBoundingClientRect();
+        const margin = 8;
+        const behavior = window.matchMedia("(prefers-reduced-motion: reduce)").matches
+            ? "auto"
+            : "smooth";
+        if (targetRect.top < scrollerRect.top + margin) {
+            scroller.scrollBy({
+                top: targetRect.top - scrollerRect.top - margin,
+                behavior,
+            });
+        }
+        else if (targetRect.bottom > scrollerRect.bottom - margin) {
+            scroller.scrollBy({
+                top: targetRect.bottom - scrollerRect.bottom + margin,
+                behavior,
+            });
+        }
+    }
+    /** Nearest scrollable ancestor within this component (e.g. the sticky `nav`). */
+    findScrollParent(el) {
+        const hostEl = this.host.nativeElement;
+        let node = el.parentElement;
+        while (node && hostEl.contains(node)) {
+            const overflowY = getComputedStyle(node).overflowY;
+            if ((overflowY === "auto" || overflowY === "scroll") &&
+                node.scrollHeight > node.clientHeight) {
+                return node;
+            }
+            node = node.parentElement;
+        }
+        return null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TableOfContentsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: TableOfContentsComponent, isStandalone: true, selector: "tedi-table-of-contents", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, activeId: { classPropertyName: "activeId", publicName: "activeId", isSignal: true, isRequired: false, transformFunction: null }, scrollActiveIntoView: { classPropertyName: "scrollActiveIntoView", publicName: "scrollActiveIntoView", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, numbered: { classPropertyName: "numbered", publicName: "numbered", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null }, stickyOffset: { classPropertyName: "stickyOffset", publicName: "stickyOffset", isSignal: true, isRequired: false, transformFunction: null }, stickyMaxHeight: { classPropertyName: "stickyMaxHeight", publicName: "stickyMaxHeight", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tedi-table-of-contents--bordered": "bordered()", "attr.data-name": "'table-of-contents'", "style.--tedi-table-of-contents-sticky-top": "stickyOffset()", "style.--tedi-table-of-contents-sticky-max-height": "stickyMaxHeight()" }, classAttribute: "tedi-table-of-contents" }, queries: [{ propertyName: "items", predicate: i0.forwardRef(() => TableOfContentsItemComponent), isSignal: true }], ngImport: i0, template: "<ng-template #inner>\n  @if (resolvedHeading()) {\n    @switch (headingLevel()) {\n      @case (\"h1\") {\n        <h1\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h1>\n      }\n      @case (\"h2\") {\n        <h2\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h2>\n      }\n      @case (\"h4\") {\n        <h4\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h4>\n      }\n      @case (\"h5\") {\n        <h5\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h5>\n      }\n      @case (\"h6\") {\n        <h6\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h6>\n      }\n      @default {\n        <h3\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h3>\n      }\n    }\n  }\n  <nav\n    [attr.aria-labelledby]=\"\n      !ariaLabel() && resolvedHeading() ? headingId : null\n    \"\n    [attr.aria-label]=\"ariaLabel() || (resolvedHeading() ? null : navLabel())\"\n  >\n    <ul\n      class=\"tedi-table-of-contents__list\"\n      role=\"list\"\n      [class.tedi-table-of-contents__list--headless]=\"!resolvedHeading()\"\n    >\n      <ng-content select=\"tedi-table-of-contents-item\" />\n    </ul>\n  </nav>\n</ng-template>\n\n@if (variant() === \"transparent\") {\n  <div\n    class=\"tedi-table-of-contents__container tedi-table-of-contents--transparent\"\n    [class.tedi-table-of-contents--sticky]=\"sticky()\"\n  >\n    <ng-container [ngTemplateOutlet]=\"inner\" />\n  </div>\n} @else {\n  <tedi-card\n    class=\"tedi-table-of-contents__container\"\n    [class.tedi-table-of-contents--sticky]=\"sticky()\"\n  >\n    <tedi-card-content [padding]=\"0\">\n      <ng-container [ngTemplateOutlet]=\"inner\" />\n    </tedi-card-content>\n  </tedi-card>\n}\n", styles: [".tedi-table-of-contents{--tedi-table-of-contents-padding: var(--card-padding-md-default);--tedi-table-of-contents-sticky-top: 1.5rem;--tedi-table-of-contents-sticky-bottom: 1.5rem;--tedi-table-of-contents-sticky-max-height: calc( 100dvh - var(--tedi-table-of-contents-sticky-top) - var(--tedi-table-of-contents-sticky-bottom) );display:block}.tedi-table-of-contents__container{display:block}.tedi-table-of-contents__container.tedi-table-of-contents--sticky{position:sticky;top:var(--tedi-table-of-contents-sticky-top);display:flex;flex-direction:column;max-height:var(--tedi-table-of-contents-sticky-max-height)}.tedi-table-of-contents--sticky>.tedi-card-content{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.tedi-table-of-contents--sticky .tedi-table-of-contents__heading{flex:none}.tedi-table-of-contents--sticky nav{flex:1 1 auto;min-height:0;margin-block:var(--card-padding-md-default);overflow-y:auto}.tedi-table-of-contents--sticky .tedi-table-of-contents__list{padding-block:0}.tedi-table-of-contents--transparent .tedi-table-of-contents__list{position:relative;padding-bottom:0;isolation:isolate}.tedi-table-of-contents--transparent .tedi-table-of-contents__list:before{position:absolute;inset-block:0;inset-inline-start:0;z-index:-1;width:var(--tedi-borders-01);content:\"\";background:var(--card-border-primary)}.tedi-table-of-contents__heading{padding:var(--card-padding-md-default) var(--card-padding-md-default) 0 var(--card-padding-md-default)}.tedi-table-of-contents__list,.tedi-table-of-contents__group{display:flex;flex-direction:column;padding:0;margin:0;list-style:none}.tedi-table-of-contents__list{padding:var(--card-padding-md-default) 0}.tedi-table-of-contents--bordered .tedi-table-of-contents__list{padding:var(--card-padding-xs) 0}.tedi-table-of-contents__list--headless{padding-top:var(--tedi-table-of-contents-padding)}.tedi-table-of-contents__item{display:flex;flex-direction:column}.tedi-table-of-contents__row{display:flex;gap:var(--layout-grid-gutters-04);align-items:center;padding-block:var(--table-of-contents-padding-y);padding-inline:var(--table-of-contents-padding-left-level-1);border-left:var(--table-of-contents-active-item-border-width) solid transparent}.tedi-table-of-contents__row--level-2{padding-right:var(--list-padding-left-level-1);padding-left:var(--list-padding-left-level-2)}.tedi-table-of-contents__number{flex-shrink:0;min-width:1.5rem;color:var(--link-primary-default);text-align:right}.tedi-table-of-contents__separator{padding-block:var(--layout-grid-gutters-04);padding-right:var(--table-of-contents-padding-left-level-1);padding-left:calc(var(--table-of-contents-padding-left-level-1) - var(--table-of-contents-active-item-border-width));border-left:var(--table-of-contents-active-item-border-width) solid transparent}.tedi-table-of-contents__content{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}.tedi-table-of-contents__suffix{flex:none}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row{border-left-color:var(--table-of-contents-border-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__number{color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button){color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button):hover{color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button):hover :not(tedi-icon){text-decoration:none}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__separator{border-left-color:var(--table-of-contents-border-active)}.tedi-table-of-contents--bordered .tedi-table-of-contents__row{border-bottom:var(--tedi-borders-01) solid var(--card-border-primary)}.tedi-table-of-contents--bordered .tedi-table-of-contents__list>.tedi-table-of-contents__item:last-child>.tedi-table-of-contents__row{border-bottom:0}.tedi-table-of-contents__bar{position:fixed;inset-inline:0;bottom:0;z-index:var(--z-index-header);display:flex;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default);background:var(--card-background-primary);border-top:var(--tedi-borders-01) solid var(--card-border-primary);border-top-left-radius:var(--card-radius-rounded);border-top-right-radius:var(--card-radius-rounded);transition:transform .3s ease}.tedi-table-of-contents__bar--static{position:static}.tedi-table-of-contents__bar--hidden{display:none}.tedi-table-of-contents__bar--tucked{transform:translateY(100%)}@media(prefers-reduced-motion:reduce){.tedi-table-of-contents__bar{transition:none}}.tedi-table-of-contents__bar-title{margin:0}.tedi-table-of-contents__sheet{--tedi-table-of-contents-padding: var(--card-padding-md-default);display:flex;flex-direction:column;max-height:80dvh}.tedi-table-of-contents__sheet-header{display:flex;flex:none;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default);border-bottom:var(--tedi-borders-01) solid var(--card-border-primary)}.tedi-table-of-contents__sheet-nav{flex:1 1 auto;min-height:0;overflow-y:auto}.tedi-table-of-contents__sheet-panel{width:100%;overflow-y:auto;background:var(--card-background-primary);border-top-left-radius:var(--modal-radius);border-top-right-radius:var(--modal-radius)}.tedi-table-of-contents__backdrop{background:var(--general-surface-overlay)}\n"], dependencies: [{ kind: "component", type: CardComponent, selector: "tedi-card", inputs: ["background", "padding", "borderRadius", "borderless", "border", "xs", "sm", "md", "lg", "xl", "xxl"] }, { kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["background", "padding", "backgroundImage", "backgroundPosition", "backgroundSize", "backgroundRepeat", "autoWidth", "xs", "sm", "md", "lg", "xl", "xxl"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TableOfContentsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-table-of-contents", standalone: true, imports: [
+                        CardComponent,
+                        CardContentComponent,
+                        TextComponent,
+                        NgTemplateOutlet,
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: "tedi-table-of-contents",
+                        "[class.tedi-table-of-contents--bordered]": "bordered()",
+                        "[attr.data-name]": "'table-of-contents'",
+                        "[style.--tedi-table-of-contents-sticky-top]": "stickyOffset()",
+                        "[style.--tedi-table-of-contents-sticky-max-height]": "stickyMaxHeight()",
+                    }, template: "<ng-template #inner>\n  @if (resolvedHeading()) {\n    @switch (headingLevel()) {\n      @case (\"h1\") {\n        <h1\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h1>\n      }\n      @case (\"h2\") {\n        <h2\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h2>\n      }\n      @case (\"h4\") {\n        <h4\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h4>\n      }\n      @case (\"h5\") {\n        <h5\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h5>\n      }\n      @case (\"h6\") {\n        <h6\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h6>\n      }\n      @default {\n        <h3\n          tedi-text\n          modifiers=\"h4\"\n          class=\"tedi-table-of-contents__heading\"\n          [id]=\"headingId\"\n        >\n          {{ resolvedHeading() }}\n        </h3>\n      }\n    }\n  }\n  <nav\n    [attr.aria-labelledby]=\"\n      !ariaLabel() && resolvedHeading() ? headingId : null\n    \"\n    [attr.aria-label]=\"ariaLabel() || (resolvedHeading() ? null : navLabel())\"\n  >\n    <ul\n      class=\"tedi-table-of-contents__list\"\n      role=\"list\"\n      [class.tedi-table-of-contents__list--headless]=\"!resolvedHeading()\"\n    >\n      <ng-content select=\"tedi-table-of-contents-item\" />\n    </ul>\n  </nav>\n</ng-template>\n\n@if (variant() === \"transparent\") {\n  <div\n    class=\"tedi-table-of-contents__container tedi-table-of-contents--transparent\"\n    [class.tedi-table-of-contents--sticky]=\"sticky()\"\n  >\n    <ng-container [ngTemplateOutlet]=\"inner\" />\n  </div>\n} @else {\n  <tedi-card\n    class=\"tedi-table-of-contents__container\"\n    [class.tedi-table-of-contents--sticky]=\"sticky()\"\n  >\n    <tedi-card-content [padding]=\"0\">\n      <ng-container [ngTemplateOutlet]=\"inner\" />\n    </tedi-card-content>\n  </tedi-card>\n}\n", styles: [".tedi-table-of-contents{--tedi-table-of-contents-padding: var(--card-padding-md-default);--tedi-table-of-contents-sticky-top: 1.5rem;--tedi-table-of-contents-sticky-bottom: 1.5rem;--tedi-table-of-contents-sticky-max-height: calc( 100dvh - var(--tedi-table-of-contents-sticky-top) - var(--tedi-table-of-contents-sticky-bottom) );display:block}.tedi-table-of-contents__container{display:block}.tedi-table-of-contents__container.tedi-table-of-contents--sticky{position:sticky;top:var(--tedi-table-of-contents-sticky-top);display:flex;flex-direction:column;max-height:var(--tedi-table-of-contents-sticky-max-height)}.tedi-table-of-contents--sticky>.tedi-card-content{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.tedi-table-of-contents--sticky .tedi-table-of-contents__heading{flex:none}.tedi-table-of-contents--sticky nav{flex:1 1 auto;min-height:0;margin-block:var(--card-padding-md-default);overflow-y:auto}.tedi-table-of-contents--sticky .tedi-table-of-contents__list{padding-block:0}.tedi-table-of-contents--transparent .tedi-table-of-contents__list{position:relative;padding-bottom:0;isolation:isolate}.tedi-table-of-contents--transparent .tedi-table-of-contents__list:before{position:absolute;inset-block:0;inset-inline-start:0;z-index:-1;width:var(--tedi-borders-01);content:\"\";background:var(--card-border-primary)}.tedi-table-of-contents__heading{padding:var(--card-padding-md-default) var(--card-padding-md-default) 0 var(--card-padding-md-default)}.tedi-table-of-contents__list,.tedi-table-of-contents__group{display:flex;flex-direction:column;padding:0;margin:0;list-style:none}.tedi-table-of-contents__list{padding:var(--card-padding-md-default) 0}.tedi-table-of-contents--bordered .tedi-table-of-contents__list{padding:var(--card-padding-xs) 0}.tedi-table-of-contents__list--headless{padding-top:var(--tedi-table-of-contents-padding)}.tedi-table-of-contents__item{display:flex;flex-direction:column}.tedi-table-of-contents__row{display:flex;gap:var(--layout-grid-gutters-04);align-items:center;padding-block:var(--table-of-contents-padding-y);padding-inline:var(--table-of-contents-padding-left-level-1);border-left:var(--table-of-contents-active-item-border-width) solid transparent}.tedi-table-of-contents__row--level-2{padding-right:var(--list-padding-left-level-1);padding-left:var(--list-padding-left-level-2)}.tedi-table-of-contents__number{flex-shrink:0;min-width:1.5rem;color:var(--link-primary-default);text-align:right}.tedi-table-of-contents__separator{padding-block:var(--layout-grid-gutters-04);padding-right:var(--table-of-contents-padding-left-level-1);padding-left:calc(var(--table-of-contents-padding-left-level-1) - var(--table-of-contents-active-item-border-width));border-left:var(--table-of-contents-active-item-border-width) solid transparent}.tedi-table-of-contents__content{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}.tedi-table-of-contents__suffix{flex:none}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row{border-left-color:var(--table-of-contents-border-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__number{color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button){color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button):hover{color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button):hover :not(tedi-icon){text-decoration:none}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__separator{border-left-color:var(--table-of-contents-border-active)}.tedi-table-of-contents--bordered .tedi-table-of-contents__row{border-bottom:var(--tedi-borders-01) solid var(--card-border-primary)}.tedi-table-of-contents--bordered .tedi-table-of-contents__list>.tedi-table-of-contents__item:last-child>.tedi-table-of-contents__row{border-bottom:0}.tedi-table-of-contents__bar{position:fixed;inset-inline:0;bottom:0;z-index:var(--z-index-header);display:flex;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default);background:var(--card-background-primary);border-top:var(--tedi-borders-01) solid var(--card-border-primary);border-top-left-radius:var(--card-radius-rounded);border-top-right-radius:var(--card-radius-rounded);transition:transform .3s ease}.tedi-table-of-contents__bar--static{position:static}.tedi-table-of-contents__bar--hidden{display:none}.tedi-table-of-contents__bar--tucked{transform:translateY(100%)}@media(prefers-reduced-motion:reduce){.tedi-table-of-contents__bar{transition:none}}.tedi-table-of-contents__bar-title{margin:0}.tedi-table-of-contents__sheet{--tedi-table-of-contents-padding: var(--card-padding-md-default);display:flex;flex-direction:column;max-height:80dvh}.tedi-table-of-contents__sheet-header{display:flex;flex:none;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default);border-bottom:var(--tedi-borders-01) solid var(--card-border-primary)}.tedi-table-of-contents__sheet-nav{flex:1 1 auto;min-height:0;overflow-y:auto}.tedi-table-of-contents__sheet-panel{width:100%;overflow-y:auto;background:var(--card-background-primary);border-top-left-radius:var(--modal-radius);border-top-right-radius:var(--modal-radius)}.tedi-table-of-contents__backdrop{background:var(--general-surface-overlay)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }], headingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingLevel", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], activeId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeId", required: false }] }], scrollActiveIntoView: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollActiveIntoView", required: false }] }], defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], numbered: [{ type: i0.Input, args: [{ isSignal: true, alias: "numbered", required: false }] }], sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }], stickyOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "stickyOffset", required: false }] }], stickyMaxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "stickyMaxHeight", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], items: [{ type: i0.ContentChildren, args: [forwardRef(() => TableOfContentsItemComponent), { isSignal: true }] }] } });
+
+/**
+ * Marks projected content as the trailing suffix of a
+ * `tedi-table-of-contents-item`. The item renders it right-aligned at the end of
+ * the row — e.g. a `tedi-tag`.
+ */
+class TableOfContentsItemSuffixDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TableOfContentsItemSuffixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.24", type: TableOfContentsItemSuffixDirective, isStandalone: true, selector: "[tediTocItemSuffix]", host: { classAttribute: "tedi-table-of-contents__suffix" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TableOfContentsItemSuffixDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[tediTocItemSuffix]",
+                    standalone: true,
+                    host: {
+                        class: "tedi-table-of-contents__suffix",
+                    },
+                }]
+        }] });
+
+/**
+ * Mobile variant of `tedi-table-of-contents`: a bottom bar that opens the list
+ * in a bottom-sheet overlay. Takes the same `tedi-table-of-contents-item`
+ * children as the desktop card; render it on small viewports.
+ *
+ * It provides itself as `TableOfContentsComponent` so the projected items
+ * resolve their context (`activeId`, `numbered`, `items`) exactly as they do
+ * inside the desktop component.
+ */
+class TableOfContentsCollapsibleComponent {
+    /**
+     * Heading shown on the bar and sheet. Defaults to the localised "Table of
+     * contents" label.
+     */
+    heading = input(undefined, ...(ngDevMode ? [{ debugName: "heading" }] : []));
+    /** Id of the currently active item. */
+    activeId = input(...(ngDevMode ? [undefined, { debugName: "activeId" }] : []));
+    /**
+     * Whether nested items are expanded by default. When `false`, a branch reveals
+     * its sub-items only while it is on the active trail. Mirrors
+     * `tedi-table-of-contents` so projected items resolve it via the shared root.
+     * @default true
+     */
+    defaultOpen = input(true, ...(ngDevMode ? [{ debugName: "defaultOpen" }] : []));
+    /** Show auto-generated hierarchical numbers (`1.`, `2.`, `2.1`, …). */
+    numbered = input(false, ...(ngDevMode ? [{ debugName: "numbered" }] : []));
+    /**
+     * Draws a divider under each item except the last — sub-items included — so the
+     * sheet's list reads as a set of separated rows. Mirrors `tedi-table-of-contents`.
+     * @default false
+     */
+    bordered = input(false, ...(ngDevMode ? [{ debugName: "bordered" }] : []));
+    /**
+     * Pin the bar to the bottom of the viewport. Set `false` to render it inline.
+     */
+    sticky = input(true, ...(ngDevMode ? [{ debugName: "sticky" }] : []));
+    /**
+     * Hide the bar while the user scrolls down and reveal it when they scroll up,
+     * keeping the reading area clear. Watches window scroll by default; set
+     * `scrollContainer` to watch a scrollable element instead.
+     * @default false
+     */
+    hideOnScroll = input(false, ...(ngDevMode ? [{ debugName: "hideOnScroll" }] : []));
+    /**
+     * Element whose scroll drives `hideOnScroll`. Defaults to the window; set it to
+     * the scrollable container when the content scrolls inside a region rather than
+     * the whole page.
+     */
+    scrollContainer = input(...(ngDevMode ? [undefined, { debugName: "scrollContainer" }] : []));
+    /**
+     * Accessible name for the sheet's navigation landmark and dialog. Defaults to
+     * the visible title.
+     */
+    ariaLabel = input(...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : []));
+    /** Top-level items, read by items to compute their hierarchical numbers. */
+    items = contentChildren(forwardRef(() => TableOfContentsItemComponent), ...(ngDevMode ? [{ debugName: "items" }] : []));
+    dialog = inject(Dialog);
+    overlay = inject(Overlay);
+    translations = inject(TediTranslationService);
+    platformId = inject(PLATFORM_ID);
+    zone = inject(NgZone);
+    sheet = viewChild.required("sheet");
+    dialogRef;
+    open = signal(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
+    /** True while the sticky bar is hidden by a scroll-down gesture. */
+    barHidden = signal(false, ...(ngDevMode ? [{ debugName: "barHidden" }] : []));
+    lastScrollY = 0;
+    ticking = false;
+    scrollTarget;
+    onScroll = () => this.handleScroll();
+    constructor() {
+        // Runs client-side only; drives the scroll-away behaviour for `hideOnScroll`.
+        afterNextRender(() => {
+            const target = this.scrollContainer() ?? window;
+            this.scrollTarget = target;
+            this.lastScrollY = this.currentScrollY();
+            // Outside Angular so scroll events don't trigger change detection; the
+            // `barHidden` signal updates the view on its own when it actually changes.
+            this.zone.runOutsideAngular(() => {
+                target.addEventListener("scroll", this.onScroll, {
+                    passive: true,
+                });
+            });
+        });
+    }
+    currentScrollY() {
+        const el = this.scrollContainer();
+        return el ? el.scrollTop : window.scrollY;
+    }
+    titleLabel = this.translations.track("table-of-contents.title");
+    openLabel = this.translations.track("open");
+    closeLabel = this.translations.track("close");
+    title = computed(() => this.heading() || this.titleLabel(), ...(ngDevMode ? [{ debugName: "title" }] : []));
+    /** Accessible name for the nav/dialog — the `ariaLabel` override or the title. */
+    navLabel = computed(() => this.ariaLabel() || this.title(), ...(ngDevMode ? [{ debugName: "navLabel" }] : []));
+    toggle(open) {
+        if (open) {
+            this.openSheet();
+        }
+        else {
+            this.close();
+        }
+    }
+    close() {
+        this.dialogRef?.close();
+    }
+    ngOnDestroy() {
+        this.close();
+        if (isPlatformBrowser(this.platformId)) {
+            this.scrollTarget?.removeEventListener("scroll", this.onScroll);
+        }
+    }
+    // Reveal on scroll up, hide on scroll down; always show near the top. Throttled
+    // to one update per frame and ignores sub-pixel jitter.
+    handleScroll() {
+        if (this.ticking)
+            return;
+        this.ticking = true;
+        requestAnimationFrame(() => {
+            this.ticking = false;
+            const currentY = this.currentScrollY();
+            if (!this.hideOnScroll()) {
+                this.barHidden.set(false);
+                this.lastScrollY = currentY;
+                return;
+            }
+            const delta = currentY - this.lastScrollY;
+            if (Math.abs(delta) < 4)
+                return;
+            this.barHidden.set(currentY > 8 && delta > 0);
+            this.lastScrollY = currentY;
+        });
+    }
+    onListClick(event) {
+        if (event.target.closest("a, button")) {
+            this.close();
+        }
+    }
+    openSheet() {
+        if (this.dialogRef)
+            return;
+        this.open.set(true);
+        this.dialogRef = this.dialog.open(this.sheet(), {
+            panelClass: "tedi-table-of-contents__sheet-panel",
+            backdropClass: "tedi-table-of-contents__backdrop",
+            hasBackdrop: true,
+            ariaModal: true,
+            ariaLabel: this.navLabel(),
+            autoFocus: "first-tabbable",
+            restoreFocus: true,
+            disableClose: true,
+            positionStrategy: this.overlay
+                .position()
+                .global()
+                .centerHorizontally()
+                .bottom("0"),
+            scrollStrategy: this.overlay.scrollStrategies.reposition(),
+        });
+        this.dialogRef.backdropClick?.subscribe(() => this.close());
+        this.dialogRef.keydownEvents?.subscribe((event) => {
+            if (event.key === "Escape")
+                this.close();
+        });
+        this.dialogRef.closed.subscribe(() => {
+            this.dialogRef = undefined;
+            this.open.set(false);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TableOfContentsCollapsibleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.24", type: TableOfContentsCollapsibleComponent, isStandalone: true, selector: "tedi-table-of-contents-collapsible", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, activeId: { classPropertyName: "activeId", publicName: "activeId", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, numbered: { classPropertyName: "numbered", publicName: "numbered", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null }, hideOnScroll: { classPropertyName: "hideOnScroll", publicName: "hideOnScroll", isSignal: true, isRequired: false, transformFunction: null }, scrollContainer: { classPropertyName: "scrollContainer", publicName: "scrollContainer", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-name": "'table-of-contents-collapsible'" }, classAttribute: "tedi-table-of-contents-collapsible" }, providers: [
+            {
+                provide: TableOfContentsComponent,
+                useExisting: forwardRef(() => TableOfContentsCollapsibleComponent),
+            },
+        ], queries: [{ propertyName: "items", predicate: i0.forwardRef(() => TableOfContentsItemComponent), isSignal: true }], viewQueries: [{ propertyName: "sheet", first: true, predicate: ["sheet"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"tedi-table-of-contents__bar\"\n  [class.tedi-table-of-contents__bar--static]=\"!sticky()\"\n  [class.tedi-table-of-contents__bar--hidden]=\"open()\"\n  [class.tedi-table-of-contents__bar--tucked]=\"barHidden()\"\n>\n  <span tedi-text modifiers=\"bold\" class=\"tedi-table-of-contents__bar-title\">\n    {{ title() }}\n  </span>\n  <button\n    tedi-collapse-button\n    aria-haspopup=\"dialog\"\n    [open]=\"open()\"\n    [openText]=\"openLabel()\"\n    [closeText]=\"closeLabel()\"\n    [underline]=\"false\"\n    (openChange)=\"toggle($event)\"\n  ></button>\n</div>\n\n<ng-template #sheet>\n  <div\n    class=\"tedi-table-of-contents tedi-table-of-contents__sheet\"\n    [class.tedi-table-of-contents--bordered]=\"bordered()\"\n  >\n    <div class=\"tedi-table-of-contents__sheet-header\">\n      <span\n        tedi-text\n        modifiers=\"bold\"\n        class=\"tedi-table-of-contents__bar-title\"\n      >\n        {{ title() }}\n      </span>\n      <button\n        tedi-collapse-button\n        [open]=\"true\"\n        [openText]=\"openLabel()\"\n        [closeText]=\"closeLabel()\"\n        [underline]=\"false\"\n        (openChange)=\"close()\"\n      ></button>\n    </div>\n    <nav\n      class=\"tedi-table-of-contents__sheet-nav\"\n      [attr.aria-label]=\"navLabel()\"\n      (click)=\"onListClick($event)\"\n    >\n      <ul\n        class=\"tedi-table-of-contents__list tedi-table-of-contents__list--headless\"\n        role=\"list\"\n      >\n        <ng-content select=\"tedi-table-of-contents-item\" />\n      </ul>\n    </nav>\n  </div>\n</ng-template>\n", styles: [".tedi-table-of-contents{--tedi-table-of-contents-padding: var(--card-padding-md-default);--tedi-table-of-contents-sticky-top: 1.5rem;--tedi-table-of-contents-sticky-bottom: 1.5rem;--tedi-table-of-contents-sticky-max-height: calc( 100dvh - var(--tedi-table-of-contents-sticky-top) - var(--tedi-table-of-contents-sticky-bottom) );display:block}.tedi-table-of-contents__container{display:block}.tedi-table-of-contents__container.tedi-table-of-contents--sticky{position:sticky;top:var(--tedi-table-of-contents-sticky-top);display:flex;flex-direction:column;max-height:var(--tedi-table-of-contents-sticky-max-height)}.tedi-table-of-contents--sticky>.tedi-card-content{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.tedi-table-of-contents--sticky .tedi-table-of-contents__heading{flex:none}.tedi-table-of-contents--sticky nav{flex:1 1 auto;min-height:0;margin-block:var(--card-padding-md-default);overflow-y:auto}.tedi-table-of-contents--sticky .tedi-table-of-contents__list{padding-block:0}.tedi-table-of-contents--transparent .tedi-table-of-contents__list{position:relative;padding-bottom:0;isolation:isolate}.tedi-table-of-contents--transparent .tedi-table-of-contents__list:before{position:absolute;inset-block:0;inset-inline-start:0;z-index:-1;width:var(--tedi-borders-01);content:\"\";background:var(--card-border-primary)}.tedi-table-of-contents__heading{padding:var(--card-padding-md-default) var(--card-padding-md-default) 0 var(--card-padding-md-default)}.tedi-table-of-contents__list,.tedi-table-of-contents__group{display:flex;flex-direction:column;padding:0;margin:0;list-style:none}.tedi-table-of-contents__list{padding:var(--card-padding-md-default) 0}.tedi-table-of-contents--bordered .tedi-table-of-contents__list{padding:var(--card-padding-xs) 0}.tedi-table-of-contents__list--headless{padding-top:var(--tedi-table-of-contents-padding)}.tedi-table-of-contents__item{display:flex;flex-direction:column}.tedi-table-of-contents__row{display:flex;gap:var(--layout-grid-gutters-04);align-items:center;padding-block:var(--table-of-contents-padding-y);padding-inline:var(--table-of-contents-padding-left-level-1);border-left:var(--table-of-contents-active-item-border-width) solid transparent}.tedi-table-of-contents__row--level-2{padding-right:var(--list-padding-left-level-1);padding-left:var(--list-padding-left-level-2)}.tedi-table-of-contents__number{flex-shrink:0;min-width:1.5rem;color:var(--link-primary-default);text-align:right}.tedi-table-of-contents__separator{padding-block:var(--layout-grid-gutters-04);padding-right:var(--table-of-contents-padding-left-level-1);padding-left:calc(var(--table-of-contents-padding-left-level-1) - var(--table-of-contents-active-item-border-width));border-left:var(--table-of-contents-active-item-border-width) solid transparent}.tedi-table-of-contents__content{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}.tedi-table-of-contents__suffix{flex:none}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row{border-left-color:var(--table-of-contents-border-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__number{color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button){color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button):hover{color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button):hover :not(tedi-icon){text-decoration:none}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__separator{border-left-color:var(--table-of-contents-border-active)}.tedi-table-of-contents--bordered .tedi-table-of-contents__row{border-bottom:var(--tedi-borders-01) solid var(--card-border-primary)}.tedi-table-of-contents--bordered .tedi-table-of-contents__list>.tedi-table-of-contents__item:last-child>.tedi-table-of-contents__row{border-bottom:0}.tedi-table-of-contents__bar{position:fixed;inset-inline:0;bottom:0;z-index:var(--z-index-header);display:flex;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default);background:var(--card-background-primary);border-top:var(--tedi-borders-01) solid var(--card-border-primary);border-top-left-radius:var(--card-radius-rounded);border-top-right-radius:var(--card-radius-rounded);transition:transform .3s ease}.tedi-table-of-contents__bar--static{position:static}.tedi-table-of-contents__bar--hidden{display:none}.tedi-table-of-contents__bar--tucked{transform:translateY(100%)}@media(prefers-reduced-motion:reduce){.tedi-table-of-contents__bar{transition:none}}.tedi-table-of-contents__bar-title{margin:0}.tedi-table-of-contents__sheet{--tedi-table-of-contents-padding: var(--card-padding-md-default);display:flex;flex-direction:column;max-height:80dvh}.tedi-table-of-contents__sheet-header{display:flex;flex:none;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default);border-bottom:var(--tedi-borders-01) solid var(--card-border-primary)}.tedi-table-of-contents__sheet-nav{flex:1 1 auto;min-height:0;overflow-y:auto}.tedi-table-of-contents__sheet-panel{width:100%;overflow-y:auto;background:var(--card-background-primary);border-top-left-radius:var(--modal-radius);border-top-right-radius:var(--modal-radius)}.tedi-table-of-contents__backdrop{background:var(--general-surface-overlay)}\n"], dependencies: [{ kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: CollapseButtonComponent, selector: "button[tedi-collapse-button]", inputs: ["open", "openText", "closeText", "hideText", "arrowType", "size", "inverted", "underline", "ariaControls", "ariaLabel", "id"], outputs: ["openChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: TableOfContentsCollapsibleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tedi-table-of-contents-collapsible", standalone: true, imports: [TextComponent, CollapseButtonComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: "tedi-table-of-contents-collapsible",
+                        "[attr.data-name]": "'table-of-contents-collapsible'",
+                    }, providers: [
+                        {
+                            provide: TableOfContentsComponent,
+                            useExisting: forwardRef(() => TableOfContentsCollapsibleComponent),
+                        },
+                    ], template: "<div\n  class=\"tedi-table-of-contents__bar\"\n  [class.tedi-table-of-contents__bar--static]=\"!sticky()\"\n  [class.tedi-table-of-contents__bar--hidden]=\"open()\"\n  [class.tedi-table-of-contents__bar--tucked]=\"barHidden()\"\n>\n  <span tedi-text modifiers=\"bold\" class=\"tedi-table-of-contents__bar-title\">\n    {{ title() }}\n  </span>\n  <button\n    tedi-collapse-button\n    aria-haspopup=\"dialog\"\n    [open]=\"open()\"\n    [openText]=\"openLabel()\"\n    [closeText]=\"closeLabel()\"\n    [underline]=\"false\"\n    (openChange)=\"toggle($event)\"\n  ></button>\n</div>\n\n<ng-template #sheet>\n  <div\n    class=\"tedi-table-of-contents tedi-table-of-contents__sheet\"\n    [class.tedi-table-of-contents--bordered]=\"bordered()\"\n  >\n    <div class=\"tedi-table-of-contents__sheet-header\">\n      <span\n        tedi-text\n        modifiers=\"bold\"\n        class=\"tedi-table-of-contents__bar-title\"\n      >\n        {{ title() }}\n      </span>\n      <button\n        tedi-collapse-button\n        [open]=\"true\"\n        [openText]=\"openLabel()\"\n        [closeText]=\"closeLabel()\"\n        [underline]=\"false\"\n        (openChange)=\"close()\"\n      ></button>\n    </div>\n    <nav\n      class=\"tedi-table-of-contents__sheet-nav\"\n      [attr.aria-label]=\"navLabel()\"\n      (click)=\"onListClick($event)\"\n    >\n      <ul\n        class=\"tedi-table-of-contents__list tedi-table-of-contents__list--headless\"\n        role=\"list\"\n      >\n        <ng-content select=\"tedi-table-of-contents-item\" />\n      </ul>\n    </nav>\n  </div>\n</ng-template>\n", styles: [".tedi-table-of-contents{--tedi-table-of-contents-padding: var(--card-padding-md-default);--tedi-table-of-contents-sticky-top: 1.5rem;--tedi-table-of-contents-sticky-bottom: 1.5rem;--tedi-table-of-contents-sticky-max-height: calc( 100dvh - var(--tedi-table-of-contents-sticky-top) - var(--tedi-table-of-contents-sticky-bottom) );display:block}.tedi-table-of-contents__container{display:block}.tedi-table-of-contents__container.tedi-table-of-contents--sticky{position:sticky;top:var(--tedi-table-of-contents-sticky-top);display:flex;flex-direction:column;max-height:var(--tedi-table-of-contents-sticky-max-height)}.tedi-table-of-contents--sticky>.tedi-card-content{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.tedi-table-of-contents--sticky .tedi-table-of-contents__heading{flex:none}.tedi-table-of-contents--sticky nav{flex:1 1 auto;min-height:0;margin-block:var(--card-padding-md-default);overflow-y:auto}.tedi-table-of-contents--sticky .tedi-table-of-contents__list{padding-block:0}.tedi-table-of-contents--transparent .tedi-table-of-contents__list{position:relative;padding-bottom:0;isolation:isolate}.tedi-table-of-contents--transparent .tedi-table-of-contents__list:before{position:absolute;inset-block:0;inset-inline-start:0;z-index:-1;width:var(--tedi-borders-01);content:\"\";background:var(--card-border-primary)}.tedi-table-of-contents__heading{padding:var(--card-padding-md-default) var(--card-padding-md-default) 0 var(--card-padding-md-default)}.tedi-table-of-contents__list,.tedi-table-of-contents__group{display:flex;flex-direction:column;padding:0;margin:0;list-style:none}.tedi-table-of-contents__list{padding:var(--card-padding-md-default) 0}.tedi-table-of-contents--bordered .tedi-table-of-contents__list{padding:var(--card-padding-xs) 0}.tedi-table-of-contents__list--headless{padding-top:var(--tedi-table-of-contents-padding)}.tedi-table-of-contents__item{display:flex;flex-direction:column}.tedi-table-of-contents__row{display:flex;gap:var(--layout-grid-gutters-04);align-items:center;padding-block:var(--table-of-contents-padding-y);padding-inline:var(--table-of-contents-padding-left-level-1);border-left:var(--table-of-contents-active-item-border-width) solid transparent}.tedi-table-of-contents__row--level-2{padding-right:var(--list-padding-left-level-1);padding-left:var(--list-padding-left-level-2)}.tedi-table-of-contents__number{flex-shrink:0;min-width:1.5rem;color:var(--link-primary-default);text-align:right}.tedi-table-of-contents__separator{padding-block:var(--layout-grid-gutters-04);padding-right:var(--table-of-contents-padding-left-level-1);padding-left:calc(var(--table-of-contents-padding-left-level-1) - var(--table-of-contents-active-item-border-width));border-left:var(--table-of-contents-active-item-border-width) solid transparent}.tedi-table-of-contents__content{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}.tedi-table-of-contents__suffix{flex:none}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row{border-left-color:var(--table-of-contents-border-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__number{color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button){color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button):hover{color:var(--link-primary-active)}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__row .tedi-table-of-contents__content :is(a,button):hover :not(tedi-icon){text-decoration:none}.tedi-table-of-contents__item--selected>.tedi-table-of-contents__separator{border-left-color:var(--table-of-contents-border-active)}.tedi-table-of-contents--bordered .tedi-table-of-contents__row{border-bottom:var(--tedi-borders-01) solid var(--card-border-primary)}.tedi-table-of-contents--bordered .tedi-table-of-contents__list>.tedi-table-of-contents__item:last-child>.tedi-table-of-contents__row{border-bottom:0}.tedi-table-of-contents__bar{position:fixed;inset-inline:0;bottom:0;z-index:var(--z-index-header);display:flex;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default);background:var(--card-background-primary);border-top:var(--tedi-borders-01) solid var(--card-border-primary);border-top-left-radius:var(--card-radius-rounded);border-top-right-radius:var(--card-radius-rounded);transition:transform .3s ease}.tedi-table-of-contents__bar--static{position:static}.tedi-table-of-contents__bar--hidden{display:none}.tedi-table-of-contents__bar--tucked{transform:translateY(100%)}@media(prefers-reduced-motion:reduce){.tedi-table-of-contents__bar{transition:none}}.tedi-table-of-contents__bar-title{margin:0}.tedi-table-of-contents__sheet{--tedi-table-of-contents-padding: var(--card-padding-md-default);display:flex;flex-direction:column;max-height:80dvh}.tedi-table-of-contents__sheet-header{display:flex;flex:none;gap:var(--layout-grid-gutters-16);align-items:center;justify-content:space-between;padding:var(--card-padding-md-default);border-bottom:var(--tedi-borders-01) solid var(--card-border-primary)}.tedi-table-of-contents__sheet-nav{flex:1 1 auto;min-height:0;overflow-y:auto}.tedi-table-of-contents__sheet-panel{width:100%;overflow-y:auto;background:var(--card-background-primary);border-top-left-radius:var(--modal-radius);border-top-right-radius:var(--modal-radius)}.tedi-table-of-contents__backdrop{background:var(--general-surface-overlay)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }], activeId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeId", required: false }] }], defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], numbered: [{ type: i0.Input, args: [{ isSignal: true, alias: "numbered", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }], hideOnScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnScroll", required: false }] }], scrollContainer: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollContainer", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], items: [{ type: i0.ContentChildren, args: [forwardRef(() => TableOfContentsItemComponent), { isSignal: true }] }], sheet: [{ type: i0.ViewChild, args: ["sheet", { isSignal: true }] }] } });
+
 /**
  * Root of the Tabs compound component. Wraps `tedi-tabs-list` and
  * `tedi-tabs-content` elements and owns the active-tab state, which the list,
@@ -23012,5 +23458,5 @@ function provideTedi(config = {}) {
  * Generated bundle index. Do not edit.
  */
 
-export { AVAILABLE_LANGUAGES, AccordionComponent, AccordionItemComponent, AccordionItemContentComponent, AccordionItemHeaderComponent, AlertComponent, AttachmentActionsComponent, AttachmentComponent, BREAKPOINTS, BaseButtonDirective, BreadcrumbItemDirective, BreadcrumbSeparatorDirective, BreadcrumbsComponent, BreakpointService, ButtonComponent, ButtonGroupButtonDirective, ButtonGroupComponent, COUNTER_TAG_WIDTH, CalendarComponent, CardButtonComponent, CardComponent, CardContentComponent, CardHeaderComponent, CardIconComponent, CardRowComponent, CarouselComponent, CarouselContentComponent, CarouselFooterComponent, CarouselHeaderComponent, CarouselIndicatorsComponent, CarouselNavigationComponent, CarouselSlideDirective, CheckboxCardComponent, CheckboxCardGroupComponent, CheckboxComponent, CheckboxGroupComponent, ClosingButtonComponent, ColComponent, CollapseButtonComponent, CollapseComponent, DROPDOWN_API, DROPDOWN_CONTENT_API, DateFieldComponent, DatePickerComponent, DropdownComponent, DropdownContentComponent, DropdownItemComponent, DropdownItemValueComponent, DropdownItemValueLabelComponent, DropdownItemValueMetaComponent, DropdownTriggerDirective, EllipsisComponent, EmptyStateComponent, FeedbackTextComponent, FilterComponent, FilterContentDirective, FilterGroupComponent, FilterPrependDirective, FloatingButtonComponent, FooterBodyComponent, FooterBottomComponent, FooterComponent, FooterSectionComponent, FooterSideComponent, FormFieldComponent, FormFieldExtraDirective, HeaderActionsComponent, HeaderBottomComponent, HeaderComponent, HeaderContentComponent, HeaderLanguageComponent, HeaderLoginComponent, HeaderLogoComponent, HeaderLogoDarkDirective, HeaderLogoutComponent, HeaderMobileButtonComponent, HeaderProfileComponent, HeaderRoleComponent, HeaderRoleContentDirective, HeaderRoleNoResultsDirective, HeaderRoleTitleDirective, HeaderSearchComponent, HeaderTopComponent, HeadingWithIconComponent, HideAtDirective, HorizontalPushHandler, HorizontalStepperComponent, HorizontalStepperItemComponent, IconComponent, InfoButtonComponent, InfoTooltipComponent, InputGroupComponent, InputGroupPrefixDirective, InputGroupSuffixDirective, LANGUAGE_COOKIE_NAME, LANGUAGE_FALLBACK_VALUE, LabelComponent, LabelRowComponent, LinkComponent, ListComponent, MODAL_DATA, MODAL_SIZE, ModalComponent, ModalContentComponent, ModalFooterComponent, ModalHeaderComponent, ModalRef, ModalService, NumberFieldComponent, PaginationComponent, PopoverComponent, PopoverContentComponent, PopoverTriggerDirective, ProgressBarComponent, RadioCardComponent, RadioCardGroupComponent, RadioComponent, RadioGroupComponent, RowComponent, ScrollFadeComponent, SearchComponent, SearchFooterActionsComponent, SearchFooterTemplateDirective, SearchSuggestionComponent, SearchSuggestionTemplateDirective, SelectComponent, SelectOptionTemplateDirective, SelectTooltipTemplateDirective, SelectValueTemplateDirective, SeparatorComponent, ShowAtDirective, SideNavComponent, SideNavDropdownComponent, SideNavDropdownGroupComponent, SideNavDropdownItemComponent, SideNavGroupTitleComponent, SideNavItemComponent, SideNavOverlayComponent, SideNavToggleComponent, SkeletonBlockComponent, SkeletonComponent, SliderComponent, SpecialOptionControls, SpinnerComponent, StatusBadgeComponent, StatusIndicatorComponent, TAG_GAP, TEDI_FIELD_CONTEXT, TEDI_FORM_FIELD_CONTROL, TEDI_INPUT_GROUP, TEDI_TABLE_CONTEXT, TEDI_THEME_DEFAULT_TOKEN, TEDI_TRANSLATION_DEFAULT_TOKEN, THEME_CLASS_PREFIX, THEME_COOKIE_NAME, THEME_FALLBACK_VALUE, TOAST_DEFAULT_DURATION, TabsComponent, TabsContentComponent, TabsListComponent, TabsTriggerComponent, TagComponent, TediPaginationResultsDirective, TediTableColumnsMenuComponent, TediTableComponent, TediTableHeaderButtonComponent, TediTableToolbarComponent, TediTranslationPipe, TediTranslationService, TextComponent, TextFieldComponent, TextGroupComponent, TextGroupLabelComponent, TextGroupValueComponent, TextareaComponent, ThemeService, TimeFieldComponent, TimePickerComponent, TimelineComponent, TimelineDescriptionComponent, TimelineItemComponent, TimelineTimingsBottomDirective, TimelineTitleComponent, ToastComponent, ToastService, ToggleComponent, TooltipComponent, TooltipContentComponent, TooltipTriggerComponent, TruncateComponent, VerticalSpacingDirective, VerticalSpacingItemDirective, addDays, addMonths, addYears, breakpointInput, buildMonthGrid, calculateArrowOffset, calculateVisibleTagCount, computeGroupSpans, controlDescribedBy, cookieSignal, createTablePersistence, deriveControlState, endOfMonth, formatDate, formatLocaleDate, formatLocaleDateHint, formatLocaleDateLong, formatMonthYear, generateUUID, getCardBorderPlacementColor, getDaysInMonth, getFirstDayOfWeek, getFocusableElements, getISOWeek, getMonthNames, getPaddingCssVariables, getPlacementFromPositionChange, getWeekdayNames, groupRowSpan, highlightParts, injectTediTableContext, isAfterDay, isBeforeDay, isDateInRange, isSameDay, isSameMonth, isSameYear, isValidTime, matchAny, matchDate, normalizeTime, parseDate, parseLocaleDate, provideTedi, resolveCardBorderRadius, startOfMonth, startOfWeek, toConnectedPositions, toggleDateInArray, usePagination };
+export { AVAILABLE_LANGUAGES, AccordionComponent, AccordionItemComponent, AccordionItemContentComponent, AccordionItemHeaderComponent, AlertComponent, AttachmentActionsComponent, AttachmentComponent, BREAKPOINTS, BaseButtonDirective, BreadcrumbItemDirective, BreadcrumbSeparatorDirective, BreadcrumbsComponent, BreakpointService, ButtonComponent, ButtonGroupButtonDirective, ButtonGroupComponent, COUNTER_TAG_WIDTH, CalendarComponent, CardButtonComponent, CardComponent, CardContentComponent, CardHeaderComponent, CardIconComponent, CardRowComponent, CarouselComponent, CarouselContentComponent, CarouselFooterComponent, CarouselHeaderComponent, CarouselIndicatorsComponent, CarouselNavigationComponent, CarouselSlideDirective, CheckboxCardComponent, CheckboxCardGroupComponent, CheckboxComponent, CheckboxGroupComponent, ClosingButtonComponent, ColComponent, CollapseButtonComponent, CollapseComponent, DROPDOWN_API, DROPDOWN_CONTENT_API, DateFieldComponent, DatePickerComponent, DropdownComponent, DropdownContentComponent, DropdownItemComponent, DropdownItemValueComponent, DropdownItemValueLabelComponent, DropdownItemValueMetaComponent, DropdownTriggerDirective, EllipsisComponent, EmptyStateComponent, FeedbackTextComponent, FilterComponent, FilterContentDirective, FilterGroupComponent, FilterPrependDirective, FloatingButtonComponent, FooterBodyComponent, FooterBottomComponent, FooterComponent, FooterSectionComponent, FooterSideComponent, FormFieldComponent, FormFieldExtraDirective, HeaderActionsComponent, HeaderBottomComponent, HeaderComponent, HeaderContentComponent, HeaderLanguageComponent, HeaderLoginComponent, HeaderLogoComponent, HeaderLogoDarkDirective, HeaderLogoutComponent, HeaderMobileButtonComponent, HeaderProfileComponent, HeaderRoleComponent, HeaderRoleContentDirective, HeaderRoleNoResultsDirective, HeaderRoleTitleDirective, HeaderSearchComponent, HeaderTopComponent, HeadingWithIconComponent, HideAtDirective, HorizontalPushHandler, HorizontalStepperComponent, HorizontalStepperItemComponent, IconComponent, InfoButtonComponent, InfoTooltipComponent, InputGroupComponent, InputGroupPrefixDirective, InputGroupSuffixDirective, LANGUAGE_COOKIE_NAME, LANGUAGE_FALLBACK_VALUE, LabelComponent, LabelRowComponent, LinkComponent, ListComponent, MODAL_DATA, MODAL_SIZE, ModalComponent, ModalContentComponent, ModalFooterComponent, ModalHeaderComponent, ModalRef, ModalService, NumberFieldComponent, PaginationComponent, PopoverComponent, PopoverContentComponent, PopoverTriggerDirective, ProgressBarComponent, RadioCardComponent, RadioCardGroupComponent, RadioComponent, RadioGroupComponent, RowComponent, ScrollFadeComponent, SearchComponent, SearchFooterActionsComponent, SearchFooterTemplateDirective, SearchSuggestionComponent, SearchSuggestionTemplateDirective, SelectComponent, SelectOptionTemplateDirective, SelectTooltipTemplateDirective, SelectValueTemplateDirective, SeparatorComponent, ShowAtDirective, SideNavComponent, SideNavDropdownComponent, SideNavDropdownGroupComponent, SideNavDropdownItemComponent, SideNavGroupTitleComponent, SideNavItemComponent, SideNavOverlayComponent, SideNavToggleComponent, SkeletonBlockComponent, SkeletonComponent, SliderComponent, SpecialOptionControls, SpinnerComponent, StatusBadgeComponent, StatusIndicatorComponent, TAG_GAP, TEDI_FIELD_CONTEXT, TEDI_FORM_FIELD_CONTROL, TEDI_INPUT_GROUP, TEDI_TABLE_CONTEXT, TEDI_THEME_DEFAULT_TOKEN, TEDI_TRANSLATION_DEFAULT_TOKEN, THEME_CLASS_PREFIX, THEME_COOKIE_NAME, THEME_FALLBACK_VALUE, TOAST_DEFAULT_DURATION, TableOfContentsCollapsibleComponent, TableOfContentsComponent, TableOfContentsItemComponent, TableOfContentsItemSuffixDirective, TabsComponent, TabsContentComponent, TabsListComponent, TabsTriggerComponent, TagComponent, TediPaginationResultsDirective, TediTableColumnsMenuComponent, TediTableComponent, TediTableHeaderButtonComponent, TediTableToolbarComponent, TediTranslationPipe, TediTranslationService, TextComponent, TextFieldComponent, TextGroupComponent, TextGroupLabelComponent, TextGroupValueComponent, TextareaComponent, ThemeService, TimeFieldComponent, TimePickerComponent, TimelineComponent, TimelineDescriptionComponent, TimelineItemComponent, TimelineTimingsBottomDirective, TimelineTitleComponent, ToastComponent, ToastService, ToggleComponent, TooltipComponent, TooltipContentComponent, TooltipTriggerComponent, TruncateComponent, VerticalSpacingDirective, VerticalSpacingItemDirective, addDays, addMonths, addYears, breakpointInput, buildMonthGrid, calculateArrowOffset, calculateVisibleTagCount, computeGroupSpans, controlDescribedBy, cookieSignal, createTablePersistence, deriveControlState, endOfMonth, formatDate, formatLocaleDate, formatLocaleDateHint, formatLocaleDateLong, formatMonthYear, generateUUID, getCardBorderPlacementColor, getDaysInMonth, getFirstDayOfWeek, getFocusableElements, getISOWeek, getMonthNames, getPaddingCssVariables, getPlacementFromPositionChange, getWeekdayNames, groupRowSpan, highlightParts, injectTediTableContext, isAfterDay, isBeforeDay, isDateInRange, isSameDay, isSameMonth, isSameYear, isValidTime, matchAny, matchDate, normalizeTime, parseDate, parseLocaleDate, provideTedi, resolveCardBorderRadius, startOfMonth, startOfWeek, toConnectedPositions, toggleDateInArray, usePagination };
 //# sourceMappingURL=tedi-design-system-angular-tedi.mjs.map