@hermes-ui/angular 0.1.4

package/fesm2022/hermes-ui-angular-stepper.mjs

@@ -0,0 +1,694 @@
+import * as i4 from '@angular/common';
+import { isPlatformBrowser, CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { ChangeDetectionStrategy, Component, Injectable, PLATFORM_ID, HostBinding, ContentChildren, ViewChild, Inject, Optional, Input, Directive, HostListener, NgModule } from '@angular/core';
+import { CollapsiblePanelModel, CollapsiblePanelGroupModel, CollapsiblePanelService, CollapsiblePanel, collapsiblePanelAnimation } from '@hermes-ui/angular/collapsible-panel';
+import * as i1 from '@hermes-ui/angular/utils';
+import { triggerAllFormControlValidation, IfExpandService, WillyWonka, OompaLoompa } from '@hermes-ui/angular/utils';
+import { map, distinctUntilChanged, tap, startWith, pairwise, filter } from 'rxjs/operators';
+import * as i2 from '@angular/forms';
+import { Subject, Observable } from 'rxjs';
+import * as i5 from '@hermes-ui/angular/icon';
+import { ClarityIcons, angleIcon, successStandardIcon, errorStandardIcon, HermesIcon } from '@hermes-ui/angular/icon';
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+var StepperPanelStatus;
+(function (StepperPanelStatus) {
+    StepperPanelStatus["Inactive"] = "inactive";
+    StepperPanelStatus["Error"] = "error";
+    StepperPanelStatus["Complete"] = "complete";
+})(StepperPanelStatus || (StepperPanelStatus = {}));
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class HermesStepDescription {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepDescription, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.22", type: HermesStepDescription, isStandalone: false, selector: "hermes-step-description", host: { properties: { "class.hermes-stepper-description": "true" } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepDescription, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'hermes-step-description',
+                    template: `<ng-content></ng-content>`,
+                    host: { '[class.hermes-stepper-description]': 'true' },
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: false,
+                }]
+        }] });
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class StepperPanelModel extends CollapsiblePanelModel {
+    constructor() {
+        super(...arguments);
+        this.status = StepperPanelStatus.Inactive;
+    }
+}
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class StepperModel extends CollapsiblePanelGroupModel {
+    constructor() {
+        super(...arguments);
+        this._panels = {};
+        this.stepperModelInitialize = false;
+    }
+    get panels() {
+        return Object.keys(this._panels).map(id => this._panels[id]);
+    }
+    get allPanelsCompleted() {
+        return this.panels.length && this.getNumberOfIncompletePanels() === 0 && this.getNumberOfOpenPanels() === 0;
+    }
+    get shouldOpenFirstPanel() {
+        return !this.initialPanel || (this._panels && Object.keys(this._panels).length && !this._panels[this.initialPanel]);
+    }
+    addPanel(id, open = false) {
+        const panel = new StepperPanelModel(id, this.panelGroupCount);
+        panel.open = open;
+        panel.disabled = true;
+        this._panels[id] = panel;
+    }
+    updatePanelOrder(ids) {
+        super.updatePanelOrder(ids);
+        if (this.stepperModelInitialize === false) {
+            this.openFirstPanel();
+        }
+    }
+    togglePanel(panelId) {
+        if (this._panels[panelId]?.status === StepperPanelStatus.Complete) {
+            this._panels[panelId].open = !this._panels[panelId].open;
+        }
+    }
+    navigateToPreviousPanel(currentPanelId) {
+        this.openPreviousPanel(this._panels[currentPanelId].id);
+    }
+    navigateToNextPanel(currentPanelId, currentPanelValid = true) {
+        if (currentPanelValid) {
+            this.completePanel(currentPanelId);
+            this.openNextPanel(this._panels[currentPanelId].id);
+        }
+        else {
+            this.setPanelError(currentPanelId);
+        }
+    }
+    overrideInitialPanel(panelId) {
+        this.initialPanel = panelId;
+        this.panels
+            .filter(() => this._panels[panelId] !== undefined)
+            .forEach(panel => {
+            if (panel.index < this._panels[panelId].index) {
+                this.completePanel(panel.id);
+            }
+            else if (panel.id === panelId) {
+                this._panels[panel.id].open = true;
+            }
+            else {
+                this._panels[panel.id].open = false;
+            }
+        });
+    }
+    setPanelValid(panelId) {
+        this._panels[panelId].status = StepperPanelStatus.Complete;
+    }
+    setPanelInvalid(panelId) {
+        this._panels[panelId].status = StepperPanelStatus.Error;
+    }
+    setPanelsWithErrors(ids) {
+        ids.forEach(id => this.setPanelError(id));
+    }
+    resetPanels() {
+        this.stepperModelInitialize = false;
+        this.panels.forEach(p => this.resetPanel(p.id));
+        this.openFirstPanel();
+    }
+    getNextPanel(currentPanelId) {
+        return this.panels.find(s => s.index === this._panels[currentPanelId].index + 1);
+    }
+    getPreviousPanel(currentPanelId) {
+        return this.panels.find(s => s.index === this._panels[currentPanelId].index - 1);
+    }
+    resetAllFuturePanels(panelId) {
+        this.panels.filter(panel => panel.index >= this._panels[panelId].index).forEach(panel => this.resetPanel(panel.id));
+    }
+    resetPanel(panelId) {
+        this._panels[panelId].status = StepperPanelStatus.Inactive;
+        this._panels[panelId].open = false;
+        this._panels[panelId].disabled = true;
+    }
+    openFirstPanel() {
+        if (!this.shouldOpenFirstPanel) {
+            return;
+        }
+        const firstPanel = this.getFirstPanel();
+        if (!firstPanel) {
+            return;
+        }
+        this._panels[firstPanel.id].open = true;
+        this._panels[firstPanel.id].disabled = true;
+        this.stepperModelInitialize = true;
+    }
+    completePanel(panelId) {
+        this._panels[panelId].status = StepperPanelStatus.Complete;
+        this._panels[panelId].disabled = false;
+        this._panels[panelId].open = false;
+    }
+    openNextPanel(currentPanelId) {
+        const nextPanel = this.getNextPanel(currentPanelId);
+        if (nextPanel) {
+            this.resetAllFuturePanels(nextPanel.id);
+            this._panels[nextPanel.id].open = true;
+            this._panels[nextPanel.id].disabled = true;
+        }
+    }
+    openPreviousPanel(currentPanelId) {
+        const prevPanel = this.getPreviousPanel(currentPanelId);
+        if (prevPanel) {
+            this._panels[currentPanelId].open = false;
+            this._panels[currentPanelId].disabled = false;
+            this._panels[prevPanel.id].open = true;
+            this._panels[prevPanel.id].disabled = true;
+        }
+    }
+    setPanelError(panelId) {
+        this.resetAllFuturePanels(panelId);
+        this._panels[panelId].open = true;
+        this._panels[panelId].status = StepperPanelStatus.Error;
+    }
+    getFirstPanel() {
+        return this.panels.find(panel => panel.index === 0);
+    }
+    getNumberOfIncompletePanels() {
+        return this.panels.reduce((prev, next) => (next.status !== StepperPanelStatus.Complete ? prev + 1 : prev), 0);
+    }
+    getNumberOfOpenPanels() {
+        return this.panels.reduce((prev, next) => (next.open !== false ? prev + 1 : prev), 0);
+    }
+}
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class StepperService extends CollapsiblePanelService {
+    constructor() {
+        super();
+        this.panelsCompleted = this.getAllCompletedPanelChanges();
+        this.panelGroup = new StepperModel();
+        this._activeStepChanges = new Subject();
+        this.activeStep = this._activeStepChanges.asObservable();
+    }
+    resetPanels() {
+        this.panelGroup.resetPanels();
+        this.emitUpdatedPanels();
+    }
+    setPanelValid(panelId) {
+        this.panelGroup.setPanelValid(panelId);
+        this.emitUpdatedPanels();
+    }
+    setPanelInvalid(panelId) {
+        this.panelGroup.setPanelInvalid(panelId);
+        this.emitUpdatedPanels();
+    }
+    setPanelsWithErrors(ids) {
+        this.panelGroup.setPanelsWithErrors(ids);
+        this.emitUpdatedPanels();
+    }
+    navigateToPreviousPanel(currentPanelId) {
+        this.panelGroup.navigateToPreviousPanel(currentPanelId);
+        this.updatePreviousStep(currentPanelId);
+        this.emitUpdatedPanels();
+    }
+    navigateToNextPanel(currentPanelId, currentPanelValid = true) {
+        this.panelGroup.navigateToNextPanel(currentPanelId, currentPanelValid);
+        this.updateNextStep(currentPanelId, currentPanelValid);
+        this.emitUpdatedPanels();
+    }
+    overrideInitialPanel(panelId) {
+        this.panelGroup.overrideInitialPanel(panelId);
+        this.emitUpdatedPanels();
+    }
+    updateNextStep(currentPanelId, currentPanelValid) {
+        const nextPanel = this.panelGroup.getNextPanel(currentPanelId);
+        if (currentPanelValid && nextPanel) {
+            this._activeStepChanges.next(nextPanel.id);
+        }
+        else if (currentPanelValid) {
+            this._activeStepChanges.next(currentPanelId);
+        }
+    }
+    updatePreviousStep(currentPanelId) {
+        const prevPanel = this.panelGroup.getPreviousPanel(currentPanelId);
+        if (prevPanel) {
+            this._activeStepChanges.next(prevPanel.id);
+        }
+    }
+    getAllCompletedPanelChanges() {
+        return this._panelsChanges.pipe(map(() => this.panelGroup.allPanelsCompleted), distinctUntilChanged());
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: StepperService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: StepperService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: StepperService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class HermesStepperPanel extends CollapsiblePanel {
+    constructor(platformId, commonStrings, formGroupName, ngModelGroup, stepperService, ifExpandService, cdr) {
+        super(stepperService, ifExpandService, cdr);
+        this.platformId = platformId;
+        this.commonStrings = commonStrings;
+        this.formGroupName = formGroupName;
+        this.ngModelGroup = ngModelGroup;
+        this.stepperService = stepperService;
+        this.disabled = false;
+        this.PanelStatus = StepperPanelStatus;
+        this.subscriptions = [];
+    }
+    get id() {
+        return this.formGroupName ? this.formGroupName.name.toString() : this.ngModelGroup.name;
+    }
+    set id(_value) {
+        // overriding parent id required empty setter
+    }
+    get panelNumber() {
+        return this._panelIndex + 1;
+    }
+    get formGroup() {
+        return this.formGroupName ? this.formGroupName.control : this.ngModelGroup.control;
+    }
+    getPanelStatus(panel) {
+        return panel.status;
+    }
+    getPanelStateClasses(panel) {
+        return `hermes-stepper-panel-${this.getPanelStatus(panel)} ${panel.open ? 'hermes-stepper-panel-open' : ''}`;
+    }
+    getContentId(id) {
+        return `hermes-stepper-content-${id}`;
+    }
+    getHeaderId(id) {
+        return `hermes-stepper-header-${id}`;
+    }
+    ngOnInit() {
+        super.ngOnInit();
+        this.panel = this.panel.pipe(tap(panel => this.triggerAllFormControlValidationIfError(panel)));
+        this.stepperService.disablePanel(this.id, true);
+        this.listenToFocusChanges();
+        // not all stepper panels are guaranteed to have a form (i.e. empty template-driven)
+        if (this.formGroup) {
+            // Only react to genuine status transitions (e.g. INVALID→VALID or VALID→INVALID).
+            // Using startWith to seed the stream with the current status so that repeated
+            // same-status emissions produced by Angular's updateValueAndValidity() calls
+            // (which always emit even when the status hasn't changed) are filtered out.
+            // This prevents a single blurred+typed control from triggering validation on
+            // all sibling controls in the group via triggerAllFormControlValidation.
+            this.subscriptions.push(this.formGroup.statusChanges
+                .pipe(startWith(this.formGroup.status), pairwise(), filter(([prev, curr]) => prev !== curr), map(([, curr]) => curr))
+                .subscribe(status => {
+                if (!this.formGroup.touched) {
+                    return;
+                }
+                if (status === 'VALID') {
+                    this.stepperService.setPanelValid(this.id);
+                }
+                else if (status === 'INVALID') {
+                    this.stepperService.setPanelInvalid(this.id);
+                }
+            }));
+        }
+    }
+    ngOnDestroy() {
+        this.subscriptions.forEach(s => s.unsubscribe());
+    }
+    stepCompleteText(panelNumber) {
+        return this.commonStrings.parse(this.commonStrings.keys.stepComplete, { STEP: panelNumber.toString() });
+    }
+    stepErrorText(panelNumber) {
+        return this.commonStrings.parse(this.commonStrings.keys.stepError, { STEP: panelNumber.toString() });
+    }
+    listenToFocusChanges() {
+        this.subscriptions.push(this.stepperService.activeStep
+            .pipe(filter(panelId => isPlatformBrowser(this.platformId) && panelId === this.id))
+            .subscribe(() => {
+            this.headerButton.nativeElement.focus();
+        }));
+    }
+    triggerAllFormControlValidationIfError(panel) {
+        if (panel.status === StepperPanelStatus.Error) {
+            triggerAllFormControlValidation(this.formGroup);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepperPanel, deps: [{ token: PLATFORM_ID }, { token: i1.HermesCommonStringsService }, { token: i2.FormGroupName, optional: true }, { token: i2.NgModelGroup, optional: true }, { token: StepperService }, { token: i1.IfExpandService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.22", type: HermesStepperPanel, isStandalone: false, selector: "hermes-stepper-panel", host: { properties: { "class.hermes-stepper-panel": "true", "class.hermes-stepper-panel-disabled": "this.disabled" } }, providers: [IfExpandService], queries: [{ propertyName: "stepDescription", predicate: HermesStepDescription }], viewQueries: [{ propertyName: "headerButton", first: true, predicate: ["headerButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!--\r\n  ~ Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\r\n  ~ The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\r\n  ~ This software is released under MIT license.\r\n  ~ The full license information can be found in LICENSE in the root directory of this project.\r\n  -->\r\n@if (panel | async; as panel) {\r\n<div [ngClass]=\"getPanelStateClasses(panel)\">\r\n  <div class=\"hermes-stepper-header\">\r\n    <button\r\n      type=\"button\"\r\n      class=\"hermes-stepper-header-button\"\r\n      (click)=\"togglePanel()\"\r\n      [id]=\"getHeaderId(panel.templateId)\"\r\n      [attr.aria-disabled]=\"panel.disabled\"\r\n      [attr.aria-controls]=\"getContentId(panel.templateId)\"\r\n      [attr.aria-expanded]=\"panel.open\"\r\n      [class.hermes-stepper-header-has-description]=\"(stepDescription.changes | async)?.length || stepDescription.length\"\r\n      #headerButton\r\n    >\r\n      <span class=\"hermes-step-status\">\r\n        <hermes-icon shape=\"angle\" direction=\"right\" class=\"hermes-stepper-angle hermes-step-angle\"></hermes-icon>\r\n        <span class=\"hermes-step-status-icon\">\r\n          @if (getPanelStatus(panel) === PanelStatus.Error) {\r\n          <hermes-icon status=\"danger\" shape=\"error-standard\" class=\"hermes-step-error-icon\"></hermes-icon>\r\n          } @if (getPanelStatus(panel) === PanelStatus.Complete) {\r\n          <hermes-icon status=\"success\" shape=\"success-standard\" class=\"hermes-step-complete-icon\"></hermes-icon>\r\n          }\r\n        </span>\r\n      </span>\r\n      <span class=\"hermes-step-title-wrapper\">\r\n        <span class=\"hermes-step-number\">{{panelNumber}}.</span>\r\n        <ng-content select=\"hermes-step-title\"></ng-content>\r\n      </span>\r\n      <ng-content select=\"hermes-step-description\"></ng-content>\r\n    </button>\r\n    <div class=\"hermes-sr-only\" role=\"status\">\r\n      @if (getPanelStatus(panel) === PanelStatus.Error) { {{ stepErrorText(panelNumber)}} } @if (getPanelStatus(panel)\r\n      === PanelStatus.Complete) { {{ stepCompleteText(panelNumber)}} }\r\n    </div>\r\n  </div>\r\n  <div\r\n    @skipInitialRender\r\n    role=\"region\"\r\n    class=\"hermes-stepper-content-region\"\r\n    [id]=\"getContentId(panel.templateId)\"\r\n    [attr.aria-hidden]=\"!panel.open\"\r\n    [attr.aria-labelledby]=\"getHeaderId(panel.templateId)\"\r\n  >\r\n    @if (panel.open) {\r\n    <div @toggle (@toggle.done)=\"collapsePanelOnAnimationDone(panel)\" class=\"hermes-stepper-content\">\r\n      <div class=\"hermes-stepper-inner-content\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n}\r\n", dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i5.HermesIcon, selector: "hermes-icon, hermes-icon", inputs: ["shape", "size", "direction", "flip", "solid", "status", "inverse", "badge"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], animations: collapsiblePanelAnimation, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepperPanel, decorators: [{
+            type: Component,
+            args: [{ selector: 'hermes-stepper-panel', host: { '[class.hermes-stepper-panel]': 'true' }, changeDetection: ChangeDetectionStrategy.OnPush, animations: collapsiblePanelAnimation, providers: [IfExpandService], standalone: false, template: "<!--\r\n  ~ Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\r\n  ~ The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\r\n  ~ This software is released under MIT license.\r\n  ~ The full license information can be found in LICENSE in the root directory of this project.\r\n  -->\r\n@if (panel | async; as panel) {\r\n<div [ngClass]=\"getPanelStateClasses(panel)\">\r\n  <div class=\"hermes-stepper-header\">\r\n    <button\r\n      type=\"button\"\r\n      class=\"hermes-stepper-header-button\"\r\n      (click)=\"togglePanel()\"\r\n      [id]=\"getHeaderId(panel.templateId)\"\r\n      [attr.aria-disabled]=\"panel.disabled\"\r\n      [attr.aria-controls]=\"getContentId(panel.templateId)\"\r\n      [attr.aria-expanded]=\"panel.open\"\r\n      [class.hermes-stepper-header-has-description]=\"(stepDescription.changes | async)?.length || stepDescription.length\"\r\n      #headerButton\r\n    >\r\n      <span class=\"hermes-step-status\">\r\n        <hermes-icon shape=\"angle\" direction=\"right\" class=\"hermes-stepper-angle hermes-step-angle\"></hermes-icon>\r\n        <span class=\"hermes-step-status-icon\">\r\n          @if (getPanelStatus(panel) === PanelStatus.Error) {\r\n          <hermes-icon status=\"danger\" shape=\"error-standard\" class=\"hermes-step-error-icon\"></hermes-icon>\r\n          } @if (getPanelStatus(panel) === PanelStatus.Complete) {\r\n          <hermes-icon status=\"success\" shape=\"success-standard\" class=\"hermes-step-complete-icon\"></hermes-icon>\r\n          }\r\n        </span>\r\n      </span>\r\n      <span class=\"hermes-step-title-wrapper\">\r\n        <span class=\"hermes-step-number\">{{panelNumber}}.</span>\r\n        <ng-content select=\"hermes-step-title\"></ng-content>\r\n      </span>\r\n      <ng-content select=\"hermes-step-description\"></ng-content>\r\n    </button>\r\n    <div class=\"hermes-sr-only\" role=\"status\">\r\n      @if (getPanelStatus(panel) === PanelStatus.Error) { {{ stepErrorText(panelNumber)}} } @if (getPanelStatus(panel)\r\n      === PanelStatus.Complete) { {{ stepCompleteText(panelNumber)}} }\r\n    </div>\r\n  </div>\r\n  <div\r\n    @skipInitialRender\r\n    role=\"region\"\r\n    class=\"hermes-stepper-content-region\"\r\n    [id]=\"getContentId(panel.templateId)\"\r\n    [attr.aria-hidden]=\"!panel.open\"\r\n    [attr.aria-labelledby]=\"getHeaderId(panel.templateId)\"\r\n  >\r\n    @if (panel.open) {\r\n    <div @toggle (@toggle.done)=\"collapsePanelOnAnimationDone(panel)\" class=\"hermes-stepper-content\">\r\n      <div class=\"hermes-stepper-inner-content\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n    }\r\n  </div>\r\n</div>\r\n}\r\n" }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [PLATFORM_ID]
+                }] }, { type: i1.HermesCommonStringsService }, { type: i2.FormGroupName, decorators: [{
+                    type: Optional
+                }] }, { type: i2.NgModelGroup, decorators: [{
+                    type: Optional
+                }] }, { type: StepperService }, { type: i1.IfExpandService }, { type: i0.ChangeDetectorRef }], propDecorators: { headerButton: [{
+                type: ViewChild,
+                args: ['headerButton']
+            }], stepDescription: [{
+                type: ContentChildren,
+                args: [HermesStepDescription]
+            }], disabled: [{
+                type: HostBinding,
+                args: ['class.hermes-stepper-panel-disabled']
+            }] } });
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class HermesStepper {
+    constructor(formGroup, ngForm, stepperService) {
+        this.formGroup = formGroup;
+        this.ngForm = ngForm;
+        this.stepperService = stepperService;
+        this.subscriptions = [];
+    }
+    ngOnInit() {
+        if (!this.formGroup && !this.ngForm) {
+            throw new Error('To use stepper a Reactive or Template Form is required.');
+        }
+        this.form = this.formGroup ? this.formGroup : this.ngForm;
+        this.subscriptions.push(this.listenForPanelsCompleted());
+        this.subscriptions.push(this.listenForFormResetChanges());
+    }
+    ngOnChanges(changes) {
+        if (changes.initialPanel &&
+            !changes.initialPanel.firstChange &&
+            changes.initialPanel.currentValue !== changes.initialPanel.previousValue) {
+            this.stepperService.overrideInitialPanel(this.initialPanel);
+        }
+    }
+    ngAfterViewInit() {
+        this.subscriptions.push(this.listenForDOMChanges());
+    }
+    ngOnDestroy() {
+        this.subscriptions.forEach(s => s.unsubscribe());
+    }
+    listenForFormResetChanges() {
+        return fromControlReset(this.form.form).subscribe(() => this.stepperService.resetPanels());
+    }
+    listenForPanelsCompleted() {
+        return this.stepperService.panelsCompleted.subscribe(panelsCompleted => {
+            if (panelsCompleted && this.form.valid) {
+                this.form.ngSubmit.emit();
+            }
+            else if (!this.form.valid && this.form.touched) {
+                this.setPanelsWithFormErrors();
+            }
+        });
+    }
+    setPanelsWithFormErrors() {
+        const panelsWithErrors = this.panels.reduce((panels, p) => (p.formGroup.invalid ? [...panels, p.id] : panels), []);
+        this.stepperService.setPanelsWithErrors(panelsWithErrors);
+    }
+    listenForDOMChanges() {
+        return this.panels.changes.pipe(startWith(this.panels)).subscribe((panels) => {
+            this.stepperService.updatePanelOrder(panels.toArray().map(p => p.id));
+            if (this.initialPanel) {
+                this.stepperService.overrideInitialPanel(this.initialPanel);
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepper, deps: [{ token: i2.FormGroupDirective, optional: true }, { token: i2.NgForm, optional: true }, { token: StepperService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.22", type: HermesStepper, isStandalone: false, selector: "form[hermesStepper]", inputs: { initialPanel: ["hermesInitialStep", "initialPanel"] }, host: { properties: { "class.hermes-stepper-forms": "true" } }, providers: [StepperService, { provide: CollapsiblePanelService, useExisting: StepperService }], queries: [{ propertyName: "panels", predicate: HermesStepperPanel }], usesOnChanges: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepper, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'form[hermesStepper]',
+                    template: `<ng-content></ng-content>`,
+                    host: {
+                        '[class.hermes-stepper-forms]': 'true',
+                    },
+                    providers: [StepperService, { provide: CollapsiblePanelService, useExisting: StepperService }],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [{ type: i2.FormGroupDirective, decorators: [{
+                    type: Optional
+                }] }, { type: i2.NgForm, decorators: [{
+                    type: Optional
+                }] }, { type: StepperService }], propDecorators: { initialPanel: [{
+                type: Input,
+                args: ['hermesInitialStep']
+            }], panels: [{
+                type: ContentChildren,
+                args: [HermesStepperPanel]
+            }] } });
+function fromControlReset(control) {
+    return new Observable(observer => {
+        const unpatchedControlReset = control.reset;
+        control.reset = () => {
+            observer.next();
+            unpatchedControlReset.apply(control);
+        };
+        return () => {
+            control.reset = unpatchedControlReset;
+        };
+    });
+}
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class StepperWillyWonka extends WillyWonka {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: StepperWillyWonka, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.22", type: StepperWillyWonka, isStandalone: false, selector: "form[hermesStepper]", usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: StepperWillyWonka, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'form[hermesStepper]',
+                    standalone: false,
+                }]
+        }] });
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class StepperOompaLoompa extends OompaLoompa {
+    constructor(cdr, willyWonka, ifExpandService) {
+        if (!willyWonka) {
+            throw new Error('hermes-stepper-panel should only be used inside of hermesStepper');
+        }
+        super(cdr, willyWonka);
+        this.expand = ifExpandService;
+    }
+    get flavor() {
+        return this.expand.expanded;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: StepperOompaLoompa, deps: [{ token: i0.ChangeDetectorRef }, { token: StepperWillyWonka, optional: true }, { token: i1.IfExpandService }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.22", type: StepperOompaLoompa, isStandalone: false, selector: "hermes-stepper-panel, [hermesStepButton]", usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: StepperOompaLoompa, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'hermes-stepper-panel, [hermesStepButton]',
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: StepperWillyWonka, decorators: [{
+                    type: Optional
+                }] }, { type: i1.IfExpandService }] });
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+var HermesStepButtonType;
+(function (HermesStepButtonType) {
+    HermesStepButtonType["Next"] = "next";
+    HermesStepButtonType["Previous"] = "previous";
+    HermesStepButtonType["Submit"] = "submit";
+})(HermesStepButtonType || (HermesStepButtonType = {}));
+class HermesStepButton {
+    constructor(hermesStep, stepperService) {
+        this.hermesStep = hermesStep;
+        this.stepperService = stepperService;
+        this.type = HermesStepButtonType.Next;
+        this.submitButton = false;
+        this.previousButton = false;
+    }
+    ngOnInit() {
+        this.submitButton = this.type === HermesStepButtonType.Submit;
+        this.previousButton = this.type === HermesStepButtonType.Previous;
+    }
+    navigateToNextPanel() {
+        if (this.previousButton) {
+            this.stepperService.navigateToPreviousPanel(this.hermesStep.id);
+            return;
+        }
+        this.stepperService.navigateToNextPanel(this.hermesStep.id, this.hermesStep.formGroup.valid);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepButton, deps: [{ token: HermesStepperPanel }, { token: StepperService }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.22", type: HermesStepButton, isStandalone: false, selector: "[hermesStepButton]", inputs: { type: ["hermesStepButton", "type"] }, host: { listeners: { "click": "navigateToNextPanel()" }, properties: { "class.hermes-step-button": "true", "class.btn": "true", "type": "'button'", "class.btn-success": "this.submitButton", "class.btn-link": "this.previousButton" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepButton, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[hermesStepButton]',
+                    host: {
+                        '[class.hermes-step-button]': 'true',
+                        '[class.btn]': 'true',
+                        '[type]': "'button'",
+                    },
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [{ type: HermesStepperPanel }, { type: StepperService }], propDecorators: { type: [{
+                type: Input,
+                args: ['hermesStepButton']
+            }], submitButton: [{
+                type: HostBinding,
+                args: ['class.btn-success']
+            }], previousButton: [{
+                type: HostBinding,
+                args: ['class.btn-link']
+            }], navigateToNextPanel: [{
+                type: HostListener,
+                args: ['click']
+            }] } });
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class HermesStepContent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.22", type: HermesStepContent, isStandalone: false, selector: "hermes-step-content", ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepContent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'hermes-step-content',
+                    template: `<ng-content></ng-content>`,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: false,
+                }]
+        }] });
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class HermesStepTitle {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepTitle, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.22", type: HermesStepTitle, isStandalone: false, selector: "hermes-step-title", host: { properties: { "class.hermes-stepper-title": "true" } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepTitle, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'hermes-step-title',
+                    template: `<ng-content></ng-content>`,
+                    host: { '[class.hermes-stepper-title]': 'true' },
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: false,
+                }]
+        }] });
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+const declarations = [
+    HermesStepper,
+    HermesStepButton,
+    HermesStepTitle,
+    HermesStepDescription,
+    HermesStepContent,
+    HermesStepperPanel,
+    StepperOompaLoompa,
+    StepperWillyWonka,
+];
+class HermesStepperModule {
+    constructor() {
+        ClarityIcons.addIcons(angleIcon, successStandardIcon, errorStandardIcon);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.22", ngImport: i0, type: HermesStepperModule, declarations: [HermesStepper,
+            HermesStepButton,
+            HermesStepTitle,
+            HermesStepDescription,
+            HermesStepContent,
+            HermesStepperPanel,
+            StepperOompaLoompa,
+            StepperWillyWonka], imports: [CommonModule, HermesIcon], exports: [HermesStepper,
+            HermesStepButton,
+            HermesStepTitle,
+            HermesStepDescription,
+            HermesStepContent,
+            HermesStepperPanel,
+            StepperOompaLoompa,
+            StepperWillyWonka, HermesIcon] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepperModule, imports: [CommonModule, HermesIcon] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesStepperModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, HermesIcon],
+                    declarations: [...declarations],
+                    exports: [...declarations, HermesIcon],
+                }]
+        }], ctorParameters: () => [] });
+
+/*
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { HermesStepButton, HermesStepButtonType, HermesStepContent, HermesStepDescription, HermesStepTitle, HermesStepper, HermesStepperModule, HermesStepperPanel, StepperOompaLoompa, StepperPanelModel, StepperPanelStatus, StepperService, StepperWillyWonka };
+//# sourceMappingURL=hermes-ui-angular-stepper.mjs.map