[Drawer] PaperProps className override base class

[siriwatknp]

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

forwarding className to PaperProps in Drawer remove className from Drawer.

Expected Behavior 🤔

className should append to Paper in Drawer

Steps to Reproduce 🕹

const App = () => {
  return (
    <Drawer
      PaperProps={{
        className: "my-class"
      }}
    >...</Drawer>
  )
}

Drawer will not be fixed anymore

Tech	Version
Material-UI	v4.7.0
React
Browser
TypeScript
etc.

[oliviertassinari]

@siriwatknp Thanks for the bug report. I can confirm the issue. What do you think of this diff?

diff --git a/packages/material-ui/src/Drawer/Drawer.js b/packages/material-ui/src/Drawer/Drawer.js
index 4ac3496e1..1bd5ee5b1 100644
--- a/packages/material-ui/src/Drawer/Drawer.js
+++ b/packages/material-ui/src/Drawer/Drawer.js
@@ -113,7 +113,7 @@ const Drawer = React.forwardRef(function Drawer(props, ref) {
     ModalProps: { BackdropProps: BackdropPropsProp, ...ModalProps } = {},
     onClose,
     open = false,
-    PaperProps,
+    PaperProps = {},
     SlideProps,
     transitionDuration = defaultTransitionDuration,
     variant = 'temporary',
@@ -134,10 +134,15 @@ const Drawer = React.forwardRef(function Drawer(props, ref) {
     <Paper
       elevation={variant === 'temporary' ? elevation : 0}
       square
-      className={clsx(classes.paper, classes[`paperAnchor${capitalize(anchor)}`], {
-        [classes[`paperAnchorDocked${capitalize(anchor)}`]]: variant !== 'temporary',
-      })}
       {...PaperProps}
+      className={clsx(
+        classes.paper,
+        classes[`paperAnchor${capitalize(anchor)}`],
+        {
+          [classes[`paperAnchorDocked${capitalize(anchor)}`]]: variant !== 'temporary',
+        },
+        PaperProps.className,
+      )}
     >
       {children}
     </Paper>