ngwr 6.0.0 → 7.0.0

package/fesm2022/ngwr-color-picker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngwr-color-picker.mjs","sources":["../../../projects/lib/color-picker/color/rgb-to-hsv.ts","../../../projects/lib/color-picker/color/hsv-to-rgb.ts","../../../projects/lib/color-picker/color/rgb-to-hsl.ts","../../../projects/lib/color-picker/color/hsl-to-rgb.ts","../../../projects/lib/color-picker/color/parse-hex.ts","../../../projects/lib/color-picker/color/to-hex.ts","../../../projects/lib/color-picker/color-picker.ts","../../../projects/lib/color-picker/color-picker.html","../../../projects/lib/color-picker/color-picker-trigger.ts","../../../projects/lib/color-picker/ngwr-color-picker.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 { WrHsv } from './wr-hsv';\nimport type { WrRgb } from './wr-rgb';\n\n/**\n * Convert sRGB to HSV. Preserves alpha.\n */\nexport function rgbToHsv(rgb: WrRgb): WrHsv {\n  const r = rgb.r / 255;\n  const g = rgb.g / 255;\n  const b = rgb.b / 255;\n  const max = Math.max(r, g, b);\n  const min = Math.min(r, g, b);\n  const d = max - min;\n\n  let h = 0;\n  if (d !== 0) {\n    if (max === r) h = ((g - b) / d) % 6;\n    else if (max === g) h = (b - r) / d + 2;\n    else h = (r - g) / d + 4;\n    h *= 60;\n    if (h < 0) h += 360;\n  }\n\n  const s = max === 0 ? 0 : d / max;\n  const v = max;\n\n  return { h, s, v, a: rgb.a };\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 type { WrHsv } from './wr-hsv';\nimport type { WrRgb } from './wr-rgb';\n\n/**\n * Convert HSV to sRGB. Preserves alpha. Returns integer channels in `[0, 255]`.\n */\nexport function hsvToRgb(hsv: WrHsv): WrRgb {\n  const { h, s, v } = hsv;\n  const c = v * s;\n  const x = c * (1 - Math.abs(((h / 60) % 2) - 1));\n  const m = v - c;\n\n  let r = 0;\n  let g = 0;\n  let b = 0;\n\n  if (h < 60) {\n    r = c;\n    g = x;\n  } else if (h < 120) {\n    r = x;\n    g = c;\n  } else if (h < 180) {\n    g = c;\n    b = x;\n  } else if (h < 240) {\n    g = x;\n    b = c;\n  } else if (h < 300) {\n    r = x;\n    b = c;\n  } else {\n    r = c;\n    b = x;\n  }\n\n  return {\n    r: Math.round((r + m) * 255),\n    g: Math.round((g + m) * 255),\n    b: Math.round((b + m) * 255),\n    a: hsv.a,\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 type { WrHsl } from './wr-hsl';\nimport type { WrRgb } from './wr-rgb';\n\n/**\n * Convert sRGB to HSL. Preserves alpha.\n */\nexport function rgbToHsl(rgb: WrRgb): WrHsl {\n  const r = rgb.r / 255;\n  const g = rgb.g / 255;\n  const b = rgb.b / 255;\n  const max = Math.max(r, g, b);\n  const min = Math.min(r, g, b);\n  const d = max - min;\n  const l = (max + min) / 2;\n\n  let h = 0;\n  let s = 0;\n\n  if (d !== 0) {\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n\n    if (max === r) h = (g - b) / d + (g < b ? 6 : 0);\n    else if (max === g) h = (b - r) / d + 2;\n    else h = (r - g) / d + 4;\n\n    h *= 60;\n  }\n\n  return { h, s, l, a: rgb.a };\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 type { WrHsl } from './wr-hsl';\nimport type { WrRgb } from './wr-rgb';\n\nfunction hueToChannel(p: number, q: number, t: number): number {\n  let x = t;\n  if (x < 0) x += 1;\n  if (x > 1) x -= 1;\n  if (x < 1 / 6) return p + (q - p) * 6 * x;\n  if (x < 1 / 2) return q;\n  if (x < 2 / 3) return p + (q - p) * (2 / 3 - x) * 6;\n  return p;\n}\n\n/**\n * Convert HSL to sRGB. Preserves alpha. Returns integer channels in `[0, 255]`.\n */\nexport function hslToRgb(hsl: WrHsl): WrRgb {\n  const h = hsl.h / 360;\n  const { s, l } = hsl;\n\n  let r: number;\n  let g: number;\n  let b: number;\n\n  if (s === 0) {\n    r = l;\n    g = l;\n    b = l;\n  } else {\n    const q = l < 0.5 ? l * (1 + s) : l + s - l * s;\n    const p = 2 * l - q;\n    r = hueToChannel(p, q, h + 1 / 3);\n    g = hueToChannel(p, q, h);\n    b = hueToChannel(p, q, h - 1 / 3);\n  }\n\n  return {\n    r: Math.round(r * 255),\n    g: Math.round(g * 255),\n    b: Math.round(b * 255),\n    a: hsl.a,\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 type { WrRgb } from './wr-rgb';\n\n/**\n * Parse a CSS hex colour into {@link WrRgb}. Accepts 3, 4, 6, or 8 digit\n * forms with or without a leading `#`. Returns `null` for anything that\n * isn't a valid hex string.\n *\n * @example\n * ```ts\n * parseHex('#f00');       // { r: 255, g: 0, b: 0, a: 1 }\n * parseHex('3969e2');     // { r: 57,  g: 105, b: 226, a: 1 }\n * parseHex('#3969e2ff');  // { r: 57,  g: 105, b: 226, a: 1 }\n * parseHex('nope');       // null\n * ```\n */\nexport function parseHex(input: string): WrRgb | null {\n  if (typeof input !== 'string') return null;\n\n  let str = input.trim().replace(/^#/, '').toLowerCase();\n\n  // Expand shorthand: rgb → rrggbb, rgba → rrggbbaa\n  if (str.length === 3 || str.length === 4) {\n    str = str\n      .split('')\n      .map(c => c + c)\n      .join('');\n  }\n\n  if (str.length !== 6 && str.length !== 8) return null;\n  if (!/^[0-9a-f]+$/.test(str)) return null;\n\n  const r = parseInt(str.slice(0, 2), 16);\n  const g = parseInt(str.slice(2, 4), 16);\n  const b = parseInt(str.slice(4, 6), 16);\n  const a = str.length === 8 ? parseInt(str.slice(6, 8), 16) / 255 : 1;\n\n  return { r, g, b, a };\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 type { WrRgb } from './wr-rgb';\n\nfunction channelToHex(n: number): string {\n  const clamped = Math.max(0, Math.min(255, Math.round(n)));\n  return clamped.toString(16).padStart(2, '0');\n}\n\n/**\n * Format a {@link WrRgb} as a CSS hex string with a leading `#`. When\n * `withAlpha` is `true` the result is 8 digits (`#rrggbbaa`); otherwise\n * 6 digits.\n *\n * @example\n * ```ts\n * toHex({ r: 57, g: 105, b: 226, a: 1 });         // '#3969e2'\n * toHex({ r: 57, g: 105, b: 226, a: 0.5 }, true); // '#3969e280'\n * ```\n */\nexport function toHex(rgb: WrRgb, withAlpha = false): string {\n  const r = channelToHex(rgb.r);\n  const g = channelToHex(rgb.g);\n  const b = channelToHex(rgb.b);\n  if (withAlpha) {\n    const a = channelToHex(rgb.a * 255);\n    return `#${r}${g}${b}${a}`;\n  }\n  return `#${r}${g}${b}`;\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 { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { DecimalPipe } from '@angular/common';\nimport { Component, ViewEncapsulation, computed, forwardRef, input, signal } from '@angular/core';\nimport { type ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nimport { WrSegmented, type WrSegmentedOption } from 'ngwr/segmented';\nimport { clamp, noop } from 'ngwr/utils';\n\nimport { hslToRgb, hsvToRgb, parseHex, rgbToHsl, rgbToHsv, toHex, type WrHsl, type WrRgb } from './color';\nimport type { WrColorFormat } from './interfaces';\n\ntype Tab = 'hex' | 'rgb' | 'hsl';\n\ntype Edges = 'sv' | 'hue' | 'alpha';\n\n/**\n * Inline colour picker — HSV canvas, hue slider, optional alpha slider, HEX\n * input. Implements `ControlValueAccessor`, so it binds with `[(ngModel)]`,\n * `[formControl]`, or `formControlName`. Output is always a string in the\n * format chosen via `[format]`.\n *\n * @example\n * ```html\n * <wr-color-picker [(ngModel)]=\"brandColor\" />\n * <wr-color-picker [(ngModel)]=\"brandColor\" [alpha]=\"false\" />\n * ```\n *\n * @see https://ngwr.dev/components/color-picker\n */\n@Component({\n  selector: 'wr-color-picker',\n  templateUrl: './color-picker.html',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'classes()',\n    '[style.--wr-color-picker-hue]': 'hueCss()',\n    '[style.--wr-color-picker-rgb]': 'rgbCss()',\n  },\n  imports: [DecimalPipe, WrSegmented],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      // eslint-disable-next-line @angular-eslint/no-forward-ref\n      useExisting: forwardRef(() => WrColorPicker),\n      multi: true,\n    },\n  ],\n})\nexport class WrColorPicker implements ControlValueAccessor {\n  /** Render the alpha slider and emit 8-digit hex / `rgba()`. @default true */\n  readonly alpha = input(true, { transform: coerceBooleanProperty });\n\n  /** Disable interaction. @default false */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** Output format produced through the CVA. @default 'hex' */\n  readonly format = input<WrColorFormat>('hex');\n\n  /** Preset hex colours rendered as a clickable row beneath the inputs. Empty = no row. @default [] */\n  readonly swatches = input<readonly string[]>([]);\n\n  // Source of truth: HSV + alpha\n\n  protected readonly h = signal(0);\n  protected readonly s = signal(0);\n  protected readonly v = signal(0);\n  protected readonly a = signal(1);\n\n  private readonly disabledFromCva = signal(false);\n\n  protected readonly effectiveDisabled = computed(() => this.disabled() || this.disabledFromCva());\n\n  // Derived values\n\n  /** RGB view of the current colour, computed lazily. */\n  protected readonly rgb = computed<WrRgb>(() => hsvToRgb({ h: this.h(), s: this.s(), v: this.v(), a: this.a() }));\n\n  /** Canonical hex (used by the input field and by drag emits). */\n  protected readonly hex = computed(() => toHex(this.rgb(), this.alpha()));\n\n  /** SV canvas background colour (full-saturation hue). */\n  protected readonly hueCss = computed(() => `hsl(${this.h()}, 100%, 50%)`);\n\n  /** RGB string used for the alpha-slider gradient. */\n  protected readonly rgbCss = computed(() => {\n    const { r, g, b } = this.rgb();\n    return `${r}, ${g}, ${b}`;\n  });\n\n  /** Thumb positions in % for each surface. */\n  protected readonly svThumbX = computed(() => this.s() * 100);\n  protected readonly svThumbY = computed(() => (1 - this.v()) * 100);\n  protected readonly hueThumbX = computed(() => (this.h() / 360) * 100);\n  protected readonly alphaThumbX = computed(() => this.a() * 100);\n\n  /** Mirror of the canonical hex, edited by the user via the input field. */\n  protected readonly hexInput = signal('');\n\n  /** Active tab in the input switcher. */\n  protected readonly activeTab = signal<Tab>('hex');\n\n  /** HSL view of the current colour, computed lazily. */\n  protected readonly hslView = computed<WrHsl>(() => rgbToHsl(this.rgb()));\n\n  /** Alpha as integer percent for display in numeric tabs. */\n  protected readonly alphaPercent = computed(() => Math.round(this.a() * 100));\n\n  protected readonly tabOptions: readonly WrSegmentedOption<Tab>[] = [\n    { value: 'hex', label: 'HEX' },\n    { value: 'rgb', label: 'RGB' },\n    { value: 'hsl', label: 'HSL' },\n  ];\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-color-picker'];\n    if (this.alpha()) parts.push('wr-color-picker--alpha');\n    if (this.effectiveDisabled()) parts.push('wr-color-picker--disabled');\n    return parts.join(' ');\n  });\n\n  // ControlValueAccessor\n\n  private onChange: (value: string) => void = noop;\n  private onTouched: () => void = noop;\n\n  writeValue(value: string | null): void {\n    const rgb = parseHex(value ?? '') ?? { r: 0, g: 0, b: 0, a: 1 };\n    const hsv = rgbToHsv(rgb);\n    this.h.set(hsv.h);\n    this.s.set(hsv.s);\n    this.v.set(hsv.v);\n    this.a.set(hsv.a);\n    this.hexInput.set(this.hex());\n  }\n\n  registerOnChange(fn: (value: string) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabledFromCva.set(coerceBooleanProperty(isDisabled));\n  }\n\n  // Drag handlers\n\n  protected onPointerDown(event: PointerEvent, surface: Edges): void {\n    if (this.effectiveDisabled()) return;\n    event.preventDefault();\n    const target = event.currentTarget as HTMLElement;\n    target.setPointerCapture(event.pointerId);\n\n    const update = (e: PointerEvent): void => this.updateFromEvent(e, target, surface);\n    const cleanup = (e: PointerEvent): void => {\n      target.releasePointerCapture(e.pointerId);\n      target.removeEventListener('pointermove', update);\n      target.removeEventListener('pointerup', cleanup);\n      this.onTouched();\n    };\n\n    target.addEventListener('pointermove', update);\n    target.addEventListener('pointerup', cleanup);\n    this.updateFromEvent(event, target, surface);\n  }\n\n  private updateFromEvent(event: PointerEvent, target: HTMLElement, surface: Edges): void {\n    const rect = target.getBoundingClientRect();\n    const x = clamp((event.clientX - rect.left) / rect.width, 0, 1);\n\n    if (surface === 'sv') {\n      const y = clamp((event.clientY - rect.top) / rect.height, 0, 1);\n      this.s.set(x);\n      this.v.set(1 - y);\n    } else if (surface === 'hue') {\n      this.h.set(x * 360);\n    } else {\n      this.a.set(x);\n    }\n    this.emit();\n  }\n\n  // Hex input handlers\n\n  protected onHexInput(event: Event): void {\n    const raw = (event.target as HTMLInputElement).value;\n    this.hexInput.set(raw);\n    const rgb = parseHex(raw);\n    if (!rgb) return;\n    const hsv = rgbToHsv(rgb);\n    this.h.set(hsv.h);\n    this.s.set(hsv.s);\n    this.v.set(hsv.v);\n    this.a.set(hsv.a);\n    this.emitWithoutHexSync();\n  }\n\n  protected onHexBlur(): void {\n    // Re-sync the input with the canonical value (in case the user typed invalid).\n    this.hexInput.set(this.hex());\n    this.onTouched();\n  }\n\n  // Emission\n\n  private emit(): void {\n    this.emitWithoutHexSync();\n    this.hexInput.set(this.hex());\n  }\n\n  private emitWithoutHexSync(): void {\n    this.onChange(this.hex());\n  }\n\n  // Tab + channel handlers\n\n  protected onTabChange(tab: Tab | null): void {\n    if (tab) this.activeTab.set(tab);\n  }\n\n  protected onRgbChannel(channel: 'r' | 'g' | 'b', event: Event): void {\n    const n = clamp(Number((event.target as HTMLInputElement).value), 0, 255);\n    if (Number.isNaN(n)) return;\n    const current = this.rgb();\n    const next: WrRgb = { ...current, [channel]: n };\n    this.applyRgb(next);\n  }\n\n  protected onHslChannel(channel: 'h' | 's' | 'l', event: Event): void {\n    const n = Number((event.target as HTMLInputElement).value);\n    if (Number.isNaN(n)) return;\n    const current = this.hslView();\n    const next: WrHsl =\n      channel === 'h' ? { ...current, h: clamp(n, 0, 360) } : { ...current, [channel]: clamp(n, 0, 100) / 100 };\n    this.applyRgb(hslToRgb(next));\n  }\n\n  protected onAlphaPercent(event: Event): void {\n    const n = clamp(Number((event.target as HTMLInputElement).value), 0, 100);\n    if (Number.isNaN(n)) return;\n    this.a.set(n / 100);\n    this.emit();\n  }\n\n  protected onSwatchClick(hex: string): void {\n    if (this.effectiveDisabled()) return;\n    const rgb = parseHex(hex);\n    if (!rgb) return;\n    this.applyRgb(rgb);\n  }\n\n  /** Push an RGB triple into the HSV source of truth (preserving the current alpha if the swap removes it). */\n  private applyRgb(rgb: WrRgb): void {\n    const hsv = rgbToHsv(rgb);\n    this.h.set(hsv.h);\n    this.s.set(hsv.s);\n    this.v.set(hsv.v);\n    this.a.set(hsv.a);\n    this.emit();\n  }\n}\n","<div class=\"wr-color-picker__sv\" (pointerdown)=\"onPointerDown($event, 'sv')\">\n  <span class=\"wr-color-picker__thumb\" [style.left.%]=\"svThumbX()\" [style.top.%]=\"svThumbY()\"></span>\n</div>\n\n<div class=\"wr-color-picker__slider wr-color-picker__slider--hue\" (pointerdown)=\"onPointerDown($event, 'hue')\">\n  <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.left.%]=\"hueThumbX()\"></span>\n</div>\n\n@if (alpha()) {\n  <div class=\"wr-color-picker__slider wr-color-picker__slider--alpha\" (pointerdown)=\"onPointerDown($event, 'alpha')\">\n    <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.left.%]=\"alphaThumbX()\"></span>\n  </div>\n}\n\n<div class=\"wr-color-picker__chrome\">\n  <span class=\"wr-color-picker__preview\" [style.background]=\"hex()\"></span>\n  <wr-segmented\n    class=\"wr-color-picker__tabs\"\n    [options]=\"tabOptions\"\n    [value]=\"activeTab()\"\n    (valueChange)=\"onTabChange($event)\"\n  />\n</div>\n\n@switch (activeTab()) {\n  @case ('hex') {\n    <div class=\"wr-color-picker__inputs wr-color-picker__inputs--hex\">\n      <label class=\"wr-color-picker__field wr-color-picker__field--wide\">\n        <input\n          type=\"text\"\n          spellcheck=\"false\"\n          autocomplete=\"off\"\n          [value]=\"hexInput()\"\n          [disabled]=\"effectiveDisabled()\"\n          (input)=\"onHexInput($event)\"\n          (blur)=\"onHexBlur()\"\n        />\n        <span class=\"wr-color-picker__field-label\">HEX</span>\n      </label>\n    </div>\n  }\n  @case ('rgb') {\n    <div class=\"wr-color-picker__inputs\">\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"255\"\n          [value]=\"rgb().r\"\n          [disabled]=\"effectiveDisabled()\"\n          (input)=\"onRgbChannel('r', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">R</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"255\"\n          [value]=\"rgb().g\"\n          [disabled]=\"effectiveDisabled()\"\n          (input)=\"onRgbChannel('g', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">G</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"255\"\n          [value]=\"rgb().b\"\n          [disabled]=\"effectiveDisabled()\"\n          (input)=\"onRgbChannel('b', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">B</span>\n      </label>\n      @if (alpha()) {\n        <label class=\"wr-color-picker__field\">\n          <input\n            type=\"number\"\n            min=\"0\"\n            max=\"100\"\n            [value]=\"alphaPercent()\"\n            [disabled]=\"effectiveDisabled()\"\n            (input)=\"onAlphaPercent($event)\"\n          />\n          <span class=\"wr-color-picker__field-label\">A%</span>\n        </label>\n      }\n    </div>\n  }\n  @case ('hsl') {\n    <div class=\"wr-color-picker__inputs\">\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"360\"\n          [value]=\"hslView().h | number: '1.0-0'\"\n          [disabled]=\"effectiveDisabled()\"\n          (input)=\"onHslChannel('h', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">H</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"100\"\n          [value]=\"hslView().s * 100 | number: '1.0-0'\"\n          [disabled]=\"effectiveDisabled()\"\n          (input)=\"onHslChannel('s', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">S%</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"100\"\n          [value]=\"hslView().l * 100 | number: '1.0-0'\"\n          [disabled]=\"effectiveDisabled()\"\n          (input)=\"onHslChannel('l', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">L%</span>\n      </label>\n      @if (alpha()) {\n        <label class=\"wr-color-picker__field\">\n          <input\n            type=\"number\"\n            min=\"0\"\n            max=\"100\"\n            [value]=\"alphaPercent()\"\n            [disabled]=\"effectiveDisabled()\"\n            (input)=\"onAlphaPercent($event)\"\n          />\n          <span class=\"wr-color-picker__field-label\">A%</span>\n        </label>\n      }\n    </div>\n  }\n}\n\n@if (swatches().length > 0) {\n  <div class=\"wr-color-picker__swatches\">\n    @for (color of swatches(); track color) {\n      <button\n        type=\"button\"\n        class=\"wr-color-picker__swatch\"\n        [style.background]=\"color\"\n        [attr.aria-label]=\"color\"\n        [disabled]=\"effectiveDisabled()\"\n        (click)=\"onSwatchClick(color)\"\n      ></button>\n    }\n  </div>\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 { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { type OverlayRef, ScrollStrategyOptions } from '@angular/cdk/overlay';\nimport { ComponentPortal } from '@angular/cdk/portal';\nimport {\n  DestroyRef,\n  Directive,\n  ElementRef,\n  ViewContainerRef,\n  inject,\n  input,\n  model,\n  output,\n  signal,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { WR_OVERLAY } from 'ngwr/overlay';\n\nimport { WrColorPicker } from './color-picker';\nimport type { WrColorFormat } from './interfaces';\n\n/**\n * Opens a `<wr-color-picker>` in an overlay anchored to the host element.\n *\n * Apply to any clickable element (typically a button). Two-way binds the\n * current colour through `[(value)]`; forwards `alpha` / `format` /\n * `swatches` / `disabled` to the inner picker.\n *\n * Same overlay isolation as the rest of the lib — uses {@link WR_OVERLAY},\n * not CDK's root container.\n *\n * @example\n * ```html\n * <button wrColorPickerTrigger\n *         [(value)]=\"brandColor\"\n *         [swatches]=\"palette\">\n *   <span class=\"swatch\" [style.background]=\"brandColor\"></span>\n *   {{ brandColor }}\n * </button>\n * ```\n *\n * @see https://ngwr.dev/components/color-picker\n */\n@Directive({\n  selector: '[wrColorPickerTrigger]',\n  host: { '(click)': 'toggle()' },\n})\nexport class WrColorPickerTrigger {\n  /** Two-way bindable colour value (hex string). */\n  readonly value = model<string>('');\n\n  /** Forwarded to the inner picker. @default true */\n  readonly alpha = input(true, { transform: coerceBooleanProperty });\n\n  /** Forwarded to the inner picker. @default 'hex' */\n  readonly format = input<WrColorFormat>('hex');\n\n  /** Forwarded to the inner picker. @default [] */\n  readonly swatches = input<readonly string[]>([]);\n\n  /** Disable the trigger entirely. @default false */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** Fires after the picker opens. */\n  readonly opened = output<void>();\n\n  /** Fires after the picker closes. */\n  readonly closed = output<void>();\n\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\n  private readonly overlay = inject(WR_OVERLAY);\n  private readonly vcr = inject(ViewContainerRef);\n  private readonly scrollStrategies = inject(ScrollStrategyOptions);\n  private readonly destroyRef = inject(DestroyRef);\n\n  private readonly isOpen = signal(false);\n  private overlayRef: OverlayRef | null = null;\n\n  constructor() {\n    this.destroyRef.onDestroy(() => this.dispose());\n  }\n\n  /** Toggle the picker. Open if closed, close if open. */\n  toggle(): void {\n    if (this.disabled()) return;\n    if (this.isOpen()) {\n      this.close();\n    } else {\n      this.open();\n    }\n  }\n\n  /** Open the picker. No-op if already open. */\n  open(): void {\n    if (this.isOpen() || this.disabled()) return;\n\n    const positionStrategy = this.overlay\n      .position()\n      .flexibleConnectedTo(this.host)\n      .withPositions([\n        { originX: 'start', originY: 'bottom', overlayX: 'start', overlayY: 'top', offsetY: 4 },\n        { originX: 'start', originY: 'top', overlayX: 'start', overlayY: 'bottom', offsetY: -4 },\n        { originX: 'end', originY: 'bottom', overlayX: 'end', overlayY: 'top', offsetY: 4 },\n        { originX: 'end', originY: 'top', overlayX: 'end', overlayY: 'bottom', offsetY: -4 },\n      ])\n      .withPush(true);\n\n    this.overlayRef = this.overlay.create({\n      positionStrategy,\n      scrollStrategy: this.scrollStrategies.reposition(),\n      panelClass: 'wr-color-picker-overlay',\n    });\n\n    const portal = new ComponentPortal(WrColorPicker, this.vcr);\n    const ref = this.overlayRef.attach(portal);\n\n    ref.setInput('alpha', this.alpha());\n    ref.setInput('format', this.format());\n    ref.setInput('swatches', this.swatches());\n    ref.setInput('disabled', this.disabled());\n    ref.instance.writeValue(this.value());\n\n    // Bridge inner picker's CVA onChange to our two-way [(value)] model.\n    ref.instance.registerOnChange((next: string) => this.value.set(next));\n\n    // Outside-click → close (CDK's outsidePointerEvents only fires for clicks\n    // outside the overlay pane; we also need to ignore re-clicks on the host).\n    this.overlayRef\n      .outsidePointerEvents()\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(event => {\n        if (this.host.nativeElement.contains(event.target as Node)) return;\n        this.close();\n      });\n\n    // Escape → close.\n    this.overlayRef\n      .keydownEvents()\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(event => {\n        if (event.key === 'Escape') {\n          event.preventDefault();\n          this.close();\n        }\n      });\n\n    this.isOpen.set(true);\n    this.opened.emit();\n  }\n\n  /** Close the picker. No-op if already closed. */\n  close(): void {\n    if (!this.isOpen()) return;\n    this.dispose();\n    this.isOpen.set(false);\n    this.closed.emit();\n  }\n\n  private dispose(): void {\n    if (this.overlayRef) {\n      this.overlayRef.dispose();\n      this.overlayRef = null;\n    }\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-command-palette.mjs

@@ -0,0 +1,259 @@
+import { ConfigurableFocusTrapFactory } from '@angular/cdk/a11y';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import { isPlatformBrowser } from '@angular/common';
+import * as i0 from '@angular/core';
+import { input, model, output, signal, viewChild, computed, inject, DestroyRef, PLATFORM_ID, effect, afterNextRender, ViewEncapsulation, Component } from '@angular/core';
+import { WrHotkey } from 'ngwr/hotkey';
+import { useI18nText } from 'ngwr/i18n';
+import { WrIcon } from 'ngwr/icon';
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+let listboxUid = 0;
+function bucketize(items) {
+    const map = new Map();
+    for (const item of items) {
+        const key = item.group ?? null;
+        const bucket = map.get(key);
+        if (bucket)
+            bucket.push(item);
+        else
+            map.set(key, [item]);
+    }
+    return [...map.entries()].map(([title, items]) => ({ title, items }));
+}
+function matches(item, query) {
+    if (!query)
+        return true;
+    const q = query.toLowerCase();
+    if (item.label.toLowerCase().includes(q))
+        return true;
+    if (item.description?.toLowerCase().includes(q))
+        return true;
+    if (item.group?.toLowerCase().includes(q))
+        return true;
+    if (item.keywords?.some(k => k.toLowerCase().includes(q)))
+        return true;
+    return false;
+}
+/**
+ * `⌘K`-style command palette — a centred modal with a search input and
+ * filtered list of actions. Items can be grouped, have icons, descriptions,
+ * and visual shortcut hints.
+ *
+ * Drop one at the root of the app, pass it the list of commands, and bind
+ * a global hotkey (default `'mod+k'`). Use `[(open)]` for controlled
+ * visibility, or let it manage itself.
+ *
+ * @example
+ * ```html
+ * <wr-command-palette [items]="commands" trigger="mod+k" (picked)="onPicked($event)" />
+ * ```
+ *
+ * @see https://ngwr.dev/components/command-palette
+ */
+class WrCommandPalette {
+    /** Items shown in the palette. */
+    items = input([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    /** Controlled open state (two-way bindable). @default false */
+    open = model(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    /** Global hotkey that opens the palette. `null` disables auto-binding. @default 'mod+k' */
+    trigger = input('mod+k', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "trigger" }] : /* istanbul ignore next */ []));
+    /** Search input placeholder. Falls back to `commandPalette.placeholder`. */
+    placeholder = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Text shown when no items match. Falls back to `commandPalette.noResults`. */
+    emptyText = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "emptyText" }] : /* istanbul ignore next */ []));
+    resolvedPlaceholder = useI18nText(this.placeholder, 'commandPalette.placeholder', 'Type a command or search…');
+    resolvedEmpty = useI18nText(this.emptyText, 'commandPalette.noResults', 'No results');
+    /** Auto-close on `(picked)`. Set false to keep open. @default true */
+    closeOnPick = input(true, { ...(ngDevMode ? { debugName: "closeOnPick" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Fires when the user commits an item (Enter / click). */
+    picked = output();
+    query = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "query" }] : /* istanbul ignore next */ []));
+    activeIndex = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []));
+    inputEl = viewChild('input', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "inputEl" }] : /* istanbul ignore next */ []));
+    panelEl = viewChild('panel', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "panelEl" }] : /* istanbul ignore next */ []));
+    /** Listbox id (referenced by the input's `aria-controls`). */
+    listboxId = `wr-command-palette-listbox-${++listboxUid}`;
+    /** @internal Build a stable option id for a given flat index. */
+    optionId(i) {
+        return `${this.listboxId}-opt-${i}`;
+    }
+    /** Id of the active option for `aria-activedescendant`. */
+    activeOptionId = computed(() => {
+        const i = this.activeIndex();
+        return i >= 0 && i < this.filtered().length ? this.optionId(i) : null;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeOptionId" }] : /* istanbul ignore next */ []));
+    hotkeys = inject(WrHotkey);
+    destroyRef = inject(DestroyRef);
+    focusTrapFactory = inject(ConfigurableFocusTrapFactory);
+    isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
+    bindingHandle = null;
+    focusTrap = null;
+    previouslyFocused = null;
+    /** Flat filtered list — what keyboard navigation walks. */
+    filtered = computed(() => this.items().filter(item => matches(item, this.query())), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "filtered" }] : /* istanbul ignore next */ []));
+    /** Grouped view — what the template renders. */
+    buckets = computed(() => bucketize(this.filtered()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "buckets" }] : /* istanbul ignore next */ []));
+    constructor() {
+        // Bind / re-bind the global trigger whenever the spec changes.
+        effect(() => {
+            this.bindingHandle?.unbind();
+            const spec = this.trigger();
+            if (!spec)
+                return;
+            this.bindingHandle = this.hotkeys.bind(spec, () => this.open.update(v => !v), { allowInInput: true });
+        });
+        // Reset query + active index whenever we open; focus the input.
+        effect(() => {
+            if (!this.open())
+                return;
+            this.query.set('');
+            this.activeIndex.set(0);
+        });
+        // Focus trap + restore.
+        effect(() => {
+            if (!this.isBrowser)
+                return;
+            if (this.open()) {
+                const active = document.activeElement;
+                this.previouslyFocused = active instanceof HTMLElement ? active : null;
+                queueMicrotask(() => {
+                    const host = this.panelEl()?.nativeElement;
+                    if (!host)
+                        return;
+                    this.focusTrap?.destroy();
+                    this.focusTrap = this.focusTrapFactory.create(host);
+                    void this.focusTrap.focusInitialElementWhenReady();
+                });
+            }
+            else {
+                this.focusTrap?.destroy();
+                this.focusTrap = null;
+                const restore = this.previouslyFocused;
+                this.previouslyFocused = null;
+                if (restore && typeof restore.focus === 'function')
+                    restore.focus();
+            }
+        });
+        afterNextRender(() => {
+            if (this.open())
+                this.inputEl()?.nativeElement.focus();
+        });
+        // Auto-focus the input when opened.
+        effect(() => {
+            if (!this.open())
+                return;
+            queueMicrotask(() => this.inputEl()?.nativeElement.focus());
+        });
+        // Clamp the active index when the filtered list shrinks.
+        effect(() => {
+            const max = Math.max(0, this.filtered().length - 1);
+            if (this.activeIndex() > max)
+                this.activeIndex.set(max);
+        });
+        this.destroyRef.onDestroy(() => this.bindingHandle?.unbind());
+    }
+    // Template handlers
+    onQueryInput(event) {
+        this.query.set(event.target.value);
+        this.activeIndex.set(0);
+    }
+    onKeydown(event) {
+        const list = this.filtered();
+        switch (event.key) {
+            case 'ArrowDown':
+                event.preventDefault();
+                if (list.length > 0)
+                    this.activeIndex.set((this.activeIndex() + 1) % list.length);
+                break;
+            case 'ArrowUp':
+                event.preventDefault();
+                if (list.length > 0)
+                    this.activeIndex.set((this.activeIndex() - 1 + list.length) % list.length);
+                break;
+            case 'Home':
+                event.preventDefault();
+                this.activeIndex.set(0);
+                break;
+            case 'End':
+                event.preventDefault();
+                this.activeIndex.set(Math.max(0, list.length - 1));
+                break;
+            case 'Enter': {
+                event.preventDefault();
+                const item = list[this.activeIndex()];
+                if (item)
+                    this.commit(item);
+                break;
+            }
+            case 'Escape':
+                event.preventDefault();
+                this.close();
+                break;
+            default:
+                break;
+        }
+    }
+    onBackdropClick() {
+        this.close();
+    }
+    onItemClick(item, event) {
+        event.preventDefault();
+        this.commit(item);
+    }
+    onItemHover(item) {
+        const i = this.filtered().indexOf(item);
+        if (i >= 0)
+            this.activeIndex.set(i);
+    }
+    /** Flat index of an item within the filtered list — for highlight checks. */
+    indexOf(item) {
+        return this.filtered().indexOf(item);
+    }
+    // Public API
+    /** Open the palette. */
+    show() {
+        this.open.set(true);
+    }
+    /** Close the palette. */
+    close() {
+        this.open.set(false);
+    }
+    // Internals
+    commit(item) {
+        item.action?.();
+        this.picked.emit(item);
+        if (this.closeOnPick())
+            this.close();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCommandPalette, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCommandPalette, isStandalone: true, selector: "wr-command-palette", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, closeOnPick: { classPropertyName: "closeOnPick", publicName: "closeOnPick", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", picked: "picked" }, viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, isSignal: true }, { propertyName: "panelEl", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (open()) {\n  <div class=\"wr-command-palette\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Command palette\">\n    <!-- Backdrop captures clicks to close. Not focusable \u2014 keyboard users use\n         Esc on the panel below. -->\n\n    <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n    <!-- Keydown is delegated from the search input; tabindex enables Esc when\n         the input is unfocused. -->\n    <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n      <div class=\"wr-command-palette__search\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n          <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n          <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n        </svg>\n        <input\n          #input\n          type=\"text\"\n          role=\"combobox\"\n          autocomplete=\"off\"\n          spellcheck=\"false\"\n          aria-autocomplete=\"list\"\n          [attr.aria-controls]=\"listboxId\"\n          [attr.aria-expanded]=\"true\"\n          [attr.aria-activedescendant]=\"activeOptionId() || null\"\n          [placeholder]=\"resolvedPlaceholder()\"\n          [value]=\"query()\"\n          (input)=\"onQueryInput($event)\"\n        />\n        <kbd class=\"wr-command-palette__hint\">esc</kbd>\n      </div>\n\n      <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n        @if (filtered().length === 0) {\n          <div class=\"wr-command-palette__empty\">{{ resolvedEmpty() }}</div>\n        } @else {\n          @for (bucket of buckets(); track bucket.title) {\n            <div class=\"wr-command-palette__group\">\n              @if (bucket.title) {\n                <div class=\"wr-command-palette__group-title\">{{ bucket.title }}</div>\n              }\n              @for (item of bucket.items; track item.id) {\n                <div\n                  class=\"wr-command-palette__option\"\n                  role=\"option\"\n                  [attr.id]=\"optionId(indexOf(item))\"\n                  [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n                  [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n                  (mouseenter)=\"onItemHover(item)\"\n                  (mousedown)=\"onItemClick(item, $event)\"\n                >\n                  @if (item.icon) {\n                    <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n                  } @else {\n                    <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n                  }\n                  <div class=\"wr-command-palette__option-body\">\n                    <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n                    @if (item.description) {\n                      <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n                    }\n                  </div>\n                  @if (item.shortcut) {\n                    <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n                  }\n                </div>\n              }\n            </div>\n          }\n        }\n      </div>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCommandPalette, decorators: [{
+            type: Component,
+            args: [{ selector: 'wr-command-palette', encapsulation: ViewEncapsulation.None, imports: [WrIcon], template: "@if (open()) {\n  <div class=\"wr-command-palette\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Command palette\">\n    <!-- Backdrop captures clicks to close. Not focusable \u2014 keyboard users use\n         Esc on the panel below. -->\n\n    <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n    <!-- Keydown is delegated from the search input; tabindex enables Esc when\n         the input is unfocused. -->\n    <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n      <div class=\"wr-command-palette__search\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n          <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n          <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n        </svg>\n        <input\n          #input\n          type=\"text\"\n          role=\"combobox\"\n          autocomplete=\"off\"\n          spellcheck=\"false\"\n          aria-autocomplete=\"list\"\n          [attr.aria-controls]=\"listboxId\"\n          [attr.aria-expanded]=\"true\"\n          [attr.aria-activedescendant]=\"activeOptionId() || null\"\n          [placeholder]=\"resolvedPlaceholder()\"\n          [value]=\"query()\"\n          (input)=\"onQueryInput($event)\"\n        />\n        <kbd class=\"wr-command-palette__hint\">esc</kbd>\n      </div>\n\n      <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n        @if (filtered().length === 0) {\n          <div class=\"wr-command-palette__empty\">{{ resolvedEmpty() }}</div>\n        } @else {\n          @for (bucket of buckets(); track bucket.title) {\n            <div class=\"wr-command-palette__group\">\n              @if (bucket.title) {\n                <div class=\"wr-command-palette__group-title\">{{ bucket.title }}</div>\n              }\n              @for (item of bucket.items; track item.id) {\n                <div\n                  class=\"wr-command-palette__option\"\n                  role=\"option\"\n                  [attr.id]=\"optionId(indexOf(item))\"\n                  [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n                  [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n                  (mouseenter)=\"onItemHover(item)\"\n                  (mousedown)=\"onItemClick(item, $event)\"\n                >\n                  @if (item.icon) {\n                    <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n                  } @else {\n                    <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n                  }\n                  <div class=\"wr-command-palette__option-body\">\n                    <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n                    @if (item.description) {\n                      <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n                    }\n                  </div>\n                  @if (item.shortcut) {\n                    <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n                  }\n                </div>\n              }\n            </div>\n          }\n        }\n      </div>\n    </div>\n  </div>\n}\n" }]
+        }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], closeOnPick: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnPick", required: false }] }], picked: [{ type: i0.Output, args: ["picked"] }], inputEl: [{ type: i0.ViewChild, args: ['input', { isSignal: true }] }], panelEl: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { WrCommandPalette };
+//# sourceMappingURL=ngwr-command-palette.mjs.map

package/fesm2022/ngwr-command-palette.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngwr-command-palette.mjs","sources":["../../../projects/lib/command-palette/command-palette.ts","../../../projects/lib/command-palette/command-palette.html","../../../projects/lib/command-palette/ngwr-command-palette.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 { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { isPlatformBrowser } from '@angular/common';\nimport {\n  Component,\n  DestroyRef,\n  type ElementRef,\n  PLATFORM_ID,\n  ViewEncapsulation,\n  afterNextRender,\n  computed,\n  effect,\n  inject,\n  input,\n  model,\n  output,\n  signal,\n  viewChild,\n} from '@angular/core';\n\nimport { WrHotkey, type WrHotkeyHandle, type WrHotkeySpec } from 'ngwr/hotkey';\nimport { useI18nText } from 'ngwr/i18n';\nimport { WrIcon } from 'ngwr/icon';\n\nimport type { WrCommandItem } from './interfaces';\n\ninterface Bucket {\n  readonly title: string | null;\n  readonly items: readonly WrCommandItem[];\n}\n\nlet listboxUid = 0;\n\nfunction bucketize(items: readonly WrCommandItem[]): readonly Bucket[] {\n  const map = new Map<string | null, WrCommandItem[]>();\n  for (const item of items) {\n    const key = item.group ?? null;\n    const bucket = map.get(key);\n    if (bucket) bucket.push(item);\n    else map.set(key, [item]);\n  }\n  return [...map.entries()].map(([title, items]) => ({ title, items }));\n}\n\nfunction matches(item: WrCommandItem, query: string): boolean {\n  if (!query) return true;\n  const q = query.toLowerCase();\n  if (item.label.toLowerCase().includes(q)) return true;\n  if (item.description?.toLowerCase().includes(q)) return true;\n  if (item.group?.toLowerCase().includes(q)) return true;\n  if (item.keywords?.some(k => k.toLowerCase().includes(q))) return true;\n  return false;\n}\n\n/**\n * `⌘K`-style command palette — a centred modal with a search input and\n * filtered list of actions. Items can be grouped, have icons, descriptions,\n * and visual shortcut hints.\n *\n * Drop one at the root of the app, pass it the list of commands, and bind\n * a global hotkey (default `'mod+k'`). Use `[(open)]` for controlled\n * visibility, or let it manage itself.\n *\n * @example\n * ```html\n * <wr-command-palette [items]=\"commands\" trigger=\"mod+k\" (picked)=\"onPicked($event)\" />\n * ```\n *\n * @see https://ngwr.dev/components/command-palette\n */\n@Component({\n  selector: 'wr-command-palette',\n  templateUrl: './command-palette.html',\n  encapsulation: ViewEncapsulation.None,\n  imports: [WrIcon],\n})\nexport class WrCommandPalette {\n  /** Items shown in the palette. */\n  readonly items = input<readonly WrCommandItem[]>([]);\n\n  /** Controlled open state (two-way bindable). @default false */\n  readonly open = model(false);\n\n  /** Global hotkey that opens the palette. `null` disables auto-binding. @default 'mod+k' */\n  readonly trigger = input<WrHotkeySpec | null>('mod+k');\n\n  /** Search input placeholder. Falls back to `commandPalette.placeholder`. */\n  readonly placeholder = input<string | null>(null);\n\n  /** Text shown when no items match. Falls back to `commandPalette.noResults`. */\n  readonly emptyText = input<string | null>(null);\n\n  protected readonly resolvedPlaceholder = useI18nText(\n    this.placeholder,\n    'commandPalette.placeholder',\n    'Type a command or search…'\n  );\n  protected readonly resolvedEmpty = useI18nText(this.emptyText, 'commandPalette.noResults', 'No results');\n\n  /** Auto-close on `(picked)`. Set false to keep open. @default true */\n  readonly closeOnPick = input(true, { transform: coerceBooleanProperty });\n\n  /** Fires when the user commits an item (Enter / click). */\n  readonly picked = output<WrCommandItem>();\n\n  protected readonly query = signal('');\n  protected readonly activeIndex = signal(0);\n  protected readonly inputEl = viewChild<ElementRef<HTMLInputElement>>('input');\n  protected readonly panelEl = viewChild<ElementRef<HTMLElement>>('panel');\n\n  /** Listbox id (referenced by the input's `aria-controls`). */\n  protected readonly listboxId = `wr-command-palette-listbox-${++listboxUid}`;\n\n  /** @internal Build a stable option id for a given flat index. */\n  protected optionId(i: number): string {\n    return `${this.listboxId}-opt-${i}`;\n  }\n\n  /** Id of the active option for `aria-activedescendant`. */\n  protected readonly activeOptionId = computed<string | null>(() => {\n    const i = this.activeIndex();\n    return i >= 0 && i < this.filtered().length ? this.optionId(i) : null;\n  });\n\n  private readonly hotkeys = inject(WrHotkey);\n  private readonly destroyRef = inject(DestroyRef);\n  private readonly focusTrapFactory = inject(ConfigurableFocusTrapFactory);\n  private readonly isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n  private bindingHandle: WrHotkeyHandle | null = null;\n  private focusTrap: ConfigurableFocusTrap | null = null;\n  private previouslyFocused: HTMLElement | null = null;\n\n  /** Flat filtered list — what keyboard navigation walks. */\n  protected readonly filtered = computed<readonly WrCommandItem[]>(() =>\n    this.items().filter(item => matches(item, this.query()))\n  );\n\n  /** Grouped view — what the template renders. */\n  protected readonly buckets = computed<readonly Bucket[]>(() => bucketize(this.filtered()));\n\n  constructor() {\n    // Bind / re-bind the global trigger whenever the spec changes.\n    effect(() => {\n      this.bindingHandle?.unbind();\n      const spec = this.trigger();\n      if (!spec) return;\n      this.bindingHandle = this.hotkeys.bind(spec, () => this.open.update(v => !v), { allowInInput: true });\n    });\n\n    // Reset query + active index whenever we open; focus the input.\n    effect(() => {\n      if (!this.open()) return;\n      this.query.set('');\n      this.activeIndex.set(0);\n    });\n\n    // Focus trap + restore.\n    effect(() => {\n      if (!this.isBrowser) return;\n      if (this.open()) {\n        const active = document.activeElement;\n        this.previouslyFocused = active instanceof HTMLElement ? active : null;\n        queueMicrotask(() => {\n          const host = this.panelEl()?.nativeElement;\n          if (!host) return;\n          this.focusTrap?.destroy();\n          this.focusTrap = this.focusTrapFactory.create(host);\n          void this.focusTrap.focusInitialElementWhenReady();\n        });\n      } else {\n        this.focusTrap?.destroy();\n        this.focusTrap = null;\n        const restore = this.previouslyFocused;\n        this.previouslyFocused = null;\n        if (restore && typeof restore.focus === 'function') restore.focus();\n      }\n    });\n\n    afterNextRender(() => {\n      if (this.open()) this.inputEl()?.nativeElement.focus();\n    });\n\n    // Auto-focus the input when opened.\n    effect(() => {\n      if (!this.open()) return;\n      queueMicrotask(() => this.inputEl()?.nativeElement.focus());\n    });\n\n    // Clamp the active index when the filtered list shrinks.\n    effect(() => {\n      const max = Math.max(0, this.filtered().length - 1);\n      if (this.activeIndex() > max) this.activeIndex.set(max);\n    });\n\n    this.destroyRef.onDestroy(() => this.bindingHandle?.unbind());\n  }\n\n  // Template handlers\n\n  protected onQueryInput(event: Event): void {\n    this.query.set((event.target as HTMLInputElement).value);\n    this.activeIndex.set(0);\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    const list = this.filtered();\n    switch (event.key) {\n      case 'ArrowDown':\n        event.preventDefault();\n        if (list.length > 0) this.activeIndex.set((this.activeIndex() + 1) % list.length);\n        break;\n      case 'ArrowUp':\n        event.preventDefault();\n        if (list.length > 0) this.activeIndex.set((this.activeIndex() - 1 + list.length) % list.length);\n        break;\n      case 'Home':\n        event.preventDefault();\n        this.activeIndex.set(0);\n        break;\n      case 'End':\n        event.preventDefault();\n        this.activeIndex.set(Math.max(0, list.length - 1));\n        break;\n      case 'Enter': {\n        event.preventDefault();\n        const item = list[this.activeIndex()];\n        if (item) this.commit(item);\n        break;\n      }\n      case 'Escape':\n        event.preventDefault();\n        this.close();\n        break;\n      default:\n        break;\n    }\n  }\n\n  protected onBackdropClick(): void {\n    this.close();\n  }\n\n  protected onItemClick(item: WrCommandItem, event: MouseEvent): void {\n    event.preventDefault();\n    this.commit(item);\n  }\n\n  protected onItemHover(item: WrCommandItem): void {\n    const i = this.filtered().indexOf(item);\n    if (i >= 0) this.activeIndex.set(i);\n  }\n\n  /** Flat index of an item within the filtered list — for highlight checks. */\n  protected indexOf(item: WrCommandItem): number {\n    return this.filtered().indexOf(item);\n  }\n\n  // Public API\n\n  /** Open the palette. */\n  show(): void {\n    this.open.set(true);\n  }\n\n  /** Close the palette. */\n  close(): void {\n    this.open.set(false);\n  }\n\n  // Internals\n\n  private commit(item: WrCommandItem): void {\n    item.action?.();\n    this.picked.emit(item);\n    if (this.closeOnPick()) this.close();\n  }\n}\n","@if (open()) {\n  <div class=\"wr-command-palette\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Command palette\">\n    <!-- Backdrop captures clicks to close. Not focusable — keyboard users use\n         Esc on the panel below. -->\n\n    <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n    <!-- Keydown is delegated from the search input; tabindex enables Esc when\n         the input is unfocused. -->\n    <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n      <div class=\"wr-command-palette__search\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n          <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n          <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n        </svg>\n        <input\n          #input\n          type=\"text\"\n          role=\"combobox\"\n          autocomplete=\"off\"\n          spellcheck=\"false\"\n          aria-autocomplete=\"list\"\n          [attr.aria-controls]=\"listboxId\"\n          [attr.aria-expanded]=\"true\"\n          [attr.aria-activedescendant]=\"activeOptionId() || null\"\n          [placeholder]=\"resolvedPlaceholder()\"\n          [value]=\"query()\"\n          (input)=\"onQueryInput($event)\"\n        />\n        <kbd class=\"wr-command-palette__hint\">esc</kbd>\n      </div>\n\n      <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n        @if (filtered().length === 0) {\n          <div class=\"wr-command-palette__empty\">{{ resolvedEmpty() }}</div>\n        } @else {\n          @for (bucket of buckets(); track bucket.title) {\n            <div class=\"wr-command-palette__group\">\n              @if (bucket.title) {\n                <div class=\"wr-command-palette__group-title\">{{ bucket.title }}</div>\n              }\n              @for (item of bucket.items; track item.id) {\n                <div\n                  class=\"wr-command-palette__option\"\n                  role=\"option\"\n                  [attr.id]=\"optionId(indexOf(item))\"\n                  [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n                  [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n                  (mouseenter)=\"onItemHover(item)\"\n                  (mousedown)=\"onItemClick(item, $event)\"\n                >\n                  @if (item.icon) {\n                    <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n                  } @else {\n                    <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n                  }\n                  <div class=\"wr-command-palette__option-body\">\n                    <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n                    @if (item.description) {\n                      <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n                    }\n                  </div>\n                  @if (item.shortcut) {\n                    <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n                  }\n                </div>\n              }\n            </div>\n          }\n        }\n      </div>\n    </div>\n  </div>\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-compare.mjs

@@ -0,0 +1,137 @@
+import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
+import * as i0 from '@angular/core';
+import { model, input, inject, ElementRef, computed, ViewEncapsulation, Component } from '@angular/core';
+import { clamp } from 'ngwr/utils';
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * Before/after comparison slider. Works with any content — project two
+ * pieces of markup with `wrCompareBefore` and `wrCompareAfter` attributes;
+ * the component stacks them in the same cell and clips the "after" side
+ * with a draggable divider.
+ *
+ * @example
+ * ```html
+ * <wr-compare [(position)]="pos">
+ *   <img wrCompareBefore src="before.jpg" alt="" />
+ *   <img wrCompareAfter src="after.jpg" alt="" />
+ * </wr-compare>
+ *
+ * <wr-compare orientation="vertical">
+ *   <pre wrCompareBefore>{{ oldCode }}</pre>
+ *   <pre wrCompareAfter>{{ newCode }}</pre>
+ * </wr-compare>
+ * ```
+ *
+ * @see https://ngwr.dev/components/compare
+ */
+class WrCompare {
+    /** Divider position as a percentage (0–100). Two-way bindable. @default 50 */
+    position = model(50, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
+    /**
+     * Divider direction:
+     * - `'horizontal'` — divider line is vertical, drags left/right.
+     * - `'vertical'`   — divider line is horizontal, drags up/down.
+     * @default 'horizontal'
+     */
+    orientation = input('horizontal', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+    /** Show the round drag handle on the divider. @default true */
+    showHandle = input(true, { ...(ngDevMode ? { debugName: "showHandle" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Disable interaction (divider stays put). @default false */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Initial position transform — accepts any number / numeric string. */
+    minPosition = input(0, { ...(ngDevMode ? { debugName: "minPosition" } : /* istanbul ignore next */ {}), transform: (v) => coerceNumberProperty(v, 0) });
+    maxPosition = input(100, { ...(ngDevMode ? { debugName: "maxPosition" } : /* istanbul ignore next */ {}), transform: (v) => coerceNumberProperty(v, 100) });
+    host = inject(ElementRef);
+    dragging = false;
+    classes = computed(() => {
+        const parts = ['wr-compare', `wr-compare--${this.orientation()}`];
+        if (this.disabled())
+            parts.push('wr-compare--disabled');
+        return parts.join(' ');
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    /** Clip path applied to the "after" layer so the divider reveals it. */
+    clipPath = computed(() => {
+        const p = clamp(this.position(), 0, 100);
+        if (this.orientation() === 'horizontal') {
+            // Show from `p%` to the right edge.
+            return `inset(0 0 0 ${p}%)`;
+        }
+        return `inset(${p}% 0 0 0)`;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "clipPath" }] : /* istanbul ignore next */ []));
+    // Pointer handlers
+    onPointerDown(event) {
+        if (this.disabled())
+            return;
+        event.preventDefault();
+        this.dragging = true;
+        event.currentTarget.setPointerCapture(event.pointerId);
+        this.updateFromPointer(event);
+    }
+    onPointerMove(event) {
+        if (!this.dragging)
+            return;
+        this.updateFromPointer(event);
+    }
+    onPointerUp(event) {
+        if (!this.dragging)
+            return;
+        this.dragging = false;
+        event.currentTarget.releasePointerCapture(event.pointerId);
+    }
+    onKeydown(event) {
+        if (this.disabled())
+            return;
+        const step = event.shiftKey ? 10 : 1;
+        let next = null;
+        if (this.orientation() === 'horizontal') {
+            if (event.key === 'ArrowLeft')
+                next = this.position() - step;
+            else if (event.key === 'ArrowRight')
+                next = this.position() + step;
+        }
+        else {
+            if (event.key === 'ArrowUp')
+                next = this.position() - step;
+            else if (event.key === 'ArrowDown')
+                next = this.position() + step;
+        }
+        if (event.key === 'Home')
+            next = this.minPosition();
+        else if (event.key === 'End')
+            next = this.maxPosition();
+        if (next === null)
+            return;
+        event.preventDefault();
+        this.position.set(clamp(next, this.minPosition(), this.maxPosition()));
+    }
+    updateFromPointer(event) {
+        const rect = this.host.nativeElement.getBoundingClientRect();
+        const raw = this.orientation() === 'horizontal'
+            ? ((event.clientX - rect.left) / rect.width) * 100
+            : ((event.clientY - rect.top) / rect.height) * 100;
+        this.position.set(clamp(raw, this.minPosition(), this.maxPosition()));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCompare, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCompare, isStandalone: true, selector: "wr-compare", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, showHandle: { classPropertyName: "showHandle", publicName: "showHandle", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minPosition: { classPropertyName: "minPosition", publicName: "minPosition", isSignal: true, isRequired: false, transformFunction: null }, maxPosition: { classPropertyName: "maxPosition", publicName: "maxPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { position: "positionChange" }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "<div\n  class=\"wr-compare__surface\"\n  role=\"slider\"\n  aria-label=\"Comparison divider\"\n  [attr.aria-orientation]=\"orientation()\"\n  [attr.aria-valuemin]=\"minPosition()\"\n  [attr.aria-valuemax]=\"maxPosition()\"\n  [attr.aria-valuenow]=\"position()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event)\"\n  (pointermove)=\"onPointerMove($event)\"\n  (pointerup)=\"onPointerUp($event)\"\n  (pointercancel)=\"onPointerUp($event)\"\n  (keydown)=\"onKeydown($event)\"\n>\n  <div class=\"wr-compare__layers\">\n    <div class=\"wr-compare__layer wr-compare__layer--before\">\n      <ng-content select=\"[wrCompareBefore]\" />\n    </div>\n    <div class=\"wr-compare__layer wr-compare__layer--after\" [style.clip-path]=\"clipPath()\">\n      <ng-content select=\"[wrCompareAfter]\" />\n    </div>\n  </div>\n\n  <div\n    class=\"wr-compare__divider\"\n    [style.left.%]=\"orientation() === 'horizontal' ? position() : null\"\n    [style.top.%]=\"orientation() === 'vertical' ? position() : null\"\n    aria-hidden=\"true\"\n  >\n    @if (showHandle()) {\n      <span class=\"wr-compare__handle\">\n        @if (orientation() === 'horizontal') {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M5 4 L1 8 L5 12 M11 4 L15 8 L11 12\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        } @else {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M4 5 L8 1 L12 5 M4 11 L8 15 L12 11\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        }\n      </span>\n    }\n  </div>\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCompare, decorators: [{
+            type: Component,
+            args: [{ selector: 'wr-compare', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, template: "<div\n  class=\"wr-compare__surface\"\n  role=\"slider\"\n  aria-label=\"Comparison divider\"\n  [attr.aria-orientation]=\"orientation()\"\n  [attr.aria-valuemin]=\"minPosition()\"\n  [attr.aria-valuemax]=\"maxPosition()\"\n  [attr.aria-valuenow]=\"position()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event)\"\n  (pointermove)=\"onPointerMove($event)\"\n  (pointerup)=\"onPointerUp($event)\"\n  (pointercancel)=\"onPointerUp($event)\"\n  (keydown)=\"onKeydown($event)\"\n>\n  <div class=\"wr-compare__layers\">\n    <div class=\"wr-compare__layer wr-compare__layer--before\">\n      <ng-content select=\"[wrCompareBefore]\" />\n    </div>\n    <div class=\"wr-compare__layer wr-compare__layer--after\" [style.clip-path]=\"clipPath()\">\n      <ng-content select=\"[wrCompareAfter]\" />\n    </div>\n  </div>\n\n  <div\n    class=\"wr-compare__divider\"\n    [style.left.%]=\"orientation() === 'horizontal' ? position() : null\"\n    [style.top.%]=\"orientation() === 'vertical' ? position() : null\"\n    aria-hidden=\"true\"\n  >\n    @if (showHandle()) {\n      <span class=\"wr-compare__handle\">\n        @if (orientation() === 'horizontal') {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M5 4 L1 8 L5 12 M11 4 L15 8 L11 12\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        } @else {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M4 5 L8 1 L12 5 M4 11 L8 15 L12 11\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        }\n      </span>\n    }\n  </div>\n</div>\n" }]
+        }], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }, { type: i0.Output, args: ["positionChange"] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], showHandle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showHandle", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], minPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "minPosition", required: false }] }], maxPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxPosition", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { WrCompare };
+//# sourceMappingURL=ngwr-compare.mjs.map

package/fesm2022/ngwr-compare.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngwr-compare.mjs","sources":["../../../projects/lib/compare/compare.ts","../../../projects/lib/compare/compare.html","../../../projects/lib/compare/ngwr-compare.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 { Component, ElementRef, ViewEncapsulation, computed, inject, input, model } from '@angular/core';\n\nimport { clamp } from 'ngwr/utils';\n\n/**\n * Before/after comparison slider. Works with any content — project two\n * pieces of markup with `wrCompareBefore` and `wrCompareAfter` attributes;\n * the component stacks them in the same cell and clips the \"after\" side\n * with a draggable divider.\n *\n * @example\n * ```html\n * <wr-compare [(position)]=\"pos\">\n *   <img wrCompareBefore src=\"before.jpg\" alt=\"\" />\n *   <img wrCompareAfter src=\"after.jpg\" alt=\"\" />\n * </wr-compare>\n *\n * <wr-compare orientation=\"vertical\">\n *   <pre wrCompareBefore>{{ oldCode }}</pre>\n *   <pre wrCompareAfter>{{ newCode }}</pre>\n * </wr-compare>\n * ```\n *\n * @see https://ngwr.dev/components/compare\n */\n@Component({\n  selector: 'wr-compare',\n  templateUrl: './compare.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { '[class]': 'classes()' },\n})\nexport class WrCompare {\n  /** Divider position as a percentage (0–100). Two-way bindable. @default 50 */\n  readonly position = model(50);\n\n  /**\n   * Divider direction:\n   * - `'horizontal'` — divider line is vertical, drags left/right.\n   * - `'vertical'`   — divider line is horizontal, drags up/down.\n   * @default 'horizontal'\n   */\n  readonly orientation = input<'horizontal' | 'vertical'>('horizontal');\n\n  /** Show the round drag handle on the divider. @default true */\n  readonly showHandle = input(true, { transform: coerceBooleanProperty });\n\n  /** Disable interaction (divider stays put). @default false */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** Initial position transform — accepts any number / numeric string. */\n  readonly minPosition = input(0, { transform: (v: unknown): number => coerceNumberProperty(v, 0) });\n  readonly maxPosition = input(100, { transform: (v: unknown): number => coerceNumberProperty(v, 100) });\n\n  private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\n  private dragging = false;\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-compare', `wr-compare--${this.orientation()}`];\n    if (this.disabled()) parts.push('wr-compare--disabled');\n    return parts.join(' ');\n  });\n\n  /** Clip path applied to the \"after\" layer so the divider reveals it. */\n  protected readonly clipPath = computed(() => {\n    const p = clamp(this.position(), 0, 100);\n    if (this.orientation() === 'horizontal') {\n      // Show from `p%` to the right edge.\n      return `inset(0 0 0 ${p}%)`;\n    }\n    return `inset(${p}% 0 0 0)`;\n  });\n\n  // Pointer handlers\n\n  protected onPointerDown(event: PointerEvent): void {\n    if (this.disabled()) return;\n    event.preventDefault();\n    this.dragging = true;\n    (event.currentTarget as HTMLElement).setPointerCapture(event.pointerId);\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  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    if (this.disabled()) return;\n    const step = event.shiftKey ? 10 : 1;\n    let next: number | null = null;\n    if (this.orientation() === 'horizontal') {\n      if (event.key === 'ArrowLeft') next = this.position() - step;\n      else if (event.key === 'ArrowRight') next = this.position() + step;\n    } else {\n      if (event.key === 'ArrowUp') next = this.position() - step;\n      else if (event.key === 'ArrowDown') next = this.position() + step;\n    }\n    if (event.key === 'Home') next = this.minPosition();\n    else if (event.key === 'End') next = this.maxPosition();\n    if (next === null) return;\n    event.preventDefault();\n    this.position.set(clamp(next, this.minPosition(), this.maxPosition()));\n  }\n\n  private updateFromPointer(event: PointerEvent): void {\n    const rect = this.host.nativeElement.getBoundingClientRect();\n    const raw =\n      this.orientation() === 'horizontal'\n        ? ((event.clientX - rect.left) / rect.width) * 100\n        : ((event.clientY - rect.top) / rect.height) * 100;\n    this.position.set(clamp(raw, this.minPosition(), this.maxPosition()));\n  }\n}\n","<div\n  class=\"wr-compare__surface\"\n  role=\"slider\"\n  aria-label=\"Comparison divider\"\n  [attr.aria-orientation]=\"orientation()\"\n  [attr.aria-valuemin]=\"minPosition()\"\n  [attr.aria-valuemax]=\"maxPosition()\"\n  [attr.aria-valuenow]=\"position()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event)\"\n  (pointermove)=\"onPointerMove($event)\"\n  (pointerup)=\"onPointerUp($event)\"\n  (pointercancel)=\"onPointerUp($event)\"\n  (keydown)=\"onKeydown($event)\"\n>\n  <div class=\"wr-compare__layers\">\n    <div class=\"wr-compare__layer wr-compare__layer--before\">\n      <ng-content select=\"[wrCompareBefore]\" />\n    </div>\n    <div class=\"wr-compare__layer wr-compare__layer--after\" [style.clip-path]=\"clipPath()\">\n      <ng-content select=\"[wrCompareAfter]\" />\n    </div>\n  </div>\n\n  <div\n    class=\"wr-compare__divider\"\n    [style.left.%]=\"orientation() === 'horizontal' ? position() : null\"\n    [style.top.%]=\"orientation() === 'vertical' ? position() : null\"\n    aria-hidden=\"true\"\n  >\n    @if (showHandle()) {\n      <span class=\"wr-compare__handle\">\n        @if (orientation() === 'horizontal') {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M5 4 L1 8 L5 12 M11 4 L15 8 L11 12\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        } @else {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M4 5 L8 1 L12 5 M4 11 L8 15 L12 11\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        }\n      </span>\n    }\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}