ngwr 14.7.0 → 14.9.0

package/fesm2022/ngwr-knob.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-knob.mjs","sources":["../../../projects/lib/knob/knob.ts","../../../projects/lib/knob/knob.html","../../../projects/lib/knob/ngwr-knob.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport {\n  Component,\n  ElementRef,\n  ViewEncapsulation,\n  computed,\n  effect,\n  inject,\n  input,\n  model,\n  output,\n} from '@angular/core';\nimport type { FormValueControl } from '@angular/forms/signals';\n\nimport { useFormFieldAria } from 'ngwr/form';\nimport { useI18nText } from 'ngwr/i18n';\nimport { clamp, round } from 'ngwr/utils';\n\nconst ARC_START = -135; // 7 o'clock\nconst ARC_END = 135; // 5 o'clock — 270° sweep total\nconst ARC_SWEEP = ARC_END - ARC_START;\n\n/**\n * Radial dial input. A signal-forms native control: it implements\n * `FormValueControl<number>`, so `[formField]` binds straight to its `value`\n * model — no `ControlValueAccessor` in between. `[(value)]` works standalone.\n *\n * The value is clamped to `[min, max]`. Drag the indicator around the dial or\n * use ←→ / ↑↓ to step.\n *\n * @example\n * ```html\n * <!-- signal forms -->\n * <wr-knob [formField]=\"form.volume\" [min]=\"0\" [max]=\"100\" />\n *\n * <!-- standalone two-way binding -->\n * <wr-knob [(value)]=\"vol\" suffix=\"%\" valueColor=\"var(--wr-color-success)\" />\n * ```\n *\n * @see https://ngwr.dev/reference/components/knob\n */\n@Component({\n  selector: 'wr-knob',\n  templateUrl: './knob.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { '[class]': 'classes()' },\n})\nexport class WrKnob implements FormValueControl<number> {\n  /** Accessible name — the role needs one. Falls back to `knob.label`. */\n  readonly ariaLabel = input<string | null>(null);\n\n  protected readonly resolvedAriaLabel = useI18nText(this.ariaLabel, 'knob.label', 'Value');\n\n  /** Minimum allowed value. @default 0 */\n  readonly min = input<number | undefined>(0, { transform: (v: unknown): number => coerceNumberProperty(v, 0) });\n\n  /** Maximum allowed value. @default 100 */\n  readonly max = input<number | undefined>(100, { transform: (v: unknown): number => coerceNumberProperty(v, 100) });\n\n  private readonly minValue = computed(() => this.min() ?? 0);\n  private readonly maxValue = computed(() => this.max() ?? 100);\n\n  /** Step granularity. @default 1 */\n  readonly step = input(1, { transform: (v: unknown): number => Math.max(0.0001, coerceNumberProperty(v, 1)) });\n\n  /** Dial diameter in CSS pixels. @default 120 */\n  readonly size = input(120, { transform: (v: unknown): number => Math.max(32, coerceNumberProperty(v, 120)) });\n\n  /** Stroke width of the dial arc, in CSS pixels. @default 8 */\n  readonly strokeWidth = input(8, {\n    transform: (v: unknown): number => Math.max(1, coerceNumberProperty(v, 8)),\n  });\n\n  /** Track (unfilled) color. @default rgba(--wr-color-light, 0.6) */\n  readonly trackColor = input<string>('rgba(var(--wr-color-light-rgb), 0.6)');\n\n  /** Filled-arc color. @default var(--wr-color-primary) */\n  readonly valueColor = input<string>('var(--wr-color-primary)');\n\n  /** Show the value text in the center. @default true */\n  readonly showValue = input(true, { transform: coerceBooleanProperty });\n\n  /** Optional suffix appended to the center text (e.g. `'%'`). */\n  readonly suffix = input<string>('');\n\n  /** Read-only — disables interaction but keeps the visual. @default false */\n  readonly readonly = input(false, { transform: coerceBooleanProperty });\n\n  /** Disable interaction. @default false */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** Bound by `[formField]`, or two-way via `[(value)]`. */\n  readonly value = model<number>(0);\n\n  /** Emitted on blur so a bound field can mark itself touched. */\n  readonly touch = output<void>();\n\n  private dragging = false;\n\n  protected readonly interactive = computed(() => !this.disabled() && !this.readonly());\n\n  /**\n   * Whether the control keeps its tab stop — `disabled` only, never `readonly`.\n   *\n   * The two states differ precisely here: a disabled control leaves the tab\n   * order, a read-only one stays in it and keeps announcing `aria-valuenow`,\n   * because a keyboard user still has to be able to READ a value they cannot\n   * change. Driving `tabindex` off `interactive()` collapsed that distinction\n   * and made `readonly()` unreachable — with an `aria-describedby` pointing at\n   * an error message on an element nobody could focus.\n   */\n  protected readonly focusable = computed(() => !this.disabled());\n\n  /** The surrounding `<wr-form-field>`'s error state. @internal */\n  protected readonly fieldAria = useFormFieldAria();\n\n  /**\n   * The field's label wins over the built-in default, and an explicit\n   * `ariaLabel` wins over both.\n   *\n   * `<wr-form-field label=\"…\">` renders a `<label for>` that cannot reach this\n   * control — `for` binds only to a LABELABLE element and the focusable part\n   * here carries a role instead — so the field's label named nothing and this\n   * announced its own generic default. A consumer who wrote\n   * `<wr-form-field label=\"Overall satisfaction\">` heard \"Value\".\n   */\n  protected readonly labelledBy = computed(() => (this.ariaLabel() ? null : this.fieldAria.labelledBy()));\n\n  /** `null` once `aria-labelledby` is carrying the name, or the two are announced together. */\n  protected readonly nameLabel = computed(() => (this.labelledBy() ? null : this.resolvedAriaLabel()));\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-knob'];\n    if (this.disabled()) parts.push('wr-knob--disabled');\n    if (this.readonly()) parts.push('wr-knob--readonly');\n    return parts.join(' ');\n  });\n\n  // Geometry — drawn into a 100×100 viewBox, scaled by `size`.\n  protected readonly cx = 50;\n  protected readonly cy = 50;\n  // A negative radius is invalid in the SVG path grammar, so the browser drops\n  // the arc and the dial vanishes — which a fat stroke reaches at 99.\n  protected readonly radius = computed(() => Math.max(1, 50 - this.strokeWidth() / 2 - 0.5));\n\n  /** Ratio of the filled arc — `0` at min, `1` at max. */\n  protected readonly ratio = computed(() => {\n    const range = this.maxValue() - this.minValue();\n    if (range <= 0) return 0;\n    return clamp((this.value() - this.minValue()) / range, 0, 1);\n  });\n\n  /** SVG path `d` for the background arc. */\n  protected readonly trackPath = computed(() => this.arcPath(ARC_START, ARC_END));\n\n  /** SVG path `d` for the filled arc. */\n  protected readonly valuePath = computed(() => {\n    const end = ARC_START + ARC_SWEEP * this.ratio();\n    return this.arcPath(ARC_START, end);\n  });\n\n  /** Position of the handle dot — `{ x, y }` in viewBox units. */\n  protected readonly handlePos = computed(() => {\n    const angle = ARC_START + ARC_SWEEP * this.ratio();\n    const rad = (angle * Math.PI) / 180;\n    return {\n      x: this.cx + this.radius() * Math.sin(rad),\n      y: this.cy - this.radius() * Math.cos(rad),\n    };\n  });\n\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\n\n  constructor() {\n    // Keep the value within `[min, max]` even when written externally (via\n    // `[formField]` / `[(value)]`). Interactive changes are already clamped in\n    // `commit`, so this only normalizes out-of-range external writes.\n    effect(() => {\n      const clamped = clamp(this.value(), this.minValue(), this.maxValue());\n      if (clamped !== this.value()) this.value.set(clamped);\n    });\n  }\n\n  // Pointer / keyboard\n\n  protected onPointerDown(event: PointerEvent): void {\n    if (!this.interactive()) return;\n    // Any pointerdown used to start a drag, so the right button turned the dial;\n    // the same guard keeps a second finger out of a drag already in progress.\n    if (event.button !== 0 || !event.isPrimary) return;\n    event.preventDefault();\n    this.dragging = true;\n    const surface = event.currentTarget as HTMLElement;\n    surface.setPointerCapture(event.pointerId);\n    // `preventDefault` above also suppresses the click's default focus, so the\n    // arrows did nothing after a mouse drag until the dial was found again with\n    // Tab. `wr-slider` focuses its thumb for the same reason.\n    surface.focus();\n    this.updateFromPointer(event);\n  }\n\n  protected onPointerMove(event: PointerEvent): void {\n    if (!this.dragging) return;\n    this.updateFromPointer(event);\n  }\n\n  protected onPointerUp(event: PointerEvent): void {\n    if (!this.dragging) return;\n    this.dragging = false;\n    (event.currentTarget as HTMLElement).releasePointerCapture(event.pointerId);\n    this.touch.emit();\n  }\n\n  /**\n   * A bound field learns it may show its validation copy from `touch`, and\n   * pointer-up cannot be the only source: a knob reached by Tab and moved with\n   * the arrows would leave the field untouched forever. `wr-rating`, whose\n   * template this one otherwise mirrors, emits on blur for exactly this reason.\n   */\n  protected onBlur(): void {\n    this.touch.emit();\n  }\n\n  /**\n   * The APG slider keys, and they do NOT mirror under `dir=\"rtl\"` — which is a\n   * decision, not an oversight, and the one place it is written down.\n   *\n   * `wr-slider` swaps ArrowLeft and ArrowRight in RTL because its TRACK mirrors:\n   * the thumb is placed with `inset-inline-start`, so the visual maximum moves to\n   * the left and a key naming a side has to move with it. This dial does not\n   * mirror. It is an SVG gauge drawn in a fixed 100×100 viewBox, and SVG content\n   * is not reordered by the reading direction — the arc sweeps clockwise from 7\n   * o'clock to 5 o'clock in every locale, the same way a clock face or a car's\n   * rev counter does. So ArrowRight still moves the handle toward the visually\n   * right-hand side of the arc in RTL, and swapping the keys would be the thing\n   * that broke the mapping.\n   *\n   * That is why nothing here injects `Directionality`, and why the stylesheet\n   * carries no `rtl-ok:` marker: there is no physical CSS in the value path at\n   * all, only fixed SVG geometry.\n   */\n  protected onKeydown(event: KeyboardEvent): void {\n    if (!this.interactive()) return;\n    const step = event.shiftKey ? this.step() * 10 : this.step();\n    let next: number | null;\n    switch (event.key) {\n      case 'ArrowRight':\n      case 'ArrowUp':\n        next = this.value() + step;\n        break;\n      case 'ArrowLeft':\n      case 'ArrowDown':\n        next = this.value() - step;\n        break;\n      case 'Home':\n        next = this.minValue();\n        break;\n      case 'End':\n        next = this.maxValue();\n        break;\n      default:\n        return;\n    }\n    event.preventDefault();\n    this.commit(this.snap(next));\n  }\n\n  /**\n   * Nearest step, measured FROM `min`. A grid anchored at zero offers values the\n   * arrows can never reach whenever `min` is not a multiple of `step` — with\n   * `min: 5, step: 10` the middle of the arc used to commit 60, off a grid whose\n   * points are 5, 15, … 55, 65. Rounded at six decimals because a tenth is not a\n   * binary fraction: three arrow presses at `step: 0.1` otherwise announce\n   * `aria-valuenow=\"0.30000000000000004\"` and print it in the dial. Same shape as\n   * `wr-slider`'s `snap`, deliberately — including Home / End, so a range that is\n   * not a whole number of steps stops at the last reachable value.\n   */\n  private snap(value: number): number {\n    const min = this.minValue();\n    const stepped = Math.round((value - min) / this.step()) * this.step() + min;\n    return clamp(round(stepped, 6), min, this.maxValue());\n  }\n\n  // Internals\n\n  private updateFromPointer(event: PointerEvent): void {\n    const rect = this.host.nativeElement.getBoundingClientRect();\n    const dx = event.clientX - (rect.left + rect.width / 2);\n    const dy = event.clientY - (rect.top + rect.height / 2);\n    // Angle measured from 12 o'clock, clockwise.\n    let angle = (Math.atan2(dx, -dy) * 180) / Math.PI;\n    // Map [-180, 180] into the dial's arc range, clamping outside it.\n    if (angle < ARC_START) angle = angle + 360 > ARC_END ? ARC_START : angle + 360;\n    angle = clamp(angle, ARC_START, ARC_END);\n    const ratio = (angle - ARC_START) / ARC_SWEEP;\n    const range = this.maxValue() - this.minValue();\n    const raw = this.minValue() + ratio * range;\n    this.commit(this.snap(raw));\n  }\n\n  private commit(next: number): void {\n    if (next === this.value()) return;\n    this.value.set(next);\n  }\n\n  // Arc helper\n\n  private arcPath(startDeg: number, endDeg: number): string {\n    const r = this.radius();\n    const s = (startDeg * Math.PI) / 180;\n    const e = (endDeg * Math.PI) / 180;\n    const sx = this.cx + r * Math.sin(s);\n    const sy = this.cy - r * Math.cos(s);\n    const ex = this.cx + r * Math.sin(e);\n    const ey = this.cy - r * Math.cos(e);\n    const largeArc = endDeg - startDeg > 180 ? 1 : 0;\n    return `M ${sx} ${sy} A ${r} ${r} 0 ${largeArc} 1 ${ex} ${ey}`;\n  }\n}\n","<div\n  class=\"wr-knob__surface\"\n  role=\"slider\"\n  [attr.aria-label]=\"nameLabel()\"\n  [attr.aria-labelledby]=\"labelledBy()\"\n  [attr.aria-valuemin]=\"min()\"\n  [attr.aria-valuemax]=\"max()\"\n  [attr.aria-valuenow]=\"value()\"\n  [attr.aria-readonly]=\"readonly() || null\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n  [attr.aria-describedby]=\"fieldAria.describedBy()\"\n  [attr.tabindex]=\"focusable() ? 0 : -1\"\n  [style.width.px]=\"size()\"\n  [style.height.px]=\"size()\"\n  (pointerdown)=\"onPointerDown($event)\"\n  (pointermove)=\"onPointerMove($event)\"\n  (pointerup)=\"onPointerUp($event)\"\n  (pointercancel)=\"onPointerUp($event)\"\n  (keydown)=\"onKeydown($event)\"\n  (blur)=\"onBlur()\"\n>\n  <svg viewBox=\"0 0 100 100\" aria-hidden=\"true\">\n    <path\n      class=\"wr-knob__track\"\n      [attr.d]=\"trackPath()\"\n      [attr.stroke]=\"trackColor()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      fill=\"none\"\n      stroke-linecap=\"round\"\n    />\n    <path\n      class=\"wr-knob__value\"\n      [attr.d]=\"valuePath()\"\n      [attr.stroke]=\"valueColor()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      fill=\"none\"\n      stroke-linecap=\"round\"\n    />\n    <circle\n      class=\"wr-knob__handle\"\n      [attr.cx]=\"handlePos().x\"\n      [attr.cy]=\"handlePos().y\"\n      [attr.r]=\"strokeWidth() / 2\"\n      [attr.fill]=\"valueColor()\"\n    />\n  </svg>\n  @if (showValue()) {\n    <!--\n      `dir=\"auto\"` because this is a number and a unit read as one phrase, and\n      the browser is the only thing that knows which way that phrase runs. In an\n      RTL paragraph the Unicode BiDi algorithm treats a digit run as neutral\n      against the letters beside it, so `40 dB` was drawn `dB 40` — and `-5 dB`\n      as `dB 5-`, with the sign on the wrong end of the number. `dir=\"auto\"`\n      picks the direction from the first strong character in the composed text,\n      so a Latin `suffix` keeps the number first and an Arabic one reads\n      right-to-left, which is correct for both.\n\n      `unicode-bidi: isolate` does NOT fix this and was measured doing nothing:\n      isolation seals the element off from its SURROUNDINGS, and the flip\n      happens inside it.\n    -->\n    <div class=\"wr-knob__text\" dir=\"auto\">\n      {{ value() }}<span class=\"wr-knob__suffix\">{{ suffix() }}</span>\n    </div>\n  }\n</div>\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-knob.mjs","sources":["../../../projects/lib/knob/knob.ts","../../../projects/lib/knob/knob.html","../../../projects/lib/knob/ngwr-knob.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport {\n  Component,\n  ElementRef,\n  ViewEncapsulation,\n  computed,\n  effect,\n  inject,\n  input,\n  model,\n  output,\n} from '@angular/core';\nimport type { FormValueControl } from '@angular/forms/signals';\n\nimport { useFormFieldAria } from 'ngwr/form';\nimport { useI18nText } from 'ngwr/i18n';\nimport { clamp, round } from 'ngwr/utils';\n\nconst ARC_START = -135; // 7 o'clock\nconst ARC_END = 135; // 5 o'clock — 270° sweep total\nconst ARC_SWEEP = ARC_END - ARC_START;\n\n/**\n * Radial dial input. A signal-forms native control: it implements\n * `FormValueControl<number>`, so `[formField]` binds straight to its `value`\n * model — no `ControlValueAccessor` in between. `[(value)]` works standalone.\n *\n * The value is clamped to `[min, max]`. Drag the indicator around the dial or\n * use ←→ / ↑↓ to step.\n *\n * @example\n * ```html\n * <!-- signal forms -->\n * <wr-knob [formField]=\"form.volume\" [min]=\"0\" [max]=\"100\" />\n *\n * <!-- standalone two-way binding -->\n * <wr-knob [(value)]=\"vol\" suffix=\"%\" valueColor=\"var(--wr-color-success)\" />\n * ```\n *\n * @see https://ngwr.dev/reference/components/knob\n */\n@Component({\n  selector: 'wr-knob',\n  templateUrl: './knob.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { '[class]': 'classes()' },\n})\nexport class WrKnob implements FormValueControl<number> {\n  /** Accessible name — the role needs one. Falls back to `knob.label`. */\n  readonly ariaLabel = input<string | null>(null);\n\n  protected readonly resolvedAriaLabel = useI18nText(this.ariaLabel, 'knob.label', 'Value');\n\n  /** Minimum allowed value. @default 0 */\n  readonly min = input<number | undefined>(0, { transform: (v: unknown): number => coerceNumberProperty(v, 0) });\n\n  /** Maximum allowed value. @default 100 */\n  readonly max = input<number | undefined>(100, { transform: (v: unknown): number => coerceNumberProperty(v, 100) });\n\n  private readonly minValue = computed(() => this.min() ?? 0);\n  private readonly maxValue = computed(() => this.max() ?? 100);\n\n  /** Step granularity. @default 1 */\n  readonly step = input(1, { transform: (v: unknown): number => Math.max(0.0001, coerceNumberProperty(v, 1)) });\n\n  /** Dial diameter in CSS pixels. @default 120 */\n  readonly size = input(120, { transform: (v: unknown): number => Math.max(32, coerceNumberProperty(v, 120)) });\n\n  /** Stroke width of the dial arc, in CSS pixels. @default 8 */\n  readonly strokeWidth = input(8, {\n    transform: (v: unknown): number => Math.max(1, coerceNumberProperty(v, 8)),\n  });\n\n  /** Track (unfilled) color. @default rgba(--wr-color-light, 0.6) */\n  readonly trackColor = input<string>('rgba(var(--wr-color-light-rgb), 0.6)');\n\n  /** Filled-arc color. @default var(--wr-color-primary) */\n  readonly valueColor = input<string>('var(--wr-color-primary)');\n\n  /** Show the value text in the center. @default true */\n  readonly showValue = input(true, { transform: coerceBooleanProperty });\n\n  /** Optional suffix appended to the center text (e.g. `'%'`). */\n  readonly suffix = input<string>('');\n\n  /** Read-only — disables interaction but keeps the visual. @default false */\n  readonly readonly = input(false, { transform: coerceBooleanProperty });\n\n  /** Disable interaction. @default false */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** Bound by `[formField]`, or two-way via `[(value)]`. */\n  readonly value = model<number>(0);\n\n  /** Emitted on blur so a bound field can mark itself touched. */\n  readonly touch = output<void>();\n\n  private dragging = false;\n\n  protected readonly interactive = computed(() => !this.disabled() && !this.readonly());\n\n  /**\n   * Whether the control keeps its tab stop — `disabled` only, never `readonly`.\n   *\n   * The two states differ precisely here: a disabled control leaves the tab\n   * order, a read-only one stays in it and keeps announcing `aria-valuenow`,\n   * because a keyboard user still has to be able to READ a value they cannot\n   * change. Driving `tabindex` off `interactive()` collapsed that distinction\n   * and made `readonly()` unreachable — with an `aria-describedby` pointing at\n   * an error message on an element nobody could focus.\n   */\n  protected readonly focusable = computed(() => !this.disabled());\n\n  /** The surrounding `<wr-form-field>`'s error state. @internal */\n  protected readonly fieldAria = useFormFieldAria();\n\n  /**\n   * The field's label wins over the built-in default, and an explicit\n   * `ariaLabel` wins over both.\n   *\n   * `<wr-form-field label=\"…\">` renders a `<label for>` that cannot reach this\n   * control — `for` binds only to a LABELABLE element and the focusable part\n   * here carries a role instead — so the field's label named nothing and this\n   * announced its own generic default. A consumer who wrote\n   * `<wr-form-field label=\"Overall satisfaction\">` heard \"Value\".\n   */\n  protected readonly labelledBy = computed(() => (this.ariaLabel() ? null : this.fieldAria.labelledBy()));\n\n  /** `null` once `aria-labelledby` is carrying the name, or the two are announced together. */\n  protected readonly nameLabel = computed(() => (this.labelledBy() ? null : this.resolvedAriaLabel()));\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-knob'];\n    if (this.disabled()) parts.push('wr-knob--disabled');\n    if (this.readonly()) parts.push('wr-knob--readonly');\n    return parts.join(' ');\n  });\n\n  // Geometry — drawn into a 100×100 viewBox, scaled by `size`.\n  protected readonly cx = 50;\n  protected readonly cy = 50;\n  // A negative radius is invalid in the SVG path grammar, so the browser drops\n  // the arc and the dial vanishes — which a fat stroke reaches at 99.\n  protected readonly radius = computed(() => Math.max(1, 50 - this.strokeWidth() / 2 - 0.5));\n\n  /** Ratio of the filled arc — `0` at min, `1` at max. */\n  protected readonly ratio = computed(() => {\n    const range = this.maxValue() - this.minValue();\n    if (range <= 0) return 0;\n    return clamp((this.value() - this.minValue()) / range, 0, 1);\n  });\n\n  /** SVG path `d` for the background arc. */\n  protected readonly trackPath = computed(() => this.arcPath(ARC_START, ARC_END));\n\n  /** SVG path `d` for the filled arc. */\n  protected readonly valuePath = computed(() => {\n    const end = ARC_START + ARC_SWEEP * this.ratio();\n    return this.arcPath(ARC_START, end);\n  });\n\n  /** Position of the handle dot — `{ x, y }` in viewBox units. */\n  protected readonly handlePos = computed(() => {\n    const angle = ARC_START + ARC_SWEEP * this.ratio();\n    const rad = (angle * Math.PI) / 180;\n    return {\n      x: this.cx + this.radius() * Math.sin(rad),\n      y: this.cy - this.radius() * Math.cos(rad),\n    };\n  });\n\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\n\n  constructor() {\n    // Keep the value within `[min, max]` even when written externally (via\n    // `[formField]` / `[(value)]`). Interactive changes are already clamped in\n    // `commit`, so this only normalizes out-of-range external writes.\n    effect(() => {\n      const clamped = clamp(this.value(), this.minValue(), this.maxValue());\n      if (clamped !== this.value()) this.value.set(clamped);\n    });\n  }\n\n  // Pointer / keyboard\n\n  protected onPointerDown(event: PointerEvent): void {\n    if (!this.interactive()) return;\n    // Any pointerdown used to start a drag, so the right button turned the dial;\n    // the same guard keeps a second finger out of a drag already in progress.\n    if (event.button !== 0 || !event.isPrimary) return;\n    event.preventDefault();\n    this.dragging = true;\n    const surface = event.currentTarget as HTMLElement;\n    surface.setPointerCapture(event.pointerId);\n    // `preventDefault` above also suppresses the click's default focus, so the\n    // arrows did nothing after a mouse drag until the dial was found again with\n    // Tab. `wr-slider` focuses its thumb for the same reason.\n    surface.focus();\n    this.updateFromPointer(event);\n  }\n\n  protected onPointerMove(event: PointerEvent): void {\n    if (!this.dragging) return;\n    this.updateFromPointer(event);\n  }\n\n  protected onPointerUp(event: PointerEvent): void {\n    if (!this.dragging) return;\n    this.dragging = false;\n    (event.currentTarget as HTMLElement).releasePointerCapture(event.pointerId);\n    this.touch.emit();\n  }\n\n  /**\n   * A bound field learns it may show its validation copy from `touch`, and\n   * pointer-up cannot be the only source: a knob reached by Tab and moved with\n   * the arrows would leave the field untouched forever. `wr-rating`, whose\n   * template this one otherwise mirrors, emits on blur for exactly this reason.\n   */\n  protected onBlur(): void {\n    this.touch.emit();\n  }\n\n  /**\n   * The APG slider keys, and they do NOT mirror under `dir=\"rtl\"` — which is a\n   * decision, not an oversight, and the one place it is written down.\n   *\n   * `wr-slider` swaps ArrowLeft and ArrowRight in RTL because its TRACK mirrors:\n   * the thumb is placed with `inset-inline-start`, so the visual maximum moves to\n   * the left and a key naming a side has to move with it. This dial does not\n   * mirror. It is an SVG gauge drawn in a fixed 100×100 viewBox, and SVG content\n   * is not reordered by the reading direction — the arc sweeps clockwise from 7\n   * o'clock to 5 o'clock in every locale, the same way a clock face or a car's\n   * rev counter does. So ArrowRight still moves the handle toward the visually\n   * right-hand side of the arc in RTL, and swapping the keys would be the thing\n   * that broke the mapping.\n   *\n   * That is why nothing here injects `Directionality`, and why the stylesheet\n   * carries no `rtl-ok:` marker: there is no physical CSS in the value path at\n   * all, only fixed SVG geometry.\n   */\n  protected onKeydown(event: KeyboardEvent): void {\n    if (!this.interactive()) return;\n    const step = event.shiftKey ? this.step() * 10 : this.step();\n    let next: number | null;\n    switch (event.key) {\n      case 'ArrowRight':\n      case 'ArrowUp':\n        next = this.value() + step;\n        break;\n      case 'ArrowLeft':\n      case 'ArrowDown':\n        next = this.value() - step;\n        break;\n      case 'Home':\n        next = this.minValue();\n        break;\n      case 'End':\n        next = this.maxValue();\n        break;\n      default:\n        return;\n    }\n    event.preventDefault();\n    this.commit(this.snap(next));\n  }\n\n  /**\n   * Nearest step, measured FROM `min`. A grid anchored at zero offers values the\n   * arrows can never reach whenever `min` is not a multiple of `step` — with\n   * `min: 5, step: 10` the middle of the arc used to commit 60, off a grid whose\n   * points are 5, 15, … 55, 65. Rounded at six decimals because a tenth is not a\n   * binary fraction: three arrow presses at `step: 0.1` otherwise announce\n   * `aria-valuenow=\"0.30000000000000004\"` and print it in the dial. Same shape as\n   * `wr-slider`'s `snap`, deliberately — including Home / End, so a range that is\n   * not a whole number of steps stops at the last reachable value.\n   */\n  private snap(value: number): number {\n    const min = this.minValue();\n    const stepped = Math.round((value - min) / this.step()) * this.step() + min;\n    return clamp(round(stepped, 6), min, this.maxValue());\n  }\n\n  // Internals\n\n  private updateFromPointer(event: PointerEvent): void {\n    const rect = this.host.nativeElement.getBoundingClientRect();\n    const dx = event.clientX - (rect.left + rect.width / 2);\n    const dy = event.clientY - (rect.top + rect.height / 2);\n    // Angle measured from 12 o'clock, clockwise.\n    let angle = (Math.atan2(dx, -dy) * 180) / Math.PI;\n    // Map [-180, 180] into the dial's arc range, clamping outside it.\n    if (angle < ARC_START) angle = angle + 360 > ARC_END ? ARC_START : angle + 360;\n    angle = clamp(angle, ARC_START, ARC_END);\n    const ratio = (angle - ARC_START) / ARC_SWEEP;\n    const range = this.maxValue() - this.minValue();\n    const raw = this.minValue() + ratio * range;\n    this.commit(this.snap(raw));\n  }\n\n  private commit(next: number): void {\n    if (next === this.value()) return;\n    this.value.set(next);\n  }\n\n  // Arc helper\n\n  private arcPath(startDeg: number, endDeg: number): string {\n    const r = this.radius();\n    const s = (startDeg * Math.PI) / 180;\n    const e = (endDeg * Math.PI) / 180;\n    const sx = this.cx + r * Math.sin(s);\n    const sy = this.cy - r * Math.cos(s);\n    const ex = this.cx + r * Math.sin(e);\n    const ey = this.cy - r * Math.cos(e);\n    const largeArc = endDeg - startDeg > 180 ? 1 : 0;\n    return `M ${sx} ${sy} A ${r} ${r} 0 ${largeArc} 1 ${ex} ${ey}`;\n  }\n}\n","<div\n  class=\"wr-knob__surface\"\n  role=\"slider\"\n  [attr.aria-label]=\"nameLabel()\"\n  [attr.aria-labelledby]=\"labelledBy()\"\n  [attr.aria-valuemin]=\"min()\"\n  [attr.aria-valuemax]=\"max()\"\n  [attr.aria-valuenow]=\"value()\"\n  [attr.aria-readonly]=\"readonly() || null\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n  [attr.aria-describedby]=\"fieldAria.describedBy()\"\n  [attr.tabindex]=\"focusable() ? 0 : -1\"\n  [style.width.px]=\"size()\"\n  [style.height.px]=\"size()\"\n  (pointerdown)=\"onPointerDown($event)\"\n  (pointermove)=\"onPointerMove($event)\"\n  (pointerup)=\"onPointerUp($event)\"\n  (pointercancel)=\"onPointerUp($event)\"\n  (keydown)=\"onKeydown($event)\"\n  (blur)=\"onBlur()\"\n>\n  <svg viewBox=\"0 0 100 100\" aria-hidden=\"true\">\n    <path\n      class=\"wr-knob__track\"\n      [attr.d]=\"trackPath()\"\n      [attr.stroke]=\"trackColor()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      fill=\"none\"\n      stroke-linecap=\"round\"\n    />\n    <path\n      class=\"wr-knob__value\"\n      [attr.d]=\"valuePath()\"\n      [attr.stroke]=\"valueColor()\"\n      [attr.stroke-width]=\"strokeWidth()\"\n      fill=\"none\"\n      stroke-linecap=\"round\"\n    />\n    <circle\n      class=\"wr-knob__handle\"\n      [attr.cx]=\"handlePos().x\"\n      [attr.cy]=\"handlePos().y\"\n      [attr.r]=\"strokeWidth() / 2\"\n      [attr.fill]=\"valueColor()\"\n    />\n  </svg>\n  @if (showValue()) {\n    <!--\n      `dir=\"auto\"` because this is a number and a unit read as one phrase, and\n      the browser is the only thing that knows which way that phrase runs. In an\n      RTL paragraph the Unicode BiDi algorithm treats a digit run as neutral\n      against the letters beside it, so `40 dB` was drawn `dB 40` — and `-5 dB`\n      as `dB 5-`, with the sign on the wrong end of the number. `dir=\"auto\"`\n      picks the direction from the first strong character in the composed text,\n      so a Latin `suffix` keeps the number first and an Arabic one reads\n      right-to-left, which is correct for both.\n\n      `unicode-bidi: isolate` does NOT fix this and was measured doing nothing:\n      isolation seals the element off from its SURROUNDINGS, and the flip\n      happens inside it.\n    -->\n    <div class=\"wr-knob__text\" dir=\"auto\">\n      {{ value() }}<span class=\"wr-knob__suffix\">{{ suffix() }}</span>\n    </div>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngwr-layout.mjs

@@ -67,10 +67,10 @@ class WrLayoutSider {
         // write produce exactly one event each rather than two and none.
         this.collapsed.set(!this.collapsed());
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayoutSider, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: WrLayoutSider, isStandalone: true, selector: "wr-layout-sider", inputs: { collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, collapsedWidth: { classPropertyName: "collapsedWidth", publicName: "collapsedWidth", isSignal: true, isRequired: false, transformFunction: null }, reverse: { classPropertyName: "reverse", publicName: "reverse", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange", collapsedChanged: "collapsedChanged" }, host: { attributes: { "role": "complementary" }, properties: { "class": "classes()", "style.width": "collapsed() ? collapsedWidth() : width()" } }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayoutSider, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: WrLayoutSider, isStandalone: true, selector: "wr-layout-sider", inputs: { collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, collapsedWidth: { classPropertyName: "collapsedWidth", publicName: "collapsedWidth", isSignal: true, isRequired: false, transformFunction: null }, reverse: { classPropertyName: "reverse", publicName: "reverse", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange", collapsedChanged: "collapsedChanged" }, host: { attributes: { "role": "complementary" }, properties: { "class": "classes()", "style.width": "collapsed() ? collapsedWidth() : width()" } }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayoutSider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayoutSider, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-layout-sider',
@@ -120,10 +120,10 @@ class WrLayout {
         return parts.join(' ');
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayout, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.6", type: WrLayout, isStandalone: true, selector: "wr-layout", host: { properties: { "class": "classes()" } }, queries: [{ propertyName: "siders", predicate: WrLayoutSider, isSignal: true }], ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayout, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.7", type: WrLayout, isStandalone: true, selector: "wr-layout", host: { properties: { "class": "classes()" } }, queries: [{ propertyName: "siders", predicate: WrLayoutSider, isSignal: true }], ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayout, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayout, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-layout',
@@ -144,10 +144,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
  * size and stickiness are app-controlled via CSS.
  */
 class WrLayoutHeader {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayoutHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.6", type: WrLayoutHeader, isStandalone: true, selector: "wr-layout-header", host: { attributes: { "role": "banner" }, classAttribute: "wr-layout-header" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayoutHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: WrLayoutHeader, isStandalone: true, selector: "wr-layout-header", host: { attributes: { "role": "banner" }, classAttribute: "wr-layout-header" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayoutHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayoutHeader, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-layout-header',
@@ -168,10 +168,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
  * remaining space.
  */
 class WrLayoutContent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayoutContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.6", type: WrLayoutContent, isStandalone: true, selector: "wr-layout-content", host: { attributes: { "role": "main" }, classAttribute: "wr-layout-content" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayoutContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: WrLayoutContent, isStandalone: true, selector: "wr-layout-content", host: { attributes: { "role": "main" }, classAttribute: "wr-layout-content" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayoutContent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayoutContent, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-layout-content',
@@ -192,10 +192,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
  * children.
  */
 class WrLayoutFooter {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayoutFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.6", type: WrLayoutFooter, isStandalone: true, selector: "wr-layout-footer", host: { attributes: { "role": "contentinfo" }, classAttribute: "wr-layout-footer" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayoutFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: WrLayoutFooter, isStandalone: true, selector: "wr-layout-footer", host: { attributes: { "role": "contentinfo" }, classAttribute: "wr-layout-footer" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLayoutFooter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLayoutFooter, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-layout-footer',

package/fesm2022/ngwr-layout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-layout.mjs","sources":["../../../projects/lib/layout/layout-sider.ts","../../../projects/lib/layout/layout.ts","../../../projects/lib/layout/layout-header.ts","../../../projects/lib/layout/layout-content.ts","../../../projects/lib/layout/layout-footer.ts","../../../projects/lib/layout/ngwr-layout.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, effect, input, model, output, untracked } from '@angular/core';\n\n/**\n * Collapsible side panel. Lives inside a row `<wr-layout>` next to a\n * `<wr-layout-content>`. Two-way `[(collapsed)]` controls width.\n *\n * @example\n * ```html\n * <wr-layout>\n *   <wr-layout-sider [(collapsed)]=\"collapsed\" width=\"14rem\" collapsedWidth=\"3rem\">\n *     …\n *   </wr-layout-sider>\n *   <wr-layout-content>Main</wr-layout-content>\n * </wr-layout>\n * ```\n */\n@Component({\n  selector: 'wr-layout-sider',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'classes()',\n    '[style.width]': 'collapsed() ? collapsedWidth() : width()',\n    role: 'complementary',\n  },\n})\nexport class WrLayoutSider {\n  /** Two-way bindable collapsed state. @default false */\n  readonly collapsed = model(false);\n\n  /** Width when expanded. Any CSS length. @default '16rem' */\n  readonly width = input<string>('16rem');\n\n  /** Width when collapsed. Any CSS length. `0` to fully hide. @default '4rem' */\n  readonly collapsedWidth = input<string>('4rem');\n\n  /** Place the sider on the right edge instead of the left. @default false */\n  readonly reverse = input(false, { transform: coerceBooleanProperty });\n\n  /** Emits whenever `collapsed` changes (in addition to the two-way `[(collapsed)]`). */\n  readonly collapsedChanged = output<boolean>();\n\n  constructor() {\n    // The output is documented as firing whenever `collapsed` CHANGES, and it\n    // only ever fired from `toggle()` — so a `[(collapsed)]` write, which is the\n    // documented way to drive this, was silent. Emitting from an effect covers\n    // both, and skipping the first run keeps the initial value from reading as a\n    // change.\n    let first = true;\n    effect(() => {\n      const collapsed = this.collapsed();\n      if (first) {\n        first = false;\n        return;\n      }\n      untracked(() => this.collapsedChanged.emit(collapsed));\n    });\n  }\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-layout-sider'];\n    if (this.collapsed()) parts.push('wr-layout-sider--collapsed');\n    if (this.reverse()) parts.push('wr-layout-sider--reverse');\n    return parts.join(' ');\n  });\n\n  /** Imperative toggle helper — `[(collapsed)]` still works alongside this. */\n  toggle(): void {\n    // No emit here: the effect above owns that, so a toggle and an external\n    // write produce exactly one event each rather than two and none.\n    this.collapsed.set(!this.collapsed());\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 { Component, ViewEncapsulation, computed, contentChildren } from '@angular/core';\n\nimport { WrLayoutSider } from './layout-sider';\n\n/**\n * App-shell layout container. Lays its children out as a flex column by\n * default; switches to a row when a `<wr-layout-sider>` is among the\n * direct children (so `header → [sider + content] → footer` falls into\n * place automatically — same convention as ng-zorro / antd Layout).\n *\n * @example\n * ```html\n * <wr-layout>\n *   <wr-layout-header>App bar</wr-layout-header>\n *   <wr-layout>\n *     <wr-layout-sider [(collapsed)]=\"collapsed\">Sidebar</wr-layout-sider>\n *     <wr-layout-content>Main</wr-layout-content>\n *   </wr-layout>\n *   <wr-layout-footer>© 2026</wr-layout-footer>\n * </wr-layout>\n * ```\n *\n * @see https://ngwr.dev/reference/components/layout\n */\n@Component({\n  selector: 'wr-layout',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { '[class]': 'classes()' },\n})\nexport class WrLayout {\n  protected readonly siders = contentChildren(WrLayoutSider);\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-layout'];\n    if (this.siders().length > 0) parts.push('wr-layout--has-sider');\n    return parts.join(' ');\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 { Component, ViewEncapsulation } from '@angular/core';\n\n/**\n * Top bar of a {@link WrLayout}. Stretches across the parent;\n * size and stickiness are app-controlled via CSS.\n */\n@Component({\n  selector: 'wr-layout-header',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-layout-header', role: 'banner' },\n})\nexport class WrLayoutHeader {}\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 } from '@angular/core';\n\n/**\n * Main content area of a {@link WrLayout}. Flex-grows to fill\n * remaining space.\n */\n@Component({\n  selector: 'wr-layout-content',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-layout-content', role: 'main' },\n})\nexport class WrLayoutContent {}\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 } from '@angular/core';\n\n/**\n * Bottom bar of a {@link WrLayout}. Doesn't grow — sized by its\n * children.\n */\n@Component({\n  selector: 'wr-layout-footer',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-layout-footer', role: 'contentinfo' },\n})\nexport class WrLayoutFooter {}\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-layout.mjs","sources":["../../../projects/lib/layout/layout-sider.ts","../../../projects/lib/layout/layout.ts","../../../projects/lib/layout/layout-header.ts","../../../projects/lib/layout/layout-content.ts","../../../projects/lib/layout/layout-footer.ts","../../../projects/lib/layout/ngwr-layout.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, effect, input, model, output, untracked } from '@angular/core';\n\n/**\n * Collapsible side panel. Lives inside a row `<wr-layout>` next to a\n * `<wr-layout-content>`. Two-way `[(collapsed)]` controls width.\n *\n * @example\n * ```html\n * <wr-layout>\n *   <wr-layout-sider [(collapsed)]=\"collapsed\" width=\"14rem\" collapsedWidth=\"3rem\">\n *     …\n *   </wr-layout-sider>\n *   <wr-layout-content>Main</wr-layout-content>\n * </wr-layout>\n * ```\n */\n@Component({\n  selector: 'wr-layout-sider',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'classes()',\n    '[style.width]': 'collapsed() ? collapsedWidth() : width()',\n    role: 'complementary',\n  },\n})\nexport class WrLayoutSider {\n  /** Two-way bindable collapsed state. @default false */\n  readonly collapsed = model(false);\n\n  /** Width when expanded. Any CSS length. @default '16rem' */\n  readonly width = input<string>('16rem');\n\n  /** Width when collapsed. Any CSS length. `0` to fully hide. @default '4rem' */\n  readonly collapsedWidth = input<string>('4rem');\n\n  /** Place the sider on the right edge instead of the left. @default false */\n  readonly reverse = input(false, { transform: coerceBooleanProperty });\n\n  /** Emits whenever `collapsed` changes (in addition to the two-way `[(collapsed)]`). */\n  readonly collapsedChanged = output<boolean>();\n\n  constructor() {\n    // The output is documented as firing whenever `collapsed` CHANGES, and it\n    // only ever fired from `toggle()` — so a `[(collapsed)]` write, which is the\n    // documented way to drive this, was silent. Emitting from an effect covers\n    // both, and skipping the first run keeps the initial value from reading as a\n    // change.\n    let first = true;\n    effect(() => {\n      const collapsed = this.collapsed();\n      if (first) {\n        first = false;\n        return;\n      }\n      untracked(() => this.collapsedChanged.emit(collapsed));\n    });\n  }\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-layout-sider'];\n    if (this.collapsed()) parts.push('wr-layout-sider--collapsed');\n    if (this.reverse()) parts.push('wr-layout-sider--reverse');\n    return parts.join(' ');\n  });\n\n  /** Imperative toggle helper — `[(collapsed)]` still works alongside this. */\n  toggle(): void {\n    // No emit here: the effect above owns that, so a toggle and an external\n    // write produce exactly one event each rather than two and none.\n    this.collapsed.set(!this.collapsed());\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 { Component, ViewEncapsulation, computed, contentChildren } from '@angular/core';\n\nimport { WrLayoutSider } from './layout-sider';\n\n/**\n * App-shell layout container. Lays its children out as a flex column by\n * default; switches to a row when a `<wr-layout-sider>` is among the\n * direct children (so `header → [sider + content] → footer` falls into\n * place automatically — same convention as ng-zorro / antd Layout).\n *\n * @example\n * ```html\n * <wr-layout>\n *   <wr-layout-header>App bar</wr-layout-header>\n *   <wr-layout>\n *     <wr-layout-sider [(collapsed)]=\"collapsed\">Sidebar</wr-layout-sider>\n *     <wr-layout-content>Main</wr-layout-content>\n *   </wr-layout>\n *   <wr-layout-footer>© 2026</wr-layout-footer>\n * </wr-layout>\n * ```\n *\n * @see https://ngwr.dev/reference/components/layout\n */\n@Component({\n  selector: 'wr-layout',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { '[class]': 'classes()' },\n})\nexport class WrLayout {\n  protected readonly siders = contentChildren(WrLayoutSider);\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-layout'];\n    if (this.siders().length > 0) parts.push('wr-layout--has-sider');\n    return parts.join(' ');\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 { Component, ViewEncapsulation } from '@angular/core';\n\n/**\n * Top bar of a {@link WrLayout}. Stretches across the parent;\n * size and stickiness are app-controlled via CSS.\n */\n@Component({\n  selector: 'wr-layout-header',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-layout-header', role: 'banner' },\n})\nexport class WrLayoutHeader {}\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 } from '@angular/core';\n\n/**\n * Main content area of a {@link WrLayout}. Flex-grows to fill\n * remaining space.\n */\n@Component({\n  selector: 'wr-layout-content',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-layout-content', role: 'main' },\n})\nexport class WrLayoutContent {}\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 } from '@angular/core';\n\n/**\n * Bottom bar of a {@link WrLayout}. Doesn't grow — sized by its\n * children.\n */\n@Component({\n  selector: 'wr-layout-footer',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-layout-footer', role: 'contentinfo' },\n})\nexport class WrLayoutFooter {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"ngwr-lightbox-testing.mjs","sources":["../../../projects/lib/lightbox/testing/wr-lightbox-harness.ts","../../../projects/lib/lightbox/testing/ngwr-lightbox-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, TestKey, type TestElement } from '@angular/cdk/testing';\n\nimport type { WrLightboxHarnessFilters } from './interfaces';\n\n/**\n * Test harness for `<wr-lightbox>` — the thumbnail, and the full-size viewer it\n * opens.\n *\n * The thumbnail is an element in your fixture and the viewer is a portal in the NGWR\n * overlay container, so this is loaded from the normal fixture loader and reaches\n * across for you — scoped by the id the trigger publishes as `aria-controls`, never\n * by `.wr-lightbox-viewer`, which would answer with whichever lightbox opened first.\n *\n * **A closed lightbox has no viewer at all**, unlike the collapse or the speed dial:\n * the overlay is created on open and disposed on close, so every viewer read here\n * throws while it is shut rather than answering about a stale element.\n *\n * **`disablePreview` removes the button, not just its behaviour.** The thumbnail is\n * then a bare `<img>` with nothing to click and nothing in the tab order, which is\n * why {@link isInteractive} exists and why {@link open} explains itself rather than\n * timing out on a missing element.\n *\n * @example\n * ```ts\n * const lightbox = await loader.getHarness(WrLightboxHarness.with({ alt: 'Mountain' }));\n *\n * await lightbox.open();\n * expect(await lightbox.getFullSrc()).toBe('/photo.jpg');\n *\n * await lightbox.sendEscape();\n * expect(await lightbox.isOpen()).toBe(false);\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrLightboxHarness extends ComponentHarness {\n  static hostSelector = 'wr-lightbox';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrLightboxHarnessFilters = {}): HarnessPredicate<WrLightboxHarness> {\n    return new HarnessPredicate(WrLightboxHarness, options)\n      .addOption('alt', options.alt, (harness, alt) => HarnessPredicate.stringMatches(harness.getAlt(), alt))\n      .addOption('caption', options.caption, (harness, caption) =>\n        HarnessPredicate.stringMatches(harness.readCaption(), caption)\n      )\n      .addOption('open', options.open, async (harness, open) => (await harness.isOpen()) === open);\n  }\n\n  private readonly thumb = this.locatorFor('.wr-lightbox__thumb');\n  private readonly trigger = this.locatorForOptional('.wr-lightbox__trigger');\n\n  /**\n   * Whether the viewer is open, from the host's own modifier.\n   *\n   * The class rather than the overlay, because it is the answer that holds for a\n   * harness you are HOLDING: the viewer is disposed on close, and a query for it\n   * cannot tell \"shut\" apart from \"never opened\".\n   */\n  async isOpen(): Promise<boolean> {\n    return (await this.host()).hasClass('wr-lightbox--open');\n  }\n\n  /**\n   * Whether the thumbnail has settled — loaded OR failed.\n   *\n   * A failure counts on purpose: the loading state animates a shimmer and hides the\n   * image, so a broken `src` with no error path would shimmer for ever instead of\n   * falling back to its alt text. The two cases are deliberately not separated here,\n   * because the DOM does not separate them either.\n   */\n  async isLoading(): Promise<boolean> {\n    return (await this.host()).hasClass('wr-lightbox--loading');\n  }\n\n  /** The thumbnail's alt text — the same string the viewer takes its name from. */\n  async getAlt(): Promise<string> {\n    return (await this.thumb()).getProperty<string>('alt');\n  }\n\n  /**\n   * What the THUMBNAIL is showing: `preview` when one was given, `src` otherwise.\n   *\n   * Worth its own method because the two images are different files by design — a\n   * grid of thumbnails should not pull full-size originals — and because the\n   * thumbnail never swaps to `src` later. Compare with {@link getFullSrc}.\n   */\n  async getThumbSrc(): Promise<string> {\n    return (await this.thumb()).getProperty<string>('src');\n  }\n\n  /** Whether the thumbnail can be clicked open at all (`disablePreview` off). */\n  async isInteractive(): Promise<boolean> {\n    return (await this.trigger()) !== null;\n  }\n\n  /** The trigger's accessible name — falls back to the alt text, then to the catalog. */\n  async getOpenLabel(): Promise<string | null> {\n    const trigger = await this.trigger();\n    return trigger ? trigger.getAttribute('aria-label') : null;\n  }\n\n  /** Open the viewer. An already-open one is left alone; a non-interactive one throws. */\n  async open(): Promise<void> {\n    if (await this.isOpen()) return;\n\n    const trigger = await this.trigger();\n    if (!trigger) {\n      throw new Error(\n        'WrLightboxHarness.open(): this lightbox has `disablePreview` set, so there is no trigger — the ' +\n          'thumbnail renders as a bare <img> with nothing to click and nothing in the tab order.'\n      );\n    }\n    await trigger.click();\n  }\n\n  /** Close the viewer through its ✕ button. An already-closed one is left alone. */\n  async close(): Promise<void> {\n    if (!(await this.isOpen())) return;\n    await (await this.viewerPart('.wr-lightbox-viewer__close', 'close')).click();\n  }\n\n  /**\n   * Click the full image — which closes the viewer.\n   *\n   * It looks like decoration and is not: the image is styled `cursor: zoom-out`, and\n   * that is a promise. It is deliberately NOT in the tab order, since the ✕ button,\n   * Escape, the backdrop and a swipe all do the same thing and all reach a keyboard —\n   * so this is a mouse affordance, and the only way to assert it still works.\n   */\n  async clickImage(): Promise<void> {\n    await (await this.viewerPart('.wr-lightbox-viewer__full', 'clickImage')).click();\n  }\n\n  /**\n   * Press Escape.\n   *\n   * Sent to the viewer, though it would arrive from anywhere: the overlay is fed by\n   * the CDK's keyboard dispatcher, which keeps one document listener and routes to\n   * the top-most overlay.\n   */\n  async sendEscape(): Promise<void> {\n    await (await this.requireViewer('sendEscape')).sendKeys(TestKey.ESCAPE);\n  }\n\n  /** The full-size image's `src`. Throws while the viewer is closed. */\n  async getFullSrc(): Promise<string> {\n    return (await this.viewerPart('.wr-lightbox-viewer__full', 'getFullSrc')).getProperty<string>('src');\n  }\n\n  /** The caption under the full image, or `null` when there is none. Throws while closed. */\n  async getCaption(): Promise<string | null> {\n    await this.requireViewer('getCaption');\n    return this.readCaption();\n  }\n\n  /** The name the viewer dialog announces — its alt text, or the catalog's fallback. */\n  async getViewerLabel(): Promise<string | null> {\n    return (await this.requireViewer('getViewerLabel')).getAttribute('aria-label');\n  }\n\n  /** The ✕ button's accessible name. Throws while the viewer is closed. */\n  async getCloseLabel(): Promise<string | null> {\n    return (await this.viewerPart('.wr-lightbox-viewer__close', 'getCloseLabel')).getAttribute('aria-label');\n  }\n\n  /** Whether the viewer announces itself as a modal dialog. */\n  async isModal(): Promise<boolean> {\n    const viewer = await this.requireViewer('isModal');\n    return (await viewer.getAttribute('role')) === 'dialog' && (await viewer.getAttribute('aria-modal')) === 'true';\n  }\n\n  /**\n   * Whether focus is inside the viewer, where the trap should be holding it.\n   *\n   * `role=\"dialog\"` with `aria-modal` promises the page behind is out of reach, and a\n   * missing trap makes that a lie — Tab walks straight through the backdrop. Note\n   * that in a unit test the trap needs elements with a box to find anything tabbable,\n   * so a spec asserting this has to hand the DOM some dimensions first.\n   */\n  async isFocusTrapped(): Promise<boolean> {\n    return (await this.requireViewer('isFocusTrapped')).matchesSelector(':focus-within');\n  }\n\n  /**\n   * Whether the trigger's `aria-controls` names THIS lightbox's viewer, and nothing\n   * else on the page.\n   *\n   * The reference only exists while the viewer does — an id naming an element that is\n   * not in the document is not a pairing, it is a dangling reference — so this is\n   * `false` for a closed lightbox by construction. Counted across the document too,\n   * because two viewers answering to one id hand every reference to the first.\n   */\n  async isViewerBound(): Promise<boolean> {\n    const id = await this.viewerId();\n    if (!id) return false;\n\n    const matches = await this.documentRootLocatorFactory().locatorForAll(`.wr-lightbox-viewer#${id}`)();\n    const everywhere = await this.documentRootLocatorFactory().locatorForAll(`[id=\"${id}\"]`)();\n    return matches.length === 1 && everywhere.length === 1;\n  }\n\n  /** The caption without the open check — for filters, which must not throw. */\n  private async readCaption(): Promise<string | null> {\n    const id = await this.viewerId();\n    if (!id) return null;\n\n    const caption = await this.documentRootLocatorFactory().locatorForOptional(`#${id} .wr-lightbox-viewer__caption`)();\n    return caption ? caption.text() : null;\n  }\n\n  /** The id the trigger currently points at, or `null` while the viewer is closed. */\n  private async viewerId(): Promise<string | null> {\n    const trigger = await this.trigger();\n    return trigger ? trigger.getAttribute('aria-controls') : null;\n  }\n\n  private async requireViewer(method: string): Promise<TestElement> {\n    const id = await this.viewerId();\n    const viewer = id\n      ? await this.documentRootLocatorFactory().locatorForOptional(`.wr-lightbox-viewer#${id}`)()\n      : null;\n\n    if (!viewer) {\n      throw new Error(\n        `WrLightboxHarness.${method}(): the viewer is not open. It is an overlay created on open and disposed ` +\n          'on close, so there is nothing to read while the lightbox is shut — call open() first.'\n      );\n    }\n    return viewer;\n  }\n\n  private async viewerPart(selector: string, method: string): Promise<TestElement> {\n    const viewer = await this.requireViewer(method);\n    const id = await viewer.getAttribute('id');\n\n    const part = await this.documentRootLocatorFactory().locatorForOptional(`#${id} ${selector}`)();\n    if (!part) {\n      throw new Error(`WrLightboxHarness.${method}(): the viewer has no \\`${selector}\\` element.`);\n    }\n    return part;\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-lightbox-testing.mjs","sources":["../../../projects/lib/lightbox/testing/wr-lightbox-harness.ts","../../../projects/lib/lightbox/testing/ngwr-lightbox-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, TestKey, type TestElement } from '@angular/cdk/testing';\n\nimport type { WrLightboxHarnessFilters } from './interfaces';\n\n/**\n * Test harness for `<wr-lightbox>` — the thumbnail, and the full-size viewer it\n * opens.\n *\n * The thumbnail is an element in your fixture and the viewer is a portal in the NGWR\n * overlay container, so this is loaded from the normal fixture loader and reaches\n * across for you — scoped by the id the trigger publishes as `aria-controls`, never\n * by `.wr-lightbox-viewer`, which would answer with whichever lightbox opened first.\n *\n * **A closed lightbox has no viewer at all**, unlike the collapse or the speed dial:\n * the overlay is created on open and disposed on close, so every viewer read here\n * throws while it is shut rather than answering about a stale element.\n *\n * **`disablePreview` removes the button, not just its behaviour.** The thumbnail is\n * then a bare `<img>` with nothing to click and nothing in the tab order, which is\n * why {@link isInteractive} exists and why {@link open} explains itself rather than\n * timing out on a missing element.\n *\n * @example\n * ```ts\n * const lightbox = await loader.getHarness(WrLightboxHarness.with({ alt: 'Mountain' }));\n *\n * await lightbox.open();\n * expect(await lightbox.getFullSrc()).toBe('/photo.jpg');\n *\n * await lightbox.sendEscape();\n * expect(await lightbox.isOpen()).toBe(false);\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrLightboxHarness extends ComponentHarness {\n  static hostSelector = 'wr-lightbox';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrLightboxHarnessFilters = {}): HarnessPredicate<WrLightboxHarness> {\n    return new HarnessPredicate(WrLightboxHarness, options)\n      .addOption('alt', options.alt, (harness, alt) => HarnessPredicate.stringMatches(harness.getAlt(), alt))\n      .addOption('caption', options.caption, (harness, caption) =>\n        HarnessPredicate.stringMatches(harness.readCaption(), caption)\n      )\n      .addOption('open', options.open, async (harness, open) => (await harness.isOpen()) === open);\n  }\n\n  private readonly thumb = this.locatorFor('.wr-lightbox__thumb');\n  private readonly trigger = this.locatorForOptional('.wr-lightbox__trigger');\n\n  /**\n   * Whether the viewer is open, from the host's own modifier.\n   *\n   * The class rather than the overlay, because it is the answer that holds for a\n   * harness you are HOLDING: the viewer is disposed on close, and a query for it\n   * cannot tell \"shut\" apart from \"never opened\".\n   */\n  async isOpen(): Promise<boolean> {\n    return (await this.host()).hasClass('wr-lightbox--open');\n  }\n\n  /**\n   * Whether the thumbnail has settled — loaded OR failed.\n   *\n   * A failure counts on purpose: the loading state animates a shimmer and hides the\n   * image, so a broken `src` with no error path would shimmer for ever instead of\n   * falling back to its alt text. The two cases are deliberately not separated here,\n   * because the DOM does not separate them either.\n   */\n  async isLoading(): Promise<boolean> {\n    return (await this.host()).hasClass('wr-lightbox--loading');\n  }\n\n  /** The thumbnail's alt text — the same string the viewer takes its name from. */\n  async getAlt(): Promise<string> {\n    return (await this.thumb()).getProperty<string>('alt');\n  }\n\n  /**\n   * What the THUMBNAIL is showing: `preview` when one was given, `src` otherwise.\n   *\n   * Worth its own method because the two images are different files by design — a\n   * grid of thumbnails should not pull full-size originals — and because the\n   * thumbnail never swaps to `src` later. Compare with {@link getFullSrc}.\n   */\n  async getThumbSrc(): Promise<string> {\n    return (await this.thumb()).getProperty<string>('src');\n  }\n\n  /** Whether the thumbnail can be clicked open at all (`disablePreview` off). */\n  async isInteractive(): Promise<boolean> {\n    return (await this.trigger()) !== null;\n  }\n\n  /** The trigger's accessible name — falls back to the alt text, then to the catalog. */\n  async getOpenLabel(): Promise<string | null> {\n    const trigger = await this.trigger();\n    return trigger ? trigger.getAttribute('aria-label') : null;\n  }\n\n  /** Open the viewer. An already-open one is left alone; a non-interactive one throws. */\n  async open(): Promise<void> {\n    if (await this.isOpen()) return;\n\n    const trigger = await this.trigger();\n    if (!trigger) {\n      throw new Error(\n        'WrLightboxHarness.open(): this lightbox has `disablePreview` set, so there is no trigger — the ' +\n          'thumbnail renders as a bare <img> with nothing to click and nothing in the tab order.'\n      );\n    }\n    await trigger.click();\n  }\n\n  /** Close the viewer through its ✕ button. An already-closed one is left alone. */\n  async close(): Promise<void> {\n    if (!(await this.isOpen())) return;\n    await (await this.viewerPart('.wr-lightbox-viewer__close', 'close')).click();\n  }\n\n  /**\n   * Click the full image — which closes the viewer.\n   *\n   * It looks like decoration and is not: the image is styled `cursor: zoom-out`, and\n   * that is a promise. It is deliberately NOT in the tab order, since the ✕ button,\n   * Escape, the backdrop and a swipe all do the same thing and all reach a keyboard —\n   * so this is a mouse affordance, and the only way to assert it still works.\n   */\n  async clickImage(): Promise<void> {\n    await (await this.viewerPart('.wr-lightbox-viewer__full', 'clickImage')).click();\n  }\n\n  /**\n   * Press Escape.\n   *\n   * Sent to the viewer, though it would arrive from anywhere: the overlay is fed by\n   * the CDK's keyboard dispatcher, which keeps one document listener and routes to\n   * the top-most overlay.\n   */\n  async sendEscape(): Promise<void> {\n    await (await this.requireViewer('sendEscape')).sendKeys(TestKey.ESCAPE);\n  }\n\n  /** The full-size image's `src`. Throws while the viewer is closed. */\n  async getFullSrc(): Promise<string> {\n    return (await this.viewerPart('.wr-lightbox-viewer__full', 'getFullSrc')).getProperty<string>('src');\n  }\n\n  /** The caption under the full image, or `null` when there is none. Throws while closed. */\n  async getCaption(): Promise<string | null> {\n    await this.requireViewer('getCaption');\n    return this.readCaption();\n  }\n\n  /** The name the viewer dialog announces — its alt text, or the catalog's fallback. */\n  async getViewerLabel(): Promise<string | null> {\n    return (await this.requireViewer('getViewerLabel')).getAttribute('aria-label');\n  }\n\n  /** The ✕ button's accessible name. Throws while the viewer is closed. */\n  async getCloseLabel(): Promise<string | null> {\n    return (await this.viewerPart('.wr-lightbox-viewer__close', 'getCloseLabel')).getAttribute('aria-label');\n  }\n\n  /** Whether the viewer announces itself as a modal dialog. */\n  async isModal(): Promise<boolean> {\n    const viewer = await this.requireViewer('isModal');\n    return (await viewer.getAttribute('role')) === 'dialog' && (await viewer.getAttribute('aria-modal')) === 'true';\n  }\n\n  /**\n   * Whether focus is inside the viewer, where the trap should be holding it.\n   *\n   * `role=\"dialog\"` with `aria-modal` promises the page behind is out of reach, and a\n   * missing trap makes that a lie — Tab walks straight through the backdrop. Note\n   * that in a unit test the trap needs elements with a box to find anything tabbable,\n   * so a spec asserting this has to hand the DOM some dimensions first.\n   */\n  async isFocusTrapped(): Promise<boolean> {\n    return (await this.requireViewer('isFocusTrapped')).matchesSelector(':focus-within');\n  }\n\n  /**\n   * Whether the trigger's `aria-controls` names THIS lightbox's viewer, and nothing\n   * else on the page.\n   *\n   * The reference only exists while the viewer does — an id naming an element that is\n   * not in the document is not a pairing, it is a dangling reference — so this is\n   * `false` for a closed lightbox by construction. Counted across the document too,\n   * because two viewers answering to one id hand every reference to the first.\n   */\n  async isViewerBound(): Promise<boolean> {\n    const id = await this.viewerId();\n    if (!id) return false;\n\n    const matches = await this.documentRootLocatorFactory().locatorForAll(`.wr-lightbox-viewer#${id}`)();\n    const everywhere = await this.documentRootLocatorFactory().locatorForAll(`[id=\"${id}\"]`)();\n    return matches.length === 1 && everywhere.length === 1;\n  }\n\n  /** The caption without the open check — for filters, which must not throw. */\n  private async readCaption(): Promise<string | null> {\n    const id = await this.viewerId();\n    if (!id) return null;\n\n    const caption = await this.documentRootLocatorFactory().locatorForOptional(`#${id} .wr-lightbox-viewer__caption`)();\n    return caption ? caption.text() : null;\n  }\n\n  /** The id the trigger currently points at, or `null` while the viewer is closed. */\n  private async viewerId(): Promise<string | null> {\n    const trigger = await this.trigger();\n    return trigger ? trigger.getAttribute('aria-controls') : null;\n  }\n\n  private async requireViewer(method: string): Promise<TestElement> {\n    const id = await this.viewerId();\n    const viewer = id\n      ? await this.documentRootLocatorFactory().locatorForOptional(`.wr-lightbox-viewer#${id}`)()\n      : null;\n\n    if (!viewer) {\n      throw new Error(\n        `WrLightboxHarness.${method}(): the viewer is not open. It is an overlay created on open and disposed ` +\n          'on close, so there is nothing to read while the lightbox is shut — call open() first.'\n      );\n    }\n    return viewer;\n  }\n\n  private async viewerPart(selector: string, method: string): Promise<TestElement> {\n    const viewer = await this.requireViewer(method);\n    const id = await viewer.getAttribute('id');\n\n    const part = await this.documentRootLocatorFactory().locatorForOptional(`#${id} ${selector}`)();\n    if (!part) {\n      throw new Error(`WrLightboxHarness.${method}(): the viewer has no \\`${selector}\\` element.`);\n    }\n    return part;\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-lightbox.mjs

@@ -252,10 +252,10 @@ class WrLightbox {
         if (restore && typeof restore.focus === 'function')
             restore.focus();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLightbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: WrLightbox, isStandalone: true, selector: "wr-lightbox", inputs: { openLabel: { classPropertyName: "openLabel", publicName: "openLabel", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, preview: { classPropertyName: "preview", publicName: "preview", isSignal: true, isRequired: false, transformFunction: null }, disablePreview: { classPropertyName: "disablePreview", publicName: "disablePreview", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, aspectRatio: { classPropertyName: "aspectRatio", publicName: "aspectRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "style.aspect-ratio": "aspectRatio()" } }, viewQueries: [{ propertyName: "panelTpl", first: true, predicate: ["viewerTpl"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (disablePreview()) {\n  <img\n    class=\"wr-lightbox__thumb\"\n    [src]=\"preview() || src()\"\n    [alt]=\"alt()\"\n    (load)=\"onSettled()\"\n    (error)=\"onSettled()\"\n    loading=\"lazy\"\n    decoding=\"async\"\n  />\n} @else {\n  <!-- The trigger opens a modal dialog, and used to say so nowhere: no hint that it\n       opens anything, and nothing on the page tying it to the viewer it opened. -->\n  <button\n    type=\"button\"\n    class=\"wr-lightbox__trigger\"\n    aria-haspopup=\"dialog\"\n    [attr.aria-controls]=\"open() ? viewerId : null\"\n    [attr.aria-label]=\"resolvedOpenLabel()\"\n    (click)=\"onClick()\"\n  >\n    <img\n      class=\"wr-lightbox__thumb\"\n      [src]=\"preview() || src()\"\n      [alt]=\"alt()\"\n      (load)=\"onSettled()\"\n      (error)=\"onSettled()\"\n      loading=\"lazy\"\n      decoding=\"async\"\n    />\n  </button>\n}\n\n<ng-template #viewerTpl>\n  <div\n    #viewer\n    class=\"wr-lightbox-viewer\"\n    [id]=\"viewerId\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    [attr.aria-label]=\"resolvedViewerLabel()\"\n    (touchstart)=\"onViewerSwipeStart($event)\"\n    (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n    (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n    (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n  >\n    <button\n      type=\"button\"\n      class=\"wr-lightbox-viewer__close\"\n      [attr.aria-label]=\"resolvedCloseLabel()\"\n      (click)=\"onClose()\"\n      (keydown.enter)=\"onClose()\"\n      (keydown.space)=\"onClose()\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M18 6 6 18\" />\n        <path d=\"m6 6 12 12\" />\n      </svg>\n    </button>\n    <!--\n      Styled `cursor: zoom-out`, which is a promise: clicking the image closes. A\n      REDUNDANT mouse affordance \u2014 the close button, Escape, the backdrop and\n      swipe-down all do the same thing and all reach a keyboard \u2014 so the image stays\n      out of the tab order rather than becoming a second close stop.\n    -->\n    <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events,@angular-eslint/template/interactive-supports-focus -->\n    <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" (click)=\"onClose()\" />\n    @if (caption()) {\n      <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n    }\n  </div>\n</ng-template>\n", styles: [".wr-btn:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-table__sort-btn:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-tabs__tab:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-sidebar__entry:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-sidebar__item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-anchor__link:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-collapse__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-command-palette__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-mention-panel__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-segmented__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-back-top:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-stepper__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-window__chrome-action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-dropdown-item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-alert__close:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-graph__viewport:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-lightbox{display:inline-block;position:relative;overflow:hidden;border-radius:var(--wr-lightbox-radius, var(--wr-border-radius-base))}@supports (corner-shape: squircle){.wr-lightbox{corner-shape:squircle;border-radius:calc(var(--wr-lightbox-radius, var(--wr-border-radius-base)) * 1.85)}}.wr-lightbox{background:var(--wr-color-hover)}.wr-lightbox--loading{min-height:var(--wr-lightbox-loading-min-height, 4rem)}.wr-lightbox--loading:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--wr-color-surface-rgb),0),rgba(var(--wr-color-surface-rgb),.45),rgba(var(--wr-color-surface-rgb),0));background-size:200% 100%;animation:wr-lightbox-shimmer 1.4s linear infinite;pointer-events:none;z-index:1}.wr-lightbox__trigger{display:block;width:100%;height:100%;padding:0;margin:0;border:0;background:transparent;cursor:zoom-in}.wr-lightbox__trigger:focus-visible{outline:none}.wr-lightbox__thumb{display:block;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;position:relative;z-index:2;opacity:1;transition:opacity .25s ease}.wr-lightbox--loading .wr-lightbox__thumb{opacity:0}.wr-lightbox:has(.wr-lightbox__trigger:focus-visible){outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}@keyframes wr-lightbox-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.wr-lightbox-backdrop{background:rgba(var(--wr-color-backdrop-rgb),.85)}.wr-lightbox-overlay{pointer-events:auto}.wr-lightbox-viewer{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:95vw;max-height:95vh;max-height:95dvh;padding:1rem;animation:wr-lightbox-viewer-in .18s ease;outline:none;touch-action:none}.wr-lightbox-viewer__close{font-size:inherit;position:absolute;top:1rem;inset-inline-end:1rem;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;border-radius:999px;background:rgba(var(--wr-color-surface-rgb),.12);color:rgba(var(--wr-color-surface-rgb),.9);cursor:pointer;transition:background .15s ease,transform .15s ease}@media(pointer:coarse){.wr-lightbox-viewer__close:after{content:\"\";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}}.wr-lightbox-viewer__close:hover{background:rgba(var(--wr-color-surface-rgb),.2)}.wr-lightbox-viewer__close:active{transform:scale(.95)}.wr-lightbox-viewer__close:focus-visible{outline:2px solid rgba(var(--wr-color-surface-rgb),.9);outline-offset:2px}.wr-lightbox-viewer__full{display:block;max-width:100%;max-height:calc(95vh - 4rem);max-height:calc(95dvh - 4rem);object-fit:contain;cursor:zoom-out;border-radius:.5rem}@supports (corner-shape: squircle){.wr-lightbox-viewer__full{corner-shape:squircle;border-radius:.925rem}}.wr-lightbox-viewer__caption{color:rgba(var(--wr-color-surface-rgb),.85);font-family:var(--wr-font-family-base);font-size:var(--wr-text-sm);text-align:center;max-width:60ch}@keyframes wr-lightbox-viewer-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}\n"], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLightbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: WrLightbox, isStandalone: true, selector: "wr-lightbox", inputs: { openLabel: { classPropertyName: "openLabel", publicName: "openLabel", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, preview: { classPropertyName: "preview", publicName: "preview", isSignal: true, isRequired: false, transformFunction: null }, disablePreview: { classPropertyName: "disablePreview", publicName: "disablePreview", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, aspectRatio: { classPropertyName: "aspectRatio", publicName: "aspectRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "style.aspect-ratio": "aspectRatio()" } }, viewQueries: [{ propertyName: "panelTpl", first: true, predicate: ["viewerTpl"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (disablePreview()) {\n  <img\n    class=\"wr-lightbox__thumb\"\n    [src]=\"preview() || src()\"\n    [alt]=\"alt()\"\n    (load)=\"onSettled()\"\n    (error)=\"onSettled()\"\n    loading=\"lazy\"\n    decoding=\"async\"\n  />\n} @else {\n  <!-- The trigger opens a modal dialog, and used to say so nowhere: no hint that it\n       opens anything, and nothing on the page tying it to the viewer it opened. -->\n  <button\n    type=\"button\"\n    class=\"wr-lightbox__trigger\"\n    aria-haspopup=\"dialog\"\n    [attr.aria-controls]=\"open() ? viewerId : null\"\n    [attr.aria-label]=\"resolvedOpenLabel()\"\n    (click)=\"onClick()\"\n  >\n    <img\n      class=\"wr-lightbox__thumb\"\n      [src]=\"preview() || src()\"\n      [alt]=\"alt()\"\n      (load)=\"onSettled()\"\n      (error)=\"onSettled()\"\n      loading=\"lazy\"\n      decoding=\"async\"\n    />\n  </button>\n}\n\n<ng-template #viewerTpl>\n  <div\n    #viewer\n    class=\"wr-lightbox-viewer\"\n    [id]=\"viewerId\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    [attr.aria-label]=\"resolvedViewerLabel()\"\n    (touchstart)=\"onViewerSwipeStart($event)\"\n    (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n    (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n    (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n  >\n    <button\n      type=\"button\"\n      class=\"wr-lightbox-viewer__close\"\n      [attr.aria-label]=\"resolvedCloseLabel()\"\n      (click)=\"onClose()\"\n      (keydown.enter)=\"onClose()\"\n      (keydown.space)=\"onClose()\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M18 6 6 18\" />\n        <path d=\"m6 6 12 12\" />\n      </svg>\n    </button>\n    <!--\n      Styled `cursor: zoom-out`, which is a promise: clicking the image closes. A\n      REDUNDANT mouse affordance \u2014 the close button, Escape, the backdrop and\n      swipe-down all do the same thing and all reach a keyboard \u2014 so the image stays\n      out of the tab order rather than becoming a second close stop.\n    -->\n    <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events,@angular-eslint/template/interactive-supports-focus -->\n    <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" (click)=\"onClose()\" />\n    @if (caption()) {\n      <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n    }\n  </div>\n</ng-template>\n", styles: [".wr-btn:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-table__sort-btn:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-tabs__tab:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-sidebar__entry:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-sidebar__item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-anchor__link:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-collapse__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-command-palette__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-mention-panel__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-segmented__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-back-top:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-stepper__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-window__chrome-action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-dropdown-item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-alert__close:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-graph__viewport:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-lightbox{display:inline-block;position:relative;overflow:hidden;border-radius:var(--wr-lightbox-radius, var(--wr-border-radius-base))}@supports (corner-shape: squircle){.wr-lightbox{corner-shape:squircle;border-radius:calc(var(--wr-lightbox-radius, var(--wr-border-radius-base)) * 1.85)}}.wr-lightbox{background:var(--wr-color-hover)}.wr-lightbox--loading{min-height:var(--wr-lightbox-loading-min-height, 4rem)}.wr-lightbox--loading:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--wr-color-surface-rgb),0),rgba(var(--wr-color-surface-rgb),.45),rgba(var(--wr-color-surface-rgb),0));background-size:200% 100%;animation:wr-lightbox-shimmer 1.4s linear infinite;pointer-events:none;z-index:1}.wr-lightbox__trigger{display:block;width:100%;height:100%;padding:0;margin:0;border:0;background:transparent;cursor:zoom-in}.wr-lightbox__trigger:focus-visible{outline:none}.wr-lightbox__thumb{display:block;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;position:relative;z-index:2;opacity:1;transition:opacity .25s ease}.wr-lightbox--loading .wr-lightbox__thumb{opacity:0}.wr-lightbox:has(.wr-lightbox__trigger:focus-visible){outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}@keyframes wr-lightbox-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.wr-lightbox-backdrop{background:rgba(var(--wr-color-backdrop-rgb),.85)}.wr-lightbox-overlay{pointer-events:auto}.wr-lightbox-viewer{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:95vw;max-height:95vh;max-height:95dvh;padding:1rem;animation:wr-lightbox-viewer-in .18s ease;outline:none;touch-action:none}.wr-lightbox-viewer__close{font-size:inherit;position:absolute;top:1rem;inset-inline-end:1rem;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;border-radius:999px;background:rgba(var(--wr-color-surface-rgb),.12);color:rgba(var(--wr-color-surface-rgb),.9);cursor:pointer;transition:background .15s ease,transform .15s ease}@media(pointer:coarse){.wr-lightbox-viewer__close:after{content:\"\";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}}.wr-lightbox-viewer__close:hover{background:rgba(var(--wr-color-surface-rgb),.2)}.wr-lightbox-viewer__close:active{transform:scale(.95)}.wr-lightbox-viewer__close:focus-visible{outline:2px solid rgba(var(--wr-color-surface-rgb),.9);outline-offset:2px}.wr-lightbox-viewer__full{display:block;max-width:100%;max-height:calc(95vh - 4rem);max-height:calc(95dvh - 4rem);object-fit:contain;cursor:zoom-out;border-radius:.5rem}@supports (corner-shape: squircle){.wr-lightbox-viewer__full{corner-shape:squircle;border-radius:.925rem}}.wr-lightbox-viewer__caption{color:rgba(var(--wr-color-surface-rgb),.85);font-family:var(--wr-font-family-base);font-size:var(--wr-text-sm);text-align:center;max-width:60ch}@keyframes wr-lightbox-viewer-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}\n"], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrLightbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: WrLightbox, decorators: [{
             type: Component,
             args: [{ selector: 'wr-lightbox', encapsulation: ViewEncapsulation.None, host: {
                         '[class]': 'classes()',

package/fesm2022/ngwr-lightbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-lightbox.mjs","sources":["../../../projects/lib/lightbox/lightbox.ts","../../../projects/lib/lightbox/lightbox.html","../../../projects/lib/lightbox/ngwr-lightbox.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 { type ConfigurableFocusTrap, ConfigurableFocusTrapFactory } from '@angular/cdk/a11y';\nimport { Directionality } from '@angular/cdk/bidi';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { type OverlayRef } from '@angular/cdk/overlay';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport type { TemplateRef } from '@angular/core';\nimport {\n  Component,\n  DestroyRef,\n  EnvironmentInjector,\n  Injector,\n  ViewContainerRef,\n  ViewEncapsulation,\n  computed,\n  effect,\n  inject,\n  input,\n  signal,\n  viewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { useI18nText } from 'ngwr/i18n';\nimport { WR_OVERLAY, wrFollowDirection } from 'ngwr/overlay';\n\nlet viewerUid = 0;\n\n/**\n * Image with click-to-zoom lightbox. The thumbnail is a plain `<img>`\n * with whatever sizing/`object-fit` you give it; clicking opens a CDK\n * overlay showing the full image, with Escape + close button + backdrop\n * to dismiss.\n *\n * @example\n * ```html\n * <wr-lightbox\n *   src=\"/photo.jpg\"\n *   alt=\"Mountain\"\n *   style=\"width: 16rem; height: 10rem; object-fit: cover\"\n * />\n * ```\n *\n * @see https://ngwr.dev/reference/components/lightbox\n */\n@Component({\n  selector: 'wr-lightbox',\n  templateUrl: './lightbox.html',\n  styleUrl: './lightbox.scss',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'classes()',\n    '[style.aspect-ratio]': 'aspectRatio()',\n  },\n})\nexport class WrLightbox {\n  /** Accessible name. Falls back to `image.close`, then `'Close preview'`. */\n  /** Accessible name of the thumbnail button. Falls back to `alt`, then `image.open`. */\n  readonly openLabel = input<string | null>(null);\n\n  readonly closeLabel = input<string | null>(null);\n\n  protected readonly resolvedCloseLabel = useI18nText(this.closeLabel, 'image.close', 'Close preview');\n\n  /** Image source. */\n  readonly src = input.required<string>();\n\n  /** Alt text. Required for a11y; falls back to an empty string. @default '' */\n  readonly alt = input<string>('');\n\n  /**\n   * Lighter source for the THUMBNAIL — a small or blurred copy, so the grid does not\n   * pull full-size images. The viewer always shows `src`; the thumbnail does not swap\n   * to it later.\n   */\n  readonly preview = input<string | null>(null);\n\n  // Both of these were hard-coded English literals in the template, next to a catalog\n  // that already carried `image.open` translated and unread. `useI18nText` already\n  // does the whole chain — a non-empty binding wins, then the catalog, then the\n  // English default — so the alt text (which describes the actual picture) is what\n  // gets forwarded, with `openLabel` ahead of it as the explicit override.\n  protected readonly resolvedOpenLabel = useI18nText(\n    computed(() => {\n      // Not `??`: an empty `openLabel` is no label at all, so it has to fall through\n      // to the alt text rather than winning as an empty string.\n      const explicit = this.openLabel();\n      if (explicit) return explicit;\n      return this.alt();\n    }),\n    'image.open',\n    'Open preview'\n  );\n\n  protected readonly resolvedViewerLabel = useI18nText(this.alt, 'image.viewer', 'Image preview');\n\n  /** Disable the click-to-zoom lightbox. @default false */\n  readonly disablePreview = input(false, { transform: coerceBooleanProperty });\n\n  /** Caption shown under the full image in the lightbox. */\n  readonly caption = input<string>('');\n\n  /**\n   * Reserve space before the image resolves by fixing the thumbnail's\n   * `aspect-ratio` (e.g. `'16 / 9'`, `'4 / 3'`, or a number like `1.5`).\n   * Prevents the layout jump when the intrinsic image size isn't known up\n   * front — pair it with a `width` and the box keeps its height from first\n   * paint. @default null\n   */\n  readonly aspectRatio = input<string | number | null>(null);\n\n  protected readonly open = signal(false);\n  protected readonly loaded = signal(false);\n\n  /**\n   * Id the trigger's `aria-controls` points at while the viewer is open.\n   *\n   * @internal Public so the host bindings can read it.\n   */\n  protected readonly viewerId = `wr-lightbox-viewer-${++viewerUid}`;\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-lightbox'];\n    if (this.open()) parts.push('wr-lightbox--open');\n    if (!this.loaded()) parts.push('wr-lightbox--loading');\n    return parts.join(' ');\n  });\n\n  // Query by name — `@if` blocks register their own TemplateRefs, so an\n  // unqualified TemplateRef query would grab the thumbnail branch instead.\n  protected readonly panelTpl = viewChild.required<TemplateRef<unknown>>('viewerTpl');\n\n  private readonly overlay = inject(WR_OVERLAY);\n  private readonly vcr = inject(ViewContainerRef);\n  private readonly destroyRef = inject(DestroyRef);\n  private readonly injector = inject(Injector);\n  private readonly focusTrapFactory = inject(ConfigurableFocusTrapFactory);\n  /**\n   * The reading direction the open viewer has to keep up with, resolved off the\n   * ENVIRONMENT injector rather than this component's — the same instance the\n   * CDK read when it stamped the overlay, since `createOverlayRef` takes\n   * `Directionality` from the `Overlay`'s injector and no node-level `[dir]` is\n   * in that chain. The viewer is appended to the overlay container on `<body>`,\n   * not into whatever region the thumbnail sits in, so reading the node\n   * injector would rewrite a correctly-stamped panel to an island's direction\n   * one pass after it opened rather than follow the application at all.\n   *\n   * `null` never happens in an app — `Directionality` is root-provided — but a\n   * bare `TestBed` should still get a viewer that opens.\n   */\n  private readonly dir = inject(EnvironmentInjector).get(Directionality, null);\n  private focusTrap: ConfigurableFocusTrap | null = null;\n  private previouslyFocused: HTMLElement | null = null;\n  private overlayRef: OverlayRef | null = null;\n\n  constructor() {\n    // Destroying the component while the viewer is open removes the projected\n    // content (the portal uses this component's ViewContainerRef) but leaves the\n    // overlay pane and its full-screen backdrop behind, with page scroll still\n    // blocked. Dispose the overlay explicitly.\n    this.destroyRef.onDestroy(() => this.closeOverlay());\n\n    effect(() => {\n      if (this.open()) this.openOverlay();\n      else this.closeOverlay();\n    });\n  }\n\n  protected onClick(): void {\n    if (this.disablePreview()) return;\n    this.open.set(true);\n  }\n\n  protected onClose(): void {\n    this.open.set(false);\n  }\n\n  // Swipe-down-to-dismiss on the open viewer. The image follows the finger and\n  // fades; releasing past ~20% of the viewer height closes it.\n  private viewerStartY = 0;\n  private viewerSwiping = false;\n\n  protected onViewerSwipeStart(event: TouchEvent): void {\n    const touch = event.touches[0];\n    if (!touch) return;\n    this.viewerStartY = touch.clientY;\n    this.viewerSwiping = true;\n  }\n\n  protected onViewerSwipeMove(event: TouchEvent, viewer: HTMLElement): void {\n    if (!this.viewerSwiping) return;\n    const touch = event.touches[0];\n    if (!touch) return;\n    const dy = touch.clientY - this.viewerStartY;\n    if (dy <= 0) {\n      viewer.style.transform = '';\n      viewer.style.opacity = '';\n      return;\n    }\n    event.preventDefault();\n    viewer.style.transition = 'none';\n    viewer.style.transform = `translateY(${dy}px)`;\n    viewer.style.opacity = String(Math.max(0.3, 1 - dy / (viewer.offsetHeight || 1)));\n  }\n\n  protected onViewerSwipeEnd(event: TouchEvent, viewer: HTMLElement): void {\n    if (!this.viewerSwiping) return;\n    this.viewerSwiping = false;\n    const touch = event.changedTouches[0];\n    const dy = touch ? touch.clientY - this.viewerStartY : 0;\n    if (dy > (viewer.offsetHeight || 0) * 0.2) {\n      this.onClose();\n    } else {\n      viewer.style.transition = '';\n      viewer.style.transform = '';\n      viewer.style.opacity = '';\n    }\n  }\n\n  /**\n   * The thumbnail has settled, one way or the other. A failure counts: `--loading`\n   * animates a shimmer AND sets `opacity: 0` on the image, so a broken `src` with no\n   * error path left an invisible box shimmering for ever instead of showing its alt\n   * text.\n   */\n  protected onSettled(): void {\n    this.loaded.set(true);\n  }\n\n  // Overlay\n\n  private openOverlay(): void {\n    if (this.overlayRef) return;\n\n    this.overlayRef = this.overlay.create({\n      hasBackdrop: true,\n      backdropClass: 'wr-lightbox-backdrop',\n      positionStrategy: this.overlay.position().global().centerHorizontally().centerVertically(),\n      scrollStrategy: this.overlay.scrollStrategies.block(),\n      panelClass: 'wr-lightbox-overlay',\n    });\n\n    // Centred on both axes, so no geometry rides on the direction — but the\n    // viewer's own chrome does. The ✕ is placed with `inset-inline-end` and the\n    // caption reads as prose, both against the `dir` the CDK froze at create, so\n    // a flip while the viewer is open leaves the button on the wrong corner.\n    wrFollowDirection(this.overlayRef, this.dir, this.injector);\n\n    const portal = new TemplatePortal(this.panelTpl(), this.vcr);\n    this.overlayRef.attach(portal);\n\n    // The viewer declares role=\"dialog\" + aria-modal=\"true\", which promises the\n    // rest of the page is inert. Without a focus trap that promise is a lie:\n    // Tab walks straight out of the viewer into the page behind the backdrop.\n    const active = document.activeElement;\n    this.previouslyFocused = active instanceof HTMLElement ? active : null;\n    this.focusTrap = this.focusTrapFactory.create(this.overlayRef.overlayElement);\n    void this.focusTrap.focusInitialElementWhenReady();\n\n    this.overlayRef\n      .backdropClick()\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(() => this.open.set(false));\n\n    this.overlayRef\n      .keydownEvents()\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(event => {\n        if (event.key === 'Escape') {\n          event.preventDefault();\n          this.open.set(false);\n        }\n      });\n  }\n\n  private closeOverlay(): void {\n    if (!this.overlayRef) return;\n    this.focusTrap?.destroy();\n    this.focusTrap = null;\n    const restore = this.previouslyFocused;\n    this.previouslyFocused = null;\n    this.overlayRef.dispose();\n    this.overlayRef = null;\n    // Send focus back where it came from, or it lands on <body> and the user\n    // has to tab from the top of the page again.\n    if (restore && typeof restore.focus === 'function') restore.focus();\n  }\n}\n","@if (disablePreview()) {\n  <img\n    class=\"wr-lightbox__thumb\"\n    [src]=\"preview() || src()\"\n    [alt]=\"alt()\"\n    (load)=\"onSettled()\"\n    (error)=\"onSettled()\"\n    loading=\"lazy\"\n    decoding=\"async\"\n  />\n} @else {\n  <!-- The trigger opens a modal dialog, and used to say so nowhere: no hint that it\n       opens anything, and nothing on the page tying it to the viewer it opened. -->\n  <button\n    type=\"button\"\n    class=\"wr-lightbox__trigger\"\n    aria-haspopup=\"dialog\"\n    [attr.aria-controls]=\"open() ? viewerId : null\"\n    [attr.aria-label]=\"resolvedOpenLabel()\"\n    (click)=\"onClick()\"\n  >\n    <img\n      class=\"wr-lightbox__thumb\"\n      [src]=\"preview() || src()\"\n      [alt]=\"alt()\"\n      (load)=\"onSettled()\"\n      (error)=\"onSettled()\"\n      loading=\"lazy\"\n      decoding=\"async\"\n    />\n  </button>\n}\n\n<ng-template #viewerTpl>\n  <div\n    #viewer\n    class=\"wr-lightbox-viewer\"\n    [id]=\"viewerId\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    [attr.aria-label]=\"resolvedViewerLabel()\"\n    (touchstart)=\"onViewerSwipeStart($event)\"\n    (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n    (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n    (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n  >\n    <button\n      type=\"button\"\n      class=\"wr-lightbox-viewer__close\"\n      [attr.aria-label]=\"resolvedCloseLabel()\"\n      (click)=\"onClose()\"\n      (keydown.enter)=\"onClose()\"\n      (keydown.space)=\"onClose()\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M18 6 6 18\" />\n        <path d=\"m6 6 12 12\" />\n      </svg>\n    </button>\n    <!--\n      Styled `cursor: zoom-out`, which is a promise: clicking the image closes. A\n      REDUNDANT mouse affordance — the close button, Escape, the backdrop and\n      swipe-down all do the same thing and all reach a keyboard — so the image stays\n      out of the tab order rather than becoming a second close stop.\n    -->\n    <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events,@angular-eslint/template/interactive-supports-focus -->\n    <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" (click)=\"onClose()\" />\n    @if (caption()) {\n      <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n    }\n  </div>\n</ng-template>\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-lightbox.mjs","sources":["../../../projects/lib/lightbox/lightbox.ts","../../../projects/lib/lightbox/lightbox.html","../../../projects/lib/lightbox/ngwr-lightbox.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 { type ConfigurableFocusTrap, ConfigurableFocusTrapFactory } from '@angular/cdk/a11y';\nimport { Directionality } from '@angular/cdk/bidi';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { type OverlayRef } from '@angular/cdk/overlay';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport type { TemplateRef } from '@angular/core';\nimport {\n  Component,\n  DestroyRef,\n  EnvironmentInjector,\n  Injector,\n  ViewContainerRef,\n  ViewEncapsulation,\n  computed,\n  effect,\n  inject,\n  input,\n  signal,\n  viewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { useI18nText } from 'ngwr/i18n';\nimport { WR_OVERLAY, wrFollowDirection } from 'ngwr/overlay';\n\nlet viewerUid = 0;\n\n/**\n * Image with click-to-zoom lightbox. The thumbnail is a plain `<img>`\n * with whatever sizing/`object-fit` you give it; clicking opens a CDK\n * overlay showing the full image, with Escape + close button + backdrop\n * to dismiss.\n *\n * @example\n * ```html\n * <wr-lightbox\n *   src=\"/photo.jpg\"\n *   alt=\"Mountain\"\n *   style=\"width: 16rem; height: 10rem; object-fit: cover\"\n * />\n * ```\n *\n * @see https://ngwr.dev/reference/components/lightbox\n */\n@Component({\n  selector: 'wr-lightbox',\n  templateUrl: './lightbox.html',\n  styleUrl: './lightbox.scss',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'classes()',\n    '[style.aspect-ratio]': 'aspectRatio()',\n  },\n})\nexport class WrLightbox {\n  /** Accessible name. Falls back to `image.close`, then `'Close preview'`. */\n  /** Accessible name of the thumbnail button. Falls back to `alt`, then `image.open`. */\n  readonly openLabel = input<string | null>(null);\n\n  readonly closeLabel = input<string | null>(null);\n\n  protected readonly resolvedCloseLabel = useI18nText(this.closeLabel, 'image.close', 'Close preview');\n\n  /** Image source. */\n  readonly src = input.required<string>();\n\n  /** Alt text. Required for a11y; falls back to an empty string. @default '' */\n  readonly alt = input<string>('');\n\n  /**\n   * Lighter source for the THUMBNAIL — a small or blurred copy, so the grid does not\n   * pull full-size images. The viewer always shows `src`; the thumbnail does not swap\n   * to it later.\n   */\n  readonly preview = input<string | null>(null);\n\n  // Both of these were hard-coded English literals in the template, next to a catalog\n  // that already carried `image.open` translated and unread. `useI18nText` already\n  // does the whole chain — a non-empty binding wins, then the catalog, then the\n  // English default — so the alt text (which describes the actual picture) is what\n  // gets forwarded, with `openLabel` ahead of it as the explicit override.\n  protected readonly resolvedOpenLabel = useI18nText(\n    computed(() => {\n      // Not `??`: an empty `openLabel` is no label at all, so it has to fall through\n      // to the alt text rather than winning as an empty string.\n      const explicit = this.openLabel();\n      if (explicit) return explicit;\n      return this.alt();\n    }),\n    'image.open',\n    'Open preview'\n  );\n\n  protected readonly resolvedViewerLabel = useI18nText(this.alt, 'image.viewer', 'Image preview');\n\n  /** Disable the click-to-zoom lightbox. @default false */\n  readonly disablePreview = input(false, { transform: coerceBooleanProperty });\n\n  /** Caption shown under the full image in the lightbox. */\n  readonly caption = input<string>('');\n\n  /**\n   * Reserve space before the image resolves by fixing the thumbnail's\n   * `aspect-ratio` (e.g. `'16 / 9'`, `'4 / 3'`, or a number like `1.5`).\n   * Prevents the layout jump when the intrinsic image size isn't known up\n   * front — pair it with a `width` and the box keeps its height from first\n   * paint. @default null\n   */\n  readonly aspectRatio = input<string | number | null>(null);\n\n  protected readonly open = signal(false);\n  protected readonly loaded = signal(false);\n\n  /**\n   * Id the trigger's `aria-controls` points at while the viewer is open.\n   *\n   * @internal Public so the host bindings can read it.\n   */\n  protected readonly viewerId = `wr-lightbox-viewer-${++viewerUid}`;\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-lightbox'];\n    if (this.open()) parts.push('wr-lightbox--open');\n    if (!this.loaded()) parts.push('wr-lightbox--loading');\n    return parts.join(' ');\n  });\n\n  // Query by name — `@if` blocks register their own TemplateRefs, so an\n  // unqualified TemplateRef query would grab the thumbnail branch instead.\n  protected readonly panelTpl = viewChild.required<TemplateRef<unknown>>('viewerTpl');\n\n  private readonly overlay = inject(WR_OVERLAY);\n  private readonly vcr = inject(ViewContainerRef);\n  private readonly destroyRef = inject(DestroyRef);\n  private readonly injector = inject(Injector);\n  private readonly focusTrapFactory = inject(ConfigurableFocusTrapFactory);\n  /**\n   * The reading direction the open viewer has to keep up with, resolved off the\n   * ENVIRONMENT injector rather than this component's — the same instance the\n   * CDK read when it stamped the overlay, since `createOverlayRef` takes\n   * `Directionality` from the `Overlay`'s injector and no node-level `[dir]` is\n   * in that chain. The viewer is appended to the overlay container on `<body>`,\n   * not into whatever region the thumbnail sits in, so reading the node\n   * injector would rewrite a correctly-stamped panel to an island's direction\n   * one pass after it opened rather than follow the application at all.\n   *\n   * `null` never happens in an app — `Directionality` is root-provided — but a\n   * bare `TestBed` should still get a viewer that opens.\n   */\n  private readonly dir = inject(EnvironmentInjector).get(Directionality, null);\n  private focusTrap: ConfigurableFocusTrap | null = null;\n  private previouslyFocused: HTMLElement | null = null;\n  private overlayRef: OverlayRef | null = null;\n\n  constructor() {\n    // Destroying the component while the viewer is open removes the projected\n    // content (the portal uses this component's ViewContainerRef) but leaves the\n    // overlay pane and its full-screen backdrop behind, with page scroll still\n    // blocked. Dispose the overlay explicitly.\n    this.destroyRef.onDestroy(() => this.closeOverlay());\n\n    effect(() => {\n      if (this.open()) this.openOverlay();\n      else this.closeOverlay();\n    });\n  }\n\n  protected onClick(): void {\n    if (this.disablePreview()) return;\n    this.open.set(true);\n  }\n\n  protected onClose(): void {\n    this.open.set(false);\n  }\n\n  // Swipe-down-to-dismiss on the open viewer. The image follows the finger and\n  // fades; releasing past ~20% of the viewer height closes it.\n  private viewerStartY = 0;\n  private viewerSwiping = false;\n\n  protected onViewerSwipeStart(event: TouchEvent): void {\n    const touch = event.touches[0];\n    if (!touch) return;\n    this.viewerStartY = touch.clientY;\n    this.viewerSwiping = true;\n  }\n\n  protected onViewerSwipeMove(event: TouchEvent, viewer: HTMLElement): void {\n    if (!this.viewerSwiping) return;\n    const touch = event.touches[0];\n    if (!touch) return;\n    const dy = touch.clientY - this.viewerStartY;\n    if (dy <= 0) {\n      viewer.style.transform = '';\n      viewer.style.opacity = '';\n      return;\n    }\n    event.preventDefault();\n    viewer.style.transition = 'none';\n    viewer.style.transform = `translateY(${dy}px)`;\n    viewer.style.opacity = String(Math.max(0.3, 1 - dy / (viewer.offsetHeight || 1)));\n  }\n\n  protected onViewerSwipeEnd(event: TouchEvent, viewer: HTMLElement): void {\n    if (!this.viewerSwiping) return;\n    this.viewerSwiping = false;\n    const touch = event.changedTouches[0];\n    const dy = touch ? touch.clientY - this.viewerStartY : 0;\n    if (dy > (viewer.offsetHeight || 0) * 0.2) {\n      this.onClose();\n    } else {\n      viewer.style.transition = '';\n      viewer.style.transform = '';\n      viewer.style.opacity = '';\n    }\n  }\n\n  /**\n   * The thumbnail has settled, one way or the other. A failure counts: `--loading`\n   * animates a shimmer AND sets `opacity: 0` on the image, so a broken `src` with no\n   * error path left an invisible box shimmering for ever instead of showing its alt\n   * text.\n   */\n  protected onSettled(): void {\n    this.loaded.set(true);\n  }\n\n  // Overlay\n\n  private openOverlay(): void {\n    if (this.overlayRef) return;\n\n    this.overlayRef = this.overlay.create({\n      hasBackdrop: true,\n      backdropClass: 'wr-lightbox-backdrop',\n      positionStrategy: this.overlay.position().global().centerHorizontally().centerVertically(),\n      scrollStrategy: this.overlay.scrollStrategies.block(),\n      panelClass: 'wr-lightbox-overlay',\n    });\n\n    // Centred on both axes, so no geometry rides on the direction — but the\n    // viewer's own chrome does. The ✕ is placed with `inset-inline-end` and the\n    // caption reads as prose, both against the `dir` the CDK froze at create, so\n    // a flip while the viewer is open leaves the button on the wrong corner.\n    wrFollowDirection(this.overlayRef, this.dir, this.injector);\n\n    const portal = new TemplatePortal(this.panelTpl(), this.vcr);\n    this.overlayRef.attach(portal);\n\n    // The viewer declares role=\"dialog\" + aria-modal=\"true\", which promises the\n    // rest of the page is inert. Without a focus trap that promise is a lie:\n    // Tab walks straight out of the viewer into the page behind the backdrop.\n    const active = document.activeElement;\n    this.previouslyFocused = active instanceof HTMLElement ? active : null;\n    this.focusTrap = this.focusTrapFactory.create(this.overlayRef.overlayElement);\n    void this.focusTrap.focusInitialElementWhenReady();\n\n    this.overlayRef\n      .backdropClick()\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(() => this.open.set(false));\n\n    this.overlayRef\n      .keydownEvents()\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(event => {\n        if (event.key === 'Escape') {\n          event.preventDefault();\n          this.open.set(false);\n        }\n      });\n  }\n\n  private closeOverlay(): void {\n    if (!this.overlayRef) return;\n    this.focusTrap?.destroy();\n    this.focusTrap = null;\n    const restore = this.previouslyFocused;\n    this.previouslyFocused = null;\n    this.overlayRef.dispose();\n    this.overlayRef = null;\n    // Send focus back where it came from, or it lands on <body> and the user\n    // has to tab from the top of the page again.\n    if (restore && typeof restore.focus === 'function') restore.focus();\n  }\n}\n","@if (disablePreview()) {\n  <img\n    class=\"wr-lightbox__thumb\"\n    [src]=\"preview() || src()\"\n    [alt]=\"alt()\"\n    (load)=\"onSettled()\"\n    (error)=\"onSettled()\"\n    loading=\"lazy\"\n    decoding=\"async\"\n  />\n} @else {\n  <!-- The trigger opens a modal dialog, and used to say so nowhere: no hint that it\n       opens anything, and nothing on the page tying it to the viewer it opened. -->\n  <button\n    type=\"button\"\n    class=\"wr-lightbox__trigger\"\n    aria-haspopup=\"dialog\"\n    [attr.aria-controls]=\"open() ? viewerId : null\"\n    [attr.aria-label]=\"resolvedOpenLabel()\"\n    (click)=\"onClick()\"\n  >\n    <img\n      class=\"wr-lightbox__thumb\"\n      [src]=\"preview() || src()\"\n      [alt]=\"alt()\"\n      (load)=\"onSettled()\"\n      (error)=\"onSettled()\"\n      loading=\"lazy\"\n      decoding=\"async\"\n    />\n  </button>\n}\n\n<ng-template #viewerTpl>\n  <div\n    #viewer\n    class=\"wr-lightbox-viewer\"\n    [id]=\"viewerId\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    [attr.aria-label]=\"resolvedViewerLabel()\"\n    (touchstart)=\"onViewerSwipeStart($event)\"\n    (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n    (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n    (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n  >\n    <button\n      type=\"button\"\n      class=\"wr-lightbox-viewer__close\"\n      [attr.aria-label]=\"resolvedCloseLabel()\"\n      (click)=\"onClose()\"\n      (keydown.enter)=\"onClose()\"\n      (keydown.space)=\"onClose()\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M18 6 6 18\" />\n        <path d=\"m6 6 12 12\" />\n      </svg>\n    </button>\n    <!--\n      Styled `cursor: zoom-out`, which is a promise: clicking the image closes. A\n      REDUNDANT mouse affordance — the close button, Escape, the backdrop and\n      swipe-down all do the same thing and all reach a keyboard — so the image stays\n      out of the tab order rather than becoming a second close stop.\n    -->\n    <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events,@angular-eslint/template/interactive-supports-focus -->\n    <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" (click)=\"onClose()\" />\n    @if (caption()) {\n      <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n    }\n  </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngwr-line-chart-testing.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-line-chart-testing.mjs","sources":["../../../projects/lib/line-chart/testing/wr-line-chart-harness.ts","../../../projects/lib/line-chart/testing/ngwr-line-chart-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 { WrLineChartHarnessFilters, WrLineChartTooltipRow } from './interfaces';\n\n/**\n * Test harness for `<wr-line-chart>`.\n *\n * **The lines are paths and the paths are not assertable.** A `d` attribute is a\n * rendering detail — it moves with the viewBox, the padding and the value range — so\n * this harness counts the lines and reads everything TEXTUAL instead: the legend, the\n * axis ticks, the x labels and the tooltip. Those are what a reader gets, and they\n * are what breaks when the data wiring does.\n *\n * **The tooltip cannot be opened from a spec, and the reason is worth knowing.** It\n * follows a `pointermove` over the plot, and the component turns the cursor's x into\n * an index by measuring the plot's box — which jsdom reports as 0×0, so every\n * synthetic move resolves to the same index or to none at all. There is deliberately\n * no `hoverAt()`; {@link getTooltipRows} reads the tooltip when something else has\n * opened it, which in practice means a browser-run harness.\n *\n * @example\n * ```ts\n * const chart = await loader.getHarness(WrLineChartHarness);\n *\n * expect(await chart.getSeriesLabels()).toEqual(['Revenue', 'Costs']);\n * expect(await chart.getLineCount()).toBe(2);\n * expect(await chart.getXLabels()).toEqual(['Jan', 'Feb', 'Mar']);\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrLineChartHarness extends ComponentHarness {\n  static hostSelector = 'wr-line-chart';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrLineChartHarnessFilters = {}): HarnessPredicate<WrLineChartHarness> {\n    return new HarnessPredicate(WrLineChartHarness, options)\n      .addOption('ariaLabel', options.ariaLabel, (harness, label) =>\n        HarnessPredicate.stringMatches(harness.getAccessibleName(), label)\n      )\n      .addOption('seriesLabel', options.seriesLabel, async (harness, label) => {\n        for (const series of await harness.getSeriesLabels()) {\n          if (await HarnessPredicate.stringMatches(series, label)) return true;\n        }\n        return false;\n      });\n  }\n\n  /** The plot's accessible name — the only name the drawing has. */\n  async getAccessibleName(): Promise<string | null> {\n    return (await this.locatorFor('.wr-line-chart__plot')()).getAttribute('aria-label');\n  }\n\n  /** Whether the legend is rendered (`showLegend`, and at least one series). */\n  async hasLegend(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-line-chart__legend')()) !== null;\n  }\n\n  /** The series names from the legend, in order. */\n  async getSeriesLabels(): Promise<string[]> {\n    const items = await this.locatorForAll('.wr-line-chart__legend-item')();\n    return Promise.all(items.map(item => item.text()));\n  }\n\n  /**\n   * How many lines were drawn.\n   *\n   * Worth comparing with {@link getSeriesLabels}: the legend and the paths come from\n   * the same list, so a mismatch is a series that got filtered out of one of them.\n   */\n  async getLineCount(): Promise<number> {\n    return (await this.locatorForAll('.wr-line-chart__line')()).length;\n  }\n\n  /** How many point dots were drawn across every series (`showDots`). */\n  async getDotCount(): Promise<number> {\n    return (await this.locatorForAll('.wr-line-chart__dot')()).length;\n  }\n\n  /** Whether the horizontal grid lines are drawn (`showGrid`). */\n  async hasGrid(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-line-chart__grid-line')()) !== null;\n  }\n\n  /** The y-axis tick labels, top to bottom as drawn. */\n  async getYTicks(): Promise<string[]> {\n    const ticks = await this.locatorForAll('.wr-line-chart__tick')();\n    return Promise.all(ticks.map(tick => tick.text()));\n  }\n\n  /** The x-axis labels under the plot, in order. */\n  async getXLabels(): Promise<string[]> {\n    const labels = await this.locatorForAll('.wr-line-chart__x-label')();\n    return Promise.all(labels.map(label => label.text()));\n  }\n\n  /** Whether the hover tooltip is showing. */\n  async hasTooltip(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-line-chart__tooltip')()) !== null;\n  }\n\n  /** The tooltip's heading — the x label of the hovered point — or `null` while it is closed. */\n  async getTooltipLabel(): Promise<string | null> {\n    const label = await this.locatorForOptional('.wr-line-chart__tooltip-label')();\n    return label ? label.text() : null;\n  }\n\n  /** The tooltip's rows, one per series, or `[]` while it is closed. */\n  async getTooltipRows(): Promise<WrLineChartTooltipRow[]> {\n    const names = await this.locatorForAll('.wr-line-chart__tooltip-name')();\n    const values = await this.locatorForAll('.wr-line-chart__tooltip-value')();\n\n    return Promise.all(\n      names.map(async (name, index) => ({\n        label: await name.text(),\n        value: (await values[index]?.text()) ?? '',\n      }))\n    );\n  }\n\n  /**\n   * The plot's height in pixels, read off the `style` ATTRIBUTE.\n   *\n   * NOT `getCssValue()`, which is `getComputedStyle()` — the same rule this\n   * file's class note already states and this method alone broke. A computed\n   * read answers from the LAID-OUT box, so it agrees with the inline value in\n   * jsdom (which lays nothing out and echoes the declaration) and disagrees in a\n   * browser, where sub-pixel rounding turns a declared 240 into 239.5. A harness\n   * that answers differently in the two places it runs is worse than one that\n   * refuses.\n   */\n  async getPlotHeight(): Promise<number> {\n    const style = await (await this.locatorFor('.wr-line-chart__plot')()).getAttribute('style');\n    const match = /height:\\s*([\\d.]+)px/.exec(style ?? '');\n    if (!match) {\n      throw new Error(\n        `WrLineChartHarness.getPlotHeight(): no inline height on .wr-line-chart__plot (style: \"${style ?? ''}\"). ` +\n          'The component writes one unconditionally, so its absence is the bug rather than a zero.'\n      );\n    }\n    return Number.parseFloat(match[1]);\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-line-chart-testing.mjs","sources":["../../../projects/lib/line-chart/testing/wr-line-chart-harness.ts","../../../projects/lib/line-chart/testing/ngwr-line-chart-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 { WrLineChartHarnessFilters, WrLineChartTooltipRow } from './interfaces';\n\n/**\n * Test harness for `<wr-line-chart>`.\n *\n * **The lines are paths and the paths are not assertable.** A `d` attribute is a\n * rendering detail — it moves with the viewBox, the padding and the value range — so\n * this harness counts the lines and reads everything TEXTUAL instead: the legend, the\n * axis ticks, the x labels and the tooltip. Those are what a reader gets, and they\n * are what breaks when the data wiring does.\n *\n * **The tooltip cannot be opened from a spec, and the reason is worth knowing.** It\n * follows a `pointermove` over the plot, and the component turns the cursor's x into\n * an index by measuring the plot's box — which jsdom reports as 0×0, so every\n * synthetic move resolves to the same index or to none at all. There is deliberately\n * no `hoverAt()`; {@link getTooltipRows} reads the tooltip when something else has\n * opened it, which in practice means a browser-run harness.\n *\n * @example\n * ```ts\n * const chart = await loader.getHarness(WrLineChartHarness);\n *\n * expect(await chart.getSeriesLabels()).toEqual(['Revenue', 'Costs']);\n * expect(await chart.getLineCount()).toBe(2);\n * expect(await chart.getXLabels()).toEqual(['Jan', 'Feb', 'Mar']);\n * ```\n *\n * @see https://ngwr.dev/guides/testing\n */\nexport class WrLineChartHarness extends ComponentHarness {\n  static hostSelector = 'wr-line-chart';\n\n  /** Build a predicate that narrows the query — pass to `getHarness` / `getAllHarnesses`. */\n  static with(options: WrLineChartHarnessFilters = {}): HarnessPredicate<WrLineChartHarness> {\n    return new HarnessPredicate(WrLineChartHarness, options)\n      .addOption('ariaLabel', options.ariaLabel, (harness, label) =>\n        HarnessPredicate.stringMatches(harness.getAccessibleName(), label)\n      )\n      .addOption('seriesLabel', options.seriesLabel, async (harness, label) => {\n        for (const series of await harness.getSeriesLabels()) {\n          if (await HarnessPredicate.stringMatches(series, label)) return true;\n        }\n        return false;\n      });\n  }\n\n  /** The plot's accessible name — the only name the drawing has. */\n  async getAccessibleName(): Promise<string | null> {\n    return (await this.locatorFor('.wr-line-chart__plot')()).getAttribute('aria-label');\n  }\n\n  /** Whether the legend is rendered (`showLegend`, and at least one series). */\n  async hasLegend(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-line-chart__legend')()) !== null;\n  }\n\n  /** The series names from the legend, in order. */\n  async getSeriesLabels(): Promise<string[]> {\n    const items = await this.locatorForAll('.wr-line-chart__legend-item')();\n    return Promise.all(items.map(item => item.text()));\n  }\n\n  /**\n   * How many lines were drawn.\n   *\n   * Worth comparing with {@link getSeriesLabels}: the legend and the paths come from\n   * the same list, so a mismatch is a series that got filtered out of one of them.\n   */\n  async getLineCount(): Promise<number> {\n    return (await this.locatorForAll('.wr-line-chart__line')()).length;\n  }\n\n  /** How many point dots were drawn across every series (`showDots`). */\n  async getDotCount(): Promise<number> {\n    return (await this.locatorForAll('.wr-line-chart__dot')()).length;\n  }\n\n  /** Whether the horizontal grid lines are drawn (`showGrid`). */\n  async hasGrid(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-line-chart__grid-line')()) !== null;\n  }\n\n  /** The y-axis tick labels, top to bottom as drawn. */\n  async getYTicks(): Promise<string[]> {\n    const ticks = await this.locatorForAll('.wr-line-chart__tick')();\n    return Promise.all(ticks.map(tick => tick.text()));\n  }\n\n  /** The x-axis labels under the plot, in order. */\n  async getXLabels(): Promise<string[]> {\n    const labels = await this.locatorForAll('.wr-line-chart__x-label')();\n    return Promise.all(labels.map(label => label.text()));\n  }\n\n  /** Whether the hover tooltip is showing. */\n  async hasTooltip(): Promise<boolean> {\n    return (await this.locatorForOptional('.wr-line-chart__tooltip')()) !== null;\n  }\n\n  /** The tooltip's heading — the x label of the hovered point — or `null` while it is closed. */\n  async getTooltipLabel(): Promise<string | null> {\n    const label = await this.locatorForOptional('.wr-line-chart__tooltip-label')();\n    return label ? label.text() : null;\n  }\n\n  /** The tooltip's rows, one per series, or `[]` while it is closed. */\n  async getTooltipRows(): Promise<WrLineChartTooltipRow[]> {\n    const names = await this.locatorForAll('.wr-line-chart__tooltip-name')();\n    const values = await this.locatorForAll('.wr-line-chart__tooltip-value')();\n\n    return Promise.all(\n      names.map(async (name, index) => ({\n        label: await name.text(),\n        value: (await values[index]?.text()) ?? '',\n      }))\n    );\n  }\n\n  /**\n   * The plot's height in pixels, read off the `style` ATTRIBUTE.\n   *\n   * NOT `getCssValue()`, which is `getComputedStyle()` — the same rule this\n   * file's class note already states and this method alone broke. A computed\n   * read answers from the LAID-OUT box, so it agrees with the inline value in\n   * jsdom (which lays nothing out and echoes the declaration) and disagrees in a\n   * browser, where sub-pixel rounding turns a declared 240 into 239.5. A harness\n   * that answers differently in the two places it runs is worse than one that\n   * refuses.\n   */\n  async getPlotHeight(): Promise<number> {\n    const style = await (await this.locatorFor('.wr-line-chart__plot')()).getAttribute('style');\n    const match = /height:\\s*([\\d.]+)px/.exec(style ?? '');\n    if (!match) {\n      throw new Error(\n        `WrLineChartHarness.getPlotHeight(): no inline height on .wr-line-chart__plot (style: \"${style ?? ''}\"). ` +\n          'The component writes one unconditionally, so its absence is the bug rather than a zero.'\n      );\n    }\n    return Number.parseFloat(match[1]);\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}