Skip to content

Commit 0a0ca97

Browse files
crisbetocrisbeto
committed
refactor(material/slide-toggle): convert to standalone
Converts `material/slide-toggle` to standalone.
1 parent b09cad4 commit 0a0ca97

File tree

6 files changed

+54
-20
lines changed

6 files changed

+54
-20
lines changed

‎src/material/slide-toggle/module.ts

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,18 @@ import {MatSlideToggleRequiredValidator} from './slide-toggle-required-validator
1313

1414
/** This module is used by both original and MDC-based slide-toggle implementations. */
1515
@NgModule({
16+
imports: [MatSlideToggleRequiredValidator],
1617
exports: [MatSlideToggleRequiredValidator],
17-
declarations: [MatSlideToggleRequiredValidator],
1818
})
1919
export class _MatSlideToggleRequiredValidatorModule {}
2020

2121
@NgModule({
22-
imports: [_MatSlideToggleRequiredValidatorModule, MatCommonModule, MatRippleModule],
22+
imports: [
23+
_MatSlideToggleRequiredValidatorModule,
24+
MatCommonModule,
25+
MatRippleModule,
26+
MatSlideToggle,
27+
],
2328
exports: [_MatSlideToggleRequiredValidatorModule, MatSlideToggle, MatCommonModule],
24-
declarations: [MatSlideToggle],
2529
})
2630
export class MatSlideToggleModule {}

‎src/material/slide-toggle/slide-toggle-required-validator.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,5 +27,6 @@ export const MAT_SLIDE_TOGGLE_REQUIRED_VALIDATOR: Provider = {
2727
selector: `mat-slide-toggle[required][formControlName],
2828
mat-slide-toggle[required][formControl], mat-slide-toggle[required][ngModel]`,
2929
providers: [MAT_SLIDE_TOGGLE_REQUIRED_VALIDATOR],
30+
standalone: true,
3031
})
3132
export class MatSlideToggleRequiredValidator extends CheckboxRequiredValidator {}

‎src/material/slide-toggle/slide-toggle.spec.ts

Lines changed: 35 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import {BidiModule, Direction} from '@angular/cdk/bidi';
2-
import {dispatchFakeEvent} from '../../cdk/testing/private';
2+
import {dispatchFakeEvent} from '@angular/cdk/testing/private';
33
import {Component} from '@angular/core';
44
import {
55
ComponentFixture,
@@ -19,8 +19,9 @@ import {MAT_SLIDE_TOGGLE_DEFAULT_OPTIONS} from './slide-toggle-config';
1919
describe('MDC-based MatSlideToggle without forms', () => {
2020
beforeEach(fakeAsync(() => {
2121
TestBed.configureTestingModule({
22-
imports: [MatSlideToggleModule, BidiModule],
23-
declarations: [
22+
imports: [
23+
MatSlideToggleModule,
24+
BidiModule,
2425
SlideToggleBasic,
2526
SlideToggleCheckedAndDisabledAttr,
2627
SlideToggleWithTabindexAttr,
@@ -421,8 +422,7 @@ describe('MDC-based MatSlideToggle without forms', () => {
421422
'action configuration',
422423
fakeAsync(() => {
423424
TestBed.resetTestingModule().configureTestingModule({
424-
imports: [MatSlideToggleModule],
425-
declarations: [SlideToggleBasic],
425+
imports: [MatSlideToggleModule, SlideToggleBasic],
426426
providers: [
427427
{
428428
provide: MAT_SLIDE_TOGGLE_DEFAULT_OPTIONS,
@@ -464,8 +464,7 @@ describe('MDC-based MatSlideToggle without forms', () => {
464464

465465
it('should be able to change the default color', fakeAsync(() => {
466466
TestBed.resetTestingModule().configureTestingModule({
467-
imports: [MatSlideToggleModule],
468-
declarations: [SlideToggleWithForm],
467+
imports: [MatSlideToggleModule, SlideToggleWithForm],
469468
providers: [{provide: MAT_SLIDE_TOGGLE_DEFAULT_OPTIONS, useValue: {color: 'warn'}}],
470469
});
471470
const fixture = TestBed.createComponent(SlideToggleWithForm);
@@ -487,8 +486,10 @@ describe('MDC-based MatSlideToggle without forms', () => {
487486
describe('MDC-based MatSlideToggle with forms', () => {
488487
beforeEach(fakeAsync(() => {
489488
TestBed.configureTestingModule({
490-
imports: [MatSlideToggleModule, FormsModule, ReactiveFormsModule],
491-
declarations: [
489+
imports: [
490+
MatSlideToggleModule,
491+
FormsModule,
492+
ReactiveFormsModule,
492493
SlideToggleWithForm,
493494
SlideToggleWithModel,
494495
SlideToggleWithFormControl,
@@ -814,6 +815,8 @@ describe('MDC-based MatSlideToggle with forms', () => {
814815
(click)="onSlideClick($event)">
815816
<span>Test Slide Toggle</span>
816817
</mat-slide-toggle>`,
818+
standalone: true,
819+
imports: [MatSlideToggleModule, BidiModule],
817820
})
818821
class SlideToggleBasic {
819822
isDisabled: boolean = false;
@@ -846,6 +849,8 @@ class SlideToggleBasic {
846849
<mat-slide-toggle name="slide" ngModel [required]="isRequired">Required</mat-slide-toggle>
847850
<button type="submit"></button>
848851
</form>`,
852+
standalone: true,
853+
imports: [MatSlideToggleModule, FormsModule, ReactiveFormsModule],
849854
})
850855
class SlideToggleWithForm {
851856
isSubmitted: boolean = false;
@@ -855,6 +860,8 @@ class SlideToggleWithForm {
855860
@Component({
856861
template: `<mat-slide-toggle [(ngModel)]="modelValue" [disabled]="isDisabled"
857862
[checked]="isChecked"></mat-slide-toggle>`,
863+
standalone: true,
864+
imports: [MatSlideToggleModule, FormsModule, ReactiveFormsModule],
858865
})
859866
class SlideToggleWithModel {
860867
modelValue = false;
@@ -864,6 +871,8 @@ class SlideToggleWithModel {
864871

865872
@Component({
866873
template: `<mat-slide-toggle checked disabled>Label</mat-slide-toggle>`,
874+
standalone: true,
875+
imports: [MatSlideToggleModule, BidiModule],
867876
})
868877
class SlideToggleCheckedAndDisabledAttr {}
869878

@@ -872,25 +881,35 @@ class SlideToggleCheckedAndDisabledAttr {}
872881
<mat-slide-toggle [formControl]="formControl">
873882
<span>Test Slide Toggle</span>
874883
</mat-slide-toggle>`,
884+
standalone: true,
885+
imports: [MatSlideToggleModule, FormsModule, ReactiveFormsModule],
875886
})
876887
class SlideToggleWithFormControl {
877888
formControl = new FormControl(false);
878889
}
879890

880-
@Component({template: `<mat-slide-toggle tabindex="5" [disabled]="disabled"></mat-slide-toggle>`})
891+
@Component({
892+
template: `<mat-slide-toggle tabindex="5" [disabled]="disabled"></mat-slide-toggle>`,
893+
standalone: true,
894+
imports: [MatSlideToggleModule, BidiModule],
895+
})
881896
class SlideToggleWithTabindexAttr {
882897
disabled = false;
883898
}
884899

885900
@Component({
886901
template: `<mat-slide-toggle>{{label}}</mat-slide-toggle>`,
902+
standalone: true,
903+
imports: [MatSlideToggleModule, BidiModule],
887904
})
888905
class SlideToggleWithoutLabel {
889906
label: string;
890907
}
891908

892909
@Component({
893910
template: `<mat-slide-toggle [(ngModel)]="checked" (change)="onChange()"></mat-slide-toggle>`,
911+
standalone: true,
912+
imports: [MatSlideToggleModule, FormsModule, ReactiveFormsModule],
894913
})
895914
class SlideToggleWithModelAndChangeEvent {
896915
checked: boolean;
@@ -899,12 +918,16 @@ class SlideToggleWithModelAndChangeEvent {
899918

900919
@Component({
901920
template: `<mat-slide-toggle><some-text></some-text></mat-slide-toggle>`,
921+
standalone: true,
922+
imports: [MatSlideToggleModule, BidiModule],
902923
})
903924
class SlideToggleProjectedLabel {}
904925

905926
@Component({
906927
selector: 'some-text',
907928
template: `<span>{{text}}</span>`,
929+
standalone: true,
930+
imports: [MatSlideToggleModule, BidiModule],
908931
})
909932
class TextBindingComponent {
910933
text: string = 'Some text';
@@ -914,5 +937,7 @@ class TextBindingComponent {
914937
template: `
915938
<mat-slide-toggle aria-label="Slide toggle" aria-labelledby="something"></mat-slide-toggle>
916939
`,
940+
standalone: true,
941+
imports: [MatSlideToggleModule, BidiModule],
917942
})
918943
class SlideToggleWithStaticAriaAttributes {}

‎src/material/slide-toggle/slide-toggle.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ import {
3232
MAT_SLIDE_TOGGLE_DEFAULT_OPTIONS,
3333
MatSlideToggleDefaultOptions,
3434
} from './slide-toggle-config';
35+
import {MatRipple} from '@angular/material/core';
3536

3637
/** @docs-private */
3738
export const MAT_SLIDE_TOGGLE_VALUE_ACCESSOR = {
@@ -75,6 +76,8 @@ let nextUniqueId = 0;
7576
encapsulation: ViewEncapsulation.None,
7677
changeDetection: ChangeDetectionStrategy.OnPush,
7778
providers: [MAT_SLIDE_TOGGLE_VALUE_ACCESSOR],
79+
standalone: true,
80+
imports: [MatRipple],
7881
})
7982
export class MatSlideToggle implements OnDestroy, AfterContentInit, ControlValueAccessor {
8083
private _onChange = (_: any) => {};

‎src/material/slide-toggle/testing/slide-toggle-harness.spec.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,7 @@ describe('MatSlideToggleHarness', () => {
1212

1313
beforeEach(async () => {
1414
await TestBed.configureTestingModule({
15-
imports: [MatSlideToggleModule, ReactiveFormsModule],
16-
declarations: [SlideToggleHarnessTest],
15+
imports: [MatSlideToggleModule, ReactiveFormsModule, SlideToggleHarnessTest],
1716
}).compileComponents();
1817

1918
fixture = TestBed.createComponent(SlideToggleHarnessTest);
@@ -177,6 +176,8 @@ describe('MatSlideToggleHarness', () => {
177176
</mat-slide-toggle>
178177
<span id="second-label">Second slide-toggle</span>
179178
`,
179+
standalone: true,
180+
imports: [MatSlideToggleModule, ReactiveFormsModule],
180181
})
181182
class SlideToggleHarnessTest {
182183
ctrl = new FormControl(true);

‎tools/public_api_guard/material/slide-toggle.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { ElementRef } from '@angular/core';
1212
import { EventEmitter } from '@angular/core';
1313
import { FocusMonitor } from '@angular/cdk/a11y';
1414
import * as i0 from '@angular/core';
15-
import * as i3 from '@angular/material/core';
15+
import * as i2 from '@angular/material/core';
1616
import { InjectionToken } from '@angular/core';
1717
import { OnDestroy } from '@angular/core';
1818
import { Provider } from '@angular/core';
@@ -90,7 +90,7 @@ export class MatSlideToggle implements OnDestroy, AfterContentInit, ControlValue
9090
readonly toggleChange: EventEmitter<void>;
9191
writeValue(value: any): void;
9292
// (undocumented)
93-
static ɵcmp: i0.ɵɵComponentDeclaration<MatSlideToggle, "mat-slide-toggle", ["matSlideToggle"], { "disabled": { "alias": "disabled"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "color": { "alias": "color"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "labelPosition": { "alias": "labelPosition"; "required": false; }; "ariaLabel": { "alias": "aria-label"; "required": false; }; "ariaLabelledby": { "alias": "aria-labelledby"; "required": false; }; "ariaDescribedby": { "alias": "aria-describedby"; "required": false; }; "required": { "alias": "required"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "hideIcon": { "alias": "hideIcon"; "required": false; }; }, { "change": "change"; "toggleChange": "toggleChange"; }, never, ["*"], false, never>;
93+
static ɵcmp: i0.ɵɵComponentDeclaration<MatSlideToggle, "mat-slide-toggle", ["matSlideToggle"], { "disabled": { "alias": "disabled"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "color": { "alias": "color"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "labelPosition": { "alias": "labelPosition"; "required": false; }; "ariaLabel": { "alias": "aria-label"; "required": false; }; "ariaLabelledby": { "alias": "aria-labelledby"; "required": false; }; "ariaDescribedby": { "alias": "aria-describedby"; "required": false; }; "required": { "alias": "required"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "hideIcon": { "alias": "hideIcon"; "required": false; }; }, { "change": "change"; "toggleChange": "toggleChange"; }, never, ["*"], true, never>;
9494
// (undocumented)
9595
static ɵfac: i0.ɵɵFactoryDeclaration<MatSlideToggle, [null, null, null, { attribute: "tabindex"; }, null, { optional: true; }]>;
9696
}
@@ -118,13 +118,13 @@ export class MatSlideToggleModule {
118118
// (undocumented)
119119
static ɵinj: i0.ɵɵInjectorDeclaration<MatSlideToggleModule>;
120120
// (undocumented)
121-
static ɵmod: i0.ɵɵNgModuleDeclaration<MatSlideToggleModule, [typeof i2.MatSlideToggle], [typeof _MatSlideToggleRequiredValidatorModule, typeof i3.MatCommonModule, typeof i3.MatRippleModule], [typeof _MatSlideToggleRequiredValidatorModule, typeof i2.MatSlideToggle, typeof i3.MatCommonModule]>;
121+
static ɵmod: i0.ɵɵNgModuleDeclaration<MatSlideToggleModule, never, [typeof _MatSlideToggleRequiredValidatorModule, typeof i2.MatCommonModule, typeof i2.MatRippleModule, typeof i3.MatSlideToggle], [typeof _MatSlideToggleRequiredValidatorModule, typeof i3.MatSlideToggle, typeof i2.MatCommonModule]>;
122122
}
123123

124124
// @public
125125
export class MatSlideToggleRequiredValidator extends CheckboxRequiredValidator {
126126
// (undocumented)
127-
static ɵdir: i0.ɵɵDirectiveDeclaration<MatSlideToggleRequiredValidator, "mat-slide-toggle[required][formControlName], mat-slide-toggle[required][formControl], mat-slide-toggle[required][ngModel]", never, {}, {}, never, never, false, never>;
127+
static ɵdir: i0.ɵɵDirectiveDeclaration<MatSlideToggleRequiredValidator, "mat-slide-toggle[required][formControlName], mat-slide-toggle[required][formControl], mat-slide-toggle[required][ngModel]", never, {}, {}, never, never, true, never>;
128128
// (undocumented)
129129
static ɵfac: i0.ɵɵFactoryDeclaration<MatSlideToggleRequiredValidator, never>;
130130
}
@@ -136,7 +136,7 @@ export class _MatSlideToggleRequiredValidatorModule {
136136
// (undocumented)
137137
static ɵinj: i0.ɵɵInjectorDeclaration<_MatSlideToggleRequiredValidatorModule>;
138138
// (undocumented)
139-
static ɵmod: i0.ɵɵNgModuleDeclaration<_MatSlideToggleRequiredValidatorModule, [typeof i1.MatSlideToggleRequiredValidator], never, [typeof i1.MatSlideToggleRequiredValidator]>;
139+
static ɵmod: i0.ɵɵNgModuleDeclaration<_MatSlideToggleRequiredValidatorModule, never, [typeof i1.MatSlideToggleRequiredValidator], [typeof i1.MatSlideToggleRequiredValidator]>;
140140
}
141141

142142
// (No @packageDocumentation comment for this package)

0 commit comments

Comments
 (0)