@tedi-design-system/angular 8.2.0-rc.6 → 9.0.0-rc.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tedi-design-system/angular",
-  "version": "8.2.0-rc.6",
+  "version": "9.0.0-rc.1",
   "type": "module",
   "main": "community.mjs",
   "module": "fesm2022/tedi-design-system-angular.mjs",

package/tedi/index.d.ts

@@ -2212,56 +2212,6 @@ declare class CollapseButtonComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<CollapseButtonComponent, "button[tedi-collapse-button]", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "openText": { "alias": "openText"; "required": false; "isSignal": true; }; "closeText": { "alias": "closeText"; "required": false; "isSignal": true; }; "hideText": { "alias": "hideText"; "required": false; "isSignal": true; }; "arrowType": { "alias": "arrowType"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "inverted": { "alias": "inverted"; "required": false; "isSignal": true; }; "underline": { "alias": "underline"; "required": false; "isSignal": true; }; "ariaControls": { "alias": "ariaControls"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, never, never, true, never>;
 }
 
-type ArrowType = CollapseButtonArrowType;
-type CollapseSize = CollapseButtonSize;
-declare class CollapseComponent implements AfterViewInit {
-    /**
-     * The title/header element for the collapsible section.
-     * Rendered inside the toggle button.
-     */
-    openText: _angular_core.InputSignal<string | undefined>;
-    /**
-     * Text shown on the toggle button when the content is expanded.
-     */
-    closeText: _angular_core.InputSignal<string | undefined>;
-    /**
-     * Whether the collapse should be initially open.
-     * @default false
-     */
-    defaultOpen: _angular_core.InputSignal<boolean>;
-    /**
-     * To show or hide the openText and closeText.
-     * @default "false"
-     */
-    hideCollapseText: _angular_core.InputSignal<boolean>;
-    /**
-     * Option for toggling different arrow styles.
-     * @default "default"
-     */
-    arrowType: _angular_core.InputSignal<CollapseButtonArrowType>;
-    /**
-     * Visual size of the toggle button.
-     * @default "default"
-     */
-    size: _angular_core.InputSignal<CollapseButtonSize>;
-    /**
-     * Inverted color palette — flips the link / icon colors to their
-     * inverted-surface equivalents (white text + icon), for use on top of dark
-     * backgrounds. Pairs with both the text and icon-only variants; the
-     * secondary-arrow style has no inverted form in the design and the flag is
-     * ignored when `arrowType === 'secondary'`.
-     * @default false
-     */
-    inverted: _angular_core.InputSignal<boolean>;
-    collapseContentId: string;
-    isOpen: _angular_core.WritableSignal<boolean>;
-    protected readonly isInvertedActive: _angular_core.Signal<boolean>;
-    toggleCollapse(): void;
-    ngAfterViewInit(): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CollapseComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CollapseComponent, "tedi-collapse", never, { "openText": { "alias": "openText"; "required": false; "isSignal": true; }; "closeText": { "alias": "closeText"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "hideCollapseText": { "alias": "hideCollapseText"; "required": false; "isSignal": true; }; "arrowType": { "alias": "arrowType"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "inverted": { "alias": "inverted"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
-}
-
 type ClosingButtonSize = "default" | "small";
 type ClosingButtonIconSize = 18 | 24;
 declare class ClosingButtonComponent {
@@ -2848,6 +2798,108 @@ declare class CardHeaderComponent extends CardContentComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<CardHeaderComponent, "tedi-card-header", never, {}, {}, never, ["*"], true, never>;
 }
 
+type ArrowType = CollapseButtonArrowType;
+type CollapseSize = CollapseButtonSize;
+declare class CollapseComponent implements AfterViewInit {
+    /**
+     * The title/header element for the collapsible section.
+     * Rendered inside the toggle button.
+     */
+    openText: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Text shown on the toggle button when the content is expanded.
+     */
+    closeText: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Whether the collapse should be initially open.
+     * @default false
+     */
+    defaultOpen: _angular_core.InputSignal<boolean>;
+    /**
+     * To show or hide the openText and closeText.
+     * @default "false"
+     */
+    hideCollapseText: _angular_core.InputSignal<boolean>;
+    /**
+     * Option for toggling different arrow styles.
+     * @default "default"
+     */
+    arrowType: _angular_core.InputSignal<CollapseButtonArrowType>;
+    /**
+     * Visual size of the toggle button.
+     * @default "default"
+     */
+    size: _angular_core.InputSignal<CollapseButtonSize>;
+    /**
+     * Inverted color palette — flips the link / icon colors to their
+     * inverted-surface equivalents (white text + icon), for use on top of dark
+     * backgrounds. Pairs with both the text and icon-only variants; the
+     * secondary-arrow style has no inverted form in the design and the flag is
+     * ignored when `arrowType === 'secondary'`.
+     * @default false
+     */
+    inverted: _angular_core.InputSignal<boolean>;
+    collapseContentId: string;
+    isOpen: _angular_core.WritableSignal<boolean>;
+    protected readonly isInvertedActive: _angular_core.Signal<boolean>;
+    toggleCollapse(): void;
+    ngAfterViewInit(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CollapseComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CollapseComponent, "tedi-collapse", never, { "openText": { "alias": "openText"; "required": false; "isSignal": true; }; "closeText": { "alias": "closeText"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "hideCollapseText": { "alias": "hideCollapseText"; "required": false; "isSignal": true; }; "arrowType": { "alias": "arrowType"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "inverted": { "alias": "inverted"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+type EmptyStateType = "separate" | "attached" | "inside";
+type EmptyStateSize = "default" | "small";
+/**
+ * Communicates that there is nothing to display — empty search results, an
+ * unpopulated list, a freshly-created workspace — and optionally guides the
+ * user toward the next step via action buttons or a link.
+ *
+ * Description is projected via `<ng-content>`. Actions are projected via
+ * `<ng-content select="[tedi-empty-state-actions]">`.
+ */
+declare class EmptyStateComponent {
+    /**
+     * Container variant — matches the Figma "Types" section.
+     * - `'separate'` (default) — full border + radius, stands on its own.
+     * - `'attached'` — top border omitted so the block sits flush beneath a
+     *   preceding card or table (same width + same bottom-radius).
+     * - `'inside'` — no border, no radius; intended to be placed inside another
+     *   container such as a `<tedi-card>` or `<tedi-table>`.
+     * @default separate
+     */
+    readonly type: _angular_core.InputSignal<EmptyStateType>;
+    /**
+     * Padding scale. `default` = 24px, `small` = 16px.
+     * @default default
+     */
+    readonly size: _angular_core.InputSignal<EmptyStateSize>;
+    /**
+     * Material icon name rendered above the text block. Pass `null` to hide.
+     * @default spa
+     */
+    readonly icon: _angular_core.InputSignal<string | null>;
+    /**
+     * Color of the icon. Defaults to brand so the empty state reads as a
+     * "fresh canvas" cue rather than a destructive state.
+     * @default brand
+     */
+    readonly iconColor: _angular_core.InputSignal<IconColor>;
+    /**
+     * Size of the icon, in pixels.
+     * @default 36
+     */
+    readonly iconSize: _angular_core.InputSignal<IconSize>;
+    /**
+     * Optional heading rendered above the description — appears as an `<h3>` in
+     * brand-primary text color.
+     */
+    readonly heading: _angular_core.InputSignal<string | undefined>;
+    protected readonly hostClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EmptyStateComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EmptyStateComponent, "tedi-empty-state", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconColor": { "alias": "iconColor"; "required": false; "isSignal": true; }; "iconSize": { "alias": "iconSize"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; }, {}, never, ["*", "[tedi-empty-state-actions]"], true, never>;
+}
+
 declare class HeadingWithIconComponent {
     /**
      * Name of the Material Icon
@@ -2895,6 +2947,40 @@ declare class HeadingWithIconComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<HeadingWithIconComponent, "tedi-heading-with-icon", never, { "icon": { "alias": "icon"; "required": true; "isSignal": true; }; "element": { "alias": "element"; "required": false; "isSignal": true; }; "modifiers": { "alias": "modifiers"; "required": false; "isSignal": true; }; "headingColor": { "alias": "headingColor"; "required": false; "isSignal": true; }; "iconColor": { "alias": "iconColor"; "required": false; "isSignal": true; }; "iconSize": { "alias": "iconSize"; "required": false; "isSignal": true; }; "iconVariant": { "alias": "iconVariant"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
+type LabelSize = "small" | "default";
+type LabelColor = "primary" | "secondary";
+type LabelVisuallyHidden = boolean | "reserve-space";
+declare class LabelComponent {
+    private readonly field;
+    /**
+     * Size of the label. Falls back to the size of a wrapping `tedi-form-field`,
+     * so the label and the control scale together without being set twice.
+     * @default default
+     */
+    size: _angular_core.InputSignal<LabelSize | undefined>;
+    readonly resolvedSize: _angular_core.Signal<LabelSize>;
+    /**
+     * Whether label is required.
+     * @default false
+     */
+    required: _angular_core.InputSignal<boolean>;
+    /**
+     * Color of the label.
+     * @default secondary
+     */
+    color: _angular_core.InputSignal<LabelColor>;
+    /**
+     * Hides the label visually while keeping it in the accessibility tree, so the
+     * control it names stays named. `"reserve-space"` also keeps the label's line
+     * of layout, to align the field with labelled siblings in the same row.
+     * @default false
+     */
+    visuallyHidden: _angular_core.InputSignal<LabelVisuallyHidden>;
+    classes: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LabelComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LabelComponent, "[tedi-label]", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "visuallyHidden": { "alias": "visuallyHidden"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
 type BulletColor = "primary" | "secondary" | "tertiary" | "brand" | "brand-dark" | "success" | "warning" | "warning-dark" | "danger" | "white";
 declare class ListComponent {
     /**
@@ -6277,6 +6363,23 @@ interface FormFieldControl<T = unknown> {
      * `aria-describedby`; nothing is pushed when the control stands alone.
      */
     setDescribedBy?(ids: string[]): void;
+    /**
+     * Set by controls that render their own clear button — date and time put one in
+     * their action row beside the picker button, which cannot leave the control
+     * because the overlay anchors to it. The field then skips its generic clear
+     * button so a single `clearable` never yields two.
+     */
+    readonly ownsClearButton?: boolean;
+    /**
+     * Whether the control is read-only. The field hides its clear button while it
+     * is, since the user cannot edit the value; a programmatic `reset()` still works.
+     */
+    readOnly?: Signal<boolean>;
+    /**
+     * Set to `false` by controls that never take a clear button — a textarea, per
+     * the design. The field then skips its button whatever `clearable` says.
+     */
+    readonly clearButton?: false;
 }
 /**
  * Injection token used by `tedi-form-field` to obtain
@@ -6296,6 +6399,8 @@ interface FieldContext {
     valid: Signal<boolean>;
     /** From an input group that disables everything inside it. */
     disabled: Signal<boolean>;
+    /** Whether the field shows a clear button — controls read it instead of declaring their own. */
+    clearable: Signal<boolean>;
 }
 declare const TEDI_FIELD_CONTEXT: InjectionToken<FieldContext>;
 
@@ -6381,6 +6486,12 @@ declare class DateFieldComponent implements OnInit, ControlValueAccessor, FormFi
      * set here.
      */
     readonly size: _angular_core.InputSignal<DateFieldSize | undefined>;
+    /**
+     * Whether the clear button shows once the field has a value. Falls back to the
+     * wrapping `tedi-form-field`'s `clearable` when not set here — set it on the
+     * wrapper, and use this only for a standalone field.
+     */
+    readonly clearable: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
     /**
      * Forces the error state on, or off, regardless of the reactive-forms state.
      * Leave unset to let the control derive it.
@@ -6542,6 +6653,10 @@ declare class DateFieldComponent implements OnInit, ControlValueAccessor, FormFi
     readonly valid: _angular_core.Signal<boolean>;
     readonly childContext: FieldContext;
     ngOnInit(): void;
+    /** The clear button sits in the date input's action row, beside the calendar. */
+    readonly ownsClearButton = true;
+    /** Own `clearable` wins, then the wrapping `tedi-form-field`'s. */
+    readonly clearableResolved: _angular_core.Signal<boolean>;
     readonly resolvedDisabledMatchers: _angular_core.Signal<Matcher[]>;
     readonly useNativePickerResolved: _angular_core.Signal<boolean>;
     readonly useNativePickerEffective: _angular_core.Signal<boolean>;
@@ -6616,7 +6731,7 @@ declare class DateFieldComponent implements OnInit, ControlValueAccessor, FormFi
     private toIsoDate;
     private queryNativeInput;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DateFieldComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DateFieldComponent, "tedi-date-field", never, { "inputId": { "alias": "inputId"; "required": true; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "multiRow": { "alias": "multiRow"; "required": false; "isSignal": true; }; "tagEllipsis": { "alias": "tagEllipsis"; "required": false; "isSignal": true; }; "isTagRemovable": { "alias": "isTagRemovable"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabledMatchers": { "alias": "disabledMatchers"; "required": false; "isSignal": true; }; "inputDisabled": { "alias": "inputDisabled"; "required": false; "isSignal": true; }; "readOnly": { "alias": "readOnly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "invalidInput": { "alias": "invalid"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "disablePast": { "alias": "disablePast"; "required": false; "isSignal": true; }; "disableFuture": { "alias": "disableFuture"; "required": false; "isSignal": true; }; "shouldDisableMonth": { "alias": "shouldDisableMonth"; "required": false; "isSignal": true; }; "shouldDisableYear": { "alias": "shouldDisableYear"; "required": false; "isSignal": true; }; "minYear": { "alias": "minYear"; "required": false; "isSignal": true; }; "maxYear": { "alias": "maxYear"; "required": false; "isSignal": true; }; "availableDays": { "alias": "availableDays"; "required": false; "isSignal": true; }; "unavailableDays": { "alias": "unavailableDays"; "required": false; "isSignal": true; }; "selectionLevel": { "alias": "selectionLevel"; "required": false; "isSignal": true; }; "monthYearSelectType": { "alias": "monthYearSelectType"; "required": false; "isSignal": true; }; "initialMonth": { "alias": "initialMonth"; "required": false; "isSignal": true; }; "localeCode": { "alias": "localeCode"; "required": false; "isSignal": true; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; "isSignal": true; }; "showOutsideDays": { "alias": "showOutsideDays"; "required": false; "isSignal": true; }; "showWeekNumbers": { "alias": "showWeekNumbers"; "required": false; "isSignal": true; }; "numberOfMonths": { "alias": "numberOfMonths"; "required": false; "isSignal": true; }; "enableCalendar": { "alias": "enableCalendar"; "required": false; "isSignal": true; }; "calendarTrigger": { "alias": "calendarTrigger"; "required": false; "isSignal": true; }; "useNativePicker": { "alias": "useNativePicker"; "required": false; "isSignal": true; }; "hideOnScroll": { "alias": "hideOnScroll"; "required": false; "isSignal": true; }; "modal": { "alias": "modal"; "required": false; "isSignal": true; }; "fullscreen": { "alias": "fullscreen"; "required": false; "isSignal": true; }; "formatDate": { "alias": "formatDate"; "required": false; "isSignal": true; }; "parseDate": { "alias": "parseDate"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "openChange": "openChange"; }, never, ["[tediCalendarFooter]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DateFieldComponent, "tedi-date-field", never, { "inputId": { "alias": "inputId"; "required": true; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "multiRow": { "alias": "multiRow"; "required": false; "isSignal": true; }; "tagEllipsis": { "alias": "tagEllipsis"; "required": false; "isSignal": true; }; "isTagRemovable": { "alias": "isTagRemovable"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabledMatchers": { "alias": "disabledMatchers"; "required": false; "isSignal": true; }; "inputDisabled": { "alias": "inputDisabled"; "required": false; "isSignal": true; }; "readOnly": { "alias": "readOnly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "invalidInput": { "alias": "invalid"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "disablePast": { "alias": "disablePast"; "required": false; "isSignal": true; }; "disableFuture": { "alias": "disableFuture"; "required": false; "isSignal": true; }; "shouldDisableMonth": { "alias": "shouldDisableMonth"; "required": false; "isSignal": true; }; "shouldDisableYear": { "alias": "shouldDisableYear"; "required": false; "isSignal": true; }; "minYear": { "alias": "minYear"; "required": false; "isSignal": true; }; "maxYear": { "alias": "maxYear"; "required": false; "isSignal": true; }; "availableDays": { "alias": "availableDays"; "required": false; "isSignal": true; }; "unavailableDays": { "alias": "unavailableDays"; "required": false; "isSignal": true; }; "selectionLevel": { "alias": "selectionLevel"; "required": false; "isSignal": true; }; "monthYearSelectType": { "alias": "monthYearSelectType"; "required": false; "isSignal": true; }; "initialMonth": { "alias": "initialMonth"; "required": false; "isSignal": true; }; "localeCode": { "alias": "localeCode"; "required": false; "isSignal": true; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; "isSignal": true; }; "showOutsideDays": { "alias": "showOutsideDays"; "required": false; "isSignal": true; }; "showWeekNumbers": { "alias": "showWeekNumbers"; "required": false; "isSignal": true; }; "numberOfMonths": { "alias": "numberOfMonths"; "required": false; "isSignal": true; }; "enableCalendar": { "alias": "enableCalendar"; "required": false; "isSignal": true; }; "calendarTrigger": { "alias": "calendarTrigger"; "required": false; "isSignal": true; }; "useNativePicker": { "alias": "useNativePicker"; "required": false; "isSignal": true; }; "hideOnScroll": { "alias": "hideOnScroll"; "required": false; "isSignal": true; }; "modal": { "alias": "modal"; "required": false; "isSignal": true; }; "fullscreen": { "alias": "fullscreen"; "required": false; "isSignal": true; }; "formatDate": { "alias": "formatDate"; "required": false; "isSignal": true; }; "parseDate": { "alias": "parseDate"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "openChange": "openChange"; }, never, ["[tediCalendarFooter]"], true, never>;
 }
 
 declare class DatePickerCalendarGridComponent {
@@ -6839,40 +6954,6 @@ declare class FeedbackTextComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<FeedbackTextComponent, "tedi-feedback-text", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": true; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-type LabelSize = "small" | "default";
-type LabelColor = "primary" | "secondary";
-type LabelVisuallyHidden = boolean | "reserve-space";
-declare class LabelComponent {
-    private readonly field;
-    /**
-     * Size of the label. Falls back to the size of a wrapping `tedi-form-field`,
-     * so the label and the control scale together without being set twice.
-     * @default default
-     */
-    size: _angular_core.InputSignal<LabelSize | undefined>;
-    readonly resolvedSize: _angular_core.Signal<LabelSize>;
-    /**
-     * Whether label is required.
-     * @default false
-     */
-    required: _angular_core.InputSignal<boolean>;
-    /**
-     * Color of the label.
-     * @default secondary
-     */
-    color: _angular_core.InputSignal<LabelColor>;
-    /**
-     * Hides the label visually while keeping it in the accessibility tree, so the
-     * control it names stays named. `"reserve-space"` also keeps the label's line
-     * of layout, to align the field with labelled siblings in the same row.
-     * @default false
-     */
-    visuallyHidden: _angular_core.InputSignal<LabelVisuallyHidden>;
-    classes: _angular_core.Signal<string>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LabelComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LabelComponent, "[tedi-label]", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "visuallyHidden": { "alias": "visuallyHidden"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
-}
-
 declare class LabelRowComponent {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<LabelRowComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<LabelRowComponent, "tedi-label-row", never, {}, {}, never, ["*"], true, never>;
@@ -6989,10 +7070,18 @@ declare class FormFieldComponent implements FieldContext {
      */
     icon: _angular_core.InputSignal<string | FormFieldIcon | undefined>;
     /**
-     * Whether the field shows a clear button once the control holds a value.
+     * Whether the field shows a clear button once the control holds a value. The
+     * single source of truth for every control inside it — date and time fields
+     * read it too instead of declaring their own input. A textarea never gets one.
+     * @default true
+     */
+    clearable: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Show the clear button only while the filled field is hovered or focused.
+     * Requires `clearable`.
      * @default false
      */
-    clearable: _angular_core.InputSignal<boolean>;
+    showClearOnInteraction: _angular_core.InputSignal<boolean>;
     /**
      * Custom CSS classes for the field box.
      *
@@ -7016,6 +7105,12 @@ declare class FormFieldComponent implements FieldContext {
      * itself and no box is rendered at all.
      */
     readonly hasBox: _angular_core.Signal<boolean>;
+    /**
+     * Whether the field renders its own clear button. Controls that render one
+     * themselves opt out, so `clearable` drives them without producing two, and
+     * a control that cannot be reset, or never takes one, gets none.
+     */
+    readonly renderClearButton: _angular_core.Signal<boolean>;
     readonly ownsSurface: _angular_core.Signal<boolean>;
     readonly disabled: _angular_core.Signal<boolean>;
     readonly invalid: _angular_core.Signal<boolean>;
@@ -7047,11 +7142,12 @@ declare class FormFieldComponent implements FieldContext {
         "tedi-form-field--valid": boolean;
         "tedi-form-field--invalid": boolean;
         "tedi-form-field--disabled": boolean;
+        "tedi-form-field--clear-on-interaction": boolean;
         "tedi-form-field--small": boolean;
         "tedi-form-field--large": boolean;
     }>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FormFieldComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FormFieldComponent, "tedi-form-field", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "inputClass": { "alias": "inputClass"; "required": false; "isSignal": true; }; "characterLimit": { "alias": "characterLimit"; "required": false; "isSignal": true; }; }, {}, ["control", "feedback"], ["label[tedi-label], tedi-label-row", "*", "tedi-feedback-text", "[tediFormFieldExtra]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FormFieldComponent, "tedi-form-field", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "showClearOnInteraction": { "alias": "showClearOnInteraction"; "required": false; "isSignal": true; }; "inputClass": { "alias": "inputClass"; "required": false; "isSignal": true; }; "characterLimit": { "alias": "characterLimit"; "required": false; "isSignal": true; }; }, {}, ["control", "feedback"], ["label[tedi-label], tedi-label-row", "*", "tedi-feedback-text", "[tediFormFieldExtra]"], true, never>;
 }
 
 /**
@@ -7174,6 +7270,12 @@ declare class SearchComponent<T = unknown> implements ControlValueAccessor {
      * @default true
      */
     clearable: _angular_core.InputSignal<boolean>;
+    /**
+     * Show the clear button only while the filled search field is hovered or focused.
+     * Requires `clearable`.
+     * @default false
+     */
+    showClearOnInteraction: _angular_core.InputSignal<boolean>;
     /**
      * Icon shown inside the input. Ignored when `button` is set.
      * @default "search"
@@ -7379,7 +7481,7 @@ declare class SearchComponent<T = unknown> implements ControlValueAccessor {
     private panelElement;
     private resetActiveOption;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SearchComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SearchComponent<any>, "tedi-search", never, { "inputId": { "alias": "inputId"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "searchIcon": { "alias": "searchIcon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "button": { "alias": "button"; "required": false; "isSignal": true; }; "feedbackText": { "alias": "feedbackText"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "suggestions": { "alias": "suggestions"; "required": false; "isSignal": true; }; "bindLabel": { "alias": "bindLabel"; "required": false; "isSignal": true; }; "bindDescription": { "alias": "bindDescription"; "required": false; "isSignal": true; }; "bindDisabled": { "alias": "bindDisabled"; "required": false; "isSignal": true; }; "minQueryLength": { "alias": "minQueryLength"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "hideOnScroll": { "alias": "hideOnScroll"; "required": false; "isSignal": true; }; "panelOpen": { "alias": "panelOpen"; "required": false; "isSignal": true; }; "noResultsText": { "alias": "noResultsText"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "resultsCountText": { "alias": "resultsCountText"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "panelOpen": "panelOpenChange"; "searchEvent": "searchEvent"; "clear": "clear"; "suggestionSelect": "suggestionSelect"; }, ["suggestionTemplate", "footerTemplate"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SearchComponent<any>, "tedi-search", never, { "inputId": { "alias": "inputId"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "showClearOnInteraction": { "alias": "showClearOnInteraction"; "required": false; "isSignal": true; }; "searchIcon": { "alias": "searchIcon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "button": { "alias": "button"; "required": false; "isSignal": true; }; "feedbackText": { "alias": "feedbackText"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "suggestions": { "alias": "suggestions"; "required": false; "isSignal": true; }; "bindLabel": { "alias": "bindLabel"; "required": false; "isSignal": true; }; "bindDescription": { "alias": "bindDescription"; "required": false; "isSignal": true; }; "bindDisabled": { "alias": "bindDisabled"; "required": false; "isSignal": true; }; "minQueryLength": { "alias": "minQueryLength"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "hideOnScroll": { "alias": "hideOnScroll"; "required": false; "isSignal": true; }; "panelOpen": { "alias": "panelOpen"; "required": false; "isSignal": true; }; "noResultsText": { "alias": "noResultsText"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "resultsCountText": { "alias": "resultsCountText"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "panelOpen": "panelOpenChange"; "searchEvent": "searchEvent"; "clear": "clear"; "suggestionSelect": "suggestionSelect"; }, ["suggestionTemplate", "footerTemplate"], never, true, never>;
 }
 
 declare class SearchSuggestionComponent implements Highlightable {
@@ -7594,6 +7696,12 @@ declare class SelectComponent<T = unknown> implements AfterContentChecked, After
      * @default false
      */
     clearable: _angular_core.InputSignal<boolean>;
+    /**
+     * Show the clear button only while the filled select is hovered or focused.
+     * Requires `clearable`.
+     * @default false
+     */
+    showClearOnInteraction: _angular_core.InputSignal<boolean>;
     /**
      * Element reference used to determine dropdown width.
      * When null, dropdown width matches the host element.
@@ -7963,7 +8071,7 @@ declare class SelectComponent<T = unknown> implements AfterContentChecked, After
     registerOnTouched(fn: () => void): void;
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SelectComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent<any>, "tedi-select", never, { "inputId": { "alias": "inputId"; "required": true; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "tooltip": { "alias": "tooltip"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "dropdownWidthRef": { "alias": "dropdownWidthRef"; "required": false; "isSignal": true; }; "dropdownAlign": { "alias": "dropdownAlign"; "required": false; "isSignal": true; }; "feedbackText": { "alias": "feedbackText"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "bindLabel": { "alias": "bindLabel"; "required": false; "isSignal": true; }; "bindValue": { "alias": "bindValue"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "allowMultiple": { "alias": "allowMultiple"; "required": false; "isSignal": true; }; "groupBy": { "alias": "groupBy"; "required": false; "isSignal": true; }; "showSelectAll": { "alias": "showSelectAll"; "required": false; "isSignal": true; }; "selectableGroups": { "alias": "selectableGroups"; "required": false; "isSignal": true; }; "isTagRemovable": { "alias": "isTagRemovable"; "required": false; "isSignal": true; }; "multiRow": { "alias": "multiRow"; "required": false; "isSignal": true; }; "tagEllipsis": { "alias": "tagEllipsis"; "required": false; "isSignal": true; }; "ellipsis": { "alias": "ellipsis"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "disabledKey": { "alias": "disabledKey"; "required": false; "isSignal": true; }; "noOptionsMessage": { "alias": "noOptionsMessage"; "required": false; "isSignal": true; }; "maxDropdownHeight": { "alias": "maxDropdownHeight"; "required": false; "isSignal": true; }; "hideOnScroll": { "alias": "hideOnScroll"; "required": false; "isSignal": true; }; "dropdownType": { "alias": "dropdownType"; "required": false; "isSignal": true; }; "virtualScroll": { "alias": "virtualScroll"; "required": false; "isSignal": true; }; "virtualItemSize": { "alias": "virtualItemSize"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "searchFn": { "alias": "searchFn"; "required": false; "isSignal": true; }; "clearSearchOnSelect": { "alias": "clearSearchOnSelect"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; "searchChange": "searchChange"; "opened": "opened"; "closed": "closed"; "cleared": "cleared"; }, ["optionTemplate", "valueTemplate", "tooltipTemplate"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent<any>, "tedi-select", never, { "inputId": { "alias": "inputId"; "required": true; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "tooltip": { "alias": "tooltip"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "showClearOnInteraction": { "alias": "showClearOnInteraction"; "required": false; "isSignal": true; }; "dropdownWidthRef": { "alias": "dropdownWidthRef"; "required": false; "isSignal": true; }; "dropdownAlign": { "alias": "dropdownAlign"; "required": false; "isSignal": true; }; "feedbackText": { "alias": "feedbackText"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "bindLabel": { "alias": "bindLabel"; "required": false; "isSignal": true; }; "bindValue": { "alias": "bindValue"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "allowMultiple": { "alias": "allowMultiple"; "required": false; "isSignal": true; }; "groupBy": { "alias": "groupBy"; "required": false; "isSignal": true; }; "showSelectAll": { "alias": "showSelectAll"; "required": false; "isSignal": true; }; "selectableGroups": { "alias": "selectableGroups"; "required": false; "isSignal": true; }; "isTagRemovable": { "alias": "isTagRemovable"; "required": false; "isSignal": true; }; "multiRow": { "alias": "multiRow"; "required": false; "isSignal": true; }; "tagEllipsis": { "alias": "tagEllipsis"; "required": false; "isSignal": true; }; "ellipsis": { "alias": "ellipsis"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "disabledKey": { "alias": "disabledKey"; "required": false; "isSignal": true; }; "noOptionsMessage": { "alias": "noOptionsMessage"; "required": false; "isSignal": true; }; "maxDropdownHeight": { "alias": "maxDropdownHeight"; "required": false; "isSignal": true; }; "hideOnScroll": { "alias": "hideOnScroll"; "required": false; "isSignal": true; }; "dropdownType": { "alias": "dropdownType"; "required": false; "isSignal": true; }; "virtualScroll": { "alias": "virtualScroll"; "required": false; "isSignal": true; }; "virtualItemSize": { "alias": "virtualItemSize"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "searchFn": { "alias": "searchFn"; "required": false; "isSignal": true; }; "clearSearchOnSelect": { "alias": "clearSearchOnSelect"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; "searchChange": "searchChange"; "opened": "opened"; "closed": "closed"; "cleared": "cleared"; }, ["optionTemplate", "valueTemplate", "tooltipTemplate"], never, true, never>;
 }
 
 type SliderHideLabel = boolean | "keep-space";
@@ -8299,6 +8407,9 @@ declare class TextFieldComponent implements OnInit, ControlValueAccessor, FormFi
      * Combined with the reactive-forms disabled state and any input-group state.
      */
     readonly disabledInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly readOnlyAttribute: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly readOnlyProperty: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly readOnly: _angular_core.Signal<boolean>;
     readonly disabled: _angular_core.Signal<boolean>;
     private readonly derived;
     readonly describedBy: _tedi_design_system_angular_tedi.ControlDescribedBy;
@@ -8324,7 +8435,7 @@ declare class TextFieldComponent implements OnInit, ControlValueAccessor, FormFi
     focus(): void;
     reset(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TextFieldComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextFieldComponent, "input[tedi-text-field]", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "invalidInput": { "alias": "invalid"; "required": false; "isSignal": true; }; "arrowsHidden": { "alias": "arrowsHidden"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "clear": "clear"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextFieldComponent, "input[tedi-text-field]", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "invalidInput": { "alias": "invalid"; "required": false; "isSignal": true; }; "arrowsHidden": { "alias": "arrowsHidden"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "readOnlyAttribute": { "alias": "readonly"; "required": false; "isSignal": true; }; "readOnlyProperty": { "alias": "readOnly"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "clear": "clear"; }, never, never, true, never>;
 }
 
 type TextareaSize = Exclude<InputSize, "large">;
@@ -8407,6 +8518,11 @@ declare class TextareaComponent implements OnInit, ControlValueAccessor, FormFie
      */
     readonly minHeightStyle: _angular_core.Signal<string>;
     readonly maxHeightStyle: _angular_core.Signal<string>;
+    readonly readOnlyAttribute: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly readOnlyProperty: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly readOnly: _angular_core.Signal<boolean>;
+    /** Textareas take no clear button, even inside a `clearable` form field. */
+    readonly clearButton = false;
     readonly disabled: _angular_core.Signal<boolean>;
     private readonly derived;
     readonly describedBy: _tedi_design_system_angular_tedi.ControlDescribedBy;
@@ -8429,7 +8545,7 @@ declare class TextareaComponent implements OnInit, ControlValueAccessor, FormFie
     focus(): void;
     reset(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TextareaComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextareaComponent, "textarea[tedi-textarea]", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "invalidInput": { "alias": "invalid"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "autoGrow": { "alias": "autoGrow"; "required": false; "isSignal": true; }; "minRows": { "alias": "minRows"; "required": false; "isSignal": true; }; "maxRows": { "alias": "maxRows"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextareaComponent, "textarea[tedi-textarea]", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "invalidInput": { "alias": "invalid"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "autoGrow": { "alias": "autoGrow"; "required": false; "isSignal": true; }; "minRows": { "alias": "minRows"; "required": false; "isSignal": true; }; "maxRows": { "alias": "maxRows"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "readOnlyAttribute": { "alias": "readonly"; "required": false; "isSignal": true; }; "readOnlyProperty": { "alias": "readOnly"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
 }
 
 type TimePickerVariant = "scroll" | "slots" | "dropdown";
@@ -8604,8 +8720,12 @@ declare class TimeFieldComponent implements OnInit, ControlValueAccessor, FormFi
      * set here.
      */
     readonly size: _angular_core.InputSignal<"small" | "default" | undefined>;
-    /** Show a clear button when the field has a value. */
-    readonly clearable: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether the clear button shows once the field has a value. Falls back to the
+     * wrapping `tedi-form-field`'s `clearable` when not set here — set it on the
+     * wrapper, and use this only for a standalone field.
+     */
+    readonly clearable: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
     /** Picker variant. `none` renders just the input with no picker UI — typed input is still normalized on blur. */
     readonly pickerVariant: _angular_core.InputSignal<TimeFieldPickerVariant>;
     /**
@@ -8652,6 +8772,10 @@ declare class TimeFieldComponent implements OnInit, ControlValueAccessor, FormFi
     ngOnInit(): void;
     readonly hasValue: _angular_core.Signal<boolean>;
     readonly showClear: _angular_core.Signal<boolean>;
+    /** The clear button sits in the time field's action row, beside the picker. */
+    readonly ownsClearButton = true;
+    /** Own `clearable` wins, then the wrapping `tedi-form-field`'s. */
+    readonly clearableResolved: _angular_core.Signal<boolean>;
     readonly useNativePickerResolved: _angular_core.Signal<boolean>;
     readonly hasPicker: _angular_core.Signal<boolean>;
     readonly hasNativePicker: _angular_core.Signal<boolean>;
@@ -8888,58 +9012,6 @@ declare class AttachmentActionsComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AttachmentActionsComponent, "tedi-attachment-actions", never, { "padded": { "alias": "padded"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
-type EmptyStateType = "separate" | "attached" | "inside";
-type EmptyStateSize = "default" | "small";
-/**
- * Communicates that there is nothing to display — empty search results, an
- * unpopulated list, a freshly-created workspace — and optionally guides the
- * user toward the next step via action buttons or a link.
- *
- * Description is projected via `<ng-content>`. Actions are projected via
- * `<ng-content select="[tedi-empty-state-actions]">`.
- */
-declare class EmptyStateComponent {
-    /**
-     * Container variant — matches the Figma "Types" section.
-     * - `'separate'` (default) — full border + radius, stands on its own.
-     * - `'attached'` — top border omitted so the block sits flush beneath a
-     *   preceding card or table (same width + same bottom-radius).
-     * - `'inside'` — no border, no radius; intended to be placed inside another
-     *   container such as a `<tedi-card>` or `<tedi-table>`.
-     * @default separate
-     */
-    readonly type: _angular_core.InputSignal<EmptyStateType>;
-    /**
-     * Padding scale. `default` = 24px, `small` = 16px.
-     * @default default
-     */
-    readonly size: _angular_core.InputSignal<EmptyStateSize>;
-    /**
-     * Material icon name rendered above the text block. Pass `null` to hide.
-     * @default spa
-     */
-    readonly icon: _angular_core.InputSignal<string | null>;
-    /**
-     * Color of the icon. Defaults to brand so the empty state reads as a
-     * "fresh canvas" cue rather than a destructive state.
-     * @default brand
-     */
-    readonly iconColor: _angular_core.InputSignal<IconColor>;
-    /**
-     * Size of the icon, in pixels.
-     * @default 36
-     */
-    readonly iconSize: _angular_core.InputSignal<IconSize>;
-    /**
-     * Optional heading rendered above the description — appears as an `<h3>` in
-     * brand-primary text color.
-     */
-    readonly heading: _angular_core.InputSignal<string | undefined>;
-    protected readonly hostClasses: _angular_core.Signal<string>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EmptyStateComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EmptyStateComponent, "tedi-empty-state", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconColor": { "alias": "iconColor"; "required": false; "isSignal": true; }; "iconSize": { "alias": "iconSize"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; }, {}, never, ["*", "[tedi-empty-state-actions]"], true, never>;
-}
-
 type ColWidth = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
 type JustifySelf = "start" | "end" | "center" | "stretch";
 type AlignSelf = "start" | "end" | "center" | "stretch";