@ixfx/components 0.6.2 → 0.7.0

package/dist/{colour-picker-0stHB90J.js.map → colour-picker-BSDBL-QL.js.map}

@@ -1 +1 @@
-{"version":3,"file":"colour-picker-0stHB90J.js","names":["customElement","customElement"],"sources":["../src/colour-picker/util.ts","../src/colour-picker/colour-picker.ts","../src/colour-picker/colour-picker-popup.ts"],"sourcesContent":["import type { Range, SliderType } from \"./types\";\n\nexport const MAX_CHROMA = 0.4;\nexport const RANGE_LIMITS: Record<SliderType, Range> = {\n  l: [0, 1],\n  c: [0, MAX_CHROMA],\n  h: [0, 360],\n  a: [0, 1],\n} as const;\nexport const DEFAULT_RANGES: Record<SliderType, Range> = {\n  l: RANGE_LIMITS.l,\n  c: RANGE_LIMITS.c,\n  h: RANGE_LIMITS.h,\n  a: RANGE_LIMITS.a,\n} as const;\n\nexport function rangeSpan([min, max]: Range): number {\n  return Math.max(max - min, 0);\n}\n\nexport function cloneRange(range: Range): Range {\n  return [range[0], range[1]] as Range;\n}\n\n/**\n * Convert OKLCH to a CSS string\n */\nexport function oklchToCss(l: number, c: number, h: number, a: number = 1): string {\n  if (a < 1) {\n    return `oklch(${l} ${c} ${h} / ${a})`;\n  }\n  return `oklch(${l} ${c} ${h})`;\n}\n\n/**\n * Clamp a value between min and max\n */\nexport function clamp(value: number, min: number, max: number): number {\n  return Math.min(Math.max(value, min), max);\n}\n","/**\n * <ixfx-colour-picker> — OKLCH colour picker using CSS-gradient-rendered sliders.\n *\n * Properties:\n *   l — lightness 0..1\n *   c — chroma 0..0.4\n *   h — hue 0..360\n *\n * Getters:\n *   value — current color as CSS string e.g. \"oklch(0.7 0.15 180)\"\n *\n * Methods:\n *   setColour(colour: Colour.Colourish) — programmatically set colour from any\n *     ixfx-compatible format; also resets double-click defaults for all sliders.\n *\n * Events:\n *   input — CustomEvent { detail: { l, c, h } }\n *\n * Double-click any slider label to reset that channel to the last\n * programmatically set value (not the user-dialled value).\n */\nimport type { CSSResultGroup, PropertyValues } from 'lit';\nimport type { ColourPickerEventDetail, Range, RangeInput } from './types.js';\nimport { Colour } from '@ixfx/visual';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\nimport { DEFAULT_RANGES, oklchToCss } from './util.js';\nimport '../labelled-range-input/index.js';\n\ntype ChannelSlider = `l` | `c` | `h` | `a`;\n\n@customElement(`ixfx-colour-picker`)\nexport class ColourPicker extends LitElement {\n  @property({ type: Number }) l = 0.7;\n  @property({ type: Number }) c = 0.15;\n  @property({ type: Number }) h = 180;\n  @property({ type: Number }) a = 1;\n\n  @property({ type: Boolean, attribute: `hide-preview`, reflect: true }) hidePreview = false;\n  @property({ type: Boolean, attribute: `hide-h`, reflect: true }) hideH = false;\n  @property({ type: Boolean, attribute: `hide-l`, reflect: true }) hideL = false;\n  @property({ type: Boolean, attribute: `hide-c`, reflect: true }) hideC = false;\n  @property({ type: Boolean, attribute: `show-a` }) showA = false;\n  @property({ type: Boolean, attribute: `horizontal`, reflect: true }) horizontal = false;\n  @property({ type: Boolean, attribute: `sliders-vertical`, reflect: true }) slidersVertical = false;\n  @property({ type: Boolean, attribute: `hide-tooltips`, reflect: true }) hideTooltips = false;\n\n  @property({ type: String, attribute: `value` })\n  private _valueAttr: string | null = null;\n\n  @property({ type: String, attribute: `range-l` }) rangeLAttr: string | null = null;\n  @property({ type: String, attribute: `range-c` }) rangeCAttr: string | null = null;\n  @property({ type: String, attribute: `range-h` }) rangeHAttr: string | null = null;\n  @property({ type: String, attribute: `range-a` }) rangeAAttr: string | null = null;\n\n  private _ranges: Record<ChannelSlider, Range> = {\n    l: DEFAULT_RANGES.l,\n    c: DEFAULT_RANGES.c,\n    h: DEFAULT_RANGES.h,\n    a: DEFAULT_RANGES.a,\n  };\n\n  @query(`#slider-l`) _sliderL!: HTMLElement;\n  @query(`#slider-c`) _sliderC!: HTMLElement;\n  @query(`#slider-h`) _sliderH!: HTMLElement;\n  @query(`#slider-a`) _sliderA!: HTMLElement;\n  @query(`.preview`) _previewEl!: HTMLElement;\n\n  // Last programmatically-set values — used as double-click reset targets.\n  // Initialised to the component's own defaults.\n  private _defaultL = this.l;\n  private _defaultC = this.c;\n  private _defaultH = this.h;\n  private _defaultA = this.a;\n\n  // Keys are added synchronously in input handlers and cleared only inside\n  // updated() (which runs asynchronously). This means updated() can reliably\n  // tell whether a property change was user-initiated or programmatic.\n  private readonly _userInitiated = new Set<string>();\n\n  get value(): string {\n    return oklchToCss(this.l, this.c, this.h, this.a);\n  }\n\n  set value(colourString: string) {\n    const c = Colour.convert(colourString, `oklch-absolute`);\n    this.l = c.l;\n    this.c = c.c;\n    this.h = c.h;\n    this.a = c.opacity ?? 1;\n    this._valueAttr = colourString;\n  }\n\n  /**\n   * Set the colour from any ixfx-compatible format (CSS string, OkLch object,\n   * HSL object, etc.). Also updates the double-click reset defaults for all\n   * sliders.\n   */\n  setColour(colour: Colour.Colourish): void {\n    const c = Colour.convert(colour, `oklch-absolute`);\n    this.l = c.l;\n    this.c = c.c;\n    this.h = c.h;\n    this.a = c.opacity ?? 1;\n    // No _userInitiated keys added → updated() will set _defaultL/C/H/A. ✓\n  }\n\n  get rangeL(): Range {\n    return [this._ranges.l[0], this._ranges.l[1]];\n  }\n\n  set rangeL(range: RangeInput) {\n    this._applyRangeInput(`l`, range);\n  }\n\n  get rangeC(): Range {\n    return [this._ranges.c[0], this._ranges.c[1]];\n  }\n\n  set rangeC(range: RangeInput) {\n    this._applyRangeInput(`c`, range);\n  }\n\n  get rangeH(): Range {\n    return [this._ranges.h[0], this._ranges.h[1]];\n  }\n\n  set rangeH(range: RangeInput) {\n    this._applyRangeInput(`h`, range);\n  }\n\n  get rangeA(): Range {\n    return [this._ranges.a[0], this._ranges.a[1]];\n  }\n\n  set rangeA(range: RangeInput) {\n    this._applyRangeInput(`a`, range);\n  }\n\n  setRangeL(range: RangeInput): void {\n    this.rangeL = range;\n  }\n\n  setRangeC(range: RangeInput): void {\n    this.rangeC = range;\n  }\n\n  setRangeH(range: RangeInput): void {\n    this.rangeH = range;\n  }\n\n  setRangeA(range: RangeInput): void {\n    this.rangeA = range;\n  }\n\n  override willUpdate(changedProperties: PropertyValues): void {\n    if (changedProperties.has(`rangeLAttr`))\n      this._setRangeFromAttribute(`l`, this.rangeLAttr);\n    if (changedProperties.has(`rangeCAttr`))\n      this._setRangeFromAttribute(`c`, this.rangeCAttr);\n    if (changedProperties.has(`rangeHAttr`))\n      this._setRangeFromAttribute(`h`, this.rangeHAttr);\n    if (changedProperties.has(`rangeAAttr`))\n      this._setRangeFromAttribute(`a`, this.rangeAAttr);\n    super.willUpdate(changedProperties);\n  }\n\n  private _applyRangeInput(channel: ChannelSlider, input: RangeInput): void {\n    const normalized = this._coerceRangeInput(channel, input);\n    if (!normalized)\n      return;\n    this._setRange(channel, normalized);\n  }\n\n  private _coerceRangeInput(channel: ChannelSlider, input: RangeInput): Range | null {\n    if (!Array.isArray(input) || input.length < 2)\n      return null;\n    const [start, end] = input;\n    if (!Number.isFinite(start) || !Number.isFinite(end))\n      return null;\n    return this._normalizeRange(channel, [start, end]);\n  }\n\n  private _setRangeFromAttribute(channel: ChannelSlider, value: string | null): void {\n    if (value === null) {\n      this._setRange(channel, DEFAULT_RANGES[channel]);\n      return;\n    }\n    const parsed = this._parseRangeString(channel, value);\n    if (parsed)\n      this._setRange(channel, parsed);\n  }\n\n  private _setRange(channel: ChannelSlider, range: Range): void {\n    const normalized = this._normalizeRange(channel, range);\n    const currentRange = this._ranges[channel];\n    if (currentRange[0] === normalized[0] && currentRange[1] === normalized[1])\n      return;\n\n    this._ranges = { ...this._ranges, [channel]: normalized };\n\n    switch (channel) {\n      case `l`:\n        this.l = this._clampToRange(`l`, this.l);\n        break;\n      case `c`:\n        this.c = this._clampToRange(`c`, this.c);\n        break;\n      case `h`:\n        this.h = this._clampToRange(`h`, this.h);\n        break;\n      case `a`:\n        this.a = this._clampToRange(`a`, this.a);\n        break;\n    }\n\n    this.requestUpdate();\n  }\n\n  private _getRange(channel: ChannelSlider): Range {\n    return this._ranges[channel] ?? DEFAULT_RANGES[channel];\n  }\n\n  private _parseRangeString(channel: ChannelSlider, value: string): Range | null {\n    const cleaned = value.trim();\n    const parts = cleaned.split(`-`, 2);\n    if (parts.length !== 2)\n      return null;\n    const start = Number(parts[0]!.trim());\n    const end = Number(parts[1]!.trim());\n    if (!Number.isFinite(start) || !Number.isFinite(end))\n      return null;\n    return this._normalizeRange(channel, [start, end]);\n  }\n\n  private _normalizeRange(channel: ChannelSlider, range: Range): Range {\n    const limits = DEFAULT_RANGES[channel];\n    const [rawMin, rawMax] = range;\n    const minVal = Math.min(Math.min(rawMin, rawMax), limits[1]);\n    const maxVal = Math.max(Math.max(rawMin, rawMax), limits[0]);\n    return [\n      Math.max(minVal, limits[0]),\n      Math.min(maxVal, limits[1]),\n    ];\n  }\n\n  private _clampToRange(channel: ChannelSlider, value: number): number {\n    const [min, max] = this._getRange(channel);\n    return Math.min(Math.max(value, min), max);\n  }\n\n  override render() {\n    const makeSlider = (channel: `l` | `c` | `h` | `a`, label: string, min: number, max: number, step: number, isHidden: boolean, formatter?: (value: string) => string) => {\n      if (isHidden)\n        return nothing;\n      return html`\n        <ixfx-labelled-range-input\n          id=\"slider-${channel}\"\n          label=\"${label}\"\n          min=${min}\n          max=${max}\n          mini-width-threshold=200\n          .value=${this[channel]}\n          step=${step}\n          .orientation=${this.slidersVertical ? `vertical` : `horizontal`}\n          .formatter=${formatter}\n          ?no-tooltip=${this.hideTooltips}\n          .displayTextLogic=${this.hideTooltips ? `show` : `transient`}\n          @input=${(e: Event) => this._onInput(e, channel)}\n          @change=${(e: Event) => this._onChange(e, channel)}\n        ></ixfx-labelled-range-input>\n      `;\n    };\n\n    return html`\n      <div class=\"picker\" ?horizontal=${this.horizontal}>\n        <div class=\"preview\" ?hidden=${this.hidePreview}></div>\n        <div class=\"sliders\">\n          ${makeSlider(`h`, `Hue`, ...this._getRange(`h`), 1, this.hideH, v => `${Math.round(Number(v))}°`)}\n          ${makeSlider(`l`, `Lightness`, ...this._getRange(`l`), 0.01, this.hideL, v => `${Math.round(Number(v) * 100)}%`)}\n          ${makeSlider(`c`, `Chroma`, ...this._getRange(`c`), 0.005, this.hideC, v => `${Number.parseFloat(v).toFixed(2)}`)}\n          ${this.showA ? makeSlider(`a`, `Opacity`, ...this._getRange(`a`), 0.01, false, v => `${Math.round(Number(v) * 100)}%`) : nothing}\n        </div>\n      </div>\n    `;\n  }\n\n  override firstUpdated(changedProperties: PropertyValues): void {\n    super.firstUpdated(changedProperties);\n    this._updateGradients();\n  }\n\n  override updated(changedProperties: PropertyValues): void {\n    super.updated(changedProperties);\n\n    // Update reset defaults only for programmatic changes (not user input).\n    // _userInitiated is populated synchronously in input handlers and cleared\n    // here, so it correctly reflects what changed since the last render.\n    if (changedProperties.has(`l`) && !this._userInitiated.has(`l`))\n      this._defaultL = this.l;\n    if (changedProperties.has(`c`) && !this._userInitiated.has(`c`))\n      this._defaultC = this.c;\n    if (changedProperties.has(`h`) && !this._userInitiated.has(`h`))\n      this._defaultH = this.h;\n    if (changedProperties.has(`a`) && !this._userInitiated.has(`a`))\n      this._defaultA = this.a;\n    this._userInitiated.clear();\n\n    if (changedProperties.has(`l`) || changedProperties.has(`c`) || changedProperties.has(`h`) || changedProperties.has(`a`) || changedProperties.has(`showA`) || changedProperties.has(`slidersVertical`)) {\n      this._updateGradients();\n    }\n  }\n\n  _updateGradients(): void {\n    const l = this.l;\n    const c = this.c;\n    const h = this.h;\n    const a = this.a;\n\n    // Get actual ranges from this._ranges (may be restricted via attributes)\n    const [lMin, lMax] = this._ranges.l;\n    const [cMin, cMax] = this._ranges.c;\n    const [hMin, hMax] = this._ranges.h;\n    const [aMin, aMax] = this._ranges.a;\n\n    // Gradient direction: vertical sliders fill bottom→top (bottom = min, top = max).\n    const dir = this.slidersVertical ? `to top` : `to right`;\n\n    // L slider: black → white at current chroma + hue, using actual range\n    const lGrad = `linear-gradient(in oklch ${dir}, oklch(${lMin} ${c} ${h}), oklch(${lMax} ${c} ${h}))`;\n\n    // C slider: neutral grey → fully saturated at current lightness + hue, using actual range\n    const cGrad = `linear-gradient(in oklch ${dir}, oklch(${l} ${cMin} ${h}), oklch(${l} ${cMax} ${h}))`;\n\n    // H slider: hue range at current lightness + chroma.\n    // Use 'longer hue' for full 0-360 range, 'shorter hue' for restricted ranges.\n    const hRange = hMax - hMin;\n    const hLonger = hRange >= 300; // Full or near-full hue range\n    const hGrad = `linear-gradient(in oklch ${hLonger ? `longer` : `shorter`} hue ${dir}, oklch(${l} ${c} ${hMin}), oklch(${l} ${c} ${hMax}))`;\n\n    // A slider: transparent to opaque at current colour, using actual range.\n    // Includes checkerboard pattern as bottom layer, with opacity gradient on top.\n    const aGrad = `\n      linear-gradient(${dir}, oklch(${l} ${c} ${h} / ${aMin}), oklch(${l} ${c} ${h} / ${aMax})),\n      repeating-conic-gradient(\n        var(--surface-2) 0% 25%,\n        var(--surface-4) 0% 50%\n      ) 50% / 16px 16px\n    `;\n\n    // Set gradient on --background-track (goes to .range-bg, the track background)\n    // Set --background-track-value to transparent to hide the filled-portion bar\n    const trackBgVars = [\n      `--background-track`,\n      `--background-track-hover`,\n    ] as const;\n\n    const trackValueVars = [\n      `--background-track-value`,\n      `--background-track-value-hover`,\n      `--background-track-value-active`,\n      `--background-track-value-vertical`,\n      `--background-track-value-hover-vertical`,\n      `--background-track-value-active-vertical`,\n    ] as const;\n\n    const sliders: Array<[HTMLElement | null, string]> = [\n      [this._sliderL, lGrad],\n      [this._sliderC, cGrad],\n      [this._sliderH, hGrad],\n    ];\n\n    if (this.showA && this._sliderA)\n      sliders.push([this._sliderA, aGrad]);\n\n    for (const [el, grad] of sliders) {\n      if (!el)\n        continue;\n      // Set gradient on track background (.range-bg)\n      for (const v of trackBgVars) {\n        el.style.setProperty(v, grad);\n      }\n      // Hide the filled-portion bar (track pseudo-element)\n      for (const v of trackValueVars) {\n        el.style.setProperty(v, `transparent`);\n      }\n    }\n\n    // Preview swatch background - show checkerboard behind when opacity < 1\n    if (this._previewEl) {\n      if (this.a < 1) {\n        const previewBg = `\n          linear-gradient(oklch(${l} ${c} ${h} / ${a}), oklch(${l} ${c} ${h} / ${a})),\n          repeating-conic-gradient(\n            var(--surface-2) 0% 25%,\n            var(--surface-4) 0% 50%\n          ) 50% / 16px 16px\n        `;\n        this._previewEl.style.background = previewBg;\n      } else {\n        this._previewEl.style.background = this.value;\n      }\n    }\n  }\n\n  _onInput = (e: Event, channel: `l` | `c` | `h` | `a`): void => {\n    const detail = (e as CustomEvent).detail;\n    this._userInitiated.add(channel);\n    this[channel] = detail.value;\n    this._dispatchInput();\n    e.stopPropagation();\n  };\n\n  _onChange = (e: Event, channel: `l` | `c` | `h` | `a`): void => {\n    const detail = (e as CustomEvent).detail;\n    this._userInitiated.add(channel);\n    const value = typeof detail.value === `string` ? Number.parseFloat(detail.value) : detail.value;\n    switch (channel) {\n      case `l`: this.l = value; break;\n      case `c`: this.c = value; break;\n      case `h`: this.h = value; break;\n      case `a`: this.a = value; break;\n    }\n    e.stopPropagation();\n    this.requestUpdate();\n    this._dispatchChange();\n  };\n\n  _dispatchInput(): void {\n    const detail: ColourPickerEventDetail = { l: this.l, c: this.c, h: this.h, a: this.a, unit: `scalar`, space: `oklch` };\n    this.dispatchEvent(new CustomEvent<ColourPickerEventDetail>(`input`, { detail, bubbles: true, composed: true }));\n  }\n\n  _dispatchChange(): void {\n    const detail: ColourPickerEventDetail = { l: this.l, c: this.c, h: this.h, a: this.a, unit: `scalar`, space: `oklch` };\n    this.dispatchEvent(new CustomEvent<ColourPickerEventDetail>(`change`, { detail, bubbles: true, composed: true }));\n  }\n\n  static styles: CSSResultGroup = [themeFallbacks, css`\n    /*\n     * Default intrinsic size — not determined by label text.\n     * Override via CSS: ixfx-colour-picker { width: 100%; height: 200px; }\n     * Or via custom properties: --picker-alt-width, --picker-alt-min-slider-height\n     */\n    :host {\n      display: block;\n      width: var(--picker-alt-width, 240px);\n      height: var(--picker-alt-height, 240px);\n      --_radius-m: var(--radius-m, 4px);\n      --_radius-s: var(--radius-m, 3px);\n      container-type: size;\n    }\n\n    .picker {\n      display: flex;\n      flex-direction: column;\n      gap: var(--space-s, 8px);\n      width: 100%;\n      height: 100%;\n      overflow: hidden;\n    }\n\n    .picker[horizontal] {\n      flex-direction: row;\n      align-items: stretch;\n    }\n\n    .sliders {\n      display: flex;\n      flex-direction: column;\n      gap: var(--space-s, 8px);\n      flex: 1;\n      min-height: 0;\n    }\n\n    .picker[horizontal] .sliders {\n      flex-direction: column;\n    }\n\n    .preview {\n      flex-shrink: 0;\n      height: 30%;\n      border-radius: var(--_radius-m);\n      border: 1px solid rgba(0, 0, 0, 0.2);\n    }\n\n    .preview[hidden] {\n      display: none;\n    }\n\n    .picker[horizontal] .preview {\n      width: 3em;\n      height: auto;\n      flex-shrink: 0;\n    }\n\n    ixfx-labelled-range-input {\n      flex: 1;\n      min-height: var(--picker-alt-min-slider-height, 2.5em);\n      width: 100%;\n      min-width: 0;\n      --track-thickness: 2em;\n      --track-radius: var(--_radius-s);\n      --label-width: 5em;\n      --thumb-thickness: 4px;\n      --thumb-color: rgba(255, 255, 255, 0.9);\n      --thumb-color-active: white;\n      --thumb-radius: 3px;\n      --thumb-border: 2px solid rgba(255, 255, 255, 0.85);\n      --thumb-shadow: 0 0 0 2px rgba(0, 0, 0, 0.65);\n    }\n\n    /* Vertical sliders mode: sliders are side-by-side vertical bars */\n    :host([sliders-vertical]) .sliders {\n      flex-direction: row;\n      align-items: stretch;\n    }\n\n    :host([sliders-vertical]) ixfx-labelled-range-input {\n      width: auto;\n      height: 100%;\n      min-height: 0;\n      --mini: 1;             /* force mini mode: no label, tooltip on hover */\n      --track-thickness: 100%;  /* fill full width of the narrow slider */\n    }\n\n    /* Landscape */\n    @container (aspect-ratio > 1) {\n      .picker {\n        flex-direction: row;\n        display:flex;\n        align-items: stretch;\n\n      }\n      .preview {\n        width: 30%;\n        height: unset;\n      }\n      .sliders {\n        height: 100%;\n        overflow: hidden;\n      }\n    }\n\n    /* Small height. Show as landscape */\n    @container (max-height: 150px) {\n      .picker {\n        flex-direction: row;\n        align-items: stretch;\n      }\n      ixfx-labelled-range-input {\n        --track-thickness: 1em;\n        min-height: unset;\n      }\n      .preview {\n        min-width: 50%;\n        height: auto;\n      }\n    }\n\n    /* Medium height — tighter but not extreme */\n    @container (max-height: 210px) and (min-height: 150px) {\n      ixfx-labelled-range-input {\n        --track-thickness: 1.6em;\n        min-height: 1.8em;\n      }\n    }\n  `];\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ixfx-colour-picker': ColourPicker;\n  }\n}\n","/**\n * <ixfx-colour-picker-popup> — inline colour swatch that opens an ixfx-colour-picker\n * in a native popover.\n *\n * Properties:\n *   mode       — \"fluid\" (default) | \"confirm\"\n *   l, c, h, a — committed OKLCH values\n *   hide-h, hide-l, hide-c, show-a, horizontal — passed to inner picker\n *   show-preview — show the colour preview swatch inside the picker (fluid mode hides it by default)\n *\n * Getters/setters:\n *   value — committed colour as CSS string e.g. \"oklch(0.7 0.15 180)\";\n *     setting accepts any ixfx-compatible colour format (equivalent to calling setColour())\n *\n * Methods:\n *   setColour(colour: Colour.Colourish) — programmatically set committed colour\n *\n * Events:\n *   input  — (fluid mode only) CustomEvent { detail: { l, c, h, a } }\n *   change — CustomEvent { detail: { l, c, h, a } }\n *\n * CSS custom properties:\n *   --cp-popup-swatch-size    — swatch button size (default: 1.5em)\n */\nimport type { CSSResultGroup, PropertyValues } from 'lit';\nimport type { ColourPicker } from './colour-picker.js';\nimport type { ColourPickerEventDetail } from './types.js';\nimport { Colour } from '@ixfx/visual';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport { ICON_CHECK } from '../icons/defaults.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { popupSurfaceStyles } from '../styles/popup.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\nimport { oklchToCss } from './util.js';\nimport './colour-picker.js';\n\nlet _instanceCounter = 0;\n\nconst PICKER_SIZES = {\n  small: { width: 130, height: 100 },\n  medium: { width: 100, height: 155 },\n  large: { width: 200, height: 180 },\n  huge: { width: 290, height: 240 },\n} as const;\n\ntype PickerSize = keyof typeof PICKER_SIZES;\n\nfunction swatchBackground(l: number, c: number, h: number, a: number): string {\n  if (a < 1) {\n    return `\n      linear-gradient(oklch(${l} ${c} ${h} / ${a}), oklch(${l} ${c} ${h} / ${a})),\n      repeating-conic-gradient(\n        var(--surface-2) 0% 25%,\n        var(--surface-4) 0% 50%\n      ) 50% / 8px 8px\n    `;\n  }\n  return oklchToCss(l, c, h);\n}\n\n@customElement(`ixfx-colour-picker-popup`)\nexport class ColourPickerPopup extends LitElement {\n  @property({ type: String }) mode: `fluid` | `confirm` = `fluid`;\n\n  @property({ type: Number }) l = 0.7;\n  @property({ type: Number }) c = 0.15;\n  @property({ type: Number }) h = 180;\n  @property({ type: Number }) a = 1;\n\n  @property({ type: Boolean, attribute: `show-preview` }) showPreview = false;\n  @property({ type: Boolean, attribute: `hide-h`, reflect: true }) hideH = false;\n  @property({ type: Boolean, attribute: `hide-l`, reflect: true }) hideL = false;\n  @property({ type: Boolean, attribute: `hide-c`, reflect: true }) hideC = false;\n  @property({ type: Boolean, attribute: `show-a` }) showA = false;\n  @property({ type: Boolean, attribute: `horizontal` }) horizontal = false;\n  @property({ type: String }) size: PickerSize = `medium`;\n\n  @state() private _isOpen = false;\n  @state() private _everOpened = false;\n\n  @query(`.popup`) _popupEl!: HTMLElement;\n  @query(`ixfx-colour-picker`) _pickerEl!: ColourPicker;\n\n  private readonly _uid: string;\n  private readonly _anchorName: string;\n  private readonly _popupId: string;\n\n  // Confirm mode: values being adjusted (not yet committed)\n  private _pendingL = this.l;\n  private _pendingC = this.c;\n  private _pendingH = this.h;\n  private _pendingA = this.a;\n\n  // Confirm mode: snapshot taken on open, used for revert on dismiss\n  private _savedL = this.l;\n  private _savedC = this.c;\n  private _savedH = this.h;\n  private _savedA = this.a;\n\n  // Set to true just before hidePopover() in _onConfirm to suppress revert\n  private _pendingConfirmed = false;\n\n  constructor() {\n    super();\n    const id = ++_instanceCounter;\n    this._uid = `cp-popup-${id}`;\n    this._anchorName = `--cp-popup-anchor-${id}`;\n    this._popupId = `cp-popup-panel-${id}`;\n  }\n\n  get value(): string {\n    return oklchToCss(this.l, this.c, this.h, this.a);\n  }\n\n  set value(colour: Colour.Colourish) {\n    this.setColour(colour);\n  }\n\n  private get _innerHidePreview(): boolean {\n    // Fluid mode hides the preview by default (swatch already shows live colour).\n    // show-preview overrides this. Confirm mode shows it by default.\n    if (this.mode === `fluid`)\n      return !this.showPreview;\n    return false;\n  }\n\n  private get _pickerDimensions(): { width: number; height: number } {\n    return PICKER_SIZES[this.size] ?? PICKER_SIZES.medium;\n  }\n\n  setColour(colour: Colour.Colourish): void {\n    const c = Colour.convert(colour, `oklch-absolute`);\n    this.l = c.l;\n    this.c = c.c;\n    this.h = c.h;\n    this.a = c.opacity ?? 1;\n  }\n\n  override firstUpdated(changedProperties: PropertyValues): void {\n    super.firstUpdated(changedProperties);\n    this._applyAnchorPositioning();\n    this._updateSwatchBackground();\n  }\n\n  override updated(changedProperties: PropertyValues): void {\n    super.updated(changedProperties);\n    const colourChanged = changedProperties.has(`l`) || changedProperties.has(`c`)\n      || changedProperties.has(`h`) || changedProperties.has(`a`);\n    if (colourChanged) {\n      this._updateSwatchBackground();\n    }\n  }\n\n  private _applyAnchorPositioning(): void {\n    const swatch = this.shadowRoot?.querySelector(`.swatch`) as HTMLElement | null;\n    if (swatch) {\n      swatch.style.setProperty(`anchor-name`, this._anchorName);\n    }\n    if (this._popupEl) {\n      this._popupEl.style.setProperty(`position-anchor`, this._anchorName);\n    }\n  }\n\n  private _updateSwatchBackground(): void {\n    const swatch = this.shadowRoot?.querySelector(`.swatch`) as HTMLElement | null;\n    if (swatch) {\n      swatch.style.background = swatchBackground(this.l, this.c, this.h, this.a);\n    }\n  }\n\n  private _onPopoverToggle = (e: Event): void => {\n    const te = e as ToggleEvent;\n    this._isOpen = te.newState === `open`;\n\n    if (te.newState === `open`) {\n      this._savedL = this.l;\n      this._savedC = this.c;\n      this._savedH = this.h;\n      this._savedA = this.a;\n      this._pendingL = this.l;\n      this._pendingC = this.c;\n      this._pendingH = this.h;\n      this._pendingA = this.a;\n      this._pendingConfirmed = false;\n    } else if (this.mode === `confirm` && !this._pendingConfirmed) {\n      // Dismissed without confirming — reset inner picker to saved values\n      this._pickerEl?.setColour(oklchToCss(this._savedL, this._savedC, this._savedH, this._savedA));\n    }\n  };\n\n  private _onPickerInput = (e: Event): void => {\n    e.stopPropagation();\n    const detail = (e as CustomEvent<ColourPickerEventDetail>).detail;\n\n    if (this.mode === `confirm`) {\n      this._pendingL = detail.l;\n      this._pendingC = detail.c;\n      this._pendingH = detail.h;\n      this._pendingA = detail.a ?? 1;\n      return;\n    }\n\n    this.l = detail.l;\n    this.c = detail.c;\n    this.h = detail.h;\n    this.a = detail.a ?? 1;\n    this._dispatchInput();\n  };\n\n  private _onPickerChange = (e: Event): void => {\n    e.stopPropagation();\n    const detail = (e as CustomEvent<ColourPickerEventDetail>).detail;\n\n    if (this.mode === `confirm`) {\n      this._pendingL = detail.l;\n      this._pendingC = detail.c;\n      this._pendingH = detail.h;\n      this._pendingA = detail.a ?? 1;\n      return;\n    }\n\n    this.l = detail.l;\n    this.c = detail.c;\n    this.h = detail.h;\n    this.a = detail.a ?? 1;\n    this._dispatchChange();\n  };\n\n  private _onConfirm = (): void => {\n    this.l = this._pendingL;\n    this.c = this._pendingC;\n    this.h = this._pendingH;\n    this.a = this._pendingA;\n    this._pendingConfirmed = true;\n    this._dispatchChange();\n    try {\n      (this._popupEl as HTMLElement & { hidePopover: () => void }).hidePopover();\n    } catch {\n      // Popover API not supported\n    }\n  };\n\n  private _onSwatchClick = async (): Promise<void> => {\n    if (!this._everOpened) {\n      this._everOpened = true;\n      await this.updateComplete;\n    }\n    try {\n      (this._popupEl as HTMLElement & { showPopover: () => void }).showPopover();\n    } catch {\n      // Popover API not supported\n    }\n  };\n\n  private _dispatchInput(): void {\n    const detail: ColourPickerEventDetail = { l: this.l, c: this.c, h: this.h, a: this.a, unit: `scalar`, space: `oklch` };\n    this.dispatchEvent(new CustomEvent<ColourPickerEventDetail>(`input`, { detail, bubbles: true, composed: true }));\n  }\n\n  private _dispatchChange(): void {\n    const detail: ColourPickerEventDetail = { l: this.l, c: this.c, h: this.h, a: this.a, unit: `scalar`, space: `oklch` };\n    this.dispatchEvent(new CustomEvent<ColourPickerEventDetail>(`change`, { detail, bubbles: true, composed: true }));\n  }\n\n  override render() {\n    return html`\n      <button\n        class=\"swatch\"\n        @click=${this._onSwatchClick}\n        aria-label=\"Pick colour: ${this.value}\"\n        aria-expanded=\"${this._isOpen}\"\n        aria-haspopup=\"dialog\"\n      ></button>\n      <div\n        id=\"${this._popupId}\"\n        class=\"popup popup-surface\"\n        popover=\"auto\"\n        role=\"dialog\"\n        aria-label=\"Colour picker\"\n        style=\"--cp-popup-min-width:${this._pickerDimensions.width}px;--cp-popup-min-height:${this._pickerDimensions.height}px\"\n        @toggle=${this._onPopoverToggle}\n      >\n        ${this._everOpened\n          ? html`\n          <ixfx-colour-picker\n            .l=${this.l}\n            .c=${this.c}\n            .h=${this.h}\n            .a=${this.a}\n            style=\"width:${this._pickerDimensions.width}px;height:${this._pickerDimensions.height}px\"\n            ?hide-preview=${this._innerHidePreview}\n            ?hide-h=${this.hideH}\n            ?hide-l=${this.hideL}\n            ?hide-c=${this.hideC}\n            ?show-a=${this.showA}\n            ?horizontal=${this.horizontal}\n            hide-tooltips\n            @input=${this._onPickerInput}\n            @change=${this._onPickerChange}\n          ></ixfx-colour-picker>\n          ${this.mode === `confirm`\n            ? html`\n            <button class=\"confirm-btn\" @click=${this._onConfirm} aria-label=\"Confirm colour\" title=\"Confirm colour\">\n              ${unsafeHTML(ICON_CHECK)}\n            </button>\n          `\n            : nothing}\n        `\n          : nothing}\n      </div>\n    `;\n  }\n\n  static styles: CSSResultGroup = [themeFallbacks, popupSurfaceStyles, css`\n    :host {\n      display: inline-block;\n    }\n\n    .swatch {\n      display: inline-block;\n      width: var(--cp-popup-swatch-size, 1.5em);\n      height: var(--cp-popup-swatch-size, 1.5em);\n      border-radius: var(--radius-m, 4px);\n      border: 1px solid rgba(0, 0, 0, 0.2);\n      cursor: pointer;\n      padding: 0;\n      box-sizing: border-box;\n      vertical-align: middle;\n      transition: transform 0.1s ease, box-shadow 0.1s ease;\n    }\n\n    .swatch:hover {\n      transform: scale(1.1);\n    }\n\n    .swatch:focus-visible {\n      outline: 2px solid var(--accent, oklch(60% 0.15 140));\n      outline-offset: 2px;\n    }\n\n    /* Popover panel */\n    .popup {\n      display:flex;\n      flex-direction: column;\n      gap: var(--space-s);\n      /* Reset popover UA inset */\n      inset: unset;\n      margin: 0;\n\n      min-width: var(--cp-popup-min-width);\n      min-height: var(--cp-popup-min-height);\n\n      /* CSS anchor positioning — position-anchor set via inline style in JS */\n      position: fixed;\n      position-area: block-end span-inline-start;\n      position-try-fallbacks: flip-block, flip-inline, flip-block flip-inline;\n      margin-block-start: 4px;\n\n      padding: var(--space-l);\n      z-index: 100;\n\n      /* Animate in/out */\n      opacity: 0;\n      scale: 0.97;\n      pointer-events: none;\n      transition: opacity 0.12s ease, scale 0.12s ease;\n    }\n\n    .popup:popover-open {\n      opacity: 1;\n      scale: 1;\n      pointer-events: auto;\n    }\n\n    ixfx-colour-picker {\n      display: block;\n    }\n\n    .confirm-btn {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      margin-block-start: var(--space-s);\n      margin-inline-start: auto;\n      width: 1.8em;\n      height: 1.8em;\n      border-radius: 50%;\n      border: none;\n      background: var(--accent, oklch(60% 0.15 140));\n      color: var(--accent-text, #fff);\n      padding: 0;\n      cursor: pointer;\n      transition: background var(--transition, 0.15s ease-out);\n    }\n\n    .confirm-btn svg {\n      width: 1.1em;\n      height: 1.1em;\n      flex-shrink: 0;\n    }\n\n    .confirm-btn:hover {\n      background: var(--accent, oklch(70% 0.15 140));\n    }\n\n    .confirm-btn:focus-visible {\n      outline: 2px solid var(--accent, oklch(60% 0.15 140));\n      outline-offset: 2px;\n    }\n  `];\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ixfx-colour-picker-popup': ColourPickerPopup;\n  }\n}\n"],"mappings":";;;;;;;;AAGA,MAAa,eAA0C;CACrD,GAAG,CAAC,GAAG,CAAC;CACR,GAAG,CAAC,GAAG,EAAU;CACjB,GAAG,CAAC,GAAG,GAAG;CACV,GAAG,CAAC,GAAG,CAAC;AACV;AACA,MAAa,iBAA4C;CACvD,GAAG,aAAa;CAChB,GAAG,aAAa;CAChB,GAAG,aAAa;CAChB,GAAG,aAAa;AAClB;;;;AAaA,SAAgB,WAAW,GAAW,GAAW,GAAW,IAAY,GAAW;CACjF,IAAI,IAAI,GACN,OAAO,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE;CAErC,OAAO,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE;AAC9B;;;ACEO,IAAM,eAAN,MAAM,qBAAqB,WAAW;;;EACX,KAAA,IAAA;EACA,KAAA,IAAA;EACA,KAAA,IAAA;EACA,KAAA,IAAA;EAEqD,KAAA,cAAA;EACZ,KAAA,QAAA;EACA,KAAA,QAAA;EACA,KAAA,QAAA;EACf,KAAA,QAAA;EACwB,KAAA,aAAA;EACW,KAAA,kBAAA;EACN,KAAA,eAAA;EAGnD,KAAA,aAAA;EAE0C,KAAA,aAAA;EACA,KAAA,aAAA;EACA,KAAA,aAAA;EACA,KAAA,aAAA;EAE9B,KAAA,UAAA;GAC9C,GAAG,eAAe;GAClB,GAAG,eAAe;GAClB,GAAG,eAAe;GAClB,GAAG,eAAe;EACpB;EAUoB,KAAA,YAAA,KAAK;EACL,KAAA,YAAA,KAAK;EACL,KAAA,YAAA,KAAK;EACL,KAAA,YAAA,KAAK;EAKS,KAAA,iCAAA,IAAI,IAAY;EAuUtC,KAAA,YAAA,GAAU,YAAyC;GAC7D,MAAM,SAAU,EAAkB;GAClC,KAAK,eAAe,IAAI,OAAO;GAC/B,KAAK,WAAW,OAAO;GACvB,KAAK,eAAe;GACpB,EAAE,gBAAgB;EACpB;EAEa,KAAA,aAAA,GAAU,YAAyC;GAC9D,MAAM,SAAU,EAAkB;GAClC,KAAK,eAAe,IAAI,OAAO;GAC/B,MAAM,QAAQ,OAAO,OAAO,UAAU,WAAW,OAAO,WAAW,OAAO,KAAK,IAAI,OAAO;GAC1F,QAAQ,SAAR;IACE,KAAK;KAAK,KAAK,IAAI;KAAO;IAC1B,KAAK;KAAK,KAAK,IAAI;KAAO;IAC1B,KAAK;KAAK,KAAK,IAAI;KAAO;IAC1B,KAAK,KAAK,KAAK,IAAI;GACrB;GACA,EAAE,gBAAgB;GAClB,KAAK,cAAc;GACnB,KAAK,gBAAgB;EACvB;;CA1VA,IAAI,QAAgB;EAClB,OAAO,WAAW,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;CAClD;CAEA,IAAI,MAAM,cAAsB;EAC9B,MAAM,IAAI,OAAO,QAAQ,cAAc,gBAAgB;EACvD,KAAK,IAAI,EAAE;EACX,KAAK,IAAI,EAAE;EACX,KAAK,IAAI,EAAE;EACX,KAAK,IAAI,EAAE,WAAW;EACtB,KAAK,aAAa;CACpB;;;;;;CAOA,UAAU,QAAgC;EACxC,MAAM,IAAI,OAAO,QAAQ,QAAQ,gBAAgB;EACjD,KAAK,IAAI,EAAE;EACX,KAAK,IAAI,EAAE;EACX,KAAK,IAAI,EAAE;EACX,KAAK,IAAI,EAAE,WAAW;CAExB;CAEA,IAAI,SAAgB;EAClB,OAAO,CAAC,KAAK,QAAQ,EAAE,IAAI,KAAK,QAAQ,EAAE,EAAE;CAC9C;CAEA,IAAI,OAAO,OAAmB;EAC5B,KAAK,iBAAiB,KAAK,KAAK;CAClC;CAEA,IAAI,SAAgB;EAClB,OAAO,CAAC,KAAK,QAAQ,EAAE,IAAI,KAAK,QAAQ,EAAE,EAAE;CAC9C;CAEA,IAAI,OAAO,OAAmB;EAC5B,KAAK,iBAAiB,KAAK,KAAK;CAClC;CAEA,IAAI,SAAgB;EAClB,OAAO,CAAC,KAAK,QAAQ,EAAE,IAAI,KAAK,QAAQ,EAAE,EAAE;CAC9C;CAEA,IAAI,OAAO,OAAmB;EAC5B,KAAK,iBAAiB,KAAK,KAAK;CAClC;CAEA,IAAI,SAAgB;EAClB,OAAO,CAAC,KAAK,QAAQ,EAAE,IAAI,KAAK,QAAQ,EAAE,EAAE;CAC9C;CAEA,IAAI,OAAO,OAAmB;EAC5B,KAAK,iBAAiB,KAAK,KAAK;CAClC;CAEA,UAAU,OAAyB;EACjC,KAAK,SAAS;CAChB;CAEA,UAAU,OAAyB;EACjC,KAAK,SAAS;CAChB;CAEA,UAAU,OAAyB;EACjC,KAAK,SAAS;CAChB;CAEA,UAAU,OAAyB;EACjC,KAAK,SAAS;CAChB;CAEA,WAAoB,mBAAyC;EAC3D,IAAI,kBAAkB,IAAI,YAAY,GACpC,KAAK,uBAAuB,KAAK,KAAK,UAAU;EAClD,IAAI,kBAAkB,IAAI,YAAY,GACpC,KAAK,uBAAuB,KAAK,KAAK,UAAU;EAClD,IAAI,kBAAkB,IAAI,YAAY,GACpC,KAAK,uBAAuB,KAAK,KAAK,UAAU;EAClD,IAAI,kBAAkB,IAAI,YAAY,GACpC,KAAK,uBAAuB,KAAK,KAAK,UAAU;EAClD,MAAM,WAAW,iBAAiB;CACpC;CAEA,iBAAyB,SAAwB,OAAyB;EACxE,MAAM,aAAa,KAAK,kBAAkB,SAAS,KAAK;EACxD,IAAI,CAAC,YACH;EACF,KAAK,UAAU,SAAS,UAAU;CACpC;CAEA,kBAA0B,SAAwB,OAAiC;EACjF,IAAI,CAAC,MAAM,QAAQ,KAAK,KAAK,MAAM,SAAS,GAC1C,OAAO;EACT,MAAM,CAAC,OAAO,OAAO;EACrB,IAAI,CAAC,OAAO,SAAS,KAAK,KAAK,CAAC,OAAO,SAAS,GAAG,GACjD,OAAO;EACT,OAAO,KAAK,gBAAgB,SAAS,CAAC,OAAO,GAAG,CAAC;CACnD;CAEA,uBAA+B,SAAwB,OAA4B;EACjF,IAAI,UAAU,MAAM;GAClB,KAAK,UAAU,SAAS,eAAe,QAAQ;GAC/C;EACF;EACA,MAAM,SAAS,KAAK,kBAAkB,SAAS,KAAK;EACpD,IAAI,QACF,KAAK,UAAU,SAAS,MAAM;CAClC;CAEA,UAAkB,SAAwB,OAAoB;EAC5D,MAAM,aAAa,KAAK,gBAAgB,SAAS,KAAK;EACtD,MAAM,eAAe,KAAK,QAAQ;EAClC,IAAI,aAAa,OAAO,WAAW,MAAM,aAAa,OAAO,WAAW,IACtE;EAEF,KAAK,UAAU;GAAE,GAAG,KAAK;IAAU,UAAU;EAAW;EAExD,QAAQ,SAAR;GACE,KAAK;IACH,KAAK,IAAI,KAAK,cAAc,KAAK,KAAK,CAAC;IACvC;GACF,KAAK;IACH,KAAK,IAAI,KAAK,cAAc,KAAK,KAAK,CAAC;IACvC;GACF,KAAK;IACH,KAAK,IAAI,KAAK,cAAc,KAAK,KAAK,CAAC;IACvC;GACF,KAAK,KACH,KAAK,IAAI,KAAK,cAAc,KAAK,KAAK,CAAC;EAE3C;EAEA,KAAK,cAAc;CACrB;CAEA,UAAkB,SAA+B;EAC/C,OAAO,KAAK,QAAQ,YAAY,eAAe;CACjD;CAEA,kBAA0B,SAAwB,OAA6B;EAE7E,MAAM,QADU,MAAM,KACF,CAAC,CAAC,MAAM,KAAK,CAAC;EAClC,IAAI,MAAM,WAAW,GACnB,OAAO;EACT,MAAM,QAAQ,OAAO,MAAM,EAAE,CAAE,KAAK,CAAC;EACrC,MAAM,MAAM,OAAO,MAAM,EAAE,CAAE,KAAK,CAAC;EACnC,IAAI,CAAC,OAAO,SAAS,KAAK,KAAK,CAAC,OAAO,SAAS,GAAG,GACjD,OAAO;EACT,OAAO,KAAK,gBAAgB,SAAS,CAAC,OAAO,GAAG,CAAC;CACnD;CAEA,gBAAwB,SAAwB,OAAqB;EACnE,MAAM,SAAS,eAAe;EAC9B,MAAM,CAAC,QAAQ,UAAU;EACzB,MAAM,SAAS,KAAK,IAAI,KAAK,IAAI,QAAQ,MAAM,GAAG,OAAO,EAAE;EAC3D,MAAM,SAAS,KAAK,IAAI,KAAK,IAAI,QAAQ,MAAM,GAAG,OAAO,EAAE;EAC3D,OAAO,CACL,KAAK,IAAI,QAAQ,OAAO,EAAE,GAC1B,KAAK,IAAI,QAAQ,OAAO,EAAE,CAC5B;CACF;CAEA,cAAsB,SAAwB,OAAuB;EACnE,MAAM,CAAC,KAAK,OAAO,KAAK,UAAU,OAAO;EACzC,OAAO,KAAK,IAAI,KAAK,IAAI,OAAO,GAAG,GAAG,GAAG;CAC3C;CAEA,SAAkB;EAChB,MAAM,cAAc,SAAgC,OAAe,KAAa,KAAa,MAAc,UAAmB,cAA0C;GACtK,IAAI,UACF,OAAO;GACT,OAAO,IAAI;;uBAEM,QAAQ;mBACZ,MAAM;gBACT,IAAI;gBACJ,IAAI;;mBAED,KAAK,SAAS;iBAChB,KAAK;yBACG,KAAK,kBAAkB,aAAa,aAAa;uBACnD,UAAU;wBACT,KAAK,aAAa;8BACZ,KAAK,eAAe,SAAS,YAAY;oBACnD,MAAa,KAAK,SAAS,GAAG,OAAO,EAAE;qBACtC,MAAa,KAAK,UAAU,GAAG,OAAO,EAAE;;;EAGzD;EAEA,OAAO,IAAI;wCACyB,KAAK,WAAW;uCACjB,KAAK,YAAY;;YAE5C,WAAW,KAAK,OAAO,GAAG,KAAK,UAAU,GAAG,GAAG,GAAG,KAAK,QAAO,MAAK,GAAG,KAAK,MAAM,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;YAChG,WAAW,KAAK,aAAa,GAAG,KAAK,UAAU,GAAG,GAAG,KAAM,KAAK,QAAO,MAAK,GAAG,KAAK,MAAM,OAAO,CAAC,IAAI,GAAG,EAAE,EAAE,EAAE;YAC/G,WAAW,KAAK,UAAU,GAAG,KAAK,UAAU,GAAG,GAAG,MAAO,KAAK,QAAO,MAAK,GAAG,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,EAAE;YAChH,KAAK,QAAQ,WAAW,KAAK,WAAW,GAAG,KAAK,UAAU,GAAG,GAAG,KAAM,QAAO,MAAK,GAAG,KAAK,MAAM,OAAO,CAAC,IAAI,GAAG,EAAE,EAAE,IAAI,QAAQ;;;;CAIzI;CAEA,aAAsB,mBAAyC;EAC7D,MAAM,aAAa,iBAAiB;EACpC,KAAK,iBAAiB;CACxB;CAEA,QAAiB,mBAAyC;EACxD,MAAM,QAAQ,iBAAiB;EAK/B,IAAI,kBAAkB,IAAI,GAAG,KAAK,CAAC,KAAK,eAAe,IAAI,GAAG,GAC5D,KAAK,YAAY,KAAK;EACxB,IAAI,kBAAkB,IAAI,GAAG,KAAK,CAAC,KAAK,eAAe,IAAI,GAAG,GAC5D,KAAK,YAAY,KAAK;EACxB,IAAI,kBAAkB,IAAI,GAAG,KAAK,CAAC,KAAK,eAAe,IAAI,GAAG,GAC5D,KAAK,YAAY,KAAK;EACxB,IAAI,kBAAkB,IAAI,GAAG,KAAK,CAAC,KAAK,eAAe,IAAI,GAAG,GAC5D,KAAK,YAAY,KAAK;EACxB,KAAK,eAAe,MAAM;EAE1B,IAAI,kBAAkB,IAAI,GAAG,KAAK,kBAAkB,IAAI,GAAG,KAAK,kBAAkB,IAAI,GAAG,KAAK,kBAAkB,IAAI,GAAG,KAAK,kBAAkB,IAAI,OAAO,KAAK,kBAAkB,IAAI,iBAAiB,GACnM,KAAK,iBAAiB;CAE1B;CAEA,mBAAyB;EACvB,MAAM,IAAI,KAAK;EACf,MAAM,IAAI,KAAK;EACf,MAAM,IAAI,KAAK;EACf,MAAM,IAAI,KAAK;EAGf,MAAM,CAAC,MAAM,QAAQ,KAAK,QAAQ;EAClC,MAAM,CAAC,MAAM,QAAQ,KAAK,QAAQ;EAClC,MAAM,CAAC,MAAM,QAAQ,KAAK,QAAQ;EAClC,MAAM,CAAC,MAAM,QAAQ,KAAK,QAAQ;EAGlC,MAAM,MAAM,KAAK,kBAAkB,WAAW;EAG9C,MAAM,QAAQ,4BAA4B,IAAI,UAAU,KAAK,GAAG,EAAE,GAAG,EAAE,WAAW,KAAK,GAAG,EAAE,GAAG,EAAE;EAGjG,MAAM,QAAQ,4BAA4B,IAAI,UAAU,EAAE,GAAG,KAAK,GAAG,EAAE,WAAW,EAAE,GAAG,KAAK,GAAG,EAAE;EAMjG,MAAM,QAAQ,4BAFC,OAAO,QACI,MAC0B,WAAW,UAAU,OAAO,IAAI,UAAU,EAAE,GAAG,EAAE,GAAG,KAAK,WAAW,EAAE,GAAG,EAAE,GAAG,KAAK;EAIvI,MAAM,QAAQ;wBACM,IAAI,UAAU,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK;;;;;;EASzF,MAAM,cAAc,CAClB,sBACA,0BACF;EAEA,MAAM,iBAAiB;GACrB;GACA;GACA;GACA;GACA;GACA;EACF;EAEA,MAAM,UAA+C;GACnD,CAAC,KAAK,UAAU,KAAK;GACrB,CAAC,KAAK,UAAU,KAAK;GACrB,CAAC,KAAK,UAAU,KAAK;EACvB;EAEA,IAAI,KAAK,SAAS,KAAK,UACrB,QAAQ,KAAK,CAAC,KAAK,UAAU,KAAK,CAAC;EAErC,KAAK,MAAM,CAAC,IAAI,SAAS,SAAS;GAChC,IAAI,CAAC,IACH;GAEF,KAAK,MAAM,KAAK,aACd,GAAG,MAAM,YAAY,GAAG,IAAI;GAG9B,KAAK,MAAM,KAAK,gBACd,GAAG,MAAM,YAAY,GAAG,aAAa;EAEzC;EAGA,IAAI,KAAK,YAAY;GACnB,IAAI,KAAK,IAAI,GAAG;IACd,MAAM,YAAY;kCACQ,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE;;;;;;IAM3E,KAAK,WAAW,MAAM,aAAa;GACrC,OACE,KAAK,WAAW,MAAM,aAAa,KAAK;EAE5C;CACF;CAyBA,iBAAuB;EACrB,MAAM,SAAkC;GAAE,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,MAAM;GAAU,OAAO;EAAQ;EACrH,KAAK,cAAc,IAAI,YAAqC,SAAS;GAAE;GAAQ,SAAS;GAAM,UAAU;EAAK,CAAC,CAAC;CACjH;CAEA,kBAAwB;EACtB,MAAM,SAAkC;GAAE,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,MAAM;GAAU,OAAO;EAAQ;EACrH,KAAK,cAAc,IAAI,YAAqC,UAAU;GAAE;GAAQ,SAAS;GAAM,UAAU;EAAK,CAAC,CAAC;CAClH;;EAEgC,KAAA,SAAA,CAAC,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiInD;;AACH;AAvhBG,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,aAAA,WAAA,KAAA,KAAA,CAAA;AACzB,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,aAAA,WAAA,KAAA,KAAA,CAAA;AACzB,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,aAAA,WAAA,KAAA,KAAA,CAAA;AACzB,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,aAAA,WAAA,KAAA,KAAA,CAAA;AAEzB,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAgB,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,eAAA,KAAA,CAAA;AACpE,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAU,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,SAAA,KAAA,CAAA;AAC9D,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAU,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,SAAA,KAAA,CAAA;AAC9D,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAU,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,SAAA,KAAA,CAAA;AAC9D,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;AAAS,CAAC,CAAA,GAAA,aAAA,WAAA,SAAA,KAAA,CAAA;AAC/C,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAc,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,cAAA,KAAA,CAAA;AAClE,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAoB,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,mBAAA,KAAA,CAAA;AACxE,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAiB,SAAS;AAAK,CAAC,CAAA,GAAA,aAAA,WAAA,gBAAA,KAAA,CAAA;AAErE,WAAA,CAAA,SAAS;CAAE,MAAM;CAAQ,WAAW;AAAQ,CAAC,CAAA,GAAA,aAAA,WAAA,cAAA,KAAA,CAAA;AAG7C,WAAA,CAAA,SAAS;CAAE,MAAM;CAAQ,WAAW;AAAU,CAAC,CAAA,GAAA,aAAA,WAAA,cAAA,KAAA,CAAA;AAC/C,WAAA,CAAA,SAAS;CAAE,MAAM;CAAQ,WAAW;AAAU,CAAC,CAAA,GAAA,aAAA,WAAA,cAAA,KAAA,CAAA;AAC/C,WAAA,CAAA,SAAS;CAAE,MAAM;CAAQ,WAAW;AAAU,CAAC,CAAA,GAAA,aAAA,WAAA,cAAA,KAAA,CAAA;AAC/C,WAAA,CAAA,SAAS;CAAE,MAAM;CAAQ,WAAW;AAAU,CAAC,CAAA,GAAA,aAAA,WAAA,cAAA,KAAA,CAAA;AAS/C,WAAA,CAAA,MAAM,WAAW,CAAA,GAAA,aAAA,WAAA,YAAA,KAAA,CAAA;AACjB,WAAA,CAAA,MAAM,WAAW,CAAA,GAAA,aAAA,WAAA,YAAA,KAAA,CAAA;AACjB,WAAA,CAAA,MAAM,WAAW,CAAA,GAAA,aAAA,WAAA,YAAA,KAAA,CAAA;AACjB,WAAA,CAAA,MAAM,WAAW,CAAA,GAAA,aAAA,WAAA,YAAA,KAAA,CAAA;AACjB,WAAA,CAAA,MAAM,UAAU,CAAA,GAAA,aAAA,WAAA,cAAA,KAAA,CAAA;AAnClBA,eAAAA,WAAAA,CAAAA,kBAAc,oBAAoB,CAAA,GAAA,YAAA;;;ACKnC,IAAI,mBAAmB;AAEvB,MAAM,eAAe;CACnB,OAAO;EAAE,OAAO;EAAK,QAAQ;CAAI;CACjC,QAAQ;EAAE,OAAO;EAAK,QAAQ;CAAI;CAClC,OAAO;EAAE,OAAO;EAAK,QAAQ;CAAI;CACjC,MAAM;EAAE,OAAO;EAAK,QAAQ;CAAI;AAClC;AAIA,SAAS,iBAAiB,GAAW,GAAW,GAAW,GAAmB;CAC5E,IAAI,IAAI,GACN,OAAO;8BACmB,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE;;;;;;CAO7E,OAAO,WAAW,GAAG,GAAG,CAAC;AAC3B;AAGO,IAAM,oBAAN,MAAM,0BAA0B,WAAW;CAyChD,cAAc;EACZ,MAAM;EAzCgD,KAAA,OAAA;EAExB,KAAA,IAAA;EACA,KAAA,IAAA;EACA,KAAA,IAAA;EACA,KAAA,IAAA;EAEsC,KAAA,cAAA;EACG,KAAA,QAAA;EACA,KAAA,QAAA;EACA,KAAA,QAAA;EACf,KAAA,QAAA;EACS,KAAA,aAAA;EACpB,KAAA,OAAA;EAEpB,KAAA,UAAA;EACI,KAAA,cAAA;EAUX,KAAA,YAAA,KAAK;EACL,KAAA,YAAA,KAAK;EACL,KAAA,YAAA,KAAK;EACL,KAAA,YAAA,KAAK;EAGP,KAAA,UAAA,KAAK;EACL,KAAA,UAAA,KAAK;EACL,KAAA,UAAA,KAAK;EACL,KAAA,UAAA,KAAK;EAGK,KAAA,oBAAA;EAsEA,KAAA,oBAAA,MAAmB;GAC7C,MAAM,KAAK;GACX,KAAK,UAAU,GAAG,aAAa;GAE/B,IAAI,GAAG,aAAa,QAAQ;IAC1B,KAAK,UAAU,KAAK;IACpB,KAAK,UAAU,KAAK;IACpB,KAAK,UAAU,KAAK;IACpB,KAAK,UAAU,KAAK;IACpB,KAAK,YAAY,KAAK;IACtB,KAAK,YAAY,KAAK;IACtB,KAAK,YAAY,KAAK;IACtB,KAAK,YAAY,KAAK;IACtB,KAAK,oBAAoB;GAC3B,OAAO,IAAI,KAAK,SAAS,aAAa,CAAC,KAAK,mBAE1C,KAAK,WAAW,UAAU,WAAW,KAAK,SAAS,KAAK,SAAS,KAAK,SAAS,KAAK,OAAO,CAAC;EAEhG;EAE0B,KAAA,kBAAA,MAAmB;GAC3C,EAAE,gBAAgB;GAClB,MAAM,SAAU,EAA2C;GAE3D,IAAI,KAAK,SAAS,WAAW;IAC3B,KAAK,YAAY,OAAO;IACxB,KAAK,YAAY,OAAO;IACxB,KAAK,YAAY,OAAO;IACxB,KAAK,YAAY,OAAO,KAAK;IAC7B;GACF;GAEA,KAAK,IAAI,OAAO;GAChB,KAAK,IAAI,OAAO;GAChB,KAAK,IAAI,OAAO;GAChB,KAAK,IAAI,OAAO,KAAK;GACrB,KAAK,eAAe;EACtB;EAE2B,KAAA,mBAAA,MAAmB;GAC5C,EAAE,gBAAgB;GAClB,MAAM,SAAU,EAA2C;GAE3D,IAAI,KAAK,SAAS,WAAW;IAC3B,KAAK,YAAY,OAAO;IACxB,KAAK,YAAY,OAAO;IACxB,KAAK,YAAY,OAAO;IACxB,KAAK,YAAY,OAAO,KAAK;IAC7B;GACF;GAEA,KAAK,IAAI,OAAO;GAChB,KAAK,IAAI,OAAO;GAChB,KAAK,IAAI,OAAO;GAChB,KAAK,IAAI,OAAO,KAAK;GACrB,KAAK,gBAAgB;EACvB;EAEiC,KAAA,mBAAA;GAC/B,KAAK,IAAI,KAAK;GACd,KAAK,IAAI,KAAK;GACd,KAAK,IAAI,KAAK;GACd,KAAK,IAAI,KAAK;GACd,KAAK,oBAAoB;GACzB,KAAK,gBAAgB;GACrB,IAAI;IACF,KAAM,SAAuD,YAAY;GAC3E,QAAQ,CAER;EACF;EAEyB,KAAA,iBAAA,YAA2B;GAClD,IAAI,CAAC,KAAK,aAAa;IACrB,KAAK,cAAc;IACnB,MAAM,KAAK;GACb;GACA,IAAI;IACF,KAAM,SAAuD,YAAY;GAC3E,QAAQ,CAER;EACF;EApJE,MAAM,KAAK,EAAE;EACb,KAAK,OAAO,YAAY;EACxB,KAAK,cAAc,qBAAqB;EACxC,KAAK,WAAW,kBAAkB;CACpC;CAEA,IAAI,QAAgB;EAClB,OAAO,WAAW,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;CAClD;CAEA,IAAI,MAAM,QAA0B;EAClC,KAAK,UAAU,MAAM;CACvB;CAEA,IAAY,oBAA6B;EAGvC,IAAI,KAAK,SAAS,SAChB,OAAO,CAAC,KAAK;EACf,OAAO;CACT;CAEA,IAAY,oBAAuD;EACjE,OAAO,aAAa,KAAK,SAAS,aAAa;CACjD;CAEA,UAAU,QAAgC;EACxC,MAAM,IAAI,OAAO,QAAQ,QAAQ,gBAAgB;EACjD,KAAK,IAAI,EAAE;EACX,KAAK,IAAI,EAAE;EACX,KAAK,IAAI,EAAE;EACX,KAAK,IAAI,EAAE,WAAW;CACxB;CAEA,aAAsB,mBAAyC;EAC7D,MAAM,aAAa,iBAAiB;EACpC,KAAK,wBAAwB;EAC7B,KAAK,wBAAwB;CAC/B;CAEA,QAAiB,mBAAyC;EACxD,MAAM,QAAQ,iBAAiB;EAG/B,IAFsB,kBAAkB,IAAI,GAAG,KAAK,kBAAkB,IAAI,GAAG,KACxE,kBAAkB,IAAI,GAAG,KAAK,kBAAkB,IAAI,GAAG,GAE1D,KAAK,wBAAwB;CAEjC;CAEA,0BAAwC;EACtC,MAAM,SAAS,KAAK,YAAY,cAAc,SAAS;EACvD,IAAI,QACF,OAAO,MAAM,YAAY,eAAe,KAAK,WAAW;EAE1D,IAAI,KAAK,UACP,KAAK,SAAS,MAAM,YAAY,mBAAmB,KAAK,WAAW;CAEvE;CAEA,0BAAwC;EACtC,MAAM,SAAS,KAAK,YAAY,cAAc,SAAS;EACvD,IAAI,QACF,OAAO,MAAM,aAAa,iBAAiB,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;CAE7E;CAsFA,iBAA+B;EAC7B,MAAM,SAAkC;GAAE,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,MAAM;GAAU,OAAO;EAAQ;EACrH,KAAK,cAAc,IAAI,YAAqC,SAAS;GAAE;GAAQ,SAAS;GAAM,UAAU;EAAK,CAAC,CAAC;CACjH;CAEA,kBAAgC;EAC9B,MAAM,SAAkC;GAAE,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,GAAG,KAAK;GAAG,MAAM;GAAU,OAAO;EAAQ;EACrH,KAAK,cAAc,IAAI,YAAqC,UAAU;GAAE;GAAQ,SAAS;GAAM,UAAU;EAAK,CAAC,CAAC;CAClH;CAEA,SAAkB;EAChB,OAAO,IAAI;;;iBAGE,KAAK,eAAe;mCACF,KAAK,MAAM;yBACrB,KAAK,QAAQ;;;;cAIxB,KAAK,SAAS;;;;;sCAKU,KAAK,kBAAkB,MAAM,2BAA2B,KAAK,kBAAkB,OAAO;kBAC1G,KAAK,iBAAiB;;UAE9B,KAAK,cACH,IAAI;;iBAEC,KAAK,EAAE;iBACP,KAAK,EAAE;iBACP,KAAK,EAAE;iBACP,KAAK,EAAE;2BACG,KAAK,kBAAkB,MAAM,YAAY,KAAK,kBAAkB,OAAO;4BACtE,KAAK,kBAAkB;sBAC7B,KAAK,MAAM;sBACX,KAAK,MAAM;sBACX,KAAK,MAAM;sBACX,KAAK,MAAM;0BACP,KAAK,WAAW;;qBAErB,KAAK,eAAe;sBACnB,KAAK,gBAAgB;;YAE/B,KAAK,SAAS,YACZ,IAAI;iDAC+B,KAAK,WAAW;gBACjD,WAAW,UAAU,EAAE;;cAGzB,QAAQ;YAEV,QAAQ;;;CAGlB;;EAEgC,KAAA,SAAA;GAAC;GAAgB;GAAoB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgGvE;;AACH;AA5VG,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,kBAAA,WAAA,QAAA,KAAA,CAAA;AAEzB,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,kBAAA,WAAA,KAAA,KAAA,CAAA;AACzB,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,kBAAA,WAAA,KAAA,KAAA,CAAA;AACzB,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,kBAAA,WAAA,KAAA,KAAA,CAAA;AACzB,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,kBAAA,WAAA,KAAA,KAAA,CAAA;AAEzB,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;AAAe,CAAC,CAAA,GAAA,kBAAA,WAAA,eAAA,KAAA,CAAA;AACrD,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAU,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,SAAA,KAAA,CAAA;AAC9D,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAU,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,SAAA,KAAA,CAAA;AAC9D,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;CAAU,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,SAAA,KAAA,CAAA;AAC9D,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;AAAS,CAAC,CAAA,GAAA,kBAAA,WAAA,SAAA,KAAA,CAAA;AAC/C,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,WAAW;AAAa,CAAC,CAAA,GAAA,kBAAA,WAAA,cAAA,KAAA,CAAA;AACnD,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,kBAAA,WAAA,QAAA,KAAA,CAAA;AAEzB,WAAA,CAAA,MAAM,CAAA,GAAA,kBAAA,WAAA,WAAA,KAAA,CAAA;AACN,WAAA,CAAA,MAAM,CAAA,GAAA,kBAAA,WAAA,eAAA,KAAA,CAAA;AAEN,WAAA,CAAA,MAAM,QAAQ,CAAA,GAAA,kBAAA,WAAA,YAAA,KAAA,CAAA;AACd,WAAA,CAAA,MAAM,oBAAoB,CAAA,GAAA,kBAAA,WAAA,aAAA,KAAA,CAAA;AArB5BC,oBAAAA,WAAAA,CAAAA,kBAAc,0BAA0B,CAAA,GAAA,iBAAA"}
+{"version":3,"file":"colour-picker-BSDBL-QL.js","names":["customElement","customElement"],"sources":["../src/colour-picker/util.ts","../src/colour-picker/colour-picker.ts","../src/colour-picker/colour-picker-popup.ts"],"sourcesContent":["import type { Range, SliderType } from \"./types\";\n\nexport const MAX_CHROMA = 0.4;\nexport const RANGE_LIMITS: Record<SliderType, Range> = {\n  l: [0, 1],\n  c: [0, MAX_CHROMA],\n  h: [0, 360],\n  a: [0, 1],\n} as const;\nexport const DEFAULT_RANGES: Record<SliderType, Range> = {\n  l: RANGE_LIMITS.l,\n  c: RANGE_LIMITS.c,\n  h: RANGE_LIMITS.h,\n  a: RANGE_LIMITS.a,\n} as const;\n\nexport function rangeSpan([min, max]: Range): number {\n  return Math.max(max - min, 0);\n}\n\nexport function cloneRange(range: Range): Range {\n  return [range[0], range[1]] as Range;\n}\n\n/**\n * Convert OKLCH to a CSS string\n */\nexport function oklchToCss(l: number, c: number, h: number, a: number = 1): string {\n  if (a < 1) {\n    return `oklch(${l} ${c} ${h} / ${a})`;\n  }\n  return `oklch(${l} ${c} ${h})`;\n}\n\n/**\n * Clamp a value between min and max\n */\nexport function clamp(value: number, min: number, max: number): number {\n  return Math.min(Math.max(value, min), max);\n}\n","/**\n * <ixfx-colour-picker> — OKLCH colour picker using CSS-gradient-rendered sliders.\n *\n * Properties:\n *   l — lightness 0..1\n *   c — chroma 0..0.4\n *   h — hue 0..360\n *\n * Getters:\n *   value — current color as CSS string e.g. \"oklch(0.7 0.15 180)\"\n *\n * Methods:\n *   setColour(colour: Colour.Colourish) — programmatically set colour from any\n *     ixfx-compatible format; also resets double-click defaults for all sliders.\n *\n * Events:\n *   input — CustomEvent { detail: { l, c, h } }\n *\n * Double-click any slider label to reset that channel to the last\n * programmatically set value (not the user-dialled value).\n */\nimport type { CSSResultGroup, PropertyValues } from 'lit';\nimport type { ColourPickerEventDetail, Range, RangeInput } from './types.js';\nimport { Colour } from '@ixfx/visual';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\nimport { DEFAULT_RANGES, oklchToCss } from './util.js';\nimport '../labelled-range-input/index.js';\n\ntype ChannelSlider = `l` | `c` | `h` | `a`;\n\n@customElement(`ixfx-colour-picker`)\nexport class ColourPicker extends LitElement {\n  @property({ type: Number }) l = 0.7;\n  @property({ type: Number }) c = 0.15;\n  @property({ type: Number }) h = 180;\n  @property({ type: Number }) a = 1;\n\n  @property({ type: Boolean, attribute: `hide-preview`, reflect: true }) hidePreview = false;\n  @property({ type: Boolean, attribute: `hide-h`, reflect: true }) hideH = false;\n  @property({ type: Boolean, attribute: `hide-l`, reflect: true }) hideL = false;\n  @property({ type: Boolean, attribute: `hide-c`, reflect: true }) hideC = false;\n  @property({ type: Boolean, attribute: `show-a` }) showA = false;\n  @property({ type: Boolean, attribute: `horizontal`, reflect: true }) horizontal = false;\n  @property({ type: Boolean, attribute: `sliders-vertical`, reflect: true }) slidersVertical = false;\n  @property({ type: Boolean, attribute: `hide-tooltips`, reflect: true }) hideTooltips = false;\n\n  @property({ type: String, attribute: `value` })\n  private _valueAttr: string | null = null;\n\n  @property({ type: String, attribute: `range-l` }) rangeLAttr: string | null = null;\n  @property({ type: String, attribute: `range-c` }) rangeCAttr: string | null = null;\n  @property({ type: String, attribute: `range-h` }) rangeHAttr: string | null = null;\n  @property({ type: String, attribute: `range-a` }) rangeAAttr: string | null = null;\n\n  private _ranges: Record<ChannelSlider, Range> = {\n    l: DEFAULT_RANGES.l,\n    c: DEFAULT_RANGES.c,\n    h: DEFAULT_RANGES.h,\n    a: DEFAULT_RANGES.a,\n  };\n\n  @query(`#slider-l`) _sliderL!: HTMLElement;\n  @query(`#slider-c`) _sliderC!: HTMLElement;\n  @query(`#slider-h`) _sliderH!: HTMLElement;\n  @query(`#slider-a`) _sliderA!: HTMLElement;\n  @query(`.preview`) _previewEl!: HTMLElement;\n\n  // Last programmatically-set values — used as double-click reset targets.\n  // Initialised to the component's own defaults.\n  private _defaultL = this.l;\n  private _defaultC = this.c;\n  private _defaultH = this.h;\n  private _defaultA = this.a;\n\n  // Keys are added synchronously in input handlers and cleared only inside\n  // updated() (which runs asynchronously). This means updated() can reliably\n  // tell whether a property change was user-initiated or programmatic.\n  private readonly _userInitiated = new Set<string>();\n\n  get value(): string {\n    return oklchToCss(this.l, this.c, this.h, this.a);\n  }\n\n  set value(colourString: string) {\n    const c = Colour.convert(colourString, `oklch-absolute`);\n    this.l = c.l;\n    this.c = c.c;\n    this.h = c.h;\n    this.a = c.opacity ?? 1;\n    this._valueAttr = colourString;\n  }\n\n  /**\n   * Set the colour from any ixfx-compatible format (CSS string, OkLch object,\n   * HSL object, etc.). Also updates the double-click reset defaults for all\n   * sliders.\n   */\n  setColour(colour: Colour.Colourish): void {\n    const c = Colour.convert(colour, `oklch-absolute`);\n    this.l = c.l;\n    this.c = c.c;\n    this.h = c.h;\n    this.a = c.opacity ?? 1;\n    // No _userInitiated keys added → updated() will set _defaultL/C/H/A. ✓\n  }\n\n  get rangeL(): Range {\n    return [this._ranges.l[0], this._ranges.l[1]];\n  }\n\n  set rangeL(range: RangeInput) {\n    this._applyRangeInput(`l`, range);\n  }\n\n  get rangeC(): Range {\n    return [this._ranges.c[0], this._ranges.c[1]];\n  }\n\n  set rangeC(range: RangeInput) {\n    this._applyRangeInput(`c`, range);\n  }\n\n  get rangeH(): Range {\n    return [this._ranges.h[0], this._ranges.h[1]];\n  }\n\n  set rangeH(range: RangeInput) {\n    this._applyRangeInput(`h`, range);\n  }\n\n  get rangeA(): Range {\n    return [this._ranges.a[0], this._ranges.a[1]];\n  }\n\n  set rangeA(range: RangeInput) {\n    this._applyRangeInput(`a`, range);\n  }\n\n  setRangeL(range: RangeInput): void {\n    this.rangeL = range;\n  }\n\n  setRangeC(range: RangeInput): void {\n    this.rangeC = range;\n  }\n\n  setRangeH(range: RangeInput): void {\n    this.rangeH = range;\n  }\n\n  setRangeA(range: RangeInput): void {\n    this.rangeA = range;\n  }\n\n  override willUpdate(changedProperties: PropertyValues): void {\n    if (changedProperties.has(`rangeLAttr`))\n      this._setRangeFromAttribute(`l`, this.rangeLAttr);\n    if (changedProperties.has(`rangeCAttr`))\n      this._setRangeFromAttribute(`c`, this.rangeCAttr);\n    if (changedProperties.has(`rangeHAttr`))\n      this._setRangeFromAttribute(`h`, this.rangeHAttr);\n    if (changedProperties.has(`rangeAAttr`))\n      this._setRangeFromAttribute(`a`, this.rangeAAttr);\n    super.willUpdate(changedProperties);\n  }\n\n  private _applyRangeInput(channel: ChannelSlider, input: RangeInput): void {\n    const normalized = this._coerceRangeInput(channel, input);\n    if (!normalized)\n      return;\n    this._setRange(channel, normalized);\n  }\n\n  private _coerceRangeInput(channel: ChannelSlider, input: RangeInput): Range | null {\n    if (!Array.isArray(input) || input.length < 2)\n      return null;\n    const [start, end] = input;\n    if (!Number.isFinite(start) || !Number.isFinite(end))\n      return null;\n    return this._normalizeRange(channel, [start, end]);\n  }\n\n  private _setRangeFromAttribute(channel: ChannelSlider, value: string | null): void {\n    if (value === null) {\n      this._setRange(channel, DEFAULT_RANGES[channel]);\n      return;\n    }\n    const parsed = this._parseRangeString(channel, value);\n    if (parsed)\n      this._setRange(channel, parsed);\n  }\n\n  private _setRange(channel: ChannelSlider, range: Range): void {\n    const normalized = this._normalizeRange(channel, range);\n    const currentRange = this._ranges[channel];\n    if (currentRange[0] === normalized[0] && currentRange[1] === normalized[1])\n      return;\n\n    this._ranges = { ...this._ranges, [channel]: normalized };\n\n    switch (channel) {\n      case `l`:\n        this.l = this._clampToRange(`l`, this.l);\n        break;\n      case `c`:\n        this.c = this._clampToRange(`c`, this.c);\n        break;\n      case `h`:\n        this.h = this._clampToRange(`h`, this.h);\n        break;\n      case `a`:\n        this.a = this._clampToRange(`a`, this.a);\n        break;\n    }\n\n    this.requestUpdate();\n  }\n\n  private _getRange(channel: ChannelSlider): Range {\n    return this._ranges[channel] ?? DEFAULT_RANGES[channel];\n  }\n\n  private _parseRangeString(channel: ChannelSlider, value: string): Range | null {\n    const cleaned = value.trim();\n    const parts = cleaned.split(`-`, 2);\n    if (parts.length !== 2)\n      return null;\n    const start = Number(parts[0]!.trim());\n    const end = Number(parts[1]!.trim());\n    if (!Number.isFinite(start) || !Number.isFinite(end))\n      return null;\n    return this._normalizeRange(channel, [start, end]);\n  }\n\n  private _normalizeRange(channel: ChannelSlider, range: Range): Range {\n    const limits = DEFAULT_RANGES[channel];\n    const [rawMin, rawMax] = range;\n    const minVal = Math.min(Math.min(rawMin, rawMax), limits[1]);\n    const maxVal = Math.max(Math.max(rawMin, rawMax), limits[0]);\n    return [\n      Math.max(minVal, limits[0]),\n      Math.min(maxVal, limits[1]),\n    ];\n  }\n\n  private _clampToRange(channel: ChannelSlider, value: number): number {\n    const [min, max] = this._getRange(channel);\n    return Math.min(Math.max(value, min), max);\n  }\n\n  override render() {\n    const makeSlider = (channel: `l` | `c` | `h` | `a`, label: string, min: number, max: number, step: number, isHidden: boolean, formatter?: (value: string) => string) => {\n      if (isHidden)\n        return nothing;\n      return html`\n        <ixfx-labelled-range-input\n          id=\"slider-${channel}\"\n          label=\"${label}\"\n          min=${min}\n          max=${max}\n          mini-width-threshold=200\n          .value=${this[channel]}\n          step=${step}\n          .orientation=${this.slidersVertical ? `vertical` : `horizontal`}\n          .formatter=${formatter}\n          ?no-tooltip=${this.hideTooltips}\n          .displayTextLogic=${this.hideTooltips ? `show` : `transient`}\n          @input=${(e: Event) => this._onInput(e, channel)}\n          @change=${(e: Event) => this._onChange(e, channel)}\n        ></ixfx-labelled-range-input>\n      `;\n    };\n\n    return html`\n      <div class=\"picker\" ?horizontal=${this.horizontal}>\n        <div class=\"preview\" ?hidden=${this.hidePreview}></div>\n        <div class=\"sliders\">\n          ${makeSlider(`h`, `Hue`, ...this._getRange(`h`), 1, this.hideH, v => `${Math.round(Number(v))}°`)}\n          ${makeSlider(`l`, `Lightness`, ...this._getRange(`l`), 0.01, this.hideL, v => `${Math.round(Number(v) * 100)}%`)}\n          ${makeSlider(`c`, `Chroma`, ...this._getRange(`c`), 0.005, this.hideC, v => `${Number.parseFloat(v).toFixed(2)}`)}\n          ${this.showA ? makeSlider(`a`, `Opacity`, ...this._getRange(`a`), 0.01, false, v => `${Math.round(Number(v) * 100)}%`) : nothing}\n        </div>\n      </div>\n    `;\n  }\n\n  override firstUpdated(changedProperties: PropertyValues): void {\n    super.firstUpdated(changedProperties);\n    this._updateGradients();\n  }\n\n  override updated(changedProperties: PropertyValues): void {\n    super.updated(changedProperties);\n\n    // Update reset defaults only for programmatic changes (not user input).\n    // _userInitiated is populated synchronously in input handlers and cleared\n    // here, so it correctly reflects what changed since the last render.\n    if (changedProperties.has(`l`) && !this._userInitiated.has(`l`))\n      this._defaultL = this.l;\n    if (changedProperties.has(`c`) && !this._userInitiated.has(`c`))\n      this._defaultC = this.c;\n    if (changedProperties.has(`h`) && !this._userInitiated.has(`h`))\n      this._defaultH = this.h;\n    if (changedProperties.has(`a`) && !this._userInitiated.has(`a`))\n      this._defaultA = this.a;\n    this._userInitiated.clear();\n\n    if (changedProperties.has(`l`) || changedProperties.has(`c`) || changedProperties.has(`h`) || changedProperties.has(`a`) || changedProperties.has(`showA`) || changedProperties.has(`slidersVertical`)) {\n      this._updateGradients();\n    }\n  }\n\n  _updateGradients(): void {\n    const l = this.l;\n    const c = this.c;\n    const h = this.h;\n    const a = this.a;\n\n    // Get actual ranges from this._ranges (may be restricted via attributes)\n    const [lMin, lMax] = this._ranges.l;\n    const [cMin, cMax] = this._ranges.c;\n    const [hMin, hMax] = this._ranges.h;\n    const [aMin, aMax] = this._ranges.a;\n\n    // Gradient direction: vertical sliders fill bottom→top (bottom = min, top = max).\n    const dir = this.slidersVertical ? `to top` : `to right`;\n\n    // L slider: black → white at current chroma + hue, using actual range\n    const lGrad = `linear-gradient(in oklch ${dir}, oklch(${lMin} ${c} ${h}), oklch(${lMax} ${c} ${h}))`;\n\n    // C slider: neutral grey → fully saturated at current lightness + hue, using actual range\n    const cGrad = `linear-gradient(in oklch ${dir}, oklch(${l} ${cMin} ${h}), oklch(${l} ${cMax} ${h}))`;\n\n    // H slider: hue range at current lightness + chroma.\n    // Use 'longer hue' for full 0-360 range, 'shorter hue' for restricted ranges.\n    const hRange = hMax - hMin;\n    const hLonger = hRange >= 300; // Full or near-full hue range\n    const hGrad = `linear-gradient(in oklch ${hLonger ? `longer` : `shorter`} hue ${dir}, oklch(${l} ${c} ${hMin}), oklch(${l} ${c} ${hMax}))`;\n\n    // A slider: transparent to opaque at current colour, using actual range.\n    // Includes checkerboard pattern as bottom layer, with opacity gradient on top.\n    const aGrad = `\n      linear-gradient(${dir}, oklch(${l} ${c} ${h} / ${aMin}), oklch(${l} ${c} ${h} / ${aMax})),\n      repeating-conic-gradient(\n        var(--surface-2) 0% 25%,\n        var(--surface-4) 0% 50%\n      ) 50% / 16px 16px\n    `;\n\n    // Set gradient on --background-track (goes to .range-bg, the track background)\n    // Set --background-track-value to transparent to hide the filled-portion bar\n    const trackBgVars = [\n      `--background-track`,\n      `--background-track-hover`,\n    ] as const;\n\n    const trackValueVars = [\n      `--background-track-value`,\n      `--background-track-value-hover`,\n      `--background-track-value-active`,\n      `--background-track-value-vertical`,\n      `--background-track-value-hover-vertical`,\n      `--background-track-value-active-vertical`,\n    ] as const;\n\n    const sliders: Array<[HTMLElement | null, string]> = [\n      [this._sliderL, lGrad],\n      [this._sliderC, cGrad],\n      [this._sliderH, hGrad],\n    ];\n\n    if (this.showA && this._sliderA)\n      sliders.push([this._sliderA, aGrad]);\n\n    for (const [el, grad] of sliders) {\n      if (!el)\n        continue;\n      // Set gradient on track background (.range-bg)\n      for (const v of trackBgVars) {\n        el.style.setProperty(v, grad);\n      }\n      // Hide the filled-portion bar (track pseudo-element)\n      for (const v of trackValueVars) {\n        el.style.setProperty(v, `transparent`);\n      }\n    }\n\n    // Preview swatch background - show checkerboard behind when opacity < 1\n    if (this._previewEl) {\n      if (this.a < 1) {\n        const previewBg = `\n          linear-gradient(oklch(${l} ${c} ${h} / ${a}), oklch(${l} ${c} ${h} / ${a})),\n          repeating-conic-gradient(\n            var(--surface-2) 0% 25%,\n            var(--surface-4) 0% 50%\n          ) 50% / 16px 16px\n        `;\n        this._previewEl.style.background = previewBg;\n      } else {\n        this._previewEl.style.background = this.value;\n      }\n    }\n  }\n\n  _onInput = (e: Event, channel: `l` | `c` | `h` | `a`): void => {\n    const detail = (e as CustomEvent).detail;\n    this._userInitiated.add(channel);\n    this[channel] = detail.value;\n    this._dispatchInput();\n    e.stopPropagation();\n  };\n\n  _onChange = (e: Event, channel: `l` | `c` | `h` | `a`): void => {\n    const detail = (e as CustomEvent).detail;\n    this._userInitiated.add(channel);\n    const value = typeof detail.value === `string` ? Number.parseFloat(detail.value) : detail.value;\n    switch (channel) {\n      case `l`: this.l = value; break;\n      case `c`: this.c = value; break;\n      case `h`: this.h = value; break;\n      case `a`: this.a = value; break;\n    }\n    e.stopPropagation();\n    this.requestUpdate();\n    this._dispatchChange();\n  };\n\n  _dispatchInput(): void {\n    const detail: ColourPickerEventDetail = { l: this.l, c: this.c, h: this.h, a: this.a, unit: `scalar`, space: `oklch` };\n    this.dispatchEvent(new CustomEvent<ColourPickerEventDetail>(`input`, { detail, bubbles: true, composed: true }));\n  }\n\n  _dispatchChange(): void {\n    const detail: ColourPickerEventDetail = { l: this.l, c: this.c, h: this.h, a: this.a, unit: `scalar`, space: `oklch` };\n    this.dispatchEvent(new CustomEvent<ColourPickerEventDetail>(`change`, { detail, bubbles: true, composed: true }));\n  }\n\n  static styles: CSSResultGroup = [themeFallbacks, css`\n    /*\n     * Default intrinsic size — not determined by label text.\n     * Override via CSS: ixfx-colour-picker { width: 100%; height: 200px; }\n     * Or via custom properties: --picker-alt-width, --picker-alt-min-slider-height\n     */\n    :host {\n      display: block;\n      width: var(--picker-alt-width, 240px);\n      height: var(--picker-alt-height, 240px);\n      --_radius-m: var(--radius-m, 4px);\n      --_radius-s: var(--radius-m, 3px);\n      container-type: size;\n    }\n\n    .picker {\n      display: flex;\n      flex-direction: column;\n      gap: var(--space-s, 8px);\n      width: 100%;\n      height: 100%;\n      overflow: hidden;\n    }\n\n    .picker[horizontal] {\n      flex-direction: row;\n      align-items: stretch;\n    }\n\n    .sliders {\n      display: flex;\n      flex-direction: column;\n      gap: var(--space-s, 8px);\n      flex: 1;\n      min-height: 0;\n    }\n\n    .picker[horizontal] .sliders {\n      flex-direction: column;\n    }\n\n    .preview {\n      flex-shrink: 0;\n      height: 30%;\n      border-radius: var(--_radius-m);\n      border: 1px solid rgba(0, 0, 0, 0.2);\n    }\n\n    .preview[hidden] {\n      display: none;\n    }\n\n    .picker[horizontal] .preview {\n      width: 3em;\n      height: auto;\n      flex-shrink: 0;\n    }\n\n    ixfx-labelled-range-input {\n      flex: 1;\n      min-height: var(--picker-alt-min-slider-height, 2.5em);\n      width: 100%;\n      min-width: 0;\n      --track-thickness: 2em;\n      --track-radius: var(--_radius-s);\n      --label-width: 5em;\n      --thumb-thickness: 4px;\n      --thumb-color: rgba(255, 255, 255, 0.9);\n      --thumb-color-active: white;\n      --thumb-radius: 3px;\n      --thumb-border: 2px solid rgba(255, 255, 255, 0.85);\n      --thumb-shadow: 0 0 0 2px rgba(0, 0, 0, 0.65);\n    }\n\n    /* Vertical sliders mode: sliders are side-by-side vertical bars */\n    :host([sliders-vertical]) .sliders {\n      flex-direction: row;\n      align-items: stretch;\n    }\n\n    :host([sliders-vertical]) ixfx-labelled-range-input {\n      width: auto;\n      height: 100%;\n      min-height: 0;\n      --mini: 1;             /* force mini mode: no label, tooltip on hover */\n      --track-thickness: 100%;  /* fill full width of the narrow slider */\n    }\n\n    /* Landscape */\n    @container (aspect-ratio > 1) {\n      .picker {\n        flex-direction: row;\n        display:flex;\n        align-items: stretch;\n\n      }\n      .preview {\n        width: 30%;\n        height: unset;\n      }\n      .sliders {\n        height: 100%;\n        overflow: hidden;\n      }\n    }\n\n    /* Small height. Show as landscape */\n    @container (max-height: 150px) {\n      .picker {\n        flex-direction: row;\n        align-items: stretch;\n      }\n      ixfx-labelled-range-input {\n        --track-thickness: 1em;\n        min-height: unset;\n      }\n      .preview {\n        min-width: 50%;\n        height: auto;\n      }\n    }\n\n    /* Medium height — tighter but not extreme */\n    @container (max-height: 210px) and (min-height: 150px) {\n      ixfx-labelled-range-input {\n        --track-thickness: 1.6em;\n        min-height: 1.8em;\n      }\n    }\n  `];\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ixfx-colour-picker': ColourPicker;\n  }\n}\n","/**\n * <ixfx-colour-picker-popup> — inline colour swatch that opens an ixfx-colour-picker\n * in a native popover.\n *\n * Properties:\n *   mode       — \"fluid\" (default) | \"confirm\"\n *   l, c, h, a — committed OKLCH values\n *   hide-h, hide-l, hide-c, show-a, horizontal — passed to inner picker\n *   show-preview — show the colour preview swatch inside the picker (fluid mode hides it by default)\n *\n * Getters/setters:\n *   value — committed colour as CSS string e.g. \"oklch(0.7 0.15 180)\";\n *     setting accepts any ixfx-compatible colour format (equivalent to calling setColour())\n *\n * Methods:\n *   setColour(colour: Colour.Colourish) — programmatically set committed colour\n *\n * Events:\n *   input  — (fluid mode only) CustomEvent { detail: { l, c, h, a } }\n *   change — CustomEvent { detail: { l, c, h, a } }\n *\n * CSS custom properties:\n *   --cp-popup-swatch-size    — swatch button size (default: 1.5em)\n */\nimport type { CSSResultGroup, PropertyValues } from 'lit';\nimport type { ColourPicker } from './colour-picker.js';\nimport type { ColourPickerEventDetail } from './types.js';\nimport { Colour } from '@ixfx/visual';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport { ICON_CHECK } from '../icons/defaults.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { popupSurfaceStyles } from '../styles/popup.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\nimport { oklchToCss } from './util.js';\nimport './colour-picker.js';\n\nlet _instanceCounter = 0;\n\nconst PICKER_SIZES = {\n  small: { width: 130, height: 100 },\n  medium: { width: 100, height: 155 },\n  large: { width: 200, height: 180 },\n  huge: { width: 290, height: 240 },\n} as const;\n\ntype PickerSize = keyof typeof PICKER_SIZES;\n\nfunction swatchBackground(l: number, c: number, h: number, a: number): string {\n  if (a < 1) {\n    return `\n      linear-gradient(oklch(${l} ${c} ${h} / ${a}), oklch(${l} ${c} ${h} / ${a})),\n      repeating-conic-gradient(\n        var(--surface-2) 0% 25%,\n        var(--surface-4) 0% 50%\n      ) 50% / 8px 8px\n    `;\n  }\n  return oklchToCss(l, c, h);\n}\n\n@customElement(`ixfx-colour-picker-popup`)\nexport class ColourPickerPopup extends LitElement {\n  @property({ type: String }) mode: `fluid` | `confirm` = `fluid`;\n\n  @property({ type: Number }) l = 0.7;\n  @property({ type: Number }) c = 0.15;\n  @property({ type: Number }) h = 180;\n  @property({ type: Number }) a = 1;\n\n  @property({ type: Boolean, attribute: `show-preview` }) showPreview = false;\n  @property({ type: Boolean, attribute: `hide-h`, reflect: true }) hideH = false;\n  @property({ type: Boolean, attribute: `hide-l`, reflect: true }) hideL = false;\n  @property({ type: Boolean, attribute: `hide-c`, reflect: true }) hideC = false;\n  @property({ type: Boolean, attribute: `show-a` }) showA = false;\n  @property({ type: Boolean, attribute: `horizontal` }) horizontal = false;\n  @property({ type: String }) size: PickerSize = `medium`;\n\n  @state() private _isOpen = false;\n  @state() private _everOpened = false;\n\n  @query(`.popup`) _popupEl!: HTMLElement;\n  @query(`ixfx-colour-picker`) _pickerEl!: ColourPicker;\n\n  private readonly _uid: string;\n  private readonly _anchorName: string;\n  private readonly _popupId: string;\n\n  // Confirm mode: values being adjusted (not yet committed)\n  private _pendingL = this.l;\n  private _pendingC = this.c;\n  private _pendingH = this.h;\n  private _pendingA = this.a;\n\n  // Confirm mode: snapshot taken on open, used for revert on dismiss\n  private _savedL = this.l;\n  private _savedC = this.c;\n  private _savedH = this.h;\n  private _savedA = this.a;\n\n  // Set to true just before hidePopover() in _onConfirm to suppress revert\n  private _pendingConfirmed = false;\n\n  constructor() {\n    super();\n    const id = ++_instanceCounter;\n    this._uid = `cp-popup-${id}`;\n    this._anchorName = `--cp-popup-anchor-${id}`;\n    this._popupId = `cp-popup-panel-${id}`;\n  }\n\n  get value(): string {\n    return oklchToCss(this.l, this.c, this.h, this.a);\n  }\n\n  set value(colour: Colour.Colourish) {\n    this.setColour(colour);\n  }\n\n  private get _innerHidePreview(): boolean {\n    // Fluid mode hides the preview by default (swatch already shows live colour).\n    // show-preview overrides this. Confirm mode shows it by default.\n    if (this.mode === `fluid`)\n      return !this.showPreview;\n    return false;\n  }\n\n  private get _pickerDimensions(): { width: number; height: number } {\n    return PICKER_SIZES[this.size] ?? PICKER_SIZES.medium;\n  }\n\n  setColour(colour: Colour.Colourish): void {\n    const c = Colour.convert(colour, `oklch-absolute`);\n    this.l = c.l;\n    this.c = c.c;\n    this.h = c.h;\n    this.a = c.opacity ?? 1;\n  }\n\n  override firstUpdated(changedProperties: PropertyValues): void {\n    super.firstUpdated(changedProperties);\n    this._applyAnchorPositioning();\n    this._updateSwatchBackground();\n  }\n\n  override updated(changedProperties: PropertyValues): void {\n    super.updated(changedProperties);\n    const colourChanged = changedProperties.has(`l`) || changedProperties.has(`c`)\n      || changedProperties.has(`h`) || changedProperties.has(`a`);\n    if (colourChanged) {\n      this._updateSwatchBackground();\n    }\n  }\n\n  private _applyAnchorPositioning(): void {\n    const swatch = this.shadowRoot?.querySelector(`.swatch`) as HTMLElement | null;\n    if (swatch) {\n      swatch.style.setProperty(`anchor-name`, this._anchorName);\n    }\n    if (this._popupEl) {\n      this._popupEl.style.setProperty(`position-anchor`, this._anchorName);\n    }\n  }\n\n  private _updateSwatchBackground(): void {\n    const swatch = this.shadowRoot?.querySelector(`.swatch`) as HTMLElement | null;\n    if (swatch) {\n      swatch.style.background = swatchBackground(this.l, this.c, this.h, this.a);\n    }\n  }\n\n  private _onPopoverToggle = (e: Event): void => {\n    const te = e as ToggleEvent;\n    this._isOpen = te.newState === `open`;\n\n    if (te.newState === `open`) {\n      this._savedL = this.l;\n      this._savedC = this.c;\n      this._savedH = this.h;\n      this._savedA = this.a;\n      this._pendingL = this.l;\n      this._pendingC = this.c;\n      this._pendingH = this.h;\n      this._pendingA = this.a;\n      this._pendingConfirmed = false;\n    } else if (this.mode === `confirm` && !this._pendingConfirmed) {\n      // Dismissed without confirming — reset inner picker to saved values\n      this._pickerEl?.setColour(oklchToCss(this._savedL, this._savedC, this._savedH, this._savedA));\n    }\n  };\n\n  private _onPickerInput = (e: Event): void => {\n    e.stopPropagation();\n    const detail = (e as CustomEvent<ColourPickerEventDetail>).detail;\n\n    if (this.mode === `confirm`) {\n      this._pendingL = detail.l;\n      this._pendingC = detail.c;\n      this._pendingH = detail.h;\n      this._pendingA = detail.a ?? 1;\n      return;\n    }\n\n    this.l = detail.l;\n    this.c = detail.c;\n    this.h = detail.h;\n    this.a = detail.a ?? 1;\n    this._dispatchInput();\n  };\n\n  private _onPickerChange = (e: Event): void => {\n    e.stopPropagation();\n    const detail = (e as CustomEvent<ColourPickerEventDetail>).detail;\n\n    if (this.mode === `confirm`) {\n      this._pendingL = detail.l;\n      this._pendingC = detail.c;\n      this._pendingH = detail.h;\n      this._pendingA = detail.a ?? 1;\n      return;\n    }\n\n    this.l = detail.l;\n    this.c = detail.c;\n    this.h = detail.h;\n    this.a = detail.a ?? 1;\n    this._dispatchChange();\n  };\n\n  private _onConfirm = (): void => {\n    this.l = this._pendingL;\n    this.c = this._pendingC;\n    this.h = this._pendingH;\n    this.a = this._pendingA;\n    this._pendingConfirmed = true;\n    this._dispatchChange();\n    try {\n      (this._popupEl as HTMLElement & { hidePopover: () => void }).hidePopover();\n    } catch {\n      // Popover API not supported\n    }\n  };\n\n  private _onSwatchClick = async (): Promise<void> => {\n    if (!this._everOpened) {\n      this._everOpened = true;\n      await this.updateComplete;\n    }\n    try {\n      (this._popupEl as HTMLElement & { showPopover: () => void }).showPopover();\n    } catch {\n      // Popover API not supported\n    }\n  };\n\n  private _dispatchInput(): void {\n    const detail: ColourPickerEventDetail = { l: this.l, c: this.c, h: this.h, a: this.a, unit: `scalar`, space: `oklch` };\n    this.dispatchEvent(new CustomEvent<ColourPickerEventDetail>(`input`, { detail, bubbles: true, composed: true }));\n  }\n\n  private _dispatchChange(): void {\n    const detail: ColourPickerEventDetail = { l: this.l, c: this.c, h: this.h, a: this.a, unit: `scalar`, space: `oklch` };\n    this.dispatchEvent(new CustomEvent<ColourPickerEventDetail>(`change`, { detail, bubbles: true, composed: true }));\n  }\n\n  override render() {\n    return html`\n      <button\n        class=\"swatch\"\n        @click=${this._onSwatchClick}\n        aria-label=\"Pick colour: ${this.value}\"\n        aria-expanded=\"${this._isOpen}\"\n        aria-haspopup=\"dialog\"\n      ></button>\n      <div\n        id=\"${this._popupId}\"\n        class=\"popup popup-surface\"\n        popover=\"auto\"\n        role=\"dialog\"\n        aria-label=\"Colour picker\"\n        style=\"--cp-popup-min-width:${this._pickerDimensions.width}px;--cp-popup-min-height:${this._pickerDimensions.height}px\"\n        @toggle=${this._onPopoverToggle}\n      >\n        ${this._everOpened\n          ? html`\n          <ixfx-colour-picker\n            .l=${this.l}\n            .c=${this.c}\n            .h=${this.h}\n            .a=${this.a}\n            style=\"width:${this._pickerDimensions.width}px;height:${this._pickerDimensions.height}px\"\n            ?hide-preview=${this._innerHidePreview}\n            ?hide-h=${this.hideH}\n            ?hide-l=${this.hideL}\n            ?hide-c=${this.hideC}\n            ?show-a=${this.showA}\n            ?horizontal=${this.horizontal}\n            hide-tooltips\n            @input=${this._onPickerInput}\n            @change=${this._onPickerChange}\n          ></ixfx-colour-picker>\n          ${this.mode === `confirm`\n            ? html`\n            <button class=\"confirm-btn\" @click=${this._onConfirm} aria-label=\"Confirm colour\" title=\"Confirm colour\">\n              ${unsafeHTML(ICON_CHECK)}\n            </button>\n          `\n            : nothing}\n        `\n          : nothing}\n      </div>\n    `;\n  }\n\n  static styles: CSSResultGroup = [themeFallbacks, popupSurfaceStyles, css`\n    :host {\n      display: inline-block;\n    }\n\n    .swatch {\n      display: inline-block;\n      width: var(--cp-popup-swatch-size, 1.5em);\n      height: var(--cp-popup-swatch-size, 1.5em);\n      border-radius: var(--radius-m, 4px);\n      border: 1px solid rgba(0, 0, 0, 0.2);\n      cursor: pointer;\n      padding: 0;\n      box-sizing: border-box;\n      vertical-align: middle;\n      transition: transform 0.1s ease, box-shadow 0.1s ease;\n    }\n\n    .swatch:hover {\n      transform: scale(1.1);\n    }\n\n    .swatch:focus-visible {\n      outline: 2px solid var(--accent, oklch(60% 0.15 140));\n      outline-offset: 2px;\n    }\n\n    /* Popover panel */\n    .popup {\n      display:flex;\n      flex-direction: column;\n      gap: var(--space-s);\n      /* Reset popover UA inset */\n      inset: unset;\n      margin: 0;\n\n      min-width: var(--cp-popup-min-width);\n      min-height: var(--cp-popup-min-height);\n\n      /* CSS anchor positioning — position-anchor set via inline style in JS */\n      position: fixed;\n      position-area: block-end span-inline-start;\n      position-try-fallbacks: flip-block, flip-inline, flip-block flip-inline;\n      margin-block-start: 4px;\n\n      padding: var(--space-l);\n      z-index: 100;\n\n      /* Animate in/out */\n      opacity: 0;\n      scale: 0.97;\n      pointer-events: none;\n      transition: opacity 0.12s ease, scale 0.12s ease;\n    }\n\n    .popup:popover-open {\n      opacity: 1;\n      scale: 1;\n      pointer-events: auto;\n    }\n\n    ixfx-colour-picker {\n      display: block;\n    }\n\n    .confirm-btn {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      margin-block-start: var(--space-s);\n      margin-inline-start: auto;\n      width: 1.8em;\n      height: 1.8em;\n      border-radius: 50%;\n      border: none;\n      background: var(--accent, oklch(60% 0.15 140));\n      color: var(--accent-text, #fff);\n      padding: 0;\n      cursor: pointer;\n      transition: background var(--transition, 0.15s ease-out);\n    }\n\n    .confirm-btn svg {\n      width: 1.1em;\n      height: 1.1em;\n      flex-shrink: 0;\n    }\n\n    .confirm-btn:hover {\n      background: var(--accent, oklch(70% 0.15 140));\n    }\n\n    .confirm-btn:focus-visible {\n      outline: 2px solid var(--accent, oklch(60% 0.15 140));\n      outline-offset: 2px;\n    }\n  `];\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ixfx-colour-picker-popup': ColourPickerPopup;\n  }\n}\n"],"mappings":"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"}

package/dist/colour-picker.js

@@ -1,2 +1,2 @@
-import { n as ColourPicker, t as ColourPickerPopup } from "./colour-picker-0stHB90J.js";
+import { n as ColourPicker, t as ColourPickerPopup } from "./colour-picker-BSDBL-QL.js";
 export { ColourPicker, ColourPickerPopup };

package/dist/crumbs.js

@@ -1,7 +1,9 @@
-import { t as TickledController } from "./tickled-controller-DkAU-0qL.js";
+import { t as TickledController } from "./tickled-controller-h9GmJ_bU.js";
 import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-BrAHEj1q.js";
-import { t as themeFallbacks } from "./fallbacks-DEE1nCTt.js";
+import { t as themeFallbacks } from "./fallbacks-DNI9xt0F.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
+import "./interaction-D5XdKzbR.js";
+import "./menu-item-B-zYrTTi.js";
 import { t as collectDataResult } from "./data-provider-35TyWclX.js";
 import { t as scrollFadeStyles } from "./scroll-fade-CAs1EabA.js";
 import "./narrowed-text.js";

package/dist/crumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"crumbs.js","names":["#getTickledItems","#onTickled","#getHostContainer","#onMenuKeyNav","#currentOpenTrigger","#menuOpenedByKeyboard","#canFocusSuggestions","#shiftFocusToNarrowedText","#handleOpenCaretMenu","#activateTickled","#shiftFocusToPath","#isWheelScrolling","#wheelScrollTimeout","#findPath","#scrollTickledIntoView","#pendingNode","#hasChildOptions","#propagateInputModeToMenu","#setSelected","#modelUnsubscribe","#runLayoutUpdate","#onHostClick","#onWheel","#previousSelectionKey","#scrollToValue","#pendingController","#updateTrailingWidth","#scrollSegmentIntoView","#abortPending","#invokeLoadChildren","#onChildClick","#currentLeadingSiblings","#findNodePath","#getSiblingMenuItems","#onLabelClick","#onSegmentMenuCommand","#onUpClick","#onFocus","#onBlur","#onKeyDown","#onMenuTriggerClose","#renderChildOptions","#getChildOptionsWidth","#onNarrowedTextChange","#onNarrowedTextBlur","#onNarrowedTextShiftTab","customElement"],"sources":["../src/crumbs/crumb-navigation.ts"],"sourcesContent":["/* eslint-disable ts/no-unsafe-declaration-merging */\nimport type { PropertyValues } from 'lit';\nimport type {\n  TreeActivateEvent,\n  TreeComponent,\n  TreeComponentEventMap,\n  TreeExpandEvent,\n  TreeItemClickEvent,\n  TreeSelectDetail,\n  TreeSelectEvent,\n  TreeTickleDetail,\n  TreeTickleEvent,\n} from '../common/tree-component.js';\nimport type { TreeDataModel } from '../common/tree-data-model.js';\nimport type {\n  TreeExclusivity,\n  TreeFilterPredicate,\n  TreeSelectionFilter,\n} from '../common/types.js';\nimport type { MenuTrigger } from '../menu/menu-trigger.js';\nimport type { LoadChildrenCallback, TreeNode } from '../tree/types.js';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { collectDataResult } from '../common/data-provider.js';\n\nimport { TickledController, tickledItemStyles, tickledStyles } from '../interaction/index.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { scrollFadeStyles } from '../styles/scroll-fade.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\nimport '../menu/menu-trigger.js';\nimport '../menu/menu-container.js';\nimport '../menu/menu-item.js';\n\nimport '../narrowed-text/index.js';\n\n/** @deprecated Use TreeSelectDetail from src/common/tree-component.ts */\nexport type CrumbNavigationChangeDetail = {\n  readonly selected: TreeNode;\n  readonly previous: TreeNode | undefined;\n};\n\nexport type CrumbNavigationChangeEvent = CustomEvent<CrumbNavigationChangeDetail>;\n\nexport type CrumbNavigationItemClickDetail = { node: TreeNode; depth: number };\nexport type CrumbNavigationItemClickEvent = CustomEvent<CrumbNavigationItemClickDetail>;\n\nexport type CrumbNavigationExpandDetail = { node: TreeNode; depth: number };\nexport type CrumbNavigationExpandEvent = CustomEvent<CrumbNavigationExpandDetail>;\n\n/**\n * Breadcrumb navigation with lazy-loading support.\n *\n * Uses the same `TreeNode` / `TreeItem` data model as `ixfx-tree-list`,\n * so the two components can be swapped with minimal code changes.\n *\n * Events\n * - `navigate`: fired when user clicks a breadcrumb label. detail: `{ node: TreeNode }`\n * - `change`: fired when selected node changes. detail: `{ selected: TreeNode, previous: TreeNode | undefined }`\n * - `expand`: fired when user clicks a caret whose node has no children yet.\n *             detail: `{ node: TreeNode, depth: number, signal: AbortSignal }`\n *             Populate `node.children` then call `requestUpdate()` on the element.\n *\n * CSS variables\n * --crumb-item-bg: var(--item-bg, transparent); // item background\n * --crumb-item-bg-tickled: var(--item-bg-tickled); // item background on hover\n * --crumb-item-text-tickled: var(--item-text-tickled); // text color on hover\n * --crumb-item-border: var(--item-border); // item border\n * --crumb-item-border-tickled: var(--item-border-tickled); // border color on hover\n * --crumb-item-padding: var(--item-padding, var(--space-xs)); // item padding\n * --crumb-item-border-radius: var(--item-border-radius); // item border radius\n * --crumb-item-gap: var(--item-gap, var(--space-xs)); // gap between items\n * --crumb-separator: var(--surface-muted-text); // separator/caret color\n * --crumb-truncate-min-width: 5ch; // minimum width for truncatable segments\n */\n@customElement(`ixfx-crumb-navigation`)\nexport class CrumbNavigationElement extends LitElement implements TreeComponent {\n  @property({ type: Object })\n  root: TreeNode | undefined;\n\n  @property({ attribute: false })\n  model: TreeDataModel | undefined;\n\n  @property({ type: Object })\n  selectedNode: TreeNode | undefined;\n\n  @state()\n  private _selectedNodes = new Set<TreeNode>();\n\n  get selectedNodes(): ReadonlySet<TreeNode> {\n    return this._selectedNodes;\n  }\n\n  /** Callback to lazily load children for a node. When set, replaces event-based lazy loading. */\n  @property({ attribute: false })\n  loadChildren: LoadChildrenCallback | undefined;\n\n  @property({ attribute: false })\n  filterPredicate: TreeFilterPredicate | undefined;\n\n  @property({ reflect: true, attribute: `exclusivity` })\n  exclusivity: TreeExclusivity = `none`;\n\n  @property({ reflect: true, attribute: `selection-filter` })\n  selectionFilter: TreeSelectionFilter = `leaf`;\n\n  @state()\n  private _openIdx = -1;\n\n  @state()\n  private _isFocused = false;\n\n  @state()\n  private _menuOpen = false;\n\n  @state()\n  private _focusOnNarrowedText = false;\n\n  @property({ reflect: true, attribute: `input-mode` })\n  inputMode: string = ``;\n\n  @property({ type: Boolean, reflect: true, attribute: `no-truncate` })\n  noTruncate = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `show-suggestions` })\n  showSuggestions = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `leading-caret` })\n  leadingCaret = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `caret-embedded` })\n  caretEmbedded = true;\n\n  @property({ type: Boolean, reflect: true, attribute: `hide-root` })\n  hideRoot = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `pad-ending` })\n  padEnding = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `with-up` })\n  withUp = false;\n\n  #pendingNode: TreeNode | undefined;\n  #pendingController: AbortController | undefined;\n  #modelUnsubscribe: (() => void) | undefined;\n\n  #previousSelectionKey = ``;\n  #menuOpenedByKeyboard = false;\n  #currentOpenTrigger: MenuTrigger | null = null;\n\n  private tickled = new TickledController<number>(this, {\n    getItems: () => this.#getTickledItems(),\n    onTickle: (index) => {\n      if (index !== undefined) {\n        this.#onTickled(index);\n      }\n    },\n  });\n\n  #getTickledItems() {\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return [];\n\n    const pathNodes = this.#findPath(r, sel) ?? [r];\n    const items: Array<{ id: number; enabled: boolean }> = [];\n\n    if (this.caretEmbedded) {\n      pathNodes.forEach((_node, i) => {\n        items.push({ id: i, enabled: true });\n      });\n      if (this.#canFocusSuggestions()) {\n        items.push({ id: pathNodes.length, enabled: true });\n      }\n    } else {\n      let segmentId = 0;\n      pathNodes.forEach((node, i) => {\n        const isLast = i === pathNodes.length - 1;\n        const hasChildren = node.item.isLeaf !== true && (node.children === undefined || node.children.length > 0);\n        const showLeadingCaret = this.leadingCaret && (i > 0 || this.hideRoot) && hasChildren;\n        const showTrailingCaret = (!this.leadingCaret && hasChildren) || (this.leadingCaret && isLast && hasChildren);\n\n        if (showLeadingCaret) {\n          items.push({ id: segmentId++, enabled: true });\n        }\n        items.push({ id: segmentId++, enabled: true });\n        if (showTrailingCaret) {\n          items.push({ id: segmentId++, enabled: true });\n        }\n      });\n    }\n\n    return items;\n  }\n\n  #onTickled(index: number) {\n    if (this.tickled.inputMode === `keyboard`) {\n      this.#scrollTickledIntoView(index);\n    }\n  }\n\n  #scrollTickledIntoView(index: number): void {\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const pathNodes = this.#findPath(r, sel) ?? [r];\n    let el: HTMLElement | null = null;\n\n    if (this.caretEmbedded && this.#canFocusSuggestions() && index === pathNodes.length) {\n      el = this.shadowRoot?.querySelector<HTMLElement>(`ixfx-narrowed-text`) ?? null;\n    } else {\n      el = this.shadowRoot?.querySelectorAll<HTMLElement>(`.crumb-segment`)[index] ?? null;\n    }\n\n    el?.scrollIntoView({ inline: `nearest`, block: `nearest`, behavior: `smooth` });\n  }\n\n  #hasChildOptions(): boolean {\n    const s = this.selectedNode;\n    if (s === undefined)\n      return false;\n\n    const isPending = this.#pendingNode === s;\n    const children = s.children ?? [];\n\n    return children.length > 0 || isPending;\n  }\n\n  /** True when the suggestions (narrowed-text) sub-part is renderable and focusable. */\n  #canFocusSuggestions(): boolean {\n    return this.showSuggestions && this.#hasChildOptions();\n  }\n\n  #onFocus = (): void => {\n    this._isFocused = true;\n  };\n\n  #onBlur = (): void => {\n    this._isFocused = false;\n  };\n\n  #getHostContainer(): HTMLElement | null {\n    return this.shadowRoot?.querySelector<HTMLElement>(`.host-container`) ?? null;\n  }\n\n  #onHostClick = (): void => {\n    this.#getHostContainer()?.focus();\n  };\n\n  #handleOpenCaretMenu() {\n    const currentTickled = this.tickled.tickledId;\n    if (currentTickled === undefined)\n      return;\n\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const pathNodes = this.#findPath(r, sel) ?? [r];\n\n    // Virtual \"beyond last\" item (embedded mode only, when suggestions are available)\n    if (this.caretEmbedded && this.#canFocusSuggestions() && currentTickled === pathNodes.length) {\n      this.#shiftFocusToNarrowedText();\n      return;\n    }\n\n    const segments = this.shadowRoot?.querySelectorAll<HTMLElement>(`.crumb-segment`);\n    const trigger = segments?.[currentTickled]?.querySelector<MenuTrigger>(`.caret ixfx-menu-trigger`);\n    if (trigger) {\n      this.#menuOpenedByKeyboard = true;\n      this.#currentOpenTrigger = trigger;\n      document.addEventListener(`keydown`, this.#onMenuKeyNav, { capture: true });\n      trigger.openMenu();\n      this.#propagateInputModeToMenu();\n    }\n  }\n\n  #propagateInputModeToMenu(): void {\n    const inputMode = this.tickled.inputMode;\n    requestAnimationFrame(() => {\n      const container = this.#currentOpenTrigger?.querySelector(`ixfx-menu-container`);\n      if (container) {\n        container.setAttribute(`data-input-mode`, inputMode);\n      }\n    });\n  }\n\n  #onMenuTriggerClose = (): void => {\n    document.removeEventListener(`keydown`, this.#onMenuKeyNav, { capture: true });\n    this.#currentOpenTrigger = null;\n    this.#menuOpenedByKeyboard = false;\n    requestAnimationFrame(() => {\n      this.#getHostContainer()?.focus();\n    });\n  };\n\n  #onMenuKeyNav = (e: KeyboardEvent): void => {\n    // Only handle ArrowLeft/ArrowRight - close menu and navigate to previous/next breadcrumb segment\n    // ArrowDown/ArrowUp should pass through to let the menu handle them\n    const container = this.#currentOpenTrigger?.querySelector(`ixfx-menu-container`);\n    if (!container || !this.#currentOpenTrigger?.isOpen)\n      return;\n\n    switch (e.key) {\n      case `ArrowLeft`:\n      case `ArrowRight`: {\n        e.preventDefault();\n        e.stopPropagation();\n        this.#currentOpenTrigger.closeMenu();\n        const r = this.root;\n        const sel = this.selectedNode;\n        if (!r || !sel)\n          break;\n        const totalItems = this.#getTickledItems().length;\n        const currentTickled = this.tickled.tickledId ?? -1;\n        if (e.key === `ArrowLeft`) {\n          if (currentTickled > 0) {\n            this.tickled.handleKeyboardNavigation(`previous`);\n          }\n        } else {\n          if (currentTickled < totalItems - 1) {\n            this.tickled.handleKeyboardNavigation(`next`);\n          }\n        }\n        break;\n      }\n    }\n  };\n\n  #onKeyDown = (e: KeyboardEvent): void => {\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const totalItems = this.#getTickledItems().length;\n    const currentTickled = this.tickled.tickledId ?? -1;\n\n    switch (e.key) {\n      case `ArrowRight`: {\n        e.preventDefault();\n        if (currentTickled < totalItems - 1) {\n          this.tickled.handleKeyboardNavigation(`next`);\n        } else if (currentTickled === totalItems - 1 && this.#canFocusSuggestions()) {\n          this.#shiftFocusToNarrowedText();\n        }\n        break;\n      }\n      case `ArrowLeft`: {\n        e.preventDefault();\n        if (currentTickled > 0) {\n          this.tickled.handleKeyboardNavigation(`previous`);\n        }\n        break;\n      }\n      case `ArrowDown`:\n      case `ArrowUp`: {\n        if (this.tickled.tickledId !== undefined) {\n          e.preventDefault();\n          if (this.#currentOpenTrigger?.isOpen) {\n            // Menu is already open - dispatch ArrowDown to the popover element for it to handle\n            const container = this.#currentOpenTrigger.querySelector(`ixfx-menu-container`);\n            const popover = container?.shadowRoot?.querySelector(`.popover`);\n            if (popover) {\n              popover.dispatchEvent(new KeyboardEvent(`keydown`, { key: e.key, bubbles: true }));\n            }\n          } else {\n            this.#handleOpenCaretMenu();\n          }\n        }\n        break;\n      }\n      case `Enter`:\n      case ` `: {\n        e.preventDefault();\n        this.#activateTickled();\n        break;\n      }\n      case `Escape`: {\n        e.preventDefault();\n        this._menuOpen = false;\n        this.tickled.clearTickled();\n        this.blur();\n        break;\n      }\n      case `Tab`: {\n        if (e.shiftKey) {\n          // Let default Shift+Tab move focus backward, out of the component.\n          break;\n        }\n        if (currentTickled === totalItems - 1 && this.#canFocusSuggestions()) {\n          e.preventDefault();\n          this.#shiftFocusToNarrowedText();\n        }\n        break;\n      }\n    }\n  };\n\n  /** Activates the currently tickled item, as if it had been clicked. */\n  #activateTickled() {\n    const currentTickled = this.tickled.tickledId;\n    if (currentTickled === undefined)\n      return;\n\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const pathNodes = this.#findPath(r, sel) ?? [r];\n\n    // Virtual \"beyond last\" item (embedded mode only, when suggestions are available)\n    if (this.caretEmbedded && this.#canFocusSuggestions() && currentTickled === pathNodes.length) {\n      this.#shiftFocusToNarrowedText();\n      return;\n    }\n\n    const segment = this.shadowRoot?.querySelector<HTMLElement>(`.crumb-segment[data-segment-id=\"${currentTickled}\"]`);\n    segment?.click();\n  }\n\n  #shiftFocusToNarrowedText() {\n    const narrowedText = this.shadowRoot?.querySelector(`ixfx-narrowed-text`);\n    if (narrowedText) {\n      this._menuOpen = false;\n      this._focusOnNarrowedText = true;\n      narrowedText.focus();\n    }\n  }\n\n  #shiftFocusToPath() {\n    this._focusOnNarrowedText = false;\n    const hostContainer = this.#getHostContainer();\n    if (hostContainer) {\n      hostContainer.focus();\n    }\n  }\n\n  #onNarrowedTextBlur = (): void => {\n    this._focusOnNarrowedText = false;\n    this.#shiftFocusToPath();\n  };\n\n  #onNarrowedTextShiftTab = (): void => {\n    this._focusOnNarrowedText = false;\n    this.#shiftFocusToPath();\n  };\n\n  // --- TreeComponent methods ---\n\n  select(node: TreeNode): void {\n    this.#setSelected(node);\n  }\n\n  deselect(_node: TreeNode): void {\n    // Crumb navigation is single-selection; deselect navigates to parent or root\n  }\n\n  clearSelection(): void {\n    if (this.root)\n      this.#setSelected(this.root);\n  }\n\n  /** Not implemented on crumb-navigation. */\n  selectAll(): void {\n    // no-op\n  }\n\n  /** Not implemented on crumb-navigation. */\n  deselectAll(): void {\n    // no-op\n  }\n\n  getNodes(): ReadonlyArray<{ node: TreeNode; depth: number }> {\n    if (!this.root)\n      return [];\n    const result: Array<{ node: TreeNode; depth: number }> = [];\n    const visit = (node: TreeNode, depth: number) => {\n      result.push({ node, depth });\n      if (node.children) {\n        for (const child of node.children) visit(child, depth + 1);\n      }\n    };\n    for (const child of this.root.children ?? []) visit(child, 0);\n    return result;\n  }\n\n  // --- Lifecycle ---\n\n  override updated(changedProps: PropertyValues): void {\n    if (changedProps.has(`model`)) {\n      this.#modelUnsubscribe?.();\n      this.#modelUnsubscribe = undefined;\n      const model = this.model;\n      if (model) {\n        this.root = model.root;\n        this.#modelUnsubscribe = model._subscribe((event) => {\n          if (event.type === `root`) {\n            this.root = event.root;\n            this.requestUpdate();\n          }\n        });\n      }\n    }\n    this.#runLayoutUpdate(changedProps);\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener(`click`, this.#onHostClick);\n    this.addEventListener(`wheel`, this.#onWheel, { passive: false });\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener(`click`, this.#onHostClick);\n    this.removeEventListener(`wheel`, this.#onWheel);\n    this.#modelUnsubscribe?.();\n    this.#modelUnsubscribe = undefined;\n    document.removeEventListener(`keydown`, this.#onMenuKeyNav, { capture: true });\n    this.#currentOpenTrigger = null;\n  }\n\n  override firstUpdated() {\n    const hostContainer = this.#getHostContainer();\n    if (hostContainer) {\n      hostContainer.scrollLeft = hostContainer.scrollWidth - hostContainer.clientWidth;\n    }\n  }\n\n  #isWheelScrolling = false;\n\n  #onWheel = (e: Event) => {\n    const wheelEvent = e as WheelEvent;\n    if (wheelEvent.deltaX !== 0 || wheelEvent.deltaY !== 0) {\n      e.preventDefault();\n      if (!this.#isWheelScrolling) {\n        this.#isWheelScrolling = true;\n        this.tickled.clearTickled();\n      }\n      const hostContainer = this.#getHostContainer();\n      if (hostContainer) {\n        hostContainer.scrollLeft += wheelEvent.deltaX + wheelEvent.deltaY;\n      }\n      clearTimeout(this.#wheelScrollTimeout);\n      this.#wheelScrollTimeout = setTimeout(() => {\n        this.#isWheelScrolling = false;\n      }, 150);\n    }\n  };\n\n  #wheelScrollTimeout: ReturnType<typeof setTimeout> | undefined;\n\n  #runLayoutUpdate(_changedProperties: PropertyValues): void {\n    if (!this.shadowRoot)\n      return;\n\n    const hsiElement: HTMLElement | null = this.shadowRoot.querySelector(`.horiz-select-items`);\n    if (!hsiElement)\n      return;\n\n    const ulElement: HTMLElement | null = hsiElement.querySelector(`ul`);\n    if (!ulElement)\n      return;\n\n    const menuTrigger: HTMLElement | null = this.shadowRoot.querySelector(`ixfx-menu-trigger`);\n    if (!menuTrigger)\n      return;\n\n    if (ulElement.getBoundingClientRect().width > hsiElement.getBoundingClientRect().width) {\n      menuTrigger.style.display = `inline-flex`;\n    } else {\n      menuTrigger.style.display = `none`;\n    }\n\n    for (const li of ulElement.querySelectorAll(`li`)) {\n      const key = li.getAttribute(`data-key`) ?? ``;\n      if (key === this.#previousSelectionKey) {\n        this.#scrollToValue(li);\n        break;\n      }\n    }\n  }\n\n  #scrollToValue(li: HTMLLIElement) {\n    let l = li.offsetLeft;\n\n    const ul = li.parentElement;\n    if (!ul)\n      return;\n    l -= ul.offsetLeft;\n\n    const horizSelectItems = ul.parentElement;\n    if (!horizSelectItems)\n      return;\n    horizSelectItems.scroll({ left: l, top: 0, behavior: `smooth` });\n\n    const horizSelect = horizSelectItems.parentElement;\n    if (!horizSelect)\n      return;\n    horizSelect.style.minWidth = `${li.getBoundingClientRect().width}px`;\n  }\n\n  #abortPending() {\n    if (this.#pendingController) {\n      this.#pendingController.abort();\n      this.#pendingController = undefined;\n      this.#pendingNode = undefined;\n    }\n  }\n\n  #findPath(node: TreeNode, target: TreeNode, acc: TreeNode[] = []): TreeNode[] | undefined {\n    const path = [...acc, node];\n    if (node === target)\n      return path;\n    if (!node.children)\n      return undefined;\n    for (const child of node.children) {\n      const result = this.#findPath(child, target, path);\n      if (result)\n        return result;\n    }\n    return undefined;\n  }\n\n  #scrollSegmentIntoView(depth: number) {\n    if (!this.shadowRoot)\n      return;\n    const segments = this.shadowRoot.querySelectorAll(`.crumb-segment`);\n    const segment = segments[depth];\n    segment?.scrollIntoView({ block: `nearest`, inline: `start` });\n  }\n\n  #updateTrailingWidth(): void {\n    if (!this.padEnding || !this.shadowRoot)\n      return;\n    const hostContainer = this.shadowRoot.querySelector<HTMLElement>(`.host-container`);\n    const trailing = this.shadowRoot.querySelector<HTMLElement>(`.trailing`);\n    if (!hostContainer || !trailing)\n      return;\n    const segments = this.shadowRoot.querySelectorAll(`.crumb-segment`);\n    const lastSegment = segments[segments.length - 1];\n    if (!lastSegment)\n      return;\n    const containerWidth = hostContainer.getBoundingClientRect().width;\n    const itemWidth = lastSegment.getBoundingClientRect().width;\n    if (itemWidth < containerWidth) {\n      trailing.style.width = `${containerWidth - itemWidth - 5}px`;\n      requestAnimationFrame(() => {\n        if (hostContainer.scrollWidth <= hostContainer.clientWidth) {\n          hostContainer.style.setProperty(`--scroll-fade-x-start`, `0px`, `important`);\n        } else {\n          hostContainer.style.removeProperty(`--scroll-fade-x-start`);\n        }\n      });\n    } else {\n      trailing.style.width = ``;\n    }\n  }\n\n  #setSelected(node: TreeNode) {\n    const previous = this.selectedNode;\n    if (previous) {\n      this.#previousSelectionKey = previous.item?.key ?? ``;\n    } else {\n      this.#previousSelectionKey = ``;\n    }\n    const previousSet: ReadonlySet<TreeNode> = previous ? new Set([previous]) : new Set();\n    this.selectedNode = node;\n    this._selectedNodes = new Set([node]);\n\n    if (this.root) {\n      const path = this.#findPath(this.root, node);\n      if (path) {\n        const depth = this.hideRoot && path.length > 1 ? path.length - 2 : path.length - 1;\n        requestAnimationFrame(() => {\n          this.#updateTrailingWidth();\n          const hostContainer = this.#getHostContainer();\n          if (hostContainer) {\n            hostContainer.scrollLeft = 0;\n          }\n          this.#scrollSegmentIntoView(depth);\n        });\n      }\n    }\n\n    this.dispatchEvent(new CustomEvent<TreeSelectDetail>(`select`, {\n      detail: { selected: new Set([node]), previous: previousSet },\n      bubbles: true,\n      composed: true,\n    }));\n  }\n\n  #onLabelClick(node: TreeNode, depth: number) {\n    this._openIdx = -1;\n    this.#setSelected(node);\n    this.#scrollSegmentIntoView(depth);\n    this.dispatchEvent(new CustomEvent<CrumbNavigationItemClickDetail>(`item-click`, {\n      detail: { node, depth },\n      bubbles: true,\n      composed: true,\n    }));\n  }\n\n  #onCaretClick(node: TreeNode, depth: number, e: MouseEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n\n    if (this._openIdx === depth) {\n      this._openIdx = -1;\n      return;\n    }\n    this._openIdx = depth;\n\n    if (node.children === undefined && this.#pendingNode !== node) {\n      this.#abortPending();\n      this.#pendingNode = node;\n      const controller = new AbortController();\n      this.#pendingController = controller;\n\n      if (this.loadChildren) {\n        this.#invokeLoadChildren(node, depth, controller).catch(() => {});\n      }\n    }\n\n    this.requestUpdate();\n  }\n\n  async #invokeLoadChildren(node: TreeNode, depth: number, controller: AbortController): Promise<void> {\n    try {\n      const children = [...await collectDataResult(\n        this.loadChildren!({ node, depth }, controller.signal),\n        controller.signal,\n      )];\n      if (controller.signal.aborted)\n        return;\n      node.children = children;\n      this.#pendingNode = undefined;\n      this.#pendingController = undefined;\n      this.dispatchEvent(new CustomEvent<CrumbNavigationExpandDetail>(`expand`, {\n        detail: { node, depth },\n        bubbles: true,\n        composed: true,\n      }));\n      this.requestUpdate();\n    } catch {\n      if (controller.signal.aborted)\n        return;\n      node.children = [];\n      this.#pendingNode = undefined;\n      this.#pendingController = undefined;\n      this.requestUpdate();\n    }\n  }\n\n  #onSegmentMenuCommand(e: CustomEvent, node: TreeNode, depth: number) {\n    const key = e.detail.command;\n    if (this.leadingCaret) {\n      const child = node.children?.find(c => c.item.key === key);\n      if (child) {\n        this.#onChildClick(child, depth + 1);\n        return;\n      }\n      if (this.#currentLeadingSiblings) {\n        const sibling = this.#currentLeadingSiblings.find(c => c.item.key === key);\n        if (sibling) {\n          this.#onChildClick(sibling, depth);\n        }\n        this.#currentLeadingSiblings = undefined;\n        return;\n      }\n    }\n    const child = node.children?.find(c => c.item.key === key);\n    if (child) {\n      this.#onChildClick(child, depth + 1);\n    }\n  }\n\n  #currentLeadingSiblings: TreeNode[] | undefined = undefined;\n\n  #getSiblingMenuItems(pathNodes: TreeNode[], index: number): unknown {\n    if (index === 0) {\n      if (!this.hideRoot || !this.root)\n        return [];\n      const siblings = [...(this.root.children ?? [])].sort((a, b) => (a.item.label ?? ``).localeCompare(b.item.label ?? ``));\n      this.#currentLeadingSiblings = siblings;\n      return siblings.map(sibling => html`\n        <ixfx-menu-item\n          label=\"${sibling.item.label}\"\n          command=\"${sibling.item.key}\"\n          icon-name=\"${sibling.item.icon ?? nothing}\"\n          @click=${() => {\n            this.#onChildClick(sibling, index);\n          }}\n        ></ixfx-menu-item>\n      `);\n    }\n    const parent = pathNodes[index - 1];\n    const siblings = [...(parent.children ?? [])].sort((a, b) => (a.item.label ?? ``).localeCompare(b.item.label ?? ``));\n    this.#currentLeadingSiblings = siblings;\n    return siblings.map(sibling => html`\n      <ixfx-menu-item\n        label=\"${sibling.item.label}\"\n        command=\"${sibling.item.key}\"\n        icon-name=\"${sibling.item.icon ?? nothing}\"\n        @click=${() => {\n          this.#onChildClick(sibling, index);\n        }}\n      ></ixfx-menu-item>\n    `);\n  }\n\n  #onChildClick(node: TreeNode, depth: number) {\n    this._openIdx = -1;\n    this.#setSelected(node);\n    this.dispatchEvent(new CustomEvent<CrumbNavigationItemClickDetail>(`item-click`, {\n      detail: { node, depth },\n      bubbles: true,\n      composed: true,\n    }));\n  }\n\n  #onUpClick(): void {\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const path = this.#findPath(r, sel);\n    if (!path || path.length <= 1)\n      return;\n\n    const parent = path[path.length - 2];\n    this.#setSelected(parent);\n  }\n\n  /** Navigate to a node by key path. Returns false if any key is not found in already-loaded children. */\n  navigateTo(keys: readonly string[]): boolean {\n    if (!this.root?.children)\n      return false;\n    let current: TreeNode | undefined = this.root;\n    for (const key of keys) {\n      const found: TreeNode | undefined = current?.children?.find(n => n.item.key === key);\n      if (!found)\n        return false;\n      current = found;\n    }\n    if (current && current !== this.root) {\n      this.#setSelected(current);\n    }\n    return true;\n  }\n\n  /** Navigate to the first node matching the predicate. Returns false if not found. */\n  navigateToNode(predicate: (node: TreeNode) => boolean): boolean {\n    if (!this.root)\n      return false;\n    const keyPath = this.#findNodePath(this.root.children ?? [], predicate);\n    if (!keyPath)\n      return false;\n    return this.navigateTo(keyPath);\n  }\n\n  #findNodePath(\n    nodes: TreeNode[],\n    predicate: (node: TreeNode) => boolean,\n    prefix: string[] = [],\n  ): string[] | undefined {\n    for (const node of nodes) {\n      const path = [...prefix, node.item.key];\n      if (predicate(node))\n        return path;\n      if (node.children?.length) {\n        const result = this.#findNodePath(node.children, predicate, path);\n        if (result)\n          return result;\n      }\n    }\n    return undefined;\n  }\n\n  #onMenuCommand(e: CustomEvent) {\n    const node = this.selectedNode;\n    if (!node?.children)\n      return;\n\n    const key = e.detail.command;\n    const child = node.children.find(c => c.item.key === key);\n    if (child) {\n      const depth = this.root ? (this.#findPath(this.root, node)?.length ?? 1) : 1;\n      this.#onChildClick(child, depth);\n    }\n  }\n\n  render() {\n    const r = this.root;\n    const sel = this.selectedNode;\n\n    if (!r || !sel) {\n      return html``;\n    }\n\n    this.inputMode = this.tickled.inputMode;\n\n    let pathNodes = this.#findPath(r, sel) ?? [r];\n    if (this.hideRoot && pathNodes.length > 1) {\n      pathNodes = pathNodes.slice(1);\n    }\n    const _hasChildOptions = this.#hasChildOptions();\n\n    const isAtRoot = (() => {\n      const fullPath = this.#findPath(r, sel) ?? [r];\n      return fullPath.length <= 1;\n    })();\n\n    const parts: Array<ReturnType<typeof html>> = [];\n    let segmentId = 0;\n\n    pathNodes.forEach((node, i) => {\n      const isLast = i === pathNodes.length - 1;\n      const isPending = this.#pendingNode === node;\n      const isOpen = this._openIdx === i;\n      const hasChildren = node.item.isLeaf !== true && (node.children === undefined || node.children.length > 0);\n      const isTickled = this.tickled.isTickled(i);\n\n      const showLeadingCaret = this.leadingCaret && (i > 0 || this.hideRoot) && hasChildren;\n      const showTrailingCaret = (!this.leadingCaret && hasChildren) || (this.leadingCaret && isLast && hasChildren);\n\n      const siblingMenuItems = showLeadingCaret ? this.#getSiblingMenuItems(pathNodes, i) : [];\n      const childMenuItems = (node.children ?? []).map(c => html`\n        <ixfx-menu-item\n          label=\"${c.item.label}\"\n          command=\"${c.item.key}\"\n          icon-name=\"${c.item.icon ?? nothing}\"\n        ></ixfx-menu-item>\n      `);\n\n      if (this.caretEmbedded) {\n        const canTruncate = !this.noTruncate && !isLast && !isTickled;\n\n        parts.push(html`\n          <div class=\"item crumb-segment ${isTickled ? `tickled` : ``} ${canTruncate ? `truncatable` : ``} ${this.leadingCaret ? `leading-caret` : ``} ${isLast ? `last-label` : ``}\" data-segment-id=\"${i}\" data-path-index=\"${i}\"\n            @click=${(e: MouseEvent) => {\n              if ((e.target as HTMLElement).closest(`.caret`))\n                return; this.#onLabelClick(node, i);\n            }}\n          >\n            ${showLeadingCaret\n                ? html`\n              <span class=\"caret ${isOpen ? `open` : ``} ${isPending ? `pending` : ``}\">\n                ${isPending\n                    ? html`<span class=\"loading-spinner\"></span>`\n                    : html`\n                  <ixfx-menu-trigger mode=\"trigger\" label=\"›\" .tabStop=${false} @menu-command=${(e: CustomEvent) => this.#onSegmentMenuCommand(e, node, i)}>\n                    <ixfx-menu-container slot=\"menu\">\n                      ${siblingMenuItems}\n                    </ixfx-menu-container>\n                  </ixfx-menu-trigger>\n                  `\n                }\n              </span>\n              `\n                : nothing\n            }\n            <span class=\"label\">${node.item.label}</span>\n            ${showTrailingCaret\n                ? html`\n              <span class=\"caret ${isOpen ? `open` : ``} ${isPending ? `pending` : ``}\">\n                ${isPending\n                    ? html`<span class=\"loading-spinner\"></span>`\n                    : html`\n                  <ixfx-menu-trigger mode=\"trigger\" label=\"›\" .tabStop=${false} placement=\"right-start\" @menu-command=${(e: CustomEvent) => this.#onSegmentMenuCommand(e, node, i)}>\n                    <ixfx-menu-container slot=\"menu\">\n                      ${childMenuItems}\n                    </ixfx-menu-container>\n                  </ixfx-menu-trigger>\n                  `\n                }\n              </span>\n              `\n                : nothing\n            }\n          </div>\n        `);\n      } else {\n        const leadingCaretTickled = showLeadingCaret ? this.tickled.isTickled(segmentId) : false;\n        if (showLeadingCaret) {\n          parts.push(html`\n            <div class=\"item crumb-segment ${leadingCaretTickled ? `tickled` : ``}\" data-segment-id=\"${segmentId}\" data-path-index=\"${i}\"\n              @click=${(e: MouseEvent) => {\n                const trigger = (e.target as HTMLElement).closest(`.crumb-segment`)?.querySelector(`ixfx-menu-trigger`);\n                if (trigger)\n                  trigger.openMenu();\n              }}\n            >\n              <span class=\"caret ${isOpen ? `open` : ``} ${isPending ? `pending` : ``}\">\n                ${isPending\n                    ? html`<span class=\"loading-spinner\"></span>`\n                    : html`\n                  <ixfx-menu-trigger mode=\"trigger\" label=\"›\" .tabStop=${false} placement=\"right-start\" @menu-command=${(e: CustomEvent) => this.#onSegmentMenuCommand(e, node, i)}>\n                    <ixfx-menu-container slot=\"menu\">\n                      ${siblingMenuItems}\n                    </ixfx-menu-container>\n                  </ixfx-menu-trigger>\n                  `\n                }\n              </span>\n            </div>\n          `);\n          segmentId++;\n        }\n        const labelTickled = this.tickled.isTickled(segmentId);\n        const canTruncate = !this.noTruncate && !isLast && !labelTickled;\n        parts.push(html`\n          <div class=\"item crumb-segment ${labelTickled ? `tickled` : ``} ${canTruncate ? `truncatable` : ``} ${isLast ? `last-label` : ``}\" data-segment-id=\"${segmentId}\" data-path-index=\"${i}\"\n            @click=${(e: MouseEvent) => {\n              if ((e.target as HTMLElement).closest(`.caret`))\n                return; this.#onLabelClick(node, i);\n            }}\n          >\n            <span class=\"label\">${node.item.label}</span>\n          </div>\n        `);\n        segmentId++;\n        if (showTrailingCaret) {\n          const trailingCaretTickled = this.tickled.isTickled(segmentId);\n          parts.push(html`\n            <div class=\"item crumb-segment ${trailingCaretTickled ? `tickled` : ``}\" data-segment-id=\"${segmentId}\" data-path-index=\"${i}\"\n              @click=${(e: MouseEvent) => {\n                const trigger = (e.target as HTMLElement).closest(`.crumb-segment`)?.querySelector(`ixfx-menu-trigger`);\n                if (trigger)\n                  trigger.openMenu();\n              }}\n            >\n              <span class=\"caret ${isOpen ? `open` : ``} ${isPending ? `pending` : ``}\">\n                ${isPending\n                    ? html`<span class=\"loading-spinner\"></span>`\n                    : html`\n                  <ixfx-menu-trigger mode=\"trigger\" label=\"›\" .tabStop=${false} @menu-command=${(e: CustomEvent) => this.#onSegmentMenuCommand(e, node, i)}>\n                    <ixfx-menu-container slot=\"menu\">\n                      ${childMenuItems}\n                    </ixfx-menu-container>\n                  </ixfx-menu-trigger>\n                  `\n                }\n              </span>\n            </div>\n          `);\n          segmentId++;\n        }\n      }\n    });\n\n    return html`\n      <div class=\"crumb-wrapper\">\n        ${this.withUp\n          ? html`\n            <button\n              class=\"up-button\"\n              ?disabled=${isAtRoot}\n              aria-label=\"Go up one level\"\n              @click=${this.#onUpClick}\n            >\n              <ixfx-icon name=\"folder-up\"></ixfx-icon>\n            </button>\n          `\n          : nothing}\n        <div\n          class=\"host-container scroll-fade-x\"\n          tabindex=\"0\"\n          @focus=${this.#onFocus}\n          @blur=${this.#onBlur}\n          @keydown=${this.#onKeyDown}\n          @click=${this.#onHostClick}\n          @menu-trigger-close=${this.#onMenuTriggerClose}\n          @mouseout=${(e: MouseEvent) => this.tickled.handlePointerLeave(e as PointerEvent)}\n        >\n          <div class=\"parts\"\n            @mouseover=${(e: MouseEvent) => {\n              if (this.#isWheelScrolling)\n                return;\n              const target = e.target;\n              if (!(target instanceof HTMLElement))\n                return;\n              const segment = target.closest(`.crumb-segment`) as HTMLElement | null;\n              if (!segment)\n                return;\n              const segmentId = parseInt(segment.dataset.segmentId ?? ``, 10);\n              if (Number.isNaN(segmentId))\n                return;\n              const pathIndex = parseInt(segment.dataset.pathIndex ?? ``, 10);\n              const node = pathNodes[pathIndex];\n              if (!node)\n                return;\n              this.tickled.handlePointerEnter(segmentId);\n              this.dispatchEvent(new CustomEvent<TreeTickleDetail>(`tickle`, { detail: { node, depth: pathIndex }, bubbles: true, composed: true }));\n            }}\n          >${parts}${this.padEnding ? html`<div class=\"trailing\"></div>` : nothing}</div>\n          ${this.showSuggestions ? this.#renderChildOptions() : nothing}\n        </div>\n      </div>\n    `;\n  }\n\n  #renderChildOptions() {\n    const s = this.selectedNode;\n    if (s === undefined) {\n      return nothing;\n    }\n\n    const isPending = this.#pendingNode === s;\n    const children = s.children ?? [];\n\n    if (children.length === 0 && !isPending) {\n      return nothing;\n    }\n\n    if (isPending) {\n      return html`\n        <div class=\"horiz-select\">\n          <div class=\"horiz-select-items\">\n            <span class=\"loading-spinner\"></span>\n          </div>\n        </div>\n      `;\n    }\n\n    return html`\n      <ixfx-narrowed-text\n        class=\"horiz-select\"\n        selection-mode=\"single\"\n        orientation=\"horizontal\"\n        nowrap\n        width=${this.#getChildOptionsWidth()}\n        @change=${this.#onNarrowedTextChange}\n        @narrowed-text-blur=${this.#onNarrowedTextBlur}\n        @narrowed-text-shift-tab=${this.#onNarrowedTextShiftTab}\n      >\n        ${children.map(c => html`\n          <span data-value=\"${c.item.key}\" data-label=\"${c.item.label}\"></span>\n        `)}\n      </ixfx-narrowed-text>\n    `;\n  }\n\n  #onNarrowedTextChange(e: CustomEvent) {\n    e.stopPropagation();\n    const detail = e.detail as { item: { value: string } };\n    const node = this.selectedNode;\n    if (!node?.children)\n      return;\n\n    const child = node.children.find(c => c.item.key === detail.item.value);\n    if (child) {\n      const depth = this.root ? (this.#findPath(this.root, node)?.length ?? 1) : 1;\n      this.#onChildClick(child, depth);\n    }\n  }\n\n  #getChildOptionsWidth(): string {\n    return `var(--child-options-width, 50ch)`;\n  }\n\n  static styles = [themeFallbacks, tickledStyles, tickledItemStyles, scrollFadeStyles(`x`), css`\n    :host {\n      --crumb-item-bg: var(--item-bg, transparent);\n      --crumb-item-bg-tickled: var(--item-bg-tickled);\n      --crumb-item-text-tickled: var(--item-text-tickled);\n      --crumb-item-border: var(--item-border);\n      --crumb-item-border-tickled: var(--item-border-tickled);\n      --crumb-item-padding: var(--space-s, 2px);\n      --crumb-item-border-radius: var(--item-border-radius);\n      --crumb-item-gap: var(--item-gap, var(--space-xs));\n      --crumb-separator: var(--surface-muted-text);\n      --crumb-truncate-min-width: 10ch;\n      display: flex;\n      width: 100%;\n    }\n\n    /* Outline goes on :host, not .host-container: .host-container carries the\n     * scroll-fade mask-image, and CSS masks clip everything painted outside\n     * the masked box - including an outline, which paints outside the border edge. */\n    :host(:focus-within) {\n      outline: 2px solid var(--accent);\n      outline-offset: 2px;\n    }\n\n    .crumb-wrapper {\n      display: flex;\n      align-items: center;\n      gap: var(--crumb-item-gap);\n      width: 100%;\n    }\n\n    .up-button {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      flex-shrink: 0;\n      background: var(--crumb-item-bg);\n      border: var(--crumb-item-border);\n      border-radius: var(--crumb-item-border-radius);\n      padding: var(--crumb-item-padding);\n      cursor: pointer;\n      color: inherit;\n    }\n\n    .up-button:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .up-button:hover:not(:disabled) {\n      background: var(--crumb-item-bg-tickled);\n      border-color: var(--crumb-item-border-tickled);\n    }\n\n    .up-button ixfx-icon {\n      width: 1em;\n      height: 1em;\n      pointer-events: none;\n    }\n\n    /* Edge fade (shows/hides based on scroll position) comes from the\n     * shared .scroll-fade-x class - see ../styles/scroll-fade.ts */\n    .host-container {\n      display: flex;\n      flex: 1;\n      min-width: 0;\n      outline: none;\n      overflow: scroll;\n      scroll-snap-type: x mandatory;\n      scrollbar-width: none;\n      overscroll-behavior: none;\n    }\n\n    .host-container::-webkit-scrollbar {\n      display: none;\n    }\n\n    .parts {\n      display: flex;\n      gap: var(--space-s);\n    }\n\n    .trailing {\n      flex-shrink: 0;\n    }\n\n    .crumb-segment {\n      display: flex;\n      align-items: center;\n      flex-shrink: 0;\n      background: var(--crumb-item-bg);\n      border: var(--crumb-item-border);\n      border-radius: var(--crumb-item-border-radius);\n      padding:0;\n    }\n\n    .crumb-segment.leading-caret {\n      flex-direction: row;\n    }\n\n    .crumb-segment.tickled {\n      background: var(--crumb-item-bg-tickled);\n      border-color: var(--crumb-item-border-tickled);\n      color: var(--crumb-item-text-tickled);\n      flex-shrink: 0;\n      min-width: auto;\n    }\n\n    .crumb-segment.truncatable {\n      flex-shrink: 1;\n      min-width: min(var(--crumb-truncate-min-width), auto);\n      overflow: hidden;\n    }\n\n    .crumb-segment.truncatable .label {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      min-width: 0;\n    }\n\n    .label {\n      padding: var(--crumb-item-padding);\n      cursor: pointer;\n      white-space: nowrap;\n      color: inherit;\n    }\n\n    .crumb-segment.last-label .label {\n      color: var(--crumb-last-label-color, inherit);\n      font-style: var(--crumb-last-label-font-style, inherit);\n      font-weight: var(--crumb-last-label-font-weight, inherit);\n      text-decoration: var(--crumb-last-label-text-decoration, inherit);\n      text-underline-offset: var(--crumb-last-label-text-underline-offset, auto);\n    }\n\n    .crumb-segment.tickled .label {\n      color: var(--crumb-item-text-tickled);\n      overflow: visible;\n      text-overflow: clip;\n    }\n\n    .crumb-segment ixfx-menu-trigger {\n      --ixfx-button-padding: var(--space-s, 2px);\n    }\n\n    .caret {\n      position: relative;\n      cursor: pointer;\n      color: var(--crumb-separator);\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      transition: all 0.2s ease-in-out;\n    }\n\n    .caret.open {\n      background: color-mix(in srgb, var(--surface-5) 40%, transparent);\n    }\n\n    .caret.pending {\n      display: inline-flex;\n    }\n\n    .caret > ixfx-menu-trigger {\n      display: inline-flex;\n      margin: 0;\n      --_trigger-hover-bg: transparent;\n      --_trigger-hover-opacity: 0.6;\n    }\n\n    .caret > ixfx-menu-trigger::part(base) {\n      background: none;\n      border: none;\n      color: inherit;\n      cursor: pointer;\n      font-size: inherit;\n      line-height: 1;\n    }\n\n    .caret > ixfx-menu-trigger::part(base):hover {\n      background: none;\n      opacity: 0.6;\n    }\n\n    .separator {\n      margin-left: var(--crumb-item-gap);\n      margin-right: var(--crumb-item-gap);\n      color: var(--crumb-separator);\n    }\n\n    .separator-trigger {\n      display: inline-flex;\n      margin-left: var(--crumb-item-gap);\n      margin-right: var(--crumb-item-gap);\n      --_trigger-hover-bg: transparent;\n      --_trigger-hover-opacity: 0.6;\n    }\n\n    .separator-trigger::part(base) {\n      background: none;\n      border: none;\n      color: var(--crumb-separator);\n      padding: 0;\n      cursor: pointer;\n      font-size: inherit;\n      line-height: 1;\n    }\n\n    .separator-trigger::part(base):hover {\n      background: none;\n      opacity: 0.6;\n    }\n\n    .separator-trigger.tickled::part(base) {\n    }\n\n    ixfx-menu-trigger {\n      display: none;\n    }\n\n    .horiz-select > ixfx-menu-trigger {\n      display: inline-flex;\n    }\n\n    .horiz-select {\n      display: flex;\n      min-width: 5ch;\n    }\n\n    .loading-spinner {\n      display: inline-block;\n      width: 12px;\n      height: 12px;\n      border: 2px solid var(--surface-5);\n      border-top-color: var(--accent);\n      border-radius: 50%;\n      animation: crumb-spin 0.7s linear infinite;\n    }\n\n    @keyframes crumb-spin {\n      to { transform: rotate(360deg); }\n    }\n\n    ::slotted(*), option {\n      user-select: none;\n      scroll-snap-align: start;\n    }\n  `];\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ixfx-crumb-navigation\": CrumbNavigationElement;\n  }\n}\n\nexport interface CrumbNavigationElementEventMap extends TreeComponentEventMap {\n  'item-click': TreeItemClickEvent;\n  'expand': TreeExpandEvent;\n  'select': TreeSelectEvent;\n  'tickle': TreeTickleEvent;\n  'activate': TreeActivateEvent;\n}\n\nexport interface CrumbNavigationElement {\n  addEventListener: (<K extends keyof CrumbNavigationElementEventMap>(\n    type: K,\n    listener: (this: CrumbNavigationElement, event: CrumbNavigationElementEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions,\n  ) => void) & ((\n    type: string,\n    listener: EventListenerOrEventListenerObject,\n    options?: boolean | AddEventListenerOptions,\n  ) => void);\n}\n"],"mappings":"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"}
+{"version":3,"file":"crumbs.js","names":["#getTickledItems","#onTickled","#getHostContainer","#onMenuKeyNav","#currentOpenTrigger","#menuOpenedByKeyboard","#canFocusSuggestions","#shiftFocusToNarrowedText","#handleOpenCaretMenu","#activateTickled","#shiftFocusToPath","#isWheelScrolling","#wheelScrollTimeout","#findPath","#scrollTickledIntoView","#pendingNode","#hasChildOptions","#propagateInputModeToMenu","#setSelected","#modelUnsubscribe","#runLayoutUpdate","#onHostClick","#onWheel","#previousSelectionKey","#scrollToValue","#pendingController","#updateTrailingWidth","#scrollSegmentIntoView","#abortPending","#invokeLoadChildren","#onChildClick","#currentLeadingSiblings","#findNodePath","#getSiblingMenuItems","#onLabelClick","#onSegmentMenuCommand","#onUpClick","#onFocus","#onBlur","#onKeyDown","#onMenuTriggerClose","#renderChildOptions","#getChildOptionsWidth","#onNarrowedTextChange","#onNarrowedTextBlur","#onNarrowedTextShiftTab","customElement"],"sources":["../src/crumbs/crumb-navigation.ts"],"sourcesContent":["/* eslint-disable ts/no-unsafe-declaration-merging */\nimport type { PropertyValues } from 'lit';\nimport type {\n  TreeActivateEvent,\n  TreeComponent,\n  TreeComponentEventMap,\n  TreeExpandEvent,\n  TreeItemClickEvent,\n  TreeSelectDetail,\n  TreeSelectEvent,\n  TreeTickleDetail,\n  TreeTickleEvent,\n} from '../common/tree-component.js';\nimport type { TreeDataModel } from '../common/tree-data-model.js';\nimport type {\n  TreeExclusivity,\n  TreeFilterPredicate,\n  TreeSelectionFilter,\n} from '../common/types.js';\nimport type { MenuTrigger } from '../menu/menu-trigger.js';\nimport type { LoadChildrenCallback, TreeNode } from '../tree/types.js';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { collectDataResult } from '../common/data-provider.js';\n\nimport { TickledController, tickledItemStyles, tickledStyles } from '../interaction/index.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { scrollFadeStyles } from '../styles/scroll-fade.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\nimport '../menu/menu-trigger.js';\nimport '../menu/menu-container.js';\nimport '../menu/menu-item.js';\n\nimport '../narrowed-text/index.js';\n\n/** @deprecated Use TreeSelectDetail from src/common/tree-component.ts */\nexport type CrumbNavigationChangeDetail = {\n  readonly selected: TreeNode;\n  readonly previous: TreeNode | undefined;\n};\n\nexport type CrumbNavigationChangeEvent = CustomEvent<CrumbNavigationChangeDetail>;\n\nexport type CrumbNavigationItemClickDetail = { node: TreeNode; depth: number };\nexport type CrumbNavigationItemClickEvent = CustomEvent<CrumbNavigationItemClickDetail>;\n\nexport type CrumbNavigationExpandDetail = { node: TreeNode; depth: number };\nexport type CrumbNavigationExpandEvent = CustomEvent<CrumbNavigationExpandDetail>;\n\n/**\n * Breadcrumb navigation with lazy-loading support.\n *\n * Uses the same `TreeNode` / `TreeItem` data model as `ixfx-tree-list`,\n * so the two components can be swapped with minimal code changes.\n *\n * Events\n * - `navigate`: fired when user clicks a breadcrumb label. detail: `{ node: TreeNode }`\n * - `change`: fired when selected node changes. detail: `{ selected: TreeNode, previous: TreeNode | undefined }`\n * - `expand`: fired when user clicks a caret whose node has no children yet.\n *             detail: `{ node: TreeNode, depth: number, signal: AbortSignal }`\n *             Populate `node.children` then call `requestUpdate()` on the element.\n *\n * CSS variables\n * --crumb-item-bg: var(--item-bg, transparent); // item background\n * --crumb-item-bg-tickled: var(--item-bg-tickled); // item background on hover\n * --crumb-item-text-tickled: var(--item-text-tickled); // text color on hover\n * --crumb-item-border: var(--item-border); // item border\n * --crumb-item-border-tickled: var(--item-border-tickled); // border color on hover\n * --crumb-item-padding: var(--item-padding, var(--space-xs)); // item padding\n * --crumb-item-border-radius: var(--item-border-radius); // item border radius\n * --crumb-item-gap: var(--item-gap, var(--space-xs)); // gap between items\n * --crumb-separator: var(--surface-muted-text); // separator/caret color\n * --crumb-truncate-min-width: 5ch; // minimum width for truncatable segments\n */\n@customElement(`ixfx-crumb-navigation`)\nexport class CrumbNavigationElement extends LitElement implements TreeComponent {\n  @property({ type: Object })\n  root: TreeNode | undefined;\n\n  @property({ attribute: false })\n  model: TreeDataModel | undefined;\n\n  @property({ type: Object })\n  selectedNode: TreeNode | undefined;\n\n  @state()\n  private _selectedNodes = new Set<TreeNode>();\n\n  get selectedNodes(): ReadonlySet<TreeNode> {\n    return this._selectedNodes;\n  }\n\n  /** Callback to lazily load children for a node. When set, replaces event-based lazy loading. */\n  @property({ attribute: false })\n  loadChildren: LoadChildrenCallback | undefined;\n\n  @property({ attribute: false })\n  filterPredicate: TreeFilterPredicate | undefined;\n\n  @property({ reflect: true, attribute: `exclusivity` })\n  exclusivity: TreeExclusivity = `none`;\n\n  @property({ reflect: true, attribute: `selection-filter` })\n  selectionFilter: TreeSelectionFilter = `leaf`;\n\n  @state()\n  private _openIdx = -1;\n\n  @state()\n  private _isFocused = false;\n\n  @state()\n  private _menuOpen = false;\n\n  @state()\n  private _focusOnNarrowedText = false;\n\n  @property({ reflect: true, attribute: `input-mode` })\n  inputMode: string = ``;\n\n  @property({ type: Boolean, reflect: true, attribute: `no-truncate` })\n  noTruncate = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `show-suggestions` })\n  showSuggestions = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `leading-caret` })\n  leadingCaret = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `caret-embedded` })\n  caretEmbedded = true;\n\n  @property({ type: Boolean, reflect: true, attribute: `hide-root` })\n  hideRoot = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `pad-ending` })\n  padEnding = false;\n\n  @property({ type: Boolean, reflect: true, attribute: `with-up` })\n  withUp = false;\n\n  #pendingNode: TreeNode | undefined;\n  #pendingController: AbortController | undefined;\n  #modelUnsubscribe: (() => void) | undefined;\n\n  #previousSelectionKey = ``;\n  #menuOpenedByKeyboard = false;\n  #currentOpenTrigger: MenuTrigger | null = null;\n\n  private tickled = new TickledController<number>(this, {\n    getItems: () => this.#getTickledItems(),\n    onTickle: (index) => {\n      if (index !== undefined) {\n        this.#onTickled(index);\n      }\n    },\n  });\n\n  #getTickledItems() {\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return [];\n\n    const pathNodes = this.#findPath(r, sel) ?? [r];\n    const items: Array<{ id: number; enabled: boolean }> = [];\n\n    if (this.caretEmbedded) {\n      pathNodes.forEach((_node, i) => {\n        items.push({ id: i, enabled: true });\n      });\n      if (this.#canFocusSuggestions()) {\n        items.push({ id: pathNodes.length, enabled: true });\n      }\n    } else {\n      let segmentId = 0;\n      pathNodes.forEach((node, i) => {\n        const isLast = i === pathNodes.length - 1;\n        const hasChildren = node.item.isLeaf !== true && (node.children === undefined || node.children.length > 0);\n        const showLeadingCaret = this.leadingCaret && (i > 0 || this.hideRoot) && hasChildren;\n        const showTrailingCaret = (!this.leadingCaret && hasChildren) || (this.leadingCaret && isLast && hasChildren);\n\n        if (showLeadingCaret) {\n          items.push({ id: segmentId++, enabled: true });\n        }\n        items.push({ id: segmentId++, enabled: true });\n        if (showTrailingCaret) {\n          items.push({ id: segmentId++, enabled: true });\n        }\n      });\n    }\n\n    return items;\n  }\n\n  #onTickled(index: number) {\n    if (this.tickled.inputMode === `keyboard`) {\n      this.#scrollTickledIntoView(index);\n    }\n  }\n\n  #scrollTickledIntoView(index: number): void {\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const pathNodes = this.#findPath(r, sel) ?? [r];\n    let el: HTMLElement | null = null;\n\n    if (this.caretEmbedded && this.#canFocusSuggestions() && index === pathNodes.length) {\n      el = this.shadowRoot?.querySelector<HTMLElement>(`ixfx-narrowed-text`) ?? null;\n    } else {\n      el = this.shadowRoot?.querySelectorAll<HTMLElement>(`.crumb-segment`)[index] ?? null;\n    }\n\n    el?.scrollIntoView({ inline: `nearest`, block: `nearest`, behavior: `smooth` });\n  }\n\n  #hasChildOptions(): boolean {\n    const s = this.selectedNode;\n    if (s === undefined)\n      return false;\n\n    const isPending = this.#pendingNode === s;\n    const children = s.children ?? [];\n\n    return children.length > 0 || isPending;\n  }\n\n  /** True when the suggestions (narrowed-text) sub-part is renderable and focusable. */\n  #canFocusSuggestions(): boolean {\n    return this.showSuggestions && this.#hasChildOptions();\n  }\n\n  #onFocus = (): void => {\n    this._isFocused = true;\n  };\n\n  #onBlur = (): void => {\n    this._isFocused = false;\n  };\n\n  #getHostContainer(): HTMLElement | null {\n    return this.shadowRoot?.querySelector<HTMLElement>(`.host-container`) ?? null;\n  }\n\n  #onHostClick = (): void => {\n    this.#getHostContainer()?.focus();\n  };\n\n  #handleOpenCaretMenu() {\n    const currentTickled = this.tickled.tickledId;\n    if (currentTickled === undefined)\n      return;\n\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const pathNodes = this.#findPath(r, sel) ?? [r];\n\n    // Virtual \"beyond last\" item (embedded mode only, when suggestions are available)\n    if (this.caretEmbedded && this.#canFocusSuggestions() && currentTickled === pathNodes.length) {\n      this.#shiftFocusToNarrowedText();\n      return;\n    }\n\n    const segments = this.shadowRoot?.querySelectorAll<HTMLElement>(`.crumb-segment`);\n    const trigger = segments?.[currentTickled]?.querySelector<MenuTrigger>(`.caret ixfx-menu-trigger`);\n    if (trigger) {\n      this.#menuOpenedByKeyboard = true;\n      this.#currentOpenTrigger = trigger;\n      document.addEventListener(`keydown`, this.#onMenuKeyNav, { capture: true });\n      trigger.openMenu();\n      this.#propagateInputModeToMenu();\n    }\n  }\n\n  #propagateInputModeToMenu(): void {\n    const inputMode = this.tickled.inputMode;\n    requestAnimationFrame(() => {\n      const container = this.#currentOpenTrigger?.querySelector(`ixfx-menu-container`);\n      if (container) {\n        container.setAttribute(`data-input-mode`, inputMode);\n      }\n    });\n  }\n\n  #onMenuTriggerClose = (): void => {\n    document.removeEventListener(`keydown`, this.#onMenuKeyNav, { capture: true });\n    this.#currentOpenTrigger = null;\n    this.#menuOpenedByKeyboard = false;\n    requestAnimationFrame(() => {\n      this.#getHostContainer()?.focus();\n    });\n  };\n\n  #onMenuKeyNav = (e: KeyboardEvent): void => {\n    // Only handle ArrowLeft/ArrowRight - close menu and navigate to previous/next breadcrumb segment\n    // ArrowDown/ArrowUp should pass through to let the menu handle them\n    const container = this.#currentOpenTrigger?.querySelector(`ixfx-menu-container`);\n    if (!container || !this.#currentOpenTrigger?.isOpen)\n      return;\n\n    switch (e.key) {\n      case `ArrowLeft`:\n      case `ArrowRight`: {\n        e.preventDefault();\n        e.stopPropagation();\n        this.#currentOpenTrigger.closeMenu();\n        const r = this.root;\n        const sel = this.selectedNode;\n        if (!r || !sel)\n          break;\n        const totalItems = this.#getTickledItems().length;\n        const currentTickled = this.tickled.tickledId ?? -1;\n        if (e.key === `ArrowLeft`) {\n          if (currentTickled > 0) {\n            this.tickled.handleKeyboardNavigation(`previous`);\n          }\n        } else {\n          if (currentTickled < totalItems - 1) {\n            this.tickled.handleKeyboardNavigation(`next`);\n          }\n        }\n        break;\n      }\n    }\n  };\n\n  #onKeyDown = (e: KeyboardEvent): void => {\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const totalItems = this.#getTickledItems().length;\n    const currentTickled = this.tickled.tickledId ?? -1;\n\n    switch (e.key) {\n      case `ArrowRight`: {\n        e.preventDefault();\n        if (currentTickled < totalItems - 1) {\n          this.tickled.handleKeyboardNavigation(`next`);\n        } else if (currentTickled === totalItems - 1 && this.#canFocusSuggestions()) {\n          this.#shiftFocusToNarrowedText();\n        }\n        break;\n      }\n      case `ArrowLeft`: {\n        e.preventDefault();\n        if (currentTickled > 0) {\n          this.tickled.handleKeyboardNavigation(`previous`);\n        }\n        break;\n      }\n      case `ArrowDown`:\n      case `ArrowUp`: {\n        if (this.tickled.tickledId !== undefined) {\n          e.preventDefault();\n          if (this.#currentOpenTrigger?.isOpen) {\n            // Menu is already open - dispatch ArrowDown to the popover element for it to handle\n            const container = this.#currentOpenTrigger.querySelector(`ixfx-menu-container`);\n            const popover = container?.shadowRoot?.querySelector(`.popover`);\n            if (popover) {\n              popover.dispatchEvent(new KeyboardEvent(`keydown`, { key: e.key, bubbles: true }));\n            }\n          } else {\n            this.#handleOpenCaretMenu();\n          }\n        }\n        break;\n      }\n      case `Enter`:\n      case ` `: {\n        e.preventDefault();\n        this.#activateTickled();\n        break;\n      }\n      case `Escape`: {\n        e.preventDefault();\n        this._menuOpen = false;\n        this.tickled.clearTickled();\n        this.blur();\n        break;\n      }\n      case `Tab`: {\n        if (e.shiftKey) {\n          // Let default Shift+Tab move focus backward, out of the component.\n          break;\n        }\n        if (currentTickled === totalItems - 1 && this.#canFocusSuggestions()) {\n          e.preventDefault();\n          this.#shiftFocusToNarrowedText();\n        }\n        break;\n      }\n    }\n  };\n\n  /** Activates the currently tickled item, as if it had been clicked. */\n  #activateTickled() {\n    const currentTickled = this.tickled.tickledId;\n    if (currentTickled === undefined)\n      return;\n\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const pathNodes = this.#findPath(r, sel) ?? [r];\n\n    // Virtual \"beyond last\" item (embedded mode only, when suggestions are available)\n    if (this.caretEmbedded && this.#canFocusSuggestions() && currentTickled === pathNodes.length) {\n      this.#shiftFocusToNarrowedText();\n      return;\n    }\n\n    const segment = this.shadowRoot?.querySelector<HTMLElement>(`.crumb-segment[data-segment-id=\"${currentTickled}\"]`);\n    segment?.click();\n  }\n\n  #shiftFocusToNarrowedText() {\n    const narrowedText = this.shadowRoot?.querySelector(`ixfx-narrowed-text`);\n    if (narrowedText) {\n      this._menuOpen = false;\n      this._focusOnNarrowedText = true;\n      narrowedText.focus();\n    }\n  }\n\n  #shiftFocusToPath() {\n    this._focusOnNarrowedText = false;\n    const hostContainer = this.#getHostContainer();\n    if (hostContainer) {\n      hostContainer.focus();\n    }\n  }\n\n  #onNarrowedTextBlur = (): void => {\n    this._focusOnNarrowedText = false;\n    this.#shiftFocusToPath();\n  };\n\n  #onNarrowedTextShiftTab = (): void => {\n    this._focusOnNarrowedText = false;\n    this.#shiftFocusToPath();\n  };\n\n  // --- TreeComponent methods ---\n\n  select(node: TreeNode): void {\n    this.#setSelected(node);\n  }\n\n  deselect(_node: TreeNode): void {\n    // Crumb navigation is single-selection; deselect navigates to parent or root\n  }\n\n  clearSelection(): void {\n    if (this.root)\n      this.#setSelected(this.root);\n  }\n\n  /** Not implemented on crumb-navigation. */\n  selectAll(): void {\n    // no-op\n  }\n\n  /** Not implemented on crumb-navigation. */\n  deselectAll(): void {\n    // no-op\n  }\n\n  getNodes(): ReadonlyArray<{ node: TreeNode; depth: number }> {\n    if (!this.root)\n      return [];\n    const result: Array<{ node: TreeNode; depth: number }> = [];\n    const visit = (node: TreeNode, depth: number) => {\n      result.push({ node, depth });\n      if (node.children) {\n        for (const child of node.children) visit(child, depth + 1);\n      }\n    };\n    for (const child of this.root.children ?? []) visit(child, 0);\n    return result;\n  }\n\n  // --- Lifecycle ---\n\n  override updated(changedProps: PropertyValues): void {\n    if (changedProps.has(`model`)) {\n      this.#modelUnsubscribe?.();\n      this.#modelUnsubscribe = undefined;\n      const model = this.model;\n      if (model) {\n        this.root = model.root;\n        this.#modelUnsubscribe = model._subscribe((event) => {\n          if (event.type === `root`) {\n            this.root = event.root;\n            this.requestUpdate();\n          }\n        });\n      }\n    }\n    this.#runLayoutUpdate(changedProps);\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener(`click`, this.#onHostClick);\n    this.addEventListener(`wheel`, this.#onWheel, { passive: false });\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener(`click`, this.#onHostClick);\n    this.removeEventListener(`wheel`, this.#onWheel);\n    this.#modelUnsubscribe?.();\n    this.#modelUnsubscribe = undefined;\n    document.removeEventListener(`keydown`, this.#onMenuKeyNav, { capture: true });\n    this.#currentOpenTrigger = null;\n  }\n\n  override firstUpdated() {\n    const hostContainer = this.#getHostContainer();\n    if (hostContainer) {\n      hostContainer.scrollLeft = hostContainer.scrollWidth - hostContainer.clientWidth;\n    }\n  }\n\n  #isWheelScrolling = false;\n\n  #onWheel = (e: Event) => {\n    const wheelEvent = e as WheelEvent;\n    if (wheelEvent.deltaX !== 0 || wheelEvent.deltaY !== 0) {\n      e.preventDefault();\n      if (!this.#isWheelScrolling) {\n        this.#isWheelScrolling = true;\n        this.tickled.clearTickled();\n      }\n      const hostContainer = this.#getHostContainer();\n      if (hostContainer) {\n        hostContainer.scrollLeft += wheelEvent.deltaX + wheelEvent.deltaY;\n      }\n      clearTimeout(this.#wheelScrollTimeout);\n      this.#wheelScrollTimeout = setTimeout(() => {\n        this.#isWheelScrolling = false;\n      }, 150);\n    }\n  };\n\n  #wheelScrollTimeout: ReturnType<typeof setTimeout> | undefined;\n\n  #runLayoutUpdate(_changedProperties: PropertyValues): void {\n    if (!this.shadowRoot)\n      return;\n\n    const hsiElement: HTMLElement | null = this.shadowRoot.querySelector(`.horiz-select-items`);\n    if (!hsiElement)\n      return;\n\n    const ulElement: HTMLElement | null = hsiElement.querySelector(`ul`);\n    if (!ulElement)\n      return;\n\n    const menuTrigger: HTMLElement | null = this.shadowRoot.querySelector(`ixfx-menu-trigger`);\n    if (!menuTrigger)\n      return;\n\n    if (ulElement.getBoundingClientRect().width > hsiElement.getBoundingClientRect().width) {\n      menuTrigger.style.display = `inline-flex`;\n    } else {\n      menuTrigger.style.display = `none`;\n    }\n\n    for (const li of ulElement.querySelectorAll(`li`)) {\n      const key = li.getAttribute(`data-key`) ?? ``;\n      if (key === this.#previousSelectionKey) {\n        this.#scrollToValue(li);\n        break;\n      }\n    }\n  }\n\n  #scrollToValue(li: HTMLLIElement) {\n    let l = li.offsetLeft;\n\n    const ul = li.parentElement;\n    if (!ul)\n      return;\n    l -= ul.offsetLeft;\n\n    const horizSelectItems = ul.parentElement;\n    if (!horizSelectItems)\n      return;\n    horizSelectItems.scroll({ left: l, top: 0, behavior: `smooth` });\n\n    const horizSelect = horizSelectItems.parentElement;\n    if (!horizSelect)\n      return;\n    horizSelect.style.minWidth = `${li.getBoundingClientRect().width}px`;\n  }\n\n  #abortPending() {\n    if (this.#pendingController) {\n      this.#pendingController.abort();\n      this.#pendingController = undefined;\n      this.#pendingNode = undefined;\n    }\n  }\n\n  #findPath(node: TreeNode, target: TreeNode, acc: TreeNode[] = []): TreeNode[] | undefined {\n    const path = [...acc, node];\n    if (node === target)\n      return path;\n    if (!node.children)\n      return undefined;\n    for (const child of node.children) {\n      const result = this.#findPath(child, target, path);\n      if (result)\n        return result;\n    }\n    return undefined;\n  }\n\n  #scrollSegmentIntoView(depth: number) {\n    if (!this.shadowRoot)\n      return;\n    const segments = this.shadowRoot.querySelectorAll(`.crumb-segment`);\n    const segment = segments[depth];\n    segment?.scrollIntoView({ block: `nearest`, inline: `start` });\n  }\n\n  #updateTrailingWidth(): void {\n    if (!this.padEnding || !this.shadowRoot)\n      return;\n    const hostContainer = this.shadowRoot.querySelector<HTMLElement>(`.host-container`);\n    const trailing = this.shadowRoot.querySelector<HTMLElement>(`.trailing`);\n    if (!hostContainer || !trailing)\n      return;\n    const segments = this.shadowRoot.querySelectorAll(`.crumb-segment`);\n    const lastSegment = segments[segments.length - 1];\n    if (!lastSegment)\n      return;\n    const containerWidth = hostContainer.getBoundingClientRect().width;\n    const itemWidth = lastSegment.getBoundingClientRect().width;\n    if (itemWidth < containerWidth) {\n      trailing.style.width = `${containerWidth - itemWidth - 5}px`;\n      requestAnimationFrame(() => {\n        if (hostContainer.scrollWidth <= hostContainer.clientWidth) {\n          hostContainer.style.setProperty(`--scroll-fade-x-start`, `0px`, `important`);\n        } else {\n          hostContainer.style.removeProperty(`--scroll-fade-x-start`);\n        }\n      });\n    } else {\n      trailing.style.width = ``;\n    }\n  }\n\n  #setSelected(node: TreeNode) {\n    const previous = this.selectedNode;\n    if (previous) {\n      this.#previousSelectionKey = previous.item?.key ?? ``;\n    } else {\n      this.#previousSelectionKey = ``;\n    }\n    const previousSet: ReadonlySet<TreeNode> = previous ? new Set([previous]) : new Set();\n    this.selectedNode = node;\n    this._selectedNodes = new Set([node]);\n\n    if (this.root) {\n      const path = this.#findPath(this.root, node);\n      if (path) {\n        const depth = this.hideRoot && path.length > 1 ? path.length - 2 : path.length - 1;\n        requestAnimationFrame(() => {\n          this.#updateTrailingWidth();\n          const hostContainer = this.#getHostContainer();\n          if (hostContainer) {\n            hostContainer.scrollLeft = 0;\n          }\n          this.#scrollSegmentIntoView(depth);\n        });\n      }\n    }\n\n    this.dispatchEvent(new CustomEvent<TreeSelectDetail>(`select`, {\n      detail: { selected: new Set([node]), previous: previousSet },\n      bubbles: true,\n      composed: true,\n    }));\n  }\n\n  #onLabelClick(node: TreeNode, depth: number) {\n    this._openIdx = -1;\n    this.#setSelected(node);\n    this.#scrollSegmentIntoView(depth);\n    this.dispatchEvent(new CustomEvent<CrumbNavigationItemClickDetail>(`item-click`, {\n      detail: { node, depth },\n      bubbles: true,\n      composed: true,\n    }));\n  }\n\n  #onCaretClick(node: TreeNode, depth: number, e: MouseEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n\n    if (this._openIdx === depth) {\n      this._openIdx = -1;\n      return;\n    }\n    this._openIdx = depth;\n\n    if (node.children === undefined && this.#pendingNode !== node) {\n      this.#abortPending();\n      this.#pendingNode = node;\n      const controller = new AbortController();\n      this.#pendingController = controller;\n\n      if (this.loadChildren) {\n        this.#invokeLoadChildren(node, depth, controller).catch(() => {});\n      }\n    }\n\n    this.requestUpdate();\n  }\n\n  async #invokeLoadChildren(node: TreeNode, depth: number, controller: AbortController): Promise<void> {\n    try {\n      const children = [...await collectDataResult(\n        this.loadChildren!({ node, depth }, controller.signal),\n        controller.signal,\n      )];\n      if (controller.signal.aborted)\n        return;\n      node.children = children;\n      this.#pendingNode = undefined;\n      this.#pendingController = undefined;\n      this.dispatchEvent(new CustomEvent<CrumbNavigationExpandDetail>(`expand`, {\n        detail: { node, depth },\n        bubbles: true,\n        composed: true,\n      }));\n      this.requestUpdate();\n    } catch {\n      if (controller.signal.aborted)\n        return;\n      node.children = [];\n      this.#pendingNode = undefined;\n      this.#pendingController = undefined;\n      this.requestUpdate();\n    }\n  }\n\n  #onSegmentMenuCommand(e: CustomEvent, node: TreeNode, depth: number) {\n    const key = e.detail.command;\n    if (this.leadingCaret) {\n      const child = node.children?.find(c => c.item.key === key);\n      if (child) {\n        this.#onChildClick(child, depth + 1);\n        return;\n      }\n      if (this.#currentLeadingSiblings) {\n        const sibling = this.#currentLeadingSiblings.find(c => c.item.key === key);\n        if (sibling) {\n          this.#onChildClick(sibling, depth);\n        }\n        this.#currentLeadingSiblings = undefined;\n        return;\n      }\n    }\n    const child = node.children?.find(c => c.item.key === key);\n    if (child) {\n      this.#onChildClick(child, depth + 1);\n    }\n  }\n\n  #currentLeadingSiblings: TreeNode[] | undefined = undefined;\n\n  #getSiblingMenuItems(pathNodes: TreeNode[], index: number): unknown {\n    if (index === 0) {\n      if (!this.hideRoot || !this.root)\n        return [];\n      const siblings = [...(this.root.children ?? [])].sort((a, b) => (a.item.label ?? ``).localeCompare(b.item.label ?? ``));\n      this.#currentLeadingSiblings = siblings;\n      return siblings.map(sibling => html`\n        <ixfx-menu-item\n          label=\"${sibling.item.label}\"\n          command=\"${sibling.item.key}\"\n          icon-name=\"${sibling.item.icon ?? nothing}\"\n          @click=${() => {\n            this.#onChildClick(sibling, index);\n          }}\n        ></ixfx-menu-item>\n      `);\n    }\n    const parent = pathNodes[index - 1];\n    const siblings = [...(parent.children ?? [])].sort((a, b) => (a.item.label ?? ``).localeCompare(b.item.label ?? ``));\n    this.#currentLeadingSiblings = siblings;\n    return siblings.map(sibling => html`\n      <ixfx-menu-item\n        label=\"${sibling.item.label}\"\n        command=\"${sibling.item.key}\"\n        icon-name=\"${sibling.item.icon ?? nothing}\"\n        @click=${() => {\n          this.#onChildClick(sibling, index);\n        }}\n      ></ixfx-menu-item>\n    `);\n  }\n\n  #onChildClick(node: TreeNode, depth: number) {\n    this._openIdx = -1;\n    this.#setSelected(node);\n    this.dispatchEvent(new CustomEvent<CrumbNavigationItemClickDetail>(`item-click`, {\n      detail: { node, depth },\n      bubbles: true,\n      composed: true,\n    }));\n  }\n\n  #onUpClick(): void {\n    const r = this.root;\n    const sel = this.selectedNode;\n    if (!r || !sel)\n      return;\n\n    const path = this.#findPath(r, sel);\n    if (!path || path.length <= 1)\n      return;\n\n    const parent = path[path.length - 2];\n    this.#setSelected(parent);\n  }\n\n  /** Navigate to a node by key path. Returns false if any key is not found in already-loaded children. */\n  navigateTo(keys: readonly string[]): boolean {\n    if (!this.root?.children)\n      return false;\n    let current: TreeNode | undefined = this.root;\n    for (const key of keys) {\n      const found: TreeNode | undefined = current?.children?.find(n => n.item.key === key);\n      if (!found)\n        return false;\n      current = found;\n    }\n    if (current && current !== this.root) {\n      this.#setSelected(current);\n    }\n    return true;\n  }\n\n  /** Navigate to the first node matching the predicate. Returns false if not found. */\n  navigateToNode(predicate: (node: TreeNode) => boolean): boolean {\n    if (!this.root)\n      return false;\n    const keyPath = this.#findNodePath(this.root.children ?? [], predicate);\n    if (!keyPath)\n      return false;\n    return this.navigateTo(keyPath);\n  }\n\n  #findNodePath(\n    nodes: TreeNode[],\n    predicate: (node: TreeNode) => boolean,\n    prefix: string[] = [],\n  ): string[] | undefined {\n    for (const node of nodes) {\n      const path = [...prefix, node.item.key];\n      if (predicate(node))\n        return path;\n      if (node.children?.length) {\n        const result = this.#findNodePath(node.children, predicate, path);\n        if (result)\n          return result;\n      }\n    }\n    return undefined;\n  }\n\n  #onMenuCommand(e: CustomEvent) {\n    const node = this.selectedNode;\n    if (!node?.children)\n      return;\n\n    const key = e.detail.command;\n    const child = node.children.find(c => c.item.key === key);\n    if (child) {\n      const depth = this.root ? (this.#findPath(this.root, node)?.length ?? 1) : 1;\n      this.#onChildClick(child, depth);\n    }\n  }\n\n  render() {\n    const r = this.root;\n    const sel = this.selectedNode;\n\n    if (!r || !sel) {\n      return html``;\n    }\n\n    this.inputMode = this.tickled.inputMode;\n\n    let pathNodes = this.#findPath(r, sel) ?? [r];\n    if (this.hideRoot && pathNodes.length > 1) {\n      pathNodes = pathNodes.slice(1);\n    }\n    const _hasChildOptions = this.#hasChildOptions();\n\n    const isAtRoot = (() => {\n      const fullPath = this.#findPath(r, sel) ?? [r];\n      return fullPath.length <= 1;\n    })();\n\n    const parts: Array<ReturnType<typeof html>> = [];\n    let segmentId = 0;\n\n    pathNodes.forEach((node, i) => {\n      const isLast = i === pathNodes.length - 1;\n      const isPending = this.#pendingNode === node;\n      const isOpen = this._openIdx === i;\n      const hasChildren = node.item.isLeaf !== true && (node.children === undefined || node.children.length > 0);\n      const isTickled = this.tickled.isTickled(i);\n\n      const showLeadingCaret = this.leadingCaret && (i > 0 || this.hideRoot) && hasChildren;\n      const showTrailingCaret = (!this.leadingCaret && hasChildren) || (this.leadingCaret && isLast && hasChildren);\n\n      const siblingMenuItems = showLeadingCaret ? this.#getSiblingMenuItems(pathNodes, i) : [];\n      const childMenuItems = (node.children ?? []).map(c => html`\n        <ixfx-menu-item\n          label=\"${c.item.label}\"\n          command=\"${c.item.key}\"\n          icon-name=\"${c.item.icon ?? nothing}\"\n        ></ixfx-menu-item>\n      `);\n\n      if (this.caretEmbedded) {\n        const canTruncate = !this.noTruncate && !isLast && !isTickled;\n\n        parts.push(html`\n          <div class=\"item crumb-segment ${isTickled ? `tickled` : ``} ${canTruncate ? `truncatable` : ``} ${this.leadingCaret ? `leading-caret` : ``} ${isLast ? `last-label` : ``}\" data-segment-id=\"${i}\" data-path-index=\"${i}\"\n            @click=${(e: MouseEvent) => {\n              if ((e.target as HTMLElement).closest(`.caret`))\n                return; this.#onLabelClick(node, i);\n            }}\n          >\n            ${showLeadingCaret\n                ? html`\n              <span class=\"caret ${isOpen ? `open` : ``} ${isPending ? `pending` : ``}\">\n                ${isPending\n                    ? html`<span class=\"loading-spinner\"></span>`\n                    : html`\n                  <ixfx-menu-trigger mode=\"trigger\" label=\"›\" .tabStop=${false} @menu-command=${(e: CustomEvent) => this.#onSegmentMenuCommand(e, node, i)}>\n                    <ixfx-menu-container slot=\"menu\">\n                      ${siblingMenuItems}\n                    </ixfx-menu-container>\n                  </ixfx-menu-trigger>\n                  `\n                }\n              </span>\n              `\n                : nothing\n            }\n            <span class=\"label\">${node.item.label}</span>\n            ${showTrailingCaret\n                ? html`\n              <span class=\"caret ${isOpen ? `open` : ``} ${isPending ? `pending` : ``}\">\n                ${isPending\n                    ? html`<span class=\"loading-spinner\"></span>`\n                    : html`\n                  <ixfx-menu-trigger mode=\"trigger\" label=\"›\" .tabStop=${false} placement=\"right-start\" @menu-command=${(e: CustomEvent) => this.#onSegmentMenuCommand(e, node, i)}>\n                    <ixfx-menu-container slot=\"menu\">\n                      ${childMenuItems}\n                    </ixfx-menu-container>\n                  </ixfx-menu-trigger>\n                  `\n                }\n              </span>\n              `\n                : nothing\n            }\n          </div>\n        `);\n      } else {\n        const leadingCaretTickled = showLeadingCaret ? this.tickled.isTickled(segmentId) : false;\n        if (showLeadingCaret) {\n          parts.push(html`\n            <div class=\"item crumb-segment ${leadingCaretTickled ? `tickled` : ``}\" data-segment-id=\"${segmentId}\" data-path-index=\"${i}\"\n              @click=${(e: MouseEvent) => {\n                const trigger = (e.target as HTMLElement).closest(`.crumb-segment`)?.querySelector(`ixfx-menu-trigger`);\n                if (trigger)\n                  trigger.openMenu();\n              }}\n            >\n              <span class=\"caret ${isOpen ? `open` : ``} ${isPending ? `pending` : ``}\">\n                ${isPending\n                    ? html`<span class=\"loading-spinner\"></span>`\n                    : html`\n                  <ixfx-menu-trigger mode=\"trigger\" label=\"›\" .tabStop=${false} placement=\"right-start\" @menu-command=${(e: CustomEvent) => this.#onSegmentMenuCommand(e, node, i)}>\n                    <ixfx-menu-container slot=\"menu\">\n                      ${siblingMenuItems}\n                    </ixfx-menu-container>\n                  </ixfx-menu-trigger>\n                  `\n                }\n              </span>\n            </div>\n          `);\n          segmentId++;\n        }\n        const labelTickled = this.tickled.isTickled(segmentId);\n        const canTruncate = !this.noTruncate && !isLast && !labelTickled;\n        parts.push(html`\n          <div class=\"item crumb-segment ${labelTickled ? `tickled` : ``} ${canTruncate ? `truncatable` : ``} ${isLast ? `last-label` : ``}\" data-segment-id=\"${segmentId}\" data-path-index=\"${i}\"\n            @click=${(e: MouseEvent) => {\n              if ((e.target as HTMLElement).closest(`.caret`))\n                return; this.#onLabelClick(node, i);\n            }}\n          >\n            <span class=\"label\">${node.item.label}</span>\n          </div>\n        `);\n        segmentId++;\n        if (showTrailingCaret) {\n          const trailingCaretTickled = this.tickled.isTickled(segmentId);\n          parts.push(html`\n            <div class=\"item crumb-segment ${trailingCaretTickled ? `tickled` : ``}\" data-segment-id=\"${segmentId}\" data-path-index=\"${i}\"\n              @click=${(e: MouseEvent) => {\n                const trigger = (e.target as HTMLElement).closest(`.crumb-segment`)?.querySelector(`ixfx-menu-trigger`);\n                if (trigger)\n                  trigger.openMenu();\n              }}\n            >\n              <span class=\"caret ${isOpen ? `open` : ``} ${isPending ? `pending` : ``}\">\n                ${isPending\n                    ? html`<span class=\"loading-spinner\"></span>`\n                    : html`\n                  <ixfx-menu-trigger mode=\"trigger\" label=\"›\" .tabStop=${false} @menu-command=${(e: CustomEvent) => this.#onSegmentMenuCommand(e, node, i)}>\n                    <ixfx-menu-container slot=\"menu\">\n                      ${childMenuItems}\n                    </ixfx-menu-container>\n                  </ixfx-menu-trigger>\n                  `\n                }\n              </span>\n            </div>\n          `);\n          segmentId++;\n        }\n      }\n    });\n\n    return html`\n      <div class=\"crumb-wrapper\">\n        ${this.withUp\n          ? html`\n            <button\n              class=\"up-button\"\n              ?disabled=${isAtRoot}\n              aria-label=\"Go up one level\"\n              @click=${this.#onUpClick}\n            >\n              <ixfx-icon name=\"folder-up\"></ixfx-icon>\n            </button>\n          `\n          : nothing}\n        <div\n          class=\"host-container scroll-fade-x\"\n          tabindex=\"0\"\n          @focus=${this.#onFocus}\n          @blur=${this.#onBlur}\n          @keydown=${this.#onKeyDown}\n          @click=${this.#onHostClick}\n          @menu-trigger-close=${this.#onMenuTriggerClose}\n          @mouseout=${(e: MouseEvent) => this.tickled.handlePointerLeave(e as PointerEvent)}\n        >\n          <div class=\"parts\"\n            @mouseover=${(e: MouseEvent) => {\n              if (this.#isWheelScrolling)\n                return;\n              const target = e.target;\n              if (!(target instanceof HTMLElement))\n                return;\n              const segment = target.closest(`.crumb-segment`) as HTMLElement | null;\n              if (!segment)\n                return;\n              const segmentId = parseInt(segment.dataset.segmentId ?? ``, 10);\n              if (Number.isNaN(segmentId))\n                return;\n              const pathIndex = parseInt(segment.dataset.pathIndex ?? ``, 10);\n              const node = pathNodes[pathIndex];\n              if (!node)\n                return;\n              this.tickled.handlePointerEnter(segmentId);\n              this.dispatchEvent(new CustomEvent<TreeTickleDetail>(`tickle`, { detail: { node, depth: pathIndex }, bubbles: true, composed: true }));\n            }}\n          >${parts}${this.padEnding ? html`<div class=\"trailing\"></div>` : nothing}</div>\n          ${this.showSuggestions ? this.#renderChildOptions() : nothing}\n        </div>\n      </div>\n    `;\n  }\n\n  #renderChildOptions() {\n    const s = this.selectedNode;\n    if (s === undefined) {\n      return nothing;\n    }\n\n    const isPending = this.#pendingNode === s;\n    const children = s.children ?? [];\n\n    if (children.length === 0 && !isPending) {\n      return nothing;\n    }\n\n    if (isPending) {\n      return html`\n        <div class=\"horiz-select\">\n          <div class=\"horiz-select-items\">\n            <span class=\"loading-spinner\"></span>\n          </div>\n        </div>\n      `;\n    }\n\n    return html`\n      <ixfx-narrowed-text\n        class=\"horiz-select\"\n        selection-mode=\"single\"\n        orientation=\"horizontal\"\n        nowrap\n        width=${this.#getChildOptionsWidth()}\n        @change=${this.#onNarrowedTextChange}\n        @narrowed-text-blur=${this.#onNarrowedTextBlur}\n        @narrowed-text-shift-tab=${this.#onNarrowedTextShiftTab}\n      >\n        ${children.map(c => html`\n          <span data-value=\"${c.item.key}\" data-label=\"${c.item.label}\"></span>\n        `)}\n      </ixfx-narrowed-text>\n    `;\n  }\n\n  #onNarrowedTextChange(e: CustomEvent) {\n    e.stopPropagation();\n    const detail = e.detail as { item: { value: string } };\n    const node = this.selectedNode;\n    if (!node?.children)\n      return;\n\n    const child = node.children.find(c => c.item.key === detail.item.value);\n    if (child) {\n      const depth = this.root ? (this.#findPath(this.root, node)?.length ?? 1) : 1;\n      this.#onChildClick(child, depth);\n    }\n  }\n\n  #getChildOptionsWidth(): string {\n    return `var(--child-options-width, 50ch)`;\n  }\n\n  static styles = [themeFallbacks, tickledStyles, tickledItemStyles, scrollFadeStyles(`x`), css`\n    :host {\n      --crumb-item-bg: var(--item-bg, transparent);\n      --crumb-item-bg-tickled: var(--item-bg-tickled);\n      --crumb-item-text-tickled: var(--item-text-tickled);\n      --crumb-item-border: var(--item-border);\n      --crumb-item-border-tickled: var(--item-border-tickled);\n      --crumb-item-padding: var(--space-s, 2px);\n      --crumb-item-border-radius: var(--item-border-radius);\n      --crumb-item-gap: var(--item-gap, var(--space-xs));\n      --crumb-separator: var(--surface-muted-text);\n      --crumb-truncate-min-width: 10ch;\n      display: flex;\n      width: 100%;\n    }\n\n    /* Outline goes on :host, not .host-container: .host-container carries the\n     * scroll-fade mask-image, and CSS masks clip everything painted outside\n     * the masked box - including an outline, which paints outside the border edge. */\n    :host(:focus-within) {\n      outline: 2px solid var(--accent);\n      outline-offset: 2px;\n    }\n\n    .crumb-wrapper {\n      display: flex;\n      align-items: center;\n      gap: var(--crumb-item-gap);\n      width: 100%;\n    }\n\n    .up-button {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      flex-shrink: 0;\n      background: var(--crumb-item-bg);\n      border: var(--crumb-item-border);\n      border-radius: var(--crumb-item-border-radius);\n      padding: var(--crumb-item-padding);\n      cursor: pointer;\n      color: inherit;\n    }\n\n    .up-button:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .up-button:hover:not(:disabled) {\n      background: var(--crumb-item-bg-tickled);\n      border-color: var(--crumb-item-border-tickled);\n    }\n\n    .up-button ixfx-icon {\n      width: 1em;\n      height: 1em;\n      pointer-events: none;\n    }\n\n    /* Edge fade (shows/hides based on scroll position) comes from the\n     * shared .scroll-fade-x class - see ../styles/scroll-fade.ts */\n    .host-container {\n      display: flex;\n      flex: 1;\n      min-width: 0;\n      outline: none;\n      overflow: scroll;\n      scroll-snap-type: x mandatory;\n      scrollbar-width: none;\n      overscroll-behavior: none;\n    }\n\n    .host-container::-webkit-scrollbar {\n      display: none;\n    }\n\n    .parts {\n      display: flex;\n      gap: var(--space-s);\n    }\n\n    .trailing {\n      flex-shrink: 0;\n    }\n\n    .crumb-segment {\n      display: flex;\n      align-items: center;\n      flex-shrink: 0;\n      background: var(--crumb-item-bg);\n      border: var(--crumb-item-border);\n      border-radius: var(--crumb-item-border-radius);\n      padding:0;\n    }\n\n    .crumb-segment.leading-caret {\n      flex-direction: row;\n    }\n\n    .crumb-segment.tickled {\n      background: var(--crumb-item-bg-tickled);\n      border-color: var(--crumb-item-border-tickled);\n      color: var(--crumb-item-text-tickled);\n      flex-shrink: 0;\n      min-width: auto;\n    }\n\n    .crumb-segment.truncatable {\n      flex-shrink: 1;\n      min-width: min(var(--crumb-truncate-min-width), auto);\n      overflow: hidden;\n    }\n\n    .crumb-segment.truncatable .label {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      min-width: 0;\n    }\n\n    .label {\n      padding: var(--crumb-item-padding);\n      cursor: pointer;\n      white-space: nowrap;\n      color: inherit;\n    }\n\n    .crumb-segment.last-label .label {\n      color: var(--crumb-last-label-color, inherit);\n      font-style: var(--crumb-last-label-font-style, inherit);\n      font-weight: var(--crumb-last-label-font-weight, inherit);\n      text-decoration: var(--crumb-last-label-text-decoration, inherit);\n      text-underline-offset: var(--crumb-last-label-text-underline-offset, auto);\n    }\n\n    .crumb-segment.tickled .label {\n      color: var(--crumb-item-text-tickled);\n      overflow: visible;\n      text-overflow: clip;\n    }\n\n    .crumb-segment ixfx-menu-trigger {\n      --ixfx-button-padding: var(--space-s, 2px);\n    }\n\n    .caret {\n      position: relative;\n      cursor: pointer;\n      color: var(--crumb-separator);\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      transition: all 0.2s ease-in-out;\n    }\n\n    .caret.open {\n      background: color-mix(in srgb, var(--surface-5) 40%, transparent);\n    }\n\n    .caret.pending {\n      display: inline-flex;\n    }\n\n    .caret > ixfx-menu-trigger {\n      display: inline-flex;\n      margin: 0;\n      --_trigger-hover-bg: transparent;\n      --_trigger-hover-opacity: 0.6;\n    }\n\n    .caret > ixfx-menu-trigger::part(base) {\n      background: none;\n      border: none;\n      color: inherit;\n      cursor: pointer;\n      font-size: inherit;\n      line-height: 1;\n    }\n\n    .caret > ixfx-menu-trigger::part(base):hover {\n      background: none;\n      opacity: 0.6;\n    }\n\n    .separator {\n      margin-left: var(--crumb-item-gap);\n      margin-right: var(--crumb-item-gap);\n      color: var(--crumb-separator);\n    }\n\n    .separator-trigger {\n      display: inline-flex;\n      margin-left: var(--crumb-item-gap);\n      margin-right: var(--crumb-item-gap);\n      --_trigger-hover-bg: transparent;\n      --_trigger-hover-opacity: 0.6;\n    }\n\n    .separator-trigger::part(base) {\n      background: none;\n      border: none;\n      color: var(--crumb-separator);\n      padding: 0;\n      cursor: pointer;\n      font-size: inherit;\n      line-height: 1;\n    }\n\n    .separator-trigger::part(base):hover {\n      background: none;\n      opacity: 0.6;\n    }\n\n    .separator-trigger.tickled::part(base) {\n    }\n\n    ixfx-menu-trigger {\n      display: none;\n    }\n\n    .horiz-select > ixfx-menu-trigger {\n      display: inline-flex;\n    }\n\n    .horiz-select {\n      display: flex;\n      min-width: 5ch;\n    }\n\n    .loading-spinner {\n      display: inline-block;\n      width: 12px;\n      height: 12px;\n      border: 2px solid var(--surface-5);\n      border-top-color: var(--accent);\n      border-radius: 50%;\n      animation: crumb-spin 0.7s linear infinite;\n    }\n\n    @keyframes crumb-spin {\n      to { transform: rotate(360deg); }\n    }\n\n    ::slotted(*), option {\n      user-select: none;\n      scroll-snap-align: start;\n    }\n  `];\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ixfx-crumb-navigation\": CrumbNavigationElement;\n  }\n}\n\nexport interface CrumbNavigationElementEventMap extends TreeComponentEventMap {\n  'item-click': TreeItemClickEvent;\n  'expand': TreeExpandEvent;\n  'select': TreeSelectEvent;\n  'tickle': TreeTickleEvent;\n  'activate': TreeActivateEvent;\n}\n\nexport interface CrumbNavigationElement {\n  addEventListener: (<K extends keyof CrumbNavigationElementEventMap>(\n    type: K,\n    listener: (this: CrumbNavigationElement, event: CrumbNavigationElementEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions,\n  ) => void) & ((\n    type: string,\n    listener: EventListenerOrEventListenerObject,\n    options?: boolean | AddEventListenerOptions,\n  ) => void);\n}\n"],"mappings":"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"}

package/dist/data-display.js

@@ -1,4 +1,4 @@
-import { t as themeFallbacks } from "./fallbacks-DEE1nCTt.js";
+import { t as themeFallbacks } from "./fallbacks-DNI9xt0F.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
 import { LitElement, css } from "lit";
 import { property } from "lit/decorators.js";