polish: format all files by ESLint Stylistic

docs/components/features/features.tsx

@@ -76,13 +76,14 @@ export function Feature({
       {...props}
     >
       {children}
-      {href
-        ? (
-          <Link className={styles.link} href={href} target='_blank'>
-            <ArrowRightIcon width='1.5em' />
-          </Link>
-        )
-        : null
+      {
+        href
+          ? (
+            <Link className={styles.link} href={href} target='_blank'>
+              <ArrowRightIcon width='1.5em' />
+            </Link>
+          )
+          : null
       }
     </motion.div>
   )

docs/components/marquee/marquee.tsx

@@ -28,7 +28,8 @@ export const Marquee: FC<PropsWithChildren<MarqueeOptions>> = ({
   delay = '0s',
   iteration = 'infinite',
 }) => {
-  if (!Children.count(children)) return null
+  if (!Children.count(children))
+    return null
 
   return (
     <div

docs/components/stack-blitz/stack-blitz.tsx

@@ -16,7 +16,8 @@ export const StackBlitz = ({
   hideExplorer?: boolean;
   showDevtools?: boolean;
 }) => {
-  if (isDev) return null
+  if (isDev)
+    return null
 
   // https://developer.stackblitz.com/guides/integration/embedding#embed-url-options
   const params: Record<string, string | number | undefined> = {

examples/umi4/typings.d.ts

@@ -1 +1 @@
-import 'umi/typings';
+import 'umi/typings'

packages/babel-plugin/src/tests/babel-plugin.test.ts

@@ -1,6 +1,5 @@
 import path from 'node:path'
-import { transformSync } from '@babel/core'
-import type { TransformOptions } from '@babel/core'
+import { transformSync, type TransformOptions } from '@babel/core'
 import globby from 'globby'
 import pluginTester from 'babel-plugin-tester'
 import InspectorBabelPlugin, { type InspectorPluginOptions } from '..'

packages/babel-plugin/src/tests/fixtures/layouts/index.tsx

@@ -1,7 +1,6 @@
 import React from 'react'
 import { Global } from '@emotion/react'
-import { Inspector } from 'react-dev-inspector'
-import type { InspectParams } from 'react-dev-inspector'
+import { Inspector, type InspectParams } from 'react-dev-inspector'
 import { Title } from './components/Title'
 import { Slogan } from './components/Slogan'
 import { KeyPad, Keypress } from './components/Keypress'
@@ -17,7 +16,8 @@ export const HomePage = () => {
       disableLaunchEditor={!isDev}
       onClickElement={(inspect: InspectParams) => {
         console.debug(inspect)
-        if (isDev || !inspect.codeInfo?.relativePath) return
+        if (isDev || !inspect.codeInfo?.relativePath)
+          return
 
         const {
           relativePath,

packages/babel-plugin/src/visitor.ts

@@ -34,8 +34,10 @@ export const createVisitor = ({ cwd = process.cwd(), excludes }: {
     JSXOpeningElement: {
       enter(path, state: PluginPass) {
         const filePath = state?.file?.opts?.filename
-        if (!filePath) return
-        if (isExclude(filePath)) return
+        if (!filePath)
+          return
+        if (isExclude(filePath))
+          return
 
         const relativePath = pathRelative(filePath)
 
@@ -57,7 +59,8 @@ export const createVisitor = ({ cwd = process.cwd(), excludes }: {
  * simple path match method, only use string and regex
  */
 export const pathMatch = (filePath: string, matches?: (string | RegExp)[]): boolean => {
-  if (!matches?.length) return false
+  if (!matches?.length)
+    return false
 
   return matches.some((match) => {
     if (typeof match === 'string') {
@@ -85,11 +88,12 @@ const doJSXPathName: NodeHandler<JSXOpeningElement['name']> = (name) => {
 }
 
 export const doJSXOpeningElement: NodeHandler<
-JSXOpeningElement,
-{ relativePath: string }
+  JSXOpeningElement,
+  { relativePath: string }
 > = (node, option) => {
   const { stop } = doJSXPathName(node.name)
-  if (stop) return { stop }
+  if (stop)
+    return { stop }
 
   const { relativePath } = option
   const line = node.loc?.start.line

packages/inspector/src/Inspector/utils/editor.ts

@@ -21,7 +21,8 @@ const getCodeInfo = (_codeInfo: CodeInfoLike): CodeInfo => (
 export const gotoServerEditor = (_codeInfo?: CodeInfoLike, options?: {
   editor?: TrustedEditor;
 }) => {
-  if (!_codeInfo) return
+  if (!_codeInfo)
+    return
   const codeInfo = getCodeInfo(_codeInfo)
 
   const {

packages/inspector/src/Inspector/utils/fiber.ts

@@ -1,6 +1,4 @@
 import type { Fiber } from 'react-reconciler'
-
-// eslint-disable-next-line unused-imports/no-unused-imports
 import type { InspectAgent } from '../types'
 
 
@@ -31,7 +29,8 @@ const cachedFiberKeys: Set<string> = new Set()
  * like: https://github.com/facebook/react/blob/v17.0.0/packages/react-dom/src/client/ReactDOM.js#L220
  */
 const getFiberWithDevtoolHook = (element: any): Fiber | undefined => {
-  if (!window.__REACT_DEVTOOLS_GLOBAL_HOOK__?.renderers) return
+  if (!window.__REACT_DEVTOOLS_GLOBAL_HOOK__?.renderers)
+    return
 
   const { renderers } = window.__REACT_DEVTOOLS_GLOBAL_HOOK__
 
@@ -90,9 +89,11 @@ export const getElementFiber = (_element?: Element): Fiber | undefined => {
 }
 
 export const getElementFiberUpward = (element: Element | null | undefined): Fiber | undefined => {
-  if (!element) return undefined
+  if (!element)
+    return undefined
   const fiber = getElementFiber(element)
-  if (fiber) return fiber
+  if (fiber)
+    return fiber
   return getElementFiberUpward(element.parentElement)
 }
 
@@ -150,8 +151,10 @@ export function * genFiberSourceChain(fiber?: Fiber | null): Generator<Fiber, vo
  */
 export const getFiberName = (fiber?: Fiber | null): string | undefined => {
   const fiberType = fiber?.type
-  if (!fiberType) return undefined
-  if (typeof fiberType === 'string') return fiberType
+  if (!fiberType)
+    return undefined
+  if (typeof fiberType === 'string')
+    return fiberType
 
   const { displayName, name } = fiberType
 
@@ -277,8 +280,10 @@ export const getDisplayNameForFiber = (fiber: Fiber): string | null => {
  * https://github.com/facebook/react/blob/v18.3.0/packages/react-devtools-shared/src/backend/renderer.js#L418
  */
 const resolveFiberType = (type: any): (() => void) | null => {
-  if (!type) return null
-  if (typeof type === 'function') return type
+  if (!type)
+    return null
+  if (typeof type === 'function')
+    return type
   if (typeof type === 'object' && '$$typeof' in type) {
     switch (type.$$typeof) {
       case Symbol.for('react.memo'): {

packages/inspector/src/Inspector/utils/inspect.ts

@@ -33,7 +33,8 @@ import {
  *     https://github.com/facebook/react/blob/v18.0.0/packages/react-reconciler/src/ReactFiber.new.js#L648-L649
  */
 export const getCodeInfoFromDebugSource = (fiber?: Fiber): CodeInfo | undefined => {
-  if (!fiber) return undefined
+  if (!fiber)
+    return undefined
 
   /**
    * only find forward with 2 level _debugOwner, otherwise to normal `fiber.return`
@@ -44,7 +45,8 @@ export const getCodeInfoFromDebugSource = (fiber?: Fiber): CodeInfo | undefined
     ?? fiber._debugOwner?._debugOwner?._debugSource
   ) as Source & { columnNumber?: number }
 
-  if (!debugSource) return undefined
+  if (!debugSource)
+    return undefined
 
   const {
     fileName,
@@ -76,7 +78,8 @@ export const getCodeInfoFromDebugSource = (fiber?: Fiber): CodeInfo | undefined
  * code location data-attribute props inject by `@react-dev-inspector/babel-plugin`
  */
 export const getCodeInfoFromProps = (fiber?: Fiber): CodeInfo | undefined => {
-  if (!fiber?.pendingProps) return undefined
+  if (!fiber?.pendingProps)
+    return undefined
 
   const {
     'data-inspector-line': lineNumber,
@@ -101,7 +104,8 @@ export const getCodeInfoFromFiber = (fiber?: Fiber): CodeInfo | undefined => {
     getCodeInfoFromProps(fiber),
   ].filter(Boolean) as CodeInfo[]
 
-  if (!codeInfos.length) return undefined
+  if (!codeInfos.length)
+    return undefined
   return Object.assign({}, ...codeInfos)
 }
 
@@ -151,10 +155,12 @@ export const getCodeInfoFromFiber = (fiber?: Fiber): CodeInfo | undefined => {
  *    └─ div
  */
 export const getReferenceFiber = (baseFiber?: Fiber): Fiber | undefined => {
-  if (!baseFiber) return undefined
+  if (!baseFiber)
+    return undefined
 
   const directParent = getDirectParentFiber(baseFiber)
-  if (!directParent) return undefined
+  if (!directParent)
+    return undefined
 
   const isParentNative = isNativeTagFiber(directParent)
   const isOnlyOneChild = !directParent.child!.sibling
@@ -167,7 +173,8 @@ export const getReferenceFiber = (baseFiber?: Fiber): Fiber | undefined => {
   const originReferenceFiber = referenceFiber
 
   while (referenceFiber) {
-    if (getCodeInfoFromFiber(referenceFiber)) return referenceFiber
+    if (getCodeInfoFromFiber(referenceFiber))
+      return referenceFiber
 
     referenceFiber = referenceFiber.return!
   }
@@ -211,9 +218,11 @@ export const getNamedFiber = (baseFiber?: Fiber): Fiber | undefined => {
     }
 
     if (getFiberName(fiber)) {
-      if (!originNamedFiber) originNamedFiber = fiber
+      if (!originNamedFiber)
+        originNamedFiber = fiber
 
-      if (getCodeInfoFromFiber(fiber)) return fiber
+      if (getCodeInfoFromFiber(fiber))
+        return fiber
     }
 
     fiber = parent!

packages/inspector/src/global.d.ts

@@ -2,7 +2,7 @@ declare module 'global' {
   /**
    * those types are internals in 'https://github.com/facebook/react/blob/v16.14.0/packages/react-devtools-shared/src/backend/types.js'
    */
-  type RendererID = number;
+  type RendererID = number
   interface ReactRenderer {
     findFiberByHostInstance: (instance: any) => Fiber | undefined;
   };
@@ -15,9 +15,9 @@ declare module 'global' {
        */
       __REACT_DEVTOOLS_GLOBAL_HOOK__?: {
         renderers: Map<RendererID, ReactRenderer>;
-      },
+      };
 
-      __REACT_DEVTOOLS_TARGET_WINDOW__: Window,
+      __REACT_DEVTOOLS_TARGET_WINDOW__: Window;
     }
   }
 }

packages/launch-editor-endpoint/src/endpoint.ts

@@ -1,4 +1,3 @@
-// eslint-disable-next-line unused-imports/no-unused-imports
 import type { LaunchEditorParams } from './types'
 
 /**

packages/middleware/src/global.d.ts

@@ -5,8 +5,8 @@ declare module 'launch-editor' {
    */
   interface LaunchEditorFunction {
     (file: ComposableFilePath): void;
-    (file: ComposableFilePath, specifiedEditor: string): void
-    (file: ComposableFilePath, onErrorCallback: (fileName: string, message: string | null) => void): void
+    (file: ComposableFilePath, specifiedEditor: string): void;
+    (file: ComposableFilePath, onErrorCallback: (fileName: string, message: string | null) => void): void;
   }
 
   type ComposableFilePath =

packages/web-components/rollup.config.ts

@@ -148,10 +148,7 @@ export default defineConfig(() => {
 })
 
 
-/**
- * @returns {ts.CompilerOptions}
- */
-const readCompilerOptions = (tsconfigPath = 'tsconfig.json') => {
+const readCompilerOptions = (tsconfigPath = 'tsconfig.json'): ts.CompilerOptions => {
   const configFile = ts.readConfigFile(
     tsconfigPath,
     ts.sys.readFile,

packages/web-components/src/InspectContextPanel/ElementInspectPanel.tsx

@@ -224,7 +224,8 @@ export const ElementInspectPanel = <Item extends ItemInfo = ItemInfo>(props: Ele
                           'aria-selected': isSelected(),
                         }}
                         onClick={() => {
-                          if (isSelected()) return
+                          if (isSelected())
+                            return
                           setSelectedLayers(selects => ({
                             ...selects,
                             [props.elementChainMode]: index(),

packages/web-components/src/Overlay/Overlay.stories.tsx

@@ -192,7 +192,8 @@ export const MoveableDragItem: StoryFn<{ itemSize: 'normal' | 'full' | 'large' }
   }>({})
 
   const inspectOnElement = (element?: HTMLElement | null) => {
-    if (!element) return
+    if (!element)
+      return
 
     const boxSizing = getElementDimensions(element)
     const boundingRect = getBoundingRect(element)

packages/web-components/src/Overlay/OverlayTip.tsx

@@ -96,9 +96,10 @@ export const InspectorOverlayTip = (props: {
         {styles}
       </style>
       <style>
-        {props.showCornerHint
-          ? showCornerHintStyles
-          : null
+        {
+          props.showCornerHint
+            ? showCornerHintStyles
+            : null
         }
       </style>
       <div
@@ -168,15 +169,16 @@ const styles = css`
   user-select: none;
   overflow: hidden;
 
-  ${(isSafari
-    // for Safari bug of multiple drop-shadow with overflow:hidden will clip shadow
-    ? css`
-      filter: drop-shadow(0 0 1px #eee9);
-    `
-    : css`
-      filter: drop-shadow(0 0 1px #eee9) drop-shadow(2px 10px 12px var(--color-shadow-1)) drop-shadow(-3px 3px 6px var(--color-shadow-2)) drop-shadow(0 -6px 8px var(--color-shadow-1));
-    `
-  )}
+  ${
+    isSafari
+      // for Safari bug of multiple drop-shadow with overflow:hidden will clip shadow
+      ? css`
+        filter: drop-shadow(0 0 1px #eee9);
+      `
+      : css`
+        filter: drop-shadow(0 0 1px #eee9) drop-shadow(2px 10px 12px var(--color-shadow-1)) drop-shadow(-3px 3px 6px var(--color-shadow-2)) drop-shadow(0 -6px 8px var(--color-shadow-1));
+      `
+  }
 
   .inspector-tip-info-row {
     display: flex;

packages/web-components/src/components/ContextPanel/ContextPanel.stories.tsx

@@ -167,13 +167,14 @@ export const ContextPanelDemo: StoryFn = () => {
                               'aria-selected': isSelected(),
                             }}
                             onClick={() => {
-                              if (isSelected()) return
+                              if (isSelected())
+                                return
                               setSelectedLayer(index)
                               onLayerChange(index)
                             }}
                           >
                             <Layer.LayerItemText>
-                                #{index}
+                              #{index}
                             </Layer.LayerItemText>
                           </S.LayerButton>
                         </Layer.LayerItem>