[docs] Improve code preview coverage

Author: oliviertassinari

docs/src/modules/components/Demo.js

@@ -300,7 +300,7 @@ function Demo(props) {
     !demoOptions.hideHeader &&
     demoOptions.defaultCodeOpen !== false &&
     jsx !== demoData.raw &&
-    jsx.split(/\n/).length <= 16;
+    jsx.split(/\n/).length <= 17;
 
   let showCodeLabel;
   if (codeOpen) {

docs/src/pages/components/backdrop/SimpleBackdrop.js

@@ -13,24 +13,19 @@ const useStyles = makeStyles(theme => ({
 export default function SimpleBackdrop() {
   const classes = useStyles();
   const [open, setOpen] = React.useState(false);
+  const handleClose = () => {
+    setOpen(false);
+  };
+  const handleToggle = () => {
+    setOpen(!open);
+  };
 
   return (
     <div>
-      <button
-        type="button"
-        onClick={() => {
-          setOpen(!open);
-        }}
-      >
+      <button type="button" onClick={handleToggle}>
         Show backdrop
       </button>
-      <Backdrop
-        className={classes.backdrop}
-        open={open}
-        onClick={() => {
-          setOpen(false);
-        }}
-      >
+      <Backdrop className={classes.backdrop} open={open} onClick={handleClose}>
         <CircularProgress color="inherit" />
       </Backdrop>
     </div>

docs/src/pages/components/backdrop/SimpleBackdrop.tsx

@@ -15,24 +15,19 @@ const useStyles = makeStyles((theme: Theme) =>
 export default function SimpleBackdrop() {
   const classes = useStyles();
   const [open, setOpen] = React.useState(false);
+  const handleClose = () => {
+    setOpen(false);
+  };
+  const handleToggle = () => {
+    setOpen(!open);
+  };
 
   return (
     <div>
-      <button
-        type="button"
-        onClick={() => {
-          setOpen(!open);
-        }}
-      >
+      <button type="button" onClick={handleToggle}>
         Show backdrop
       </button>
-      <Backdrop
-        className={classes.backdrop}
-        open={open}
-        onClick={() => {
-          setOpen(false);
-        }}
-      >
+      <Backdrop className={classes.backdrop} open={open} onClick={handleClose}>
         <CircularProgress color="inherit" />
       </Backdrop>
     </div>