@neuravision/ng-construct 0.4.2 → 0.5.0

package/types/neuravision-ng-construct.d.ts

@@ -1,8 +1,23 @@
 import * as _angular_core from '@angular/core';
-import { ElementRef, TemplateRef, OnDestroy, AfterViewInit, Signal, AfterContentInit, AfterContentChecked, PipeTransform } from '@angular/core';
-import { ControlValueAccessor } from '@angular/forms';
+import { InjectionToken, ElementRef, TemplateRef, OnDestroy, AfterViewInit, Signal, AfterContentInit, AfterContentChecked, PipeTransform } from '@angular/core';
+import * as _neuravision_ng_construct from '@neuravision/ng-construct';
+import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors } from '@angular/forms';
 
 type AfAlertVariant = 'info' | 'success' | 'warning' | 'danger';
+/** Translatable strings used by the alert component. */
+interface AfAlertI18n {
+    /** Label for the dismiss button (default: `'Dismiss alert'`). */
+    dismiss: string;
+    /** Screen-reader announcement when the alert is dismissed (default: `'Alert dismissed'`). */
+    dismissed: string;
+}
+/**
+ * Injection token to provide custom i18n strings for {@link AfAlertComponent}.
+ *
+ * @example
+ * providers: [{ provide: AF_ALERT_I18N, useValue: { dismiss: 'Schliessen', dismissed: 'Warnung geschlossen' } }]
+ */
+declare const AF_ALERT_I18N: InjectionToken<AfAlertI18n>;
 /**
  * Alert component for displaying contextual feedback messages.
  *
@@ -10,6 +25,14 @@ type AfAlertVariant = 'info' | 'success' | 'warning' | 'danger';
  * - `danger` / `warning` → `role="alert"` (assertive announcement)
  * - `info` / `success` → `role="status"` (polite announcement)
  *
+ * ### Accessibility
+ * - The dismiss button is keyboard-accessible via Tab, activated by Enter/Space (native `<button>`)
+ * - When dismissed, a screen-reader announcement is made via an `aria-live="polite"` region
+ * - The icon slot is marked `aria-hidden="true"` to prevent redundant announcements
+ * - The `aria-label` on the dismiss button is configurable via {@link AF_ALERT_I18N} for i18n
+ * - Supports `forced-colors` (Windows High Contrast) mode
+ * - Uses CSS logical properties for RTL layout support
+ *
  * @example
  * <af-alert variant="warning" [dismissible]="true" (dismissed)="onDismiss()">
  *   <span icon>⚠</span>
@@ -21,14 +44,17 @@ type AfAlertVariant = 'info' | 'success' | 'warning' | 'danger';
  * </af-alert>
  */
 declare class AfAlertComponent {
-    /** Color variant determining the alert's visual style and ARIA role */
+    protected readonly i18n: AfAlertI18n;
+    /** Color variant determining the alert's visual style and ARIA role. */
     variant: _angular_core.InputSignal<AfAlertVariant>;
-    /** Whether the alert can be dismissed by the user */
+    /** Whether the alert can be dismissed by the user. */
     dismissible: _angular_core.InputSignal<boolean>;
-    /** Emits when the user dismisses the alert */
+    /** Emits when the user dismisses the alert. */
     dismissed: _angular_core.OutputEmitterRef<void>;
-    /** Controls alert visibility */
+    /** Controls alert visibility. */
     visible: _angular_core.WritableSignal<boolean>;
+    /** @internal Screen-reader announcement text. */
+    liveAnnouncement: _angular_core.WritableSignal<string>;
     alertClasses: _angular_core.Signal<string>;
     /**
      * Maps variant to ARIA role:
@@ -36,12 +62,50 @@ declare class AfAlertComponent {
      * - info/success → 'status' (polite, non-intrusive announcement)
      */
     alertRole: _angular_core.Signal<"alert" | "status">;
-    /** Hides the alert and emits the dismissed event */
+    /** Hides the alert and emits the dismissed event. */
     dismiss(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfAlertComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfAlertComponent, "af-alert", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; }, { "dismissed": "dismissed"; }, never, ["[icon]", "[title]", "*", "[actions]"], true, never>;
 }
 
+/**
+ * Test harness for AfAlertComponent.
+ *
+ * Provides a semantic API for interacting with the alert in tests,
+ * abstracting DOM details behind readable method names.
+ *
+ * @example
+ * const harness = new AfAlertHarness(fixture.nativeElement);
+ * expect(harness.getVariant()).toBe('info');
+ * expect(harness.getRole()).toBe('status');
+ * harness.dismiss();
+ */
+declare class AfAlertHarness {
+    private readonly hostEl;
+    constructor(container: HTMLElement);
+    /** Returns the inner `.ct-alert` wrapper element, or `null` if the alert is not visible. */
+    getAlertElement(): HTMLElement | null;
+    /** Returns the `data-variant` attribute value. Throws if the alert is not visible. */
+    getVariant(): string;
+    /** Returns the ARIA `role` attribute value. Throws if the alert is not visible. */
+    getRole(): string;
+    /** Returns the full trimmed text content of the alert. Throws if not visible. */
+    getText(): string;
+    /** Returns the trimmed text content of the title slot. Throws if not visible. */
+    getTitle(): string;
+    /** Returns whether the alert is currently visible in the DOM. */
+    isVisible(): boolean;
+    /** Returns whether the alert has a dismiss button. Throws if not visible. */
+    isDismissible(): boolean;
+    /** Clicks the dismiss button. Throws if the alert is not visible or not dismissible. */
+    dismiss(): void;
+    /** Returns the dismiss button element, or `null` if not present. */
+    getDismissButton(): HTMLButtonElement | null;
+    /** Returns the `aria-live` region element for screen-reader announcements. */
+    getLiveRegion(): HTMLElement | null;
+    private requireVisible;
+}
+
 /**
  * Individual accordion item used within af-accordion.
  *
@@ -53,6 +117,8 @@ declare class AfAlertComponent {
 declare class AfAccordionItemComponent {
     private itemId;
     private accordion;
+    private announcer;
+    private i18n;
     /** Heading text displayed in the accordion trigger. */
     heading: _angular_core.InputSignal<string>;
     /** Whether this item is expanded (supports two-way binding). */
@@ -109,6 +175,69 @@ declare class AfAccordionComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfAccordionComponent, "af-accordion", never, { "multi": { "alias": "multi"; "required": false; "isSignal": true; }; "bordered": { "alias": "bordered"; "required": false; "isSignal": true; }; }, {}, ["items"], ["*"], true, never>;
 }
 
+/**
+ * Test harness for AfAccordionItemComponent.
+ *
+ * Provides a semantic API for interacting with a single accordion item,
+ * abstracting DOM details behind readable method names.
+ */
+declare class AfAccordionItemHarness {
+    private readonly hostEl;
+    constructor(hostEl: HTMLElement);
+    /** Returns the heading text. */
+    getHeading(): string;
+    /** Returns whether the item is expanded. */
+    isExpanded(): boolean;
+    /** Returns whether the item is disabled. */
+    isDisabled(): boolean;
+    /** Clicks the trigger to toggle the item. */
+    toggle(): void;
+    /** Returns the trigger (summary) element. */
+    getTriggerElement(): HTMLElement;
+    /** Returns the content panel element. */
+    getContentElement(): HTMLElement;
+    /** Returns the `aria-controls` value of the trigger. */
+    getAriaControls(): string | null;
+    /** Returns the `aria-expanded` value of the trigger. */
+    getAriaExpanded(): string | null;
+}
+/**
+ * Test harness for AfAccordionComponent.
+ *
+ * @example
+ * const harness = new AfAccordionHarness(fixture.nativeElement);
+ * expect(harness.getItems()).toHaveLength(3);
+ * harness.getItem(0).toggle();
+ */
+declare class AfAccordionHarness {
+    private readonly hostEl;
+    constructor(container: HTMLElement);
+    /** Returns harnesses for all accordion items. */
+    getItems(): AfAccordionItemHarness[];
+    /** Returns the harness for the accordion item at the given index. */
+    getItem(index: number): AfAccordionItemHarness;
+    /** Returns whether the bordered variant is applied. */
+    isBordered(): boolean;
+}
+
+/** Translatable strings used by the accordion component. */
+interface AfAccordionI18n {
+    /** Announcement when a section is expanded. Use `{heading}` as placeholder. */
+    expanded: string;
+    /** Announcement when a section is collapsed. Use `{heading}` as placeholder. */
+    collapsed: string;
+}
+/**
+ * Injection token to override accordion screen-reader announcements.
+ *
+ * @example
+ * providers: [{
+ *   provide: AF_ACCORDION_I18N,
+ *   useValue: { expanded: '{heading} ausgeklappt', collapsed: '{heading} eingeklappt' },
+ * }]
+ */
+declare const AF_ACCORDION_I18N: InjectionToken<AfAccordionI18n>;
+
 type AfShellSidebarState = 'expanded' | 'collapsed' | 'hidden';
 type AfShellPanelState = 'open' | 'closed';
 /**
@@ -324,15 +453,37 @@ type AfButtonVariant = 'primary' | 'secondary' | 'ghost' | 'outline' | 'danger'
 type AfButtonSize = 'sm' | 'md' | 'lg';
 type AfButtonType = 'button' | 'submit' | 'reset';
 /**
- * Button component from the Construct Design System
+ * Button component from the Construct Design System.
  *
- * @example
- * <af-button variant="primary" (clicked)="handleClick()">Click me</af-button>
+ * Wraps a native `<button>` element with design system tokens and
+ * variant/size modifiers.
  *
- * @example Icon-only button
+ * @example Basic usage
+ * <af-button variant="primary" (clicked)="save()">Save</af-button>
+ *
+ * @example Variants
+ * <af-button variant="secondary">Secondary</af-button>
+ * <af-button variant="ghost">Ghost</af-button>
+ * <af-button variant="outline">Outline</af-button>
+ * <af-button variant="danger">Danger</af-button>
+ * <af-button variant="accent">Accent</af-button>
+ * <af-button variant="link">Link</af-button>
+ *
+ * @example Icon-only button (ariaLabel required)
  * <af-button variant="ghost" size="sm" iconOnly ariaLabel="Delete item">
  *   <af-icon name="delete" />
  * </af-button>
+ *
+ * @example Disabled button
+ * <af-button [disabled]="true">Cannot click</af-button>
+ *
+ * @accessibility
+ * - Uses native `<button>` element — keyboard (Enter/Space) and screen reader support built-in.
+ * - Disabled state uses the native `disabled` attribute.
+ * - Icon-only buttons must provide `ariaLabel` for screen reader users.
+ *   A dev-mode warning is emitted if `ariaLabel` is missing on an icon-only button.
+ * - Focus indicator: 2px outline via `:focus-visible` (design system CSS).
+ * - Reduced motion: `transform` animation disabled via `prefers-reduced-motion`.
  */
 declare class AfButtonComponent {
     /** Button variant/style */
@@ -352,14 +503,53 @@ declare class AfButtonComponent {
     /** Click event emitter */
     clicked: _angular_core.OutputEmitterRef<MouseEvent>;
     buttonClasses: _angular_core.Signal<string>;
+    private readonly iconOnlyWarning;
     handleClick(event: MouseEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfButtonComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfButtonComponent, "af-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "iconOnly": { "alias": "iconOnly"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, ["*"], true, never>;
 }
 
+/**
+ * Test harness for AfButtonComponent.
+ *
+ * Provides a semantic API for interacting with the button in tests,
+ * abstracting DOM details behind readable method names.
+ *
+ * @example
+ * const harness = new AfButtonHarness(fixture.nativeElement);
+ * expect(harness.getText()).toBe('Save');
+ * expect(harness.isDisabled()).toBe(false);
+ * harness.click();
+ */
+declare class AfButtonHarness {
+    private readonly hostEl;
+    constructor(container: HTMLElement);
+    /** Returns the inner native `<button>` element. */
+    getButtonElement(): HTMLButtonElement;
+    /** Returns the trimmed text content of the button. */
+    getText(): string;
+    /** Returns whether the button is disabled. */
+    isDisabled(): boolean;
+    /** Clicks the inner button element. */
+    click(): void;
+    /** Returns the `aria-label` attribute value, or `null` if absent. */
+    getAriaLabel(): string | null;
+    /** Returns the `title` attribute value, or `null` if absent. */
+    getTitle(): string | null;
+    /** Returns the `type` attribute of the button. */
+    getType(): string;
+    /** Returns the full `class` attribute string of the inner button. */
+    getClasses(): string;
+    /** Returns whether the inner button has the given CSS class. */
+    hasClass(className: string): boolean;
+}
+
 type AfInputType = 'text' | 'email' | 'password' | 'number' | 'search' | 'tel' | 'url';
 /**
- * Input field component with form control support
+ * Input field component with form control support.
+ *
+ * Wraps a native `<input>` element with label, hint, error, and icon slots.
+ * Implements `ControlValueAccessor` for seamless `ngModel` and `formControl` integration.
  *
  * @example
  * <af-input
@@ -368,52 +558,132 @@ type AfInputType = 'text' | 'email' | 'password' | 'number' | 'search' | 'tel' |
  *   placeholder="name@company.com"
  *   [(ngModel)]="email"
  *   hint="We will not share this."
- * ></af-input>
+ * />
  *
  * @example
  * <af-input
  *   label="Name"
  *   [error]="nameError"
  *   required
- * ></af-input>
+ * />
  */
 declare class AfInputComponent implements ControlValueAccessor {
     private static nextId;
-    /** Input label */
+    readonly i18n: _neuravision_ng_construct.AfInputI18n;
+    /** Input label. */
     label: _angular_core.InputSignal<string>;
-    /** Input type */
+    /** Input type. */
     type: _angular_core.InputSignal<AfInputType>;
-    /** Placeholder text */
+    /** Placeholder text. */
     placeholder: _angular_core.InputSignal<string>;
-    /** Hint text shown below input */
+    /** Hint text shown below input. */
     hint: _angular_core.InputSignal<string>;
-    /** Error message - shows error state and message */
+    /** Error message — shows error state and message. */
     error: _angular_core.InputSignal<string>;
-    /** Whether input is required */
-    required: _angular_core.InputSignal<boolean>;
-    /** Whether input is disabled */
+    /** Whether input is required. */
+    required: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Whether input is disabled. */
     disabled: _angular_core.ModelSignal<boolean>;
-    /** Icon position (if icon content is projected) */
+    /** Icon position (if icon content is projected). */
     iconPosition: _angular_core.InputSignal<"left" | "right" | null>;
-    /** Unique input ID */
+    /** Unique input ID. */
     inputId: _angular_core.InputSignal<string>;
-    value: string;
+    /** @docs-private — internal form value managed by CVA. */
+    readonly value: _angular_core.WritableSignal<string>;
     onChange: (value: string) => void;
     onTouched: () => void;
+    /** Computed hint element ID. */
     hintId: _angular_core.Signal<string>;
+    /** Computed error element ID. */
     errorId: _angular_core.Signal<string>;
+    /** Computed CSS classes for the inner input. */
     inputClasses: _angular_core.Signal<string>;
-    getAriaDescribedBy(): string | null;
+    /** Computed `aria-describedby` value linking to hint or error. */
+    ariaDescribedBy: _angular_core.Signal<string | null>;
     onInput(event: Event): void;
-    /** ControlValueAccessor implementation */
+    /** @docs-private */
     writeValue(value: string): void;
+    /** @docs-private */
     registerOnChange(fn: (value: string) => void): void;
+    /** @docs-private */
     registerOnTouched(fn: () => void): void;
+    /** @docs-private */
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfInputComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfInputComponent, "af-input", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "iconPosition": { "alias": "iconPosition"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; }, never, ["[icon]", "[icon]"], true, never>;
 }
 
+/**
+ * Test harness for AfInputComponent.
+ *
+ * Provides a semantic API for interacting with the input in tests,
+ * abstracting DOM details behind readable method names.
+ *
+ * @example
+ * const harness = new AfInputHarness(fixture.nativeElement);
+ * expect(harness.getValue()).toBe('');
+ * harness.setValue('hello');
+ * expect(harness.getValue()).toBe('hello');
+ */
+declare class AfInputHarness {
+    private readonly hostEl;
+    constructor(container: HTMLElement);
+    /** Returns the inner native `<input>` element. */
+    getInputElement(): HTMLInputElement;
+    /** Returns the current value of the input. */
+    getValue(): string;
+    /** Sets the input value and dispatches an `input` event. */
+    setValue(value: string): void;
+    /** Returns the label text, or `null` if no label is rendered. */
+    getLabel(): string | null;
+    /** Returns the hint text, or `null` if no hint is rendered. */
+    getHint(): string | null;
+    /** Returns the error text, or `null` if no error is rendered. */
+    getError(): string | null;
+    /** Returns whether the input is disabled. */
+    isDisabled(): boolean;
+    /** Returns whether the input is required. */
+    isRequired(): boolean;
+    /** Returns whether `aria-invalid` is set to `"true"`. */
+    isInvalid(): boolean;
+    /** Returns the `type` attribute of the input. */
+    getType(): string;
+    /** Returns the `placeholder` attribute of the input. */
+    getPlaceholder(): string;
+    /** Returns the `aria-describedby` attribute value, or `null` if absent. */
+    getAriaDescribedBy(): string | null;
+    /** Focuses the input element. */
+    focus(): void;
+    /** Blurs the input element and dispatches a `blur` event. */
+    blur(): void;
+    /** Returns the `id` attribute of the input. */
+    getId(): string;
+    /** Returns whether the field wrapper has the error modifier class. */
+    hasFieldError(): boolean;
+    /** Returns whether an icon wrapper is rendered. */
+    hasIcon(): boolean;
+    /** Returns the full `class` attribute string of the inner input. */
+    getClasses(): string;
+    /** Returns whether the inner input has the given CSS class. */
+    hasClass(className: string): boolean;
+}
+
+/** Translatable strings used by the input component. */
+interface AfInputI18n {
+    /** Screen-reader label for the required indicator. */
+    required: string;
+}
+/**
+ * Injection token to override input screen-reader announcements.
+ *
+ * @example
+ * providers: [{
+ *   provide: AF_INPUT_I18N,
+ *   useValue: { required: 'Pflichtfeld' },
+ * }]
+ */
+declare const AF_INPUT_I18N: InjectionToken<AfInputI18n>;
+
 interface AfSelectOption {
     value: unknown;
     label: string;
@@ -1149,77 +1419,226 @@ declare class AfBreadcrumbsComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfBreadcrumbsComponent, "af-breadcrumbs", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/** Supported calendar views */
+type AfDatepickerView = 'days' | 'months' | 'years';
+/** Selection mode */
+type AfDatepickerMode = 'single' | 'range';
+/** Value format emitted by ControlValueAccessor */
+type AfDatepickerValueFormat = 'date' | 'iso';
+/** Date range value for range mode */
+interface AfDateRange {
+    start: Date | null;
+    end: Date | null;
+}
 interface CalendarDay {
     date: Date;
     isCurrentMonth: boolean;
     isToday: boolean;
     isSelected: boolean;
+    isDisabled: boolean;
+    isUnavailable: boolean;
+    isInRange: boolean;
+    isRangeStart: boolean;
+    isRangeEnd: boolean;
+}
+interface MonthItem {
+    index: number;
+    label: string;
+    shortLabel: string;
+    isSelected: boolean;
+    isDisabled: boolean;
+}
+interface YearItem {
+    value: number;
+    isSelected: boolean;
+    isDisabled: boolean;
 }
 /**
- * Datepicker component with calendar popup
+ * Datepicker component with calendar popup, month/year views, range selection,
+ * min/max constraints, disabled dates, and full keyboard navigation.
+ *
+ * Implements WAI-ARIA Date Picker Dialog pattern with roving tabindex.
  *
  * @example
  * <af-datepicker
- *   label="Select date"
+ *   label="Start date"
  *   placeholder="Pick a date"
- *   [(ngModel)]="selectedDate">
- * </af-datepicker>
+ *   [(ngModel)]="selectedDate"
+ *   [min]="minDate"
+ *   [max]="maxDate"
+ *   hint="Choose a date within the project timeline"
+ * />
+ *
+ * @example
+ * <af-datepicker
+ *   label="Period"
+ *   mode="range"
+ *   [(ngModel)]="dateRange"
+ *   valueFormat="iso"
+ * />
  */
-declare class AfDatepickerComponent implements ControlValueAccessor {
+declare class AfDatepickerComponent implements ControlValueAccessor, Validator {
     private static nextId;
-    /** Input label */
+    /** Field label */
     label: _angular_core.InputSignal<string>;
-    /** Placeholder text */
+    /** Input placeholder text */
     placeholder: _angular_core.InputSignal<string>;
-    /** Whether datepicker is disabled */
+    /** Whether the datepicker is disabled */
     disabled: _angular_core.ModelSignal<boolean>;
-    /** Date format for display */
+    /** Display format for the selected date */
     dateFormat: _angular_core.InputSignal<string>;
-    /** Unique input ID */
+    /** Unique ID for the input element */
     inputId: _angular_core.InputSignal<string>;
-    /** Selected date change event */
+    /** Minimum selectable date */
+    min: _angular_core.InputSignal<string | Date | null>;
+    /** Maximum selectable date */
+    max: _angular_core.InputSignal<string | Date | null>;
+    /** Array of specific dates that cannot be selected */
+    disabledDates: _angular_core.InputSignal<Date[]>;
+    /**
+     * Predicate function to determine if a date is selectable.
+     * Return `true` to allow selection, `false` to disable.
+     */
+    dateFilter: _angular_core.InputSignal<((date: Date) => boolean) | null>;
+    /** Hint text displayed below the input */
+    hint: _angular_core.InputSignal<string>;
+    /** Error message — displays error state and message */
+    error: _angular_core.InputSignal<string>;
+    /** Whether the field is required */
+    required: _angular_core.InputSignal<boolean>;
+    /** Selection mode: single date or date range */
+    mode: _angular_core.InputSignal<AfDatepickerMode>;
+    /**
+     * Value format for ControlValueAccessor.
+     * `'date'` emits `Date` objects, `'iso'` emits ISO date strings (`yyyy-MM-dd`).
+     */
+    valueFormat: _angular_core.InputSignal<AfDatepickerValueFormat>;
+    /** Emitted when a single date is selected */
     dateChange: _angular_core.OutputEmitterRef<Date>;
+    /** Emitted when a date range is selected (range mode only) */
+    rangeChange: _angular_core.OutputEmitterRef<AfDateRange>;
     inputRef: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
     popoverRef: _angular_core.Signal<ElementRef<HTMLDivElement> | undefined>;
     weekdayLabels: string[];
-    monthNames: string[];
+    weekdayFullLabels: string[];
     selectedDate: _angular_core.WritableSignal<Date | null>;
+    rangeStart: _angular_core.WritableSignal<Date | null>;
+    rangeEnd: _angular_core.WritableSignal<Date | null>;
+    rangeSelecting: _angular_core.WritableSignal<boolean>;
     currentMonth: _angular_core.WritableSignal<number>;
     currentYear: _angular_core.WritableSignal<number>;
     isOpen: _angular_core.WritableSignal<boolean>;
     focusedDate: _angular_core.WritableSignal<Date | null>;
-    onChange: (value: Date | null) => void;
+    currentView: _angular_core.WritableSignal<AfDatepickerView>;
+    focusedMonth: _angular_core.WritableSignal<number>;
+    focusedYear: _angular_core.WritableSignal<number>;
+    yearPageStart: _angular_core.WritableSignal<number>;
+    onChange: (value: unknown) => void;
     onTouched: () => void;
-    calendarDays: _angular_core.Signal<CalendarDay[]>;
-    formattedDate: _angular_core.Signal<string>;
+    private onValidatorChange;
+    parsedMin: _angular_core.Signal<Date | null>;
+    parsedMax: _angular_core.Signal<Date | null>;
     popoverId: _angular_core.Signal<string>;
+    hintId: _angular_core.Signal<string>;
+    errorId: _angular_core.Signal<string>;
+    ariaDescribedBy: _angular_core.Signal<string | null>;
+    dialogAriaLabel: _angular_core.Signal<"Choose date range" | "Choose date">;
+    headerTitle: _angular_core.Signal<string>;
+    titleAriaLabel: _angular_core.Signal<"Switch to month view" | "Switch to year view" | null>;
+    prevButtonAriaLabel: _angular_core.Signal<"Previous month" | "Previous year" | "Previous 12 years">;
+    nextButtonAriaLabel: _angular_core.Signal<"Next month" | "Next year" | "Next 12 years">;
+    gridAriaLabel: _angular_core.Signal<string>;
+    hasClearableValue: _angular_core.Signal<boolean>;
+    formattedValue: _angular_core.Signal<string>;
+    isTodayDisabled: _angular_core.Signal<boolean>;
+    calendarDays: _angular_core.Signal<CalendarDay[]>;
+    monthItems: _angular_core.Signal<MonthItem[]>;
+    yearItems: _angular_core.Signal<YearItem[]>;
     toggle(): void;
-    selectDate(date: Date): void;
-    previousMonth(): void;
-    nextMonth(): void;
-    private generateCalendarDays;
+    /** Opens the calendar popover */
+    open(): void;
+    /** Closes the calendar popover */
+    close(returnFocus?: boolean): void;
+    /** Handles click on a calendar day */
+    onDayClick(day: CalendarDay): void;
+    /** Selects a single date and closes the popover */
+    selectSingleDate(date: Date): void;
+    /** Handles range date selection (two-click: start then end) */
+    selectRangeDate(date: Date): void;
+    /** Navigates to today and selects it (single mode) or focuses it */
+    goToToday(): void;
+    /** Clears the selected value */
+    clearValue(event: Event): void;
+    /** Drills up: days -> months -> years */
+    drillUp(): void;
+    /** Navigates to previous period based on current view */
+    navigatePrevious(): void;
+    /** Navigates to next period based on current view */
+    navigateNext(): void;
+    /** Selects a month from the month view and switches to days */
+    selectMonth(monthIndex: number): void;
+    /** Selects a year from the year view and switches to months */
+    selectYear(year: number): void;
+    /** Returns true if the given day matches the keyboard-focused date */
+    isDayHighlighted(day: CalendarDay): boolean;
+    /** Returns the tabindex for a day button (roving tabindex pattern) */
     getDayTabIndex(day: CalendarDay): number;
+    /** Returns true if the given month index matches the keyboard-focused month */
+    isMonthHighlighted(monthIndex: number): boolean;
+    /** Returns the tabindex for a month button */
+    getMonthTabIndex(monthIndex: number): number;
+    /** Returns true if the given year matches the keyboard-focused year */
+    isYearHighlighted(year: number): boolean;
+    /** Returns the tabindex for a year button */
+    getYearTabIndex(year: number): number;
+    /** Returns a date key string for DOM identification */
     getDateKey(date: Date): string;
     onInputKeydown(event: KeyboardEvent): void;
-    onGridKeydown(event: KeyboardEvent): void;
-    onEscape(): void;
+    /** Keyboard navigation within the day grid */
+    onDayGridKeydown(event: KeyboardEvent): void;
+    /** Keyboard navigation within the month grid */
+    onMonthGridKeydown(event: KeyboardEvent): void;
+    /** Keyboard navigation within the year grid */
+    onYearGridKeydown(event: KeyboardEvent): void;
     onDocumentClick(event: MouseEvent): void;
-    private open;
-    private close;
+    writeValue(value: unknown): void;
+    registerOnChange(fn: (value: unknown) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    validate(control: AbstractControl): ValidationErrors | null;
+    registerOnValidatorChange(fn: () => void): void;
+    private writeSingleValue;
+    private writeRangeValue;
+    private emitSingleValue;
+    private emitRangeValue;
+    private validateSingle;
+    private validateRange;
+    private buildDay;
+    /** Checks whether a date falls outside min/max bounds */
+    isDateDisabled(date: Date): boolean;
+    /** Checks whether a date is explicitly unavailable (disabledDates or dateFilter) */
+    private isDateUnavailable;
+    private isMonthDisabled;
+    private isYearDisabled;
     private setFocusedDate;
     private focusDayButton;
+    private focusMonthButton;
+    private focusYearButton;
+    /** Finds the next non-disabled date in the given direction */
+    private findNextEnabledDate;
+    private shiftMonth;
     private addDays;
     private addMonths;
+    private addYears;
     private getWeekdayIndex;
-    private shiftMonth;
     private isSameDay;
+    private compareDays;
+    private parseDate;
+    private coerceToDate;
+    private toIsoString;
     private formatDate;
-    writeValue(value: Date | null): void;
-    registerOnChange(fn: (value: Date | null) => void): void;
-    registerOnTouched(fn: () => void): void;
-    setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfDatepickerComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfDatepickerComponent, "af-datepicker", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "dateFormat": { "alias": "dateFormat"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "dateChange": "dateChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfDatepickerComponent, "af-datepicker", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "dateFormat": { "alias": "dateFormat"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "disabledDates": { "alias": "disabledDates"; "required": false; "isSignal": true; }; "dateFilter": { "alias": "dateFilter"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "valueFormat": { "alias": "valueFormat"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "dateChange": "dateChange"; "rangeChange": "rangeChange"; }, never, never, true, never>;
 }
 
 type AfChipVariant = 'default' | 'info' | 'success' | 'warning' | 'danger';
@@ -1394,24 +1813,80 @@ declare class AfTooltipDirective implements OnDestroy {
 
 type AfBadgeVariant = 'default' | 'info' | 'success' | 'warning' | 'danger';
 /**
- * Badge component for status indicators
+ * Badge component for status indicators, labels, and counts.
  *
- * @example
- * <af-badge variant="success" icon="+">Approved</af-badge>
- * <af-badge variant="danger">Blocked</af-badge>
+ * Wraps the Construct Design System `ct-badge` with semantic color
+ * variants and optional icon or dot indicators.
+ *
+ * @example Basic usage
+ * <af-badge variant="success">Approved</af-badge>
+ *
+ * @example With icon
+ * <af-badge variant="danger" icon="+">Blocked</af-badge>
+ *
+ * @example With dot indicator
+ * <af-badge variant="info" dot>Online</af-badge>
+ *
+ * @example Status badge for screen readers
+ * <af-badge variant="warning" role="status" ariaLabel="Build status: failing">
+ *   Failing
+ * </af-badge>
+ *
+ * @accessibility
+ * - Non-interactive element — no keyboard navigation required.
+ * - Decorative elements (icon, dot) are hidden from screen readers via `aria-hidden`.
+ * - Use `ariaLabel` when the badge has no visible text or when the visual content
+ *   alone does not convey the full meaning.
+ * - Set `role="status"` when the badge reflects a live value that screen readers
+ *   should announce on change.
  */
 declare class AfBadgeComponent {
+    /** ARIA role, e.g. `"status"` for live status badges. */
+    role: _angular_core.InputSignal<string>;
     /** Accessible label, useful when the badge has no visible text. */
     ariaLabel: _angular_core.InputSignal<string>;
-    /** Color variant. */
+    /** Semantic color variant. */
     variant: _angular_core.InputSignal<AfBadgeVariant>;
-    /** Icon character to display */
+    /** Icon character to display before the label. */
     icon: _angular_core.InputSignal<string>;
-    /** Show a dot indicator instead of icon */
-    dot: _angular_core.InputSignal<boolean>;
+    /** Show a dot indicator instead of an icon. */
+    dot: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Computed CSS classes combining base class and variant/icon modifiers. */
     badgeClasses: _angular_core.Signal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfBadgeComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfBadgeComponent, "af-badge", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "dot": { "alias": "dot"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfBadgeComponent, "af-badge", never, { "role": { "alias": "role"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "dot": { "alias": "dot"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Test harness for AfBadgeComponent.
+ *
+ * Provides a semantic API for querying badge state in tests,
+ * abstracting DOM details behind readable method names.
+ *
+ * @example
+ * const harness = new AfBadgeHarness(fixture.nativeElement);
+ * expect(harness.getText()).toBe('Approved');
+ * expect(harness.hasClass('ct-badge--success')).toBe(true);
+ */
+declare class AfBadgeHarness {
+    private readonly hostEl;
+    constructor(container: HTMLElement);
+    /** Returns the trimmed text content of the badge (projected content only). */
+    getText(): string;
+    /** Returns the full `class` attribute string of the host element. */
+    getClasses(): string;
+    /** Returns whether the host element has the given CSS class. */
+    hasClass(className: string): boolean;
+    /** Returns the `aria-label` attribute value, or `null` if absent. */
+    getAriaLabel(): string | null;
+    /** Returns the `role` attribute value, or `null` if absent. */
+    getRole(): string | null;
+    /** Returns whether the badge contains an icon element. */
+    hasIcon(): boolean;
+    /** Returns whether the badge contains a dot indicator. */
+    hasDot(): boolean;
+    /** Returns the text content of the icon element, or empty string if absent. */
+    getIconText(): string;
 }
 
 type AfProgressBarVariant = 'default' | 'info' | 'success' | 'warning' | 'danger';
@@ -1915,9 +2390,22 @@ interface AfSelectMenuOption {
  *   [multiple]="true"
  *   [formControl]="rolesControl">
  * </af-select-menu>
+ *
+ * @accessibility
+ * - Implements the WAI-ARIA Listbox pattern with a combobox trigger.
+ * - Keyboard: ArrowDown/Up to move highlight, Enter/Space to select,
+ *   Escape to close, Home/End to jump, Tab to select-and-close (single) or close (multi).
+ * - Focus stays on the combobox trigger; `aria-activedescendant` tracks the highlighted option.
+ * - Screen-reader announcements via {@link AriaLiveAnnouncer} for open/close/selection changes.
+ * - All user-facing strings are configurable via {@link AF_SELECT_MENU_I18N} for i18n.
+ * - Uses CSS logical properties for RTL layout support.
+ * - `aria-describedby` links to hint or error text; `aria-invalid` is set on error state.
+ * - Disabled options are marked with `aria-disabled` and skipped during keyboard navigation.
  */
 declare class AfSelectMenuComponent implements ControlValueAccessor {
     private static nextId;
+    protected readonly i18n: _neuravision_ng_construct.AfSelectMenuI18n;
+    private readonly announcer;
     /** Label shown above the select */
     label: _angular_core.InputSignal<string>;
     /** Placeholder text when nothing is selected */
@@ -1983,6 +2471,105 @@ declare class AfSelectMenuComponent implements ControlValueAccessor {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfSelectMenuComponent, "af-select-menu", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "componentId": { "alias": "componentId"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; }, never, never, true, never>;
 }
 
+/**
+ * Test harness for AfSelectMenuComponent.
+ *
+ * Provides a semantic API for interacting with the select-menu in tests,
+ * abstracting DOM details behind readable method names.
+ *
+ * @example
+ * const harness = new AfSelectMenuHarness(fixture.nativeElement);
+ * harness.click();
+ * expect(harness.isOpen()).toBe(true);
+ * expect(harness.getOptionCount()).toBe(4);
+ * harness.clickOption(1);
+ * expect(harness.getTriggerText()).toBe('Banana');
+ */
+declare class AfSelectMenuHarness {
+    private readonly hostEl;
+    constructor(container: HTMLElement);
+    /** Returns the trigger `<button>` element. */
+    getTriggerElement(): HTMLButtonElement;
+    /** Returns the trimmed display text of the trigger. */
+    getTriggerText(): string;
+    /** Clicks the trigger button. */
+    click(): void;
+    /** Returns whether the trigger is disabled. */
+    isDisabled(): boolean;
+    /** Returns whether the listbox is currently open. */
+    isOpen(): boolean;
+    /** Returns the `aria-expanded` attribute value. */
+    getAriaExpanded(): string | null;
+    /** Returns the `aria-label` attribute value. */
+    getAriaLabel(): string | null;
+    /** Returns the `aria-labelledby` attribute value. */
+    getAriaLabelledBy(): string | null;
+    /** Returns the `aria-activedescendant` attribute value. */
+    getAriaActiveDescendant(): string | null;
+    /** Returns the `aria-invalid` attribute value. */
+    getAriaInvalid(): string | null;
+    /** Returns the `aria-required` attribute value. */
+    getAriaRequired(): string | null;
+    /** Returns the `aria-describedby` attribute value. */
+    getAriaDescribedBy(): string | null;
+    /** Returns all option elements inside the listbox. */
+    getOptions(): HTMLElement[];
+    /** Returns the trimmed text of the option at the given index. */
+    getOptionText(index: number): string;
+    /** Returns the number of options. */
+    getOptionCount(): number;
+    /** Returns whether the option at the given index is selected. */
+    isOptionSelected(index: number): boolean;
+    /** Returns whether the option at the given index is disabled. */
+    isOptionDisabled(index: number): boolean;
+    /** Returns whether the option at the given index is highlighted. */
+    isOptionHighlighted(index: number): boolean;
+    /** Clicks the option at the given index. */
+    clickOption(index: number): void;
+    /** Returns the trimmed label text, or empty string if no label. */
+    getLabelText(): string;
+    /** Returns the trimmed hint text, or empty string if no hint. */
+    getHintText(): string;
+    /** Returns the trimmed error text, or empty string if no error. */
+    getErrorText(): string;
+    /** Returns whether the select-menu wrapper has the given CSS class. */
+    hasClass(className: string): boolean;
+}
+
+/** Translatable strings used by the select-menu component. */
+interface AfSelectMenuI18n {
+    /** Fallback `aria-label` when no `label` input is provided. */
+    selectOption: string;
+    /** Announcement when the listbox opens. Use `{count}` as placeholder. */
+    opened: string;
+    /** Announcement when the listbox closes. */
+    closed: string;
+    /** Announcement when an option is selected. Use `{label}` as placeholder. */
+    selected: string;
+    /** Announcement when an option is deselected (multi-select). Use `{label}` as placeholder. */
+    deselected: string;
+    /** Announcement for the number of selected options (multi-select). Use `{count}` as placeholder. */
+    countSelected: string;
+}
+/**
+ * Injection token to override select-menu screen-reader announcements
+ * and the fallback `aria-label`.
+ *
+ * @example
+ * providers: [{
+ *   provide: AF_SELECT_MENU_I18N,
+ *   useValue: {
+ *     selectOption: 'Option auswählen',
+ *     opened: '{count} Optionen verfügbar',
+ *     closed: 'Auswahl geschlossen',
+ *     selected: '{label} ausgewählt',
+ *     deselected: '{label} abgewählt',
+ *     countSelected: '{count} Optionen ausgewählt',
+ *   },
+ * }]
+ */
+declare const AF_SELECT_MENU_I18N: InjectionToken<AfSelectMenuI18n>;
+
 type AfNavbarSize = 'sm' | 'md' | 'lg';
 type AfNavbarVariant = 'default' | 'sticky' | 'fixed' | 'elevated' | 'transparent' | 'dark' | 'bordered';
 /**
@@ -2495,5 +3082,5 @@ declare class AfFormatLabelPipe implements PipeTransform {
     static ɵpipe: _angular_core.ɵɵPipeDeclaration<AfFormatLabelPipe, "afFormatLabel", true>;
 }
 
-export { AfAccordionComponent, AfAccordionItemComponent, AfAlertComponent, AfAppShellComponent, AfAppShellPageHeaderComponent, AfAppShellV2Component, AfAppShellV2ToolbarComponent, AfAvatarComponent, AfBadgeComponent, AfBannerComponent, AfBreadcrumbsComponent, AfButtonComponent, AfCardComponent, AfCellDefDirective, AfCheckboxComponent, AfChipComponent, AfChipInputComponent, AfComboboxComponent, AfDataTableComponent, AfDatepickerComponent, AfDividerComponent, AfDrawerComponent, AfDropdownComponent, AfEmptyStateComponent, AfFieldComponent, AfFileUploadComponent, AfFormatLabelPipe, AfIconComponent, AfInputComponent, AfModalComponent, AfNavItemComponent, AfNavTabsComponent, AfNavbarComponent, AfPaginationComponent, AfPopoverComponent, AfPopoverTriggerDirective, AfProgressBarComponent, AfRadioComponent, AfRadioGroupComponent, AfSelectComponent, AfSelectMenuComponent, AfSidebarComponent, AfSkeletonComponent, AfSkipLinkComponent, AfSliderComponent, AfSpinnerComponent, AfSwitchComponent, AfTabPanelComponent, AfTableBodyComponent, AfTableCellComponent, AfTableComponent, AfTableHeaderCellComponent, AfTableHeaderComponent, AfTableRowComponent, AfTabsComponent, AfTextareaComponent, AfToastContainerComponent, AfToastService, AfToggleGroupComponent, AfToolbarComponent, AfTooltipDirective };
-export type { AfAlertVariant, AfAvatarSize, AfAvatarStatus, AfBadgeVariant, AfBannerAppearance, AfBannerPosition, AfBannerVariant, AfBreadcrumb, AfButtonSize, AfButtonType, AfButtonVariant, AfCardElevation, AfCardPadding, AfChipAppearance, AfChipSize, AfChipVariant, AfColumn, AfComboboxOption, AfDataRow, AfDataTableConfig, AfDividerColor, AfDividerOrientation, AfDividerSpacing, AfDrawerPosition, AfDrawerSize, AfDropdownItem, AfEmptyStateSize, AfEmptyStateVariant, AfFileEntry, AfFileValidationError, AfIconSize, AfInputType, AfNavTab, AfNavTabsSize, AfNavTabsVariant, AfNavbarSize, AfNavbarVariant, AfPopoverAlign, AfPopoverPosition, AfPopoverSize, AfProgressBarSize, AfProgressBarVariant, AfSelectMenuOption, AfSelectOption, AfShellPanelState, AfShellSidebarState, AfSidebarMode, AfSkeletonVariant, AfSliderSize, AfSortDirection, AfSortState, AfSpinnerSize, AfTab, AfTableCellType, AfTableVariant, AfToast, AfToastVariant, AfToggleGroupSize, AfToggleItem, AfTooltipPosition };
+export { AF_ACCORDION_I18N, AF_ALERT_I18N, AF_INPUT_I18N, AF_SELECT_MENU_I18N, AfAccordionComponent, AfAccordionHarness, AfAccordionItemComponent, AfAccordionItemHarness, AfAlertComponent, AfAlertHarness, AfAppShellComponent, AfAppShellPageHeaderComponent, AfAppShellV2Component, AfAppShellV2ToolbarComponent, AfAvatarComponent, AfBadgeComponent, AfBadgeHarness, AfBannerComponent, AfBreadcrumbsComponent, AfButtonComponent, AfButtonHarness, AfCardComponent, AfCellDefDirective, AfCheckboxComponent, AfChipComponent, AfChipInputComponent, AfComboboxComponent, AfDataTableComponent, AfDatepickerComponent, AfDividerComponent, AfDrawerComponent, AfDropdownComponent, AfEmptyStateComponent, AfFieldComponent, AfFileUploadComponent, AfFormatLabelPipe, AfIconComponent, AfInputComponent, AfInputHarness, AfModalComponent, AfNavItemComponent, AfNavTabsComponent, AfNavbarComponent, AfPaginationComponent, AfPopoverComponent, AfPopoverTriggerDirective, AfProgressBarComponent, AfRadioComponent, AfRadioGroupComponent, AfSelectComponent, AfSelectMenuComponent, AfSelectMenuHarness, AfSidebarComponent, AfSkeletonComponent, AfSkipLinkComponent, AfSliderComponent, AfSpinnerComponent, AfSwitchComponent, AfTabPanelComponent, AfTableBodyComponent, AfTableCellComponent, AfTableComponent, AfTableHeaderCellComponent, AfTableHeaderComponent, AfTableRowComponent, AfTabsComponent, AfTextareaComponent, AfToastContainerComponent, AfToastService, AfToggleGroupComponent, AfToolbarComponent, AfTooltipDirective };
+export type { AfAccordionI18n, AfAlertI18n, AfAlertVariant, AfAvatarSize, AfAvatarStatus, AfBadgeVariant, AfBannerAppearance, AfBannerPosition, AfBannerVariant, AfBreadcrumb, AfButtonSize, AfButtonType, AfButtonVariant, AfCardElevation, AfCardPadding, AfChipAppearance, AfChipSize, AfChipVariant, AfColumn, AfComboboxOption, AfDataRow, AfDataTableConfig, AfDateRange, AfDatepickerMode, AfDatepickerValueFormat, AfDatepickerView, AfDividerColor, AfDividerOrientation, AfDividerSpacing, AfDrawerPosition, AfDrawerSize, AfDropdownItem, AfEmptyStateSize, AfEmptyStateVariant, AfFileEntry, AfFileValidationError, AfIconSize, AfInputI18n, AfInputType, AfNavTab, AfNavTabsSize, AfNavTabsVariant, AfNavbarSize, AfNavbarVariant, AfPopoverAlign, AfPopoverPosition, AfPopoverSize, AfProgressBarSize, AfProgressBarVariant, AfSelectMenuI18n, AfSelectMenuOption, AfSelectOption, AfShellPanelState, AfShellSidebarState, AfSidebarMode, AfSkeletonVariant, AfSliderSize, AfSortDirection, AfSortState, AfSpinnerSize, AfTab, AfTableCellType, AfTableVariant, AfToast, AfToastVariant, AfToggleGroupSize, AfToggleItem, AfTooltipPosition };