Skip to content

Commit 16a8495

Browse files
authored
refactor(material/stepper): remove all usages of deprecated selectors (#22838)
The `mat-horizontal-stepper` and `mat-vertical-stepper` were deprecated after we introduced the `orientation` input on `mat-stepper`. These changes update all docs and tests to use the new approach.
1 parent 5a2c495 commit 16a8495

File tree

17 files changed

+105
-109
lines changed

17 files changed

+105
-109
lines changed

src/components-examples/material/stepper/stepper-editable/stepper-editable-example.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
{{!isEditable ? 'Enable edit mode' : 'Disable edit mode'}}
33
</button>
44

5-
<mat-horizontal-stepper linear #stepper>
5+
<mat-stepper linear #stepper>
66
<!-- #docregion editable -->
77
<mat-step [stepControl]="firstFormGroup" [editable]="isEditable">
88
<!-- #enddocregion editable -->
@@ -41,4 +41,4 @@
4141
<button mat-button (click)="stepper.reset()">Reset</button>
4242
</div>
4343
</mat-step>
44-
</mat-horizontal-stepper>
44+
</mat-stepper>

src/components-examples/material/stepper/stepper-errors/stepper-errors-example.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<mat-horizontal-stepper #stepper>
1+
<mat-stepper #stepper>
22
<mat-step [stepControl]="firstFormGroup" errorMessage="Name is required.">
33
<form [formGroup]="firstFormGroup">
44
<ng-template matStepLabel>Fill out your name</ng-template>
@@ -35,4 +35,4 @@
3535
<button mat-button (click)="stepper.reset()">Reset</button>
3636
</div>
3737
</mat-step>
38-
</mat-horizontal-stepper>
38+
</mat-stepper>

src/components-examples/material/stepper/stepper-harness/stepper-harness-example.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<mat-horizontal-stepper>
1+
<mat-stepper>
22
<mat-step>
33
<ng-template matStepLabel>One</ng-template>
44
<button matStepperNext>Next</button>
@@ -12,4 +12,4 @@
1212
<ng-template matStepLabel>Three</ng-template>
1313
<button matStepperPrevious>Previous</button>
1414
</mat-step>
15-
</mat-horizontal-stepper>
15+
</mat-stepper>

src/components-examples/material/stepper/stepper-intl/stepper-intl-example.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
{{optionalLabelTextChoice}}
1212
</mat-radio-button>
1313
</mat-radio-group>
14-
<mat-horizontal-stepper class="demo-stepper" #stepper>
14+
<mat-stepper class="demo-stepper" #stepper>
1515
<mat-step [stepControl]="firstFormGroup">
1616
<form [formGroup]="firstFormGroup">
1717
<ng-template matStepLabel>Fill out your name</ng-template>
@@ -56,4 +56,4 @@
5656
<button mat-button (click)="stepper.reset()">Reset</button>
5757
</div>
5858
</mat-step>
59-
</mat-horizontal-stepper>
59+
</mat-stepper>

src/components-examples/material/stepper/stepper-label-position-bottom/stepper-label-position-bottom-example.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!-- #docregion label-position -->
2-
<mat-horizontal-stepper labelPosition="bottom" #stepper>
2+
<mat-stepper labelPosition="bottom" #stepper>
33
<!-- #enddocregion label-position -->
44
<mat-step [stepControl]="firstFormGroup">
55
<form [formGroup]="firstFormGroup">
@@ -37,4 +37,4 @@
3737
<button mat-button (click)="stepper.reset()">Reset</button>
3838
</div>
3939
</mat-step>
40-
</mat-horizontal-stepper>
40+
</mat-stepper>

src/components-examples/material/stepper/stepper-lazy-content/stepper-lazy-content-example.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<mat-vertical-stepper>
1+
<mat-stepper orientation="vertical">
22
<mat-step>
33
<ng-template matStepLabel>Step 1</ng-template>
44
<ng-template matStepContent>
@@ -19,4 +19,4 @@
1919
<p>This content was rendered eagerly</p>
2020
<button mat-button matStepperPrevious>Back</button>
2121
</mat-step>
22-
</mat-vertical-stepper>
22+
</mat-stepper>

src/components-examples/material/stepper/stepper-optional/stepper-optional-example.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
{{!isOptional ? 'Enable optional steps' : 'Disable optional steps'}}
33
</button>
44

5-
<mat-horizontal-stepper linear #stepper>
5+
<mat-stepper linear #stepper>
66
<mat-step [stepControl]="firstFormGroup">
77
<form [formGroup]="firstFormGroup">
88
<ng-template matStepLabel>Fill out your name</ng-template>
@@ -39,4 +39,4 @@
3939
<button mat-button (click)="stepper.reset()">Reset</button>
4040
</div>
4141
</mat-step>
42-
</mat-horizontal-stepper>
42+
</mat-stepper>

src/components-examples/material/stepper/stepper-overview/stepper-overview-example.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<button mat-raised-button (click)="isLinear = !isLinear" id="toggle-linear">
22
{{!isLinear ? 'Enable linear mode' : 'Disable linear mode'}}
33
</button>
4-
<mat-horizontal-stepper [linear]="isLinear" #stepper>
4+
<mat-stepper [linear]="isLinear" #stepper>
55
<mat-step [stepControl]="firstFormGroup">
66
<form [formGroup]="firstFormGroup">
77
<ng-template matStepLabel>Fill out your name</ng-template>
@@ -37,4 +37,4 @@
3737
<button mat-button (click)="stepper.reset()">Reset</button>
3838
</div>
3939
</mat-step>
40-
</mat-horizontal-stepper>
40+
</mat-stepper>

src/components-examples/material/stepper/stepper-states/stepper-states-example.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<mat-horizontal-stepper #stepper>
1+
<mat-stepper #stepper>
22
<mat-step [stepControl]="firstFormGroup">
33
<form [formGroup]="firstFormGroup">
44
<ng-template matStepLabel>Fill out your name</ng-template>
@@ -33,10 +33,10 @@
3333
<button mat-button (click)="stepper.reset()">Reset</button>
3434
</div>
3535
</mat-step>
36-
</mat-horizontal-stepper>
36+
</mat-stepper>
3737

3838
<!-- #docregion states -->
39-
<mat-horizontal-stepper>
39+
<mat-stepper>
4040
<!-- #docregion label -->
4141
<mat-step label="Step 1" state="phone">
4242
<p>Put down your phones.</p>
@@ -64,6 +64,6 @@
6464
<ng-template matStepperIcon="chat">
6565
<mat-icon>forum</mat-icon>
6666
</ng-template>
67-
</mat-horizontal-stepper>
67+
</mat-stepper>
6868
<!-- #enddocregion override-icons -->
6969
<!-- #enddocregion states -->

src/components-examples/material/stepper/stepper-vertical/stepper-vertical-example.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<button mat-raised-button (click)="isLinear = !isLinear" id="toggle-linear">
22
{{!isLinear ? 'Enable linear mode' : 'Disable linear mode'}}
33
</button>
4-
<mat-vertical-stepper [linear]="isLinear" #stepper>
4+
<mat-stepper orientation="vertical" [linear]="isLinear" #stepper>
55
<mat-step [stepControl]="firstFormGroup">
66
<form [formGroup]="firstFormGroup">
77
<ng-template matStepLabel>Fill out your name</ng-template>
@@ -36,4 +36,4 @@
3636
<button mat-button (click)="stepper.reset()">Reset</button>
3737
</div>
3838
</mat-step>
39-
</mat-vertical-stepper>
39+
</mat-stepper>

0 commit comments

Comments
 (0)