@malva-ui/core 0.1.12 → 0.1.14

package/fesm2022/malva-ui-core-slider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-slider.mjs","sources":["../../../../libs/core/slider/src/lib/slider/slider-tooltip-def.ts","../../../../libs/core/slider/src/lib/slider/slider.ts","../../../../libs/core/slider/src/lib/slider/slider.html","../../../../libs/core/slider/src/malva-ui-core-slider.ts"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\n/**\n * Identifies the thumb whose tooltip is being rendered.\n *\n * Single-value sliders use `'value'`; range sliders use `'min'` and `'max'`.\n */\nexport type MlvSliderTooltipThumb = 'value' | 'min' | 'max';\n\n/**\n * Context provided to a custom `[mlvSliderTooltipDef]` template.\n */\nexport interface MlvSliderTooltipDefContext {\n  /** Current thumb value, also exposed as `let-value`. */\n  $implicit: number;\n  /** Current thumb value exposed as the named `value` property. */\n  value: number;\n  /** Semantic identity of the thumb being rendered. */\n  thumb: MlvSliderTooltipThumb;\n}\n\n/**\n * Structural directive that provides custom slider tooltip text.\n *\n * @example\n * ```html\n * <mlv-slider tooltip>\n *   <ng-template mlvSliderTooltipDef let-value>\n *     {{ value }}%\n *   </ng-template>\n * </mlv-slider>\n * ```\n */\n@Directive({\n  selector: '[mlvSliderTooltipDef]',\n})\nexport class MlvSliderTooltipDef {\n  /** Template used to render the current thumb value. */\n  readonly templateRef = inject(TemplateRef<MlvSliderTooltipDefContext>);\n\n  /** Type guard for `let-value`, `let-value=\"value\"`, and `let-thumb=\"thumb\"`. */\n  static ngTemplateContextGuard(\n    _dir: MlvSliderTooltipDef,\n    _ctx: unknown,\n  ): _ctx is MlvSliderTooltipDefContext {\n    return true;\n  }\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  contentChild,\n  DestroyRef,\n  ElementRef,\n  forwardRef,\n  inject,\n  input,\n  model,\n  Renderer2,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { DOWN_ARROW, LEFT_ARROW, RIGHT_ARROW, UP_ARROW } from '@angular/cdk/keycodes';\nimport type { MlvFormControl } from '@malva-ui/core/form-utils';\nimport {\n  MLV_FORM_CONTROL,\n  MlvSignalFormControlBase,\n} from '@malva-ui/core/form-utils';\nimport {\n  MlvCompactComfortableDensity,\n  MLV_DENSITY_ELEMENT,\n} from '@malva-ui/cdk/density';\nimport { MlvRtlService, clamp } from '@malva-ui/cdk/utils';\nimport { MLV_SLIDER_I18N } from '@malva-ui/i18n';\nimport {\n  MlvSliderTooltipDef,\n  type MlvSliderTooltipDefContext,\n} from './slider-tooltip-def';\n\n/**\n * The value type for the slider in single-thumb mode (number) or\n * dual-thumb range mode ([number, number]).\n */\nexport type MlvSliderValue = number | [number, number];\n\n@Component({\n  selector: 'mlv-slider',\n  imports: [NgTemplateOutlet],\n  templateUrl: './slider.html',\n  styleUrl: './slider.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: MlvCompactComfortableDensity,\n      inputs: ['mlvDensity'],\n    },\n  ],\n  providers: [\n    {\n      provide: MLV_DENSITY_ELEMENT,\n      useValue: 'slider',\n    },\n    {\n      provide: MLV_FORM_CONTROL,\n      useExisting: forwardRef(() => MlvSlider),\n    },\n  ],\n  host: {\n    class: 'mlv-slider',\n    '[class.mlv-slider--disabled]': 'computedDisabled()',\n    '[class.mlv-slider--range]': 'range()',\n    '[class.mlv-slider--has-ticks]': 'showTicks()',\n    '[class.mlv-slider--vertical]': '_isVertical()',\n    '[class.mlv-slider--dragging]': '_activeDragThumb() !== null',\n    '[style.--mlv-slider-fill-start]': '_fillStart()',\n    '[style.--mlv-slider-fill-end]': '_fillEnd()',\n    '(pointerdown)': '_onTrackPointerDown($event)',\n  },\n})\nexport class MlvSlider\n  extends MlvSignalFormControlBase<MlvSliderValue>\n  implements MlvFormControl\n{\n  /** @protected The component's i18n strings signal. */\n  protected readonly _i18n = inject(MLV_SLIDER_I18N);\n\n  /**\n   * Orientation of the slider.\n   * In `'vertical'` mode the track runs bottom-to-top, thumbs are positioned\n   * with `bottom`, and the host must have an explicit height set.\n   */\n  readonly orientation = input<'horizontal' | 'vertical'>('horizontal');\n\n  /** Minimum value of the slider. */\n  readonly min = input<number, MlvSliderValue | null | undefined>(0, {\n    transform: (value) => (typeof value === 'number' ? value : 0),\n  });\n\n  /** Maximum value of the slider. */\n  readonly max = input<number, MlvSliderValue | null | undefined>(100, {\n    transform: (value) => (typeof value === 'number' ? value : 100),\n  });\n\n  /** Step increment between values. */\n  readonly step = input<number, number | null | undefined>(1, {\n    transform: (value) => value ?? 1,\n  });\n\n  /** Whether to display tick marks at each step interval. */\n  readonly showTicks = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /** When true, the slider operates in dual-thumb range mode. */\n  readonly range = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /**\n   * Shows the current value in a tooltip while a thumb is hovered, dragged,\n   * or keyboard-focused.\n   */\n  readonly tooltip = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /** The selected scalar or range value used by all Angular forms APIs. */\n  readonly value = model<MlvSliderValue>(0);\n\n  /** @protected Optional consumer template used to render tooltip text. */\n  protected readonly _tooltipDef = contentChild(MlvSliderTooltipDef);\n\n  /** @private True when orientation is vertical. */\n  protected readonly _isVertical = computed(\n    () => this.orientation() === 'vertical',\n  );\n\n  /** @private Low (or sole) thumb value derived directly from the forms model. */\n  protected readonly _lowValue = computed<number>(() => {\n    const value = this.value();\n    return this._clamp(Array.isArray(value) ? value[0] : value);\n  });\n\n  /** @private High thumb value derived directly from the forms model. */\n  protected readonly _highValue = computed<number>(() => {\n    const value = this.value();\n    return this._clamp(Array.isArray(value) ? value[1] : this.max());\n  });\n\n  /** @protected Template context for the low or single-value thumb tooltip. */\n  protected readonly _lowTooltipContext = computed<MlvSliderTooltipDefContext>(\n    () => {\n      const value = this._lowValue();\n      return {\n        $implicit: value,\n        value,\n        thumb: this.range() ? 'min' : 'value',\n      };\n    },\n  );\n\n  /** @protected Template context for the high thumb tooltip in range mode. */\n  protected readonly _highTooltipContext = computed<MlvSliderTooltipDefContext>(\n    () => {\n      const value = this._highValue();\n      return {\n        $implicit: value,\n        value,\n        thumb: 'max',\n      };\n    },\n  );\n\n  /**\n   * @private The thumb currently being dragged: 'low', 'high', or null.\n   */\n  protected readonly _activeDragThumb = signal<'low' | 'high' | null>(null);\n\n  /**\n   * @private Raw drag position (0–100%) for the low thumb while dragging.\n   * Null when not dragging — thumb reverts to the snapped value's position.\n   */\n  private readonly _lowDragPercent = signal<number | null>(null);\n  private readonly _rtlService = inject(MlvRtlService);\n\n  /**\n   * @private Effective direction of this slider, tracking the global direction\n   * and any `[dir]` scope above the host. Mirrors pointer-to-value mapping.\n   */\n  private readonly _direction = this._rtlService.elementDirection(\n    inject(ElementRef<HTMLElement>),\n  );\n\n  /**\n   * @private Raw drag position (0–100%) for the high thumb while dragging.\n   * Null when not dragging — thumb reverts to the snapped value's position.\n   */\n  private readonly _highDragPercent = signal<number | null>(null);\n\n  /**\n   * @private Visual percentage position of the low thumb.\n   * Uses the raw drag position while dragging for a smooth feel;\n   * snaps back to the step-aligned position on pointer release.\n   */\n  protected readonly _lowPercent = computed<number>(() => {\n    const drag = this._lowDragPercent();\n    return drag !== null ? drag : this._valueToPercent(this._lowValue());\n  });\n\n  /**\n   * @private Visual percentage position of the high thumb.\n   * Uses the raw drag position while dragging for a smooth feel;\n   * snaps back to the step-aligned position on pointer release.\n   */\n  protected readonly _highPercent = computed<number>(() => {\n    const drag = this._highDragPercent();\n    return drag !== null ? drag : this._valueToPercent(this._highValue());\n  });\n\n  /**\n   * @private Computed percentage for the fill region start (0–100%).\n   * In single mode this is always 0; in range mode it tracks the low thumb visual position.\n   */\n  protected readonly _fillStart = computed<string>(() => {\n    if (!this.range()) return '0%';\n    return `${this._lowPercent()}%`;\n  });\n\n  /**\n   * @private Computed percentage for the fill region end (0–100%).\n   * Tracks the visual (drag or snapped) position of the active thumb.\n   */\n  protected readonly _fillEnd = computed<string>(() => {\n    return `${this.range() ? this._highPercent() : this._lowPercent()}%`;\n  });\n\n  /**\n   * @private Array of tick positions (percentages) shown when showTicks is true.\n   */\n  protected readonly _ticks = computed<number[]>(() => {\n    const min = this.min();\n    const max = this.max();\n    const step = this.step();\n    if (step <= 0) return [];\n    const ticks: number[] = [];\n    for (let v = min; v <= max; v += step) {\n      ticks.push(this._valueToPercent(v));\n    }\n    return ticks;\n  });\n\n  constructor() {\n    super();\n    this._elementRef = inject(ElementRef);\n    this._renderer = inject(Renderer2);\n    this._destroyRef = inject(DestroyRef);\n  }\n\n  /** @private Host element ref for pointer-to-value calculation. */\n  private _elementRef: ElementRef<HTMLElement>;\n\n  /** @private Renderer2 for SSR-safe + auto-cleanup window listeners during drag. */\n  private _renderer: Renderer2;\n\n  /** @private DestroyRef so a destroy mid-drag releases the listeners. */\n  private _destroyRef: DestroyRef;\n\n  /**\n   * @private The `.mlv-slider__track` element — a static child of this\n   * component's own template, so it is resolved via a signal `viewChild` query\n   * (repo rule: no `querySelector` for own-template elements) rather than a DOM\n   * lookup on the host.\n   */\n  private readonly _trackRef = viewChild<ElementRef<HTMLElement>>('track');\n\n  /**\n   * @private Track bounding rect captured at pointerdown and reused for the whole\n   * drag, so `_pointerToPercent` does not force a `getBoundingClientRect` layout\n   * read on every pointermove. Dropped when the pointer ends or is cancelled.\n   */\n  private _dragTrackRect: DOMRect | null = null;\n\n  // -------------------------------------------------------------------------\n  // Forms value\n  // -------------------------------------------------------------------------\n\n  /** Whether the control holds a clearable value — A slider always carries a numeric value. */\n  readonly hasValue = computed(() => true);\n\n  // -------------------------------------------------------------------------\n  // Keyboard handling (delegated from thumb elements)\n  // -------------------------------------------------------------------------\n\n  /**\n   * @protected Handles keydown events on the low thumb.\n   */\n  protected _onLowThumbKeydown(event: KeyboardEvent): void {\n    if (this.computedDisabled()) return;\n    const newValue = this._computeKeyValue(event, this._lowValue());\n    if (newValue !== null) {\n      event.preventDefault();\n      const clamped = this.range()\n        ? Math.min(newValue, this._highValue())\n        : newValue;\n      this._setLowValue(clamped);\n      this._emitChange();\n    }\n  }\n\n  /**\n   * @protected Handles keydown events on the high thumb (range mode only).\n   */\n  protected _onHighThumbKeydown(event: KeyboardEvent): void {\n    if (this.computedDisabled() || !this.range()) return;\n    const newValue = this._computeKeyValue(event, this._highValue());\n    if (newValue !== null) {\n      event.preventDefault();\n      const clamped = Math.max(newValue, this._lowValue());\n      this._setHighValue(clamped);\n      this._emitChange();\n    }\n  }\n\n  // -------------------------------------------------------------------------\n  // Pointer / drag handling\n  // -------------------------------------------------------------------------\n\n  /**\n   * @protected Handles pointerdown events on the track area to begin thumb dragging.\n   */\n  protected _onTrackPointerDown(event: PointerEvent): void {\n    if (this.computedDisabled()) return;\n\n    // Cache the track rect once per drag so the per-move percent math (track\n    // click and every pointermove) avoids a repeated getBoundingClientRect\n    // layout read. Cleared on pointerup. The element itself comes from the\n    // `viewChild` query, not a DOM lookup.\n    this._dragTrackRect =\n      this._trackRef()?.nativeElement.getBoundingClientRect() ?? null;\n\n    const target = event.target;\n    const thumbElement =\n      target instanceof Element\n        ? target.closest<HTMLElement>('.mlv-slider__thumb')\n        : null;\n    if (thumbElement && this._elementRef.nativeElement.contains(thumbElement)) {\n      const thumb = (thumbElement.dataset['thumb'] ?? 'low') as 'low' | 'high';\n      this._activeDragThumb.set(thumb);\n      thumbElement.setPointerCapture(event.pointerId);\n      this._attachPointerListeners(event.pointerId);\n      return;\n    }\n\n    // Click on track — jump the nearest thumb to that position\n    const value = this._pointerEventToValue(event);\n    if (!this.range()) {\n      this._setLowValue(value);\n      this._emitChange();\n      this._activeDragThumb.set('low');\n    } else {\n      const lowDist = Math.abs(this._lowValue() - value);\n      const highDist = Math.abs(this._highValue() - value);\n      if (lowDist <= highDist) {\n        this._setLowValue(Math.min(value, this._highValue()));\n        this._activeDragThumb.set('low');\n      } else {\n        this._setHighValue(Math.max(value, this._lowValue()));\n        this._activeDragThumb.set('high');\n      }\n      this._emitChange();\n    }\n    this._attachPointerListeners(event.pointerId);\n  }\n\n  /**\n   * @private Attaches pointermove/end listeners on the window for drag tracking.\n   * During drag the thumb follows the pointer freely (no step snapping) while the\n   * emitted value snaps to the nearest step on every move. On pointer release the\n   * raw drag position is cleared so the thumb animates to the snapped position.\n   */\n  private _attachPointerListeners(pointerId: number): void {\n    let release: (() => void) | null = null;\n\n    const onMove = (e: PointerEvent) => {\n      if (e.pointerId !== pointerId) return;\n      const rawPercent = this._pointerToPercent(e);\n      const rawValue =\n        this.min() + (rawPercent / 100) * (this.max() - this.min());\n      const snappedValue = this._snap(this._clamp(rawValue));\n      const thumb = this._activeDragThumb();\n\n      if (thumb === 'low') {\n        const maxPercent = this.range() ? this._highPercent() : 100;\n        const clampedPercent = Math.min(rawPercent, maxPercent);\n        this._lowDragPercent.set(clampedPercent);\n        this._setLowValue(\n          this.range()\n            ? Math.min(snappedValue, this._highValue())\n            : snappedValue,\n        );\n      } else if (thumb === 'high') {\n        const minPercent = this._lowPercent();\n        const clampedPercent = Math.max(rawPercent, minPercent);\n        this._highDragPercent.set(clampedPercent);\n        this._setHighValue(Math.max(snappedValue, this._lowValue()));\n      }\n      this._emitChange();\n    };\n\n    const onEnd = (e: PointerEvent) => {\n      if (e.pointerId !== pointerId) return;\n      this._lowDragPercent.set(null);\n      this._highDragPercent.set(null);\n      this._activeDragThumb.set(null);\n      // Drop the cached track geometry so the next drag re-measures.\n      this._dragTrackRect = null;\n      this._markTouched();\n      release?.();\n      release = null;\n    };\n\n    const moveDispose = this._renderer.listen('window', 'pointermove', onMove);\n    const upDispose = this._renderer.listen('window', 'pointerup', onEnd);\n    const cancelDispose = this._renderer.listen(\n      'window',\n      'pointercancel',\n      onEnd,\n    );\n    release = () => {\n      moveDispose();\n      upDispose();\n      cancelDispose();\n    };\n\n    // Guarantee cleanup if the component is destroyed mid-drag — prevents\n    // stale window listeners against a detached host.\n    this._destroyRef.onDestroy(() => release?.());\n  }\n\n  // -------------------------------------------------------------------------\n  // Private utilities\n  // -------------------------------------------------------------------------\n\n  /**\n   * @private Converts a keyboard event into a new value, or null if unhandled.\n   */\n  private _computeKeyValue(\n    event: KeyboardEvent,\n    currentValue: number,\n  ): number | null {\n    const min = this.min();\n    const max = this.max();\n    const step = this.step();\n    const pageStep = Math.max(step, (max - min) * 0.1);\n\n    switch (this._rtlService.normalizeArrowKey(event) ?? event.key) {\n      case RIGHT_ARROW:\n      case UP_ARROW:\n        return this._clamp(currentValue + step);\n      case LEFT_ARROW:\n      case DOWN_ARROW:\n        return this._clamp(currentValue - step);\n      case 'Home':\n        return min;\n      case 'End':\n        return max;\n      case 'PageUp':\n        return this._clamp(currentValue + pageStep);\n      case 'PageDown':\n        return this._clamp(currentValue - pageStep);\n      default:\n        return null;\n    }\n  }\n\n  /**\n   * @private Converts a pointer event position to a clamped percentage (0–100).\n   * Horizontal: left → 0%, right → 100%.\n   * Vertical: bottom → 0%, top → 100% (inverted Y axis).\n   * Does not snap — use this for free drag tracking.\n   */\n  private _pointerToPercent(event: PointerEvent): number {\n    // Reuse the rect cached at pointerdown; fall back to a fresh measurement of\n    // the `viewChild` track element if reached outside a drag sequence.\n    const rect =\n      this._dragTrackRect ??\n      this._trackRef()?.nativeElement.getBoundingClientRect() ??\n      null;\n    if (!rect) return this._valueToPercent(this._lowValue());\n    if (this._isVertical()) {\n      return Math.min(\n        100,\n        Math.max(0, (1 - (event.clientY - rect.top) / rect.height) * 100),\n      );\n    }\n    // 0% sits at the inline-start edge, which is the track's right edge in RTL.\n    const offset = this._direction() === 'rtl'\n      ? rect.right - event.clientX\n      : event.clientX - rect.left;\n    return Math.min(100, Math.max(0, (offset / rect.width) * 100));\n  }\n\n  /**\n   * @private Converts a pointer event's X position to a clamped, snapped slider value.\n   * Used for track clicks (immediate snap) — not for drag moves.\n   */\n  private _pointerEventToValue(event: PointerEvent): number {\n    const percent = this._pointerToPercent(event);\n    const rawValue = this.min() + (percent / 100) * (this.max() - this.min());\n    return this._snap(this._clamp(rawValue));\n  }\n\n  /**\n   * @private Converts a value to a percentage between 0 and 100.\n   */\n  private _valueToPercent(value: number): number {\n    const range = this.max() - this.min();\n    if (range === 0) return 0;\n    return ((value - this.min()) / range) * 100;\n  }\n\n  /**\n   * @private Clamps a value to [min, max].\n   */\n  private _clamp(value: number): number {\n    return clamp(value, this.min(), this.max());\n  }\n\n  /**\n   * @private Snaps a value to the nearest step.\n   */\n  private _snap(value: number): number {\n    const step = this.step();\n    if (step <= 0) return value;\n    const snapped = Math.round((value - this.min()) / step) * step + this.min();\n    return this._clamp(snapped);\n  }\n\n  /** @private Writes the low/sole thumb while preserving the range shape. */\n  private _setLowValue(value: number): void {\n    if (this.range()) {\n      this.value.set([value, this._highValue()]);\n    } else {\n      this.value.set(value);\n    }\n  }\n\n  /** @private Writes the high thumb while preserving the current low value. */\n  private _setHighValue(value: number): void {\n    this.value.set([this._lowValue(), value]);\n  }\n\n  /**\n   * @private Writes the current value through the signal-forms model.\n   */\n  private _emitChange(): void {\n    if (this.range()) {\n      this.value.set([this._lowValue(), this._highValue()]);\n    } else {\n      this.value.set(this._lowValue());\n    }\n  }\n\n  /** @protected Marks the control touched when either thumb loses focus. */\n  protected _onThumbBlur(): void {\n    this.setFocused(false);\n    this._markTouched();\n  }\n}\n","<div class=\"mlv-slider__track\" #track>\n  <div class=\"mlv-slider__fill\"></div>\n\n  @if (showTicks()) {\n  <div class=\"mlv-slider__ticks\" aria-hidden=\"true\">\n    @for (tick of _ticks(); track tick) {\n    <span\n      class=\"mlv-slider__tick\"\n      [style.left]=\"!_isVertical() ? tick + '%' : null\"\n      [style.bottom]=\"_isVertical() ? tick + '%' : null\"\n    ></span>\n    }\n  </div>\n  }\n</div>\n\n<div\n  class=\"mlv-slider__thumb mlv-slider__thumb--low\"\n  [class.mlv-slider__thumb--dragging]=\"_activeDragThumb() === 'low'\"\n  role=\"slider\"\n  [attr.data-thumb]=\"'low'\"\n  [attr.tabindex]=\"computedDisabled() ? -1 : 0\"\n  [attr.aria-valuenow]=\"_lowValue()\"\n  [attr.aria-valuemin]=\"min()\"\n  [attr.aria-valuemax]=\"range() ? _highValue() : max()\"\n  [attr.aria-label]=\"\n    range() ? _i18n().minValue : ariaLabel() || label() || _i18n().value\n  \"\n  [attr.aria-disabled]=\"computedDisabled() || null\"\n  [attr.aria-orientation]=\"orientation()\"\n  [style.left]=\"!_isVertical() ? _lowPercent() + '%' : null\"\n  [style.bottom]=\"_isVertical() ? _lowPercent() + '%' : null\"\n  (keydown)=\"_onLowThumbKeydown($event)\"\n  (focus)=\"setFocused(true)\"\n  (blur)=\"_onThumbBlur()\"\n></div>\n\n@if (tooltip()) {\n<span\n  class=\"mlv-slider__tooltip mlv-slider__tooltip--low\"\n  aria-hidden=\"true\"\n  [style.left]=\"!_isVertical() ? _lowPercent() + '%' : null\"\n  [style.bottom]=\"_isVertical() ? _lowPercent() + '%' : null\"\n>\n  @if (_tooltipDef(); as tooltipDef) {\n  <ng-container\n    [ngTemplateOutlet]=\"tooltipDef.templateRef\"\n    [ngTemplateOutletContext]=\"_lowTooltipContext()\"\n  />\n  } @else { {{ _lowValue() }} }\n</span>\n} @if (range()) {\n<div\n  class=\"mlv-slider__thumb mlv-slider__thumb--high\"\n  [class.mlv-slider__thumb--dragging]=\"_activeDragThumb() === 'high'\"\n  role=\"slider\"\n  [attr.data-thumb]=\"'high'\"\n  [attr.tabindex]=\"computedDisabled() ? -1 : 0\"\n  [attr.aria-valuenow]=\"_highValue()\"\n  [attr.aria-valuemin]=\"_lowValue()\"\n  [attr.aria-valuemax]=\"max()\"\n  [attr.aria-label]=\"_i18n().maxValue\"\n  [attr.aria-disabled]=\"computedDisabled() || null\"\n  [attr.aria-orientation]=\"orientation()\"\n  [style.left]=\"!_isVertical() ? _highPercent() + '%' : null\"\n  [style.bottom]=\"_isVertical() ? _highPercent() + '%' : null\"\n  (keydown)=\"_onHighThumbKeydown($event)\"\n  (focus)=\"setFocused(true)\"\n  (blur)=\"_onThumbBlur()\"\n></div>\n\n@if (tooltip()) {\n<span\n  class=\"mlv-slider__tooltip mlv-slider__tooltip--high\"\n  aria-hidden=\"true\"\n  [style.left]=\"!_isVertical() ? _highPercent() + '%' : null\"\n  [style.bottom]=\"_isVertical() ? _highPercent() + '%' : null\"\n>\n  @if (_tooltipDef(); as tooltipDef) {\n  <ng-container\n    [ngTemplateOutlet]=\"tooltipDef.templateRef\"\n    [ngTemplateOutletContext]=\"_highTooltipContext()\"\n  />\n  } @else { {{ _highValue() }} }\n</span>\n} }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/malva-ui-core-split-pane.mjs

@@ -0,0 +1,359 @@
+import * as i0 from '@angular/core';
+import { inject, ElementRef, input, ChangeDetectionStrategy, ViewEncapsulation, Component, signal, contentChildren, Renderer2, DestroyRef, NgZone } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { fromEvent, filter, switchMap, takeUntil, tap, map } from 'rxjs';
+import { LEFT_ARROW, UP_ARROW, RIGHT_ARROW, DOWN_ARROW } from '@angular/cdk/keycodes';
+import { MlvRtlService, clamp } from '@malva-ui/cdk/utils';
+
+/**
+ * Individual panel inside a `mlv-split-pane`.
+ *
+ * Panels are placed side-by-side (horizontal) or stacked (vertical) with a
+ * draggable handle between each pair. The parent component manages all sizes
+ * and inserts the handles automatically.
+ *
+ * @example
+ * ```html
+ * <mlv-split-pane>
+ *   <mlv-split-pane-panel [size]="30">Sidebar</mlv-split-pane-panel>
+ *   <mlv-split-pane-panel>Main content</mlv-split-pane-panel>
+ * </mlv-split-pane>
+ * ```
+ */
+class MlvSplitPanePanel {
+    /** @internal Direct reference to the host element, used by the parent for DOM measurement. */
+    _elementRef = inject((ElementRef));
+    /**
+     * Initial size of this panel as a percentage of the container.
+     * When omitted the panel shares the remaining space equally with other unsized panels.
+     */
+    size = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /**
+     * Minimum size of this panel as a percentage.
+     * Drag and keyboard resize will not reduce this panel below this value.
+     * Defaults to `5`.
+     */
+    minSize = input(5, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "minSize" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvSplitPanePanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: MlvSplitPanePanel, isStandalone: true, selector: "mlv-split-pane-panel", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, minSize: { classPropertyName: "minSize", publicName: "minSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "mlv-split-pane__panel" }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvSplitPanePanel, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'mlv-split-pane-panel',
+                    template: `<ng-content />`,
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        class: 'mlv-split-pane__panel',
+                    },
+                }]
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], minSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "minSize", required: false }] }] } });
+
+/**
+ * Split pane container that divides space into two or more resizable panels.
+ *
+ * Panels are declared as `<mlv-split-pane-panel>` children. The component
+ * automatically inserts a drag handle between each adjacent pair. Sizes are
+ * managed via CSS `grid-template-columns` (horizontal) or
+ * `grid-template-rows` (vertical), ensuring the DOM always reflects the true
+ * rendered widths/heights.
+ *
+ * @example Basic 2-panel
+ * ```html
+ * <mlv-split-pane style="height: 300px;">
+ *   <mlv-split-pane-panel [size]="30">Sidebar</mlv-split-pane-panel>
+ *   <mlv-split-pane-panel>Main</mlv-split-pane-panel>
+ * </mlv-split-pane>
+ * ```
+ *
+ * @example 3-panel
+ * ```html
+ * <mlv-split-pane style="height: 300px;">
+ *   <mlv-split-pane-panel [size]="20">Nav</mlv-split-pane-panel>
+ *   <mlv-split-pane-panel>Editor</mlv-split-pane-panel>
+ *   <mlv-split-pane-panel [size]="25">Properties</mlv-split-pane-panel>
+ * </mlv-split-pane>
+ * ```
+ */
+class MlvSplitPane {
+    /**
+     * Orientation of the split. `'horizontal'` places panels side-by-side;
+     * `'vertical'` stacks them top to bottom.
+     */
+    orientation = input('horizontal', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+    /** @protected Whether a drag is currently in progress. Drives the `--dragging` modifier class. */
+    _isDragging = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_isDragging" }] : /* istanbul ignore next */ []));
+    /** @private Queried panel children. */
+    _panels = contentChildren(MlvSplitPanePanel, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_panels" }] : /* istanbul ignore next */ []));
+    /** @private Current sizes of each panel in `fr` units (≈ percentage). */
+    _sizes = signal([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_sizes" }] : /* istanbul ignore next */ []));
+    /**
+     * @private Latest sizes produced during an active pointer drag. The drag
+     * stream runs outside Angular and mutates the grid template imperatively; this
+     * buffer holds the running value so it can be committed to the `_sizes` signal
+     * exactly once, on pointerup, inside the zone.
+     */
+    _dragSizes = null;
+    /** @private The inserted drag-handle elements, indexed by the pair they split. */
+    _handles = [];
+    /** @private Host element reference. */
+    _elementRef = inject((ElementRef));
+    /** @private Angular Renderer2 for all DOM mutations. */
+    _renderer = inject(Renderer2);
+    /** @private DestroyRef for observable cleanup. */
+    _destroyRef = inject(DestroyRef);
+    /** @private Angular zone — the drag stream runs outside it to avoid a change-detection pass per pointermove. */
+    _ngZone = inject(NgZone);
+    _rtlService = inject(MlvRtlService);
+    /**
+     * @private Effective direction of this split pane, tracking the global
+     * direction and any `[dir]` scope above the host. Mirrors drag geometry:
+     * panel[0] is the inline-first panel, which sits on the right in RTL.
+     */
+    _direction = this._rtlService.elementDirection(this._elementRef);
+    ngAfterContentInit() {
+        const panels = this._panels();
+        if (panels.length < 2)
+            return;
+        const sizes = this._computeInitialSizes(panels);
+        this._sizes.set(sizes);
+        this._applyGridTemplate(sizes);
+        // Insert a drag handle between each adjacent pair of panels.
+        panels.forEach((panel, i) => {
+            if (i >= panels.length - 1)
+                return;
+            const handle = this._createHandle(i);
+            this._handles[i] = handle;
+            this._renderer.insertBefore(this._elementRef.nativeElement, handle, panel._elementRef.nativeElement.nextSibling);
+            this._initDragForHandle(handle, i);
+        });
+        // Handles exist now — publish their initial ARIA window-splitter values.
+        this._updateHandleAria(sizes);
+    }
+    /**
+     * @private Calculates the initial size for each panel.
+     * Panels with an explicit `size` input use that value.
+     * Panels without one share the remaining percentage equally.
+     */
+    _computeInitialSizes(panels) {
+        const explicit = panels.map((p) => p.size());
+        const fixedTotal = explicit.reduce((sum, s) => sum + (s ?? 0), 0);
+        const autoCount = explicit.filter((s) => s === undefined).length;
+        const autoSize = autoCount > 0 ? (100 - fixedTotal) / autoCount : 0;
+        return explicit.map((s) => s ?? autoSize);
+    }
+    /**
+     * @private Updates `grid-template-columns` (horizontal) or `grid-template-rows`
+     * (vertical) so each panel occupies its current `fr` share. Handles always
+     * occupy a fixed `0.125rem` track, so they never eat into panel space.
+     */
+    _applyGridTemplate(sizes) {
+        const isHorizontal = this.orientation() === 'horizontal';
+        const tracks = [];
+        sizes.forEach((size, i) => {
+            tracks.push(`${size}fr`);
+            if (i < sizes.length - 1)
+                tracks.push('0.125rem');
+        });
+        const prop = isHorizontal ? 'grid-template-columns' : 'grid-template-rows';
+        this._renderer.setStyle(this._elementRef.nativeElement, prop, tracks.join(' '));
+        // Keep each separator's ARIA value in sync with the rendered sizes.
+        this._updateHandleAria(sizes);
+    }
+    /**
+     * @private Syncs the ARIA window-splitter values on every drag handle.
+     * A focusable `role="separator"` is a window splitter and therefore requires
+     * `aria-valuenow` (with `aria-valuemin`/`aria-valuemax`). `aria-valuenow`
+     * tracks the leading panel's size (%), bounded by the two adjacent panels'
+     * `minSize` values.
+     */
+    _updateHandleAria(sizes) {
+        const panels = this._panels();
+        this._handles.forEach((handle, i) => {
+            if (!handle)
+                return;
+            const leadMin = panels[i]?.minSize() ?? 0;
+            const trailMin = panels[i + 1]?.minSize() ?? 0;
+            this._renderer.setAttribute(handle, 'aria-valuenow', String(Math.round(sizes[i] ?? 0)));
+            this._renderer.setAttribute(handle, 'aria-valuemin', String(Math.round(leadMin)));
+            this._renderer.setAttribute(handle, 'aria-valuemax', String(Math.round(100 - trailMin)));
+        });
+    }
+    /**
+     * @private Creates and returns a drag handle DOM element for the given handle index.
+     * The grip visual is drawn entirely with CSS — no Angular directives required.
+     */
+    _createHandle(handleIndex) {
+        const isHorizontal = this.orientation() === 'horizontal';
+        const handle = this._renderer.createElement('div');
+        this._renderer.addClass(handle, 'mlv-split-pane__handle');
+        this._renderer.setAttribute(handle, 'role', 'separator');
+        this._renderer.setAttribute(handle, 'tabindex', '0');
+        this._renderer.setAttribute(handle, 'aria-label', isHorizontal ? 'Resize panels horizontally' : 'Resize panels vertically');
+        this._renderer.setAttribute(handle, 'aria-orientation', isHorizontal ? 'vertical' : 'horizontal');
+        const grip = this._renderer.createElement('span');
+        this._renderer.addClass(grip, 'mlv-split-pane__handle-grip');
+        this._renderer.addClass(grip, isHorizontal
+            ? 'mlv-split-pane__handle-grip--vertical'
+            : 'mlv-split-pane__handle-grip--horizontal');
+        this._renderer.setAttribute(grip, 'aria-hidden', 'true');
+        this._renderer.appendChild(handle, grip);
+        const dispose = this._renderer.listen(handle, 'keydown', (e) => {
+            this._onHandleKeydown(e, handleIndex);
+        });
+        // Renderer2.listen returns a disposer — register it so the keydown
+        // listener does not outlive this component instance.
+        this._destroyRef.onDestroy(dispose);
+        return handle;
+    }
+    /**
+     * @private Wires pointer-capture drag behavior for a single handle.
+     * Only the two panels adjacent to the handle change size during drag;
+     * all other panels remain fixed.
+     */
+    _initDragForHandle(handleEl, handleIndex) {
+        const containerEl = this._elementRef.nativeElement;
+        const isHorizontal = () => this.orientation() === 'horizontal';
+        // The drag stream runs OUTSIDE Angular: each pointermove writes the grid
+        // template imperatively (Renderer2) and never touches a signal, so a fast
+        // drag no longer schedules an OnPush change-detection pass per move. Only
+        // the `_isDragging` host-class flag and the single final `_sizes` commit
+        // re-enter the zone. Split-pane exposes no per-move output, so there is no
+        // emission-timing contract to preserve.
+        this._ngZone.runOutsideAngular(() => {
+            fromEvent(handleEl, 'pointerdown')
+                .pipe(takeUntilDestroyed(this._destroyRef), filter((e) => e.button === 0), switchMap((startEvent) => {
+                startEvent.preventDefault();
+                handleEl.setPointerCapture(startEvent.pointerId);
+                const containerRect = containerEl.getBoundingClientRect();
+                const containerSize = isHorizontal()
+                    ? containerRect.width
+                    : containerRect.height;
+                const resizeCursor = isHorizontal() ? 'col-resize' : 'row-resize';
+                // `_isDragging` drives a host-class binding — flip it in the zone.
+                this._ngZone.run(() => this._isDragging.set(true));
+                this._renderer.setStyle(document.documentElement, 'cursor', resizeCursor);
+                this._renderer.setStyle(document.documentElement, 'user-select', 'none');
+                const panels = this._panels();
+                const panelI = panels[handleIndex];
+                const panelI1 = panels[handleIndex + 1];
+                const sizes = [...this._sizes()];
+                const pairTotal = sizes[handleIndex] + sizes[handleIndex + 1];
+                // Seed the drag buffer so a press/release with no move still commits
+                // a well-defined (unchanged) size array on pointerup.
+                this._dragSizes = sizes;
+                // Capture panel[i]'s start position in the viewport at drag start.
+                // Since only panel[i] and panel[i+1] will change, all panels before [i]
+                // remain fixed, so this reference stays valid throughout the drag.
+                const panelIEl = panelI._elementRef.nativeElement;
+                const panelIRect = panelIEl.getBoundingClientRect();
+                // Panel[i]'s inline-start edge is its right edge in RTL, and the
+                // pointer then travels away from it as the panel grows.
+                const mirrored = isHorizontal() && this._direction() === 'rtl';
+                const panelIStart = isHorizontal()
+                    ? mirrored
+                        ? panelIRect.right
+                        : panelIRect.left
+                    : panelIRect.top;
+                return fromEvent(handleEl, 'pointermove').pipe(takeUntil(fromEvent(handleEl, 'pointerup').pipe(tap(() => {
+                    this._renderer.removeStyle(document.documentElement, 'cursor');
+                    this._renderer.removeStyle(document.documentElement, 'user-select');
+                    // Commit the final sizes + clear dragging once, in the zone,
+                    // so OnPush change detection runs a single time per drag.
+                    this._ngZone.run(() => {
+                        this._isDragging.set(false);
+                        if (this._dragSizes)
+                            this._sizes.set(this._dragSizes);
+                    });
+                }))), map((moveEvent) => {
+                    const pointerPos = isHorizontal()
+                        ? moveEvent.clientX
+                        : moveEvent.clientY;
+                    // Pixel distance from panel[i]'s inline-start edge to the pointer
+                    const newPanelI_px = mirrored
+                        ? panelIStart - pointerPos
+                        : pointerPos - panelIStart;
+                    // Convert to the same fr-unit space (fr ≈ % of container)
+                    const newPanelI_fr = (newPanelI_px / containerSize) * 100;
+                    // Clamp: both adjacent panels must respect their minSize
+                    const minI = panelI.minSize();
+                    const minI1 = panelI1.minSize();
+                    const clampedI = clamp(newPanelI_fr, minI, pairTotal - minI1);
+                    const newSizes = [...this._sizes()];
+                    newSizes[handleIndex] = clampedI;
+                    newSizes[handleIndex + 1] = pairTotal - clampedI;
+                    return newSizes;
+                }));
+            }))
+                .subscribe((sizes) => {
+                // Per move (outside the zone): buffer the value and apply the grid
+                // template imperatively — no signal writes, so no CD pass.
+                this._dragSizes = sizes;
+                this._applyGridTemplate(sizes);
+            });
+        });
+    }
+    /**
+     * @protected Keyboard handler on each dynamically created handle.
+     * Arrow keys move by 1%, Home/End jump to the adjacent panel's minSize.
+     */
+    _onHandleKeydown(event, handleIndex) {
+        const isHorizontal = this.orientation() === 'horizontal';
+        const key = this._rtlService.normalizeArrowKey(event);
+        const shouldDecrease = (isHorizontal && key === LEFT_ARROW) ||
+            (!isHorizontal && key === UP_ARROW);
+        const shouldIncrease = (isHorizontal && key === RIGHT_ARROW) ||
+            (!isHorizontal && key === DOWN_ARROW);
+        if (!shouldDecrease &&
+            !shouldIncrease &&
+            event.key !== 'Home' &&
+            event.key !== 'End')
+            return;
+        event.preventDefault();
+        const panels = this._panels();
+        const sizes = [...this._sizes()];
+        const pairTotal = sizes[handleIndex] + sizes[handleIndex + 1];
+        const minI = panels[handleIndex].minSize();
+        const minI1 = panels[handleIndex + 1].minSize();
+        let newI;
+        if (event.key === 'Home') {
+            newI = minI;
+        }
+        else if (event.key === 'End') {
+            newI = pairTotal - minI1;
+        }
+        else {
+            newI = sizes[handleIndex] + (shouldDecrease ? -1 : 1);
+        }
+        newI = clamp(newI, minI, pairTotal - minI1);
+        sizes[handleIndex] = newI;
+        sizes[handleIndex + 1] = pairTotal - newI;
+        this._sizes.set(sizes);
+        this._applyGridTemplate(sizes);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvSplitPane, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.7", type: MlvSplitPane, isStandalone: true, selector: "mlv-split-pane", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mlv-split-pane--horizontal": "orientation() === \"horizontal\"", "class.mlv-split-pane--vertical": "orientation() === \"vertical\"", "class.mlv-split-pane--dragging": "_isDragging()" }, classAttribute: "mlv-split-pane" }, queries: [{ propertyName: "_panels", predicate: MlvSplitPanePanel, isSignal: true }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: ["@layer mlv.components{.mlv-split-pane{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-split-pane *{box-sizing:border-box}.mlv-split-pane{display:grid;width:100%;height:100%}.mlv-split-pane--horizontal{grid-template-rows:1fr}.mlv-split-pane--horizontal .mlv-split-pane__handle{width:.125rem;height:100%;cursor:col-resize}.mlv-split-pane--horizontal .mlv-split-pane__handle:before{width:1.5rem;height:100%;inset-inline-start:-.6875rem;top:0;cursor:col-resize}.mlv-split-pane--horizontal .mlv-split-pane__handle .mlv-split-pane__handle-grip--vertical{display:flex}.mlv-split-pane--horizontal .mlv-split-pane__handle .mlv-split-pane__handle-grip--horizontal{display:none}.mlv-split-pane--vertical{grid-template-columns:1fr}.mlv-split-pane--vertical .mlv-split-pane__handle{width:100%;height:.125rem;cursor:row-resize}.mlv-split-pane--vertical .mlv-split-pane__handle:before{height:1.5rem;width:100%;top:-.6875rem;inset-inline-start:0;cursor:row-resize}.mlv-split-pane--vertical .mlv-split-pane__handle .mlv-split-pane__handle-grip--horizontal{display:flex}.mlv-split-pane--vertical .mlv-split-pane__handle .mlv-split-pane__handle-grip--vertical{display:none}.mlv-split-pane__panel{min-width:0;min-height:0;overflow:hidden;position:relative}.mlv-split-pane__handle{display:flex;align-items:center;justify-content:center;touch-action:none;background:linear-gradient(to bottom,transparent,var(--mlv-border-subtle) 20%,var(--mlv-border-normal) 50%,var(--mlv-border-subtle) 80%,transparent);transition:background var(--mlv-duration-normal) var(--mlv-ease-out);-webkit-user-select:none;user-select:none;outline:none;position:relative;z-index:1}.mlv-split-pane__handle:before{content:\"\";position:absolute;display:block}.mlv-split-pane__handle:hover,.mlv-split-pane--dragging .mlv-split-pane__handle{background:color-mix(in srgb,var(--mlv-background-accent-1) 20%,transparent)}.mlv-split-pane__handle:focus-visible{outline:var(--mlv-stroke-width-medium) solid var(--mlv-border-focus);outline-offset:var(--mlv-focus-ring-offset);background:color-mix(in srgb,var(--mlv-background-accent-1) 20%,transparent)}.mlv-split-pane__handle-grip{align-items:center;justify-content:center;pointer-events:none;opacity:0;transition:opacity var(--mlv-duration-normal) var(--mlv-ease-out);z-index:1;position:relative}.mlv-split-pane__handle:hover .mlv-split-pane__handle-grip,.mlv-split-pane--dragging .mlv-split-pane__handle .mlv-split-pane__handle-grip{opacity:1}.mlv-split-pane__handle:focus-visible .mlv-split-pane__handle-grip{opacity:1}.mlv-split-pane__handle-grip--vertical{width:.1875rem;height:1.25rem;background-image:radial-gradient(circle,var(--mlv-background-accent-1) 1.5px,transparent 1.5px);background-size:.1875rem .375rem;background-repeat:repeat-y;background-position:center}.mlv-split-pane__handle-grip--horizontal{height:.1875rem;width:1.25rem;background-image:radial-gradient(circle,var(--mlv-background-accent-1) 1.5px,transparent 1.5px);background-size:.375rem .1875rem;background-repeat:repeat-x;background-position:center}@media(prefers-reduced-motion:reduce){.mlv-split-pane,.mlv-split-pane *,.mlv-split-pane:before,.mlv-split-pane:after,[class^=mlv-split-pane__],[class*=\" mlv-split-pane__\"],[class^=mlv-split-pane--],[class*=\" mlv-split-pane--\"]{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:var(--mlv-duration-instant)!important}}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvSplitPane, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-split-pane', template: `<ng-content />`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'mlv-split-pane',
+                        '[class.mlv-split-pane--horizontal]': 'orientation() === "horizontal"',
+                        '[class.mlv-split-pane--vertical]': 'orientation() === "vertical"',
+                        '[class.mlv-split-pane--dragging]': '_isDragging()',
+                    }, styles: ["@layer mlv.components{.mlv-split-pane{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-split-pane *{box-sizing:border-box}.mlv-split-pane{display:grid;width:100%;height:100%}.mlv-split-pane--horizontal{grid-template-rows:1fr}.mlv-split-pane--horizontal .mlv-split-pane__handle{width:.125rem;height:100%;cursor:col-resize}.mlv-split-pane--horizontal .mlv-split-pane__handle:before{width:1.5rem;height:100%;inset-inline-start:-.6875rem;top:0;cursor:col-resize}.mlv-split-pane--horizontal .mlv-split-pane__handle .mlv-split-pane__handle-grip--vertical{display:flex}.mlv-split-pane--horizontal .mlv-split-pane__handle .mlv-split-pane__handle-grip--horizontal{display:none}.mlv-split-pane--vertical{grid-template-columns:1fr}.mlv-split-pane--vertical .mlv-split-pane__handle{width:100%;height:.125rem;cursor:row-resize}.mlv-split-pane--vertical .mlv-split-pane__handle:before{height:1.5rem;width:100%;top:-.6875rem;inset-inline-start:0;cursor:row-resize}.mlv-split-pane--vertical .mlv-split-pane__handle .mlv-split-pane__handle-grip--horizontal{display:flex}.mlv-split-pane--vertical .mlv-split-pane__handle .mlv-split-pane__handle-grip--vertical{display:none}.mlv-split-pane__panel{min-width:0;min-height:0;overflow:hidden;position:relative}.mlv-split-pane__handle{display:flex;align-items:center;justify-content:center;touch-action:none;background:linear-gradient(to bottom,transparent,var(--mlv-border-subtle) 20%,var(--mlv-border-normal) 50%,var(--mlv-border-subtle) 80%,transparent);transition:background var(--mlv-duration-normal) var(--mlv-ease-out);-webkit-user-select:none;user-select:none;outline:none;position:relative;z-index:1}.mlv-split-pane__handle:before{content:\"\";position:absolute;display:block}.mlv-split-pane__handle:hover,.mlv-split-pane--dragging .mlv-split-pane__handle{background:color-mix(in srgb,var(--mlv-background-accent-1) 20%,transparent)}.mlv-split-pane__handle:focus-visible{outline:var(--mlv-stroke-width-medium) solid var(--mlv-border-focus);outline-offset:var(--mlv-focus-ring-offset);background:color-mix(in srgb,var(--mlv-background-accent-1) 20%,transparent)}.mlv-split-pane__handle-grip{align-items:center;justify-content:center;pointer-events:none;opacity:0;transition:opacity var(--mlv-duration-normal) var(--mlv-ease-out);z-index:1;position:relative}.mlv-split-pane__handle:hover .mlv-split-pane__handle-grip,.mlv-split-pane--dragging .mlv-split-pane__handle .mlv-split-pane__handle-grip{opacity:1}.mlv-split-pane__handle:focus-visible .mlv-split-pane__handle-grip{opacity:1}.mlv-split-pane__handle-grip--vertical{width:.1875rem;height:1.25rem;background-image:radial-gradient(circle,var(--mlv-background-accent-1) 1.5px,transparent 1.5px);background-size:.1875rem .375rem;background-repeat:repeat-y;background-position:center}.mlv-split-pane__handle-grip--horizontal{height:.1875rem;width:1.25rem;background-image:radial-gradient(circle,var(--mlv-background-accent-1) 1.5px,transparent 1.5px);background-size:.375rem .1875rem;background-repeat:repeat-x;background-position:center}@media(prefers-reduced-motion:reduce){.mlv-split-pane,.mlv-split-pane *,.mlv-split-pane:before,.mlv-split-pane:after,[class^=mlv-split-pane__],[class*=\" mlv-split-pane__\"],[class^=mlv-split-pane--],[class*=\" mlv-split-pane--\"]{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:var(--mlv-duration-instant)!important}}}\n"] }]
+        }], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], _panels: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => MlvSplitPanePanel), { isSignal: true }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MlvSplitPane, MlvSplitPanePanel };
+//# sourceMappingURL=malva-ui-core-split-pane.mjs.map

package/fesm2022/malva-ui-core-split-pane.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-split-pane.mjs","sources":["../../../../libs/core/split-pane/src/lib/split-pane/split-pane-panel.ts","../../../../libs/core/split-pane/src/lib/split-pane/split-pane.ts","../../../../libs/core/split-pane/src/malva-ui-core-split-pane.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  inject,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\n\n/**\n * Individual panel inside a `mlv-split-pane`.\n *\n * Panels are placed side-by-side (horizontal) or stacked (vertical) with a\n * draggable handle between each pair. The parent component manages all sizes\n * and inserts the handles automatically.\n *\n * @example\n * ```html\n * <mlv-split-pane>\n *   <mlv-split-pane-panel [size]=\"30\">Sidebar</mlv-split-pane-panel>\n *   <mlv-split-pane-panel>Main content</mlv-split-pane-panel>\n * </mlv-split-pane>\n * ```\n */\n@Component({\n  selector: 'mlv-split-pane-panel',\n  template: `<ng-content />`,\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'mlv-split-pane__panel',\n  },\n})\nexport class MlvSplitPanePanel {\n  /** @internal Direct reference to the host element, used by the parent for DOM measurement. */\n  readonly _elementRef = inject(ElementRef<HTMLElement>);\n\n  /**\n   * Initial size of this panel as a percentage of the container.\n   * When omitted the panel shares the remaining space equally with other unsized panels.\n   */\n  readonly size = input<number | undefined>(undefined);\n\n  /**\n   * Minimum size of this panel as a percentage.\n   * Drag and keyboard resize will not reduce this panel below this value.\n   * Defaults to `5`.\n   */\n  readonly minSize = input(5);\n}\n","import {\n  type AfterContentInit,\n  ChangeDetectionStrategy,\n  Component,\n  contentChildren,\n  DestroyRef,\n  ElementRef,\n  inject,\n  input,\n  NgZone,\n  Renderer2,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { filter, fromEvent, map, switchMap, tap, takeUntil } from 'rxjs';\nimport { LEFT_ARROW, RIGHT_ARROW, UP_ARROW, DOWN_ARROW } from '@angular/cdk/keycodes';\nimport { MlvRtlService, clamp } from '@malva-ui/cdk/utils';\nimport type { MlvSplitPaneOrientation } from './split-pane.types';\nimport { MlvSplitPanePanel } from './split-pane-panel';\n\n/**\n * Split pane container that divides space into two or more resizable panels.\n *\n * Panels are declared as `<mlv-split-pane-panel>` children. The component\n * automatically inserts a drag handle between each adjacent pair. Sizes are\n * managed via CSS `grid-template-columns` (horizontal) or\n * `grid-template-rows` (vertical), ensuring the DOM always reflects the true\n * rendered widths/heights.\n *\n * @example Basic 2-panel\n * ```html\n * <mlv-split-pane style=\"height: 300px;\">\n *   <mlv-split-pane-panel [size]=\"30\">Sidebar</mlv-split-pane-panel>\n *   <mlv-split-pane-panel>Main</mlv-split-pane-panel>\n * </mlv-split-pane>\n * ```\n *\n * @example 3-panel\n * ```html\n * <mlv-split-pane style=\"height: 300px;\">\n *   <mlv-split-pane-panel [size]=\"20\">Nav</mlv-split-pane-panel>\n *   <mlv-split-pane-panel>Editor</mlv-split-pane-panel>\n *   <mlv-split-pane-panel [size]=\"25\">Properties</mlv-split-pane-panel>\n * </mlv-split-pane>\n * ```\n */\n@Component({\n  selector: 'mlv-split-pane',\n  template: `<ng-content />`,\n  styleUrl: './split-pane.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'mlv-split-pane',\n    '[class.mlv-split-pane--horizontal]': 'orientation() === \"horizontal\"',\n    '[class.mlv-split-pane--vertical]': 'orientation() === \"vertical\"',\n    '[class.mlv-split-pane--dragging]': '_isDragging()',\n  },\n})\nexport class MlvSplitPane implements AfterContentInit {\n  /**\n   * Orientation of the split. `'horizontal'` places panels side-by-side;\n   * `'vertical'` stacks them top to bottom.\n   */\n  readonly orientation = input<MlvSplitPaneOrientation>('horizontal');\n\n  /** @protected Whether a drag is currently in progress. Drives the `--dragging` modifier class. */\n  protected readonly _isDragging = signal(false);\n\n  /** @private Queried panel children. */\n  private readonly _panels = contentChildren(MlvSplitPanePanel);\n\n  /** @private Current sizes of each panel in `fr` units (≈ percentage). */\n  private readonly _sizes = signal<number[]>([]);\n\n  /**\n   * @private Latest sizes produced during an active pointer drag. The drag\n   * stream runs outside Angular and mutates the grid template imperatively; this\n   * buffer holds the running value so it can be committed to the `_sizes` signal\n   * exactly once, on pointerup, inside the zone.\n   */\n  private _dragSizes: number[] | null = null;\n\n  /** @private The inserted drag-handle elements, indexed by the pair they split. */\n  private readonly _handles: HTMLElement[] = [];\n\n  /** @private Host element reference. */\n  private readonly _elementRef = inject(ElementRef<HTMLElement>);\n\n  /** @private Angular Renderer2 for all DOM mutations. */\n  private readonly _renderer = inject(Renderer2);\n\n  /** @private DestroyRef for observable cleanup. */\n  private readonly _destroyRef = inject(DestroyRef);\n\n  /** @private Angular zone — the drag stream runs outside it to avoid a change-detection pass per pointermove. */\n  private readonly _ngZone = inject(NgZone);\n  private readonly _rtlService = inject(MlvRtlService);\n\n  /**\n   * @private Effective direction of this split pane, tracking the global\n   * direction and any `[dir]` scope above the host. Mirrors drag geometry:\n   * panel[0] is the inline-first panel, which sits on the right in RTL.\n   */\n  private readonly _direction = this._rtlService.elementDirection(\n    this._elementRef,\n  );\n\n  ngAfterContentInit(): void {\n    const panels = this._panels();\n    if (panels.length < 2) return;\n\n    const sizes = this._computeInitialSizes(panels);\n    this._sizes.set(sizes);\n    this._applyGridTemplate(sizes);\n\n    // Insert a drag handle between each adjacent pair of panels.\n    panels.forEach((panel, i) => {\n      if (i >= panels.length - 1) return;\n      const handle = this._createHandle(i);\n      this._handles[i] = handle;\n      this._renderer.insertBefore(\n        this._elementRef.nativeElement,\n        handle,\n        panel._elementRef.nativeElement.nextSibling,\n      );\n      this._initDragForHandle(handle, i);\n    });\n\n    // Handles exist now — publish their initial ARIA window-splitter values.\n    this._updateHandleAria(sizes);\n  }\n\n  /**\n   * @private Calculates the initial size for each panel.\n   * Panels with an explicit `size` input use that value.\n   * Panels without one share the remaining percentage equally.\n   */\n  private _computeInitialSizes(panels: readonly MlvSplitPanePanel[]): number[] {\n    const explicit = panels.map((p) => p.size());\n    const fixedTotal = explicit.reduce<number>((sum, s) => sum + (s ?? 0), 0);\n    const autoCount = explicit.filter((s) => s === undefined).length;\n    const autoSize = autoCount > 0 ? (100 - fixedTotal) / autoCount : 0;\n    return explicit.map((s) => s ?? autoSize);\n  }\n\n  /**\n   * @private Updates `grid-template-columns` (horizontal) or `grid-template-rows`\n   * (vertical) so each panel occupies its current `fr` share. Handles always\n   * occupy a fixed `0.125rem` track, so they never eat into panel space.\n   */\n  private _applyGridTemplate(sizes: number[]): void {\n    const isHorizontal = this.orientation() === 'horizontal';\n    const tracks: string[] = [];\n    sizes.forEach((size, i) => {\n      tracks.push(`${size}fr`);\n      if (i < sizes.length - 1) tracks.push('0.125rem');\n    });\n    const prop = isHorizontal ? 'grid-template-columns' : 'grid-template-rows';\n    this._renderer.setStyle(\n      this._elementRef.nativeElement,\n      prop,\n      tracks.join(' '),\n    );\n    // Keep each separator's ARIA value in sync with the rendered sizes.\n    this._updateHandleAria(sizes);\n  }\n\n  /**\n   * @private Syncs the ARIA window-splitter values on every drag handle.\n   * A focusable `role=\"separator\"` is a window splitter and therefore requires\n   * `aria-valuenow` (with `aria-valuemin`/`aria-valuemax`). `aria-valuenow`\n   * tracks the leading panel's size (%), bounded by the two adjacent panels'\n   * `minSize` values.\n   */\n  private _updateHandleAria(sizes: number[]): void {\n    const panels = this._panels();\n    this._handles.forEach((handle, i) => {\n      if (!handle) return;\n      const leadMin = panels[i]?.minSize() ?? 0;\n      const trailMin = panels[i + 1]?.minSize() ?? 0;\n      this._renderer.setAttribute(\n        handle,\n        'aria-valuenow',\n        String(Math.round(sizes[i] ?? 0)),\n      );\n      this._renderer.setAttribute(\n        handle,\n        'aria-valuemin',\n        String(Math.round(leadMin)),\n      );\n      this._renderer.setAttribute(\n        handle,\n        'aria-valuemax',\n        String(Math.round(100 - trailMin)),\n      );\n    });\n  }\n\n  /**\n   * @private Creates and returns a drag handle DOM element for the given handle index.\n   * The grip visual is drawn entirely with CSS — no Angular directives required.\n   */\n  private _createHandle(handleIndex: number): HTMLElement {\n    const isHorizontal = this.orientation() === 'horizontal';\n    const handle = this._renderer.createElement('div') as HTMLElement;\n    this._renderer.addClass(handle, 'mlv-split-pane__handle');\n    this._renderer.setAttribute(handle, 'role', 'separator');\n    this._renderer.setAttribute(handle, 'tabindex', '0');\n    this._renderer.setAttribute(\n      handle,\n      'aria-label',\n      isHorizontal ? 'Resize panels horizontally' : 'Resize panels vertically',\n    );\n    this._renderer.setAttribute(\n      handle,\n      'aria-orientation',\n      isHorizontal ? 'vertical' : 'horizontal',\n    );\n\n    const grip = this._renderer.createElement('span') as HTMLElement;\n    this._renderer.addClass(grip, 'mlv-split-pane__handle-grip');\n    this._renderer.addClass(\n      grip,\n      isHorizontal\n        ? 'mlv-split-pane__handle-grip--vertical'\n        : 'mlv-split-pane__handle-grip--horizontal',\n    );\n    this._renderer.setAttribute(grip, 'aria-hidden', 'true');\n    this._renderer.appendChild(handle, grip);\n\n    const dispose = this._renderer.listen(\n      handle,\n      'keydown',\n      (e: KeyboardEvent) => {\n        this._onHandleKeydown(e, handleIndex);\n      },\n    );\n    // Renderer2.listen returns a disposer — register it so the keydown\n    // listener does not outlive this component instance.\n    this._destroyRef.onDestroy(dispose);\n\n    return handle;\n  }\n\n  /**\n   * @private Wires pointer-capture drag behavior for a single handle.\n   * Only the two panels adjacent to the handle change size during drag;\n   * all other panels remain fixed.\n   */\n  private _initDragForHandle(handleEl: HTMLElement, handleIndex: number): void {\n    const containerEl = this._elementRef.nativeElement as HTMLElement;\n    const isHorizontal = () => this.orientation() === 'horizontal';\n\n    // The drag stream runs OUTSIDE Angular: each pointermove writes the grid\n    // template imperatively (Renderer2) and never touches a signal, so a fast\n    // drag no longer schedules an OnPush change-detection pass per move. Only\n    // the `_isDragging` host-class flag and the single final `_sizes` commit\n    // re-enter the zone. Split-pane exposes no per-move output, so there is no\n    // emission-timing contract to preserve.\n    this._ngZone.runOutsideAngular(() => {\n      fromEvent<PointerEvent>(handleEl, 'pointerdown')\n        .pipe(\n          takeUntilDestroyed(this._destroyRef),\n          filter((e) => e.button === 0),\n          switchMap((startEvent: PointerEvent) => {\n            startEvent.preventDefault();\n            handleEl.setPointerCapture(startEvent.pointerId);\n\n            const containerRect = containerEl.getBoundingClientRect();\n            const containerSize = isHorizontal()\n              ? containerRect.width\n              : containerRect.height;\n            const resizeCursor = isHorizontal() ? 'col-resize' : 'row-resize';\n\n            // `_isDragging` drives a host-class binding — flip it in the zone.\n            this._ngZone.run(() => this._isDragging.set(true));\n            this._renderer.setStyle(\n              document.documentElement,\n              'cursor',\n              resizeCursor,\n            );\n            this._renderer.setStyle(\n              document.documentElement,\n              'user-select',\n              'none',\n            );\n\n            const panels = this._panels();\n            const panelI = panels[handleIndex];\n            const panelI1 = panels[handleIndex + 1];\n            const sizes = [...this._sizes()];\n            const pairTotal = sizes[handleIndex] + sizes[handleIndex + 1];\n            // Seed the drag buffer so a press/release with no move still commits\n            // a well-defined (unchanged) size array on pointerup.\n            this._dragSizes = sizes;\n\n            // Capture panel[i]'s start position in the viewport at drag start.\n            // Since only panel[i] and panel[i+1] will change, all panels before [i]\n            // remain fixed, so this reference stays valid throughout the drag.\n            const panelIEl = panelI._elementRef.nativeElement;\n            const panelIRect = panelIEl.getBoundingClientRect();\n            // Panel[i]'s inline-start edge is its right edge in RTL, and the\n            // pointer then travels away from it as the panel grows.\n            const mirrored = isHorizontal() && this._direction() === 'rtl';\n            const panelIStart = isHorizontal()\n              ? mirrored\n                ? panelIRect.right\n                : panelIRect.left\n              : panelIRect.top;\n\n            return fromEvent<PointerEvent>(handleEl, 'pointermove').pipe(\n              takeUntil(\n                fromEvent<PointerEvent>(handleEl, 'pointerup').pipe(\n                  tap(() => {\n                    this._renderer.removeStyle(\n                      document.documentElement,\n                      'cursor',\n                    );\n                    this._renderer.removeStyle(\n                      document.documentElement,\n                      'user-select',\n                    );\n                    // Commit the final sizes + clear dragging once, in the zone,\n                    // so OnPush change detection runs a single time per drag.\n                    this._ngZone.run(() => {\n                      this._isDragging.set(false);\n                      if (this._dragSizes) this._sizes.set(this._dragSizes);\n                    });\n                  }),\n                ),\n              ),\n              map((moveEvent: PointerEvent) => {\n                const pointerPos = isHorizontal()\n                  ? moveEvent.clientX\n                  : moveEvent.clientY;\n                // Pixel distance from panel[i]'s inline-start edge to the pointer\n                const newPanelI_px = mirrored\n                  ? panelIStart - pointerPos\n                  : pointerPos - panelIStart;\n                // Convert to the same fr-unit space (fr ≈ % of container)\n                const newPanelI_fr = (newPanelI_px / containerSize) * 100;\n                // Clamp: both adjacent panels must respect their minSize\n                const minI = panelI.minSize();\n                const minI1 = panelI1.minSize();\n                const clampedI = clamp(newPanelI_fr, minI, pairTotal - minI1);\n\n                const newSizes = [...this._sizes()];\n                newSizes[handleIndex] = clampedI;\n                newSizes[handleIndex + 1] = pairTotal - clampedI;\n                return newSizes;\n              }),\n            );\n          }),\n        )\n        .subscribe((sizes) => {\n          // Per move (outside the zone): buffer the value and apply the grid\n          // template imperatively — no signal writes, so no CD pass.\n          this._dragSizes = sizes;\n          this._applyGridTemplate(sizes);\n        });\n    });\n  }\n\n  /**\n   * @protected Keyboard handler on each dynamically created handle.\n   * Arrow keys move by 1%, Home/End jump to the adjacent panel's minSize.\n   */\n  private _onHandleKeydown(event: KeyboardEvent, handleIndex: number): void {\n    const isHorizontal = this.orientation() === 'horizontal';\n    const key = this._rtlService.normalizeArrowKey(event);\n    const shouldDecrease =\n      (isHorizontal && key === LEFT_ARROW) ||\n      (!isHorizontal && key === UP_ARROW);\n    const shouldIncrease =\n      (isHorizontal && key === RIGHT_ARROW) ||\n      (!isHorizontal && key === DOWN_ARROW);\n\n    if (\n      !shouldDecrease &&\n      !shouldIncrease &&\n      event.key !== 'Home' &&\n      event.key !== 'End'\n    )\n      return;\n    event.preventDefault();\n\n    const panels = this._panels();\n    const sizes = [...this._sizes()];\n    const pairTotal = sizes[handleIndex] + sizes[handleIndex + 1];\n    const minI = panels[handleIndex].minSize();\n    const minI1 = panels[handleIndex + 1].minSize();\n\n    let newI: number;\n    if (event.key === 'Home') {\n      newI = minI;\n    } else if (event.key === 'End') {\n      newI = pairTotal - minI1;\n    } else {\n      newI = sizes[handleIndex] + (shouldDecrease ? -1 : 1);\n    }\n\n    newI = clamp(newI, minI, pairTotal - minI1);\n    sizes[handleIndex] = newI;\n    sizes[handleIndex + 1] = pairTotal - newI;\n    this._sizes.set(sizes);\n    this._applyGridTemplate(sizes);\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/malva-ui-core-status-indicator.mjs

@@ -0,0 +1,78 @@
+import * as i0 from '@angular/core';
+import { input, computed, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+
+/**
+ * Small circular status dot for conveying presence, health, or state (online,
+ * busy, error, …). Renders a `0.5rem` (8px) coloured dot using the same
+ * semantic {@link MlvStatusIndicatorTone} vocabulary as `mlv-badge` / `mlv-chip`,
+ * with an optional infinite ripple pulse.
+ *
+ * Decorative by default (`aria-hidden`); provide {@link MlvStatusIndicator.ariaLabel}
+ * to expose an accessible name (`role="img"`) when the dot carries meaning that
+ * is not conveyed by adjacent text.
+ *
+ * @example
+ * ```html
+ * <mlv-status-indicator tone="success" pulse />
+ * <mlv-status-indicator tone="danger" ariaLabel="Offline" />
+ * <span><mlv-status-indicator tone="warning" /> Degraded</span>
+ * ```
+ */
+class MlvStatusIndicator {
+    /**
+     * The semantic tone of the dot, mapped to a solid fill colour token.
+     * Defaults to `'default'` (neutral grey).
+     */
+    tone = input('default', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
+    /**
+     * When `true`, an expanding ripple ring animates outward from the dot on an
+     * infinite loop to draw attention (e.g. "live"/"recording" states).
+     * Respects `prefers-reduced-motion: reduce`, which suppresses the ripple.
+     * Supports attribute usage: `<mlv-status-indicator pulse>`.
+     */
+    pulse = input(false, { ...(ngDevMode ? { debugName: "pulse" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * Diameter of the dot in pixels. Defaults to `8` (`0.5rem`), matching the
+     * design spec. Converted to `rem` internally so the dot scales with the
+     * user's root font-size. Overridable per-instance (e.g. `[size]="4"`).
+     */
+    size = input(8, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /**
+     * Optional accessible name. When set, the dot is exposed to assistive
+     * technology as `role="img"` with this label; when omitted, the dot is purely
+     * decorative (`aria-hidden`) on the assumption that adjacent text conveys the
+     * status. Use this only when the colour/pulse is the sole carrier of meaning.
+     */
+    ariaLabel = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * @protected Dot size expressed in `rem` for the `--mlv-status-indicator-size`
+     * custom property (keeps the value scalable rather than binding raw px).
+     */
+    _sizeVar = computed(() => `${this.size() / 16}rem`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_sizeVar" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvStatusIndicator, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: MlvStatusIndicator, isStandalone: true, selector: "mlv-status-indicator", inputs: { tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, pulse: { classPropertyName: "pulse", publicName: "pulse", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "\"mlv-status-indicator--tone-\" + tone()", "class.mlv-status-indicator--pulse": "pulse()", "style.--mlv-status-indicator-size": "_sizeVar()", "attr.role": "ariaLabel() ? \"img\" : null", "attr.aria-label": "ariaLabel() || null", "attr.aria-hidden": "ariaLabel() ? null : \"true\"" }, classAttribute: "mlv-status-indicator" }, ngImport: i0, template: '', isInline: true, styles: ["@layer mlv.components{.mlv-status-indicator{--mlv-status-indicator-size: .5rem;--mlv-status-indicator-color: var(--mlv-text-secondary);box-sizing:border-box;display:inline-block;flex:none;position:relative;inline-size:var(--mlv-status-indicator-size);block-size:var(--mlv-status-indicator-size);border-radius:var(--mlv-radius-full);background-color:var(--mlv-status-indicator-color);vertical-align:middle}.mlv-status-indicator--tone-default{--mlv-status-indicator-color: var(--mlv-text-secondary)}.mlv-status-indicator--tone-primary{--mlv-status-indicator-color: var(--mlv-background-accent-1)}.mlv-status-indicator--tone-secondary{--mlv-status-indicator-color: var(--mlv-text-action)}.mlv-status-indicator--tone-accent{--mlv-status-indicator-color: var(--mlv-background-accent-2)}.mlv-status-indicator--tone-success{--mlv-status-indicator-color: var(--mlv-background-success-1)}.mlv-status-indicator--tone-info{--mlv-status-indicator-color: var(--mlv-background-info-1)}.mlv-status-indicator--tone-warning{--mlv-status-indicator-color: var(--mlv-background-warning-1)}.mlv-status-indicator--tone-danger{--mlv-status-indicator-color: var(--mlv-background-danger-1)}.mlv-status-indicator--pulse:after{content:\"\";position:absolute;inset:0;border-radius:inherit;background-color:var(--mlv-status-indicator-color);transform-origin:center;animation:mlv-status-indicator-ripple 2s var(--mlv-ease-out) infinite;pointer-events:none}@media(prefers-reduced-motion:reduce){.mlv-status-indicator--pulse:after{animation:none;display:none}}@keyframes mlv-status-indicator-ripple{0%{transform:scale(1);opacity:.6}to{transform:scale(3);opacity:0}}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvStatusIndicator, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-status-indicator', template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'mlv-status-indicator',
+                        '[class]': '"mlv-status-indicator--tone-" + tone()',
+                        '[class.mlv-status-indicator--pulse]': 'pulse()',
+                        '[style.--mlv-status-indicator-size]': '_sizeVar()',
+                        '[attr.role]': 'ariaLabel() ? "img" : null',
+                        '[attr.aria-label]': 'ariaLabel() || null',
+                        '[attr.aria-hidden]': 'ariaLabel() ? null : "true"',
+                    }, styles: ["@layer mlv.components{.mlv-status-indicator{--mlv-status-indicator-size: .5rem;--mlv-status-indicator-color: var(--mlv-text-secondary);box-sizing:border-box;display:inline-block;flex:none;position:relative;inline-size:var(--mlv-status-indicator-size);block-size:var(--mlv-status-indicator-size);border-radius:var(--mlv-radius-full);background-color:var(--mlv-status-indicator-color);vertical-align:middle}.mlv-status-indicator--tone-default{--mlv-status-indicator-color: var(--mlv-text-secondary)}.mlv-status-indicator--tone-primary{--mlv-status-indicator-color: var(--mlv-background-accent-1)}.mlv-status-indicator--tone-secondary{--mlv-status-indicator-color: var(--mlv-text-action)}.mlv-status-indicator--tone-accent{--mlv-status-indicator-color: var(--mlv-background-accent-2)}.mlv-status-indicator--tone-success{--mlv-status-indicator-color: var(--mlv-background-success-1)}.mlv-status-indicator--tone-info{--mlv-status-indicator-color: var(--mlv-background-info-1)}.mlv-status-indicator--tone-warning{--mlv-status-indicator-color: var(--mlv-background-warning-1)}.mlv-status-indicator--tone-danger{--mlv-status-indicator-color: var(--mlv-background-danger-1)}.mlv-status-indicator--pulse:after{content:\"\";position:absolute;inset:0;border-radius:inherit;background-color:var(--mlv-status-indicator-color);transform-origin:center;animation:mlv-status-indicator-ripple 2s var(--mlv-ease-out) infinite;pointer-events:none}@media(prefers-reduced-motion:reduce){.mlv-status-indicator--pulse:after{animation:none;display:none}}@keyframes mlv-status-indicator-ripple{0%{transform:scale(1);opacity:.6}to{transform:scale(3);opacity:0}}}\n"] }]
+        }], propDecorators: { tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], pulse: [{ type: i0.Input, args: [{ isSignal: true, alias: "pulse", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MlvStatusIndicator };
+//# sourceMappingURL=malva-ui-core-status-indicator.mjs.map