diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/wizard/properties/wizard-table-properties/wizard-table-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/wizard/properties/wizard-table-properties/wizard-table-properties.component.html index ec0797c23..eec98b99d 100644 --- a/projects/dxc-ngx-cdk-site/src/app/components/examples/wizard/properties/wizard-table-properties/wizard-table-properties.component.html +++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/wizard/properties/wizard-table-properties/wizard-table-properties.component.html @@ -26,6 +26,13 @@ Defines which step is marked as the current. The numeration starts in 0. + + defaultCurrentStep: number + + + + Initially selected step, only when it is uncontrolled. + tabIndexValue: number 0 diff --git a/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/wizard-preview/wizard-preview.component.html b/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/wizard-preview/wizard-preview.component.html index fd317396d..8944f3328 100644 --- a/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/wizard-preview/wizard-preview.component.html +++ b/projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/wizard-preview/wizard-preview.component.html @@ -1,5 +1,5 @@ - + + + + + + + + + + { if (value || value === 0) { this.handleStepClick(value); @@ -86,7 +106,10 @@ export class DxcWizardComponent { ngOnInit() { this.className = `${this.getDynamicStyle(this.defaultInputs.getValue())}`; - this.service.innerCurrentStep.next(this.currentStep || 0); + this.currentStep = this.currentStep + ? this.currentStep + : this.defaultCurrentStep ?? 0; + this.service.innerCurrentStep.next(this.currentStep); this.service.mode.next(this.mode || "horizontal"); this.service.tabIndexValue.next(this.tabIndexValue); } @@ -105,9 +128,7 @@ export class DxcWizardComponent { } public handleStepClick(i) { - if (!(this.currentStep || this.currentStep === 0)) { - this.service.innerCurrentStep.next(i); - } + this.service.innerCurrentStep.next(i); this.onStepClick.emit(i); } diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-wizard/services/wizard.service.ts b/projects/dxc-ngx-cdk/src/lib/dxc-wizard/services/wizard.service.ts index 175b43667..63519dda1 100644 --- a/projects/dxc-ngx-cdk/src/lib/dxc-wizard/services/wizard.service.ts +++ b/projects/dxc-ngx-cdk/src/lib/dxc-wizard/services/wizard.service.ts @@ -17,9 +17,9 @@ export class WizardService { public tabIndexValue: BehaviorSubject = new BehaviorSubject(0); constructor() { - this.innerCurrentStep.subscribe((newCurrent) => { + this.innerCurrentStep.subscribe((newCurrent: number) => { if (this.steps && (newCurrent || newCurrent === 0)) { - this.steps.forEach((element, index) => { + this.steps.forEach((element: DxcWizardStepComponent, index: number) => { element.setIsCurrent(index === newCurrent, newCurrent); }); } @@ -33,7 +33,10 @@ export class WizardService { element.isFirst = index === 0; element.setIsLast(index === this.steps.length - 1); element.position = index; - element.setIsCurrent(index === this.innerCurrentStep.value, this.innerCurrentStep.value); + element.setIsCurrent( + index === this.innerCurrentStep.value, + this.innerCurrentStep.value + ); }); } }