diff --git a/src/material/bottom-sheet/bottom-sheet-config.ts b/src/material/bottom-sheet/bottom-sheet-config.ts index e95e22cfee53..ded882266ce6 100644 --- a/src/material/bottom-sheet/bottom-sheet-config.ts +++ b/src/material/bottom-sheet/bottom-sheet-config.ts @@ -72,4 +72,13 @@ export class MatBottomSheetConfig { /** Scroll strategy to be used for the bottom sheet. */ scrollStrategy?: ScrollStrategy; + + /** Height for the bottom sheet. */ + height?: string = ''; + + /** Minimum height for the bottom sheet. If a number is provided, assumes pixel units. */ + minHeight?: number | string; + + /** Maximum height for the bottom sheet. If a number is provided, assumes pixel units. */ + maxHeight?: number | string; } diff --git a/src/material/bottom-sheet/bottom-sheet.spec.ts b/src/material/bottom-sheet/bottom-sheet.spec.ts index e21a634119a0..fcaafe103355 100644 --- a/src/material/bottom-sheet/bottom-sheet.spec.ts +++ b/src/material/bottom-sheet/bottom-sheet.spec.ts @@ -461,6 +461,24 @@ describe('MatBottomSheet', () => { expect(scrollStrategy.enable).toHaveBeenCalled(); }); + it('should contain the height style properties on overlay pane', () => { + bottomSheet.open(PizzaMsg, { + panelClass: 'height--pane', + height: '300px', + maxHeight: 400, // this is converted into pixels + minHeight: 200, // this is converted into pixels + }); + + viewContainerFixture.detectChanges(); + + const paneElement = overlayContainerElement.querySelector('.height--pane') as HTMLElement; + + expect(paneElement).toBeTruthy(); + expect(paneElement.style.height).toBe('300px'); + expect(paneElement.style.maxHeight).toBe('400px'); + expect(paneElement.style.minHeight).toBe('200px'); + }); + describe('passing in data', () => { it('should be able to pass in data', () => { const config = { diff --git a/tools/public_api_guard/material/bottom-sheet.md b/tools/public_api_guard/material/bottom-sheet.md index 586bbde9a9c7..da17b68955fd 100644 --- a/tools/public_api_guard/material/bottom-sheet.md +++ b/tools/public_api_guard/material/bottom-sheet.md @@ -64,6 +64,9 @@ export class MatBottomSheetConfig { direction?: Direction; disableClose?: boolean; hasBackdrop?: boolean; + height?: string; + maxHeight?: number | string; + minHeight?: number | string; panelClass?: string | string[]; restoreFocus?: boolean; scrollStrategy?: ScrollStrategy;