[core] Auto-fix upcoming eslint issues (mui#34644)

daniel-rabe · Nov 29, 2022 · 08c81ae · 08c81ae
1 parent a4d46b9
commit 08c81ae
Show file tree

Hide file tree

Showing 80 changed files with 1,234 additions and 1,166 deletions.
diff --git a/benchmark/server/scenarios/styles.js b/benchmark/server/scenarios/styles.js
@@ -84,9 +84,14 @@ function HookButton(props) {
   return <button type="button" className={classes.root} {...props} />;
 }
 
-const NakedButton = (props) => <button type="submit" {...props} />;
-// eslint-disable-next-line react/no-unknown-property
-const EmotionCssButton = (props) => <button type="submit" css={emotionCss} {...props} />;
+function NakedButton(props) {
+  return <button type="submit" {...props} />;
+}
+
+function EmotionCssButton(props) {
+  // eslint-disable-next-line react/no-unknown-property
+  return <button type="submit" css={emotionCss} {...props} />;
+}
 
 suite
   .add('StyledMuiButton', () => {

diff --git a/docs/data/base/components/focus-trap/ContainedToggleTrappedFocus.js b/docs/data/base/components/focus-trap/ContainedToggleTrappedFocus.js
@@ -6,19 +6,17 @@ export default function ContainedToggleTrappedFocus() {
   const [open, setOpen] = React.useState(false);
 
   return (
-    <React.Fragment>
-      <FocusTrap open={open} disableRestoreFocus disableAutoFocus>
-        <Stack alignItems="center" spacing={2}>
-          <button type="button" onClick={() => setOpen(!open)}>
-            {open ? 'Close' : 'Open'}
-          </button>
-          {open && (
-            <label>
-              First name: <input type="text" />
-            </label>
-          )}
-        </Stack>
-      </FocusTrap>
-    </React.Fragment>
+    <FocusTrap open={open} disableRestoreFocus disableAutoFocus>
+      <Stack alignItems="center" spacing={2}>
+        <button type="button" onClick={() => setOpen(!open)}>
+          {open ? 'Close' : 'Open'}
+        </button>
+        {open && (
+          <label>
+            First name: <input type="text" />
+          </label>
+        )}
+      </Stack>
+    </FocusTrap>
   );
 }
diff --git a/docs/data/base/components/focus-trap/ContainedToggleTrappedFocus.tsx b/docs/data/base/components/focus-trap/ContainedToggleTrappedFocus.tsx
@@ -6,19 +6,17 @@ export default function ContainedToggleTrappedFocus() {
   const [open, setOpen] = React.useState(false);
 
   return (
-    <React.Fragment>
-      <FocusTrap open={open} disableRestoreFocus disableAutoFocus>
-        <Stack alignItems="center" spacing={2}>
-          <button type="button" onClick={() => setOpen(!open)}>
-            {open ? 'Close' : 'Open'}
-          </button>
-          {open && (
-            <label>
-              First name: <input type="text" />
-            </label>
-          )}
-        </Stack>
-      </FocusTrap>
-    </React.Fragment>
+    <FocusTrap open={open} disableRestoreFocus disableAutoFocus>
+      <Stack alignItems="center" spacing={2}>
+        <button type="button" onClick={() => setOpen(!open)}>
+          {open ? 'Close' : 'Open'}
+        </button>
+        {open && (
+          <label>
+            First name: <input type="text" />
+          </label>
+        )}
+      </Stack>
+    </FocusTrap>
   );
 }
diff --git a/docs/data/base/components/focus-trap/ContainedToggleTrappedFocus.tsx.preview b/docs/data/base/components/focus-trap/ContainedToggleTrappedFocus.tsx.preview
@@ -1,14 +1,12 @@
-<React.Fragment>
-  <FocusTrap open={open} disableRestoreFocus disableAutoFocus>
-    <Stack alignItems="center" spacing={2}>
-      <button type="button" onClick={() => setOpen(!open)}>
-        {open ? 'Close' : 'Open'}
-      </button>
-      {open && (
-        <label>
-          First name: <input type="text" />
-        </label>
-      )}
-    </Stack>
-  </FocusTrap>
-</React.Fragment>
+<FocusTrap open={open} disableRestoreFocus disableAutoFocus>
+  <Stack alignItems="center" spacing={2}>
+    <button type="button" onClick={() => setOpen(!open)}>
+      {open ? 'Close' : 'Open'}
+    </button>
+    {open && (
+      <label>
+        First name: <input type="text" />
+      </label>
+    )}
+  </Stack>
+</FocusTrap>
diff --git a/docs/data/base/components/popper/PlacementPopper.js b/docs/data/base/components/popper/PlacementPopper.js
@@ -2,19 +2,21 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import PopperUnstyled from '@mui/base/PopperUnstyled';
 
-const Radio = ({ value, ...props }) => (
-  <span>
-    <input
-      type="radio"
-      id={`placement-${value}-radio`}
-      name="placement"
-      value={value}
-      style={{ margin: '0 0.375rem 0 1rem' }}
-      {...props}
-    />
-    <label htmlFor={`placement-${value}-radio`}>{value}</label>
-  </span>
-);
+function Radio({ value, ...props }) {
+  return (
+    <span>
+      <input
+        type="radio"
+        id={`placement-${value}-radio`}
+        name="placement"
+        value={value}
+        style={{ margin: '0 0.375rem 0 1rem' }}
+        {...props}
+      />
+      <label htmlFor={`placement-${value}-radio`}>{value}</label>
+    </span>
+  );
+}
 
 Radio.propTypes = {
   value: PropTypes.oneOfType([
@@ -24,37 +26,20 @@ Radio.propTypes = {
   ]),
 };
 
-const PlacementForm = ({ setPlacement }) => (
-  <div
-    style={{
-      backgroundColor: 'rgba(0,0,0,0.04)',
-      borderRadius: '4px',
-      padding: '0.5rem',
-    }}
-  >
-    <div style={{ textAlign: 'center' }}>
-      <b>Placement value:</b>
-    </div>
-    <div style={{ textAlign: 'center', padding: '0.5rem 0px' }}>
-      {['top-start', 'top', 'top-end'].map((value) => (
-        <Radio
-          key={value}
-          value={value}
-          onChange={(event) => {
-            setPlacement(event.target.value);
-          }}
-        />
-      ))}
-    </div>
+function PlacementForm({ setPlacement }) {
+  return (
     <div
       style={{
-        display: 'flex',
-        justifyContent: 'space-between',
-        padding: '0.5rem 0px',
+        backgroundColor: 'rgba(0,0,0,0.04)',
+        borderRadius: '4px',
+        padding: '0.5rem',
       }}
     >
-      <div>
-        {['left-start', 'left', 'left-end'].map((value) => (
+      <div style={{ textAlign: 'center' }}>
+        <b>Placement value:</b>
+      </div>
+      <div style={{ textAlign: 'center', padding: '0.5rem 0px' }}>
+        {['top-start', 'top', 'top-end'].map((value) => (
           <Radio
             key={value}
             value={value}
@@ -64,32 +49,51 @@ const PlacementForm = ({ setPlacement }) => (
           />
         ))}
       </div>
-      <div>
-        {['right-start', 'right', 'right-end'].map((value) => (
+      <div
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+          padding: '0.5rem 0px',
+        }}
+      >
+        <div>
+          {['left-start', 'left', 'left-end'].map((value) => (
+            <Radio
+              key={value}
+              value={value}
+              onChange={(event) => {
+                setPlacement(event.target.value);
+              }}
+            />
+          ))}
+        </div>
+        <div>
+          {['right-start', 'right', 'right-end'].map((value) => (
+            <Radio
+              key={value}
+              value={value}
+              onChange={(event) => {
+                setPlacement(event.target.value);
+              }}
+            />
+          ))}
+        </div>
+      </div>
+      <div style={{ textAlign: 'center', padding: '0.5rem 0px' }}>
+        {['bottom-start', 'bottom', 'bottom-end'].map((value) => (
           <Radio
             key={value}
             value={value}
+            defaultChecked={value === 'bottom'}
             onChange={(event) => {
               setPlacement(event.target.value);
             }}
           />
         ))}
       </div>
     </div>
-    <div style={{ textAlign: 'center', padding: '0.5rem 0px' }}>
-      {['bottom-start', 'bottom', 'bottom-end'].map((value) => (
-        <Radio
-          key={value}
-          value={value}
-          defaultChecked={value === 'bottom'}
-          onChange={(event) => {
-            setPlacement(event.target.value);
-          }}
-        />
-      ))}
-    </div>
-  </div>
-);
+  );
+}
 
 PlacementForm.propTypes = {
   setPlacement: PropTypes.func.isRequired,