@ixfx/components 0.11.3 → 0.11.5

package/dist/range-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"range-input.js","names":["customElement"],"sources":["../src/range-input/range-input.ts"],"sourcesContent":["/**\n * <ixfx-range-input> — styled range input with no label.\n *\n * A thin wrapper around <input type=\"range\"> that adds the same\n * fancy track/thumb/fill styling as the linear-value components,\n * without the label display.\n *\n * Supports horizontal (default) and vertical orientation in a single element.\n * Set orientation=\"vertical\" attribute to switch.\n *\n * CSS Variables:\n *   --track-thickness            Track cross-axis size (default 1.5em)\n *   --thumb-color                Thumb fill (default var(--surface-2-text))\n *   --thumb-color-active         Thumb fill on hover/active (default var(--accent))\n *   --thumb-size                 Thumb cross-axis size (default var(--track-thickness))\n *   --thumb-thickness            Thumb inline size (default 2em)\n *   --thumb-radius               Thumb border-radius (default 0)\n *   --thumb-border               Thumb border (default none)\n *   --thumb-shadow               Thumb box-shadow (default none)\n *   --background-track           Unfilled track background (default var(--surface-4))\n *   --background-track-hover     Unfilled track on hover (default --background-track)\n *   --background-track-value     Filled track color (default var(--surface-6))\n *   --background-track-value-hover   Filled track on hover (default var(--accent))\n *   --background-track-value-active  Filled track on active (default var(--accent))\n *\n * Optional vertical-specific overrides (fall back to horizontal vars when unset):\n *   --background-track-vertical\n *   --background-track-value-vertical\n *   --background-track-value-hover-vertical\n *   --background-track-value-active-vertical\n *\n * Tooltip:\n *   tooltip               Boolean attribute — enables value tooltip on hover/focus\n *   tooltip-orientation   'top' (default) | 'right'\n *   labelFormatter        Function property (not attribute): (rawValue: number, scaledValue: number) => string\n *                         rawValue  = native input value within min..max\n *                         scaledValue = normalised 0..1 position\n *\n * Swipeable mode:\n *   swipeable   Boolean attribute — enables swipe-to-draw gesture.\n *               When active, pressing down on the slider or entering it while the\n *               pointer is pressed sets the value from the cursor coordinate.\n *               Pointer capture is NOT held, so the cursor can move to adjacent\n *               swipeable sliders and update them too (step-sequencer style).\n *               Kill-axis exit (above/below for horizontal, left/right for vertical)\n *               freezes the value; re-entering re-engages.\n *\n * Wheel:\n *   lighttouch  Boolean attribute — wheel adjusts the value on hover instead\n *               of requiring focus. The native `<input type=\"range\">` inside\n *               already responds to wheel when focused; the host listener\n *               fires under `lighttouch` (or when focus is on the host) and\n *               synthesises a value change via `input`/`change` events.\n *               See `docs/infra-mousewheel.md`.\n *\n * Events:\n *   input  — CustomEvent<{ value: number }>\n *   change — CustomEvent<{ value: number }>\n *             In swipeable mode fires on pointerleave (or pointerup if released\n *             while still inside). In normal mode delegates to native change.\n */\nimport type { CSSResultGroup } from 'lit';\nimport type { WheelDirection } from '../mixins/wheel-nudge.js';\nimport type { TooltipElement, TooltipOrientations } from '../util/tooltip.js';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { WheelNudgeMixin } from '../mixins/wheel-nudge.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { tooltipValueStyles } from '../styles/tooltip.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\n\nfunction normalize(value: number, min: number, max: number): number {\n  return max === min ? 0 : (value - min) / (max - min);\n}\n\n@customElement(`ixfx-range-input`)\nexport class RangeInput extends WheelNudgeMixin(LitElement) {\n  @property({ type: Number }) min = 0;\n  @property({ type: Number }) max = 1;\n  @property({ type: Number }) value = 0;\n  @property({ type: Number }) step = 0.01;\n  @property({ type: String, reflect: true }) orientation: `horizontal` | `vertical` = `horizontal`;\n  @property({ type: Boolean, reflect: true }) swipeable = false;\n  @property({ type: Boolean }) tooltip = false;\n  @property({ type: String, attribute: `tooltip-orientation` }) tooltipOrientation: TooltipOrientations = `top`;\n  @property({ attribute: false }) labelFormatter?: (rawValue: number, scaledValue: number) => string;\n\n  @query(`input`)\n  _inputEl!: HTMLInputElement;\n\n  @query(`ixfx-tooltip`)\n  _tooltipEl?: TooltipElement | null;\n\n  /** True if this slider changed its value during the current pointer visit. */\n  private _swipeModified = false;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.addEventListener(`pointerdown`, this._onPointerDown);\n    this.addEventListener(`pointermove`, this._onPointerMove);\n    this.addEventListener(`pointerenter`, this._onPointerEnter);\n    this.addEventListener(`pointerleave`, this._onPointerLeave);\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener(`pointerdown`, this._onPointerDown);\n    this.removeEventListener(`pointermove`, this._onPointerMove);\n    this.removeEventListener(`pointerenter`, this._onPointerEnter);\n    this.removeEventListener(`pointerleave`, this._onPointerLeave);\n    window.removeEventListener(`pointerup`, this._onWindowPointerUp);\n  }\n\n  private _valueFromPointer(e: PointerEvent): number {\n    const rect = this.getBoundingClientRect();\n    // vertical: top = max, bottom = min (writing-mode: vertical-rl; direction: rtl)\n    const normalized = this.orientation === `vertical`\n      ? Math.max(0, Math.min(1, 1 - (e.clientY - rect.top) / rect.height))\n      : Math.max(0, Math.min(1, (e.clientX - rect.left) / rect.width));\n    const raw = this.min + normalized * (this.max - this.min);\n    const snapped = Math.round((raw - this.min) / this.step) * this.step + this.min;\n    return Math.max(this.min, Math.min(this.max, snapped));\n  }\n\n  private _applySwipeValue(value: number): void {\n    this.value = value;\n    if (this._inputEl)\n      this._inputEl.value = String(value);\n    this.style.setProperty(`--value`, String(normalize(value, this.min, this.max)));\n    this.dispatchEvent(new CustomEvent(`input`, { detail: { value }, bubbles: true, composed: true }));\n    this._swipeModified = true;\n  }\n\n  private _onPointerDown = (e: PointerEvent): void => {\n    if (!this.swipeable)\n      return;\n    e.preventDefault();\n    this._swipeModified = false;\n    this._applySwipeValue(this._valueFromPointer(e));\n    window.addEventListener(`pointerup`, this._onWindowPointerUp, { once: true });\n  };\n\n  private _onPointerMove = (e: PointerEvent): void => {\n    if (!this.swipeable || e.buttons === 0)\n      return;\n    this._applySwipeValue(this._valueFromPointer(e));\n  };\n\n  private _onPointerEnter = (e: PointerEvent): void => {\n    if (!this.swipeable || e.buttons === 0)\n      return;\n    this._swipeModified = false;\n    this._applySwipeValue(this._valueFromPointer(e));\n    window.addEventListener(`pointerup`, this._onWindowPointerUp, { once: true });\n  };\n\n  private _onPointerLeave = (_e: PointerEvent): void => {\n    if (!this.swipeable || !this._swipeModified)\n      return;\n    this._swipeModified = false;\n    this.dispatchEvent(new CustomEvent(`change`, { detail: { value: this.value }, bubbles: true, composed: true }));\n  };\n\n  private _onWindowPointerUp = (): void => {\n    if (!this._swipeModified)\n      return;\n    this._swipeModified = false;\n    this.dispatchEvent(new CustomEvent(`change`, { detail: { value: this.value }, bubbles: true, composed: true }));\n  };\n\n  override updated(changedProperties: Map<string, unknown>): void {\n    super.updated(changedProperties);\n    if (changedProperties.has(`value`) || changedProperties.has(`min`) || changedProperties.has(`max`)) {\n      this.style.setProperty(`--value`, String(normalize(this.value, this.min, this.max)));\n    }\n    if (this._tooltipEl) {\n      this._tooltipEl.valueFormatTooltip = (v: unknown) => {\n        const num = typeof v === `number` ? v : Number(v);\n        if (this.labelFormatter)\n          return this.labelFormatter(num, normalize(num, this.min, this.max));\n        const decimals = this.step >= 1 ? 0 : this.step >= 0.1 ? 1 : 2;\n        return num.toFixed(decimals);\n      };\n    }\n  }\n\n  _handleInput = (e: Event): void => {\n    e.preventDefault();\n    e.stopImmediatePropagation();\n    const target = e.target as HTMLInputElement;\n    const value = Number.parseFloat(target.value);\n    this.value = value;\n    this.style.setProperty(`--value`, String(normalize(value, this.min, this.max)));\n    this.dispatchEvent(new CustomEvent(`input`, { detail: { value }, bubbles: true, composed: true }));\n  };\n\n  _formatTooltipLabel(): string {\n    const normalized = normalize(this.value, this.min, this.max);\n    if (this.labelFormatter)\n      return this.labelFormatter(this.value, normalized);\n    const decimals = this.step >= 1 ? 0 : this.step >= 0.1 ? 1 : 2;\n    return this.value.toFixed(decimals);\n  }\n\n  _handleChange = (): void => {\n    const value = Number.parseFloat(this._inputEl.value);\n    this.dispatchEvent(new CustomEvent(`change`, { detail: { value }, bubbles: true, composed: true }));\n  };\n\n  /**\n   * Wheel handler — installed by WheelNudgeMixin on the host. Synthesises a\n   * value change by writing to the inner `<input type=\"range\">` and dispatching\n   * `input` + `change`, so the existing `_handleInput` and `_handleChange`\n   * handlers run unchanged and re-bubble the events to listeners.\n   *\n   * Native wheel handling is left intact for the focused-inner-input case;\n   * the host listener fires under `lighttouch` or when focus is on the host.\n   */\n  override _applyWheelDelta(direction: WheelDirection, _event: WheelEvent): void {\n    const input = this._inputEl;\n    if (!input)\n      return;\n    const step = this.step > 0 ? this.step : Math.max((this.max - this.min) / 100, 0.01);\n    const candidate = this.value + direction * step;\n    const clamped = Math.min(this.max, Math.max(this.min, candidate));\n    if (clamped === this.value)\n      return;\n\n    input.value = String(clamped);\n    input.dispatchEvent(new Event(`input`, { bubbles: true }));\n    input.dispatchEvent(new Event(`change`, { bubbles: true }));\n  }\n\n  override render() {\n    const tooltipEl = this.tooltip\n      ? html`\n      <ixfx-tooltip\n        style=\"--tooltip-background: var(--surface-5); --tooltip-color: var(--surface-5-text)\"\n        .orientation=${this.tooltipOrientation}\n        anchor=\"--ixfx-ri-thumb\"\n        .value=${this.value}\n      ></ixfx-tooltip>\n    `\n      : nothing;\n\n    return html`\n      <div class=\"wrap\">\n        <div class=\"range-bg\"></div>\n        <input\n          type=\"range\"\n          .min=${String(this.min)}\n          .max=${String(this.max)}\n          .step=${String(this.step)}\n          .value=${String(this.value)}\n          @input=${this._handleInput}\n          @change=${this._handleChange}\n        >${tooltipEl}\n      </div>\n    `;\n  }\n\n  static styles: CSSResultGroup = [themeFallbacks, tooltipValueStyles, css`\n    :host {\n      display: block;\n      container-type: size;\n      user-select: none;\n      touch-action: none;\n      -webkit-touch-action: none;\n      width: var(--width, 200px);\n      height: var(--height, 2em);\n\n      /*\n       * Internal resolved vars — read public vars and apply defaults here.\n       * Public vars are NOT defined in :host {}, only read via fallback.\n       * This lets inherited values from ancestor elements flow through.\n       */\n      --_track-thickness: var(--track-thickness, 100%);\n      --_thumb-thickness: var(--thumb-thickness, 2em);\n      --_thumb-color: var(--thumb-color, var(--surface-2-text));\n      --_thumb-color-active: var(--thumb-color-active, var(--surface-2-text));\n      --_thumb-opacity: var(--thumb-opacity, 0.7);\n      --_thumb-opacity-hover: var(--thumb-opacity-hover, 0.8);\n      --_thumb-opacity-active: var(--thumb-opacity-active, 1); \n      --_thumb-size: var(--thumb-size, var(--_track-thickness));\n      --_thumb-radius: var(--thumb-radius, 0);\n      --_thumb-border: var(--thumb-border, none);\n      --_thumb-shadow: var(--thumb-shadow, none);\n      --_track-radius: var(--track-radius, none);\n      --_track-corner-shape: var(--track-corner-shape, none);\n      --_bg-track: var(--background-track, var(--surface-4));\n      --_bg-track-hover: var(--background-track-hover, var(--_bg-track));\n      --_bg-track-value: var(--background-track-value, var(--surface-6));\n      --_bg-track-value-hover: var(--background-track-value-hover, var(--accent));\n      --_bg-track-value-active: var(--background-track-value-active, var(--accent));\n\n      --value: 0;\n      --sx1: calc(var(--_thumb-thickness) + var(--value) * (100% - var(--_thumb-thickness)));\n      --track-avail: calc(100% - var(--_thumb-thickness));\n      --sx: calc(var(--_thumb-thickness) + (var(--value) * var(--track-avail)));\n      --track-mask: linear-gradient(to right, rgba(0,0,0,1) var(--sx), rgba(0,0,0,0) var(--sx) 100%);\n      --track-mask-vertical: linear-gradient(to top, rgba(0,0,0,1) var(--sx), rgba(0,0,0,0) var(--sx) 100%);\n    }\n\n    :host([orientation=\"vertical\"]) {\n      width: var(--width, 2em);\n      height: var(--height, 200px);\n    }\n\n    .wrap {\n      display: grid;\n      width: 100%;\n      height: 100%;\n    }\n\n    .wrap > * {\n      grid-area: 1 / 1;\n    }\n\n    .range-bg {\n      background: var(--_bg-track);\n      width: 100%;\n      height: 100%;\n      margin: 0;\n      padding: 0;\n      border-radius: var(--_track-radius);\n      corner-shape: var(--_track-corner-shape);\n    }\n\n    .wrap:hover .range-bg {\n      background: var(--_bg-track-hover);\n    }\n\n    input[type=range] {\n      margin: 0;\n      padding: 0;\n      -webkit-appearance: none;\n      background: unset;\n      box-shadow: none;\n      width: 100%;\n      height: var(--_track-thickness);\n      align-self: center;\n    }\n\n    input[type=range]:focus {\n      outline: none;\n    }\n\n    /* Vertical layout */\n    :host([orientation=\"vertical\"]) .range-bg {\n      background: var(--background-track-vertical, var(--_bg-track));\n      width: var(--_track-thickness);\n      height: 100%;\n      justify-self: center;\n    }\n\n    :host([orientation=\"vertical\"]) .wrap:hover .range-bg {\n      background: var(--background-track-hover-vertical, var(--_bg-track-hover));\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range] {\n      writing-mode: vertical-rl;\n      direction: rtl;\n      width: var(--_track-thickness);\n      height: 100%;\n      justify-self: center;\n    }\n\n    /* ── Webkit thumb ── */\n    input[type=range]::-webkit-slider-thumb {\n      -webkit-appearance: none;\n      opacity: var(--_thumb-opacity);\n      box-sizing: border-box;\n      anchor-name: --ixfx-ri-thumb;\n      width: var(--_thumb-thickness);\n      height: var(--_thumb-size);\n      border-radius: var(--_thumb-radius);\n      background: var(--_thumb-color);\n      border: var(--_thumb-border);\n      box-shadow: var(--_thumb-shadow);\n      margin-top: calc(max((var(--_thumb-thickness) - 1px - 1px) * 0.5, 0px) - var(--_thumb-thickness) * 0.5);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]::-webkit-slider-thumb {\n      width: var(--_thumb-size);\n      height: var(--_thumb-thickness);\n      margin-top: 0;\n      margin-left: calc(max((1em - 1px - 1px) * 0.5, 0px) - 1.2em * 0.5);\n    }\n\n    input[type=range]::-webkit-slider-thumb:hover {\n      opacity: var(--_thumb-opacity-hover);\n    }\n\n    input[type=range]::-webkit-slider-thumb:active {\n      opacity: var(--_thumb-opacity-active);\n    }\n    input[type=range]::-webkit-slider-thumb:hover,\n    input[type=range]::-webkit-slider-thumb:active {\n      background: var(--_thumb-color-active);\n    }\n\n    /* ── Webkit track ── */\n    input[type=range]::-webkit-slider-runnable-track {\n      height: var(--_track-thickness);\n      background: var(--_bg-track-value);\n      mask-image: var(--track-mask);\n      box-shadow: none;\n      margin: 0;\n      padding: 0;\n      border-radius: var(--_track-radius);\n      corner-shape: var(--_track-corner-shape);\n    }\n\n    input[type=range]:hover::-webkit-slider-runnable-track {\n      background: var(--_bg-track-value-hover);\n      mask-image: var(--track-mask);\n    }\n\n    input[type=range]:active::-webkit-slider-runnable-track {\n      background: var(--_bg-track-value-active);\n      mask-image: var(--track-mask);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]::-webkit-slider-runnable-track {\n      background: var(--background-track-value-vertical, var(--_bg-track-value));\n      mask-image: var(--track-mask-vertical);\n      width: var(--_track-thickness);\n      height: unset;\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]:hover::-webkit-slider-runnable-track {\n      background: var(--background-track-value-hover-vertical, var(--_bg-track-value-hover));\n      mask-image: var(--track-mask-vertical);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]:active::-webkit-slider-runnable-track {\n      background: var(--background-track-value-active-vertical, var(--_bg-track-value-active));\n      mask-image: var(--track-mask-vertical);\n    }\n\n    /* ── Mozilla thumb ── */\n    input[type=range]::-moz-range-thumb {\n      box-sizing: border-box;\n      width: var(--_thumb-thickness);\n      height: var(--_thumb-size);\n      border-radius: var(--_thumb-radius);\n      background: var(--_thumb-color);\n      border: var(--_thumb-border);\n      box-shadow: var(--_thumb-shadow);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]::-moz-range-thumb {\n      width: var(--_thumb-size);\n      height: var(--_thumb-thickness);\n    }\n\n    input[type=range]::-moz-range-thumb:hover,\n    input[type=range]::-moz-range-thumb:active {\n      background: var(--_thumb-color-active);\n    }\n\n    /* ── Mozilla track ── */\n    input[type=range]::-moz-range-track {\n      height: var(--_track-thickness);\n      background: var(--_bg-track-value);\n      mask-image: var(--track-mask);\n      box-shadow: none;\n      margin: 0;\n      padding: 0;\n    }\n\n    input[type=range]:hover::-moz-range-track {\n      background: var(--_bg-track-value-hover);\n      mask-image: var(--track-mask);\n    }\n\n    input[type=range]:active::-moz-range-track {\n      background: var(--_bg-track-value-active);\n      mask-image: var(--track-mask);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]::-moz-range-track {\n      background: var(--background-track-value-vertical, var(--_bg-track-value));\n      mask-image: var(--track-mask-vertical);\n      height: unset;\n      width: var(--_track-thickness);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]:hover::-moz-range-track {\n      background: var(--background-track-value-hover-vertical, var(--_bg-track-value-hover));\n      mask-image: var(--track-mask-vertical);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]:active::-moz-range-track {\n      background: var(--background-track-value-active-vertical, var(--_bg-track-value-active));\n      mask-image: var(--track-mask-vertical);\n    }\n\n    /* ── Swipeable mode ── */\n    /* Disable native pointer capture so the cursor can move freely between sliders */\n    :host([swipeable]) input {\n      pointer-events: none;\n    }\n\n    /* In swipeable mode, disable pointer events on wrap so host receives hover */\n    :host([swipeable]) .wrap {\n      pointer-events: none;\n    }\n\n    /* In swipeable mode, use host hover to trigger track/thumb hover styles */\n    :host([swipeable]):hover input[type=range]::-webkit-slider-runnable-track {\n      background: var(--_bg-track-value-hover);\n    }\n\n    :host([swipeable]):hover input[type=range]::-webkit-slider-thumb {\n      background: var(--_thumb-color-active);\n    }\n\n    :host([swipeable][orientation=\"vertical\"]):hover input[type=range]::-webkit-slider-runnable-track {\n      background: var(--background-track-value-hover-vertical, var(--_bg-track-value-hover));\n    }\n\n    :host([swipeable]):hover input[type=range]::-moz-range-track {\n      background: var(--_bg-track-value-hover);\n    }\n\n    :host([swipeable]):hover input[type=range]::-moz-range-thumb {\n      background: var(--_thumb-color-active);\n    }\n\n    :host([swipeable][orientation=\"vertical\"]):hover input[type=range]::-moz-range-track {\n      background: var(--background-track-value-hover-vertical, var(--_bg-track-value-hover));\n    }\n\n    :host([swipeable]):hover .range-bg {\n      background: var(--_bg-track-hover);\n    }\n\n    :host([swipeable][orientation=\"vertical\"]):hover .range-bg {\n      background: var(--background-track-hover-vertical, var(--_bg-track-hover));\n    }\n  `];\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ixfx-range-input': RangeInput;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"range-input.js","names":["customElement"],"sources":["../src/range-input/range-input.ts"],"sourcesContent":["/**\n * <ixfx-range-input> — styled range input with no label.\n *\n * A thin wrapper around <input type=\"range\"> that adds the same\n * fancy track/thumb/fill styling as the linear-value components,\n * without the label display.\n *\n * Supports horizontal (default) and vertical orientation in a single element.\n * Set orientation=\"vertical\" attribute to switch.\n *\n * CSS Variables:\n *   --track-thickness            Track cross-axis size (default 1.5em)\n *   --thumb-color                Thumb fill (default var(--surface-2-text))\n *   --thumb-color-active         Thumb fill on hover/active (default var(--accent))\n *   --thumb-size                 Thumb cross-axis size (default var(--track-thickness))\n *   --thumb-thickness            Thumb inline size (default 2em)\n *   --thumb-radius               Thumb border-radius (default 0)\n *   --thumb-border               Thumb border (default none)\n *   --thumb-shadow               Thumb box-shadow (default none)\n *   --background-track           Unfilled track background (default var(--surface-4))\n *   --background-track-hover     Unfilled track on hover (default --background-track)\n *   --background-track-value     Filled track color (default var(--surface-6))\n *   --background-track-value-hover   Filled track on hover (default var(--accent))\n *   --background-track-value-active  Filled track on active (default var(--accent))\n *\n * Optional vertical-specific overrides (fall back to horizontal vars when unset):\n *   --background-track-vertical\n *   --background-track-value-vertical\n *   --background-track-value-hover-vertical\n *   --background-track-value-active-vertical\n *\n * Tooltip:\n *   tooltip               Boolean attribute — enables value tooltip on hover/focus\n *   tooltip-orientation   'top' (default) | 'right'\n *   labelFormatter        Function property (not attribute): (rawValue: number, scaledValue: number) => string\n *                         rawValue  = native input value within min..max\n *                         scaledValue = normalised 0..1 position\n *\n * Swipeable mode:\n *   swipeable   Boolean attribute — enables swipe-to-draw gesture.\n *               When active, pressing down on the slider or entering it while the\n *               pointer is pressed sets the value from the cursor coordinate.\n *               Pointer capture is NOT held, so the cursor can move to adjacent\n *               swipeable sliders and update them too (step-sequencer style).\n *               Kill-axis exit (above/below for horizontal, left/right for vertical)\n *               freezes the value; re-entering re-engages.\n *\n * Wheel:\n *   lighttouch  Boolean attribute — wheel adjusts the value on hover instead\n *               of requiring focus. The native `<input type=\"range\">` inside\n *               already responds to wheel when focused; the host listener\n *               fires under `lighttouch` (or when focus is on the host) and\n *               synthesises a value change via `input`/`change` events.\n *               See `docs/infra-mousewheel.md`.\n *\n * Events:\n *   input  — CustomEvent<{ value: number }>\n *   change — CustomEvent<{ value: number }>\n *             In swipeable mode fires on pointerleave (or pointerup if released\n *             while still inside). In normal mode delegates to native change.\n */\nimport type { CSSResultGroup } from 'lit';\nimport type { WheelDirection } from '../mixins/wheel-nudge.js';\nimport type { TooltipElement, TooltipOrientations } from '../util/tooltip.js';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { WheelNudgeMixin } from '../mixins/wheel-nudge.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { tooltipValueStyles } from '../styles/tooltip.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\n\nfunction normalize(value: number, min: number, max: number): number {\n  return max === min ? 0 : (value - min) / (max - min);\n}\n\n@customElement(`ixfx-range-input`)\nexport class RangeInput extends WheelNudgeMixin(LitElement) {\n  @property({ type: Number }) min = 0;\n  @property({ type: Number }) max = 1;\n  @property({ type: Number }) value = 0;\n  @property({ type: Number }) step = 0.01;\n  @property({ type: String, reflect: true }) orientation: `horizontal` | `vertical` = `horizontal`;\n  @property({ type: Boolean, reflect: true }) swipeable = false;\n  @property({ type: Boolean }) tooltip = false;\n  @property({ type: String, attribute: `tooltip-orientation` }) tooltipOrientation: TooltipOrientations = `top`;\n  @property({ attribute: false }) labelFormatter?: (rawValue: number, scaledValue: number) => string;\n\n  @query(`input`)\n  _inputEl!: HTMLInputElement;\n\n  @query(`ixfx-tooltip`)\n  _tooltipEl?: TooltipElement | null;\n\n  /** True if this slider changed its value during the current pointer visit. */\n  private _swipeModified = false;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.addEventListener(`pointerdown`, this._onPointerDown);\n    this.addEventListener(`pointermove`, this._onPointerMove);\n    this.addEventListener(`pointerenter`, this._onPointerEnter);\n    this.addEventListener(`pointerleave`, this._onPointerLeave);\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener(`pointerdown`, this._onPointerDown);\n    this.removeEventListener(`pointermove`, this._onPointerMove);\n    this.removeEventListener(`pointerenter`, this._onPointerEnter);\n    this.removeEventListener(`pointerleave`, this._onPointerLeave);\n    window.removeEventListener(`pointerup`, this._onWindowPointerUp);\n  }\n\n  private _valueFromPointer(e: PointerEvent): number {\n    const rect = this.getBoundingClientRect();\n    // vertical: top = max, bottom = min (writing-mode: vertical-rl; direction: rtl)\n    const normalized = this.orientation === `vertical`\n      ? Math.max(0, Math.min(1, 1 - (e.clientY - rect.top) / rect.height))\n      : Math.max(0, Math.min(1, (e.clientX - rect.left) / rect.width));\n    const raw = this.min + normalized * (this.max - this.min);\n    const snapped = Math.round((raw - this.min) / this.step) * this.step + this.min;\n    return Math.max(this.min, Math.min(this.max, snapped));\n  }\n\n  private _applySwipeValue(value: number): void {\n    this.value = value;\n    if (this._inputEl)\n      this._inputEl.value = String(value);\n    this.style.setProperty(`--value`, String(normalize(value, this.min, this.max)));\n    this.dispatchEvent(new CustomEvent(`input`, { detail: { value }, bubbles: true, composed: true }));\n    this._swipeModified = true;\n  }\n\n  private _onPointerDown = (e: PointerEvent): void => {\n    if (!this.swipeable)\n      return;\n    e.preventDefault();\n    this._swipeModified = false;\n    this._applySwipeValue(this._valueFromPointer(e));\n    window.addEventListener(`pointerup`, this._onWindowPointerUp, { once: true });\n  };\n\n  private _onPointerMove = (e: PointerEvent): void => {\n    if (!this.swipeable || e.buttons === 0)\n      return;\n    this._applySwipeValue(this._valueFromPointer(e));\n  };\n\n  private _onPointerEnter = (e: PointerEvent): void => {\n    if (!this.swipeable || e.buttons === 0)\n      return;\n    this._swipeModified = false;\n    this._applySwipeValue(this._valueFromPointer(e));\n    window.addEventListener(`pointerup`, this._onWindowPointerUp, { once: true });\n  };\n\n  private _onPointerLeave = (_e: PointerEvent): void => {\n    if (!this.swipeable || !this._swipeModified)\n      return;\n    this._swipeModified = false;\n    this.dispatchEvent(new CustomEvent(`change`, { detail: { value: this.value }, bubbles: true, composed: true }));\n  };\n\n  private _onWindowPointerUp = (): void => {\n    if (!this._swipeModified)\n      return;\n    this._swipeModified = false;\n    this.dispatchEvent(new CustomEvent(`change`, { detail: { value: this.value }, bubbles: true, composed: true }));\n  };\n\n  override updated(changedProperties: Map<string, unknown>): void {\n    super.updated(changedProperties);\n    if (changedProperties.has(`value`) || changedProperties.has(`min`) || changedProperties.has(`max`)) {\n      this.style.setProperty(`--value`, String(normalize(this.value, this.min, this.max)));\n    }\n    if (this._tooltipEl) {\n      this._tooltipEl.valueFormatTooltip = (v: unknown) => {\n        const num = typeof v === `number` ? v : Number(v);\n        if (this.labelFormatter)\n          return this.labelFormatter(num, normalize(num, this.min, this.max));\n        const decimals = this.step >= 1 ? 0 : this.step >= 0.1 ? 1 : 2;\n        return num.toFixed(decimals);\n      };\n    }\n  }\n\n  _handleInput = (e: Event): void => {\n    e.preventDefault();\n    e.stopImmediatePropagation();\n    const target = e.target as HTMLInputElement;\n    const value = Number.parseFloat(target.value);\n    this.value = value;\n    this.style.setProperty(`--value`, String(normalize(value, this.min, this.max)));\n    this.dispatchEvent(new CustomEvent(`input`, { detail: { value }, bubbles: true, composed: true }));\n  };\n\n  _formatTooltipLabel(): string {\n    const normalized = normalize(this.value, this.min, this.max);\n    if (this.labelFormatter)\n      return this.labelFormatter(this.value, normalized);\n    const decimals = this.step >= 1 ? 0 : this.step >= 0.1 ? 1 : 2;\n    return this.value.toFixed(decimals);\n  }\n\n  _handleChange = (): void => {\n    const value = Number.parseFloat(this._inputEl.value);\n    this.dispatchEvent(new CustomEvent(`change`, { detail: { value }, bubbles: true, composed: true }));\n  };\n\n  /**\n   * Wheel handler — installed by WheelNudgeMixin on the host. Synthesises a\n   * value change by writing to the inner `<input type=\"range\">` and dispatching\n   * `input` + `change`, so the existing `_handleInput` and `_handleChange`\n   * handlers run unchanged and re-bubble the events to listeners.\n   *\n   * Native wheel handling is left intact for the focused-inner-input case;\n   * the host listener fires under `lighttouch` or when focus is on the host.\n   */\n  override _applyWheelDelta(direction: WheelDirection, _event: WheelEvent): void {\n    const input = this._inputEl;\n    if (!input)\n      return;\n    const step = this.step > 0 ? this.step : Math.max((this.max - this.min) / 100, 0.01);\n    const candidate = this.value + direction * step;\n    const clamped = Math.min(this.max, Math.max(this.min, candidate));\n    if (clamped === this.value)\n      return;\n\n    input.value = String(clamped);\n    input.dispatchEvent(new CustomEvent(`input`, { detail: { value: clamped }, bubbles: true }));\n    input.dispatchEvent(new CustomEvent(`change`, { detail: { value: clamped }, bubbles: true }));\n  }\n\n  override render() {\n    const tooltipEl = this.tooltip\n      ? html`\n      <ixfx-tooltip\n        style=\"--tooltip-background: var(--surface-5); --tooltip-color: var(--surface-5-text)\"\n        .orientation=${this.tooltipOrientation}\n        anchor=\"--ixfx-ri-thumb\"\n        .value=${this.value}\n      ></ixfx-tooltip>\n    `\n      : nothing;\n\n    return html`\n      <div class=\"wrap\">\n        <div class=\"range-bg\"></div>\n        <input\n          type=\"range\"\n          .min=${String(this.min)}\n          .max=${String(this.max)}\n          .step=${String(this.step)}\n          .value=${String(this.value)}\n          @input=${this._handleInput}\n          @change=${this._handleChange}\n        >${tooltipEl}\n      </div>\n    `;\n  }\n\n  static styles: CSSResultGroup = [themeFallbacks, tooltipValueStyles, css`\n    :host {\n      display: block;\n      container-type: size;\n      user-select: none;\n      touch-action: none;\n      -webkit-touch-action: none;\n      width: var(--width, 200px);\n      height: var(--height, 2em);\n\n      /*\n       * Internal resolved vars — read public vars and apply defaults here.\n       * Public vars are NOT defined in :host {}, only read via fallback.\n       * This lets inherited values from ancestor elements flow through.\n       */\n      --_track-thickness: var(--track-thickness, 100%);\n      --_thumb-thickness: var(--thumb-thickness, 2em);\n      --_thumb-color: var(--thumb-color, var(--surface-2-text));\n      --_thumb-color-active: var(--thumb-color-active, var(--surface-2-text));\n      --_thumb-opacity: var(--thumb-opacity, 0.7);\n      --_thumb-opacity-hover: var(--thumb-opacity-hover, 0.8);\n      --_thumb-opacity-active: var(--thumb-opacity-active, 1); \n      --_thumb-size: var(--thumb-size, var(--_track-thickness));\n      --_thumb-radius: var(--thumb-radius, 0);\n      --_thumb-border: var(--thumb-border, none);\n      --_thumb-shadow: var(--thumb-shadow, none);\n      --_track-radius: var(--track-radius, none);\n      --_track-corner-shape: var(--track-corner-shape, none);\n      --_bg-track: var(--background-track, var(--surface-4));\n      --_bg-track-hover: var(--background-track-hover, var(--_bg-track));\n      --_bg-track-value: var(--background-track-value, var(--surface-6));\n      --_bg-track-value-hover: var(--background-track-value-hover, var(--accent));\n      --_bg-track-value-active: var(--background-track-value-active, var(--accent));\n\n      --value: 0;\n      --sx1: calc(var(--_thumb-thickness) + var(--value) * (100% - var(--_thumb-thickness)));\n      --track-avail: calc(100% - var(--_thumb-thickness));\n      --sx: calc(var(--_thumb-thickness) + (var(--value) * var(--track-avail)));\n      --track-mask: linear-gradient(to right, rgba(0,0,0,1) var(--sx), rgba(0,0,0,0) var(--sx) 100%);\n      --track-mask-vertical: linear-gradient(to top, rgba(0,0,0,1) var(--sx), rgba(0,0,0,0) var(--sx) 100%);\n    }\n\n    :host([orientation=\"vertical\"]) {\n      width: var(--width, 2em);\n      height: var(--height, 200px);\n    }\n\n    .wrap {\n      display: grid;\n      width: 100%;\n      height: 100%;\n    }\n\n    .wrap > * {\n      grid-area: 1 / 1;\n    }\n\n    .range-bg {\n      background: var(--_bg-track);\n      width: 100%;\n      height: 100%;\n      margin: 0;\n      padding: 0;\n      border-radius: var(--_track-radius);\n      corner-shape: var(--_track-corner-shape);\n    }\n\n    .wrap:hover .range-bg {\n      background: var(--_bg-track-hover);\n    }\n\n    input[type=range] {\n      margin: 0;\n      padding: 0;\n      -webkit-appearance: none;\n      background: unset;\n      box-shadow: none;\n      width: 100%;\n      height: var(--_track-thickness);\n      align-self: center;\n    }\n\n    input[type=range]:focus {\n      outline: none;\n    }\n\n    /* Vertical layout */\n    :host([orientation=\"vertical\"]) .range-bg {\n      background: var(--background-track-vertical, var(--_bg-track));\n      width: var(--_track-thickness);\n      height: 100%;\n      justify-self: center;\n    }\n\n    :host([orientation=\"vertical\"]) .wrap:hover .range-bg {\n      background: var(--background-track-hover-vertical, var(--_bg-track-hover));\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range] {\n      writing-mode: vertical-rl;\n      direction: rtl;\n      width: var(--_track-thickness);\n      height: 100%;\n      justify-self: center;\n    }\n\n    /* ── Webkit thumb ── */\n    input[type=range]::-webkit-slider-thumb {\n      -webkit-appearance: none;\n      opacity: var(--_thumb-opacity);\n      box-sizing: border-box;\n      anchor-name: --ixfx-ri-thumb;\n      width: var(--_thumb-thickness);\n      height: var(--_thumb-size);\n      border-radius: var(--_thumb-radius);\n      background: var(--_thumb-color);\n      border: var(--_thumb-border);\n      box-shadow: var(--_thumb-shadow);\n      margin-top: calc(max((var(--_thumb-thickness) - 1px - 1px) * 0.5, 0px) - var(--_thumb-thickness) * 0.5);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]::-webkit-slider-thumb {\n      width: var(--_thumb-size);\n      height: var(--_thumb-thickness);\n      margin-top: 0;\n      margin-left: calc(max((1em - 1px - 1px) * 0.5, 0px) - 1.2em * 0.5);\n    }\n\n    input[type=range]::-webkit-slider-thumb:hover {\n      opacity: var(--_thumb-opacity-hover);\n    }\n\n    input[type=range]::-webkit-slider-thumb:active {\n      opacity: var(--_thumb-opacity-active);\n    }\n    input[type=range]::-webkit-slider-thumb:hover,\n    input[type=range]::-webkit-slider-thumb:active {\n      background: var(--_thumb-color-active);\n    }\n\n    /* ── Webkit track ── */\n    input[type=range]::-webkit-slider-runnable-track {\n      height: var(--_track-thickness);\n      background: var(--_bg-track-value);\n      mask-image: var(--track-mask);\n      box-shadow: none;\n      margin: 0;\n      padding: 0;\n      border-radius: var(--_track-radius);\n      corner-shape: var(--_track-corner-shape);\n    }\n\n    input[type=range]:hover::-webkit-slider-runnable-track {\n      background: var(--_bg-track-value-hover);\n      mask-image: var(--track-mask);\n    }\n\n    input[type=range]:active::-webkit-slider-runnable-track {\n      background: var(--_bg-track-value-active);\n      mask-image: var(--track-mask);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]::-webkit-slider-runnable-track {\n      background: var(--background-track-value-vertical, var(--_bg-track-value));\n      mask-image: var(--track-mask-vertical);\n      width: var(--_track-thickness);\n      height: unset;\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]:hover::-webkit-slider-runnable-track {\n      background: var(--background-track-value-hover-vertical, var(--_bg-track-value-hover));\n      mask-image: var(--track-mask-vertical);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]:active::-webkit-slider-runnable-track {\n      background: var(--background-track-value-active-vertical, var(--_bg-track-value-active));\n      mask-image: var(--track-mask-vertical);\n    }\n\n    /* ── Mozilla thumb ── */\n    input[type=range]::-moz-range-thumb {\n      box-sizing: border-box;\n      width: var(--_thumb-thickness);\n      height: var(--_thumb-size);\n      border-radius: var(--_thumb-radius);\n      background: var(--_thumb-color);\n      border: var(--_thumb-border);\n      box-shadow: var(--_thumb-shadow);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]::-moz-range-thumb {\n      width: var(--_thumb-size);\n      height: var(--_thumb-thickness);\n    }\n\n    input[type=range]::-moz-range-thumb:hover,\n    input[type=range]::-moz-range-thumb:active {\n      background: var(--_thumb-color-active);\n    }\n\n    /* ── Mozilla track ── */\n    input[type=range]::-moz-range-track {\n      height: var(--_track-thickness);\n      background: var(--_bg-track-value);\n      mask-image: var(--track-mask);\n      box-shadow: none;\n      margin: 0;\n      padding: 0;\n    }\n\n    input[type=range]:hover::-moz-range-track {\n      background: var(--_bg-track-value-hover);\n      mask-image: var(--track-mask);\n    }\n\n    input[type=range]:active::-moz-range-track {\n      background: var(--_bg-track-value-active);\n      mask-image: var(--track-mask);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]::-moz-range-track {\n      background: var(--background-track-value-vertical, var(--_bg-track-value));\n      mask-image: var(--track-mask-vertical);\n      height: unset;\n      width: var(--_track-thickness);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]:hover::-moz-range-track {\n      background: var(--background-track-value-hover-vertical, var(--_bg-track-value-hover));\n      mask-image: var(--track-mask-vertical);\n    }\n\n    :host([orientation=\"vertical\"]) input[type=range]:active::-moz-range-track {\n      background: var(--background-track-value-active-vertical, var(--_bg-track-value-active));\n      mask-image: var(--track-mask-vertical);\n    }\n\n    /* ── Swipeable mode ── */\n    /* Disable native pointer capture so the cursor can move freely between sliders */\n    :host([swipeable]) input {\n      pointer-events: none;\n    }\n\n    /* In swipeable mode, disable pointer events on wrap so host receives hover */\n    :host([swipeable]) .wrap {\n      pointer-events: none;\n    }\n\n    /* In swipeable mode, use host hover to trigger track/thumb hover styles */\n    :host([swipeable]):hover input[type=range]::-webkit-slider-runnable-track {\n      background: var(--_bg-track-value-hover);\n    }\n\n    :host([swipeable]):hover input[type=range]::-webkit-slider-thumb {\n      background: var(--_thumb-color-active);\n    }\n\n    :host([swipeable][orientation=\"vertical\"]):hover input[type=range]::-webkit-slider-runnable-track {\n      background: var(--background-track-value-hover-vertical, var(--_bg-track-value-hover));\n    }\n\n    :host([swipeable]):hover input[type=range]::-moz-range-track {\n      background: var(--_bg-track-value-hover);\n    }\n\n    :host([swipeable]):hover input[type=range]::-moz-range-thumb {\n      background: var(--_thumb-color-active);\n    }\n\n    :host([swipeable][orientation=\"vertical\"]):hover input[type=range]::-moz-range-track {\n      background: var(--background-track-value-hover-vertical, var(--_bg-track-value-hover));\n    }\n\n    :host([swipeable]):hover .range-bg {\n      background: var(--_bg-track-hover);\n    }\n\n    :host([swipeable][orientation=\"vertical\"]):hover .range-bg {\n      background: var(--background-track-hover-vertical, var(--_bg-track-hover));\n    }\n  `];\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ixfx-range-input': RangeInput;\n  }\n}\n"],"mappings":"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"}

package/dist/{split-layout-C5SYbDrq.d.ts → split-layout-JK3xWVX2.d.ts}

@@ -156,7 +156,7 @@ declare class SplitLayoutElement extends LitElement {
   private _onPointerUp;
   private _emitResize;
   private _emitChange;
-  protected render(): import("lit").TemplateResult<1> | typeof nothing;
+  protected render(): typeof nothing | import("lit").TemplateResult<1>;
   private _getTrackSizes;
   private _resolveTracks;
   private _renderGutter;
@@ -176,4 +176,4 @@ declare global {
 }
 //#endregion
 export { SplitExpandEvent as _, LayoutNode as a, SplitResizeEvent as b, PanelNode as c, SplitChangeEvent as d, SplitCloseDetail as f, SplitExpandDetail as g, SplitCollapseEvent as h, GroupNode as i, SnapshotNode as l, SplitCollapseDetail as m, SplitPanelElement as n, LayoutSnapshot as o, SplitCloseEvent as p, Axis as r, PanelInfo as s, SplitLayoutElement as t, SplitChangeDetail as u, SplitLayoutElementEventMap as v, WhenSmall as x, SplitResizeDetail as y };
-//# sourceMappingURL=split-layout-C5SYbDrq.d.ts.map
+//# sourceMappingURL=split-layout-JK3xWVX2.d.ts.map

package/dist/{split-layout-C5SYbDrq.d.ts.map → split-layout-JK3xWVX2.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"split-layout-C5SYbDrq.d.ts","names":[],"sources":["../src/split-layout/types.ts","../src/split-layout/split-panel.ts","../src/split-layout/split-layout.ts"],"mappings":";;KAAY;KAEA;UAEK;EACf;EACA;EACA,IAAI;EACJ;EACA;EACA;EACA;EACA,WAAW;EACX;EACA;;UAGe;EACf;EACA;EACA,IAAI;EACJ,MAAM;EACN,UAAU;EACV;EACA;;KAGU,aAAa,YAAY;UAEpB;EACf;EACA;EACA;EACA;EACA,WAAW;;UAGI;EACf;EACA,MAAM;;UAGS;EACf;EACA,IAAI;EACJ;EACA;EACA;EACA;EACA;EACA;EACA,WAAW;;UAGI;EACf,OAAO;EACP;;KAGU,mBAAmB,YAAY;UAE1B;EACf;EACA;;KAGU,qBAAqB,YAAY;UAE5B;EACf;EACA;;KAGU,mBAAmB,YAAY;UAE1B;EACf;EACA;;KAGU,kBAAkB,YAAY;UAEzB;EACf,QAAQ;;KAGE,mBAAmB,YAAY;UAE1B;EACf,qBAAqB;EACrB,uBAAuB;EACvB,qBAAqB;EACrB,oBAAoB;EACpB,qBAAqB;;;;cCvFV,0BAA0B;EAErC;EAGA;EAGA;EAGA;EAGA;EAGA;EAGA;EAGA;EAGA;EAES,wBAAM;SAIC,sBAAM;;QAiBhB;YACI;IACR,oBAAoB;;;;;cC7CX,2BAA2B;EAEtC,WAAW;EAGX;EAGA;EAGA;UAGQ;UAGA;UAGA;UAEA;UACA;UACA;UACA;EASC;EAKA;EAKA;UAID;UAcA;MAaJ,UAAU;EAuBd,aAAa;EAMb,UAAU,GAAG;EAUb,SAAS,oBAAoB;EAY7B,SAAS,oBAAoB,wBAAwB;EA4BrD,SAAS,iBAAiB;EAI1B,OAAO,iBAAiB;EAIxB,OAAO,iBAAiB;EAOxB,WAAW,iBAAiB;;;;;;EAmC5B,kBAAkB;;;;;;;;;EAelB,gBAAgB,qBAAqB,mBAAmB,iBAAiB;UAwBjE;UA2DA;UAQA;UAOA;UAwBA;UAQA;UAKA;UAMA;UAiFA;UAWA;UAuBA;UAeA;UAsBA;UAIA;UAMA;UAcA;YAYW,wBAAM,2BAAA;UA2BjB;UAQA;UAgCA;SAuBQ,sBAAM;;QAiHhB;YACI;IACR,qBAAqB;;YAGb;IACR,qBAAqB,YAAY;IACjC,uBAAuB,YAAY;IACnC,qBAAqB,YAAY;IACjC,oBAAoB,YAAY;IAChC,qBAAqB,YAAY"}
+{"version":3,"file":"split-layout-JK3xWVX2.d.ts","names":[],"sources":["../src/split-layout/types.ts","../src/split-layout/split-panel.ts","../src/split-layout/split-layout.ts"],"mappings":";;KAAY;KAEA;UAEK;EACf;EACA;EACA,IAAI;EACJ;EACA;EACA;EACA;EACA,WAAW;EACX;EACA;;UAGe;EACf;EACA;EACA,IAAI;EACJ,MAAM;EACN,UAAU;EACV;EACA;;KAGU,aAAa,YAAY;UAEpB;EACf;EACA;EACA;EACA;EACA,WAAW;;UAGI;EACf;EACA,MAAM;;UAGS;EACf;EACA,IAAI;EACJ;EACA;EACA;EACA;EACA;EACA;EACA,WAAW;;UAGI;EACf,OAAO;EACP;;KAGU,mBAAmB,YAAY;UAE1B;EACf;EACA;;KAGU,qBAAqB,YAAY;UAE5B;EACf;EACA;;KAGU,mBAAmB,YAAY;UAE1B;EACf;EACA;;KAGU,kBAAkB,YAAY;UAEzB;EACf,QAAQ;;KAGE,mBAAmB,YAAY;UAE1B;EACf,qBAAqB;EACrB,uBAAuB;EACvB,qBAAqB;EACrB,oBAAoB;EACpB,qBAAqB;;;;cCvFV,0BAA0B;EAErC;EAGA;EAGA;EAGA;EAGA;EAGA;EAGA;EAGA;EAGA;EAES,wBAAM;SAIC,sBAAM;;QAiBhB;YACI;IACR,oBAAoB;;;;;cC7CX,2BAA2B;EAEtC,WAAW;EAGX;EAGA;EAGA;UAGQ;UAGA;UAGA;UAEA;UACA;UACA;UACA;EASC;EAKA;EAKA;UAID;UAcA;MAaJ,UAAU;EAuBd,aAAa;EAMb,UAAU,GAAG;EAUb,SAAS,oBAAoB;EAY7B,SAAS,oBAAoB,wBAAwB;EA4BrD,SAAS,iBAAiB;EAI1B,OAAO,iBAAiB;EAIxB,OAAO,iBAAiB;EAOxB,WAAW,iBAAiB;;;;;;EAmC5B,kBAAkB;;;;;;;;;EAelB,gBAAgB,qBAAqB,mBAAmB,iBAAiB;UAwBjE;UA2DA;UAQA;UAOA;UAwBA;UAQA;UAKA;UAMA;UAiFA;UAWA;UAuBA;UAeA;UAsBA;UAIA;UAMA;UAcA;YAYW,iBAAM,wBAAA;UA2BjB;UAQA;UAgCA;SAuBQ,sBAAM;;QAiHhB;YACI;IACR,qBAAqB;;YAGb;IACR,qBAAqB,YAAY;IACjC,uBAAuB,YAAY;IACnC,qBAAqB,YAAY;IACjC,oBAAoB,YAAY;IAChC,qBAAqB,YAAY"}

package/dist/split-layout.d.ts

@@ -1,2 +1,2 @@
-import { t as SplitLayoutElement } from "./split-layout-C5SYbDrq.js";
+import { t as SplitLayoutElement } from "./split-layout-JK3xWVX2.js";
 export { SplitLayoutElement };

package/dist/{tab-list-v8mKX7Fu.d.ts → tab-list-pqfKaVAE.d.ts}

@@ -1,4 +1,4 @@
-import "./icon-DR_3rSyZ.js";
+import "./icon-CDGprSdE.js";
 import { LitElement, PropertyValues } from "lit";
 import { CommandRegistry } from "@clinth/ui-commands";
 //#region src/tabs/tab-list-item.d.ts
@@ -115,4 +115,4 @@ declare global {
 }
 //#endregion
 export { TabListReorderDetail as a, TabListElement as i, TabListChangeEvent as n, TabListReorderEvent as o, TabListDragMode as r, TabListItemElement as s, TabListChangeDetail as t };
-//# sourceMappingURL=tab-list-v8mKX7Fu.d.ts.map
+//# sourceMappingURL=tab-list-pqfKaVAE.d.ts.map

package/dist/{tab-list-v8mKX7Fu.d.ts.map → tab-list-pqfKaVAE.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"tab-list-v8mKX7Fu.d.ts","names":[],"sources":["../src/tabs/tab-list-item.ts","../src/tabs/tab-list.ts"],"mappings":";;;;;;;;;;;cAiBa,2BAA2B;EAEtC;EAGA;;;;;;;EASA;EAGA;EAGA;EAGA;EAGA,UAAU;UAEO;UACA;UACA;UACT;UACA;UACA;EAEC;EAwBA;EAWA,QAAQ,SAAS;UAQlB;UAUA;UAWA;UAIA;UAIA;;;;;;;UAUA;UASA;;;;;UAaA;UAiBA;;;;;;UASA;EAIC;EAOA,wBAAM;UA+BP;SAWQ,sBAAM;;QAyLhB;YACI;IACR,sBAAsB;;;;;;;;;;KCvZd;WACD;WACA;WACA;;KAGC,qBAAqB,YAAY;KAEjC;WACD;WACA;WACA;;KAGC,sBAAsB,YAAY;KAElC;cAMC,uBAAuB;;EAElC;EAGA;EAGA;EAGA;;;;;;EAQA;EAGA;EAGA,UAAU;EA4BD,wBAAM;EAgEN;EAUA,QAAQ,mBAAmB;EAiHpC,sBAAkB;EAwBlB,cAAc,IAAI;SAwaX,sBAAM;;QAyKP;YACI;IACR,iBAAiB"}
+{"version":3,"file":"tab-list-pqfKaVAE.d.ts","names":[],"sources":["../src/tabs/tab-list-item.ts","../src/tabs/tab-list.ts"],"mappings":";;;;;;;;;;;cAiBa,2BAA2B;EAEtC;EAGA;;;;;;;EASA;EAGA;EAGA;EAGA;EAGA,UAAU;UAEO;UACA;UACA;UACT;UACA;UACA;EAEC;EAwBA;EAWA,QAAQ,SAAS;UAQlB;UAUA;UAWA;UAIA;UAIA;;;;;;;UAUA;UASA;;;;;UAaA;UAiBA;;;;;;UASA;EAIC;EAOA,wBAAM;UA+BP;SAWQ,sBAAM;;QAyLhB;YACI;IACR,sBAAsB;;;;;;;;;;KCvZd;WACD;WACA;WACA;;KAGC,qBAAqB,YAAY;KAEjC;WACD;WACA;WACA;;KAGC,sBAAsB,YAAY;KAElC;cAMC,uBAAuB;;EAElC;EAGA;EAGA;EAGA;;;;;;EAQA;EAGA;EAGA,UAAU;EA4BD,wBAAM;EAgEN;EAUA,QAAQ,mBAAmB;EAiHpC,sBAAkB;EAwBlB,cAAc,IAAI;SAwaX,sBAAM;;QAyKP;YACI;IACR,iBAAiB"}

package/dist/tabs.d.ts

@@ -1,2 +1,2 @@
-import { a as TabListReorderDetail, i as TabListElement, n as TabListChangeEvent, o as TabListReorderEvent, r as TabListDragMode, t as TabListChangeDetail } from "./tab-list-v8mKX7Fu.js";
+import { a as TabListReorderDetail, i as TabListElement, n as TabListChangeEvent, o as TabListReorderEvent, r as TabListDragMode, t as TabListChangeDetail } from "./tab-list-pqfKaVAE.js";
 export { TabListChangeDetail, TabListChangeEvent, TabListDragMode, TabListElement, TabListReorderDetail, TabListReorderEvent };

package/dist/{titlebar-B5zSTZnF.d.ts → titlebar-Tqu-VvMU.d.ts}

@@ -1,4 +1,4 @@
-import "./icon-DR_3rSyZ.js";
+import "./icon-CDGprSdE.js";
 import { LitElement } from "lit";
 //#region src/titlebar/titlebar.d.ts
 type TitlebarOrientation = `horizontal` | `vertical`;
@@ -51,4 +51,4 @@ interface TitlebarElement {
 }
 //#endregion
 export { TitlebarToggleDetail as a, TitlebarVariant as c, TitlebarOrientation as i, TitlebarElement as n, TitlebarToggleEvent as o, TitlebarElementEventMap as r, TitlebarToggleInteraction as s, TitlebarCloseEvent as t };
-//# sourceMappingURL=titlebar-B5zSTZnF.d.ts.map
+//# sourceMappingURL=titlebar-Tqu-VvMU.d.ts.map

package/dist/{titlebar-B5zSTZnF.d.ts.map → titlebar-Tqu-VvMU.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"titlebar-B5zSTZnF.d.ts","names":[],"sources":["../src/titlebar/titlebar.ts"],"mappings":";;;KAOY;KACA;KACA;UAEK;WACN;;KAGC,sBAAsB,YAAY;KAClC,qBAAqB;UAEhB;EACf,QAAQ;EACR,OAAO;;;;;;;;;;;;;;cAgBI,wBAAwB;EACP;EACwB;EACiB,aAAa;EACjB,SAAS;EAC7C;;EAEe;EACA;EACiB,mBAAmB;UAExE;UAaA;UASA;YAIW,wBAAM;SAkET,sBAAM;;QA4RhB;YACI;IACR,iBAAiB;;;UAIJ;EACf,oBAAoB,gBAAgB,yBAClC,MAAM,GACN,WAAW,MAAM,iBAAiB,OAAO,wBAAwB,aACjE,oBAAoB,sCAEpB,cACA,UAAU,oCACV,oBAAoB"}
+{"version":3,"file":"titlebar-Tqu-VvMU.d.ts","names":[],"sources":["../src/titlebar/titlebar.ts"],"mappings":";;;KAOY;KACA;KACA;UAEK;WACN;;KAGC,sBAAsB,YAAY;KAClC,qBAAqB;UAEhB;EACf,QAAQ;EACR,OAAO;;;;;;;;;;;;;;cAgBI,wBAAwB;EACP;EACwB;EACiB,aAAa;EACjB,SAAS;EAC7C;;EAEe;EACA;EACiB,mBAAmB;UAExE;UAaA;UASA;YAIW,wBAAM;SAkET,sBAAM;;QA4RhB;YACI;IACR,iBAAiB;;;UAIJ;EACf,oBAAoB,gBAAgB,yBAClC,MAAM,GACN,WAAW,MAAM,iBAAiB,OAAO,wBAAwB,aACjE,oBAAoB,sCAEpB,cACA,UAAU,oCACV,oBAAoB"}

package/dist/titlebar.d.ts

@@ -1,2 +1,2 @@
-import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, n as TitlebarElement, o as TitlebarToggleEvent, r as TitlebarElementEventMap, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-B5zSTZnF.js";
+import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, n as TitlebarElement, o as TitlebarToggleEvent, r as TitlebarElementEventMap, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-Tqu-VvMU.js";
 export { TitlebarCloseEvent, TitlebarElement, TitlebarElementEventMap, TitlebarOrientation, TitlebarToggleDetail, TitlebarToggleEvent, TitlebarToggleInteraction, TitlebarVariant };

package/dist/{tree-component-CMGeqyjZ.d.ts → tree-component-DukLqesg.d.ts}

@@ -1,4 +1,4 @@
-import { a as TreeItem, n as TreeExclusivity, o as TreeNode, r as TreeFilterPredicate, s as TreeSelectionFilter, t as LoadChildrenCallback } from "./types-3Jfcaxvo.js";
+import { a as TreeItem, n as TreeExclusivity, o as TreeNode, r as TreeFilterPredicate, s as TreeSelectionFilter, t as LoadChildrenCallback } from "./types-D-kYF16b.js";
 //#region src/interaction/list-drag-types.d.ts
 interface ListDragEntry<T> {
   readonly key: string;
@@ -409,4 +409,4 @@ interface TreeSearchHost extends TreeComponent {
 }
 //#endregion
 export { TreeDataModelOptions as A, TreeItemDblClickEvent as C, TreeTickleDetail as D, TreeSelectEvent as E, ListDragPreviewSourceResolver as F, ListDragSource as I, ListNativeDragStartDetail as L, ListDragPreview as M, ListDragPreviewContext as N, TreeTickleEvent as O, ListDragPreviewRenderer as P, ListNativeDragStartEvent as R, TreeItemDblClickDetail as S, TreeSelectDetail as T, TreeDropTarget as _, TreeComponent as a, TreeItemClickDetail as b, TreeDragContext as c, TreeDragStartEvent as d, TreeDropApplyContext as f, TreeDropPosition as g, TreeDropEvent as h, TreeCollapseEvent as i, ListDragEntry as j, TreeDataModel as k, TreeDragEndEvent as l, TreeDropDetail as m, TreeActivateEvent as n, TreeComponentEventMap as o, TreeDropContext as p, TreeCollapseDetail as r, TreeDndMode as s, TreeActivateDetail as t, TreeDragOverEvent as u, TreeExpandDetail as v, TreeSearchHost as w, TreeItemClickEvent as x, TreeExpandEvent as y };
-//# sourceMappingURL=tree-component-CMGeqyjZ.d.ts.map
+//# sourceMappingURL=tree-component-DukLqesg.d.ts.map

package/dist/{tree-component-CMGeqyjZ.d.ts.map → tree-component-DukLqesg.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"tree-component-CMGeqyjZ.d.ts","names":[],"sources":["../src/interaction/list-drag-types.ts","../src/common/tree-data-model.ts","../src/common/tree-component.ts"],"mappings":";;UAAiB,cAAc;WACpB;WACA;WACA,MAAM,IAAI;;;;;;;;;;;;;;WAcV,UAAU;;KAGT;UAEK,uBAAuB;WAC7B,QAAQ;WACR,QAAQ,cAAc;WACtB,UAAU,cAAc,cAAc;WACtC;aACE;aACA;aACA;aACA;;WAEF,WAAW;WACX,2BAA2B,8BAA8B;;UAGnD;WACN,SAAS;WACT,UAAU;IAAW;IAAW;;WAChC,SAAS;WACT;;KAGC,wBAAwB,MAAM,SAAS,uBAAuB,OAAO;KAErE,8BAA8B,MACxC,OAAO,cAAc,OAClB;UAEY,0BAA0B;WAChC;WACA;WACA,MAAM,IAAI;WACV;WACA,UAAU,cAAc,cAAc;WACtC,UAAU;;KAGT,yBAAyB,eAAe,YAAY,0BAA0B;;;KCjDrF;EAAoB;EAAoB;;KACxC;EAAc;EAAc,MAAM;;KAClC,aAAa,kBAAkB;KAE/B,mBAAmB,OAAO;KA6DnB;;EAEV,MAAM;;;;;EAKN,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;cAgCJ;;EAMC,YAAA,SAAS;;MAUjB,QAAQ;;;;;EAQZ,QAAQ,MAAM;;;;;;;;;EAkBR,YAAY,MAAM,UAAU,eAAe,QAAQ,cAAc,QAAQ;;;;;;EAyB/E,WAAW;;;;;EAaX,QAAQ,mBAAmB,MAAM,WAAW;;;;;EAU5C,WAAW,cAAc;;;;;EAWzB,WAAW,aAAa,OAAO,QAAQ,YAAY;;;;;;EAcnD,SAAS,aAAa,sBAAsB,iBAAiB;;;;;;;EAmB7D,iBAAiB,aAAa,sBAAsB,+BAA+B;;;;;;EAkBnF,UAAU,KAAK,uBAAuB;;;;;;EActC,WAAW,+BAA+B,MAAM,UAAU,iBAAiB;;;;;;;EA6B3E,WAAW,UAAU;;;;KC/RX;KAEA;UAEK;WACN;WACA;WACA;WACA,UAAU;WACV;;UAGM;WACN,gBAAgB;WAChB;;;;;;UAOM;WACN;;;;;WAKA,mBAAmB;WACnB;WACA,QAAQ;;UAGF,wBAAwB;WAC9B,cAAc;;UAGR,uBAAuB;WAC7B,oBAAoB;;KAGnB,qBAAqB,YAAY;KACjC,oBAAoB,YAAY;KAChC,gBAAgB,YAAY;KAC5B,mBAAmB;EAAc;;;;;;KAUjC;;WAED,UAAU,YAAY;;WAEtB,UAAU,YAAY;;;;;;;KAQrB;WACD,MAAM;WACN;;;;;;KAOC;WACD,MAAM;WACN;;;;;;KAOC;WACD,MAAM;WACN;;;;;;;KAQC;WACD,MAAM;WACN;;;;;;KAOC;WACD,MAAM;WACN;;;;;;KAOC;WACD,MAAM;WACN;;KAIC,kBAAkB,YAAY;KAC9B,kBAAkB,YAAY;KAC9B,oBAAoB,YAAY;KAChC,qBAAqB,YAAY;KACjC,wBAAwB,YAAY;KACpC,kBAAkB,YAAY;KAC9B,oBAAoB,YAAY;UAM3B;EACf,UAAU;EACV,UAAU;EACV,YAAY;EACZ,cAAc;EACd,UAAU;EACV,YAAY;EACZ,0BAA0B,YAAY,0BAA0B;EAChE,mBAAmB;EACnB,kBAAkB;EAClB,aAAa;EACb,iBAAiB;;;;;;;;;;;;;;;UAoBF,sBAAsB;;;;;;EAQrC,MAAM;;;;;;;EAQN,OAAO;;;;;;EAOP,cAAc;;;;;EAQd,cAAc;;;;;WAML,eAAe,YAAY;;;;;;EASpC,iBAAiB;;;;;;EASjB,iBAAiB;;;;;;EASjB,aAAa;;EAKb,SAAS,MAAM;;EAEf,WAAW,MAAM;;EAEjB;;;;;;EAMA;;EAEA;;;;;EAQA,aAAa;;;;;EAMb,iBAAiB,YAAY,MAAM;;;;;;EAOnC,YAAY;;EAGZ,aAAa,OAAO,SAAS;;;;;EAQ7B,gBAAgB;IAAgB,MAAM;IAAU;;;;;;;;;;;UAejC,uBAAuB;WAC7B,YAAY;WACZ,gBAAgB"}
+{"version":3,"file":"tree-component-DukLqesg.d.ts","names":[],"sources":["../src/interaction/list-drag-types.ts","../src/common/tree-data-model.ts","../src/common/tree-component.ts"],"mappings":";;UAAiB,cAAc;WACpB;WACA;WACA,MAAM,IAAI;;;;;;;;;;;;;;WAcV,UAAU;;KAGT;UAEK,uBAAuB;WAC7B,QAAQ;WACR,QAAQ,cAAc;WACtB,UAAU,cAAc,cAAc;WACtC;aACE;aACA;aACA;aACA;;WAEF,WAAW;WACX,2BAA2B,8BAA8B;;UAGnD;WACN,SAAS;WACT,UAAU;IAAW;IAAW;;WAChC,SAAS;WACT;;KAGC,wBAAwB,MAAM,SAAS,uBAAuB,OAAO;KAErE,8BAA8B,MACxC,OAAO,cAAc,OAClB;UAEY,0BAA0B;WAChC;WACA;WACA,MAAM,IAAI;WACV;WACA,UAAU,cAAc,cAAc;WACtC,UAAU;;KAGT,yBAAyB,eAAe,YAAY,0BAA0B;;;KCjDrF;EAAoB;EAAoB;;KACxC;EAAc;EAAc,MAAM;;KAClC,aAAa,kBAAkB;KAE/B,mBAAmB,OAAO;KA6DnB;;EAEV,MAAM;;;;;EAKN,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;cAgCJ;;EAMC,YAAA,SAAS;;MAUjB,QAAQ;;;;;EAQZ,QAAQ,MAAM;;;;;;;;;EAkBR,YAAY,MAAM,UAAU,eAAe,QAAQ,cAAc,QAAQ;;;;;;EAyB/E,WAAW;;;;;EAaX,QAAQ,mBAAmB,MAAM,WAAW;;;;;EAU5C,WAAW,cAAc;;;;;EAWzB,WAAW,aAAa,OAAO,QAAQ,YAAY;;;;;;EAcnD,SAAS,aAAa,sBAAsB,iBAAiB;;;;;;;EAmB7D,iBAAiB,aAAa,sBAAsB,+BAA+B;;;;;;EAkBnF,UAAU,KAAK,uBAAuB;;;;;;EActC,WAAW,+BAA+B,MAAM,UAAU,iBAAiB;;;;;;;EA6B3E,WAAW,UAAU;;;;KC/RX;KAEA;UAEK;WACN;WACA;WACA;WACA,UAAU;WACV;;UAGM;WACN,gBAAgB;WAChB;;;;;;UAOM;WACN;;;;;WAKA,mBAAmB;WACnB;WACA,QAAQ;;UAGF,wBAAwB;WAC9B,cAAc;;UAGR,uBAAuB;WAC7B,oBAAoB;;KAGnB,qBAAqB,YAAY;KACjC,oBAAoB,YAAY;KAChC,gBAAgB,YAAY;KAC5B,mBAAmB;EAAc;;;;;;KAUjC;;WAED,UAAU,YAAY;;WAEtB,UAAU,YAAY;;;;;;;KAQrB;WACD,MAAM;WACN;;;;;;KAOC;WACD,MAAM;WACN;;;;;;KAOC;WACD,MAAM;WACN;;;;;;;KAQC;WACD,MAAM;WACN;;;;;;KAOC;WACD,MAAM;WACN;;;;;;KAOC;WACD,MAAM;WACN;;KAIC,kBAAkB,YAAY;KAC9B,kBAAkB,YAAY;KAC9B,oBAAoB,YAAY;KAChC,qBAAqB,YAAY;KACjC,wBAAwB,YAAY;KACpC,kBAAkB,YAAY;KAC9B,oBAAoB,YAAY;UAM3B;EACf,UAAU;EACV,UAAU;EACV,YAAY;EACZ,cAAc;EACd,UAAU;EACV,YAAY;EACZ,0BAA0B,YAAY,0BAA0B;EAChE,mBAAmB;EACnB,kBAAkB;EAClB,aAAa;EACb,iBAAiB;;;;;;;;;;;;;;;UAoBF,sBAAsB;;;;;;EAQrC,MAAM;;;;;;;EAQN,OAAO;;;;;;EAOP,cAAc;;;;;EAQd,cAAc;;;;;WAML,eAAe,YAAY;;;;;;EASpC,iBAAiB;;;;;;EASjB,iBAAiB;;;;;;EASjB,aAAa;;EAKb,SAAS,MAAM;;EAEf,WAAW,MAAM;;EAEjB;;;;;;EAMA;;EAEA;;;;;EAQA,aAAa;;;;;EAMb,iBAAiB,YAAY,MAAM;;;;;;EAOnC,YAAY;;EAGZ,aAAa,OAAO,SAAS;;;;;EAQ7B,gBAAgB;IAAgB,MAAM;IAAU;;;;;;;;;;;UAejC,uBAAuB;WAC7B,YAAY;WACZ,gBAAgB"}

package/dist/tree.d.ts

@@ -1,7 +1,7 @@
-import { A as TreeDataModelOptions, C as TreeItemDblClickEvent, D as TreeTickleDetail, E as TreeSelectEvent, F as ListDragPreviewSourceResolver, L as ListNativeDragStartDetail, O as TreeTickleEvent, P as ListDragPreviewRenderer, T as TreeSelectDetail, _ as TreeDropTarget, a as TreeComponent, b as TreeItemClickDetail, c as TreeDragContext, d as TreeDragStartEvent, g as TreeDropPosition, h as TreeDropEvent, i as TreeCollapseEvent, k as TreeDataModel, l as TreeDragEndEvent, m as TreeDropDetail, n as TreeActivateEvent, o as TreeComponentEventMap, p as TreeDropContext, r as TreeCollapseDetail, s as TreeDndMode, t as TreeActivateDetail, u as TreeDragOverEvent, v as TreeExpandDetail, w as TreeSearchHost, x as TreeItemClickEvent, y as TreeExpandEvent } from "./tree-component-CMGeqyjZ.js";
-import { a as TreeItem, i as TreeInteractionMode, n as TreeExclusivity, o as TreeNode, r as TreeFilterPredicate, s as TreeSelectionFilter, t as LoadChildrenCallback } from "./types-3Jfcaxvo.js";
-import { S as ListSearchController } from "./index-CHbuPyLL.js";
-import { t as ListNativeDragController } from "./list-native-drag-controller-B9reY4uM.js";
+import { A as TreeDataModelOptions, C as TreeItemDblClickEvent, D as TreeTickleDetail, E as TreeSelectEvent, F as ListDragPreviewSourceResolver, L as ListNativeDragStartDetail, O as TreeTickleEvent, P as ListDragPreviewRenderer, T as TreeSelectDetail, _ as TreeDropTarget, a as TreeComponent, b as TreeItemClickDetail, c as TreeDragContext, d as TreeDragStartEvent, g as TreeDropPosition, h as TreeDropEvent, i as TreeCollapseEvent, k as TreeDataModel, l as TreeDragEndEvent, m as TreeDropDetail, n as TreeActivateEvent, o as TreeComponentEventMap, p as TreeDropContext, r as TreeCollapseDetail, s as TreeDndMode, t as TreeActivateDetail, u as TreeDragOverEvent, v as TreeExpandDetail, w as TreeSearchHost, x as TreeItemClickEvent, y as TreeExpandEvent } from "./tree-component-DukLqesg.js";
+import { a as TreeItem, i as TreeInteractionMode, n as TreeExclusivity, o as TreeNode, r as TreeFilterPredicate, s as TreeSelectionFilter, t as LoadChildrenCallback } from "./types-D-kYF16b.js";
+import { S as ListSearchController } from "./index-CMsmZ6Or.js";
+import { t as ListNativeDragController } from "./list-native-drag-controller-CllsHLxw.js";
 import { n as TickledController } from "./tickled-controller-C1ZsHpyg.js";
 import { LitElement, PropertyValues, ReactiveController, ReactiveControllerHost, TemplateResult, nothing } from "lit";
 import { CommandRegistry } from "@clinth/ui-commands";

package/dist/{types-3Jfcaxvo.d.ts → types-D-kYF16b.d.ts}

@@ -11,6 +11,26 @@ type TreeItem = {
   data?: unknown;
   /** Icon name passed to an icon component, if icons are enabled. */
   icon?: string;
+  /**
+   * CSS colour applied to the node's icon, overriding the inherited text
+   * colour. Only meaningful when `icon` is set. Components that render the
+   * icon from `icon` honour this; the rest ignore it.
+   */
+  iconColor?: string;
+  /**
+   * CSS colour applied to the node's label. Inline, so it wins over the
+   * selected/tickled text colours — keep it legible against both, or leave
+   * it unset and let the component's theming handle selection contrast.
+   */
+  textColor?: string;
+  /**
+   * Finder-style badge rendered alongside the label — e.g. a colour-tag chip
+   * or a stack of them. Anything Lit can render (usually a `TemplateResult`),
+   * or a DOM `Node` for the components that build their rows imperatively.
+   * Placement is per-component: thumbnails-style lists put it before the
+   * name, list-style views right-justify it on the same line.
+   */
+  badge?: unknown;
   /** Tooltip text shown on hover. */
   tooltip?: string;
   /** Optional string value, e.g. for use as a command/route. */
@@ -76,4 +96,4 @@ type TreeSelectionFilter = `none` | `leaf` | `branch` | `all`;
 type TreeInteractionMode = `implicit` | `standard` | `manual` | `checked` | `vscode`;
 //#endregion
 export { TreeItem as a, TreeInteractionMode as i, TreeExclusivity as n, TreeNode as o, TreeFilterPredicate as r, TreeSelectionFilter as s, LoadChildrenCallback as t };
-//# sourceMappingURL=types-3Jfcaxvo.d.ts.map
+//# sourceMappingURL=types-D-kYF16b.d.ts.map

package/dist/types-D-kYF16b.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types-D-kYF16b.d.ts","names":[],"sources":["../src/common/types.ts"],"mappings":";;KAQY;;EAEV;;EAEA;;EAEA;;EAEA;;EAEA;;;;;;EAMA;;;;;;EAMA;;;;;;;;EAQA;;EAEA;;EAEA;;;;;;;EAOA;;;KAIU;EACV,MAAM;;;;;;;EAON,WAAW;;;;;;;KAQD,uBAAuB;EAAgB,MAAM;EAAU;GAAiB;;;;;;KAOxE,uBAAuB,MAAM,UAAU;;;;;;;KAQvC;;;;;;;;;KAUA;;;;;;;;;KAUA"}

package/dist/{vertical-list-R25WqAVO.d.ts → vertical-list-DTp-UIUE.d.ts}

@@ -1,6 +1,6 @@
-import { F as ListDragPreviewSourceResolver, P as ListDragPreviewRenderer, R as ListNativeDragStartEvent } from "./tree-component-CMGeqyjZ.js";
+import { F as ListDragPreviewSourceResolver, P as ListDragPreviewRenderer, R as ListNativeDragStartEvent } from "./tree-component-DukLqesg.js";
 import { n as ListViewportChangeEvent } from "./list-viewport-types-BRZsLcvp.js";
-import { S as ListSearchController } from "./index-CHbuPyLL.js";
+import { S as ListSearchController } from "./index-CMsmZ6Or.js";
 import { i as ListInteractionMode, l as ListSelectionMode, r as ListElementEventMap } from "./list-selection-types-PjKdhF-a.js";
 import { LitElement, PropertyValues } from "lit";
 import { CommandId, CommandRegistry } from "@clinth/ui-commands";
@@ -91,6 +91,29 @@ declare class VerticalListElement extends LitElement {
    * appended.
    */
   formatter: ((item: unknown, index: number) => unknown) | undefined;
+  /**
+   * Per-item icon for adapter (`items`) mode, prepended to the row — a DOM
+   * `Node` or anything Lit can render (usually a `TemplateResult` wrapping an
+   * `<ixfx-icon>` or an inline SVG). Ignored when the `formatter` returns a
+   * full row element (the formatter then owns the whole row, icon included).
+   */
+  icon: ((item: unknown, index: number) => unknown) | undefined;
+  /**
+   * CSS colour tinting the per-item `icon`. Icons paint from `currentColor`,
+   * so this recolours them. Inline, so it wins over selection styling.
+   */
+  iconColor: ((item: unknown, index: number) => string | undefined) | undefined;
+  /**
+   * CSS colour for the row's text. Inline, so it wins over the selected /
+   * tickled text colours — keep it legible against both.
+   */
+  textColor: ((item: unknown, index: number) => string | undefined) | undefined;
+  /**
+   * Finder-style badge for the row, right-justified after the text — a
+   * `TemplateResult`, a DOM `Node`, or anything Lit can render. The row is
+   * flex, so the badge self-justifies to the trailing edge.
+   */
+  badge: ((item: unknown, index: number) => unknown) | undefined;
   /**
    * Virtualize the list: only the overscanned viewport window exists in the
    * DOM; offscreen rows are recycled through an off-DOM pool as the list
@@ -253,4 +276,4 @@ interface VerticalListElementEventMap extends ListElementEventMap {
 }
 //#endregion
 export { VerticalListElementEventMap as i, CustomCheckboxOptions as n, VerticalListElement as r, AddItemOptions as t };
-//# sourceMappingURL=vertical-list-R25WqAVO.d.ts.map
+//# sourceMappingURL=vertical-list-DTp-UIUE.d.ts.map

package/dist/vertical-list-DTp-UIUE.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vertical-list-DTp-UIUE.d.ts","names":[],"sources":["../src/vertical-list/vertical-list.ts"],"mappings":";;;;;;;UA4DiB;EACf,WAAW;EACX;EACA;;UAGe;;;;;;EAMf;;cAkCW,4BAA4B;;EAEvC,eAAe;EAGf,iBAAiB;EAGjB,mBAAmB,IAAI;;;;;;EAQvB;;;;;;;;;;;;;;;;;;;EAqBA,oBAAoB,gCAAgC;;;;;;EAQpD;;;;;;EAQA;;;;;EAOA,qBAAqB,wBAAwB;EAG7C,mBAAmB,8BAA8B;;;;;;;;;;;EAajD;;;;;EAOA;;;;;;;;;EAWA,aAAa,eAAe;;;;;;;EAS5B,QAAQ,eAAe;;;;;EAOvB,aAAa,eAAe;;;;;EAO5B,aAAa,eAAe;;;;;;EAQ5B,SAAS,eAAe;;;;;;;;;;;;;;;;;;EAoBxB;;;;;;EAQA;mBAyCiB;UAeT;UA6EA;;WA6EC,QAAM,qBAAA;;MAYX,YAAY;EA2BP;EAsBA;;;;;;YA4BU;EAwDV,QAAQ,SAAS;;MAgFtB,gBAAgB;;MAKhB,iBAAiB,YAAY;EAIjC,QAAQ,MAAM,kBAAkB,UAAU;;;;;;;EA4B1C,WAAW,MAAM,UAAU;;EA2B3B,YAAY,OAAO,SAAS,WAAW;EAIvC;;;;;;EAmBA,SAAS,gBAAgB;;;;;;EAwBzB,SAAS,WAAW,WAAW,OAAO;EAItC,OAAO,MAAM;EAIb,WAAW,OAAO,SAAS;EAI3B,SAAS,MAAM;EAIf;EAIA;;MAQI,gBAAgB;;MAKhB;;EAMJ,WAAW,MAAM;;EAKjB,gBAAgB,MAAM;;EAKtB,mBAAmB,MAAM;;;;;;EASzB,SAAS;;EAgCT,aAAa,cAAc;;;;;;;;EAW3B;;;;;;;EAuBA;EAsBE,eAAe,0CAA0C,UAAU;;;;;EA2CrE,YAAY,MAAM;;;;;;;;;;;EAclB,WAAW,aAAa;UAmiBhB;UAgBA;UAOA;UAiBA;;;;;;;UA4GA;;;;;UAuBA;UAcA;UAYA;UAQA;UAWA;UAMA;UAIA;UAwDA;UAUA;UAMA;SAUQ,sBAAM;EA2Kb,wBAAM;;QAeT;YACI;IACR,sBAAsB;;YAGd,4BAA4B;;UAGvB,oCAAoC;EACnD,iCAAiC;EACjC,0BAA0B,yBAAyB"}

package/dist/vertical-list.d.ts

@@ -1,5 +1,5 @@
-import { I as ListDragSource, L as ListNativeDragStartDetail, M as ListDragPreview, N as ListDragPreviewContext, P as ListDragPreviewRenderer, R as ListNativeDragStartEvent, j as ListDragEntry } from "./tree-component-CMGeqyjZ.js";
+import { I as ListDragSource, L as ListNativeDragStartDetail, M as ListDragPreview, N as ListDragPreviewContext, P as ListDragPreviewRenderer, R as ListNativeDragStartEvent, j as ListDragEntry } from "./tree-component-DukLqesg.js";
 import { n as ListViewportChangeEvent, t as ListViewportChangeDetail } from "./list-viewport-types-BRZsLcvp.js";
 import { a as ListItemClickDetail, c as ListSelectEvent, d as ListTickleEvent, i as ListInteractionMode, l as ListSelectionMode, n as ListActivateEvent, o as ListItemClickEvent, r as ListElementEventMap, s as ListSelectDetail, t as ListActivateDetail, u as ListTickleDetail } from "./list-selection-types-PjKdhF-a.js";
-import { i as VerticalListElementEventMap, n as CustomCheckboxOptions, r as VerticalListElement, t as AddItemOptions } from "./vertical-list-R25WqAVO.js";
+import { i as VerticalListElementEventMap, n as CustomCheckboxOptions, r as VerticalListElement, t as AddItemOptions } from "./vertical-list-DTp-UIUE.js";
 export { AddItemOptions, CustomCheckboxOptions, type ListActivateDetail, type ListActivateEvent, type ListDragEntry, type ListDragPreview, type ListDragPreviewContext, type ListDragPreviewRenderer, type ListDragSource, type ListElementEventMap, type ListInteractionMode, type ListItemClickDetail, type ListItemClickEvent, type ListNativeDragStartDetail, type ListNativeDragStartEvent, type ListSelectDetail, type ListSelectEvent, type ListSelectionMode, type ListTickleDetail, type ListTickleEvent, type ListViewportChangeDetail, type ListViewportChangeEvent, VerticalListElement, VerticalListElementEventMap };

package/dist/vertical-list.js

@@ -6,6 +6,7 @@ import { t as ListNativeDragController } from "./list-native-drag-controller-B9x
 import { r as ListDragSelectController, t as ListSelectionController } from "./list-selection-controller-SA4piSBi.js";
 import { n as animateListItemIn, r as animateListItemOut } from "./list-item-animation-BUoEKi5s.js";
 import { t as scrollFadeStyles } from "./scroll-fade-BrNUIYnm.js";
+import { n as appearanceColor, t as appearanceAbsent } from "./item-appearance-BjcMyauw.js";
 import { LitElement, css, html, render } from "lit";
 import { property } from "lit/decorators.js";
 import { createCommandRegistry } from "@clinth/ui-commands";
@@ -16,6 +17,16 @@ const ITEM_SELECTOR = `li:not([data-virtual-spacer]), [data-list-item]:not([data
 * vertical rows are shorter relative to the viewport, so 3.
 */
 const VIRTUAL_OVERSCAN = 3;
+/**
+* Layout for the per-item icon / badge wrappers `#decorateAdapterItem` adds.
+*
+* Applied as inline `cssText` rather than shadow CSS because `::slotted()` only
+* matches the host's *direct* children — these spans live inside a slotted
+* `<li>`, so a `::slotted()` rule could never reach them. The values still read
+* the CSS custom properties, so they stay themeable from the outside.
+*/
+const ITEM_ICON_EL_CSS = `flex:none;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;margin-inline-end:var(--list-item-icon-gap,6px);width:var(--list-item-icon-size,1em);height:var(--list-item-icon-size,1em)`;
+const ITEM_BADGE_EL_CSS = `flex:none;display:inline-flex;align-items:center;margin-inline-start:auto;padding-inline-start:var(--list-item-badge-gap,8px)`;
 /** Shallow key-array equality, treating `undefined` (never dispatched) as different. */
 function sameKeys(a, b) {
 	if (a === void 0 || a.length !== b.length) return false;
@@ -425,7 +436,7 @@ let VerticalListElement = class VerticalListElement extends LitElement {
 			}
 			this.#syncSearchCommands();
 		}
-		if ((changed.has(`items`) || changed.has(`formatter`) || changed.has(`keyProperty`)) && this.items !== void 0) {
+		if ((changed.has(`items`) || changed.has(`formatter`) || changed.has(`keyProperty`) || changed.has(`icon`) || changed.has(`iconColor`) || changed.has(`textColor`) || changed.has(`badge`)) && this.items !== void 0) {
 			if (this.#suspendAdapterRebuild) this.#suspendAdapterRebuild = false;
 			else if (this.#virtualActive()) this.#rebuildAdapterVirtual();
 			else this.#rebuildFromAdapter();
@@ -695,7 +706,7 @@ let VerticalListElement = class VerticalListElement extends LitElement {
 		const fresh = this.formatter ? this.formatter(data, index) : data;
 		if (el instanceof HTMLLIElement) {
 			for (const child of [...el.childNodes]) child.remove();
-			this.#fillAdapterItem(el, fresh, data);
+			this.#fillAdapterItem(el, fresh, data, index);
 			if (this.interactionMode === `checked`) this._syncCheckboxes();
 			this._syncItemStates();
 		} else if (fresh instanceof Element && this.#isRowElement(fresh)) {
@@ -750,17 +761,47 @@ let VerticalListElement = class VerticalListElement extends LitElement {
 			return content;
 		}
 		const li = document.createElement(`li`);
-		this.#fillAdapterItem(li, content, item);
+		this.#fillAdapterItem(li, content, item, index);
 		return li;
 	}
-	#fillAdapterItem(li, content, item) {
+	#fillAdapterItem(li, content, item, index) {
 		if (typeof content === `string`) li.textContent = content;
 		else if (content instanceof Node) li.appendChild(content);
 		else if (this.formatter && content !== void 0 && content !== null) render(content, li);
+		this.#decorateAdapterItem(li, item, index);
 		this.#stampAdapterKey(li, item);
 		this.#itemData.set(li, item);
 	}
 	/**
+	* Apply the per-item icon / text colour / badge to a built row. Split out
+	* from {@link #fillAdapterItem} so the parts stay readable.
+	*/
+	#decorateAdapterItem(li, item, index) {
+		const textColor = appearanceColor(this.textColor?.(item, index));
+		if (textColor !== void 0) li.style.color = textColor;
+		else li.style.removeProperty(`color`);
+		const icon = this.icon?.(item, index);
+		if (!appearanceAbsent(icon)) {
+			const holder = document.createElement(`span`);
+			holder.className = `item-icon`;
+			holder.style.cssText = ITEM_ICON_EL_CSS;
+			const iconColor = appearanceColor(this.iconColor?.(item, index));
+			if (iconColor !== void 0) holder.style.color = iconColor;
+			if (icon instanceof Node) holder.appendChild(icon);
+			else render(icon, holder);
+			li.prepend(holder);
+		}
+		const badge = this.badge?.(item, index);
+		if (!appearanceAbsent(badge)) {
+			const holder = document.createElement(`span`);
+			holder.className = `item-badge`;
+			holder.style.cssText = ITEM_BADGE_EL_CSS;
+			if (badge instanceof Node) holder.appendChild(badge);
+			else render(badge, holder);
+			li.appendChild(holder);
+		}
+	}
+	/**
 	* Whether a formatter-produced element is a whole row (used directly)
 	* rather than row content (rendered into a `<li>`): an `<li>`, already
 	* marked `[data-list-item]`, or a custom element.
@@ -1282,6 +1323,10 @@ let VerticalListElement = class VerticalListElement extends LitElement {
       outline: 1px solid transparent;
     }
 
+    /* Per-item icon / badge (adapter mode) are styled inline by
+       #decorateAdapterItem — ::slotted() only reaches the host's direct
+       children, and these spans live inside a slotted <li>. */
+
     /* Custom shadow-DOM components handle their own internal layout/padding.
        Wrapped in :where() so the selector stays at zero specificity and a
        consumer's own :host rule (e.g. display: flex) wins without
@@ -1428,6 +1473,10 @@ __decorate([property({
 	attribute: `key-property`
 })], VerticalListElement.prototype, "keyProperty", void 0);
 __decorate([property({ attribute: false })], VerticalListElement.prototype, "formatter", void 0);
+__decorate([property({ attribute: false })], VerticalListElement.prototype, "icon", void 0);
+__decorate([property({ attribute: false })], VerticalListElement.prototype, "iconColor", void 0);
+__decorate([property({ attribute: false })], VerticalListElement.prototype, "textColor", void 0);
+__decorate([property({ attribute: false })], VerticalListElement.prototype, "badge", void 0);
 __decorate([property({
 	type: Boolean,
 	attribute: `virtualize`,