@fundamental-ngx/platform 0.46.0-rc.2 → 0.46.0-rc.21

package/fesm2022/fundamental-ngx-platform-wizard-generator.mjs

@@ -1,36 +1,38 @@
 import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, Directive, Input, Output, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChildren, ViewChild, TemplateRef, ContentChild, NgModule } from '@angular/core';
+import { Injectable, EventEmitter, Directive, Input, Output, Component, ChangeDetectionStrategy, ViewEncapsulation, ViewChildren, inject, ViewChild, TemplateRef, ContentChild, NgModule } from '@angular/core';
 import { Subject, BehaviorSubject, of, firstValueFrom } from 'rxjs';
 import { take, map, debounceTime, takeUntil, finalize, filter } from 'rxjs/operators';
 import { cloneDeep, uniq, mergeWith, concat } from 'lodash-es';
 import * as i2 from '@fundamental-ngx/platform/form';
 import { FormGeneratorComponent, FormGeneratorService, FORM_GENERATOR_ITEM_CONFIG, FORM_GENERATOR_CONFIG, PlatformFormGeneratorModule } from '@fundamental-ngx/platform/form';
-import * as i7 from '@fundamental-ngx/cdk/utils';
-import { isFunction, selectStrategy, RepeatModule } from '@fundamental-ngx/cdk/utils';
-import * as i3$2 from '@fundamental-ngx/core/content-density';
-import { ContentDensityMode } from '@fundamental-ngx/core/content-density';
-import * as i2$1 from '@fundamental-ngx/core/dialog';
+import * as i6 from '@fundamental-ngx/cdk/utils';
+import { isFunction, selectStrategy, InitialFocusDirective, RepeatDirective } from '@fundamental-ngx/cdk/utils';
+import * as i3$1 from '@fundamental-ngx/core/content-density';
+import { ContentDensityMode, ContentDensityDirective } from '@fundamental-ngx/core/content-density';
+import * as i2$3 from '@fundamental-ngx/core/dialog';
 import { DialogModule } from '@fundamental-ngx/core/dialog';
-import * as i3 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i4$3 from '@fundamental-ngx/core/bar';
-import * as i4 from '@fundamental-ngx/core/title';
-import { TitleModule } from '@fundamental-ngx/core/title';
-import * as i5$1 from '@fundamental-ngx/platform/button';
-import { PlatformButtonModule } from '@fundamental-ngx/platform/button';
-import * as i4$2 from '@fundamental-ngx/core/wizard';
+import * as i8 from '@fundamental-ngx/core/message-box';
+import { MessageBoxService, MessageBoxModule } from '@fundamental-ngx/core/message-box';
+import { NgFor, NgIf, NgTemplateOutlet } from '@angular/common';
+import * as i2$2 from '@fundamental-ngx/core/wizard';
 import { WizardModule } from '@fundamental-ngx/core/wizard';
-import { isFunction as isFunction$1 } from '@fundamental-ngx/platform/shared';
-import * as i3$1 from '@fundamental-ngx/core/layout-grid';
+import * as i5 from '@fundamental-ngx/core/title';
+import { TitleComponent } from '@fundamental-ngx/core/title';
+import * as i1 from '@fundamental-ngx/core/layout-grid';
 import { LayoutGridModule } from '@fundamental-ngx/core/layout-grid';
-import * as i4$1 from '@fundamental-ngx/core/form';
+import * as i2$1 from '@fundamental-ngx/core/form';
 import { FormLabelModule } from '@fundamental-ngx/core/form';
-import * as i5 from '@fundamental-ngx/platform/link';
+import * as i3 from '@fundamental-ngx/platform/link';
 import { PlatformLinkModule } from '@fundamental-ngx/platform/link';
-import * as i6 from '@fundamental-ngx/i18n';
-import { I18nModule } from '@fundamental-ngx/i18n';
-import { ButtonModule } from '@fundamental-ngx/core/button';
-import * as i4$4 from '@fundamental-ngx/core/skeleton';
+import { FdTranslatePipe } from '@fundamental-ngx/i18n';
+import { isFunction as isFunction$1 } from '@fundamental-ngx/platform/shared';
+import * as i4 from '@fundamental-ngx/platform/button';
+import { PlatformButtonModule } from '@fundamental-ngx/platform/button';
+import { CdkScrollable } from '@angular/cdk/overlay';
+import { ScrollbarDirective } from '@fundamental-ngx/core/scrollbar';
+import * as i3$2 from '@fundamental-ngx/core/bar';
+import { BarModule } from '@fundamental-ngx/core/bar';
+import * as i3$3 from '@fundamental-ngx/core/skeleton';
 import { SkeletonModule } from '@fundamental-ngx/core/skeleton';
 
 var WizardGeneratorRefreshStrategy;
@@ -811,6 +813,145 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Output
             }] } });
 
+class WizardSummarySectionComponent {
+    constructor() {
+        /**
+         * Emits when step edit button clicked.
+         */
+        this.editStep = new EventEmitter();
+    }
+    /**
+     * @hidden
+     * @description Sets current step on wizard.
+     * @param event Mouse click event to prevent.
+     */
+    _editStep(event) {
+        event.preventDefault();
+        this.editStep.emit(this.step.id);
+    }
+    /** @hidden */
+    _trackFn(_, form) {
+        return form.id;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardSummarySectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardSummarySectionComponent, isStandalone: true, selector: "fdp-wizard-summary-section", inputs: { step: "step" }, outputs: { editStep: "editStep" }, ngImport: i0, template: "<ng-container *ngFor=\"let group of step.forms; trackBy: _trackFn\">\n    <h4 fd-title [headerSize]=\"4\">{{ group.title }}</h4>\n    <fd-layout-grid [style.margin-bottom.rem]=\"2\">\n        <div fdLayoutGridRow>\n            <div [fdLayoutGridCol]=\"4\" [colMd]=\"2\" [colLg]=\"2\" [colXl]=\"2\">\n                <div *ngFor=\"let item of group.items\">\n                    <label fd-form-label> {{ item.label }}: </label>\n                </div>\n            </div>\n            <div [fdLayoutGridCol]=\"4\" [colMd]=\"5\" [colLg]=\"5\" [colXl]=\"5\">\n                <div *ngFor=\"let item of group.items\">\n                    <label fd-form-label>\n                        {{ item.value || '-' }}\n                    </label>\n                </div>\n            </div>\n            <div [fdLayoutGridCol]=\"1\" [colMd]=\"5\" [colLg]=\"5\" [colXl]=\"5\">\n                <fdp-link href=\"#\" (click)=\"_editStep($event)\">\n                    {{ 'platformWizardGenerator.summarySectionEditStep' | fdTranslate }}\n                </fdp-link>\n            </div>\n        </div>\n    </fd-layout-grid>\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "ngmodule", type: LayoutGridModule }, { kind: "component", type: i1.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i1.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i1.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "ngmodule", type: FormLabelModule }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "ngmodule", type: PlatformLinkModule }, { kind: "component", type: i3.LinkComponent, selector: "fdp-link", inputs: ["href", "target", "linkType", "type", "inverted", "title", "hreflang", "download", "media", "rel", "truncate"], outputs: ["click"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardSummarySectionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'fdp-wizard-summary-section', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [NgFor, TitleComponent, LayoutGridModule, FormLabelModule, PlatformLinkModule, FdTranslatePipe], template: "<ng-container *ngFor=\"let group of step.forms; trackBy: _trackFn\">\n    <h4 fd-title [headerSize]=\"4\">{{ group.title }}</h4>\n    <fd-layout-grid [style.margin-bottom.rem]=\"2\">\n        <div fdLayoutGridRow>\n            <div [fdLayoutGridCol]=\"4\" [colMd]=\"2\" [colLg]=\"2\" [colXl]=\"2\">\n                <div *ngFor=\"let item of group.items\">\n                    <label fd-form-label> {{ item.label }}: </label>\n                </div>\n            </div>\n            <div [fdLayoutGridCol]=\"4\" [colMd]=\"5\" [colLg]=\"5\" [colXl]=\"5\">\n                <div *ngFor=\"let item of group.items\">\n                    <label fd-form-label>\n                        {{ item.value || '-' }}\n                    </label>\n                </div>\n            </div>\n            <div [fdLayoutGridCol]=\"1\" [colMd]=\"5\" [colLg]=\"5\" [colXl]=\"5\">\n                <fdp-link href=\"#\" (click)=\"_editStep($event)\">\n                    {{ 'platformWizardGenerator.summarySectionEditStep' | fdTranslate }}\n                </fdp-link>\n            </div>\n        </div>\n    </fd-layout-grid>\n</ng-container>\n" }]
+        }], propDecorators: { step: [{
+                type: Input
+            }], editStep: [{
+                type: Output
+            }] } });
+
+class WizardSummaryStepComponent {
+    /**
+     * @description Summary step status.
+     */
+    set status(status) {
+        if (status === 'current') {
+            this._wizardGeneratorService.getWizardFormValue(true).then((forms) => {
+                this._submittedForms = forms;
+                this._wizardSteps = this._wizardGeneratorService.items.filter((i) => this._submittedForms[i.id] !== undefined);
+                this._formatWizardValue().then(() => {
+                    this._shouldRender = true;
+                    this._cd.detectChanges();
+                });
+            });
+        }
+        else {
+            this._shouldRender = false;
+        }
+        this._cd.detectChanges();
+    }
+    /** @hidden */
+    constructor(_wizardGeneratorService, _formGeneratorService, _cd) {
+        this._wizardGeneratorService = _wizardGeneratorService;
+        this._formGeneratorService = _formGeneratorService;
+        this._cd = _cd;
+        /**
+         * Formatted wizard value with steps and their forms.
+         */
+        this.formattedWizardValue = [];
+        /**
+         * @hidden
+         */
+        this._shouldRender = false;
+        /** @hidden */
+        this._editStepFn = (stepId) => this.editStep(stepId);
+    }
+    /**
+     * Opens defined step for editing.
+     * @param stepId Defined step ID.
+     */
+    editStep(stepId) {
+        this._wizardGeneratorService.editStep(stepId);
+    }
+    /**
+     * @hidden
+     * @param index
+     * @returns step index
+     */
+    _trackFn(_, step) {
+        return step.id;
+    }
+    /** @hidden */
+    async _formatWizardValue() {
+        this.formattedWizardValue = [];
+        for (const step of this._wizardSteps) {
+            const component = this._wizardGeneratorService.stepsComponents.get(step.id);
+            const componentForms = component?.getVisibleForms();
+            if (!componentForms) {
+                continue;
+            }
+            const formattedStepValue = await this._formatStepValue(componentForms, step);
+            this.formattedWizardValue.push({
+                id: step.id,
+                name: step.name,
+                title: step.title,
+                forms: formattedStepValue
+            });
+        }
+    }
+    /** @hidden */
+    async _formatStepValue(componentForms, step) {
+        const formattedStepValue = [];
+        for (const formGroup of step.formGroups ?? []) {
+            const formId = formGroup.id;
+            const form = componentForms[formId];
+            // Form might be skipped due to conditional rendering
+            if (!form) {
+                continue;
+            }
+            const formattedFormValue = await this._formGeneratorService.getFormValue(form.form, true);
+            const formattedForm = {
+                title: form.title,
+                id: formId,
+                items: Object.keys(this._submittedForms[step.id][formId]).map((key) => {
+                    const formItem = this._formGeneratorService.getFormControl(form.form, key).formItem;
+                    return {
+                        label: formItem.message,
+                        value: formattedFormValue[key]
+                    };
+                })
+            };
+            formattedStepValue.push(formattedForm);
+        }
+        return formattedStepValue;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardSummaryStepComponent, deps: [{ token: WizardGeneratorService }, { token: i2.FormGeneratorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardSummaryStepComponent, isStandalone: true, selector: "fdp-wizard-summary-step", inputs: { status: "status", customSummaryStepTemplate: "customSummaryStepTemplate" }, ngImport: i0, template: "<ng-container *ngIf=\"_shouldRender\">\n    <ng-template #defaultsummaryStepTemplate>\n        <ng-container *ngFor=\"let step of formattedWizardValue; trackBy: _trackFn\">\n            <fdp-wizard-summary-section [step]=\"step\" (editStep)=\"editStep($event)\"></fdp-wizard-summary-section>\n        </ng-container>\n    </ng-template>\n    <ng-template\n        [ngTemplateOutlet]=\"customSummaryStepTemplate || defaultsummaryStepTemplate\"\n        [ngTemplateOutletContext]=\"{ steps: formattedWizardValue, editStep: _editStepFn }\"\n    ></ng-template>\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: WizardSummarySectionComponent, selector: "fdp-wizard-summary-section", inputs: ["step"], outputs: ["editStep"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardSummaryStepComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'fdp-wizard-summary-step', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [NgIf, NgFor, WizardSummarySectionComponent, NgTemplateOutlet], template: "<ng-container *ngIf=\"_shouldRender\">\n    <ng-template #defaultsummaryStepTemplate>\n        <ng-container *ngFor=\"let step of formattedWizardValue; trackBy: _trackFn\">\n            <fdp-wizard-summary-section [step]=\"step\" (editStep)=\"editStep($event)\"></fdp-wizard-summary-section>\n        </ng-container>\n    </ng-template>\n    <ng-template\n        [ngTemplateOutlet]=\"customSummaryStepTemplate || defaultsummaryStepTemplate\"\n        [ngTemplateOutletContext]=\"{ steps: formattedWizardValue, editStep: _editStepFn }\"\n    ></ng-template>\n</ng-container>\n" }]
+        }], ctorParameters: function () { return [{ type: WizardGeneratorService }, { type: i2.FormGeneratorService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { status: [{
+                type: Input
+            }], customSummaryStepTemplate: [{
+                type: Input
+            }] } });
+
 class WizardGeneratorStepComponent {
     /** @hidden */
     constructor(_wizardGeneratorService, _formGeneratorService) {
@@ -998,11 +1139,11 @@ class WizardGeneratorStepComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorStepComponent, deps: [{ token: WizardGeneratorService }, { token: i2.FormGeneratorService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorStepComponent, selector: "fdp-wizard-generator-step", inputs: { item: "item", stepStatus: "stepStatus", unifiedLayout: "unifiedLayout" }, outputs: { formsSubmitted: "formsSubmitted", formsCreated: "formsCreated" }, viewQueries: [{ propertyName: "formGenerators", predicate: FormGeneratorComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<h3 *ngIf=\"item.title\" fd-title>{{ item.title }}</h3>\n\n<ng-container *ngFor=\"let form of item.formGroups; let i = index\">\n    <fdp-form-generator\n        *ngIf=\"_visibleFormGroupIds[form.id] !== false\"\n        [mainTitle]=\"form.title\"\n        [columnLayout]=\"form.columnLayout\"\n        [noAdditionalContent]=\"true\"\n        [formName]=\"form.id\"\n        [formItems]=\"$any(form.formItems)\"\n        [hint]=\"form.guiOptions?.hint!\"\n        [unifiedLayout]=\"unifiedLayout\"\n        (formCreated)=\"onFormCreated($event, form.id)\"\n        (formSubmittedStatus)=\"onFormSubmitted($event, form.id)\"\n    ></fdp-form-generator>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i2.FormGeneratorComponent, selector: "fdp-form-generator", inputs: ["formName", "formItems", "mainTitle", "hideMainTItle", "hint", "columnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "unifiedLayout", "inlineColumnLayout", "noAdditionalContent"], outputs: ["formCreated", "formSubmitted", "formSubmittedStatus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorStepComponent, isStandalone: true, selector: "fdp-wizard-generator-step", inputs: { item: "item", stepStatus: "stepStatus", unifiedLayout: "unifiedLayout" }, outputs: { formsSubmitted: "formsSubmitted", formsCreated: "formsCreated" }, viewQueries: [{ propertyName: "formGenerators", predicate: FormGeneratorComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<h3 *ngIf=\"item.title\" fd-title>{{ item.title }}</h3>\n\n<ng-container *ngFor=\"let form of item.formGroups; let i = index\">\n    <fdp-form-generator\n        *ngIf=\"_visibleFormGroupIds[form.id] !== false\"\n        [mainTitle]=\"form.title\"\n        [columnLayout]=\"form.columnLayout\"\n        [noAdditionalContent]=\"true\"\n        [formName]=\"form.id\"\n        [formItems]=\"$any(form.formItems)\"\n        [hint]=\"form.guiOptions?.hint!\"\n        [unifiedLayout]=\"unifiedLayout\"\n        (formCreated)=\"onFormCreated($event, form.id)\"\n        (formSubmittedStatus)=\"onFormSubmitted($event, form.id)\"\n    ></fdp-form-generator>\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: FormGeneratorComponent, selector: "fdp-form-generator", inputs: ["formName", "formItems", "mainTitle", "hideMainTItle", "hint", "columnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "unifiedLayout", "inlineColumnLayout", "noAdditionalContent"], outputs: ["formCreated", "formSubmitted", "formSubmittedStatus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorStepComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-wizard-generator-step', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<h3 *ngIf=\"item.title\" fd-title>{{ item.title }}</h3>\n\n<ng-container *ngFor=\"let form of item.formGroups; let i = index\">\n    <fdp-form-generator\n        *ngIf=\"_visibleFormGroupIds[form.id] !== false\"\n        [mainTitle]=\"form.title\"\n        [columnLayout]=\"form.columnLayout\"\n        [noAdditionalContent]=\"true\"\n        [formName]=\"form.id\"\n        [formItems]=\"$any(form.formItems)\"\n        [hint]=\"form.guiOptions?.hint!\"\n        [unifiedLayout]=\"unifiedLayout\"\n        (formCreated)=\"onFormCreated($event, form.id)\"\n        (formSubmittedStatus)=\"onFormSubmitted($event, form.id)\"\n    ></fdp-form-generator>\n</ng-container>\n" }]
+            args: [{ selector: 'fdp-wizard-generator-step', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgIf, TitleComponent, NgFor, FormGeneratorComponent], template: "<h3 *ngIf=\"item.title\" fd-title>{{ item.title }}</h3>\n\n<ng-container *ngFor=\"let form of item.formGroups; let i = index\">\n    <fdp-form-generator\n        *ngIf=\"_visibleFormGroupIds[form.id] !== false\"\n        [mainTitle]=\"form.title\"\n        [columnLayout]=\"form.columnLayout\"\n        [noAdditionalContent]=\"true\"\n        [formName]=\"form.id\"\n        [formItems]=\"$any(form.formItems)\"\n        [hint]=\"form.guiOptions?.hint!\"\n        [unifiedLayout]=\"unifiedLayout\"\n        (formCreated)=\"onFormCreated($event, form.id)\"\n        (formSubmittedStatus)=\"onFormSubmitted($event, form.id)\"\n    ></fdp-form-generator>\n</ng-container>\n" }]
         }], ctorParameters: function () { return [{ type: WizardGeneratorService }, { type: i2.FormGeneratorService }]; }, propDecorators: { formGenerators: [{
                 type: ViewChildren,
                 args: [FormGeneratorComponent]
@@ -1018,145 +1159,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Output
             }] } });
 
-class WizardSummarySectionComponent {
-    constructor() {
-        /**
-         * Emits when step edit button clicked.
-         */
-        this.editStep = new EventEmitter();
-    }
-    /**
-     * @hidden
-     * @description Sets current step on wizard.
-     * @param event Mouse click event to prevent.
-     */
-    _editStep(event) {
-        event.preventDefault();
-        this.editStep.emit(this.step.id);
-    }
-    /** @hidden */
-    _trackFn(_, form) {
-        return form.id;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardSummarySectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardSummarySectionComponent, selector: "fdp-wizard-summary-section", inputs: { step: "step" }, outputs: { editStep: "editStep" }, ngImport: i0, template: "<ng-container *ngFor=\"let group of step.forms; trackBy: _trackFn\">\n    <h4 fd-title [headerSize]=\"4\">{{ group.title }}</h4>\n    <fd-layout-grid style=\"margin-bottom: 2rem\">\n        <div fdLayoutGridRow>\n            <div [fdLayoutGridCol]=\"4\" [colMd]=\"2\" [colLg]=\"2\" [colXl]=\"2\">\n                <div *ngFor=\"let item of group.items\">\n                    <label fd-form-label> {{ item.label }}: </label>\n                </div>\n            </div>\n            <div [fdLayoutGridCol]=\"4\" [colMd]=\"5\" [colLg]=\"5\" [colXl]=\"5\">\n                <div *ngFor=\"let item of group.items\">\n                    <label fd-form-label>\n                        {{ item.value || '-' }}\n                    </label>\n                </div>\n            </div>\n            <div [fdLayoutGridCol]=\"1\" [colMd]=\"5\" [colLg]=\"5\" [colXl]=\"5\">\n                <fdp-link href=\"#\" (click)=\"_editStep($event)\">\n                    {{ 'platformWizardGenerator.summarySectionEditStep' | fdTranslate }}\n                </fdp-link>\n            </div>\n        </div>\n    </fd-layout-grid>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i4.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i3$1.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i3$1.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i3$1.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i4$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i5.LinkComponent, selector: "fdp-link", inputs: ["href", "target", "linkType", "type", "inverted", "title", "hreflang", "download", "media", "rel", "truncate"], outputs: ["click"] }, { kind: "pipe", type: i6.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardSummarySectionComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fdp-wizard-summary-section', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngFor=\"let group of step.forms; trackBy: _trackFn\">\n    <h4 fd-title [headerSize]=\"4\">{{ group.title }}</h4>\n    <fd-layout-grid style=\"margin-bottom: 2rem\">\n        <div fdLayoutGridRow>\n            <div [fdLayoutGridCol]=\"4\" [colMd]=\"2\" [colLg]=\"2\" [colXl]=\"2\">\n                <div *ngFor=\"let item of group.items\">\n                    <label fd-form-label> {{ item.label }}: </label>\n                </div>\n            </div>\n            <div [fdLayoutGridCol]=\"4\" [colMd]=\"5\" [colLg]=\"5\" [colXl]=\"5\">\n                <div *ngFor=\"let item of group.items\">\n                    <label fd-form-label>\n                        {{ item.value || '-' }}\n                    </label>\n                </div>\n            </div>\n            <div [fdLayoutGridCol]=\"1\" [colMd]=\"5\" [colLg]=\"5\" [colXl]=\"5\">\n                <fdp-link href=\"#\" (click)=\"_editStep($event)\">\n                    {{ 'platformWizardGenerator.summarySectionEditStep' | fdTranslate }}\n                </fdp-link>\n            </div>\n        </div>\n    </fd-layout-grid>\n</ng-container>\n" }]
-        }], propDecorators: { step: [{
-                type: Input
-            }], editStep: [{
-                type: Output
-            }] } });
-
-class WizardSummaryStepComponent {
-    /**
-     * @description Summary step status.
-     */
-    set status(status) {
-        if (status === 'current') {
-            this._wizardGeneratorService.getWizardFormValue(true).then((forms) => {
-                this._submittedForms = forms;
-                this._wizardSteps = this._wizardGeneratorService.items.filter((i) => this._submittedForms[i.id] !== undefined);
-                this._formatWizardValue().then(() => {
-                    this._shouldRender = true;
-                    this._cd.detectChanges();
-                });
-            });
-        }
-        else {
-            this._shouldRender = false;
-        }
-        this._cd.detectChanges();
-    }
-    /** @hidden */
-    constructor(_wizardGeneratorService, _formGeneratorService, _cd) {
-        this._wizardGeneratorService = _wizardGeneratorService;
-        this._formGeneratorService = _formGeneratorService;
-        this._cd = _cd;
-        /**
-         * Formatted wizard value with steps and their forms.
-         */
-        this.formattedWizardValue = [];
-        /**
-         * @hidden
-         */
-        this._shouldRender = false;
-        /** @hidden */
-        this._editStepFn = (stepId) => this.editStep(stepId);
-    }
-    /**
-     * Opens defined step for editing.
-     * @param stepId Defined step ID.
-     */
-    editStep(stepId) {
-        this._wizardGeneratorService.editStep(stepId);
-    }
-    /**
-     * @hidden
-     * @param index
-     * @returns step index
-     */
-    _trackFn(_, step) {
-        return step.id;
-    }
-    /** @hidden */
-    async _formatWizardValue() {
-        this.formattedWizardValue = [];
-        for (const step of this._wizardSteps) {
-            const component = this._wizardGeneratorService.stepsComponents.get(step.id);
-            const componentForms = component?.getVisibleForms();
-            if (!componentForms) {
-                continue;
-            }
-            const formattedStepValue = await this._formatStepValue(componentForms, step);
-            this.formattedWizardValue.push({
-                id: step.id,
-                name: step.name,
-                title: step.title,
-                forms: formattedStepValue
-            });
-        }
-    }
-    /** @hidden */
-    async _formatStepValue(componentForms, step) {
-        const formattedStepValue = [];
-        for (const formGroup of step.formGroups ?? []) {
-            const formId = formGroup.id;
-            const form = componentForms[formId];
-            // Form might be skipped due to conditional rendering
-            if (!form) {
-                continue;
-            }
-            const formattedFormValue = await this._formGeneratorService.getFormValue(form.form, true);
-            const formattedForm = {
-                title: form.title,
-                id: formId,
-                items: Object.keys(this._submittedForms[step.id][formId]).map((key) => {
-                    const formItem = this._formGeneratorService.getFormControl(form.form, key).formItem;
-                    return {
-                        label: formItem.message,
-                        value: formattedFormValue[key]
-                    };
-                })
-            };
-            formattedStepValue.push(formattedForm);
-        }
-        return formattedStepValue;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardSummaryStepComponent, deps: [{ token: WizardGeneratorService }, { token: i2.FormGeneratorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardSummaryStepComponent, selector: "fdp-wizard-summary-step", inputs: { status: "status", customSummaryStepTemplate: "customSummaryStepTemplate" }, ngImport: i0, template: "<ng-container *ngIf=\"_shouldRender\">\n    <ng-template #defaultsummaryStepTemplate>\n        <ng-container *ngFor=\"let step of formattedWizardValue; trackBy: _trackFn\">\n            <fdp-wizard-summary-section [step]=\"step\" (editStep)=\"editStep($event)\"></fdp-wizard-summary-section>\n        </ng-container>\n    </ng-template>\n    <ng-template\n        [ngTemplateOutlet]=\"customSummaryStepTemplate || defaultsummaryStepTemplate\"\n        [ngTemplateOutletContext]=\"{ steps: formattedWizardValue, editStep: _editStepFn }\"\n    ></ng-template>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: WizardSummarySectionComponent, selector: "fdp-wizard-summary-section", inputs: ["step"], outputs: ["editStep"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardSummaryStepComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fdp-wizard-summary-step', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"_shouldRender\">\n    <ng-template #defaultsummaryStepTemplate>\n        <ng-container *ngFor=\"let step of formattedWizardValue; trackBy: _trackFn\">\n            <fdp-wizard-summary-section [step]=\"step\" (editStep)=\"editStep($event)\"></fdp-wizard-summary-section>\n        </ng-container>\n    </ng-template>\n    <ng-template\n        [ngTemplateOutlet]=\"customSummaryStepTemplate || defaultsummaryStepTemplate\"\n        [ngTemplateOutletContext]=\"{ steps: formattedWizardValue, editStep: _editStepFn }\"\n    ></ng-template>\n</ng-container>\n" }]
-        }], ctorParameters: function () { return [{ type: WizardGeneratorService }, { type: i2.FormGeneratorService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { status: [{
-                type: Input
-            }], customSummaryStepTemplate: [{
-                type: Input
-            }] } });
-
 class WizardBodyComponent {
     /**
      * @description Array of visible Wizard Steps.
@@ -1302,11 +1304,20 @@ class WizardBodyComponent {
         return item.id;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardBodyComponent, deps: [{ token: WizardGeneratorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardBodyComponent, selector: "fdp-wizard-body", inputs: { responsivePaddings: "responsivePaddings", navigationButtonLabels: "navigationButtonLabels", appendToWizard: "appendToWizard", contentHeight: "contentHeight", isFirstStep: "isFirstStep", isLastStep: "isLastStep", isNextStepSummary: "isNextStepSummary", displaySummaryStep: "displaySummaryStep", goNextButtonTemplate: "goNextButtonTemplate", finishButtonTemplate: "finishButtonTemplate", customSummaryStepTemplate: "customSummaryStepTemplate", reviewButtonTemplate: "reviewButtonTemplate", isSummaryStep: "isSummaryStep", navigationButtons: "navigationButtons", unifiedLayout: "unifiedLayout", isBranchingStep: "isBranchingStep", isCurrentStepCompleted: "isCurrentStepCompleted", stepsOrderChanged: "stepsOrderChanged" }, outputs: { statusChange: "statusChange", goNext: "goNext", finish: "finish" }, ngImport: i0, template: "<fd-wizard\n    [displaySummaryStep]=\"displaySummaryStep\"\n    [responsivePaddings]=\"responsivePaddings\"\n    [appendToWizard]=\"appendToWizard\"\n    [contentHeight]=\"contentHeight\"\n    *ngIf=\"visibleItems\"\n>\n    <fd-wizard-navigation>\n        <ul fd-wizard-progress-bar>\n            <ng-container *ngFor=\"let step of visibleItems; let i = index; trackBy: _trackFn\">\n                <li\n                    fd-wizard-step\n                    [label]=\"step.name\"\n                    [status]=\"step.status\"\n                    [optionalText]=\"step.optionalText\"\n                    [branching]=\"!!step.branching\"\n                    [stepClickValidator]=\"stepClickValidatorFn(i)\"\n                    [isSummary]=\"!!step.summary\"\n                    (statusChange)=\"stepStatusChanged(step.id, $event)\"\n                    (stepClicked)=\"stepClicked(step.id)\"\n                >\n                    <fd-wizard-step-indicator [glyph]=\"step.icon || null\">\n                        <ng-container *ngIf=\"!step.icon\">{{ i + 1 }}</ng-container>\n                    </fd-wizard-step-indicator>\n                    <fd-wizard-content>\n                        <fdp-wizard-generator-step\n                            *ngIf=\"!step.summary\"\n                            [unifiedLayout]=\"unifiedLayout\"\n                            [item]=\"step\"\n                            [stepStatus]=\"step.status\"\n                        ></fdp-wizard-generator-step>\n                        <fdp-wizard-summary-step\n                            *ngIf=\"step.summary\"\n                            [customSummaryStepTemplate]=\"customSummaryStepTemplate\"\n                            [status]=\"step.status\"\n                        ></fdp-wizard-summary-step>\n\n                        <fd-wizard-next-step [canHide]=\"appendToWizard\" *ngIf=\"navigationButtons\">\n                            <ng-container *ngIf=\"!isLastStep\">\n                                <ng-template #defaultGoNextButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.goNext.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.goNext.type\"\n                                        [label]=\"navigationButtonLabels.goNext.label\"\n                                        (click)=\"goNext.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template #defaultReviewButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.review.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.review.type\"\n                                        [label]=\"navigationButtonLabels.review.label\"\n                                        (click)=\"goNext.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template\n                                    [ngIf]=\"\n                                        (isBranchingStep && (!isCurrentStepCompleted || stepsOrderChanged)) ||\n                                        !isNextStepSummary\n                                    \"\n                                    [ngIfElse]=\"reviewButton\"\n                                >\n                                    <ng-template\n                                        [ngTemplateOutlet]=\"goNextButtonTemplate || defaultGoNextButtonTemplate\"\n                                        [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                                    ></ng-template>\n                                </ng-template>\n                                <ng-template #reviewButton>\n                                    <ng-template\n                                        [ngTemplateOutlet]=\"reviewButtonTemplate || defaultReviewButtonTemplate\"\n                                        [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                                    ></ng-template>\n                                </ng-template>\n                            </ng-container>\n                            <ng-container *ngIf=\"isLastStep\">\n                                <ng-template #defaultFinishButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.finish.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.finish.type\"\n                                        [label]=\"navigationButtonLabels.finish.label\"\n                                        (click)=\"finish.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template\n                                    [ngTemplateOutlet]=\"finishButtonTemplate || defaultFinishButtonTemplate\"\n                                    [ngTemplateOutletContext]=\"{ finish: _finishFn }\"\n                                ></ng-template>\n                            </ng-container>\n                        </fd-wizard-next-step>\n                    </fd-wizard-content>\n                </li>\n            </ng-container>\n        </ul>\n    </fd-wizard-navigation>\n</fd-wizard>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3$2.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i4$2.WizardComponent, selector: "fd-wizard", inputs: ["appendToWizard", "contentHeight", "responsivePaddings", "displaySummaryStep", "ariaLabel"] }, { kind: "component", type: i4$2.WizardNavigationComponent, selector: "fd-wizard-navigation", inputs: ["ariaLabel"] }, { kind: "directive", type: i4$2.WizardProgressBarDirective, selector: "[fd-wizard-progress-bar]", inputs: ["size"] }, { kind: "component", type: i4$2.WizardStepComponent, selector: "[fd-wizard-step]", inputs: ["ariaLabel", "ariaRoleDecription", "status", "branching", "label", "optionalText", "isSummary", "stepClickValidator"], outputs: ["statusChange", "stepClicked", "stepIndicatorItemClicked"] }, { kind: "component", type: i4$2.WizardStepIndicatorComponent, selector: "fd-wizard-step-indicator", inputs: ["glyph"], outputs: ["stepIndicatorItemClicked"] }, { kind: "component", type: i4$2.WizardNextStepComponent, selector: "fd-wizard-next-step", inputs: ["floating", "canHide"] }, { kind: "component", type: i4$2.WizardContentComponent, selector: "fd-wizard-content", inputs: ["contentBackground", "size"] }, { kind: "component", type: i5$1.ButtonComponent, selector: "fdp-button", inputs: ["glyphPosition", "label", "glyph", "buttonType", "toggled", "title", "ariaSelected", "ariaDisabled", "ariaExpanded", "ariaControlsId", "ariaPressed", "name", "type", "value"], outputs: ["buttonClicked"] }, { kind: "component", type: WizardGeneratorStepComponent, selector: "fdp-wizard-generator-step", inputs: ["item", "stepStatus", "unifiedLayout"], outputs: ["formsSubmitted", "formsCreated"] }, { kind: "component", type: WizardSummaryStepComponent, selector: "fdp-wizard-summary-step", inputs: ["status", "customSummaryStepTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardBodyComponent, isStandalone: true, selector: "fdp-wizard-body", inputs: { responsivePaddings: "responsivePaddings", navigationButtonLabels: "navigationButtonLabels", appendToWizard: "appendToWizard", contentHeight: "contentHeight", isFirstStep: "isFirstStep", isLastStep: "isLastStep", isNextStepSummary: "isNextStepSummary", displaySummaryStep: "displaySummaryStep", goNextButtonTemplate: "goNextButtonTemplate", finishButtonTemplate: "finishButtonTemplate", customSummaryStepTemplate: "customSummaryStepTemplate", reviewButtonTemplate: "reviewButtonTemplate", isSummaryStep: "isSummaryStep", navigationButtons: "navigationButtons", unifiedLayout: "unifiedLayout", isBranchingStep: "isBranchingStep", isCurrentStepCompleted: "isCurrentStepCompleted", stepsOrderChanged: "stepsOrderChanged" }, outputs: { statusChange: "statusChange", goNext: "goNext", finish: "finish" }, ngImport: i0, template: "<fd-wizard\n    [displaySummaryStep]=\"displaySummaryStep\"\n    [responsivePaddings]=\"responsivePaddings\"\n    [appendToWizard]=\"appendToWizard\"\n    [contentHeight]=\"contentHeight\"\n    *ngIf=\"visibleItems\"\n>\n    <fd-wizard-navigation>\n        <ul fd-wizard-progress-bar>\n            <ng-container *ngFor=\"let step of visibleItems; let i = index; trackBy: _trackFn\">\n                <li\n                    fd-wizard-step\n                    [label]=\"step.name\"\n                    [status]=\"step.status\"\n                    [optionalText]=\"step.optionalText\"\n                    [branching]=\"!!step.branching\"\n                    [stepClickValidator]=\"stepClickValidatorFn(i)\"\n                    [isSummary]=\"!!step.summary\"\n                    (statusChange)=\"stepStatusChanged(step.id, $event)\"\n                    (stepClicked)=\"stepClicked(step.id)\"\n                >\n                    <fd-wizard-step-indicator [glyph]=\"step.icon || null\">\n                        <ng-container *ngIf=\"!step.icon\">{{ i + 1 }}</ng-container>\n                    </fd-wizard-step-indicator>\n                    <fd-wizard-content>\n                        <fdp-wizard-generator-step\n                            *ngIf=\"!step.summary\"\n                            [unifiedLayout]=\"unifiedLayout\"\n                            [item]=\"step\"\n                            [stepStatus]=\"step.status\"\n                        ></fdp-wizard-generator-step>\n                        <fdp-wizard-summary-step\n                            *ngIf=\"step.summary\"\n                            [customSummaryStepTemplate]=\"customSummaryStepTemplate\"\n                            [status]=\"step.status\"\n                        ></fdp-wizard-summary-step>\n\n                        <fd-wizard-next-step [canHide]=\"appendToWizard\" *ngIf=\"navigationButtons\">\n                            <ng-container *ngIf=\"!isLastStep\">\n                                <ng-template #defaultGoNextButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.goNext.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.goNext.type\"\n                                        [label]=\"navigationButtonLabels.goNext.label\"\n                                        (click)=\"goNext.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template #defaultReviewButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.review.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.review.type\"\n                                        [label]=\"navigationButtonLabels.review.label\"\n                                        (click)=\"goNext.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template\n                                    [ngIf]=\"\n                                        (isBranchingStep && (!isCurrentStepCompleted || stepsOrderChanged)) ||\n                                        !isNextStepSummary\n                                    \"\n                                    [ngIfElse]=\"reviewButton\"\n                                >\n                                    <ng-template\n                                        [ngTemplateOutlet]=\"goNextButtonTemplate || defaultGoNextButtonTemplate\"\n                                        [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                                    ></ng-template>\n                                </ng-template>\n                                <ng-template #reviewButton>\n                                    <ng-template\n                                        [ngTemplateOutlet]=\"reviewButtonTemplate || defaultReviewButtonTemplate\"\n                                        [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                                    ></ng-template>\n                                </ng-template>\n                            </ng-container>\n                            <ng-container *ngIf=\"isLastStep\">\n                                <ng-template #defaultFinishButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.finish.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.finish.type\"\n                                        [label]=\"navigationButtonLabels.finish.label\"\n                                        (click)=\"finish.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template\n                                    [ngTemplateOutlet]=\"finishButtonTemplate || defaultFinishButtonTemplate\"\n                                    [ngTemplateOutletContext]=\"{ finish: _finishFn }\"\n                                ></ng-template>\n                            </ng-container>\n                        </fd-wizard-next-step>\n                    </fd-wizard-content>\n                </li>\n            </ng-container>\n        </ul>\n    </fd-wizard-navigation>\n</fd-wizard>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: WizardModule }, { kind: "component", type: i2$2.WizardComponent, selector: "fd-wizard", inputs: ["appendToWizard", "contentHeight", "responsivePaddings", "displaySummaryStep", "ariaLabel"] }, { kind: "component", type: i2$2.WizardNavigationComponent, selector: "fd-wizard-navigation", inputs: ["ariaLabel"] }, { kind: "directive", type: i2$2.WizardProgressBarDirective, selector: "[fd-wizard-progress-bar]", inputs: ["size"] }, { kind: "component", type: i2$2.WizardStepComponent, selector: "[fd-wizard-step]", inputs: ["ariaLabel", "ariaRoleDecription", "status", "branching", "label", "optionalText", "isSummary", "stepClickValidator"], outputs: ["statusChange", "stepClicked", "stepIndicatorItemClicked"] }, { kind: "component", type: i2$2.WizardStepIndicatorComponent, selector: "fd-wizard-step-indicator", inputs: ["glyph"], outputs: ["stepIndicatorItemClicked"] }, { kind: "component", type: i2$2.WizardNextStepComponent, selector: "fd-wizard-next-step", inputs: ["floating", "canHide"] }, { kind: "component", type: i2$2.WizardContentComponent, selector: "fd-wizard-content", inputs: ["contentBackground", "size"] }, { kind: "directive", type: i3$1.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: WizardGeneratorStepComponent, selector: "fdp-wizard-generator-step", inputs: ["item", "stepStatus", "unifiedLayout"], outputs: ["formsSubmitted", "formsCreated"] }, { kind: "component", type: WizardSummaryStepComponent, selector: "fdp-wizard-summary-step", inputs: ["status", "customSummaryStepTemplate"] }, { kind: "ngmodule", type: PlatformButtonModule }, { kind: "component", type: i4.ButtonComponent, selector: "fdp-button", inputs: ["glyphPosition", "label", "glyph", "buttonType", "toggled", "title", "ariaSelected", "ariaDisabled", "ariaExpanded", "ariaControlsId", "ariaPressed", "name", "type", "value"], outputs: ["buttonClicked"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardBodyComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-wizard-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-wizard\n    [displaySummaryStep]=\"displaySummaryStep\"\n    [responsivePaddings]=\"responsivePaddings\"\n    [appendToWizard]=\"appendToWizard\"\n    [contentHeight]=\"contentHeight\"\n    *ngIf=\"visibleItems\"\n>\n    <fd-wizard-navigation>\n        <ul fd-wizard-progress-bar>\n            <ng-container *ngFor=\"let step of visibleItems; let i = index; trackBy: _trackFn\">\n                <li\n                    fd-wizard-step\n                    [label]=\"step.name\"\n                    [status]=\"step.status\"\n                    [optionalText]=\"step.optionalText\"\n                    [branching]=\"!!step.branching\"\n                    [stepClickValidator]=\"stepClickValidatorFn(i)\"\n                    [isSummary]=\"!!step.summary\"\n                    (statusChange)=\"stepStatusChanged(step.id, $event)\"\n                    (stepClicked)=\"stepClicked(step.id)\"\n                >\n                    <fd-wizard-step-indicator [glyph]=\"step.icon || null\">\n                        <ng-container *ngIf=\"!step.icon\">{{ i + 1 }}</ng-container>\n                    </fd-wizard-step-indicator>\n                    <fd-wizard-content>\n                        <fdp-wizard-generator-step\n                            *ngIf=\"!step.summary\"\n                            [unifiedLayout]=\"unifiedLayout\"\n                            [item]=\"step\"\n                            [stepStatus]=\"step.status\"\n                        ></fdp-wizard-generator-step>\n                        <fdp-wizard-summary-step\n                            *ngIf=\"step.summary\"\n                            [customSummaryStepTemplate]=\"customSummaryStepTemplate\"\n                            [status]=\"step.status\"\n                        ></fdp-wizard-summary-step>\n\n                        <fd-wizard-next-step [canHide]=\"appendToWizard\" *ngIf=\"navigationButtons\">\n                            <ng-container *ngIf=\"!isLastStep\">\n                                <ng-template #defaultGoNextButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.goNext.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.goNext.type\"\n                                        [label]=\"navigationButtonLabels.goNext.label\"\n                                        (click)=\"goNext.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template #defaultReviewButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.review.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.review.type\"\n                                        [label]=\"navigationButtonLabels.review.label\"\n                                        (click)=\"goNext.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template\n                                    [ngIf]=\"\n                                        (isBranchingStep && (!isCurrentStepCompleted || stepsOrderChanged)) ||\n                                        !isNextStepSummary\n                                    \"\n                                    [ngIfElse]=\"reviewButton\"\n                                >\n                                    <ng-template\n                                        [ngTemplateOutlet]=\"goNextButtonTemplate || defaultGoNextButtonTemplate\"\n                                        [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                                    ></ng-template>\n                                </ng-template>\n                                <ng-template #reviewButton>\n                                    <ng-template\n                                        [ngTemplateOutlet]=\"reviewButtonTemplate || defaultReviewButtonTemplate\"\n                                        [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                                    ></ng-template>\n                                </ng-template>\n                            </ng-container>\n                            <ng-container *ngIf=\"isLastStep\">\n                                <ng-template #defaultFinishButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.finish.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.finish.type\"\n                                        [label]=\"navigationButtonLabels.finish.label\"\n                                        (click)=\"finish.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template\n                                    [ngTemplateOutlet]=\"finishButtonTemplate || defaultFinishButtonTemplate\"\n                                    [ngTemplateOutletContext]=\"{ finish: _finishFn }\"\n                                ></ng-template>\n                            </ng-container>\n                        </fd-wizard-next-step>\n                    </fd-wizard-content>\n                </li>\n            </ng-container>\n        </ul>\n    </fd-wizard-navigation>\n</fd-wizard>\n" }]
+            args: [{ selector: 'fdp-wizard-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
+                        NgIf,
+                        WizardModule,
+                        NgFor,
+                        WizardGeneratorStepComponent,
+                        WizardSummaryStepComponent,
+                        PlatformButtonModule,
+                        ContentDensityDirective,
+                        NgTemplateOutlet
+                    ], template: "<fd-wizard\n    [displaySummaryStep]=\"displaySummaryStep\"\n    [responsivePaddings]=\"responsivePaddings\"\n    [appendToWizard]=\"appendToWizard\"\n    [contentHeight]=\"contentHeight\"\n    *ngIf=\"visibleItems\"\n>\n    <fd-wizard-navigation>\n        <ul fd-wizard-progress-bar>\n            <ng-container *ngFor=\"let step of visibleItems; let i = index; trackBy: _trackFn\">\n                <li\n                    fd-wizard-step\n                    [label]=\"step.name\"\n                    [status]=\"step.status\"\n                    [optionalText]=\"step.optionalText\"\n                    [branching]=\"!!step.branching\"\n                    [stepClickValidator]=\"stepClickValidatorFn(i)\"\n                    [isSummary]=\"!!step.summary\"\n                    (statusChange)=\"stepStatusChanged(step.id, $event)\"\n                    (stepClicked)=\"stepClicked(step.id)\"\n                >\n                    <fd-wizard-step-indicator [glyph]=\"step.icon || null\">\n                        <ng-container *ngIf=\"!step.icon\">{{ i + 1 }}</ng-container>\n                    </fd-wizard-step-indicator>\n                    <fd-wizard-content>\n                        <fdp-wizard-generator-step\n                            *ngIf=\"!step.summary\"\n                            [unifiedLayout]=\"unifiedLayout\"\n                            [item]=\"step\"\n                            [stepStatus]=\"step.status\"\n                        ></fdp-wizard-generator-step>\n                        <fdp-wizard-summary-step\n                            *ngIf=\"step.summary\"\n                            [customSummaryStepTemplate]=\"customSummaryStepTemplate\"\n                            [status]=\"step.status\"\n                        ></fdp-wizard-summary-step>\n\n                        <fd-wizard-next-step [canHide]=\"appendToWizard\" *ngIf=\"navigationButtons\">\n                            <ng-container *ngIf=\"!isLastStep\">\n                                <ng-template #defaultGoNextButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.goNext.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.goNext.type\"\n                                        [label]=\"navigationButtonLabels.goNext.label\"\n                                        (click)=\"goNext.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template #defaultReviewButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.review.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.review.type\"\n                                        [label]=\"navigationButtonLabels.review.label\"\n                                        (click)=\"goNext.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template\n                                    [ngIf]=\"\n                                        (isBranchingStep && (!isCurrentStepCompleted || stepsOrderChanged)) ||\n                                        !isNextStepSummary\n                                    \"\n                                    [ngIfElse]=\"reviewButton\"\n                                >\n                                    <ng-template\n                                        [ngTemplateOutlet]=\"goNextButtonTemplate || defaultGoNextButtonTemplate\"\n                                        [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                                    ></ng-template>\n                                </ng-template>\n                                <ng-template #reviewButton>\n                                    <ng-template\n                                        [ngTemplateOutlet]=\"reviewButtonTemplate || defaultReviewButtonTemplate\"\n                                        [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                                    ></ng-template>\n                                </ng-template>\n                            </ng-container>\n                            <ng-container *ngIf=\"isLastStep\">\n                                <ng-template #defaultFinishButtonTemplate>\n                                    <fdp-button\n                                        [fdContentDensity]=\"navigationButtonLabels.finish.contentDensity\"\n                                        [buttonType]=\"navigationButtonLabels.finish.type\"\n                                        [label]=\"navigationButtonLabels.finish.label\"\n                                        (click)=\"finish.emit()\"\n                                    ></fdp-button>\n                                </ng-template>\n                                <ng-template\n                                    [ngTemplateOutlet]=\"finishButtonTemplate || defaultFinishButtonTemplate\"\n                                    [ngTemplateOutletContext]=\"{ finish: _finishFn }\"\n                                ></ng-template>\n                            </ng-container>\n                        </fd-wizard-next-step>\n                    </fd-wizard-content>\n                </li>\n            </ng-container>\n        </ul>\n    </fd-wizard-navigation>\n</fd-wizard>\n" }]
         }], ctorParameters: function () { return [{ type: WizardGeneratorService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { responsivePaddings: [{
                 type: Input
             }], navigationButtonLabels: [{
@@ -1353,10 +1364,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class DialogWizardGeneratorComponent extends BaseWizardGenerator {
     /** @hidden */
-    constructor(_wizardGeneratorService, _cd, _dialogRef, _dialogService) {
+    constructor(_wizardGeneratorService, _cd, _dialogRef) {
         super(_wizardGeneratorService, _cd);
         this._dialogRef = _dialogRef;
-        this._dialogService = _dialogService;
         /**
          * @description Confirmation message when wizard dialog close button has been clicked.
          */
@@ -1369,6 +1379,8 @@ class DialogWizardGeneratorComponent extends BaseWizardGenerator {
          * @description Cancel button text for close confirmation dialog.
          */
         this.confirmationDialogCancelText = 'Cancel';
+        /** @hidden */
+        this._messageBoxService = inject(MessageBoxService);
         /**
          * @hidden
          */
@@ -1424,8 +1436,8 @@ class DialogWizardGeneratorComponent extends BaseWizardGenerator {
             return;
         }
         const template = this.confirmationDialogTemplate || this.defaultConfirmationDialogTemplate;
-        const dialogRef = this._dialogService.open(template, { responsivePadding: true });
-        dialogRef.afterClosed
+        const messageBoxRef = this._messageBoxService.open(template, { responsivePadding: true });
+        messageBoxRef.afterClosed
             .pipe(filter((result) => result), takeUntil(this._onDestroy$))
             .subscribe(() => {
             this._dialogRef.dismiss();
@@ -1451,13 +1463,26 @@ class DialogWizardGeneratorComponent extends BaseWizardGenerator {
             this._dialogRef.close(wizardResult);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DialogWizardGeneratorComponent, deps: [{ token: WizardGeneratorService }, { token: i0.ChangeDetectorRef }, { token: i2$1.DialogRef }, { token: i2$1.DialogService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DialogWizardGeneratorComponent, selector: "fdp-dialog-wizard-generator", providers: [WizardGeneratorService, FormGeneratorService], viewQueries: [{ propertyName: "defaultConfirmationDialogTemplate", first: true, predicate: ["defaultConfirmationDialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <h2 fd-title [headerSize]=\"title.size\">{{ title.text }}</h2>\n    </fd-dialog-header>\n    <fd-dialog-body>\n        <fdp-wizard-body\n            [navigationButtons]=\"false\"\n            [displaySummaryStep]=\"displaySummaryStep\"\n            [responsivePaddings]=\"responsivePaddings\"\n            [navigationButtonLabels]=\"_navigationButtonLabels\"\n            [customSummaryStepTemplate]=\"summaryStepTemplate\"\n            [reviewButtonTemplate]=\"reviewButtonTemplate\"\n            [hidden]=\"!wizardCreated\"\n            [appendToWizard]=\"appendToWizard\"\n            [unifiedLayout]=\"unifiedLayout\"\n            [contentHeight]=\"contentHeight\"\n            (statusChange)=\"stepStatusChanged($event.id, $event.status)\"\n        ></fdp-wizard-body>\n        <div\n            fd-bar\n            barDesign=\"floating-footer\"\n            [class.fd-bar--responsive-paddings]=\"responsivePaddings\"\n            *ngIf=\"wizardCreated\"\n        >\n            <div fd-bar-right>\n                <ng-container *ngIf=\"!isFirstStep\">\n                    <ng-template #defaultGoBackButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.goBack.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.goBack.type\"\n                            [label]=\"_navigationButtonLabels.goBack.label\"\n                            (click)=\"goBack()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"goBackButtonTemplate || defaultGoBackButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ goBack: _goBackFn }\"\n                    ></ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"!isLastStep\">\n                    <ng-template #defaultGoNextButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.goNext.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.goNext.type\"\n                            [label]=\"_navigationButtonLabels.goNext.label\"\n                            (click)=\"goNext()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template #defaultReviewButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.review.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.review.type\"\n                            [label]=\"_navigationButtonLabels.review.label\"\n                            (click)=\"goNext()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngIf]=\"\n                            (isBranchingStep && (!isCurrentStepCompleted || _stepsOrderChanged)) || !isNextStepSummary\n                        \"\n                        [ngIfElse]=\"reviewButton\"\n                    >\n                        <ng-template\n                            [ngTemplateOutlet]=\"goNextButtonTemplate || defaultGoNextButtonTemplate\"\n                            [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                        ></ng-template>\n                    </ng-template>\n                    <ng-template #reviewButton>\n                        <ng-template\n                            [ngTemplateOutlet]=\"reviewButtonTemplate || defaultReviewButtonTemplate\"\n                            [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                        ></ng-template>\n                    </ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"isLastStep\">\n                    <ng-template #defaultFinishButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.finish.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.finish.type\"\n                            [label]=\"_navigationButtonLabels.finish.label\"\n                            (click)=\"finish()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"finishButtonTemplate || defaultFinishButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ finish: _finishFn }\"\n                    ></ng-template>\n                </ng-container>\n                <ng-container>\n                    <ng-template #defaultCancelButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.cancel.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.cancel.type\"\n                            [label]=\"_navigationButtonLabels.cancel.label\"\n                            (click)=\"cancel()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"cancelButtonTemplate || defaultCancelButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ cancel: _cancelFn }\"\n                    ></ng-template>\n                </ng-container>\n            </div>\n        </div>\n    </fd-dialog-body>\n</fd-dialog>\n\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #defaultConfirmationDialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            {{ confirmationDialogText }}\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                fdType=\"emphasized\"\n                [label]=\"confirmationDialogCloseText\"\n                type=\"submit\"\n                (click)=\"dialog.close(true)\"\n            >\n            </fd-button-bar>\n            <fd-button-bar fdkInitialFocus [label]=\"confirmationDialogCancelText\" (click)=\"dialog.dismiss()\">\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i2$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i2$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i2$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i2$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "component", type: i4$3.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4$3.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i4$3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "directive", type: i3$2.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i4.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i7.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: i5$1.ButtonComponent, selector: "fdp-button", inputs: ["glyphPosition", "label", "glyph", "buttonType", "toggled", "title", "ariaSelected", "ariaDisabled", "ariaExpanded", "ariaControlsId", "ariaPressed", "name", "type", "value"], outputs: ["buttonClicked"] }, { kind: "component", type: WizardBodyComponent, selector: "fdp-wizard-body", inputs: ["responsivePaddings", "navigationButtonLabels", "appendToWizard", "contentHeight", "isFirstStep", "isLastStep", "isNextStepSummary", "displaySummaryStep", "goNextButtonTemplate", "finishButtonTemplate", "customSummaryStepTemplate", "reviewButtonTemplate", "isSummaryStep", "navigationButtons", "unifiedLayout", "isBranchingStep", "isCurrentStepCompleted", "stepsOrderChanged"], outputs: ["statusChange", "goNext", "finish"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DialogWizardGeneratorComponent, deps: [{ token: WizardGeneratorService }, { token: i0.ChangeDetectorRef }, { token: i2$3.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DialogWizardGeneratorComponent, isStandalone: true, selector: "fdp-dialog-wizard-generator", providers: [WizardGeneratorService, FormGeneratorService], viewQueries: [{ propertyName: "defaultConfirmationDialogTemplate", first: true, predicate: ["defaultConfirmationDialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-dialog>\n    <fd-dialog-header>\n        <h2 fd-title [headerSize]=\"title.size\">{{ title.text }}</h2>\n    </fd-dialog-header>\n    <fd-dialog-body>\n        <fdp-wizard-body\n            [navigationButtons]=\"false\"\n            [displaySummaryStep]=\"displaySummaryStep\"\n            [responsivePaddings]=\"responsivePaddings\"\n            [navigationButtonLabels]=\"_navigationButtonLabels\"\n            [customSummaryStepTemplate]=\"summaryStepTemplate\"\n            [reviewButtonTemplate]=\"reviewButtonTemplate\"\n            [hidden]=\"!wizardCreated\"\n            [appendToWizard]=\"appendToWizard\"\n            [unifiedLayout]=\"unifiedLayout\"\n            [contentHeight]=\"contentHeight\"\n            (statusChange)=\"stepStatusChanged($event.id, $event.status)\"\n        ></fdp-wizard-body>\n        <div\n            fd-bar\n            barDesign=\"floating-footer\"\n            [class.fd-bar--responsive-paddings]=\"responsivePaddings\"\n            *ngIf=\"wizardCreated\"\n        >\n            <div fd-bar-right>\n                <ng-container *ngIf=\"!isFirstStep\">\n                    <ng-template #defaultGoBackButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.goBack.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.goBack.type\"\n                            [label]=\"_navigationButtonLabels.goBack.label\"\n                            (click)=\"goBack()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"goBackButtonTemplate || defaultGoBackButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ goBack: _goBackFn }\"\n                    ></ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"!isLastStep\">\n                    <ng-template #defaultGoNextButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.goNext.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.goNext.type\"\n                            [label]=\"_navigationButtonLabels.goNext.label\"\n                            (click)=\"goNext()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template #defaultReviewButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.review.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.review.type\"\n                            [label]=\"_navigationButtonLabels.review.label\"\n                            (click)=\"goNext()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngIf]=\"\n                            (isBranchingStep && (!isCurrentStepCompleted || _stepsOrderChanged)) || !isNextStepSummary\n                        \"\n                        [ngIfElse]=\"reviewButton\"\n                    >\n                        <ng-template\n                            [ngTemplateOutlet]=\"goNextButtonTemplate || defaultGoNextButtonTemplate\"\n                            [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                        ></ng-template>\n                    </ng-template>\n                    <ng-template #reviewButton>\n                        <ng-template\n                            [ngTemplateOutlet]=\"reviewButtonTemplate || defaultReviewButtonTemplate\"\n                            [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                        ></ng-template>\n                    </ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"isLastStep\">\n                    <ng-template #defaultFinishButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.finish.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.finish.type\"\n                            [label]=\"_navigationButtonLabels.finish.label\"\n                            (click)=\"finish()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"finishButtonTemplate || defaultFinishButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ finish: _finishFn }\"\n                    ></ng-template>\n                </ng-container>\n                <ng-container>\n                    <ng-template #defaultCancelButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.cancel.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.cancel.type\"\n                            [label]=\"_navigationButtonLabels.cancel.label\"\n                            (click)=\"cancel()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"cancelButtonTemplate || defaultCancelButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ cancel: _cancelFn }\"\n                    ></ng-template>\n                </ng-container>\n            </div>\n        </div>\n    </fd-dialog-body>\n</fd-dialog>\n\n<ng-template let-messageBox let-messageBoxConfig=\"messageBoxConfig\" #defaultConfirmationDialogTemplate>\n    <fd-message-box [messageBoxConfig]=\"messageBoxConfig\" [messageBoxRef]=\"messageBox\">\n        <fd-message-box-body>\n            {{ confirmationDialogText }}\n        </fd-message-box-body>\n        <fd-message-box-footer>\n            <fd-button-bar\n                fdType=\"emphasized\"\n                [label]=\"confirmationDialogCloseText\"\n                type=\"submit\"\n                (click)=\"messageBox.close(true)\"\n            >\n            </fd-button-bar>\n            <fd-button-bar fdkInitialFocus [label]=\"confirmationDialogCancelText\" (click)=\"messageBox.dismiss()\">\n            </fd-button-bar>\n        </fd-message-box-footer>\n    </fd-message-box>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i2$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i2$3.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i2$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "directive", type: i3$1.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i6.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: WizardBodyComponent, selector: "fdp-wizard-body", inputs: ["responsivePaddings", "navigationButtonLabels", "appendToWizard", "contentHeight", "isFirstStep", "isLastStep", "isNextStepSummary", "displaySummaryStep", "goNextButtonTemplate", "finishButtonTemplate", "customSummaryStepTemplate", "reviewButtonTemplate", "isSummaryStep", "navigationButtons", "unifiedLayout", "isBranchingStep", "isCurrentStepCompleted", "stepsOrderChanged"], outputs: ["statusChange", "goNext", "finish"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: BarModule }, { kind: "ngmodule", type: PlatformButtonModule }, { kind: "component", type: i4.ButtonComponent, selector: "fdp-button", inputs: ["glyphPosition", "label", "glyph", "buttonType", "toggled", "title", "ariaSelected", "ariaDisabled", "ariaExpanded", "ariaControlsId", "ariaPressed", "name", "type", "value"], outputs: ["buttonClicked"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MessageBoxModule }, { kind: "component", type: i8.MessageBoxFooterComponent, selector: "fd-message-box-footer" }, { kind: "component", type: i8.MessageBoxBodyComponent, selector: "fd-message-box-body" }, { kind: "component", type: i8.MessageBoxComponent, selector: "fd-message-box", inputs: ["class", "messageBoxRef", "messageBoxConfig"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DialogWizardGeneratorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-dialog-wizard-generator', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [WizardGeneratorService, FormGeneratorService], template: "<fd-dialog>\n    <fd-dialog-header>\n        <h2 fd-title [headerSize]=\"title.size\">{{ title.text }}</h2>\n    </fd-dialog-header>\n    <fd-dialog-body>\n        <fdp-wizard-body\n            [navigationButtons]=\"false\"\n            [displaySummaryStep]=\"displaySummaryStep\"\n            [responsivePaddings]=\"responsivePaddings\"\n            [navigationButtonLabels]=\"_navigationButtonLabels\"\n            [customSummaryStepTemplate]=\"summaryStepTemplate\"\n            [reviewButtonTemplate]=\"reviewButtonTemplate\"\n            [hidden]=\"!wizardCreated\"\n            [appendToWizard]=\"appendToWizard\"\n            [unifiedLayout]=\"unifiedLayout\"\n            [contentHeight]=\"contentHeight\"\n            (statusChange)=\"stepStatusChanged($event.id, $event.status)\"\n        ></fdp-wizard-body>\n        <div\n            fd-bar\n            barDesign=\"floating-footer\"\n            [class.fd-bar--responsive-paddings]=\"responsivePaddings\"\n            *ngIf=\"wizardCreated\"\n        >\n            <div fd-bar-right>\n                <ng-container *ngIf=\"!isFirstStep\">\n                    <ng-template #defaultGoBackButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.goBack.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.goBack.type\"\n                            [label]=\"_navigationButtonLabels.goBack.label\"\n                            (click)=\"goBack()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"goBackButtonTemplate || defaultGoBackButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ goBack: _goBackFn }\"\n                    ></ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"!isLastStep\">\n                    <ng-template #defaultGoNextButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.goNext.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.goNext.type\"\n                            [label]=\"_navigationButtonLabels.goNext.label\"\n                            (click)=\"goNext()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template #defaultReviewButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.review.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.review.type\"\n                            [label]=\"_navigationButtonLabels.review.label\"\n                            (click)=\"goNext()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngIf]=\"\n                            (isBranchingStep && (!isCurrentStepCompleted || _stepsOrderChanged)) || !isNextStepSummary\n                        \"\n                        [ngIfElse]=\"reviewButton\"\n                    >\n                        <ng-template\n                            [ngTemplateOutlet]=\"goNextButtonTemplate || defaultGoNextButtonTemplate\"\n                            [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                        ></ng-template>\n                    </ng-template>\n                    <ng-template #reviewButton>\n                        <ng-template\n                            [ngTemplateOutlet]=\"reviewButtonTemplate || defaultReviewButtonTemplate\"\n                            [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                        ></ng-template>\n                    </ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"isLastStep\">\n                    <ng-template #defaultFinishButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.finish.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.finish.type\"\n                            [label]=\"_navigationButtonLabels.finish.label\"\n                            (click)=\"finish()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"finishButtonTemplate || defaultFinishButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ finish: _finishFn }\"\n                    ></ng-template>\n                </ng-container>\n                <ng-container>\n                    <ng-template #defaultCancelButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.cancel.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.cancel.type\"\n                            [label]=\"_navigationButtonLabels.cancel.label\"\n                            (click)=\"cancel()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"cancelButtonTemplate || defaultCancelButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ cancel: _cancelFn }\"\n                    ></ng-template>\n                </ng-container>\n            </div>\n        </div>\n    </fd-dialog-body>\n</fd-dialog>\n\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #defaultConfirmationDialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            {{ confirmationDialogText }}\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                fdType=\"emphasized\"\n                [label]=\"confirmationDialogCloseText\"\n                type=\"submit\"\n                (click)=\"dialog.close(true)\"\n            >\n            </fd-button-bar>\n            <fd-button-bar fdkInitialFocus [label]=\"confirmationDialogCancelText\" (click)=\"dialog.dismiss()\">\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n" }]
-        }], ctorParameters: function () { return [{ type: WizardGeneratorService }, { type: i0.ChangeDetectorRef }, { type: i2$1.DialogRef }, { type: i2$1.DialogService }]; }, propDecorators: { defaultConfirmationDialogTemplate: [{
+            args: [{ selector: 'fdp-dialog-wizard-generator', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [WizardGeneratorService, FormGeneratorService], standalone: true, imports: [
+                        DialogModule,
+                        TitleComponent,
+                        CdkScrollable,
+                        ScrollbarDirective,
+                        WizardBodyComponent,
+                        NgIf,
+                        BarModule,
+                        PlatformButtonModule,
+                        ContentDensityDirective,
+                        NgTemplateOutlet,
+                        MessageBoxModule,
+                        InitialFocusDirective
+                    ], template: "<fd-dialog>\n    <fd-dialog-header>\n        <h2 fd-title [headerSize]=\"title.size\">{{ title.text }}</h2>\n    </fd-dialog-header>\n    <fd-dialog-body>\n        <fdp-wizard-body\n            [navigationButtons]=\"false\"\n            [displaySummaryStep]=\"displaySummaryStep\"\n            [responsivePaddings]=\"responsivePaddings\"\n            [navigationButtonLabels]=\"_navigationButtonLabels\"\n            [customSummaryStepTemplate]=\"summaryStepTemplate\"\n            [reviewButtonTemplate]=\"reviewButtonTemplate\"\n            [hidden]=\"!wizardCreated\"\n            [appendToWizard]=\"appendToWizard\"\n            [unifiedLayout]=\"unifiedLayout\"\n            [contentHeight]=\"contentHeight\"\n            (statusChange)=\"stepStatusChanged($event.id, $event.status)\"\n        ></fdp-wizard-body>\n        <div\n            fd-bar\n            barDesign=\"floating-footer\"\n            [class.fd-bar--responsive-paddings]=\"responsivePaddings\"\n            *ngIf=\"wizardCreated\"\n        >\n            <div fd-bar-right>\n                <ng-container *ngIf=\"!isFirstStep\">\n                    <ng-template #defaultGoBackButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.goBack.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.goBack.type\"\n                            [label]=\"_navigationButtonLabels.goBack.label\"\n                            (click)=\"goBack()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"goBackButtonTemplate || defaultGoBackButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ goBack: _goBackFn }\"\n                    ></ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"!isLastStep\">\n                    <ng-template #defaultGoNextButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.goNext.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.goNext.type\"\n                            [label]=\"_navigationButtonLabels.goNext.label\"\n                            (click)=\"goNext()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template #defaultReviewButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.review.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.review.type\"\n                            [label]=\"_navigationButtonLabels.review.label\"\n                            (click)=\"goNext()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngIf]=\"\n                            (isBranchingStep && (!isCurrentStepCompleted || _stepsOrderChanged)) || !isNextStepSummary\n                        \"\n                        [ngIfElse]=\"reviewButton\"\n                    >\n                        <ng-template\n                            [ngTemplateOutlet]=\"goNextButtonTemplate || defaultGoNextButtonTemplate\"\n                            [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                        ></ng-template>\n                    </ng-template>\n                    <ng-template #reviewButton>\n                        <ng-template\n                            [ngTemplateOutlet]=\"reviewButtonTemplate || defaultReviewButtonTemplate\"\n                            [ngTemplateOutletContext]=\"{ goNext: _goNextFn }\"\n                        ></ng-template>\n                    </ng-template>\n                </ng-container>\n                <ng-container *ngIf=\"isLastStep\">\n                    <ng-template #defaultFinishButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.finish.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.finish.type\"\n                            [label]=\"_navigationButtonLabels.finish.label\"\n                            (click)=\"finish()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"finishButtonTemplate || defaultFinishButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ finish: _finishFn }\"\n                    ></ng-template>\n                </ng-container>\n                <ng-container>\n                    <ng-template #defaultCancelButtonTemplate>\n                        <fdp-button\n                            class=\"fd-bar__element\"\n                            [fdContentDensity]=\"_navigationButtonLabels.cancel.contentDensity\"\n                            [buttonType]=\"_navigationButtonLabels.cancel.type\"\n                            [label]=\"_navigationButtonLabels.cancel.label\"\n                            (click)=\"cancel()\"\n                        ></fdp-button>\n                    </ng-template>\n                    <ng-template\n                        [ngTemplateOutlet]=\"cancelButtonTemplate || defaultCancelButtonTemplate\"\n                        [ngTemplateOutletContext]=\"{ cancel: _cancelFn }\"\n                    ></ng-template>\n                </ng-container>\n            </div>\n        </div>\n    </fd-dialog-body>\n</fd-dialog>\n\n<ng-template let-messageBox let-messageBoxConfig=\"messageBoxConfig\" #defaultConfirmationDialogTemplate>\n    <fd-message-box [messageBoxConfig]=\"messageBoxConfig\" [messageBoxRef]=\"messageBox\">\n        <fd-message-box-body>\n            {{ confirmationDialogText }}\n        </fd-message-box-body>\n        <fd-message-box-footer>\n            <fd-button-bar\n                fdType=\"emphasized\"\n                [label]=\"confirmationDialogCloseText\"\n                type=\"submit\"\n                (click)=\"messageBox.close(true)\"\n            >\n            </fd-button-bar>\n            <fd-button-bar fdkInitialFocus [label]=\"confirmationDialogCancelText\" (click)=\"messageBox.dismiss()\">\n            </fd-button-bar>\n        </fd-message-box-footer>\n    </fd-message-box>\n</ng-template>\n" }]
+        }], ctorParameters: function () { return [{ type: WizardGeneratorService }, { type: i0.ChangeDetectorRef }, { type: i2$3.DialogRef }]; }, propDecorators: { defaultConfirmationDialogTemplate: [{
                 type: ViewChild,
                 args: ['defaultConfirmationDialogTemplate']
             }] } });
@@ -1479,54 +1504,58 @@ class WizardDialogGeneratorService {
         const dialogRef = this._dialogService.open(DialogWizardGeneratorComponent, config);
         return dialogRef;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardDialogGeneratorService, deps: [{ token: i2$1.DialogService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardDialogGeneratorService, deps: [{ token: i2$3.DialogService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardDialogGeneratorService }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardDialogGeneratorService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i2$1.DialogService }]; } });
+        }], ctorParameters: function () { return [{ type: i2$3.DialogService }]; } });
 
 class WizardGeneratorGoNextButtonDirective {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorGoNextButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorGoNextButtonDirective, selector: "[fdpWizardGeneratorGoNextButton], [fdp-wizard-generator-go-next-button]", ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorGoNextButtonDirective, isStandalone: true, selector: "[fdpWizardGeneratorGoNextButton], [fdp-wizard-generator-go-next-button]", ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorGoNextButtonDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[fdpWizardGeneratorGoNextButton], [fdp-wizard-generator-go-next-button]'
+                    selector: '[fdpWizardGeneratorGoNextButton], [fdp-wizard-generator-go-next-button]',
+                    standalone: true
                 }]
         }] });
 
 class WizardGeneratorFinishButtonDirective {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorFinishButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorFinishButtonDirective, selector: "[fdpWizardGeneratorFinishButton], [fdp-wizard-generator-finish-button]", ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorFinishButtonDirective, isStandalone: true, selector: "[fdpWizardGeneratorFinishButton], [fdp-wizard-generator-finish-button]", ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorFinishButtonDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[fdpWizardGeneratorFinishButton], [fdp-wizard-generator-finish-button]'
+                    selector: '[fdpWizardGeneratorFinishButton], [fdp-wizard-generator-finish-button]',
+                    standalone: true
                 }]
         }] });
 
 class WizardGeneratorSummaryStepDirective {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorSummaryStepDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorSummaryStepDirective, selector: "[fdpWizardGeneratorSummaryStep], [fdp-wizard-generator-summary-step]", ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorSummaryStepDirective, isStandalone: true, selector: "[fdpWizardGeneratorSummaryStep], [fdp-wizard-generator-summary-step]", ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorSummaryStepDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[fdpWizardGeneratorSummaryStep], [fdp-wizard-generator-summary-step]'
+                    selector: '[fdpWizardGeneratorSummaryStep], [fdp-wizard-generator-summary-step]',
+                    standalone: true
                 }]
         }] });
 
 class WizardGeneratorReviewButtonDirective {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorReviewButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorReviewButtonDirective, selector: "[fdpWizardGeneratorReviewButton], [fdp-wizard-generator-review-button]", ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorReviewButtonDirective, isStandalone: true, selector: "[fdpWizardGeneratorReviewButton], [fdp-wizard-generator-review-button]", ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorReviewButtonDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[fdpWizardGeneratorReviewButton], [fdp-wizard-generator-review-button]'
+                    selector: '[fdpWizardGeneratorReviewButton], [fdp-wizard-generator-review-button]',
+                    standalone: true
                 }]
         }] });
 
@@ -1536,11 +1565,11 @@ class WizardGeneratorComponent extends BaseWizardGenerator {
         super(_wizardGeneratorService, _cd);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorComponent, deps: [{ token: WizardGeneratorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorComponent, selector: "fdp-wizard-generator", providers: [WizardGeneratorService, FormGeneratorService], queries: [{ propertyName: "finishButtonTemplate", first: true, predicate: WizardGeneratorFinishButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "goNextButtonTemplate", first: true, predicate: WizardGeneratorGoNextButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "customSummaryStepTemplate", first: true, predicate: WizardGeneratorSummaryStepDirective, descendants: true, read: TemplateRef }, { propertyName: "reviewButtonTemplate", first: true, predicate: WizardGeneratorReviewButtonDirective, descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"wizardCreated; else loadingTemplate\">\n    <fdp-wizard-body\n        [navigationButtonLabels]=\"_navigationButtonLabels\"\n        [goNextButtonTemplate]=\"goNextButtonTemplate\"\n        [finishButtonTemplate]=\"finishButtonTemplate\"\n        [customSummaryStepTemplate]=\"customSummaryStepTemplate\"\n        [reviewButtonTemplate]=\"reviewButtonTemplate\"\n        [responsivePaddings]=\"responsivePaddings\"\n        [hidden]=\"!wizardCreated\"\n        [appendToWizard]=\"appendToWizard\"\n        [contentHeight]=\"contentHeight\"\n        [isFirstStep]=\"isFirstStep\"\n        [isLastStep]=\"isLastStep\"\n        [isNextStepSummary]=\"isNextStepSummary\"\n        [isSummaryStep]=\"isSummaryStep\"\n        [displaySummaryStep]=\"displaySummaryStep\"\n        [navigationButtons]=\"navigationButtons\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [isBranchingStep]=\"isBranchingStep\"\n        [isCurrentStepCompleted]=\"isCurrentStepCompleted\"\n        [stepsOrderChanged]=\"_stepsOrderChanged\"\n        (statusChange)=\"stepStatusChanged($event.id, $event.status)\"\n        (goNext)=\"goNext()\"\n        (finish)=\"finish()\"\n    ></fdp-wizard-body>\n</ng-container>\n\n<!-- The Wizard -->\n<ng-template #loadingTemplate>\n    <fd-wizard>\n        <fd-wizard-navigation>\n            <ul fd-wizard-progress-bar size=\"lg\" role=\"list\" aria-label=\"Wizard Steps\">\n                <li *fdkRepeat=\"3; let i = index\" fd-wizard-step [status]=\"i === 0 ? 'current' : 'upcoming'\">\n                    <fd-skeleton type=\"rectangle\" width=\"32px\" height=\"32px\"></fd-skeleton>\n\n                    <fd-wizard-content size=\"lg\">\n                        <fd-skeleton type=\"text\" width=\"60%\"></fd-skeleton>\n                    </fd-wizard-content>\n                </li>\n            </ul>\n        </fd-wizard-navigation>\n    </fd-wizard>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$2.WizardComponent, selector: "fd-wizard", inputs: ["appendToWizard", "contentHeight", "responsivePaddings", "displaySummaryStep", "ariaLabel"] }, { kind: "component", type: i4$2.WizardNavigationComponent, selector: "fd-wizard-navigation", inputs: ["ariaLabel"] }, { kind: "directive", type: i4$2.WizardProgressBarDirective, selector: "[fd-wizard-progress-bar]", inputs: ["size"] }, { kind: "component", type: i4$2.WizardStepComponent, selector: "[fd-wizard-step]", inputs: ["ariaLabel", "ariaRoleDecription", "status", "branching", "label", "optionalText", "isSummary", "stepClickValidator"], outputs: ["statusChange", "stepClicked", "stepIndicatorItemClicked"] }, { kind: "component", type: i4$2.WizardContentComponent, selector: "fd-wizard-content", inputs: ["contentBackground", "size"] }, { kind: "component", type: i4$4.SkeletonComponent, selector: "fd-skeleton", inputs: ["animated", "type", "textLines", "width", "height"] }, { kind: "directive", type: i7.RepeatDirective, selector: "[fdkRepeat]", inputs: ["fdkRepeat"] }, { kind: "component", type: WizardBodyComponent, selector: "fdp-wizard-body", inputs: ["responsivePaddings", "navigationButtonLabels", "appendToWizard", "contentHeight", "isFirstStep", "isLastStep", "isNextStepSummary", "displaySummaryStep", "goNextButtonTemplate", "finishButtonTemplate", "customSummaryStepTemplate", "reviewButtonTemplate", "isSummaryStep", "navigationButtons", "unifiedLayout", "isBranchingStep", "isCurrentStepCompleted", "stepsOrderChanged"], outputs: ["statusChange", "goNext", "finish"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: WizardGeneratorComponent, isStandalone: true, selector: "fdp-wizard-generator", providers: [WizardGeneratorService, FormGeneratorService], queries: [{ propertyName: "finishButtonTemplate", first: true, predicate: WizardGeneratorFinishButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "goNextButtonTemplate", first: true, predicate: WizardGeneratorGoNextButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "customSummaryStepTemplate", first: true, predicate: WizardGeneratorSummaryStepDirective, descendants: true, read: TemplateRef }, { propertyName: "reviewButtonTemplate", first: true, predicate: WizardGeneratorReviewButtonDirective, descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"wizardCreated; else loadingTemplate\">\n    <fdp-wizard-body\n        [navigationButtonLabels]=\"_navigationButtonLabels\"\n        [goNextButtonTemplate]=\"goNextButtonTemplate\"\n        [finishButtonTemplate]=\"finishButtonTemplate\"\n        [customSummaryStepTemplate]=\"customSummaryStepTemplate\"\n        [reviewButtonTemplate]=\"reviewButtonTemplate\"\n        [responsivePaddings]=\"responsivePaddings\"\n        [hidden]=\"!wizardCreated\"\n        [appendToWizard]=\"appendToWizard\"\n        [contentHeight]=\"contentHeight\"\n        [isFirstStep]=\"isFirstStep\"\n        [isLastStep]=\"isLastStep\"\n        [isNextStepSummary]=\"isNextStepSummary\"\n        [isSummaryStep]=\"isSummaryStep\"\n        [displaySummaryStep]=\"displaySummaryStep\"\n        [navigationButtons]=\"navigationButtons\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [isBranchingStep]=\"isBranchingStep\"\n        [isCurrentStepCompleted]=\"isCurrentStepCompleted\"\n        [stepsOrderChanged]=\"_stepsOrderChanged\"\n        (statusChange)=\"stepStatusChanged($event.id, $event.status)\"\n        (goNext)=\"goNext()\"\n        (finish)=\"finish()\"\n    ></fdp-wizard-body>\n</ng-container>\n\n<!-- The Wizard -->\n<ng-template #loadingTemplate>\n    <fd-wizard>\n        <fd-wizard-navigation>\n            <ul fd-wizard-progress-bar size=\"lg\" role=\"list\" aria-label=\"Wizard Steps\">\n                <li *fdkRepeat=\"3; let i = index\" fd-wizard-step [status]=\"i === 0 ? 'current' : 'upcoming'\">\n                    <fd-skeleton type=\"rectangle\" width=\"32px\" height=\"32px\"></fd-skeleton>\n\n                    <fd-wizard-content size=\"lg\">\n                        <fd-skeleton type=\"text\" width=\"60%\"></fd-skeleton>\n                    </fd-wizard-content>\n                </li>\n            </ul>\n        </fd-wizard-navigation>\n    </fd-wizard>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WizardBodyComponent, selector: "fdp-wizard-body", inputs: ["responsivePaddings", "navigationButtonLabels", "appendToWizard", "contentHeight", "isFirstStep", "isLastStep", "isNextStepSummary", "displaySummaryStep", "goNextButtonTemplate", "finishButtonTemplate", "customSummaryStepTemplate", "reviewButtonTemplate", "isSummaryStep", "navigationButtons", "unifiedLayout", "isBranchingStep", "isCurrentStepCompleted", "stepsOrderChanged"], outputs: ["statusChange", "goNext", "finish"] }, { kind: "ngmodule", type: WizardModule }, { kind: "component", type: i2$2.WizardComponent, selector: "fd-wizard", inputs: ["appendToWizard", "contentHeight", "responsivePaddings", "displaySummaryStep", "ariaLabel"] }, { kind: "component", type: i2$2.WizardNavigationComponent, selector: "fd-wizard-navigation", inputs: ["ariaLabel"] }, { kind: "directive", type: i2$2.WizardProgressBarDirective, selector: "[fd-wizard-progress-bar]", inputs: ["size"] }, { kind: "component", type: i2$2.WizardStepComponent, selector: "[fd-wizard-step]", inputs: ["ariaLabel", "ariaRoleDecription", "status", "branching", "label", "optionalText", "isSummary", "stepClickValidator"], outputs: ["statusChange", "stepClicked", "stepIndicatorItemClicked"] }, { kind: "component", type: i2$2.WizardContentComponent, selector: "fd-wizard-content", inputs: ["contentBackground", "size"] }, { kind: "directive", type: RepeatDirective, selector: "[fdkRepeat]", inputs: ["fdkRepeat"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i3$3.SkeletonComponent, selector: "fd-skeleton", inputs: ["animated", "type", "textLines", "width", "height"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: WizardGeneratorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-wizard-generator', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [WizardGeneratorService, FormGeneratorService], template: "<ng-container *ngIf=\"wizardCreated; else loadingTemplate\">\n    <fdp-wizard-body\n        [navigationButtonLabels]=\"_navigationButtonLabels\"\n        [goNextButtonTemplate]=\"goNextButtonTemplate\"\n        [finishButtonTemplate]=\"finishButtonTemplate\"\n        [customSummaryStepTemplate]=\"customSummaryStepTemplate\"\n        [reviewButtonTemplate]=\"reviewButtonTemplate\"\n        [responsivePaddings]=\"responsivePaddings\"\n        [hidden]=\"!wizardCreated\"\n        [appendToWizard]=\"appendToWizard\"\n        [contentHeight]=\"contentHeight\"\n        [isFirstStep]=\"isFirstStep\"\n        [isLastStep]=\"isLastStep\"\n        [isNextStepSummary]=\"isNextStepSummary\"\n        [isSummaryStep]=\"isSummaryStep\"\n        [displaySummaryStep]=\"displaySummaryStep\"\n        [navigationButtons]=\"navigationButtons\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [isBranchingStep]=\"isBranchingStep\"\n        [isCurrentStepCompleted]=\"isCurrentStepCompleted\"\n        [stepsOrderChanged]=\"_stepsOrderChanged\"\n        (statusChange)=\"stepStatusChanged($event.id, $event.status)\"\n        (goNext)=\"goNext()\"\n        (finish)=\"finish()\"\n    ></fdp-wizard-body>\n</ng-container>\n\n<!-- The Wizard -->\n<ng-template #loadingTemplate>\n    <fd-wizard>\n        <fd-wizard-navigation>\n            <ul fd-wizard-progress-bar size=\"lg\" role=\"list\" aria-label=\"Wizard Steps\">\n                <li *fdkRepeat=\"3; let i = index\" fd-wizard-step [status]=\"i === 0 ? 'current' : 'upcoming'\">\n                    <fd-skeleton type=\"rectangle\" width=\"32px\" height=\"32px\"></fd-skeleton>\n\n                    <fd-wizard-content size=\"lg\">\n                        <fd-skeleton type=\"text\" width=\"60%\"></fd-skeleton>\n                    </fd-wizard-content>\n                </li>\n            </ul>\n        </fd-wizard-navigation>\n    </fd-wizard>\n</ng-template>\n" }]
+            args: [{ selector: 'fdp-wizard-generator', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [WizardGeneratorService, FormGeneratorService], standalone: true, imports: [NgIf, WizardBodyComponent, WizardModule, RepeatDirective, SkeletonModule], template: "<ng-container *ngIf=\"wizardCreated; else loadingTemplate\">\n    <fdp-wizard-body\n        [navigationButtonLabels]=\"_navigationButtonLabels\"\n        [goNextButtonTemplate]=\"goNextButtonTemplate\"\n        [finishButtonTemplate]=\"finishButtonTemplate\"\n        [customSummaryStepTemplate]=\"customSummaryStepTemplate\"\n        [reviewButtonTemplate]=\"reviewButtonTemplate\"\n        [responsivePaddings]=\"responsivePaddings\"\n        [hidden]=\"!wizardCreated\"\n        [appendToWizard]=\"appendToWizard\"\n        [contentHeight]=\"contentHeight\"\n        [isFirstStep]=\"isFirstStep\"\n        [isLastStep]=\"isLastStep\"\n        [isNextStepSummary]=\"isNextStepSummary\"\n        [isSummaryStep]=\"isSummaryStep\"\n        [displaySummaryStep]=\"displaySummaryStep\"\n        [navigationButtons]=\"navigationButtons\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [isBranchingStep]=\"isBranchingStep\"\n        [isCurrentStepCompleted]=\"isCurrentStepCompleted\"\n        [stepsOrderChanged]=\"_stepsOrderChanged\"\n        (statusChange)=\"stepStatusChanged($event.id, $event.status)\"\n        (goNext)=\"goNext()\"\n        (finish)=\"finish()\"\n    ></fdp-wizard-body>\n</ng-container>\n\n<!-- The Wizard -->\n<ng-template #loadingTemplate>\n    <fd-wizard>\n        <fd-wizard-navigation>\n            <ul fd-wizard-progress-bar size=\"lg\" role=\"list\" aria-label=\"Wizard Steps\">\n                <li *fdkRepeat=\"3; let i = index\" fd-wizard-step [status]=\"i === 0 ? 'current' : 'upcoming'\">\n                    <fd-skeleton type=\"rectangle\" width=\"32px\" height=\"32px\"></fd-skeleton>\n\n                    <fd-wizard-content size=\"lg\">\n                        <fd-skeleton type=\"text\" width=\"60%\"></fd-skeleton>\n                    </fd-wizard-content>\n                </li>\n            </ul>\n        </fd-wizard-navigation>\n    </fd-wizard>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: WizardGeneratorService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { finishButtonTemplate: [{
                 type: ContentChild,
                 args: [WizardGeneratorFinishButtonDirective, { read: TemplateRef }]
@@ -1583,7 +1612,8 @@ class PlatformWizardGeneratorModule {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformWizardGeneratorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformWizardGeneratorModule, declarations: [WizardGeneratorComponent,
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformWizardGeneratorModule, imports: [PlatformFormGeneratorModule,
+            WizardGeneratorComponent,
             WizardGeneratorStepComponent,
             WizardBodyComponent,
             DialogWizardGeneratorComponent,
@@ -1592,19 +1622,7 @@ class PlatformWizardGeneratorModule {
             WizardGeneratorGoNextButtonDirective,
             WizardGeneratorFinishButtonDirective,
             WizardGeneratorSummaryStepDirective,
-            WizardGeneratorReviewButtonDirective], imports: [CommonModule,
-            DialogModule,
-            I18nModule,
-            ButtonModule,
-            WizardModule,
-            PlatformFormGeneratorModule,
-            PlatformButtonModule,
-            LayoutGridModule,
-            TitleModule,
-            FormLabelModule,
-            PlatformLinkModule,
-            SkeletonModule,
-            RepeatModule], exports: [WizardGeneratorComponent,
+            WizardGeneratorReviewButtonDirective], exports: [WizardGeneratorComponent,
             WizardGeneratorStepComponent,
             WizardBodyComponent,
             DialogWizardGeneratorComponent,
@@ -1614,24 +1632,19 @@ class PlatformWizardGeneratorModule {
             WizardGeneratorFinishButtonDirective,
             WizardGeneratorSummaryStepDirective,
             WizardGeneratorReviewButtonDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformWizardGeneratorModule, providers: [WizardDialogGeneratorService], imports: [CommonModule,
-            DialogModule,
-            I18nModule,
-            ButtonModule,
-            WizardModule,
-            PlatformFormGeneratorModule,
-            PlatformButtonModule,
-            LayoutGridModule,
-            TitleModule,
-            FormLabelModule,
-            PlatformLinkModule,
-            SkeletonModule,
-            RepeatModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformWizardGeneratorModule, providers: [WizardDialogGeneratorService], imports: [PlatformFormGeneratorModule,
+            WizardGeneratorComponent,
+            WizardGeneratorStepComponent,
+            WizardBodyComponent,
+            DialogWizardGeneratorComponent,
+            WizardSummaryStepComponent,
+            WizardSummarySectionComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformWizardGeneratorModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [
+                    imports: [
+                        PlatformFormGeneratorModule,
                         WizardGeneratorComponent,
                         WizardGeneratorStepComponent,
                         WizardBodyComponent,
@@ -1643,21 +1656,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         WizardGeneratorSummaryStepDirective,
                         WizardGeneratorReviewButtonDirective
                     ],
-                    imports: [
-                        CommonModule,
-                        DialogModule,
-                        I18nModule,
-                        ButtonModule,
-                        WizardModule,
-                        PlatformFormGeneratorModule,
-                        PlatformButtonModule,
-                        LayoutGridModule,
-                        TitleModule,
-                        FormLabelModule,
-                        PlatformLinkModule,
-                        SkeletonModule,
-                        RepeatModule
-                    ],
                     exports: [
                         WizardGeneratorComponent,
                         WizardGeneratorStepComponent,