Skip to content

Commit ef5bac9

Browse files
committed
fix(dialog,bottom-sheet): don't provide directionality if no direction is set
* Currently the dialog and bottom sheet always provide the `Directionality` in order to allow for any components placed inside of them to pick up their direction. This is problematic if the consumer didn't set a direction, because the `value` of the provided `Directionality` will be set to `undefined`. These changes switch to only providing the direction if it is defined in the config, otherwise the components will fall back to the global `Directionality`. * Flips around some logic in the drawer so an undefined direction is consider `ltr`, rather than `rtl`. Fixes #11262.
1 parent ce0040d commit ef5bac9

File tree

7 files changed

+31
-7
lines changed

7 files changed

+31
-7
lines changed

src/cdk-experimental/dialog/dialog.spec.ts

+8
Original file line numberDiff line numberDiff line change
@@ -522,6 +522,14 @@ describe('Dialog', () => {
522522
expect(dialogRef.componentInstance.directionality.value).toBe('rtl');
523523
});
524524

525+
it('should fall back to injecting the global direction if none is passed by the config', () => {
526+
const dialogRef = dialog.openFromComponent(PizzaMsg, {});
527+
528+
viewContainerFixture.detectChanges();
529+
530+
expect(dialogRef.componentInstance.directionality.value).toBe('ltr');
531+
});
532+
525533
it('should close all of the dialogs', fakeAsync(() => {
526534
dialog.openFromComponent(PizzaMsg);
527535
dialog.openFromComponent(PizzaMsg);

src/cdk-experimental/dialog/dialog.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -266,7 +266,7 @@ export class Dialog {
266266
.set(this.injector.get(DIALOG_CONTAINER), dialogContainer)
267267
.set(DIALOG_DATA, config.data);
268268

269-
if (!userInjector || !userInjector.get(Directionality, null)) {
269+
if (config.direction && (!userInjector || !userInjector.get(Directionality, null))) {
270270
injectionTokens.set(Directionality, {
271271
value: config.direction,
272272
change: observableOf()

src/lib/bottom-sheet/bottom-sheet.spec.ts

+8
Original file line numberDiff line numberDiff line change
@@ -224,6 +224,14 @@ describe('MatBottomSheet', () => {
224224
expect(bottomSheetRef.instance.directionality.value).toBe('rtl');
225225
});
226226

227+
it('should fall back to injecting the global direction if none is passed by the config', () => {
228+
const bottomSheetRef = bottomSheet.open(PizzaMsg, {});
229+
230+
viewContainerFixture.detectChanges();
231+
232+
expect(bottomSheetRef.instance.directionality.value).toBe('ltr');
233+
});
234+
227235
it('should be able to set a custom panel class', () => {
228236
bottomSheet.open(PizzaMsg, {
229237
panelClass: 'custom-panel-class',

src/lib/bottom-sheet/bottom-sheet.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -146,7 +146,7 @@ export class MatBottomSheet {
146146
injectionTokens.set(MatBottomSheetRef, bottomSheetRef);
147147
injectionTokens.set(MAT_BOTTOM_SHEET_DATA, config.data);
148148

149-
if (!userInjector || !userInjector.get(Directionality, null)) {
149+
if (config.direction && (!userInjector || !userInjector.get(Directionality, null))) {
150150
injectionTokens.set(Directionality, {
151151
value: config.direction,
152152
change: observableOf()

src/lib/dialog/dialog.spec.ts

+8
Original file line numberDiff line numberDiff line change
@@ -530,6 +530,14 @@ describe('MatDialog', () => {
530530
expect(dialogRef.componentInstance.directionality.value).toBe('rtl');
531531
});
532532

533+
it('should fall back to injecting the global direction if none is passed by the config', () => {
534+
const dialogRef = dialog.open(PizzaMsg, {});
535+
536+
viewContainerFixture.detectChanges();
537+
538+
expect(dialogRef.componentInstance.directionality.value).toBe('ltr');
539+
});
540+
533541
it('should close all of the dialogs', fakeAsync(() => {
534542
dialog.open(PizzaMsg);
535543
dialog.open(PizzaMsg);

src/lib/dialog/dialog.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -289,7 +289,7 @@ export class MatDialog {
289289
.set(MAT_DIALOG_DATA, config.data)
290290
.set(MatDialogRef, dialogRef);
291291

292-
if (!userInjector || !userInjector.get(Directionality, null)) {
292+
if (config.direction && (!userInjector || !userInjector.get(Directionality, null))) {
293293
injectionTokens.set(Directionality, {
294294
value: config.direction,
295295
change: observableOf()

src/lib/sidenav/drawer.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -625,12 +625,12 @@ export class MatDrawerContainer implements AfterContentInit, OnDestroy {
625625
this._right = this._left = null;
626626

627627
// Detect if we're LTR or RTL.
628-
if (!this._dir || this._dir.value == 'ltr') {
629-
this._left = this._start;
630-
this._right = this._end;
631-
} else {
628+
if (this._dir && this._dir.value === 'rtl') {
632629
this._left = this._end;
633630
this._right = this._start;
631+
} else {
632+
this._left = this._start;
633+
this._right = this._end;
634634
}
635635
}
636636

0 commit comments

Comments
 (0)