ngwr 10.2.0 → 11.0.0

package/fesm2022/ngwr-pagination-testing.mjs

@@ -0,0 +1,389 @@
+import { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
+import { WrButtonHarness } from 'ngwr/button/testing';
+import { WrSelectHarness } from 'ngwr/select/testing';
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * Test harness for `<wr-pagination>` — the numbered strip, its two step controls,
+ * the total label and the page-size changer.
+ *
+ * The strip is not the page list: it is a WINDOW over it, at most seven pages wide,
+ * with an `…` standing in for every page it skipped. So "which pages can I click"
+ * and "how many pages are there" are different questions and this harness keeps
+ * them apart —
+ * {@link getPages} answers the first, {@link getTotalPages} the second, and
+ * {@link getStrip} shows the gaps for what they are. A gap is a `<span>`, not a
+ * control; counting the strip's children as pages is the mistake this API exists to
+ * make impossible.
+ *
+ * **Which page is current has two answers, and this reads the ARIA one.** The
+ * current cell is also PAINTED — the template binds
+ * `[color]="isCurrent(page) ? 'primary' : null"`, so `.wr-btn--primary` sits on it
+ * too. But colour is a theming decision (`ngwr/config` names this very binding as
+ * the reason it ships no app-wide `color` default), while `aria-current="page"` is
+ * the navigation contract: it is what a screen-reader user hears, what the
+ * component's own spec pins, and the only one of the two that still means
+ * "you are here" after a restyle. A harness that read the class would be reporting
+ * on the paint.
+ *
+ * **No roving tab stop to disambiguate.** Every cell is a `<wr-btn>` ELEMENT with
+ * its own tab stop (`tabindex="0"`, dropped only while the control is off), so the
+ * pager has no separate "focused" item that could drift from the current page —
+ * unlike a tab strip or a radio group, there is one active state here and
+ * {@link getCurrentPage} is it.
+ *
+ * Composed rather than re-queried: the cells and step controls are driven through
+ * {@link WrButtonHarness}, which already knows how a `<wr-btn>` says it is off —
+ * both the `disabled` attribute (written on every shape, though inert on a custom
+ * element) and `aria-disabled`, in that order — and the size changer through
+ * {@link WrSelectHarness}, whose panel is a portal in the overlay container and
+ * nowhere inside the pager.
+ *
+ * jsdom notes: every method here is a class / attribute read or a no-arg click, so
+ * none of it needs layout. Two things are therefore invisible in a unit test and
+ * deliberately absent from this API — the responsive collapse, which is a container
+ * query ({@link isResponsive} reports only that it is ALLOWED), and the compact
+ * `‹ 3 / 10 ›` pager it swaps in, which is `aria-hidden` decoration duplicating
+ * {@link getCurrentPage} and {@link getTotalPages} and which a real browser would
+ * read as empty text while CSS keeps it hidden.
+ *
+ * @example
+ * ```ts
+ * const pager = await loader.getHarness(WrPaginationHarness);
+ *
+ * expect(await pager.getPages()).toEqual([1, 2, 3, 4, 5, 10]);
+ * await pager.goToPage(3);
+ * expect(await pager.getCurrentPage()).toBe(3);
+ * ```
+ *
+ * @see https://ngwr.dev/guides/testing
+ */
+class WrPaginationHarness extends ComponentHarness {
+    static hostSelector = 'wr-pagination';
+    /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */
+    static with(options = {}) {
+        return new HarnessPredicate(WrPaginationHarness, options)
+            .addOption('label', options.label, (harness, label) => HarnessPredicate.stringMatches(harness.getLabel(), label))
+            .addOption('currentPage', options.currentPage, async (harness, page) => {
+            // The nullable read on purpose: the throwing getter would reject the whole
+            // query over one pager that announces no current page, taking its
+            // well-behaved neighbours down with it.
+            return (await harness.currentPageOrNull()) === page;
+        })
+            .addOption('disabled', options.disabled, async (harness, disabled) => (await harness.isDisabled()) === disabled);
+    }
+    /** The numbered cells, in DOM order — ascending, and never a gap. */
+    pageCells = this.locatorForAll(WrButtonHarness.with({ selector: '.wr-pagination__page' }));
+    /**
+     * The two controls bracketing the strip: previous, then next.
+     *
+     * Located by POSITION, not by their labels. `prevLabel` / `nextLabel` are inputs
+     * and both fall back to the `pagination.prev` / `pagination.next` catalog entries,
+     * so an English `aria-label` match works right up until someone ships a locale —
+     * whereas the nav's shape (one step control, the strip, one step control) is
+     * structural. `:not(.wr-pagination__page)` is what keeps the cells out of it.
+     */
+    stepControls = this.locatorForAll(WrButtonHarness.with({ selector: '.wr-pagination__nav > wr-btn:not(.wr-pagination__page)' }));
+    /** Both kinds of strip slot, in DOM order — cells and the gaps between them. */
+    stripSlots = this.locatorForAll('.wr-pagination__page, .wr-pagination__ellipsis');
+    totalLabel = this.locatorForOptional('.wr-pagination__total');
+    sizeChanger = this.locatorForOptional(WrSelectHarness.with({ selector: '.wr-pagination__size' }));
+    /**
+     * The accessible name of the `role="navigation"` landmark.
+     *
+     * `''` only if the landmark lost its name, which is a bug rather than a state: a
+     * page with two unnamed pagers gives a screen-reader user two identical
+     * "navigation" landmarks.
+     */
+    async getLabel() {
+        return (await (await this.host()).getAttribute('aria-label')) ?? '';
+    }
+    /**
+     * The size the pager RENDERS at, from its host modifier.
+     *
+     * The modifier is always emitted — `sm` included — so the fall-through below is
+     * only ever reached for the default, and a size the strip is not wearing cannot
+     * come back from here.
+     *
+     * The STRIP resolves nothing through `provideWrConfig()`, which is worth knowing
+     * before an app-wide default is blamed for a cell size: the pager passes its own
+     * `size` down to every `<wr-btn>` explicitly, so a configured `button.size` never
+     * reaches a cell. The page-size changer is the exception and not covered by this
+     * value — it is a bare `<wr-select>`, so `provideWrConfig({ select: … })` does
+     * reach it.
+     */
+    async getSize() {
+        const host = await this.host();
+        if (await host.hasClass('wr-pagination--lg'))
+            return 'lg';
+        if (await host.hasClass('wr-pagination--md'))
+            return 'md';
+        return 'sm';
+    }
+    /**
+     * Whether the pager is ALLOWED to collapse into its compact pager.
+     *
+     * Whether it HAS collapsed is a container query on the control's own box, and a
+     * unit test has no layout for one to answer — assert this input in jsdom and the
+     * reflow itself in a real browser.
+     */
+    async isResponsive() {
+        return (await this.host()).hasClass('wr-pagination--responsive');
+    }
+    /**
+     * Whether the whole control refuses interaction.
+     *
+     * Read from the host modifier, because a `role="navigation"` landmark has no ARIA
+     * disabled state to prefer — the per-control answer lives on the buttons
+     * themselves (`disabled` plus `aria-disabled` on each), which is what
+     * {@link isPreviousDisabled} and {@link isNextDisabled} read.
+     */
+    async isDisabled() {
+        return (await this.host()).hasClass('wr-pagination--disabled');
+    }
+    /**
+     * The whole strip in DOM order: a `number` for every page cell, and the gap
+     * marker's own text (`…`) for every ellipsis.
+     *
+     * The marker is read from the DOM rather than compared against a literal, so a
+     * component that changes what it draws in a gap changes this too instead of
+     * quietly reporting a page.
+     */
+    async getStrip() {
+        const slots = await this.stripSlots();
+        return Promise.all(slots.map(async (slot) => {
+            const text = (await slot.text()).trim();
+            return (await slot.hasClass('wr-pagination__ellipsis')) ? text : Number(text);
+        }));
+    }
+    /**
+     * The pages that can be clicked right now, ascending. Gaps are not pages and are
+     * not here — `[1, 8, 9, 10, 11, 12, 20]` for a twenty-page list sitting on 10.
+     */
+    async getPages() {
+        const cells = await this.pageCells();
+        return Promise.all(cells.map(async (cell) => Number(await cell.getText())));
+    }
+    /**
+     * How many pages there are — not how many are on the strip.
+     *
+     * Taken from the LAST cell, which the window always pins to the final page (the
+     * first is pinned the same way), so this survives the gap that usually precedes
+     * it. Deliberately not read from the compact `3 / 10` pager: that span is
+     * `aria-hidden` and CSS-hidden outside responsive mode, so a browser-based
+     * harness environment would read it as empty.
+     */
+    async getTotalPages() {
+        const pages = await this.getPages();
+        const last = pages.at(-1);
+        if (last === undefined) {
+            throw new Error('WrPaginationHarness.getTotalPages(): the strip has no page cells at all. The pager offers page ' +
+                '1 even for an empty list, so this is a rendering failure rather than an empty state.');
+        }
+        return last;
+    }
+    /**
+     * 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 — it
+     * is below 1, or not a whole number. The component clamps a page ABOVE the last
+     * one and nothing else, and either survivor leaves every cell looking equally
+     * inactive to an assistive tech user.
+     */
+    async getCurrentPage() {
+        const page = await this.currentPageOrNull();
+        if (page === null) {
+            throw new Error('WrPaginationHarness.getCurrentPage(): no cell carries `aria-current="page"`. The visible window ' +
+                `always includes the current page, so \`currentPage\` is not a page: below 1, or not a whole ` +
+                `number (the pager clamps above ${await this.getTotalPages()}, and nothing else).`);
+        }
+        return page;
+    }
+    /**
+     * Click the cell for a page.
+     *
+     * 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.
+     *
+     * 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
+     * is a no-op by the same guard.
+     */
+    async goToPage(page) {
+        for (const cell of await this.pageCells()) {
+            if (Number(await cell.getText()) === page) {
+                await cell.click();
+                return;
+            }
+        }
+        throw new Error(`WrPaginationHarness.goToPage(): page ${page} is not on the strip, which offers ` +
+            `${(await this.getStrip()).join(' ')}. The window shows at most seven pages — step with next() / ` +
+            'previous(), or set the page on the host.');
+    }
+    /**
+     * Jump to page 1.
+     *
+     * There is no dedicated first / last control in this component; the window pins
+     * the first and last page to the ends of the strip instead, so these two click
+     * cells like any other page.
+     */
+    async goToFirst() {
+        return this.goToPage(1);
+    }
+    /** Jump to the last page — the trailing cell, not the last one before a gap. */
+    async goToLast() {
+        return this.goToPage(await this.getTotalPages());
+    }
+    /**
+     * Click the next-page control.
+     *
+     * Disabled on the last page, and a disabled `<wr-btn>` is still clicked here (see
+     * {@link goToPage}) — {@link isNextDisabled} is the question, this is the action.
+     */
+    async next() {
+        return (await this.stepControl('next')).click();
+    }
+    /** Click the previous-page control. Disabled on the first page. */
+    async previous() {
+        return (await this.stepControl('previous')).click();
+    }
+    /**
+     * Whether the next-page control refuses the move — true on the last page, and
+     * true for every control while the pager is disabled.
+     *
+     * Answered by {@link WrButtonHarness}, which reads the `disabled` attribute first
+     * and `aria-disabled` second. A `<wr-btn>` element carries both: the attribute is
+     * inert on anything but a real `<button>`, which is why the component adds the
+     * ARIA state as well — so this is the accessible answer whichever branch supplies
+     * it.
+     */
+    async isNextDisabled() {
+        return (await this.stepControl('next')).isDisabled();
+    }
+    /** Whether the previous-page control refuses the move — true on the first page. */
+    async isPreviousDisabled() {
+        return (await this.stepControl('previous')).isDisabled();
+    }
+    /** Whether the pager shows its "X–Y of Z" label (the `showTotal` input). */
+    async hasTotal() {
+        return (await this.totalLabel()) !== null;
+    }
+    /**
+     * 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.
+     *
+     * 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`).
+     */
+    async getTotalText() {
+        const label = await this.totalLabel();
+        if (!label) {
+            throw new Error('WrPaginationHarness.getTotalText(): this pager renders no total label — set `showTotal`. A ' +
+                'total of 0 still renders one.');
+        }
+        return label.text();
+    }
+    /** Whether the pager renders its page-size changer (the `showSizeChanger` input). */
+    async hasPageSizeChanger() {
+        return (await this.sizeChanger()) !== null;
+    }
+    /**
+     * The page-size changer as a {@link WrSelectHarness} — for anything this harness
+     * does not wrap: the offered labels, the open state, keyboard driving.
+     *
+     * Composed rather than re-queried on purpose: the changer is a real
+     * `<wr-select>`, its options live in the overlay container rather than inside the
+     * pager, and the select harness is the thing that already knows how to scope them
+     * to their own trigger.
+     *
+     * Throws when there is no changer — an `undefined` here would turn into a
+     * confusing failure inside a select call.
+     */
+    async getPageSizeSelect() {
+        const select = await this.sizeChanger();
+        if (!select) {
+            throw new Error('WrPaginationHarness.getPageSizeSelect(): no page-size changer here — set `showSizeChanger`.');
+        }
+        return select;
+    }
+    /**
+     * The page size currently in effect.
+     *
+     * The changer's trigger is the only place the size reaches the DOM, so this reads
+     * it there and takes the digits: the label is localizable (`pagination.perPage`,
+     * `{{size}} / page`) but interpolates the number in every language — unless a
+     * catalog entry drops the placeholder, which is the second throw below.
+     *
+     * Throws when there is no changer at all: a pager without one says nothing on
+     * screen about its page size, and the host's own model is where to assert it.
+     */
+    async getPageSize() {
+        const text = await (await this.getPageSizeSelect()).getValueText();
+        const digits = /\d+/.exec(text);
+        if (!digits) {
+            throw new Error(`WrPaginationHarness.getPageSize(): the changer reads "${text}", which names no number — a ` +
+                'catalog entry for `pagination.perPage` that drops `{{size}}` takes the size off the screen.');
+        }
+        return Number(digits[0]);
+    }
+    /**
+     * Pick a page size through the changer, the way a user does.
+     *
+     * Matched on the digits rather than the whole label, for the same reason
+     * {@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
+     * when the new size leaves it past the end — so re-read {@link getCurrentPage}
+     * afterwards rather than assuming it held.
+     */
+    async setPageSize(size) {
+        const select = await this.getPageSizeSelect();
+        if (await this.isDisabled()) {
+            // Without this the call fails inside the select harness, whose message blames
+            // a tag-mode panel and a `minChars` search that have nothing to do with it.
+            throw new Error('WrPaginationHarness.setPageSize(): the pager is disabled, so its changer refuses to open — the ' +
+                'pager hands its own `disabled` straight to it.');
+        }
+        await select.open();
+        const labels = await select.getOptionLabels();
+        const digits = new RegExp(`(^|\\D)${size}(\\D|$)`);
+        const match = labels.find(label => digits.test(label));
+        if (match === undefined) {
+            throw new Error(`WrPaginationHarness.setPageSize(): no option offers ${size} — the changer offers ` +
+                `${labels.join(', ')}. \`pageSizeOptions\` is what decides that list.`);
+        }
+        await select.selectOption({ text: match });
+    }
+    /** The current page, or `null` when no cell announces one. @see getCurrentPage */
+    async currentPageOrNull() {
+        const cell = await this.locatorForOptional(WrButtonHarness.with({ selector: '.wr-pagination__page[aria-current="page"]' }))();
+        return cell ? Number(await cell.getText()) : null;
+    }
+    async stepControl(which) {
+        const controls = await this.stepControls();
+        if (controls.length !== 2) {
+            throw new Error(`WrPaginationHarness: expected the nav to bracket the strip with a previous and a next control, ` +
+                `found ${controls.length}. They are addressed by position, since their labels are localizable.`);
+        }
+        return which === 'previous' ? controls[0] : controls[1];
+    }
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { WrPaginationHarness };
+//# sourceMappingURL=ngwr-pagination-testing.mjs.map

package/fesm2022/ngwr-pagination-testing.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngwr-pagination-testing.mjs","sources":["../../../projects/lib/pagination/testing/wr-pagination-harness.ts","../../../projects/lib/pagination/testing/ngwr-pagination-testing.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';\n\nimport { WrButtonHarness } from 'ngwr/button/testing';\nimport type { WrPaginationSize } from 'ngwr/pagination';\nimport { WrSelectHarness } from 'ngwr/select/testing';\n\nimport type { WrPaginationHarnessFilters } from './interfaces';\n\n/**\n * Test harness for `<wr-pagination>` — the numbered strip, its two step controls,\n * the total label and the page-size changer.\n *\n * The strip is not the page list: it is a WINDOW over it, at most seven pages wide,\n * with an `…` standing in for every page it skipped. So \"which pages can I click\"\n * and \"how many pages are there\" are different questions and this harness keeps\n * them apart —\n * {@link getPages} answers the first, {@link getTotalPages} the second, and\n * {@link getStrip} shows the gaps for what they are. A gap is a `<span>`, not a\n * control; counting the strip's children as pages is the mistake this API exists to\n * make impossible.\n *\n * **Which page is current has two answers, and this reads the ARIA one.** The\n * current cell is also PAINTED — the template binds\n * `[color]=\"isCurrent(page) ? 'primary' : null\"`, so `.wr-btn--primary` sits on it\n * too. But colour is a theming decision (`ngwr/config` names this very binding as\n * the reason it ships no app-wide `color` default), while `aria-current=\"page\"` is\n * the navigation contract: it is what a screen-reader user hears, what the\n * component's own spec pins, and the only one of the two that still means\n * \"you are here\" after a restyle. A harness that read the class would be reporting\n * on the paint.\n *\n * **No roving tab stop to disambiguate.** Every cell is a `<wr-btn>` ELEMENT with\n * its own tab stop (`tabindex=\"0\"`, dropped only while the control is off), so the\n * pager has no separate \"focused\" item that could drift from the current page —\n * unlike a tab strip or a radio group, there is one active state here and\n * {@link getCurrentPage} is it.\n *\n * Composed rather than re-queried: the cells and step controls are driven through\n * {@link WrButtonHarness}, which already knows how a `<wr-btn>` says it is off —\n * both the `disabled` attribute (written on every shape, though inert on a custom\n * element) and `aria-disabled`, in that order — and the size changer through\n * {@link WrSelectHarness}, whose panel is a portal in the overlay container and\n * nowhere inside the pager.\n *\n * jsdom notes: every method here is a class / attribute read or a no-arg click, so\n * none of it needs layout. Two things are therefore invisible in a unit test and\n * deliberately absent from this API — the responsive collapse, which is a container\n * query ({@link isResponsive} reports only that it is ALLOWED), and the compact\n * `‹ 3 / 10 ›` pager it swaps in, which is `aria-hidden` decoration duplicating\n * {@link getCurrentPage} and {@link getTotalPages} and which a real browser would\n * read as empty text while CSS keeps it hidden.\n *\n * @example\n * ```ts\n * const pager = await loader.getHarness(WrPaginationHarness);\n *\n * expect(await pager.getPages()).toEqual([1, 2, 3, 4, 5, 10]);\n * await pager.goToPage(3);\n * expect(await pager.getCurrentPage()).toBe(3);\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrPaginationHarness extends ComponentHarness {\n  static hostSelector = 'wr-pagination';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrPaginationHarnessFilters = {}): HarnessPredicate<WrPaginationHarness> {\n    return new HarnessPredicate(WrPaginationHarness, options)\n      .addOption('label', options.label, (harness, label) => HarnessPredicate.stringMatches(harness.getLabel(), label))\n      .addOption('currentPage', options.currentPage, async (harness, page) => {\n        // The nullable read on purpose: the throwing getter would reject the whole\n        // query over one pager that announces no current page, taking its\n        // well-behaved neighbours down with it.\n        return (await harness.currentPageOrNull()) === page;\n      })\n      .addOption('disabled', options.disabled, async (harness, disabled) => (await harness.isDisabled()) === disabled);\n  }\n\n  /** The numbered cells, in DOM order — ascending, and never a gap. */\n  private readonly pageCells = this.locatorForAll(WrButtonHarness.with({ selector: '.wr-pagination__page' }));\n\n  /**\n   * The two controls bracketing the strip: previous, then next.\n   *\n   * Located by POSITION, not by their labels. `prevLabel` / `nextLabel` are inputs\n   * and both fall back to the `pagination.prev` / `pagination.next` catalog entries,\n   * so an English `aria-label` match works right up until someone ships a locale —\n   * whereas the nav's shape (one step control, the strip, one step control) is\n   * structural. `:not(.wr-pagination__page)` is what keeps the cells out of it.\n   */\n  private readonly stepControls = this.locatorForAll(\n    WrButtonHarness.with({ selector: '.wr-pagination__nav > wr-btn:not(.wr-pagination__page)' })\n  );\n\n  /** Both kinds of strip slot, in DOM order — cells and the gaps between them. */\n  private readonly stripSlots = this.locatorForAll('.wr-pagination__page, .wr-pagination__ellipsis');\n\n  private readonly totalLabel = this.locatorForOptional('.wr-pagination__total');\n\n  private readonly sizeChanger = this.locatorForOptional(WrSelectHarness.with({ selector: '.wr-pagination__size' }));\n\n  /**\n   * The accessible name of the `role=\"navigation\"` landmark.\n   *\n   * `''` only if the landmark lost its name, which is a bug rather than a state: a\n   * page with two unnamed pagers gives a screen-reader user two identical\n   * \"navigation\" landmarks.\n   */\n  async getLabel(): Promise<string> {\n    return (await (await this.host()).getAttribute('aria-label')) ?? '';\n  }\n\n  /**\n   * The size the pager RENDERS at, from its host modifier.\n   *\n   * The modifier is always emitted — `sm` included — so the fall-through below is\n   * only ever reached for the default, and a size the strip is not wearing cannot\n   * come back from here.\n   *\n   * The STRIP resolves nothing through `provideWrConfig()`, which is worth knowing\n   * before an app-wide default is blamed for a cell size: the pager passes its own\n   * `size` down to every `<wr-btn>` explicitly, so a configured `button.size` never\n   * reaches a cell. The page-size changer is the exception and not covered by this\n   * value — it is a bare `<wr-select>`, so `provideWrConfig({ select: … })` does\n   * reach it.\n   */\n  async getSize(): Promise<WrPaginationSize> {\n    const host = await this.host();\n    if (await host.hasClass('wr-pagination--lg')) return 'lg';\n    if (await host.hasClass('wr-pagination--md')) return 'md';\n    return 'sm';\n  }\n\n  /**\n   * Whether the pager is ALLOWED to collapse into its compact pager.\n   *\n   * Whether it HAS collapsed is a container query on the control's own box, and a\n   * unit test has no layout for one to answer — assert this input in jsdom and the\n   * reflow itself in a real browser.\n   */\n  async isResponsive(): Promise<boolean> {\n    return (await this.host()).hasClass('wr-pagination--responsive');\n  }\n\n  /**\n   * Whether the whole control refuses interaction.\n   *\n   * Read from the host modifier, because a `role=\"navigation\"` landmark has no ARIA\n   * disabled state to prefer — the per-control answer lives on the buttons\n   * themselves (`disabled` plus `aria-disabled` on each), which is what\n   * {@link isPreviousDisabled} and {@link isNextDisabled} read.\n   */\n  async isDisabled(): Promise<boolean> {\n    return (await this.host()).hasClass('wr-pagination--disabled');\n  }\n\n  /**\n   * The whole strip in DOM order: a `number` for every page cell, and the gap\n   * marker's own text (`…`) for every ellipsis.\n   *\n   * The marker is read from the DOM rather than compared against a literal, so a\n   * component that changes what it draws in a gap changes this too instead of\n   * quietly reporting a page.\n   */\n  async getStrip(): Promise<(number | string)[]> {\n    const slots = await this.stripSlots();\n    return Promise.all(\n      slots.map(async slot => {\n        const text = (await slot.text()).trim();\n        return (await slot.hasClass('wr-pagination__ellipsis')) ? text : Number(text);\n      })\n    );\n  }\n\n  /**\n   * The pages that can be clicked right now, ascending. Gaps are not pages and are\n   * not here — `[1, 8, 9, 10, 11, 12, 20]` for a twenty-page list sitting on 10.\n   */\n  async getPages(): Promise<number[]> {\n    const cells = await this.pageCells();\n    return Promise.all(cells.map(async cell => Number(await cell.getText())));\n  }\n\n  /**\n   * How many pages there are — not how many are on the strip.\n   *\n   * Taken from the LAST cell, which the window always pins to the final page (the\n   * first is pinned the same way), so this survives the gap that usually precedes\n   * it. Deliberately not read from the compact `3 / 10` pager: that span is\n   * `aria-hidden` and CSS-hidden outside responsive mode, so a browser-based\n   * harness environment would read it as empty.\n   */\n  async getTotalPages(): Promise<number> {\n    const pages = await this.getPages();\n    const last = pages.at(-1);\n    if (last === undefined) {\n      throw new Error(\n        'WrPaginationHarness.getTotalPages(): the strip has no page cells at all. The pager offers page ' +\n          '1 even for an empty list, so this is a rendering failure rather than an empty state.'\n      );\n    }\n    return last;\n  }\n\n  /**\n   * The page the pager announces as current, from `aria-current=\"page\"`.\n   *\n   * Throws when no cell claims it. The window always keeps the current page on the\n   * strip, so getting here means `currentPage` is not one of the pages at all — it\n   * is below 1, or not a whole number. The component clamps a page ABOVE the last\n   * one and nothing else, and either survivor leaves every cell looking equally\n   * inactive to an assistive tech user.\n   */\n  async getCurrentPage(): Promise<number> {\n    const page = await this.currentPageOrNull();\n    if (page === null) {\n      throw new Error(\n        'WrPaginationHarness.getCurrentPage(): no cell carries `aria-current=\"page\"`. The visible window ' +\n          `always includes the current page, so \\`currentPage\\` is not a page: below 1, or not a whole ` +\n          `number (the pager clamps above ${await this.getTotalPages()}, and nothing else).`\n      );\n    }\n    return page;\n  }\n\n  /**\n   * Click the cell for a page.\n   *\n   * Throws when that page is not on the strip — a seven-slot window over twenty\n   * pages simply has no cell for page 15, and a silent no-op there reads as\n   * \"navigation is broken\" three assertions later. Step with {@link next} /\n   * {@link previous}, or move the host's own `currentPage` model.\n   *\n   * A disabled pager is still clicked; the component's own guard is what refuses\n   * the move, so assert the page rather than assume it. Clicking the CURRENT page\n   * is a no-op by the same guard.\n   */\n  async goToPage(page: number): Promise<void> {\n    for (const cell of await this.pageCells()) {\n      if (Number(await cell.getText()) === page) {\n        await cell.click();\n        return;\n      }\n    }\n\n    throw new Error(\n      `WrPaginationHarness.goToPage(): page ${page} is not on the strip, which offers ` +\n        `${(await this.getStrip()).join(' ')}. The window shows at most seven pages — step with next() / ` +\n        'previous(), or set the page on the host.'\n    );\n  }\n\n  /**\n   * Jump to page 1.\n   *\n   * There is no dedicated first / last control in this component; the window pins\n   * the first and last page to the ends of the strip instead, so these two click\n   * cells like any other page.\n   */\n  async goToFirst(): Promise<void> {\n    return this.goToPage(1);\n  }\n\n  /** Jump to the last page — the trailing cell, not the last one before a gap. */\n  async goToLast(): Promise<void> {\n    return this.goToPage(await this.getTotalPages());\n  }\n\n  /**\n   * Click the next-page control.\n   *\n   * Disabled on the last page, and a disabled `<wr-btn>` is still clicked here (see\n   * {@link goToPage}) — {@link isNextDisabled} is the question, this is the action.\n   */\n  async next(): Promise<void> {\n    return (await this.stepControl('next')).click();\n  }\n\n  /** Click the previous-page control. Disabled on the first page. */\n  async previous(): Promise<void> {\n    return (await this.stepControl('previous')).click();\n  }\n\n  /**\n   * Whether the next-page control refuses the move — true on the last page, and\n   * true for every control while the pager is disabled.\n   *\n   * Answered by {@link WrButtonHarness}, which reads the `disabled` attribute first\n   * and `aria-disabled` second. A `<wr-btn>` element carries both: the attribute is\n   * inert on anything but a real `<button>`, which is why the component adds the\n   * ARIA state as well — so this is the accessible answer whichever branch supplies\n   * it.\n   */\n  async isNextDisabled(): Promise<boolean> {\n    return (await this.stepControl('next')).isDisabled();\n  }\n\n  /** Whether the previous-page control refuses the move — true on the first page. */\n  async isPreviousDisabled(): Promise<boolean> {\n    return (await this.stepControl('previous')).isDisabled();\n  }\n\n  /** Whether the pager shows its \"X–Y of Z\" label (the `showTotal` input). */\n  async hasTotal(): Promise<boolean> {\n    return (await this.totalLabel()) !== null;\n  }\n\n  /**\n   * The total label exactly as rendered, e.g. `1-10 of 95`.\n   *\n   * Both halves are localizable — the word between range and total comes from\n   * `ofLabel` or the `pagination.of` catalog entry — so a spec asserting the whole\n   * string should own the copy it asserts.\n   *\n   * Throws when the label is not rendered, which is a `showTotal` that was never\n   * set rather than a total of zero (a zero total still renders `0-0 of 0`).\n   */\n  async getTotalText(): Promise<string> {\n    const label = await this.totalLabel();\n    if (!label) {\n      throw new Error(\n        'WrPaginationHarness.getTotalText(): this pager renders no total label — set `showTotal`. A ' +\n          'total of 0 still renders one.'\n      );\n    }\n    return label.text();\n  }\n\n  /** Whether the pager renders its page-size changer (the `showSizeChanger` input). */\n  async hasPageSizeChanger(): Promise<boolean> {\n    return (await this.sizeChanger()) !== null;\n  }\n\n  /**\n   * The page-size changer as a {@link WrSelectHarness} — for anything this harness\n   * does not wrap: the offered labels, the open state, keyboard driving.\n   *\n   * Composed rather than re-queried on purpose: the changer is a real\n   * `<wr-select>`, its options live in the overlay container rather than inside the\n   * pager, and the select harness is the thing that already knows how to scope them\n   * to their own trigger.\n   *\n   * Throws when there is no changer — an `undefined` here would turn into a\n   * confusing failure inside a select call.\n   */\n  async getPageSizeSelect(): Promise<WrSelectHarness> {\n    const select = await this.sizeChanger();\n    if (!select) {\n      throw new Error('WrPaginationHarness.getPageSizeSelect(): no page-size changer here — set `showSizeChanger`.');\n    }\n    return select;\n  }\n\n  /**\n   * The page size currently in effect.\n   *\n   * The changer's trigger is the only place the size reaches the DOM, so this reads\n   * it there and takes the digits: the label is localizable (`pagination.perPage`,\n   * `{{size}} / page`) but interpolates the number in every language — unless a\n   * catalog entry drops the placeholder, which is the second throw below.\n   *\n   * Throws when there is no changer at all: a pager without one says nothing on\n   * screen about its page size, and the host's own model is where to assert it.\n   */\n  async getPageSize(): Promise<number> {\n    const text = await (await this.getPageSizeSelect()).getValueText();\n    const digits = /\\d+/.exec(text);\n    if (!digits) {\n      throw new Error(\n        `WrPaginationHarness.getPageSize(): the changer reads \"${text}\", which names no number — a ` +\n          'catalog entry for `pagination.perPage` that drops `{{size}}` takes the size off the screen.'\n      );\n    }\n    return Number(digits[0]);\n  }\n\n  /**\n   * Pick a page size through the changer, the way a user does.\n   *\n   * Matched on the digits rather than the whole label, for the same reason\n   * {@link getPageSize} reads them: `20 / page` and `20 / стр.` are the same option.\n   * Throws when no option offers that size, naming what is on offer.\n   *\n   * Changing the size can move the page — the component pulls `currentPage` back\n   * when the new size leaves it past the end — so re-read {@link getCurrentPage}\n   * afterwards rather than assuming it held.\n   */\n  async setPageSize(size: number): Promise<void> {\n    const select = await this.getPageSizeSelect();\n    if (await this.isDisabled()) {\n      // Without this the call fails inside the select harness, whose message blames\n      // a tag-mode panel and a `minChars` search that have nothing to do with it.\n      throw new Error(\n        'WrPaginationHarness.setPageSize(): the pager is disabled, so its changer refuses to open — the ' +\n          'pager hands its own `disabled` straight to it.'\n      );\n    }\n\n    await select.open();\n\n    const labels = await select.getOptionLabels();\n    const digits = new RegExp(`(^|\\\\D)${size}(\\\\D|$)`);\n    const match = labels.find(label => digits.test(label));\n    if (match === undefined) {\n      throw new Error(\n        `WrPaginationHarness.setPageSize(): no option offers ${size} — the changer offers ` +\n          `${labels.join(', ')}. \\`pageSizeOptions\\` is what decides that list.`\n      );\n    }\n\n    await select.selectOption({ text: match });\n  }\n\n  /** The current page, or `null` when no cell announces one. @see getCurrentPage */\n  private async currentPageOrNull(): Promise<number | null> {\n    const cell = await this.locatorForOptional(\n      WrButtonHarness.with({ selector: '.wr-pagination__page[aria-current=\"page\"]' })\n    )();\n    return cell ? Number(await cell.getText()) : null;\n  }\n\n  private async stepControl(which: 'previous' | 'next'): Promise<WrButtonHarness> {\n    const controls = await this.stepControls();\n    if (controls.length !== 2) {\n      throw new Error(\n        `WrPaginationHarness: expected the nav to bracket the strip with a previous and a next control, ` +\n          `found ${controls.length}. They are addressed by position, since their labels are localizable.`\n      );\n    }\n    return which === 'previous' ? controls[0] : controls[1];\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngwr-pagination.mjs

@@ -1,8 +1,6 @@
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
-import { model, input, computed, ViewEncapsulation, Component } from '@angular/core';
-import * as i1 from '@angular/forms';
-import { FormsModule } from '@angular/forms';
+import { model, input, computed, effect, untracked, ViewEncapsulation, Component } from '@angular/core';
 import { WrButton } from 'ngwr/button';
 import { useI18nText, useI18nFormatter } from 'ngwr/i18n';
 import { WrSelect, WrOption } from 'ngwr/select';
@@ -168,21 +166,39 @@ class WrPagination {
             return;
         this.currentPage.set(page);
     }
+    /**
+     * `wr-select` carries an `unknown` value by design, so the size arrives
+     * untyped and is narrowed here. It used to arrive as `any` through
+     * `[ngModel]`, which hid the coercion rather than removing the need for it.
+     */
+    constructor() {
+        // A shrinking `total` must not leave the pager on a page that no longer
+        // exists: it only ever pulled back when the SIZE changed through its own
+        // control, so a filtered list left "page 7 of 2" pointing at nothing.
+        effect(() => {
+            const cap = this.totalPages();
+            untracked(() => {
+                if (this.currentPage() > cap)
+                    this.currentPage.set(cap);
+            });
+        });
+    }
     onSizeChange(size) {
-        if (this.disabled() || size === this.pageSize())
+        const next = Number(size);
+        if (this.disabled() || !Number.isFinite(next) || next <= 0 || next === this.pageSize())
             return;
-        this.pageSize.set(size);
-        const cap = Math.max(1, Math.ceil(this.total() / size));
+        this.pageSize.set(next);
+        const cap = Math.max(1, Math.ceil(this.total() / next));
         if (this.currentPage() > cap)
             this.currentPage.set(cap);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrPagination, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: WrPagination, isStandalone: true, selector: "wr-pagination", inputs: { currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showSizeChanger: { classPropertyName: "showSizeChanger", publicName: "showSizeChanger", isSignal: true, isRequired: false, transformFunction: null }, showTotal: { classPropertyName: "showTotal", publicName: "showTotal", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, ofLabel: { classPropertyName: "ofLabel", publicName: "ofLabel", isSignal: true, isRequired: false, transformFunction: null }, prevLabel: { classPropertyName: "prevLabel", publicName: "prevLabel", isSignal: true, isRequired: false, transformFunction: null }, nextLabel: { classPropertyName: "nextLabel", publicName: "nextLabel", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageLabel: { classPropertyName: "itemsPerPageLabel", publicName: "itemsPerPageLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { currentPage: "currentPageChange", pageSize: "pageSizeChange" }, host: { attributes: { "role": "navigation" }, properties: { "class": "classes()", "attr.aria-label": "navLabel()" } }, ngImport: i0, template: "<div class=\"wr-pagination__inner\">\n  @if (showTotal()) {\n    <span class=\"wr-pagination__total\">{{ rangeLabel() }}</span>\n  }\n\n  <div class=\"wr-pagination__nav\">\n    <wr-btn\n      [size]=\"size()\"\n      outlined\n      [attr.aria-label]=\"resolvedPrev()\"\n      [disabled]=\"disabled() || currentPage() === 1\"\n      (click)=\"goTo(currentPage() - 1)\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"m12 19-7-7 7-7\" />\n        <path d=\"M19 12H5\" />\n      </svg>\n    </wr-btn>\n\n    @for (page of pages(); track $index) {\n      @if (page === ellipsis) {\n        <span class=\"wr-pagination__ellipsis\">{{ ellipsis }}</span>\n      } @else {\n        <wr-btn\n          class=\"wr-pagination__page\"\n          [size]=\"size()\"\n          [outlined]=\"!isCurrent(page)\"\n          [color]=\"isCurrent(page) ? 'primary' : null\"\n          [attr.aria-current]=\"isCurrent(page) ? 'page' : null\"\n          [attr.aria-label]=\"goToPage({ page })\"\n          [disabled]=\"disabled()\"\n          (click)=\"goTo(page)\"\n        >\n          {{ page }}\n        </wr-btn>\n      }\n    }\n\n    <!-- Compact pager \u2014 shown only in responsive mode on a narrow box (CSS). -->\n    <span class=\"wr-pagination__current\" aria-hidden=\"true\">{{ currentPage() }} / {{ totalPages() }}</span>\n\n    <wr-btn\n      [size]=\"size()\"\n      outlined\n      [attr.aria-label]=\"resolvedNext()\"\n      [disabled]=\"disabled() || currentPage() === totalPages()\"\n      (click)=\"goTo(currentPage() + 1)\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M5 12h14\" />\n        <path d=\"m12 5 7 7-7 7\" />\n      </svg>\n    </wr-btn>\n  </div>\n\n  @if (showSizeChanger()) {\n    <wr-select\n      class=\"wr-pagination__size\"\n      [attr.aria-label]=\"resolvedItemsPerPage()\"\n      [disabled]=\"disabled()\"\n      [ngModel]=\"pageSize()\"\n      (ngModelChange)=\"onSizeChange($event)\"\n    >\n      @for (option of pageSizeOptions(); track option) {\n        <wr-option [value]=\"option\">{{ perPage({ size: option }) }}</wr-option>\n      }\n    </wr-select>\n  }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: WrButton, selector: "wr-btn, button[wr-btn], a[wr-btn]", inputs: ["color", "size", "shape", "icon", "iconPosition", "disabled", "outlined", "block", "loading", "isDisabledWhenLoading"] }, { kind: "component", type: WrSelect, selector: "wr-select", inputs: ["placeholder", "clearLabel", "ariaLabel", "disabled", "rounded", "size", "responsive", "mode", "searchable", "searchQuery", "options", "displayWith", "loader", "serverSearch", "debounceMs", "minChars", "freeText", "virtualScroll", "rowHeight", "viewportHeight", "overscan", "noResultsText", "loadingText", "loading", "separators", "allowDuplicates", "validate", "clearable", "maxItems", "maxTagCount", "value"], outputs: ["searchQueryChange", "searchChange", "valueChange", "touch"] }, { kind: "component", type: WrOption, selector: "wr-option", inputs: ["value", "disabled"] }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrPagination, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: WrPagination, isStandalone: true, selector: "wr-pagination", inputs: { currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showSizeChanger: { classPropertyName: "showSizeChanger", publicName: "showSizeChanger", isSignal: true, isRequired: false, transformFunction: null }, showTotal: { classPropertyName: "showTotal", publicName: "showTotal", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, ofLabel: { classPropertyName: "ofLabel", publicName: "ofLabel", isSignal: true, isRequired: false, transformFunction: null }, prevLabel: { classPropertyName: "prevLabel", publicName: "prevLabel", isSignal: true, isRequired: false, transformFunction: null }, nextLabel: { classPropertyName: "nextLabel", publicName: "nextLabel", isSignal: true, isRequired: false, transformFunction: null }, itemsPerPageLabel: { classPropertyName: "itemsPerPageLabel", publicName: "itemsPerPageLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { currentPage: "currentPageChange", pageSize: "pageSizeChange" }, host: { attributes: { "role": "navigation" }, properties: { "class": "classes()", "attr.aria-label": "navLabel()" } }, ngImport: i0, template: "<div class=\"wr-pagination__inner\">\n  @if (showTotal()) {\n    <span class=\"wr-pagination__total\">{{ rangeLabel() }}</span>\n  }\n\n  <div class=\"wr-pagination__nav\">\n    <wr-btn\n      [size]=\"size()\"\n      outlined\n      [attr.aria-label]=\"resolvedPrev()\"\n      [disabled]=\"disabled() || currentPage() === 1\"\n      (click)=\"goTo(currentPage() - 1)\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"m12 19-7-7 7-7\" />\n        <path d=\"M19 12H5\" />\n      </svg>\n    </wr-btn>\n\n    @for (page of pages(); track $index) {\n      @if (page === ellipsis) {\n        <span class=\"wr-pagination__ellipsis\">{{ ellipsis }}</span>\n      } @else {\n        <wr-btn\n          class=\"wr-pagination__page\"\n          [size]=\"size()\"\n          [outlined]=\"!isCurrent(page)\"\n          [color]=\"isCurrent(page) ? 'primary' : null\"\n          [attr.aria-current]=\"isCurrent(page) ? 'page' : null\"\n          [attr.aria-label]=\"goToPage({ page })\"\n          [disabled]=\"disabled()\"\n          (click)=\"goTo(page)\"\n        >\n          {{ page }}\n        </wr-btn>\n      }\n    }\n\n    <!-- Compact pager \u2014 shown only in responsive mode on a narrow box (CSS). -->\n    <span class=\"wr-pagination__current\" aria-hidden=\"true\">{{ currentPage() }} / {{ totalPages() }}</span>\n\n    <wr-btn\n      [size]=\"size()\"\n      outlined\n      [attr.aria-label]=\"resolvedNext()\"\n      [disabled]=\"disabled() || currentPage() === totalPages()\"\n      (click)=\"goTo(currentPage() + 1)\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M5 12h14\" />\n        <path d=\"m12 5 7 7-7 7\" />\n      </svg>\n    </wr-btn>\n  </div>\n\n  @if (showSizeChanger()) {\n    <wr-select\n      class=\"wr-pagination__size\"\n      [attr.aria-label]=\"resolvedItemsPerPage()\"\n      [disabled]=\"disabled()\"\n      [value]=\"pageSize()\"\n      (valueChange)=\"onSizeChange($event)\"\n    >\n      @for (option of pageSizeOptions(); track option) {\n        <wr-option [value]=\"option\">{{ perPage({ size: option }) }}</wr-option>\n      }\n    </wr-select>\n  }\n</div>\n", dependencies: [{ kind: "component", type: WrButton, selector: "wr-btn, button[wr-btn], a[wr-btn]", inputs: ["color", "size", "shape", "icon", "iconPosition", "disabled", "outlined", "block", "loading", "isDisabledWhenLoading"] }, { kind: "component", type: WrSelect, selector: "wr-select", inputs: ["placeholder", "clearLabel", "ariaLabel", "disabled", "rounded", "size", "responsive", "mode", "searchable", "searchQuery", "options", "displayWith", "loader", "serverSearch", "debounceMs", "minChars", "freeText", "virtualScroll", "rowHeight", "viewportHeight", "overscan", "noResultsText", "loadingText", "loading", "separators", "allowDuplicates", "validate", "clearable", "maxItems", "maxTagCount", "value"], outputs: ["searchQueryChange", "searchChange", "valueChange", "touch"] }, { kind: "component", type: WrOption, selector: "wr-option", inputs: ["value", "disabled"] }], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrPagination, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrPagination, decorators: [{
             type: Component,
-            args: [{ selector: 'wr-pagination', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()', role: 'navigation', '[attr.aria-label]': 'navLabel()' }, imports: [FormsModule, WrButton, WrSelect, WrOption], template: "<div class=\"wr-pagination__inner\">\n  @if (showTotal()) {\n    <span class=\"wr-pagination__total\">{{ rangeLabel() }}</span>\n  }\n\n  <div class=\"wr-pagination__nav\">\n    <wr-btn\n      [size]=\"size()\"\n      outlined\n      [attr.aria-label]=\"resolvedPrev()\"\n      [disabled]=\"disabled() || currentPage() === 1\"\n      (click)=\"goTo(currentPage() - 1)\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"m12 19-7-7 7-7\" />\n        <path d=\"M19 12H5\" />\n      </svg>\n    </wr-btn>\n\n    @for (page of pages(); track $index) {\n      @if (page === ellipsis) {\n        <span class=\"wr-pagination__ellipsis\">{{ ellipsis }}</span>\n      } @else {\n        <wr-btn\n          class=\"wr-pagination__page\"\n          [size]=\"size()\"\n          [outlined]=\"!isCurrent(page)\"\n          [color]=\"isCurrent(page) ? 'primary' : null\"\n          [attr.aria-current]=\"isCurrent(page) ? 'page' : null\"\n          [attr.aria-label]=\"goToPage({ page })\"\n          [disabled]=\"disabled()\"\n          (click)=\"goTo(page)\"\n        >\n          {{ page }}\n        </wr-btn>\n      }\n    }\n\n    <!-- Compact pager \u2014 shown only in responsive mode on a narrow box (CSS). -->\n    <span class=\"wr-pagination__current\" aria-hidden=\"true\">{{ currentPage() }} / {{ totalPages() }}</span>\n\n    <wr-btn\n      [size]=\"size()\"\n      outlined\n      [attr.aria-label]=\"resolvedNext()\"\n      [disabled]=\"disabled() || currentPage() === totalPages()\"\n      (click)=\"goTo(currentPage() + 1)\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M5 12h14\" />\n        <path d=\"m12 5 7 7-7 7\" />\n      </svg>\n    </wr-btn>\n  </div>\n\n  @if (showSizeChanger()) {\n    <wr-select\n      class=\"wr-pagination__size\"\n      [attr.aria-label]=\"resolvedItemsPerPage()\"\n      [disabled]=\"disabled()\"\n      [ngModel]=\"pageSize()\"\n      (ngModelChange)=\"onSizeChange($event)\"\n    >\n      @for (option of pageSizeOptions(); track option) {\n        <wr-option [value]=\"option\">{{ perPage({ size: option }) }}</wr-option>\n      }\n    </wr-select>\n  }\n</div>\n" }]
-        }], propDecorators: { currentPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPage", required: false }] }, { type: i0.Output, args: ["currentPageChange"] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], showSizeChanger: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSizeChanger", required: false }] }], showTotal: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTotal", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], ofLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ofLabel", required: false }] }], prevLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "prevLabel", required: false }] }], nextLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextLabel", required: false }] }], itemsPerPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemsPerPageLabel", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }] } });
+            args: [{ selector: 'wr-pagination', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()', role: 'navigation', '[attr.aria-label]': 'navLabel()' }, imports: [WrButton, WrSelect, WrOption], template: "<div class=\"wr-pagination__inner\">\n  @if (showTotal()) {\n    <span class=\"wr-pagination__total\">{{ rangeLabel() }}</span>\n  }\n\n  <div class=\"wr-pagination__nav\">\n    <wr-btn\n      [size]=\"size()\"\n      outlined\n      [attr.aria-label]=\"resolvedPrev()\"\n      [disabled]=\"disabled() || currentPage() === 1\"\n      (click)=\"goTo(currentPage() - 1)\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"m12 19-7-7 7-7\" />\n        <path d=\"M19 12H5\" />\n      </svg>\n    </wr-btn>\n\n    @for (page of pages(); track $index) {\n      @if (page === ellipsis) {\n        <span class=\"wr-pagination__ellipsis\">{{ ellipsis }}</span>\n      } @else {\n        <wr-btn\n          class=\"wr-pagination__page\"\n          [size]=\"size()\"\n          [outlined]=\"!isCurrent(page)\"\n          [color]=\"isCurrent(page) ? 'primary' : null\"\n          [attr.aria-current]=\"isCurrent(page) ? 'page' : null\"\n          [attr.aria-label]=\"goToPage({ page })\"\n          [disabled]=\"disabled()\"\n          (click)=\"goTo(page)\"\n        >\n          {{ page }}\n        </wr-btn>\n      }\n    }\n\n    <!-- Compact pager \u2014 shown only in responsive mode on a narrow box (CSS). -->\n    <span class=\"wr-pagination__current\" aria-hidden=\"true\">{{ currentPage() }} / {{ totalPages() }}</span>\n\n    <wr-btn\n      [size]=\"size()\"\n      outlined\n      [attr.aria-label]=\"resolvedNext()\"\n      [disabled]=\"disabled() || currentPage() === totalPages()\"\n      (click)=\"goTo(currentPage() + 1)\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M5 12h14\" />\n        <path d=\"m12 5 7 7-7 7\" />\n      </svg>\n    </wr-btn>\n  </div>\n\n  @if (showSizeChanger()) {\n    <wr-select\n      class=\"wr-pagination__size\"\n      [attr.aria-label]=\"resolvedItemsPerPage()\"\n      [disabled]=\"disabled()\"\n      [value]=\"pageSize()\"\n      (valueChange)=\"onSizeChange($event)\"\n    >\n      @for (option of pageSizeOptions(); track option) {\n        <wr-option [value]=\"option\">{{ perPage({ size: option }) }}</wr-option>\n      }\n    </wr-select>\n  }\n</div>\n" }]
+        }], ctorParameters: () => [], propDecorators: { currentPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPage", required: false }] }, { type: i0.Output, args: ["currentPageChange"] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], showSizeChanger: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSizeChanger", required: false }] }], showTotal: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTotal", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], ofLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ofLabel", required: false }] }], prevLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "prevLabel", required: false }] }], nextLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextLabel", required: false }] }], itemsPerPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemsPerPageLabel", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.