@eagami/ui 5.70.0 → 5.71.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eagami/ui",
-  "version": "5.70.0",
+  "version": "5.71.1",
   "description": "Lightweight, accessible, themeable Angular UI component library and icon set built on CSS custom properties",
   "author": "Michal Wiraszka <michal@eagami.com>",
   "license": "MIT",

package/src/styles/_rtl.scss

@@ -31,8 +31,10 @@
 
 // Native fields use dir="auto" so typed LTR text stays LTR, but that resolves
 // an empty field to LTR and parks its placeholder on the left. Pin them to the
-// inline-end edge so every RTL field reads from the right like the others.
+// inline-end edge so every RTL field reads from the right like the others. The
+// typed placeholder drawn over an empty field follows its placeholder.
 [dir='rtl'] input[dir='auto'],
-[dir='rtl'] textarea[dir='auto'] {
+[dir='rtl'] textarea[dir='auto'],
+[dir='rtl'] ea-typed-placeholder[dir='auto'] {
   text-align: right;
 }

package/types/eagami-ui.d.ts

@@ -1,6 +1,27 @@
 import * as i0 from "@angular/core";
 import { AfterContentChecked, ElementRef, EnvironmentProviders, InjectionToken, Injector, OnDestroy, OnInit, Signal, TemplateRef, Type } from "@angular/core";
 import { AbstractControl, ControlValueAccessor } from "@angular/forms";
+/**
+ * When a form component shows its validation error.
+ *
+ * - `'change'`: once the user changes the field and leaves it, or submits the
+ *   form. A field the user tabs past stays quiet, and a new error waits until
+ *   focus leaves the field.
+ * - `'touch'`: as soon as the user leaves the field, even unchanged, and live
+ *   while they edit it after that.
+ */
+type EaShowErrorsOn = 'change' | 'touch';
+/**
+ * App-wide defaults for form components, set through
+ * `provideEagamiUi({ forms })`. A form component's own `showErrorsOn` input
+ * wins over these for that one field.
+ */
+interface EagamiFormsConfig {
+  /** When form components show their validation errors; `'change'` by default. */
+  showErrorsOn?: EaShowErrorsOn;
+}
+/** DI token carrying the consumer-supplied form defaults. */
+declare const EAGAMI_FORMS_CONFIG: InjectionToken<EagamiFormsConfig>;
 /**
  * BCP 47 locale tags supported out of the box. Consumers select one of these
  * via `provideEagamiUi({ locale })` or `EagamiI18nService.setLocale()`.
@@ -391,8 +412,8 @@ export interface ModePalette {
 }
 /**
  * Full provider configuration for `provideEagamiUi()`. Extends the i18n config
- * with an optional brand palette; omit `palette` to keep the un-themed SCSS
- * defaults.
+ * with an optional brand palette and form error timing; omit `palette` to keep
+ * the un-themed SCSS defaults.
  */
 export interface EagamiUiConfig extends EagamiI18nConfig {
   /**
@@ -401,6 +422,11 @@ export interface EagamiUiConfig extends EagamiI18nConfig {
    * pairing. A contrast violation throws at bootstrap.
    */
   palette?: EagamiPaletteConfig;
+  /**
+   * App-wide defaults for form components, such as `showErrorsOn` for when
+   * they show their validation errors. Omit it to keep the `'change'` default.
+   */
+  forms?: EagamiFormsConfig;
 }
 /**
  * Configures Eagami UI for the application.
@@ -924,6 +950,8 @@ export declare class AutocompleteComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly minLength: import("@angular/core").InputSignal<number>;
   /** Maximum number of characters the input accepts (native `maxlength`). */
   readonly maxLength: import("@angular/core").InputSignal<number | undefined>;
@@ -1061,6 +1089,11 @@ export declare class AutocompleteComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "minLength": {
       "alias": "minLength";
       "required": false;
@@ -1930,14 +1963,22 @@ export declare class ButtonComponent {
   readonly ariaLabelledby: import("@angular/core").InputSignal<string | undefined>;
   /** Space-separated ids of the elements that describe the button, e.g. a hint. */
   readonly ariaDescribedby: import("@angular/core").InputSignal<string | undefined>;
+  /** Whether the content this button shows and hides is open, for a disclosure toggle. */
+  readonly ariaExpanded: import("@angular/core").InputSignal<boolean | undefined>;
+  /** Id of the element this button shows, hides or otherwise controls. */
+  readonly ariaControls: import("@angular/core").InputSignal<string | undefined>;
+  private readonly renderer;
   private readonly buttonEl;
+  private readonly ownedAria;
   /** Fires when the button is activated; suppressed while disabled or loading. */
   readonly clicked: import("@angular/core").OutputEmitterRef<MouseEvent>;
   readonly isDisabled: import("@angular/core").Signal<boolean>;
   readonly hostClasses: import("@angular/core").Signal<Record<string, boolean>>;
+  constructor();
   handleClick(event: MouseEvent): void;
   /** Moves keyboard focus to the underlying native button. */
   focus(): void;
+  private reflectAria;
   static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "ea-button", never, {
     "variant": {
@@ -2005,6 +2046,16 @@ export declare class ButtonComponent {
       "required": false;
       "isSignal": true;
     };
+    "ariaExpanded": {
+      "alias": "aria-expanded";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaControls": {
+      "alias": "aria-controls";
+      "required": false;
+      "isSignal": true;
+    };
   }, {
     "clicked": "clicked";
   }, never, ["[slot=prefix]", "*", "[slot=suffix]"], true, never>;
@@ -2149,6 +2200,8 @@ export declare class CheckboxComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly size: import("@angular/core").InputSignal<EaSize>;
   /**
    * Ellipsize a label too long for the space the checkbox is given, revealing
@@ -2216,6 +2269,11 @@ export declare class CheckboxComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "size": {
       "alias": "size";
       "required": false;
@@ -2532,6 +2590,8 @@ export declare class ColorPickerComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   /** Whether to show the alpha slider. When `false` the emitted value always has alpha = 1. */
   readonly showAlpha: import("@angular/core").InputSignal<boolean>;
   /** Whether to show the clear button when a value is set. */
@@ -2746,6 +2806,11 @@ export declare class ColorPickerComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "showAlpha": {
       "alias": "showAlpha";
       "required": false;
@@ -3553,6 +3618,8 @@ export declare class CodeInputComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly readonly: import("@angular/core").InputSignal<boolean>;
   readonly required: import("@angular/core").InputSignal<boolean>;
@@ -3645,6 +3712,11 @@ export declare class CodeInputComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "disabled": {
       "alias": "disabled";
       "required": false;
@@ -3735,6 +3807,8 @@ export declare class DatePickerComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly minDate: import("@angular/core").InputSignal<Date | null>;
   readonly maxDate: import("@angular/core").InputSignal<Date | null>;
   /** Weekdays that cannot be picked, numbered as `Date.getDay()` does: 0 for Sunday through 6 for Saturday. */
@@ -3907,6 +3981,11 @@ export declare class DatePickerComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "minDate": {
       "alias": "minDate";
       "required": false;
@@ -4400,6 +4479,8 @@ export declare class DropdownComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly id: import("@angular/core").InputSignal<string>;
   readonly value: import("@angular/core").ModelSignal<string>;
   /** Fires with the new value when the user selects an option or clears the selection. */
@@ -4555,6 +4636,11 @@ export declare class DropdownComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "id": {
       "alias": "id";
       "required": false;
@@ -4800,6 +4886,8 @@ export declare class FormFieldComponent {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for the projected form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   /** Marks the field as required. */
   readonly required: import("@angular/core").InputSignal<boolean>;
   /** Visual size of the field; the label, control text, spacing, and messages scale with it. */
@@ -4854,6 +4942,11 @@ export declare class FormFieldComponent {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "required": {
       "alias": "required";
       "required": false;
@@ -4886,6 +4979,8 @@ interface ControlErrorStateConfig {
   errorMsg: Signal<string | null | undefined>;
   /** Per-error-key overrides for auto-derived validation messages. */
   errorMessages: Signal<EaErrorMessages | undefined>;
+  /** Field-level `showErrorsOn`; `undefined` falls back to the app-wide `forms` config. */
+  showErrorsOn?: Signal<EaShowErrorsOn | undefined>;
 }
 interface ControlErrorState {
   /** Error text to display, or `null` when the field is valid or untouched. */
@@ -4899,14 +4994,15 @@ interface ControlErrorState {
  * default for the active `ValidationErrors` key.
  *
  * Auto-derived messages surface only once the bound control is `invalid &&
- * touched`, and a new one waits while focus is still inside the field, until
- * the user leaves it or submits the form, so nothing is flagged mid-edit. A
- * field the user only passed through, leaving it without changing it, stays
- * quiet until they change it or the form is submitted, so tabbing past an
- * empty required field never flags it. A
- * message already showing follows the value as it is typed and clears the
- * moment it is fixed. A message revealed by a pointer press moving focus away
- * waits until that press has landed its click. The control arrives as a signal
+ * touched`. Under the default `showErrorsOn: 'change'`, a new one waits while
+ * focus is still inside the field, until the user leaves it or submits the
+ * form, so nothing is flagged mid-edit, and a field the user only passed
+ * through, leaving it without changing it, stays quiet until they change it or
+ * the form is submitted, so tabbing past an empty required field never flags
+ * it. `'touch'` drops both holds. A message already showing follows the value
+ * as it is typed and clears the moment it is fixed. A message revealed by a
+ * pointer press moving focus away waits until that press has landed its click,
+ * in either mode. The control arrives as a signal
  * so callers decide how it is resolved: from the host's own `NgControl` (CVA
  * components) or from projected content (`<ea-form-field>`).
  */
@@ -4982,6 +5078,8 @@ export declare class FileUploaderComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly size: import("@angular/core").InputSignal<EaSize>;
   /**
    * `dropzone` renders the drag-and-drop area; `button` renders a compact
@@ -5131,6 +5229,11 @@ export declare class FileUploaderComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "size": {
       "alias": "size";
       "required": false;
@@ -5218,6 +5321,26 @@ export declare class FileUploaderComponent implements ControlValueAccessor {
     "dragOverChanged": "dragOverChanged";
   }, never, ["[icon]"], true, never>;
 }
+/** Live state of a field's typewriter placeholder. */
+interface TypedPlaceholder {
+  /** Whether the typed layer stands in for the native placeholder. */
+  readonly animating: Signal<boolean>;
+  /** The whole hint in play, for the native `placeholder` attribute. */
+  readonly hint: Signal<string>;
+  /** The part of the hint typed so far. */
+  readonly text: Signal<string>;
+  /** Whether characters are still arriving; the cursor blinks only once they stop. */
+  readonly typing: Signal<boolean>;
+}
+/**
+ * Types `hints` into a field's placeholder one character at a time, holds each
+ * whole hint, then clears it and types the next, looping. Under
+ * `prefers-reduced-motion: reduce` it swaps whole hints instead and never
+ * animates. It starts in the browser after the first render, restarts when the
+ * hints change, and clears its timer on destroy. The timers run outside the
+ * zone so the endless loop never holds the app unstable.
+ */
+declare function injectTypedPlaceholder(hints: Signal<readonly string[]>): TypedPlaceholder;
 /** Visual size of the input. */
 export type InputSize = EaSize;
 /** HTML `type` attribute applied to the underlying `<input>`. */
@@ -5256,6 +5379,14 @@ export declare class InputComponent implements ControlValueAccessor {
   readonly type: import("@angular/core").InputSignal<InputType>;
   /** Placeholder shown while the field is empty. */
   readonly placeholder: import("@angular/core").InputSignal<string>;
+  /**
+   * Hints typed into the empty field one character at a time, trailed by a
+   * blinking cursor, each held and then replaced by the next, in a loop. The
+   * native placeholder carries the whole current hint for assistive
+   * technology, and under `prefers-reduced-motion` the hints swap whole without
+   * a cursor. Takes the place of `placeholder` while it holds any hints.
+   */
+  readonly typedPlaceholder: import("@angular/core").InputSignal<readonly string[]>;
   /** Leading icon component rendered before the text, e.g. a search or filter glyph. */
   readonly icon: import("@angular/core").InputSignal<Type<unknown> | undefined>;
   /** Keeps the leading icon while the field has a value; when false it shows only alongside the placeholder. */
@@ -5268,6 +5399,8 @@ export declare class InputComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   /** Disables the field. */
   readonly disabled: import("@angular/core").InputSignal<boolean>;
   /** Renders the field read-only. */
@@ -5310,6 +5443,9 @@ export declare class InputComponent implements ControlValueAccessor {
   private onChange;
   private onTouched;
   readonly isDisabled: import("@angular/core").Signal<boolean>;
+  protected readonly typed: TypedPlaceholder;
+  protected readonly typedPlaceholderShown: import("@angular/core").Signal<boolean>;
+  protected readonly nativePlaceholder: import("@angular/core").Signal<string>;
   readonly effectiveType: import("@angular/core").Signal<InputType>;
   private readonly errorState;
   readonly errorText: import("@angular/core").Signal<string | null>;
@@ -5409,6 +5545,11 @@ export declare class InputComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "typedPlaceholder": {
+      "alias": "typedPlaceholder";
+      "required": false;
+      "isSignal": true;
+    };
     "icon": {
       "alias": "icon";
       "required": false;
@@ -5439,6 +5580,11 @@ export declare class InputComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "disabled": {
       "alias": "disabled";
       "required": false;
@@ -6003,6 +6149,8 @@ export declare class MultiSelectComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   /** Toggle the search input at the top of the popover. */
   readonly searchable: import("@angular/core").InputSignal<boolean>;
   /** Toggle the "Select all" row at the top of the option list. */
@@ -6247,6 +6395,11 @@ export declare class MultiSelectComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "searchable": {
       "alias": "searchable";
       "required": false;
@@ -6327,6 +6480,8 @@ export declare class NumberInputComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   /** Disables the field. */
   readonly disabled: import("@angular/core").InputSignal<boolean>;
   /** Renders the field read-only. */
@@ -6440,6 +6595,11 @@ export declare class NumberInputComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "disabled": {
       "alias": "disabled";
       "required": false;
@@ -6931,6 +7091,8 @@ export declare class RadioGroupComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly ariaLabel: import("@angular/core").InputSignal<string | undefined>;
   /** Space-separated ids of the elements whose text names the group, such as a label outside the component. */
   readonly ariaLabelledby: import("@angular/core").InputSignal<string | undefined>;
@@ -7019,6 +7181,11 @@ export declare class RadioGroupComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "ariaLabel": {
       "alias": "aria-label";
       "required": false;
@@ -7116,6 +7283,8 @@ export declare class RangeSliderComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly min: import("@angular/core").InputSignal<number>;
   readonly max: import("@angular/core").InputSignal<number>;
   readonly step: import("@angular/core").InputSignal<number>;
@@ -7214,6 +7383,11 @@ export declare class RangeSliderComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "min": {
       "alias": "min";
       "required": false;
@@ -7330,6 +7504,8 @@ export declare class RatingComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly size: import("@angular/core").InputSignal<EaSize>;
   readonly min: import("@angular/core").InputSignal<number>;
   readonly max: import("@angular/core").InputSignal<number>;
@@ -7436,6 +7612,11 @@ export declare class RatingComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "size": {
       "alias": "size";
       "required": false;
@@ -7523,6 +7704,8 @@ export declare class SegmentedComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly size: import("@angular/core").InputSignal<EaSize>;
   readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly required: import("@angular/core").InputSignal<boolean>;
@@ -7603,6 +7786,11 @@ export declare class SegmentedComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "size": {
       "alias": "size";
       "required": false;
@@ -7705,6 +7893,8 @@ export declare class SliderComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   /** Force the error-state styling without binding `errorMsg`. Lets consumers
    *  render the error text themselves (e.g. above the slider in a form layout)
    *  while still getting the built-in recolour of the fill and thumb. */
@@ -7805,6 +7995,11 @@ export declare class SliderComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "hasError": {
       "alias": "hasError";
       "required": false;
@@ -8238,6 +8433,8 @@ export declare class SwitchComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly size: import("@angular/core").InputSignal<EaSize>;
   /**
    * Status tone for the track: a tinted wash with a toned border while off and
@@ -8298,6 +8495,11 @@ export declare class SwitchComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "size": {
       "alias": "size";
       "required": false;
@@ -8783,11 +8985,21 @@ export declare class TextareaComponent implements ControlValueAccessor {
   /** Accessible name for the control when no visible `label` is set. */
   readonly ariaLabel: import("@angular/core").InputSignal<string | undefined>;
   readonly placeholder: import("@angular/core").InputSignal<string>;
+  /**
+   * Hints typed into the empty field one character at a time, trailed by a
+   * blinking cursor, each held and then replaced by the next, in a loop. The
+   * native placeholder carries the whole current hint for assistive
+   * technology, and under `prefers-reduced-motion` the hints swap whole without
+   * a cursor. Takes the place of `placeholder` while it holds any hints.
+   */
+  readonly typedPlaceholder: import("@angular/core").InputSignal<readonly string[]>;
   readonly size: import("@angular/core").InputSignal<EaSize>;
   readonly hint: import("@angular/core").InputSignal<string | undefined>;
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly readonly: import("@angular/core").InputSignal<boolean>;
   readonly required: import("@angular/core").InputSignal<boolean>;
@@ -8812,6 +9024,9 @@ export declare class TextareaComponent implements ControlValueAccessor {
   private onChange;
   private onTouched;
   readonly isDisabled: import("@angular/core").Signal<boolean>;
+  protected readonly typed: TypedPlaceholder;
+  protected readonly typedPlaceholderShown: import("@angular/core").Signal<boolean>;
+  protected readonly nativePlaceholder: import("@angular/core").Signal<string>;
   private readonly errorState;
   readonly errorText: import("@angular/core").Signal<string | null>;
   readonly hasError: import("@angular/core").Signal<boolean>;
@@ -8881,6 +9096,11 @@ export declare class TextareaComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "typedPlaceholder": {
+      "alias": "typedPlaceholder";
+      "required": false;
+      "isSignal": true;
+    };
     "size": {
       "alias": "size";
       "required": false;
@@ -8901,6 +9121,11 @@ export declare class TextareaComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "disabled": {
       "alias": "disabled";
       "required": false;
@@ -9016,6 +9241,8 @@ export declare class TimePickerComponent implements ControlValueAccessor {
   readonly errorMsg: import("@angular/core").InputSignal<string | undefined>;
   /** Per-validator-key message overrides for a bound form control (e.g. `{ required: '...' }`). */
   readonly errorMessages: import("@angular/core").InputSignal<Partial<Record<string, string | null>> | undefined>;
+  /** When the error shows: `'change'` once the user changes the field and leaves it, `'touch'` as soon as they leave it, even unchanged; unset follows the app-wide `forms` option of `provideEagamiUi`. */
+  readonly showErrorsOn: import("@angular/core").InputSignal<EaShowErrorsOn | undefined>;
   /** Display format for the trigger label. Wire value is always 24h. */
   readonly format: import("@angular/core").InputSignal<TimePickerFormat>;
   readonly includeSeconds: import("@angular/core").InputSignal<boolean>;
@@ -9227,6 +9454,11 @@ export declare class TimePickerComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrorsOn": {
+      "alias": "showErrorsOn";
+      "required": false;
+      "isSignal": true;
+    };
     "format": {
       "alias": "format";
       "required": false;
@@ -13964,4 +14196,4 @@ export declare class ZoomOutIconComponent extends IconComponentBase {
   static ɵfac: i0.ɵɵFactoryDeclaration<ZoomOutIconComponent, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ZoomOutIconComponent, "ea-icon-zoom-out", never, {}, {}, never, never, true, never>;
 }
-export type { ChartCurve, ChartLabelOrientation, ChartPointEvent, ChartReferenceLine, ChartSeries, ChartSize, EaErrorMessages, EaValidationErrorKey };
+export type { ChartCurve, ChartLabelOrientation, ChartPointEvent, ChartReferenceLine, ChartSeries, ChartSize, EaErrorMessages, EaShowErrorsOn, EaValidationErrorKey, EagamiFormsConfig };