@vitejs/plugin-react 2.2.0-beta.0 → 2.2.0

package/dist/chunks/babel-restore-jsx.cjs

@@ -135,4 +135,4 @@ function babelRestoreJsx({ types: t }, { reactAlias = "React" }) {
   };
 }
 
-exports["default"] = babelRestoreJsx;
+exports.default = babelRestoreJsx;

package/dist/index.cjs

@@ -7,37 +7,31 @@ const MagicString = require('magic-string');
 const fs = require('node:fs');
 const node_module = require('node:module');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e["default"] : e; }
-
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
+function _interopNamespaceDefault(e) {
   const n = Object.create(null);
   if (e) {
     for (const k in e) {
       n[k] = e[k];
     }
   }
-  n["default"] = e;
+  n.default = e;
   return n;
 }
 
-const path__default = /*#__PURE__*/_interopDefaultLegacy(path);
-const babel__namespace = /*#__PURE__*/_interopNamespace(babel);
-const MagicString__default = /*#__PURE__*/_interopDefaultLegacy(MagicString);
-const fs__default = /*#__PURE__*/_interopDefaultLegacy(fs);
+const babel__namespace = /*#__PURE__*/_interopNamespaceDefault(babel);
 
 const runtimePublicPath = "/@react-refresh";
 const _require = node_module.createRequire((typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('index.cjs', document.baseURI).href)));
-const reactRefreshDir = path__default.dirname(
+const reactRefreshDir = path.dirname(
   _require.resolve("react-refresh/package.json")
 );
-const runtimeFilePath = path__default.join(
+const runtimeFilePath = path.join(
   reactRefreshDir,
   "cjs/react-refresh-runtime.development.js"
 );
 const runtimeCode = `
 const exports = {}
-${fs__default.readFileSync(runtimeFilePath, "utf-8")}
+${fs.readFileSync(runtimeFilePath, "utf-8")}
 function debounce(fn, delay) {
   let handle
   return () => {
@@ -262,7 +256,7 @@ function viteReact(opts = {}) {
     configResolved(config) {
       devBase = config.base;
       projectRoot = config.root;
-      resolvedCacheDir = vite.normalizePath(path__default.resolve(config.cacheDir));
+      resolvedCacheDir = vite.normalizePath(path.resolve(config.cacheDir));
       filter = vite.createFilter(opts.include, opts.exclude, {
         resolve: projectRoot
       });
@@ -363,7 +357,7 @@ function viteReact(opts = {}) {
         let inputMap;
         if (prependReactImport) {
           if (needHiresSourcemap) {
-            const s = new MagicString__default(code);
+            const s = new MagicString(code);
             s.prepend(prependReactImportCode);
             code = s.toString();
             inputMap = s.generateMap({ hires: true, source: id });
@@ -519,4 +513,4 @@ function createBabelOptions(rawOptions) {
 }
 
 module.exports = viteReact;
-module.exports["default"] = viteReact;
+module.exports.default = viteReact;

package/package.json

@@ -1,14 +1,13 @@
 {
   "name": "@vitejs/plugin-react",
-  "version": "2.2.0-beta.0",
+  "version": "2.2.0",
   "license": "MIT",
   "author": "Evan You",
   "contributors": [
     "Alec Larson"
   ],
   "files": [
-    "dist",
-    "src"
+    "dist"
   ],
   "main": "./dist/index.cjs",
   "module": "./dist/index.mjs",
@@ -39,12 +38,12 @@
   },
   "homepage": "https://github.com/vitejs/vite/tree/main/packages/plugin-react#readme",
   "dependencies": {
-    "@babel/core": "^7.19.3",
+    "@babel/core": "^7.19.6",
     "@babel/plugin-transform-react-jsx": "^7.19.0",
     "@babel/plugin-transform-react-jsx-development": "^7.18.6",
     "@babel/plugin-transform-react-jsx-self": "^7.18.6",
-    "@babel/plugin-transform-react-jsx-source": "^7.18.6",
-    "magic-string": "^0.26.5",
+    "@babel/plugin-transform-react-jsx-source": "^7.19.6",
+    "magic-string": "^0.26.7",
     "react-refresh": "^0.14.0"
   },
   "peerDependencies": {

package/src/babel.d.ts

@@ -1,4 +0,0 @@
-declare module '@babel/plugin-transform-react-jsx'
-declare module '@babel/plugin-transform-react-jsx-self'
-declare module '@babel/plugin-transform-react-jsx-source'
-declare module 'react-refresh/babel.js'

package/src/fast-refresh.ts

@@ -1,155 +0,0 @@
-import fs from 'node:fs'
-import path from 'node:path'
-import { createRequire } from 'node:module'
-import type { types as t } from '@babel/core'
-
-export const runtimePublicPath = '/@react-refresh'
-
-const _require = createRequire(import.meta.url)
-const reactRefreshDir = path.dirname(
-  _require.resolve('react-refresh/package.json')
-)
-const runtimeFilePath = path.join(
-  reactRefreshDir,
-  'cjs/react-refresh-runtime.development.js'
-)
-
-export const runtimeCode = `
-const exports = {}
-${fs.readFileSync(runtimeFilePath, 'utf-8')}
-function debounce(fn, delay) {
-  let handle
-  return () => {
-    clearTimeout(handle)
-    handle = setTimeout(fn, delay)
-  }
-}
-exports.performReactRefresh = debounce(exports.performReactRefresh, 16)
-export default exports
-`
-
-export const preambleCode = `
-import RefreshRuntime from "__BASE__${runtimePublicPath.slice(1)}"
-RefreshRuntime.injectIntoGlobalHook(window)
-window.$RefreshReg$ = () => {}
-window.$RefreshSig$ = () => (type) => type
-window.__vite_plugin_react_preamble_installed__ = true
-`
-
-const header = `
-import RefreshRuntime from "${runtimePublicPath}";
-
-let prevRefreshReg;
-let prevRefreshSig;
-
-if (import.meta.hot) {
-  if (!window.__vite_plugin_react_preamble_installed__) {
-    throw new Error(
-      "@vitejs/plugin-react can't detect preamble. Something is wrong. " +
-      "See https://github.com/vitejs/vite-plugin-react/pull/11#discussion_r430879201"
-    );
-  }
-
-  prevRefreshReg = window.$RefreshReg$;
-  prevRefreshSig = window.$RefreshSig$;
-  window.$RefreshReg$ = (type, id) => {
-    RefreshRuntime.register(type, __SOURCE__ + " " + id)
-  };
-  window.$RefreshSig$ = RefreshRuntime.createSignatureFunctionForTransform;
-}`.replace(/[\n]+/gm, '')
-
-const timeout = `
-  if (!window.__vite_plugin_react_timeout) {
-    window.__vite_plugin_react_timeout = setTimeout(() => {
-      window.__vite_plugin_react_timeout = 0;
-      RefreshRuntime.performReactRefresh();
-    }, 30);
-  }
-`
-
-const footer = `
-if (import.meta.hot) {
-  window.$RefreshReg$ = prevRefreshReg;
-  window.$RefreshSig$ = prevRefreshSig;
-
-  __ACCEPT__
-}`
-
-const checkAndAccept = `
-function isReactRefreshBoundary(mod) {
-  if (mod == null || typeof mod !== 'object') {
-    return false;
-  }
-  let hasExports = false;
-  let areAllExportsComponents = true;
-  for (const exportName in mod) {
-    hasExports = true;
-    if (exportName === '__esModule') {
-      continue;
-    }
-    const desc = Object.getOwnPropertyDescriptor(mod, exportName);
-    if (desc && desc.get) {
-      // Don't invoke getters as they may have side effects.
-      return false;
-    }
-    const exportValue = mod[exportName];
-    if (!RefreshRuntime.isLikelyComponentType(exportValue)) {
-      areAllExportsComponents = false;
-    }
-  }
-  return hasExports && areAllExportsComponents;
-}
-
-import.meta.hot.accept(mod => {
-  if (isReactRefreshBoundary(mod)) {
-    ${timeout}
-  } else {
-    import.meta.hot.invalidate();
-  }
-});
-`
-
-export function addRefreshWrapper(
-  code: string,
-  id: string,
-  accept: boolean
-): string {
-  return (
-    header.replace('__SOURCE__', JSON.stringify(id)) +
-    code +
-    footer.replace('__ACCEPT__', accept ? checkAndAccept : timeout)
-  )
-}
-
-export function isRefreshBoundary(ast: t.File): boolean {
-  // Every export must be a potential React component.
-  // We'll also perform a runtime check that's more robust as well (isLikelyComponentType).
-  return ast.program.body.every((node) => {
-    if (node.type !== 'ExportNamedDeclaration') {
-      return true
-    }
-    const { declaration, specifiers } = node
-    if (declaration) {
-      if (declaration.type === 'ClassDeclaration') return false
-      if (declaration.type === 'VariableDeclaration') {
-        return declaration.declarations.every((variable) =>
-          isComponentLikeIdentifier(variable.id)
-        )
-      }
-      if (declaration.type === 'FunctionDeclaration') {
-        return !!declaration.id && isComponentLikeIdentifier(declaration.id)
-      }
-    }
-    return specifiers.every((spec) => {
-      return isComponentLikeIdentifier(spec.exported)
-    })
-  })
-}
-
-function isComponentLikeIdentifier(node: t.Node): boolean {
-  return node.type === 'Identifier' && isComponentLikeName(node.name)
-}
-
-function isComponentLikeName(name: string): boolean {
-  return typeof name === 'string' && name[0] >= 'A' && name[0] <= 'Z'
-}

package/src/index.ts

@@ -1,479 +0,0 @@
-import path from 'node:path'
-import type { ParserOptions, TransformOptions, types as t } from '@babel/core'
-import * as babel from '@babel/core'
-import { createFilter, normalizePath } from 'vite'
-import type { Plugin, PluginOption, ResolvedConfig } from 'vite'
-import MagicString from 'magic-string'
-import type { SourceMap } from 'magic-string'
-import {
-  addRefreshWrapper,
-  isRefreshBoundary,
-  preambleCode,
-  runtimeCode,
-  runtimePublicPath
-} from './fast-refresh'
-import { babelImportToRequire } from './jsx-runtime/babel-import-to-require'
-import { restoreJSX } from './jsx-runtime/restore-jsx'
-
-export interface Options {
-  include?: string | RegExp | Array<string | RegExp>
-  exclude?: string | RegExp | Array<string | RegExp>
-  /**
-   * Enable `react-refresh` integration. Vite disables this in prod env or build mode.
-   * @default true
-   */
-  fastRefresh?: boolean
-  /**
-   * Set this to `"automatic"` to use [vite-react-jsx](https://github.com/alloc/vite-react-jsx).
-   * @default "automatic"
-   */
-  jsxRuntime?: 'classic' | 'automatic'
-  /**
-   * Control where the JSX factory is imported from.
-   * This option is ignored when `jsxRuntime` is not `"automatic"`.
-   * @default "react"
-   */
-  jsxImportSource?: string
-  /**
-   * Set this to `true` to annotate the JSX factory with `\/* @__PURE__ *\/`.
-   * This option is ignored when `jsxRuntime` is not `"automatic"`.
-   * @default true
-   */
-  jsxPure?: boolean
-  /**
-   * Toggles whether or not to throw an error if an XML namespaced tag name is used.
-   * @default true
-   */
-  jsxThrowIfNamespace?: boolean
-  /**
-   * Babel configuration applied in both dev and prod.
-   */
-  babel?:
-    | BabelOptions
-    | ((id: string, options: { ssr?: boolean }) => BabelOptions)
-}
-
-export type BabelOptions = Omit<
-  TransformOptions,
-  | 'ast'
-  | 'filename'
-  | 'root'
-  | 'sourceFileName'
-  | 'sourceMaps'
-  | 'inputSourceMap'
->
-
-/**
- * The object type used by the `options` passed to plugins with
- * an `api.reactBabel` method.
- */
-export interface ReactBabelOptions extends BabelOptions {
-  plugins: Extract<BabelOptions['plugins'], any[]>
-  presets: Extract<BabelOptions['presets'], any[]>
-  overrides: Extract<BabelOptions['overrides'], any[]>
-  parserOpts: ParserOptions & {
-    plugins: Extract<ParserOptions['plugins'], any[]>
-  }
-}
-
-type ReactBabelHook = (
-  babelConfig: ReactBabelOptions,
-  context: ReactBabelHookContext,
-  config: ResolvedConfig
-) => void
-
-type ReactBabelHookContext = { ssr: boolean; id: string }
-
-declare module 'vite' {
-  export interface Plugin {
-    api?: {
-      /**
-       * Manipulate the Babel options of `@vitejs/plugin-react`
-       */
-      reactBabel?: ReactBabelHook
-    }
-  }
-}
-
-const prependReactImportCode = "import React from 'react'; "
-
-export default function viteReact(opts: Options = {}): PluginOption[] {
-  // Provide default values for Rollup compat.
-  let devBase = '/'
-  let resolvedCacheDir: string
-  let filter = createFilter(opts.include, opts.exclude)
-  let needHiresSourcemap = false
-  let isProduction = true
-  let projectRoot = process.cwd()
-  let skipFastRefresh = opts.fastRefresh === false
-  let skipReactImport = false
-  let runPluginOverrides = (
-    options: ReactBabelOptions,
-    context: ReactBabelHookContext
-  ) => false
-  let staticBabelOptions: ReactBabelOptions | undefined
-
-  const useAutomaticRuntime = opts.jsxRuntime !== 'classic'
-
-  // Support patterns like:
-  // - import * as React from 'react';
-  // - import React from 'react';
-  // - import React, {useEffect} from 'react';
-  const importReactRE = /(^|\n)import\s+(\*\s+as\s+)?React(,|\s+)/
-
-  // Any extension, including compound ones like '.bs.js'
-  const fileExtensionRE = /\.[^\/\s\?]+$/
-
-  const viteBabel: Plugin = {
-    name: 'vite:react-babel',
-    enforce: 'pre',
-    config() {
-      if (opts.jsxRuntime === 'classic') {
-        return {
-          esbuild: {
-            logOverride: {
-              'this-is-undefined-in-esm': 'silent'
-            }
-          }
-        }
-      }
-    },
-    configResolved(config) {
-      devBase = config.base
-      projectRoot = config.root
-      resolvedCacheDir = normalizePath(path.resolve(config.cacheDir))
-      filter = createFilter(opts.include, opts.exclude, {
-        resolve: projectRoot
-      })
-      needHiresSourcemap =
-        config.command === 'build' && !!config.build.sourcemap
-      isProduction = config.isProduction
-      skipFastRefresh ||= isProduction || config.command === 'build'
-
-      const jsxInject = config.esbuild && config.esbuild.jsxInject
-      if (jsxInject && importReactRE.test(jsxInject)) {
-        skipReactImport = true
-        config.logger.warn(
-          '[@vitejs/plugin-react] This plugin imports React for you automatically,' +
-            ' so you can stop using `esbuild.jsxInject` for that purpose.'
-        )
-      }
-
-      config.plugins.forEach((plugin) => {
-        const hasConflict =
-          plugin.name === 'react-refresh' ||
-          (plugin !== viteReactJsx && plugin.name === 'vite:react-jsx')
-
-        if (hasConflict)
-          return config.logger.warn(
-            `[@vitejs/plugin-react] You should stop using "${plugin.name}" ` +
-              `since this plugin conflicts with it.`
-          )
-      })
-
-      runPluginOverrides = (babelOptions, context) => {
-        const hooks = config.plugins
-          .map((plugin) => plugin.api?.reactBabel)
-          .filter(Boolean) as ReactBabelHook[]
-
-        if (hooks.length > 0) {
-          return (runPluginOverrides = (babelOptions, context) => {
-            hooks.forEach((hook) => hook(babelOptions, context, config))
-            return true
-          })(babelOptions, context)
-        }
-        runPluginOverrides = () => false
-        return false
-      }
-    },
-    async transform(code, id, options) {
-      const ssr = options?.ssr === true
-      // File extension could be mocked/overridden in querystring.
-      const [filepath, querystring = ''] = id.split('?')
-      const [extension = ''] =
-        querystring.match(fileExtensionRE) ||
-        filepath.match(fileExtensionRE) ||
-        []
-
-      if (/\.(mjs|[tj]sx?)$/.test(extension)) {
-        const isJSX = extension.endsWith('x')
-        const isNodeModules = id.includes('/node_modules/')
-        const isProjectFile =
-          !isNodeModules && (id[0] === '\0' || id.startsWith(projectRoot + '/'))
-
-        let babelOptions = staticBabelOptions
-        if (typeof opts.babel === 'function') {
-          const rawOptions = opts.babel(id, { ssr })
-          babelOptions = createBabelOptions(rawOptions)
-          runPluginOverrides(babelOptions, { ssr, id: id })
-        } else if (!babelOptions) {
-          babelOptions = createBabelOptions(opts.babel)
-          if (!runPluginOverrides(babelOptions, { ssr, id: id })) {
-            staticBabelOptions = babelOptions
-          }
-        }
-
-        const plugins = isProjectFile ? [...babelOptions.plugins] : []
-
-        let useFastRefresh = false
-        if (!skipFastRefresh && !ssr && !isNodeModules) {
-          // Modules with .js or .ts extension must import React.
-          const isReactModule = isJSX || importReactRE.test(code)
-          if (isReactModule && filter(id)) {
-            useFastRefresh = true
-            plugins.push([
-              await loadPlugin('react-refresh/babel'),
-              { skipEnvCheck: true }
-            ])
-          }
-        }
-
-        let ast: t.File | null | undefined
-        let prependReactImport = false
-        if (!isProjectFile || isJSX) {
-          if (useAutomaticRuntime) {
-            // By reverse-compiling "React.createElement" calls into JSX,
-            // React elements provided by dependencies will also use the
-            // automatic runtime!
-            // Avoid parsing the optimized react-dom since it will never
-            // contain compiled JSX and it's a pretty big file (800kb).
-            const isOptimizedReactDom =
-              id.startsWith(resolvedCacheDir) && id.includes('/react-dom.js')
-            const [restoredAst, isCommonJS] =
-              !isProjectFile && !isJSX && !isOptimizedReactDom
-                ? await restoreJSX(babel, code, id)
-                : [null, false]
-
-            if (isJSX || (ast = restoredAst)) {
-              plugins.push([
-                await loadPlugin(
-                  '@babel/plugin-transform-react-jsx' +
-                    (isProduction ? '' : '-development')
-                ),
-                {
-                  runtime: 'automatic',
-                  importSource: opts.jsxImportSource,
-                  pure: opts.jsxPure !== false,
-                  throwIfNamespace: opts.jsxThrowIfNamespace
-                }
-              ])
-
-              // Avoid inserting `import` statements into CJS modules.
-              if (isCommonJS) {
-                plugins.push(babelImportToRequire)
-              }
-            }
-          } else if (isProjectFile) {
-            // These plugins are only needed for the classic runtime.
-            if (!isProduction) {
-              plugins.push(
-                await loadPlugin('@babel/plugin-transform-react-jsx-self'),
-                await loadPlugin('@babel/plugin-transform-react-jsx-source')
-              )
-            }
-
-            // Even if the automatic JSX runtime is not used, we can still
-            // inject the React import for .jsx and .tsx modules.
-            if (!skipReactImport && !importReactRE.test(code)) {
-              prependReactImport = true
-            }
-          }
-        }
-
-        let inputMap: SourceMap | undefined
-        if (prependReactImport) {
-          if (needHiresSourcemap) {
-            const s = new MagicString(code)
-            s.prepend(prependReactImportCode)
-            code = s.toString()
-            inputMap = s.generateMap({ hires: true, source: id })
-          } else {
-            code = prependReactImportCode + code
-          }
-        }
-
-        // Plugins defined through this Vite plugin are only applied
-        // to modules within the project root, but "babel.config.js"
-        // files can define plugins that need to be applied to every
-        // module, including node_modules and linked packages.
-        const shouldSkip =
-          !plugins.length &&
-          !babelOptions.configFile &&
-          !(isProjectFile && babelOptions.babelrc)
-
-        // Avoid parsing if no plugins exist.
-        if (shouldSkip) {
-          return {
-            code,
-            map: inputMap ?? null
-          }
-        }
-
-        const parserPlugins: typeof babelOptions.parserOpts.plugins = [
-          ...babelOptions.parserOpts.plugins,
-          'importMeta',
-          // This plugin is applied before esbuild transforms the code,
-          // so we need to enable some stage 3 syntax that is supported in
-          // TypeScript and some environments already.
-          'topLevelAwait',
-          'classProperties',
-          'classPrivateProperties',
-          'classPrivateMethods'
-        ]
-
-        if (!extension.endsWith('.ts')) {
-          parserPlugins.push('jsx')
-        }
-
-        if (/\.tsx?$/.test(extension)) {
-          parserPlugins.push('typescript')
-        }
-
-        const transformAsync = ast
-          ? babel.transformFromAstAsync.bind(babel, ast, code)
-          : babel.transformAsync.bind(babel, code)
-
-        const isReasonReact = extension.endsWith('.bs.js')
-        const result = await transformAsync({
-          ...babelOptions,
-          ast: !isReasonReact,
-          root: projectRoot,
-          filename: id,
-          sourceFileName: filepath,
-          parserOpts: {
-            ...babelOptions.parserOpts,
-            sourceType: 'module',
-            allowAwaitOutsideFunction: true,
-            plugins: parserPlugins
-          },
-          generatorOpts: {
-            ...babelOptions.generatorOpts,
-            decoratorsBeforeExport: true
-          },
-          plugins,
-          sourceMaps: true,
-          // Vite handles sourcemap flattening
-          inputSourceMap: inputMap ?? (false as any)
-        })
-
-        if (result) {
-          let code = result.code!
-          if (useFastRefresh && /\$RefreshReg\$\(/.test(code)) {
-            const accept = isReasonReact || isRefreshBoundary(result.ast!)
-            code = addRefreshWrapper(code, id, accept)
-          }
-          return {
-            code,
-            map: result.map
-          }
-        }
-      }
-    }
-  }
-
-  const viteReactRefresh: Plugin = {
-    name: 'vite:react-refresh',
-    enforce: 'pre',
-    config: () => ({
-      resolve: {
-        dedupe: ['react', 'react-dom']
-      }
-    }),
-    resolveId(id) {
-      if (id === runtimePublicPath) {
-        return id
-      }
-    },
-    load(id) {
-      if (id === runtimePublicPath) {
-        return runtimeCode
-      }
-    },
-    transformIndexHtml() {
-      if (!skipFastRefresh)
-        return [
-          {
-            tag: 'script',
-            attrs: { type: 'module' },
-            children: preambleCode.replace(`__BASE__`, devBase)
-          }
-        ]
-    }
-  }
-
-  const reactJsxRuntimeId = 'react/jsx-runtime'
-  const reactJsxDevRuntimeId = 'react/jsx-dev-runtime'
-  const virtualReactJsxRuntimeId = '\0' + reactJsxRuntimeId
-  const virtualReactJsxDevRuntimeId = '\0' + reactJsxDevRuntimeId
-  // Adapted from https://github.com/alloc/vite-react-jsx
-  const viteReactJsx: Plugin = {
-    name: 'vite:react-jsx',
-    enforce: 'pre',
-    config() {
-      return {
-        optimizeDeps: {
-          // We can't add `react-dom` because the dependency is `react-dom/client`
-          // for React 18 while it's `react-dom` for React 17. We'd need to detect
-          // what React version the user has installed.
-          include: [reactJsxRuntimeId, reactJsxDevRuntimeId, 'react']
-        }
-      }
-    },
-    resolveId(id, importer) {
-      // Resolve runtime to a virtual path to be interoped.
-      // Since the interop code re-imports `id`, we need to prevent re-resolving
-      // to the virtual id if the importer is already the virtual id.
-      if (id === reactJsxRuntimeId && importer !== virtualReactJsxRuntimeId) {
-        return virtualReactJsxRuntimeId
-      }
-      if (
-        id === reactJsxDevRuntimeId &&
-        importer !== virtualReactJsxDevRuntimeId
-      ) {
-        return virtualReactJsxDevRuntimeId
-      }
-    },
-    load(id) {
-      // Apply manual interop
-      if (id === virtualReactJsxRuntimeId) {
-        return [
-          `import * as jsxRuntime from ${JSON.stringify(reactJsxRuntimeId)}`,
-          `export const Fragment = jsxRuntime.Fragment`,
-          `export const jsx = jsxRuntime.jsx`,
-          `export const jsxs = jsxRuntime.jsxs`
-        ].join('\n')
-      }
-      if (id === virtualReactJsxDevRuntimeId) {
-        return [
-          `import * as jsxRuntime from ${JSON.stringify(reactJsxDevRuntimeId)}`,
-          `export const Fragment = jsxRuntime.Fragment`,
-          `export const jsxDEV = jsxRuntime.jsxDEV`
-        ].join('\n')
-      }
-    }
-  }
-
-  return [viteBabel, viteReactRefresh, useAutomaticRuntime && viteReactJsx]
-}
-
-viteReact.preambleCode = preambleCode
-
-function loadPlugin(path: string): Promise<any> {
-  return import(path).then((module) => module.default || module)
-}
-
-function createBabelOptions(rawOptions?: BabelOptions) {
-  const babelOptions = {
-    babelrc: false,
-    configFile: false,
-    ...rawOptions
-  } as ReactBabelOptions
-
-  babelOptions.plugins ||= []
-  babelOptions.presets ||= []
-  babelOptions.overrides ||= []
-  babelOptions.parserOpts ||= {} as any
-  babelOptions.parserOpts.plugins ||= []
-
-  return babelOptions
-}

package/src/jsx-runtime/babel-import-to-require.ts

@@ -1,35 +0,0 @@
-import type * as babelCore from '@babel/core'
-
-/**
- * Replace this:
- *
- *     import { jsx as _jsx } from "react/jsx-runtime"
- *
- * with this:
- *
- *     var _jsx = require("react/jsx-runtime").jsx
- */
-export function babelImportToRequire({ types: t }: typeof babelCore): {
-  visitor: babelCore.Visitor
-} {
-  return {
-    visitor: {
-      ImportDeclaration(path) {
-        const decl = path.node
-        const spec = decl.specifiers[0] as babelCore.types.ImportSpecifier
-
-        path.replaceWith(
-          t.variableDeclaration('var', [
-            t.variableDeclarator(
-              spec.local,
-              t.memberExpression(
-                t.callExpression(t.identifier('require'), [decl.source]),
-                spec.imported
-              )
-            )
-          ])
-        )
-      }
-    }
-  }
-}

package/src/jsx-runtime/babel-restore-jsx.spec.ts

@@ -1,132 +0,0 @@
-import * as babel from '@babel/core'
-import { describe, expect, it } from 'vitest'
-import babelRestoreJSX from './babel-restore-jsx'
-
-function jsx(code: string) {
-  return babel.transform(code, {
-    parserOpts: { plugins: ['jsx'] },
-    plugins: [babelRestoreJSX]
-  })?.code
-}
-
-// Tests adapted from: https://github.com/flying-sheep/babel-plugin-transform-react-createelement-to-jsx/blob/63137b6/test/index.js
-describe('babel-restore-jsx', () => {
-  it('should convert 1-argument calls', () => {
-    expect(jsx('React.createElement("h1")')).toMatchInlineSnapshot(`"<h1 />;"`)
-    expect(jsx('React.createElement(Foo)')).toMatchInlineSnapshot(`"<Foo />;"`)
-    expect(jsx('React.createElement(Foo.Bar)')).toMatchInlineSnapshot(
-      `"<Foo.Bar />;"`
-    )
-    expect(jsx('React.createElement(Foo.Bar.Baz)')).toMatchInlineSnapshot(
-      `"<Foo.Bar.Baz />;"`
-    )
-  })
-
-  it('should convert effective 1-argument calls (with null or undefined)', () => {
-    expect(jsx('React.createElement("h1", null)')).toMatchInlineSnapshot(
-      `"<h1 />;"`
-    )
-    expect(jsx('React.createElement("h2", null, null)')).toMatchInlineSnapshot(
-      `"<h2 />;"`
-    )
-    expect(jsx('React.createElement("h3", undefined)')).toMatchInlineSnapshot(
-      `"<h3 />;"`
-    )
-  })
-
-  it('should handle props without children', () => {
-    expect(jsx('React.createElement("h1", {hi: there})')).toMatchInlineSnapshot(
-      `"<h1 hi={there} />;"`
-    )
-    expect(
-      jsx('React.createElement("h2", {"hi": there})')
-    ).toMatchInlineSnapshot(`"<h2 hi={there} />;"`)
-    expect(
-      jsx('React.createElement("h3", {hi: "there"})')
-    ).toMatchInlineSnapshot(`"<h3 hi=\\"there\\" />;"`)
-  })
-
-  it('should handle spread props', () => {
-    expect(jsx('React.createElement("h1", props)')).toMatchInlineSnapshot(
-      `"<h1 {...props} />;"`
-    )
-    expect(jsx('React.createElement("h1", getProps())')).toMatchInlineSnapshot(
-      `"<h1 {...getProps()} />;"`
-    )
-  })
-
-  it('should handle mixed props', () => {
-    expect(
-      jsx('React.createElement("h1", _extends({ hi: "there" }, props))')
-    ).toMatchInlineSnapshot(`"<h1 hi=\\"there\\" {...props} />;"`)
-    expect(
-      jsx('React.createElement("h1", _extends({}, props, { hi: "there" }))')
-    ).toMatchInlineSnapshot(`"<h1 {...props} hi=\\"there\\" />;"`)
-    expect(
-      jsx('React.createElement("h1", { ...props, hi: "there" })')
-    ).toMatchInlineSnapshot(`"<h1 {...props} hi=\\"there\\" />;"`)
-  })
-
-  it('should handle props and ignore “null”/“undefined” children', () => {
-    expect(
-      jsx('React.createElement("h1", {hi: there}, null, undefined)')
-    ).toMatchInlineSnapshot(`"<h1 hi={there} />;"`)
-  })
-
-  it('should ignore “null”/“undefined” props and handle children', () => {
-    expect(
-      jsx('React.createElement("h1", null, "Header")')
-    ).toMatchInlineSnapshot(`"<h1>Header</h1>;"`)
-    //this can be created from e.g. '<h2>Header{"harhar"}</h2>', but i think there’s no downside to merging it
-    expect(
-      jsx('React.createElement("h2", null, "Header", "harhar")')
-    ).toMatchInlineSnapshot(`"<h2>Headerharhar</h2>;"`)
-    expect(
-      jsx('React.createElement("h3", null, React.createElement("i"))')
-    ).toMatchInlineSnapshot(`"<h3><i /></h3>;"`)
-    expect(
-      jsx('React.createElement("h4", null, "a", React.createElement("b"), "c")')
-    ).toMatchInlineSnapshot(`"<h4>a<b />c</h4>;"`)
-  })
-
-  it('should handle props and children', () => {
-    //we extensively tested props and children separately, so only sth. basic
-    expect(
-      jsx('React.createElement("h1", {hi: there}, "Header")')
-    ).toMatchInlineSnapshot(`"<h1 hi={there}>Header</h1>;"`)
-  })
-
-  it('should ignore intermingled “null”/“undefined” children', () => {
-    expect(
-      jsx('React.createElement("h1", null, null, "Header", undefined)')
-    ).toMatchInlineSnapshot(`"<h1>Header</h1>;"`)
-  })
-
-  it('should handle children in nested expressions', () => {
-    expect(
-      jsx(
-        'React.createElement("h1", null, foo ? React.createElement("p") : null)'
-      )
-    ).toMatchInlineSnapshot(`"<h1>{foo ? <p /> : null}</h1>;"`)
-  })
-
-  it('should handle lowercase component names', () => {
-    expect(jsx('React.createElement(aaa)')).toMatchInlineSnapshot(
-      `"React.createElement(aaa);"`
-    )
-  })
-
-  it('should not handle contains __self prop', () => {
-    expect(
-      jsx('React.createElement(Provider, { __self: this })')
-    ).toMatchInlineSnapshot('"<Provider />;"')
-  })
-
-  it('should not handle contains __source prop', () => {
-    expect(
-      jsx(
-        'React.createElement(Provider, { __source: { fileName: _jsxFileName, lineNumber: 133 }})'
-      )
-    ).toMatchInlineSnapshot('"<Provider />;"')
-  })
-})

package/src/jsx-runtime/babel-restore-jsx.ts

@@ -1,232 +0,0 @@
-/**
- * https://github.com/flying-sheep/babel-plugin-transform-react-createelement-to-jsx
- * @license GNU General Public License v3.0
- */
-import type * as babel from '@babel/core'
-
-interface PluginOptions {
-  reactAlias: string
-}
-
-/**
- * Visitor factory for babel, converting React.createElement(...) to <jsx ...>...</jsx>
- *
- * What we want to handle here is this CallExpression:
- *
- *     React.createElement(
- *       type: StringLiteral|Identifier|MemberExpression,
- *       [props: ObjectExpression|Expression],
- *       [...children: StringLiteral|Expression]
- *     )
- *
- * Any of those arguments might also be missing (undefined) and/or invalid.
- */
-export default function (
-  { types: t }: typeof babel,
-  { reactAlias = 'React' }: PluginOptions
-): babel.PluginObj {
-  /**
-   * Get a `JSXElement` from a `CallExpression`.
-   * Returns `null` if this impossible.
-   */
-  function getJSXNode(node: any): any {
-    if (!isReactCreateElement(node)) {
-      return null
-    }
-
-    //nameNode and propsNode may be undefined, getJSX* need to handle that
-    const [nameNode, propsNode, ...childNodes] = node.arguments
-
-    const name = getJSXName(nameNode)
-    if (name == null) {
-      return null //name is required
-    }
-
-    const props = getJSXProps(propsNode)
-    if (props == null) {
-      return null //no props → [], invalid → null
-    }
-
-    const children = getJSXChildren(childNodes)
-    if (children == null) {
-      return null //no children → [], invalid → null
-    }
-
-    if (
-      t.isJSXMemberExpression(name) &&
-      t.isJSXIdentifier(name.object) &&
-      name.object.name === reactAlias &&
-      name.property.name === 'Fragment'
-    ) {
-      return t.jsxFragment(
-        t.jsxOpeningFragment(),
-        t.jsxClosingFragment(),
-        children
-      )
-    }
-
-    // self-closing tag if no children
-    const selfClosing = children.length === 0
-    const startTag = t.jsxOpeningElement(name, props, selfClosing)
-    startTag.loc = node.loc
-    const endTag = selfClosing ? null : t.jsxClosingElement(name)
-
-    return t.jsxElement(startTag, endTag, children, selfClosing)
-  }
-
-  /**
-   * Get a JSXIdentifier or JSXMemberExpression from a Node of known type.
-   * Returns null if an unknown node type, null or undefined is passed.
-   */
-  function getJSXName(node: any): any {
-    if (node == null) {
-      return null
-    }
-
-    const name = getJSXIdentifier(node, true)
-    if (name != null) {
-      return name
-    }
-
-    if (!t.isMemberExpression(node)) {
-      return null
-    }
-    const object = getJSXName(node.object)
-    const property = getJSXName(node.property)
-    if (object == null || property == null) {
-      return null
-    }
-    return t.jsxMemberExpression(object, property)
-  }
-
-  /**
-   * Get an array of JSX(Spread)Attribute from a props ObjectExpression.
-   * Handles the _extends Expression babel creates from SpreadElement nodes.
-   * Returns null if a validation error occurs.
-   */
-  function getJSXProps(node: any): any[] | null {
-    if (node == null || isNullLikeNode(node)) {
-      return []
-    }
-
-    if (
-      t.isCallExpression(node) &&
-      t.isIdentifier(node.callee, { name: '_extends' })
-    ) {
-      const props: any[] = node.arguments.map(getJSXProps)
-      //if calling this recursively works, flatten.
-      if (props.every((prop) => prop != null)) {
-        return [].concat(...props)
-      }
-    }
-
-    if (!t.isObjectExpression(node) && t.isExpression(node))
-      return [t.jsxSpreadAttribute(node)]
-
-    if (!isPlainObjectExpression(node)) {
-      return null
-    }
-    return node.properties
-      .map((prop: any) =>
-        t.isObjectProperty(prop)
-          ? t.jsxAttribute(
-              getJSXIdentifier(prop.key)!,
-              getJSXAttributeValue(prop.value)
-            )
-          : t.jsxSpreadAttribute(prop.argument)
-      )
-      .filter((prop: any) =>
-        t.isJSXIdentifier(prop.name)
-          ? prop.name.name !== '__self' && prop.name.name !== '__source'
-          : true
-      )
-  }
-
-  function getJSXChild(node: any) {
-    if (t.isStringLiteral(node)) {
-      return t.jsxText(node.value)
-    }
-    if (isReactCreateElement(node)) {
-      return getJSXNode(node)
-    }
-    if (t.isExpression(node)) {
-      return t.jsxExpressionContainer(node)
-    }
-    return null
-  }
-
-  function getJSXChildren(nodes: any[]) {
-    const children = nodes
-      .filter((node) => !isNullLikeNode(node))
-      .map(getJSXChild)
-    if (children.some((child) => child == null)) {
-      return null
-    }
-    return children
-  }
-
-  function getJSXIdentifier(node: any, tag = false) {
-    //TODO: JSXNamespacedName
-    if (t.isIdentifier(node) && (!tag || node.name.match(/^[A-Z]/))) {
-      return t.jsxIdentifier(node.name)
-    }
-    if (t.isStringLiteral(node)) {
-      return t.jsxIdentifier(node.value)
-    }
-    return null
-  }
-
-  function getJSXAttributeValue(node: any) {
-    if (t.isStringLiteral(node)) {
-      return node
-    }
-    if (t.isJSXElement(node)) {
-      return node
-    }
-    if (t.isExpression(node)) {
-      return t.jsxExpressionContainer(node)
-    }
-    return null
-  }
-
-  /**
-   * Tests if a node is a CallExpression with callee `React.createElement`
-   */
-  const isReactCreateElement = (node: any) =>
-    t.isCallExpression(node) &&
-    t.isMemberExpression(node.callee) &&
-    t.isIdentifier(node.callee.object, { name: reactAlias }) &&
-    t.isIdentifier(node.callee.property, { name: 'createElement' }) &&
-    !node.callee.computed
-
-  /**
-   * Tests if a node is `null` or `undefined`
-   */
-  const isNullLikeNode = (node: any) =>
-    t.isNullLiteral(node) || t.isIdentifier(node, { name: 'undefined' })
-
-  /**
-   * Tests if a node is an object expression with noncomputed, nonmethod attrs
-   */
-  const isPlainObjectExpression = (node: any) =>
-    t.isObjectExpression(node) &&
-    node.properties.every(
-      (property) =>
-        t.isSpreadElement(property) ||
-        (t.isObjectProperty(property, { computed: false }) &&
-          getJSXIdentifier(property.key) != null &&
-          getJSXAttributeValue(property.value) != null)
-    )
-
-  return {
-    visitor: {
-      CallExpression(path) {
-        const node = getJSXNode(path.node)
-        if (node == null) {
-          return null
-        }
-        path.replaceWith(node)
-      }
-    }
-  }
-}

package/src/jsx-runtime/restore-jsx.spec.ts

@@ -1,147 +0,0 @@
-import * as babel from '@babel/core'
-import { describe, expect, it } from 'vitest'
-import { parseReactAlias, restoreJSX } from './restore-jsx'
-
-describe('parseReactAlias', () => {
-  it('handles cjs require', () => {
-    expect(parseReactAlias(`const React = require("react")`))
-      .toMatchInlineSnapshot(`
-        [
-          "React",
-          true,
-        ]
-      `)
-  })
-
-  it('handles cjs require (minified)', () => {
-    expect(parseReactAlias(`var F=require('foo');var R=require('react')`))
-      .toMatchInlineSnapshot(`
-        [
-          "R",
-          true,
-        ]
-      `)
-  })
-
-  it('does not handle destructured cjs require', () => {
-    expect(parseReactAlias(`var {createElement} = require("react")`))
-      .toMatchInlineSnapshot(`
-        [
-          undefined,
-          false,
-        ]
-      `)
-  })
-
-  it('handles esm import', () => {
-    expect(parseReactAlias(`import React from 'react'`)).toMatchInlineSnapshot(`
-      [
-        "React",
-        false,
-      ]
-    `)
-  })
-
-  it('handles esm import namespace', () => {
-    expect(parseReactAlias(`import * as React from "react"`))
-      .toMatchInlineSnapshot(`
-        [
-          "React",
-          false,
-        ]
-      `)
-  })
-
-  it('does not handle destructured esm import', () => {
-    expect(parseReactAlias(`import {createElement} from "react"`))
-      .toMatchInlineSnapshot(`
-        [
-          undefined,
-          false,
-        ]
-      `)
-  })
-})
-
-async function jsx(sourceCode: string) {
-  const [ast] = await restoreJSX(babel, sourceCode, 'test.js')
-  if (ast == null) {
-    return ast
-  }
-  const { code } = await babel.transformFromAstAsync(ast, null, {
-    configFile: false
-  })
-  return code
-}
-// jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-// React__default.createElement(Foo)`)
-// Tests adapted from: https://github.com/flying-sheep/babel-plugin-transform-react-createelement-to-jsx/blob/63137b6/test/index.js
-describe('restore-jsx', () => {
-  it('should trans to ', async () => {
-    expect(
-      await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-      React__default.createElement(foo)`)
-    ).toMatchInlineSnapshot(`
-      "import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-      React__default.createElement(foo);"
-    `)
-    expect(
-      await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-      React__default.createElement("h1")`)
-    ).toMatch(`<h1 />;`)
-    expect(
-      await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-      React__default.createElement(Foo)`)
-    ).toMatch(`<Foo />;`)
-    expect(
-      await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-      React__default.createElement(Foo.Bar)`)
-    ).toMatch(`<Foo.Bar />;`)
-    expect(
-      await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-    React__default.createElement(Foo.Bar.Baz)`)
-    ).toMatch(`<Foo.Bar.Baz />;`)
-  })
-
-  it('should handle props', async () => {
-    expect(
-      await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-      React__default.createElement(foo, {hi: there})`)
-    ).toMatchInlineSnapshot(`
-      "import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-      React__default.createElement(foo, {
-        hi: there
-      });"
-    `)
-    expect(
-      await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-    React__default.createElement("h1", {hi: there})`)
-    ).toMatch(`<h1 hi={there} />;`)
-    expect(
-      await jsx(`import React__default, { PureComponent, Component, forwardRef, memo, createElement } from 'react';
-      React__default.createElement(Foo, {hi: there})`)
-    ).toMatch(`<Foo hi={there} />;`)
-  })
-
-  it('should handle Fragment', async () => {
-    expect(
-      await jsx(`import R, { Fragment } from 'react';
-        R.createElement(Fragment)
-      `)
-    ).toMatchInlineSnapshot(`
-      "import R, { Fragment } from 'react';
-      <Fragment />;"
-    `)
-  })
-
-  it('should handle Fragment alias', async () => {
-    expect(
-      await jsx(`import RA, { Fragment as F } from 'react';
-        RA.createElement(F, null, RA.createElement(RA.Fragment))
-      `)
-    ).toMatchInlineSnapshot(`
-      "import RA, { Fragment as F } from 'react';
-      <F><></></F>;"
-    `)
-  })
-})

package/src/jsx-runtime/restore-jsx.ts

@@ -1,74 +0,0 @@
-import type * as babelCore from '@babel/core'
-
-type RestoredJSX = [
-  result: babelCore.types.File | null | undefined,
-  isCommonJS: boolean
-]
-
-let babelRestoreJSX: Promise<babelCore.PluginItem> | undefined
-
-const jsxNotFound: RestoredJSX = [null, false]
-
-async function getBabelRestoreJSX() {
-  if (!babelRestoreJSX)
-    babelRestoreJSX = import('./babel-restore-jsx').then((r) => {
-      const fn = r.default
-      if ('default' in fn)
-        // @ts-expect-error
-        return fn.default
-      return fn
-    })
-  return babelRestoreJSX
-}
-
-/** Restore JSX from `React.createElement` calls */
-export async function restoreJSX(
-  babel: typeof babelCore,
-  code: string,
-  filename: string
-): Promise<RestoredJSX> {
-  const [reactAlias, isCommonJS] = parseReactAlias(code)
-
-  if (!reactAlias) {
-    return jsxNotFound
-  }
-
-  const reactJsxRE = new RegExp(
-    `\\b${reactAlias}\\.(createElement|Fragment)\\b`,
-    'g'
-  )
-
-  if (!reactJsxRE.test(code)) {
-    return jsxNotFound
-  }
-
-  const result = await babel.transformAsync(code, {
-    babelrc: false,
-    configFile: false,
-    ast: true,
-    code: false,
-    filename,
-    parserOpts: {
-      plugins: ['jsx']
-    },
-    plugins: [[await getBabelRestoreJSX(), { reactAlias }]]
-  })
-
-  return [result?.ast, isCommonJS]
-}
-
-export function parseReactAlias(
-  code: string
-): [alias: string | undefined, isCommonJS: boolean] {
-  let match = code.match(
-    /\b(var|let|const)\s+([^=\{\s]+)\s*=\s*require\(["']react["']\)/
-  )
-  if (match) {
-    return [match[2], true]
-  }
-  match = code.match(/^import\s+(?:\*\s+as\s+)?(\w+).+?\bfrom\s*["']react["']/m)
-  if (match) {
-    return [match[1], false]
-  }
-  return [undefined, false]
-}