ngwr 10.2.1 → 11.0.0

package/fesm2022/ngwr-switch.mjs

@@ -1,6 +1,7 @@
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
 import { input, model, output, computed, ViewEncapsulation, Component } from '@angular/core';
+import { useConfigValue } from 'ngwr/config';
 import { randomId } from 'ngwr/utils';
 
 /**
@@ -27,9 +28,14 @@ class WrSwitch {
      * @default false
      */
     disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
-    /** Control size — shares the `--wr-control-*` contract. @default 'md' */
-    size = input('md', /* @ts-ignore */
+    /**
+     * Control size — shares the `--wr-control-*` contract. Unset falls back to the
+     * `switch.size` app default from `provideWrConfig()`. @default 'md'
+     */
+    size = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** `size`, then the app config, then `md`. @internal */
+    resolvedSize = useConfigValue(this.size, c => c.switch?.size, 'md');
     /** On / off state. Bound by `[formField]`, or two-way via `[(checked)]`. */
     checked = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
@@ -37,7 +43,7 @@ class WrSwitch {
     touch = output();
     classes = computed(() => {
         const parts = ['wr-switch'];
-        const size = this.size();
+        const size = this.resolvedSize();
         if (size !== 'md')
             parts.push(`wr-switch--${size}`);
         if (this.checked())

package/fesm2022/ngwr-switch.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-switch.mjs","sources":["../../../projects/lib/switch/switch.ts","../../../projects/lib/switch/switch.html","../../../projects/lib/switch/ngwr-switch.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 { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input, model, output } from '@angular/core';\nimport type { FormCheckboxControl } from '@angular/forms/signals';\n\nimport { randomId } from 'ngwr/utils';\n\n/**\n * Boolean toggle with an iOS-style slider.\n *\n * A signal-forms native control: it implements `FormCheckboxControl`, so\n * `[formField]` binds straight to its `checked` model — no\n * `ControlValueAccessor` in between. `[(checked)]` works standalone.\n *\n * @example\n * ```html\n * <!-- signal forms -->\n * <wr-switch [formField]=\"form.notifications\">Notifications</wr-switch>\n *\n * <!-- standalone two-way binding -->\n * <wr-switch [(checked)]=\"enabled\">Notifications</wr-switch>\n * ```\n *\n * @see https://ngwr.dev/reference/components/switch\n */\nexport type WrSwitchSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  selector: 'wr-switch',\n  templateUrl: './switch.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { '[class]': 'classes()' },\n})\nexport class WrSwitch implements FormCheckboxControl {\n  /**\n   * Accessible name for a switch used WITHOUT projected text. The wrapping\n   * `<label>` names the control whenever content is projected; with none, the\n   * label is empty and the input has no name at all.\n   */\n  readonly ariaLabel = input<string | null>(null);\n\n  /** Stable id used to associate the native input with its label. */\n  readonly id = input<string>(randomId('wr-switch'));\n\n  /**\n   * Disable the switch. Bound automatically from the field's disabled state\n   * when used with `[formField]`.\n   *\n   * @default false\n   */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** Control size — shares the `--wr-control-*` contract. @default 'md' */\n  readonly size = input<WrSwitchSize>('md');\n\n  /** On / off state. Bound by `[formField]`, or two-way via `[(checked)]`. */\n  readonly checked = model<boolean>(false);\n\n  /** Emitted on blur so a bound field can mark itself touched. */\n  readonly touch = output<void>();\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-switch'];\n    const size = this.size();\n    if (size !== 'md') parts.push(`wr-switch--${size}`);\n    if (this.checked()) parts.push('wr-switch--checked');\n    if (this.disabled()) parts.push('wr-switch--disabled');\n    return parts.join(' ');\n  });\n\n  // Template handlers\n\n  protected onInputChange(event: Event): void {\n    this.checked.set((event.target as HTMLInputElement).checked);\n  }\n\n  protected onInputBlur(): void {\n    this.touch.emit();\n  }\n}\n","<label class=\"wr-switch__label\" [for]=\"id()\">\n  <input\n    class=\"wr-switch__input\"\n    type=\"checkbox\"\n    role=\"switch\"\n    [id]=\"id()\"\n    [attr.aria-label]=\"ariaLabel()\"\n    [checked]=\"checked()\"\n    [disabled]=\"disabled()\"\n    (change)=\"onInputChange($event)\"\n    (blur)=\"onInputBlur()\"\n  />\n\n  <span class=\"wr-switch__track\" aria-hidden=\"true\">\n    <span class=\"wr-switch__thumb\"></span>\n  </span>\n\n  <span class=\"wr-switch__text\">\n    <ng-content />\n  </span>\n</label>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;AAAA;;;;;AAKG;MAkCU,QAAQ,CAAA;AACnB;;;;AAIG;IACM,SAAS,GAAG,KAAK,CAAgB,IAAI;kFAAC;;AAGtC,IAAA,EAAE,GAAG,KAAK,CAAS,QAAQ,CAAC,WAAW,CAAC;2EAAC;AAElD;;;;;AAKG;IACM,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAG7D,IAAI,GAAG,KAAK,CAAe,IAAI;6EAAC;;IAGhC,OAAO,GAAG,KAAK,CAAU,KAAK;gFAAC;;IAG/B,KAAK,GAAG,MAAM,EAAQ;AAEZ,IAAA,OAAO,GAAG,QAAQ,CAAC,MAAK;AACzC,QAAA,MAAM,KAAK,GAAG,CAAC,WAAW,CAAC;AAC3B,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE;QACxB,IAAI,IAAI,KAAK,IAAI;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,cAAc,IAAI,CAAA,CAAE,CAAC;QACnD,IAAI,IAAI,CAAC,OAAO,EAAE;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,oBAAoB,CAAC;QACpD,IAAI,IAAI,CAAC,QAAQ,EAAE;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC;AACtD,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;IACxB,CAAC;gFAAC;;AAIQ,IAAA,aAAa,CAAC,KAAY,EAAA;QAClC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAE,KAAK,CAAC,MAA2B,CAAC,OAAO,CAAC;IAC9D;IAEU,WAAW,GAAA;AACnB,QAAA,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;IACnB;uGA7CW,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAR,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,QAAQ,+xBCvCrB,ihBAqBA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FDkBa,QAAQ,EAAA,UAAA,EAAA,CAAA;kBANpB,SAAS;+BACE,WAAW,EAAA,aAAA,EAEN,iBAAiB,CAAC,IAAI,QAC/B,EAAE,SAAS,EAAE,WAAW,EAAE,EAAA,QAAA,EAAA,ihBAAA,EAAA;;;AErClC;;AAEG;;;;"}
+{"version":3,"file":"ngwr-switch.mjs","sources":["../../../projects/lib/switch/switch.ts","../../../projects/lib/switch/switch.html","../../../projects/lib/switch/ngwr-switch.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 { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input, model, output } from '@angular/core';\nimport type { FormCheckboxControl } from '@angular/forms/signals';\n\nimport { useConfigValue } from 'ngwr/config';\nimport { randomId } from 'ngwr/utils';\n\n/**\n * Boolean toggle with an iOS-style slider.\n *\n * A signal-forms native control: it implements `FormCheckboxControl`, so\n * `[formField]` binds straight to its `checked` model — no\n * `ControlValueAccessor` in between. `[(checked)]` works standalone.\n *\n * @example\n * ```html\n * <!-- signal forms -->\n * <wr-switch [formField]=\"form.notifications\">Notifications</wr-switch>\n *\n * <!-- standalone two-way binding -->\n * <wr-switch [(checked)]=\"enabled\">Notifications</wr-switch>\n * ```\n *\n * @see https://ngwr.dev/reference/components/switch\n */\nexport type WrSwitchSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  selector: 'wr-switch',\n  templateUrl: './switch.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { '[class]': 'classes()' },\n})\nexport class WrSwitch implements FormCheckboxControl {\n  /**\n   * Accessible name for a switch used WITHOUT projected text. The wrapping\n   * `<label>` names the control whenever content is projected; with none, the\n   * label is empty and the input has no name at all.\n   */\n  readonly ariaLabel = input<string | null>(null);\n\n  /** Stable id used to associate the native input with its label. */\n  readonly id = input<string>(randomId('wr-switch'));\n\n  /**\n   * Disable the switch. Bound automatically from the field's disabled state\n   * when used with `[formField]`.\n   *\n   * @default false\n   */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /**\n   * Control size — shares the `--wr-control-*` contract. Unset falls back to the\n   * `switch.size` app default from `provideWrConfig()`. @default 'md'\n   */\n  readonly size = input<WrSwitchSize | null>(null);\n\n  /** `size`, then the app config, then `md`. @internal */\n  protected readonly resolvedSize = useConfigValue(this.size, c => c.switch?.size, 'md');\n\n  /** On / off state. Bound by `[formField]`, or two-way via `[(checked)]`. */\n  readonly checked = model<boolean>(false);\n\n  /** Emitted on blur so a bound field can mark itself touched. */\n  readonly touch = output<void>();\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-switch'];\n    const size = this.resolvedSize();\n    if (size !== 'md') parts.push(`wr-switch--${size}`);\n    if (this.checked()) parts.push('wr-switch--checked');\n    if (this.disabled()) parts.push('wr-switch--disabled');\n    return parts.join(' ');\n  });\n\n  // Template handlers\n\n  protected onInputChange(event: Event): void {\n    this.checked.set((event.target as HTMLInputElement).checked);\n  }\n\n  protected onInputBlur(): void {\n    this.touch.emit();\n  }\n}\n","<label class=\"wr-switch__label\" [for]=\"id()\">\n  <input\n    class=\"wr-switch__input\"\n    type=\"checkbox\"\n    role=\"switch\"\n    [id]=\"id()\"\n    [attr.aria-label]=\"ariaLabel()\"\n    [checked]=\"checked()\"\n    [disabled]=\"disabled()\"\n    (change)=\"onInputChange($event)\"\n    (blur)=\"onInputBlur()\"\n  />\n\n  <span class=\"wr-switch__track\" aria-hidden=\"true\">\n    <span class=\"wr-switch__thumb\"></span>\n  </span>\n\n  <span class=\"wr-switch__text\">\n    <ng-content />\n  </span>\n</label>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;AAAA;;;;;AAKG;MAmCU,QAAQ,CAAA;AACnB;;;;AAIG;IACM,SAAS,GAAG,KAAK,CAAgB,IAAI;kFAAC;;AAGtC,IAAA,EAAE,GAAG,KAAK,CAAS,QAAQ,CAAC,WAAW,CAAC;2EAAC;AAElD;;;;;AAKG;IACM,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;AAEtE;;;AAGG;IACM,IAAI,GAAG,KAAK,CAAsB,IAAI;6EAAC;;AAG7B,IAAA,YAAY,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC;;IAG7E,OAAO,GAAG,KAAK,CAAU,KAAK;gFAAC;;IAG/B,KAAK,GAAG,MAAM,EAAQ;AAEZ,IAAA,OAAO,GAAG,QAAQ,CAAC,MAAK;AACzC,QAAA,MAAM,KAAK,GAAG,CAAC,WAAW,CAAC;AAC3B,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE;QAChC,IAAI,IAAI,KAAK,IAAI;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,cAAc,IAAI,CAAA,CAAE,CAAC;QACnD,IAAI,IAAI,CAAC,OAAO,EAAE;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,oBAAoB,CAAC;QACpD,IAAI,IAAI,CAAC,QAAQ,EAAE;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC;AACtD,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;IACxB,CAAC;gFAAC;;AAIQ,IAAA,aAAa,CAAC,KAAY,EAAA;QAClC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAE,KAAK,CAAC,MAA2B,CAAC,OAAO,CAAC;IAC9D;IAEU,WAAW,GAAA;AACnB,QAAA,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;IACnB;uGAnDW,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAR,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,QAAQ,+xBCxCrB,ihBAqBA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FDmBa,QAAQ,EAAA,UAAA,EAAA,CAAA;kBANpB,SAAS;+BACE,WAAW,EAAA,aAAA,EAEN,iBAAiB,CAAC,IAAI,QAC/B,EAAE,SAAS,EAAE,WAAW,EAAE,EAAA,QAAA,EAAA,ihBAAA,EAAA;;;AEtClC;;AAEG;;;;"}

package/fesm2022/ngwr-table-testing.mjs

@@ -0,0 +1,580 @@
+import { ContentContainerComponentHarness, HarnessPredicate, ComponentHarness } from '@angular/cdk/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
+ */
+/**
+ * Collapse the whitespace inside a table cell to what a user reads on one line.
+ *
+ * `TestElement.text()` only trims the ends, and a `<td>` is rarely one text node:
+ * the tree column puts a toggle in front of the value, a `[wrTableExpand]` detail
+ * cell holds whatever the consumer projected. The template's own indentation is
+ * NOT the problem — Angular's default `preserveWhitespaces: false` drops
+ * whitespace-only text nodes at compile time, so `'\n  Ada\n'` never reaches
+ * `textContent`. What does reach it is whitespace inside a VALUE (`'first\n\n
+ * programmer'` out of a textarea or an API) and, in a consumer app compiled with
+ * `preserveWhitespaces: true`, the indentation after all. Every run becomes one
+ * space so a spec can assert the rendered line either way.
+ */
+function wrTableHarnessText(text) {
+    return text.replace(/\s+/g, ' ').trim();
+}
+
+/**
+ * @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 one data cell of a `<wr-table>` row.
+ *
+ * A CONTENT CONTAINER, because a cell is where a consumer's own components end
+ * up: a `[wrTableCell]` template can render a `<wr-tag>`, a button, an input, and
+ * `cell.getHarness(WrButtonHarness…)` resolves those INSIDE this cell — so the
+ * "Delete" button of row 3 cannot be mistaken for the one in row 1.
+ *
+ * @example
+ * ```ts
+ * const [row] = await table.getRows({ cellText: 'Ada' });
+ * const [status] = await row.getCells({ columnTitle: 'Status' });
+ *
+ * expect(await status.getText()).toBe('active');
+ * ```
+ *
+ * @see https://ngwr.dev/guides/testing
+ */
+class WrTableCellHarness extends ContentContainerComponentHarness {
+    /**
+     * Data cells only. The lead selection and expand cells carry the same
+     * `.wr-table__td` class — they hold the row's controls, not its data — so a cell
+     * list that swept them in would no longer line up with the header list.
+     */
+    static hostSelector = '.wr-table__td:not(.wr-table__td--select):not(.wr-table__td--expand)';
+    /** Build a predicate that narrows the query. */
+    static with(options = {}) {
+        return new HarnessPredicate(WrTableCellHarness, options)
+            .addOption('text', options.text, (harness, text) => HarnessPredicate.stringMatches(harness.getText(), text))
+            .addOption('columnTitle', options.columnTitle, (harness, title) => HarnessPredicate.stringMatches(harness.getColumnTitle(), title));
+    }
+    /** The cell's text, with the template's indentation collapsed to single spaces. */
+    async getText() {
+        return wrTableHarnessText(await (await this.host()).text());
+    }
+    /**
+     * The title of the column this cell belongs to.
+     *
+     * Read from `data-label` — the attribute responsive card mode prints in front of
+     * each value — because it is the only place a cell says which column it is in.
+     * The column KEY is never in the DOM at all.
+     */
+    async getColumnTitle() {
+        return (await this.host()).getAttribute('data-label');
+    }
+    /** Which edge the cell's column is frozen against, or `null` when it scrolls. */
+    async getPin() {
+        const host = await this.host();
+        if (await host.hasClass('wr-table__td--pin-left'))
+            return 'left';
+        if (await host.hasClass('wr-table__td--pin-right'))
+            return 'right';
+        return null;
+    }
+}
+
+/**
+ * @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 one column header of a `<wr-table>`.
+ *
+ * The selector deliberately skips the two LEAD headers — selection and expand —
+ * which carry the same `.wr-table__th` class but hold a checkbox or nothing at
+ * all. What is left lines up index-for-index with the data columns, so a header's
+ * position is its column's position.
+ *
+ * Columns are addressed by their TITLE here and everywhere else in this harness
+ * family, never by their `columns` key: the key never reaches the DOM. Only the
+ * title does — in this header and in every cell's `data-label` — so it is the one
+ * handle a spec and the rendered table share.
+ *
+ * @see https://ngwr.dev/guides/testing
+ */
+class WrTableHeaderCellHarness extends ComponentHarness {
+    static hostSelector = '.wr-table__th:not(.wr-table__th--select):not(.wr-table__th--expand)';
+    /** Build a predicate that narrows the query. */
+    static with(options = {}) {
+        return new HarnessPredicate(WrTableHeaderCellHarness, options)
+            .addOption('text', options.text, (harness, text) => HarnessPredicate.stringMatches(harness.getText(), text))
+            .addOption('sortable', options.sortable, async (harness, sortable) => (await harness.isSortable()) === sortable);
+    }
+    /** The column title, trimmed. The sort and filter controls are not part of it. */
+    async getText() {
+        return (await this.locatorFor('.wr-table__title')()).text();
+    }
+    /**
+     * The direction this column announces, exactly as `aria-sort` puts it — or
+     * `null` when the column does not sort.
+     *
+     * `null` is not "unsorted": a sortable column with no direction announces
+     * `'none'`, and only a plain column omits the attribute entirely. Claiming
+     * sortability a column does not have is the bug that distinction prevents.
+     */
+    async getSortDirection() {
+        const sort = await (await this.host()).getAttribute('aria-sort');
+        return sort;
+    }
+    /** Whether the column offers sorting at all. */
+    async isSortable() {
+        return (await this.getSortDirection()) !== null;
+    }
+    /**
+     * Advance the sort one step — none → ascending → descending → none, the cycle a
+     * click on the indicator drives.
+     *
+     * Throws on a column with no sort control rather than doing nothing: the quiet
+     * version of this leaves a spec asserting an unchanged direction and passing.
+     */
+    async sort() {
+        const button = await this.locatorForOptional('.wr-table__sort-btn')();
+        if (!button) {
+            throw new Error(`WrTableHeaderCellHarness.sort(): the "${await this.getText()}" column has no sort control — ` +
+                'its column definition needs `sortable: true`.');
+        }
+        await button.click();
+    }
+    /** Whether the column offers a filter dropdown (its definition carries a NON-EMPTY `filterItems`). */
+    async isFilterable() {
+        return (await this.locatorForOptional('wr-table-filter')()) !== null;
+    }
+    /** Which edge the column is frozen against, or `null` when it scrolls with the rest. */
+    async getPin() {
+        const host = await this.host();
+        if (await host.hasClass('wr-table__th--pin-left'))
+            return 'left';
+        if (await host.hasClass('wr-table__th--pin-right'))
+            return 'right';
+        return null;
+    }
+}
+
+/**
+ * @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 one body row of a `<wr-table>` — flat, grouped or tree.
+ *
+ * Also a CONTENT CONTAINER, so `row.getHarness(WrButtonHarness…)` reaches the
+ * consumer's own components anywhere in the row without leaving this row.
+ *
+ * @example
+ * ```ts
+ * const [ada] = await table.getRows({ cellText: 'Ada' });
+ *
+ * await ada.select();
+ * await (await ada.getHarness(WrButtonHarness.with({ text: 'Edit' }))).click();
+ * ```
+ *
+ * @see https://ngwr.dev/guides/testing
+ */
+class WrTableRowHarness extends ContentContainerComponentHarness {
+    /**
+     * `.wr-table__tr` is the DATA row and nothing else.
+     *
+     * Everything else a `<tbody>` can hold is a `<tr>` too: the group band
+     * (`.wr-table__group-row`), its subtotal row, the detail row a `[wrTableExpand]`
+     * template renders, the two virtual spacers, and the "no data" row. Querying
+     * `tbody tr` would hand every one of those back as a row with no cells.
+     */
+    static hostSelector = '.wr-table__tr';
+    /** Build a predicate that narrows the query. */
+    static with(options = {}) {
+        return new HarnessPredicate(WrTableRowHarness, options)
+            .addOption('cellText', options.cellText, async (harness, text) => {
+            for (const cell of await harness.getCellTexts()) {
+                if (await HarnessPredicate.stringMatches(cell, text))
+                    return true;
+            }
+            return false;
+        })
+            .addOption('selected', options.selected, async (harness, selected) => (await harness.isSelected()) === selected)
+            .addOption('expanded', options.expanded, async (harness, expanded) => (await harness.isExpanded()) === expanded)
+            .addOption('level', options.level, async (harness, level) => (await harness.getLevel()) === level);
+    }
+    selectBox = this.locatorForOptional('.wr-table__td--select input.wr-checkbox__input');
+    /**
+     * The row's disclosure control, whichever of the two the table gave it: the lead
+     * button of a `[wrTableExpand]` table, or the tree toggle inside the tree column.
+     * The two never coexist — a tree row owns its own disclosure, so the component
+     * refuses the pair.
+     *
+     * `button` in the tree selector is load-bearing. A leaf renders a `<span>` with
+     * the same `.wr-table__tree-toggle` class purely to hold the indent, and taking
+     * that for a control would report every leaf as expandable.
+     */
+    disclosure = this.locatorForOptional('.wr-table__expand-btn, button.wr-table__tree-toggle');
+    /** The row's data cells, in DOM order. The lead control cells are not cells. */
+    async getCells(filters = {}) {
+        return this.locatorForAll(WrTableCellHarness.with(filters))();
+    }
+    /** The text of every data cell, in DOM order. */
+    async getCellTexts() {
+        const cells = await this.getCells();
+        return Promise.all(cells.map(cell => cell.getText()));
+    }
+    /**
+     * Whether the row is selected.
+     *
+     * Read from the `--selected` modifier, which is what the row looks like and what
+     * a consumer styles against. It also means a row is not "selected" while
+     * `rowSelection` is off, however many keys the `selection` model holds — nothing
+     * on screen says otherwise.
+     */
+    async isSelected() {
+        return (await this.host()).hasClass('wr-table__tr--selected');
+    }
+    /** Whether the row offers a selection checkbox at all. */
+    async isSelectable() {
+        return (await this.selectBox()) !== null;
+    }
+    /** Flip the row's checkbox. Throws when the table has no selection column. */
+    async toggleSelection() {
+        const box = await this.selectBox();
+        if (!box) {
+            throw new Error('WrTableRowHarness.toggleSelection(): this row has no checkbox — the table needs ' +
+                "`rowSelection` set to 'single' or 'multiple'.");
+        }
+        await box.click();
+    }
+    /** Select the row if it is not already selected. */
+    async select() {
+        if (!(await this.isSelected()))
+            await this.toggleSelection();
+    }
+    /** Deselect the row if it is selected. */
+    async deselect() {
+        if (await this.isSelected())
+            await this.toggleSelection();
+    }
+    /**
+     * Whether the row has something to open — a detail template's disclosure, or
+     * children in a tree. A tree leaf answers `false`.
+     */
+    async isExpandable() {
+        return (await this.disclosure()) !== null;
+    }
+    /** Whether the row is open, from the disclosure's `aria-expanded`. */
+    async isExpanded() {
+        const toggle = await this.disclosure();
+        return toggle !== null && (await toggle.getAttribute('aria-expanded')) === 'true';
+    }
+    /** Open or close the row. Throws when it has nothing to open. */
+    async toggleExpand() {
+        const toggle = await this.disclosure();
+        if (!toggle) {
+            throw new Error('WrTableRowHarness.toggleExpand(): this row has no disclosure control — a flat table needs a ' +
+                '`[wrTableExpand]` template, and a tree row with no children is a leaf.');
+        }
+        await toggle.click();
+    }
+    /**
+     * The row's depth as the table announces it — 1-based `aria-level`, `null` in a
+     * flat table, where depth is not a thing that exists.
+     */
+    async getLevel() {
+        return this.numericAttribute('aria-level');
+    }
+    /** The row's 1-based position among its siblings (`aria-posinset`), or `null` when flat. */
+    async getPosInSet() {
+        return this.numericAttribute('aria-posinset');
+    }
+    /** How many rows are in the row's sibling set, itself included (`aria-setsize`); `null` when flat. */
+    async getSetSize() {
+        return this.numericAttribute('aria-setsize');
+    }
+    /**
+     * The row's 1-based index in the FULL dataset (`aria-rowindex`, header included),
+     * or `null` when the table is not virtualized.
+     *
+     * Only a windowed table publishes it, and that is precisely when it matters: the
+     * rows in the DOM are a slice, so their DOM order says nothing about where they
+     * sit in the data.
+     */
+    async getRowIndex() {
+        return this.numericAttribute('aria-rowindex');
+    }
+    async numericAttribute(name) {
+        const value = await (await this.host()).getAttribute(name);
+        return value === null ? null : Number.parseInt(value, 10);
+    }
+}
+
+/**
+ * @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-table>` — the root of a small family, since a table is a
+ * tree and not one control: {@link WrTableHeaderCellHarness} for a column header,
+ * {@link WrTableRowHarness} for a body row, and `WrTableCellHarness` for a cell.
+ *
+ * Columns are addressed by their header TITLE, never by their `columns` key: the
+ * key never reaches the DOM.
+ *
+ * What this harness deliberately does NOT do:
+ * - open a column's filter dropdown. The panel is a `wr-dropdown` in the overlay
+ *   container, and driving it belongs to a dropdown harness rather than this one;
+ *   {@link WrTableHeaderCellHarness.isFilterable} reports that a column offers one.
+ * - scroll a virtualized body. See {@link getRows}.
+ *
+ * @example
+ * ```ts
+ * const table = await loader.getHarness(WrTableHarness);
+ *
+ * expect(await table.getHeaderTexts()).toEqual(['Name', 'Role']);
+ * await table.sortByColumn('Name');
+ * expect(await table.getSortDirection('Name')).toBe('ascending');
+ * ```
+ *
+ * @see https://ngwr.dev/guides/testing
+ */
+class WrTableHarness extends ComponentHarness {
+    static hostSelector = 'wr-table';
+    /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */
+    static with(options = {}) {
+        return new HarnessPredicate(WrTableHarness, options)
+            .addOption('columnTitle', options.columnTitle, async (harness, title) => {
+            for (const header of await harness.getHeaderTexts()) {
+                if (await HarnessPredicate.stringMatches(header, title))
+                    return true;
+            }
+            return false;
+        })
+            .addOption('tree', options.tree, async (harness, tree) => (await harness.isTree()) === tree);
+    }
+    tableEl = this.locatorFor('table.wr-table__table');
+    selectAllBox = this.locatorForOptional('.wr-table__th--select input.wr-checkbox__input');
+    /**
+     * The role the table announces.
+     *
+     * A flat table sets no `role` at all, so it announces the native `table` role —
+     * NOT `grid`, which would promise cell-by-cell keyboard navigation it does not
+     * implement. `childrenKey` turns it into a `treegrid`, and that role is the only
+     * place the hierarchy exists for a screen-reader user: the indent is decoration.
+     */
+    async getRole() {
+        return (await (await this.tableEl()).getAttribute('role')) === 'treegrid' ? 'treegrid' : 'table';
+    }
+    /** Whether the rows are a hierarchy rather than a flat list. */
+    async isTree() {
+        return (await this.getRole()) === 'treegrid';
+    }
+    /**
+     * Whether the body is WINDOWED right now.
+     *
+     * Read from the host modifier rather than from the input, and that is the point:
+     * `virtualScroll` is a request, not a promise. The table falls back to rendering
+     * every row whenever the layout stops being uniform — grouping, a detail
+     * template, responsive card mode, a visible pager, a tree — so this answers what
+     * actually happened.
+     */
+    async isVirtual() {
+        return (await this.host()).hasClass('wr-table--virtual');
+    }
+    /** Whether the loading spinner is covering the table. */
+    async isLoading() {
+        return (await this.locatorForOptional('.wr-table__loading')()) !== null;
+    }
+    /** The column headers, in render order — which `columnOrder` and a drag can change. */
+    async getHeaderCells(filters = {}) {
+        return this.locatorForAll(WrTableHeaderCellHarness.with(filters))();
+    }
+    /**
+     * The column titles, in render order.
+     *
+     * The selection and expand headers are not columns and are not here, so this
+     * list stays as wide as every row from {@link getCellTexts}.
+     */
+    async getHeaderTexts() {
+        const headers = await this.getHeaderCells();
+        return Promise.all(headers.map(header => header.getText()));
+    }
+    /** The direction a column announces via `aria-sort`, or `null` when it does not sort. */
+    async getSortDirection(columnTitle) {
+        return (await this.headerCellFor(columnTitle)).getSortDirection();
+    }
+    /**
+     * Advance a column's sort one step — none → ascending → descending → none.
+     *
+     * Sorting is the host's job: `<wr-table>` publishes the intent through its `sort`
+     * model and never reorders `items` itself, so a spec that expects the rows to
+     * move has to sort the data the way the app does.
+     */
+    async sortByColumn(columnTitle) {
+        await (await this.headerCellFor(columnTitle)).sort();
+    }
+    /**
+     * The body rows currently rendered, in DOM order.
+     *
+     * "Currently rendered" is the whole caveat of a virtualized table: while
+     * {@link isVirtual} is true the `<tbody>` holds only the window around the scroll
+     * offset, padded by a spacer row at each end that still has rows to stand in for
+     * (one of them, at the top or the bottom of the list), so this returns the
+     * WINDOW — not the dataset.
+     * {@link getAriaRowCount} is the total the table announces and
+     * {@link WrTableRowHarness.getRowIndex} says where a row sits in it. Nothing here
+     * scrolls that window on purpose: the viewport has no layout in a unit test, so a
+     * `scrollTo` would silently do nothing. Reach for `WrTable.scrollToRow()` in a
+     * real browser, or narrow the data instead.
+     *
+     * Group bands, per-group subtotals, detail rows and the "no data" row are not
+     * rows and never appear here.
+     */
+    async getRows(filters = {}) {
+        return this.locatorForAll(WrTableRowHarness.with(filters))();
+    }
+    /** The whole body as a matrix of cell text — one array per row, one entry per column. */
+    async getCellTexts() {
+        const rows = await this.getRows();
+        return Promise.all(rows.map(row => row.getCellTexts()));
+    }
+    /**
+     * The `<tfoot>` summary cells, one per column and `''` for a column with no
+     * `summary`. Empty when no column defines one.
+     *
+     * The lead cells are dropped so this lines up with {@link getHeaderTexts}. A
+     * per-group subtotal row is NOT here — it lives in the body, under its band.
+     */
+    async getFooterTexts() {
+        const cells = await this.locatorForAll('tfoot .wr-table__foot-cell:not(.wr-table__foot-cell--lead)')();
+        return Promise.all(cells.map(async (cell) => wrTableHarnessText(await cell.text())));
+    }
+    /** The "no data" message, or `null` while the table has rows to show. */
+    async getEmptyText() {
+        const empty = await this.locatorForOptional('.wr-table__empty')();
+        return empty ? wrTableHarnessText(await empty.text()) : null;
+    }
+    /**
+     * The row count the table announces (`aria-rowcount` — header and summary row
+     * included), or `null` when it is not virtualized and every row is in the DOM.
+     */
+    async getAriaRowCount() {
+        const count = await (await this.tableEl()).getAttribute('aria-rowcount');
+        return count === null ? null : Number.parseInt(count, 10);
+    }
+    /** Whether the header offers a select-all box — only `rowSelection="multiple"` does. */
+    async hasSelectAll() {
+        return (await this.selectAllBox()) !== null;
+    }
+    /** Whether every row in the select-all scope is selected — see {@link toggleSelectAll}. */
+    async isAllSelected() {
+        return (await this.selectAllHost()).getProperty('checked');
+    }
+    /**
+     * Whether some rows are selected and others are not — the box's third state.
+     *
+     * `indeterminate` is a DOM PROPERTY, not an attribute: reading the attribute
+     * reports `null` for a box that is visibly dashed.
+     */
+    async isPartiallySelected() {
+        return (await this.selectAllHost()).getProperty('indeterminate');
+    }
+    /**
+     * Click the select-all box, once.
+     *
+     * Its scope is the rows the table RENDERS — the current page, and a collapsed
+     * group's rows are out because collapsing drops them from that list. A
+     * virtualized table's off-window rows are IN, though: the window is a slice
+     * taken after the list is built, so one click selects the whole dataset and not
+     * just what is in the DOM. And the third state is worth knowing about before
+     * asserting: while the selection is partial the box reads unchecked, so one
+     * click selects everything rather than clearing it.
+     */
+    async toggleSelectAll() {
+        await (await this.selectAllHost()).click();
+    }
+    /**
+     * The text of each open detail row, in row order.
+     *
+     * A detail row is a full-width `<tr>` NEXT TO the row it belongs to, not inside
+     * it — which is why it is neither one of {@link getRows} nor one of a row's
+     * cells.
+     */
+    async getDetailTexts() {
+        const details = await this.locatorForAll('.wr-table__detail')();
+        return Promise.all(details.map(async (detail) => wrTableHarnessText(await detail.text())));
+    }
+    /**
+     * The group band labels, in order.
+     *
+     * Empty when `groupBy` is off — and also when a `[wrTableGroupHeader]` template
+     * replaced the built-in band, since the label is then the consumer's own markup.
+     * Reach for that through {@link getRows}' siblings or your own component's
+     * harness.
+     */
+    async getGroupLabels() {
+        const labels = await this.locatorForAll('.wr-table__group-label')();
+        return Promise.all(labels.map(label => label.text()));
+    }
+    /** Whether the band with this label is collapsed. */
+    async isGroupCollapsed(label) {
+        const toggle = await this.groupToggleFor(label);
+        return (await toggle.getAttribute('aria-expanded')) === 'false';
+    }
+    /** Collapse or expand the band with this label. */
+    async toggleGroup(label) {
+        await (await this.groupToggleFor(label)).click();
+    }
+    /** The header for a column title, or a failure that says which titles do exist. */
+    async headerCellFor(columnTitle) {
+        const [header] = await this.getHeaderCells({ text: columnTitle });
+        if (!header) {
+            const titles = await this.getHeaderTexts();
+            throw new Error(`WrTableHarness: no column headed "${columnTitle}". Columns are addressed by their title, ` +
+                `not by their key — this table shows [${titles.join(', ')}].`);
+        }
+        return header;
+    }
+    /**
+     * The collapse toggle of one band.
+     *
+     * Paired by index rather than by containment: both lists are emitted once per
+     * band by the same loop, in the same order, and a `TestElement` cannot be
+     * queried into.
+     */
+    async groupToggleFor(label) {
+        const index = (await this.getGroupLabels()).indexOf(label);
+        if (index < 0) {
+            throw new Error(`WrTableHarness: no group band labelled "${label}" — is \`groupBy\` set, and is the band the ` +
+                'built-in one rather than a `[wrTableGroupHeader]` template?');
+        }
+        return (await this.locatorForAll('.wr-table__group-toggle')())[index];
+    }
+    /** The select-all input, or a failure naming both reasons it is missing. */
+    async selectAllHost() {
+        const box = await this.selectAllBox();
+        if (!box) {
+            throw new Error('WrTableHarness: this table has no select-all box — `rowSelection` is off, or it is ' +
+                "'single', which has no select-all by design.");
+        }
+        return box;
+    }
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { WrTableCellHarness, WrTableHarness, WrTableHeaderCellHarness, WrTableRowHarness };
+//# sourceMappingURL=ngwr-table-testing.mjs.map