import * as i0 from '@angular/core';
import { booleanAttribute, Input, ViewEncapsulation, Component, inject, Injectable, EventEmitter, ViewChildren, ContentChildren, Output } from '@angular/core';
import { uniqueId, consumeEvent } from '@eui/core';
import * as i1 from '@eui/components/eui-icon';
import { EUI_ICON } from '@eui/components/eui-icon';
import { Router } from '@angular/router';
import { Subject, takeUntil } from 'rxjs';

/**
 * @ignore
 * @internal
 */
class EuiWizardStepComponent {
    constructor() {
        this.isCompleted = false;
        this.isActive = false;
        this.isShowStepTitle = false;
        this.isInvalid = false;
        this.isWarning = false;
        this.isDisabled = false;
    }
    /**
     * TODO: from which one is this method being used from?
     */
    toJSON() {
        return {
            id: this.id,
            indexLabel: this.indexLabel,
            indexIconSvgName: this.indexIconSvgName,
            label: this.label,
            subLabel: this.subLabel,
            isCompleted: this.isCompleted,
            isActive: this.isActive,
            isShowStepTitle: this.isShowStepTitle,
            isInvalid: this.isInvalid,
            isWarning: this.isWarning,
            isDisabled: this.isDisabled,
            index: this.index,
            url: this.url,
        };
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: EuiWizardStepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: EuiWizardStepComponent, isStandalone: true, selector: "eui-wizard-step", inputs: { id: "id", indexLabel: "indexLabel", indexIconSvgName: "indexIconSvgName", label: "label", subLabel: "subLabel", index: "index", url: "url", isCompleted: ["isCompleted", "isCompleted", booleanAttribute], isActive: ["isActive", "isActive", booleanAttribute], isShowStepTitle: ["isShowStepTitle", "isShowStepTitle", booleanAttribute], isInvalid: ["isInvalid", "isInvalid", booleanAttribute], isWarning: ["isWarning", "isWarning", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute] }, ngImport: i0, template: "@if(isActive) {\n    <ng-content />\n}\n", encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: EuiWizardStepComponent, decorators: [{
            type: Component,
            args: [{ selector: 'eui-wizard-step', encapsulation: ViewEncapsulation.None, template: "@if(isActive) {\n    <ng-content />\n}\n" }]
        }], propDecorators: { id: [{
                type: Input
            }], indexLabel: [{
                type: Input
            }], indexIconSvgName: [{
                type: Input
            }], label: [{
                type: Input
            }], subLabel: [{
                type: Input
            }], index: [{
                type: Input
            }], url: [{
                type: Input
            }], isCompleted: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], isActive: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], isShowStepTitle: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], isInvalid: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], isWarning: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], isDisabled: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }] } });

/**
 * @ignore
 * @internal
 */
class EuiWizardService {
    constructor() {
        this.activeStepIndex = 1;
        this.steps = [];
        this.router = inject(Router);
    }
    init(steps, route) {
        this.steps = steps;
        this.route = route;
        const currentRoute = this.router.url;
        const currentStepUrl = currentRoute.substr(currentRoute.lastIndexOf('/') + 1);
        this.steps.forEach((step, index) => {
            if (step.url === currentStepUrl) {
                this.activeStepIndex = index + 1;
            }
        });
    }
    navigationIncrement(increment) {
        const newIndex = this.activeStepIndex + increment;
        if (newIndex >= 1 && newIndex <= this.steps.length) {
            this.activeStepIndex = newIndex;
        }
    }
    selectStep(step) {
        this.activeStepIndex = step.index;
        if (step.url) {
            this._navigateToStep(step.url);
        }
    }
    _navigateToStep(url) {
        this.router.navigate([url], { relativeTo: this.route });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: EuiWizardService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: EuiWizardService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: EuiWizardService, decorators: [{
            type: Injectable
        }] });

/**
 * @ignore
 * @internal
 * @description
 * Enhanced wizard component (version 2) for guiding users through sequential processes or forms.
 * Displays step indicators with navigation controls and manages step activation state.
 * Supports keyboard navigation, custom content mode, and programmatic step selection.
 * Provides both declarative (content children) and programmatic (steps array) configuration.
 * Commonly used for onboarding flows, multi-page forms, checkout processes, and guided workflows.
 *
 * @usageNotes
 * ### Basic Usage
 * ```html
 * <eui-wizard [activeStepIndex]="1" (selectStep)="onStepChange($event)">
 *   <eui-wizard-step label="Account Details">
 *     <form><!-- step 1 content --></form>
 *   </eui-wizard-step>
 *   <eui-wizard-step label="Preferences">
 *     <form><!-- step 2 content --></form>
 *   </eui-wizard-step>
 *   <eui-wizard-step label="Confirmation">
 *     <div><!-- step 3 content --></div>
 *   </eui-wizard-step>
 * </eui-wizard>
 * ```
 *
 * ### Custom Content Mode
 * ```html
 * <eui-wizard
 *   [isCustomContent]="true"
 *   [steps]="wizardSteps"
 *   [activeStepIndex]="currentStep">
 * </eui-wizard>
 *
 * <!-- Render step content externally -->
 * <div *ngIf="currentStep === 1">Step 1 Content</div>
 * <div *ngIf="currentStep === 2">Step 2 Content</div>
 * ```
 *
 * ### Accessibility
 * - Use role="navigation" with aria-label describing the wizard
 * - Each step has clear labels and state indicators
 * - Keyboard navigation: Arrow keys to move between steps
 * - Current step is announced to screen readers
 *
 * ### Notes
 * - activeStepIndex is 1-based (first step is 1, not 0)
 * - isCustomContent mode displays only step indicators
 * - isShowStepTitle displays step labels below indicators
 * - isNavigationAllowed controls whether users can click steps directly
 * - Version 2 provides enhanced features over original wizard
 */
class EuiWizardComponent {
    constructor() {
        this.steps = [];
        this.tabindex = 0;
        this.e2eAttr = 'eui-wizard';
        this.selectStep = new EventEmitter();
        this.stepContentId = uniqueId();
        this.isCustomContent = false;
        this.isShowStepTitle = false;
        this.isNavigationAllowed = true;
        this.destroy$ = new Subject();
    }
    ngOnChanges(changes) {
        if (changes['steps'] || changes['activeStepIndex']) {
            if (this.activeStepIndex && this.steps) {
                this._selectStep(this._getStep(this.activeStepIndex - 1), this.activeStepIndex);
                const stepIdsBuffer = [];
                this.steps.forEach((step) => {
                    if (!step.id) {
                        step.id = uniqueId();
                    }
                    stepIdsBuffer.push(step.id);
                });
                this.stepIds = stepIdsBuffer.join(' ');
            }
        }
    }
    ngAfterViewInit() {
        this.childrenSteps.changes.pipe(takeUntil(this.destroy$)).subscribe((childrenSteps) => {
            this.rebuildSteps(childrenSteps);
        });
    }
    ngAfterContentInit() {
        this.rebuildSteps(this.childrenSteps);
    }
    ngOnDestroy() {
        this.destroy$.next(true);
        this.destroy$.unsubscribe();
    }
    onSelectStep(step, index) {
        if (!step.isDisabled && this.isNavigationAllowed) {
            this._selectStep(step, index);
        }
    }
    onKeyDown(event) {
        if (this.isNavigationAllowed) {
            switch (event.key) {
                case 'ArrowLeft':
                    consumeEvent(event);
                    this.selectPreviousStep();
                    break;
                case 'ArrowRight':
                    consumeEvent(event);
                    this.selectNextStep();
                    break;
            }
        }
    }
    selectPreviousStep() {
        if (this.isNavigationAllowed && this.steps) {
            // get the index of active step
            const activeStepIndex = this.steps.findIndex((step) => step.isActive);
            let previousIndex = activeStepIndex < 0 ? 0 : activeStepIndex;
            do {
                previousIndex--;
                if (previousIndex < 0) {
                    previousIndex = this.steps.length - 1;
                }
            } while (this.steps[previousIndex].isDisabled);
            this._selectStep(this.steps[previousIndex], previousIndex + 1);
            this.canBeFocused.toArray()[previousIndex].nativeElement.focus();
        }
    }
    selectNextStep() {
        if (this.isNavigationAllowed && this.steps) {
            // get the index of active step
            let activeStepIndex = this.steps.findIndex((step) => step.isActive);
            // in case no step is active point to the first step
            activeStepIndex = activeStepIndex < 0 ? 0 : activeStepIndex;
            do {
                if (++activeStepIndex >= this.steps.length) {
                    activeStepIndex = 0;
                }
            } while (this.steps[activeStepIndex].isDisabled);
            this._selectStep(this.steps[activeStepIndex], activeStepIndex + 1);
            this.canBeFocused.toArray()[activeStepIndex].nativeElement.focus();
        }
    }
    _selectStep(step, index) {
        if (step) {
            this.steps.forEach((currentStep) => (currentStep.isActive = false));
            step.isActive = true;
            step.index = index;
            this.selectStep.emit(step);
        }
    }
    rebuildSteps(childrenSteps) {
        this.steps = [];
        const stepIdsBuffer = [];
        childrenSteps.forEach((step) => {
            this.steps.push(step);
            if (!step.id) {
                step.id = uniqueId();
            }
            step.isShowStepTitle = this.isShowStepTitle;
            stepIdsBuffer.push(step.id);
        });
        this.stepIds = stepIdsBuffer.join(' ');
        const activeIndex = this.activeStepIndex
            ? this.activeStepIndex - 1
            : this.steps.findIndex((s) => s.isActive);
        this._selectStep(this._getStep(activeIndex >= 0 ? activeIndex : 0), (activeIndex >= 0 ? activeIndex : 0) + 1);
    }
    _getStep(index) {
        if (index >= 0 && index <= this.steps.length) {
            return this.steps[index];
        }
        return null;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: EuiWizardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: EuiWizardComponent, isStandalone: true, selector: "eui-wizard", inputs: { activeStepIndex: "activeStepIndex", steps: "steps", tabindex: "tabindex", e2eAttr: "e2eAttr", isCustomContent: ["isCustomContent", "isCustomContent", booleanAttribute], isShowStepTitle: ["isShowStepTitle", "isShowStepTitle", booleanAttribute], isNavigationAllowed: ["isNavigationAllowed", "isNavigationAllowed", booleanAttribute] }, outputs: { selectStep: "selectStep" }, providers: [EuiWizardService], queries: [{ propertyName: "childrenSteps", predicate: EuiWizardStepComponent }], viewQueries: [{ propertyName: "canBeFocused", predicate: ["canBeFocused"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"eui-wizard\" role=\"tablist\" aria-orientation=\"horizontal\" attr.data-e2e=\"{{ e2eAttr }}\">\n    @for (step of steps; track step.id; let idx = $index) {\n        <div\n            #canBeFocused\n            class=\"eui-wizard-step\"\n            role=\"tab\"\n            [id]=\"step.id\"\n            attr.aria-label=\"{{ step?.label }} {{ step?.subLabel }}\"\n            [attr.aria-disabled]=\"step?.isDisabled\"\n            [attr.aria-controls]=\"stepContentId\"\n            [attr.aria-describedby]=\"step?.isActive? stepContentId: null\"\n            [attr.aria-selected]=\"step?.isActive\"\n            [tabindex]=\"!isNavigationAllowed ? -1 : tabindex\"\n            [class.eui-wizard-step--completed]=\"step?.isCompleted\"\n            [class.eui-wizard-step--notallowed]=\"!isNavigationAllowed\"\n            [class.eui-wizard-step--active]=\"step?.isActive\"\n            [class.eui-wizard-step--disabled]=\"step?.isDisabled\"\n            [class.eui-wizard-step--error]=\"step?.isInvalid\"\n            [class.eui--danger]=\"step?.isInvalid\"\n            [class.eui-wizard-step--warning]=\"step?.isWarning\"\n            [class.eui--warning]=\"step?.isWarning\"\n            (click)=\"onSelectStep(step, idx + 1)\"\n            (keydown)=\"onKeyDown($event)\">\n\n            <div class=\"eui-wizard-step-item\" role=\"presentation\">\n                <div class=\"eui-wizard-step-item-number\" role=\"presentation\">\n                    @if(!step?.indexIconSvgName) {\n                        @if (step?.isCompleted) {\n                            <eui-icon-svg icon=\"eui-checkmark\" />\n                        }\n                        @if (step?.isInvalid) {\n                            <eui-icon-svg icon=\"eui-alert\" />\n                        }\n                    } @else {\n                        @if(step?.indexIconSvgName && step?.indexIconSvgName !== undefined) {\n                            <eui-icon-svg icon=\"{{ step?.indexIconSvgName }}\" class=\"eui-wizard-step__icon\" role=\"presentation\" />\n                        }\n                    }\n\n                    @if(!step?.indexIconSvgName && !step?.isCompleted && !step?.isInvalid) {\n                        <span role=\"presentation\">\n                            {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\n                        </span>\n                    }\n                </div>\n                <div class=\"eui-wizard-step-item-label-wrapper\" role=\"presentation\">\n                    <div class=\"eui-wizard-step-item-label\" role=\"presentation\">\n                        {{ step?.label }}\n                    </div>\n                    <div class=\"eui-wizard-step-item-sub-label\" role=\"presentation\">\n                        {{ step?.subLabel }}\n                    </div>\n                </div>                \n            </div>\n\n            <div class=\"eui-wizard-step-separator\" role=\"presentation\"></div>\n        </div>\n    }\n</div>\n<div [id]=\"stepContentId\" class=\"step-content\" role=\"tabpanel\">\n    <ng-content></ng-content>\n</div>\n", styles: [".eui-21 .eui-wizard{position:relative;display:flex;justify-content:space-between;padding:var(--eui-s-m) 0}.eui-21 .eui-wizard-step{position:relative;display:flex;flex:1 1 auto;align-items:self-start}.eui-21 .eui-wizard-step:last-child{flex-grow:0}.eui-21 .eui-wizard-step:last-child .eui-wizard-step-separator{display:none}.eui-21 .eui-wizard-step-item{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;cursor:pointer}.eui-21 .eui-wizard-step-item-number{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-surface-container);border:var(--eui-bw-xs) solid var(--eui-c-secondary-border);border-color:var(--eui-c-secondary-border);border-radius:var(--eui-br-max);height:var(--eui-s-4xl);width:var(--eui-s-4xl)}.eui-21 .eui-wizard-step-item-number .eui-icon-svg>svg{color:var(--eui-c-text);fill:var(--eui-c-text)}.eui-21 .eui-wizard-step-item-label-wrapper{display:flex;text-align:center;margin-top:var(--eui-s-m);flex-direction:column}.eui-21 .eui-wizard-step-item-label{color:var(--eui-c-text-light);font:var(--eui-f-m-semi-bold)}.eui-21 .eui-wizard-step-item-sub-label{color:var(--eui-c-text-lighter);font-size:95%;margin-top:var(--eui-s-3xs)}.eui-21 .eui-wizard-step-separator{flex:1 1 0;background:var(--eui-c-black);width:100%;height:var(--eui-s-4xs);margin-top:var(--eui-s-m)}.eui-21 .eui-wizard-step--completed .eui-wizard-step-item-number,.eui-21 .eui-wizard-step--active .eui-wizard-step-item-number{background-color:var(--eui-c-primary-surface);color:var(--eui-c-primary-on-surface)}.eui-21 .eui-wizard-step--completed .eui-wizard-step-item-number .eui-icon-svg>svg,.eui-21 .eui-wizard-step--active .eui-wizard-step-item-number .eui-icon-svg>svg{color:var(--eui-c-primary-on-surface);fill:var(--eui-c-primary-on-surface)}.eui-21 .eui-wizard-step--completed .eui-wizard-step-separator{background:var(--eui-c-primary-surface);height:var(--eui-s-3xs)}.eui-21 .eui-wizard-step--active .eui-wizard-step-item-label{color:var(--eui-c-primary)}.eui-21 .eui-wizard-step--active .eui-wizard-step-item-sub-label{color:var(--eui-c-primary-light)}.eui-21 .eui-wizard-step--error .eui-wizard-step-item-label{color:var(--eui-c-danger)}.eui-21 .eui-wizard-step--error .eui-wizard-step-item-sub-label{color:var(--eui-c-danger-light)}.eui-21 .eui-wizard-step--warning .eui-wizard-step-item-label{color:var(--eui-c-warning)}.eui-21 .eui-wizard-step--warning .eui-wizard-step-item-sub-label{color:var(--eui-c-warning-light)}.eui-21 .eui-wizard-step--disabled{background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-21 .eui-wizard-step--disabled:hover{cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: i1.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "ariaLabel", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: EuiWizardComponent, decorators: [{
            type: Component,
            args: [{ selector: 'eui-wizard', encapsulation: ViewEncapsulation.None, providers: [EuiWizardService], imports: [
                        ...EUI_ICON,
                    ], template: "<div class=\"eui-wizard\" role=\"tablist\" aria-orientation=\"horizontal\" attr.data-e2e=\"{{ e2eAttr }}\">\n    @for (step of steps; track step.id; let idx = $index) {\n        <div\n            #canBeFocused\n            class=\"eui-wizard-step\"\n            role=\"tab\"\n            [id]=\"step.id\"\n            attr.aria-label=\"{{ step?.label }} {{ step?.subLabel }}\"\n            [attr.aria-disabled]=\"step?.isDisabled\"\n            [attr.aria-controls]=\"stepContentId\"\n            [attr.aria-describedby]=\"step?.isActive? stepContentId: null\"\n            [attr.aria-selected]=\"step?.isActive\"\n            [tabindex]=\"!isNavigationAllowed ? -1 : tabindex\"\n            [class.eui-wizard-step--completed]=\"step?.isCompleted\"\n            [class.eui-wizard-step--notallowed]=\"!isNavigationAllowed\"\n            [class.eui-wizard-step--active]=\"step?.isActive\"\n            [class.eui-wizard-step--disabled]=\"step?.isDisabled\"\n            [class.eui-wizard-step--error]=\"step?.isInvalid\"\n            [class.eui--danger]=\"step?.isInvalid\"\n            [class.eui-wizard-step--warning]=\"step?.isWarning\"\n            [class.eui--warning]=\"step?.isWarning\"\n            (click)=\"onSelectStep(step, idx + 1)\"\n            (keydown)=\"onKeyDown($event)\">\n\n            <div class=\"eui-wizard-step-item\" role=\"presentation\">\n                <div class=\"eui-wizard-step-item-number\" role=\"presentation\">\n                    @if(!step?.indexIconSvgName) {\n                        @if (step?.isCompleted) {\n                            <eui-icon-svg icon=\"eui-checkmark\" />\n                        }\n                        @if (step?.isInvalid) {\n                            <eui-icon-svg icon=\"eui-alert\" />\n                        }\n                    } @else {\n                        @if(step?.indexIconSvgName && step?.indexIconSvgName !== undefined) {\n                            <eui-icon-svg icon=\"{{ step?.indexIconSvgName }}\" class=\"eui-wizard-step__icon\" role=\"presentation\" />\n                        }\n                    }\n\n                    @if(!step?.indexIconSvgName && !step?.isCompleted && !step?.isInvalid) {\n                        <span role=\"presentation\">\n                            {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\n                        </span>\n                    }\n                </div>\n                <div class=\"eui-wizard-step-item-label-wrapper\" role=\"presentation\">\n                    <div class=\"eui-wizard-step-item-label\" role=\"presentation\">\n                        {{ step?.label }}\n                    </div>\n                    <div class=\"eui-wizard-step-item-sub-label\" role=\"presentation\">\n                        {{ step?.subLabel }}\n                    </div>\n                </div>                \n            </div>\n\n            <div class=\"eui-wizard-step-separator\" role=\"presentation\"></div>\n        </div>\n    }\n</div>\n<div [id]=\"stepContentId\" class=\"step-content\" role=\"tabpanel\">\n    <ng-content></ng-content>\n</div>\n", styles: [".eui-21 .eui-wizard{position:relative;display:flex;justify-content:space-between;padding:var(--eui-s-m) 0}.eui-21 .eui-wizard-step{position:relative;display:flex;flex:1 1 auto;align-items:self-start}.eui-21 .eui-wizard-step:last-child{flex-grow:0}.eui-21 .eui-wizard-step:last-child .eui-wizard-step-separator{display:none}.eui-21 .eui-wizard-step-item{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;cursor:pointer}.eui-21 .eui-wizard-step-item-number{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-surface-container);border:var(--eui-bw-xs) solid var(--eui-c-secondary-border);border-color:var(--eui-c-secondary-border);border-radius:var(--eui-br-max);height:var(--eui-s-4xl);width:var(--eui-s-4xl)}.eui-21 .eui-wizard-step-item-number .eui-icon-svg>svg{color:var(--eui-c-text);fill:var(--eui-c-text)}.eui-21 .eui-wizard-step-item-label-wrapper{display:flex;text-align:center;margin-top:var(--eui-s-m);flex-direction:column}.eui-21 .eui-wizard-step-item-label{color:var(--eui-c-text-light);font:var(--eui-f-m-semi-bold)}.eui-21 .eui-wizard-step-item-sub-label{color:var(--eui-c-text-lighter);font-size:95%;margin-top:var(--eui-s-3xs)}.eui-21 .eui-wizard-step-separator{flex:1 1 0;background:var(--eui-c-black);width:100%;height:var(--eui-s-4xs);margin-top:var(--eui-s-m)}.eui-21 .eui-wizard-step--completed .eui-wizard-step-item-number,.eui-21 .eui-wizard-step--active .eui-wizard-step-item-number{background-color:var(--eui-c-primary-surface);color:var(--eui-c-primary-on-surface)}.eui-21 .eui-wizard-step--completed .eui-wizard-step-item-number .eui-icon-svg>svg,.eui-21 .eui-wizard-step--active .eui-wizard-step-item-number .eui-icon-svg>svg{color:var(--eui-c-primary-on-surface);fill:var(--eui-c-primary-on-surface)}.eui-21 .eui-wizard-step--completed .eui-wizard-step-separator{background:var(--eui-c-primary-surface);height:var(--eui-s-3xs)}.eui-21 .eui-wizard-step--active .eui-wizard-step-item-label{color:var(--eui-c-primary)}.eui-21 .eui-wizard-step--active .eui-wizard-step-item-sub-label{color:var(--eui-c-primary-light)}.eui-21 .eui-wizard-step--error .eui-wizard-step-item-label{color:var(--eui-c-danger)}.eui-21 .eui-wizard-step--error .eui-wizard-step-item-sub-label{color:var(--eui-c-danger-light)}.eui-21 .eui-wizard-step--warning .eui-wizard-step-item-label{color:var(--eui-c-warning)}.eui-21 .eui-wizard-step--warning .eui-wizard-step-item-sub-label{color:var(--eui-c-warning-light)}.eui-21 .eui-wizard-step--disabled{background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-o-50)}.eui-21 .eui-wizard-step--disabled:hover{cursor:not-allowed}\n"] }]
        }], propDecorators: { activeStepIndex: [{
                type: Input
            }], steps: [{
                type: Input
            }], tabindex: [{
                type: Input
            }], e2eAttr: [{
                type: Input
            }], selectStep: [{
                type: Output
            }], childrenSteps: [{
                type: ContentChildren,
                args: [EuiWizardStepComponent]
            }], canBeFocused: [{
                type: ViewChildren,
                args: ['canBeFocused']
            }], isCustomContent: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], isShowStepTitle: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], isNavigationAllowed: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }] } });

/**
 * @ignore
 * @internal
 */
class EuiWizardStep {
    // TODO:  find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    constructor(values = {}) {
        this.isCompleted = false;
        this.isActive = false;
        this.isShowStepTitle = false;
        this.isInvalid = false;
        this.isWarning = false;
        this.isDisabled = false;
        Object.assign(this, values);
    }
    toString() {
        return JSON.stringify(this.toJSON());
    }
    toJSON() {
        return {
            id: this.id,
            indexLabel: this.indexLabel,
            indexIconSvgName: this.indexIconSvgName,
            label: this.label,
            subLabel: this.subLabel,
            isCompleted: this.isCompleted,
            isActive: this.isActive,
            isShowStepTitle: this.isShowStepTitle,
            isInvalid: this.isInvalid,
            isWarning: this.isWarning,
            isDisabled: this.isDisabled,
            index: this.index,
            url: this.url,
        };
    }
}

const EUI_WIZARD_V2 = [
    EuiWizardStepComponent,
    EuiWizardComponent,
];

/**
 * Generated bundle index. Do not edit.
 */

export { EUI_WIZARD_V2, EuiWizardComponent, EuiWizardService, EuiWizardStep, EuiWizardStepComponent };
//# sourceMappingURL=eui-components-eui-wizard-v2.mjs.map
