@angular/material 21.2.8 → 21.2.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (152) hide show
  1. package/fesm2022/_animation-chunk.mjs.map +1 -1
  2. package/fesm2022/_date-formats-chunk.mjs.map +1 -1
  3. package/fesm2022/_date-range-input-harness-chunk.mjs.map +1 -1
  4. package/fesm2022/_error-options-chunk.mjs +6 -6
  5. package/fesm2022/_error-options-chunk.mjs.map +1 -1
  6. package/fesm2022/_error-state-chunk.mjs.map +1 -1
  7. package/fesm2022/_form-field-chunk.mjs +30 -30
  8. package/fesm2022/_form-field-chunk.mjs.map +1 -1
  9. package/fesm2022/_icon-button-chunk.mjs +6 -6
  10. package/fesm2022/_icon-button-chunk.mjs.map +1 -1
  11. package/fesm2022/_icon-registry-chunk.mjs +3 -3
  12. package/fesm2022/_icon-registry-chunk.mjs.map +1 -1
  13. package/fesm2022/_input-harness-chunk.mjs.map +1 -1
  14. package/fesm2022/_input-value-accessor-chunk.mjs.map +1 -1
  15. package/fesm2022/_internal-form-field-chunk.mjs +3 -3
  16. package/fesm2022/_internal-form-field-chunk.mjs.map +1 -1
  17. package/fesm2022/_line-chunk.mjs +7 -7
  18. package/fesm2022/_line-chunk.mjs.map +1 -1
  19. package/fesm2022/_option-chunk.mjs +6 -6
  20. package/fesm2022/_option-chunk.mjs.map +1 -1
  21. package/fesm2022/_option-harness-chunk.mjs.map +1 -1
  22. package/fesm2022/_option-module-chunk.mjs +4 -4
  23. package/fesm2022/_option-module-chunk.mjs.map +1 -1
  24. package/fesm2022/_pseudo-checkbox-chunk.mjs +3 -3
  25. package/fesm2022/_pseudo-checkbox-chunk.mjs.map +1 -1
  26. package/fesm2022/_pseudo-checkbox-module-chunk.mjs +4 -4
  27. package/fesm2022/_pseudo-checkbox-module-chunk.mjs.map +1 -1
  28. package/fesm2022/_public-api-chunk.mjs.map +1 -1
  29. package/fesm2022/_ripple-chunk.mjs +6 -6
  30. package/fesm2022/_ripple-chunk.mjs.map +1 -1
  31. package/fesm2022/_ripple-loader-chunk.mjs +3 -3
  32. package/fesm2022/_ripple-loader-chunk.mjs.map +1 -1
  33. package/fesm2022/_ripple-module-chunk.mjs +4 -4
  34. package/fesm2022/_ripple-module-chunk.mjs.map +1 -1
  35. package/fesm2022/_structural-styles-chunk.mjs +3 -3
  36. package/fesm2022/_structural-styles-chunk.mjs.map +1 -1
  37. package/fesm2022/_tooltip-chunk.mjs +6 -6
  38. package/fesm2022/_tooltip-chunk.mjs.map +1 -1
  39. package/fesm2022/autocomplete-testing.mjs.map +1 -1
  40. package/fesm2022/autocomplete.mjs +13 -13
  41. package/fesm2022/autocomplete.mjs.map +1 -1
  42. package/fesm2022/badge-testing.mjs.map +1 -1
  43. package/fesm2022/badge.mjs +10 -10
  44. package/fesm2022/badge.mjs.map +1 -1
  45. package/fesm2022/bottom-sheet-testing.mjs.map +1 -1
  46. package/fesm2022/bottom-sheet.mjs +10 -10
  47. package/fesm2022/bottom-sheet.mjs.map +1 -1
  48. package/fesm2022/button-testing.mjs.map +1 -1
  49. package/fesm2022/button-toggle-testing.mjs.map +1 -1
  50. package/fesm2022/button-toggle.mjs +10 -10
  51. package/fesm2022/button-toggle.mjs.map +1 -1
  52. package/fesm2022/button.mjs +13 -13
  53. package/fesm2022/button.mjs.map +1 -1
  54. package/fesm2022/card-testing.mjs.map +1 -1
  55. package/fesm2022/card.mjs +46 -46
  56. package/fesm2022/card.mjs.map +1 -1
  57. package/fesm2022/checkbox-testing.mjs.map +1 -1
  58. package/fesm2022/checkbox.mjs +7 -7
  59. package/fesm2022/checkbox.mjs.map +1 -1
  60. package/fesm2022/chips-testing.mjs.map +1 -1
  61. package/fesm2022/chips.mjs +46 -46
  62. package/fesm2022/chips.mjs.map +1 -1
  63. package/fesm2022/core-testing.mjs.map +1 -1
  64. package/fesm2022/core.mjs +12 -12
  65. package/fesm2022/core.mjs.map +1 -1
  66. package/fesm2022/datepicker-testing.mjs.map +1 -1
  67. package/fesm2022/datepicker.mjs +82 -82
  68. package/fesm2022/datepicker.mjs.map +1 -1
  69. package/fesm2022/dialog-testing.mjs.map +1 -1
  70. package/fesm2022/dialog.mjs +25 -25
  71. package/fesm2022/dialog.mjs.map +1 -1
  72. package/fesm2022/divider-testing.mjs.map +1 -1
  73. package/fesm2022/divider.mjs +7 -7
  74. package/fesm2022/divider.mjs.map +1 -1
  75. package/fesm2022/expansion-testing.mjs.map +1 -1
  76. package/fesm2022/expansion.mjs +25 -25
  77. package/fesm2022/expansion.mjs.map +1 -1
  78. package/fesm2022/form-field-testing-control.mjs.map +1 -1
  79. package/fesm2022/form-field-testing.mjs.map +1 -1
  80. package/fesm2022/form-field.mjs +4 -4
  81. package/fesm2022/form-field.mjs.map +1 -1
  82. package/fesm2022/grid-list-testing.mjs.map +1 -1
  83. package/fesm2022/grid-list.mjs +22 -22
  84. package/fesm2022/grid-list.mjs.map +1 -1
  85. package/fesm2022/icon-testing.mjs +7 -7
  86. package/fesm2022/icon-testing.mjs.map +1 -1
  87. package/fesm2022/icon.mjs +7 -7
  88. package/fesm2022/icon.mjs.map +1 -1
  89. package/fesm2022/input-testing.mjs.map +1 -1
  90. package/fesm2022/input.mjs +7 -7
  91. package/fesm2022/input.mjs.map +1 -1
  92. package/fesm2022/list-testing.mjs.map +1 -1
  93. package/fesm2022/list.mjs +49 -49
  94. package/fesm2022/list.mjs.map +1 -1
  95. package/fesm2022/material.mjs.map +1 -1
  96. package/fesm2022/menu-testing.mjs.map +1 -1
  97. package/fesm2022/menu.mjs +22 -22
  98. package/fesm2022/menu.mjs.map +1 -1
  99. package/fesm2022/paginator-testing.mjs.map +1 -1
  100. package/fesm2022/paginator.mjs +10 -10
  101. package/fesm2022/paginator.mjs.map +1 -1
  102. package/fesm2022/progress-bar-testing.mjs.map +1 -1
  103. package/fesm2022/progress-bar.mjs +7 -7
  104. package/fesm2022/progress-bar.mjs.map +1 -1
  105. package/fesm2022/progress-spinner-testing.mjs.map +1 -1
  106. package/fesm2022/progress-spinner.mjs +7 -7
  107. package/fesm2022/progress-spinner.mjs.map +1 -1
  108. package/fesm2022/radio-testing.mjs.map +1 -1
  109. package/fesm2022/radio.mjs +10 -10
  110. package/fesm2022/radio.mjs.map +1 -1
  111. package/fesm2022/select-testing.mjs.map +1 -1
  112. package/fesm2022/select.mjs +10 -10
  113. package/fesm2022/select.mjs.map +1 -1
  114. package/fesm2022/sidenav-testing.mjs.map +1 -1
  115. package/fesm2022/sidenav.mjs +22 -22
  116. package/fesm2022/sidenav.mjs.map +1 -1
  117. package/fesm2022/slide-toggle-testing.mjs.map +1 -1
  118. package/fesm2022/slide-toggle.mjs +7 -7
  119. package/fesm2022/slide-toggle.mjs.map +1 -1
  120. package/fesm2022/slider-testing.mjs.map +1 -1
  121. package/fesm2022/slider.mjs +16 -16
  122. package/fesm2022/slider.mjs.map +1 -1
  123. package/fesm2022/snack-bar-testing.mjs.map +1 -1
  124. package/fesm2022/snack-bar.mjs +22 -22
  125. package/fesm2022/snack-bar.mjs.map +1 -1
  126. package/fesm2022/sort-testing.mjs.map +1 -1
  127. package/fesm2022/sort.mjs +13 -13
  128. package/fesm2022/sort.mjs.map +1 -1
  129. package/fesm2022/stepper-testing.mjs.map +1 -1
  130. package/fesm2022/stepper.mjs +45 -33
  131. package/fesm2022/stepper.mjs.map +1 -1
  132. package/fesm2022/table-testing.mjs.map +1 -1
  133. package/fesm2022/table.mjs +55 -55
  134. package/fesm2022/table.mjs.map +1 -1
  135. package/fesm2022/tabs-testing.mjs.map +1 -1
  136. package/fesm2022/tabs.mjs +43 -43
  137. package/fesm2022/tabs.mjs.map +1 -1
  138. package/fesm2022/timepicker-testing.mjs.map +1 -1
  139. package/fesm2022/timepicker.mjs +13 -13
  140. package/fesm2022/timepicker.mjs.map +1 -1
  141. package/fesm2022/toolbar-testing.mjs.map +1 -1
  142. package/fesm2022/toolbar.mjs +10 -10
  143. package/fesm2022/toolbar.mjs.map +1 -1
  144. package/fesm2022/tooltip-testing.mjs.map +1 -1
  145. package/fesm2022/tooltip.mjs +4 -4
  146. package/fesm2022/tooltip.mjs.map +1 -1
  147. package/fesm2022/tree-testing.mjs.map +1 -1
  148. package/fesm2022/tree.mjs +25 -25
  149. package/fesm2022/tree.mjs.map +1 -1
  150. package/package.json +2 -2
  151. package/schematics/ng-add/index.js +1 -1
  152. package/types/stepper.d.ts +5 -1
@@ -24,7 +24,7 @@ import '@angular/cdk/layout';
24
24
  class MatStepLabel extends CdkStepLabel {
25
25
  static ɵfac = i0.ɵɵngDeclareFactory({
26
26
  minVersion: "12.0.0",
27
- version: "22.0.0-next.6",
27
+ version: "21.2.11",
28
28
  ngImport: i0,
29
29
  type: MatStepLabel,
30
30
  deps: null,
@@ -32,7 +32,7 @@ class MatStepLabel extends CdkStepLabel {
32
32
  });
33
33
  static ɵdir = i0.ɵɵngDeclareDirective({
34
34
  minVersion: "14.0.0",
35
- version: "22.0.0-next.6",
35
+ version: "21.2.11",
36
36
  type: MatStepLabel,
37
37
  isStandalone: true,
38
38
  selector: "[matStepLabel]",
@@ -42,7 +42,7 @@ class MatStepLabel extends CdkStepLabel {
42
42
  }
43
43
  i0.ɵɵngDeclareClassMetadata({
44
44
  minVersion: "12.0.0",
45
- version: "22.0.0-next.6",
45
+ version: "21.2.11",
46
46
  ngImport: i0,
47
47
  type: MatStepLabel,
48
48
  decorators: [{
@@ -60,7 +60,7 @@ class MatStepperIntl {
60
60
  editableLabel = 'Editable';
61
61
  static ɵfac = i0.ɵɵngDeclareFactory({
62
62
  minVersion: "12.0.0",
63
- version: "22.0.0-next.6",
63
+ version: "21.2.11",
64
64
  ngImport: i0,
65
65
  type: MatStepperIntl,
66
66
  deps: [],
@@ -68,7 +68,7 @@ class MatStepperIntl {
68
68
  });
69
69
  static ɵprov = i0.ɵɵngDeclareInjectable({
70
70
  minVersion: "12.0.0",
71
- version: "22.0.0-next.6",
71
+ version: "21.2.11",
72
72
  ngImport: i0,
73
73
  type: MatStepperIntl,
74
74
  providedIn: 'root'
@@ -76,7 +76,7 @@ class MatStepperIntl {
76
76
  }
77
77
  i0.ɵɵngDeclareClassMetadata({
78
78
  minVersion: "12.0.0",
79
- version: "22.0.0-next.6",
79
+ version: "21.2.11",
80
80
  ngImport: i0,
81
81
  type: MatStepperIntl,
82
82
  decorators: [{
@@ -155,7 +155,7 @@ class MatStepHeader extends CdkStepHeader {
155
155
  }
156
156
  static ɵfac = i0.ɵɵngDeclareFactory({
157
157
  minVersion: "12.0.0",
158
- version: "22.0.0-next.6",
158
+ version: "21.2.11",
159
159
  ngImport: i0,
160
160
  type: MatStepHeader,
161
161
  deps: [],
@@ -163,7 +163,7 @@ class MatStepHeader extends CdkStepHeader {
163
163
  });
164
164
  static ɵcmp = i0.ɵɵngDeclareComponent({
165
165
  minVersion: "17.0.0",
166
- version: "22.0.0-next.6",
166
+ version: "21.2.11",
167
167
  type: MatStepHeader,
168
168
  isStandalone: true,
169
169
  selector: "mat-step-header",
@@ -217,7 +217,7 @@ class MatStepHeader extends CdkStepHeader {
217
217
  }
218
218
  i0.ɵɵngDeclareClassMetadata({
219
219
  minVersion: "12.0.0",
220
- version: "22.0.0-next.6",
220
+ version: "21.2.11",
221
221
  ngImport: i0,
222
222
  type: MatStepHeader,
223
223
  decorators: [{
@@ -278,7 +278,7 @@ class MatStepperIcon {
278
278
  constructor() {}
279
279
  static ɵfac = i0.ɵɵngDeclareFactory({
280
280
  minVersion: "12.0.0",
281
- version: "22.0.0-next.6",
281
+ version: "21.2.11",
282
282
  ngImport: i0,
283
283
  type: MatStepperIcon,
284
284
  deps: [],
@@ -286,7 +286,7 @@ class MatStepperIcon {
286
286
  });
287
287
  static ɵdir = i0.ɵɵngDeclareDirective({
288
288
  minVersion: "14.0.0",
289
- version: "22.0.0-next.6",
289
+ version: "21.2.11",
290
290
  type: MatStepperIcon,
291
291
  isStandalone: true,
292
292
  selector: "ng-template[matStepperIcon]",
@@ -298,7 +298,7 @@ class MatStepperIcon {
298
298
  }
299
299
  i0.ɵɵngDeclareClassMetadata({
300
300
  minVersion: "12.0.0",
301
- version: "22.0.0-next.6",
301
+ version: "21.2.11",
302
302
  ngImport: i0,
303
303
  type: MatStepperIcon,
304
304
  decorators: [{
@@ -321,7 +321,7 @@ class MatStepContent {
321
321
  constructor() {}
322
322
  static ɵfac = i0.ɵɵngDeclareFactory({
323
323
  minVersion: "12.0.0",
324
- version: "22.0.0-next.6",
324
+ version: "21.2.11",
325
325
  ngImport: i0,
326
326
  type: MatStepContent,
327
327
  deps: [],
@@ -329,7 +329,7 @@ class MatStepContent {
329
329
  });
330
330
  static ɵdir = i0.ɵɵngDeclareDirective({
331
331
  minVersion: "14.0.0",
332
- version: "22.0.0-next.6",
332
+ version: "21.2.11",
333
333
  type: MatStepContent,
334
334
  isStandalone: true,
335
335
  selector: "ng-template[matStepContent]",
@@ -338,7 +338,7 @@ class MatStepContent {
338
338
  }
339
339
  i0.ɵɵngDeclareClassMetadata({
340
340
  minVersion: "12.0.0",
341
- version: "22.0.0-next.6",
341
+ version: "21.2.11",
342
342
  ngImport: i0,
343
343
  type: MatStepContent,
344
344
  decorators: [{
@@ -379,7 +379,7 @@ class MatStep extends CdkStep {
379
379
  }
380
380
  static ɵfac = i0.ɵɵngDeclareFactory({
381
381
  minVersion: "12.0.0",
382
- version: "22.0.0-next.6",
382
+ version: "21.2.11",
383
383
  ngImport: i0,
384
384
  type: MatStep,
385
385
  deps: null,
@@ -387,7 +387,7 @@ class MatStep extends CdkStep {
387
387
  });
388
388
  static ɵcmp = i0.ɵɵngDeclareComponent({
389
389
  minVersion: "14.0.0",
390
- version: "22.0.0-next.6",
390
+ version: "21.2.11",
391
391
  type: MatStep,
392
392
  isStandalone: true,
393
393
  selector: "mat-step",
@@ -435,7 +435,7 @@ class MatStep extends CdkStep {
435
435
  }
436
436
  i0.ɵɵngDeclareClassMetadata({
437
437
  minVersion: "12.0.0",
438
- version: "22.0.0-next.6",
438
+ version: "21.2.11",
439
439
  ngImport: i0,
440
440
  type: MatStep,
441
441
  decorators: [{
@@ -493,6 +493,7 @@ class MatStepper extends CdkStepper {
493
493
  color;
494
494
  labelPosition = 'end';
495
495
  headerPosition = 'top';
496
+ ariaLabel = null;
496
497
  headerPrefix = input(null, ...(ngDevMode ? [{
497
498
  debugName: "headerPrefix"
498
499
  }] : []));
@@ -579,7 +580,7 @@ class MatStepper extends CdkStepper {
579
580
  }
580
581
  static ɵfac = i0.ɵɵngDeclareFactory({
581
582
  minVersion: "12.0.0",
582
- version: "22.0.0-next.6",
583
+ version: "21.2.11",
583
584
  ngImport: i0,
584
585
  type: MatStepper,
585
586
  deps: [],
@@ -587,7 +588,7 @@ class MatStepper extends CdkStepper {
587
588
  });
588
589
  static ɵcmp = i0.ɵɵngDeclareComponent({
589
590
  minVersion: "17.0.0",
590
- version: "22.0.0-next.6",
591
+ version: "21.2.11",
591
592
  type: MatStepper,
592
593
  isStandalone: true,
593
594
  selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]",
@@ -620,6 +621,13 @@ class MatStepper extends CdkStepper {
620
621
  isRequired: false,
621
622
  transformFunction: null
622
623
  },
624
+ ariaLabel: {
625
+ classPropertyName: "ariaLabel",
626
+ publicName: "aria-label",
627
+ isSignal: false,
628
+ isRequired: false,
629
+ transformFunction: null
630
+ },
623
631
  headerPrefix: {
624
632
  classPropertyName: "headerPrefix",
625
633
  publicName: "headerPrefix",
@@ -674,7 +682,7 @@ class MatStepper extends CdkStepper {
674
682
  exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"],
675
683
  usesInheritance: true,
676
684
  ngImport: i0,
677
- template: "<!--\n We need to project the content somewhere to avoid hydration errors. Some observations:\n 1. This is only necessary on the server.\n 2. We get a hydration error if there aren't any nodes after the `ng-content`.\n 3. We get a hydration error if `ng-content` is wrapped in another element.\n-->\n@if (_isServer) {\n <ng-content/>\n}\n\n@switch (orientation) {\n @case ('horizontal') {\n <div class=\"mat-horizontal-stepper-wrapper\">\n @if (headerPrefix()) {\n <div class=\"mat-horizontal-stepper-header-wrapper\">\n <ng-container [ngTemplateOutlet]=\"headerPrefix()\"/>\n <ng-container [ngTemplateOutlet]=\"horizontalStepsTemplate\"\n [ngTemplateOutletContext]=\"{steps}\"/>\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"horizontalStepsTemplate\"\n [ngTemplateOutletContext]=\"{steps}\"/>\n }\n\n <div class=\"mat-horizontal-content-container\">\n @for (step of steps; track step) {\n <div\n #animatedContainer\n class=\"mat-horizontal-stepper-content\"\n role=\"tabpanel\"\n [id]=\"_getStepContentId($index)\"\n [attr.aria-labelledby]=\"_getStepLabelId($index)\"\n [class]=\"'mat-horizontal-stepper-content-' + _getAnimationDirection($index)\"\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('vertical') {\n <div class=\"mat-vertical-stepper-wrapper\">\n @if (headerPrefix()) {\n <ng-container [ngTemplateOutlet]=\"headerPrefix()\"/>\n }\n\n @for (step of steps; track step) {\n <div class=\"mat-step\">\n <ng-container\n [ngTemplateOutlet]=\"stepTemplate\"\n [ngTemplateOutletContext]=\"{step}\"/>\n <div\n #animatedContainer\n class=\"mat-vertical-content-container\"\n [class.mat-stepper-vertical-line]=\"!$last\"\n [class.mat-vertical-content-container-active]=\"selectedIndex === $index\"\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\n <div \n class=\"mat-vertical-stepper-content\"\n role=\"region\"\n [id]=\"_getStepContentId($index)\"\n [attr.aria-labelledby]=\"_getStepLabelId($index)\">\n <div class=\"mat-vertical-content\">\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n }\n}\n\n<!-- Common step templating -->\n<ng-template let-step=\"step\" #stepTemplate>\n <mat-step-header\n [class.mat-horizontal-stepper-header]=\"orientation === 'horizontal'\"\n [class.mat-vertical-stepper-header]=\"orientation === 'vertical'\"\n (click)=\"step.select()\"\n (keydown)=\"_onKeydown($event)\"\n [tabIndex]=\"_getFocusIndex() === step.index() ? 0 : -1\"\n [id]=\"_getStepLabelId(step.index())\"\n [attr.role]=\"orientation === 'horizontal' ? 'tab' : 'button'\"\n [attr.aria-posinset]=\"orientation === 'horizontal' ? step.index() + 1 : null\"\n [attr.aria-setsize]=\"orientation === 'horizontal' ? steps.length : null\"\n [attr.aria-selected]=\"orientation === 'horizontal' ? step.isSelected() : null\"\n [attr.aria-current]=\"orientation === 'vertical' && step.isSelected() ? 'step' : null\"\n [attr.aria-disabled]=\"orientation === 'vertical' && step.isSelected() ? 'true' : null\"\n [attr.aria-expanded]=\"orientation === 'vertical' ? step.isSelected() : null\"\n [attr.aria-controls]=\"_getStepContentId(step.index())\"\n [attr.aria-label]=\"step.ariaLabel || null\"\n [attr.aria-labelledby]=\"(!step.ariaLabel && step.ariaLabelledby) ? step.ariaLabelledby : null\"\n [attr.aria-disabled]=\"step.isNavigable() ? null : true\"\n [index]=\"step.index()\"\n [state]=\"step.indicatorType()\"\n [label]=\"step.stepLabel || step.label\"\n [selected]=\"step.isSelected()\"\n [active]=\"step.isNavigable()\"\n [optional]=\"step.optional\"\n [errorMessage]=\"step.errorMessage\"\n [iconOverrides]=\"_iconOverrides\"\n [disableRipple]=\"disableRipple || !step.isNavigable()\"\n [color]=\"step.color || color\"/>\n</ng-template>\n\n<ng-template #horizontalStepsTemplate let-steps=\"steps\">\n <div \n aria-orientation=\"horizontal\"\n class=\"mat-horizontal-stepper-header-container\" \n role=\"tablist\">\n @for (step of steps; track step) {\n <ng-container\n [ngTemplateOutlet]=\"stepTemplate\"\n [ngTemplateOutletContext]=\"{step}\"/>\n @if (!$last) {\n <div class=\"mat-stepper-horizontal-line\"></div>\n }\n }\n </div>\n</ng-template>\n",
685
+ template: "<!--\n We need to project the content somewhere to avoid hydration errors. Some observations:\n 1. This is only necessary on the server.\n 2. We get a hydration error if there aren't any nodes after the `ng-content`.\n 3. We get a hydration error if `ng-content` is wrapped in another element.\n-->\n@if (_isServer) {\n <ng-content/>\n}\n\n@switch (orientation) {\n @case ('horizontal') {\n <div class=\"mat-horizontal-stepper-wrapper\">\n @if (headerPrefix()) {\n <div class=\"mat-horizontal-stepper-header-wrapper\">\n <ng-container [ngTemplateOutlet]=\"headerPrefix()\"/>\n <ng-container [ngTemplateOutlet]=\"horizontalStepsTemplate\"\n [ngTemplateOutletContext]=\"{steps}\"/>\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"horizontalStepsTemplate\"\n [ngTemplateOutletContext]=\"{steps}\"/>\n }\n\n <div class=\"mat-horizontal-content-container\">\n @for (step of steps; track step) {\n <div\n #animatedContainer\n class=\"mat-horizontal-stepper-content\"\n role=\"tabpanel\"\n [id]=\"_getStepContentId($index)\"\n [attr.aria-labelledby]=\"_getStepLabelId($index)\"\n [class]=\"'mat-horizontal-stepper-content-' + _getAnimationDirection($index)\"\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('vertical') {\n <div class=\"mat-vertical-stepper-wrapper\">\n @if (headerPrefix()) {\n <ng-container [ngTemplateOutlet]=\"headerPrefix()\"/>\n }\n\n @for (step of steps; track step) {\n <div class=\"mat-step\">\n <ng-container\n [ngTemplateOutlet]=\"stepTemplate\"\n [ngTemplateOutletContext]=\"{step}\"/>\n <div\n #animatedContainer\n class=\"mat-vertical-content-container\"\n [class.mat-stepper-vertical-line]=\"!$last\"\n [class.mat-vertical-content-container-active]=\"selectedIndex === $index\"\n [attr.inert]=\"selectedIndex === $index ? null : ''\"\n [attr.aria-label]=\"ariaLabel\">\n <div\n class=\"mat-vertical-stepper-content\"\n role=\"region\"\n [id]=\"_getStepContentId($index)\"\n [attr.aria-labelledby]=\"_getStepLabelId($index)\">\n <div class=\"mat-vertical-content\">\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n }\n}\n\n<!-- Common step templating -->\n<ng-template let-step=\"step\" #stepTemplate>\n <mat-step-header\n [class.mat-horizontal-stepper-header]=\"orientation === 'horizontal'\"\n [class.mat-vertical-stepper-header]=\"orientation === 'vertical'\"\n (click)=\"step.select()\"\n (keydown)=\"_onKeydown($event)\"\n [tabIndex]=\"_getFocusIndex() === step.index() ? 0 : -1\"\n [id]=\"_getStepLabelId(step.index())\"\n [attr.role]=\"orientation === 'horizontal' ? 'tab' : 'button'\"\n [attr.aria-posinset]=\"orientation === 'horizontal' ? step.index() + 1 : null\"\n [attr.aria-setsize]=\"orientation === 'horizontal' ? steps.length : null\"\n [attr.aria-selected]=\"orientation === 'horizontal' ? step.isSelected() : null\"\n [attr.aria-current]=\"orientation === 'vertical' && step.isSelected() ? 'step' : null\"\n [attr.aria-disabled]=\"orientation === 'vertical' && step.isSelected() ? 'true' : null\"\n [attr.aria-expanded]=\"orientation === 'vertical' ? step.isSelected() : null\"\n [attr.aria-controls]=\"_getStepContentId(step.index())\"\n [attr.aria-label]=\"step.ariaLabel || null\"\n [attr.aria-labelledby]=\"(!step.ariaLabel && step.ariaLabelledby) ? step.ariaLabelledby : null\"\n [attr.aria-disabled]=\"step.isNavigable() ? null : true\"\n [index]=\"step.index()\"\n [state]=\"step.indicatorType()\"\n [label]=\"step.stepLabel || step.label\"\n [selected]=\"step.isSelected()\"\n [active]=\"step.isNavigable()\"\n [optional]=\"step.optional\"\n [errorMessage]=\"step.errorMessage\"\n [iconOverrides]=\"_iconOverrides\"\n [disableRipple]=\"disableRipple || !step.isNavigable()\"\n [color]=\"step.color || color\"/>\n</ng-template>\n\n<ng-template #horizontalStepsTemplate let-steps=\"steps\">\n <div\n aria-orientation=\"horizontal\"\n class=\"mat-horizontal-stepper-header-container\"\n role=\"tablist\"\n [attr.aria-label]=\"ariaLabel\">\n @for (step of steps; track step) {\n <ng-container\n [ngTemplateOutlet]=\"stepTemplate\"\n [ngTemplateOutletContext]=\"{step}\"/>\n @if (!$last) {\n <div class=\"mat-stepper-horizontal-line\"></div>\n }\n }\n </div>\n</ng-template>\n",
678
686
  styles: [".mat-stepper-vertical,\n.mat-stepper-horizontal {\n display: block;\n font-family: var(--mat-stepper-container-text-font, var(--mat-sys-body-medium-font));\n background: var(--mat-stepper-container-color, var(--mat-sys-surface));\n}\n\n.mat-horizontal-stepper-header-wrapper {\n align-items: center;\n display: flex;\n}\n\n.mat-horizontal-stepper-header-container {\n white-space: nowrap;\n display: flex;\n align-items: center;\n flex-grow: 1;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header-container {\n align-items: flex-start;\n}\n.mat-stepper-header-position-bottom .mat-horizontal-stepper-header-container {\n order: 1;\n}\n\n.mat-stepper-horizontal-line {\n border-top-width: 1px;\n border-top-style: solid;\n flex: auto;\n height: 0;\n margin: 0 -16px;\n min-width: 32px;\n border-top-color: var(--mat-stepper-line-color, var(--mat-sys-outline));\n}\n.mat-stepper-label-position-bottom .mat-stepper-horizontal-line {\n margin: 0;\n min-width: 0;\n position: relative;\n top: calc(calc((var(--mat-stepper-header-height, 72px) - 24px) / 2) + 12px);\n}\n\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::before, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::before, .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::after, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::after {\n border-top-width: 1px;\n border-top-style: solid;\n content: \"\";\n display: inline-block;\n height: 0;\n position: absolute;\n width: calc(50% - 20px);\n}\n\n.mat-horizontal-stepper-header {\n display: flex;\n overflow: hidden;\n align-items: center;\n padding: 0 24px;\n height: var(--mat-stepper-header-height, 72px);\n}\n.mat-horizontal-stepper-header .mat-step-icon {\n margin-right: 8px;\n flex: none;\n}\n[dir=rtl] .mat-horizontal-stepper-header .mat-step-icon {\n margin-right: 0;\n margin-left: 8px;\n}\n.mat-horizontal-stepper-header.mat-step-header-empty-label .mat-step-icon {\n margin: 0;\n}\n.mat-horizontal-stepper-header::before, .mat-horizontal-stepper-header::after {\n border-top-color: var(--mat-stepper-line-color, var(--mat-sys-outline));\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header {\n padding: calc((var(--mat-stepper-header-height, 72px) - 24px) / 2) 24px;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header::before, .mat-stepper-label-position-bottom .mat-horizontal-stepper-header::after {\n top: calc(calc((var(--mat-stepper-header-height, 72px) - 24px) / 2) + 12px);\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header {\n box-sizing: border-box;\n flex-direction: column;\n height: auto;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::after, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::after {\n right: 0;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::before, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::before {\n left: 0;\n}\n[dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:last-child::before, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:first-child::after {\n display: none;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header .mat-step-icon {\n margin-right: 0;\n margin-left: 0;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header .mat-step-label {\n padding: 16px 0 0 0;\n text-align: center;\n width: 100%;\n}\n\n.mat-vertical-stepper-header {\n display: flex;\n align-items: center;\n height: 24px;\n padding: calc((var(--mat-stepper-header-height, 72px) - 24px) / 2) 24px;\n}\n.mat-vertical-stepper-header .mat-step-icon {\n margin-right: 12px;\n}\n[dir=rtl] .mat-vertical-stepper-header .mat-step-icon {\n margin-right: 0;\n margin-left: 12px;\n}\n\n.mat-horizontal-stepper-wrapper {\n display: flex;\n flex-direction: column;\n}\n\n.mat-horizontal-stepper-content {\n visibility: hidden;\n overflow: hidden;\n outline: 0;\n height: 0;\n}\n.mat-stepper-animations-enabled .mat-horizontal-stepper-content {\n transition: transform var(--mat-stepper-animation-duration, 0) cubic-bezier(0.35, 0, 0.25, 1);\n}\n.mat-horizontal-stepper-content.mat-horizontal-stepper-content-previous {\n transform: translate3d(-100%, 0, 0);\n}\n.mat-horizontal-stepper-content.mat-horizontal-stepper-content-next {\n transform: translate3d(100%, 0, 0);\n}\n.mat-horizontal-stepper-content.mat-horizontal-stepper-content-current {\n visibility: visible;\n transform: none;\n height: auto;\n}\n.mat-stepper-horizontal:not(.mat-stepper-animating) .mat-horizontal-stepper-content.mat-horizontal-stepper-content-current {\n overflow: visible;\n}\n\n.mat-horizontal-content-container {\n overflow: hidden;\n padding: 0 24px 24px 24px;\n}\n@media (forced-colors: active) {\n .mat-horizontal-content-container {\n outline: solid 1px;\n }\n}\n.mat-stepper-header-position-bottom .mat-horizontal-content-container {\n padding: 24px 24px 0 24px;\n}\n\n.mat-vertical-content-container {\n display: grid;\n grid-template-rows: 0fr;\n grid-template-columns: 100%;\n margin-left: 36px;\n border: 0;\n position: relative;\n}\n.mat-stepper-animations-enabled .mat-vertical-content-container {\n transition: grid-template-rows var(--mat-stepper-animation-duration, 0) cubic-bezier(0.4, 0, 0.2, 1);\n}\n.mat-vertical-content-container.mat-vertical-content-container-active {\n grid-template-rows: 1fr;\n}\n.mat-step:last-child .mat-vertical-content-container {\n border: none;\n}\n@media (forced-colors: active) {\n .mat-vertical-content-container {\n outline: solid 1px;\n }\n}\n[dir=rtl] .mat-vertical-content-container {\n margin-left: 0;\n margin-right: 36px;\n}\n@supports not (grid-template-rows: 0fr) {\n .mat-vertical-content-container {\n height: 0;\n }\n .mat-vertical-content-container.mat-vertical-content-container-active {\n height: auto;\n }\n}\n\n.mat-stepper-vertical-line::before {\n content: \"\";\n position: absolute;\n left: 0;\n border-left-width: 1px;\n border-left-style: solid;\n border-left-color: var(--mat-stepper-line-color, var(--mat-sys-outline));\n top: calc(8px - calc((var(--mat-stepper-header-height, 72px) - 24px) / 2));\n bottom: calc(8px - calc((var(--mat-stepper-header-height, 72px) - 24px) / 2));\n}\n[dir=rtl] .mat-stepper-vertical-line::before {\n left: auto;\n right: 0;\n}\n\n.mat-vertical-stepper-content {\n overflow: hidden;\n outline: 0;\n visibility: hidden;\n}\n.mat-stepper-animations-enabled .mat-vertical-stepper-content {\n transition: visibility var(--mat-stepper-animation-duration, 0) linear;\n}\n.mat-vertical-content-container-active > .mat-vertical-stepper-content {\n visibility: visible;\n}\n\n.mat-vertical-content {\n padding: 0 24px 24px 24px;\n}\n"],
679
687
  dependencies: [{
680
688
  kind: "directive",
@@ -693,7 +701,7 @@ class MatStepper extends CdkStepper {
693
701
  }
694
702
  i0.ɵɵngDeclareClassMetadata({
695
703
  minVersion: "12.0.0",
696
- version: "22.0.0-next.6",
704
+ version: "21.2.11",
697
705
  ngImport: i0,
698
706
  type: MatStepper,
699
707
  decorators: [{
@@ -717,7 +725,7 @@ i0.ɵɵngDeclareClassMetadata({
717
725
  encapsulation: ViewEncapsulation.None,
718
726
  changeDetection: ChangeDetectionStrategy.OnPush,
719
727
  imports: [NgTemplateOutlet, MatStepHeader],
720
- template: "<!--\n We need to project the content somewhere to avoid hydration errors. Some observations:\n 1. This is only necessary on the server.\n 2. We get a hydration error if there aren't any nodes after the `ng-content`.\n 3. We get a hydration error if `ng-content` is wrapped in another element.\n-->\n@if (_isServer) {\n <ng-content/>\n}\n\n@switch (orientation) {\n @case ('horizontal') {\n <div class=\"mat-horizontal-stepper-wrapper\">\n @if (headerPrefix()) {\n <div class=\"mat-horizontal-stepper-header-wrapper\">\n <ng-container [ngTemplateOutlet]=\"headerPrefix()\"/>\n <ng-container [ngTemplateOutlet]=\"horizontalStepsTemplate\"\n [ngTemplateOutletContext]=\"{steps}\"/>\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"horizontalStepsTemplate\"\n [ngTemplateOutletContext]=\"{steps}\"/>\n }\n\n <div class=\"mat-horizontal-content-container\">\n @for (step of steps; track step) {\n <div\n #animatedContainer\n class=\"mat-horizontal-stepper-content\"\n role=\"tabpanel\"\n [id]=\"_getStepContentId($index)\"\n [attr.aria-labelledby]=\"_getStepLabelId($index)\"\n [class]=\"'mat-horizontal-stepper-content-' + _getAnimationDirection($index)\"\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('vertical') {\n <div class=\"mat-vertical-stepper-wrapper\">\n @if (headerPrefix()) {\n <ng-container [ngTemplateOutlet]=\"headerPrefix()\"/>\n }\n\n @for (step of steps; track step) {\n <div class=\"mat-step\">\n <ng-container\n [ngTemplateOutlet]=\"stepTemplate\"\n [ngTemplateOutletContext]=\"{step}\"/>\n <div\n #animatedContainer\n class=\"mat-vertical-content-container\"\n [class.mat-stepper-vertical-line]=\"!$last\"\n [class.mat-vertical-content-container-active]=\"selectedIndex === $index\"\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\n <div \n class=\"mat-vertical-stepper-content\"\n role=\"region\"\n [id]=\"_getStepContentId($index)\"\n [attr.aria-labelledby]=\"_getStepLabelId($index)\">\n <div class=\"mat-vertical-content\">\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n }\n}\n\n<!-- Common step templating -->\n<ng-template let-step=\"step\" #stepTemplate>\n <mat-step-header\n [class.mat-horizontal-stepper-header]=\"orientation === 'horizontal'\"\n [class.mat-vertical-stepper-header]=\"orientation === 'vertical'\"\n (click)=\"step.select()\"\n (keydown)=\"_onKeydown($event)\"\n [tabIndex]=\"_getFocusIndex() === step.index() ? 0 : -1\"\n [id]=\"_getStepLabelId(step.index())\"\n [attr.role]=\"orientation === 'horizontal' ? 'tab' : 'button'\"\n [attr.aria-posinset]=\"orientation === 'horizontal' ? step.index() + 1 : null\"\n [attr.aria-setsize]=\"orientation === 'horizontal' ? steps.length : null\"\n [attr.aria-selected]=\"orientation === 'horizontal' ? step.isSelected() : null\"\n [attr.aria-current]=\"orientation === 'vertical' && step.isSelected() ? 'step' : null\"\n [attr.aria-disabled]=\"orientation === 'vertical' && step.isSelected() ? 'true' : null\"\n [attr.aria-expanded]=\"orientation === 'vertical' ? step.isSelected() : null\"\n [attr.aria-controls]=\"_getStepContentId(step.index())\"\n [attr.aria-label]=\"step.ariaLabel || null\"\n [attr.aria-labelledby]=\"(!step.ariaLabel && step.ariaLabelledby) ? step.ariaLabelledby : null\"\n [attr.aria-disabled]=\"step.isNavigable() ? null : true\"\n [index]=\"step.index()\"\n [state]=\"step.indicatorType()\"\n [label]=\"step.stepLabel || step.label\"\n [selected]=\"step.isSelected()\"\n [active]=\"step.isNavigable()\"\n [optional]=\"step.optional\"\n [errorMessage]=\"step.errorMessage\"\n [iconOverrides]=\"_iconOverrides\"\n [disableRipple]=\"disableRipple || !step.isNavigable()\"\n [color]=\"step.color || color\"/>\n</ng-template>\n\n<ng-template #horizontalStepsTemplate let-steps=\"steps\">\n <div \n aria-orientation=\"horizontal\"\n class=\"mat-horizontal-stepper-header-container\" \n role=\"tablist\">\n @for (step of steps; track step) {\n <ng-container\n [ngTemplateOutlet]=\"stepTemplate\"\n [ngTemplateOutletContext]=\"{step}\"/>\n @if (!$last) {\n <div class=\"mat-stepper-horizontal-line\"></div>\n }\n }\n </div>\n</ng-template>\n",
728
+ template: "<!--\n We need to project the content somewhere to avoid hydration errors. Some observations:\n 1. This is only necessary on the server.\n 2. We get a hydration error if there aren't any nodes after the `ng-content`.\n 3. We get a hydration error if `ng-content` is wrapped in another element.\n-->\n@if (_isServer) {\n <ng-content/>\n}\n\n@switch (orientation) {\n @case ('horizontal') {\n <div class=\"mat-horizontal-stepper-wrapper\">\n @if (headerPrefix()) {\n <div class=\"mat-horizontal-stepper-header-wrapper\">\n <ng-container [ngTemplateOutlet]=\"headerPrefix()\"/>\n <ng-container [ngTemplateOutlet]=\"horizontalStepsTemplate\"\n [ngTemplateOutletContext]=\"{steps}\"/>\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"horizontalStepsTemplate\"\n [ngTemplateOutletContext]=\"{steps}\"/>\n }\n\n <div class=\"mat-horizontal-content-container\">\n @for (step of steps; track step) {\n <div\n #animatedContainer\n class=\"mat-horizontal-stepper-content\"\n role=\"tabpanel\"\n [id]=\"_getStepContentId($index)\"\n [attr.aria-labelledby]=\"_getStepLabelId($index)\"\n [class]=\"'mat-horizontal-stepper-content-' + _getAnimationDirection($index)\"\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('vertical') {\n <div class=\"mat-vertical-stepper-wrapper\">\n @if (headerPrefix()) {\n <ng-container [ngTemplateOutlet]=\"headerPrefix()\"/>\n }\n\n @for (step of steps; track step) {\n <div class=\"mat-step\">\n <ng-container\n [ngTemplateOutlet]=\"stepTemplate\"\n [ngTemplateOutletContext]=\"{step}\"/>\n <div\n #animatedContainer\n class=\"mat-vertical-content-container\"\n [class.mat-stepper-vertical-line]=\"!$last\"\n [class.mat-vertical-content-container-active]=\"selectedIndex === $index\"\n [attr.inert]=\"selectedIndex === $index ? null : ''\"\n [attr.aria-label]=\"ariaLabel\">\n <div\n class=\"mat-vertical-stepper-content\"\n role=\"region\"\n [id]=\"_getStepContentId($index)\"\n [attr.aria-labelledby]=\"_getStepLabelId($index)\">\n <div class=\"mat-vertical-content\">\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n }\n}\n\n<!-- Common step templating -->\n<ng-template let-step=\"step\" #stepTemplate>\n <mat-step-header\n [class.mat-horizontal-stepper-header]=\"orientation === 'horizontal'\"\n [class.mat-vertical-stepper-header]=\"orientation === 'vertical'\"\n (click)=\"step.select()\"\n (keydown)=\"_onKeydown($event)\"\n [tabIndex]=\"_getFocusIndex() === step.index() ? 0 : -1\"\n [id]=\"_getStepLabelId(step.index())\"\n [attr.role]=\"orientation === 'horizontal' ? 'tab' : 'button'\"\n [attr.aria-posinset]=\"orientation === 'horizontal' ? step.index() + 1 : null\"\n [attr.aria-setsize]=\"orientation === 'horizontal' ? steps.length : null\"\n [attr.aria-selected]=\"orientation === 'horizontal' ? step.isSelected() : null\"\n [attr.aria-current]=\"orientation === 'vertical' && step.isSelected() ? 'step' : null\"\n [attr.aria-disabled]=\"orientation === 'vertical' && step.isSelected() ? 'true' : null\"\n [attr.aria-expanded]=\"orientation === 'vertical' ? step.isSelected() : null\"\n [attr.aria-controls]=\"_getStepContentId(step.index())\"\n [attr.aria-label]=\"step.ariaLabel || null\"\n [attr.aria-labelledby]=\"(!step.ariaLabel && step.ariaLabelledby) ? step.ariaLabelledby : null\"\n [attr.aria-disabled]=\"step.isNavigable() ? null : true\"\n [index]=\"step.index()\"\n [state]=\"step.indicatorType()\"\n [label]=\"step.stepLabel || step.label\"\n [selected]=\"step.isSelected()\"\n [active]=\"step.isNavigable()\"\n [optional]=\"step.optional\"\n [errorMessage]=\"step.errorMessage\"\n [iconOverrides]=\"_iconOverrides\"\n [disableRipple]=\"disableRipple || !step.isNavigable()\"\n [color]=\"step.color || color\"/>\n</ng-template>\n\n<ng-template #horizontalStepsTemplate let-steps=\"steps\">\n <div\n aria-orientation=\"horizontal\"\n class=\"mat-horizontal-stepper-header-container\"\n role=\"tablist\"\n [attr.aria-label]=\"ariaLabel\">\n @for (step of steps; track step) {\n <ng-container\n [ngTemplateOutlet]=\"stepTemplate\"\n [ngTemplateOutletContext]=\"{step}\"/>\n @if (!$last) {\n <div class=\"mat-stepper-horizontal-line\"></div>\n }\n }\n </div>\n</ng-template>\n",
721
729
  styles: [".mat-stepper-vertical,\n.mat-stepper-horizontal {\n display: block;\n font-family: var(--mat-stepper-container-text-font, var(--mat-sys-body-medium-font));\n background: var(--mat-stepper-container-color, var(--mat-sys-surface));\n}\n\n.mat-horizontal-stepper-header-wrapper {\n align-items: center;\n display: flex;\n}\n\n.mat-horizontal-stepper-header-container {\n white-space: nowrap;\n display: flex;\n align-items: center;\n flex-grow: 1;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header-container {\n align-items: flex-start;\n}\n.mat-stepper-header-position-bottom .mat-horizontal-stepper-header-container {\n order: 1;\n}\n\n.mat-stepper-horizontal-line {\n border-top-width: 1px;\n border-top-style: solid;\n flex: auto;\n height: 0;\n margin: 0 -16px;\n min-width: 32px;\n border-top-color: var(--mat-stepper-line-color, var(--mat-sys-outline));\n}\n.mat-stepper-label-position-bottom .mat-stepper-horizontal-line {\n margin: 0;\n min-width: 0;\n position: relative;\n top: calc(calc((var(--mat-stepper-header-height, 72px) - 24px) / 2) + 12px);\n}\n\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::before, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::before, .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::after, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::after {\n border-top-width: 1px;\n border-top-style: solid;\n content: \"\";\n display: inline-block;\n height: 0;\n position: absolute;\n width: calc(50% - 20px);\n}\n\n.mat-horizontal-stepper-header {\n display: flex;\n overflow: hidden;\n align-items: center;\n padding: 0 24px;\n height: var(--mat-stepper-header-height, 72px);\n}\n.mat-horizontal-stepper-header .mat-step-icon {\n margin-right: 8px;\n flex: none;\n}\n[dir=rtl] .mat-horizontal-stepper-header .mat-step-icon {\n margin-right: 0;\n margin-left: 8px;\n}\n.mat-horizontal-stepper-header.mat-step-header-empty-label .mat-step-icon {\n margin: 0;\n}\n.mat-horizontal-stepper-header::before, .mat-horizontal-stepper-header::after {\n border-top-color: var(--mat-stepper-line-color, var(--mat-sys-outline));\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header {\n padding: calc((var(--mat-stepper-header-height, 72px) - 24px) / 2) 24px;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header::before, .mat-stepper-label-position-bottom .mat-horizontal-stepper-header::after {\n top: calc(calc((var(--mat-stepper-header-height, 72px) - 24px) / 2) + 12px);\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header {\n box-sizing: border-box;\n flex-direction: column;\n height: auto;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::after, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::after {\n right: 0;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::before, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::before {\n left: 0;\n}\n[dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:last-child::before, [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:first-child::after {\n display: none;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header .mat-step-icon {\n margin-right: 0;\n margin-left: 0;\n}\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header .mat-step-label {\n padding: 16px 0 0 0;\n text-align: center;\n width: 100%;\n}\n\n.mat-vertical-stepper-header {\n display: flex;\n align-items: center;\n height: 24px;\n padding: calc((var(--mat-stepper-header-height, 72px) - 24px) / 2) 24px;\n}\n.mat-vertical-stepper-header .mat-step-icon {\n margin-right: 12px;\n}\n[dir=rtl] .mat-vertical-stepper-header .mat-step-icon {\n margin-right: 0;\n margin-left: 12px;\n}\n\n.mat-horizontal-stepper-wrapper {\n display: flex;\n flex-direction: column;\n}\n\n.mat-horizontal-stepper-content {\n visibility: hidden;\n overflow: hidden;\n outline: 0;\n height: 0;\n}\n.mat-stepper-animations-enabled .mat-horizontal-stepper-content {\n transition: transform var(--mat-stepper-animation-duration, 0) cubic-bezier(0.35, 0, 0.25, 1);\n}\n.mat-horizontal-stepper-content.mat-horizontal-stepper-content-previous {\n transform: translate3d(-100%, 0, 0);\n}\n.mat-horizontal-stepper-content.mat-horizontal-stepper-content-next {\n transform: translate3d(100%, 0, 0);\n}\n.mat-horizontal-stepper-content.mat-horizontal-stepper-content-current {\n visibility: visible;\n transform: none;\n height: auto;\n}\n.mat-stepper-horizontal:not(.mat-stepper-animating) .mat-horizontal-stepper-content.mat-horizontal-stepper-content-current {\n overflow: visible;\n}\n\n.mat-horizontal-content-container {\n overflow: hidden;\n padding: 0 24px 24px 24px;\n}\n@media (forced-colors: active) {\n .mat-horizontal-content-container {\n outline: solid 1px;\n }\n}\n.mat-stepper-header-position-bottom .mat-horizontal-content-container {\n padding: 24px 24px 0 24px;\n}\n\n.mat-vertical-content-container {\n display: grid;\n grid-template-rows: 0fr;\n grid-template-columns: 100%;\n margin-left: 36px;\n border: 0;\n position: relative;\n}\n.mat-stepper-animations-enabled .mat-vertical-content-container {\n transition: grid-template-rows var(--mat-stepper-animation-duration, 0) cubic-bezier(0.4, 0, 0.2, 1);\n}\n.mat-vertical-content-container.mat-vertical-content-container-active {\n grid-template-rows: 1fr;\n}\n.mat-step:last-child .mat-vertical-content-container {\n border: none;\n}\n@media (forced-colors: active) {\n .mat-vertical-content-container {\n outline: solid 1px;\n }\n}\n[dir=rtl] .mat-vertical-content-container {\n margin-left: 0;\n margin-right: 36px;\n}\n@supports not (grid-template-rows: 0fr) {\n .mat-vertical-content-container {\n height: 0;\n }\n .mat-vertical-content-container.mat-vertical-content-container-active {\n height: auto;\n }\n}\n\n.mat-stepper-vertical-line::before {\n content: \"\";\n position: absolute;\n left: 0;\n border-left-width: 1px;\n border-left-style: solid;\n border-left-color: var(--mat-stepper-line-color, var(--mat-sys-outline));\n top: calc(8px - calc((var(--mat-stepper-header-height, 72px) - 24px) / 2));\n bottom: calc(8px - calc((var(--mat-stepper-header-height, 72px) - 24px) / 2));\n}\n[dir=rtl] .mat-stepper-vertical-line::before {\n left: auto;\n right: 0;\n}\n\n.mat-vertical-stepper-content {\n overflow: hidden;\n outline: 0;\n visibility: hidden;\n}\n.mat-stepper-animations-enabled .mat-vertical-stepper-content {\n transition: visibility var(--mat-stepper-animation-duration, 0) linear;\n}\n.mat-vertical-content-container-active > .mat-vertical-stepper-content {\n visibility: visible;\n}\n\n.mat-vertical-content {\n padding: 0 24px 24px 24px;\n}\n"]
722
730
  }]
723
731
  }],
@@ -758,6 +766,10 @@ i0.ɵɵngDeclareClassMetadata({
758
766
  headerPosition: [{
759
767
  type: Input
760
768
  }],
769
+ ariaLabel: [{
770
+ type: Input,
771
+ args: ['aria-label']
772
+ }],
761
773
  headerPrefix: [{
762
774
  type: i0.Input,
763
775
  args: [{
@@ -775,7 +787,7 @@ i0.ɵɵngDeclareClassMetadata({
775
787
  class MatStepperNext extends CdkStepperNext {
776
788
  static ɵfac = i0.ɵɵngDeclareFactory({
777
789
  minVersion: "12.0.0",
778
- version: "22.0.0-next.6",
790
+ version: "21.2.11",
779
791
  ngImport: i0,
780
792
  type: MatStepperNext,
781
793
  deps: null,
@@ -783,7 +795,7 @@ class MatStepperNext extends CdkStepperNext {
783
795
  });
784
796
  static ɵdir = i0.ɵɵngDeclareDirective({
785
797
  minVersion: "14.0.0",
786
- version: "22.0.0-next.6",
798
+ version: "21.2.11",
787
799
  type: MatStepperNext,
788
800
  isStandalone: true,
789
801
  selector: "button[matStepperNext]",
@@ -799,7 +811,7 @@ class MatStepperNext extends CdkStepperNext {
799
811
  }
800
812
  i0.ɵɵngDeclareClassMetadata({
801
813
  minVersion: "12.0.0",
802
- version: "22.0.0-next.6",
814
+ version: "21.2.11",
803
815
  ngImport: i0,
804
816
  type: MatStepperNext,
805
817
  decorators: [{
@@ -816,7 +828,7 @@ i0.ɵɵngDeclareClassMetadata({
816
828
  class MatStepperPrevious extends CdkStepperPrevious {
817
829
  static ɵfac = i0.ɵɵngDeclareFactory({
818
830
  minVersion: "12.0.0",
819
- version: "22.0.0-next.6",
831
+ version: "21.2.11",
820
832
  ngImport: i0,
821
833
  type: MatStepperPrevious,
822
834
  deps: null,
@@ -824,7 +836,7 @@ class MatStepperPrevious extends CdkStepperPrevious {
824
836
  });
825
837
  static ɵdir = i0.ɵɵngDeclareDirective({
826
838
  minVersion: "14.0.0",
827
- version: "22.0.0-next.6",
839
+ version: "21.2.11",
828
840
  type: MatStepperPrevious,
829
841
  isStandalone: true,
830
842
  selector: "button[matStepperPrevious]",
@@ -840,7 +852,7 @@ class MatStepperPrevious extends CdkStepperPrevious {
840
852
  }
841
853
  i0.ɵɵngDeclareClassMetadata({
842
854
  minVersion: "12.0.0",
843
- version: "22.0.0-next.6",
855
+ version: "21.2.11",
844
856
  ngImport: i0,
845
857
  type: MatStepperPrevious,
846
858
  decorators: [{
@@ -858,7 +870,7 @@ i0.ɵɵngDeclareClassMetadata({
858
870
  class MatStepperModule {
859
871
  static ɵfac = i0.ɵɵngDeclareFactory({
860
872
  minVersion: "12.0.0",
861
- version: "22.0.0-next.6",
873
+ version: "21.2.11",
862
874
  ngImport: i0,
863
875
  type: MatStepperModule,
864
876
  deps: [],
@@ -866,7 +878,7 @@ class MatStepperModule {
866
878
  });
867
879
  static ɵmod = i0.ɵɵngDeclareNgModule({
868
880
  minVersion: "14.0.0",
869
- version: "22.0.0-next.6",
881
+ version: "21.2.11",
870
882
  ngImport: i0,
871
883
  type: MatStepperModule,
872
884
  imports: [PortalModule, CdkStepperModule, MatIconModule, MatRippleModule, MatStep, MatStepLabel, MatStepper, MatStepperNext, MatStepperPrevious, MatStepHeader, MatStepperIcon, MatStepContent],
@@ -874,7 +886,7 @@ class MatStepperModule {
874
886
  });
875
887
  static ɵinj = i0.ɵɵngDeclareInjector({
876
888
  minVersion: "12.0.0",
877
- version: "22.0.0-next.6",
889
+ version: "21.2.11",
878
890
  ngImport: i0,
879
891
  type: MatStepperModule,
880
892
  providers: [ErrorStateMatcher],
@@ -883,7 +895,7 @@ class MatStepperModule {
883
895
  }
884
896
  i0.ɵɵngDeclareClassMetadata({
885
897
  minVersion: "12.0.0",
886
- version: "22.0.0-next.6",
898
+ version: "21.2.11",
887
899
  ngImport: i0,
888
900
  type: MatStepperModule,
889
901
  decorators: [{