@elasticias/ui 1.0.53 → 1.0.54

package/types/elasticias-ui.d.ts

@@ -1,18 +1,18 @@
 import * as _angular_core from '@angular/core';
-import { PipeTransform, OnInit, EventEmitter, TemplateRef, OnChanges, AfterContentInit, OnDestroy, SimpleChanges, InjectionToken, AfterViewInit } from '@angular/core';
+import { PipeTransform, OnInit, EventEmitter, TemplateRef, OnChanges, AfterContentInit, OnDestroy, SimpleChanges, InjectionToken, DoCheck, Type, AfterViewInit } from '@angular/core';
 import * as _elasticias_screens from '@elasticias/screens';
 import { EfDataCardColumn, ScreenContext, EfDetailToolbarAction, EfSearchToolbarAction, EfDataCardSort, EfDataCardExportRequest, EfDateRange, EfDatePresetKey } from '@elasticias/screens';
 export { EfBoundedDateRange, EfDataCardColumn, EfDataCardColumnAlign, EfDataCardColumnMobileRole, EfDataCardColumnType, EfDataCardSort, EfDataCardSortDirection, EfDatePresetKey, EfDateRange, EfDetailToolbarAction, EfSearchToolbarAction } from '@elasticias/screens';
 import { Observable } from 'rxjs';
-import { EfPage, Permissions, EmailMetrics, EmailEventRecord, EmailEventKind } from '@elasticias/types';
+import { EfPage, Permissions, LocalizedText, EmailMetrics, EmailEventRecord, EmailEventKind } from '@elasticias/types';
 import { Menu } from 'primeng/menu';
 import * as _elasticias_core from '@elasticias/core';
-import { EfBuildPackage, EfSessionIdleService, EfModule, EfNavSection, EfNavItem, EfModuleId, EfToast, EfToastAction, EfThemeConfigService } from '@elasticias/core';
+import { EfBuildPackage, EfSessionIdleService, EfModule, EfNavSection, EfNavItem, EfModuleId, EfToast, EfToastAction, EfCulture, EfThemeConfigService } from '@elasticias/core';
 import * as i1 from 'primeng/tooltip';
 import { BlockableUI } from 'primeng/api';
 import { SafeResourceUrl, SafeHtml } from '@angular/platform-browser';
 import { ChartConfiguration } from 'chart.js';
-import { ControlValueAccessor, NgControl } from '@angular/forms';
+import { ControlValueAccessor, NgControl, AbstractControl, ValidationErrors } from '@angular/forms';
 import { TranslateService } from '@ngx-translate/core';
 import { InputNumber, InputNumberInputEvent } from 'primeng/inputnumber';
 import { Nullable } from 'primeng/ts-helpers';
@@ -2260,6 +2260,16 @@ interface EfTabItem<T = string> {
     count?: number;
     /** Show a dirty/unread dot after the label/count. */
     dirty?: boolean;
+    /** Translation key of a short note after the label (`'missing'`). It is
+     *  part of the tab's accessible name, so it says what the dot cannot. */
+    noteKey?: string;
+    /** `'danger'` draws the tab in the error status colour: a required panel
+     *  left empty, or a panel holding server errors. */
+    tone?: 'danger';
+    /** DOM id of the tab, for a panel's `aria-labelledby`. */
+    id?: string;
+    /** DOM id of the panel the consumer renders for this tab (`aria-controls`). */
+    panelId?: string;
     disabled?: boolean;
 }
 /**
@@ -2327,6 +2337,7 @@ declare class EfTabsComponent<T = string> implements AfterContentInit {
      *  `fr.json` / `ar.json`. */
     dirtyLabelKey: string;
     readonly valueChange: EventEmitter<T>;
+    private readonly host;
     private tabEls?;
     private readonly panels;
     private readonly panelMap;
@@ -2340,6 +2351,7 @@ declare class EfTabsComponent<T = string> implements AfterContentInit {
     ngAfterContentInit(): void;
     select(item: EfTabItem<T>): void;
     onKeydown(event: KeyboardEvent, index: number): void;
+    private isRtl;
     trackValue(_: number, item: EfTabItem<T>): T;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<EfTabsComponent<any>, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfTabsComponent<any>, "ef-tabs", never, { "items": { "alias": "items"; "required": true; }; "value": { "alias": "value"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "module": { "alias": "module"; "required": false; }; "overflow": { "alias": "overflow"; "required": false; }; "hideCounts": { "alias": "hideCounts"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelKey": { "alias": "ariaLabelKey"; "required": false; }; "dirtyLabelKey": { "alias": "dirtyLabelKey"; "required": false; }; }, { "valueChange": "valueChange"; }, ["panels"], never, true, never>;
@@ -3653,6 +3665,9 @@ declare class EfSeoPreviewComponent {
 }
 
 /**
+ * Exported for `@elasticias/ui/rich-text` only, not a supported extension
+ * point: it may change without a major version.
+ *
  * Shared base for every Comptoir form control (`ef-input-text`,
  * `ef-textarea`, `ef-select`, `ef-input-number`, `ef-checkbox`, …).
  *
@@ -3833,6 +3848,10 @@ declare class EfInputTextComponent extends AbstractEfFormControl implements Cont
      *  follow the value's first strong character. The label and messages keep
      *  the page direction. Null or absent leaves the input unchanged. */
     dir: 'ltr' | 'rtl' | 'auto' | null;
+    /** Language of the typed value (`'ar'` for an Arabic title on a French
+     *  screen), applied to the native input only: the label and hint are page
+     *  text and keep the page language. Null or absent renders no attribute. */
+    lang: string | null;
     /** Clearable (showClear / canClear) is inherited from AbstractEfFormControl;
      *  we only supply the value predicate + the reset. */
     protected get hasValue(): boolean;
@@ -3890,7 +3909,7 @@ declare class EfInputTextComponent extends AbstractEfFormControl implements Cont
     private nativeField;
     handleBlur(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<EfInputTextComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfInputTextComponent, "ef-input-text", never, { "size": { "alias": "size"; "required": false; }; "type": { "alias": "type"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "fluid": { "alias": "fluid"; "required": false; }; "inline": { "alias": "inline"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "dir": { "alias": "dir"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "prefix": { "alias": "prefix"; "required": false; }; "suffix": { "alias": "suffix"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChangeEvent": "valueChangeEvent"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfInputTextComponent, "ef-input-text", never, { "size": { "alias": "size"; "required": false; }; "type": { "alias": "type"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "fluid": { "alias": "fluid"; "required": false; }; "inline": { "alias": "inline"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "dir": { "alias": "dir"; "required": false; }; "lang": { "alias": "lang"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "prefix": { "alias": "prefix"; "required": false; }; "suffix": { "alias": "suffix"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChangeEvent": "valueChangeEvent"; }, never, never, true, never>;
     static ngAcceptInputType_fluid: unknown;
     static ngAcceptInputType_inline: unknown;
 }
@@ -4580,6 +4599,17 @@ declare class EfMultiSelectComponent extends AbstractEfFormControl implements Co
     selectionLimit: any;
     filters: any;
     inline: boolean;
+    /**
+     * Rendering variant, as on `ef-select`.
+     * - `'primeng'` (default): PrimeNG's own multiselect skin, unchanged.
+     * - `'comptoir'`: the shared `.es` skin with `.es--comptoir`, the same hook
+     *                 `ef-select variant="comptoir"` uses: a trigger on
+     *                 `--hit-field` (`--hit-base` 40px, `--hit-touch` 48px on a
+     *                 coarse pointer) and no minimum width, so a select and a
+     *                 multi-select in one row align and both shrink with it.
+     */
+    variant: 'primeng' | 'comptoir';
+    get effectiveStyleClass(): string | undefined;
     get isInline(): boolean;
     get isRequired(): boolean;
     selectedValues: any[];
@@ -4598,7 +4628,7 @@ declare class EfMultiSelectComponent extends AbstractEfFormControl implements Co
     ngOnChanges(): void;
     private applyFilters;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<EfMultiSelectComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfMultiSelectComponent, "ef-multi-select", never, { "optionLabel": { "alias": "optionLabel"; "required": false; }; "optionValue": { "alias": "optionValue"; "required": false; }; "options": { "alias": "options"; "required": false; }; "filteredOptions": { "alias": "filteredOptions"; "required": false; }; "maxSelectedLabels": { "alias": "maxSelectedLabels"; "required": false; }; "display": { "alias": "display"; "required": false; }; "size": { "alias": "size"; "required": false; }; "selectionLimit": { "alias": "selectionLimit"; "required": false; }; "filters": { "alias": "filters"; "required": false; }; "inline": { "alias": "inline"; "required": false; }; }, { "changeEvent": "changeEvent"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfMultiSelectComponent, "ef-multi-select", never, { "optionLabel": { "alias": "optionLabel"; "required": false; }; "optionValue": { "alias": "optionValue"; "required": false; }; "options": { "alias": "options"; "required": false; }; "filteredOptions": { "alias": "filteredOptions"; "required": false; }; "maxSelectedLabels": { "alias": "maxSelectedLabels"; "required": false; }; "display": { "alias": "display"; "required": false; }; "size": { "alias": "size"; "required": false; }; "selectionLimit": { "alias": "selectionLimit"; "required": false; }; "filters": { "alias": "filters"; "required": false; }; "inline": { "alias": "inline"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; }, { "changeEvent": "changeEvent"; }, never, never, true, never>;
     static ngAcceptInputType_inline: unknown;
 }
 
@@ -6189,6 +6219,15 @@ declare class EfServerErrorsDirective {
     } | null>;
     /** Messages for a control by its `name`, or `null` when none. */
     errorsFor(name: string | undefined | null): string[] | null;
+    /**
+     * Messages for every key that starts with `prefix`, keyed by what follows
+     * it: `errorsWithPrefix('title.')` turns `title.ar` into `ar`. For a control
+     * that owns several backend keys, such as a text per language. Empty lists
+     * are left out.
+     */
+    errorsWithPrefix(prefix: string): {
+        [suffix: string]: string[];
+    };
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<EfServerErrorsDirective, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<EfServerErrorsDirective, "[efServerErrors]", never, { "errors": { "alias": "efServerErrors"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
@@ -6356,6 +6395,9 @@ declare class EfRadioComponent extends AbstractEfFormControl implements ControlV
 declare class EfTextareaComponent extends AbstractEfFormControl implements ControlValueAccessor {
     rows: number;
     maxlength?: number;
+    /** Language of the typed value, applied to the native textarea only (the
+     *  label and hint keep the page language). Null or absent renders none. */
+    lang: string | null;
     autofocus: boolean;
     /** Monospace face for source text (an HTML body, a JSON snippet), where
      *  tags and indentation must stay readable. */
@@ -6398,70 +6440,299 @@ declare class EfTextareaComponent extends AbstractEfFormControl implements Contr
     private nativeField;
     handleBlur(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<EfTextareaComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfTextareaComponent, "ef-textarea", never, { "rows": { "alias": "rows"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "mono": { "alias": "mono"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChangeEvent": "valueChangeEvent"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfTextareaComponent, "ef-textarea", never, { "rows": { "alias": "rows"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "lang": { "alias": "lang"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "mono": { "alias": "mono"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChangeEvent": "valueChangeEvent"; }, never, never, true, never>;
     static ngAcceptInputType_autofocus: unknown;
     static ngAcceptInputType_mono: unknown;
 }
 
-/** A language the SEO texts are written in. */
-interface EfSeoLocale {
-    code: string;
-    labelKey: string;
-    dir: 'auto' | 'rtl' | 'ltr';
-}
-/** What the fields write back: French is the scalar, every other language a dictionary entry. */
+/** A language the SEO texts are written in: the same shape as every content culture. */
+type EfSeoLocale = EfCulture;
+/**
+ * What the fields write back: the whole object of the field that changed,
+ * blank languages removed. Only the field that changed is present.
+ */
 interface EfSeoPatch {
-    seoTitle?: string;
-    seoDescription?: string;
-    seoTitleTranslations?: Record<string, string>;
-    seoDescriptionTranslations?: Record<string, string>;
+    seoTitle?: LocalizedText;
+    seoDescription?: LocalizedText;
 }
-type Field = 'title' | 'description';
+/**
+ * The content cultures the SEO fields start from, shared with `ef-localized-input`.
+ * @deprecated use `EF_DEFAULT_CONTENT_CULTURES` from `@elasticias/core`.
+ */
 declare const EF_SEO_DEFAULT_LOCALES: ReadonlyArray<EfSeoLocale>;
 /**
- * SEO title and description per language, each with a counter against what a
- * search engine shows (60 / 160), capped at the server's limits (256 / 512),
- * and the shared `ef-seo-preview` of the French result with the entity's own
- * title and description as the fallback the shop uses. Card-less: each screen
- * wraps it in its own `ef-card`.
- *
- * The French controls carry the backend names (`seoTitle`, `seoDescription`)
- * so `[efServerErrors]` links their errors; the others (`seoTitleAr`, ...) are
- * dictionary entries whose errors are toasted (ADR-010).
+ * SEO title and description in every content language, each an
+ * `ef-localized-input` with a counter against what a search engine shows
+ * (60 / 160, read out to screen readers), capped at the server's limits
+ * (256 / 512), and the shared `ef-seo-preview` of the default language's
+ * result with the entity's own title and description as the fallback the shop
+ * uses. Card-less: each screen wraps it in its own `ef-card`.
+ *
+ * The controls are named `seoTitle` and `seoDescription`, so under
+ * `[efServerErrors]` a `seoTitle.ar` error lands on the Arabic tab and shows
+ * under its field. Languages come from `EF_CONTENT_CULTURES` unless `cultures`
+ * is set.
+ *
+ * i18n keys the app's bundles must define, besides those of
+ * `ef-localized-input`:
+ *
+ * | key | fr | ar | en |
+ * |---|---|---|---|
+ * | `ef_seo_fields_title_label` | Titre SEO | عنوان SEO | SEO title |
+ * | `ef_seo_fields_description_label` | Description SEO | وصف SEO | SEO description |
+ * | `ef_seo_fields_counter_hint` | Au-delà de {{max}} caractères, Google coupe le texte. | بعد {{max}} حرفا، يقتطع Google النص. | Past {{max}} characters, Google cuts the text. |
+ * | `ef_seo_fields_over_hint` | Le texte dépasse {{max}} caractères. | النص يتجاوز {{max}} حرفا. | The text is over {{max}} characters. |
+ * | `ef_seo_fields_preview` | Aperçu dans Google | المعاينة في Google | Google preview |
+ * | `ef_seo_fields_fallback_hint` | Vide : la boutique reprend le titre et la description. | فارغ: يستخدم المتجر العنوان والوصف. | Empty: the shop uses the title and description. |
  *
  * ```html
- * <ef-seo-fields [seoTitle]="p.seoTitle" ... [previewUrl]="url()" (seoChange)="patch($event)" />
+ * <ef-seo-fields [seoTitle]="p.seoTitle" [seoDescription]="p.seoDescription"
+ *     [fallbackTitle]="p.title" [fallbackDescription]="p.description"
+ *     [previewUrl]="url()" (seoChange)="patch($event)" />
  * ```
  */
 declare class EfSeoFieldsComponent {
-    readonly seoTitle: _angular_core.InputSignal<string | null | undefined>;
-    readonly seoDescription: _angular_core.InputSignal<string | null | undefined>;
-    readonly seoTitleTranslations: _angular_core.InputSignal<Record<string, string> | null | undefined>;
-    readonly seoDescriptionTranslations: _angular_core.InputSignal<Record<string, string> | null | undefined>;
+    readonly seoTitle: _angular_core.InputSignal<Partial<Record<string, string>> | null | undefined>;
+    readonly seoDescription: _angular_core.InputSignal<Partial<Record<string, string>> | null | undefined>;
     /** The entity's own texts, which the shop uses when SEO is empty. */
-    readonly fallbackTitle: _angular_core.InputSignal<string | null | undefined>;
-    readonly fallbackDescription: _angular_core.InputSignal<string | null | undefined>;
+    readonly fallbackTitle: _angular_core.InputSignal<Partial<Record<string, string>> | null | undefined>;
+    readonly fallbackDescription: _angular_core.InputSignal<Partial<Record<string, string>> | null | undefined>;
     /** The page address shown in the preview, computed by the app. */
     readonly previewUrl: _angular_core.InputSignal<string>;
     readonly titleMax: _angular_core.InputSignal<number>;
     readonly descriptionMax: _angular_core.InputSignal<number>;
     readonly titleAdvised: _angular_core.InputSignal<number>;
     readonly descriptionAdvised: _angular_core.InputSignal<number>;
-    readonly locales: _angular_core.InputSignal<readonly EfSeoLocale[]>;
+    /** Overrides the `EF_CONTENT_CULTURES` list for both fields. */
+    readonly cultures: _angular_core.InputSignal<readonly EfCulture[] | undefined>;
     readonly seoChange: _angular_core.OutputEmitterRef<EfSeoPatch>;
-    text(locale: string, field: Field): string;
-    /** Id of a counter, which the field it counts points at with `aria-describedby`. */
-    counterId(locale: string, field: Field): string;
-    private readonly uid;
-    /** French matches the backend property; the others are unique for the label link. */
-    name(locale: string, field: Field): string;
-    setText(locale: string, field: Field, value: string): void;
+    private readonly contentCultures;
+    /** The language the preview shows: the tenant's default if listed, else the first listed. */
+    protected readonly previewCode: _angular_core.Signal<string>;
     protected readonly previewTitle: _angular_core.Signal<string>;
     protected readonly previewDescription: _angular_core.Signal<string>;
+    private shown;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<EfSeoFieldsComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfSeoFieldsComponent, "ef-seo-fields", never, { "seoTitle": { "alias": "seoTitle"; "required": false; "isSignal": true; }; "seoDescription": { "alias": "seoDescription"; "required": false; "isSignal": true; }; "seoTitleTranslations": { "alias": "seoTitleTranslations"; "required": false; "isSignal": true; }; "seoDescriptionTranslations": { "alias": "seoDescriptionTranslations"; "required": false; "isSignal": true; }; "fallbackTitle": { "alias": "fallbackTitle"; "required": false; "isSignal": true; }; "fallbackDescription": { "alias": "fallbackDescription"; "required": false; "isSignal": true; }; "previewUrl": { "alias": "previewUrl"; "required": false; "isSignal": true; }; "titleMax": { "alias": "titleMax"; "required": false; "isSignal": true; }; "descriptionMax": { "alias": "descriptionMax"; "required": false; "isSignal": true; }; "titleAdvised": { "alias": "titleAdvised"; "required": false; "isSignal": true; }; "descriptionAdvised": { "alias": "descriptionAdvised"; "required": false; "isSignal": true; }; "locales": { "alias": "locales"; "required": false; "isSignal": true; }; }, { "seoChange": "seoChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfSeoFieldsComponent, "ef-seo-fields", never, { "seoTitle": { "alias": "seoTitle"; "required": false; "isSignal": true; }; "seoDescription": { "alias": "seoDescription"; "required": false; "isSignal": true; }; "fallbackTitle": { "alias": "fallbackTitle"; "required": false; "isSignal": true; }; "fallbackDescription": { "alias": "fallbackDescription"; "required": false; "isSignal": true; }; "previewUrl": { "alias": "previewUrl"; "required": false; "isSignal": true; }; "titleMax": { "alias": "titleMax"; "required": false; "isSignal": true; }; "descriptionMax": { "alias": "descriptionMax"; "required": false; "isSignal": true; }; "titleAdvised": { "alias": "titleAdvised"; "required": false; "isSignal": true; }; "descriptionAdvised": { "alias": "descriptionAdvised"; "required": false; "isSignal": true; }; "cultures": { "alias": "cultures"; "required": false; "isSignal": true; }; }, { "seoChange": "seoChange"; }, never, never, true, never>;
 }
 
+/**
+ * One owner-written text (a title, a description, an HTML body) in every
+ * content language: a pill tab per culture, the active culture's field below
+ * it, and the whole object out on every edit with blank cultures removed
+ * (ADR-050 section 7).
+ *
+ * - **Cultures** come from `EF_CONTENT_CULTURES` (the ERP provides them from
+ *   the tenant profile) unless `cultures` is set. The active tab is local and
+ *   starts on the default culture.
+ * - **Tabs** carry the `ef_localized_input_missing` note on every culture with
+ *   no text, the error tone on the default culture of a `required` field left
+ *   empty once the field is touched, changed or its form submitted, and the
+ *   dirty dot on cultures edited since the value arrived. Dirty detection
+ *   relies on the parent storing the emitted object by reference (the V2
+ *   signal pattern): a parent that clones the value resets the dots on every
+ *   edit, though it never loses text.
+ * - **Direction.** Each field gets its culture's `dir` and `lang`. In `html`
+ *   mode the source stays `ltr` for every culture (raw HTML in an `rtl`
+ *   textarea reads reversed) and the sanitised preview takes the culture's
+ *   direction.
+ * - **Rich mode** (`mode="rich"`) edits each culture with `ef-rich-text`, the
+ *   shared editor in `@elasticias/ui/rich-text`. The app turns it on once with
+ *   `provideEfRichText()` (and installs `quill`); without it the field falls
+ *   back to the `html` source and logs why in development, as it does when
+ *   the editor's chunk fails to load. With `advisedLength` the counter
+ *   counts the text a reader sees; with only `maxLength` it counts the
+ *   stored HTML, which is what the server measures. Neither caps typing in
+ *   this mode.
+ * - **Read-only cultures** are shown read-only (still focusable, so the hint
+ *   is read and the text can be copied) with
+ *   `ef_localized_input_read_only_hint` and the projected `[read-only-link]`;
+ *   their text still travels in the emitted object. `[efReadOnly]`, `[disabled]`
+ *   and a form's `disable()` disable every culture; the tabs stay usable so the
+ *   other languages can still be read.
+ * - **Forms.** A ControlValueAccessor (`[formControl]`, `formControlName`,
+ *   `[(ngModel)]`) as well as `[value]` + `(valueChangeEvent)`. With
+ *   `required`, the form control reports `required` while the default culture
+ *   is empty.
+ * - **Server errors** (ADR-010) come from the enclosing `[efServerErrors]`
+ *   scope. `<name>.<culture>` errors tint that culture's tab, show under its
+ *   field while it is active (the field links itself by name) and, from another
+ *   tab, show as a hint naming the languages in error; a new set of errors
+ *   moves to the first of them. `<name>` errors, or an explicit `[errors]`,
+ *   show under the field on every tab, as do errors for a language the field
+ *   does not list (`title.xx`). Messages are translated as keys. Keys: `ef_localized_input_errors_in_other`.
+ * - **Spoken limit.** `counterHintKey` is read with the counter (through
+ *   `aria-describedby`) and `counterOverKey` is announced politely when the
+ *   text passes the limit; both take `{{max}}`.
+ * - **Names.** Each culture's field is named `<name>.<culture>` (`title.ar`),
+ *   the key the backend reports a per-culture error under.
+ *
+ * i18n keys the app's bundles must define (the libs ship no JSON):
+ *
+ * | key | fr | ar | en |
+ * |---|---|---|---|
+ * | `ef_localized_input_culture_fr` | Français | الفرنسية | French |
+ * | `ef_localized_input_culture_ar` | Arabe | العربية | Arabic |
+ * | `ef_localized_input_culture_en` | Anglais | الإنجليزية | English |
+ * | `ef_localized_input_missing` | manquant | غير مكتوب | missing |
+ * | `ef_localized_input_cultures` | Langues du texte | لغات النص | Text languages |
+ * | `ef_localized_input_errors_in_other` | Erreur dans : | خطأ في: | Error in: |
+ * | `ef_localized_input_read_only_hint` | Ce texte se modifie ailleurs. | يُعدَّل هذا النص في مكان آخر. | This text is edited elsewhere. |
+ *
+ * ```html
+ * <ef-localized-input name="title" labelKey="product_title" required
+ *     [value]="product().title" (valueChangeEvent)="patch({ title: $event })"
+ *     [advisedLength]="60" [maxLength]="256" />
+ *
+ * <ef-localized-input name="title" [readOnlyCultures]="['fr']" ...>
+ *     <a read-only-link [routerLink]="catalogLink()">{{ 'store_open_catalog' | translate }}</a>
+ * </ef-localized-input>
+ * ```
+ */
+declare class EfLocalizedInputComponent implements ControlValueAccessor, DoCheck {
+    /** The camelCase backend property (`title`); each field is `<name>.<culture>`. */
+    readonly name: _angular_core.InputSignal<string>;
+    readonly value: _angular_core.InputSignal<Partial<Record<string, string>> | null | undefined>;
+    readonly mode: _angular_core.InputSignal<"html" | "textarea" | "text" | "rich">;
+    readonly rows: _angular_core.InputSignal<number>;
+    /** Hard cap, the server's limit. */
+    readonly maxLength: _angular_core.InputSignal<number | undefined>;
+    /** What the counter measures against (what a search engine shows, say). */
+    readonly advisedLength: _angular_core.InputSignal<number | undefined>;
+    /** The default culture must be filled. */
+    readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Cultures shown but not editable here, with the `[read-only-link]` slot. */
+    readonly readOnlyCultures: _angular_core.InputSignal<readonly string[]>;
+    /** Labels the field and names its tablist; without it the tablist is
+     *  named `ef_localized_input_cultures`. */
+    readonly labelKey: _angular_core.InputSignal<string>;
+    readonly placeholderKey: _angular_core.InputSignal<string>;
+    readonly hintKey: _angular_core.InputSignal<string>;
+    /** i18n key (with `{{max}}`) read out with the counter, for a limit that is advice rather than a cap. */
+    readonly counterHintKey: _angular_core.InputSignal<string>;
+    /** i18n key (with `{{max}}`) announced politely when the text goes past the limit. */
+    readonly counterOverKey: _angular_core.InputSignal<string>;
+    /** Field style in `text` mode only, named like ef-input-text's (`primeng`
+     *  or `comptoir`); the textarea, html and rich modes have one style.
+     *  `default` is the former name of `primeng`, kept for one release. */
+    readonly variant: _angular_core.InputSignal<"primeng" | "comptoir" | "default">;
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Messages for the whole field. Without it they come from the enclosing
+     * `[efServerErrors]` scope under `name`; an explicit list wins. The
+     * per-language messages (`<name>.<culture>`) always come from the scope.
+     */
+    readonly errors: _angular_core.InputSignal<string[] | null | undefined>;
+    /** Overrides the `EF_CONTENT_CULTURES` list for this field. */
+    readonly cultures: _angular_core.InputSignal<readonly EfCulture[] | undefined>;
+    /** The whole new object, trimmed, with blank cultures removed. */
+    readonly valueChangeEvent: _angular_core.OutputEmitterRef<Partial<Record<string, string>>>;
+    private readonly contentCultures;
+    private readonly readOnlyScope;
+    readonly ngControl: NgControl | null;
+    private readonly serverErrorsScope;
+    private readonly richLoader;
+    private readonly richType;
+    /** The editor's chunk failed to load (offline, a stale deploy). */
+    private readonly richFailed;
+    private readonly richHost;
+    /** `rich` without a provided editor renders the html source instead. */
+    protected readonly effectiveMode: _angular_core.Signal<"html" | "textarea" | "text" | "rich">;
+    private readonly parentForm;
+    private readonly host;
+    private readonly translateService;
+    /** The user typed in, or left, the field. */
+    private readonly interacted;
+    /** The form control is touched or dirty, or its form was submitted; read on every check. */
+    private readonly formTouched;
+    /** Errors wait for touch, a change or a submit, like every ef-* control. */
+    private readonly showErrors;
+    protected readonly uid: string;
+    /** The object this component last emitted; an echo of it is not new data. */
+    private lastEmitted;
+    /** The text as typed, blanks and spaces kept, so an echo never rewrites a field mid-word. */
+    private readonly raw;
+    /** What the dirty dots compare against: the last value that came from outside. */
+    private readonly baseline;
+    private readonly cleaned;
+    protected readonly list: _angular_core.Signal<readonly EfCulture[]>;
+    protected readonly defaultCode: _angular_core.Signal<string>;
+    private readonly selected;
+    protected readonly active: _angular_core.Signal<EfCulture | undefined>;
+    /** The active culture's code: unlike active(), equal when an equal culture list arrives. */
+    private readonly activeCode;
+    /** Server messages for the whole field (`title`). */
+    protected readonly fieldErrors: _angular_core.Signal<string[] | null>;
+    /** Every `<name>.<culture>` message the scope holds. */
+    private readonly allCultureErrors;
+    /** Server messages per language (`title.ar` gives `ar`), only for listed cultures. */
+    private readonly cultureErrors;
+    /** Messages for a language this field does not list (`title.xx`): shown with the whole field, never dropped. */
+    private readonly unlistedErrors;
+    /** Bumps when texts change, so translated messages follow the language. */
+    private readonly textsVersion;
+    /** The active language's messages, translated once here for the field below. */
+    protected readonly activeErrors: _angular_core.Signal<string[] | null>;
+    /** Cultures with a server error, in tab order. */
+    private readonly culturesInError;
+    /** Cultures in error other than the one on show, for the hint under the tabs. */
+    protected readonly errorsElsewhere: _angular_core.Signal<EfCulture[]>;
+    /** Changes only when the set of errors does, so a tab the user picked stays picked. */
+    private readonly errorSignature;
+    protected readonly tabItems: _angular_core.Signal<EfTabItem<string>[]>;
+    private readonly cvaDisabled;
+    /** Every culture is disabled: `[disabled]`, a form's `disable()`, or `[efReadOnly]`. */
+    readonly isDisabled: _angular_core.Signal<boolean>;
+    protected readonly activeReadOnly: _angular_core.Signal<boolean>;
+    protected readonly activeText: _angular_core.Signal<string>;
+    /**
+     * What the counter counts. Rich text against `advisedLength` counts the
+     * characters a reader sees; against `maxLength` alone it counts the stored
+     * HTML, because that is what the server's limit measures.
+     */
+    protected readonly activeLength: _angular_core.Signal<number>;
+    protected readonly labelId: string;
+    protected readonly counterLimit: _angular_core.Signal<number | undefined>;
+    protected readonly panelId: string;
+    protected readonly counterId: string;
+    private onChange;
+    private touched;
+    constructor();
+    private createRich;
+    protected tabId(code: string): string;
+    protected controlId(code: string): string;
+    protected select(code: string): void;
+    protected setText(code: string, text: string): void;
+    /** Touched when focus leaves the whole field, not when it moves from a tab to the text. */
+    protected onFocusOut(event: FocusEvent): void;
+    ngDoCheck(): void;
+    /** `{ required: true }` while a required field's default culture has no text. */
+    validateRequired(control: AbstractControl): ValidationErrors | null;
+    writeValue(v: LocalizedText | null): void;
+    registerOnChange(fn: (v: LocalizedText) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(disabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EfLocalizedInputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfLocalizedInputComponent, "ef-localized-input", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "advisedLength": { "alias": "advisedLength"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "readOnlyCultures": { "alias": "readOnlyCultures"; "required": false; "isSignal": true; }; "labelKey": { "alias": "labelKey"; "required": false; "isSignal": true; }; "placeholderKey": { "alias": "placeholderKey"; "required": false; "isSignal": true; }; "hintKey": { "alias": "hintKey"; "required": false; "isSignal": true; }; "counterHintKey": { "alias": "counterHintKey"; "required": false; "isSignal": true; }; "counterOverKey": { "alias": "counterOverKey"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "cultures": { "alias": "cultures"; "required": false; "isSignal": true; }; }, { "valueChangeEvent": "valueChangeEvent"; }, never, ["[read-only-link]"], true, never>;
+}
+
+/**
+ * Loads the rich text editor component that `ef-localized-input`'s `rich`
+ * mode renders. The editor lives in the `@elasticias/ui/rich-text` entry
+ * point so an app that never edits rich text neither bundles PrimeNG's Editor
+ * nor needs `quill` installed. Provide it with `provideEfRichText()` from that
+ * entry (the editor code is in the app's main bundle, Quill itself still loads
+ * lazily the first time an editor renders), or with your own loader to defer
+ * the editor code too:
+ *
+ * ```ts
+ * { provide: EF_RICH_TEXT, useValue: () => import('@elasticias/ui/rich-text').then(m => m.EfRichTextComponent) }
+ * ```
+ */
+declare const EF_RICH_TEXT: InjectionToken<() => Promise<Type<unknown>>>;
+/** Length of the text a reader sees in an HTML fragment, tags not counted. Browser only: it parses with `document`. */
+declare function plainTextLength(html: string | null | undefined): number;
+
 type EfFileRejectReason = 'size' | 'type';
 interface EfFileRejection {
     file: File;
@@ -7151,5 +7422,5 @@ declare class EfEmailMetricsCardComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<EfEmailMetricsCardComponent, "ef-email-metrics-card", never, { "metrics": { "alias": "metrics"; "required": false; "isSignal": true; }; "recentEvents": { "alias": "recentEvents"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; }, { "rangeChange": "rangeChange"; }, never, never, true, never>;
 }
 
-export { EF_BADGE_BG_COLORS, EF_BADGE_BG_LIGHT_COLORS, EF_BADGE_BORDER_COLORS, EF_BADGE_DEFAULTS, EF_BADGE_TEXT_COLORS, EF_CHART_PALETTE, EF_DATATABLE_ACTIONS_DEFAULTS, EF_DATATABLE_COLUMN_DEFAULTS, EF_DATATABLE_DEFAULTS, EF_DATA_CARD_MOBILE_LAYOUT, EF_HTML_PREVIEW_DEFAULT_TITLE_KEY, EF_SEO_DEFAULT_LOCALES, EF_STATUS_COLORS, EF_STATUS_COLOR_ALIASES, EfAboutDialogComponent, EfActivationFilterComponent, EfAppMainComponent, EfAppShellComponent, EfAppShellMobileComponent, EfAppTopComponent, EfBadgeComponent, EfBlockUiComponent, EfBlockableDivComponent, EfBottomSheetComponent, EfBuildStampComponent, EfBulkBarComponent, EfButtonComponent, EfButtonGroupComponent, EfCardComponent, EfChangeHistoryComponent, EfChangePasswordComponent, EfChartComponent, EfCheckboxComponent, EfClearButtonComponent, EfColumnHeaderTemplateDirective, EfColumnTemplateDirective, EfCompactPipe, EfConfirmDialogComponent, EfCurrencyPipe, EfDataCardComponent, EfDatatableActionBarComponent, EfDatatableComponent, EfDatepickerAdvancedComponent, EfDatepickerComponent, EfDetailToolbarComponent, EfDialogComponent, EfEmailMetricsCardComponent, EfEmptyStateComponent, EfFabComponent, EfFieldsetComponent, EfFileUploadComponent, EfFilterDrawerComponent, EfFilterPillComponent, EfFormGridComponent, EfHtmlPreviewComponent, EfIdentityThumbComponent, EfInputNumberComponent, EfInputTextComponent, EfKpiCardComponent, EfLabelComponent, EfModuleRailComponent, EfModuleSideComponent, EfMultiSelectComponent, EfOrderBuilderComponent, EfOrderSummaryComponent, EfOverflowTooltipDirective, EfPagerComponent, EfPasswordComponent, EfPdfPreviewComponent, EfPillGroupComponent, EfPresetPillComponent, EfPriceDisplayComponent, EfProductCatalogueComponent, EfProductCatalogueFilterComponent, EfProductPickerComponent, EfProductTypeaheadComponent, EfProfileChipComponent, EfProfileMenuComponent, EfPulseComponent, EfQuantitySelectorComponent, EfQuantityStepperComponent, EfRadioComponent, EfRankListComponent, EfReadOnlyDirective, EfRowActionsComponent, EfSearchToolbarComponent, EfSelectButtonComponent, EfSelectComponent, EfSeoFieldsComponent, EfSeoPreviewComponent, EfServerErrorsDirective, EfSessionIdleDialogComponent, EfShortcutsDialogComponent, EfSkeletonComponent, EfSmartBarComponent, EfStatsComponent, EfStatusChipComponent, EfTabPanelDirective, EfTabsComponent, EfTextareaComponent, EfThemeConfiguratorComponent, EfThemeToggleComponent, EfTimelineComponent, EfToastRegionComponent, EfToggleSwitchComponent, EfToolbarComponent, EfTooltipDirective, EfTotalsComponent, OrderEntityHelper, OrderLineItemHelper, TruncatePipe, buildChartConfig, defaultUnitPrice, getColumnAlignment, mergeColumnDefaults, resolveEfStatusColor };
+export { AbstractEfFormControl, EF_BADGE_BG_COLORS, EF_BADGE_BG_LIGHT_COLORS, EF_BADGE_BORDER_COLORS, EF_BADGE_DEFAULTS, EF_BADGE_TEXT_COLORS, EF_CHART_PALETTE, EF_DATATABLE_ACTIONS_DEFAULTS, EF_DATATABLE_COLUMN_DEFAULTS, EF_DATATABLE_DEFAULTS, EF_DATA_CARD_MOBILE_LAYOUT, EF_HTML_PREVIEW_DEFAULT_TITLE_KEY, EF_RICH_TEXT, EF_SEO_DEFAULT_LOCALES, EF_STATUS_COLORS, EF_STATUS_COLOR_ALIASES, EfAboutDialogComponent, EfActivationFilterComponent, EfAppMainComponent, EfAppShellComponent, EfAppShellMobileComponent, EfAppTopComponent, EfBadgeComponent, EfBlockUiComponent, EfBlockableDivComponent, EfBottomSheetComponent, EfBuildStampComponent, EfBulkBarComponent, EfButtonComponent, EfButtonGroupComponent, EfCardComponent, EfChangeHistoryComponent, EfChangePasswordComponent, EfChartComponent, EfCheckboxComponent, EfClearButtonComponent, EfColumnHeaderTemplateDirective, EfColumnTemplateDirective, EfCompactPipe, EfConfirmDialogComponent, EfCurrencyPipe, EfDataCardComponent, EfDatatableActionBarComponent, EfDatatableComponent, EfDatepickerAdvancedComponent, EfDatepickerComponent, EfDetailToolbarComponent, EfDialogComponent, EfEmailMetricsCardComponent, EfEmptyStateComponent, EfFabComponent, EfFieldsetComponent, EfFileUploadComponent, EfFilterDrawerComponent, EfFilterPillComponent, EfFormGridComponent, EfHtmlPreviewComponent, EfIdentityThumbComponent, EfInputNumberComponent, EfInputTextComponent, EfKpiCardComponent, EfLabelComponent, EfLocalizedInputComponent, EfModuleRailComponent, EfModuleSideComponent, EfMultiSelectComponent, EfOrderBuilderComponent, EfOrderSummaryComponent, EfOverflowTooltipDirective, EfPagerComponent, EfPasswordComponent, EfPdfPreviewComponent, EfPillGroupComponent, EfPresetPillComponent, EfPriceDisplayComponent, EfProductCatalogueComponent, EfProductCatalogueFilterComponent, EfProductPickerComponent, EfProductTypeaheadComponent, EfProfileChipComponent, EfProfileMenuComponent, EfPulseComponent, EfQuantitySelectorComponent, EfQuantityStepperComponent, EfRadioComponent, EfRankListComponent, EfReadOnlyDirective, EfRowActionsComponent, EfSearchToolbarComponent, EfSelectButtonComponent, EfSelectComponent, EfSeoFieldsComponent, EfSeoPreviewComponent, EfServerErrorsDirective, EfSessionIdleDialogComponent, EfShortcutsDialogComponent, EfSkeletonComponent, EfSmartBarComponent, EfStatsComponent, EfStatusChipComponent, EfTabPanelDirective, EfTabsComponent, EfTextareaComponent, EfThemeConfiguratorComponent, EfThemeToggleComponent, EfTimelineComponent, EfToastRegionComponent, EfToggleSwitchComponent, EfToolbarComponent, EfTooltipDirective, EfTotalsComponent, OrderEntityHelper, OrderLineItemHelper, TruncatePipe, buildChartConfig, defaultUnitPrice, getColumnAlignment, mergeColumnDefaults, plainTextLength, resolveEfStatusColor };
 export type { CatalogueProduct, CatalogueProductVariant, CategoryAssignment, CategoryGroup, CategoryItem, DatatableSearchEntity, DocumentConfig, EfAboutServer, EfBadgeColor, EfBadgeConfig, EfBadgeSize, EfBadgeVariant, EfButtonComptoirSeverity, EfButtonPrimeNGSeverity, EfButtonSeverity, EfChangeHistoryEntry, EfChangeHistoryFieldChange, EfChangeHistoryValueItem, EfChangePasswordSubmit, EfChartSeries, EfChartType, EfDataCardMobileLayout, EfDataCardRowAction, EfDataCardRowActionState, EfDatatableActions, EfDatatableColumn, EfDatatableColumnAlign, EfDatatableColumnType, EfDatatableConfig, EfDateFieldOutput, EfDateFieldValue, EfDatePreset, EfDialogAction, EfDialogSeverity, EfDialogSize, EfFabPosition, EfFileRejectReason, EfFileRejection, EfIdentityThumbSize, EfKpiDeltaTone, EfKpiSparkline, EfOrderPriceList, EfOrderRecipient, EfPillItem, EfPresetItem, EfProductPickerItem, EfProductPickerQuery, EfProfileMenuItem, EfRankRow, EfRowAction, EfSeoLocale, EfSeoPatch, EfSkeletonVariant, EfStatsRow, EfStatusColor, EfStatusReferenceItem, EfTabItem, EfTabsModule, EfTabsVariant, EfTimelineItem, EfTimelineState, EfToastRegionPosition, EfTotalsGrand, EfTotalsRow, HighlightSegment, OrderChangeInfo, OrderEntity, OrderLineItem, OrderProductsSummary, OrderSummaryItem, ProductCountGroup, ProductCountGroupLabel, ProductTypeaheadRow, ProductTypeaheadSelection, ProductWithCountGroup, SelectedFilter, ValidationResult };