@malva-ui/core 0.1.12

package/esm2022/split-pane/lib/split-pane/split-pane-panel.js

@@ -0,0 +1,49 @@
+import { ChangeDetectionStrategy, Component, ElementRef, inject, input, ViewEncapsulation, } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * 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>
+ * ```
+ */
+export 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 }] }] } });
+//# sourceMappingURL=split-pane-panel.js.map

package/esm2022/split-pane/lib/split-pane/split-pane-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"split-pane-panel.js","sourceRoot":"","sources":["../../../../../../../libs/core/split-pane/src/lib/split-pane/split-pane-panel.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,UAAU,EACV,MAAM,EACN,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;;AAEvB;;;;;;;;;;;;;;GAcG;AAUH,MAAM,OAAO,iBAAiB;IAC5B,8FAA8F;IACrF,WAAW,GAAG,MAAM,CAAC,CAAA,UAAuB,CAAA,CAAC,CAAC;IAEvD;;;OAGG;IACM,IAAI,GAAG,KAAK,CAAqB,SAAS;6EAAC,CAAC;IAErD;;;;OAIG;IACM,OAAO,GAAG,KAAK,CAAC,CAAC;gFAAC,CAAC;uGAfjB,iBAAiB;2FAAjB,iBAAiB,kYAPlB,gBAAgB;;2FAOf,iBAAiB;kBAT7B,SAAS;mBAAC;oBACT,QAAQ,EAAE,sBAAsB;oBAChC,QAAQ,EAAE,gBAAgB;oBAC1B,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,IAAI,EAAE;wBACJ,KAAK,EAAE,uBAAuB;qBAC/B;iBACF","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"]}

package/esm2022/split-pane/lib/split-pane/split-pane.js

@@ -0,0 +1,290 @@
+import { ChangeDetectionStrategy, Component, contentChildren, DestroyRef, ElementRef, inject, input, NgZone, Renderer2, signal, ViewEncapsulation, } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { filter, fromEvent, map, switchMap, tap, takeUntil } from 'rxjs';
+import { clamp } from '@malva-ui/cdk/utils';
+import { MlvSplitPanePanel } from './split-pane-panel';
+import * as i0 from "@angular/core";
+/**
+ * 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>
+ * ```
+ */
+export 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);
+    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();
+                const panelIStart = isHorizontal()
+                    ? 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 start edge to the pointer
+                    const newPanelI_px = 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 shouldDecrease = (isHorizontal && event.key === 'ArrowLeft') ||
+            (!isHorizontal && event.key === 'ArrowUp');
+        const shouldIncrease = (isHorizontal && event.key === 'ArrowRight') ||
+            (!isHorizontal && event.key === 'ArrowDown');
+        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: [".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%;left:-.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;left: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) solid var(--mlv-border-focus);outline-offset:.125rem;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}\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: [".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%;left:-.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;left: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) solid var(--mlv-border-focus);outline-offset:.125rem;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}\n"] }]
+        }], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], _panels: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => MlvSplitPanePanel), { isSignal: true }] }] } });
+//# sourceMappingURL=split-pane.js.map

package/esm2022/split-pane/lib/split-pane/split-pane.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"split-pane.js","sourceRoot":"","sources":["../../../../../../../libs/core/split-pane/src/lib/split-pane/split-pane.ts"],"names":[],"mappings":"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","sourcesContent":["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 { 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\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            const panelIStart = isHorizontal()\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 start edge to the pointer\n                const newPanelI_px = 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 shouldDecrease =\n      (isHorizontal && event.key === 'ArrowLeft') ||\n      (!isHorizontal && event.key === 'ArrowUp');\n    const shouldIncrease =\n      (isHorizontal && event.key === 'ArrowRight') ||\n      (!isHorizontal && event.key === 'ArrowDown');\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"]}

package/esm2022/split-pane/lib/split-pane/split-pane.types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=split-pane.types.js.map

package/esm2022/split-pane/lib/split-pane/split-pane.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"split-pane.types.js","sourceRoot":"","sources":["../../../../../../../libs/core/split-pane/src/lib/split-pane/split-pane.types.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Orientation of the split pane.\n *\n * - `'horizontal'` — panes are side by side (left | right), drag handle is vertical\n * - `'vertical'` — panes are stacked (top | bottom), drag handle is horizontal\n */\nexport type MlvSplitPaneOrientation = 'horizontal' | 'vertical';\n"]}

package/esm2022/split-pane/malva-ui-core-split-pane.js

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=malva-ui-core-split-pane.js.map

package/esm2022/split-pane/malva-ui-core-split-pane.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-split-pane.js","sourceRoot":"","sources":["../../../../../libs/core/split-pane/src/malva-ui-core-split-pane.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,cAAc,SAAS,CAAC","sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"]}

package/esm2022/status-indicator/index.js

@@ -0,0 +1,2 @@
+export * from './lib/status-indicator/status-indicator';
+//# sourceMappingURL=index.js.map

package/esm2022/status-indicator/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/core/status-indicator/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,yCAAyC,CAAC","sourcesContent":["export * from './lib/status-indicator/status-indicator';\n"]}

package/esm2022/status-indicator/lib/status-indicator/status-indicator.js

@@ -0,0 +1,71 @@
+import { ChangeDetectionStrategy, Component, ViewEncapsulation, computed, input, } from '@angular/core';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import * as i0 from "@angular/core";
+/**
+ * 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>
+ * ```
+ */
+export 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: [".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: [".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 }] }] } });
+//# sourceMappingURL=status-indicator.js.map

package/esm2022/status-indicator/lib/status-indicator/status-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-indicator.js","sourceRoot":"","sources":["../../../../../../../libs/core/status-indicator/src/lib/status-indicator/status-indicator.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,iBAAiB,EACjB,QAAQ,EACR,KAAK,GACN,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;;AAgB9D;;;;;;;;;;;;;;;;GAgBG;AAiBH,MAAM,OAAO,kBAAkB;IAC7B;;;OAGG;IACM,IAAI,GAAG,KAAK,CAAyB,SAAS;6EAAC,CAAC;IAEzD;;;;;OAKG;IACM,KAAK,GAAG,KAAK,CAAwB,KAAK,6EACjD,SAAS,EAAE,qBAAqB,GAChC,CAAC;IAEH;;;;OAIG;IACM,IAAI,GAAG,KAAK,CAAS,CAAC;6EAAC,CAAC;IAEjC;;;;;OAKG;IACM,SAAS,GAAG,KAAK,CAAS,EAAE;kFAAC,CAAC;IAEvC;;;OAGG;IACgB,QAAQ,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK;iFAAC,CAAC;uGApC5D,kBAAkB;2FAAlB,kBAAkB,w6BAdnB,EAAE;;2FAcD,kBAAkB;kBAhB9B,SAAS;+BACE,sBAAsB,YACtB,EAAE,iBAEG,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM,QACzC;wBACJ,KAAK,EAAE,sBAAsB;wBAC7B,SAAS,EAAE,wCAAwC;wBACnD,qCAAqC,EAAE,SAAS;wBAChD,qCAAqC,EAAE,YAAY;wBACnD,aAAa,EAAE,4BAA4B;wBAC3C,mBAAmB,EAAE,qBAAqB;wBAC1C,oBAAoB,EAAE,6BAA6B;qBACpD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ViewEncapsulation,\n  computed,\n  input,\n} from '@angular/core';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport type { MlvTone } from '@malva-ui/cdk/utils';\n\n/**\n * Available tone variants for the status indicator.\n * Extends the shared {@link MlvTone} semantic vocabulary with neutral and\n * brand options — mirroring `MlvBadgeTone` / `MlvChipTone` — so a dot's colour stays\n * consistent with the badge/chip it commonly sits beside.\n */\nexport type MlvStatusIndicatorTone =\n  | MlvTone\n  | 'default'\n  | 'primary'\n  | 'secondary'\n  | 'accent';\n\n/**\n * Small circular status dot for conveying presence, health, or state (online,\n * busy, error, …). Renders a `0.5rem` (8px) coloured dot using the same\n * semantic {@link MlvStatusIndicatorTone} vocabulary as `mlv-badge` / `mlv-chip`,\n * with an optional infinite ripple pulse.\n *\n * Decorative by default (`aria-hidden`); provide {@link MlvStatusIndicator.ariaLabel}\n * to expose an accessible name (`role=\"img\"`) when the dot carries meaning that\n * is not conveyed by adjacent text.\n *\n * @example\n * ```html\n * <mlv-status-indicator tone=\"success\" pulse />\n * <mlv-status-indicator tone=\"danger\" ariaLabel=\"Offline\" />\n * <span><mlv-status-indicator tone=\"warning\" /> Degraded</span>\n * ```\n */\n@Component({\n  selector: 'mlv-status-indicator',\n  template: '',\n  styleUrl: './status-indicator.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'mlv-status-indicator',\n    '[class]': '\"mlv-status-indicator--tone-\" + tone()',\n    '[class.mlv-status-indicator--pulse]': 'pulse()',\n    '[style.--mlv-status-indicator-size]': '_sizeVar()',\n    '[attr.role]': 'ariaLabel() ? \"img\" : null',\n    '[attr.aria-label]': 'ariaLabel() || null',\n    '[attr.aria-hidden]': 'ariaLabel() ? null : \"true\"',\n  },\n})\nexport class MlvStatusIndicator {\n  /**\n   * The semantic tone of the dot, mapped to a solid fill colour token.\n   * Defaults to `'default'` (neutral grey).\n   */\n  readonly tone = input<MlvStatusIndicatorTone>('default');\n\n  /**\n   * When `true`, an expanding ripple ring animates outward from the dot on an\n   * infinite loop to draw attention (e.g. \"live\"/\"recording\" states).\n   * Respects `prefers-reduced-motion: reduce`, which suppresses the ripple.\n   * Supports attribute usage: `<mlv-status-indicator pulse>`.\n   */\n  readonly pulse = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /**\n   * Diameter of the dot in pixels. Defaults to `8` (`0.5rem`), matching the\n   * design spec. Converted to `rem` internally so the dot scales with the\n   * user's root font-size. Overridable per-instance (e.g. `[size]=\"4\"`).\n   */\n  readonly size = input<number>(8);\n\n  /**\n   * Optional accessible name. When set, the dot is exposed to assistive\n   * technology as `role=\"img\"` with this label; when omitted, the dot is purely\n   * decorative (`aria-hidden`) on the assumption that adjacent text conveys the\n   * status. Use this only when the colour/pulse is the sole carrier of meaning.\n   */\n  readonly ariaLabel = input<string>('');\n\n  /**\n   * @protected Dot size expressed in `rem` for the `--mlv-status-indicator-size`\n   * custom property (keeps the value scalable rather than binding raw px).\n   */\n  protected readonly _sizeVar = computed(() => `${this.size() / 16}rem`);\n}\n"]}

package/esm2022/status-indicator/malva-ui-core-status-indicator.js

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=malva-ui-core-status-indicator.js.map

package/esm2022/status-indicator/malva-ui-core-status-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-status-indicator.js","sourceRoot":"","sources":["../../../../../libs/core/status-indicator/src/malva-ui-core-status-indicator.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,cAAc,SAAS,CAAC","sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"]}

package/esm2022/stepper/index.js

@@ -0,0 +1,5 @@
+export * from './lib/stepper/stepper';
+export * from './lib/stepper/step';
+export * from './lib/stepper/stepper-token';
+export * from './lib/stepper/stepper.types';
+//# sourceMappingURL=index.js.map

package/esm2022/stepper/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/core/stepper/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC","sourcesContent":["export * from './lib/stepper/stepper';\nexport * from './lib/stepper/step';\nexport * from './lib/stepper/stepper-token';\nexport * from './lib/stepper/stepper.types';\n"]}

package/esm2022/stepper/lib/stepper/step-header.js

@@ -0,0 +1,46 @@
+import { Directive, ElementRef, inject, input, signal } from '@angular/core';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import * as i0 from "@angular/core";
+/**
+ * `[mlvStepHeader]` — applied to each step-header trigger element inside
+ * `mlv-stepper`. Implements {@link FocusableOption} so the parent
+ * `MlvStepper` can drive arrow-key navigation and roving tabindex via a
+ * CDK `FocusKeyManager`.
+ *
+ * @internal Not part of the public API — an implementation detail of the stepper.
+ */
+export class MlvStepHeader {
+    /** @internal Host element reference, used for focus + focused-element lookup. */
+    elementRef = inject((ElementRef));
+    /**
+     * Whether this step header is non-interactive (e.g. a not-yet-reachable step
+     * in linear mode). Disabled headers are skipped by the FocusKeyManager and
+     * removed from the roving tab order.
+     */
+    isDisabled = input(false, { ...(ngDevMode ? { debugName: "isDisabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * @internal Roving tabindex value managed by the parent FocusKeyManager.
+     * `0` for the currently focused header, `-1` for all others. Bound to the
+     * host element's `tabindex` attribute in the stepper template.
+     */
+    tabIndex = signal(-1, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tabIndex" }] : /* istanbul ignore next */ []));
+    /** FocusableOption — whether this header is skipped by the FocusKeyManager. */
+    get disabled() {
+        return this.isDisabled();
+    }
+    /** FocusableOption — programmatically focuses this step header. */
+    focus() {
+        this.elementRef.nativeElement.focus();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvStepHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: MlvStepHeader, isStandalone: true, selector: "[mlvStepHeader]", inputs: { isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["mlvStepHeader"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvStepHeader, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mlvStepHeader]',
+                    exportAs: 'mlvStepHeader',
+                }]
+        }], propDecorators: { isDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabled", required: false }] }] } });
+//# sourceMappingURL=step-header.js.map

package/esm2022/stepper/lib/stepper/step-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"step-header.js","sourceRoot":"","sources":["../../../../../../../libs/core/stepper/src/lib/stepper/step-header.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAG7E,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;;AAE9D;;;;;;;GAOG;AAKH,MAAM,OAAO,aAAa;IACxB,iFAAiF;IACxE,UAAU,GAAG,MAAM,CAAC,CAAA,UAAuB,CAAA,CAAC,CAAC;IAEtD;;;;OAIG;IACM,UAAU,GAAG,KAAK,CAAwB,KAAK,kFACtD,SAAS,EAAE,qBAAqB,GAChC,CAAC;IAEH;;;;OAIG;IACM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC;iFAAC,CAAC;IAE/B,+EAA+E;IAC/E,IAAI,QAAQ;QACV,OAAO,IAAI,CAAC,UAAU,EAAE,CAAC;IAC3B,CAAC;IAED,mEAAmE;IACnE,KAAK;QACH,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;IACxC,CAAC;uGA5BU,aAAa;2FAAb,aAAa;;2FAAb,aAAa;kBAJzB,SAAS;mBAAC;oBACT,QAAQ,EAAE,iBAAiB;oBAC3B,QAAQ,EAAE,eAAe;iBAC1B","sourcesContent":["import { Directive, ElementRef, inject, input, signal } from '@angular/core';\nimport type { FocusableOption } from '@angular/cdk/a11y';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\n\n/**\n * `[mlvStepHeader]` — applied to each step-header trigger element inside\n * `mlv-stepper`. Implements {@link FocusableOption} so the parent\n * `MlvStepper` can drive arrow-key navigation and roving tabindex via a\n * CDK `FocusKeyManager`.\n *\n * @internal Not part of the public API — an implementation detail of the stepper.\n */\n@Directive({\n  selector: '[mlvStepHeader]',\n  exportAs: 'mlvStepHeader',\n})\nexport class MlvStepHeader implements FocusableOption {\n  /** @internal Host element reference, used for focus + focused-element lookup. */\n  readonly elementRef = inject(ElementRef<HTMLElement>);\n\n  /**\n   * Whether this step header is non-interactive (e.g. a not-yet-reachable step\n   * in linear mode). Disabled headers are skipped by the FocusKeyManager and\n   * removed from the roving tab order.\n   */\n  readonly isDisabled = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /**\n   * @internal Roving tabindex value managed by the parent FocusKeyManager.\n   * `0` for the currently focused header, `-1` for all others. Bound to the\n   * host element's `tabindex` attribute in the stepper template.\n   */\n  readonly tabIndex = signal(-1);\n\n  /** FocusableOption — whether this header is skipped by the FocusKeyManager. */\n  get disabled(): boolean {\n    return this.isDisabled();\n  }\n\n  /** FocusableOption — programmatically focuses this step header. */\n  focus(): void {\n    this.elementRef.nativeElement.focus();\n  }\n}\n"]}