diff --git a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.js b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.js index e8e375932f64a9..e52a34fbfadfb0 100644 --- a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.js +++ b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.js @@ -334,7 +334,7 @@ class SwipeableDrawer extends React.Component { ModalProps: { BackdropProps, ...ModalPropsProp } = {}, onOpen, open, - PaperProps, + PaperProps = {}, swipeAreaWidth, variant, ...other @@ -355,7 +355,10 @@ class SwipeableDrawer extends React.Component { }} PaperProps={{ ...PaperProps, - style: { pointerEvents: variant === 'temporary' && !open ? 'none' : '' }, + style: { + pointerEvents: variant === 'temporary' && !open ? 'none' : '', + ...PaperProps.style, + }, ref: this.handlePaperRef, }} {...other} diff --git a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js index be0264826eb388..9c0f16b6cccb31 100644 --- a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js +++ b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js @@ -100,6 +100,21 @@ describe('', () => { wrapper.unmount(); }); + it('should accept user custom style', () => { + const customStyle = { style: { backgroundColor: 'hotpink' } }; + const wrapper = mount( + {}} + onClose={() => {}} + open={false} + theme={createMuiTheme()} + PaperProps={customStyle} + />, + ); + + assert.strictEqual(wrapper.props().PaperProps, customStyle); + }); + describe('swipe to open', () => { let wrapper; let instance;