@malva-ui/core 0.1.13 → 0.1.14

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

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-status-indicator.mjs","sources":["../../../../libs/core/status-indicator/src/lib/status-indicator/status-indicator.ts","../../../../libs/core/status-indicator/src/malva-ui-core-status-indicator.ts"],"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","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAwBA;;;;;;;;;;;;;;;;AAgBG;MAiBU,kBAAkB,CAAA;AAC7B;;;AAGG;IACM,IAAI,GAAG,KAAK,CAAyB,SAAS;6EAAC;AAExD;;;;;AAKG;IACM,KAAK,GAAG,KAAK,CAAwB,KAAK,6EACjD,SAAS,EAAE,qBAAqB,EAAA,CAChC;AAEF;;;;AAIG;IACM,IAAI,GAAG,KAAK,CAAS,CAAC;6EAAC;AAEhC;;;;;AAKG;IACM,SAAS,GAAG,KAAK,CAAS,EAAE;kFAAC;AAEtC;;;AAGG;AACgB,IAAA,QAAQ,GAAG,QAAQ,CAAC,MAAM,CAAA,EAAG,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,CAAA,GAAA,CAAK;iFAAC;uGApC3D,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,kBAAkB,w6BAdnB,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,smDAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAcD,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAhB9B,SAAS;+BACE,sBAAsB,EAAA,QAAA,EACtB,EAAE,EAAA,aAAA,EAEG,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,KAAK,EAAE,sBAAsB;AAC7B,wBAAA,SAAS,EAAE,wCAAwC;AACnD,wBAAA,qCAAqC,EAAE,SAAS;AAChD,wBAAA,qCAAqC,EAAE,YAAY;AACnD,wBAAA,aAAa,EAAE,4BAA4B;AAC3C,wBAAA,mBAAmB,EAAE,qBAAqB;AAC1C,wBAAA,oBAAoB,EAAE,6BAA6B;AACpD,qBAAA,EAAA,MAAA,EAAA,CAAA,smDAAA,CAAA,EAAA;;;ACvDH;;AAEG;;;;"}

package/fesm2022/malva-ui-core-stepper.mjs

@@ -0,0 +1,332 @@
+import * as i0 from '@angular/core';
+import { input, viewChild, ChangeDetectionStrategy, ViewEncapsulation, Component, inject, ElementRef, signal, Directive, InjectionToken, DestroyRef, output, contentChildren, computed, viewChildren, effect, untracked } from '@angular/core';
+import { NgTemplateOutlet } from '@angular/common';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import { FocusKeyManager } from '@angular/cdk/a11y';
+import { MlvRtlService } from '@malva-ui/cdk/utils';
+import { MLV_STEPPER_I18N } from '@malva-ui/i18n';
+
+/**
+ * `mlv-step` — a step definition component. Declare steps as children of
+ * `mlv-stepper`. The stepper renders the headers and content panels itself;
+ * the projected content of each `<mlv-step>` is shown in the active panel.
+ */
+class MlvStep {
+    /**
+     * Step label displayed in the step header.
+     */
+    label = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /**
+     * Optional descriptive sub-label shown below the main label.
+     */
+    description = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
+    /**
+     * Explicit state override. When provided, takes precedence over the derived
+     * state from the stepper's `activeIndex`.
+     */
+    state = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+    /**
+     * When `true`, this step is optional and can be skipped even in linear mode.
+     */
+    optional = input(false, { ...(ngDevMode ? { debugName: "optional" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * When `true`, this step represents an alternative/deviative path.
+     * The connector after this step is rendered with a dashed warning-color border,
+     * and the indicator receives a visual warning badge overlay.
+     */
+    deviative = input(false, { ...(ngDevMode ? { debugName: "deviative" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * When `true`, marks this deviative step's deviation as resolved.
+     * The connector AFTER this step reverts to the normal (solid, neutral) style
+     * instead of dashed/warning. Has no visual effect unless `deviative` is also true.
+     * When the user returns to this step and `deviationResolved` becomes false again,
+     * the connector reverts to the dashed/warning style.
+     */
+    deviationResolved = input(false, { ...(ngDevMode ? { debugName: "deviationResolved" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * 0-based index assigned by the parent `MlvStepper` after content init.
+     * @internal
+     */
+    _index = 0;
+    /** @internal Template reference holding this step's projected content. */
+    contentTpl = viewChild.required('contentTpl', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "contentTpl" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvStep, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.7", type: MlvStep, isStandalone: true, selector: "mlv-step", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, deviative: { classPropertyName: "deviative", publicName: "deviative", isSignal: true, isRequired: false, transformFunction: null }, deviationResolved: { classPropertyName: "deviationResolved", publicName: "deviationResolved", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "mlv-step" }, viewQueries: [{ propertyName: "contentTpl", first: true, predicate: ["contentTpl"], descendants: true, isSignal: true }], ngImport: i0, template: `<ng-template #contentTpl><ng-content /></ng-template>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvStep, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'mlv-step',
+                    template: `<ng-template #contentTpl><ng-content /></ng-template>`,
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { class: 'mlv-step' },
+                }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], deviative: [{ type: i0.Input, args: [{ isSignal: true, alias: "deviative", required: false }] }], deviationResolved: [{ type: i0.Input, args: [{ isSignal: true, alias: "deviationResolved", required: false }] }], contentTpl: [{ type: i0.ViewChild, args: ['contentTpl', { isSignal: true }] }] } });
+
+/**
+ * `[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.
+ */
+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 }] }] } });
+
+/** Injection token for `MlvStepper` → `MlvStep` communication. */
+const MLV_STEPPER = new InjectionToken('MLV_STEPPER');
+
+/**
+ * `mlv-stepper` — a multi-step workflow container.
+ *
+ * Usage:
+ * ```html
+ * <mlv-stepper>
+ *   <mlv-step label="Account">...</mlv-step>
+ *   <mlv-step label="Profile">...</mlv-step>
+ *   <mlv-step label="Review">...</mlv-step>
+ * </mlv-stepper>
+ * ```
+ */
+class MlvStepper {
+    /** @protected The component's i18n strings signal. */
+    _i18n = inject(MLV_STEPPER_I18N);
+    /** @private Used to tear down the FocusKeyManager. */
+    _destroyRef = inject(DestroyRef);
+    /**
+     * MlvLayout orientation of the stepper.
+     * `'horizontal'` renders step headers side-by-side with a connector line.
+     * `'vertical'` stacks each step header and its content in a column.
+     */
+    orientation = input('horizontal', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+    /**
+     * When `true`, users must complete each step in order before proceeding.
+     * Only completed and the next pending step are clickable.
+     */
+    linear = input(false, { ...(ngDevMode ? { debugName: "linear" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * Zero-based index of the initially active step.
+     */
+    initialIndex = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "initialIndex" }] : /* istanbul ignore next */ []));
+    /**
+     * Accessible label for the stepper container announced by screen readers.
+     */
+    ariaLabel = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * Emits the new zero-based active step index after navigation.
+     */
+    activeIndexChange = output();
+    /** @private Zero-based index of the currently active step (internal signal). */
+    activeIndex = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []));
+    /** @private Projected step definition components. */
+    _steps = contentChildren(MlvStep, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_steps" }] : /* istanbul ignore next */ []));
+    /** @protected Iterable step array for the template. */
+    _stepList = computed(() => this._steps(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_stepList" }] : /* istanbul ignore next */ []));
+    /** @protected CSS class list applied to the host. */
+    _hostClasses = computed(() => `mlv-stepper--${this.orientation()}`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_hostClasses" }] : /* istanbul ignore next */ []));
+    /** @private Step-header trigger directives rendered in the current orientation. */
+    _headers = viewChildren(MlvStepHeader, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_headers" }] : /* istanbul ignore next */ []));
+    /** @private Drives arrow-key navigation + roving tabindex over the step headers. */
+    _keyManager = null;
+    /** @private Supplies the current inline direction to the horizontal key manager. */
+    _rtlService = inject(MlvRtlService);
+    constructor() {
+        // (Re)build the FocusKeyManager whenever the rendered headers or the
+        // orientation change. Vertical steppers navigate with Up/Down, horizontal
+        // with Left/Right; both wrap and support Home/End, skipping disabled steps.
+        effect(() => {
+            const headers = this._headers();
+            const isHorizontal = this.orientation() === 'horizontal';
+            const direction = this._rtlService.direction();
+            untracked(() => {
+                this._keyManager?.destroy();
+                if (headers.length === 0) {
+                    this._keyManager = null;
+                    return;
+                }
+                const km = new FocusKeyManager(headers)
+                    .withWrap()
+                    .withHomeAndEnd()
+                    .skipPredicate((header) => header.disabled);
+                if (isHorizontal) {
+                    km.withHorizontalOrientation(direction);
+                }
+                else {
+                    km.withVerticalOrientation();
+                }
+                this._keyManager = km;
+                // Seed the roving tabindex on the active step without stealing focus.
+                km.updateActiveItem(this.activeIndex());
+                this._syncTabIndices();
+            });
+        });
+        this._destroyRef.onDestroy(() => this._keyManager?.destroy());
+    }
+    ngAfterContentInit() {
+        this.activeIndex.set(this.initialIndex());
+        this._assignIndices();
+    }
+    /**
+     * @protected Keydown handler on the step-header tablist. Delegates arrow /
+     * Home / End navigation to the FocusKeyManager (roving tabindex + focus),
+     * leaving Enter/Space activation to the individual headers.
+     */
+    _onHeaderKeydown(event) {
+        const km = this._keyManager;
+        if (!km)
+            return;
+        // Start navigation from the header that currently holds focus (e.g. reached
+        // via Tab), not the last programmatically-set active item.
+        const focusedIndex = this._focusedHeaderIndex(event.target);
+        if (focusedIndex !== -1 && focusedIndex !== km.activeItemIndex) {
+            km.updateActiveItem(focusedIndex);
+        }
+        const previousIndex = km.activeItemIndex;
+        km.onKeydown(event);
+        // Sync roving tabindex only when the manager actually moved focus.
+        if (km.activeItemIndex !== previousIndex) {
+            this._syncTabIndices();
+        }
+    }
+    /**
+     * @private Resolve the index of the step header containing `target`, or `-1`.
+     */
+    _focusedHeaderIndex(target) {
+        if (!(target instanceof HTMLElement))
+            return -1;
+        const headerEl = target.closest('.mlv-stepper__step-header');
+        if (!headerEl)
+            return -1;
+        return this._headers().findIndex((header) => header.elementRef.nativeElement === headerEl);
+    }
+    /**
+     * Navigate to the next step (no-op if already at the last step).
+     */
+    next() {
+        const steps = this._steps();
+        this._navigate(Math.min(this.activeIndex() + 1, steps.length - 1));
+    }
+    /**
+     * Navigate to the previous step (no-op if already at the first step).
+     */
+    previous() {
+        this._navigate(Math.max(this.activeIndex() - 1, 0));
+    }
+    /**
+     * Navigate directly to the step at `index`.
+     * In linear mode, forward navigation beyond the active step is blocked.
+     */
+    selectStep(index) {
+        const steps = this._steps();
+        if (index < 0 || index >= steps.length)
+            return;
+        if (this.linear() && index > this.activeIndex())
+            return;
+        this._navigate(index);
+    }
+    /** @protected Resolve the effective state for a given step. */
+    _stateFor(step) {
+        if (step.state())
+            return step.state();
+        const active = this.activeIndex();
+        if (step._index === active)
+            return 'active';
+        if (step._index < active)
+            return 'completed';
+        return 'pending';
+    }
+    /** @protected Returns `true` if a step header is clickable. */
+    _isClickable(step) {
+        if (!this.linear())
+            return true;
+        return step._index <= this.activeIndex();
+    }
+    /** @private Emit and update the active index. */
+    _navigate(index) {
+        this.activeIndex.set(index);
+        this.activeIndexChange.emit(index);
+        // Move the roving tabindex to the newly-active step (no focus theft — the
+        // triggering element already holds focus after a click/keyboard activate).
+        this._keyManager?.updateActiveItem(index);
+        this._syncTabIndices();
+    }
+    /** @private Assign sequential indices to child step components. */
+    _assignIndices() {
+        this._steps().forEach((step, i) => {
+            step._index = i;
+        });
+    }
+    /**
+     * @private Reflect the FocusKeyManager's active item into the roving
+     * tabindex: the active header is tabbable (`0`), all others are `-1`.
+     */
+    _syncTabIndices() {
+        const activeIndex = this._keyManager?.activeItemIndex ?? 0;
+        this._headers().forEach((header, i) => {
+            header.tabIndex.set(i === activeIndex ? 0 : -1);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvStepper, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: MlvStepper, isStandalone: true, selector: "mlv-stepper", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, initialIndex: { classPropertyName: "initialIndex", publicName: "initialIndex", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeIndexChange: "activeIndexChange" }, host: { properties: { "class": "_hostClasses()", "attr.aria-label": "ariaLabel() || null" }, classAttribute: "mlv-stepper" }, providers: [{ provide: MLV_STEPPER, useExisting: MlvStepper }], queries: [{ propertyName: "_steps", predicate: MlvStep, isSignal: true }], viewQueries: [{ propertyName: "_headers", predicate: MlvStepHeader, descendants: true, isSignal: true }], ngImport: i0, template: "@if (orientation() === 'vertical') {\n<!--\n  Vertical layout.\n\n  A single CSS grid (`.mlv-stepper__vgrid`, two columns) hosts every step. The\n  `role=\"tablist\"` element uses `display: contents` and contains ONLY the tab\n  column (indicator + connector) so the tablist's accessible children are all\n  `role=\"tab\"` and nothing else (satisfies axe `aria-required-children`). The\n  labels and `role=\"tabpanel\"` content panels live in a sibling `__bodies`\n  container that is NOT part of the tablist's accessible subtree \u2014 a tabpanel is\n  not a permitted tablist child. Each step's indicator column and body column\n  share the same grid row (`grid-row: step index + 1`) so the connector line\n  stays aligned with the label/panel and the active panel pushes the next step\n  down, preserving the interleaved appearance.\n\n      col 1 (tablist)     col 2 (bodies)\n    \u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u252C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\n    \u2502 [indicator]   \u2502 [label / description]     \u2502 row 1\n    \u2502 [ connector ] \u2502 [content panel (if active)]\u2502\n    \u251C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u253C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2524\n    \u2502 [indicator]   \u2502 [label / description]     \u2502 row 2\n    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2534\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518\n-->\n<div class=\"mlv-stepper__vgrid\">\n  <!-- Tab column (display: contents \u2014 the grid lives on the parent) -->\n  <div\n    class=\"mlv-stepper__header\"\n    role=\"tablist\"\n    tabindex=\"-1\"\n    [attr.aria-orientation]=\"orientation()\"\n    (keydown)=\"_onHeaderKeydown($event)\"\n  >\n    @for (step of _stepList(); track step._index; let last = $last) {\n    <div\n      class=\"mlv-stepper__indicator-col\"\n      role=\"presentation\"\n      [style.grid-row]=\"step._index + 1\"\n    >\n      <!-- Indicator circle (trigger) -->\n      <div\n        mlvStepHeader\n        #sh=\"mlvStepHeader\"\n        [isDisabled]=\"!_isClickable(step)\"\n        [attr.tabindex]=\"sh.tabIndex()\"\n        class=\"mlv-stepper__step-header\"\n        [class.mlv-stepper__step-header--active]=\"_stateFor(step) === 'active'\"\n        [class.mlv-stepper__step-header--completed]=\"_stateFor(step) === 'completed'\"\n        [class.mlv-stepper__step-header--error]=\"_stateFor(step) === 'error'\"\n        [class.mlv-stepper__step-header--pending]=\"_stateFor(step) === 'pending'\"\n        [class.mlv-stepper__step-header--deviative]=\"step.deviative()\"\n        [class.mlv-stepper__step-header--clickable]=\"_isClickable(step)\"\n        role=\"tab\"\n        [attr.aria-label]=\"step.label()\"\n        [attr.aria-selected]=\"_stateFor(step) === 'active'\"\n        [attr.aria-disabled]=\"!_isClickable(step) || null\"\n        (click)=\"_isClickable(step) && selectStep(step._index)\"\n        (keydown.enter)=\"_isClickable(step) && selectStep(step._index)\"\n        (keydown.space)=\"_isClickable(step) && selectStep(step._index); $event.preventDefault()\"\n      >\n        <div class=\"mlv-stepper__indicator\" aria-hidden=\"true\">\n          @if (_stateFor(step) === 'completed') {\n          <svg\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M3 8L6.5 11.5L13 5\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n          } @else if (_stateFor(step) === 'error') {\n          <svg\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M8 5V8.5\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n            />\n            <circle cx=\"8\" cy=\"11\" r=\"0.75\" fill=\"currentColor\" />\n          </svg>\n          } @else {\n          <span>{{ step._index + 1 }}</span>\n          } @if (step.deviative()) {\n          <span class=\"mlv-stepper__deviative-badge\" aria-hidden=\"true\">\n            <svg\n              viewBox=\"0 0 10 10\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path d=\"M5 1.5L9 8.5H1L5 1.5Z\" fill=\"currentColor\" />\n            </svg>\n          </span>\n          }\n        </div>\n      </div>\n\n      <!-- Vertical connector line below indicator (hidden for last step) -->\n      @if (!last) {\n      <div\n        class=\"mlv-stepper__vertical-connector\"\n        [class.mlv-stepper__vertical-connector--completed]=\"_stateFor(step) === 'completed'\"\n        [class.mlv-stepper__vertical-connector--deviative]=\"step.deviative() && !step.deviationResolved()\"\n        aria-hidden=\"true\"\n      ></div>\n      }\n    </div>\n    }\n  </div>\n\n  <!-- Body column: labels + inline content panels (outside the tablist) -->\n  <div class=\"mlv-stepper__bodies\" role=\"presentation\">\n    @for (step of _stepList(); track step._index) {\n    <div\n      class=\"mlv-stepper__body-col\"\n      role=\"presentation\"\n      [style.grid-row]=\"step._index + 1\"\n    >\n      <!-- Label group -->\n      <div class=\"mlv-stepper__label-group\">\n        <span\n          class=\"mlv-stepper__label\"\n          [class.mlv-stepper__label--active]=\"_stateFor(step) === 'active'\"\n          [class.mlv-stepper__label--completed]=\"_stateFor(step) === 'completed'\"\n          [class.mlv-stepper__label--error]=\"_stateFor(step) === 'error'\"\n          [class.mlv-stepper__label--deviative]=\"step.deviative()\"\n          >{{ step.label() }}</span\n        >\n        @if (step.optional()) {\n        <span class=\"mlv-stepper__optional-tag\">{{ _i18n().optional }}</span>\n        } @if (step.description()) {\n        <span class=\"mlv-stepper__description\">{{ step.description() }}</span>\n        }\n      </div>\n\n      <!-- Content panel inline under labels \u2014 animated expand/collapse -->\n      <div\n        class=\"mlv-stepper__content-panel\"\n        [class.mlv-stepper__content-panel--active]=\"_stateFor(step) === 'active'\"\n        role=\"tabpanel\"\n        [attr.aria-label]=\"step.label()\"\n        [attr.inert]=\"_stateFor(step) !== 'active' ? '' : null\"\n      >\n        <div class=\"mlv-stepper__content-panel-inner\">\n          <div class=\"mlv-stepper__vertical-content\">\n            <ng-template [ngTemplateOutlet]=\"step.contentTpl()\" />\n          </div>\n        </div>\n      </div>\n    </div>\n    }\n  </div>\n</div>\n} @else {\n<!-- Horizontal layout: step headers in a row, shared content panel below. -->\n<div\n  class=\"mlv-stepper__header\"\n  role=\"tablist\"\n  tabindex=\"-1\"\n  [attr.aria-orientation]=\"orientation()\"\n  (keydown)=\"_onHeaderKeydown($event)\"\n>\n  @for (step of _stepList(); track step._index; let last = $last) {\n  <div\n    class=\"mlv-stepper__header-item\"\n    [class.mlv-stepper__header-item--deviative]=\"step.deviative()\"\n  >\n    <!-- Step trigger button -->\n    <div\n      mlvStepHeader\n      #sh=\"mlvStepHeader\"\n      [isDisabled]=\"!_isClickable(step)\"\n      [attr.tabindex]=\"sh.tabIndex()\"\n      class=\"mlv-stepper__step-header\"\n      [class.mlv-stepper__step-header--active]=\"_stateFor(step) === 'active'\"\n      [class.mlv-stepper__step-header--completed]=\"_stateFor(step) === 'completed'\"\n      [class.mlv-stepper__step-header--error]=\"_stateFor(step) === 'error'\"\n      [class.mlv-stepper__step-header--pending]=\"_stateFor(step) === 'pending'\"\n      [class.mlv-stepper__step-header--deviative]=\"step.deviative()\"\n      [class.mlv-stepper__step-header--clickable]=\"_isClickable(step)\"\n      role=\"tab\"\n      [attr.aria-label]=\"step.label()\"\n      [attr.aria-selected]=\"_stateFor(step) === 'active'\"\n      [attr.aria-disabled]=\"!_isClickable(step) || null\"\n      (click)=\"_isClickable(step) && selectStep(step._index)\"\n      (keydown.enter)=\"_isClickable(step) && selectStep(step._index)\"\n      (keydown.space)=\"_isClickable(step) && selectStep(step._index); $event.preventDefault()\"\n    >\n      <!-- Indicator circle -->\n      <div class=\"mlv-stepper__indicator\" aria-hidden=\"true\">\n        @if (_stateFor(step) === 'completed') {\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            d=\"M3 8L6.5 11.5L13 5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </svg>\n        } @else if (_stateFor(step) === 'error') {\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            d=\"M8 5V8.5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n          />\n          <circle cx=\"8\" cy=\"11\" r=\"0.75\" fill=\"currentColor\" />\n        </svg>\n        } @else {\n        <span>{{ step._index + 1 }}</span>\n        } @if (step.deviative()) {\n        <span class=\"mlv-stepper__deviative-badge\" aria-hidden=\"true\">\n          <svg\n            viewBox=\"0 0 10 10\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path d=\"M5 1.5L9 8.5H1L5 1.5Z\" fill=\"currentColor\" />\n          </svg>\n        </span>\n        }\n      </div>\n\n      <!-- Label + description -->\n      <div class=\"mlv-stepper__label-group\">\n        <span class=\"mlv-stepper__label\">{{ step.label() }}</span>\n        @if (step.optional()) {\n        <span class=\"mlv-stepper__optional-tag\">{{ _i18n().optional }}</span>\n        } @if (step.description()) {\n        <span class=\"mlv-stepper__description\">{{ step.description() }}</span>\n        }\n      </div>\n    </div>\n\n    <!-- Connector (between steps in horizontal layout) -->\n    @if (!last) {\n    <div\n      class=\"mlv-stepper__connector\"\n      [class.mlv-stepper__connector--completed]=\"_stateFor(step) === 'completed'\"\n      [class.mlv-stepper__connector--deviative]=\"step.deviative() && !step.deviationResolved()\"\n      aria-hidden=\"true\"\n    ></div>\n    }\n  </div>\n  }\n</div>\n\n<!-- Mobile compact: step counter (horizontal only) -->\n<div class=\"mlv-stepper__mobile-counter\" aria-hidden=\"true\">\n  <span class=\"mlv-stepper__mobile-label\">\n    Step {{ activeIndex() + 1 }} of {{ _stepList().length }}: {{\n    _stepList()[activeIndex()]?.label() }}\n  </span>\n</div>\n\n<!-- Shared content area below the header row -->\n@for (step of _stepList(); track step._index) { @if (_stateFor(step) ===\n'active') {\n<div\n  class=\"mlv-stepper__content-panel mlv-stepper__content-panel--active\"\n  role=\"tabpanel\"\n  [attr.aria-label]=\"step.label()\"\n>\n  <ng-template [ngTemplateOutlet]=\"step.contentTpl()\" />\n</div>\n} } }\n", styles: ["@layer mlv.components{.mlv-stepper{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-stepper *{box-sizing:border-box}.mlv-stepper{display:flex;flex-direction:column;gap:0}.mlv-stepper__header{display:flex}.mlv-stepper__step-header{display:flex;align-items:center;gap:.75rem;cursor:default;padding:.5rem 0;border-radius:var(--mlv-radius-m);white-space:nowrap}.mlv-stepper__step-header--clickable{cursor:pointer}.mlv-stepper__step-header--clickable:hover .mlv-stepper__indicator{border-color:var(--mlv-background-accent-1-hover)}.mlv-stepper__step-header--clickable:focus-visible{outline:var(--mlv-stroke-width-medium) solid var(--mlv-border-focus);outline-offset:var(--mlv-focus-ring-offset)}.mlv-stepper__step-header--active .mlv-stepper__indicator{border-color:var(--mlv-background-accent-1);background:var(--mlv-background-accent-1);color:var(--mlv-text-primary-on-accent-1)}.mlv-stepper__step-header--active .mlv-stepper__label{color:var(--mlv-text-primary);font-weight:600}.mlv-stepper__step-header--completed .mlv-stepper__indicator{border-color:var(--mlv-background-accent-1);background:var(--mlv-background-accent-1);color:var(--mlv-text-primary-on-accent-1)}.mlv-stepper__step-header--completed .mlv-stepper__label{color:var(--mlv-text-primary)}.mlv-stepper__step-header--error .mlv-stepper__indicator{border-color:var(--mlv-text-negative);background:var(--mlv-background-danger-1-pale);color:var(--mlv-text-negative)}.mlv-stepper__step-header--error .mlv-stepper__label{color:var(--mlv-text-negative)}.mlv-stepper__step-header--pending .mlv-stepper__label{color:var(--mlv-text-secondary)}.mlv-stepper__step-header--deviative .mlv-stepper__label{color:var(--mlv-text-warning)}.mlv-stepper__indicator{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;width:2.5em;height:2.5em;border-radius:var(--mlv-radius-full);border:var(--mlv-stroke-width) solid var(--mlv-border-normal);background:var(--mlv-background-raised);color:var(--mlv-text-secondary);transition:background-color var(--mlv-duration-normal) var(--mlv-ease-default),border-color var(--mlv-duration-normal) var(--mlv-ease-default),color var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__indicator svg{width:1em;height:1em;animation:mlv-stepper-icon-enter var(--mlv-duration-normal) var(--mlv-ease-default) both}.mlv-stepper__indicator span{font-size:var(--mlv-typography-ui-s-size);font-weight:600;line-height:1;transition:opacity var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__deviative-badge{position:absolute;bottom:-.25em;inset-inline-end:-.25em;display:inline-flex;align-items:center;justify-content:center;width:.875em;height:.875em;background:var(--mlv-background-raised);border-radius:var(--mlv-radius-full);color:var(--mlv-border-warning)}.mlv-stepper__deviative-badge svg{width:.625em;height:.625em}.mlv-stepper__label-group{display:flex;flex-direction:column;gap:.125rem}.mlv-stepper__label{font-size:var(--mlv-font-size-m);font-weight:500;color:var(--mlv-text-secondary);transition:color var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__label--active{color:var(--mlv-text-primary);font-weight:600}.mlv-stepper__label--completed{color:var(--mlv-text-primary)}.mlv-stepper__label--error{color:var(--mlv-text-negative)}.mlv-stepper__label--deviative{color:var(--mlv-text-warning)}.mlv-stepper__description{font-size:var(--mlv-typography-ui-s-size);color:var(--mlv-text-secondary)}.mlv-stepper__optional-tag{font-size:var(--mlv-typography-ui-s-size);color:var(--mlv-text-secondary);font-style:italic}.mlv-stepper__connector{flex:1;margin-top:calc(.4375rem + 1.25em);height:.125rem;background:var(--mlv-border-subtle);margin-inline:.5rem;transition:background var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__connector--completed{background:var(--mlv-background-accent-1)}.mlv-stepper__connector--deviative{background:transparent;height:0;border-top:.125rem dashed var(--mlv-border-warning);margin-top:calc(.5rem + 1.25em)}.mlv-stepper__content-panel{display:none;padding:1.5rem 0;opacity:0;transition:opacity var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__content-panel--active{display:block;opacity:1}.mlv-stepper__mobile-counter{display:none}.mlv-stepper__mobile-label{font-size:var(--mlv-font-size-m);font-weight:600;color:var(--mlv-text-primary)}.mlv-stepper--horizontal .mlv-stepper__header{flex-direction:row;align-items:flex-start;border-bottom:.125rem solid var(--mlv-border-subtle);padding-bottom:1rem}.mlv-stepper--horizontal .mlv-stepper__step-header{flex-direction:column;align-items:center;text-align:center;gap:.5rem}.mlv-stepper--horizontal .mlv-stepper__label-group{align-items:center}.mlv-stepper--horizontal .mlv-stepper__header-item{display:flex;flex-direction:row;align-items:flex-start;flex:1}@media(max-width:40rem){.mlv-stepper--horizontal .mlv-stepper__header{display:none}.mlv-stepper--horizontal .mlv-stepper__mobile-counter{display:flex;align-items:center;padding:.75rem 0;border-bottom:.125rem solid var(--mlv-border-subtle)}}.mlv-stepper--vertical .mlv-stepper__vgrid{display:grid;grid-template-columns:calc(2.5em + .5rem) 1fr}.mlv-stepper--vertical .mlv-stepper__header,.mlv-stepper--vertical .mlv-stepper__bodies{display:contents}.mlv-stepper--vertical .mlv-stepper__indicator-col{grid-column:1;display:flex;flex-direction:column;align-items:center;align-self:stretch}.mlv-stepper--vertical .mlv-stepper__indicator-col .mlv-stepper__step-header{flex-direction:column;gap:0;padding:.25rem 0}.mlv-stepper--vertical .mlv-stepper__body-col{grid-column:2;display:flex;flex-direction:column;padding-inline-start:.75rem}.mlv-stepper--vertical .mlv-stepper__label-group{padding-top:calc(.25rem + .65em);min-height:calc(2.5em + .5rem)}.mlv-stepper--vertical .mlv-stepper__vertical-connector{flex:1;width:.125rem;min-height:1.5rem;background:var(--mlv-border-normal);transition:background var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper--vertical .mlv-stepper__vertical-connector--completed{background:var(--mlv-background-accent-1)}.mlv-stepper--vertical .mlv-stepper__vertical-connector--deviative{background:transparent;width:0;border-inline-start:.125rem dashed var(--mlv-border-warning)}.mlv-stepper--vertical .mlv-stepper__content-panel{display:grid;grid-template-rows:0fr;overflow:hidden;padding:0;opacity:0;transition:grid-template-rows var(--mlv-duration-slow) var(--mlv-ease-default),opacity var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper--vertical .mlv-stepper__content-panel--active{grid-template-rows:1fr;opacity:1}.mlv-stepper--vertical .mlv-stepper__content-panel-inner{overflow:hidden;min-height:0}.mlv-stepper--vertical .mlv-stepper__vertical-content{padding-inline-start:0;padding-block:.75rem}@media(prefers-reduced-motion:reduce){.mlv-stepper,.mlv-stepper *,.mlv-stepper:before,.mlv-stepper:after,[class^=mlv-stepper__],[class*=\" mlv-stepper__\"],[class^=mlv-stepper--],[class*=\" mlv-stepper--\"]{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:var(--mlv-duration-instant)!important}}@keyframes mlv-stepper-icon-enter{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MlvStepHeader, selector: "[mlvStepHeader]", inputs: ["isDisabled"], exportAs: ["mlvStepHeader"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvStepper, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-stepper', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MLV_STEPPER, useExisting: MlvStepper }], host: {
+                        class: 'mlv-stepper',
+                        '[class]': '_hostClasses()',
+                        '[attr.aria-label]': 'ariaLabel() || null',
+                    }, imports: [NgTemplateOutlet, MlvStepHeader], template: "@if (orientation() === 'vertical') {\n<!--\n  Vertical layout.\n\n  A single CSS grid (`.mlv-stepper__vgrid`, two columns) hosts every step. The\n  `role=\"tablist\"` element uses `display: contents` and contains ONLY the tab\n  column (indicator + connector) so the tablist's accessible children are all\n  `role=\"tab\"` and nothing else (satisfies axe `aria-required-children`). The\n  labels and `role=\"tabpanel\"` content panels live in a sibling `__bodies`\n  container that is NOT part of the tablist's accessible subtree \u2014 a tabpanel is\n  not a permitted tablist child. Each step's indicator column and body column\n  share the same grid row (`grid-row: step index + 1`) so the connector line\n  stays aligned with the label/panel and the active panel pushes the next step\n  down, preserving the interleaved appearance.\n\n      col 1 (tablist)     col 2 (bodies)\n    \u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u252C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510\n    \u2502 [indicator]   \u2502 [label / description]     \u2502 row 1\n    \u2502 [ connector ] \u2502 [content panel (if active)]\u2502\n    \u251C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u253C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2524\n    \u2502 [indicator]   \u2502 [label / description]     \u2502 row 2\n    \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2534\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518\n-->\n<div class=\"mlv-stepper__vgrid\">\n  <!-- Tab column (display: contents \u2014 the grid lives on the parent) -->\n  <div\n    class=\"mlv-stepper__header\"\n    role=\"tablist\"\n    tabindex=\"-1\"\n    [attr.aria-orientation]=\"orientation()\"\n    (keydown)=\"_onHeaderKeydown($event)\"\n  >\n    @for (step of _stepList(); track step._index; let last = $last) {\n    <div\n      class=\"mlv-stepper__indicator-col\"\n      role=\"presentation\"\n      [style.grid-row]=\"step._index + 1\"\n    >\n      <!-- Indicator circle (trigger) -->\n      <div\n        mlvStepHeader\n        #sh=\"mlvStepHeader\"\n        [isDisabled]=\"!_isClickable(step)\"\n        [attr.tabindex]=\"sh.tabIndex()\"\n        class=\"mlv-stepper__step-header\"\n        [class.mlv-stepper__step-header--active]=\"_stateFor(step) === 'active'\"\n        [class.mlv-stepper__step-header--completed]=\"_stateFor(step) === 'completed'\"\n        [class.mlv-stepper__step-header--error]=\"_stateFor(step) === 'error'\"\n        [class.mlv-stepper__step-header--pending]=\"_stateFor(step) === 'pending'\"\n        [class.mlv-stepper__step-header--deviative]=\"step.deviative()\"\n        [class.mlv-stepper__step-header--clickable]=\"_isClickable(step)\"\n        role=\"tab\"\n        [attr.aria-label]=\"step.label()\"\n        [attr.aria-selected]=\"_stateFor(step) === 'active'\"\n        [attr.aria-disabled]=\"!_isClickable(step) || null\"\n        (click)=\"_isClickable(step) && selectStep(step._index)\"\n        (keydown.enter)=\"_isClickable(step) && selectStep(step._index)\"\n        (keydown.space)=\"_isClickable(step) && selectStep(step._index); $event.preventDefault()\"\n      >\n        <div class=\"mlv-stepper__indicator\" aria-hidden=\"true\">\n          @if (_stateFor(step) === 'completed') {\n          <svg\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M3 8L6.5 11.5L13 5\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n          } @else if (_stateFor(step) === 'error') {\n          <svg\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M8 5V8.5\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n            />\n            <circle cx=\"8\" cy=\"11\" r=\"0.75\" fill=\"currentColor\" />\n          </svg>\n          } @else {\n          <span>{{ step._index + 1 }}</span>\n          } @if (step.deviative()) {\n          <span class=\"mlv-stepper__deviative-badge\" aria-hidden=\"true\">\n            <svg\n              viewBox=\"0 0 10 10\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path d=\"M5 1.5L9 8.5H1L5 1.5Z\" fill=\"currentColor\" />\n            </svg>\n          </span>\n          }\n        </div>\n      </div>\n\n      <!-- Vertical connector line below indicator (hidden for last step) -->\n      @if (!last) {\n      <div\n        class=\"mlv-stepper__vertical-connector\"\n        [class.mlv-stepper__vertical-connector--completed]=\"_stateFor(step) === 'completed'\"\n        [class.mlv-stepper__vertical-connector--deviative]=\"step.deviative() && !step.deviationResolved()\"\n        aria-hidden=\"true\"\n      ></div>\n      }\n    </div>\n    }\n  </div>\n\n  <!-- Body column: labels + inline content panels (outside the tablist) -->\n  <div class=\"mlv-stepper__bodies\" role=\"presentation\">\n    @for (step of _stepList(); track step._index) {\n    <div\n      class=\"mlv-stepper__body-col\"\n      role=\"presentation\"\n      [style.grid-row]=\"step._index + 1\"\n    >\n      <!-- Label group -->\n      <div class=\"mlv-stepper__label-group\">\n        <span\n          class=\"mlv-stepper__label\"\n          [class.mlv-stepper__label--active]=\"_stateFor(step) === 'active'\"\n          [class.mlv-stepper__label--completed]=\"_stateFor(step) === 'completed'\"\n          [class.mlv-stepper__label--error]=\"_stateFor(step) === 'error'\"\n          [class.mlv-stepper__label--deviative]=\"step.deviative()\"\n          >{{ step.label() }}</span\n        >\n        @if (step.optional()) {\n        <span class=\"mlv-stepper__optional-tag\">{{ _i18n().optional }}</span>\n        } @if (step.description()) {\n        <span class=\"mlv-stepper__description\">{{ step.description() }}</span>\n        }\n      </div>\n\n      <!-- Content panel inline under labels \u2014 animated expand/collapse -->\n      <div\n        class=\"mlv-stepper__content-panel\"\n        [class.mlv-stepper__content-panel--active]=\"_stateFor(step) === 'active'\"\n        role=\"tabpanel\"\n        [attr.aria-label]=\"step.label()\"\n        [attr.inert]=\"_stateFor(step) !== 'active' ? '' : null\"\n      >\n        <div class=\"mlv-stepper__content-panel-inner\">\n          <div class=\"mlv-stepper__vertical-content\">\n            <ng-template [ngTemplateOutlet]=\"step.contentTpl()\" />\n          </div>\n        </div>\n      </div>\n    </div>\n    }\n  </div>\n</div>\n} @else {\n<!-- Horizontal layout: step headers in a row, shared content panel below. -->\n<div\n  class=\"mlv-stepper__header\"\n  role=\"tablist\"\n  tabindex=\"-1\"\n  [attr.aria-orientation]=\"orientation()\"\n  (keydown)=\"_onHeaderKeydown($event)\"\n>\n  @for (step of _stepList(); track step._index; let last = $last) {\n  <div\n    class=\"mlv-stepper__header-item\"\n    [class.mlv-stepper__header-item--deviative]=\"step.deviative()\"\n  >\n    <!-- Step trigger button -->\n    <div\n      mlvStepHeader\n      #sh=\"mlvStepHeader\"\n      [isDisabled]=\"!_isClickable(step)\"\n      [attr.tabindex]=\"sh.tabIndex()\"\n      class=\"mlv-stepper__step-header\"\n      [class.mlv-stepper__step-header--active]=\"_stateFor(step) === 'active'\"\n      [class.mlv-stepper__step-header--completed]=\"_stateFor(step) === 'completed'\"\n      [class.mlv-stepper__step-header--error]=\"_stateFor(step) === 'error'\"\n      [class.mlv-stepper__step-header--pending]=\"_stateFor(step) === 'pending'\"\n      [class.mlv-stepper__step-header--deviative]=\"step.deviative()\"\n      [class.mlv-stepper__step-header--clickable]=\"_isClickable(step)\"\n      role=\"tab\"\n      [attr.aria-label]=\"step.label()\"\n      [attr.aria-selected]=\"_stateFor(step) === 'active'\"\n      [attr.aria-disabled]=\"!_isClickable(step) || null\"\n      (click)=\"_isClickable(step) && selectStep(step._index)\"\n      (keydown.enter)=\"_isClickable(step) && selectStep(step._index)\"\n      (keydown.space)=\"_isClickable(step) && selectStep(step._index); $event.preventDefault()\"\n    >\n      <!-- Indicator circle -->\n      <div class=\"mlv-stepper__indicator\" aria-hidden=\"true\">\n        @if (_stateFor(step) === 'completed') {\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            d=\"M3 8L6.5 11.5L13 5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </svg>\n        } @else if (_stateFor(step) === 'error') {\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            d=\"M8 5V8.5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n          />\n          <circle cx=\"8\" cy=\"11\" r=\"0.75\" fill=\"currentColor\" />\n        </svg>\n        } @else {\n        <span>{{ step._index + 1 }}</span>\n        } @if (step.deviative()) {\n        <span class=\"mlv-stepper__deviative-badge\" aria-hidden=\"true\">\n          <svg\n            viewBox=\"0 0 10 10\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path d=\"M5 1.5L9 8.5H1L5 1.5Z\" fill=\"currentColor\" />\n          </svg>\n        </span>\n        }\n      </div>\n\n      <!-- Label + description -->\n      <div class=\"mlv-stepper__label-group\">\n        <span class=\"mlv-stepper__label\">{{ step.label() }}</span>\n        @if (step.optional()) {\n        <span class=\"mlv-stepper__optional-tag\">{{ _i18n().optional }}</span>\n        } @if (step.description()) {\n        <span class=\"mlv-stepper__description\">{{ step.description() }}</span>\n        }\n      </div>\n    </div>\n\n    <!-- Connector (between steps in horizontal layout) -->\n    @if (!last) {\n    <div\n      class=\"mlv-stepper__connector\"\n      [class.mlv-stepper__connector--completed]=\"_stateFor(step) === 'completed'\"\n      [class.mlv-stepper__connector--deviative]=\"step.deviative() && !step.deviationResolved()\"\n      aria-hidden=\"true\"\n    ></div>\n    }\n  </div>\n  }\n</div>\n\n<!-- Mobile compact: step counter (horizontal only) -->\n<div class=\"mlv-stepper__mobile-counter\" aria-hidden=\"true\">\n  <span class=\"mlv-stepper__mobile-label\">\n    Step {{ activeIndex() + 1 }} of {{ _stepList().length }}: {{\n    _stepList()[activeIndex()]?.label() }}\n  </span>\n</div>\n\n<!-- Shared content area below the header row -->\n@for (step of _stepList(); track step._index) { @if (_stateFor(step) ===\n'active') {\n<div\n  class=\"mlv-stepper__content-panel mlv-stepper__content-panel--active\"\n  role=\"tabpanel\"\n  [attr.aria-label]=\"step.label()\"\n>\n  <ng-template [ngTemplateOutlet]=\"step.contentTpl()\" />\n</div>\n} } }\n", styles: ["@layer mlv.components{.mlv-stepper{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-stepper *{box-sizing:border-box}.mlv-stepper{display:flex;flex-direction:column;gap:0}.mlv-stepper__header{display:flex}.mlv-stepper__step-header{display:flex;align-items:center;gap:.75rem;cursor:default;padding:.5rem 0;border-radius:var(--mlv-radius-m);white-space:nowrap}.mlv-stepper__step-header--clickable{cursor:pointer}.mlv-stepper__step-header--clickable:hover .mlv-stepper__indicator{border-color:var(--mlv-background-accent-1-hover)}.mlv-stepper__step-header--clickable:focus-visible{outline:var(--mlv-stroke-width-medium) solid var(--mlv-border-focus);outline-offset:var(--mlv-focus-ring-offset)}.mlv-stepper__step-header--active .mlv-stepper__indicator{border-color:var(--mlv-background-accent-1);background:var(--mlv-background-accent-1);color:var(--mlv-text-primary-on-accent-1)}.mlv-stepper__step-header--active .mlv-stepper__label{color:var(--mlv-text-primary);font-weight:600}.mlv-stepper__step-header--completed .mlv-stepper__indicator{border-color:var(--mlv-background-accent-1);background:var(--mlv-background-accent-1);color:var(--mlv-text-primary-on-accent-1)}.mlv-stepper__step-header--completed .mlv-stepper__label{color:var(--mlv-text-primary)}.mlv-stepper__step-header--error .mlv-stepper__indicator{border-color:var(--mlv-text-negative);background:var(--mlv-background-danger-1-pale);color:var(--mlv-text-negative)}.mlv-stepper__step-header--error .mlv-stepper__label{color:var(--mlv-text-negative)}.mlv-stepper__step-header--pending .mlv-stepper__label{color:var(--mlv-text-secondary)}.mlv-stepper__step-header--deviative .mlv-stepper__label{color:var(--mlv-text-warning)}.mlv-stepper__indicator{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;width:2.5em;height:2.5em;border-radius:var(--mlv-radius-full);border:var(--mlv-stroke-width) solid var(--mlv-border-normal);background:var(--mlv-background-raised);color:var(--mlv-text-secondary);transition:background-color var(--mlv-duration-normal) var(--mlv-ease-default),border-color var(--mlv-duration-normal) var(--mlv-ease-default),color var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__indicator svg{width:1em;height:1em;animation:mlv-stepper-icon-enter var(--mlv-duration-normal) var(--mlv-ease-default) both}.mlv-stepper__indicator span{font-size:var(--mlv-typography-ui-s-size);font-weight:600;line-height:1;transition:opacity var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__deviative-badge{position:absolute;bottom:-.25em;inset-inline-end:-.25em;display:inline-flex;align-items:center;justify-content:center;width:.875em;height:.875em;background:var(--mlv-background-raised);border-radius:var(--mlv-radius-full);color:var(--mlv-border-warning)}.mlv-stepper__deviative-badge svg{width:.625em;height:.625em}.mlv-stepper__label-group{display:flex;flex-direction:column;gap:.125rem}.mlv-stepper__label{font-size:var(--mlv-font-size-m);font-weight:500;color:var(--mlv-text-secondary);transition:color var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__label--active{color:var(--mlv-text-primary);font-weight:600}.mlv-stepper__label--completed{color:var(--mlv-text-primary)}.mlv-stepper__label--error{color:var(--mlv-text-negative)}.mlv-stepper__label--deviative{color:var(--mlv-text-warning)}.mlv-stepper__description{font-size:var(--mlv-typography-ui-s-size);color:var(--mlv-text-secondary)}.mlv-stepper__optional-tag{font-size:var(--mlv-typography-ui-s-size);color:var(--mlv-text-secondary);font-style:italic}.mlv-stepper__connector{flex:1;margin-top:calc(.4375rem + 1.25em);height:.125rem;background:var(--mlv-border-subtle);margin-inline:.5rem;transition:background var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__connector--completed{background:var(--mlv-background-accent-1)}.mlv-stepper__connector--deviative{background:transparent;height:0;border-top:.125rem dashed var(--mlv-border-warning);margin-top:calc(.5rem + 1.25em)}.mlv-stepper__content-panel{display:none;padding:1.5rem 0;opacity:0;transition:opacity var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper__content-panel--active{display:block;opacity:1}.mlv-stepper__mobile-counter{display:none}.mlv-stepper__mobile-label{font-size:var(--mlv-font-size-m);font-weight:600;color:var(--mlv-text-primary)}.mlv-stepper--horizontal .mlv-stepper__header{flex-direction:row;align-items:flex-start;border-bottom:.125rem solid var(--mlv-border-subtle);padding-bottom:1rem}.mlv-stepper--horizontal .mlv-stepper__step-header{flex-direction:column;align-items:center;text-align:center;gap:.5rem}.mlv-stepper--horizontal .mlv-stepper__label-group{align-items:center}.mlv-stepper--horizontal .mlv-stepper__header-item{display:flex;flex-direction:row;align-items:flex-start;flex:1}@media(max-width:40rem){.mlv-stepper--horizontal .mlv-stepper__header{display:none}.mlv-stepper--horizontal .mlv-stepper__mobile-counter{display:flex;align-items:center;padding:.75rem 0;border-bottom:.125rem solid var(--mlv-border-subtle)}}.mlv-stepper--vertical .mlv-stepper__vgrid{display:grid;grid-template-columns:calc(2.5em + .5rem) 1fr}.mlv-stepper--vertical .mlv-stepper__header,.mlv-stepper--vertical .mlv-stepper__bodies{display:contents}.mlv-stepper--vertical .mlv-stepper__indicator-col{grid-column:1;display:flex;flex-direction:column;align-items:center;align-self:stretch}.mlv-stepper--vertical .mlv-stepper__indicator-col .mlv-stepper__step-header{flex-direction:column;gap:0;padding:.25rem 0}.mlv-stepper--vertical .mlv-stepper__body-col{grid-column:2;display:flex;flex-direction:column;padding-inline-start:.75rem}.mlv-stepper--vertical .mlv-stepper__label-group{padding-top:calc(.25rem + .65em);min-height:calc(2.5em + .5rem)}.mlv-stepper--vertical .mlv-stepper__vertical-connector{flex:1;width:.125rem;min-height:1.5rem;background:var(--mlv-border-normal);transition:background var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper--vertical .mlv-stepper__vertical-connector--completed{background:var(--mlv-background-accent-1)}.mlv-stepper--vertical .mlv-stepper__vertical-connector--deviative{background:transparent;width:0;border-inline-start:.125rem dashed var(--mlv-border-warning)}.mlv-stepper--vertical .mlv-stepper__content-panel{display:grid;grid-template-rows:0fr;overflow:hidden;padding:0;opacity:0;transition:grid-template-rows var(--mlv-duration-slow) var(--mlv-ease-default),opacity var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-stepper--vertical .mlv-stepper__content-panel--active{grid-template-rows:1fr;opacity:1}.mlv-stepper--vertical .mlv-stepper__content-panel-inner{overflow:hidden;min-height:0}.mlv-stepper--vertical .mlv-stepper__vertical-content{padding-inline-start:0;padding-block:.75rem}@media(prefers-reduced-motion:reduce){.mlv-stepper,.mlv-stepper *,.mlv-stepper:before,.mlv-stepper:after,[class^=mlv-stepper__],[class*=\" mlv-stepper__\"],[class^=mlv-stepper--],[class*=\" mlv-stepper--\"]{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:var(--mlv-duration-instant)!important}}@keyframes mlv-stepper-icon-enter{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], linear: [{ type: i0.Input, args: [{ isSignal: true, alias: "linear", required: false }] }], initialIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialIndex", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], activeIndexChange: [{ type: i0.Output, args: ["activeIndexChange"] }], _steps: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => MlvStep), { isSignal: true }] }], _headers: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => MlvStepHeader), { isSignal: true }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MLV_STEPPER, MlvStep, MlvStepper };
+//# sourceMappingURL=malva-ui-core-stepper.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-stepper.mjs","sources":["../../../../libs/core/stepper/src/lib/stepper/step.ts","../../../../libs/core/stepper/src/lib/stepper/step-header.ts","../../../../libs/core/stepper/src/lib/stepper/stepper-token.ts","../../../../libs/core/stepper/src/lib/stepper/stepper.ts","../../../../libs/core/stepper/src/lib/stepper/stepper.html","../../../../libs/core/stepper/src/malva-ui-core-stepper.ts"],"sourcesContent":["import type { TemplateRef } from '@angular/core';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  input,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport type { MlvStepState } from './stepper.types';\n\n/**\n * `mlv-step` — a step definition component. Declare steps as children of\n * `mlv-stepper`. The stepper renders the headers and content panels itself;\n * the projected content of each `<mlv-step>` is shown in the active panel.\n */\n@Component({\n  selector: 'mlv-step',\n  template: `<ng-template #contentTpl><ng-content /></ng-template>`,\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: { class: 'mlv-step' },\n})\nexport class MlvStep {\n  /**\n   * Step label displayed in the step header.\n   */\n  readonly label = input.required<string>();\n\n  /**\n   * Optional descriptive sub-label shown below the main label.\n   */\n  readonly description = input<string | undefined>(undefined);\n\n  /**\n   * Explicit state override. When provided, takes precedence over the derived\n   * state from the stepper's `activeIndex`.\n   */\n  readonly state = input<MlvStepState | undefined>(undefined);\n\n  /**\n   * When `true`, this step is optional and can be skipped even in linear mode.\n   */\n  readonly optional = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /**\n   * When `true`, this step represents an alternative/deviative path.\n   * The connector after this step is rendered with a dashed warning-color border,\n   * and the indicator receives a visual warning badge overlay.\n   */\n  readonly deviative = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /**\n   * When `true`, marks this deviative step's deviation as resolved.\n   * The connector AFTER this step reverts to the normal (solid, neutral) style\n   * instead of dashed/warning. Has no visual effect unless `deviative` is also true.\n   * When the user returns to this step and `deviationResolved` becomes false again,\n   * the connector reverts to the dashed/warning style.\n   */\n  readonly deviationResolved = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /**\n   * 0-based index assigned by the parent `MlvStepper` after content init.\n   * @internal\n   */\n  _index = 0;\n\n  /** @internal Template reference holding this step's projected content. */\n  readonly contentTpl = viewChild.required<TemplateRef<unknown>>('contentTpl');\n}\n","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","import { InjectionToken } from '@angular/core';\nimport type { MlvStepperOrientation } from './stepper.types';\n\n/** Interface exposed by the stepper container to child step components. */\nexport interface MlvStepperAccessor {\n  /** Current active step index (0-based). */\n  readonly activeIndex: () => number;\n  /** Orientation of the stepper layout. */\n  readonly orientation: () => MlvStepperOrientation;\n  /** Called by a step when the user clicks on its header to navigate. */\n  selectStep(index: number): void;\n}\n\n/** Injection token for `MlvStepper` → `MlvStep` communication. */\nexport const MLV_STEPPER = new InjectionToken<MlvStepperAccessor>(\n  'MLV_STEPPER',\n);\n","import type { AfterContentInit } from '@angular/core';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  contentChildren,\n  DestroyRef,\n  effect,\n  inject,\n  input,\n  output,\n  signal,\n  untracked,\n  viewChildren,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { FocusKeyManager } from '@angular/cdk/a11y';\nimport { MlvStep } from './step';\nimport { MlvStepHeader } from './step-header';\nimport { MLV_STEPPER } from './stepper-token';\nimport type { MlvStepState, MlvStepperOrientation } from './stepper.types';\nimport { MlvRtlService } from '@malva-ui/cdk/utils';\nimport { MLV_STEPPER_I18N } from '@malva-ui/i18n';\n\n/**\n * `mlv-stepper` — a multi-step workflow container.\n *\n * Usage:\n * ```html\n * <mlv-stepper>\n *   <mlv-step label=\"Account\">...</mlv-step>\n *   <mlv-step label=\"Profile\">...</mlv-step>\n *   <mlv-step label=\"Review\">...</mlv-step>\n * </mlv-stepper>\n * ```\n */\n@Component({\n  selector: 'mlv-stepper',\n  templateUrl: './stepper.html',\n  styleUrl: './stepper.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [{ provide: MLV_STEPPER, useExisting: MlvStepper }],\n  host: {\n    class: 'mlv-stepper',\n    '[class]': '_hostClasses()',\n    '[attr.aria-label]': 'ariaLabel() || null',\n  },\n  imports: [NgTemplateOutlet, MlvStepHeader],\n})\nexport class MlvStepper implements AfterContentInit {\n  /** @protected The component's i18n strings signal. */\n  protected readonly _i18n = inject(MLV_STEPPER_I18N);\n\n  /** @private Used to tear down the FocusKeyManager. */\n  private readonly _destroyRef = inject(DestroyRef);\n\n  /**\n   * MlvLayout orientation of the stepper.\n   * `'horizontal'` renders step headers side-by-side with a connector line.\n   * `'vertical'` stacks each step header and its content in a column.\n   */\n  readonly orientation = input<MlvStepperOrientation>('horizontal');\n\n  /**\n   * When `true`, users must complete each step in order before proceeding.\n   * Only completed and the next pending step are clickable.\n   */\n  readonly linear = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /**\n   * Zero-based index of the initially active step.\n   */\n  readonly initialIndex = input(0);\n\n  /**\n   * Accessible label for the stepper container announced by screen readers.\n   */\n  readonly ariaLabel = input<string | undefined>(undefined);\n\n  /**\n   * Emits the new zero-based active step index after navigation.\n   */\n  readonly activeIndexChange = output<number>();\n\n  /** @private Zero-based index of the currently active step (internal signal). */\n  readonly activeIndex = signal(0);\n\n  /** @private Projected step definition components. */\n  private readonly _steps = contentChildren(MlvStep);\n\n  /** @protected Iterable step array for the template. */\n  protected readonly _stepList = computed(() => this._steps());\n\n  /** @protected CSS class list applied to the host. */\n  protected readonly _hostClasses = computed(\n    () => `mlv-stepper--${this.orientation()}`,\n  );\n\n  /** @private Step-header trigger directives rendered in the current orientation. */\n  private readonly _headers = viewChildren(MlvStepHeader);\n\n  /** @private Drives arrow-key navigation + roving tabindex over the step headers. */\n  private _keyManager: FocusKeyManager<MlvStepHeader> | null = null;\n\n  /** @private Supplies the current inline direction to the horizontal key manager. */\n  private readonly _rtlService = inject(MlvRtlService);\n\n  constructor() {\n    // (Re)build the FocusKeyManager whenever the rendered headers or the\n    // orientation change. Vertical steppers navigate with Up/Down, horizontal\n    // with Left/Right; both wrap and support Home/End, skipping disabled steps.\n    effect(() => {\n      const headers = this._headers();\n      const isHorizontal = this.orientation() === 'horizontal';\n      const direction = this._rtlService.direction();\n\n      untracked(() => {\n        this._keyManager?.destroy();\n\n        if (headers.length === 0) {\n          this._keyManager = null;\n          return;\n        }\n\n        const km = new FocusKeyManager<MlvStepHeader>(headers)\n          .withWrap()\n          .withHomeAndEnd()\n          .skipPredicate((header) => header.disabled);\n\n        if (isHorizontal) {\n          km.withHorizontalOrientation(direction);\n        } else {\n          km.withVerticalOrientation();\n        }\n\n        this._keyManager = km;\n\n        // Seed the roving tabindex on the active step without stealing focus.\n        km.updateActiveItem(this.activeIndex());\n        this._syncTabIndices();\n      });\n    });\n\n    this._destroyRef.onDestroy(() => this._keyManager?.destroy());\n  }\n\n  ngAfterContentInit(): void {\n    this.activeIndex.set(this.initialIndex());\n    this._assignIndices();\n  }\n\n  /**\n   * @protected Keydown handler on the step-header tablist. Delegates arrow /\n   * Home / End navigation to the FocusKeyManager (roving tabindex + focus),\n   * leaving Enter/Space activation to the individual headers.\n   */\n  protected _onHeaderKeydown(event: KeyboardEvent): void {\n    const km = this._keyManager;\n    if (!km) return;\n\n    // Start navigation from the header that currently holds focus (e.g. reached\n    // via Tab), not the last programmatically-set active item.\n    const focusedIndex = this._focusedHeaderIndex(event.target);\n    if (focusedIndex !== -1 && focusedIndex !== km.activeItemIndex) {\n      km.updateActiveItem(focusedIndex);\n    }\n\n    const previousIndex = km.activeItemIndex;\n    km.onKeydown(event);\n\n    // Sync roving tabindex only when the manager actually moved focus.\n    if (km.activeItemIndex !== previousIndex) {\n      this._syncTabIndices();\n    }\n  }\n\n  /**\n   * @private Resolve the index of the step header containing `target`, or `-1`.\n   */\n  private _focusedHeaderIndex(target: EventTarget | null): number {\n    if (!(target instanceof HTMLElement)) return -1;\n    const headerEl = target.closest('.mlv-stepper__step-header');\n    if (!headerEl) return -1;\n    return this._headers().findIndex(\n      (header) => header.elementRef.nativeElement === headerEl,\n    );\n  }\n\n  /**\n   * Navigate to the next step (no-op if already at the last step).\n   */\n  next(): void {\n    const steps = this._steps();\n    this._navigate(Math.min(this.activeIndex() + 1, steps.length - 1));\n  }\n\n  /**\n   * Navigate to the previous step (no-op if already at the first step).\n   */\n  previous(): void {\n    this._navigate(Math.max(this.activeIndex() - 1, 0));\n  }\n\n  /**\n   * Navigate directly to the step at `index`.\n   * In linear mode, forward navigation beyond the active step is blocked.\n   */\n  selectStep(index: number): void {\n    const steps = this._steps();\n    if (index < 0 || index >= steps.length) return;\n    if (this.linear() && index > this.activeIndex()) return;\n    this._navigate(index);\n  }\n\n  /** @protected Resolve the effective state for a given step. */\n  protected _stateFor(step: MlvStep): MlvStepState {\n    if (step.state()) return step.state() as MlvStepState;\n    const active = this.activeIndex();\n    if (step._index === active) return 'active';\n    if (step._index < active) return 'completed';\n    return 'pending';\n  }\n\n  /** @protected Returns `true` if a step header is clickable. */\n  protected _isClickable(step: MlvStep): boolean {\n    if (!this.linear()) return true;\n    return step._index <= this.activeIndex();\n  }\n\n  /** @private Emit and update the active index. */\n  private _navigate(index: number): void {\n    this.activeIndex.set(index);\n    this.activeIndexChange.emit(index);\n    // Move the roving tabindex to the newly-active step (no focus theft — the\n    // triggering element already holds focus after a click/keyboard activate).\n    this._keyManager?.updateActiveItem(index);\n    this._syncTabIndices();\n  }\n\n  /** @private Assign sequential indices to child step components. */\n  private _assignIndices(): void {\n    this._steps().forEach((step, i) => {\n      step._index = i;\n    });\n  }\n\n  /**\n   * @private Reflect the FocusKeyManager's active item into the roving\n   * tabindex: the active header is tabbable (`0`), all others are `-1`.\n   */\n  private _syncTabIndices(): void {\n    const activeIndex = this._keyManager?.activeItemIndex ?? 0;\n    this._headers().forEach((header, i) => {\n      header.tabIndex.set(i === activeIndex ? 0 : -1);\n    });\n  }\n}\n","@if (orientation() === 'vertical') {\n<!--\n  Vertical layout.\n\n  A single CSS grid (`.mlv-stepper__vgrid`, two columns) hosts every step. The\n  `role=\"tablist\"` element uses `display: contents` and contains ONLY the tab\n  column (indicator + connector) so the tablist's accessible children are all\n  `role=\"tab\"` and nothing else (satisfies axe `aria-required-children`). The\n  labels and `role=\"tabpanel\"` content panels live in a sibling `__bodies`\n  container that is NOT part of the tablist's accessible subtree — a tabpanel is\n  not a permitted tablist child. Each step's indicator column and body column\n  share the same grid row (`grid-row: step index + 1`) so the connector line\n  stays aligned with the label/panel and the active panel pushes the next step\n  down, preserving the interleaved appearance.\n\n      col 1 (tablist)     col 2 (bodies)\n    ┌───────────────┬──────────────────────────┐\n    │ [indicator]   │ [label / description]     │ row 1\n    │ [ connector ] │ [content panel (if active)]│\n    ├───────────────┼──────────────────────────┤\n    │ [indicator]   │ [label / description]     │ row 2\n    └───────────────┴──────────────────────────┘\n-->\n<div class=\"mlv-stepper__vgrid\">\n  <!-- Tab column (display: contents — the grid lives on the parent) -->\n  <div\n    class=\"mlv-stepper__header\"\n    role=\"tablist\"\n    tabindex=\"-1\"\n    [attr.aria-orientation]=\"orientation()\"\n    (keydown)=\"_onHeaderKeydown($event)\"\n  >\n    @for (step of _stepList(); track step._index; let last = $last) {\n    <div\n      class=\"mlv-stepper__indicator-col\"\n      role=\"presentation\"\n      [style.grid-row]=\"step._index + 1\"\n    >\n      <!-- Indicator circle (trigger) -->\n      <div\n        mlvStepHeader\n        #sh=\"mlvStepHeader\"\n        [isDisabled]=\"!_isClickable(step)\"\n        [attr.tabindex]=\"sh.tabIndex()\"\n        class=\"mlv-stepper__step-header\"\n        [class.mlv-stepper__step-header--active]=\"_stateFor(step) === 'active'\"\n        [class.mlv-stepper__step-header--completed]=\"_stateFor(step) === 'completed'\"\n        [class.mlv-stepper__step-header--error]=\"_stateFor(step) === 'error'\"\n        [class.mlv-stepper__step-header--pending]=\"_stateFor(step) === 'pending'\"\n        [class.mlv-stepper__step-header--deviative]=\"step.deviative()\"\n        [class.mlv-stepper__step-header--clickable]=\"_isClickable(step)\"\n        role=\"tab\"\n        [attr.aria-label]=\"step.label()\"\n        [attr.aria-selected]=\"_stateFor(step) === 'active'\"\n        [attr.aria-disabled]=\"!_isClickable(step) || null\"\n        (click)=\"_isClickable(step) && selectStep(step._index)\"\n        (keydown.enter)=\"_isClickable(step) && selectStep(step._index)\"\n        (keydown.space)=\"_isClickable(step) && selectStep(step._index); $event.preventDefault()\"\n      >\n        <div class=\"mlv-stepper__indicator\" aria-hidden=\"true\">\n          @if (_stateFor(step) === 'completed') {\n          <svg\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M3 8L6.5 11.5L13 5\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n          } @else if (_stateFor(step) === 'error') {\n          <svg\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M8 5V8.5\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n            />\n            <circle cx=\"8\" cy=\"11\" r=\"0.75\" fill=\"currentColor\" />\n          </svg>\n          } @else {\n          <span>{{ step._index + 1 }}</span>\n          } @if (step.deviative()) {\n          <span class=\"mlv-stepper__deviative-badge\" aria-hidden=\"true\">\n            <svg\n              viewBox=\"0 0 10 10\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path d=\"M5 1.5L9 8.5H1L5 1.5Z\" fill=\"currentColor\" />\n            </svg>\n          </span>\n          }\n        </div>\n      </div>\n\n      <!-- Vertical connector line below indicator (hidden for last step) -->\n      @if (!last) {\n      <div\n        class=\"mlv-stepper__vertical-connector\"\n        [class.mlv-stepper__vertical-connector--completed]=\"_stateFor(step) === 'completed'\"\n        [class.mlv-stepper__vertical-connector--deviative]=\"step.deviative() && !step.deviationResolved()\"\n        aria-hidden=\"true\"\n      ></div>\n      }\n    </div>\n    }\n  </div>\n\n  <!-- Body column: labels + inline content panels (outside the tablist) -->\n  <div class=\"mlv-stepper__bodies\" role=\"presentation\">\n    @for (step of _stepList(); track step._index) {\n    <div\n      class=\"mlv-stepper__body-col\"\n      role=\"presentation\"\n      [style.grid-row]=\"step._index + 1\"\n    >\n      <!-- Label group -->\n      <div class=\"mlv-stepper__label-group\">\n        <span\n          class=\"mlv-stepper__label\"\n          [class.mlv-stepper__label--active]=\"_stateFor(step) === 'active'\"\n          [class.mlv-stepper__label--completed]=\"_stateFor(step) === 'completed'\"\n          [class.mlv-stepper__label--error]=\"_stateFor(step) === 'error'\"\n          [class.mlv-stepper__label--deviative]=\"step.deviative()\"\n          >{{ step.label() }}</span\n        >\n        @if (step.optional()) {\n        <span class=\"mlv-stepper__optional-tag\">{{ _i18n().optional }}</span>\n        } @if (step.description()) {\n        <span class=\"mlv-stepper__description\">{{ step.description() }}</span>\n        }\n      </div>\n\n      <!-- Content panel inline under labels — animated expand/collapse -->\n      <div\n        class=\"mlv-stepper__content-panel\"\n        [class.mlv-stepper__content-panel--active]=\"_stateFor(step) === 'active'\"\n        role=\"tabpanel\"\n        [attr.aria-label]=\"step.label()\"\n        [attr.inert]=\"_stateFor(step) !== 'active' ? '' : null\"\n      >\n        <div class=\"mlv-stepper__content-panel-inner\">\n          <div class=\"mlv-stepper__vertical-content\">\n            <ng-template [ngTemplateOutlet]=\"step.contentTpl()\" />\n          </div>\n        </div>\n      </div>\n    </div>\n    }\n  </div>\n</div>\n} @else {\n<!-- Horizontal layout: step headers in a row, shared content panel below. -->\n<div\n  class=\"mlv-stepper__header\"\n  role=\"tablist\"\n  tabindex=\"-1\"\n  [attr.aria-orientation]=\"orientation()\"\n  (keydown)=\"_onHeaderKeydown($event)\"\n>\n  @for (step of _stepList(); track step._index; let last = $last) {\n  <div\n    class=\"mlv-stepper__header-item\"\n    [class.mlv-stepper__header-item--deviative]=\"step.deviative()\"\n  >\n    <!-- Step trigger button -->\n    <div\n      mlvStepHeader\n      #sh=\"mlvStepHeader\"\n      [isDisabled]=\"!_isClickable(step)\"\n      [attr.tabindex]=\"sh.tabIndex()\"\n      class=\"mlv-stepper__step-header\"\n      [class.mlv-stepper__step-header--active]=\"_stateFor(step) === 'active'\"\n      [class.mlv-stepper__step-header--completed]=\"_stateFor(step) === 'completed'\"\n      [class.mlv-stepper__step-header--error]=\"_stateFor(step) === 'error'\"\n      [class.mlv-stepper__step-header--pending]=\"_stateFor(step) === 'pending'\"\n      [class.mlv-stepper__step-header--deviative]=\"step.deviative()\"\n      [class.mlv-stepper__step-header--clickable]=\"_isClickable(step)\"\n      role=\"tab\"\n      [attr.aria-label]=\"step.label()\"\n      [attr.aria-selected]=\"_stateFor(step) === 'active'\"\n      [attr.aria-disabled]=\"!_isClickable(step) || null\"\n      (click)=\"_isClickable(step) && selectStep(step._index)\"\n      (keydown.enter)=\"_isClickable(step) && selectStep(step._index)\"\n      (keydown.space)=\"_isClickable(step) && selectStep(step._index); $event.preventDefault()\"\n    >\n      <!-- Indicator circle -->\n      <div class=\"mlv-stepper__indicator\" aria-hidden=\"true\">\n        @if (_stateFor(step) === 'completed') {\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            d=\"M3 8L6.5 11.5L13 5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </svg>\n        } @else if (_stateFor(step) === 'error') {\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            d=\"M8 5V8.5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n          />\n          <circle cx=\"8\" cy=\"11\" r=\"0.75\" fill=\"currentColor\" />\n        </svg>\n        } @else {\n        <span>{{ step._index + 1 }}</span>\n        } @if (step.deviative()) {\n        <span class=\"mlv-stepper__deviative-badge\" aria-hidden=\"true\">\n          <svg\n            viewBox=\"0 0 10 10\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path d=\"M5 1.5L9 8.5H1L5 1.5Z\" fill=\"currentColor\" />\n          </svg>\n        </span>\n        }\n      </div>\n\n      <!-- Label + description -->\n      <div class=\"mlv-stepper__label-group\">\n        <span class=\"mlv-stepper__label\">{{ step.label() }}</span>\n        @if (step.optional()) {\n        <span class=\"mlv-stepper__optional-tag\">{{ _i18n().optional }}</span>\n        } @if (step.description()) {\n        <span class=\"mlv-stepper__description\">{{ step.description() }}</span>\n        }\n      </div>\n    </div>\n\n    <!-- Connector (between steps in horizontal layout) -->\n    @if (!last) {\n    <div\n      class=\"mlv-stepper__connector\"\n      [class.mlv-stepper__connector--completed]=\"_stateFor(step) === 'completed'\"\n      [class.mlv-stepper__connector--deviative]=\"step.deviative() && !step.deviationResolved()\"\n      aria-hidden=\"true\"\n    ></div>\n    }\n  </div>\n  }\n</div>\n\n<!-- Mobile compact: step counter (horizontal only) -->\n<div class=\"mlv-stepper__mobile-counter\" aria-hidden=\"true\">\n  <span class=\"mlv-stepper__mobile-label\">\n    Step {{ activeIndex() + 1 }} of {{ _stepList().length }}: {{\n    _stepList()[activeIndex()]?.label() }}\n  </span>\n</div>\n\n<!-- Shared content area below the header row -->\n@for (step of _stepList(); track step._index) { @if (_stateFor(step) ===\n'active') {\n<div\n  class=\"mlv-stepper__content-panel mlv-stepper__content-panel--active\"\n  role=\"tabpanel\"\n  [attr.aria-label]=\"step.label()\"\n>\n  <ng-template [ngTemplateOutlet]=\"step.contentTpl()\" />\n</div>\n} } }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}