@vitejs/plugin-react 2.1.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 () => {
@@ -76,21 +70,56 @@ if (import.meta.hot) {
   };
   window.$RefreshSig$ = RefreshRuntime.createSignatureFunctionForTransform;
 }`.replace(/[\n]+/gm, "");
-const footer = `
-if (import.meta.hot) {
-  window.$RefreshReg$ = prevRefreshReg;
-  window.$RefreshSig$ = prevRefreshSig;
-
-  __ACCEPT__
+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();
+  }
+});
+`;
 function addRefreshWrapper(code, id, accept) {
-  return header.replace("__SOURCE__", JSON.stringify(id)) + code + footer.replace("__ACCEPT__", accept ? "import.meta.hot.accept();" : "");
+  return header.replace("__SOURCE__", JSON.stringify(id)) + code + footer.replace("__ACCEPT__", accept ? checkAndAccept : timeout);
 }
 function isRefreshBoundary(ast) {
   return ast.program.body.every((node) => {
@@ -227,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
       });
@@ -305,7 +334,8 @@ function viteReact(opts = {}) {
                 {
                   runtime: "automatic",
                   importSource: opts.jsxImportSource,
-                  pure: opts.jsxPure !== false
+                  pure: opts.jsxPure !== false,
+                  throwIfNamespace: opts.jsxThrowIfNamespace
                 }
               ]);
               if (isCommonJS) {
@@ -327,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 });
@@ -483,4 +513,4 @@ function createBabelOptions(rawOptions) {
 }
 
 module.exports = viteReact;
-module.exports["default"] = viteReact;
+module.exports.default = viteReact;

package/dist/index.d.ts

@@ -26,6 +26,11 @@ interface Options {
      * @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.
      */

package/dist/index.mjs

@@ -55,21 +55,56 @@ if (import.meta.hot) {
   };
   window.$RefreshSig$ = RefreshRuntime.createSignatureFunctionForTransform;
 }`.replace(/[\n]+/gm, "");
-const footer = `
-if (import.meta.hot) {
-  window.$RefreshReg$ = prevRefreshReg;
-  window.$RefreshSig$ = prevRefreshSig;
-
-  __ACCEPT__
+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();
+  }
+});
+`;
 function addRefreshWrapper(code, id, accept) {
-  return header.replace("__SOURCE__", JSON.stringify(id)) + code + footer.replace("__ACCEPT__", accept ? "import.meta.hot.accept();" : "");
+  return header.replace("__SOURCE__", JSON.stringify(id)) + code + footer.replace("__ACCEPT__", accept ? checkAndAccept : timeout);
 }
 function isRefreshBoundary(ast) {
   return ast.program.body.every((node) => {
@@ -284,7 +319,8 @@ function viteReact(opts = {}) {
                 {
                   runtime: "automatic",
                   importSource: opts.jsxImportSource,
-                  pure: opts.jsxPure !== false
+                  pure: opts.jsxPure !== false,
+                  throwIfNamespace: opts.jsxThrowIfNamespace
                 }
               ]);
               if (isCommonJS) {

package/package.json

@@ -1,14 +1,13 @@
 {
   "name": "@vitejs/plugin-react",
-  "version": "2.1.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.18.13",
-    "@babel/plugin-transform-react-jsx": "^7.18.10",
+    "@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.2",
+    "@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,117 +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 footer = `
-if (import.meta.hot) {
-  window.$RefreshReg$ = prevRefreshReg;
-  window.$RefreshSig$ = prevRefreshSig;
-
-  __ACCEPT__
-  if (!window.__vite_plugin_react_timeout) {
-    window.__vite_plugin_react_timeout = setTimeout(() => {
-      window.__vite_plugin_react_timeout = 0;
-      RefreshRuntime.performReactRefresh();
-    }, 30);
-  }
-}`
-
-export function addRefreshWrapper(
-  code: string,
-  id: string,
-  accept: boolean
-): string {
-  return (
-    header.replace('__SOURCE__', JSON.stringify(id)) +
-    code +
-    footer.replace('__ACCEPT__', accept ? 'import.meta.hot.accept();' : '')
-  )
-}
-
-export function isRefreshBoundary(ast: t.File): boolean {
-  // Every export must be a React component.
-  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'
-}