ngwr 13.0.1 → 14.0.1

package/types/ngwr-mention.d.ts

@@ -105,6 +105,19 @@ declare class WrMention<T extends WrMentionItem = WrMentionItem> {
     private liveRegion;
     constructor();
     private announce;
+    /**
+     * True between `compositionstart` and `compositionend`.
+     *
+     * Detection must not run on the half-built text an IME leaves in the field:
+     * `@やま` is a reading on its way to `@山田`, and matching the reading opens a
+     * panel that then eats the Enter meant to accept the conversion. So the field
+     * is read once, on `compositionend`, when the text is real.
+     */
+    private composing;
+    /** @internal */
+    protected onCompositionStart(): void;
+    /** @internal */
+    protected onCompositionEnd(): void;
     /** @internal */
     protected onInput(): void;
     /** @internal */

package/types/ngwr-pagination-testing.d.ts

@@ -20,11 +20,11 @@ interface WrPaginationHarnessFilters extends BaseHarnessFilters {
     readonly label?: string | RegExp;
     /**
      * Match the page the pager announces as current via `aria-current="page"`. A
-     * pager announcing none — `currentPage` set below 1 — matches no value here
+     * pager announcing none — `page` set below 1 — matches no value here
      * rather than throwing, so one broken pager cannot fail a query for its
      * neighbour.
      */
-    readonly currentPage?: number;
+    readonly page?: number;
     /** Match only enabled (`false`) or only disabled (`true`) pagers. */
     readonly disabled?: boolean;
 }
@@ -179,7 +179,7 @@ declare class WrPaginationHarness extends ComponentHarness {
      * The page the pager announces as current, from `aria-current="page"`.
      *
      * Throws when no cell claims it. The window always keeps the current page on the
-     * strip, so getting here means `currentPage` is not one of the pages at all. The
+     * strip, so getting here means `page` is not one of the pages at all. The
      * component clamps a host write into `1..totalPages`, which leaves one survivor:
      * a fractional page, which is in range and matches no cell — and which leaves
      * every cell looking equally inactive to an assistive tech user.
@@ -191,7 +191,7 @@ declare class WrPaginationHarness extends ComponentHarness {
      * Throws when that page is not on the strip — a seven-slot window over twenty
      * pages simply has no cell for page 15, and a silent no-op there reads as
      * "navigation is broken" three assertions later. Step with {@link next} /
-     * {@link previous}, or move the host's own `currentPage` model.
+     * {@link previous}, or move the host's own `page` model.
      *
      * A disabled pager is still clicked; the component's own guard is what refuses
      * the move, so assert the page rather than assume it. Clicking the CURRENT page
@@ -233,14 +233,15 @@ declare class WrPaginationHarness extends ComponentHarness {
     /** Whether the pager shows its "X–Y of Z" label (the `showTotal` input). */
     hasTotal(): Promise<boolean>;
     /**
-     * The total label exactly as rendered, e.g. `1-10 of 95`.
+     * The total label exactly as rendered, e.g. `1–10 of 95`.
      *
-     * Both halves are localizable — the word between range and total comes from
-     * `ofLabel` or the `pagination.of` catalog entry — so a spec asserting the whole
-     * string should own the copy it asserts.
+     * The WHOLE string is one catalog entry (`pagination.range`) and the three
+     * numbers in it are formatted per `LOCALE_ID`, so a spec asserting the literal
+     * owns both the copy and the locale it asserts under. Note the range separator
+     * is an en dash, not the ASCII hyphen this used to print.
      *
      * Throws when the label is not rendered, which is a `showTotal` that was never
-     * set rather than a total of zero (a zero total still renders `0-0 of 0`).
+     * set rather than a total of zero (a zero total still renders `0–0 of 0`).
      */
     getTotalText(): Promise<string>;
     /** Whether the pager renders its page-size changer (the `showSizeChanger` input). */
@@ -277,7 +278,7 @@ declare class WrPaginationHarness extends ComponentHarness {
      * {@link getPageSize} reads them: `20 / page` and `20 / стр.` are the same option.
      * Throws when no option offers that size, naming what is on offer.
      *
-     * Changing the size can move the page — the component pulls `currentPage` back
+     * Changing the size can move the page — the component pulls `page` back
      * when the new size leaves it past the end — so re-read {@link getCurrentPage}
      * afterwards rather than assuming it held.
      */

package/types/ngwr-pagination.d.ts

@@ -42,13 +42,13 @@ type PageEntry = number | typeof ELLIPSIS;
 /**
  * Numbered page navigator with optional total / page-size controls.
  *
- * Two-way binds `currentPage` and `pageSize` via signal `model()` inputs.
+ * Two-way binds `page` and `pageSize` via signal `model()` inputs.
  *
  * @example
  * ```html
  * <wr-pagination
  *   [total]="120"
- *   [(currentPage)]="page"
+ *   [(page)]="page"
  *   [(pageSize)]="size"
  *   showTotal
  *   showSizeChanger
@@ -58,8 +58,16 @@ type PageEntry = number | typeof ELLIPSIS;
  * @see https://ngwr.dev/reference/components/pagination
  */
 declare class WrPagination {
-    /** Currently displayed page (1-based). Two-way bindable. */
-    readonly currentPage: _angular_core.ModelSignal<number>;
+    /**
+     * Currently displayed page (1-based). Two-way bindable.
+     *
+     * `page` rather than `currentPage` since v14, so this and `<wr-table>` — which
+     * renders one of these in its own footer — spell the two concepts they share
+     * one way each. It also names the output: a `model()` called `X` forces
+     * `(XChange)`, so the old name produced `(currentPageChange)` against the
+     * table's `(pageChange)`.
+     */
+    readonly page: _angular_core.ModelSignal<number>;
     /** Items per page. Two-way bindable. */
     readonly pageSize: _angular_core.ModelSignal<number>;
     /** Total item count across all pages. */
@@ -84,8 +92,6 @@ declare class WrPagination {
      * width, not the viewport). @default false
      */
     readonly responsive: _angular_core.InputSignalWithTransform<boolean, any>;
-    /** Localised text between range and total ("X–Y of Z"). Falls back to `pagination.of` then `'of'`. */
-    readonly ofLabel: _angular_core.InputSignal<string | null>;
     /** Previous-page button aria-label. Falls back to `pagination.prev`. */
     readonly prevLabel: _angular_core.InputSignal<string | null>;
     /** Next-page button aria-label. Falls back to `pagination.next`. */
@@ -95,7 +101,6 @@ declare class WrPagination {
     /** Accessible name for the `role="navigation"` host. Falls back to `pagination.label`. */
     readonly label: _angular_core.InputSignal<string | null>;
     /** Resolved labels. */
-    protected readonly resolvedOf: _angular_core.Signal<string>;
     protected readonly resolvedPrev: _angular_core.Signal<string>;
     protected readonly resolvedNext: _angular_core.Signal<string>;
     protected readonly resolvedItemsPerPage: _angular_core.Signal<string>;
@@ -113,7 +118,7 @@ declare class WrPagination {
     protected readonly totalPages: _angular_core.Signal<number>;
     /**
      * Internal: where the previous arrow goes. Clamped to the end of the valid
-     * range rather than being a plain `currentPage() - 1`, because the page can
+     * range rather than being a plain `page() - 1`, because the page can
      * legitimately sit past that end while `total` is 0 (see the guard effect).
      * From page 5 of one page, `goTo(4)` is refused as out of range, so the arrow
      * was enabled and did nothing — and under `responsive` on a narrow box the
@@ -122,8 +127,32 @@ declare class WrPagination {
      * past-the-end refusal keeps working as the backstop it is.
      */
     protected readonly prevPage: _angular_core.Signal<number>;
-    /** Internal: "X–Y of Z" string. */
+    /**
+     * Internal: the "1–10 of 235" line, as ONE catalog template.
+     *
+     * It used to be `` `${start}-${end} ${of} ${total}` ``, which localised the
+     * word in the middle and nothing else: the ASCII hyphen between the bounds and
+     * the operand order were both frozen in TypeScript, so ja-JP and ar-SA got
+     * English word order and no language could change the range separator. The
+     * three numbers go through `Intl.NumberFormat` for the same reason the total
+     * beside them does — a five-figure total needs the locale's grouping, and
+     * ar-SA needs its own digits.
+     *
+     * The `ofLabel` input is gone with it: an input for the middle word is the
+     * concatenation, re-offered as API.
+     */
     protected readonly rangeLabel: _angular_core.Signal<string>;
+    /** Internal: the compact pager's `1 / 24`, likewise a catalog template. */
+    protected readonly compactLabel: _angular_core.Signal<string>;
+    private readonly rangeText;
+    private readonly compactText;
+    private readonly locale;
+    /**
+     * Grouped per `LOCALE_ID`. Only the range and the compact pager go through
+     * this — a page NUMBER on a button is an identifier, and `1,024` on a button
+     * reads as two things.
+     */
+    private number;
     /**
      * Internal: page list with ellipses. Window of 7 visible page slots.
      *
@@ -142,7 +171,7 @@ declare class WrPagination {
     constructor();
     protected onSizeChange(size: unknown): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrPagination, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrPagination, "wr-pagination", never, { "currentPage": { "alias": "currentPage"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "total": { "alias": "total"; "required": false; "isSignal": true; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; "isSignal": true; }; "showSizeChanger": { "alias": "showSizeChanger"; "required": false; "isSignal": true; }; "showTotal": { "alias": "showTotal"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "responsive": { "alias": "responsive"; "required": false; "isSignal": true; }; "ofLabel": { "alias": "ofLabel"; "required": false; "isSignal": true; }; "prevLabel": { "alias": "prevLabel"; "required": false; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": false; "isSignal": true; }; "itemsPerPageLabel": { "alias": "itemsPerPageLabel"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "currentPage": "currentPageChange"; "pageSize": "pageSizeChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrPagination, "wr-pagination", never, { "page": { "alias": "page"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "total": { "alias": "total"; "required": false; "isSignal": true; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; "isSignal": true; }; "showSizeChanger": { "alias": "showSizeChanger"; "required": false; "isSignal": true; }; "showTotal": { "alias": "showTotal"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "responsive": { "alias": "responsive"; "required": false; "isSignal": true; }; "prevLabel": { "alias": "prevLabel"; "required": false; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": false; "isSignal": true; }; "itemsPerPageLabel": { "alias": "itemsPerPageLabel"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "page": "pageChange"; "pageSize": "pageSizeChange"; }, never, never, true, never>;
 }
 
 export { WrPagination };

package/types/ngwr-popconfirm.d.ts

@@ -64,7 +64,7 @@ declare class WrPopconfirm {
      */
     private isRtl;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrPopconfirm, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<WrPopconfirm, "[wrPopconfirm]", never, { "message": { "alias": "wrPopconfirm"; "required": true; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "confirmText": { "alias": "confirmText"; "required": false; "isSignal": true; }; "cancelText": { "alias": "cancelText"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "confirmColor": { "alias": "confirmColor"; "required": false; "isSignal": true; }; }, { "confirmed": "confirmed"; "cancelled": "cancelled"; }, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<WrPopconfirm, "[wrPopconfirm]", ["wrPopconfirm"], { "message": { "alias": "wrPopconfirm"; "required": true; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "confirmText": { "alias": "confirmText"; "required": false; "isSignal": true; }; "cancelText": { "alias": "cancelText"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "confirmColor": { "alias": "confirmColor"; "required": false; "isSignal": true; }; }, { "confirmed": "confirmed"; "cancelled": "cancelled"; }, never, never, true, never>;
 }
 
 /**

package/types/ngwr-popover.d.ts

@@ -111,7 +111,7 @@ declare class WrPopover {
      */
     private isRtl;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrPopover, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<WrPopover, "[wrPopover]", never, { "content": { "alias": "wrPopover"; "required": true; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "trigger": { "alias": "trigger"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "showDelay": { "alias": "showDelay"; "required": false; "isSignal": true; }; "hideDelay": { "alias": "hideDelay"; "required": false; "isSignal": true; }; "responsive": { "alias": "responsive"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "opened": "opened"; "closed": "closed"; }, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<WrPopover, "[wrPopover]", ["wrPopover"], { "content": { "alias": "wrPopover"; "required": true; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "trigger": { "alias": "trigger"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "showDelay": { "alias": "showDelay"; "required": false; "isSignal": true; }; "hideDelay": { "alias": "hideDelay"; "required": false; "isSignal": true; }; "responsive": { "alias": "responsive"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "opened": "opened"; "closed": "closed"; }, never, never, true, never>;
 }
 
 export { WrPopover };

package/types/ngwr-rating.d.ts

@@ -4,8 +4,13 @@ import { FormValueControl } from '@angular/forms/signals';
 
 /**
  * Star rating input. Click or hover to set a value; supports half-star
- * increments via `step="0.5"`. Value is `number | null` (clamped to
- * `[0, count]`).
+ * increments via `step="0.5"`. Value is `number | null`.
+ *
+ * `[0, count]` bounds what this control's OWN edits produce — a click, an arrow
+ * key, `End`. A value written from outside is displayed and announced clamped
+ * (a slider cannot report an `aria-valuenow` past its own `aria-valuemax`) and
+ * left in the model as it stands, the same rule `wr-slider` and
+ * `wr-input-number` follow.
  *
  * A signal-forms native control: it implements `FormValueControl<number | null>`,
  * so `[formField]` binds straight to its `value` model — no
@@ -68,8 +73,25 @@ declare class WrRating implements FormValueControl<number | null> {
      * an error message on an element nobody could focus.
      */
     protected readonly focusable: _angular_core.Signal<boolean>;
-    /** What we actually render — hover wins while hovering. */
+    /**
+     * What we actually render — hover wins while hovering.
+     *
+     * Clamped, because there is no such thing as drawing six stars in a row of
+     * five, and the same number is what `aria-valuenow` reports: a `role="slider"`
+     * whose value sits outside its own min / max is an invalid slider whatever the
+     * model holds. The MODEL is left alone — see the note above `fillFor` for why
+     * the clamp is not written back.
+     */
     protected readonly displayValue: _angular_core.Signal<number>;
+    /**
+     * What the slider REPORTS, and where the arrows start from.
+     *
+     * Deliberately not `displayValue`: a hover preview is a pointer affordance and
+     * must not be announced as the current value, and an arrow press after a hover
+     * has to step from the committed number rather than from wherever the mouse
+     * happened to rest.
+     */
+    protected readonly announcedValue: _angular_core.Signal<number>;
     protected readonly slots: _angular_core.Signal<number[]>;
     /**
      * Reading direction, for the two places it changes the answer: the arrows and
@@ -84,7 +106,6 @@ declare class WrRating implements FormValueControl<number | null> {
     /** The surrounding `<wr-form-field>`'s error state. @internal */
     protected readonly fieldAria: ngwr_form.WrFormFieldAria;
     protected readonly classes: _angular_core.Signal<string>;
-    constructor();
     /** Fill ratio for slot `i` in `[0, 1]` — drives the CSS clip width. */
     protected fillFor(i: number): number;
     protected onSlotMove(event: MouseEvent, index: number): void;

package/types/ngwr-segmented.d.ts

@@ -141,6 +141,7 @@ declare class WrSegmented<T = unknown> implements FormValueControl<T | null> {
      * because the field only publishes an id once it is showing something — announcing
      * "invalid" while pointing at nothing is worse than staying quiet.
      */
+    private readonly fieldAria;
     protected readonly describedBy: _angular_core.Signal<string | null>;
     protected readonly ariaInvalid: _angular_core.Signal<"true" | null>;
     /** Index of the selected option, or `-1` when nothing is selected. */

package/types/ngwr-select.d.ts

@@ -53,10 +53,12 @@ interface WrSelectOptionRegistration {
     readonly value: unknown;
     readonly disabled: boolean;
     /**
-     * Lazy label reader. Options render text via `<ng-content>`, so we
-     * read it at call time once Angular has settled the projected content.
+     * The option's text, as a signal. Options render it via `<ng-content>`, so it
+     * is read back off the DOM — and it has to be reactive, because the ordinary
+     * way it changes is a translation catalog landing after the first pass. A
+     * plain reader let the trigger cache the English fallback forever.
      */
-    readonly getLabel: () => string;
+    readonly label: Signal<string>;
     /**
      * The option's own element, when it has one. The keyboard cursor walks the
      * registry, and registration order is CREATION order — projected children are
@@ -104,8 +106,8 @@ interface WrSelectContext {
     /** Is the given option value currently selected? Handles both single and multi. */
     isSelected(value: unknown): boolean;
     /**
-     * Called when a child option is clicked. The label is read lazily
-     * via {@link WrSelectOptionRegistration.getLabel}, so callers don't
+     * Called when a child option is clicked. The label rides along on the
+     * registration ({@link WrSelectOptionRegistration.label}), so callers don't
      * need to thread it through.
      */
     selectOption(value: unknown): void;
@@ -225,15 +227,17 @@ declare class WrSelect implements FormValueControl<unknown>, WrSelectContext {
      */
     protected readonly controlId: _angular_core.Signal<string | null>;
     /**
-     * The field's error message, wired to the same element.
+     * The field's error message — or, failing that, its hint — wired to the same
+     * element, plus the invalid flag.
      *
-     * Without it the messages `<wr-form-field>` renders are visible and nothing else:
-     * a screen reader on the trigger never learns the field is invalid, nor what the
-     * message says. `aria-invalid` is keyed on the message EXISTING rather than on
-     * `errorKeys()`, because the field only publishes an id once it is showing
-     * something — announcing "invalid" while pointing at nothing is worse than
-     * staying quiet.
-     */
+     * Without it the copy `<wr-form-field>` renders is visible and nothing else: a
+     * screen reader on the trigger never learns the field is invalid, nor what the
+     * message says. Composed by `useFormFieldAria()` rather than read off the field
+     * here, so the trigger picks up the hint the same way the other value controls
+     * do and `aria-invalid` stays keyed on the error rather than on "is anything
+     * describing me".
+     */
+    private readonly fieldAria;
     protected readonly describedBy: _angular_core.Signal<string | null>;
     protected readonly ariaInvalid: _angular_core.Signal<"true" | null>;
     /**
@@ -510,7 +514,19 @@ declare class WrSelect implements FormValueControl<unknown>, WrSelectContext {
     /** Id of the active option (for `aria-activedescendant`). */
     readonly activeOptionId: _angular_core.Signal<string | null>;
     protected readonly open: _angular_core.WritableSignal<boolean>;
-    protected readonly selectedLabel: _angular_core.WritableSignal<string | null>;
+    /**
+     * Trigger label for single mode. Multi reads `selectedChips` instead.
+     *
+     * A `computed`, and that is the whole point. It used to be a `signal` written
+     * from an effect keyed on `value` / `registry` / `isMulti` / `displayWith` —
+     * not one of which moves when the OPTION'S OWN TEXT does, and that text is
+     * projected content whose ordinary way of changing is a translation catalog
+     * landing a microtask after the first pass. The trigger kept the English
+     * fallback while the open panel beside it showed the translation. The
+     * registration now carries the label as a signal, so a late catalog and a
+     * runtime locale switch both repaint the trigger with the panel.
+     */
+    protected readonly selectedLabel: _angular_core.Signal<string | null>;
     /**
      * Selected chips (multi + tag modes). Multi reads labels from the
      * registered `<wr-option>` children; tag uses each raw string as
@@ -591,8 +607,41 @@ declare class WrSelect implements FormValueControl<unknown>, WrSelectContext {
     protected virtualRowId(i: number): string;
     /** The virtual scroll container inside the overlay panel, if attached. */
     private get vlistElement();
-    /** Scroll filtered index `i` just into view (sets the `scrollTop` signal synchronously). */
+    /** The scrolling listbox inside the overlay panel, if attached. */
+    private get panelElement();
+    /**
+     * Scroll the ordered index `i` just into view. Two implementations, because the
+     * two panels scroll different elements and know the row geometry in different
+     * ways — the virtual list is index maths against a measured row height, the
+     * projected list has to read the row it is moving to.
+     *
+     * The non-virtual half is not an optimisation, it is the whole keyboard
+     * contract: `activeIndex` drives `aria-activedescendant`, and NOTHING else
+     * moves a projected panel, because the rows never take DOM focus. Without it
+     * End on a 250-option `mode="search"` panel announced Zimbabwe while the panel
+     * sat at `scrollTop` 0 with the cursor 9 218 px below the fold, and Enter then
+     * committed a row the user could not see.
+     */
     private ensureVisible;
+    /**
+     * Scroll the projected row at ordered index `i` just into view.
+     *
+     * Geometry is READ rather than computed: projected `<wr-option>` rows are
+     * consumer content, so they are not a uniform height the way a virtual row is
+     * — a row with a description, an icon or a wrapped label is taller than its
+     * neighbours, and index maths would land the panel next to the cursor instead
+     * of on it. The offset is taken relative to the panel's own scroll content
+     * (`rect.top` difference plus the current `scrollTop`) rather than from
+     * `offsetTop`, which is measured against whichever ancestor happens to be
+     * positioned.
+     *
+     * `scrollTop` is written directly instead of `scrollTo`, so the write is
+     * observable in a spec — jsdom implements the property and does not implement
+     * the method. It still reads as a no-op there, since every jsdom rect is 0×0:
+     * a spec asserting a scroll has to stub `getBoundingClientRect` and
+     * `clientHeight` on the panel and the row, which `select.spec.ts` does.
+     */
+    private ensureRowVisible;
     /**
      * Count of registered options that pass the current search filter.
      * Hides the noResults state when the panel has at least one visible row.
@@ -619,6 +668,17 @@ declare class WrSelect implements FormValueControl<unknown>, WrSelectContext {
     protected focusSearchInput(): void;
     protected onChipsInput(event: Event): void;
     protected onChipsKeydown(event: KeyboardEvent): void;
+    /**
+     * True when the key belongs to an open IME conversion — and, when it does,
+     * stops the event on its way out.
+     *
+     * Not acting is not enough here. The panel closes on Escape from CDK's overlay
+     * keyboard dispatcher, one listener on `<body>` in the bubble phase, so a
+     * handler that merely returns still loses the panel: the Japanese user meant
+     * to cancel a reading and lost the query with it. Stopping the event at the
+     * field that owns the composition is the only place that reaches both.
+     */
+    private imeOwnsKey;
     protected onChipsFocus(): void;
     protected onChipsPaste(event: ClipboardEvent): void;
     protected onChipsBlur(): void;
@@ -649,6 +709,7 @@ declare class WrSelect implements FormValueControl<unknown>, WrSelectContext {
     private readonly scrollStrategies;
     private readonly destroyRef;
     private readonly platformId;
+    private readonly injector;
     private overlayRef;
     constructor();
     isSelected(value: unknown): boolean;
@@ -724,22 +785,52 @@ declare class WrOption {
     readonly id: string;
     private readonly host;
     private readonly parent;
+    /**
+     * The option's own text, as a signal — the parent's trigger label and the
+     * client-side filter both read it from here.
+     *
+     * It has to be a signal, and a plain `textContent` read cannot be one. The
+     * label is PROJECTED content: the host template decides it, and the ordinary
+     * way it changes is that a `WrI18n` catalog lands a microtask after the first
+     * change-detection pass (`i18n/i18n.ts` writes every loader-backed catalog
+     * from `firstValueFrom(...).then(...)`). Read once and cached, a trigger sat
+     * on the English fallback while the open panel beside it showed the
+     * translation — visible in `wr-pagination`'s size changer, which prints
+     * `pagination.perPage` into each `<wr-option>`.
+     *
+     * Kept in step the way `wr-divider` keeps its own projected label: an
+     * `effect` and an `afterEveryRender`, and both are needed. The render hook is
+     * a hard no-op under SSR, so on its own the server would emit a trigger with
+     * no label at all; the effect is not gated that way and runs after the
+     * content has been projected. The effect on its own cannot follow text that
+     * moves later, because it reads nothing reactive to be re-run by.
+     *
+     * @internal
+     */
+    private readonly labelText;
+    private readonly label;
     /**
      * @internal — true when this option is currently selected. Works for
      * both single and multi-select parents via `WrSelectContext.isSelected`.
      */
-    protected readonly selected: _angular_core.Signal<boolean>;
+    protected readonly selected: Signal<boolean>;
     /** @internal — true when this option is the keyboard cursor target. */
-    protected readonly active: _angular_core.Signal<boolean>;
+    protected readonly active: Signal<boolean>;
     /**
      * @internal — searchable selects only. True when the parent has a query that
      * the option's text content does not match (case-insensitive substring).
      * Hidden options stay in the DOM so registration order survives but
      * collapse via CSS.
      */
-    protected readonly hidden: _angular_core.Signal<boolean>;
-    protected readonly classes: _angular_core.Signal<string>;
+    protected readonly hidden: Signal<boolean>;
+    protected readonly classes: Signal<string>;
     constructor();
+    /**
+     * Read the projected text back off the DOM. Setting the same string again is
+     * a signal no-op, so the render hook costs a `textContent` read and nothing
+     * else on the passes where nothing moved.
+     */
+    private syncLabel;
     protected onClick(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrOption, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrOption, "wr-option", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;

package/types/ngwr-slider.d.ts

@@ -137,6 +137,7 @@ declare class WrSlider implements FormValueControl<WrSliderValue> {
      * showing something — announcing "invalid" while pointing at nothing is worse
      * than staying quiet.
      */
+    private readonly fieldAria;
     protected readonly describedBy: _angular_core.Signal<string | null>;
     protected readonly ariaInvalid: _angular_core.Signal<"true" | null>;
     /**

package/types/ngwr-splitter-testing.d.ts

@@ -7,6 +7,13 @@ import { BaseHarnessFilters, ComponentHarness, HarnessPredicate } from '@angular
  * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
  */
 
+/**
+ * An arrow key, by the direction a user would say out loud — the parameter type
+ * of `WrSplitterHarness.pressArrow`, exported so a consumer's own test helper can
+ * name what it forwards. Arrows follow the VISUAL axis, so `left` shrinks the
+ * position in LTR and grows it in RTL.
+ */
+type WrSplitterArrowKey = 'left' | 'right' | 'up' | 'down';
 /** Narrows which `<wr-splitter>` a harness query matches. */
 interface WrSplitterHarnessFilters extends BaseHarnessFilters {
     /**
@@ -35,8 +42,6 @@ interface WrSplitterPaneSizes {
  * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
  */
 
-/** The four arrow keys, by the direction a user would say out loud. */
-type Arrow = 'left' | 'right' | 'up' | 'down';
 /**
  * Test harness for `<wr-splitter>` — two panes and the divider between them.
  *
@@ -135,7 +140,7 @@ declare class WrSplitterHarness extends ComponentHarness {
      *
      * `shift` is the coarse step: 10 instead of 1.
      */
-    pressArrow(arrow: Arrow, options?: {
+    pressArrow(arrow: WrSplitterArrowKey, options?: {
         shift?: boolean;
     }): Promise<void>;
     /** Press Home — jumping to `minPosition`, whatever the reading direction. */
@@ -171,4 +176,4 @@ declare class WrSplitterHarness extends ComponentHarness {
 }
 
 export { WrSplitterHarness };
-export type { WrSplitterHarnessFilters, WrSplitterPaneSizes };
+export type { WrSplitterArrowKey, WrSplitterHarnessFilters, WrSplitterPaneSizes };

package/types/ngwr-squircle.d.ts

@@ -107,7 +107,7 @@ declare class WrSquircle {
     private apply;
     private clear;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrSquircle, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<WrSquircle, "[wrSquircle]", never, { "radius": { "alias": "radius"; "required": false; "isSignal": true; }; "smoothing": { "alias": "smoothing"; "required": false; "isSignal": true; }; "enabled": { "alias": "enabled"; "required": false; "isSignal": true; }; "borderWidth": { "alias": "borderWidth"; "required": false; "isSignal": true; }; "borderColor": { "alias": "borderColor"; "required": false; "isSignal": true; }; "corners": { "alias": "corners"; "required": false; "isSignal": true; }; }, { "enabled": "enabledChange"; "borderWidth": "borderWidthChange"; "borderColor": "borderColorChange"; "corners": "cornersChange"; }, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<WrSquircle, "[wrSquircle]", ["wrSquircle"], { "radius": { "alias": "radius"; "required": false; "isSignal": true; }; "smoothing": { "alias": "smoothing"; "required": false; "isSignal": true; }; "enabled": { "alias": "enabled"; "required": false; "isSignal": true; }; "borderWidth": { "alias": "borderWidth"; "required": false; "isSignal": true; }; "borderColor": { "alias": "borderColor"; "required": false; "isSignal": true; }; "corners": { "alias": "corners"; "required": false; "isSignal": true; }; }, { "enabled": "enabledChange"; "borderWidth": "borderWidthChange"; "borderColor": "borderColorChange"; "corners": "cornersChange"; }, never, never, true, never>;
 }
 
 /**

package/types/ngwr-statistic.d.ts

@@ -59,10 +59,30 @@ declare class WrStatistic {
      * Use `deltaSuffix` to change the trailing unit.
      */
     readonly delta: _angular_core.InputSignalWithTransform<number | null, unknown>;
-    /** Unit appended to the delta value. @default '%' */
-    readonly deltaSuffix: _angular_core.InputSignal<string>;
+    /** Unit appended to the delta value. Falls back to `statistic.deltaSuffix`, then `'%'`. */
+    readonly deltaSuffix: _angular_core.InputSignal<string | null>;
     protected readonly hasDelta: _angular_core.Signal<boolean>;
     protected readonly deltaDirection: _angular_core.Signal<"up" | "down" | "flat">;
+    protected readonly resolvedDeltaSuffix: _angular_core.Signal<string>;
+    /** `{{value}}{{suffix}}` — the join, so a locale owns the space before the unit. */
+    private readonly deltaFormat;
+    /**
+     * The delta chip, e.g. `+12.4%`.
+     *
+     * It was `` `${sign}${d}${suffix}` ``, printed one line under a value that
+     * goes through `Intl.NumberFormat` — so the two disagreed inside one
+     * component: ar-SA showed `١٬٢٣٤٬٥٦٧٫٨٩` above a Latin `12.4%`, and de-DE
+     * `1.234.567,89` above `+12.4%`. The sign comes from `signDisplay`, which also
+     * fixes the RTL half of it: `+` written by hand is a neutral character that
+     * the BiDi algorithm moves to the other end of the number.
+     *
+     * The digit count is taken from the number rather than from `precision()`,
+     * which describes the VALUE and not the delta — so what renders is the same
+     * digits as before, in the locale's own numerals. One exception, and it is an
+     * improvement rather than a regression: a magnitude JavaScript prints in
+     * exponent notation (`1e-7`, `1e+21`) used to reach the DOM that way and is
+     * now formatted as a number.
+     */
     protected readonly deltaText: _angular_core.Signal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrStatistic, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrStatistic, "wr-statistic", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "prefix": { "alias": "prefix"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "precision": { "alias": "precision"; "required": false; "isSignal": true; }; "animate": { "alias": "animate"; "required": false; "isSignal": true; }; "duration": { "alias": "duration"; "required": false; "isSignal": true; }; "delta": { "alias": "delta"; "required": false; "isSignal": true; }; "deltaSuffix": { "alias": "deltaSuffix"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;

package/types/ngwr-storage.d.ts

@@ -14,6 +14,9 @@ import * as ngwr_storage from 'ngwr/storage';
  *   lazily on the next `get` / `watch` read.
  * - **Reactive watch** — `watch(key)` returns a `Signal` that updates on
  *   local writes and cross-tab `storage` events.
+ * - **On-disk format** — values are wrapped in a {@link WrStorageEnvelope}
+ *   (`{"v":…,"e":…}`) while `json` is on. Anything reading the same key from
+ *   outside Angular has to unwrap it.
  *
  * SSR-safe: the default engine factory returns an in-memory shim when
  * `localStorage` is unavailable, so reads always work.
@@ -60,6 +63,11 @@ declare class WrStorage {
     /**
      * Write `value` at `key`. Per-call `ttl` (ms) overrides the config
      * default. JSON-serializable values only when `json` is on (the default).
+     *
+     * What lands in the engine is a {@link WrStorageEnvelope} —
+     * `{"v":<value>}`, plus `"e"` when a TTL applies — not the bare value. Code
+     * outside Angular that reads the same key has to unwrap it; see the envelope's
+     * own docs for the exact format.
      */
     set<T = unknown>(key: string, value: T, opts?: {
         ttl?: number;
@@ -118,6 +126,36 @@ interface WrStorageConfig {
 }
 /** Fully-resolved config (all defaults filled). @internal */
 type WrStorageConfigResolved = Required<WrStorageConfig>;
+/**
+ * The **on-disk format** `WrStorage` writes while `json` is on (the default).
+ *
+ * Public because it is a wire format, not an implementation detail: the value in
+ * `localStorage` is `JSON.stringify(envelope)`, so anything reading the same key
+ * from outside Angular — a pre-paint theme script in `index.html`, a service
+ * worker, a native shell, another framework on the same origin — has to know
+ * that a stored `'dark'` is spelled `{"v":"dark"}` and not `"dark"`. Left
+ * undocumented, the only way to learn that was to read the bundle.
+ *
+ * `e` is an absolute expiry in epoch milliseconds, written only when a TTL
+ * applies; a value past it reads as absent and is removed on the next `get`.
+ * A key holding anything else — a bare JSON value, or a string that is not JSON
+ * at all — is returned as it stands, so keys written by non-ngwr code keep
+ * working.
+ *
+ * @example
+ * ```jsonc
+ * // localStorage['wr-theme']
+ * { "v": "dark" }
+ * // localStorage['cart'], written with { ttl: 60_000 }
+ * { "v": [{ "sku": "a1" }], "e": 1767225600000 }
+ * ```
+ */
+interface WrStorageEnvelope<T = unknown> {
+    /** The stored value, as handed to `set()`. */
+    readonly v: T;
+    /** Absolute expiry, epoch ms. Absent when the write carried no TTL. */
+    readonly e?: number;
+}
 
 declare const DEFAULT_WR_STORAGE_CONFIG: WrStorageConfigResolved;
 declare const WR_STORAGE_CONFIG: InjectionToken<Required<ngwr_storage.WrStorageConfig>>;
@@ -185,4 +223,4 @@ interface ProvideWrStorageOptions extends WrStorageConfig {
 declare function provideWrStorage(options?: ProvideWrStorageOptions): EnvironmentProviders;
 
 export { DEFAULT_WR_STORAGE_CONFIG, WR_STORAGE_CONFIG, WR_STORAGE_ENGINE, WrStorage, createMemoryStorage, provideWrStorage };
-export type { ProvideWrStorageOptions, WrStorageConfig, WrStorageConfigResolved, WrStorageEngine };
+export type { ProvideWrStorageOptions, WrStorageConfig, WrStorageConfigResolved, WrStorageEngine, WrStorageEnvelope };