[SwipeableDrawer] Allow custom style (mui#11805)

FluentSynergyDW · Jun 11, 2018 · 8ab1e4f · 8ab1e4f
1 parent 0863bba
commit 8ab1e4f
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 2 deletions.
diff --git 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
@@ -100,6 +100,21 @@ describe('<SwipeableDrawer />', () => {
     wrapper.unmount();
   });
 
+  it('should accept user custom style', () => {
+    const customStyle = { style: { backgroundColor: 'hotpink' } };
+    const wrapper = mount(
+      <SwipeableDrawerNaked
+        onOpen={() => {}}
+        onClose={() => {}}
+        open={false}
+        theme={createMuiTheme()}
+        PaperProps={customStyle}
+      />,
+    );
+
+    assert.strictEqual(wrapper.props().PaperProps, customStyle);
+  });
+
   describe('swipe to open', () => {
     let wrapper;
     let instance;