// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
//  of this software and associated documentation files (the "Software"), to
//  deal in the Software without restriction, including without limitation the
//  rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
//  sell copies of the Software, and to permit persons to whom the Software is
//  furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
//  all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
//  THE SOFTWARE.
import { Directionality } from "@angular/cdk/bidi";
import { CdkStepper } from "@angular/cdk/stepper";
import { DOCUMENT } from "@angular/common";
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, Inject, Input, Optional, ViewEncapsulation, } from "@angular/core";
import { WizardDirective } from "../wizard.directive";
import * as i0 from "@angular/core";
import * as i1 from "@angular/cdk/bidi";
import * as i2 from "../wizard-step-header/wizard-step-header.component";
import * as i3 from "../wizard-footer/wizard-footer.component";
import * as i4 from "@angular/common";
/**  ignore should be removed in scope of the NUI-6099 */
/** @ignore */
export class WizardVerticalComponent extends WizardDirective {
    constructor(dir, changeDetectorRef, elementRef, _document) {
        super(dir, changeDetectorRef, elementRef, _document);
        this._orientation = "vertical";
    }
    get selectedIndex() {
        return super.selectedIndex;
    }
    set selectedIndex(value) {
        super.selectedIndex = value;
    }
}
WizardVerticalComponent.ngAcceptInputTypeEditable = undefined;
WizardVerticalComponent.ngAcceptInputTypeOptional = undefined;
WizardVerticalComponent.ngAcceptInputTypeCompleted = undefined;
WizardVerticalComponent.ngAcceptInputTypeHasError = undefined;
WizardVerticalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: WizardVerticalComponent, deps: [{ token: i1.Directionality, optional: true }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
WizardVerticalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: WizardVerticalComponent, selector: "nui-wizard-vertical", inputs: { selectedIndex: "selectedIndex" }, host: { attributes: { "aria-orientation": "vertical", "role": "tablist" }, classAttribute: "nui-wizard-vertical-layout" }, providers: [
        { provide: WizardDirective, useExisting: WizardVerticalComponent },
        { provide: CdkStepper, useExisting: WizardVerticalComponent },
    ], exportAs: ["wizardVertical"], usesInheritance: true, ngImport: i0, template: "<div\n    class=\"nui-wizard-vertical-header-container\"\n    *ngFor=\"let step of steps; let i = index; let isLast = last\"\n>\n    <nui-wizard-step-header\n        class=\"nui-wizard-vertical-header\"\n        (click)=\"step.select()\"\n        (keydown)=\"_onKeydown($event)\"\n        [tabIndex]=\"_getFocusIndex() === i ? 0 : -1\"\n        [id]=\"labelIds[i]\"\n        [attr.aria-posinset]=\"i + 1\"\n        [attr.aria-setsize]=\"steps.length\"\n        [attr.aria-controls]=\"stepContentIds[i]\"\n        [attr.aria-selected]=\"selectedIndex === i\"\n        [attr.aria-label]=\"step.ariaLabel || null\"\n        [attr.aria-labelledby]=\"\n            !step.ariaLabel && step.ariaLabelledby ? step.ariaLabelledby : null\n        \"\n        [index]=\"i\"\n        [label]=\"step.stepLabel || step.label\"\n        [selected]=\"selectedIndex === i\"\n        [active]=\"step.completed || selectedIndex === i || !linear\"\n        [errorMessage]=\"step.errorMessage\"\n    >\n    </nui-wizard-step-header>\n\n    <div\n        class=\"nui-wizard-vertical-content-container\"\n        [class.nui-wizard-vertical-line]=\"!isLast\"\n    >\n        <div\n            class=\"nui-wizard-vertical-content\"\n            role=\"tabpanel\"\n            [attr.tabindex]=\"selectedIndex === i ? 0 : null\"\n            [id]=\"_getStepContentId(i)\"\n            [attr.aria-labelledby]=\"_getStepLabelId(i)\"\n            [attr.aria-expanded]=\"selectedIndex === i\"\n        >\n            <div class=\"nui-wizard-vertical-content\">\n                <ng-container [ngTemplateOutlet]=\"step.content\"></ng-container>\n            </div>\n        </div>\n    </div>\n</div>\n\n<div *ngIf=\"selected.stepFooter\" class=\"nui-wizard-vertical-footer-container\">\n    <wizard-footer [footer]=\"selected.stepFooter\"></wizard-footer>\n</div>\n", styles: [".nui-wizard-vertical,.nui-wizard-horizontal{display:block}.nui-dialog .nui-wizard-vertical,.nui-dialog .nui-wizard-horizontal{padding-top:0}.nui-dialog .nui-wizard-vertical .nui-wizard-horizontal-header-container,.nui-dialog .nui-wizard-horizontal .nui-wizard-horizontal-header-container{border-top:none}.nui-wizard-horizontal-header{display:flex;min-height:32px;max-height:72px;align-items:center}.nui-popover-container__content .nui-wizard-horizontal-header{flex-flow:row-reverse;justify-content:flex-end;padding:0;min-height:17px}[dir=rtl] .nui-wizard-horizontal-header .nui-wizard-step-header-icon{margin-right:0;margin-left:0}.nui-popover-container__content .nui-wizard-horizontal-header .nui-wizard-step-header-icon{margin-right:5px}.nui-wizard-step-header__label-position--top .nui-wizard-horizontal-header{flex-direction:column;height:auto}.nui-wizard-step-header__label-position--top .nui-wizard-horizontal-header .nui-wizard-step-header-icon{margin-right:0;margin-left:0}.nui-wizard-horizontal-header-container{display:flex;justify-content:center;text-align:center;padding:10px;border:1px solid;border-left:none;border-right:none;overflow:hidden;white-space:nowrap;align-items:center;background-color:var(--nui-color-bg-secondary,#fafafa);border-color:var(--nui-color-line-default,#d9d9d9);-webkit-user-select:none;-o-user-select:none;user-select:none}.nui-wizard-horizontal-header-wrapper{position:relative}.nui-popover-container__content .nui-wizard-horizontal-header-wrapper:not(:last-child){margin-bottom:5px}.nui-popover-container__content .nui-wizard-horizontal-header-wrapper:hover{background-color:var(--nui-color-bg-secondary,#fafafa)}.nui-wizard-horizontal__step-connector-line{border-top-width:2px;border-top-style:solid;border-color:var(--nui-color-line-default,#d9d9d9)}.nui-wizard-horizontal__step-connector-line--completed{border-color:var(--nui-color-text-link,#0079aa)}.nui-wizard-step-header__label-position--top .nui-wizard-horizontal__step-connector-line{bottom:8px;right:80.5px;width:129px;position:absolute}.nui-popover-container__content .nui-wizard-horizontal__step-connector-line{position:absolute;top:-6px;left:7px;height:6px;border-left-width:1px;border-left-style:solid;border-top:none;border-bottom:none;border-right:none}.nui-wizard-horizontal-content{outline:0}.nui-wizard-horizontal-content[aria-expanded=false]{height:0;overflow:hidden}.nui-wizard-horizontal-content-container{overflow:hidden}.nui-wizard-vertical-content{outline:0;overflow:hidden}.nui-wizard-vertical-content-container{margin-left:36px;border:0;position:relative}[dir=rtl] .nui-wizard-vertical-content-container{margin-left:0;margin-right:36px}.nui-wizard-vertical-line:before{content:\"\";position:absolute;left:0;border-left-width:2px;border-left-style:solid}[dir=rtl] .nui-wizard-vertical-line:before{left:auto;right:0}.nui-step:last-child .nui-wizard-vertical-content-container{border:none}\n"], components: [{ type: i2.WizardStepHeaderComponent, selector: "nui-wizard-step-header", inputs: ["stepStateConfig", "label", "optionalLabel", "errorMessage", "index", "selected", "active", "step"] }, { type: i3.WizardFooterComponent, selector: "wizard-footer", inputs: ["footer"] }], directives: [{ type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: WizardVerticalComponent, decorators: [{
            type: Component,
            args: [{ selector: "nui-wizard-vertical", exportAs: "wizardVertical", host: {
                        class: "nui-wizard-vertical-layout",
                        "aria-orientation": "vertical",
                        role: "tablist",
                    }, providers: [
                        { provide: WizardDirective, useExisting: WizardVerticalComponent },
                        { provide: CdkStepper, useExisting: WizardVerticalComponent },
                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    class=\"nui-wizard-vertical-header-container\"\n    *ngFor=\"let step of steps; let i = index; let isLast = last\"\n>\n    <nui-wizard-step-header\n        class=\"nui-wizard-vertical-header\"\n        (click)=\"step.select()\"\n        (keydown)=\"_onKeydown($event)\"\n        [tabIndex]=\"_getFocusIndex() === i ? 0 : -1\"\n        [id]=\"labelIds[i]\"\n        [attr.aria-posinset]=\"i + 1\"\n        [attr.aria-setsize]=\"steps.length\"\n        [attr.aria-controls]=\"stepContentIds[i]\"\n        [attr.aria-selected]=\"selectedIndex === i\"\n        [attr.aria-label]=\"step.ariaLabel || null\"\n        [attr.aria-labelledby]=\"\n            !step.ariaLabel && step.ariaLabelledby ? step.ariaLabelledby : null\n        \"\n        [index]=\"i\"\n        [label]=\"step.stepLabel || step.label\"\n        [selected]=\"selectedIndex === i\"\n        [active]=\"step.completed || selectedIndex === i || !linear\"\n        [errorMessage]=\"step.errorMessage\"\n    >\n    </nui-wizard-step-header>\n\n    <div\n        class=\"nui-wizard-vertical-content-container\"\n        [class.nui-wizard-vertical-line]=\"!isLast\"\n    >\n        <div\n            class=\"nui-wizard-vertical-content\"\n            role=\"tabpanel\"\n            [attr.tabindex]=\"selectedIndex === i ? 0 : null\"\n            [id]=\"_getStepContentId(i)\"\n            [attr.aria-labelledby]=\"_getStepLabelId(i)\"\n            [attr.aria-expanded]=\"selectedIndex === i\"\n        >\n            <div class=\"nui-wizard-vertical-content\">\n                <ng-container [ngTemplateOutlet]=\"step.content\"></ng-container>\n            </div>\n        </div>\n    </div>\n</div>\n\n<div *ngIf=\"selected.stepFooter\" class=\"nui-wizard-vertical-footer-container\">\n    <wizard-footer [footer]=\"selected.stepFooter\"></wizard-footer>\n</div>\n", styles: [".nui-wizard-vertical,.nui-wizard-horizontal{display:block}.nui-dialog .nui-wizard-vertical,.nui-dialog .nui-wizard-horizontal{padding-top:0}.nui-dialog .nui-wizard-vertical .nui-wizard-horizontal-header-container,.nui-dialog .nui-wizard-horizontal .nui-wizard-horizontal-header-container{border-top:none}.nui-wizard-horizontal-header{display:flex;min-height:32px;max-height:72px;align-items:center}.nui-popover-container__content .nui-wizard-horizontal-header{flex-flow:row-reverse;justify-content:flex-end;padding:0;min-height:17px}[dir=rtl] .nui-wizard-horizontal-header .nui-wizard-step-header-icon{margin-right:0;margin-left:0}.nui-popover-container__content .nui-wizard-horizontal-header .nui-wizard-step-header-icon{margin-right:5px}.nui-wizard-step-header__label-position--top .nui-wizard-horizontal-header{flex-direction:column;height:auto}.nui-wizard-step-header__label-position--top .nui-wizard-horizontal-header .nui-wizard-step-header-icon{margin-right:0;margin-left:0}.nui-wizard-horizontal-header-container{display:flex;justify-content:center;text-align:center;padding:10px;border:1px solid;border-left:none;border-right:none;overflow:hidden;white-space:nowrap;align-items:center;background-color:var(--nui-color-bg-secondary,#fafafa);border-color:var(--nui-color-line-default,#d9d9d9);-webkit-user-select:none;-o-user-select:none;user-select:none}.nui-wizard-horizontal-header-wrapper{position:relative}.nui-popover-container__content .nui-wizard-horizontal-header-wrapper:not(:last-child){margin-bottom:5px}.nui-popover-container__content .nui-wizard-horizontal-header-wrapper:hover{background-color:var(--nui-color-bg-secondary,#fafafa)}.nui-wizard-horizontal__step-connector-line{border-top-width:2px;border-top-style:solid;border-color:var(--nui-color-line-default,#d9d9d9)}.nui-wizard-horizontal__step-connector-line--completed{border-color:var(--nui-color-text-link,#0079aa)}.nui-wizard-step-header__label-position--top .nui-wizard-horizontal__step-connector-line{bottom:8px;right:80.5px;width:129px;position:absolute}.nui-popover-container__content .nui-wizard-horizontal__step-connector-line{position:absolute;top:-6px;left:7px;height:6px;border-left-width:1px;border-left-style:solid;border-top:none;border-bottom:none;border-right:none}.nui-wizard-horizontal-content{outline:0}.nui-wizard-horizontal-content[aria-expanded=false]{height:0;overflow:hidden}.nui-wizard-horizontal-content-container{overflow:hidden}.nui-wizard-vertical-content{outline:0;overflow:hidden}.nui-wizard-vertical-content-container{margin-left:36px;border:0;position:relative}[dir=rtl] .nui-wizard-vertical-content-container{margin-left:0;margin-right:36px}.nui-wizard-vertical-line:before{content:\"\";position:absolute;left:0;border-left-width:2px;border-left-style:solid}[dir=rtl] .nui-wizard-vertical-line:before{left:auto;right:0}.nui-step:last-child .nui-wizard-vertical-content-container{border:none}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.Directionality, decorators: [{
                    type: Optional
                }] }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: undefined, decorators: [{
                    type: Inject,
                    args: [DOCUMENT]
                }] }]; }, propDecorators: { selectedIndex: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 