style: format

packages/jsx-explorer/src/index.ts

@@ -1,30 +1,30 @@
-import * as monaco from 'monaco-editor';
-import { watchEffect } from 'vue';
-import { transform } from '@babel/standalone';
-import babelPluginJsx from '@vue/babel-plugin-jsx';
+import * as monaco from 'monaco-editor'
+import { watchEffect } from 'vue'
+import { transform } from '@babel/standalone'
+import babelPluginJsx from '@vue/babel-plugin-jsx'
 // @ts-expect-error missing types
-import typescript from '@babel/plugin-syntax-typescript';
+import typescript from '@babel/plugin-syntax-typescript'
 import {
   type VueJSXPluginOptions,
   compilerOptions,
   initOptions,
-} from './options';
-import './editor.worker';
-import './index.css';
+} from './options'
+import './editor.worker'
+import './index.css'
 
-main();
+main()
 
 interface PersistedState {
-  src: string;
-  options: VueJSXPluginOptions;
+  src: string
+  options: VueJSXPluginOptions
 }
 
 function main() {
   const persistedState: PersistedState = JSON.parse(
-    localStorage.getItem('state') || '{}'
-  );
+    localStorage.getItem('state') || '{}',
+  )
 
-  Object.assign(compilerOptions, persistedState.options);
+  Object.assign(compilerOptions, persistedState.options)
 
   const sharedEditorOptions: monaco.editor.IStandaloneEditorConstructionOptions =
     {
@@ -39,11 +39,11 @@ function main() {
       minimap: {
         enabled: false,
       },
-    };
+    }
 
   monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({
     noSemanticValidation: true,
-  });
+  })
   monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
     allowJs: true,
     allowNonTsExtensions: true,
@@ -51,7 +51,7 @@ function main() {
     target: monaco.languages.typescript.ScriptTarget.Latest,
     module: monaco.languages.typescript.ModuleKind.ESNext,
     isolatedModules: true,
-  });
+  })
 
   const editor = monaco.editor.create(document.getElementById('source')!, {
     ...sharedEditorOptions,
@@ -62,9 +62,9 @@ function main() {
 
 const App = defineComponent((props) => <div>Hello World</div>)`,
       'typescript',
-      monaco.Uri.parse('file:///app.tsx')
+      monaco.Uri.parse('file:///app.tsx'),
     ),
-  });
+  })
 
   const output = monaco.editor.create(document.getElementById('output')!, {
     readOnly: true,
@@ -72,19 +72,19 @@ const App = defineComponent((props) => <div>Hello World</div>)`,
     model: monaco.editor.createModel(
       '',
       'typescript',
-      monaco.Uri.parse('file:///output.tsx')
+      monaco.Uri.parse('file:///output.tsx'),
     ),
-  });
+  })
 
   const reCompile = () => {
-    const src = editor.getValue();
+    const src = editor.getValue()
     const state = JSON.stringify({
       src,
       options: compilerOptions,
-    });
-    localStorage.setItem('state', state);
-    window.location.hash = encodeURIComponent(src);
-    console.clear();
+    })
+    localStorage.setItem('state', state)
+    window.location.hash = encodeURIComponent(src)
+    console.clear()
     try {
       const res = transform(src, {
         babelrc: false,
@@ -93,37 +93,37 @@ const App = defineComponent((props) => <div>Hello World</div>)`,
           [typescript, { isTSX: true }],
         ],
         ast: true,
-      });
-      console.log('AST', res.ast!);
-      output.setValue(res.code!);
+      })
+      console.log('AST', res.ast!)
+      output.setValue(res.code!)
     } catch (err: any) {
-      console.error(err);
-      output.setValue(err.message!);
+      console.error(err)
+      output.setValue(err.message!)
     }
-  };
+  }
 
   // handle resize
   window.addEventListener('resize', () => {
-    editor.layout();
-    output.layout();
-  });
+    editor.layout()
+    output.layout()
+  })
 
-  initOptions();
-  watchEffect(reCompile);
+  initOptions()
+  watchEffect(reCompile)
 
   // update compile output when input changes
-  editor.onDidChangeModelContent(debounce(reCompile));
+  editor.onDidChangeModelContent(debounce(reCompile))
 }
 
 function debounce<T extends (...args: any[]) => any>(fn: T, delay = 300): T {
-  let prevTimer: number | null = null;
+  let prevTimer: number | null = null
   return ((...args: any[]) => {
     if (prevTimer) {
-      clearTimeout(prevTimer);
+      clearTimeout(prevTimer)
     }
     prevTimer = window.setTimeout(() => {
-      fn(...args);
-      prevTimer = null;
-    }, delay);
-  }) as any;
+      fn(...args)
+      prevTimer = null
+    }, delay)
+  }) as any
 }