Skip to content

Commit d8d9093

Browse files
committed
refactor(core): remove deprecated APIs for v11
Removes the deprecated APIs for v11 from `material/core`. Also fixes the fact that the MDC-based form field doesn't support the global `floatLabel` option. BREAKING CHANGES: * `MAT_LABEL_GLOBAL_OPTIONS` from `material/core` has been removed. Import `MAT_FORM_FIELD_DEFAULT_OPTIONS` from `material/form-field` instead. * `FloatLabelType` from `material/core` has been removed. Import `FloatLabelType` from `material/form-field` instead. * `LabelOptions` from `material/core` has been removed. Import `MatFormFieldDefaultOptions` from `material/form-field` instead. * `MAT_DATE_LOCALE_PROVIDER` has been removed, because it is no longer needed since MAT_DATE_LOCALE has been changed to a scoped injectable. If you are importing and providing this in your code you can simply remove it. * `MatLineSetter` class has been removed. Use the `setLines` function instead. * `hammer` property from `GranularSanityChecks` has been removed, because it isn't being used anymore. * `document` parameter of the `MatCommonModule` constructor is now required.
1 parent 98d4799 commit d8d9093

File tree

15 files changed

+49
-143
lines changed

15 files changed

+49
-143
lines changed

src/dev-app/input/input-demo.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88

99
import {ChangeDetectionStrategy, Component} from '@angular/core';
1010
import {FormControl, Validators} from '@angular/forms';
11-
import {ErrorStateMatcher, FloatLabelType} from '@angular/material/core';
11+
import {ErrorStateMatcher} from '@angular/material/core';
12+
import {FloatLabelType} from '@angular/material/form-field';
1213

1314

1415
let max = 5;

src/dev-app/select/select-demo.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88

99
import {Component} from '@angular/core';
1010
import {FormControl, Validators} from '@angular/forms';
11-
import {ErrorStateMatcher, ThemePalette, FloatLabelType} from '@angular/material/core';
11+
import {ErrorStateMatcher, ThemePalette} from '@angular/material/core';
12+
import {FloatLabelType} from '@angular/material/form-field';
1213
import {MatSelectChange} from '@angular/material/select';
1314

1415
/** Error any time control is invalid */

src/material-experimental/mdc-form-field/form-field.ts

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ import {
2828
ViewEncapsulation
2929
} from '@angular/core';
3030
import {NgControl} from '@angular/forms';
31-
import {LabelOptions, MAT_LABEL_GLOBAL_OPTIONS, ThemePalette} from '@angular/material/core';
31+
import {ThemePalette} from '@angular/material/core';
3232
import {
3333
getMatFormFieldDuplicatedHintError,
3434
getMatFormFieldMissingControlError,
@@ -66,6 +66,7 @@ export type MatFormFieldAppearance = 'fill' | 'outline';
6666
export interface MatFormFieldDefaultOptions {
6767
appearance?: MatFormFieldAppearance;
6868
hideRequiredMarker?: boolean;
69+
floatLabel?: FloatLabelType;
6970
}
7071

7172
/**
@@ -149,8 +150,7 @@ export class MatFormField implements AfterViewInit, OnDestroy, AfterContentCheck
149150
/** Whether the label should always float or float as the user types. */
150151
@Input()
151152
get floatLabel(): FloatLabelType {
152-
return this._floatLabel || (this._labelOptions && this._labelOptions.float)
153-
|| DEFAULT_FLOAT_LABEL;
153+
return this._floatLabel || this._defaults?.floatLabel || DEFAULT_FLOAT_LABEL;
154154
}
155155
set floatLabel(value: FloatLabelType) {
156156
if (value !== this._floatLabel) {
@@ -298,7 +298,6 @@ export class MatFormField implements AfterViewInit, OnDestroy, AfterContentCheck
298298
private _platform: Platform,
299299
@Optional() @Inject(MAT_FORM_FIELD_DEFAULT_OPTIONS)
300300
private _defaults?: MatFormFieldDefaultOptions,
301-
@Optional() @Inject(MAT_LABEL_GLOBAL_OPTIONS) private _labelOptions?: LabelOptions,
302301
@Optional() @Inject(ANIMATION_MODULE_TYPE) public _animationMode?: string) {
303302
if (_defaults && _defaults.appearance) {
304303
this.appearance = _defaults.appearance;

src/material-experimental/mdc-input/input.spec.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@ import {
2929
} from '@angular/material-experimental/mdc-form-field';
3030
import {
3131
ErrorStateMatcher,
32-
MAT_LABEL_GLOBAL_OPTIONS,
3332
ShowOnDirtyErrorStateMatcher,
3433
} from '@angular/material/core';
3534
import {By} from '@angular/platform-browser';
@@ -49,7 +48,7 @@ describe('MatMdcInput without forms', () => {
4948

5049
it('should default to global floating label type', fakeAsync(() => {
5150
let fixture = createComponent(MatInputWithLabel, [{
52-
provide: MAT_LABEL_GLOBAL_OPTIONS, useValue: {float: 'always'}
51+
provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: {floatLabel: 'always'}
5352
}]);
5453
fixture.detectChanges();
5554

src/material/core/common-behaviors/common-module.ts

Lines changed: 12 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -40,12 +40,6 @@ export interface GranularSanityChecks {
4040
doctype: boolean;
4141
theme: boolean;
4242
version: boolean;
43-
44-
/**
45-
* @deprecated No longer being used.
46-
* @breaking-change 10.0.0
47-
*/
48-
hammer: boolean;
4943
}
5044

5145
/**
@@ -66,13 +60,12 @@ export class MatCommonModule {
6660
private _sanityChecks: SanityChecks;
6761

6862
/** Used to reference correct document/window */
69-
protected _document?: Document;
63+
protected _document: Document;
7064

7165
constructor(
7266
highContrastModeDetector: HighContrastModeDetector,
7367
@Optional() @Inject(MATERIAL_SANITY_CHECKS) sanityChecks: any,
74-
/** @breaking-change 11.0.0 make document required */
75-
@Optional() @Inject(DOCUMENT) document?: any) {
68+
@Inject(DOCUMENT) document: any) {
7669
this._document = document;
7770

7871
// While A11yModule also does this, we repeat it here to avoid importing A11yModule
@@ -91,18 +84,11 @@ export class MatCommonModule {
9184
}
9285
}
9386

94-
/** Access injected document if available or fallback to global document reference */
95-
private _getDocument(): Document | null {
96-
const doc = this._document || document;
97-
return typeof doc === 'object' && doc ? doc : null;
98-
}
99-
100-
/** Use defaultView of injected document if available or fallback to global window reference */
101-
private _getWindow(): Window | null {
102-
const doc = this._getDocument();
103-
const win = doc?.defaultView || window;
104-
return typeof win === 'object' && win ? win : null;
105-
}
87+
/** Use defaultView of injected document if available or fallback to global window reference */
88+
private _getWindow(): Window | null {
89+
const win = this._document.defaultView || window;
90+
return typeof win === 'object' && win ? win : null;
91+
}
10692

10793
/** Whether any sanity checks are enabled. */
10894
private _checksAreEnabled(): boolean {
@@ -122,9 +108,8 @@ export class MatCommonModule {
122108
private _checkDoctypeIsDefined(): void {
123109
const isEnabled = this._checksAreEnabled() &&
124110
(this._sanityChecks === true || (this._sanityChecks as GranularSanityChecks).doctype);
125-
const document = this._getDocument();
126111

127-
if (isEnabled && document && !document.doctype) {
112+
if (isEnabled && !this._document.doctype) {
128113
console.warn(
129114
'Current document does not have a doctype. This may cause ' +
130115
'some Angular Material components not to behave as expected.'
@@ -137,17 +122,15 @@ export class MatCommonModule {
137122
// and the `body` won't be defined if the consumer put their scripts in the `head`.
138123
const isDisabled = !this._checksAreEnabled() ||
139124
(this._sanityChecks === false || !(this._sanityChecks as GranularSanityChecks).theme);
140-
const document = this._getDocument();
141125

142-
if (isDisabled || !document || !document.body ||
143-
typeof getComputedStyle !== 'function') {
126+
if (isDisabled || !this._document.body || typeof getComputedStyle !== 'function') {
144127
return;
145128
}
146129

147-
const testElement = document.createElement('div');
130+
const testElement = this._document.createElement('div');
148131

149132
testElement.classList.add('mat-theme-loaded-marker');
150-
document.body.appendChild(testElement);
133+
this._document.body.appendChild(testElement);
151134

152135
const computedStyle = getComputedStyle(testElement);
153136

@@ -162,7 +145,7 @@ export class MatCommonModule {
162145
);
163146
}
164147

165-
document.body.removeChild(testElement);
148+
this._document.body.removeChild(testElement);
166149
}
167150

168151
/** Checks whether the material version matches the cdk version */

src/material/core/datetime/date-adapter.ts

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -20,14 +20,6 @@ export function MAT_DATE_LOCALE_FACTORY(): string {
2020
return inject(LOCALE_ID);
2121
}
2222

23-
/**
24-
* No longer needed since MAT_DATE_LOCALE has been changed to a scoped injectable.
25-
* If you are importing and providing this in your code you can simply remove it.
26-
* @deprecated
27-
* @breaking-change 8.0.0
28-
*/
29-
export const MAT_DATE_LOCALE_PROVIDER = {provide: MAT_DATE_LOCALE, useExisting: LOCALE_ID};
30-
3123
/** Adapts type `D` to be usable as a date by cdk-based components that work with dates. */
3224
export abstract class DateAdapter<D> {
3325
/** The locale to use for all dates. */

src/material/core/label/label-options.ts

Lines changed: 0 additions & 38 deletions
This file was deleted.

src/material/core/line/line.ts

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -54,18 +54,6 @@ function setClass(element: ElementRef<HTMLElement>, className: string, isAdd: bo
5454
isAdd ? classList.add(className) : classList.remove(className);
5555
}
5656

57-
/**
58-
* Helper that takes a query list of lines and sets the correct class on the host.
59-
* @docs-private
60-
* @deprecated Use `setLines` instead.
61-
* @breaking-change 8.0.0
62-
*/
63-
export class MatLineSetter {
64-
constructor(lines: QueryList<MatLine>, element: ElementRef<HTMLElement>) {
65-
setLines(lines, element);
66-
}
67-
}
68-
6957
@NgModule({
7058
imports: [MatCommonModule],
7159
exports: [MatLine, MatCommonModule],

src/material/core/public-api.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,5 @@ export * from './datetime/index';
1313
export * from './error/error-options';
1414
export * from './line/line';
1515
export * from './option/index';
16-
export * from './label/label-options';
1716
export * from './ripple/index';
1817
export * from './selection/index';

src/material/form-field/form-field.ts

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,6 @@ import {
3030
} from '@angular/core';
3131
import {
3232
CanColor, CanColorCtor,
33-
LabelOptions,
34-
MAT_LABEL_GLOBAL_OPTIONS,
3533
mixinColor,
3634
} from '@angular/material/core';
3735
import {fromEvent, merge, Subject} from 'rxjs';
@@ -160,7 +158,6 @@ export const MAT_FORM_FIELD = new InjectionToken<MatFormField>('MatFormField');
160158

161159
export class MatFormField extends _MatFormFieldMixinBase
162160
implements AfterContentInit, AfterContentChecked, AfterViewInit, OnDestroy, CanColor {
163-
private _labelOptions: LabelOptions;
164161

165162
/**
166163
* Whether the outline gap needs to be calculated
@@ -284,14 +281,19 @@ export class MatFormField extends _MatFormFieldMixinBase
284281

285282
constructor(
286283
public _elementRef: ElementRef, private _changeDetectorRef: ChangeDetectorRef,
287-
@Optional() @Inject(MAT_LABEL_GLOBAL_OPTIONS) labelOptions: LabelOptions,
284+
/**
285+
* @deprecated `_labelOptions` parameter no longer being used. To be removed.
286+
* @breaking-change 12.0.0
287+
*/
288+
@Inject(ElementRef)
289+
// Use `ElementRef` here so Angular has something to inject.
290+
_labelOptions: any,
288291
@Optional() private _dir: Directionality,
289292
@Optional() @Inject(MAT_FORM_FIELD_DEFAULT_OPTIONS) private _defaults:
290293
MatFormFieldDefaultOptions, private _platform: Platform, private _ngZone: NgZone,
291294
@Optional() @Inject(ANIMATION_MODULE_TYPE) _animationMode: string) {
292295
super(_elementRef);
293296

294-
this._labelOptions = labelOptions ? labelOptions : {};
295297
this.floatLabel = this._getDefaultFloatLabelState();
296298
this._animationsEnabled = _animationMode !== 'NoopAnimations';
297299

@@ -496,7 +498,7 @@ export class MatFormField extends _MatFormFieldMixinBase
496498

497499
/** Gets the default float label state. */
498500
private _getDefaultFloatLabelState(): FloatLabelType {
499-
return (this._defaults && this._defaults.floatLabel) || this._labelOptions.float || 'auto';
501+
return (this._defaults && this._defaults.floatLabel) || 'auto';
500502
}
501503

502504
/**

src/material/input/input.spec.ts

Lines changed: 1 addition & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -28,8 +28,6 @@ import {
2828
} from '@angular/forms';
2929
import {
3030
ErrorStateMatcher,
31-
FloatLabelType,
32-
MAT_LABEL_GLOBAL_OPTIONS,
3331
ShowOnDirtyErrorStateMatcher,
3432
} from '@angular/material/core';
3533
import {
@@ -40,6 +38,7 @@ import {
4038
MatFormField,
4139
MatFormFieldAppearance,
4240
MatFormFieldModule,
41+
FloatLabelType,
4342
} from '@angular/material/form-field';
4443
import {By} from '@angular/platform-browser';
4544
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
@@ -61,18 +60,6 @@ describe('MatInput without forms', () => {
6160
'Expected MatInput to set floatingLabel to auto by default.');
6261
}));
6362

64-
it('should default to floating label type from deprecated global label options', fakeAsync(() => {
65-
let fixture = createComponent(MatInputWithId, [{
66-
provide: MAT_LABEL_GLOBAL_OPTIONS, useValue: {float: 'always'}
67-
}]);
68-
fixture.detectChanges();
69-
70-
let formField = fixture.debugElement.query(By.directive(MatFormField))!
71-
.componentInstance as MatFormField;
72-
expect(formField.floatLabel).toBe('always',
73-
'Expected MatInput to set floatingLabel to always from global option.');
74-
}));
75-
7663
it('should default to floating label type provided by global default options', fakeAsync(() => {
7764
let fixture = createComponent(MatInputWithId, [{
7865
provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: {floatLabel: 'always'}

src/material/schematics/ng-update/data/constructor-checks.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,12 @@ import {ConstructorChecksUpgradeData, TargetVersion, VersionChanges} from '@angu
1414
* automatically through type checking.
1515
*/
1616
export const constructorChecks: VersionChanges<ConstructorChecksUpgradeData> = {
17+
[TargetVersion.V11]: [
18+
{
19+
pr: 'https://github.com/angular/components/pull/20479',
20+
changes: ['MatCommonModule']
21+
}
22+
],
1723
[TargetVersion.V10]: [
1824
{
1925
pr: 'https://github.com/angular/components/pull/19307',

src/material/select/select.spec.ts

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -53,12 +53,14 @@ import {
5353
} from '@angular/forms';
5454
import {
5555
ErrorStateMatcher,
56-
FloatLabelType,
57-
MAT_LABEL_GLOBAL_OPTIONS,
5856
MatOption,
5957
MatOptionSelectionChange,
6058
} from '@angular/material/core';
61-
import {MatFormFieldModule} from '@angular/material/form-field';
59+
import {
60+
FloatLabelType,
61+
MatFormFieldModule,
62+
MAT_FORM_FIELD_DEFAULT_OPTIONS,
63+
} from '@angular/material/form-field';
6264
import {By} from '@angular/platform-browser';
6365
import {NoopAnimationsModule} from '@angular/platform-browser/animations';
6466
import {LiveAnnouncer} from '@angular/cdk/a11y';
@@ -2347,7 +2349,10 @@ describe('MatSelect', () => {
23472349
declarations: [
23482350
FloatLabelSelect
23492351
],
2350-
providers: [{ provide: MAT_LABEL_GLOBAL_OPTIONS, useValue: { float: 'always' } }]
2352+
providers: [{
2353+
provide: MAT_FORM_FIELD_DEFAULT_OPTIONS,
2354+
useValue: {floatLabel: 'always'}
2355+
}]
23512356
});
23522357

23532358
fixture = TestBed.createComponent(FloatLabelSelect);

0 commit comments

Comments
 (0)