@angular/material 21.0.0-next.9 → 21.0.0-rc.1

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 (202) hide show
  1. package/core/tokens/_classes.scss +1 -1
  2. package/core/tokens/m2/_md-sys-color.scss +17 -17
  3. package/fesm2022/_animation-chunk.mjs +10 -16
  4. package/fesm2022/_animation-chunk.mjs.map +1 -1
  5. package/fesm2022/_date-formats-chunk.mjs +68 -164
  6. package/fesm2022/_date-formats-chunk.mjs.map +1 -1
  7. package/fesm2022/_date-range-input-harness-chunk.mjs +284 -463
  8. package/fesm2022/_date-range-input-harness-chunk.mjs.map +1 -1
  9. package/fesm2022/_error-options-chunk.mjs +56 -19
  10. package/fesm2022/_error-options-chunk.mjs.map +1 -1
  11. package/fesm2022/_error-state-chunk.mjs +24 -31
  12. package/fesm2022/_error-state-chunk.mjs.map +1 -1
  13. package/fesm2022/_form-field-chunk.mjs +1224 -1017
  14. package/fesm2022/_form-field-chunk.mjs.map +1 -1
  15. package/fesm2022/_icon-button-chunk.mjs +243 -187
  16. package/fesm2022/_icon-button-chunk.mjs.map +1 -1
  17. package/fesm2022/_icon-registry-chunk.mjs +350 -575
  18. package/fesm2022/_icon-registry-chunk.mjs.map +1 -1
  19. package/fesm2022/_input-harness-chunk.mjs +56 -107
  20. package/fesm2022/_input-harness-chunk.mjs.map +1 -1
  21. package/fesm2022/_input-value-accessor-chunk.mjs +0 -6
  22. package/fesm2022/_input-value-accessor-chunk.mjs.map +1 -1
  23. package/fesm2022/_internal-form-field-chunk.mjs +59 -19
  24. package/fesm2022/_internal-form-field-chunk.mjs.map +1 -1
  25. package/fesm2022/_line-chunk.mjs +83 -43
  26. package/fesm2022/_line-chunk.mjs.map +1 -1
  27. package/fesm2022/_option-chunk.mjs +348 -311
  28. package/fesm2022/_option-chunk.mjs.map +1 -1
  29. package/fesm2022/_option-harness-chunk.mjs +23 -39
  30. package/fesm2022/_option-harness-chunk.mjs.map +1 -1
  31. package/fesm2022/_option-module-chunk.mjs +36 -10
  32. package/fesm2022/_option-module-chunk.mjs.map +1 -1
  33. package/fesm2022/_pseudo-checkbox-chunk.mjs +79 -44
  34. package/fesm2022/_pseudo-checkbox-chunk.mjs.map +1 -1
  35. package/fesm2022/_pseudo-checkbox-module-chunk.mjs +36 -10
  36. package/fesm2022/_pseudo-checkbox-module-chunk.mjs.map +1 -1
  37. package/fesm2022/_public-api-chunk.mjs +71 -134
  38. package/fesm2022/_public-api-chunk.mjs.map +1 -1
  39. package/fesm2022/_ripple-chunk.mjs +504 -600
  40. package/fesm2022/_ripple-chunk.mjs.map +1 -1
  41. package/fesm2022/_ripple-loader-chunk.mjs +120 -138
  42. package/fesm2022/_ripple-loader-chunk.mjs.map +1 -1
  43. package/fesm2022/_ripple-module-chunk.mjs +36 -10
  44. package/fesm2022/_ripple-module-chunk.mjs.map +1 -1
  45. package/fesm2022/_structural-styles-chunk.mjs +37 -10
  46. package/fesm2022/_structural-styles-chunk.mjs.map +1 -1
  47. package/fesm2022/_tooltip-chunk.mjs +811 -888
  48. package/fesm2022/_tooltip-chunk.mjs.map +1 -1
  49. package/fesm2022/autocomplete-testing.mjs +62 -86
  50. package/fesm2022/autocomplete-testing.mjs.map +1 -1
  51. package/fesm2022/autocomplete.mjs +965 -1126
  52. package/fesm2022/autocomplete.mjs.map +1 -1
  53. package/fesm2022/badge-testing.mjs +38 -54
  54. package/fesm2022/badge-testing.mjs.map +1 -1
  55. package/fesm2022/badge.mjs +321 -272
  56. package/fesm2022/badge.mjs.map +1 -1
  57. package/fesm2022/bottom-sheet-testing.mjs +10 -24
  58. package/fesm2022/bottom-sheet-testing.mjs.map +1 -1
  59. package/fesm2022/bottom-sheet.mjs +349 -344
  60. package/fesm2022/bottom-sheet.mjs.map +1 -1
  61. package/fesm2022/button-testing.mjs +60 -94
  62. package/fesm2022/button-testing.mjs.map +1 -1
  63. package/fesm2022/button-toggle-testing.mjs +76 -125
  64. package/fesm2022/button-toggle-testing.mjs.map +1 -1
  65. package/fesm2022/button-toggle.mjs +752 -662
  66. package/fesm2022/button-toggle.mjs.map +1 -1
  67. package/fesm2022/button.mjs +263 -158
  68. package/fesm2022/button.mjs.map +1 -1
  69. package/fesm2022/card-testing.mjs +19 -33
  70. package/fesm2022/card-testing.mjs.map +1 -1
  71. package/fesm2022/card.mjs +576 -272
  72. package/fesm2022/card.mjs.map +1 -1
  73. package/fesm2022/checkbox-testing.mjs +71 -123
  74. package/fesm2022/checkbox-testing.mjs.map +1 -1
  75. package/fesm2022/checkbox.mjs +515 -477
  76. package/fesm2022/checkbox.mjs.map +1 -1
  77. package/fesm2022/chips-testing.mjs +201 -344
  78. package/fesm2022/chips-testing.mjs.map +1 -1
  79. package/fesm2022/chips.mjs +2552 -2289
  80. package/fesm2022/chips.mjs.map +1 -1
  81. package/fesm2022/core-testing.mjs +14 -28
  82. package/fesm2022/core-testing.mjs.map +1 -1
  83. package/fesm2022/core.mjs +357 -328
  84. package/fesm2022/core.mjs.map +1 -1
  85. package/fesm2022/datepicker-testing.mjs +15 -25
  86. package/fesm2022/datepicker-testing.mjs.map +1 -1
  87. package/fesm2022/datepicker.mjs +4826 -4563
  88. package/fesm2022/datepicker.mjs.map +1 -1
  89. package/fesm2022/dialog-testing.mjs +93 -129
  90. package/fesm2022/dialog-testing.mjs.map +1 -1
  91. package/fesm2022/dialog.mjs +810 -829
  92. package/fesm2022/dialog.mjs.map +1 -1
  93. package/fesm2022/divider-testing.mjs +10 -11
  94. package/fesm2022/divider-testing.mjs.map +1 -1
  95. package/fesm2022/divider.mjs +119 -43
  96. package/fesm2022/divider.mjs.map +1 -1
  97. package/fesm2022/expansion-testing.mjs +74 -130
  98. package/fesm2022/expansion-testing.mjs.map +1 -1
  99. package/fesm2022/expansion.mjs +703 -515
  100. package/fesm2022/expansion.mjs.map +1 -1
  101. package/fesm2022/form-field-testing-control.mjs +16 -33
  102. package/fesm2022/form-field-testing-control.mjs.map +1 -1
  103. package/fesm2022/form-field-testing.mjs +118 -179
  104. package/fesm2022/form-field-testing.mjs.map +1 -1
  105. package/fesm2022/form-field.mjs +36 -10
  106. package/fesm2022/form-field.mjs.map +1 -1
  107. package/fesm2022/grid-list-testing.mjs +65 -113
  108. package/fesm2022/grid-list-testing.mjs.map +1 -1
  109. package/fesm2022/grid-list.mjs +559 -494
  110. package/fesm2022/grid-list.mjs.map +1 -1
  111. package/fesm2022/icon-testing.mjs +148 -127
  112. package/fesm2022/icon-testing.mjs.map +1 -1
  113. package/fesm2022/icon.mjs +325 -351
  114. package/fesm2022/icon.mjs.map +1 -1
  115. package/fesm2022/input-testing.mjs +59 -99
  116. package/fesm2022/input-testing.mjs.map +1 -1
  117. package/fesm2022/input.mjs +457 -520
  118. package/fesm2022/input.mjs.map +1 -1
  119. package/fesm2022/list-testing.mjs +251 -434
  120. package/fesm2022/list-testing.mjs.map +1 -1
  121. package/fesm2022/list.mjs +1522 -1204
  122. package/fesm2022/list.mjs.map +1 -1
  123. package/fesm2022/material.mjs +0 -5
  124. package/fesm2022/material.mjs.map +1 -1
  125. package/fesm2022/menu-testing.mjs +159 -228
  126. package/fesm2022/menu-testing.mjs.map +1 -1
  127. package/fesm2022/menu.mjs +1338 -1343
  128. package/fesm2022/menu.mjs.map +1 -1
  129. package/fesm2022/paginator-testing.mjs +55 -79
  130. package/fesm2022/paginator-testing.mjs.map +1 -1
  131. package/fesm2022/paginator.mjs +381 -309
  132. package/fesm2022/paginator.mjs.map +1 -1
  133. package/fesm2022/progress-bar-testing.mjs +12 -21
  134. package/fesm2022/progress-bar-testing.mjs.map +1 -1
  135. package/fesm2022/progress-bar.mjs +224 -169
  136. package/fesm2022/progress-bar.mjs.map +1 -1
  137. package/fesm2022/progress-spinner-testing.mjs +13 -23
  138. package/fesm2022/progress-spinner-testing.mjs.map +1 -1
  139. package/fesm2022/progress-spinner.mjs +235 -160
  140. package/fesm2022/progress-spinner.mjs.map +1 -1
  141. package/fesm2022/radio-testing.mjs +133 -208
  142. package/fesm2022/radio-testing.mjs.map +1 -1
  143. package/fesm2022/radio.mjs +712 -679
  144. package/fesm2022/radio.mjs.map +1 -1
  145. package/fesm2022/select-testing.mjs +83 -117
  146. package/fesm2022/select-testing.mjs.map +1 -1
  147. package/fesm2022/select.mjs +1116 -1246
  148. package/fesm2022/select.mjs.map +1 -1
  149. package/fesm2022/sidenav-testing.mjs +54 -120
  150. package/fesm2022/sidenav-testing.mjs.map +1 -1
  151. package/fesm2022/sidenav.mjs +1078 -995
  152. package/fesm2022/sidenav.mjs.map +1 -1
  153. package/fesm2022/slide-toggle-testing.mjs +57 -92
  154. package/fesm2022/slide-toggle-testing.mjs.map +1 -1
  155. package/fesm2022/slide-toggle.mjs +369 -279
  156. package/fesm2022/slide-toggle.mjs.map +1 -1
  157. package/fesm2022/slider-testing.mjs +90 -138
  158. package/fesm2022/slider-testing.mjs.map +1 -1
  159. package/fesm2022/slider.mjs +1651 -1716
  160. package/fesm2022/slider.mjs.map +1 -1
  161. package/fesm2022/snack-bar-testing.mjs +40 -87
  162. package/fesm2022/snack-bar-testing.mjs.map +1 -1
  163. package/fesm2022/snack-bar.mjs +763 -714
  164. package/fesm2022/snack-bar.mjs.map +1 -1
  165. package/fesm2022/sort-testing.mjs +45 -66
  166. package/fesm2022/sort-testing.mjs.map +1 -1
  167. package/fesm2022/sort.mjs +419 -344
  168. package/fesm2022/sort.mjs.map +1 -1
  169. package/fesm2022/stepper-testing.mjs +78 -154
  170. package/fesm2022/stepper-testing.mjs.map +1 -1
  171. package/fesm2022/stepper.mjs +790 -498
  172. package/fesm2022/stepper.mjs.map +1 -1
  173. package/fesm2022/table-testing.mjs +120 -213
  174. package/fesm2022/table-testing.mjs.map +1 -1
  175. package/fesm2022/table.mjs +1026 -684
  176. package/fesm2022/table.mjs.map +1 -1
  177. package/fesm2022/tabs-testing.mjs +125 -197
  178. package/fesm2022/tabs-testing.mjs.map +1 -1
  179. package/fesm2022/tabs.mjs +2351 -2028
  180. package/fesm2022/tabs.mjs.map +1 -1
  181. package/fesm2022/timepicker-testing.mjs +113 -172
  182. package/fesm2022/timepicker-testing.mjs.map +1 -1
  183. package/fesm2022/timepicker.mjs +1019 -826
  184. package/fesm2022/timepicker.mjs.map +1 -1
  185. package/fesm2022/toolbar-testing.mjs +16 -27
  186. package/fesm2022/toolbar-testing.mjs.map +1 -1
  187. package/fesm2022/toolbar.mjs +163 -78
  188. package/fesm2022/toolbar.mjs.map +1 -1
  189. package/fesm2022/tooltip-testing.mjs +41 -52
  190. package/fesm2022/tooltip-testing.mjs.map +1 -1
  191. package/fesm2022/tooltip.mjs +36 -10
  192. package/fesm2022/tooltip.mjs.map +1 -1
  193. package/fesm2022/tree-testing.mjs +86 -162
  194. package/fesm2022/tree-testing.mjs.map +1 -1
  195. package/fesm2022/tree.mjs +638 -466
  196. package/fesm2022/tree.mjs.map +1 -1
  197. package/package.json +2 -2
  198. package/schematics/ng-add/index.js +1 -1
  199. package/types/expansion.d.ts +4 -2
  200. package/types/menu-testing.d.ts +2 -0
  201. package/types/select.d.ts +1 -1
  202. package/types/timepicker.d.ts +1 -0
@@ -10,1105 +10,1312 @@ import { startWith, map, pairwise, filter, takeUntil } from 'rxjs/operators';
10
10
  import { SharedResizeObserver } from '@angular/cdk/observers/private';
11
11
  import { _animationsDisabled } from './_animation-chunk.mjs';
12
12
 
13
- /** The floating label for a `mat-form-field`. */
14
13
  class MatLabel {
15
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
16
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0-next.2", type: MatLabel, isStandalone: true, selector: "mat-label", ngImport: i0 });
14
+ static ɵfac = i0.ɵɵngDeclareFactory({
15
+ minVersion: "12.0.0",
16
+ version: "20.2.0-next.2",
17
+ ngImport: i0,
18
+ type: MatLabel,
19
+ deps: [],
20
+ target: i0.ɵɵFactoryTarget.Directive
21
+ });
22
+ static ɵdir = i0.ɵɵngDeclareDirective({
23
+ minVersion: "14.0.0",
24
+ version: "20.2.0-next.2",
25
+ type: MatLabel,
26
+ isStandalone: true,
27
+ selector: "mat-label",
28
+ ngImport: i0
29
+ });
17
30
  }
18
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatLabel, decorators: [{
19
- type: Directive,
20
- args: [{
21
- selector: 'mat-label',
22
- }]
23
- }] });
31
+ i0.ɵɵngDeclareClassMetadata({
32
+ minVersion: "12.0.0",
33
+ version: "20.2.0-next.2",
34
+ ngImport: i0,
35
+ type: MatLabel,
36
+ decorators: [{
37
+ type: Directive,
38
+ args: [{
39
+ selector: 'mat-label'
40
+ }]
41
+ }]
42
+ });
24
43
 
25
- /**
26
- * Injection token that can be used to reference instances of `MatError`. It serves as
27
- * alternative token to the actual `MatError` class which could cause unnecessary
28
- * retention of the class and its directive metadata.
29
- */
30
44
  const MAT_ERROR = new InjectionToken('MatError');
31
- /** Single error message to be shown underneath the form-field. */
32
45
  class MatError {
33
- id = inject(_IdGenerator).getId('mat-mdc-error-');
34
- constructor() { }
35
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatError, deps: [], target: i0.ɵɵFactoryTarget.Directive });
36
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0-next.2", type: MatError, isStandalone: true, selector: "mat-error, [matError]", inputs: { id: "id" }, host: { properties: { "id": "id" }, classAttribute: "mat-mdc-form-field-error mat-mdc-form-field-bottom-align" }, providers: [{ provide: MAT_ERROR, useExisting: MatError }], ngImport: i0 });
46
+ id = inject(_IdGenerator).getId('mat-mdc-error-');
47
+ constructor() {}
48
+ static ɵfac = i0.ɵɵngDeclareFactory({
49
+ minVersion: "12.0.0",
50
+ version: "20.2.0-next.2",
51
+ ngImport: i0,
52
+ type: MatError,
53
+ deps: [],
54
+ target: i0.ɵɵFactoryTarget.Directive
55
+ });
56
+ static ɵdir = i0.ɵɵngDeclareDirective({
57
+ minVersion: "14.0.0",
58
+ version: "20.2.0-next.2",
59
+ type: MatError,
60
+ isStandalone: true,
61
+ selector: "mat-error, [matError]",
62
+ inputs: {
63
+ id: "id"
64
+ },
65
+ host: {
66
+ properties: {
67
+ "id": "id"
68
+ },
69
+ classAttribute: "mat-mdc-form-field-error mat-mdc-form-field-bottom-align"
70
+ },
71
+ providers: [{
72
+ provide: MAT_ERROR,
73
+ useExisting: MatError
74
+ }],
75
+ ngImport: i0
76
+ });
37
77
  }
38
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatError, decorators: [{
39
- type: Directive,
40
- args: [{
41
- selector: 'mat-error, [matError]',
42
- host: {
43
- 'class': 'mat-mdc-form-field-error mat-mdc-form-field-bottom-align',
44
- '[id]': 'id',
45
- },
46
- providers: [{ provide: MAT_ERROR, useExisting: MatError }],
47
- }]
48
- }], ctorParameters: () => [], propDecorators: { id: [{
49
- type: Input
50
- }] } });
78
+ i0.ɵɵngDeclareClassMetadata({
79
+ minVersion: "12.0.0",
80
+ version: "20.2.0-next.2",
81
+ ngImport: i0,
82
+ type: MatError,
83
+ decorators: [{
84
+ type: Directive,
85
+ args: [{
86
+ selector: 'mat-error, [matError]',
87
+ host: {
88
+ 'class': 'mat-mdc-form-field-error mat-mdc-form-field-bottom-align',
89
+ '[id]': 'id'
90
+ },
91
+ providers: [{
92
+ provide: MAT_ERROR,
93
+ useExisting: MatError
94
+ }]
95
+ }]
96
+ }],
97
+ ctorParameters: () => [],
98
+ propDecorators: {
99
+ id: [{
100
+ type: Input
101
+ }]
102
+ }
103
+ });
51
104
 
52
- /** Hint text to be shown underneath the form field control. */
53
105
  class MatHint {
54
- /** Whether to align the hint label at the start or end of the line. */
55
- align = 'start';
56
- /** Unique ID for the hint. Used for the aria-describedby on the form field control. */
57
- id = inject(_IdGenerator).getId('mat-mdc-hint-');
58
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatHint, deps: [], target: i0.ɵɵFactoryTarget.Directive });
59
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0-next.2", type: MatHint, isStandalone: true, selector: "mat-hint", inputs: { align: "align", id: "id" }, host: { properties: { "class.mat-mdc-form-field-hint-end": "align === \"end\"", "id": "id", "attr.align": "null" }, classAttribute: "mat-mdc-form-field-hint mat-mdc-form-field-bottom-align" }, ngImport: i0 });
106
+ align = 'start';
107
+ id = inject(_IdGenerator).getId('mat-mdc-hint-');
108
+ static ɵfac = i0.ɵɵngDeclareFactory({
109
+ minVersion: "12.0.0",
110
+ version: "20.2.0-next.2",
111
+ ngImport: i0,
112
+ type: MatHint,
113
+ deps: [],
114
+ target: i0.ɵɵFactoryTarget.Directive
115
+ });
116
+ static ɵdir = i0.ɵɵngDeclareDirective({
117
+ minVersion: "14.0.0",
118
+ version: "20.2.0-next.2",
119
+ type: MatHint,
120
+ isStandalone: true,
121
+ selector: "mat-hint",
122
+ inputs: {
123
+ align: "align",
124
+ id: "id"
125
+ },
126
+ host: {
127
+ properties: {
128
+ "class.mat-mdc-form-field-hint-end": "align === \"end\"",
129
+ "id": "id",
130
+ "attr.align": "null"
131
+ },
132
+ classAttribute: "mat-mdc-form-field-hint mat-mdc-form-field-bottom-align"
133
+ },
134
+ ngImport: i0
135
+ });
60
136
  }
61
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatHint, decorators: [{
62
- type: Directive,
63
- args: [{
64
- selector: 'mat-hint',
65
- host: {
66
- 'class': 'mat-mdc-form-field-hint mat-mdc-form-field-bottom-align',
67
- '[class.mat-mdc-form-field-hint-end]': 'align === "end"',
68
- '[id]': 'id',
69
- // Remove align attribute to prevent it from interfering with layout.
70
- '[attr.align]': 'null',
71
- },
72
- }]
73
- }], propDecorators: { align: [{
74
- type: Input
75
- }], id: [{
76
- type: Input
77
- }] } });
137
+ i0.ɵɵngDeclareClassMetadata({
138
+ minVersion: "12.0.0",
139
+ version: "20.2.0-next.2",
140
+ ngImport: i0,
141
+ type: MatHint,
142
+ decorators: [{
143
+ type: Directive,
144
+ args: [{
145
+ selector: 'mat-hint',
146
+ host: {
147
+ 'class': 'mat-mdc-form-field-hint mat-mdc-form-field-bottom-align',
148
+ '[class.mat-mdc-form-field-hint-end]': 'align === "end"',
149
+ '[id]': 'id',
150
+ '[attr.align]': 'null'
151
+ }
152
+ }]
153
+ }],
154
+ propDecorators: {
155
+ align: [{
156
+ type: Input
157
+ }],
158
+ id: [{
159
+ type: Input
160
+ }]
161
+ }
162
+ });
78
163
 
79
- /**
80
- * Injection token that can be used to reference instances of `MatPrefix`. It serves as
81
- * alternative token to the actual `MatPrefix` class which could cause unnecessary
82
- * retention of the class and its directive metadata.
83
- */
84
164
  const MAT_PREFIX = new InjectionToken('MatPrefix');
85
- /** Prefix to be placed in front of the form field. */
86
165
  class MatPrefix {
87
- set _isTextSelector(value) {
88
- this._isText = true;
89
- }
90
- _isText = false;
91
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatPrefix, deps: [], target: i0.ɵɵFactoryTarget.Directive });
92
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0-next.2", type: MatPrefix, isStandalone: true, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: { _isTextSelector: ["matTextPrefix", "_isTextSelector"] }, providers: [{ provide: MAT_PREFIX, useExisting: MatPrefix }], ngImport: i0 });
166
+ set _isTextSelector(value) {
167
+ this._isText = true;
168
+ }
169
+ _isText = false;
170
+ static ɵfac = i0.ɵɵngDeclareFactory({
171
+ minVersion: "12.0.0",
172
+ version: "20.2.0-next.2",
173
+ ngImport: i0,
174
+ type: MatPrefix,
175
+ deps: [],
176
+ target: i0.ɵɵFactoryTarget.Directive
177
+ });
178
+ static ɵdir = i0.ɵɵngDeclareDirective({
179
+ minVersion: "14.0.0",
180
+ version: "20.2.0-next.2",
181
+ type: MatPrefix,
182
+ isStandalone: true,
183
+ selector: "[matPrefix], [matIconPrefix], [matTextPrefix]",
184
+ inputs: {
185
+ _isTextSelector: ["matTextPrefix", "_isTextSelector"]
186
+ },
187
+ providers: [{
188
+ provide: MAT_PREFIX,
189
+ useExisting: MatPrefix
190
+ }],
191
+ ngImport: i0
192
+ });
93
193
  }
94
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatPrefix, decorators: [{
95
- type: Directive,
96
- args: [{
97
- selector: '[matPrefix], [matIconPrefix], [matTextPrefix]',
98
- providers: [{ provide: MAT_PREFIX, useExisting: MatPrefix }],
99
- }]
100
- }], propDecorators: { _isTextSelector: [{
101
- type: Input,
102
- args: ['matTextPrefix']
103
- }] } });
194
+ i0.ɵɵngDeclareClassMetadata({
195
+ minVersion: "12.0.0",
196
+ version: "20.2.0-next.2",
197
+ ngImport: i0,
198
+ type: MatPrefix,
199
+ decorators: [{
200
+ type: Directive,
201
+ args: [{
202
+ selector: '[matPrefix], [matIconPrefix], [matTextPrefix]',
203
+ providers: [{
204
+ provide: MAT_PREFIX,
205
+ useExisting: MatPrefix
206
+ }]
207
+ }]
208
+ }],
209
+ propDecorators: {
210
+ _isTextSelector: [{
211
+ type: Input,
212
+ args: ['matTextPrefix']
213
+ }]
214
+ }
215
+ });
104
216
 
105
- /**
106
- * Injection token that can be used to reference instances of `MatSuffix`. It serves as
107
- * alternative token to the actual `MatSuffix` class which could cause unnecessary
108
- * retention of the class and its directive metadata.
109
- */
110
217
  const MAT_SUFFIX = new InjectionToken('MatSuffix');
111
- /** Suffix to be placed at the end of the form field. */
112
218
  class MatSuffix {
113
- set _isTextSelector(value) {
114
- this._isText = true;
115
- }
116
- _isText = false;
117
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatSuffix, deps: [], target: i0.ɵɵFactoryTarget.Directive });
118
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0-next.2", type: MatSuffix, isStandalone: true, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: { _isTextSelector: ["matTextSuffix", "_isTextSelector"] }, providers: [{ provide: MAT_SUFFIX, useExisting: MatSuffix }], ngImport: i0 });
219
+ set _isTextSelector(value) {
220
+ this._isText = true;
221
+ }
222
+ _isText = false;
223
+ static ɵfac = i0.ɵɵngDeclareFactory({
224
+ minVersion: "12.0.0",
225
+ version: "20.2.0-next.2",
226
+ ngImport: i0,
227
+ type: MatSuffix,
228
+ deps: [],
229
+ target: i0.ɵɵFactoryTarget.Directive
230
+ });
231
+ static ɵdir = i0.ɵɵngDeclareDirective({
232
+ minVersion: "14.0.0",
233
+ version: "20.2.0-next.2",
234
+ type: MatSuffix,
235
+ isStandalone: true,
236
+ selector: "[matSuffix], [matIconSuffix], [matTextSuffix]",
237
+ inputs: {
238
+ _isTextSelector: ["matTextSuffix", "_isTextSelector"]
239
+ },
240
+ providers: [{
241
+ provide: MAT_SUFFIX,
242
+ useExisting: MatSuffix
243
+ }],
244
+ ngImport: i0
245
+ });
119
246
  }
120
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatSuffix, decorators: [{
121
- type: Directive,
122
- args: [{
123
- selector: '[matSuffix], [matIconSuffix], [matTextSuffix]',
124
- providers: [{ provide: MAT_SUFFIX, useExisting: MatSuffix }],
125
- }]
126
- }], propDecorators: { _isTextSelector: [{
127
- type: Input,
128
- args: ['matTextSuffix']
129
- }] } });
247
+ i0.ɵɵngDeclareClassMetadata({
248
+ minVersion: "12.0.0",
249
+ version: "20.2.0-next.2",
250
+ ngImport: i0,
251
+ type: MatSuffix,
252
+ decorators: [{
253
+ type: Directive,
254
+ args: [{
255
+ selector: '[matSuffix], [matIconSuffix], [matTextSuffix]',
256
+ providers: [{
257
+ provide: MAT_SUFFIX,
258
+ useExisting: MatSuffix
259
+ }]
260
+ }]
261
+ }],
262
+ propDecorators: {
263
+ _isTextSelector: [{
264
+ type: Input,
265
+ args: ['matTextSuffix']
266
+ }]
267
+ }
268
+ });
130
269
 
131
- /** An injion token for the parent form-field. */
132
270
  const FLOATING_LABEL_PARENT = new InjectionToken('FloatingLabelParent');
133
- /**
134
- * Internal directive that maintains a MDC floating label. This directive does not
135
- * use the `MDCFloatingLabelFoundation` class, as it is not worth the size cost of
136
- * including it just to measure the label width and toggle some classes.
137
- *
138
- * The use of a directive allows us to conditionally render a floating label in the
139
- * template without having to manually manage instantiation and destruction of the
140
- * floating label component based on.
141
- *
142
- * The component is responsible for setting up the floating label styles, measuring label
143
- * width for the outline notch, and providing inputs that can be used to toggle the
144
- * label's floating or required state.
145
- */
146
271
  class MatFormFieldFloatingLabel {
147
- _elementRef = inject(ElementRef);
148
- /** Whether the label is floating. */
149
- get floating() {
150
- return this._floating;
151
- }
152
- set floating(value) {
153
- this._floating = value;
154
- if (this.monitorResize) {
155
- this._handleResize();
156
- }
157
- }
158
- _floating = false;
159
- /** Whether to monitor for resize events on the floating label. */
160
- get monitorResize() {
161
- return this._monitorResize;
162
- }
163
- set monitorResize(value) {
164
- this._monitorResize = value;
165
- if (this._monitorResize) {
166
- this._subscribeToResize();
167
- }
168
- else {
169
- this._resizeSubscription.unsubscribe();
170
- }
171
- }
172
- _monitorResize = false;
173
- /** The shared ResizeObserver. */
174
- _resizeObserver = inject(SharedResizeObserver);
175
- /** The Angular zone. */
176
- _ngZone = inject(NgZone);
177
- /** The parent form-field. */
178
- _parent = inject(FLOATING_LABEL_PARENT);
179
- /** The current resize event subscription. */
180
- _resizeSubscription = new Subscription();
181
- constructor() { }
182
- ngOnDestroy() {
183
- this._resizeSubscription.unsubscribe();
184
- }
185
- /** Gets the width of the label. Used for the outline notch. */
186
- getWidth() {
187
- return estimateScrollWidth(this._elementRef.nativeElement);
272
+ _elementRef = inject(ElementRef);
273
+ get floating() {
274
+ return this._floating;
275
+ }
276
+ set floating(value) {
277
+ this._floating = value;
278
+ if (this.monitorResize) {
279
+ this._handleResize();
188
280
  }
189
- /** Gets the HTML element for the floating label. */
190
- get element() {
191
- return this._elementRef.nativeElement;
281
+ }
282
+ _floating = false;
283
+ get monitorResize() {
284
+ return this._monitorResize;
285
+ }
286
+ set monitorResize(value) {
287
+ this._monitorResize = value;
288
+ if (this._monitorResize) {
289
+ this._subscribeToResize();
290
+ } else {
291
+ this._resizeSubscription.unsubscribe();
192
292
  }
193
- /** Handles resize events from the ResizeObserver. */
194
- _handleResize() {
195
- // In the case where the label grows in size, the following sequence of events occurs:
196
- // 1. The label grows by 1px triggering the ResizeObserver
197
- // 2. The notch is expanded to accommodate the entire label
198
- // 3. The label expands to its full width, triggering the ResizeObserver again
199
- //
200
- // This is expected, but If we allow this to all happen within the same macro task it causes an
201
- // error: `ResizeObserver loop limit exceeded`. Therefore we push the notch resize out until
202
- // the next macro task.
203
- setTimeout(() => this._parent._handleLabelResized());
204
- }
205
- /** Subscribes to resize events. */
206
- _subscribeToResize() {
207
- this._resizeSubscription.unsubscribe();
208
- this._ngZone.runOutsideAngular(() => {
209
- this._resizeSubscription = this._resizeObserver
210
- .observe(this._elementRef.nativeElement, { box: 'border-box' })
211
- .subscribe(() => this._handleResize());
212
- });
213
- }
214
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormFieldFloatingLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
215
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0-next.2", type: MatFormFieldFloatingLabel, isStandalone: true, selector: "label[matFormFieldFloatingLabel]", inputs: { floating: "floating", monitorResize: "monitorResize" }, host: { properties: { "class.mdc-floating-label--float-above": "floating" }, classAttribute: "mdc-floating-label mat-mdc-floating-label" }, ngImport: i0 });
293
+ }
294
+ _monitorResize = false;
295
+ _resizeObserver = inject(SharedResizeObserver);
296
+ _ngZone = inject(NgZone);
297
+ _parent = inject(FLOATING_LABEL_PARENT);
298
+ _resizeSubscription = new Subscription();
299
+ constructor() {}
300
+ ngOnDestroy() {
301
+ this._resizeSubscription.unsubscribe();
302
+ }
303
+ getWidth() {
304
+ return estimateScrollWidth(this._elementRef.nativeElement);
305
+ }
306
+ get element() {
307
+ return this._elementRef.nativeElement;
308
+ }
309
+ _handleResize() {
310
+ setTimeout(() => this._parent._handleLabelResized());
311
+ }
312
+ _subscribeToResize() {
313
+ this._resizeSubscription.unsubscribe();
314
+ this._ngZone.runOutsideAngular(() => {
315
+ this._resizeSubscription = this._resizeObserver.observe(this._elementRef.nativeElement, {
316
+ box: 'border-box'
317
+ }).subscribe(() => this._handleResize());
318
+ });
319
+ }
320
+ static ɵfac = i0.ɵɵngDeclareFactory({
321
+ minVersion: "12.0.0",
322
+ version: "20.2.0-next.2",
323
+ ngImport: i0,
324
+ type: MatFormFieldFloatingLabel,
325
+ deps: [],
326
+ target: i0.ɵɵFactoryTarget.Directive
327
+ });
328
+ static ɵdir = i0.ɵɵngDeclareDirective({
329
+ minVersion: "14.0.0",
330
+ version: "20.2.0-next.2",
331
+ type: MatFormFieldFloatingLabel,
332
+ isStandalone: true,
333
+ selector: "label[matFormFieldFloatingLabel]",
334
+ inputs: {
335
+ floating: "floating",
336
+ monitorResize: "monitorResize"
337
+ },
338
+ host: {
339
+ properties: {
340
+ "class.mdc-floating-label--float-above": "floating"
341
+ },
342
+ classAttribute: "mdc-floating-label mat-mdc-floating-label"
343
+ },
344
+ ngImport: i0
345
+ });
216
346
  }
217
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormFieldFloatingLabel, decorators: [{
218
- type: Directive,
219
- args: [{
220
- selector: 'label[matFormFieldFloatingLabel]',
221
- host: {
222
- 'class': 'mdc-floating-label mat-mdc-floating-label',
223
- '[class.mdc-floating-label--float-above]': 'floating',
224
- },
225
- }]
226
- }], ctorParameters: () => [], propDecorators: { floating: [{
227
- type: Input
228
- }], monitorResize: [{
229
- type: Input
230
- }] } });
231
- /**
232
- * Estimates the scroll width of an element.
233
- * via https://github.com/material-components/material-components-web/blob/c0a11ef0d000a098fd0c372be8f12d6a99302855/packages/mdc-dom/ponyfill.ts
234
- */
347
+ i0.ɵɵngDeclareClassMetadata({
348
+ minVersion: "12.0.0",
349
+ version: "20.2.0-next.2",
350
+ ngImport: i0,
351
+ type: MatFormFieldFloatingLabel,
352
+ decorators: [{
353
+ type: Directive,
354
+ args: [{
355
+ selector: 'label[matFormFieldFloatingLabel]',
356
+ host: {
357
+ 'class': 'mdc-floating-label mat-mdc-floating-label',
358
+ '[class.mdc-floating-label--float-above]': 'floating'
359
+ }
360
+ }]
361
+ }],
362
+ ctorParameters: () => [],
363
+ propDecorators: {
364
+ floating: [{
365
+ type: Input
366
+ }],
367
+ monitorResize: [{
368
+ type: Input
369
+ }]
370
+ }
371
+ });
235
372
  function estimateScrollWidth(element) {
236
- // Check the offsetParent. If the element inherits display: none from any
237
- // parent, the offsetParent property will be null (see
238
- // https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetParent).
239
- // This check ensures we only clone the node when necessary.
240
- const htmlEl = element;
241
- if (htmlEl.offsetParent !== null) {
242
- return htmlEl.scrollWidth;
243
- }
244
- const clone = htmlEl.cloneNode(true);
245
- clone.style.setProperty('position', 'absolute');
246
- clone.style.setProperty('transform', 'translate(-9999px, -9999px)');
247
- document.documentElement.appendChild(clone);
248
- const scrollWidth = clone.scrollWidth;
249
- clone.remove();
250
- return scrollWidth;
373
+ const htmlEl = element;
374
+ if (htmlEl.offsetParent !== null) {
375
+ return htmlEl.scrollWidth;
376
+ }
377
+ const clone = htmlEl.cloneNode(true);
378
+ clone.style.setProperty('position', 'absolute');
379
+ clone.style.setProperty('transform', 'translate(-9999px, -9999px)');
380
+ document.documentElement.appendChild(clone);
381
+ const scrollWidth = clone.scrollWidth;
382
+ clone.remove();
383
+ return scrollWidth;
251
384
  }
252
385
 
253
- /** Class added when the line ripple is active. */
254
386
  const ACTIVATE_CLASS = 'mdc-line-ripple--active';
255
- /** Class added when the line ripple is being deactivated. */
256
387
  const DEACTIVATING_CLASS = 'mdc-line-ripple--deactivating';
257
- /**
258
- * Internal directive that creates an instance of the MDC line-ripple component. Using a
259
- * directive allows us to conditionally render a line-ripple in the template without having
260
- * to manually create and destroy the `MDCLineRipple` component whenever the condition changes.
261
- *
262
- * The directive sets up the styles for the line-ripple and provides an API for activating
263
- * and deactivating the line-ripple.
264
- */
265
388
  class MatFormFieldLineRipple {
266
- _elementRef = inject(ElementRef);
267
- _cleanupTransitionEnd;
268
- constructor() {
269
- const ngZone = inject(NgZone);
270
- const renderer = inject(Renderer2);
271
- ngZone.runOutsideAngular(() => {
272
- this._cleanupTransitionEnd = renderer.listen(this._elementRef.nativeElement, 'transitionend', this._handleTransitionEnd);
273
- });
274
- }
275
- activate() {
276
- const classList = this._elementRef.nativeElement.classList;
277
- classList.remove(DEACTIVATING_CLASS);
278
- classList.add(ACTIVATE_CLASS);
279
- }
280
- deactivate() {
281
- this._elementRef.nativeElement.classList.add(DEACTIVATING_CLASS);
282
- }
283
- _handleTransitionEnd = (event) => {
284
- const classList = this._elementRef.nativeElement.classList;
285
- const isDeactivating = classList.contains(DEACTIVATING_CLASS);
286
- if (event.propertyName === 'opacity' && isDeactivating) {
287
- classList.remove(ACTIVATE_CLASS, DEACTIVATING_CLASS);
288
- }
289
- };
290
- ngOnDestroy() {
291
- this._cleanupTransitionEnd();
389
+ _elementRef = inject(ElementRef);
390
+ _cleanupTransitionEnd;
391
+ constructor() {
392
+ const ngZone = inject(NgZone);
393
+ const renderer = inject(Renderer2);
394
+ ngZone.runOutsideAngular(() => {
395
+ this._cleanupTransitionEnd = renderer.listen(this._elementRef.nativeElement, 'transitionend', this._handleTransitionEnd);
396
+ });
397
+ }
398
+ activate() {
399
+ const classList = this._elementRef.nativeElement.classList;
400
+ classList.remove(DEACTIVATING_CLASS);
401
+ classList.add(ACTIVATE_CLASS);
402
+ }
403
+ deactivate() {
404
+ this._elementRef.nativeElement.classList.add(DEACTIVATING_CLASS);
405
+ }
406
+ _handleTransitionEnd = event => {
407
+ const classList = this._elementRef.nativeElement.classList;
408
+ const isDeactivating = classList.contains(DEACTIVATING_CLASS);
409
+ if (event.propertyName === 'opacity' && isDeactivating) {
410
+ classList.remove(ACTIVATE_CLASS, DEACTIVATING_CLASS);
292
411
  }
293
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormFieldLineRipple, deps: [], target: i0.ɵɵFactoryTarget.Directive });
294
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0-next.2", type: MatFormFieldLineRipple, isStandalone: true, selector: "div[matFormFieldLineRipple]", host: { classAttribute: "mdc-line-ripple" }, ngImport: i0 });
412
+ };
413
+ ngOnDestroy() {
414
+ this._cleanupTransitionEnd();
415
+ }
416
+ static ɵfac = i0.ɵɵngDeclareFactory({
417
+ minVersion: "12.0.0",
418
+ version: "20.2.0-next.2",
419
+ ngImport: i0,
420
+ type: MatFormFieldLineRipple,
421
+ deps: [],
422
+ target: i0.ɵɵFactoryTarget.Directive
423
+ });
424
+ static ɵdir = i0.ɵɵngDeclareDirective({
425
+ minVersion: "14.0.0",
426
+ version: "20.2.0-next.2",
427
+ type: MatFormFieldLineRipple,
428
+ isStandalone: true,
429
+ selector: "div[matFormFieldLineRipple]",
430
+ host: {
431
+ classAttribute: "mdc-line-ripple"
432
+ },
433
+ ngImport: i0
434
+ });
295
435
  }
296
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormFieldLineRipple, decorators: [{
297
- type: Directive,
298
- args: [{
299
- selector: 'div[matFormFieldLineRipple]',
300
- host: {
301
- 'class': 'mdc-line-ripple',
302
- },
303
- }]
304
- }], ctorParameters: () => [] });
436
+ i0.ɵɵngDeclareClassMetadata({
437
+ minVersion: "12.0.0",
438
+ version: "20.2.0-next.2",
439
+ ngImport: i0,
440
+ type: MatFormFieldLineRipple,
441
+ decorators: [{
442
+ type: Directive,
443
+ args: [{
444
+ selector: 'div[matFormFieldLineRipple]',
445
+ host: {
446
+ 'class': 'mdc-line-ripple'
447
+ }
448
+ }]
449
+ }],
450
+ ctorParameters: () => []
451
+ });
305
452
 
306
- /**
307
- * Internal component that creates an instance of the MDC notched-outline component.
308
- *
309
- * The component sets up the HTML structure and styles for the notched-outline. It provides
310
- * inputs to toggle the notch state and width.
311
- */
312
453
  class MatFormFieldNotchedOutline {
313
- _elementRef = inject(ElementRef);
314
- _ngZone = inject(NgZone);
315
- /** Whether the notch should be opened. */
316
- open = false;
317
- _notch;
318
- ngAfterViewInit() {
319
- const element = this._elementRef.nativeElement;
320
- const label = element.querySelector('.mdc-floating-label');
321
- if (label) {
322
- element.classList.add('mdc-notched-outline--upgraded');
323
- if (typeof requestAnimationFrame === 'function') {
324
- label.style.transitionDuration = '0s';
325
- this._ngZone.runOutsideAngular(() => {
326
- requestAnimationFrame(() => (label.style.transitionDuration = ''));
327
- });
328
- }
329
- }
330
- else {
331
- element.classList.add('mdc-notched-outline--no-label');
332
- }
333
- }
334
- _setNotchWidth(labelWidth) {
335
- const notch = this._notch.nativeElement;
336
- if (!this.open || !labelWidth) {
337
- notch.style.width = '';
338
- }
339
- else {
340
- const NOTCH_ELEMENT_PADDING = 8;
341
- const NOTCH_ELEMENT_BORDER = 1;
342
- notch.style.width = `calc(${labelWidth}px * var(--mat-mdc-form-field-floating-label-scale, 0.75) + ${NOTCH_ELEMENT_PADDING + NOTCH_ELEMENT_BORDER}px)`;
343
- }
454
+ _elementRef = inject(ElementRef);
455
+ _ngZone = inject(NgZone);
456
+ open = false;
457
+ _notch;
458
+ ngAfterViewInit() {
459
+ const element = this._elementRef.nativeElement;
460
+ const label = element.querySelector('.mdc-floating-label');
461
+ if (label) {
462
+ element.classList.add('mdc-notched-outline--upgraded');
463
+ if (typeof requestAnimationFrame === 'function') {
464
+ label.style.transitionDuration = '0s';
465
+ this._ngZone.runOutsideAngular(() => {
466
+ requestAnimationFrame(() => label.style.transitionDuration = '');
467
+ });
468
+ }
469
+ } else {
470
+ element.classList.add('mdc-notched-outline--no-label');
344
471
  }
345
- _setMaxWidth(prefixAndSuffixWidth) {
346
- // Set this only on the notch to avoid style recalculations in other parts of the form field.
347
- this._notch.nativeElement.style.setProperty('--mat-form-field-notch-max-width', `calc(100% - ${prefixAndSuffixWidth}px)`);
472
+ }
473
+ _setNotchWidth(labelWidth) {
474
+ const notch = this._notch.nativeElement;
475
+ if (!this.open || !labelWidth) {
476
+ notch.style.width = '';
477
+ } else {
478
+ const NOTCH_ELEMENT_PADDING = 8;
479
+ const NOTCH_ELEMENT_BORDER = 1;
480
+ notch.style.width = `calc(${labelWidth}px * var(--mat-mdc-form-field-floating-label-scale, 0.75) + ${NOTCH_ELEMENT_PADDING + NOTCH_ELEMENT_BORDER}px)`;
348
481
  }
349
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormFieldNotchedOutline, deps: [], target: i0.ɵɵFactoryTarget.Component });
350
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0-next.2", type: MatFormFieldNotchedOutline, isStandalone: true, selector: "div[matFormFieldNotchedOutline]", inputs: { open: ["matFormFieldNotchedOutlineOpen", "open"] }, host: { properties: { "class.mdc-notched-outline--notched": "open" }, classAttribute: "mdc-notched-outline" }, viewQueries: [{ propertyName: "_notch", first: true, predicate: ["notch"], descendants: true }], ngImport: i0, template: "<div class=\"mat-mdc-notch-piece mdc-notched-outline__leading\"></div>\n<div class=\"mat-mdc-notch-piece mdc-notched-outline__notch\" #notch>\n <ng-content></ng-content>\n</div>\n<div class=\"mat-mdc-notch-piece mdc-notched-outline__trailing\"></div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
482
+ }
483
+ _setMaxWidth(prefixAndSuffixWidth) {
484
+ this._notch.nativeElement.style.setProperty('--mat-form-field-notch-max-width', `calc(100% - ${prefixAndSuffixWidth}px)`);
485
+ }
486
+ static ɵfac = i0.ɵɵngDeclareFactory({
487
+ minVersion: "12.0.0",
488
+ version: "20.2.0-next.2",
489
+ ngImport: i0,
490
+ type: MatFormFieldNotchedOutline,
491
+ deps: [],
492
+ target: i0.ɵɵFactoryTarget.Component
493
+ });
494
+ static ɵcmp = i0.ɵɵngDeclareComponent({
495
+ minVersion: "14.0.0",
496
+ version: "20.2.0-next.2",
497
+ type: MatFormFieldNotchedOutline,
498
+ isStandalone: true,
499
+ selector: "div[matFormFieldNotchedOutline]",
500
+ inputs: {
501
+ open: ["matFormFieldNotchedOutlineOpen", "open"]
502
+ },
503
+ host: {
504
+ properties: {
505
+ "class.mdc-notched-outline--notched": "open"
506
+ },
507
+ classAttribute: "mdc-notched-outline"
508
+ },
509
+ viewQueries: [{
510
+ propertyName: "_notch",
511
+ first: true,
512
+ predicate: ["notch"],
513
+ descendants: true
514
+ }],
515
+ ngImport: i0,
516
+ template: "<div class=\"mat-mdc-notch-piece mdc-notched-outline__leading\"></div>\n<div class=\"mat-mdc-notch-piece mdc-notched-outline__notch\" #notch>\n <ng-content></ng-content>\n</div>\n<div class=\"mat-mdc-notch-piece mdc-notched-outline__trailing\"></div>\n",
517
+ changeDetection: i0.ChangeDetectionStrategy.OnPush,
518
+ encapsulation: i0.ViewEncapsulation.None
519
+ });
351
520
  }
352
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormFieldNotchedOutline, decorators: [{
353
- type: Component,
354
- args: [{ selector: 'div[matFormFieldNotchedOutline]', host: {
355
- 'class': 'mdc-notched-outline',
356
- // Besides updating the notch state through the MDC component, we toggle this class through
357
- // a host binding in order to ensure that the notched-outline renders correctly on the server.
358
- '[class.mdc-notched-outline--notched]': 'open',
359
- }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"mat-mdc-notch-piece mdc-notched-outline__leading\"></div>\n<div class=\"mat-mdc-notch-piece mdc-notched-outline__notch\" #notch>\n <ng-content></ng-content>\n</div>\n<div class=\"mat-mdc-notch-piece mdc-notched-outline__trailing\"></div>\n" }]
360
- }], propDecorators: { open: [{
361
- type: Input,
362
- args: ['matFormFieldNotchedOutlineOpen']
363
- }], _notch: [{
364
- type: ViewChild,
365
- args: ['notch']
366
- }] } });
521
+ i0.ɵɵngDeclareClassMetadata({
522
+ minVersion: "12.0.0",
523
+ version: "20.2.0-next.2",
524
+ ngImport: i0,
525
+ type: MatFormFieldNotchedOutline,
526
+ decorators: [{
527
+ type: Component,
528
+ args: [{
529
+ selector: 'div[matFormFieldNotchedOutline]',
530
+ host: {
531
+ 'class': 'mdc-notched-outline',
532
+ '[class.mdc-notched-outline--notched]': 'open'
533
+ },
534
+ changeDetection: ChangeDetectionStrategy.OnPush,
535
+ encapsulation: ViewEncapsulation.None,
536
+ template: "<div class=\"mat-mdc-notch-piece mdc-notched-outline__leading\"></div>\n<div class=\"mat-mdc-notch-piece mdc-notched-outline__notch\" #notch>\n <ng-content></ng-content>\n</div>\n<div class=\"mat-mdc-notch-piece mdc-notched-outline__trailing\"></div>\n"
537
+ }]
538
+ }],
539
+ propDecorators: {
540
+ open: [{
541
+ type: Input,
542
+ args: ['matFormFieldNotchedOutlineOpen']
543
+ }],
544
+ _notch: [{
545
+ type: ViewChild,
546
+ args: ['notch']
547
+ }]
548
+ }
549
+ });
367
550
 
368
- /** An interface which allows a control to work inside of a `MatFormField`. */
369
551
  class MatFormFieldControl {
370
- /** The value of the control. */
371
- value;
372
- /**
373
- * Stream that emits whenever the state of the control changes such that the parent `MatFormField`
374
- * needs to run change detection.
375
- */
376
- stateChanges;
377
- /** The element ID for this control. */
378
- id;
379
- /** The placeholder for this control. */
380
- placeholder;
381
- /** Gets the AbstractControlDirective for this control. */
382
- ngControl;
383
- /** Whether the control is focused. */
384
- focused;
385
- /** Whether the control is empty. */
386
- empty;
387
- /** Whether the `MatFormField` label should try to float. */
388
- shouldLabelFloat;
389
- /** Whether the control is required. */
390
- required;
391
- /** Whether the control is disabled. */
392
- disabled;
393
- /** Whether the control is in an error state. */
394
- errorState;
395
- /**
396
- * An optional name for the control type that can be used to distinguish `mat-form-field` elements
397
- * based on their control type. The form field will add a class,
398
- * `mat-form-field-type-{{controlType}}` to its root element.
399
- */
400
- controlType;
401
- /**
402
- * Whether the input is currently in an autofilled state. If property is not present on the
403
- * control it is assumed to be false.
404
- */
405
- autofilled;
406
- /**
407
- * Value of `aria-describedby` that should be merged with the described-by ids
408
- * which are set by the form-field.
409
- */
410
- userAriaDescribedBy;
411
- /**
412
- * Whether to automatically assign the ID of the form field as the `for` attribute
413
- * on the `<label>` inside the form field. Set this to true to prevent the form
414
- * field from associating the label with non-native elements.
415
- */
416
- disableAutomaticLabeling;
417
- /** Gets the list of element IDs that currently describe this control. */
418
- describedByIds;
419
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormFieldControl, deps: [], target: i0.ɵɵFactoryTarget.Directive });
420
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0-next.2", type: MatFormFieldControl, isStandalone: true, ngImport: i0 });
552
+ value;
553
+ stateChanges;
554
+ id;
555
+ placeholder;
556
+ ngControl;
557
+ focused;
558
+ empty;
559
+ shouldLabelFloat;
560
+ required;
561
+ disabled;
562
+ errorState;
563
+ controlType;
564
+ autofilled;
565
+ userAriaDescribedBy;
566
+ disableAutomaticLabeling;
567
+ describedByIds;
568
+ static ɵfac = i0.ɵɵngDeclareFactory({
569
+ minVersion: "12.0.0",
570
+ version: "20.2.0-next.2",
571
+ ngImport: i0,
572
+ type: MatFormFieldControl,
573
+ deps: [],
574
+ target: i0.ɵɵFactoryTarget.Directive
575
+ });
576
+ static ɵdir = i0.ɵɵngDeclareDirective({
577
+ minVersion: "14.0.0",
578
+ version: "20.2.0-next.2",
579
+ type: MatFormFieldControl,
580
+ isStandalone: true,
581
+ ngImport: i0
582
+ });
421
583
  }
422
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormFieldControl, decorators: [{
423
- type: Directive
424
- }] });
584
+ i0.ɵɵngDeclareClassMetadata({
585
+ minVersion: "12.0.0",
586
+ version: "20.2.0-next.2",
587
+ ngImport: i0,
588
+ type: MatFormFieldControl,
589
+ decorators: [{
590
+ type: Directive
591
+ }]
592
+ });
425
593
 
426
- /** @docs-private */
427
594
  function getMatFormFieldPlaceholderConflictError() {
428
- return Error('Placeholder attribute and child element were both specified.');
595
+ return Error('Placeholder attribute and child element were both specified.');
429
596
  }
430
- /** @docs-private */
431
597
  function getMatFormFieldDuplicatedHintError(align) {
432
- return Error(`A hint was already declared for 'align="${align}"'.`);
598
+ return Error(`A hint was already declared for 'align="${align}"'.`);
433
599
  }
434
- /** @docs-private */
435
600
  function getMatFormFieldMissingControlError() {
436
- return Error('mat-form-field must contain a MatFormFieldControl.');
601
+ return Error('mat-form-field must contain a MatFormFieldControl.');
437
602
  }
438
603
 
439
- /**
440
- * Injection token that can be used to inject an instances of `MatFormField`. It serves
441
- * as alternative token to the actual `MatFormField` class which would cause unnecessary
442
- * retention of the `MatFormField` class and its component metadata.
443
- */
444
604
  const MAT_FORM_FIELD = new InjectionToken('MatFormField');
445
- /**
446
- * Injection token that can be used to configure the
447
- * default options for all form field within an app.
448
- */
449
605
  const MAT_FORM_FIELD_DEFAULT_OPTIONS = new InjectionToken('MAT_FORM_FIELD_DEFAULT_OPTIONS');
450
- /** Default appearance used by the form field. */
451
606
  const DEFAULT_APPEARANCE = 'fill';
452
- /**
453
- * Whether the label for form fields should by default float `always`,
454
- * `never`, or `auto`.
455
- */
456
607
  const DEFAULT_FLOAT_LABEL = 'auto';
457
- /** Default way that the subscript element height is set. */
458
608
  const DEFAULT_SUBSCRIPT_SIZING = 'fixed';
459
- /**
460
- * Default transform for docked floating labels in a MDC text-field. This value has been
461
- * extracted from the MDC text-field styles because we programmatically modify the docked
462
- * label transform, but do not want to accidentally discard the default label transform.
463
- */
464
609
  const FLOATING_LABEL_DEFAULT_DOCKED_TRANSFORM = `translateY(-50%)`;
465
- /** Container for form controls that applies Material Design styling and behavior. */
466
610
  class MatFormField {
467
- _elementRef = inject(ElementRef);
468
- _changeDetectorRef = inject(ChangeDetectorRef);
469
- _platform = inject(Platform);
470
- _idGenerator = inject(_IdGenerator);
471
- _ngZone = inject(NgZone);
472
- _defaults = inject(MAT_FORM_FIELD_DEFAULT_OPTIONS, {
473
- optional: true,
474
- });
475
- _currentDirection;
476
- _textField;
477
- _iconPrefixContainer;
478
- _textPrefixContainer;
479
- _iconSuffixContainer;
480
- _textSuffixContainer;
481
- _floatingLabel;
482
- _notchedOutline;
483
- _lineRipple;
484
- _iconPrefixContainerSignal = viewChild('iconPrefixContainer', ...(ngDevMode ? [{ debugName: "_iconPrefixContainerSignal" }] : []));
485
- _textPrefixContainerSignal = viewChild('textPrefixContainer', ...(ngDevMode ? [{ debugName: "_textPrefixContainerSignal" }] : []));
486
- _iconSuffixContainerSignal = viewChild('iconSuffixContainer', ...(ngDevMode ? [{ debugName: "_iconSuffixContainerSignal" }] : []));
487
- _textSuffixContainerSignal = viewChild('textSuffixContainer', ...(ngDevMode ? [{ debugName: "_textSuffixContainerSignal" }] : []));
488
- _prefixSuffixContainers = computed(() => {
489
- return [
490
- this._iconPrefixContainerSignal(),
491
- this._textPrefixContainerSignal(),
492
- this._iconSuffixContainerSignal(),
493
- this._textSuffixContainerSignal(),
494
- ]
495
- .map(container => container?.nativeElement)
496
- .filter(e => e !== undefined);
497
- }, ...(ngDevMode ? [{ debugName: "_prefixSuffixContainers" }] : []));
498
- _formFieldControl;
499
- _prefixChildren;
500
- _suffixChildren;
501
- _errorChildren;
502
- _hintChildren;
503
- _labelChild = contentChild(MatLabel, ...(ngDevMode ? [{ debugName: "_labelChild" }] : []));
504
- /** Whether the required marker should be hidden. */
505
- get hideRequiredMarker() {
506
- return this._hideRequiredMarker;
611
+ _elementRef = inject(ElementRef);
612
+ _changeDetectorRef = inject(ChangeDetectorRef);
613
+ _platform = inject(Platform);
614
+ _idGenerator = inject(_IdGenerator);
615
+ _ngZone = inject(NgZone);
616
+ _defaults = inject(MAT_FORM_FIELD_DEFAULT_OPTIONS, {
617
+ optional: true
618
+ });
619
+ _currentDirection;
620
+ _textField;
621
+ _iconPrefixContainer;
622
+ _textPrefixContainer;
623
+ _iconSuffixContainer;
624
+ _textSuffixContainer;
625
+ _floatingLabel;
626
+ _notchedOutline;
627
+ _lineRipple;
628
+ _iconPrefixContainerSignal = viewChild('iconPrefixContainer', ...(ngDevMode ? [{
629
+ debugName: "_iconPrefixContainerSignal"
630
+ }] : []));
631
+ _textPrefixContainerSignal = viewChild('textPrefixContainer', ...(ngDevMode ? [{
632
+ debugName: "_textPrefixContainerSignal"
633
+ }] : []));
634
+ _iconSuffixContainerSignal = viewChild('iconSuffixContainer', ...(ngDevMode ? [{
635
+ debugName: "_iconSuffixContainerSignal"
636
+ }] : []));
637
+ _textSuffixContainerSignal = viewChild('textSuffixContainer', ...(ngDevMode ? [{
638
+ debugName: "_textSuffixContainerSignal"
639
+ }] : []));
640
+ _prefixSuffixContainers = computed(() => {
641
+ return [this._iconPrefixContainerSignal(), this._textPrefixContainerSignal(), this._iconSuffixContainerSignal(), this._textSuffixContainerSignal()].map(container => container?.nativeElement).filter(e => e !== undefined);
642
+ }, ...(ngDevMode ? [{
643
+ debugName: "_prefixSuffixContainers"
644
+ }] : []));
645
+ _formFieldControl;
646
+ _prefixChildren;
647
+ _suffixChildren;
648
+ _errorChildren;
649
+ _hintChildren;
650
+ _labelChild = contentChild(MatLabel, ...(ngDevMode ? [{
651
+ debugName: "_labelChild"
652
+ }] : []));
653
+ get hideRequiredMarker() {
654
+ return this._hideRequiredMarker;
655
+ }
656
+ set hideRequiredMarker(value) {
657
+ this._hideRequiredMarker = coerceBooleanProperty(value);
658
+ }
659
+ _hideRequiredMarker = false;
660
+ color = 'primary';
661
+ get floatLabel() {
662
+ return this._floatLabel || this._defaults?.floatLabel || DEFAULT_FLOAT_LABEL;
663
+ }
664
+ set floatLabel(value) {
665
+ if (value !== this._floatLabel) {
666
+ this._floatLabel = value;
667
+ this._changeDetectorRef.markForCheck();
507
668
  }
508
- set hideRequiredMarker(value) {
509
- this._hideRequiredMarker = coerceBooleanProperty(value);
669
+ }
670
+ _floatLabel;
671
+ get appearance() {
672
+ return this._appearanceSignal();
673
+ }
674
+ set appearance(value) {
675
+ const newAppearance = value || this._defaults?.appearance || DEFAULT_APPEARANCE;
676
+ if (typeof ngDevMode === 'undefined' || ngDevMode) {
677
+ if (newAppearance !== 'fill' && newAppearance !== 'outline') {
678
+ throw new Error(`MatFormField: Invalid appearance "${newAppearance}", valid values are "fill" or "outline".`);
679
+ }
510
680
  }
511
- _hideRequiredMarker = false;
512
- /**
513
- * Theme color of the form field. This API is supported in M2 themes only, it
514
- * has no effect in M3 themes. For color customization in M3, see https://material.angular.dev/components/form-field/styling.
515
- *
516
- * For information on applying color variants in M3, see
517
- * https://material.angular.dev/guide/material-2-theming#optional-add-backwards-compatibility-styles-for-color-variants
518
- */
519
- color = 'primary';
520
- /** Whether the label should always float or float as the user types. */
521
- get floatLabel() {
522
- return this._floatLabel || this._defaults?.floatLabel || DEFAULT_FLOAT_LABEL;
681
+ this._appearanceSignal.set(newAppearance);
682
+ }
683
+ _appearanceSignal = signal(DEFAULT_APPEARANCE, ...(ngDevMode ? [{
684
+ debugName: "_appearanceSignal"
685
+ }] : []));
686
+ get subscriptSizing() {
687
+ return this._subscriptSizing || this._defaults?.subscriptSizing || DEFAULT_SUBSCRIPT_SIZING;
688
+ }
689
+ set subscriptSizing(value) {
690
+ this._subscriptSizing = value || this._defaults?.subscriptSizing || DEFAULT_SUBSCRIPT_SIZING;
691
+ }
692
+ _subscriptSizing = null;
693
+ get hintLabel() {
694
+ return this._hintLabel;
695
+ }
696
+ set hintLabel(value) {
697
+ this._hintLabel = value;
698
+ this._processHints();
699
+ }
700
+ _hintLabel = '';
701
+ _hasIconPrefix = false;
702
+ _hasTextPrefix = false;
703
+ _hasIconSuffix = false;
704
+ _hasTextSuffix = false;
705
+ _labelId = this._idGenerator.getId('mat-mdc-form-field-label-');
706
+ _hintLabelId = this._idGenerator.getId('mat-mdc-hint-');
707
+ _describedByIds;
708
+ get _control() {
709
+ return this._explicitFormFieldControl || this._formFieldControl;
710
+ }
711
+ set _control(value) {
712
+ this._explicitFormFieldControl = value;
713
+ }
714
+ _destroyed = new Subject();
715
+ _isFocused = null;
716
+ _explicitFormFieldControl;
717
+ _previousControl = null;
718
+ _previousControlValidatorFn = null;
719
+ _stateChanges;
720
+ _valueChanges;
721
+ _describedByChanges;
722
+ _outlineLabelOffsetResizeObserver = null;
723
+ _animationsDisabled = _animationsDisabled();
724
+ constructor() {
725
+ const defaults = this._defaults;
726
+ const dir = inject(Directionality);
727
+ if (defaults) {
728
+ if (defaults.appearance) {
729
+ this.appearance = defaults.appearance;
730
+ }
731
+ this._hideRequiredMarker = Boolean(defaults?.hideRequiredMarker);
732
+ if (defaults.color) {
733
+ this.color = defaults.color;
734
+ }
523
735
  }
524
- set floatLabel(value) {
525
- if (value !== this._floatLabel) {
526
- this._floatLabel = value;
527
- // For backwards compatibility. Custom form field controls or directives might set
528
- // the "floatLabel" input and expect the form field view to be updated automatically.
529
- // e.g. autocomplete trigger. Ideally we'd get rid of this and the consumers would just
530
- // emit the "stateChanges" observable. TODO(devversion): consider removing.
531
- this._changeDetectorRef.markForCheck();
532
- }
736
+ effect(() => this._currentDirection = dir.valueSignal());
737
+ this._syncOutlineLabelOffset();
738
+ }
739
+ ngAfterViewInit() {
740
+ this._updateFocusState();
741
+ if (!this._animationsDisabled) {
742
+ this._ngZone.runOutsideAngular(() => {
743
+ setTimeout(() => {
744
+ this._elementRef.nativeElement.classList.add('mat-form-field-animations-enabled');
745
+ }, 300);
746
+ });
533
747
  }
534
- _floatLabel;
535
- /** The form field appearance style. */
536
- get appearance() {
537
- return this._appearanceSignal();
748
+ this._changeDetectorRef.detectChanges();
749
+ }
750
+ ngAfterContentInit() {
751
+ this._assertFormFieldControl();
752
+ this._initializeSubscript();
753
+ this._initializePrefixAndSuffix();
754
+ }
755
+ ngAfterContentChecked() {
756
+ this._assertFormFieldControl();
757
+ if (this._control !== this._previousControl) {
758
+ this._initializeControl(this._previousControl);
759
+ if (this._control.ngControl && this._control.ngControl.control) {
760
+ this._previousControlValidatorFn = this._control.ngControl.control.validator;
761
+ }
762
+ this._previousControl = this._control;
538
763
  }
539
- set appearance(value) {
540
- const newAppearance = value || this._defaults?.appearance || DEFAULT_APPEARANCE;
541
- if (typeof ngDevMode === 'undefined' || ngDevMode) {
542
- if (newAppearance !== 'fill' && newAppearance !== 'outline') {
543
- throw new Error(`MatFormField: Invalid appearance "${newAppearance}", valid values are "fill" or "outline".`);
544
- }
545
- }
546
- this._appearanceSignal.set(newAppearance);
764
+ if (this._control.ngControl && this._control.ngControl.control) {
765
+ const validatorFn = this._control.ngControl.control.validator;
766
+ if (validatorFn !== this._previousControlValidatorFn) {
767
+ this._changeDetectorRef.markForCheck();
768
+ }
547
769
  }
548
- _appearanceSignal = signal(DEFAULT_APPEARANCE, ...(ngDevMode ? [{ debugName: "_appearanceSignal" }] : []));
549
- /**
550
- * Whether the form field should reserve space for one line of hint/error text (default)
551
- * or to have the spacing grow from 0px as needed based on the size of the hint/error content.
552
- * Note that when using dynamic sizing, layout shifts will occur when hint/error text changes.
553
- */
554
- get subscriptSizing() {
555
- return this._subscriptSizing || this._defaults?.subscriptSizing || DEFAULT_SUBSCRIPT_SIZING;
770
+ }
771
+ ngOnDestroy() {
772
+ this._outlineLabelOffsetResizeObserver?.disconnect();
773
+ this._stateChanges?.unsubscribe();
774
+ this._valueChanges?.unsubscribe();
775
+ this._describedByChanges?.unsubscribe();
776
+ this._destroyed.next();
777
+ this._destroyed.complete();
778
+ }
779
+ getLabelId = computed(() => this._hasFloatingLabel() ? this._labelId : null, ...(ngDevMode ? [{
780
+ debugName: "getLabelId"
781
+ }] : []));
782
+ getConnectedOverlayOrigin() {
783
+ return this._textField || this._elementRef;
784
+ }
785
+ _animateAndLockLabel() {
786
+ if (this._hasFloatingLabel()) {
787
+ this.floatLabel = 'always';
556
788
  }
557
- set subscriptSizing(value) {
558
- this._subscriptSizing = value || this._defaults?.subscriptSizing || DEFAULT_SUBSCRIPT_SIZING;
789
+ }
790
+ _initializeControl(previousControl) {
791
+ const control = this._control;
792
+ const classPrefix = 'mat-mdc-form-field-type-';
793
+ if (previousControl) {
794
+ this._elementRef.nativeElement.classList.remove(classPrefix + previousControl.controlType);
559
795
  }
560
- _subscriptSizing = null;
561
- /** Text for the form field hint. */
562
- get hintLabel() {
563
- return this._hintLabel;
796
+ if (control.controlType) {
797
+ this._elementRef.nativeElement.classList.add(classPrefix + control.controlType);
564
798
  }
565
- set hintLabel(value) {
566
- this._hintLabel = value;
567
- this._processHints();
799
+ this._stateChanges?.unsubscribe();
800
+ this._stateChanges = control.stateChanges.subscribe(() => {
801
+ this._updateFocusState();
802
+ this._changeDetectorRef.markForCheck();
803
+ });
804
+ this._describedByChanges?.unsubscribe();
805
+ this._describedByChanges = control.stateChanges.pipe(startWith([undefined, undefined]), map(() => [control.errorState, control.userAriaDescribedBy]), pairwise(), filter(([[prevErrorState, prevDescribedBy], [currentErrorState, currentDescribedBy]]) => {
806
+ return prevErrorState !== currentErrorState || prevDescribedBy !== currentDescribedBy;
807
+ })).subscribe(() => this._syncDescribedByIds());
808
+ this._valueChanges?.unsubscribe();
809
+ if (control.ngControl && control.ngControl.valueChanges) {
810
+ this._valueChanges = control.ngControl.valueChanges.pipe(takeUntil(this._destroyed)).subscribe(() => this._changeDetectorRef.markForCheck());
568
811
  }
569
- _hintLabel = '';
570
- _hasIconPrefix = false;
571
- _hasTextPrefix = false;
572
- _hasIconSuffix = false;
573
- _hasTextSuffix = false;
574
- // Unique id for the internal form field label.
575
- _labelId = this._idGenerator.getId('mat-mdc-form-field-label-');
576
- // Unique id for the hint label.
577
- _hintLabelId = this._idGenerator.getId('mat-mdc-hint-');
578
- // Ids obtained from the error and hint fields
579
- _describedByIds;
580
- /** Gets the current form field control */
581
- get _control() {
582
- return this._explicitFormFieldControl || this._formFieldControl;
812
+ }
813
+ _checkPrefixAndSuffixTypes() {
814
+ this._hasIconPrefix = !!this._prefixChildren.find(p => !p._isText);
815
+ this._hasTextPrefix = !!this._prefixChildren.find(p => p._isText);
816
+ this._hasIconSuffix = !!this._suffixChildren.find(s => !s._isText);
817
+ this._hasTextSuffix = !!this._suffixChildren.find(s => s._isText);
818
+ }
819
+ _initializePrefixAndSuffix() {
820
+ this._checkPrefixAndSuffixTypes();
821
+ merge(this._prefixChildren.changes, this._suffixChildren.changes).subscribe(() => {
822
+ this._checkPrefixAndSuffixTypes();
823
+ this._changeDetectorRef.markForCheck();
824
+ });
825
+ }
826
+ _initializeSubscript() {
827
+ this._hintChildren.changes.subscribe(() => {
828
+ this._processHints();
829
+ this._changeDetectorRef.markForCheck();
830
+ });
831
+ this._errorChildren.changes.subscribe(() => {
832
+ this._syncDescribedByIds();
833
+ this._changeDetectorRef.markForCheck();
834
+ });
835
+ this._validateHints();
836
+ this._syncDescribedByIds();
837
+ }
838
+ _assertFormFieldControl() {
839
+ if (!this._control && (typeof ngDevMode === 'undefined' || ngDevMode)) {
840
+ throw getMatFormFieldMissingControlError();
583
841
  }
584
- set _control(value) {
585
- this._explicitFormFieldControl = value;
842
+ }
843
+ _updateFocusState() {
844
+ const controlFocused = this._control.focused;
845
+ if (controlFocused && !this._isFocused) {
846
+ this._isFocused = true;
847
+ this._lineRipple?.activate();
848
+ } else if (!controlFocused && (this._isFocused || this._isFocused === null)) {
849
+ this._isFocused = false;
850
+ this._lineRipple?.deactivate();
586
851
  }
587
- _destroyed = new Subject();
588
- _isFocused = null;
589
- _explicitFormFieldControl;
590
- _previousControl = null;
591
- _previousControlValidatorFn = null;
592
- _stateChanges;
593
- _valueChanges;
594
- _describedByChanges;
595
- _outlineLabelOffsetResizeObserver = null;
596
- _animationsDisabled = _animationsDisabled();
597
- constructor() {
598
- const defaults = this._defaults;
599
- const dir = inject(Directionality);
600
- if (defaults) {
601
- if (defaults.appearance) {
602
- this.appearance = defaults.appearance;
603
- }
604
- this._hideRequiredMarker = Boolean(defaults?.hideRequiredMarker);
605
- if (defaults.color) {
606
- this.color = defaults.color;
607
- }
852
+ this._elementRef.nativeElement.classList.toggle('mat-focused', controlFocused);
853
+ this._textField?.nativeElement.classList.toggle('mdc-text-field--focused', controlFocused);
854
+ }
855
+ _syncOutlineLabelOffset() {
856
+ afterRenderEffect({
857
+ earlyRead: () => {
858
+ if (this._appearanceSignal() !== 'outline') {
859
+ this._outlineLabelOffsetResizeObserver?.disconnect();
860
+ return null;
608
861
  }
609
- // We need this value inside a `afterRenderEffect`, however at the time of writing, reading the
610
- // signal directly causes a memory leak (see https://github.com/angular/angular/issues/62980).
611
- // TODO(crisbeto): clean this up once the framework issue is resolved.
612
- effect(() => (this._currentDirection = dir.valueSignal()));
613
- this._syncOutlineLabelOffset();
614
- }
615
- ngAfterViewInit() {
616
- // Initial focus state sync. This happens rarely, but we want to account for
617
- // it in case the form field control has "focused" set to true on init.
618
- this._updateFocusState();
619
- if (!this._animationsDisabled) {
620
- this._ngZone.runOutsideAngular(() => {
621
- // Enable animations after a certain amount of time so that they don't run on init.
622
- setTimeout(() => {
623
- this._elementRef.nativeElement.classList.add('mat-form-field-animations-enabled');
624
- }, 300);
862
+ if (globalThis.ResizeObserver) {
863
+ this._outlineLabelOffsetResizeObserver ||= new globalThis.ResizeObserver(() => {
864
+ this._writeOutlinedLabelStyles(this._getOutlinedLabelOffset());
865
+ });
866
+ for (const el of this._prefixSuffixContainers()) {
867
+ this._outlineLabelOffsetResizeObserver.observe(el, {
868
+ box: 'border-box'
625
869
  });
870
+ }
626
871
  }
627
- // Because the above changes a value used in the template after it was checked, we need
628
- // to trigger CD or the change might not be reflected if there is no other CD scheduled.
629
- this._changeDetectorRef.detectChanges();
630
- }
631
- ngAfterContentInit() {
632
- this._assertFormFieldControl();
633
- this._initializeSubscript();
634
- this._initializePrefixAndSuffix();
635
- }
636
- ngAfterContentChecked() {
637
- this._assertFormFieldControl();
638
- // if form field was being used with an input in first place and then replaced by other
639
- // component such as select.
640
- if (this._control !== this._previousControl) {
641
- this._initializeControl(this._previousControl);
642
- // keep a reference for last validator we had.
643
- if (this._control.ngControl && this._control.ngControl.control) {
644
- this._previousControlValidatorFn = this._control.ngControl.control.validator;
645
- }
646
- this._previousControl = this._control;
647
- }
648
- // make sure the the control has been initialized.
649
- if (this._control.ngControl && this._control.ngControl.control) {
650
- // get the validators for current control.
651
- const validatorFn = this._control.ngControl.control.validator;
652
- // if our current validatorFn isn't equal to it might be we are CD behind, marking the
653
- // component will allow us to catch up.
654
- if (validatorFn !== this._previousControlValidatorFn) {
655
- this._changeDetectorRef.markForCheck();
656
- }
657
- }
658
- }
659
- ngOnDestroy() {
660
- this._outlineLabelOffsetResizeObserver?.disconnect();
661
- this._stateChanges?.unsubscribe();
662
- this._valueChanges?.unsubscribe();
663
- this._describedByChanges?.unsubscribe();
664
- this._destroyed.next();
665
- this._destroyed.complete();
666
- }
667
- /**
668
- * Gets the id of the label element. If no label is present, returns `null`.
669
- */
670
- getLabelId = computed(() => (this._hasFloatingLabel() ? this._labelId : null), ...(ngDevMode ? [{ debugName: "getLabelId" }] : []));
671
- /**
672
- * Gets an ElementRef for the element that a overlay attached to the form field
673
- * should be positioned relative to.
674
- */
675
- getConnectedOverlayOrigin() {
676
- return this._textField || this._elementRef;
677
- }
678
- /** Animates the placeholder up and locks it in position. */
679
- _animateAndLockLabel() {
680
- // This is for backwards compatibility only. Consumers of the form field might use
681
- // this method. e.g. the autocomplete trigger. This method has been added to the non-MDC
682
- // form field because setting "floatLabel" to "always" caused the label to float without
683
- // animation. This is different in MDC where the label always animates, so this method
684
- // is no longer necessary. There doesn't seem any benefit in adding logic to allow changing
685
- // the floating label state without animations. The non-MDC implementation was inconsistent
686
- // because it always animates if "floatLabel" is set away from "always".
687
- // TODO(devversion): consider removing this method when releasing the MDC form field.
688
- if (this._hasFloatingLabel()) {
689
- this.floatLabel = 'always';
690
- }
691
- }
692
- /** Initializes the registered form field control. */
693
- _initializeControl(previousControl) {
694
- const control = this._control;
695
- const classPrefix = 'mat-mdc-form-field-type-';
696
- if (previousControl) {
697
- this._elementRef.nativeElement.classList.remove(classPrefix + previousControl.controlType);
698
- }
699
- if (control.controlType) {
700
- this._elementRef.nativeElement.classList.add(classPrefix + control.controlType);
701
- }
702
- // Subscribe to changes in the child control state in order to update the form field UI.
703
- this._stateChanges?.unsubscribe();
704
- this._stateChanges = control.stateChanges.subscribe(() => {
705
- this._updateFocusState();
706
- this._changeDetectorRef.markForCheck();
707
- });
708
- // Updating the `aria-describedby` touches the DOM. Only do it if it actually needs to change.
709
- this._describedByChanges?.unsubscribe();
710
- this._describedByChanges = control.stateChanges
711
- .pipe(startWith([undefined, undefined]), map(() => [control.errorState, control.userAriaDescribedBy]), pairwise(), filter(([[prevErrorState, prevDescribedBy], [currentErrorState, currentDescribedBy]]) => {
712
- return prevErrorState !== currentErrorState || prevDescribedBy !== currentDescribedBy;
713
- }))
714
- .subscribe(() => this._syncDescribedByIds());
715
- this._valueChanges?.unsubscribe();
716
- // Run change detection if the value changes.
717
- if (control.ngControl && control.ngControl.valueChanges) {
718
- this._valueChanges = control.ngControl.valueChanges
719
- .pipe(takeUntil(this._destroyed))
720
- .subscribe(() => this._changeDetectorRef.markForCheck());
721
- }
722
- }
723
- _checkPrefixAndSuffixTypes() {
724
- this._hasIconPrefix = !!this._prefixChildren.find(p => !p._isText);
725
- this._hasTextPrefix = !!this._prefixChildren.find(p => p._isText);
726
- this._hasIconSuffix = !!this._suffixChildren.find(s => !s._isText);
727
- this._hasTextSuffix = !!this._suffixChildren.find(s => s._isText);
728
- }
729
- /** Initializes the prefix and suffix containers. */
730
- _initializePrefixAndSuffix() {
731
- this._checkPrefixAndSuffixTypes();
732
- // Mark the form field as dirty whenever the prefix or suffix children change. This
733
- // is necessary because we conditionally display the prefix/suffix containers based
734
- // on whether there is projected content.
735
- merge(this._prefixChildren.changes, this._suffixChildren.changes).subscribe(() => {
736
- this._checkPrefixAndSuffixTypes();
737
- this._changeDetectorRef.markForCheck();
738
- });
739
- }
740
- /**
741
- * Initializes the subscript by validating hints and synchronizing "aria-describedby" ids
742
- * with the custom form field control. Also subscribes to hint and error changes in order
743
- * to be able to validate and synchronize ids on change.
744
- */
745
- _initializeSubscript() {
746
- // Re-validate when the number of hints changes.
747
- this._hintChildren.changes.subscribe(() => {
748
- this._processHints();
749
- this._changeDetectorRef.markForCheck();
750
- });
751
- // Update the aria-described by when the number of errors changes.
752
- this._errorChildren.changes.subscribe(() => {
753
- this._syncDescribedByIds();
754
- this._changeDetectorRef.markForCheck();
755
- });
756
- // Initial mat-hint validation and subscript describedByIds sync.
757
- this._validateHints();
758
- this._syncDescribedByIds();
759
- }
760
- /** Throws an error if the form field's control is missing. */
761
- _assertFormFieldControl() {
762
- if (!this._control && (typeof ngDevMode === 'undefined' || ngDevMode)) {
763
- throw getMatFormFieldMissingControlError();
764
- }
765
- }
766
- _updateFocusState() {
767
- const controlFocused = this._control.focused;
768
- // Usually the MDC foundation would call "activateFocus" and "deactivateFocus" whenever
769
- // certain DOM events are emitted. This is not possible in our implementation of the
770
- // form field because we support abstract form field controls which are not necessarily
771
- // of type input, nor do we have a reference to a native form field control element. Instead
772
- // we handle the focus by checking if the abstract form field control focused state changes.
773
- if (controlFocused && !this._isFocused) {
774
- this._isFocused = true;
775
- this._lineRipple?.activate();
776
- }
777
- else if (!controlFocused && (this._isFocused || this._isFocused === null)) {
778
- this._isFocused = false;
779
- this._lineRipple?.deactivate();
780
- }
781
- this._elementRef.nativeElement.classList.toggle('mat-focused', controlFocused);
782
- this._textField?.nativeElement.classList.toggle('mdc-text-field--focused', controlFocused);
783
- }
784
- /**
785
- * The floating label in the docked state needs to account for prefixes. The horizontal offset
786
- * is calculated whenever the appearance changes to `outline`, the prefixes change, or when the
787
- * form field is added to the DOM. This method sets up all subscriptions which are needed to
788
- * trigger the label offset update.
789
- */
790
- _syncOutlineLabelOffset() {
791
- afterRenderEffect({
792
- earlyRead: () => {
793
- if (this._appearanceSignal() !== 'outline') {
794
- this._outlineLabelOffsetResizeObserver?.disconnect();
795
- return null;
796
- }
797
- // Setup a resize observer to monitor changes to the size of the prefix / suffix and
798
- // readjust the label offset.
799
- if (globalThis.ResizeObserver) {
800
- this._outlineLabelOffsetResizeObserver ||= new globalThis.ResizeObserver(() => {
801
- this._writeOutlinedLabelStyles(this._getOutlinedLabelOffset());
802
- });
803
- for (const el of this._prefixSuffixContainers()) {
804
- this._outlineLabelOffsetResizeObserver.observe(el, { box: 'border-box' });
805
- }
806
- }
807
- return this._getOutlinedLabelOffset();
808
- },
809
- write: labelStyles => this._writeOutlinedLabelStyles(labelStyles()),
810
- });
811
- }
812
- /** Whether the floating label should always float or not. */
813
- _shouldAlwaysFloat() {
814
- return this.floatLabel === 'always';
815
- }
816
- _hasOutline() {
817
- return this.appearance === 'outline';
872
+ return this._getOutlinedLabelOffset();
873
+ },
874
+ write: labelStyles => this._writeOutlinedLabelStyles(labelStyles())
875
+ });
876
+ }
877
+ _shouldAlwaysFloat() {
878
+ return this.floatLabel === 'always';
879
+ }
880
+ _hasOutline() {
881
+ return this.appearance === 'outline';
882
+ }
883
+ _forceDisplayInfixLabel() {
884
+ return !this._platform.isBrowser && this._prefixChildren.length && !this._shouldLabelFloat();
885
+ }
886
+ _hasFloatingLabel = computed(() => !!this._labelChild(), ...(ngDevMode ? [{
887
+ debugName: "_hasFloatingLabel"
888
+ }] : []));
889
+ _shouldLabelFloat() {
890
+ if (!this._hasFloatingLabel()) {
891
+ return false;
818
892
  }
819
- /**
820
- * Whether the label should display in the infix. Labels in the outline appearance are
821
- * displayed as part of the notched-outline and are horizontally offset to account for
822
- * form field prefix content. This won't work in server side rendering since we cannot
823
- * measure the width of the prefix container. To make the docked label appear as if the
824
- * right offset has been calculated, we forcibly render the label inside the infix. Since
825
- * the label is part of the infix, the label cannot overflow the prefix content.
826
- */
827
- _forceDisplayInfixLabel() {
828
- return !this._platform.isBrowser && this._prefixChildren.length && !this._shouldLabelFloat();
893
+ return this._control.shouldLabelFloat || this._shouldAlwaysFloat();
894
+ }
895
+ _shouldForward(prop) {
896
+ const control = this._control ? this._control.ngControl : null;
897
+ return control && control[prop];
898
+ }
899
+ _getSubscriptMessageType() {
900
+ return this._errorChildren && this._errorChildren.length > 0 && this._control.errorState ? 'error' : 'hint';
901
+ }
902
+ _handleLabelResized() {
903
+ this._refreshOutlineNotchWidth();
904
+ }
905
+ _refreshOutlineNotchWidth() {
906
+ if (!this._hasOutline() || !this._floatingLabel || !this._shouldLabelFloat()) {
907
+ this._notchedOutline?._setNotchWidth(0);
908
+ } else {
909
+ this._notchedOutline?._setNotchWidth(this._floatingLabel.getWidth());
829
910
  }
830
- _hasFloatingLabel = computed(() => !!this._labelChild(), ...(ngDevMode ? [{ debugName: "_hasFloatingLabel" }] : []));
831
- _shouldLabelFloat() {
832
- if (!this._hasFloatingLabel()) {
833
- return false;
911
+ }
912
+ _processHints() {
913
+ this._validateHints();
914
+ this._syncDescribedByIds();
915
+ }
916
+ _validateHints() {
917
+ if (this._hintChildren && (typeof ngDevMode === 'undefined' || ngDevMode)) {
918
+ let startHint;
919
+ let endHint;
920
+ this._hintChildren.forEach(hint => {
921
+ if (hint.align === 'start') {
922
+ if (startHint || this.hintLabel) {
923
+ throw getMatFormFieldDuplicatedHintError('start');
924
+ }
925
+ startHint = hint;
926
+ } else if (hint.align === 'end') {
927
+ if (endHint) {
928
+ throw getMatFormFieldDuplicatedHintError('end');
929
+ }
930
+ endHint = hint;
834
931
  }
835
- return this._control.shouldLabelFloat || this._shouldAlwaysFloat();
836
- }
837
- /**
838
- * Determines whether a class from the AbstractControlDirective
839
- * should be forwarded to the host element.
840
- */
841
- _shouldForward(prop) {
842
- const control = this._control ? this._control.ngControl : null;
843
- return control && control[prop];
844
- }
845
- /** Gets the type of subscript message to render (error or hint). */
846
- _getSubscriptMessageType() {
847
- return this._errorChildren && this._errorChildren.length > 0 && this._control.errorState
848
- ? 'error'
849
- : 'hint';
850
- }
851
- /** Handle label resize events. */
852
- _handleLabelResized() {
853
- this._refreshOutlineNotchWidth();
932
+ });
854
933
  }
855
- /** Refreshes the width of the outline-notch, if present. */
856
- _refreshOutlineNotchWidth() {
857
- if (!this._hasOutline() || !this._floatingLabel || !this._shouldLabelFloat()) {
858
- this._notchedOutline?._setNotchWidth(0);
934
+ }
935
+ _syncDescribedByIds() {
936
+ if (this._control) {
937
+ let ids = [];
938
+ if (this._control.userAriaDescribedBy && typeof this._control.userAriaDescribedBy === 'string') {
939
+ ids.push(...this._control.userAriaDescribedBy.split(' '));
940
+ }
941
+ if (this._getSubscriptMessageType() === 'hint') {
942
+ const startHint = this._hintChildren ? this._hintChildren.find(hint => hint.align === 'start') : null;
943
+ const endHint = this._hintChildren ? this._hintChildren.find(hint => hint.align === 'end') : null;
944
+ if (startHint) {
945
+ ids.push(startHint.id);
946
+ } else if (this._hintLabel) {
947
+ ids.push(this._hintLabelId);
859
948
  }
860
- else {
861
- this._notchedOutline?._setNotchWidth(this._floatingLabel.getWidth());
949
+ if (endHint) {
950
+ ids.push(endHint.id);
862
951
  }
952
+ } else if (this._errorChildren) {
953
+ ids.push(...this._errorChildren.map(error => error.id));
954
+ }
955
+ const existingDescribedBy = this._control.describedByIds;
956
+ let toAssign;
957
+ if (existingDescribedBy) {
958
+ const exclude = this._describedByIds || ids;
959
+ toAssign = ids.concat(existingDescribedBy.filter(id => id && !exclude.includes(id)));
960
+ } else {
961
+ toAssign = ids;
962
+ }
963
+ this._control.setDescribedByIds(toAssign);
964
+ this._describedByIds = ids;
863
965
  }
864
- /** Does any extra processing that is required when handling the hints. */
865
- _processHints() {
866
- this._validateHints();
867
- this._syncDescribedByIds();
966
+ }
967
+ _getOutlinedLabelOffset() {
968
+ if (!this._hasOutline() || !this._floatingLabel) {
969
+ return null;
868
970
  }
869
- /**
870
- * Ensure that there is a maximum of one of each "mat-hint" alignment specified. The hint
871
- * label specified set through the input is being considered as "start" aligned.
872
- *
873
- * This method is a noop if Angular runs in production mode.
874
- */
875
- _validateHints() {
876
- if (this._hintChildren && (typeof ngDevMode === 'undefined' || ngDevMode)) {
877
- let startHint;
878
- let endHint;
879
- this._hintChildren.forEach((hint) => {
880
- if (hint.align === 'start') {
881
- if (startHint || this.hintLabel) {
882
- throw getMatFormFieldDuplicatedHintError('start');
883
- }
884
- startHint = hint;
885
- }
886
- else if (hint.align === 'end') {
887
- if (endHint) {
888
- throw getMatFormFieldDuplicatedHintError('end');
889
- }
890
- endHint = hint;
891
- }
892
- });
893
- }
971
+ if (!this._iconPrefixContainer && !this._textPrefixContainer) {
972
+ return ['', null];
894
973
  }
895
- /**
896
- * Sets the list of element IDs that describe the child control. This allows the control to update
897
- * its `aria-describedby` attribute accordingly.
898
- */
899
- _syncDescribedByIds() {
900
- if (this._control) {
901
- let ids = [];
902
- // TODO(wagnermaciel): Remove the type check when we find the root cause of this bug.
903
- if (this._control.userAriaDescribedBy &&
904
- typeof this._control.userAriaDescribedBy === 'string') {
905
- ids.push(...this._control.userAriaDescribedBy.split(' '));
906
- }
907
- if (this._getSubscriptMessageType() === 'hint') {
908
- const startHint = this._hintChildren
909
- ? this._hintChildren.find(hint => hint.align === 'start')
910
- : null;
911
- const endHint = this._hintChildren
912
- ? this._hintChildren.find(hint => hint.align === 'end')
913
- : null;
914
- if (startHint) {
915
- ids.push(startHint.id);
916
- }
917
- else if (this._hintLabel) {
918
- ids.push(this._hintLabelId);
919
- }
920
- if (endHint) {
921
- ids.push(endHint.id);
922
- }
923
- }
924
- else if (this._errorChildren) {
925
- ids.push(...this._errorChildren.map(error => error.id));
926
- }
927
- const existingDescribedBy = this._control.describedByIds;
928
- let toAssign;
929
- // In some cases there might be some `aria-describedby` IDs that were assigned directly,
930
- // like by the `AriaDescriber` (see #30011). Attempt to preserve them by taking the previous
931
- // attribute value and filtering out the IDs that came from the previous `setDescribedByIds`
932
- // call. Note the `|| ids` here allows us to avoid duplicating IDs on the first render.
933
- if (existingDescribedBy) {
934
- const exclude = this._describedByIds || ids;
935
- toAssign = ids.concat(existingDescribedBy.filter(id => id && !exclude.includes(id)));
936
- }
937
- else {
938
- toAssign = ids;
939
- }
940
- this._control.setDescribedByIds(toAssign);
941
- this._describedByIds = ids;
942
- }
974
+ if (!this._isAttachedToDom()) {
975
+ return null;
943
976
  }
944
- /**
945
- * Calculates the horizontal offset of the label in the outline appearance. In the outline
946
- * appearance, the notched-outline and label are not relative to the infix container because
947
- * the outline intends to surround prefixes, suffixes and the infix. This means that the
948
- * floating label by default overlaps prefixes in the docked state. To avoid this, we need to
949
- * horizontally offset the label by the width of the prefix container. The MDC text-field does
950
- * not need to do this because they use a fixed width for prefixes. Hence, they can simply
951
- * incorporate the horizontal offset into their default text-field styles.
952
- */
953
- _getOutlinedLabelOffset() {
954
- if (!this._hasOutline() || !this._floatingLabel) {
955
- return null;
956
- }
957
- // If no prefix is displayed, reset the outline label offset from potential
958
- // previous label offset updates.
959
- if (!this._iconPrefixContainer && !this._textPrefixContainer) {
960
- return ['', null];
961
- }
962
- // If the form field is not attached to the DOM yet (e.g. in a tab), we defer
963
- // the label offset update until the zone stabilizes.
964
- if (!this._isAttachedToDom()) {
965
- return null;
966
- }
967
- const iconPrefixContainer = this._iconPrefixContainer?.nativeElement;
968
- const textPrefixContainer = this._textPrefixContainer?.nativeElement;
969
- const iconSuffixContainer = this._iconSuffixContainer?.nativeElement;
970
- const textSuffixContainer = this._textSuffixContainer?.nativeElement;
971
- const iconPrefixContainerWidth = iconPrefixContainer?.getBoundingClientRect().width ?? 0;
972
- const textPrefixContainerWidth = textPrefixContainer?.getBoundingClientRect().width ?? 0;
973
- const iconSuffixContainerWidth = iconSuffixContainer?.getBoundingClientRect().width ?? 0;
974
- const textSuffixContainerWidth = textSuffixContainer?.getBoundingClientRect().width ?? 0;
975
- // If the directionality is RTL, the x-axis transform needs to be inverted. This
976
- // is because `transformX` does not change based on the page directionality.
977
- const negate = this._currentDirection === 'rtl' ? '-1' : '1';
978
- const prefixWidth = `${iconPrefixContainerWidth + textPrefixContainerWidth}px`;
979
- const labelOffset = `var(--mat-mdc-form-field-label-offset-x, 0px)`;
980
- const labelHorizontalOffset = `calc(${negate} * (${prefixWidth} + ${labelOffset}))`;
981
- // Update the translateX of the floating label to account for the prefix container,
982
- // but allow the CSS to override this setting via a CSS variable when the label is
983
- // floating.
984
- const floatingLabelTransform = 'var(--mat-mdc-form-field-label-transform, ' +
985
- `${FLOATING_LABEL_DEFAULT_DOCKED_TRANSFORM} translateX(${labelHorizontalOffset}))`;
986
- // Prevent the label from overlapping the suffix when in resting position.
987
- const notchedOutlineWidth = iconPrefixContainerWidth +
988
- textPrefixContainerWidth +
989
- iconSuffixContainerWidth +
990
- textSuffixContainerWidth;
991
- return [floatingLabelTransform, notchedOutlineWidth];
992
- }
993
- /** Writes the styles produced by `_getOutlineLabelOffset` synchronously to the DOM. */
994
- _writeOutlinedLabelStyles(styles) {
995
- if (styles !== null) {
996
- const [floatingLabelTransform, notchedOutlineWidth] = styles;
997
- if (this._floatingLabel) {
998
- this._floatingLabel.element.style.transform = floatingLabelTransform;
999
- }
1000
- if (notchedOutlineWidth !== null) {
1001
- this._notchedOutline?._setMaxWidth(notchedOutlineWidth);
1002
- }
1003
- }
977
+ const iconPrefixContainer = this._iconPrefixContainer?.nativeElement;
978
+ const textPrefixContainer = this._textPrefixContainer?.nativeElement;
979
+ const iconSuffixContainer = this._iconSuffixContainer?.nativeElement;
980
+ const textSuffixContainer = this._textSuffixContainer?.nativeElement;
981
+ const iconPrefixContainerWidth = iconPrefixContainer?.getBoundingClientRect().width ?? 0;
982
+ const textPrefixContainerWidth = textPrefixContainer?.getBoundingClientRect().width ?? 0;
983
+ const iconSuffixContainerWidth = iconSuffixContainer?.getBoundingClientRect().width ?? 0;
984
+ const textSuffixContainerWidth = textSuffixContainer?.getBoundingClientRect().width ?? 0;
985
+ const negate = this._currentDirection === 'rtl' ? '-1' : '1';
986
+ const prefixWidth = `${iconPrefixContainerWidth + textPrefixContainerWidth}px`;
987
+ const labelOffset = `var(--mat-mdc-form-field-label-offset-x, 0px)`;
988
+ const labelHorizontalOffset = `calc(${negate} * (${prefixWidth} + ${labelOffset}))`;
989
+ const floatingLabelTransform = 'var(--mat-mdc-form-field-label-transform, ' + `${FLOATING_LABEL_DEFAULT_DOCKED_TRANSFORM} translateX(${labelHorizontalOffset}))`;
990
+ const notchedOutlineWidth = iconPrefixContainerWidth + textPrefixContainerWidth + iconSuffixContainerWidth + textSuffixContainerWidth;
991
+ return [floatingLabelTransform, notchedOutlineWidth];
992
+ }
993
+ _writeOutlinedLabelStyles(styles) {
994
+ if (styles !== null) {
995
+ const [floatingLabelTransform, notchedOutlineWidth] = styles;
996
+ if (this._floatingLabel) {
997
+ this._floatingLabel.element.style.transform = floatingLabelTransform;
998
+ }
999
+ if (notchedOutlineWidth !== null) {
1000
+ this._notchedOutline?._setMaxWidth(notchedOutlineWidth);
1001
+ }
1004
1002
  }
1005
- /** Checks whether the form field is attached to the DOM. */
1006
- _isAttachedToDom() {
1007
- const element = this._elementRef.nativeElement;
1008
- if (element.getRootNode) {
1009
- const rootNode = element.getRootNode();
1010
- // If the element is inside the DOM the root node will be either the document
1011
- // or the closest shadow root, otherwise it'll be the element itself.
1012
- return rootNode && rootNode !== element;
1013
- }
1014
- // Otherwise fall back to checking if it's in the document. This doesn't account for
1015
- // shadow DOM, however browser that support shadow DOM should support `getRootNode` as well.
1016
- return document.documentElement.contains(element);
1003
+ }
1004
+ _isAttachedToDom() {
1005
+ const element = this._elementRef.nativeElement;
1006
+ if (element.getRootNode) {
1007
+ const rootNode = element.getRootNode();
1008
+ return rootNode && rootNode !== element;
1017
1009
  }
1018
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormField, deps: [], target: i0.ɵɵFactoryTarget.Component });
1019
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.0-next.2", type: MatFormField, isStandalone: true, selector: "mat-form-field", inputs: { hideRequiredMarker: "hideRequiredMarker", color: "color", floatLabel: "floatLabel", appearance: "appearance", subscriptSizing: "subscriptSizing", hintLabel: "hintLabel" }, host: { properties: { "class.mat-mdc-form-field-label-always-float": "_shouldAlwaysFloat()", "class.mat-mdc-form-field-has-icon-prefix": "_hasIconPrefix", "class.mat-mdc-form-field-has-icon-suffix": "_hasIconSuffix", "class.mat-form-field-invalid": "_control.errorState", "class.mat-form-field-disabled": "_control.disabled", "class.mat-form-field-autofilled": "_control.autofilled", "class.mat-form-field-appearance-fill": "appearance == \"fill\"", "class.mat-form-field-appearance-outline": "appearance == \"outline\"", "class.mat-form-field-hide-placeholder": "_hasFloatingLabel() && !_shouldLabelFloat()", "class.mat-primary": "color !== \"accent\" && color !== \"warn\"", "class.mat-accent": "color === \"accent\"", "class.mat-warn": "color === \"warn\"", "class.ng-untouched": "_shouldForward(\"untouched\")", "class.ng-touched": "_shouldForward(\"touched\")", "class.ng-pristine": "_shouldForward(\"pristine\")", "class.ng-dirty": "_shouldForward(\"dirty\")", "class.ng-valid": "_shouldForward(\"valid\")", "class.ng-invalid": "_shouldForward(\"invalid\")", "class.ng-pending": "_shouldForward(\"pending\")" }, classAttribute: "mat-mdc-form-field" }, providers: [
1020
- { provide: MAT_FORM_FIELD, useExisting: MatFormField },
1021
- { provide: FLOATING_LABEL_PARENT, useExisting: MatFormField },
1022
- ], queries: [{ propertyName: "_labelChild", first: true, predicate: MatLabel, descendants: true, isSignal: true }, { propertyName: "_formFieldControl", first: true, predicate: MatFormFieldControl, descendants: true }, { propertyName: "_prefixChildren", predicate: MAT_PREFIX, descendants: true }, { propertyName: "_suffixChildren", predicate: MAT_SUFFIX, descendants: true }, { propertyName: "_errorChildren", predicate: MAT_ERROR, descendants: true }, { propertyName: "_hintChildren", predicate: MatHint, descendants: true }], viewQueries: [{ propertyName: "_iconPrefixContainerSignal", first: true, predicate: ["iconPrefixContainer"], descendants: true, isSignal: true }, { propertyName: "_textPrefixContainerSignal", first: true, predicate: ["textPrefixContainer"], descendants: true, isSignal: true }, { propertyName: "_iconSuffixContainerSignal", first: true, predicate: ["iconSuffixContainer"], descendants: true, isSignal: true }, { propertyName: "_textSuffixContainerSignal", first: true, predicate: ["textSuffixContainer"], descendants: true, isSignal: true }, { propertyName: "_textField", first: true, predicate: ["textField"], descendants: true }, { propertyName: "_iconPrefixContainer", first: true, predicate: ["iconPrefixContainer"], descendants: true }, { propertyName: "_textPrefixContainer", first: true, predicate: ["textPrefixContainer"], descendants: true }, { propertyName: "_iconSuffixContainer", first: true, predicate: ["iconSuffixContainer"], descendants: true }, { propertyName: "_textSuffixContainer", first: true, predicate: ["textSuffixContainer"], descendants: true }, { propertyName: "_floatingLabel", first: true, predicate: MatFormFieldFloatingLabel, descendants: true }, { propertyName: "_notchedOutline", first: true, predicate: MatFormFieldNotchedOutline, descendants: true }, { propertyName: "_lineRipple", first: true, predicate: MatFormFieldLineRipple, descendants: true }], exportAs: ["matFormField"], ngImport: i0, template: "<ng-template #labelTemplate>\n <!--\n MDC recommends that the text-field is a `<label>` element. This rather complicates the\n setup because it would require every form-field control to explicitly set `aria-labelledby`.\n This is because the `<label>` itself contains more than the actual label (e.g. prefix, suffix\n or other projected content), and screen readers could potentially read out undesired content.\n Excluding elements from being printed out requires them to be marked with `aria-hidden`, or\n the form control is set to a scoped element for the label (using `aria-labelledby`). Both of\n these options seem to complicate the setup because we know exactly what content is rendered\n as part of the label, and we don't want to spend resources on walking through projected content\n to set `aria-hidden`. Nor do we want to set `aria-labelledby` on every form control if we could\n simply link the label to the control using the label `for` attribute.\n -->\n @if (_hasFloatingLabel()) {\n <label\n matFormFieldFloatingLabel\n [floating]=\"_shouldLabelFloat()\"\n [monitorResize]=\"_hasOutline()\"\n [id]=\"_labelId\"\n [attr.for]=\"_control.disableAutomaticLabeling ? null : _control.id\"\n >\n <ng-content select=\"mat-label\"></ng-content>\n <!--\n We set the required marker as a separate element, in order to make it easier to target if\n apps want to override it and to be able to set `aria-hidden` so that screen readers don't\n pick it up.\n -->\n @if (!hideRequiredMarker && _control.required) {\n <span\n aria-hidden=\"true\"\n class=\"mat-mdc-form-field-required-marker mdc-floating-label--required\"\n ></span>\n }\n </label>\n }\n</ng-template>\n\n<div\n class=\"mat-mdc-text-field-wrapper mdc-text-field\"\n #textField\n [class.mdc-text-field--filled]=\"!_hasOutline()\"\n [class.mdc-text-field--outlined]=\"_hasOutline()\"\n [class.mdc-text-field--no-label]=\"!_hasFloatingLabel()\"\n [class.mdc-text-field--disabled]=\"_control.disabled\"\n [class.mdc-text-field--invalid]=\"_control.errorState\"\n (click)=\"_control.onContainerClick($event)\"\n>\n @if (!_hasOutline() && !_control.disabled) {\n <div class=\"mat-mdc-form-field-focus-overlay\"></div>\n }\n <div class=\"mat-mdc-form-field-flex\">\n @if (_hasOutline()) {\n <div matFormFieldNotchedOutline [matFormFieldNotchedOutlineOpen]=\"_shouldLabelFloat()\">\n @if (!_forceDisplayInfixLabel()) {\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n }\n </div>\n }\n\n @if (_hasIconPrefix) {\n <div class=\"mat-mdc-form-field-icon-prefix\" #iconPrefixContainer>\n <ng-content select=\"[matPrefix], [matIconPrefix]\"></ng-content>\n </div>\n }\n\n @if (_hasTextPrefix) {\n <div class=\"mat-mdc-form-field-text-prefix\" #textPrefixContainer>\n <ng-content select=\"[matTextPrefix]\"></ng-content>\n </div>\n }\n\n <div class=\"mat-mdc-form-field-infix\">\n @if (!_hasOutline() || _forceDisplayInfixLabel()) {\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n }\n\n <ng-content></ng-content>\n </div>\n\n @if (_hasTextSuffix) {\n <div class=\"mat-mdc-form-field-text-suffix\" #textSuffixContainer>\n <ng-content select=\"[matTextSuffix]\"></ng-content>\n </div>\n }\n\n @if (_hasIconSuffix) {\n <div class=\"mat-mdc-form-field-icon-suffix\" #iconSuffixContainer>\n <ng-content select=\"[matSuffix], [matIconSuffix]\"></ng-content>\n </div>\n }\n </div>\n\n @if (!_hasOutline()) {\n <div matFormFieldLineRipple></div>\n }\n</div>\n\n<div aria-atomic=\"true\" aria-live=\"polite\"\n class=\"mat-mdc-form-field-subscript-wrapper mat-mdc-form-field-bottom-align\"\n [class.mat-mdc-form-field-subscript-dynamic-size]=\"subscriptSizing === 'dynamic'\"\n>\n @let subscriptMessageType = _getSubscriptMessageType();\n\n @switch (subscriptMessageType) {\n @case ('error') {\n <div class=\"mat-mdc-form-field-error-wrapper\">\n <ng-content select=\"mat-error, [matError]\"></ng-content>\n </div>\n }\n\n @case ('hint') {\n <div class=\"mat-mdc-form-field-hint-wrapper\">\n @if (hintLabel) {\n <mat-hint [id]=\"_hintLabelId\">{{hintLabel}}</mat-hint>\n }\n <ng-content select=\"mat-hint:not([align='end'])\"></ng-content>\n <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n <ng-content select=\"mat-hint[align='end']\"></ng-content>\n </div>\n }\n }\n</div>\n", styles: [".mdc-text-field{display:inline-flex;align-items:baseline;padding:0 16px;position:relative;box-sizing:border-box;overflow:hidden;will-change:opacity,transform,color;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:0;border-bottom-left-radius:0}.mdc-text-field__input{width:100%;min-width:0;border:none;border-radius:0;background:none;padding:0;-moz-appearance:none;-webkit-appearance:none;height:28px}.mdc-text-field__input::-webkit-calendar-picker-indicator,.mdc-text-field__input::-webkit-search-cancel-button{display:none}.mdc-text-field__input::-ms-clear{display:none}.mdc-text-field__input:focus{outline:none}.mdc-text-field__input:invalid{box-shadow:none}.mdc-text-field__input::placeholder{opacity:0}.mdc-text-field__input::-moz-placeholder{opacity:0}.mdc-text-field__input::-webkit-input-placeholder{opacity:0}.mdc-text-field__input:-ms-input-placeholder{opacity:0}.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mdc-text-field--focused .mdc-text-field__input::placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input::-moz-placeholder,.mdc-text-field--focused .mdc-text-field__input::-moz-placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input::-webkit-input-placeholder,.mdc-text-field--focused .mdc-text-field__input::-webkit-input-placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{opacity:1}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::-moz-placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::-webkit-input-placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive:-ms-input-placeholder{opacity:0}.mdc-text-field--outlined .mdc-text-field__input,.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__input{height:100%}.mdc-text-field--outlined .mdc-text-field__input{display:flex;border:none !important;background-color:rgba(0,0,0,0)}.mdc-text-field--disabled .mdc-text-field__input{pointer-events:auto}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input{color:var(--mat-form-field-filled-input-text-color, var(--mat-sys-on-surface));caret-color:var(--mat-form-field-filled-caret-color, var(--mat-sys-primary))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{color:var(--mat-form-field-outlined-input-text-color, var(--mat-sys-on-surface));caret-color:var(--mat-form-field-outlined-caret-color, var(--mat-sys-primary))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--mat-form-field-filled-error-caret-color, var(--mat-sys-error))}.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--mat-form-field-outlined-error-caret-color, var(--mat-sys-error))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-text-field__input{color:var(--mat-form-field-filled-disabled-input-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--mat-form-field-outlined-disabled-input-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}@media(forced-colors: active){.mdc-text-field--disabled .mdc-text-field__input{background-color:Window}}.mdc-text-field--filled{height:56px;border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-left-radius:var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small));border-top-right-radius:var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small))}.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:var(--mat-form-field-filled-container-color, var(--mat-sys-surface-variant))}.mdc-text-field--filled.mdc-text-field--disabled{background-color:var(--mat-form-field-filled-disabled-container-color, color-mix(in srgb, var(--mat-sys-on-surface) 4%, transparent))}.mdc-text-field--outlined{height:56px;overflow:visible;padding-right:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)));padding-left:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)) + 4px)}[dir=rtl] .mdc-text-field--outlined{padding-right:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)) + 4px);padding-left:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)))}.mdc-floating-label{position:absolute;left:0;transform-origin:left top;line-height:1.15rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform}[dir=rtl] .mdc-floating-label{right:0;left:auto;transform-origin:right top;text-align:right}.mdc-text-field .mdc-floating-label{top:50%;transform:translateY(-50%);pointer-events:none}.mdc-notched-outline .mdc-floating-label{display:inline-block;position:relative;max-width:100%}.mdc-text-field--outlined .mdc-floating-label{left:4px;right:auto}[dir=rtl] .mdc-text-field--outlined .mdc-floating-label{left:auto;right:4px}.mdc-text-field--filled .mdc-floating-label{left:16px;right:auto}[dir=rtl] .mdc-text-field--filled .mdc-floating-label{left:auto;right:16px}.mdc-text-field--disabled .mdc-floating-label{cursor:default}@media(forced-colors: active){.mdc-text-field--disabled .mdc-floating-label{z-index:1}}.mdc-text-field--filled.mdc-text-field--no-label .mdc-floating-label{display:none}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-filled-focus-label-text-color, var(--mat-sys-primary))}.mdc-text-field--filled:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-floating-label{color:var(--mat-form-field-filled-hover-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-floating-label{color:var(--mat-form-field-filled-disabled-label-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-error-label-text-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-filled-error-focus-label-text-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-floating-label{color:var(--mat-form-field-filled-error-hover-label-text-color, var(--mat-sys-on-error-container))}.mdc-text-field--filled .mdc-floating-label{font-family:var(--mat-form-field-filled-label-text-font, var(--mat-sys-body-large-font));font-size:var(--mat-form-field-filled-label-text-size, var(--mat-sys-body-large-size));font-weight:var(--mat-form-field-filled-label-text-weight, var(--mat-sys-body-large-weight));letter-spacing:var(--mat-form-field-filled-label-text-tracking, var(--mat-sys-body-large-tracking))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mat-form-field-outlined-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-outlined-focus-label-text-color, var(--mat-sys-primary))}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-floating-label{color:var(--mat-form-field-outlined-hover-label-text-color, var(--mat-sys-on-surface))}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-floating-label{color:var(--mat-form-field-outlined-disabled-label-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-outlined-error-label-text-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-outlined-error-focus-label-text-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-floating-label{color:var(--mat-form-field-outlined-error-hover-label-text-color, var(--mat-sys-on-error-container))}.mdc-text-field--outlined .mdc-floating-label{font-family:var(--mat-form-field-outlined-label-text-font, var(--mat-sys-body-large-font));font-size:var(--mat-form-field-outlined-label-text-size, var(--mat-sys-body-large-size));font-weight:var(--mat-form-field-outlined-label-text-weight, var(--mat-sys-body-large-weight));letter-spacing:var(--mat-form-field-outlined-label-text-tracking, var(--mat-sys-body-large-tracking))}.mdc-floating-label--float-above{cursor:auto;transform:translateY(-106%) scale(0.75)}.mdc-text-field--filled .mdc-floating-label--float-above{transform:translateY(-106%) scale(0.75)}.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-37.25px) scale(1);font-size:.75rem}.mdc-notched-outline .mdc-floating-label--float-above{text-overflow:clip}.mdc-notched-outline--upgraded .mdc-floating-label--float-above{max-width:133.3333333333%}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-34.75px) scale(0.75)}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after{margin-left:1px;margin-right:0;content:\"*\"}[dir=rtl] .mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after{margin-left:0;margin-right:1px}.mdc-notched-outline{display:flex;position:absolute;top:0;right:0;left:0;box-sizing:border-box;width:100%;max-width:100%;height:100%;text-align:left;pointer-events:none}[dir=rtl] .mdc-notched-outline{text-align:right}.mdc-text-field--outlined .mdc-notched-outline{z-index:1}.mat-mdc-notch-piece{box-sizing:border-box;height:100%;pointer-events:none;border-top:1px solid;border-bottom:1px solid}.mdc-text-field--focused .mat-mdc-notch-piece{border-width:2px}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-outline-color, var(--mat-sys-outline));border-width:var(--mat-form-field-outlined-outline-width, 1px)}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-hover-outline-color, var(--mat-sys-on-surface))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-focus-outline-color, var(--mat-sys-primary))}.mdc-text-field--outlined.mdc-text-field--disabled .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-disabled-outline-color, color-mix(in srgb, var(--mat-sys-on-surface) 12%, transparent))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-outline-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--focused):hover .mdc-notched-outline .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-hover-outline-color, var(--mat-sys-on-error-container))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-focus-outline-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mat-mdc-notch-piece{border-width:var(--mat-form-field-outlined-focus-outline-width, 2px)}.mdc-notched-outline__leading{border-left:1px solid;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading{width:max(12px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)))}[dir=rtl] .mdc-notched-outline__leading{border-left:none;border-right:1px solid;border-bottom-left-radius:0;border-top-left-radius:0;border-top-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-notched-outline__trailing{flex-grow:1;border-left:none;border-right:1px solid;border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}[dir=rtl] .mdc-notched-outline__trailing{border-left:1px solid;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-notched-outline__notch{flex:0 0 auto;width:auto}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__notch{max-width:min(var(--mat-form-field-notch-max-width, 100%),calc(100% - max(12px, var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))) * 2))}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{max-width:min(100%,calc(100% - max(12px, var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))) * 2))}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:1px}.mdc-text-field--focused.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:2px}.mdc-notched-outline--notched .mdc-notched-outline__notch{padding-left:0;padding-right:8px;border-top:none}[dir=rtl] .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-left:8px;padding-right:0}.mdc-notched-outline--no-label .mdc-notched-outline__notch{display:none}.mdc-line-ripple::before,.mdc-line-ripple::after{position:absolute;bottom:0;left:0;width:100%;border-bottom-style:solid;content:\"\"}.mdc-line-ripple::before{z-index:1;border-bottom-width:var(--mat-form-field-filled-active-indicator-height, 1px)}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-active-indicator-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-hover-active-indicator-color, var(--mat-sys-on-surface))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-disabled-active-indicator-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-error-active-indicator-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--focused):hover .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-error-hover-active-indicator-color, var(--mat-sys-on-error-container))}.mdc-line-ripple::after{transform:scaleX(0);opacity:0;z-index:2}.mdc-text-field--filled .mdc-line-ripple::after{border-bottom-width:var(--mat-form-field-filled-focus-active-indicator-height, 2px)}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:var(--mat-form-field-filled-focus-active-indicator-color, var(--mat-sys-primary))}.mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:var(--mat-form-field-filled-error-focus-active-indicator-color, var(--mat-sys-error))}.mdc-line-ripple--active::after{transform:scaleX(1);opacity:1}.mdc-line-ripple--deactivating::after{opacity:0}.mdc-text-field--disabled{pointer-events:none}.mat-mdc-form-field-textarea-control{vertical-align:middle;resize:vertical;box-sizing:border-box;height:auto;margin:0;padding:0;border:none;overflow:auto}.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font:inherit;letter-spacing:inherit;text-decoration:inherit;text-transform:inherit;border:none}.mat-mdc-form-field .mat-mdc-floating-label.mdc-floating-label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:normal;pointer-events:all;will-change:auto}.mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{cursor:inherit}.mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input,.mat-mdc-text-field-wrapper .mat-mdc-form-field-input-control{height:auto}.mat-mdc-text-field-wrapper .mat-mdc-form-field-input-control.mdc-text-field__input[type=color]{height:23px}.mat-mdc-text-field-wrapper{height:auto;flex:auto;will-change:auto}.mat-mdc-form-field-has-icon-prefix .mat-mdc-text-field-wrapper{padding-left:0;--mat-mdc-form-field-label-offset-x: -16px}.mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-right:0}[dir=rtl] .mat-mdc-text-field-wrapper{padding-left:16px;padding-right:16px}[dir=rtl] .mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-left:0}[dir=rtl] .mat-mdc-form-field-has-icon-prefix .mat-mdc-text-field-wrapper{padding-right:0}.mat-form-field-disabled .mdc-text-field__input::placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-label-always-float .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms;opacity:1}.mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-floating-label{left:auto;right:auto}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input{display:inline-block}.mat-mdc-form-field .mat-mdc-text-field-wrapper.mdc-text-field .mdc-notched-outline__notch{padding-top:0}.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:1px solid rgba(0,0,0,0)}[dir=rtl] .mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:none;border-right:1px solid rgba(0,0,0,0)}.mat-mdc-form-field-infix{min-height:var(--mat-form-field-container-height, 56px);padding-top:var(--mat-form-field-filled-with-label-container-padding-top, 24px);padding-bottom:var(--mat-form-field-filled-with-label-container-padding-bottom, 8px)}.mdc-text-field--outlined .mat-mdc-form-field-infix,.mdc-text-field--no-label .mat-mdc-form-field-infix{padding-top:var(--mat-form-field-container-vertical-padding, 16px);padding-bottom:var(--mat-form-field-container-vertical-padding, 16px)}.mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:calc(var(--mat-form-field-container-height, 56px)/2)}.mdc-text-field--filled .mat-mdc-floating-label{display:var(--mat-form-field-filled-label-display, block)}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY(calc(calc(6.75px + var(--mat-form-field-container-height, 56px) / 2) * -1)) scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));transform:var(--mat-mdc-form-field-label-transform)}@keyframes _mat-form-field-subscript-animation{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.mat-mdc-form-field-subscript-wrapper{box-sizing:border-box;width:100%;position:relative}.mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field-error-wrapper{position:absolute;top:0;left:0;right:0;padding:0 16px;opacity:1;transform:translateY(0);animation:_mat-form-field-subscript-animation 0ms cubic-bezier(0.55, 0, 0.55, 0.2)}.mat-mdc-form-field-subscript-dynamic-size .mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field-subscript-dynamic-size .mat-mdc-form-field-error-wrapper{position:static}.mat-mdc-form-field-bottom-align::before{content:\"\";display:inline-block;height:16px}.mat-mdc-form-field-bottom-align.mat-mdc-form-field-subscript-dynamic-size::before{content:unset}.mat-mdc-form-field-hint-end{order:1}.mat-mdc-form-field-hint-wrapper{display:flex}.mat-mdc-form-field-hint-spacer{flex:1 0 1em}.mat-mdc-form-field-error{display:block;color:var(--mat-form-field-error-text-color, var(--mat-sys-error))}.mat-mdc-form-field-subscript-wrapper,.mat-mdc-form-field-bottom-align::before{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mat-form-field-subscript-text-font, var(--mat-sys-body-small-font));line-height:var(--mat-form-field-subscript-text-line-height, var(--mat-sys-body-small-line-height));font-size:var(--mat-form-field-subscript-text-size, var(--mat-sys-body-small-size));letter-spacing:var(--mat-form-field-subscript-text-tracking, var(--mat-sys-body-small-tracking));font-weight:var(--mat-form-field-subscript-text-weight, var(--mat-sys-body-small-weight))}.mat-mdc-form-field-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;opacity:0;pointer-events:none;background-color:var(--mat-form-field-state-layer-color, var(--mat-sys-on-surface))}.mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-focus-overlay{opacity:var(--mat-form-field-hover-state-layer-opacity, var(--mat-sys-hover-state-layer-opacity))}.mat-mdc-form-field.mat-focused .mat-mdc-form-field-focus-overlay{opacity:var(--mat-form-field-focus-state-layer-opacity, 0)}select.mat-mdc-form-field-input-control{-moz-appearance:none;-webkit-appearance:none;background-color:rgba(0,0,0,0);display:inline-flex;box-sizing:border-box}select.mat-mdc-form-field-input-control:not(:disabled){cursor:pointer}select.mat-mdc-form-field-input-control:not(.mat-mdc-native-select-inline) option{color:var(--mat-form-field-select-option-text-color, var(--mat-sys-neutral10))}select.mat-mdc-form-field-input-control:not(.mat-mdc-native-select-inline) option:disabled{color:var(--mat-form-field-select-disabled-option-text-color, color-mix(in srgb, var(--mat-sys-neutral10) 38%, transparent))}.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after{content:\"\";width:0;height:0;border-left:5px solid rgba(0,0,0,0);border-right:5px solid rgba(0,0,0,0);border-top:5px solid;position:absolute;right:0;top:50%;margin-top:-2.5px;pointer-events:none;color:var(--mat-form-field-enabled-select-arrow-color, var(--mat-sys-on-surface-variant))}[dir=rtl] .mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after{right:auto;left:0}.mat-mdc-form-field-type-mat-native-select.mat-focused .mat-mdc-form-field-infix::after{color:var(--mat-form-field-focus-select-arrow-color, var(--mat-sys-primary))}.mat-mdc-form-field-type-mat-native-select.mat-form-field-disabled .mat-mdc-form-field-infix::after{color:var(--mat-form-field-disabled-select-arrow-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-input-control{padding-right:15px}[dir=rtl] .mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-input-control{padding-right:0;padding-left:15px}@media(forced-colors: active){.mat-form-field-appearance-fill .mat-mdc-text-field-wrapper{outline:solid 1px}}@media(forced-colors: active){.mat-form-field-appearance-fill.mat-form-field-disabled .mat-mdc-text-field-wrapper{outline-color:GrayText}}@media(forced-colors: active){.mat-form-field-appearance-fill.mat-focused .mat-mdc-text-field-wrapper{outline:dashed 3px}}@media(forced-colors: active){.mat-mdc-form-field.mat-focused .mdc-notched-outline{border:dashed 3px}}.mat-mdc-form-field-input-control[type=date],.mat-mdc-form-field-input-control[type=datetime],.mat-mdc-form-field-input-control[type=datetime-local],.mat-mdc-form-field-input-control[type=month],.mat-mdc-form-field-input-control[type=week],.mat-mdc-form-field-input-control[type=time]{line-height:1}.mat-mdc-form-field-input-control::-webkit-datetime-edit{line-height:1;padding:0;margin-bottom:-2px}.mat-mdc-form-field{--mat-mdc-form-field-floating-label-scale: 0.75;display:inline-flex;flex-direction:column;min-width:0;text-align:left;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mat-form-field-container-text-font, var(--mat-sys-body-large-font));line-height:var(--mat-form-field-container-text-line-height, var(--mat-sys-body-large-line-height));font-size:var(--mat-form-field-container-text-size, var(--mat-sys-body-large-size));letter-spacing:var(--mat-form-field-container-text-tracking, var(--mat-sys-body-large-tracking));font-weight:var(--mat-form-field-container-text-weight, var(--mat-sys-body-large-weight))}.mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{font-size:calc(var(--mat-form-field-outlined-label-text-populated-size)*var(--mat-mdc-form-field-floating-label-scale))}.mat-mdc-form-field .mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:var(--mat-form-field-outlined-label-text-populated-size)}[dir=rtl] .mat-mdc-form-field{text-align:right}.mat-mdc-form-field-flex{display:inline-flex;align-items:baseline;box-sizing:border-box;width:100%}.mat-mdc-text-field-wrapper{width:100%;z-index:0}.mat-mdc-form-field-icon-prefix,.mat-mdc-form-field-icon-suffix{align-self:center;line-height:0;pointer-events:auto;position:relative;z-index:1}.mat-mdc-form-field-icon-prefix>.mat-icon,.mat-mdc-form-field-icon-suffix>.mat-icon{padding:0 12px;box-sizing:content-box}.mat-mdc-form-field-icon-prefix{color:var(--mat-form-field-leading-icon-color, var(--mat-sys-on-surface-variant))}.mat-form-field-disabled .mat-mdc-form-field-icon-prefix{color:var(--mat-form-field-disabled-leading-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-trailing-icon-color, var(--mat-sys-on-surface-variant))}.mat-form-field-disabled .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-disabled-trailing-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-invalid .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-trailing-icon-color, var(--mat-sys-error))}.mat-form-field-invalid:not(.mat-focused):not(.mat-form-field-disabled) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-hover-trailing-icon-color, var(--mat-sys-on-error-container))}.mat-form-field-invalid.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-focus-trailing-icon-color, var(--mat-sys-error))}.mat-mdc-form-field-icon-prefix,[dir=rtl] .mat-mdc-form-field-icon-suffix{padding:0 4px 0 0}.mat-mdc-form-field-icon-suffix,[dir=rtl] .mat-mdc-form-field-icon-prefix{padding:0 0 0 4px}.mat-mdc-form-field-subscript-wrapper .mat-icon,.mat-mdc-form-field label .mat-icon{width:1em;height:1em;font-size:inherit}.mat-mdc-form-field-infix{flex:auto;min-width:0;width:180px;position:relative;box-sizing:border-box}.mat-mdc-form-field-infix:has(textarea[cols]){width:auto}.mat-mdc-form-field .mdc-notched-outline__notch{margin-left:-1px;-webkit-clip-path:inset(-9em -999em -9em 1px);clip-path:inset(-9em -999em -9em 1px)}[dir=rtl] .mat-mdc-form-field .mdc-notched-outline__notch{margin-left:0;margin-right:-1px;-webkit-clip-path:inset(-9em 1px -9em -999em);clip-path:inset(-9em 1px -9em -999em)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-floating-label{transition:transform 150ms cubic-bezier(0.4, 0, 0.2, 1),color 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input{transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::-moz-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::-webkit-input-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input:-ms-input-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::-moz-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::-moz-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::-webkit-input-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::-webkit-input-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field--filled:not(.mdc-ripple-upgraded):focus .mdc-text-field__ripple::before{transition-duration:75ms}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-line-ripple::after{transition:transform 180ms cubic-bezier(0.4, 0, 0.2, 1),opacity 180ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-error-wrapper{animation-duration:300ms}.mdc-notched-outline .mdc-floating-label{max-width:calc(100% + 1px)}.mdc-notched-outline--upgraded .mdc-floating-label--float-above{max-width:calc(133.3333333333% + 1px)}\n"], dependencies: [{ kind: "directive", type: MatFormFieldFloatingLabel, selector: "label[matFormFieldFloatingLabel]", inputs: ["floating", "monitorResize"] }, { kind: "component", type: MatFormFieldNotchedOutline, selector: "div[matFormFieldNotchedOutline]", inputs: ["matFormFieldNotchedOutlineOpen"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MatFormFieldLineRipple, selector: "div[matFormFieldLineRipple]" }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1010
+ return document.documentElement.contains(element);
1011
+ }
1012
+ static ɵfac = i0.ɵɵngDeclareFactory({
1013
+ minVersion: "12.0.0",
1014
+ version: "20.2.0-next.2",
1015
+ ngImport: i0,
1016
+ type: MatFormField,
1017
+ deps: [],
1018
+ target: i0.ɵɵFactoryTarget.Component
1019
+ });
1020
+ static ɵcmp = i0.ɵɵngDeclareComponent({
1021
+ minVersion: "17.0.0",
1022
+ version: "20.2.0-next.2",
1023
+ type: MatFormField,
1024
+ isStandalone: true,
1025
+ selector: "mat-form-field",
1026
+ inputs: {
1027
+ hideRequiredMarker: "hideRequiredMarker",
1028
+ color: "color",
1029
+ floatLabel: "floatLabel",
1030
+ appearance: "appearance",
1031
+ subscriptSizing: "subscriptSizing",
1032
+ hintLabel: "hintLabel"
1033
+ },
1034
+ host: {
1035
+ properties: {
1036
+ "class.mat-mdc-form-field-label-always-float": "_shouldAlwaysFloat()",
1037
+ "class.mat-mdc-form-field-has-icon-prefix": "_hasIconPrefix",
1038
+ "class.mat-mdc-form-field-has-icon-suffix": "_hasIconSuffix",
1039
+ "class.mat-form-field-invalid": "_control.errorState",
1040
+ "class.mat-form-field-disabled": "_control.disabled",
1041
+ "class.mat-form-field-autofilled": "_control.autofilled",
1042
+ "class.mat-form-field-appearance-fill": "appearance == \"fill\"",
1043
+ "class.mat-form-field-appearance-outline": "appearance == \"outline\"",
1044
+ "class.mat-form-field-hide-placeholder": "_hasFloatingLabel() && !_shouldLabelFloat()",
1045
+ "class.mat-primary": "color !== \"accent\" && color !== \"warn\"",
1046
+ "class.mat-accent": "color === \"accent\"",
1047
+ "class.mat-warn": "color === \"warn\"",
1048
+ "class.ng-untouched": "_shouldForward(\"untouched\")",
1049
+ "class.ng-touched": "_shouldForward(\"touched\")",
1050
+ "class.ng-pristine": "_shouldForward(\"pristine\")",
1051
+ "class.ng-dirty": "_shouldForward(\"dirty\")",
1052
+ "class.ng-valid": "_shouldForward(\"valid\")",
1053
+ "class.ng-invalid": "_shouldForward(\"invalid\")",
1054
+ "class.ng-pending": "_shouldForward(\"pending\")"
1055
+ },
1056
+ classAttribute: "mat-mdc-form-field"
1057
+ },
1058
+ providers: [{
1059
+ provide: MAT_FORM_FIELD,
1060
+ useExisting: MatFormField
1061
+ }, {
1062
+ provide: FLOATING_LABEL_PARENT,
1063
+ useExisting: MatFormField
1064
+ }],
1065
+ queries: [{
1066
+ propertyName: "_labelChild",
1067
+ first: true,
1068
+ predicate: MatLabel,
1069
+ descendants: true,
1070
+ isSignal: true
1071
+ }, {
1072
+ propertyName: "_formFieldControl",
1073
+ first: true,
1074
+ predicate: MatFormFieldControl,
1075
+ descendants: true
1076
+ }, {
1077
+ propertyName: "_prefixChildren",
1078
+ predicate: MAT_PREFIX,
1079
+ descendants: true
1080
+ }, {
1081
+ propertyName: "_suffixChildren",
1082
+ predicate: MAT_SUFFIX,
1083
+ descendants: true
1084
+ }, {
1085
+ propertyName: "_errorChildren",
1086
+ predicate: MAT_ERROR,
1087
+ descendants: true
1088
+ }, {
1089
+ propertyName: "_hintChildren",
1090
+ predicate: MatHint,
1091
+ descendants: true
1092
+ }],
1093
+ viewQueries: [{
1094
+ propertyName: "_iconPrefixContainerSignal",
1095
+ first: true,
1096
+ predicate: ["iconPrefixContainer"],
1097
+ descendants: true,
1098
+ isSignal: true
1099
+ }, {
1100
+ propertyName: "_textPrefixContainerSignal",
1101
+ first: true,
1102
+ predicate: ["textPrefixContainer"],
1103
+ descendants: true,
1104
+ isSignal: true
1105
+ }, {
1106
+ propertyName: "_iconSuffixContainerSignal",
1107
+ first: true,
1108
+ predicate: ["iconSuffixContainer"],
1109
+ descendants: true,
1110
+ isSignal: true
1111
+ }, {
1112
+ propertyName: "_textSuffixContainerSignal",
1113
+ first: true,
1114
+ predicate: ["textSuffixContainer"],
1115
+ descendants: true,
1116
+ isSignal: true
1117
+ }, {
1118
+ propertyName: "_textField",
1119
+ first: true,
1120
+ predicate: ["textField"],
1121
+ descendants: true
1122
+ }, {
1123
+ propertyName: "_iconPrefixContainer",
1124
+ first: true,
1125
+ predicate: ["iconPrefixContainer"],
1126
+ descendants: true
1127
+ }, {
1128
+ propertyName: "_textPrefixContainer",
1129
+ first: true,
1130
+ predicate: ["textPrefixContainer"],
1131
+ descendants: true
1132
+ }, {
1133
+ propertyName: "_iconSuffixContainer",
1134
+ first: true,
1135
+ predicate: ["iconSuffixContainer"],
1136
+ descendants: true
1137
+ }, {
1138
+ propertyName: "_textSuffixContainer",
1139
+ first: true,
1140
+ predicate: ["textSuffixContainer"],
1141
+ descendants: true
1142
+ }, {
1143
+ propertyName: "_floatingLabel",
1144
+ first: true,
1145
+ predicate: MatFormFieldFloatingLabel,
1146
+ descendants: true
1147
+ }, {
1148
+ propertyName: "_notchedOutline",
1149
+ first: true,
1150
+ predicate: MatFormFieldNotchedOutline,
1151
+ descendants: true
1152
+ }, {
1153
+ propertyName: "_lineRipple",
1154
+ first: true,
1155
+ predicate: MatFormFieldLineRipple,
1156
+ descendants: true
1157
+ }],
1158
+ exportAs: ["matFormField"],
1159
+ ngImport: i0,
1160
+ template: "<ng-template #labelTemplate>\n <!--\n MDC recommends that the text-field is a `<label>` element. This rather complicates the\n setup because it would require every form-field control to explicitly set `aria-labelledby`.\n This is because the `<label>` itself contains more than the actual label (e.g. prefix, suffix\n or other projected content), and screen readers could potentially read out undesired content.\n Excluding elements from being printed out requires them to be marked with `aria-hidden`, or\n the form control is set to a scoped element for the label (using `aria-labelledby`). Both of\n these options seem to complicate the setup because we know exactly what content is rendered\n as part of the label, and we don't want to spend resources on walking through projected content\n to set `aria-hidden`. Nor do we want to set `aria-labelledby` on every form control if we could\n simply link the label to the control using the label `for` attribute.\n -->\n @if (_hasFloatingLabel()) {\n <label\n matFormFieldFloatingLabel\n [floating]=\"_shouldLabelFloat()\"\n [monitorResize]=\"_hasOutline()\"\n [id]=\"_labelId\"\n [attr.for]=\"_control.disableAutomaticLabeling ? null : _control.id\"\n >\n <ng-content select=\"mat-label\"></ng-content>\n <!--\n We set the required marker as a separate element, in order to make it easier to target if\n apps want to override it and to be able to set `aria-hidden` so that screen readers don't\n pick it up.\n -->\n @if (!hideRequiredMarker && _control.required) {\n <span\n aria-hidden=\"true\"\n class=\"mat-mdc-form-field-required-marker mdc-floating-label--required\"\n ></span>\n }\n </label>\n }\n</ng-template>\n\n<div\n class=\"mat-mdc-text-field-wrapper mdc-text-field\"\n #textField\n [class.mdc-text-field--filled]=\"!_hasOutline()\"\n [class.mdc-text-field--outlined]=\"_hasOutline()\"\n [class.mdc-text-field--no-label]=\"!_hasFloatingLabel()\"\n [class.mdc-text-field--disabled]=\"_control.disabled\"\n [class.mdc-text-field--invalid]=\"_control.errorState\"\n (click)=\"_control.onContainerClick($event)\"\n>\n @if (!_hasOutline() && !_control.disabled) {\n <div class=\"mat-mdc-form-field-focus-overlay\"></div>\n }\n <div class=\"mat-mdc-form-field-flex\">\n @if (_hasOutline()) {\n <div matFormFieldNotchedOutline [matFormFieldNotchedOutlineOpen]=\"_shouldLabelFloat()\">\n @if (!_forceDisplayInfixLabel()) {\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n }\n </div>\n }\n\n @if (_hasIconPrefix) {\n <div class=\"mat-mdc-form-field-icon-prefix\" #iconPrefixContainer>\n <ng-content select=\"[matPrefix], [matIconPrefix]\"></ng-content>\n </div>\n }\n\n @if (_hasTextPrefix) {\n <div class=\"mat-mdc-form-field-text-prefix\" #textPrefixContainer>\n <ng-content select=\"[matTextPrefix]\"></ng-content>\n </div>\n }\n\n <div class=\"mat-mdc-form-field-infix\">\n @if (!_hasOutline() || _forceDisplayInfixLabel()) {\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n }\n\n <ng-content></ng-content>\n </div>\n\n @if (_hasTextSuffix) {\n <div class=\"mat-mdc-form-field-text-suffix\" #textSuffixContainer>\n <ng-content select=\"[matTextSuffix]\"></ng-content>\n </div>\n }\n\n @if (_hasIconSuffix) {\n <div class=\"mat-mdc-form-field-icon-suffix\" #iconSuffixContainer>\n <ng-content select=\"[matSuffix], [matIconSuffix]\"></ng-content>\n </div>\n }\n </div>\n\n @if (!_hasOutline()) {\n <div matFormFieldLineRipple></div>\n }\n</div>\n\n<div aria-atomic=\"true\" aria-live=\"polite\"\n class=\"mat-mdc-form-field-subscript-wrapper mat-mdc-form-field-bottom-align\"\n [class.mat-mdc-form-field-subscript-dynamic-size]=\"subscriptSizing === 'dynamic'\"\n>\n @let subscriptMessageType = _getSubscriptMessageType();\n\n @switch (subscriptMessageType) {\n @case ('error') {\n <div class=\"mat-mdc-form-field-error-wrapper\">\n <ng-content select=\"mat-error, [matError]\"></ng-content>\n </div>\n }\n\n @case ('hint') {\n <div class=\"mat-mdc-form-field-hint-wrapper\">\n @if (hintLabel) {\n <mat-hint [id]=\"_hintLabelId\">{{hintLabel}}</mat-hint>\n }\n <ng-content select=\"mat-hint:not([align='end'])\"></ng-content>\n <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n <ng-content select=\"mat-hint[align='end']\"></ng-content>\n </div>\n }\n }\n</div>\n",
1161
+ styles: [".mdc-text-field{display:inline-flex;align-items:baseline;padding:0 16px;position:relative;box-sizing:border-box;overflow:hidden;will-change:opacity,transform,color;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:0;border-bottom-left-radius:0}.mdc-text-field__input{width:100%;min-width:0;border:none;border-radius:0;background:none;padding:0;-moz-appearance:none;-webkit-appearance:none;height:28px}.mdc-text-field__input::-webkit-calendar-picker-indicator,.mdc-text-field__input::-webkit-search-cancel-button{display:none}.mdc-text-field__input::-ms-clear{display:none}.mdc-text-field__input:focus{outline:none}.mdc-text-field__input:invalid{box-shadow:none}.mdc-text-field__input::placeholder{opacity:0}.mdc-text-field__input::-moz-placeholder{opacity:0}.mdc-text-field__input::-webkit-input-placeholder{opacity:0}.mdc-text-field__input:-ms-input-placeholder{opacity:0}.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mdc-text-field--focused .mdc-text-field__input::placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input::-moz-placeholder,.mdc-text-field--focused .mdc-text-field__input::-moz-placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input::-webkit-input-placeholder,.mdc-text-field--focused .mdc-text-field__input::-webkit-input-placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{opacity:1}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::-moz-placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::-webkit-input-placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive:-ms-input-placeholder{opacity:0}.mdc-text-field--outlined .mdc-text-field__input,.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__input{height:100%}.mdc-text-field--outlined .mdc-text-field__input{display:flex;border:none !important;background-color:rgba(0,0,0,0)}.mdc-text-field--disabled .mdc-text-field__input{pointer-events:auto}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input{color:var(--mat-form-field-filled-input-text-color, var(--mat-sys-on-surface));caret-color:var(--mat-form-field-filled-caret-color, var(--mat-sys-primary))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{color:var(--mat-form-field-outlined-input-text-color, var(--mat-sys-on-surface));caret-color:var(--mat-form-field-outlined-caret-color, var(--mat-sys-primary))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--mat-form-field-filled-error-caret-color, var(--mat-sys-error))}.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--mat-form-field-outlined-error-caret-color, var(--mat-sys-error))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-text-field__input{color:var(--mat-form-field-filled-disabled-input-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--mat-form-field-outlined-disabled-input-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}@media(forced-colors: active){.mdc-text-field--disabled .mdc-text-field__input{background-color:Window}}.mdc-text-field--filled{height:56px;border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-left-radius:var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small));border-top-right-radius:var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small))}.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:var(--mat-form-field-filled-container-color, var(--mat-sys-surface-variant))}.mdc-text-field--filled.mdc-text-field--disabled{background-color:var(--mat-form-field-filled-disabled-container-color, color-mix(in srgb, var(--mat-sys-on-surface) 4%, transparent))}.mdc-text-field--outlined{height:56px;overflow:visible;padding-right:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)));padding-left:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)) + 4px)}[dir=rtl] .mdc-text-field--outlined{padding-right:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)) + 4px);padding-left:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)))}.mdc-floating-label{position:absolute;left:0;transform-origin:left top;line-height:1.15rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform}[dir=rtl] .mdc-floating-label{right:0;left:auto;transform-origin:right top;text-align:right}.mdc-text-field .mdc-floating-label{top:50%;transform:translateY(-50%);pointer-events:none}.mdc-notched-outline .mdc-floating-label{display:inline-block;position:relative;max-width:100%}.mdc-text-field--outlined .mdc-floating-label{left:4px;right:auto}[dir=rtl] .mdc-text-field--outlined .mdc-floating-label{left:auto;right:4px}.mdc-text-field--filled .mdc-floating-label{left:16px;right:auto}[dir=rtl] .mdc-text-field--filled .mdc-floating-label{left:auto;right:16px}.mdc-text-field--disabled .mdc-floating-label{cursor:default}@media(forced-colors: active){.mdc-text-field--disabled .mdc-floating-label{z-index:1}}.mdc-text-field--filled.mdc-text-field--no-label .mdc-floating-label{display:none}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-filled-focus-label-text-color, var(--mat-sys-primary))}.mdc-text-field--filled:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-floating-label{color:var(--mat-form-field-filled-hover-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-floating-label{color:var(--mat-form-field-filled-disabled-label-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-error-label-text-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-filled-error-focus-label-text-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-floating-label{color:var(--mat-form-field-filled-error-hover-label-text-color, var(--mat-sys-on-error-container))}.mdc-text-field--filled .mdc-floating-label{font-family:var(--mat-form-field-filled-label-text-font, var(--mat-sys-body-large-font));font-size:var(--mat-form-field-filled-label-text-size, var(--mat-sys-body-large-size));font-weight:var(--mat-form-field-filled-label-text-weight, var(--mat-sys-body-large-weight));letter-spacing:var(--mat-form-field-filled-label-text-tracking, var(--mat-sys-body-large-tracking))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mat-form-field-outlined-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-outlined-focus-label-text-color, var(--mat-sys-primary))}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-floating-label{color:var(--mat-form-field-outlined-hover-label-text-color, var(--mat-sys-on-surface))}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-floating-label{color:var(--mat-form-field-outlined-disabled-label-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-outlined-error-label-text-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-outlined-error-focus-label-text-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-floating-label{color:var(--mat-form-field-outlined-error-hover-label-text-color, var(--mat-sys-on-error-container))}.mdc-text-field--outlined .mdc-floating-label{font-family:var(--mat-form-field-outlined-label-text-font, var(--mat-sys-body-large-font));font-size:var(--mat-form-field-outlined-label-text-size, var(--mat-sys-body-large-size));font-weight:var(--mat-form-field-outlined-label-text-weight, var(--mat-sys-body-large-weight));letter-spacing:var(--mat-form-field-outlined-label-text-tracking, var(--mat-sys-body-large-tracking))}.mdc-floating-label--float-above{cursor:auto;transform:translateY(-106%) scale(0.75)}.mdc-text-field--filled .mdc-floating-label--float-above{transform:translateY(-106%) scale(0.75)}.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-37.25px) scale(1);font-size:.75rem}.mdc-notched-outline .mdc-floating-label--float-above{text-overflow:clip}.mdc-notched-outline--upgraded .mdc-floating-label--float-above{max-width:133.3333333333%}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-34.75px) scale(0.75)}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after{margin-left:1px;margin-right:0;content:\"*\"}[dir=rtl] .mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after{margin-left:0;margin-right:1px}.mdc-notched-outline{display:flex;position:absolute;top:0;right:0;left:0;box-sizing:border-box;width:100%;max-width:100%;height:100%;text-align:left;pointer-events:none}[dir=rtl] .mdc-notched-outline{text-align:right}.mdc-text-field--outlined .mdc-notched-outline{z-index:1}.mat-mdc-notch-piece{box-sizing:border-box;height:100%;pointer-events:none;border-top:1px solid;border-bottom:1px solid}.mdc-text-field--focused .mat-mdc-notch-piece{border-width:2px}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-outline-color, var(--mat-sys-outline));border-width:var(--mat-form-field-outlined-outline-width, 1px)}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-hover-outline-color, var(--mat-sys-on-surface))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-focus-outline-color, var(--mat-sys-primary))}.mdc-text-field--outlined.mdc-text-field--disabled .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-disabled-outline-color, color-mix(in srgb, var(--mat-sys-on-surface) 12%, transparent))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-outline-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--focused):hover .mdc-notched-outline .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-hover-outline-color, var(--mat-sys-on-error-container))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-focus-outline-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mat-mdc-notch-piece{border-width:var(--mat-form-field-outlined-focus-outline-width, 2px)}.mdc-notched-outline__leading{border-left:1px solid;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading{width:max(12px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)))}[dir=rtl] .mdc-notched-outline__leading{border-left:none;border-right:1px solid;border-bottom-left-radius:0;border-top-left-radius:0;border-top-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-notched-outline__trailing{flex-grow:1;border-left:none;border-right:1px solid;border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}[dir=rtl] .mdc-notched-outline__trailing{border-left:1px solid;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-notched-outline__notch{flex:0 0 auto;width:auto}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__notch{max-width:min(var(--mat-form-field-notch-max-width, 100%),calc(100% - max(12px, var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))) * 2))}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{max-width:min(100%,calc(100% - max(12px, var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))) * 2))}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:1px}.mdc-text-field--focused.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:2px}.mdc-notched-outline--notched .mdc-notched-outline__notch{padding-left:0;padding-right:8px;border-top:none}[dir=rtl] .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-left:8px;padding-right:0}.mdc-notched-outline--no-label .mdc-notched-outline__notch{display:none}.mdc-line-ripple::before,.mdc-line-ripple::after{position:absolute;bottom:0;left:0;width:100%;border-bottom-style:solid;content:\"\"}.mdc-line-ripple::before{z-index:1;border-bottom-width:var(--mat-form-field-filled-active-indicator-height, 1px)}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-active-indicator-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-hover-active-indicator-color, var(--mat-sys-on-surface))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-disabled-active-indicator-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-error-active-indicator-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--focused):hover .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-error-hover-active-indicator-color, var(--mat-sys-on-error-container))}.mdc-line-ripple::after{transform:scaleX(0);opacity:0;z-index:2}.mdc-text-field--filled .mdc-line-ripple::after{border-bottom-width:var(--mat-form-field-filled-focus-active-indicator-height, 2px)}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:var(--mat-form-field-filled-focus-active-indicator-color, var(--mat-sys-primary))}.mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:var(--mat-form-field-filled-error-focus-active-indicator-color, var(--mat-sys-error))}.mdc-line-ripple--active::after{transform:scaleX(1);opacity:1}.mdc-line-ripple--deactivating::after{opacity:0}.mdc-text-field--disabled{pointer-events:none}.mat-mdc-form-field-textarea-control{vertical-align:middle;resize:vertical;box-sizing:border-box;height:auto;margin:0;padding:0;border:none;overflow:auto}.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font:inherit;letter-spacing:inherit;text-decoration:inherit;text-transform:inherit;border:none}.mat-mdc-form-field .mat-mdc-floating-label.mdc-floating-label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:normal;pointer-events:all;will-change:auto}.mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{cursor:inherit}.mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input,.mat-mdc-text-field-wrapper .mat-mdc-form-field-input-control{height:auto}.mat-mdc-text-field-wrapper .mat-mdc-form-field-input-control.mdc-text-field__input[type=color]{height:23px}.mat-mdc-text-field-wrapper{height:auto;flex:auto;will-change:auto}.mat-mdc-form-field-has-icon-prefix .mat-mdc-text-field-wrapper{padding-left:0;--mat-mdc-form-field-label-offset-x: -16px}.mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-right:0}[dir=rtl] .mat-mdc-text-field-wrapper{padding-left:16px;padding-right:16px}[dir=rtl] .mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-left:0}[dir=rtl] .mat-mdc-form-field-has-icon-prefix .mat-mdc-text-field-wrapper{padding-right:0}.mat-form-field-disabled .mdc-text-field__input::placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-label-always-float .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms;opacity:1}.mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-floating-label{left:auto;right:auto}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input{display:inline-block}.mat-mdc-form-field .mat-mdc-text-field-wrapper.mdc-text-field .mdc-notched-outline__notch{padding-top:0}.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:1px solid rgba(0,0,0,0)}[dir=rtl] .mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:none;border-right:1px solid rgba(0,0,0,0)}.mat-mdc-form-field-infix{min-height:var(--mat-form-field-container-height, 56px);padding-top:var(--mat-form-field-filled-with-label-container-padding-top, 24px);padding-bottom:var(--mat-form-field-filled-with-label-container-padding-bottom, 8px)}.mdc-text-field--outlined .mat-mdc-form-field-infix,.mdc-text-field--no-label .mat-mdc-form-field-infix{padding-top:var(--mat-form-field-container-vertical-padding, 16px);padding-bottom:var(--mat-form-field-container-vertical-padding, 16px)}.mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:calc(var(--mat-form-field-container-height, 56px)/2)}.mdc-text-field--filled .mat-mdc-floating-label{display:var(--mat-form-field-filled-label-display, block)}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY(calc(calc(6.75px + var(--mat-form-field-container-height, 56px) / 2) * -1)) scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));transform:var(--mat-mdc-form-field-label-transform)}@keyframes _mat-form-field-subscript-animation{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.mat-mdc-form-field-subscript-wrapper{box-sizing:border-box;width:100%;position:relative}.mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field-error-wrapper{position:absolute;top:0;left:0;right:0;padding:0 16px;opacity:1;transform:translateY(0);animation:_mat-form-field-subscript-animation 0ms cubic-bezier(0.55, 0, 0.55, 0.2)}.mat-mdc-form-field-subscript-dynamic-size .mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field-subscript-dynamic-size .mat-mdc-form-field-error-wrapper{position:static}.mat-mdc-form-field-bottom-align::before{content:\"\";display:inline-block;height:16px}.mat-mdc-form-field-bottom-align.mat-mdc-form-field-subscript-dynamic-size::before{content:unset}.mat-mdc-form-field-hint-end{order:1}.mat-mdc-form-field-hint-wrapper{display:flex}.mat-mdc-form-field-hint-spacer{flex:1 0 1em}.mat-mdc-form-field-error{display:block;color:var(--mat-form-field-error-text-color, var(--mat-sys-error))}.mat-mdc-form-field-subscript-wrapper,.mat-mdc-form-field-bottom-align::before{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mat-form-field-subscript-text-font, var(--mat-sys-body-small-font));line-height:var(--mat-form-field-subscript-text-line-height, var(--mat-sys-body-small-line-height));font-size:var(--mat-form-field-subscript-text-size, var(--mat-sys-body-small-size));letter-spacing:var(--mat-form-field-subscript-text-tracking, var(--mat-sys-body-small-tracking));font-weight:var(--mat-form-field-subscript-text-weight, var(--mat-sys-body-small-weight))}.mat-mdc-form-field-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;opacity:0;pointer-events:none;background-color:var(--mat-form-field-state-layer-color, var(--mat-sys-on-surface))}.mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-focus-overlay{opacity:var(--mat-form-field-hover-state-layer-opacity, var(--mat-sys-hover-state-layer-opacity))}.mat-mdc-form-field.mat-focused .mat-mdc-form-field-focus-overlay{opacity:var(--mat-form-field-focus-state-layer-opacity, 0)}select.mat-mdc-form-field-input-control{-moz-appearance:none;-webkit-appearance:none;background-color:rgba(0,0,0,0);display:inline-flex;box-sizing:border-box}select.mat-mdc-form-field-input-control:not(:disabled){cursor:pointer}select.mat-mdc-form-field-input-control:not(.mat-mdc-native-select-inline) option{color:var(--mat-form-field-select-option-text-color, var(--mat-sys-neutral10))}select.mat-mdc-form-field-input-control:not(.mat-mdc-native-select-inline) option:disabled{color:var(--mat-form-field-select-disabled-option-text-color, color-mix(in srgb, var(--mat-sys-neutral10) 38%, transparent))}.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after{content:\"\";width:0;height:0;border-left:5px solid rgba(0,0,0,0);border-right:5px solid rgba(0,0,0,0);border-top:5px solid;position:absolute;right:0;top:50%;margin-top:-2.5px;pointer-events:none;color:var(--mat-form-field-enabled-select-arrow-color, var(--mat-sys-on-surface-variant))}[dir=rtl] .mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after{right:auto;left:0}.mat-mdc-form-field-type-mat-native-select.mat-focused .mat-mdc-form-field-infix::after{color:var(--mat-form-field-focus-select-arrow-color, var(--mat-sys-primary))}.mat-mdc-form-field-type-mat-native-select.mat-form-field-disabled .mat-mdc-form-field-infix::after{color:var(--mat-form-field-disabled-select-arrow-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-input-control{padding-right:15px}[dir=rtl] .mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-input-control{padding-right:0;padding-left:15px}@media(forced-colors: active){.mat-form-field-appearance-fill .mat-mdc-text-field-wrapper{outline:solid 1px}}@media(forced-colors: active){.mat-form-field-appearance-fill.mat-form-field-disabled .mat-mdc-text-field-wrapper{outline-color:GrayText}}@media(forced-colors: active){.mat-form-field-appearance-fill.mat-focused .mat-mdc-text-field-wrapper{outline:dashed 3px}}@media(forced-colors: active){.mat-mdc-form-field.mat-focused .mdc-notched-outline{border:dashed 3px}}.mat-mdc-form-field-input-control[type=date],.mat-mdc-form-field-input-control[type=datetime],.mat-mdc-form-field-input-control[type=datetime-local],.mat-mdc-form-field-input-control[type=month],.mat-mdc-form-field-input-control[type=week],.mat-mdc-form-field-input-control[type=time]{line-height:1}.mat-mdc-form-field-input-control::-webkit-datetime-edit{line-height:1;padding:0;margin-bottom:-2px}.mat-mdc-form-field{--mat-mdc-form-field-floating-label-scale: 0.75;display:inline-flex;flex-direction:column;min-width:0;text-align:left;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mat-form-field-container-text-font, var(--mat-sys-body-large-font));line-height:var(--mat-form-field-container-text-line-height, var(--mat-sys-body-large-line-height));font-size:var(--mat-form-field-container-text-size, var(--mat-sys-body-large-size));letter-spacing:var(--mat-form-field-container-text-tracking, var(--mat-sys-body-large-tracking));font-weight:var(--mat-form-field-container-text-weight, var(--mat-sys-body-large-weight))}.mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{font-size:calc(var(--mat-form-field-outlined-label-text-populated-size)*var(--mat-mdc-form-field-floating-label-scale))}.mat-mdc-form-field .mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:var(--mat-form-field-outlined-label-text-populated-size)}[dir=rtl] .mat-mdc-form-field{text-align:right}.mat-mdc-form-field-flex{display:inline-flex;align-items:baseline;box-sizing:border-box;width:100%}.mat-mdc-text-field-wrapper{width:100%;z-index:0}.mat-mdc-form-field-icon-prefix,.mat-mdc-form-field-icon-suffix{align-self:center;line-height:0;pointer-events:auto;position:relative;z-index:1}.mat-mdc-form-field-icon-prefix>.mat-icon,.mat-mdc-form-field-icon-suffix>.mat-icon{padding:0 12px;box-sizing:content-box}.mat-mdc-form-field-icon-prefix{color:var(--mat-form-field-leading-icon-color, var(--mat-sys-on-surface-variant))}.mat-form-field-disabled .mat-mdc-form-field-icon-prefix{color:var(--mat-form-field-disabled-leading-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-trailing-icon-color, var(--mat-sys-on-surface-variant))}.mat-form-field-disabled .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-disabled-trailing-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-invalid .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-trailing-icon-color, var(--mat-sys-error))}.mat-form-field-invalid:not(.mat-focused):not(.mat-form-field-disabled) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-hover-trailing-icon-color, var(--mat-sys-on-error-container))}.mat-form-field-invalid.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-focus-trailing-icon-color, var(--mat-sys-error))}.mat-mdc-form-field-icon-prefix,[dir=rtl] .mat-mdc-form-field-icon-suffix{padding:0 4px 0 0}.mat-mdc-form-field-icon-suffix,[dir=rtl] .mat-mdc-form-field-icon-prefix{padding:0 0 0 4px}.mat-mdc-form-field-subscript-wrapper .mat-icon,.mat-mdc-form-field label .mat-icon{width:1em;height:1em;font-size:inherit}.mat-mdc-form-field-infix{flex:auto;min-width:0;width:180px;position:relative;box-sizing:border-box}.mat-mdc-form-field-infix:has(textarea[cols]){width:auto}.mat-mdc-form-field .mdc-notched-outline__notch{margin-left:-1px;-webkit-clip-path:inset(-9em -999em -9em 1px);clip-path:inset(-9em -999em -9em 1px)}[dir=rtl] .mat-mdc-form-field .mdc-notched-outline__notch{margin-left:0;margin-right:-1px;-webkit-clip-path:inset(-9em 1px -9em -999em);clip-path:inset(-9em 1px -9em -999em)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-floating-label{transition:transform 150ms cubic-bezier(0.4, 0, 0.2, 1),color 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input{transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::-moz-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::-webkit-input-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input:-ms-input-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::-moz-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::-moz-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::-webkit-input-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::-webkit-input-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field--filled:not(.mdc-ripple-upgraded):focus .mdc-text-field__ripple::before{transition-duration:75ms}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-line-ripple::after{transition:transform 180ms cubic-bezier(0.4, 0, 0.2, 1),opacity 180ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-error-wrapper{animation-duration:300ms}.mdc-notched-outline .mdc-floating-label{max-width:calc(100% + 1px)}.mdc-notched-outline--upgraded .mdc-floating-label--float-above{max-width:calc(133.3333333333% + 1px)}\n"],
1162
+ dependencies: [{
1163
+ kind: "directive",
1164
+ type: MatFormFieldFloatingLabel,
1165
+ selector: "label[matFormFieldFloatingLabel]",
1166
+ inputs: ["floating", "monitorResize"]
1167
+ }, {
1168
+ kind: "component",
1169
+ type: MatFormFieldNotchedOutline,
1170
+ selector: "div[matFormFieldNotchedOutline]",
1171
+ inputs: ["matFormFieldNotchedOutlineOpen"]
1172
+ }, {
1173
+ kind: "directive",
1174
+ type: NgTemplateOutlet,
1175
+ selector: "[ngTemplateOutlet]",
1176
+ inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"]
1177
+ }, {
1178
+ kind: "directive",
1179
+ type: MatFormFieldLineRipple,
1180
+ selector: "div[matFormFieldLineRipple]"
1181
+ }, {
1182
+ kind: "directive",
1183
+ type: MatHint,
1184
+ selector: "mat-hint",
1185
+ inputs: ["align", "id"]
1186
+ }],
1187
+ changeDetection: i0.ChangeDetectionStrategy.OnPush,
1188
+ encapsulation: i0.ViewEncapsulation.None
1189
+ });
1023
1190
  }
1024
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0-next.2", ngImport: i0, type: MatFormField, decorators: [{
1025
- type: Component,
1026
- args: [{ selector: 'mat-form-field', exportAs: 'matFormField', host: {
1027
- 'class': 'mat-mdc-form-field',
1028
- '[class.mat-mdc-form-field-label-always-float]': '_shouldAlwaysFloat()',
1029
- '[class.mat-mdc-form-field-has-icon-prefix]': '_hasIconPrefix',
1030
- '[class.mat-mdc-form-field-has-icon-suffix]': '_hasIconSuffix',
1031
- // Note that these classes reuse the same names as the non-MDC version, because they can be
1032
- // considered a public API since custom form controls may use them to style themselves.
1033
- // See https://github.com/angular/components/pull/20502#discussion_r486124901.
1034
- '[class.mat-form-field-invalid]': '_control.errorState',
1035
- '[class.mat-form-field-disabled]': '_control.disabled',
1036
- '[class.mat-form-field-autofilled]': '_control.autofilled',
1037
- '[class.mat-form-field-appearance-fill]': 'appearance == "fill"',
1038
- '[class.mat-form-field-appearance-outline]': 'appearance == "outline"',
1039
- '[class.mat-form-field-hide-placeholder]': '_hasFloatingLabel() && !_shouldLabelFloat()',
1040
- '[class.mat-primary]': 'color !== "accent" && color !== "warn"',
1041
- '[class.mat-accent]': 'color === "accent"',
1042
- '[class.mat-warn]': 'color === "warn"',
1043
- '[class.ng-untouched]': '_shouldForward("untouched")',
1044
- '[class.ng-touched]': '_shouldForward("touched")',
1045
- '[class.ng-pristine]': '_shouldForward("pristine")',
1046
- '[class.ng-dirty]': '_shouldForward("dirty")',
1047
- '[class.ng-valid]': '_shouldForward("valid")',
1048
- '[class.ng-invalid]': '_shouldForward("invalid")',
1049
- '[class.ng-pending]': '_shouldForward("pending")',
1050
- }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1051
- { provide: MAT_FORM_FIELD, useExisting: MatFormField },
1052
- { provide: FLOATING_LABEL_PARENT, useExisting: MatFormField },
1053
- ], imports: [
1054
- MatFormFieldFloatingLabel,
1055
- MatFormFieldNotchedOutline,
1056
- NgTemplateOutlet,
1057
- MatFormFieldLineRipple,
1058
- MatHint,
1059
- ], template: "<ng-template #labelTemplate>\n <!--\n MDC recommends that the text-field is a `<label>` element. This rather complicates the\n setup because it would require every form-field control to explicitly set `aria-labelledby`.\n This is because the `<label>` itself contains more than the actual label (e.g. prefix, suffix\n or other projected content), and screen readers could potentially read out undesired content.\n Excluding elements from being printed out requires them to be marked with `aria-hidden`, or\n the form control is set to a scoped element for the label (using `aria-labelledby`). Both of\n these options seem to complicate the setup because we know exactly what content is rendered\n as part of the label, and we don't want to spend resources on walking through projected content\n to set `aria-hidden`. Nor do we want to set `aria-labelledby` on every form control if we could\n simply link the label to the control using the label `for` attribute.\n -->\n @if (_hasFloatingLabel()) {\n <label\n matFormFieldFloatingLabel\n [floating]=\"_shouldLabelFloat()\"\n [monitorResize]=\"_hasOutline()\"\n [id]=\"_labelId\"\n [attr.for]=\"_control.disableAutomaticLabeling ? null : _control.id\"\n >\n <ng-content select=\"mat-label\"></ng-content>\n <!--\n We set the required marker as a separate element, in order to make it easier to target if\n apps want to override it and to be able to set `aria-hidden` so that screen readers don't\n pick it up.\n -->\n @if (!hideRequiredMarker && _control.required) {\n <span\n aria-hidden=\"true\"\n class=\"mat-mdc-form-field-required-marker mdc-floating-label--required\"\n ></span>\n }\n </label>\n }\n</ng-template>\n\n<div\n class=\"mat-mdc-text-field-wrapper mdc-text-field\"\n #textField\n [class.mdc-text-field--filled]=\"!_hasOutline()\"\n [class.mdc-text-field--outlined]=\"_hasOutline()\"\n [class.mdc-text-field--no-label]=\"!_hasFloatingLabel()\"\n [class.mdc-text-field--disabled]=\"_control.disabled\"\n [class.mdc-text-field--invalid]=\"_control.errorState\"\n (click)=\"_control.onContainerClick($event)\"\n>\n @if (!_hasOutline() && !_control.disabled) {\n <div class=\"mat-mdc-form-field-focus-overlay\"></div>\n }\n <div class=\"mat-mdc-form-field-flex\">\n @if (_hasOutline()) {\n <div matFormFieldNotchedOutline [matFormFieldNotchedOutlineOpen]=\"_shouldLabelFloat()\">\n @if (!_forceDisplayInfixLabel()) {\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n }\n </div>\n }\n\n @if (_hasIconPrefix) {\n <div class=\"mat-mdc-form-field-icon-prefix\" #iconPrefixContainer>\n <ng-content select=\"[matPrefix], [matIconPrefix]\"></ng-content>\n </div>\n }\n\n @if (_hasTextPrefix) {\n <div class=\"mat-mdc-form-field-text-prefix\" #textPrefixContainer>\n <ng-content select=\"[matTextPrefix]\"></ng-content>\n </div>\n }\n\n <div class=\"mat-mdc-form-field-infix\">\n @if (!_hasOutline() || _forceDisplayInfixLabel()) {\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n }\n\n <ng-content></ng-content>\n </div>\n\n @if (_hasTextSuffix) {\n <div class=\"mat-mdc-form-field-text-suffix\" #textSuffixContainer>\n <ng-content select=\"[matTextSuffix]\"></ng-content>\n </div>\n }\n\n @if (_hasIconSuffix) {\n <div class=\"mat-mdc-form-field-icon-suffix\" #iconSuffixContainer>\n <ng-content select=\"[matSuffix], [matIconSuffix]\"></ng-content>\n </div>\n }\n </div>\n\n @if (!_hasOutline()) {\n <div matFormFieldLineRipple></div>\n }\n</div>\n\n<div aria-atomic=\"true\" aria-live=\"polite\"\n class=\"mat-mdc-form-field-subscript-wrapper mat-mdc-form-field-bottom-align\"\n [class.mat-mdc-form-field-subscript-dynamic-size]=\"subscriptSizing === 'dynamic'\"\n>\n @let subscriptMessageType = _getSubscriptMessageType();\n\n @switch (subscriptMessageType) {\n @case ('error') {\n <div class=\"mat-mdc-form-field-error-wrapper\">\n <ng-content select=\"mat-error, [matError]\"></ng-content>\n </div>\n }\n\n @case ('hint') {\n <div class=\"mat-mdc-form-field-hint-wrapper\">\n @if (hintLabel) {\n <mat-hint [id]=\"_hintLabelId\">{{hintLabel}}</mat-hint>\n }\n <ng-content select=\"mat-hint:not([align='end'])\"></ng-content>\n <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n <ng-content select=\"mat-hint[align='end']\"></ng-content>\n </div>\n }\n }\n</div>\n", styles: [".mdc-text-field{display:inline-flex;align-items:baseline;padding:0 16px;position:relative;box-sizing:border-box;overflow:hidden;will-change:opacity,transform,color;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:0;border-bottom-left-radius:0}.mdc-text-field__input{width:100%;min-width:0;border:none;border-radius:0;background:none;padding:0;-moz-appearance:none;-webkit-appearance:none;height:28px}.mdc-text-field__input::-webkit-calendar-picker-indicator,.mdc-text-field__input::-webkit-search-cancel-button{display:none}.mdc-text-field__input::-ms-clear{display:none}.mdc-text-field__input:focus{outline:none}.mdc-text-field__input:invalid{box-shadow:none}.mdc-text-field__input::placeholder{opacity:0}.mdc-text-field__input::-moz-placeholder{opacity:0}.mdc-text-field__input::-webkit-input-placeholder{opacity:0}.mdc-text-field__input:-ms-input-placeholder{opacity:0}.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mdc-text-field--focused .mdc-text-field__input::placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input::-moz-placeholder,.mdc-text-field--focused .mdc-text-field__input::-moz-placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input::-webkit-input-placeholder,.mdc-text-field--focused .mdc-text-field__input::-webkit-input-placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{opacity:1}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::-moz-placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::-webkit-input-placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive:-ms-input-placeholder{opacity:0}.mdc-text-field--outlined .mdc-text-field__input,.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__input{height:100%}.mdc-text-field--outlined .mdc-text-field__input{display:flex;border:none !important;background-color:rgba(0,0,0,0)}.mdc-text-field--disabled .mdc-text-field__input{pointer-events:auto}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input{color:var(--mat-form-field-filled-input-text-color, var(--mat-sys-on-surface));caret-color:var(--mat-form-field-filled-caret-color, var(--mat-sys-primary))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{color:var(--mat-form-field-outlined-input-text-color, var(--mat-sys-on-surface));caret-color:var(--mat-form-field-outlined-caret-color, var(--mat-sys-primary))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--mat-form-field-filled-error-caret-color, var(--mat-sys-error))}.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--mat-form-field-outlined-error-caret-color, var(--mat-sys-error))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-text-field__input{color:var(--mat-form-field-filled-disabled-input-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--mat-form-field-outlined-disabled-input-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}@media(forced-colors: active){.mdc-text-field--disabled .mdc-text-field__input{background-color:Window}}.mdc-text-field--filled{height:56px;border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-left-radius:var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small));border-top-right-radius:var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small))}.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:var(--mat-form-field-filled-container-color, var(--mat-sys-surface-variant))}.mdc-text-field--filled.mdc-text-field--disabled{background-color:var(--mat-form-field-filled-disabled-container-color, color-mix(in srgb, var(--mat-sys-on-surface) 4%, transparent))}.mdc-text-field--outlined{height:56px;overflow:visible;padding-right:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)));padding-left:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)) + 4px)}[dir=rtl] .mdc-text-field--outlined{padding-right:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)) + 4px);padding-left:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)))}.mdc-floating-label{position:absolute;left:0;transform-origin:left top;line-height:1.15rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform}[dir=rtl] .mdc-floating-label{right:0;left:auto;transform-origin:right top;text-align:right}.mdc-text-field .mdc-floating-label{top:50%;transform:translateY(-50%);pointer-events:none}.mdc-notched-outline .mdc-floating-label{display:inline-block;position:relative;max-width:100%}.mdc-text-field--outlined .mdc-floating-label{left:4px;right:auto}[dir=rtl] .mdc-text-field--outlined .mdc-floating-label{left:auto;right:4px}.mdc-text-field--filled .mdc-floating-label{left:16px;right:auto}[dir=rtl] .mdc-text-field--filled .mdc-floating-label{left:auto;right:16px}.mdc-text-field--disabled .mdc-floating-label{cursor:default}@media(forced-colors: active){.mdc-text-field--disabled .mdc-floating-label{z-index:1}}.mdc-text-field--filled.mdc-text-field--no-label .mdc-floating-label{display:none}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-filled-focus-label-text-color, var(--mat-sys-primary))}.mdc-text-field--filled:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-floating-label{color:var(--mat-form-field-filled-hover-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-floating-label{color:var(--mat-form-field-filled-disabled-label-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-error-label-text-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-filled-error-focus-label-text-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-floating-label{color:var(--mat-form-field-filled-error-hover-label-text-color, var(--mat-sys-on-error-container))}.mdc-text-field--filled .mdc-floating-label{font-family:var(--mat-form-field-filled-label-text-font, var(--mat-sys-body-large-font));font-size:var(--mat-form-field-filled-label-text-size, var(--mat-sys-body-large-size));font-weight:var(--mat-form-field-filled-label-text-weight, var(--mat-sys-body-large-weight));letter-spacing:var(--mat-form-field-filled-label-text-tracking, var(--mat-sys-body-large-tracking))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mat-form-field-outlined-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-outlined-focus-label-text-color, var(--mat-sys-primary))}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-floating-label{color:var(--mat-form-field-outlined-hover-label-text-color, var(--mat-sys-on-surface))}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-floating-label{color:var(--mat-form-field-outlined-disabled-label-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-outlined-error-label-text-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-outlined-error-focus-label-text-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-floating-label{color:var(--mat-form-field-outlined-error-hover-label-text-color, var(--mat-sys-on-error-container))}.mdc-text-field--outlined .mdc-floating-label{font-family:var(--mat-form-field-outlined-label-text-font, var(--mat-sys-body-large-font));font-size:var(--mat-form-field-outlined-label-text-size, var(--mat-sys-body-large-size));font-weight:var(--mat-form-field-outlined-label-text-weight, var(--mat-sys-body-large-weight));letter-spacing:var(--mat-form-field-outlined-label-text-tracking, var(--mat-sys-body-large-tracking))}.mdc-floating-label--float-above{cursor:auto;transform:translateY(-106%) scale(0.75)}.mdc-text-field--filled .mdc-floating-label--float-above{transform:translateY(-106%) scale(0.75)}.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-37.25px) scale(1);font-size:.75rem}.mdc-notched-outline .mdc-floating-label--float-above{text-overflow:clip}.mdc-notched-outline--upgraded .mdc-floating-label--float-above{max-width:133.3333333333%}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-34.75px) scale(0.75)}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after{margin-left:1px;margin-right:0;content:\"*\"}[dir=rtl] .mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after{margin-left:0;margin-right:1px}.mdc-notched-outline{display:flex;position:absolute;top:0;right:0;left:0;box-sizing:border-box;width:100%;max-width:100%;height:100%;text-align:left;pointer-events:none}[dir=rtl] .mdc-notched-outline{text-align:right}.mdc-text-field--outlined .mdc-notched-outline{z-index:1}.mat-mdc-notch-piece{box-sizing:border-box;height:100%;pointer-events:none;border-top:1px solid;border-bottom:1px solid}.mdc-text-field--focused .mat-mdc-notch-piece{border-width:2px}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-outline-color, var(--mat-sys-outline));border-width:var(--mat-form-field-outlined-outline-width, 1px)}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-hover-outline-color, var(--mat-sys-on-surface))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-focus-outline-color, var(--mat-sys-primary))}.mdc-text-field--outlined.mdc-text-field--disabled .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-disabled-outline-color, color-mix(in srgb, var(--mat-sys-on-surface) 12%, transparent))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-outline-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--focused):hover .mdc-notched-outline .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-hover-outline-color, var(--mat-sys-on-error-container))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-focus-outline-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mat-mdc-notch-piece{border-width:var(--mat-form-field-outlined-focus-outline-width, 2px)}.mdc-notched-outline__leading{border-left:1px solid;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading{width:max(12px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)))}[dir=rtl] .mdc-notched-outline__leading{border-left:none;border-right:1px solid;border-bottom-left-radius:0;border-top-left-radius:0;border-top-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-notched-outline__trailing{flex-grow:1;border-left:none;border-right:1px solid;border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}[dir=rtl] .mdc-notched-outline__trailing{border-left:1px solid;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-notched-outline__notch{flex:0 0 auto;width:auto}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__notch{max-width:min(var(--mat-form-field-notch-max-width, 100%),calc(100% - max(12px, var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))) * 2))}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{max-width:min(100%,calc(100% - max(12px, var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))) * 2))}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:1px}.mdc-text-field--focused.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:2px}.mdc-notched-outline--notched .mdc-notched-outline__notch{padding-left:0;padding-right:8px;border-top:none}[dir=rtl] .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-left:8px;padding-right:0}.mdc-notched-outline--no-label .mdc-notched-outline__notch{display:none}.mdc-line-ripple::before,.mdc-line-ripple::after{position:absolute;bottom:0;left:0;width:100%;border-bottom-style:solid;content:\"\"}.mdc-line-ripple::before{z-index:1;border-bottom-width:var(--mat-form-field-filled-active-indicator-height, 1px)}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-active-indicator-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-hover-active-indicator-color, var(--mat-sys-on-surface))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-disabled-active-indicator-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-error-active-indicator-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--focused):hover .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-error-hover-active-indicator-color, var(--mat-sys-on-error-container))}.mdc-line-ripple::after{transform:scaleX(0);opacity:0;z-index:2}.mdc-text-field--filled .mdc-line-ripple::after{border-bottom-width:var(--mat-form-field-filled-focus-active-indicator-height, 2px)}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:var(--mat-form-field-filled-focus-active-indicator-color, var(--mat-sys-primary))}.mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:var(--mat-form-field-filled-error-focus-active-indicator-color, var(--mat-sys-error))}.mdc-line-ripple--active::after{transform:scaleX(1);opacity:1}.mdc-line-ripple--deactivating::after{opacity:0}.mdc-text-field--disabled{pointer-events:none}.mat-mdc-form-field-textarea-control{vertical-align:middle;resize:vertical;box-sizing:border-box;height:auto;margin:0;padding:0;border:none;overflow:auto}.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font:inherit;letter-spacing:inherit;text-decoration:inherit;text-transform:inherit;border:none}.mat-mdc-form-field .mat-mdc-floating-label.mdc-floating-label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:normal;pointer-events:all;will-change:auto}.mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{cursor:inherit}.mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input,.mat-mdc-text-field-wrapper .mat-mdc-form-field-input-control{height:auto}.mat-mdc-text-field-wrapper .mat-mdc-form-field-input-control.mdc-text-field__input[type=color]{height:23px}.mat-mdc-text-field-wrapper{height:auto;flex:auto;will-change:auto}.mat-mdc-form-field-has-icon-prefix .mat-mdc-text-field-wrapper{padding-left:0;--mat-mdc-form-field-label-offset-x: -16px}.mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-right:0}[dir=rtl] .mat-mdc-text-field-wrapper{padding-left:16px;padding-right:16px}[dir=rtl] .mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-left:0}[dir=rtl] .mat-mdc-form-field-has-icon-prefix .mat-mdc-text-field-wrapper{padding-right:0}.mat-form-field-disabled .mdc-text-field__input::placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-label-always-float .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms;opacity:1}.mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-floating-label{left:auto;right:auto}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input{display:inline-block}.mat-mdc-form-field .mat-mdc-text-field-wrapper.mdc-text-field .mdc-notched-outline__notch{padding-top:0}.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:1px solid rgba(0,0,0,0)}[dir=rtl] .mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:none;border-right:1px solid rgba(0,0,0,0)}.mat-mdc-form-field-infix{min-height:var(--mat-form-field-container-height, 56px);padding-top:var(--mat-form-field-filled-with-label-container-padding-top, 24px);padding-bottom:var(--mat-form-field-filled-with-label-container-padding-bottom, 8px)}.mdc-text-field--outlined .mat-mdc-form-field-infix,.mdc-text-field--no-label .mat-mdc-form-field-infix{padding-top:var(--mat-form-field-container-vertical-padding, 16px);padding-bottom:var(--mat-form-field-container-vertical-padding, 16px)}.mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:calc(var(--mat-form-field-container-height, 56px)/2)}.mdc-text-field--filled .mat-mdc-floating-label{display:var(--mat-form-field-filled-label-display, block)}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY(calc(calc(6.75px + var(--mat-form-field-container-height, 56px) / 2) * -1)) scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));transform:var(--mat-mdc-form-field-label-transform)}@keyframes _mat-form-field-subscript-animation{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.mat-mdc-form-field-subscript-wrapper{box-sizing:border-box;width:100%;position:relative}.mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field-error-wrapper{position:absolute;top:0;left:0;right:0;padding:0 16px;opacity:1;transform:translateY(0);animation:_mat-form-field-subscript-animation 0ms cubic-bezier(0.55, 0, 0.55, 0.2)}.mat-mdc-form-field-subscript-dynamic-size .mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field-subscript-dynamic-size .mat-mdc-form-field-error-wrapper{position:static}.mat-mdc-form-field-bottom-align::before{content:\"\";display:inline-block;height:16px}.mat-mdc-form-field-bottom-align.mat-mdc-form-field-subscript-dynamic-size::before{content:unset}.mat-mdc-form-field-hint-end{order:1}.mat-mdc-form-field-hint-wrapper{display:flex}.mat-mdc-form-field-hint-spacer{flex:1 0 1em}.mat-mdc-form-field-error{display:block;color:var(--mat-form-field-error-text-color, var(--mat-sys-error))}.mat-mdc-form-field-subscript-wrapper,.mat-mdc-form-field-bottom-align::before{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mat-form-field-subscript-text-font, var(--mat-sys-body-small-font));line-height:var(--mat-form-field-subscript-text-line-height, var(--mat-sys-body-small-line-height));font-size:var(--mat-form-field-subscript-text-size, var(--mat-sys-body-small-size));letter-spacing:var(--mat-form-field-subscript-text-tracking, var(--mat-sys-body-small-tracking));font-weight:var(--mat-form-field-subscript-text-weight, var(--mat-sys-body-small-weight))}.mat-mdc-form-field-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;opacity:0;pointer-events:none;background-color:var(--mat-form-field-state-layer-color, var(--mat-sys-on-surface))}.mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-focus-overlay{opacity:var(--mat-form-field-hover-state-layer-opacity, var(--mat-sys-hover-state-layer-opacity))}.mat-mdc-form-field.mat-focused .mat-mdc-form-field-focus-overlay{opacity:var(--mat-form-field-focus-state-layer-opacity, 0)}select.mat-mdc-form-field-input-control{-moz-appearance:none;-webkit-appearance:none;background-color:rgba(0,0,0,0);display:inline-flex;box-sizing:border-box}select.mat-mdc-form-field-input-control:not(:disabled){cursor:pointer}select.mat-mdc-form-field-input-control:not(.mat-mdc-native-select-inline) option{color:var(--mat-form-field-select-option-text-color, var(--mat-sys-neutral10))}select.mat-mdc-form-field-input-control:not(.mat-mdc-native-select-inline) option:disabled{color:var(--mat-form-field-select-disabled-option-text-color, color-mix(in srgb, var(--mat-sys-neutral10) 38%, transparent))}.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after{content:\"\";width:0;height:0;border-left:5px solid rgba(0,0,0,0);border-right:5px solid rgba(0,0,0,0);border-top:5px solid;position:absolute;right:0;top:50%;margin-top:-2.5px;pointer-events:none;color:var(--mat-form-field-enabled-select-arrow-color, var(--mat-sys-on-surface-variant))}[dir=rtl] .mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after{right:auto;left:0}.mat-mdc-form-field-type-mat-native-select.mat-focused .mat-mdc-form-field-infix::after{color:var(--mat-form-field-focus-select-arrow-color, var(--mat-sys-primary))}.mat-mdc-form-field-type-mat-native-select.mat-form-field-disabled .mat-mdc-form-field-infix::after{color:var(--mat-form-field-disabled-select-arrow-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-input-control{padding-right:15px}[dir=rtl] .mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-input-control{padding-right:0;padding-left:15px}@media(forced-colors: active){.mat-form-field-appearance-fill .mat-mdc-text-field-wrapper{outline:solid 1px}}@media(forced-colors: active){.mat-form-field-appearance-fill.mat-form-field-disabled .mat-mdc-text-field-wrapper{outline-color:GrayText}}@media(forced-colors: active){.mat-form-field-appearance-fill.mat-focused .mat-mdc-text-field-wrapper{outline:dashed 3px}}@media(forced-colors: active){.mat-mdc-form-field.mat-focused .mdc-notched-outline{border:dashed 3px}}.mat-mdc-form-field-input-control[type=date],.mat-mdc-form-field-input-control[type=datetime],.mat-mdc-form-field-input-control[type=datetime-local],.mat-mdc-form-field-input-control[type=month],.mat-mdc-form-field-input-control[type=week],.mat-mdc-form-field-input-control[type=time]{line-height:1}.mat-mdc-form-field-input-control::-webkit-datetime-edit{line-height:1;padding:0;margin-bottom:-2px}.mat-mdc-form-field{--mat-mdc-form-field-floating-label-scale: 0.75;display:inline-flex;flex-direction:column;min-width:0;text-align:left;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mat-form-field-container-text-font, var(--mat-sys-body-large-font));line-height:var(--mat-form-field-container-text-line-height, var(--mat-sys-body-large-line-height));font-size:var(--mat-form-field-container-text-size, var(--mat-sys-body-large-size));letter-spacing:var(--mat-form-field-container-text-tracking, var(--mat-sys-body-large-tracking));font-weight:var(--mat-form-field-container-text-weight, var(--mat-sys-body-large-weight))}.mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{font-size:calc(var(--mat-form-field-outlined-label-text-populated-size)*var(--mat-mdc-form-field-floating-label-scale))}.mat-mdc-form-field .mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:var(--mat-form-field-outlined-label-text-populated-size)}[dir=rtl] .mat-mdc-form-field{text-align:right}.mat-mdc-form-field-flex{display:inline-flex;align-items:baseline;box-sizing:border-box;width:100%}.mat-mdc-text-field-wrapper{width:100%;z-index:0}.mat-mdc-form-field-icon-prefix,.mat-mdc-form-field-icon-suffix{align-self:center;line-height:0;pointer-events:auto;position:relative;z-index:1}.mat-mdc-form-field-icon-prefix>.mat-icon,.mat-mdc-form-field-icon-suffix>.mat-icon{padding:0 12px;box-sizing:content-box}.mat-mdc-form-field-icon-prefix{color:var(--mat-form-field-leading-icon-color, var(--mat-sys-on-surface-variant))}.mat-form-field-disabled .mat-mdc-form-field-icon-prefix{color:var(--mat-form-field-disabled-leading-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-trailing-icon-color, var(--mat-sys-on-surface-variant))}.mat-form-field-disabled .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-disabled-trailing-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-invalid .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-trailing-icon-color, var(--mat-sys-error))}.mat-form-field-invalid:not(.mat-focused):not(.mat-form-field-disabled) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-hover-trailing-icon-color, var(--mat-sys-on-error-container))}.mat-form-field-invalid.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-focus-trailing-icon-color, var(--mat-sys-error))}.mat-mdc-form-field-icon-prefix,[dir=rtl] .mat-mdc-form-field-icon-suffix{padding:0 4px 0 0}.mat-mdc-form-field-icon-suffix,[dir=rtl] .mat-mdc-form-field-icon-prefix{padding:0 0 0 4px}.mat-mdc-form-field-subscript-wrapper .mat-icon,.mat-mdc-form-field label .mat-icon{width:1em;height:1em;font-size:inherit}.mat-mdc-form-field-infix{flex:auto;min-width:0;width:180px;position:relative;box-sizing:border-box}.mat-mdc-form-field-infix:has(textarea[cols]){width:auto}.mat-mdc-form-field .mdc-notched-outline__notch{margin-left:-1px;-webkit-clip-path:inset(-9em -999em -9em 1px);clip-path:inset(-9em -999em -9em 1px)}[dir=rtl] .mat-mdc-form-field .mdc-notched-outline__notch{margin-left:0;margin-right:-1px;-webkit-clip-path:inset(-9em 1px -9em -999em);clip-path:inset(-9em 1px -9em -999em)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-floating-label{transition:transform 150ms cubic-bezier(0.4, 0, 0.2, 1),color 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input{transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::-moz-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::-webkit-input-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input:-ms-input-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::-moz-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::-moz-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::-webkit-input-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::-webkit-input-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field--filled:not(.mdc-ripple-upgraded):focus .mdc-text-field__ripple::before{transition-duration:75ms}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-line-ripple::after{transition:transform 180ms cubic-bezier(0.4, 0, 0.2, 1),opacity 180ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-error-wrapper{animation-duration:300ms}.mdc-notched-outline .mdc-floating-label{max-width:calc(100% + 1px)}.mdc-notched-outline--upgraded .mdc-floating-label--float-above{max-width:calc(133.3333333333% + 1px)}\n"] }]
1060
- }], ctorParameters: () => [], propDecorators: { _textField: [{
1061
- type: ViewChild,
1062
- args: ['textField']
1063
- }], _iconPrefixContainer: [{
1064
- type: ViewChild,
1065
- args: ['iconPrefixContainer']
1066
- }], _textPrefixContainer: [{
1067
- type: ViewChild,
1068
- args: ['textPrefixContainer']
1069
- }], _iconSuffixContainer: [{
1070
- type: ViewChild,
1071
- args: ['iconSuffixContainer']
1072
- }], _textSuffixContainer: [{
1073
- type: ViewChild,
1074
- args: ['textSuffixContainer']
1075
- }], _floatingLabel: [{
1076
- type: ViewChild,
1077
- args: [MatFormFieldFloatingLabel]
1078
- }], _notchedOutline: [{
1079
- type: ViewChild,
1080
- args: [MatFormFieldNotchedOutline]
1081
- }], _lineRipple: [{
1082
- type: ViewChild,
1083
- args: [MatFormFieldLineRipple]
1084
- }], _formFieldControl: [{
1085
- type: ContentChild,
1086
- args: [MatFormFieldControl]
1087
- }], _prefixChildren: [{
1088
- type: ContentChildren,
1089
- args: [MAT_PREFIX, { descendants: true }]
1090
- }], _suffixChildren: [{
1091
- type: ContentChildren,
1092
- args: [MAT_SUFFIX, { descendants: true }]
1093
- }], _errorChildren: [{
1094
- type: ContentChildren,
1095
- args: [MAT_ERROR, { descendants: true }]
1096
- }], _hintChildren: [{
1097
- type: ContentChildren,
1098
- args: [MatHint, { descendants: true }]
1099
- }], hideRequiredMarker: [{
1100
- type: Input
1101
- }], color: [{
1102
- type: Input
1103
- }], floatLabel: [{
1104
- type: Input
1105
- }], appearance: [{
1106
- type: Input
1107
- }], subscriptSizing: [{
1108
- type: Input
1109
- }], hintLabel: [{
1110
- type: Input
1111
- }] } });
1191
+ i0.ɵɵngDeclareClassMetadata({
1192
+ minVersion: "12.0.0",
1193
+ version: "20.2.0-next.2",
1194
+ ngImport: i0,
1195
+ type: MatFormField,
1196
+ decorators: [{
1197
+ type: Component,
1198
+ args: [{
1199
+ selector: 'mat-form-field',
1200
+ exportAs: 'matFormField',
1201
+ host: {
1202
+ 'class': 'mat-mdc-form-field',
1203
+ '[class.mat-mdc-form-field-label-always-float]': '_shouldAlwaysFloat()',
1204
+ '[class.mat-mdc-form-field-has-icon-prefix]': '_hasIconPrefix',
1205
+ '[class.mat-mdc-form-field-has-icon-suffix]': '_hasIconSuffix',
1206
+ '[class.mat-form-field-invalid]': '_control.errorState',
1207
+ '[class.mat-form-field-disabled]': '_control.disabled',
1208
+ '[class.mat-form-field-autofilled]': '_control.autofilled',
1209
+ '[class.mat-form-field-appearance-fill]': 'appearance == "fill"',
1210
+ '[class.mat-form-field-appearance-outline]': 'appearance == "outline"',
1211
+ '[class.mat-form-field-hide-placeholder]': '_hasFloatingLabel() && !_shouldLabelFloat()',
1212
+ '[class.mat-primary]': 'color !== "accent" && color !== "warn"',
1213
+ '[class.mat-accent]': 'color === "accent"',
1214
+ '[class.mat-warn]': 'color === "warn"',
1215
+ '[class.ng-untouched]': '_shouldForward("untouched")',
1216
+ '[class.ng-touched]': '_shouldForward("touched")',
1217
+ '[class.ng-pristine]': '_shouldForward("pristine")',
1218
+ '[class.ng-dirty]': '_shouldForward("dirty")',
1219
+ '[class.ng-valid]': '_shouldForward("valid")',
1220
+ '[class.ng-invalid]': '_shouldForward("invalid")',
1221
+ '[class.ng-pending]': '_shouldForward("pending")'
1222
+ },
1223
+ encapsulation: ViewEncapsulation.None,
1224
+ changeDetection: ChangeDetectionStrategy.OnPush,
1225
+ providers: [{
1226
+ provide: MAT_FORM_FIELD,
1227
+ useExisting: MatFormField
1228
+ }, {
1229
+ provide: FLOATING_LABEL_PARENT,
1230
+ useExisting: MatFormField
1231
+ }],
1232
+ imports: [MatFormFieldFloatingLabel, MatFormFieldNotchedOutline, NgTemplateOutlet, MatFormFieldLineRipple, MatHint],
1233
+ template: "<ng-template #labelTemplate>\n <!--\n MDC recommends that the text-field is a `<label>` element. This rather complicates the\n setup because it would require every form-field control to explicitly set `aria-labelledby`.\n This is because the `<label>` itself contains more than the actual label (e.g. prefix, suffix\n or other projected content), and screen readers could potentially read out undesired content.\n Excluding elements from being printed out requires them to be marked with `aria-hidden`, or\n the form control is set to a scoped element for the label (using `aria-labelledby`). Both of\n these options seem to complicate the setup because we know exactly what content is rendered\n as part of the label, and we don't want to spend resources on walking through projected content\n to set `aria-hidden`. Nor do we want to set `aria-labelledby` on every form control if we could\n simply link the label to the control using the label `for` attribute.\n -->\n @if (_hasFloatingLabel()) {\n <label\n matFormFieldFloatingLabel\n [floating]=\"_shouldLabelFloat()\"\n [monitorResize]=\"_hasOutline()\"\n [id]=\"_labelId\"\n [attr.for]=\"_control.disableAutomaticLabeling ? null : _control.id\"\n >\n <ng-content select=\"mat-label\"></ng-content>\n <!--\n We set the required marker as a separate element, in order to make it easier to target if\n apps want to override it and to be able to set `aria-hidden` so that screen readers don't\n pick it up.\n -->\n @if (!hideRequiredMarker && _control.required) {\n <span\n aria-hidden=\"true\"\n class=\"mat-mdc-form-field-required-marker mdc-floating-label--required\"\n ></span>\n }\n </label>\n }\n</ng-template>\n\n<div\n class=\"mat-mdc-text-field-wrapper mdc-text-field\"\n #textField\n [class.mdc-text-field--filled]=\"!_hasOutline()\"\n [class.mdc-text-field--outlined]=\"_hasOutline()\"\n [class.mdc-text-field--no-label]=\"!_hasFloatingLabel()\"\n [class.mdc-text-field--disabled]=\"_control.disabled\"\n [class.mdc-text-field--invalid]=\"_control.errorState\"\n (click)=\"_control.onContainerClick($event)\"\n>\n @if (!_hasOutline() && !_control.disabled) {\n <div class=\"mat-mdc-form-field-focus-overlay\"></div>\n }\n <div class=\"mat-mdc-form-field-flex\">\n @if (_hasOutline()) {\n <div matFormFieldNotchedOutline [matFormFieldNotchedOutlineOpen]=\"_shouldLabelFloat()\">\n @if (!_forceDisplayInfixLabel()) {\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n }\n </div>\n }\n\n @if (_hasIconPrefix) {\n <div class=\"mat-mdc-form-field-icon-prefix\" #iconPrefixContainer>\n <ng-content select=\"[matPrefix], [matIconPrefix]\"></ng-content>\n </div>\n }\n\n @if (_hasTextPrefix) {\n <div class=\"mat-mdc-form-field-text-prefix\" #textPrefixContainer>\n <ng-content select=\"[matTextPrefix]\"></ng-content>\n </div>\n }\n\n <div class=\"mat-mdc-form-field-infix\">\n @if (!_hasOutline() || _forceDisplayInfixLabel()) {\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n }\n\n <ng-content></ng-content>\n </div>\n\n @if (_hasTextSuffix) {\n <div class=\"mat-mdc-form-field-text-suffix\" #textSuffixContainer>\n <ng-content select=\"[matTextSuffix]\"></ng-content>\n </div>\n }\n\n @if (_hasIconSuffix) {\n <div class=\"mat-mdc-form-field-icon-suffix\" #iconSuffixContainer>\n <ng-content select=\"[matSuffix], [matIconSuffix]\"></ng-content>\n </div>\n }\n </div>\n\n @if (!_hasOutline()) {\n <div matFormFieldLineRipple></div>\n }\n</div>\n\n<div aria-atomic=\"true\" aria-live=\"polite\"\n class=\"mat-mdc-form-field-subscript-wrapper mat-mdc-form-field-bottom-align\"\n [class.mat-mdc-form-field-subscript-dynamic-size]=\"subscriptSizing === 'dynamic'\"\n>\n @let subscriptMessageType = _getSubscriptMessageType();\n\n @switch (subscriptMessageType) {\n @case ('error') {\n <div class=\"mat-mdc-form-field-error-wrapper\">\n <ng-content select=\"mat-error, [matError]\"></ng-content>\n </div>\n }\n\n @case ('hint') {\n <div class=\"mat-mdc-form-field-hint-wrapper\">\n @if (hintLabel) {\n <mat-hint [id]=\"_hintLabelId\">{{hintLabel}}</mat-hint>\n }\n <ng-content select=\"mat-hint:not([align='end'])\"></ng-content>\n <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n <ng-content select=\"mat-hint[align='end']\"></ng-content>\n </div>\n }\n }\n</div>\n",
1234
+ styles: [".mdc-text-field{display:inline-flex;align-items:baseline;padding:0 16px;position:relative;box-sizing:border-box;overflow:hidden;will-change:opacity,transform,color;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:0;border-bottom-left-radius:0}.mdc-text-field__input{width:100%;min-width:0;border:none;border-radius:0;background:none;padding:0;-moz-appearance:none;-webkit-appearance:none;height:28px}.mdc-text-field__input::-webkit-calendar-picker-indicator,.mdc-text-field__input::-webkit-search-cancel-button{display:none}.mdc-text-field__input::-ms-clear{display:none}.mdc-text-field__input:focus{outline:none}.mdc-text-field__input:invalid{box-shadow:none}.mdc-text-field__input::placeholder{opacity:0}.mdc-text-field__input::-moz-placeholder{opacity:0}.mdc-text-field__input::-webkit-input-placeholder{opacity:0}.mdc-text-field__input:-ms-input-placeholder{opacity:0}.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mdc-text-field--focused .mdc-text-field__input::placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input::-moz-placeholder,.mdc-text-field--focused .mdc-text-field__input::-moz-placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input::-webkit-input-placeholder,.mdc-text-field--focused .mdc-text-field__input::-webkit-input-placeholder{opacity:1}.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{opacity:1}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::-moz-placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive::-webkit-input-placeholder{opacity:0}.mdc-text-field--disabled:not(.mdc-text-field--no-label) .mdc-text-field__input.mat-mdc-input-disabled-interactive:-ms-input-placeholder{opacity:0}.mdc-text-field--outlined .mdc-text-field__input,.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__input{height:100%}.mdc-text-field--outlined .mdc-text-field__input{display:flex;border:none !important;background-color:rgba(0,0,0,0)}.mdc-text-field--disabled .mdc-text-field__input{pointer-events:auto}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input{color:var(--mat-form-field-filled-input-text-color, var(--mat-sys-on-surface));caret-color:var(--mat-form-field-filled-caret-color, var(--mat-sys-primary))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-filled-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{color:var(--mat-form-field-outlined-input-text-color, var(--mat-sys-on-surface));caret-color:var(--mat-form-field-outlined-caret-color, var(--mat-sys-primary))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-outlined-input-text-placeholder-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--mat-form-field-filled-error-caret-color, var(--mat-sys-error))}.mdc-text-field--outlined.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--mat-form-field-outlined-error-caret-color, var(--mat-sys-error))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-text-field__input{color:var(--mat-form-field-filled-disabled-input-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--mat-form-field-outlined-disabled-input-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}@media(forced-colors: active){.mdc-text-field--disabled .mdc-text-field__input{background-color:Window}}.mdc-text-field--filled{height:56px;border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-left-radius:var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small));border-top-right-radius:var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small))}.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:var(--mat-form-field-filled-container-color, var(--mat-sys-surface-variant))}.mdc-text-field--filled.mdc-text-field--disabled{background-color:var(--mat-form-field-filled-disabled-container-color, color-mix(in srgb, var(--mat-sys-on-surface) 4%, transparent))}.mdc-text-field--outlined{height:56px;overflow:visible;padding-right:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)));padding-left:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)) + 4px)}[dir=rtl] .mdc-text-field--outlined{padding-right:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)) + 4px);padding-left:max(16px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)))}.mdc-floating-label{position:absolute;left:0;transform-origin:left top;line-height:1.15rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform}[dir=rtl] .mdc-floating-label{right:0;left:auto;transform-origin:right top;text-align:right}.mdc-text-field .mdc-floating-label{top:50%;transform:translateY(-50%);pointer-events:none}.mdc-notched-outline .mdc-floating-label{display:inline-block;position:relative;max-width:100%}.mdc-text-field--outlined .mdc-floating-label{left:4px;right:auto}[dir=rtl] .mdc-text-field--outlined .mdc-floating-label{left:auto;right:4px}.mdc-text-field--filled .mdc-floating-label{left:16px;right:auto}[dir=rtl] .mdc-text-field--filled .mdc-floating-label{left:auto;right:16px}.mdc-text-field--disabled .mdc-floating-label{cursor:default}@media(forced-colors: active){.mdc-text-field--disabled .mdc-floating-label{z-index:1}}.mdc-text-field--filled.mdc-text-field--no-label .mdc-floating-label{display:none}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-filled-focus-label-text-color, var(--mat-sys-primary))}.mdc-text-field--filled:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-floating-label{color:var(--mat-form-field-filled-hover-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-floating-label{color:var(--mat-form-field-filled-disabled-label-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-error-label-text-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-filled-error-focus-label-text-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-floating-label{color:var(--mat-form-field-filled-error-hover-label-text-color, var(--mat-sys-on-error-container))}.mdc-text-field--filled .mdc-floating-label{font-family:var(--mat-form-field-filled-label-text-font, var(--mat-sys-body-large-font));font-size:var(--mat-form-field-filled-label-text-size, var(--mat-sys-body-large-size));font-weight:var(--mat-form-field-filled-label-text-weight, var(--mat-sys-body-large-weight));letter-spacing:var(--mat-form-field-filled-label-text-tracking, var(--mat-sys-body-large-tracking))}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mat-form-field-outlined-label-text-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-outlined-focus-label-text-color, var(--mat-sys-primary))}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-floating-label{color:var(--mat-form-field-outlined-hover-label-text-color, var(--mat-sys-on-surface))}.mdc-text-field--outlined.mdc-text-field--disabled .mdc-floating-label{color:var(--mat-form-field-outlined-disabled-label-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-outlined-error-label-text-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mdc-floating-label{color:var(--mat-form-field-outlined-error-focus-label-text-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-floating-label{color:var(--mat-form-field-outlined-error-hover-label-text-color, var(--mat-sys-on-error-container))}.mdc-text-field--outlined .mdc-floating-label{font-family:var(--mat-form-field-outlined-label-text-font, var(--mat-sys-body-large-font));font-size:var(--mat-form-field-outlined-label-text-size, var(--mat-sys-body-large-size));font-weight:var(--mat-form-field-outlined-label-text-weight, var(--mat-sys-body-large-weight));letter-spacing:var(--mat-form-field-outlined-label-text-tracking, var(--mat-sys-body-large-tracking))}.mdc-floating-label--float-above{cursor:auto;transform:translateY(-106%) scale(0.75)}.mdc-text-field--filled .mdc-floating-label--float-above{transform:translateY(-106%) scale(0.75)}.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-37.25px) scale(1);font-size:.75rem}.mdc-notched-outline .mdc-floating-label--float-above{text-overflow:clip}.mdc-notched-outline--upgraded .mdc-floating-label--float-above{max-width:133.3333333333%}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-34.75px) scale(0.75)}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after{margin-left:1px;margin-right:0;content:\"*\"}[dir=rtl] .mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after{margin-left:0;margin-right:1px}.mdc-notched-outline{display:flex;position:absolute;top:0;right:0;left:0;box-sizing:border-box;width:100%;max-width:100%;height:100%;text-align:left;pointer-events:none}[dir=rtl] .mdc-notched-outline{text-align:right}.mdc-text-field--outlined .mdc-notched-outline{z-index:1}.mat-mdc-notch-piece{box-sizing:border-box;height:100%;pointer-events:none;border-top:1px solid;border-bottom:1px solid}.mdc-text-field--focused .mat-mdc-notch-piece{border-width:2px}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-outline-color, var(--mat-sys-outline));border-width:var(--mat-form-field-outlined-outline-width, 1px)}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-hover-outline-color, var(--mat-sys-on-surface))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-focus-outline-color, var(--mat-sys-primary))}.mdc-text-field--outlined.mdc-text-field--disabled .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-disabled-outline-color, color-mix(in srgb, var(--mat-sys-on-surface) 12%, transparent))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-outline-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--focused):hover .mdc-notched-outline .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-hover-outline-color, var(--mat-sys-on-error-container))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid.mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--mat-form-field-outlined-error-focus-outline-color, var(--mat-sys-error))}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline .mat-mdc-notch-piece{border-width:var(--mat-form-field-outlined-focus-outline-width, 2px)}.mdc-notched-outline__leading{border-left:1px solid;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading{width:max(12px,var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small)))}[dir=rtl] .mdc-notched-outline__leading{border-left:none;border-right:1px solid;border-bottom-left-radius:0;border-top-left-radius:0;border-top-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-notched-outline__trailing{flex-grow:1;border-left:none;border-right:1px solid;border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}[dir=rtl] .mdc-notched-outline__trailing{border-left:1px solid;border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small));border-bottom-left-radius:var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))}.mdc-notched-outline__notch{flex:0 0 auto;width:auto}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__notch{max-width:min(var(--mat-form-field-notch-max-width, 100%),calc(100% - max(12px, var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))) * 2))}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{max-width:min(100%,calc(100% - max(12px, var(--mat-form-field-outlined-container-shape, var(--mat-sys-corner-extra-small))) * 2))}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:1px}.mdc-text-field--focused.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:2px}.mdc-notched-outline--notched .mdc-notched-outline__notch{padding-left:0;padding-right:8px;border-top:none}[dir=rtl] .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-left:8px;padding-right:0}.mdc-notched-outline--no-label .mdc-notched-outline__notch{display:none}.mdc-line-ripple::before,.mdc-line-ripple::after{position:absolute;bottom:0;left:0;width:100%;border-bottom-style:solid;content:\"\"}.mdc-line-ripple::before{z-index:1;border-bottom-width:var(--mat-form-field-filled-active-indicator-height, 1px)}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-active-indicator-color, var(--mat-sys-on-surface-variant))}.mdc-text-field--filled:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-hover-active-indicator-color, var(--mat-sys-on-surface))}.mdc-text-field--filled.mdc-text-field--disabled .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-disabled-active-indicator-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-error-active-indicator-color, var(--mat-sys-error))}.mdc-text-field--filled:not(.mdc-text-field--disabled).mdc-text-field--invalid:not(.mdc-text-field--focused):hover .mdc-line-ripple::before{border-bottom-color:var(--mat-form-field-filled-error-hover-active-indicator-color, var(--mat-sys-on-error-container))}.mdc-line-ripple::after{transform:scaleX(0);opacity:0;z-index:2}.mdc-text-field--filled .mdc-line-ripple::after{border-bottom-width:var(--mat-form-field-filled-focus-active-indicator-height, 2px)}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:var(--mat-form-field-filled-focus-active-indicator-color, var(--mat-sys-primary))}.mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:var(--mat-form-field-filled-error-focus-active-indicator-color, var(--mat-sys-error))}.mdc-line-ripple--active::after{transform:scaleX(1);opacity:1}.mdc-line-ripple--deactivating::after{opacity:0}.mdc-text-field--disabled{pointer-events:none}.mat-mdc-form-field-textarea-control{vertical-align:middle;resize:vertical;box-sizing:border-box;height:auto;margin:0;padding:0;border:none;overflow:auto}.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font:inherit;letter-spacing:inherit;text-decoration:inherit;text-transform:inherit;border:none}.mat-mdc-form-field .mat-mdc-floating-label.mdc-floating-label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:normal;pointer-events:all;will-change:auto}.mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{cursor:inherit}.mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input,.mat-mdc-text-field-wrapper .mat-mdc-form-field-input-control{height:auto}.mat-mdc-text-field-wrapper .mat-mdc-form-field-input-control.mdc-text-field__input[type=color]{height:23px}.mat-mdc-text-field-wrapper{height:auto;flex:auto;will-change:auto}.mat-mdc-form-field-has-icon-prefix .mat-mdc-text-field-wrapper{padding-left:0;--mat-mdc-form-field-label-offset-x: -16px}.mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-right:0}[dir=rtl] .mat-mdc-text-field-wrapper{padding-left:16px;padding-right:16px}[dir=rtl] .mat-mdc-form-field-has-icon-suffix .mat-mdc-text-field-wrapper{padding-left:0}[dir=rtl] .mat-mdc-form-field-has-icon-prefix .mat-mdc-text-field-wrapper{padding-right:0}.mat-form-field-disabled .mdc-text-field__input::placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input::-moz-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input::-webkit-input-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-disabled .mdc-text-field__input:-ms-input-placeholder{color:var(--mat-form-field-disabled-input-text-placeholder-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-label-always-float .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms;opacity:1}.mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-floating-label{left:auto;right:auto}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input{display:inline-block}.mat-mdc-form-field .mat-mdc-text-field-wrapper.mdc-text-field .mdc-notched-outline__notch{padding-top:0}.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:1px solid rgba(0,0,0,0)}[dir=rtl] .mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:none;border-right:1px solid rgba(0,0,0,0)}.mat-mdc-form-field-infix{min-height:var(--mat-form-field-container-height, 56px);padding-top:var(--mat-form-field-filled-with-label-container-padding-top, 24px);padding-bottom:var(--mat-form-field-filled-with-label-container-padding-bottom, 8px)}.mdc-text-field--outlined .mat-mdc-form-field-infix,.mdc-text-field--no-label .mat-mdc-form-field-infix{padding-top:var(--mat-form-field-container-vertical-padding, 16px);padding-bottom:var(--mat-form-field-container-vertical-padding, 16px)}.mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:calc(var(--mat-form-field-container-height, 56px)/2)}.mdc-text-field--filled .mat-mdc-floating-label{display:var(--mat-form-field-filled-label-display, block)}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY(calc(calc(6.75px + var(--mat-form-field-container-height, 56px) / 2) * -1)) scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));transform:var(--mat-mdc-form-field-label-transform)}@keyframes _mat-form-field-subscript-animation{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.mat-mdc-form-field-subscript-wrapper{box-sizing:border-box;width:100%;position:relative}.mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field-error-wrapper{position:absolute;top:0;left:0;right:0;padding:0 16px;opacity:1;transform:translateY(0);animation:_mat-form-field-subscript-animation 0ms cubic-bezier(0.55, 0, 0.55, 0.2)}.mat-mdc-form-field-subscript-dynamic-size .mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field-subscript-dynamic-size .mat-mdc-form-field-error-wrapper{position:static}.mat-mdc-form-field-bottom-align::before{content:\"\";display:inline-block;height:16px}.mat-mdc-form-field-bottom-align.mat-mdc-form-field-subscript-dynamic-size::before{content:unset}.mat-mdc-form-field-hint-end{order:1}.mat-mdc-form-field-hint-wrapper{display:flex}.mat-mdc-form-field-hint-spacer{flex:1 0 1em}.mat-mdc-form-field-error{display:block;color:var(--mat-form-field-error-text-color, var(--mat-sys-error))}.mat-mdc-form-field-subscript-wrapper,.mat-mdc-form-field-bottom-align::before{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mat-form-field-subscript-text-font, var(--mat-sys-body-small-font));line-height:var(--mat-form-field-subscript-text-line-height, var(--mat-sys-body-small-line-height));font-size:var(--mat-form-field-subscript-text-size, var(--mat-sys-body-small-size));letter-spacing:var(--mat-form-field-subscript-text-tracking, var(--mat-sys-body-small-tracking));font-weight:var(--mat-form-field-subscript-text-weight, var(--mat-sys-body-small-weight))}.mat-mdc-form-field-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;opacity:0;pointer-events:none;background-color:var(--mat-form-field-state-layer-color, var(--mat-sys-on-surface))}.mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-focus-overlay{opacity:var(--mat-form-field-hover-state-layer-opacity, var(--mat-sys-hover-state-layer-opacity))}.mat-mdc-form-field.mat-focused .mat-mdc-form-field-focus-overlay{opacity:var(--mat-form-field-focus-state-layer-opacity, 0)}select.mat-mdc-form-field-input-control{-moz-appearance:none;-webkit-appearance:none;background-color:rgba(0,0,0,0);display:inline-flex;box-sizing:border-box}select.mat-mdc-form-field-input-control:not(:disabled){cursor:pointer}select.mat-mdc-form-field-input-control:not(.mat-mdc-native-select-inline) option{color:var(--mat-form-field-select-option-text-color, var(--mat-sys-neutral10))}select.mat-mdc-form-field-input-control:not(.mat-mdc-native-select-inline) option:disabled{color:var(--mat-form-field-select-disabled-option-text-color, color-mix(in srgb, var(--mat-sys-neutral10) 38%, transparent))}.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after{content:\"\";width:0;height:0;border-left:5px solid rgba(0,0,0,0);border-right:5px solid rgba(0,0,0,0);border-top:5px solid;position:absolute;right:0;top:50%;margin-top:-2.5px;pointer-events:none;color:var(--mat-form-field-enabled-select-arrow-color, var(--mat-sys-on-surface-variant))}[dir=rtl] .mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after{right:auto;left:0}.mat-mdc-form-field-type-mat-native-select.mat-focused .mat-mdc-form-field-infix::after{color:var(--mat-form-field-focus-select-arrow-color, var(--mat-sys-primary))}.mat-mdc-form-field-type-mat-native-select.mat-form-field-disabled .mat-mdc-form-field-infix::after{color:var(--mat-form-field-disabled-select-arrow-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-input-control{padding-right:15px}[dir=rtl] .mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-input-control{padding-right:0;padding-left:15px}@media(forced-colors: active){.mat-form-field-appearance-fill .mat-mdc-text-field-wrapper{outline:solid 1px}}@media(forced-colors: active){.mat-form-field-appearance-fill.mat-form-field-disabled .mat-mdc-text-field-wrapper{outline-color:GrayText}}@media(forced-colors: active){.mat-form-field-appearance-fill.mat-focused .mat-mdc-text-field-wrapper{outline:dashed 3px}}@media(forced-colors: active){.mat-mdc-form-field.mat-focused .mdc-notched-outline{border:dashed 3px}}.mat-mdc-form-field-input-control[type=date],.mat-mdc-form-field-input-control[type=datetime],.mat-mdc-form-field-input-control[type=datetime-local],.mat-mdc-form-field-input-control[type=month],.mat-mdc-form-field-input-control[type=week],.mat-mdc-form-field-input-control[type=time]{line-height:1}.mat-mdc-form-field-input-control::-webkit-datetime-edit{line-height:1;padding:0;margin-bottom:-2px}.mat-mdc-form-field{--mat-mdc-form-field-floating-label-scale: 0.75;display:inline-flex;flex-direction:column;min-width:0;text-align:left;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mat-form-field-container-text-font, var(--mat-sys-body-large-font));line-height:var(--mat-form-field-container-text-line-height, var(--mat-sys-body-large-line-height));font-size:var(--mat-form-field-container-text-size, var(--mat-sys-body-large-size));letter-spacing:var(--mat-form-field-container-text-tracking, var(--mat-sys-body-large-tracking));font-weight:var(--mat-form-field-container-text-weight, var(--mat-sys-body-large-weight))}.mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{font-size:calc(var(--mat-form-field-outlined-label-text-populated-size)*var(--mat-mdc-form-field-floating-label-scale))}.mat-mdc-form-field .mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:var(--mat-form-field-outlined-label-text-populated-size)}[dir=rtl] .mat-mdc-form-field{text-align:right}.mat-mdc-form-field-flex{display:inline-flex;align-items:baseline;box-sizing:border-box;width:100%}.mat-mdc-text-field-wrapper{width:100%;z-index:0}.mat-mdc-form-field-icon-prefix,.mat-mdc-form-field-icon-suffix{align-self:center;line-height:0;pointer-events:auto;position:relative;z-index:1}.mat-mdc-form-field-icon-prefix>.mat-icon,.mat-mdc-form-field-icon-suffix>.mat-icon{padding:0 12px;box-sizing:content-box}.mat-mdc-form-field-icon-prefix{color:var(--mat-form-field-leading-icon-color, var(--mat-sys-on-surface-variant))}.mat-form-field-disabled .mat-mdc-form-field-icon-prefix{color:var(--mat-form-field-disabled-leading-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-trailing-icon-color, var(--mat-sys-on-surface-variant))}.mat-form-field-disabled .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-disabled-trailing-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-form-field-invalid .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-trailing-icon-color, var(--mat-sys-error))}.mat-form-field-invalid:not(.mat-focused):not(.mat-form-field-disabled) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-hover-trailing-icon-color, var(--mat-sys-on-error-container))}.mat-form-field-invalid.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-icon-suffix{color:var(--mat-form-field-error-focus-trailing-icon-color, var(--mat-sys-error))}.mat-mdc-form-field-icon-prefix,[dir=rtl] .mat-mdc-form-field-icon-suffix{padding:0 4px 0 0}.mat-mdc-form-field-icon-suffix,[dir=rtl] .mat-mdc-form-field-icon-prefix{padding:0 0 0 4px}.mat-mdc-form-field-subscript-wrapper .mat-icon,.mat-mdc-form-field label .mat-icon{width:1em;height:1em;font-size:inherit}.mat-mdc-form-field-infix{flex:auto;min-width:0;width:180px;position:relative;box-sizing:border-box}.mat-mdc-form-field-infix:has(textarea[cols]){width:auto}.mat-mdc-form-field .mdc-notched-outline__notch{margin-left:-1px;-webkit-clip-path:inset(-9em -999em -9em 1px);clip-path:inset(-9em -999em -9em 1px)}[dir=rtl] .mat-mdc-form-field .mdc-notched-outline__notch{margin-left:0;margin-right:-1px;-webkit-clip-path:inset(-9em 1px -9em -999em);clip-path:inset(-9em 1px -9em -999em)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-floating-label{transition:transform 150ms cubic-bezier(0.4, 0, 0.2, 1),color 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input{transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::-moz-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input::-webkit-input-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field__input:-ms-input-placeholder{transition:opacity 67ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::-moz-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::-moz-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input::-webkit-input-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input::-webkit-input-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mat-mdc-form-field.mat-form-field-animations-enabled.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{transition-delay:40ms;transition-duration:110ms}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-text-field--filled:not(.mdc-ripple-upgraded):focus .mdc-text-field__ripple::before{transition-duration:75ms}.mat-mdc-form-field.mat-form-field-animations-enabled .mdc-line-ripple::after{transition:transform 180ms cubic-bezier(0.4, 0, 0.2, 1),opacity 180ms cubic-bezier(0.4, 0, 0.2, 1)}.mat-mdc-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-hint-wrapper,.mat-mdc-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-error-wrapper{animation-duration:300ms}.mdc-notched-outline .mdc-floating-label{max-width:calc(100% + 1px)}.mdc-notched-outline--upgraded .mdc-floating-label--float-above{max-width:calc(133.3333333333% + 1px)}\n"]
1235
+ }]
1236
+ }],
1237
+ ctorParameters: () => [],
1238
+ propDecorators: {
1239
+ _textField: [{
1240
+ type: ViewChild,
1241
+ args: ['textField']
1242
+ }],
1243
+ _iconPrefixContainer: [{
1244
+ type: ViewChild,
1245
+ args: ['iconPrefixContainer']
1246
+ }],
1247
+ _textPrefixContainer: [{
1248
+ type: ViewChild,
1249
+ args: ['textPrefixContainer']
1250
+ }],
1251
+ _iconSuffixContainer: [{
1252
+ type: ViewChild,
1253
+ args: ['iconSuffixContainer']
1254
+ }],
1255
+ _textSuffixContainer: [{
1256
+ type: ViewChild,
1257
+ args: ['textSuffixContainer']
1258
+ }],
1259
+ _floatingLabel: [{
1260
+ type: ViewChild,
1261
+ args: [MatFormFieldFloatingLabel]
1262
+ }],
1263
+ _notchedOutline: [{
1264
+ type: ViewChild,
1265
+ args: [MatFormFieldNotchedOutline]
1266
+ }],
1267
+ _lineRipple: [{
1268
+ type: ViewChild,
1269
+ args: [MatFormFieldLineRipple]
1270
+ }],
1271
+ _formFieldControl: [{
1272
+ type: ContentChild,
1273
+ args: [MatFormFieldControl]
1274
+ }],
1275
+ _prefixChildren: [{
1276
+ type: ContentChildren,
1277
+ args: [MAT_PREFIX, {
1278
+ descendants: true
1279
+ }]
1280
+ }],
1281
+ _suffixChildren: [{
1282
+ type: ContentChildren,
1283
+ args: [MAT_SUFFIX, {
1284
+ descendants: true
1285
+ }]
1286
+ }],
1287
+ _errorChildren: [{
1288
+ type: ContentChildren,
1289
+ args: [MAT_ERROR, {
1290
+ descendants: true
1291
+ }]
1292
+ }],
1293
+ _hintChildren: [{
1294
+ type: ContentChildren,
1295
+ args: [MatHint, {
1296
+ descendants: true
1297
+ }]
1298
+ }],
1299
+ hideRequiredMarker: [{
1300
+ type: Input
1301
+ }],
1302
+ color: [{
1303
+ type: Input
1304
+ }],
1305
+ floatLabel: [{
1306
+ type: Input
1307
+ }],
1308
+ appearance: [{
1309
+ type: Input
1310
+ }],
1311
+ subscriptSizing: [{
1312
+ type: Input
1313
+ }],
1314
+ hintLabel: [{
1315
+ type: Input
1316
+ }]
1317
+ }
1318
+ });
1112
1319
 
1113
1320
  export { MAT_ERROR, MAT_FORM_FIELD, MAT_FORM_FIELD_DEFAULT_OPTIONS, MAT_PREFIX, MAT_SUFFIX, MatError, MatFormField, MatFormFieldControl, MatHint, MatLabel, MatPrefix, MatSuffix, getMatFormFieldDuplicatedHintError, getMatFormFieldMissingControlError, getMatFormFieldPlaceholderConflictError };
1114
1321
  //# sourceMappingURL=_form-field-chunk.mjs.map