ngwr 10.1.0 → 10.2.1

package/fesm2022/ngwr-button.mjs

@@ -1,6 +1,6 @@
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
-import { InjectionToken, input, inject, computed, ViewEncapsulation, Component, forwardRef } from '@angular/core';
+import { InjectionToken, input, inject, computed, ElementRef, ViewEncapsulation, Component, forwardRef } from '@angular/core';
 import { WrIcon } from 'ngwr/icon';
 import { WrSpinner } from 'ngwr/spinner';
 
@@ -102,11 +102,53 @@ class WrButton {
      */
     effectiveShape = computed(() => this.group ? (this.group.shape() ?? 'rounded') : (this.shape() ?? 'rounded'), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "effectiveShape" }] : /* istanbul ignore next */ []));
-    nativeDisabled = computed(() => {
-        const off = this.disabled() || (this.loading() && this.isDisabledWhenLoading());
-        return off ? '' : null;
-    }, /* @ts-ignore */
+    hostEl = inject(ElementRef);
+    /**
+     * Whether this instance is the `<wr-btn>` ELEMENT rather than the attribute
+     * form on a native `<button>` / `<a>`.
+     *
+     * The element form is documented as first-class and is what the pagination,
+     * event-calendar and popconfirm chrome use — but a custom element has no
+     * button semantics of its own. It was rendering with no `role`, no
+     * `tabindex` and no keyboard activation, so it was invisible to assistive
+     * tech and unreachable by Tab. Measured in Chromium against the built site:
+     * the whole `wr-pagination` subtree, 26 elements, contained ZERO focusable
+     * nodes and sixty Tab presses never entered it. axe cannot see this — an
+     * unknown element with no role simply is not an interactive control to it,
+     * which is the same blind spot that lets `disabled` pass unnoticed on a
+     * custom element.
+     */
+    isCustomHost = this.hostEl.nativeElement.tagName === 'WR-BTN';
+    isOff = computed(() => this.disabled() || (this.loading() && this.isDisabledWhenLoading()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isOff" }] : /* istanbul ignore next */ []));
+    nativeDisabled = computed(() => (this.isOff() ? '' : null), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "nativeDisabled" }] : /* istanbul ignore next */ []));
+    hostRole = computed(() => (this.isCustomHost ? 'button' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hostRole" }] : /* istanbul ignore next */ []));
+    /** Out of the tab order while off — `disabled` is inert on a custom element. */
+    hostTabIndex = computed(() => (this.isCustomHost && !this.isOff() ? '0' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hostTabIndex" }] : /* istanbul ignore next */ []));
+    hostAriaDisabled = computed(() => this.isCustomHost && this.isOff() ? 'true' : null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hostAriaDisabled" }] : /* istanbul ignore next */ []));
+    /**
+     * Enter and Space activate a button. A native one does this for free; a
+     * custom element does not, so without this the element form could be focused
+     * (once it had a tabindex) and still not be operable.
+     *
+     * `preventDefault` on Space is not optional — it scrolls the page otherwise.
+     * The pointer path needs no guard here: `.wr-btn[disabled]` already sets
+     * `pointer-events: none`.
+     */
+    onHostKeydown(event) {
+        if (!this.isCustomHost)
+            return;
+        if (event.key !== 'Enter' && event.key !== ' ')
+            return;
+        event.preventDefault();
+        if (this.isOff())
+            return;
+        this.hostEl.nativeElement.click();
+    }
     classes = computed(() => {
         const parts = ['wr-btn'];
         const color = this.color();
@@ -130,15 +172,21 @@ class WrButton {
         return parts.join(' ');
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: WrButton, isStandalone: true, selector: "wr-btn, button[wr-btn], a[wr-btn]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, outlined: { classPropertyName: "outlined", publicName: "outlined", isSignal: true, isRequired: false, transformFunction: null }, block: { classPropertyName: "block", publicName: "block", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, isDisabledWhenLoading: { classPropertyName: "isDisabledWhenLoading", publicName: "isDisabledWhenLoading", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "attr.disabled": "nativeDisabled()", "attr.aria-busy": "loading() ? \"true\" : null" } }, ngImport: i0, template: "@if (loading()) {\n  <wr-spinner class=\"wr-btn__spin\" size=\"sm\" />\n}\n\n@if (icon(); as name) {\n  <wr-icon class=\"wr-btn__icon\" [name]=\"name\" />\n}\n\n<span class=\"wr-btn__label\">\n  <ng-content />\n</span>\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }, { kind: "component", type: WrSpinner, selector: "wr-spinner", inputs: ["size"] }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: WrButton, isStandalone: true, selector: "wr-btn, button[wr-btn], a[wr-btn]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, outlined: { classPropertyName: "outlined", publicName: "outlined", isSignal: true, isRequired: false, transformFunction: null }, block: { classPropertyName: "block", publicName: "block", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, isDisabledWhenLoading: { classPropertyName: "isDisabledWhenLoading", publicName: "isDisabledWhenLoading", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "keydown": "onHostKeydown($event)" }, properties: { "class": "classes()", "attr.disabled": "nativeDisabled()", "attr.aria-busy": "loading() ? \"true\" : null", "attr.role": "hostRole()", "attr.tabindex": "hostTabIndex()", "attr.aria-disabled": "hostAriaDisabled()" } }, ngImport: i0, template: "@if (loading()) {\n  <wr-spinner class=\"wr-btn__spin\" size=\"sm\" />\n}\n\n@if (icon(); as name) {\n  <wr-icon class=\"wr-btn__icon\" [name]=\"name\" />\n}\n\n<span class=\"wr-btn__label\">\n  <ng-content />\n</span>\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }, { kind: "component", type: WrSpinner, selector: "wr-spinner", inputs: ["size"] }], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrButton, decorators: [{
             type: Component,
             args: [{ selector: 'wr-btn, button[wr-btn], a[wr-btn]', encapsulation: ViewEncapsulation.None, host: {
                         '[class]': 'classes()',
                         '[attr.disabled]': 'nativeDisabled()',
                         '[attr.aria-busy]': 'loading() ? "true" : null',
+                        // The three below apply ONLY to the `<wr-btn>` element form — see
+                        // `isCustomHost`. A native `<button>` / `<a>` already has all of it.
+                        '[attr.role]': 'hostRole()',
+                        '[attr.tabindex]': 'hostTabIndex()',
+                        '[attr.aria-disabled]': 'hostAriaDisabled()',
+                        '(keydown)': 'onHostKeydown($event)',
                     }, imports: [WrIcon, WrSpinner], template: "@if (loading()) {\n  <wr-spinner class=\"wr-btn__spin\" size=\"sm\" />\n}\n\n@if (icon(); as name) {\n  <wr-icon class=\"wr-btn__icon\" [name]=\"name\" />\n}\n\n<span class=\"wr-btn__label\">\n  <ng-content />\n</span>\n" }]
         }], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconPosition", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], outlined: [{ type: i0.Input, args: [{ isSignal: true, alias: "outlined", required: false }] }], block: [{ type: i0.Input, args: [{ isSignal: true, alias: "block", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], isDisabledWhenLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabledWhenLoading", required: false }] }] } });
 
@@ -188,10 +236,10 @@ class WrButtonGroup {
         return parts.join(' ');
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrButtonGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: WrButtonGroup, isStandalone: true, selector: "wr-btn-group", inputs: { shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "class": "hostClasses()" } }, providers: [{ provide: WR_BUTTON_GROUP, useExisting: forwardRef(() => WrButtonGroup) }], ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrButtonGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: WrButtonGroup, isStandalone: true, selector: "wr-btn-group", inputs: { shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "class": "hostClasses()" } }, providers: [{ provide: WR_BUTTON_GROUP, useExisting: forwardRef(() => WrButtonGroup) }], ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrButtonGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrButtonGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-btn-group',

package/fesm2022/ngwr-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-button.mjs","sources":["../../../projects/lib/button/tokens/button-group.token.ts","../../../projects/lib/button/button.ts","../../../projects/lib/button/button.html","../../../projects/lib/button/button-group.ts","../../../projects/lib/button/ngwr-button.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\nimport type { WrButtonShape } from '../interfaces';\n\n/**\n * Contract a child `<wr-btn>` reads from its enclosing `<wr-btn-group>`.\n *\n * @internal\n */\nexport interface WrButtonGroupContext {\n  /** Shape cascade — child buttons fall back to this when they don't set their own. */\n  readonly shape: Signal<WrButtonShape | null>;\n}\n\n/**\n * Token a `<wr-btn>` injects to discover its parent `<wr-btn-group>`. The\n * group provides itself via this token so children can react to the\n * group's `shape` cascade.\n *\n * @internal\n */\nexport const WR_BUTTON_GROUP = new InjectionToken<WrButtonGroupContext>('WR_BUTTON_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 { WrSpinner } from 'ngwr/spinner';\nimport type { WrColor } from 'ngwr/theme';\n\nimport type { WrButtonIconPosition, WrButtonShape, WrButtonSize } from './interfaces';\nimport { WR_BUTTON_GROUP } from './tokens';\n\n/**\n * Trigger an action. Renders as a `<wr-btn>` element, or attach to a\n * native `<button>` / `<a>` via the `wr-btn` attribute selector.\n *\n * @example\n * ```html\n * <button wr-btn color=\"primary\">Save</button>\n * <a wr-btn color=\"primary\" outlined>Cancel</a>\n * <wr-btn color=\"danger\" icon=\"trash\">Delete</wr-btn>\n * <wr-btn color=\"primary\" shape=\"pill\">Pill</wr-btn>\n * ```\n *\n * **Squircle?** Wrap with `[wrSquircle]` — the directive is the only\n * way ngwr ships smooth-corner clip-paths:\n *\n * ```html\n * <wr-btn wrSquircle [radius]=\"14\">Squircle</wr-btn>\n * ```\n *\n * Inside a `<wr-btn-group shape=\"…\">`, the group's shape is enforced on\n * every child — child `[shape]` inputs are ignored so the group reads as\n * one coherent control.\n *\n * @see https://ngwr.dev/reference/components/button\n */\n@Component({\n  selector: 'wr-btn, button[wr-btn], a[wr-btn]',\n  templateUrl: './button.html',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'classes()',\n    '[attr.disabled]': 'nativeDisabled()',\n    '[attr.aria-busy]': 'loading() ? \"true\" : null',\n  },\n  imports: [WrIcon, WrSpinner],\n})\nexport class WrButton {\n  /** Color variant. Omit for the neutral default style. @default null */\n  readonly color = input<WrColor | null>(null);\n\n  /** Size variant. @default 'md' */\n  readonly size = input<WrButtonSize>('md');\n\n  /**\n   * Corner treatment — `rounded` or `pill`. `null` (default) falls back\n   * to `rounded`. Inside a `<wr-btn-group shape=\"…\">`, the group's shape\n   * ALWAYS wins over this input — the group enforces a consistent corner\n   * treatment across its members.\n   *\n   * @default null\n   */\n  readonly shape = input<WrButtonShape | null>(null);\n\n  /**\n   * Icon name to render alongside the label. The icon is hidden while\n   * `loading` is `true` so the spinner can take its place.\n   *\n   * @default null\n   */\n  readonly icon = input<WrIconName | null>(null);\n\n  /** Position of the icon relative to the label. @default 'start' */\n  readonly iconPosition = input<WrButtonIconPosition>('start');\n\n  /** Disable the button. @default false */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** Outlined variant — colored text and border on a transparent background. @default false */\n  readonly outlined = input(false, { transform: coerceBooleanProperty });\n\n  /** Stretch the button to fill its parent's width. @default false */\n  readonly block = input(false, { transform: coerceBooleanProperty });\n\n  /** Show a spinner overlaying the label. Layout is preserved. @default false */\n  readonly loading = input(false, { transform: coerceBooleanProperty });\n\n  /**\n   * When `loading` is `true` and this is also `true`, pointer events are\n   * suppressed and the button reports as disabled to assistive tech.\n   *\n   * @default true\n   */\n  readonly isDisabledWhenLoading = input(true, { transform: coerceBooleanProperty });\n\n  private readonly group = inject(WR_BUTTON_GROUP, { optional: true });\n\n  /**\n   * Resolved shape. Inside a `<wr-btn-group>`, the group ALWAYS wins —\n   * child `[shape]` is ignored entirely so the group reads as one\n   * coherent control. Outside a group, the button's own `[shape]` is\n   * used, falling back to `rounded`.\n   */\n  protected readonly effectiveShape = computed<WrButtonShape>(() =>\n    this.group ? (this.group.shape() ?? 'rounded') : (this.shape() ?? 'rounded')\n  );\n\n  protected readonly nativeDisabled = computed<'' | null>(() => {\n    const off = this.disabled() || (this.loading() && this.isDisabledWhenLoading());\n    return off ? '' : null;\n  });\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-btn'];\n\n    const color = this.color();\n    if (color) parts.push(`wr-btn--${color}`);\n\n    const size = this.size();\n    if (size !== 'md') parts.push(`wr-btn--${size}`);\n\n    const shape = this.effectiveShape();\n    if (shape !== 'rounded') parts.push(`wr-btn--${shape}`);\n\n    if (this.outlined()) parts.push('wr-btn--outlined');\n    if (this.block()) parts.push('wr-btn--block');\n    if (this.loading()) parts.push('wr-btn--loading');\n\n    const hasAdornment = !!this.icon() || this.loading();\n    if (hasAdornment) parts.push(`wr-btn--icon-${this.iconPosition()}`);\n\n    return parts.join(' ');\n  });\n}\n","@if (loading()) {\n  <wr-spinner class=\"wr-btn__spin\" size=\"sm\" />\n}\n\n@if (icon(); as name) {\n  <wr-icon class=\"wr-btn__icon\" [name]=\"name\" />\n}\n\n<span class=\"wr-btn__label\">\n  <ng-content />\n</span>\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 { Component, ViewEncapsulation, computed, forwardRef, input } from '@angular/core';\n\nimport type { WrButtonShape } from './interfaces';\nimport { WR_BUTTON_GROUP, type WrButtonGroupContext } from './tokens';\n\n/**\n * Visually group buttons by merging their borders. Optionally enforce a\n * single corner treatment across every child via `[shape]` — child\n * `<wr-btn>` `[shape]` inputs are ignored when set on the group.\n *\n * @example\n * ```html\n * <wr-btn-group>\n *   <button wr-btn>Left</button>\n *   <button wr-btn>Middle</button>\n *   <button wr-btn>Right</button>\n * </wr-btn-group>\n *\n * <wr-btn-group shape=\"pill\">\n *   <button wr-btn>One</button>\n *   <button wr-btn>Two</button>\n *   <button wr-btn>Three</button>\n * </wr-btn-group>\n * ```\n *\n * @see https://ngwr.dev/reference/components/button-group\n */\n@Component({\n  selector: 'wr-btn-group',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'hostClasses()',\n    role: 'group',\n  },\n  // forwardRef required: WrButtonGroup is self-referenced before its declaration ends.\n  // eslint-disable-next-line @angular-eslint/no-forward-ref\n  providers: [{ provide: WR_BUTTON_GROUP, useExisting: forwardRef(() => WrButtonGroup) }],\n})\nexport class WrButtonGroup implements WrButtonGroupContext {\n  /**\n   * Corner treatment enforced on every child `<wr-btn>`. Child `[shape]`\n   * inputs are ignored when this is set — the group exists to make a\n   * uniform control. `null` (default) leaves children alone.\n   *\n   * @default null\n   */\n  readonly shape = input<WrButtonShape | null>(null);\n\n  protected readonly hostClasses = computed(() => {\n    const parts = ['wr-btn-group'];\n    const s = this.shape();\n    if (s) parts.push(`wr-btn-group--${s}`);\n    return parts.join(' ');\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-button.mjs","sources":["../../../projects/lib/button/tokens/button-group.token.ts","../../../projects/lib/button/button.ts","../../../projects/lib/button/button.html","../../../projects/lib/button/button-group.ts","../../../projects/lib/button/ngwr-button.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\nimport type { WrButtonShape } from '../interfaces';\n\n/**\n * Contract a child `<wr-btn>` reads from its enclosing `<wr-btn-group>`.\n *\n * @internal\n */\nexport interface WrButtonGroupContext {\n  /** Shape cascade — child buttons fall back to this when they don't set their own. */\n  readonly shape: Signal<WrButtonShape | null>;\n}\n\n/**\n * Token a `<wr-btn>` injects to discover its parent `<wr-btn-group>`. The\n * group provides itself via this token so children can react to the\n * group's `shape` cascade.\n *\n * @internal\n */\nexport const WR_BUTTON_GROUP = new InjectionToken<WrButtonGroupContext>('WR_BUTTON_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, ElementRef, ViewEncapsulation, computed, inject, input } from '@angular/core';\n\nimport { WrIcon, type WrIconName } from 'ngwr/icon';\nimport { WrSpinner } from 'ngwr/spinner';\nimport type { WrColor } from 'ngwr/theme';\n\nimport type { WrButtonIconPosition, WrButtonShape, WrButtonSize } from './interfaces';\nimport { WR_BUTTON_GROUP } from './tokens';\n\n/**\n * Trigger an action. Renders as a `<wr-btn>` element, or attach to a\n * native `<button>` / `<a>` via the `wr-btn` attribute selector.\n *\n * @example\n * ```html\n * <button wr-btn color=\"primary\">Save</button>\n * <a wr-btn color=\"primary\" outlined>Cancel</a>\n * <wr-btn color=\"danger\" icon=\"trash\">Delete</wr-btn>\n * <wr-btn color=\"primary\" shape=\"pill\">Pill</wr-btn>\n * ```\n *\n * **Squircle?** Wrap with `[wrSquircle]` — the directive is the only\n * way ngwr ships smooth-corner clip-paths:\n *\n * ```html\n * <wr-btn wrSquircle [radius]=\"14\">Squircle</wr-btn>\n * ```\n *\n * Inside a `<wr-btn-group shape=\"…\">`, the group's shape is enforced on\n * every child — child `[shape]` inputs are ignored so the group reads as\n * one coherent control.\n *\n * @see https://ngwr.dev/reference/components/button\n */\n@Component({\n  selector: 'wr-btn, button[wr-btn], a[wr-btn]',\n  templateUrl: './button.html',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'classes()',\n    '[attr.disabled]': 'nativeDisabled()',\n    '[attr.aria-busy]': 'loading() ? \"true\" : null',\n    // The three below apply ONLY to the `<wr-btn>` element form — see\n    // `isCustomHost`. A native `<button>` / `<a>` already has all of it.\n    '[attr.role]': 'hostRole()',\n    '[attr.tabindex]': 'hostTabIndex()',\n    '[attr.aria-disabled]': 'hostAriaDisabled()',\n    '(keydown)': 'onHostKeydown($event)',\n  },\n  imports: [WrIcon, WrSpinner],\n})\nexport class WrButton {\n  /** Color variant. Omit for the neutral default style. @default null */\n  readonly color = input<WrColor | null>(null);\n\n  /** Size variant. @default 'md' */\n  readonly size = input<WrButtonSize>('md');\n\n  /**\n   * Corner treatment — `rounded` or `pill`. `null` (default) falls back\n   * to `rounded`. Inside a `<wr-btn-group shape=\"…\">`, the group's shape\n   * ALWAYS wins over this input — the group enforces a consistent corner\n   * treatment across its members.\n   *\n   * @default null\n   */\n  readonly shape = input<WrButtonShape | null>(null);\n\n  /**\n   * Icon name to render alongside the label. The icon is hidden while\n   * `loading` is `true` so the spinner can take its place.\n   *\n   * @default null\n   */\n  readonly icon = input<WrIconName | null>(null);\n\n  /** Position of the icon relative to the label. @default 'start' */\n  readonly iconPosition = input<WrButtonIconPosition>('start');\n\n  /** Disable the button. @default false */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** Outlined variant — colored text and border on a transparent background. @default false */\n  readonly outlined = input(false, { transform: coerceBooleanProperty });\n\n  /** Stretch the button to fill its parent's width. @default false */\n  readonly block = input(false, { transform: coerceBooleanProperty });\n\n  /** Show a spinner overlaying the label. Layout is preserved. @default false */\n  readonly loading = input(false, { transform: coerceBooleanProperty });\n\n  /**\n   * When `loading` is `true` and this is also `true`, pointer events are\n   * suppressed and the button reports as disabled to assistive tech.\n   *\n   * @default true\n   */\n  readonly isDisabledWhenLoading = input(true, { transform: coerceBooleanProperty });\n\n  private readonly group = inject(WR_BUTTON_GROUP, { optional: true });\n\n  /**\n   * Resolved shape. Inside a `<wr-btn-group>`, the group ALWAYS wins —\n   * child `[shape]` is ignored entirely so the group reads as one\n   * coherent control. Outside a group, the button's own `[shape]` is\n   * used, falling back to `rounded`.\n   */\n  protected readonly effectiveShape = computed<WrButtonShape>(() =>\n    this.group ? (this.group.shape() ?? 'rounded') : (this.shape() ?? 'rounded')\n  );\n\n  private readonly hostEl = inject<ElementRef<HTMLElement>>(ElementRef);\n\n  /**\n   * Whether this instance is the `<wr-btn>` ELEMENT rather than the attribute\n   * form on a native `<button>` / `<a>`.\n   *\n   * The element form is documented as first-class and is what the pagination,\n   * event-calendar and popconfirm chrome use — but a custom element has no\n   * button semantics of its own. It was rendering with no `role`, no\n   * `tabindex` and no keyboard activation, so it was invisible to assistive\n   * tech and unreachable by Tab. Measured in Chromium against the built site:\n   * the whole `wr-pagination` subtree, 26 elements, contained ZERO focusable\n   * nodes and sixty Tab presses never entered it. axe cannot see this — an\n   * unknown element with no role simply is not an interactive control to it,\n   * which is the same blind spot that lets `disabled` pass unnoticed on a\n   * custom element.\n   */\n  private readonly isCustomHost = this.hostEl.nativeElement.tagName === 'WR-BTN';\n\n  private readonly isOff = computed(() => this.disabled() || (this.loading() && this.isDisabledWhenLoading()));\n\n  protected readonly nativeDisabled = computed<'' | null>(() => (this.isOff() ? '' : null));\n\n  protected readonly hostRole = computed<'button' | null>(() => (this.isCustomHost ? 'button' : null));\n\n  /** Out of the tab order while off — `disabled` is inert on a custom element. */\n  protected readonly hostTabIndex = computed<'0' | null>(() => (this.isCustomHost && !this.isOff() ? '0' : null));\n\n  protected readonly hostAriaDisabled = computed<'true' | null>(() =>\n    this.isCustomHost && this.isOff() ? 'true' : null\n  );\n\n  /**\n   * Enter and Space activate a button. A native one does this for free; a\n   * custom element does not, so without this the element form could be focused\n   * (once it had a tabindex) and still not be operable.\n   *\n   * `preventDefault` on Space is not optional — it scrolls the page otherwise.\n   * The pointer path needs no guard here: `.wr-btn[disabled]` already sets\n   * `pointer-events: none`.\n   */\n  protected onHostKeydown(event: KeyboardEvent): void {\n    if (!this.isCustomHost) return;\n    if (event.key !== 'Enter' && event.key !== ' ') return;\n\n    event.preventDefault();\n    if (this.isOff()) return;\n    this.hostEl.nativeElement.click();\n  }\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-btn'];\n\n    const color = this.color();\n    if (color) parts.push(`wr-btn--${color}`);\n\n    const size = this.size();\n    if (size !== 'md') parts.push(`wr-btn--${size}`);\n\n    const shape = this.effectiveShape();\n    if (shape !== 'rounded') parts.push(`wr-btn--${shape}`);\n\n    if (this.outlined()) parts.push('wr-btn--outlined');\n    if (this.block()) parts.push('wr-btn--block');\n    if (this.loading()) parts.push('wr-btn--loading');\n\n    const hasAdornment = !!this.icon() || this.loading();\n    if (hasAdornment) parts.push(`wr-btn--icon-${this.iconPosition()}`);\n\n    return parts.join(' ');\n  });\n}\n","@if (loading()) {\n  <wr-spinner class=\"wr-btn__spin\" size=\"sm\" />\n}\n\n@if (icon(); as name) {\n  <wr-icon class=\"wr-btn__icon\" [name]=\"name\" />\n}\n\n<span class=\"wr-btn__label\">\n  <ng-content />\n</span>\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 { Component, ViewEncapsulation, computed, forwardRef, input } from '@angular/core';\n\nimport type { WrButtonShape } from './interfaces';\nimport { WR_BUTTON_GROUP, type WrButtonGroupContext } from './tokens';\n\n/**\n * Visually group buttons by merging their borders. Optionally enforce a\n * single corner treatment across every child via `[shape]` — child\n * `<wr-btn>` `[shape]` inputs are ignored when set on the group.\n *\n * @example\n * ```html\n * <wr-btn-group>\n *   <button wr-btn>Left</button>\n *   <button wr-btn>Middle</button>\n *   <button wr-btn>Right</button>\n * </wr-btn-group>\n *\n * <wr-btn-group shape=\"pill\">\n *   <button wr-btn>One</button>\n *   <button wr-btn>Two</button>\n *   <button wr-btn>Three</button>\n * </wr-btn-group>\n * ```\n *\n * @see https://ngwr.dev/reference/components/button-group\n */\n@Component({\n  selector: 'wr-btn-group',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'hostClasses()',\n    role: 'group',\n  },\n  // forwardRef required: WrButtonGroup is self-referenced before its declaration ends.\n  // eslint-disable-next-line @angular-eslint/no-forward-ref\n  providers: [{ provide: WR_BUTTON_GROUP, useExisting: forwardRef(() => WrButtonGroup) }],\n})\nexport class WrButtonGroup implements WrButtonGroupContext {\n  /**\n   * Corner treatment enforced on every child `<wr-btn>`. Child `[shape]`\n   * inputs are ignored when this is set — the group exists to make a\n   * uniform control. `null` (default) leaves children alone.\n   *\n   * @default null\n   */\n  readonly shape = input<WrButtonShape | null>(null);\n\n  protected readonly hostClasses = computed(() => {\n    const parts = ['wr-btn-group'];\n    const s = this.shape();\n    if (s) parts.push(`wr-btn-group--${s}`);\n    return parts.join(' ');\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-calendar-heatmap.mjs

@@ -129,10 +129,10 @@ class WrCalendarHeatmap {
             return 0.75;
         return 1;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrCalendarHeatmap, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: WrCalendarHeatmap, isStandalone: true, selector: "wr-calendar-heatmap", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, weeks: { classPropertyName: "weeks", publicName: "weeks", isSignal: true, isRequired: false, transformFunction: null }, cellSize: { classPropertyName: "cellSize", publicName: "cellSize", isSignal: true, isRequired: false, transformFunction: null }, cellGap: { classPropertyName: "cellGap", publicName: "cellGap", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, emptyColor: { classPropertyName: "emptyColor", publicName: "emptyColor", isSignal: true, isRequired: false, transformFunction: null }, showLabels: { classPropertyName: "showLabels", publicName: "showLabels", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-calendar-heatmap" }, ngImport: i0, template: "<div\n  class=\"wr-calendar-heatmap__grid\"\n  [style.--wr-heatmap-cell-size.px]=\"cellSize()\"\n  [style.--wr-heatmap-cell-gap.px]=\"cellGap()\"\n  [style.--wr-heatmap-columns]=\"columnCount()\"\n>\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__weekdays\">\n      @for (label of weekdayLabels; track $index) {\n        <span class=\"wr-calendar-heatmap__weekday\">{{ label }}</span>\n      }\n    </div>\n  }\n\n  <div class=\"wr-calendar-heatmap__cells\">\n    @for (cell of cells(); track cell.iso) {\n      <span\n        class=\"wr-calendar-heatmap__cell\"\n        [style.background]=\"colorFor(cell.intensity)\"\n        [style.opacity]=\"opacityFor(cell.intensity)\"\n        [style.grid-column]=\"cell.week + 1\"\n        [style.grid-row]=\"cell.day + 1\"\n        [title]=\"`${cell.iso}: ${cell.value}`\"\n      ></span>\n    }\n  </div>\n\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__months\">\n      @for (m of monthLabels(); track $index) {\n        <span class=\"wr-calendar-heatmap__month\" [style.grid-column]=\"m.week + 1\">{{ m.label }}</span>\n      }\n    </div>\n  }\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrCalendarHeatmap, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: WrCalendarHeatmap, isStandalone: true, selector: "wr-calendar-heatmap", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, weeks: { classPropertyName: "weeks", publicName: "weeks", isSignal: true, isRequired: false, transformFunction: null }, cellSize: { classPropertyName: "cellSize", publicName: "cellSize", isSignal: true, isRequired: false, transformFunction: null }, cellGap: { classPropertyName: "cellGap", publicName: "cellGap", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, emptyColor: { classPropertyName: "emptyColor", publicName: "emptyColor", isSignal: true, isRequired: false, transformFunction: null }, showLabels: { classPropertyName: "showLabels", publicName: "showLabels", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-calendar-heatmap" }, ngImport: i0, template: "<div\n  class=\"wr-calendar-heatmap__grid\"\n  [style.--wr-heatmap-cell-size.px]=\"cellSize()\"\n  [style.--wr-heatmap-cell-gap.px]=\"cellGap()\"\n  [style.--wr-heatmap-columns]=\"columnCount()\"\n>\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__weekdays\">\n      @for (label of weekdayLabels; track $index) {\n        <span class=\"wr-calendar-heatmap__weekday\">{{ label }}</span>\n      }\n    </div>\n  }\n\n  <div class=\"wr-calendar-heatmap__cells\">\n    @for (cell of cells(); track cell.iso) {\n      <span\n        class=\"wr-calendar-heatmap__cell\"\n        [style.background]=\"colorFor(cell.intensity)\"\n        [style.opacity]=\"opacityFor(cell.intensity)\"\n        [style.grid-column]=\"cell.week + 1\"\n        [style.grid-row]=\"cell.day + 1\"\n        [title]=\"`${cell.iso}: ${cell.value}`\"\n      ></span>\n    }\n  </div>\n\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__months\">\n      @for (m of monthLabels(); track $index) {\n        <span class=\"wr-calendar-heatmap__month\" [style.grid-column]=\"m.week + 1\">{{ m.label }}</span>\n      }\n    </div>\n  }\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrCalendarHeatmap, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrCalendarHeatmap, decorators: [{
             type: Component,
             args: [{ selector: 'wr-calendar-heatmap', encapsulation: ViewEncapsulation.None, host: { class: 'wr-calendar-heatmap' }, template: "<div\n  class=\"wr-calendar-heatmap__grid\"\n  [style.--wr-heatmap-cell-size.px]=\"cellSize()\"\n  [style.--wr-heatmap-cell-gap.px]=\"cellGap()\"\n  [style.--wr-heatmap-columns]=\"columnCount()\"\n>\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__weekdays\">\n      @for (label of weekdayLabels; track $index) {\n        <span class=\"wr-calendar-heatmap__weekday\">{{ label }}</span>\n      }\n    </div>\n  }\n\n  <div class=\"wr-calendar-heatmap__cells\">\n    @for (cell of cells(); track cell.iso) {\n      <span\n        class=\"wr-calendar-heatmap__cell\"\n        [style.background]=\"colorFor(cell.intensity)\"\n        [style.opacity]=\"opacityFor(cell.intensity)\"\n        [style.grid-column]=\"cell.week + 1\"\n        [style.grid-row]=\"cell.day + 1\"\n        [title]=\"`${cell.iso}: ${cell.value}`\"\n      ></span>\n    }\n  </div>\n\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__months\">\n      @for (m of monthLabels(); track $index) {\n        <span class=\"wr-calendar-heatmap__month\" [style.grid-column]=\"m.week + 1\">{{ m.label }}</span>\n      }\n    </div>\n  }\n</div>\n" }]
         }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], endDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "endDate", required: false }] }], weeks: [{ type: i0.Input, args: [{ isSignal: true, alias: "weeks", required: false }] }], cellSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellSize", required: false }] }], cellGap: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellGap", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], emptyColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyColor", required: false }] }], showLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabels", required: false }] }] } });

package/fesm2022/ngwr-calendar.mjs

@@ -1,6 +1,6 @@
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
-import { input, model, inject, ElementRef, signal, computed, afterNextRender, effect, untracked, ViewEncapsulation, Component } from '@angular/core';
+import { input, model, inject, ElementRef, Injector, signal, computed, afterNextRender, effect, untracked, ViewEncapsulation, Component } from '@angular/core';
 import { WrDateAdapter } from 'ngwr/date-adapter';
 
 /**
@@ -47,10 +47,20 @@ class WrCalendar {
     /** Predicate — return `false` to disable specific dates (e.g. weekends only). */
     dateFilter = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "dateFilter" }] : /* istanbul ignore next */ []));
+    /**
+     * Move real focus onto the roving cell as soon as the grid is on screen.
+     *
+     * Off by default: a standalone `<wr-calendar>` sitting in a page must not
+     * steal focus on load. `wr-date-picker` turns it on for the popup it opens
+     * from its trigger, where the user asked to be taken to the calendar.
+     * @default false
+     */
+    autoFocus = input(false, { ...(ngDevMode ? { debugName: "autoFocus" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
     /** Disable interaction entirely. @default false */
     disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
     adapter = inject(WrDateAdapter);
     host = inject(ElementRef);
+    injector = inject(Injector);
     /** Currently displayed month (any date inside it). */
     viewDate = signal(this.adapter.today(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "viewDate" }] : /* istanbul ignore next */ []));
@@ -121,11 +131,23 @@ class WrCalendar {
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
     constructor() {
-        // Initial focus: selected date if any, else today. Also snap viewDate to that month.
+        // Initial focus: selected date if any, else today. Also snap viewDate to
+        // that month.
+        //
+        // Stepped onto an ENABLED day, because the roving tabindex puts the grid's
+        // only `tabindex="0"` on this cell: seed it on a disabled one — which is
+        // exactly what a `min` in the future does to "today" — and the sole tab
+        // stop is an unfocusable button, leaving the grid unreachable by keyboard.
         afterNextRender(() => {
-            const initial = this.date() ?? this.range()[0] ?? this.adapter.today();
+            const initial = this.nearestEnabled(this.date() ?? this.range()[0] ?? this.adapter.today());
             this.focusedDate.set(initial);
             this.viewDate.set(initial);
+            // A second, NESTED hook: the lines above only SET the signals, which
+            // schedules another change-detection pass — the `--focused` class and the
+            // `tabindex` are not in the DOM until that one has run.
+            if (this.autoFocus()) {
+                afterNextRender(() => this.focusActiveCell(), { injector: this.injector });
+            }
         });
         // Keep viewDate in sync when date / range changes externally to a
         // different month. The viewDate read must stay untracked — otherwise
@@ -328,15 +350,20 @@ class WrCalendar {
             return;
         const current = this.focusedDate();
         let next = null;
+        // Which way the key travels, so a landing on a closed-off day can keep
+        // going instead of stopping on it. See `nearestEnabledToward`.
+        let dir = 1;
         switch (event.key) {
             case 'ArrowLeft':
                 next = this.adapter.addDays(current, -1);
+                dir = -1;
                 break;
             case 'ArrowRight':
                 next = this.adapter.addDays(current, 1);
                 break;
             case 'ArrowUp':
                 next = this.adapter.addDays(current, -7);
+                dir = -1;
                 break;
             case 'ArrowDown':
                 next = this.adapter.addDays(current, 7);
@@ -345,6 +372,7 @@ class WrCalendar {
                 const dow = this.adapter.getDayOfWeek(current);
                 const first = this.adapter.getFirstDayOfWeek();
                 next = this.adapter.addDays(current, -((dow - first + 7) % 7));
+                dir = -1;
                 break;
             }
             case 'End': {
@@ -355,6 +383,7 @@ class WrCalendar {
             }
             case 'PageUp':
                 next = event.shiftKey ? this.adapter.addYears(current, -1) : this.adapter.addMonths(current, -1);
+                dir = -1;
                 break;
             case 'PageDown':
                 next = event.shiftKey ? this.adapter.addYears(current, 1) : this.adapter.addMonths(current, 1);
@@ -368,11 +397,62 @@ class WrCalendar {
         if (!next)
             return;
         event.preventDefault();
+        // The seed is routed through `nearestEnabled` for a reason, and navigation
+        // needs the same care: a cell renders `disabled` AND carries the grid's only
+        // `tabindex="0"`, so parking the ring on a closed-off day leaves zero
+        // tabbable cells — the user tabs out of the calendar and can never tab back
+        // in. Real focus splits from the ring too, because `.focus()` on a disabled
+        // button is a no-op. Reached by nothing more exotic than `[minDate]`.
+        const landing = this.nearestEnabledToward(next, dir);
+        if (!landing)
+            return;
+        next = landing;
         this.focusedDate.set(next);
         if (!this.adapter.isSameMonth(next, this.viewDate())) {
             this.viewDate.set(next);
         }
-        queueMicrotask(() => this.focusActiveCell());
+        // `afterNextRender`, NOT `queueMicrotask`. Under zoneless CD the scheduler
+        // runs change detection in a macrotask, so a microtask fires FIRST — the
+        // `--focused` class is still on the cell we just left, and this focuses
+        // that one. The ring moved and real focus did not, permanently: a screen
+        // reader kept announcing the previous day.
+        afterNextRender(() => this.focusActiveCell(), { injector: this.injector });
+    }
+    /**
+     * The first selectable day at or after `candidate`, else the first before it,
+     * else `candidate` unchanged when everything nearby is closed off. Bounded at
+     * a year each way so a pathological `dateFilter` cannot spin.
+     */
+    nearestEnabled(candidate) {
+        if (!this.isDisabled(candidate))
+            return candidate;
+        for (const step of [1, -1]) {
+            let probe = candidate;
+            for (let i = 0; i < 366; i++) {
+                probe = this.adapter.addDays(probe, step);
+                if (!this.isDisabled(probe))
+                    return probe;
+            }
+        }
+        return candidate;
+    }
+    /**
+     * The first selectable day at `candidate` or beyond it in `step`'s direction,
+     * else null when that whole direction is closed off — which is the answer for
+     * an ArrowLeft that would cross `min`: stay put.
+     *
+     * Direction matters. Reusing `nearestEnabled`, which probes forward first,
+     * would send an ArrowLeft over a disabled weekend straight back to the day it
+     * started from, so the ring could never cross the hole.
+     */
+    nearestEnabledToward(candidate, step) {
+        let probe = candidate;
+        for (let i = 0; i < 366; i++) {
+            if (!this.isDisabled(probe))
+                return probe;
+            probe = this.adapter.addDays(probe, step);
+        }
+        return null;
     }
     focusActiveCell() {
         const el = this.host.nativeElement.querySelector('.wr-calendar__day--focused');
@@ -382,10 +462,10 @@ class WrCalendar {
     trackByTime(_, date) {
         return date.getTime();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrCalendar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: WrCalendar, isStandalone: true, selector: "wr-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", range: "rangeChange" }, host: { listeners: { "keydown": "onKeyDown($event)" }, properties: { "class": "classes()" } }, ngImport: i0, template: "<div class=\"wr-calendar__header\">\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--prev\"\n    [attr.aria-label]=\"\n      viewMode() === 'year' ? 'Previous 12 years' : viewMode() === 'month' ? 'Previous year' : 'Previous month'\n    \"\n    [disabled]=\"disabled()\"\n    (click)=\"prev()\"\n  >\n    <svg\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"m15 18-6-6 6-6\" />\n    </svg>\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__label\"\n    [disabled]=\"disabled() || viewMode() === 'year'\"\n    (click)=\"onLabelClick()\"\n  >\n    {{ headerLabel() }}\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--next\"\n    [attr.aria-label]=\"viewMode() === 'year' ? 'Next 12 years' : viewMode() === 'month' ? 'Next year' : 'Next month'\"\n    [disabled]=\"disabled()\"\n    (click)=\"next()\"\n  >\n    <svg\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"m9 18 6-6-6-6\" />\n    </svg>\n  </button>\n</div>\n\n@switch (viewMode()) {\n  @case ('day') {\n    <!--\n      The weekday strip and the week rows are one grid, so they share a wrapper:\n      `role=\"grid\"` may only own rows, and as siblings the header row had no grid\n      parent at all. `.wr-calendar__body` repeats the host's column gap, so the\n      rendered spacing is unchanged.\n    -->\n    <div class=\"wr-calendar__body\" role=\"grid\">\n      <div class=\"wr-calendar__weekdays\" role=\"row\">\n        @for (name of weekdayNames(); track name) {\n          <span class=\"wr-calendar__weekday\" role=\"columnheader\">{{ name }}</span>\n        }\n      </div>\n\n      <div class=\"wr-calendar__grid\" role=\"rowgroup\" (mouseleave)=\"onCellLeave()\">\n        @for (week of weeks(); track $index) {\n          <div class=\"wr-calendar__week\" role=\"row\">\n            @for (day of week; track trackByTime($index, day)) {\n              <button\n                type=\"button\"\n                class=\"wr-calendar__day\"\n                role=\"gridcell\"\n                [class.wr-calendar__day--today]=\"isToday(day)\"\n                [class.wr-calendar__day--out-of-month]=\"isOutOfMonth(day)\"\n                [class.wr-calendar__day--selected]=\"isSelected(day)\"\n                [class.wr-calendar__day--in-range]=\"isInRange(day)\"\n                [class.wr-calendar__day--range-preview]=\"isInRangePreview(day)\"\n                [class.wr-calendar__day--focused]=\"isFocused(day)\"\n                [disabled]=\"isDisabled(day)\"\n                [attr.tabindex]=\"isFocused(day) ? 0 : -1\"\n                [attr.aria-selected]=\"isSelected(day)\"\n                [attr.aria-disabled]=\"isDisabled(day)\"\n                (click)=\"onCellClick(day)\"\n                (mouseenter)=\"onCellEnter(day)\"\n              >\n                {{ day.getDate() }}\n              </button>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  }\n\n  @case ('month') {\n    <div class=\"wr-calendar__months\" role=\"listbox\">\n      @for (name of monthsView(); track name) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"option\"\n          [class.wr-calendar__chip--current]=\"isMonthCurrent($index)\"\n          [class.wr-calendar__chip--selected]=\"isMonthSelected($index)\"\n          [disabled]=\"isMonthDisabled($index)\"\n          [attr.aria-selected]=\"isMonthSelected($index)\"\n          [attr.aria-disabled]=\"isMonthDisabled($index)\"\n          (click)=\"onMonthSelect($index)\"\n        >\n          {{ name }}\n        </button>\n      }\n    </div>\n  }\n\n  @case ('year') {\n    <div class=\"wr-calendar__years\" role=\"listbox\">\n      @for (year of yearsView(); track year) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"option\"\n          [class.wr-calendar__chip--current]=\"isYearCurrent(year)\"\n          [class.wr-calendar__chip--selected]=\"isYearSelected(year)\"\n          [disabled]=\"isYearDisabled(year)\"\n          [attr.aria-selected]=\"isYearSelected(year)\"\n          [attr.aria-disabled]=\"isYearDisabled(year)\"\n          (click)=\"onYearSelect(year)\"\n        >\n          {{ year }}\n        </button>\n      }\n    </div>\n  }\n}\n", encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrCalendar, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: WrCalendar, isStandalone: true, selector: "wr-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", range: "rangeChange" }, host: { listeners: { "keydown": "onKeyDown($event)" }, properties: { "class": "classes()" } }, ngImport: i0, template: "<div class=\"wr-calendar__header\">\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--prev\"\n    [attr.aria-label]=\"\n      viewMode() === 'year' ? 'Previous 12 years' : viewMode() === 'month' ? 'Previous year' : 'Previous month'\n    \"\n    [disabled]=\"disabled()\"\n    (click)=\"prev()\"\n  >\n    <svg\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"m15 18-6-6 6-6\" />\n    </svg>\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__label\"\n    [disabled]=\"disabled() || viewMode() === 'year'\"\n    (click)=\"onLabelClick()\"\n  >\n    {{ headerLabel() }}\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--next\"\n    [attr.aria-label]=\"viewMode() === 'year' ? 'Next 12 years' : viewMode() === 'month' ? 'Next year' : 'Next month'\"\n    [disabled]=\"disabled()\"\n    (click)=\"next()\"\n  >\n    <svg\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"m9 18 6-6-6-6\" />\n    </svg>\n  </button>\n</div>\n\n@switch (viewMode()) {\n  @case ('day') {\n    <!--\n      The weekday strip and the week rows are one grid, so they share a wrapper:\n      `role=\"grid\"` may only own rows, and as siblings the header row had no grid\n      parent at all. `.wr-calendar__body` repeats the host's column gap, so the\n      rendered spacing is unchanged.\n    -->\n    <div class=\"wr-calendar__body\" role=\"grid\">\n      <div class=\"wr-calendar__weekdays\" role=\"row\">\n        @for (name of weekdayNames(); track name) {\n          <span class=\"wr-calendar__weekday\" role=\"columnheader\">{{ name }}</span>\n        }\n      </div>\n\n      <div class=\"wr-calendar__grid\" role=\"rowgroup\" (mouseleave)=\"onCellLeave()\">\n        @for (week of weeks(); track $index) {\n          <div class=\"wr-calendar__week\" role=\"row\">\n            @for (day of week; track trackByTime($index, day)) {\n              <button\n                type=\"button\"\n                class=\"wr-calendar__day\"\n                role=\"gridcell\"\n                [class.wr-calendar__day--today]=\"isToday(day)\"\n                [class.wr-calendar__day--out-of-month]=\"isOutOfMonth(day)\"\n                [class.wr-calendar__day--selected]=\"isSelected(day)\"\n                [class.wr-calendar__day--in-range]=\"isInRange(day)\"\n                [class.wr-calendar__day--range-preview]=\"isInRangePreview(day)\"\n                [class.wr-calendar__day--focused]=\"isFocused(day)\"\n                [disabled]=\"isDisabled(day)\"\n                [attr.tabindex]=\"isFocused(day) ? 0 : -1\"\n                [attr.aria-selected]=\"isSelected(day)\"\n                [attr.aria-disabled]=\"isDisabled(day)\"\n                (click)=\"onCellClick(day)\"\n                (mouseenter)=\"onCellEnter(day)\"\n              >\n                {{ day.getDate() }}\n              </button>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  }\n\n  @case ('month') {\n    <div class=\"wr-calendar__months\" role=\"listbox\">\n      @for (name of monthsView(); track name) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"option\"\n          [class.wr-calendar__chip--current]=\"isMonthCurrent($index)\"\n          [class.wr-calendar__chip--selected]=\"isMonthSelected($index)\"\n          [disabled]=\"isMonthDisabled($index)\"\n          [attr.aria-selected]=\"isMonthSelected($index)\"\n          [attr.aria-disabled]=\"isMonthDisabled($index)\"\n          (click)=\"onMonthSelect($index)\"\n        >\n          {{ name }}\n        </button>\n      }\n    </div>\n  }\n\n  @case ('year') {\n    <div class=\"wr-calendar__years\" role=\"listbox\">\n      @for (year of yearsView(); track year) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"option\"\n          [class.wr-calendar__chip--current]=\"isYearCurrent(year)\"\n          [class.wr-calendar__chip--selected]=\"isYearSelected(year)\"\n          [disabled]=\"isYearDisabled(year)\"\n          [attr.aria-selected]=\"isYearSelected(year)\"\n          [attr.aria-disabled]=\"isYearDisabled(year)\"\n          (click)=\"onYearSelect(year)\"\n        >\n          {{ year }}\n        </button>\n      }\n    </div>\n  }\n}\n", encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: WrCalendar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrCalendar, decorators: [{
             type: Component,
             args: [{ selector: 'wr-calendar', encapsulation: ViewEncapsulation.None, host: {
                         '[class]': 'classes()',
@@ -394,7 +474,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                         // matrix and nothing else.
                         '(keydown)': 'onKeyDown($event)',
                     }, template: "<div class=\"wr-calendar__header\">\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--prev\"\n    [attr.aria-label]=\"\n      viewMode() === 'year' ? 'Previous 12 years' : viewMode() === 'month' ? 'Previous year' : 'Previous month'\n    \"\n    [disabled]=\"disabled()\"\n    (click)=\"prev()\"\n  >\n    <svg\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"m15 18-6-6 6-6\" />\n    </svg>\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__label\"\n    [disabled]=\"disabled() || viewMode() === 'year'\"\n    (click)=\"onLabelClick()\"\n  >\n    {{ headerLabel() }}\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--next\"\n    [attr.aria-label]=\"viewMode() === 'year' ? 'Next 12 years' : viewMode() === 'month' ? 'Next year' : 'Next month'\"\n    [disabled]=\"disabled()\"\n    (click)=\"next()\"\n  >\n    <svg\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"m9 18 6-6-6-6\" />\n    </svg>\n  </button>\n</div>\n\n@switch (viewMode()) {\n  @case ('day') {\n    <!--\n      The weekday strip and the week rows are one grid, so they share a wrapper:\n      `role=\"grid\"` may only own rows, and as siblings the header row had no grid\n      parent at all. `.wr-calendar__body` repeats the host's column gap, so the\n      rendered spacing is unchanged.\n    -->\n    <div class=\"wr-calendar__body\" role=\"grid\">\n      <div class=\"wr-calendar__weekdays\" role=\"row\">\n        @for (name of weekdayNames(); track name) {\n          <span class=\"wr-calendar__weekday\" role=\"columnheader\">{{ name }}</span>\n        }\n      </div>\n\n      <div class=\"wr-calendar__grid\" role=\"rowgroup\" (mouseleave)=\"onCellLeave()\">\n        @for (week of weeks(); track $index) {\n          <div class=\"wr-calendar__week\" role=\"row\">\n            @for (day of week; track trackByTime($index, day)) {\n              <button\n                type=\"button\"\n                class=\"wr-calendar__day\"\n                role=\"gridcell\"\n                [class.wr-calendar__day--today]=\"isToday(day)\"\n                [class.wr-calendar__day--out-of-month]=\"isOutOfMonth(day)\"\n                [class.wr-calendar__day--selected]=\"isSelected(day)\"\n                [class.wr-calendar__day--in-range]=\"isInRange(day)\"\n                [class.wr-calendar__day--range-preview]=\"isInRangePreview(day)\"\n                [class.wr-calendar__day--focused]=\"isFocused(day)\"\n                [disabled]=\"isDisabled(day)\"\n                [attr.tabindex]=\"isFocused(day) ? 0 : -1\"\n                [attr.aria-selected]=\"isSelected(day)\"\n                [attr.aria-disabled]=\"isDisabled(day)\"\n                (click)=\"onCellClick(day)\"\n                (mouseenter)=\"onCellEnter(day)\"\n              >\n                {{ day.getDate() }}\n              </button>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  }\n\n  @case ('month') {\n    <div class=\"wr-calendar__months\" role=\"listbox\">\n      @for (name of monthsView(); track name) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"option\"\n          [class.wr-calendar__chip--current]=\"isMonthCurrent($index)\"\n          [class.wr-calendar__chip--selected]=\"isMonthSelected($index)\"\n          [disabled]=\"isMonthDisabled($index)\"\n          [attr.aria-selected]=\"isMonthSelected($index)\"\n          [attr.aria-disabled]=\"isMonthDisabled($index)\"\n          (click)=\"onMonthSelect($index)\"\n        >\n          {{ name }}\n        </button>\n      }\n    </div>\n  }\n\n  @case ('year') {\n    <div class=\"wr-calendar__years\" role=\"listbox\">\n      @for (year of yearsView(); track year) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"option\"\n          [class.wr-calendar__chip--current]=\"isYearCurrent(year)\"\n          [class.wr-calendar__chip--selected]=\"isYearSelected(year)\"\n          [disabled]=\"isYearDisabled(year)\"\n          [attr.aria-selected]=\"isYearSelected(year)\"\n          [attr.aria-disabled]=\"isYearDisabled(year)\"\n          (click)=\"onYearSelect(year)\"\n        >\n          {{ year }}\n        </button>\n      }\n    </div>\n  }\n}\n" }]
-        }], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], date: [{ type: i0.Input, args: [{ isSignal: true, alias: "date", required: false }] }, { type: i0.Output, args: ["dateChange"] }], range: [{ type: i0.Input, args: [{ isSignal: true, alias: "range", required: false }] }, { type: i0.Output, args: ["rangeChange"] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], dateFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateFilter", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
+        }], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], date: [{ type: i0.Input, args: [{ isSignal: true, alias: "date", required: false }] }, { type: i0.Output, args: ["dateChange"] }], range: [{ type: i0.Input, args: [{ isSignal: true, alias: "range", required: false }] }, { type: i0.Output, args: ["rangeChange"] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], dateFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateFilter", required: false }] }], autoFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoFocus", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.