@shopify/hydrogen 0.25.1 → 0.27.0

package/package.json

@@ -7,7 +7,7 @@
   "engines": {
     "node": ">=14"
   },
-  "version": "0.25.1",
+  "version": "0.27.0",
   "description": "Modern custom Shopify storefronts",
   "license": "MIT",
   "main": "dist/esnext/index.js",
@@ -22,11 +22,19 @@
       "import": "./dist/esnext/framework/middleware.js",
       "require": "./dist/node/framework/middleware.js"
     },
+    "./load-config": {
+      "import": "./dist/esnext/framework/load-config.js",
+      "require": "./dist/node/framework/load-config.js"
+    },
     "./web-polyfills": {
       "import": "./dist/esnext/utilities/web-api-polyfill",
       "require": "./dist/node/utilities/web-api-polyfill"
     },
     "./vendor/*": "./vendor/*",
+    "./cache/*": {
+      "import": "./dist/esnext/framework/cache/*.js",
+      "require": "./dist/node/framework/cache/*.js"
+    },
     "./package.json": "./package.json",
     "./*": "./dist/esnext/*.js"
   },
@@ -111,6 +119,7 @@
     "@vitejs/plugin-react": "^1.3.0",
     "abort-controller": "^3.0.0",
     "body-parser": "^1.20.0",
+    "compression": "^1.7.4",
     "connect": "^3.7.0",
     "es-module-lexer": "^0.10.0",
     "fast-glob": "^3.2.11",
@@ -123,11 +132,12 @@
     "path-to-regexp": "^6.2.0",
     "react-error-boundary": "^3.1.3",
     "react-helmet-async": "^1.2.3",
+    "serve-static": "^1.15.0",
     "set-cookie-parser": "^2.5.0",
+    "undici": "^5.5.1",
     "uuid": "^8.3.2",
     "vite-plugin-inspect": "^0.3.6",
     "web-streams-polyfill": "^3.2.0",
-    "worktop": "^0.7.3",
-    "undici": "^5.5.1"
+    "worktop": "^0.7.3"
   }
 }

package/vendor/react-server-dom-vite/cjs/react-server-dom-vite-plugin.js

@@ -104,6 +104,8 @@ var isClientComponent = function (id) {
 function ReactFlightVitePlugin() {
   var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
       serverBuildEntries = _ref.serverBuildEntries,
+      _ref$optimizeBoundari = _ref.optimizeBoundaries,
+      optimizeBoundaries = _ref$optimizeBoundari === void 0 ? 'build' : _ref$optimizeBoundari,
       _ref$isServerComponen = _ref.isServerComponentImporterAllowed,
       isServerComponentImporterAllowed = _ref$isServerComponen === void 0 ? function (importer) {
     return false;
@@ -111,13 +113,28 @@ function ReactFlightVitePlugin() {
 
   var config;
   var server;
-  var globImporterPath;
   var resolveAlias;
+  var globImporterPath;
+  var allClientBoundaries = new Set();
+
+  function invalidateGlobImporter() {
+    if (globImporterPath && server) {
+      server.watcher.emit('change', globImporterPath);
+    }
+  }
+
   return {
     name: 'vite-plugin-react-server-components',
     enforce: 'pre',
     configureServer: function (_server) {
       server = _server;
+      var seenModules = {};
+      server.ws.on('rsc:cc404', function (data) {
+        if (!seenModules[data.id]) {
+          seenModules[data.id] = true;
+          invalidateGlobImporter();
+        }
+      });
     },
     configResolved: async function (_config) {
       await esModuleLexer.init;
@@ -194,13 +211,10 @@ function ReactFlightVitePlugin() {
         if (!moduleNode.meta) moduleNode.meta = {};
 
         if (!moduleNode.meta.isClientComponent) {
-          moduleNode.meta.isClientComponent = true;
+          moduleNode.meta.isClientComponent = true; // Invalidate glob importer file to account for the
+          // newly discovered client component.
 
-          if (globImporterPath) {
-            // Invalidate glob importer file to account for the
-            // newly discovered client component.
-            server.watcher.emit('change', globImporterPath);
-          }
+          invalidateGlobImporter();
         }
       }
 
@@ -250,7 +264,7 @@ function ReactFlightVitePlugin() {
           });
           var injectedGlobs = "Object.assign(Object.create(null), " + importers.map(function (glob) {
             return (// Mark the globs to modify the result after Vite resolves them.
-              "/* HASH_BEGIN */ " + ("import.meta.glob('" + vite.normalizePath(glob) + "') /* HASH_END */")
+              "\n/* HASH_BEGIN */ " + ("import.meta.glob('" + vite.normalizePath(glob) + "') /* HASH_END */")
             );
           }).join(', ') + ");";
           s.replace(INJECTING_RE, injectedGlobs);
@@ -264,15 +278,24 @@ function ReactFlightVitePlugin() {
         };
 
         if (config.command === 'serve') {
-          globImporterPath = id;
-          return injectGlobs(findClientBoundaries(server.moduleGraph));
+          globImporterPath = id; // When mixing client and server components from the same
+          // facade file, the module graph can break and miss certain
+          // import connections (bug in Vite?) due to HMR. Instead of
+          // creating a new list of discovered components from scratch,
+          // reuse the already discovered ones and simply add new ones
+          // to the list without removing anything.
+
+          findClientBoundaries(server.moduleGraph, optimizeBoundaries === true).forEach(function (boundary) {
+            return allClientBoundaries.add(boundary);
+          });
+          return injectGlobs(Array.from(allClientBoundaries));
         }
 
         if (!serverBuildEntries) {
           throw new Error('[react-server-dom-vite] Parameter serverBuildEntries is required for client build');
         }
 
-        return findClientBoundariesForClientBuild(serverBuildEntries).then(injectGlobs);
+        return findClientBoundariesForClientBuild(serverBuildEntries, optimizeBoundaries !== false).then(injectGlobs);
       }
     }
   };
@@ -336,6 +359,7 @@ async function proxyClientComponent(filepath, src) {
 }
 
 function findClientBoundaries(moduleGraph) {
+  var optimizeBoundaries = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   var clientBoundaries = []; // eslint-disable-next-line no-for-of-loops/no-for-of-loops
 
   var _iterator = _createForOfIteratorHelper(moduleGraph.fileToModulesMap.values()),
@@ -348,7 +372,7 @@ function findClientBoundaries(moduleGraph) {
         return moduleNode.meta && moduleNode.meta.isClientComponent;
       });
 
-      if (clientModule && isDirectImportInServer(clientModule)) {
+      if (clientModule && (!optimizeBoundaries || isDirectImportInServer(clientModule))) {
         clientBoundaries.push(clientModule.file);
       }
     }
@@ -361,7 +385,7 @@ function findClientBoundaries(moduleGraph) {
   return clientBoundaries;
 }
 
-async function findClientBoundariesForClientBuild(serverEntries) {
+async function findClientBoundariesForClientBuild(serverEntries, optimizeBoundaries) {
   // Viteception
   var server = await vite.createServer({
     clearScreen: false,
@@ -379,7 +403,7 @@ async function findClientBoundariesForClientBuild(serverEntries) {
   }
 
   await server.close();
-  return findClientBoundaries(server.moduleGraph);
+  return findClientBoundaries(server.moduleGraph, optimizeBoundaries);
 }
 
 var hashImportsPlugin = {
@@ -457,7 +481,7 @@ function isDirectImportInServer(originalMod, currentMod, accModInfo) {
       });
     }
 
-    return Array.from((currentMod || originalMod).importers).some(function (importer) {
+    return Array.from((currentMod || originalMod).importers || []).some(function (importer) {
       return (// eslint-disable-next-line no-unused-vars
         isDirectImportInServer(originalMod, importer, accModInfo)
       );
@@ -477,7 +501,7 @@ function isDirectImportInServer(originalMod, currentMod, accModInfo) {
   // the original module before marking it as client boundary.
 
   return currentMod.meta.imports.some(function (imp) {
-    return imp.action === 'import' && imp.from === accModInfo.file && (imp.variables || []).some(function (_ref3) {
+    return imp.from === accModInfo.file && (imp.variables || []).some(function (_ref3) {
       var name = _ref3[0];
       return accModInfo.exports.includes(name);
     });
@@ -531,10 +555,15 @@ function augmentModuleGraph(moduleGraph, id, code, root, resolveAlias) {
       var resolvedAliasPath = resolveAlias(modPath, 'rsc_importer', {});
 
       if (resolvedAliasPath && resolvedAliasPath.id) {
-        modPath = vite.normalizePath(path.join(root, resolvedAliasPath.id));
+        modPath = resolvedAliasPath.id;
       }
     }
 
+    if (modPath && modPath.startsWith('/src/')) {
+      // Vite default alias
+      modPath = vite.normalizePath(path.join(root, modPath));
+    }
+
     var resolvedPath = resolveModPath(modPath, dirname);
     if (!resolvedPath) return; // Virtual modules or other exceptions
 

package/vendor/react-server-dom-vite/cjs/react-server-dom-vite.development.js

@@ -33,7 +33,9 @@ function parseModel(response, json) {
   return JSON.parse(json, response._fromJSON);
 }
 
-// eslint-disable-next-line no-unused-vars
+var META_HOT = undefined;
+var META_ENV_DEV = undefined.DEV;
+
 function resolveModuleReference(bundlerConfig, moduleData) {
   return moduleData;
 } // Vite import globs will be injected here.
@@ -42,7 +44,7 @@ var allClientComponents = {
   __INJECTED_CLIENT_IMPORTERS__: null
 }; // Mock client component imports during testing
 
-if (typeof jest !== 'undefined') {
+if (META_ENV_DEV && typeof jest !== 'undefined') {
   global.allClientComponents = allClientComponents;
 }
 
@@ -50,7 +52,20 @@ function importClientComponent(moduleId) {
   var modImport = allClientComponents[moduleId];
 
   if (!modImport) {
-    return Promise.reject(new Error("Could not find client component " + moduleId));
+    var error = new Error("Could not find client component " + moduleId);
+
+    if (META_HOT) {
+      META_HOT.send('rsc:cc404', {
+        id: moduleId
+      });
+      return new Promise(function (_, reject) {
+        return setTimeout(function () {
+          return reject(error);
+        }, 200);
+      });
+    }
+
+    return Promise.reject(error);
   }
 
   return typeof modImport === 'function' ? modImport() : Promise.resolve(modImport);

package/vendor/react-server-dom-vite/cjs/react-server-dom-vite.production.min.js

@@ -7,8 +7,8 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-'use strict';var g=require("react"),h={stream:!0},l={__INJECTED_CLIENT_IMPORTERS__:null};"undefined"!==typeof jest&&(global.allClientComponents=l);function m(a){var b=l[a];return b?"function"===typeof b?b():Promise.resolve(b):Promise.reject(Error("Could not find client component "+a))}var n=new Map;function p(a){function b(a){n.set(c,a);return a}var c=a.id;n.has(c)||(a=m(c),b(a),a.then(b,b))}var q=Symbol.for("react.element"),r=Symbol.for("react.lazy"),t=Symbol.for("react.default_value"),v=g.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ContextRegistry;
-function w(a){v[a]||(v[a]=g.createServerContext(a,t));return v[a]}function x(a,b,c){this._status=a;this._value=b;this._response=c}x.prototype.then=function(a){0===this._status?(null===this._value&&(this._value=[]),this._value.push(a)):a()};
+'use strict';var g=require("react"),h={stream:!0},l={__INJECTED_CLIENT_IMPORTERS__:null};(void 0).DEV&&"undefined"!==typeof jest&&(global.allClientComponents=l);function m(a){var b=l[a];return b?"function"===typeof b?b():Promise.resolve(b):Promise.reject(Error("Could not find client component "+a))}var n=new Map;function p(a){function b(a){n.set(c,a);return a}var c=a.id;n.has(c)||(a=m(c),b(a),a.then(b,b))}
+var q=Symbol.for("react.element"),r=Symbol.for("react.lazy"),t=Symbol.for("react.default_value"),v=g.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ContextRegistry;function w(a){v[a]||(v[a]=g.createServerContext(a,t));return v[a]}function x(a,b,c){this._status=a;this._value=b;this._response=c}x.prototype.then=function(a){0===this._status?(null===this._value&&(this._value=[]),this._value.push(a)):a()};
 function y(a){switch(a._status){case 3:return a._value;case 1:var b=JSON.parse(a._value,a._response._fromJSON);a._status=3;return a._value=b;case 2:var c=a._value;b=c.name;c=n.get(c.id);if(!c||c instanceof Promise||c instanceof Error)throw c;b=c[b];a._status=3;return a._value=b;case 0:throw a;default:throw a._value;}}function z(){var a=A(this,0);return y(a)}function B(a,b){return new x(3,b,a)}function C(a){if(null!==a)for(var b=0;b<a.length;b++)(0,a[b])()}
 function D(a,b){if(0===a._status){var c=a._value;a._status=4;a._value=b;C(c)}}function E(a,b){a._chunks.forEach(function(a){D(a,b)})}function A(a,b){var c=a._chunks,d=c.get(b);d||(d=new x(0,null,a),c.set(b,d));return d}function F(a,b,c){switch(c[0]){case "$":if("$"===c)return q;if("$"===c[1]||"@"===c[1])return c.substring(1);b=parseInt(c.substring(1),16);a=A(a,b);return y(a);case "@":return b=parseInt(c.substring(1),16),a=A(a,b),{$$typeof:r,_payload:a,_init:y}}return c}
 function G(a){E(a,Error("Connection closed."))}

package/vendor/react-server-dom-vite/esm/react-server-dom-vite-client-proxy.js

@@ -20,7 +20,8 @@ var MODULE_TAG = Symbol.for('react.module.reference');
 var STRING_SIZE_LIMIT = 64;
 var FN_RSC_ERROR = 'Functions exported from client components cannot be called or used as constructors from a server component.';
 function isRsc() {
-  return !!__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentDispatcher.current.isRsc;
+  var currentDispatcher = __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentDispatcher.current;
+  return !!(currentDispatcher && currentDispatcher.isRsc);
 }
 
 function createModuleReference(id, value, name, isDefault) {

package/vendor/react-server-dom-vite/esm/react-server-dom-vite-plugin.js

@@ -100,6 +100,8 @@ var isClientComponent = function (id) {
 function ReactFlightVitePlugin() {
   var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
       serverBuildEntries = _ref.serverBuildEntries,
+      _ref$optimizeBoundari = _ref.optimizeBoundaries,
+      optimizeBoundaries = _ref$optimizeBoundari === void 0 ? 'build' : _ref$optimizeBoundari,
       _ref$isServerComponen = _ref.isServerComponentImporterAllowed,
       isServerComponentImporterAllowed = _ref$isServerComponen === void 0 ? function (importer) {
     return false;
@@ -107,13 +109,28 @@ function ReactFlightVitePlugin() {
 
   var config;
   var server;
-  var globImporterPath;
   var resolveAlias;
+  var globImporterPath;
+  var allClientBoundaries = new Set();
+
+  function invalidateGlobImporter() {
+    if (globImporterPath && server) {
+      server.watcher.emit('change', globImporterPath);
+    }
+  }
+
   return {
     name: 'vite-plugin-react-server-components',
     enforce: 'pre',
     configureServer: function (_server) {
       server = _server;
+      var seenModules = {};
+      server.ws.on('rsc:cc404', function (data) {
+        if (!seenModules[data.id]) {
+          seenModules[data.id] = true;
+          invalidateGlobImporter();
+        }
+      });
     },
     configResolved: async function (_config) {
       await init;
@@ -190,13 +207,10 @@ function ReactFlightVitePlugin() {
         if (!moduleNode.meta) moduleNode.meta = {};
 
         if (!moduleNode.meta.isClientComponent) {
-          moduleNode.meta.isClientComponent = true;
+          moduleNode.meta.isClientComponent = true; // Invalidate glob importer file to account for the
+          // newly discovered client component.
 
-          if (globImporterPath) {
-            // Invalidate glob importer file to account for the
-            // newly discovered client component.
-            server.watcher.emit('change', globImporterPath);
-          }
+          invalidateGlobImporter();
         }
       }
 
@@ -246,7 +260,7 @@ function ReactFlightVitePlugin() {
           });
           var injectedGlobs = "Object.assign(Object.create(null), " + importers.map(function (glob) {
             return (// Mark the globs to modify the result after Vite resolves them.
-              "/* HASH_BEGIN */ " + ("import.meta.glob('" + normalizePath(glob) + "') /* HASH_END */")
+              "\n/* HASH_BEGIN */ " + ("import.meta.glob('" + normalizePath(glob) + "') /* HASH_END */")
             );
           }).join(', ') + ");";
           s.replace(INJECTING_RE, injectedGlobs);
@@ -260,15 +274,24 @@ function ReactFlightVitePlugin() {
         };
 
         if (config.command === 'serve') {
-          globImporterPath = id;
-          return injectGlobs(findClientBoundaries(server.moduleGraph));
+          globImporterPath = id; // When mixing client and server components from the same
+          // facade file, the module graph can break and miss certain
+          // import connections (bug in Vite?) due to HMR. Instead of
+          // creating a new list of discovered components from scratch,
+          // reuse the already discovered ones and simply add new ones
+          // to the list without removing anything.
+
+          findClientBoundaries(server.moduleGraph, optimizeBoundaries === true).forEach(function (boundary) {
+            return allClientBoundaries.add(boundary);
+          });
+          return injectGlobs(Array.from(allClientBoundaries));
         }
 
         if (!serverBuildEntries) {
           throw new Error('[react-server-dom-vite] Parameter serverBuildEntries is required for client build');
         }
 
-        return findClientBoundariesForClientBuild(serverBuildEntries).then(injectGlobs);
+        return findClientBoundariesForClientBuild(serverBuildEntries, optimizeBoundaries !== false).then(injectGlobs);
       }
     }
   };
@@ -332,6 +355,7 @@ async function proxyClientComponent(filepath, src) {
 }
 
 function findClientBoundaries(moduleGraph) {
+  var optimizeBoundaries = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   var clientBoundaries = []; // eslint-disable-next-line no-for-of-loops/no-for-of-loops
 
   var _iterator = _createForOfIteratorHelper(moduleGraph.fileToModulesMap.values()),
@@ -344,7 +368,7 @@ function findClientBoundaries(moduleGraph) {
         return moduleNode.meta && moduleNode.meta.isClientComponent;
       });
 
-      if (clientModule && isDirectImportInServer(clientModule)) {
+      if (clientModule && (!optimizeBoundaries || isDirectImportInServer(clientModule))) {
         clientBoundaries.push(clientModule.file);
       }
     }
@@ -357,7 +381,7 @@ function findClientBoundaries(moduleGraph) {
   return clientBoundaries;
 }
 
-async function findClientBoundariesForClientBuild(serverEntries) {
+async function findClientBoundariesForClientBuild(serverEntries, optimizeBoundaries) {
   // Viteception
   var server = await createServer({
     clearScreen: false,
@@ -375,7 +399,7 @@ async function findClientBoundariesForClientBuild(serverEntries) {
   }
 
   await server.close();
-  return findClientBoundaries(server.moduleGraph);
+  return findClientBoundaries(server.moduleGraph, optimizeBoundaries);
 }
 
 var hashImportsPlugin = {
@@ -453,7 +477,7 @@ function isDirectImportInServer(originalMod, currentMod, accModInfo) {
       });
     }
 
-    return Array.from((currentMod || originalMod).importers).some(function (importer) {
+    return Array.from((currentMod || originalMod).importers || []).some(function (importer) {
       return (// eslint-disable-next-line no-unused-vars
         isDirectImportInServer(originalMod, importer, accModInfo)
       );
@@ -473,7 +497,7 @@ function isDirectImportInServer(originalMod, currentMod, accModInfo) {
   // the original module before marking it as client boundary.
 
   return currentMod.meta.imports.some(function (imp) {
-    return imp.action === 'import' && imp.from === accModInfo.file && (imp.variables || []).some(function (_ref3) {
+    return imp.from === accModInfo.file && (imp.variables || []).some(function (_ref3) {
       var name = _ref3[0];
       return accModInfo.exports.includes(name);
     });
@@ -527,10 +551,15 @@ function augmentModuleGraph(moduleGraph, id, code, root, resolveAlias) {
       var resolvedAliasPath = resolveAlias(modPath, 'rsc_importer', {});
 
       if (resolvedAliasPath && resolvedAliasPath.id) {
-        modPath = normalizePath(path.join(root, resolvedAliasPath.id));
+        modPath = resolvedAliasPath.id;
       }
     }
 
+    if (modPath && modPath.startsWith('/src/')) {
+      // Vite default alias
+      modPath = normalizePath(path.join(root, modPath));
+    }
+
     var resolvedPath = resolveModPath(modPath, dirname);
     if (!resolvedPath) return; // Virtual modules or other exceptions
 

package/vendor/react-server-dom-vite/esm/react-server-dom-vite.js

@@ -27,7 +27,9 @@ function parseModel(response, json) {
   return JSON.parse(json, response._fromJSON);
 }
 
-// eslint-disable-next-line no-unused-vars
+var META_HOT = import.meta.hot;
+var META_ENV_DEV = import.meta.env.DEV;
+
 function resolveModuleReference(bundlerConfig, moduleData) {
   return moduleData;
 } // Vite import globs will be injected here.
@@ -36,7 +38,7 @@ var allClientComponents = {
   __INJECTED_CLIENT_IMPORTERS__: null
 }; // Mock client component imports during testing
 
-if (typeof jest !== 'undefined') {
+if (META_ENV_DEV && typeof jest !== 'undefined') {
   global.allClientComponents = allClientComponents;
 }
 
@@ -44,7 +46,20 @@ function importClientComponent(moduleId) {
   var modImport = allClientComponents[moduleId];
 
   if (!modImport) {
-    return Promise.reject(new Error("Could not find client component " + moduleId));
+    var error = new Error("Could not find client component " + moduleId);
+
+    if (META_HOT) {
+      META_HOT.send('rsc:cc404', {
+        id: moduleId
+      });
+      return new Promise(function (_, reject) {
+        return setTimeout(function () {
+          return reject(error);
+        }, 200);
+      });
+    }
+
+    return Promise.reject(error);
   }
 
   return typeof modImport === 'function' ? modImport() : Promise.resolve(modImport);

package/dist/esnext/components/CartEstimatedCost/index.d.ts

@@ -1 +0,0 @@
-export { CartEstimatedCost } from './CartEstimatedCost.client';

package/dist/esnext/components/CartEstimatedCost/index.js

@@ -1 +0,0 @@
-export { CartEstimatedCost } from './CartEstimatedCost.client';

package/dist/esnext/hooks/useCountry/index.d.ts

@@ -1 +0,0 @@
-export { useCountry } from './useCountry';

package/dist/esnext/hooks/useCountry/index.js

@@ -1 +0,0 @@
-export { useCountry } from './useCountry';

package/dist/esnext/hooks/useCountry/useCountry.d.ts

@@ -1,7 +0,0 @@
-/**
- * The `useCountry` hook returns a tuple of the current localization country and a function for updating it.
- * It must be a descendent of a `LocalizationProvider` component.
- */
-export declare function useCountry(): (({
-    __typename?: "Country" | undefined;
-} & Pick<import("../../storefront-api-types").Country, "name" | "isoCode">) | undefined)[];

package/dist/esnext/hooks/useCountry/useCountry.js

@@ -1,17 +0,0 @@
-import { useContext } from 'react';
-import { LocalizationContext } from '../../components/LocalizationProvider/LocalizationContext.client';
-function useLocalization() {
-    const context = useContext(LocalizationContext);
-    if (context == null) {
-        throw new Error('No Localization Context available');
-    }
-    return context;
-}
-/**
- * The `useCountry` hook returns a tuple of the current localization country and a function for updating it.
- * It must be a descendent of a `LocalizationProvider` component.
- */
-export function useCountry() {
-    const context = useLocalization();
-    return [context.country];
-}