ngwr 10.2.1 → 11.1.0

package/fesm2022/ngwr-radio-testing.mjs

@@ -0,0 +1,392 @@
+import { ComponentHarness, HarnessPredicate } 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
+ */
+/**
+ * Test harness for one `<wr-radio>` — an option, not a control.
+ *
+ * The visible dot is a `<span>` the stylesheet paints; the state lives on a real
+ * `<input type="radio">` inside the label, and that is what this reads and clicks.
+ * A radio cannot exist alone — the component throws when it is constructed outside
+ * a `<wr-radio-group>` — so `WrRadioGroupHarness` is where the SELECTION lives and
+ * this answers questions about one option.
+ *
+ * There is no `aria-checked` here to prefer over the DOM, and that is right: a
+ * native radio carries its state in the `checked` IDL property, so the ARIA
+ * attribute would only be a second source of truth for a screen reader to
+ * disagree with. {@link isChecked} reads the property, which is the state.
+ *
+ * @example
+ * ```ts
+ * const medium = await loader.getHarness(WrRadioHarness.with({ label: 'Medium' }));
+ * await medium.check();
+ * expect(await medium.isChecked()).toBe(true);
+ * ```
+ *
+ * @see https://ngwr.dev/guides/testing
+ */
+class WrRadioHarness extends ComponentHarness {
+    static hostSelector = 'wr-radio';
+    /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */
+    static with(options = {}) {
+        return new HarnessPredicate(WrRadioHarness, options)
+            .addOption('label', options.label, (harness, label) => HarnessPredicate.stringMatches(harness.getLabel(), label))
+            .addOption('value', options.value, (harness, value) => HarnessPredicate.stringMatches(harness.getValue(), value))
+            .addOption('checked', options.checked, async (harness, checked) => (await harness.isChecked()) === checked)
+            .addOption('disabled', options.disabled, async (harness, disabled) => (await harness.isDisabled()) === disabled);
+    }
+    input = this.locatorFor('input.wr-radio__input');
+    label = this.locatorFor('label.wr-radio__label');
+    /** The projected label text, trimmed. An icon lives in the dot, so it is not part of it. */
+    async getLabel() {
+        return (await this.locatorFor('.wr-radio__text')()).text();
+    }
+    /**
+     * The option's value as the template WROTE it, or `null` when it was bound.
+     *
+     * The gap worth knowing about before a spec leans on this: `value` is `unknown`,
+     * and the component never puts it on the native input — the group holds the
+     * selection and a radio only says which one it is. So the only `value` in the
+     * DOM is the static attribute Angular leaves behind for a literal `value="sm"`;
+     * `[value]="size"` reaches the component without ever touching the page and
+     * reads `null` here whatever it holds, which for an object value it always will.
+     *
+     * Address options by their LABEL when it matters, and assert the picked value on
+     * the host's own model, which is the only place it exists.
+     */
+    async getValue() {
+        return (await this.host()).getAttribute('value');
+    }
+    /**
+     * The `name` the group stamps on this radio's native input.
+     *
+     * It is the whole of the group's keyboard behaviour: one shared name is what
+     * makes a browser treat the radios as a single tab stop, walk the arrow keys
+     * between them and announce "1 of 3". None of that is implemented in the
+     * component, so a name that stops being shared takes all of it away silently.
+     */
+    async getName() {
+        return (await this.input()).getProperty('name');
+    }
+    /**
+     * Whether this option is the group's answer.
+     *
+     * Read from the input's `checked` PROPERTY: `[checked]` is a property binding,
+     * so the attribute is never written and reading it would report `null` for a
+     * radio with a visible dot.
+     */
+    async isChecked() {
+        return (await this.input()).getProperty('checked');
+    }
+    /**
+     * Whether the option refuses selection — for either reason.
+     *
+     * The native input is disabled by this radio's own `disabled` OR by the group's,
+     * and from outside they are the same thing: the option cannot be picked.
+     */
+    async isDisabled() {
+        return (await this.input()).getProperty('disabled');
+    }
+    /**
+     * The control size, from the host modifier.
+     *
+     * `md` is the default and carries NO modifier class, so its absence is the
+     * answer rather than a missing one.
+     */
+    async getSize() {
+        const host = await this.host();
+        if (await host.hasClass('wr-radio--sm'))
+            return 'sm';
+        if (await host.hasClass('wr-radio--lg'))
+            return 'lg';
+        return 'md';
+    }
+    /** Whether the dot is filled by an icon instead of the default solid circle. */
+    async hasIcon() {
+        return (await this.host()).hasClass('wr-radio--has-icon');
+    }
+    /**
+     * Whether the `<label for>` really points at this radio's input.
+     *
+     * Not the option's only naming route, and worth being precise about: the input
+     * sits INSIDE the `<label>`, so the implicit association already names it and a
+     * `for` that misses does not leave the radio unnamed. What a stray `for` does
+     * take away is the pairing every consumer assumes — it hands label clicks, and
+     * anything that references the label, to whatever else on the page owns that id.
+     */
+    async isLabelBound() {
+        const forAttr = await (await this.label()).getAttribute('for');
+        return forAttr !== null && forAttr === (await (await this.input()).getProperty('id'));
+    }
+    /**
+     * Pick this option, the way a user does — a click on the native input.
+     *
+     * Nothing happens when it is already checked (a radio has no untick), and
+     * nothing happens when it is disabled, so assert the result rather than assume
+     * it — or reach for `WrRadioGroupHarness.select()`, which says which of the two
+     * it was.
+     *
+     * A click rather than a keypress, despite jsdom having no layout: the events are
+     * dispatched onto the input itself, so nothing is hit-tested and the zero-sized
+     * rect jsdom reports for every element cannot miss its target, and the
+     * `change` event it produces is exactly the one the component listens for. The
+     * arrow keys that would move a real user between options are the BROWSER's
+     * behaviour over a shared `name`, not the component's, and jsdom implements none
+     * of it — there is nothing here for a keyboard to drive.
+     */
+    async check() {
+        if (await this.isChecked())
+            return;
+        await (await this.input()).click();
+    }
+    /** Move keyboard focus onto the real control. */
+    async focus() {
+        return (await this.input()).focus();
+    }
+    /**
+     * Take focus off the radio — which is what makes the GROUP emit `touch`, since a
+     * blur from any child is what marks a bound field touched.
+     */
+    async blur() {
+        return (await this.input()).blur();
+    }
+    async isFocused() {
+        return (await this.input()).isFocused();
+    }
+}
+
+/**
+ * @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-radio-group>` — the control a `<wr-radio>` only means
+ * anything inside of, and the root of a two-part family with {@link WrRadioHarness}.
+ *
+ * Options are addressed by their LABEL rather than by their value, and there is
+ * deliberately no `getValue()` here. The group's value is a signal of `unknown`
+ * that the component never writes to the DOM: not to the group element, not to a
+ * radio's native input. The one thing on the page is whatever static attribute the
+ * template happened to leave behind, so a selection made through `[(value)]`, a
+ * `[formField]` or an object is not there at all, and a harness reporting it would
+ * be guessing. {@link getSelectedLabel} says what the page says, and a spec that
+ * needs the value itself asserts the host's own model — which is the assertion that
+ * would have caught the bug anyway.
+ *
+ * Arrow-key navigation is not this component's either: the radios share one `name`
+ * attribute and the browser does the rest, so jsdom — which implements none of it
+ * — leaves nothing for a keyboard to drive. {@link getName} is what a spec should
+ * pin instead, because losing the shared name is what actually takes arrow
+ * navigation away, and {@link getTabStopLabel} answers the other half.
+ *
+ * @example
+ * ```ts
+ * const size = await loader.getHarness(WrRadioGroupHarness.with({ name: 'size' }));
+ *
+ * expect(await size.getRadioLabels()).toEqual(['Small', 'Medium', 'Large']);
+ * await size.select({ label: 'Large' });
+ * expect(await size.getSelectedLabel()).toBe('Large');
+ * ```
+ *
+ * @see https://ngwr.dev/guides/testing
+ */
+class WrRadioGroupHarness extends ComponentHarness {
+    static hostSelector = 'wr-radio-group';
+    /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */
+    static with(options = {}) {
+        return new HarnessPredicate(WrRadioGroupHarness, options)
+            .addOption('name', options.name, (harness, name) => HarnessPredicate.stringMatches(harness.getName(), name))
+            .addOption('disabled', options.disabled, async (harness, disabled) => (await harness.isDisabled()) === disabled);
+    }
+    /**
+     * The role the group announces — `radiogroup`, which is what tells a screen
+     * reader that the options belong to one question and how many of them there are.
+     */
+    async getRole() {
+        return (await this.host()).getAttribute('role');
+    }
+    /**
+     * The group's accessible name, resolved in the order a screen reader resolves it:
+     * the text of every element `aria-labelledby` points at, and `aria-label` only
+     * when that named nothing. `null` when the consumer wired neither.
+     *
+     * The order is not interchangeable — `aria-labelledby` WINS over `aria-label` in
+     * the accessible-name computation, so a group carrying both is announced by the
+     * heading it points at and reporting the `aria-label` would describe a name
+     * nobody hears.
+     *
+     * That `null` is a finding rather than a detail — a `radiogroup` with no name
+     * announces three answers and never the question. The component ships no label
+     * input on purpose (the question is the consumer's own heading), so this is the
+     * only way to check the wiring held.
+     */
+    async getAccessibleName() {
+        const host = await this.host();
+        const labelledBy = await host.getAttribute('aria-labelledby');
+        if (labelledBy !== null) {
+            // Resolved from the document root: `aria-labelledby` may point anywhere on the
+            // page, and the heading above a group is normally outside it.
+            const root = this.documentRootLocatorFactory();
+            const texts = [];
+            for (const id of labelledBy.split(/\s+/).filter(Boolean)) {
+                const target = await root.locatorForOptional(`#${id}`)();
+                if (target)
+                    texts.push(await target.text());
+            }
+            // A reference that resolves to nothing names nothing, and the computation
+            // falls through to `aria-label` exactly as it does in a browser.
+            if (texts.length)
+                return texts.join(' ');
+        }
+        return host.getAttribute('aria-label');
+    }
+    /**
+     * The `name` every radio in the group shares.
+     *
+     * Read off the radios because they are the only place it is RELIABLY written: the
+     * group's `name` input reaches the page as an attribute on each native input, and
+     * a bound `[name]="…"` never lands on the group element at all. A literal
+     * `name="size"` does survive on the group element — Angular leaves a static
+     * attribute alone — which is exactly the trap: reading it there works for the
+     * literal form and quietly returns nothing for the bound one.
+     */
+    async getName() {
+        const [first] = await this.radiosOrThrow();
+        return first.getName();
+    }
+    /**
+     * Whether the group refuses every option.
+     *
+     * Answered from the radios, and it could not be otherwise: a bound `[disabled]`
+     * on the group reaches the page only by disabling each native input, so a group
+     * disabled as a whole and a group whose every option is individually disabled
+     * are the same page. They are also the same thing to the person using it, which
+     * is the question a harness should be answering.
+     */
+    async isDisabled() {
+        for (const radio of await this.radiosOrThrow()) {
+            if (!(await radio.isDisabled()))
+                return false;
+        }
+        return true;
+    }
+    /** The group's own options, in DOM order. A sibling group's radios are not here. */
+    async getRadios(filters = {}) {
+        return this.locatorForAll(WrRadioHarness.with(filters))();
+    }
+    /** The label of every option, in DOM order. */
+    async getRadioLabels() {
+        const radios = await this.getRadios();
+        return Promise.all(radios.map(radio => radio.getLabel()));
+    }
+    /** The checked option, or `null` while the group is unanswered. */
+    async getSelectedRadio() {
+        const [checked] = await this.getRadios({ checked: true });
+        return checked ?? null;
+    }
+    /**
+     * The label of the checked option, or `null` while the group is unanswered.
+     *
+     * Also `null` for a value that matches no radio — the group holds it, nothing is
+     * checked, and the page shows an unanswered question.
+     */
+    async getSelectedLabel() {
+        const selected = await this.getSelectedRadio();
+        return selected ? selected.getLabel() : null;
+    }
+    /**
+     * Pick the first option matching the filters — this is how the group's value
+     * changes.
+     *
+     * Throws when nothing matches, naming the options that do exist, and throws
+     * again when the option is still unchecked afterwards. That second failure has
+     * exactly two causes and reports both, because a click that quietly did nothing
+     * surfaces as an unrelated assertion three lines later.
+     */
+    async select(filters) {
+        const [radio] = await this.getRadios(filters);
+        if (!radio) {
+            throw new Error(`WrRadioGroupHarness.select(): no radio matched ${JSON.stringify(filters)}. This group offers: ` +
+                `${(await this.getRadioLabels()).join(', ')}.`);
+        }
+        await radio.check();
+        if (!(await radio.isChecked())) {
+            throw new Error(`WrRadioGroupHarness.select(): "${await radio.getLabel()}" is still unchecked after being clicked — ` +
+                'either that option carries `disabled` or the whole group does.');
+        }
+    }
+    /**
+     * The label of the option a Tab press would land on, or `null` when every option
+     * is disabled and the group is skipped over entirely.
+     *
+     * A radio group is ONE tab stop, and which radio it is is written down nowhere:
+     * the component authors no roving `tabindex`, because the browser already
+     * applies the native rule to a shared `name` — the checked radio, or the first
+     * enabled one while nothing is checked. So this is DERIVED from the rendered
+     * state rather than read off an attribute, there being no attribute to read.
+     *
+     * Worth asking precisely because those two answers are different radios exactly
+     * when a form opens unanswered, which is the state most specs start in.
+     */
+    async getTabStopLabel() {
+        const stop = await this.tabStop();
+        return stop ? stop.getLabel() : null;
+    }
+    /** Put focus where a Tab press would put it. Throws when the group has no tab stop. */
+    async focusTabStop() {
+        const stop = await this.tabStop();
+        if (!stop) {
+            throw new Error('WrRadioGroupHarness.focusTabStop(): every option in this group is disabled, so the group is not a ' +
+                'tab stop at all — Tab skips it rather than entering it.');
+        }
+        await stop.focus();
+    }
+    /**
+     * The label of the option that currently holds focus, or `null` when focus is
+     * elsewhere. The counterpart to {@link focusTabStop}: in a real browser the
+     * arrow keys move this, and moving it is also what picks a new answer.
+     */
+    async getFocusedLabel() {
+        for (const radio of await this.getRadios()) {
+            if (await radio.isFocused())
+                return radio.getLabel();
+        }
+        return null;
+    }
+    /** The radio Tab would enter on, applying the browser's rule to the rendered state. */
+    async tabStop() {
+        const enabled = [];
+        for (const radio of await this.getRadios()) {
+            if (!(await radio.isDisabled()))
+                enabled.push(radio);
+        }
+        for (const radio of enabled) {
+            if (await radio.isChecked())
+                return radio;
+        }
+        return enabled[0] ?? null;
+    }
+    /** The options, or a failure saying why an empty group has nothing to report. */
+    async radiosOrThrow() {
+        const radios = await this.getRadios();
+        if (!radios.length) {
+            throw new Error('WrRadioGroupHarness: this group has no <wr-radio> children, and every group-level fact here is read ' +
+                'off them — the shared name and the disabled state reach the DOM through the radios, and a bound ' +
+                '[name] / [disabled] leaves nothing on the group element to read instead.');
+        }
+        return radios;
+    }
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { WrRadioGroupHarness, WrRadioHarness };
+//# sourceMappingURL=ngwr-radio-testing.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ngwr-radio-testing.mjs","sources":["../../../projects/lib/radio/testing/wr-radio-harness.ts","../../../projects/lib/radio/testing/wr-radio-group-harness.ts","../../../projects/lib/radio/testing/ngwr-radio-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 type { WrRadioSize } from 'ngwr/radio';\n\nimport type { WrRadioHarnessFilters } from './interfaces';\n\n/**\n * Test harness for one `<wr-radio>` — an option, not a control.\n *\n * The visible dot is a `<span>` the stylesheet paints; the state lives on a real\n * `<input type=\"radio\">` inside the label, and that is what this reads and clicks.\n * A radio cannot exist alone — the component throws when it is constructed outside\n * a `<wr-radio-group>` — so `WrRadioGroupHarness` is where the SELECTION lives and\n * this answers questions about one option.\n *\n * There is no `aria-checked` here to prefer over the DOM, and that is right: a\n * native radio carries its state in the `checked` IDL property, so the ARIA\n * attribute would only be a second source of truth for a screen reader to\n * disagree with. {@link isChecked} reads the property, which is the state.\n *\n * @example\n * ```ts\n * const medium = await loader.getHarness(WrRadioHarness.with({ label: 'Medium' }));\n * await medium.check();\n * expect(await medium.isChecked()).toBe(true);\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrRadioHarness extends ComponentHarness {\n  static hostSelector = 'wr-radio';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrRadioHarnessFilters = {}): HarnessPredicate<WrRadioHarness> {\n    return new HarnessPredicate(WrRadioHarness, options)\n      .addOption('label', options.label, (harness, label) => HarnessPredicate.stringMatches(harness.getLabel(), label))\n      .addOption('value', options.value, (harness, value) => HarnessPredicate.stringMatches(harness.getValue(), value))\n      .addOption('checked', options.checked, async (harness, checked) => (await harness.isChecked()) === checked)\n      .addOption('disabled', options.disabled, async (harness, disabled) => (await harness.isDisabled()) === disabled);\n  }\n\n  private readonly input = this.locatorFor('input.wr-radio__input');\n  private readonly label = this.locatorFor('label.wr-radio__label');\n\n  /** The projected label text, trimmed. An icon lives in the dot, so it is not part of it. */\n  async getLabel(): Promise<string> {\n    return (await this.locatorFor('.wr-radio__text')()).text();\n  }\n\n  /**\n   * The option's value as the template WROTE it, or `null` when it was bound.\n   *\n   * The gap worth knowing about before a spec leans on this: `value` is `unknown`,\n   * and the component never puts it on the native input — the group holds the\n   * selection and a radio only says which one it is. So the only `value` in the\n   * DOM is the static attribute Angular leaves behind for a literal `value=\"sm\"`;\n   * `[value]=\"size\"` reaches the component without ever touching the page and\n   * reads `null` here whatever it holds, which for an object value it always will.\n   *\n   * Address options by their LABEL when it matters, and assert the picked value on\n   * the host's own model, which is the only place it exists.\n   */\n  async getValue(): Promise<string | null> {\n    return (await this.host()).getAttribute('value');\n  }\n\n  /**\n   * The `name` the group stamps on this radio's native input.\n   *\n   * It is the whole of the group's keyboard behaviour: one shared name is what\n   * makes a browser treat the radios as a single tab stop, walk the arrow keys\n   * between them and announce \"1 of 3\". None of that is implemented in the\n   * component, so a name that stops being shared takes all of it away silently.\n   */\n  async getName(): Promise<string> {\n    return (await this.input()).getProperty<string>('name');\n  }\n\n  /**\n   * Whether this option is the group's answer.\n   *\n   * Read from the input's `checked` PROPERTY: `[checked]` is a property binding,\n   * so the attribute is never written and reading it would report `null` for a\n   * radio with a visible dot.\n   */\n  async isChecked(): Promise<boolean> {\n    return (await this.input()).getProperty<boolean>('checked');\n  }\n\n  /**\n   * Whether the option refuses selection — for either reason.\n   *\n   * The native input is disabled by this radio's own `disabled` OR by the group's,\n   * and from outside they are the same thing: the option cannot be picked.\n   */\n  async isDisabled(): Promise<boolean> {\n    return (await this.input()).getProperty<boolean>('disabled');\n  }\n\n  /**\n   * The control size, from the host modifier.\n   *\n   * `md` is the default and carries NO modifier class, so its absence is the\n   * answer rather than a missing one.\n   */\n  async getSize(): Promise<WrRadioSize> {\n    const host = await this.host();\n    if (await host.hasClass('wr-radio--sm')) return 'sm';\n    if (await host.hasClass('wr-radio--lg')) return 'lg';\n    return 'md';\n  }\n\n  /** Whether the dot is filled by an icon instead of the default solid circle. */\n  async hasIcon(): Promise<boolean> {\n    return (await this.host()).hasClass('wr-radio--has-icon');\n  }\n\n  /**\n   * Whether the `<label for>` really points at this radio's input.\n   *\n   * Not the option's only naming route, and worth being precise about: the input\n   * sits INSIDE the `<label>`, so the implicit association already names it and a\n   * `for` that misses does not leave the radio unnamed. What a stray `for` does\n   * take away is the pairing every consumer assumes — it hands label clicks, and\n   * anything that references the label, to whatever else on the page owns that id.\n   */\n  async isLabelBound(): Promise<boolean> {\n    const forAttr = await (await this.label()).getAttribute('for');\n    return forAttr !== null && forAttr === (await (await this.input()).getProperty<string>('id'));\n  }\n\n  /**\n   * Pick this option, the way a user does — a click on the native input.\n   *\n   * Nothing happens when it is already checked (a radio has no untick), and\n   * nothing happens when it is disabled, so assert the result rather than assume\n   * it — or reach for `WrRadioGroupHarness.select()`, which says which of the two\n   * it was.\n   *\n   * A click rather than a keypress, despite jsdom having no layout: the events are\n   * dispatched onto the input itself, so nothing is hit-tested and the zero-sized\n   * rect jsdom reports for every element cannot miss its target, and the\n   * `change` event it produces is exactly the one the component listens for. The\n   * arrow keys that would move a real user between options are the BROWSER's\n   * behaviour over a shared `name`, not the component's, and jsdom implements none\n   * of it — there is nothing here for a keyboard to drive.\n   */\n  async check(): Promise<void> {\n    if (await this.isChecked()) return;\n    await (await this.input()).click();\n  }\n\n  /** Move keyboard focus onto the real control. */\n  async focus(): Promise<void> {\n    return (await this.input()).focus();\n  }\n\n  /**\n   * Take focus off the radio — which is what makes the GROUP emit `touch`, since a\n   * blur from any child is what marks a bound field touched.\n   */\n  async blur(): Promise<void> {\n    return (await this.input()).blur();\n  }\n\n  async isFocused(): Promise<boolean> {\n    return (await this.input()).isFocused();\n  }\n}\n","/**\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 type { WrRadioGroupHarnessFilters, WrRadioHarnessFilters } from './interfaces';\nimport { WrRadioHarness } from './wr-radio-harness';\n\n/**\n * Test harness for `<wr-radio-group>` — the control a `<wr-radio>` only means\n * anything inside of, and the root of a two-part family with {@link WrRadioHarness}.\n *\n * Options are addressed by their LABEL rather than by their value, and there is\n * deliberately no `getValue()` here. The group's value is a signal of `unknown`\n * that the component never writes to the DOM: not to the group element, not to a\n * radio's native input. The one thing on the page is whatever static attribute the\n * template happened to leave behind, so a selection made through `[(value)]`, a\n * `[formField]` or an object is not there at all, and a harness reporting it would\n * be guessing. {@link getSelectedLabel} says what the page says, and a spec that\n * needs the value itself asserts the host's own model — which is the assertion that\n * would have caught the bug anyway.\n *\n * Arrow-key navigation is not this component's either: the radios share one `name`\n * attribute and the browser does the rest, so jsdom — which implements none of it\n * — leaves nothing for a keyboard to drive. {@link getName} is what a spec should\n * pin instead, because losing the shared name is what actually takes arrow\n * navigation away, and {@link getTabStopLabel} answers the other half.\n *\n * @example\n * ```ts\n * const size = await loader.getHarness(WrRadioGroupHarness.with({ name: 'size' }));\n *\n * expect(await size.getRadioLabels()).toEqual(['Small', 'Medium', 'Large']);\n * await size.select({ label: 'Large' });\n * expect(await size.getSelectedLabel()).toBe('Large');\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrRadioGroupHarness extends ComponentHarness {\n  static hostSelector = 'wr-radio-group';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrRadioGroupHarnessFilters = {}): HarnessPredicate<WrRadioGroupHarness> {\n    return new HarnessPredicate(WrRadioGroupHarness, options)\n      .addOption('name', options.name, (harness, name) => HarnessPredicate.stringMatches(harness.getName(), name))\n      .addOption('disabled', options.disabled, async (harness, disabled) => (await harness.isDisabled()) === disabled);\n  }\n\n  /**\n   * The role the group announces — `radiogroup`, which is what tells a screen\n   * reader that the options belong to one question and how many of them there are.\n   */\n  async getRole(): Promise<string | null> {\n    return (await this.host()).getAttribute('role');\n  }\n\n  /**\n   * The group's accessible name, resolved in the order a screen reader resolves it:\n   * the text of every element `aria-labelledby` points at, and `aria-label` only\n   * when that named nothing. `null` when the consumer wired neither.\n   *\n   * The order is not interchangeable — `aria-labelledby` WINS over `aria-label` in\n   * the accessible-name computation, so a group carrying both is announced by the\n   * heading it points at and reporting the `aria-label` would describe a name\n   * nobody hears.\n   *\n   * That `null` is a finding rather than a detail — a `radiogroup` with no name\n   * announces three answers and never the question. The component ships no label\n   * input on purpose (the question is the consumer's own heading), so this is the\n   * only way to check the wiring held.\n   */\n  async getAccessibleName(): Promise<string | null> {\n    const host = await this.host();\n\n    const labelledBy = await host.getAttribute('aria-labelledby');\n    if (labelledBy !== null) {\n      // Resolved from the document root: `aria-labelledby` may point anywhere on the\n      // page, and the heading above a group is normally outside it.\n      const root = this.documentRootLocatorFactory();\n      const texts: string[] = [];\n      for (const id of labelledBy.split(/\\s+/).filter(Boolean)) {\n        const target = await root.locatorForOptional(`#${id}`)();\n        if (target) texts.push(await target.text());\n      }\n\n      // A reference that resolves to nothing names nothing, and the computation\n      // falls through to `aria-label` exactly as it does in a browser.\n      if (texts.length) return texts.join(' ');\n    }\n\n    return host.getAttribute('aria-label');\n  }\n\n  /**\n   * The `name` every radio in the group shares.\n   *\n   * Read off the radios because they are the only place it is RELIABLY written: the\n   * group's `name` input reaches the page as an attribute on each native input, and\n   * a bound `[name]=\"…\"` never lands on the group element at all. A literal\n   * `name=\"size\"` does survive on the group element — Angular leaves a static\n   * attribute alone — which is exactly the trap: reading it there works for the\n   * literal form and quietly returns nothing for the bound one.\n   */\n  async getName(): Promise<string> {\n    const [first] = await this.radiosOrThrow();\n    return first.getName();\n  }\n\n  /**\n   * Whether the group refuses every option.\n   *\n   * Answered from the radios, and it could not be otherwise: a bound `[disabled]`\n   * on the group reaches the page only by disabling each native input, so a group\n   * disabled as a whole and a group whose every option is individually disabled\n   * are the same page. They are also the same thing to the person using it, which\n   * is the question a harness should be answering.\n   */\n  async isDisabled(): Promise<boolean> {\n    for (const radio of await this.radiosOrThrow()) {\n      if (!(await radio.isDisabled())) return false;\n    }\n    return true;\n  }\n\n  /** The group's own options, in DOM order. A sibling group's radios are not here. */\n  async getRadios(filters: WrRadioHarnessFilters = {}): Promise<WrRadioHarness[]> {\n    return this.locatorForAll(WrRadioHarness.with(filters))();\n  }\n\n  /** The label of every option, in DOM order. */\n  async getRadioLabels(): Promise<string[]> {\n    const radios = await this.getRadios();\n    return Promise.all(radios.map(radio => radio.getLabel()));\n  }\n\n  /** The checked option, or `null` while the group is unanswered. */\n  async getSelectedRadio(): Promise<WrRadioHarness | null> {\n    const [checked] = await this.getRadios({ checked: true });\n    return checked ?? null;\n  }\n\n  /**\n   * The label of the checked option, or `null` while the group is unanswered.\n   *\n   * Also `null` for a value that matches no radio — the group holds it, nothing is\n   * checked, and the page shows an unanswered question.\n   */\n  async getSelectedLabel(): Promise<string | null> {\n    const selected = await this.getSelectedRadio();\n    return selected ? selected.getLabel() : null;\n  }\n\n  /**\n   * Pick the first option matching the filters — this is how the group's value\n   * changes.\n   *\n   * Throws when nothing matches, naming the options that do exist, and throws\n   * again when the option is still unchecked afterwards. That second failure has\n   * exactly two causes and reports both, because a click that quietly did nothing\n   * surfaces as an unrelated assertion three lines later.\n   */\n  async select(filters: WrRadioHarnessFilters): Promise<void> {\n    const [radio] = await this.getRadios(filters);\n    if (!radio) {\n      throw new Error(\n        `WrRadioGroupHarness.select(): no radio matched ${JSON.stringify(filters)}. This group offers: ` +\n          `${(await this.getRadioLabels()).join(', ')}.`\n      );\n    }\n\n    await radio.check();\n\n    if (!(await radio.isChecked())) {\n      throw new Error(\n        `WrRadioGroupHarness.select(): \"${await radio.getLabel()}\" is still unchecked after being clicked — ` +\n          'either that option carries `disabled` or the whole group does.'\n      );\n    }\n  }\n\n  /**\n   * The label of the option a Tab press would land on, or `null` when every option\n   * is disabled and the group is skipped over entirely.\n   *\n   * A radio group is ONE tab stop, and which radio it is is written down nowhere:\n   * the component authors no roving `tabindex`, because the browser already\n   * applies the native rule to a shared `name` — the checked radio, or the first\n   * enabled one while nothing is checked. So this is DERIVED from the rendered\n   * state rather than read off an attribute, there being no attribute to read.\n   *\n   * Worth asking precisely because those two answers are different radios exactly\n   * when a form opens unanswered, which is the state most specs start in.\n   */\n  async getTabStopLabel(): Promise<string | null> {\n    const stop = await this.tabStop();\n    return stop ? stop.getLabel() : null;\n  }\n\n  /** Put focus where a Tab press would put it. Throws when the group has no tab stop. */\n  async focusTabStop(): Promise<void> {\n    const stop = await this.tabStop();\n    if (!stop) {\n      throw new Error(\n        'WrRadioGroupHarness.focusTabStop(): every option in this group is disabled, so the group is not a ' +\n          'tab stop at all — Tab skips it rather than entering it.'\n      );\n    }\n    await stop.focus();\n  }\n\n  /**\n   * The label of the option that currently holds focus, or `null` when focus is\n   * elsewhere. The counterpart to {@link focusTabStop}: in a real browser the\n   * arrow keys move this, and moving it is also what picks a new answer.\n   */\n  async getFocusedLabel(): Promise<string | null> {\n    for (const radio of await this.getRadios()) {\n      if (await radio.isFocused()) return radio.getLabel();\n    }\n    return null;\n  }\n\n  /** The radio Tab would enter on, applying the browser's rule to the rendered state. */\n  private async tabStop(): Promise<WrRadioHarness | null> {\n    const enabled: WrRadioHarness[] = [];\n    for (const radio of await this.getRadios()) {\n      if (!(await radio.isDisabled())) enabled.push(radio);\n    }\n\n    for (const radio of enabled) {\n      if (await radio.isChecked()) return radio;\n    }\n    return enabled[0] ?? null;\n  }\n\n  /** The options, or a failure saying why an empty group has nothing to report. */\n  private async radiosOrThrow(): Promise<WrRadioHarness[]> {\n    const radios = await this.getRadios();\n    if (!radios.length) {\n      throw new Error(\n        'WrRadioGroupHarness: this group has no <wr-radio> children, and every group-level fact here is read ' +\n          'off them — the shared name and the disabled state reach the DOM through the radios, and a bound ' +\n          '[name] / [disabled] leaves nothing on the group element to read instead.'\n      );\n    }\n    return radios;\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-radio.mjs

@@ -1,6 +1,7 @@
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
 import { InjectionToken, input, inject, computed, ViewEncapsulation, Component, model, output, forwardRef } from '@angular/core';
+import { useConfigValue } from 'ngwr/config';
 import { WrIcon } from 'ngwr/icon';
 import { randomId } from 'ngwr/utils';
 
@@ -38,9 +39,15 @@ class WrRadio {
      */
     icon = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
-    /** Control size — shares the `--wr-control-*` contract. @default 'md' */
-    size = input('md', /* @ts-ignore */
+    /**
+     * Control size — shares the `--wr-control-*` contract. Set per option (the
+     * group has no `size`); unset falls back to the `radio.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.radio?.size, 'md');
     /**
      * Disable just this option. The group can also be disabled as a whole via
      * `<wr-radio-group disabled>`; either source disables this radio.
@@ -63,7 +70,7 @@ class WrRadio {
     ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
     classes = computed(() => {
         const parts = ['wr-radio'];
-        const size = this.size();
+        const size = this.resolvedSize();
         if (size !== 'md')
             parts.push(`wr-radio--${size}`);
         if (this.checked())

package/fesm2022/ngwr-radio.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-radio.mjs","sources":["../../../projects/lib/radio/tokens/radio-group.token.ts","../../../projects/lib/radio/radio.ts","../../../projects/lib/radio/radio.html","../../../projects/lib/radio/radio-group.ts","../../../projects/lib/radio/ngwr-radio.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 { InjectionToken, type Signal } from '@angular/core';\n\n/**\n * Contract a radio uses to talk to its parent `<wr-radio-group>`.\n *\n * @internal\n */\nexport interface WrRadioGroupContext {\n  /** Shared `name` attribute applied to every native input in the group. */\n  readonly name: Signal<string>;\n  /** Currently selected value. */\n  readonly value: Signal<unknown>;\n  /** Whether the entire group is disabled. */\n  readonly isDisabled: Signal<boolean>;\n  /** Select the given value. */\n  select(value: unknown): void;\n  /**\n   * Mark the group as touched (called on blur from any child). Named\n   * `markTouched` rather than `touch` so it doesn't clash with the\n   * `FormUiControl.touch` output the group now exposes for signal forms.\n   */\n  markTouched(): void;\n}\n\n/**\n * Token a `<wr-radio>` injects to participate in its parent `<wr-radio-group>`\n * — reads the selected value, shares the `name` attribute, and signals\n * selection / blur back up.\n *\n * @internal\n */\nexport const WR_RADIO_GROUP = new InjectionToken<WrRadioGroupContext>('WR_RADIO_GROUP');\n","/**\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, inject, input } from '@angular/core';\n\nimport { WrIcon, type WrIconName } from 'ngwr/icon';\nimport { randomId } from 'ngwr/utils';\n\nimport { WR_RADIO_GROUP } from './tokens';\n\n/**\n * Single-choice option. Must be a child of `<wr-radio-group>`.\n *\n * @example\n * ```html\n * <wr-radio-group [(ngModel)]=\"size\">\n *   <wr-radio value=\"sm\">Small</wr-radio>\n *   <wr-radio value=\"md\">Medium</wr-radio>\n *   <wr-radio value=\"lg\">Large</wr-radio>\n * </wr-radio-group>\n * ```\n *\n * @see https://ngwr.dev/reference/components/radio\n */\nexport type WrRadioSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  selector: 'wr-radio',\n  templateUrl: './radio.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { '[class]': 'classes()' },\n  imports: [WrIcon],\n})\nexport class WrRadio {\n  /** Stable id used to associate the native input with its label. */\n  readonly id = input<string>(randomId('wr-radio'));\n\n  /** Value selected when this radio is checked. */\n  readonly value = input.required<unknown>();\n\n  /**\n   * Optional icon name rendered inside the dot when checked, in place of the\n   * default solid circle. Use any registered NGWR icon.\n   */\n  readonly icon = input<WrIconName | null>(null);\n\n  /** Control size — shares the `--wr-control-*` contract. @default 'md' */\n  readonly size = input<WrRadioSize>('md');\n\n  /**\n   * Disable just this option. The group can also be disabled as a whole via\n   * `<wr-radio-group disabled>`; either source disables this radio.\n   *\n   * @default false\n   */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  private readonly group = inject(WR_RADIO_GROUP, { optional: true });\n\n  constructor() {\n    if (!this.group) {\n      throw new Error('[NGWR] <wr-radio> must be used inside <wr-radio-group>.');\n    }\n  }\n\n  protected readonly name = computed(() => this.group?.name() ?? '');\n  protected readonly checked = computed(() => this.group?.value() === this.value());\n  /** Effective disabled — this option's own `disabled` or the group's. */\n  protected readonly isDisabled = computed(() => this.disabled() || (this.group?.isDisabled() ?? false));\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-radio'];\n    const size = this.size();\n    if (size !== 'md') parts.push(`wr-radio--${size}`);\n    if (this.checked()) parts.push('wr-radio--checked');\n    if (this.isDisabled()) parts.push('wr-radio--disabled');\n    if (this.icon()) parts.push('wr-radio--has-icon');\n    return parts.join(' ');\n  });\n\n  protected onSelect(): void {\n    if (this.isDisabled()) return;\n    this.group?.select(this.value());\n  }\n\n  protected onBlur(): void {\n    this.group?.markTouched();\n  }\n}\n","<label class=\"wr-radio__label\" [for]=\"id()\">\n  <input\n    class=\"wr-radio__input\"\n    type=\"radio\"\n    [id]=\"id()\"\n    [name]=\"name()\"\n    [checked]=\"checked()\"\n    [disabled]=\"isDisabled()\"\n    (change)=\"onSelect()\"\n    (blur)=\"onBlur()\"\n  />\n\n  <span class=\"wr-radio__dot\" aria-hidden=\"true\">\n    @if (icon(); as iconName) {\n      <wr-icon class=\"wr-radio__icon\" [name]=\"iconName\" />\n    }\n  </span>\n\n  <span class=\"wr-radio__text\">\n    <ng-content />\n  </span>\n</label>\n","/**\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, forwardRef, input, model, output } from '@angular/core';\nimport type { FormValueControl } from '@angular/forms/signals';\n\nimport { randomId } from 'ngwr/utils';\n\nimport { WR_RADIO_GROUP, type WrRadioGroupContext } from './tokens';\n\n/**\n * Hosts a group of `<wr-radio>` children as a single-value selection.\n *\n * A signal-forms native control: it implements `FormValueControl<unknown>`, so\n * `[formField]` binds to its `value` model — the currently selected radio's\n * `value`. `[(value)]` works standalone. Classic `[(ngModel)]` / reactive forms\n * keep working through Angular's bridge.\n *\n * @example\n * ```html\n * <wr-radio-group [formField]=\"form.size\">\n *   <wr-radio value=\"sm\">Small</wr-radio>\n *   <wr-radio value=\"md\">Medium</wr-radio>\n *   <wr-radio value=\"lg\">Large</wr-radio>\n * </wr-radio-group>\n * ```\n *\n * @see https://ngwr.dev/reference/components/radio\n */\n@Component({\n  selector: 'wr-radio-group',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-radio-group', role: 'radiogroup' },\n  providers: [\n    {\n      provide: WR_RADIO_GROUP,\n      // eslint-disable-next-line @angular-eslint/no-forward-ref\n      useExisting: forwardRef(() => WrRadioGroup),\n    },\n  ],\n})\nexport class WrRadioGroup implements FormValueControl<unknown>, WrRadioGroupContext {\n  /**\n   * Shared `name` attribute. Defaults to a random id so multiple groups\n   * on the same page don't collide. (Also the `FormUiControl.name` slot.)\n   */\n  readonly name = input<string>(randomId('wr-radio-group'));\n\n  /**\n   * Disable the whole group. Bound automatically from the field's disabled\n   * state when used with `[formField]`.\n   *\n   * @default false\n   */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** The selected radio's value. Bound by `[formField]`, or two-way via `[(value)]`. */\n  readonly value = model<unknown>(null);\n\n  /** Emitted on blur from any child so a bound field can mark itself touched. */\n  readonly touch = output<void>();\n\n  /** Effective disabled state (WrRadioGroupContext). */\n  readonly isDisabled = computed(() => this.disabled());\n\n  // WrRadioGroupContext\n\n  select(value: unknown): void {\n    if (this.isDisabled()) return;\n    this.value.set(value);\n  }\n\n  markTouched(): void {\n    this.touch.emit();\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ngwr-radio.mjs","sources":["../../../projects/lib/radio/tokens/radio-group.token.ts","../../../projects/lib/radio/radio.ts","../../../projects/lib/radio/radio.html","../../../projects/lib/radio/radio-group.ts","../../../projects/lib/radio/ngwr-radio.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 { InjectionToken, type Signal } from '@angular/core';\n\n/**\n * Contract a radio uses to talk to its parent `<wr-radio-group>`.\n *\n * @internal\n */\nexport interface WrRadioGroupContext {\n  /** Shared `name` attribute applied to every native input in the group. */\n  readonly name: Signal<string>;\n  /** Currently selected value. */\n  readonly value: Signal<unknown>;\n  /** Whether the entire group is disabled. */\n  readonly isDisabled: Signal<boolean>;\n  /** Select the given value. */\n  select(value: unknown): void;\n  /**\n   * Mark the group as touched (called on blur from any child). Named\n   * `markTouched` rather than `touch` so it doesn't clash with the\n   * `FormUiControl.touch` output the group now exposes for signal forms.\n   */\n  markTouched(): void;\n}\n\n/**\n * Token a `<wr-radio>` injects to participate in its parent `<wr-radio-group>`\n * — reads the selected value, shares the `name` attribute, and signals\n * selection / blur back up.\n *\n * @internal\n */\nexport const WR_RADIO_GROUP = new InjectionToken<WrRadioGroupContext>('WR_RADIO_GROUP');\n","/**\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, inject, input } from '@angular/core';\n\nimport { useConfigValue } from 'ngwr/config';\nimport { WrIcon, type WrIconName } from 'ngwr/icon';\nimport { randomId } from 'ngwr/utils';\n\nimport { WR_RADIO_GROUP } from './tokens';\n\n/**\n * Single-choice option. Must be a child of `<wr-radio-group>`.\n *\n * @example\n * ```html\n * <wr-radio-group [(ngModel)]=\"size\">\n *   <wr-radio value=\"sm\">Small</wr-radio>\n *   <wr-radio value=\"md\">Medium</wr-radio>\n *   <wr-radio value=\"lg\">Large</wr-radio>\n * </wr-radio-group>\n * ```\n *\n * @see https://ngwr.dev/reference/components/radio\n */\nexport type WrRadioSize = 'sm' | 'md' | 'lg';\n\n@Component({\n  selector: 'wr-radio',\n  templateUrl: './radio.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { '[class]': 'classes()' },\n  imports: [WrIcon],\n})\nexport class WrRadio {\n  /** Stable id used to associate the native input with its label. */\n  readonly id = input<string>(randomId('wr-radio'));\n\n  /** Value selected when this radio is checked. */\n  readonly value = input.required<unknown>();\n\n  /**\n   * Optional icon name rendered inside the dot when checked, in place of the\n   * default solid circle. Use any registered NGWR icon.\n   */\n  readonly icon = input<WrIconName | null>(null);\n\n  /**\n   * Control size — shares the `--wr-control-*` contract. Set per option (the\n   * group has no `size`); unset falls back to the `radio.size` app default from\n   * `provideWrConfig()`. @default 'md'\n   */\n  readonly size = input<WrRadioSize | null>(null);\n\n  /** `size`, then the app config, then `md`. @internal */\n  protected readonly resolvedSize = useConfigValue(this.size, c => c.radio?.size, 'md');\n\n  /**\n   * Disable just this option. The group can also be disabled as a whole via\n   * `<wr-radio-group disabled>`; either source disables this radio.\n   *\n   * @default false\n   */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  private readonly group = inject(WR_RADIO_GROUP, { optional: true });\n\n  constructor() {\n    if (!this.group) {\n      throw new Error('[NGWR] <wr-radio> must be used inside <wr-radio-group>.');\n    }\n  }\n\n  protected readonly name = computed(() => this.group?.name() ?? '');\n  protected readonly checked = computed(() => this.group?.value() === this.value());\n  /** Effective disabled — this option's own `disabled` or the group's. */\n  protected readonly isDisabled = computed(() => this.disabled() || (this.group?.isDisabled() ?? false));\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-radio'];\n    const size = this.resolvedSize();\n    if (size !== 'md') parts.push(`wr-radio--${size}`);\n    if (this.checked()) parts.push('wr-radio--checked');\n    if (this.isDisabled()) parts.push('wr-radio--disabled');\n    if (this.icon()) parts.push('wr-radio--has-icon');\n    return parts.join(' ');\n  });\n\n  protected onSelect(): void {\n    if (this.isDisabled()) return;\n    this.group?.select(this.value());\n  }\n\n  protected onBlur(): void {\n    this.group?.markTouched();\n  }\n}\n","<label class=\"wr-radio__label\" [for]=\"id()\">\n  <input\n    class=\"wr-radio__input\"\n    type=\"radio\"\n    [id]=\"id()\"\n    [name]=\"name()\"\n    [checked]=\"checked()\"\n    [disabled]=\"isDisabled()\"\n    (change)=\"onSelect()\"\n    (blur)=\"onBlur()\"\n  />\n\n  <span class=\"wr-radio__dot\" aria-hidden=\"true\">\n    @if (icon(); as iconName) {\n      <wr-icon class=\"wr-radio__icon\" [name]=\"iconName\" />\n    }\n  </span>\n\n  <span class=\"wr-radio__text\">\n    <ng-content />\n  </span>\n</label>\n","/**\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, forwardRef, input, model, output } from '@angular/core';\nimport type { FormValueControl } from '@angular/forms/signals';\n\nimport { randomId } from 'ngwr/utils';\n\nimport { WR_RADIO_GROUP, type WrRadioGroupContext } from './tokens';\n\n/**\n * Hosts a group of `<wr-radio>` children as a single-value selection.\n *\n * A signal-forms native control: it implements `FormValueControl<unknown>`, so\n * `[formField]` binds to its `value` model — the currently selected radio's\n * `value`. `[(value)]` works standalone. Classic `[(ngModel)]` / reactive forms\n * keep working through Angular's bridge.\n *\n * @example\n * ```html\n * <wr-radio-group [formField]=\"form.size\">\n *   <wr-radio value=\"sm\">Small</wr-radio>\n *   <wr-radio value=\"md\">Medium</wr-radio>\n *   <wr-radio value=\"lg\">Large</wr-radio>\n * </wr-radio-group>\n * ```\n *\n * @see https://ngwr.dev/reference/components/radio\n */\n@Component({\n  selector: 'wr-radio-group',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-radio-group', role: 'radiogroup' },\n  providers: [\n    {\n      provide: WR_RADIO_GROUP,\n      // eslint-disable-next-line @angular-eslint/no-forward-ref\n      useExisting: forwardRef(() => WrRadioGroup),\n    },\n  ],\n})\nexport class WrRadioGroup implements FormValueControl<unknown>, WrRadioGroupContext {\n  /**\n   * Shared `name` attribute. Defaults to a random id so multiple groups\n   * on the same page don't collide. (Also the `FormUiControl.name` slot.)\n   */\n  readonly name = input<string>(randomId('wr-radio-group'));\n\n  /**\n   * Disable the whole group. Bound automatically from the field's disabled\n   * state when used with `[formField]`.\n   *\n   * @default false\n   */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** The selected radio's value. Bound by `[formField]`, or two-way via `[(value)]`. */\n  readonly value = model<unknown>(null);\n\n  /** Emitted on blur from any child so a bound field can mark itself touched. */\n  readonly touch = output<void>();\n\n  /** Effective disabled state (WrRadioGroupContext). */\n  readonly isDisabled = computed(() => this.disabled());\n\n  // WrRadioGroupContext\n\n  select(value: unknown): void {\n    if (this.isDisabled()) return;\n    this.value.set(value);\n  }\n\n  markTouched(): void {\n    this.touch.emit();\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}